@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.
- package/.changeset/empty-clocks-jog.md +5 -0
- package/dist/components/combobox/ComboboxButtonTrigger.d.ts +1 -1
- package/dist/components/combobox/ComboboxButtonTrigger.d.ts.map +1 -1
- package/dist/components/combobox/ComboboxListbox.d.ts +2 -2
- package/dist/components/combobox/ComboboxListbox.d.ts.map +1 -1
- package/dist/components/combobox/ComboboxTrigger.d.ts +2 -2
- package/dist/components/combobox/ComboboxTrigger.d.ts.map +1 -1
- package/dist/components/combobox/useComboboxListboxDom.d.ts +1 -1
- package/dist/components/combobox/useComboboxListboxDom.d.ts.map +1 -1
- package/dist/components/combobox/useElementWidth.d.ts +2 -0
- package/dist/components/combobox/useElementWidth.d.ts.map +1 -0
- package/dist/components/combobox/useElementWidth.js +31 -0
- package/dist/components/combobox/useElementWidth.js.map +1 -0
- package/dist/components/combobox/useVisibleChips.d.ts +21 -0
- package/dist/components/combobox/useVisibleChips.d.ts.map +1 -0
- package/dist/components/combobox/useVisibleChips.js +59 -0
- package/dist/components/combobox/useVisibleChips.js.map +1 -0
- package/dist/components/combobox/useVisibleChips.test.d.ts +2 -0
- package/dist/components/combobox/useVisibleChips.test.d.ts.map +1 -0
- package/dist/components/combobox/useVisibleChips.test.js +81 -0
- package/dist/components/combobox/useVisibleChips.test.js.map +1 -0
- package/dist/components/heading/Heading.d.ts +28 -14
- package/dist/components/heading/Heading.d.ts.map +1 -1
- package/dist/components/heading/Heading.stories.d.ts +28 -14
- package/dist/components/heading/Heading.stories.d.ts.map +1 -1
- package/dist/components/icoText/IcoText.d.ts +37 -0
- package/dist/components/icoText/IcoText.d.ts.map +1 -0
- package/dist/components/icoText/IcoText.js +29 -0
- package/dist/components/icoText/IcoText.js.map +1 -0
- package/dist/components/icoText/IcoText.stories.d.ts +60 -0
- package/dist/components/icoText/IcoText.stories.d.ts.map +1 -0
- package/dist/components/icoText/IcoText.stories.js +319 -0
- package/dist/components/icoText/IcoText.stories.js.map +1 -0
- package/dist/components/icoText/IcoText.test.d.ts +2 -0
- package/dist/components/icoText/IcoText.test.d.ts.map +1 -0
- package/dist/components/icoText/IcoText.test.js +27 -0
- package/dist/components/icoText/IcoText.test.js.map +1 -0
- package/dist/components/table/Table.test.js +18 -14
- package/dist/components/table/Table.test.js.map +1 -1
- package/dist/components/tabs/TabsItem.stories.d.ts +50 -22
- package/dist/components/tabs/TabsItem.stories.d.ts.map +1 -1
- package/dist/components/tagList/useTagListCollapsedLayout.d.ts +3 -3
- package/dist/components/tagList/useTagListCollapsedLayout.d.ts.map +1 -1
- package/dist/components/tree-row/TreeRow.d.ts +32 -0
- package/dist/components/tree-row/TreeRow.d.ts.map +1 -0
- package/dist/components/tree-row/TreeRow.js +19 -0
- package/dist/components/tree-row/TreeRow.js.map +1 -0
- package/dist/components/tree-row/TreeRow.stories.d.ts +13 -0
- package/dist/components/tree-row/TreeRow.stories.d.ts.map +1 -0
- package/dist/components/tree-row/TreeRow.stories.js +774 -0
- package/dist/components/tree-row/TreeRow.stories.js.map +1 -0
- package/dist/components/tree-row/TreeRow.test.d.ts +2 -0
- package/dist/components/tree-row/TreeRow.test.d.ts.map +1 -0
- package/dist/components/tree-row/TreeRow.test.js +262 -0
- package/dist/components/tree-row/TreeRow.test.js.map +1 -0
- package/dist/components/tree-row/TreeRowSection.d.ts +12 -0
- package/dist/components/tree-row/TreeRowSection.d.ts.map +1 -0
- package/dist/components/tree-row/TreeRowSection.js +20 -0
- package/dist/components/tree-row/TreeRowSection.js.map +1 -0
- package/dist/utils/PopupParentContext.d.ts +3 -0
- package/dist/utils/PopupParentContext.d.ts.map +1 -0
- package/dist/utils/PopupParentContext.js +6 -0
- package/dist/utils/PopupParentContext.js.map +1 -0
- package/dist/utils/PopupParentContext.stories.d.ts +17 -0
- package/dist/utils/PopupParentContext.stories.d.ts.map +1 -0
- package/dist/utils/PopupParentContext.stories.js +266 -0
- package/dist/utils/PopupParentContext.stories.js.map +1 -0
- package/dist/utils/getDefaultPopupParent.d.ts +2 -0
- package/dist/utils/getDefaultPopupParent.d.ts.map +1 -0
- package/dist/utils/getDefaultPopupParent.js +19 -0
- package/dist/utils/getDefaultPopupParent.js.map +1 -0
- package/dist/utils/hooks/useIsMounted.d.ts +1 -1
- package/dist/utils/hooks/useIsMounted.d.ts.map +1 -1
- package/package.json +19 -5
- package/src/components/arborLogo/__snapshots__/ArborLogo.test.tsx.snap +18 -18
- package/src/components/combobox/ComboboxButtonTrigger.tsx +1 -1
- package/src/components/combobox/ComboboxListbox.tsx +2 -2
- package/src/components/combobox/ComboboxTrigger.tsx +2 -2
- package/src/components/combobox/useComboboxListboxDom.ts +1 -1
- package/src/components/table/Table.test.tsx +18 -14
- package/src/components/tagList/useTagListCollapsedLayout.ts +3 -3
- 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;
|
|
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;
|
|
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;
|
|
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;
|
|
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 @@
|
|
|
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 @@
|
|
|
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").
|
|
237
|
-
onChangeCapture?: import("react").
|
|
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").
|
|
240
|
-
onInput?: import("react").
|
|
241
|
-
onInputCapture?: import("react").
|
|
242
|
-
onReset?: import("react").
|
|
243
|
-
onResetCapture?: import("react").
|
|
244
|
-
onSubmit?: import("react").
|
|
245
|
-
onSubmitCapture?: import("react").
|
|
246
|
-
onInvalid?: import("react").
|
|
247
|
-
onInvalidCapture?: import("react").
|
|
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
|
-
|
|
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
|
|
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").
|
|
238
|
-
onChangeCapture?: import("react").
|
|
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").
|
|
241
|
-
onInput?: import("react").
|
|
242
|
-
onInputCapture?: import("react").
|
|
243
|
-
onReset?: import("react").
|
|
244
|
-
onResetCapture?: import("react").
|
|
245
|
-
onSubmit?: import("react").
|
|
246
|
-
onSubmitCapture?: import("react").
|
|
247
|
-
onInvalid?: import("react").
|
|
248
|
-
onInvalidCapture?: import("react").
|
|
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
|
-
|
|
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
|
|
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"}
|