@arbor-education/design-system.components 3.4.5 → 4.0.0-react19-alpha.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 (82) hide show
  1. package/.changeset/empty-clocks-jog.md +5 -0
  2. package/dist/components/combobox/ComboboxButtonTrigger.d.ts +1 -1
  3. package/dist/components/combobox/ComboboxButtonTrigger.d.ts.map +1 -1
  4. package/dist/components/combobox/ComboboxListbox.d.ts +2 -2
  5. package/dist/components/combobox/ComboboxListbox.d.ts.map +1 -1
  6. package/dist/components/combobox/ComboboxTrigger.d.ts +2 -2
  7. package/dist/components/combobox/ComboboxTrigger.d.ts.map +1 -1
  8. package/dist/components/combobox/useComboboxListboxDom.d.ts +1 -1
  9. package/dist/components/combobox/useComboboxListboxDom.d.ts.map +1 -1
  10. package/dist/components/combobox/useElementWidth.d.ts +2 -0
  11. package/dist/components/combobox/useElementWidth.d.ts.map +1 -0
  12. package/dist/components/combobox/useElementWidth.js +31 -0
  13. package/dist/components/combobox/useElementWidth.js.map +1 -0
  14. package/dist/components/combobox/useVisibleChips.d.ts +21 -0
  15. package/dist/components/combobox/useVisibleChips.d.ts.map +1 -0
  16. package/dist/components/combobox/useVisibleChips.js +59 -0
  17. package/dist/components/combobox/useVisibleChips.js.map +1 -0
  18. package/dist/components/combobox/useVisibleChips.test.d.ts +2 -0
  19. package/dist/components/combobox/useVisibleChips.test.d.ts.map +1 -0
  20. package/dist/components/combobox/useVisibleChips.test.js +81 -0
  21. package/dist/components/combobox/useVisibleChips.test.js.map +1 -0
  22. package/dist/components/heading/Heading.d.ts +28 -14
  23. package/dist/components/heading/Heading.d.ts.map +1 -1
  24. package/dist/components/heading/Heading.stories.d.ts +28 -14
  25. package/dist/components/heading/Heading.stories.d.ts.map +1 -1
  26. package/dist/components/icoText/IcoText.d.ts +37 -0
  27. package/dist/components/icoText/IcoText.d.ts.map +1 -0
  28. package/dist/components/icoText/IcoText.js +29 -0
  29. package/dist/components/icoText/IcoText.js.map +1 -0
  30. package/dist/components/icoText/IcoText.stories.d.ts +60 -0
  31. package/dist/components/icoText/IcoText.stories.d.ts.map +1 -0
  32. package/dist/components/icoText/IcoText.stories.js +319 -0
  33. package/dist/components/icoText/IcoText.stories.js.map +1 -0
  34. package/dist/components/icoText/IcoText.test.d.ts +2 -0
  35. package/dist/components/icoText/IcoText.test.d.ts.map +1 -0
  36. package/dist/components/icoText/IcoText.test.js +27 -0
  37. package/dist/components/icoText/IcoText.test.js.map +1 -0
  38. package/dist/components/table/Table.test.js +18 -14
  39. package/dist/components/table/Table.test.js.map +1 -1
  40. package/dist/components/tabs/TabsItem.stories.d.ts +50 -22
  41. package/dist/components/tabs/TabsItem.stories.d.ts.map +1 -1
  42. package/dist/components/tagList/useTagListCollapsedLayout.d.ts +3 -3
  43. package/dist/components/tagList/useTagListCollapsedLayout.d.ts.map +1 -1
  44. package/dist/components/tree-row/TreeRow.d.ts +32 -0
  45. package/dist/components/tree-row/TreeRow.d.ts.map +1 -0
  46. package/dist/components/tree-row/TreeRow.js +19 -0
  47. package/dist/components/tree-row/TreeRow.js.map +1 -0
  48. package/dist/components/tree-row/TreeRow.stories.d.ts +13 -0
  49. package/dist/components/tree-row/TreeRow.stories.d.ts.map +1 -0
  50. package/dist/components/tree-row/TreeRow.stories.js +774 -0
  51. package/dist/components/tree-row/TreeRow.stories.js.map +1 -0
  52. package/dist/components/tree-row/TreeRow.test.d.ts +2 -0
  53. package/dist/components/tree-row/TreeRow.test.d.ts.map +1 -0
  54. package/dist/components/tree-row/TreeRow.test.js +262 -0
  55. package/dist/components/tree-row/TreeRow.test.js.map +1 -0
  56. package/dist/components/tree-row/TreeRowSection.d.ts +12 -0
  57. package/dist/components/tree-row/TreeRowSection.d.ts.map +1 -0
  58. package/dist/components/tree-row/TreeRowSection.js +20 -0
  59. package/dist/components/tree-row/TreeRowSection.js.map +1 -0
  60. package/dist/utils/PopupParentContext.d.ts +3 -0
  61. package/dist/utils/PopupParentContext.d.ts.map +1 -0
  62. package/dist/utils/PopupParentContext.js +6 -0
  63. package/dist/utils/PopupParentContext.js.map +1 -0
  64. package/dist/utils/PopupParentContext.stories.d.ts +17 -0
  65. package/dist/utils/PopupParentContext.stories.d.ts.map +1 -0
  66. package/dist/utils/PopupParentContext.stories.js +266 -0
  67. package/dist/utils/PopupParentContext.stories.js.map +1 -0
  68. package/dist/utils/getDefaultPopupParent.d.ts +2 -0
  69. package/dist/utils/getDefaultPopupParent.d.ts.map +1 -0
  70. package/dist/utils/getDefaultPopupParent.js +19 -0
  71. package/dist/utils/getDefaultPopupParent.js.map +1 -0
  72. package/dist/utils/hooks/useIsMounted.d.ts +1 -1
  73. package/dist/utils/hooks/useIsMounted.d.ts.map +1 -1
  74. package/package.json +19 -5
  75. package/src/components/arborLogo/__snapshots__/ArborLogo.test.tsx.snap +18 -18
  76. package/src/components/combobox/ComboboxButtonTrigger.tsx +1 -1
  77. package/src/components/combobox/ComboboxListbox.tsx +2 -2
  78. package/src/components/combobox/ComboboxTrigger.tsx +2 -2
  79. package/src/components/combobox/useComboboxListboxDom.ts +1 -1
  80. package/src/components/table/Table.test.tsx +18 -14
  81. package/src/components/tagList/useTagListCollapsedLayout.ts +3 -3
  82. package/src/docs/UsingComponents.mdx +6 -0
@@ -0,0 +1,5 @@
1
+ ---
2
+ "@arbor-education/design-system.components": major
3
+ ---
4
+
5
+ MIS-71331 Upgrade to React 19 and move `react` and `react-dom` to `peerDependencies` (`^18.0.0 || ^19.0.0`). Consumers must now provide React themselves, and may run either React 18 or 19; 19 is preferred. `@types/react` and `@types/react-dom` are no longer installed as dependencies; they are declared as optional peer dependencies for TypeScript consumers.
@@ -1,6 +1,6 @@
1
1
  import type { ComboboxAriaInvalid, ComboboxOption, ComboboxSelectedValueDisplay } from './types.js';
2
2
  export type ComboboxButtonTriggerProps = {
3
- triggerRef: React.RefObject<HTMLDivElement>;
3
+ triggerRef: React.RefObject<HTMLDivElement | null>;
4
4
  listboxId: string;
5
5
  isOpen: boolean;
6
6
  hasError: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboboxButtonTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxButtonTrigger.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAE,4BAA4B,EAAE,MAAM,YAAY,CAAC;AAGpG,MAAM,MAAM,0BAA0B,GAAG;IACvC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC5C,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,4BAA4B,CAAC;IACnD,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,oBAAoB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAClC,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,MAAM,CAAC;IACjD,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACvE,kBAAkB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAClD,uBAAuB,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC,CAAC;AAEF,eAAO,MAAM,qBAAqB;oXAuB/B,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CA+JhD,CAAC"}
1
+ {"version":3,"file":"ComboboxButtonTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxButtonTrigger.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAE,4BAA4B,EAAE,MAAM,YAAY,CAAC;AAGpG,MAAM,MAAM,0BAA0B,GAAG;IACvC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACnD,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,4BAA4B,CAAC;IACnD,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC,YAAY,EAAE,cAAc,EAAE,CAAC;IAC/B,oBAAoB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAClC,eAAe,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,MAAM,CAAC;IACjD,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACvE,kBAAkB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAClD,uBAAuB,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC,CAAC;AAEF,eAAO,MAAM,qBAAqB;oXAuB/B,0BAA0B,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CA+JhD,CAAC"}
@@ -1,6 +1,6 @@
1
1
  import type { ComboboxAriaInvalid, ComboboxOption, ComboboxSearchType } from './types.js';
2
2
  export type ComboboxListboxProps = {
3
- listboxRef: React.RefObject<HTMLUListElement>;
3
+ listboxRef: React.RefObject<HTMLUListElement | null>;
4
4
  listboxId: string;
5
5
  multiple: boolean;
6
6
  ariaLabel: string | undefined;
@@ -23,7 +23,7 @@ export type ComboboxListboxProps = {
23
23
  filteredOptionsLength: number;
24
24
  preventMouseDefault: (e: React.MouseEvent) => void;
25
25
  renderSearchInputInListbox: boolean;
26
- inputRef: React.RefObject<HTMLInputElement>;
26
+ inputRef: React.RefObject<HTMLInputElement | null>;
27
27
  comboboxId: string;
28
28
  shouldShowPopover: boolean;
29
29
  activeDescendant: string | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboboxListbox.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxListbox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAE1F,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC9C,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,cAAc,EAAE,CAAC,CAAC;IAC5C,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,kBAAkB,CAAC;IAC/B,sBAAsB,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9E,iBAAiB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC/B,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC9B,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,OAAO,CAAC;IACvB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,mBAAmB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACnD,0BAA0B,EAAE,OAAO,CAAC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,WAAW,EAAE,MAAM,CAAC;IACpB,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpE,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACjE,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAClE,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9E,yBAAyB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/F,CAAC;AAEF,eAAO,MAAM,eAAe;YAAW,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CAyL9E,CAAC"}
1
+ {"version":3,"file":"ComboboxListbox.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxListbox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAE1F,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACrD,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,kBAAkB,EAAE,OAAO,CAAC;IAC5B,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,cAAc,EAAE,CAAC,CAAC;IAC5C,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,kBAAkB,CAAC;IAC/B,sBAAsB,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9E,iBAAiB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC/B,gBAAgB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC9B,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,mBAAmB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,OAAO,CAAC;IACvB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,mBAAmB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACnD,0BAA0B,EAAE,OAAO,CAAC;IACpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IACrC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAClC,WAAW,EAAE,MAAM,CAAC;IACpB,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpE,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACjE,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAClE,oBAAoB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9E,yBAAyB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/F,CAAC;AAEF,eAAO,MAAM,eAAe;YAAW,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CAyL9E,CAAC"}
@@ -1,7 +1,7 @@
1
1
  import type { ComboboxAriaInvalid, ComboboxOption, ComboboxSelectedValueDisplay } from './types.js';
2
2
  export type ComboboxTriggerProps = {
3
- 'inputRef': React.RefObject<HTMLInputElement>;
4
- 'triggerRef': React.RefObject<HTMLDivElement>;
3
+ 'inputRef': React.RefObject<HTMLInputElement | null>;
4
+ 'triggerRef': React.RefObject<HTMLDivElement | null>;
5
5
  'comboboxId': string;
6
6
  'listboxId': string;
7
7
  'isOpen': boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboboxTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxTrigger.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAE,4BAA4B,EAAE,MAAM,YAAY,CAAC;AAEpG,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC9C,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IACvC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB,EAAE,OAAO,CAAC;IAC/B,sBAAsB,EAAE,4BAA4B,CAAC;IACrD,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC,eAAe,EAAE,cAAc,EAAE,CAAC;IAClC,uBAAuB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,iBAAiB,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,MAAM,CAAC;IACnD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,mBAAmB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtE,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnE,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpE,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACrD,CAAC;AAEF,eAAO,MAAM,eAAe;YAAW,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CAwH9E,CAAC"}
1
+ {"version":3,"file":"ComboboxTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/ComboboxTrigger.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,cAAc,EAAE,4BAA4B,EAAE,MAAM,YAAY,CAAC;AAEpG,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACrD,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACrD,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IACvC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB,EAAE,OAAO,CAAC;IAC/B,sBAAsB,EAAE,4BAA4B,CAAC;IACrD,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC,eAAe,EAAE,cAAc,EAAE,CAAC;IAClC,uBAAuB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,iBAAiB,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,MAAM,CAAC;IACnD,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,mBAAmB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtE,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnE,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpE,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACrD,CAAC;AAEF,eAAO,MAAM,eAAe;YAAW,oBAAoB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;CAwH9E,CAAC"}
@@ -2,7 +2,7 @@ type UseComboboxListboxDomParams = {
2
2
  comboboxId: string;
3
3
  };
4
4
  export type UseComboboxListboxDomReturn = {
5
- listboxRef: React.RefObject<HTMLUListElement>;
5
+ listboxRef: React.RefObject<HTMLUListElement | null>;
6
6
  getOptionId: (index: number) => string;
7
7
  scrollHighlightedIntoView: (index: number) => void;
8
8
  };
@@ -1 +1 @@
1
- {"version":3,"file":"useComboboxListboxDom.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/useComboboxListboxDom.ts"],"names":[],"mappings":"AAGA,KAAK,2BAA2B,GAAG;IACjC,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG;IACxC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC9C,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,yBAAyB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,iBAEnC,2BAA2B,KAAG,2BAoBhC,CAAC"}
1
+ {"version":3,"file":"useComboboxListboxDom.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/useComboboxListboxDom.ts"],"names":[],"mappings":"AAGA,KAAK,2BAA2B,GAAG;IACjC,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG;IACxC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACrD,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,yBAAyB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpD,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,iBAEnC,2BAA2B,KAAG,2BAoBhC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export declare const useElementWidth: (ref: React.RefObject<HTMLElement | null>, watchKey: string) => number;
2
+ //# sourceMappingURL=useElementWidth.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useElementWidth.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/useElementWidth.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,GAC1B,KAAK,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EACxC,UAAU,MAAM,KACf,MAkCF,CAAC"}
@@ -0,0 +1,31 @@
1
+ import { useCallback, useLayoutEffect, useState } from 'react';
2
+ export const useElementWidth = (ref, watchKey) => {
3
+ const [measurement, setMeasurement] = useState({ width: 0, hasMeasured: false });
4
+ const element = ref.current;
5
+ const update = useCallback(() => {
6
+ const currentElement = ref.current;
7
+ if (!currentElement) {
8
+ setMeasurement({ width: 0, hasMeasured: true });
9
+ return;
10
+ }
11
+ setMeasurement({
12
+ width: currentElement.getBoundingClientRect().width,
13
+ hasMeasured: true,
14
+ });
15
+ }, [ref]);
16
+ useLayoutEffect(() => {
17
+ // Re-run measurement when callers know the element's contents/layout inputs changed.
18
+ update();
19
+ }, [update, watchKey]);
20
+ useLayoutEffect(() => {
21
+ if (!element)
22
+ return;
23
+ const observer = new ResizeObserver(update);
24
+ observer.observe(element);
25
+ return () => {
26
+ observer.disconnect();
27
+ };
28
+ }, [element, update]);
29
+ return measurement.width;
30
+ };
31
+ //# sourceMappingURL=useElementWidth.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useElementWidth.js","sourceRoot":"","sources":["../../../src/components/combobox/useElementWidth.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE/D,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,GAAwC,EACxC,QAAgB,EACR,EAAE;IACV,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,CAAC;IACjF,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC;IAE5B,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9B,MAAM,cAAc,GAAG,GAAG,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,cAAc,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC;YAChD,OAAO;QACT,CAAC;QAED,cAAc,CAAC;YACb,KAAK,EAAE,cAAc,CAAC,qBAAqB,EAAE,CAAC,KAAK;YACnD,WAAW,EAAE,IAAI;SAClB,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,eAAe,CAAC,GAAG,EAAE;QACnB,qFAAqF;QACrF,MAAM,EAAE,CAAC;IACX,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEvB,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,MAAM,CAAC,CAAC;QAC5C,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAE1B,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;IAEtB,OAAO,WAAW,CAAC,KAAK,CAAC;AAC3B,CAAC,CAAC"}
@@ -0,0 +1,21 @@
1
+ type ComputeTriggerLayoutModelParams = {
2
+ containerWidth: number;
3
+ chipWidths: number[];
4
+ chipGap: number;
5
+ badgeWidth: number;
6
+ ellipsisWidth: number;
7
+ showBadge: boolean;
8
+ safetyBuffer?: number;
9
+ };
10
+ export type TriggerLayoutModel = {
11
+ visibleChipIndices: number[];
12
+ hiddenChipCount: number;
13
+ showBadge: boolean;
14
+ showEllipsis: boolean;
15
+ hasOverflow: boolean;
16
+ };
17
+ export declare const computeTriggerLayoutModel: ({ containerWidth, chipWidths, chipGap, badgeWidth, ellipsisWidth, showBadge, safetyBuffer, }: ComputeTriggerLayoutModelParams) => TriggerLayoutModel;
18
+ type UseVisibleChipsParams = ComputeTriggerLayoutModelParams;
19
+ export declare const useVisibleChips: (params: UseVisibleChipsParams) => TriggerLayoutModel;
20
+ export {};
21
+ //# sourceMappingURL=useVisibleChips.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useVisibleChips.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/useVisibleChips.ts"],"names":[],"mappings":"AAEA,KAAK,+BAA+B,GAAG;IACrC,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,eAAe,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,OAAO,CAAC;CACtB,CAAC;AAoBF,eAAO,MAAM,yBAAyB,GAAI,8FAQvC,+BAA+B,KAAG,kBAmCpC,CAAC;AAEF,KAAK,qBAAqB,GAAG,+BAA+B,CAAC;AAE7D,eAAO,MAAM,eAAe,GAAI,QAAQ,qBAAqB,KAAG,kBAc7D,CAAC"}
@@ -0,0 +1,59 @@
1
+ import { useMemo } from 'react';
2
+ const fitCount = (availableWidth, chipWidths, chipGap) => {
3
+ if (availableWidth <= 0 || chipWidths.length === 0)
4
+ return 0;
5
+ let used = 0;
6
+ let count = 0;
7
+ for (let i = 0; i < chipWidths.length; i += 1) {
8
+ const required = chipWidths[i] + (i > 0 ? chipGap : 0);
9
+ if (used + required > availableWidth)
10
+ break;
11
+ used += required;
12
+ count += 1;
13
+ }
14
+ return count;
15
+ };
16
+ export const computeTriggerLayoutModel = ({ containerWidth, chipWidths, chipGap, badgeWidth, ellipsisWidth, showBadge, safetyBuffer = 1, }) => {
17
+ const selectedCount = chipWidths.length;
18
+ const shouldShowBadge = showBadge && selectedCount > 0;
19
+ if (selectedCount === 0 || containerWidth <= 0) {
20
+ return {
21
+ visibleChipIndices: [],
22
+ hiddenChipCount: 0,
23
+ showBadge: shouldShowBadge,
24
+ showEllipsis: false,
25
+ hasOverflow: false,
26
+ };
27
+ }
28
+ const badgeReserve = shouldShowBadge
29
+ ? badgeWidth + chipGap
30
+ : 0;
31
+ const availableWithoutEllipsis = Math.max(0, containerWidth - badgeReserve - safetyBuffer);
32
+ const countWithoutEllipsis = fitCount(availableWithoutEllipsis, chipWidths, chipGap);
33
+ const hasOverflow = countWithoutEllipsis < selectedCount;
34
+ const ellipsisReserve = hasOverflow
35
+ ? ellipsisWidth + chipGap
36
+ : 0;
37
+ const availableForChips = Math.max(0, containerWidth - badgeReserve - ellipsisReserve - safetyBuffer);
38
+ const visibleCount = fitCount(availableForChips, chipWidths, chipGap);
39
+ return {
40
+ visibleChipIndices: Array.from({ length: visibleCount }, (_, index) => index),
41
+ hiddenChipCount: Math.max(0, selectedCount - visibleCount),
42
+ showBadge: shouldShowBadge,
43
+ showEllipsis: visibleCount < selectedCount,
44
+ hasOverflow: visibleCount < selectedCount,
45
+ };
46
+ };
47
+ export const useVisibleChips = (params) =>
48
+ // Deps list each field instead of `[params]`: callers often pass a new `params` object every
49
+ // render; depending on object identity would rerun the layout every time even when values are unchanged.
50
+ useMemo(() => computeTriggerLayoutModel(params), [
51
+ params.badgeWidth,
52
+ params.chipGap,
53
+ params.chipWidths,
54
+ params.containerWidth,
55
+ params.ellipsisWidth,
56
+ params.safetyBuffer,
57
+ params.showBadge,
58
+ ]);
59
+ //# sourceMappingURL=useVisibleChips.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useVisibleChips.js","sourceRoot":"","sources":["../../../src/components/combobox/useVisibleChips.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=useVisibleChips.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useVisibleChips.test.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/useVisibleChips.test.tsx"],"names":[],"mappings":""}
@@ -0,0 +1,81 @@
1
+ import { describe, expect, test } from 'vitest';
2
+ import { computeTriggerLayoutModel } from './useVisibleChips.js';
3
+ describe('computeTriggerLayoutModel', () => {
4
+ test('shows all chips and no ellipsis when there is no overflow', () => {
5
+ const result = computeTriggerLayoutModel({
6
+ containerWidth: 300,
7
+ chipWidths: [70, 80, 60],
8
+ chipGap: 4,
9
+ badgeWidth: 24,
10
+ ellipsisWidth: 12,
11
+ showBadge: true,
12
+ });
13
+ expect(result).toEqual({
14
+ visibleChipIndices: [0, 1, 2],
15
+ hiddenChipCount: 0,
16
+ showBadge: true,
17
+ showEllipsis: false,
18
+ hasOverflow: false,
19
+ });
20
+ });
21
+ test('reserves badge and ellipsis before fitting chips when overflow exists', () => {
22
+ const result = computeTriggerLayoutModel({
23
+ containerWidth: 160,
24
+ chipWidths: [60, 60, 60],
25
+ chipGap: 4,
26
+ badgeWidth: 24,
27
+ ellipsisWidth: 12,
28
+ showBadge: true,
29
+ });
30
+ expect(result.visibleChipIndices).toEqual([0]);
31
+ expect(result.hiddenChipCount).toBe(2);
32
+ expect(result.showEllipsis).toBe(true);
33
+ expect(result.hasOverflow).toBe(true);
34
+ });
35
+ test('allows zero chips when badge and ellipsis take priority in tiny space', () => {
36
+ const result = computeTriggerLayoutModel({
37
+ containerWidth: 36,
38
+ chipWidths: [80, 80],
39
+ chipGap: 4,
40
+ badgeWidth: 24,
41
+ ellipsisWidth: 12,
42
+ showBadge: true,
43
+ });
44
+ expect(result.visibleChipIndices).toEqual([]);
45
+ expect(result.hiddenChipCount).toBe(2);
46
+ expect(result.showEllipsis).toBe(true);
47
+ });
48
+ test('reserving badge space reduces visible count', () => {
49
+ const withBadge = computeTriggerLayoutModel({
50
+ containerWidth: 180,
51
+ chipWidths: [60, 60, 60],
52
+ chipGap: 4,
53
+ badgeWidth: 24,
54
+ ellipsisWidth: 12,
55
+ showBadge: true,
56
+ });
57
+ const withoutBadge = computeTriggerLayoutModel({
58
+ containerWidth: 180,
59
+ chipWidths: [60, 60, 60],
60
+ chipGap: 4,
61
+ badgeWidth: 24,
62
+ ellipsisWidth: 12,
63
+ showBadge: false,
64
+ });
65
+ expect(withoutBadge.visibleChipIndices.length).toBeGreaterThanOrEqual(withBadge.visibleChipIndices.length);
66
+ });
67
+ test('uses safety buffer to avoid a clipped final chip on boundary widths', () => {
68
+ const result = computeTriggerLayoutModel({
69
+ containerWidth: 195.5,
70
+ chipWidths: [73.4, 73.4, 20],
71
+ chipGap: 4,
72
+ badgeWidth: 24.2,
73
+ ellipsisWidth: 11.6,
74
+ showBadge: true,
75
+ safetyBuffer: 1,
76
+ });
77
+ expect(result.visibleChipIndices).toEqual([0]);
78
+ expect(result.showEllipsis).toBe(true);
79
+ });
80
+ });
81
+ //# sourceMappingURL=useVisibleChips.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useVisibleChips.test.js","sourceRoot":"","sources":["../../../src/components/combobox/useVisibleChips.test.tsx"],"names":[],"mappings":"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"}
@@ -10,7 +10,7 @@ export declare const Heading: {
10
10
  level?: HeadingLevel;
11
11
  accept?: string | undefined;
12
12
  acceptCharset?: string | undefined;
13
- action?: string | undefined | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
13
+ action?: string | undefined | ((formData: FormData) => void | Promise<void>) | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
14
14
  allowFullScreen?: boolean | undefined;
15
15
  allowTransparency?: boolean | undefined;
16
16
  alt?: string | undefined;
@@ -39,7 +39,7 @@ export declare const Heading: {
39
39
  download?: any;
40
40
  encType?: string | undefined;
41
41
  form?: string | undefined;
42
- formAction?: string | undefined | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
42
+ formAction?: string | undefined | ((formData: FormData) => void | Promise<void>) | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
43
43
  formEncType?: string | undefined;
44
44
  formMethod?: string | undefined;
45
45
  formNoValidate?: boolean | undefined;
@@ -156,6 +156,10 @@ export declare const Heading: {
156
156
  results?: number | undefined;
157
157
  security?: string | undefined;
158
158
  unselectable?: "on" | "off" | undefined;
159
+ popover?: "" | "auto" | "manual" | "hint" | undefined;
160
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
161
+ popoverTarget?: string | undefined;
162
+ inert?: boolean | undefined;
159
163
  inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
160
164
  is?: string | undefined;
161
165
  exportparts?: string | undefined;
@@ -233,18 +237,18 @@ export declare const Heading: {
233
237
  onFocusCapture?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
234
238
  onBlur?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
235
239
  onBlurCapture?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
236
- onChange?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
237
- onChangeCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
240
+ onChange?: import("react").ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
241
+ onChangeCapture?: import("react").ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
238
242
  onBeforeInput?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
239
- onBeforeInputCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
240
- onInput?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
241
- onInputCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
242
- onReset?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
243
- onResetCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
244
- onSubmit?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
245
- onSubmitCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
246
- onInvalid?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
247
- onInvalidCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
243
+ onBeforeInputCapture?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
244
+ onInput?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
245
+ onInputCapture?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
246
+ onReset?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
247
+ onResetCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
248
+ onSubmit?: import("react").SubmitEventHandler<HTMLHeadingElement> | undefined;
249
+ onSubmitCapture?: import("react").SubmitEventHandler<HTMLHeadingElement> | undefined;
250
+ onInvalid?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
251
+ onInvalidCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
248
252
  onLoad?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
249
253
  onLoadCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
250
254
  onError?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
@@ -365,6 +369,8 @@ export declare const Heading: {
365
369
  onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
366
370
  onScroll?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
367
371
  onScrollCapture?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
372
+ onScrollEnd?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
373
+ onScrollEndCapture?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
368
374
  onWheel?: import("react").WheelEventHandler<HTMLHeadingElement> | undefined;
369
375
  onWheelCapture?: import("react").WheelEventHandler<HTMLHeadingElement> | undefined;
370
376
  onAnimationStart?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
@@ -373,9 +379,17 @@ export declare const Heading: {
373
379
  onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
374
380
  onAnimationIteration?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
375
381
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
382
+ onToggle?: import("react").ToggleEventHandler<HTMLHeadingElement> | undefined;
383
+ onBeforeToggle?: import("react").ToggleEventHandler<HTMLHeadingElement> | undefined;
384
+ onTransitionCancel?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
385
+ onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
376
386
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
377
387
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
378
- ref?: import("react").LegacyRef<HTMLHeadingElement> | undefined;
388
+ onTransitionRun?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
389
+ onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
390
+ onTransitionStart?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
391
+ onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
392
+ ref?: import("react").Ref<HTMLHeadingElement> | undefined;
379
393
  key?: import("react").Key | null | undefined;
380
394
  }, HTMLHeadingElement>;
381
395
  InnerContainer: (props: HeadingSubContainerProps) => import("react").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,KAAK,wBAAwB,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAgBhE,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEzC,KAAK,YAAY,GAAG;IAClB,KAAK,CAAC,EAAE,YAAY,CAAC;CACtB,GAAG,SAAS,CAAC,kBAAkB,CAAC,CAAC;AAElC,eAAO,MAAM,OAAO;YAAW,YAAY;;gBAHjC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BAjBgB,wBAAwB;CA8B7D,CAAC;AAIF,yBAAiB,OAAO,CAAC;IACvB,KAAY,KAAK,GAAG,YAAY,CAAC;IACjC,KAAY,KAAK,GAAG,YAAY,CAAC;IACjC,KAAY,mBAAmB,GAAG,wBAAwB,CAAC;CAC5D"}
1
+ {"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,KAAK,wBAAwB,GAAG,cAAc,CAAC,eAAe,CAAC,CAAC;AAgBhE,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEzC,KAAK,YAAY,GAAG;IAClB,KAAK,CAAC,EAAE,YAAY,CAAC;CACtB,GAAG,SAAS,CAAC,kBAAkB,CAAC,CAAC;AAElC,eAAO,MAAM,OAAO;YAAW,YAAY;;gBAHjC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4BAjBgB,wBAAwB;CA8B7D,CAAC;AAIF,yBAAiB,OAAO,CAAC;IACvB,KAAY,KAAK,GAAG,YAAY,CAAC;IACjC,KAAY,KAAK,GAAG,YAAY,CAAC;IACjC,KAAY,mBAAmB,GAAG,wBAAwB,CAAC;CAC5D"}
@@ -11,7 +11,7 @@ declare const meta: {
11
11
  level?: import("./Heading.js").HeadingLevel;
12
12
  accept?: string | undefined;
13
13
  acceptCharset?: string | undefined;
14
- action?: string | undefined | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
14
+ action?: string | undefined | ((formData: FormData) => void | Promise<void>) | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
15
15
  allowFullScreen?: boolean | undefined;
16
16
  allowTransparency?: boolean | undefined;
17
17
  alt?: string | undefined;
@@ -40,7 +40,7 @@ declare const meta: {
40
40
  download?: any;
41
41
  encType?: string | undefined;
42
42
  form?: string | undefined;
43
- formAction?: string | undefined | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
43
+ formAction?: string | undefined | ((formData: FormData) => void | Promise<void>) | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS];
44
44
  formEncType?: string | undefined;
45
45
  formMethod?: string | undefined;
46
46
  formNoValidate?: boolean | undefined;
@@ -157,6 +157,10 @@ declare const meta: {
157
157
  results?: number | undefined;
158
158
  security?: string | undefined;
159
159
  unselectable?: "on" | "off" | undefined;
160
+ popover?: "" | "auto" | "manual" | "hint" | undefined;
161
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
162
+ popoverTarget?: string | undefined;
163
+ inert?: boolean | undefined;
160
164
  inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
161
165
  is?: string | undefined;
162
166
  exportparts?: string | undefined;
@@ -234,18 +238,18 @@ declare const meta: {
234
238
  onFocusCapture?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
235
239
  onBlur?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
236
240
  onBlurCapture?: import("react").FocusEventHandler<HTMLHeadingElement> | undefined;
237
- onChange?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
238
- onChangeCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
241
+ onChange?: import("react").ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
242
+ onChangeCapture?: import("react").ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
239
243
  onBeforeInput?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
240
- onBeforeInputCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
241
- onInput?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
242
- onInputCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
243
- onReset?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
244
- onResetCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
245
- onSubmit?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
246
- onSubmitCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
247
- onInvalid?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
248
- onInvalidCapture?: import("react").FormEventHandler<HTMLHeadingElement> | undefined;
244
+ onBeforeInputCapture?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
245
+ onInput?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
246
+ onInputCapture?: import("react").InputEventHandler<HTMLHeadingElement> | undefined;
247
+ onReset?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
248
+ onResetCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
249
+ onSubmit?: import("react").SubmitEventHandler<HTMLHeadingElement> | undefined;
250
+ onSubmitCapture?: import("react").SubmitEventHandler<HTMLHeadingElement> | undefined;
251
+ onInvalid?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
252
+ onInvalidCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
249
253
  onLoad?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
250
254
  onLoadCapture?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
251
255
  onError?: import("react").ReactEventHandler<HTMLHeadingElement> | undefined;
@@ -366,6 +370,8 @@ declare const meta: {
366
370
  onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLHeadingElement> | undefined;
367
371
  onScroll?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
368
372
  onScrollCapture?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
373
+ onScrollEnd?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
374
+ onScrollEndCapture?: import("react").UIEventHandler<HTMLHeadingElement> | undefined;
369
375
  onWheel?: import("react").WheelEventHandler<HTMLHeadingElement> | undefined;
370
376
  onWheelCapture?: import("react").WheelEventHandler<HTMLHeadingElement> | undefined;
371
377
  onAnimationStart?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
@@ -374,9 +380,17 @@ declare const meta: {
374
380
  onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
375
381
  onAnimationIteration?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
376
382
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLHeadingElement> | undefined;
383
+ onToggle?: import("react").ToggleEventHandler<HTMLHeadingElement> | undefined;
384
+ onBeforeToggle?: import("react").ToggleEventHandler<HTMLHeadingElement> | undefined;
385
+ onTransitionCancel?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
386
+ onTransitionCancelCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
377
387
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
378
388
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
379
- ref?: import("react").LegacyRef<HTMLHeadingElement> | undefined;
389
+ onTransitionRun?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
390
+ onTransitionRunCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
391
+ onTransitionStart?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
392
+ onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLHeadingElement> | undefined;
393
+ ref?: import("react").Ref<HTMLHeadingElement> | undefined;
380
394
  key?: import("react").Key | null | undefined;
381
395
  }, HTMLHeadingElement>;
382
396
  InnerContainer: (props: import("react").HTMLAttributes<HTMLSpanElement>) => import("react").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"Heading.stories.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAU5D,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAoKvC,iBAAS,eAAe,gCAmBvB;AAMD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DsB,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AAgLtC,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAkCvB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KA8B3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAwB9B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA+BjC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAsChC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAwCnC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAqB/B,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KA0BxC,CAAC;AAEF,eAAO,MAAM,mCAAmC,EAAE,KAsCjD,CAAC;AAEF,eAAO,MAAM,4BAA4B,EAAE,KAwC1C,CAAC"}
1
+ {"version":3,"file":"Heading.stories.d.ts","sourceRoot":"","sources":["../../../src/components/heading/Heading.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAU5D,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAoKvC,iBAAS,eAAe,gCAmBvB;AAMD,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DsB,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AAgLtC,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAkCvB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KA8B3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAwB9B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA+BjC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAsChC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAwCnC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAqB/B,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KA0BxC,CAAC;AAEF,eAAO,MAAM,mCAAmC,EAAE,KAsCjD,CAAC;AAEF,eAAO,MAAM,4BAA4B,EAAE,KAwC1C,CAAC"}
@@ -0,0 +1,37 @@
1
+ import type { IconName } from '../icon/allowedIcons.js';
2
+ import { Icon } from '../icon/Icon.js';
3
+ export type IcoTextProps = {
4
+ children?: React.ReactNode;
5
+ className?: string;
6
+ };
7
+ export type IcoTextHeadingProps = React.HTMLAttributes<HTMLHeadingElement> & {
8
+ children: React.ReactNode;
9
+ };
10
+ export type IcoTextParagraphProps = React.HTMLAttributes<HTMLParagraphElement> & {
11
+ children: React.ReactNode;
12
+ };
13
+ export type IcoTextIconProps = {
14
+ className?: string;
15
+ color?: Icon.Props['color'];
16
+ name: IconName;
17
+ screenReaderText?: string;
18
+ size?: 12 | 16 | 24;
19
+ };
20
+ export declare const IcoText: {
21
+ ({ children, className }: IcoTextProps): React.JSX.Element;
22
+ displayName: string;
23
+ } & {
24
+ Heading: {
25
+ ({ children, className, ...rest }: IcoTextHeadingProps): React.JSX.Element;
26
+ displayName: string;
27
+ };
28
+ Paragraph: {
29
+ ({ children, className, ...rest }: IcoTextParagraphProps): React.JSX.Element;
30
+ displayName: string;
31
+ };
32
+ Icon: {
33
+ ({ className, color, name, screenReaderText, size, }: IcoTextIconProps): React.JSX.Element;
34
+ displayName: string;
35
+ };
36
+ };
37
+ //# sourceMappingURL=IcoText.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IcoText.d.ts","sourceRoot":"","sources":["../../../src/components/icoText/IcoText.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAG5C,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,GAAG;IAC3E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,GAAG;IAC/E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC5B,IAAI,EAAE,QAAQ,CAAC;IACf,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,IAAI,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;CACrB,CAAC;AAgEF,eAAO,MAAM,OAAO;8BA1B0B,YAAY,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;;;2CAhC3E,mBAAmB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;;;2CAUvC,qBAAqB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;;;8DAYzC,gBAAgB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO;;;CAwCrC,CAAC"}
@@ -0,0 +1,29 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import classNames from 'classnames';
3
+ import { Icon } from '../icon/Icon.js';
4
+ import { Children, isValidElement } from 'react';
5
+ const IcoTextHeading = ({ children, className, ...rest }) => (_jsx("h4", { className: classNames('ds-ico-text__heading', className), ...rest, children: children }));
6
+ const IcoTextParagraph = ({ children, className, ...rest }) => (_jsx("p", { className: classNames('ds-ico-text__paragraph', className), ...rest, children: children }));
7
+ const IcoTextIcon = ({ className, color, name, screenReaderText, size = 24, }) => (_jsx(Icon, { name: name, className: classNames('ds-ico-text__icon', className), color: color, screenReaderText: screenReaderText, size: size }));
8
+ const IcoTextRoot = ({ children, className }) => {
9
+ const iconChildren = [];
10
+ const contentChildren = [];
11
+ Children.forEach(children, (child) => {
12
+ if (isValidElement(child) && child.type === IcoTextIcon) {
13
+ iconChildren.push(child);
14
+ return;
15
+ }
16
+ contentChildren.push(child);
17
+ });
18
+ return (_jsxs("div", { className: classNames('ds-ico-text', className), children: [iconChildren, _jsx("div", { className: "ds-ico-text__content", children: contentChildren })] }));
19
+ };
20
+ IcoTextHeading.displayName = 'IcoText.Heading';
21
+ IcoTextParagraph.displayName = 'IcoText.Paragraph';
22
+ IcoTextIcon.displayName = 'IcoText.Icon';
23
+ IcoTextRoot.displayName = 'IcoText';
24
+ export const IcoText = Object.assign(IcoTextRoot, {
25
+ Heading: IcoTextHeading,
26
+ Paragraph: IcoTextParagraph,
27
+ Icon: IcoTextIcon,
28
+ });
29
+ //# sourceMappingURL=IcoText.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IcoText.js","sourceRoot":"","sources":["../../../src/components/icoText/IcoText.tsx"],"names":[],"mappings":";AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAuBjD,MAAM,cAAc,GAAG,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACa,EAAqB,EAAE,CAAC,CAC5C,aAAI,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,KAAM,IAAI,YACnE,QAAQ,GACN,CACN,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,EACxB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACe,EAAqB,EAAE,CAAC,CAC9C,YAAG,SAAS,EAAE,UAAU,CAAC,wBAAwB,EAAE,SAAS,CAAC,KAAM,IAAI,YACpE,QAAQ,GACP,CACL,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,EACnB,SAAS,EACT,KAAK,EACL,IAAI,EACJ,gBAAgB,EAChB,IAAI,GAAG,EAAE,GACQ,EAAqB,EAAE,CAAC,CACzC,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,EACrD,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAE,gBAAgB,EAClC,IAAI,EAAE,IAAI,GACV,CACH,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAgB,EAAqB,EAAE;IAC/E,MAAM,YAAY,GAAsB,EAAE,CAAC;IAC3C,MAAM,eAAe,GAAsB,EAAE,CAAC;IAE9C,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;QACnC,IAAI,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;YACxD,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACzB,OAAO;QACT,CAAC;QAED,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,eAAK,SAAS,EAAE,UAAU,CAAC,aAAa,EAAE,SAAS,CAAC,aACjD,YAAY,EACb,cAAK,SAAS,EAAC,sBAAsB,YAAE,eAAe,GAAO,IACzD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,cAAc,CAAC,WAAW,GAAG,iBAAiB,CAAC;AAC/C,gBAAgB,CAAC,WAAW,GAAG,mBAAmB,CAAC;AACnD,WAAW,CAAC,WAAW,GAAG,cAAc,CAAC;AACzC,WAAW,CAAC,WAAW,GAAG,SAAS,CAAC;AAEpC,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,WAAW,EAAE;IAChD,OAAO,EAAE,cAAc;IACvB,SAAS,EAAE,gBAAgB;IAC3B,IAAI,EAAE,WAAW;CAClB,CAAC,CAAC"}