@salt-ds/core 1.68.0 → 1.69.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/CHANGELOG.md +46 -0
- package/css/salt-core.css +318 -36
- package/dist-cjs/avatar/Avatar.css.js +1 -1
- package/dist-cjs/avatar/Avatar.js +5 -2
- package/dist-cjs/avatar/Avatar.js.map +1 -1
- package/dist-cjs/breadcrumbs/Breadcrumb.css.js +6 -0
- package/dist-cjs/breadcrumbs/Breadcrumb.css.js.map +1 -0
- package/dist-cjs/breadcrumbs/Breadcrumb.js +104 -0
- package/dist-cjs/breadcrumbs/Breadcrumb.js.map +1 -0
- package/dist-cjs/breadcrumbs/BreadcrumbLabel.js +25 -0
- package/dist-cjs/breadcrumbs/BreadcrumbLabel.js.map +1 -0
- package/dist-cjs/breadcrumbs/BreadcrumbTrigger.js +52 -0
- package/dist-cjs/breadcrumbs/BreadcrumbTrigger.js.map +1 -0
- package/dist-cjs/breadcrumbs/Breadcrumbs.css.js +6 -0
- package/dist-cjs/breadcrumbs/Breadcrumbs.css.js.map +1 -0
- package/dist-cjs/breadcrumbs/Breadcrumbs.js +151 -0
- package/dist-cjs/breadcrumbs/Breadcrumbs.js.map +1 -0
- package/dist-cjs/breadcrumbs/internal/BreadcrumbContext.js +12 -0
- package/dist-cjs/breadcrumbs/internal/BreadcrumbContext.js.map +1 -0
- package/dist-cjs/breadcrumbs/internal/BreadcrumbOverflowDisclosure.js +243 -0
- package/dist-cjs/breadcrumbs/internal/BreadcrumbOverflowDisclosure.js.map +1 -0
- package/dist-cjs/breadcrumbs/internal/breadcrumbItems.js +21 -0
- package/dist-cjs/breadcrumbs/internal/breadcrumbItems.js.map +1 -0
- package/dist-cjs/card/Card.css.js +1 -1
- package/dist-cjs/card/Card.js +4 -1
- package/dist-cjs/card/Card.js.map +1 -1
- package/dist-cjs/card/CardContent.css.js +6 -0
- package/dist-cjs/card/CardContent.css.js.map +1 -0
- package/dist-cjs/card/CardContent.js +30 -0
- package/dist-cjs/card/CardContent.js.map +1 -0
- package/dist-cjs/card/CardFooter.css.js +6 -0
- package/dist-cjs/card/CardFooter.css.js.map +1 -0
- package/dist-cjs/card/CardFooter.js +30 -0
- package/dist-cjs/card/CardFooter.js.map +1 -0
- package/dist-cjs/card/CardHeader.css.js +6 -0
- package/dist-cjs/card/CardHeader.css.js.map +1 -0
- package/dist-cjs/card/CardHeader.js +30 -0
- package/dist-cjs/card/CardHeader.js.map +1 -0
- package/dist-cjs/card/hasCardSection.js +16 -0
- package/dist-cjs/card/hasCardSection.js.map +1 -0
- package/dist-cjs/file-drop-zone/FileDropZone.css.js +1 -1
- package/dist-cjs/index.js +14 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/interactable-card/InteractableCard.css.js +1 -1
- package/dist-cjs/interactable-card/InteractableCard.js +4 -1
- package/dist-cjs/interactable-card/InteractableCard.js.map +1 -1
- package/dist-cjs/kbd/Kbd.css.js +1 -1
- package/dist-cjs/link-card/LinkCard.css.js +1 -1
- package/dist-cjs/link-card/LinkCard.js +4 -1
- package/dist-cjs/link-card/LinkCard.js.map +1 -1
- package/dist-cjs/list-box/ListBox.css.js +1 -1
- package/dist-cjs/list-box/ListBox.js +1 -1
- package/dist-cjs/list-box/ListBox.js.map +1 -1
- package/dist-cjs/mega-menu/MegaMenuPanel.css.js +1 -1
- package/dist-cjs/overlay/Overlay.js +46 -29
- package/dist-cjs/overlay/Overlay.js.map +1 -1
- package/dist-cjs/overlay/OverlayContext.js +1 -0
- package/dist-cjs/overlay/OverlayContext.js.map +1 -1
- package/dist-cjs/overlay/OverlayPanel.css.js +1 -1
- package/dist-cjs/overlay/OverlayPanel.js +4 -2
- package/dist-cjs/overlay/OverlayPanel.js.map +1 -1
- package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js +2 -1
- package/dist-cjs/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
- package/dist-cjs/side-panel/SidePanel.css.js +1 -1
- package/dist-cjs/slider/internal/SliderTooltip.css.js +1 -1
- package/dist-cjs/slider/internal/SliderTooltip.js +1 -1
- package/dist-cjs/slider/internal/SliderTooltip.js.map +1 -1
- package/dist-cjs/toast/Toast.css.js +1 -1
- package/dist-cjs/toggle-button-group/ToggleButtonGroup.css.js +1 -1
- package/dist-cjs/toggletip/ToggletipPanel.css.js +1 -1
- package/dist-cjs/toolbar/Toolbar.css.js +1 -1
- package/dist-cjs/tooltip/Tooltip.css.js +1 -1
- package/dist-cjs/viewport/ViewportProvider.js.map +1 -1
- package/dist-es/avatar/Avatar.css.js +1 -1
- package/dist-es/avatar/Avatar.js +5 -2
- package/dist-es/avatar/Avatar.js.map +1 -1
- package/dist-es/breadcrumbs/Breadcrumb.css.js +4 -0
- package/dist-es/breadcrumbs/Breadcrumb.css.js.map +1 -0
- package/dist-es/breadcrumbs/Breadcrumb.js +102 -0
- package/dist-es/breadcrumbs/Breadcrumb.js.map +1 -0
- package/dist-es/breadcrumbs/BreadcrumbLabel.js +23 -0
- package/dist-es/breadcrumbs/BreadcrumbLabel.js.map +1 -0
- package/dist-es/breadcrumbs/BreadcrumbTrigger.js +50 -0
- package/dist-es/breadcrumbs/BreadcrumbTrigger.js.map +1 -0
- package/dist-es/breadcrumbs/Breadcrumbs.css.js +4 -0
- package/dist-es/breadcrumbs/Breadcrumbs.css.js.map +1 -0
- package/dist-es/breadcrumbs/Breadcrumbs.js +149 -0
- package/dist-es/breadcrumbs/Breadcrumbs.js.map +1 -0
- package/dist-es/breadcrumbs/internal/BreadcrumbContext.js +9 -0
- package/dist-es/breadcrumbs/internal/BreadcrumbContext.js.map +1 -0
- package/dist-es/breadcrumbs/internal/BreadcrumbOverflowDisclosure.js +241 -0
- package/dist-es/breadcrumbs/internal/BreadcrumbOverflowDisclosure.js.map +1 -0
- package/dist-es/breadcrumbs/internal/breadcrumbItems.js +19 -0
- package/dist-es/breadcrumbs/internal/breadcrumbItems.js.map +1 -0
- package/dist-es/card/Card.css.js +1 -1
- package/dist-es/card/Card.js +4 -1
- package/dist-es/card/Card.js.map +1 -1
- package/dist-es/card/CardContent.css.js +4 -0
- package/dist-es/card/CardContent.css.js.map +1 -0
- package/dist-es/card/CardContent.js +28 -0
- package/dist-es/card/CardContent.js.map +1 -0
- package/dist-es/card/CardFooter.css.js +4 -0
- package/dist-es/card/CardFooter.css.js.map +1 -0
- package/dist-es/card/CardFooter.js +28 -0
- package/dist-es/card/CardFooter.js.map +1 -0
- package/dist-es/card/CardHeader.css.js +4 -0
- package/dist-es/card/CardHeader.css.js.map +1 -0
- package/dist-es/card/CardHeader.js +28 -0
- package/dist-es/card/CardHeader.js.map +1 -0
- package/dist-es/card/hasCardSection.js +14 -0
- package/dist-es/card/hasCardSection.js.map +1 -0
- package/dist-es/file-drop-zone/FileDropZone.css.js +1 -1
- package/dist-es/index.js +7 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/interactable-card/InteractableCard.css.js +1 -1
- package/dist-es/interactable-card/InteractableCard.js +4 -1
- package/dist-es/interactable-card/InteractableCard.js.map +1 -1
- package/dist-es/kbd/Kbd.css.js +1 -1
- package/dist-es/link-card/LinkCard.css.js +1 -1
- package/dist-es/link-card/LinkCard.js +4 -1
- package/dist-es/link-card/LinkCard.js.map +1 -1
- package/dist-es/list-box/ListBox.css.js +1 -1
- package/dist-es/list-box/ListBox.js +1 -1
- package/dist-es/list-box/ListBox.js.map +1 -1
- package/dist-es/mega-menu/MegaMenuPanel.css.js +1 -1
- package/dist-es/overlay/Overlay.js +46 -29
- package/dist-es/overlay/Overlay.js.map +1 -1
- package/dist-es/overlay/OverlayContext.js +1 -0
- package/dist-es/overlay/OverlayContext.js.map +1 -1
- package/dist-es/overlay/OverlayPanel.css.js +1 -1
- package/dist-es/overlay/OverlayPanel.js +4 -2
- package/dist-es/overlay/OverlayPanel.js.map +1 -1
- package/dist-es/semantic-icon-provider/SemanticIconProvider.js +3 -2
- package/dist-es/semantic-icon-provider/SemanticIconProvider.js.map +1 -1
- package/dist-es/side-panel/SidePanel.css.js +1 -1
- package/dist-es/slider/internal/SliderTooltip.css.js +1 -1
- package/dist-es/slider/internal/SliderTooltip.js +1 -1
- package/dist-es/slider/internal/SliderTooltip.js.map +1 -1
- package/dist-es/toast/Toast.css.js +1 -1
- package/dist-es/toggle-button-group/ToggleButtonGroup.css.js +1 -1
- package/dist-es/toggletip/ToggletipPanel.css.js +1 -1
- package/dist-es/toolbar/Toolbar.css.js +1 -1
- package/dist-es/tooltip/Tooltip.css.js +1 -1
- package/dist-es/viewport/ViewportProvider.js.map +1 -1
- package/dist-types/avatar/Avatar.d.ts +11 -1
- package/dist-types/breadcrumbs/Breadcrumb.d.ts +23 -0
- package/dist-types/breadcrumbs/BreadcrumbLabel.d.ts +4 -0
- package/dist-types/breadcrumbs/BreadcrumbTrigger.d.ts +8 -0
- package/dist-types/breadcrumbs/Breadcrumbs.d.ts +32 -0
- package/dist-types/breadcrumbs/index.d.ts +4 -0
- package/dist-types/breadcrumbs/internal/BreadcrumbContext.d.ts +14 -0
- package/dist-types/breadcrumbs/internal/BreadcrumbOverflowDisclosure.d.ts +9 -0
- package/dist-types/breadcrumbs/internal/breadcrumbItems.d.ts +9 -0
- package/dist-types/breakpoints/BreakpointProvider.d.ts +1 -1
- package/dist-types/card/CardContent.d.ts +4 -0
- package/dist-types/card/CardFooter.d.ts +4 -0
- package/dist-types/card/CardHeader.d.ts +4 -0
- package/dist-types/card/hasCardSection.d.ts +2 -0
- package/dist-types/card/index.d.ts +3 -0
- package/dist-types/dialog/Dialog.d.ts +1 -1
- package/dist-types/form-field/FormFieldHelperText.d.ts +1 -1
- package/dist-types/form-field/FormFieldLabel.d.ts +1 -1
- package/dist-types/index.d.ts +1 -0
- package/dist-types/mega-menu/MegaMenu.d.ts +1 -1
- package/dist-types/menu/Menu.d.ts +1 -1
- package/dist-types/menu/MenuBase.d.ts +1 -1
- package/dist-types/navigation-item/ExpansionIcon.d.ts +1 -1
- package/dist-types/overlay/Overlay.d.ts +14 -3
- package/dist-types/overlay/OverlayContext.d.ts +1 -0
- package/dist-types/pagination/PageRanges.d.ts +1 -1
- package/dist-types/radio-button/RadioButtonIcon.d.ts +1 -1
- package/dist-types/salt-provider/SaltProvider.d.ts +2 -2
- package/dist-types/salt-provider/ThemeApplicator.d.ts +1 -1
- package/dist-types/semantic-icon-provider/SemanticIconProvider.d.ts +2 -1
- package/dist-types/side-panel/SidePanelProvider.d.ts +1 -1
- package/dist-types/slider/internal/SliderThumb.d.ts +1 -1
- package/dist-types/slider/internal/SliderTooltip.d.ts +1 -1
- package/dist-types/spinner/svgSpinners/SpinnerSVG.d.ts +1 -1
- package/dist-types/stepper/internal/StepConnector.d.ts +1 -1
- package/dist-types/stepper/internal/StepExpandTrigger.d.ts +1 -1
- package/dist-types/stepper/internal/StepIcon.d.ts +1 -1
- package/dist-types/stepper/internal/StepScreenReaderOnly.d.ts +1 -1
- package/dist-types/stepper/internal/StepText.d.ts +1 -1
- package/dist-types/stepper/internal/StepperProvider.d.ts +1 -1
- package/dist-types/tabs/internal/overflow/TabSlot.d.ts +1 -1
- package/dist-types/toggletip/Toggletip.d.ts +1 -1
- package/dist-types/toolbar/ToolbarOverflow.d.ts +4 -4
- package/dist-types/toolbar/ToolbarOverflowFloatingBoundary.d.ts +2 -2
- package/dist-types/tooltip/TooltipBase.d.ts +1 -1
- package/dist-types/utils/useFloatingUI/useFloatingUI.d.ts +2 -2
- package/dist-types/vertical-navigation/SubMenuContext.d.ts +1 -1
- package/dist-types/vertical-navigation/VerticalNavigationItemExpansionIcon.d.ts +1 -1
- package/dist-types/viewport/ViewportProvider.d.ts +2 -2
- package/package.json +1 -1
|
@@ -0,0 +1,243 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var react = require('@floating-ui/react');
|
|
5
|
+
var icons = require('@salt-ds/icons');
|
|
6
|
+
var window = require('@salt-ds/window');
|
|
7
|
+
var React = require('react');
|
|
8
|
+
var Button = require('../../button/Button.js');
|
|
9
|
+
var makePrefixer = require('../../utils/makePrefixer.js');
|
|
10
|
+
require('clsx');
|
|
11
|
+
var useFloatingUI = require('../../utils/useFloatingUI/useFloatingUI.js');
|
|
12
|
+
var useForkRef = require('../../utils/useForkRef.js');
|
|
13
|
+
var useId = require('../../utils/useId.js');
|
|
14
|
+
require('../../salt-provider/SaltProvider.js');
|
|
15
|
+
require('../../viewport/ViewportProvider.js');
|
|
16
|
+
var BreadcrumbContext = require('./BreadcrumbContext.js');
|
|
17
|
+
|
|
18
|
+
const withBaseName = makePrefixer.makePrefixer("saltBreadcrumbs");
|
|
19
|
+
function BreadcrumbOverflowDisclosure({
|
|
20
|
+
currentIndex,
|
|
21
|
+
items,
|
|
22
|
+
render
|
|
23
|
+
}) {
|
|
24
|
+
var _a, _b;
|
|
25
|
+
const [open, setOpen] = React.useState(false);
|
|
26
|
+
const targetWindow = window.useWindow();
|
|
27
|
+
const itemElements = React.useRef(/* @__PURE__ */ new Map());
|
|
28
|
+
const triggerRef = React.useRef(null);
|
|
29
|
+
const disclosureId = useId.useId();
|
|
30
|
+
const { Component: FloatingComponent } = useFloatingUI.useFloatingComponent();
|
|
31
|
+
const focusTrigger = React.useCallback(() => {
|
|
32
|
+
targetWindow == null ? void 0 : targetWindow.requestAnimationFrame(() => {
|
|
33
|
+
var _a2;
|
|
34
|
+
(_a2 = triggerRef.current) == null ? void 0 : _a2.focus({ preventScroll: true });
|
|
35
|
+
});
|
|
36
|
+
}, [targetWindow]);
|
|
37
|
+
const getFocusableItems = React.useCallback(
|
|
38
|
+
() => items.map((_, index) => itemElements.current.get(index)).filter((item) => item !== void 0),
|
|
39
|
+
[items]
|
|
40
|
+
);
|
|
41
|
+
const focusItem = React.useCallback(
|
|
42
|
+
(position) => {
|
|
43
|
+
const focusableItems = getFocusableItems();
|
|
44
|
+
const item = position === "first" ? focusableItems[0] : focusableItems[focusableItems.length - 1];
|
|
45
|
+
item == null ? void 0 : item.focus({ preventScroll: true });
|
|
46
|
+
return item !== void 0;
|
|
47
|
+
},
|
|
48
|
+
[getFocusableItems]
|
|
49
|
+
);
|
|
50
|
+
const focusItemByOffset = React.useCallback(
|
|
51
|
+
(offset2) => {
|
|
52
|
+
var _a2;
|
|
53
|
+
const focusableItems = getFocusableItems();
|
|
54
|
+
const activeIndex = focusableItems.indexOf(
|
|
55
|
+
targetWindow == null ? void 0 : targetWindow.document.activeElement
|
|
56
|
+
);
|
|
57
|
+
if (activeIndex === -1) {
|
|
58
|
+
return focusItem(offset2 > 0 ? "first" : "last");
|
|
59
|
+
}
|
|
60
|
+
const nextIndex = Math.min(
|
|
61
|
+
Math.max(activeIndex + offset2, 0),
|
|
62
|
+
focusableItems.length - 1
|
|
63
|
+
);
|
|
64
|
+
(_a2 = focusableItems[nextIndex]) == null ? void 0 : _a2.focus({ preventScroll: true });
|
|
65
|
+
return focusableItems[nextIndex] !== void 0;
|
|
66
|
+
},
|
|
67
|
+
[focusItem, getFocusableItems, targetWindow]
|
|
68
|
+
);
|
|
69
|
+
const { context, elements, refs, strategy, x, y } = useFloatingUI.useFloatingUI({
|
|
70
|
+
open,
|
|
71
|
+
onOpenChange(nextOpen, _event, reason) {
|
|
72
|
+
setOpen(nextOpen);
|
|
73
|
+
if (!nextOpen && reason === "escape-key") {
|
|
74
|
+
focusTrigger();
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
placement: "bottom-start",
|
|
78
|
+
middleware: [
|
|
79
|
+
react.offset(1),
|
|
80
|
+
react.size({
|
|
81
|
+
apply({ availableHeight, elements: elements2 }) {
|
|
82
|
+
Object.assign(elements2.floating.style, {
|
|
83
|
+
maxHeight: `${availableHeight}px`
|
|
84
|
+
});
|
|
85
|
+
}
|
|
86
|
+
}),
|
|
87
|
+
react.flip(),
|
|
88
|
+
react.shift({
|
|
89
|
+
padding: 8
|
|
90
|
+
})
|
|
91
|
+
]
|
|
92
|
+
});
|
|
93
|
+
const { getFloatingProps, getReferenceProps } = react.useInteractions([
|
|
94
|
+
react.useClick(context),
|
|
95
|
+
react.useDismiss(context)
|
|
96
|
+
]);
|
|
97
|
+
const handleTriggerRef = useForkRef.useForkRef(
|
|
98
|
+
triggerRef,
|
|
99
|
+
refs.setReference
|
|
100
|
+
);
|
|
101
|
+
const handleTriggerKeyDown = (event) => {
|
|
102
|
+
if (open && (event.key === "ArrowDown" || event.key === "ArrowRight")) {
|
|
103
|
+
event.preventDefault();
|
|
104
|
+
focusItem("first");
|
|
105
|
+
return;
|
|
106
|
+
}
|
|
107
|
+
if (open && (event.key === "ArrowUp" || event.key === "ArrowLeft")) {
|
|
108
|
+
event.preventDefault();
|
|
109
|
+
focusItem("last");
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
if (event.key === "Tab" && open && !event.shiftKey) {
|
|
113
|
+
if (focusItem("first")) {
|
|
114
|
+
event.preventDefault();
|
|
115
|
+
}
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
};
|
|
119
|
+
const handleTriggerBlur = (event) => {
|
|
120
|
+
var _a2;
|
|
121
|
+
const nextFocusedElement = event.relatedTarget;
|
|
122
|
+
if (nextFocusedElement && ((_a2 = elements.floating) == null ? void 0 : _a2.contains(nextFocusedElement))) {
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
setOpen(false);
|
|
126
|
+
};
|
|
127
|
+
const handleDisclosureKeyDown = (event) => {
|
|
128
|
+
if (event.key === "Tab") {
|
|
129
|
+
const focusableItems = getFocusableItems();
|
|
130
|
+
const activeIndex = focusableItems.indexOf(
|
|
131
|
+
targetWindow == null ? void 0 : targetWindow.document.activeElement
|
|
132
|
+
);
|
|
133
|
+
const shouldReturnToTrigger = event.shiftKey ? activeIndex === 0 : activeIndex === focusableItems.length - 1;
|
|
134
|
+
if (shouldReturnToTrigger) {
|
|
135
|
+
event.preventDefault();
|
|
136
|
+
setOpen(false);
|
|
137
|
+
focusTrigger();
|
|
138
|
+
}
|
|
139
|
+
return;
|
|
140
|
+
}
|
|
141
|
+
if (event.key === "ArrowDown" || event.key === "ArrowRight") {
|
|
142
|
+
event.preventDefault();
|
|
143
|
+
focusItemByOffset(1);
|
|
144
|
+
return;
|
|
145
|
+
}
|
|
146
|
+
if (event.key === "ArrowUp" || event.key === "ArrowLeft") {
|
|
147
|
+
event.preventDefault();
|
|
148
|
+
focusItemByOffset(-1);
|
|
149
|
+
return;
|
|
150
|
+
}
|
|
151
|
+
if (event.key === "Home") {
|
|
152
|
+
event.preventDefault();
|
|
153
|
+
focusItem("first");
|
|
154
|
+
return;
|
|
155
|
+
}
|
|
156
|
+
if (event.key === "End") {
|
|
157
|
+
event.preventDefault();
|
|
158
|
+
focusItem("last");
|
|
159
|
+
}
|
|
160
|
+
};
|
|
161
|
+
const handleDisclosureBlur = (event) => {
|
|
162
|
+
var _a2;
|
|
163
|
+
const nextFocusedElement = event.relatedTarget;
|
|
164
|
+
if (nextFocusedElement && (event.currentTarget.contains(nextFocusedElement) || ((_a2 = triggerRef.current) == null ? void 0 : _a2.contains(nextFocusedElement)))) {
|
|
165
|
+
return;
|
|
166
|
+
}
|
|
167
|
+
setOpen(false);
|
|
168
|
+
};
|
|
169
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
170
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
171
|
+
Button.Button,
|
|
172
|
+
{
|
|
173
|
+
"aria-controls": disclosureId,
|
|
174
|
+
"aria-expanded": open,
|
|
175
|
+
"aria-label": "Additional breadcrumbs",
|
|
176
|
+
appearance: "transparent",
|
|
177
|
+
className: withBaseName("collapseButton"),
|
|
178
|
+
ref: handleTriggerRef,
|
|
179
|
+
...getReferenceProps({
|
|
180
|
+
onBlur: handleTriggerBlur,
|
|
181
|
+
onKeyDown: handleTriggerKeyDown
|
|
182
|
+
}),
|
|
183
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(icons.OverflowMenuIcon, { "aria-hidden": true })
|
|
184
|
+
}
|
|
185
|
+
),
|
|
186
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
187
|
+
FloatingComponent,
|
|
188
|
+
{
|
|
189
|
+
className: withBaseName("disclosure"),
|
|
190
|
+
focusManagerProps: context ? {
|
|
191
|
+
closeOnFocusOut: true,
|
|
192
|
+
context,
|
|
193
|
+
initialFocus: -1,
|
|
194
|
+
modal: false,
|
|
195
|
+
returnFocus: false
|
|
196
|
+
} : void 0,
|
|
197
|
+
height: (_a = elements.floating) == null ? void 0 : _a.offsetHeight,
|
|
198
|
+
left: x ?? 0,
|
|
199
|
+
open,
|
|
200
|
+
position: strategy,
|
|
201
|
+
ref: refs.setFloating,
|
|
202
|
+
top: y ?? 0,
|
|
203
|
+
width: (_b = elements.floating) == null ? void 0 : _b.offsetWidth,
|
|
204
|
+
...getFloatingProps({
|
|
205
|
+
id: disclosureId,
|
|
206
|
+
onBlur: handleDisclosureBlur,
|
|
207
|
+
onKeyDown: handleDisclosureKeyDown
|
|
208
|
+
}),
|
|
209
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
210
|
+
"ol",
|
|
211
|
+
{
|
|
212
|
+
"aria-label": "Hidden breadcrumb levels",
|
|
213
|
+
className: withBaseName("disclosureList"),
|
|
214
|
+
children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
215
|
+
BreadcrumbContext.BreadcrumbContext.Provider,
|
|
216
|
+
{
|
|
217
|
+
value: {
|
|
218
|
+
current: item.index === currentIndex,
|
|
219
|
+
onNavigate: () => setOpen(false),
|
|
220
|
+
placement: "disclosure",
|
|
221
|
+
render,
|
|
222
|
+
showSeparator: false,
|
|
223
|
+
triggerRef: (element) => {
|
|
224
|
+
if ((element == null ? void 0 : element.tagName) === "A" && element.hasAttribute("href")) {
|
|
225
|
+
itemElements.current.set(index, element);
|
|
226
|
+
} else {
|
|
227
|
+
itemElements.current.delete(index);
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
},
|
|
231
|
+
children: item.element
|
|
232
|
+
},
|
|
233
|
+
item.key
|
|
234
|
+
))
|
|
235
|
+
}
|
|
236
|
+
)
|
|
237
|
+
}
|
|
238
|
+
)
|
|
239
|
+
] });
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
exports.BreadcrumbOverflowDisclosure = BreadcrumbOverflowDisclosure;
|
|
243
|
+
//# sourceMappingURL=BreadcrumbOverflowDisclosure.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BreadcrumbOverflowDisclosure.js","sources":["../src/breadcrumbs/internal/BreadcrumbOverflowDisclosure.tsx"],"sourcesContent":["import {\n flip,\n offset,\n shift,\n size,\n useClick,\n useDismiss,\n useInteractions,\n} from \"@floating-ui/react\";\nimport { OverflowMenuIcon } from \"@salt-ds/icons\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n type FocusEvent,\n type KeyboardEvent,\n useCallback,\n useRef,\n useState,\n} from \"react\";\nimport { Button } from \"../../button\";\nimport {\n makePrefixer,\n type RenderPropsType,\n useFloatingComponent,\n useFloatingUI,\n useForkRef,\n useId,\n} from \"../../utils\";\nimport { BreadcrumbContext } from \"./BreadcrumbContext\";\nimport type { NormalizedBreadcrumb } from \"./breadcrumbItems\";\n\nconst withBaseName = makePrefixer(\"saltBreadcrumbs\");\n\ninterface BreadcrumbOverflowDisclosureProps {\n currentIndex: number;\n items: NormalizedBreadcrumb[];\n render?: RenderPropsType[\"render\"];\n}\n\nexport function BreadcrumbOverflowDisclosure({\n currentIndex,\n items,\n render,\n}: BreadcrumbOverflowDisclosureProps) {\n const [open, setOpen] = useState(false);\n const targetWindow = useWindow();\n const itemElements = useRef(new Map<number, HTMLAnchorElement>());\n const triggerRef = useRef<HTMLButtonElement>(null);\n const disclosureId = useId();\n const { Component: FloatingComponent } = useFloatingComponent();\n\n const focusTrigger = useCallback(() => {\n targetWindow?.requestAnimationFrame(() => {\n triggerRef.current?.focus({ preventScroll: true });\n });\n }, [targetWindow]);\n\n const getFocusableItems = useCallback(\n () =>\n items\n .map((_, index) => itemElements.current.get(index))\n .filter((item): item is HTMLAnchorElement => item !== undefined),\n [items],\n );\n\n const focusItem = useCallback(\n (position: \"first\" | \"last\") => {\n const focusableItems = getFocusableItems();\n const item =\n position === \"first\"\n ? focusableItems[0]\n : focusableItems[focusableItems.length - 1];\n\n item?.focus({ preventScroll: true });\n return item !== undefined;\n },\n [getFocusableItems],\n );\n\n const focusItemByOffset = useCallback(\n (offset: number) => {\n const focusableItems = getFocusableItems();\n const activeIndex = focusableItems.indexOf(\n targetWindow?.document.activeElement as HTMLAnchorElement,\n );\n\n if (activeIndex === -1) {\n return focusItem(offset > 0 ? \"first\" : \"last\");\n }\n\n const nextIndex = Math.min(\n Math.max(activeIndex + offset, 0),\n focusableItems.length - 1,\n );\n\n focusableItems[nextIndex]?.focus({ preventScroll: true });\n return focusableItems[nextIndex] !== undefined;\n },\n [focusItem, getFocusableItems, targetWindow],\n );\n\n const { context, elements, refs, strategy, x, y } = useFloatingUI({\n open,\n onOpenChange(nextOpen, _event, reason) {\n setOpen(nextOpen);\n\n if (!nextOpen && reason === \"escape-key\") {\n focusTrigger();\n }\n },\n placement: \"bottom-start\",\n middleware: [\n offset(1),\n size({\n apply({ availableHeight, elements }) {\n Object.assign(elements.floating.style, {\n maxHeight: `${availableHeight}px`,\n });\n },\n }),\n flip(),\n shift({\n padding: 8,\n }),\n ],\n });\n\n const { getFloatingProps, getReferenceProps } = useInteractions([\n useClick(context),\n useDismiss(context),\n ]);\n const handleTriggerRef = useForkRef<HTMLButtonElement>(\n triggerRef,\n refs.setReference,\n );\n\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (open && (event.key === \"ArrowDown\" || event.key === \"ArrowRight\")) {\n event.preventDefault();\n focusItem(\"first\");\n return;\n }\n\n if (open && (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\")) {\n event.preventDefault();\n focusItem(\"last\");\n return;\n }\n\n if (event.key === \"Tab\" && open && !event.shiftKey) {\n if (focusItem(\"first\")) {\n event.preventDefault();\n }\n return;\n }\n };\n\n const handleTriggerBlur = (event: FocusEvent<HTMLButtonElement>) => {\n const nextFocusedElement = event.relatedTarget as Node | null;\n\n if (nextFocusedElement && elements.floating?.contains(nextFocusedElement)) {\n return;\n }\n\n setOpen(false);\n };\n\n const handleDisclosureKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"Tab\") {\n const focusableItems = getFocusableItems();\n const activeIndex = focusableItems.indexOf(\n targetWindow?.document.activeElement as HTMLAnchorElement,\n );\n const shouldReturnToTrigger = event.shiftKey\n ? activeIndex === 0\n : activeIndex === focusableItems.length - 1;\n\n if (shouldReturnToTrigger) {\n event.preventDefault();\n setOpen(false);\n focusTrigger();\n }\n\n return;\n }\n\n if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n event.preventDefault();\n focusItemByOffset(1);\n return;\n }\n\n if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n event.preventDefault();\n focusItemByOffset(-1);\n return;\n }\n\n if (event.key === \"Home\") {\n event.preventDefault();\n focusItem(\"first\");\n return;\n }\n\n if (event.key === \"End\") {\n event.preventDefault();\n focusItem(\"last\");\n }\n };\n\n const handleDisclosureBlur = (event: FocusEvent<HTMLDivElement>) => {\n const nextFocusedElement = event.relatedTarget as Node | null;\n\n if (\n nextFocusedElement &&\n (event.currentTarget.contains(nextFocusedElement) ||\n triggerRef.current?.contains(nextFocusedElement))\n ) {\n return;\n }\n\n setOpen(false);\n };\n\n return (\n <>\n <Button\n aria-controls={disclosureId}\n aria-expanded={open}\n aria-label=\"Additional breadcrumbs\"\n appearance=\"transparent\"\n className={withBaseName(\"collapseButton\")}\n ref={handleTriggerRef}\n {...getReferenceProps({\n onBlur: handleTriggerBlur,\n onKeyDown: handleTriggerKeyDown,\n })}\n >\n <OverflowMenuIcon aria-hidden />\n </Button>\n <FloatingComponent\n className={withBaseName(\"disclosure\")}\n focusManagerProps={\n context\n ? {\n closeOnFocusOut: true,\n context,\n initialFocus: -1,\n modal: false,\n returnFocus: false,\n }\n : undefined\n }\n height={elements.floating?.offsetHeight}\n left={x ?? 0}\n open={open}\n position={strategy}\n ref={refs.setFloating}\n top={y ?? 0}\n width={elements.floating?.offsetWidth}\n {...getFloatingProps({\n id: disclosureId,\n onBlur: handleDisclosureBlur,\n onKeyDown: handleDisclosureKeyDown,\n })}\n >\n <ol\n aria-label=\"Hidden breadcrumb levels\"\n className={withBaseName(\"disclosureList\")}\n >\n {items.map((item, index) => (\n <BreadcrumbContext.Provider\n key={item.key}\n value={{\n current: item.index === currentIndex,\n onNavigate: () => setOpen(false),\n placement: \"disclosure\",\n render,\n showSeparator: false,\n triggerRef: (element) => {\n // Placeholder anchors (no href) are not focusable, so only\n // navigable items take part in disclosure focus movement.\n if (\n element?.tagName === \"A\" &&\n element.hasAttribute(\"href\")\n ) {\n itemElements.current.set(index, element);\n } else {\n itemElements.current.delete(index);\n }\n },\n }}\n >\n {item.element}\n </BreadcrumbContext.Provider>\n ))}\n </ol>\n </FloatingComponent>\n </>\n );\n}\n"],"names":["makePrefixer","useState","useWindow","useRef","useId","useFloatingComponent","useCallback","_a","offset","useFloatingUI","size","elements","flip","shift","useInteractions","useClick","useDismiss","useForkRef","jsxs","Fragment","jsx","Button","OverflowMenuIcon","BreadcrumbContext"],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
|
|
5
|
+
function isFragmentElement(child) {
|
|
6
|
+
return React.isValidElement(child) && child.type === React.Fragment;
|
|
7
|
+
}
|
|
8
|
+
function flattenBreadcrumbItems(children) {
|
|
9
|
+
const flattenedChildren = [];
|
|
10
|
+
React.Children.forEach(children, (child) => {
|
|
11
|
+
if (isFragmentElement(child)) {
|
|
12
|
+
flattenedChildren.push(...flattenBreadcrumbItems(child.props.children));
|
|
13
|
+
} else if (child !== null && child !== void 0 && typeof child !== "boolean") {
|
|
14
|
+
flattenedChildren.push(child);
|
|
15
|
+
}
|
|
16
|
+
});
|
|
17
|
+
return flattenedChildren;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
exports.flattenBreadcrumbItems = flattenBreadcrumbItems;
|
|
21
|
+
//# sourceMappingURL=breadcrumbItems.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumbItems.js","sources":["../src/breadcrumbs/internal/breadcrumbItems.ts"],"sourcesContent":["import {\n Children,\n Fragment,\n isValidElement,\n type Key,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport type { BreadcrumbProps } from \"../Breadcrumb\";\n\nexport interface NormalizedBreadcrumb {\n element: ReactElement<BreadcrumbProps>;\n index: number;\n key: Key;\n props: BreadcrumbProps;\n}\n\nfunction isFragmentElement(\n child: ReactNode,\n): child is ReactElement<{ children?: ReactNode }> {\n return (\n isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment\n );\n}\n\nexport function flattenBreadcrumbItems(children: ReactNode): ReactNode[] {\n const flattenedChildren: ReactNode[] = [];\n\n Children.forEach(children, (child) => {\n if (isFragmentElement(child)) {\n flattenedChildren.push(...flattenBreadcrumbItems(child.props.children));\n } else if (\n child !== null &&\n child !== undefined &&\n typeof child !== \"boolean\"\n ) {\n flattenedChildren.push(child);\n }\n });\n\n return flattenedChildren;\n}\n"],"names":["isValidElement","Fragment","Children"],"mappings":";;;;AAiBA,SAAS,kBACP,KAAA,EACiD;AACjD,EAAA,OACEA,oBAAA,CAAyC,KAAK,CAAA,IAAK,KAAA,CAAM,IAAA,KAASC,cAAA;AAEtE;AAEO,SAAS,uBAAuB,QAAA,EAAkC;AACvE,EAAA,MAAM,oBAAiC,EAAC;AAExC,EAAAC,cAAA,CAAS,OAAA,CAAQ,QAAA,EAAU,CAAC,KAAA,KAAU;AACpC,IAAA,IAAI,iBAAA,CAAkB,KAAK,CAAA,EAAG;AAC5B,MAAA,iBAAA,CAAkB,KAAK,GAAG,sBAAA,CAAuB,KAAA,CAAM,KAAA,CAAM,QAAQ,CAAC,CAAA;AAAA,IACxE,WACE,KAAA,KAAU,IAAA,IACV,UAAU,MAAA,IACV,OAAO,UAAU,SAAA,EACjB;AACA,MAAA,iBAAA,CAAkB,KAAK,KAAK,CAAA;AAAA,IAC9B;AAAA,EACF,CAAC,CAAA;AAED,EAAA,OAAO,iBAAA;AACT;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/* Styles applied to the root element */\n.saltCard {\n border-width: var(--saltCard-borderWidth, var(--salt-size-fixed-100));\n border-style: var(--salt-borderStyle-solid);\n padding: var(--saltCard-padding, var(--
|
|
3
|
+
var css_248z = "/* Styles applied to the root element */\n.saltCard {\n border-width: var(--saltCard-borderWidth, var(--salt-size-fixed-100));\n border-style: var(--salt-borderStyle-solid);\n padding: var(--saltCard-padding, var(--card-padding));\n position: relative;\n box-shadow: var(--salt-overlayable-shadow);\n transition: box-shadow var(--salt-duration-instant) ease-in-out;\n box-sizing: border-box;\n border-radius: var(--saltCard-borderRadius, var(--salt-palette-corner, 0));\n overflow: hidden;\n --card-accent-color: var(--salt-sentiment-accent-background);\n --card-padding: var(--salt-spacing-200);\n}\n\n.saltCard.saltCard-sectioned {\n padding: 0;\n display: flex;\n flex-direction: column;\n}\n\n@supports selector(:has(*)) {\n .saltCard:has(> .saltCardHeader, > .saltCardContent, > .saltCardFooter) {\n padding: 0;\n display: flex;\n flex-direction: column;\n }\n}\n\n.saltCard-primary {\n background: var(--saltCard-background, var(--salt-container-primary-background));\n border-color: var(--salt-container-bold-borderColor);\n}\n\n.saltCard-secondary {\n background: var(--saltCard-background, var(--salt-container-secondary-background));\n border-color: var(--salt-container-bold-borderColor);\n}\n\n.saltCard-tertiary {\n background: var(--saltCard-background, var(--salt-container-tertiary-background));\n border-color: var(--salt-container-bold-borderColor);\n}\n\n.saltCard-ghost {\n background: var(--saltCard-background, var(--salt-container-ghost-background));\n border-color: var(--salt-container-ghost-borderColor);\n}\n\n/* Styles applied to create accent */\n.saltCard-accent::after {\n content: \"\";\n position: absolute;\n background-color: var(--saltCard-accent-color, var(--card-accent-color));\n}\n\n/* Styles applied to Card if `accent=\"bottom\"` (default) */\n.saltCard-accentBottom::after {\n left: calc(-1 * var(--salt-size-fixed-100));\n bottom: calc(-1 * var(--salt-size-fixed-100));\n height: var(--salt-size-bar);\n width: calc(100% + var(--salt-size-fixed-200));\n}\n\n/* Styles applied to Card if `accent=\"left\"` */\n.saltCard-accentLeft::after {\n left: calc(-1 * var(--salt-size-fixed-100));\n top: calc(-1 * var(--salt-size-fixed-100));\n height: calc(100% + var(--salt-size-fixed-200));\n width: var(--salt-size-bar);\n}\n\n/* Styles applied to Card if `accent=\"top\"` */\n.saltCard-accentTop::after {\n left: calc(-1 * var(--salt-size-fixed-100));\n top: calc(-1 * var(--salt-size-fixed-100));\n height: var(--salt-size-bar);\n width: calc(100% + var(--salt-size-fixed-200));\n}\n\n/* Styles applied to Card if `accent=\"right\"` */\n.saltCard-accentRight::after {\n right: calc(-1 * var(--salt-size-fixed-100));\n top: calc(-1 * var(--salt-size-fixed-100));\n height: calc(100% + var(--salt-size-fixed-200));\n width: var(--salt-size-bar);\n}\n\n/*\n * **Deprecated:** The following styles are deprecated\n * Use Interactable Card component instead\n * for interactable styling\n */\n\n/* **Deprecated:** Styles applied if `interactable={true}` */\n.saltCard-interactable {\n display: block;\n transition: none;\n}\n\n/* **Deprecated:** Styles applied on hover if `interactable={true}` */\na:focus .saltCard-interactable,\n.saltCard-interactable:hover {\n box-shadow: var(--saltCard-boxShadow-hover, var(--salt-overlayable-shadow-hover));\n cursor: var(--saltCard-cursor-hover, var(--salt-cursor-hover));\n border-color: var(--salt-actionable-accented-borderColor-hover);\n position: relative;\n}\n\n/* Styles applied if `hoverable` is set */\n@media (hover: hover) {\n .saltCard-hoverable:hover {\n box-shadow: var(--saltCard-boxShadow-hover, var(--salt-overlayable-shadow-hover));\n border-color: var(--salt-actionable-accented-borderColor-hover);\n }\n}\n\n/* **Deprecated:** Styles applied on active state if `interactable={true}` */\n.saltCard-interactable:active {\n border-color: var(--salt-actionable-accented-borderColor-active);\n box-shadow: var(--saltCard-boxShadow-active, var(--salt-overlayable-shadow-hover));\n outline: var(--salt-focused-outline);\n outline-offset: var(--salt-focused-outlineOffset);\n}\n\n/* **Deprecated:** Styles applied on hover if `interactable={true}` and `disabled={true}` */\na:focus .saltCard-interactable.saltCard-disabled,\n.saltCard-interactable.saltCard-disabled:hover,\n.saltCard-interactable.saltCard-disabled:active {\n box-shadow: var(--saltCard-boxShadow-disabled, var(--salt-overlayable-shadow));\n}\n\n/* **Deprecated:** Styles applied if `disabled={true}` */\n.saltCard-disabled,\n.saltCard-disabled.saltCard-interactable,\na:focus .saltCard-interactable.saltCard-disabled {\n border-color: var(--salt-container-bold-borderColor-disabled);\n color: var(--saltCard-color-disabled, var(--salt-content-primary-foreground-disabled));\n cursor: var(--saltCard-cursor-disabled, var(--salt-cursor-disabled));\n outline: none;\n}\n\n/* **Deprecated:** Styles applied to nested divs if `disabled={true}` */\n.saltCard-disabled div {\n pointer-events: none;\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = css_248z;
|
|
6
6
|
//# sourceMappingURL=Card.css.js.map
|
package/dist-cjs/card/Card.js
CHANGED
|
@@ -12,6 +12,7 @@ require('../utils/useId.js');
|
|
|
12
12
|
require('../salt-provider/SaltProvider.js');
|
|
13
13
|
require('../viewport/ViewportProvider.js');
|
|
14
14
|
var Card$1 = require('./Card.css.js');
|
|
15
|
+
var hasCardSection = require('./hasCardSection.js');
|
|
15
16
|
|
|
16
17
|
const withBaseName = makePrefixer.makePrefixer("saltCard");
|
|
17
18
|
const Card = React.forwardRef(
|
|
@@ -32,6 +33,7 @@ const Card = React.forwardRef(
|
|
|
32
33
|
css: Card$1,
|
|
33
34
|
window: targetWindow
|
|
34
35
|
});
|
|
36
|
+
const sectioned = hasCardSection.hasCardSection(children);
|
|
35
37
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
36
38
|
"div",
|
|
37
39
|
{
|
|
@@ -44,7 +46,8 @@ const Card = React.forwardRef(
|
|
|
44
46
|
[withBaseName("hoverable")]: hoverable,
|
|
45
47
|
/* **Deprecated:** InteractableCard should be used instead for these features */
|
|
46
48
|
[withBaseName("disabled")]: disabled,
|
|
47
|
-
[withBaseName("interactable")]: interactable
|
|
49
|
+
[withBaseName("interactable")]: interactable,
|
|
50
|
+
[withBaseName("sectioned")]: sectioned
|
|
48
51
|
},
|
|
49
52
|
className
|
|
50
53
|
),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","sources":["../src/card/Card.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport cardCss from \"./Card.css\";\n\nconst withBaseName = makePrefixer(\"saltCard\");\nexport interface CardProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If provided an accent is shown in the specified position.\n */\n accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, the card will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the card will have hover styling.\n */\n hoverable?: boolean;\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, interactive styles will be applied to `Card`. These styles give prominence to certain content\n * on the page.\n */\n interactable?: boolean;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"ghost\";\n}\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n function Card(props, ref) {\n const {\n accent,\n children,\n className,\n disabled,\n interactable,\n hoverable,\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card\",\n css: cardCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"accent\")]: accent,\n [withBaseName(`accent${capitalize(accent || \"\")}`)]: accent,\n [withBaseName(\"hoverable\")]: hoverable,\n /* **Deprecated:** InteractableCard should be used instead for these features */\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"interactable\")]: interactable,\n },\n className,\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Card","useWindow","useComponentCssInjection","cardCss","jsx","clsx","capitalize"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Card.js","sources":["../src/card/Card.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\n\nimport { capitalize, makePrefixer } from \"../utils\";\n\nimport cardCss from \"./Card.css\";\nimport { hasCardSection } from \"./hasCardSection\";\n\nconst withBaseName = makePrefixer(\"saltCard\");\nexport interface CardProps extends ComponentPropsWithoutRef<\"div\"> {\n /**\n * If provided an accent is shown in the specified position.\n */\n accent?: \"bottom\" | \"top\" | \"left\" | \"right\";\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, the card will be disabled.\n */\n disabled?: boolean;\n /**\n * If `true` the card will have hover styling.\n */\n hoverable?: boolean;\n /**\n * **Deprecated:** Use the InteractableCard component instead\n *\n * If `true`, interactive styles will be applied to `Card`. These styles give prominence to certain content\n * on the page.\n */\n interactable?: boolean;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"ghost\";\n}\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n function Card(props, ref) {\n const {\n accent,\n children,\n className,\n disabled,\n interactable,\n hoverable,\n variant = \"primary\",\n ...rest\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card\",\n css: cardCss,\n window: targetWindow,\n });\n\n const sectioned = hasCardSection(children);\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"accent\")]: accent,\n [withBaseName(`accent${capitalize(accent || \"\")}`)]: accent,\n [withBaseName(\"hoverable\")]: hoverable,\n /* **Deprecated:** InteractableCard should be used instead for these features */\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"interactable\")]: interactable,\n [withBaseName(\"sectioned\")]: sectioned,\n },\n className,\n )}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","Card","useWindow","useComponentCssInjection","cardCss","hasCardSection","jsx","clsx","capitalize"],"mappings":";;;;;;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,0BAAa,UAAU,CAAA;AA6BrC,MAAM,IAAA,GAAOC,gBAAA;AAAA,EAClB,SAASC,KAAAA,CAAK,KAAA,EAAO,GAAA,EAAK;AACxB,IAAA,MAAM;AAAA,MACJ,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,YAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA,GAAU,SAAA;AAAA,MACV,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,WAAA;AAAA,MACR,GAAA,EAAKC,MAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,SAAA,GAAYC,8BAAe,QAAQ,CAAA;AAEzC,IAAA,uBACEC,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,SAAA;AAAA,UACT,YAAA,EAAa;AAAA,UACb,aAAa,OAAO,CAAA;AAAA,UACpB;AAAA,YACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA;AAAA,YAC1B,CAAC,aAAa,CAAA,MAAA,EAASC,qBAAA,CAAW,UAAU,EAAE,CAAC,CAAA,CAAE,CAAC,GAAG,MAAA;AAAA,YACrD,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,SAAA;AAAA;AAAA,YAE7B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,QAAA;AAAA,YAC5B,CAAC,YAAA,CAAa,cAAc,CAAC,GAAG,YAAA;AAAA,YAChC,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,WAC/B;AAAA,UACA;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var css_248z = ".saltCardContent {\n padding: var(--saltCardContent-padding, var(--salt-spacing-200));\n box-sizing: border-box;\n}\n\n.saltCard-sectioned > .saltCardHeader + .saltCardContent,\n.saltCard-sectioned > .saltCardContent + .saltCardContent,\n.saltLinkCard-sectioned > .saltCardHeader + .saltCardContent,\n.saltLinkCard-sectioned > .saltCardContent + .saltCardContent,\n.saltInteractableCard-sectioned > .saltCardHeader + .saltCardContent,\n.saltInteractableCard-sectioned > .saltCardContent + .saltCardContent {\n padding-top: 0;\n}\n\n.saltCard-sectioned > .saltCardContent,\n.saltLinkCard-sectioned > .saltCardContent,\n.saltInteractableCard-sectioned > .saltCardContent {\n flex: 1 1 auto;\n}\n\n@supports selector(:has(*)) {\n .saltCard > .saltCardHeader + .saltCardContent,\n .saltCard > .saltCardContent + .saltCardContent,\n .saltLinkCard > .saltCardHeader + .saltCardContent,\n .saltLinkCard > .saltCardContent + .saltCardContent,\n .saltInteractableCard > .saltCardHeader + .saltCardContent,\n .saltInteractableCard > .saltCardContent + .saltCardContent {\n padding-top: 0;\n }\n\n .saltCard > .saltCardContent,\n .saltLinkCard > .saltCardContent,\n .saltInteractableCard > .saltCardContent {\n flex: 1 1 auto;\n }\n}\n";
|
|
4
|
+
|
|
5
|
+
module.exports = css_248z;
|
|
6
|
+
//# sourceMappingURL=CardContent.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardContent.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var styles = require('@salt-ds/styles');
|
|
5
|
+
var window = require('@salt-ds/window');
|
|
6
|
+
var clsx = require('clsx');
|
|
7
|
+
var React = require('react');
|
|
8
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
9
|
+
require('../utils/useFloatingUI/useFloatingUI.js');
|
|
10
|
+
require('../utils/useId.js');
|
|
11
|
+
require('../salt-provider/SaltProvider.js');
|
|
12
|
+
require('../viewport/ViewportProvider.js');
|
|
13
|
+
var CardContent$1 = require('./CardContent.css.js');
|
|
14
|
+
|
|
15
|
+
const withBaseName = makePrefixer.makePrefixer("saltCardContent");
|
|
16
|
+
const CardContent = React.forwardRef(
|
|
17
|
+
function CardContent2(props, ref) {
|
|
18
|
+
const { className, ...rest } = props;
|
|
19
|
+
const targetWindow = window.useWindow();
|
|
20
|
+
styles.useComponentCssInjection({
|
|
21
|
+
testId: "salt-card-content",
|
|
22
|
+
css: CardContent$1,
|
|
23
|
+
window: targetWindow
|
|
24
|
+
});
|
|
25
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx.clsx(withBaseName(), className), ...rest });
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
|
|
29
|
+
exports.CardContent = CardContent;
|
|
30
|
+
//# sourceMappingURL=CardContent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardContent.js","sources":["../src/card/CardContent.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport cardContentCss from \"./CardContent.css\";\n\nexport interface CardContentProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nconst withBaseName = makePrefixer(\"saltCardContent\");\n\nexport const CardContent = forwardRef<HTMLDivElement, CardContentProps>(\n function CardContent(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card-content\",\n css: cardContentCss,\n window: targetWindow,\n });\n\n return (\n <div ref={ref} className={clsx(withBaseName(), className)} {...rest} />\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","CardContent","useWindow","useComponentCssInjection","cardContentCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,iBAAiB,CAAA;AAE5C,MAAM,WAAA,GAAcC,gBAAA;AAAA,EACzB,SAASC,YAAAA,CAAY,KAAA,EAAO,GAAA,EAAK;AAC/B,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,mBAAA;AAAA,MACR,GAAA,EAAKC,aAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAU,SAAA,EAAWC,SAAA,CAAK,cAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,CAAA;AAAA,EAEzE;AACF;;;;"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var css_248z = ".saltCardFooter {\n padding: var(--saltCardFooter-padding, var(--salt-spacing-200));\n display: flex;\n align-items: center;\n gap: var(--salt-spacing-100);\n box-sizing: border-box;\n}\n\n.saltCard-sectioned > .saltCardHeader + .saltCardFooter,\n.saltCard-sectioned > .saltCardContent + .saltCardFooter,\n.saltLinkCard-sectioned > .saltCardHeader + .saltCardFooter,\n.saltLinkCard-sectioned > .saltCardContent + .saltCardFooter,\n.saltInteractableCard-sectioned > .saltCardHeader + .saltCardFooter,\n.saltInteractableCard-sectioned > .saltCardContent + .saltCardFooter {\n padding-top: 0;\n}\n\n.saltCard-sectioned > .saltCardFooter,\n.saltLinkCard-sectioned > .saltCardFooter,\n.saltInteractableCard-sectioned > .saltCardFooter {\n flex-shrink: 0;\n margin-top: auto;\n}\n\n@supports selector(:has(*)) {\n .saltCard > .saltCardHeader + .saltCardFooter,\n .saltCard > .saltCardContent + .saltCardFooter,\n .saltLinkCard > .saltCardHeader + .saltCardFooter,\n .saltLinkCard > .saltCardContent + .saltCardFooter,\n .saltInteractableCard > .saltCardHeader + .saltCardFooter,\n .saltInteractableCard > .saltCardContent + .saltCardFooter {\n padding-top: 0;\n }\n\n .saltCard > .saltCardFooter,\n .saltLinkCard > .saltCardFooter,\n .saltInteractableCard > .saltCardFooter {\n flex-shrink: 0;\n margin-top: auto;\n }\n}\n";
|
|
4
|
+
|
|
5
|
+
module.exports = css_248z;
|
|
6
|
+
//# sourceMappingURL=CardFooter.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardFooter.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var styles = require('@salt-ds/styles');
|
|
5
|
+
var window = require('@salt-ds/window');
|
|
6
|
+
var clsx = require('clsx');
|
|
7
|
+
var React = require('react');
|
|
8
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
9
|
+
require('../utils/useFloatingUI/useFloatingUI.js');
|
|
10
|
+
require('../utils/useId.js');
|
|
11
|
+
require('../salt-provider/SaltProvider.js');
|
|
12
|
+
require('../viewport/ViewportProvider.js');
|
|
13
|
+
var CardFooter$1 = require('./CardFooter.css.js');
|
|
14
|
+
|
|
15
|
+
const withBaseName = makePrefixer.makePrefixer("saltCardFooter");
|
|
16
|
+
const CardFooter = React.forwardRef(
|
|
17
|
+
function CardFooter2(props, ref) {
|
|
18
|
+
const { className, ...rest } = props;
|
|
19
|
+
const targetWindow = window.useWindow();
|
|
20
|
+
styles.useComponentCssInjection({
|
|
21
|
+
testId: "salt-card-footer",
|
|
22
|
+
css: CardFooter$1,
|
|
23
|
+
window: targetWindow
|
|
24
|
+
});
|
|
25
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx.clsx(withBaseName(), className), ...rest });
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
|
|
29
|
+
exports.CardFooter = CardFooter;
|
|
30
|
+
//# sourceMappingURL=CardFooter.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardFooter.js","sources":["../src/card/CardFooter.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport cardFooterCss from \"./CardFooter.css\";\n\nexport interface CardFooterProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nconst withBaseName = makePrefixer(\"saltCardFooter\");\n\nexport const CardFooter = forwardRef<HTMLDivElement, CardFooterProps>(\n function CardFooter(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card-footer\",\n css: cardFooterCss,\n window: targetWindow,\n });\n\n return (\n <div ref={ref} className={clsx(withBaseName(), className)} {...rest} />\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","CardFooter","useWindow","useComponentCssInjection","cardFooterCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA;AAE3C,MAAM,UAAA,GAAaC,gBAAA;AAAA,EACxB,SAASC,WAAAA,CAAW,KAAA,EAAO,GAAA,EAAK;AAC9B,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,kBAAA;AAAA,MACR,GAAA,EAAKC,YAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAU,SAAA,EAAWC,SAAA,CAAK,cAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,CAAA;AAAA,EAEzE;AACF;;;;"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var css_248z = ".saltCardHeader {\n padding: var(--saltCardHeader-padding, var(--salt-spacing-200));\n box-sizing: border-box;\n}\n\n.saltCard-sectioned > .saltCardHeader,\n.saltLinkCard-sectioned > .saltCardHeader,\n.saltInteractableCard-sectioned > .saltCardHeader {\n flex-shrink: 0;\n}\n\n@supports selector(:has(*)) {\n .saltCard > .saltCardHeader,\n .saltLinkCard > .saltCardHeader,\n .saltInteractableCard > .saltCardHeader {\n flex-shrink: 0;\n }\n}\n";
|
|
4
|
+
|
|
5
|
+
module.exports = css_248z;
|
|
6
|
+
//# sourceMappingURL=CardHeader.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardHeader.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var styles = require('@salt-ds/styles');
|
|
5
|
+
var window = require('@salt-ds/window');
|
|
6
|
+
var clsx = require('clsx');
|
|
7
|
+
var React = require('react');
|
|
8
|
+
var makePrefixer = require('../utils/makePrefixer.js');
|
|
9
|
+
require('../utils/useFloatingUI/useFloatingUI.js');
|
|
10
|
+
require('../utils/useId.js');
|
|
11
|
+
require('../salt-provider/SaltProvider.js');
|
|
12
|
+
require('../viewport/ViewportProvider.js');
|
|
13
|
+
var CardHeader$1 = require('./CardHeader.css.js');
|
|
14
|
+
|
|
15
|
+
const withBaseName = makePrefixer.makePrefixer("saltCardHeader");
|
|
16
|
+
const CardHeader = React.forwardRef(
|
|
17
|
+
function CardHeader2(props, ref) {
|
|
18
|
+
const { className, ...rest } = props;
|
|
19
|
+
const targetWindow = window.useWindow();
|
|
20
|
+
styles.useComponentCssInjection({
|
|
21
|
+
testId: "salt-card-header",
|
|
22
|
+
css: CardHeader$1,
|
|
23
|
+
window: targetWindow
|
|
24
|
+
});
|
|
25
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx.clsx(withBaseName(), className), ...rest });
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
|
|
29
|
+
exports.CardHeader = CardHeader;
|
|
30
|
+
//# sourceMappingURL=CardHeader.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CardHeader.js","sources":["../src/card/CardHeader.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { makePrefixer } from \"../utils\";\nimport cardHeaderCss from \"./CardHeader.css\";\n\nexport interface CardHeaderProps extends ComponentPropsWithoutRef<\"div\"> {}\n\nconst withBaseName = makePrefixer(\"saltCardHeader\");\n\nexport const CardHeader = forwardRef<HTMLDivElement, CardHeaderProps>(\n function CardHeader(props, ref) {\n const { className, ...rest } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-card-header\",\n css: cardHeaderCss,\n window: targetWindow,\n });\n\n return (\n <div ref={ref} className={clsx(withBaseName(), className)} {...rest} />\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","CardHeader","useWindow","useComponentCssInjection","cardHeaderCss","jsx","clsx"],"mappings":";;;;;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,0BAAa,gBAAgB,CAAA;AAE3C,MAAM,UAAA,GAAaC,gBAAA;AAAA,EACxB,SAASC,WAAAA,CAAW,KAAA,EAAO,GAAA,EAAK;AAC9B,IAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAE/B,IAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,IAAAC,+BAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,kBAAA;AAAA,MACR,GAAA,EAAKC,YAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAU,SAAA,EAAWC,SAAA,CAAK,cAAa,EAAG,SAAS,CAAA,EAAI,GAAG,IAAA,EAAM,CAAA;AAAA,EAEzE;AACF;;;;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var CardContent = require('./CardContent.js');
|
|
5
|
+
var CardFooter = require('./CardFooter.js');
|
|
6
|
+
var CardHeader = require('./CardHeader.js');
|
|
7
|
+
|
|
8
|
+
const cardSectionTypes = [CardHeader.CardHeader, CardContent.CardContent, CardFooter.CardFooter];
|
|
9
|
+
function hasCardSection(children) {
|
|
10
|
+
return React.Children.toArray(children).some(
|
|
11
|
+
(child) => React.isValidElement(child) && cardSectionTypes.some((sectionType) => child.type === sectionType)
|
|
12
|
+
);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
exports.hasCardSection = hasCardSection;
|
|
16
|
+
//# sourceMappingURL=hasCardSection.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hasCardSection.js","sources":["../src/card/hasCardSection.ts"],"sourcesContent":["import { Children, isValidElement, type ReactNode } from \"react\";\nimport { CardContent } from \"./CardContent\";\nimport { CardFooter } from \"./CardFooter\";\nimport { CardHeader } from \"./CardHeader\";\n\nconst cardSectionTypes = [CardHeader, CardContent, CardFooter];\n\nexport function hasCardSection(children: ReactNode): boolean {\n return Children.toArray(children).some(\n (child) =>\n isValidElement(child) &&\n cardSectionTypes.some((sectionType) => child.type === sectionType),\n );\n}\n"],"names":["CardHeader","CardContent","CardFooter","Children","isValidElement"],"mappings":";;;;;;;AAKA,MAAM,gBAAA,GAAmB,CAACA,qBAAA,EAAYC,uBAAA,EAAaC,qBAAU,CAAA;AAEtD,SAAS,eAAe,QAAA,EAA8B;AAC3D,EAAA,OAAOC,cAAA,CAAS,OAAA,CAAQ,QAAQ,CAAA,CAAE,IAAA;AAAA,IAChC,CAAC,KAAA,KACCC,oBAAA,CAAe,KAAK,CAAA,IACpB,gBAAA,CAAiB,IAAA,CAAK,CAAC,WAAA,KAAgB,KAAA,CAAM,IAAA,KAAS,WAAW;AAAA,GACrE;AACF;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".saltFileDropZone {\n color: var(--saltFileDropZone-text-color, var(--salt-content-primary-foreground));\n display: inline-flex;\n background: var(--saltFileDropZone-background, var(--salt-container-primary-background));\n text-align: center;\n align-items: center;\n justify-content: center;\n border: var(--saltFileDropZone-border, var(--salt-size-fixed-200) var(--salt-borderStyle-dashed) var(--salt-container-
|
|
3
|
+
var css_248z = ".saltFileDropZone {\n color: var(--saltFileDropZone-text-color, var(--salt-content-primary-foreground));\n display: inline-flex;\n background: var(--saltFileDropZone-background, var(--salt-container-primary-background));\n text-align: center;\n align-items: center;\n justify-content: center;\n border: var(--saltFileDropZone-border, var(--salt-size-fixed-200) var(--salt-borderStyle-dashed) var(--salt-container-bold-borderColor));\n border-radius: var(--saltFileDropZone-borderRadius, var(--salt-palette-corner, 0));\n flex-direction: column;\n padding: var(--salt-spacing-200);\n gap: var(--salt-spacing-200);\n width: 100%;\n font-size: var(--saltFileDropZone-fontSize, var(--salt-text-fontSize));\n font-family: var(--saltFileDropZone-fontFamily, var(--salt-text-fontFamily));\n line-height: var(--saltFileDropZone-lineHeight, var(--salt-text-lineHeight));\n box-sizing: border-box;\n}\n\n.saltFileDropZone-active {\n background: var(--salt-target-background-hover);\n border: var(--salt-size-fixed-200) var(--salt-borderStyle-solid) var(--salt-target-borderColor-hover);\n}\n\n/* Styles applied if `status=\"error\" */\n.saltFileDropZone-error {\n border: var(--salt-size-fixed-200) var(--salt-borderStyle-dashed) var(--salt-status-error-borderColor);\n}\n\n/* Styles applied if `status=\"success\" */\n.saltFileDropZone-success {\n border: var(--salt-size-fixed-200) var(--salt-borderStyle-dashed) var(--salt-status-success-borderColor);\n}\n\n/* Styles applied if `disabled={true}` */\n.saltFileDropZone-disabled {\n background: var(--salt-container-primary-background-disabled);\n border: var(--salt-size-fixed-200) var(--salt-borderStyle-dashed) var(--salt-container-bold-borderColor-disabled);\n cursor: var(--salt-cursor-disabled);\n color: var(--salt-content-primary-foreground-disabled);\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = css_248z;
|
|
6
6
|
//# sourceMappingURL=FileDropZone.css.js.map
|
package/dist-cjs/index.js
CHANGED
|
@@ -16,11 +16,18 @@ var BannerActions = require('./banner/BannerActions.js');
|
|
|
16
16
|
var BannerContent = require('./banner/BannerContent.js');
|
|
17
17
|
var BorderItem = require('./border-item/BorderItem.js');
|
|
18
18
|
var BorderLayout = require('./border-layout/BorderLayout.js');
|
|
19
|
+
var Breadcrumb = require('./breadcrumbs/Breadcrumb.js');
|
|
20
|
+
var BreadcrumbLabel = require('./breadcrumbs/BreadcrumbLabel.js');
|
|
21
|
+
var Breadcrumbs = require('./breadcrumbs/Breadcrumbs.js');
|
|
22
|
+
var BreadcrumbTrigger = require('./breadcrumbs/BreadcrumbTrigger.js');
|
|
19
23
|
var BreakpointProvider = require('./breakpoints/BreakpointProvider.js');
|
|
20
24
|
var Breakpoints = require('./breakpoints/Breakpoints.js');
|
|
21
25
|
var Button = require('./button/Button.js');
|
|
22
26
|
var useButton = require('./button/useButton.js');
|
|
23
27
|
var Card = require('./card/Card.js');
|
|
28
|
+
var CardContent = require('./card/CardContent.js');
|
|
29
|
+
var CardFooter = require('./card/CardFooter.js');
|
|
30
|
+
var CardHeader = require('./card/CardHeader.js');
|
|
24
31
|
var Checkbox = require('./checkbox/Checkbox.js');
|
|
25
32
|
var CheckboxGroup = require('./checkbox/CheckboxGroup.js');
|
|
26
33
|
var CheckboxIcon = require('./checkbox/CheckboxIcon.js');
|
|
@@ -225,6 +232,10 @@ exports.BannerContent = BannerContent.BannerContent;
|
|
|
225
232
|
exports.BORDER_POSITION = BorderItem.BORDER_POSITION;
|
|
226
233
|
exports.BorderItem = BorderItem.BorderItem;
|
|
227
234
|
exports.BorderLayout = BorderLayout.BorderLayout;
|
|
235
|
+
exports.Breadcrumb = Breadcrumb.Breadcrumb;
|
|
236
|
+
exports.BreadcrumbLabel = BreadcrumbLabel.BreadcrumbLabel;
|
|
237
|
+
exports.Breadcrumbs = Breadcrumbs.Breadcrumbs;
|
|
238
|
+
exports.BreadcrumbTrigger = BreadcrumbTrigger.BreadcrumbTrigger;
|
|
228
239
|
exports.useBreakpoint = BreakpointProvider.useBreakpoint;
|
|
229
240
|
exports.DEFAULT_BREAKPOINTS = Breakpoints.DEFAULT_BREAKPOINTS;
|
|
230
241
|
exports.Button = Button.Button;
|
|
@@ -233,6 +244,9 @@ exports.ButtonSentimentValues = Button.ButtonSentimentValues;
|
|
|
233
244
|
exports.ButtonVariantValues = Button.ButtonVariantValues;
|
|
234
245
|
exports.useButton = useButton.useButton;
|
|
235
246
|
exports.Card = Card.Card;
|
|
247
|
+
exports.CardContent = CardContent.CardContent;
|
|
248
|
+
exports.CardFooter = CardFooter.CardFooter;
|
|
249
|
+
exports.CardHeader = CardHeader.CardHeader;
|
|
236
250
|
exports.Checkbox = Checkbox.Checkbox;
|
|
237
251
|
exports.CheckboxGroup = CheckboxGroup.CheckboxGroup;
|
|
238
252
|
exports.CheckboxIcon = CheckboxIcon.CheckboxIcon;
|
package/dist-cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|