@supersoniks/concorde 5.0.5 → 5.1.0

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.
Files changed (168) hide show
  1. package/.github/workflows/ci.yml +21 -0
  2. package/.github-export-ignore +30 -0
  3. package/.tmp-cem/custom-elements.json +13705 -0
  4. package/CONTRIBUTING.md +59 -0
  5. package/DEV.md +54 -0
  6. package/LICENSE +21 -0
  7. package/OPEN_SOURCE_CHECKPOINT.md +133 -0
  8. package/build-infos.json +1 -1
  9. package/concorde-3d.bundle.js +3960 -0
  10. package/concorde-3d.es.js +33433 -0
  11. package/concorde-core.bundle.js +196 -196
  12. package/concorde-core.es.js +3685 -3405
  13. package/concorde-hugging-face-infer.bundle.js +32 -0
  14. package/concorde-hugging-face-infer.es.js +2952 -0
  15. package/concorde-interactive.bundle.js +1157 -0
  16. package/concorde-interactive.es.js +10734 -0
  17. package/concorde-shader.bundle.js +116 -0
  18. package/concorde-shader.es.js +8353 -0
  19. package/concorde-webgpu.bundle.js +307 -0
  20. package/concorde-webgpu.es.js +8627 -0
  21. package/custom-elements-manifest.config.mjs +14 -0
  22. package/dist/concorde-core.bundle.js +196 -196
  23. package/dist/concorde-core.es.js +3685 -3405
  24. package/docs/assets/{index-wVZpLVYW.js → index-D8MVWqY6.js} +1351 -1222
  25. package/docs/assets/index-DiD0qYvE.css +1 -0
  26. package/docs/crawl/core/components/ui/alert/alert.html +71 -172
  27. package/docs/crawl/core/components/ui/alert-messages/alert-messages.html +5 -113
  28. package/docs/crawl/core/components/ui/badge/badge.html +79 -157
  29. package/docs/crawl/core/components/ui/button/button.html +0 -1
  30. package/docs/crawl/core/components/ui/captcha/captcha.html +8 -90
  31. package/docs/crawl/core/components/ui/card/card.html +68 -222
  32. package/docs/crawl/core/components/ui/divider/divider.html +31 -117
  33. package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +101 -232
  34. package/docs/crawl/core/components/ui/form/form-actions/form-actions.html +52 -95
  35. package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +38 -97
  36. package/docs/crawl/core/components/ui/form/input/input.html +3 -3
  37. package/docs/crawl/core/components/ui/form/textarea/textarea.html +3 -3
  38. package/docs/crawl/core/components/ui/group/group.html +38 -60
  39. package/docs/crawl/core/components/ui/icon/icon.html +47 -136
  40. package/docs/crawl/core/components/ui/image/image.html +56 -244
  41. package/docs/crawl/core/components/ui/link/link.html +9 -67
  42. package/docs/crawl/core/components/ui/loader/loader.html +23 -97
  43. package/docs/crawl/core/components/ui/menu/menu.html +90 -162
  44. package/docs/crawl/core/components/ui/modal/modal.html +50 -275
  45. package/docs/crawl/core/components/ui/pop/pop.html +66 -260
  46. package/docs/crawl/core/components/ui/progress/progress.html +30 -103
  47. package/docs/crawl/core/components/ui/table/table.html +171 -303
  48. package/docs/crawl/core/components/ui/toast/toast.html +59 -170
  49. package/docs/crawl/core/components/ui/tooltip/tooltip.html +29 -90
  50. package/docs/crawl/docs/_decorators/ancestor-attribute.html +2 -3
  51. package/docs/crawl/docs/_getting-started/concorde-outside.html +3 -3
  52. package/docs/crawl/docs/_getting-started/start.html +1 -1
  53. package/docs/crawl/docs/_getting-started/theming.html +63 -311
  54. package/docs/crawl/hubs/form-components.html +53 -75
  55. package/docs/crawl/index.html +6 -7
  56. package/docs/docs-mock-api-sw.js +0 -2
  57. package/docs/docs-mock-api-sw.js.map +2 -2
  58. package/docs/index.html +7 -9
  59. package/docs/llms-full.txt +456 -1703
  60. package/docs/llms.txt +32 -25
  61. package/docs/sitemap.xml +0 -3
  62. package/docs/src/core/components/functional/fetch/fetch.md +0 -0
  63. package/docs/src/core/components/functional/if/if.md +0 -0
  64. package/docs/src/core/components/functional/list/list.md +0 -0
  65. package/docs/src/core/components/functional/router/router.md +0 -0
  66. package/docs/src/core/components/functional/sdui/sdui.md +0 -0
  67. package/docs/src/core/components/functional/states/states.md +0 -0
  68. package/docs/src/core/components/functional/submit/submit.md +0 -0
  69. package/docs/src/core/components/ui/alert/alert.md +72 -147
  70. package/docs/src/core/components/ui/alert-messages/alert-messages.md +0 -85
  71. package/docs/src/core/components/ui/badge/badge.md +80 -141
  72. package/docs/src/core/components/ui/button/button.md +0 -1
  73. package/docs/src/core/components/ui/captcha/captcha.md +6 -65
  74. package/docs/src/core/components/ui/card/card.md +65 -183
  75. package/docs/src/core/components/ui/divider/divider.md +13 -107
  76. package/docs/src/core/components/ui/form/fieldset/fieldset.md +99 -175
  77. package/docs/src/core/components/ui/form/form-actions/form-actions.md +52 -75
  78. package/docs/src/core/components/ui/form/form-layout/form-layout.md +34 -109
  79. package/docs/src/core/components/ui/form/input/input.md +1 -1
  80. package/docs/src/core/components/ui/form/radio/radio.md +0 -0
  81. package/docs/src/core/components/ui/form/select/select.md +0 -0
  82. package/docs/src/core/components/ui/form/switch/switch.md +0 -0
  83. package/docs/src/core/components/ui/form/textarea/textarea.md +1 -1
  84. package/docs/src/core/components/ui/group/group.md +36 -36
  85. package/docs/src/core/components/ui/icon/icon.md +43 -132
  86. package/docs/src/core/components/ui/image/image.md +53 -179
  87. package/docs/src/core/components/ui/link/link.md +7 -45
  88. package/docs/src/core/components/ui/loader/loader.md +22 -79
  89. package/docs/src/core/components/ui/menu/menu.md +92 -133
  90. package/docs/src/core/components/ui/modal/modal.md +47 -163
  91. package/docs/src/core/components/ui/pop/pop.md +64 -262
  92. package/docs/src/core/components/ui/progress/progress.md +30 -76
  93. package/docs/src/core/components/ui/table/table.md +171 -147
  94. package/docs/src/core/components/ui/toast/toast.md +58 -108
  95. package/docs/src/core/components/ui/tooltip/tooltip.md +26 -68
  96. package/docs/src/docs/_core-concept/subscriber.md +0 -0
  97. package/docs/src/docs/_decorators/ancestor-attribute.md +2 -3
  98. package/docs/src/docs/_getting-started/concorde-outside.md +3 -3
  99. package/docs/src/docs/_getting-started/my-first-subscriber.md +0 -0
  100. package/docs/src/docs/_getting-started/pubsub.md +0 -0
  101. package/docs/src/docs/_getting-started/start.md +1 -1
  102. package/docs/src/docs/_getting-started/theming.md +61 -223
  103. package/docs/src/docs/search/docs-search.json +348 -3083
  104. package/docs/src/tsconfig.declarations.json +22 -0
  105. package/docs/src/tsconfig.emit.json +23 -0
  106. package/docs/src/tsconfig.json +3 -63
  107. package/gitlab/job_github_mirror.sh +39 -0
  108. package/package.json +36 -2
  109. package/scripts/generate-sdui-catalog.mjs +250 -0
  110. package/scripts/generate-sdui-catalog.spec.ts +91 -0
  111. package/scripts/github-export.mjs +150 -0
  112. package/scripts/post-build-docs.js +0 -0
  113. package/scripts/post-build.mjs +0 -0
  114. package/scripts/pre-build.mjs +15 -0
  115. package/src/core/components/functional/fetch/fetch.md +0 -0
  116. package/src/core/components/functional/if/if.md +0 -0
  117. package/src/core/components/functional/if/if.ts +0 -0
  118. package/src/core/components/functional/list/list.demo.ts +0 -0
  119. package/src/core/components/functional/list/list.md +0 -0
  120. package/src/core/components/functional/router/router.md +0 -0
  121. package/src/core/components/functional/router/router.ts +0 -0
  122. package/src/core/components/functional/sdui/SDUIDescriptorTransformer.ts +5 -5
  123. package/src/core/components/functional/sdui/__fixtures__/descriptors.ts +251 -0
  124. package/src/core/components/functional/sdui/__snapshots__/sdui-action.spec.ts.snap +73 -0
  125. package/src/core/components/functional/sdui/__snapshots__/sdui-incremental.spec.ts.snap +50 -0
  126. package/src/core/components/functional/sdui/__snapshots__/sdui-partial.spec.ts.snap +50 -0
  127. package/src/core/components/functional/sdui/__snapshots__/sdui.regression.spec.ts.snap +461 -0
  128. package/src/core/components/functional/sdui/component-catalog.gaps.json +511 -0
  129. package/src/core/components/functional/sdui/component-catalog.json +3103 -0
  130. package/src/core/components/functional/sdui/component-catalog.spec.ts +23 -0
  131. package/src/core/components/functional/sdui/sdui-action.spec.ts +99 -0
  132. package/src/core/components/functional/sdui/sdui-dom-snapshot.ts +61 -0
  133. package/src/core/components/functional/sdui/sdui-extension-points.md +94 -0
  134. package/src/core/components/functional/sdui/sdui-incremental.spec.ts +137 -0
  135. package/src/core/components/functional/sdui/sdui-partial.spec.ts +83 -0
  136. package/src/core/components/functional/sdui/sdui-partial.ts +19 -0
  137. package/src/core/components/functional/sdui/sdui-safe.spec.ts +188 -0
  138. package/src/core/components/functional/sdui/sdui-safe.ts +100 -0
  139. package/src/core/components/functional/sdui/sdui.md +122 -0
  140. package/src/core/components/functional/sdui/sdui.regression.spec.ts +64 -0
  141. package/src/core/components/functional/sdui/sdui.ts +442 -34
  142. package/src/core/components/functional/sdui/types.ts +49 -0
  143. package/src/core/components/functional/states/states.md +0 -0
  144. package/src/core/components/functional/submit/submit.md +0 -0
  145. package/src/core/components/functional/subscriber/subscriber.ts +0 -0
  146. package/src/core/components/functional/value/value.ts +0 -0
  147. package/src/core/components/ui/_css/size.ts +0 -0
  148. package/src/core/components/ui/captcha/altchaStyles.ts +0 -0
  149. package/src/core/components/ui/form/radio/radio.md +0 -0
  150. package/src/core/components/ui/form/select/select.md +0 -0
  151. package/src/core/components/ui/form/switch/switch.md +0 -0
  152. package/src/core/mixins/Subscriber.ts +0 -0
  153. package/src/core/utils/DataBindObserver.ts +0 -0
  154. package/src/core/utils/Objects.ts +0 -0
  155. package/src/core/utils/route.ts +0 -0
  156. package/src/css.d.ts +19 -0
  157. package/src/docs/_core-concept/subscriber.md +0 -0
  158. package/src/docs/_getting-started/my-first-subscriber.md +0 -0
  159. package/src/docs/_getting-started/pubsub.md +0 -0
  160. package/src/docs/example/users.ts +0 -0
  161. package/src/docs/search/page.ts +0 -0
  162. package/src/tsconfig.declarations.json +22 -0
  163. package/src/tsconfig.emit.json +23 -0
  164. package/src/tsconfig.json +90 -0
  165. package/src/tsconfig.tsbuildinfo +1 -1
  166. package/docs/assets/index-CD4WyL6o.css +0 -1
  167. package/docs/crawl/core/components/ui/theme/theme.html +0 -131
  168. package/docs/src/core/components/ui/theme/theme.md +0 -122
@@ -517,12 +517,22 @@
517
517
  }
518
518
  }
519
519
  },
520
+ "core/components/ui/icon/icon.md": {
521
+ "title": "Icon",
522
+ "hashes": {
523
+ "custom": {
524
+ "count": 1,
525
+ "title": "Custom",
526
+ "type": "paragraph"
527
+ }
528
+ }
529
+ },
520
530
  "core/components/ui/loader/loader.md": {
521
531
  "title": "Loader",
522
532
  "hashes": {
523
- "mode": {
533
+ "fixed-mode": {
524
534
  "count": 1,
525
- "title": "Mode",
535
+ "title": "Fixed mode",
526
536
  "type": "paragraph"
527
537
  }
528
538
  }
@@ -2405,134 +2415,44 @@
2405
2415
  }
2406
2416
  },
2407
2417
  {
2408
- "search": "Alerts surface important feedback inline—errors, confirmations, or contextual help. Use label / text for simple copy, or the default slot for rich content (links, buttons). Set announce when the message appears after an action so screen readers pick it up.\n",
2418
+ "search": "Badge",
2409
2419
  "files": {
2410
- "core/components/ui/alert/alert.md": {
2411
- "title": "Alert",
2420
+ "core/components/ui/badge/badge.md": {
2421
+ "title": "Badge",
2412
2422
  "hashes": {
2413
- "alert": {
2423
+ "badge": {
2414
2424
  "count": 1,
2415
2425
  "title": "",
2416
- "type": "paragraph"
2417
- }
2418
- }
2419
- }
2420
- }
2421
- },
2422
- {
2423
- "search": "Color and icon follow status. With no status, behavior is default.\n",
2424
- "files": {
2425
- "core/components/ui/alert/alert.md": {
2426
- "title": "Alert",
2427
- "hashes": {
2428
- "status": {
2429
- "count": 1,
2430
- "title": "Status",
2431
- "type": "paragraph"
2432
- }
2433
- }
2434
- }
2435
- }
2436
- },
2437
- {
2438
- "search": "By default, an alert already in the DOM is not announced (no role / aria-live). Set announce when the message appears after user action (API response, validation, etc.): screen readers get role="alert" for error, otherwise role="status" and aria-live="polite".\n",
2439
- "files": {
2440
- "core/components/ui/alert/alert.md": {
2441
- "title": "Alert",
2442
- "hashes": {
2443
- "accessibility-announce": {
2444
- "count": 1,
2445
- "title": "Accessibility (`announce`)",
2446
- "type": "paragraph"
2447
- }
2448
- }
2449
- }
2450
- }
2451
- },
2452
- {
2453
- "search": "sonic-alert-messages sets announce on every rendered alert.\n",
2454
- "files": {
2455
- "core/components/ui/alert/alert.md": {
2456
- "title": "Alert",
2457
- "hashes": {
2458
- "accessibility-announce": {
2459
- "count": 1,
2460
- "title": "Accessibility (`announce`)",
2461
- "type": "paragraph"
2462
- }
2463
- }
2464
- }
2465
- }
2466
- },
2467
- {
2468
- "search": "label and text accept plain text only. The default slot is rendered after text. Use the icon slot to replace the default sonic-icon. noIcon hides the icon.\n",
2469
- "files": {
2470
- "core/components/ui/alert/alert.md": {
2471
- "title": "Alert",
2472
- "hashes": {
2473
- "content-and-icon": {
2474
- "count": 1,
2475
- "title": "Content and icon",
2476
- "type": "paragraph"
2477
- }
2478
- }
2479
- }
2480
- }
2481
- },
2482
- {
2483
- "search": "Project any markup into slot="icon" (emoji, image, custom component). Keep it decorative with aria-hidden="true" when the message text already conveys meaning.\n",
2484
- "files": {
2485
- "core/components/ui/alert/alert.md": {
2486
- "title": "Alert",
2487
- "hashes": {
2488
- "custom-icon-slot": {
2489
- "count": 1,
2490
- "title": "Custom icon slot",
2491
- "type": "paragraph"
2492
- }
2493
- }
2494
- }
2495
- }
2496
- },
2497
- {
2498
- "search": "Rich content in the slot (buttons, links).\n",
2499
- "files": {
2500
- "core/components/ui/alert/alert.md": {
2501
- "title": "Alert",
2502
- "hashes": {
2503
- "alert-with-link": {
2504
- "count": 1,
2505
- "title": "Alert with link",
2506
- "type": "paragraph"
2426
+ "type": "page"
2507
2427
  }
2508
2428
  }
2509
2429
  }
2510
2430
  }
2511
2431
  },
2512
2432
  {
2513
- "search": "Tinted background from the status color (color-mix on currentColor).\n",
2433
+ "search": "Button",
2514
2434
  "files": {
2515
- "core/components/ui/alert/alert.md": {
2516
- "title": "Alert",
2435
+ "core/components/ui/button/button.md": {
2436
+ "title": "Button",
2517
2437
  "hashes": {
2518
- "background": {
2438
+ "button": {
2519
2439
  "count": 1,
2520
- "title": "Background",
2521
- "type": "paragraph"
2440
+ "title": "",
2441
+ "type": "page"
2522
2442
  }
2523
2443
  }
2524
2444
  }
2525
2445
  }
2526
2446
  },
2527
2447
  {
2528
- "search": "dismissible removes the alert from the DOM when the close control is clicked (i18n aria label). dismissible and background are independent: without background, close sits at the end of the row; with background, top-right.\n",
2448
+ "search": "The length of the button depends on the size of its content\n\n",
2529
2449
  "files": {
2530
- "core/components/ui/alert/alert.md": {
2531
- "title": "Alert",
2450
+ "core/components/ui/button/button.md": {
2451
+ "title": "Button",
2532
2452
  "hashes": {
2533
- "dismissible": {
2453
+ "loading": {
2534
2454
  "count": 1,
2535
- "title": "Dismissible",
2455
+ "title": "Loading",
2536
2456
  "type": "paragraph"
2537
2457
  }
2538
2458
  }
@@ -2540,27 +2460,27 @@
2540
2460
  }
2541
2461
  },
2542
2462
  {
2543
- "search": "With dismissForever, dismissal is stored in localStorage (key sonic-alert-dismissed). A stable id on the element is required; without id, a warning is logged and nothing is persisted.\n",
2463
+ "search": "Captcha",
2544
2464
  "files": {
2545
- "core/components/ui/alert/alert.md": {
2546
- "title": "Alert",
2465
+ "core/components/ui/captcha/captcha.md": {
2466
+ "title": "Captcha",
2547
2467
  "hashes": {
2548
- "dismiss-forever": {
2468
+ "captcha": {
2549
2469
  "count": 1,
2550
- "title": "Dismiss forever",
2551
- "type": "paragraph"
2470
+ "title": "",
2471
+ "type": "page"
2552
2472
  }
2553
2473
  }
2554
2474
  }
2555
2475
  }
2556
2476
  },
2557
2477
  {
2558
- "search": "Alert messages",
2478
+ "search": "Card",
2559
2479
  "files": {
2560
- "core/components/ui/alert-messages/alert-messages.md": {
2561
- "title": "Alert messages",
2480
+ "core/components/ui/card/card.md": {
2481
+ "title": "Card",
2562
2482
  "hashes": {
2563
- "alert-messages": {
2483
+ "card": {
2564
2484
  "count": 1,
2565
2485
  "title": "",
2566
2486
  "type": "page"
@@ -2570,44 +2490,44 @@
2570
2490
  }
2571
2491
  },
2572
2492
  {
2573
- "search": "sonic-alert-messages renders a vertical stack of sonic-alert items from a messages array on a linked data provider (typical pattern: submitResultDataProvider after a form submit). Only entries with type="public" are shown. Each alert gets announce so screen readers pick up feedback after the request.\n",
2493
+ "search": "Divider",
2574
2494
  "files": {
2575
- "core/components/ui/alert-messages/alert-messages.md": {
2576
- "title": "Alert messages",
2495
+ "core/components/ui/divider/divider.md": {
2496
+ "title": "Divider",
2577
2497
  "hashes": {
2578
- "alert-messages": {
2498
+ "divider": {
2579
2499
  "count": 1,
2580
2500
  "title": "",
2581
- "type": "paragraph"
2501
+ "type": "page"
2582
2502
  }
2583
2503
  }
2584
2504
  }
2585
2505
  }
2586
2506
  },
2587
2507
  {
2588
- "search": "Bind dataProvider to the same publisher as submitResultDataProvider. API messages entries need type: public, plus content and optional status (warning · success · error · info).\n",
2508
+ "search": "Checkbox",
2589
2509
  "files": {
2590
- "core/components/ui/alert-messages/alert-messages.md": {
2591
- "title": "Alert messages",
2510
+ "core/components/ui/form/checkbox/checkbox.md": {
2511
+ "title": "Checkbox",
2592
2512
  "hashes": {
2593
- "with-submit-result": {
2513
+ "checkbox": {
2594
2514
  "count": 1,
2595
- "title": "With submit result",
2596
- "type": "paragraph"
2515
+ "title": "",
2516
+ "type": "page"
2597
2517
  }
2598
2518
  }
2599
2519
  }
2600
2520
  }
2601
2521
  },
2602
2522
  {
2603
- "search": "size · background and noIcon apply to every rendered sonic-alert in the list.\n",
2523
+ "search": "Checked blacklistFlags values are sent to the mock API (?blacklistFlags=racist,sexist,…), which excludes jokes whose flags match (see filterDocsJokes in src/docs/mock-api/fixtures.ts).\n",
2604
2524
  "files": {
2605
- "core/components/ui/alert-messages/alert-messages.md": {
2606
- "title": "Alert messages",
2525
+ "core/components/ui/form/checkbox/checkbox.md": {
2526
+ "title": "Checkbox",
2607
2527
  "hashes": {
2608
- "shared-alert-props": {
2528
+ "example-of-use--blacklist--queue": {
2609
2529
  "count": 1,
2610
- "title": "Shared alert props",
2530
+ "title": "Example of use — blacklist + queue",
2611
2531
  "type": "paragraph"
2612
2532
  }
2613
2533
  }
@@ -2615,42 +2535,42 @@
2615
2535
  }
2616
2536
  },
2617
2537
  {
2618
- "search": "Example JSON on the result publisher (or API response merged into it):\n",
2538
+ "search": "Fieldset",
2619
2539
  "files": {
2620
- "core/components/ui/alert-messages/alert-messages.md": {
2621
- "title": "Alert messages",
2540
+ "core/components/ui/form/fieldset/fieldset.md": {
2541
+ "title": "Fieldset",
2622
2542
  "hashes": {
2623
- "message-shape": {
2543
+ "fieldset": {
2624
2544
  "count": 1,
2625
- "title": "Message shape",
2626
- "type": "paragraph"
2545
+ "title": "",
2546
+ "type": "page"
2627
2547
  }
2628
2548
  }
2629
2549
  }
2630
2550
  }
2631
2551
  },
2632
2552
  {
2633
- "search": "No slots — alerts are generated from messages.\n",
2553
+ "search": "Form-actions",
2634
2554
  "files": {
2635
- "core/components/ui/alert-messages/alert-messages.md": {
2636
- "title": "Alert messages",
2555
+ "core/components/ui/form/form-actions/form-actions.md": {
2556
+ "title": "Form-actions",
2637
2557
  "hashes": {
2638
- "api-reference": {
2558
+ "form-actions": {
2639
2559
  "count": 1,
2640
- "title": "API reference",
2641
- "type": "paragraph"
2560
+ "title": "",
2561
+ "type": "page"
2642
2562
  }
2643
2563
  }
2644
2564
  }
2645
2565
  }
2646
2566
  },
2647
2567
  {
2648
- "search": "Badge",
2568
+ "search": "Form-layout",
2649
2569
  "files": {
2650
- "core/components/ui/badge/badge.md": {
2651
- "title": "Badge",
2570
+ "core/components/ui/form/form-layout/form-layout.md": {
2571
+ "title": "Form-layout",
2652
2572
  "hashes": {
2653
- "badge": {
2573
+ "form-layout": {
2654
2574
  "count": 1,
2655
2575
  "title": "",
2656
2576
  "type": "page"
@@ -2660,2669 +2580,29 @@
2660
2580
  }
2661
2581
  },
2662
2582
  {
2663
- "search": "Badges are compact, non-interactive labels for status, counts, or categories. They mirror sonic-button styling (type, variant, size) without focus rings or click handling—use a button when the control should be actionable.\n",
2583
+ "search": "Input",
2664
2584
  "files": {
2665
- "core/components/ui/badge/badge.md": {
2666
- "title": "Badge",
2585
+ "core/components/ui/form/input/input.md": {
2586
+ "title": "Input",
2667
2587
  "hashes": {
2668
- "badge": {
2588
+ "input": {
2669
2589
  "count": 1,
2670
2590
  "title": "",
2671
- "type": "paragraph"
2591
+ "type": "page"
2672
2592
  }
2673
2593
  }
2674
2594
  }
2675
2595
  }
2676
2596
  },
2677
2597
  {
2678
- "search": "default — subtle background (base-100). neutral — dark fill (base-content) with light text, useful on light backgrounds.\n",
2598
+ "search": "Liste des types\n",
2679
2599
  "files": {
2680
- "core/components/ui/badge/badge.md": {
2681
- "title": "Badge",
2600
+ "core/components/ui/form/input/input.md": {
2601
+ "title": "Input",
2682
2602
  "hashes": {
2683
2603
  "type": {
2684
2604
  "count": 1,
2685
- "title": "Type",
2686
- "type": "paragraph"
2687
- }
2688
- }
2689
- }
2690
- }
2691
- },
2692
- {
2693
- "search": "Default variant is filled. outline — border and text in the type color. ghost — text only, no padding (except in forced-colors mode).\n",
2694
- "files": {
2695
- "core/components/ui/badge/badge.md": {
2696
- "title": "Badge",
2697
- "hashes": {
2698
- "variant": {
2699
- "count": 1,
2700
- "title": "Variant",
2701
- "type": "paragraph"
2702
- }
2703
- }
2704
- }
2705
- }
2706
- },
2707
- {
2708
- "search": "Default size is md (omit the size attribute). Typography and padding follow sonic-button.\n",
2709
- "files": {
2710
- "core/components/ui/badge/badge.md": {
2711
- "title": "Badge",
2712
- "hashes": {
2713
- "size": {
2714
- "count": 1,
2715
- "title": "Size",
2716
- "type": "paragraph"
2717
- }
2718
- }
2719
- }
2720
- }
2721
- },
2722
- {
2723
- "search": "Icons or short text before / after the main label.\n",
2724
- "files": {
2725
- "core/components/ui/badge/badge.md": {
2726
- "title": "Badge",
2727
- "hashes": {
2728
- "prefix-and-suffix-slots": {
2729
- "count": 1,
2730
- "title": "Prefix and suffix slots",
2731
- "type": "paragraph"
2732
- }
2733
- }
2734
- }
2735
- }
2736
- },
2737
- {
2738
- "search": "Badge with no text (visual dot). min-width / min-height keep a readable shape.\n",
2739
- "files": {
2740
- "core/components/ui/badge/badge.md": {
2741
- "title": "Badge",
2742
- "hashes": {
2743
- "empty-badges": {
2744
- "count": 1,
2745
- "title": "Empty badges",
2746
- "type": "paragraph"
2747
- }
2748
- }
2749
- }
2750
- }
2751
- },
2752
- {
2753
- "search": "With ellipsis, long labels truncate. The parent must constrain width (max-width, grid, etc.).\n",
2754
- "files": {
2755
- "core/components/ui/badge/badge.md": {
2756
- "title": "Badge",
2757
- "hashes": {
2758
- "ellipsis": {
2759
- "count": 1,
2760
- "title": "Ellipsis",
2761
- "type": "paragraph"
2762
- }
2763
- }
2764
- }
2765
- }
2766
- },
2767
- {
2768
- "search": "Count inside a button (slot="suffix") or a badge absolutely positioned on a button / icon.\n",
2769
- "files": {
2770
- "core/components/ui/badge/badge.md": {
2771
- "title": "Badge",
2772
- "hashes": {
2773
- "badge-in-button": {
2774
- "count": 1,
2775
- "title": "Badge in button",
2776
- "type": "paragraph"
2777
- }
2778
- }
2779
- }
2780
- }
2781
- },
2782
- {
2783
- "search": "Button",
2784
- "files": {
2785
- "core/components/ui/button/button.md": {
2786
- "title": "Button",
2787
- "hashes": {
2788
- "button": {
2789
- "count": 1,
2790
- "title": "",
2791
- "type": "page"
2792
- }
2793
- }
2794
- }
2795
- }
2796
- },
2797
- {
2798
- "search": "The length of the button depends on the size of its content\n\n",
2799
- "files": {
2800
- "core/components/ui/button/button.md": {
2801
- "title": "Button",
2802
- "hashes": {
2803
- "loading": {
2804
- "count": 1,
2805
- "title": "Loading",
2806
- "type": "paragraph"
2807
- }
2808
- }
2809
- }
2810
- }
2811
- },
2812
- {
2813
- "search": "Captcha",
2814
- "files": {
2815
- "core/components/ui/captcha/captcha.md": {
2816
- "title": "Captcha",
2817
- "hashes": {
2818
- "captcha": {
2819
- "count": 1,
2820
- "title": "",
2821
- "type": "page"
2822
- }
2823
- }
2824
- }
2825
- }
2826
- },
2827
- {
2828
- "search": "sonic-captcha embeds an ALTCHA widget and wires captchaToken / needsCaptchaValidation on the ancestor formDataProvider (or headersDataProvider). sonic-submit waits for a token before sending when validation is required. The widget loads only on HTTPS; on plain HTTP the host renders nothing.\n",
2829
- "files": {
2830
- "core/components/ui/captcha/captcha.md": {
2831
- "title": "Captcha",
2832
- "hashes": {
2833
- "captcha": {
2834
- "count": 1,
2835
- "title": "",
2836
- "type": "paragraph"
2837
- }
2838
- }
2839
- }
2840
- }
2841
- },
2842
- {
2843
- "search": "Live widget calls the Supersoniks challenge service — not part of docs mock API.\n",
2844
- "files": {
2845
- "core/components/ui/captcha/captcha.md": {
2846
- "title": "Captcha",
2847
- "hashes": {
2848
- "captcha": {
2849
- "count": 1,
2850
- "title": "",
2851
- "type": "paragraph"
2852
- }
2853
- }
2854
- }
2855
- }
2856
- },
2857
- {
2858
- "search": "Wrap the form scope and place sonic-submit in the default slot so the challenge appears above the action.\n",
2859
- "files": {
2860
- "core/components/ui/captcha/captcha.md": {
2861
- "title": "Captcha",
2862
- "hashes": {
2863
- "basic-example": {
2864
- "count": 1,
2865
- "title": "Basic example",
2866
- "type": "paragraph"
2867
- }
2868
- }
2869
- }
2870
- }
2871
- },
2872
- {
2873
- "search": "Optional key skips client-side key generation. When omitted, the component derives an encrypted key on connect (after generateEncryptedKey).\n",
2874
- "files": {
2875
- "core/components/ui/captcha/captcha.md": {
2876
- "title": "Captcha",
2877
- "hashes": {
2878
- "encrypted-site-key": {
2879
- "count": 1,
2880
- "title": "Encrypted site key",
2881
- "type": "paragraph"
2882
- }
2883
- }
2884
- }
2885
- }
2886
- },
2887
- {
2888
- "search": "On connect (HTTPS only), needsCaptchaValidation is set to true and captchaToken is cleared. When the ALTCHA widget reaches verified, captchaToken is written on the form publisher and sonic-captcha-validate fires (detail.valid · detail.state · optional detail.token / detail.payload). sonic-submit still listens for request_token to refresh the token immediately before send.\n",
2889
- "files": {
2890
- "core/components/ui/captcha/captcha.md": {
2891
- "title": "Captcha",
2892
- "hashes": {
2893
- "form-publisher-fields": {
2894
- "count": 1,
2895
- "title": "Form publisher fields",
2896
- "type": "paragraph"
2897
- }
2898
- }
2899
- }
2900
- }
2901
- },
2902
- {
2903
- "search": "Related: Submit — needsCaptchaValidation and deferred send.\n",
2904
- "files": {
2905
- "core/components/ui/captcha/captcha.md": {
2906
- "title": "Captcha",
2907
- "hashes": {
2908
- "api-reference": {
2909
- "count": 1,
2910
- "title": "API reference",
2911
- "type": "paragraph"
2912
- }
2913
- }
2914
- }
2915
- }
2916
- },
2917
- {
2918
- "search": "Card",
2919
- "files": {
2920
- "core/components/ui/card/card.md": {
2921
- "title": "Card",
2922
- "hashes": {
2923
- "card": {
2924
- "count": 1,
2925
- "title": "",
2926
- "type": "page"
2927
- }
2928
- }
2929
- }
2930
- }
2931
- },
2932
- {
2933
- "search": "Cards group related content on a padded surface with radius, theme type colors, and elevation. Default shadow is lg. Compose sonic-card-header / sonic-card-main / sonic-card-footer, or place any markup in the default slot.\n",
2934
- "files": {
2935
- "core/components/ui/card/card.md": {
2936
- "title": "Card",
2937
- "hashes": {
2938
- "card": {
2939
- "count": 1,
2940
- "title": "",
2941
- "type": "paragraph"
2942
- }
2943
- }
2944
- }
2945
- }
2946
- },
2947
- {
2948
- "search": "Default type is base. default and light share the same surface tokens.\n",
2949
- "files": {
2950
- "core/components/ui/card/card.md": {
2951
- "title": "Card",
2952
- "hashes": {
2953
- "type": {
2954
- "count": 1,
2955
- "title": "Type",
2956
- "type": "paragraph"
2957
- }
2958
- }
2959
- }
2960
- }
2961
- },
2962
- {
2963
- "search": "Set shadow to control elevation. Default is lg.\n",
2964
- "files": {
2965
- "core/components/ui/card/card.md": {
2966
- "title": "Card",
2967
- "hashes": {
2968
- "shadow": {
2969
- "count": 1,
2970
- "title": "Shadow",
2971
- "type": "paragraph"
2972
- }
2973
- }
2974
- }
2975
- }
2976
- },
2977
- {
2978
- "search": "Quick titles with label and description, or full control through the default slot. slot="suffix" aligns badges or actions on the right; suffix content does not shrink when the title wraps.\n",
2979
- "files": {
2980
- "core/components/ui/card/card.md": {
2981
- "title": "Card",
2982
- "hashes": {
2983
- "header": {
2984
- "count": 1,
2985
- "title": "Header",
2986
- "type": "paragraph"
2987
- }
2988
- }
2989
- }
2990
- }
2991
- },
2992
- {
2993
- "search": "label and description accept HTML (rendered as markup). Prefer plain text when possible; use sonic-card-header-description or the default slot for structured content.\n",
2994
- "files": {
2995
- "core/components/ui/card/card.md": {
2996
- "title": "Card",
2997
- "hashes": {
2998
- "header": {
2999
- "count": 1,
3000
- "title": "Header",
3001
- "type": "paragraph"
3002
- }
3003
- }
3004
- }
3005
- }
3006
- },
3007
- {
3008
- "search": "Optional wrapper for the primary content area (typography, media, forms).\n",
3009
- "files": {
3010
- "core/components/ui/card/card.md": {
3011
- "title": "Card",
3012
- "hashes": {
3013
- "main": {
3014
- "count": 1,
3015
- "title": "Main",
3016
- "type": "paragraph"
3017
- }
3018
- }
3019
- }
3020
- }
3021
- },
3022
- {
3023
- "search": "Optional footer for actions, metadata, or secondary text.\n",
3024
- "files": {
3025
- "core/components/ui/card/card.md": {
3026
- "title": "Card",
3027
- "hashes": {
3028
- "footer": {
3029
- "count": 1,
3030
- "title": "Footer",
3031
- "type": "paragraph"
3032
- }
3033
- }
3034
- }
3035
- }
3036
- },
3037
- {
3038
- "search": "Header, media, body, and footer together.\n",
3039
- "files": {
3040
- "core/components/ui/card/card.md": {
3041
- "title": "Card",
3042
- "hashes": {
3043
- "full-example": {
3044
- "count": 1,
3045
- "title": "Full example",
3046
- "type": "paragraph"
3047
- }
3048
- }
3049
- }
3050
- }
3051
- },
3052
- {
3053
- "search": "Divider",
3054
- "files": {
3055
- "core/components/ui/divider/divider.md": {
3056
- "title": "Divider",
3057
- "hashes": {
3058
- "divider": {
3059
- "count": 1,
3060
- "title": "",
3061
- "type": "page"
3062
- }
3063
- }
3064
- }
3065
- }
3066
- },
3067
- {
3068
- "search": "sonic-divider draws a horizontal or vertical rule with optional centered label copy. Use it to separate sections in forms, cards, and sonic-menu. Set label for simple HTML captions or use the default slot for richer markup; default align is center and default lineStyle is solid.\n",
3069
- "files": {
3070
- "core/components/ui/divider/divider.md": {
3071
- "title": "Divider",
3072
- "hashes": {
3073
- "divider": {
3074
- "count": 1,
3075
- "title": "",
3076
- "type": "paragraph"
3077
- }
3078
- }
3079
- }
3080
- }
3081
- },
3082
- {
3083
- "search": "A bare divider is a full-width line with vertical margin. Omit size to use the host default spacing (0.5rem block margin).\n",
3084
- "files": {
3085
- "core/components/ui/divider/divider.md": {
3086
- "title": "Divider",
3087
- "hashes": {
3088
- "basic-example": {
3089
- "count": 1,
3090
- "title": "Basic example",
3091
- "type": "paragraph"
3092
- }
3093
- }
3094
- }
3095
- }
3096
- },
3097
- {
3098
- "search": "label renders inside the line (HTML via the same pipeline as other form labels). align controls which side(s) of the line remain visible: left drops the leading segment, right drops the trailing segment, center keeps both.\n",
3099
- "files": {
3100
- "core/components/ui/divider/divider.md": {
3101
- "title": "Divider",
3102
- "hashes": {
3103
- "label-and-align": {
3104
- "count": 1,
3105
- "title": "Label and align",
3106
- "type": "paragraph"
3107
- }
3108
- }
3109
- }
3110
- }
3111
- },
3112
- {
3113
- "search": "size adjusts block margin and label font size. Values follow the shared Concorde scale (2xs … 2xl).\n",
3114
- "files": {
3115
- "core/components/ui/divider/divider.md": {
3116
- "title": "Divider",
3117
- "hashes": {
3118
- "size": {
3119
- "count": 1,
3120
- "title": "Size",
3121
- "type": "paragraph"
3122
- }
3123
- }
3124
- }
3125
- }
3126
- },
3127
- {
3128
- "search": "lineStyle sets the stroke of the rule (solid · dashed · dotted). In HTML use the reflected attribute linestyle (case-insensitive).\n",
3129
- "files": {
3130
- "core/components/ui/divider/divider.md": {
3131
- "title": "Divider",
3132
- "hashes": {
3133
- "line-style": {
3134
- "count": 1,
3135
- "title": "Line style",
3136
- "type": "paragraph"
3137
- }
3138
- }
3139
- }
3140
- }
3141
- },
3142
- {
3143
- "search": "Set vertical for a column rule (for example between toolbar actions). noMargin removes host margin when a parent layout already provides spacing.\n",
3144
- "files": {
3145
- "core/components/ui/divider/divider.md": {
3146
- "title": "Divider",
3147
- "hashes": {
3148
- "vertical-and-margin": {
3149
- "count": 1,
3150
- "title": "Vertical and margin",
3151
- "type": "paragraph"
3152
- }
3153
- }
3154
- }
3155
- }
3156
- },
3157
- {
3158
- "search": "Slotted content replaces or augments label. Useful for badges, icons, or mixed markup in menus.\n",
3159
- "files": {
3160
- "core/components/ui/divider/divider.md": {
3161
- "title": "Divider",
3162
- "hashes": {
3163
- "default-slot": {
3164
- "count": 1,
3165
- "title": "Default slot",
3166
- "type": "paragraph"
3167
- }
3168
- }
3169
- }
3170
- }
3171
- },
3172
- {
3173
- "search": "On sonic-card with semantic type (primary · warning · danger · info · success), the rule uses the card’s text color at reduced opacity so it stays visible on tinted surfaces. label and slotted captions use the same foreground color as surrounding copy.\n",
3174
- "files": {
3175
- "core/components/ui/divider/divider.md": {
3176
- "title": "Divider",
3177
- "hashes": {
3178
- "inside-typed-cards": {
3179
- "count": 1,
3180
- "title": "Inside typed cards",
3181
- "type": "paragraph"
3182
- }
3183
- }
3184
- }
3185
- }
3186
- },
3187
- {
3188
- "search": "The inner flex container exposes part="divider" for theme overrides.\n",
3189
- "files": {
3190
- "core/components/ui/divider/divider.md": {
3191
- "title": "Divider",
3192
- "hashes": {
3193
- "api-reference": {
3194
- "count": 1,
3195
- "title": "API reference",
3196
- "type": "paragraph"
3197
- }
3198
- }
3199
- }
3200
- }
3201
- },
3202
- {
3203
- "search": "Checkbox",
3204
- "files": {
3205
- "core/components/ui/form/checkbox/checkbox.md": {
3206
- "title": "Checkbox",
3207
- "hashes": {
3208
- "checkbox": {
3209
- "count": 1,
3210
- "title": "",
3211
- "type": "page"
3212
- }
3213
- }
3214
- }
3215
- }
3216
- },
3217
- {
3218
- "search": "Checked blacklistFlags values are sent to the mock API (?blacklistFlags=racist,sexist,…), which excludes jokes whose flags match (see filterDocsJokes in src/docs/mock-api/fixtures.ts).\n",
3219
- "files": {
3220
- "core/components/ui/form/checkbox/checkbox.md": {
3221
- "title": "Checkbox",
3222
- "hashes": {
3223
- "example-of-use--blacklist--queue": {
3224
- "count": 1,
3225
- "title": "Example of use — blacklist + queue",
3226
- "type": "paragraph"
3227
- }
3228
- }
3229
- }
3230
- }
3231
- },
3232
- {
3233
- "search": "Fieldset",
3234
- "files": {
3235
- "core/components/ui/form/fieldset/fieldset.md": {
3236
- "title": "Fieldset",
3237
- "hashes": {
3238
- "fieldset": {
3239
- "count": 1,
3240
- "title": "",
3241
- "type": "page"
3242
- }
3243
- }
3244
- }
3245
- }
3246
- },
3247
- {
3248
- "search": "sonic-fieldset groups related form controls with a bordered container and an accessible <fieldset> semantics layer. Put fields in the default slot; add a title with sonic-legend or the shorthand label / description / iconName attributes. Default variant is default. Pair the body with sonic-form-layout for responsive columns.\n",
3249
- "files": {
3250
- "core/components/ui/form/fieldset/fieldset.md": {
3251
- "title": "Fieldset",
3252
- "hashes": {
3253
- "fieldset": {
3254
- "count": 1,
3255
- "title": "",
3256
- "type": "paragraph"
3257
- }
3258
- }
3259
- }
3260
- }
3261
- },
3262
- {
3263
- "search": "ghost and shadow use a transparent border; shadow also applies --sc-shadow-lg.\n",
3264
- "files": {
3265
- "core/components/ui/form/fieldset/fieldset.md": {
3266
- "title": "Fieldset",
3267
- "hashes": {
3268
- "variant": {
3269
- "count": 1,
3270
- "title": "Variant",
3271
- "type": "paragraph"
3272
- }
3273
- }
3274
- }
3275
- }
3276
- },
3277
- {
3278
- "search": "Set tight to remove horizontal padding and side borders (flat strip inside a parent).\n",
3279
- "files": {
3280
- "core/components/ui/form/fieldset/fieldset.md": {
3281
- "title": "Fieldset",
3282
- "hashes": {
3283
- "tight-layout": {
3284
- "count": 1,
3285
- "title": "Tight layout",
3286
- "type": "paragraph"
3287
- }
3288
- }
3289
- }
3290
- }
3291
- },
3292
- {
3293
- "search": "Use sonic-legend for the group title. Set label and description for simple copy, or use the default slot for custom markup. Add secondary text with sonic-legend-description. Place actions in slot="suffix" on the legend.\n",
3294
- "files": {
3295
- "core/components/ui/form/fieldset/fieldset.md": {
3296
- "title": "Fieldset",
3297
- "hashes": {
3298
- "legend": {
3299
- "count": 1,
3300
- "title": "Legend",
3301
- "type": "paragraph"
3302
- }
3303
- }
3304
- }
3305
- }
3306
- },
3307
- {
3308
- "search": "Attribute values on sonic-legend are rendered as HTML—use only trusted content.\n",
3309
- "files": {
3310
- "core/components/ui/form/fieldset/fieldset.md": {
3311
- "title": "Fieldset",
3312
- "hashes": {
3313
- "legend": {
3314
- "count": 1,
3315
- "title": "Legend",
3316
- "type": "paragraph"
3317
- }
3318
- }
3319
- }
3320
- }
3321
- },
3322
- {
3323
- "search": "When label is set on sonic-fieldset, the component renders sonic-legend for you. Pass description iconName iconLibrary and iconPrefix the same way. Do not combine shorthand label with a separate slotted sonic-legend—you will get two legends.\n",
3324
- "files": {
3325
- "core/components/ui/form/fieldset/fieldset.md": {
3326
- "title": "Fieldset",
3327
- "hashes": {
3328
- "shorthand-legend-on-the-fieldset": {
3329
- "count": 1,
3330
- "title": "Shorthand legend on the fieldset",
3331
- "type": "paragraph"
3332
- }
3333
- }
3334
- }
3335
- }
3336
- },
3337
- {
3338
- "search": "Use slot="suffix" on sonic-legend for menus or icon buttons aligned to the end of the legend row.\n",
3339
- "files": {
3340
- "core/components/ui/form/fieldset/fieldset.md": {
3341
- "title": "Fieldset",
3342
- "hashes": {
3343
- "legend-actions": {
3344
- "count": 1,
3345
- "title": "Legend actions",
3346
- "type": "paragraph"
3347
- }
3348
- }
3349
- }
3350
- }
3351
- },
3352
- {
3353
- "search": "Set form on sonic-fieldset to the id of a <form> elsewhere in the page (same as the native form attribute on <fieldset>). Named fields in the fieldset then belong to that form for submit and constraint validation—for example a toolbar form and a field group rendered lower on the layout.\n",
3354
- "files": {
3355
- "core/components/ui/form/fieldset/fieldset.md": {
3356
- "title": "Fieldset",
3357
- "hashes": {
3358
- "associating-a-distant-form": {
3359
- "count": 1,
3360
- "title": "Associating a distant `form`",
3361
- "type": "paragraph"
3362
- }
3363
- }
3364
- }
3365
- }
3366
- },
3367
- {
3368
- "search": "Set disabled on sonic-fieldset to disable the inner <fieldset> and every control in the group (same as a native fieldset). Use it for read-only steps or sections gated by permissions.\n",
3369
- "files": {
3370
- "core/components/ui/form/fieldset/fieldset.md": {
3371
- "title": "Fieldset",
3372
- "hashes": {
3373
- "disabling-a-group": {
3374
- "count": 1,
3375
- "title": "Disabling a group",
3376
- "type": "paragraph"
3377
- }
3378
- }
3379
- }
3380
- }
3381
- },
3382
- {
3383
- "search": "The inner <fieldset> carries grouping semantics. disabled is applied on that element so nested controls are disabled in the usual way. sonic-legend renders a native <legend> for the group label.\n",
3384
- "files": {
3385
- "core/components/ui/form/fieldset/fieldset.md": {
3386
- "title": "Fieldset",
3387
- "hashes": {
3388
- "accessibility": {
3389
- "count": 1,
3390
- "title": "Accessibility",
3391
- "type": "paragraph"
3392
- }
3393
- }
3394
- }
3395
- }
3396
- },
3397
- {
3398
- "search": "Muted description line below the legend title. No attributes—project content through the default slot.\n",
3399
- "files": {
3400
- "core/components/ui/form/fieldset/fieldset.md": {
3401
- "title": "Fieldset",
3402
- "hashes": {
3403
- "sonic-legend-description": {
3404
- "count": 1,
3405
- "title": "`sonic-legend-description`",
3406
- "type": "paragraph"
3407
- }
3408
- }
3409
- }
3410
- }
3411
- },
3412
- {
3413
- "search": "Form actions",
3414
- "files": {
3415
- "core/components/ui/form/form-actions/form-actions.md": {
3416
- "title": "Form actions",
3417
- "hashes": {
3418
- "form-actions": {
3419
- "count": 1,
3420
- "title": "",
3421
- "type": "page"
3422
- }
3423
- }
3424
- }
3425
- }
3426
- },
3427
- {
3428
- "search": "sonic-form-actions lays out submit / cancel and other form footer controls in a wrapping flex row with a small fixed gap. Place it inside sonic-form-layout (full-width row) or any block that should end with actions. Defaults: direction row · justify flex-start · alignItems center.\n",
3429
- "files": {
3430
- "core/components/ui/form/form-actions/form-actions.md": {
3431
- "title": "Form actions",
3432
- "hashes": {
3433
- "form-actions": {
3434
- "count": 1,
3435
- "title": "",
3436
- "type": "paragraph"
3437
- }
3438
- }
3439
- }
3440
- }
3441
- },
3442
- {
3443
- "search": "With no attributes, actions align to the start of the row (typical for left-to-right forms).\n",
3444
- "files": {
3445
- "core/components/ui/form/form-actions/form-actions.md": {
3446
- "title": "Form actions",
3447
- "hashes": {
3448
- "basic-example": {
3449
- "count": 1,
3450
- "title": "Basic example",
3451
- "type": "paragraph"
3452
- }
3453
- }
3454
- }
3455
- }
3456
- },
3457
- {
3458
- "search": "justify maps to CSS justify-content. Use flex-end for dialog-style footers or center for balanced toolbars.\n",
3459
- "files": {
3460
- "core/components/ui/form/form-actions/form-actions.md": {
3461
- "title": "Form actions",
3462
- "hashes": {
3463
- "justify-content": {
3464
- "count": 1,
3465
- "title": "Justify content",
3466
- "type": "paragraph"
3467
- }
3468
- }
3469
- }
3470
- }
3471
- },
3472
- {
3473
- "search": "direction maps to flex-direction. row-reverse swaps visual order while keeping DOM order (focus order unchanged).\n",
3474
- "files": {
3475
- "core/components/ui/form/form-actions/form-actions.md": {
3476
- "title": "Form actions",
3477
- "hashes": {
3478
- "flex-direction": {
3479
- "count": 1,
3480
- "title": "Flex direction",
3481
- "type": "paragraph"
3482
- }
3483
- }
3484
- }
3485
- }
3486
- },
3487
- {
3488
- "search": "Combine sonic-button with sonic-divider vertical or other slotted content. Default alignItems center keeps unlike heights aligned on the cross axis.\n",
3489
- "files": {
3490
- "core/components/ui/form/form-actions/form-actions.md": {
3491
- "title": "Form actions",
3492
- "hashes": {
3493
- "mixed-controls": {
3494
- "count": 1,
3495
- "title": "Mixed controls",
3496
- "type": "paragraph"
3497
- }
3498
- }
3499
- }
3500
- }
3501
- },
3502
- {
3503
- "search": "The component exposes a single unnamed slot; there are no named slots. Slotted nodes use the host’s flex gap (0.3rem) and flex-wrap.\n",
3504
- "files": {
3505
- "core/components/ui/form/form-actions/form-actions.md": {
3506
- "title": "Form actions",
3507
- "hashes": {
3508
- "api-reference": {
3509
- "count": 1,
3510
- "title": "API reference",
3511
- "type": "paragraph"
3512
- }
3513
- }
3514
- }
3515
- }
3516
- },
3517
- {
3518
- "search": "Form layout",
3519
- "files": {
3520
- "core/components/ui/form/form-layout/form-layout.md": {
3521
- "title": "Form layout",
3522
- "hashes": {
3523
- "form-layout": {
3524
- "count": 1,
3525
- "title": "",
3526
- "type": "page"
3527
- }
3528
- }
3529
- }
3530
- }
3531
- },
3532
- {
3533
- "search": "sonic-form-layout arranges slotted form controls in a responsive CSS grid with consistent vertical spacing. Pair sonic-input · sonic-select and sonic-input-autocomplete fields side by side when the host is wider than 440px; textareas, toggles, dividers, and sonic-form-actions span the full width. Wrap a form or sonic-fieldset body—no attributes are required.\n",
3534
- "files": {
3535
- "core/components/ui/form/form-layout/form-layout.md": {
3536
- "title": "Form layout",
3537
- "hashes": {
3538
- "form-layout": {
3539
- "count": 1,
3540
- "title": "",
3541
- "type": "paragraph"
3542
- }
3543
- }
3544
- }
3545
- }
3546
- },
3547
- {
3548
- "search": "Typical registration-style form: short fields flow in two columns on wide layouts; long or grouped blocks stay full width.\n",
3549
- "files": {
3550
- "core/components/ui/form/form-layout/form-layout.md": {
3551
- "title": "Form layout",
3552
- "hashes": {
3553
- "basic-example": {
3554
- "count": 1,
3555
- "title": "Basic example",
3556
- "type": "paragraph"
3557
- }
3558
- }
3559
- }
3560
- }
3561
- },
3562
- {
3563
- "search": "When the host offsetWidth is greater than 440px, the grid uses two equal columns with slightly larger gap (1.75rem). Below that breakpoint, fields stack in a single column (1.5rem gap).\n",
3564
- "files": {
3565
- "core/components/ui/form/form-layout/form-layout.md": {
3566
- "title": "Form layout",
3567
- "hashes": {
3568
- "responsive-columns": {
3569
- "count": 1,
3570
- "title": "Responsive columns",
3571
- "type": "paragraph"
3572
- }
3573
- }
3574
- }
3575
- }
3576
- },
3577
- {
3578
- "search": "If the slot contains exactly one direct sonic-input, sonic-select, or sonic-input-autocomplete, the layout stays one column even above the breakpoint so a lone field does not sit in half an empty row.\n",
3579
- "files": {
3580
- "core/components/ui/form/form-layout/form-layout.md": {
3581
- "title": "Form layout",
3582
- "hashes": {
3583
- "responsive-columns": {
3584
- "count": 1,
3585
- "title": "Responsive columns",
3586
- "type": "paragraph"
3587
- }
3588
- }
3589
- }
3590
- }
3591
- },
3592
- {
3593
- "search": "Everything except sonic-input, sonic-select, sonic-input-autocomplete, and slotted elements with class form-item-container is assigned grid-column: 1 / -1. Use this for sonic-textarea, sonic-checkbox, sonic-switch, sonic-form-actions, sonic-divider, and similar blocks.\n",
3594
- "files": {
3595
- "core/components/ui/form/form-layout/form-layout.md": {
3596
- "title": "Form layout",
3597
- "hashes": {
3598
- "full-width-slotted-blocks": {
3599
- "count": 1,
3600
- "title": "Full-width slotted blocks",
3601
- "type": "paragraph"
3602
- }
3603
- }
3604
- }
3605
- }
3606
- },
3607
- {
3608
- "search": "Slotted sonic-divider sets --sc-divider-my: 0 so divider spacing matches the grid rhythm. Slotted sonic-submit uses display: contents so submit controls participate in the grid without an extra wrapper box.\n",
3609
- "files": {
3610
- "core/components/ui/form/form-layout/form-layout.md": {
3611
- "title": "Form layout",
3612
- "hashes": {
3613
- "full-width-slotted-blocks": {
3614
- "count": 1,
3615
- "title": "Full-width slotted blocks",
3616
- "type": "paragraph"
3617
- }
3618
- }
3619
- }
3620
- }
3621
- },
3622
- {
3623
- "search": "Add class form-item-container on a slotted wrapper (for example a div) when a field is not a direct sonic-input / sonic-select / sonic-input-autocomplete but should still share the two-column flow with short inputs.\n",
3624
- "files": {
3625
- "core/components/ui/form/form-layout/form-layout.md": {
3626
- "title": "Form layout",
3627
- "hashes": {
3628
- "custom-column-wrapper": {
3629
- "count": 1,
3630
- "title": "Custom column wrapper",
3631
- "type": "paragraph"
3632
- }
3633
- }
3634
- }
3635
- }
3636
- },
3637
- {
3638
- "search": "No public attributes — layout follows slotted children and host width.\n",
3639
- "files": {
3640
- "core/components/ui/form/form-layout/form-layout.md": {
3641
- "title": "Form layout",
3642
- "hashes": {
3643
- "api-reference": {
3644
- "count": 1,
3645
- "title": "API reference",
3646
- "type": "paragraph"
3647
- }
3648
- }
3649
- }
3650
- }
3651
- },
3652
- {
3653
- "search": "Input",
3654
- "files": {
3655
- "core/components/ui/form/input/input.md": {
3656
- "title": "Input",
3657
- "hashes": {
3658
- "input": {
3659
- "count": 1,
3660
- "title": "",
3661
- "type": "page"
3662
- }
3663
- }
3664
- }
3665
- }
3666
- },
3667
- {
3668
- "search": "Liste des types\n",
3669
- "files": {
3670
- "core/components/ui/form/input/input.md": {
3671
- "title": "Input",
3672
- "hashes": {
3673
- "type": {
3674
- "count": 1,
3675
- "title": "Type",
3676
- "type": "paragraph"
3677
- }
3678
- }
3679
- }
3680
- }
3681
- },
3682
- {
3683
- "search": "Filter with formDataProvider + name="contains" (mock API: substring on joke text). Caption and rows via Lit (@subscribe, .items on sonic-queue):\n",
3684
- "files": {
3685
- "core/components/ui/form/input/input.md": {
3686
- "title": "Input",
3687
- "hashes": {
3688
- "example-of-use--search--queue": {
3689
- "count": 1,
3690
- "title": "Example of use — search + queue",
3691
- "type": "paragraph"
3692
- }
3693
- }
3694
- }
3695
- }
3696
- },
3697
- {
3698
- "search": "Input-autocomplete",
3699
- "files": {
3700
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3701
- "title": "Input-autocomplete",
3702
- "hashes": {
3703
- "input-autocomplete": {
3704
- "count": 1,
3705
- "title": "",
3706
- "type": "page"
3707
- }
3708
- }
3709
- }
3710
- }
3711
- },
3712
- {
3713
- "search": "Champ formulaire + suggestions via queue. Valeur via formDataProvider + name ; la recherche filtre la queue (store interne).\n",
3714
- "files": {
3715
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3716
- "title": "Input-autocomplete",
3717
- "hashes": {
3718
- "input-autocomplete": {
3719
- "count": 1,
3720
- "title": "",
3721
- "type": "paragraph"
3722
- }
3723
- }
3724
- }
3725
- }
3726
- },
3727
- {
3728
- "search": "Rendu des lignes : propriété .items (callback Lit) — voir les démos ci-dessous. Mock : serviceURL="/docs-mock-api/geo/".\n",
3729
- "files": {
3730
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3731
- "title": "Input-autocomplete",
3732
- "hashes": {
3733
- "input-autocomplete": {
3734
- "count": 1,
3735
- "title": "",
3736
- "type": "paragraph"
3737
- }
3738
- }
3739
- }
3740
- }
3741
- },
3742
- {
3743
- "search": "name = paramètre de recherche = valeur formulaire.\n",
3744
- "files": {
3745
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3746
- "title": "Input-autocomplete",
3747
- "hashes": {
3748
- "simple": {
3749
- "count": 1,
3750
- "title": "Simple",
3751
- "type": "paragraph"
3752
- }
3753
- }
3754
- }
3755
- }
3756
- },
3757
- {
3758
- "search": "Recherche sur nom, valeur formulaire = code. Préremplissage via value.\n",
3759
- "files": {
3760
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3761
- "title": "Input-autocomplete",
3762
- "hashes": {
3763
- "valeur--paramètre-de-recherche": {
3764
- "count": 1,
3765
- "title": "Valeur ≠ paramètre de recherche",
3766
- "type": "paragraph"
3767
- }
3768
- }
3769
- }
3770
- }
3771
- },
3772
- {
3773
- "search": "À la fermeture du pop, seule une valeur de la liste (ou vide) est conservée.\n",
3774
- "files": {
3775
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3776
- "title": "Input-autocomplete",
3777
- "hashes": {
3778
- "mode-select": {
3779
- "count": 1,
3780
- "title": "Mode select",
3781
- "type": "paragraph"
3782
- }
3783
- }
3784
- }
3785
- }
3786
- },
3787
- {
3788
- "search": "data-keyboard-nav sur le champ et les items (flèches haut / bas).\n",
3789
- "files": {
3790
- "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
3791
- "title": "Input-autocomplete",
3792
- "hashes": {
3793
- "navigation-clavier": {
3794
- "count": 1,
3795
- "title": "Navigation clavier",
3796
- "type": "paragraph"
3797
- }
3798
- }
3799
- }
3800
- }
3801
- },
3802
- {
3803
- "search": "Radio",
3804
- "files": {
3805
- "core/components/ui/form/radio/radio.md": {
3806
- "title": "Radio",
3807
- "hashes": {
3808
- "radio": {
3809
- "count": 1,
3810
- "title": "",
3811
- "type": "page"
3812
- }
3813
- }
3814
- }
3815
- }
3816
- },
3817
- {
3818
- "search": "Same mock filter as Checkbox (blacklistFlags query param). Radio sends one flag at a time.\n",
3819
- "files": {
3820
- "core/components/ui/form/radio/radio.md": {
3821
- "title": "Radio",
3822
- "hashes": {
3823
- "example-of-use--blacklist--queue": {
3824
- "count": 1,
3825
- "title": "Example of use — blacklist + queue",
3826
- "type": "paragraph"
3827
- }
3828
- }
3829
- }
3830
- }
3831
- },
3832
- {
3833
- "search": "Select",
3834
- "files": {
3835
- "core/components/ui/form/select/select.md": {
3836
- "title": "Select",
3837
- "hashes": {
3838
- "select": {
3839
- "count": 1,
3840
- "title": "",
3841
- "type": "page"
3842
- }
3843
- }
3844
- }
3845
- }
3846
- },
3847
- {
3848
- "search": "name="lang" is sent as ?lang=fr|en to the doc mock API (filterDocsJokes). Same pattern as Input (contains):\n",
3849
- "files": {
3850
- "core/components/ui/form/select/select.md": {
3851
- "title": "Select",
3852
- "hashes": {
3853
- "example-of-use--language-filter--queue": {
3854
- "count": 1,
3855
- "title": "Example of use — language filter + queue",
3856
- "type": "paragraph"
3857
- }
3858
- }
3859
- }
3860
- }
3861
- },
3862
- {
3863
- "search": "Switch",
3864
- "files": {
3865
- "core/components/ui/form/switch/switch.md": {
3866
- "title": "Switch",
3867
- "hashes": {
3868
- "switch": {
3869
- "count": 1,
3870
- "title": "",
3871
- "type": "page"
3872
- }
3873
- }
3874
- }
3875
- }
3876
- },
3877
- {
3878
- "search": "Same mock filter as Checkbox; switches can enable several flags (comma-separated in the query).\n",
3879
- "files": {
3880
- "core/components/ui/form/switch/switch.md": {
3881
- "title": "Switch",
3882
- "hashes": {
3883
- "example-of-use--blacklist--queue": {
3884
- "count": 1,
3885
- "title": "Example of use — blacklist + queue",
3886
- "type": "paragraph"
3887
- }
3888
- }
3889
- }
3890
- }
3891
- },
3892
- {
3893
- "search": "Textarea",
3894
- "files": {
3895
- "core/components/ui/form/textarea/textarea.md": {
3896
- "title": "Textarea",
3897
- "hashes": {
3898
- "textarea": {
3899
- "count": 1,
3900
- "title": "",
3901
- "type": "page"
3902
- }
3903
- }
3904
- }
3905
- }
3906
- },
3907
- {
3908
- "search": "Group",
3909
- "files": {
3910
- "core/components/ui/group/group.md": {
3911
- "title": "Group",
3912
- "hashes": {
3913
- "group": {
3914
- "count": 1,
3915
- "title": "",
3916
- "type": "page"
3917
- }
3918
- }
3919
- }
3920
- }
3921
- },
3922
- {
3923
- "search": "sonic-group lays out slotted sonic-button · sonic-input and sonic-select controls in a single horizontal row with shared corner radius (first / middle / last items). Optional label and description follow form field styling. Use it for button groups, radio rows, or input + action toolbars.\n",
3924
- "files": {
3925
- "core/components/ui/group/group.md": {
3926
- "title": "Group",
3927
- "hashes": {
3928
- "group": {
3929
- "count": 1,
3930
- "title": "",
3931
- "type": "paragraph"
3932
- }
3933
- }
3934
- }
3935
- }
3936
- },
3937
- {
3938
- "search": "Pair with sonic-button radio and a shared name; ancestor formDataProvider stores the selected value.\n",
3939
- "files": {
3940
- "core/components/ui/group/group.md": {
3941
- "title": "Group",
3942
- "hashes": {
3943
- "radio-group": {
3944
- "count": 1,
3945
- "title": "Radio group",
3946
- "type": "paragraph"
3947
- }
3948
- }
3949
- }
3950
- }
3951
- },
3952
- {
3953
- "search": "Adjacent link or action buttons without merging into one control.\n",
3954
- "files": {
3955
- "core/components/ui/group/group.md": {
3956
- "title": "Group",
3957
- "hashes": {
3958
- "button-group": {
3959
- "count": 1,
3960
- "title": "Button group",
3961
- "type": "paragraph"
3962
- }
3963
- }
3964
- }
3965
- }
3966
- },
3967
- {
3968
- "search": "Action control before the field. label or description on sonic-group annotate the row.\n",
3969
- "files": {
3970
- "core/components/ui/group/group.md": {
3971
- "title": "Group",
3972
- "hashes": {
3973
- "input-actions-prefix": {
3974
- "count": 1,
3975
- "title": "Input actions prefix",
3976
- "type": "paragraph"
3977
- }
3978
- }
3979
- }
3980
- }
3981
- },
3982
- {
3983
- "search": "Field first, action after (submit, validate, etc.).\n",
3984
- "files": {
3985
- "core/components/ui/group/group.md": {
3986
- "title": "Group",
3987
- "hashes": {
3988
- "input-actions-suffix": {
3989
- "count": 1,
3990
- "title": "Input actions suffix",
3991
- "type": "paragraph"
3992
- }
3993
- }
3994
- }
3995
- }
3996
- },
3997
- {
3998
- "search": "Icon",
3999
- "files": {
4000
- "core/components/ui/icon/icon.md": {
4001
- "title": "Icon",
4002
- "hashes": {
4003
- "icon": {
4004
- "count": 1,
4005
- "title": "",
4006
- "type": "page"
4007
- }
4008
- }
4009
- }
4010
- }
4011
- },
4012
- {
4013
- "search": "sonic-icon renders inline SVG icons from the bundled core set or from CDN libraries. Set name (and library / prefix when needed); scale with size. Icons inherit currentColor and are aria-hidden by default—keep visible text nearby or label the control that contains them.\n",
4014
- "files": {
4015
- "core/components/ui/icon/icon.md": {
4016
- "title": "Icon",
4017
- "hashes": {
4018
- "icon": {
4019
- "count": 1,
4020
- "title": "",
4021
- "type": "paragraph"
4022
- }
4023
- }
4024
- }
4025
- }
4026
- },
4027
- {
4028
- "search": "Omit library to use the bundled set in icons.json. Available name values: cancel · check · check-circled-outline · emoji-puzzled · info-empty · loader · minus-small · more-horiz · more-vert · nav-arrow-down · warning-circled-outline.\n",
4029
- "files": {
4030
- "core/components/ui/icon/icon.md": {
4031
- "title": "Icon",
4032
- "hashes": {
4033
- "core-library": {
4034
- "count": 1,
4035
- "title": "Core library",
4036
- "type": "paragraph"
4037
- }
4038
- }
4039
- }
4040
- }
4041
- },
4042
- {
4043
- "search": "Set library to load SVGs from a built-in CDN template. prefix falls back to each library’s default when omitted (outline for heroicons, regular for fontAwesome and material, and so on).\n",
4044
- "files": {
4045
- "core/components/ui/icon/icon.md": {
4046
- "title": "Icon",
4047
- "hashes": {
4048
- "external-libraries": {
4049
- "count": 1,
4050
- "title": "External libraries",
4051
- "type": "paragraph"
4052
- }
4053
- }
4054
- }
4055
- }
4056
- },
4057
- {
4058
- "search": "Use library="custom" with SVG files on your origin. On an ancestor (for example sonic-scope or sonic-code), set customIconLibraryPath to a URL template with $prefix and $name placeholders, and optionally customIconDefaultPrefix when prefix is omitted.\n",
4059
- "files": {
4060
- "core/components/ui/icon/icon.md": {
4061
- "title": "Icon",
4062
- "hashes": {
4063
- "custom-library": {
4064
- "count": 1,
4065
- "title": "Custom library",
4066
- "type": "paragraph"
4067
- }
4068
- }
4069
- }
4070
- }
4071
- },
4072
- {
4073
- "search": "<sonic-code\n customIconLibraryPath="/svg/$prefix/$name.svg"\n customIconDefaultPrefix="regular"\n",
4074
- "files": {
4075
- "core/components/ui/icon/icon.md": {
4076
- "title": "Icon",
4077
- "hashes": {
4078
- "custom-library": {
4079
- "count": 1,
4080
- "title": "Custom library",
4081
- "type": "paragraph"
4082
- }
4083
- }
4084
- }
4085
- }
4086
- },
4087
- {
4088
- "search": "Omit size for the default scale (1em height). Larger steps use 3xl.\n",
4089
- "files": {
4090
- "core/components/ui/icon/icon.md": {
4091
- "title": "Icon",
4092
- "hashes": {
4093
- "size": {
4094
- "count": 1,
4095
- "title": "Size",
4096
- "type": "paragraph"
4097
- }
4098
- }
4099
- }
4100
- }
4101
- },
4102
- {
4103
- "search": "On connect, the host sets aria-hidden="true". Treat icons as decorative unless the surrounding control already has an accessible name. Do not rely on sonic-icon alone for meaning—use visible text or aria-label on the parent button / link.\n",
4104
- "files": {
4105
- "core/components/ui/icon/icon.md": {
4106
- "title": "Icon",
4107
- "hashes": {
4108
- "accessibility": {
4109
- "count": 1,
4110
- "title": "Accessibility",
4111
- "type": "paragraph"
4112
- }
4113
- }
4114
- }
4115
- }
4116
- },
4117
- {
4118
- "search": "Ancestor attributes (for library="custom" only): customIconLibraryPath (URL template with $prefix and $name) and customIconDefaultPrefix. May be set on sonic-scope, theme roots, or globally in the document.\n",
4119
- "files": {
4120
- "core/components/ui/icon/icon.md": {
4121
- "title": "Icon",
4122
- "hashes": {
4123
- "api-reference": {
4124
- "count": 1,
4125
- "title": "API reference",
4126
- "type": "paragraph"
4127
- }
4128
- }
4129
- }
4130
- }
4131
- },
4132
- {
4133
- "search": "No slots — the component inlines fetched or bundled SVG markup.\n",
4134
- "files": {
4135
- "core/components/ui/icon/icon.md": {
4136
- "title": "Icon",
4137
- "hashes": {
4138
- "api-reference": {
4139
- "count": 1,
4140
- "title": "API reference",
4141
- "type": "paragraph"
4142
- }
4143
- }
4144
- }
4145
- }
4146
- },
4147
- {
4148
- "search": "Image",
4149
- "files": {
4150
- "core/components/ui/image/image.md": {
4151
- "title": "Image",
4152
- "hashes": {
4153
- "image": {
4154
- "count": 1,
4155
- "title": "",
4156
- "type": "page"
4157
- }
4158
- }
4159
- }
4160
- }
4161
- },
4162
- {
4163
- "search": "sonic-image wraps a responsive <img> with aspect ratio, object-fit: cover, optional rounded corners, and load transitions. The host shows a placeholder background (--sc-placeholder-bg) until the asset loads. Default loading is lazy; use loading="eager" for above-the-fold heroes.\n",
4164
- "files": {
4165
- "core/components/ui/image/image.md": {
4166
- "title": "Image",
4167
- "hashes": {
4168
- "image": {
4169
- "count": 1,
4170
- "title": "",
4171
- "type": "paragraph"
4172
- }
4173
- }
4174
- }
4175
- }
4176
- },
4177
- {
4178
- "search": "Omit rounded for square corners. Boolean rounded uses the theme token --sc-rounded. Sizes: sm, md, lg, xl, full (circle — pair with ratio="1/1"), none (explicit reset).\n",
4179
- "files": {
4180
- "core/components/ui/image/image.md": {
4181
- "title": "Image",
4182
- "hashes": {
4183
- "rounded": {
4184
- "count": 1,
4185
- "title": "Rounded",
4186
- "type": "paragraph"
4187
- }
4188
- }
4189
- }
4190
- }
4191
- },
4192
- {
4193
- "search": "ratio sets CSS aspect-ratio on the image (default auto). The image still fills the host width (width: 100%).\n",
4194
- "files": {
4195
- "core/components/ui/image/image.md": {
4196
- "title": "Image",
4197
- "hashes": {
4198
- "aspect-ratio": {
4199
- "count": 1,
4200
- "title": "Aspect ratio",
4201
- "type": "paragraph"
4202
- }
4203
- }
4204
- }
4205
- }
4206
- },
4207
- {
4208
- "search": "objectPosition maps to CSS object-position (default center center). Useful on wide crops when the subject sits off-center.\n",
4209
- "files": {
4210
- "core/components/ui/image/image.md": {
4211
- "title": "Image",
4212
- "hashes": {
4213
- "object-position": {
4214
- "count": 1,
4215
- "title": "Object position",
4216
- "type": "paragraph"
4217
- }
4218
- }
4219
- }
4220
- }
4221
- },
4222
- {
4223
- "search": "cover stretches the image to fill a positioned parent (position: relative + fixed height or inset). Aspect ratio on the host is ignored while cover is set.\n",
4224
- "files": {
4225
- "core/components/ui/image/image.md": {
4226
- "title": "Image",
4227
- "hashes": {
4228
- "cover": {
4229
- "count": 1,
4230
- "title": "Cover",
4231
- "type": "paragraph"
4232
- }
4233
- }
4234
- }
4235
- }
4236
- },
4237
- {
4238
- "search": "Set transition to fade (default when the attribute is present) or fade-scale-out. The image stays at opacity: 0 until the browser fires load, then the loaded class runs the animation. Changing src on an existing element does not replay the effect — mount a new sonic-image when you need another entrance (galleries, infinite scroll).\n",
4239
- "files": {
4240
- "core/components/ui/image/image.md": {
4241
- "title": "Image",
4242
- "hashes": {
4243
- "load-transition": {
4244
- "count": 1,
4245
- "title": "Load transition",
4246
- "type": "paragraph"
4247
- }
4248
- }
4249
- }
4250
- }
4251
- },
4252
- {
4253
- "search": "Click Add image to append small thumbnails and replay the transition. Clear resets the row.\n",
4254
- "files": {
4255
- "core/components/ui/image/image.md": {
4256
- "title": "Image",
4257
- "hashes": {
4258
- "load-transition": {
4259
- "count": 1,
4260
- "title": "Load transition",
4261
- "type": "paragraph"
4262
- }
4263
- }
4264
- }
4265
- }
4266
- },
4267
- {
4268
- "search": "Always set meaningful alt text (empty string only for decorative images). \n",
4269
- "files": {
4270
- "core/components/ui/image/image.md": {
4271
- "title": "Image",
4272
- "hashes": {
4273
- "accessibility-and-parts": {
4274
- "count": 1,
4275
- "title": "Accessibility and parts",
4276
- "type": "paragraph"
4277
- }
4278
- }
4279
- }
4280
- }
4281
- },
4282
- {
4283
- "search": "No slots — content is driven entirely by attributes on the inner <img>.\n",
4284
- "files": {
4285
- "core/components/ui/image/image.md": {
4286
- "title": "Image",
4287
- "hashes": {
4288
- "api-reference": {
4289
- "count": 2,
4290
- "title": "API reference",
4291
- "type": "paragraph"
4292
- }
4293
- }
4294
- }
4295
- }
4296
- },
4297
- {
4298
- "search": "Link",
4299
- "files": {
4300
- "core/components/ui/link/link.md": {
4301
- "title": "Link",
4302
- "hashes": {
4303
- "link": {
4304
- "count": 1,
4305
- "title": "",
4306
- "type": "page"
4307
- }
4308
- }
4309
- }
4310
- }
4311
- },
4312
- {
4313
- "search": "Links navigate with inherited typography: internal routes, anchors, or external URLs. The default slot is the anchor label. For in-app routing, pair href with pushstate; use autoActive to reflect the current URL on the host (active).\n",
4314
- "files": {
4315
- "core/components/ui/link/link.md": {
4316
- "title": "Link",
4317
- "hashes": {
4318
- "link": {
4319
- "count": 1,
4320
- "title": "",
4321
- "type": "paragraph"
4322
- }
4323
- }
4324
- }
4325
- }
4326
- },
4327
- {
4328
- "search": "target="_blank" opens a new browsing context and sets rel="noopener noreferrer".\n",
4329
- "files": {
4330
- "core/components/ui/link/link.md": {
4331
- "title": "Link",
4332
- "hashes": {
4333
- "target": {
4334
- "count": 1,
4335
- "title": "Target",
4336
- "type": "paragraph"
4337
- }
4338
- }
4339
- }
4340
- }
4341
- },
4342
- {
4343
- "search": "Set pushstate on same-origin href values to intercept clicks and navigate through Concorde’s client router without a full reload.\n",
4344
- "files": {
4345
- "core/components/ui/link/link.md": {
4346
- "title": "Link",
4347
- "hashes": {
4348
- "pushstate": {
4349
- "count": 1,
4350
- "title": "Pushstate",
4351
- "type": "paragraph"
4352
- }
4353
- }
4354
- }
4355
- }
4356
- },
4357
- {
4358
- "search": "Default autoActive is partial: the host gets active when the current URL starts with href. Style with [&[active]]: utilities or host selectors.\n",
4359
- "files": {
4360
- "core/components/ui/link/link.md": {
4361
- "title": "Link",
4362
- "hashes": {
4363
- "autoactive": {
4364
- "count": 1,
4365
- "title": "AutoActive",
4366
- "type": "paragraph"
4367
- }
4368
- }
4369
- }
4370
- }
4371
- },
4372
- {
4373
- "search": "strict requires pathname, search, and hash to match. strict-path-only matches pathname and hash but ignores search.\n",
4374
- "files": {
4375
- "core/components/ui/link/link.md": {
4376
- "title": "Link",
4377
- "hashes": {
4378
- "autoactive-strict-vs-partial": {
4379
- "count": 1,
4380
- "title": "AutoActive strict vs partial",
4381
- "type": "paragraph"
4382
- }
4383
- }
4384
- }
4385
- }
4386
- },
4387
- {
4388
- "search": "The inner <a> uses focus-visible outline styling. Set data-aria-label when the slot text is not sufficient on its own.\n",
4389
- "files": {
4390
- "core/components/ui/link/link.md": {
4391
- "title": "Link",
4392
- "hashes": {
4393
- "accessibility": {
4394
- "count": 1,
4395
- "title": "Accessibility",
4396
- "type": "paragraph"
4397
- }
4398
- }
4399
- }
4400
- }
4401
- },
4402
- {
4403
- "search": "Loader",
4404
- "files": {
4405
- "core/components/ui/loader/loader.md": {
4406
- "title": "Loader",
4407
- "hashes": {
4408
- "loader": {
4409
- "count": 1,
4410
- "title": "",
4411
- "type": "page"
4412
- }
4413
- }
4414
- }
4415
- }
4416
- },
4417
- {
4418
- "search": "sonic-loader shows a loading animation in the page or as a viewport overlay. Default mode is fixed (centered overlay). Use inline inside lists and fetch placeholders. Pair noDelay when the spinner should appear without the default fade-in wait. For sonic-fetch / sonic-list, set the parent loader attribute instead of embedding a tag manually.\n",
4419
- "files": {
4420
- "core/components/ui/loader/loader.md": {
4421
- "title": "Loader",
4422
- "hashes": {
4423
- "loader": {
4424
- "count": 1,
4425
- "title": "",
4426
- "type": "paragraph"
4427
- }
4428
- }
4429
- }
4430
- }
4431
- },
4432
- {
4433
- "search": "Inline loaders fit content areas; they use the theme primary color unless currentColor is set.\n",
4434
- "files": {
4435
- "core/components/ui/loader/loader.md": {
4436
- "title": "Loader",
4437
- "hashes": {
4438
- "basic-example": {
4439
- "count": 1,
4440
- "title": "Basic example",
4441
- "type": "paragraph"
4442
- }
4443
- }
4444
- }
4445
- }
4446
- },
4447
- {
4448
- "search": "inline — ellipsis animation in the document flow. fixed — centered overlay (position: fixed); default when the tag is omitted.\n",
4449
- "files": {
4450
- "core/components/ui/loader/loader.md": {
4451
- "title": "Loader",
4452
- "hashes": {
4453
- "mode": {
4454
- "count": 1,
4455
- "title": "Mode",
4456
- "type": "paragraph"
4457
- }
4458
- }
4459
- }
4460
- }
4461
- },
4462
- {
4463
- "search": "Use the checkbox below to toggle a fixed loader over the page (default mode on sonic-loader).\n",
4464
- "files": {
4465
- "core/components/ui/loader/loader.md": {
4466
- "title": "Loader",
4467
- "hashes": {
4468
- "mode": {
4469
- "count": 1,
4470
- "title": "Mode",
4471
- "type": "paragraph"
4472
- }
4473
- }
4474
- }
4475
- }
4476
- },
4477
- {
4478
- "search": "align only affects mode="inline": left · center (default) · right. Set currentColor so dots follow the host color (for example on a purple parent).\n",
4479
- "files": {
4480
- "core/components/ui/loader/loader.md": {
4481
- "title": "Loader",
4482
- "hashes": {
4483
- "inline-alignment-and-color": {
4484
- "count": 1,
4485
- "title": "Inline alignment and color",
4486
- "type": "paragraph"
4487
- }
4488
- }
4489
- }
4490
- }
4491
- },
4492
- {
4493
- "search": "By default mode="fixed" waits briefly before fading in. mode="inline" already skips that wait. Set noDelay on fixed (or pass noDelay: true to Loader.show()) to appear immediately.\n",
4494
- "files": {
4495
- "core/components/ui/loader/loader.md": {
4496
- "title": "Loader",
4497
- "hashes": {
4498
- "nodelay": {
4499
- "count": 1,
4500
- "title": "`noDelay`",
4501
- "type": "paragraph"
4502
- }
4503
- }
4504
- }
4505
- }
4506
- },
4507
- {
4508
- "search": "The animation is aria-hidden by default so screen readers are not spammed on every fetch. Set announce when the loader is injected after user action (for example a global overlay): the host gets role="status", aria-live="polite", and a localized aria-label (“Loading” / “Chargement en cours”, …). For in-button loading, prefer sonic-button loading and aria-busy on the control—not on the loader.\n",
4509
- "files": {
4510
- "core/components/ui/loader/loader.md": {
4511
- "title": "Loader",
4512
- "hashes": {
4513
- "accessibility-announce": {
4514
- "count": 1,
4515
- "title": "Accessibility (`announce`)",
4516
- "type": "paragraph"
4517
- }
4518
- }
4519
- }
4520
- }
4521
- },
4522
- {
4523
- "search": "Import Loader and call Loader.show() / Loader.hide(). hide() is reference-counted: call it once per show(). With no container, the loader is appended to the theme pop container and mode is always fixed. Pass container and mode: "inline" to mount an inline instance in a specific element.\n",
4524
- "files": {
4525
- "core/components/ui/loader/loader.md": {
4526
- "title": "Loader",
4527
- "hashes": {
4528
- "show-and-hide-programmatically": {
4529
- "count": 1,
4530
- "title": "Show and hide programmatically",
4531
- "type": "paragraph"
4532
- }
4533
- }
4534
- }
4535
- }
4536
- },
4537
- {
4538
- "search": "Loader.show({\n mode: "fixed",\n noDelay: false,\n announce: true,\n container: document.querySelector("#foo"),\n});\n",
4539
- "files": {
4540
- "core/components/ui/loader/loader.md": {
4541
- "title": "Loader",
4542
- "hashes": {
4543
- "show-and-hide-programmatically": {
4544
- "count": 1,
4545
- "title": "Show and hide programmatically",
4546
- "type": "paragraph"
4547
- }
4548
- }
4549
- }
4550
- }
4551
- },
4552
- {
4553
- "search": "Loader.hide();\n \n\n",
4554
- "files": {
4555
- "core/components/ui/loader/loader.md": {
4556
- "title": "Loader",
4557
- "hashes": {
4558
- "show-and-hide-programmatically": {
4559
- "count": 1,
4560
- "title": "Show and hide programmatically",
4561
- "type": "paragraph"
4562
- }
4563
- }
4564
- }
4565
- }
4566
- },
4567
- {
4568
- "search": "sonic-button loading shows an icon spinner and sets aria-busy on the button. sonic-fetch and sonic-list render sonic-loader when their loader attribute is set: true or an empty string maps to fixed; otherwise use inline or fixed.\n",
4569
- "files": {
4570
- "core/components/ui/loader/loader.md": {
4571
- "title": "Loader",
4572
- "hashes": {
4573
- "composition": {
4574
- "count": 1,
4575
- "title": "Composition",
4576
- "type": "paragraph"
4577
- }
4578
- }
4579
- }
4580
- }
4581
- },
4582
- {
4583
- "search": "This component has no slots. The animation markup is internal.\n",
4584
- "files": {
4585
- "core/components/ui/loader/loader.md": {
4586
- "title": "Loader",
4587
- "hashes": {
4588
- "api-reference": {
4589
- "count": 1,
4590
- "title": "API reference",
4591
- "type": "paragraph"
4592
- }
4593
- }
4594
- }
4595
- }
4596
- },
4597
- {
4598
- "search": "Menu",
4599
- "files": {
4600
- "core/components/ui/menu/menu.md": {
4601
- "title": "Menu",
4602
- "hashes": {
4603
- "menu": {
4604
- "count": 1,
4605
- "title": "",
4606
- "type": "page"
4607
- }
4608
- }
4609
- }
4610
- }
4611
- },
4612
- {
4613
- "search": "sonic-menu lays out navigation or actions as a direction row or column of sonic-menu-item entries (ghost variant and block shape by default), optional sonic-divider separators, and overflow content in the more slot (popover “…” trigger). Set href / pushstate / autoActive on each sonic-menu-item—same API as sonic-button—not on the menu host.\n",
4614
- "files": {
4615
- "core/components/ui/menu/menu.md": {
4616
- "title": "Menu",
4617
- "hashes": {
4618
- "menu": {
4619
- "count": 1,
4620
- "title": "",
4621
- "type": "paragraph"
4622
- }
4623
- }
4624
- }
4625
- }
4626
- },
4627
- {
4628
- "search": "Default direction is column. Use row for horizontal toolbars or tabs.\n",
4629
- "files": {
4630
- "core/components/ui/menu/menu.md": {
4631
- "title": "Menu",
4632
- "hashes": {
4633
- "direction": {
4634
- "count": 1,
4635
- "title": "Direction",
4636
- "type": "paragraph"
4637
- }
4638
- }
4639
- }
4640
- }
4641
- },
4642
- {
4643
- "search": "size on the menu propagates to items and the more trigger when they omit their own size.\n",
4644
- "files": {
4645
- "core/components/ui/menu/menu.md": {
4646
- "title": "Menu",
4647
- "hashes": {
4648
- "size": {
4649
- "count": 1,
4650
- "title": "Size",
4651
- "type": "paragraph"
4652
- }
4653
- }
4654
- }
4655
- }
4656
- },
4657
- {
4658
- "search": "Optional shadow wraps the menu surface (no shadow when omitted).\n",
4659
- "files": {
4660
- "core/components/ui/menu/menu.md": {
4661
- "title": "Menu",
4662
- "hashes": {
4663
- "shadow": {
4664
- "count": 1,
4665
- "title": "Shadow",
4666
- "type": "paragraph"
4667
- }
4668
- }
4669
- }
4670
- }
4671
- },
4672
- {
4673
- "search": "align propagates to items except square / circle shape.\n",
4674
- "files": {
4675
- "core/components/ui/menu/menu.md": {
4676
- "title": "Menu",
4677
- "hashes": {
4678
- "align": {
4679
- "count": 1,
4680
- "title": "Align",
4681
- "type": "paragraph"
4682
- }
4683
- }
4684
- }
4685
- }
4686
- },
4687
- {
4688
- "search": "Assign nodes to slot="more" to show the overflow popover. The trigger appears only when the slot has content. Icon orientation follows direction (vertical ellipsis in a row menu).\n",
4689
- "files": {
4690
- "core/components/ui/menu/menu.md": {
4691
- "title": "Menu",
4692
- "hashes": {
4693
- "more": {
4694
- "count": 1,
4695
- "title": "More",
4696
- "type": "paragraph"
4697
- }
4698
- }
4699
- }
4700
- }
4701
- },
4702
- {
4703
- "search": "With scrollable, the main slot scrolls with edge fade masks; drag-to-scroll works on pointer devices. When exactly one item is active, the menu scrolls it into view.\n",
4704
- "files": {
4705
- "core/components/ui/menu/menu.md": {
4706
- "title": "Menu",
4707
- "hashes": {
4708
- "scrollable": {
4709
- "count": 1,
4710
- "title": "Scrollable",
4711
- "type": "paragraph"
4712
- }
4713
- }
4714
- }
4715
- }
4716
- },
4717
- {
4718
- "search": "sonic-menu-item extends sonic-button (defaults: variant="ghost", shape="block"). Use the button docs for type, variant, href, pushstate, autoActive, and item slots.\n",
4719
- "files": {
4720
- "core/components/ui/menu/menu.md": {
4721
- "title": "Menu",
4722
- "hashes": {
4723
- "api-reference": {
4724
- "count": 1,
4725
- "title": "API reference",
4726
- "type": "paragraph"
4727
- }
4728
- }
4729
- }
4730
- }
4731
- },
4732
- {
4733
- "search": "Modal",
4734
- "files": {
4735
- "core/components/ui/modal/modal.md": {
4736
- "title": "Modal",
4737
- "hashes": {
4738
- "modal": {
4739
- "count": 1,
4740
- "title": "",
4741
- "type": "page"
4742
- }
4743
- }
4744
- }
4745
- }
4746
- },
4747
- {
4748
- "search": "sonic-modal presents focused content in a <dialog> overlay with backdrop, enter/exit animation, and a built-in close control. Compose sonic-modal-title / sonic-modal-subtitle / sonic-modal-content / sonic-modal-actions, or use the default slot. Call show() on the element to open; use hideModal on action buttons or hide() from script. Set forceAction when dismissal must go through explicit actions only. Imperative dialogs: Modal.create() (also window.SonicModal).\n",
4749
- "files": {
4750
- "core/components/ui/modal/modal.md": {
4751
- "title": "Modal",
4752
- "hashes": {
4753
- "modal": {
4754
- "count": 1,
4755
- "title": "",
4756
- "type": "paragraph"
4757
- }
4758
- }
4759
- }
4760
- }
4761
- },
4762
- {
4763
- "search": "Click the trigger to open. sonic-modal-actions lays out footer buttons; hideModal closes the modal on click. Scope form state with formDataProvider on sonic-modal-actions so child sonic-button elements share one publisher.\n",
4764
- "files": {
4765
- "core/components/ui/modal/modal.md": {
4766
- "title": "Modal",
4767
- "hashes": {
4768
- "basic-example": {
4769
- "count": 1,
4770
- "title": "Basic example",
4771
- "type": "paragraph"
4772
- }
4773
- }
4774
- }
4775
- }
4776
- },
4777
- {
4778
- "search": "Long copy scrolls inside the dialog. Default maxHeight is 90vh. Default align is left.\n",
4779
- "files": {
4780
- "core/components/ui/modal/modal.md": {
4781
- "title": "Modal",
4782
- "hashes": {
4783
- "scrollable-content": {
4784
- "count": 1,
4785
- "title": "Scrollable content",
4786
- "type": "paragraph"
4787
- }
4788
- }
4789
- }
4790
- }
4791
- },
4792
- {
4793
- "search": "With forceAction, backdrop click, Escape, and the default close button are disabled. Provide sonic-modal-actions (or sonic-modal-close) so users can finish the flow.\n",
4794
- "files": {
4795
- "core/components/ui/modal/modal.md": {
4796
- "title": "Modal",
4797
- "hashes": {
4798
- "force-action": {
4799
- "count": 1,
4800
- "title": "Force action",
4801
- "type": "paragraph"
4802
- }
4803
- }
4804
- }
4805
- }
4806
- },
4807
- {
4808
- "search": "Set width / height / maxWidth / maxHeight (CSS lengths). On narrow viewports the panel becomes a bottom sheet. Use rounded="none" for edge-to-edge media.\n",
4809
- "files": {
4810
- "core/components/ui/modal/modal.md": {
4811
- "title": "Modal",
4812
- "hashes": {
4813
- "custom-dimensions": {
4814
- "count": 1,
4815
- "title": "Custom dimensions",
4816
- "type": "paragraph"
4817
- }
4818
- }
4819
- }
4820
- }
4821
- },
4822
- {
4823
- "search": "fullscreen fills the viewport and hides the backdrop.\n",
4824
- "files": {
4825
- "core/components/ui/modal/modal.md": {
4826
- "title": "Modal",
4827
- "hashes": {
4828
- "fullscreen": {
4829
- "count": 1,
4830
- "title": "Fullscreen",
4831
- "type": "paragraph"
4832
- }
4833
- }
4834
- }
4835
- }
4836
- },
4837
- {
4838
- "search": "Use Modal.create(options) when there is no modal in the template—for confirmations, toasts that need a follow-up, or one-off flows from script. The modal is appended to the nearest sonic-theme pop container (same as declarative modals), opened automatically, and returns the sonic-modal instance. Set removeOnHide: true to detach it from the DOM after close. In the browser, window.SonicModal is the same class after the module loads.\n",
4839
- "files": {
4840
- "core/components/ui/modal/modal.md": {
4841
- "title": "Modal",
4842
- "hashes": {
4843
- "programmatic-creation": {
4844
- "count": 1,
4845
- "title": "Programmatic creation",
4846
- "type": "paragraph"
4847
- }
4848
- }
4849
- }
4850
- }
4851
- },
4852
- {
4853
- "search": "Pass title / subtitle / content / actions as HTML strings (or Lit template results from application code). Put hideModal on action buttons in the actions string so clicks close the dialog.\n",
4854
- "files": {
4855
- "core/components/ui/modal/modal.md": {
4856
- "title": "Modal",
4857
- "hashes": {
4858
- "programmatic-creation": {
4859
- "count": 1,
4860
- "title": "Programmatic creation",
4861
- "type": "paragraph"
4862
- }
4863
- }
4864
- }
4865
- }
4866
- },
4867
- {
4868
- "search": "const modal = Modal.create({\n title: "Delete project?",\n subtitle: "This cannot be undone.",\n content: "All files in Acme HQ will be removed.",\n actions: <sonic-button hideModal minWidth="8rem">Cancel</sonic-button> <sonic-button hideModal minWidth="8rem" type="danger">Delete</sonic-button> ,\n removeOnHide: true,\n forceAction: false,\n maxWidth: "min(100vw, 28rem)",\n});\n",
4869
- "files": {
4870
- "core/components/ui/modal/modal.md": {
4871
- "title": "Modal",
4872
- "hashes": {
4873
- "programmatic-creation": {
4874
- "count": 1,
4875
- "title": "Programmatic creation",
4876
- "type": "paragraph"
4877
- }
4878
- }
4879
- }
4880
- }
4881
- },
4882
- {
4883
- "search": "modal.addEventListener("hidden", () => {\n console.log("Modal removed from the DOM");\n});\n",
4884
- "files": {
4885
- "core/components/ui/modal/modal.md": {
4886
- "title": "Modal",
4887
- "hashes": {
4888
- "programmatic-creation": {
4889
- "count": 1,
4890
- "title": "Programmatic creation",
4891
- "type": "paragraph"
4892
- }
4893
- }
4894
- }
4895
- }
4896
- },
4897
- {
4898
- "search": "// Or close from script: await modal.hide(); await modal.dispose();\n \n\n",
4899
- "files": {
4900
- "core/components/ui/modal/modal.md": {
4901
- "title": "Modal",
4902
- "hashes": {
4903
- "programmatic-creation": {
4904
- "count": 1,
4905
- "title": "Programmatic creation",
4906
- "type": "paragraph"
4907
- }
4908
- }
4909
- }
4910
- }
4911
- },
4912
- {
4913
- "search": "Methods: show() · hide() · dispose() (hide and remove). Static Modal.create(options) appends a modal to the theme pop container and opens it. options / styleSheet are JavaScript-only.\n",
4914
- "files": {
4915
- "core/components/ui/modal/modal.md": {
4916
- "title": "Modal",
4917
- "hashes": {
4918
- "sonic-modal": {
4919
- "count": 1,
4920
- "title": "`sonic-modal`",
4921
- "type": "paragraph"
4922
- }
4923
- }
4924
- }
4925
- }
4926
- },
4927
- {
4928
- "search": "Put hideModal on a sonic-button to close the parent modal on click. Ancestor formDataProvider on this element is inherited by child form controls.\n",
4929
- "files": {
4930
- "core/components/ui/modal/modal.md": {
4931
- "title": "Modal",
4932
- "hashes": {
4933
- "sonic-modal-actions": {
4934
- "count": 1,
4935
- "title": "`sonic-modal-actions`",
4936
- "type": "paragraph"
4937
- }
4938
- }
4939
- }
4940
- }
4941
- },
4942
- {
4943
- "search": "Rendered automatically unless forceAction or noCloseButton is set. Calls hide() on the parent modal.\n",
4944
- "files": {
4945
- "core/components/ui/modal/modal.md": {
4946
- "title": "Modal",
4947
- "hashes": {
4948
- "sonic-modal-close": {
4949
- "count": 1,
4950
- "title": "`sonic-modal-close`",
4951
- "type": "paragraph"
4952
- }
4953
- }
4954
- }
4955
- }
4956
- },
4957
- {
4958
- "search": "Pop",
4959
- "files": {
4960
- "core/components/ui/pop/pop.md": {
4961
- "title": "Pop",
4962
- "hashes": {
4963
- "pop": {
4964
- "count": 1,
4965
- "title": "",
4966
- "type": "page"
4967
- }
4968
- }
4969
- }
4970
- }
4971
- },
4972
- {
4973
- "search": "sonic-pop anchors floating panels to a trigger: put the control in the default slot and the panel in slot="content" (menus, forms, custom markup). Click toggles open/closed unless manual is set; default placement is bottom (start-aligned). Position updates while open and flips inside the viewport when space is tight.\n",
4974
- "files": {
4975
- "core/components/ui/pop/pop.md": {
4976
- "title": "Pop",
4977
- "hashes": {
4978
- "pop": {
4979
- "count": 1,
4980
- "title": "",
4981
- "type": "paragraph"
4982
- }
4983
- }
4984
- }
4985
- }
4986
- },
4987
- {
4988
- "search": "Use top · bottom · left · right for the main axis. Add -start · -center · -end to align along the trigger edge. With no align suffix, content aligns to start. Legacy space syntax (placement="bottom center") still works but is deprecated—prefer bottom-center.\n",
4989
- "files": {
4990
- "core/components/ui/pop/pop.md": {
4991
- "title": "Pop",
4992
- "hashes": {
4993
- "placement": {
4994
- "count": 1,
4995
- "title": "Placement",
4996
- "type": "paragraph"
4997
- }
4998
- }
4999
- }
5000
- }
5001
- },
5002
- {
5003
- "search": "Default shadow is lg. The shadow applies to the floating content panel.\n",
5004
- "files": {
5005
- "core/components/ui/pop/pop.md": {
5006
- "title": "Pop",
5007
- "hashes": {
5008
- "shadow": {
5009
- "count": 1,
5010
- "title": "Shadow",
5011
- "type": "paragraph"
5012
- }
5013
- }
5014
- }
5015
- }
5016
- },
5017
- {
5018
- "search": "By default the host is middle-aligned with siblings. Set inline to baseline-align the trigger inside running text.\n",
5019
- "files": {
5020
- "core/components/ui/pop/pop.md": {
5021
- "title": "Pop",
5022
- "hashes": {
5023
- "inline": {
5024
- "count": 1,
5025
- "title": "Inline",
5026
- "type": "paragraph"
5027
- }
5028
- }
5029
- }
5030
- }
5031
- },
5032
- {
5033
- "search": "With noToggle, a click on the trigger still opens the pop but does not close it when it is already open. Use hide() or an outside click to dismiss.\n",
5034
- "files": {
5035
- "core/components/ui/pop/pop.md": {
5036
- "title": "Pop",
5037
- "hashes": {
5038
- "no-toggle": {
5039
- "count": 1,
5040
- "title": "No toggle",
5041
- "type": "paragraph"
5042
- }
5043
- }
5044
- }
5045
- }
5046
- },
5047
- {
5048
- "search": "Set manual to disable built-in click and keyboard toggle on the trigger. Call show() and hide() on the element instead. The pop dispatches show when it opens and hide when it closes.\n",
5049
- "files": {
5050
- "core/components/ui/pop/pop.md": {
5051
- "title": "Pop",
5052
- "hashes": {
5053
- "manual-control": {
5054
- "count": 1,
5055
- "title": "Manual control",
5056
- "type": "paragraph"
5057
- }
5058
- }
5059
- }
5060
- }
5061
- },
5062
- {
5063
- "search": "Click Click to open pop to open the panel programmatically.\n",
5064
- "files": {
5065
- "core/components/ui/pop/pop.md": {
5066
- "title": "Pop",
5067
- "hashes": {
5068
- "manual-control": {
5069
- "count": 1,
5070
- "title": "Manual control",
5071
- "type": "paragraph"
5072
- }
5073
- }
5074
- }
5075
- }
5076
- },
5077
- {
5078
- "search": "By default, a click inside content closes the pop (same as an outside click). Set data-on-select="keep" on the panel or a descendant to keep it open while selecting checkboxes, toggles, or menu items.\n",
5079
- "files": {
5080
- "core/components/ui/pop/pop.md": {
5081
- "title": "Pop",
5082
- "hashes": {
5083
- "keep-open-on-select": {
5084
- "count": 1,
5085
- "title": "Keep open on select",
5086
- "type": "paragraph"
5087
- }
5088
- }
5089
- }
5090
- }
5091
- },
5092
- {
5093
- "search": "ArrowDown on the trigger opens the pop when it is closed. Escape closes the most recently opened pop (capture phase, before ancestors such as sonic-modal) and returns focus to that trigger. Multiple pops on the page stack in open order for Escape.\n",
5094
- "files": {
5095
- "core/components/ui/pop/pop.md": {
5096
- "title": "Pop",
5097
- "hashes": {
5098
- "keyboard-and-dismissal": {
5099
- "count": 1,
5100
- "title": "Keyboard and dismissal",
5101
- "type": "paragraph"
5102
- }
5103
- }
5104
- }
5105
- }
5106
- },
5107
- {
5108
- "search": "Methods: show() · hide() on the host element.\n",
5109
- "files": {
5110
- "core/components/ui/pop/pop.md": {
5111
- "title": "Pop",
5112
- "hashes": {
5113
- "api-reference": {
5114
- "count": 1,
5115
- "title": "API reference",
5116
- "type": "paragraph"
5117
- }
5118
- }
5119
- }
5120
- }
5121
- },
5122
- {
5123
- "search": "Events: show · hide (non-bubbling CustomEvent).\n",
5124
- "files": {
5125
- "core/components/ui/pop/pop.md": {
5126
- "title": "Pop",
5127
- "hashes": {
5128
- "api-reference": {
5129
- "count": 1,
5130
- "title": "API reference",
5131
- "type": "paragraph"
5132
- }
5133
- }
5134
- }
5135
- }
5136
- },
5137
- {
5138
- "search": "Content attribute: data-on-select="keep" on content or descendants prevents close-on-click inside the panel.\n",
5139
- "files": {
5140
- "core/components/ui/pop/pop.md": {
5141
- "title": "Pop",
5142
- "hashes": {
5143
- "api-reference": {
5144
- "count": 1,
5145
- "title": "API reference",
5146
- "type": "paragraph"
5147
- }
5148
- }
5149
- }
5150
- }
5151
- },
5152
- {
5153
- "search": "Progress",
5154
- "files": {
5155
- "core/components/ui/progress/progress.md": {
5156
- "title": "Progress",
5157
- "hashes": {
5158
- "progress": {
5159
- "count": 1,
5160
- "title": "",
5161
- "type": "page"
5162
- }
5163
- }
5164
- }
5165
- }
5166
- },
5167
- {
5168
- "search": "Shows task completion on a value / max scale via a native <progress> bar. Omit value for an indeterminate loading animation. Put primary copy in the default slot and optional secondary text in remaining; set invert when the bar sits on a colored surface such as sonic-card.\n",
5169
- "files": {
5170
- "core/components/ui/progress/progress.md": {
5171
- "title": "Progress",
5172
- "hashes": {
5173
- "progress": {
5174
- "count": 1,
5175
- "title": "",
5176
- "type": "paragraph"
5177
- }
5178
- }
5179
- }
5180
- }
5181
- },
5182
- {
5183
- "search": "Set value from 0 to max (default 100). Label text uses the type color.\n",
5184
- "files": {
5185
- "core/components/ui/progress/progress.md": {
5186
- "title": "Progress",
5187
- "hashes": {
5188
- "basic-example": {
5189
- "count": 1,
5190
- "title": "Basic example",
5191
- "type": "paragraph"
5192
- }
5193
- }
5194
- }
5195
- }
5196
- },
5197
- {
5198
- "search": "With no value, the bar animates until progress is known.\n",
5199
- "files": {
5200
- "core/components/ui/progress/progress.md": {
5201
- "title": "Progress",
5202
- "hashes": {
5203
- "indeterminate": {
5204
- "count": 1,
5205
- "title": "Indeterminate",
5206
- "type": "paragraph"
5207
- }
5208
- }
5209
- }
5210
- }
5211
- },
5212
- {
5213
- "search": "Semantic color follows type. With no type, behavior is default.\n",
5214
- "files": {
5215
- "core/components/ui/progress/progress.md": {
5216
- "title": "Progress",
5217
- "hashes": {
5218
- "type": {
5219
- "count": 1,
5220
- "title": "Type",
5221
- "type": "paragraph"
5222
- }
5223
- }
5224
- }
5225
- }
5226
- },
5227
- {
5228
- "search": "Bar height scales with typography via size. With no size, font size matches md (1rem).\n",
5229
- "files": {
5230
- "core/components/ui/progress/progress.md": {
5231
- "title": "Progress",
5232
- "hashes": {
5233
- "size": {
5234
- "count": 1,
5235
- "title": "Size",
5236
- "type": "paragraph"
5237
- }
5238
- }
5239
- }
5240
- }
5241
- },
5242
- {
5243
- "search": "The default slot is the main label (left). remaining is right-aligned with lighter weight—use it for “left to complete” copy.\n",
5244
- "files": {
5245
- "core/components/ui/progress/progress.md": {
5246
- "title": "Progress",
5247
- "hashes": {
5248
- "default-and-remaining-slots": {
5249
- "count": 1,
5250
- "title": "Default and remaining slots",
5251
- "type": "paragraph"
5252
- }
5253
- }
5254
- }
5255
- }
5256
- },
5257
- {
5258
- "search": "On tinted backgrounds, invert adjusts track and fill tokens so the bar stays readable (pair with matching type on sonic-card or similar).\n",
5259
- "files": {
5260
- "core/components/ui/progress/progress.md": {
5261
- "title": "Progress",
5262
- "hashes": {
5263
- "invert": {
5264
- "count": 1,
5265
- "title": "Invert",
5266
- "type": "paragraph"
5267
- }
5268
- }
5269
- }
5270
- }
5271
- },
5272
- {
5273
- "search": "Table",
5274
- "files": {
5275
- "core/components/ui/table/table.md": {
5276
- "title": "Table",
5277
- "hashes": {
5278
- "table": {
5279
- "count": 1,
5280
- "title": "",
5281
- "type": "page"
5282
- }
5283
- }
5284
- }
5285
- }
5286
- },
5287
- {
5288
- "search": "sonic-table lays out tabular data with composable sonic-tr / sonic-th / sonic-td children. The root applies shared typography via size, scrolls horizontally when content overflows, and optionally caps height with maxHeight. Pair with sonic-thead and sonic-tbody for structure and with sonic-list to render fetched rows.\n",
5289
- "files": {
5290
- "core/components/ui/table/table.md": {
5291
- "title": "Table",
5292
- "hashes": {
5293
- "table": {
5294
- "count": 1,
5295
- "title": "",
5296
- "type": "paragraph"
5297
- }
5298
- }
5299
- }
5300
- }
5301
- },
5302
- {
5303
- "search": "A header row plus body rows is enough for static tables; sonic-thead / sonic-tbody are optional for simple layouts.\n",
5304
- "files": {
5305
- "core/components/ui/table/table.md": {
5306
- "title": "Table",
5307
- "hashes": {
5308
- "basic-example": {
5309
- "count": 1,
5310
- "title": "Basic example",
5311
- "type": "paragraph"
5312
- }
5313
- }
5314
- }
5315
- }
5316
- },
5317
- {
5318
- "search": "Place sonic-list inside sonic-tbody so each item template renders a sonic-tr. sonic-list sets row metadata (even / odd / last) on sonic-tr for striping and borders.\n",
5319
- "files": {
5320
- "core/components/ui/table/table.md": {
5321
- "title": "Table",
5322
- "hashes": {
5323
- "list-and-fetch": {
5324
- "count": 1,
5325
- "title": "List and fetch",
2605
+ "title": "Type",
5326
2606
  "type": "paragraph"
5327
2607
  }
5328
2608
  }
@@ -5330,14 +2610,14 @@
5330
2610
  }
5331
2611
  },
5332
2612
  {
5333
- "search": "Default font size is md (omit size). Sizes follow the shared scale (2xs … 2xl).\n",
2613
+ "search": "Filter with formDataProvider + name="contains" (mock API: substring on joke text). Caption and rows via Lit (@subscribe, .items on sonic-queue):\n",
5334
2614
  "files": {
5335
- "core/components/ui/table/table.md": {
5336
- "title": "Table",
2615
+ "core/components/ui/form/input/input.md": {
2616
+ "title": "Input",
5337
2617
  "hashes": {
5338
- "size": {
2618
+ "example-of-use--search--queue": {
5339
2619
  "count": 1,
5340
- "title": "Size",
2620
+ "title": "Example of use — search + queue",
5341
2621
  "type": "paragraph"
5342
2622
  }
5343
2623
  }
@@ -5345,29 +2625,29 @@
5345
2625
  }
5346
2626
  },
5347
2627
  {
5348
- "search": "Set bordered on sonic-table for an outer frame and horizontal rules between rows.\n",
2628
+ "search": "Input-autocomplete",
5349
2629
  "files": {
5350
- "core/components/ui/table/table.md": {
5351
- "title": "Table",
2630
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2631
+ "title": "Input-autocomplete",
5352
2632
  "hashes": {
5353
- "bordered": {
2633
+ "input-autocomplete": {
5354
2634
  "count": 1,
5355
- "title": "Bordered",
5356
- "type": "paragraph"
2635
+ "title": "",
2636
+ "type": "page"
5357
2637
  }
5358
2638
  }
5359
2639
  }
5360
2640
  }
5361
2641
  },
5362
2642
  {
5363
- "search": "maxHeight applies to the scroll container (for example 8rem), so the body scrolls vertically while the table can still scroll horizontally.\n",
2643
+ "search": "Champ formulaire + suggestions via queue. Valeur via formDataProvider + name ; la recherche filtre la queue (store interne).\n",
5364
2644
  "files": {
5365
- "core/components/ui/table/table.md": {
5366
- "title": "Table",
2645
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2646
+ "title": "Input-autocomplete",
5367
2647
  "hashes": {
5368
- "max-height": {
2648
+ "input-autocomplete": {
5369
2649
  "count": 1,
5370
- "title": "Max height",
2650
+ "title": "",
5371
2651
  "type": "paragraph"
5372
2652
  }
5373
2653
  }
@@ -5375,14 +2655,14 @@
5375
2655
  }
5376
2656
  },
5377
2657
  {
5378
- "search": "Set type on sonic-th / sonic-td / sonic-tr for semantic text color (primary · info · success · warning · danger · neutral · default).\n",
2658
+ "search": "Rendu des lignes : propriété .items (callback Lit) — voir les démos ci-dessous. Mock : serviceURL="/docs-mock-api/geo/".\n",
5379
2659
  "files": {
5380
- "core/components/ui/table/table.md": {
5381
- "title": "Table",
2660
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2661
+ "title": "Input-autocomplete",
5382
2662
  "hashes": {
5383
- "type": {
2663
+ "input-autocomplete": {
5384
2664
  "count": 1,
5385
- "title": "Type",
2665
+ "title": "",
5386
2666
  "type": "paragraph"
5387
2667
  }
5388
2668
  }
@@ -5390,14 +2670,14 @@
5390
2670
  }
5391
2671
  },
5392
2672
  {
5393
- "search": "Use colSpan and rowSpan on sonic-th or sonic-td (maps to colspan / rowspan on the cell).\n",
2673
+ "search": "name = paramètre de recherche = valeur formulaire.\n",
5394
2674
  "files": {
5395
- "core/components/ui/table/table.md": {
5396
- "title": "Table",
2675
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2676
+ "title": "Input-autocomplete",
5397
2677
  "hashes": {
5398
- "colspan-and-rowspan": {
2678
+ "simple": {
5399
2679
  "count": 1,
5400
- "title": "Colspan and rowspan",
2680
+ "title": "Simple",
5401
2681
  "type": "paragraph"
5402
2682
  }
5403
2683
  }
@@ -5405,14 +2685,14 @@
5405
2685
  }
5406
2686
  },
5407
2687
  {
5408
- "search": "align sets horizontal alignment (left · center · right). minWidth / maxWidth / width set inline dimensions on the cell. vAlign is available on sonic-td only.\n",
2688
+ "search": "Recherche sur nom, valeur formulaire = code. Préremplissage via value.\n",
5409
2689
  "files": {
5410
- "core/components/ui/table/table.md": {
5411
- "title": "Table",
2690
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2691
+ "title": "Input-autocomplete",
5412
2692
  "hashes": {
5413
- "cell-alignment-and-width": {
2693
+ "valeur--paramètre-de-recherche": {
5414
2694
  "count": 1,
5415
- "title": "Cell alignment and width",
2695
+ "title": "Valeur ≠ paramètre de recherche",
5416
2696
  "type": "paragraph"
5417
2697
  }
5418
2698
  }
@@ -5420,14 +2700,14 @@
5420
2700
  }
5421
2701
  },
5422
2702
  {
5423
- "search": "Tables scroll horizontally by default when columns exceed the viewport. Use minWidth on wide columns to preserve readable line length.\n",
2703
+ "search": "À la fermeture du pop, seule une valeur de la liste (ou vide) est conservée.\n",
5424
2704
  "files": {
5425
- "core/components/ui/table/table.md": {
5426
- "title": "Table",
2705
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2706
+ "title": "Input-autocomplete",
5427
2707
  "hashes": {
5428
- "responsive-layout": {
2708
+ "mode-select": {
5429
2709
  "count": 1,
5430
- "title": "Responsive layout",
2710
+ "title": "Mode select",
5431
2711
  "type": "paragraph"
5432
2712
  }
5433
2713
  }
@@ -5435,14 +2715,14 @@
5435
2715
  }
5436
2716
  },
5437
2717
  {
5438
- "search": "sonic-th uses position: sticky with top: 0 inside the table. For page-level sticky headers, set noCustomScroll on sonic-table and position sonic-thead (for example class="sticky top-16"). Add sonic-caption for a table title below the grid.\n",
2718
+ "search": "data-keyboard-nav sur le champ et les items (flèches haut / bas).\n",
5439
2719
  "files": {
5440
- "core/components/ui/table/table.md": {
5441
- "title": "Table",
2720
+ "core/components/ui/form/input-autocomplete/input-autocomplete.md": {
2721
+ "title": "Input-autocomplete",
5442
2722
  "hashes": {
5443
- "sticky-header-and-caption": {
2723
+ "navigation-clavier": {
5444
2724
  "count": 1,
5445
- "title": "Sticky header and caption",
2725
+ "title": "Navigation clavier",
5446
2726
  "type": "paragraph"
5447
2727
  }
5448
2728
  }
@@ -5450,59 +2730,59 @@
5450
2730
  }
5451
2731
  },
5452
2732
  {
5453
- "search": "sonic-tbody wraps slotted rows in a native <tbody> and applies zebra / hover backgrounds to sonic-tr children.\n",
2733
+ "search": "Radio",
5454
2734
  "files": {
5455
- "core/components/ui/table/table.md": {
5456
- "title": "Table",
2735
+ "core/components/ui/form/radio/radio.md": {
2736
+ "title": "Radio",
5457
2737
  "hashes": {
5458
- "sonic-thead--sonic-tbody--sonic-tfoot": {
2738
+ "radio": {
5459
2739
  "count": 1,
5460
- "title": "`sonic-thead` · `sonic-tbody` · `sonic-tfoot`",
5461
- "type": "paragraph"
2740
+ "title": "",
2741
+ "type": "page"
5462
2742
  }
5463
2743
  }
5464
2744
  }
5465
2745
  }
5466
2746
  },
5467
2747
  {
5468
- "search": "Theme",
2748
+ "search": "Same mock filter as Checkbox (blacklistFlags query param). Radio sends one flag at a time.\n",
5469
2749
  "files": {
5470
- "core/components/ui/theme/theme.md": {
5471
- "title": "Theme",
2750
+ "core/components/ui/form/radio/radio.md": {
2751
+ "title": "Radio",
5472
2752
  "hashes": {
5473
- "theme": {
2753
+ "example-of-use--blacklist--queue": {
5474
2754
  "count": 1,
5475
- "title": "",
5476
- "type": "page"
2755
+ "title": "Example of use — blacklist + queue",
2756
+ "type": "paragraph"
5477
2757
  }
5478
2758
  }
5479
2759
  }
5480
2760
  }
5481
2761
  },
5482
2762
  {
5483
- "search": "sonic-theme wraps a Concorde UI: it registers --sc-* design tokens and provides the default slot for your app. With no theme attribute (or theme="custom"), only shared primitives and your overrides apply—built-in light / dark / auto palettes are opt-in. Set color and font when the host should carry base text and typography; add Tailwind bg-base and block (or min-h-screen) on the tag for a full surface fill. Popovers, modals, and toasts mount under the nearest connected theme (see Pop container). Import @supersoniks/concorde/theme once at the app entry. For the full public token list and brand overrides, see Customization.\n",
2763
+ "search": "Select",
5484
2764
  "files": {
5485
- "core/components/ui/theme/theme.md": {
5486
- "title": "Theme",
2765
+ "core/components/ui/form/select/select.md": {
2766
+ "title": "Select",
5487
2767
  "hashes": {
5488
- "theme": {
2768
+ "select": {
5489
2769
  "count": 1,
5490
2770
  "title": "",
5491
- "type": "paragraph"
2771
+ "type": "page"
5492
2772
  }
5493
2773
  }
5494
2774
  }
5495
2775
  }
5496
2776
  },
5497
2777
  {
5498
- "search": "Wrap interactive components so tokens and overlays resolve from one root.\n",
2778
+ "search": "name="lang" is sent as ?lang=fr|en to the doc mock API (filterDocsJokes). Same pattern as Input (contains):\n",
5499
2779
  "files": {
5500
- "core/components/ui/theme/theme.md": {
5501
- "title": "Theme",
2780
+ "core/components/ui/form/select/select.md": {
2781
+ "title": "Select",
5502
2782
  "hashes": {
5503
- "basic-example": {
2783
+ "example-of-use--language-filter--queue": {
5504
2784
  "count": 1,
5505
- "title": "Basic example",
2785
+ "title": "Example of use — language filter + queue",
5506
2786
  "type": "paragraph"
5507
2787
  }
5508
2788
  }
@@ -5510,29 +2790,29 @@
5510
2790
  }
5511
2791
  },
5512
2792
  {
5513
- "search": "Default: omit theme or set theme="custom". The host loads core tokens (--sc-rounded, shadows, form defaults, …) and any --sc-* you set; it does not apply the built-in light or dark palette.\n",
2793
+ "search": "Switch",
5514
2794
  "files": {
5515
- "core/components/ui/theme/theme.md": {
5516
- "title": "Theme",
2795
+ "core/components/ui/form/switch/switch.md": {
2796
+ "title": "Switch",
5517
2797
  "hashes": {
5518
- "theme-mode": {
2798
+ "switch": {
5519
2799
  "count": 1,
5520
- "title": "Theme mode",
5521
- "type": "paragraph"
2800
+ "title": "",
2801
+ "type": "page"
5522
2802
  }
5523
2803
  }
5524
2804
  }
5525
2805
  }
5526
2806
  },
5527
2807
  {
5528
- "search": "Set theme to light or dark for Concorde’s preset palettes. Set theme="auto" to follow prefers-color-scheme (light palette until the OS prefers dark).\n",
2808
+ "search": "Same mock filter as Checkbox; switches can enable several flags (comma-separated in the query).\n",
5529
2809
  "files": {
5530
- "core/components/ui/theme/theme.md": {
5531
- "title": "Theme",
2810
+ "core/components/ui/form/switch/switch.md": {
2811
+ "title": "Switch",
5532
2812
  "hashes": {
5533
- "theme-mode": {
2813
+ "example-of-use--blacklist--queue": {
5534
2814
  "count": 1,
5535
- "title": "Theme mode",
2815
+ "title": "Example of use — blacklist + queue",
5536
2816
  "type": "paragraph"
5537
2817
  }
5538
2818
  }
@@ -5540,87 +2820,87 @@
5540
2820
  }
5541
2821
  },
5542
2822
  {
5543
- "search": "color sets text from --sc-base-content. font applies --sc-font-family-base, --sc-font-weight-base, and --sc-font-style-base. For the page or shell background, use bg-base on sonic-theme (maps to --sc-base in Tailwind) with block so the host paints the surface. Components keep their own fallbacks when color / font are omitted.\n",
2823
+ "search": "Textarea",
5544
2824
  "files": {
5545
- "core/components/ui/theme/theme.md": {
5546
- "title": "Theme",
2825
+ "core/components/ui/form/textarea/textarea.md": {
2826
+ "title": "Textarea",
5547
2827
  "hashes": {
5548
- "presentation": {
2828
+ "textarea": {
5549
2829
  "count": 1,
5550
- "title": "Presentation",
5551
- "type": "paragraph"
2830
+ "title": "",
2831
+ "type": "page"
5552
2832
  }
5553
2833
  }
5554
2834
  }
5555
2835
  }
5556
2836
  },
5557
2837
  {
5558
- "search": "Override primitives on sonic-theme (or :root / a project stylesheet). Derived radii, shadows, and control rounding are computed from tokens such as --sc-rounded—avoid copying long lists of internal variables unless you have a specific need.\n",
2838
+ "search": "Group",
5559
2839
  "files": {
5560
- "core/components/ui/theme/theme.md": {
5561
- "title": "Theme",
2840
+ "core/components/ui/group/group.md": {
2841
+ "title": "Group",
5562
2842
  "hashes": {
5563
- "custom-tokens": {
2843
+ "group": {
5564
2844
  "count": 1,
5565
- "title": "Custom tokens",
5566
- "type": "paragraph"
2845
+ "title": "",
2846
+ "type": "page"
5567
2847
  }
5568
2848
  }
5569
2849
  }
5570
2850
  }
5571
2851
  },
5572
2852
  {
5573
- "search": "Theme.getPopContainer() returns the last connected sonic-theme, or document.body if none is connected. When a theme disconnects, the previous connected instance is adopted. Imperative Modal.create() and declarative sonic-modal use the same container.\n",
2853
+ "search": "Icon",
5574
2854
  "files": {
5575
- "core/components/ui/theme/theme.md": {
5576
- "title": "Theme",
2855
+ "core/components/ui/icon/icon.md": {
2856
+ "title": "Icon",
5577
2857
  "hashes": {
5578
- "pop-container": {
2858
+ "icon": {
5579
2859
  "count": 1,
5580
- "title": "Pop container",
5581
- "type": "paragraph"
2860
+ "title": "",
2861
+ "type": "page"
5582
2862
  }
5583
2863
  }
5584
2864
  }
5585
2865
  }
5586
2866
  },
5587
2867
  {
5588
- "search": "On connect, the theme publishes resolved --sc-* values and linked font stylesheet URLs (Google Fonts / Adobe Fonts) to the sonic-theme data channel and **postMessage**s them to same-page iframes. Iframes can request a refresh by posting { type: "GetSonicTheme" }.\n",
2868
+ "search": "Image",
5589
2869
  "files": {
5590
- "core/components/ui/theme/theme.md": {
5591
- "title": "Theme",
2870
+ "core/components/ui/image/image.md": {
2871
+ "title": "Image",
5592
2872
  "hashes": {
5593
- "embedded-iframes": {
2873
+ "image": {
5594
2874
  "count": 1,
5595
- "title": "Embedded iframes",
5596
- "type": "paragraph"
2875
+ "title": "",
2876
+ "type": "page"
5597
2877
  }
5598
2878
  }
5599
2879
  }
5600
2880
  }
5601
2881
  },
5602
2882
  {
5603
- "search": "Surface background: Tailwind bg-base on sonic-theme (requires Concorde Tailwind color base → --sc-base).\n",
2883
+ "search": "Link",
5604
2884
  "files": {
5605
- "core/components/ui/theme/theme.md": {
5606
- "title": "Theme",
2885
+ "core/components/ui/link/link.md": {
2886
+ "title": "Link",
5607
2887
  "hashes": {
5608
- "api-reference": {
2888
+ "link": {
5609
2889
  "count": 1,
5610
- "title": "API reference",
5611
- "type": "paragraph"
2890
+ "title": "",
2891
+ "type": "page"
5612
2892
  }
5613
2893
  }
5614
2894
  }
5615
2895
  }
5616
2896
  },
5617
2897
  {
5618
- "search": "Toast",
2898
+ "search": "Loader",
5619
2899
  "files": {
5620
- "core/components/ui/toast/toast.md": {
5621
- "title": "Toast",
2900
+ "core/components/ui/loader/loader.md": {
2901
+ "title": "Loader",
5622
2902
  "hashes": {
5623
- "toast": {
2903
+ "loader": {
5624
2904
  "count": 1,
5625
2905
  "title": "",
5626
2906
  "type": "page"
@@ -5630,74 +2910,74 @@
5630
2910
  }
5631
2911
  },
5632
2912
  {
5633
- "search": "Toasts surface short-lived feedback in a fixed stack (bottom-right in the main window). Queue messages with SonicToast.add() on the global SonicToast class—the host sonic-toast is created automatically. Prefer label for a heading; use preserve or interactive text when the user must read or act before dismiss.\n",
2913
+ "search": "Menu",
5634
2914
  "files": {
5635
- "core/components/ui/toast/toast.md": {
5636
- "title": "Toast",
2915
+ "core/components/ui/menu/menu.md": {
2916
+ "title": "Menu",
5637
2917
  "hashes": {
5638
- "toast": {
2918
+ "menu": {
5639
2919
  "count": 1,
5640
2920
  "title": "",
5641
- "type": "paragraph"
2921
+ "type": "page"
5642
2922
  }
5643
2923
  }
5644
2924
  }
5645
2925
  }
5646
2926
  },
5647
2927
  {
5648
- "search": "Click the button to show a toast.\n",
2928
+ "search": "Modal",
5649
2929
  "files": {
5650
- "core/components/ui/toast/toast.md": {
5651
- "title": "Toast",
2930
+ "core/components/ui/modal/modal.md": {
2931
+ "title": "Modal",
5652
2932
  "hashes": {
5653
- "basic-example": {
2933
+ "modal": {
5654
2934
  "count": 1,
5655
- "title": "Basic example",
5656
- "type": "paragraph"
2935
+ "title": "",
2936
+ "type": "page"
5657
2937
  }
5658
2938
  }
5659
2939
  }
5660
2940
  }
5661
2941
  },
5662
2942
  {
5663
- "search": "status drives color, icon, and live-region behavior. Omit status or pass an empty string for a neutral toast.\n",
2943
+ "search": "Pop",
5664
2944
  "files": {
5665
- "core/components/ui/toast/toast.md": {
5666
- "title": "Toast",
2945
+ "core/components/ui/pop/pop.md": {
2946
+ "title": "Pop",
5667
2947
  "hashes": {
5668
- "status": {
2948
+ "pop": {
5669
2949
  "count": 1,
5670
- "title": "Status",
5671
- "type": "paragraph"
2950
+ "title": "",
2951
+ "type": "page"
5672
2952
  }
5673
2953
  }
5674
2954
  }
5675
2955
  }
5676
2956
  },
5677
2957
  {
5678
- "search": "Set label for a bold title above text. title still works but is deprecated—use label in new code.\n",
2958
+ "search": "Progress bar",
5679
2959
  "files": {
5680
- "core/components/ui/toast/toast.md": {
5681
- "title": "Toast",
2960
+ "core/components/ui/progress/progress.md": {
2961
+ "title": "Progress bar",
5682
2962
  "hashes": {
5683
- "label": {
2963
+ "progress-bar": {
5684
2964
  "count": 1,
5685
- "title": "Label",
5686
- "type": "paragraph"
2965
+ "title": "",
2966
+ "type": "page"
5687
2967
  }
5688
2968
  }
5689
2969
  }
5690
2970
  }
5691
2971
  },
5692
2972
  {
5693
- "search": "text (and label) can include HTML strings. Links and controls in text automatically enable preserve so the toast does not auto-hide while the user interacts.\n",
2973
+ "search": "Displays an indicator showing the completion progress of a task.\n",
5694
2974
  "files": {
5695
- "core/components/ui/toast/toast.md": {
5696
- "title": "Toast",
2975
+ "core/components/ui/progress/progress.md": {
2976
+ "title": "Progress bar",
5697
2977
  "hashes": {
5698
- "html-in-text": {
2978
+ "progress-bar": {
5699
2979
  "count": 1,
5700
- "title": "HTML in text",
2980
+ "title": "",
5701
2981
  "type": "paragraph"
5702
2982
  }
5703
2983
  }
@@ -5705,29 +2985,29 @@
5705
2985
  }
5706
2986
  },
5707
2987
  {
5708
- "search": "Without preserve, toasts auto-hide after about six seconds (timer pauses on hover or focus). Set preserve to keep the toast until the user closes it.\n",
2988
+ "search": "Table",
5709
2989
  "files": {
5710
- "core/components/ui/toast/toast.md": {
5711
- "title": "Toast",
2990
+ "core/components/ui/table/table.md": {
2991
+ "title": "Table",
5712
2992
  "hashes": {
5713
- "preserve": {
2993
+ "table": {
5714
2994
  "count": 1,
5715
- "title": "Preserve",
5716
- "type": "paragraph"
2995
+ "title": "",
2996
+ "type": "page"
5717
2997
  }
5718
2998
  }
5719
2999
  }
5720
3000
  }
5721
3001
  },
5722
3002
  {
5723
- "search": "With dismissForever and a stable id, closing the toast stores dismissal in localStorage—SonicToast.add skips it on later visits. Duplicate payloads (same fields, ignoring id) are not queued twice.\n",
3003
+ "search": "Values available : primary, info, success, warning, danger\n",
5724
3004
  "files": {
5725
- "core/components/ui/toast/toast.md": {
5726
- "title": "Toast",
3005
+ "core/components/ui/table/table.md": {
3006
+ "title": "Table",
5727
3007
  "hashes": {
5728
- "dismiss-forever": {
3008
+ "type": {
5729
3009
  "count": 1,
5730
- "title": "Dismiss forever",
3010
+ "title": "Type",
5731
3011
  "type": "paragraph"
5732
3012
  }
5733
3013
  }
@@ -5735,14 +3015,14 @@
5735
3015
  }
5736
3016
  },
5737
3017
  {
5738
- "search": "ghost renders a semi-transparent, non-interactive toast—useful for loading or background states. SonicToast.removeAll leaves ghost toasts in place.\n",
3018
+ "search": "The following attributes will be used to set the style of the component : \n",
5739
3019
  "files": {
5740
- "core/components/ui/toast/toast.md": {
5741
- "title": "Toast",
3020
+ "core/components/ui/table/table.md": {
3021
+ "title": "Table",
5742
3022
  "hashes": {
5743
- "ghost": {
3023
+ "cell-style-attributes": {
5744
3024
  "count": 1,
5745
- "title": "Ghost",
3025
+ "title": "Cell style attributes",
5746
3026
  "type": "paragraph"
5747
3027
  }
5748
3028
  }
@@ -5750,14 +3030,14 @@
5750
3030
  }
5751
3031
  },
5752
3032
  {
5753
- "search": "Use static helpers to clear the stack from app logic (for example after navigation).\n",
3033
+ "search": "Every table is responsive by default\n",
5754
3034
  "files": {
5755
- "core/components/ui/toast/toast.md": {
5756
- "title": "Toast",
3035
+ "core/components/ui/table/table.md": {
3036
+ "title": "Table",
5757
3037
  "hashes": {
5758
- "dismissal": {
3038
+ "responsive": {
5759
3039
  "count": 1,
5760
- "title": "Dismissal",
3040
+ "title": "Responsive",
5761
3041
  "type": "paragraph"
5762
3042
  }
5763
3043
  }
@@ -5765,29 +3045,29 @@
5765
3045
  }
5766
3046
  },
5767
3047
  {
5768
- "search": "Removes every toast except ghost items.\n",
3048
+ "search": "Toast",
5769
3049
  "files": {
5770
3050
  "core/components/ui/toast/toast.md": {
5771
3051
  "title": "Toast",
5772
3052
  "hashes": {
5773
- "remove-all": {
3053
+ "toast": {
5774
3054
  "count": 1,
5775
- "title": "Remove all",
5776
- "type": "paragraph"
3055
+ "title": "",
3056
+ "type": "page"
5777
3057
  }
5778
3058
  }
5779
3059
  }
5780
3060
  }
5781
3061
  },
5782
3062
  {
5783
- "search": "Removes toasts that are not preserve.\n",
3063
+ "search": "Les statuts disponibles sont : success, error, warning, info ou vide (par défaut).\n",
5784
3064
  "files": {
5785
3065
  "core/components/ui/toast/toast.md": {
5786
3066
  "title": "Toast",
5787
3067
  "hashes": {
5788
- "remove-temporary-items": {
3068
+ "statut": {
5789
3069
  "count": 1,
5790
- "title": "Remove temporary items",
3070
+ "title": "Statut",
5791
3071
  "type": "paragraph"
5792
3072
  }
5793
3073
  }
@@ -5795,14 +3075,14 @@
5795
3075
  }
5796
3076
  },
5797
3077
  {
5798
- "search": "Each toast uses role="alert" for error and role="status" otherwise (with aria-live="polite" when applicable). Status icons are decorative (aria-hidden). The close control has an i18n aria-label. When there is no label, a truncated string aria-label may be derived from plain text.\n",
3078
+ "search": "Le contenu du toast peut contenir du HTML.\n",
5799
3079
  "files": {
5800
3080
  "core/components/ui/toast/toast.md": {
5801
3081
  "title": "Toast",
5802
3082
  "hashes": {
5803
- "accessibility": {
3083
+ "avec-contenu-html": {
5804
3084
  "count": 1,
5805
- "title": "Accessibility",
3085
+ "title": "Avec contenu HTML",
5806
3086
  "type": "paragraph"
5807
3087
  }
5808
3088
  }
@@ -5810,14 +3090,14 @@
5810
3090
  }
5811
3091
  },
5812
3092
  {
5813
- "search": "Options passed to SonicToast.add(conf):\n",
3093
+ "search": "Par défaut, les toasts disparaissent automatiquement. Avec preserve: true, le toast reste affiché jusqu'à ce qu'il soit fermé manuellement.\n",
5814
3094
  "files": {
5815
3095
  "core/components/ui/toast/toast.md": {
5816
3096
  "title": "Toast",
5817
3097
  "hashes": {
5818
- "api-reference": {
3098
+ "persistance": {
5819
3099
  "count": 1,
5820
- "title": "API reference",
3100
+ "title": "Persistance",
5821
3101
  "type": "paragraph"
5822
3102
  }
5823
3103
  }
@@ -5825,14 +3105,14 @@
5825
3105
  }
5826
3106
  },
5827
3107
  {
5828
- "search": "sonic-toast is mounted automatically; sonic-toast-item is internal. In iframes, toasts can delegate to the parent window via postMessage.\n",
3108
+ "search": "Avec dismissForever: true et un id, le toast peut être masqué définitivement. Une fois fermé, il ne réapparaîtra plus même après rechargement de la page.\n",
5829
3109
  "files": {
5830
3110
  "core/components/ui/toast/toast.md": {
5831
3111
  "title": "Toast",
5832
3112
  "hashes": {
5833
- "api-reference": {
3113
+ "masquer-définitivement": {
5834
3114
  "count": 1,
5835
- "title": "API reference",
3115
+ "title": "Masquer définitivement",
5836
3116
  "type": "paragraph"
5837
3117
  }
5838
3118
  }
@@ -5840,29 +3120,29 @@
5840
3120
  }
5841
3121
  },
5842
3122
  {
5843
- "search": "Tooltip",
3123
+ "search": "Avec ghost: true, le toast devient semi-transparent et non-interactif.\n",
5844
3124
  "files": {
5845
- "core/components/ui/tooltip/tooltip.md": {
5846
- "title": "Tooltip",
3125
+ "core/components/ui/toast/toast.md": {
3126
+ "title": "Toast",
5847
3127
  "hashes": {
5848
- "tooltip": {
3128
+ "fantôme": {
5849
3129
  "count": 1,
5850
- "title": "",
5851
- "type": "page"
3130
+ "title": "Fantôme",
3131
+ "type": "paragraph"
5852
3132
  }
5853
3133
  }
5854
3134
  }
5855
3135
  }
5856
3136
  },
5857
3137
  {
5858
- "search": "Tooltip shows a short label on hover (and on focus when the trigger can receive focus). Wrap the trigger in the default slot—buttons, icons, or plain text. Default placement is top (center-aligned). An empty label hides the bubble the same way as disabled.\n",
3138
+ "search": "Supprime tous les toasts sauf ceux marqués comme ghost.\n",
5859
3139
  "files": {
5860
- "core/components/ui/tooltip/tooltip.md": {
5861
- "title": "Tooltip",
3140
+ "core/components/ui/toast/toast.md": {
3141
+ "title": "Toast",
5862
3142
  "hashes": {
5863
- "tooltip": {
3143
+ "tout-supprimer": {
5864
3144
  "count": 1,
5865
- "title": "",
3145
+ "title": "Tout supprimer",
5866
3146
  "type": "paragraph"
5867
3147
  }
5868
3148
  }
@@ -5870,14 +3150,14 @@
5870
3150
  }
5871
3151
  },
5872
3152
  {
5873
- "search": "Use top · bottom · left · right for the main axis. Add -start or -end to align the bubble along the anchor edge.\n",
3153
+ "search": "Supprime tous les toasts d'un statut spécifique.\n",
5874
3154
  "files": {
5875
- "core/components/ui/tooltip/tooltip.md": {
5876
- "title": "Tooltip",
3155
+ "core/components/ui/toast/toast.md": {
3156
+ "title": "Toast",
5877
3157
  "hashes": {
5878
- "placement": {
3158
+ "supprimer-par-statut": {
5879
3159
  "count": 1,
5880
- "title": "Placement",
3160
+ "title": "Supprimer par statut",
5881
3161
  "type": "paragraph"
5882
3162
  }
5883
3163
  }
@@ -5885,14 +3165,14 @@
5885
3165
  }
5886
3166
  },
5887
3167
  {
5888
- "search": "label supports line breaks (\\n in markup or multiline text). Lines are trimmed;   is normalized to spaces. white-space: pre-line preserves breaks in the bubble (max width 18rem).\n",
3168
+ "search": "Supprime tous les toasts qui ne sont pas marqués comme preserve.\n",
5889
3169
  "files": {
5890
- "core/components/ui/tooltip/tooltip.md": {
5891
- "title": "Tooltip",
3170
+ "core/components/ui/toast/toast.md": {
3171
+ "title": "Toast",
5892
3172
  "hashes": {
5893
- "label-formatting": {
3173
+ "supprimer-les-éléments-temporaires": {
5894
3174
  "count": 1,
5895
- "title": "Label formatting",
3175
+ "title": "Supprimer les éléments temporaires",
5896
3176
  "type": "paragraph"
5897
3177
  }
5898
3178
  }
@@ -5900,29 +3180,29 @@
5900
3180
  }
5901
3181
  },
5902
3182
  {
5903
- "search": "On non-interactive triggers, set focusable so the host gets tabindex="0" and the tooltip opens on keyboard focus as well as hover.\n",
3183
+ "search": "Tooltip",
5904
3184
  "files": {
5905
3185
  "core/components/ui/tooltip/tooltip.md": {
5906
3186
  "title": "Tooltip",
5907
3187
  "hashes": {
5908
- "focusable": {
3188
+ "tooltip": {
5909
3189
  "count": 1,
5910
- "title": "Focusable",
5911
- "type": "paragraph"
3190
+ "title": "",
3191
+ "type": "page"
5912
3192
  }
5913
3193
  }
5914
3194
  }
5915
3195
  }
5916
3196
  },
5917
3197
  {
5918
- "search": "The bubble uses popover="hint" (non-modal, no pointer capture). Prefer focusable when the slotted content is not already focusable. When the Popover API is unavailable, the host falls back to the native title attribute with a single-line label. Opacity transitions respect prefers-reduced-motion.\n",
3198
+ "search": "By default, tooltip is centered next to its content\n",
5919
3199
  "files": {
5920
3200
  "core/components/ui/tooltip/tooltip.md": {
5921
3201
  "title": "Tooltip",
5922
3202
  "hashes": {
5923
- "accessibility": {
3203
+ "placement": {
5924
3204
  "count": 1,
5925
- "title": "Accessibility",
3205
+ "title": "Placement",
5926
3206
  "type": "paragraph"
5927
3207
  }
5928
3208
  }
@@ -11040,7 +8320,7 @@
11040
8320
  }
11041
8321
  },
11042
8322
  {
11043
- "search": "Based on lit.dev, Concorde is a collection of web components for shared apps and websites.Build UIs without tying components to a specific host stack, while keeping visual consistency through the smallest set of CSS variables needed to define a theme.\n",
8323
+ "search": "Based on lit.dev, Concorde is a collection of web components for shared apps and websites.Build UIs without tying components to a specific host stack, while keeping visual consistency through a small set of CSS variables.\n",
11044
8324
  "files": {
11045
8325
  "docs/_getting-started/start.md": {
11046
8326
  "title": "Introduction",
@@ -11100,12 +8380,12 @@
11100
8380
  }
11101
8381
  },
11102
8382
  {
11103
- "search": "Customization",
8383
+ "search": "Adding styles",
11104
8384
  "files": {
11105
8385
  "docs/_getting-started/theming.md": {
11106
- "title": "Customization",
8386
+ "title": "Adding styles",
11107
8387
  "hashes": {
11108
- "customization": {
8388
+ "adding-styles": {
11109
8389
  "count": 1,
11110
8390
  "title": "",
11111
8391
  "type": "page"
@@ -11115,29 +8395,14 @@
11115
8395
  }
11116
8396
  },
11117
8397
  {
11118
- "search": "Concorde components ship with default styles (fallback values in each component and in <sonic-theme>).You do not need to define any CSS variables to get a usable UI.\n",
11119
- "files": {
11120
- "docs/_getting-started/theming.md": {
11121
- "title": "Customization",
11122
- "hashes": {
11123
- "theme-first-customization": {
11124
- "count": 1,
11125
- "title": "Theme-first customization",
11126
- "type": "paragraph"
11127
- }
11128
- }
11129
- }
11130
- }
11131
- },
11132
- {
11133
- "search": "To align the kit with your brand, override only the essential theme tokens on <sonic-theme>, on :root, or in a project stylesheet.Concorde derives radius steps, button/input rounding, shadows, and most per-component layout from these primitives—do not copy long lists of derived variables unless you have a specific need.\n",
8398
+ "search": "No style crosses the shadow root of a component, except for inheritable properties (which have the "inherit" property possible) and CSS variables.\nProperties integrated via a "slot" remain stylizable in a conventional way.\n",
11134
8399
  "files": {
11135
8400
  "docs/_getting-started/theming.md": {
11136
- "title": "Customization",
8401
+ "title": "Adding styles",
11137
8402
  "hashes": {
11138
- "theme-first-customization": {
8403
+ "normal-behavior": {
11139
8404
  "count": 1,
11140
- "title": "Theme-first customization",
8405
+ "title": "Normal Behavior",
11141
8406
  "type": "paragraph"
11142
8407
  }
11143
8408
  }
@@ -11145,14 +8410,14 @@
11145
8410
  }
11146
8411
  },
11147
8412
  {
11148
- "search": "Popovers, modals, and toasts mount under the nearest <sonic-theme>.\n",
8413
+ "search": "The declaration of reactive properties is useful for selecting a particular configuration that mostly affects a set of properties.\n",
11149
8414
  "files": {
11150
8415
  "docs/_getting-started/theming.md": {
11151
- "title": "Customization",
8416
+ "title": "Adding styles",
11152
8417
  "hashes": {
11153
- "theme-first-customization": {
8418
+ "choosing-style-presets-via-reactive-properties": {
11154
8419
  "count": 1,
11155
- "title": "Theme-first customization",
8420
+ "title": "Choosing Style Presets via Reactive Properties:",
11156
8421
  "type": "paragraph"
11157
8422
  }
11158
8423
  }
@@ -11160,14 +8425,14 @@
11160
8425
  }
11161
8426
  },
11162
8427
  {
11163
- "search": "Example (full brand override on <sonic-theme> or :root). Set every essential token below; derived radii and shadows still come from the theme engine—only --sc-rounded is listed here.\n",
8428
+ "search": "For example, a size property (xs, sm, md, xl) will affect margins, font, line heights to align them with the corresponding CSS vars, which can be customized using the methods mentioned earlier if necessary.\n",
11164
8429
  "files": {
11165
8430
  "docs/_getting-started/theming.md": {
11166
- "title": "Customization",
8431
+ "title": "Adding styles",
11167
8432
  "hashes": {
11168
- "customization-example": {
8433
+ "choosing-style-presets-via-reactive-properties": {
11169
8434
  "count": 1,
11170
- "title": "Customization example",
8435
+ "title": "Choosing Style Presets via Reactive Properties:",
11171
8436
  "type": "paragraph"
11172
8437
  }
11173
8438
  }
@@ -11175,14 +8440,14 @@
11175
8440
  }
11176
8441
  },
11177
8442
  {
11178
- "search": " /* Text/icons on semantic fills */\n --sc-primary-content: #fff;\n --sc-secondary-content: #fff;\n --sc-info-content: #fff;\n --sc-danger-content: #fff;\n --sc-warning-content: #fff;\n --sc-success-content: #fff;\n --sc-contrast-content: #fff;\n",
8443
+ "search": "It is recommended to use the {reflect: true} property for reactive properties that have an associated style on the :host(). For example: :host([type='primary']){...}\n",
11179
8444
  "files": {
11180
8445
  "docs/_getting-started/theming.md": {
11181
- "title": "Customization",
8446
+ "title": "Adding styles",
11182
8447
  "hashes": {
11183
- "customization-example": {
8448
+ "choosing-style-presets-via-reactive-properties": {
11184
8449
  "count": 1,
11185
- "title": "Customization example",
8450
+ "title": "Choosing Style Presets via Reactive Properties:",
11186
8451
  "type": "paragraph"
11187
8452
  }
11188
8453
  }
@@ -11190,14 +8455,14 @@
11190
8455
  }
11191
8456
  },
11192
8457
  {
11193
- "search": " /* Neutral fills */\n --sc-base: #fff;\n --sc-base-50: #f6f6f5;\n --sc-base-100: #ededec;\n --sc-base-200: #d7d7d4;\n --sc-base-300: #c8c7c4;\n --sc-base-400: #a8a7a2;\n --sc-base-500: #94938c;\n --sc-base-600: #76756c;\n --sc-base-700: #59584e;\n --sc-base-800: #47463b;\n --sc-base-900: #353429;\n",
8458
+ "search": "☢️ Caution: Passing class names via reactive properties / HTML attributes of the component should be avoided as it can quickly lead to difficult-to-manage situations.\n",
11194
8459
  "files": {
11195
8460
  "docs/_getting-started/theming.md": {
11196
- "title": "Customization",
8461
+ "title": "Adding styles",
11197
8462
  "hashes": {
11198
- "customization-example": {
8463
+ "choosing-style-presets-via-reactive-properties": {
11199
8464
  "count": 1,
11200
- "title": "Customization example",
8465
+ "title": "Choosing Style Presets via Reactive Properties:",
11201
8466
  "type": "paragraph"
11202
8467
  }
11203
8468
  }
@@ -11205,14 +8470,14 @@
11205
8470
  }
11206
8471
  },
11207
8472
  {
11208
- "search": " /* Text/icons on neutral surfaces */\n --sc-base-content: var(--sc-base-900);\n",
8473
+ "search": "By default, the display property is inline.\nTherefore, be careful to define it according to the needs, as one might mistakenly expect it to be block as with a regular <div>.\n",
11209
8474
  "files": {
11210
8475
  "docs/_getting-started/theming.md": {
11211
- "title": "Customization",
8476
+ "title": "Adding styles",
11212
8477
  "hashes": {
11213
- "customization-example": {
8478
+ "css-display-property": {
11214
8479
  "count": 1,
11215
- "title": "Customization example",
8480
+ "title": "CSS \"display\" Property",
11216
8481
  "type": "paragraph"
11217
8482
  }
11218
8483
  }
@@ -11220,14 +8485,14 @@
11220
8485
  }
11221
8486
  },
11222
8487
  {
11223
- "search": " /* Typography */\n --sc-font-family-base: "Oswald", system-ui, -apple-system, "Segoe UI", Roboto,\n "Helvetica Neue", Arial, sans-serif;\n --sc-headings-font-family: "alternate-gothic-compressed", system-ui, sans-serif;\n --sc-headings-line-height: 1.1;\n --sc-headings-font-weight: bold;\n --sc-headings-text-transform: none;\n",
8488
+ "search": "☢️ Caution: Defining the display property as contents may seem attractive at first, but:\n",
11224
8489
  "files": {
11225
8490
  "docs/_getting-started/theming.md": {
11226
- "title": "Customization",
8491
+ "title": "Adding styles",
11227
8492
  "hashes": {
11228
- "customization-example": {
8493
+ "css-display-property": {
11229
8494
  "count": 1,
11230
- "title": "Customization example",
8495
+ "title": "CSS \"display\" Property",
11231
8496
  "type": "paragraph"
11232
8497
  }
11233
8498
  }
@@ -11235,14 +8500,14 @@
11235
8500
  }
11236
8501
  },
11237
8502
  {
11238
- "search": " /* Shape (primitive only) */\n --sc-rounded: 0;\n",
8503
+ "search": "tailwind has been integrated into Concorde and is available in scoped components (with Shadow DOM).\nTo use it, you need to import the following:\n",
11239
8504
  "files": {
11240
8505
  "docs/_getting-started/theming.md": {
11241
- "title": "Customization",
8506
+ "title": "Adding styles",
11242
8507
  "hashes": {
11243
- "customization-example": {
8508
+ "tailwind-functional-classes": {
11244
8509
  "count": 1,
11245
- "title": "Customization example",
8510
+ "title": "TAILWIND Functional Classes",
11246
8511
  "type": "paragraph"
11247
8512
  }
11248
8513
  }
@@ -11250,14 +8515,14 @@
11250
8515
  }
11251
8516
  },
11252
8517
  {
11253
- "search": " /* Forms */\n --sc-border-width: 0.2rem;\n --sc-form-height: 2em;\n --sc-input-bg: var(--sc-base);\n --sc-input-color: var(--sc-base-content);\n --sc-input-border-color: var(--sc-input-color);\n --sc-input-active-bg: var(--sc-primary);\n --sc-input-active-color: var(--sc-primary-content);\n --sc-input-active-border-color: var(--sc-primary);\n}\n \n\n",
8518
+ "search": "Then include the tailwind style in the static styles property of the component:\n",
11254
8519
  "files": {
11255
8520
  "docs/_getting-started/theming.md": {
11256
- "title": "Customization",
8521
+ "title": "Adding styles",
11257
8522
  "hashes": {
11258
- "customization-example": {
8523
+ "tailwind-functional-classes": {
11259
8524
  "count": 1,
11260
- "title": "Customization example",
8525
+ "title": "TAILWIND Functional Classes",
11261
8526
  "type": "paragraph"
11262
8527
  }
11263
8528
  }
@@ -11265,14 +8530,14 @@
11265
8530
  }
11266
8531
  },
11267
8532
  {
11268
- "search": " Palette generator: concordecolors\n",
8533
+ "search": "Finally, use it in the HTML within the render function:\n",
11269
8534
  "files": {
11270
8535
  "docs/_getting-started/theming.md": {
11271
- "title": "Customization",
8536
+ "title": "Adding styles",
11272
8537
  "hashes": {
11273
- "customization-example": {
8538
+ "tailwind-functional-classes": {
11274
8539
  "count": 1,
11275
- "title": "Customization example",
8540
+ "title": "TAILWIND Functional Classes",
11276
8541
  "type": "paragraph"
11277
8542
  }
11278
8543
  }
@@ -11280,14 +8545,14 @@
11280
8545
  }
11281
8546
  },
11282
8547
  {
11283
- "search": "Without these overrides, components keep Concorde’s per-component fallbacks. Built-in light/dark palettes apply only when you set theme="light", theme="dark", or theme="auto".\n",
8548
+ "search": "The colors from Concorde's theme are referenced in Tailwind's theme.\n",
11284
8549
  "files": {
11285
8550
  "docs/_getting-started/theming.md": {
11286
- "title": "Customization",
8551
+ "title": "Adding styles",
11287
8552
  "hashes": {
11288
- "customization-example": {
8553
+ "tailwind-functional-classes": {
11289
8554
  "count": 1,
11290
- "title": "Customization example",
8555
+ "title": "TAILWIND Functional Classes",
11291
8556
  "type": "paragraph"
11292
8557
  }
11293
8558
  }
@@ -11295,14 +8560,14 @@
11295
8560
  }
11296
8561
  },
11297
8562
  {
11298
- "search": "What we intentionally avoid: large public --sc-alert-* / --sc-badge-* APIs or ::part() styling hooks on most components. Prefer attributes (type, status, size, …) and the theme tokens above.\n",
8563
+ "search": "This operation is particularly useful when it comes to adding behavior to a simple existing element.\nIt may also become necessary to establish compatibility with a traditional JS library.\n",
11299
8564
  "files": {
11300
8565
  "docs/_getting-started/theming.md": {
11301
- "title": "Customization",
8566
+ "title": "Adding styles",
11302
8567
  "hashes": {
11303
- "customization-example": {
8568
+ "usefulness": {
11304
8569
  "count": 1,
11305
- "title": "Customization example",
8570
+ "title": "Usefulness",
11306
8571
  "type": "paragraph"
11307
8572
  }
11308
8573
  }
@@ -11310,14 +8575,14 @@
11310
8575
  }
11311
8576
  },
11312
8577
  {
11313
- "search": "These are the smallest set we recommend customizing. Everything else should stay internal to the theme or to components (--sc_* private variables, attributes like type, size, variant).\n",
8578
+ "search": "For example, with a text input:\n",
11314
8579
  "files": {
11315
8580
  "docs/_getting-started/theming.md": {
11316
- "title": "Customization",
8581
+ "title": "Adding styles",
11317
8582
  "hashes": {
11318
- "only-essential-css-variables-public-theme-api": {
8583
+ "usefulness": {
11319
8584
  "count": 1,
11320
- "title": "Only essential CSS variables (public theme API)",
8585
+ "title": "Usefulness",
11321
8586
  "type": "paragraph"
11322
8587
  }
11323
8588
  }
@@ -11325,14 +8590,14 @@
11325
8590
  }
11326
8591
  },
11327
8592
  {
11328
- "search": "Tokens without a -content suffix are fill / background colors.Tokens with -content are text and icons on top of the matching fill (solid buttons, badges, alerts, etc.).\n",
8593
+ "search": "If there is no shadow DOM (see the noShadowDom property of Subscriber):\n",
11329
8594
  "files": {
11330
8595
  "docs/_getting-started/theming.md": {
11331
- "title": "Customization",
8596
+ "title": "Adding styles",
11332
8597
  "hashes": {
11333
- "surfaces-and-foreground": {
8598
+ "consequences": {
11334
8599
  "count": 1,
11335
- "title": "Surfaces and foreground",
8600
+ "title": "Consequences",
11336
8601
  "type": "paragraph"
11337
8602
  }
11338
8603
  }
@@ -11340,14 +8605,14 @@
11340
8605
  }
11341
8606
  },
11342
8607
  {
11343
- "search": "Interactive controls expose a few extra theme-level tokens; prefer these over styling individual inputs from outside.\n",
8608
+ "search": "For example, the components queue, list, and fetch do not have a shadow DOM.\n",
11344
8609
  "files": {
11345
8610
  "docs/_getting-started/theming.md": {
11346
- "title": "Customization",
8611
+ "title": "Adding styles",
11347
8612
  "hashes": {
11348
- "forms-only-if-you-customize-inputs-globally": {
8613
+ "consequences": {
11349
8614
  "count": 1,
11350
- "title": "Forms (only if you customize inputs globally)",
8615
+ "title": "Consequences",
11351
8616
  "type": "paragraph"
11352
8617
  }
11353
8618
  }
@@ -11355,14 +8620,14 @@
11355
8620
  }
11356
8621
  },
11357
8622
  {
11358
- "search": "Set tailwind.config.js to match concorde style token in your custom component.\n",
8623
+ "search": "ℹ️ Note: Specifically in this case, it may be useful to set the display property to contents.\n",
11359
8624
  "files": {
11360
8625
  "docs/_getting-started/theming.md": {
11361
- "title": "Customization",
8626
+ "title": "Adding styles",
11362
8627
  "hashes": {
11363
- "tailwind-in-new-components-": {
8628
+ "consequences": {
11364
8629
  "count": 1,
11365
- "title": "Tailwind in new components ?",
8630
+ "title": "Consequences",
11366
8631
  "type": "paragraph"
11367
8632
  }
11368
8633
  }