npm - @pega/cosmos-react-build - Versions diffs - 4.0.0-dev.8.3 → 4.0.0-dev.9.0 - Mend

@pega/cosmos-react-build 4.0.0-dev.8.3 → 4.0.0-dev.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (57) hide show

package/lib/components/AppShell/AppShell.js CHANGED Viewed

@@ -22,7 +22,7 @@ const AppShell = forwardRef(({ main, appHeader, nav, ...restProps }, ref) => {
         ref: navRef,
         property: 'width',
         states: openCloseStates,
-        defaultState: 'closed'
+        defaultState: nav?.defaultExpanded === false ? 'closed' : 'open'
     });
     const skipLinks = useMemo(() => [
         {

package/lib/components/AppShell/AppShell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppShell.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,UAAU,EAAwB,OAAO,EAAE,MAAM,OAAO,CAAC;AAErF,OAAO,EACL,YAAY,EACZ,OAAO,EACP,IAAI,EAEJ,YAAY,EACZ,kBAAkB,EAClB,UAAU,EACV,kBAAkB,EAElB,IAAI,EACJ,OAAO,EACP,SAAS,EACV,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,sDAAsD,CAAC;AACvF,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAC1F,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AACnG,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AACnG,OAAO,KAAK,cAAc,MAAM,oEAAoE,CAAC;AAErG,OAAO,SAAS,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EACL,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,SAAS,EACT,0BAA0B,EAC3B,MAAM,mBAAmB,CAAC;AAC3B,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAEhD,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,YAAY,CAAC,SAAS,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,cAAc,EAAE,aAAa,CAAC,CAAC;AAE1F,MAAM,QAAQ,GAAoD,UAAU,CAC1E,CACE,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,SAAS,EAAkC,EACtE,GAAwB,EACxB,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IACtC,MAAM,MAAM,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAEvC,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,UAAU,EAAqB,CAAC;IAEhF,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAE,WAAW,EAAE,GAAG,kBAAkB,CAAC;QAC/D,GAAG,EAAE,MAAM;QACX,QAAQ,EAAE,OAAO;QACjB,MAAM,EAAE,eAAe;QACvB,YAAY,EAAE,QAAQ;~~KACvB~~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","sourcesContent":["import { FunctionComponent, forwardRef, PropsWithoutRef, Ref, useMemo } from 'react';\n\nimport {\n registerIcon,\n useI18n,\n Icon,\n ForwardProps,\n useDirection,\n useConsolidatedRef,\n useElement,\n useTransitionState,\n SkipLinksProps,\n Flex,\n Tooltip,\n SkipLinks\n} from '@pega/cosmos-react-core';\nimport { openCloseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\nimport * as caseSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/case-solid.icon';\nimport * as barsIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/bars.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\n\nimport AppHeader from './Header/AppHeader';\nimport {\n StyledScrollWrap,\n StyledMain,\n StyledUtils,\n StyledNav,\n StyledAppShellToggleButton\n} from './AppShell.styles';\nimport AppShellContext from './AppShellContext';\nimport type { AppShellProps } from './AppShell.types';\nimport NavigationList from './NavigationList';\n\nregisterIcon(timesIcon, plusIcon, caseSolidIcon, barsIcon, caretRightIcon, caretLeftIcon);\n\nconst AppShell: FunctionComponent<AppShellProps & ForwardProps> = forwardRef(\n (\n { main, appHeader, nav, ...restProps }: PropsWithoutRef<AppShellProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n const t = useI18n();\n\n const { start, end } = useDirection();\n const navRef = useConsolidatedRef(ref);\n\n const [expandCollapseEl, setExpandCollapseEl] = useElement<HTMLButtonElement>();\n\n const { state: navState, set: setNavState } = useTransitionState({\n ref: navRef,\n property: 'width',\n states: openCloseStates,\n defaultState: 'closed'\n });\n\n const skipLinks: SkipLinksProps['items'] = useMemo(\n () => [\n {\n label: t('go_to_main_content'),\n target: { ariaLabel: t('main_content'), selector: 'main' }\n }\n ],\n [t]\n );\n\n const openNav = () => {\n setNavState('open');\n };\n\n const closeNav = () => {\n setNavState('closed');\n };\n\n return (\n <AppShellContext.Provider\n value={useMemo(\n () => ({\n navOpen: navState === 'open' \|\| navState === 'opening',\n navState,\n openNav\n }),\n [navState]\n )}\n >\n <SkipLinks items={skipLinks} />\n <AppHeader {...appHeader} />\n\n {nav && (\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n justify: 'between'\n }}\n ref={navRef}\n as={StyledNav}\n >\n <StyledScrollWrap\n onClick={() => {\n if (['closing', 'closed'].includes(navState)) {\n openNav();\n } else {\n closeNav();\n }\n }}\n >\n <NavigationList {...nav} />\n </StyledScrollWrap>\n\n <Flex as={StyledUtils} container={{ justify: 'center' }}>\n <StyledAppShellToggleButton\n icon\n ref={setExpandCollapseEl}\n compact\n variant='simple'\n onClick={() => {\n setNavState(navState === 'closed' ? 'open' : 'closed');\n }}\n open={['open', 'opening'].includes(navState)}\n aria-label={navState === 'closed' ? t('expand') : t('collapse')}\n >\n <Icon\n name={`arrow-micro-${['closed', 'closing'].includes(navState) ? end : start}`}\n />\n </StyledAppShellToggleButton>\n {['open', 'closed'].includes(navState) && (\n <Tooltip\n target={expandCollapseEl}\n placement='right'\n showDelay='none'\n hideDelay='none'\n >\n {navState === 'closed' ? t('expand') : t('collapse')}\n </Tooltip>\n )}\n </Flex>\n </Flex>\n )}\n\n <StyledMain navOpen={['open', 'opening'].includes(navState)} hideNav={!nav}>\n {main}\n </StyledMain>\n </AppShellContext.Provider>\n );\n }\n);\n\nexport default AppShell;\n"]}
1	+ {"version":3,"file":"AppShell.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, forwardRef, PropsWithoutRef, Ref, useMemo } from 'react';\n\nimport {\n registerIcon,\n useI18n,\n Icon,\n ForwardProps,\n useDirection,\n useConsolidatedRef,\n useElement,\n useTransitionState,\n SkipLinksProps,\n Flex,\n Tooltip,\n SkipLinks\n} from '@pega/cosmos-react-core';\nimport { openCloseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\nimport * as caseSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/case-solid.icon';\nimport * as barsIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/bars.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\n\nimport AppHeader from './Header/AppHeader';\nimport {\n StyledScrollWrap,\n StyledMain,\n StyledUtils,\n StyledNav,\n StyledAppShellToggleButton\n} from './AppShell.styles';\nimport AppShellContext from './AppShellContext';\nimport type { AppShellProps } from './AppShell.types';\nimport NavigationList from './NavigationList';\n\nregisterIcon(timesIcon, plusIcon, caseSolidIcon, barsIcon, caretRightIcon, caretLeftIcon);\n\nconst AppShell: FunctionComponent<AppShellProps & ForwardProps> = forwardRef(\n (\n { main, appHeader, nav, ...restProps }: PropsWithoutRef<AppShellProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n const t = useI18n();\n\n const { start, end } = useDirection();\n const navRef = useConsolidatedRef(ref);\n\n const [expandCollapseEl, setExpandCollapseEl] = useElement<HTMLButtonElement>();\n\n const { state: navState, set: setNavState } = useTransitionState({\n ref: navRef,\n property: 'width',\n states: openCloseStates,\n defaultState: nav?.defaultExpanded === false ? 'closed' : 'open'\n });\n\n const skipLinks: SkipLinksProps['items'] = useMemo(\n () => [\n {\n label: t('go_to_main_content'),\n target: { ariaLabel: t('main_content'), selector: 'main' }\n }\n ],\n [t]\n );\n\n const openNav = () => {\n setNavState('open');\n };\n\n const closeNav = () => {\n setNavState('closed');\n };\n\n return (\n <AppShellContext.Provider\n value={useMemo(\n () => ({\n navOpen: navState === 'open' \|\| navState === 'opening',\n navState,\n openNav\n }),\n [navState]\n )}\n >\n <SkipLinks items={skipLinks} />\n <AppHeader {...appHeader} />\n\n {nav && (\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n justify: 'between'\n }}\n ref={navRef}\n as={StyledNav}\n >\n <StyledScrollWrap\n onClick={() => {\n if (['closing', 'closed'].includes(navState)) {\n openNav();\n } else {\n closeNav();\n }\n }}\n >\n <NavigationList {...nav} />\n </StyledScrollWrap>\n\n <Flex as={StyledUtils} container={{ justify: 'center' }}>\n <StyledAppShellToggleButton\n icon\n ref={setExpandCollapseEl}\n compact\n variant='simple'\n onClick={() => {\n setNavState(navState === 'closed' ? 'open' : 'closed');\n }}\n open={['open', 'opening'].includes(navState)}\n aria-label={navState === 'closed' ? t('expand') : t('collapse')}\n >\n <Icon\n name={`arrow-micro-${['closed', 'closing'].includes(navState) ? end : start}`}\n />\n </StyledAppShellToggleButton>\n {['open', 'closed'].includes(navState) && (\n <Tooltip\n target={expandCollapseEl}\n placement='right'\n showDelay='none'\n hideDelay='none'\n >\n {navState === 'closed' ? t('expand') : t('collapse')}\n </Tooltip>\n )}\n </Flex>\n </Flex>\n )}\n\n <StyledMain navOpen={['open', 'opening'].includes(navState)} hideNav={!nav}>\n {main}\n </StyledMain>\n </AppShellContext.Provider>\n );\n }\n);\n\nexport default AppShell;\n"]}

package/lib/components/AppShell/AppShell.styles.js CHANGED Viewed

@@ -58,7 +58,7 @@ export const StyledMain = styled.main(({ navOpen, hideNav, theme: { base: { anim
       }
       @media (min-width: ${breakpoints.md}) {
-        height: calc(100vh - 3rem);
+        min-height: calc(100vh - 3rem);
       }
       ${navOpen &&
@@ -91,7 +91,7 @@ export const StyledNav = styled.nav(({ theme: { base: { breakpoints, colors, pal
         ${StyledNodeText}, ${StyledToggleIcon} {
           color: rgba(255, 255, 255, 0.7);
-          font-size: ${fontSizes.xxs};
+          font-size: ${fontSizes.s};
         }
         ${StyledNodeInteraction} {

package/lib/components/AppShell/AppShell.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { lighten, rgba } from 'polished';\nimport { useContext } from 'react';\n\nimport {\n tryCatch,\n defaultThemeProp,\n Button,\n StyledIcon,\n useDirection,\n calculateFontSize\n} from '@pega/cosmos-react-core';\nimport {\n StyledToggleIcon,\n StyledNodeText,\n StyledNodeInteraction,\n StyledStandardTree\n} from '@pega/cosmos-react-core/lib/components/Tree/StandardTree.styles';\n\nimport AppShellContext from './AppShellContext';\n\nconst navWidth = '3rem';\nconst navOpenWidth = '14rem';\n\nexport const StyledUtils = styled.div(({ theme }) => {\n const borderColor = tryCatch(() =>\n lighten(0.1, theme.components['app-shell'].nav['background-color'])\n );\n\n return css`\n padding-block: ${theme.base.spacing};\n border-block-start: 0.0625rem solid ${borderColor};\n `;\n});\n\nStyledUtils.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellToggleButton = styled(Button)<{ open: boolean }>(({ theme, open }) => {\n return css`\n background-color: ${theme.base.palette.dark};\n color: ${theme.base.palette.light};\n border: none;\n\n ${open &&\n css`\n padding-inline: 1rem;\n `}\n\n ${StyledIcon} {\n width: 1.25rem;\n height: 1.25rem;\n font-weight: bold;\n }\n\n &:enabled:focus,\n :not([disabled]):focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n});\n\nStyledAppShellToggleButton.defaultProps = defaultThemeProp;\n\nexport const StyledScrollWrap = styled.div(() => {\n return css`\n height: 100%;\n overflow-y: auto;\n `;\n});\n\nStyledScrollWrap.defaultProps = defaultThemeProp;\n\nexport const StyledMain = styled.main<{\n navOpen: boolean;\n hideNav: boolean;\n}>(\n ({\n navOpen,\n hideNav,\n theme: {\n base: { animation, breakpoints, palette }\n }\n }) => {\n return css`\n position: relative;\n min-height: calc(100vh - 6rem);\n background-color: ${palette['app-background']};\n margin-inline-start: ${navWidth};\n transition: margin-inline-start ${`${animation.speed} ${animation.timing.ease}`};\n\n @media (pointer: coarse) {\n min-height: calc(100vh - 8rem);\n }\n\n @media (min-width: ${breakpoints.md}) {\n height: calc(100vh - 3rem);\n }\n\n ${navOpen &&\n css`\n margin-inline-start: ${navOpenWidth};\n `}\n\n ${hideNav &&\n css`\n transition-duration: 0s;\n margin-inline-start: 0;\n `}\n `;\n }\n);\n\nStyledMain.defaultProps = defaultThemeProp;\n\nexport const StyledNav = styled.nav(\n ({\n theme: {\n base: {\n breakpoints,\n colors,\n palette,\n animation,\n spacing,\n shadow,\n 'custom-scrollbar': customScrollbar,\n 'border-radius': borderRadius,\n 'font-size': fontSize,\n 'font-scale': fontScale\n },\n components: { 'app-shell': appShell }\n }\n }) => {\n const { navState } = useContext(AppShellContext);\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n position: fixed;\n z-index: 1;\n height: calc(100vh - 6rem);\n background: ${appShell.nav['background-color']};\n width: ${navState === 'opening' \|\| navState === 'open' ? navOpenWidth : navWidth};\n transition: width ${animation.speed} ${animation.timing.ease};\n display: flex;\n\n ${StyledStandardTree} {\n background-color: ${palette.dark};\n\n ${StyledNodeText}, ${StyledToggleIcon} {\n color: rgba(255, 255, 255, 0.7);\n font-size: ${fontSizes.xxs};\n }\n\n ${StyledNodeInteraction} {\n padding-block-start: calc(0.5 * ${spacing});\n padding-block-end: calc(0.5 * ${spacing});\n\n &:hover {\n background: rgba(255, 255, 255, 0.1);\n\n ${StyledNodeText} {\n color: ${palette.light};\n }\n }\n\n &:focus {\n box-shadow: ${shadow['focus-inset']};\n }\n\n &[aria-current='page'],\n &[aria-current='true'] {\n background: rgba(255, 255, 255, 0.05);\n\n ${StyledNodeText} {\n color: ${colors.blue.light};\n }\n }\n }\n\n &:has(:focus-visible) {\n box-shadow: inset 0 0 0 0.125rem #71c1ff99;\n }\n }\n\n ${customScrollbar &&\n css`\n * {\n scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.2);\n scrollbar-width: thin;\n }\n\n @supports not ((scrollbar-width: thin) or (scrollbar-color: black white)) {\n /* stylelint-disable unit-allowed-list /\n\n ::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n }\n\n ::-webkit-scrollbar-track {\n background-color: rgba(0, 0, 0, 0.2);\n }\n\n ::-webkit-scrollbar-corner {\n background-color: rgba(0, 0, 0, 0.2);\n border-bottom-right-radius: inherit;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 3px solid transparent;\n border-radius: calc(1.125 ${borderRadius});\n box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.6);\n }\n\n ::-webkit-scrollbar-thumb:hover {\n box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.7);\n }\n\n ::-webkit-scrollbar-track:horizontal {\n border-bottom-left-radius: inherit;\n }\n\n ::-webkit-scrollbar-track:vertical {\n border-top-right-radius: inherit;\n }\n\n / stylelint-disable-next-line selector-pseudo-class-no-unknown /\n ::-webkit-scrollbar-track:not(:corner-present) {\n border-bottom-right-radius: inherit;\n }\n\n /* stylelint-enable unit-allowed-list /\n }\n `}\n\n @media (pointer: coarse) {\n height: calc(100vh - 8rem);\n }\n\n @media (min-width: ${breakpoints.md}) {\n height: calc(100vh - 3rem);\n }\n `;\n }\n);\n\nStyledNav.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellCaretIcon = styled.svg<{ nestedListCollapsed?: boolean }>(\n ({ nestedListCollapsed, theme }) => {\n const { rtl } = useDirection();\n\n return css`\n transition-property: transform;\n transition-duration: ${theme.base.animation.speed};\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n ${nestedListCollapsed === false &&\n css`\n transform: rotateZ(${rtl ? '-90deg' : '90deg'});\n `}\n `;\n }\n);\n\nStyledAppShellCaretIcon.defaultProps = defaultThemeProp;\n\nexport const StyledNavListItem = styled.li(({ theme }) => {\n const { navOpen } = useContext(AppShellContext);\n const activeBackground = tryCatch(() =>\n rgba('#000000', theme.base.transparency['transparent-4'])\n );\n\n return css`\n display: block;\n position: relative;\n ${StyledIcon} {\n font-size: 1.25rem;\n }\n\n > :first-child {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n padding: calc(1.25 ${theme.base.spacing}) 0;\n white-space: nowrap;\n color: rgba(255, 255, 255, 0.7);\n cursor: pointer;\n font-weight: ${theme.base['font-weight']['semi-bold']};\n text-decoration: none;\n\n span {\n overflow: hidden;\n color: inherit;\n }\n\n &:hover,\n &:focus {\n color: ${theme.base.palette.light};\n background: rgba(255, 255, 255, 0.05);\n }\n\n &:focus {\n outline: none;\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n\n ${StyledAppShellCaretIcon}:last-child {\n position: absolute;\n left: ${navOpen ? 'auto' : '100%'};\n ${navOpen &&\n css`\n inset-inline-end: 1rem;\n `}\n margin: 0;\n opacity: ${navOpen ? '1' : '0'};\n transition-property: opacity;\n }\n\n ${StyledIcon}:first-child {\n flex-shrink: 0;\n margin: 0 calc((${navWidth} - 1.125rem) / 2);\n }\n }\n\n &[aria-current='page'] > :first-child,\n &[aria-current='true'] > :first-child,\n &:has([aria-current='page']) > :first-child,\n &:has([aria-current='true']) > :first-child {\n color: ${theme.base.colors.blue.light};\n background-color: ${activeBackground};\n }\n `;\n});\n\nStyledNavListItem.defaultProps = defaultThemeProp;\n\nexport const StyledNavList = styled.ul``;\n"]}
1	+ {"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,MAAM,EACN,UAAU,EACV,YAAY,EACZ,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,qBAAqB,EACrB,kBAAkB,EACnB,MAAM,iEAAiE,CAAC;AAEzE,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAEhD,MAAM,QAAQ,GAAG,MAAM,CAAC;AACxB,MAAM,YAAY,GAAG,OAAO,CAAC;AAE7B,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAClD,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,CAChC,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC,CACpE,CAAC;IAEF,OAAO,GAAG,CAAA;qBACS,KAAK,CAAC,IAAI,CAAC,OAAO;0CACG,WAAW;GAClD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE5C,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAoB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;IAC9F,OAAO,GAAG,CAAA;wBACY,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI;aAClC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;;;MAG/B,IAAI;QACN,GAAG,CAAA;;KAEF;;MAEC,UAAU;;;;;;;;oBAQI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;GAExC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3D,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;IAC9C,OAAO,GAAG,CAAA;;;GAGT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAInC,CAAC,EACC,OAAO,EACP,OAAO,EACP,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,EAC1C,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;0BAGY,OAAO,CAAC,gBAAgB,CAAC;6BACtB,QAAQ;wCACG,GAAG,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,MAAM,CAAC,IAAI,EAAE;;;;;;2BAM1D,WAAW,CAAC,EAAE;;;;QAIjC,OAAO;QACT,GAAG,CAAA;+BACsB,YAAY;OACpC;;QAEC,OAAO;QACT,GAAG,CAAA;;;OAGF;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CACjC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,WAAW,EACX,MAAM,EACN,OAAO,EACP,SAAS,EACT,OAAO,EACP,MAAM,EACN,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,WAAW,EAAE,QAAQ,EACrB,YAAY,EAAE,SAAS,EACxB,EACD,UAAU,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,EACtC,EACF,EAAE,EAAE;IACH,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,iBAAiB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;;;;oBAIM,QAAQ,CAAC,GAAG,CAAC,kBAAkB,CAAC;eACrC,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ;0BAC5D,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,MAAM,CAAC,IAAI;;;QAG1D,kBAAkB;4BACE,OAAO,CAAC,IAAI;;UAE9B,cAAc,KAAK,gBAAgB;;uBAEtB,SAAS,CAAC,CAAC;;;UAGxB,qBAAqB;4CACa,OAAO;0CACT,OAAO;;;;;cAKnC,cAAc;uBACL,OAAO,CAAC,KAAK;;;;;0BAKV,MAAM,CAAC,aAAa,CAAC;;;;;;;cAOjC,cAAc;uBACL,MAAM,CAAC,IAAI,CAAC,KAAK;;;;;;;;;;QAUhC,eAAe;QACjB,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;0CA0BiC,YAAY;;;;;;;;;;;;;;;;;;;;;;;OAuB/C;;;;;;2BAMoB,WAAW,CAAC,EAAE;;;KAGpC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE1C,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAC/C,CAAC,EAAE,mBAAmB,EAAE,KAAK,EAAE,EAAE,EAAE;IACjC,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAE/B,OAAO,GAAG,CAAA;;6BAEe,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;oCACnB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;;QAE5D,mBAAmB,KAAK,KAAK;QAC/B,GAAG,CAAA;6BACoB,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;OAC9C;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvD,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAChD,MAAM,gBAAgB,GAAG,QAAQ,CAAC,GAAG,EAAE,CACrC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,CAC1D,CAAC;IAEF,OAAO,GAAG,CAAA;;;MAGN,UAAU;;;;;;;;;6BASa,KAAK,CAAC,IAAI,CAAC,OAAO;;;;qBAI1B,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;iBAU1C,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;;;;;;sBAMnB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;;;QAG9C,uBAAuB;;gBAEf,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;UAC/B,OAAO;QACT,GAAG,CAAA;;SAEF;;mBAEU,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG;;;;QAI9B,UAAU;;0BAEQ,QAAQ;;;;;;;;eAQnB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK;0BACjB,gBAAgB;;GAEvC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,EAAE,CAAA,EAAE,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { lighten, rgba } from 'polished';\nimport { useContext } from 'react';\n\nimport {\n tryCatch,\n defaultThemeProp,\n Button,\n StyledIcon,\n useDirection,\n calculateFontSize\n} from '@pega/cosmos-react-core';\nimport {\n StyledToggleIcon,\n StyledNodeText,\n StyledNodeInteraction,\n StyledStandardTree\n} from '@pega/cosmos-react-core/lib/components/Tree/StandardTree.styles';\n\nimport AppShellContext from './AppShellContext';\n\nconst navWidth = '3rem';\nconst navOpenWidth = '14rem';\n\nexport const StyledUtils = styled.div(({ theme }) => {\n const borderColor = tryCatch(() =>\n lighten(0.1, theme.components['app-shell'].nav['background-color'])\n );\n\n return css`\n padding-block: ${theme.base.spacing};\n border-block-start: 0.0625rem solid ${borderColor};\n `;\n});\n\nStyledUtils.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellToggleButton = styled(Button)<{ open: boolean }>(({ theme, open }) => {\n return css`\n background-color: ${theme.base.palette.dark};\n color: ${theme.base.palette.light};\n border: none;\n\n ${open &&\n css`\n padding-inline: 1rem;\n `}\n\n ${StyledIcon} {\n width: 1.25rem;\n height: 1.25rem;\n font-weight: bold;\n }\n\n &:enabled:focus,\n :not([disabled]):focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n});\n\nStyledAppShellToggleButton.defaultProps = defaultThemeProp;\n\nexport const StyledScrollWrap = styled.div(() => {\n return css`\n height: 100%;\n overflow-y: auto;\n `;\n});\n\nStyledScrollWrap.defaultProps = defaultThemeProp;\n\nexport const StyledMain = styled.main<{\n navOpen: boolean;\n hideNav: boolean;\n}>(\n ({\n navOpen,\n hideNav,\n theme: {\n base: { animation, breakpoints, palette }\n }\n }) => {\n return css`\n position: relative;\n min-height: calc(100vh - 6rem);\n background-color: ${palette['app-background']};\n margin-inline-start: ${navWidth};\n transition: margin-inline-start ${`${animation.speed} ${animation.timing.ease}`};\n\n @media (pointer: coarse) {\n min-height: calc(100vh - 8rem);\n }\n\n @media (min-width: ${breakpoints.md}) {\n min-height: calc(100vh - 3rem);\n }\n\n ${navOpen &&\n css`\n margin-inline-start: ${navOpenWidth};\n `}\n\n ${hideNav &&\n css`\n transition-duration: 0s;\n margin-inline-start: 0;\n `}\n `;\n }\n);\n\nStyledMain.defaultProps = defaultThemeProp;\n\nexport const StyledNav = styled.nav(\n ({\n theme: {\n base: {\n breakpoints,\n colors,\n palette,\n animation,\n spacing,\n shadow,\n 'custom-scrollbar': customScrollbar,\n 'border-radius': borderRadius,\n 'font-size': fontSize,\n 'font-scale': fontScale\n },\n components: { 'app-shell': appShell }\n }\n }) => {\n const { navState } = useContext(AppShellContext);\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n position: fixed;\n z-index: 1;\n height: calc(100vh - 6rem);\n background: ${appShell.nav['background-color']};\n width: ${navState === 'opening' \|\| navState === 'open' ? navOpenWidth : navWidth};\n transition: width ${animation.speed} ${animation.timing.ease};\n display: flex;\n\n ${StyledStandardTree} {\n background-color: ${palette.dark};\n\n ${StyledNodeText}, ${StyledToggleIcon} {\n color: rgba(255, 255, 255, 0.7);\n font-size: ${fontSizes.s};\n }\n\n ${StyledNodeInteraction} {\n padding-block-start: calc(0.5 * ${spacing});\n padding-block-end: calc(0.5 * ${spacing});\n\n &:hover {\n background: rgba(255, 255, 255, 0.1);\n\n ${StyledNodeText} {\n color: ${palette.light};\n }\n }\n\n &:focus {\n box-shadow: ${shadow['focus-inset']};\n }\n\n &[aria-current='page'],\n &[aria-current='true'] {\n background: rgba(255, 255, 255, 0.05);\n\n ${StyledNodeText} {\n color: ${colors.blue.light};\n }\n }\n }\n\n &:has(:focus-visible) {\n box-shadow: inset 0 0 0 0.125rem #71c1ff99;\n }\n }\n\n ${customScrollbar &&\n css`\n * {\n scrollbar-color: rgba(255, 255, 255, 0.6) rgba(0, 0, 0, 0.2);\n scrollbar-width: thin;\n }\n\n @supports not ((scrollbar-width: thin) or (scrollbar-color: black white)) {\n /* stylelint-disable unit-allowed-list /\n\n ::-webkit-scrollbar {\n width: 12px;\n height: 12px;\n }\n\n ::-webkit-scrollbar-track {\n background-color: rgba(0, 0, 0, 0.2);\n }\n\n ::-webkit-scrollbar-corner {\n background-color: rgba(0, 0, 0, 0.2);\n border-bottom-right-radius: inherit;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: transparent;\n border: 3px solid transparent;\n border-radius: calc(1.125 ${borderRadius});\n box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.6);\n }\n\n ::-webkit-scrollbar-thumb:hover {\n box-shadow: inset 0 0 2px 4px rgba(255, 255, 255, 0.7);\n }\n\n ::-webkit-scrollbar-track:horizontal {\n border-bottom-left-radius: inherit;\n }\n\n ::-webkit-scrollbar-track:vertical {\n border-top-right-radius: inherit;\n }\n\n / stylelint-disable-next-line selector-pseudo-class-no-unknown /\n ::-webkit-scrollbar-track:not(:corner-present) {\n border-bottom-right-radius: inherit;\n }\n\n /* stylelint-enable unit-allowed-list /\n }\n `}\n\n @media (pointer: coarse) {\n height: calc(100vh - 8rem);\n }\n\n @media (min-width: ${breakpoints.md}) {\n height: calc(100vh - 3rem);\n }\n `;\n }\n);\n\nStyledNav.defaultProps = defaultThemeProp;\n\nexport const StyledAppShellCaretIcon = styled.svg<{ nestedListCollapsed?: boolean }>(\n ({ nestedListCollapsed, theme }) => {\n const { rtl } = useDirection();\n\n return css`\n transition-property: transform;\n transition-duration: ${theme.base.animation.speed};\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n ${nestedListCollapsed === false &&\n css`\n transform: rotateZ(${rtl ? '-90deg' : '90deg'});\n `}\n `;\n }\n);\n\nStyledAppShellCaretIcon.defaultProps = defaultThemeProp;\n\nexport const StyledNavListItem = styled.li(({ theme }) => {\n const { navOpen } = useContext(AppShellContext);\n const activeBackground = tryCatch(() =>\n rgba('#000000', theme.base.transparency['transparent-4'])\n );\n\n return css`\n display: block;\n position: relative;\n ${StyledIcon} {\n font-size: 1.25rem;\n }\n\n > :first-child {\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n padding: calc(1.25 ${theme.base.spacing}) 0;\n white-space: nowrap;\n color: rgba(255, 255, 255, 0.7);\n cursor: pointer;\n font-weight: ${theme.base['font-weight']['semi-bold']};\n text-decoration: none;\n\n span {\n overflow: hidden;\n color: inherit;\n }\n\n &:hover,\n &:focus {\n color: ${theme.base.palette.light};\n background: rgba(255, 255, 255, 0.05);\n }\n\n &:focus {\n outline: none;\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n\n ${StyledAppShellCaretIcon}:last-child {\n position: absolute;\n left: ${navOpen ? 'auto' : '100%'};\n ${navOpen &&\n css`\n inset-inline-end: 1rem;\n `}\n margin: 0;\n opacity: ${navOpen ? '1' : '0'};\n transition-property: opacity;\n }\n\n ${StyledIcon}:first-child {\n flex-shrink: 0;\n margin: 0 calc((${navWidth} - 1.125rem) / 2);\n }\n }\n\n &[aria-current='page'] > :first-child,\n &[aria-current='true'] > :first-child,\n &:has([aria-current='page']) > :first-child,\n &:has([aria-current='true']) > :first-child {\n color: ${theme.base.colors.blue.light};\n background-color: ${activeBackground};\n }\n `;\n});\n\nStyledNavListItem.defaultProps = defaultThemeProp;\n\nexport const StyledNavList = styled.ul``;\n"]}

package/lib/components/AppShell/AppShell.types.d.ts CHANGED Viewed

@@ -40,6 +40,11 @@ export interface NavProps {
     items: NavItemProps[];
     /** The id of the active nav item. */
     currentItemId?: NavItemProps['id'];
+    /**
+     * If true, the nav will be expanded on initial load.
+     * @default true
+     * */
+    defaultExpanded?: boolean;
 }
 export interface AppShellProps extends NoChildrenProp {
     /** The content of the application. */

package/lib/components/AppShell/AppShell.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppShell.types.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAC5E,OAAO,EAAE,eAAe,EAAE,MAAM,sDAAsD,CAAC;AAEvF,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE1D,MAAM,WAAW,kBAAkB;IACjC,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxF,iCAAiC;IACjC,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAC;CAC9B;AAED,UAAU,kBAAkB;IAC1B,iCAAiC;IACjC,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC7B,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,YAAY;IACpB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mGAAmG;IACnG,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxF,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,oBAAY,YAAY,GAAG;IACzB,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,IAAI,EAAE,MAAM,CAAC;CACd,GAAG,CAAC,kBAAkB,GAAG,YAAY,CAAC,CAAC;AAExC,MAAM,WAAW,QAAQ;IACvB,sEAAsE;IACtE,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,qCAAqC;IACrC,aAAa,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC;~~CACpC~~;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD,sCAAsC;IACtC,IAAI,EAAE,SAAS,CAAC;IAChB,6CAA6C;IAC7C,SAAS,EAAE,cAAc,CAAC;IAC1B,sDAAsD;IACtD,GAAG,CAAC,EAAE,QAAQ,CAAC;CAChB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,eAAe,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC;IAC/D,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,kBAAmB,SAAQ,MAAM,EAAE,SAAS,EAAE,cAAc;IAC3E,EAAE,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC;IACvB,KAAK,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAC7B,MAAM,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACpC,aAAa,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC;CACpC"}
1	+ {"version":3,"file":"AppShell.types.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAC5E,OAAO,EAAE,eAAe,EAAE,MAAM,sDAAsD,CAAC;AAEvF,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE1D,MAAM,WAAW,kBAAkB;IACjC,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,sCAAsC;IACtC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxF,iCAAiC;IACjC,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAC;CAC9B;AAED,UAAU,kBAAkB;IAC1B,iCAAiC;IACjC,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC7B,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,YAAY;IACpB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mGAAmG;IACnG,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,GAAG,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACxF,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,oBAAY,YAAY,GAAG;IACzB,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,IAAI,EAAE,MAAM,CAAC;CACd,GAAG,CAAC,kBAAkB,GAAG,YAAY,CAAC,CAAC;AAExC,MAAM,WAAW,QAAQ;IACvB,sEAAsE;IACtE,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,qCAAqC;IACrC,aAAa,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC;IACnC;;;SAGK;IACL,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc;IACnD,sCAAsC;IACtC,IAAI,EAAE,SAAS,CAAC;IAChB,6CAA6C;IAC7C,SAAS,EAAE,cAAc,CAAC;IAC1B,sDAAsD;IACtD,GAAG,CAAC,EAAE,QAAQ,CAAC;CAChB;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,eAAe,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC;IAC/D,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,kBAAmB,SAAQ,MAAM,EAAE,SAAS,EAAE,cAAc;IAC3E,EAAE,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC;IACvB,KAAK,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAC7B,MAAM,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACpC,aAAa,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAC;CACpC"}

package/lib/components/AppShell/AppShell.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppShell.types.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.types.ts"],"names":[],"mappings":"","sourcesContent":["import { KeyboardEvent, MouseEvent, ReactNode } from 'react';\n\nimport { AsProp, BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';\nimport { openCloseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\n\nimport { AppHeaderProps } from './Header/AppHeader.types';\n\nexport interface NestedNavItemProps {\n /** Unique id for the nav item. /\n id: string;\n /* The display text of the nav item. /\n label: string;\n /* URL or DOM id to navigate to. This will render the nav item as a link. /\n href?: string;\n /* Click handler for the nav item. /\n onClick?: (id: string, e: MouseEvent<HTMLElement> \| KeyboardEvent<HTMLElement>) => void;\n /* A set of nested nav items. /\n items?: NestedNavItemProps[];\n}\n\ninterface ParentNavItemProps {\n /* A set of nested nav items. /\n items?: NestedNavItemProps[];\n href?: never;\n onClick?: never;\n}\n\ninterface NavLinkProps {\n /* URL or DOM id to navigate to. This will render the nav item as a link. /\n href?: string;\n /* Click handler for the link. If no href if passed, this will render the nav item as a button. /\n onClick?: (id: string, e: MouseEvent<HTMLElement> \| KeyboardEvent<HTMLElement>) => void;\n items?: never;\n}\n\nexport type NavItemProps = {\n /* Unique id for the nav item. /\n id: string;\n /* The display text of the nav item. /\n label: string;\n /* The name of the Cosmos Icon to render as a visual. Only applies to top-level nav items. /\n icon: string;\n} & (ParentNavItemProps \| NavLinkProps);\n\nexport interface NavProps {\n /* A set of nav items that will render as a list in the App Shell. /\n items: NavItemProps[];\n /* The id of the active nav item. /\n currentItemId?: NavItemProps['id'];\n}\n\nexport interface AppShellProps extends NoChildrenProp {\n /* The content of the application. /\n main: ReactNode;\n /* Props related to the App Shell header. /\n appHeader: AppHeaderProps;\n /* Props related to the App Shell side navigation. */\n nav?: NavProps;\n}\n\nexport interface AppShellContextValue {\n navOpen: boolean;\n navState: typeof openCloseStates[keyof typeof openCloseStates];\n openNav: () => void;\n}\n\nexport interface NavItemRenderProps extends AsProp, BaseProps, NoChildrenProp {\n id: NavItemProps['id'];\n label: NavItemProps['label'];\n visual: ReactNode;\n href?: NavLinkProps['href'];\n onClick?: NavLinkProps['onClick'];\n items?: NestedNavItemProps['items'];\n currentItemId?: NavItemProps['id'];\n}\n"]}
1	+ {"version":3,"file":"AppShell.types.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.types.ts"],"names":[],"mappings":"","sourcesContent":["import { KeyboardEvent, MouseEvent, ReactNode } from 'react';\n\nimport { AsProp, BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';\nimport { openCloseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\n\nimport { AppHeaderProps } from './Header/AppHeader.types';\n\nexport interface NestedNavItemProps {\n /** Unique id for the nav item. /\n id: string;\n /* The display text of the nav item. /\n label: string;\n /* URL or DOM id to navigate to. This will render the nav item as a link. /\n href?: string;\n /* Click handler for the nav item. /\n onClick?: (id: string, e: MouseEvent<HTMLElement> \| KeyboardEvent<HTMLElement>) => void;\n /* A set of nested nav items. /\n items?: NestedNavItemProps[];\n}\n\ninterface ParentNavItemProps {\n /* A set of nested nav items. /\n items?: NestedNavItemProps[];\n href?: never;\n onClick?: never;\n}\n\ninterface NavLinkProps {\n /* URL or DOM id to navigate to. This will render the nav item as a link. /\n href?: string;\n /* Click handler for the link. If no href if passed, this will render the nav item as a button. /\n onClick?: (id: string, e: MouseEvent<HTMLElement> \| KeyboardEvent<HTMLElement>) => void;\n items?: never;\n}\n\nexport type NavItemProps = {\n /* Unique id for the nav item. /\n id: string;\n /* The display text of the nav item. /\n label: string;\n /* The name of the Cosmos Icon to render as a visual. Only applies to top-level nav items. /\n icon: string;\n} & (ParentNavItemProps \| NavLinkProps);\n\nexport interface NavProps {\n /* A set of nav items that will render as a list in the App Shell. /\n items: NavItemProps[];\n /* The id of the active nav item. /\n currentItemId?: NavItemProps['id'];\n /\n If true, the nav will be expanded on initial load.\n * @default true\n * /\n defaultExpanded?: boolean;\n}\n\nexport interface AppShellProps extends NoChildrenProp {\n /* The content of the application. /\n main: ReactNode;\n /* Props related to the App Shell header. /\n appHeader: AppHeaderProps;\n /* Props related to the App Shell side navigation. */\n nav?: NavProps;\n}\n\nexport interface AppShellContextValue {\n navOpen: boolean;\n navState: typeof openCloseStates[keyof typeof openCloseStates];\n openNav: () => void;\n}\n\nexport interface NavItemRenderProps extends AsProp, BaseProps, NoChildrenProp {\n id: NavItemProps['id'];\n label: NavItemProps['label'];\n visual: ReactNode;\n href?: NavLinkProps['href'];\n onClick?: NavLinkProps['onClick'];\n items?: NestedNavItemProps['items'];\n currentItemId?: NavItemProps['id'];\n}\n"]}

package/lib/components/AppShell/NavigationList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;~~AAkBf~~,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;~~AA2HhE~~,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,kBAAkB,CAgC7D,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,QAAQ,CA6B/C,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"NavigationList.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAmBf,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AA0HhE,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,kBAAkB,CAgC7D,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,QAAQ,CA6B/C,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/AppShell/NavigationList.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useContext, useEffect, useRef, useState } from 'react';
-import { useTheme, useEscape, useDirection, Icon, Tooltip, ExpandCollapse, useElement, StandardTree, treeHelpers, useAfterInitialEffect } from '@pega/cosmos-react-core';
+import { useTheme, useEscape, useDirection, Icon, Tooltip, ExpandCollapse, useElement, StandardTree, treeHelpers, useAfterInitialEffect, useUID } from '@pega/cosmos-react-core';
 import BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';
 import { StyledNavList, StyledAppShellCaretIcon, StyledNavListItem } from './AppShell.styles';
 import AppShellContext from './AppShellContext';
@@ -19,9 +19,10 @@ const transformItems = (items, expandedIds) => {
         nodes: item.items ? transformItems(item.items, expandedIds) : undefined
     }));
 };
-const NavParentItem = ({ id, label, visual, items, currentItemId }) => {
+const NavParentItem = ({ label, visual, items, currentItemId }) => {
     const { navOpen, navState, openNav } = useContext(AppShellContext);
     const { end } = useDirection();
+    const treeId = useUID();
     const { base: { animation } } = useTheme();
     const [collapsed, setCollapsed] = useState(true);
     const [managedItems, setManagedItems] = useState(() => transformItems(items, new Set()));
@@ -56,7 +57,7 @@ const NavParentItem = ({ id, label, visual, items, currentItemId }) => {
             return transformItems(items, expandedIds);
         });
     }, [items]);
-    return (_jsxs(_Fragment, { children: [_jsxs(BareButton, { id: id, ref: buttonRef, "aria-expanded": !collapsed, "aria-controls": `${id}-tree`, "aria-label": label, onClick: toggleCollapsed, children: [visual, _jsx("span", { children: label }), navState === 'open' && (_jsx(Icon, { name: `caret-${end}`, as: StyledAppShellCaretIcon, nestedListCollapsed: collapsed }))] }), _jsx(ExpandCollapse, { id: `${id}-tree`, collapsed: collapsed || !navOpen, transitionSpeed: managedItems.length >= 10 ? `calc(2 * ${animation.speed})` : animation.speed, children: _jsx(StandardTree, { ref: treeRef, nodes: managedItems, currentNodeId: currentItemId, selectableParents: false, onNodeToggle: nodeId => {
+    return (_jsxs(_Fragment, { children: [_jsxs(BareButton, { ref: buttonRef, "aria-expanded": !collapsed, "aria-controls": treeId, "aria-label": label, onClick: toggleCollapsed, children: [visual, _jsx("span", { children: label }), navState === 'open' && (_jsx(Icon, { name: `caret-${end}`, as: StyledAppShellCaretIcon, nestedListCollapsed: collapsed }))] }), _jsx(ExpandCollapse, { id: treeId, collapsed: collapsed || !navOpen, transitionSpeed: managedItems.length >= 10 ? `calc(2 * ${animation.speed})` : animation.speed, children: _jsx(StandardTree, { ref: treeRef, nodes: managedItems, currentNodeId: currentItemId, selectableParents: false, onNodeToggle: nodeId => {
                         setManagedItems(nodes => treeHelpers.mapNode(nodes, nodeId, node => {
                             return {
                                 ...node,

package/lib/components/AppShell/NavigationList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationList.js","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ElementType,\n FunctionComponent,\n KeyboardEvent,\n MouseEvent,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\n\nimport {\n useTheme,\n useEscape,\n useDirection,\n Icon,\n Tooltip,\n ExpandCollapse,\n useElement,\n StandardTree,\n StandardTreeNode,\n StandardTreeProps,\n treeHelpers,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { NavProps, NavItemRenderProps } from './AppShell.types';\nimport { StyledNavList, StyledAppShellCaretIcon, StyledNavListItem } from './AppShell.styles';\nimport AppShellContext from './AppShellContext';\n\nconst transformItems = (\n items: NavItemRenderProps['items'],\n expandedIds: Set<StandardTreeNode['id']>\n): StandardTreeProps['nodes'] => {\n if (!items) return [];\n\n return items.map(item => ({\n id: item.id,\n label: item.label,\n onClick: (id: string, e: MouseEvent<HTMLElement> \| KeyboardEvent<HTMLElement>) => {\n e.stopPropagation();\n item.onClick?.(id, e);\n },\n expanded: item.items ? expandedIds.has(item.id) : undefined,\n href: item.href,\n nodes: item.items ? transformItems(item.items, expandedIds) : undefined\n }));\n};\n\nconst NavParentItem: FunctionComponent<NavItemRenderProps> = ({\n id,\n label,\n visual,\n items,\n currentItemId\n}) => {\n const { navOpen, navState, openNav } = useContext(AppShellContext);\n const { end } = useDirection();\n const {\n base: { animation }\n } = useTheme();\n const [collapsed, setCollapsed] = useState(true);\n const [managedItems, setManagedItems] = useState<StandardTreeProps['nodes']>(() =>\n transformItems(items, new Set())\n );\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const treeRef = useRef<HTMLUListElement>(null);\n\n const toggleCollapsed = (e: MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n if (!navOpen) {\n setCollapsed(false);\n openNav();\n } else setCollapsed(state => !state);\n };\n\n useEscape(() => {\n setCollapsed(true);\n buttonRef.current?.focus();\n }, treeRef);\n\n useEffect(() => {\n if (currentItemId && treeHelpers.getNode(managedItems, currentItemId)) {\n setManagedItems(nodes => treeHelpers.expandTo(nodes, currentItemId));\n setCollapsed(false);\n }\n }, [currentItemId]);\n\n useAfterInitialEffect(() => {\n setManagedItems(cur => {\n const expandedIds = new Set<StandardTreeNode['id']>();\n\n treeHelpers.forEachNode(cur, node => {\n if (node.expanded) expandedIds.add(node.id);\n });\n\n return transformItems(items, expandedIds);\n });\n }, [items]);\n\n return (\n <>\n <BareButton\n id={id}\n ref={buttonRef}\n aria-expanded={!collapsed}\n aria-controls={`${id}-tree`}\n aria-label={label}\n onClick={toggleCollapsed}\n >\n {visual}\n <span>{label}</span>\n {navState === 'open' && (\n <Icon\n name={`caret-${end}`}\n as={StyledAppShellCaretIcon}\n nestedListCollapsed={collapsed}\n />\n )}\n </BareButton>\n <ExpandCollapse\n id={`${id}-tree`}\n collapsed={collapsed \|\| !navOpen}\n transitionSpeed={\n managedItems.length >= 10 ? `calc(2 * ${animation.speed})` : animation.speed\n }\n >\n <StandardTree\n ref={treeRef}\n nodes={managedItems as StandardTreeNode[]}\n currentNodeId={currentItemId}\n selectableParents={false}\n onNodeToggle={nodeId => {\n setManagedItems(nodes =>\n treeHelpers.mapNode(nodes, nodeId, node => {\n return {\n ...node,\n expanded: !node.expanded\n };\n })\n );\n }}\n />\n </ExpandCollapse>\n </>\n );\n};\n\nexport const NavLinkItem: FunctionComponent<NavItemRenderProps> = ({\n id,\n label,\n visual,\n href,\n onClick\n}) => {\n const { navOpen } = useContext(AppShellContext);\n const { end } = useDirection();\n const [listItemEl, setListItemEl] = useElement<HTMLAnchorElement \| HTMLButtonElement>();\n\n return (\n <>\n <BareButton\n ref={setListItemEl}\n href={href}\n onClick={(e: MouseEvent<HTMLAnchorElement \| HTMLButtonElement>) => {\n e.stopPropagation();\n onClick?.(id, e);\n }}\n aria-label={label}\n >\n {visual}\n <span>{label}</span>\n </BareButton>\n {!navOpen && (\n <Tooltip target={listItemEl} placement={end} showDelay='none' hideDelay='none'>\n {label}\n </Tooltip>\n )}\n </>\n );\n};\n\nconst NavigationList: FunctionComponent<NavProps> = ({ items, currentItemId }) => {\n let ItemComponent: ElementType;\n\n return (\n <StyledNavList>\n {items.map(item => {\n if (item.items) {\n ItemComponent = NavParentItem;\n } else {\n ItemComponent = NavLinkItem;\n }\n\n const ariaCurrent = item.href ? 'page' : 'true';\n return (\n <StyledNavListItem\n aria-current={currentItemId === item.id ? ariaCurrent : undefined}\n key={item.id}\n id={item.id}\n >\n <ItemComponent\n {...item}\n visual={<Icon name={item.icon} />}\n currentItemId={currentItemId}\n />\n </StyledNavListItem>\n );\n })}\n </StyledNavList>\n );\n};\n\nexport default NavigationList;\n"]}
1	+ {"version":3,"file":"NavigationList.js","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ElementType,\n FunctionComponent,\n KeyboardEvent,\n MouseEvent,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\n\nimport {\n useTheme,\n useEscape,\n useDirection,\n Icon,\n Tooltip,\n ExpandCollapse,\n useElement,\n StandardTree,\n StandardTreeNode,\n StandardTreeProps,\n treeHelpers,\n useAfterInitialEffect,\n useUID\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { NavProps, NavItemRenderProps } from './AppShell.types';\nimport { StyledNavList, StyledAppShellCaretIcon, StyledNavListItem } from './AppShell.styles';\nimport AppShellContext from './AppShellContext';\n\nconst transformItems = (\n items: NavItemRenderProps['items'],\n expandedIds: Set<StandardTreeNode['id']>\n): StandardTreeProps['nodes'] => {\n if (!items) return [];\n\n return items.map(item => ({\n id: item.id,\n label: item.label,\n onClick: (id: string, e: MouseEvent<HTMLElement> \| KeyboardEvent<HTMLElement>) => {\n e.stopPropagation();\n item.onClick?.(id, e);\n },\n expanded: item.items ? expandedIds.has(item.id) : undefined,\n href: item.href,\n nodes: item.items ? transformItems(item.items, expandedIds) : undefined\n }));\n};\n\nconst NavParentItem: FunctionComponent<NavItemRenderProps> = ({\n label,\n visual,\n items,\n currentItemId\n}) => {\n const { navOpen, navState, openNav } = useContext(AppShellContext);\n const { end } = useDirection();\n const treeId = useUID();\n const {\n base: { animation }\n } = useTheme();\n const [collapsed, setCollapsed] = useState(true);\n const [managedItems, setManagedItems] = useState<StandardTreeProps['nodes']>(() =>\n transformItems(items, new Set())\n );\n\n const buttonRef = useRef<HTMLButtonElement>(null);\n const treeRef = useRef<HTMLUListElement>(null);\n\n const toggleCollapsed = (e: MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n if (!navOpen) {\n setCollapsed(false);\n openNav();\n } else setCollapsed(state => !state);\n };\n\n useEscape(() => {\n setCollapsed(true);\n buttonRef.current?.focus();\n }, treeRef);\n\n useEffect(() => {\n if (currentItemId && treeHelpers.getNode(managedItems, currentItemId)) {\n setManagedItems(nodes => treeHelpers.expandTo(nodes, currentItemId));\n setCollapsed(false);\n }\n }, [currentItemId]);\n\n useAfterInitialEffect(() => {\n setManagedItems(cur => {\n const expandedIds = new Set<StandardTreeNode['id']>();\n\n treeHelpers.forEachNode(cur, node => {\n if (node.expanded) expandedIds.add(node.id);\n });\n\n return transformItems(items, expandedIds);\n });\n }, [items]);\n\n return (\n <>\n <BareButton\n ref={buttonRef}\n aria-expanded={!collapsed}\n aria-controls={treeId}\n aria-label={label}\n onClick={toggleCollapsed}\n >\n {visual}\n <span>{label}</span>\n {navState === 'open' && (\n <Icon\n name={`caret-${end}`}\n as={StyledAppShellCaretIcon}\n nestedListCollapsed={collapsed}\n />\n )}\n </BareButton>\n <ExpandCollapse\n id={treeId}\n collapsed={collapsed \|\| !navOpen}\n transitionSpeed={\n managedItems.length >= 10 ? `calc(2 * ${animation.speed})` : animation.speed\n }\n >\n <StandardTree\n ref={treeRef}\n nodes={managedItems as StandardTreeNode[]}\n currentNodeId={currentItemId}\n selectableParents={false}\n onNodeToggle={nodeId => {\n setManagedItems(nodes =>\n treeHelpers.mapNode(nodes, nodeId, node => {\n return {\n ...node,\n expanded: !node.expanded\n };\n })\n );\n }}\n />\n </ExpandCollapse>\n </>\n );\n};\n\nexport const NavLinkItem: FunctionComponent<NavItemRenderProps> = ({\n id,\n label,\n visual,\n href,\n onClick\n}) => {\n const { navOpen } = useContext(AppShellContext);\n const { end } = useDirection();\n const [listItemEl, setListItemEl] = useElement<HTMLAnchorElement \| HTMLButtonElement>();\n\n return (\n <>\n <BareButton\n ref={setListItemEl}\n href={href}\n onClick={(e: MouseEvent<HTMLAnchorElement \| HTMLButtonElement>) => {\n e.stopPropagation();\n onClick?.(id, e);\n }}\n aria-label={label}\n >\n {visual}\n <span>{label}</span>\n </BareButton>\n {!navOpen && (\n <Tooltip target={listItemEl} placement={end} showDelay='none' hideDelay='none'>\n {label}\n </Tooltip>\n )}\n </>\n );\n};\n\nconst NavigationList: FunctionComponent<NavProps> = ({ items, currentItemId }) => {\n let ItemComponent: ElementType;\n\n return (\n <StyledNavList>\n {items.map(item => {\n if (item.items) {\n ItemComponent = NavParentItem;\n } else {\n ItemComponent = NavLinkItem;\n }\n\n const ariaCurrent = item.href ? 'page' : 'true';\n return (\n <StyledNavListItem\n aria-current={currentItemId === item.id ? ariaCurrent : undefined}\n key={item.id}\n id={item.id}\n >\n <ItemComponent\n {...item}\n visual={<Icon name={item.icon} />}\n currentItemId={currentItemId}\n />\n </StyledNavListItem>\n );\n })}\n </StyledNavList>\n );\n};\n\nexport default NavigationList;\n"]}

package/lib/components/DynamicContentEditor/DynamicContentEditor.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DynamicContentEditor.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAgD,MAAM,OAAO,CAAC;AAKpG,OAAO,EAGL,YAAY,EAab,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,yBAAyB,EAAY,MAAM,8BAA8B,CAAC;AAOnF,eAAO,MAAM,mBAAmB;;SAE/B,CAAC;AAIF,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,~~CA4TnF~~,CAAC;AAEJ,eAAe,oBAAoB,CAAC"}
1	+ {"version":3,"file":"DynamicContentEditor.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAgD,MAAM,OAAO,CAAC;AAKpG,OAAO,EAGL,YAAY,EAab,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,yBAAyB,EAAY,MAAM,8BAA8B,CAAC;AAOnF,eAAO,MAAM,mBAAmB;;SAE/B,CAAC;AAIF,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,CA6TnF,CAAC;AAEJ,eAAe,oBAAoB,CAAC"}

package/lib/components/DynamicContentEditor/DynamicContentEditor.js CHANGED Viewed

@@ -157,9 +157,9 @@ const DynamicContentEditor = forwardRef(({ form: { dynamicContentPicker, onSubmi
             }
         ], placement: 'bottom-start', children: fieldMenuItems && (_jsx(Menu, { id: menuID, items: fieldMenuItems, as: StyledSearchPopover, focusControlEl: editor?.getBody() || undefined, mode: 'action', onItemClick: findAndRenameField, variant: 'drill-down' })) }));
     useEffect(() => {
-        if (currentElementId)
+        if (currentElementId && currentElementContent)
             modalMethods.current = create(Modal, modalProps);
-    }, [currentElementId]);
+    }, [currentElementId, currentElementContent]);
     useEffect(() => {
         editor?.getDoc().addEventListener('click', handleElementClick);
         return () => {

package/lib/components/DynamicContentEditor/DynamicContentEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DynamicContentEditor.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Bookmark, Editor as TinyMCEEditor, EditorSelection } from 'tinymce';\n\nimport { Editor, EditorProps } from '@pega/cosmos-react-rte';\nimport {\n Button,\n defaultThemeProp,\n ForwardProps,\n Menu,\n menuHelpers,\n MenuProps,\n Modal,\n ModalMethods,\n Popover,\n PropsWithDefaults,\n StyledPopover,\n useModalManager,\n useConsolidatedRef,\n useI18n,\n useUID\n} from '@pega/cosmos-react-core';\nimport { getKeyCommand } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/Toolbar/utils';\n\nimport { DynamicContentEditorProps, ItemType } from './DynamicContentEditor.types';\nimport { pegaReferenceElementStyle, createPegaReferenceElement } from './PegaCustomElement';\n\ntype DynamicContentEditorPropsWithDefaults = PropsWithDefaults<DynamicContentEditorProps>;\n\nconst StyledDynamicContentEditor = styled.div<DynamicContentEditorPropsWithDefaults>``;\n\nexport const StyledSearchPopover = styled(StyledPopover)`\n min-width: 20rem;\n`;\n\nStyledDynamicContentEditor.defaultProps = defaultThemeProp;\n\nconst DynamicContentEditor: FunctionComponent<DynamicContentEditorProps & ForwardProps> =\n forwardRef(\n (\n {\n form: { dynamicContentPicker, onSubmit },\n onActiveFieldChange,\n label,\n toolbar,\n fieldItems,\n defaultValue,\n onBlur,\n ...restProps\n }: PropsWithoutRef<DynamicContentEditorProps>,\n ref: DynamicContentEditorProps['ref']\n ) => {\n const menuID = useUID();\n const { create } = useModalManager();\n const t = useI18n();\n\n const modalMethods = useRef<ModalMethods>();\n const [editor, setEditor] = useState<TinyMCEEditor \| undefined>();\n const [bookmark, setBookmark] = useState<Bookmark \| undefined>();\n const [fieldMenuItems, setFieldMenuItems] = useState<MenuProps['items']>(fieldItems \|\| []);\n const [currentElementId, setCurrentElementId] = useState('');\n const [currentElementContent, setCurrentElementContent] = useState('');\n const [currentCursorPosition, setCurrentCursorPosition] = useState({\n bottom: 0,\n height: 0,\n left: 0,\n right: 0,\n top: 0,\n width: 0,\n x: 0,\n y: 0,\n toJSON: () => {}\n });\n const [showFieldsPopover, setShowFieldsPopover] = useState<boolean>(false);\n\n const fieldPopoverRef = useRef<HTMLDivElement>(null);\n const editorRef = useConsolidatedRef(ref);\n\n const tooltip = getKeyCommand(\n navigator.appVersion.includes('Mac'),\n ({ ctrl }) => `${t('rte_insert_field')} (${ctrl}/)`\n );\n\n const insertField = (field: ItemType) => {\n if (!editor) return;\n\n const fieldContent = `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type='field' data-rule-id=${field.id}>${field.text}</pega-reference>`;\n if (bookmark) {\n editor.selection.moveToBookmark(bookmark);\n editor.selection.setContent(fieldContent);\n } else {\n editor.insertContent(fieldContent);\n }\n\n modalMethods.current?.dismiss();\n };\n\n const modalProps = {\n children: dynamicContentPicker,\n heading: t('rte_insert_field'),\n actions: (\n <>\n <Button variant='secondary' onClick={() => modalMethods.current?.dismiss()}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={() => onSubmit(insertField)}>\n {t('submit')}\n </Button>\n </>\n ),\n center: true,\n onAfterClose: () => {\n setBookmark(undefined);\n setCurrentElementId('');\n setCurrentElementContent('');\n onActiveFieldChange({ id: '', text: '' });\n },\n onBeforeOpen: () => {\n if (currentElementId) {\n onActiveFieldChange({ id: currentElementId, text: currentElementContent });\n }\n }\n };\n\n const findAndRenameField = (fieldId: string) => {\n if (!editor \|\| !fieldMenuItems) return;\n\n const selectedRange = editor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(0, endOffset);\n if (stringToSearch === undefined) return;\n\n const splitSearch = stringToSearch.split(' ');\n const fieldString = splitSearch[splitSearch.length - 1];\n const range = editor.getDoc().createRange();\n\n const startPos = stringToSearch.lastIndexOf(fieldString);\n const endPos = startPos + fieldString.length;\n range.setStart(selectedRange.commonAncestorContainer, startPos);\n range.setEnd(selectedRange.commonAncestorContainer, endPos);\n editor.getDoc().getSelection()?.removeAllRanges();\n editor.getDoc().getSelection()?.addRange(range);\n\n const selectedField = menuHelpers.getItem(fieldMenuItems, fieldId);\n if (selectedField) {\n editor.selection.setContent(\n `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=\".${selectedField.id}\">${selectedField.primary}</pega-reference>`\n );\n setShowFieldsPopover(false);\n }\n };\n\n const hidePopover = () => {\n if (fieldPopoverRef) setShowFieldsPopover(false);\n };\n\n const filterFieldMenu = (searchString: string) => {\n setShowFieldsPopover(true);\n setFieldMenuItems(fieldItems \|\| []);\n if (/\\s/.test(searchString)) {\n setShowFieldsPopover(false);\n return;\n }\n if (searchString && fieldMenuItems) {\n const newFieldMenuItems: MenuProps['items'] = menuHelpers\n .flatten(fieldMenuItems)\n .filter(({ primary }) =>\n primary.toLowerCase().startsWith(searchString.toLocaleLowerCase())\n );\n if (newFieldMenuItems) {\n setShowFieldsPopover(true);\n setFieldMenuItems(newFieldMenuItems);\n } else setShowFieldsPopover(false);\n }\n };\n\n const updateBookmarkAndCurrentElement = (editorSelection: EditorSelection) => {\n const targetEl = editorSelection.getNode() as HTMLElement;\n const fieldId = targetEl.getAttribute('data-rule-id');\n const fieldValue = targetEl.innerText;\n setBookmark(editorSelection.getBookmark());\n setCurrentElementId(fieldId \|\| '');\n setCurrentElementContent(fieldValue);\n };\n\n const handleElementClick = ({ target }: MouseEvent) => {\n if (editor && target && (target as HTMLElement).tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(editor.selection);\n }\n hidePopover();\n };\n\n const onInsertField = (incEditor: TinyMCEEditor) => {\n const targetEl = incEditor.selection.getNode();\n if (targetEl.tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(incEditor.selection);\n } else {\n modalMethods.current = create(Modal, modalProps);\n }\n };\n\n const isPegaRefActive = (incEditor: TinyMCEEditor) => {\n const targetEl = incEditor.selection.getNode();\n return targetEl.tagName === 'PEGA-REFERENCE';\n };\n\n const fieldSelectionPopover = (\n <Popover\n show={showFieldsPopover}\n strategy='fixed'\n ref={fieldPopoverRef}\n target={{\n getBoundingClientRect() {\n return currentCursorPosition;\n }\n }}\n modifiers={[\n {\n name: 'offset',\n options: {\n offset: () => {\n const iframe = editorRef.current?.element?.querySelector('iframe');\n const iframeRect = iframe?.getBoundingClientRect();\n const x = iframeRect?.x ?? 0;\n const y = iframeRect?.y ?? 0;\n return [x, y];\n }\n }\n }\n ]}\n placement='bottom-start'\n >\n {fieldMenuItems && (\n <Menu\n id={menuID}\n items={fieldMenuItems}\n as={StyledSearchPopover}\n focusControlEl={editor?.getBody() \|\| undefined}\n mode='action'\n onItemClick={findAndRenameField}\n variant='drill-down'\n />\n )}\n </Popover>\n );\n\n useEffect(() => {\n if (currentElementId) modalMethods.current = create(Modal, modalProps);\n }, [currentElementId]);\n\n useEffect(() => {\n editor?.getDoc().addEventListener('click', handleElementClick);\n return () => {\n editor?.getDoc().removeEventListener('click', handleElementClick);\n };\n }, [editor, editorRef.current]);\n\n useEffect(() => {\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n }\n }, [modalProps]);\n\n const onEditorChange: EditorProps['onChange'] = (formEditor?: TinyMCEEditor) => {\n if (formEditor) {\n const targetEl = formEditor.selection.getBoundingClientRect();\n const { left = 0, top = 0 } = targetEl ?? {};\n setCurrentCursorPosition({\n ...formEditor.selection.getBoundingClientRect(),\n x: left,\n y: top,\n toJSON: () => {}\n });\n\n if (formEditor.selection.isCollapsed()) {\n // get the full line string\n const selectedRange = formEditor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(\n 0,\n endOffset\n );\n const fieldString = stringToSearch?.split(' ')[stringToSearch?.split(' ').length - 1];\n if (\n fieldString?.startsWith('@') &&\n fieldString.indexOf('@') === fieldString.lastIndexOf('@')\n ) {\n filterFieldMenu(fieldString.slice(1));\n } else setShowFieldsPopover(false);\n }\n }\n };\n\n const onKeyDown: EditorProps['onKeyDown'] = event => {\n if (\n (event?.key === 'Enter' \|\|\n event?.key === 'ArrowLeft' \|\|\n event?.key === 'ArrowRight' \|\|\n event?.key === 'ArrowDown' \|\|\n event?.key === 'ArrowUp') &&\n !!fieldPopoverRef.current\n ) {\n event?.preventDefault();\n }\n if (event?.key === 'Escape' && !!fieldPopoverRef.current) {\n hidePopover();\n }\n };\n\n return (\n <>\n <Editor\n ref={editorRef}\n {...restProps}\n label={label}\n toolbar={toolbar}\n customComponents={[\n {\n createCustomElement: createPegaReferenceElement,\n name: 'pega-reference',\n extensionAttributes: ['contenteditable'],\n style: pegaReferenceElementStyle\n }\n ]}\n customActions={[\n {\n icon: 'code',\n text: tooltip,\n onMouseDown: () => {\n modalMethods.current = create(Modal, modalProps);\n },\n active: isPegaRefActive,\n shortcut: {\n pattern: 'meta+191',\n description: tooltip,\n command: onInsertField\n }\n }\n ]}\n onInit={setEditor}\n onChange={onEditorChange}\n onBlur={() => {\n onBlur?.();\n hidePopover();\n }}\n onKeyDown={onKeyDown}\n defaultValue={defaultValue}\n >\n {fieldSelectionPopover}\n </Editor>\n </>\n );\n }\n );\n\nexport default DynamicContentEditor;\n"]}
1	+ {"version":3,"file":"DynamicContentEditor.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Bookmark, Editor as TinyMCEEditor, EditorSelection } from 'tinymce';\n\nimport { Editor, EditorProps } from '@pega/cosmos-react-rte';\nimport {\n Button,\n defaultThemeProp,\n ForwardProps,\n Menu,\n menuHelpers,\n MenuProps,\n Modal,\n ModalMethods,\n Popover,\n PropsWithDefaults,\n StyledPopover,\n useModalManager,\n useConsolidatedRef,\n useI18n,\n useUID\n} from '@pega/cosmos-react-core';\nimport { getKeyCommand } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/Toolbar/utils';\n\nimport { DynamicContentEditorProps, ItemType } from './DynamicContentEditor.types';\nimport { pegaReferenceElementStyle, createPegaReferenceElement } from './PegaCustomElement';\n\ntype DynamicContentEditorPropsWithDefaults = PropsWithDefaults<DynamicContentEditorProps>;\n\nconst StyledDynamicContentEditor = styled.div<DynamicContentEditorPropsWithDefaults>``;\n\nexport const StyledSearchPopover = styled(StyledPopover)`\n min-width: 20rem;\n`;\n\nStyledDynamicContentEditor.defaultProps = defaultThemeProp;\n\nconst DynamicContentEditor: FunctionComponent<DynamicContentEditorProps & ForwardProps> =\n forwardRef(\n (\n {\n form: { dynamicContentPicker, onSubmit },\n onActiveFieldChange,\n label,\n toolbar,\n fieldItems,\n defaultValue,\n onBlur,\n ...restProps\n }: PropsWithoutRef<DynamicContentEditorProps>,\n ref: DynamicContentEditorProps['ref']\n ) => {\n const menuID = useUID();\n const { create } = useModalManager();\n const t = useI18n();\n\n const modalMethods = useRef<ModalMethods>();\n const [editor, setEditor] = useState<TinyMCEEditor \| undefined>();\n const [bookmark, setBookmark] = useState<Bookmark \| undefined>();\n const [fieldMenuItems, setFieldMenuItems] = useState<MenuProps['items']>(fieldItems \|\| []);\n const [currentElementId, setCurrentElementId] = useState('');\n const [currentElementContent, setCurrentElementContent] = useState('');\n const [currentCursorPosition, setCurrentCursorPosition] = useState({\n bottom: 0,\n height: 0,\n left: 0,\n right: 0,\n top: 0,\n width: 0,\n x: 0,\n y: 0,\n toJSON: () => {}\n });\n const [showFieldsPopover, setShowFieldsPopover] = useState<boolean>(false);\n\n const fieldPopoverRef = useRef<HTMLDivElement>(null);\n const editorRef = useConsolidatedRef(ref);\n\n const tooltip = getKeyCommand(\n navigator.appVersion.includes('Mac'),\n ({ ctrl }) => `${t('rte_insert_field')} (${ctrl}/)`\n );\n\n const insertField = (field: ItemType) => {\n if (!editor) return;\n\n const fieldContent = `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type='field' data-rule-id=${field.id}>${field.text}</pega-reference>`;\n if (bookmark) {\n editor.selection.moveToBookmark(bookmark);\n editor.selection.setContent(fieldContent);\n } else {\n editor.insertContent(fieldContent);\n }\n\n modalMethods.current?.dismiss();\n };\n\n const modalProps = {\n children: dynamicContentPicker,\n heading: t('rte_insert_field'),\n actions: (\n <>\n <Button variant='secondary' onClick={() => modalMethods.current?.dismiss()}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={() => onSubmit(insertField)}>\n {t('submit')}\n </Button>\n </>\n ),\n center: true,\n onAfterClose: () => {\n setBookmark(undefined);\n setCurrentElementId('');\n setCurrentElementContent('');\n onActiveFieldChange({ id: '', text: '' });\n },\n onBeforeOpen: () => {\n if (currentElementId) {\n onActiveFieldChange({ id: currentElementId, text: currentElementContent });\n }\n }\n };\n\n const findAndRenameField = (fieldId: string) => {\n if (!editor \|\| !fieldMenuItems) return;\n\n const selectedRange = editor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(0, endOffset);\n if (stringToSearch === undefined) return;\n\n const splitSearch = stringToSearch.split(' ');\n const fieldString = splitSearch[splitSearch.length - 1];\n const range = editor.getDoc().createRange();\n\n const startPos = stringToSearch.lastIndexOf(fieldString);\n const endPos = startPos + fieldString.length;\n range.setStart(selectedRange.commonAncestorContainer, startPos);\n range.setEnd(selectedRange.commonAncestorContainer, endPos);\n editor.getDoc().getSelection()?.removeAllRanges();\n editor.getDoc().getSelection()?.addRange(range);\n\n const selectedField = menuHelpers.getItem(fieldMenuItems, fieldId);\n if (selectedField) {\n editor.selection.setContent(\n `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=\".${selectedField.id}\">${selectedField.primary}</pega-reference>`\n );\n setShowFieldsPopover(false);\n }\n };\n\n const hidePopover = () => {\n if (fieldPopoverRef) setShowFieldsPopover(false);\n };\n\n const filterFieldMenu = (searchString: string) => {\n setShowFieldsPopover(true);\n setFieldMenuItems(fieldItems \|\| []);\n if (/\\s/.test(searchString)) {\n setShowFieldsPopover(false);\n return;\n }\n if (searchString && fieldMenuItems) {\n const newFieldMenuItems: MenuProps['items'] = menuHelpers\n .flatten(fieldMenuItems)\n .filter(({ primary }) =>\n primary.toLowerCase().startsWith(searchString.toLocaleLowerCase())\n );\n if (newFieldMenuItems) {\n setShowFieldsPopover(true);\n setFieldMenuItems(newFieldMenuItems);\n } else setShowFieldsPopover(false);\n }\n };\n\n const updateBookmarkAndCurrentElement = (editorSelection: EditorSelection) => {\n const targetEl = editorSelection.getNode() as HTMLElement;\n const fieldId = targetEl.getAttribute('data-rule-id');\n const fieldValue = targetEl.innerText;\n setBookmark(editorSelection.getBookmark());\n setCurrentElementId(fieldId \|\| '');\n setCurrentElementContent(fieldValue);\n };\n\n const handleElementClick = ({ target }: MouseEvent) => {\n if (editor && target && (target as HTMLElement).tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(editor.selection);\n }\n hidePopover();\n };\n\n const onInsertField = (incEditor: TinyMCEEditor) => {\n const targetEl = incEditor.selection.getNode();\n if (targetEl.tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(incEditor.selection);\n } else {\n modalMethods.current = create(Modal, modalProps);\n }\n };\n\n const isPegaRefActive = (incEditor: TinyMCEEditor) => {\n const targetEl = incEditor.selection.getNode();\n return targetEl.tagName === 'PEGA-REFERENCE';\n };\n\n const fieldSelectionPopover = (\n <Popover\n show={showFieldsPopover}\n strategy='fixed'\n ref={fieldPopoverRef}\n target={{\n getBoundingClientRect() {\n return currentCursorPosition;\n }\n }}\n modifiers={[\n {\n name: 'offset',\n options: {\n offset: () => {\n const iframe = editorRef.current?.element?.querySelector('iframe');\n const iframeRect = iframe?.getBoundingClientRect();\n const x = iframeRect?.x ?? 0;\n const y = iframeRect?.y ?? 0;\n return [x, y];\n }\n }\n }\n ]}\n placement='bottom-start'\n >\n {fieldMenuItems && (\n <Menu\n id={menuID}\n items={fieldMenuItems}\n as={StyledSearchPopover}\n focusControlEl={editor?.getBody() \|\| undefined}\n mode='action'\n onItemClick={findAndRenameField}\n variant='drill-down'\n />\n )}\n </Popover>\n );\n\n useEffect(() => {\n if (currentElementId && currentElementContent)\n modalMethods.current = create(Modal, modalProps);\n }, [currentElementId, currentElementContent]);\n\n useEffect(() => {\n editor?.getDoc().addEventListener('click', handleElementClick);\n return () => {\n editor?.getDoc().removeEventListener('click', handleElementClick);\n };\n }, [editor, editorRef.current]);\n\n useEffect(() => {\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n }\n }, [modalProps]);\n\n const onEditorChange: EditorProps['onChange'] = (formEditor?: TinyMCEEditor) => {\n if (formEditor) {\n const targetEl = formEditor.selection.getBoundingClientRect();\n const { left = 0, top = 0 } = targetEl ?? {};\n setCurrentCursorPosition({\n ...formEditor.selection.getBoundingClientRect(),\n x: left,\n y: top,\n toJSON: () => {}\n });\n\n if (formEditor.selection.isCollapsed()) {\n // get the full line string\n const selectedRange = formEditor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(\n 0,\n endOffset\n );\n const fieldString = stringToSearch?.split(' ')[stringToSearch?.split(' ').length - 1];\n if (\n fieldString?.startsWith('@') &&\n fieldString.indexOf('@') === fieldString.lastIndexOf('@')\n ) {\n filterFieldMenu(fieldString.slice(1));\n } else setShowFieldsPopover(false);\n }\n }\n };\n\n const onKeyDown: EditorProps['onKeyDown'] = event => {\n if (\n (event?.key === 'Enter' \|\|\n event?.key === 'ArrowLeft' \|\|\n event?.key === 'ArrowRight' \|\|\n event?.key === 'ArrowDown' \|\|\n event?.key === 'ArrowUp') &&\n !!fieldPopoverRef.current\n ) {\n event?.preventDefault();\n }\n if (event?.key === 'Escape' && !!fieldPopoverRef.current) {\n hidePopover();\n }\n };\n\n return (\n <>\n <Editor\n ref={editorRef}\n {...restProps}\n label={label}\n toolbar={toolbar}\n customComponents={[\n {\n createCustomElement: createPegaReferenceElement,\n name: 'pega-reference',\n extensionAttributes: ['contenteditable'],\n style: pegaReferenceElementStyle\n }\n ]}\n customActions={[\n {\n icon: 'code',\n text: tooltip,\n onMouseDown: () => {\n modalMethods.current = create(Modal, modalProps);\n },\n active: isPegaRefActive,\n shortcut: {\n pattern: 'meta+191',\n description: tooltip,\n command: onInsertField\n }\n }\n ]}\n onInit={setEditor}\n onChange={onEditorChange}\n onBlur={() => {\n onBlur?.();\n hidePopover();\n }}\n onKeyDown={onKeyDown}\n defaultValue={defaultValue}\n >\n {fieldSelectionPopover}\n </Editor>\n </>\n );\n }\n );\n\nexport default DynamicContentEditor;\n"]}

package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAUf,OAAO,qCAAqC,CAAC;AAC7C,OAAO,oCAAoC,CAAC;AAE5C,OAAO,EAAkC,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGvF,OAAO,EAEL,eAAe,EAGhB,MAAM,oBAAoB,CAAC;~~AAyE5B~~,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,~~CAyKjE~~,CAAC;AAEF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAUf,OAAO,qCAAqC,CAAC;AAC7C,OAAO,oCAAoC,CAAC;AAE5C,OAAO,EAAkC,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGvF,OAAO,EAEL,eAAe,EAGhB,MAAM,oBAAoB,CAAC;AA2E5B,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAsJjE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.js CHANGED Viewed

@@ -20,7 +20,9 @@ defineMode('expression', () => {
         /* Below regex is used to identify the delimeters  */
         { token: /[:.(),]/, style: 'ex-delimeter' },
         /* Below regex is used to identify the operators  */
-        { token: /[-+\\/*=<>@]+/, style: 'ex-operator' }
+        { token: /[-+\\/*=<>@]+/, style: 'ex-operator' },
+        /* Below regex is used to identify the spaces  */
+        { token: / /, style: 'ex-space' }
     ];
     return {
         startState() {
@@ -121,29 +123,12 @@ const CodeEditor = forwardRef(({ fetchSuggestions, autoCompleteTriggers, editorC
                 character: currentCharacter,
                 cursorPosition: currentCursor
             });
-            /* Used to find the query token which is present before the triggering character
-              to get updated list.  */
-            const cursorLineText = editor.getValue().split('\n')[currentCursor.line];
-            const textTillCursorPos = cursorLineText.substring(0, currentCursor.ch);
-            let start = textTillCursorPos?.lastIndexOf(' ');
-            if (start === -1) {
-                start = 0;
-            }
-            const currentWord = textTillCursorPos.substring(start, currentCursor.ch);
-            let regexp;
-            if (currentCharacter === '.') {
-                regexp = /[\w$]*(\.+[\w$)[\](]*)+/g;
-            }
-            else {
-                regexp = /[\w@'-]*[@:]/g;
-            }
-            const tokenArray = [...currentWord.matchAll(regexp)];
-            let queryToken = '';
-            if (tokenArray.length > 0) {
-                const queryString = tokenArray[tokenArray.length - 1][0];
-                queryToken = queryString.substring(0, queryString.length - 1);
-            }
-            newSuggestions = [...(await fetchSuggestions(currentCharacter, queryToken))];
+            newSuggestions = [
+                ...(await fetchSuggestions(currentCharacter, {
+                    line: currentCursor.line,
+                    ch: currentCursor.ch
+                }))
+            ];
             if (mounted.current) {
                 setSuggestions(newSuggestions);
             }

package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words unfocus\nimport {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useRef,\n useState,\n useEffect,\n useImperativeHandle\n} from 'react';\nimport { Controlled as ReactCodeMirror } from 'react-codemirror2';\nimport {\n showHint,\n defineMode,\n Editor,\n Position,\n EditorChange,\n EditorConfiguration\n} from 'codemirror';\nimport 'codemirror/addon/edit/closebrackets';\nimport 'codemirror/addon/hint/show-hint.js';\n\nimport { useConsolidatedRef, useElement, ForwardProps } from '@pega/cosmos-react-core';\nimport { StyledFormFieldInfo } from '@pega/cosmos-react-core/lib/components/FormField/FormField';\n\nimport {\n AutoCompleteTriggerChar,\n CodeEditorProps,\n EditorState,\n SuggestionType\n} from './CodeEditor.types';\nimport { StyledCodeEditor } from './CodeEditor.styles';\nimport getCodeSuggestions from './getCodeSuggestions';\n\ndefineMode('expression', () => {\n const tokens = [\n /* Below regex is used to identify the context /\n { token: /\\w+@/, style: 'ex-context' },\n / Below regex is used to identify the RuleType /\n { token: /\\w+:/, style: 'ex-context' },\n / Below regex is used to identify the RuleName /\n { token: /\\w+[(]/, style: 'ex-ruleName' },\n / Below regex is used to identify the delimeters /\n { token: /[:.(),]/, style: 'ex-delimeter' },\n / Below regex is used to identify the operators /\n { token: /[-+\\\\/=<>@]+/, style: 'ex-operator' }\n ];\n\n return {\n startState() {\n return { inString: false };\n },\n token(stream, state) {\n /* Used to identify the constants in the expression /\n const nextChar = stream.peek();\n if (!state.inString && (nextChar === \"'\" \|\| nextChar === '\"')) {\n stream.next(); // Skip quote\n state.inString = true; // Update state\n }\n\n if (state.inString) {\n if (nextChar && stream.skipTo(nextChar)) {\n // Quote found on this line\n stream.next(); // Skip quote\n state.inString = false; // Clear flag\n } else {\n stream.skipToEnd(); // Rest of line is string\n }\n return nextChar === '\"' ? 'ex-constant' : 'ex-context'; // Token style\n }\n\n if (stream.peek() === '.') {\n stream.next();\n if (stream.match(/.\\w+\\(/)) return 'ex-delimeter';\n }\n\n / Used to match the regex in the expression /\n // eslint-disable-next-line no-restricted-syntax\n for (const element of tokens) {\n const match = stream.match(element.token, false);\n if (match) {\n if (stream.pos === stream.start) {\n stream.next();\n }\n return element.style;\n }\n }\n stream.next();\n return null;\n }\n };\n});\n\nconst defaultConfigOptions: Pick<\n EditorConfiguration,\n 'lineWrapping' \| 'smartIndent' \| 'autoCloseBrackets' \| 'extraKeys'\n> = {\n lineWrapping: true,\n smartIndent: true,\n autoCloseBrackets: true,\n extraKeys: { Tab: false, 'Shift-Tab': false }\n};\n\nconst CodeEditor: FunctionComponent<CodeEditorProps & ForwardProps> = forwardRef(\n (\n {\n fetchSuggestions,\n autoCompleteTriggers,\n editorConfigProps,\n codeEditorHandle,\n defaultValue = '',\n loading = false,\n readOnly,\n errors,\n onChange,\n ...props\n }: PropsWithoutRef<CodeEditorProps>,\n ref: CodeEditorProps['ref']\n ) => {\n const [value, setCode] = useState<string>(defaultValue);\n const [suggestions, setSuggestions] = useState<SuggestionType[]>([]);\n const [codeMirror, setCodeMirror] = useState<Editor \| null>(null);\n const [codeEditorContainer, setCodeEditorContainer] = useElement<HTMLDivElement>();\n const codeEditorConsolidatedRef = useConsolidatedRef(setCodeEditorContainer, ref);\n const [suggestionTrigger, setSuggestionTrigger] = useState<{\n character: AutoCompleteTriggerChar;\n cursorPosition: Position;\n } \| null>(null);\n const [popover, showPopover] = useState(false);\n const mounted = useRef(false);\n\n useImperativeHandle<any, EditorState>(\n codeEditorHandle,\n () => ({\n insertText: (text: string) => {\n if (codeMirror) {\n if (codeMirror.getSelection()) {\n codeMirror.replaceSelection(text);\n } else {\n const cur: Position = codeMirror.getCursor();\n codeMirror.replaceRange(text, cur);\n }\n }\n },\n getValue: () => {\n return codeMirror?.getValue();\n }\n }),\n [codeMirror]\n );\n\n const autoComplete = (codeEditor: Editor) => {\n const hintOptions = {\n completeSingle: false,\n completeOnSingleClick: true,\n closeOnUnfocus: true,\n suggestions,\n container: codeEditorContainer,\n loading,\n triggerCharacterCursorPos: suggestionTrigger?.cursorPosition\n };\n showHint(codeEditor, getCodeSuggestions, hintOptions);\n };\n\n const onBeforeChange = async (editor: Editor, _data: EditorChange, textvalue: string) => {\n setCode(textvalue);\n onChange?.(textvalue);\n const currentCursor = editor.getCursor();\n const currentCharacter = editor\n .getTokenAt(currentCursor)\n .string.trim() as AutoCompleteTriggerChar;\n\n let newSuggestions: SuggestionType[] = [];\n\n if (autoCompleteTriggers?.includes(currentCharacter) && fetchSuggestions) {\n setSuggestionTrigger({\n character: currentCharacter,\n cursorPosition: currentCursor\n });\n\n / Used to find the query token which is present before the triggering character\n to get updated list. /\n const cursorLineText = editor.getValue().split('\\n')[currentCursor.line];\n const textTillCursorPos = cursorLineText.substring(0, currentCursor.ch);\n let start = textTillCursorPos?.lastIndexOf(' ');\n if (start === -1) {\n start = 0;\n }\n const currentWord = textTillCursorPos.substring(start, currentCursor.ch);\n\n let regexp;\n if (currentCharacter === '.') {\n regexp = /[\\w$](\\.+[\\w$)[\\](])+/g;\n } else {\n regexp = /[\\w@'-][@:]/g;\n }\n\n const tokenArray = [...currentWord.matchAll(regexp)];\n let queryToken = '';\n if (tokenArray.length > 0) {\n const queryString = tokenArray[tokenArray.length - 1][0];\n queryToken = queryString.substring(0, queryString.length - 1);\n }\n\n newSuggestions = [...(await fetchSuggestions(currentCharacter, queryToken))];\n if (mounted.current) {\n setSuggestions(newSuggestions);\n }\n }\n };\n\n useEffect(() => {\n if (!popover) return;\n const isSuggestionTriggerPresent =\n suggestionTrigger &&\n codeMirror\n ?.getTokenAt(suggestionTrigger.cursorPosition)\n .string.includes(suggestionTrigger.character);\n\n if (!isSuggestionTriggerPresent) {\n codeMirror?.closeHint();\n showPopover(false);\n setSuggestionTrigger(null);\n }\n }, [onBeforeChange]);\n\n useEffect(() => {\n if (codeMirror && (suggestionTrigger \|\| loading)) {\n autoComplete(codeMirror);\n showPopover(true);\n } else {\n codeMirror?.closeHint();\n showPopover(false);\n }\n }, [suggestions, loading]);\n\n useEffect(() => {\n mounted.current = true;\n return () => {\n mounted.current = false;\n };\n }, []);\n\n return (\n <StyledCodeEditor\n container={{\n direction: 'column',\n justify: 'between'\n }}\n item={{\n grow: 1\n }}\n ref={codeEditorConsolidatedRef}\n errors={errors}\n readOnly={readOnly}\n isLoading={loading}\n suggestions={suggestions}\n {...props}\n >\n <ReactCodeMirror\n value={value}\n onBeforeChange={onBeforeChange}\n options={{ ...defaultConfigOptions, ...editorConfigProps }}\n editorDidMount={editor => {\n editor.setSize('100%', '100%');\n setCodeMirror(editor);\n }}\n />\n {errors && <StyledFormFieldInfo status='error'>{errors}</StyledFormFieldInfo>}\n </StyledCodeEditor>\n );\n }\n);\n\nexport default CodeEditor;\n"]}
1	+ {"version":3,"file":"CodeEditor.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":";AAAA,uBAAuB;AACvB,OAAO,EACL,UAAU,EAGV,MAAM,EACN,QAAQ,EACR,SAAS,EACT,mBAAmB,EACpB,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,UAAU,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAClE,OAAO,EACL,QAAQ,EACR,UAAU,EAKX,MAAM,YAAY,CAAC;AACpB,OAAO,qCAAqC,CAAC;AAC7C,OAAO,oCAAoC,CAAC;AAE5C,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAgB,MAAM,yBAAyB,CAAC;AACvF,OAAO,EAAE,mBAAmB,EAAE,MAAM,4DAA4D,CAAC;AAQjG,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AAEtD,UAAU,CAAC,YAAY,EAAE,GAAG,EAAE;IAC5B,MAAM,MAAM,GAAG;QACb,kDAAkD;QAClD,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE;QACtC,oDAAoD;QACpD,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE;QACtC,mDAAmD;QACnD,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE;QACzC,qDAAqD;QACrD,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,cAAc,EAAE;QAC3C,oDAAoD;QACpD,EAAE,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,aAAa,EAAE;QAChD,iDAAiD;QACjD,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,UAAU,EAAE;KAClC,CAAC;IAEF,OAAO;QACL,UAAU;YACR,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;QAC7B,CAAC;QACD,KAAK,CAAC,MAAM,EAAE,KAAK;YACjB,uDAAuD;YACvD,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,EAAE,CAAC;YAC/B,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,QAAQ,KAAK,GAAG,IAAI,QAAQ,KAAK,GAAG,CAAC,EAAE;gBAC7D,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC,aAAa;gBAC5B,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC,eAAe;aACvC;YAED,IAAI,KAAK,CAAC,QAAQ,EAAE;gBAClB,IAAI,QAAQ,IAAI,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE;oBACvC,2BAA2B;oBAC3B,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC,aAAa;oBAC5B,KAAK,CAAC,QAAQ,GAAG,KAAK,CAAC,CAAC,aAAa;iBACtC;qBAAM;oBACL,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,yBAAyB;iBAC9C;gBACD,OAAO,QAAQ,KAAK,GAAG,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,cAAc;aACvE;YAED,IAAI,MAAM,CAAC,IAAI,EAAE,KAAK,GAAG,EAAE;gBACzB,MAAM,CAAC,IAAI,EAAE,CAAC;gBACd,IAAI,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;oBAAE,OAAO,cAAc,CAAC;aACnD;YAED,gDAAgD;YAChD,gDAAgD;YAChD,KAAK,MAAM,OAAO,IAAI,MAAM,EAAE;gBAC5B,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;gBACjD,IAAI,KAAK,EAAE;oBACT,IAAI,MAAM,CAAC,GAAG,KAAK,MAAM,CAAC,KAAK,EAAE;wBAC/B,MAAM,CAAC,IAAI,EAAE,CAAC;qBACf;oBACD,OAAO,OAAO,CAAC,KAAK,CAAC;iBACtB;aACF;YACD,MAAM,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,IAAI,CAAC;QACd,CAAC;KACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,oBAAoB,GAGtB;IACF,YAAY,EAAE,IAAI;IAClB,WAAW,EAAE,IAAI;IACjB,iBAAiB,EAAE,IAAI;IACvB,SAAS,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE;CAC9C,CAAC;AAEF,MAAM,UAAU,GAAsD,UAAU,CAC9E,CACE,EACE,gBAAgB,EAChB,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,EAChB,YAAY,GAAG,EAAE,EACjB,OAAO,GAAG,KAAK,EACf,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,GAAG,KAAK,EACyB,EACnC,GAA2B,EAC3B,EAAE;IACF,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAS,YAAY,CAAC,CAAC;IACxD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;IACrE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAClE,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,UAAU,EAAkB,CAAC;IACnF,MAAM,yBAAyB,GAAG,kBAAkB,CAAC,sBAAsB,EAAE,GAAG,CAAC,CAAC;IAClF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAGhD,IAAI,CAAC,CAAC;IAChB,MAAM,CAAC,OAAO,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC/C,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE9B,mBAAmB,CACjB,gBAAgB,EAChB,GAAG,EAAE,CAAC,CAAC;QACL,UAAU,EAAE,CAAC,IAAY,EAAE,EAAE;YAC3B,IAAI,UAAU,EAAE;gBACd,IAAI,UAAU,CAAC,YAAY,EAAE,EAAE;oBAC7B,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;iBACnC;qBAAM;oBACL,MAAM,GAAG,GAAa,UAAU,CAAC,SAAS,EAAE,CAAC;oBAC7C,UAAU,CAAC,YAAY,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;iBACpC;aACF;QACH,CAAC;QACD,QAAQ,EAAE,GAAG,EAAE;YACb,OAAO,UAAU,EAAE,QAAQ,EAAE,CAAC;QAChC,CAAC;KACF,CAAC,EACF,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,UAAkB,EAAE,EAAE;QAC1C,MAAM,WAAW,GAAG;YAClB,cAAc,EAAE,KAAK;YACrB,qBAAqB,EAAE,IAAI;YAC3B,cAAc,EAAE,IAAI;YACpB,WAAW;YACX,SAAS,EAAE,mBAAmB;YAC9B,OAAO;YACP,yBAAyB,EAAE,iBAAiB,EAAE,cAAc;SAC7D,CAAC;QACF,QAAQ,CAAC,UAAU,EAAE,kBAAkB,EAAE,WAAW,CAAC,CAAC;IACxD,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,KAAK,EAAE,MAAc,EAAE,KAAmB,EAAE,SAAiB,EAAE,EAAE;QACtF,OAAO,CAAC,SAAS,CAAC,CAAC;QACnB,QAAQ,EAAE,CAAC,SAAS,CAAC,CAAC;QACtB,MAAM,aAAa,GAAG,MAAM,CAAC,SAAS,EAAE,CAAC;QACzC,MAAM,gBAAgB,GAAG,MAAM;aAC5B,UAAU,CAAC,aAAa,CAAC;aACzB,MAAM,CAAC,IAAI,EAA6B,CAAC;QAE5C,IAAI,cAAc,GAAqB,EAAE,CAAC;QAE1C,IAAI,oBAAoB,EAAE,QAAQ,CAAC,gBAAgB,CAAC,IAAI,gBAAgB,EAAE;YACxE,oBAAoB,CAAC;gBACnB,SAAS,EAAE,gBAAgB;gBAC3B,cAAc,EAAE,aAAa;aAC9B,CAAC,CAAC;YAEH,cAAc,GAAG;gBACf,GAAG,CAAC,MAAM,gBAAgB,CAAC,gBAAgB,EAAE;oBAC3C,IAAI,EAAE,aAAa,CAAC,IAAI;oBACxB,EAAE,EAAE,aAAa,CAAC,EAAE;iBACrB,CAAC,CAAC;aACJ,CAAC;YACF,IAAI,OAAO,CAAC,OAAO,EAAE;gBACnB,cAAc,CAAC,cAAc,CAAC,CAAC;aAChC;SACF;IACH,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,MAAM,0BAA0B,GAC9B,iBAAiB;YACjB,UAAU;gBACR,EAAE,UAAU,CAAC,iBAAiB,CAAC,cAAc,CAAC;iBAC7C,MAAM,CAAC,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC;QAElD,IAAI,CAAC,0BAA0B,EAAE;YAC/B,UAAU,EAAE,SAAS,EAAE,CAAC;YACxB,WAAW,CAAC,KAAK,CAAC,CAAC;YACnB,oBAAoB,CAAC,IAAI,CAAC,CAAC;SAC5B;IACH,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,IAAI,CAAC,iBAAiB,IAAI,OAAO,CAAC,EAAE;YAChD,YAAY,CAAC,UAAU,CAAC,CAAC;YACzB,WAAW,CAAC,IAAI,CAAC,CAAC;SACnB;aAAM;YACL,UAAU,EAAE,SAAS,EAAE,CAAC;YACxB,WAAW,CAAC,KAAK,CAAC,CAAC;SACpB;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC;IAE3B,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;QACvB,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,MAAC,gBAAgB,IACf,SAAS,EAAE;YACT,SAAS,EAAE,QAAQ;YACnB,OAAO,EAAE,SAAS;SACnB,EACD,IAAI,EAAE;YACJ,IAAI,EAAE,CAAC;SACR,EACD,GAAG,EAAE,yBAAyB,EAC9B,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,OAAO,EAClB,WAAW,EAAE,WAAW,KACpB,KAAK,aAET,KAAC,eAAe,IACd,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,EAAE,GAAG,oBAAoB,EAAE,GAAG,iBAAiB,EAAE,EAC1D,cAAc,EAAE,MAAM,CAAC,EAAE;oBACvB,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;oBAC/B,aAAa,CAAC,MAAM,CAAC,CAAC;gBACxB,CAAC,GACD,EACD,MAAM,IAAI,KAAC,mBAAmB,IAAC,MAAM,EAAC,OAAO,YAAE,MAAM,GAAuB,IAC5D,CACpB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["// cSpell:words unfocus\nimport {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useRef,\n useState,\n useEffect,\n useImperativeHandle\n} from 'react';\nimport { Controlled as ReactCodeMirror } from 'react-codemirror2';\nimport {\n showHint,\n defineMode,\n Editor,\n Position,\n EditorChange,\n EditorConfiguration\n} from 'codemirror';\nimport 'codemirror/addon/edit/closebrackets';\nimport 'codemirror/addon/hint/show-hint.js';\n\nimport { useConsolidatedRef, useElement, ForwardProps } from '@pega/cosmos-react-core';\nimport { StyledFormFieldInfo } from '@pega/cosmos-react-core/lib/components/FormField/FormField';\n\nimport {\n AutoCompleteTriggerChar,\n CodeEditorProps,\n EditorState,\n SuggestionType\n} from './CodeEditor.types';\nimport { StyledCodeEditor } from './CodeEditor.styles';\nimport getCodeSuggestions from './getCodeSuggestions';\n\ndefineMode('expression', () => {\n const tokens = [\n /* Below regex is used to identify the context /\n { token: /\\w+@/, style: 'ex-context' },\n / Below regex is used to identify the RuleType /\n { token: /\\w+:/, style: 'ex-context' },\n / Below regex is used to identify the RuleName /\n { token: /\\w+[(]/, style: 'ex-ruleName' },\n / Below regex is used to identify the delimeters /\n { token: /[:.(),]/, style: 'ex-delimeter' },\n / Below regex is used to identify the operators /\n { token: /[-+\\\\/=<>@]+/, style: 'ex-operator' },\n /* Below regex is used to identify the spaces /\n { token: / /, style: 'ex-space' }\n ];\n\n return {\n startState() {\n return { inString: false };\n },\n token(stream, state) {\n / Used to identify the constants in the expression /\n const nextChar = stream.peek();\n if (!state.inString && (nextChar === \"'\" \|\| nextChar === '\"')) {\n stream.next(); // Skip quote\n state.inString = true; // Update state\n }\n\n if (state.inString) {\n if (nextChar && stream.skipTo(nextChar)) {\n // Quote found on this line\n stream.next(); // Skip quote\n state.inString = false; // Clear flag\n } else {\n stream.skipToEnd(); // Rest of line is string\n }\n return nextChar === '\"' ? 'ex-constant' : 'ex-context'; // Token style\n }\n\n if (stream.peek() === '.') {\n stream.next();\n if (stream.match(/.\\w+\\(/)) return 'ex-delimeter';\n }\n\n / Used to match the regex in the expression */\n // eslint-disable-next-line no-restricted-syntax\n for (const element of tokens) {\n const match = stream.match(element.token, false);\n if (match) {\n if (stream.pos === stream.start) {\n stream.next();\n }\n return element.style;\n }\n }\n stream.next();\n return null;\n }\n };\n});\n\nconst defaultConfigOptions: Pick<\n EditorConfiguration,\n 'lineWrapping' \| 'smartIndent' \| 'autoCloseBrackets' \| 'extraKeys'\n> = {\n lineWrapping: true,\n smartIndent: true,\n autoCloseBrackets: true,\n extraKeys: { Tab: false, 'Shift-Tab': false }\n};\n\nconst CodeEditor: FunctionComponent<CodeEditorProps & ForwardProps> = forwardRef(\n (\n {\n fetchSuggestions,\n autoCompleteTriggers,\n editorConfigProps,\n codeEditorHandle,\n defaultValue = '',\n loading = false,\n readOnly,\n errors,\n onChange,\n ...props\n }: PropsWithoutRef<CodeEditorProps>,\n ref: CodeEditorProps['ref']\n ) => {\n const [value, setCode] = useState<string>(defaultValue);\n const [suggestions, setSuggestions] = useState<SuggestionType[]>([]);\n const [codeMirror, setCodeMirror] = useState<Editor \| null>(null);\n const [codeEditorContainer, setCodeEditorContainer] = useElement<HTMLDivElement>();\n const codeEditorConsolidatedRef = useConsolidatedRef(setCodeEditorContainer, ref);\n const [suggestionTrigger, setSuggestionTrigger] = useState<{\n character: AutoCompleteTriggerChar;\n cursorPosition: Position;\n } \| null>(null);\n const [popover, showPopover] = useState(false);\n const mounted = useRef(false);\n\n useImperativeHandle<any, EditorState>(\n codeEditorHandle,\n () => ({\n insertText: (text: string) => {\n if (codeMirror) {\n if (codeMirror.getSelection()) {\n codeMirror.replaceSelection(text);\n } else {\n const cur: Position = codeMirror.getCursor();\n codeMirror.replaceRange(text, cur);\n }\n }\n },\n getValue: () => {\n return codeMirror?.getValue();\n }\n }),\n [codeMirror]\n );\n\n const autoComplete = (codeEditor: Editor) => {\n const hintOptions = {\n completeSingle: false,\n completeOnSingleClick: true,\n closeOnUnfocus: true,\n suggestions,\n container: codeEditorContainer,\n loading,\n triggerCharacterCursorPos: suggestionTrigger?.cursorPosition\n };\n showHint(codeEditor, getCodeSuggestions, hintOptions);\n };\n\n const onBeforeChange = async (editor: Editor, _data: EditorChange, textvalue: string) => {\n setCode(textvalue);\n onChange?.(textvalue);\n const currentCursor = editor.getCursor();\n const currentCharacter = editor\n .getTokenAt(currentCursor)\n .string.trim() as AutoCompleteTriggerChar;\n\n let newSuggestions: SuggestionType[] = [];\n\n if (autoCompleteTriggers?.includes(currentCharacter) && fetchSuggestions) {\n setSuggestionTrigger({\n character: currentCharacter,\n cursorPosition: currentCursor\n });\n\n newSuggestions = [\n ...(await fetchSuggestions(currentCharacter, {\n line: currentCursor.line,\n ch: currentCursor.ch\n }))\n ];\n if (mounted.current) {\n setSuggestions(newSuggestions);\n }\n }\n };\n\n useEffect(() => {\n if (!popover) return;\n const isSuggestionTriggerPresent =\n suggestionTrigger &&\n codeMirror\n ?.getTokenAt(suggestionTrigger.cursorPosition)\n .string.includes(suggestionTrigger.character);\n\n if (!isSuggestionTriggerPresent) {\n codeMirror?.closeHint();\n showPopover(false);\n setSuggestionTrigger(null);\n }\n }, [onBeforeChange]);\n\n useEffect(() => {\n if (codeMirror && (suggestionTrigger \|\| loading)) {\n autoComplete(codeMirror);\n showPopover(true);\n } else {\n codeMirror?.closeHint();\n showPopover(false);\n }\n }, [suggestions, loading]);\n\n useEffect(() => {\n mounted.current = true;\n return () => {\n mounted.current = false;\n };\n }, []);\n\n return (\n <StyledCodeEditor\n container={{\n direction: 'column',\n justify: 'between'\n }}\n item={{\n grow: 1\n }}\n ref={codeEditorConsolidatedRef}\n errors={errors}\n readOnly={readOnly}\n isLoading={loading}\n suggestions={suggestions}\n {...props}\n >\n <ReactCodeMirror\n value={value}\n onBeforeChange={onBeforeChange}\n options={{ ...defaultConfigOptions, ...editorConfigProps }}\n editorDidMount={editor => {\n editor.setSize('100%', '100%');\n setCodeMirror(editor);\n }}\n />\n {errors && <StyledFormFieldInfo status='error'>{errors}</StyledFormFieldInfo>}\n </StyledCodeEditor>\n );\n }\n);\n\nexport default CodeEditor;\n"]}

package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types.d.ts CHANGED Viewed

@@ -7,6 +7,7 @@ export interface EditorState {
     getValue: () => string | undefined;
     insertText: (text: string) => void;
 }
+export declare type CursorPosition = Pick<Position, 'ch' | 'line'>;
 export interface CodeEditorProps {
     /** Default expression to set in the code editor */
     defaultValue?: string;
@@ -15,7 +16,7 @@ export interface CodeEditorProps {
     /** Enable read only mode */
     readOnly?: boolean;
     /** Fetches suggestion list for suggestions popover */
-    fetchSuggestions?: (autoCompleteTrigger: AutoCompleteTriggerChar, queryString: string) => Promise<SuggestionType[]>;
+    fetchSuggestions?: (autoCompleteTrigger: AutoCompleteTriggerChar, cursorPosition: CursorPosition) => Promise<SuggestionType[]>;
     /** characters which triggers suggestions */
     autoCompleteTriggers?: AutoCompleteTriggerChar[];
     /** Code editor configuration props */

package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeEditor.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE5E,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,oBAAY,uBAAuB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEtD,oBAAY,cAAc,GAAG,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,WAAW,GAAG,IAAI,CAAC,CAAC;AAEjF,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,MAAM,MAAM,GAAG,SAAS,CAAC;IACnC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,WAAW,eAAe;IAC9B,mDAAmD;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sDAAsD;IACtD,gBAAgB,CAAC,EAAE,CACjB,mBAAmB,EAAE,uBAAuB,EAC5C,~~WAAW~~,EAAE,~~MAAM~~,~~KAChB~~,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IAC/B,4CAA4C;IAC5C,oBAAoB,CAAC,EAAE,uBAAuB,EAAE,CAAC;IACjD,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,mBAAmB,CAAC;IACxC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,gBAAgB,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yBAAyB,CAAC,EAAE,QAAQ,CAAC;CACtC"}
1	+ {"version":3,"file":"CodeEditor.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE5E,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,oBAAY,uBAAuB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEtD,oBAAY,cAAc,GAAG,IAAI,CAAC,aAAa,EAAE,SAAS,GAAG,WAAW,GAAG,IAAI,CAAC,CAAC;AAEjF,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,MAAM,MAAM,GAAG,SAAS,CAAC;IACnC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,oBAAY,cAAc,GAAG,IAAI,CAAC,QAAQ,EAAE,IAAI,GAAG,MAAM,CAAC,CAAC;AAE3D,MAAM,WAAW,eAAe;IAC9B,mDAAmD;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sDAAsD;IACtD,gBAAgB,CAAC,EAAE,CACjB,mBAAmB,EAAE,uBAAuB,EAC5C,cAAc,EAAE,cAAc,KAC3B,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IAC/B,4CAA4C;IAC5C,oBAAoB,CAAC,EAAE,uBAAuB,EAAE,CAAC;IACjD,sCAAsC;IACtC,iBAAiB,CAAC,EAAE,mBAAmB,CAAC;IACxC,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,gBAAgB,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yBAAyB,CAAC,EAAE,QAAQ,CAAC;CACtC"}

package/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CodeEditor.types.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref } from 'react';\nimport { ShowHintOptions, EditorConfiguration, Position } from 'codemirror';\n\nimport { MenuItemProps } from '@pega/cosmos-react-core';\n\nexport type AutoCompleteTriggerChar = '@' \| '.' \| ':';\n\nexport type SuggestionType = Pick<MenuItemProps, 'primary' \| 'secondary' \| 'id'>;\n\nexport interface EditorState {\n getValue: () => string \| undefined;\n insertText: (text: string) => void;\n}\n\nexport interface CodeEditorProps {\n /** Default expression to set in the code editor /\n defaultValue?: string;\n /* Compiled error message /\n errors?: string;\n /* Enable read only mode /\n readOnly?: boolean;\n /* Fetches suggestion list for suggestions popover /\n fetchSuggestions?: (\n autoCompleteTrigger: AutoCompleteTriggerChar,\n ~~queryString~~: ~~string~~\n ) => Promise<SuggestionType[]>;\n /* characters which triggers suggestions /\n autoCompleteTriggers?: AutoCompleteTriggerChar[];\n /* Code editor configuration props /\n editorConfigProps?: EditorConfiguration;\n /* To show loader for intellisense popover /\n loading?: boolean;\n /* Called when editor content changes. */\n onChange?: (expression: string) => void;\n codeEditorHandle: Ref<EditorState>;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface EditorHintOptions extends ShowHintOptions {\n suggestions?: SuggestionType[];\n loading?: boolean;\n triggerCharacterCursorPos?: Position;\n}\n"]}
1	+ {"version":3,"file":"CodeEditor.types.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/CodeEditor.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref } from 'react';\nimport { ShowHintOptions, EditorConfiguration, Position } from 'codemirror';\n\nimport { MenuItemProps } from '@pega/cosmos-react-core';\n\nexport type AutoCompleteTriggerChar = '@' \| '.' \| ':';\n\nexport type SuggestionType = Pick<MenuItemProps, 'primary' \| 'secondary' \| 'id'>;\n\nexport interface EditorState {\n getValue: () => string \| undefined;\n insertText: (text: string) => void;\n}\n\nexport type CursorPosition = Pick<Position, 'ch' \| 'line'>;\n\nexport interface CodeEditorProps {\n /** Default expression to set in the code editor /\n defaultValue?: string;\n /* Compiled error message /\n errors?: string;\n /* Enable read only mode /\n readOnly?: boolean;\n /* Fetches suggestion list for suggestions popover /\n fetchSuggestions?: (\n autoCompleteTrigger: AutoCompleteTriggerChar,\n cursorPosition: CursorPosition\n ) => Promise<SuggestionType[]>;\n /* characters which triggers suggestions /\n autoCompleteTriggers?: AutoCompleteTriggerChar[];\n /* Code editor configuration props /\n editorConfigProps?: EditorConfiguration;\n /* To show loader for intellisense popover /\n loading?: boolean;\n /* Called when editor content changes. */\n onChange?: (expression: string) => void;\n codeEditorHandle: Ref<EditorState>;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface EditorHintOptions extends ShowHintOptions {\n suggestions?: SuggestionType[];\n loading?: boolean;\n triggerCharacterCursorPos?: Position;\n}\n"]}

package/lib/components/ExpressionBuilder/index.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 export { default } from './ExpressionBuilder';
 export { ExpressionListProps, ExpressionItemProps, ExpressionBuilderProps, HandleValue, InputParams } from './ExpressionBuilder.types';
-export { EditorState, CodeEditorProps } from './CodeEditor/CodeEditor.types';
+export { EditorState, CodeEditorProps, AutoCompleteTriggerChar, SuggestionType, CursorPosition } from './CodeEditor/CodeEditor.types';
 export { default as ExpressionItem } from './ExpressionItem';
 export { default as ExpressionList } from './ExpressionList';
 export { default as ExpressionDetails } from './ExpressionDetails';

package/lib/components/ExpressionBuilder/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,sBAAsB,EACtB,WAAW,EACX,WAAW,EACZ,MAAM,2BAA2B,CAAC;AACnC,OAAO,~~EAAE~~,WAAW,~~EAAE~~,eAAe,~~EAAE~~,MAAM,+BAA+B,CAAC;~~AAC7E~~,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,sBAAsB,EACtB,WAAW,EACX,WAAW,EACZ,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,WAAW,EACX,eAAe,EACf,uBAAuB,EACvB,cAAc,EACd,cAAc,EACf,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,yBAAyB,CAAC"}