@sps-woodland/list-bar 8.30.0 → 8.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.js +79 -76
- package/lib/index.umd.cjs +4 -4
- package/lib/style.css +1 -1
- package/package.json +14 -14
package/lib/index.js
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
import * as e from "react";
|
|
2
|
-
import { Metadata as b, I18nContext as
|
|
2
|
+
import { Metadata as b, I18nContext as C, modChildren as ee, cl as w, selectChildren as te, addProps as ae, PortalContext as re, contentOf as se } from "@sps-woodland/core";
|
|
3
3
|
import { Button as _ } from "@sps-woodland/buttons";
|
|
4
|
-
import { Tag as
|
|
5
|
-
import { lockToAnimationFrames as
|
|
6
|
-
import { SpsInputGroup as
|
|
7
|
-
import { sprinkles as
|
|
8
|
-
var
|
|
9
|
-
function
|
|
4
|
+
import { Tag as A } from "@sps-woodland/tags";
|
|
5
|
+
import { lockToAnimationFrames as ne, code as o } from "@spscommerce/utils";
|
|
6
|
+
import { SpsInputGroup as oe, SpsCheckbox as le, SpsDropdown as ce, SpsForm as ie, SpsFocusedTask as de, SpsTable as ue, SpsTableHead as me, SpsTableHeader as x, SpsTableBody as he, SpsTableRow as v, SpsTableCell as n } from "@spscommerce/ds-react";
|
|
7
|
+
import { sprinkles as pe } from "@sps-woodland/tokens";
|
|
8
|
+
var Se = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc0", fe = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc1", ve = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc2", be = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc3", Be = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc4", _e = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc5", ge = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc6", Te = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc7", Ee = "pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc8";
|
|
9
|
+
function k({
|
|
10
10
|
results: t,
|
|
11
11
|
selections: a,
|
|
12
12
|
zeroStateText: r,
|
|
13
13
|
onClear: s,
|
|
14
14
|
className: l,
|
|
15
15
|
children: u,
|
|
16
|
-
...
|
|
16
|
+
...p
|
|
17
17
|
}) {
|
|
18
|
-
const { t: c } = e.useContext(
|
|
19
|
-
return /* @__PURE__ */ e.createElement("div", { className:
|
|
18
|
+
const { t: c } = e.useContext(C), m = a ? Object.keys(a).reduce((h, i) => (a[i].length > 0 && (h[i] = a[i]), h), {}) : {};
|
|
19
|
+
return /* @__PURE__ */ e.createElement("div", { className: fe, ...p }, t != null && /* @__PURE__ */ e.createElement("div", { className: ve }, /* @__PURE__ */ e.createElement("span", null, c("design-system:searchResultsBar.results", { defaultValue: "Results:" })), /* @__PURE__ */ e.createElement(A, { className: be, kind: "info" }, /* @__PURE__ */ e.createElement("span", null, t))), /* @__PURE__ */ e.createElement("div", { className: Be }, Object.keys(m).length > 0 ? Object.keys(m).map((h, i) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("span", { key: i, className: _e }, h, ":"), m[h].map((B, g) => /* @__PURE__ */ e.createElement(A, { className: ge, key: g, kind: "key" }, /* @__PURE__ */ e.createElement("span", null, B))))) : /* @__PURE__ */ e.createElement("span", { className: "font-italic" }, r || c("design-system:searchResultsBar.noAdvancedSearchSelections", { defaultValue: "No Advanced Search Selections" }))), /* @__PURE__ */ e.createElement("div", { className: Te }, /* @__PURE__ */ e.createElement(_, { className: Ee, kind: "link", onClick: s }, c("design-system:searchResultsBar.clearResults", { defaultValue: "Clear Results" }))));
|
|
20
20
|
}
|
|
21
|
-
b.set(
|
|
21
|
+
b.set(k, {
|
|
22
22
|
name: "Search Results Bar",
|
|
23
23
|
props: {
|
|
24
24
|
results: { type: "number | null" },
|
|
@@ -27,7 +27,7 @@ b.set(C, {
|
|
|
27
27
|
onClear: { type: "() => void" }
|
|
28
28
|
}
|
|
29
29
|
});
|
|
30
|
-
function
|
|
30
|
+
function Le(t, a, r) {
|
|
31
31
|
return a in t ? Object.defineProperty(t, a, {
|
|
32
32
|
value: r,
|
|
33
33
|
enumerable: !0,
|
|
@@ -49,14 +49,14 @@ function G(t) {
|
|
|
49
49
|
for (var a = 1; a < arguments.length; a++) {
|
|
50
50
|
var r = arguments[a] != null ? arguments[a] : {};
|
|
51
51
|
a % 2 ? P(Object(r), !0).forEach(function(s) {
|
|
52
|
-
|
|
52
|
+
Le(t, s, r[s]);
|
|
53
53
|
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(r)) : P(Object(r)).forEach(function(s) {
|
|
54
54
|
Object.defineProperty(t, s, Object.getOwnPropertyDescriptor(r, s));
|
|
55
55
|
});
|
|
56
56
|
}
|
|
57
57
|
return t;
|
|
58
58
|
}
|
|
59
|
-
var
|
|
59
|
+
var ye = (t, a, r) => {
|
|
60
60
|
for (var s of Object.keys(t)) {
|
|
61
61
|
var l;
|
|
62
62
|
if (t[s] !== ((l = a[s]) !== null && l !== void 0 ? l : r[s]))
|
|
@@ -66,9 +66,9 @@ var Te = (t, a, r) => {
|
|
|
66
66
|
}, j = (t) => (a) => {
|
|
67
67
|
var r = t.defaultClassName, s = G(G({}, t.defaultVariants), a);
|
|
68
68
|
for (var l in s) {
|
|
69
|
-
var u,
|
|
70
|
-
if (
|
|
71
|
-
var c =
|
|
69
|
+
var u, p = (u = s[l]) !== null && u !== void 0 ? u : t.defaultVariants[l];
|
|
70
|
+
if (p != null) {
|
|
71
|
+
var c = p;
|
|
72
72
|
typeof c == "boolean" && (c = c === !0 ? "true" : "false");
|
|
73
73
|
var m = (
|
|
74
74
|
// @ts-expect-error
|
|
@@ -77,44 +77,44 @@ var Te = (t, a, r) => {
|
|
|
77
77
|
m && (r += " " + m);
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
-
for (var [
|
|
81
|
-
|
|
80
|
+
for (var [h, i] of t.compoundVariants)
|
|
81
|
+
ye(h, s, t.defaultVariants) && (r += " " + i);
|
|
82
82
|
return r;
|
|
83
|
-
},
|
|
84
|
-
function
|
|
83
|
+
}, we = j({ defaultClassName: "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p701", variantClassNames: { pinned: { true: "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p702", false: "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p703" } }, defaultVariants: { pinned: !1 }, compoundVariants: [] }), xe = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p704", Ae = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p705", Ce = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p706", ke = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p707", Re = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p708", Fe = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p709", Me = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70a", U = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70b", Ie = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70c", Oe = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70d", Ve = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70e", Ne = "pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70f";
|
|
84
|
+
function De({
|
|
85
85
|
children: t
|
|
86
86
|
}) {
|
|
87
|
-
const a =
|
|
87
|
+
const a = ee(
|
|
88
88
|
t,
|
|
89
89
|
(r) => r.type === _ ? [
|
|
90
90
|
{
|
|
91
|
-
className:
|
|
91
|
+
className: w(r.props.className, Ve)
|
|
92
92
|
}
|
|
93
93
|
] : []
|
|
94
94
|
);
|
|
95
95
|
return /* @__PURE__ */ e.createElement(e.Fragment, null, a);
|
|
96
96
|
}
|
|
97
|
-
function
|
|
97
|
+
function R({
|
|
98
98
|
onSubmit: t,
|
|
99
99
|
children: a
|
|
100
100
|
}) {
|
|
101
101
|
function r(s) {
|
|
102
102
|
s.preventDefault(), t && t(s);
|
|
103
103
|
}
|
|
104
|
-
return /* @__PURE__ */ e.createElement("form", { onSubmit: r, className:
|
|
104
|
+
return /* @__PURE__ */ e.createElement("form", { onSubmit: r, className: Ie, noValidate: !0 }, /* @__PURE__ */ e.createElement(oe, { className: Oe }, /* @__PURE__ */ e.createElement(De, null, a)));
|
|
105
105
|
}
|
|
106
|
-
b.set(
|
|
106
|
+
b.set(R, {
|
|
107
107
|
name: "ListBarSearch",
|
|
108
108
|
props: {
|
|
109
109
|
onSubmit: { type: "FormEventHandler" }
|
|
110
110
|
}
|
|
111
111
|
});
|
|
112
|
-
function
|
|
112
|
+
function F({
|
|
113
113
|
children: t
|
|
114
114
|
}) {
|
|
115
115
|
return /* @__PURE__ */ e.createElement("div", null, t);
|
|
116
116
|
}
|
|
117
|
-
b.set(
|
|
117
|
+
b.set(F, {
|
|
118
118
|
name: "ListBarSearchInfo"
|
|
119
119
|
});
|
|
120
120
|
function K({
|
|
@@ -124,25 +124,28 @@ function K({
|
|
|
124
124
|
onToolbarPinned: s,
|
|
125
125
|
selectable: l,
|
|
126
126
|
isSelected: u,
|
|
127
|
-
isIndeterminate:
|
|
127
|
+
isIndeterminate: p,
|
|
128
128
|
disableSelection: c = !1,
|
|
129
129
|
onSelectionChange: m,
|
|
130
|
-
pinResultsBar:
|
|
130
|
+
pinResultsBar: h,
|
|
131
131
|
pinToolbar: i = !0,
|
|
132
132
|
children: B,
|
|
133
133
|
className: g,
|
|
134
|
-
...
|
|
134
|
+
...M
|
|
135
135
|
}) {
|
|
136
|
-
const { t: W } = e.useContext(
|
|
136
|
+
const { t: W } = e.useContext(C);
|
|
137
137
|
let L = null;
|
|
138
|
-
const [S,
|
|
138
|
+
const [S, I] = e.useState(!1), T = e.useRef(null), f = e.useRef(null), { "data-testid": O } = M, y = ne(() => {
|
|
139
139
|
if (T.current && i) {
|
|
140
140
|
const d = T.current.getBoundingClientRect();
|
|
141
|
-
|
|
141
|
+
if (!d)
|
|
142
|
+
return;
|
|
143
|
+
const Q = Math.round(d.height), X = Math.round(d.top), $ = Math.round(window.scrollY);
|
|
144
|
+
Q > 0 && X <= 60 && (typeof L == "number" ? $ <= L && (L = null, I(!1)) : (L = Math.round(window.scrollY), I(!0), a && a(!1)));
|
|
142
145
|
}
|
|
143
146
|
});
|
|
144
|
-
e.useEffect(() => (window.addEventListener("scroll",
|
|
145
|
-
window.removeEventListener("scroll",
|
|
147
|
+
e.useEffect(() => (window.addEventListener("scroll", y), window.addEventListener("resize", y), () => {
|
|
148
|
+
window.removeEventListener("scroll", y), window.removeEventListener("resize", y);
|
|
146
149
|
}), []);
|
|
147
150
|
const E = e.useRef();
|
|
148
151
|
e.useLayoutEffect(() => {
|
|
@@ -175,33 +178,33 @@ function K({
|
|
|
175
178
|
J,
|
|
176
179
|
[N],
|
|
177
180
|
D
|
|
178
|
-
] =
|
|
179
|
-
{ type: k },
|
|
181
|
+
] = te(B, [
|
|
180
182
|
{ type: R },
|
|
181
|
-
{ type:
|
|
183
|
+
{ type: F },
|
|
184
|
+
{ type: k },
|
|
182
185
|
{
|
|
183
186
|
custom: (d) => b.isWoodlandComponent(d) && b.get(d).name === "Tabs"
|
|
184
187
|
}
|
|
185
188
|
]);
|
|
186
|
-
return /* @__PURE__ */ e.createElement("div", { className:
|
|
187
|
-
|
|
189
|
+
return /* @__PURE__ */ e.createElement("div", { className: w(g), ref: f, ...M }, /* @__PURE__ */ e.createElement("div", { className: we({ pinned: S }), ref: T }, N ? ae(N, { context: "container" }) : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: xe }, !!l && /* @__PURE__ */ e.createElement("div", { className: Ae }, /* @__PURE__ */ e.createElement(
|
|
190
|
+
le,
|
|
188
191
|
{
|
|
189
192
|
checked: u,
|
|
190
193
|
disabled: c,
|
|
191
|
-
indeterminate:
|
|
194
|
+
indeterminate: p,
|
|
192
195
|
onChange: () => {
|
|
193
196
|
m == null || m(!u);
|
|
194
197
|
}
|
|
195
198
|
}
|
|
196
|
-
)), /* @__PURE__ */ e.createElement("div", { className:
|
|
199
|
+
)), /* @__PURE__ */ e.createElement("div", { className: Ce }, !r && V, !r && Z, V.length > 0 && t && /* @__PURE__ */ e.createElement(
|
|
197
200
|
"div",
|
|
198
201
|
{
|
|
199
|
-
className:
|
|
200
|
-
"data-testid": `${
|
|
202
|
+
className: ke,
|
|
203
|
+
"data-testid": `${O}__advanced-search`
|
|
201
204
|
},
|
|
202
|
-
/* @__PURE__ */ e.createElement("div", { className:
|
|
203
|
-
(t.enteredFields || 0) > 0 && /* @__PURE__ */ e.createElement(
|
|
204
|
-
), r && /* @__PURE__ */ e.createElement("div", { className:
|
|
205
|
+
/* @__PURE__ */ e.createElement("div", { className: Re }, /* @__PURE__ */ e.createElement(_, { kind: "link", onClick: Y }, W("design-system:listToolbar.advancedSearchToggle", { defaultValue: "Advanced Search" }))),
|
|
206
|
+
(t.enteredFields || 0) > 0 && /* @__PURE__ */ e.createElement(A, { className: Fe, kind: "info", "data-testid": `${O}__entered-fields` }, /* @__PURE__ */ e.createElement("span", null, t.enteredFields))
|
|
207
|
+
), r && /* @__PURE__ */ e.createElement("div", { className: Me }, r)), S ? /* @__PURE__ */ e.createElement("div", { className: U }, /* @__PURE__ */ e.createElement(re.Provider, { value: { fixed: !0 } }, D)) : /* @__PURE__ */ e.createElement("div", { className: U }, D)), /* @__PURE__ */ e.createElement("div", { className: Se }, (!S || h) && J))));
|
|
205
208
|
}
|
|
206
209
|
b.set(K, {
|
|
207
210
|
name: "ListBar",
|
|
@@ -228,19 +231,19 @@ function q({
|
|
|
228
231
|
className: l,
|
|
229
232
|
...u
|
|
230
233
|
}) {
|
|
231
|
-
const
|
|
234
|
+
const p = (t || []).map((c) => [
|
|
232
235
|
{ label: c.label, icon: c.icon },
|
|
233
236
|
() => {
|
|
234
237
|
r && r(c);
|
|
235
238
|
}
|
|
236
239
|
]);
|
|
237
240
|
return /* @__PURE__ */ e.createElement(
|
|
238
|
-
|
|
241
|
+
ce,
|
|
239
242
|
{
|
|
240
|
-
className:
|
|
243
|
+
className: w(l, Ne),
|
|
241
244
|
icon: (a == null ? void 0 : a.icon) || (s == null ? void 0 : s.icon),
|
|
242
245
|
label: (a == null ? void 0 : a.label) || (s == null ? void 0 : s.label),
|
|
243
|
-
options:
|
|
246
|
+
options: p
|
|
244
247
|
}
|
|
245
248
|
);
|
|
246
249
|
}
|
|
@@ -253,7 +256,7 @@ b.set(q, {
|
|
|
253
256
|
defaultOption: { type: "SortOption" }
|
|
254
257
|
}
|
|
255
258
|
});
|
|
256
|
-
var
|
|
259
|
+
var Pe = j({ defaultClassName: "pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj410", variantClassNames: { open: { true: "pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj411", false: "pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj412" } }, defaultVariants: { open: !1 }, compoundVariants: [] }), Ge = "pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj413", Ue = "pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj414", je = "pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj415";
|
|
257
260
|
function H({
|
|
258
261
|
formArray: t,
|
|
259
262
|
formGroup: a,
|
|
@@ -261,22 +264,22 @@ function H({
|
|
|
261
264
|
onSubmit: s,
|
|
262
265
|
controlsDisabled: l,
|
|
263
266
|
footerLinks: u,
|
|
264
|
-
isOpen:
|
|
267
|
+
isOpen: p,
|
|
265
268
|
onClear: c,
|
|
266
269
|
className: m,
|
|
267
|
-
children:
|
|
270
|
+
children: h,
|
|
268
271
|
...i
|
|
269
272
|
}) {
|
|
270
|
-
const { t: B } = e.useContext(
|
|
273
|
+
const { t: B } = e.useContext(C);
|
|
271
274
|
function g() {
|
|
272
275
|
c && c();
|
|
273
276
|
}
|
|
274
|
-
return /* @__PURE__ */ e.createElement("div", { className:
|
|
277
|
+
return /* @__PURE__ */ e.createElement("div", { className: w(Pe({ open: p })), ...i }, /* @__PURE__ */ e.createElement(ie, { onSubmit: s, formArray: t, formGroup: a, formMeta: r }, /* @__PURE__ */ e.createElement("div", { className: Ge }, h), /* @__PURE__ */ e.createElement("div", { className: Ue }, u && /* @__PURE__ */ e.createElement("div", { id: "footer_links" }, se(u)), /* @__PURE__ */ e.createElement("div", { className: je }, /* @__PURE__ */ e.createElement(
|
|
275
278
|
_,
|
|
276
279
|
{
|
|
277
280
|
kind: "default",
|
|
278
281
|
type: "button",
|
|
279
|
-
className:
|
|
282
|
+
className: pe({ mr: "sm" }),
|
|
280
283
|
onClick: g,
|
|
281
284
|
disabled: l
|
|
282
285
|
},
|
|
@@ -296,7 +299,7 @@ b.set(H, {
|
|
|
296
299
|
onClear: { type: "() => void" }
|
|
297
300
|
}
|
|
298
301
|
});
|
|
299
|
-
const
|
|
302
|
+
const Ke = {
|
|
300
303
|
components: [H],
|
|
301
304
|
examples: {
|
|
302
305
|
general: {
|
|
@@ -559,7 +562,7 @@ const Ge = {
|
|
|
559
562
|
}
|
|
560
563
|
}
|
|
561
564
|
};
|
|
562
|
-
function
|
|
565
|
+
function qe() {
|
|
563
566
|
const [t, a] = e.useState(!1);
|
|
564
567
|
function r() {
|
|
565
568
|
a(!1);
|
|
@@ -567,18 +570,18 @@ function Ue() {
|
|
|
567
570
|
function s() {
|
|
568
571
|
a(!0);
|
|
569
572
|
}
|
|
570
|
-
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: s }, "View Content Order Example"), /* @__PURE__ */ e.createElement(
|
|
573
|
+
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: s }, "View Content Order Example"), /* @__PURE__ */ e.createElement(de, { isOpen: t, onClose: r }, /* @__PURE__ */ e.createElement("h1", null, "Content Order"), /* @__PURE__ */ e.createElement(
|
|
571
574
|
"img",
|
|
572
575
|
{
|
|
573
576
|
src: "assets/images/list-toolbar-example.svg",
|
|
574
577
|
alt: "A List Toolbar with labels on each section",
|
|
575
578
|
className: "w-100 mb-3"
|
|
576
579
|
}
|
|
577
|
-
), /* @__PURE__ */ e.createElement(
|
|
580
|
+
), /* @__PURE__ */ e.createElement(ue, null, /* @__PURE__ */ e.createElement(me, null, /* @__PURE__ */ e.createElement(x, { style: { width: "80px" } }, "Order"), /* @__PURE__ */ e.createElement(x, null, "Section"), /* @__PURE__ */ e.createElement(x, null, "Notes")), /* @__PURE__ */ e.createElement(he, null, /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "1")), /* @__PURE__ */ e.createElement(n, null, "Checkbox"), /* @__PURE__ */ e.createElement(n, null, "For Content Rows and Content Tiles only.")), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "2")), /* @__PURE__ */ e.createElement(n, null, "Search/Filter Box"), /* @__PURE__ */ e.createElement(n, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "3")), /* @__PURE__ */ e.createElement(n, null, "Saved Search"), /* @__PURE__ */ e.createElement(n, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "4")), /* @__PURE__ */ e.createElement(n, null, "Advanced Search"), /* @__PURE__ */ e.createElement(n, null, "For more information, visit the Advanced Search page.")), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "5")), /* @__PURE__ */ e.createElement(n, null, "Column Editor"), /* @__PURE__ */ e.createElement(n, { wrap: 500 }, "Use for Tables only. For more information, visit the Column Editor page.")), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "6")), /* @__PURE__ */ e.createElement(n, null, "List View Selector"), /* @__PURE__ */ e.createElement(n, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "7")), /* @__PURE__ */ e.createElement(n, null, "Sorting"), /* @__PURE__ */ e.createElement(n, null)), /* @__PURE__ */ e.createElement(v, null, /* @__PURE__ */ e.createElement(n, null, /* @__PURE__ */ e.createElement("span", { className: "sps-tag sps-tag--info" }, "8")), /* @__PURE__ */ e.createElement(n, null, "Buttons"), /* @__PURE__ */ e.createElement(n, { 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."))))));
|
|
578
581
|
}
|
|
579
|
-
const
|
|
582
|
+
const He = {
|
|
580
583
|
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."),
|
|
581
|
-
components: [K,
|
|
584
|
+
components: [K, R, F, q],
|
|
582
585
|
examples: {
|
|
583
586
|
general: {
|
|
584
587
|
label: "General Usage",
|
|
@@ -586,7 +589,7 @@ const je = {
|
|
|
586
589
|
},
|
|
587
590
|
contentOrder: {
|
|
588
591
|
label: "Content Order",
|
|
589
|
-
description: /* @__PURE__ */ e.createElement(
|
|
592
|
+
description: /* @__PURE__ */ e.createElement(qe, null)
|
|
590
593
|
},
|
|
591
594
|
checkbox: {
|
|
592
595
|
label: "Checkbox",
|
|
@@ -1517,8 +1520,8 @@ const je = {
|
|
|
1517
1520
|
}
|
|
1518
1521
|
}
|
|
1519
1522
|
}
|
|
1520
|
-
},
|
|
1521
|
-
components: [
|
|
1523
|
+
}, We = {
|
|
1524
|
+
components: [k],
|
|
1522
1525
|
examples: {
|
|
1523
1526
|
basic: {
|
|
1524
1527
|
label: "Basic",
|
|
@@ -1743,18 +1746,18 @@ const je = {
|
|
|
1743
1746
|
}
|
|
1744
1747
|
}
|
|
1745
1748
|
}
|
|
1746
|
-
},
|
|
1747
|
-
"Advanced Search":
|
|
1748
|
-
"List Bar":
|
|
1749
|
-
"Search Results Bar":
|
|
1749
|
+
}, $e = {
|
|
1750
|
+
"Advanced Search": Ke,
|
|
1751
|
+
"List Bar": He,
|
|
1752
|
+
"Search Results Bar": We
|
|
1750
1753
|
};
|
|
1751
1754
|
export {
|
|
1752
1755
|
H as AdvancedSearch,
|
|
1753
|
-
|
|
1756
|
+
De as InputGroupWrapper,
|
|
1754
1757
|
K as ListBar,
|
|
1755
|
-
|
|
1756
|
-
|
|
1758
|
+
R as ListBarSearch,
|
|
1759
|
+
F as ListBarSearchInfo,
|
|
1757
1760
|
q as ListBarSortBy,
|
|
1758
|
-
|
|
1759
|
-
|
|
1761
|
+
$e as MANIFEST,
|
|
1762
|
+
k as SearchResultsBar
|
|
1760
1763
|
};
|
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("@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","@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.tokens))})(this,function(l,g,c,B,A,o,r,H){"use strict";function W(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const s in t)if(s!=="default"){const n=Object.getOwnPropertyDescriptor(t,s);Object.defineProperty(a,s,n.get?n:{enumerable:!0,get:()=>t[s]})}}return a.default=t,Object.freeze(a)}const e=W(g);var Y="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc0",z="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc1",Z="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc2",J="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc3",Q="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc4",X="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc5",$="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc6",ee="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc7",te="pkg_sps-woodland_list-bar__version_8_30_0__hash_1gxdcgc8";function y({results:t,selections:a,zeroStateText:s,onClear:n,className:i,children:p,...f}){const{t:d}=e.useContext(c.I18nContext),h=a?Object.keys(a).reduce((S,u)=>(a[u].length>0&&(S[u]=a[u]),S),{}):{};return e.createElement("div",{className:z,...f},t!=null&&e.createElement("div",{className:Z},e.createElement("span",null,d("design-system:searchResultsBar.results",{defaultValue:"Results:"})),e.createElement(A.Tag,{className:J,kind:"info"},e.createElement("span",null,t))),e.createElement("div",{className:Q},Object.keys(h).length>0?Object.keys(h).map((S,u)=>e.createElement(e.Fragment,null,e.createElement("span",{key:u,className:X},S,":"),h[S].map((_,T)=>e.createElement(A.Tag,{className:$,key:T,kind:"key"},e.createElement("span",null,_))))):e.createElement("span",{className:"font-italic"},s||d("design-system:searchResultsBar.noAdvancedSearchSelections",{defaultValue:"No Advanced Search Selections"}))),e.createElement("div",{className:ee},e.createElement(B.Button,{className:te,kind:"link",onClick:n},d("design-system:searchResultsBar.clearResults",{defaultValue:"Clear Results"}))))}c.Metadata.set(y,{name:"Search Results Bar",props:{results:{type:"number | null"},selections:{type:"{ [key: string]: string[] }"},zeroStateText:{type:"string"},onClear:{type:"() => void"}}});function ae(t,a,s){return a in t?Object.defineProperty(t,a,{value:s,enumerable:!0,configurable:!0,writable:!0}):t[a]=s,t}function I(t,a){var s=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);a&&(n=n.filter(function(i){return Object.getOwnPropertyDescriptor(t,i).enumerable})),s.push.apply(s,n)}return s}function O(t){for(var a=1;a<arguments.length;a++){var s=arguments[a]!=null?arguments[a]:{};a%2?I(Object(s),!0).forEach(function(n){ae(t,n,s[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(s)):I(Object(s)).forEach(function(n){Object.defineProperty(t,n,Object.getOwnPropertyDescriptor(s,n))})}return t}var re=(t,a,s)=>{for(var n of Object.keys(t)){var i;if(t[n]!==((i=a[n])!==null&&i!==void 0?i:s[n]))return!1}return!0},V=t=>a=>{var s=t.defaultClassName,n=O(O({},t.defaultVariants),a);for(var i in n){var p,f=(p=n[i])!==null&&p!==void 0?p:t.defaultVariants[i];if(f!=null){var d=f;typeof d=="boolean"&&(d=d===!0?"true":"false");var h=t.variantClassNames[i][d];h&&(s+=" "+h)}}for(var[S,u]of t.compoundVariants)re(S,n,t.defaultVariants)&&(s+=" "+u);return s},se=V({defaultClassName:"pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p701",variantClassNames:{pinned:{true:"pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p702",false:"pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p703"}},defaultVariants:{pinned:!1},compoundVariants:[]}),ne="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p704",oe="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p705",le="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p706",ce="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p707",ie="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p708",de="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p709",ue="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p70a",R="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p70b",me="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p70c",pe="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p70d",he="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p70e",Se="pkg_sps-woodland_list-bar__version_8_30_0__hash_9h4p70f";function N({children:t}){const a=c.modChildren(t,s=>s.type===B.Button?[{className:c.cl(s.props.className,he)}]:[]);return e.createElement(e.Fragment,null,a)}function w({onSubmit:t,children:a}){function s(n){n.preventDefault(),t&&t(n)}return e.createElement("form",{onSubmit:s,className:me,noValidate:!0},e.createElement(r.SpsInputGroup,{className:pe},e.createElement(N,null,a)))}c.Metadata.set(w,{name:"ListBarSearch",props:{onSubmit:{type:"FormEventHandler"}}});function C({children:t}){return e.createElement("div",null,t)}c.Metadata.set(C,{name:"ListBarSearchInfo"});function k({advancedSearch:t,onToggleAdvancedSearch:a,title:s,onToolbarPinned:n,selectable:i,isSelected:p,isIndeterminate:f,disableSelection:d=!1,onSelectionChange:h,pinResultsBar:S,pinToolbar:u=!0,children:_,className:T,...D}){const{t:ye}=e.useContext(c.I18nContext);let x=null;const[v,P]=e.useState(!1),E=e.useRef(null),b=e.useRef(null),{"data-testid":G}=D,j=o.lockToAnimationFrames(()=>{if(E.current&&u){const m=E.current.getBoundingClientRect();m&&m.height>0&&m.top<=60&&(typeof x=="number"?window.scrollY<x&&(x=null,P(!1)):(x=window.scrollY,P(!0),a&&a(!1)))}});e.useEffect(()=>(window.addEventListener("scroll",j),()=>{window.removeEventListener("scroll",j)}),[]);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 m=window.getComputedStyle(E.current);L.current={height:m.height,width:m.width,marginBottom:m.marginBottom}}}},[v]);function we(){a&&a(!(t!=null&&t.isOpen))}function Ce(m){n&&n(m)}e.useEffect(()=>{Ce(v)},[v]);const[q,xe,Ae,[U],K]=c.selectChildren(_,[{type:w},{type:C},{type:y},{custom:m=>c.Metadata.isWoodlandComponent(m)&&c.Metadata.get(m).name==="Tabs"}]);return e.createElement("div",{className:c.cl(T),ref:b,...D},e.createElement("div",{className:se({pinned:v}),ref:E},U?c.addProps(U,{context:"container"}):e.createElement(e.Fragment,null,e.createElement("div",{className:ne},!!i&&e.createElement("div",{className:oe},e.createElement(r.SpsCheckbox,{checked:p,disabled:d,indeterminate:f,onChange:()=>{h==null||h(!p)}})),e.createElement("div",{className:le},!s&&q,!s&&xe,q.length>0&&t&&e.createElement("div",{className:ce,"data-testid":`${G}__advanced-search`},e.createElement("div",{className:ie},e.createElement(B.Button,{kind:"link",onClick:we},ye("design-system:listToolbar.advancedSearchToggle",{defaultValue:"Advanced Search"}))),(t.enteredFields||0)>0&&e.createElement(A.Tag,{className:de,kind:"info","data-testid":`${G}__entered-fields`},e.createElement("span",null,t.enteredFields))),s&&e.createElement("div",{className:ue},s)),v?e.createElement("div",{className:R},e.createElement(c.PortalContext.Provider,{value:{fixed:!0}},K)):e.createElement("div",{className:R},K)),e.createElement("div",{className:Y},(!v||S)&&Ae))))}c.Metadata.set(k,{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"}}});function F({options:t,activeOption:a,onSortChange:s,defaultOption:n,className:i,...p}){const f=(t||[]).map(d=>[{label:d.label,icon:d.icon},()=>{s&&s(d)}]);return e.createElement(r.SpsDropdown,{className:c.cl(i,Se),icon:(a==null?void 0:a.icon)||(n==null?void 0:n.icon),label:(a==null?void 0:a.label)||(n==null?void 0:n.label),options:f})}c.Metadata.set(F,{name:"ListBarSortBy",props:{options:{type:"SortOption[]"},activeOption:{type:"SortOption"},onSortChange:{type:"(option: SortOption) => void"},defaultOption:{type:"SortOption"}}});var fe=V({defaultClassName:"pkg_sps-woodland_list-bar__version_8_30_0__hash_q4fj410",variantClassNames:{open:{true:"pkg_sps-woodland_list-bar__version_8_30_0__hash_q4fj411",false:"pkg_sps-woodland_list-bar__version_8_30_0__hash_q4fj412"}},defaultVariants:{open:!1},compoundVariants:[]}),ve="pkg_sps-woodland_list-bar__version_8_30_0__hash_q4fj413",be="pkg_sps-woodland_list-bar__version_8_30_0__hash_q4fj414",Be="pkg_sps-woodland_list-bar__version_8_30_0__hash_q4fj415";function M({formArray:t,formGroup:a,formMeta:s,onSubmit:n,controlsDisabled:i,footerLinks:p,isOpen:f,onClear:d,className:h,children:S,...u}){const{t:_}=e.useContext(c.I18nContext);function T(){d&&d()}return e.createElement("div",{className:c.cl(fe({open:f})),...u},e.createElement(r.SpsForm,{onSubmit:n,formArray:t,formGroup:a,formMeta:s},e.createElement("div",{className:ve},S),e.createElement("div",{className:be},p&&e.createElement("div",{id:"footer_links"},c.contentOf(p)),e.createElement("div",{className:Be},e.createElement(B.Button,{kind:"default",type:"button",className:H.sprinkles({mr:"sm"}),onClick:T,disabled:i},_("design-system:advancedSearch.clear",{defaultValue:"Clear Fields"})),e.createElement(B.Button,{kind:"key",type:"submit",disabled:i},_("design-system:advancedSearch.search",{defaultValue:"Search"}))))))}c.Metadata.set(M,{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"}}});const _e={components:[M],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("@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","@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.tokens))})(this,function(l,g,c,B,k,o,r,H){"use strict";function W(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=W(g);var Y="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc0",z="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc1",Z="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc2",J="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc3",Q="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc4",X="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc5",$="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc6",ee="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc7",te="pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc8";function w({results:t,selections:a,zeroStateText:n,onClear:s,className:i,children:p,...f}){const{t:d}=e.useContext(c.I18nContext),h=a?Object.keys(a).reduce((S,u)=>(a[u].length>0&&(S[u]=a[u]),S),{}):{};return e.createElement("div",{className:z,...f},t!=null&&e.createElement("div",{className:Z},e.createElement("span",null,d("design-system:searchResultsBar.results",{defaultValue:"Results:"})),e.createElement(k.Tag,{className:J,kind:"info"},e.createElement("span",null,t))),e.createElement("div",{className:Q},Object.keys(h).length>0?Object.keys(h).map((S,u)=>e.createElement(e.Fragment,null,e.createElement("span",{key:u,className:X},S,":"),h[S].map((_,T)=>e.createElement(k.Tag,{className:$,key:T,kind:"key"},e.createElement("span",null,_))))):e.createElement("span",{className:"font-italic"},n||d("design-system:searchResultsBar.noAdvancedSearchSelections",{defaultValue:"No Advanced Search Selections"}))),e.createElement("div",{className:ee},e.createElement(B.Button,{className:te,kind:"link",onClick:s},d("design-system:searchResultsBar.clearResults",{defaultValue:"Clear Results"}))))}c.Metadata.set(w,{name:"Search Results Bar",props:{results:{type:"number | null"},selections:{type:"{ [key: string]: string[] }"},zeroStateText:{type:"string"},onClear:{type:"() => void"}}});function ae(t,a,n){return a in t?Object.defineProperty(t,a,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[a]=n,t}function O(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 V(t){for(var a=1;a<arguments.length;a++){var n=arguments[a]!=null?arguments[a]:{};a%2?O(Object(n),!0).forEach(function(s){ae(t,s,n[s])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):O(Object(n)).forEach(function(s){Object.defineProperty(t,s,Object.getOwnPropertyDescriptor(n,s))})}return t}var re=(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},R=t=>a=>{var n=t.defaultClassName,s=V(V({},t.defaultVariants),a);for(var i in s){var p,f=(p=s[i])!==null&&p!==void 0?p:t.defaultVariants[i];if(f!=null){var d=f;typeof d=="boolean"&&(d=d===!0?"true":"false");var h=t.variantClassNames[i][d];h&&(n+=" "+h)}}for(var[S,u]of t.compoundVariants)re(S,s,t.defaultVariants)&&(n+=" "+u);return n},ne=R({defaultClassName:"pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p701",variantClassNames:{pinned:{true:"pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p702",false:"pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p703"}},defaultVariants:{pinned:!1},compoundVariants:[]}),se="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p704",oe="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p705",le="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p706",ce="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p707",ie="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p708",de="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p709",ue="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70a",N="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70b",me="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70c",pe="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70d",he="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70e",Se="pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70f";function D({children:t}){const a=c.modChildren(t,n=>n.type===B.Button?[{className:c.cl(n.props.className,he)}]:[]);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:me,noValidate:!0},e.createElement(r.SpsInputGroup,{className:pe},e.createElement(D,null,a)))}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 F({advancedSearch:t,onToggleAdvancedSearch:a,title:n,onToolbarPinned:s,selectable:i,isSelected:p,isIndeterminate:f,disableSelection:d=!1,onSelectionChange:h,pinResultsBar:S,pinToolbar:u=!0,children:_,className:T,...P}){const{t:we}=e.useContext(c.I18nContext);let x=null;const[v,G]=e.useState(!1),E=e.useRef(null),b=e.useRef(null),{"data-testid":j}=P,A=o.lockToAnimationFrames(()=>{if(E.current&&u){const m=E.current.getBoundingClientRect();if(!m)return;const ke=Math.round(m.height),Fe=Math.round(m.top),Me=Math.round(window.scrollY);ke>0&&Fe<=60&&(typeof x=="number"?Me<=x&&(x=null,G(!1)):(x=Math.round(window.scrollY),G(!0),a&&a(!1)))}});e.useEffect(()=>(window.addEventListener("scroll",A),window.addEventListener("resize",A),()=>{window.removeEventListener("scroll",A),window.removeEventListener("resize",A)}),[]);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 m=window.getComputedStyle(E.current);L.current={height:m.height,width:m.width,marginBottom:m.marginBottom}}}},[v]);function ye(){a&&a(!(t!=null&&t.isOpen))}function Ce(m){s&&s(m)}e.useEffect(()=>{Ce(v)},[v]);const[q,xe,Ae,[U],K]=c.selectChildren(_,[{type:y},{type:C},{type:w},{custom:m=>c.Metadata.isWoodlandComponent(m)&&c.Metadata.get(m).name==="Tabs"}]);return e.createElement("div",{className:c.cl(T),ref:b,...P},e.createElement("div",{className:ne({pinned:v}),ref:E},U?c.addProps(U,{context:"container"}):e.createElement(e.Fragment,null,e.createElement("div",{className:se},!!i&&e.createElement("div",{className:oe},e.createElement(r.SpsCheckbox,{checked:p,disabled:d,indeterminate:f,onChange:()=>{h==null||h(!p)}})),e.createElement("div",{className:le},!n&&q,!n&&xe,q.length>0&&t&&e.createElement("div",{className:ce,"data-testid":`${j}__advanced-search`},e.createElement("div",{className:ie},e.createElement(B.Button,{kind:"link",onClick:ye},we("design-system:listToolbar.advancedSearchToggle",{defaultValue:"Advanced Search"}))),(t.enteredFields||0)>0&&e.createElement(k.Tag,{className:de,kind:"info","data-testid":`${j}__entered-fields`},e.createElement("span",null,t.enteredFields))),n&&e.createElement("div",{className:ue},n)),v?e.createElement("div",{className:N},e.createElement(c.PortalContext.Provider,{value:{fixed:!0}},K)):e.createElement("div",{className:N},K)),e.createElement("div",{className:Y},(!v||S)&&Ae))))}c.Metadata.set(F,{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"}}});function M({options:t,activeOption:a,onSortChange:n,defaultOption:s,className:i,...p}){const f=(t||[]).map(d=>[{label:d.label,icon:d.icon},()=>{n&&n(d)}]);return e.createElement(r.SpsDropdown,{className:c.cl(i,Se),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:f})}c.Metadata.set(M,{name:"ListBarSortBy",props:{options:{type:"SortOption[]"},activeOption:{type:"SortOption"},onSortChange:{type:"(option: SortOption) => void"},defaultOption:{type:"SortOption"}}});var fe=R({defaultClassName:"pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj410",variantClassNames:{open:{true:"pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj411",false:"pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj412"}},defaultVariants:{open:!1},compoundVariants:[]}),ve="pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj413",be="pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj414",Be="pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj415";function I({formArray:t,formGroup:a,formMeta:n,onSubmit:s,controlsDisabled:i,footerLinks:p,isOpen:f,onClear:d,className:h,children:S,...u}){const{t:_}=e.useContext(c.I18nContext);function T(){d&&d()}return e.createElement("div",{className:c.cl(fe({open:f})),...u},e.createElement(r.SpsForm,{onSubmit:s,formArray:t,formGroup:a,formMeta:n},e.createElement("div",{className:ve},S),e.createElement("div",{className:be},p&&e.createElement("div",{id:"footer_links"},c.contentOf(p)),e.createElement("div",{className:Be},e.createElement(B.Button,{kind:"default",type:"button",className:H.sprinkles({mr:"sm"}),onClick:T,disabled:i},_("design-system:advancedSearch.clear",{defaultValue:"Clear Fields"})),e.createElement(B.Button,{kind:"key",type:"submit",disabled:i},_("design-system: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"}}});const _e={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`
|
|
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 ge(){const[t,a]=e.useState(!1);function
|
|
219
|
+
`}}}}};function ge(){const[t,a]=e.useState(!1);function n(){a(!1)}function s(){a(!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(r.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(r.SpsTable,null,e.createElement(r.SpsTableHead,null,e.createElement(r.SpsTableHeader,{style:{width:"80px"}},"Order"),e.createElement(r.SpsTableHeader,null,"Section"),e.createElement(r.SpsTableHeader,null,"Notes")),e.createElement(r.SpsTableBody,null,e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"1")),e.createElement(r.SpsTableCell,null,"Checkbox"),e.createElement(r.SpsTableCell,null,"For Content Rows and Content Tiles only.")),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"2")),e.createElement(r.SpsTableCell,null,"Search/Filter Box"),e.createElement(r.SpsTableCell,null)),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"3")),e.createElement(r.SpsTableCell,null,"Saved Search"),e.createElement(r.SpsTableCell,null)),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"4")),e.createElement(r.SpsTableCell,null,"Advanced Search"),e.createElement(r.SpsTableCell,null,"For more information, visit the Advanced Search page.")),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"5")),e.createElement(r.SpsTableCell,null,"Column Editor"),e.createElement(r.SpsTableCell,{wrap:500},"Use for Tables only. For more information, visit the Column Editor page.")),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"6")),e.createElement(r.SpsTableCell,null,"List View Selector"),e.createElement(r.SpsTableCell,null)),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"7")),e.createElement(r.SpsTableCell,null,"Sorting"),e.createElement(r.SpsTableCell,null)),e.createElement(r.SpsTableRow,null,e.createElement(r.SpsTableCell,null,e.createElement("span",{className:"sps-tag sps-tag--info"},"8")),e.createElement(r.SpsTableCell,null,"Buttons"),e.createElement(r.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 Te={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:[F,y,C,M],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(ge,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() {
|
|
@@ -883,7 +883,7 @@
|
|
|
883
883
|
</ListBar>
|
|
884
884
|
)
|
|
885
885
|
}
|
|
886
|
-
`}}}}},Ee={components:[
|
|
886
|
+
`}}}}},Ee={components:[w],examples:{basic:{label:"Basic",description:({NavigateTo:t})=>e.createElement(e.Fragment,null,e.createElement("p",null,"The SearchResultsBar should be used with List Bar and Advanced Search."),e.createElement("p",null,"For more examples go to the Advanced Search section on the"," ",e.createElement(t,{to:"list-bar"},"List Bar")," page.")),examples:{basic:{react:o.code`
|
|
887
887
|
import { ListBar, ListBarSearch, SearchResultsBar, AdvancedSearch } from "@sps-woodland/list-bar";
|
|
888
888
|
import { Button } from "@sps-woodland/buttons";
|
|
889
889
|
import { SpsTextInput } from "@spscommerce/ds-react";
|
|
@@ -1083,4 +1083,4 @@
|
|
|
1083
1083
|
</>
|
|
1084
1084
|
)
|
|
1085
1085
|
}
|
|
1086
|
-
`}}}}},Le={"Advanced Search":_e,"List Bar":Te,"Search Results Bar":Ee};l.AdvancedSearch=
|
|
1086
|
+
`}}}}},Le={"Advanced Search":_e,"List Bar":Te,"Search Results Bar":Ee};l.AdvancedSearch=I,l.InputGroupWrapper=D,l.ListBar=F,l.ListBarSearch=y,l.ListBarSearchInfo=C,l.ListBarSortBy=M,l.MANIFEST=Le,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_31_0__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_31_0__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_31_0__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_31_0__hash_9h4p704{display:flex;flex-wrap:wrap;padding:.5rem}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__hash_9h4p706{align-items:center;display:inline-flex;flex:1 0 auto;height:2rem;vertical-align:middle}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p707{padding-top:.25rem;padding-right:0;padding-bottom:.25rem;padding-left:0;white-space:nowrap}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p708{display:inline-block;position:relative}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p709{margin-left:.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__hash_9h4p70b{display:inline-block;height:2rem;margin-left:.5rem;text-align:right;vertical-align:middle;white-space:nowrap}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70c{flex:1;margin-right:.25rem;max-width:25rem}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__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_31_0__hash_9h4p70f>.sps-button{margin:0!important;background:transparent;border-color:transparent;color:#4b5356}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70f>.sps-button>button{padding:.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70e>button{height:1.875rem}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70a>i{font-size:.875rem;margin-right:.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70d>.sps-input-group>.sps-autocomplete{flex:1}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70d>.sps-input-group>.sps-multi-select{flex:1}.pkg_sps-woodland_list-bar__version_8_31_0__hash_9h4p70d>.sps-input-group>.sps-select{min-width:30%}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__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_31_0__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_31_0__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_31_0__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_31_0__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_31_0__hash_9h4p70d svg{margin-bottom:0}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__hash_9h4p701>.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc0>.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__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_31_0__hash_1gxdcgc3{margin-left:.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc4{flex:1 1 100%;padding:.5rem;display:flex;align-items:center;flex-wrap:wrap}.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc5{margin-top:0;margin-bottom:0;margin-right:.25rem;margin-left:.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc5:first-child{margin-left:0}.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc6{margin-top:.125rem;margin-bottom:.125rem;margin-right:.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc6:last-child{margin-right:0}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__hash_1gxdcgc7:hover{background:#d2d4d4}.pkg_sps-woodland_list-bar__version_8_31_0__hash_1gxdcgc8{padding:.5rem;width:5.25rem}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__hash_q4fj411{display:block}.pkg_sps-woodland_list-bar__version_8_31_0__hash_q4fj413{padding:1rem}.pkg_sps-woodland_list-bar__version_8_31_0__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_31_0__hash_q4fj415{text-align:right}.pkg_sps-woodland_list-bar__version_8_31_0__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.
|
|
4
|
+
"version": "8.31.0",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/list-bar",
|
|
@@ -29,12 +29,12 @@
|
|
|
29
29
|
"@spscommerce/utils": "^7.0.0",
|
|
30
30
|
"react": "^16.9.0",
|
|
31
31
|
"react-dom": "^16.9.0",
|
|
32
|
-
"@sps-woodland/buttons": "8.
|
|
33
|
-
"@sps-woodland/core": "8.
|
|
34
|
-
"@sps-woodland/tabs": "8.
|
|
35
|
-
"@sps-woodland/tags": "8.
|
|
36
|
-
"@sps-woodland/tokens": "8.
|
|
37
|
-
"@spscommerce/ds-react": "8.
|
|
32
|
+
"@sps-woodland/buttons": "8.31.0",
|
|
33
|
+
"@sps-woodland/core": "8.31.0",
|
|
34
|
+
"@sps-woodland/tabs": "8.31.0",
|
|
35
|
+
"@sps-woodland/tags": "8.31.0",
|
|
36
|
+
"@sps-woodland/tokens": "8.31.0",
|
|
37
|
+
"@spscommerce/ds-react": "8.31.0"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
40
|
"@react-stately/collections": "^3.3.3",
|
|
@@ -43,13 +43,13 @@
|
|
|
43
43
|
"@vanilla-extract/recipes": "^0.2.5",
|
|
44
44
|
"react": "^16.9.0",
|
|
45
45
|
"react-dom": "^16.9.0",
|
|
46
|
-
"@sps-woodland/buttons": "8.
|
|
47
|
-
"@sps-woodland/core": "8.
|
|
48
|
-
"@sps-woodland/tabs": "8.
|
|
49
|
-
"@sps-woodland/tags": "8.
|
|
50
|
-
"@sps-woodland/tokens": "8.
|
|
51
|
-
"@spscommerce/ds-react": "8.
|
|
52
|
-
"@spscommerce/ds-shared": "8.
|
|
46
|
+
"@sps-woodland/buttons": "8.31.0",
|
|
47
|
+
"@sps-woodland/core": "8.31.0",
|
|
48
|
+
"@sps-woodland/tabs": "8.31.0",
|
|
49
|
+
"@sps-woodland/tags": "8.31.0",
|
|
50
|
+
"@sps-woodland/tokens": "8.31.0",
|
|
51
|
+
"@spscommerce/ds-react": "8.31.0",
|
|
52
|
+
"@spscommerce/ds-shared": "8.31.0"
|
|
53
53
|
},
|
|
54
54
|
"scripts": {
|
|
55
55
|
"build": "pnpm run build:js && pnpm run build:types",
|