npm - @frontify/fondue - Versions diffs - 12.0.0-beta.4 → 12.0.0-beta.6 - Mend

@frontify/fondue 12.0.0-beta.4 → 12.0.0-beta.6

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 (226) hide show

package/dist/components/ScrollWrapper/ScrollWrapper.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ScrollWrapper.es.js","sources":["../../../src/components/ScrollWrapper/ScrollWrapper.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useFocusRing } from '@react-aria/focus';\nimport React, { FC, useRef } from 'react';\nimport { FOCUS_STYLE, merge } from '../..';\nimport { useScrollWrapper } from './hooks/useScrollWrapper';\nimport { ScrollWrapperDirection, ScrollWrapperProps, scrollWrapperDirections } from './types';\n\nconst GRADIENTS = {\n bottom: 'linear-gradient(180deg, rgba(232, 233, 233, 0) 0%, #E8E9E9 100%)',\n top: 'linear-gradient(0deg, rgba(232, 233, 233, 0) 0%, #E8E9E9 100%)',\n};\n\nexport const ScrollWrapper: FC<ScrollWrapperProps> = ({ direction = ScrollWrapperDirection.Vertical, children }) => {\n const scrollingContainer = useRef<HTMLDivElement>(null);\n\n const [{ showTopShadow, showBottomShadow }, scrollDivProps] = useScrollWrapper(scrollingContainer);\n\n const { isFocusVisible, focusProps } = useFocusRing();\n\n const directionVertical =\n direction === ScrollWrapperDirection.Vertical \|\| direction === ScrollWrapperDirection.Both;\n\n const gradientWidth = scrollingContainer.current ? scrollingContainer.current.clientWidth + 8 : '100%';\n\n return (\n <div\n data-test-id=\"scroll-wrapper\"\n className=\"tw-h-full tw-relative tw-flex-auto tw-flex tw-flex-col tw-min-h-0\"\n >\n {directionVertical && showTopShadow && (\n <div\n className=\"tw-h-3 tw-w-full tw-absolute tw-z-10 tw-top-0 tw-left-0 tw-mix-blend-darken tw-border-t tw-border-line\"\n style={{\n background: GRADIENTS.top,\n width: gradientWidth,\n }}\n />\n )}\n <div\n ref={scrollingContainer}\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={0}\n role=\"region\"\n aria-label=\"Scrollable dialogue content\"\n className={merge([\n scrollWrapperDirections[direction],\n 'tw-flex-auto tw-min-h-0 tw-outline-none tw-pb-2 tw-px-2 tw--mx-2',\n isFocusVisible && FOCUS_STYLE,\n ])}\n {...scrollDivProps}\n {...focusProps}\n >\n {children}\n </div>\n {directionVertical && showBottomShadow && (\n <div\n className=\"tw-h-3 tw-absolute tw-z-10 tw-bottom-0 tw-left-0 tw-mix-blend-darken tw-border-b tw-border-line\"\n style={{\n background: GRADIENTS.bottom,\n width: gradientWidth,\n }}\n />\n )}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,IAAY;AAAA,EACd,QAAQ;AAAA,EACR,KAAK;AACT,GAEa,KAAwC,CAAC,EAAE,eAAY,EAAuB,UAAU,kBAAe;AAC1G,QAAA,IAAqB,EAAuB,IAAI,GAEhD,CAAC,EAAE,kBAAe,uBAAoB,KAAkB,EAAiB,CAAkB,GAE3F,EAAE,mBAAgB,kBAAe,EAAa,GAE9C,IACF,MAAc,EAAuB,YAAY,MAAc,EAAuB,MAEpF,IAAgB,EAAmB,UAAU,EAAmB,QAAQ,cAAc,IAAI;AAEhG,SACK,kBAAA,cAAA,OAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAU;AAAA,EAET,GAAA,KAAqB,KACjB,kBAAA,cAAA,OAAA;AAAA,IACG,WAAU;AAAA,IACV,OAAO;AAAA,MACH,YAAY,EAAU;AAAA,MACtB,OAAO;AAAA,IACX;AAAA,EAAA,CACJ,GAEH,kBAAA,cAAA,OAAA;AAAA,IACG,KAAK;AAAA,IAEL,UAAU;AAAA,IACV,MAAK;AAAA,IACL,cAAW;AAAA,IACX,WAAW,EAAM;AAAA,MACb,EAAwB;AAAA,MACxB;AAAA,MACA,KAAkB;AAAA,IAAA,CACrB;AAAA,IACA,GAAG;AAAA,IACH,GAAG;AAAA,EAAA,GAEH,CACL,GACC,KAAqB,KACjB,kBAAA,cAAA,OAAA;AAAA,IACG,WAAU;AAAA,IACV,OAAO;AAAA,MACH,YAAY,EAAU;AAAA,MACtB,OAAO;AAAA,IACX;AAAA,EACJ,CAAA,CAER;AAER;"}
1	+ {"version":3,"file":"ScrollWrapper.es.js","sources":["../../../src/components/ScrollWrapper/ScrollWrapper.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useFocusRing } from '@react-aria/focus';\nimport React, { FC, useRef } from 'react';\nimport { FOCUS_STYLE, merge } from '../..';\nimport { useScrollWrapper } from './hooks/useScrollWrapper';\nimport { ScrollWrapperDirection, ScrollWrapperProps, scrollWrapperDirections } from './types';\n\nconst GRADIENTS = {\n bottom: 'linear-gradient(180deg, rgba(232, 233, 233, 0) 0%, #E8E9E9 100%)',\n top: 'linear-gradient(0deg, rgba(232, 233, 233, 0) 0%, #E8E9E9 100%)',\n};\n\nexport const ScrollWrapper: FC<ScrollWrapperProps> = ({ direction = ScrollWrapperDirection.Vertical, children }) => {\n const scrollingContainer = useRef<HTMLDivElement>(null);\n\n const [{ showTopShadow, showBottomShadow }, scrollDivProps] = useScrollWrapper(scrollingContainer);\n\n const { isFocusVisible, focusProps } = useFocusRing();\n\n const directionVertical =\n direction === ScrollWrapperDirection.Vertical \|\| direction === ScrollWrapperDirection.Both;\n\n const gradientWidth = scrollingContainer.current ? scrollingContainer.current.clientWidth + 8 : '100%';\n\n return (\n <div\n data-test-id=\"scroll-wrapper\"\n className=\"tw-h-full tw-relative tw-flex-auto tw-flex tw-flex-col tw-min-h-0\"\n >\n {directionVertical && showTopShadow && (\n <div\n className=\"tw-h-3 tw-w-full tw-absolute tw-z-10 tw-top-0 tw-left-0 tw-mix-blend-darken tw-border-t tw-border-line\"\n style={{\n background: GRADIENTS.top,\n width: gradientWidth,\n }}\n />\n )}\n <div\n ref={scrollingContainer}\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={0}\n role=\"region\"\n aria-label=\"Scrollable dialogue content\"\n className={merge([\n scrollWrapperDirections[direction],\n 'tw-flex-auto tw-min-h-0 tw-outline-none tw-pb-2 tw-px-2 tw--mx-2',\n isFocusVisible && FOCUS_STYLE,\n ])}\n {...scrollDivProps}\n {...focusProps}\n >\n {children}\n </div>\n {directionVertical && showBottomShadow && (\n <div\n className=\"tw-h-3 tw-absolute tw-z-10 tw-bottom-0 tw-left-0 tw-mix-blend-darken tw-border-b tw-border-line\"\n style={{\n background: GRADIENTS.bottom,\n width: gradientWidth,\n }}\n />\n )}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAM,IAAY;AAAA,EACd,QAAQ;AAAA,EACR,KAAK;AACT,GAEa,KAAwC,CAAC,EAAE,eAAY,EAAuB,UAAU,kBAAe;AAC1G,QAAA,IAAqB,EAAuB,IAAI,GAEhD,CAAC,EAAE,kBAAe,uBAAoB,KAAkB,EAAiB,CAAkB,GAE3F,EAAE,mBAAgB,kBAAe,EAAa,GAE9C,IACF,MAAc,EAAuB,YAAY,MAAc,EAAuB,MAEpF,IAAgB,EAAmB,UAAU,EAAmB,QAAQ,cAAc,IAAI;AAEhG,SACK,kBAAA,cAAA,OAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAU;AAAA,EAET,GAAA,KAAqB,KACjB,kBAAA,cAAA,OAAA;AAAA,IACG,WAAU;AAAA,IACV,OAAO;AAAA,MACH,YAAY,EAAU;AAAA,MACtB,OAAO;AAAA,IACX;AAAA,EAAA,CACJ,GAEH,kBAAA,cAAA,OAAA;AAAA,IACG,KAAK;AAAA,IAEL,UAAU;AAAA,IACV,MAAK;AAAA,IACL,cAAW;AAAA,IACX,WAAW,EAAM;AAAA,MACb,EAAwB;AAAA,MACxB;AAAA,MACA,KAAkB;AAAA,IAAA,CACrB;AAAA,IACA,GAAG;AAAA,IACH,GAAG;AAAA,EAAA,GAEH,CACL,GACC,KAAqB,KACjB,kBAAA,cAAA,OAAA;AAAA,IACG,WAAU;AAAA,IACV,OAAO;AAAA,MACH,YAAY,EAAU;AAAA,MACtB,OAAO;AAAA,IACX;AAAA,EACJ,CAAA,CAER;AAER;"}

package/dist/components/Table/TableCell.es.js CHANGED Viewed

@@ -1691,6 +1691,15 @@ import "react-dnd-html5-backend";
 import "@udecode/plate";
 import "../RichTextEditor/context/RichTextEditorContext.es.js";
 import "../RichTextEditor/EditorActions/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/textStyles.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom1Plugin/createCustom1Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom2Plugin/createCustom2Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom3Plugin/createCustom3Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading1Plugin/createHeading1Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading2Plugin/createHeading2Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading3Plugin/createHeading3Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading4Plugin/createHeading4Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Quote/createQuotePlugin.es.js";
 import "../RichTextEditor/EditorActions/Plugins/CheckboxListPlugin/index.es.js";
 import "slate-react";
 import "../RichTextEditor/EditorActions/Plugins/LinkPlugin/index.es.js";
@@ -1702,7 +1711,7 @@ import { SelectionMode as k } from "./Table.es.js";
 import "react-textarea-autosize";
 import "../Tree/utils/mocks.es.js";
 var d = /* @__PURE__ */ ((t) => (t.Default = "Default", t.Checkbox = "Checkbox", t))(d || {});
-const Z4 = ({
+const eN = ({
   cell: t,
   selectionMode: l,
   type: f = "Default",
@@ -1748,7 +1757,7 @@ const Z4 = ({
   }, t.rendered);
 };
 export {
-  Z4 as TableCell,
+  eN as TableCell,
   d as TableCellType
 };
 //# sourceMappingURL=TableCell.es.js.map

package/dist/components/Table/TableCell.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableCell.es.js","sources":["../../../src/components/Table/TableCell.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Checkbox as CheckboxComponent, CheckboxState } from '@components/Checkbox/Checkbox';\nimport { merge } from '@utilities/merge';\nimport React, { Key, useRef } from 'react';\nimport { SelectionMode } from '..';\n\nexport enum TableCellType {\n Default = 'Default',\n Checkbox = 'Checkbox',\n}\n\nexport type TableCellProps = {\n cell: any;\n selectionMode: string;\n type?: TableCellType;\n isChecked?: boolean;\n selectedRows: Key[];\n setSelectedRows?: (ids?: Key[]) => void;\n};\n\nexport const TableCell = ({\n cell,\n selectionMode,\n type = TableCellType.Default,\n isChecked = false,\n selectedRows,\n setSelectedRows,\n}: TableCellProps) => {\n const ref = useRef<HTMLTableCellElement \| null>(null);\n\n if (type === TableCellType.Checkbox) {\n const { key } = cell;\n const handleChange = () => {\n if (!setSelectedRows) {\n return;\n }\n\n if (isChecked) {\n const filteredRows = selectedRows.filter((row) => row !== cell.parentKey);\n setSelectedRows(filteredRows);\n return;\n }\n\n const rowsToSelect =\n selectionMode === SelectionMode.SingleSelect ? [cell.parentKey] : [...selectedRows, cell.parentKey];\n setSelectedRows(rowsToSelect);\n };\n\n return (\n <td\n role=\"cell\"\n ref={ref}\n className={merge([\n 'tw-pl-8 tw-py-4 tw-pr-4 tw-relative after:tw-absolute after:tw-left-0 after:tw-top-[-1px] after:tw-bottom-[-1px] after:tw-w-1',\n isChecked ? 'after:tw-bg-box-selected-strong' : 'after:tw-bg-transparent',\n ])}\n data-test-id=\"table-select-cell\"\n >\n <CheckboxComponent\n value={key}\n ariaLabel={cell['aria-label'] \|\| key}\n state={isChecked ? CheckboxState.Checked : CheckboxState.Unchecked}\n onChange={handleChange}\n />\n </td>\n );\n }\n\n return (\n <td\n role=\"cell\"\n ref={ref}\n className={merge([\n 'tw-p-4 tw-font-normal tw-text-xs focus:tw-outline-none',\n isChecked ? 'tw-text-black-100 dark:tw-text-white' : 'tw-text-black-80 dark:tw-text-black-20',\n ])}\n >\n {cell.rendered}\n </td>\n );\n};\n"],"names":["CheckboxComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMY,IAAA,sBAAA,MACE,GAAA,UAAA,WACC,EAAA,WAAA,YAFH,IAAA,KAAA,CAAA,CAAA;AAcL,MAAM,KAAY,CAAC;AAAA,EACtB;AAAA,EACA;AAAA,EACA,UAAO;AAAA,EACP,eAAY;AAAA,EACZ;AAAA,EACA;AAAA,MACkB;AACZ,QAAA,IAAM,EAAoC,IAAI;AAEpD,MAAI,MAAS,YAAwB;AACjC,UAAM,EAAE,WAAQ,GACV,IAAe,MAAM;AACvB,UAAI,CAAC;AACD;AAGJ,UAAI,GAAW;AACX,cAAM,IAAe,EAAa,OAAO,CAAC,MAAQ,MAAQ,EAAK,SAAS;AACxE,UAAgB,CAAY;AAC5B;AAAA,MACJ;AAEA,YAAM,IACF,MAAkB,EAAc,eAAe,CAAC,EAAK,SAAS,IAAI,CAAC,GAAG,GAAc,EAAK,SAAS;AACtG,QAAgB,CAAY;AAAA,IAAA;AAGhC,WACK,kBAAA,cAAA,MAAA;AAAA,MACG,MAAK;AAAA,MACL;AAAA,MACA,WAAW,EAAM;AAAA,QACb;AAAA,QACA,IAAY,oCAAoC;AAAA,MAAA,CACnD;AAAA,MACD,gBAAa;AAAA,IAAA,GAEZ,kBAAA,cAAAA,GAAA;AAAA,MACG,OAAO;AAAA,MACP,WAAW,EAAK,iBAAiB;AAAA,MACjC,OAAO,IAAY,EAAc,UAAU,EAAc;AAAA,MACzD,UAAU;AAAA,IACd,CAAA,CACJ;AAAA,EAER;AAEA,SACK,kBAAA,cAAA,MAAA;AAAA,IACG,MAAK;AAAA,IACL;AAAA,IACA,WAAW,EAAM;AAAA,MACb;AAAA,MACA,IAAY,yCAAyC;AAAA,IAAA,CACxD;AAAA,EAAA,GAEA,EAAK,QACV;AAER;"}
1	+ {"version":3,"file":"TableCell.es.js","sources":["../../../src/components/Table/TableCell.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Checkbox as CheckboxComponent, CheckboxState } from '@components/Checkbox/Checkbox';\nimport { merge } from '@utilities/merge';\nimport React, { Key, useRef } from 'react';\nimport { SelectionMode } from '..';\n\nexport enum TableCellType {\n Default = 'Default',\n Checkbox = 'Checkbox',\n}\n\nexport type TableCellProps = {\n cell: any;\n selectionMode: string;\n type?: TableCellType;\n isChecked?: boolean;\n selectedRows: Key[];\n setSelectedRows?: (ids?: Key[]) => void;\n};\n\nexport const TableCell = ({\n cell,\n selectionMode,\n type = TableCellType.Default,\n isChecked = false,\n selectedRows,\n setSelectedRows,\n}: TableCellProps) => {\n const ref = useRef<HTMLTableCellElement \| null>(null);\n\n if (type === TableCellType.Checkbox) {\n const { key } = cell;\n const handleChange = () => {\n if (!setSelectedRows) {\n return;\n }\n\n if (isChecked) {\n const filteredRows = selectedRows.filter((row) => row !== cell.parentKey);\n setSelectedRows(filteredRows);\n return;\n }\n\n const rowsToSelect =\n selectionMode === SelectionMode.SingleSelect ? [cell.parentKey] : [...selectedRows, cell.parentKey];\n setSelectedRows(rowsToSelect);\n };\n\n return (\n <td\n role=\"cell\"\n ref={ref}\n className={merge([\n 'tw-pl-8 tw-py-4 tw-pr-4 tw-relative after:tw-absolute after:tw-left-0 after:tw-top-[-1px] after:tw-bottom-[-1px] after:tw-w-1',\n isChecked ? 'after:tw-bg-box-selected-strong' : 'after:tw-bg-transparent',\n ])}\n data-test-id=\"table-select-cell\"\n >\n <CheckboxComponent\n value={key}\n ariaLabel={cell['aria-label'] \|\| key}\n state={isChecked ? CheckboxState.Checked : CheckboxState.Unchecked}\n onChange={handleChange}\n />\n </td>\n );\n }\n\n return (\n <td\n role=\"cell\"\n ref={ref}\n className={merge([\n 'tw-p-4 tw-font-normal tw-text-xs focus:tw-outline-none',\n isChecked ? 'tw-text-black-100 dark:tw-text-white' : 'tw-text-black-80 dark:tw-text-black-20',\n ])}\n >\n {cell.rendered}\n </td>\n );\n};\n"],"names":["CheckboxComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMY,IAAA,sBAAA,MACE,GAAA,UAAA,WACC,EAAA,WAAA,YAFH,IAAA,KAAA,CAAA,CAAA;AAcL,MAAM,KAAY,CAAC;AAAA,EACtB;AAAA,EACA;AAAA,EACA,UAAO;AAAA,EACP,eAAY;AAAA,EACZ;AAAA,EACA;AAAA,MACkB;AACZ,QAAA,IAAM,EAAoC,IAAI;AAEpD,MAAI,MAAS,YAAwB;AACjC,UAAM,EAAE,WAAQ,GACV,IAAe,MAAM;AACvB,UAAI,CAAC;AACD;AAGJ,UAAI,GAAW;AACX,cAAM,IAAe,EAAa,OAAO,CAAC,MAAQ,MAAQ,EAAK,SAAS;AACxE,UAAgB,CAAY;AAC5B;AAAA,MACJ;AAEA,YAAM,IACF,MAAkB,EAAc,eAAe,CAAC,EAAK,SAAS,IAAI,CAAC,GAAG,GAAc,EAAK,SAAS;AACtG,QAAgB,CAAY;AAAA,IAAA;AAGhC,WACK,kBAAA,cAAA,MAAA;AAAA,MACG,MAAK;AAAA,MACL;AAAA,MACA,WAAW,EAAM;AAAA,QACb;AAAA,QACA,IAAY,oCAAoC;AAAA,MAAA,CACnD;AAAA,MACD,gBAAa;AAAA,IAAA,GAEZ,kBAAA,cAAAA,GAAA;AAAA,MACG,OAAO;AAAA,MACP,WAAW,EAAK,iBAAiB;AAAA,MACjC,OAAO,IAAY,EAAc,UAAU,EAAc;AAAA,MACzD,UAAU;AAAA,IACd,CAAA,CACJ;AAAA,EAER;AAEA,SACK,kBAAA,cAAA,MAAA;AAAA,IACG,MAAK;AAAA,IACL;AAAA,IACA,WAAW,EAAM;AAAA,MACb;AAAA,MACA,IAAY,yCAAyC;AAAA,IAAA,CACxD;AAAA,EAAA,GAEA,EAAK,QACV;AAER;"}

package/dist/components/Table/TableColumnHeader.es.js CHANGED Viewed

@@ -1692,6 +1692,15 @@ import "react-dnd-html5-backend";
 import "@udecode/plate";
 import "../RichTextEditor/context/RichTextEditorContext.es.js";
 import "../RichTextEditor/EditorActions/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/textStyles.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom1Plugin/createCustom1Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom2Plugin/createCustom2Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom3Plugin/createCustom3Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading1Plugin/createHeading1Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading2Plugin/createHeading2Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading3Plugin/createHeading3Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading4Plugin/createHeading4Plugin.es.js";
+import "../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Quote/createQuotePlugin.es.js";
 import "../RichTextEditor/EditorActions/Plugins/CheckboxListPlugin/index.es.js";
 import "slate-react";
 import "../RichTextEditor/EditorActions/Plugins/LinkPlugin/index.es.js";
@@ -1703,7 +1712,7 @@ import { SortDirection as O, SelectionMode as _ } from "./Table.es.js";
 import "react-textarea-autosize";
 import "../Tree/utils/mocks.es.js";
 var F = /* @__PURE__ */ ((r) => (r.Default = "Default", r.SelectAll = "SelectAll", r))(F || {});
-const bD = ({
+const CD = ({
   column: r,
   type: d = "Default",
   rowIds: b,
@@ -1762,7 +1771,7 @@ const bD = ({
   }, B(E, { size: N.Size12 }))));
 };
 export {
-  bD as TableColumnHeader,
+  CD as TableColumnHeader,
   F as TableColumnHeaderType
 };
 //# sourceMappingURL=TableColumnHeader.es.js.map

package/dist/components/Table/TableColumnHeader.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableColumnHeader.es.js","sources":["../../../src/components/Table/TableColumnHeader.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Checkbox, CheckboxState } from '@components/Checkbox/Checkbox';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport React, { Key, cloneElement, useEffect, useRef, useState } from 'react';\nimport { IconArrowBidirectional, IconArrowDown, IconArrowUp } from '@foundation/Icon';\nimport { SelectionMode, SortDirection } from '..';\n\nexport enum TableColumnHeaderType {\n Default = 'Default',\n SelectAll = 'SelectAll',\n}\n\nexport type TableColumnHeaderProps = {\n column: any;\n type?: TableColumnHeaderType;\n rowIds: Key[];\n sortDirection?: SortDirection;\n selectionMode: string;\n isColumnSorted?: boolean;\n handleSortChange: (column: string, direction?: SortDirection) => void;\n setSelectedRows?: (ids?: Key[]) => void;\n};\n\nexport const TableColumnHeader = ({\n column,\n type = TableColumnHeaderType.Default,\n rowIds,\n sortDirection,\n selectionMode,\n isColumnSorted = false,\n handleSortChange,\n setSelectedRows,\n}: TableColumnHeaderProps) => {\n const {\n key,\n rendered,\n props: { allowsSorting },\n } = column;\n const [icon, setIcon] = useState(<IconArrowBidirectional />);\n const [isChecked, setIsChecked] = useState(false);\n const ref = useRef<HTMLTableCellElement \| null>(null);\n const ButtonOrSpan = allowsSorting ? 'button' : 'span';\n\n useEffect(() => {\n if (isColumnSorted) {\n setIcon(sortDirection === SortDirection.Descending ? <IconArrowDown /> : <IconArrowUp />);\n } else {\n setIcon(<IconArrowBidirectional />);\n }\n }, [isColumnSorted, sortDirection]);\n\n if (type === TableColumnHeaderType.SelectAll) {\n const ariaProps = {\n 'aria-label': 'Select all',\n scope: 'col',\n };\n\n const checkboxState = isChecked ? CheckboxState.Checked : CheckboxState.Unchecked;\n\n const handleChange = () => {\n if (!setSelectedRows) {\n return;\n }\n\n if (isChecked) {\n setSelectedRows([]);\n } else {\n setSelectedRows(rowIds);\n }\n\n setIsChecked((checked) => !checked);\n };\n\n return (\n <th\n {...ariaProps}\n ref={ref}\n className=\"tw-pl-8 tw-py-3 tw-pr-4 tw-w-16 tw-border-l-4 tw-border-transparent tw-group tw-outline-none\"\n data-test-id=\"table-select-cell\"\n >\n {selectionMode === SelectionMode.SingleSelect ? (\n <span className=\"tw-sr-only\">{ariaProps['aria-label']}</span>\n ) : (\n <Checkbox value={key} ariaLabel={key} state={checkboxState} onChange={handleChange} />\n )}\n </th>\n );\n }\n\n return (\n <th\n ref={ref}\n className={merge([\n 'tw-text-xs tw-font-medium tw-text-black-100 dark:tw-text-white tw-px-4 tw-py-3 tw-outline-none tw-group focus-visible:bg-violet-90',\n allowsSorting ? 'tw-cursor-pointer' : '',\n ])}\n data-test-id=\"table-column\"\n scope=\"col\"\n onClick={allowsSorting ? () => handleSortChange(column.key, sortDirection) : () => null}\n >\n <ButtonOrSpan\n className={merge([\n 'tw-flex tw-gap-x-1 tw-items-center',\n FOCUS_VISIBLE_STYLE,\n allowsSorting ? 'tw-cursor-pointer' : 'tw-cursor-default',\n ])}\n >\n {rendered}\n {allowsSorting && (\n <span\n aria-hidden=\"true\"\n className={\n isColumnSorted\n ? 'tw-text-violet-50'\n : 'tw-text-black-40 dark:tw-text-black-60 group-hover:tw-text-black-100 dark:group-hover:tw-text-white'\n }\n >\n {cloneElement(icon, { size: IconSize.Size12 })}\n </span>\n )}\n </ButtonOrSpan>\n </th>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASY,IAAA,sBAAA,MACE,GAAA,UAAA,WACE,EAAA,YAAA,aAFJ,IAAA,KAAA,CAAA,CAAA;AAgBL,MAAM,KAAoB,CAAC;AAAA,EAC9B;AAAA,EACA,UAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,oBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,MAC0B;AACpB,QAAA;AAAA,IACF;AAAA,IACA;AAAA,IACA,OAAO,EAAE;AAAA,MACT,GACE,CAAC,GAAM,KAAW,EAAS,kBAAA,cAAC,OAAuB,CAAE,GACrD,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,IAAM,EAAoC,IAAI,GAC9C,IAAe,IAAgB,WAAW;AAUhD,MARA,EAAU,MAAM;AACZ,IACY,EADZ,AAAI,IACQ,MAAkB,EAAc,aAAa,kBAAA,cAAC,OAAc,IAAK,kBAAA,cAAC,OAAY,IAE9E,kBAAA,cAAC,OAAuB,CAFwD;AAAA,EAG5F,GACD,CAAC,GAAgB,CAAa,CAAC,GAE9B,MAAS,aAAiC;AAC1C,UAAM,IAAY;AAAA,MACd,cAAc;AAAA,MACd,OAAO;AAAA,IAAA,GAGL,IAAgB,IAAY,EAAc,UAAU,EAAc,WAElE,IAAe,MAAM;AACvB,MAAI,CAAC,KAIL,CACI,EADJ,AAAI,IACgB,CAAE,IAEF,CAFE,GAKT,EAAA,CAAC,MAAY,CAAC,CAAO;AAAA,IAAA;AAGtC,WACK,kBAAA,cAAA,MAAA;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,WAAU;AAAA,MACV,gBAAa;AAAA,IAAA,GAEZ,MAAkB,EAAc,eAC5B,kBAAA,cAAA,QAAA;AAAA,MAAK,WAAU;AAAA,IAAA,GAAc,EAAU,aAAc,IAErD,kBAAA,cAAA,GAAA;AAAA,MAAS,OAAO;AAAA,MAAK,WAAW;AAAA,MAAK,OAAO;AAAA,MAAe,UAAU;AAAA,IAAc,CAAA,CAE5F;AAAA,EAER;AAEA,SACK,kBAAA,cAAA,MAAA;AAAA,IACG;AAAA,IACA,WAAW,EAAM;AAAA,MACb;AAAA,MACA,IAAgB,sBAAsB;AAAA,IAAA,CACzC;AAAA,IACD,gBAAa;AAAA,IACb,OAAM;AAAA,IACN,SAAS,IAAgB,MAAM,EAAiB,EAAO,KAAK,CAAa,IAAI,MAAM;AAAA,EAAA,GAElF,kBAAA,cAAA,GAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA;AAAA,MACA,IAAgB,sBAAsB;AAAA,IAAA,CACzC;AAAA,EAEA,GAAA,GACA,KACI,kBAAA,cAAA,QAAA;AAAA,IACG,eAAY;AAAA,IACZ,WACI,IACM,sBACA;AAAA,EAAA,GAGT,EAAa,GAAM,EAAE,MAAM,EAAS,OAAQ,CAAA,CACjD,CAER,CACJ;AAER;"}
1	+ {"version":3,"file":"TableColumnHeader.es.js","sources":["../../../src/components/Table/TableColumnHeader.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Checkbox, CheckboxState } from '@components/Checkbox/Checkbox';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport React, { Key, cloneElement, useEffect, useRef, useState } from 'react';\nimport { IconArrowBidirectional, IconArrowDown, IconArrowUp } from '@foundation/Icon';\nimport { SelectionMode, SortDirection } from '..';\n\nexport enum TableColumnHeaderType {\n Default = 'Default',\n SelectAll = 'SelectAll',\n}\n\nexport type TableColumnHeaderProps = {\n column: any;\n type?: TableColumnHeaderType;\n rowIds: Key[];\n sortDirection?: SortDirection;\n selectionMode: string;\n isColumnSorted?: boolean;\n handleSortChange: (column: string, direction?: SortDirection) => void;\n setSelectedRows?: (ids?: Key[]) => void;\n};\n\nexport const TableColumnHeader = ({\n column,\n type = TableColumnHeaderType.Default,\n rowIds,\n sortDirection,\n selectionMode,\n isColumnSorted = false,\n handleSortChange,\n setSelectedRows,\n}: TableColumnHeaderProps) => {\n const {\n key,\n rendered,\n props: { allowsSorting },\n } = column;\n const [icon, setIcon] = useState(<IconArrowBidirectional />);\n const [isChecked, setIsChecked] = useState(false);\n const ref = useRef<HTMLTableCellElement \| null>(null);\n const ButtonOrSpan = allowsSorting ? 'button' : 'span';\n\n useEffect(() => {\n if (isColumnSorted) {\n setIcon(sortDirection === SortDirection.Descending ? <IconArrowDown /> : <IconArrowUp />);\n } else {\n setIcon(<IconArrowBidirectional />);\n }\n }, [isColumnSorted, sortDirection]);\n\n if (type === TableColumnHeaderType.SelectAll) {\n const ariaProps = {\n 'aria-label': 'Select all',\n scope: 'col',\n };\n\n const checkboxState = isChecked ? CheckboxState.Checked : CheckboxState.Unchecked;\n\n const handleChange = () => {\n if (!setSelectedRows) {\n return;\n }\n\n if (isChecked) {\n setSelectedRows([]);\n } else {\n setSelectedRows(rowIds);\n }\n\n setIsChecked((checked) => !checked);\n };\n\n return (\n <th\n {...ariaProps}\n ref={ref}\n className=\"tw-pl-8 tw-py-3 tw-pr-4 tw-w-16 tw-border-l-4 tw-border-transparent tw-group tw-outline-none\"\n data-test-id=\"table-select-cell\"\n >\n {selectionMode === SelectionMode.SingleSelect ? (\n <span className=\"tw-sr-only\">{ariaProps['aria-label']}</span>\n ) : (\n <Checkbox value={key} ariaLabel={key} state={checkboxState} onChange={handleChange} />\n )}\n </th>\n );\n }\n\n return (\n <th\n ref={ref}\n className={merge([\n 'tw-text-xs tw-font-medium tw-text-black-100 dark:tw-text-white tw-px-4 tw-py-3 tw-outline-none tw-group focus-visible:bg-violet-90',\n allowsSorting ? 'tw-cursor-pointer' : '',\n ])}\n data-test-id=\"table-column\"\n scope=\"col\"\n onClick={allowsSorting ? () => handleSortChange(column.key, sortDirection) : () => null}\n >\n <ButtonOrSpan\n className={merge([\n 'tw-flex tw-gap-x-1 tw-items-center',\n FOCUS_VISIBLE_STYLE,\n allowsSorting ? 'tw-cursor-pointer' : 'tw-cursor-default',\n ])}\n >\n {rendered}\n {allowsSorting && (\n <span\n aria-hidden=\"true\"\n className={\n isColumnSorted\n ? 'tw-text-violet-50'\n : 'tw-text-black-40 dark:tw-text-black-60 group-hover:tw-text-black-100 dark:group-hover:tw-text-white'\n }\n >\n {cloneElement(icon, { size: IconSize.Size12 })}\n </span>\n )}\n </ButtonOrSpan>\n </th>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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"}

package/dist/components/Tree/Node.es.js CHANGED Viewed

@@ -1,157 +1,168 @@
-import e, { useState as A } from "react";
-import { merge as i } from "../../utilities/merge.es.js";
+import e, { useState as H } from "react";
+import { merge as m } from "../../utilities/merge.es.js";
 import { useDrag as T } from "react-dnd";
 import { DropZone as N } from "../DropZone/DropZone.es.js";
 import "../../utilities/dnd/DndWrapper.es.js";
-import { DropZonePosition as h } from "../../utilities/dnd/types.es.js";
+import { DropZonePosition as E } from "../../utilities/dnd/types.es.js";
 import { EditableText as Z } from "../EditableText/EditableText.es.js";
 const z = ({
-  nodes: r,
-  activeIds: p,
-  treeId: n,
-  onClick: w,
-  onDrop: c,
-  onEditableSave: g,
-  parentIds: s
-}) => r.map((o, t) => /* @__PURE__ */ e.createElement(L, {
-  key: o.id,
-  node: o,
-  nodeIndex: t,
-  activeIds: p,
-  onClick: w,
-  isFirst: t === 0,
-  onDrop: c,
-  onEditableSave: g,
-  parentIds: s,
-  treeId: n
-})), L = ({
-  node: r,
-  strong: p = !1,
-  activeIds: n,
-  onClick: w,
-  parentIds: c = [],
-  isFirst: g,
+  nodes: t,
+  activeIds: d,
+  treeId: r,
+  onClick: n,
   onDrop: s,
-  onEditableSave: o,
-  treeId: t
+  onEditableSave: i,
+  parentIds: a
+}) => t.map((w, o) => /* @__PURE__ */ e.createElement(R, {
+  key: w.id,
+  node: w,
+  nodeIndex: o,
+  activeIds: d,
+  onClick: n,
+  isFirst: o === 0,
+  onDrop: s,
+  onEditableSave: i,
+  parentIds: a,
+  treeId: r
+})), L = (t, d) => {
+  const r = (n, s) => {
+    if (n.nodes && s) {
+      for (const i of n.nodes)
+        if (s.includes(i.id) || r(i, s))
+          return !0;
+    }
+    return !1;
+  };
+  return r(t, d);
+}, R = ({
+  node: t,
+  strong: d = !1,
+  activeIds: r,
+  onClick: n,
+  parentIds: s = [],
+  isFirst: i,
+  onDrop: a,
+  onEditableSave: w,
+  treeId: o
 }) => {
-  const { id: d, value: u, name: b, label: y, icon: v, nodes: x, actions: E, editable: k, badge: a } = r, [{ opacity: B }, P] = T({
-    item: { id: d, value: u, name: b, label: y, icon: v, nodes: x, actions: E, editable: k, badge: a },
-    collect: (m) => ({
-      opacity: m.isDragging() ? 0.4 : 1
+  const { id: f, value: g, name: b, label: y, icon: v, nodes: u, actions: h, editable: k, badge: l } = t, [{ opacity: V }, B] = T({
+    item: { id: f, value: g, name: b, label: y, icon: v, nodes: u, actions: h, editable: k, badge: l },
+    collect: (x) => ({
+      opacity: x.isDragging() ? 0.4 : 1
     }),
-    type: t,
-    canDrag: s !== void 0
-  }), [f, j] = A(!1), [V, F] = A(!1), l = n && n.length > 0 && n.includes(d), C = () => F(!0), D = () => F(!1), M = () => {
-    if (!u) {
-      j(!f);
+    type: o,
+    canDrag: a !== void 0
+  }), [p, j] = H(L(t, r)), [C, A] = H(!1), c = r && r.length > 0 && r.includes(f), P = () => A(!0), S = () => A(!1), D = () => {
+    if (!g) {
+      j(!p);
       return;
     }
-    w && w(d);
-  }, S = (m) => {
-    m.stopPropagation(), j(!f);
-  }, H = () => /* @__PURE__ */ e.createElement("div", {
+    n && n(f);
+  }, M = (x) => {
+    x.stopPropagation(), j(!p);
+  }, F = () => /* @__PURE__ */ e.createElement("div", {
     "data-test-id": "node-badge",
-    className: i([
+    className: m([
       "tw-flex tw-justify-center tw-items-center tw-ml-2 tw-text-text-weak",
-      (a == null ? void 0 : a.props.size) && "tw-w-8 tw-h-5 tw-bg-box-neutral tw-rounded-full"
+      (l == null ? void 0 : l.props.size) && "tw-w-8 tw-h-5 tw-bg-box-neutral tw-rounded-full"
     ])
-  }, a);
+  }, l);
   return /* @__PURE__ */ e.createElement("li", {
     "data-test-id": "node",
-    ref: P,
-    style: { opacity: B }
-  }, g && /* @__PURE__ */ e.createElement(N, {
+    ref: B,
+    style: { opacity: V }
+  }, i && /* @__PURE__ */ e.createElement(N, {
     data: {
-      targetItem: r,
-      position: h.Before
+      targetItem: t,
+      position: E.Before
     },
-    onDrop: s,
-    treeId: t
+    onDrop: a,
+    treeId: o
   }), /* @__PURE__ */ e.createElement(N, {
     data: {
-      targetItem: r,
-      position: h.Within
+      targetItem: t,
+      position: E.Within
     },
-    onDrop: s,
-    treeId: t
+    onDrop: a,
+    treeId: o
   }, /* @__PURE__ */ e.createElement("div", {
-    className: i([
+    className: m([
       "tw-flex tw-py-2 tw-px-2.5 tw-no-underline tw-leading-5",
-      p && "tw-font-bold",
-      u && !l && "tw-text-text hover:tw-bg-box-neutral-hover hover:tw-text-box-neutral-inverse-hover",
-      l && "tw-font-medium tw-bg-box-selected-strong tw-text-box-selected-strong-inverse hover:tw-bg-box-selected-strong-hover hover:tw-text-box-selected-strong-inverse-hover"
+      d && "tw-font-bold",
+      g && !c && "tw-text-text hover:tw-bg-box-neutral-hover hover:tw-text-box-neutral-inverse-hover",
+      c && "tw-font-medium tw-bg-box-selected-strong tw-text-box-selected-strong-inverse hover:tw-bg-box-selected-strong-hover hover:tw-text-box-selected-strong-inverse-hover"
     ]),
-    onMouseEnter: C,
-    onMouseLeave: D
+    onMouseEnter: P,
+    onMouseLeave: S
   }, /* @__PURE__ */ e.createElement("a", {
     "data-test-id": "node-link",
-    className: i([
+    className: m([
       "tw-flex tw-items-center tw-flex-grow tw-justify-between tw-cursor-pointer",
-      c.length === 1 && "tw-pl-4",
-      c.length > 1 && "tw-pl-8"
+      s.length === 1 && "tw-pl-4",
+      s.length > 1 && "tw-pl-8"
     ]),
-    "aria-selected": l,
-    onClick: M
+    "aria-selected": c,
+    onClick: D
   }, /* @__PURE__ */ e.createElement("div", {
     className: "tw-flex tw-space-x-1 tw-items-center"
   }, /* @__PURE__ */ e.createElement("span", {
     "data-test-id": "toggle",
     className: "tw-w-2 tw-h-3 tw-flex tw-items-center tw-justify-center",
-    onClick: S
-  }, x && /* @__PURE__ */ e.createElement("div", {
-    className: i([
+    onClick: M
+  }, u && /* @__PURE__ */ e.createElement("div", {
+    className: m([
       "tw-transition-transform tw-w-0 tw-h-0 tw-text-black-100 tw-text-opacity-40 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong",
-      f ? "tw-rotate-90" : "",
-      l && "tw-text-box-selected-strong-inverse"
+      p ? "tw-rotate-90" : "",
+      c && "tw-text-box-selected-strong-inverse"
     ])
   })), v && /* @__PURE__ */ e.createElement("span", {
     className: "tw-flex tw-justify-center tw-items-center tw-w-5"
-  }, v), k && o ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(Z, {
+  }, v), k && w ? /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(Z, {
     options: {
-      additionalValues: r.id,
+      additionalValues: t.id,
       enableDoubleClick: !0,
       isSlimInputField: !0,
       removeBoxPadding: !0
     },
-    onAdditionalValueSave: o
-  }, /* @__PURE__ */ e.createElement("p", null, b)), a && H()) : /* @__PURE__ */ e.createElement("span", {
+    onAdditionalValueSave: w
+  }, /* @__PURE__ */ e.createElement("p", null, b)), l && F()) : /* @__PURE__ */ e.createElement("span", {
     className: "tw-flex tw-items-center",
     "data-test-id": "node-link-name"
-  }, b, a && H())), /* @__PURE__ */ e.createElement("div", {
+  }, b, l && F())), /* @__PURE__ */ e.createElement("div", {
     className: "tw-px-1.5"
   }, /* @__PURE__ */ e.createElement("span", {
-    className: i([
+    "data-test-id": "node-label",
+    className: m([
       "tw-text-black-100 tw-text-opacity-40 tw-text-xs tw-font-normal",
-      l && "tw-text-box-selected-strong-inverse"
+      c && "tw-text-box-selected-strong-inverse"
     ])
-  }, y))), E && /* @__PURE__ */ e.createElement("div", {
-    className: i([
+  }, y))), h && /* @__PURE__ */ e.createElement("div", {
+    className: m([
       "tw-flex tw-items-center",
-      V || l ? "tw-visible tw-space-x-1.5" : "tw-invisible tw-w-0"
+      C || c ? "tw-visible tw-space-x-1.5" : "tw-invisible tw-w-0"
     ])
-  }, E.map((m) => m)))), x && f && /* @__PURE__ */ e.createElement("ul", {
+  }, h.map((x) => x)))), u && p && /* @__PURE__ */ e.createElement("ul", {
     className: "tw-p-0 tw-m-0 tw-font-sans tw-font-normal tw-list-none tw-text-left",
     "data-test-id": "sub-tree"
   }, z({
-    nodes: x,
-    treeId: t,
-    activeIds: n,
-    onClick: w,
-    onDrop: s,
-    onEditableSave: o,
-    parentIds: [...c, d]
+    nodes: u,
+    treeId: o,
+    activeIds: r,
+    onClick: n,
+    onDrop: a,
+    onEditableSave: w,
+    parentIds: [...s, f]
   })), /* @__PURE__ */ e.createElement(N, {
     data: {
-      targetItem: r,
-      position: h.After
+      targetItem: t,
+      position: E.After
     },
-    onDrop: s,
-    treeId: t
+    onDrop: a,
+    treeId: o
   }));
 };
 export {
-  L as Node,
+  R as Node,
   z as renderNodeArray
 };
 //# sourceMappingURL=Node.es.js.map

package/dist/components/Tree/Node.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Node.es.js","sources":["../../../src/components/Tree/Node.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport React, { ReactElement, useState } from 'react';\nimport { merge } from '@utilities/merge';\nimport { useDrag } from 'react-dnd';\nimport { DropZone, OnDropCallback } from '@components/DropZone';\nimport { TreeFlatListItem } from '@components/Tree';\nimport { DraggableItem, DropZonePosition } from '@utilities/dnd';\nimport { EditableText } from '../EditableText';\n\nexport type RenderNodeArrayData = Omit<NodeProps, 'isFirst' \| 'strong' \| 'node'> & {\n nodes: DraggableItem<TreeNodeItem>[];\n};\n\nexport const renderNodeArray = ({\n nodes,\n activeIds,\n treeId,\n onClick,\n onDrop,\n onEditableSave,\n parentIds,\n}: RenderNodeArrayData) =>\n nodes.map((node, i) => (\n <Node\n key={node.id}\n node={node}\n nodeIndex={i}\n activeIds={activeIds}\n onClick={onClick}\n isFirst={i === 0}\n onDrop={onDrop}\n onEditableSave={onEditableSave}\n parentIds={parentIds}\n treeId={treeId}\n />\n ));\n\nexport interface TreeNodeItem extends TreeFlatListItem {\n nodes?: DraggableItem<TreeNodeItem>[];\n}\n\ntype NodeProps = {\n node: DraggableItem<TreeNodeItem>;\n strong?: boolean;\n nodeIndex?: number;\n activeIds?: NullableString[];\n parentIds?: string[];\n onClick: (id: NullableString) => void;\n isFirst: boolean;\n treeId: string;\n onDrop?: OnDropCallback<TreeNodeItem>;\n onEditableSave?: (targetItemId: string, value: string) => void;\n};\n\nexport const Node = ({\n node,\n strong = false,\n activeIds,\n onClick,\n parentIds = [],\n isFirst,\n onDrop,\n onEditableSave,\n treeId,\n}: NodeProps): ReactElement<NodeProps> => {\n const { id, value, name, label, icon, nodes, actions, editable, badge } = node;\n const [{ opacity }, drag] = useDrag({\n item: { id, value, name, label, icon, nodes, actions, editable, badge },\n collect: (monitor) => ({\n opacity: monitor.isDragging() ? 0.4 : 1,\n }),\n type: treeId,\n canDrag: onDrop !== undefined,\n });\n const [showNodes, setShowNodes] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const selected = activeIds && activeIds.length > 0 && activeIds.includes(id);\n\n const setHoveredTrue = () => setIsHovered(true);\n const setHoveredFalse = () => setIsHovered(false);\n const onNodeClick = () => {\n if (!value) {\n setShowNodes(!showNodes);\n return;\n }\n\n if (onClick) {\n onClick(id);\n }\n };\n const toggleNodesVisibility = (event: React.MouseEvent) => {\n event.stopPropagation();\n setShowNodes(!showNodes);\n };\n\n const insertBadge = () => {\n return (\n <div\n data-test-id=\"node-badge\"\n className={merge([\n 'tw-flex tw-justify-center tw-items-center tw-ml-2 tw-text-text-weak',\n badge?.props.size && 'tw-w-8 tw-h-5 tw-bg-box-neutral tw-rounded-full',\n ])}\n >\n {badge}\n </div>\n );\n };\n\n / eslint-disable jsx-a11y/anchor-is-valid,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions /\n return (\n <li data-test-id=\"node\" ref={drag} style={{ opacity }}>\n {isFirst && (\n <DropZone\n data={{\n targetItem: node,\n position: DropZonePosition.Before,\n }}\n onDrop={onDrop}\n treeId={treeId}\n />\n )}\n <DropZone\n data={{\n targetItem: node,\n position: DropZonePosition.Within,\n }}\n onDrop={onDrop}\n treeId={treeId}\n >\n <div\n className={merge([\n 'tw-flex tw-py-2 tw-px-2.5 tw-no-underline tw-leading-5',\n strong && 'tw-font-bold',\n value &&\n !selected &&\n 'tw-text-text hover:tw-bg-box-neutral-hover hover:tw-text-box-neutral-inverse-hover',\n selected &&\n 'tw-font-medium tw-bg-box-selected-strong tw-text-box-selected-strong-inverse hover:tw-bg-box-selected-strong-hover hover:tw-text-box-selected-strong-inverse-hover',\n ])}\n onMouseEnter={setHoveredTrue}\n onMouseLeave={setHoveredFalse}\n >\n <a\n data-test-id=\"node-link\"\n className={merge([\n 'tw-flex tw-items-center tw-flex-grow tw-justify-between tw-cursor-pointer',\n parentIds.length === 1 && 'tw-pl-4',\n parentIds.length > 1 && 'tw-pl-8',\n ])}\n aria-selected={selected}\n onClick={onNodeClick}\n >\n <div className=\"tw-flex tw-space-x-1 tw-items-center\">\n <span\n data-test-id=\"toggle\"\n className=\"tw-w-2 tw-h-3 tw-flex tw-items-center tw-justify-center\"\n onClick={toggleNodesVisibility}\n >\n {nodes && (\n <div\n className={merge([\n 'tw-transition-transform tw-w-0 tw-h-0 tw-text-black-100 tw-text-opacity-40 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong',\n showNodes ? 'tw-rotate-90' : '',\n selected && 'tw-text-box-selected-strong-inverse',\n ])}\n ></div>\n )}\n </span>\n {icon && <span className=\"tw-flex tw-justify-center tw-items-center tw-w-5\">{icon}</span>}\n {editable && onEditableSave ? (\n <>\n <EditableText\n options={{\n additionalValues: node.id,\n enableDoubleClick: true,\n isSlimInputField: true,\n removeBoxPadding: true,\n }}\n onAdditionalValueSave={onEditableSave}\n >\n <p>{name}</p>\n </EditableText>\n {badge && insertBadge()}\n </>\n ) : (\n <span className=\"tw-flex tw-items-center\" data-test-id=\"node-link-name\">\n {name}\n {badge && insertBadge()}\n </span>\n )}\n </div>\n <div className=\"tw-px-1.5\">\n <span\n className={merge([\n 'tw-text-black-100 tw-text-opacity-40 tw-text-xs tw-font-normal',\n selected && 'tw-text-box-selected-strong-inverse',\n ])}\n >\n {label}\n </span>\n </div>\n </a>\n\n {actions && (\n <div\n className={merge([\n 'tw-flex tw-items-center',\n isHovered \|\| selected ? 'tw-visible tw-space-x-1.5' : 'tw-invisible tw-w-0',\n ])}\n >\n {actions.map((action) => action)}\n </div>\n )}\n </div>\n </DropZone>\n\n {nodes && showNodes && (\n <ul\n className=\"tw-p-0 tw-m-0 tw-font-sans tw-font-normal tw-list-none tw-text-left\"\n data-test-id=\"sub-tree\"\n >\n {renderNodeArray({\n nodes,\n treeId,\n activeIds,\n onClick,\n onDrop,\n onEditableSave,\n parentIds: [...parentIds, id],\n })}\n </ul>\n )}\n <DropZone\n data={{\n targetItem: node,\n position: DropZonePosition.After,\n }}\n onDrop={onDrop}\n treeId={treeId}\n />\n </li>\n );\n / eslint-enable jsx-a11y/anchor-is-valid,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */\n};\n"],"names":[],"mappings":";;;;;;;AAcO,MAAM,IAAkB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAEA,EAAM,IAAI,CAAC,GAAM,MACZ,kBAAA,cAAA,GAAA;AAAA,EACG,KAAK,EAAK;AAAA,EACV;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,SAAS,MAAM;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,CACJ,CACH,GAmBQ,IAAO,CAAC;AAAA,EACjB;AAAA,EACA,YAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA,eAAY,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACsC;AAChC,QAAA,EAAE,OAAI,UAAO,SAAM,UAAO,SAAM,UAAO,YAAS,aAAU,aAAU,GACpE,CAAC,EAAE,cAAW,KAAQ,EAAQ;AAAA,IAChC,MAAM,EAAE,OAAI,UAAO,SAAM,UAAO,SAAM,UAAO,YAAS,aAAU,SAAM;AAAA,IACtE,SAAS,CAAC,MAAa;AAAA,MACnB,SAAS,EAAQ,WAAW,IAAI,MAAM;AAAA,IAAA;AAAA,IAE1C,MAAM;AAAA,IACN,SAAS,MAAW;AAAA,EAAA,CACvB,GACK,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,IAAW,KAAa,EAAU,SAAS,KAAK,EAAU,SAAS,CAAE,GAErE,IAAiB,MAAM,EAAa,EAAI,GACxC,IAAkB,MAAM,EAAa,EAAK,GAC1C,IAAc,MAAM;AACtB,QAAI,CAAC,GAAO;AACR,QAAa,CAAC,CAAS;AACvB;AAAA,IACJ;AAEA,IAAI,KACA,EAAQ,CAAE;AAAA,EACd,GAEE,IAAwB,CAAC,MAA4B;AACvD,MAAM,gBAAgB,GACtB,EAAa,CAAC,CAAS;AAAA,EAAA,GAGrB,IAAc,MAEX,kBAAA,cAAA,OAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAW,EAAM;AAAA,MACb;AAAA,MACA,wBAAO,MAAM,SAAQ;AAAA,IAAA,CACxB;AAAA,EAAA,GAEA,CACL;AAKR,SACK,kBAAA,cAAA,MAAA;AAAA,IAAG,gBAAa;AAAA,IAAO,KAAK;AAAA,IAAM,OAAO,EAAE,WAAQ;AAAA,EAAA,GAC/C,KACI,kBAAA,cAAA,GAAA;AAAA,IACG,MAAM;AAAA,MACF,YAAY;AAAA,MACZ,UAAU,EAAiB;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACJ,GAEH,kBAAA,cAAA,GAAA;AAAA,IACG,MAAM;AAAA,MACF,YAAY;AAAA,MACZ,UAAU,EAAiB;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEC,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAU;AAAA,MACV,KACI,CAAC,KACD;AAAA,MACJ,KACI;AAAA,IAAA,CACP;AAAA,IACD,cAAc;AAAA,IACd,cAAc;AAAA,EAAA,GAEb,kBAAA,cAAA,KAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAW,EAAM;AAAA,MACb;AAAA,MACA,EAAU,WAAW,KAAK;AAAA,MAC1B,EAAU,SAAS,KAAK;AAAA,IAAA,CAC3B;AAAA,IACD,iBAAe;AAAA,IACf,SAAS;AAAA,EAAA,GAER,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,kBAAA,cAAA,QAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAU;AAAA,IACV,SAAS;AAAA,EAAA,GAER,KACI,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,IAAY,iBAAiB;AAAA,MAC7B,KAAY;AAAA,IAAA,CACf;AAAA,EACJ,CAAA,CAET,GACC,KAAS,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,EAAA,GAAoD,CAAK,GACjF,KAAY,sDAEJ,kBAAA,cAAA,GAAA;AAAA,IACG,SAAS;AAAA,MACL,kBAAkB,EAAK;AAAA,MACvB,mBAAmB;AAAA,MACnB,kBAAkB;AAAA,MAClB,kBAAkB;AAAA,IACtB;AAAA,IACA,uBAAuB;AAAA,EAEvB,GAAA,kBAAA,cAAC,WAAG,CAAK,CACb,GACC,KAAS,EAAA,CACd,IAEC,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,IAA0B,gBAAa;AAAA,EAAA,GAClD,GACA,KAAS,EAAA,CACd,CAER,GACC,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,kBAAA,cAAA,QAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAY;AAAA,IAAA,CACf;AAAA,EAAA,GAEA,CACL,CACJ,CACJ,GAEC,KACI,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAa,IAAW,8BAA8B;AAAA,IAAA,CACzD;AAAA,EAEA,GAAA,EAAQ,IAAI,CAAC,MAAW,CAAM,CACnC,CAER,CACJ,GAEC,KAAS,KACL,kBAAA,cAAA,MAAA;AAAA,IACG,WAAU;AAAA,IACV,gBAAa;AAAA,EAAA,GAEZ,EAAgB;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,CAAC,GAAG,GAAW,CAAE;AAAA,EAC/B,CAAA,CACL,GAEH,kBAAA,cAAA,GAAA;AAAA,IACG,MAAM;AAAA,MACF,YAAY;AAAA,MACZ,UAAU,EAAiB;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,EACJ,CAAA,CACJ;AAGR;"}
1	+ {"version":3,"file":"Node.es.js","sources":["../../../src/components/Tree/Node.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport React, { ReactElement, useState } from 'react';\nimport { merge } from '@utilities/merge';\nimport { useDrag } from 'react-dnd';\nimport { DropZone, OnDropCallback } from '@components/DropZone';\nimport { TreeFlatListItem } from '@components/Tree';\nimport { DraggableItem, DropZonePosition } from '@utilities/dnd';\nimport { EditableText } from '../EditableText';\n\nexport type RenderNodeArrayData = Omit<NodeProps, 'isFirst' \| 'strong' \| 'node'> & {\n nodes: DraggableItem<TreeNodeItem>[];\n};\n\nexport const renderNodeArray = ({\n nodes,\n activeIds,\n treeId,\n onClick,\n onDrop,\n onEditableSave,\n parentIds,\n}: RenderNodeArrayData) =>\n nodes.map((node, i) => (\n <Node\n key={node.id}\n node={node}\n nodeIndex={i}\n activeIds={activeIds}\n onClick={onClick}\n isFirst={i === 0}\n onDrop={onDrop}\n onEditableSave={onEditableSave}\n parentIds={parentIds}\n treeId={treeId}\n />\n ));\n\nexport interface TreeNodeItem extends TreeFlatListItem {\n nodes?: DraggableItem<TreeNodeItem>[];\n}\n\ntype NodeProps = {\n node: DraggableItem<TreeNodeItem>;\n strong?: boolean;\n nodeIndex?: number;\n activeIds?: NullableString[];\n parentIds?: string[];\n onClick: (id: NullableString) => void;\n isFirst: boolean;\n treeId: string;\n onDrop?: OnDropCallback<TreeNodeItem>;\n onEditableSave?: (targetItemId: string, value: string) => void;\n};\n\nconst getInitialShowNodesValue = (\n currentNode: DraggableItem<TreeNodeItem>,\n activeNodeIds?: NullableString[],\n): boolean => {\n const hasActiveChildNodes = (node: DraggableItem<TreeNodeItem>, activeIds?: NullableString[]): boolean => {\n if (node.nodes && activeIds) {\n for (const childNode of node.nodes) {\n if (activeIds.includes(childNode.id) \|\| hasActiveChildNodes(childNode, activeIds)) {\n return true;\n }\n }\n }\n return false;\n };\n\n return hasActiveChildNodes(currentNode, activeNodeIds);\n};\n\nexport const Node = ({\n node,\n strong = false,\n activeIds,\n onClick,\n parentIds = [],\n isFirst,\n onDrop,\n onEditableSave,\n treeId,\n}: NodeProps): ReactElement<NodeProps> => {\n const { id, value, name, label, icon, nodes, actions, editable, badge } = node;\n const [{ opacity }, drag] = useDrag({\n item: { id, value, name, label, icon, nodes, actions, editable, badge },\n collect: (monitor) => ({\n opacity: monitor.isDragging() ? 0.4 : 1,\n }),\n type: treeId,\n canDrag: onDrop !== undefined,\n });\n const [showNodes, setShowNodes] = useState(getInitialShowNodesValue(node, activeIds));\n const [isHovered, setIsHovered] = useState(false);\n const selected = activeIds && activeIds.length > 0 && activeIds.includes(id);\n\n const setHoveredTrue = () => setIsHovered(true);\n const setHoveredFalse = () => setIsHovered(false);\n const onNodeClick = () => {\n if (!value) {\n setShowNodes(!showNodes);\n return;\n }\n\n if (onClick) {\n onClick(id);\n }\n };\n const toggleNodesVisibility = (event: React.MouseEvent) => {\n event.stopPropagation();\n setShowNodes(!showNodes);\n };\n\n const insertBadge = () => {\n return (\n <div\n data-test-id=\"node-badge\"\n className={merge([\n 'tw-flex tw-justify-center tw-items-center tw-ml-2 tw-text-text-weak',\n badge?.props.size && 'tw-w-8 tw-h-5 tw-bg-box-neutral tw-rounded-full',\n ])}\n >\n {badge}\n </div>\n );\n };\n\n / eslint-disable jsx-a11y/anchor-is-valid,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions /\n return (\n <li data-test-id=\"node\" ref={drag} style={{ opacity }}>\n {isFirst && (\n <DropZone\n data={{\n targetItem: node,\n position: DropZonePosition.Before,\n }}\n onDrop={onDrop}\n treeId={treeId}\n />\n )}\n <DropZone\n data={{\n targetItem: node,\n position: DropZonePosition.Within,\n }}\n onDrop={onDrop}\n treeId={treeId}\n >\n <div\n className={merge([\n 'tw-flex tw-py-2 tw-px-2.5 tw-no-underline tw-leading-5',\n strong && 'tw-font-bold',\n value &&\n !selected &&\n 'tw-text-text hover:tw-bg-box-neutral-hover hover:tw-text-box-neutral-inverse-hover',\n selected &&\n 'tw-font-medium tw-bg-box-selected-strong tw-text-box-selected-strong-inverse hover:tw-bg-box-selected-strong-hover hover:tw-text-box-selected-strong-inverse-hover',\n ])}\n onMouseEnter={setHoveredTrue}\n onMouseLeave={setHoveredFalse}\n >\n <a\n data-test-id=\"node-link\"\n className={merge([\n 'tw-flex tw-items-center tw-flex-grow tw-justify-between tw-cursor-pointer',\n parentIds.length === 1 && 'tw-pl-4',\n parentIds.length > 1 && 'tw-pl-8',\n ])}\n aria-selected={selected}\n onClick={onNodeClick}\n >\n <div className=\"tw-flex tw-space-x-1 tw-items-center\">\n <span\n data-test-id=\"toggle\"\n className=\"tw-w-2 tw-h-3 tw-flex tw-items-center tw-justify-center\"\n onClick={toggleNodesVisibility}\n >\n {nodes && (\n <div\n className={merge([\n 'tw-transition-transform tw-w-0 tw-h-0 tw-text-black-100 tw-text-opacity-40 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong',\n showNodes ? 'tw-rotate-90' : '',\n selected && 'tw-text-box-selected-strong-inverse',\n ])}\n ></div>\n )}\n </span>\n {icon && <span className=\"tw-flex tw-justify-center tw-items-center tw-w-5\">{icon}</span>}\n {editable && onEditableSave ? (\n <>\n <EditableText\n options={{\n additionalValues: node.id,\n enableDoubleClick: true,\n isSlimInputField: true,\n removeBoxPadding: true,\n }}\n onAdditionalValueSave={onEditableSave}\n >\n <p>{name}</p>\n </EditableText>\n {badge && insertBadge()}\n </>\n ) : (\n <span className=\"tw-flex tw-items-center\" data-test-id=\"node-link-name\">\n {name}\n {badge && insertBadge()}\n </span>\n )}\n </div>\n <div className=\"tw-px-1.5\">\n <span\n data-test-id=\"node-label\"\n className={merge([\n 'tw-text-black-100 tw-text-opacity-40 tw-text-xs tw-font-normal',\n selected && 'tw-text-box-selected-strong-inverse',\n ])}\n >\n {label}\n </span>\n </div>\n </a>\n\n {actions && (\n <div\n className={merge([\n 'tw-flex tw-items-center',\n isHovered \|\| selected ? 'tw-visible tw-space-x-1.5' : 'tw-invisible tw-w-0',\n ])}\n >\n {actions.map((action) => action)}\n </div>\n )}\n </div>\n </DropZone>\n\n {nodes && showNodes && (\n <ul\n className=\"tw-p-0 tw-m-0 tw-font-sans tw-font-normal tw-list-none tw-text-left\"\n data-test-id=\"sub-tree\"\n >\n {renderNodeArray({\n nodes,\n treeId,\n activeIds,\n onClick,\n onDrop,\n onEditableSave,\n parentIds: [...parentIds, id],\n })}\n </ul>\n )}\n <DropZone\n data={{\n targetItem: node,\n position: DropZonePosition.After,\n }}\n onDrop={onDrop}\n treeId={treeId}\n />\n </li>\n );\n / eslint-enable jsx-a11y/anchor-is-valid,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */\n};\n"],"names":[],"mappings":"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"}

package/dist/components/Tree/utils/mocks.es.js CHANGED Viewed

@@ -1693,6 +1693,15 @@ import "react-dnd-html5-backend";
 import "@udecode/plate";
 import "../../RichTextEditor/context/RichTextEditorContext.es.js";
 import "../../RichTextEditor/EditorActions/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/textStyles.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom1Plugin/createCustom1Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom2Plugin/createCustom2Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Custom3Plugin/createCustom3Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading1Plugin/createHeading1Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading2Plugin/createHeading2Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading3Plugin/createHeading3Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Heading4Plugin/createHeading4Plugin.es.js";
+import "../../RichTextEditor/EditorActions/Plugins/TextStylePlugin/TextStyles/Quote/createQuotePlugin.es.js";
 import "../../RichTextEditor/EditorActions/Plugins/CheckboxListPlugin/index.es.js";
 import "slate-react";
 import "../../RichTextEditor/EditorActions/Plugins/LinkPlugin/index.es.js";

package/dist/components/Tree/utils/mocks.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mocks.es.js","sources":["../../../../src/components/Tree/utils/mocks.tsx"],"sourcesContent":["import { MenuItemContentSize } from '@components/MenuItem';\nimport { IconDocument, IconFaceExtraHappy, IconFolder, IconPlus, IconSize } from '@foundation/Icon';\nimport React from 'react';\nimport { TreeFlatListItem, TreeNodeItem } from '@components/Tree';\nimport { DraggableItem } from '@utilities/dnd';\nimport { Badge } from '../../..';\nimport { Button, ButtonSize } from '@components/Button';\n\nexport const mockActionMenuBlocks = [\n {\n id: 'dropdownBlock',\n ariaLabel: 'Dropdown block',\n menuItems: [\n {\n id: 'dropdown',\n size: MenuItemContentSize.Small,\n title: 'Dropdown',\n onClick: () => console.log('dropdown'),\n },\n ],\n },\n {\n id: 'actionsBlock',\n ariaLabel: 'Item Actions',\n menuItems: [\n {\n id: 'rename',\n size: MenuItemContentSize.Small,\n title: 'Rename',\n onClick: () => console.log('rename'),\n },\n {\n id: 'duplicate',\n size: MenuItemContentSize.Small,\n title: 'Duplicate',\n onClick: () => console.log('duplicate'),\n },\n {\n id: 'unpublish',\n size: MenuItemContentSize.Small,\n title: 'Unpublish',\n onClick: () => console.log('unpublish'),\n },\n ],\n },\n {\n id: 'deleteBlock',\n ariaLabel: 'Delete Block',\n menuItems: [\n {\n id: 'delete',\n size: MenuItemContentSize.Small,\n title: 'Delete',\n onClick: () => console.log('delete'),\n },\n ],\n },\n];\n\nconst uncategorizedPagesNodes = [\n {\n id: '1-1-1',\n parentId: '1-1',\n sort: 1,\n name: 'Home',\n label: 'Page',\n value: 'https://weare.frontify.com/page/1',\n icon: <IconDocument size={IconSize.Size16} />,\n },\n {\n id: '1-1-2',\n parentId: '1-1',\n name: 'Members',\n label: 'Page',\n value: 'https://weare.frontify.com/page/2',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n },\n {\n id: '1-1-3',\n parentId: '1-1',\n name: 'About us',\n label: 'Page',\n value: 'https://weare.frontify.com/page/3',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n editable: true,\n },\n];\n\nconst testCategoryNodes = [\n {\n id: '1-2-1',\n parentId: '1-2',\n name: 'Home Category',\n label: 'Home Page',\n value: 'https://weare.frontify.com/page/4',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n badge: <Badge icon={<IconFaceExtraHappy size={IconSize.Size16} />}></Badge>,\n editable: true,\n },\n {\n id: '1-2-2',\n parentId: '1-2',\n name: 'Members Category',\n label: 'Members Page',\n value: 'https://weare.frontify.com/page/5',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n },\n {\n id: '1-2-3',\n parentId: '1-2',\n name: 'About us Category',\n label: 'About Us Page',\n value: 'https://weare.frontify.com/page/6',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n badge: <Badge>Hello, I am a badge</Badge>,\n },\n];\n\ntype mockNodeType = () => DraggableItem<TreeFlatListItem>[];\n\nexport const mockNodesFlat: mockNodeType = () => [\n {\n id: '1',\n name: 'Design System Testing',\n label: 'Document',\n value: 'https://weare.frontify.com/document/1',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [<Button key={'Design System Testing'} size={ButtonSize.Small} icon={<IconPlus></IconPlus>} />],\n parentId: null,\n sort: 1,\n editable: true,\n },\n {\n id: '1-1',\n name: 'Uncategorizes Pages',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [\n <Button\n key={'Design System Testing Uncategorizes Pages'}\n size={ButtonSize.Small}\n icon={<IconPlus></IconPlus>}\n />,\n ],\n parentId: '1',\n sort: 1,\n },\n ...uncategorizedPagesNodes,\n {\n id: '1-2',\n parentId: '1',\n name: 'Test Category',\n label: 'Document',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [\n <Button\n key={'Design System Testing Uncategorizes Pages Test'}\n size={ButtonSize.Small}\n icon={<IconPlus></IconPlus>}\n />,\n ],\n value: 'https://weare.frontify.com/document/923#/test',\n sort: null,\n badge: <IconFaceExtraHappy size={IconSize.Size16} />,\n },\n ...testCategoryNodes,\n {\n id: '1-3',\n name: 'Category Without Subitems',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [\n <Button\n key={'Design System Testing Uncategorizes Pages Test Subitems'}\n size={ButtonSize.Small}\n icon={<IconPlus></IconPlus>}\n />,\n ],\n parentId: '1',\n value: 'https://weare.frontify.com/document/923#/test',\n sort: null,\n },\n];\n\nexport const mockNodesTree: DraggableItem<TreeNodeItem>[] = [\n {\n id: '1',\n name: 'Design System Testing',\n label: 'Document',\n value: 'https://weare.frontify.com/document/1',\n icon: <IconFolder size={IconSize.Size16} />,\n parentId: null,\n sort: 1,\n nodes: [\n {\n id: '1-1',\n name: 'Uncategorizes Pages',\n icon: <IconFolder size={IconSize.Size16} />,\n parentId: '1',\n sort: 1,\n nodes: [...uncategorizedPagesNodes],\n },\n {\n id: '1-2',\n parentId: '1',\n name: 'Test Category',\n label: 'Document',\n icon: <IconFolder size={IconSize.Size16} />,\n value: 'https://weare.frontify.com/document/923#/test',\n sort: null,\n nodes: [...testCategoryNodes],\n },\n ],\n },\n];\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQoC,AAOd,EAAoB,OAYpB,EAAoB,OAMpB,EAAoB,OAMpB,EAAoB,OAYpB,EAAoB;AAQ1C,MAAM,IAA0B;AAAA,EAC5B;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,EAC/C;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,IACN,UAAU;AAAA,EACd;AACJ,GAEM,IAAoB;AAAA,EACtB;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,IACN,OAAQ,kBAAA,cAAA,GAAA;AAAA,MAAM,MAAO,kBAAA,cAAA,GAAA;AAAA,QAAmB,MAAM,EAAS;AAAA,MAAA,CAAQ;AAAA,IAAA,CAAI;AAAA,IACnE,UAAU;AAAA,EACd;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,IACN,OAAQ,kBAAA,cAAA,GAAA,MAAM,qBAAmB;AAAA,EACrC;AACJ;AAkE4D,AAM7C,GAAiB,EAAS,QAOlB,GAAiB,EAAS,QAG1B,CAAC,GAAG,CAAuB,GAO3B,GAAiB,EAAS,QAG1B,CAAC,GAAG,CAAiB;"}
1	+ {"version":3,"file":"mocks.es.js","sources":["../../../../src/components/Tree/utils/mocks.tsx"],"sourcesContent":["import { MenuItemContentSize } from '@components/MenuItem';\nimport { IconDocument, IconFaceExtraHappy, IconFolder, IconPlus, IconSize } from '@foundation/Icon';\nimport React from 'react';\nimport { TreeFlatListItem, TreeNodeItem } from '@components/Tree';\nimport { DraggableItem } from '@utilities/dnd';\nimport { Badge } from '../../..';\nimport { Button, ButtonSize } from '@components/Button';\n\nexport const mockActionMenuBlocks = [\n {\n id: 'dropdownBlock',\n ariaLabel: 'Dropdown block',\n menuItems: [\n {\n id: 'dropdown',\n size: MenuItemContentSize.Small,\n title: 'Dropdown',\n onClick: () => console.log('dropdown'),\n },\n ],\n },\n {\n id: 'actionsBlock',\n ariaLabel: 'Item Actions',\n menuItems: [\n {\n id: 'rename',\n size: MenuItemContentSize.Small,\n title: 'Rename',\n onClick: () => console.log('rename'),\n },\n {\n id: 'duplicate',\n size: MenuItemContentSize.Small,\n title: 'Duplicate',\n onClick: () => console.log('duplicate'),\n },\n {\n id: 'unpublish',\n size: MenuItemContentSize.Small,\n title: 'Unpublish',\n onClick: () => console.log('unpublish'),\n },\n ],\n },\n {\n id: 'deleteBlock',\n ariaLabel: 'Delete Block',\n menuItems: [\n {\n id: 'delete',\n size: MenuItemContentSize.Small,\n title: 'Delete',\n onClick: () => console.log('delete'),\n },\n ],\n },\n];\n\nconst uncategorizedPagesNodes = [\n {\n id: '1-1-1',\n parentId: '1-1',\n sort: 1,\n name: 'Home',\n label: 'Page',\n value: 'https://weare.frontify.com/page/1',\n icon: <IconDocument size={IconSize.Size16} />,\n },\n {\n id: '1-1-2',\n parentId: '1-1',\n name: 'Members',\n label: 'Page',\n value: 'https://weare.frontify.com/page/2',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n },\n {\n id: '1-1-3',\n parentId: '1-1',\n name: 'About us',\n label: 'Page',\n value: 'https://weare.frontify.com/page/3',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n editable: true,\n },\n];\n\nconst testCategoryNodes = [\n {\n id: '1-2-1',\n parentId: '1-2',\n name: 'Home Category',\n label: 'Home Page',\n value: 'https://weare.frontify.com/page/4',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n badge: <Badge icon={<IconFaceExtraHappy size={IconSize.Size16} />}></Badge>,\n editable: true,\n },\n {\n id: '1-2-2',\n parentId: '1-2',\n name: 'Members Category',\n label: 'Members Page',\n value: 'https://weare.frontify.com/page/5',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n },\n {\n id: '1-2-3',\n parentId: '1-2',\n name: 'About us Category',\n label: 'About Us Page',\n value: 'https://weare.frontify.com/page/6',\n icon: <IconDocument size={IconSize.Size16} />,\n sort: null,\n badge: <Badge>Hello, I am a badge</Badge>,\n },\n];\n\ntype mockNodeType = () => DraggableItem<TreeFlatListItem>[];\n\nexport const mockNodesFlat: mockNodeType = () => [\n {\n id: '1',\n name: 'Design System Testing',\n label: 'Document',\n value: 'https://weare.frontify.com/document/1',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [<Button key={'Design System Testing'} size={ButtonSize.Small} icon={<IconPlus></IconPlus>} />],\n parentId: null,\n sort: 1,\n editable: true,\n },\n {\n id: '1-1',\n name: 'Uncategorizes Pages',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [\n <Button\n key={'Design System Testing Uncategorizes Pages'}\n size={ButtonSize.Small}\n icon={<IconPlus></IconPlus>}\n />,\n ],\n parentId: '1',\n sort: 1,\n },\n ...uncategorizedPagesNodes,\n {\n id: '1-2',\n parentId: '1',\n name: 'Test Category',\n label: 'Document',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [\n <Button\n key={'Design System Testing Uncategorizes Pages Test'}\n size={ButtonSize.Small}\n icon={<IconPlus></IconPlus>}\n />,\n ],\n value: 'https://weare.frontify.com/document/923#/test',\n sort: null,\n badge: <IconFaceExtraHappy size={IconSize.Size16} />,\n },\n ...testCategoryNodes,\n {\n id: '1-3',\n name: 'Category Without Subitems',\n icon: <IconFolder size={IconSize.Size16} />,\n actions: [\n <Button\n key={'Design System Testing Uncategorizes Pages Test Subitems'}\n size={ButtonSize.Small}\n icon={<IconPlus></IconPlus>}\n />,\n ],\n parentId: '1',\n value: 'https://weare.frontify.com/document/923#/test',\n sort: null,\n },\n];\n\nexport const mockNodesTree: DraggableItem<TreeNodeItem>[] = [\n {\n id: '1',\n name: 'Design System Testing',\n label: 'Document',\n value: 'https://weare.frontify.com/document/1',\n icon: <IconFolder size={IconSize.Size16} />,\n parentId: null,\n sort: 1,\n nodes: [\n {\n id: '1-1',\n name: 'Uncategorizes Pages',\n icon: <IconFolder size={IconSize.Size16} />,\n parentId: '1',\n sort: 1,\n nodes: [...uncategorizedPagesNodes],\n },\n {\n id: '1-2',\n parentId: '1',\n name: 'Test Category',\n label: 'Document',\n icon: <IconFolder size={IconSize.Size16} />,\n value: 'https://weare.frontify.com/document/923#/test',\n sort: null,\n nodes: [...testCategoryNodes],\n },\n ],\n },\n];\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQoC,AAOd,EAAoB,OAYpB,EAAoB,OAMpB,EAAoB,OAMpB,EAAoB,OAYpB,EAAoB;AAQ1C,MAAM,IAA0B;AAAA,EAC5B;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,EAC/C;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,IACN,UAAU;AAAA,EACd;AACJ,GAEM,IAAoB;AAAA,EACtB;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,IACN,OAAQ,kBAAA,cAAA,GAAA;AAAA,MAAM,MAAO,kBAAA,cAAA,GAAA;AAAA,QAAmB,MAAM,EAAS;AAAA,MAAA,CAAQ;AAAA,IAAA,CAAI;AAAA,IACnE,UAAU;AAAA,EACd;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,IAAI;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAO,kBAAA,cAAA,GAAA;AAAA,MAAa,MAAM,EAAS;AAAA,IAAA,CAAQ;AAAA,IAC3C,MAAM;AAAA,IACN,OAAQ,kBAAA,cAAA,GAAA,MAAM,qBAAmB;AAAA,EACrC;AACJ;AAkE4D,AAM7C,GAAiB,EAAS,QAOlB,GAAiB,EAAS,QAG1B,CAAC,GAAG,CAAuB,GAO3B,GAAiB,EAAS,QAG1B,CAAC,GAAG,CAAiB;"}