@warp-ds/elements 2.10.0-next.1 → 2.10.0-next.3

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 (84) hide show
  1. package/dist/custom-elements.json +146 -69
  2. package/dist/docs/card/accessibility.md +74 -0
  3. package/dist/docs/card/api.md +9 -3
  4. package/dist/docs/card/card.md +234 -3
  5. package/dist/docs/card/examples.md +75 -0
  6. package/dist/docs/card/usage.md +76 -0
  7. package/dist/docs/combobox/accessibility.md +71 -0
  8. package/dist/docs/combobox/api.md +60 -30
  9. package/dist/docs/combobox/combobox.md +203 -30
  10. package/dist/docs/combobox/examples.md +44 -0
  11. package/dist/docs/combobox/usage.md +28 -0
  12. package/dist/docs/icon/accessibility.md +5 -0
  13. package/dist/docs/icon/api.md +37 -0
  14. package/dist/docs/icon/examples.md +45 -0
  15. package/dist/docs/icon/icon.md +107 -0
  16. package/dist/docs/icon/usage.md +11 -0
  17. package/dist/docs/link/api.md +18 -22
  18. package/dist/docs/link/examples.md +75 -0
  19. package/dist/docs/link/link.md +111 -22
  20. package/dist/docs/link/usage.md +18 -0
  21. package/dist/index.d.ts +479 -183
  22. package/dist/packages/affix/affix.js +3 -3
  23. package/dist/packages/affix/affix.js.map +4 -4
  24. package/dist/packages/alert/alert.js +1 -1
  25. package/dist/packages/alert/alert.js.map +3 -3
  26. package/dist/packages/attention/attention.js.map +4 -4
  27. package/dist/packages/attention/attention.test.js +1 -1
  28. package/dist/packages/breadcrumbs/breadcrumbs.js.map +1 -1
  29. package/dist/packages/button/button.js.map +3 -3
  30. package/dist/packages/card/card.d.ts +9 -6
  31. package/dist/packages/card/card.js.map +3 -3
  32. package/dist/packages/checkbox/checkbox.d.ts +40 -11
  33. package/dist/packages/checkbox/checkbox.js.map +2 -2
  34. package/dist/packages/checkbox/checkbox.test.js +1 -1
  35. package/dist/packages/checkbox-group/checkbox-group.a11y.test.js +1 -1
  36. package/dist/packages/checkbox-group/checkbox-group.d.ts +30 -5
  37. package/dist/packages/checkbox-group/checkbox-group.js.map +3 -3
  38. package/dist/packages/combobox/combobox.a11y.test.js +24 -0
  39. package/dist/packages/combobox/combobox.d.ts +65 -45
  40. package/dist/packages/combobox/combobox.hydration.test.js +39 -1
  41. package/dist/packages/combobox/combobox.js +13 -13
  42. package/dist/packages/combobox/combobox.js.map +4 -4
  43. package/dist/packages/combobox/combobox.stories.js +28 -15
  44. package/dist/packages/combobox/combobox.test.js +110 -0
  45. package/dist/packages/datepicker/DatePicker.test.js +1 -1
  46. package/dist/packages/datepicker/datepicker.js.map +4 -4
  47. package/dist/packages/datepicker/datepicker.test.js +1 -1
  48. package/dist/packages/expandable/expandable.js +2 -2
  49. package/dist/packages/expandable/expandable.js.map +3 -3
  50. package/dist/packages/icon/icon.d.ts +13 -3
  51. package/dist/packages/icon/icon.js +2 -2
  52. package/dist/packages/icon/icon.js.map +3 -3
  53. package/dist/packages/icon/icon.react.stories.d.ts +1 -1
  54. package/dist/packages/icon/react.d.ts +2 -2
  55. package/dist/packages/link/link.d.ts +15 -16
  56. package/dist/packages/link/link.js.map +2 -2
  57. package/dist/packages/link/link.test.js +1 -1
  58. package/dist/packages/modal-header/modal-header.js +3 -1
  59. package/dist/packages/modal-header/modal-header.js.map +4 -4
  60. package/dist/packages/page-indicator/page-indicator.js.map +1 -1
  61. package/dist/packages/pagination/pagination.js.map +4 -4
  62. package/dist/packages/pagination/pagination.test.js +1 -1
  63. package/dist/packages/pill/pill.js.map +4 -4
  64. package/dist/packages/radio/radio.test.js +1 -1
  65. package/dist/packages/radio-group/radio-group.a11y.test.js +1 -1
  66. package/dist/packages/radio-group/radio-group.js.map +1 -1
  67. package/dist/packages/select/select.js.map +4 -4
  68. package/dist/packages/slider/slider.js.map +1 -1
  69. package/dist/packages/slider/slider.test.js +1 -1
  70. package/dist/packages/slider-thumb/slider-thumb.js.map +1 -1
  71. package/dist/packages/step/step.js +1 -1
  72. package/dist/packages/step/step.js.map +4 -4
  73. package/dist/packages/switch/switch.a11y.test.js +1 -1
  74. package/dist/packages/tabs/tabs.a11y.test.js +1 -1
  75. package/dist/packages/tabs/tabs.test.js +1 -1
  76. package/dist/packages/textarea/textarea.js.map +1 -1
  77. package/dist/packages/textarea/textarea.test.js +1 -1
  78. package/dist/packages/textfield/textfield.test.js +1 -1
  79. package/dist/packages/toast/toast.js +3 -3
  80. package/dist/packages/toast/toast.js.map +4 -4
  81. package/dist/packages/toast/toast.stories.d.ts +1 -5
  82. package/dist/packages/toast/toast.stories.js +0 -17
  83. package/dist/web-types.json +147 -75
  84. package/package.json +2 -2
package/dist/custom-elements.json CHANGED
@@ -9,7 +9,7 @@
9
9
  {
10
10
  "kind": "class",
11
11
  "description": "",
12
- "name": "WIcon",
12
+ "name": "WarpIcon",
13
13
  "members": [
14
14
  {
15
15
  "kind": "field",
@@ -27,7 +27,8 @@
27
27
  "type": {
28
28
  "text": "'small' | 'medium' | 'large' | string"
29
29
  },
30
- "description": "Size: small, medium, large or pixel value (e.g. \"32px\")",
30
+ "description": "Size: small, medium, large or pixel value (e.g. \"32px\").",
31
+ "default": "\"medium\"",
31
32
  "attribute": "size",
32
33
  "reflects": true
33
34
  },
@@ -37,7 +38,7 @@
37
38
  "type": {
38
39
  "text": "string"
39
40
  },
40
- "description": "Locale used in CDN URL",
41
+ "description": "Locale used for `<title>` text.\n\nReads the `lang` attribute from `<html>`, falls back to 'en'.",
41
42
  "attribute": "locale",
42
43
  "reflects": true
43
44
  },
@@ -96,7 +97,8 @@
96
97
  "type": {
97
98
  "text": "'small' | 'medium' | 'large' | string"
98
99
  },
99
- "description": "Size: small, medium, large or pixel value (e.g. \"32px\")",
100
+ "description": "Size: small, medium, large or pixel value (e.g. \"32px\").",
101
+ "default": "\"medium\"",
100
102
  "fieldName": "size"
101
103
  },
102
104
  {
@@ -104,7 +106,7 @@
104
106
  "type": {
105
107
  "text": "string"
106
108
  },
107
- "description": "Locale used in CDN URL",
109
+ "description": "Locale used for `<title>` text.\n\nReads the `lang` attribute from `<html>`, falls back to 'en'.",
108
110
  "fieldName": "locale"
109
111
  }
110
112
  ],
@@ -116,9 +118,23 @@
116
118
  "customElement": true,
117
119
  "modulePath": "packages/icon/icon.ts",
118
120
  "definitionPath": "packages/icon/icon.ts"
121
+ },
122
+ {
123
+ "kind": "variable",
124
+ "name": "WIcon",
125
+ "default": "WarpIcon",
126
+ "deprecated": "Exported for backwards compatibility. Use WarpIcon."
119
127
  }
120
128
  ],
121
129
  "exports": [
130
+ {
131
+ "kind": "js",
132
+ "name": "WarpIcon",
133
+ "declaration": {
134
+ "name": "WarpIcon",
135
+ "module": "packages/icon/icon.ts"
136
+ }
137
+ },
122
138
  {
123
139
  "kind": "js",
124
140
  "name": "WIcon",
@@ -131,7 +147,7 @@
131
147
  "kind": "custom-element-definition",
132
148
  "name": "w-icon",
133
149
  "declaration": {
134
- "name": "WIcon",
150
+ "name": "WarpIcon",
135
151
  "module": "packages/icon/icon.ts"
136
152
  }
137
153
  }
@@ -942,15 +958,6 @@
942
958
  "description": "Buttons are used to perform actions, with different visuals for different needs.\n\n[See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/buttons-link--docs)",
943
959
  "name": "WarpLink",
944
960
  "members": [
945
- {
946
- "kind": "field",
947
- "name": "shadowRootOptions",
948
- "type": {
949
- "text": "object"
950
- },
951
- "static": true,
952
- "default": "{ ...LitElement.shadowRootOptions, delegatesFocus: true, }"
953
- },
954
961
  {
955
962
  "kind": "field",
956
963
  "name": "autofocus",
@@ -958,6 +965,7 @@
958
965
  "text": "boolean"
959
966
  },
960
967
  "default": "false",
968
+ "description": "Focus the link after it is rendered",
961
969
  "attribute": "autofocus",
962
970
  "reflects": true
963
971
  },
@@ -967,6 +975,7 @@
967
975
  "type": {
968
976
  "text": "ButtonVariant"
969
977
  },
978
+ "description": "Visual style for the link/button.",
970
979
  "attribute": "variant",
971
980
  "reflects": true,
972
981
  "parsedType": {
@@ -980,6 +989,7 @@
980
989
  "text": "boolean"
981
990
  },
982
991
  "default": "false",
992
+ "description": "Render a smaller version",
983
993
  "attribute": "small",
984
994
  "reflects": true
985
995
  },
@@ -989,6 +999,7 @@
989
999
  "type": {
990
1000
  "text": "string"
991
1001
  },
1002
+ "description": "The URL the link points to",
992
1003
  "attribute": "href",
993
1004
  "reflects": true
994
1005
  },
@@ -999,6 +1010,7 @@
999
1010
  "text": "boolean"
1000
1011
  },
1001
1012
  "default": "false",
1013
+ "description": "Applies disabled styling, but you need to disable clicks on your own.\n\nThe component renders an `<a>` element; `disabled` affects styling, but does not inherently prevent navigation. If you need to fully disable interaction, omit `href` and/or prevent default click behavior.",
1002
1014
  "attribute": "disabled",
1003
1015
  "reflects": true
1004
1016
  },
@@ -1008,6 +1020,7 @@
1008
1020
  "type": {
1009
1021
  "text": "string"
1010
1022
  },
1023
+ "description": "Where to display the linked URL (e.g. `_blank`)",
1011
1024
  "attribute": "target",
1012
1025
  "reflects": true
1013
1026
  },
@@ -1017,6 +1030,7 @@
1017
1030
  "type": {
1018
1031
  "text": "string"
1019
1032
  },
1033
+ "description": "Relationship of the linked URL.\n\nIf `target=\"_blank\"` and `rel` is not provided, the component uses `noopener`.",
1020
1034
  "attribute": "rel",
1021
1035
  "reflects": true
1022
1036
  },
@@ -1027,6 +1041,7 @@
1027
1041
  "text": "boolean"
1028
1042
  },
1029
1043
  "default": "false",
1044
+ "description": "Makes the link take up the full width of its parent",
1030
1045
  "attribute": "full-width",
1031
1046
  "reflects": true
1032
1047
  }
@@ -1038,6 +1053,7 @@
1038
1053
  "text": "boolean"
1039
1054
  },
1040
1055
  "default": "false",
1056
+ "description": "Focus the link after it is rendered",
1041
1057
  "fieldName": "autofocus"
1042
1058
  },
1043
1059
  {
@@ -1045,6 +1061,7 @@
1045
1061
  "type": {
1046
1062
  "text": "ButtonVariant"
1047
1063
  },
1064
+ "description": "Visual style for the link/button.",
1048
1065
  "fieldName": "variant",
1049
1066
  "parsedType": {
1050
1067
  "text": "'negative' | 'primary' | 'secondary' | 'negativeQuiet' | 'utility' | 'quiet' | 'utilityQuiet' | 'overlay' | 'overlayInverted' | 'overlayQuiet' | 'overlayInvertedQuiet'"
@@ -1056,6 +1073,7 @@
1056
1073
  "text": "boolean"
1057
1074
  },
1058
1075
  "default": "false",
1076
+ "description": "Render a smaller version",
1059
1077
  "fieldName": "small"
1060
1078
  },
1061
1079
  {
@@ -1063,6 +1081,7 @@
1063
1081
  "type": {
1064
1082
  "text": "string"
1065
1083
  },
1084
+ "description": "The URL the link points to",
1066
1085
  "fieldName": "href"
1067
1086
  },
1068
1087
  {
@@ -1071,6 +1090,7 @@
1071
1090
  "text": "boolean"
1072
1091
  },
1073
1092
  "default": "false",
1093
+ "description": "Applies disabled styling, but you need to disable clicks on your own.\n\nThe component renders an `<a>` element; `disabled` affects styling, but does not inherently prevent navigation. If you need to fully disable interaction, omit `href` and/or prevent default click behavior.",
1074
1094
  "fieldName": "disabled"
1075
1095
  },
1076
1096
  {
@@ -1078,6 +1098,7 @@
1078
1098
  "type": {
1079
1099
  "text": "string"
1080
1100
  },
1101
+ "description": "Where to display the linked URL (e.g. `_blank`)",
1081
1102
  "fieldName": "target"
1082
1103
  },
1083
1104
  {
@@ -1085,6 +1106,7 @@
1085
1106
  "type": {
1086
1107
  "text": "string"
1087
1108
  },
1109
+ "description": "Relationship of the linked URL.\n\nIf `target=\"_blank\"` and `rel` is not provided, the component uses `noopener`.",
1088
1110
  "fieldName": "rel"
1089
1111
  },
1090
1112
  {
@@ -1093,6 +1115,7 @@
1093
1115
  "text": "boolean"
1094
1116
  },
1095
1117
  "default": "false",
1118
+ "description": "Makes the link take up the full width of its parent",
1096
1119
  "fieldName": "fullWidth"
1097
1120
  }
1098
1121
  ],
@@ -2235,6 +2258,7 @@
2235
2258
  "text": "boolean"
2236
2259
  },
2237
2260
  "default": "false",
2261
+ "description": "Whether the card is visually selected.\n\nUse this when the card represents a selected item or choice. This only controls the visual selected state; update it from your application state when the selection changes.",
2238
2262
  "attribute": "selected",
2239
2263
  "reflects": true
2240
2264
  },
@@ -2245,6 +2269,7 @@
2245
2269
  "text": "boolean"
2246
2270
  },
2247
2271
  "default": "false",
2272
+ "description": "Whether the card uses the flat visual treatment.\n\nFlat cards use a bordered surface instead of the default elevated surface. Use this for denser layouts or when the card sits inside another surface.",
2248
2273
  "attribute": "flat"
2249
2274
  },
2250
2275
  {
@@ -2254,6 +2279,7 @@
2254
2279
  "text": "boolean"
2255
2280
  },
2256
2281
  "default": "false",
2282
+ "description": "Whether the whole card is interactive.\n\nWhen set, the card becomes keyboard focusable and Enter or Space triggers a click on the card. Use this only when the whole card has one action or represents one selectable choice.",
2257
2283
  "attribute": "clickable"
2258
2284
  },
2259
2285
  {
@@ -2283,6 +2309,7 @@
2283
2309
  "text": "boolean"
2284
2310
  },
2285
2311
  "default": "false",
2312
+ "description": "Whether the card is visually selected.\n\nUse this when the card represents a selected item or choice. This only controls the visual selected state; update it from your application state when the selection changes.",
2286
2313
  "fieldName": "selected"
2287
2314
  },
2288
2315
  {
@@ -2291,6 +2318,7 @@
2291
2318
  "text": "boolean"
2292
2319
  },
2293
2320
  "default": "false",
2321
+ "description": "Whether the card uses the flat visual treatment.\n\nFlat cards use a bordered surface instead of the default elevated surface. Use this for denser layouts or when the card sits inside another surface.",
2294
2322
  "fieldName": "flat"
2295
2323
  },
2296
2324
  {
@@ -2299,6 +2327,7 @@
2299
2327
  "text": "boolean"
2300
2328
  },
2301
2329
  "default": "false",
2330
+ "description": "Whether the whole card is interactive.\n\nWhen set, the card becomes keyboard focusable and Enter or Space triggers a click on the card. Use this only when the whole card has one action or represents one selectable choice.",
2302
2331
  "fieldName": "clickable"
2303
2332
  }
2304
2333
  ],
@@ -2359,7 +2388,7 @@
2359
2388
  {
2360
2389
  "kind": "field",
2361
2390
  "name": "name",
2362
- "description": "The name of the checkbox, submitted as a name/value pair with form data.",
2391
+ "description": "The name of the checkbox.\n\nWhen the checkbox is checked and belongs to a form, this name is submitted with the checkbox value. If the checkbox is inside a `w-checkbox-group` with a name, the group name is used when the checkbox does not have its own name.",
2363
2392
  "type": {
2364
2393
  "text": "string | undefined"
2365
2394
  },
@@ -2381,7 +2410,7 @@
2381
2410
  "text": "string | null"
2382
2411
  },
2383
2412
  "default": "null",
2384
- "description": "The value of the checkbox, submitted as a name/value pair with form data.",
2413
+ "description": "The value submitted when the checkbox is checked.\n\nIf no value attribute is set, the checkbox defaults to `on`. Unchecked and disabled checkboxes do not submit a value.",
2385
2414
  "attribute": "value",
2386
2415
  "reflects": true
2387
2416
  },
@@ -2392,7 +2421,7 @@
2392
2421
  "text": "boolean"
2393
2422
  },
2394
2423
  "default": "false",
2395
- "description": "Draws the checkbox in an indeterminate state.",
2424
+ "description": "Whether the checkbox is visually indeterminate.\n\nUse this for parent options that represent a mixed set of child selections. Clicking the checkbox clears the indeterminate state and sets the checkbox to checked.",
2396
2425
  "attribute": "indeterminate",
2397
2426
  "reflects": true
2398
2427
  },
@@ -2403,7 +2432,7 @@
2403
2432
  "text": "boolean"
2404
2433
  },
2405
2434
  "default": "false",
2406
- "description": "Draws the checkbox in a checked state (reflected to attribute).",
2435
+ "description": "Whether the checkbox is checked.\n\nChecked checkboxes submit their value with form data. The property is reflected to the `checked` attribute.",
2407
2436
  "attribute": "checked",
2408
2437
  "reflects": true
2409
2438
  },
@@ -2414,7 +2443,7 @@
2414
2443
  "text": "boolean"
2415
2444
  },
2416
2445
  "default": "false",
2417
- "description": "Disables the checkbox.",
2446
+ "description": "Whether the checkbox is disabled.\n\nDisabled checkboxes cannot be focused, changed, or submitted with form data.",
2418
2447
  "attribute": "disabled",
2419
2448
  "reflects": true
2420
2449
  },
@@ -2425,7 +2454,7 @@
2425
2454
  "text": "boolean"
2426
2455
  },
2427
2456
  "default": "false",
2428
- "description": "Makes the checkbox a required field.",
2457
+ "description": "Whether the checkbox must be checked before form submission.\n\nA required checkbox is invalid until it is checked. For requiring at least one option in a set, use `required` on `w-checkbox-group`.",
2429
2458
  "attribute": "required",
2430
2459
  "reflects": true
2431
2460
  },
@@ -2436,10 +2465,28 @@
2436
2465
  "text": "boolean"
2437
2466
  },
2438
2467
  "default": "false",
2439
- "description": "Draws the checkbox in an invalid state.",
2468
+ "description": "Whether the checkbox is visually invalid.\n\nUse this to show an externally managed validation error. Required validation also sets the invalid state after the user interacts with the checkbox or tries to submit the form.",
2440
2469
  "attribute": "invalid",
2441
2470
  "reflects": true
2442
2471
  },
2472
+ {
2473
+ "kind": "field",
2474
+ "name": "_groupInvalid",
2475
+ "type": {
2476
+ "text": "boolean | undefined"
2477
+ },
2478
+ "privacy": "private",
2479
+ "description": "Internal invalid state managed by parent checkbox-group.\nNon-reflecting to avoid DOM changes during hydration."
2480
+ },
2481
+ {
2482
+ "kind": "field",
2483
+ "name": "_groupName",
2484
+ "type": {
2485
+ "text": "string | undefined"
2486
+ },
2487
+ "privacy": "private",
2488
+ "description": "Internal name managed by parent checkbox-group.\nNon-reflecting to avoid DOM changes during hydration."
2489
+ },
2443
2490
  {
2444
2491
  "kind": "field",
2445
2492
  "name": "#defaultChecked",
@@ -2590,7 +2637,7 @@
2590
2637
  "attributes": [
2591
2638
  {
2592
2639
  "name": "name",
2593
- "description": "The name of the checkbox, submitted as a name/value pair with form data.",
2640
+ "description": "The name of the checkbox.\n\nWhen the checkbox is checked and belongs to a form, this name is submitted with the checkbox value. If the checkbox is inside a `w-checkbox-group` with a name, the group name is used when the checkbox does not have its own name.",
2594
2641
  "type": {
2595
2642
  "text": "string | undefined"
2596
2643
  },
@@ -2602,7 +2649,7 @@
2602
2649
  "text": "string | null"
2603
2650
  },
2604
2651
  "default": "null",
2605
- "description": "The value of the checkbox, submitted as a name/value pair with form data.",
2652
+ "description": "The value submitted when the checkbox is checked.\n\nIf no value attribute is set, the checkbox defaults to `on`. Unchecked and disabled checkboxes do not submit a value.",
2606
2653
  "fieldName": "value"
2607
2654
  },
2608
2655
  {
@@ -2611,7 +2658,7 @@
2611
2658
  "text": "boolean"
2612
2659
  },
2613
2660
  "default": "false",
2614
- "description": "Draws the checkbox in an indeterminate state.",
2661
+ "description": "Whether the checkbox is visually indeterminate.\n\nUse this for parent options that represent a mixed set of child selections. Clicking the checkbox clears the indeterminate state and sets the checkbox to checked.",
2615
2662
  "fieldName": "indeterminate"
2616
2663
  },
2617
2664
  {
@@ -2620,7 +2667,7 @@
2620
2667
  "text": "boolean"
2621
2668
  },
2622
2669
  "default": "false",
2623
- "description": "Draws the checkbox in a checked state (reflected to attribute).",
2670
+ "description": "Whether the checkbox is checked.\n\nChecked checkboxes submit their value with form data. The property is reflected to the `checked` attribute.",
2624
2671
  "fieldName": "checked"
2625
2672
  },
2626
2673
  {
@@ -2629,7 +2676,7 @@
2629
2676
  "text": "boolean"
2630
2677
  },
2631
2678
  "default": "false",
2632
- "description": "Disables the checkbox.",
2679
+ "description": "Whether the checkbox is disabled.\n\nDisabled checkboxes cannot be focused, changed, or submitted with form data.",
2633
2680
  "fieldName": "disabled"
2634
2681
  },
2635
2682
  {
@@ -2638,7 +2685,7 @@
2638
2685
  "text": "boolean"
2639
2686
  },
2640
2687
  "default": "false",
2641
- "description": "Makes the checkbox a required field.",
2688
+ "description": "Whether the checkbox must be checked before form submission.\n\nA required checkbox is invalid until it is checked. For requiring at least one option in a set, use `required` on `w-checkbox-group`.",
2642
2689
  "fieldName": "required"
2643
2690
  },
2644
2691
  {
@@ -2647,7 +2694,7 @@
2647
2694
  "text": "boolean"
2648
2695
  },
2649
2696
  "default": "false",
2650
- "description": "Draws the checkbox in an invalid state.",
2697
+ "description": "Whether the checkbox is visually invalid.\n\nUse this to show an externally managed validation error. Required validation also sets the invalid state after the user interacts with the checkbox or tries to submit the form.",
2651
2698
  "fieldName": "invalid"
2652
2699
  }
2653
2700
  ],
@@ -2661,6 +2708,10 @@
2661
2708
  "name": "LitElement",
2662
2709
  "package": "lit"
2663
2710
  },
2711
+ "parent": {
2712
+ "name": "w-checkbox-group",
2713
+ "description": ""
2714
+ },
2664
2715
  "tagName": "w-checkbox",
2665
2716
  "customElement": true,
2666
2717
  "modulePath": "packages/checkbox/checkbox.ts",
@@ -2710,7 +2761,7 @@
2710
2761
  "type": {
2711
2762
  "text": "string"
2712
2763
  },
2713
- "description": "The group label displayed above the checkboxes.",
2764
+ "description": "The group label displayed above the checkboxes.\n\nUse this to describe the shared question or topic for the checkbox options. The label is connected to the internal group for assistive technologies.",
2714
2765
  "attribute": "label",
2715
2766
  "reflects": true
2716
2767
  },
@@ -2720,7 +2771,7 @@
2720
2771
  "type": {
2721
2772
  "text": "string"
2722
2773
  },
2723
- "description": "The name applied to child checkboxes when they do not provide one.",
2774
+ "description": "The name applied to child checkboxes when they do not provide one.\n\nUse this when the grouped checkboxes should submit values under the same form field name. Individual checkboxes can still override the group name with their own `name`.",
2724
2775
  "attribute": "name",
2725
2776
  "reflects": true
2726
2777
  },
@@ -2731,7 +2782,7 @@
2731
2782
  "text": "boolean"
2732
2783
  },
2733
2784
  "default": "false",
2734
- "description": "Whether to show optional text next to the label.",
2785
+ "description": "Whether to show optional text next to the label.\n\nUse this to indicate that selecting an option from the group is not required.",
2735
2786
  "attribute": "optional",
2736
2787
  "reflects": true
2737
2788
  },
@@ -2741,6 +2792,7 @@
2741
2792
  "type": {
2742
2793
  "text": "string"
2743
2794
  },
2795
+ "description": "Help text displayed below the checkbox group.\n\nUse this for supporting guidance or validation feedback. When required validation fails, the group replaces this text with the localized required message.",
2744
2796
  "attribute": "help-text",
2745
2797
  "reflects": true
2746
2798
  },
@@ -2751,7 +2803,7 @@
2751
2803
  "text": "boolean"
2752
2804
  },
2753
2805
  "default": "false",
2754
- "description": "Makes the checkbox group required.",
2806
+ "description": "Whether at least one checkbox in the group must be selected.\n\nRequired validation is managed by the group. The individual checkboxes provide the submitted form values.",
2755
2807
  "attribute": "required",
2756
2808
  "reflects": true
2757
2809
  },
@@ -2762,7 +2814,7 @@
2762
2814
  "text": "boolean"
2763
2815
  },
2764
2816
  "default": "false",
2765
- "description": "Marks the checkbox group as invalid.",
2817
+ "description": "Whether the checkbox group is visually invalid.\n\nUse this to show an externally managed validation error for the group. The invalid state is also shared with child checkboxes for consistent styling and accessibility state.",
2766
2818
  "attribute": "invalid",
2767
2819
  "reflects": true
2768
2820
  },
@@ -3023,7 +3075,7 @@
3023
3075
  "type": {
3024
3076
  "text": "string"
3025
3077
  },
3026
- "description": "The group label displayed above the checkboxes.",
3078
+ "description": "The group label displayed above the checkboxes.\n\nUse this to describe the shared question or topic for the checkbox options. The label is connected to the internal group for assistive technologies.",
3027
3079
  "fieldName": "label"
3028
3080
  },
3029
3081
  {
@@ -3031,7 +3083,7 @@
3031
3083
  "type": {
3032
3084
  "text": "string"
3033
3085
  },
3034
- "description": "The name applied to child checkboxes when they do not provide one.",
3086
+ "description": "The name applied to child checkboxes when they do not provide one.\n\nUse this when the grouped checkboxes should submit values under the same form field name. Individual checkboxes can still override the group name with their own `name`.",
3035
3087
  "fieldName": "name"
3036
3088
  },
3037
3089
  {
@@ -3040,7 +3092,7 @@
3040
3092
  "text": "boolean"
3041
3093
  },
3042
3094
  "default": "false",
3043
- "description": "Whether to show optional text next to the label.",
3095
+ "description": "Whether to show optional text next to the label.\n\nUse this to indicate that selecting an option from the group is not required.",
3044
3096
  "fieldName": "optional"
3045
3097
  },
3046
3098
  {
@@ -3048,6 +3100,7 @@
3048
3100
  "type": {
3049
3101
  "text": "string"
3050
3102
  },
3103
+ "description": "Help text displayed below the checkbox group.\n\nUse this for supporting guidance or validation feedback. When required validation fails, the group replaces this text with the localized required message.",
3051
3104
  "fieldName": "helpText"
3052
3105
  },
3053
3106
  {
@@ -3056,7 +3109,7 @@
3056
3109
  "text": "boolean"
3057
3110
  },
3058
3111
  "default": "false",
3059
- "description": "Makes the checkbox group required.",
3112
+ "description": "Whether at least one checkbox in the group must be selected.\n\nRequired validation is managed by the group. The individual checkboxes provide the submitted form values.",
3060
3113
  "fieldName": "required"
3061
3114
  },
3062
3115
  {
@@ -3065,7 +3118,7 @@
3065
3118
  "text": "boolean"
3066
3119
  },
3067
3120
  "default": "false",
3068
- "description": "Marks the checkbox group as invalid.",
3121
+ "description": "Whether the checkbox group is visually invalid.\n\nUse this to show an externally managed validation error for the group. The invalid state is also shared with child checkboxes for consistent styling and accessibility state.",
3069
3122
  "fieldName": "invalid"
3070
3123
  }
3071
3124
  ],
@@ -3120,7 +3173,7 @@
3120
3173
  "text": "ComboboxOption[]"
3121
3174
  },
3122
3175
  "default": "[]",
3123
- "description": "The available options to select from",
3176
+ "description": "The available options to select from.\n\nUse this for framework usage, application state, or remote search results. When `options` contains entries, it is used instead of child `<option>` elements.",
3124
3177
  "attribute": "options"
3125
3178
  },
3126
3179
  {
@@ -3130,7 +3183,7 @@
3130
3183
  "text": "string | undefined"
3131
3184
  },
3132
3185
  "default": "''",
3133
- "description": "Label above input",
3186
+ "description": "The label displayed above the input.\n\nUse this to give the combobox a visible and accessible name.",
3134
3187
  "attribute": "label",
3135
3188
  "reflects": true
3136
3189
  },
@@ -3141,7 +3194,7 @@
3141
3194
  "text": "string | undefined"
3142
3195
  },
3143
3196
  "default": "''",
3144
- "description": "Input placeholder",
3197
+ "description": "Placeholder text displayed when the input is empty.\n\nUse this as a short hint for the expected input. Do not use placeholder text as a replacement for a label.",
3145
3198
  "attribute": "placeholder",
3146
3199
  "reflects": true
3147
3200
  },
@@ -3152,7 +3205,7 @@
3152
3205
  "text": "string"
3153
3206
  },
3154
3207
  "default": "''",
3155
- "description": "The input value",
3208
+ "description": "The selected or typed value.\n\nWhen an option is selected, this is set to the option value. The displayed text may differ when the option has a separate label.",
3156
3209
  "attribute": "value",
3157
3210
  "reflects": true
3158
3211
  },
@@ -3163,7 +3216,7 @@
3163
3216
  "text": "boolean"
3164
3217
  },
3165
3218
  "default": "false",
3166
- "description": "Whether the popover opens when focus is on the text field",
3219
+ "description": "Whether the option list opens when the input receives focus.\n\nUse this when users should see available options before they start typing.",
3167
3220
  "attribute": "open-on-focus",
3168
3221
  "reflects": true
3169
3222
  },
@@ -3174,7 +3227,7 @@
3174
3227
  "text": "boolean"
3175
3228
  },
3176
3229
  "default": "true",
3177
- "description": "Select active option on blur",
3230
+ "description": "Whether the active option is selected when the input loses focus.\n\nWhen enabled, the combobox selects the keyboard-highlighted option, or an option whose value exactly matches the current input value, on blur.",
3178
3231
  "attribute": "select-on-blur",
3179
3232
  "reflects": true
3180
3233
  },
@@ -3185,7 +3238,7 @@
3185
3238
  "text": "boolean"
3186
3239
  },
3187
3240
  "default": "false",
3188
- "description": "Whether the matching text segments in the options should be highlighted",
3241
+ "description": "Whether matching text segments in options are highlighted.\n\nUse this to visually emphasize the part of each option that matches the current input value.",
3189
3242
  "attribute": "match-text-segments",
3190
3243
  "reflects": true
3191
3244
  },
@@ -3196,7 +3249,7 @@
3196
3249
  "text": "boolean"
3197
3250
  },
3198
3251
  "default": "false",
3199
- "description": "Disable client-side static filtering",
3252
+ "description": "Whether built-in client-side filtering is disabled.\n\nUse this for remote search or externally filtered results. When disabled, all entries in `options` are rendered as provided.",
3200
3253
  "attribute": "disable-static-filtering",
3201
3254
  "reflects": true
3202
3255
  },
@@ -3207,7 +3260,7 @@
3207
3260
  "text": "boolean"
3208
3261
  },
3209
3262
  "default": "false",
3210
- "description": "Renders the input field in an invalid state",
3263
+ "description": "Whether the combobox is visually invalid.\n\nUse this to show an externally managed validation error. Pair it with `help-text` to explain how to fix the error.",
3211
3264
  "attribute": "invalid",
3212
3265
  "reflects": true
3213
3266
  },
@@ -3218,7 +3271,7 @@
3218
3271
  "text": "string | undefined"
3219
3272
  },
3220
3273
  "default": "''",
3221
- "description": "The content to display as the help text",
3274
+ "description": "Help text displayed below the input.\n\nUse this for supporting guidance or validation feedback.",
3222
3275
  "attribute": "help-text",
3223
3276
  "reflects": true
3224
3277
  },
@@ -3229,7 +3282,7 @@
3229
3282
  "text": "boolean"
3230
3283
  },
3231
3284
  "default": "false",
3232
- "description": "Whether the element is disabled",
3285
+ "description": "Whether the combobox is disabled.\n\nDisabled comboboxes cannot be focused, changed, or submitted with form data.",
3233
3286
  "attribute": "disabled",
3234
3287
  "reflects": true
3235
3288
  },
@@ -3240,7 +3293,7 @@
3240
3293
  "text": "boolean"
3241
3294
  },
3242
3295
  "default": "false",
3243
- "description": "Whether the element is required",
3296
+ "description": "Whether the combobox is required before form submission.\n\nUse this when the user must provide a value before submitting the form.",
3244
3297
  "attribute": "required",
3245
3298
  "reflects": true
3246
3299
  },
@@ -3251,7 +3304,7 @@
3251
3304
  "text": "boolean"
3252
3305
  },
3253
3306
  "default": "false",
3254
- "description": "Whether to show optional text",
3307
+ "description": "Whether to show optional text next to the label.\n\nUse this to indicate that the combobox is not required.",
3255
3308
  "attribute": "optional",
3256
3309
  "reflects": true
3257
3310
  },
@@ -3262,7 +3315,7 @@
3262
3315
  "text": "string | undefined"
3263
3316
  },
3264
3317
  "default": "''",
3265
- "description": "Name attribute for form submission",
3318
+ "description": "The name submitted with the combobox value.\n\nUse this when the combobox belongs to a form and its value should be included in form data.",
3266
3319
  "attribute": "name",
3267
3320
  "reflects": true
3268
3321
  },
@@ -3273,7 +3326,7 @@
3273
3326
  "text": "string | undefined"
3274
3327
  },
3275
3328
  "default": "'off'",
3276
- "description": "Autocomplete attribute for the input field",
3329
+ "description": "The autocomplete attribute passed to the internal input.\n\nDefaults to `off`. Set this when browser autocomplete should be enabled or scoped to a specific autocomplete token.",
3277
3330
  "attribute": "autocomplete",
3278
3331
  "reflects": true
3279
3332
  },
@@ -3286,6 +3339,14 @@
3286
3339
  },
3287
3340
  "default": "null"
3288
3341
  },
3342
+ {
3343
+ "kind": "field",
3344
+ "name": "#lightDomObserver",
3345
+ "privacy": "private",
3346
+ "type": {
3347
+ "text": "MutationObserver | undefined"
3348
+ }
3349
+ },
3289
3350
  {
3290
3351
  "kind": "method",
3291
3352
  "name": "resetFormControl",
@@ -3316,6 +3377,12 @@
3316
3377
  "privacy": "private",
3317
3378
  "readonly": true
3318
3379
  },
3380
+ {
3381
+ "kind": "field",
3382
+ "name": "_sourceOptions",
3383
+ "privacy": "private",
3384
+ "readonly": true
3385
+ },
3319
3386
  {
3320
3387
  "kind": "field",
3321
3388
  "name": "_navigationLabelOrDisplayValue",
@@ -3355,6 +3422,16 @@
3355
3422
  ],
3356
3423
  "description": "Generate options with unique IDs and match information"
3357
3424
  },
3425
+ {
3426
+ "kind": "method",
3427
+ "name": "#getOptionNodes",
3428
+ "privacy": "private"
3429
+ },
3430
+ {
3431
+ "kind": "method",
3432
+ "name": "#syncOptionsFromLightDom",
3433
+ "privacy": "private"
3434
+ },
3358
3435
  {
3359
3436
  "kind": "method",
3360
3437
  "name": "_getAriaText",
@@ -3533,7 +3610,7 @@
3533
3610
  "text": "ComboboxOption[]"
3534
3611
  },
3535
3612
  "default": "[]",
3536
- "description": "The available options to select from",
3613
+ "description": "The available options to select from.\n\nUse this for framework usage, application state, or remote search results. When `options` contains entries, it is used instead of child `<option>` elements.",
3537
3614
  "fieldName": "options"
3538
3615
  },
3539
3616
  {
@@ -3542,7 +3619,7 @@
3542
3619
  "text": "string | undefined"
3543
3620
  },
3544
3621
  "default": "''",
3545
- "description": "Label above input",
3622
+ "description": "The label displayed above the input.\n\nUse this to give the combobox a visible and accessible name.",
3546
3623
  "fieldName": "label"
3547
3624
  },
3548
3625
  {
@@ -3551,7 +3628,7 @@
3551
3628
  "text": "string | undefined"
3552
3629
  },
3553
3630
  "default": "''",
3554
- "description": "Input placeholder",
3631
+ "description": "Placeholder text displayed when the input is empty.\n\nUse this as a short hint for the expected input. Do not use placeholder text as a replacement for a label.",
3555
3632
  "fieldName": "placeholder"
3556
3633
  },
3557
3634
  {
@@ -3560,7 +3637,7 @@
3560
3637
  "text": "string"
3561
3638
  },
3562
3639
  "default": "''",
3563
- "description": "The input value",
3640
+ "description": "The selected or typed value.\n\nWhen an option is selected, this is set to the option value. The displayed text may differ when the option has a separate label.",
3564
3641
  "fieldName": "value"
3565
3642
  },
3566
3643
  {
@@ -3569,7 +3646,7 @@
3569
3646
  "text": "boolean"
3570
3647
  },
3571
3648
  "default": "false",
3572
- "description": "Whether the popover opens when focus is on the text field",
3649
+ "description": "Whether the option list opens when the input receives focus.\n\nUse this when users should see available options before they start typing.",
3573
3650
  "fieldName": "openOnFocus"
3574
3651
  },
3575
3652
  {
@@ -3578,7 +3655,7 @@
3578
3655
  "text": "boolean"
3579
3656
  },
3580
3657
  "default": "true",
3581
- "description": "Select active option on blur",
3658
+ "description": "Whether the active option is selected when the input loses focus.\n\nWhen enabled, the combobox selects the keyboard-highlighted option, or an option whose value exactly matches the current input value, on blur.",
3582
3659
  "fieldName": "selectOnBlur"
3583
3660
  },
3584
3661
  {
@@ -3587,7 +3664,7 @@
3587
3664
  "text": "boolean"
3588
3665
  },
3589
3666
  "default": "false",
3590
- "description": "Whether the matching text segments in the options should be highlighted",
3667
+ "description": "Whether matching text segments in options are highlighted.\n\nUse this to visually emphasize the part of each option that matches the current input value.",
3591
3668
  "fieldName": "matchTextSegments"
3592
3669
  },
3593
3670
  {
@@ -3596,7 +3673,7 @@
3596
3673
  "text": "boolean"
3597
3674
  },
3598
3675
  "default": "false",
3599
- "description": "Disable client-side static filtering",
3676
+ "description": "Whether built-in client-side filtering is disabled.\n\nUse this for remote search or externally filtered results. When disabled, all entries in `options` are rendered as provided.",
3600
3677
  "fieldName": "disableStaticFiltering"
3601
3678
  },
3602
3679
  {
@@ -3605,7 +3682,7 @@
3605
3682
  "text": "boolean"
3606
3683
  },
3607
3684
  "default": "false",
3608
- "description": "Renders the input field in an invalid state",
3685
+ "description": "Whether the combobox is visually invalid.\n\nUse this to show an externally managed validation error. Pair it with `help-text` to explain how to fix the error.",
3609
3686
  "fieldName": "invalid"
3610
3687
  },
3611
3688
  {
@@ -3614,7 +3691,7 @@
3614
3691
  "text": "string | undefined"
3615
3692
  },
3616
3693
  "default": "''",
3617
- "description": "The content to display as the help text",
3694
+ "description": "Help text displayed below the input.\n\nUse this for supporting guidance or validation feedback.",
3618
3695
  "fieldName": "helpText"
3619
3696
  },
3620
3697
  {
@@ -3623,7 +3700,7 @@
3623
3700
  "text": "boolean"
3624
3701
  },
3625
3702
  "default": "false",
3626
- "description": "Whether the element is disabled",
3703
+ "description": "Whether the combobox is disabled.\n\nDisabled comboboxes cannot be focused, changed, or submitted with form data.",
3627
3704
  "fieldName": "disabled"
3628
3705
  },
3629
3706
  {
@@ -3632,7 +3709,7 @@
3632
3709
  "text": "boolean"
3633
3710
  },
3634
3711
  "default": "false",
3635
- "description": "Whether the element is required",
3712
+ "description": "Whether the combobox is required before form submission.\n\nUse this when the user must provide a value before submitting the form.",
3636
3713
  "fieldName": "required"
3637
3714
  },
3638
3715
  {
@@ -3641,7 +3718,7 @@
3641
3718
  "text": "boolean"
3642
3719
  },
3643
3720
  "default": "false",
3644
- "description": "Whether to show optional text",
3721
+ "description": "Whether to show optional text next to the label.\n\nUse this to indicate that the combobox is not required.",
3645
3722
  "fieldName": "optional"
3646
3723
  },
3647
3724
  {
@@ -3650,7 +3727,7 @@
3650
3727
  "text": "string | undefined"
3651
3728
  },
3652
3729
  "default": "''",
3653
- "description": "Name attribute for form submission",
3730
+ "description": "The name submitted with the combobox value.\n\nUse this when the combobox belongs to a form and its value should be included in form data.",
3654
3731
  "fieldName": "name"
3655
3732
  },
3656
3733
  {
@@ -3659,7 +3736,7 @@
3659
3736
  "text": "string | undefined"
3660
3737
  },
3661
3738
  "default": "'off'",
3662
- "description": "Autocomplete attribute for the input field",
3739
+ "description": "The autocomplete attribute passed to the internal input.\n\nDefaults to `off`. Set this when browser autocomplete should be enabled or scoped to a specific autocomplete token.",
3663
3740
  "fieldName": "autocomplete"
3664
3741
  }
3665
3742
  ],