@pega/cosmos-react-core 9.19.0 → 9.20.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/AppShellList.js +1 -1
- package/lib/components/AppShell/AppShellList.js.map +1 -1
- package/lib/components/Icon/Icon.d.ts +5 -0
- package/lib/components/Icon/Icon.d.ts.map +1 -1
- package/lib/components/Icon/Icon.js +33 -4
- package/lib/components/Icon/Icon.js.map +1 -1
- package/lib/components/Icon/icons/search-solid.icon.d.ts +1 -1
- package/lib/components/Icon/icons/search-solid.icon.js +3 -3
- package/lib/components/Icon/icons/search-solid.icon.js.map +1 -1
- package/lib/components/PageTemplates/PageTemplates.js +1 -1
- package/lib/components/PageTemplates/PageTemplates.js.map +1 -1
- package/lib/components/SpeechToTextButton/SpeechToTextButton.js +1 -1
- package/lib/components/SpeechToTextButton/SpeechToTextButton.js.map +1 -1
- package/lib/hooks/useAnimatedText.d.ts.map +1 -1
- package/lib/hooks/useAnimatedText.js +12 -1
- package/lib/hooks/useAnimatedText.js.map +1 -1
- package/lib/hooks/useI18n.d.ts +7 -0
- package/lib/hooks/useI18n.d.ts.map +1 -1
- package/lib/i18n/default.d.ts +7 -0
- package/lib/i18n/default.d.ts.map +1 -1
- package/lib/i18n/default.js +8 -0
- package/lib/i18n/default.js.map +1 -1
- package/lib/i18n/i18n.d.ts +7 -0
- package/lib/i18n/i18n.d.ts.map +1 -1
- package/lib/theme/theme.d.ts +6 -0
- package/lib/theme/theme.d.ts.map +1 -1
- package/lib/theme/themeDefinition.json +4 -0
- package/lib/theme/themeOverrides.schema.json +4 -0
- package/lib/theme/themes/aurigaDarkTheme.json +7 -7
- package/lib/theme/themes/aurigaTheme.json +7 -7
- package/package.json +1 -1
|
@@ -41,7 +41,7 @@ export const Links = (props) => {
|
|
|
41
41
|
...link,
|
|
42
42
|
primary: link.name,
|
|
43
43
|
'aria-current': link.active ? 'page' : null,
|
|
44
|
-
visual: link.icon ? _jsx(Icon, { name: link.icon }) : null,
|
|
44
|
+
visual: link.icon ? _jsx(Icon, { name: link.icon, emphasized: link.active }) : null,
|
|
45
45
|
onClick: link.links ? undefined : link.onClick,
|
|
46
46
|
items: link.links ? mergedNavLinks(link.links) : undefined
|
|
47
47
|
};
|
|
@@ -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} 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 } = 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 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} 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} emphasized={link.active} /> : 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 } = 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 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"]}
|
|
@@ -47,7 +47,7 @@ const List = ({ headingText, emptyText, items, loading = false, displayPins = fa
|
|
|
47
47
|
onPinToggle?.(id);
|
|
48
48
|
onItemPinToggle?.(id);
|
|
49
49
|
}
|
|
50
|
-
}, role: 'button', tabIndex: 0, label: t(pinned ? 'app_shell_unpin' : 'app_shell_pin'), "aria-label": `${t(pinned ? 'app_shell_unpin' : 'app_shell_pin')} - ${primary}`, children: _jsx(Icon, { name: pinned ? 'pin-solid' : 'pin' }) })) : undefined, tabIndex: 0 }) }, id));
|
|
50
|
+
}, role: 'button', tabIndex: 0, label: t(pinned ? 'app_shell_unpin' : 'app_shell_pin'), "aria-label": `${t(pinned ? 'app_shell_unpin' : 'app_shell_pin')} - ${primary}`, children: _jsx(Icon, { name: pinned ? 'pin-solid' : 'pin', emphasized: pinned }) })) : undefined, tabIndex: 0 }) }, id));
|
|
51
51
|
}) })) : (_jsx(Flex, { as: EmptyStateColorContrast, container: { justify: 'center', alignItems: 'center' }, item: { grow: 1 }, children: _jsx(EmptyState, { message: emptyText }) }));
|
|
52
52
|
return (_jsxs(Flex, { as: StyledAppShellListSection, container: { direction: 'column' }, children: [headingText && (_jsx(Text, { variant: 'h3', as: StyledAppShellListHeading, children: headingText })), loading ? (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, item: { grow: 1 }, children: _jsx(Progress, { as: StyledLoading, placement: 'inline' }) })) : (renderContent), (viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (_jsx(StyledDrawerViewAll, { ...viewAllProps, as: viewAllProps.href ? 'a' : 'button', children: t('view_all') }))] }));
|
|
53
53
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShellList.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useRef } from 'react';\nimport type { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';\n\nimport type { BaseProps, ForwardProps } from '../../types';\nimport Alert from '../Badges/Alert';\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as pinIcon from '../Icon/icons/pin.icon';\nimport * as pinSolidIcon from '../Icon/icons/pin-solid.icon';\nimport MetaList from '../MetaList';\nimport EmptyState from '../EmptyState';\nimport Progress from '../Progress';\nimport SummaryItem from '../SummaryItem';\nimport Text from '../Text';\nimport { useI18n } from '../../hooks';\n\nimport { StyledLoading } from './AppShell.styles';\nimport {\n StyledAppShellListWrapper,\n StyledAppShellList,\n StyledAppShellSummaryList,\n StyledAppShellMetaList,\n StyledNotificationPrimary,\n StyledNotificationSecondary,\n StyledAppShellPinButton,\n EmptyStateColorContrast,\n StyledAppShellListSection,\n StyledAppShellListHeading,\n StyledNotificationVisual\n} from './AppShellList.styles';\nimport { StyledDrawerViewAll } from './Drawer.styles';\nimport { AppShellDrawerContext } from './AppShellContext';\n\nregisterIcon(pinIcon, pinSolidIcon);\n\nexport type ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;\nexport interface ListProps {\n /** An id representing the item. */\n id: string;\n ref?: Ref<HTMLDivElement>;\n items: (AppShellListItemProps & ForwardProps)[];\n headingText?: string;\n emptyText: string;\n loading?: boolean;\n viewAll?: {\n onClick?: (e: MouseEvent) => void;\n href?: string;\n } & ForwardProps;\n newNotifications?: number;\n displayPins?: boolean;\n onItemClick?: (id: string, event: ListInteractionEvent) => void;\n onItemPinToggle?: (id: string) => void;\n}\nexport interface AppShellListProps {\n listView: ListProps[];\n}\nexport interface AppShellListItemProps extends BaseProps {\n /** An id representing the item. */\n id: string;\n /** The primary text for the item. */\n primary: string;\n /** Secondary text that will be rendered as a Meta List. */\n secondary?: string[];\n /** A visual associated with the item. */\n visual?: ReactNode;\n /** A flag indicating if the item has been read. */\n unread?: boolean;\n /** Icon for displaying at the end of items */\n pinned?: boolean;\n /** URL or DOM id to navigate to. */\n href?: string;\n /** The onClick handler for the item. */\n onClick?: (id: string, event: ListInteractionEvent) => void;\n /** The handler hat is called when a pin icon is toggled on an item. */\n onPinToggle?: (id: string) => void;\n}\n\nconst List = ({\n headingText,\n emptyText,\n items,\n loading = false,\n displayPins = false,\n onItemClick,\n onItemPinToggle,\n viewAll: viewAllProps\n}: ListProps) => {\n const t = useI18n();\n const { closeDrawer } = useContext(AppShellDrawerContext);\n const pinButtons = useRef<Record<string, HTMLElement>>({});\n\n const renderContent = items.length ? (\n <Flex as={StyledAppShellList} item={{ grow: 1 }}>\n {items.map(\n ({\n id,\n primary,\n secondary,\n visual,\n unread,\n href,\n onClick,\n pinned,\n onPinToggle,\n ...restProps\n }: AppShellListItemProps) => {\n const onSummaryItemClick = (e: ListInteractionEvent) => {\n onClick?.(id, e);\n onItemClick?.(id, e);\n\n if (!pinButtons.current[id]?.contains(e.target as Node)) {\n closeDrawer();\n }\n };\n\n return (\n <StyledAppShellSummaryList key={id}>\n <SummaryItem\n {...restProps}\n as={href ? 'a' : 'button'}\n primary={\n <StyledNotificationPrimary unread={unread}>{primary}</StyledNotificationPrimary>\n }\n secondary={\n secondary?.length ? (\n <StyledNotificationSecondary unread={unread}>\n <MetaList as={StyledAppShellMetaList} items={secondary} />\n </StyledNotificationSecondary>\n ) : undefined\n }\n visual={\n visual || unread ? (\n <StyledNotificationVisual unread={unread} visualIncluded={!!visual}>\n {visual} <Alert variant='urgent' />\n </StyledNotificationVisual>\n ) : undefined\n }\n href={href}\n onClick={onSummaryItemClick}\n onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n onSummaryItemClick(e);\n }\n }}\n actions={\n displayPins ? (\n <Button\n ref={el => {\n if (!el) delete pinButtons.current[id];\n else pinButtons.current[id] = el;\n }}\n icon\n as={StyledAppShellPinButton}\n forwardedAs='div'\n onClick={() => {\n onPinToggle?.(id);\n onItemPinToggle?.(id);\n }}\n onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Enter') {\n onPinToggle?.(id);\n onItemPinToggle?.(id);\n }\n }}\n role='button'\n tabIndex={0}\n label={t(pinned ? 'app_shell_unpin' : 'app_shell_pin')}\n aria-label={`${t(pinned ? 'app_shell_unpin' : 'app_shell_pin')} - ${primary}`}\n >\n <Icon name={pinned ? 'pin-solid' : 'pin'} />\n </Button>\n ) : undefined\n }\n tabIndex={0}\n />\n </StyledAppShellSummaryList>\n );\n }\n )}\n </Flex>\n ) : (\n <Flex\n as={EmptyStateColorContrast}\n container={{ justify: 'center', alignItems: 'center' }}\n item={{ grow: 1 }}\n >\n <EmptyState message={emptyText} />\n </Flex>\n );\n\n return (\n <Flex as={StyledAppShellListSection} container={{ direction: 'column' }}>\n {headingText && (\n <Text variant='h3' as={StyledAppShellListHeading}>\n {headingText}\n </Text>\n )}\n {loading ? (\n <Flex container={{ justify: 'center', alignItems: 'center' }} item={{ grow: 1 }}>\n <Progress as={StyledLoading} placement='inline' />\n </Flex>\n ) : (\n renderContent\n )}\n {(viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (\n <StyledDrawerViewAll {...viewAllProps} as={viewAllProps.href ? 'a' : 'button'}>\n {t('view_all')}\n </StyledDrawerViewAll>\n )}\n </Flex>\n );\n};\nconst AppShellList: FunctionComponent<AppShellListProps> = ({ listView }) => {\n return (\n <Flex as={StyledAppShellListWrapper} container={{ direction: 'column' }}>\n {listView.map(listItem => (\n <List {...listItem} key={listItem.id} />\n ))}\n </Flex>\n );\n};\n\nexport default AppShellList;\n"]}
|
|
1
|
+
{"version":3,"file":"AppShellList.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShellList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useRef } from 'react';\nimport type { FunctionComponent, Ref, MouseEvent, ReactNode, KeyboardEvent } from 'react';\n\nimport type { BaseProps, ForwardProps } from '../../types';\nimport Alert from '../Badges/Alert';\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as pinIcon from '../Icon/icons/pin.icon';\nimport * as pinSolidIcon from '../Icon/icons/pin-solid.icon';\nimport MetaList from '../MetaList';\nimport EmptyState from '../EmptyState';\nimport Progress from '../Progress';\nimport SummaryItem from '../SummaryItem';\nimport Text from '../Text';\nimport { useI18n } from '../../hooks';\n\nimport { StyledLoading } from './AppShell.styles';\nimport {\n StyledAppShellListWrapper,\n StyledAppShellList,\n StyledAppShellSummaryList,\n StyledAppShellMetaList,\n StyledNotificationPrimary,\n StyledNotificationSecondary,\n StyledAppShellPinButton,\n EmptyStateColorContrast,\n StyledAppShellListSection,\n StyledAppShellListHeading,\n StyledNotificationVisual\n} from './AppShellList.styles';\nimport { StyledDrawerViewAll } from './Drawer.styles';\nimport { AppShellDrawerContext } from './AppShellContext';\n\nregisterIcon(pinIcon, pinSolidIcon);\n\nexport type ListInteractionEvent = MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;\nexport interface ListProps {\n /** An id representing the item. */\n id: string;\n ref?: Ref<HTMLDivElement>;\n items: (AppShellListItemProps & ForwardProps)[];\n headingText?: string;\n emptyText: string;\n loading?: boolean;\n viewAll?: {\n onClick?: (e: MouseEvent) => void;\n href?: string;\n } & ForwardProps;\n newNotifications?: number;\n displayPins?: boolean;\n onItemClick?: (id: string, event: ListInteractionEvent) => void;\n onItemPinToggle?: (id: string) => void;\n}\nexport interface AppShellListProps {\n listView: ListProps[];\n}\nexport interface AppShellListItemProps extends BaseProps {\n /** An id representing the item. */\n id: string;\n /** The primary text for the item. */\n primary: string;\n /** Secondary text that will be rendered as a Meta List. */\n secondary?: string[];\n /** A visual associated with the item. */\n visual?: ReactNode;\n /** A flag indicating if the item has been read. */\n unread?: boolean;\n /** Icon for displaying at the end of items */\n pinned?: boolean;\n /** URL or DOM id to navigate to. */\n href?: string;\n /** The onClick handler for the item. */\n onClick?: (id: string, event: ListInteractionEvent) => void;\n /** The handler hat is called when a pin icon is toggled on an item. */\n onPinToggle?: (id: string) => void;\n}\n\nconst List = ({\n headingText,\n emptyText,\n items,\n loading = false,\n displayPins = false,\n onItemClick,\n onItemPinToggle,\n viewAll: viewAllProps\n}: ListProps) => {\n const t = useI18n();\n const { closeDrawer } = useContext(AppShellDrawerContext);\n const pinButtons = useRef<Record<string, HTMLElement>>({});\n\n const renderContent = items.length ? (\n <Flex as={StyledAppShellList} item={{ grow: 1 }}>\n {items.map(\n ({\n id,\n primary,\n secondary,\n visual,\n unread,\n href,\n onClick,\n pinned,\n onPinToggle,\n ...restProps\n }: AppShellListItemProps) => {\n const onSummaryItemClick = (e: ListInteractionEvent) => {\n onClick?.(id, e);\n onItemClick?.(id, e);\n\n if (!pinButtons.current[id]?.contains(e.target as Node)) {\n closeDrawer();\n }\n };\n\n return (\n <StyledAppShellSummaryList key={id}>\n <SummaryItem\n {...restProps}\n as={href ? 'a' : 'button'}\n primary={\n <StyledNotificationPrimary unread={unread}>{primary}</StyledNotificationPrimary>\n }\n secondary={\n secondary?.length ? (\n <StyledNotificationSecondary unread={unread}>\n <MetaList as={StyledAppShellMetaList} items={secondary} />\n </StyledNotificationSecondary>\n ) : undefined\n }\n visual={\n visual || unread ? (\n <StyledNotificationVisual unread={unread} visualIncluded={!!visual}>\n {visual} <Alert variant='urgent' />\n </StyledNotificationVisual>\n ) : undefined\n }\n href={href}\n onClick={onSummaryItemClick}\n onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Enter' || e.key === ' ') {\n onSummaryItemClick(e);\n }\n }}\n actions={\n displayPins ? (\n <Button\n ref={el => {\n if (!el) delete pinButtons.current[id];\n else pinButtons.current[id] = el;\n }}\n icon\n as={StyledAppShellPinButton}\n forwardedAs='div'\n onClick={() => {\n onPinToggle?.(id);\n onItemPinToggle?.(id);\n }}\n onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Enter') {\n onPinToggle?.(id);\n onItemPinToggle?.(id);\n }\n }}\n role='button'\n tabIndex={0}\n label={t(pinned ? 'app_shell_unpin' : 'app_shell_pin')}\n aria-label={`${t(pinned ? 'app_shell_unpin' : 'app_shell_pin')} - ${primary}`}\n >\n <Icon name={pinned ? 'pin-solid' : 'pin'} emphasized={pinned} />\n </Button>\n ) : undefined\n }\n tabIndex={0}\n />\n </StyledAppShellSummaryList>\n );\n }\n )}\n </Flex>\n ) : (\n <Flex\n as={EmptyStateColorContrast}\n container={{ justify: 'center', alignItems: 'center' }}\n item={{ grow: 1 }}\n >\n <EmptyState message={emptyText} />\n </Flex>\n );\n\n return (\n <Flex as={StyledAppShellListSection} container={{ direction: 'column' }}>\n {headingText && (\n <Text variant='h3' as={StyledAppShellListHeading}>\n {headingText}\n </Text>\n )}\n {loading ? (\n <Flex container={{ justify: 'center', alignItems: 'center' }} item={{ grow: 1 }}>\n <Progress as={StyledLoading} placement='inline' />\n </Flex>\n ) : (\n renderContent\n )}\n {(viewAllProps?.href || viewAllProps?.onClick) && !!items.length && !loading && (\n <StyledDrawerViewAll {...viewAllProps} as={viewAllProps.href ? 'a' : 'button'}>\n {t('view_all')}\n </StyledDrawerViewAll>\n )}\n </Flex>\n );\n};\nconst AppShellList: FunctionComponent<AppShellListProps> = ({ listView }) => {\n return (\n <Flex as={StyledAppShellListWrapper} container={{ direction: 'column' }}>\n {listView.map(listItem => (\n <List {...listItem} key={listItem.id} />\n ))}\n </Flex>\n );\n};\n\nexport default AppShellList;\n"]}
|
|
@@ -8,6 +8,11 @@ type BaseIconProps = NoChildrenProp & {
|
|
|
8
8
|
set?: string;
|
|
9
9
|
/** The name indicating the Cosmos Icon. Reference the catalog above for the available names. */
|
|
10
10
|
name: string;
|
|
11
|
+
/**
|
|
12
|
+
* Sets fill style to inverse of theme.base['icon-fill'] if set, has no effect if theme setting is null.
|
|
13
|
+
* @default false
|
|
14
|
+
*/
|
|
15
|
+
emphasized?: boolean;
|
|
11
16
|
/**
|
|
12
17
|
* Background & svg size.
|
|
13
18
|
* @default "s" without background, "m" with background.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAwB,aAAa,EAAE,yBAAyB,EAAE,MAAM,OAAO,CAAC;AAI5F,OAAO,KAAK,EAAE,cAAc,EAAc,cAAc,EAAE,MAAM,aAAa,CAAC;AAO9E,KAAK,aAAa,GAAG,cAAc,GAAG;IACpC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,gGAAgG;IAChG,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,WAAW,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,SAAS,GACjB,cAAc,CACZ,KAAK,EACL,aAAa,GAAG;IACd,wBAAwB;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CAC7B,CACF,GACD,cAAc,CACZ,KAAK,EACL,aAAa,GAAG;IACd,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CACF,CAAC;AAEN,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,aAAa,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,GAAG,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC;IACvB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;CACzB;AAID,eAAO,MAAM,YAAY,GAAI,GAAG,OAAO,UAAU,EAAE,SAUlD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,GAAG,OAAO,UAAU,EAAE,SAUvD,CAAC;AAEF,eAAO,MAAM,UAAU;WAAuB,SAAS,CAAC,MAAM,CAAC;YA8C7D,CAAC;AAIH,eAAO,MAAM,eAAe;gBACd,WAAW,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;iBACnC,SAAS,CAAC,YAAY,CAAC;WAC7B,SAAS,CAAC,MAAM,CAAC;YAChB,SAAS,CAAC,OAAO,CAAC;YAiE1B,CAAC;AAMH,QAAA,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAwB,aAAa,EAAE,yBAAyB,EAAE,MAAM,OAAO,CAAC;AAI5F,OAAO,KAAK,EAAE,cAAc,EAAc,cAAc,EAAE,MAAM,aAAa,CAAC;AAO9E,KAAK,aAAa,GAAG,cAAc,GAAG;IACpC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,gGAAgG;IAChG,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,WAAW,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,SAAS,GACjB,cAAc,CACZ,KAAK,EACL,aAAa,GAAG;IACd,wBAAwB;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CAC7B,CACF,GACD,cAAc,CACZ,KAAK,EACL,aAAa,GAAG;IACd,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CACF,CAAC;AAEN,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,aAAa,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,GAAG,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC;IACvB,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;CACzB;AAID,eAAO,MAAM,YAAY,GAAI,GAAG,OAAO,UAAU,EAAE,SAUlD,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,GAAG,OAAO,UAAU,EAAE,SAUvD,CAAC;AAEF,eAAO,MAAM,UAAU;WAAuB,SAAS,CAAC,MAAM,CAAC;YA8C7D,CAAC;AAIH,eAAO,MAAM,eAAe;gBACd,WAAW,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;iBACnC,SAAS,CAAC,YAAY,CAAC;WAC7B,SAAS,CAAC,MAAM,CAAC;YAChB,SAAS,CAAC,OAAO,CAAC;YAiE1B,CAAC;AAMH,QAAA,MAAM,IAAI,EA0JJ,yBAAyB,CAAC,SAAS,CAAC,CAAC;AAE3C,eAAe,IAAI,CAAC"}
|
|
@@ -128,18 +128,47 @@ export const StyledIconShape = styled.div(({ theme, background, foreground, size
|
|
|
128
128
|
});
|
|
129
129
|
StyledIconShape.defaultProps = defaultThemeProp;
|
|
130
130
|
const emptyIconDefinition = Object.freeze({ Component: () => null });
|
|
131
|
-
const Icon = forwardRef(function Icon({ set: setProp, name, size, 'aria-label': ariaLabel, role, ...restProps }, ref) {
|
|
132
|
-
const { base: { 'icon-set': setTheme } } = useTheme();
|
|
131
|
+
const Icon = forwardRef(function Icon({ set: setProp, name: nameProp, emphasized = false, size, 'aria-label': ariaLabel, role, ...restProps }, ref) {
|
|
132
|
+
const { base: { 'icon-set': setTheme, 'icon-fill': fillTheme } } = useTheme();
|
|
133
133
|
const set = (() => {
|
|
134
134
|
const preferredSet = setProp ?? setTheme ?? 'budicon';
|
|
135
|
-
if (preferredSet === 'budicon' && !budiconSet.has(
|
|
135
|
+
if (preferredSet === 'budicon' && !budiconSet.has(nameProp) && streamlineSet.has(nameProp)) {
|
|
136
136
|
return 'streamline';
|
|
137
137
|
}
|
|
138
|
-
if (preferredSet === 'streamline' && !streamlineSet.has(
|
|
138
|
+
if (preferredSet === 'streamline' && !streamlineSet.has(nameProp) && budiconSet.has(nameProp)) {
|
|
139
139
|
return 'budicon';
|
|
140
140
|
}
|
|
141
141
|
return preferredSet;
|
|
142
142
|
})();
|
|
143
|
+
const fill = (() => {
|
|
144
|
+
if (!fillTheme || (fillTheme !== 'solid' && fillTheme !== 'hollow')) {
|
|
145
|
+
return null;
|
|
146
|
+
}
|
|
147
|
+
if (emphasized) {
|
|
148
|
+
return fillTheme === 'solid' ? 'hollow' : 'solid';
|
|
149
|
+
}
|
|
150
|
+
return fillTheme;
|
|
151
|
+
})();
|
|
152
|
+
const name = (() => {
|
|
153
|
+
if (!fill || (set !== 'budicon' && set !== 'streamline')) {
|
|
154
|
+
return nameProp;
|
|
155
|
+
}
|
|
156
|
+
const knownNames = set === 'budicon' ? budiconSet : streamlineSet;
|
|
157
|
+
const nameIsSolid = nameProp.endsWith('-solid');
|
|
158
|
+
if (nameIsSolid && fill === 'hollow') {
|
|
159
|
+
const hollowName = nameProp.replace(/-solid$/, '');
|
|
160
|
+
if (knownNames.has(hollowName)) {
|
|
161
|
+
return hollowName;
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
else if (!nameIsSolid && fill === 'solid') {
|
|
165
|
+
const solidName = `${nameProp}-solid`;
|
|
166
|
+
if (knownNames.has(solidName)) {
|
|
167
|
+
return solidName;
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
return nameProp;
|
|
171
|
+
})();
|
|
143
172
|
const [iconDef, setIconDef] = useState(iconRegistry.get(set)?.get(name) ?? emptyIconDefinition);
|
|
144
173
|
useEffect(() => {
|
|
145
174
|
if (iconRegistry.get(set)?.has(name)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { Ref, PropsWithoutRef, ComponentType, ForwardRefExoticComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useTheme } from '../../hooks';\nimport type { NoChildrenProp, RefElement, WithAttributes } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { readableColor } from '../../styles';\n\nimport { set as budiconSet } from './iconNames';\nimport { set as streamlineSet } from './streamlineIconNames';\n\ntype BaseIconProps = NoChildrenProp & {\n /**\n * The name of the icon set.\n * @default theme.base['icon-set']\n */\n set?: string;\n /** The name indicating the Cosmos Icon. Reference the catalog above for the available names. */\n name: string;\n /**\n * Background & svg size.\n * @default \"s\" without background, \"m\" with background.\n */\n size?: 's' | 'm' | 'l' | 'font-size';\n};\n\nexport type IconProps =\n | WithAttributes<\n 'div',\n BaseIconProps & {\n /** Background color. */\n background: string;\n /**\n * Foreground color (svg fill).\n * Applies readable color off background if undefined.\n */\n foreground?: string;\n /**\n * Shape of the background.\n * @default 'square'\n */\n shape?: 'square' | 'circle';\n }\n >\n | WithAttributes<\n 'svg',\n BaseIconProps & {\n background?: never;\n foreground?: never;\n shape?: never;\n }\n >;\n\nexport interface IconDefinition {\n Component: ComponentType;\n viewBox?: string;\n}\n\nexport interface IconModule extends IconDefinition {\n set?: IconProps['set'];\n name: IconProps['name'];\n}\n\nconst iconRegistry = new Map<string, Map<string, IconDefinition>>([]);\n\nexport const registerIcon = (...icons: IconModule[]) => {\n icons.forEach(({ set: modSet, name, ...iconDef }) => {\n const set = modSet ?? 'budicon';\n\n if (!iconRegistry.has(set)) {\n iconRegistry.set(set, new Map([[name, iconDef]]));\n } else if (!iconRegistry.get(set)!.has(name)) {\n iconRegistry.get(set)!.set(name, iconDef);\n }\n });\n};\n\nexport const forceRegisterIcon = (...icons: IconModule[]) => {\n icons.forEach(({ set: modSet, name, ...iconDef }) => {\n const set = modSet ?? 'budicon';\n\n if (!iconRegistry.has(set)) {\n iconRegistry.set(set, new Map([[name, iconDef]]));\n } else {\n iconRegistry.get(set)!.set(name, iconDef);\n }\n });\n};\n\nexport const StyledIcon = styled.svg<{ size?: IconProps['size'] }>(({ theme, size = 's' }) => {\n const {\n components: {\n icon: {\n size: { s, m, l }\n }\n }\n } = theme;\n return css`\n display: inline-block;\n fill: currentColor;\n vertical-align: middle;\n flex-shrink: 0;\n /* stylelint-disable unit-allowed-list */\n min-width: 14px;\n min-height: 14px;\n /* stylelint-enable unit-allowed-list */\n\n @media (forced-colors: active) {\n fill: CanvasText;\n }\n\n ${size === 's' &&\n css`\n width: ${s};\n height: ${s};\n `}\n\n ${size === 'm' &&\n css`\n width: ${m};\n height: ${m};\n `}\n\n ${size === 'l' &&\n css`\n width: ${l};\n height: ${l};\n `}\n\n ${size === 'font-size' &&\n css`\n width: 1em;\n height: 1em;\n `}\n `;\n});\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nexport const StyledIconShape = styled.div<{\n background: NonNullable<IconProps['background']>;\n foreground?: IconProps['foreground'];\n size?: IconProps['size'];\n shape?: IconProps['shape'];\n}>(({ theme, background, foreground, size = 'm', shape = 'square' }) => {\n const readableFg = readableColor(background, { level: 'AANonText' });\n\n const {\n base: { 'border-radius': baseRadius },\n components: {\n icon: {\n size: { s, m, l },\n 'border-radius-multiplier': borderRadiusMultiplier\n }\n }\n } = theme;\n\n return css`\n color: ${foreground ?? readableFg};\n background-color: ${background};\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: clip;\n\n ${size === 's' &&\n css`\n width: ${s};\n height: ${s};\n `}\n\n ${size === 'm' &&\n css`\n width: ${m};\n height: ${m};\n `}\n\n ${size === 'l' &&\n css`\n width: ${l};\n height: ${l};\n `}\n\n ${size === 'font-size' &&\n css`\n width: 1em;\n height: 1em;\n `}\n\n ${shape === 'square' &&\n css`\n border-radius: calc(${borderRadiusMultiplier} * ${baseRadius});\n `}\n\n ${shape === 'circle' &&\n css`\n border-radius: 50%;\n `}\n\n ${StyledIcon} {\n width: 50%;\n height: 50%;\n /* stylelint-disable unit-allowed-list */\n min-width: min(14px, 90%);\n min-height: min(14px, 90%);\n /* stylelint-enable unit-allowed-list */\n }\n `;\n});\n\nStyledIconShape.defaultProps = defaultThemeProp;\n\nconst emptyIconDefinition: Readonly<IconDefinition> = Object.freeze({ Component: () => null });\n\nconst Icon = forwardRef<RefElement<IconProps>, PropsWithoutRef<IconProps>>(function Icon(\n {\n set: setProp,\n name,\n size,\n 'aria-label': ariaLabel,\n role,\n ...restProps\n }: PropsWithoutRef<IconProps>,\n ref\n) {\n const {\n base: { 'icon-set': setTheme }\n } = useTheme();\n\n const set = (() => {\n const preferredSet = setProp ?? setTheme ?? 'budicon';\n\n if (preferredSet === 'budicon' && !budiconSet.has(name) && streamlineSet.has(name)) {\n return 'streamline';\n }\n\n if (preferredSet === 'streamline' && !streamlineSet.has(name) && budiconSet.has(name)) {\n return 'budicon';\n }\n\n return preferredSet;\n })();\n\n const [iconDef, setIconDef] = useState(iconRegistry.get(set)?.get(name) ?? emptyIconDefinition);\n\n useEffect(() => {\n if (iconRegistry.get(set)?.has(name)) {\n setIconDef(iconRegistry.get(set)!.get(name)!);\n return;\n }\n\n const controller = new AbortController();\n\n (async () => {\n try {\n const encodedName = encodeURIComponent(name);\n let iconSet: string;\n let module: IconModule;\n\n switch (set) {\n case 'streamline':\n iconSet = 'streamline-icons';\n break;\n case 'budicon':\n iconSet = 'icons';\n break;\n default:\n throw new Error('Unknown icon');\n }\n\n // Different extensions are required for different build setups.\n try {\n module = await import(`./${iconSet}/${encodedName}.icon`);\n } catch {\n try {\n module = await import(`./${iconSet}/${encodedName}.icon.tsx`);\n } catch {\n module = await import(`./${iconSet}/${encodedName}.icon.js`);\n }\n }\n\n if (module.name !== name || !module.Component) throw new Error('Malformed icon definition');\n\n registerIcon(module);\n } catch {\n registerIcon({ set, name, ...emptyIconDefinition });\n }\n\n if (!controller.signal.aborted) {\n setIconDef(iconRegistry.get(set)!.get(name) ?? emptyIconDefinition);\n }\n })();\n\n return () => controller.abort();\n }, [name, set]);\n\n return typeof restProps.background === 'string' ? (\n <StyledIconShape\n {...restProps}\n background={restProps.background}\n foreground={restProps.foreground}\n shape={restProps.shape}\n size={size}\n ref={ref as Ref<HTMLDivElement>}\n >\n <StyledIcon\n role={role ?? (ariaLabel === undefined ? 'presentation' : 'img')}\n aria-label={ariaLabel}\n viewBox={iconDef.viewBox}\n data-icon-set={set}\n data-icon-name={name}\n >\n <iconDef.Component />\n </StyledIcon>\n </StyledIconShape>\n ) : (\n <StyledIcon\n {...restProps}\n role={role ?? (ariaLabel === undefined ? 'presentation' : 'img')}\n aria-label={ariaLabel}\n viewBox={iconDef.viewBox}\n size={size}\n data-icon-set={set}\n data-icon-name={name}\n ref={ref as Ref<SVGSVGElement>}\n >\n <iconDef.Component />\n </StyledIcon>\n );\n}) as ForwardRefExoticComponent<IconProps>;\n\nexport default Icon;\n"]}
|
|
1
|
+
{"version":3,"file":"Icon.js","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAExD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7C,OAAO,EAAE,GAAG,IAAI,UAAU,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,GAAG,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AA2D7D,MAAM,YAAY,GAAG,IAAI,GAAG,CAAsC,EAAE,CAAC,CAAC;AAEtE,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,GAAG,KAAmB,EAAE,EAAE;IACrD,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,OAAO,EAAE,EAAE,EAAE;QAClD,MAAM,GAAG,GAAG,MAAM,IAAI,SAAS,CAAC;QAEhC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YAC3B,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;QACpD,CAAC;aAAM,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YAC7C,YAAY,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAC5C,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,GAAG,KAAmB,EAAE,EAAE;IAC1D,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,OAAO,EAAE,EAAE,EAAE;QAClD,MAAM,GAAG,GAAG,MAAM,IAAI,SAAS,CAAC;QAEhC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YAC3B,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;QACpD,CAAC;aAAM,CAAC;YACN,YAAY,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC,GAAG,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAC5C,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAA+B,CAAC,EAAE,KAAK,EAAE,IAAI,GAAG,GAAG,EAAE,EAAE,EAAE;IAC3F,MAAM,EACJ,UAAU,EAAE,EACV,IAAI,EAAE,EACJ,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAClB,EACF,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;;;;;;;;;;;;;MAcN,IAAI,KAAK,GAAG;QACd,GAAG,CAAA;eACQ,CAAC;gBACA,CAAC;KACZ;;MAEC,IAAI,KAAK,GAAG;QACd,GAAG,CAAA;eACQ,CAAC;gBACA,CAAC;KACZ;;MAEC,IAAI,KAAK,GAAG;QACd,GAAG,CAAA;eACQ,CAAC;gBACA,CAAC;KACZ;;MAEC,IAAI,KAAK,WAAW;QACtB,GAAG,CAAA;;;KAGF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAKtC,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,IAAI,GAAG,GAAG,EAAE,KAAK,GAAG,QAAQ,EAAE,EAAE,EAAE;IACrE,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;IAErE,MAAM,EACJ,IAAI,EAAE,EAAE,eAAe,EAAE,UAAU,EAAE,EACrC,UAAU,EAAE,EACV,IAAI,EAAE,EACJ,IAAI,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EACjB,0BAA0B,EAAE,sBAAsB,EACnD,EACF,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;aACC,UAAU,IAAI,UAAU;wBACb,UAAU;;;;;;MAM5B,IAAI,KAAK,GAAG;QACd,GAAG,CAAA;eACQ,CAAC;gBACA,CAAC;KACZ;;MAEC,IAAI,KAAK,GAAG;QACd,GAAG,CAAA;eACQ,CAAC;gBACA,CAAC;KACZ;;MAEC,IAAI,KAAK,GAAG;QACd,GAAG,CAAA;eACQ,CAAC;gBACA,CAAC;KACZ;;MAEC,IAAI,KAAK,WAAW;QACtB,GAAG,CAAA;;;KAGF;;MAEC,KAAK,KAAK,QAAQ;QACpB,GAAG,CAAA;4BACqB,sBAAsB,MAAM,UAAU;KAC7D;;MAEC,KAAK,KAAK,QAAQ;QACpB,GAAG,CAAA;;KAEF;;MAEC,UAAU;;;;;;;;GAQb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,mBAAmB,GAA6B,MAAM,CAAC,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,IAAI,EAAE,CAAC,CAAC;AAE/F,MAAM,IAAI,GAAG,UAAU,CAAoD,SAAS,IAAI,CACtF,EACE,GAAG,EAAE,OAAO,EACZ,IAAI,EAAE,QAAQ,EACd,UAAU,GAAG,KAAK,EAClB,IAAI,EACJ,YAAY,EAAE,SAAS,EACvB,IAAI,EACJ,GAAG,SAAS,EACe,EAC7B,GAAG;IAEH,MAAM,EACJ,IAAI,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,EACvD,GAAG,QAAQ,EAAE,CAAC;IAEf,MAAM,GAAG,GAAG,CAAC,GAAG,EAAE;QAChB,MAAM,YAAY,GAAG,OAAO,IAAI,QAAQ,IAAI,SAAS,CAAC;QAEtD,IAAI,YAAY,KAAK,SAAS,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC3F,OAAO,YAAY,CAAC;QACtB,CAAC;QAED,IAAI,YAAY,KAAK,YAAY,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,UAAU,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;YAC9F,OAAO,SAAS,CAAC;QACnB,CAAC;QAED,OAAO,YAAY,CAAC;IACtB,CAAC,CAAC,EAAE,CAAC;IAEL,MAAM,IAAI,GAAG,CAAC,GAAG,EAAE;QACjB,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS,KAAK,OAAO,IAAI,SAAS,KAAK,QAAQ,CAAC,EAAE,CAAC;YACpE,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAI,UAAU,EAAE,CAAC;YACf,OAAO,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;QACpD,CAAC;QAED,OAAO,SAAS,CAAC;IACnB,CAAC,CAAC,EAAE,CAAC;IAEL,MAAM,IAAI,GAAG,CAAC,GAAG,EAAE;QACjB,IAAI,CAAC,IAAI,IAAI,CAAC,GAAG,KAAK,SAAS,IAAI,GAAG,KAAK,YAAY,CAAC,EAAE,CAAC;YACzD,OAAO,QAAQ,CAAC;QAClB,CAAC;QAED,MAAM,UAAU,GAAG,GAAG,KAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC;QAElE,MAAM,WAAW,GAAG,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;QAEhD,IAAI,WAAW,IAAI,IAAI,KAAK,QAAQ,EAAE,CAAC;YACrC,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;YAEnD,IAAI,UAAU,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;gBAC/B,OAAO,UAAU,CAAC;YACpB,CAAC;QACH,CAAC;aAAM,IAAI,CAAC,WAAW,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;YAC5C,MAAM,SAAS,GAAG,GAAG,QAAQ,QAAQ,CAAC;YAEtC,IAAI,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;gBAC9B,OAAO,SAAS,CAAC;YACnB,CAAC;QACH,CAAC;QAED,OAAO,QAAQ,CAAC;IAClB,CAAC,CAAC,EAAE,CAAC;IAEL,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,IAAI,CAAC,IAAI,mBAAmB,CAAC,CAAC;IAEhG,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YACrC,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC,GAAG,CAAC,IAAI,CAAE,CAAC,CAAC;YAC9C,OAAO;QACT,CAAC;QAED,MAAM,UAAU,GAAG,IAAI,eAAe,EAAE,CAAC;QAEzC,CAAC,KAAK,IAAI,EAAE;YACV,IAAI,CAAC;gBACH,MAAM,WAAW,GAAG,kBAAkB,CAAC,IAAI,CAAC,CAAC;gBAC7C,IAAI,OAAe,CAAC;gBACpB,IAAI,MAAkB,CAAC;gBAEvB,QAAQ,GAAG,EAAE,CAAC;oBACZ,KAAK,YAAY;wBACf,OAAO,GAAG,kBAAkB,CAAC;wBAC7B,MAAM;oBACR,KAAK,SAAS;wBACZ,OAAO,GAAG,OAAO,CAAC;wBAClB,MAAM;oBACR;wBACE,MAAM,IAAI,KAAK,CAAC,cAAc,CAAC,CAAC;gBACpC,CAAC;gBAED,gEAAgE;gBAChE,IAAI,CAAC;oBACH,MAAM,GAAG,MAAM,MAAM,CAAC,KAAK,OAAO,IAAI,WAAW,OAAO,CAAC,CAAC;gBAC5D,CAAC;gBAAC,MAAM,CAAC;oBACP,IAAI,CAAC;wBACH,MAAM,GAAG,MAAM,MAAM,CAAC,KAAK,OAAO,IAAI,WAAW,WAAW,CAAC,CAAC;oBAChE,CAAC;oBAAC,MAAM,CAAC;wBACP,MAAM,GAAG,MAAM,MAAM,CAAC,KAAK,OAAO,IAAI,WAAW,UAAU,CAAC,CAAC;oBAC/D,CAAC;gBACH,CAAC;gBAED,IAAI,MAAM,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,MAAM,CAAC,SAAS;oBAAE,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC,CAAC;gBAE5F,YAAY,CAAC,MAAM,CAAC,CAAC;YACvB,CAAC;YAAC,MAAM,CAAC;gBACP,YAAY,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,mBAAmB,EAAE,CAAC,CAAC;YACtD,CAAC;YAED,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;gBAC/B,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,mBAAmB,CAAC,CAAC;YACtE,CAAC;QACH,CAAC,CAAC,EAAE,CAAC;QAEL,OAAO,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;IAClC,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC;IAEhB,OAAO,OAAO,SAAS,CAAC,UAAU,KAAK,QAAQ,CAAC,CAAC,CAAC,CAChD,KAAC,eAAe,OACV,SAAS,EACb,UAAU,EAAE,SAAS,CAAC,UAAU,EAChC,UAAU,EAAE,SAAS,CAAC,UAAU,EAChC,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAA0B,YAE/B,KAAC,UAAU,IACT,IAAI,EAAE,IAAI,IAAI,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,gBACpD,SAAS,EACrB,OAAO,EAAE,OAAO,CAAC,OAAO,mBACT,GAAG,oBACF,IAAI,YAEpB,KAAC,OAAO,CAAC,SAAS,KAAG,GACV,GACG,CACnB,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,OACL,SAAS,EACb,IAAI,EAAE,IAAI,IAAI,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,gBACpD,SAAS,EACrB,OAAO,EAAE,OAAO,CAAC,OAAO,EACxB,IAAI,EAAE,IAAI,mBACK,GAAG,oBACF,IAAI,EACpB,GAAG,EAAE,GAAyB,YAE9B,KAAC,OAAO,CAAC,SAAS,KAAG,GACV,CACd,CAAC;AACJ,CAAC,CAAyC,CAAC;AAE3C,eAAe,IAAI,CAAC","sourcesContent":["import { forwardRef, useState, useEffect } from 'react';\nimport type { Ref, PropsWithoutRef, ComponentType, ForwardRefExoticComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useTheme } from '../../hooks';\nimport type { NoChildrenProp, RefElement, WithAttributes } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { readableColor } from '../../styles';\n\nimport { set as budiconSet } from './iconNames';\nimport { set as streamlineSet } from './streamlineIconNames';\n\ntype BaseIconProps = NoChildrenProp & {\n /**\n * The name of the icon set.\n * @default theme.base['icon-set']\n */\n set?: string;\n /** The name indicating the Cosmos Icon. Reference the catalog above for the available names. */\n name: string;\n /**\n * Sets fill style to inverse of theme.base['icon-fill'] if set, has no effect if theme setting is null.\n * @default false\n */\n emphasized?: boolean;\n /**\n * Background & svg size.\n * @default \"s\" without background, \"m\" with background.\n */\n size?: 's' | 'm' | 'l' | 'font-size';\n};\n\nexport type IconProps =\n | WithAttributes<\n 'div',\n BaseIconProps & {\n /** Background color. */\n background: string;\n /**\n * Foreground color (svg fill).\n * Applies readable color off background if undefined.\n */\n foreground?: string;\n /**\n * Shape of the background.\n * @default 'square'\n */\n shape?: 'square' | 'circle';\n }\n >\n | WithAttributes<\n 'svg',\n BaseIconProps & {\n background?: never;\n foreground?: never;\n shape?: never;\n }\n >;\n\nexport interface IconDefinition {\n Component: ComponentType;\n viewBox?: string;\n}\n\nexport interface IconModule extends IconDefinition {\n set?: IconProps['set'];\n name: IconProps['name'];\n}\n\nconst iconRegistry = new Map<string, Map<string, IconDefinition>>([]);\n\nexport const registerIcon = (...icons: IconModule[]) => {\n icons.forEach(({ set: modSet, name, ...iconDef }) => {\n const set = modSet ?? 'budicon';\n\n if (!iconRegistry.has(set)) {\n iconRegistry.set(set, new Map([[name, iconDef]]));\n } else if (!iconRegistry.get(set)!.has(name)) {\n iconRegistry.get(set)!.set(name, iconDef);\n }\n });\n};\n\nexport const forceRegisterIcon = (...icons: IconModule[]) => {\n icons.forEach(({ set: modSet, name, ...iconDef }) => {\n const set = modSet ?? 'budicon';\n\n if (!iconRegistry.has(set)) {\n iconRegistry.set(set, new Map([[name, iconDef]]));\n } else {\n iconRegistry.get(set)!.set(name, iconDef);\n }\n });\n};\n\nexport const StyledIcon = styled.svg<{ size?: IconProps['size'] }>(({ theme, size = 's' }) => {\n const {\n components: {\n icon: {\n size: { s, m, l }\n }\n }\n } = theme;\n return css`\n display: inline-block;\n fill: currentColor;\n vertical-align: middle;\n flex-shrink: 0;\n /* stylelint-disable unit-allowed-list */\n min-width: 14px;\n min-height: 14px;\n /* stylelint-enable unit-allowed-list */\n\n @media (forced-colors: active) {\n fill: CanvasText;\n }\n\n ${size === 's' &&\n css`\n width: ${s};\n height: ${s};\n `}\n\n ${size === 'm' &&\n css`\n width: ${m};\n height: ${m};\n `}\n\n ${size === 'l' &&\n css`\n width: ${l};\n height: ${l};\n `}\n\n ${size === 'font-size' &&\n css`\n width: 1em;\n height: 1em;\n `}\n `;\n});\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nexport const StyledIconShape = styled.div<{\n background: NonNullable<IconProps['background']>;\n foreground?: IconProps['foreground'];\n size?: IconProps['size'];\n shape?: IconProps['shape'];\n}>(({ theme, background, foreground, size = 'm', shape = 'square' }) => {\n const readableFg = readableColor(background, { level: 'AANonText' });\n\n const {\n base: { 'border-radius': baseRadius },\n components: {\n icon: {\n size: { s, m, l },\n 'border-radius-multiplier': borderRadiusMultiplier\n }\n }\n } = theme;\n\n return css`\n color: ${foreground ?? readableFg};\n background-color: ${background};\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: clip;\n\n ${size === 's' &&\n css`\n width: ${s};\n height: ${s};\n `}\n\n ${size === 'm' &&\n css`\n width: ${m};\n height: ${m};\n `}\n\n ${size === 'l' &&\n css`\n width: ${l};\n height: ${l};\n `}\n\n ${size === 'font-size' &&\n css`\n width: 1em;\n height: 1em;\n `}\n\n ${shape === 'square' &&\n css`\n border-radius: calc(${borderRadiusMultiplier} * ${baseRadius});\n `}\n\n ${shape === 'circle' &&\n css`\n border-radius: 50%;\n `}\n\n ${StyledIcon} {\n width: 50%;\n height: 50%;\n /* stylelint-disable unit-allowed-list */\n min-width: min(14px, 90%);\n min-height: min(14px, 90%);\n /* stylelint-enable unit-allowed-list */\n }\n `;\n});\n\nStyledIconShape.defaultProps = defaultThemeProp;\n\nconst emptyIconDefinition: Readonly<IconDefinition> = Object.freeze({ Component: () => null });\n\nconst Icon = forwardRef<RefElement<IconProps>, PropsWithoutRef<IconProps>>(function Icon(\n {\n set: setProp,\n name: nameProp,\n emphasized = false,\n size,\n 'aria-label': ariaLabel,\n role,\n ...restProps\n }: PropsWithoutRef<IconProps>,\n ref\n) {\n const {\n base: { 'icon-set': setTheme, 'icon-fill': fillTheme }\n } = useTheme();\n\n const set = (() => {\n const preferredSet = setProp ?? setTheme ?? 'budicon';\n\n if (preferredSet === 'budicon' && !budiconSet.has(nameProp) && streamlineSet.has(nameProp)) {\n return 'streamline';\n }\n\n if (preferredSet === 'streamline' && !streamlineSet.has(nameProp) && budiconSet.has(nameProp)) {\n return 'budicon';\n }\n\n return preferredSet;\n })();\n\n const fill = (() => {\n if (!fillTheme || (fillTheme !== 'solid' && fillTheme !== 'hollow')) {\n return null;\n }\n\n if (emphasized) {\n return fillTheme === 'solid' ? 'hollow' : 'solid';\n }\n\n return fillTheme;\n })();\n\n const name = (() => {\n if (!fill || (set !== 'budicon' && set !== 'streamline')) {\n return nameProp;\n }\n\n const knownNames = set === 'budicon' ? budiconSet : streamlineSet;\n\n const nameIsSolid = nameProp.endsWith('-solid');\n\n if (nameIsSolid && fill === 'hollow') {\n const hollowName = nameProp.replace(/-solid$/, '');\n\n if (knownNames.has(hollowName)) {\n return hollowName;\n }\n } else if (!nameIsSolid && fill === 'solid') {\n const solidName = `${nameProp}-solid`;\n\n if (knownNames.has(solidName)) {\n return solidName;\n }\n }\n\n return nameProp;\n })();\n\n const [iconDef, setIconDef] = useState(iconRegistry.get(set)?.get(name) ?? emptyIconDefinition);\n\n useEffect(() => {\n if (iconRegistry.get(set)?.has(name)) {\n setIconDef(iconRegistry.get(set)!.get(name)!);\n return;\n }\n\n const controller = new AbortController();\n\n (async () => {\n try {\n const encodedName = encodeURIComponent(name);\n let iconSet: string;\n let module: IconModule;\n\n switch (set) {\n case 'streamline':\n iconSet = 'streamline-icons';\n break;\n case 'budicon':\n iconSet = 'icons';\n break;\n default:\n throw new Error('Unknown icon');\n }\n\n // Different extensions are required for different build setups.\n try {\n module = await import(`./${iconSet}/${encodedName}.icon`);\n } catch {\n try {\n module = await import(`./${iconSet}/${encodedName}.icon.tsx`);\n } catch {\n module = await import(`./${iconSet}/${encodedName}.icon.js`);\n }\n }\n\n if (module.name !== name || !module.Component) throw new Error('Malformed icon definition');\n\n registerIcon(module);\n } catch {\n registerIcon({ set, name, ...emptyIconDefinition });\n }\n\n if (!controller.signal.aborted) {\n setIconDef(iconRegistry.get(set)!.get(name) ?? emptyIconDefinition);\n }\n })();\n\n return () => controller.abort();\n }, [name, set]);\n\n return typeof restProps.background === 'string' ? (\n <StyledIconShape\n {...restProps}\n background={restProps.background}\n foreground={restProps.foreground}\n shape={restProps.shape}\n size={size}\n ref={ref as Ref<HTMLDivElement>}\n >\n <StyledIcon\n role={role ?? (ariaLabel === undefined ? 'presentation' : 'img')}\n aria-label={ariaLabel}\n viewBox={iconDef.viewBox}\n data-icon-set={set}\n data-icon-name={name}\n >\n <iconDef.Component />\n </StyledIcon>\n </StyledIconShape>\n ) : (\n <StyledIcon\n {...restProps}\n role={role ?? (ariaLabel === undefined ? 'presentation' : 'img')}\n aria-label={ariaLabel}\n viewBox={iconDef.viewBox}\n size={size}\n data-icon-set={set}\n data-icon-name={name}\n ref={ref as Ref<SVGSVGElement>}\n >\n <iconDef.Component />\n </StyledIcon>\n );\n}) as ForwardRefExoticComponent<IconProps>;\n\nexport default Icon;\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const set = "budicon";
|
|
2
2
|
export declare const name = "search-solid";
|
|
3
3
|
export declare const Component: () => import("react/jsx-runtime").JSX.Element;
|
|
4
|
-
export declare const viewBox = "0 0
|
|
4
|
+
export declare const viewBox = "0 0 50 50";
|
|
5
5
|
//# sourceMappingURL=search-solid.icon.d.ts.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
// This file is autogenerated. Any changes will be overwritten.
|
|
3
3
|
export const set = 'budicon';
|
|
4
4
|
export const name = 'search-solid';
|
|
5
|
-
export const Component = () => (_jsxs(
|
|
6
|
-
export const viewBox = '0 0
|
|
5
|
+
export const Component = () => (_jsxs("g", { fill: 'currentColor', children: [_jsx("path", { d: 'm36.96 34.081 9.771 9.768.096.288c.287.478.382.862.382 1.053 0 1.34-.67 2.01-2.01 2.01-.383 0-.863-.192-1.341-.575l-9.675-9.673c-3.64 2.969-7.76 4.406-12.452 4.406-5.46 0-10.058-1.915-13.889-5.746C3.916 31.687 2 27.09 2 21.726c0-5.362 1.916-9.958 5.842-13.885C11.77 3.915 16.367 2 21.732 2c5.363 0 9.96 1.915 13.888 5.84 3.832 3.831 5.747 8.428 5.747 13.887 0 4.597-1.437 8.715-4.406 12.353zm-15.133 3.351c4.31 0 7.95-1.532 11.015-4.597s4.599-6.703 4.599-11.013-1.533-8.044-4.599-11.108c-3.065-3.065-6.704-4.598-11.015-4.598-4.311 0-8.046 1.533-11.111 4.598-3.066 3.064-4.599 6.8-4.599 11.108 0 4.31 1.533 7.948 4.599 11.013s6.8 4.597 11.11 4.597z' }), _jsx("path", { d: 'M21.822 35.434c3.76 0 6.933-1.337 9.606-4.01 2.674-2.674 4.01-5.847 4.01-9.607 0-3.76-1.336-7.016-4.01-9.69-2.673-2.673-5.847-4.01-9.606-4.01-3.76 0-7.017 1.337-9.69 4.01-2.673 2.674-4.01 5.932-4.01 9.69 0 3.76 1.337 6.933 4.01 9.607 2.673 2.673 5.93 4.01 9.69 4.01z' })] }));
|
|
6
|
+
export const viewBox = '0 0 50 50';
|
|
7
7
|
//# sourceMappingURL=search-solid.icon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-solid.icon.js","sourceRoot":"","sources":["../../../../src/components/Icon/icons/search-solid.icon.tsx"],"names":[],"mappings":";AAAA,+DAA+D;AAE/D,MAAM,CAAC,MAAM,GAAG,GAAG,SAAS,CAAC;AAE7B,MAAM,CAAC,MAAM,IAAI,GAAG,cAAc,CAAC;AAEnC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,CAC7B,
|
|
1
|
+
{"version":3,"file":"search-solid.icon.js","sourceRoot":"","sources":["../../../../src/components/Icon/icons/search-solid.icon.tsx"],"names":[],"mappings":";AAAA,+DAA+D;AAE/D,MAAM,CAAC,MAAM,GAAG,GAAG,SAAS,CAAC;AAE7B,MAAM,CAAC,MAAM,IAAI,GAAG,cAAc,CAAC;AAEnC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,CAC7B,aAAG,IAAI,EAAC,cAAc,aACpB,eAAM,CAAC,EAAC,yoBAAyoB,GAAG,EACppB,eAAM,CAAC,EAAC,4QAA4Q,GAAG,IACrR,CACL,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,WAAW,CAAC","sourcesContent":["// This file is autogenerated. Any changes will be overwritten.\n\nexport const set = 'budicon';\n\nexport const name = 'search-solid';\n\nexport const Component = () => (\n <g fill='currentColor'>\n <path d='m36.96 34.081 9.771 9.768.096.288c.287.478.382.862.382 1.053 0 1.34-.67 2.01-2.01 2.01-.383 0-.863-.192-1.341-.575l-9.675-9.673c-3.64 2.969-7.76 4.406-12.452 4.406-5.46 0-10.058-1.915-13.889-5.746C3.916 31.687 2 27.09 2 21.726c0-5.362 1.916-9.958 5.842-13.885C11.77 3.915 16.367 2 21.732 2c5.363 0 9.96 1.915 13.888 5.84 3.832 3.831 5.747 8.428 5.747 13.887 0 4.597-1.437 8.715-4.406 12.353zm-15.133 3.351c4.31 0 7.95-1.532 11.015-4.597s4.599-6.703 4.599-11.013-1.533-8.044-4.599-11.108c-3.065-3.065-6.704-4.598-11.015-4.598-4.311 0-8.046 1.533-11.111 4.598-3.066 3.064-4.599 6.8-4.599 11.108 0 4.31 1.533 7.948 4.599 11.013s6.8 4.597 11.11 4.597z' />\n <path d='M21.822 35.434c3.76 0 6.933-1.337 9.606-4.01 2.674-2.674 4.01-5.847 4.01-9.607 0-3.76-1.336-7.016-4.01-9.69-2.673-2.673-5.847-4.01-9.606-4.01-3.76 0-7.017 1.337-9.69 4.01-2.673 2.674-4.01 5.932-4.01 9.69 0 3.76 1.337 6.933 4.01 9.607 2.673 2.673 5.93 4.01 9.69 4.01z' />\n </g>\n);\n\nexport const viewBox = '0 0 50 50';\n"]}
|
|
@@ -234,7 +234,7 @@ const PageLayout = forwardRef(function PageLayout({ regions, cols = `repeat(${re
|
|
|
234
234
|
content: utilities
|
|
235
235
|
}
|
|
236
236
|
];
|
|
237
|
-
const pageHeader = !!path || !!icon || !!actions || !!title || !!banners || !!tabs || !!header ? (_jsxs(Flex, { container: { direction: 'column', pad: [1.5, 0.75, 0] }, sm: { container: { pad: [1.5, 2, 0] } }, item: { grow: 0, shrink: 0 }, as: StyledPageHeader, children: [path && path.length > 0 && _jsx(Breadcrumbs, { path: path }), header || (_jsx(SummaryItem, { visual: icon && (_jsx(StyledPageIcon, { container: { alignItems: 'center', justify: 'center' }, children: _jsx(Icon, { name: icon }) })), primary: _jsx(Text, { variant: 'h1', children: title }), actions: actions })), banners, tabs] })) : null;
|
|
237
|
+
const pageHeader = !!path || !!icon || !!actions || !!title || !!banners || !!tabs || !!header ? (_jsxs(Flex, { container: { direction: 'column', pad: [1.5, 0.75, 0] }, sm: { container: { pad: [1.5, 2, 0] } }, item: { grow: 0, shrink: 0 }, as: StyledPageHeader, children: [path && path.length > 0 && _jsx(Breadcrumbs, { path: path }), header || (_jsx(SummaryItem, { visual: icon && (_jsx(StyledPageIcon, { container: { alignItems: 'center', justify: 'center' }, children: _jsx(Icon, { name: icon, emphasized: true }) })), primary: _jsx(Text, { variant: 'h1', children: title }), actions: actions })), banners, tabs] })) : null;
|
|
238
238
|
const handleTabChange = (id) => {
|
|
239
239
|
setPanel(id);
|
|
240
240
|
};
|