@sps-woodland/content-row 8.7.4 → 8.7.6
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.cjs.js +1 -1
- package/lib/index.es.js +15 -12
- package/lib/style.css +1 -1
- package/package.json +11 -11
- /package/{vite.config.js → vite.config.mjs} +0 -0
package/lib/index.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const D=require("react"),a=require("@sps-woodland/core"),T=require("@spscommerce/ds-react"),i=require("@spscommerce/utils");function q(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const n=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,n.get?n:{enumerable:!0,get:()=>e[o]})}}return t.default=e,Object.freeze(t)}const s=q(D);function G(e,t,o){return t in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function P(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable})),o.push.apply(o,n)}return o}function M(e){for(var t=1;t<arguments.length;t++){var o=arguments[t]!=null?arguments[t]:{};t%2?P(Object(o),!0).forEach(function(n){G(e,n,o[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):P(Object(o)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(o,n))})}return e}var K=(e,t,o)=>{for(var n of Object.keys(e)){var r;if(e[n]!==((r=t[n])!==null&&r!==void 0?r:o[n]))return!1}return!0},b=e=>t=>{var o=e.defaultClassName,n=M(M({},e.defaultVariants),t);for(var r in n){var d,c=(d=n[r])!==null&&d!==void 0?d:e.defaultVariants[r];if(c!=null){var l=c;typeof l=="boolean"&&(l=l===!0?"true":"false");var m=e.variantClassNames[r][l];m&&(o+=" "+m)}}for(var[C,f]of e.compoundVariants)K(C,n,e.defaultVariants)&&(o+=" "+f);return o},W=b({defaultClassName:"_1mxrufv0",variantClassNames:{lean:{true:"_1mxrufv1",false:"_1mxrufv2"},borderless:{true:"_1mxrufv3",false:"_1mxrufv4"}},defaultVariants:{lean:!1,borderless:!1},compoundVariants:[]});function p({children:e,className:t,borderless:o,lean:n,widthPx:r,widthRem:d,style:c,...l}){const m=r?r/16:d,C=m?{...c,width:`${m}rem`}:c;return s.createElement("div",{className:a.cl(W({lean:n,borderless:o}),t),...l,style:C},e)}a.Metadata.set(p,{name:"Content Row Col",props:{borderless:{type:"boolean"},lean:{type:"boolean"},widthPx:{type:"number"},widthRem:{type:"number"}}});var B=b({defaultClassName:"_11ztjee1",variantClassNames:{expanded:{true:"_11ztjee2",false:"_11ztjee3"}},defaultVariants:{expanded:!1},compoundVariants:[]}),L=b({defaultClassName:"_11ztjee4",variantClassNames:{expanded:{true:"_11ztjee5",false:"_11ztjee6"},selected:{true:"_11ztjee7",false:"_11ztjee8"},cardSpacing:{true:"_11ztjee9",false:"_11ztjeea"}},defaultVariants:{expanded:!1,selected:!1,cardSpacing:!1},compoundVariants:[[{expanded:!0,cardSpacing:!0},"_11ztjeeb"]]}),J="_11ztjeeg",Q="_11ztjeec",U=b({defaultClassName:"_11ztjeed",variantClassNames:{disabled:{true:"_11ztjeee",false:"_11ztjeef"}},defaultVariants:{},compoundVariants:[]}),V="_11ztjeeh";function R({children:e,className:t,...o}){return s.createElement("div",{className:a.cl(J,t),...o},e)}a.Metadata.set(R,{name:"Content Row Expansion"});function x({children:e,className:t,alternateLayout:o=!1,initiallyExpanded:n=!1,cardSpacing:r=!1,expanded:d,onBeforeCollapsed:c,onBeforeExpanded:l,onSelectionChange:m,onCollapsed:C,onExpanded:f,selectable:g=!1,selected:h,renderExpandedContent:w=!0,disableSelection:I=!1,disableExpansion:S=!1,...j}){const[z,[y]]=a.selectChildren(e,[{type:p},{type:R}]),{t:F}=s.useContext(a.I18nContext),[O,E]=s.useState(w||n),[_,k]=s.useState(n),u=typeof d=="boolean"?d:_;function H(A){A.stopPropagation(),u&&(!c||c())?(k(!1),w||E(!1),C&&C()):!u&&(!l||l())&&(k(!0),w||E(!0),f&&f())}const N=()=>s.createElement(T.SpsCheckbox,{disabled:I,checked:h,onChange:m}),v=s.createElement("button",{type:"button",className:a.cl(Q),onClick:H,"aria-label":F(`design-system:contentRow.${u?"collapse":"expand"}`),disabled:S},s.createElement(a.Icon,{className:a.cl(U({disabled:S})),icon:u?"minus-circle":"plus-circle"}));return s.createElement("div",{className:a.cl(B({expanded:u}),t),...j},s.createElement("div",{className:a.cl(L({expanded:u,selected:h,cardSpacing:r}))},g&&!o&&s.createElement(p,{widthPx:46},s.createElement(N,null)),y&&!o&&s.createElement(p,{widthPx:44},v),y&&g&&o&&s.createElement(p,{widthPx:46},s.createElement("section",{className:V},s.createElement(N,null)),s.createElement("section",{className:V},v)),z),O&&y)}a.Metadata.set(x,{name:"Content Row",props:{alternateLayout:{type:"boolean",default:"false"},initiallyExpanded:{type:"boolean",default:"false"},cardSpacing:{type:"boolean",default:"false"},expanded:{type:"boolean"},onBeforeCollapsed:{type:"() => boolean"},onBeforeExpanded:{type:"() => boolean"},onSelectionChange:{type:"ChangeEventHandler"},onCollapsed:{type:"() => void"},onExpanded:{type:"() => void"},selectable:{type:"boolean",default:"false"},selected:{type:"boolean"},renderExpandedContent:{type:"boolean",default:"true"},disableSelection:{type:"boolean",default:"false"},disableExpansion:{type:"boolean",default:"false"}}});const X={components:[x,p,R],examples:{basic:{label:"Content Rows",examples:{basic:{react:i.code`
|
|
2
2
|
import { ContentRow, ContentRowCol } from "@sps-woodland/content-row";
|
|
3
3
|
import { Icon } from "@sps-woodland/core";
|
|
4
4
|
import { sprinkles } from "@sps-woodland/tokens";
|
package/lib/index.es.js
CHANGED
|
@@ -38,21 +38,24 @@ var L = (e, n, o) => {
|
|
|
38
38
|
return !1;
|
|
39
39
|
}
|
|
40
40
|
return !0;
|
|
41
|
-
},
|
|
41
|
+
}, b = (e) => (n) => {
|
|
42
42
|
var o = e.defaultClassName, t = V(V({}, e.defaultVariants), n);
|
|
43
43
|
for (var r in t) {
|
|
44
44
|
var i, d = (i = t[r]) !== null && i !== void 0 ? i : e.defaultVariants[r];
|
|
45
45
|
if (d != null) {
|
|
46
46
|
var a = d;
|
|
47
47
|
typeof a == "boolean" && (a = a === !0 ? "true" : "false");
|
|
48
|
-
var c =
|
|
48
|
+
var c = (
|
|
49
|
+
// @ts-expect-error
|
|
50
|
+
e.variantClassNames[r][a]
|
|
51
|
+
);
|
|
49
52
|
c && (o += " " + c);
|
|
50
53
|
}
|
|
51
54
|
}
|
|
52
55
|
for (var [m, w] of e.compoundVariants)
|
|
53
56
|
L(m, t, e.defaultVariants) && (o += " " + w);
|
|
54
57
|
return o;
|
|
55
|
-
}, J =
|
|
58
|
+
}, J = b({ defaultClassName: "_1mxrufv0", variantClassNames: { lean: { true: "_1mxrufv1", false: "_1mxrufv2" }, borderless: { true: "_1mxrufv3", false: "_1mxrufv4" } }, defaultVariants: { lean: !1, borderless: !1 }, compoundVariants: [] });
|
|
56
59
|
function u({
|
|
57
60
|
children: e,
|
|
58
61
|
className: n,
|
|
@@ -86,7 +89,7 @@ x.set(u, {
|
|
|
86
89
|
widthRem: { type: "number" }
|
|
87
90
|
}
|
|
88
91
|
});
|
|
89
|
-
var q =
|
|
92
|
+
var q = b({ defaultClassName: "_11ztjee1", variantClassNames: { expanded: { true: "_11ztjee2", false: "_11ztjee3" } }, defaultVariants: { expanded: !1 }, compoundVariants: [] }), Q = b({ defaultClassName: "_11ztjee4", variantClassNames: { expanded: { true: "_11ztjee5", false: "_11ztjee6" }, selected: { true: "_11ztjee7", false: "_11ztjee8" }, cardSpacing: { true: "_11ztjee9", false: "_11ztjeea" } }, defaultVariants: { expanded: !1, selected: !1, cardSpacing: !1 }, compoundVariants: [[{ expanded: !0, cardSpacing: !0 }, "_11ztjeeb"]] }), U = "_11ztjeeg", X = "_11ztjeec", Y = b({ defaultClassName: "_11ztjeed", variantClassNames: { disabled: { true: "_11ztjeee", false: "_11ztjeef" } }, defaultVariants: {}, compoundVariants: [] }), M = "_11ztjeeh";
|
|
90
93
|
function y({
|
|
91
94
|
children: e,
|
|
92
95
|
className: n,
|
|
@@ -116,22 +119,22 @@ function I({
|
|
|
116
119
|
disableExpansion: S = !1,
|
|
117
120
|
...j
|
|
118
121
|
}) {
|
|
119
|
-
const [F, [
|
|
122
|
+
const [F, [R]] = T(e, [
|
|
120
123
|
{ type: u },
|
|
121
124
|
{ type: y }
|
|
122
|
-
]), { t:
|
|
125
|
+
]), { t: H } = s.useContext(G), [_, k] = s.useState(
|
|
123
126
|
f || t
|
|
124
127
|
), [O, E] = s.useState(t), p = typeof i == "boolean" ? i : O;
|
|
125
128
|
function A(D) {
|
|
126
129
|
D.stopPropagation(), p && (!d || d()) ? (E(!1), f || k(!1), m && m()) : !p && (!a || a()) && (E(!0), f || k(!0), w && w());
|
|
127
130
|
}
|
|
128
|
-
const
|
|
131
|
+
const N = () => /* @__PURE__ */ s.createElement(W, { disabled: z, checked: g, onChange: c }), v = /* @__PURE__ */ s.createElement(
|
|
129
132
|
"button",
|
|
130
133
|
{
|
|
131
134
|
type: "button",
|
|
132
135
|
className: C(X),
|
|
133
136
|
onClick: A,
|
|
134
|
-
"aria-label":
|
|
137
|
+
"aria-label": H(`design-system:contentRow.${p ? "collapse" : "expand"}`),
|
|
135
138
|
disabled: S
|
|
136
139
|
},
|
|
137
140
|
/* @__PURE__ */ s.createElement(
|
|
@@ -153,11 +156,11 @@ function I({
|
|
|
153
156
|
})
|
|
154
157
|
)
|
|
155
158
|
},
|
|
156
|
-
h && !o && /* @__PURE__ */ s.createElement(u, { widthPx: 46 }, /* @__PURE__ */ s.createElement(
|
|
157
|
-
|
|
158
|
-
|
|
159
|
+
h && !o && /* @__PURE__ */ s.createElement(u, { widthPx: 46 }, /* @__PURE__ */ s.createElement(N, null)),
|
|
160
|
+
R && !o && /* @__PURE__ */ s.createElement(u, { widthPx: 44 }, v),
|
|
161
|
+
R && h && o && /* @__PURE__ */ s.createElement(u, { widthPx: 46 }, /* @__PURE__ */ s.createElement("section", { className: M }, /* @__PURE__ */ s.createElement(N, null)), /* @__PURE__ */ s.createElement("section", { className: M }, v)),
|
|
159
162
|
F
|
|
160
|
-
),
|
|
163
|
+
), _ && R);
|
|
161
164
|
}
|
|
162
165
|
x.set(I, {
|
|
163
166
|
name: "Content Row",
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._1mxrufv0{display:table-cell;padding:1rem;vertical-align:middle}._1mxrufv1{padding:.5rem 1rem}._1mxrufv4:not(:first-child){border-left:.0625rem solid oklch(86.84% .002 197.12)}._1mxrufv0>*{vertical-align:middle}._11ztjee1{background
|
|
1
|
+
._1mxrufv0{display:table-cell;padding:1rem;vertical-align:middle}._1mxrufv1{padding:.5rem 1rem}._1mxrufv4:not(:first-child){border-left:.0625rem solid oklch(86.84% .002 197.12)}._1mxrufv0>*{vertical-align:middle}._11ztjee1{background:#fff;display:block}._11ztjee2{--_11ztjee0: block}._11ztjee3{--_11ztjee0: none}._11ztjee4{border-width:.0625rem;border-style:solid;border-color:#d2d4d4;border-radius:.25rem;display:table;table-layout:fixed;width:100.06%}._11ztjee5{border-top-left-radius:.25rem;border-top-right-radius:.25rem;border-bottom-right-radius:0;border-bottom-left-radius:0}._11ztjee7{background:#e6f2f8;border-color:#027db8}._11ztjee9{border-radius:.25rem;margin-top:1rem}._11ztjeeb{border-top-left-radius:.25rem;border-top-right-radius:.25rem;border-bottom-right-radius:0;border-bottom-left-radius:0}._11ztjeec{background:none;border:0;padding:0}._11ztjeed{cursor:pointer;font-size:1rem;line-height:1.125rem;padding:0;vertical-align:middle}._11ztjeee{color:#d2d4d4;cursor:not-allowed}._11ztjeef{color:#027db8}._11ztjeef:hover{color:#08638d}._11ztjeeg{background:#f3f4f4;border-color:#d2d4d4;border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem;border-style:solid;border-top-width:0;border-right-width:.0625rem;border-bottom-width:.0625rem;border-left-width:.0625rem;display:var(--_11ztjee0);padding:1rem}._11ztjeeh{padding:1rem}._11ztjeeh:first-child{margin:-1rem -1rem 0}._11ztjeeh:last-child{border-top-width:.0625rem;border-right-width:0;border-bottom-width:0;border-left-width:0;border-style:solid;border-top-color:#d2d4d4;margin:0 -1rem -1rem}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sps-woodland/content-row",
|
|
3
3
|
"description": "SPS Woodland Design System page title component",
|
|
4
|
-
"version": "8.7.
|
|
4
|
+
"version": "8.7.6",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/page-title",
|
|
@@ -30,11 +30,11 @@
|
|
|
30
30
|
"@spscommerce/utils": "^6.12.1",
|
|
31
31
|
"react": "^16.14.0",
|
|
32
32
|
"react-dom": "^16.14.0",
|
|
33
|
-
"@sps-woodland/core": "8.7.
|
|
34
|
-
"@sps-woodland/tokens": "8.7.
|
|
35
|
-
"@spscommerce/ds-colors": "8.7.
|
|
36
|
-
"@spscommerce/ds-react": "8.7.
|
|
37
|
-
"@spscommerce/ds-shared": "8.7.
|
|
33
|
+
"@sps-woodland/core": "8.7.6",
|
|
34
|
+
"@sps-woodland/tokens": "8.7.6",
|
|
35
|
+
"@spscommerce/ds-colors": "8.7.6",
|
|
36
|
+
"@spscommerce/ds-react": "8.7.6",
|
|
37
|
+
"@spscommerce/ds-shared": "8.7.6"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
40
|
"@spscommerce/ds-illustrations": "^6.12.1",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"@vanilla-extract/recipes": "^0.2.5",
|
|
44
44
|
"react": "^16.14.0",
|
|
45
45
|
"react-dom": "^16.14.0",
|
|
46
|
-
"@sps-woodland/core": "8.7.
|
|
47
|
-
"@sps-woodland/tokens": "8.7.
|
|
48
|
-
"@spscommerce/ds-colors": "8.7.
|
|
49
|
-
"@spscommerce/ds-react": "8.7.
|
|
50
|
-
"@spscommerce/ds-shared": "8.7.
|
|
46
|
+
"@sps-woodland/core": "8.7.6",
|
|
47
|
+
"@sps-woodland/tokens": "8.7.6",
|
|
48
|
+
"@spscommerce/ds-colors": "8.7.6",
|
|
49
|
+
"@spscommerce/ds-react": "8.7.6",
|
|
50
|
+
"@spscommerce/ds-shared": "8.7.6"
|
|
51
51
|
},
|
|
52
52
|
"scripts": {
|
|
53
53
|
"build": "pnpm run build:js && pnpm run build:types",
|
|
File without changes
|