@sps-woodland/list-bar 8.34.13 → 8.34.14
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/index.js +79 -79
- package/lib/index.umd.cjs +3 -3
- package/lib/style.css +1 -1
- package/package.json +23 -22
- package/vite.config.mjs +1 -1
package/lib/index.js
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
import * as e from "react";
|
|
2
|
-
import { Metadata as b, modChildren as te, cl as w, selectChildren as ae, addProps as re, PortalContext as
|
|
2
|
+
import { Metadata as b, modChildren as te, cl as w, selectChildren as ae, addProps as re, PortalContext as ne, contentOf as se } from "@sps-woodland/core";
|
|
3
3
|
import { Button as _ } from "@sps-woodland/buttons";
|
|
4
4
|
import { Tag as C } from "@sps-woodland/tags";
|
|
5
5
|
import { lockToAnimationFrames as oe, code as o } from "@spscommerce/utils";
|
|
6
|
-
import { SpsInputGroup as le, SpsCheckbox as ce, SpsDropdown as ie, SpsForm as de, SpsFocusedTask as ue, SpsTable as me, SpsTableHead as pe, SpsTableHeader as A, SpsTableBody as he, SpsTableRow as v, SpsTableCell as
|
|
6
|
+
import { SpsInputGroup as le, SpsCheckbox as ce, SpsDropdown as ie, SpsForm as de, SpsFocusedTask as ue, SpsTable as me, SpsTableHead as pe, SpsTableHeader as A, SpsTableBody as he, SpsTableRow as v, SpsTableCell as s } from "@spscommerce/ds-react";
|
|
7
7
|
import { useWoodlandLanguage as k } from "@spscommerce/i18n";
|
|
8
8
|
import { sprinkles as Se } from "@sps-woodland/tokens";
|
|
9
|
-
var fe = "pkg_sps-woodland_list-
|
|
9
|
+
var fe = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc0", ve = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc1", be = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc2", Be = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc3", _e = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc4", ge = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc5", Te = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc6", Ee = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc7", Le = "pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc8";
|
|
10
10
|
function R({
|
|
11
11
|
results: t,
|
|
12
12
|
selections: a,
|
|
13
13
|
zeroStateText: r,
|
|
14
|
-
onClear:
|
|
14
|
+
onClear: n,
|
|
15
15
|
className: l,
|
|
16
|
-
children:
|
|
17
|
-
...
|
|
16
|
+
children: u,
|
|
17
|
+
...m
|
|
18
18
|
}) {
|
|
19
|
-
const { t: c } = k(),
|
|
20
|
-
return /* @__PURE__ */ e.createElement("div", { className: ve, ...
|
|
19
|
+
const { t: c } = k(), p = a ? Object.keys(a).reduce((h, i) => (a[i].length > 0 && (h[i] = a[i]), h), {}) : {};
|
|
20
|
+
return /* @__PURE__ */ e.createElement("div", { className: ve, ...m }, t != null && /* @__PURE__ */ e.createElement("div", { className: be }, /* @__PURE__ */ e.createElement("span", null, c("searchResultsBar.results", { defaultValue: "Results:" })), /* @__PURE__ */ e.createElement(C, { className: Be, kind: "info" }, /* @__PURE__ */ e.createElement("span", null, t))), /* @__PURE__ */ e.createElement("div", { className: _e }, Object.keys(p).length > 0 ? Object.keys(p).map((h, i) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { key: i, className: ge }, h, ":"), p[h].map((g, B) => /* @__PURE__ */ e.createElement(C, { className: Te, key: B, kind: "key" }, /* @__PURE__ */ e.createElement("span", null, g))))) : /* @__PURE__ */ e.createElement("span", { className: "font-italic" }, r || c("searchResultsBar.noAdvancedSearchSelections", { defaultValue: "No Advanced Search Selections" }))), /* @__PURE__ */ e.createElement("div", { className: Ee }, /* @__PURE__ */ e.createElement(_, { className: Le, kind: "link", onClick: n }, c("searchResultsBar.clearResults", { defaultValue: "Clear Results" }))));
|
|
21
21
|
}
|
|
22
22
|
b.set(R, {
|
|
23
23
|
name: "Search Results Bar",
|
|
@@ -39,49 +39,49 @@ function ye(t, a, r) {
|
|
|
39
39
|
function G(t, a) {
|
|
40
40
|
var r = Object.keys(t);
|
|
41
41
|
if (Object.getOwnPropertySymbols) {
|
|
42
|
-
var
|
|
43
|
-
a && (
|
|
42
|
+
var n = Object.getOwnPropertySymbols(t);
|
|
43
|
+
a && (n = n.filter(function(l) {
|
|
44
44
|
return Object.getOwnPropertyDescriptor(t, l).enumerable;
|
|
45
|
-
})), r.push.apply(r,
|
|
45
|
+
})), r.push.apply(r, n);
|
|
46
46
|
}
|
|
47
47
|
return r;
|
|
48
48
|
}
|
|
49
49
|
function U(t) {
|
|
50
50
|
for (var a = 1; a < arguments.length; a++) {
|
|
51
51
|
var r = arguments[a] != null ? arguments[a] : {};
|
|
52
|
-
a % 2 ? G(Object(r), !0).forEach(function(
|
|
53
|
-
ye(t,
|
|
54
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(r)) : G(Object(r)).forEach(function(
|
|
55
|
-
Object.defineProperty(t,
|
|
52
|
+
a % 2 ? G(Object(r), !0).forEach(function(n) {
|
|
53
|
+
ye(t, n, r[n]);
|
|
54
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(r)) : G(Object(r)).forEach(function(n) {
|
|
55
|
+
Object.defineProperty(t, n, Object.getOwnPropertyDescriptor(r, n));
|
|
56
56
|
});
|
|
57
57
|
}
|
|
58
58
|
return t;
|
|
59
59
|
}
|
|
60
60
|
var we = (t, a, r) => {
|
|
61
|
-
for (var
|
|
61
|
+
for (var n of Object.keys(t)) {
|
|
62
62
|
var l;
|
|
63
|
-
if (t[
|
|
63
|
+
if (t[n] !== ((l = a[n]) !== null && l !== void 0 ? l : r[n]))
|
|
64
64
|
return !1;
|
|
65
65
|
}
|
|
66
66
|
return !0;
|
|
67
67
|
}, K = (t) => (a) => {
|
|
68
|
-
var r = t.defaultClassName,
|
|
69
|
-
for (var l in
|
|
70
|
-
var
|
|
71
|
-
if (
|
|
72
|
-
var c =
|
|
68
|
+
var r = t.defaultClassName, n = U(U({}, t.defaultVariants), a);
|
|
69
|
+
for (var l in n) {
|
|
70
|
+
var u, m = (u = n[l]) !== null && u !== void 0 ? u : t.defaultVariants[l];
|
|
71
|
+
if (m != null) {
|
|
72
|
+
var c = m;
|
|
73
73
|
typeof c == "boolean" && (c = c === !0 ? "true" : "false");
|
|
74
|
-
var
|
|
74
|
+
var p = (
|
|
75
75
|
// @ts-expect-error
|
|
76
76
|
t.variantClassNames[l][c]
|
|
77
77
|
);
|
|
78
|
-
|
|
78
|
+
p && (r += " " + p);
|
|
79
79
|
}
|
|
80
80
|
}
|
|
81
|
-
for (var [h,
|
|
82
|
-
we(h,
|
|
81
|
+
for (var [h, i] of t.compoundVariants)
|
|
82
|
+
we(h, n, t.defaultVariants) && (r += " " + i);
|
|
83
83
|
return r;
|
|
84
|
-
}, xe = K({ defaultClassName: "pkg_sps-woodland_list-
|
|
84
|
+
}, xe = K({ defaultClassName: "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p701", variantClassNames: { pinned: { true: "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p702", false: "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p703" } }, defaultVariants: { pinned: !1 }, compoundVariants: [] }), Ae = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p704", Ce = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p705", ke = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p706", Re = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p707", Fe = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p708", Oe = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p709", Me = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70a", j = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70b", Ie = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70c", Ve = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d", Ne = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70e", De = "pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70f";
|
|
85
85
|
function Pe({
|
|
86
86
|
children: t
|
|
87
87
|
}) {
|
|
@@ -99,10 +99,10 @@ function F({
|
|
|
99
99
|
onSubmit: t,
|
|
100
100
|
children: a
|
|
101
101
|
}) {
|
|
102
|
-
function r(
|
|
103
|
-
|
|
102
|
+
function r(n) {
|
|
103
|
+
n.preventDefault(), t && t(n);
|
|
104
104
|
}
|
|
105
|
-
return /* @__PURE__ */ e.createElement("form", { onSubmit: r, className:
|
|
105
|
+
return /* @__PURE__ */ e.createElement("form", { onSubmit: r, className: Ie, noValidate: !0 }, /* @__PURE__ */ e.createElement(le, { className: Ve }, /* @__PURE__ */ e.createElement(Pe, null, a)));
|
|
106
106
|
}
|
|
107
107
|
b.set(F, {
|
|
108
108
|
name: "ListBarSearch",
|
|
@@ -110,40 +110,40 @@ b.set(F, {
|
|
|
110
110
|
onSubmit: { type: "FormEventHandler" }
|
|
111
111
|
}
|
|
112
112
|
});
|
|
113
|
-
function
|
|
113
|
+
function O({
|
|
114
114
|
children: t
|
|
115
115
|
}) {
|
|
116
116
|
return /* @__PURE__ */ e.createElement("div", null, t);
|
|
117
117
|
}
|
|
118
|
-
b.set(
|
|
118
|
+
b.set(O, {
|
|
119
119
|
name: "ListBarSearchInfo"
|
|
120
120
|
});
|
|
121
121
|
function q({
|
|
122
122
|
advancedSearch: t,
|
|
123
123
|
onToggleAdvancedSearch: a,
|
|
124
124
|
title: r,
|
|
125
|
-
onToolbarPinned:
|
|
125
|
+
onToolbarPinned: n,
|
|
126
126
|
selectable: l,
|
|
127
|
-
isSelected:
|
|
128
|
-
isIndeterminate:
|
|
127
|
+
isSelected: u,
|
|
128
|
+
isIndeterminate: m,
|
|
129
129
|
disableSelection: c = !1,
|
|
130
|
-
onSelectionChange:
|
|
130
|
+
onSelectionChange: p,
|
|
131
131
|
pinResultsBar: h,
|
|
132
|
-
pinToolbar:
|
|
132
|
+
pinToolbar: i = !0,
|
|
133
133
|
advancedSearchToggleText: g,
|
|
134
134
|
children: B,
|
|
135
135
|
className: x,
|
|
136
|
-
...
|
|
136
|
+
...M
|
|
137
137
|
}) {
|
|
138
138
|
const { t: Y } = k();
|
|
139
139
|
let L = null;
|
|
140
|
-
const [S,
|
|
141
|
-
if (T.current &&
|
|
142
|
-
const
|
|
143
|
-
if (!
|
|
140
|
+
const [S, I] = e.useState(!1), T = e.useRef(null), f = e.useRef(null), { "data-testid": V } = M, y = oe(() => {
|
|
141
|
+
if (T.current && i) {
|
|
142
|
+
const d = T.current.getBoundingClientRect();
|
|
143
|
+
if (!d)
|
|
144
144
|
return;
|
|
145
|
-
const X = Math.round(
|
|
146
|
-
X > 0 && $ <= 60 && (typeof L == "number" ? ee <= L && (L = null,
|
|
145
|
+
const X = Math.round(d.height), $ = Math.round(d.top), ee = Math.round(window.scrollY);
|
|
146
|
+
X > 0 && $ <= 60 && (typeof L == "number" ? ee <= L && (L = null, I(!1)) : (L = Math.round(window.scrollY), I(!0), a && a(!1)));
|
|
147
147
|
}
|
|
148
148
|
});
|
|
149
149
|
e.useEffect(() => (window.addEventListener("scroll", y), window.addEventListener("resize", y), () => {
|
|
@@ -151,25 +151,25 @@ function q({
|
|
|
151
151
|
}), []);
|
|
152
152
|
const E = e.useRef();
|
|
153
153
|
e.useLayoutEffect(() => {
|
|
154
|
-
if (f.current && T.current &&
|
|
154
|
+
if (f.current && T.current && i) {
|
|
155
155
|
if (S && E.current)
|
|
156
156
|
f.current.style.height = E.current.height, f.current.style.width = E.current.width, f.current.style.marginBottom = E.current.marginBottom;
|
|
157
157
|
else if (!S) {
|
|
158
158
|
f.current.style.height = "", f.current.style.width = "", f.current.style.marginBottom = "";
|
|
159
|
-
const
|
|
159
|
+
const d = window.getComputedStyle(T.current);
|
|
160
160
|
E.current = {
|
|
161
|
-
height:
|
|
162
|
-
width:
|
|
163
|
-
marginBottom:
|
|
161
|
+
height: d.height,
|
|
162
|
+
width: d.width,
|
|
163
|
+
marginBottom: d.marginBottom
|
|
164
164
|
};
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
167
|
}, [S]);
|
|
168
168
|
function z() {
|
|
169
|
-
a && a(!
|
|
169
|
+
a && a(!t?.isOpen);
|
|
170
170
|
}
|
|
171
|
-
function Z(
|
|
172
|
-
|
|
171
|
+
function Z(d) {
|
|
172
|
+
n && n(d);
|
|
173
173
|
}
|
|
174
174
|
e.useEffect(() => {
|
|
175
175
|
Z(S);
|
|
@@ -182,20 +182,20 @@ function q({
|
|
|
182
182
|
P
|
|
183
183
|
] = ae(B, [
|
|
184
184
|
{ type: F },
|
|
185
|
-
{ type:
|
|
185
|
+
{ type: O },
|
|
186
186
|
{ type: R },
|
|
187
187
|
{
|
|
188
|
-
custom: (
|
|
188
|
+
custom: (d) => b.isWoodlandComponent(d) && b.get(d).name === "Tabs"
|
|
189
189
|
}
|
|
190
190
|
]);
|
|
191
|
-
return /* @__PURE__ */ e.createElement("div", { className: w(x), ref: f, ...
|
|
191
|
+
return /* @__PURE__ */ e.createElement("div", { className: w(x), ref: f, ...M }, /* @__PURE__ */ e.createElement("div", { className: xe({ pinned: S }), ref: T }, D ? re(D, { context: "container" }) : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: Ae }, !!l && /* @__PURE__ */ e.createElement("div", { className: Ce }, /* @__PURE__ */ e.createElement(
|
|
192
192
|
ce,
|
|
193
193
|
{
|
|
194
|
-
checked:
|
|
194
|
+
checked: u,
|
|
195
195
|
disabled: c,
|
|
196
|
-
indeterminate:
|
|
196
|
+
indeterminate: m,
|
|
197
197
|
onChange: () => {
|
|
198
|
-
|
|
198
|
+
p?.(!u);
|
|
199
199
|
}
|
|
200
200
|
}
|
|
201
201
|
)), /* @__PURE__ */ e.createElement("div", { className: ke }, !r && N, !r && J, N.length > 0 && t && /* @__PURE__ */ e.createElement(
|
|
@@ -205,8 +205,8 @@ function q({
|
|
|
205
205
|
"data-testid": `${V}__advanced-search`
|
|
206
206
|
},
|
|
207
207
|
/* @__PURE__ */ e.createElement("div", { className: Fe }, /* @__PURE__ */ e.createElement(_, { kind: "link", onClick: z }, g ?? Y("listToolbar.advancedSearchToggle", { defaultValue: "Advanced Search" }))),
|
|
208
|
-
(t.enteredFields || 0) > 0 && /* @__PURE__ */ e.createElement(C, { className:
|
|
209
|
-
), r && /* @__PURE__ */ e.createElement("div", { className:
|
|
208
|
+
(t.enteredFields || 0) > 0 && /* @__PURE__ */ e.createElement(C, { className: Oe, kind: "info", "data-testid": `${V}__entered-fields` }, /* @__PURE__ */ e.createElement("span", null, t.enteredFields))
|
|
209
|
+
), r && /* @__PURE__ */ e.createElement("div", { className: Me }, r)), S ? /* @__PURE__ */ e.createElement("div", { className: j }, /* @__PURE__ */ e.createElement(ne.Provider, { value: { fixed: !0 } }, P)) : /* @__PURE__ */ e.createElement("div", { className: j }, P)), /* @__PURE__ */ e.createElement("div", { className: fe }, (!S || h) && Q))));
|
|
210
210
|
}
|
|
211
211
|
b.set(q, {
|
|
212
212
|
name: "ListBar",
|
|
@@ -230,11 +230,11 @@ function H({
|
|
|
230
230
|
options: t,
|
|
231
231
|
activeOption: a,
|
|
232
232
|
onSortChange: r,
|
|
233
|
-
defaultOption:
|
|
233
|
+
defaultOption: n,
|
|
234
234
|
className: l,
|
|
235
|
-
...
|
|
235
|
+
...u
|
|
236
236
|
}) {
|
|
237
|
-
const
|
|
237
|
+
const m = (t || []).map((c) => [
|
|
238
238
|
{ label: c.label, icon: c.icon },
|
|
239
239
|
() => {
|
|
240
240
|
r && r(c);
|
|
@@ -244,9 +244,9 @@ function H({
|
|
|
244
244
|
ie,
|
|
245
245
|
{
|
|
246
246
|
className: w(l, De),
|
|
247
|
-
icon:
|
|
248
|
-
label:
|
|
249
|
-
options:
|
|
247
|
+
icon: a?.icon || n?.icon,
|
|
248
|
+
label: a?.label || n?.label,
|
|
249
|
+
options: m
|
|
250
250
|
}
|
|
251
251
|
);
|
|
252
252
|
}
|
|
@@ -259,26 +259,26 @@ b.set(H, {
|
|
|
259
259
|
defaultOption: { type: "SortOption" }
|
|
260
260
|
}
|
|
261
261
|
});
|
|
262
|
-
var Ge = K({ defaultClassName: "pkg_sps-woodland_list-
|
|
262
|
+
var Ge = K({ defaultClassName: "pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj410", variantClassNames: { open: { true: "pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj411", false: "pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj412" } }, defaultVariants: { open: !1 }, compoundVariants: [] }), Ue = "pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj413", je = "pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj414", Ke = "pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj415";
|
|
263
263
|
function W({
|
|
264
264
|
formArray: t,
|
|
265
265
|
formGroup: a,
|
|
266
266
|
formMeta: r,
|
|
267
|
-
onSubmit:
|
|
267
|
+
onSubmit: n,
|
|
268
268
|
controlsDisabled: l,
|
|
269
|
-
footerLinks:
|
|
270
|
-
isOpen:
|
|
269
|
+
footerLinks: u,
|
|
270
|
+
isOpen: m,
|
|
271
271
|
onClear: c,
|
|
272
|
-
submitButtonText:
|
|
272
|
+
submitButtonText: p,
|
|
273
273
|
className: h,
|
|
274
|
-
children:
|
|
274
|
+
children: i,
|
|
275
275
|
...g
|
|
276
276
|
}) {
|
|
277
277
|
const { t: B } = k();
|
|
278
278
|
function x() {
|
|
279
279
|
c && c();
|
|
280
280
|
}
|
|
281
|
-
return /* @__PURE__ */ e.createElement("div", { className: w(Ge({ open:
|
|
281
|
+
return /* @__PURE__ */ e.createElement("div", { className: w(Ge({ open: m })), ...g }, /* @__PURE__ */ e.createElement(de, { onSubmit: n, formArray: t, formGroup: a, formMeta: r }, /* @__PURE__ */ e.createElement("div", { className: Ue }, i), /* @__PURE__ */ e.createElement("div", { className: je }, u && /* @__PURE__ */ e.createElement("div", { id: "footer_links" }, se(u)), /* @__PURE__ */ e.createElement("div", { className: Ke }, /* @__PURE__ */ e.createElement(
|
|
282
282
|
_,
|
|
283
283
|
{
|
|
284
284
|
kind: "default",
|
|
@@ -288,7 +288,7 @@ function W({
|
|
|
288
288
|
disabled: l
|
|
289
289
|
},
|
|
290
290
|
B("advancedSearch.clear", { defaultValue: "Clear Fields" })
|
|
291
|
-
), /* @__PURE__ */ e.createElement(_, { kind: "key", type: "submit", disabled: l },
|
|
291
|
+
), /* @__PURE__ */ e.createElement(_, { kind: "key", type: "submit", disabled: l }, p ?? B("advancedSearch.search", { defaultValue: "Search" }))))));
|
|
292
292
|
}
|
|
293
293
|
b.set(W, {
|
|
294
294
|
name: "Advanced Search",
|
|
@@ -572,21 +572,21 @@ function He() {
|
|
|
572
572
|
function r() {
|
|
573
573
|
a(!1);
|
|
574
574
|
}
|
|
575
|
-
function
|
|
575
|
+
function n() {
|
|
576
576
|
a(!0);
|
|
577
577
|
}
|
|
578
|
-
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("p", null, "The List Bar is divided into a number of different sections. It spans the entire width of the corresponding list."), /* @__PURE__ */ e.createElement(_, { kind: "link", onClick:
|
|
578
|
+
return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("p", null, "The List Bar is divided into a number of different sections. It spans the entire width of the corresponding list."), /* @__PURE__ */ e.createElement(_, { kind: "link", onClick: n }, "View Content Order Example"), /* @__PURE__ */ e.createElement(ue, { isOpen: t, onClose: r }, /* @__PURE__ */ e.createElement("h1", null, "Content Order"), /* @__PURE__ */ e.createElement(
|
|
579
579
|
"img",
|
|
580
580
|
{
|
|
581
581
|
src: "assets/images/list-toolbar-example.svg",
|
|
582
582
|
alt: "A List Toolbar with labels on each section",
|
|
583
583
|
className: "w-100 mb-3"
|
|
584
584
|
}
|
|
585
|
-
), /* @__PURE__ */ e.createElement(me, null, /* @__PURE__ */ e.createElement(pe, null, /* @__PURE__ */ e.createElement(A, { style: { width: "80px" } }, "Order"), /* @__PURE__ */ e.createElement(A, null, "Section"), /* @__PURE__ */ e.createElement(A, null, "Notes")), /* @__PURE__ */ e.createElement(he, null, /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(
|
|
585
|
+
), /* @__PURE__ */ e.createElement(me, null, /* @__PURE__ */ e.createElement(pe, null, /* @__PURE__ */ e.createElement(A, { style: { width: "80px" } }, "Order"), /* @__PURE__ */ e.createElement(A, null, "Section"), /* @__PURE__ */ e.createElement(A, null, "Notes")), /* @__PURE__ */ e.createElement(he, null, /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "1")), /* @__PURE__ */ e.createElement(s, null, "Checkbox"), /* @__PURE__ */ e.createElement(s, null, "For Content Rows and Content Tiles only.")), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "2")), /* @__PURE__ */ e.createElement(s, null, "Search/Filter Box"), /* @__PURE__ */ e.createElement(s, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "3")), /* @__PURE__ */ e.createElement(s, null, "Saved Search"), /* @__PURE__ */ e.createElement(s, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "4")), /* @__PURE__ */ e.createElement(s, null, "Advanced Search"), /* @__PURE__ */ e.createElement(s, null, "For more information, visit the Advanced Search page.")), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "5")), /* @__PURE__ */ e.createElement(s, null, "Column Editor"), /* @__PURE__ */ e.createElement(s, { wrap: 500 }, "Use for Tables only. For more information, visit the Column Editor page.")), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "6")), /* @__PURE__ */ e.createElement(s, null, "List View Selector"), /* @__PURE__ */ e.createElement(s, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "7")), /* @__PURE__ */ e.createElement(s, null, "Sorting"), /* @__PURE__ */ e.createElement(s, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "8")), /* @__PURE__ */ e.createElement(s, null, "Buttons"), /* @__PURE__ */ e.createElement(s, { wrap: 500 }, "Buttons always appear in the rightmost section of the List Toolbar. For the ordering of Buttons, refer to the Button Groups section on the Buttons page."))))));
|
|
586
586
|
}
|
|
587
587
|
const We = {
|
|
588
588
|
description: () => /* @__PURE__ */ e.createElement("p", null, "The List Toolbar provides the ability to interact with elements in a list or table. It can contain elements to search, filter, sort, or perform other actions."),
|
|
589
|
-
components: [q, F,
|
|
589
|
+
components: [q, F, O, H],
|
|
590
590
|
examples: {
|
|
591
591
|
general: {
|
|
592
592
|
label: "General Usage",
|
|
@@ -1761,7 +1761,7 @@ export {
|
|
|
1761
1761
|
Pe as InputGroupWrapper,
|
|
1762
1762
|
q as ListBar,
|
|
1763
1763
|
F as ListBarSearch,
|
|
1764
|
-
|
|
1764
|
+
O as ListBarSearchInfo,
|
|
1765
1765
|
H as ListBarSortBy,
|
|
1766
1766
|
tt as MANIFEST,
|
|
1767
1767
|
R as SearchResultsBar
|
package/lib/index.umd.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(l,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react"),require("@sps-woodland/core"),require("@sps-woodland/buttons"),require("@sps-woodland/tags"),require("@spscommerce/utils"),require("@spscommerce/ds-react"),require("@spscommerce/i18n"),require("@sps-woodland/tokens")):typeof define=="function"&&define.amd?define(["exports","react","@sps-woodland/core","@sps-woodland/buttons","@sps-woodland/tags","@spscommerce/utils","@spscommerce/ds-react","@spscommerce/i18n","@sps-woodland/tokens"],g):(l=typeof globalThis<"u"?globalThis:l||self,g(l.ListBar={},l.React,l.core,l.buttons,l.tags,l.utils,l.dsReact,l.i18n,l.tokens))})(this,function(l,g,c,B,k,o,r,F,Y){"use strict";function z(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(a,n,s.get?s:{enumerable:!0,get:()=>t[n]})}}return a.default=t,Object.freeze(a)}const e=z(g);var Z="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc0",J="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc1",Q="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc2",X="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc3",$="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc4",ee="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc5",te="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc6",ae="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc7",re="pkg_sps-woodland_list-bar__version_8_34_13__hash_1gxdcgc8";function w({results:t,selections:a,zeroStateText:n,onClear:s,className:i,children:h,...S}){const{t:d}=F.useWoodlandLanguage(),u=a?Object.keys(a).reduce((f,m)=>(a[m].length>0&&(f[m]=a[m]),f),{}):{};return e.createElement("div",{className:J,...S},t!=null&&e.createElement("div",{className:Q},e.createElement("span",null,d("searchResultsBar.results",{defaultValue:"Results:"})),e.createElement(k.Tag,{className:X,kind:"info"},e.createElement("span",null,t))),e.createElement("div",{className:$},Object.keys(u).length>0?Object.keys(u).map((f,m)=>e.createElement(e.Fragment,null,e.createElement("span",{key:m,className:ee},f,":"),u[f].map((T,_)=>e.createElement(k.Tag,{className:te,key:_,kind:"key"},e.createElement("span",null,T))))):e.createElement("span",{className:"font-italic"},n||d("searchResultsBar.noAdvancedSearchSelections",{defaultValue:"No Advanced Search Selections"}))),e.createElement("div",{className:ae},e.createElement(B.Button,{className:re,kind:"link",onClick:s},d("searchResultsBar.clearResults",{defaultValue:"Clear Results"}))))}c.Metadata.set(w,{name:"Search Results Bar",props:{results:{type:"number | string | null"},selections:{type:"{ [key: string]: string[] }"},zeroStateText:{type:"string"},onClear:{type:"() => void"}}});function ne(t,a,n){return a in t?Object.defineProperty(t,a,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[a]=n,t}function R(t,a){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(t);a&&(s=s.filter(function(i){return Object.getOwnPropertyDescriptor(t,i).enumerable})),n.push.apply(n,s)}return n}function N(t){for(var a=1;a<arguments.length;a++){var n=arguments[a]!=null?arguments[a]:{};a%2?R(Object(n),!0).forEach(function(s){ne(t,s,n[s])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):R(Object(n)).forEach(function(s){Object.defineProperty(t,s,Object.getOwnPropertyDescriptor(n,s))})}return t}var se=(t,a,n)=>{for(var s of Object.keys(t)){var i;if(t[s]!==((i=a[s])!==null&&i!==void 0?i:n[s]))return!1}return!0},D=t=>a=>{var n=t.defaultClassName,s=N(N({},t.defaultVariants),a);for(var i in s){var h,S=(h=s[i])!==null&&h!==void 0?h:t.defaultVariants[i];if(S!=null){var d=S;typeof d=="boolean"&&(d=d===!0?"true":"false");var u=t.variantClassNames[i][d];u&&(n+=" "+u)}}for(var[f,m]of t.compoundVariants)se(f,s,t.defaultVariants)&&(n+=" "+m);return n},oe=D({defaultClassName:"pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p701",variantClassNames:{pinned:{true:"pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p702",false:"pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p703"}},defaultVariants:{pinned:!1},compoundVariants:[]}),le="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p704",ce="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p705",ie="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p706",de="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p707",ue="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p708",me="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p709",pe="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p70a",P="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p70b",he="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p70c",Se="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p70d",fe="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p70e",ve="pkg_sps-woodland_list-bar__version_8_34_13__hash_9h4p70f";function G({children:t}){const a=c.modChildren(t,n=>n.type===B.Button?[{className:c.cl(n.props.className,fe)}]:[]);return e.createElement(e.Fragment,null,a)}function y({onSubmit:t,children:a}){function n(s){s.preventDefault(),t&&t(s)}return e.createElement("form",{onSubmit:n,className:he,noValidate:!0},e.createElement(r.SpsInputGroup,{className:Se},e.createElement(G,null,a)))}c.Metadata.set(y,{name:"ListBarSearch",props:{onSubmit:{type:"FormEventHandler"}}});function A({children:t}){return e.createElement("div",null,t)}c.Metadata.set(A,{name:"ListBarSearchInfo"});function M({advancedSearch:t,onToggleAdvancedSearch:a,title:n,onToolbarPinned:s,selectable:i,isSelected:h,isIndeterminate:S,disableSelection:d=!1,onSelectionChange:u,pinResultsBar:f,pinToolbar:m=!0,advancedSearchToggleText:T,children:_,className:V,...j}){const{t:Ae}=F.useWoodlandLanguage();let C=null;const[v,q]=e.useState(!1),E=e.useRef(null),b=e.useRef(null),{"data-testid":U}=j,x=o.lockToAnimationFrames(()=>{if(E.current&&m){const p=E.current.getBoundingClientRect();if(!p)return;const Me=Math.round(p.height),Oe=Math.round(p.top),Ie=Math.round(window.scrollY);Me>0&&Oe<=60&&(typeof C=="number"?Ie<=C&&(C=null,q(!1)):(C=Math.round(window.scrollY),q(!0),a&&a(!1)))}});e.useEffect(()=>(window.addEventListener("scroll",x),window.addEventListener("resize",x),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}),[]);const L=e.useRef();e.useLayoutEffect(()=>{if(b.current&&E.current&&m){if(v&&L.current)b.current.style.height=L.current.height,b.current.style.width=L.current.width,b.current.style.marginBottom=L.current.marginBottom;else if(!v){b.current.style.height="",b.current.style.width="",b.current.style.marginBottom="";const p=window.getComputedStyle(E.current);L.current={height:p.height,width:p.width,marginBottom:p.marginBottom}}}},[v]);function Ce(){a&&a(!(t!=null&&t.isOpen))}function xe(p){s&&s(p)}e.useEffect(()=>{xe(v)},[v]);const[K,ke,Fe,[H],W]=c.selectChildren(_,[{type:y},{type:A},{type:w},{custom:p=>c.Metadata.isWoodlandComponent(p)&&c.Metadata.get(p).name==="Tabs"}]);return e.createElement("div",{className:c.cl(V),ref:b,...j},e.createElement("div",{className:oe({pinned:v}),ref:E},H?c.addProps(H,{context:"container"}):e.createElement(e.Fragment,null,e.createElement("div",{className:le},!!i&&e.createElement("div",{className:ce},e.createElement(r.SpsCheckbox,{checked:h,disabled:d,indeterminate:S,onChange:()=>{u==null||u(!h)}})),e.createElement("div",{className:ie},!n&&K,!n&&ke,K.length>0&&t&&e.createElement("div",{className:de,"data-testid":`${U}__advanced-search`},e.createElement("div",{className:ue},e.createElement(B.Button,{kind:"link",onClick:Ce},T??Ae("listToolbar.advancedSearchToggle",{defaultValue:"Advanced Search"}))),(t.enteredFields||0)>0&&e.createElement(k.Tag,{className:me,kind:"info","data-testid":`${U}__entered-fields`},e.createElement("span",null,t.enteredFields))),n&&e.createElement("div",{className:pe},n)),v?e.createElement("div",{className:P},e.createElement(c.PortalContext.Provider,{value:{fixed:!0}},W)):e.createElement("div",{className:P},W)),e.createElement("div",{className:Z},(!v||f)&&Fe))))}c.Metadata.set(M,{name:"ListBar",props:{activeTab:{type:"Tab"},advancedSearch:{type:"{ isOpen: boolean, enteredFields: number }"},onToggleAdvancedSearch:{type:"(boolean) => void"},title:{type:"string"},onToolbarPinned:{type:"(boolean) => void"},selectable:{type:"boolean"},disableSelection:{type:"boolean",default:"false"},isSelected:{type:"boolean"},isIndeterminate:{type:"boolean"},onSelectionChange:{type:"(boolean) => void"},pinResultsBar:{type:"boolean"},pinToolbar:{type:"boolean",default:"true"},advancedSearchToggleText:{type:"string"}}});function O({options:t,activeOption:a,onSortChange:n,defaultOption:s,className:i,...h}){const S=(t||[]).map(d=>[{label:d.label,icon:d.icon},()=>{n&&n(d)}]);return e.createElement(r.SpsDropdown,{className:c.cl(i,ve),icon:(a==null?void 0:a.icon)||(s==null?void 0:s.icon),label:(a==null?void 0:a.label)||(s==null?void 0:s.label),options:S})}c.Metadata.set(O,{name:"ListBarSortBy",props:{options:{type:"SortOption[]"},activeOption:{type:"SortOption"},onSortChange:{type:"(option: SortOption) => void"},defaultOption:{type:"SortOption"}}});var be=D({defaultClassName:"pkg_sps-woodland_list-bar__version_8_34_13__hash_q4fj410",variantClassNames:{open:{true:"pkg_sps-woodland_list-bar__version_8_34_13__hash_q4fj411",false:"pkg_sps-woodland_list-bar__version_8_34_13__hash_q4fj412"}},defaultVariants:{open:!1},compoundVariants:[]}),Be="pkg_sps-woodland_list-bar__version_8_34_13__hash_q4fj413",_e="pkg_sps-woodland_list-bar__version_8_34_13__hash_q4fj414",ge="pkg_sps-woodland_list-bar__version_8_34_13__hash_q4fj415";function I({formArray:t,formGroup:a,formMeta:n,onSubmit:s,controlsDisabled:i,footerLinks:h,isOpen:S,onClear:d,submitButtonText:u,className:f,children:m,...T}){const{t:_}=F.useWoodlandLanguage();function V(){d&&d()}return e.createElement("div",{className:c.cl(be({open:S})),...T},e.createElement(r.SpsForm,{onSubmit:s,formArray:t,formGroup:a,formMeta:n},e.createElement("div",{className:Be},m),e.createElement("div",{className:_e},h&&e.createElement("div",{id:"footer_links"},c.contentOf(h)),e.createElement("div",{className:ge},e.createElement(B.Button,{kind:"default",type:"button",className:Y.sprinkles({mr:"sm"}),onClick:V,disabled:i},_("advancedSearch.clear",{defaultValue:"Clear Fields"})),e.createElement(B.Button,{kind:"key",type:"submit",disabled:i},u??_("advancedSearch.search",{defaultValue:"Search"}))))))}c.Metadata.set(I,{name:"Advanced Search",props:{formArray:{type:"SpsFormArray<any>"},formGroup:{type:"SpsFormGroup"},formMeta:{type:"SpsFormSetMeta<any>"},onSubmit:{type:"React.FormEventHandler"},controlsDisabled:{type:"boolean"},footerLinks:{type:"React.ReactNode | (() => React.ReactNode)"},isOpen:{type:"boolean"},onClear:{type:"() => void"},submitButtonText:{type:"string"}}});const Te={components:[I],examples:{general:{label:"General Usage",description:({NavigateTo:t,Link:a})=>e.createElement(e.Fragment,null,e.createElement("p",null,'Advanced Search is comprised of a panel of input fields, and a text button that exposes and hides the panel. By default, the Advanced Search panel is hidden (with the exception of "Advanced Search Only" scenarios).'),e.createElement("p",null,"Advanced Search works in conjunction with the"," ",e.createElement(t,{to:"list-toolbar"},"List Bar")," and"," ",e.createElement(t,{to:"search-results-bar"},"Search Results")," components. Refer to those pages for additional details."),e.createElement("p",null,"Use the following guidelines when including Advanced Search on your page:",e.createElement("ul",null,e.createElement("li",null,"The Advanced Search Panel can contain any number of input fields."),e.createElement("li",null,"The Advanced Search Panel can place input fields in any unique layout to best serve the needs of the search criteria, but must adhere to the rules of the"," ",e.createElement(a,{to:"/style-and-layout/grid/"},"SPS Grid")," and guidelines for"," ",e.createElement(t,{to:"form"},"Form Layouts"),"."))))},basic:{label:"Basic Usage",description:({NavigateTo:t})=>e.createElement(e.Fragment,null,e.createElement("p",null,"A Basic Advanced Search consists of the List Bar with a search input and an Advanced Search text button. For more details on additional button and component options in the List Bar reference the ",e.createElement(t,{to:"list-toolbar"},"List Bar")," page.")),examples:{basic:{react:o.code`
|
|
1
|
+
(function(l,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react"),require("@sps-woodland/core"),require("@sps-woodland/buttons"),require("@sps-woodland/tags"),require("@spscommerce/utils"),require("@spscommerce/ds-react"),require("@spscommerce/i18n"),require("@sps-woodland/tokens")):typeof define=="function"&&define.amd?define(["exports","react","@sps-woodland/core","@sps-woodland/buttons","@sps-woodland/tags","@spscommerce/utils","@spscommerce/ds-react","@spscommerce/i18n","@sps-woodland/tokens"],g):(l=typeof globalThis<"u"?globalThis:l||self,g(l.ListBar={},l.React,l.core,l.buttons,l.tags,l.utils,l.dsReact,l.i18n,l.tokens))})(this,function(l,g,c,B,k,o,a,F,Y){"use strict";function z(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(r,n,s.get?s:{enumerable:!0,get:()=>t[n]})}}return r.default=t,Object.freeze(r)}const e=z(g);var Z="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc0",J="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc1",Q="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc2",X="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc3",$="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc4",ee="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc5",te="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc6",ae="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc7",re="pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc8";function w({results:t,selections:r,zeroStateText:n,onClear:s,className:i,children:m,...h}){const{t:d}=F.useWoodlandLanguage(),S=r?Object.keys(r).reduce((f,u)=>(r[u].length>0&&(f[u]=r[u]),f),{}):{};return e.createElement("div",{className:J,...h},t!=null&&e.createElement("div",{className:Q},e.createElement("span",null,d("searchResultsBar.results",{defaultValue:"Results:"})),e.createElement(k.Tag,{className:X,kind:"info"},e.createElement("span",null,t))),e.createElement("div",{className:$},Object.keys(S).length>0?Object.keys(S).map((f,u)=>e.createElement(e.Fragment,null,e.createElement("span",{key:u,className:ee},f,":"),S[f].map((T,_)=>e.createElement(k.Tag,{className:te,key:_,kind:"key"},e.createElement("span",null,T))))):e.createElement("span",{className:"font-italic"},n||d("searchResultsBar.noAdvancedSearchSelections",{defaultValue:"No Advanced Search Selections"}))),e.createElement("div",{className:ae},e.createElement(B.Button,{className:re,kind:"link",onClick:s},d("searchResultsBar.clearResults",{defaultValue:"Clear Results"}))))}c.Metadata.set(w,{name:"Search Results Bar",props:{results:{type:"number | string | null"},selections:{type:"{ [key: string]: string[] }"},zeroStateText:{type:"string"},onClear:{type:"() => void"}}});function ne(t,r,n){return r in t?Object.defineProperty(t,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[r]=n,t}function R(t,r){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(t);r&&(s=s.filter(function(i){return Object.getOwnPropertyDescriptor(t,i).enumerable})),n.push.apply(n,s)}return n}function N(t){for(var r=1;r<arguments.length;r++){var n=arguments[r]!=null?arguments[r]:{};r%2?R(Object(n),!0).forEach(function(s){ne(t,s,n[s])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):R(Object(n)).forEach(function(s){Object.defineProperty(t,s,Object.getOwnPropertyDescriptor(n,s))})}return t}var se=(t,r,n)=>{for(var s of Object.keys(t)){var i;if(t[s]!==((i=r[s])!==null&&i!==void 0?i:n[s]))return!1}return!0},D=t=>r=>{var n=t.defaultClassName,s=N(N({},t.defaultVariants),r);for(var i in s){var m,h=(m=s[i])!==null&&m!==void 0?m:t.defaultVariants[i];if(h!=null){var d=h;typeof d=="boolean"&&(d=d===!0?"true":"false");var S=t.variantClassNames[i][d];S&&(n+=" "+S)}}for(var[f,u]of t.compoundVariants)se(f,s,t.defaultVariants)&&(n+=" "+u);return n},oe=D({defaultClassName:"pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p701",variantClassNames:{pinned:{true:"pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p702",false:"pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p703"}},defaultVariants:{pinned:!1},compoundVariants:[]}),le="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p704",ce="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p705",ie="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p706",de="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p707",ue="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p708",pe="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p709",me="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70a",P="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70b",he="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70c",Se="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d",fe="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70e",ve="pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70f";function G({children:t}){const r=c.modChildren(t,n=>n.type===B.Button?[{className:c.cl(n.props.className,fe)}]:[]);return e.createElement(e.Fragment,null,r)}function y({onSubmit:t,children:r}){function n(s){s.preventDefault(),t&&t(s)}return e.createElement("form",{onSubmit:n,className:he,noValidate:!0},e.createElement(a.SpsInputGroup,{className:Se},e.createElement(G,null,r)))}c.Metadata.set(y,{name:"ListBarSearch",props:{onSubmit:{type:"FormEventHandler"}}});function C({children:t}){return e.createElement("div",null,t)}c.Metadata.set(C,{name:"ListBarSearchInfo"});function M({advancedSearch:t,onToggleAdvancedSearch:r,title:n,onToolbarPinned:s,selectable:i,isSelected:m,isIndeterminate:h,disableSelection:d=!1,onSelectionChange:S,pinResultsBar:f,pinToolbar:u=!0,advancedSearchToggleText:T,children:_,className:V,...j}){const{t:Ce}=F.useWoodlandLanguage();let A=null;const[v,q]=e.useState(!1),E=e.useRef(null),b=e.useRef(null),{"data-testid":U}=j,x=o.lockToAnimationFrames(()=>{if(E.current&&u){const p=E.current.getBoundingClientRect();if(!p)return;const Me=Math.round(p.height),Oe=Math.round(p.top),Ie=Math.round(window.scrollY);Me>0&&Oe<=60&&(typeof A=="number"?Ie<=A&&(A=null,q(!1)):(A=Math.round(window.scrollY),q(!0),r&&r(!1)))}});e.useEffect(()=>(window.addEventListener("scroll",x),window.addEventListener("resize",x),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}),[]);const L=e.useRef();e.useLayoutEffect(()=>{if(b.current&&E.current&&u){if(v&&L.current)b.current.style.height=L.current.height,b.current.style.width=L.current.width,b.current.style.marginBottom=L.current.marginBottom;else if(!v){b.current.style.height="",b.current.style.width="",b.current.style.marginBottom="";const p=window.getComputedStyle(E.current);L.current={height:p.height,width:p.width,marginBottom:p.marginBottom}}}},[v]);function Ae(){r&&r(!t?.isOpen)}function xe(p){s&&s(p)}e.useEffect(()=>{xe(v)},[v]);const[K,ke,Fe,[H],W]=c.selectChildren(_,[{type:y},{type:C},{type:w},{custom:p=>c.Metadata.isWoodlandComponent(p)&&c.Metadata.get(p).name==="Tabs"}]);return e.createElement("div",{className:c.cl(V),ref:b,...j},e.createElement("div",{className:oe({pinned:v}),ref:E},H?c.addProps(H,{context:"container"}):e.createElement(e.Fragment,null,e.createElement("div",{className:le},!!i&&e.createElement("div",{className:ce},e.createElement(a.SpsCheckbox,{checked:m,disabled:d,indeterminate:h,onChange:()=>{S?.(!m)}})),e.createElement("div",{className:ie},!n&&K,!n&&ke,K.length>0&&t&&e.createElement("div",{className:de,"data-testid":`${U}__advanced-search`},e.createElement("div",{className:ue},e.createElement(B.Button,{kind:"link",onClick:Ae},T??Ce("listToolbar.advancedSearchToggle",{defaultValue:"Advanced Search"}))),(t.enteredFields||0)>0&&e.createElement(k.Tag,{className:pe,kind:"info","data-testid":`${U}__entered-fields`},e.createElement("span",null,t.enteredFields))),n&&e.createElement("div",{className:me},n)),v?e.createElement("div",{className:P},e.createElement(c.PortalContext.Provider,{value:{fixed:!0}},W)):e.createElement("div",{className:P},W)),e.createElement("div",{className:Z},(!v||f)&&Fe))))}c.Metadata.set(M,{name:"ListBar",props:{activeTab:{type:"Tab"},advancedSearch:{type:"{ isOpen: boolean, enteredFields: number }"},onToggleAdvancedSearch:{type:"(boolean) => void"},title:{type:"string"},onToolbarPinned:{type:"(boolean) => void"},selectable:{type:"boolean"},disableSelection:{type:"boolean",default:"false"},isSelected:{type:"boolean"},isIndeterminate:{type:"boolean"},onSelectionChange:{type:"(boolean) => void"},pinResultsBar:{type:"boolean"},pinToolbar:{type:"boolean",default:"true"},advancedSearchToggleText:{type:"string"}}});function O({options:t,activeOption:r,onSortChange:n,defaultOption:s,className:i,...m}){const h=(t||[]).map(d=>[{label:d.label,icon:d.icon},()=>{n&&n(d)}]);return e.createElement(a.SpsDropdown,{className:c.cl(i,ve),icon:r?.icon||s?.icon,label:r?.label||s?.label,options:h})}c.Metadata.set(O,{name:"ListBarSortBy",props:{options:{type:"SortOption[]"},activeOption:{type:"SortOption"},onSortChange:{type:"(option: SortOption) => void"},defaultOption:{type:"SortOption"}}});var be=D({defaultClassName:"pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj410",variantClassNames:{open:{true:"pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj411",false:"pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj412"}},defaultVariants:{open:!1},compoundVariants:[]}),Be="pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj413",_e="pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj414",ge="pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj415";function I({formArray:t,formGroup:r,formMeta:n,onSubmit:s,controlsDisabled:i,footerLinks:m,isOpen:h,onClear:d,submitButtonText:S,className:f,children:u,...T}){const{t:_}=F.useWoodlandLanguage();function V(){d&&d()}return e.createElement("div",{className:c.cl(be({open:h})),...T},e.createElement(a.SpsForm,{onSubmit:s,formArray:t,formGroup:r,formMeta:n},e.createElement("div",{className:Be},u),e.createElement("div",{className:_e},m&&e.createElement("div",{id:"footer_links"},c.contentOf(m)),e.createElement("div",{className:ge},e.createElement(B.Button,{kind:"default",type:"button",className:Y.sprinkles({mr:"sm"}),onClick:V,disabled:i},_("advancedSearch.clear",{defaultValue:"Clear Fields"})),e.createElement(B.Button,{kind:"key",type:"submit",disabled:i},S??_("advancedSearch.search",{defaultValue:"Search"}))))))}c.Metadata.set(I,{name:"Advanced Search",props:{formArray:{type:"SpsFormArray<any>"},formGroup:{type:"SpsFormGroup"},formMeta:{type:"SpsFormSetMeta<any>"},onSubmit:{type:"React.FormEventHandler"},controlsDisabled:{type:"boolean"},footerLinks:{type:"React.ReactNode | (() => React.ReactNode)"},isOpen:{type:"boolean"},onClear:{type:"() => void"},submitButtonText:{type:"string"}}});const Te={components:[I],examples:{general:{label:"General Usage",description:({NavigateTo:t,Link:r})=>e.createElement(e.Fragment,null,e.createElement("p",null,'Advanced Search is comprised of a panel of input fields, and a text button that exposes and hides the panel. By default, the Advanced Search panel is hidden (with the exception of "Advanced Search Only" scenarios).'),e.createElement("p",null,"Advanced Search works in conjunction with the"," ",e.createElement(t,{to:"list-toolbar"},"List Bar")," and"," ",e.createElement(t,{to:"search-results-bar"},"Search Results")," components. Refer to those pages for additional details."),e.createElement("p",null,"Use the following guidelines when including Advanced Search on your page:",e.createElement("ul",null,e.createElement("li",null,"The Advanced Search Panel can contain any number of input fields."),e.createElement("li",null,"The Advanced Search Panel can place input fields in any unique layout to best serve the needs of the search criteria, but must adhere to the rules of the"," ",e.createElement(r,{to:"/style-and-layout/grid/"},"SPS Grid")," and guidelines for"," ",e.createElement(t,{to:"form"},"Form Layouts"),"."))))},basic:{label:"Basic Usage",description:({NavigateTo:t})=>e.createElement(e.Fragment,null,e.createElement("p",null,"A Basic Advanced Search consists of the List Bar with a search input and an Advanced Search text button. For more details on additional button and component options in the List Bar reference the ",e.createElement(t,{to:"list-toolbar"},"List Bar")," page.")),examples:{basic:{react:o.code`
|
|
2
2
|
import { ListBar, ListBarSearch, SearchResultsBar, AdvancedSearch } from "@sps-woodland/list-bar";
|
|
3
3
|
import { Button } from "@sps-woodland/buttons";
|
|
4
4
|
import { grid } from "@sps-woodland/tokens";
|
|
@@ -216,7 +216,7 @@
|
|
|
216
216
|
</>
|
|
217
217
|
)
|
|
218
218
|
}
|
|
219
|
-
`}}}}};function Ee(){const[t,
|
|
219
|
+
`}}}}};function Ee(){const[t,r]=e.useState(!1);function n(){r(!1)}function s(){r(!0)}return e.createElement(e.Fragment,null,e.createElement("p",null,"The List Bar is divided into a number of different sections. It spans the entire width of the corresponding list."),e.createElement(B.Button,{kind:"link",onClick:s},"View Content Order Example"),e.createElement(a.SpsFocusedTask,{isOpen:t,onClose:n},e.createElement("h1",null,"Content Order"),e.createElement("img",{src:"assets/images/list-toolbar-example.svg",alt:"A List Toolbar with labels on each section",className:"w-100 mb-3"}),e.createElement(a.SpsTable,null,e.createElement(a.SpsTableHead,null,e.createElement(a.SpsTableHeader,{style:{width:"80px"}},"Order"),e.createElement(a.SpsTableHeader,null,"Section"),e.createElement(a.SpsTableHeader,null,"Notes")),e.createElement(a.SpsTableBody,null,e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"1")),e.createElement(a.SpsTableCell,null,"Checkbox"),e.createElement(a.SpsTableCell,null,"For Content Rows and Content Tiles only.")),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"2")),e.createElement(a.SpsTableCell,null,"Search/Filter Box"),e.createElement(a.SpsTableCell,null)),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"3")),e.createElement(a.SpsTableCell,null,"Saved Search"),e.createElement(a.SpsTableCell,null)),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"4")),e.createElement(a.SpsTableCell,null,"Advanced Search"),e.createElement(a.SpsTableCell,null,"For more information, visit the Advanced Search page.")),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"5")),e.createElement(a.SpsTableCell,null,"Column Editor"),e.createElement(a.SpsTableCell,{wrap:500},"Use for Tables only. For more information, visit the Column Editor page.")),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"6")),e.createElement(a.SpsTableCell,null,"List View Selector"),e.createElement(a.SpsTableCell,null)),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"7")),e.createElement(a.SpsTableCell,null,"Sorting"),e.createElement(a.SpsTableCell,null)),e.createElement(a.SpsTableRow,null,e.createElement(a.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"8")),e.createElement(a.SpsTableCell,null,"Buttons"),e.createElement(a.SpsTableCell,{wrap:500},"Buttons always appear in the rightmost section of the List Toolbar. For the ordering of Buttons, refer to the Button Groups section on the Buttons page."))))))}const Le={description:()=>e.createElement("p",null,"The List Toolbar provides the ability to interact with elements in a list or table. It can contain elements to search, filter, sort, or perform other actions."),components:[M,y,C,O],examples:{general:{label:"General Usage",description:()=>e.createElement(e.Fragment,null,e.createElement("h5",null,"Use a List Toolbar:"),e.createElement("ul",null,e.createElement("li",null,"When list content needs to be searched, filtered, sorted, or otherwise interacted with.")),e.createElement("h5",null,"Avoid a List Toolbar:"),e.createElement("ul",null,e.createElement("li",null,"When no list is present."),e.createElement("li",null,"When there will always be a small number of elements in the list, or the list does not require searching, filtering, or other actions.")))},contentOrder:{label:"Content Order",description:e.createElement(Ee,null)},checkbox:{label:"Checkbox",description:({NavigateTo:t})=>e.createElement("p",null,"Use a Checkbox in the List Bar when items in a"," ",e.createElement(t,{to:"content-row"},"Content Row")," or"," ",e.createElement(t,{to:"content-tile"},"Content Tile")," are selectable. The Checkbox selects all items in the list, and will cause the Action Bar to appear. Do not use this with a Table, as Tables have a built-in checkbox in the header row."),examples:{basic:{react:o.code`
|
|
220
220
|
import { ListBar, ListBarSearch } from "@sps-woodland/list-bar";
|
|
221
221
|
|
|
222
222
|
function Component() {
|
|
@@ -1083,4 +1083,4 @@
|
|
|
1083
1083
|
</>
|
|
1084
1084
|
)
|
|
1085
1085
|
}
|
|
1086
|
-
`}}}}},ye={"Advanced Search":Te,"List Bar":Le,"Search Results Bar":we};l.AdvancedSearch=I,l.InputGroupWrapper=G,l.ListBar=M,l.ListBarSearch=y,l.ListBarSearchInfo=
|
|
1086
|
+
`}}}}},ye={"Advanced Search":Te,"List Bar":Le,"Search Results Bar":we};l.AdvancedSearch=I,l.InputGroupWrapper=G,l.ListBar=M,l.ListBarSearch=y,l.ListBarSearchInfo=C,l.ListBarSortBy=O,l.MANIFEST=ye,l.SearchResultsBar=w,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})});
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pkg_sps-woodland_list-
|
|
1
|
+
.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p701{background:#fff;border-color:#d2d4d4;border-style:solid;border-width:.0625rem;border-radius:.25rem;display:flex;flex-flow:column wrap;margin-top:0;margin-right:0;margin-bottom:.5rem;margin-left:0;position:relative}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p702{width:calc(1280px - 2.5rem);border-radius:0;transform:translate(-50%);position:fixed;top:3.75rem;left:50%;z-index:999}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p702:after{content:"";background:linear-gradient(180deg,rgba(0,0,0,.1),transparent);display:block;height:.625rem;position:absolute;top:calc(100% + 1px);width:100%}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p704{display:flex;flex-wrap:wrap;padding:.5rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p705{display:flex;align-items:center;border-right-color:#d2d4d4;border-right-style:solid;border-right-width:.0625rem;padding:1rem;margin:-.5rem .5rem -.5rem -.5rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p706{align-items:center;display:inline-flex;flex:1 0 auto;height:2rem;vertical-align:middle}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p707{padding-top:.25rem;padding-right:0;padding-bottom:.25rem;padding-left:0;white-space:nowrap}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p708{display:inline-block;position:relative}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p709{margin-left:.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70a{align-items:center;display:flex;float:left;font-size:.75rem;font-weight:600;line-height:1.5rem;margin-bottom:0;padding-left:.5rem;text-transform:uppercase}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70b{display:inline-block;height:2rem;margin-left:auto;text-align:right;vertical-align:middle;white-space:nowrap}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70c{flex:1;margin-right:.25rem;max-width:25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70e{background-color:#e9e9ea;border-color:#717779;border-width:.0625rem;border-style:solid;border-bottom-left-radius:0;border-bottom-right-radius:.25rem;border-top-left-radius:0;border-top-right-radius:.25rem;border-left-width:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70e:hover{background-color:#d2d4d4;border-width:.0625rem;border-style:solid;border-color:#717779;border-left-width:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70f>.sps-button{margin:0!important;background:transparent;border-color:transparent;color:#4b5356}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70f>.sps-button>button{padding:.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70e>button{height:1.875rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70a>i{font-size:.875rem;margin-right:.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group{flex-wrap:nowrap}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-autocomplete{flex:1}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-multi-select{flex:1}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-select{min-width:30%}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-select:not(:last-child)>.sps-select__dropctrl{height:2rem;line-height:2rem;border-bottom-right-radius:0;border-top-right-radius:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-autocomplete:not(:first-child)>.sps-text-input>.sps-form-control{border-bottom-left-radius:0;border-top-left-radius:0;border-left:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-autocomplete:not(:last-child)>.sps-text-input>.sps-form-control{height:2rem;line-height:2rem;border-bottom-right-radius:0;border-top-right-radius:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-text-input:not(:last-child)>.sps-form-control{border-bottom-right-radius:0;border-top-right-radius:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-multi-select>.sps-text-input>.sps-form-control{border-radius:0;border-left:0;height:32px}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d>.sps-input-group>.sps-text-input:not(:first-child):not(:only-child)>.sps-form-control{border-bottom-left-radius:0;border-left:0;border-top-left-radius:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p70d svg{margin-bottom:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc1{background-color:#e9e9ea;border-width:.0625rem;border-color:#d2d4d4;border-style:solid;border-radius:.25rem;display:flex;min-height:3.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_9h4p701>.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc0>.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc1{border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:.125rem;border-bottom-right-radius:.125rem;border-top-width:.0625rem;border-right-width:0;border-bottom-width:0;border-left-width:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc2{flex:1 1 auto;border-right-width:.0625rem;border-right-color:#d2d4d4;border-right-style:solid;padding:.5rem;display:flex;align-items:center}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc3{margin-left:.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc4{flex:1 1 100%;padding:.5rem;display:flex;align-items:center;flex-wrap:wrap}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc5{margin-top:0;margin-bottom:0;margin-right:.25rem;margin-left:.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc5:first-child{margin-left:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc6{margin-top:.125rem;margin-bottom:.125rem;margin-right:.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc6:last-child{margin-right:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc7{flex:1 1 auto;border-left-width:.0625rem;border-left-style:solid;border-left-color:#d2d4d4;display:flex;align-items:center}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc7:hover{background:#d2d4d4}.pkg_sps-woodland_list-bar__version_8_34_14__hash_1gxdcgc8{padding:.5rem;width:5.25rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj410{background:#fff;border-color:#d2d4d4;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:.25rem;border-bottom-right-radius:.25rem;border-style:solid;border-top-width:0;border-right-width:.0625rem;border-bottom-width:.0625rem;border-left-width:.0625rem;display:none;margin-top:-.625rem;margin-right:0;margin-bottom:1rem;margin-left:0}.pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj411{display:block}.pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj413{padding:1rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj414{background:#f3f4f4;border-top-left-radius:undefined;border-top-right-radius:undefined;border-bottom-left-radius:undefined;border-bottom-right-radius:undefined;display:flex;padding:.5rem}.pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj415{text-align:right}.pkg_sps-woodland_list-bar__version_8_34_14__hash_q4fj414>*{flex:1}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sps-woodland/list-bar",
|
|
3
3
|
"description": "SPS Woodland Design System list bar components",
|
|
4
|
-
"version": "8.34.
|
|
4
|
+
"version": "8.34.14",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/list-bar",
|
|
@@ -12,10 +12,10 @@
|
|
|
12
12
|
"types": "./lib/index.d.ts",
|
|
13
13
|
"exports": {
|
|
14
14
|
".": {
|
|
15
|
+
"types": "./lib/index.d.ts",
|
|
15
16
|
"require": "./lib/index.umd.cjs",
|
|
16
17
|
"import": "./lib/index.js",
|
|
17
|
-
"default": "./lib/index.js"
|
|
18
|
-
"types": "./lib/index.d.ts"
|
|
18
|
+
"default": "./lib/index.js"
|
|
19
19
|
},
|
|
20
20
|
"./lib/style.css": {
|
|
21
21
|
"import": "./lib/style.css",
|
|
@@ -26,32 +26,33 @@
|
|
|
26
26
|
"access": "public"
|
|
27
27
|
},
|
|
28
28
|
"peerDependencies": {
|
|
29
|
-
"@
|
|
29
|
+
"@react-stately/collections": "^3.0.0",
|
|
30
|
+
"@spscommerce/utils": "^7.0.0 || ^8.0.0",
|
|
30
31
|
"react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
31
32
|
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
32
|
-
"@sps-woodland/buttons": "8.34.
|
|
33
|
-
"@sps-woodland/core": "8.34.
|
|
34
|
-
"@sps-woodland/tabs": "8.34.
|
|
35
|
-
"@sps-woodland/tags": "8.34.
|
|
36
|
-
"@sps-woodland/tokens": "8.34.
|
|
37
|
-
"@spscommerce/ds-react": "8.34.
|
|
38
|
-
"@spscommerce/i18n": "8.34.
|
|
33
|
+
"@sps-woodland/buttons": "8.34.14",
|
|
34
|
+
"@sps-woodland/core": "8.34.14",
|
|
35
|
+
"@sps-woodland/tabs": "8.34.14",
|
|
36
|
+
"@sps-woodland/tags": "8.34.14",
|
|
37
|
+
"@sps-woodland/tokens": "8.34.14",
|
|
38
|
+
"@spscommerce/ds-react": "8.34.14",
|
|
39
|
+
"@spscommerce/i18n": "8.34.14"
|
|
39
40
|
},
|
|
40
41
|
"devDependencies": {
|
|
41
|
-
"@react-stately/collections": "^3.
|
|
42
|
-
"@spscommerce/utils": "^
|
|
43
|
-
"@vanilla-extract/css": "^1.
|
|
42
|
+
"@react-stately/collections": "^3.12.7",
|
|
43
|
+
"@spscommerce/utils": "^8.1.1",
|
|
44
|
+
"@vanilla-extract/css": "^1.17.4",
|
|
44
45
|
"@vanilla-extract/recipes": "^0.2.5",
|
|
45
46
|
"react": "^16.9.0",
|
|
46
47
|
"react-dom": "^16.9.0",
|
|
47
|
-
"@sps-woodland/buttons": "8.34.
|
|
48
|
-
"@sps-woodland/core": "8.34.
|
|
49
|
-
"@sps-woodland/tabs": "8.34.
|
|
50
|
-
"@sps-woodland/tags": "8.34.
|
|
51
|
-
"@sps-woodland/tokens": "8.34.
|
|
52
|
-
"@spscommerce/ds-react": "8.34.
|
|
53
|
-
"@spscommerce/ds-shared": "8.34.
|
|
54
|
-
"@spscommerce/i18n": "8.34.
|
|
48
|
+
"@sps-woodland/buttons": "8.34.14",
|
|
49
|
+
"@sps-woodland/core": "8.34.14",
|
|
50
|
+
"@sps-woodland/tabs": "8.34.14",
|
|
51
|
+
"@sps-woodland/tags": "8.34.14",
|
|
52
|
+
"@sps-woodland/tokens": "8.34.14",
|
|
53
|
+
"@spscommerce/ds-react": "8.34.14",
|
|
54
|
+
"@spscommerce/ds-shared": "8.34.14",
|
|
55
|
+
"@spscommerce/i18n": "8.34.14"
|
|
55
56
|
},
|
|
56
57
|
"scripts": {
|
|
57
58
|
"build": "pnpm run build:js && pnpm run build:types",
|
package/vite.config.mjs
CHANGED