se-design 1.0.62-dev → 1.0.63
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/dist/assets/icons/ai-off.svg +4 -4
- package/dist/assets/icons/center-align.svg +3 -0
- package/dist/assets/icons/left-align.svg +3 -0
- package/dist/assets/icons/right-align.svg +3 -0
- package/dist/assets/style.css +1 -1
- package/dist/components/InfoTooltip/index.d.ts +5 -1
- package/dist/index10.js.map +1 -1
- package/dist/index100.js +2 -2
- package/dist/index100.js.map +1 -1
- package/dist/index101.js +1 -1
- package/dist/index101.js.map +1 -1
- package/dist/index102.js +1 -1
- package/dist/index102.js.map +1 -1
- package/dist/index103.js +2 -2
- package/dist/index103.js.map +1 -1
- package/dist/index104.js +1 -1
- package/dist/index104.js.map +1 -1
- package/dist/index105.js +2 -2
- package/dist/index105.js.map +1 -1
- package/dist/index106.js +1 -1
- package/dist/index106.js.map +1 -1
- package/dist/index107.js +1 -1
- package/dist/index107.js.map +1 -1
- package/dist/index108.js +1 -1
- package/dist/index108.js.map +1 -1
- package/dist/index109.js +2 -2
- package/dist/index109.js.map +1 -1
- package/dist/index11.js.map +1 -1
- package/dist/index110.js +1 -1
- package/dist/index110.js.map +1 -1
- package/dist/index111.js +2 -2
- package/dist/index111.js.map +1 -1
- package/dist/index112.js +2 -2
- package/dist/index112.js.map +1 -1
- package/dist/index113.js +2 -2
- package/dist/index113.js.map +1 -1
- package/dist/index114.js +2 -2
- package/dist/index114.js.map +1 -1
- package/dist/index115.js +1 -1
- package/dist/index115.js.map +1 -1
- package/dist/index116.js +1 -1
- package/dist/index116.js.map +1 -1
- package/dist/index117.js +1 -1
- package/dist/index117.js.map +1 -1
- package/dist/index118.js +2 -2
- package/dist/index118.js.map +1 -1
- package/dist/index119.js +2 -2
- package/dist/index119.js.map +1 -1
- package/dist/index12.js.map +1 -1
- package/dist/index120.js +2 -2
- package/dist/index120.js.map +1 -1
- package/dist/index121.js +1 -1
- package/dist/index121.js.map +1 -1
- package/dist/index122.js +1 -1
- package/dist/index122.js.map +1 -1
- package/dist/index123.js +1 -1
- package/dist/index123.js.map +1 -1
- package/dist/index124.js +1 -1
- package/dist/index124.js.map +1 -1
- package/dist/index125.js +1 -1
- package/dist/index125.js.map +1 -1
- package/dist/index126.js +1 -1
- package/dist/index126.js.map +1 -1
- package/dist/index127.js +1 -1
- package/dist/index127.js.map +1 -1
- package/dist/index128.js +1 -1
- package/dist/index128.js.map +1 -1
- package/dist/index129.js +2 -2
- package/dist/index129.js.map +1 -1
- package/dist/index13.js.map +1 -1
- package/dist/index130.js +2 -2
- package/dist/index130.js.map +1 -1
- package/dist/index131.js +1 -1
- package/dist/index131.js.map +1 -1
- package/dist/index132.js +1 -1
- package/dist/index132.js.map +1 -1
- package/dist/index133.js +1 -1
- package/dist/index133.js.map +1 -1
- package/dist/index134.js +1 -1
- package/dist/index134.js.map +1 -1
- package/dist/index135.js +1 -1
- package/dist/index135.js.map +1 -1
- package/dist/index136.js +1 -1
- package/dist/index136.js.map +1 -1
- package/dist/index137.js +2 -2
- package/dist/index137.js.map +1 -1
- package/dist/index138.js +2 -2
- package/dist/index138.js.map +1 -1
- package/dist/index139.js +2 -2
- package/dist/index139.js.map +1 -1
- package/dist/index140.js +2 -2
- package/dist/index140.js.map +1 -1
- package/dist/index141.js +2 -2
- package/dist/index141.js.map +1 -1
- package/dist/index142.js +2 -2
- package/dist/index142.js.map +1 -1
- package/dist/index143.js +2 -2
- package/dist/index143.js.map +1 -1
- package/dist/index144.js +1 -1
- package/dist/index144.js.map +1 -1
- package/dist/index145.js +1 -1
- package/dist/index145.js.map +1 -1
- package/dist/index146.js +1 -1
- package/dist/index146.js.map +1 -1
- package/dist/index147.js +1 -1
- package/dist/index147.js.map +1 -1
- package/dist/index148.js +1 -1
- package/dist/index148.js.map +1 -1
- package/dist/index149.js +1 -1
- package/dist/index149.js.map +1 -1
- package/dist/index15.js +2 -2
- package/dist/index15.js.map +1 -1
- package/dist/index150.js +1 -1
- package/dist/index150.js.map +1 -1
- package/dist/index151.js +1 -1
- package/dist/index151.js.map +1 -1
- package/dist/index152.js +1 -1
- package/dist/index152.js.map +1 -1
- package/dist/index153.js +1 -1
- package/dist/index153.js.map +1 -1
- package/dist/index154.js +1 -1
- package/dist/index154.js.map +1 -1
- package/dist/index155.js +1 -1
- package/dist/index155.js.map +1 -1
- package/dist/index156.js +1 -1
- package/dist/index156.js.map +1 -1
- package/dist/index157.js +1 -1
- package/dist/index157.js.map +1 -1
- package/dist/index158.js +1 -1
- package/dist/index158.js.map +1 -1
- package/dist/index159.js +1 -1
- package/dist/index159.js.map +1 -1
- package/dist/index16.js.map +1 -1
- package/dist/index160.js +1 -1
- package/dist/index160.js.map +1 -1
- package/dist/index161.js +1 -1
- package/dist/index161.js.map +1 -1
- package/dist/index162.js +1 -1
- package/dist/index162.js.map +1 -1
- package/dist/index163.js +1 -1
- package/dist/index163.js.map +1 -1
- package/dist/index164.js +1 -1
- package/dist/index164.js.map +1 -1
- package/dist/index165.js +1 -1
- package/dist/index165.js.map +1 -1
- package/dist/index166.js +2 -2
- package/dist/index166.js.map +1 -1
- package/dist/index167.js +1 -1
- package/dist/index167.js.map +1 -1
- package/dist/index168.js +1 -1
- package/dist/index168.js.map +1 -1
- package/dist/index169.js +2 -2
- package/dist/index169.js.map +1 -1
- package/dist/index17.js.map +1 -1
- package/dist/index170.js +2 -2
- package/dist/index170.js.map +1 -1
- package/dist/index171.js +1 -1
- package/dist/index171.js.map +1 -1
- package/dist/index172.js +1 -1
- package/dist/index172.js.map +1 -1
- package/dist/index173.js +2 -2
- package/dist/index173.js.map +1 -1
- package/dist/index174.js +1 -1
- package/dist/index174.js.map +1 -1
- package/dist/index175.js +1 -1
- package/dist/index175.js.map +1 -1
- package/dist/index176.js +1 -1
- package/dist/index176.js.map +1 -1
- package/dist/index177.js +1 -1
- package/dist/index177.js.map +1 -1
- package/dist/index178.js +1 -1
- package/dist/index178.js.map +1 -1
- package/dist/index179.js +1 -1
- package/dist/index179.js.map +1 -1
- package/dist/index18.js +1 -1
- package/dist/index18.js.map +1 -1
- package/dist/index180.js +2 -2
- package/dist/index180.js.map +1 -1
- package/dist/index181.js +1 -1
- package/dist/index181.js.map +1 -1
- package/dist/index182.js +2 -2
- package/dist/index182.js.map +1 -1
- package/dist/index183.js +2 -149
- package/dist/index183.js.map +1 -1
- package/dist/index184.js +2 -9
- package/dist/index184.js.map +1 -1
- package/dist/index185.js +2 -6
- package/dist/index185.js.map +1 -1
- package/dist/index186.js +149 -5
- package/dist/index186.js.map +1 -1
- package/dist/index187.js +12 -0
- package/dist/index187.js.map +1 -0
- package/dist/index188.js +9 -0
- package/dist/index188.js.map +1 -0
- package/dist/index189.js +4 -23
- package/dist/index189.js.map +1 -1
- package/dist/index19.js.map +1 -1
- package/dist/index192.js +27 -0
- package/dist/index192.js.map +1 -0
- package/dist/{index191.js → index194.js} +3 -3
- package/dist/{index191.js.map → index194.js.map} +1 -1
- package/dist/{index193.js → index196.js} +1 -1
- package/dist/{index193.js.map → index196.js.map} +1 -1
- package/dist/index20.js.map +1 -1
- package/dist/{index201.js → index204.js} +1 -1
- package/dist/{index201.js.map → index204.js.map} +1 -1
- package/dist/index21.js.map +1 -1
- package/dist/index212.js +1233 -41
- package/dist/index212.js.map +1 -1
- package/dist/{index211.js → index214.js} +1 -1
- package/dist/{index211.js.map → index214.js.map} +1 -1
- package/dist/index215.js +44 -0
- package/dist/index215.js.map +1 -0
- package/dist/index22.js +2 -2
- package/dist/index22.js.map +1 -1
- package/dist/index225.js +3 -53
- package/dist/index225.js.map +1 -1
- package/dist/index227.js +57 -8
- package/dist/index227.js.map +1 -1
- package/dist/index228.js +53 -4
- package/dist/index228.js.map +1 -1
- package/dist/index229.js +9 -169
- package/dist/index229.js.map +1 -1
- package/dist/index23.js.map +1 -1
- package/dist/index230.js +10 -11
- package/dist/index230.js.map +1 -1
- package/dist/index231.js +4 -21
- package/dist/index231.js.map +1 -1
- package/dist/index232.js +169 -18
- package/dist/index232.js.map +1 -1
- package/dist/index233.js +11 -6
- package/dist/index233.js.map +1 -1
- package/dist/index234.js +21 -5
- package/dist/index234.js.map +1 -1
- package/dist/index235.js +18 -37
- package/dist/index235.js.map +1 -1
- package/dist/index236.js +6 -2
- package/dist/index236.js.map +1 -1
- package/dist/index237.js +5 -7
- package/dist/index237.js.map +1 -1
- package/dist/index238.js +36 -325
- package/dist/index238.js.map +1 -1
- package/dist/index239.js +2 -50
- package/dist/index239.js.map +1 -1
- package/dist/index24.js +2 -2
- package/dist/index24.js.map +1 -1
- package/dist/index240.js +8 -2
- package/dist/index240.js.map +1 -1
- package/dist/index241.js +323 -72
- package/dist/index241.js.map +1 -1
- package/dist/index242.js +47 -90
- package/dist/index242.js.map +1 -1
- package/dist/index243.js +2 -52
- package/dist/index243.js.map +1 -1
- package/dist/index244.js +75 -7
- package/dist/index244.js.map +1 -1
- package/dist/index245.js +92 -4
- package/dist/index245.js.map +1 -1
- package/dist/index246.js +48 -48
- package/dist/index246.js.map +1 -1
- package/dist/index247.js +8 -2
- package/dist/index247.js.map +1 -1
- package/dist/index248.js +5 -2
- package/dist/index248.js.map +1 -1
- package/dist/index249.js +55 -0
- package/dist/index249.js.map +1 -0
- package/dist/index25.js.map +1 -1
- package/dist/index250.js +5 -0
- package/dist/index250.js.map +1 -0
- package/dist/index251.js +5 -0
- package/dist/index251.js.map +1 -0
- package/dist/index26.js.map +1 -1
- package/dist/index27.js +1 -1
- package/dist/index27.js.map +1 -1
- package/dist/index28.js.map +1 -1
- package/dist/index29.js +1 -1
- package/dist/index29.js.map +1 -1
- package/dist/index3.js.map +1 -1
- package/dist/index30.js.map +1 -1
- package/dist/index31.js +11 -10
- package/dist/index31.js.map +1 -1
- package/dist/index32.js.map +1 -1
- package/dist/index33.js.map +1 -1
- package/dist/index34.js +1 -1
- package/dist/index34.js.map +1 -1
- package/dist/index35.js.map +1 -1
- package/dist/index36.js.map +1 -1
- package/dist/index37.js +2 -2
- package/dist/index37.js.map +1 -1
- package/dist/index38.js +2 -2
- package/dist/index38.js.map +1 -1
- package/dist/index39.js +1 -1
- package/dist/index39.js.map +1 -1
- package/dist/index4.js.map +1 -1
- package/dist/index40.js.map +1 -1
- package/dist/index41.js +8 -7
- package/dist/index41.js.map +1 -1
- package/dist/index42.js +7 -6
- package/dist/index42.js.map +1 -1
- package/dist/index43.js.map +1 -1
- package/dist/index44.js +2 -2
- package/dist/index44.js.map +1 -1
- package/dist/index45.js +3 -3
- package/dist/index45.js.map +1 -1
- package/dist/index46.js.map +1 -1
- package/dist/index47.js.map +1 -1
- package/dist/index48.js +2 -2
- package/dist/index48.js.map +1 -1
- package/dist/index49.js.map +1 -1
- package/dist/index5.js +164 -158
- package/dist/index5.js.map +1 -1
- package/dist/index50.js +13 -13
- package/dist/index50.js.map +1 -1
- package/dist/index51.js.map +1 -1
- package/dist/index52.js +1 -1
- package/dist/index52.js.map +1 -1
- package/dist/index53.js.map +1 -1
- package/dist/index54.js +22 -21
- package/dist/index54.js.map +1 -1
- package/dist/index55.js.map +1 -1
- package/dist/index56.js +1 -1
- package/dist/index56.js.map +1 -1
- package/dist/index57.js.map +1 -1
- package/dist/index58.js.map +1 -1
- package/dist/index59.js.map +1 -1
- package/dist/index6.js +3 -2
- package/dist/index6.js.map +1 -1
- package/dist/index60.js +45 -39
- package/dist/index60.js.map +1 -1
- package/dist/index61.js.map +1 -1
- package/dist/index62.js +1 -1
- package/dist/index62.js.map +1 -1
- package/dist/index63.js.map +1 -1
- package/dist/index64.js +4 -3
- package/dist/index64.js.map +1 -1
- package/dist/index66.js.map +1 -1
- package/dist/index67.js.map +1 -1
- package/dist/index68.js.map +1 -1
- package/dist/index69.js.map +1 -1
- package/dist/index7.js.map +1 -1
- package/dist/index70.js.map +1 -1
- package/dist/index72.js +1 -1
- package/dist/index72.js.map +1 -1
- package/dist/index73.js.map +1 -1
- package/dist/index74.js.map +1 -1
- package/dist/index75.js.map +1 -1
- package/dist/index76.js.map +1 -1
- package/dist/index77.js.map +1 -1
- package/dist/index78.js.map +1 -1
- package/dist/index79.js.map +1 -1
- package/dist/index8.js +2 -2
- package/dist/index8.js.map +1 -1
- package/dist/index80.js.map +1 -1
- package/dist/index81.js.map +1 -1
- package/dist/index82.js.map +1 -1
- package/dist/index83.js +1 -1
- package/dist/index83.js.map +1 -1
- package/dist/index84.js +1 -1
- package/dist/index84.js.map +1 -1
- package/dist/index85.js +1 -1
- package/dist/index85.js.map +1 -1
- package/dist/index86.js +1 -1
- package/dist/index86.js.map +1 -1
- package/dist/index87.js +1 -1
- package/dist/index87.js.map +1 -1
- package/dist/index88.js +1 -1
- package/dist/index88.js.map +1 -1
- package/dist/index89.js +1 -1
- package/dist/index89.js.map +1 -1
- package/dist/index9.js.map +1 -1
- package/dist/index90.js +1 -1
- package/dist/index90.js.map +1 -1
- package/dist/index91.js +1 -1
- package/dist/index91.js.map +1 -1
- package/dist/index92.js +1 -1
- package/dist/index92.js.map +1 -1
- package/dist/index93.js +1 -1
- package/dist/index93.js.map +1 -1
- package/dist/index94.js +1 -1
- package/dist/index94.js.map +1 -1
- package/dist/index95.js +1 -1
- package/dist/index95.js.map +1 -1
- package/dist/index96.js +1 -1
- package/dist/index96.js.map +1 -1
- package/dist/index97.js +1 -1
- package/dist/index97.js.map +1 -1
- package/dist/index98.js +2 -2
- package/dist/index98.js.map +1 -1
- package/dist/index99.js +1 -1
- package/dist/index99.js.map +1 -1
- package/package.json +1 -1
- package/dist/index209.js +0 -1236
- package/dist/index209.js.map +0 -1
- package/dist/index222.js +0 -7
- package/dist/index222.js.map +0 -1
- package/dist/index224.js +0 -62
- package/dist/index224.js.map +0 -1
- package/dist/index226.js +0 -13
- package/dist/index226.js.map +0 -1
package/dist/index48.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index48.js","sources":["../src/components/NavigationBar/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useState,useMemo, useEffect } from 'react';\nimport { Popover, MenuList, Icon } from 'src/components';\nimport { TabButton } from './TabButton';\nimport { useTabsA11y } from './useTabsA11y';\nimport { getA11yNameAttributes } from '../../utils/a11y';\n\nexport interface NavigationItemProps {\n label: string;\n id: string;\n disabled?: boolean;\n panelHasFocusableContent?: boolean; // If false, the panel itself will be tabbable when active\n renderNavigationItemContent?: (navigationItem: NavigationItemProps) => ReactNode;\n}\n\ninterface NavigationBarProps {\n defaultActiveNavigationItem?: string;\n navigationItems: NavigationItemProps[];\n isCompactView?: boolean;\n onNavigationItemChange?: (navigationItemId: string) => void;\n keyboardActivationMode?: 'automatic' | 'manual'; //manual: arrow keys move focus only; Enter/Space activates the focused tab\n orientation?: 'horizontal' | 'vertical'; // required for aria and arrow shortcuts\n ariaLabel?: string; // Used when ariaLabelledBy is not provided\n ariaLabelledBy?: string; // ID of element that labels this tablist (preferred over ariaLabel when visible label exists)\n idBase?: string; //optional ID namespace to avoid collisions\n}\n\nexport const NavigationBar: FC<NavigationBarProps> = ({\n defaultActiveNavigationItem,\n navigationItems,\n onNavigationItemChange,\n isCompactView = false,\n keyboardActivationMode = 'automatic',\n orientation = 'horizontal',\n ariaLabel = 'Sections',\n ariaLabelledBy,\n idBase = ''\n}) => {\n const defaultNavigationItemId = defaultActiveNavigationItem || navigationItems[0]?.id || '';\n const [activeNavigationItem, setActiveNavigationItem] = useState<string>(defaultNavigationItemId);\n\n // Exclude disabled tabs from roving focus (keeps native disabled buttons, avoids focus-on-disabled).\n const itemIds = useMemo(\n () => navigationItems.filter((item) => !item.disabled).map((item) => item.id),\n [navigationItems]\n );\n\n // Hook for managing Tabs (NavigationBar) focus and ARIA props.\n const { getTabProps, setFocusedTabId, handleKeyDown, getPanelId, getTabId } = useTabsA11y({\n itemIds,\n orientation,\n activeNavigationItem,\n idBase\n });\n\n useEffect(() => {\n if (defaultActiveNavigationItem) {\n setActiveNavigationItem(defaultActiveNavigationItem);\n setFocusedTabId(defaultActiveNavigationItem);\n }\n }, [defaultActiveNavigationItem, setFocusedTabId]);\n\n const handleNavigationItemClick = (navigationItem: NavigationItemProps) => {\n if (navigationItem?.disabled) return;\n setActiveNavigationItem(navigationItem?.id);\n onNavigationItemChange?.(navigationItem?.id);\n };\n\n const activateTabById = (id: string) => {\n const item = navigationItems.find((i) => i.id === id);\n if (!item || item.disabled) return;\n setActiveNavigationItem(id);\n onNavigationItemChange?.(id);\n };\n\n const renderPanels = useMemo(() => {\n return navigationItems.map((navigationItem) => {\n const isSelected = navigationItem.id === activeNavigationItem;\n const panelTabIndex = isSelected && navigationItem.panelHasFocusableContent === false ? 0 : undefined;\n\n return (\n <div\n key={navigationItem.id}\n id={getPanelId(navigationItem.id)}\n role=\"tabpanel\"\n aria-labelledby={getTabId(navigationItem.id)}\n hidden={!isSelected}\n tabIndex={panelTabIndex}\n className={`navigation-item-content ${isSelected ? 'block' : 'hidden'}`}\n >\n {isSelected && navigationItem?.renderNavigationItemContent?.(navigationItem)}\n </div>\n );\n });\n }, [navigationItems, activeNavigationItem, getPanelId, getTabId]);\n\n const activeNavigationItemData = navigationItems.find((item) => item.id === activeNavigationItem);\n\n return (\n <>\n <div\n className=\"se-design-navigation-bar flex items-center gap-4\"\n data-automation-id=\"navigation-bar-container\"\n role=\"tablist\"\n aria-orientation={orientation}\n {...getA11yNameAttributes({\n ariaLabel,\n ariaLabelledBy\n })}\n >\n {!isCompactView && navigationItems.map((navigationItem) => {\n const isSelected = activeNavigationItem === navigationItem.id;\n const isDisabled = navigationItem.disabled;\n\n const tabProps = getTabProps(navigationItem.id);\n\n return (\n <TabButton\n key={navigationItem.id}\n ref={tabProps.ref as (el: HTMLButtonElement | null) => void}\n tabIndex={tabProps.tabIndex}\n id={tabProps.id}\n label={navigationItem.label}\n isSelected={isSelected}\n isDisabled={isDisabled}\n panelId={tabProps['aria-controls']}\n onClick={() => handleNavigationItemClick(navigationItem)}\n onFocus={() => {\n setFocusedTabId(navigationItem.id);\n if (keyboardActivationMode === 'automatic' && !isDisabled) {\n activateTabById(navigationItem.id);\n }\n }}\n onKeyDown={handleKeyDown}\n className={`text-base ${\n isDisabled\n ? 'text-[var(--color-gray-400)] cursor-not-allowed'\n : isSelected\n ? 'text-[var(--color-gray-900)] font-bold hover:cursor-pointer'\n : 'text-[var(--color-gray-700)] font-normal hover:text-[var(--color-gray-900)] cursor-pointer'\n } focus-outline rounded-[6px]`}\n automationId={`navigation-item-${navigationItem.id}`}\n />\n );\n })}\n {isCompactView && (\n <Popover\n className=\"navigation-bar-popover\"\n position=\"bottom-left\"\n noBorder\n renderPopoverSrcElement={({ displayPopover }) => (\n <div className=\"navigation-bar-popover-src-element flex items-center gap-1 cursor-pointer\">\n <label className=\"font-semibold cursor-pointer\">{activeNavigationItemData?.label}</label>\n <Icon name=\"chevron\" rotation={displayPopover ? '180' : '0'} />\n </div>\n )}\n renderPopoverContents={({ closePopoverCb }) => (\n <MenuList items={navigationItems.map((item) => ({\n id: item.id,\n label: item.label,\n onClick: () => {\n handleNavigationItemClick(item);\n closePopoverCb();\n }\n }))}\n />\n )}\n />\n )}\n </div>\n\n <div className=\"se-design-navigation-bar-content\">\n {renderPanels}\n </div>\n </>\n );\n};\n"],"names":["NavigationBar","defaultActiveNavigationItem","navigationItems","onNavigationItemChange","isCompactView","keyboardActivationMode","orientation","ariaLabel","ariaLabelledBy","idBase","defaultNavigationItemId","id","activeNavigationItem","setActiveNavigationItem","useState","itemIds","useMemo","filter","item","disabled","map","getTabProps","setFocusedTabId","handleKeyDown","getPanelId","getTabId","useTabsA11y","useEffect","handleNavigationItemClick","navigationItem","activateTabById","find","i","renderPanels","isSelected","panelTabIndex","panelHasFocusableContent","undefined","React","createElement","key","role","hidden","tabIndex","className","renderNavigationItemContent","activeNavigationItemData","Fragment","_extends","getA11yNameAttributes","isDisabled","tabProps","TabButton","ref","label","panelId","onClick","onFocus","onKeyDown","automationId","Popover","position","noBorder","renderPopoverSrcElement","displayPopover","Icon","name","rotation","renderPopoverContents","closePopoverCb","MenuList","items"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index48.js","sources":["../src/components/NavigationBar/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useState,useMemo, useEffect } from 'react';\nimport { Popover, MenuList, Icon } from 'src/components';\nimport { TabButton } from './TabButton';\nimport { useTabsA11y } from './useTabsA11y';\nimport { getA11yNameAttributes } from '../../utils/a11y';\n\nexport interface NavigationItemProps {\n label: string;\n id: string;\n disabled?: boolean;\n panelHasFocusableContent?: boolean; // If false, the panel itself will be tabbable when active\n renderNavigationItemContent?: (navigationItem: NavigationItemProps) => ReactNode;\n}\n\ninterface NavigationBarProps {\n defaultActiveNavigationItem?: string;\n navigationItems: NavigationItemProps[];\n isCompactView?: boolean;\n onNavigationItemChange?: (navigationItemId: string) => void;\n keyboardActivationMode?: 'automatic' | 'manual'; //manual: arrow keys move focus only; Enter/Space activates the focused tab\n orientation?: 'horizontal' | 'vertical'; // required for aria and arrow shortcuts\n ariaLabel?: string; // Used when ariaLabelledBy is not provided\n ariaLabelledBy?: string; // ID of element that labels this tablist (preferred over ariaLabel when visible label exists)\n idBase?: string; //optional ID namespace to avoid collisions\n}\n\nexport const NavigationBar: FC<NavigationBarProps> = ({\n defaultActiveNavigationItem,\n navigationItems,\n onNavigationItemChange,\n isCompactView = false,\n keyboardActivationMode = 'automatic',\n orientation = 'horizontal',\n ariaLabel = 'Sections',\n ariaLabelledBy,\n idBase = ''\n}) => {\n const defaultNavigationItemId = defaultActiveNavigationItem || navigationItems[0]?.id || '';\n const [activeNavigationItem, setActiveNavigationItem] = useState<string>(defaultNavigationItemId);\n\n // Exclude disabled tabs from roving focus (keeps native disabled buttons, avoids focus-on-disabled).\n const itemIds = useMemo(\n () => navigationItems.filter((item) => !item.disabled).map((item) => item.id),\n [navigationItems]\n );\n\n // Hook for managing Tabs (NavigationBar) focus and ARIA props.\n const { getTabProps, setFocusedTabId, handleKeyDown, getPanelId, getTabId } = useTabsA11y({\n itemIds,\n orientation,\n activeNavigationItem,\n idBase\n });\n\n useEffect(() => {\n if (defaultActiveNavigationItem) {\n setActiveNavigationItem(defaultActiveNavigationItem);\n setFocusedTabId(defaultActiveNavigationItem);\n }\n }, [defaultActiveNavigationItem, setFocusedTabId]);\n\n const handleNavigationItemClick = (navigationItem: NavigationItemProps) => {\n if (navigationItem?.disabled) return;\n setActiveNavigationItem(navigationItem?.id);\n onNavigationItemChange?.(navigationItem?.id);\n };\n\n const activateTabById = (id: string) => {\n const item = navigationItems.find((i) => i.id === id);\n if (!item || item.disabled) return;\n setActiveNavigationItem(id);\n onNavigationItemChange?.(id);\n };\n\n const renderPanels = useMemo(() => {\n return navigationItems.map((navigationItem) => {\n const isSelected = navigationItem.id === activeNavigationItem;\n const panelTabIndex = isSelected && navigationItem.panelHasFocusableContent === false ? 0 : undefined;\n\n return (\n <div\n key={navigationItem.id}\n id={getPanelId(navigationItem.id)}\n role=\"tabpanel\"\n aria-labelledby={getTabId(navigationItem.id)}\n hidden={!isSelected}\n tabIndex={panelTabIndex}\n className={`navigation-item-content ${isSelected ? 'block' : 'hidden'}`}\n >\n {isSelected && navigationItem?.renderNavigationItemContent?.(navigationItem)}\n </div>\n );\n });\n }, [navigationItems, activeNavigationItem, getPanelId, getTabId]);\n\n const activeNavigationItemData = navigationItems.find((item) => item.id === activeNavigationItem);\n\n return (\n <>\n <div\n className=\"se-design-navigation-bar flex items-center gap-4\"\n data-automation-id=\"navigation-bar-container\"\n role=\"tablist\"\n aria-orientation={orientation}\n {...getA11yNameAttributes({\n ariaLabel,\n ariaLabelledBy\n })}\n >\n {!isCompactView && navigationItems.map((navigationItem) => {\n const isSelected = activeNavigationItem === navigationItem.id;\n const isDisabled = navigationItem.disabled;\n\n const tabProps = getTabProps(navigationItem.id);\n\n return (\n <TabButton\n key={navigationItem.id}\n ref={tabProps.ref as (el: HTMLButtonElement | null) => void}\n tabIndex={tabProps.tabIndex}\n id={tabProps.id}\n label={navigationItem.label}\n isSelected={isSelected}\n isDisabled={isDisabled}\n panelId={tabProps['aria-controls']}\n onClick={() => handleNavigationItemClick(navigationItem)}\n onFocus={() => {\n setFocusedTabId(navigationItem.id);\n if (keyboardActivationMode === 'automatic' && !isDisabled) {\n activateTabById(navigationItem.id);\n }\n }}\n onKeyDown={handleKeyDown}\n className={`text-base ${\n isDisabled\n ? 'text-[var(--color-gray-400)] cursor-not-allowed'\n : isSelected\n ? 'text-[var(--color-gray-900)] font-bold hover:cursor-pointer'\n : 'text-[var(--color-gray-700)] font-normal hover:text-[var(--color-gray-900)] cursor-pointer'\n } focus-outline rounded-[6px]`}\n automationId={`navigation-item-${navigationItem.id}`}\n />\n );\n })}\n {isCompactView && (\n <Popover\n className=\"navigation-bar-popover\"\n position=\"bottom-left\"\n noBorder\n renderPopoverSrcElement={({ displayPopover }) => (\n <div className=\"navigation-bar-popover-src-element flex items-center gap-1 cursor-pointer\">\n <label className=\"font-semibold cursor-pointer\">{activeNavigationItemData?.label}</label>\n <Icon name=\"chevron\" rotation={displayPopover ? '180' : '0'} />\n </div>\n )}\n renderPopoverContents={({ closePopoverCb }) => (\n <MenuList items={navigationItems.map((item) => ({\n id: item.id,\n label: item.label,\n onClick: () => {\n handleNavigationItemClick(item);\n closePopoverCb();\n }\n }))}\n />\n )}\n />\n )}\n </div>\n\n <div className=\"se-design-navigation-bar-content\">\n {renderPanels}\n </div>\n </>\n );\n};\n"],"names":["NavigationBar","defaultActiveNavigationItem","navigationItems","onNavigationItemChange","isCompactView","keyboardActivationMode","orientation","ariaLabel","ariaLabelledBy","idBase","defaultNavigationItemId","id","activeNavigationItem","setActiveNavigationItem","useState","itemIds","useMemo","filter","item","disabled","map","getTabProps","setFocusedTabId","handleKeyDown","getPanelId","getTabId","useTabsA11y","useEffect","handleNavigationItemClick","navigationItem","activateTabById","find","i","renderPanels","isSelected","panelTabIndex","panelHasFocusableContent","undefined","React","createElement","key","role","hidden","tabIndex","className","renderNavigationItemContent","activeNavigationItemData","Fragment","_extends","getA11yNameAttributes","isDisabled","tabProps","TabButton","ref","label","panelId","onClick","onFocus","onKeyDown","automationId","Popover","position","noBorder","renderPopoverSrcElement","displayPopover","Icon","name","rotation","renderPopoverContents","closePopoverCb","MenuList","items"],"mappings":"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"}
|
package/dist/index49.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index49.js","sources":["../src/components/BreadCrumbs/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon } from '../Icon';\nimport { Popover } from '../Popover';\nimport { MenuList } from '../MenuList';\n\nimport './style.scss';\n\ninterface Crumb {\n id: string | number;\n label: string;\n automationId?: string;\n}\n\ninterface BreadCrumbsProps {\n crumbs: Crumb[];\n onCrumbClick?: (crumb: Crumb) => void;\n className?: any;\n /** Accessible name for the breadcrumb navigation landmark. Defaults to \"Breadcrumb\". Use for i18n or when multiple breadcrumb regions exist. */\n ariaLabel?: string;\n}\n\nexport const BreadCrumbs: React.FC<BreadCrumbsProps> = ({ crumbs, onCrumbClick, className, ariaLabel = 'Breadcrumb' }) => {\n const shouldShowDropdown = crumbs?.length > 3;\n const visibleCrumbs = shouldShowDropdown ? crumbs?.slice(-2) : crumbs;\n const dropdownCrumbs = shouldShowDropdown ? crumbs?.slice(0, -2) : [];\n\n const isCurrentPage = (index: number) => index === visibleCrumbs?.length - 1;\n\n const getLabelClassNames = (index: number) => {\n const className = 'se-design-breadcrumbs-item-label inline-flex items-center w-fit';\n if (visibleCrumbs?.length === 1) {\n return `${className} single-crumb`;\n }\n if (isCurrentPage(index)) {\n return `${className} highlighted-crumb`;\n }\n return `${className} unhighlighted-crumb`;\n };\n\n return (\n <nav className={`se-design-breadcrumbs flex items-center ${className}`} aria-label={ariaLabel} data-automation-id=\"breadcrumbs-container\">\n {dropdownCrumbs?.length > 0 && (\n <Popover\n className=\"se-design-overflow-breadcrumbs\"\n position=\"bottom-left\"\n noBorder\n ariaLabel=\"Show more breadcrumbs\"\n renderPopoverSrcElement={({ displayPopover }) => {\n return (\n <div\n className={`overflow-breadcrumbs-src-element px-1.5 py-1.5 rounded-md hover:cursor-pointer ${\n displayPopover ? 'bg-[var(--color-blue-200)]' : ''\n }`}\n data-automation-id=\"breadcrumbs-kebab-menu\"\n >\n <Icon name=\"kebab-menu\" />\n </div>\n );\n }}\n renderPopoverContents={({ closePopoverCb }) => (\n <MenuList\n items={dropdownCrumbs.map((crumb) => ({\n id: String(crumb?.id),\n label: crumb?.label,\n onClick: () => {\n onCrumbClick?.(crumb);\n closePopoverCb();\n }\n }))}\n />\n )}\n />\n )}\n <ol className=\"se-design-breadcrumbs-list inline-flex items-center\">\n {visibleCrumbs?.map((crumb, index) => {\n const Tag = isCurrentPage(index) ? 'span' : 'button';// Current page should not be clickable\n return (\n <li key={crumb?.id} className=\"se-design-breadcrumbs-item inline-flex items-center w-fit text-xl\">\n {(index > 0 || shouldShowDropdown) && <Icon name=\"chevron\" rotation={'270'} />}\n <Tag\n {...(isCurrentPage(index)\n ? { 'aria-current': 'page' as const }\n : { type: 'button' as const, onClick: () => onCrumbClick?.(crumb) })}\n className={`${getLabelClassNames(index)}${!isCurrentPage(index) ? ' cursor-pointer focus-outline' : ''}`}\n data-automation-id={crumb?.automationId || `breadcrumbs-item-${index}`}\n >\n {crumb?.label}\n </Tag>\n </li>\n );\n })}\n </ol>\n </nav>\n );\n};\n"],"names":["BreadCrumbs","crumbs","onCrumbClick","className","ariaLabel","shouldShowDropdown","length","visibleCrumbs","slice","dropdownCrumbs","isCurrentPage","index","getLabelClassNames","React","createElement","Popover","position","noBorder","renderPopoverSrcElement","displayPopover","Icon","name","renderPopoverContents","closePopoverCb","MenuList","items","map","crumb","id","String","label","onClick","Tag","key","rotation","_extends","type","automationId"],"mappings":";;;;;;;;;;;;;;AAqBO,MAAMA,IAA0CA,CAAC;AAAA,EAAEC,QAAAA;AAAAA,EAAQC,cAAAA;AAAAA,EAAcC,WAAAA;AAAAA,EAAWC,WAAAA,IAAY;AAAa,MAAM;
|
|
1
|
+
{"version":3,"file":"index49.js","sources":["../src/components/BreadCrumbs/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon } from '../Icon';\nimport { Popover } from '../Popover';\nimport { MenuList } from '../MenuList';\n\nimport './style.scss';\n\ninterface Crumb {\n id: string | number;\n label: string;\n automationId?: string;\n}\n\ninterface BreadCrumbsProps {\n crumbs: Crumb[];\n onCrumbClick?: (crumb: Crumb) => void;\n className?: any;\n /** Accessible name for the breadcrumb navigation landmark. Defaults to \"Breadcrumb\". Use for i18n or when multiple breadcrumb regions exist. */\n ariaLabel?: string;\n}\n\nexport const BreadCrumbs: React.FC<BreadCrumbsProps> = ({ crumbs, onCrumbClick, className, ariaLabel = 'Breadcrumb' }) => {\n const shouldShowDropdown = crumbs?.length > 3;\n const visibleCrumbs = shouldShowDropdown ? crumbs?.slice(-2) : crumbs;\n const dropdownCrumbs = shouldShowDropdown ? crumbs?.slice(0, -2) : [];\n\n const isCurrentPage = (index: number) => index === visibleCrumbs?.length - 1;\n\n const getLabelClassNames = (index: number) => {\n const className = 'se-design-breadcrumbs-item-label inline-flex items-center w-fit';\n if (visibleCrumbs?.length === 1) {\n return `${className} single-crumb`;\n }\n if (isCurrentPage(index)) {\n return `${className} highlighted-crumb`;\n }\n return `${className} unhighlighted-crumb`;\n };\n\n return (\n <nav className={`se-design-breadcrumbs flex items-center ${className}`} aria-label={ariaLabel} data-automation-id=\"breadcrumbs-container\">\n {dropdownCrumbs?.length > 0 && (\n <Popover\n className=\"se-design-overflow-breadcrumbs\"\n position=\"bottom-left\"\n noBorder\n ariaLabel=\"Show more breadcrumbs\"\n renderPopoverSrcElement={({ displayPopover }) => {\n return (\n <div\n className={`overflow-breadcrumbs-src-element px-1.5 py-1.5 rounded-md hover:cursor-pointer ${\n displayPopover ? 'bg-[var(--color-blue-200)]' : ''\n }`}\n data-automation-id=\"breadcrumbs-kebab-menu\"\n >\n <Icon name=\"kebab-menu\" />\n </div>\n );\n }}\n renderPopoverContents={({ closePopoverCb }) => (\n <MenuList\n items={dropdownCrumbs.map((crumb) => ({\n id: String(crumb?.id),\n label: crumb?.label,\n onClick: () => {\n onCrumbClick?.(crumb);\n closePopoverCb();\n }\n }))}\n />\n )}\n />\n )}\n <ol className=\"se-design-breadcrumbs-list inline-flex items-center\">\n {visibleCrumbs?.map((crumb, index) => {\n const Tag = isCurrentPage(index) ? 'span' : 'button';// Current page should not be clickable\n return (\n <li key={crumb?.id} className=\"se-design-breadcrumbs-item inline-flex items-center w-fit text-xl\">\n {(index > 0 || shouldShowDropdown) && <Icon name=\"chevron\" rotation={'270'} />}\n <Tag\n {...(isCurrentPage(index)\n ? { 'aria-current': 'page' as const }\n : { type: 'button' as const, onClick: () => onCrumbClick?.(crumb) })}\n className={`${getLabelClassNames(index)}${!isCurrentPage(index) ? ' cursor-pointer focus-outline' : ''}`}\n data-automation-id={crumb?.automationId || `breadcrumbs-item-${index}`}\n >\n {crumb?.label}\n </Tag>\n </li>\n );\n })}\n </ol>\n </nav>\n );\n};\n"],"names":["BreadCrumbs","crumbs","onCrumbClick","className","ariaLabel","shouldShowDropdown","length","visibleCrumbs","slice","dropdownCrumbs","isCurrentPage","index","getLabelClassNames","React","createElement","Popover","position","noBorder","renderPopoverSrcElement","displayPopover","Icon","name","renderPopoverContents","closePopoverCb","MenuList","items","map","crumb","id","String","label","onClick","Tag","key","rotation","_extends","type","automationId"],"mappings":";;;;;;;;;;;;;;AAqBO,MAAMA,IAA0CA,CAAC;AAAA,EAAEC,QAAAA;AAAAA,EAAQC,cAAAA;AAAAA,EAAcC,WAAAA;AAAAA,EAAWC,WAAAA,IAAY;AAAa,MAAM;AAClHC,QAAAA,IAAqBJ,GAAQK,SAAS,GACtCC,IAAgBF,IAAqBJ,GAAQO,MAAM,EAAE,IAAIP,GACzDQ,IAAiBJ,IAAqBJ,GAAQO,MAAM,GAAG,EAAE,IAAI,IAE7DE,IAAgBA,CAACC,MAAkBA,MAAUJ,GAAeD,SAAS,GAErEM,IAAqBA,CAACD,MAAkB;AAC5C,UAAMR,IAAY;AACdI,WAAAA,GAAeD,WAAW,IACrB,GAAGH,CAAS,kBAEjBO,EAAcC,CAAK,IACd,GAAGR,CAAS,uBAEd,GAAGA,CAAS;AAAA,EAAA;AAInBU,SAAAA,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKX,WAAW,2CAA2CA,CAAS;AAAA,IAAI,cAAYC;AAAAA,IAAW,sBAAmB;AAAA,EAAA,GAC/GK,GAAgBH,SAAS,KACxBO,gBAAAA,EAAAC,cAACC,GAAO;AAAA,IACNZ,WAAU;AAAA,IACVa,UAAS;AAAA,IACTC,UAAQ;AAAA,IACRb,WAAU;AAAA,IACVc,yBAAyBA,CAAC;AAAA,MAAEC,gBAAAA;AAAAA,IAAAA,MAExBN,gBAAAA,EAAAC,cAAA,OAAA;AAAA,MACEX,WAAW,kFACTgB,IAAiB,+BAA+B,EAAE;AAAA,MAEpD,sBAAmB;AAAA,IAAA,GAEnBL,gBAAAA,EAAAA,cAACM,GAAI;AAAA,MAACC,MAAK;AAAA,IAAc,CAAA,CACtB;AAAA,IAGTC,uBAAuBA,CAAC;AAAA,MAAEC,gBAAAA;AAAAA,IAAAA,MACxBT,gBAAAA,EAAAA,cAACU,GAAQ;AAAA,MACPC,OAAOhB,EAAeiB,IAAKC,CAAWA,OAAA;AAAA,QACpCC,IAAIC,OAAOF,GAAOC,EAAE;AAAA,QACpBE,OAAOH,GAAOG;AAAAA,QACdC,SAASA,MAAM;AACb7B,UAAAA,IAAeyB,CAAK,GACLJ;QACjB;AAAA,MAAA,EACA;AAAA,IAAA,CACH;AAAA,EAAA,CAEJ,GAEHT,gBAAAA,EAAAA,cAAA,MAAA;AAAA,IAAIX,WAAU;AAAA,EACXI,GAAAA,GAAemB,IAAI,CAACC,GAAOhB,MAAU;AACpC,UAAMqB,IAAMtB,EAAcC,CAAK,IAAI,SAAS;AAE1CE,WAAAA,gBAAAA,EAAAC,cAAA,MAAA;AAAA,MAAImB,KAAKN,GAAOC;AAAAA,MAAIzB,WAAU;AAAA,IAAA,IAC1BQ,IAAQ,KAAKN,MAAuBQ,gBAAAA,EAAAC,cAACM,GAAI;AAAA,MAACC,MAAK;AAAA,MAAUa,UAAU;AAAA,IAAA,CAAQ,GAC7ErB,gBAAAA,EAAAC,cAACkB,GAAGG,EACGzB,IAAAA,EAAcC,CAAK,IACpB;AAAA,MAAE,gBAAgB;AAAA,IAAA,IAClB;AAAA,MAAEyB,MAAM;AAAA,MAAmBL,SAASA,MAAM7B,IAAeyB,CAAK;AAAA,IAAA,GAAG;AAAA,MACrExB,WAAW,GAAGS,EAAmBD,CAAK,CAAC,GAAID,EAAcC,CAAK,IAAsC,KAAlC,+BAAoC;AAAA,MACtG,sBAAoBgB,GAAOU,gBAAgB,oBAAoB1B,CAAK;AAAA,IAAA,CAAG,GAEtEgB,GAAOG,KACL,CACH;AAAA,EAEP,CAAA,CACC,CACD;AAET;"}
|
package/dist/index5.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
1
|
+
import $ from "./index72.js";
|
|
2
|
+
import C from "./index73.js";
|
|
3
|
+
import L from "./index74.js";
|
|
4
|
+
import O from "./index75.js";
|
|
5
|
+
import E from "./index76.js";
|
|
6
|
+
import S from "./index77.js";
|
|
7
|
+
import j from "./index78.js";
|
|
8
8
|
import F from "./index79.js";
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
9
|
+
import M from "./index80.js";
|
|
10
|
+
import R from "./index81.js";
|
|
11
|
+
import B from "./index82.js";
|
|
12
12
|
import q from "./index83.js";
|
|
13
13
|
import D from "./index84.js";
|
|
14
14
|
import G from "./index85.js";
|
|
@@ -33,8 +33,8 @@ import rs from "./index103.js";
|
|
|
33
33
|
import es from "./index104.js";
|
|
34
34
|
import cs from "./index105.js";
|
|
35
35
|
import as from "./index106.js";
|
|
36
|
-
import
|
|
37
|
-
import
|
|
36
|
+
import gs from "./index107.js";
|
|
37
|
+
import ms from "./index108.js";
|
|
38
38
|
import vs from "./index109.js";
|
|
39
39
|
import ns from "./index110.js";
|
|
40
40
|
import ls from "./index111.js";
|
|
@@ -45,24 +45,24 @@ import ds from "./index115.js";
|
|
|
45
45
|
import us from "./index116.js";
|
|
46
46
|
import hs from "./index117.js";
|
|
47
47
|
import ks from "./index118.js";
|
|
48
|
-
import
|
|
49
|
-
import
|
|
48
|
+
import As from "./index119.js";
|
|
49
|
+
import xs from "./index120.js";
|
|
50
50
|
import ws from "./index121.js";
|
|
51
51
|
import ys from "./index122.js";
|
|
52
52
|
import Ps from "./index123.js";
|
|
53
53
|
import Is from "./index124.js";
|
|
54
54
|
import Ns from "./index125.js";
|
|
55
|
-
import
|
|
56
|
-
import
|
|
57
|
-
import
|
|
58
|
-
import
|
|
59
|
-
import
|
|
60
|
-
import
|
|
61
|
-
import
|
|
55
|
+
import $s from "./index126.js";
|
|
56
|
+
import Cs from "./index127.js";
|
|
57
|
+
import Ls from "./index128.js";
|
|
58
|
+
import Os from "./index129.js";
|
|
59
|
+
import Es from "./index130.js";
|
|
60
|
+
import Ss from "./index131.js";
|
|
61
|
+
import js from "./index132.js";
|
|
62
62
|
import Fs from "./index133.js";
|
|
63
|
-
import
|
|
64
|
-
import
|
|
65
|
-
import
|
|
63
|
+
import Ms from "./index134.js";
|
|
64
|
+
import Rs from "./index135.js";
|
|
65
|
+
import Bs from "./index136.js";
|
|
66
66
|
import qs from "./index137.js";
|
|
67
67
|
import Ds from "./index138.js";
|
|
68
68
|
import Gs from "./index139.js";
|
|
@@ -87,8 +87,8 @@ import ro from "./index157.js";
|
|
|
87
87
|
import eo from "./index158.js";
|
|
88
88
|
import co from "./index159.js";
|
|
89
89
|
import ao from "./index160.js";
|
|
90
|
-
import
|
|
91
|
-
import
|
|
90
|
+
import go from "./index161.js";
|
|
91
|
+
import mo from "./index162.js";
|
|
92
92
|
import vo from "./index163.js";
|
|
93
93
|
import no from "./index164.js";
|
|
94
94
|
import lo from "./index165.js";
|
|
@@ -98,21 +98,24 @@ import po from "./index168.js";
|
|
|
98
98
|
import uo from "./index169.js";
|
|
99
99
|
import ho from "./index170.js";
|
|
100
100
|
import ko from "./index171.js";
|
|
101
|
-
import
|
|
102
|
-
import
|
|
101
|
+
import Ao from "./index172.js";
|
|
102
|
+
import xo from "./index173.js";
|
|
103
103
|
import wo from "./index174.js";
|
|
104
104
|
import yo from "./index175.js";
|
|
105
105
|
import Po from "./index176.js";
|
|
106
106
|
import Io from "./index177.js";
|
|
107
107
|
import No from "./index178.js";
|
|
108
|
-
import
|
|
109
|
-
import
|
|
110
|
-
import
|
|
111
|
-
import
|
|
112
|
-
import
|
|
113
|
-
import
|
|
114
|
-
import
|
|
115
|
-
import
|
|
108
|
+
import $o from "./index179.js";
|
|
109
|
+
import Co from "./index180.js";
|
|
110
|
+
import Lo from "./index181.js";
|
|
111
|
+
import Oo from "./index182.js";
|
|
112
|
+
import Eo from "./index183.js";
|
|
113
|
+
import So from "./index184.js";
|
|
114
|
+
import jo from "./index185.js";
|
|
115
|
+
import g from "react";
|
|
116
|
+
import { ReactSVG as Fo } from "./index186.js";
|
|
117
|
+
import { getA11yNameAttributes as Mo } from "./index70.js";
|
|
118
|
+
import { useAccessiblePress as Ro } from "./index66.js";
|
|
116
119
|
function c() {
|
|
117
120
|
return c = Object.assign ? Object.assign.bind() : function(s) {
|
|
118
121
|
for (var o = 1; o < arguments.length; o++) {
|
|
@@ -122,123 +125,126 @@ function c() {
|
|
|
122
125
|
return s;
|
|
123
126
|
}, c.apply(null, arguments);
|
|
124
127
|
}
|
|
125
|
-
const
|
|
126
|
-
"/src/assets/icons/ai-off.svg":
|
|
127
|
-
"/src/assets/icons/ai-search.svg":
|
|
128
|
-
"/src/assets/icons/ai-stars.svg":
|
|
129
|
-
"/src/assets/icons/ai.svg":
|
|
130
|
-
"/src/assets/icons/all-space.svg":
|
|
131
|
-
"/src/assets/icons/arrow-head.svg":
|
|
132
|
-
"/src/assets/icons/attachment.svg":
|
|
128
|
+
const Bo = /* @__PURE__ */ Object.assign({
|
|
129
|
+
"/src/assets/icons/ai-off.svg": $,
|
|
130
|
+
"/src/assets/icons/ai-search.svg": C,
|
|
131
|
+
"/src/assets/icons/ai-stars.svg": L,
|
|
132
|
+
"/src/assets/icons/ai.svg": O,
|
|
133
|
+
"/src/assets/icons/all-space.svg": E,
|
|
134
|
+
"/src/assets/icons/arrow-head.svg": S,
|
|
135
|
+
"/src/assets/icons/attachment.svg": j,
|
|
133
136
|
"/src/assets/icons/back.svg": F,
|
|
134
|
-
"/src/assets/icons/banner-demo-img.svg":
|
|
135
|
-
"/src/assets/icons/bell-notification.svg":
|
|
136
|
-
"/src/assets/icons/card.svg":
|
|
137
|
-
"/src/assets/icons/
|
|
138
|
-
"/src/assets/icons/checkbox-disabled-
|
|
139
|
-
"/src/assets/icons/checkbox-disabled.svg": G,
|
|
140
|
-
"/src/assets/icons/checkbox-
|
|
141
|
-
"/src/assets/icons/checkbox-
|
|
142
|
-
"/src/assets/icons/checkbox-
|
|
143
|
-
"/src/assets/icons/checkbox-hover-
|
|
144
|
-
"/src/assets/icons/checkbox-hover-
|
|
145
|
-
"/src/assets/icons/checkbox-
|
|
146
|
-
"/src/assets/icons/checkbox-
|
|
147
|
-
"/src/assets/icons/
|
|
148
|
-
"/src/assets/icons/
|
|
149
|
-
"/src/assets/icons/
|
|
150
|
-
"/src/assets/icons/
|
|
151
|
-
"/src/assets/icons/
|
|
152
|
-
"/src/assets/icons/
|
|
153
|
-
"/src/assets/icons/
|
|
154
|
-
"/src/assets/icons/csv.svg": _s,
|
|
155
|
-
"/src/assets/icons/
|
|
156
|
-
"/src/assets/icons/
|
|
157
|
-
"/src/assets/icons/
|
|
158
|
-
"/src/assets/icons/
|
|
159
|
-
"/src/assets/icons/
|
|
160
|
-
"/src/assets/icons/
|
|
137
|
+
"/src/assets/icons/banner-demo-img.svg": M,
|
|
138
|
+
"/src/assets/icons/bell-notification.svg": R,
|
|
139
|
+
"/src/assets/icons/card.svg": B,
|
|
140
|
+
"/src/assets/icons/center-align.svg": q,
|
|
141
|
+
"/src/assets/icons/checkbox-disabled-minus.svg": D,
|
|
142
|
+
"/src/assets/icons/checkbox-disabled-tick.svg": G,
|
|
143
|
+
"/src/assets/icons/checkbox-disabled.svg": T,
|
|
144
|
+
"/src/assets/icons/checkbox-field.svg": V,
|
|
145
|
+
"/src/assets/icons/checkbox-fill.svg": H,
|
|
146
|
+
"/src/assets/icons/checkbox-hover-fill.svg": J,
|
|
147
|
+
"/src/assets/icons/checkbox-hover-minus.svg": K,
|
|
148
|
+
"/src/assets/icons/checkbox-hover-tick.svg": Q,
|
|
149
|
+
"/src/assets/icons/checkbox-minus.svg": U,
|
|
150
|
+
"/src/assets/icons/checkbox-tick.svg": W,
|
|
151
|
+
"/src/assets/icons/checked-circle.svg": X,
|
|
152
|
+
"/src/assets/icons/checkmark.svg": Y,
|
|
153
|
+
"/src/assets/icons/chevron.svg": Z,
|
|
154
|
+
"/src/assets/icons/clock.svg": z,
|
|
155
|
+
"/src/assets/icons/close.svg": ss,
|
|
156
|
+
"/src/assets/icons/command.svg": os,
|
|
157
|
+
"/src/assets/icons/csv-file.svg": _s,
|
|
158
|
+
"/src/assets/icons/csv.svg": ts,
|
|
159
|
+
"/src/assets/icons/date-field.svg": is,
|
|
160
|
+
"/src/assets/icons/delete.svg": rs,
|
|
161
|
+
"/src/assets/icons/doc-file.svg": es,
|
|
162
|
+
"/src/assets/icons/docFile.svg": cs,
|
|
163
|
+
"/src/assets/icons/download.svg": as,
|
|
164
|
+
"/src/assets/icons/edit-text.svg": gs,
|
|
161
165
|
"/src/assets/icons/email-field.svg": ms,
|
|
162
|
-
"/src/assets/icons/email.svg":
|
|
163
|
-
"/src/assets/icons/fields-create.svg":
|
|
164
|
-
"/src/assets/icons/fields-panel.svg":
|
|
165
|
-
"/src/assets/icons/file-empty.svg":
|
|
166
|
-
"/src/assets/icons/file-red.svg":
|
|
167
|
-
"/src/assets/icons/file.svg":
|
|
168
|
-
"/src/assets/icons/fill-and-sign.svg":
|
|
169
|
-
"/src/assets/icons/filter.svg":
|
|
170
|
-
"/src/assets/icons/folder-empty.svg":
|
|
171
|
-
"/src/assets/icons/folder.svg":
|
|
172
|
-
"/src/assets/icons/gmail.svg":
|
|
166
|
+
"/src/assets/icons/email.svg": vs,
|
|
167
|
+
"/src/assets/icons/fields-create.svg": ns,
|
|
168
|
+
"/src/assets/icons/fields-panel.svg": ls,
|
|
169
|
+
"/src/assets/icons/file-empty.svg": fs,
|
|
170
|
+
"/src/assets/icons/file-red.svg": bs,
|
|
171
|
+
"/src/assets/icons/file.svg": ps,
|
|
172
|
+
"/src/assets/icons/fill-and-sign.svg": ds,
|
|
173
|
+
"/src/assets/icons/filter.svg": us,
|
|
174
|
+
"/src/assets/icons/folder-empty.svg": hs,
|
|
175
|
+
"/src/assets/icons/folder.svg": ks,
|
|
176
|
+
"/src/assets/icons/gmail.svg": As,
|
|
173
177
|
"/src/assets/icons/google-drive.svg": xs,
|
|
174
|
-
"/src/assets/icons/hamburger.svg":
|
|
175
|
-
"/src/assets/icons/hashtag.svg":
|
|
176
|
-
"/src/assets/icons/help-question.svg":
|
|
177
|
-
"/src/assets/icons/history.svg":
|
|
178
|
-
"/src/assets/icons/home.svg":
|
|
179
|
-
"/src/assets/icons/hourglass.svg":
|
|
178
|
+
"/src/assets/icons/hamburger.svg": ws,
|
|
179
|
+
"/src/assets/icons/hashtag.svg": ys,
|
|
180
|
+
"/src/assets/icons/help-question.svg": Ps,
|
|
181
|
+
"/src/assets/icons/history.svg": Is,
|
|
182
|
+
"/src/assets/icons/home.svg": Ns,
|
|
183
|
+
"/src/assets/icons/hourglass.svg": $s,
|
|
180
184
|
"/src/assets/icons/image-field.svg": Cs,
|
|
181
|
-
"/src/assets/icons/info.svg":
|
|
182
|
-
"/src/assets/icons/initials-field.svg":
|
|
183
|
-
"/src/assets/icons/kebab-menu.svg":
|
|
184
|
-
"/src/assets/icons/
|
|
185
|
-
"/src/assets/icons/
|
|
186
|
-
"/src/assets/icons/
|
|
187
|
-
"/src/assets/icons/
|
|
188
|
-
"/src/assets/icons/
|
|
189
|
-
"/src/assets/icons/
|
|
190
|
-
"/src/assets/icons/
|
|
191
|
-
"/src/assets/icons/
|
|
192
|
-
"/src/assets/icons/
|
|
193
|
-
"/src/assets/icons/
|
|
194
|
-
"/src/assets/icons/
|
|
195
|
-
"/src/assets/icons/
|
|
196
|
-
"/src/assets/icons/
|
|
197
|
-
"/src/assets/icons/
|
|
198
|
-
"/src/assets/icons/
|
|
199
|
-
"/src/assets/icons/
|
|
200
|
-
"/src/assets/icons/radio-
|
|
201
|
-
"/src/assets/icons/radio.svg":
|
|
202
|
-
"/src/assets/icons/
|
|
203
|
-
"/src/assets/icons/
|
|
204
|
-
"/src/assets/icons/
|
|
205
|
-
"/src/assets/icons/
|
|
206
|
-
"/src/assets/icons/
|
|
207
|
-
"/src/assets/icons/
|
|
208
|
-
"/src/assets/icons/
|
|
209
|
-
"/src/assets/icons/
|
|
210
|
-
"/src/assets/icons/
|
|
211
|
-
"/src/assets/icons/
|
|
212
|
-
"/src/assets/icons/
|
|
213
|
-
"/src/assets/icons/
|
|
214
|
-
"/src/assets/icons/
|
|
215
|
-
"/src/assets/icons/
|
|
216
|
-
"/src/assets/icons/
|
|
217
|
-
"/src/assets/icons/
|
|
218
|
-
"/src/assets/icons/
|
|
219
|
-
"/src/assets/icons/
|
|
220
|
-
"/src/assets/icons/
|
|
221
|
-
"/src/assets/icons/
|
|
222
|
-
"/src/assets/icons/
|
|
223
|
-
"/src/assets/icons/sort.svg":
|
|
224
|
-
"/src/assets/icons/
|
|
225
|
-
"/src/assets/icons/
|
|
226
|
-
"/src/assets/icons/
|
|
227
|
-
"/src/assets/icons/
|
|
228
|
-
"/src/assets/icons/
|
|
229
|
-
"/src/assets/icons/
|
|
230
|
-
"/src/assets/icons/
|
|
231
|
-
"/src/assets/icons/
|
|
232
|
-
"/src/assets/icons/
|
|
233
|
-
"/src/assets/icons/
|
|
234
|
-
"/src/assets/icons/
|
|
235
|
-
"/src/assets/icons/
|
|
236
|
-
"/src/assets/icons/widget
|
|
237
|
-
|
|
185
|
+
"/src/assets/icons/info.svg": Ls,
|
|
186
|
+
"/src/assets/icons/initials-field.svg": Os,
|
|
187
|
+
"/src/assets/icons/kebab-menu.svg": Es,
|
|
188
|
+
"/src/assets/icons/left-align.svg": Ss,
|
|
189
|
+
"/src/assets/icons/library.svg": js,
|
|
190
|
+
"/src/assets/icons/minus.svg": Fs,
|
|
191
|
+
"/src/assets/icons/move-folder.svg": Ms,
|
|
192
|
+
"/src/assets/icons/name-field.svg": Rs,
|
|
193
|
+
"/src/assets/icons/next.svg": Bs,
|
|
194
|
+
"/src/assets/icons/observer.svg": qs,
|
|
195
|
+
"/src/assets/icons/office-building.svg": Ds,
|
|
196
|
+
"/src/assets/icons/onedrive.svg": Gs,
|
|
197
|
+
"/src/assets/icons/outlook.svg": Ts,
|
|
198
|
+
"/src/assets/icons/padlock.svg": Vs,
|
|
199
|
+
"/src/assets/icons/pages.svg": Hs,
|
|
200
|
+
"/src/assets/icons/pdf-file.svg": Js,
|
|
201
|
+
"/src/assets/icons/people.svg": Ks,
|
|
202
|
+
"/src/assets/icons/photo.svg": Qs,
|
|
203
|
+
"/src/assets/icons/plus.svg": Us,
|
|
204
|
+
"/src/assets/icons/radio-field.svg": Ws,
|
|
205
|
+
"/src/assets/icons/radio-filled.svg": Xs,
|
|
206
|
+
"/src/assets/icons/radio.svg": Ys,
|
|
207
|
+
"/src/assets/icons/reports.svg": Zs,
|
|
208
|
+
"/src/assets/icons/repository.svg": zs,
|
|
209
|
+
"/src/assets/icons/reset.svg": so,
|
|
210
|
+
"/src/assets/icons/return.svg": oo,
|
|
211
|
+
"/src/assets/icons/right-align.svg": _o,
|
|
212
|
+
"/src/assets/icons/rightSide.svg": to,
|
|
213
|
+
"/src/assets/icons/rotate-left.svg": io,
|
|
214
|
+
"/src/assets/icons/rotate-right.svg": ro,
|
|
215
|
+
"/src/assets/icons/rounded-plus.svg": eo,
|
|
216
|
+
"/src/assets/icons/search.svg": co,
|
|
217
|
+
"/src/assets/icons/select-files.svg": ao,
|
|
218
|
+
"/src/assets/icons/shield-with-tick.svg": go,
|
|
219
|
+
"/src/assets/icons/shield.svg": mo,
|
|
220
|
+
"/src/assets/icons/shipment-private.svg": vo,
|
|
221
|
+
"/src/assets/icons/shipment.svg": no,
|
|
222
|
+
"/src/assets/icons/sidebar.svg": lo,
|
|
223
|
+
"/src/assets/icons/signature-field.svg": fo,
|
|
224
|
+
"/src/assets/icons/signer.svg": bo,
|
|
225
|
+
"/src/assets/icons/slideout.svg": po,
|
|
226
|
+
"/src/assets/icons/sms.svg": uo,
|
|
227
|
+
"/src/assets/icons/sort-asc.svg": ho,
|
|
228
|
+
"/src/assets/icons/sort-desc.svg": ko,
|
|
229
|
+
"/src/assets/icons/sort.svg": Ao,
|
|
230
|
+
"/src/assets/icons/space.svg": xo,
|
|
231
|
+
"/src/assets/icons/stamp-field.svg": wo,
|
|
232
|
+
"/src/assets/icons/stop.svg": yo,
|
|
233
|
+
"/src/assets/icons/success-check.svg": Po,
|
|
234
|
+
"/src/assets/icons/tag.svg": Io,
|
|
235
|
+
"/src/assets/icons/text-field.svg": No,
|
|
236
|
+
"/src/assets/icons/tick.svg": $o,
|
|
237
|
+
"/src/assets/icons/title-field.svg": Co,
|
|
238
|
+
"/src/assets/icons/upload-csv.svg": Lo,
|
|
239
|
+
"/src/assets/icons/warning.svg": Oo,
|
|
240
|
+
"/src/assets/icons/webinar-widget.svg": Eo,
|
|
241
|
+
"/src/assets/icons/white-close.svg": So,
|
|
242
|
+
"/src/assets/icons/widget-demo-image.svg": jo
|
|
243
|
+
}), m = (s, o, t, _) => {
|
|
238
244
|
o && s.hasAttribute("fill") && s.getAttribute("fill") !== "none" && s.setAttribute("fill", o), t && s.hasAttribute("stroke") && s.setAttribute("stroke", t), _ && s.hasAttribute("width") && s.setAttribute("width", _.toString()), _ && s.hasAttribute("height") && s.setAttribute("height", _.toString()), Array.from(s.children).forEach((i) => {
|
|
239
|
-
|
|
245
|
+
m(i, o, t);
|
|
240
246
|
});
|
|
241
|
-
},
|
|
247
|
+
}, Wt = (s) => {
|
|
242
248
|
const {
|
|
243
249
|
name: o = "",
|
|
244
250
|
className: t = "",
|
|
@@ -254,7 +260,7 @@ const Fo = /* @__PURE__ */ Object.assign({
|
|
|
254
260
|
rotation: u = "0",
|
|
255
261
|
size: h,
|
|
256
262
|
shouldStopPropagation: k = !1
|
|
257
|
-
} = s,
|
|
263
|
+
} = s, A = {
|
|
258
264
|
0: "rotate-0",
|
|
259
265
|
45: "rotate-45",
|
|
260
266
|
90: "rotate-90",
|
|
@@ -263,19 +269,19 @@ const Fo = /* @__PURE__ */ Object.assign({
|
|
|
263
269
|
225: "rotate-[225deg]",
|
|
264
270
|
270: "-rotate-90",
|
|
265
271
|
315: "-rotate-45"
|
|
266
|
-
}, a =
|
|
272
|
+
}, a = Bo[`/src/assets/icons/${o}.svg`];
|
|
267
273
|
if (!a)
|
|
268
274
|
return console.error(`Icon "${o}" not found in ICON_MAP.`), null;
|
|
269
|
-
const r = typeof _ == "function",
|
|
275
|
+
const r = typeof _ == "function", x = i || o, {
|
|
270
276
|
pressProps: w,
|
|
271
277
|
role: y,
|
|
272
278
|
tabIndex: P
|
|
273
|
-
} =
|
|
279
|
+
} = Ro({
|
|
274
280
|
isNative: !1,
|
|
275
281
|
onClick: r ? () => _?.() : void 0,
|
|
276
282
|
stopPropagation: k
|
|
277
|
-
}), I =
|
|
278
|
-
ariaLabel:
|
|
283
|
+
}), I = Mo({
|
|
284
|
+
ariaLabel: x,
|
|
279
285
|
ariaLabelledBy: v,
|
|
280
286
|
ariaDescribedBy: n
|
|
281
287
|
}), N = r ? {
|
|
@@ -287,20 +293,20 @@ const Fo = /* @__PURE__ */ Object.assign({
|
|
|
287
293
|
"aria-expanded": f,
|
|
288
294
|
"aria-controls": b || void 0
|
|
289
295
|
} : void 0;
|
|
290
|
-
return /* @__PURE__ */
|
|
291
|
-
className: `se-design-svg-wrapper transition-transform duration-250 ease-linear rounded-[3px] ${r ? "cursor-pointer focus-outline" : ""} ${t} ${
|
|
296
|
+
return /* @__PURE__ */ g.createElement("div", c({
|
|
297
|
+
className: `se-design-svg-wrapper transition-transform duration-250 ease-linear rounded-[3px] ${r ? "cursor-pointer focus-outline" : ""} ${t} ${A[u]}`,
|
|
292
298
|
"aria-hidden": r ? void 0 : "true"
|
|
293
299
|
}, N, {
|
|
294
300
|
"data-automation-id": s?.automationId
|
|
295
|
-
}), /* @__PURE__ */
|
|
301
|
+
}), /* @__PURE__ */ g.createElement(Fo, {
|
|
296
302
|
src: a,
|
|
297
303
|
wrapper: "span",
|
|
298
304
|
beforeInjection: (e) => {
|
|
299
|
-
e.setAttribute("aria-hidden", "true"), e.setAttribute("role", "none"),
|
|
305
|
+
e.setAttribute("aria-hidden", "true"), e.setAttribute("role", "none"), m(e, p, d, h);
|
|
300
306
|
}
|
|
301
307
|
}));
|
|
302
308
|
};
|
|
303
309
|
export {
|
|
304
|
-
|
|
310
|
+
Wt as Icon
|
|
305
311
|
};
|
|
306
312
|
//# sourceMappingURL=index5.js.map
|
package/dist/index5.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index5.js","sources":["../src/components/Icon/index.tsx"],"sourcesContent":["// TODO: `applyAttributesToElement` recursion drops `size` for nested elements (pre-existing).\nimport React, { FC } from 'react';\nimport { ReactSVG } from 'react-svg';\nimport { getA11yNameAttributes, useAccessiblePress } from '../../utils/a11y';\n\n// Dynamically import icons using Vite's asset handling\nconst ICON_MAP: Record<string, string> = (import.meta as any).glob('/src/assets/icons/*.svg', {\n eager: true,\n query: '?url',\n import: 'default'\n});\n\nexport type RotationTypes = '0' | '45' | '90' | '135' | '180' | '225' | '270' | '315';\n\nexport type IconProps = {\n name: string;\n className?: string;\n onClick?: () => void;\n /**\n * Accessible name when Icon is interactive (onClick is provided).\n * If omitted, we fall back to `name` and warn in development.\n */\n ariaLabel?: string;\n /**\n * ID(s) of visible element(s) that label this Icon when interactive.\n * Preferred over ariaLabel when a visible label exists (keeps SR and visual text in sync).\n */\n ariaLabelledBy?: string;\n /**\n * ID(s) of element(s) that describe this Icon when interactive (additional context).\n */\n ariaDescribedBy?: string;\n /**\n * Toggle state when Icon is used as a button (e.g., show/hide sidebar).\n * Only applies when `onClick` is provided (interactive icon).\n */\n ariaPressed?: boolean;\n /**\n * Expansion state when Icon controls a collapsible region/panel.\n * Only applies when `onClick` is provided (interactive icon).\n */\n ariaExpanded?: boolean;\n /**\n * ID of the element controlled by this Icon (for aria-controls).\n * Only applies when `onClick` is provided (interactive icon).\n */\n ariaControls?: string;\n fill?: string;\n stroke?: string;\n rotation?: RotationTypes;\n size?: number;\n shouldStopPropagation?: boolean;\n automationId?: string;\n};\n\nconst applyAttributesToElement = (element: Element, fill?: string, stroke?: string, size?: number) => {\n // Only modify existing attributes\n if (fill && element.hasAttribute('fill')) {\n const currentFill = element.getAttribute('fill');\n // Only update if the current fill is not \"none\"\n if (currentFill !== 'none') {\n element.setAttribute('fill', fill);\n }\n }\n\n if (stroke && element.hasAttribute('stroke')) {\n element.setAttribute('stroke', stroke);\n }\n\n if (size && element.hasAttribute('width')) {\n element.setAttribute('width', size.toString());\n }\n\n if (size && element.hasAttribute('height')) {\n element.setAttribute('height', size.toString());\n }\n\n // Recursively apply to all child elements\n Array.from(element.children).forEach((child) => {\n applyAttributesToElement(child, fill, stroke);\n });\n};\n\nexport const Icon: FC<IconProps> = (props) => {\n const {\n name = '',\n className = '',\n onClick,\n ariaLabel,\n ariaLabelledBy,\n ariaDescribedBy,\n ariaPressed,\n ariaExpanded,\n ariaControls,\n fill,\n stroke,\n rotation = '0',\n size,\n shouldStopPropagation = false\n } = props;\n const iconRotationClasses = {\n '0': 'rotate-0',\n '45': 'rotate-45',\n '90': 'rotate-90',\n '135': 'rotate-[135deg]',\n '180': 'rotate-180',\n '225': 'rotate-[225deg]',\n '270': '-rotate-90',\n '315': '-rotate-45'\n };\n const src = ICON_MAP[`/src/assets/icons/${name}.svg`];\n\n if (!src) {\n console.error(`Icon \"${name}\" not found in ICON_MAP.`);\n return null;\n }\n\n const isInteractive = typeof onClick === 'function';\n const computedAriaLabel = ariaLabel || name;\n\n if (isInteractive && !ariaLabel && (import.meta as { env?: { DEV?: boolean } }).env?.DEV) {\n // eslint-disable-next-line no-console\n console.warn(\n `[se-design/Icon] Missing ariaLabel for clickable icon \"${name}\". ` +\n `Falling back to aria-label=\"${computedAriaLabel}\".`\n );\n }\n\n const { pressProps, role, tabIndex } = useAccessiblePress({\n isNative: false,\n onClick: isInteractive ? () => onClick?.() : undefined,\n stopPropagation: shouldStopPropagation\n });\n\n // Compute accessible name/description props with correct precedence (aligns with Button/Link).\n const accessibleNameProps = getA11yNameAttributes({\n ariaLabel: computedAriaLabel,\n ariaLabelledBy,\n ariaDescribedBy\n });\n\n const interactiveProps = isInteractive\n ? {\n ...pressProps,\n role,\n tabIndex,\n ...accessibleNameProps,\n 'aria-pressed': ariaPressed,\n 'aria-expanded': ariaExpanded,\n 'aria-controls': ariaControls || undefined\n }\n : undefined;\n\n return (\n <div\n className={`se-design-svg-wrapper transition-transform duration-250 ease-linear rounded-[3px] ${\n isInteractive ? 'cursor-pointer focus-outline' : ''\n } ${className} ${iconRotationClasses[rotation]}`}\n aria-hidden={!isInteractive ? 'true' : undefined}\n {...interactiveProps}\n data-automation-id={props?.automationId}\n >\n <ReactSVG\n src={src}\n wrapper=\"span\"\n beforeInjection={(svg) => {\n svg.setAttribute('aria-hidden', 'true');\n svg.setAttribute('role', 'none');\n applyAttributesToElement(svg, fill, stroke, size);\n }}\n />\n </div>\n );\n};\n"],"names":["ICON_MAP","import","applyAttributesToElement","element","fill","stroke","size","hasAttribute","getAttribute","setAttribute","toString","Array","from","children","forEach","child","Icon","props","name","className","onClick","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaPressed","ariaExpanded","ariaControls","rotation","shouldStopPropagation","iconRotationClasses","src","console","error","isInteractive","computedAriaLabel","pressProps","role","tabIndex","useAccessiblePress","isNative","undefined","stopPropagation","accessibleNameProps","getA11yNameAttributes","interactiveProps","React","createElement","_extends","automationId","ReactSVG","wrapper","beforeInjection","svg"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index5.js","sources":["../src/components/Icon/index.tsx"],"sourcesContent":["// TODO: `applyAttributesToElement` recursion drops `size` for nested elements (pre-existing).\nimport React, { FC } from 'react';\nimport { ReactSVG } from 'react-svg';\nimport { getA11yNameAttributes, useAccessiblePress } from '../../utils/a11y';\n\n// Dynamically import icons using Vite's asset handling\nconst ICON_MAP: Record<string, string> = (import.meta as any).glob('/src/assets/icons/*.svg', {\n eager: true,\n query: '?url',\n import: 'default'\n});\n\nexport type RotationTypes = '0' | '45' | '90' | '135' | '180' | '225' | '270' | '315';\n\nexport type IconProps = {\n name: string;\n className?: string;\n onClick?: () => void;\n /**\n * Accessible name when Icon is interactive (onClick is provided).\n * If omitted, we fall back to `name` and warn in development.\n */\n ariaLabel?: string;\n /**\n * ID(s) of visible element(s) that label this Icon when interactive.\n * Preferred over ariaLabel when a visible label exists (keeps SR and visual text in sync).\n */\n ariaLabelledBy?: string;\n /**\n * ID(s) of element(s) that describe this Icon when interactive (additional context).\n */\n ariaDescribedBy?: string;\n /**\n * Toggle state when Icon is used as a button (e.g., show/hide sidebar).\n * Only applies when `onClick` is provided (interactive icon).\n */\n ariaPressed?: boolean;\n /**\n * Expansion state when Icon controls a collapsible region/panel.\n * Only applies when `onClick` is provided (interactive icon).\n */\n ariaExpanded?: boolean;\n /**\n * ID of the element controlled by this Icon (for aria-controls).\n * Only applies when `onClick` is provided (interactive icon).\n */\n ariaControls?: string;\n fill?: string;\n stroke?: string;\n rotation?: RotationTypes;\n size?: number;\n shouldStopPropagation?: boolean;\n automationId?: string;\n};\n\nconst applyAttributesToElement = (element: Element, fill?: string, stroke?: string, size?: number) => {\n // Only modify existing attributes\n if (fill && element.hasAttribute('fill')) {\n const currentFill = element.getAttribute('fill');\n // Only update if the current fill is not \"none\"\n if (currentFill !== 'none') {\n element.setAttribute('fill', fill);\n }\n }\n\n if (stroke && element.hasAttribute('stroke')) {\n element.setAttribute('stroke', stroke);\n }\n\n if (size && element.hasAttribute('width')) {\n element.setAttribute('width', size.toString());\n }\n\n if (size && element.hasAttribute('height')) {\n element.setAttribute('height', size.toString());\n }\n\n // Recursively apply to all child elements\n Array.from(element.children).forEach((child) => {\n applyAttributesToElement(child, fill, stroke);\n });\n};\n\nexport const Icon: FC<IconProps> = (props) => {\n const {\n name = '',\n className = '',\n onClick,\n ariaLabel,\n ariaLabelledBy,\n ariaDescribedBy,\n ariaPressed,\n ariaExpanded,\n ariaControls,\n fill,\n stroke,\n rotation = '0',\n size,\n shouldStopPropagation = false\n } = props;\n const iconRotationClasses = {\n '0': 'rotate-0',\n '45': 'rotate-45',\n '90': 'rotate-90',\n '135': 'rotate-[135deg]',\n '180': 'rotate-180',\n '225': 'rotate-[225deg]',\n '270': '-rotate-90',\n '315': '-rotate-45'\n };\n const src = ICON_MAP[`/src/assets/icons/${name}.svg`];\n\n if (!src) {\n console.error(`Icon \"${name}\" not found in ICON_MAP.`);\n return null;\n }\n\n const isInteractive = typeof onClick === 'function';\n const computedAriaLabel = ariaLabel || name;\n\n if (isInteractive && !ariaLabel && (import.meta as { env?: { DEV?: boolean } }).env?.DEV) {\n // eslint-disable-next-line no-console\n console.warn(\n `[se-design/Icon] Missing ariaLabel for clickable icon \"${name}\". ` +\n `Falling back to aria-label=\"${computedAriaLabel}\".`\n );\n }\n\n const { pressProps, role, tabIndex } = useAccessiblePress({\n isNative: false,\n onClick: isInteractive ? () => onClick?.() : undefined,\n stopPropagation: shouldStopPropagation\n });\n\n // Compute accessible name/description props with correct precedence (aligns with Button/Link).\n const accessibleNameProps = getA11yNameAttributes({\n ariaLabel: computedAriaLabel,\n ariaLabelledBy,\n ariaDescribedBy\n });\n\n const interactiveProps = isInteractive\n ? {\n ...pressProps,\n role,\n tabIndex,\n ...accessibleNameProps,\n 'aria-pressed': ariaPressed,\n 'aria-expanded': ariaExpanded,\n 'aria-controls': ariaControls || undefined\n }\n : undefined;\n\n return (\n <div\n className={`se-design-svg-wrapper transition-transform duration-250 ease-linear rounded-[3px] ${\n isInteractive ? 'cursor-pointer focus-outline' : ''\n } ${className} ${iconRotationClasses[rotation]}`}\n aria-hidden={!isInteractive ? 'true' : undefined}\n {...interactiveProps}\n data-automation-id={props?.automationId}\n >\n <ReactSVG\n src={src}\n wrapper=\"span\"\n beforeInjection={(svg) => {\n svg.setAttribute('aria-hidden', 'true');\n svg.setAttribute('role', 'none');\n applyAttributesToElement(svg, fill, stroke, size);\n }}\n />\n </div>\n );\n};\n"],"names":["ICON_MAP","import","applyAttributesToElement","element","fill","stroke","size","hasAttribute","getAttribute","setAttribute","toString","Array","from","children","forEach","child","Icon","props","name","className","onClick","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaPressed","ariaExpanded","ariaControls","rotation","shouldStopPropagation","iconRotationClasses","src","error","isInteractive","computedAriaLabel","pressProps","role","tabIndex","useAccessiblePress","isNative","undefined","stopPropagation","accessibleNameProps","getA11yNameAttributes","interactiveProps","React","createElement","_extends","automationId","ReactSVG","wrapper","beforeInjection","svg"],"mappings":"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"}
|