@sps-woodland/core 8.56.2 → 8.56.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/action-bar/action-bar/ActionBar.js +44 -59
- package/lib/action-bar/action-bar/ActionBar.ve.js +4 -11
- package/lib/action-bar/action-bar-additional-content/ActionBarAdditionalContent.js +14 -22
- package/lib/action-bar/index.js +54 -74
- package/lib/action-bar/index.umd.cjs +1 -1
- package/lib/action-bar/style.css +2 -1
- package/lib/add-to-list/add-to-list/AddToList.js +220 -302
- package/lib/add-to-list/add-to-list/AddToList.ve.js +79 -24
- package/lib/add-to-list/add-to-list/ItemsList.js +42 -67
- package/lib/add-to-list/add-to-list/ListItem.js +24 -50
- package/lib/add-to-list/index.js +393 -453
- package/lib/add-to-list/index.umd.cjs +1 -1
- package/lib/add-to-list/style.css +2 -1
- package/lib/buttons/button/Button.js +95 -121
- package/lib/buttons/button/Button.ve.js +150 -9
- package/lib/buttons/index.js +281 -171
- package/lib/buttons/index.umd.cjs +1 -1
- package/lib/buttons/style.css +2 -1
- package/lib/cards/card/Card.js +19 -27
- package/lib/cards/card/Card.ve.js +4 -4
- package/lib/cards/card-footer/CardFooter.js +12 -13
- package/lib/cards/card-footer/CardFooter.ve.js +4 -4
- package/lib/cards/card-header/CardHeader.js +12 -13
- package/lib/cards/card-header/CardHeader.ve.js +4 -4
- package/lib/cards/card-title/CardTitle.js +11 -12
- package/lib/cards/card-title/CardTitle.ve.js +4 -4
- package/lib/cards/index.js +52 -52
- package/lib/cards/index.umd.cjs +1 -1
- package/lib/cards/style.css +2 -1
- package/lib/column-manager/column-manager/ColumnManager.js +95 -112
- package/lib/column-manager/column-manager/useColumnManager.js +59 -48
- package/lib/column-manager/index.js +2 -5
- package/lib/components/icon/Icon.ve.js +15 -5
- package/lib/components/icon/icons/sprite.svg.js +4 -4
- package/lib/content-row/content-row/ContentRow.js +146 -173
- package/lib/content-row/content-row/ContentRow.ve.js +105 -18
- package/lib/content-row/content-row-col/ContentRowCol.js +37 -48
- package/lib/content-row/content-row-col/ContentRowCol.ve.js +49 -6
- package/lib/content-row/content-row-expansion/ContentRowExpansion.js +16 -24
- package/lib/content-row/index.js +407 -318
- package/lib/content-row/index.umd.cjs +1 -1
- package/lib/content-row/row-list-auto-layout/RowListAutoLayout.js +24 -39
- package/lib/content-row/row-list-auto-layout/RowListAutoLayout.ve.js +13 -5
- package/lib/content-row/style.css +2 -1
- package/lib/content-tiles/content-tile/ContentTile.js +71 -60
- package/lib/content-tiles/content-tile/ContentTile.ve.js +36 -14
- package/lib/content-tiles/content-tile-list/ContentTileList.js +12 -13
- package/lib/content-tiles/content-tile-list/ContentTileList.ve.js +4 -5
- package/lib/content-tiles/index.js +156 -118
- package/lib/content-tiles/index.umd.cjs +1 -1
- package/lib/content-tiles/style.css +2 -1
- package/lib/core.css +2 -1
- package/lib/dropdowns/dropdown/Dropdown.js +56 -68
- package/lib/dropdowns/dropdown/Dropdown.ve.js +37 -8
- package/lib/dropdowns/index.js +171 -171
- package/lib/dropdowns/index.umd.cjs +1 -1
- package/lib/dropdowns/option-list/Option.js +14 -18
- package/lib/dropdowns/option-list/Option.ve.js +4 -5
- package/lib/dropdowns/option-list/OptionList.js +28 -44
- package/lib/dropdowns/option-list/OptionList.ve.js +4 -5
- package/lib/dropdowns/style.css +2 -1
- package/lib/editable-table/EditableTable.js +68 -85
- package/lib/editable-table/index.js +1 -4
- package/lib/feedback-block/FeedbackBlock.js +40 -35
- package/lib/feedback-block/FeedbackBlock.ve.js +56 -7
- package/lib/feedback-block/index.js +132 -85
- package/lib/feedback-block/index.umd.cjs +1 -1
- package/lib/feedback-block/style.css +2 -1
- package/lib/file-upload/file-upload/FileUpload.js +164 -202
- package/lib/file-upload/file-upload/FileUpload.ve.js +84 -18
- package/lib/file-upload/file-upload/mime-type.enum.js +106 -106
- package/lib/file-upload/index.js +390 -353
- package/lib/file-upload/index.umd.cjs +1 -1
- package/lib/file-upload/style.css +2 -1
- package/lib/filter-tiles/filter-tile/FilterTile.js +41 -46
- package/lib/filter-tiles/filter-tile/FilterTile.ve.js +51 -9
- package/lib/filter-tiles/filter-tile-set/FilterTileSet.js +12 -15
- package/lib/filter-tiles/filter-tile-set/FilterTileSet.ve.js +4 -4
- package/lib/filter-tiles/index.js +142 -107
- package/lib/filter-tiles/index.umd.cjs +1 -1
- package/lib/filter-tiles/style.css +2 -1
- package/lib/focused-task/focused-task/FocusedTask.js +52 -74
- package/lib/focused-task/focused-task/FocusedTask.ve.js +13 -12
- package/lib/focused-task/focused-task/useFocusedTask.js +20 -18
- package/lib/focused-task/focused-task-actions/FocusedTaskActions.js +12 -13
- package/lib/focused-task/index.js +127 -144
- package/lib/focused-task/index.umd.cjs +1 -1
- package/lib/focused-task/style.css +2 -1
- package/lib/growler/Growler.js +78 -90
- package/lib/growler/Growler.ve.js +23 -12
- package/lib/growler/GrowlerListProvider.js +38 -39
- package/lib/growler/Sonner.ve.js +17 -12
- package/lib/growler/index.js +249 -274
- package/lib/growler/index.umd.cjs +1 -1
- package/lib/growler/sonner.js +73 -102
- package/lib/growler/style.css +2 -1
- package/lib/index.js +520 -501
- package/lib/index.umd.cjs +4 -4
- package/lib/insight-card/InsightCard.js +90 -84
- package/lib/insight-card/InsightCard.ve.js +148 -15
- package/lib/insight-card/InsightCardSet.js +12 -12
- package/lib/insight-card/index.js +269 -141
- package/lib/insight-card/index.umd.cjs +1 -1
- package/lib/insight-card/style.css +2 -1
- package/lib/key-value-set/index.js +97 -87
- package/lib/key-value-set/index.umd.cjs +1 -1
- package/lib/key-value-set/key-value-set/KeyValueSet.js +17 -21
- package/lib/key-value-set/key-value-set/KeyValueSet.ve.js +10 -5
- package/lib/key-value-set/key-value-set-item/KeyValueSetItem.js +25 -21
- package/lib/key-value-set/key-value-set-item/KeyValueSetItem.ve.js +13 -6
- package/lib/key-value-set/style.css +2 -1
- package/lib/list-bar/advanced-search/AdvancedSearch.js +51 -54
- package/lib/list-bar/advanced-search/AdvancedSearch.ve.js +30 -8
- package/lib/list-bar/index.js +305 -301
- package/lib/list-bar/index.umd.cjs +1 -1
- package/lib/list-bar/list-bar/InputGroupWrapper.js +10 -19
- package/lib/list-bar/list-bar/ListBar.js +105 -121
- package/lib/list-bar/list-bar/ListBar.ve.js +13 -17
- package/lib/list-bar/list-bar/ListBarSearch.js +20 -21
- package/lib/list-bar/list-bar/ListBarSearchInfo.js +8 -12
- package/lib/list-bar/list-bar/ListBarSortBy.js +28 -38
- package/lib/list-bar/search-results-bar/SearchResultsBar.js +38 -28
- package/lib/list-bar/search-results-bar/SearchResultsBar.ve.js +4 -11
- package/lib/list-bar/style.css +2 -1
- package/lib/matrix/index.js +79 -87
- package/lib/matrix/index.umd.cjs +1 -1
- package/lib/matrix/matrix/Matrix.js +18 -26
- package/lib/matrix/matrix/Matrix.ve.js +4 -7
- package/lib/matrix/matrix-body/MatrixBody.js +10 -13
- package/lib/matrix/matrix-cell/MatrixCell.js +23 -18
- package/lib/matrix/matrix-head/MatrixHead.js +10 -13
- package/lib/matrix/matrix-header/MatrixHeader.js +20 -23
- package/lib/matrix/matrix-row/MatrixRow.js +10 -13
- package/lib/matrix/style.css +2 -1
- package/lib/modal/index.js +197 -187
- package/lib/modal/index.umd.cjs +1 -1
- package/lib/modal/modal/Modal.js +90 -108
- package/lib/modal/modal/Modal.ve.js +43 -13
- package/lib/modal/modal/useModal.js +19 -24
- package/lib/modal/modal-footer/ModalFooter.js +11 -12
- package/lib/modal/style.css +2 -1
- package/lib/node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.21.2/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js +49 -0
- package/lib/node_modules/.pnpm/nanoid@5.1.16/node_modules/nanoid/index.browser.js +8 -10
- package/lib/node_modules/.pnpm/nanoid@5.1.16/node_modules/nanoid/url-alphabet/index.js +4 -4
- package/lib/page-title/heading-level/HeadingLevel.js +8 -12
- package/lib/page-title/index.js +33 -40
- package/lib/page-title/index.umd.cjs +1 -1
- package/lib/page-title/page-subtitle/PageSubtitle.js +13 -18
- package/lib/page-title/page-subtitle/PageSubtitle.ve.js +4 -5
- package/lib/page-title/page-title/PageTitle.js +15 -19
- package/lib/page-title/page-title/PageTitle.ve.js +4 -7
- package/lib/page-title/style.css +2 -1
- package/lib/photo/index.js +174 -177
- package/lib/photo/index.umd.cjs +1 -1
- package/lib/photo/photo/Photo.js +72 -81
- package/lib/photo/photo/Photo.ve.js +21 -7
- package/lib/photo/photo-carousel/PhotoCarousel.js +36 -51
- package/lib/photo/photo-carousel/PhotoCarousel.ve.js +13 -9
- package/lib/photo/style.css +2 -1
- package/lib/product-bar/hooks/usePriorityPlus.js +88 -104
- package/lib/product-bar/index.js +372 -395
- package/lib/product-bar/index.umd.cjs +1 -1
- package/lib/product-bar/product-bar/ProductBar.js +77 -103
- package/lib/product-bar/product-bar/ProductBar.ve.js +46 -15
- package/lib/product-bar/product-bar-name/ProductBarName.js +37 -40
- package/lib/product-bar/product-bar-overflow-menu/ProductBarOverflowMenu.js +48 -70
- package/lib/product-bar/product-bar-overflow-menu/ProductBarOverflowMenu.ve.js +4 -8
- package/lib/product-bar/product-bar-tab/ProductBarTab.js +28 -26
- package/lib/product-bar/slack-link/SlackLink.js +26 -30
- package/lib/product-bar/slack-link/SlackLink.ve.js +4 -5
- package/lib/product-bar/style.css +2 -1
- package/lib/product-bar-vertical/index.js +240 -251
- package/lib/product-bar-vertical/index.umd.cjs +1 -1
- package/lib/product-bar-vertical/product-bar-vertical/ProductBarVertical.js +42 -61
- package/lib/product-bar-vertical/product-bar-vertical/ProductBarVertical.ve.js +53 -23
- package/lib/product-bar-vertical/product-bar-vertical-header/ProductBarVerticalHeader.js +30 -42
- package/lib/product-bar-vertical/product-bar-vertical-item/ProductBarVerticalItem.js +71 -89
- package/lib/product-bar-vertical/product-bar-vertical-section/ProductBarVerticalSection.js +22 -29
- package/lib/product-bar-vertical/style.css +2 -1
- package/lib/progress-indicators/index.js +372 -255
- package/lib/progress-indicators/index.umd.cjs +1 -1
- package/lib/progress-indicators/progress-bar/ProgressBar.js +66 -110
- package/lib/progress-indicators/progress-bar/ProgressBar.ve.js +66 -13
- package/lib/progress-indicators/progress-bar/progress-bar-step/ProgressBarStep.js +34 -54
- package/lib/progress-indicators/progress-bar/progress-bar-step/ProgressBarStep.ve.js +136 -8
- package/lib/progress-indicators/progress-ring/ProgressRing.js +45 -52
- package/lib/progress-indicators/style.css +2 -1
- package/lib/rich-text-editor/index.js +556 -582
- package/lib/rich-text-editor/index.umd.cjs +11 -11
- package/lib/rich-text-editor/rich-text-editor/RTELinkModal.js +29 -33
- package/lib/rich-text-editor/rich-text-editor/RTEToolbarButton.js +23 -37
- package/lib/rich-text-editor/rich-text-editor/RTEToolbarButton.ve.js +13 -6
- package/lib/rich-text-editor/rich-text-editor/RichTextEditor.js +68 -77
- package/lib/rich-text-editor/rich-text-editor/RichTextEditor.ve.js +21 -8
- package/lib/rich-text-editor/rich-text-editor/hooks/useHtmlToMd.js +14 -20
- package/lib/rich-text-editor/rich-text-editor/hooks/useMdToHtml.js +14 -20
- package/lib/rich-text-editor/rich-text-editor/hooks/useRTEContent.js +33 -27
- package/lib/rich-text-editor/rich-text-editor/hooks/useRTEObserver.js +79 -88
- package/lib/rich-text-editor/rich-text-editor/hooks/useRTESelectionListener.js +28 -36
- package/lib/rich-text-editor/rich-text-editor/hooks/useRTEToolbarButtons.js +195 -211
- package/lib/rich-text-editor/rich-text-editor/icons/BOLD.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/INDENT.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/ITALICS.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/LINK.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/ORDERED_LIST.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/OUTDENT.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/REDO.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/UNDO.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/UNLINK.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/icons/UNORDERED_LIST.svg.js +4 -4
- package/lib/rich-text-editor/rich-text-editor/utils/flattenListItemParagraphs.js +12 -12
- package/lib/rich-text-editor/rich-text-editor/utils/removeUnrepresentableBreaks.js +20 -19
- package/lib/rich-text-editor/rich-text-editor/utils/utils.js +11 -15
- package/lib/rich-text-editor/style.css +2 -1
- package/lib/scrollable-container/ScrollableContainer.js +18 -27
- package/lib/scrollable-container/ScrollableContainer.ve.js +4 -4
- package/lib/scrollable-container/index.js +20 -27
- package/lib/scrollable-container/index.umd.cjs +1 -1
- package/lib/scrollable-container/style.css +2 -1
- package/lib/side-nav/index.js +190 -228
- package/lib/side-nav/index.umd.cjs +1 -1
- package/lib/side-nav/side-nav/SideNav.js +43 -60
- package/lib/side-nav/side-nav/SideNav.ve.js +22 -16
- package/lib/side-nav/side-nav/navContext.js +7 -7
- package/lib/side-nav/side-nav-header/SideNavHeader.js +14 -15
- package/lib/side-nav/side-nav-item/SideNavItem.js +68 -94
- package/lib/side-nav/side-nav-section/SideNavSection.js +16 -26
- package/lib/side-nav/style.css +2 -1
- package/lib/sorting-header/caret/caret.ve.js +13 -5
- package/lib/sorting-header/index.js +269 -251
- package/lib/sorting-header/index.umd.cjs +1 -1
- package/lib/sorting-header/sorting-header/SortingHeader.js +110 -124
- package/lib/sorting-header/sorting-header/SortingHeader.ve.js +30 -6
- package/lib/sorting-header/sorting-header-cell/SortingHeaderCell.js +69 -83
- package/lib/sorting-header/sorting-header-cell/SortingHeaderCell.ve.js +21 -7
- package/lib/sorting-header/style.css +2 -1
- package/lib/style.css +2 -1
- package/lib/tabs/index.js +255 -201
- package/lib/tabs/index.umd.cjs +1 -1
- package/lib/tabs/style.css +2 -1
- package/lib/tabs/tab/Tab.js +24 -27
- package/lib/tabs/tab/Tab.ve.js +76 -6
- package/lib/tabs/tab-panel/TabPanel.js +16 -25
- package/lib/tabs/tabs/Tabs.js +101 -112
- package/lib/tabs/tabs/Tabs.ve.js +13 -11
- package/lib/tags/clickable-tag/ClickableTag.js +86 -90
- package/lib/tags/clickable-tag/ClickableTag.ve.js +66 -9
- package/lib/tags/index.js +342 -199
- package/lib/tags/index.umd.cjs +1 -1
- package/lib/tags/split-tag/SplitTag.js +49 -30
- package/lib/tags/split-tag/SplitTag.ve.js +35 -9
- package/lib/tags/style.css +2 -1
- package/lib/tags/tag/Tag.js +42 -38
- package/lib/tags/tag/Tag.ve.js +41 -6
- package/lib/utils/cl.js +5 -5
- package/lib/zero-state/ZeroState.js +36 -29
- package/lib/zero-state/ZeroState.ve.js +29 -11
- package/lib/zero-state/index.js +103 -78
- package/lib/zero-state/index.umd.cjs +1 -1
- package/lib/zero-state/style.css +2 -1
- package/package.json +12 -12
- package/lib/node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.17.4/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js +0 -57
package/lib/photo/photo/Photo.js
CHANGED
|
@@ -1,83 +1,74 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
{
|
|
61
|
-
className: N({ mode: g ? "fit" : "fill" }),
|
|
62
|
-
ref: l,
|
|
63
|
-
src: o,
|
|
64
|
-
alt: f
|
|
65
|
-
}
|
|
66
|
-
) : /* @__PURE__ */ e.createElement("span", null) : /* @__PURE__ */ e.createElement(S, { className: W, icon: d })
|
|
67
|
-
);
|
|
1
|
+
import { photo as e, photoPlaceholder as t, photoWrapper as n } from "./Photo.ve.js";
|
|
2
|
+
import { Icon as r, Metadata as i, cl as a } from "@sps-woodland/core";
|
|
3
|
+
import * as o from "react";
|
|
4
|
+
//#region src/photo/photo/Photo.tsx
|
|
5
|
+
function s({ className: i, src: s, altText: c, mode: l = "fill", placeholderIcon: u = "photo", ...d }) {
|
|
6
|
+
let f = o.useRef(null), p = o.useRef(null), m = o.useRef(null), h = o.useRef(null), [g, _] = o.useState(), [v, y] = o.useState(!1);
|
|
7
|
+
o.useEffect(() => {
|
|
8
|
+
p.current && (m.current &&= (window.clearInterval(m.current), null), m.current = window.setInterval(() => {
|
|
9
|
+
if (p.current) {
|
|
10
|
+
let e = p.current.getBoundingClientRect();
|
|
11
|
+
if (e.height) {
|
|
12
|
+
m.current &&= (window.clearInterval(m.current), null);
|
|
13
|
+
let t = e.width / e.height > 1;
|
|
14
|
+
y(t === (l === "fit"));
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}, 1e3 / 60));
|
|
18
|
+
}, [
|
|
19
|
+
f.current,
|
|
20
|
+
p.current,
|
|
21
|
+
s
|
|
22
|
+
]), o.useEffect(() => {
|
|
23
|
+
h.current &&= (window.clearInterval(h.current), null), h.current = window.setInterval(() => {
|
|
24
|
+
if (f.current) {
|
|
25
|
+
let e = f.current.getBoundingClientRect();
|
|
26
|
+
e.width && (b(e.width), h.current &&= (window.clearInterval(h.current), null));
|
|
27
|
+
}
|
|
28
|
+
}, 1e3 / 60);
|
|
29
|
+
}, [f.current]);
|
|
30
|
+
function b(e) {
|
|
31
|
+
if (e) {
|
|
32
|
+
let t = document?.body?.parentElement?.style?.fontSize || "16px", n = Number(t.substring(0, t.length - 2));
|
|
33
|
+
_(e / n);
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
function x() {
|
|
37
|
+
if (g !== void 0) return g * .05;
|
|
38
|
+
}
|
|
39
|
+
function S() {
|
|
40
|
+
if (g !== void 0) return .75 * g;
|
|
41
|
+
}
|
|
42
|
+
return /* @__PURE__ */ o.createElement("div", {
|
|
43
|
+
ref: f,
|
|
44
|
+
className: a(n({ placeholder: !s }), i),
|
|
45
|
+
style: {
|
|
46
|
+
width: `${g}` && `${g}rem`,
|
|
47
|
+
fontSize: `${x()}rem`,
|
|
48
|
+
height: `${S()}rem`
|
|
49
|
+
},
|
|
50
|
+
...d
|
|
51
|
+
}, s ? g ? /* @__PURE__ */ o.createElement("img", {
|
|
52
|
+
className: e({ mode: v ? "fit" : "fill" }),
|
|
53
|
+
ref: p,
|
|
54
|
+
src: s,
|
|
55
|
+
alt: c
|
|
56
|
+
}) : /* @__PURE__ */ o.createElement("span", null) : /* @__PURE__ */ o.createElement(r, {
|
|
57
|
+
className: t,
|
|
58
|
+
icon: u
|
|
59
|
+
}));
|
|
68
60
|
}
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
61
|
+
i.set(s, {
|
|
62
|
+
name: "Photo",
|
|
63
|
+
props: {
|
|
64
|
+
src: "string",
|
|
65
|
+
altText: "string",
|
|
66
|
+
mode: {
|
|
67
|
+
type: "\"fill\" | \"fit\"",
|
|
68
|
+
default: "\"fill\""
|
|
69
|
+
},
|
|
70
|
+
placeholderIcon: "IconName"
|
|
71
|
+
}
|
|
80
72
|
});
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
};
|
|
73
|
+
//#endregion
|
|
74
|
+
export { s as Photo };
|
|
@@ -1,8 +1,22 @@
|
|
|
1
|
+
import { createRuntimeFn as e } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.21.2/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
|
|
1
2
|
/* empty css */
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
}
|
|
3
|
+
//#region src/photo/photo/Photo.css.ts
|
|
4
|
+
var t = e({
|
|
5
|
+
defaultClassName: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w0",
|
|
6
|
+
variantClassNames: { placeholder: {
|
|
7
|
+
true: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w1",
|
|
8
|
+
false: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w2"
|
|
9
|
+
} },
|
|
10
|
+
defaultVariants: { placeholder: !1 },
|
|
11
|
+
compoundVariants: []
|
|
12
|
+
}), n = e({
|
|
13
|
+
defaultClassName: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w3",
|
|
14
|
+
variantClassNames: { mode: {
|
|
15
|
+
fill: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w4",
|
|
16
|
+
fit: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w5"
|
|
17
|
+
} },
|
|
18
|
+
defaultVariants: { mode: "fill" },
|
|
19
|
+
compoundVariants: []
|
|
20
|
+
}), r = "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w6";
|
|
21
|
+
//#endregion
|
|
22
|
+
export { n as photo, r as photoPlaceholder, t as photoWrapper };
|
|
@@ -1,52 +1,37 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
onClick: () => a(n)
|
|
36
|
-
},
|
|
37
|
-
f
|
|
38
|
-
)))), /* @__PURE__ */ e.createElement("div", { className: t(i) }, /* @__PURE__ */ e.createElement("div", { className: t(s) }, /* @__PURE__ */ e.createElement(
|
|
39
|
-
m,
|
|
40
|
-
{
|
|
41
|
-
kind: "icon",
|
|
42
|
-
icon: "arrow-right-circle",
|
|
43
|
-
"aria-label": c("photo.nextPhoto", {
|
|
44
|
-
defaultValue: "Next Photo"
|
|
45
|
-
}),
|
|
46
|
-
onClick: p
|
|
47
|
-
}
|
|
48
|
-
))));
|
|
1
|
+
import { Photo as e } from "../photo/Photo.js";
|
|
2
|
+
import { photoCarouselButton as t, photoCarouselButtonWrapper as n, photoCarouselDisplayPhoto as r, photoCarouselList as i, photoCarouselListPhoto as a } from "./PhotoCarousel.ve.js";
|
|
3
|
+
import { cl as o, selectChildren as s } from "@sps-woodland/core";
|
|
4
|
+
import * as c from "react";
|
|
5
|
+
import { useWoodlandLanguage as l } from "@spscommerce/i18n";
|
|
6
|
+
import { grid as u } from "@sps-woodland/tokens";
|
|
7
|
+
import { Button as d } from "@sps-woodland/core/buttons";
|
|
8
|
+
//#region src/photo/photo-carousel/PhotoCarousel.tsx
|
|
9
|
+
function f({ children: f, className: p, ...m }) {
|
|
10
|
+
let [h] = s(f, [{ type: e }]), [g, _] = c.useState(0), { t: v } = l();
|
|
11
|
+
function y() {
|
|
12
|
+
g + 1 === h.length ? _(0) : _(g + 1);
|
|
13
|
+
}
|
|
14
|
+
function b() {
|
|
15
|
+
_(g === 0 ? h.length - 1 : g - 1);
|
|
16
|
+
}
|
|
17
|
+
return /* @__PURE__ */ c.createElement("div", {
|
|
18
|
+
className: u.root,
|
|
19
|
+
...m
|
|
20
|
+
}, /* @__PURE__ */ c.createElement("div", { className: o(n) }, /* @__PURE__ */ c.createElement("div", { className: o(t) }, /* @__PURE__ */ c.createElement(d, {
|
|
21
|
+
kind: "icon",
|
|
22
|
+
icon: "arrow-left-circle",
|
|
23
|
+
"aria-label": v("photo.previousPhoto", { defaultValue: "Previous Photo" }),
|
|
24
|
+
onClick: b
|
|
25
|
+
}))), /* @__PURE__ */ c.createElement("div", { className: u[10] }, /* @__PURE__ */ c.createElement("div", { className: o(r, u[12]) }, h[g]), /* @__PURE__ */ c.createElement("div", { className: o(i, u[12]) }, h.map((e, t) => /* @__PURE__ */ c.createElement("button", {
|
|
26
|
+
tabIndex: 0,
|
|
27
|
+
className: o(a({ selected: t === g })),
|
|
28
|
+
onClick: () => _(t)
|
|
29
|
+
}, e)))), /* @__PURE__ */ c.createElement("div", { className: o(n) }, /* @__PURE__ */ c.createElement("div", { className: o(t) }, /* @__PURE__ */ c.createElement(d, {
|
|
30
|
+
kind: "icon",
|
|
31
|
+
icon: "arrow-right-circle",
|
|
32
|
+
"aria-label": v("photo.nextPhoto", { defaultValue: "Next Photo" }),
|
|
33
|
+
onClick: y
|
|
34
|
+
}))));
|
|
49
35
|
}
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
};
|
|
36
|
+
//#endregion
|
|
37
|
+
export { f as PhotoCarousel };
|
|
@@ -1,10 +1,14 @@
|
|
|
1
|
+
import { createRuntimeFn as e } from "../../node_modules/.pnpm/@vanilla-extract_recipes@0.2.5_@vanilla-extract_css@1.21.2/node_modules/@vanilla-extract/recipes/createRuntimeFn/dist/vanilla-extract-recipes-createRuntimeFn.esm.js";
|
|
1
2
|
/* empty css */
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
3
|
+
//#region src/photo/photo-carousel/PhotoCarousel.css.ts
|
|
4
|
+
var t = "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba10", n = "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba11", r = "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba12", i = "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba13", a = e({
|
|
5
|
+
defaultClassName: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba14",
|
|
6
|
+
variantClassNames: { selected: {
|
|
7
|
+
true: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba15",
|
|
8
|
+
false: "pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba16"
|
|
9
|
+
} },
|
|
10
|
+
defaultVariants: { selected: !1 },
|
|
11
|
+
compoundVariants: []
|
|
12
|
+
});
|
|
13
|
+
//#endregion
|
|
14
|
+
export { n as photoCarouselButton, t as photoCarouselButtonWrapper, i as photoCarouselDisplayPhoto, r as photoCarouselList, a as photoCarouselListPhoto };
|
package/lib/photo/style.css
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
.pkg_sps-
|
|
1
|
+
.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w0{vertical-align:middle;justify-content:center;align-items:center;display:flex;overflow:hidden;padding:0!important}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w1{background:#f3f4f4;box-shadow:inset .0625rem 0 #d2d4d4,inset -.0625rem 0 #d2d4d4,inset 0 .0625rem #d2d4d4,inset 0 -.0625rem #d2d4d4,inset 1em 0 #fff,inset -1em 0 #fff,inset 0 1em #fff,inset 0 -1em #fff}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w3{visibility:hidden}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w4{visibility:visible;width:auto;height:100%}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w5{visibility:visible;width:100%;height:auto}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1orib4w6{text-align:center;color:#717779;font-size:6em}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba10{float:right;display:table}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba11{vertical-align:middle;display:table-cell}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba12{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;display:grid}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba13{width:100%;margin-bottom:.5rem;display:block}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba14{cursor:pointer;background:0 0;border:0;padding:0;display:block}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba14:focus{outline-offset:.125rem;outline:.125rem solid #007db8;box-shadow:0 0 0 6px #fff}.pkg_sps-woodland_core__family_photo__version_8_56_3__hash_1744ba16{opacity:.4}
|
|
2
|
+
/*$vite$:1*/
|
|
@@ -1,106 +1,90 @@
|
|
|
1
1
|
import * as e from "react";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
return b.current && r.observe(b.current), () => {
|
|
89
|
-
clearTimeout(t), r.disconnect();
|
|
90
|
-
};
|
|
91
|
-
}, [i, N, L, k]);
|
|
92
|
-
const G = i ? n.slice(0, I) : n, O = i && I < n.length ? n.slice(I) : [];
|
|
93
|
-
return {
|
|
94
|
-
visibleItems: G,
|
|
95
|
-
overflowItems: O,
|
|
96
|
-
containerRef: R,
|
|
97
|
-
parentRef: b,
|
|
98
|
-
overflowButtonRef: x,
|
|
99
|
-
contentRef: A,
|
|
100
|
-
brandRef: w,
|
|
101
|
-
hideProductName: T
|
|
102
|
-
};
|
|
2
|
+
//#region src/product-bar/hooks/usePriorityPlus.ts
|
|
3
|
+
function t(t, n = {}) {
|
|
4
|
+
let { enabled: r = !0, minVisibleItems: i = 1, debounceMs: a = 16 } = n, o = e.useRef(null), s = e.useRef(null), c = e.useRef(null), l = e.useRef(null), u = e.useRef(null), d = e.useRef([]), f = e.useRef(0), p = e.useRef(0), m = e.useRef(!1), [h, g] = e.useState(t.length), [_, v] = e.useState(!1), y = e.useCallback(() => {
|
|
5
|
+
if (!o.current) return !1;
|
|
6
|
+
let e = o.current, n = Array.from(e.children), r = c.current;
|
|
7
|
+
r && (f.current = r.getBoundingClientRect().width);
|
|
8
|
+
let i = n.filter((e) => e !== r);
|
|
9
|
+
if (i.length < t.length) return !1;
|
|
10
|
+
if (d.current = i.map((e) => e.getBoundingClientRect().width), u.current) {
|
|
11
|
+
let e = u.current.querySelector("span:last-of-type");
|
|
12
|
+
if (e) {
|
|
13
|
+
let t = e.getBoundingClientRect().width, n = getComputedStyle(u.current), r = parseFloat(n.marginRight) || 0, i = Math.max(0, r - 8);
|
|
14
|
+
p.current = t + i;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
return m.current = !0, !0;
|
|
18
|
+
}, [t.length]), b = e.useCallback(() => {
|
|
19
|
+
if (!s.current) return 0;
|
|
20
|
+
let e = s.current, t = e.getBoundingClientRect(), n = getComputedStyle(e), r = parseFloat(n.paddingLeft) + parseFloat(n.paddingRight), i = parseFloat(n.gap) || 0, a = r, c = Array.from(e.children), u = c.filter((e) => getComputedStyle(e).display !== "none");
|
|
21
|
+
u.length > 1 && (a += i * (u.length - 1));
|
|
22
|
+
for (let e of c) {
|
|
23
|
+
if (e === o.current) continue;
|
|
24
|
+
let t = getComputedStyle(e), n = parseFloat(t.marginLeft) + parseFloat(t.marginRight);
|
|
25
|
+
if (e === l.current) {
|
|
26
|
+
let t = Array.from(e.children), r = getComputedStyle(e), i = parseFloat(r.gap) || 0;
|
|
27
|
+
for (let e of t) {
|
|
28
|
+
let t = getComputedStyle(e), n = parseFloat(t.marginLeft) + parseFloat(t.marginRight);
|
|
29
|
+
a += e.getBoundingClientRect().width + n;
|
|
30
|
+
}
|
|
31
|
+
t.length > 1 && (a += i * (t.length - 1)), a += parseFloat(r.paddingLeft) + parseFloat(r.paddingRight), a += n;
|
|
32
|
+
} else a += e.getBoundingClientRect().width + n;
|
|
33
|
+
}
|
|
34
|
+
return Math.max(0, t.width - a - 2);
|
|
35
|
+
}, []), x = e.useRef(!1), S = e.useCallback(() => {
|
|
36
|
+
if (!r || !m.current) {
|
|
37
|
+
v(!1), x.current = !1;
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
let e = b(), n = d.current, a = f.current || 100, o = p.current || 0;
|
|
41
|
+
if (x.current && o > 0 && (e -= o), n.length === 0 || e <= 0 || n.reduce((e, t) => e + t, 0) <= e) {
|
|
42
|
+
g(t.length), v(!1), x.current = !1;
|
|
43
|
+
return;
|
|
44
|
+
}
|
|
45
|
+
let s = 0, c = 0, l = e - a;
|
|
46
|
+
for (let e = 0; e < n.length; e++) {
|
|
47
|
+
let t = n[e];
|
|
48
|
+
if (s + t <= l) s += t, c++;
|
|
49
|
+
else break;
|
|
50
|
+
}
|
|
51
|
+
let u = Math.min(i, t.length), h = Math.max(c, u), _ = n.slice(0, u).reduce((e, t) => e + t, 0) + a, y = c < u && _ > e && o > 0, S = !y && e > _ + o + 20, C = x.current;
|
|
52
|
+
y && !x.current ? C = !0 : S && x.current && (C = !1), C !== x.current && (x.current = C, v(C)), g(h);
|
|
53
|
+
}, [
|
|
54
|
+
r,
|
|
55
|
+
t.length,
|
|
56
|
+
i,
|
|
57
|
+
b
|
|
58
|
+
]);
|
|
59
|
+
return e.useEffect(() => {
|
|
60
|
+
r && (m.current = !1, d.current = []), g(t.length);
|
|
61
|
+
}, [r, t.length]), e.useLayoutEffect(() => {
|
|
62
|
+
r && o.current && y() && S();
|
|
63
|
+
}), e.useEffect(() => {
|
|
64
|
+
if (!r) return;
|
|
65
|
+
let e, t = new ResizeObserver(() => {
|
|
66
|
+
clearTimeout(e), e = setTimeout(() => {
|
|
67
|
+
m.current || y(), S();
|
|
68
|
+
}, a);
|
|
69
|
+
});
|
|
70
|
+
return s.current && t.observe(s.current), () => {
|
|
71
|
+
clearTimeout(e), t.disconnect();
|
|
72
|
+
};
|
|
73
|
+
}, [
|
|
74
|
+
r,
|
|
75
|
+
y,
|
|
76
|
+
S,
|
|
77
|
+
a
|
|
78
|
+
]), {
|
|
79
|
+
visibleItems: r ? t.slice(0, h) : t,
|
|
80
|
+
overflowItems: r && h < t.length ? t.slice(h) : [],
|
|
81
|
+
containerRef: o,
|
|
82
|
+
parentRef: s,
|
|
83
|
+
overflowButtonRef: c,
|
|
84
|
+
contentRef: l,
|
|
85
|
+
brandRef: u,
|
|
86
|
+
hideProductName: _
|
|
87
|
+
};
|
|
103
88
|
}
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
};
|
|
89
|
+
//#endregion
|
|
90
|
+
export { t as usePriorityPlus };
|