@deriv-web-design/ui 0.1.4 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -61,6 +61,83 @@
61
61
  ],
62
62
  "defaultValues": {
63
63
  "featuredFooter": []
64
+ },
65
+ "fields": {
66
+ "featured": {
67
+ "type": "object",
68
+ "required": true,
69
+ "itemFields": {
70
+ "summary": {
71
+ "type": "string",
72
+ "required": false,
73
+ "maxLength": 250
74
+ },
75
+ "tags": {
76
+ "type": "array",
77
+ "required": false
78
+ },
79
+ "thumbnail": {
80
+ "type": "image",
81
+ "required": false
82
+ },
83
+ "thumbnailAlt": {
84
+ "type": "string",
85
+ "required": false,
86
+ "maxLength": 120
87
+ },
88
+ "title": {
89
+ "type": "string",
90
+ "required": true,
91
+ "maxLength": 100
92
+ }
93
+ }
94
+ },
95
+ "featuredFooter": {
96
+ "type": "array",
97
+ "required": false,
98
+ "itemFields": {
99
+ "tags": {
100
+ "type": "array",
101
+ "required": false
102
+ },
103
+ "title": {
104
+ "type": "string",
105
+ "required": true,
106
+ "maxLength": 100
107
+ }
108
+ },
109
+ "default": []
110
+ },
111
+ "leftColumn": {
112
+ "type": "object",
113
+ "required": true,
114
+ "itemFields": {
115
+ "articles": {
116
+ "type": "array",
117
+ "required": true
118
+ },
119
+ "label": {
120
+ "type": "string",
121
+ "required": false,
122
+ "maxLength": 30
123
+ }
124
+ }
125
+ },
126
+ "rightColumn": {
127
+ "type": "object",
128
+ "required": true,
129
+ "itemFields": {
130
+ "articles": {
131
+ "type": "array",
132
+ "required": true
133
+ },
134
+ "label": {
135
+ "type": "string",
136
+ "required": false,
137
+ "maxLength": 30
138
+ }
139
+ }
140
+ }
64
141
  }
65
142
  },
66
143
  "article-section-featured": {
@@ -129,6 +206,325 @@
129
206
  "defaultValues": {
130
207
  "variant": "featured",
131
208
  "linkText": "View all articles"
209
+ },
210
+ "fields": {
211
+ "articles": {
212
+ "type": "array",
213
+ "required": true,
214
+ "itemFields": {
215
+ "summary": {
216
+ "type": "string",
217
+ "required": false,
218
+ "maxLength": 250
219
+ },
220
+ "tags": {
221
+ "type": "array",
222
+ "required": false
223
+ },
224
+ "thumbnail": {
225
+ "type": "image",
226
+ "required": false
227
+ },
228
+ "thumbnailAlt": {
229
+ "type": "string",
230
+ "required": false,
231
+ "maxLength": 120
232
+ },
233
+ "title": {
234
+ "type": "string",
235
+ "required": true,
236
+ "maxLength": 100
237
+ }
238
+ }
239
+ },
240
+ "featured": {
241
+ "type": "object",
242
+ "required": false,
243
+ "itemFields": {
244
+ "summary": {
245
+ "type": "string",
246
+ "required": false,
247
+ "maxLength": 250
248
+ },
249
+ "tags": {
250
+ "type": "array",
251
+ "required": false
252
+ },
253
+ "thumbnail": {
254
+ "type": "image",
255
+ "required": false
256
+ },
257
+ "thumbnailAlt": {
258
+ "type": "string",
259
+ "required": false,
260
+ "maxLength": 120
261
+ },
262
+ "title": {
263
+ "type": "string",
264
+ "required": true,
265
+ "maxLength": 100
266
+ }
267
+ }
268
+ },
269
+ "linkText": {
270
+ "type": "string",
271
+ "required": false,
272
+ "maxLength": 30,
273
+ "default": "View all articles"
274
+ },
275
+ "sectionTitle": {
276
+ "type": "string",
277
+ "required": true,
278
+ "maxLength": 60
279
+ },
280
+ "variant": {
281
+ "type": "string",
282
+ "required": false,
283
+ "enum": [
284
+ "featured",
285
+ "showcase",
286
+ "grid"
287
+ ],
288
+ "default": "featured"
289
+ }
290
+ }
291
+ },
292
+ "breadcrumb-trail": {
293
+ "id": "breadcrumb-trail",
294
+ "name": "Breadcrumb",
295
+ "component": "Breadcrumb",
296
+ "category": "navigation",
297
+ "description": "Hierarchy navigation trail for interior pages such as About / Who we are.",
298
+ "purpose": "Hierarchy navigation trail that shows the user's location and provides a quick path back to parent pages. Typically placed under the Navbar on interior pages.",
299
+ "keywords": [
300
+ "breadcrumb",
301
+ "navigation",
302
+ "hierarchy",
303
+ "path",
304
+ "trail",
305
+ "interior",
306
+ "about",
307
+ "who-we-are",
308
+ "deriv"
309
+ ],
310
+ "sectionType": "navigation",
311
+ "global": false,
312
+ "requiredFields": [
313
+ "items"
314
+ ],
315
+ "optionalFields": [
316
+ "size",
317
+ "collapsible"
318
+ ],
319
+ "variants": [
320
+ "sm",
321
+ "md"
322
+ ],
323
+ "recommendedPosition": 1,
324
+ "placement": [],
325
+ "layout": {
326
+ "alignment": "start",
327
+ "buttonLayout": "none",
328
+ "contentWidth": "wide",
329
+ "background": false,
330
+ "overlay": false
331
+ },
332
+ "supports": {
333
+ "backgroundImage": false,
334
+ "backgroundVideo": false,
335
+ "foregroundImage": false,
336
+ "primaryButton": false,
337
+ "secondaryButton": false,
338
+ "collapsible": true
339
+ },
340
+ "imageRoles": [],
341
+ "defaultValues": {
342
+ "size": "md",
343
+ "collapsible": true,
344
+ "items": [
345
+ {
346
+ "label": "Home",
347
+ "href": "/"
348
+ },
349
+ {
350
+ "label": "Who we are"
351
+ }
352
+ ]
353
+ },
354
+ "fields": {
355
+ "collapsible": {
356
+ "type": "boolean",
357
+ "required": false,
358
+ "default": true
359
+ },
360
+ "items": {
361
+ "type": "array",
362
+ "required": true,
363
+ "itemFields": {
364
+ "href": {
365
+ "type": "url",
366
+ "required": false
367
+ },
368
+ "label": {
369
+ "type": "string",
370
+ "required": true,
371
+ "maxLength": 60
372
+ }
373
+ }
374
+ },
375
+ "size": {
376
+ "type": "string",
377
+ "required": false,
378
+ "enum": [
379
+ "sm",
380
+ "md"
381
+ ],
382
+ "default": "md"
383
+ }
384
+ }
385
+ },
386
+ "coral-banner-static": {
387
+ "id": "coral-banner-static",
388
+ "name": "Coral Banner",
389
+ "component": "CoralBanner",
390
+ "category": "cta",
391
+ "description": "Full-bleed coral promo banner with a headline, description, and single CTA. Static single-slide variant, or a carousel variant with dot pagination and prev/next arrows — matches the banner used on deriv.com and deriv.com/markets/forex.",
392
+ "purpose": "Full-bleed coral promo banner with a bold headline, short description, and a single dark CTA button. Available as a single static slide, or as a swipeable, auto-advancing carousel with dot pagination and prev/next arrows. This block reproduces the \"Join 3M+ global traders\" banner used on the deriv.com homepage and as the footer promo slider on deriv.com/markets/forex — same coral background, typography scale, button style, and (in `carousel` mode) the exact slide-transition timing, easing, dot, and arrow styling from the reference site.",
393
+ "keywords": [
394
+ "cta",
395
+ "banner",
396
+ "promo",
397
+ "promotion",
398
+ "coral",
399
+ "carousel",
400
+ "slider",
401
+ "trade now",
402
+ "download app",
403
+ "open account",
404
+ "trading",
405
+ "forex",
406
+ "deriv"
407
+ ],
408
+ "sectionType": "cta",
409
+ "global": false,
410
+ "requiredFields": [],
411
+ "optionalFields": [
412
+ "variant",
413
+ "slides",
414
+ "autoplay",
415
+ "autoplayDelay",
416
+ "transitionDuration",
417
+ "infinite",
418
+ "showArrows",
419
+ "showDots"
420
+ ],
421
+ "variants": [
422
+ "static",
423
+ "carousel"
424
+ ],
425
+ "recommendedPosition": 8,
426
+ "placement": [
427
+ "top",
428
+ "middle",
429
+ "bottom"
430
+ ],
431
+ "layout": {
432
+ "alignment": "left",
433
+ "buttonLayout": "single",
434
+ "contentWidth": "wide",
435
+ "background": true,
436
+ "overlay": false
437
+ },
438
+ "supports": {
439
+ "backgroundImage": false,
440
+ "backgroundVideo": false,
441
+ "foregroundImage": false,
442
+ "primaryButton": true,
443
+ "secondaryButton": true,
444
+ "multipleSlides": true,
445
+ "autoplay": true,
446
+ "swipe": true
447
+ },
448
+ "imageRoles": [],
449
+ "defaultValues": {
450
+ "variant": "static",
451
+ "autoplay": true,
452
+ "autoplayDelay": 2000,
453
+ "transitionDuration": 330,
454
+ "infinite": true,
455
+ "showArrows": true,
456
+ "showDots": true
457
+ },
458
+ "fields": {
459
+ "autoplay": {
460
+ "type": "boolean",
461
+ "required": false,
462
+ "default": true
463
+ },
464
+ "autoplayDelay": {
465
+ "type": "number",
466
+ "required": false,
467
+ "min": 500,
468
+ "default": 2000
469
+ },
470
+ "infinite": {
471
+ "type": "boolean",
472
+ "required": false,
473
+ "default": true
474
+ },
475
+ "showArrows": {
476
+ "type": "boolean",
477
+ "required": false,
478
+ "default": true
479
+ },
480
+ "showDots": {
481
+ "type": "boolean",
482
+ "required": false,
483
+ "default": true
484
+ },
485
+ "slides": {
486
+ "type": "array",
487
+ "required": false,
488
+ "itemFields": {
489
+ "description": {
490
+ "type": "string",
491
+ "required": false,
492
+ "maxLength": 160
493
+ },
494
+ "id": {
495
+ "type": "string",
496
+ "required": false
497
+ },
498
+ "primaryButton": {
499
+ "type": "object",
500
+ "required": false
501
+ },
502
+ "secondaryButton": {
503
+ "type": "object",
504
+ "required": false
505
+ },
506
+ "title": {
507
+ "type": "string",
508
+ "required": true,
509
+ "maxLength": 80
510
+ }
511
+ }
512
+ },
513
+ "transitionDuration": {
514
+ "type": "number",
515
+ "required": false,
516
+ "min": 0,
517
+ "default": 330
518
+ },
519
+ "variant": {
520
+ "type": "string",
521
+ "required": false,
522
+ "enum": [
523
+ "static",
524
+ "carousel"
525
+ ],
526
+ "default": "static"
527
+ }
132
528
  }
133
529
  },
134
530
  "cta-banner-standard": {
@@ -198,6 +594,65 @@
198
594
  "ctaLabel": "Open account",
199
595
  "ctaHref": "#",
200
596
  "variant": "standard"
597
+ },
598
+ "fields": {
599
+ "avatars": {
600
+ "type": "array",
601
+ "required": false,
602
+ "itemFields": {
603
+ "desktopPos": {
604
+ "type": "object",
605
+ "required": true
606
+ },
607
+ "id": {
608
+ "type": "number",
609
+ "required": true
610
+ },
611
+ "imageUrl": {
612
+ "type": "image",
613
+ "required": true,
614
+ "aspectRatio": "1:1"
615
+ },
616
+ "mobilePos": {
617
+ "type": "object",
618
+ "required": false
619
+ },
620
+ "mobileVisible": {
621
+ "type": "boolean",
622
+ "required": true
623
+ },
624
+ "staggerRank": {
625
+ "type": "number",
626
+ "required": true
627
+ }
628
+ }
629
+ },
630
+ "ctaHref": {
631
+ "type": "url",
632
+ "required": false,
633
+ "default": "#"
634
+ },
635
+ "ctaLabel": {
636
+ "type": "string",
637
+ "required": false,
638
+ "maxLength": 30,
639
+ "default": "Open account"
640
+ },
641
+ "headline": {
642
+ "type": "string",
643
+ "required": false,
644
+ "maxLength": 80,
645
+ "default": "Short section title goes here"
646
+ },
647
+ "variant": {
648
+ "type": "string",
649
+ "required": false,
650
+ "enum": [
651
+ "standard",
652
+ "compact"
653
+ ],
654
+ "default": "standard"
655
+ }
201
656
  }
202
657
  },
203
658
  "day-night-transition": {
@@ -280,6 +735,106 @@
280
735
  "headlineLevel": "h2",
281
736
  "descriptionLevel": "body-md",
282
737
  "scrollPreset": "default"
738
+ },
739
+ "fields": {
740
+ "ctaHref": {
741
+ "type": "url",
742
+ "required": false,
743
+ "default": "#"
744
+ },
745
+ "ctaLabel": {
746
+ "type": "string",
747
+ "required": false,
748
+ "maxLength": 30,
749
+ "default": "Get started"
750
+ },
751
+ "dayDescription": {
752
+ "type": "string",
753
+ "required": false,
754
+ "maxLength": 200,
755
+ "default": "Description goes here. Description goes here. Description goes here."
756
+ },
757
+ "dayHeadline": {
758
+ "type": "string",
759
+ "required": false,
760
+ "maxLength": 80,
761
+ "default": "Medium length section title goes here"
762
+ },
763
+ "dayImageUrl": {
764
+ "type": "image",
765
+ "required": true,
766
+ "aspectRatio": "16:9"
767
+ },
768
+ "descriptionLevel": {
769
+ "type": "string",
770
+ "required": false,
771
+ "enum": [
772
+ "body-md",
773
+ "body-lg"
774
+ ],
775
+ "default": "body-md"
776
+ },
777
+ "headlineLevel": {
778
+ "type": "string",
779
+ "required": false,
780
+ "enum": [
781
+ "h1",
782
+ "h2"
783
+ ],
784
+ "default": "h2"
785
+ },
786
+ "hideCta": {
787
+ "type": "boolean",
788
+ "required": false,
789
+ "default": false
790
+ },
791
+ "inlineDayNightHeadline": {
792
+ "type": "object",
793
+ "required": false,
794
+ "itemFields": {
795
+ "dayWord": {
796
+ "type": "string",
797
+ "required": true,
798
+ "maxLength": 20
799
+ },
800
+ "nightWord": {
801
+ "type": "string",
802
+ "required": true,
803
+ "maxLength": 20
804
+ },
805
+ "prefix": {
806
+ "type": "string",
807
+ "required": true,
808
+ "maxLength": 40
809
+ }
810
+ }
811
+ },
812
+ "nightDescription": {
813
+ "type": "string",
814
+ "required": false,
815
+ "maxLength": 200,
816
+ "default": "Description goes here. Description goes here. Description goes here."
817
+ },
818
+ "nightHeadline": {
819
+ "type": "string",
820
+ "required": false,
821
+ "maxLength": 80,
822
+ "default": "Medium length section title goes here"
823
+ },
824
+ "nightImageUrl": {
825
+ "type": "image",
826
+ "required": true,
827
+ "aspectRatio": "16:9"
828
+ },
829
+ "scrollPreset": {
830
+ "type": "string",
831
+ "required": false,
832
+ "enum": [
833
+ "default",
834
+ "webflow-day-night-v2"
835
+ ],
836
+ "default": "default"
837
+ }
283
838
  }
284
839
  },
285
840
  "download-banner-light-2": {
@@ -375,6 +930,115 @@
375
930
  "showMacOS": true,
376
931
  "showLinux": true,
377
932
  "showWeb": true
933
+ },
934
+ "fields": {
935
+ "appGalleryHref": {
936
+ "type": "url",
937
+ "required": false
938
+ },
939
+ "appStoreHref": {
940
+ "type": "url",
941
+ "required": false
942
+ },
943
+ "disclaimer": {
944
+ "type": "string",
945
+ "required": false,
946
+ "maxLength": 200
947
+ },
948
+ "googlePlayHref": {
949
+ "type": "url",
950
+ "required": false
951
+ },
952
+ "linuxHref": {
953
+ "type": "url",
954
+ "required": false
955
+ },
956
+ "macOSHref": {
957
+ "type": "url",
958
+ "required": false
959
+ },
960
+ "mobileTitle": {
961
+ "type": "string",
962
+ "required": false,
963
+ "maxLength": 30,
964
+ "default": "Available on"
965
+ },
966
+ "qrCodeAlt": {
967
+ "type": "string",
968
+ "required": false,
969
+ "maxLength": 120,
970
+ "default": "QR code to download the app"
971
+ },
972
+ "qrCodeImage": {
973
+ "type": "image",
974
+ "required": false,
975
+ "aspectRatio": "1:1"
976
+ },
977
+ "qrSubtitle": {
978
+ "type": "string",
979
+ "required": false,
980
+ "maxLength": 40,
981
+ "default": "Android & iOS"
982
+ },
983
+ "qrTitle": {
984
+ "type": "string",
985
+ "required": false,
986
+ "maxLength": 30,
987
+ "default": "Scan to download"
988
+ },
989
+ "showAppGallery": {
990
+ "type": "boolean",
991
+ "required": false,
992
+ "default": true
993
+ },
994
+ "showAppStore": {
995
+ "type": "boolean",
996
+ "required": false,
997
+ "default": true
998
+ },
999
+ "showGooglePlay": {
1000
+ "type": "boolean",
1001
+ "required": false,
1002
+ "default": true
1003
+ },
1004
+ "showLinux": {
1005
+ "type": "boolean",
1006
+ "required": false,
1007
+ "default": true
1008
+ },
1009
+ "showMacOS": {
1010
+ "type": "boolean",
1011
+ "required": false,
1012
+ "default": true
1013
+ },
1014
+ "showWeb": {
1015
+ "type": "boolean",
1016
+ "required": false,
1017
+ "default": true
1018
+ },
1019
+ "showWindows": {
1020
+ "type": "boolean",
1021
+ "required": false,
1022
+ "default": true
1023
+ },
1024
+ "style": {
1025
+ "type": "string",
1026
+ "required": false,
1027
+ "enum": [
1028
+ "light",
1029
+ "light-2",
1030
+ "dark"
1031
+ ],
1032
+ "default": "light-2"
1033
+ },
1034
+ "webHref": {
1035
+ "type": "url",
1036
+ "required": false
1037
+ },
1038
+ "windowsHref": {
1039
+ "type": "url",
1040
+ "required": false
1041
+ }
378
1042
  }
379
1043
  },
380
1044
  "faq-accordion-white": {
@@ -436,6 +1100,131 @@
436
1100
  "imageRoles": [],
437
1101
  "defaultValues": {
438
1102
  "colorScheme": "white"
1103
+ },
1104
+ "fields": {
1105
+ "colorScheme": {
1106
+ "type": "string",
1107
+ "required": false,
1108
+ "enum": [
1109
+ "white",
1110
+ "slate"
1111
+ ],
1112
+ "default": "white"
1113
+ },
1114
+ "items": {
1115
+ "type": "array",
1116
+ "required": true,
1117
+ "itemFields": {
1118
+ "answer": {
1119
+ "type": "string",
1120
+ "required": true,
1121
+ "maxLength": 500
1122
+ },
1123
+ "question": {
1124
+ "type": "string",
1125
+ "required": true,
1126
+ "maxLength": 120
1127
+ }
1128
+ }
1129
+ },
1130
+ "title": {
1131
+ "type": "string",
1132
+ "required": true,
1133
+ "maxLength": 80
1134
+ }
1135
+ }
1136
+ },
1137
+ "feature-awards": {
1138
+ "id": "feature-awards",
1139
+ "name": "Feature Awards",
1140
+ "component": "FeatureAwards",
1141
+ "category": "social-proof",
1142
+ "description": "Light section listing industry awards and recognitions as laurel-flanked badges — a centered, wrapping grid on tablet/desktop, and a continuously auto-scrolling horizontal marquee on mobile.",
1143
+ "purpose": "A light-background social-proof section that showcases industry awards and recognitions as laurel-flanked badges (icon — title/issuer text — mirrored icon). On tablet and desktop the badges wrap into a centered grid; on mobile they play as a single, continuously auto-scrolling horizontal row. Modeled after the \"Our awards\" section on [deriv.com/why-choose-us](https://deriv.com/why-choose-us).",
1144
+ "keywords": [
1145
+ "awards",
1146
+ "recognition",
1147
+ "trust",
1148
+ "social-proof",
1149
+ "credibility",
1150
+ "laurel",
1151
+ "wreath",
1152
+ "badges",
1153
+ "press",
1154
+ "accolades",
1155
+ "trading",
1156
+ "forex",
1157
+ "deriv",
1158
+ "why-choose-us"
1159
+ ],
1160
+ "sectionType": "social-proof",
1161
+ "global": false,
1162
+ "requiredFields": [],
1163
+ "optionalFields": [
1164
+ "title",
1165
+ "awards",
1166
+ "autoScrollDuration"
1167
+ ],
1168
+ "variants": [
1169
+ "default"
1170
+ ],
1171
+ "recommendedPosition": 3,
1172
+ "placement": [
1173
+ "top",
1174
+ "middle"
1175
+ ],
1176
+ "layout": {
1177
+ "alignment": "center",
1178
+ "buttonLayout": "none",
1179
+ "contentWidth": "wide",
1180
+ "background": false,
1181
+ "overlay": false,
1182
+ "carousel": true
1183
+ },
1184
+ "supports": {
1185
+ "backgroundImage": false,
1186
+ "backgroundVideo": false,
1187
+ "primaryButton": false,
1188
+ "secondaryButton": false,
1189
+ "ctaLink": false,
1190
+ "disclaimer": false,
1191
+ "autoScroll": true,
1192
+ "editableText": true
1193
+ },
1194
+ "imageRoles": [],
1195
+ "defaultValues": {
1196
+ "title": "Our awards",
1197
+ "autoScrollDuration": 32
1198
+ },
1199
+ "fields": {
1200
+ "autoScrollDuration": {
1201
+ "type": "number",
1202
+ "required": false,
1203
+ "min": 10,
1204
+ "max": 120,
1205
+ "default": 32
1206
+ },
1207
+ "awards": {
1208
+ "type": "array",
1209
+ "required": false,
1210
+ "itemFields": {
1211
+ "subtitle": {
1212
+ "type": "string",
1213
+ "required": true,
1214
+ "maxLength": 60
1215
+ },
1216
+ "title": {
1217
+ "type": "string",
1218
+ "required": true,
1219
+ "maxLength": 80
1220
+ }
1221
+ }
1222
+ },
1223
+ "title": {
1224
+ "type": "string",
1225
+ "required": false,
1226
+ "maxLength": 60
1227
+ }
439
1228
  }
440
1229
  },
441
1230
  "feature-bullets-image-right": {
@@ -500,6 +1289,33 @@
500
1289
  "defaultValues": {
501
1290
  "imageAlt": "",
502
1291
  "imagePosition": "right"
1292
+ },
1293
+ "fields": {
1294
+ "bullets": {
1295
+ "type": "array",
1296
+ "required": true
1297
+ },
1298
+ "image": {
1299
+ "type": "image",
1300
+ "required": true,
1301
+ "aspectRatio": "1:1"
1302
+ },
1303
+ "imageAlt": {
1304
+ "type": "string",
1305
+ "required": false,
1306
+ "maxLength": 125,
1307
+ "default": ""
1308
+ },
1309
+ "imagePosition": {
1310
+ "type": "string",
1311
+ "required": false,
1312
+ "default": "right"
1313
+ },
1314
+ "title": {
1315
+ "type": "string",
1316
+ "required": true,
1317
+ "maxLength": 80
1318
+ }
503
1319
  }
504
1320
  },
505
1321
  "feature-cards": {
@@ -572,6 +1388,117 @@
572
1388
  "showLink": false,
573
1389
  "linkText": "Learn more",
574
1390
  "cardColorScheme": "image"
1391
+ },
1392
+ "fields": {
1393
+ "cardColorScheme": {
1394
+ "type": "string",
1395
+ "required": false,
1396
+ "default": "image",
1397
+ "description": "Fallback colour scheme applied to every card that does not set its own colorScheme. Used by the `default` variant only."
1398
+ },
1399
+ "cards": {
1400
+ "type": "array",
1401
+ "required": true,
1402
+ "itemFields": {
1403
+ "colorScheme": {
1404
+ "type": "string",
1405
+ "required": false,
1406
+ "description": "Per-card colour scheme. Falls back to the section's cardColorScheme (default \"image\") when omitted. Used by the `default` variant only."
1407
+ },
1408
+ "description": {
1409
+ "type": "string",
1410
+ "required": true,
1411
+ "maxLength": 200
1412
+ },
1413
+ "image": {
1414
+ "type": "image",
1415
+ "required": false
1416
+ },
1417
+ "imageAlt": {
1418
+ "type": "string",
1419
+ "required": false,
1420
+ "default": "",
1421
+ "defaultSource": "effective",
1422
+ "maxLength": 125,
1423
+ "description": "Alt text for the card image. Defaults to an empty string, which marks the image as decorative — set it whenever the image carries meaning."
1424
+ },
1425
+ "linkHref": {
1426
+ "type": "url",
1427
+ "required": false,
1428
+ "description": "Link target. Only used by the `twoCards` and `oneCard` variants; the `default` variant renders the link without an href."
1429
+ },
1430
+ "linkText": {
1431
+ "type": "string",
1432
+ "required": false,
1433
+ "default": "Learn more",
1434
+ "defaultSource": "effective",
1435
+ "maxLength": 30
1436
+ },
1437
+ "platforms": {
1438
+ "type": "array",
1439
+ "required": false
1440
+ },
1441
+ "platformsHeading": {
1442
+ "type": "string",
1443
+ "required": false,
1444
+ "default": "Available on",
1445
+ "defaultSource": "effective",
1446
+ "maxLength": 30,
1447
+ "description": "Heading above the platform row. Used by the `twoCards` and `oneCard` variants."
1448
+ },
1449
+ "showLink": {
1450
+ "type": "boolean",
1451
+ "required": false,
1452
+ "default": true,
1453
+ "defaultSource": "effective",
1454
+ "description": "Show the \"Learn more\" link on THIS card. ON by default — omitting it renders a link. Pass false explicitly on every card that should have no link. This is the opposite of the section-level showLink default."
1455
+ },
1456
+ "title": {
1457
+ "type": "string",
1458
+ "required": true,
1459
+ "maxLength": 60
1460
+ },
1461
+ "twoTone": {
1462
+ "type": "string",
1463
+ "required": false,
1464
+ "default": "light",
1465
+ "defaultSource": "effective",
1466
+ "enum": [
1467
+ "dark",
1468
+ "light"
1469
+ ],
1470
+ "description": "Card tone. Used by the `twoCards` variant only. Anything other than \"dark\" renders light, so omitting this is equivalent to \"light\"."
1471
+ }
1472
+ }
1473
+ },
1474
+ "linkText": {
1475
+ "type": "string",
1476
+ "required": false,
1477
+ "default": "Learn more",
1478
+ "maxLength": 30,
1479
+ "description": "Label for the section-level link."
1480
+ },
1481
+ "sectionDescription": {
1482
+ "type": "string",
1483
+ "required": false,
1484
+ "maxLength": 200
1485
+ },
1486
+ "sectionTitle": {
1487
+ "type": "string",
1488
+ "required": true,
1489
+ "maxLength": 80
1490
+ },
1491
+ "showLink": {
1492
+ "type": "boolean",
1493
+ "required": false,
1494
+ "default": false,
1495
+ "description": "Show a section-level link below the section title. Off by default. NOTE: this controls the SECTION link only — it does not control the per-card links, which are on by default. See cards[].showLink."
1496
+ },
1497
+ "variant": {
1498
+ "type": "string",
1499
+ "required": false,
1500
+ "default": "default"
1501
+ }
575
1502
  }
576
1503
  },
577
1504
  "feature-cards-icon": {
@@ -635,6 +1562,72 @@
635
1562
  "defaultValues": {
636
1563
  "showLink": false,
637
1564
  "linkText": "Learn more"
1565
+ },
1566
+ "fields": {
1567
+ "cards": {
1568
+ "type": "array",
1569
+ "required": true,
1570
+ "itemFields": {
1571
+ "description": {
1572
+ "type": "string",
1573
+ "required": true,
1574
+ "maxLength": 200
1575
+ },
1576
+ "icon": {
1577
+ "type": "image",
1578
+ "required": false
1579
+ },
1580
+ "linkText": {
1581
+ "type": "string",
1582
+ "required": false,
1583
+ "default": "Learn more",
1584
+ "defaultSource": "effective",
1585
+ "maxLength": 30
1586
+ },
1587
+ "showIcon": {
1588
+ "type": "boolean",
1589
+ "required": false,
1590
+ "default": true,
1591
+ "defaultSource": "effective",
1592
+ "description": "Show the card icon. On by default; the icon only renders if `icon` is also provided."
1593
+ },
1594
+ "showLink": {
1595
+ "type": "boolean",
1596
+ "required": false,
1597
+ "default": true,
1598
+ "defaultSource": "effective",
1599
+ "description": "Show the \"Learn more\" link on THIS card. ON by default — omitting it renders a link. Pass false explicitly on every card that should have no link. This is the opposite of the section-level showLink default."
1600
+ },
1601
+ "title": {
1602
+ "type": "string",
1603
+ "required": true,
1604
+ "maxLength": 60
1605
+ }
1606
+ }
1607
+ },
1608
+ "linkText": {
1609
+ "type": "string",
1610
+ "required": false,
1611
+ "default": "Learn more",
1612
+ "maxLength": 30,
1613
+ "description": "Label for the section-level link."
1614
+ },
1615
+ "sectionDescription": {
1616
+ "type": "string",
1617
+ "required": false,
1618
+ "maxLength": 200
1619
+ },
1620
+ "sectionTitle": {
1621
+ "type": "string",
1622
+ "required": true,
1623
+ "maxLength": 80
1624
+ },
1625
+ "showLink": {
1626
+ "type": "boolean",
1627
+ "required": false,
1628
+ "default": false,
1629
+ "description": "Show a section-level link below the section title. Off by default. NOTE: this controls the SECTION link only — it does not control the per-card links, which are on by default. See cards[].showLink."
1630
+ }
638
1631
  }
639
1632
  },
640
1633
  "feature-scroll-media-right": {
@@ -697,6 +1690,51 @@
697
1690
  ],
698
1691
  "defaultValues": {
699
1692
  "variant": "media-right"
1693
+ },
1694
+ "fields": {
1695
+ "header": {
1696
+ "type": "string",
1697
+ "required": true,
1698
+ "maxLength": 80
1699
+ },
1700
+ "items": {
1701
+ "type": "array",
1702
+ "required": true,
1703
+ "itemFields": {
1704
+ "description": {
1705
+ "type": "string",
1706
+ "required": true,
1707
+ "maxLength": 200
1708
+ },
1709
+ "link": {
1710
+ "type": "url",
1711
+ "required": true
1712
+ },
1713
+ "linkLabel": {
1714
+ "type": "string",
1715
+ "required": true,
1716
+ "maxLength": 30
1717
+ },
1718
+ "mediaType": {
1719
+ "type": "string",
1720
+ "required": false
1721
+ },
1722
+ "mediaUrl": {
1723
+ "type": "url",
1724
+ "required": true
1725
+ },
1726
+ "title": {
1727
+ "type": "string",
1728
+ "required": true,
1729
+ "maxLength": 60
1730
+ }
1731
+ }
1732
+ },
1733
+ "variant": {
1734
+ "type": "string",
1735
+ "required": false,
1736
+ "default": "media-right"
1737
+ }
700
1738
  }
701
1739
  },
702
1740
  "feature-split-image-right": {
@@ -764,6 +1802,57 @@
764
1802
  "showLink": true,
765
1803
  "imageAlt": "",
766
1804
  "imagePosition": "right"
1805
+ },
1806
+ "fields": {
1807
+ "description": {
1808
+ "type": "string",
1809
+ "required": false,
1810
+ "maxLength": 200
1811
+ },
1812
+ "image": {
1813
+ "type": "image",
1814
+ "required": false,
1815
+ "aspectRatio": "1:1"
1816
+ },
1817
+ "imageAlt": {
1818
+ "type": "string",
1819
+ "required": false,
1820
+ "default": "",
1821
+ "maxLength": 125,
1822
+ "description": "Alt text for the image. Defaults to an empty string, which marks the image as decorative — set it whenever the image carries meaning."
1823
+ },
1824
+ "imagePosition": {
1825
+ "type": "string",
1826
+ "required": false,
1827
+ "default": "right",
1828
+ "enum": [
1829
+ "left",
1830
+ "right"
1831
+ ]
1832
+ },
1833
+ "linkText": {
1834
+ "type": "string",
1835
+ "required": false,
1836
+ "default": "Learn more",
1837
+ "maxLength": 30
1838
+ },
1839
+ "showDescription": {
1840
+ "type": "boolean",
1841
+ "required": false,
1842
+ "default": true,
1843
+ "description": "Show the description. On by default; only renders if `description` is also provided."
1844
+ },
1845
+ "showLink": {
1846
+ "type": "boolean",
1847
+ "required": false,
1848
+ "default": true,
1849
+ "description": "Show the \"Learn more\" link. ON by default — omit it and a link renders. Pass false to suppress it. This block has a single flat link (no cards array), so there is only one level of showLink here."
1850
+ },
1851
+ "title": {
1852
+ "type": "string",
1853
+ "required": true,
1854
+ "maxLength": 80
1855
+ }
767
1856
  }
768
1857
  },
769
1858
  "footer-global": {
@@ -837,6 +1926,45 @@
837
1926
  "logoAlt": "Deriv",
838
1927
  "licenseText": "Read our Terms and Conditions and Risk Disclosure.",
839
1928
  "riskWarningText": "The products offered on our website are complex derivative products that carry a significant risk of potential loss."
1929
+ },
1930
+ "fields": {
1931
+ "investorsInPeopleAlt": {
1932
+ "type": "string",
1933
+ "required": false,
1934
+ "maxLength": 80,
1935
+ "default": "Investors in People - Platinum"
1936
+ },
1937
+ "investorsInPeopleSrc": {
1938
+ "type": "image",
1939
+ "required": false
1940
+ },
1941
+ "licenseText": {
1942
+ "type": "string",
1943
+ "required": false
1944
+ },
1945
+ "logoAlt": {
1946
+ "type": "string",
1947
+ "required": false,
1948
+ "maxLength": 60,
1949
+ "default": "Deriv"
1950
+ },
1951
+ "logoSrc": {
1952
+ "type": "image",
1953
+ "required": true
1954
+ },
1955
+ "navColumns": {
1956
+ "type": "array",
1957
+ "required": true
1958
+ },
1959
+ "riskWarningText": {
1960
+ "type": "string",
1961
+ "required": false
1962
+ },
1963
+ "socialLinks": {
1964
+ "type": "array",
1965
+ "required": false,
1966
+ "default": []
1967
+ }
840
1968
  }
841
1969
  },
842
1970
  "header-visuals": {
@@ -869,10 +1997,8 @@
869
1997
  "optionalFields": [
870
1998
  "subtitle",
871
1999
  "description",
872
- "primaryButtonText",
873
- "primaryButtonUrl",
874
- "secondaryButtonText",
875
- "secondaryButtonUrl",
2000
+ "primaryButton",
2001
+ "secondaryButton",
876
2002
  "leftVisual",
877
2003
  "rightVisual"
878
2004
  ],
@@ -904,17 +2030,518 @@
904
2030
  "left-visual",
905
2031
  "right-visual"
906
2032
  ],
2033
+ "defaultValues": {},
2034
+ "fields": {
2035
+ "description": {
2036
+ "type": "string",
2037
+ "required": false,
2038
+ "maxLength": 200
2039
+ },
2040
+ "leftVisual": {
2041
+ "type": "image",
2042
+ "required": false,
2043
+ "aspectRatio": "1:1",
2044
+ "description": "Left floating visual, rendered by the `visuals` variant only. Accepts a ReactNode in code; page builders should pass an image URL string."
2045
+ },
2046
+ "primaryButton": {
2047
+ "type": "object",
2048
+ "required": false,
2049
+ "description": "Primary CTA (coral). Shown on both variants.",
2050
+ "objectFields": {
2051
+ "href": {
2052
+ "type": "url",
2053
+ "required": false,
2054
+ "description": "Renders an anchor when provided."
2055
+ },
2056
+ "label": {
2057
+ "type": "string",
2058
+ "required": true,
2059
+ "maxLength": 30
2060
+ }
2061
+ }
2062
+ },
2063
+ "rightVisual": {
2064
+ "type": "image",
2065
+ "required": false,
2066
+ "aspectRatio": "1:1",
2067
+ "description": "Right floating visual, rendered by the `visuals` variant only. Accepts a ReactNode in code; page builders should pass an image URL string."
2068
+ },
2069
+ "secondaryButton": {
2070
+ "type": "object",
2071
+ "required": false,
2072
+ "description": "Secondary CTA (white outline). Shown on both variants.",
2073
+ "objectFields": {
2074
+ "href": {
2075
+ "type": "url",
2076
+ "required": false,
2077
+ "description": "Renders an anchor when provided."
2078
+ },
2079
+ "label": {
2080
+ "type": "string",
2081
+ "required": true,
2082
+ "maxLength": 30
2083
+ }
2084
+ }
2085
+ },
2086
+ "subtitle": {
2087
+ "type": "string",
2088
+ "required": false,
2089
+ "maxLength": 30
2090
+ },
2091
+ "title": {
2092
+ "type": "string",
2093
+ "required": true,
2094
+ "maxLength": 80
2095
+ },
2096
+ "variant": {
2097
+ "type": "string",
2098
+ "required": true,
2099
+ "enum": [
2100
+ "visuals",
2101
+ "minimal"
2102
+ ],
2103
+ "description": "Layout variant. Required — the component has no fallback, so omitting it renders an unstyled header."
2104
+ }
2105
+ }
2106
+ },
2107
+ "help-center-page": {
2108
+ "id": "help-center-page",
2109
+ "name": "Help Center Page",
2110
+ "component": "HelpCenterPage",
2111
+ "category": "help-centre",
2112
+ "description": "A full help-centre question/answer page: a top search bar, a sticky sidebar table listing every question in the current category (highlighting the active one), and a main content column rendering the CMS-supplied answer. On mobile the sidebar collapses into a pill dropdown that opens an 'Articles in this section' bottom sheet.",
2113
+ "purpose": "The full help-centre question/answer page: a top search bar, a sidebar \"table\" listing every question in the current category (the currently viewed question is highlighted, and clicking a different one moves that highlight), and a main content column that renders the answer body supplied by a CMS. On mobile the sidebar table collapses into a rounded \"Account\"-style pill dropdown that opens an \"Articles in this section\" bottom sheet with the same question list. Modeled after [deriv.com/help-centre-question/how-can-i-update-my-personal-information](https://deriv.com/help-centre-question/how-can-i-update-my-personal-information) and [deriv.com/help-centre/account](https://deriv.com/help-centre/account). This is the third of the Help Centre blocks — pair it with `HelpCentreCategories` (top-level topic grid) and `HelpCentreSubCategories` (a single category's question grid) as the entry points that link into this page.",
2114
+ "keywords": [
2115
+ "help centre",
2116
+ "help center",
2117
+ "support",
2118
+ "faq",
2119
+ "question",
2120
+ "answer",
2121
+ "article",
2122
+ "search",
2123
+ "sidebar",
2124
+ "table of contents",
2125
+ "bottom sheet",
2126
+ "account",
2127
+ "self-service",
2128
+ "trading",
2129
+ "deriv"
2130
+ ],
2131
+ "sectionType": "article",
2132
+ "global": false,
2133
+ "requiredFields": [
2134
+ "categoryTitle",
2135
+ "questions",
2136
+ "contentTitle",
2137
+ "content"
2138
+ ],
2139
+ "optionalFields": [
2140
+ "activeQuestionId",
2141
+ "defaultActiveQuestionId",
2142
+ "searchPlaceholder",
2143
+ "searchAriaLabel",
2144
+ "searchNoResultsText",
2145
+ "articlesSheetTitle"
2146
+ ],
2147
+ "variants": [
2148
+ "default"
2149
+ ],
2150
+ "recommendedPosition": 1,
2151
+ "placement": [
2152
+ "top",
2153
+ "middle"
2154
+ ],
2155
+ "layout": {
2156
+ "alignment": "left",
2157
+ "gridColumns": "2",
2158
+ "contentWidth": "large",
2159
+ "background": false,
2160
+ "overlay": false
2161
+ },
2162
+ "supports": {
2163
+ "backgroundImage": false,
2164
+ "backgroundVideo": false,
2165
+ "foregroundImage": false,
2166
+ "primaryButton": false,
2167
+ "secondaryButton": false,
2168
+ "search": true,
2169
+ "liveFilter": true,
2170
+ "cardLink": true,
2171
+ "icons": false,
2172
+ "bottomSheet": true,
2173
+ "richContent": true
2174
+ },
2175
+ "imageRoles": [],
2176
+ "defaultValues": {
2177
+ "searchPlaceholder": "Search",
2178
+ "searchNoResultsText": "No results found for \"{query}\"",
2179
+ "articlesSheetTitle": "Articles in this section"
2180
+ },
2181
+ "fields": {
2182
+ "activeQuestionId": {
2183
+ "type": "string",
2184
+ "required": false,
2185
+ "maxLength": 60
2186
+ },
2187
+ "articlesSheetTitle": {
2188
+ "type": "string",
2189
+ "required": false,
2190
+ "maxLength": 60,
2191
+ "default": "Articles in this section"
2192
+ },
2193
+ "categoryTitle": {
2194
+ "type": "string",
2195
+ "required": true,
2196
+ "maxLength": 60
2197
+ },
2198
+ "content": {
2199
+ "type": "array",
2200
+ "required": true,
2201
+ "itemFields": {
2202
+ "items": {
2203
+ "type": "array",
2204
+ "required": false
2205
+ },
2206
+ "level": {
2207
+ "type": "number",
2208
+ "required": false,
2209
+ "enum": [
2210
+ 2,
2211
+ 3
2212
+ ]
2213
+ },
2214
+ "ordered": {
2215
+ "type": "boolean",
2216
+ "required": false
2217
+ },
2218
+ "text": {
2219
+ "type": "string",
2220
+ "required": false,
2221
+ "maxLength": 500
2222
+ },
2223
+ "type": {
2224
+ "type": "string",
2225
+ "required": true,
2226
+ "enum": [
2227
+ "heading",
2228
+ "paragraph",
2229
+ "list"
2230
+ ]
2231
+ }
2232
+ }
2233
+ },
2234
+ "contentTitle": {
2235
+ "type": "string",
2236
+ "required": true,
2237
+ "maxLength": 160
2238
+ },
2239
+ "defaultActiveQuestionId": {
2240
+ "type": "string",
2241
+ "required": false,
2242
+ "maxLength": 60
2243
+ },
2244
+ "questions": {
2245
+ "type": "array",
2246
+ "required": true,
2247
+ "itemFields": {
2248
+ "content": {
2249
+ "type": "array",
2250
+ "required": false,
2251
+ "itemFields": {
2252
+ "items": {
2253
+ "type": "array",
2254
+ "required": false
2255
+ },
2256
+ "level": {
2257
+ "type": "number",
2258
+ "required": false,
2259
+ "enum": [
2260
+ 2,
2261
+ 3
2262
+ ]
2263
+ },
2264
+ "ordered": {
2265
+ "type": "boolean",
2266
+ "required": false
2267
+ },
2268
+ "text": {
2269
+ "type": "string",
2270
+ "required": false,
2271
+ "maxLength": 500
2272
+ },
2273
+ "type": {
2274
+ "type": "string",
2275
+ "required": true,
2276
+ "enum": [
2277
+ "heading",
2278
+ "paragraph",
2279
+ "list"
2280
+ ]
2281
+ }
2282
+ }
2283
+ },
2284
+ "contentTitle": {
2285
+ "type": "string",
2286
+ "required": false,
2287
+ "maxLength": 160
2288
+ },
2289
+ "href": {
2290
+ "type": "url",
2291
+ "required": false
2292
+ },
2293
+ "id": {
2294
+ "type": "string",
2295
+ "required": true,
2296
+ "maxLength": 60
2297
+ },
2298
+ "question": {
2299
+ "type": "string",
2300
+ "required": true,
2301
+ "maxLength": 160
2302
+ }
2303
+ }
2304
+ },
2305
+ "searchAriaLabel": {
2306
+ "type": "string",
2307
+ "required": false,
2308
+ "maxLength": 60
2309
+ },
2310
+ "searchNoResultsText": {
2311
+ "type": "string",
2312
+ "required": false,
2313
+ "maxLength": 100,
2314
+ "default": "No results found for \"{query}\""
2315
+ },
2316
+ "searchPlaceholder": {
2317
+ "type": "string",
2318
+ "required": false,
2319
+ "maxLength": 40,
2320
+ "default": "Search"
2321
+ }
2322
+ }
2323
+ },
2324
+ "help-centre-categories": {
2325
+ "id": "help-centre-categories",
2326
+ "name": "Help Centre Categories",
2327
+ "component": "HelpCentreCategories",
2328
+ "category": "help-centre",
2329
+ "description": "Optional header above a responsive grid of clickable icon-and-title category tiles that link into topic-specific help content.",
2330
+ "purpose": "An optional centred header above a responsive grid of clickable icon-and-title category tiles. Each tile is a self-contained link (or button) that routes visitors into a topic-specific slice of help content. Modeled after the category grid on [deriv.com/help-centre](https://deriv.com/help-centre) (Account, Verification, Deposits and withdrawals, Deriv P2P, Deriv MT5, Deriv cTrader, Deriv Trader, Deriv Bot, Promotions, TradingView, TradersView, About Amy). This is the first of several planned Help Centre blocks (search/hero, FAQ list, contact support, etc.) and is designed to sit directly below a help-centre search bar as the primary navigation surface into support content.",
2331
+ "keywords": [
2332
+ "help centre",
2333
+ "help center",
2334
+ "support",
2335
+ "categories",
2336
+ "faq",
2337
+ "topics",
2338
+ "navigation",
2339
+ "grid",
2340
+ "tiles",
2341
+ "icons",
2342
+ "links",
2343
+ "self-service",
2344
+ "trading",
2345
+ "deriv"
2346
+ ],
2347
+ "sectionType": "navigation",
2348
+ "global": false,
2349
+ "requiredFields": [
2350
+ "categories"
2351
+ ],
2352
+ "optionalFields": [
2353
+ "sectionTitle",
2354
+ "sectionDescription"
2355
+ ],
2356
+ "variants": [
2357
+ "default"
2358
+ ],
2359
+ "recommendedPosition": 1,
2360
+ "placement": [
2361
+ "top",
2362
+ "middle"
2363
+ ],
2364
+ "layout": {
2365
+ "alignment": "left",
2366
+ "gridColumns": "1-3",
2367
+ "contentWidth": "large",
2368
+ "background": false,
2369
+ "overlay": false
2370
+ },
2371
+ "supports": {
2372
+ "backgroundImage": false,
2373
+ "backgroundVideo": false,
2374
+ "foregroundImage": false,
2375
+ "primaryButton": false,
2376
+ "secondaryButton": false,
2377
+ "sectionLink": false,
2378
+ "cardLink": true,
2379
+ "icons": true
2380
+ },
2381
+ "imageRoles": [
2382
+ "category-icon"
2383
+ ],
2384
+ "defaultValues": {},
2385
+ "fields": {
2386
+ "categories": {
2387
+ "type": "array",
2388
+ "required": true,
2389
+ "itemFields": {
2390
+ "href": {
2391
+ "type": "url",
2392
+ "required": false
2393
+ },
2394
+ "icon": {
2395
+ "type": "image",
2396
+ "required": false
2397
+ },
2398
+ "iconAlt": {
2399
+ "type": "string",
2400
+ "required": false,
2401
+ "maxLength": 125
2402
+ },
2403
+ "id": {
2404
+ "type": "string",
2405
+ "required": false,
2406
+ "maxLength": 60
2407
+ },
2408
+ "title": {
2409
+ "type": "string",
2410
+ "required": true,
2411
+ "maxLength": 40
2412
+ }
2413
+ }
2414
+ },
2415
+ "sectionDescription": {
2416
+ "type": "string",
2417
+ "required": false,
2418
+ "maxLength": 200
2419
+ },
2420
+ "sectionTitle": {
2421
+ "type": "string",
2422
+ "required": false,
2423
+ "maxLength": 80
2424
+ }
2425
+ }
2426
+ },
2427
+ "help-centre-sub-categories": {
2428
+ "id": "help-centre-sub-categories",
2429
+ "name": "Help Centre Sub-Categories",
2430
+ "component": "HelpCentreSubCategories",
2431
+ "category": "help-centre",
2432
+ "description": "A large category title above a live-filtering search field and a responsive grid of clickable FAQ question cards, for a single help-centre category's landing page.",
2433
+ "purpose": "A large category title above a live-filtering search field and a responsive grid of clickable FAQ question cards. This is the page a visitor lands on after clicking a category tile in `HelpCentreCategories` (e.g. \"Account\") — it lists every FAQ question in that category as its own card, with an always-available search box to narrow the list. Modeled after [deriv.com/help-centre/account](https://deriv.com/help-centre/account) (title \"Account\", a search field, then question cards: \"How can I update my personal information on Deriv?\", \"How do I reset my password on Deriv?\", \"Can I open multiple accounts with Deriv?\", \"What is a Deriv Portfolio?\"). This is the second of the planned Help Centre blocks — pair it with `HelpCentreCategories` (the top-level topic grid) and, for the answer itself, `FaqAccordion` or a dedicated article page.",
2434
+ "keywords": [
2435
+ "help centre",
2436
+ "help center",
2437
+ "support",
2438
+ "sub-category",
2439
+ "subcategory",
2440
+ "faq",
2441
+ "questions",
2442
+ "search",
2443
+ "filter",
2444
+ "grid",
2445
+ "cards",
2446
+ "account",
2447
+ "self-service",
2448
+ "trading",
2449
+ "deriv"
2450
+ ],
2451
+ "sectionType": "faq",
2452
+ "global": false,
2453
+ "requiredFields": [
2454
+ "title",
2455
+ "items"
2456
+ ],
2457
+ "optionalFields": [
2458
+ "searchPlaceholder",
2459
+ "searchAriaLabel",
2460
+ "noResultsText"
2461
+ ],
2462
+ "variants": [
2463
+ "default"
2464
+ ],
2465
+ "recommendedPosition": 1,
2466
+ "placement": [
2467
+ "top",
2468
+ "middle"
2469
+ ],
2470
+ "layout": {
2471
+ "alignment": "center",
2472
+ "gridColumns": "1-3",
2473
+ "contentWidth": "large",
2474
+ "background": false,
2475
+ "overlay": false
2476
+ },
2477
+ "supports": {
2478
+ "backgroundImage": false,
2479
+ "backgroundVideo": false,
2480
+ "foregroundImage": false,
2481
+ "primaryButton": false,
2482
+ "secondaryButton": false,
2483
+ "search": true,
2484
+ "liveFilter": true,
2485
+ "cardLink": true,
2486
+ "icons": false
2487
+ },
2488
+ "imageRoles": [],
907
2489
  "defaultValues": {
908
- "variant": "visuals"
2490
+ "searchPlaceholder": "Search",
2491
+ "noResultsText": "No results found for \"{query}\""
2492
+ },
2493
+ "fields": {
2494
+ "items": {
2495
+ "type": "array",
2496
+ "required": true,
2497
+ "itemFields": {
2498
+ "href": {
2499
+ "type": "url",
2500
+ "required": false
2501
+ },
2502
+ "id": {
2503
+ "type": "string",
2504
+ "required": false,
2505
+ "maxLength": 60
2506
+ },
2507
+ "question": {
2508
+ "type": "string",
2509
+ "required": true,
2510
+ "maxLength": 160
2511
+ }
2512
+ }
2513
+ },
2514
+ "noResultsText": {
2515
+ "type": "string",
2516
+ "required": false,
2517
+ "maxLength": 100,
2518
+ "default": "No results found for \"{query}\""
2519
+ },
2520
+ "searchAriaLabel": {
2521
+ "type": "string",
2522
+ "required": false,
2523
+ "maxLength": 60
2524
+ },
2525
+ "searchPlaceholder": {
2526
+ "type": "string",
2527
+ "required": false,
2528
+ "maxLength": 40,
2529
+ "default": "Search"
2530
+ },
2531
+ "title": {
2532
+ "type": "string",
2533
+ "required": true,
2534
+ "maxLength": 60
2535
+ }
909
2536
  }
910
2537
  },
911
2538
  "hero-centered": {
912
2539
  "id": "hero-centered",
913
- "name": "Hero Centered",
914
- "component": "Hero.Centered",
2540
+ "name": "Hero",
2541
+ "component": "Hero",
915
2542
  "category": "hero",
916
- "description": "Centered landing hero with headline, description and CTA buttons.",
917
- "purpose": "The primary hero section used to introduce a page with a strong headline, supporting description, primary call-to-action, and optional secondary action. This block is designed to be the first visible section of a landing page.",
2543
+ "description": "Landing hero with title, description and CTA buttons. Three layouts: split (right-side image), centered (background image), showcase (product + floating images).",
2544
+ "purpose": "The primary hero section used to introduce a page with a strong title, supporting description, primary call-to-action, and optional secondary action. Exposed as a single `Hero` component with a required `variant` prop selecting one of three layouts: `split` (dark background, left-aligned text, right-side hero image), `centered` (full background image, center-aligned text), or `showcase` (dark background with a large product image and a smaller floating image below the buttons). This block is designed to be the first visible section of a landing page.",
918
2545
  "keywords": [
919
2546
  "hero",
920
2547
  "landing",
@@ -934,25 +2561,23 @@
934
2561
  "sectionType": "hero",
935
2562
  "global": false,
936
2563
  "requiredFields": [
937
- "headline",
938
- "description",
939
- "primaryButtonText",
940
- "primaryButtonUrl"
2564
+ "variant",
2565
+ "title"
941
2566
  ],
942
2567
  "optionalFields": [
943
- "eyebrow",
944
- "secondaryButtonText",
945
- "secondaryButtonUrl",
946
- "backgroundImage",
947
- "backgroundVideo",
948
- "badge",
949
- "trustIndicators"
2568
+ "subtitle",
2569
+ "description",
2570
+ "primaryButton",
2571
+ "secondaryButton",
2572
+ "backgroundImageSrc",
2573
+ "heroImage",
2574
+ "productImage",
2575
+ "floatingImage"
950
2576
  ],
951
2577
  "variants": [
2578
+ "split",
952
2579
  "centered",
953
- "left",
954
- "image-right",
955
- "video"
2580
+ "showcase"
956
2581
  ],
957
2582
  "recommendedPosition": 1,
958
2583
  "placement": [
@@ -967,20 +2592,104 @@
967
2592
  },
968
2593
  "supports": {
969
2594
  "backgroundImage": true,
970
- "backgroundVideo": true,
971
- "foregroundImage": false,
2595
+ "backgroundVideo": false,
2596
+ "foregroundImage": true,
972
2597
  "primaryButton": true,
973
2598
  "secondaryButton": true,
974
- "badge": true,
975
- "trustIndicators": true
2599
+ "badge": false,
2600
+ "trustIndicators": false
976
2601
  },
977
2602
  "imageRoles": [
978
- "hero-background"
979
- ],
980
- "defaultValues": {
981
- "layout": "centered",
982
- "overlay": true,
983
- "buttonLayout": "horizontal"
2603
+ "hero-background",
2604
+ "hero-image",
2605
+ "product-image",
2606
+ "floating-image"
2607
+ ],
2608
+ "defaultValues": {},
2609
+ "fields": {
2610
+ "backgroundImageSrc": {
2611
+ "type": "image",
2612
+ "required": false,
2613
+ "aspectRatio": "16:9",
2614
+ "description": "Full-bleed background image URL, used by all three variants."
2615
+ },
2616
+ "description": {
2617
+ "type": "string",
2618
+ "required": false,
2619
+ "maxLength": 200,
2620
+ "description": "Body copy below the title."
2621
+ },
2622
+ "floatingImage": {
2623
+ "type": "image",
2624
+ "required": false,
2625
+ "description": "Smaller floating image below productImage in the Showcase variant. Accepts a ReactNode in code; page builders should pass an image URL string."
2626
+ },
2627
+ "heroImage": {
2628
+ "type": "image",
2629
+ "required": false,
2630
+ "description": "Right-side hero image for the Split variant. Accepts a ReactNode in code; page builders should pass an image URL string."
2631
+ },
2632
+ "primaryButton": {
2633
+ "type": "object",
2634
+ "required": false,
2635
+ "description": "Primary CTA (coral). Shown on all variants.",
2636
+ "objectFields": {
2637
+ "href": {
2638
+ "type": "url",
2639
+ "required": false,
2640
+ "description": "Renders an anchor when provided."
2641
+ },
2642
+ "label": {
2643
+ "type": "string",
2644
+ "required": true,
2645
+ "maxLength": 30
2646
+ }
2647
+ }
2648
+ },
2649
+ "productImage": {
2650
+ "type": "image",
2651
+ "required": false,
2652
+ "description": "Large product image centered below the CTAs in the Showcase variant. Accepts a ReactNode in code; page builders should pass an image URL string."
2653
+ },
2654
+ "secondaryButton": {
2655
+ "type": "object",
2656
+ "required": false,
2657
+ "description": "Secondary CTA (white outline). Shown on all variants.",
2658
+ "objectFields": {
2659
+ "href": {
2660
+ "type": "url",
2661
+ "required": false,
2662
+ "description": "Renders an anchor when provided."
2663
+ },
2664
+ "label": {
2665
+ "type": "string",
2666
+ "required": true,
2667
+ "maxLength": 30
2668
+ }
2669
+ }
2670
+ },
2671
+ "subtitle": {
2672
+ "type": "string",
2673
+ "required": false,
2674
+ "maxLength": 30,
2675
+ "description": "Eyebrow text shown above the title."
2676
+ },
2677
+ "title": {
2678
+ "type": "string",
2679
+ "required": true,
2680
+ "maxLength": 80,
2681
+ "description": "Main heading."
2682
+ },
2683
+ "variant": {
2684
+ "type": "string",
2685
+ "required": true,
2686
+ "enum": [
2687
+ "split",
2688
+ "centered",
2689
+ "showcase"
2690
+ ],
2691
+ "description": "Layout variant. Required — the component has no fallback, so omitting it renders an unstyled hero."
2692
+ }
984
2693
  }
985
2694
  },
986
2695
  "image-banner-split": {
@@ -1051,6 +2760,50 @@
1051
2760
  "description": "Connect with traders around the world to exchange insights, explore portfolios, and gain valuable expertise.",
1052
2761
  "ctaLabel": "Trader's Hub",
1053
2762
  "imageAlt": ""
2763
+ },
2764
+ "fields": {
2765
+ "ctaHref": {
2766
+ "type": "url",
2767
+ "required": false
2768
+ },
2769
+ "ctaLabel": {
2770
+ "type": "string",
2771
+ "required": false,
2772
+ "maxLength": 30,
2773
+ "default": "Trader's Hub"
2774
+ },
2775
+ "description": {
2776
+ "type": "string",
2777
+ "required": false,
2778
+ "maxLength": 200,
2779
+ "default": "Connect with traders around the world to exchange insights, explore portfolios, and gain valuable expertise."
2780
+ },
2781
+ "imageAlt": {
2782
+ "type": "string",
2783
+ "required": false,
2784
+ "maxLength": 120,
2785
+ "default": ""
2786
+ },
2787
+ "imageUrl": {
2788
+ "type": "image",
2789
+ "required": false,
2790
+ "aspectRatio": "4:3"
2791
+ },
2792
+ "title": {
2793
+ "type": "string",
2794
+ "required": false,
2795
+ "maxLength": 80,
2796
+ "default": "Join our global community"
2797
+ },
2798
+ "variant": {
2799
+ "type": "string",
2800
+ "required": false,
2801
+ "enum": [
2802
+ "split",
2803
+ "full-bg"
2804
+ ],
2805
+ "default": "split"
2806
+ }
1054
2807
  }
1055
2808
  },
1056
2809
  "leaders": {
@@ -1116,6 +2869,65 @@
1116
2869
  "initialVisibleCount": 4,
1117
2870
  "expandText": "View all",
1118
2871
  "collapseText": "View less"
2872
+ },
2873
+ "fields": {
2874
+ "collapseText": {
2875
+ "type": "string",
2876
+ "required": false,
2877
+ "maxLength": 30,
2878
+ "default": "View less"
2879
+ },
2880
+ "description": {
2881
+ "type": "string",
2882
+ "required": false,
2883
+ "maxLength": 200
2884
+ },
2885
+ "expandText": {
2886
+ "type": "string",
2887
+ "required": false,
2888
+ "maxLength": 30,
2889
+ "default": "View all"
2890
+ },
2891
+ "initialVisibleCount": {
2892
+ "type": "number",
2893
+ "required": false,
2894
+ "default": 4
2895
+ },
2896
+ "items": {
2897
+ "type": "array",
2898
+ "required": true,
2899
+ "itemFields": {
2900
+ "imageUrl": {
2901
+ "type": "image",
2902
+ "required": true,
2903
+ "aspectRatio": "1:1"
2904
+ },
2905
+ "linkLabel": {
2906
+ "type": "string",
2907
+ "required": false,
2908
+ "maxLength": 30
2909
+ },
2910
+ "linkUrl": {
2911
+ "type": "url",
2912
+ "required": false
2913
+ },
2914
+ "name": {
2915
+ "type": "string",
2916
+ "required": true,
2917
+ "maxLength": 60
2918
+ },
2919
+ "role": {
2920
+ "type": "string",
2921
+ "required": true,
2922
+ "maxLength": 60
2923
+ }
2924
+ }
2925
+ },
2926
+ "title": {
2927
+ "type": "string",
2928
+ "required": false,
2929
+ "maxLength": 80
2930
+ }
1119
2931
  }
1120
2932
  },
1121
2933
  "logo-marquee": {
@@ -1186,6 +2998,62 @@
1186
2998
  "disclaimer": "*Add any relevant disclaimers or legal copy here.",
1187
2999
  "ctaLabel": "Learn more",
1188
3000
  "ctaHref": "#"
3001
+ },
3002
+ "fields": {
3003
+ "body": {
3004
+ "type": "string",
3005
+ "required": false,
3006
+ "maxLength": 200
3007
+ },
3008
+ "col1Logos": {
3009
+ "type": "array",
3010
+ "required": false,
3011
+ "itemFields": {
3012
+ "name": {
3013
+ "type": "string",
3014
+ "required": true,
3015
+ "maxLength": 60
3016
+ },
3017
+ "url": {
3018
+ "type": "image",
3019
+ "required": true
3020
+ }
3021
+ }
3022
+ },
3023
+ "col2Logos": {
3024
+ "type": "array",
3025
+ "required": false,
3026
+ "itemFields": {
3027
+ "name": {
3028
+ "type": "string",
3029
+ "required": true,
3030
+ "maxLength": 60
3031
+ },
3032
+ "url": {
3033
+ "type": "image",
3034
+ "required": true
3035
+ }
3036
+ }
3037
+ },
3038
+ "ctaHref": {
3039
+ "type": "url",
3040
+ "required": false
3041
+ },
3042
+ "ctaLabel": {
3043
+ "type": "string",
3044
+ "required": false,
3045
+ "maxLength": 30
3046
+ },
3047
+ "disclaimer": {
3048
+ "type": "string",
3049
+ "required": false,
3050
+ "maxLength": 200
3051
+ },
3052
+ "headline": {
3053
+ "type": "string",
3054
+ "required": false,
3055
+ "maxLength": 80
3056
+ }
1189
3057
  }
1190
3058
  },
1191
3059
  "navbar-global": {
@@ -1256,13 +3124,89 @@
1256
3124
  "logo-dark"
1257
3125
  ],
1258
3126
  "defaultValues": {
1259
- "theme": "light",
3127
+ "theme": "dark",
1260
3128
  "logoHref": "/",
1261
3129
  "loginLabel": "Log in",
1262
- "loginHref": "/login",
1263
- "ctaLabel": "Open account",
1264
- "ctaHref": "/signup",
1265
- "languageLabel": "EN"
3130
+ "ctaLabel": "Open account"
3131
+ },
3132
+ "fields": {
3133
+ "activeLanguageCode": {
3134
+ "type": "string",
3135
+ "required": false,
3136
+ "maxLength": 10
3137
+ },
3138
+ "ctaHref": {
3139
+ "type": "url",
3140
+ "required": false,
3141
+ "description": "CTA link target. No default — omit it and the CTA button is not rendered at all."
3142
+ },
3143
+ "ctaLabel": {
3144
+ "type": "string",
3145
+ "required": false,
3146
+ "maxLength": 30,
3147
+ "default": "Open account"
3148
+ },
3149
+ "languageItems": {
3150
+ "type": "array",
3151
+ "required": false,
3152
+ "itemFields": {
3153
+ "code": {
3154
+ "type": "string",
3155
+ "required": true,
3156
+ "maxLength": 10
3157
+ },
3158
+ "label": {
3159
+ "type": "string",
3160
+ "required": true,
3161
+ "maxLength": 40
3162
+ }
3163
+ }
3164
+ },
3165
+ "languageLabel": {
3166
+ "type": "string",
3167
+ "required": false,
3168
+ "maxLength": 10,
3169
+ "description": "Current language code shown in the switcher, e.g. \"EN\". No default — omit it and the language switcher is not rendered at all."
3170
+ },
3171
+ "loginHref": {
3172
+ "type": "url",
3173
+ "required": false,
3174
+ "description": "Login link target. No default — omit it and the login link is not rendered at all."
3175
+ },
3176
+ "loginLabel": {
3177
+ "type": "string",
3178
+ "required": false,
3179
+ "maxLength": 30,
3180
+ "default": "Log in"
3181
+ },
3182
+ "logoHref": {
3183
+ "type": "url",
3184
+ "required": false,
3185
+ "default": "/"
3186
+ },
3187
+ "logoSrc": {
3188
+ "type": "image",
3189
+ "required": true
3190
+ },
3191
+ "logoSrcDark": {
3192
+ "type": "image",
3193
+ "required": false
3194
+ },
3195
+ "navItems": {
3196
+ "type": "array",
3197
+ "required": false,
3198
+ "default": []
3199
+ },
3200
+ "theme": {
3201
+ "type": "string",
3202
+ "required": false,
3203
+ "default": "dark",
3204
+ "enum": [
3205
+ "dark",
3206
+ "light"
3207
+ ],
3208
+ "description": "Colour theme. Defaults to \"dark\" — omit it and you get the dark navbar. (This entry previously documented \"light\", which the component never did.)"
3209
+ }
1266
3210
  }
1267
3211
  },
1268
3212
  "stats-carousel": {
@@ -1271,7 +3215,7 @@
1271
3215
  "component": "Stats",
1272
3216
  "category": "stats",
1273
3217
  "description": "Auto-rotating carousel of key numbers with optional laurel-wrapped award badges; a StatsSimple variant renders a static count-up grid.",
1274
- "purpose": "A trust and credibility section that cycles through a list of key numbers (value + label) one at a time in an auto-rotating carousel card, optionally flanked by laurel-wrapped award badges with a scroll-driven parallax. A second component in this folder, StatsSimple, renders the same value/label items as a static grid with a count-up-on-scroll reveal instead of a carousel.",
3218
+ "purpose": "A trust and credibility section that cycles through a list of key numbers (value + label) one at a time in an auto-rotating carousel card, optionally flanked by laurel-wrapped award badges with a scroll-driven parallax. A second component in this folder, StatsSimple, renders the same value/label items as a static row with a count-up-on-scroll reveal instead of a carousel. It is a separate component with its own registry block — select `stats-simple` for that layout. `Stats` itself has no `variant` prop; this block has a single layout.",
1275
3219
  "keywords": [
1276
3220
  "stats",
1277
3221
  "statistics",
@@ -1299,8 +3243,7 @@
1299
3243
  "rightAwards"
1300
3244
  ],
1301
3245
  "variants": [
1302
- "carousel",
1303
- "simple"
3246
+ "default"
1304
3247
  ],
1305
3248
  "recommendedPosition": 3,
1306
3249
  "placement": [
@@ -1326,6 +3269,145 @@
1326
3269
  "defaultValues": {
1327
3270
  "leftAwards": [],
1328
3271
  "rightAwards": []
3272
+ },
3273
+ "fields": {
3274
+ "description": {
3275
+ "type": "string",
3276
+ "required": false,
3277
+ "maxLength": 200
3278
+ },
3279
+ "leftAwards": {
3280
+ "type": "array",
3281
+ "required": false,
3282
+ "itemFields": {
3283
+ "heading": {
3284
+ "type": "string",
3285
+ "required": true,
3286
+ "maxLength": 60
3287
+ },
3288
+ "subheading": {
3289
+ "type": "string",
3290
+ "required": true,
3291
+ "maxLength": 60
3292
+ }
3293
+ },
3294
+ "default": []
3295
+ },
3296
+ "rightAwards": {
3297
+ "type": "array",
3298
+ "required": false,
3299
+ "itemFields": {
3300
+ "heading": {
3301
+ "type": "string",
3302
+ "required": true,
3303
+ "maxLength": 60
3304
+ },
3305
+ "subheading": {
3306
+ "type": "string",
3307
+ "required": true,
3308
+ "maxLength": 60
3309
+ }
3310
+ },
3311
+ "default": []
3312
+ },
3313
+ "stats": {
3314
+ "type": "array",
3315
+ "required": true,
3316
+ "itemFields": {
3317
+ "label": {
3318
+ "type": "string",
3319
+ "required": true,
3320
+ "maxLength": 60
3321
+ },
3322
+ "value": {
3323
+ "type": "string",
3324
+ "required": true,
3325
+ "maxLength": 12
3326
+ }
3327
+ }
3328
+ },
3329
+ "title": {
3330
+ "type": "string",
3331
+ "required": true,
3332
+ "maxLength": 80
3333
+ }
3334
+ }
3335
+ },
3336
+ "stats-simple": {
3337
+ "id": "stats-simple",
3338
+ "name": "Stats Simple",
3339
+ "component": "StatsSimple",
3340
+ "category": "stats",
3341
+ "description": "Single-row band of headline numbers with short labels, counting up when scrolled into view.",
3342
+ "purpose": "A compact single-row band of headline numbers, each with a short label beneath it. The figures count up once the section scrolls into view. Use it as a lightweight proof point between larger content sections when the numbers alone tell the story and no section title, description, or award badges are needed.",
3343
+ "keywords": [
3344
+ "stats",
3345
+ "statistics",
3346
+ "numbers",
3347
+ "metrics",
3348
+ "figures",
3349
+ "counters",
3350
+ "count-up",
3351
+ "kpi",
3352
+ "proof",
3353
+ "social-proof",
3354
+ "trust",
3355
+ "clients",
3356
+ "volume",
3357
+ "deriv"
3358
+ ],
3359
+ "sectionType": "stats",
3360
+ "global": false,
3361
+ "requiredFields": [
3362
+ "stats"
3363
+ ],
3364
+ "optionalFields": [],
3365
+ "variants": [
3366
+ "default"
3367
+ ],
3368
+ "recommendedPosition": 3,
3369
+ "placement": [
3370
+ "middle"
3371
+ ],
3372
+ "layout": {
3373
+ "alignment": "center",
3374
+ "buttonLayout": "none",
3375
+ "contentWidth": "wide",
3376
+ "background": false,
3377
+ "overlay": false
3378
+ },
3379
+ "supports": {
3380
+ "backgroundImage": false,
3381
+ "backgroundVideo": false,
3382
+ "foregroundImage": false,
3383
+ "primaryButton": false,
3384
+ "secondaryButton": false,
3385
+ "countUpAnimation": true,
3386
+ "sectionTitle": false,
3387
+ "awards": false
3388
+ },
3389
+ "imageRoles": [],
3390
+ "defaultValues": {},
3391
+ "fields": {
3392
+ "stats": {
3393
+ "type": "array",
3394
+ "required": true,
3395
+ "description": "Ordered list of stats rendered as one horizontal row. Three to five items read best; there is no section title, so the numbers carry the section on their own.",
3396
+ "itemFields": {
3397
+ "label": {
3398
+ "type": "string",
3399
+ "required": true,
3400
+ "maxLength": 40,
3401
+ "description": "Short descriptive label below the value, e.g. \"customers worldwide\"."
3402
+ },
3403
+ "value": {
3404
+ "type": "string",
3405
+ "required": true,
3406
+ "maxLength": 12,
3407
+ "description": "Headline figure, e.g. \"2.5M+\". The leading number is counted up on scroll; any prefix or suffix (currency symbol, +, %) is preserved."
3408
+ }
3409
+ }
3410
+ }
1329
3411
  }
1330
3412
  },
1331
3413
  "steps-image-left": {
@@ -1389,6 +3471,49 @@
1389
3471
  "defaultValues": {
1390
3472
  "imagePosition": "left",
1391
3473
  "imageAlt": ""
3474
+ },
3475
+ "fields": {
3476
+ "image": {
3477
+ "type": "image",
3478
+ "required": false,
3479
+ "aspectRatio": "1:1"
3480
+ },
3481
+ "imageAlt": {
3482
+ "type": "string",
3483
+ "required": false,
3484
+ "maxLength": 120,
3485
+ "default": ""
3486
+ },
3487
+ "imagePosition": {
3488
+ "type": "string",
3489
+ "required": false,
3490
+ "enum": [
3491
+ "left",
3492
+ "right"
3493
+ ],
3494
+ "default": "left"
3495
+ },
3496
+ "steps": {
3497
+ "type": "array",
3498
+ "required": true,
3499
+ "itemFields": {
3500
+ "description": {
3501
+ "type": "string",
3502
+ "required": true,
3503
+ "maxLength": 200
3504
+ },
3505
+ "title": {
3506
+ "type": "string",
3507
+ "required": true,
3508
+ "maxLength": 60
3509
+ }
3510
+ }
3511
+ },
3512
+ "title": {
3513
+ "type": "string",
3514
+ "required": true,
3515
+ "maxLength": 80
3516
+ }
1392
3517
  }
1393
3518
  },
1394
3519
  "sticky-market-cards": {
@@ -1450,9 +3575,50 @@
1450
3575
  "imageRoles": [
1451
3576
  "card-background"
1452
3577
  ],
1453
- "defaultValues": {
1454
- "itemTheme": "dark",
1455
- "maxVisibleStack": 4
3578
+ "defaultValues": {},
3579
+ "fields": {
3580
+ "items": {
3581
+ "type": "array",
3582
+ "required": true,
3583
+ "itemFields": {
3584
+ "description": {
3585
+ "type": "string",
3586
+ "required": true,
3587
+ "maxLength": 150
3588
+ },
3589
+ "imageUrl": {
3590
+ "type": "image",
3591
+ "required": false
3592
+ },
3593
+ "theme": {
3594
+ "type": "string",
3595
+ "required": false,
3596
+ "default": "dark",
3597
+ "defaultSource": "effective",
3598
+ "enum": [
3599
+ "light",
3600
+ "coral",
3601
+ "dark"
3602
+ ],
3603
+ "description": "Per-card colour theme. Defaults to \"dark\" — applied inside the render (`item.theme ?? \"dark\"`) rather than as a declared prop default."
3604
+ },
3605
+ "title": {
3606
+ "type": "string",
3607
+ "required": true,
3608
+ "maxLength": 60
3609
+ }
3610
+ }
3611
+ },
3612
+ "sectionDescription": {
3613
+ "type": "string",
3614
+ "required": false,
3615
+ "maxLength": 200
3616
+ },
3617
+ "sectionTitle": {
3618
+ "type": "string",
3619
+ "required": true,
3620
+ "maxLength": 80
3621
+ }
1456
3622
  }
1457
3623
  },
1458
3624
  "sticky-stacked-cards": {
@@ -1511,8 +3677,45 @@
1511
3677
  "imageRoles": [
1512
3678
  "card-hero"
1513
3679
  ],
1514
- "defaultValues": {
1515
- "itemTheme": "light"
3680
+ "defaultValues": {},
3681
+ "fields": {
3682
+ "header": {
3683
+ "type": "string",
3684
+ "required": true,
3685
+ "maxLength": 80
3686
+ },
3687
+ "items": {
3688
+ "type": "array",
3689
+ "required": true,
3690
+ "itemFields": {
3691
+ "description": {
3692
+ "type": "string",
3693
+ "required": true,
3694
+ "maxLength": 150
3695
+ },
3696
+ "imageUrl": {
3697
+ "type": "image",
3698
+ "required": true
3699
+ },
3700
+ "theme": {
3701
+ "type": "string",
3702
+ "required": false,
3703
+ "default": "light",
3704
+ "defaultSource": "effective",
3705
+ "enum": [
3706
+ "light",
3707
+ "coral",
3708
+ "dark"
3709
+ ],
3710
+ "description": "Per-card colour theme. Defaults to \"light\" — applied inside the render (`item.theme ?? \"light\"`) rather than as a declared prop default."
3711
+ },
3712
+ "title": {
3713
+ "type": "string",
3714
+ "required": true,
3715
+ "maxLength": 60
3716
+ }
3717
+ }
3718
+ }
1516
3719
  }
1517
3720
  },
1518
3721
  "table": {
@@ -1584,8 +3787,73 @@
1584
3787
  ],
1585
3788
  "defaultValues": {
1586
3789
  "pageSize": 10,
1587
- "searchPlaceholder": "Search",
1588
- "columnWidth": "normal"
3790
+ "searchPlaceholder": "Search"
3791
+ },
3792
+ "fields": {
3793
+ "columns": {
3794
+ "type": "array",
3795
+ "required": true,
3796
+ "itemFields": {
3797
+ "header": {
3798
+ "type": "string",
3799
+ "required": true,
3800
+ "maxLength": 40
3801
+ },
3802
+ "key": {
3803
+ "type": "string",
3804
+ "required": true,
3805
+ "maxLength": 40
3806
+ },
3807
+ "tooltip": {
3808
+ "type": "object",
3809
+ "required": false
3810
+ },
3811
+ "width": {
3812
+ "type": "string",
3813
+ "required": false,
3814
+ "default": "normal",
3815
+ "defaultSource": "effective",
3816
+ "enum": [
3817
+ "main",
3818
+ "normal",
3819
+ "big"
3820
+ ],
3821
+ "description": "Column width variant. Anything other than \"main\" or \"big\" renders at normal width, so omitting this is equivalent to \"normal\". At most one column should be \"main\" — it becomes the sticky first column."
3822
+ }
3823
+ }
3824
+ },
3825
+ "infoText": {
3826
+ "type": "string",
3827
+ "required": false,
3828
+ "maxLength": 300
3829
+ },
3830
+ "mainColumnKey": {
3831
+ "type": "string",
3832
+ "required": false,
3833
+ "maxLength": 40
3834
+ },
3835
+ "pageSize": {
3836
+ "type": "number",
3837
+ "required": false,
3838
+ "min": 1,
3839
+ "max": 50,
3840
+ "default": 10
3841
+ },
3842
+ "rows": {
3843
+ "type": "array",
3844
+ "required": true
3845
+ },
3846
+ "searchPlaceholder": {
3847
+ "type": "string",
3848
+ "required": false,
3849
+ "maxLength": 30,
3850
+ "default": "Search"
3851
+ },
3852
+ "sectionTitle": {
3853
+ "type": "string",
3854
+ "required": false,
3855
+ "maxLength": 80
3856
+ }
1589
3857
  }
1590
3858
  },
1591
3859
  "testimonial": {
@@ -1594,7 +3862,7 @@
1594
3862
  "component": "Testimonial",
1595
3863
  "category": "testimonial",
1596
3864
  "description": "Auto-advancing testimonial carousel showing one quote card at a time with decorative quote marks, author details, and dot pagination.",
1597
- "purpose": "A full-width testimonial carousel section that displays one quote card at a time — with decorative quote marks, the quote text, an optional author avatar, name, and location — and auto-advances through the slides every 5 seconds, with dot pagination for manual navigation. This block is designed to build trust with partner or customer voices, giving each quote full visual focus.",
3865
+ "purpose": "A full-width testimonial carousel section that displays one quote card at a time — with decorative quote marks, the quote text, an optional author avatar, name, and location — and auto-advances through the slides every 5 seconds, with dot pagination for manual navigation. This block is designed to build trust with partner or customer voices, giving each quote full visual focus. The 5-second auto-advance is **not configurable** — there is no prop to slow it down or switch it off. The block's only props are `title`, `items` and `className`.",
1598
3866
  "keywords": [
1599
3867
  "testimonial",
1600
3868
  "quote",
@@ -1644,9 +3912,39 @@
1644
3912
  "imageRoles": [
1645
3913
  "author-avatar"
1646
3914
  ],
1647
- "defaultValues": {
1648
- "autoAdvance": true,
1649
- "autoAdvanceIntervalMs": 5000
3915
+ "defaultValues": {},
3916
+ "fields": {
3917
+ "items": {
3918
+ "type": "array",
3919
+ "required": true,
3920
+ "itemFields": {
3921
+ "authorLocation": {
3922
+ "type": "string",
3923
+ "required": false,
3924
+ "maxLength": 60
3925
+ },
3926
+ "authorName": {
3927
+ "type": "string",
3928
+ "required": true,
3929
+ "maxLength": 60
3930
+ },
3931
+ "avatarUrl": {
3932
+ "type": "image",
3933
+ "required": false,
3934
+ "aspectRatio": "1:1"
3935
+ },
3936
+ "quote": {
3937
+ "type": "string",
3938
+ "required": true,
3939
+ "maxLength": 400
3940
+ }
3941
+ }
3942
+ },
3943
+ "title": {
3944
+ "type": "string",
3945
+ "required": false,
3946
+ "maxLength": 80
3947
+ }
1650
3948
  }
1651
3949
  },
1652
3950
  "text-scroll": {
@@ -1655,7 +3953,7 @@
1655
3953
  "component": "TextScroll",
1656
3954
  "category": "scroll-animation",
1657
3955
  "description": "Large headline paragraph whose words fade in one by one on scroll, a scrubbed word-reveal effect for mission statements and brand messages.",
1658
- "purpose": "A full-width section rendering a single large headline paragraph whose words individually fade from dimmed (20% opacity) to fully opaque as the user scrolls past, producing a scrubbed word-reveal effect powered by GSAP ScrollTrigger. This block is designed for one emphatic block of copy — a mission statement or brand message — that earns attention through the scroll-tied reveal.",
3956
+ "purpose": "A full-width section rendering a single large headline paragraph whose words individually fade from dimmed (20% opacity) to fully opaque as the user scrolls past, producing a scrubbed word-reveal effect powered by GSAP ScrollTrigger. This block is designed for one emphatic block of copy — a mission statement or brand message — that earns attention through the scroll-tied reveal. The animation timings are **not configurable** — the 20% start opacity, the scrub rate, and the per-word stagger are fixed inside the component. The block's only props are `text` and `className`.",
1659
3957
  "keywords": [
1660
3958
  "text",
1661
3959
  "scroll",
@@ -1699,10 +3997,13 @@
1699
3997
  "avatar": false
1700
3998
  },
1701
3999
  "imageRoles": [],
1702
- "defaultValues": {
1703
- "initialWordOpacity": 0.2,
1704
- "scrub": 2,
1705
- "stagger": 0.1
4000
+ "defaultValues": {},
4001
+ "fields": {
4002
+ "text": {
4003
+ "type": "string",
4004
+ "required": true,
4005
+ "maxLength": 300
4006
+ }
1706
4007
  }
1707
4008
  }
1708
4009
  }