PluginProbe
User Profile Builder – Beautiful User Registration Forms, User Profiles & User Role Editor / 4.0.3
User Profile Builder – Beautiful User Registration Forms, User Profiles & User Role Editor v4.0.3
4.0.3 4.0.2 4.0.1 4.0.0 3.16.6 3.16.5 3.16.4 3.16.3 3.16.2 3.16.1 3.16.0 3.15.9 3.9.9 3.9.5 3.9.6 3.9.7 3.9.8 1.1.7 1.1.8 1.1.9 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 All 341 releases
profile-builder / form-builder / blocks / src / field-art / icons.js

icons.js in User Profile Builder – Beautiful User Registration Forms, User Profiles & User Role Editor 4.0.3, at form-builder/blocks/src/field-art/icons.js

689 lines 25.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Custom block icons (name → JSX). Stroke on ROOT; inline style beats editor `svg { fill }`.
3 */
4
5 // Inline fill/stroke: Gutenberg's `svg { fill: currentColor }` beats attributes.
6 const ROOT = {
7 width: 24,
8 height: 24,
9 viewBox: '0 0 24 24',
10 xmlns: 'http://www.w3.org/2000/svg',
11 strokeWidth: 1.5,
12 strokeLinecap: 'round',
13 strokeLinejoin: 'round',
14 style: { fill: 'none', stroke: 'currentColor' },
15 };
16
17 // Filled accents (radio dot, slider knobs, calendar day, progress fill, step
18 // marker). Inline style so the fill survives the same block-icon CSS.
19 const DOT = { style: { fill: 'currentColor', stroke: 'none' } };
20
21 export const FIELD_ICONS = {
22 /* ---------------------------------------------------------------- Default */
23
24 // Name (Heading) — person accent + title line over a section rule.
25 'profile-builder/field-default-name-heading': (
26 <svg { ...ROOT }>
27 <circle cx="6.3" cy="7.3" r="2.3" />
28 <path d="M3 12.8c0-1.9 1.5-3 3.3-3s3.3 1.1 3.3 3" />
29 <line x1="11.5" y1="8" x2="21" y2="8" />
30 <line x1="3" y1="18.5" x2="21" y2="18.5" />
31 </svg>
32 ),
33
34 // Contact Info (Heading) — envelope accent + title line over a rule.
35 'profile-builder/field-default-contact-info-heading': (
36 <svg { ...ROOT }>
37 <rect x="3" y="6" width="7.6" height="5.6" rx="1.2" />
38 <path d="M3.4 6.7 6.8 9.1 10.2 6.7" />
39 <line x1="12.4" y1="8.8" x2="21" y2="8.8" />
40 <line x1="3" y1="18.5" x2="21" y2="18.5" />
41 </svg>
42 ),
43
44 // About Yourself (Heading) — text-lines accent + title line over a rule.
45 'profile-builder/field-default-about-yourself-heading': (
46 <svg { ...ROOT }>
47 <line x1="3" y1="6.6" x2="9.5" y2="6.6" />
48 <line x1="3" y1="9.8" x2="9.5" y2="9.8" />
49 <line x1="12.4" y1="8.2" x2="21" y2="8.2" />
50 <line x1="3" y1="18.5" x2="21" y2="18.5" />
51 </svg>
52 ),
53
54 // Username — person inside an account ring.
55 'profile-builder/field-default-username': (
56 <svg { ...ROOT }>
57 <circle cx="12" cy="12" r="9" />
58 <circle cx="12" cy="9.6" r="2.8" />
59 <path d="M6.6 18.4c.8-2.3 2.9-3.6 5.4-3.6s4.6 1.3 5.4 3.6" />
60 </svg>
61 ),
62
63 // First Name — person over a single name line.
64 'profile-builder/field-default-first-name': (
65 <svg { ...ROOT }>
66 <circle cx="12" cy="7.3" r="3" />
67 <path d="M6 14.7c0-2.6 2.7-4.2 6-4.2s6 1.6 6 4.2" />
68 <line x1="7" y1="19.6" x2="17" y2="19.6" />
69 </svg>
70 ),
71
72 // Last Name — person over two name lines.
73 'profile-builder/field-default-last-name': (
74 <svg { ...ROOT }>
75 <circle cx="12" cy="6.8" r="2.9" />
76 <path d="M6.4 13.6c0-2.5 2.5-4 5.6-4s5.6 1.5 5.6 4" />
77 <line x1="7" y1="18.2" x2="17" y2="18.2" />
78 <line x1="9" y1="21" x2="15" y2="21" />
79 </svg>
80 ),
81
82 // Nickname — quotation marks.
83 'profile-builder/field-default-nickname': (
84 <svg { ...ROOT }>
85 <path d="M9 7.5C6.8 7.5 5 9.3 5 11.5 5 13.4 6.3 14.5 8 14.5c1 0 1.9-.7 1.9-1.8 0-1-.8-1.7-1.8-1.7-.3 0-.5 0-.7.1.2-1.4 1.3-2.5 2.6-2.6z" />
86 <path d="M18 7.5c-2.2 0-4 1.8-4 4 0 1.9 1.3 3 3 3 1 0 1.9-.7 1.9-1.8 0-1-.8-1.7-1.8-1.7-.3 0-.5 0-.7.1.2-1.4 1.3-2.5 2.6-2.6z" />
87 </svg>
88 ),
89
90 // E-mail (Default) — envelope.
91 'profile-builder/field-default-email': (
92 <svg { ...ROOT }>
93 <rect x="3" y="5.5" width="18" height="13" rx="2.5" />
94 <path d="M4 7.5 12 13 20 7.5" />
95 </svg>
96 ),
97
98 // Website — globe.
99 'profile-builder/field-default-website': (
100 <svg { ...ROOT }>
101 <circle cx="12" cy="12" r="8.5" />
102 <line x1="3.5" y1="12" x2="20.5" y2="12" />
103 <path d="M12 3.5c2.6 2.4 2.6 14.6 0 17" />
104 <path d="M12 3.5c-2.6 2.4-2.6 14.6 0 17" />
105 </svg>
106 ),
107
108 // Password — padlock.
109 'profile-builder/field-default-password': (
110 <svg { ...ROOT }>
111 <rect x="5" y="10" width="14" height="10.5" rx="2.3" />
112 <path d="M8 10V7.5a4 4 0 0 1 8 0V10" />
113 <circle cx="12" cy="14.5" r="1.2" { ...DOT } />
114 <line x1="12" y1="15.4" x2="12" y2="17.6" />
115 </svg>
116 ),
117
118 // Repeat Password — padlock with a confirmation check (a refresh roundel
119 // would be unintelligible at the 24px in-editor size). Body + shackle
120 // match the Password icon so they read as siblings.
121 'profile-builder/field-default-repeat-password': (
122 <svg { ...ROOT }>
123 <rect x="5" y="10" width="14" height="10.5" rx="2.3" />
124 <path d="M8 10V7.5a4 4 0 0 1 8 0V10" />
125 <path d="M9 15.2 11.2 17.4 15.2 13" />
126 </svg>
127 ),
128
129 // Biographical Info — open book.
130 'profile-builder/field-default-biographical-info': (
131 <svg { ...ROOT }>
132 <path d="M12 6c-1.8-1.3-4-2-6.5-2H3.5v13H6c2.4 0 4.5.7 6 2" />
133 <path d="M12 6c1.8-1.3 4-2 6.5-2h1.5v13H18c-2.4 0-4.5.7-6 2" />
134 <line x1="12" y1="6" x2="12" y2="19" />
135 </svg>
136 ),
137
138 // Display Name — ID badge with avatar + name lines.
139 'profile-builder/field-default-display-name': (
140 <svg { ...ROOT }>
141 <rect x="3" y="5" width="18" height="14" rx="2.3" />
142 <circle cx="8" cy="10" r="2" />
143 <path d="M5 16c0-1.7 1.3-3 3-3s3 1.3 3 3" />
144 <line x1="13.5" y1="9.5" x2="18" y2="9.5" />
145 <line x1="13.5" y1="13" x2="18" y2="13" />
146 </svg>
147 ),
148
149 // AIM — chat bubble with dots.
150 'profile-builder/field-default-aim': (
151 <svg { ...ROOT }>
152 <path d="M4 4.5h16a1.5 1.5 0 0 1 1.5 1.5v7.5A1.5 1.5 0 0 1 20 15H10l-4.5 4v-4H4a1.5 1.5 0 0 1-1.5-1.5V6A1.5 1.5 0 0 1 4 4.5z" />
153 <circle cx="8.5" cy="9.7" r="1" { ...DOT } />
154 <circle cx="12" cy="9.7" r="1" { ...DOT } />
155 <circle cx="15.5" cy="9.7" r="1" { ...DOT } />
156 </svg>
157 ),
158
159 // Yahoo IM — chat bubble with a smiley.
160 'profile-builder/field-default-yim': (
161 <svg { ...ROOT }>
162 <path d="M4 4.5h16a1.5 1.5 0 0 1 1.5 1.5v7.5A1.5 1.5 0 0 1 20 15H10l-4.5 4v-4H4a1.5 1.5 0 0 1-1.5-1.5V6A1.5 1.5 0 0 1 4 4.5z" />
163 <circle cx="9.6" cy="8.3" r="0.85" { ...DOT } />
164 <circle cx="14.4" cy="8.3" r="0.85" { ...DOT } />
165 <path d="M9.3 10.6a3.2 3.2 0 0 0 5.4 0" />
166 </svg>
167 ),
168
169 // Jabber / Google Talk — chat bubble with an "@".
170 'profile-builder/field-default-jabber': (
171 <svg { ...ROOT }>
172 <path d="M4 4.5h16a1.5 1.5 0 0 1 1.5 1.5v7.5A1.5 1.5 0 0 1 20 15H10l-4.5 4v-4H4a1.5 1.5 0 0 1-1.5-1.5V6A1.5 1.5 0 0 1 4 4.5z" />
173 <circle cx="11.8" cy="9.5" r="1.7" />
174 <path d="M13.5 9.5c0 1 .1 2 1.2 2 1 0 1.4-1 1.2-2.3-.3-1.8-2-2.7-3.6-2.4" />
175 </svg>
176 ),
177
178 /* --------------------------------------------------------------- Standard */
179
180 // Text — stacked text lines.
181 'profile-builder/field-input': (
182 <svg { ...ROOT }>
183 <line x1="4" y1="8" x2="20" y2="8" />
184 <line x1="4" y1="12" x2="20" y2="12" />
185 <line x1="4" y1="16" x2="13" y2="16" />
186 </svg>
187 ),
188
189 // Textarea — bordered multi-line box.
190 'profile-builder/field-textarea': (
191 <svg { ...ROOT }>
192 <rect x="3" y="5" width="18" height="14" rx="2" />
193 <line x1="6" y1="9" x2="18" y2="9" />
194 <line x1="6" y1="12" x2="18" y2="12" />
195 <line x1="6" y1="15" x2="13" y2="15" />
196 </svg>
197 ),
198
199 // Select — dropdown box with chevron.
200 'profile-builder/field-select': (
201 <svg { ...ROOT }>
202 <rect x="3" y="6" width="18" height="12" rx="2.5" />
203 <line x1="6.5" y1="12" x2="11.5" y2="12" />
204 <path d="M15 10.8 16.8 12.6 18.6 10.8" />
205 </svg>
206 ),
207
208 // Select (Multiple) — checklist.
209 'profile-builder/field-select-multiple': (
210 <svg { ...ROOT }>
211 <path d="M3.3 7 4.5 8.2 6.8 5.8" />
212 <path d="M3.3 12 4.5 13.2 6.8 10.8" />
213 <path d="M3.3 17 4.5 18.2 6.8 15.8" />
214 <line x1="9.5" y1="7" x2="20" y2="7" />
215 <line x1="9.5" y1="12" x2="20" y2="12" />
216 <line x1="9.5" y1="17" x2="20" y2="17" />
217 </svg>
218 ),
219
220 // Checkbox — box with tick.
221 'profile-builder/field-checkbox': (
222 <svg { ...ROOT }>
223 <rect x="4" y="4" width="16" height="16" rx="3.5" />
224 <path d="M8 12 10.6 14.6 16.2 9" />
225 </svg>
226 ),
227
228 // Radio — two options, top one selected.
229 'profile-builder/field-radio': (
230 <svg { ...ROOT }>
231 <circle cx="6.5" cy="8" r="2.7" />
232 <circle cx="6.5" cy="8" r="1.1" { ...DOT } />
233 <line x1="11" y1="8" x2="20" y2="8" />
234 <circle cx="6.5" cy="16" r="2.7" />
235 <line x1="11" y1="16" x2="20" y2="16" />
236 </svg>
237 ),
238
239 // Heading — letter H.
240 'profile-builder/field-heading': (
241 <svg { ...ROOT }>
242 <line x1="6" y1="5" x2="6" y2="19" />
243 <line x1="18" y1="5" x2="18" y2="19" />
244 <line x1="6" y1="12" x2="18" y2="12" />
245 </svg>
246 ),
247
248 // Avatar — framed person photo.
249 'profile-builder/field-avatar': (
250 <svg { ...ROOT }>
251 <rect x="3.5" y="3.5" width="17" height="17" rx="3.5" />
252 <circle cx="12" cy="10" r="2.8" />
253 <path d="M6.6 18c.8-2.4 3-3.8 5.4-3.8s4.6 1.4 5.4 3.8" />
254 </svg>
255 ),
256
257 // Number — hash.
258 'profile-builder/field-number': (
259 <svg { ...ROOT }>
260 <line x1="9.5" y1="4" x2="7.5" y2="20" />
261 <line x1="16.5" y1="4" x2="14.5" y2="20" />
262 <line x1="5" y1="9" x2="19" y2="9" />
263 <line x1="4" y1="15" x2="18" y2="15" />
264 </svg>
265 ),
266
267 // Input (Hidden) — eye with a slash.
268 'profile-builder/field-input-hidden': (
269 <svg { ...ROOT }>
270 <path d="M4 12s3.4-5.5 8-5.5 8 5.5 8 5.5-3.4 5.5-8 5.5c-1 0-2-.2-2.9-.5" />
271 <circle cx="12" cy="12" r="2.4" />
272 <line x1="4.5" y1="4.5" x2="19.5" y2="19.5" />
273 </svg>
274 ),
275
276 // Language — "A / 文" translate.
277 'profile-builder/field-language': (
278 <svg { ...ROOT }>
279 <path d="M3 13 6 5l3 8" />
280 <line x1="4" y1="10.5" x2="8" y2="10.5" />
281 <line x1="13" y1="6" x2="20.5" y2="6" />
282 <path d="M16.7 6v1.8c0 3-1.6 5.2-3.7 6.4" />
283 <path d="M14.8 9.6c.6 2.1 2.2 3.7 5.4 4.8" />
284 </svg>
285 ),
286
287 // WYSIWYG — editor with a toolbar.
288 'profile-builder/field-wysiwyg': (
289 <svg { ...ROOT }>
290 <rect x="3" y="4" width="18" height="16" rx="2" />
291 <line x1="3" y1="9" x2="21" y2="9" />
292 <line x1="6" y1="6.5" x2="8.5" y2="6.5" />
293 <line x1="11" y1="6.5" x2="13.5" y2="6.5" />
294 <line x1="6" y1="13" x2="18" y2="13" />
295 <line x1="6" y1="16.5" x2="14" y2="16.5" />
296 </svg>
297 ),
298
299 // HTML — code brackets.
300 'profile-builder/field-html': (
301 <svg { ...ROOT }>
302 <path d="M8.5 8 4.5 12 8.5 16" />
303 <path d="M15.5 8 19.5 12 15.5 16" />
304 <line x1="13.4" y1="6" x2="10.6" y2="18" />
305 </svg>
306 ),
307
308 // Upload — arrow into a tray.
309 'profile-builder/field-upload': (
310 <svg { ...ROOT }>
311 <path d="M12 15V4" />
312 <path d="M7.5 8.5 12 4 16.5 8.5" />
313 <path d="M5 15v3a1.5 1.5 0 0 0 1.5 1.5h11A1.5 1.5 0 0 0 19 18v-3" />
314 </svg>
315 ),
316
317 // International Telephone Input — handset + globe.
318 'profile-builder/field-international-telephone-input': (
319 <svg { ...ROOT }>
320 <path d="M3.6 4.4h2.3l1.2 3-1.5 1.1a8.5 8.5 0 0 0 3.9 3.9l1.1-1.5 3 1.2v2.3a1.6 1.6 0 0 1-1.6 1.6A11.5 11.5 0 0 1 2 6 1.6 1.6 0 0 1 3.6 4.4z" />
321 <circle cx="17.5" cy="6.5" r="3.6" />
322 <line x1="13.9" y1="6.5" x2="21.1" y2="6.5" />
323 <path d="M17.5 2.9c1.4 1.1 1.4 6.1 0 7.2" />
324 </svg>
325 ),
326
327 /* --------------------------------------------------------------- Advanced */
328
329 // Select2 — searchable dropdown.
330 'profile-builder/field-select2': (
331 <svg { ...ROOT }>
332 <rect x="3" y="6" width="18" height="12" rx="2.5" />
333 <circle cx="8.8" cy="11.4" r="2.3" />
334 <line x1="10.6" y1="13.2" x2="12.4" y2="15" />
335 <path d="M15.4 10.8 17.1 12.5 18.8 10.8" />
336 </svg>
337 ),
338
339 // Phone — handset.
340 'profile-builder/field-phone': (
341 <svg { ...ROOT }>
342 <path d="M6.5 3.5h2.8l1.4 4-2 1.5a11 11 0 0 0 4.8 4.8l1.5-2 4 1.4V20a2 2 0 0 1-2 2A15.5 15.5 0 0 1 4 6.5a2 2 0 0 1 2-2z" />
343 </svg>
344 ),
345
346 // Select (Country) — flag on a pole.
347 'profile-builder/field-select-country': (
348 <svg { ...ROOT }>
349 <line x1="6" y1="3" x2="6" y2="21" />
350 <path d="M6 4h12l-2.6 3.3L18 10.6H6z" />
351 </svg>
352 ),
353
354 // Select (Timezone) — world clock.
355 'profile-builder/field-select-timezone': (
356 <svg { ...ROOT }>
357 <circle cx="12" cy="12" r="8.3" />
358 <line x1="3.7" y1="12" x2="20.3" y2="12" />
359 <path d="M12 7v5l3.4 2" />
360 </svg>
361 ),
362
363 // Select (Currency) — coin with a currency mark.
364 'profile-builder/field-select-currency': (
365 <svg { ...ROOT }>
366 <circle cx="12" cy="12" r="8.3" />
367 <path d="M14.6 9.4c-.7-.8-1.7-1.2-2.7-1.2-1.5 0-2.6.8-2.6 2 0 1.3 1.1 1.8 2.6 2.1 1.5.3 2.7.8 2.7 2.1 0 1.2-1.1 2-2.7 2-1.1 0-2.1-.4-2.8-1.2" />
368 <line x1="12" y1="6" x2="12" y2="18" />
369 </svg>
370 ),
371
372 // Select (CPT) — document.
373 'profile-builder/field-select-cpt': (
374 <svg { ...ROOT }>
375 <path d="M7 3h7l4 4v13a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" />
376 <path d="M13.5 3v4h4" />
377 <line x1="9" y1="13" x2="15" y2="13" />
378 <line x1="9" y1="16.5" x2="13" y2="16.5" />
379 </svg>
380 ),
381
382 // Select (Taxonomy) — hierarchy tree.
383 'profile-builder/field-select-taxonomy': (
384 <svg { ...ROOT }>
385 <circle cx="5.5" cy="12" r="2" />
386 <circle cx="18.5" cy="6.5" r="2" />
387 <circle cx="18.5" cy="17.5" r="2" />
388 <path d="M7.5 12h4.5a1.5 1.5 0 0 0 1.5-1.5V8a1.5 1.5 0 0 1 1.5-1.5h1.5" />
389 <path d="M7.5 12h4.5a1.5 1.5 0 0 1 1.5 1.5V16a1.5 1.5 0 0 0 1.5 1.5h1.5" />
390 </svg>
391 ),
392
393 // Terms and Conditions — document with a check.
394 'profile-builder/field-checkbox-toa': (
395 <svg { ...ROOT }>
396 <rect x="5" y="3" width="14" height="18" rx="2" />
397 <line x1="8" y1="7.5" x2="16" y2="7.5" />
398 <line x1="8" y1="10.5" x2="16" y2="10.5" />
399 <line x1="8" y1="13.5" x2="12.5" y2="13.5" />
400 <path d="M8 17.3 9.4 18.7 13 15.2" />
401 </svg>
402 ),
403
404 // Datepicker — calendar with a marked day.
405 'profile-builder/field-datepicker': (
406 <svg { ...ROOT }>
407 <rect x="4" y="5.5" width="16" height="14.5" rx="2.5" />
408 <line x1="4" y1="9.5" x2="20" y2="9.5" />
409 <line x1="8.5" y1="3.5" x2="8.5" y2="7" />
410 <line x1="15.5" y1="3.5" x2="15.5" y2="7" />
411 <circle cx="9" cy="14" r="1.2" { ...DOT } />
412 </svg>
413 ),
414
415 // Timepicker — clock.
416 'profile-builder/field-timepicker': (
417 <svg { ...ROOT }>
418 <circle cx="12" cy="12" r="8.3" />
419 <path d="M12 7v5l3.5 2" />
420 </svg>
421 ),
422
423 // Colorpicker — paint droplet.
424 'profile-builder/field-colorpicker': (
425 <svg { ...ROOT }>
426 <path d="M12 3.5c3.2 3.8 5.2 6.4 5.2 9.2a5.2 5.2 0 0 1-10.4 0c0-2.8 2-5.4 5.2-9.2z" />
427 </svg>
428 ),
429
430 // Validation — clipboard with a check.
431 'profile-builder/field-validation': (
432 <svg { ...ROOT }>
433 <rect x="5" y="4.5" width="14" height="16.5" rx="2" />
434 <rect x="9" y="2.5" width="6" height="3.6" rx="1" />
435 <path d="M8.5 13 10.5 15 14.5 10.5" />
436 </svg>
437 ),
438
439 // Map — location pin.
440 'profile-builder/field-map': (
441 <svg { ...ROOT }>
442 <path d="M12 21c4.5-4.3 7-7.6 7-11a7 7 0 1 0-14 0c0 3.4 2.5 6.7 7 11z" />
443 <circle cx="12" cy="10" r="2.5" />
444 </svg>
445 ),
446
447 // Additional Map — pin with a plus.
448 'profile-builder/field-additional-map': (
449 <svg { ...ROOT }>
450 <path d="M9.5 18.6c3.4-3.3 5.3-5.8 5.3-8.4a5.3 5.3 0 1 0-10.6 0c0 2.6 1.9 5.1 5.3 8.4z" />
451 <circle cx="9.5" cy="10.2" r="1.9" />
452 <line x1="18.5" y1="4" x2="18.5" y2="9" />
453 <line x1="16" y1="6.5" x2="21" y2="6.5" />
454 </svg>
455 ),
456
457 // reCAPTCHA — circular arrow roundel with a check.
458 'profile-builder/field-recaptcha': (
459 <svg { ...ROOT }>
460 <path d="M19.2 12a7.2 7.2 0 1 1-2.1-5.1" />
461 <path d="M19.5 5v3.2h-3.2" />
462 <path d="M9 12.2 11 14.2 15 10" />
463 </svg>
464 ),
465
466 // Turnstile — cloud with a check.
467 'profile-builder/field-turnstile': (
468 <svg { ...ROOT }>
469 <path d="M7 17h9.6a3.5 3.5 0 0 0 .4-7 5 5 0 0 0-9.7-1.4A4 4 0 0 0 7 17z" />
470 <path d="M10 12.3 11.6 13.9 15 10.5" />
471 </svg>
472 ),
473
474 // Select (User Role) — person with a role shield.
475 'profile-builder/field-select-user-role': (
476 <svg { ...ROOT }>
477 <circle cx="9" cy="8" r="3" />
478 <path d="M3.5 18c0-3 2.5-5 5.5-5 .8 0 1.6.1 2.3.4" />
479 <path d="M17.5 11l3 1.2v2.2c0 1.9-1.3 3.4-3 3.9-1.7-.5-3-2-3-3.9v-2.2z" />
480 </svg>
481 ),
482
483 // Blog Details — browser window with article lines.
484 'profile-builder/field-default-blog-details': (
485 <svg { ...ROOT }>
486 <rect x="3" y="4" width="18" height="16" rx="2" />
487 <line x1="3" y1="8" x2="21" y2="8" />
488 <circle cx="5.6" cy="6" r="0.6" { ...DOT } />
489 <line x1="6" y1="12" x2="18" y2="12" />
490 <line x1="6" y1="15.5" x2="14" y2="15.5" />
491 </svg>
492 ),
493
494 // MailChimp Subscribe — envelope with a star.
495 'profile-builder/field-mailchimp-subscribe': (
496 <svg { ...ROOT }>
497 <rect x="3" y="6" width="14" height="11" rx="1.8" />
498 <path d="M3.4 7 10 11.5 16.6 7" />
499 <path d="M19 3 19.9 4.8 21.9 5.1 20.4 6.5 20.8 8.5 19 7.5 17.2 8.5 17.6 6.5 16.1 5.1 18.1 4.8z" />
500 </svg>
501 ),
502
503 // MailPoet Subscribe — envelope with a leaf.
504 'profile-builder/field-mailpoet-subscribe': (
505 <svg { ...ROOT }>
506 <rect x="3" y="6" width="14" height="11" rx="1.8" />
507 <path d="M3.4 7 10 11.5 16.6 7" />
508 <path d="M21.5 3.5c-3 0-5 1.8-5 4 0 .7.2 1.2.6 1.7 2-1 3.8-3 4.4-5.7z" />
509 <path d="M17.2 9c.8-1.3 2.1-2.6 4.3-4.5" />
510 </svg>
511 ),
512
513 // Campaign Monitor Subscribe — envelope with a bar chart.
514 'profile-builder/field-campaign-monitor-subscribe': (
515 <svg { ...ROOT }>
516 <rect x="3" y="6" width="14" height="11" rx="1.8" />
517 <path d="M3.4 7 10 11.5 16.6 7" />
518 <line x1="16.8" y1="8" x2="16.8" y2="4" />
519 <line x1="19.4" y1="8" x2="19.4" y2="3" />
520 <line x1="22" y1="8" x2="22" y2="5.5" />
521 </svg>
522 ),
523
524 // WooCommerce Billing Address — credit card.
525 'profile-builder/field-woo-billing-address': (
526 <svg { ...ROOT }>
527 <rect x="3" y="6" width="18" height="12" rx="2" />
528 <line x1="3" y1="10" x2="21" y2="10" />
529 <line x1="6" y1="14" x2="11" y2="14" />
530 </svg>
531 ),
532
533 // WooCommerce Shipping Address — package box.
534 'profile-builder/field-woo-shipping-address': (
535 <svg { ...ROOT }>
536 <path d="M12 3 20 7v9l-8 4-8-4V7z" />
537 <path d="M4 7 12 11 20 7" />
538 <line x1="12" y1="11" x2="12" y2="20" />
539 </svg>
540 ),
541
542 /* ------------------------------------------------------------------ Other */
543
544 // Email (custom) — at sign.
545 'profile-builder/field-email': (
546 <svg { ...ROOT }>
547 <circle cx="12" cy="12" r="3.2" />
548 <path d="M15.2 12c0 1.1.1 3 2 3 1.7 0 2.6-1.6 2.6-3.8 0-4.2-3.1-6.7-6.9-6.7a8 8 0 1 0 4.4 14.7" />
549 </svg>
550 ),
551
552 // Email Confirmation — envelope with a check badge.
553 'profile-builder/field-email-confirmation': (
554 <svg { ...ROOT }>
555 <rect x="2.5" y="5.5" width="14" height="11" rx="2" />
556 <path d="M3 6.5 9.5 11 16 6.5" />
557 <circle cx="18" cy="16" r="4" />
558 <path d="M16.3 16 17.5 17.2 19.8 14.8" />
559 </svg>
560 ),
561
562 // GDPR Checkbox — shield with a check.
563 'profile-builder/field-gdpr-checkbox': (
564 <svg { ...ROOT }>
565 <path d="M12 3 19 5.5v5c0 4.5-3 8-7 9.5-4-1.5-7-5-7-9.5v-5z" />
566 <path d="M8.8 12 11 14.2 15.2 9.8" />
567 </svg>
568 ),
569
570 // GDPR Communication Preferences — sliders.
571 'profile-builder/field-gdpr-communication-preferences': (
572 <svg { ...ROOT }>
573 <line x1="4" y1="7" x2="20" y2="7" />
574 <circle cx="9" cy="7" r="2.2" { ...DOT } />
575 <line x1="4" y1="12" x2="20" y2="12" />
576 <circle cx="15" cy="12" r="2.2" { ...DOT } />
577 <line x1="4" y1="17" x2="20" y2="17" />
578 <circle cx="11" cy="17" r="2.2" { ...DOT } />
579 </svg>
580 ),
581
582 // Subscription Plans (PMS) — pricing tiers of increasing height (premium filled).
583 'profile-builder/field-pms-subscription-plans': (
584 <svg { ...ROOT }>
585 <rect x="3.5" y="13" width="4.4" height="6" rx="1" />
586 <rect x="9.8" y="9" width="4.4" height="10" rx="1" />
587 <rect x="16.1" y="5" width="4.4" height="14" rx="1" { ...DOT } />
588 </svg>
589 ),
590
591 // Billing Fields (PMS) — a receipt with a torn zigzag bottom edge.
592 'profile-builder/field-pms-billing-fields': (
593 <svg { ...ROOT }>
594 <path d="M6 4h12v16l-2-1.3-2 1.3-2-1.3-2 1.3-2-1.3-2 1.3z" />
595 <line x1="9" y1="8.5" x2="15" y2="8.5" />
596 <line x1="9" y1="12" x2="15" y2="12" />
597 </svg>
598 ),
599
600 // GDPR Delete Button — trash can.
601 'profile-builder/field-gdpr-delete': (
602 <svg { ...ROOT }>
603 <line x1="5" y1="7" x2="19" y2="7" />
604 <path d="M9 7V5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2" />
605 <path d="M6.5 7l.8 12a1.5 1.5 0 0 0 1.5 1.4h6.4a1.5 1.5 0 0 0 1.5-1.4L17.5 7" />
606 <line x1="10" y1="10.5" x2="10" y2="16.5" />
607 <line x1="14" y1="10.5" x2="14" y2="16.5" />
608 </svg>
609 ),
610
611 // Honeypot — a bug (anti-spam trap).
612 'profile-builder/field-honeypot': (
613 <svg { ...ROOT }>
614 <ellipse cx="12" cy="13.5" rx="4.3" ry="5.5" />
615 <line x1="12" y1="8.5" x2="12" y2="19" />
616 <circle cx="12" cy="6.4" r="2" />
617 <line x1="10.6" y1="5" x2="9.2" y2="3.6" />
618 <line x1="13.4" y1="5" x2="14.8" y2="3.6" />
619 <line x1="7.8" y1="11" x2="4.6" y2="9.5" />
620 <line x1="7.5" y1="13.5" x2="4" y2="13.5" />
621 <line x1="7.8" y1="16" x2="4.6" y2="17.5" />
622 <line x1="16.2" y1="11" x2="19.4" y2="9.5" />
623 <line x1="16.5" y1="13.5" x2="20" y2="13.5" />
624 <line x1="16.2" y1="16" x2="19.4" y2="17.5" />
625 </svg>
626 ),
627
628 // URL — chain link. Both hooks are 180deg rotations of each other about the
629 // 24x24 centre and their semicircular caps sit ON the 45deg axis, so the
630 // connector bar runs straight through the middle of both openings.
631 'profile-builder/field-input-url': (
632 <svg { ...ROOT }>
633 <path d="M9.4 14.6 14.6 9.4" />
634 <path d="M10.7 6.7 12.7 4.8a4.65 4.65 0 0 1 6.58 6.58l-1.97 1.97" />
635 <path d="M13.3 17.3 11.3 19.2a4.65 4.65 0 0 1-6.58-6.58l1.97-1.97" />
636 </svg>
637 ),
638
639 // Select2 (Multiple) — a field holding two selected chips, wrapped onto two
640 // rows. Each chip is a true pill (width well over its height) — at the old
641 // 5.3x5 with rx 2.5 they were circles side by side and the icon read as
642 // goggles. Chips align left like real wrapped chips, but their combined
643 // bounds are centred in the frame on BOTH axes (x 5.5-18.5, y 6.6-17.4).
644 'profile-builder/field-select2-multiple': (
645 <svg { ...ROOT }>
646 <rect x="3" y="4" width="18" height="16" rx="2.2" />
647 <rect x="5.5" y="6.6" width="13" height="4.2" rx="2.1" />
648 <rect x="5.5" y="13.2" width="8" height="4.2" rx="2.1" />
649 </svg>
650 ),
651
652 // Repeater — overlapping cards (repeating group).
653 'profile-builder/field-repeater': (
654 <svg { ...ROOT }>
655 <rect x="8" y="3.5" width="12.5" height="12.5" rx="2.2" />
656 <path d="M16 16v2.3a2.2 2.2 0 0 1-2.2 2.2H5.7a2.2 2.2 0 0 1-2.2-2.2V10.2A2.2 2.2 0 0 1 5.7 8H8" />
657 </svg>
658 ),
659
660 /* ------------------------------------------------------------- Structural */
661
662 // Step Break — connected step nodes (current step filled).
663 'profile-builder/msf-step-break': (
664 <svg { ...ROOT }>
665 <circle cx="4.6" cy="12" r="2.1" />
666 <line x1="7" y1="12" x2="10" y2="12" />
667 <circle cx="12" cy="12" r="2.1" { ...DOT } />
668 <line x1="14" y1="12" x2="17" y2="12" />
669 <circle cx="19.4" cy="12" r="2.1" />
670 </svg>
671 ),
672
673 // Columns — two columns side by side.
674 'profile-builder/ffc-columns': (
675 <svg { ...ROOT }>
676 <rect x="3.5" y="5" width="7" height="14" rx="1.5" />
677 <rect x="13.5" y="5" width="7" height="14" rx="1.5" />
678 </svg>
679 ),
680
681 // Progress Bar — track with a partial fill.
682 'profile-builder/progress-bar': (
683 <svg { ...ROOT }>
684 <rect x="3" y="9.5" width="18" height="5" rx="2.5" />
685 <rect x="5" y="11.1" width="7" height="1.8" rx="0.9" { ...DOT } />
686 </svg>
687 ),
688 };
689