@salt-ds/core 1.32.0 → 1.33.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/css/salt-core.css +4 -3
- package/dist-cjs/accordion/AccordionContext.js +2 -2
- package/dist-cjs/aria-announcer/useAriaAnnouncer.js +2 -2
- package/dist-cjs/avatar/useAvatarImage.js +2 -2
- package/dist-cjs/breakpoints/BreakpointProvider.js +1 -1
- package/dist-cjs/checkbox/internal/CheckboxGroupContext.js +2 -2
- package/dist-cjs/combo-box/ComboBox.js +1 -0
- package/dist-cjs/combo-box/ComboBox.js.map +1 -1
- package/dist-cjs/combo-box/useComboBox.js +2 -2
- package/dist-cjs/dialog/Dialog.js +3 -1
- package/dist-cjs/dialog/Dialog.js.map +1 -1
- package/dist-cjs/dialog/DialogContent.js.map +1 -1
- package/dist-cjs/dropdown/Dropdown.js +1 -0
- package/dist-cjs/dropdown/Dropdown.js.map +1 -1
- package/dist-cjs/file-drop-zone/FileDropZoneTrigger.js +1 -1
- package/dist-cjs/form-field-context/FormFieldContext.js +2 -2
- package/dist-cjs/index.js +2 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCardGroupContext.js +2 -2
- package/dist-cjs/list-box/ListBox.css.js +1 -1
- package/dist-cjs/list-control/ListControlContext.js +2 -2
- package/dist-cjs/list-control/ListControlState.js +3 -3
- package/dist-cjs/list-control/ListControlState.js.map +1 -1
- package/dist-cjs/menu/MenuBase.js +4 -2
- package/dist-cjs/menu/MenuBase.js.map +1 -1
- package/dist-cjs/menu/MenuContext.js +2 -2
- package/dist-cjs/menu/MenuPanel.css.js +1 -1
- package/dist-cjs/menu/MenuPanelContext.js +2 -2
- package/dist-cjs/menu/MenuTrigger.js +1 -1
- package/dist-cjs/menu/MenuTriggerContext.js +2 -2
- package/dist-cjs/navigation-item/ExpansionIcon.js +3 -3
- package/dist-cjs/navigation-item/ExpansionIcon.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItem.js +17 -9
- package/dist-cjs/navigation-item/NavigationItem.js.map +1 -1
- package/dist-cjs/navigation-item/NavigationItemAction.js +117 -0
- package/dist-cjs/navigation-item/NavigationItemAction.js.map +1 -0
- package/dist-cjs/option/OptionList.css.js +1 -1
- package/dist-cjs/overlay/Overlay.js +1 -1
- package/dist-cjs/overlay/OverlayContext.js +2 -2
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayTrigger.js +1 -1
- package/dist-cjs/pagination/PageRanges.js +1 -1
- package/dist-cjs/parent-child-layout/useIsViewportLargerThanBreakpoint.js +2 -2
- package/dist-cjs/pill-input/useTruncatePills.js +2 -1
- package/dist-cjs/pill-input/useTruncatePills.js.map +1 -1
- package/dist-cjs/radio-button/internal/RadioGroupContext.js +2 -2
- package/dist-cjs/salt-provider/SaltProvider.js +2 -6
- package/dist-cjs/salt-provider/SaltProvider.js.map +1 -1
- package/dist-cjs/spinner/svgSpinners/SpinnerSVG.js +1 -1
- package/dist-cjs/tag/Tag.js +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroupContext.js +2 -2
- package/dist-cjs/tooltip/Tooltip.js +1 -1
- package/dist-cjs/tooltip/TooltipBase.js +1 -1
- package/dist-cjs/tooltip/useAriaAnnounce.js +1 -1
- package/dist-cjs/tooltip/useTooltip.js +2 -2
- package/dist-cjs/utils/renderProps.js +32 -0
- package/dist-cjs/utils/renderProps.js.map +1 -0
- package/dist-cjs/utils/useValueEffect.js +1 -1
- package/dist-cjs/viewport/ViewportProvider.js +1 -1
- package/dist-es/accordion/AccordionContext.js +2 -2
- package/dist-es/aria-announcer/useAriaAnnouncer.js +2 -2
- package/dist-es/avatar/useAvatarImage.js +2 -2
- package/dist-es/breakpoints/BreakpointProvider.js +1 -1
- package/dist-es/checkbox/internal/CheckboxGroupContext.js +2 -2
- package/dist-es/combo-box/ComboBox.js +2 -1
- package/dist-es/combo-box/ComboBox.js.map +1 -1
- package/dist-es/combo-box/useComboBox.js +2 -2
- package/dist-es/dialog/Dialog.js +3 -1
- package/dist-es/dialog/Dialog.js.map +1 -1
- package/dist-es/dialog/DialogContent.js.map +1 -1
- package/dist-es/dropdown/Dropdown.js +2 -1
- package/dist-es/dropdown/Dropdown.js.map +1 -1
- package/dist-es/file-drop-zone/FileDropZoneTrigger.js +1 -1
- package/dist-es/form-field-context/FormFieldContext.js +2 -2
- package/dist-es/index.js +1 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/interactable-card/InteractableCardGroupContext.js +2 -2
- package/dist-es/list-box/ListBox.css.js +1 -1
- package/dist-es/list-control/ListControlContext.js +2 -2
- package/dist-es/list-control/ListControlState.js +3 -3
- package/dist-es/list-control/ListControlState.js.map +1 -1
- package/dist-es/menu/MenuBase.js +4 -2
- package/dist-es/menu/MenuBase.js.map +1 -1
- package/dist-es/menu/MenuContext.js +2 -2
- package/dist-es/menu/MenuPanel.css.js +1 -1
- package/dist-es/menu/MenuPanelContext.js +2 -2
- package/dist-es/menu/MenuTrigger.js +1 -1
- package/dist-es/menu/MenuTriggerContext.js +2 -2
- package/dist-es/navigation-item/ExpansionIcon.js +3 -3
- package/dist-es/navigation-item/ExpansionIcon.js.map +1 -1
- package/dist-es/navigation-item/NavigationItem.js +17 -9
- package/dist-es/navigation-item/NavigationItem.js.map +1 -1
- package/dist-es/navigation-item/NavigationItemAction.js +113 -0
- package/dist-es/navigation-item/NavigationItemAction.js.map +1 -0
- package/dist-es/option/OptionList.css.js +1 -1
- package/dist-es/overlay/Overlay.js +1 -1
- package/dist-es/overlay/OverlayContext.js +2 -2
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayTrigger.js +1 -1
- package/dist-es/pagination/PageRanges.js +1 -1
- package/dist-es/parent-child-layout/useIsViewportLargerThanBreakpoint.js +2 -2
- package/dist-es/pill-input/useTruncatePills.js +2 -1
- package/dist-es/pill-input/useTruncatePills.js.map +1 -1
- package/dist-es/radio-button/internal/RadioGroupContext.js +2 -2
- package/dist-es/salt-provider/SaltProvider.js +3 -3
- package/dist-es/salt-provider/SaltProvider.js.map +1 -1
- package/dist-es/spinner/svgSpinners/SpinnerSVG.js +1 -1
- package/dist-es/tag/Tag.js +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroupContext.js +2 -2
- package/dist-es/tooltip/Tooltip.js +1 -1
- package/dist-es/tooltip/TooltipBase.js +1 -1
- package/dist-es/tooltip/useAriaAnnounce.js +1 -1
- package/dist-es/tooltip/useTooltip.js +2 -2
- package/dist-es/utils/renderProps.js +28 -0
- package/dist-es/utils/renderProps.js.map +1 -0
- package/dist-es/utils/useValueEffect.js +1 -1
- package/dist-es/viewport/ViewportProvider.js +1 -1
- package/dist-types/navigation-item/ExpansionIcon.d.ts +12 -2
- package/dist-types/navigation-item/NavigationItem.d.ts +5 -0
- package/dist-types/navigation-item/NavigationItemAction.d.ts +5 -0
- package/dist-types/overlay/OverlayContext.d.ts +3 -2
- package/dist-types/salt-provider/SaltProvider.d.ts +24 -4
- package/dist-types/utils/index.d.ts +1 -0
- package/dist-types/utils/renderProps.d.ts +5 -0
- package/package.json +1 -1
- package/dist-cjs/navigation-item/ConditionalWrapper.js +0 -36
- package/dist-cjs/navigation-item/ConditionalWrapper.js.map +0 -1
- package/dist-es/navigation-item/ConditionalWrapper.js +0 -32
- package/dist-es/navigation-item/ConditionalWrapper.js.map +0 -1
- package/dist-types/navigation-item/ConditionalWrapper.d.ts +0 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuBase.js","sources":["../src/menu/MenuBase.tsx"],"sourcesContent":["import {\n FloatingNode,\n type ReferenceType,\n flip,\n limitShift,\n offset,\n safePolygon,\n shift,\n size,\n useClick,\n useDismiss,\n useFloatingNodeId,\n useFloatingParentNodeId,\n useFloatingTree,\n useHover,\n useInteractions,\n useListNavigation,\n useRole,\n} from \"@floating-ui/react\";\nimport {\n type ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type UseFloatingUIProps,\n useControlled,\n useFloatingUI,\n useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { MenuContext } from \"./MenuContext\";\n\nexport interface MenuBaseProps {\n children?: ReactNode;\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * If true, the menu will be open by default.\n */\n defaultOpen?: boolean;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Set the placement of the Menu component relative to the trigger element. Defaults to `bottom-start` if it's the root menu or `right-start` if it's nested.\n */\n placement?: UseFloatingUIProps[\"placement\"];\n /**\n * Function that returns a [virtual element](https://floating-ui.com/docs/virtual-elements). If this is provided, it will override MenuTrigger.\n */\n getVirtualElement?: () => ReferenceType | null;\n}\n\nexport function MenuBase(props: MenuBaseProps) {\n const {\n children,\n defaultOpen,\n open,\n onOpenChange,\n placement,\n getVirtualElement,\n } = props;\n const parentId = useFloatingParentNodeId();\n const nodeId = useFloatingNodeId();\n const tree = useFloatingTree();\n const elementsRef = useRef<(HTMLDivElement | null)[]>([]);\n\n const [openState, setOpenState] = useControlled({\n controlled: open,\n default: Boolean(defaultOpen),\n name: \"ListControl\",\n state: \"open\",\n });\n\n const setOpen = useCallback(\n (newOpen: boolean) => {\n setOpenState(newOpen);\n onOpenChange?.(newOpen);\n },\n [onOpenChange],\n );\n\n const [activeIndex, setActiveIndex] = useState<number | null>(null);\n const [focusInside, setFocusInside] = useState(false);\n\n const isNested = parentId != null;\n\n const { x, y, strategy, elements, refs, context } = useFloatingUI({\n nodeId,\n open: openState,\n onOpenChange: setOpen,\n strategy: !getVirtualElement ? \"absolute\" : \"fixed\",\n placement:\n placement ??\n (isNested || getVirtualElement ? \"right-start\" : \"bottom-start\"),\n middleware: [\n // Align the nested menu by shifting it by var(--salt-size-border)\n offset(isNested ? { crossAxis: -1 } :
|
|
1
|
+
{"version":3,"file":"MenuBase.js","sources":["../src/menu/MenuBase.tsx"],"sourcesContent":["import {\n FloatingNode,\n type ReferenceType,\n flip,\n limitShift,\n offset,\n safePolygon,\n shift,\n size,\n useClick,\n useDismiss,\n useFloatingNodeId,\n useFloatingParentNodeId,\n useFloatingTree,\n useHover,\n useInteractions,\n useListNavigation,\n useRole,\n} from \"@floating-ui/react\";\nimport {\n type ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type UseFloatingUIProps,\n useControlled,\n useFloatingUI,\n useIsomorphicLayoutEffect,\n} from \"../utils\";\nimport { MenuContext } from \"./MenuContext\";\n\nexport interface MenuBaseProps {\n children?: ReactNode;\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * If true, the menu will be open by default.\n */\n defaultOpen?: boolean;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Set the placement of the Menu component relative to the trigger element. Defaults to `bottom-start` if it's the root menu or `right-start` if it's nested.\n */\n placement?: UseFloatingUIProps[\"placement\"];\n /**\n * Function that returns a [virtual element](https://floating-ui.com/docs/virtual-elements). If this is provided, it will override MenuTrigger.\n */\n getVirtualElement?: () => ReferenceType | null;\n}\n\nexport function MenuBase(props: MenuBaseProps) {\n const {\n children,\n defaultOpen,\n open,\n onOpenChange,\n placement,\n getVirtualElement,\n } = props;\n const parentId = useFloatingParentNodeId();\n const nodeId = useFloatingNodeId();\n const tree = useFloatingTree();\n const elementsRef = useRef<(HTMLDivElement | null)[]>([]);\n\n const [openState, setOpenState] = useControlled({\n controlled: open,\n default: Boolean(defaultOpen),\n name: \"ListControl\",\n state: \"open\",\n });\n\n const setOpen = useCallback(\n (newOpen: boolean) => {\n setOpenState(newOpen);\n onOpenChange?.(newOpen);\n },\n [onOpenChange],\n );\n\n const [activeIndex, setActiveIndex] = useState<number | null>(null);\n const [focusInside, setFocusInside] = useState(false);\n\n const isNested = parentId != null;\n\n const { x, y, strategy, elements, refs, context } = useFloatingUI({\n nodeId,\n open: openState,\n onOpenChange: setOpen,\n strategy: !getVirtualElement ? \"absolute\" : \"fixed\",\n placement:\n placement ??\n (isNested || getVirtualElement ? \"right-start\" : \"bottom-start\"),\n middleware: [\n // Align the nested menu by shifting it by var(--salt-size-border)\n offset(\n isNested ? { crossAxis: -1, mainAxis: 2 } : !getVirtualElement ? 1 : 0,\n ),\n flip({}),\n shift({ limiter: limitShift() }),\n size({\n apply({ elements, availableHeight }) {\n Object.assign(elements.floating.style, {\n maxHeight: `${availableHeight}px`,\n });\n },\n }),\n ],\n });\n\n useIsomorphicLayoutEffect(() => {\n if (getVirtualElement) {\n refs.setPositionReference(getVirtualElement());\n }\n }, [getVirtualElement, refs]);\n\n const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions(\n [\n useHover(context, {\n enabled: isNested && !focusInside,\n handleClose: safePolygon({ blockPointerEvents: true }),\n }),\n useClick(context, {\n event: \"mousedown\",\n toggle: !isNested,\n ignoreMouse: isNested,\n }),\n useRole(context, { role: \"menu\" }),\n useDismiss(context, { bubbles: true }),\n useListNavigation(context, {\n listRef: elementsRef,\n activeIndex,\n nested: isNested,\n onNavigate: setActiveIndex,\n }),\n ],\n );\n\n const getPanelPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n useEffect(() => {\n if (!tree) return;\n\n function handleItemClick() {\n setOpen(false);\n }\n\n tree.events.on(\"click\", handleItemClick);\n\n return () => {\n tree.events.off(\"click\", handleItemClick);\n };\n }, [tree, setOpen]);\n\n return (\n <FloatingNode id={nodeId}>\n <MenuContext.Provider\n value={{\n openState,\n getReferenceProps,\n getFloatingProps,\n refs,\n getPanelPosition,\n getItemProps,\n activeIndex,\n context,\n elementsRef,\n focusInside,\n setFocusInside,\n isNested,\n }}\n >\n {children}\n </MenuContext.Provider>\n </FloatingNode>\n );\n}\n"],"names":["elements"],"mappings":"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"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { useContext } from 'react';
|
|
2
2
|
import { createContext } from '../utils/createContext.js';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'clsx';
|
|
3
5
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
6
|
import '../utils/useId.js';
|
|
5
7
|
import '../salt-provider/SaltProvider.js';
|
|
6
8
|
import '../viewport/ViewportProvider.js';
|
|
7
|
-
import 'clsx';
|
|
8
9
|
import '../accordion/AccordionGroup.js';
|
|
9
10
|
import '../accordion/AccordionPanel.js';
|
|
10
11
|
import '../accordion/Accordion.js';
|
|
11
12
|
import '../accordion/AccordionHeader.js';
|
|
12
13
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
13
|
-
import 'react/jsx-runtime';
|
|
14
14
|
import '../avatar/Avatar.js';
|
|
15
15
|
import '../badge/Badge.js';
|
|
16
16
|
import '../banner/Banner.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltMenuPanel {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n min-width: 10em;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n}\n\n.saltMenuPanel-container {\n display: flex;\n flex-direction: column;\n gap: var(--salt-size-border);\n max-height: inherit;\n min-height: inherit;\n}\n\n.saltMenuPanel:focus-visible {\n outline: none;\n}\n";
|
|
1
|
+
var css_248z = ".saltMenuPanel {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n overflow: hidden;\n overflow-y: auto;\n min-width: 10em;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n border-radius: var(--salt-palette-corner, 0);\n}\n\n.saltMenuPanel-container {\n display: flex;\n flex-direction: column;\n gap: var(--salt-size-border);\n max-height: inherit;\n min-height: inherit;\n}\n\n.saltMenuPanel:focus-visible {\n outline: none;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=MenuPanel.css.js.map
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { useContext } from 'react';
|
|
2
2
|
import { createContext } from '../utils/createContext.js';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'clsx';
|
|
3
5
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
6
|
import '../utils/useId.js';
|
|
5
7
|
import '../salt-provider/SaltProvider.js';
|
|
6
8
|
import '../viewport/ViewportProvider.js';
|
|
7
|
-
import 'clsx';
|
|
8
9
|
import '../accordion/AccordionGroup.js';
|
|
9
10
|
import '../accordion/AccordionPanel.js';
|
|
10
11
|
import '../accordion/Accordion.js';
|
|
11
12
|
import '../accordion/AccordionHeader.js';
|
|
12
13
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
13
|
-
import 'react/jsx-runtime';
|
|
14
14
|
import '../avatar/Avatar.js';
|
|
15
15
|
import '../badge/Badge.js';
|
|
16
16
|
import '../banner/Banner.js';
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { isValidElement, cloneElement } from 'react';
|
|
3
|
+
import { mergeProps } from '../utils/mergeProps.js';
|
|
3
4
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
5
|
import { useForkRef } from '../utils/useForkRef.js';
|
|
5
6
|
import '../utils/useId.js';
|
|
6
7
|
import '../salt-provider/SaltProvider.js';
|
|
7
8
|
import '../viewport/ViewportProvider.js';
|
|
8
|
-
import { mergeProps } from '../utils/mergeProps.js';
|
|
9
9
|
import '../accordion/AccordionGroup.js';
|
|
10
10
|
import '../accordion/AccordionPanel.js';
|
|
11
11
|
import '../accordion/Accordion.js';
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { useContext } from 'react';
|
|
2
2
|
import { createContext } from '../utils/createContext.js';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'clsx';
|
|
3
5
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
6
|
import '../utils/useId.js';
|
|
5
7
|
import '../salt-provider/SaltProvider.js';
|
|
6
8
|
import '../viewport/ViewportProvider.js';
|
|
7
|
-
import 'clsx';
|
|
8
9
|
import '../accordion/AccordionGroup.js';
|
|
9
10
|
import '../accordion/AccordionPanel.js';
|
|
10
11
|
import '../accordion/Accordion.js';
|
|
11
12
|
import '../accordion/AccordionHeader.js';
|
|
12
13
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
13
|
-
import 'react/jsx-runtime';
|
|
14
14
|
import '../avatar/Avatar.js';
|
|
15
15
|
import '../badge/Badge.js';
|
|
16
16
|
import '../banner/Banner.js';
|
|
@@ -11,15 +11,15 @@ const iconExpansionMap = {
|
|
|
11
11
|
collapsed: ChevronDownIcon
|
|
12
12
|
}
|
|
13
13
|
};
|
|
14
|
-
|
|
14
|
+
const ExpansionIcon = ({
|
|
15
15
|
expanded = false,
|
|
16
16
|
orientation = "horizontal"
|
|
17
|
-
}) {
|
|
17
|
+
}) => {
|
|
18
18
|
const Icon = iconExpansionMap[orientation][expanded ? "expanded" : "collapsed"];
|
|
19
19
|
return /* @__PURE__ */ jsx(Icon, {
|
|
20
20
|
"aria-hidden": "true"
|
|
21
21
|
});
|
|
22
|
-
}
|
|
22
|
+
};
|
|
23
23
|
|
|
24
24
|
export { ExpansionIcon };
|
|
25
25
|
//# sourceMappingURL=ExpansionIcon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpansionIcon.js","sources":["../src/navigation-item/ExpansionIcon.tsx"],"sourcesContent":["import { ChevronDownIcon, ChevronRightIcon } from \"@salt-ds/icons\";\
|
|
1
|
+
{"version":3,"file":"ExpansionIcon.js","sources":["../src/navigation-item/ExpansionIcon.tsx"],"sourcesContent":["import { ChevronDownIcon, ChevronRightIcon } from \"@salt-ds/icons\";\n\nconst iconExpansionMap = {\n vertical: {\n expanded: ChevronDownIcon,\n collapsed: ChevronRightIcon,\n },\n horizontal: {\n expanded: ChevronDownIcon,\n collapsed: ChevronDownIcon,\n },\n};\n\ninterface ExpansionIconProps {\n /**\n * Whether the navigation item is expanded.\n */\n expanded?: boolean;\n /**\n * The orientation of the navigation item.\n */\n orientation?: \"horizontal\" | \"vertical\";\n}\n\nexport const ExpansionIcon = ({\n expanded = false,\n orientation = \"horizontal\",\n}: ExpansionIconProps) => {\n const Icon =\n iconExpansionMap[orientation][expanded ? \"expanded\" : \"collapsed\"];\n return <Icon aria-hidden=\"true\" />;\n};\n"],"names":[],"mappings":";;;AAEA,MAAM,gBAAmB,GAAA;AAAA,EACvB,QAAU,EAAA;AAAA,IACR,QAAU,EAAA,eAAA;AAAA,IACV,SAAW,EAAA,gBAAA;AAAA,GACb;AAAA,EACA,UAAY,EAAA;AAAA,IACV,QAAU,EAAA,eAAA;AAAA,IACV,SAAW,EAAA,eAAA;AAAA,GACb;AACF,CAAA,CAAA;AAaO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,QAAW,GAAA,KAAA;AAAA,EACX,WAAc,GAAA,YAAA;AAChB,CAA0B,KAAA;AACxB,EAAA,MAAM,IACJ,GAAA,gBAAA,CAAiB,WAAa,CAAA,CAAA,QAAA,GAAW,UAAa,GAAA,WAAA,CAAA,CAAA;AACxD,EAAA,uBAAQ,GAAA,CAAA,IAAA,EAAA;AAAA,IAAK,aAAY,EAAA,MAAA;AAAA,GAAO,CAAA,CAAA;AAClC;;;;"}
|
|
@@ -103,9 +103,9 @@ import '../toggle-button/ToggleButton.js';
|
|
|
103
103
|
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
104
104
|
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
105
105
|
import '../tooltip/Tooltip.js';
|
|
106
|
-
import { ConditionalWrapper } from './ConditionalWrapper.js';
|
|
107
106
|
import { ExpansionIcon } from './ExpansionIcon.js';
|
|
108
107
|
import css_248z from './NavigationItem.css.js';
|
|
108
|
+
import { NavigationItemAction } from './NavigationItemAction.js';
|
|
109
109
|
|
|
110
110
|
const withBaseName = makePrefixer("saltNavigationItem");
|
|
111
111
|
const NavigationItem = forwardRef(
|
|
@@ -113,14 +113,15 @@ const NavigationItem = forwardRef(
|
|
|
113
113
|
const {
|
|
114
114
|
active,
|
|
115
115
|
blurActive,
|
|
116
|
+
render,
|
|
116
117
|
children,
|
|
117
118
|
className,
|
|
118
119
|
expanded = false,
|
|
120
|
+
href,
|
|
119
121
|
orientation = "horizontal",
|
|
120
122
|
parent,
|
|
121
123
|
level = 0,
|
|
122
124
|
onExpand,
|
|
123
|
-
href,
|
|
124
125
|
style: styleProp,
|
|
125
126
|
...rest
|
|
126
127
|
} = props;
|
|
@@ -134,12 +135,17 @@ const NavigationItem = forwardRef(
|
|
|
134
135
|
...styleProp,
|
|
135
136
|
"--saltNavigationItem-level": `${level}`
|
|
136
137
|
};
|
|
138
|
+
const isParent = parent || href === void 0;
|
|
139
|
+
const handleClick = (event) => {
|
|
140
|
+
event.stopPropagation();
|
|
141
|
+
onExpand == null ? void 0 : onExpand(event);
|
|
142
|
+
};
|
|
137
143
|
return /* @__PURE__ */ jsx("div", {
|
|
138
144
|
ref,
|
|
139
145
|
className: clsx(withBaseName(), className),
|
|
140
146
|
style,
|
|
141
147
|
...rest,
|
|
142
|
-
children: /* @__PURE__ */ jsxs(
|
|
148
|
+
children: /* @__PURE__ */ jsxs(NavigationItemAction, {
|
|
143
149
|
className: clsx(
|
|
144
150
|
withBaseName("wrapper"),
|
|
145
151
|
{
|
|
@@ -149,20 +155,22 @@ const NavigationItem = forwardRef(
|
|
|
149
155
|
},
|
|
150
156
|
withBaseName(orientation)
|
|
151
157
|
),
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
158
|
+
render: render != null ? render : isParent ? /* @__PURE__ */ jsx("button", {
|
|
159
|
+
type: "button"
|
|
160
|
+
}) : void 0,
|
|
161
|
+
"aria-expanded": isParent ? expanded : void 0,
|
|
162
|
+
onClick: handleClick,
|
|
163
|
+
"aria-current": !isParent && active ? "page" : void 0,
|
|
156
164
|
href,
|
|
157
165
|
children: [
|
|
158
166
|
/* @__PURE__ */ jsx("span", {
|
|
159
167
|
className: withBaseName("label"),
|
|
160
168
|
children
|
|
161
169
|
}),
|
|
162
|
-
|
|
170
|
+
isParent ? /* @__PURE__ */ jsx(ExpansionIcon, {
|
|
163
171
|
expanded,
|
|
164
172
|
orientation
|
|
165
|
-
})
|
|
173
|
+
}) : null
|
|
166
174
|
]
|
|
167
175
|
})
|
|
168
176
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type MouseEventHandler,\n forwardRef,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport {
|
|
1
|
+
{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type MouseEvent,\n type MouseEventHandler,\n forwardRef,\n} from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport type { RenderPropsType } from \"../utils\";\nimport navigationItemCss from \"./NavigationItem.css\";\nimport { NavigationItemAction } from \"./NavigationItemAction\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * Whether the navigation item is active.\n */\n active?: boolean;\n /**\n * Whether the nested group is collapsed and there is an active nested item within it.\n */\n blurActive?: boolean;\n /**\n * Whether the navigation item is expanded.\n */\n expanded?: boolean;\n /**\n * Level of nesting.\n */\n level?: number;\n /**\n * The orientation of the navigation item.\n */\n orientation?: \"horizontal\" | \"vertical\";\n /**\n * Whether the navigation item is a parent with nested items.\n */\n parent?: boolean;\n /**\n * Render prop to enable customisation of navigation item element.\n */\n render?: RenderPropsType[\"render\"];\n /**\n * Action to be triggered when the navigation item is expanded.\n */\n onExpand?: MouseEventHandler<HTMLButtonElement>;\n /**\n * Href to be passed to the Link element.\n */\n href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n function NavigationItem(props, ref) {\n const {\n active,\n blurActive,\n render,\n children,\n className,\n expanded = false,\n href,\n orientation = \"horizontal\",\n parent,\n level = 0,\n onExpand,\n style: styleProp,\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-navigation-item\",\n css: navigationItemCss,\n window: targetWindow,\n });\n\n const style = {\n ...styleProp,\n \"--saltNavigationItem-level\": `${level}`,\n };\n\n const isParent = parent || href === undefined;\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n onExpand?.(event);\n };\n\n return (\n <div\n ref={ref}\n className={clsx(withBaseName(), className)}\n style={style}\n {...rest}\n >\n <NavigationItemAction\n className={clsx(\n withBaseName(\"wrapper\"),\n {\n [withBaseName(\"active\")]: active || blurActive,\n [withBaseName(\"blurActive\")]: blurActive,\n [withBaseName(\"rootItem\")]: level === 0,\n },\n withBaseName(orientation),\n )}\n render={render ?? (isParent ? <button type=\"button\" /> : undefined)}\n aria-expanded={isParent ? expanded : undefined}\n onClick={handleClick}\n aria-current={!isParent && active ? \"page\" : undefined}\n href={href}\n >\n <span className={withBaseName(\"label\")}>{children}</span>\n {isParent ? (\n <ExpansionIcon expanded={expanded} orientation={orientation} />\n ) : null}\n </NavigationItemAction>\n </div>\n );\n },\n);\n"],"names":["NavigationItem","navigationItemCss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAE/C,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AAClC,IAAM,MAAA;AAAA,MACJ,MAAA;AAAA,MACA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAW,GAAA,KAAA;AAAA,MACX,IAAA;AAAA,MACA,WAAc,GAAA,YAAA;AAAA,MACd,MAAA;AAAA,MACA,KAAQ,GAAA,CAAA;AAAA,MACR,QAAA;AAAA,MACA,KAAO,EAAA,SAAA;AAAA,MACJ,GAAA,IAAA;AAAA,KACD,GAAA,KAAA,CAAA;AAEJ,IAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,sBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA,YAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAA,MAAM,KAAQ,GAAA;AAAA,MACZ,GAAG,SAAA;AAAA,MACH,8BAA8B,CAAG,EAAA,KAAA,CAAA,CAAA;AAAA,KACnC,CAAA;AAEA,IAAM,MAAA,QAAA,GAAW,UAAU,IAAS,KAAA,KAAA,CAAA,CAAA;AAEpC,IAAM,MAAA,WAAA,GAAc,CAAC,KAAyC,KAAA;AAC5D,MAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,MAAW,QAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA,CAAA;AAAA,KACb,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,KAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAC,kBAAA,IAAA,CAAA,oBAAA,EAAA;AAAA,QACC,SAAW,EAAA,IAAA;AAAA,UACT,aAAa,SAAS,CAAA;AAAA,UACtB;AAAA,YACE,CAAC,YAAA,CAAa,QAAQ,CAAA,GAAI,MAAU,IAAA,UAAA;AAAA,YACpC,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,YAC9B,CAAC,YAAA,CAAa,UAAU,CAAA,GAAI,KAAU,KAAA,CAAA;AAAA,WACxC;AAAA,UACA,aAAa,WAAW,CAAA;AAAA,SAC1B;AAAA,QACA,MAAA,EAAQ,MAAW,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,mBAAY,GAAA,CAAA,QAAA,EAAA;AAAA,UAAO,IAAK,EAAA,QAAA;AAAA,SAAS,CAAK,GAAA,KAAA,CAAA;AAAA,QACzD,eAAA,EAAe,WAAW,QAAW,GAAA,KAAA,CAAA;AAAA,QACrC,OAAS,EAAA,WAAA;AAAA,QACT,cAAc,EAAA,CAAC,QAAY,IAAA,MAAA,GAAS,MAAS,GAAA,KAAA,CAAA;AAAA,QAC7C,IAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,YAAI,QAAA;AAAA,WAAS,CAAA;AAAA,UACjD,2BACE,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,QAAA;AAAA,YAAoB,WAAA;AAAA,WAA0B,CAC3D,GAAA,IAAA;AAAA,SAAA;AAAA,OACN,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import 'react';
|
|
2
|
+
import { renderProps } from '../utils/renderProps.js';
|
|
3
|
+
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
|
+
import '../utils/useId.js';
|
|
5
|
+
import '../salt-provider/SaltProvider.js';
|
|
6
|
+
import '../viewport/ViewportProvider.js';
|
|
7
|
+
import 'clsx';
|
|
8
|
+
import '../accordion/AccordionGroup.js';
|
|
9
|
+
import '../accordion/AccordionPanel.js';
|
|
10
|
+
import '../accordion/Accordion.js';
|
|
11
|
+
import '../accordion/AccordionHeader.js';
|
|
12
|
+
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
13
|
+
import 'react/jsx-runtime';
|
|
14
|
+
import '../avatar/Avatar.js';
|
|
15
|
+
import '../badge/Badge.js';
|
|
16
|
+
import '../banner/Banner.js';
|
|
17
|
+
import '../banner/BannerActions.js';
|
|
18
|
+
import '../banner/BannerContent.js';
|
|
19
|
+
import '../border-item/BorderItem.js';
|
|
20
|
+
import '../border-layout/BorderLayout.js';
|
|
21
|
+
import '../breakpoints/BreakpointProvider.js';
|
|
22
|
+
import '../button/Button.js';
|
|
23
|
+
import '../card/Card.js';
|
|
24
|
+
import '../checkbox/Checkbox.js';
|
|
25
|
+
import '../checkbox/CheckboxGroup.js';
|
|
26
|
+
import '@salt-ds/icons';
|
|
27
|
+
import '@salt-ds/styles';
|
|
28
|
+
import '@salt-ds/window';
|
|
29
|
+
import '../combo-box/ComboBox.js';
|
|
30
|
+
import '../dialog/Dialog.js';
|
|
31
|
+
import '../dialog/DialogHeader.js';
|
|
32
|
+
import '../dialog/DialogActions.js';
|
|
33
|
+
import '../dialog/DialogContent.js';
|
|
34
|
+
import '../dialog/DialogContext.js';
|
|
35
|
+
import '../dialog/DialogCloseButton.js';
|
|
36
|
+
import '../divider/Divider.js';
|
|
37
|
+
import '../drawer/Drawer.js';
|
|
38
|
+
import '../drawer/DrawerCloseButton.js';
|
|
39
|
+
import '../dropdown/Dropdown.js';
|
|
40
|
+
import '../file-drop-zone/FileDropZone.js';
|
|
41
|
+
import '../file-drop-zone/FileDropZoneIcon.js';
|
|
42
|
+
import '../file-drop-zone/FileDropZoneTrigger.js';
|
|
43
|
+
import '../flex-item/FlexItem.js';
|
|
44
|
+
import '../flex-layout/FlexLayout.js';
|
|
45
|
+
import '../flow-layout/FlowLayout.js';
|
|
46
|
+
import '../form-field/FormField.js';
|
|
47
|
+
import '../form-field-context/FormFieldContext.js';
|
|
48
|
+
import '../status-indicator/StatusIndicator.js';
|
|
49
|
+
import '../text/Text.js';
|
|
50
|
+
import '../text/Code.js';
|
|
51
|
+
import '../text/Display.js';
|
|
52
|
+
import '../text/Headings.js';
|
|
53
|
+
import '../text/Label.js';
|
|
54
|
+
import '../text/TextAction.js';
|
|
55
|
+
import '../text/TextNotation.js';
|
|
56
|
+
import '../grid-item/GridItem.js';
|
|
57
|
+
import '../grid-layout/GridLayout.js';
|
|
58
|
+
import '../input/Input.js';
|
|
59
|
+
import '../interactable-card/InteractableCard.js';
|
|
60
|
+
import '../interactable-card/InteractableCardGroup.js';
|
|
61
|
+
import '../interactable-card/InteractableCardGroupContext.js';
|
|
62
|
+
import '../link/Link.js';
|
|
63
|
+
import '../link-card/LinkCard.js';
|
|
64
|
+
import '../list-box/ListBox.js';
|
|
65
|
+
import '../list-control/ListControlContext.js';
|
|
66
|
+
import '@floating-ui/react';
|
|
67
|
+
import '../menu/MenuContext.js';
|
|
68
|
+
import '../menu/MenuItem.js';
|
|
69
|
+
import '../menu/MenuPanel.js';
|
|
70
|
+
import '../menu/MenuPanelContext.js';
|
|
71
|
+
import '../menu/MenuTriggerContext.js';
|
|
72
|
+
import '../menu/MenuGroup.js';
|
|
73
|
+
import '../multiline-input/MultilineInput.js';
|
|
74
|
+
import './NavigationItem.js';
|
|
75
|
+
import '../option/Option.js';
|
|
76
|
+
import '../option/OptionGroup.js';
|
|
77
|
+
import '../overlay/OverlayContext.js';
|
|
78
|
+
import '../overlay/OverlayPanel.js';
|
|
79
|
+
import '../overlay/OverlayPanelCloseButton.js';
|
|
80
|
+
import '../overlay/OverlayPanelContent.js';
|
|
81
|
+
import '../pagination/Pagination.js';
|
|
82
|
+
import '../pagination/Paginator.js';
|
|
83
|
+
import '../pagination/CompactInput.js';
|
|
84
|
+
import '../pagination/CompactPaginator.js';
|
|
85
|
+
import '../pagination/GoToInput.js';
|
|
86
|
+
import '../panel/Panel.js';
|
|
87
|
+
import '../parent-child-layout/ParentChildLayout.js';
|
|
88
|
+
import '../pill/Pill.js';
|
|
89
|
+
import '../progress/CircularProgress/CircularProgress.js';
|
|
90
|
+
import '../progress/LinearProgress/LinearProgress.js';
|
|
91
|
+
import '../radio-button/RadioButton.js';
|
|
92
|
+
import '../radio-button/RadioButtonGroup.js';
|
|
93
|
+
import '../scrim/Scrim.js';
|
|
94
|
+
import '../segmented-button-group/SegmentedButtonGroup.js';
|
|
95
|
+
import '../spinner/Spinner.js';
|
|
96
|
+
import '../stack-layout/StackLayout.js';
|
|
97
|
+
import '../status-adornment/StatusAdornment.js';
|
|
98
|
+
import '../toast/Toast.js';
|
|
99
|
+
import '../toast/ToastContent.js';
|
|
100
|
+
import '../split-layout/SplitLayout.js';
|
|
101
|
+
import '../switch/Switch.js';
|
|
102
|
+
import '../tag/Tag.js';
|
|
103
|
+
import '../toggle-button/ToggleButton.js';
|
|
104
|
+
import '../toggle-button-group/ToggleButtonGroup.js';
|
|
105
|
+
import '../toggle-button-group/ToggleButtonGroupContext.js';
|
|
106
|
+
import '../tooltip/Tooltip.js';
|
|
107
|
+
|
|
108
|
+
function NavigationItemAction(props) {
|
|
109
|
+
return renderProps("a", props);
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
export { NavigationItemAction };
|
|
113
|
+
//# sourceMappingURL=NavigationItemAction.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NavigationItemAction.js","sources":["../src/navigation-item/NavigationItemAction.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\nimport { renderProps } from \"../utils\";\n\ninterface NavigationItemActionProps extends ComponentPropsWithoutRef<any> {}\n\nexport function NavigationItemAction(props: NavigationItemActionProps) {\n return renderProps(\"a\", props);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKO,SAAS,qBAAqB,KAAkC,EAAA;AACrE,EAAO,OAAA,WAAA,CAAY,KAAK,KAAK,CAAA,CAAA;AAC/B;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var css_248z = ".saltOptionList {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n border-radius: var(--salt-palette-corner
|
|
1
|
+
var css_248z = ".saltOptionList {\n background: var(--salt-container-primary-background);\n border: var(--salt-size-border) var(--salt-selectable-borderStyle-selected) var(--salt-selectable-borderColor-selected);\n border-radius: var(--salt-palette-corner, 0);\n overflow: hidden;\n overflow-y: auto;\n position: relative;\n z-index: var(--salt-zIndex-flyover);\n box-shadow: var(--salt-overlayable-shadow-popout);\n box-sizing: border-box;\n}\n\n.saltOptionList-container {\n display: flex;\n flex-direction: column;\n gap: var(--salt-size-border);\n max-height: inherit;\n min-height: inherit;\n}\n\n.saltOptionList-collapsed {\n display: none;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { css_248z as default };
|
|
4
4
|
//# sourceMappingURL=OptionList.css.js.map
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { offset, flip, shift, limitShift, arrow, useInteractions, useRole, useClick, useDismiss } from '@floating-ui/react';
|
|
3
3
|
import { useRef, useMemo } from 'react';
|
|
4
|
+
import 'clsx';
|
|
4
5
|
import { useControlled } from '../utils/useControlled.js';
|
|
5
6
|
import { useFloatingUI } from '../utils/useFloatingUI/useFloatingUI.js';
|
|
6
7
|
import '../utils/useId.js';
|
|
7
8
|
import '../salt-provider/SaltProvider.js';
|
|
8
9
|
import '../viewport/ViewportProvider.js';
|
|
9
|
-
import 'clsx';
|
|
10
10
|
import '../accordion/AccordionGroup.js';
|
|
11
11
|
import '../accordion/AccordionPanel.js';
|
|
12
12
|
import '../accordion/Accordion.js';
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { useContext } from 'react';
|
|
2
2
|
import { createContext } from '../utils/createContext.js';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'clsx';
|
|
3
5
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
6
|
import '../utils/useId.js';
|
|
5
7
|
import '../salt-provider/SaltProvider.js';
|
|
6
8
|
import '../viewport/ViewportProvider.js';
|
|
7
|
-
import 'clsx';
|
|
8
9
|
import '../accordion/AccordionGroup.js';
|
|
9
10
|
import '../accordion/AccordionPanel.js';
|
|
10
11
|
import '../accordion/Accordion.js';
|
|
11
12
|
import '../accordion/AccordionHeader.js';
|
|
12
13
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
13
|
-
import 'react/jsx-runtime';
|
|
14
14
|
import '../avatar/Avatar.js';
|
|
15
15
|
import '../badge/Badge.js';
|
|
16
16
|
import '../banner/Banner.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayContext.js","sources":["../src/overlay/OverlayContext.ts"],"sourcesContent":["import type {\n FloatingArrowProps,\n FloatingContext,\n ReferenceType,\n Strategy,\n} from \"@floating-ui/react\";\nimport { useContext } from \"react\";\nimport { createContext, type useFloatingUI } from \"../utils\";\n\ntype FloatingReturn = ReturnType<typeof useFloatingUI>;\ntype FloatingStyleProps = {\n top: number;\n left: number;\n position: Strategy;\n width?: number;\n height?: number;\n};\n\nexport interface OverlayContextValue {\n openState: boolean;\n floatingStyles: FloatingStyleProps;\n arrowProps: FloatingArrowProps;\n context: FloatingContext;\n reference?: (node: ReferenceType | null) => void;\n floating?: (node: HTMLElement | null) => void;\n getFloatingProps: (\n userProps?:
|
|
1
|
+
{"version":3,"file":"OverlayContext.js","sources":["../src/overlay/OverlayContext.ts"],"sourcesContent":["import type {\n FloatingArrowProps,\n FloatingContext,\n ReferenceType,\n Strategy,\n} from \"@floating-ui/react\";\nimport { type HTMLProps, useContext } from \"react\";\nimport { createContext, type useFloatingUI } from \"../utils\";\n\ntype FloatingReturn = ReturnType<typeof useFloatingUI>;\ntype FloatingStyleProps = {\n top: number;\n left: number;\n position: Strategy;\n width?: number;\n height?: number;\n};\n\nexport interface OverlayContextValue {\n openState: boolean;\n floatingStyles: FloatingStyleProps;\n arrowProps: FloatingArrowProps;\n context: FloatingContext;\n reference?: (node: ReferenceType | null) => void;\n floating?: (node: HTMLElement | null) => void;\n getFloatingProps: (\n userProps?: HTMLProps<HTMLElement> | undefined,\n ) => Record<string, unknown>;\n getReferenceProps: (\n userProps?: HTMLProps<Element> | undefined,\n ) => Record<string, unknown>;\n}\n\nexport const OverlayContext = createContext<OverlayContextValue>(\n \"OverlayContext\",\n {\n openState: false,\n floatingStyles: {\n top: 0,\n left: 0,\n position: \"\" as Strategy,\n },\n context: {} as FloatingContext,\n arrowProps: {} as FloatingArrowProps,\n reference: {} as FloatingReturn[\"reference\"],\n floating: {} as FloatingReturn[\"floating\"],\n getFloatingProps() {\n return {} as Record<string, unknown>;\n },\n getReferenceProps() {\n return {} as Record<string, unknown>;\n },\n },\n);\n\nexport function useOverlayContext() {\n return useContext(OverlayContext);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO,MAAM,cAAiB,GAAA,aAAA;AAAA,EAC5B,gBAAA;AAAA,EACA;AAAA,IACE,SAAW,EAAA,KAAA;AAAA,IACX,cAAgB,EAAA;AAAA,MACd,GAAK,EAAA,CAAA;AAAA,MACL,IAAM,EAAA,CAAA;AAAA,MACN,QAAU,EAAA,EAAA;AAAA,KACZ;AAAA,IACA,SAAS,EAAC;AAAA,IACV,YAAY,EAAC;AAAA,IACb,WAAW,EAAC;AAAA,IACZ,UAAU,EAAC;AAAA,IACX,gBAAmB,GAAA;AACjB,MAAA,OAAO,EAAC,CAAA;AAAA,KACV;AAAA,IACA,iBAAoB,GAAA;AAClB,MAAA,OAAO,EAAC,CAAA;AAAA,KACV;AAAA,GACF;AACF,EAAA;AAEO,SAAS,iBAAoB,GAAA;AAClC,EAAA,OAAO,WAAW,cAAc,CAAA,CAAA;AAClC;;;;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { isValidElement, cloneElement } from 'react';
|
|
3
|
+
import { mergeProps } from '../utils/mergeProps.js';
|
|
3
4
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
5
|
import { useForkRef } from '../utils/useForkRef.js';
|
|
5
6
|
import '../utils/useId.js';
|
|
6
7
|
import '../salt-provider/SaltProvider.js';
|
|
7
8
|
import '../viewport/ViewportProvider.js';
|
|
8
|
-
import { mergeProps } from '../utils/mergeProps.js';
|
|
9
9
|
import '../accordion/AccordionGroup.js';
|
|
10
10
|
import '../accordion/AccordionPanel.js';
|
|
11
11
|
import '../accordion/Accordion.js';
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { useCallback } from 'react';
|
|
3
3
|
import { makePrefixer } from '../utils/makePrefixer.js';
|
|
4
|
+
import 'clsx';
|
|
4
5
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
5
6
|
import '../utils/useId.js';
|
|
6
7
|
import '../salt-provider/SaltProvider.js';
|
|
7
8
|
import '../viewport/ViewportProvider.js';
|
|
8
|
-
import 'clsx';
|
|
9
9
|
import '../accordion/AccordionGroup.js';
|
|
10
10
|
import '../accordion/AccordionPanel.js';
|
|
11
11
|
import '../accordion/Accordion.js';
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import 'react';
|
|
2
|
+
import 'react/jsx-runtime';
|
|
3
|
+
import 'clsx';
|
|
2
4
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
3
5
|
import '../utils/useId.js';
|
|
4
6
|
import { useOrderedBreakpoints, useCurrentBreakpoint } from '../utils/useResponsiveProp.js';
|
|
5
|
-
import 'clsx';
|
|
6
7
|
import '../accordion/AccordionGroup.js';
|
|
7
8
|
import '../accordion/AccordionPanel.js';
|
|
8
9
|
import '../accordion/Accordion.js';
|
|
9
10
|
import '../accordion/AccordionHeader.js';
|
|
10
11
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
11
|
-
import 'react/jsx-runtime';
|
|
12
12
|
import '../avatar/Avatar.js';
|
|
13
13
|
import '../badge/Badge.js';
|
|
14
14
|
import '../banner/Banner.js';
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { useWindow } from '@salt-ds/window';
|
|
2
2
|
import { useRef, useCallback } from 'react';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'clsx';
|
|
3
5
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
4
6
|
import '../utils/useId.js';
|
|
5
7
|
import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
|
|
6
8
|
import '../salt-provider/SaltProvider.js';
|
|
7
9
|
import '../viewport/ViewportProvider.js';
|
|
8
|
-
import 'clsx';
|
|
9
10
|
import { useValueEffect } from '../utils/useValueEffect.js';
|
|
10
11
|
import { useResizeObserver } from '../utils/useResizeObserver.js';
|
|
11
12
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTruncatePills.js","sources":["../src/pill-input/useTruncatePills.ts"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport { useCallback, useRef } from \"react\";\nimport {\n useIsomorphicLayoutEffect,\n useResizeObserver,\n useValueEffect,\n} from \"../utils\";\n\nexport function useTruncatePills({\n pills,\n enable,\n}: {\n pills: string[];\n enable?: boolean;\n}) {\n const pillListRef = useRef<HTMLDivElement>(null);\n const [visibleCount, setVisibleItems] = useValueEffect(pills.length);\n const targetWindow = useWindow();\n\n const updateOverflow = useCallback(() => {\n if (!enable) {\n return;\n }\n\n const computeVisible = (visibleCount: number) => {\n const pillList = pillListRef.current;\n\n if (pillList && targetWindow) {\n const pillElements = Array.from(\n pillList.querySelectorAll('[role=\"listitem\"]'),\n );\n const maxWidth = pillList.getBoundingClientRect().width;\n const listGap = Number.parseInt(\n targetWindow.getComputedStyle(pillList).gap,\n );\n const isShowingOverflow = pillList.querySelector(\n \"[data-overflowindicator]\",\n );\n\n let currentSize = 0;\n let newVisibleCount = 0;\n\n if (isShowingOverflow) {\n const pill = pillElements.pop();\n if (pill) {\n const pillWidth = pill.getBoundingClientRect().width;\n currentSize += pillWidth + listGap;\n }\n }\n\n for (const pill of pillElements) {\n const pillWidth = pill.getBoundingClientRect().width;\n currentSize += pillWidth + listGap;\n\n if (Math.round(currentSize) <= Math.round(maxWidth)) {\n newVisibleCount++;\n } else {\n break;\n }\n }\n return newVisibleCount;\n }\n return visibleCount;\n };\n\n setVisibleItems(function* () {\n // Show all\n yield pills.length;\n\n // Measure the visible count\n const newVisibleCount = computeVisible(pills.length);\n const isMeasuring = newVisibleCount < pills.length && newVisibleCount > 0;\n yield newVisibleCount;\n\n // ensure the visible count is correct\n if (isMeasuring) {\n yield computeVisible(newVisibleCount);\n }\n });\n }, [pills, setVisibleItems, enable, targetWindow]);\n\n useIsomorphicLayoutEffect(() => {\n updateOverflow();\n }, [updateOverflow]);\n\n useResizeObserver({\n ref: pillListRef,\n onResize: updateOverflow,\n });\n\n return {\n pillListRef,\n visibleCount,\n visiblePills: enable ? pills.slice(0, visibleCount) : pills,\n };\n}\n"],"names":["visibleCount"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useTruncatePills.js","sources":["../src/pill-input/useTruncatePills.ts"],"sourcesContent":["import { useWindow } from \"@salt-ds/window\";\nimport { useCallback, useRef } from \"react\";\nimport {\n useIsomorphicLayoutEffect,\n useResizeObserver,\n useValueEffect,\n} from \"../utils\";\n\nexport function useTruncatePills({\n pills,\n enable,\n}: {\n pills: string[];\n enable?: boolean;\n}) {\n const pillListRef = useRef<HTMLDivElement>(null);\n const [visibleCount, setVisibleItems] = useValueEffect(pills.length);\n const targetWindow = useWindow();\n\n const updateOverflow = useCallback(() => {\n if (!enable) {\n return;\n }\n\n const computeVisible = (visibleCount: number) => {\n const pillList = pillListRef.current;\n\n if (pillList && targetWindow) {\n const pillElements = Array.from(\n pillList.querySelectorAll('[role=\"listitem\"]'),\n );\n const maxWidth = pillList.getBoundingClientRect().width;\n const listGap = Number.parseInt(\n targetWindow.getComputedStyle(pillList).gap,\n );\n const isShowingOverflow = pillList.querySelector(\n \"[data-overflowindicator]\",\n );\n\n let currentSize = 0;\n let newVisibleCount = 0;\n\n if (isShowingOverflow) {\n const pill = pillElements.pop();\n if (pill) {\n const pillWidth = pill.getBoundingClientRect().width;\n currentSize += pillWidth + listGap;\n }\n }\n\n for (const pill of pillElements) {\n const pillWidth = pill.getBoundingClientRect().width;\n currentSize += pillWidth + listGap;\n\n if (Math.round(currentSize) <= Math.round(maxWidth)) {\n newVisibleCount++;\n } else {\n break;\n }\n }\n return newVisibleCount;\n }\n return visibleCount;\n };\n\n setVisibleItems(function* () {\n // Show all\n yield pills.length;\n\n // Measure the visible count\n const newVisibleCount = computeVisible(pills.length);\n const isMeasuring = newVisibleCount < pills.length && newVisibleCount > 0;\n yield newVisibleCount;\n\n // ensure the visible count is correct\n if (isMeasuring) {\n yield computeVisible(newVisibleCount);\n }\n });\n }, [pills, setVisibleItems, enable, targetWindow]);\n\n useIsomorphicLayoutEffect(() => {\n updateOverflow();\n }, [updateOverflow]);\n\n useResizeObserver({\n ref: pillListRef,\n onResize: updateOverflow,\n });\n\n return {\n pillListRef,\n visibleCount,\n visiblePills: enable ? pills.slice(0, visibleCount) : pills,\n };\n}\n"],"names":["visibleCount"],"mappings":";;;;;;;;;;;;AAQO,SAAS,gBAAiB,CAAA;AAAA,EAC/B,KAAA;AAAA,EACA,MAAA;AACF,CAGG,EAAA;AACD,EAAM,MAAA,WAAA,GAAc,OAAuB,IAAI,CAAA,CAAA;AAC/C,EAAA,MAAM,CAAC,YAAc,EAAA,eAAe,CAAI,GAAA,cAAA,CAAe,MAAM,MAAM,CAAA,CAAA;AACnE,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAE/B,EAAM,MAAA,cAAA,GAAiB,YAAY,MAAM;AACvC,IAAA,IAAI,CAAC,MAAQ,EAAA;AACX,MAAA,OAAA;AAAA,KACF;AAEA,IAAM,MAAA,cAAA,GAAiB,CAACA,aAAyB,KAAA;AAC/C,MAAA,MAAM,WAAW,WAAY,CAAA,OAAA,CAAA;AAE7B,MAAA,IAAI,YAAY,YAAc,EAAA;AAC5B,QAAA,MAAM,eAAe,KAAM,CAAA,IAAA;AAAA,UACzB,QAAA,CAAS,iBAAiB,mBAAmB,CAAA;AAAA,SAC/C,CAAA;AACA,QAAM,MAAA,QAAA,GAAW,QAAS,CAAA,qBAAA,EAAwB,CAAA,KAAA,CAAA;AAClD,QAAA,MAAM,UAAU,MAAO,CAAA,QAAA;AAAA,UACrB,YAAA,CAAa,gBAAiB,CAAA,QAAQ,CAAE,CAAA,GAAA;AAAA,SAC1C,CAAA;AACA,QAAA,MAAM,oBAAoB,QAAS,CAAA,aAAA;AAAA,UACjC,0BAAA;AAAA,SACF,CAAA;AAEA,QAAA,IAAI,WAAc,GAAA,CAAA,CAAA;AAClB,QAAA,IAAI,eAAkB,GAAA,CAAA,CAAA;AAEtB,QAAA,IAAI,iBAAmB,EAAA;AACrB,UAAM,MAAA,IAAA,GAAO,aAAa,GAAI,EAAA,CAAA;AAC9B,UAAA,IAAI,IAAM,EAAA;AACR,YAAM,MAAA,SAAA,GAAY,IAAK,CAAA,qBAAA,EAAwB,CAAA,KAAA,CAAA;AAC/C,YAAA,WAAA,IAAe,SAAY,GAAA,OAAA,CAAA;AAAA,WAC7B;AAAA,SACF;AAEA,QAAA,KAAA,MAAW,QAAQ,YAAc,EAAA;AAC/B,UAAM,MAAA,SAAA,GAAY,IAAK,CAAA,qBAAA,EAAwB,CAAA,KAAA,CAAA;AAC/C,UAAA,WAAA,IAAe,SAAY,GAAA,OAAA,CAAA;AAE3B,UAAA,IAAI,KAAK,KAAM,CAAA,WAAW,KAAK,IAAK,CAAA,KAAA,CAAM,QAAQ,CAAG,EAAA;AACnD,YAAA,eAAA,EAAA,CAAA;AAAA,WACK,MAAA;AACL,YAAA,MAAA;AAAA,WACF;AAAA,SACF;AACA,QAAO,OAAA,eAAA,CAAA;AAAA,OACT;AACA,MAAOA,OAAAA,aAAAA,CAAAA;AAAA,KACT,CAAA;AAEA,IAAA,eAAA,CAAgB,aAAa;AAE3B,MAAA,MAAM,KAAM,CAAA,MAAA,CAAA;AAGZ,MAAM,MAAA,eAAA,GAAkB,cAAe,CAAA,KAAA,CAAM,MAAM,CAAA,CAAA;AACnD,MAAA,MAAM,WAAc,GAAA,eAAA,GAAkB,KAAM,CAAA,MAAA,IAAU,eAAkB,GAAA,CAAA,CAAA;AACxE,MAAM,MAAA,eAAA,CAAA;AAGN,MAAA,IAAI,WAAa,EAAA;AACf,QAAA,MAAM,eAAe,eAAe,CAAA,CAAA;AAAA,OACtC;AAAA,KACD,CAAA,CAAA;AAAA,KACA,CAAC,KAAA,EAAO,eAAiB,EAAA,MAAA,EAAQ,YAAY,CAAC,CAAA,CAAA;AAEjD,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAe,cAAA,EAAA,CAAA;AAAA,GACjB,EAAG,CAAC,cAAc,CAAC,CAAA,CAAA;AAEnB,EAAkB,iBAAA,CAAA;AAAA,IAChB,GAAK,EAAA,WAAA;AAAA,IACL,QAAU,EAAA,cAAA;AAAA,GACX,CAAA,CAAA;AAED,EAAO,OAAA;AAAA,IACL,WAAA;AAAA,IACA,YAAA;AAAA,IACA,cAAc,MAAS,GAAA,KAAA,CAAM,KAAM,CAAA,CAAA,EAAG,YAAY,CAAI,GAAA,KAAA;AAAA,GACxD,CAAA;AACF;;;;"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { createContext } from '../../utils/createContext.js';
|
|
2
|
+
import 'react/jsx-runtime';
|
|
2
3
|
import 'react';
|
|
4
|
+
import 'clsx';
|
|
3
5
|
import '../../utils/useFloatingUI/useFloatingUI.js';
|
|
4
6
|
import '../../utils/useId.js';
|
|
5
7
|
import '../../salt-provider/SaltProvider.js';
|
|
6
8
|
import '../../viewport/ViewportProvider.js';
|
|
7
|
-
import 'clsx';
|
|
8
9
|
import '../../accordion/AccordionGroup.js';
|
|
9
10
|
import '../../accordion/AccordionPanel.js';
|
|
10
11
|
import '../../accordion/Accordion.js';
|
|
11
12
|
import '../../accordion/AccordionHeader.js';
|
|
12
13
|
import '../../aria-announcer/AriaAnnouncerContext.js';
|
|
13
|
-
import 'react/jsx-runtime';
|
|
14
14
|
import '../../avatar/Avatar.js';
|
|
15
15
|
import '../../badge/Badge.js';
|
|
16
16
|
import '../../banner/Banner.js';
|
|
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
2
2
|
import { StyleInjectionProvider, useComponentCssInjection } from '@salt-ds/styles';
|
|
3
3
|
import { useWindow } from '@salt-ds/window';
|
|
4
4
|
import { clsx } from 'clsx';
|
|
5
|
-
import
|
|
5
|
+
import { createContext, useContext, useMemo, isValidElement, cloneElement } from 'react';
|
|
6
6
|
import '../aria-announcer/AriaAnnouncerContext.js';
|
|
7
7
|
import '../utils/useFloatingUI/useFloatingUI.js';
|
|
8
8
|
import '../utils/useId.js';
|
|
@@ -160,8 +160,8 @@ const createThemedChildren = ({
|
|
|
160
160
|
return children;
|
|
161
161
|
}
|
|
162
162
|
if (applyClassesTo === "child") {
|
|
163
|
-
if (
|
|
164
|
-
return
|
|
163
|
+
if (isValidElement(children)) {
|
|
164
|
+
return cloneElement(children, {
|
|
165
165
|
className: clsx(
|
|
166
166
|
(_a = children.props) == null ? void 0 : _a.className,
|
|
167
167
|
themeNamesString,
|