@pega/cosmos-react-core 9.0.0-build.28.7 → 9.0.0-build.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/AppShell/AppNavigationPanel.js +1 -1
- package/lib/components/AppShell/AppNavigationPanel.js.map +1 -1
- package/lib/components/AppShell/Drawer.d.ts +1 -2
- package/lib/components/AppShell/Drawer.d.ts.map +1 -1
- package/lib/components/AppShell/Drawer.js +6 -6
- package/lib/components/AppShell/Drawer.js.map +1 -1
- package/lib/components/AppShell/Drawer.styles.d.ts +3 -2
- package/lib/components/AppShell/Drawer.styles.d.ts.map +1 -1
- package/lib/components/AppShell/Drawer.styles.js +15 -36
- package/lib/components/AppShell/Drawer.styles.js.map +1 -1
- package/package.json +1 -1
|
@@ -143,7 +143,7 @@ export const Utils = ({ items }) => {
|
|
|
143
143
|
setItem({ ...next });
|
|
144
144
|
}
|
|
145
145
|
}), [drawerOpen, item?.name]);
|
|
146
|
-
return (_jsxs(AppShellDrawerContext.Provider, { value: ctxValue, children: [_jsx(StyledUtils, { children: _jsx(NavigationList, { items: utilItems, collapsed: true }) }), item && (_jsx(AppShellDrawer, { drawerOpen: drawerOpen, setDrawerOpen: setDrawerOpen, content: item.drawerView, header: item.drawerHeader || item.name, topOffset: appHeaderEl ? headerHeight :
|
|
146
|
+
return (_jsxs(AppShellDrawerContext.Provider, { value: ctxValue, children: [_jsx(StyledUtils, { children: _jsx(NavigationList, { items: utilItems, collapsed: true }) }), item && (_jsx(AppShellDrawer, { drawerOpen: drawerOpen, setDrawerOpen: setDrawerOpen, content: item.drawerView, header: item.drawerHeader || item.name, topOffset: appHeaderEl ? headerHeight : '0', onDrawerClose: () => {
|
|
147
147
|
setItem(undefined);
|
|
148
148
|
item.onDrawerClose?.();
|
|
149
149
|
}, onDrawerOpen: item.onDrawerOpen }))] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppNavigationPanel.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppNavigationPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useCallback, useMemo, useContext } from 'react';\nimport type { ElementType, MouseEvent } from 'react';\n\nimport Button from '../Button';\nimport Grid from '../Grid';\nimport Icon from '../Icon';\nimport Image from '../Image';\nimport Link from '../Link';\nimport Tooltip from '../Tooltip';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { useI18n, useElement } from '../../hooks';\nimport { isValidElement } from '../../utils';\n\nimport NavigationList from './NavigationList';\nimport AppShellContext, { AppShellDrawerContext } from './AppShellContext';\nimport AppShellDrawer from './Drawer';\nimport { AppShellSearch } from './AppShellSearch';\nimport {\n StyledAppInfo,\n StyledCaseTypes,\n StyledScrollWrap,\n StyledUtils,\n StyledNavCasesList,\n StyledCountIcon,\n StyledUtilIconCount,\n StyledAppShellTooltip,\n StyledUtilsSeparator,\n StyledAIAssistant,\n headerHeight\n} from './AppShell.styles';\nimport type {\n AgentProps,\n AppInfoProps,\n CaseProps,\n CaseTypeProps,\n LinkProps,\n NavListItemProps,\n UtilItemProps,\n UtilsProps\n} from './AppShell.types';\nimport type { AppNavigationPanelProps } from './AppNavigationPanel.types';\n\nexport const CaseTypes = ({\n caseTypes,\n mobileNavBar\n}: {\n caseTypes: CaseTypeProps[];\n mobileNavBar?: boolean;\n}) => {\n const t = useI18n();\n\n const transformedCaseTypes = caseTypes.map(caseType => {\n return {\n ...caseType,\n visual: caseType.icon ? <Icon name={caseType.icon} /> : undefined,\n primary: caseType.name\n };\n });\n\n return useMemo(\n () => (\n <StyledCaseTypes>\n <NavigationList\n items={[\n {\n primary: t('app_shell_create'),\n visual: <Icon name='plus' />,\n items: transformedCaseTypes\n }\n ]}\n mobileNavBar={mobileNavBar}\n />\n </StyledCaseTypes>\n ),\n [caseTypes, mobileNavBar]\n );\n};\n\nexport const Links = (props: { links: LinkProps[]; mobileNavBar?: boolean }) => {\n const { links, mobileNavBar } = props;\n const [transformedLinks, setTransformedLinks] = useState<NavListItemProps[]>([]);\n\n // TODO: Can this be a memo instead of a state and an effect?\n const mergedNavLinks = (items: LinkProps[]): NavListItemProps[] => {\n return items.map((link: LinkProps) => {\n return {\n ...link,\n primary: link.name,\n 'aria-current': link.active ? 'page' : null,\n visual: link.icon ? <Icon name={link.icon} /> : null,\n onClick: link.links ? undefined : link.onClick,\n items: link.links ? mergedNavLinks(link.links) : undefined\n };\n });\n };\n\n useEffect(() => {\n setTransformedLinks(mergedNavLinks(links));\n }, [links]);\n\n if (!links.length) return null;\n\n return (\n <div>\n <NavigationList items={transformedLinks} mobileNavBar={mobileNavBar} />\n </div>\n );\n};\n\nconst AIAssistant = ({ agent }: { agent: AgentProps }) => (\n <StyledAIAssistant>\n <NavigationList\n items={[\n {\n id: agent.id,\n primary: agent.name,\n visual: agent.icon,\n 'aria-current': agent.active ? 'page' : null,\n onClick: agent.onClick\n }\n ]}\n />\n </StyledAIAssistant>\n);\n\nconst Cases = (props: { cases: CaseProps[] }) => {\n const { cases } = props;\n\n const setupCases = (items: CaseProps[]): NavListItemProps[] => {\n return items.map((item: CaseProps) => {\n const {\n id,\n primary,\n secondary,\n collapsedItemInfo,\n visual = <Icon name='case-solid' />,\n active,\n onClick,\n onDismiss,\n ...restProps\n } = item;\n return {\n ...restProps,\n id,\n 'aria-current': active ? 'page' : undefined,\n primary,\n secondary,\n collapsedItemInfo,\n active: !!active,\n onClick,\n onDismiss,\n visual\n };\n });\n };\n\n return (\n <StyledNavCasesList>\n <NavigationList items={setupCases(cases)} />\n </StyledNavCasesList>\n );\n};\n\nexport const Utils = ({ items }: UtilsProps) => {\n const { navOpen, navState, drawerOpen, setDrawerOpen, appHeaderEl } = useContext(AppShellContext);\n const [item, setItem] = useState<UtilItemProps>();\n\n useEffect(() => {\n if (drawerOpen && item) {\n setItem(\n items?.find<UtilItemProps>(\n (utilItem): utilItem is UtilItemProps =>\n !isValidElement(utilItem) && utilItem.name === item.name\n )\n );\n }\n }, [items]);\n\n const transform = useCallback(\n (utilItem: UtilItemProps): NavListItemProps => {\n const uItem = { ...utilItem };\n delete uItem.onDrawerClose;\n delete uItem.onDrawerOpen;\n return {\n onClick: () => {\n if (utilItem.drawerView) {\n setItem(utilItem);\n }\n },\n ...uItem,\n primary: utilItem.name,\n visual: utilItem.count ? (\n <StyledUtilIconCount>\n {utilItem.visual}\n <StyledCountIcon variant='urgent' id={`${utilItem.name}-count`}>\n {utilItem.count}\n </StyledCountIcon>\n </StyledUtilIconCount>\n ) : (\n utilItem.visual\n ),\n collapseItems: !navOpen\n };\n },\n [navOpen]\n );\n\n const utilItems = useMemo(() => {\n return [\n ...(items ?? []).map(uItem => {\n return isValidElement(uItem) ? uItem : transform(uItem);\n })\n ];\n }, [items, transform]);\n\n useEffect(() => {\n if (item) setDrawerOpen(true);\n }, [item]);\n\n useEffect(() => {\n if (navState === 'closed' || navState === 'closing') setDrawerOpen(false);\n }, [navState]);\n\n // setDrawerOpen comes from AppShellContext (raw useState setter — stable reference).\n // setItem is the local useState setter — also stable. Neither needs to be in deps.\n // openDrawer and refreshDrawer have identical bodies: both spread `next` to create\n // a new object reference so useEffect([item]) always fires, even when the same item\n // is re-opened. The semantic distinction is: openDrawer starts a new drawer session\n // (useEffect triggers setDrawerOpen(true)); refreshDrawer replaces an already-open\n // item's content (setDrawerOpen(true) is a no-op when already open).\n const ctxValue = useMemo(\n () => ({\n drawerOpen,\n openItemName: item?.name,\n closeDrawer: () => {\n setDrawerOpen(false);\n },\n openDrawer: (next: UtilItemProps) => {\n setItem({ ...next });\n },\n refreshDrawer: (next: UtilItemProps) => {\n setItem({ ...next });\n }\n }),\n [drawerOpen, item?.name]\n );\n\n return (\n <AppShellDrawerContext.Provider value={ctxValue}>\n <StyledUtils>\n <NavigationList items={utilItems} collapsed />\n </StyledUtils>\n\n {item && (\n <AppShellDrawer\n drawerOpen={drawerOpen}\n setDrawerOpen={setDrawerOpen}\n content={item.drawerView}\n header={item.drawerHeader || item.name}\n topOffset={appHeaderEl ? headerHeight : undefined}\n onDrawerClose={() => {\n setItem(undefined);\n item.onDrawerClose?.();\n }}\n onDrawerOpen={item.onDrawerOpen}\n />\n )}\n </AppShellDrawerContext.Provider>\n );\n};\n\nconst AppInfo = ({ appInfo }: { appInfo: AppInfoProps }) => {\n const [appInfoEl, setAppInfoEl] = useElement<HTMLAnchorElement>();\n const { navState } = useContext(AppShellContext);\n\n const {\n appName,\n portalName,\n href: appInfoHref,\n onClick: appInfoOnClick,\n imageSrc: logoSrc,\n appNameHidden,\n ...appInfoRestProps\n } = appInfo;\n\n let appInfoAs: ElementType = 'div';\n if (appInfoHref) appInfoAs = Link;\n else if (appInfoOnClick) appInfoAs = Button;\n\n return (\n <>\n <StyledAppInfo\n as={Grid}\n forwardedAs={appInfoAs}\n variant='link'\n href={appInfoHref}\n onClick={appInfoOnClick}\n aria-label={`${appName}${portalName ? ` - ${portalName}` : ''}`}\n {...appInfoRestProps}\n container={{\n alignItems: 'center',\n areas: portalName ? '\"logo app\" \"logo portal\"' : '\"logo app\"'\n }}\n ref={setAppInfoEl}\n icon\n >\n <Grid item={{ area: 'logo' }} as={Image} src={logoSrc} alt={appName} />\n <Grid item={{ area: 'app' }} as={appNameHidden ? VisuallyHiddenText : 'span'}>\n {appName}\n </Grid>\n {portalName && (\n <Grid item={{ area: 'portal' }} as='span'>\n {portalName}\n </Grid>\n )}\n </StyledAppInfo>\n {navState === 'closed' && (!appNameHidden || portalName) && (\n <Tooltip\n target={appInfoEl}\n placement='right'\n as={StyledAppShellTooltip}\n showDelay='none'\n hideDelay='none'\n >\n {`${appNameHidden ? '' : appName} ${portalName ?? ''}`.trim()}\n </Tooltip>\n )}\n </>\n );\n};\n\nconst AppNavigationPanel = ({\n appInfo,\n navState,\n searchInput,\n searchLabel,\n onClick,\n caseTypes,\n links,\n cases,\n utils,\n agent\n}: AppNavigationPanelProps) => {\n return (\n <>\n {appInfo && <AppInfo appInfo={appInfo} />}\n {searchInput && (\n <AppShellSearch\n searchLabel={searchLabel}\n collapsed={['closed', 'closing'].includes(navState)}\n searchInput={searchInput}\n />\n )}\n <StyledScrollWrap\n container={{ direction: 'column' }}\n item={{ grow: 1 }}\n tabIndex={-1}\n onClick={(e: MouseEvent<HTMLElement>) => {\n // Ensure that clicks on the container (not on interactive child elements) trigger the onClick handler\n if (e.target === e.currentTarget) onClick?.();\n }}\n >\n {caseTypes && caseTypes.length > 0 && <CaseTypes caseTypes={caseTypes} />}\n {links && <Links links={links} />}\n {cases && <Cases cases={cases} />}\n {['open', 'opening'].includes(navState) && (\n <StyledUtilsSeparator navOpen={['open', 'opening'].includes(navState)} />\n )}\n </StyledScrollWrap>\n {['closed', 'closing'].includes(navState) && <StyledUtilsSeparator />}\n <Utils items={utils} />\n {agent && <AIAssistant agent={agent} />}\n </>\n );\n};\n\nexport default AppNavigationPanel;\n"]}
|
|
1
|
+
{"version":3,"file":"AppNavigationPanel.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppNavigationPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useCallback, useMemo, useContext } from 'react';\nimport type { ElementType, MouseEvent } from 'react';\n\nimport Button from '../Button';\nimport Grid from '../Grid';\nimport Icon from '../Icon';\nimport Image from '../Image';\nimport Link from '../Link';\nimport Tooltip from '../Tooltip';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { useI18n, useElement } from '../../hooks';\nimport { isValidElement } from '../../utils';\n\nimport NavigationList from './NavigationList';\nimport AppShellContext, { AppShellDrawerContext } from './AppShellContext';\nimport AppShellDrawer from './Drawer';\nimport { AppShellSearch } from './AppShellSearch';\nimport {\n StyledAppInfo,\n StyledCaseTypes,\n StyledScrollWrap,\n StyledUtils,\n StyledNavCasesList,\n StyledCountIcon,\n StyledUtilIconCount,\n StyledAppShellTooltip,\n StyledUtilsSeparator,\n StyledAIAssistant,\n headerHeight\n} from './AppShell.styles';\nimport type {\n AgentProps,\n AppInfoProps,\n CaseProps,\n CaseTypeProps,\n LinkProps,\n NavListItemProps,\n UtilItemProps,\n UtilsProps\n} from './AppShell.types';\nimport type { AppNavigationPanelProps } from './AppNavigationPanel.types';\n\nexport const CaseTypes = ({\n caseTypes,\n mobileNavBar\n}: {\n caseTypes: CaseTypeProps[];\n mobileNavBar?: boolean;\n}) => {\n const t = useI18n();\n\n const transformedCaseTypes = caseTypes.map(caseType => {\n return {\n ...caseType,\n visual: caseType.icon ? <Icon name={caseType.icon} /> : undefined,\n primary: caseType.name\n };\n });\n\n return useMemo(\n () => (\n <StyledCaseTypes>\n <NavigationList\n items={[\n {\n primary: t('app_shell_create'),\n visual: <Icon name='plus' />,\n items: transformedCaseTypes\n }\n ]}\n mobileNavBar={mobileNavBar}\n />\n </StyledCaseTypes>\n ),\n [caseTypes, mobileNavBar]\n );\n};\n\nexport const Links = (props: { links: LinkProps[]; mobileNavBar?: boolean }) => {\n const { links, mobileNavBar } = props;\n const [transformedLinks, setTransformedLinks] = useState<NavListItemProps[]>([]);\n\n // TODO: Can this be a memo instead of a state and an effect?\n const mergedNavLinks = (items: LinkProps[]): NavListItemProps[] => {\n return items.map((link: LinkProps) => {\n return {\n ...link,\n primary: link.name,\n 'aria-current': link.active ? 'page' : null,\n visual: link.icon ? <Icon name={link.icon} /> : null,\n onClick: link.links ? undefined : link.onClick,\n items: link.links ? mergedNavLinks(link.links) : undefined\n };\n });\n };\n\n useEffect(() => {\n setTransformedLinks(mergedNavLinks(links));\n }, [links]);\n\n if (!links.length) return null;\n\n return (\n <div>\n <NavigationList items={transformedLinks} mobileNavBar={mobileNavBar} />\n </div>\n );\n};\n\nconst AIAssistant = ({ agent }: { agent: AgentProps }) => (\n <StyledAIAssistant>\n <NavigationList\n items={[\n {\n id: agent.id,\n primary: agent.name,\n visual: agent.icon,\n 'aria-current': agent.active ? 'page' : null,\n onClick: agent.onClick\n }\n ]}\n />\n </StyledAIAssistant>\n);\n\nconst Cases = (props: { cases: CaseProps[] }) => {\n const { cases } = props;\n\n const setupCases = (items: CaseProps[]): NavListItemProps[] => {\n return items.map((item: CaseProps) => {\n const {\n id,\n primary,\n secondary,\n collapsedItemInfo,\n visual = <Icon name='case-solid' />,\n active,\n onClick,\n onDismiss,\n ...restProps\n } = item;\n return {\n ...restProps,\n id,\n 'aria-current': active ? 'page' : undefined,\n primary,\n secondary,\n collapsedItemInfo,\n active: !!active,\n onClick,\n onDismiss,\n visual\n };\n });\n };\n\n return (\n <StyledNavCasesList>\n <NavigationList items={setupCases(cases)} />\n </StyledNavCasesList>\n );\n};\n\nexport const Utils = ({ items }: UtilsProps) => {\n const { navOpen, navState, drawerOpen, setDrawerOpen, appHeaderEl } = useContext(AppShellContext);\n const [item, setItem] = useState<UtilItemProps>();\n\n useEffect(() => {\n if (drawerOpen && item) {\n setItem(\n items?.find<UtilItemProps>(\n (utilItem): utilItem is UtilItemProps =>\n !isValidElement(utilItem) && utilItem.name === item.name\n )\n );\n }\n }, [items]);\n\n const transform = useCallback(\n (utilItem: UtilItemProps): NavListItemProps => {\n const uItem = { ...utilItem };\n delete uItem.onDrawerClose;\n delete uItem.onDrawerOpen;\n return {\n onClick: () => {\n if (utilItem.drawerView) {\n setItem(utilItem);\n }\n },\n ...uItem,\n primary: utilItem.name,\n visual: utilItem.count ? (\n <StyledUtilIconCount>\n {utilItem.visual}\n <StyledCountIcon variant='urgent' id={`${utilItem.name}-count`}>\n {utilItem.count}\n </StyledCountIcon>\n </StyledUtilIconCount>\n ) : (\n utilItem.visual\n ),\n collapseItems: !navOpen\n };\n },\n [navOpen]\n );\n\n const utilItems = useMemo(() => {\n return [\n ...(items ?? []).map(uItem => {\n return isValidElement(uItem) ? uItem : transform(uItem);\n })\n ];\n }, [items, transform]);\n\n useEffect(() => {\n if (item) setDrawerOpen(true);\n }, [item]);\n\n useEffect(() => {\n if (navState === 'closed' || navState === 'closing') setDrawerOpen(false);\n }, [navState]);\n\n // setDrawerOpen comes from AppShellContext (raw useState setter — stable reference).\n // setItem is the local useState setter — also stable. Neither needs to be in deps.\n // openDrawer and refreshDrawer have identical bodies: both spread `next` to create\n // a new object reference so useEffect([item]) always fires, even when the same item\n // is re-opened. The semantic distinction is: openDrawer starts a new drawer session\n // (useEffect triggers setDrawerOpen(true)); refreshDrawer replaces an already-open\n // item's content (setDrawerOpen(true) is a no-op when already open).\n const ctxValue = useMemo(\n () => ({\n drawerOpen,\n openItemName: item?.name,\n closeDrawer: () => {\n setDrawerOpen(false);\n },\n openDrawer: (next: UtilItemProps) => {\n setItem({ ...next });\n },\n refreshDrawer: (next: UtilItemProps) => {\n setItem({ ...next });\n }\n }),\n [drawerOpen, item?.name]\n );\n\n return (\n <AppShellDrawerContext.Provider value={ctxValue}>\n <StyledUtils>\n <NavigationList items={utilItems} collapsed />\n </StyledUtils>\n\n {item && (\n <AppShellDrawer\n drawerOpen={drawerOpen}\n setDrawerOpen={setDrawerOpen}\n content={item.drawerView}\n header={item.drawerHeader || item.name}\n topOffset={appHeaderEl ? headerHeight : '0'}\n onDrawerClose={() => {\n setItem(undefined);\n item.onDrawerClose?.();\n }}\n onDrawerOpen={item.onDrawerOpen}\n />\n )}\n </AppShellDrawerContext.Provider>\n );\n};\n\nconst AppInfo = ({ appInfo }: { appInfo: AppInfoProps }) => {\n const [appInfoEl, setAppInfoEl] = useElement<HTMLAnchorElement>();\n const { navState } = useContext(AppShellContext);\n\n const {\n appName,\n portalName,\n href: appInfoHref,\n onClick: appInfoOnClick,\n imageSrc: logoSrc,\n appNameHidden,\n ...appInfoRestProps\n } = appInfo;\n\n let appInfoAs: ElementType = 'div';\n if (appInfoHref) appInfoAs = Link;\n else if (appInfoOnClick) appInfoAs = Button;\n\n return (\n <>\n <StyledAppInfo\n as={Grid}\n forwardedAs={appInfoAs}\n variant='link'\n href={appInfoHref}\n onClick={appInfoOnClick}\n aria-label={`${appName}${portalName ? ` - ${portalName}` : ''}`}\n {...appInfoRestProps}\n container={{\n alignItems: 'center',\n areas: portalName ? '\"logo app\" \"logo portal\"' : '\"logo app\"'\n }}\n ref={setAppInfoEl}\n icon\n >\n <Grid item={{ area: 'logo' }} as={Image} src={logoSrc} alt={appName} />\n <Grid item={{ area: 'app' }} as={appNameHidden ? VisuallyHiddenText : 'span'}>\n {appName}\n </Grid>\n {portalName && (\n <Grid item={{ area: 'portal' }} as='span'>\n {portalName}\n </Grid>\n )}\n </StyledAppInfo>\n {navState === 'closed' && (!appNameHidden || portalName) && (\n <Tooltip\n target={appInfoEl}\n placement='right'\n as={StyledAppShellTooltip}\n showDelay='none'\n hideDelay='none'\n >\n {`${appNameHidden ? '' : appName} ${portalName ?? ''}`.trim()}\n </Tooltip>\n )}\n </>\n );\n};\n\nconst AppNavigationPanel = ({\n appInfo,\n navState,\n searchInput,\n searchLabel,\n onClick,\n caseTypes,\n links,\n cases,\n utils,\n agent\n}: AppNavigationPanelProps) => {\n return (\n <>\n {appInfo && <AppInfo appInfo={appInfo} />}\n {searchInput && (\n <AppShellSearch\n searchLabel={searchLabel}\n collapsed={['closed', 'closing'].includes(navState)}\n searchInput={searchInput}\n />\n )}\n <StyledScrollWrap\n container={{ direction: 'column' }}\n item={{ grow: 1 }}\n tabIndex={-1}\n onClick={(e: MouseEvent<HTMLElement>) => {\n // Ensure that clicks on the container (not on interactive child elements) trigger the onClick handler\n if (e.target === e.currentTarget) onClick?.();\n }}\n >\n {caseTypes && caseTypes.length > 0 && <CaseTypes caseTypes={caseTypes} />}\n {links && <Links links={links} />}\n {cases && <Cases cases={cases} />}\n {['open', 'opening'].includes(navState) && (\n <StyledUtilsSeparator navOpen={['open', 'opening'].includes(navState)} />\n )}\n </StyledScrollWrap>\n {['closed', 'closing'].includes(navState) && <StyledUtilsSeparator />}\n <Utils items={utils} />\n {agent && <AIAssistant agent={agent} />}\n </>\n );\n};\n\nexport default AppNavigationPanel;\n"]}
|
|
@@ -6,8 +6,7 @@ interface DrawerViewProps {
|
|
|
6
6
|
onDrawerClose?: () => void;
|
|
7
7
|
drawerOpen: boolean;
|
|
8
8
|
setDrawerOpen: (open: boolean) => void;
|
|
9
|
-
|
|
10
|
-
topOffset?: string;
|
|
9
|
+
topOffset: string;
|
|
11
10
|
}
|
|
12
11
|
declare const _default: ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setDrawerOpen, topOffset }: DrawerViewProps) => import("react").ReactPortal | undefined;
|
|
13
12
|
export default _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAiCvC,UAAU,eAAe;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,SAAS,EAAE,MAAM,CAAC;CACnB;yBAEe,wFAQb,eAAe;AARlB,wBAsGE"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useContext, useLayoutEffect, useRef } from 'react';
|
|
3
3
|
import { createPortal } from 'react-dom';
|
|
4
|
-
import BareButton from '../Button/BareButton';
|
|
5
4
|
import Drawer from '../Drawer';
|
|
6
5
|
import Flex from '../Flex';
|
|
7
6
|
import Icon, { registerIcon } from '../Icon';
|
|
8
7
|
import * as arrowLeftIcon from '../Icon/icons/arrow-left.icon';
|
|
9
8
|
import Text from '../Text';
|
|
10
9
|
import { useConfiguration, useConsolidatedRef, useDirection, useElement, useEscape, useFocusTrap, useI18n, useTheme, useUID } from '../../hooks';
|
|
11
|
-
import Configuration from '../Configuration/Configuration';
|
|
12
10
|
import { documentIsAvailable, getActiveElement } from '../../utils';
|
|
13
11
|
import { isSolidColor } from '../../styles';
|
|
12
|
+
import { ThemeOverride } from '../Configuration';
|
|
13
|
+
import Button from '../Button';
|
|
14
14
|
import AppShellContext from './AppShellContext';
|
|
15
|
-
import { StyledDrawerWrapper,
|
|
15
|
+
import { StyledDrawerWrapper, StyledDrawerHeading, StyledDrawerListContainer } from './Drawer.styles';
|
|
16
16
|
import { navContrastColors } from './style-utils';
|
|
17
17
|
registerIcon(arrowLeftIcon);
|
|
18
18
|
export default ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setDrawerOpen, topOffset }) => {
|
|
@@ -46,7 +46,7 @@ export default ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setD
|
|
|
46
46
|
useLayoutEffect(() => {
|
|
47
47
|
returnFocusRef.current = getActiveElement() ?? undefined;
|
|
48
48
|
}, []);
|
|
49
|
-
const drawerContent = (_jsxs(Drawer, { role: 'dialog', "aria-labelledby": headerId, as: StyledDrawerWrapper, position:
|
|
49
|
+
const drawerContent = (_jsxs(Drawer, { role: 'dialog', "aria-labelledby": headerId, as: StyledDrawerWrapper, position: 'fixed', topOffset: topOffset, placement: start, open: drawerOpen, nullWhenClosed: true, onAfterOpen: () => {
|
|
50
50
|
if (backButtonRef.current && !drawerRef.current?.contains(getActiveElement())) {
|
|
51
51
|
focusedImperatively.current = true;
|
|
52
52
|
backButtonRef.current.focus();
|
|
@@ -55,9 +55,9 @@ export default ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setD
|
|
|
55
55
|
}, onAfterClose: () => {
|
|
56
56
|
onDrawerClose?.();
|
|
57
57
|
returnFocusRef.current?.focus();
|
|
58
|
-
}, onOuterClick: () => setDrawerOpen(false), ref: drawerRef, children: [_jsxs(Flex, { as: StyledDrawerHeading, role: 'none', container: { alignItems: 'center' }, children: [_jsx(
|
|
58
|
+
}, onOuterClick: () => setDrawerOpen(false), ref: drawerRef, children: [_jsxs(Flex, { as: StyledDrawerHeading, role: 'none', container: { alignItems: 'center' }, children: [_jsx(Button, { ref: backButtonRef, icon: true, variant: 'simple', onClick: () => setDrawerOpen(false), label: t('close'), "aria-label": t('close_noun', [header]), children: _jsx(Icon, { name: `arrow-${start}` }) }), _jsx(Text, { variant: 'h2', id: headerId, children: header })] }), _jsx(Flex, { as: StyledDrawerListContainer, container: { direction: 'column' }, "aria-labelledby": headerId, children: content })] }));
|
|
59
59
|
// Needs to be portalled to prevent clipping on iOS Safari - see https://bugs.webkit.org/show_bug.cgi?id=160953
|
|
60
60
|
return (portalTarget &&
|
|
61
|
-
createPortal(_jsx(
|
|
61
|
+
createPortal(_jsx(ThemeOverride, { theme: navTheme, children: drawerContent }), portalTarget));
|
|
62
62
|
};
|
|
63
63
|
//# sourceMappingURL=Drawer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAGzC,OAAO,
|
|
1
|
+
{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAGzC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EACL,gBAAgB,EAChB,kBAAkB,EAClB,YAAY,EACZ,UAAU,EACV,SAAS,EACT,YAAY,EACZ,OAAO,EACP,QAAQ,EACR,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,yBAAyB,EAC1B,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAElD,YAAY,CAAC,aAAa,CAAC,CAAC;AAY5B,eAAe,CAAC,EACd,OAAO,EACP,MAAM,EACN,YAAY,EACZ,aAAa,EACb,UAAU,EACV,aAAa,EACb,SAAS,EACO,EAAE,EAAE;IACpB,MAAM,EAAE,YAAY,GAAG,mBAAmB,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAC9F,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,EAAE,mBAAmB,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAC5D,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,EAAE,CAAC;IACjC,MAAM,cAAc,GAAG,MAAM,EAAe,CAAC;IAC7C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,UAAU,EAAkB,CAAC;IAC7D,MAAM,SAAS,GAAG,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAClD,MAAM,aAAa,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACtD,MAAM,QAAQ,GAAG,MAAM,EAAE,CAAC;IAE1B,SAAS,CACP,GAAG,EAAE;QACH,aAAa,CAAC,KAAK,CAAC,CAAC;IACvB,CAAC,EACD,QAAQ,EACR,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,YAAY,CAAC,SAAS,CAAC,CAAC;IAExB,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAE,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IACrE,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC;IAC3D,MAAM,QAAQ,GAAG;QACf,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,oBAAoB,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa;gBACjE,kBAAkB,EAAE,UAAU;gBAC9B,WAAW;gBACX,MAAM;aACP;SACF;KACF,CAAC;IAEF,4FAA4F;IAC5F,eAAe,CAAC,GAAG,EAAE;QACnB,cAAc,CAAC,OAAO,GAAI,gBAAgB,EAAkB,IAAI,SAAS,CAAC;IAC5E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,CACpB,MAAC,MAAM,IACL,IAAI,EAAC,QAAQ,qBACI,QAAQ,EACzB,EAAE,EAAE,mBAAmB,EACvB,QAAQ,EAAC,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,KAAK,EAChB,IAAI,EAAE,UAAU,EAChB,cAAc,QACd,WAAW,EAAE,GAAG,EAAE;YAChB,IAAI,aAAa,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,QAAQ,CAAC,gBAAgB,EAAE,CAAC,EAAE,CAAC;gBAC9E,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC;gBACnC,aAAa,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YAChC,CAAC;YACD,YAAY,EAAE,EAAE,CAAC;QACnB,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;YACjB,aAAa,EAAE,EAAE,CAAC;YAClB,cAAc,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QAClC,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,EACxC,GAAG,EAAE,SAAS,aAEd,MAAC,IAAI,IAAC,EAAE,EAAE,mBAAmB,EAAE,IAAI,EAAC,MAAM,EAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC5E,KAAC,MAAM,IACL,GAAG,EAAE,aAAa,EAClB,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,EACnC,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,gBACL,CAAC,CAAC,YAAY,EAAE,CAAC,MAAM,CAAC,CAAC,YAErC,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,KAAK,EAAE,GAAI,GACzB,EACT,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,EAAC,EAAE,EAAE,QAAQ,YAC5B,MAAM,GACF,IACF,EACP,KAAC,IAAI,IACH,EAAE,EAAE,yBAAyB,EAC7B,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,qBACjB,QAAQ,YAExB,OAAO,GACH,IACA,CACV,CAAC;IAEF,+GAA+G;IAC/G,OAAO,CACL,YAAY;QACZ,YAAY,CAAC,KAAC,aAAa,IAAC,KAAK,EAAE,QAAQ,YAAG,aAAa,GAAiB,EAAE,YAAY,CAAC,CAC5F,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useContext, useLayoutEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport type { ReactNode } from 'react';\n\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as arrowLeftIcon from '../Icon/icons/arrow-left.icon';\nimport Text from '../Text';\nimport {\n useConfiguration,\n useConsolidatedRef,\n useDirection,\n useElement,\n useEscape,\n useFocusTrap,\n useI18n,\n useTheme,\n useUID\n} from '../../hooks';\nimport { documentIsAvailable, getActiveElement } from '../../utils';\nimport { isSolidColor } from '../../styles';\nimport { ThemeOverride } from '../Configuration';\nimport Button from '../Button';\n\nimport AppShellContext from './AppShellContext';\nimport {\n StyledDrawerWrapper,\n StyledDrawerHeading,\n StyledDrawerListContainer\n} from './Drawer.styles';\nimport { navContrastColors } from './style-utils';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n content: ReactNode;\n header: string;\n onDrawerOpen?: () => void;\n onDrawerClose?: () => void;\n drawerOpen: boolean;\n setDrawerOpen: (open: boolean) => void;\n topOffset: string;\n}\n\nexport default ({\n content,\n header,\n onDrawerOpen,\n onDrawerClose,\n drawerOpen,\n setDrawerOpen,\n topOffset\n}: DrawerViewProps) => {\n const { portalTarget = documentIsAvailable ? document.body : undefined } = useConfiguration();\n const t = useI18n();\n const theme = useTheme();\n const { focusedImperatively } = useContext(AppShellContext);\n const { start } = useDirection();\n const returnFocusRef = useRef<HTMLElement>();\n const [drawerEl, setDrawerEl] = useElement<HTMLDivElement>();\n const drawerRef = useConsolidatedRef(setDrawerEl);\n const backButtonRef = useRef<HTMLButtonElement>(null);\n const headerId = useUID();\n\n useEscape(\n () => {\n setDrawerOpen(false);\n },\n drawerEl,\n [drawerEl]\n );\n\n useFocusTrap(drawerRef);\n\n const { foreground, interactive, urgent } = navContrastColors(theme);\n const navBg = theme.components['app-shell'].nav.background;\n const navTheme = {\n base: {\n palette: {\n 'primary-background': isSolidColor(navBg) ? navBg : 'transparent',\n 'foreground-color': foreground,\n interactive,\n urgent\n }\n }\n };\n\n // Using layout effect to capture the focused element prior to drawer elements taking focus.\n useLayoutEffect(() => {\n returnFocusRef.current = (getActiveElement() as HTMLElement) ?? undefined;\n }, []);\n\n const drawerContent = (\n <Drawer\n role='dialog'\n aria-labelledby={headerId}\n as={StyledDrawerWrapper}\n position='fixed'\n topOffset={topOffset}\n placement={start}\n open={drawerOpen}\n nullWhenClosed\n onAfterOpen={() => {\n if (backButtonRef.current && !drawerRef.current?.contains(getActiveElement())) {\n focusedImperatively.current = true;\n backButtonRef.current.focus();\n }\n onDrawerOpen?.();\n }}\n onAfterClose={() => {\n onDrawerClose?.();\n returnFocusRef.current?.focus();\n }}\n onOuterClick={() => setDrawerOpen(false)}\n ref={drawerRef}\n >\n <Flex as={StyledDrawerHeading} role='none' container={{ alignItems: 'center' }}>\n <Button\n ref={backButtonRef}\n icon\n variant='simple'\n onClick={() => setDrawerOpen(false)}\n label={t('close')}\n aria-label={t('close_noun', [header])}\n >\n <Icon name={`arrow-${start}`} />\n </Button>\n <Text variant='h2' id={headerId}>\n {header}\n </Text>\n </Flex>\n <Flex\n as={StyledDrawerListContainer}\n container={{ direction: 'column' }}\n aria-labelledby={headerId}\n >\n {content}\n </Flex>\n </Drawer>\n );\n\n // Needs to be portalled to prevent clipping on iOS Safari - see https://bugs.webkit.org/show_bug.cgi?id=160953\n return (\n portalTarget &&\n createPortal(<ThemeOverride theme={navTheme}>{drawerContent}</ThemeOverride>, portalTarget)\n );\n};\n"]}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import type { DrawerProps } from '../Drawer';
|
|
2
|
-
export declare const StyledDrawerWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DrawerProps
|
|
2
|
+
export declare const StyledDrawerWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DrawerProps & {
|
|
3
|
+
topOffset: string;
|
|
4
|
+
}>> & string;
|
|
3
5
|
/**
|
|
4
6
|
* Fixed-position container that offsets the drawer below the top chrome
|
|
5
7
|
* (AppShell header + top nav bar) so the drawer doesn't overlap the navigation.
|
|
@@ -11,7 +13,6 @@ export declare const StyledTopNavDrawerOffset: import("styled-components/dist/ty
|
|
|
11
13
|
$topOffset: string;
|
|
12
14
|
}>> & string;
|
|
13
15
|
export declare const StyledDrawerHeading: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
|
|
14
|
-
export declare const StyledDrawerBackButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
|
|
15
16
|
export declare const StyledDrawerList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {
|
|
16
17
|
displayPins: boolean;
|
|
17
18
|
}>> & string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAQ7C,eAAO,MAAM,mBAAmB,
|
|
1
|
+
{"version":3,"file":"Drawer.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAQ7C,eAAO,MAAM,mBAAmB;eAAyC,MAAM;YA6B9E,CAAC;AAIF;;;;;;GAMG;AACH,eAAO,MAAM,wBAAwB;gBAA4B,MAAM;YAStE,CAAC;AAIF,eAAO,MAAM,mBAAmB,uNAsB9B,CAAC;AAIH,eAAO,MAAM,gBAAgB;iBAA4B,OAAO;YAE9D,CAAC;AAIH,eAAO,MAAM,oBAAoB,iOAIhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,6NAK5B,CAAC;AAIH,eAAO,MAAM,uBAAuB,qOAWlC,CAAC;AAIH,eAAO,MAAM,mBAAmB,yOAiB9B,CAAC;AAIH,eAAO,MAAM,uBAAuB,6NAOlC,CAAC;AAIH,eAAO,MAAM,yBAAyB,6NAMpC,CAAC"}
|
|
@@ -7,25 +7,26 @@ import { StyledLabel } from '../Label';
|
|
|
7
7
|
import { StyledForm } from '../MultiStepForm/MultiStepForm';
|
|
8
8
|
import { navOpenWidth } from './AppShell.styles';
|
|
9
9
|
import { navContrastColors } from './style-utils';
|
|
10
|
-
export const StyledDrawerWrapper = styled.div(({ theme, open }) => {
|
|
10
|
+
export const StyledDrawerWrapper = styled.div(({ theme, open, topOffset }) => {
|
|
11
11
|
const { components: { 'app-shell': { nav: { background: navBg } } } } = theme;
|
|
12
12
|
const { foreground, border: borderColor } = navContrastColors(theme);
|
|
13
13
|
return css `
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
14
|
+
display: flex;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
background: ${navBg};
|
|
17
|
+
width: calc(${navOpenWidth} + var(--safe-area-inset-inline-start, 0rem));
|
|
18
|
+
height: unset;
|
|
19
|
+
inset-block: ${topOffset} 0;
|
|
20
|
+
color: ${foreground};
|
|
21
|
+
opacity: ${open ? 1 : 0};
|
|
22
|
+
border-inline-end: ${rem(1)} solid ${borderColor};
|
|
22
23
|
|
|
23
|
-
|
|
24
|
-
|
|
24
|
+
${StyledForm},
|
|
25
|
+
${StyledLabel},
|
|
25
26
|
${StyledMetaListItem} {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
27
|
+
color: ${foreground};
|
|
28
|
+
}
|
|
29
|
+
`;
|
|
29
30
|
});
|
|
30
31
|
StyledDrawerWrapper.defaultProps = defaultThemeProp;
|
|
31
32
|
/**
|
|
@@ -67,28 +68,6 @@ export const StyledDrawerHeading = styled.header(({ theme }) => {
|
|
|
67
68
|
`;
|
|
68
69
|
});
|
|
69
70
|
StyledDrawerHeading.defaultProps = defaultThemeProp;
|
|
70
|
-
export const StyledDrawerBackButton = styled.button(({ theme }) => {
|
|
71
|
-
const { hoverBg, foreground } = navContrastColors(theme);
|
|
72
|
-
return css `
|
|
73
|
-
height: ${theme.base['hit-area']['mouse-min']};
|
|
74
|
-
width: ${theme.base['hit-area']['mouse-min']};
|
|
75
|
-
border-radius: calc(
|
|
76
|
-
${`${theme.base['border-radius']} * ${theme.components.button['border-radius']}`}
|
|
77
|
-
);
|
|
78
|
-
|
|
79
|
-
&:hover,
|
|
80
|
-
&:focus {
|
|
81
|
-
color: ${foreground};
|
|
82
|
-
background-color: ${hoverBg};
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
&:focus {
|
|
86
|
-
outline: none;
|
|
87
|
-
box-shadow: ${theme.base.shadow['focus-inset']};
|
|
88
|
-
}
|
|
89
|
-
`;
|
|
90
|
-
});
|
|
91
|
-
StyledDrawerBackButton.defaultProps = defaultThemeProp;
|
|
92
71
|
export const StyledDrawerList = styled.ul(() => {
|
|
93
72
|
return css ``;
|
|
94
73
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAElD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,
|
|
1
|
+
{"version":3,"file":"Drawer.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { rem } from 'polished';\n\nimport { calculateFontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type { DrawerProps } from '../Drawer';\nimport { StyledMetaListItem } from '../MetaList/MetaList';\nimport { StyledLabel } from '../Label';\nimport { StyledForm } from '../MultiStepForm/MultiStepForm';\n\nimport { navOpenWidth } from './AppShell.styles';\nimport { navContrastColors } from './style-utils';\n\nexport const StyledDrawerWrapper = styled.div<DrawerProps & { topOffset: string }>(\n ({ theme, open, topOffset }) => {\n const {\n components: {\n 'app-shell': {\n nav: { background: navBg }\n }\n }\n } = theme;\n const { foreground, border: borderColor } = navContrastColors(theme);\n\n return css`\n display: flex;\n flex-direction: column;\n background: ${navBg};\n width: calc(${navOpenWidth} + var(--safe-area-inset-inline-start, 0rem));\n height: unset;\n inset-block: ${topOffset} 0;\n color: ${foreground};\n opacity: ${open ? 1 : 0};\n border-inline-end: ${rem(1)} solid ${borderColor};\n\n ${StyledForm},\n ${StyledLabel},\n ${StyledMetaListItem} {\n color: ${foreground};\n }\n `;\n }\n);\n\nStyledDrawerWrapper.defaultProps = defaultThemeProp;\n\n/**\n * Fixed-position container that offsets the drawer below the top chrome\n * (AppShell header + top nav bar) so the drawer doesn't overlap the navigation.\n * The inner Drawer uses position='absolute' relative to this container.\n * Uses inset-block-end: 0 to pin to the viewport bottom, avoiding dvh unit\n * rounding issues and ensuring the drawer always fills the available height.\n */\nexport const StyledTopNavDrawerOffset = styled.div<{ $topOffset: string }>(\n ({ $topOffset, theme }) => css`\n position: fixed;\n inset-block-start: ${$topOffset};\n inset-inline-start: 0;\n inset-block-end: 0;\n width: ${navOpenWidth};\n z-index: ${theme.base['z-index'].drawer};\n `\n);\n\nStyledTopNavDrawerOffset.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerHeading = styled.header(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n const { foreground } = navContrastColors(theme);\n\n return css`\n padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n line-height: 1;\n\n h2 {\n font-size: ${fontSize.s};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n margin: 0 auto;\n position: relative;\n left: -0.7rem;\n }\n\n svg {\n font-size: ${fontSize.xxl};\n cursor: pointer;\n color: ${foreground};\n }\n `;\n});\n\nStyledDrawerHeading.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerList = styled.ul<{ displayPins: boolean }>(() => {\n return css``;\n});\n\nStyledDrawerList.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerMetaList = styled.ul`\n li {\n color: inherit;\n }\n`;\n\nexport const EmptyDrawerVisual = styled.div(({ theme }) => {\n return css`\n width: calc(4 * ${theme.base.spacing});\n height: calc(4 * ${theme.base.spacing});\n `;\n});\n\nEmptyDrawerVisual.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListHeading = styled.h3(({ theme }) => {\n const { hoverBg, foreground } = navContrastColors(theme);\n\n return css`\n position: sticky;\n top: 0;\n padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n background-color: ${hoverBg};\n color: ${foreground};\n z-index: 1;\n `;\n});\n\nStyledDrawerListHeading.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerViewAll = styled.a(({ theme }) => {\n const { foreground, nestedListHeader } = navContrastColors(theme);\n\n return css`\n position: sticky;\n bottom: 0;\n padding: ${theme.base.spacing} 0;\n color: ${foreground};\n background: ${nestedListHeader};\n text-align: center;\n margin-top: 0.0625rem;\n\n &:focus {\n outline: none;\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n `;\n});\n\nStyledDrawerViewAll.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListSection = styled.div(({ theme }) => {\n const { border: borderColor } = navContrastColors(theme);\n\n return css`\n border-top: 0.0625rem solid ${borderColor};\n min-height: max(20%, 8rem);\n `;\n});\n\nStyledDrawerListSection.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerListContainer = styled.div(() => {\n return css`\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n `;\n});\n\nStyledDrawerListContainer.defaultProps = defaultThemeProp;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "9.0.0-build.
|
|
3
|
+
"version": "9.0.0-build.29.0",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|