@sps-woodland/cards 8.41.0 → 8.41.1
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 +6 -6
- package/lib/index.umd.cjs +1 -1
- package/lib/style.css +1 -1
- package/package.json +8 -8
package/lib/index.js
CHANGED
|
@@ -2,7 +2,7 @@ import { Metadata as d, CapContent as w, cl as _, selectChildren as P, useChildT
|
|
|
2
2
|
import * as e from "react";
|
|
3
3
|
import { useWoodlandLanguage as z } from "@spscommerce/i18n";
|
|
4
4
|
import { code as i } from "@spscommerce/utils";
|
|
5
|
-
var O = "pkg_sps-
|
|
5
|
+
var O = "pkg_sps-woodland_cards__version_8_41_1__hash_1gxcp3j0";
|
|
6
6
|
function C({
|
|
7
7
|
children: t,
|
|
8
8
|
className: s = "",
|
|
@@ -11,7 +11,7 @@ function C({
|
|
|
11
11
|
return /* @__PURE__ */ e.createElement(w, { className: _(O, s), ...a }, t);
|
|
12
12
|
}
|
|
13
13
|
d.set(C, { name: "CardFooter" });
|
|
14
|
-
var H = "pkg_sps-
|
|
14
|
+
var H = "pkg_sps-woodland_cards__version_8_41_1__hash_mxozo50";
|
|
15
15
|
function f({
|
|
16
16
|
children: t,
|
|
17
17
|
className: s = "",
|
|
@@ -20,7 +20,7 @@ function f({
|
|
|
20
20
|
return /* @__PURE__ */ e.createElement(w, { className: _(H, s), ...a }, t);
|
|
21
21
|
}
|
|
22
22
|
d.set(f, { name: "CardHeader" });
|
|
23
|
-
var j = "pkg_sps-
|
|
23
|
+
var j = "pkg_sps-woodland_cards__version_8_41_1__hash_jyyttb0";
|
|
24
24
|
function k({
|
|
25
25
|
children: t,
|
|
26
26
|
className: s,
|
|
@@ -41,7 +41,7 @@ function k({
|
|
|
41
41
|
return /* @__PURE__ */ e.createElement("div", { className: _(j, s), ...a }, n, r ? D(r, { context: "container" }) : /* @__PURE__ */ e.createElement(F, { ...o("body") }, p), c);
|
|
42
42
|
}
|
|
43
43
|
d.set(k, { name: "Card" });
|
|
44
|
-
var W = "pkg_sps-
|
|
44
|
+
var W = "pkg_sps-woodland_cards__version_8_41_1__hash_1f11ubh0";
|
|
45
45
|
function y({
|
|
46
46
|
children: t,
|
|
47
47
|
className: s = "",
|
|
@@ -103,7 +103,7 @@ var R = (t, s, a) => {
|
|
|
103
103
|
for (var [g, h] of t.compoundVariants)
|
|
104
104
|
R(g, n, t.defaultVariants) && (a += " " + h);
|
|
105
105
|
return a;
|
|
106
|
-
}, U = "pkg_sps-
|
|
106
|
+
}, U = "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq0", L = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1", variantClassNames: { kind: { general: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq2", error: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq3", success: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq4", warning: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq5", processing: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq6" }, horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq7", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq8" } }, defaultVariants: { kind: "general", horizontal: !1 }, compoundVariants: [] }), M = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9", variantClassNames: { horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqa", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqb" } }, defaultVariants: { horizontal: !1 }, compoundVariants: [] }), G = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqi", variantClassNames: { kind: { general: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqj", error: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqk", success: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsql", warning: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqm", processing: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqn" }, horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqo", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqp" } }, defaultVariants: { kind: "general", horizontal: !1 }, compoundVariants: [] }), K = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqq", variantClassNames: { horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqr", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqs" } }, defaultVariants: { horizontal: !1 }, compoundVariants: [] }), J = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqt", variantClassNames: { horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqu", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqv" } }, defaultVariants: { horizontal: !1 }, compoundVariants: [] }), X = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqw", variantClassNames: { hasDetail: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqx", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqy" } }, defaultVariants: { hasDetail: !1 }, compoundVariants: [] }), $ = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqz", variantClassNames: { kind: { general: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq10", error: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq11", success: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq12", warning: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq13", processing: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq14" }, horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq15", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq16" } }, defaultVariants: { kind: "general", horizontal: !1 }, compoundVariants: [] }), Q = m({ defaultClassName: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq17", variantClassNames: { horizontal: { true: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq18", false: "pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq19" } }, defaultVariants: { horizontal: !1 }, compoundVariants: [] });
|
|
107
107
|
const Y = Object.freeze({
|
|
108
108
|
general: "status-new",
|
|
109
109
|
success: "status-ok",
|
|
@@ -172,7 +172,7 @@ function q({
|
|
|
172
172
|
return /* @__PURE__ */ e.createElement("div", { className: U, ...s }, t);
|
|
173
173
|
}
|
|
174
174
|
d.set(q, { name: "InsightCardSet" });
|
|
175
|
-
var Z = "pkg_sps-
|
|
175
|
+
var Z = "pkg_sps-woodland_cards__version_8_41_1__hash_7b9vus0";
|
|
176
176
|
function B({
|
|
177
177
|
children: t,
|
|
178
178
|
className: s,
|
package/lib/index.umd.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(o,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("@sps-woodland/core"),require("react"),require("@spscommerce/i18n"),require("@spscommerce/utils")):typeof define=="function"&&define.amd?define(["exports","@sps-woodland/core","react","@spscommerce/i18n","@spscommerce/utils"],s):(o=typeof globalThis<"u"?globalThis:o||self,s(o.Cards={},o.core,o.React,o.i18n,o.utils))})(this,function(o,s,q,B,l){"use strict";function S(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const a in t)if(a!=="default"){const r=Object.getOwnPropertyDescriptor(t,a);Object.defineProperty(n,a,r.get?r:{enumerable:!0,get:()=>t[a]})}}return n.default=t,Object.freeze(n)}const e=S(q);var N="pkg_sps-woodland_cards__version_8_41_0__hash_1gxcp3j0";function g({children:t,className:n="",...a}){return e.createElement(s.CapContent,{className:s.cl(N,n),...a},t)}s.Metadata.set(g,{name:"CardFooter"});var E="pkg_sps-woodland_cards__version_8_41_0__hash_mxozo50";function C({children:t,className:n="",...a}){return e.createElement(s.CapContent,{className:s.cl(E,n),...a},t)}s.Metadata.set(C,{name:"CardHeader"});var P="pkg_sps-woodland_cards__version_8_41_0__hash_jyyttb0";function b({children:t,className:n,...a}){const[r,[i],m,_]=s.selectChildren(t,[{type:C},{custom:c=>s.Metadata.isWoodlandComponent(c)&&s.Metadata.get(c).name==="Tabs"},{type:g}]),d=s.useChildTestIdAttrBuilder(a);return e.createElement("div",{className:s.cl(P,n),...a},r,i?s.addProps(i,{context:"container"}):e.createElement(s.Content,{...d("body")},_),m)}s.Metadata.set(b,{name:"Card"});var D="pkg_sps-woodland_cards__version_8_41_0__hash_1f11ubh0";function v({children:t,className:n="",...a}){return e.createElement(s.CapContentTitle,{className:s.cl(D,n),...a},t)}s.Metadata.set(v,{name:"CardTitle"});function F(t,n,a){return n in t?Object.defineProperty(t,n,{value:a,enumerable:!0,configurable:!0,writable:!0}):t[n]=a,t}function k(t,n){var a=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);n&&(r=r.filter(function(i){return Object.getOwnPropertyDescriptor(t,i).enumerable})),a.push.apply(a,r)}return a}function y(t){for(var n=1;n<arguments.length;n++){var a=arguments[n]!=null?arguments[n]:{};n%2?k(Object(a),!0).forEach(function(r){F(t,r,a[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(a)):k(Object(a)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(a,r))})}return t}var O=(t,n,a)=>{for(var r of Object.keys(t)){var i;if(t[r]!==((i=n[r])!==null&&i!==void 0?i:a[r]))return!1}return!0},u=t=>n=>{var a=t.defaultClassName,r=y(y({},t.defaultVariants),n);for(var i in r){var m,_=(m=r[i])!==null&&m!==void 0?m:t.defaultVariants[i];if(_!=null){var d=_;typeof d=="boolean"&&(d=d===!0?"true":"false");var c=t.variantClassNames[i][d];c&&(a+=" "+c)}}for(var[f,h]of t.compoundVariants)O(f,r,t.defaultVariants)&&(a+=" "+h);return a},V="pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq0",z=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq1",variantClassNames:{kind:{general:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq2",error:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq3",success:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq4",warning:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq5",processing:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq6"},horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq7",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq8"}},defaultVariants:{kind:"general",horizontal:!1},compoundVariants:[]}),H=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq9",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqa",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqb"}},defaultVariants:{horizontal:!1},compoundVariants:[]}),j=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqi",variantClassNames:{kind:{general:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqj",error:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqk",success:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsql",warning:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqm",processing:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqn"},horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqo",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqp"}},defaultVariants:{kind:"general",horizontal:!1},compoundVariants:[]}),M=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqq",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqr",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqs"}},defaultVariants:{horizontal:!1},compoundVariants:[]}),A=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqt",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqu",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqv"}},defaultVariants:{horizontal:!1},compoundVariants:[]}),W=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqw",variantClassNames:{hasDetail:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqx",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqy"}},defaultVariants:{hasDetail:!1},compoundVariants:[]}),R=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsqz",variantClassNames:{kind:{general:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq10",error:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq11",success:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq12",warning:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq13",processing:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq14"},horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq15",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq16"}},defaultVariants:{kind:"general",horizontal:!1},compoundVariants:[]}),U=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq17",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq18",false:"pkg_sps-woodland_cards__version_8_41_0__hash_1l3fxsq19"}},defaultVariants:{horizontal:!1},compoundVariants:[]});const T=Object.freeze({general:"status-new",success:"status-ok",error:"status-error",warning:"status-warning",processing:"status-in-process"});function I({children:t,className:n,horizontal:a=!1,icon:r,kind:i="general",title:m,metric:_,partnerCount:d,totalPartners:c,...f}){const{t:h}=B.useWoodlandLanguage(),p=s.useChildTestIdAttrBuilder(f),[$,Q,Y]=(d?h("insightTile.partnerCount",{count:d,total:c,defaultValue:`${d} |of| ${c}`}):"").split("|");return e.createElement(e.Fragment,null,e.createElement("div",{className:s.cl(z({kind:i,horizontal:a}),n),...f},e.createElement("div",{className:H({horizontal:a}),...p("body")},r?e.createElement(s.Icon,{icon:`${r}`,...p("icon")}):e.createElement(s.Icon,{icon:`${T[i]}`,...p("icon")}),_&&e.createElement("div",{className:j({kind:i,horizontal:a}),...p("metric")},_),m&&e.createElement("div",{className:A({horizontal:a}),...p("description")},e.createElement("div",{className:M({horizontal:a}),style:{"-webkit-box-orient":"vertical"},...p("title")},m),e.createElement("div",{className:W({hasDetail:!!t}),...p("detail")},t))),d&&e.createElement("div",{className:R({kind:i,horizontal:a}),...p("partner-count")},d===c?e.createElement("div",null,h("insightTile.all",{defaultValue:"ALL"})):e.createElement(e.Fragment,null,e.createElement("div",null,$),e.createElement("div",null,Q),e.createElement("div",null,Y)),e.createElement("div",{className:U({horizontal:a})},h("insightTile.partners",{defaultValue:"PARTNERS"})))))}s.Metadata.set(I,{name:"InsightCard",props:{horizontal:{type:"boolean",default:"false"},icon:"IconName",kind:{type:"InsightCardKind",default:'"general"'},title:"string",metric:"number | string",partnerCount:"number",totalPartners:"number"}});function w({children:t,...n}){return e.createElement("div",{className:V,...n},t)}s.Metadata.set(w,{name:"InsightCardSet"});var L="pkg_sps-woodland_cards__version_8_41_0__hash_7b9vus0";function x({children:t,className:n,maxHeight:a,style:r,...i}){return e.createElement("div",{className:s.cl(L,n),style:{...r,maxHeight:a},...i},t)}s.Metadata.set(x,{name:"ScrollableContainer",props:{maxHeight:"string"}});const G={description:()=>e.createElement("p",null,"Cards are used to group similar or related content together in a single container. They can be combined with additional elements such as Headers, Footers, or Tabs."),components:[b,g,C,v],examples:{general:{label:"General Usage",description:({Link:t,NavigateTo:n})=>e.createElement(e.Fragment,null,e.createElement("h5",null,"Sizing and Layout"),e.createElement("p",null,"All varieties of Cards should be placed on the Woodland Grid (i.e. the width of a Card should span a specific number of grid columns). They should never be set to a custom width. See the ",e.createElement(t,{to:"/style-and-layout/grid"},"Woodland Grid")," and"," ",e.createElement(t,{to:"/style-and-layout/page-types"},"Page Layouts")," sections for more guidance on appropriate usage."),e.createElement("p",null,"The height of a Card should typically be based on the content inside of it, but in specific cases a fixed height can be set. For these cases, content will scroll vertically inside of the container."),e.createElement("h5",null,"Text Content"),e.createElement("p",null,"The only text content that can exist outside of a Card is the"," ",e.createElement(n,{to:"page-title"},"Page Title")," component."),e.createElement("p",null,"All other content should exist inside of a Card and should adhere to the Woodland Design System ",e.createElement(t,{to:"/style-and-layout/typography"},"Typography")," rules."),e.createElement("h5",null,"Nesting"),e.createElement("p",null,"Avoid nesting Cards inside of other Cards when possible. If nesting is necessary, avoid nesting more than one level deep (i.e. limit nesting to a Card inside of a Card)."))},basic:{label:"Basic card",description:()=>e.createElement("p",null,"Basic Cards can include any type of general content, such as body copy, description lists, or more complex content such as forms."),examples:{basic:{react:l.code`
|
|
1
|
+
(function(o,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("@sps-woodland/core"),require("react"),require("@spscommerce/i18n"),require("@spscommerce/utils")):typeof define=="function"&&define.amd?define(["exports","@sps-woodland/core","react","@spscommerce/i18n","@spscommerce/utils"],s):(o=typeof globalThis<"u"?globalThis:o||self,s(o.Cards={},o.core,o.React,o.i18n,o.utils))})(this,function(o,s,q,B,l){"use strict";function S(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const a in t)if(a!=="default"){const r=Object.getOwnPropertyDescriptor(t,a);Object.defineProperty(n,a,r.get?r:{enumerable:!0,get:()=>t[a]})}}return n.default=t,Object.freeze(n)}const e=S(q);var N="pkg_sps-woodland_cards__version_8_41_1__hash_1gxcp3j0";function g({children:t,className:n="",...a}){return e.createElement(s.CapContent,{className:s.cl(N,n),...a},t)}s.Metadata.set(g,{name:"CardFooter"});var E="pkg_sps-woodland_cards__version_8_41_1__hash_mxozo50";function C({children:t,className:n="",...a}){return e.createElement(s.CapContent,{className:s.cl(E,n),...a},t)}s.Metadata.set(C,{name:"CardHeader"});var P="pkg_sps-woodland_cards__version_8_41_1__hash_jyyttb0";function b({children:t,className:n,...a}){const[r,[i],m,_]=s.selectChildren(t,[{type:C},{custom:c=>s.Metadata.isWoodlandComponent(c)&&s.Metadata.get(c).name==="Tabs"},{type:g}]),d=s.useChildTestIdAttrBuilder(a);return e.createElement("div",{className:s.cl(P,n),...a},r,i?s.addProps(i,{context:"container"}):e.createElement(s.Content,{...d("body")},_),m)}s.Metadata.set(b,{name:"Card"});var D="pkg_sps-woodland_cards__version_8_41_1__hash_1f11ubh0";function v({children:t,className:n="",...a}){return e.createElement(s.CapContentTitle,{className:s.cl(D,n),...a},t)}s.Metadata.set(v,{name:"CardTitle"});function F(t,n,a){return n in t?Object.defineProperty(t,n,{value:a,enumerable:!0,configurable:!0,writable:!0}):t[n]=a,t}function k(t,n){var a=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);n&&(r=r.filter(function(i){return Object.getOwnPropertyDescriptor(t,i).enumerable})),a.push.apply(a,r)}return a}function y(t){for(var n=1;n<arguments.length;n++){var a=arguments[n]!=null?arguments[n]:{};n%2?k(Object(a),!0).forEach(function(r){F(t,r,a[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(a)):k(Object(a)).forEach(function(r){Object.defineProperty(t,r,Object.getOwnPropertyDescriptor(a,r))})}return t}var O=(t,n,a)=>{for(var r of Object.keys(t)){var i;if(t[r]!==((i=n[r])!==null&&i!==void 0?i:a[r]))return!1}return!0},u=t=>n=>{var a=t.defaultClassName,r=y(y({},t.defaultVariants),n);for(var i in r){var m,_=(m=r[i])!==null&&m!==void 0?m:t.defaultVariants[i];if(_!=null){var d=_;typeof d=="boolean"&&(d=d===!0?"true":"false");var c=t.variantClassNames[i][d];c&&(a+=" "+c)}}for(var[f,h]of t.compoundVariants)O(f,r,t.defaultVariants)&&(a+=" "+h);return a},V="pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq0",z=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1",variantClassNames:{kind:{general:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq2",error:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq3",success:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq4",warning:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq5",processing:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq6"},horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq7",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq8"}},defaultVariants:{kind:"general",horizontal:!1},compoundVariants:[]}),H=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqa",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqb"}},defaultVariants:{horizontal:!1},compoundVariants:[]}),j=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqi",variantClassNames:{kind:{general:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqj",error:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqk",success:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsql",warning:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqm",processing:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqn"},horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqo",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqp"}},defaultVariants:{kind:"general",horizontal:!1},compoundVariants:[]}),M=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqq",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqr",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqs"}},defaultVariants:{horizontal:!1},compoundVariants:[]}),A=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqt",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqu",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqv"}},defaultVariants:{horizontal:!1},compoundVariants:[]}),W=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqw",variantClassNames:{hasDetail:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqx",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqy"}},defaultVariants:{hasDetail:!1},compoundVariants:[]}),R=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqz",variantClassNames:{kind:{general:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq10",error:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq11",success:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq12",warning:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq13",processing:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq14"},horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq15",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq16"}},defaultVariants:{kind:"general",horizontal:!1},compoundVariants:[]}),U=u({defaultClassName:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq17",variantClassNames:{horizontal:{true:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq18",false:"pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq19"}},defaultVariants:{horizontal:!1},compoundVariants:[]});const T=Object.freeze({general:"status-new",success:"status-ok",error:"status-error",warning:"status-warning",processing:"status-in-process"});function I({children:t,className:n,horizontal:a=!1,icon:r,kind:i="general",title:m,metric:_,partnerCount:d,totalPartners:c,...f}){const{t:h}=B.useWoodlandLanguage(),p=s.useChildTestIdAttrBuilder(f),[$,Q,Y]=(d?h("insightTile.partnerCount",{count:d,total:c,defaultValue:`${d} |of| ${c}`}):"").split("|");return e.createElement(e.Fragment,null,e.createElement("div",{className:s.cl(z({kind:i,horizontal:a}),n),...f},e.createElement("div",{className:H({horizontal:a}),...p("body")},r?e.createElement(s.Icon,{icon:`${r}`,...p("icon")}):e.createElement(s.Icon,{icon:`${T[i]}`,...p("icon")}),_&&e.createElement("div",{className:j({kind:i,horizontal:a}),...p("metric")},_),m&&e.createElement("div",{className:A({horizontal:a}),...p("description")},e.createElement("div",{className:M({horizontal:a}),style:{"-webkit-box-orient":"vertical"},...p("title")},m),e.createElement("div",{className:W({hasDetail:!!t}),...p("detail")},t))),d&&e.createElement("div",{className:R({kind:i,horizontal:a}),...p("partner-count")},d===c?e.createElement("div",null,h("insightTile.all",{defaultValue:"ALL"})):e.createElement(e.Fragment,null,e.createElement("div",null,$),e.createElement("div",null,Q),e.createElement("div",null,Y)),e.createElement("div",{className:U({horizontal:a})},h("insightTile.partners",{defaultValue:"PARTNERS"})))))}s.Metadata.set(I,{name:"InsightCard",props:{horizontal:{type:"boolean",default:"false"},icon:"IconName",kind:{type:"InsightCardKind",default:'"general"'},title:"string",metric:"number | string",partnerCount:"number",totalPartners:"number"}});function w({children:t,...n}){return e.createElement("div",{className:V,...n},t)}s.Metadata.set(w,{name:"InsightCardSet"});var L="pkg_sps-woodland_cards__version_8_41_1__hash_7b9vus0";function x({children:t,className:n,maxHeight:a,style:r,...i}){return e.createElement("div",{className:s.cl(L,n),style:{...r,maxHeight:a},...i},t)}s.Metadata.set(x,{name:"ScrollableContainer",props:{maxHeight:"string"}});const G={description:()=>e.createElement("p",null,"Cards are used to group similar or related content together in a single container. They can be combined with additional elements such as Headers, Footers, or Tabs."),components:[b,g,C,v],examples:{general:{label:"General Usage",description:({Link:t,NavigateTo:n})=>e.createElement(e.Fragment,null,e.createElement("h5",null,"Sizing and Layout"),e.createElement("p",null,"All varieties of Cards should be placed on the Woodland Grid (i.e. the width of a Card should span a specific number of grid columns). They should never be set to a custom width. See the ",e.createElement(t,{to:"/style-and-layout/grid"},"Woodland Grid")," and"," ",e.createElement(t,{to:"/style-and-layout/page-types"},"Page Layouts")," sections for more guidance on appropriate usage."),e.createElement("p",null,"The height of a Card should typically be based on the content inside of it, but in specific cases a fixed height can be set. For these cases, content will scroll vertically inside of the container."),e.createElement("h5",null,"Text Content"),e.createElement("p",null,"The only text content that can exist outside of a Card is the"," ",e.createElement(n,{to:"page-title"},"Page Title")," component."),e.createElement("p",null,"All other content should exist inside of a Card and should adhere to the Woodland Design System ",e.createElement(t,{to:"/style-and-layout/typography"},"Typography")," rules."),e.createElement("h5",null,"Nesting"),e.createElement("p",null,"Avoid nesting Cards inside of other Cards when possible. If nesting is necessary, avoid nesting more than one level deep (i.e. limit nesting to a Card inside of a Card)."))},basic:{label:"Basic card",description:()=>e.createElement("p",null,"Basic Cards can include any type of general content, such as body copy, description lists, or more complex content such as forms."),examples:{basic:{react:l.code`
|
|
2
2
|
import { Card } from "@sps-woodland/cards";
|
|
3
3
|
function Component() {
|
|
4
4
|
return (
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pkg_sps-
|
|
1
|
+
.pkg_sps-woodland_cards__version_8_41_1__hash_1gxcp3j0{border-top-color:#d2d4d4;border-top-style:solid;border-top-width:.0625rem}.pkg_sps-woodland_cards__version_8_41_1__hash_mxozo50{border-bottom-color:#d2d4d4;border-bottom-style:solid;border-bottom-width:.0625rem}.pkg_sps-woodland_cards__version_8_41_1__hash_mxozo50 svg{margin-bottom:0}.pkg_sps-woodland_cards__version_8_41_1__hash_jyyttb0{background-clip:border-box;background-color:#fff;border-color:#d2d4d4;border-radius:.25rem;border-style:solid;border-width:.0625rem;display:flex;flex-direction:column;min-width:0;word-wrap:break-word}.pkg_sps-woodland_cards__version_8_41_1__hash_1f11ubh0{font-weight:600}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq0{display:flex;flex-wrap:wrap;margin:-.5rem}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1{background:#fff;border-width:.0625rem;border-style:solid;border-radius:.25rem;display:block;flex:1 0 calc(20% - 20px);margin:.5rem;min-width:0;padding:.9375rem 1.25rem;text-align:center}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq2{border-color:#007db8;color:#007db8}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq2:hover{background:#007db8}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq3{border-color:#de002e;color:#de002e}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq3:hover{background:#de002e}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq4{border-color:#0b8940;color:#0b8940}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq4:hover{background:#0b8940}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq5{border-color:#e7760b;color:#e7760b}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq5:hover{background:#e7760b}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq6{border-color:#91467f;color:#91467f}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq6:hover{background:#91467f}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq7{display:flex;flex:1 0 calc(50% - 20px);height:5.125rem;max-width:calc(50% - 20px)}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9{display:block;min-width:0}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqa{align-items:center;display:flex;flex:1;text-align:left}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqc{display:block;font-size:2rem;line-height:2rem}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqd{color:#007db8}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqe{color:#de002e}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqf{color:#0b8940}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqg{color:#e7760b}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqh{color:#91467f}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqi{font-size:3rem;font-weight:600;line-height:3rem;max-width:100%;word-wrap:break-word}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqj{color:#007db8}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqk{color:#de002e}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsql{color:#0b8940}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqm{color:#e7760b}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqn{color:#91467f}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqo{margin-left:.5rem;order:1}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqq{-webkit-box-orient:vertical;-webkit-box-pack:center;align-items:center;color:#1f282c;display:-webkit-box;font-weight:600;min-height:2.125rem;font-size:1rem;line-height:1rem;padding-bottom:.125rem;max-width:100%;word-wrap:break-word}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqr{min-height:1rem;margin-bottom:0}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqu{flex:1;margin-left:.5rem;min-width:0}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqw{color:#4b5356;display:none;height:12px;font-size:.75rem;line-height:.75rem;margin-top:.25rem;text-transform:uppercase;white-space:nowrap}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqx{display:block}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqz{color:#fff;font-weight:600;font-size:.75rem;line-height:1.125rem;margin:.9375rem -1.25rem -.9375rem;padding:.625rem 1.25rem}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq10{background:#007db8}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq11{background:#de002e}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq12{background:#0b8940}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq13{background:#e7760b}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq14{background:#91467f}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq15{display:flex;flex-direction:column;justify-content:center;line-height:.875rem;margin:-.9375rem -1.25rem -.9375rem 1.25rem;padding:1.25rem .625rem;width:3.75rem}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq18{display:none!important}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9>svg{font-size:2rem;line-height:2rem}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqz>*{display:inline-block}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqz>*:not(:last-child){padding-right:.125rem}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1:hover{cursor:pointer}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1:hover>*{color:#fff!important}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1:hover>.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9>*{color:#fff!important}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1:hover>.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9>.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqt>*{color:#fff!important}.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq1:hover>.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsq9>.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqt>.pkg_sps-woodland_cards__version_8_41_1__hash_1l3fxsqw>*{color:#fff!important}.pkg_sps-woodland_cards__version_8_41_1__hash_7b9vus0{overflow:scroll;background-attachment:local,local,scroll,scroll;background-color:#fff;background-image:linear-gradient(0deg,#fff,#fff0),linear-gradient(180deg,#fff,#fff0),linear-gradient(0deg,#00000026,#fff0),linear-gradient(180deg,#00000026,#fff0);background-position:100% 100%,0 0,100% 100%,0 0;background-repeat:no-repeat;background-size:100% 3.125rem,100% 3.125rem,100% .625rem,100% .625rem;display:block;overflow-x:hidden;overflow-y:auto}.pkg_sps-woodland_cards__version_8_41_1__hash_7b9vus0 .sps-clickable-tag{background-color:#acd4e84d}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sps-woodland/cards",
|
|
3
3
|
"description": "SPS Woodland Design System card, insight card, and scrollable container components",
|
|
4
|
-
"version": "8.41.
|
|
4
|
+
"version": "8.41.1",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/cards",
|
|
@@ -30,9 +30,9 @@
|
|
|
30
30
|
"@spscommerce/utils": "^7.0.0 || ^8.0.0",
|
|
31
31
|
"react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
32
32
|
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
33
|
-
"@sps-woodland/core": "8.41.
|
|
34
|
-
"@sps-woodland/tokens": "8.41.
|
|
35
|
-
"@spscommerce/i18n": "8.41.
|
|
33
|
+
"@sps-woodland/core": "8.41.1",
|
|
34
|
+
"@sps-woodland/tokens": "8.41.1",
|
|
35
|
+
"@spscommerce/i18n": "8.41.1"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@react-stately/collections": "^3.12.7",
|
|
@@ -42,10 +42,10 @@
|
|
|
42
42
|
"@vanilla-extract/recipes": "^0.2.5",
|
|
43
43
|
"react": "^16.14.0",
|
|
44
44
|
"react-dom": "^16.14.0",
|
|
45
|
-
"@sps-woodland/core": "8.41.
|
|
46
|
-
"@sps-woodland/tabs": "8.41.
|
|
47
|
-
"@sps-woodland/tokens": "8.41.
|
|
48
|
-
"@spscommerce/i18n": "8.41.
|
|
45
|
+
"@sps-woodland/core": "8.41.1",
|
|
46
|
+
"@sps-woodland/tabs": "8.41.1",
|
|
47
|
+
"@sps-woodland/tokens": "8.41.1",
|
|
48
|
+
"@spscommerce/i18n": "8.41.1"
|
|
49
49
|
},
|
|
50
50
|
"scripts": {
|
|
51
51
|
"build": "pnpm run build:js && pnpm run build:types",
|