@pega/cosmos-react-core 8.1.0 → 8.2.1
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/lib/components/MetaList/MetaList.d.ts.map +1 -1
- package/lib/components/MetaList/MetaList.js +4 -0
- package/lib/components/MetaList/MetaList.js.map +1 -1
- package/lib/components/PageTemplates/GridLayout/EditorGridItem.d.ts.map +1 -1
- package/lib/components/PageTemplates/GridLayout/EditorGridItem.js +5 -1
- package/lib/components/PageTemplates/GridLayout/EditorGridItem.js.map +1 -1
- package/lib/components/Tree/StandardTree.d.ts.map +1 -1
- package/lib/components/Tree/StandardTree.js +11 -6
- package/lib/components/Tree/StandardTree.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetaList.d.ts","sourceRoot":"","sources":["../../../src/components/MetaList/MetaList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAmB,MAAM,OAAO,CAAC;AAK7D,OAAO,KAAK,EACV,SAAS,EACT,+BAA+B,EAC/B,cAAc,EACd,UAAU,EACX,MAAM,aAAa,CAAC;AAMrB,MAAM,WAAW,aAAc,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAC1E,yDAAyD;IACzD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc;eAA0B,OAAO;
|
|
1
|
+
{"version":3,"file":"MetaList.d.ts","sourceRoot":"","sources":["../../../src/components/MetaList/MetaList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAmB,MAAM,OAAO,CAAC;AAK7D,OAAO,KAAK,EACV,SAAS,EACT,+BAA+B,EAC/B,cAAc,EACd,UAAU,EACX,MAAM,aAAa,CAAC;AAMrB,MAAM,WAAW,aAAc,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAC1E,yDAAyD;IACzD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc;eAA0B,OAAO;SAc1D,CAAC;AAEH,eAAO,MAAM,kBAAkB;eAA0B,OAAO;SAoB9D,CAAC;;;;AAgDH,wBAAyD"}
|
|
@@ -11,6 +11,10 @@ export const StyledMetaList = styled.ul(({ wrapItems }) => {
|
|
|
11
11
|
list-style: none;
|
|
12
12
|
overflow: hidden;
|
|
13
13
|
|
|
14
|
+
/* Negative margin to account for overflow clipping of focus indicator */
|
|
15
|
+
padding: 0.3rem;
|
|
16
|
+
margin: -0.3rem;
|
|
17
|
+
|
|
14
18
|
${!wrapItems &&
|
|
15
19
|
css `
|
|
16
20
|
white-space: nowrap;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetaList.js","sourceRoot":"","sources":["../../../src/components/MetaList/MetaList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAO3B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAczD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,EAAE,CAAyB,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE;IAChF,OAAO,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"MetaList.js","sourceRoot":"","sources":["../../../src/components/MetaList/MetaList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAO3B,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAczD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,EAAE,CAAyB,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE;IAChF,OAAO,GAAG,CAAA;;;;;;;;MAQN,CAAC,SAAS;QACZ,GAAG,CAAA;;KAEF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,EAAE,CAAyB,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE;IACpF,OAAO,GAAG,CAAA;;;;MAIN,SAAS;QACT,CAAC,CAAC,GAAG,CAAA;;SAEF;QACH,CAAC,CAAC,GAAG,CAAA;;;;SAIF;;;;;;GAMN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAmD,UAAU,CAAC,SAAS,QAAQ,CAC3F,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,GAAG,IAAI,EAAE,GAAG,SAAS,EAAkC,EACjF,GAAyB;IAEzB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAEvD,OAAO,CACL,KAAC,IAAI,mBACU,OAAO,CAAC,IAAI,KACrB,SAAS,EACb,EAAE,EAAE,cAAc,EAClB,SAAS,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,EAAE,EACrF,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,GAAG,YAEP,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,CAC9B,IAAI;YACF,CAAC,CAAC;gBACE,KAAC,IAAI,IACH,EAAE,EAAE,kBAAkB,EAEtB,OAAO,EAAC,WAAW,EACnB,SAAS,EAAE,SAAS,YAEnB,IAAI,IAJA,GAAG,CAAC,GAAG,CAAC,EAAE,CAKV;aACR,CAAC,MAAM,CACN,CAAC,KAAK,GAAG,CAAC,MAAM,GAAG,CAAC;gBAClB,CAAC,CAAC;oBACE,KAAC,IAAI,IACH,EAAE,EAAE,kBAAkB,uBAGtB,OAAO,EAAC,WAAW,wBADd,GAAG,CAAC,GAAG,CAAC,MAAM,CAId;iBACR;gBACH,CAAC,CAAC,EAAE,CACP;YACH,CAAC,CAAC,EAAE,CACP,GACI,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { ReactNode, Ref, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Text from '../Text';\nimport Flex from '../Flex';\nimport type {\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n TestIdProp\n} from '../../types';\nimport { useTestIds } from '../../hooks';\nimport { withTestIds } from '../../utils';\n\nimport { getMetaListTestIds } from './MetaList.test-ids';\n\nexport interface MetaListProps extends BaseProps, NoChildrenProp, TestIdProp {\n /** Array of nodes or text to be rendered in the list. */\n items: ReactNode[];\n /**\n * If true, MetaList items that extend past the MetaList's container will wrap to a new line.\n * @default true\n */\n wrapItems?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLUListElement>;\n}\n\nexport const StyledMetaList = styled.ul<{ wrapItems: boolean }>(({ wrapItems }) => {\n return css`\n list-style: none;\n overflow: hidden;\n\n /* Negative margin to account for overflow clipping of focus indicator */\n padding: 0.3rem;\n margin: -0.3rem;\n\n ${!wrapItems &&\n css`\n white-space: nowrap;\n `}\n `;\n});\n\nexport const StyledMetaListItem = styled.li<{ wrapItems: boolean }>(({ wrapItems }) => {\n return css`\n min-width: 0;\n display: inline-block;\n\n ${wrapItems\n ? css`\n overflow-wrap: break-word;\n `\n : css`\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n `}\n\n &[role='separator'] {\n -webkit-user-select: none;\n user-select: none;\n }\n `;\n});\n\nconst MetaList: ForwardRefForwardPropsComponent<MetaListProps> = forwardRef(function MetaList(\n { testId, items, wrapItems = true, ...restProps }: PropsWithoutRef<MetaListProps>,\n ref: MetaListProps['ref']\n) {\n const testIds = useTestIds(testId, getMetaListTestIds);\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n as={StyledMetaList}\n container={{ colGap: 0.5, alignItems: 'center', wrap: wrapItems ? 'wrap' : 'nowrap' }}\n wrapItems={wrapItems}\n ref={ref}\n >\n {items.flatMap((item, i, arr) =>\n item\n ? [\n <Text\n as={StyledMetaListItem}\n key={`${i + 0}`}\n variant='secondary'\n wrapItems={wrapItems}\n >\n {item}\n </Text>\n ].concat(\n i !== arr.length - 1\n ? [\n <Text\n as={StyledMetaListItem}\n aria-hidden\n key={`${i + 0}-sep`}\n variant='secondary'\n >\n •\n </Text>\n ]\n : []\n )\n : []\n )}\n </Flex>\n );\n});\n\nexport default withTestIds(MetaList, getMetaListTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditorGridItem.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,YAAY,EAAyB,MAAM,OAAO,CAAC;AAKjG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAMnD,mDAAmD;AACnD,eAAO,MAAM,qBAAqB,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"EditorGridItem.d.ts","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkC,KAAK,YAAY,EAAyB,MAAM,OAAO,CAAC;AAKjG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAMnD,mDAAmD;AACnD,eAAO,MAAM,qBAAqB,iCAAiC,CAAC;AA8IpE,gDAAgD;AAChD,eAAO,MAAM,YAAY,sGAKvB,CAAC;AAEH,UAAU,mBAAoB,SAAQ,YAAY;IAChD,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7E,qBAAqB,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3F;AAED;;;GAGG;AACH,QAAA,MAAM,cAAc,6HAqEnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -9,7 +9,7 @@ import { hasNonNullProp } from './utils';
|
|
|
9
9
|
export const resizeHandleClassName = 'gridLayoutCustomResizeHandle';
|
|
10
10
|
// To appear above the child contents at all times
|
|
11
11
|
const StyledWrapper = styled(Flex)(({ theme }) => {
|
|
12
|
-
const { base } = theme;
|
|
12
|
+
const { base, components } = theme;
|
|
13
13
|
return css `
|
|
14
14
|
position: relative;
|
|
15
15
|
|
|
@@ -33,6 +33,10 @@ const StyledWrapper = styled(Flex)(({ theme }) => {
|
|
|
33
33
|
&:hover {
|
|
34
34
|
&::after {
|
|
35
35
|
border: 0.125rem solid ${base.palette.interactive};
|
|
36
|
+
|
|
37
|
+
/* For widgets where the interactive border might not be visible */
|
|
38
|
+
outline: 0.125rem solid ${components.card.background};
|
|
39
|
+
outline-offset: -0.25rem;
|
|
36
40
|
}
|
|
37
41
|
.${resizeHandleClassName} {
|
|
38
42
|
opacity: 1;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditorGridItem.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, type KeyboardEvent, type ReactElement, type Ref, useCallback } from 'react';\nimport type { CoreProps } from 'react-grid-layout';\nimport styled, { css, type FlattenSimpleInterpolation } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport type { ForwardProps } from '../../../types';\nimport { getFocusables } from '../../../utils';\nimport { defaultThemeProp } from '../../../theme';\n\nimport { hasNonNullProp } from './utils';\n\n/** CSS Class name for GridEditor resize-handles */\nexport const resizeHandleClassName = 'gridLayoutCustomResizeHandle';\n\n// To appear above the child contents at all times\nconst StyledWrapper = styled(Flex)(({ theme }) => {\n const { base } = theme;\n return css`\n position: relative;\n\n /* To create a new stacking context */\n z-index: 0;\n background-color: ${base.palette['primary-background']};\n\n .${resizeHandleClassName} {\n opacity: 0;\n }\n\n /* To mask the child content from getting clicked when dragging a grid item */\n &::after {\n content: '';\n position: absolute;\n z-index: ${base['z-index'].max - 1};\n inset: 0;\n }\n\n &:focus,\n &:hover {\n &::after {\n border: 0.125rem solid ${base.palette.interactive};\n }\n .${resizeHandleClassName} {\n opacity: 1;\n }\n }\n `;\n});\nStyledWrapper.defaultProps = defaultThemeProp;\n\ntype ResizeAxis = NonNullable<CoreProps['resizeHandles']>[number];\n\nconst axisWiseStyles: Record<ResizeAxis, FlattenSimpleInterpolation> = {\n n: css`\n inset-block-start: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0.875rem;\n cursor: n-resize;\n `,\n s: css`\n inset-block-end: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0;\n cursor: s-resize;\n `,\n e: css`\n inset-inline-end: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.375rem;\n cursor: e-resize;\n `,\n w: css`\n inset-inline-start: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.375rem;\n cursor: w-resize;\n `,\n ne: css`\n inset-block-start: 0;\n inset-inline-end: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.875rem;\n cursor: ne-resize;\n `,\n nw: css`\n inset-block-start: 0;\n inset-inline-start: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.875rem;\n cursor: nw-resize;\n `,\n sw: css`\n inset-block-end: 0;\n inset-inline-start: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0;\n cursor: sw-resize;\n `,\n se: css`\n inset-block-end: 0;\n inset-inline-end: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0;\n cursor: se-resize;\n `\n};\n\nconst StyledHandle = styled.div<{ axis: ResizeAxis }>(({ theme, axis }) => {\n const { base } = theme;\n return css`\n position: absolute;\n z-index: ${base['z-index'].max};\n inline-size: 1.25rem;\n block-size: 1.25rem;\n border: solid transparent;\n\n /* Using box-shadow instead of background coz the latter will be visible underneath the border as well. */\n /* We still want the 20x20 clickable region, but an 8x8 visible region. */\n box-shadow:\n inset 0.25rem 0.25rem 0 ${base.palette.interactive},\n inset -0.25rem -0.25rem 0 ${base.palette.interactive};\n\n ${axisWiseStyles[axis]}\n `;\n});\nStyledHandle.defaultProps = defaultThemeProp;\n\n/** Custom resize-handle for GridLayoutEditor */\nexport const ResizeHandle = forwardRef((props: any, ref) => {\n const { handleAxis, ...restProps } = props;\n return (\n <StyledHandle ref={ref} axis={handleAxis} className={resizeHandleClassName} {...restProps} />\n );\n});\n\ninterface EditorGridItemProps extends ForwardProps {\n children: ReactElement;\n itemKey: ReactElement['key'];\n itemLabel: string;\n moveItem: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n addOrSubtractItemSize: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n}\n\n/**\n * Wrapper on top of GridItems to provide custom styling etc.\n * https://github.com/react-grid-layout/react-grid-layout#custom-child-components-and-draggable-handles\n */\nconst EditorGridItem = forwardRef(\n (\n {\n children,\n itemKey,\n itemLabel,\n moveItem,\n addOrSubtractItemSize,\n ...restProps\n }: EditorGridItemProps,\n ref: Ref<HTMLDivElement>\n ) => {\n const handleKeyUp = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n switch (e.key) {\n case 'ArrowUp':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, -1);\n else moveItem(itemKey, 0, -1);\n break;\n case 'ArrowDown':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, 1);\n else moveItem(itemKey, 0, 1);\n break;\n case 'ArrowLeft':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, -1, 0);\n else moveItem(itemKey, -1, 0);\n break;\n case 'ArrowRight':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 1, 0);\n else moveItem(itemKey, 1, 0);\n break;\n // Do nothing\n default:\n }\n },\n [addOrSubtractItemSize, itemKey, moveItem]\n );\n\n // To keep the experience smoother, disabling all interactions on the child content of grid items.\n // The CSS `::after` mask prevents interactions through mouse clicks.\n // This method prevents interactions through keyboard navigation.\n // Not doing this from a `useEffect` since some of the child content can render after server calls etc.\n const disableChildrenFocus = useCallback(() => {\n if (!ref) return;\n // In case RGL ever uses a RefCallback instead of a RefObject\n if (!hasNonNullProp(ref, 'current')) return;\n\n const focusables = getFocusables(ref);\n focusables.forEach(elem => {\n elem.tabIndex = -1;\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <StyledWrapper\n container={{ direction: 'column' }}\n ref={ref}\n {...restProps}\n role='listitem'\n tabIndex={0}\n aria-label={itemLabel}\n onKeyUp={handleKeyUp}\n onFocus={disableChildrenFocus}\n >\n {children}\n </StyledWrapper>\n );\n }\n);\n\nexport default EditorGridItem;\n"]}
|
|
1
|
+
{"version":3,"file":"EditorGridItem.js","sourceRoot":"","sources":["../../../../src/components/PageTemplates/GridLayout/EditorGridItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, type KeyboardEvent, type ReactElement, type Ref, useCallback } from 'react';\nimport type { CoreProps } from 'react-grid-layout';\nimport styled, { css, type FlattenSimpleInterpolation } from 'styled-components';\n\nimport Flex from '../../Flex';\nimport type { ForwardProps } from '../../../types';\nimport { getFocusables } from '../../../utils';\nimport { defaultThemeProp } from '../../../theme';\n\nimport { hasNonNullProp } from './utils';\n\n/** CSS Class name for GridEditor resize-handles */\nexport const resizeHandleClassName = 'gridLayoutCustomResizeHandle';\n\n// To appear above the child contents at all times\nconst StyledWrapper = styled(Flex)(({ theme }) => {\n const { base, components } = theme;\n return css`\n position: relative;\n\n /* To create a new stacking context */\n z-index: 0;\n background-color: ${base.palette['primary-background']};\n\n .${resizeHandleClassName} {\n opacity: 0;\n }\n\n /* To mask the child content from getting clicked when dragging a grid item */\n &::after {\n content: '';\n position: absolute;\n z-index: ${base['z-index'].max - 1};\n inset: 0;\n }\n\n &:focus,\n &:hover {\n &::after {\n border: 0.125rem solid ${base.palette.interactive};\n\n /* For widgets where the interactive border might not be visible */\n outline: 0.125rem solid ${components.card.background};\n outline-offset: -0.25rem;\n }\n .${resizeHandleClassName} {\n opacity: 1;\n }\n }\n `;\n});\nStyledWrapper.defaultProps = defaultThemeProp;\n\ntype ResizeAxis = NonNullable<CoreProps['resizeHandles']>[number];\n\nconst axisWiseStyles: Record<ResizeAxis, FlattenSimpleInterpolation> = {\n n: css`\n inset-block-start: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0.875rem;\n cursor: n-resize;\n `,\n s: css`\n inset-block-end: 0;\n inset-inline-start: 50%;\n margin-inline-start: -0.625rem;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.375rem;\n border-inline-end-width: 0.375rem;\n border-block-end-width: 0;\n cursor: s-resize;\n `,\n e: css`\n inset-inline-end: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.375rem;\n cursor: e-resize;\n `,\n w: css`\n inset-inline-start: 0;\n inset-block-start: 50%;\n margin-block-start: -0.625rem;\n border-block-start-width: 0.375rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.375rem;\n cursor: w-resize;\n `,\n ne: css`\n inset-block-start: 0;\n inset-inline-end: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0.875rem;\n cursor: ne-resize;\n `,\n nw: css`\n inset-block-start: 0;\n inset-inline-start: 0;\n border-block-start-width: 0;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0.875rem;\n cursor: nw-resize;\n `,\n sw: css`\n inset-block-end: 0;\n inset-inline-start: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0;\n border-inline-end-width: 0.875rem;\n border-block-end-width: 0;\n cursor: sw-resize;\n `,\n se: css`\n inset-block-end: 0;\n inset-inline-end: 0;\n border-block-start-width: 0.875rem;\n border-inline-start-width: 0.875rem;\n border-inline-end-width: 0;\n border-block-end-width: 0;\n cursor: se-resize;\n `\n};\n\nconst StyledHandle = styled.div<{ axis: ResizeAxis }>(({ theme, axis }) => {\n const { base } = theme;\n return css`\n position: absolute;\n z-index: ${base['z-index'].max};\n inline-size: 1.25rem;\n block-size: 1.25rem;\n border: solid transparent;\n\n /* Using box-shadow instead of background coz the latter will be visible underneath the border as well. */\n /* We still want the 20x20 clickable region, but an 8x8 visible region. */\n box-shadow:\n inset 0.25rem 0.25rem 0 ${base.palette.interactive},\n inset -0.25rem -0.25rem 0 ${base.palette.interactive};\n\n ${axisWiseStyles[axis]}\n `;\n});\nStyledHandle.defaultProps = defaultThemeProp;\n\n/** Custom resize-handle for GridLayoutEditor */\nexport const ResizeHandle = forwardRef((props: any, ref) => {\n const { handleAxis, ...restProps } = props;\n return (\n <StyledHandle ref={ref} axis={handleAxis} className={resizeHandleClassName} {...restProps} />\n );\n});\n\ninterface EditorGridItemProps extends ForwardProps {\n children: ReactElement;\n itemKey: ReactElement['key'];\n itemLabel: string;\n moveItem: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n addOrSubtractItemSize: (key: ReactElement['key'], deltaX: number, deltaY: number) => void;\n}\n\n/**\n * Wrapper on top of GridItems to provide custom styling etc.\n * https://github.com/react-grid-layout/react-grid-layout#custom-child-components-and-draggable-handles\n */\nconst EditorGridItem = forwardRef(\n (\n {\n children,\n itemKey,\n itemLabel,\n moveItem,\n addOrSubtractItemSize,\n ...restProps\n }: EditorGridItemProps,\n ref: Ref<HTMLDivElement>\n ) => {\n const handleKeyUp = useCallback(\n (e: KeyboardEvent<HTMLDivElement>) => {\n switch (e.key) {\n case 'ArrowUp':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, -1);\n else moveItem(itemKey, 0, -1);\n break;\n case 'ArrowDown':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 0, 1);\n else moveItem(itemKey, 0, 1);\n break;\n case 'ArrowLeft':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, -1, 0);\n else moveItem(itemKey, -1, 0);\n break;\n case 'ArrowRight':\n if (e.shiftKey) addOrSubtractItemSize(itemKey, 1, 0);\n else moveItem(itemKey, 1, 0);\n break;\n // Do nothing\n default:\n }\n },\n [addOrSubtractItemSize, itemKey, moveItem]\n );\n\n // To keep the experience smoother, disabling all interactions on the child content of grid items.\n // The CSS `::after` mask prevents interactions through mouse clicks.\n // This method prevents interactions through keyboard navigation.\n // Not doing this from a `useEffect` since some of the child content can render after server calls etc.\n const disableChildrenFocus = useCallback(() => {\n if (!ref) return;\n // In case RGL ever uses a RefCallback instead of a RefObject\n if (!hasNonNullProp(ref, 'current')) return;\n\n const focusables = getFocusables(ref);\n focusables.forEach(elem => {\n elem.tabIndex = -1;\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <StyledWrapper\n container={{ direction: 'column' }}\n ref={ref}\n {...restProps}\n role='listitem'\n tabIndex={0}\n aria-label={itemLabel}\n onKeyUp={handleKeyUp}\n onFocus={disableChildrenFocus}\n >\n {children}\n </StyledWrapper>\n );\n }\n);\n\nexport default EditorGridItem;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StandardTree.d.ts","sourceRoot":"","sources":["../../../src/components/Tree/StandardTree.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"StandardTree.d.ts","sourceRoot":"","sources":["../../../src/components/Tree/StandardTree.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAsBnE,OAAO,KAAK,EAGV,iBAAiB,EAElB,MAAM,sBAAsB,CAAC;AA0hB9B,QAAA,MAAM,YAAY,EAAE,+BAA+B,CAAC,iBAAiB,CAIpE,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, createContext, useMemo, useContext, useCallback, useState, useEffect, useRef } from 'react';
|
|
3
3
|
import Progress from '../Progress';
|
|
4
|
-
import { useConsolidatedRef, useDirection, useFocusWithin, useI18n, useUID } from '../../hooks';
|
|
4
|
+
import { useConsolidatedRef, useDirection, useFocusWithin, useI18n, useOS, useUID } from '../../hooks';
|
|
5
5
|
import Flex from '../Flex';
|
|
6
6
|
import Link from '../Link';
|
|
7
7
|
import Button from '../Button';
|
|
8
8
|
import Actions from '../Actions';
|
|
9
9
|
import { cap } from '../../utils';
|
|
10
|
+
import VisuallyHiddenText from '../VisuallyHiddenText';
|
|
10
11
|
import { StyledStandardTreeParent, StyledToggleIcon, StyledToggleIconWrapper, StyledStandardTreeItemSubTree, StyledStandardTreeLeaf, StyledStandardTree, StyledNodeInteraction, StyledStandardTreeNode, StyledNodeActions, StyledLabelContent, StyledNodeIcon, StyledNodeText, StyledLoadMoreButton, StyledSecondaryText, StyledLabelContainer } from './StandardTree.styles';
|
|
11
12
|
import helpers from './helpers';
|
|
12
13
|
const StandardTreeContext = createContext({
|
|
@@ -28,6 +29,7 @@ const NodeRenderer = ({ id, label, secondary, icon, depth, hasParentSibling, nod
|
|
|
28
29
|
const firstNode = firstNodeId === id;
|
|
29
30
|
const lastNode = lastNodeId === id;
|
|
30
31
|
const { start, end } = useDirection();
|
|
32
|
+
const { macintosh } = useOS();
|
|
31
33
|
const loadMoreRef = useRef(null);
|
|
32
34
|
const t = useI18n();
|
|
33
35
|
const ariaCurrent = useMemo(() => {
|
|
@@ -64,6 +66,9 @@ const NodeRenderer = ({ id, label, secondary, icon, depth, hasParentSibling, nod
|
|
|
64
66
|
e.preventDefault();
|
|
65
67
|
if (e.key === 'Enter' && !href)
|
|
66
68
|
e.preventDefault();
|
|
69
|
+
if (href && onPreview && e.getModifierState('Alt') && e.code === 'KeyP') {
|
|
70
|
+
onPreview({ href });
|
|
71
|
+
}
|
|
67
72
|
switch (e.key) {
|
|
68
73
|
case 'ArrowUp':
|
|
69
74
|
changeFocusedNodeId(id, 'up');
|
|
@@ -147,7 +152,7 @@ const NodeRenderer = ({ id, label, secondary, icon, depth, hasParentSibling, nod
|
|
|
147
152
|
elRef?.current?.focus();
|
|
148
153
|
}
|
|
149
154
|
}, [focusedEl]);
|
|
150
|
-
const loadMoreButton = onLoadMore ? (_jsx(Flex, { container: { alignItems: 'center' }, children: _jsx(Button, { as: StyledLoadMoreButton, variant: 'link',
|
|
155
|
+
const loadMoreButton = onLoadMore ? (_jsx(Flex, { container: { alignItems: 'center' }, children: _jsx(Button, { as: StyledLoadMoreButton, variant: 'link', "aria-label": label, onClick: (e) => {
|
|
151
156
|
onLoadMore?.(id);
|
|
152
157
|
onClick?.(id, e);
|
|
153
158
|
}, ref: loadMoreRef, children: t('load_more') }) })) : undefined;
|
|
@@ -166,16 +171,16 @@ const NodeRenderer = ({ id, label, secondary, icon, depth, hasParentSibling, nod
|
|
|
166
171
|
onLoadMore,
|
|
167
172
|
href
|
|
168
173
|
});
|
|
169
|
-
return !nodes && (onClick ?? onNodeClick) ? (_jsx(Flex, { container: { alignItems: 'center', justify: 'between', gap: 2 }, as: StyledNodeInteraction, forwardedAs: href ? 'a' : 'div', role: 'treeitem', "aria-current": current ? ariaCurrent : undefined, tabIndex: tabIndex, onClick: (e) => {
|
|
174
|
+
return !nodes && (onClick ?? onNodeClick) ? (_jsx(Flex, { container: { alignItems: 'center', justify: 'between', gap: 2 }, as: StyledNodeInteraction, forwardedAs: href ? 'a' : 'div', role: 'treeitem', "aria-selected": false, "aria-current": current ? ariaCurrent : undefined, tabIndex: tabIndex, onClick: (e) => {
|
|
170
175
|
onClick?.(id, e);
|
|
171
176
|
onNodeClick?.(id, e);
|
|
172
177
|
changeFocusedNodeId(id);
|
|
173
178
|
}, href: href, onKeyDown: onKeyDown, ref: elRef, children: content })) : (content);
|
|
174
179
|
}
|
|
175
|
-
const internal = href ? (_jsxs(Flex, { container: { alignItems: 'center', gap: 0.5 }, as: StyledLabelContent, children: [icon && _jsx(StyledNodeIcon, { name: icon }), _jsxs(Flex, { container: { direction: 'column', pad: [0, 0.5, 0, 0.5] }, children: [_jsx(Link, { forwardedAs: 'span', href: href, previewable: !!onPreview, onPreview: onPreview, children: label }), secondary && _jsx(StyledSecondaryText, { variant: 'secondary', children: secondary })] })] })) : (
|
|
180
|
+
const internal = href ? (_jsxs(Flex, { container: { alignItems: 'center', gap: 0.5 }, as: StyledLabelContent, children: [icon && _jsx(StyledNodeIcon, { name: icon }), _jsxs(Flex, { container: { direction: 'column', pad: [0, 0.5, 0, 0.5] }, children: [_jsx(Link, { forwardedAs: 'span', href: href, previewable: !!onPreview, onPreview: onPreview, children: label }), secondary && _jsx(StyledSecondaryText, { variant: 'secondary', children: secondary }), _jsx(VisuallyHiddenText, { children: t('preview_link_instruction', [macintosh ? 'option' : 'alt']) })] })] })) : (
|
|
176
181
|
// Wrapping in a div for handling of flex space-between when there are node actions.
|
|
177
182
|
_jsxs(Flex, { container: { alignItems: 'center', gap: 0.5 }, as: StyledLabelContent, children: [icon && _jsx(StyledNodeIcon, { name: icon }), _jsxs(Flex, { container: { direction: 'column', pad: [0, 0, 0, 0.5] }, children: [_jsx(StyledNodeText, { children: label }), secondary && _jsx(StyledSecondaryText, { variant: 'secondary', children: secondary })] })] }));
|
|
178
|
-
return !nodes && (onClick ?? onNodeClick) ? (_jsxs(Flex, { container: { alignItems: 'center', justify: 'between', gap: 2 }, as: StyledNodeInteraction, forwardedAs: href ? 'a' : 'div', role: 'treeitem', "aria-current": current ? ariaCurrent : undefined, tabIndex: tabIndex, onClick: (e) => {
|
|
183
|
+
return !nodes && (onClick ?? onNodeClick) ? (_jsxs(Flex, { container: { alignItems: 'center', justify: 'between', gap: 2 }, as: StyledNodeInteraction, forwardedAs: href ? 'a' : 'div', role: 'treeitem', "aria-selected": false, "aria-current": current ? ariaCurrent : undefined, tabIndex: tabIndex, onClick: (e) => {
|
|
179
184
|
onClick?.(id, e);
|
|
180
185
|
onNodeClick?.(id, e);
|
|
181
186
|
changeFocusedNodeId(id);
|
|
@@ -200,7 +205,7 @@ const NodeRenderer = ({ id, label, secondary, icon, depth, hasParentSibling, nod
|
|
|
200
205
|
'--has-parent-sibling': hasParentSibling ? 1 : 0,
|
|
201
206
|
'--first-visible': firstNode ? 1 : 0,
|
|
202
207
|
'--last-visible': lastNode ? 1 : 0
|
|
203
|
-
}, "aria-busy": loading, children: nodes ? (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: { alignItems: 'center', justify: 'between', gap: 2 }, as: StyledStandardTreeParent, forwardedAs: href ? 'a' : 'div', role: 'treeitem', "aria-current": current ? ariaCurrent : undefined, tabIndex: tabIndex, variant: 'text', onClick: selectableParents ? handleParentClick : handleParentToggle, onMouseOver: onNodeHover ? (e) => onNodeHover(id, e) : undefined, href: selectableParents ? href : undefined, "aria-expanded": expanded,
|
|
208
|
+
}, "aria-busy": loading, children: nodes ? (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: { alignItems: 'center', justify: 'between', gap: 2 }, as: StyledStandardTreeParent, forwardedAs: href ? 'a' : 'div', role: 'treeitem', "aria-selected": false, "aria-current": current ? ariaCurrent : undefined, tabIndex: tabIndex, variant: 'text', onClick: selectableParents ? handleParentClick : handleParentToggle, onMouseOver: onNodeHover ? (e) => onNodeHover(id, e) : undefined, href: selectableParents ? href : undefined, "aria-expanded": expanded, onKeyDown: onKeyDown, ref: elRef, children: [_jsxs(Flex, { container: { alignItems: 'center' }, as: StyledLabelContainer, children: [selectableParents ? (_jsx(Button, { as: 'span', variant: 'simple', tabIndex: -1, icon: true, compact: true, onClick: handleParentToggle, children: _jsx(StyledToggleIcon, { name: 'caret-right' }) })) : (_jsx(Flex, { as: StyledToggleIconWrapper, container: { justify: 'center', alignItems: 'center' }, children: _jsx(StyledToggleIcon, { name: 'caret-right' }) })), labelContent] }), actionsJSX] }), _jsxs(StyledStandardTreeItemSubTree, { lined: lined, id: `${id}-subtree`, children: [subTree, loading && _jsx(Progress, { variant: 'ring', placement: 'inline' })] })] })) : (_jsx(StyledStandardTreeLeaf, { onMouseOver: onNodeHover ? (e) => onNodeHover(id, e) : undefined, children: labelContent })) }));
|
|
204
209
|
};
|
|
205
210
|
const StandardTreeWithNodes = forwardRef(function StandardTreeWithNodes({ nodes: initialNodes, currentNodeId, onNodeClick, onNodeFocus, onNodeHover, onNodeToggle, onLoadMore, contentRenderer, lined = false, selectableParents = true, ...restProps }, ref) {
|
|
206
211
|
const loadMoreId = useUID();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StandardTree.js","sourceRoot":"","sources":["../../../src/components/Tree/StandardTree.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,aAAa,EACb,OAAO,EACP,UAAU,EACV,WAAW,EACX,QAAQ,EACR,SAAS,EACT,MAAM,EACP,MAAM,OAAO,CAAC;AAGf,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAChG,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC,OAAO,EACL,wBAAwB,EACxB,gBAAgB,EAChB,uBAAuB,EACvB,6BAA6B,EAC7B,sBAAsB,EACtB,kBAAkB,EAClB,qBAAqB,EACrB,sBAAsB,EACtB,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,mBAAmB,EACnB,oBAAoB,EACrB,MAAM,uBAAuB,CAAC;AAQ/B,OAAO,OAAO,MAAM,WAAW,CAAC;AAEhC,MAAM,mBAAmB,GAAG,aAAa,CAevC;IACA,aAAa,EAAE,SAAS;IACxB,KAAK,EAAE,KAAK;IACZ,eAAe,EAAE,GAAG,EAAE,CAAC,SAAS;IAChC,WAAW,EAAE,GAAG,EAAE,GAAE,CAAC;IACrB,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,WAAW,EAAE,SAAS;IACtB,UAAU,EAAE,SAAS;IACrB,aAAa,EAAE,SAAS;IACxB,mBAAmB,EAAE,GAAG,EAAE,GAAE,CAAC;IAC7B,iBAAiB,EAAE,IAAI;CACxB,CAAC,CAAC;AAEH,MAAM,YAAY,GAAgD,CAAC,EACjE,EAAE,EACF,KAAK,EACL,SAAS,EACT,IAAI,EACJ,KAAK,EACL,gBAAgB,EAChB,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,OAAO,EACP,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,IAAI,EACL,EAAE,EAAE;IACH,MAAM,EACJ,aAAa,EACb,eAAe,EACf,WAAW,EACX,YAAY,EACZ,WAAW,EACX,KAAK,EACL,aAAa,EACb,mBAAmB,EACnB,WAAW,EACX,UAAU,EACV,iBAAiB,EAClB,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACpC,MAAM,OAAO,GAAG,aAAa,KAAK,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,aAAa,KAAK,EAAE,CAAC;IACvC,MAAM,SAAS,GAAG,WAAW,KAAK,EAAE,CAAC;IACrC,MAAM,QAAQ,GAAG,UAAU,KAAK,EAAE,CAAC;IACnC,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IACtC,MAAM,WAAW,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACpD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE;QAC/B,OAAO,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC;IAC9B,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC;QACf,IAAI,aAAa,EAAE,CAAC;YAClB,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC7B,CAAC;aAAM,IAAI,aAAa,IAAI,OAAO,EAAE,CAAC;YACpC,KAAK,GAAG,CAAC,CAAC;QACZ,CAAC;aAAM,IAAI,aAAa,IAAI,KAAK,IAAI,OAAO,CAAC,OAAO,CAAC,KAAK,EAAE,aAAa,CAAC,EAAE,CAAC;YAC3E,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC3B,CAAC;aAAM,CAAC;YACN,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC7B,CAAC;QACD,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,aAAa,EAAE,aAAa,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAC;IAEvD,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,CAAuD,EAAE,EAAE;QAC1D,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;QACrB,mBAAmB,CAAC,EAAE,CAAC,CAAC;IAC1B,CAAC,EACD,CAAC,EAAE,EAAE,WAAW,EAAE,mBAAmB,CAAC,CACvC,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,CAAuD,EAAE,EAAE;QAC1D,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,YAAY,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;QACtB,mBAAmB,CAAC,EAAE,CAAC,CAAC;IAC1B,CAAC,EACD,CAAC,EAAE,EAAE,YAAY,EAAE,mBAAmB,CAAC,CACxC,CAAC;IAEF,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAA6B,EAAE,EAAE;QAChC,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC;YAAE,CAAC,CAAC,cAAc,EAAE,CAAC;QAChF,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,IAAI;YAAE,CAAC,CAAC,cAAc,EAAE,CAAC;QACnD,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;YACd,KAAK,SAAS;gBACZ,mBAAmB,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;gBAC9B,MAAM;YACR,KAAK,WAAW;gBACd,mBAAmB,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;gBAChC,MAAM;YACR,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC,EAAE;gBACrB,IAAI,KAAK,EAAE,CAAC;oBACV,IAAI,QAAQ,EAAE,CAAC;wBACb,mBAAmB,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;oBACnC,CAAC;yBAAM,CAAC;wBACN,YAAY,EAAE,CAAC,EAAE,CAAC,CAAC;oBACrB,CAAC;gBACH,CAAC;gBACD,MAAM;YACR,KAAK,QAAQ,GAAG,CAAC,KAAK,CAAC,EAAE;gBACvB,IAAI,QAAQ,EAAE,CAAC;oBACb,YAAY,EAAE,CAAC,EAAE,CAAC,CAAC;gBACrB,CAAC;qBAAM,CAAC;oBACN,mBAAmB,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;gBAClC,CAAC;gBACD,MAAM;YACR,KAAK,OAAO,CAAC;YACb,KAAK,GAAG;gBACN,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBACjB,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;gBACjB,IAAI,KAAK,EAAE,CAAC;oBACV,IAAI,iBAAiB,EAAE,CAAC;wBACtB,iBAAiB,CAAC,CAAC,CAAC,CAAC;oBACvB,CAAC;yBAAM,CAAC;wBACN,kBAAkB,CAAC,CAAC,CAAC,CAAC;oBACxB,CAAC;gBACH,CAAC;qBAAM,CAAC;oBACN,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;oBACrB,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC1B,CAAC;gBACD,MAAM;YACR,KAAK,MAAM;gBACT,IAAI,WAAW;oBAAE,mBAAmB,CAAC,WAAW,CAAC,CAAC;gBAClD,MAAM;YACR,KAAK,KAAK;gBACR,IAAI,UAAU;oBAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;gBAChD,MAAM;YACR,QAAQ;QACV,CAAC;IACH,CAAC,EACD,CAAC,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,mBAAmB,CAAC,CAClF,CAAC;IAEF,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,2FAA2F;QAC3F,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,KAAC,IAAI,IAAC,EAAE,EAAE,iBAAiB,EAAE,SAAS,kBACpC,KAAC,OAAO,IACN,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;oBAC1B,OAAO;wBACL,GAAG,MAAM;wBACT,OAAO,EAAE,IAAI;wBACb,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;4BAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;gCAAE,CAAC,CAAC,eAAe,EAAE,CAAC;wBAC7C,CAAC;qBACF,CAAC;gBACJ,CAAC,CAAC,EACF,MAAM,EAAE,CAAC,EACT,eAAe,EAAE;oBACf,OAAO,EAAE,CAAC,CAAa,EAAE,EAAE;wBACzB,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,CAAC,CAAC,cAAc,EAAE,CAAC;oBACrB,CAAC;oBACD,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;wBAC9B,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,IAAI,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;4BAC7C,CAAC,CAAC,cAAc,EAAE,CAAC;wBACrB,CAAC;oBACH,CAAC;iBACF,GACD,GACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;IACX,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,KAAK,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE3C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE,CAAC;YACd,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QAC1B,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,cAAc,GAAG,UAAU,CAAC,CAAC,CAAC,CAClC,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,YACvC,KAAC,MAAM,IACL,EAAE,EAAE,oBAAoB,EACxB,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAChB,KAAK,EACjB,OAAO,EAAE,CAAC,CAAuD,EAAE,EAAE;gBACnE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;gBACjB,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;YACnB,CAAC,EACD,GAAG,EAAE,WAAW,YAEf,CAAC,CAAC,WAAW,CAAC,GACR,GACJ,CACR,CAAC,CAAC,CAAC,SAAS,CAAC;IAEd,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAChC,IAAI,eAAe,EAAE,CAAC;YACpB,MAAM,OAAO,GAAG,eAAe,CAAC;gBAC9B,EAAE;gBACF,KAAK;gBACL,SAAS;gBACT,IAAI;gBACJ,KAAK;gBACL,QAAQ;gBACR,OAAO;gBACP,OAAO;gBACP,OAAO;gBACP,UAAU;gBACV,IAAI;aACL,CAAC,CAAC;YACH,OAAO,CAAC,KAAK,IAAI,CAAC,OAAO,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC,CAC1C,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,EAAE,EAAE,qBAAqB,EACzB,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAC/B,IAAI,EAAC,UAAU,kBACD,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC/C,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,CAA0B,EAAE,EAAE;oBACtC,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;oBACjB,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;oBACrB,mBAAmB,CAAC,EAAE,CAAC,CAAC;gBAC1B,CAAC,EACD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,KAAK,YAET,OAAO,GACH,CACR,CAAC,CAAC,CAAC,CACF,OAAO,CACR,CAAC;QACJ,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,CACtB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,kBAAkB,aACxE,IAAI,IAAI,KAAC,cAAc,IAAC,IAAI,EAAE,IAAI,GAAI,EACvC,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,aAC7D,KAAC,IAAI,IAAC,WAAW,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,YAChF,KAAK,GACD,EACN,SAAS,IAAI,KAAC,mBAAmB,IAAC,OAAO,EAAC,WAAW,YAAE,SAAS,GAAuB,IACnF,IACF,CACR,CAAC,CAAC,CAAC;QACF,oFAAoF;QACpF,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,kBAAkB,aACxE,IAAI,IAAI,KAAC,cAAc,IAAC,IAAI,EAAE,IAAI,GAAI,EACvC,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,aAC3D,KAAC,cAAc,cAAE,KAAK,GAAkB,EACvC,SAAS,IAAI,KAAC,mBAAmB,IAAC,OAAO,EAAC,WAAW,YAAE,SAAS,GAAuB,IACnF,IACF,CACR,CAAC;QAEF,OAAO,CAAC,KAAK,IAAI,CAAC,OAAO,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC,CAC1C,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,EAAE,EAAE,qBAAqB,EACzB,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAC/B,IAAI,EAAC,UAAU,kBACD,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC/C,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,CAA0B,EAAE,EAAE;gBACtC,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;gBACjB,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;gBACrB,mBAAmB,CAAC,EAAE,CAAC,CAAC;YAC1B,CAAC,EACD,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,KAAK,aAET,cAAc,IAAI,QAAQ,EAC1B,UAAU,IACN,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC;IACJ,CAAC,EAAE;QACD,EAAE;QACF,KAAK;QACL,IAAI;QACJ,KAAK;QACL,OAAO;QACP,OAAO;QACP,WAAW;QACX,OAAO;QACP,SAAS;QACT,QAAQ;QACR,mBAAmB;QACnB,SAAS;KACV,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,sBAAsB,IACrB,EAAE,EAAE,EAAE,EACN,KAAK,EACH;YACE,SAAS,EAAE,KAAK;YAChB,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC7B,sBAAsB,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAChD,iBAAiB,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACpC,gBAAgB,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAClB,eAET,OAAO,YAEjB,KAAK,CAAC,CAAC,CAAC,CACP,8BACE,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,EAC/D,EAAE,EAAE,wBAAwB,EAC5B,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAC/B,IAAI,EAAC,UAAU,kBACD,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC/C,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,kBAAkB,EACnE,WAAW,EACT,WAAW,CAAC,CAAC,CAAC,CAAC,CAA0B,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EAE9E,IAAI,EAAE,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,mBAC3B,QAAQ,eACZ,GAAG,EAAE,UAAU,EAC1B,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,KAAK,aAEV,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,oBAAoB,aAChE,iBAAiB,CAAC,CAAC,CAAC,CACnB,KAAC,MAAM,IACL,EAAE,EAAC,MAAM,EACT,OAAO,EAAC,QAAQ,EAChB,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,QACJ,OAAO,QACP,OAAO,EAAE,kBAAkB,YAE3B,KAAC,gBAAgB,IAAC,IAAI,EAAC,aAAa,GAAG,GAChC,CACV,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IACH,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,YAEtD,KAAC,gBAAgB,IAAC,IAAI,EAAC,aAAa,GAAG,GAClC,CACR,EACA,YAAY,IACR,EACN,UAAU,IACN,EACP,MAAC,6BAA6B,IAAC,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,UAAU,aAC7D,OAAO,EACP,OAAO,IAAI,KAAC,QAAQ,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ,GAAG,IAC5B,IAC/B,CACJ,CAAC,CAAC,CAAC,CACF,KAAC,sBAAsB,IACrB,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAA0B,EAAE,EAAE,CAAC,WAAW,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,YAExF,YAAY,GACU,CAC1B,GACsB,CAC1B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAAuD,UAAU,CAC1F,SAAS,qBAAqB,CAC5B,EACE,KAAK,EAAE,YAAY,EACnB,aAAa,EACb,WAAW,EACX,WAAW,EACX,WAAW,EACX,YAAY,EACZ,UAAU,EACV,eAAe,EACf,KAAK,GAAG,KAAK,EACb,iBAAiB,GAAG,IAAI,EACxB,GAAG,SAAS,EACuB,EACrC,GAA6B;IAE7B,MAAM,UAAU,GAAG,MAAM,EAAE,CAAC;IAC5B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,KAAK,GAAG;QACZ,GAAG,OAAO,CAAC,OAAO,CAAC,YAAY,EAAE,IAAI,CAAC,EAAE;YACtC,IAAI,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;gBACrC,OAAO;oBACL,GAAG,IAAI;oBACP,UAAU,EAAE,SAAS;oBACrB,KAAK,EAAE;wBACL,GAAG,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC;wBACrB;4BACE,EAAE,EAAE,GAAG,UAAU,IAAI,IAAI,CAAC,EAAE,EAAE;4BAC9B,KAAK,EAAE,GAAG,CAAC,CAAC,WAAW,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE;4BAC1C,UAAU,EAAE,GAAG,EAAE;gCACf,IAAI,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;4BAC7B,CAAC;yBACF;qBACF;iBACF,CAAC;YACJ,CAAC;YACD,OAAO,IAAI,CAAC;QACd,CAAC,CAAC;QACF,GAAG,CAAC,UAAU;YACZ,CAAC,CAAC;gBACE;oBACE,EAAE,EAAE,UAAU;oBACd,KAAK,EAAE,GAAG,CAAC,CAAC,WAAW,CAAC,EAAE;oBAC1B,UAAU;iBACX;aACF;YACH,CAAC,CAAC,EAAE,CAAC;KACR,CAAC;IAEF,MAAM,CAAC,aAAa,EAAE,iBAAiB,CAAC,GAAG,QAAQ,EAAsB,CAAC;IAC1E,MAAM,OAAO,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAExC,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE;QAC9B,OAAO,OAAO,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;IACvE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,mBAAmB,GAAoD,WAAW,CACtF,CAAC,EAAE,EAAE,IAAI,EAAE,EAAE;QACX,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,IAAI,CAAC,CAAC,CAAC;gBACV,MAAM,YAAY,GAAG,OAAO,CAAC,eAAe,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;gBACxD,IAAI,YAAY;oBAAE,iBAAiB,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;gBACrD,MAAM;YACR,CAAC;YACD,KAAK,MAAM,CAAC,CAAC,CAAC;gBACZ,MAAM,QAAQ,GAAG,OAAO,CAAC,WAAW,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;gBAChD,IAAI,QAAQ;oBAAE,iBAAiB,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;gBAC7C,MAAM;YACR,CAAC;YACD,KAAK,MAAM,CAAC,CAAC,CAAC;gBACZ,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;gBACpD,IAAI,UAAU;oBAAE,iBAAiB,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;gBACjD,MAAM;YACR,CAAC;YACD,KAAK,OAAO,CAAC,CAAC,CAAC;gBACb,MAAM,SAAS,GAAG,OAAO,CAAC,iBAAiB,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;gBACvD,IAAI,SAAS;oBAAE,iBAAiB,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC;gBAC/C,MAAM;YACR,CAAC;YACD,OAAO,CAAC,CAAC,CAAC;gBACR,IAAI,EAAE,KAAK,aAAa;oBAAE,iBAAiB,CAAC,EAAE,CAAC,CAAC;gBAChD,MAAM;YACR,CAAC;QACH,CAAC;IACH,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa;YAAE,WAAW,EAAE,CAAC,aAAa,CAAC,CAAC;IAClD,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,aAAa,GAAG,CAAC,OAAgB,EAAE,EAAE;QACzC,IAAI,CAAC,OAAO;YAAE,iBAAiB,CAAC,EAAE,CAAC,CAAC;IACtC,CAAC,CAAC;IAEF,cAAc,CAAC,CAAC,OAAO,CAAC,EAAE,aAAa,CAAC,CAAC;IAEzC,OAAO,CACL,KAAC,mBAAmB,CAAC,QAAQ,IAC3B,KAAK,EAAE,OAAO,CACZ,GAAG,EAAE,CAAC,CAAC;YACL,aAAa;YACb,aAAa;YACb,UAAU;YACV,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;YACxB,mBAAmB;YACnB,WAAW;YACX,WAAW;YACX,YAAY;YACZ,eAAe;YACf,KAAK;YACL,iBAAiB;SAClB,CAAC,EACF;YACE,aAAa;YACb,WAAW;YACX,WAAW;YACX,KAAK;YACL,aAAa;YACb,UAAU;YACV,YAAY;YACZ,eAAe;YACf,iBAAiB;SAClB,CACF,YAGD,KAAC,kBAAkB,OACb,SAAS,EACb,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,GAC1B,GAC2B,CAChC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,YAAY,GAAuD,UAAU,CACjF,SAAS,YAAY,CAAC,KAAyC,EAAE,GAA6B;IAC5F,OAAO,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,KAAC,qBAAqB,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,GAAI,CAAC,CAAC,CAAC,IAAI,CAAC;AACxF,CAAC,CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import {\n forwardRef,\n createContext,\n useMemo,\n useContext,\n useCallback,\n useState,\n useEffect,\n useRef\n} from 'react';\nimport type { KeyboardEvent, PropsWithoutRef, CSSProperties, MouseEvent } from 'react';\n\nimport Progress from '../Progress';\nimport { useConsolidatedRef, useDirection, useFocusWithin, useI18n, useUID } from '../../hooks';\nimport Flex from '../Flex';\nimport Link from '../Link';\nimport Button from '../Button';\nimport Actions from '../Actions';\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport { cap } from '../../utils';\n\nimport {\n StyledStandardTreeParent,\n StyledToggleIcon,\n StyledToggleIconWrapper,\n StyledStandardTreeItemSubTree,\n StyledStandardTreeLeaf,\n StyledStandardTree,\n StyledNodeInteraction,\n StyledStandardTreeNode,\n StyledNodeActions,\n StyledLabelContent,\n StyledNodeIcon,\n StyledNodeText,\n StyledLoadMoreButton,\n StyledSecondaryText,\n StyledLabelContainer\n} from './StandardTree.styles';\nimport type { TreeProps } from './Tree';\nimport type {\n StandardTreeContextProps,\n StandardTreeNode,\n StandardTreeProps,\n StandardTreePropsWithDefaults\n} from './StandardTree.types';\nimport helpers from './helpers';\n\nconst StandardTreeContext = createContext<\n Pick<\n StandardTreePropsWithDefaults,\n | 'currentNodeId'\n | 'contentRenderer'\n | 'lined'\n | 'onNodeClick'\n | 'onNodeHover'\n | 'onNodeToggle'\n | 'firstNodeId'\n | 'lastNodeId'\n | 'focusedNodeId'\n | 'changeFocusedNodeId'\n | 'selectableParents'\n >\n>({\n currentNodeId: undefined,\n lined: false,\n contentRenderer: () => undefined,\n onNodeClick: () => {},\n onNodeToggle: () => {},\n firstNodeId: undefined,\n lastNodeId: undefined,\n focusedNodeId: undefined,\n changeFocusedNodeId: () => {},\n selectableParents: true\n});\n\nconst NodeRenderer: TreeProps<StandardTreeNode>['nodeRenderer'] = ({\n id,\n label,\n secondary,\n icon,\n depth,\n hasParentSibling,\n nodes,\n expanded = false,\n loading = false,\n subTree,\n actions,\n onClick,\n onPreview,\n onLoadMore,\n href\n}) => {\n const {\n currentNodeId,\n contentRenderer,\n onNodeClick,\n onNodeToggle,\n onNodeHover,\n lined,\n focusedNodeId,\n changeFocusedNodeId,\n firstNodeId,\n lastNodeId,\n selectableParents\n } = useContext(StandardTreeContext);\n const current = currentNodeId === id;\n const focusedEl = focusedNodeId === id;\n const firstNode = firstNodeId === id;\n const lastNode = lastNodeId === id;\n const { start, end } = useDirection();\n const loadMoreRef = useRef<HTMLButtonElement>(null);\n const t = useI18n();\n\n const ariaCurrent = useMemo(() => {\n return href ? 'page' : true;\n }, [href]);\n\n const tabIndex = useMemo(() => {\n let index = -1;\n if (focusedNodeId) {\n index = focusedEl ? 0 : -1;\n } else if (currentNodeId && current) {\n index = 0;\n } else if (currentNodeId && nodes && helpers.getNode(nodes, currentNodeId)) {\n index = current ? 0 : -1;\n } else {\n index = firstNode ? 0 : -1;\n }\n return index;\n }, [focusedNodeId, currentNodeId, current, focusedEl]);\n\n const handleParentClick = useCallback(\n (e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n },\n [id, onNodeClick, changeFocusedNodeId]\n );\n\n const handleParentToggle = useCallback(\n (e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n e.preventDefault();\n e.stopPropagation();\n onNodeToggle?.(id, e);\n changeFocusedNodeId(id);\n },\n [id, onNodeToggle, changeFocusedNodeId]\n );\n\n const onKeyDown = useCallback(\n (e: KeyboardEvent<HTMLElement>) => {\n if (['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(e.key)) e.preventDefault();\n if (e.key === 'Enter' && !href) e.preventDefault();\n switch (e.key) {\n case 'ArrowUp':\n changeFocusedNodeId(id, 'up');\n break;\n case 'ArrowDown':\n changeFocusedNodeId(id, 'down');\n break;\n case `Arrow${cap(end)}`:\n if (nodes) {\n if (expanded) {\n changeFocusedNodeId(id, 'right');\n } else {\n onNodeToggle?.(id);\n }\n }\n break;\n case `Arrow${cap(start)}`:\n if (expanded) {\n onNodeToggle?.(id);\n } else {\n changeFocusedNodeId(id, 'left');\n }\n break;\n case 'Enter':\n case ' ':\n onLoadMore?.(id);\n onClick?.(id, e);\n if (nodes) {\n if (selectableParents) {\n handleParentClick(e);\n } else {\n handleParentToggle(e);\n }\n } else {\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n }\n break;\n case 'Home':\n if (firstNodeId) changeFocusedNodeId(firstNodeId);\n break;\n case 'End':\n if (lastNodeId) changeFocusedNodeId(lastNodeId);\n break;\n default:\n }\n },\n [id, end, nodes, expanded, actions, firstNodeId, lastNodeId, changeFocusedNodeId]\n );\n\n const actionsJSX = useMemo(() => {\n // since Actions may render a frag of buttons and we need a wrapper for flex space-between.\n return actions ? (\n <Flex as={StyledNodeActions} container>\n <Actions\n items={actions.map(action => {\n return {\n ...action,\n compact: true,\n onKeyDown: (e: KeyboardEvent) => {\n if (e.key === 'Enter') e.stopPropagation();\n }\n };\n })}\n menuAt={4}\n menuButtonProps={{\n onClick: (e: MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n },\n onKeyDown: (e: KeyboardEvent) => {\n e.stopPropagation();\n if (['ArrowUp', 'ArrowDown'].includes(e.key)) {\n e.preventDefault();\n }\n }\n }}\n />\n </Flex>\n ) : null;\n }, [actions]);\n\n const elRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (focusedEl) {\n elRef?.current?.focus();\n }\n }, [focusedEl]);\n\n const loadMoreButton = onLoadMore ? (\n <Flex container={{ alignItems: 'center' }}>\n <Button\n as={StyledLoadMoreButton}\n variant='link'\n tabIndex={focusedEl ? 0 : -1}\n aria-label={label}\n onClick={(e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n onLoadMore?.(id);\n onClick?.(id, e);\n }}\n ref={loadMoreRef}\n >\n {t('load_more')}\n </Button>\n </Flex>\n ) : undefined;\n\n const labelContent = useMemo(() => {\n if (contentRenderer) {\n const content = contentRenderer({\n id,\n label,\n secondary,\n icon,\n nodes,\n expanded,\n loading,\n actions,\n onClick,\n onLoadMore,\n href\n });\n return !nodes && (onClick ?? onNodeClick) ? (\n <Flex\n container={{ alignItems: 'center', justify: 'between', gap: 2 }}\n as={StyledNodeInteraction}\n forwardedAs={href ? 'a' : 'div'}\n role='treeitem'\n aria-current={current ? ariaCurrent : undefined}\n tabIndex={tabIndex}\n onClick={(e: MouseEvent<HTMLElement>) => {\n onClick?.(id, e);\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n }}\n href={href}\n onKeyDown={onKeyDown}\n ref={elRef}\n >\n {content}\n </Flex>\n ) : (\n content\n );\n }\n\n const internal = href ? (\n <Flex container={{ alignItems: 'center', gap: 0.5 }} as={StyledLabelContent}>\n {icon && <StyledNodeIcon name={icon} />}\n <Flex container={{ direction: 'column', pad: [0, 0.5, 0, 0.5] }}>\n <Link forwardedAs='span' href={href} previewable={!!onPreview} onPreview={onPreview}>\n {label}\n </Link>\n {secondary && <StyledSecondaryText variant='secondary'>{secondary}</StyledSecondaryText>}\n </Flex>\n </Flex>\n ) : (\n // Wrapping in a div for handling of flex space-between when there are node actions.\n <Flex container={{ alignItems: 'center', gap: 0.5 }} as={StyledLabelContent}>\n {icon && <StyledNodeIcon name={icon} />}\n <Flex container={{ direction: 'column', pad: [0, 0, 0, 0.5] }}>\n <StyledNodeText>{label}</StyledNodeText>\n {secondary && <StyledSecondaryText variant='secondary'>{secondary}</StyledSecondaryText>}\n </Flex>\n </Flex>\n );\n\n return !nodes && (onClick ?? onNodeClick) ? (\n <Flex\n container={{ alignItems: 'center', justify: 'between', gap: 2 }}\n as={StyledNodeInteraction}\n forwardedAs={href ? 'a' : 'div'}\n role='treeitem'\n aria-current={current ? ariaCurrent : undefined}\n tabIndex={tabIndex}\n onClick={(e: MouseEvent<HTMLElement>) => {\n onClick?.(id, e);\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n }}\n href={href}\n onKeyDown={onKeyDown}\n ref={elRef}\n >\n {loadMoreButton ?? internal}\n {actionsJSX}\n </Flex>\n ) : (\n internal\n );\n }, [\n id,\n label,\n icon,\n nodes,\n actions,\n onClick,\n onNodeClick,\n current,\n focusedEl,\n tabIndex,\n changeFocusedNodeId,\n onKeyDown\n ]);\n\n return (\n <StyledStandardTreeNode\n id={id}\n style={\n {\n '--depth': depth,\n '--has-parent': depth ? 1 : 0,\n '--has-parent-sibling': hasParentSibling ? 1 : 0,\n '--first-visible': firstNode ? 1 : 0,\n '--last-visible': lastNode ? 1 : 0\n } as CSSProperties\n }\n aria-busy={loading}\n >\n {nodes ? (\n <>\n <Flex\n container={{ alignItems: 'center', justify: 'between', gap: 2 }}\n as={StyledStandardTreeParent}\n forwardedAs={href ? 'a' : 'div'}\n role='treeitem'\n aria-current={current ? ariaCurrent : undefined}\n tabIndex={tabIndex}\n variant='text'\n onClick={selectableParents ? handleParentClick : handleParentToggle}\n onMouseOver={\n onNodeHover ? (e: MouseEvent<HTMLElement>) => onNodeHover(id, e) : undefined\n }\n href={selectableParents ? href : undefined}\n aria-expanded={expanded}\n aria-owns={`${id}-subtree`}\n onKeyDown={onKeyDown}\n ref={elRef}\n >\n <Flex container={{ alignItems: 'center' }} as={StyledLabelContainer}>\n {selectableParents ? (\n <Button\n as='span'\n variant='simple'\n tabIndex={-1}\n icon\n compact\n onClick={handleParentToggle}\n >\n <StyledToggleIcon name='caret-right' />\n </Button>\n ) : (\n <Flex\n as={StyledToggleIconWrapper}\n container={{ justify: 'center', alignItems: 'center' }}\n >\n <StyledToggleIcon name='caret-right' />\n </Flex>\n )}\n {labelContent}\n </Flex>\n {actionsJSX}\n </Flex>\n <StyledStandardTreeItemSubTree lined={lined} id={`${id}-subtree`}>\n {subTree}\n {loading && <Progress variant='ring' placement='inline' />}\n </StyledStandardTreeItemSubTree>\n </>\n ) : (\n <StyledStandardTreeLeaf\n onMouseOver={onNodeHover ? (e: MouseEvent<HTMLElement>) => onNodeHover(id, e) : undefined}\n >\n {labelContent}\n </StyledStandardTreeLeaf>\n )}\n </StyledStandardTreeNode>\n );\n};\n\nconst StandardTreeWithNodes: ForwardRefForwardPropsComponent<StandardTreeProps> = forwardRef(\n function StandardTreeWithNodes(\n {\n nodes: initialNodes,\n currentNodeId,\n onNodeClick,\n onNodeFocus,\n onNodeHover,\n onNodeToggle,\n onLoadMore,\n contentRenderer,\n lined = false,\n selectableParents = true,\n ...restProps\n }: PropsWithoutRef<StandardTreeProps>,\n ref: StandardTreeProps['ref']\n ) {\n const loadMoreId = useUID();\n const t = useI18n();\n\n const nodes = [\n ...helpers.mapTree(initialNodes, node => {\n if (node.onLoadMore && !node.loading) {\n return {\n ...node,\n onLoadMore: undefined,\n nodes: [\n ...(node.nodes ?? []),\n {\n id: `${loadMoreId}-${node.id}`,\n label: `${t('load_more')} - ${node.label}`,\n onLoadMore: () => {\n node.onLoadMore?.(node.id);\n }\n }\n ]\n };\n }\n return node;\n }),\n ...(onLoadMore\n ? [\n {\n id: loadMoreId,\n label: `${t('load_more')}`,\n onLoadMore\n }\n ]\n : [])\n ];\n\n const [focusedNodeId, setFocusedNodedId] = useState<string | undefined>();\n const treeRef = useConsolidatedRef(ref);\n\n const lastNodeId = useMemo(() => {\n return helpers.getDeepestNode(nodes, nodes[nodes.length - 1].id)?.id;\n }, [nodes]);\n\n const changeFocusedNodeId: StandardTreeContextProps['changeFocusedNodeId'] = useCallback(\n (id, type) => {\n switch (type) {\n case 'up': {\n const previousNode = helpers.getPreviousNode(nodes, id);\n if (previousNode) setFocusedNodedId(previousNode.id);\n break;\n }\n case 'down': {\n const nextNode = helpers.getNextNode(nodes, id);\n if (nextNode) setFocusedNodedId(nextNode.id);\n break;\n }\n case 'left': {\n const parentNode = helpers.getParentNode(nodes, id);\n if (parentNode) setFocusedNodedId(parentNode.id);\n break;\n }\n case 'right': {\n const childNode = helpers.getFirstChildNode(nodes, id);\n if (childNode) setFocusedNodedId(childNode.id);\n break;\n }\n default: {\n if (id !== focusedNodeId) setFocusedNodedId(id);\n break;\n }\n }\n },\n [nodes]\n );\n\n useEffect(() => {\n if (focusedNodeId) onNodeFocus?.(focusedNodeId);\n }, [focusedNodeId]);\n\n const onFocusChange = (focused: boolean) => {\n if (!focused) setFocusedNodedId('');\n };\n\n useFocusWithin([treeRef], onFocusChange);\n\n return (\n <StandardTreeContext.Provider\n value={useMemo(\n () => ({\n currentNodeId,\n focusedNodeId,\n lastNodeId,\n firstNodeId: nodes[0].id,\n changeFocusedNodeId,\n onNodeClick,\n onNodeHover,\n onNodeToggle,\n contentRenderer,\n lined,\n selectableParents\n }),\n [\n currentNodeId,\n onNodeClick,\n onNodeHover,\n lined,\n focusedNodeId,\n lastNodeId,\n onNodeToggle,\n contentRenderer,\n selectableParents\n ]\n )}\n >\n {/* FIXME: Types are having issues when styled(Tree) is typeof Tree. */}\n <StyledStandardTree\n {...restProps}\n ref={treeRef}\n nodes={nodes}\n nodeRenderer={NodeRenderer}\n />\n </StandardTreeContext.Provider>\n );\n }\n);\n\nconst StandardTree: ForwardRefForwardPropsComponent<StandardTreeProps> = forwardRef(\n function StandardTree(props: PropsWithoutRef<StandardTreeProps>, ref: StandardTreeProps['ref']) {\n return props.nodes.length > 0 ? <StandardTreeWithNodes {...props} ref={ref} /> : null;\n }\n);\n\nexport default StandardTree;\n"]}
|
|
1
|
+
{"version":3,"file":"StandardTree.js","sourceRoot":"","sources":["../../../src/components/Tree/StandardTree.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n createContext,\n useMemo,\n useContext,\n useCallback,\n useState,\n useEffect,\n useRef\n} from 'react';\nimport type { KeyboardEvent, PropsWithoutRef, CSSProperties, MouseEvent } from 'react';\n\nimport Progress from '../Progress';\nimport {\n useConsolidatedRef,\n useDirection,\n useFocusWithin,\n useI18n,\n useOS,\n useUID\n} from '../../hooks';\nimport Flex from '../Flex';\nimport Link from '../Link';\nimport Button from '../Button';\nimport Actions from '../Actions';\nimport type { ForwardRefForwardPropsComponent } from '../../types';\nimport { cap } from '../../utils';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport {\n StyledStandardTreeParent,\n StyledToggleIcon,\n StyledToggleIconWrapper,\n StyledStandardTreeItemSubTree,\n StyledStandardTreeLeaf,\n StyledStandardTree,\n StyledNodeInteraction,\n StyledStandardTreeNode,\n StyledNodeActions,\n StyledLabelContent,\n StyledNodeIcon,\n StyledNodeText,\n StyledLoadMoreButton,\n StyledSecondaryText,\n StyledLabelContainer\n} from './StandardTree.styles';\nimport type { TreeProps } from './Tree';\nimport type {\n StandardTreeContextProps,\n StandardTreeNode,\n StandardTreeProps,\n StandardTreePropsWithDefaults\n} from './StandardTree.types';\nimport helpers from './helpers';\n\nconst StandardTreeContext = createContext<\n Pick<\n StandardTreePropsWithDefaults,\n | 'currentNodeId'\n | 'contentRenderer'\n | 'lined'\n | 'onNodeClick'\n | 'onNodeHover'\n | 'onNodeToggle'\n | 'firstNodeId'\n | 'lastNodeId'\n | 'focusedNodeId'\n | 'changeFocusedNodeId'\n | 'selectableParents'\n >\n>({\n currentNodeId: undefined,\n lined: false,\n contentRenderer: () => undefined,\n onNodeClick: () => {},\n onNodeToggle: () => {},\n firstNodeId: undefined,\n lastNodeId: undefined,\n focusedNodeId: undefined,\n changeFocusedNodeId: () => {},\n selectableParents: true\n});\n\nconst NodeRenderer: TreeProps<StandardTreeNode>['nodeRenderer'] = ({\n id,\n label,\n secondary,\n icon,\n depth,\n hasParentSibling,\n nodes,\n expanded = false,\n loading = false,\n subTree,\n actions,\n onClick,\n onPreview,\n onLoadMore,\n href\n}) => {\n const {\n currentNodeId,\n contentRenderer,\n onNodeClick,\n onNodeToggle,\n onNodeHover,\n lined,\n focusedNodeId,\n changeFocusedNodeId,\n firstNodeId,\n lastNodeId,\n selectableParents\n } = useContext(StandardTreeContext);\n const current = currentNodeId === id;\n const focusedEl = focusedNodeId === id;\n const firstNode = firstNodeId === id;\n const lastNode = lastNodeId === id;\n const { start, end } = useDirection();\n const { macintosh } = useOS();\n const loadMoreRef = useRef<HTMLButtonElement>(null);\n const t = useI18n();\n\n const ariaCurrent = useMemo(() => {\n return href ? 'page' : true;\n }, [href]);\n\n const tabIndex = useMemo(() => {\n let index = -1;\n if (focusedNodeId) {\n index = focusedEl ? 0 : -1;\n } else if (currentNodeId && current) {\n index = 0;\n } else if (currentNodeId && nodes && helpers.getNode(nodes, currentNodeId)) {\n index = current ? 0 : -1;\n } else {\n index = firstNode ? 0 : -1;\n }\n return index;\n }, [focusedNodeId, currentNodeId, current, focusedEl]);\n\n const handleParentClick = useCallback(\n (e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n },\n [id, onNodeClick, changeFocusedNodeId]\n );\n\n const handleParentToggle = useCallback(\n (e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n e.preventDefault();\n e.stopPropagation();\n onNodeToggle?.(id, e);\n changeFocusedNodeId(id);\n },\n [id, onNodeToggle, changeFocusedNodeId]\n );\n\n const onKeyDown = useCallback(\n (e: KeyboardEvent<HTMLElement>) => {\n if (['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(e.key)) e.preventDefault();\n if (e.key === 'Enter' && !href) e.preventDefault();\n if (href && onPreview && e.getModifierState('Alt') && e.code === 'KeyP') {\n onPreview({ href });\n }\n switch (e.key) {\n case 'ArrowUp':\n changeFocusedNodeId(id, 'up');\n break;\n case 'ArrowDown':\n changeFocusedNodeId(id, 'down');\n break;\n case `Arrow${cap(end)}`:\n if (nodes) {\n if (expanded) {\n changeFocusedNodeId(id, 'right');\n } else {\n onNodeToggle?.(id);\n }\n }\n break;\n case `Arrow${cap(start)}`:\n if (expanded) {\n onNodeToggle?.(id);\n } else {\n changeFocusedNodeId(id, 'left');\n }\n break;\n case 'Enter':\n case ' ':\n onLoadMore?.(id);\n onClick?.(id, e);\n if (nodes) {\n if (selectableParents) {\n handleParentClick(e);\n } else {\n handleParentToggle(e);\n }\n } else {\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n }\n break;\n case 'Home':\n if (firstNodeId) changeFocusedNodeId(firstNodeId);\n break;\n case 'End':\n if (lastNodeId) changeFocusedNodeId(lastNodeId);\n break;\n default:\n }\n },\n [id, end, nodes, expanded, actions, firstNodeId, lastNodeId, changeFocusedNodeId]\n );\n\n const actionsJSX = useMemo(() => {\n // since Actions may render a frag of buttons and we need a wrapper for flex space-between.\n return actions ? (\n <Flex as={StyledNodeActions} container>\n <Actions\n items={actions.map(action => {\n return {\n ...action,\n compact: true,\n onKeyDown: (e: KeyboardEvent) => {\n if (e.key === 'Enter') e.stopPropagation();\n }\n };\n })}\n menuAt={4}\n menuButtonProps={{\n onClick: (e: MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n },\n onKeyDown: (e: KeyboardEvent) => {\n e.stopPropagation();\n if (['ArrowUp', 'ArrowDown'].includes(e.key)) {\n e.preventDefault();\n }\n }\n }}\n />\n </Flex>\n ) : null;\n }, [actions]);\n\n const elRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (focusedEl) {\n elRef?.current?.focus();\n }\n }, [focusedEl]);\n\n const loadMoreButton = onLoadMore ? (\n <Flex container={{ alignItems: 'center' }}>\n <Button\n as={StyledLoadMoreButton}\n variant='link'\n aria-label={label}\n onClick={(e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n onLoadMore?.(id);\n onClick?.(id, e);\n }}\n ref={loadMoreRef}\n >\n {t('load_more')}\n </Button>\n </Flex>\n ) : undefined;\n\n const labelContent = useMemo(() => {\n if (contentRenderer) {\n const content = contentRenderer({\n id,\n label,\n secondary,\n icon,\n nodes,\n expanded,\n loading,\n actions,\n onClick,\n onLoadMore,\n href\n });\n return !nodes && (onClick ?? onNodeClick) ? (\n <Flex\n container={{ alignItems: 'center', justify: 'between', gap: 2 }}\n as={StyledNodeInteraction}\n forwardedAs={href ? 'a' : 'div'}\n role='treeitem'\n aria-selected={false}\n aria-current={current ? ariaCurrent : undefined}\n tabIndex={tabIndex}\n onClick={(e: MouseEvent<HTMLElement>) => {\n onClick?.(id, e);\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n }}\n href={href}\n onKeyDown={onKeyDown}\n ref={elRef}\n >\n {content}\n </Flex>\n ) : (\n content\n );\n }\n\n const internal = href ? (\n <Flex container={{ alignItems: 'center', gap: 0.5 }} as={StyledLabelContent}>\n {icon && <StyledNodeIcon name={icon} />}\n <Flex container={{ direction: 'column', pad: [0, 0.5, 0, 0.5] }}>\n <Link forwardedAs='span' href={href} previewable={!!onPreview} onPreview={onPreview}>\n {label}\n </Link>\n {secondary && <StyledSecondaryText variant='secondary'>{secondary}</StyledSecondaryText>}\n <VisuallyHiddenText>\n {t('preview_link_instruction', [macintosh ? 'option' : 'alt'])}\n </VisuallyHiddenText>\n </Flex>\n </Flex>\n ) : (\n // Wrapping in a div for handling of flex space-between when there are node actions.\n <Flex container={{ alignItems: 'center', gap: 0.5 }} as={StyledLabelContent}>\n {icon && <StyledNodeIcon name={icon} />}\n <Flex container={{ direction: 'column', pad: [0, 0, 0, 0.5] }}>\n <StyledNodeText>{label}</StyledNodeText>\n {secondary && <StyledSecondaryText variant='secondary'>{secondary}</StyledSecondaryText>}\n </Flex>\n </Flex>\n );\n\n return !nodes && (onClick ?? onNodeClick) ? (\n <Flex\n container={{ alignItems: 'center', justify: 'between', gap: 2 }}\n as={StyledNodeInteraction}\n forwardedAs={href ? 'a' : 'div'}\n role='treeitem'\n aria-selected={false}\n aria-current={current ? ariaCurrent : undefined}\n tabIndex={tabIndex}\n onClick={(e: MouseEvent<HTMLElement>) => {\n onClick?.(id, e);\n onNodeClick?.(id, e);\n changeFocusedNodeId(id);\n }}\n href={href}\n onKeyDown={onKeyDown}\n ref={elRef}\n >\n {loadMoreButton ?? internal}\n {actionsJSX}\n </Flex>\n ) : (\n internal\n );\n }, [\n id,\n label,\n icon,\n nodes,\n actions,\n onClick,\n onNodeClick,\n current,\n focusedEl,\n tabIndex,\n changeFocusedNodeId,\n onKeyDown\n ]);\n\n return (\n <StyledStandardTreeNode\n id={id}\n style={\n {\n '--depth': depth,\n '--has-parent': depth ? 1 : 0,\n '--has-parent-sibling': hasParentSibling ? 1 : 0,\n '--first-visible': firstNode ? 1 : 0,\n '--last-visible': lastNode ? 1 : 0\n } as CSSProperties\n }\n aria-busy={loading}\n >\n {nodes ? (\n <>\n <Flex\n container={{ alignItems: 'center', justify: 'between', gap: 2 }}\n as={StyledStandardTreeParent}\n forwardedAs={href ? 'a' : 'div'}\n role='treeitem'\n aria-selected={false}\n aria-current={current ? ariaCurrent : undefined}\n tabIndex={tabIndex}\n variant='text'\n onClick={selectableParents ? handleParentClick : handleParentToggle}\n onMouseOver={\n onNodeHover ? (e: MouseEvent<HTMLElement>) => onNodeHover(id, e) : undefined\n }\n href={selectableParents ? href : undefined}\n aria-expanded={expanded}\n onKeyDown={onKeyDown}\n ref={elRef}\n >\n <Flex container={{ alignItems: 'center' }} as={StyledLabelContainer}>\n {selectableParents ? (\n <Button\n as='span'\n variant='simple'\n tabIndex={-1}\n icon\n compact\n onClick={handleParentToggle}\n >\n <StyledToggleIcon name='caret-right' />\n </Button>\n ) : (\n <Flex\n as={StyledToggleIconWrapper}\n container={{ justify: 'center', alignItems: 'center' }}\n >\n <StyledToggleIcon name='caret-right' />\n </Flex>\n )}\n {labelContent}\n </Flex>\n {actionsJSX}\n </Flex>\n <StyledStandardTreeItemSubTree lined={lined} id={`${id}-subtree`}>\n {subTree}\n {loading && <Progress variant='ring' placement='inline' />}\n </StyledStandardTreeItemSubTree>\n </>\n ) : (\n <StyledStandardTreeLeaf\n onMouseOver={onNodeHover ? (e: MouseEvent<HTMLElement>) => onNodeHover(id, e) : undefined}\n >\n {labelContent}\n </StyledStandardTreeLeaf>\n )}\n </StyledStandardTreeNode>\n );\n};\n\nconst StandardTreeWithNodes: ForwardRefForwardPropsComponent<StandardTreeProps> = forwardRef(\n function StandardTreeWithNodes(\n {\n nodes: initialNodes,\n currentNodeId,\n onNodeClick,\n onNodeFocus,\n onNodeHover,\n onNodeToggle,\n onLoadMore,\n contentRenderer,\n lined = false,\n selectableParents = true,\n ...restProps\n }: PropsWithoutRef<StandardTreeProps>,\n ref: StandardTreeProps['ref']\n ) {\n const loadMoreId = useUID();\n const t = useI18n();\n\n const nodes = [\n ...helpers.mapTree(initialNodes, node => {\n if (node.onLoadMore && !node.loading) {\n return {\n ...node,\n onLoadMore: undefined,\n nodes: [\n ...(node.nodes ?? []),\n {\n id: `${loadMoreId}-${node.id}`,\n label: `${t('load_more')} - ${node.label}`,\n onLoadMore: () => {\n node.onLoadMore?.(node.id);\n }\n }\n ]\n };\n }\n return node;\n }),\n ...(onLoadMore\n ? [\n {\n id: loadMoreId,\n label: `${t('load_more')}`,\n onLoadMore\n }\n ]\n : [])\n ];\n\n const [focusedNodeId, setFocusedNodedId] = useState<string | undefined>();\n const treeRef = useConsolidatedRef(ref);\n\n const lastNodeId = useMemo(() => {\n return helpers.getDeepestNode(nodes, nodes[nodes.length - 1].id)?.id;\n }, [nodes]);\n\n const changeFocusedNodeId: StandardTreeContextProps['changeFocusedNodeId'] = useCallback(\n (id, type) => {\n switch (type) {\n case 'up': {\n const previousNode = helpers.getPreviousNode(nodes, id);\n if (previousNode) setFocusedNodedId(previousNode.id);\n break;\n }\n case 'down': {\n const nextNode = helpers.getNextNode(nodes, id);\n if (nextNode) setFocusedNodedId(nextNode.id);\n break;\n }\n case 'left': {\n const parentNode = helpers.getParentNode(nodes, id);\n if (parentNode) setFocusedNodedId(parentNode.id);\n break;\n }\n case 'right': {\n const childNode = helpers.getFirstChildNode(nodes, id);\n if (childNode) setFocusedNodedId(childNode.id);\n break;\n }\n default: {\n if (id !== focusedNodeId) setFocusedNodedId(id);\n break;\n }\n }\n },\n [nodes]\n );\n\n useEffect(() => {\n if (focusedNodeId) onNodeFocus?.(focusedNodeId);\n }, [focusedNodeId]);\n\n const onFocusChange = (focused: boolean) => {\n if (!focused) setFocusedNodedId('');\n };\n\n useFocusWithin([treeRef], onFocusChange);\n\n return (\n <StandardTreeContext.Provider\n value={useMemo(\n () => ({\n currentNodeId,\n focusedNodeId,\n lastNodeId,\n firstNodeId: nodes[0].id,\n changeFocusedNodeId,\n onNodeClick,\n onNodeHover,\n onNodeToggle,\n contentRenderer,\n lined,\n selectableParents\n }),\n [\n currentNodeId,\n onNodeClick,\n onNodeHover,\n lined,\n focusedNodeId,\n lastNodeId,\n onNodeToggle,\n contentRenderer,\n selectableParents\n ]\n )}\n >\n {/* FIXME: Types are having issues when styled(Tree) is typeof Tree. */}\n <StyledStandardTree\n {...restProps}\n ref={treeRef}\n nodes={nodes}\n nodeRenderer={NodeRenderer}\n />\n </StandardTreeContext.Provider>\n );\n }\n);\n\nconst StandardTree: ForwardRefForwardPropsComponent<StandardTreeProps> = forwardRef(\n function StandardTree(props: PropsWithoutRef<StandardTreeProps>, ref: StandardTreeProps['ref']) {\n return props.nodes.length > 0 ? <StandardTreeWithNodes {...props} ref={ref} /> : null;\n }\n);\n\nexport default StandardTree;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "8.1
|
|
3
|
+
"version": "8.2.1",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|