@pega/cosmos-react-build 5.0.0-dev.4.7 → 5.0.0-dev.4.9

package/lib/components/AppShell/Header/AppHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  MouseEvent,\n  FC,\n  PropsWithoutRef,\n  useCallback,\n  useEffect,\n  useState,\n  useRef,\n  Dispatch,\n  SetStateAction\n} from 'react';\n\nimport {\n  ContextSwitcher,\n  Flex,\n  SearchInput,\n  ForwardProps,\n  SearchInputProps,\n  useBreakpoint,\n  Button,\n  Icon,\n  useI18n,\n  Tooltip,\n  useElement,\n  Avatar\n} from '@pega/cosmos-react-core';\nimport AppShellOperator from '@pega/cosmos-react-core/lib/components/AppShell/Operator';\nimport {\n  StyledAppHeaderSearchForm,\n  StyledAppHeaderOperator\n} from '@pega/cosmos-react-core/lib/components/AppShell/AppHeader.styles';\n\nimport {\n  StyledAppHeader,\n  StyledTabs,\n  StyledUtilsContainer,\n  StyledBrandContainer,\n  StyledAppHeaderSearch,\n  StyledAppName,\n  StyledAppVersion,\n  StyledBrandButton,\n  StyledBrandImage,\n  StyledContext\n} from './AppHeader.styles';\nimport { AppHeaderProps, LinkProps, UtilsProps } from './AppHeader.types';\nimport BranchButton from './BranchButton';\n\nconst Links: FC<{ links: LinkProps[] }> = ({ links }) => {\n  const [currentTabId, setCurrentTabId] = useState(links[0].id);\n\n  useEffect(() => {\n    setCurrentTabId(links[0].id);\n  }, [links]);\n\n  const handleTabClick = useCallback(\n    (id: string, e?: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n      const newActiveTab = links.find(item => item.id === id);\n      if (newActiveTab) {\n        newActiveTab.onClick?.(id, e);\n        setCurrentTabId(newActiveTab.id);\n      }\n    },\n    [links]\n  );\n\n  return <StyledTabs tabs={links} currentTabId={currentTabId} onTabClick={handleTabClick} />;\n};\n\nconst AppHeaderSearch: FC<\n  SearchInputProps & {\n    showSearchButton: boolean;\n    setShowSearchButton: Dispatch<SetStateAction<boolean>>;\n  }\n> = ({ showSearchButton, setShowSearchButton, ...restProps }) => {\n  const isMediumOrAbove = useBreakpoint('md');\n  const t = useI18n();\n\n  const searchInputRef = useCallback(\n    node => {\n      if (!showSearchButton && node) {\n        node.focus();\n      }\n    },\n    [showSearchButton]\n  );\n  const focusSearchBtn = useRef(false);\n  const searchButtonRef = useCallback(node => {\n    if (node && focusSearchBtn.current) {\n      node.focus();\n    }\n  }, []);\n\n  return isMediumOrAbove || !showSearchButton ? (\n    <Flex\n      as={StyledAppHeaderSearch}\n      item={{ shrink: 0, grow: 1 }}\n      md={{ item: { grow: 0, shrink: 1 } }}\n      container={{ justify: 'between', alignItems: 'center', gap: 1 }}\n    >\n      <StyledAppHeaderSearchForm\n        role='search'\n        aria-label={t('sitewide')}\n        onSubmit={e => e.preventDefault()}\n        isMediumOrAbove={isMediumOrAbove}\n      >\n        <SearchInput {...restProps} ref={searchInputRef} />\n      </StyledAppHeaderSearchForm>\n      <Button\n        variant='simple'\n        icon\n        onClick={() => {\n          setShowSearchButton(true);\n          focusSearchBtn.current = true;\n        }}\n        label={t('collapse_search')}\n      >\n        <Icon name='times' />\n      </Button>\n    </Flex>\n  ) : (\n    <Button\n      variant='simple'\n      icon\n      onClick={() => setShowSearchButton(false)}\n      ref={searchButtonRef}\n      label={t('expand_search')}\n    >\n      <Icon name='search' />\n    </Button>\n  );\n};\n\nconst Utils: FC<UtilsProps> = ({ operator, branch, action, appInfo }) => {\n  const isMediumOrAbove = useBreakpoint('md');\n  const isSmallOrAbove = useBreakpoint('sm');\n  const [appInfoEl, setAppInfoEl] = useElement(null);\n\n  return (\n    <Flex\n      container={{ justify: 'between', alignItems: 'center' }}\n      md={{ container: { justify: 'end' } }}\n      item={{ shrink: 1 }}\n      as={StyledUtilsContainer}\n    >\n      {appInfo && (\n        <Flex\n          container={{ justify: 'between', alignItems: 'center', gap: 0.5 }}\n          item={{ shrink: 1 }}\n          ref={setAppInfoEl}\n        >\n          <Flex as={StyledAppName} item={{ shrink: 1 }}>\n            {appInfo.name}\n          </Flex>\n          <StyledAppVersion>{appInfo.version}</StyledAppVersion>\n          <Tooltip target={appInfoEl} hideDelay='none'>\n            {`${appInfo.name} ${appInfo.version}`}\n          </Tooltip>\n        </Flex>\n      )}\n      <Flex container={{ alignItems: 'center' }}>\n        {branch && <BranchButton {...branch} compact={isSmallOrAbove ? branch.compact : true} />}\n        {action && (\n          <Flex\n            container={{ justify: 'between', alignItems: 'center', gap: 0.5 }}\n            item={{ shrink: 0 }}\n            as={Button}\n            variant='secondary'\n            icon={!isMediumOrAbove}\n            label={isMediumOrAbove ? undefined : action.text}\n            onClick={(e: MouseEvent<HTMLButtonElement>) => action.onClick?.(action.id, e)}\n            disabled={action.disabled}\n          >\n            {action.icon && <Icon name={action.icon} />}\n            {isMediumOrAbove && action.text}\n          </Flex>\n        )}\n      </Flex>\n      {isMediumOrAbove && (\n        <AppShellOperator\n          as={StyledAppHeaderOperator}\n          actions={operator.actions}\n          popover={{ placement: 'bottom-end' }}\n        >\n          <Avatar {...operator.avatar} />\n        </AppShellOperator>\n      )}\n    </Flex>\n  );\n};\n\nconst AppHeader: FunctionComponent<AppHeaderProps & ForwardProps> = forwardRef(function AppHeader(\n  {\n    contextSwitcher: { contexts, onContextClick, label: contextSwitcherLabel } = {},\n    brand,\n    utils,\n    links\n  }: PropsWithoutRef<AppHeaderProps>,\n  ref: AppHeaderProps['ref']\n) {\n  const selectedContext = contexts?.length > 1 ? contexts.find(ctx => ctx.selected)! : contexts[0];\n\n  const isMediumOrAbove = useBreakpoint('md');\n  const [showSearchButton, setShowSearchButton] = useState(true);\n\n  useEffect(() => {\n    if (isMediumOrAbove && !showSearchButton) {\n      setShowSearchButton(true);\n    }\n  }, [isMediumOrAbove]);\n\n  return (\n    <Flex\n      as={StyledAppHeader}\n      container={{\n        justify: 'between',\n        alignItems: 'center',\n        colGap: 2,\n        wrap: 'wrap',\n        pad: [0, 1]\n      }}\n      md={{ container: { wrap: 'nowrap' } }}\n      ref={ref}\n    >\n      {showSearchButton && (\n        <Flex\n          as={StyledBrandContainer}\n          container={{\n            justify: 'between',\n            alignItems: 'center',\n            gap: 1\n          }}\n          item={{ shrink: 0, alignSelf: 'stretch' }}\n        >\n          {contexts && onContextClick && contexts.length > 1 && (\n            <ContextSwitcher\n              contexts={contexts}\n              onContextClick={onContextClick}\n              label={contextSwitcherLabel}\n            />\n          )}\n          <Flex\n            as={brand.onClick || brand.href ? StyledBrandButton : 'div'}\n            variant='simple'\n            container={{ alignItems: 'center', justify: 'between', gap: 2, pad: 1 }}\n            aria-label={`${brand.label} - ${selectedContext.primary}`}\n            onClick={brand.onClick}\n            href={brand.href}\n          >\n            <Flex item={{ shrink: 0 }} as={StyledBrandImage} src={brand.logo} alt={brand.label} />\n            <Flex container={{ justify: 'between', alignItems: 'center', gap: 1 }}>\n              {selectedContext.visual}\n              <StyledContext>{selectedContext.primary}</StyledContext>\n            </Flex>\n          </Flex>\n        </Flex>\n      )}\n      {links && links.length > 0 && <Links links={links} />}\n\n      <Flex\n        container={{\n          gap: 1,\n          justify: 'center',\n          alignItems: 'center'\n        }}\n        item={{ grow: showSearchButton ? 0 : 1 }}\n        md={{ item: { grow: showSearchButton ? 1 : 0 } }}\n      >\n        {utils?.search && (\n          <AppHeaderSearch\n            {...utils.search}\n            showSearchButton={showSearchButton}\n            setShowSearchButton={setShowSearchButton}\n          />\n        )}\n        {showSearchButton && !isMediumOrAbove && utils?.operator && (\n          <AppShellOperator\n            as={StyledAppHeaderOperator}\n            actions={utils.operator.actions}\n            popover={{ placement: 'bottom-start' }}\n          >\n            <Avatar {...utils.operator.avatar} />\n          </AppShellOperator>\n        )}\n      </Flex>\n      {utils && <Utils {...utils} />}\n    </Flex>\n  );\n});\n\nexport default AppHeader;\n"]}

package/lib/components/AppShell/Header/AppHeader.styles.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-import { Text, Tabs } from '@pega/cosmos-react-core';
-export declare const StyledAppHeader: import("styled-components").StyledComponent<"header", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBrandContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBrandButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core/lib/components/Button/BareButton").BareButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledBrandImage: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ImageProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledContext: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledTabs: typeof Tabs;
-export declare const StyledAppHeaderSearch: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledUtilsContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledAppName: typeof Text;
-export declare const StyledAppVersion: typeof Text;
-//# sourceMappingURL=AppHeader.styles.d.ts.map

package/lib/components/AppShell/Header/AppHeader.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAoB,IAAI,EAAE,IAAI,EAAuB,MAAM,yBAAyB,CAAC;AAI5F,eAAO,MAAM,eAAe,4GA8B3B,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAkBhC,CAAC;AAIF,eAAO,MAAM,iBAAiB,0QAa5B,CAAC;AAIH,eAAO,MAAM,gBAAgB,oOAgB5B,CAAC;AAEF,eAAO,MAAM,aAAa,0GAIzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,OAAO,IA8B/B,CAAC;AAIF,eAAO,MAAM,qBAAqB,yGA0BjC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAmBhC,CAAC;AAIF,eAAO,MAAM,aAAa,EAAE,OAAO,IAUjC,CAAC;AAIH,eAAO,MAAM,gBAAgB,EAAE,OAAO,IAKpC,CAAC"}

package/lib/components/AppShell/Header/AppHeader.styles.js

@@ -1,158 +0,0 @@
-import styled, { css } from 'styled-components';
-import { defaultThemeProp, Text, Tabs, Image, StyledButton } from '@pega/cosmos-react-core';
-import { StyledAppHeaderSearchForm } from '@pega/cosmos-react-core/lib/components/AppShell/AppHeader.styles';
-import BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';
-export const StyledAppHeader = styled.header(({ theme: { base: { palette, breakpoints, 'z-index': zIndex } } }) => {
-    return css `
-      height: 6rem;
-      border-bottom: 0.0625rem solid ${palette['border-line']};
-      background-color: ${palette['primary-background']};
-      position: sticky;
-      top: 0;
-      z-index: calc(${zIndex.drawer + 1});
-      & > div {
-        height: 50%;
-      }
-
-      @media (pointer: coarse) {
-        height: 8rem;
-      }
-
-      @media (min-width: ${breakpoints.md}) {
-        height: 3rem;
-
-        & > div {
-          height: 100%;
-        }
-      }
-    `;
-});
-StyledAppHeader.defaultProps = defaultThemeProp;
-export const StyledBrandContainer = styled.div(({ theme: { base: { 'hit-area': hitArea, breakpoints, spacing } } }) => {
-    return css `
-      max-width: calc(100% - calc(3 * ${hitArea.mouse}));
-
-      @media (min-width: ${breakpoints.xs}) and (pointer: coarse) {
-        max-width: calc(100% - calc(3 * ${hitArea.mouse}) - calc(2 * ${spacing}));
-      }
-
-      @media (min-width: ${breakpoints.md}) {
-        max-width: 30%;
-      }
-    `;
-});
-StyledBrandContainer.defaultProps = defaultThemeProp;
-export const StyledBrandButton = styled(BareButton)(({ theme }) => {
-    return css `
-    text-decoration: none;
-    min-width: 0;
-
-    & > div:last-child {
-      min-width: 0;
-    }
-
-    &:not([disabled]):focus {
-      box-shadow: ${theme.base.shadow.focus};
-    }
-  `;
-});
-StyledBrandButton.defaultProps = defaultThemeProp;
-export const StyledBrandImage = styled(Image)(({ theme: { base: { breakpoints } } }) => {
-    return css `
-      height: 1.5rem;
-      max-width: 17ch;
-      display: none;
-
-      @media (min-width: ${breakpoints.sm}) {
-        display: unset;
-      }
-    `;
-});
-export const StyledContext = styled.span `
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-export const StyledTabs = styled(Tabs)(({ theme: { base: { breakpoints, 'font-weight': fontWeight } } }) => {
-    return css `
-      display: none;
-      border: none;
-      min-height: 3rem;
-      [role='tab'] {
-        height: auto;
-        span:first-of-type {
-          text-transform: none;
-        }
-      }
-      [role='tab'][aria-selected='false'] > span {
-        font-weight: ${fontWeight['semi-bold']};
-      }
-      [role='tab']:hover,
-      [role='tab']:focus,
-      [role='tab']:active {
-        box-shadow: none;
-      }
-
-      @media (min-width: ${breakpoints.md}) {
-        display: inherit;
-      }
-    `;
-});
-StyledTabs.defaultProps = defaultThemeProp;
-export const StyledAppHeaderSearch = styled.div(({ theme: { base: { spacing, breakpoints, 'content-width': contentWidth } } }) => {
-    return css `
-      padding-block: ${spacing};
-      width: 100%;
-      ${StyledAppHeaderSearchForm} {
-        margin-inline-start: 0;
-        max-width: 100%;
-      }
-
-      @media (min-width: ${breakpoints.md}) {
-        ${StyledAppHeaderSearchForm} {
-          margin-inline-start: auto;
-          max-width: ${contentWidth.lg};
-        }
-
-        ${StyledButton} {
-          display: none;
-        }
-      }
-    `;
-});
-StyledAppHeaderSearch.defaultProps = defaultThemeProp;
-export const StyledUtilsContainer = styled.div(({ theme: { base: { spacing, breakpoints } } }) => {
-    return css `
-      width: 100%;
-      & > div,
-      & > span,
-      & > button {
-        margin-inline-start: ${spacing};
-      }
-
-      @media (min-width: ${breakpoints.md}) {
-        width: auto;
-      }
-    `;
-});
-StyledUtilsContainer.defaultProps = defaultThemeProp;
-export const StyledAppName = styled(Text)(({ theme }) => {
-    return css `
-    max-width: ${theme.base['content-width'].sm};
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-    color: ${theme.base.palette['foreground-color']};
-    font-weight: ${theme.base['font-weight']['semi-bold']};
-    margin-inline-start: 0;
-  `;
-});
-StyledAppName.defaultProps = defaultThemeProp;
-export const StyledAppVersion = styled(Text)(({ theme }) => {
-    return css `
-    font-weight: ${theme.base['font-weight']['semi-bold']};
-    margin-inline-start: 0;
-  `;
-});
-StyledAppVersion.defaultProps = defaultThemeProp;
-//# sourceMappingURL=AppHeader.styles.js.map

package/lib/components/AppShell/Header/AppHeader.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Text, Tabs, Image, StyledButton } from '@pega/cosmos-react-core';\nimport { StyledAppHeaderSearchForm } from '@pega/cosmos-react-core/lib/components/AppShell/AppHeader.styles';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nexport const StyledAppHeader = styled.header(\n  ({\n    theme: {\n      base: { palette, breakpoints, 'z-index': zIndex }\n    }\n  }) => {\n    return css`\n      height: 6rem;\n      border-bottom: 0.0625rem solid ${palette['border-line']};\n      background-color: ${palette['primary-background']};\n      position: sticky;\n      top: 0;\n      z-index: calc(${zIndex.drawer + 1});\n      & > div {\n        height: 50%;\n      }\n\n      @media (pointer: coarse) {\n        height: 8rem;\n      }\n\n      @media (min-width: ${breakpoints.md}) {\n        height: 3rem;\n\n        & > div {\n          height: 100%;\n        }\n      }\n    `;\n  }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n\nexport const StyledBrandContainer = styled.div(\n  ({\n    theme: {\n      base: { 'hit-area': hitArea, breakpoints, spacing }\n    }\n  }) => {\n    return css`\n      max-width: calc(100% - calc(3 * ${hitArea.mouse}));\n\n      @media (min-width: ${breakpoints.xs}) and (pointer: coarse) {\n        max-width: calc(100% - calc(3 * ${hitArea.mouse}) - calc(2 * ${spacing}));\n      }\n\n      @media (min-width: ${breakpoints.md}) {\n        max-width: 30%;\n      }\n    `;\n  }\n);\n\nStyledBrandContainer.defaultProps = defaultThemeProp;\n\nexport const StyledBrandButton = styled(BareButton)(({ theme }) => {\n  return css`\n    text-decoration: none;\n    min-width: 0;\n\n    & > div:last-child {\n      min-width: 0;\n    }\n\n    &:not([disabled]):focus {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledBrandButton.defaultProps = defaultThemeProp;\n\nexport const StyledBrandImage = styled(Image)(\n  ({\n    theme: {\n      base: { breakpoints }\n    }\n  }) => {\n    return css`\n      height: 1.5rem;\n      max-width: 17ch;\n      display: none;\n\n      @media (min-width: ${breakpoints.sm}) {\n        display: unset;\n      }\n    `;\n  }\n);\n\nexport const StyledContext = styled.span`\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n`;\n\nexport const StyledTabs: typeof Tabs = styled(Tabs)(\n  ({\n    theme: {\n      base: { breakpoints, 'font-weight': fontWeight }\n    }\n  }) => {\n    return css`\n      display: none;\n      border: none;\n      min-height: 3rem;\n      [role='tab'] {\n        height: auto;\n        span:first-of-type {\n          text-transform: none;\n        }\n      }\n      [role='tab'][aria-selected='false'] > span {\n        font-weight: ${fontWeight['semi-bold']};\n      }\n      [role='tab']:hover,\n      [role='tab']:focus,\n      [role='tab']:active {\n        box-shadow: none;\n      }\n\n      @media (min-width: ${breakpoints.md}) {\n        display: inherit;\n      }\n    `;\n  }\n);\n\nStyledTabs.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSearch = styled.div(\n  ({\n    theme: {\n      base: { spacing, breakpoints, 'content-width': contentWidth }\n    }\n  }) => {\n    return css`\n      padding-block: ${spacing};\n      width: 100%;\n      ${StyledAppHeaderSearchForm} {\n        margin-inline-start: 0;\n        max-width: 100%;\n      }\n\n      @media (min-width: ${breakpoints.md}) {\n        ${StyledAppHeaderSearchForm} {\n          margin-inline-start: auto;\n          max-width: ${contentWidth.lg};\n        }\n\n        ${StyledButton} {\n          display: none;\n        }\n      }\n    `;\n  }\n);\n\nStyledAppHeaderSearch.defaultProps = defaultThemeProp;\n\nexport const StyledUtilsContainer = styled.div(\n  ({\n    theme: {\n      base: { spacing, breakpoints }\n    }\n  }) => {\n    return css`\n      width: 100%;\n      & > div,\n      & > span,\n      & > button {\n        margin-inline-start: ${spacing};\n      }\n\n      @media (min-width: ${breakpoints.md}) {\n        width: auto;\n      }\n    `;\n  }\n);\n\nStyledUtilsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAppName: typeof Text = styled(Text)(({ theme }) => {\n  return css`\n    max-width: ${theme.base['content-width'].sm};\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n    color: ${theme.base.palette['foreground-color']};\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n    margin-inline-start: 0;\n  `;\n});\n\nStyledAppName.defaultProps = defaultThemeProp;\n\nexport const StyledAppVersion: typeof Text = styled(Text)(({ theme }) => {\n  return css`\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n    margin-inline-start: 0;\n  `;\n});\n\nStyledAppVersion.defaultProps = defaultThemeProp;\n"]}

package/lib/components/AppShell/Header/AppHeader.types.d.ts

@@ -1,33 +0,0 @@
-import { Ref, MouseEvent } from 'react';
-import { AppShellProps, OmitStrict, Action, BaseProps, NoChildrenProp, Tab, AvatarProps, SearchInputProps } from '@pega/cosmos-react-core';
-import { ContextSwitcherProps } from '@pega/cosmos-react-core/lib/components/AppShell/AppShell.types';
-import { BranchButtonProps } from './BranchButton';
-export interface OperatorProps extends OmitStrict<AppShellProps['operator'], 'avatar'> {
-    avatar: Pick<AvatarProps, 'name' | 'imageSrc'>;
-}
-export interface AppHeaderProps extends BaseProps, NoChildrenProp {
-    contextSwitcher: ContextSwitcherProps;
-    brand: {
-        label: string;
-        logo: string;
-        href?: string;
-        onClick?: (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
-    };
-    links?: LinkProps[];
-    utils?: UtilsProps;
-    ref?: Ref<HTMLDivElement>;
-}
-export interface LinkProps extends Tab {
-    onClick?: (id: string, e?: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
-}
-export interface UtilsProps {
-    operator: OperatorProps;
-    search?: SearchInputProps;
-    branch?: BranchButtonProps;
-    action?: Pick<Action, 'id' | 'text' | 'onClick' | 'disabled' | 'icon'>;
-    appInfo?: {
-        name: string;
-        version: string;
-    };
-}
-//# sourceMappingURL=AppHeader.types.d.ts.map

package/lib/components/AppShell/Header/AppHeader.types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppHeader.types.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EACL,aAAa,EACb,UAAU,EACV,MAAM,EACN,SAAS,EACT,cAAc,EACd,GAAG,EACH,WAAW,EACX,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,gEAAgE,CAAC;AAEtG,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEnD,MAAM,WAAW,aAAc,SAAQ,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,EAAE,QAAQ,CAAC;IACpF,MAAM,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,UAAU,CAAC,CAAC;CAChD;AACD,MAAM,WAAW,cAAe,SAAQ,SAAS,EAAE,cAAc;IAC/D,eAAe,EAAE,oBAAoB,CAAC;IACtC,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAC;KAC1E,CAAC;IACF,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,SAAU,SAAQ,GAAG;IACpC,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACvF;AAED,MAAM,WAAW,UAAU;IACzB,QAAQ,EAAE,aAAa,CAAC;IACxB,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,MAAM,CAAC,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC,CAAC;IACvE,OAAO,CAAC,EAAE;QACR,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;KACjB,CAAC;CACH"}

package/lib/components/AppShell/Header/AppHeader.types.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=AppHeader.types.js.map

package/lib/components/AppShell/Header/AppHeader.types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppHeader.types.js","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/AppHeader.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Ref, MouseEvent } from 'react';\n\nimport {\n  AppShellProps,\n  OmitStrict,\n  Action,\n  BaseProps,\n  NoChildrenProp,\n  Tab,\n  AvatarProps,\n  SearchInputProps\n} from '@pega/cosmos-react-core';\nimport { ContextSwitcherProps } from '@pega/cosmos-react-core/lib/components/AppShell/AppShell.types';\n\nimport { BranchButtonProps } from './BranchButton';\n\nexport interface OperatorProps extends OmitStrict<AppShellProps['operator'], 'avatar'> {\n  avatar: Pick<AvatarProps, 'name' | 'imageSrc'>;\n}\nexport interface AppHeaderProps extends BaseProps, NoChildrenProp {\n  contextSwitcher: ContextSwitcherProps;\n  brand: {\n    label: string;\n    logo: string;\n    href?: string;\n    onClick?: (e: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;\n  };\n  links?: LinkProps[];\n  utils?: UtilsProps;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface LinkProps extends Tab {\n  onClick?: (id: string, e?: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;\n}\n\nexport interface UtilsProps {\n  operator: OperatorProps;\n  search?: SearchInputProps;\n  branch?: BranchButtonProps;\n  action?: Pick<Action, 'id' | 'text' | 'onClick' | 'disabled' | 'icon'>;\n  appInfo?: {\n    name: string;\n    version: string;\n  };\n}\n"]}

package/lib/components/AppShell/Header/BranchButton.d.ts

@@ -1,20 +0,0 @@
-import { FunctionComponent } from 'react';
-import { DefaultTheme } from 'styled-components';
-import { Button, CountProps, MenuProps, StatusProps } from '@pega/cosmos-react-core';
-export interface BranchButtonProps {
-    /** The text for the BranchButton also used to set the aria-label. */
-    text: string;
-    /** Determines the variant for the BranchButton. */
-    variant?: Extract<StatusProps['variant'], 'success' | 'urgent'>;
-    /** Only display the branch and caret icon */
-    compact?: boolean;
-    /** The total count representing the number of unmerged changes. */
-    count?: CountProps['children'];
-    /** An array of MenuItemProps. */
-    items: MenuProps['items'];
-}
-export declare const StyledBranchButton: typeof Button;
-export declare const StyledWarnIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, DefaultTheme, {}, never>;
-declare const BranchButton: FunctionComponent<BranchButtonProps>;
-export default BranchButton;
-//# sourceMappingURL=BranchButton.d.ts.map

package/lib/components/AppShell/Header/BranchButton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BranchButton.d.ts","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/BranchButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,iBAAiB,EAAiB,MAAM,OAAO,CAAC;AACnE,OAAe,EAAO,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAG9D,OAAO,EACL,MAAM,EACN,UAAU,EAMV,SAAS,EAMT,WAAW,EAGZ,MAAM,yBAAyB,CAAC;AAQjC,MAAM,WAAW,iBAAiB;IAChC,qEAAqE;IACrE,IAAI,EAAE,MAAM,CAAC;IACb,mDAAmD;IACnD,OAAO,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC,CAAC;IAChE,6CAA6C;IAC7C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mEAAmE;IACnE,KAAK,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;IAC/B,iCAAiC;IACjC,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,OAAO,MAuDvC,CAAC;AAqBF,eAAO,MAAM,cAAc,8JAIzB,CAAC;AAgBH,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAoEtD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/AppShell/Header/BranchButton.js

@@ -1,91 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import styled, { css } from 'styled-components';
-import { readableColor } from 'polished';
-import { Button, defaultThemeProp, Flex, Icon, Menu, Count, Popover, useDirection, useElement, registerIcon, useOuterEvent, useI18n, tryCatch } from '@pega/cosmos-react-core';
-import * as nodesDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down-solid.icon';
-import * as warnSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/warn-solid.icon';
-import * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';
-import { StyledCount } from '@pega/cosmos-react-core/lib/components/Badges/Count';
-registerIcon(nodesDownSolidIcon, warnSolidIcon, caretDownIcon);
-export const StyledBranchButton = styled(Button)(({ theme, branchVariant }) => {
-    const { base: { colors, palette: { 'primary-background': primaryBackground }, shadow: { focus }, spacing }, components: { badges: { status, count: { default: { background, foreground } } } } } = theme;
-    const backgroundColor = branchVariant ? status[branchVariant].background : primaryBackground;
-    const borderColor = !branchVariant ? colors.gray.medium : 'transparent';
-    const countBgColor = branchVariant === 'success' ? colors.green.medium : background;
-    const countColor = branchVariant === 'success' ? colors.white : foreground;
-    const buttonColor = tryCatch(() => readableColor(backgroundColor));
-    return css `
-      flex-shrink: 0;
-      background-color: ${backgroundColor};
-      border-color: ${borderColor};
-      color: ${buttonColor};
-      padding-inline-start: ${spacing};
-      padding-inline-end: ${spacing};
-
-      &:hover {
-        background-color: ${backgroundColor};
-        box-shadow: ${focus};
-      }
-
-      svg {
-        height: 1rem;
-        width: 1rem;
-      }
-
-      ${StyledCount} {
-        background-color: ${countBgColor};
-        color: ${countColor};
-      }
-    `;
-});
-StyledBranchButton.defaultProps = defaultThemeProp;
-const StyledBranchButtonPopover = styled(Popover)(({ theme: { base: { spacing, 'content-width': contentWidth } } }) => {
-    const minWidth = `calc(${contentWidth.xs} + (2 * ${spacing}))`;
-    return css `
-      min-width: ${minWidth};
-      max-width: calc(${minWidth} + 5ch);
-    `;
-});
-StyledBranchButtonPopover.defaultProps = defaultThemeProp;
-export const StyledWarnIcon = styled(Icon)(({ theme }) => {
-    return css `
-    color: ${theme.base.colors.red.medium};
-  `;
-});
-StyledWarnIcon.defaultProps = defaultThemeProp;
-const StyledEllipsizedText = styled.span(({ theme }) => {
-    return css `
-    max-width: ${theme.base['content-width'].xs};
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    line-height: 1.5;
-  `;
-});
-StyledEllipsizedText.defaultProps = defaultThemeProp;
-const BranchButton = (props) => {
-    const { text, variant, count, compact = false, items = [] } = props;
-    const [open, setOpen] = useState(false);
-    const [popoverEl, setPopoverRef] = useElement();
-    const [buttonEl, setButtonEl] = useElement();
-    const { rtl } = useDirection();
-    const t = useI18n();
-    useOuterEvent('mousedown', [popoverEl, buttonEl], () => {
-        if (open)
-            setOpen(false);
-    });
-    let ariaLabel = t('branch_with_no_changes', [text]);
-    if (variant === 'success') {
-        ariaLabel = t('branch_with_no_potential_conflicts', [text, count ?? 0]);
-    }
-    else if (variant === 'urgent') {
-        ariaLabel = t('branch_with_potential_conflicts', [text]);
-    }
-    return (_jsxs(_Fragment, { children: [_jsx(StyledBranchButton, { ref: setButtonEl, "aria-expanded": open, "aria-haspopup": 'menu', "aria-controls": 'branch-popover', "aria-label": ariaLabel, branchVariant: variant, label: !open && compact ? text : undefined, onClick: () => setOpen(cur => !cur), onKeyDown: (e) => {
-                    if (e.key === 'Escape')
-                        setOpen(false);
-                }, children: _jsxs(Flex, { container: { alignItems: 'center', gap: compact ? 1 : 0.5 }, children: [_jsx(Icon, { name: 'nodes-down-solid' }), !compact && (_jsxs(_Fragment, { children: [_jsx(StyledEllipsizedText, { children: text }), variant === 'urgent' ? (_jsx(StyledWarnIcon, { name: 'warn-solid' })) : (count !== undefined && _jsx(Count, { children: count }))] })), _jsx(Icon, { name: 'caret-down' })] }) }), _jsx(StyledBranchButtonPopover, { placement: rtl ? 'bottom-end' : 'bottom-start', id: 'branch-popover', hideOnTargetHidden: true, show: open, target: buttonEl, ref: setPopoverRef, children: _jsx(Menu, { items: items, scrollAt: 20, onItemClick: () => setOpen(false), focusControlEl: buttonEl || undefined }) })] }));
-};
-export default BranchButton;
-//# sourceMappingURL=BranchButton.js.map

package/lib/components/AppShell/Header/BranchButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BranchButton.js","sourceRoot":"","sources":["../../../../src/components/AppShell/Header/BranchButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css, DefaultTheme } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport {\n  Button,\n  CountProps,\n  defaultThemeProp,\n  Flex,\n  Icon,\n  Menu,\n  Count,\n  MenuProps,\n  Popover,\n  useDirection,\n  useElement,\n  registerIcon,\n  useOuterEvent,\n  StatusProps,\n  useI18n,\n  tryCatch\n} from '@pega/cosmos-react-core';\nimport * as nodesDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down-solid.icon';\nimport * as warnSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/warn-solid.icon';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport { StyledCount } from '@pega/cosmos-react-core/lib/components/Badges/Count';\n\nregisterIcon(nodesDownSolidIcon, warnSolidIcon, caretDownIcon);\n\nexport interface BranchButtonProps {\n  /** The text for the BranchButton also used to set the aria-label. */\n  text: string;\n  /** Determines the variant for the BranchButton. */\n  variant?: Extract<StatusProps['variant'], 'success' | 'urgent'>;\n  /** Only display the branch and caret icon */\n  compact?: boolean;\n  /** The total count representing the number of unmerged changes. */\n  count?: CountProps['children'];\n  /** An array of MenuItemProps. */\n  items: MenuProps['items'];\n}\n\nexport const StyledBranchButton: typeof Button = styled(Button)(\n  ({\n    theme,\n    branchVariant\n  }: {\n    theme: DefaultTheme;\n    branchVariant: BranchButtonProps['variant'];\n  }) => {\n    const {\n      base: {\n        colors,\n        palette: { 'primary-background': primaryBackground },\n        shadow: { focus },\n        spacing\n      },\n      components: {\n        badges: {\n          status,\n          count: {\n            default: { background, foreground }\n          }\n        }\n      }\n    } = theme;\n\n    const backgroundColor = branchVariant ? status[branchVariant].background : primaryBackground;\n    const borderColor = !branchVariant ? colors.gray.medium : 'transparent';\n    const countBgColor = branchVariant === 'success' ? colors.green.medium : background;\n    const countColor = branchVariant === 'success' ? colors.white : foreground;\n    const buttonColor = tryCatch(() => readableColor(backgroundColor));\n\n    return css`\n      flex-shrink: 0;\n      background-color: ${backgroundColor};\n      border-color: ${borderColor};\n      color: ${buttonColor};\n      padding-inline-start: ${spacing};\n      padding-inline-end: ${spacing};\n\n      &:hover {\n        background-color: ${backgroundColor};\n        box-shadow: ${focus};\n      }\n\n      svg {\n        height: 1rem;\n        width: 1rem;\n      }\n\n      ${StyledCount} {\n        background-color: ${countBgColor};\n        color: ${countColor};\n      }\n    `;\n  }\n);\n\nStyledBranchButton.defaultProps = defaultThemeProp;\n\nconst StyledBranchButtonPopover = styled(Popover)(\n  ({\n    theme: {\n      base: { spacing, 'content-width': contentWidth }\n    }\n  }) => {\n    const minWidth = `calc(${contentWidth.xs} + (2 * ${spacing}))`;\n\n    return css`\n      min-width: ${minWidth};\n      max-width: calc(${minWidth} + 5ch);\n    `;\n  }\n);\n\nStyledBranchButtonPopover.defaultProps = defaultThemeProp;\n\nexport const StyledWarnIcon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.colors.red.medium};\n  `;\n});\n\nStyledWarnIcon.defaultProps = defaultThemeProp;\n\nconst StyledEllipsizedText = styled.span(({ theme }) => {\n  return css`\n    max-width: ${theme.base['content-width'].xs};\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 1.5;\n  `;\n});\n\nStyledEllipsizedText.defaultProps = defaultThemeProp;\n\nconst BranchButton: FunctionComponent<BranchButtonProps> = (props: BranchButtonProps) => {\n  const { text, variant, count, compact = false, items = [] } = props;\n\n  const [open, setOpen] = useState(false);\n\n  const [popoverEl, setPopoverRef] = useElement<HTMLElement>();\n  const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n  const { rtl } = useDirection();\n  const t = useI18n();\n\n  useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n    if (open) setOpen(false);\n  });\n\n  let ariaLabel = t('branch_with_no_changes', [text]);\n  if (variant === 'success') {\n    ariaLabel = t('branch_with_no_potential_conflicts', [text, count ?? 0]);\n  } else if (variant === 'urgent') {\n    ariaLabel = t('branch_with_potential_conflicts', [text]);\n  }\n\n  return (\n    <>\n      <StyledBranchButton\n        ref={setButtonEl}\n        aria-expanded={open}\n        aria-haspopup='menu'\n        aria-controls='branch-popover'\n        aria-label={ariaLabel}\n        branchVariant={variant}\n        label={!open && compact ? text : undefined}\n        onClick={() => setOpen(cur => !cur)}\n        onKeyDown={(e: KeyboardEvent) => {\n          if (e.key === 'Escape') setOpen(false);\n        }}\n      >\n        <Flex container={{ alignItems: 'center', gap: compact ? 1 : 0.5 }}>\n          <Icon name='nodes-down-solid' />\n          {!compact && (\n            <>\n              <StyledEllipsizedText>{text}</StyledEllipsizedText>\n              {variant === 'urgent' ? (\n                <StyledWarnIcon name='warn-solid' />\n              ) : (\n                count !== undefined && <Count>{count}</Count>\n              )}\n            </>\n          )}\n          <Icon name='caret-down' />\n        </Flex>\n      </StyledBranchButton>\n      <StyledBranchButtonPopover\n        placement={rtl ? 'bottom-end' : 'bottom-start'}\n        id='branch-popover'\n        hideOnTargetHidden\n        show={open}\n        target={buttonEl}\n        ref={setPopoverRef}\n      >\n        <Menu\n          items={items}\n          scrollAt={20}\n          onItemClick={() => setOpen(false)}\n          focusControlEl={buttonEl || undefined}\n        />\n      </StyledBranchButtonPopover>\n    </>\n  );\n};\n\nexport default BranchButton;\n"]}

package/lib/components/AppShell/NavigationList.d.ts

@@ -1,6 +0,0 @@
-import { FunctionComponent } from 'react';
-import { NavProps, NavItemRenderProps } from './AppShell.types';
-export declare const NavLinkItem: FunctionComponent<NavItemRenderProps>;
-declare const NavigationList: FunctionComponent<NavProps>;
-export default NavigationList;
-//# sourceMappingURL=NavigationList.d.ts.map

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

@@ -1 +0,0 @@
-{"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;AA2HhE,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,kBAAkB,CAgC7D,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,QAAQ,CAuC/C,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/AppShell/NavigationList.js

@@ -1,97 +0,0 @@
-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, 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';
-const transformItems = (items, expandedIds) => {
-    if (!items)
-        return [];
-    return items.map(item => ({
-        id: item.id,
-        label: item.label,
-        onClick: (id, e) => {
-            e.stopPropagation();
-            item.onClick?.(id, e);
-        },
-        expanded: item.items ? expandedIds.has(item.id) : undefined,
-        href: item.href,
-        nodes: item.items ? transformItems(item.items, expandedIds) : undefined
-    }));
-};
-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()));
-    const [buttonEl, setButtonEl] = useElement();
-    const treeRef = useRef(null);
-    const toggleCollapsed = (e) => {
-        e.stopPropagation();
-        if (!navOpen) {
-            setCollapsed(false);
-            openNav();
-        }
-        else
-            setCollapsed(state => !state);
-    };
-    useEscape(() => {
-        setCollapsed(true);
-        buttonEl?.focus();
-    }, treeRef);
-    useEffect(() => {
-        if (currentItemId && treeHelpers.getNode(managedItems, currentItemId)) {
-            setManagedItems(nodes => treeHelpers.expandTo(nodes, currentItemId));
-            setCollapsed(false);
-        }
-    }, [currentItemId]);
-    useAfterInitialEffect(() => {
-        setManagedItems(cur => {
-            const expandedIds = new Set();
-            treeHelpers.forEachNode(cur, node => {
-                if (node.expanded)
-                    expandedIds.add(node.id);
-            });
-            return transformItems(items, expandedIds);
-        });
-    }, [items]);
-    return (_jsxs(_Fragment, { children: [_jsxs(BareButton, { ref: setButtonEl, "aria-expanded": !collapsed, "aria-controls": treeId, "aria-label": label, onClick: toggleCollapsed, children: [visual, _jsx("span", { children: label }), navState === 'open' && (_jsx(StyledAppShellCaretIcon, { name: `caret-${end}`, nestedListCollapsed: collapsed }))] }), !navOpen && (_jsx(Tooltip, { target: buttonEl, placement: end, showDelay: 'none', hideDelay: 'none', children: label })), _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,
-                                expanded: !node.expanded
-                            };
-                        }));
-                    } }) })] }));
-};
-export const NavLinkItem = ({ id, label, visual, href, onClick }) => {
-    const { navOpen } = useContext(AppShellContext);
-    const { end } = useDirection();
-    const [listItemEl, setListItemEl] = useElement();
-    return (_jsxs(_Fragment, { children: [_jsxs(BareButton, { ref: setListItemEl, href: href, onClick: (e) => {
-                    e.stopPropagation();
-                    onClick?.(id, e);
-                }, "aria-label": label, children: [visual, _jsx("span", { children: label })] }), !navOpen && (_jsx(Tooltip, { target: listItemEl, placement: end, showDelay: 'none', hideDelay: 'none', children: label }))] }));
-};
-const NavigationList = ({ items, currentItemId }) => {
-    let ItemComponent;
-    return (_jsx(StyledNavList, { children: items.map(item => {
-            let activeTreeRoot = false;
-            if (item.items) {
-                ItemComponent = NavParentItem;
-                if (currentItemId &&
-                    treeHelpers.getNode(transformItems(item.items, new Set()), currentItemId) !== undefined) {
-                    activeTreeRoot = true;
-                }
-            }
-            else {
-                ItemComponent = NavLinkItem;
-            }
-            const ariaCurrent = item.href ? 'page' : 'true';
-            return (_jsx(StyledNavListItem, { "aria-current": currentItemId === item.id ? ariaCurrent : undefined, activeTreeRoot: activeTreeRoot, id: item.id, children: _jsx(ItemComponent, { ...item, visual: _jsx(Icon, { name: item.icon }), currentItemId: currentItemId }) }, item.id));
-        }) }));
-};
-export default NavigationList;
-//# sourceMappingURL=NavigationList.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"NavigationList.js","sourceRoot":"","sources":["../../../src/components/AppShell/NavigationList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAKL,UAAU,EACV,SAAS,EACT,MAAM,EACN,QAAQ,EACT,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,IAAI,EACJ,OAAO,EACP,cAAc,EACd,UAAU,EACV,YAAY,EAGZ,WAAW,EACX,qBAAqB,EACrB,MAAM,EACP,MAAM,yBAAyB,CAAC;AACjC,OAAO,UAAU,MAAM,0DAA0D,CAAC;AAGlF,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAC9F,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAEhD,MAAM,cAAc,GAAG,CACrB,KAAkC,EAClC,WAAwC,EACZ,EAAE;IAC9B,IAAI,CAAC,KAAK;QAAE,OAAO,EAAE,CAAC;IAEtB,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACxB,EAAE,EAAE,IAAI,CAAC,EAAE;QACX,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,OAAO,EAAE,CAAC,EAAU,EAAE,CAAuD,EAAE,EAAE;YAC/E,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,IAAI,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;QACxB,CAAC;QACD,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS;QAC3D,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS;KACxE,CAAC,CAAC,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,aAAa,GAA0C,CAAC,EAC5D,KAAK,EACL,MAAM,EACN,KAAK,EACL,aAAa,EACd,EAAE,EAAE;IACH,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IACnE,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB,MAAM,EACJ,IAAI,EAAE,EAAE,SAAS,EAAE,EACpB,GAAG,QAAQ,EAAE,CAAC;IACf,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAA6B,GAAG,EAAE,CAChF,cAAc,CAAC,KAAK,EAAE,IAAI,GAAG,EAAE,CAAC,CACjC,CAAC;IAEF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,UAAU,EAAqB,CAAC;IAChE,MAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAE/C,MAAM,eAAe,GAAG,CAAC,CAAgC,EAAE,EAAE;QAC3D,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,OAAO,EAAE;YACZ,YAAY,CAAC,KAAK,CAAC,CAAC;YACpB,OAAO,EAAE,CAAC;SACX;;YAAM,YAAY,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,QAAQ,EAAE,KAAK,EAAE,CAAC;IACpB,CAAC,EAAE,OAAO,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa,IAAI,WAAW,CAAC,OAAO,CAAC,YAAY,EAAE,aAAa,CAAC,EAAE;YACrE,eAAe,CAAC,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;YACrE,YAAY,CAAC,KAAK,CAAC,CAAC;SACrB;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,qBAAqB,CAAC,GAAG,EAAE;QACzB,eAAe,CAAC,GAAG,CAAC,EAAE;YACpB,MAAM,WAAW,GAAG,IAAI,GAAG,EAA0B,CAAC;YAEtD,WAAW,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE;gBAClC,IAAI,IAAI,CAAC,QAAQ;oBAAE,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAC9C,CAAC,CAAC,CAAC;YAEH,OAAO,cAAc,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,8BACE,MAAC,UAAU,IACT,GAAG,EAAE,WAAW,mBACD,CAAC,SAAS,mBACV,MAAM,gBACT,KAAK,EACjB,OAAO,EAAE,eAAe,aAEvB,MAAM,EACP,yBAAO,KAAK,GAAQ,EACnB,QAAQ,KAAK,MAAM,IAAI,CACtB,KAAC,uBAAuB,IAAC,IAAI,EAAE,SAAS,GAAG,EAAE,EAAE,mBAAmB,EAAE,SAAS,GAAI,CAClF,IACU,EACZ,CAAC,OAAO,IAAI,CACX,KAAC,OAAO,IAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,YACzE,KAAK,GACE,CACX,EACD,KAAC,cAAc,IACb,EAAE,EAAE,MAAM,EACV,SAAS,EAAE,SAAS,IAAI,CAAC,OAAO,EAChC,eAAe,EACb,YAAY,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,YAAY,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,YAG9E,KAAC,YAAY,IACX,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE,YAAkC,EACzC,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,KAAK,EACxB,YAAY,EAAE,MAAM,CAAC,EAAE;wBACrB,eAAe,CAAC,KAAK,CAAC,EAAE,CACtB,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE;4BACxC,OAAO;gCACL,GAAG,IAAI;gCACP,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ;6BACzB,CAAC;wBACJ,CAAC,CAAC,CACH,CAAC;oBACJ,CAAC,GACD,GACa,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAA0C,CAAC,EACjE,EAAE,EACF,KAAK,EACL,MAAM,EACN,IAAI,EACJ,OAAO,EACR,EAAE,EAAE;IACH,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAChD,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAyC,CAAC;IAExF,OAAO,CACL,8BACE,MAAC,UAAU,IACT,GAAG,EAAE,aAAa,EAClB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,CAAoD,EAAE,EAAE;oBAChE,CAAC,CAAC,eAAe,EAAE,CAAC;oBACpB,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;gBACnB,CAAC,gBACW,KAAK,aAEhB,MAAM,EACP,yBAAO,KAAK,GAAQ,IACT,EACZ,CAAC,OAAO,IAAI,CACX,KAAC,OAAO,IAAC,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,YAC3E,KAAK,GACE,CACX,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,cAAc,GAAgC,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE;IAC/E,IAAI,aAA0B,CAAC;IAE/B,OAAO,CACL,KAAC,aAAa,cACX,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChB,IAAI,cAAc,GAAG,KAAK,CAAC;YAE3B,IAAI,IAAI,CAAC,KAAK,EAAE;gBACd,aAAa,GAAG,aAAa,CAAC;gBAE9B,IACE,aAAa;oBACb,WAAW,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,GAAG,EAAE,CAAC,EAAE,aAAa,CAAC,KAAK,SAAS,EACvF;oBACA,cAAc,GAAG,IAAI,CAAC;iBACvB;aACF;iBAAM;gBACL,aAAa,GAAG,WAAW,CAAC;aAC7B;YAED,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC;YAChD,OAAO,CACL,KAAC,iBAAiB,oBACF,aAAa,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EACjE,cAAc,EAAE,cAAc,EAE9B,EAAE,EAAE,IAAI,CAAC,EAAE,YAEX,KAAC,aAAa,OACR,IAAI,EACR,MAAM,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,EACjC,aAAa,EAAE,aAAa,GAC5B,IAPG,IAAI,CAAC,EAAE,CAQM,CACrB,CAAC;QACJ,CAAC,CAAC,GACY,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","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 [buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\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    buttonEl?.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={setButtonEl}\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          <StyledAppShellCaretIcon name={`caret-${end}`} nestedListCollapsed={collapsed} />\n        )}\n      </BareButton>\n      {!navOpen && (\n        <Tooltip target={buttonEl} placement={end} showDelay='none' hideDelay='none'>\n          {label}\n        </Tooltip>\n      )}\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        let activeTreeRoot = false;\n\n        if (item.items) {\n          ItemComponent = NavParentItem;\n\n          if (\n            currentItemId &&\n            treeHelpers.getNode(transformItems(item.items, new Set()), currentItemId) !== undefined\n          ) {\n            activeTreeRoot = true;\n          }\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            activeTreeRoot={activeTreeRoot}\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/AppShell/index.d.ts

@@ -1,5 +0,0 @@
-export { default } from './AppShell';
-export type { AppShellProps, NavProps, NavItemProps, NestedNavItemProps } from './AppShell.types';
-export type { AppHeaderProps } from './Header/AppHeader.types';
-export type { BranchButtonProps } from './Header/BranchButton';
-//# sourceMappingURL=index.d.ts.map

package/lib/components/AppShell/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAClG,YAAY,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC/D,YAAY,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC"}

package/lib/components/AppShell/index.js

@@ -1,2 +0,0 @@
-export { default } from './AppShell';
-//# sourceMappingURL=index.js.map

package/lib/components/AppShell/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AppShell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC","sourcesContent":["export { default } from './AppShell';\nexport type { AppShellProps, NavProps, NavItemProps, NestedNavItemProps } from './AppShell.types';\nexport type { AppHeaderProps } from './Header/AppHeader.types';\nexport type { BranchButtonProps } from './Header/BranchButton';\n"]}

package/lib/components/DynamicContentEditor/DynamicContentEditor.d.ts

@@ -1,10 +0,0 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { DynamicContentEditorProps } from './DynamicContentEditor.types';
-export declare const StyledSearchPopover: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    offset?: number | undefined;
-    portal?: boolean | undefined;
-}, never>;
-declare const DynamicContentEditor: FunctionComponent<DynamicContentEditorProps & ForwardProps>;
-export default DynamicContentEditor;
-//# sourceMappingURL=DynamicContentEditor.d.ts.map

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

@@ -1 +0,0 @@
-{"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,CAyTlF,CAAC;AAEL,eAAe,oBAAoB,CAAC"}