@sps-woodland/zero-state 8.50.1 → 8.51.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.d.ts +1 -1
- package/lib/index.js +21 -100
- package/lib/index.umd.cjs +9 -9
- package/lib/style.css +1 -1
- package/package.json +8 -10
- package/vite.config.mjs +6 -13
- package/lib/ZeroState.css.d.ts +0 -40
- package/lib/ZeroState.d.ts +0 -11
package/lib/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export * from "
|
|
1
|
+
export * from "@sps-woodland/core/zero-state";
|
|
2
2
|
export * from "./manifest";
|
package/lib/index.js
CHANGED
|
@@ -1,101 +1,23 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
import { code as
|
|
5
|
-
import { sprinkles as
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
enumerable: !0,
|
|
10
|
-
configurable: !0,
|
|
11
|
-
writable: !0
|
|
12
|
-
}) : e[a] = o, e;
|
|
13
|
-
}
|
|
14
|
-
function f(e, a) {
|
|
15
|
-
var o = Object.keys(e);
|
|
16
|
-
if (Object.getOwnPropertySymbols) {
|
|
17
|
-
var t = Object.getOwnPropertySymbols(e);
|
|
18
|
-
a && (t = t.filter(function(n) {
|
|
19
|
-
return Object.getOwnPropertyDescriptor(e, n).enumerable;
|
|
20
|
-
})), o.push.apply(o, t);
|
|
21
|
-
}
|
|
22
|
-
return o;
|
|
23
|
-
}
|
|
24
|
-
function S(e) {
|
|
25
|
-
for (var a = 1; a < arguments.length; a++) {
|
|
26
|
-
var o = arguments[a] != null ? arguments[a] : {};
|
|
27
|
-
a % 2 ? f(Object(o), !0).forEach(function(t) {
|
|
28
|
-
v(e, t, o[t]);
|
|
29
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(o)) : f(Object(o)).forEach(function(t) {
|
|
30
|
-
Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(o, t));
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
return e;
|
|
34
|
-
}
|
|
35
|
-
var b = (e, a, o) => {
|
|
36
|
-
for (var t of Object.keys(e)) {
|
|
37
|
-
var n;
|
|
38
|
-
if (e[t] !== ((n = a[t]) !== null && n !== void 0 ? n : o[t]))
|
|
39
|
-
return !1;
|
|
40
|
-
}
|
|
41
|
-
return !0;
|
|
42
|
-
}, _ = (e) => (a) => {
|
|
43
|
-
var o = e.defaultClassName, t = S(S({}, e.defaultVariants), a);
|
|
44
|
-
for (var n in t) {
|
|
45
|
-
var l, d = (l = t[n]) !== null && l !== void 0 ? l : e.defaultVariants[n];
|
|
46
|
-
if (d != null) {
|
|
47
|
-
var i = d;
|
|
48
|
-
typeof i == "boolean" && (i = i === !0 ? "true" : "false");
|
|
49
|
-
var p = (
|
|
50
|
-
// @ts-expect-error
|
|
51
|
-
e.variantClassNames[n][i]
|
|
52
|
-
);
|
|
53
|
-
p && (o += " " + p);
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
for (var [m, g] of e.compoundVariants)
|
|
57
|
-
b(m, t, e.defaultVariants) && (o += " " + g);
|
|
58
|
-
return o;
|
|
59
|
-
}, R = _({ defaultClassName: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl0", variantClassNames: { micro: { true: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl1", false: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl2" } }, defaultVariants: {}, compoundVariants: [] }), y = _({ defaultClassName: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl3", variantClassNames: { micro: { true: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl4", false: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl5" } }, defaultVariants: { micro: !1 }, compoundVariants: [] }), L = "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl6", N = _({ defaultClassName: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl7", variantClassNames: { micro: { true: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl8", false: "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnl9" } }, defaultVariants: { micro: !1 }, compoundVariants: [] }), H = "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnla", Z = "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnlb", z = "pkg_sps-woodland_zero-state__version_8_50_1__hash_jrytnlc";
|
|
60
|
-
function h({
|
|
61
|
-
artwork: e,
|
|
62
|
-
heading: a,
|
|
63
|
-
illustration: o,
|
|
64
|
-
subHeading: t,
|
|
65
|
-
micro: n = !1,
|
|
66
|
-
children: l,
|
|
67
|
-
className: d,
|
|
68
|
-
icon: i,
|
|
69
|
-
...p
|
|
70
|
-
}) {
|
|
71
|
-
const m = o || e || C;
|
|
72
|
-
return /* @__PURE__ */ r.createElement("div", { className: R({ micro: n }) }, /* @__PURE__ */ r.createElement("div", { className: w(y({ micro: n }), d), ...p }, n ? /* @__PURE__ */ r.createElement(r.Fragment, null, i ? /* @__PURE__ */ r.createElement(A, { className: z, icon: i, "aria-hidden": "true" }) : /* @__PURE__ */ r.createElement("img", { style: { height: "3rem" }, src: m })) : /* @__PURE__ */ r.createElement("img", { className: L, src: m, alt: "" }), a && (typeof a == "string" ? /* @__PURE__ */ r.createElement("h1", { className: N({ micro: n }) }, a) : c(a)), t && (typeof t == "string" ? /* @__PURE__ */ r.createElement("h2", { className: H }, t) : c(t)), /* @__PURE__ */ r.createElement("div", { className: Z }, l)));
|
|
73
|
-
}
|
|
74
|
-
E.set(h, {
|
|
75
|
-
name: "ZeroState",
|
|
76
|
-
props: {
|
|
77
|
-
artwork: { type: "string" },
|
|
78
|
-
heading: { type: "string | ReactNodeOrRenderFn" },
|
|
79
|
-
illustration: { type: "string" },
|
|
80
|
-
subHeading: { type: "string | ReactNodeOrRenderFn" },
|
|
81
|
-
micro: { type: "boolean", default: "false" }
|
|
82
|
-
}
|
|
83
|
-
});
|
|
84
|
-
const G = {
|
|
85
|
-
description: () => /* @__PURE__ */ r.createElement("p", null, "Zero States are placeholders in content areas when there is no content to show. You can view all available illustrations on the Illustrations page."),
|
|
86
|
-
components: [h],
|
|
1
|
+
import { ZeroState as o } from "@sps-woodland/core/zero-state";
|
|
2
|
+
export * from "@sps-woodland/core/zero-state";
|
|
3
|
+
import * as t from "react";
|
|
4
|
+
import { code as e } from "@spscommerce/utils";
|
|
5
|
+
import { sprinkles as a } from "@sps-woodland/tokens";
|
|
6
|
+
const n = {
|
|
7
|
+
description: () => /* @__PURE__ */ t.createElement("p", null, "Zero States are placeholders in content areas when there is no content to show. You can view all available illustrations on the Illustrations page."),
|
|
8
|
+
components: [o],
|
|
87
9
|
examples: {
|
|
88
10
|
general: {
|
|
89
11
|
label: "Sizes",
|
|
90
|
-
description: () => /* @__PURE__ */
|
|
12
|
+
description: () => /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement("h5", { className: a({ mb: "md" }) }, "There are 2 sizes of Zero States: Large and Small. They differ in appearance and are used in different cases."), /* @__PURE__ */ t.createElement("h4", null, "Large Zero States"), /* @__PURE__ */ t.createElement("h5", { className: a({ mb: "md" }) }, "Use Large Zero States in primary or large areas of a page."), /* @__PURE__ */ t.createElement("h4", null, "Small Zero States"), /* @__PURE__ */ t.createElement("h5", null, "Use Small Zero States in secondary or small areas of a page."))
|
|
91
13
|
},
|
|
92
14
|
regular: {
|
|
93
15
|
label: "Usage: Large Zero States",
|
|
94
|
-
description: ({ NavigateTo:
|
|
16
|
+
description: ({ NavigateTo: r }) => /* @__PURE__ */ t.createElement("p", null, "Large Zero States may be accompanied by other components such as Headings, Subtitles,", " ", /* @__PURE__ */ t.createElement(r, { to: "Button" }, "Buttons"), ",", " ", /* @__PURE__ */ t.createElement(r, { to: "List Toolbar" }, "Search Bars"), ", or a combination of these"),
|
|
95
17
|
examples: {
|
|
96
18
|
illustrationAndHeading: {
|
|
97
19
|
description: "Illustration + Heading",
|
|
98
|
-
react:
|
|
20
|
+
react: e`
|
|
99
21
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
100
22
|
import { Card } from "@sps-woodland/cards";
|
|
101
23
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -114,7 +36,7 @@ const G = {
|
|
|
114
36
|
},
|
|
115
37
|
illustrationHeadingAndSubtitle: {
|
|
116
38
|
description: "Illustration + Heading + Subtitle",
|
|
117
|
-
react:
|
|
39
|
+
react: e`
|
|
118
40
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
119
41
|
import { Card } from "@sps-woodland/cards";
|
|
120
42
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -134,7 +56,7 @@ const G = {
|
|
|
134
56
|
},
|
|
135
57
|
illustrationHeadingAndButton: {
|
|
136
58
|
description: "Illustration + Heading + Button",
|
|
137
|
-
react:
|
|
59
|
+
react: e`
|
|
138
60
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
139
61
|
import { Card } from "@sps-woodland/cards";
|
|
140
62
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -158,7 +80,7 @@ const G = {
|
|
|
158
80
|
},
|
|
159
81
|
illustrationHeadingSubtitleAndButton: {
|
|
160
82
|
description: "Illustration + Heading + Subtitle + Button",
|
|
161
|
-
react:
|
|
83
|
+
react: e`
|
|
162
84
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
163
85
|
import { Card } from "@sps-woodland/cards";
|
|
164
86
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -183,7 +105,7 @@ const G = {
|
|
|
183
105
|
},
|
|
184
106
|
illustrationHeadingSubtitleAndSearch: {
|
|
185
107
|
description: "Illustration + Heading + Subtitle + Search",
|
|
186
|
-
react:
|
|
108
|
+
react: e`
|
|
187
109
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
188
110
|
import { Card } from "@sps-woodland/cards";
|
|
189
111
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -226,7 +148,7 @@ const G = {
|
|
|
226
148
|
examples: {
|
|
227
149
|
illustrationAndHeading: {
|
|
228
150
|
description: "Illustration + Heading",
|
|
229
|
-
react:
|
|
151
|
+
react: e`
|
|
230
152
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
231
153
|
import { Card } from "@sps-woodland/cards";
|
|
232
154
|
import { BAR_CHART_SMALL } from "@sps-woodland/illustrations";
|
|
@@ -250,7 +172,7 @@ const G = {
|
|
|
250
172
|
},
|
|
251
173
|
illustrationAndSubtitle: {
|
|
252
174
|
description: "Illustration + Subtitle",
|
|
253
|
-
react:
|
|
175
|
+
react: e`
|
|
254
176
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
255
177
|
import { Card } from "@sps-woodland/cards";
|
|
256
178
|
import { BAR_CHART_SMALL } from "@sps-woodland/illustrations";
|
|
@@ -274,7 +196,7 @@ const G = {
|
|
|
274
196
|
},
|
|
275
197
|
illustrationHeadingAndSubtitle: {
|
|
276
198
|
description: "Illustration + Heading + Subtitle",
|
|
277
|
-
react:
|
|
199
|
+
react: e`
|
|
278
200
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
279
201
|
import { Card } from "@sps-woodland/cards";
|
|
280
202
|
import { BAR_CHART_SMALL } from "@sps-woodland/illustrations";
|
|
@@ -300,10 +222,9 @@ const G = {
|
|
|
300
222
|
}
|
|
301
223
|
}
|
|
302
224
|
}
|
|
303
|
-
},
|
|
304
|
-
"Zero States":
|
|
225
|
+
}, l = {
|
|
226
|
+
"Zero States": n
|
|
305
227
|
};
|
|
306
228
|
export {
|
|
307
|
-
|
|
308
|
-
h as ZeroState
|
|
229
|
+
l as MANIFEST
|
|
309
230
|
};
|
package/lib/index.umd.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(t,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("@sps-woodland/core/zero-state"),require("react"),require("@spscommerce/utils"),require("@sps-woodland/tokens")):typeof define=="function"&&define.amd?define(["exports","@sps-woodland/core/zero-state","react","@spscommerce/utils","@sps-woodland/tokens"],a):(t=typeof globalThis<"u"?globalThis:t||self,a(t.ZeroState={},t.zeroState,t.React,t.utils,t.tokens))})(this,(function(t,a,l,r,i){"use strict";function c(e){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const d=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(s,n,d.get?d:{enumerable:!0,get:()=>e[n]})}}return s.default=e,Object.freeze(s)}const o=c(l),p={"Zero States":{description:()=>o.createElement("p",null,"Zero States are placeholders in content areas when there is no content to show. You can view all available illustrations on the Illustrations page."),components:[a.ZeroState],examples:{general:{label:"Sizes",description:()=>o.createElement(o.Fragment,null,o.createElement("h5",{className:i.sprinkles({mb:"md"})},"There are 2 sizes of Zero States: Large and Small. They differ in appearance and are used in different cases."),o.createElement("h4",null,"Large Zero States"),o.createElement("h5",{className:i.sprinkles({mb:"md"})},"Use Large Zero States in primary or large areas of a page."),o.createElement("h4",null,"Small Zero States"),o.createElement("h5",null,"Use Small Zero States in secondary or small areas of a page."))},regular:{label:"Usage: Large Zero States",description:({NavigateTo:e})=>o.createElement("p",null,"Large Zero States may be accompanied by other components such as Headings, Subtitles,"," ",o.createElement(e,{to:"Button"},"Buttons"),","," ",o.createElement(e,{to:"List Toolbar"},"Search Bars"),", or a combination of these"),examples:{illustrationAndHeading:{description:"Illustration + Heading",react:r.code`
|
|
2
2
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
3
3
|
import { Card } from "@sps-woodland/cards";
|
|
4
4
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
</Card>
|
|
14
14
|
);
|
|
15
15
|
}
|
|
16
|
-
`},illustrationHeadingAndSubtitle:{description:"Illustration + Heading + Subtitle",react:
|
|
16
|
+
`},illustrationHeadingAndSubtitle:{description:"Illustration + Heading + Subtitle",react:r.code`
|
|
17
17
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
18
18
|
import { Card } from "@sps-woodland/cards";
|
|
19
19
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
</Card>
|
|
30
30
|
);
|
|
31
31
|
}
|
|
32
|
-
`},illustrationHeadingAndButton:{description:"Illustration + Heading + Button",react:
|
|
32
|
+
`},illustrationHeadingAndButton:{description:"Illustration + Heading + Button",react:r.code`
|
|
33
33
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
34
34
|
import { Card } from "@sps-woodland/cards";
|
|
35
35
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
</Card>
|
|
50
50
|
);
|
|
51
51
|
}
|
|
52
|
-
`},illustrationHeadingSubtitleAndButton:{description:"Illustration + Heading + Subtitle + Button",react:
|
|
52
|
+
`},illustrationHeadingSubtitleAndButton:{description:"Illustration + Heading + Subtitle + Button",react:r.code`
|
|
53
53
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
54
54
|
import { Card } from "@sps-woodland/cards";
|
|
55
55
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -70,7 +70,7 @@
|
|
|
70
70
|
</Card>
|
|
71
71
|
);
|
|
72
72
|
}
|
|
73
|
-
`},illustrationHeadingSubtitleAndSearch:{description:"Illustration + Heading + Subtitle + Search",react:
|
|
73
|
+
`},illustrationHeadingSubtitleAndSearch:{description:"Illustration + Heading + Subtitle + Search",react:r.code`
|
|
74
74
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
75
75
|
import { Card } from "@sps-woodland/cards";
|
|
76
76
|
import { GENERAL_SEARCH_LARGE } from "@sps-woodland/illustrations";
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
</Card>
|
|
104
104
|
);
|
|
105
105
|
}
|
|
106
|
-
`}}},micro:{label:"Usage: Small Zero State",description:"Small Zero States may be accompanied by Headings, Subtitles, or both.",examples:{illustrationAndHeading:{description:"Illustration + Heading",react:
|
|
106
|
+
`}}},micro:{label:"Usage: Small Zero State",description:"Small Zero States may be accompanied by Headings, Subtitles, or both.",examples:{illustrationAndHeading:{description:"Illustration + Heading",react:r.code`
|
|
107
107
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
108
108
|
import { Card } from "@sps-woodland/cards";
|
|
109
109
|
import { BAR_CHART_SMALL } from "@sps-woodland/illustrations";
|
|
@@ -123,7 +123,7 @@
|
|
|
123
123
|
</div>
|
|
124
124
|
);
|
|
125
125
|
}
|
|
126
|
-
`},illustrationAndSubtitle:{description:"Illustration + Subtitle",react:
|
|
126
|
+
`},illustrationAndSubtitle:{description:"Illustration + Subtitle",react:r.code`
|
|
127
127
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
128
128
|
import { Card } from "@sps-woodland/cards";
|
|
129
129
|
import { BAR_CHART_SMALL } from "@sps-woodland/illustrations";
|
|
@@ -143,7 +143,7 @@
|
|
|
143
143
|
</div>
|
|
144
144
|
);
|
|
145
145
|
}
|
|
146
|
-
`},illustrationHeadingAndSubtitle:{description:"Illustration + Heading + Subtitle",react:
|
|
146
|
+
`},illustrationHeadingAndSubtitle:{description:"Illustration + Heading + Subtitle",react:r.code`
|
|
147
147
|
import { ZeroState } from "@sps-woodland/zero-state";
|
|
148
148
|
import { Card } from "@sps-woodland/cards";
|
|
149
149
|
import { BAR_CHART_SMALL } from "@sps-woodland/illustrations";
|
|
@@ -164,4 +164,4 @@
|
|
|
164
164
|
</div>
|
|
165
165
|
);
|
|
166
166
|
}
|
|
167
|
-
`}}}}}};
|
|
167
|
+
`}}}}}};t.MANIFEST=p,Object.keys(a).forEach(e=>{e!=="default"&&!Object.prototype.hasOwnProperty.call(t,e)&&Object.defineProperty(t,e,{enumerable:!0,get:()=>a[e]})}),Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})}));
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pkg_sps-
|
|
1
|
+
.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu2{padding:1rem}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu3{margin:auto;padding-top:2rem;padding-right:0;padding-bottom:2rem;padding-left:0;text-align:center}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu4{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;width:auto}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu6{height:6.25rem;margin-bottom:1rem;width:12.5rem}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu7{margin-bottom:0}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu8{color:#4b5356;font-size:1rem;font-weight:600;line-height:1.25rem}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu9{color:#1f282c;font-size:1.5rem;line-height:1.5rem}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luua{color:#4b5356;font-size:.875rem;line-height:1.25rem;margin-top:.25rem;margin-bottom:0}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luub{margin-top:1rem}.pkg_sps-woodland_core__version_8_51_0__hash_sa7luuc{color:#717779;font-size:3rem;line-height:3rem;padding-bottom:.25rem}@media screen and (min-width:768px){.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu3{width:75%}}@media screen and (min-width:992px){.pkg_sps-woodland_core__version_8_51_0__hash_sa7luu3{width:50%}}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sps-woodland/zero-state",
|
|
3
3
|
"description": "SPS Woodland Design System zero state component",
|
|
4
|
-
"version": "8.
|
|
4
|
+
"version": "8.51.0",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/zero-state",
|
|
@@ -29,24 +29,22 @@
|
|
|
29
29
|
"@spscommerce/utils": "^7.0.0 || ^8.0.0 || ^9.0.0",
|
|
30
30
|
"react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
31
31
|
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
32
|
-
"@sps-woodland/core": "8.
|
|
33
|
-
"@sps-woodland/
|
|
34
|
-
"@sps-woodland/tokens": "8.50.1"
|
|
32
|
+
"@sps-woodland/core": "8.51.0",
|
|
33
|
+
"@sps-woodland/tokens": "8.51.0"
|
|
35
34
|
},
|
|
36
35
|
"devDependencies": {
|
|
37
36
|
"@spscommerce/utils": "9.0.3",
|
|
38
|
-
"@vanilla-extract/css": "1.17.4",
|
|
39
|
-
"@vanilla-extract/recipes": "0.2.5",
|
|
40
37
|
"react": "16.14.0",
|
|
41
38
|
"react-dom": "16.14.0",
|
|
42
|
-
"@sps-woodland/core": "8.
|
|
43
|
-
"@sps-woodland/illustrations": "8.
|
|
44
|
-
"@sps-woodland/tokens": "8.
|
|
39
|
+
"@sps-woodland/core": "8.51.0",
|
|
40
|
+
"@sps-woodland/illustrations": "8.51.0",
|
|
41
|
+
"@sps-woodland/tokens": "8.51.0"
|
|
45
42
|
},
|
|
46
43
|
"scripts": {
|
|
47
|
-
"build": "pnpm run build:js && pnpm run build:types",
|
|
44
|
+
"build": "pnpm run build:js && pnpm run build:types && pnpm run build:css",
|
|
48
45
|
"build:js": "vite build",
|
|
49
46
|
"build:types": "tsc --emitDeclarationOnly --declaration --declarationDir lib",
|
|
47
|
+
"build:css": "cp ../core/lib/zero-state/style.css lib/style.css 2>/dev/null || echo 'zero-state style.css not found, skipping'",
|
|
50
48
|
"watch": "vite build --watch",
|
|
51
49
|
"clean": "git clean -fdX",
|
|
52
50
|
"pub": "node ../../../scripts/publish-package.mjs"
|
package/vite.config.mjs
CHANGED
|
@@ -1,31 +1,24 @@
|
|
|
1
1
|
import path from "node:path";
|
|
2
|
-
import { vanillaExtractPlugin } from "@vanilla-extract/vite-plugin";
|
|
3
2
|
import { defineConfig } from "vite";
|
|
4
|
-
import { getVanillaExtractPluginProps } from "../../../scripts/vanilla-extract-plugin-props.mjs";
|
|
5
3
|
import pkg from "./package.json";
|
|
6
4
|
|
|
7
|
-
|
|
5
|
+
// Zero-state is now a wrapper package that re-exports from @sps-woodland/core.
|
|
6
|
+
// No vanilla-extract needed - CSS is provided by the core package.
|
|
7
|
+
|
|
8
|
+
const peerDeps = pkg.peerDependencies ? Object.keys(pkg.peerDependencies) : [];
|
|
8
9
|
|
|
9
10
|
export default defineConfig({
|
|
10
|
-
plugins: [
|
|
11
|
-
vanillaExtractPlugin(
|
|
12
|
-
getVanillaExtractPluginProps({
|
|
13
|
-
packageName: pkg.name,
|
|
14
|
-
packageVersion,
|
|
15
|
-
})
|
|
16
|
-
),
|
|
17
|
-
],
|
|
18
11
|
build: {
|
|
19
12
|
lib: {
|
|
20
13
|
entry: path.resolve(__dirname, "src/index.ts"),
|
|
21
14
|
name: "ZeroState",
|
|
22
15
|
fileName: "index",
|
|
23
|
-
cssFileName: "style",
|
|
24
16
|
},
|
|
25
17
|
outDir: path.resolve(__dirname, "./lib"),
|
|
26
18
|
emptyOutDir: false,
|
|
27
19
|
rollupOptions: {
|
|
28
|
-
|
|
20
|
+
// External must match subpath imports like @sps-woodland/core/zero-state
|
|
21
|
+
external: (id) => peerDeps.some((dep) => id === dep || id.startsWith(dep + "/")),
|
|
29
22
|
},
|
|
30
23
|
},
|
|
31
24
|
});
|
package/lib/ZeroState.css.d.ts
DELETED
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
export declare const zeroStateWrapper: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<{
|
|
2
|
-
micro: {
|
|
3
|
-
true: {};
|
|
4
|
-
false: {
|
|
5
|
-
padding: string;
|
|
6
|
-
};
|
|
7
|
-
};
|
|
8
|
-
}>;
|
|
9
|
-
export declare const zeroState: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<{
|
|
10
|
-
micro: {
|
|
11
|
-
true: {
|
|
12
|
-
alignItems: "center";
|
|
13
|
-
display: "flex";
|
|
14
|
-
flexDirection: "column";
|
|
15
|
-
height: "100%";
|
|
16
|
-
justifyContent: "center";
|
|
17
|
-
width: "auto";
|
|
18
|
-
};
|
|
19
|
-
false: {};
|
|
20
|
-
};
|
|
21
|
-
}>;
|
|
22
|
-
export declare const zeroStateImage: string;
|
|
23
|
-
export declare const zeroStateHeading: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<{
|
|
24
|
-
micro: {
|
|
25
|
-
true: {
|
|
26
|
-
color: string;
|
|
27
|
-
fontSize: string;
|
|
28
|
-
fontWeight: number;
|
|
29
|
-
lineHeight: string;
|
|
30
|
-
};
|
|
31
|
-
false: {
|
|
32
|
-
color: string;
|
|
33
|
-
fontSize: string;
|
|
34
|
-
lineHeight: string;
|
|
35
|
-
};
|
|
36
|
-
};
|
|
37
|
-
}>;
|
|
38
|
-
export declare const zeroStateSubheading: string;
|
|
39
|
-
export declare const zeroStateContent: string;
|
|
40
|
-
export declare const microZeroStateIcon: string;
|
package/lib/ZeroState.d.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import type { ComponentProps } from "@sps-woodland/core";
|
|
3
|
-
import type { IconName } from "@sps-woodland/tokens";
|
|
4
|
-
export declare function ZeroState({ artwork, heading, illustration, subHeading, micro, children, className, icon, ...rest }: ComponentProps<{
|
|
5
|
-
artwork?: string;
|
|
6
|
-
heading?: string | React.ReactNode | (() => React.ReactNode);
|
|
7
|
-
illustration?: string;
|
|
8
|
-
subHeading?: string | React.ReactNode | (() => React.ReactNode);
|
|
9
|
-
micro?: boolean;
|
|
10
|
-
icon?: IconName;
|
|
11
|
-
}, HTMLDivElement>): React.ReactElement;
|