@sps-woodland/growler 8.17.2 → 8.18.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.cjs.js +1 -1
- package/lib/index.es.js +1 -1
- package/lib/style.css +1 -1
- package/package.json +7 -7
package/lib/index.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),u=require("@sps-woodland/core"),N=require("@sps-woodland/buttons"),S=require("@sps-woodland/tokens"),L=require("react-dom"),i=require("@spscommerce/utils");function I(r){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(o,t,n.get?n:{enumerable:!0,get:()=>r[t]})}}return o.default=r,Object.freeze(o)}const e=I(A);function x(r,o,t){return o in r?Object.defineProperty(r,o,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[o]=t,r}function C(r,o){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);o&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(r,s).enumerable})),t.push.apply(t,n)}return t}function b(r){for(var o=1;o<arguments.length;o++){var t=arguments[o]!=null?arguments[o]:{};o%2?C(Object(t),!0).forEach(function(n){x(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):C(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}var T=(r,o,t)=>{for(var n of Object.keys(r)){var s;if(r[n]!==((s=o[n])!==null&&s!==void 0?s:t[n]))return!1}return!0},j=r=>o=>{var t=r.defaultClassName,n=b(b({},r.defaultVariants),o);for(var s in n){var c,a=(c=n[s])!==null&&c!==void 0?c:r.defaultVariants[s];if(a!=null){var l=a;typeof l=="boolean"&&(l=l===!0?"true":"false");var d=r.variantClassNames[s][l];d&&(t+=" "+d)}}for(var[p,m]of r.compoundVariants)T(p,n,r.defaultVariants)&&(t+=" "+m);return t},D=j({defaultClassName:"pkg_sps-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),u=require("@sps-woodland/core"),N=require("@sps-woodland/buttons"),S=require("@sps-woodland/tokens"),L=require("react-dom"),i=require("@spscommerce/utils");function I(r){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(o,t,n.get?n:{enumerable:!0,get:()=>r[t]})}}return o.default=r,Object.freeze(o)}const e=I(A);function x(r,o,t){return o in r?Object.defineProperty(r,o,{value:t,enumerable:!0,configurable:!0,writable:!0}):r[o]=t,r}function C(r,o){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);o&&(n=n.filter(function(s){return Object.getOwnPropertyDescriptor(r,s).enumerable})),t.push.apply(t,n)}return t}function b(r){for(var o=1;o<arguments.length;o++){var t=arguments[o]!=null?arguments[o]:{};o%2?C(Object(t),!0).forEach(function(n){x(r,n,t[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(t)):C(Object(t)).forEach(function(n){Object.defineProperty(r,n,Object.getOwnPropertyDescriptor(t,n))})}return r}var T=(r,o,t)=>{for(var n of Object.keys(r)){var s;if(r[n]!==((s=o[n])!==null&&s!==void 0?s:t[n]))return!1}return!0},j=r=>o=>{var t=r.defaultClassName,n=b(b({},r.defaultVariants),o);for(var s in n){var c,a=(c=n[s])!==null&&c!==void 0?c:r.defaultVariants[s];if(a!=null){var l=a;typeof l=="boolean"&&(l=l===!0?"true":"false");var d=r.variantClassNames[s][l];d&&(t+=" "+d)}}for(var[p,m]of r.compoundVariants)T(p,n,r.defaultVariants)&&(t+=" "+m);return t},D=j({defaultClassName:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk1",variantClassNames:{kind:{activity:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk2",info:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk3",progress:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk4",error:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk5",success:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk6",warning:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk7"},fade:{true:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk8",false:"pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk9"}},defaultVariants:{},compoundVariants:[]}),U="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnka",F="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkh",W="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkc",V="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkb",q="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkd",z="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnke",H="pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkf";const k=Object.freeze({warning:"status-warning",error:"status-error",success:"status-ok",info:"info-circle"});function f({children:r,className:o,imgSrc:t,kind:n="info",onClose:s,removeFromList:c,persist:a,title:l,id:d,...p}){const m=e.useRef(s);e.useEffect(()=>{m.current=s},[s]);const _=S.Tokens.component.growler.duration.visible,B=S.Tokens.component.growler.duration.fadeout,[M,w]=e.useState(!1),{t:O}=e.useContext(u.I18nContext);function P(){return[window.setTimeout(()=>{w(!0)},_),window.setTimeout(()=>{m.current&&m.current(),c&&d&&c(d)},_+B)]}const g=e.useRef([]);function G(){a||(g.current=P())}function h(){for(const R of g.current)window.clearTimeout(R);g.current=[]}function y(){h(),w(!1)}function K(){y(),w(!1),s&&s(),c&&d&&c(d)}return e.useEffect(()=>(G(),()=>{h()}),[]),e.createElement("div",{role:"alert","aria-live":"polite",className:u.cl(D({kind:n,fade:M}),o),onMouseEnter:y,onMouseLeave:G,...p},e.createElement("div",{className:V},t&&e.createElement("img",{src:t,alt:""}),n==="progress"?e.createElement(u.Spinner,null):e.createElement(u.Icon,{icon:k[n],className:W})),e.createElement("div",{className:q},e.createElement("div",{className:z},l&&e.createElement("span",{className:H},l),e.createElement("div",null,r)),e.createElement(N.Button,{kind:"icon",icon:"x",title:O("design-system:growler.dismiss"),className:F,onClick:K})))}u.Metadata.set(f,{name:"Growler",props:{imgSrc:{type:"string"},kind:{type:"GrowlerKind",default:"info"},onClose:{type:"() => void"},persist:{type:"boolean"},title:{type:"string"}}});let J=(r=21)=>crypto.getRandomValues(new Uint8Array(r)).reduce((o,t)=>(t&=63,t<36?o+=t.toString(36):t<62?o+=(t-26).toString(36).toUpperCase():t>62?o+="-":o+="_",o),"");const v=e.createContext({growlerList:[],setGrowlerList:()=>{}});function E(r){const[o,t]=e.useState([]),n=a=>{if(!a){console.error("growlers should have an id");return}t(l=>l.filter(d=>a!==d.id))},s=o.map(({G:a,id:l})=>e.cloneElement(a(),{key:l,id:l,removeFromList:n})).filter(a=>u.Metadata.get(a.type).name==="Growler"?!0:(console.error("addGrowler only accepts a function that returns a Growler"),!1)),c=e.createElement("div",{"data-testid":r["data-testid"],"data-portalid":"growler-portal",className:U},s);return e.createElement(v.Provider,{value:{growlerList:o,setGrowlerList:t}},L.createPortal(c,document.body),r.children)}const Q=()=>{const r=e.useContext(v);if(r===void 0)throw new Error("addGrowler must be used within a GrowlerListProvider");return{addGrowler:e.useCallback(t=>{const n=J(),s={G:t,id:n};r.setGrowlerList([s,...r.growlerList])},[r])}},X={description:()=>e.createElement("p",null,"Use Growlers for dynamic messages in response to a user's action. All Growlers have a Primary Message, and may optionally have a Secondary Message as needed. Growlers may also contain Hyperlinks in the Secondary Message."),components:[f,E],examples:{general:{label:"General Usage",description:()=>e.createElement(e.Fragment,null,e.createElement("p",null,"Use the following guidelines to write an effective Growler message."),e.createElement("ul",null,e.createElement("li",null,"Write all messages in sentence case.",e.createElement("ul",null,e.createElement("li",null,"Capitalize the first word of the message."),e.createElement("li",null,"Add punctuation, such as a period, at the end of the message."))),e.createElement("li",null,"Keep messages as succinct as possible while also providing sufficient information to the customer."),e.createElement("li",null,"If you can clearly convey your message in a single statement, use only the Primary Message."),e.createElement("li",null,"If the message requires additional details, such as further information or instructions, use both the Primary and Secondary Messages.")),e.createElement("p",null,"For more examples of effective feedback message writing, refer to ",e.createElement("a",{href:"https://atlassian.design/content/messaging-guidelines",target:"_blank"},"Atlassian's Messaging Guidelines"),"."))},provider:{label:"Growler List Provider",description:()=>e.createElement(e.Fragment,null,e.createElement("p",null,"Applications that use growlers should be wrapped in the",e.createElement("code",null,"GrowlerListProvider")," component. All growlers should be triggered by the addGrowler function from the ",e.createElement("code",null,"useGrowler")," hook"),e.createElement("p",null,"Wrapping your application in the ",e.createElement("code",null,"GrowlerListProvider"),"will allow you to call the ",e.createElement("code",null,"useGrowler")," hook from anywhere within your application. There is no longer a need to pass anything through to the children components."))},error:{label:"Error",description:()=>e.createElement(e.Fragment,null,e.createElement("p",null,"Acceptable message: Document ABC123 has not been sent. Check the form and try sending it again."),e.createElement("p",null,`Unacceptable message: "Can't send your document."`)),examples:{primary:{description:"Primary Message Only",react:i.code`
|
|
2
2
|
import { Growler, useGrowler } from "@sps-woodland/growler";
|
|
3
3
|
import { SpsButton } from "@spscommerce/ds-react";
|
|
4
4
|
import { ButtonKind } from "@spscommerce/ds-shared";
|
package/lib/index.es.js
CHANGED
|
@@ -57,7 +57,7 @@ var T = (r, t, o) => {
|
|
|
57
57
|
for (var [m, u] of r.compoundVariants)
|
|
58
58
|
T(m, n, r.defaultVariants) && (o += " " + u);
|
|
59
59
|
return o;
|
|
60
|
-
}, D = U({ defaultClassName: "pkg_sps-
|
|
60
|
+
}, D = U({ defaultClassName: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk1", variantClassNames: { kind: { activity: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk2", info: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk3", progress: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk4", error: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk5", success: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk6", warning: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk7" }, fade: { true: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk8", false: "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk9" } }, defaultVariants: {}, compoundVariants: [] }), j = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnka", F = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkh", W = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkc", V = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkb", z = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkd", q = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnke", H = "pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkf";
|
|
61
61
|
const J = Object.freeze({
|
|
62
62
|
warning: "status-warning",
|
|
63
63
|
error: "status-error",
|
package/lib/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@keyframes pkg_sps-
|
|
1
|
+
@keyframes pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk0{0%{opacity:1}to{opacity:0}}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk1{border-radius:.25rem;box-shadow:0 0 .3125rem #00000040;display:flex;margin-bottom:1rem;overflow:hidden;width:25rem}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk2{background:#e9e9ea;border:.0625rem oklch(56.48% .008 219.62) solid}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk3{background:#027db8;border:.0625rem oklch(56.21% .128 239.83) solid}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk4{background:#91467f;border:.0625rem oklch(50.83% .125 337.21) solid}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk5{background:#de012e;border:.0625rem oklch(56.83% .229 22.94) solid}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk6{background:#0b8940;border:.0625rem oklch(55.21% .148 150.27) solid}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk7{background:#e77609;border:.0625rem oklch(68.35% .17 53.59) solid}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk8{animation-name:pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk0;animation-duration:2s}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnk9{opacity:1}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnka{display:flex;flex-direction:column;position:fixed;right:1.875rem;top:5.625rem;width:25rem}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkb{align-items:center;display:flex;flex-grow:0;flex-shrink:0;flex-basis:4.375rem;justify-content:center}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkc{color:#fff;font-size:1.875rem}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkd{background-color:#fff;padding:1rem 2.625rem 1rem 1rem;position:relative;display:flex;flex-grow:1}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnke{flex-grow:1;font-size:.75rem;line-height:1.25rem}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkf{font-weight:600}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkg{color:#4b5356;overflow-wrap:break-word;width:16.5rem}.pkg_sps-woodland_growler__version_8_18_0__hash_1c5fbnkh{position:absolute;right:.5rem;top:.5rem}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sps-woodland/growler",
|
|
3
3
|
"description": "SPS Woodland Design System growler component and hook",
|
|
4
|
-
"version": "8.
|
|
4
|
+
"version": "8.18.0",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/growler",
|
|
@@ -33,9 +33,9 @@
|
|
|
33
33
|
"@spscommerce/utils": "^7.0.0",
|
|
34
34
|
"react": "^16.9.0",
|
|
35
35
|
"react-dom": "^16.9.0",
|
|
36
|
-
"@sps-woodland/buttons": "8.
|
|
37
|
-
"@sps-woodland/core": "8.
|
|
38
|
-
"@sps-woodland/tokens": "8.
|
|
36
|
+
"@sps-woodland/buttons": "8.18.0",
|
|
37
|
+
"@sps-woodland/core": "8.18.0",
|
|
38
|
+
"@sps-woodland/tokens": "8.18.0"
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
41
|
"@spscommerce/utils": "^7.0.0",
|
|
@@ -43,9 +43,9 @@
|
|
|
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/tokens": "8.
|
|
46
|
+
"@sps-woodland/buttons": "8.18.0",
|
|
47
|
+
"@sps-woodland/core": "8.18.0",
|
|
48
|
+
"@sps-woodland/tokens": "8.18.0"
|
|
49
49
|
},
|
|
50
50
|
"scripts": {
|
|
51
51
|
"build": "pnpm run build:js && pnpm run build:types",
|