@sps-woodland/buttons 8.23.17 → 8.24.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.
Files changed (4) hide show
  1. package/lib/index.js +193 -186
  2. package/lib/index.umd.cjs +22 -22
  3. package/lib/style.css +1 -1
  4. package/package.json +5 -5
package/lib/index.umd.cjs CHANGED
@@ -1,4 +1,4 @@
1
- (function(N,v){typeof exports=="object"&&typeof module<"u"?v(exports,require("react"),require("@sps-woodland/core"),require("@react-aria/focus"),require("@spscommerce/utils")):typeof define=="function"&&define.amd?define(["exports","react","@sps-woodland/core","@react-aria/focus","@spscommerce/utils"],v):(N=typeof globalThis<"u"?globalThis:N||self,v(N.Buttons={},N.React,N.core,N.focus,N.utils))})(this,function(N,v,V,me,k){"use strict";function Ae(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const c=Ae(v),_e=typeof document<"u"?v.useLayoutEffect:()=>{};function W(e){const t=v.useRef(null);return _e(()=>{t.current=e},[e]),v.useCallback((...r)=>{const o=t.current;return o==null?void 0:o(...r)},[])}let be=new Map;function Le(e,t){if(e===t)return e;let r=be.get(e);if(r)return r.forEach(a=>a(t)),t;let o=be.get(t);return o?(o.forEach(a=>a(e)),e):t}function ge(...e){return(...t)=>{for(let r of e)typeof r=="function"&&r(...t)}}const A=e=>{var t;return(t=e==null?void 0:e.ownerDocument)!==null&&t!==void 0?t:document},oe=e=>e&&"window"in e&&e.window===e?e:A(e).defaultView||window;function ve(e){var t,r,o="";if(typeof e=="string"||typeof e=="number")o+=e;else if(typeof e=="object")if(Array.isArray(e)){var a=e.length;for(t=0;t<a;t++)e[t]&&(r=ve(e[t]))&&(o&&(o+=" "),o+=r)}else for(r in e)e[r]&&(o&&(o+=" "),o+=r);return o}function Me(){for(var e,t,r=0,o="",a=arguments.length;r<a;r++)(e=arguments[r])&&(t=ve(e))&&(o&&(o+=" "),o+=t);return o}function j(...e){let t={...e[0]};for(let r=1;r<e.length;r++){let o=e[r];for(let a in o){let d=t[a],u=o[a];typeof d=="function"&&typeof u=="function"&&a[0]==="o"&&a[1]==="n"&&a.charCodeAt(2)>=65&&a.charCodeAt(2)<=90?t[a]=ge(d,u):(a==="className"||a==="UNSAFE_className")&&typeof d=="string"&&typeof u=="string"?t[a]=Me(d,u):a==="id"&&d&&u?t.id=Le(d,u):t[a]=u!==void 0?u:d}}return t}const Fe=new Set(["id"]),Ue=new Set(["aria-label","aria-labelledby","aria-describedby","aria-details"]),He=new Set(["href","hrefLang","target","rel","download","ping","referrerPolicy"]),Ge=/^(data-.*)$/;function Ve(e,t={}){let{labelable:r,isLink:o,propNames:a}=t,d={};for(const u in e)Object.prototype.hasOwnProperty.call(e,u)&&(Fe.has(u)||r&&Ue.has(u)||o&&He.has(u)||a!=null&&a.has(u)||Ge.test(u))&&(d[u]=e[u]);return d}function Y(e){if(We())e.focus({preventScroll:!0});else{let t=je(e);e.focus(),Ye(t)}}let X=null;function We(){if(X==null){X=!1;try{document.createElement("div").focus({get preventScroll(){return X=!0,!0}})}catch{}}return X}function je(e){let t=e.parentNode,r=[],o=document.scrollingElement||document.documentElement;for(;t instanceof HTMLElement&&t!==o;)(t.offsetHeight<t.scrollHeight||t.offsetWidth<t.scrollWidth)&&r.push({element:t,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft}),t=t.parentNode;return o instanceof HTMLElement&&r.push({element:o,scrollTop:o.scrollTop,scrollLeft:o.scrollLeft}),r}function Ye(e){for(let{element:t,scrollTop:r,scrollLeft:o}of e)t.scrollTop=r,t.scrollLeft=o}function q(e){var t;return typeof window>"u"||window.navigator==null?!1:((t=window.navigator.userAgentData)===null||t===void 0?void 0:t.brands.some(r=>e.test(r.brand)))||e.test(window.navigator.userAgent)}function re(e){var t;return typeof window<"u"&&window.navigator!=null?e.test(((t=window.navigator.userAgentData)===null||t===void 0?void 0:t.platform)||window.navigator.platform):!1}function L(e){let t=null;return()=>(t==null&&(t=e()),t)}const z=L(function(){return re(/^Mac/i)}),Re=L(function(){return re(/^iPhone/i)}),he=L(function(){return re(/^iPad/i)||z()&&navigator.maxTouchPoints>1}),ye=L(function(){return Re()||he()}),Xe=L(function(){return q(/AppleWebKit/i)&&!qe()}),qe=L(function(){return q(/Chrome/i)}),ke=L(function(){return q(/Android/i)}),ze=L(function(){return q(/Firefox/i)});function R(e,t,r=!0){var o,a;let{metaKey:d,ctrlKey:u,altKey:p,shiftKey:m}=t;ze()&&(!((a=window.event)===null||a===void 0||(o=a.type)===null||o===void 0)&&o.startsWith("key"))&&e.target==="_blank"&&(z()?d=!0:u=!0);let h=Xe()&&z()&&!he()?new KeyboardEvent("keydown",{keyIdentifier:"Enter",metaKey:d,ctrlKey:u,altKey:p,shiftKey:m}):new MouseEvent("click",{metaKey:d,ctrlKey:u,altKey:p,shiftKey:m,bubbles:!0,cancelable:!0});R.isOpening=r,Y(e),e.dispatchEvent(h),R.isOpening=!1}R.isOpening=!1;let F=new Map,se=new Set;function we(){if(typeof window>"u")return;function e(o){return"propertyName"in o}let t=o=>{if(!e(o)||!o.target)return;let a=F.get(o.target);a||(a=new Set,F.set(o.target,a),o.target.addEventListener("transitioncancel",r,{once:!0})),a.add(o.propertyName)},r=o=>{if(!e(o)||!o.target)return;let a=F.get(o.target);if(a&&(a.delete(o.propertyName),a.size===0&&(o.target.removeEventListener("transitioncancel",r),F.delete(o.target)),F.size===0)){for(let d of se)d();se.clear()}};document.body.addEventListener("transitionrun",t),document.body.addEventListener("transitionend",r)}typeof document<"u"&&(document.readyState!=="loading"?we():document.addEventListener("DOMContentLoaded",we));function Je(e){requestAnimationFrame(()=>{F.size===0?e():se.add(e)})}function Qe(){let e=v.useRef(new Map),t=v.useCallback((a,d,u,p)=>{let m=p!=null&&p.once?(...h)=>{e.current.delete(u),u(...h)}:u;e.current.set(u,{type:d,eventTarget:a,fn:m,options:p}),a.addEventListener(d,u,p)},[]),r=v.useCallback((a,d,u,p)=>{var m;let h=((m=e.current.get(u))===null||m===void 0?void 0:m.fn)||u;a.removeEventListener(d,h,p),e.current.delete(u)},[]),o=v.useCallback(()=>{e.current.forEach((a,d)=>{r(a.eventTarget,a.type,d,a.options)})},[r]);return v.useEffect(()=>o,[o]),{addGlobalListener:t,removeGlobalListener:r,removeAllGlobalListeners:o}}function Ze(e,t){_e(()=>{if(e&&e.ref&&t)return e.ref.current=t.current,()=>{e.ref&&(e.ref.current=null)}})}function Te(e){return e.mozInputSource===0&&e.isTrusted?!0:ke()&&e.pointerType?e.type==="click"&&e.buttons===1:e.detail===0&&!e.pointerType}function et(e){return!ke()&&e.width===0&&e.height===0||e.width===1&&e.height===1&&e.pressure===0&&e.detail===0&&e.pointerType==="mouse"}let U="default",ae="",J=new WeakMap;function Ee(e){if(ye()){if(U==="default"){const t=A(e);ae=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}U="disabled"}else(e instanceof HTMLElement||e instanceof SVGElement)&&(J.set(e,e.style.userSelect),e.style.userSelect="none")}function Q(e){if(ye()){if(U!=="disabled")return;U="restoring",setTimeout(()=>{Je(()=>{if(U==="restoring"){const t=A(e);t.documentElement.style.webkitUserSelect==="none"&&(t.documentElement.style.webkitUserSelect=ae||""),ae="",U="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&J.has(e)){let t=J.get(e);e.style.userSelect==="none"&&(e.style.userSelect=t),e.getAttribute("style")===""&&e.removeAttribute("style"),J.delete(e)}}const Be=v.createContext({register:()=>{}});Be.displayName="PressResponderContext";function tt(e,t){return t.get?t.get.call(e):t.value}function $e(e,t,r){if(!t.has(e))throw new TypeError("attempted to "+r+" private field on non-instance");return t.get(e)}function nt(e,t){var r=$e(e,t,"get");return tt(e,r)}function ot(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function rt(e,t,r){ot(e,t),t.set(e,r)}function st(e,t,r){if(t.set)t.set.call(e,r);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=r}}function Pe(e,t,r){var o=$e(e,t,"set");return st(e,o,r),r}function at(e){let t=v.useContext(Be);if(t){let{register:r,...o}=t;e=j(o,e),r()}return Ze(t,e.ref),e}var Z=new WeakMap;class ee{continuePropagation(){Pe(this,Z,!1)}get shouldStopPropagation(){return nt(this,Z)}constructor(t,r,o,a){rt(this,Z,{writable:!0,value:void 0}),Pe(this,Z,!0);var d;let u=(d=a==null?void 0:a.target)!==null&&d!==void 0?d:o.currentTarget;const p=u==null?void 0:u.getBoundingClientRect();let m,h=0,b,B=null;o.clientX!=null&&o.clientY!=null&&(b=o.clientX,B=o.clientY),p&&(b!=null&&B!=null?(m=b-p.left,h=B-p.top):(m=p.width/2,h=p.height/2)),this.type=t,this.pointerType=r,this.target=o.currentTarget,this.shiftKey=o.shiftKey,this.metaKey=o.metaKey,this.ctrlKey=o.ctrlKey,this.altKey=o.altKey,this.x=m,this.y=h}}const xe=Symbol("linkClicked");function it(e){let{onPress:t,onPressChange:r,onPressStart:o,onPressEnd:a,onPressUp:d,isDisabled:u,isPressed:p,preventFocusOnPress:m,shouldCancelOnPointerExit:h,allowTextSelectionOnPress:b,ref:B,...S}=at(e),[_,$]=v.useState(!1),T=v.useRef({isPressed:!1,ignoreEmulatedMouseEvents:!1,ignoreClickAfterPress:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null}),{addGlobalListener:E,removeAllGlobalListeners:O}=Qe(),P=W((n,f)=>{let x=T.current;if(u||x.didFirePressStart)return!1;let l=!0;if(x.isTriggeringEvent=!0,o){let y=new ee("pressstart",f,n);o(y),l=y.shouldStopPropagation}return r&&r(!0),x.isTriggeringEvent=!1,x.didFirePressStart=!0,$(!0),l}),w=W((n,f,x=!0)=>{let l=T.current;if(!l.didFirePressStart)return!1;l.ignoreClickAfterPress=!0,l.didFirePressStart=!1,l.isTriggeringEvent=!0;let y=!0;if(a){let s=new ee("pressend",f,n);a(s),y=s.shouldStopPropagation}if(r&&r(!1),$(!1),t&&x&&!u){let s=new ee("press",f,n);t(s),y&&(y=s.shouldStopPropagation)}return l.isTriggeringEvent=!1,y}),C=W((n,f)=>{let x=T.current;if(u)return!1;if(d){x.isTriggeringEvent=!0;let l=new ee("pressup",f,n);return d(l),x.isTriggeringEvent=!1,l.shouldStopPropagation}return!0}),D=W(n=>{let f=T.current;f.isPressed&&f.target&&(f.isOverTarget&&f.pointerType!=null&&w(K(f.target,n),f.pointerType,!1),f.isPressed=!1,f.isOverTarget=!1,f.activePointerId=null,f.pointerType=null,O(),b||Q(f.target))}),G=W(n=>{h&&D(n)}),fe=v.useMemo(()=>{let n=T.current,f={onKeyDown(l){if(le(l.nativeEvent,l.currentTarget)&&l.currentTarget.contains(l.target)){var y;Oe(l.target,l.key)&&l.preventDefault();let s=!0;if(!n.isPressed&&!l.repeat){n.target=l.currentTarget,n.isPressed=!0,s=P(l,"keyboard");let g=l.currentTarget,i=I=>{le(I,g)&&!I.repeat&&g.contains(I.target)&&n.target&&C(K(n.target,I),"keyboard")};E(A(l.currentTarget),"keyup",ge(i,x),!0)}s&&l.stopPropagation(),l.metaKey&&z()&&((y=n.metaKeyEvents)===null||y===void 0||y.set(l.key,l.nativeEvent))}else l.key==="Meta"&&(n.metaKeyEvents=new Map)},onClick(l){if(!(l&&!l.currentTarget.contains(l.target))&&l&&l.button===0&&!n.isTriggeringEvent&&!R.isOpening){let y=!0;if(u&&l.preventDefault(),!n.ignoreClickAfterPress&&!n.ignoreEmulatedMouseEvents&&!n.isPressed&&(n.pointerType==="virtual"||Te(l.nativeEvent))){!u&&!m&&Y(l.currentTarget);let s=P(l,"virtual"),g=C(l,"virtual"),i=w(l,"virtual");y=s&&g&&i}n.ignoreEmulatedMouseEvents=!1,n.ignoreClickAfterPress=!1,y&&l.stopPropagation()}}},x=l=>{var y;if(n.isPressed&&n.target&&le(l,n.target)){var s;Oe(l.target,l.key)&&l.preventDefault();let i=l.target;w(K(n.target,l),"keyboard",n.target.contains(i)),O(),l.key!=="Enter"&&ie(n.target)&&n.target.contains(i)&&!l[xe]&&(l[xe]=!0,R(n.target,l,!1)),n.isPressed=!1,(s=n.metaKeyEvents)===null||s===void 0||s.delete(l.key)}else if(l.key==="Meta"&&(!((y=n.metaKeyEvents)===null||y===void 0)&&y.size)){var g;let i=n.metaKeyEvents;n.metaKeyEvents=void 0;for(let I of i.values())(g=n.target)===null||g===void 0||g.dispatchEvent(new KeyboardEvent("keyup",I))}};if(typeof PointerEvent<"u"){f.onPointerDown=i=>{if(i.button!==0||!i.currentTarget.contains(i.target))return;if(et(i.nativeEvent)){n.pointerType="virtual";return}ue(i.currentTarget)&&i.preventDefault(),n.pointerType=i.pointerType;let I=!0;n.isPressed||(n.isPressed=!0,n.isOverTarget=!0,n.activePointerId=i.pointerId,n.target=i.currentTarget,!u&&!m&&Y(i.currentTarget),b||Ee(n.target),I=P(i,n.pointerType),E(A(i.currentTarget),"pointermove",l,!1),E(A(i.currentTarget),"pointerup",y,!1),E(A(i.currentTarget),"pointercancel",g,!1)),I&&i.stopPropagation()},f.onMouseDown=i=>{i.currentTarget.contains(i.target)&&i.button===0&&(ue(i.currentTarget)&&i.preventDefault(),i.stopPropagation())},f.onPointerUp=i=>{!i.currentTarget.contains(i.target)||n.pointerType==="virtual"||i.button===0&&H(i,i.currentTarget)&&C(i,n.pointerType||i.pointerType)};let l=i=>{i.pointerId===n.activePointerId&&(n.target&&H(i,n.target)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,P(K(n.target,i),n.pointerType)):n.target&&n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,w(K(n.target,i),n.pointerType,!1),G(i)))},y=i=>{i.pointerId===n.activePointerId&&n.isPressed&&i.button===0&&n.target&&(H(i,n.target)&&n.pointerType!=null?w(K(n.target,i),n.pointerType):n.isOverTarget&&n.pointerType!=null&&w(K(n.target,i),n.pointerType,!1),n.isPressed=!1,n.isOverTarget=!1,n.activePointerId=null,n.pointerType=null,O(),b||Q(n.target),"ontouchend"in n.target&&i.pointerType!=="mouse"&&E(n.target,"touchend",s,{once:!0}))},s=i=>{Ne(i.target)&&i.preventDefault()},g=i=>{D(i)};f.onDragStart=i=>{i.currentTarget.contains(i.target)&&D(i)}}else{f.onMouseDown=s=>{if(s.button!==0||!s.currentTarget.contains(s.target))return;if(ue(s.currentTarget)&&s.preventDefault(),n.ignoreEmulatedMouseEvents){s.stopPropagation();return}n.isPressed=!0,n.isOverTarget=!0,n.target=s.currentTarget,n.pointerType=Te(s.nativeEvent)?"virtual":"mouse",!u&&!m&&Y(s.currentTarget),P(s,n.pointerType)&&s.stopPropagation(),E(A(s.currentTarget),"mouseup",l,!1)},f.onMouseEnter=s=>{if(!s.currentTarget.contains(s.target))return;let g=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!0,g=P(s,n.pointerType)),g&&s.stopPropagation()},f.onMouseLeave=s=>{if(!s.currentTarget.contains(s.target))return;let g=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!1,g=w(s,n.pointerType,!1),G(s)),g&&s.stopPropagation()},f.onMouseUp=s=>{s.currentTarget.contains(s.target)&&!n.ignoreEmulatedMouseEvents&&s.button===0&&C(s,n.pointerType||"mouse")};let l=s=>{if(s.button===0){if(n.isPressed=!1,O(),n.ignoreEmulatedMouseEvents){n.ignoreEmulatedMouseEvents=!1;return}n.target&&H(s,n.target)&&n.pointerType!=null?w(K(n.target,s),n.pointerType):n.target&&n.isOverTarget&&n.pointerType!=null&&w(K(n.target,s),n.pointerType,!1),n.isOverTarget=!1}};f.onTouchStart=s=>{if(!s.currentTarget.contains(s.target))return;let g=lt(s.nativeEvent);if(!g)return;n.activePointerId=g.identifier,n.ignoreEmulatedMouseEvents=!0,n.isOverTarget=!0,n.isPressed=!0,n.target=s.currentTarget,n.pointerType="touch",!u&&!m&&Y(s.currentTarget),b||Ee(n.target),P(M(n.target,s),n.pointerType)&&s.stopPropagation(),E(oe(s.currentTarget),"scroll",y,!0)},f.onTouchMove=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let g=Se(s.nativeEvent,n.activePointerId),i=!0;g&&H(g,s.currentTarget)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,i=P(M(n.target,s),n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,i=w(M(n.target,s),n.pointerType,!1),G(M(n.target,s))),i&&s.stopPropagation()},f.onTouchEnd=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let g=Se(s.nativeEvent,n.activePointerId),i=!0;g&&H(g,s.currentTarget)&&n.pointerType!=null?(C(M(n.target,s),n.pointerType),i=w(M(n.target,s),n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(i=w(M(n.target,s),n.pointerType,!1)),i&&s.stopPropagation(),n.isPressed=!1,n.activePointerId=null,n.isOverTarget=!1,n.ignoreEmulatedMouseEvents=!0,n.target&&!b&&Q(n.target),O()},f.onTouchCancel=s=>{s.currentTarget.contains(s.target)&&(s.stopPropagation(),n.isPressed&&D(M(n.target,s)))};let y=s=>{n.isPressed&&s.target.contains(n.target)&&D({currentTarget:n.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};f.onDragStart=s=>{s.currentTarget.contains(s.target)&&D(s)}}return f},[E,u,m,O,b,D,G,w,P,C]);return v.useEffect(()=>()=>{var n;b||Q((n=T.current.target)!==null&&n!==void 0?n:void 0)},[b]),{isPressed:p||_,pressProps:j(S,fe)}}function ie(e){return e.tagName==="A"&&e.hasAttribute("href")}function le(e,t){const{key:r,code:o}=e,a=t,d=a.getAttribute("role");return(r==="Enter"||r===" "||r==="Spacebar"||o==="Space")&&!(a instanceof oe(a).HTMLInputElement&&!De(a,r)||a instanceof oe(a).HTMLTextAreaElement||a.isContentEditable)&&!((d==="link"||!d&&ie(a))&&r!=="Enter")}function lt(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}function Se(e,t){const r=e.changedTouches;for(let o=0;o<r.length;o++){const a=r[o];if(a.identifier===t)return a}return null}function M(e,t){let r=0,o=0;return t.targetTouches&&t.targetTouches.length===1&&(r=t.targetTouches[0].clientX,o=t.targetTouches[0].clientY),{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:o}}function K(e,t){let r=t.clientX,o=t.clientY;return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:o}}function ut(e){let t=0,r=0;return e.width!==void 0?t=e.width/2:e.radiusX!==void 0&&(t=e.radiusX),e.height!==void 0?r=e.height/2:e.radiusY!==void 0&&(r=e.radiusY),{top:e.clientY-r,right:e.clientX+t,bottom:e.clientY+r,left:e.clientX-t}}function ct(e,t){return!(e.left>t.right||t.left>e.right||e.top>t.bottom||t.top>e.bottom)}function H(e,t){let r=t.getBoundingClientRect(),o=ut(e);return ct(r,o)}function ue(e){return!(e instanceof HTMLElement)||!e.hasAttribute("draggable")}function Ne(e){return e instanceof HTMLInputElement?!1:e instanceof HTMLButtonElement?e.type!=="submit"&&e.type!=="reset":!ie(e)}function Oe(e,t){return e instanceof HTMLInputElement?!De(e,t):Ne(e)}const dt=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function De(e,t){return e.type==="checkbox"||e.type==="radio"?t===" ":dt.has(e.type)}let te=!1,ce=0;function de(){te=!0,setTimeout(()=>{te=!1},50)}function Ce(e){e.pointerType==="touch"&&de()}function pt(){if(!(typeof document>"u"))return typeof PointerEvent<"u"?document.addEventListener("pointerup",Ce):document.addEventListener("touchend",de),ce++,()=>{ce--,!(ce>0)&&(typeof PointerEvent<"u"?document.removeEventListener("pointerup",Ce):document.removeEventListener("touchend",de))}}function ft(e){let{onHoverStart:t,onHoverChange:r,onHoverEnd:o,isDisabled:a}=e,[d,u]=v.useState(!1),p=v.useRef({isHovered:!1,ignoreEmulatedMouseEvents:!1,pointerType:"",target:null}).current;v.useEffect(pt,[]);let{hoverProps:m,triggerHoverEnd:h}=v.useMemo(()=>{let b=(_,$)=>{if(p.pointerType=$,a||$==="touch"||p.isHovered||!_.currentTarget.contains(_.target))return;p.isHovered=!0;let T=_.currentTarget;p.target=T,t&&t({type:"hoverstart",target:T,pointerType:$}),r&&r(!0),u(!0)},B=(_,$)=>{if(p.pointerType="",p.target=null,$==="touch"||!p.isHovered)return;p.isHovered=!1;let T=_.currentTarget;o&&o({type:"hoverend",target:T,pointerType:$}),r&&r(!1),u(!1)},S={};return typeof PointerEvent<"u"?(S.onPointerEnter=_=>{te&&_.pointerType==="mouse"||b(_,_.pointerType)},S.onPointerLeave=_=>{!a&&_.currentTarget.contains(_.target)&&B(_,_.pointerType)}):(S.onTouchStart=()=>{p.ignoreEmulatedMouseEvents=!0},S.onMouseEnter=_=>{!p.ignoreEmulatedMouseEvents&&!te&&b(_,"mouse"),p.ignoreEmulatedMouseEvents=!1},S.onMouseLeave=_=>{!a&&_.currentTarget.contains(_.target)&&B(_,"mouse")}),{hoverProps:S,triggerHoverEnd:B}},[t,r,o,a,p]);return v.useEffect(()=>{a&&h({currentTarget:p.target},p.pointerType)},[a]),{hoverProps:m,isHovered:d}}function mt(e,t){let{elementType:r="button",isDisabled:o,onPress:a,onPressStart:d,onPressEnd:u,onPressUp:p,onPressChange:m,preventFocusOnPress:h,allowFocusWhenDisabled:b,onClick:B,href:S,target:_,rel:$,type:T="button"}=e,E;r==="button"?E={type:T,disabled:o}:E={role:"button",tabIndex:o?void 0:0,href:r==="a"&&o?void 0:S,target:r==="a"?_:void 0,type:r==="input"?T:void 0,disabled:r==="input"?o:void 0,"aria-disabled":!o||r==="input"?void 0:o,rel:r==="a"?$:void 0};let{pressProps:O,isPressed:P}=it({onPressStart:d,onPressEnd:u,onPressChange:m,onPress:a,onPressUp:p,isDisabled:o,preventFocusOnPress:h,ref:t}),{focusableProps:w}=me.useFocusable(e,t);b&&(w.tabIndex=o?-1:w.tabIndex);let C=j(w,O,Ve(e,{labelable:!0}));return{isPressed:P,buttonProps:j(E,C,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],onClick:D=>{B&&(B(D),console.warn("onClick is deprecated, please use onPress"))}})}}function _t(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Ke(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(a){return Object.getOwnPropertyDescriptor(e,a).enumerable})),r.push.apply(r,o)}return r}function Ie(e){for(var t=1;t<arguments.length;t++){var r=arguments[t]!=null?arguments[t]:{};t%2?Ke(Object(r),!0).forEach(function(o){_t(e,o,r[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):Ke(Object(r)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(r,o))})}return e}var bt=(e,t,r)=>{for(var o of Object.keys(e)){var a;if(e[o]!==((a=t[o])!==null&&a!==void 0?a:r[o]))return!1}return!0},ne=e=>t=>{var r=e.defaultClassName,o=Ie(Ie({},e.defaultVariants),t);for(var a in o){var d,u=(d=o[a])!==null&&d!==void 0?d:e.defaultVariants[a];if(u!=null){var p=u;typeof p=="boolean"&&(p=p===!0?"true":"false");var m=e.variantClassNames[a][p];m&&(r+=" "+m)}}for(var[h,b]of e.compoundVariants)bt(h,o,e.defaultVariants)&&(r+=" "+b);return r},gt=ne({defaultClassName:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy0",variantClassNames:{disabled:{true:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy1",false:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy2"},kind:{default:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy3",link:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy4",confirm:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy5",delete:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy6",key:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy7",icon:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy8"},spinning:{true:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy9",false:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxya"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[[{kind:"icon",spinning:!0},"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyb"],[{kind:"default",spinning:!0},"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyc"],[{kind:"confirm",spinning:!0},"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyd"],[{kind:"delete",spinning:!0},"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxye"],[{kind:"key",spinning:!0},"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyf"],[{disabled:!0,spinning:!1},"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyg"]]}),vt=ne({defaultClassName:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyh",variantClassNames:{disabled:{true:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyi",false:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyj"},kind:{icon:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyk",default:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyl",delete:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxym",key:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyn",confirm:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyo",link:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyp"},spinning:{true:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyq",false:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyr"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[]}),ht="pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy11",yt=ne({defaultClassName:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy12",variantClassNames:{spinning:{true:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy13",false:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy14"}},defaultVariants:{spinning:!1},compoundVariants:[]}),kt=ne({defaultClassName:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxys",variantClassNames:{spinning:{true:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyt",false:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyu"},kind:{icon:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyv",default:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyw",delete:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyx",key:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyy",confirm:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyz",link:"pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy10"}},defaultVariants:{spinning:!1},compoundVariants:[]});const pe=c.forwardRef(({as:e,onClick:t,onPress:r,children:o,className:a,isDisabled:d,disabled:u,href:p,icon:m,kind:h="default",spinning:b,spinningTitle:B,title:S,..._},$)=>{const T=e??(p?"a":"button"),E={onPress:r??t,isDisabled:u??d??b,..._},{"data-testid":O}=_,P=c.useRef(null),w=$||P,{buttonProps:C}=mt(E,w),{hoverProps:D}=ft({isDisabled:E.isDisabled}),{type:G,...fe}=C,n={...j(fe,D),ref:w,title:S,className:p?kt({spinning:b,kind:h}):vt({disabled:d||u,kind:h,spinning:b}),...p?{href:p}:{type:G},..._},{t:f}=c.useContext(V.I18nContext),x=m&&c.createElement(V.Icon,{className:ht,icon:m,"aria-hidden":"true","data-testid":`${O}__${m}-icon`});let l;h==="default"||h==="icon"||h==="link"?l="dark":l="light";const y=b&&c.createElement(V.Spinner,{color:l,className:yt({spinning:b}),title:B||f("design-system:button.spinningTitle"),"data-testid":`${O}__spinner`});return c.createElement(me.FocusRing,null,c.createElement("div",{className:V.cl(gt({disabled:d||u,kind:h,spinning:b}),a)},c.createElement(T,{...n},x,o?c.createElement("span",null,o):"",y)))});V.Metadata.set(pe,{name:"Button",props:{disabled:"boolean",href:"string",icon:"IconName",kind:{type:'"default" | "link" | "icon" | "confirm" | "delete" | "key"',default:'"default"'},spinning:"boolean",spinningTitle:"string",type:{type:'"button" | "submit"',default:'"button"'},as:"button | a",onClick:"() => void",onPress:"() => void",children:"ReactNode",className:"string",isDisabled:"boolean",style:"CSSProperties"},panellable:!0});const wt={Buttons:{components:[pe],description:()=>c.createElement(c.Fragment,null,c.createElement("div",{className:"sps-body-14"},"Buttons are used to initiate events or actions. The labels and/or icons describe what the button will do."),c.createElement("br",null),c.createElement("h5",null,"Variants"),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Default: "),"For tertiary actions or actions of lower importance on a page."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Key: "),"For primary or important actions on a page."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Confirm: "),"For the main call to action on a page. There should only be one Confirm button per screen."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Delete: "),"For deleting information or another destructive action. These should always be paired with a Delete Confirmation Modal."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Disabled: "),"For actions that are not permitted in a particular state. These can be accompanied by a Tooltip on hover describing why it’s disabled."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"With an Icon: "),"For further illustrating the action. Example: Pencil icon in an Edit button. There can also be Icon Buttons without text.")),examples:{basic:{label:"Basic Buttons",description:({NavigateTo:e})=>c.createElement(c.Fragment,null,c.createElement("p",null,"The most common type of button that can be used in most cases. Example: Basic Buttons in a ",c.createElement(e,{to:"modals"},"Modal"),".")),examples:{withoutIcons:{description:"Without Icons",react:k.code`
1
+ (function(N,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react"),require("@sps-woodland/core"),require("@react-aria/focus"),require("@spscommerce/utils")):typeof define=="function"&&define.amd?define(["exports","react","@sps-woodland/core","@react-aria/focus","@spscommerce/utils"],g):(N=typeof globalThis<"u"?globalThis:N||self,g(N.Buttons={},N.React,N.core,N.focus,N.utils))})(this,function(N,g,G,me,y){"use strict";function Le(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const c=Le(g),_e=typeof document<"u"?g.useLayoutEffect:()=>{};function V(e){const t=g.useRef(null);return _e(()=>{t.current=e},[e]),g.useCallback((...r)=>{const o=t.current;return o==null?void 0:o(...r)},[])}let be=new Map;function Ae(e,t){if(e===t)return e;let r=be.get(e);if(r)return r.forEach(a=>a(t)),t;let o=be.get(t);return o?(o.forEach(a=>a(e)),e):t}function ge(...e){return(...t)=>{for(let r of e)typeof r=="function"&&r(...t)}}const M=e=>{var t;return(t=e==null?void 0:e.ownerDocument)!==null&&t!==void 0?t:document},ne=e=>e&&"window"in e&&e.window===e?e:M(e).defaultView||window;function he(e){var t,r,o="";if(typeof e=="string"||typeof e=="number")o+=e;else if(typeof e=="object")if(Array.isArray(e)){var a=e.length;for(t=0;t<a;t++)e[t]&&(r=he(e[t]))&&(o&&(o+=" "),o+=r)}else for(r in e)e[r]&&(o&&(o+=" "),o+=r);return o}function Me(){for(var e,t,r=0,o="",a=arguments.length;r<a;r++)(e=arguments[r])&&(t=he(e))&&(o&&(o+=" "),o+=t);return o}function W(...e){let t={...e[0]};for(let r=1;r<e.length;r++){let o=e[r];for(let a in o){let d=t[a],u=o[a];typeof d=="function"&&typeof u=="function"&&a[0]==="o"&&a[1]==="n"&&a.charCodeAt(2)>=65&&a.charCodeAt(2)<=90?t[a]=ge(d,u):(a==="className"||a==="UNSAFE_className")&&typeof d=="string"&&typeof u=="string"?t[a]=Me(d,u):a==="id"&&d&&u?t.id=Ae(d,u):t[a]=u!==void 0?u:d}}return t}const Fe=new Set(["id"]),Ue=new Set(["aria-label","aria-labelledby","aria-describedby","aria-details"]),He=new Set(["href","hrefLang","target","rel","download","ping","referrerPolicy"]),Ge=/^(data-.*)$/;function Ve(e,t={}){let{labelable:r,isLink:o,propNames:a}=t,d={};for(const u in e)Object.prototype.hasOwnProperty.call(e,u)&&(Fe.has(u)||r&&Ue.has(u)||o&&He.has(u)||a!=null&&a.has(u)||Ge.test(u))&&(d[u]=e[u]);return d}function j(e){if(We())e.focus({preventScroll:!0});else{let t=je(e);e.focus(),Ye(t)}}let R=null;function We(){if(R==null){R=!1;try{document.createElement("div").focus({get preventScroll(){return R=!0,!0}})}catch{}}return R}function je(e){let t=e.parentNode,r=[],o=document.scrollingElement||document.documentElement;for(;t instanceof HTMLElement&&t!==o;)(t.offsetHeight<t.scrollHeight||t.offsetWidth<t.scrollWidth)&&r.push({element:t,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft}),t=t.parentNode;return o instanceof HTMLElement&&r.push({element:o,scrollTop:o.scrollTop,scrollLeft:o.scrollLeft}),r}function Ye(e){for(let{element:t,scrollTop:r,scrollLeft:o}of e)t.scrollTop=r,t.scrollLeft=o}function X(e){var t;return typeof window>"u"||window.navigator==null?!1:((t=window.navigator.userAgentData)===null||t===void 0?void 0:t.brands.some(r=>e.test(r.brand)))||e.test(window.navigator.userAgent)}function oe(e){var t;return typeof window<"u"&&window.navigator!=null?e.test(((t=window.navigator.userAgentData)===null||t===void 0?void 0:t.platform)||window.navigator.platform):!1}function L(e){let t=null;return()=>(t==null&&(t=e()),t)}const q=L(function(){return oe(/^Mac/i)}),Re=L(function(){return oe(/^iPhone/i)}),ve=L(function(){return oe(/^iPad/i)||q()&&navigator.maxTouchPoints>1}),ye=L(function(){return Re()||ve()}),Xe=L(function(){return X(/AppleWebKit/i)&&!qe()}),qe=L(function(){return X(/Chrome/i)}),ke=L(function(){return X(/Android/i)}),ze=L(function(){return X(/Firefox/i)});function Y(e,t,r=!0){var o,a;let{metaKey:d,ctrlKey:u,altKey:p,shiftKey:m}=t;ze()&&(!((a=window.event)===null||a===void 0||(o=a.type)===null||o===void 0)&&o.startsWith("key"))&&e.target==="_blank"&&(q()?d=!0:u=!0);let h=Xe()&&q()&&!ve()?new KeyboardEvent("keydown",{keyIdentifier:"Enter",metaKey:d,ctrlKey:u,altKey:p,shiftKey:m}):new MouseEvent("click",{metaKey:d,ctrlKey:u,altKey:p,shiftKey:m,bubbles:!0,cancelable:!0});Y.isOpening=r,j(e),e.dispatchEvent(h),Y.isOpening=!1}Y.isOpening=!1;let F=new Map,re=new Set;function we(){if(typeof window>"u")return;function e(o){return"propertyName"in o}let t=o=>{if(!e(o)||!o.target)return;let a=F.get(o.target);a||(a=new Set,F.set(o.target,a),o.target.addEventListener("transitioncancel",r,{once:!0})),a.add(o.propertyName)},r=o=>{if(!e(o)||!o.target)return;let a=F.get(o.target);if(a&&(a.delete(o.propertyName),a.size===0&&(o.target.removeEventListener("transitioncancel",r),F.delete(o.target)),F.size===0)){for(let d of re)d();re.clear()}};document.body.addEventListener("transitionrun",t),document.body.addEventListener("transitionend",r)}typeof document<"u"&&(document.readyState!=="loading"?we():document.addEventListener("DOMContentLoaded",we));function Je(e){requestAnimationFrame(()=>{F.size===0?e():re.add(e)})}function Qe(){let e=g.useRef(new Map),t=g.useCallback((a,d,u,p)=>{let m=p!=null&&p.once?(...h)=>{e.current.delete(u),u(...h)}:u;e.current.set(u,{type:d,eventTarget:a,fn:m,options:p}),a.addEventListener(d,m,p)},[]),r=g.useCallback((a,d,u,p)=>{var m;let h=((m=e.current.get(u))===null||m===void 0?void 0:m.fn)||u;a.removeEventListener(d,h,p),e.current.delete(u)},[]),o=g.useCallback(()=>{e.current.forEach((a,d)=>{r(a.eventTarget,a.type,d,a.options)})},[r]);return g.useEffect(()=>o,[o]),{addGlobalListener:t,removeGlobalListener:r,removeAllGlobalListeners:o}}function Ze(e,t){_e(()=>{if(e&&e.ref&&t)return e.ref.current=t.current,()=>{e.ref&&(e.ref.current=null)}})}function Te(e){return e.mozInputSource===0&&e.isTrusted?!0:ke()&&e.pointerType?e.type==="click"&&e.buttons===1:e.detail===0&&!e.pointerType}function et(e){return!ke()&&e.width===0&&e.height===0||e.width===1&&e.height===1&&e.pressure===0&&e.detail===0&&e.pointerType==="mouse"}let U="default",se="",z=new WeakMap;function Ee(e){if(ye()){if(U==="default"){const t=M(e);se=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}U="disabled"}else(e instanceof HTMLElement||e instanceof SVGElement)&&(z.set(e,e.style.userSelect),e.style.userSelect="none")}function J(e){if(ye()){if(U!=="disabled")return;U="restoring",setTimeout(()=>{Je(()=>{if(U==="restoring"){const t=M(e);t.documentElement.style.webkitUserSelect==="none"&&(t.documentElement.style.webkitUserSelect=se||""),se="",U="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&z.has(e)){let t=z.get(e);e.style.userSelect==="none"&&(e.style.userSelect=t),e.getAttribute("style")===""&&e.removeAttribute("style"),z.delete(e)}}const Be=g.createContext({register:()=>{}});Be.displayName="PressResponderContext";function tt(e,t){return t.get?t.get.call(e):t.value}function $e(e,t,r){if(!t.has(e))throw new TypeError("attempted to "+r+" private field on non-instance");return t.get(e)}function nt(e,t){var r=$e(e,t,"get");return tt(e,r)}function ot(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function rt(e,t,r){ot(e,t),t.set(e,r)}function st(e,t,r){if(t.set)t.set.call(e,r);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=r}}function Pe(e,t,r){var o=$e(e,t,"set");return st(e,o,r),r}function at(e){let t=g.useContext(Be);if(t){let{register:r,...o}=t;e=W(o,e),r()}return Ze(t,e.ref),e}var Q=new WeakMap;class Z{continuePropagation(){Pe(this,Q,!1)}get shouldStopPropagation(){return nt(this,Q)}constructor(t,r,o,a){rt(this,Q,{writable:!0,value:void 0}),Pe(this,Q,!0);var d;let u=(d=a==null?void 0:a.target)!==null&&d!==void 0?d:o.currentTarget;const p=u==null?void 0:u.getBoundingClientRect();let m,h=0,b,B=null;o.clientX!=null&&o.clientY!=null&&(b=o.clientX,B=o.clientY),p&&(b!=null&&B!=null?(m=b-p.left,h=B-p.top):(m=p.width/2,h=p.height/2)),this.type=t,this.pointerType=r,this.target=o.currentTarget,this.shiftKey=o.shiftKey,this.metaKey=o.metaKey,this.ctrlKey=o.ctrlKey,this.altKey=o.altKey,this.x=m,this.y=h}}const xe=Symbol("linkClicked");function it(e){let{onPress:t,onPressChange:r,onPressStart:o,onPressEnd:a,onPressUp:d,isDisabled:u,isPressed:p,preventFocusOnPress:m,shouldCancelOnPointerExit:h,allowTextSelectionOnPress:b,ref:B,...S}=at(e),[_,$]=g.useState(!1),T=g.useRef({isPressed:!1,ignoreEmulatedMouseEvents:!1,ignoreClickAfterPress:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null}),{addGlobalListener:E,removeAllGlobalListeners:O}=Qe(),P=V((n,f)=>{let x=T.current;if(u||x.didFirePressStart)return!1;let l=!0;if(x.isTriggeringEvent=!0,o){let v=new Z("pressstart",f,n);o(v),l=v.shouldStopPropagation}return r&&r(!0),x.isTriggeringEvent=!1,x.didFirePressStart=!0,$(!0),l}),k=V((n,f,x=!0)=>{let l=T.current;if(!l.didFirePressStart)return!1;l.ignoreClickAfterPress=!0,l.didFirePressStart=!1,l.isTriggeringEvent=!0;let v=!0;if(a){let s=new Z("pressend",f,n);a(s),v=s.shouldStopPropagation}if(r&&r(!1),$(!1),t&&x&&!u){let s=new Z("press",f,n);t(s),v&&(v=s.shouldStopPropagation)}return l.isTriggeringEvent=!1,v}),C=V((n,f)=>{let x=T.current;if(u)return!1;if(d){x.isTriggeringEvent=!0;let l=new Z("pressup",f,n);return d(l),x.isTriggeringEvent=!1,l.shouldStopPropagation}return!0}),D=V(n=>{let f=T.current;f.isPressed&&f.target&&(f.isOverTarget&&f.pointerType!=null&&k(I(f.target,n),f.pointerType,!1),f.isPressed=!1,f.isOverTarget=!1,f.activePointerId=null,f.pointerType=null,O(),b||J(f.target))}),H=V(n=>{h&&D(n)}),fe=g.useMemo(()=>{let n=T.current,f={onKeyDown(l){if(ie(l.nativeEvent,l.currentTarget)&&l.currentTarget.contains(l.target)){var v;Oe(l.target,l.key)&&l.preventDefault();let s=!0;if(!n.isPressed&&!l.repeat){n.target=l.currentTarget,n.isPressed=!0,s=P(l,"keyboard");let i=l.currentTarget,w=K=>{ie(K,i)&&!K.repeat&&i.contains(K.target)&&n.target&&C(I(n.target,K),"keyboard")};E(M(l.currentTarget),"keyup",ge(w,x),!0)}s&&l.stopPropagation(),l.metaKey&&q()&&((v=n.metaKeyEvents)===null||v===void 0||v.set(l.key,l.nativeEvent))}else l.key==="Meta"&&(n.metaKeyEvents=new Map)},onClick(l){if(!(l&&!l.currentTarget.contains(l.target))&&l&&l.button===0&&!n.isTriggeringEvent&&!Y.isOpening){let v=!0;if(u&&l.preventDefault(),!n.ignoreClickAfterPress&&!n.ignoreEmulatedMouseEvents&&!n.isPressed&&(n.pointerType==="virtual"||Te(l.nativeEvent))){!u&&!m&&j(l.currentTarget);let s=P(l,"virtual"),i=C(l,"virtual"),w=k(l,"virtual");v=s&&i&&w}n.ignoreEmulatedMouseEvents=!1,n.ignoreClickAfterPress=!1,v&&l.stopPropagation()}}},x=l=>{var v;if(n.isPressed&&n.target&&ie(l,n.target)){var s;Oe(l.target,l.key)&&l.preventDefault();let w=l.target;k(I(n.target,l),"keyboard",n.target.contains(w)),O(),l.key!=="Enter"&&ae(n.target)&&n.target.contains(w)&&!l[xe]&&(l[xe]=!0,Y(n.target,l,!1)),n.isPressed=!1,(s=n.metaKeyEvents)===null||s===void 0||s.delete(l.key)}else if(l.key==="Meta"&&(!((v=n.metaKeyEvents)===null||v===void 0)&&v.size)){var i;let w=n.metaKeyEvents;n.metaKeyEvents=void 0;for(let K of w.values())(i=n.target)===null||i===void 0||i.dispatchEvent(new KeyboardEvent("keyup",K))}};if(typeof PointerEvent<"u"){f.onPointerDown=i=>{if(i.button!==0||!i.currentTarget.contains(i.target))return;if(et(i.nativeEvent)){n.pointerType="virtual";return}ue(i.currentTarget)&&i.preventDefault(),n.pointerType=i.pointerType;let w=!0;if(!n.isPressed){n.isPressed=!0,n.isOverTarget=!0,n.activePointerId=i.pointerId,n.target=i.currentTarget,!u&&!m&&j(i.currentTarget),b||Ee(n.target),w=P(i,n.pointerType);let K=i.target;"releasePointerCapture"in K&&K.releasePointerCapture(i.pointerId),E(M(i.currentTarget),"pointerup",l,!1),E(M(i.currentTarget),"pointercancel",s,!1)}w&&i.stopPropagation()},f.onMouseDown=i=>{i.currentTarget.contains(i.target)&&i.button===0&&(ue(i.currentTarget)&&i.preventDefault(),i.stopPropagation())},f.onPointerUp=i=>{!i.currentTarget.contains(i.target)||n.pointerType==="virtual"||i.button===0&&C(i,n.pointerType||i.pointerType)},f.onPointerEnter=i=>{i.pointerId===n.activePointerId&&n.target&&!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,P(I(n.target,i),n.pointerType))},f.onPointerLeave=i=>{i.pointerId===n.activePointerId&&n.target&&n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,k(I(n.target,i),n.pointerType,!1),H(i))};let l=i=>{i.pointerId===n.activePointerId&&n.isPressed&&i.button===0&&n.target&&(n.target.contains(i.target)&&n.pointerType!=null?k(I(n.target,i),n.pointerType):n.isOverTarget&&n.pointerType!=null&&k(I(n.target,i),n.pointerType,!1),n.isPressed=!1,n.isOverTarget=!1,n.activePointerId=null,n.pointerType=null,O(),b||J(n.target),"ontouchend"in n.target&&i.pointerType!=="mouse"&&E(n.target,"touchend",v,{once:!0}))},v=i=>{Ne(i.currentTarget)&&i.preventDefault()},s=i=>{D(i)};f.onDragStart=i=>{i.currentTarget.contains(i.target)&&D(i)}}else{f.onMouseDown=s=>{if(s.button!==0||!s.currentTarget.contains(s.target))return;if(ue(s.currentTarget)&&s.preventDefault(),n.ignoreEmulatedMouseEvents){s.stopPropagation();return}n.isPressed=!0,n.isOverTarget=!0,n.target=s.currentTarget,n.pointerType=Te(s.nativeEvent)?"virtual":"mouse",!u&&!m&&j(s.currentTarget),P(s,n.pointerType)&&s.stopPropagation(),E(M(s.currentTarget),"mouseup",l,!1)},f.onMouseEnter=s=>{if(!s.currentTarget.contains(s.target))return;let i=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!0,i=P(s,n.pointerType)),i&&s.stopPropagation()},f.onMouseLeave=s=>{if(!s.currentTarget.contains(s.target))return;let i=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!1,i=k(s,n.pointerType,!1),H(s)),i&&s.stopPropagation()},f.onMouseUp=s=>{s.currentTarget.contains(s.target)&&!n.ignoreEmulatedMouseEvents&&s.button===0&&C(s,n.pointerType||"mouse")};let l=s=>{if(s.button===0){if(n.isPressed=!1,O(),n.ignoreEmulatedMouseEvents){n.ignoreEmulatedMouseEvents=!1;return}n.target&&le(s,n.target)&&n.pointerType!=null?k(I(n.target,s),n.pointerType):n.target&&n.isOverTarget&&n.pointerType!=null&&k(I(n.target,s),n.pointerType,!1),n.isOverTarget=!1}};f.onTouchStart=s=>{if(!s.currentTarget.contains(s.target))return;let i=lt(s.nativeEvent);if(!i)return;n.activePointerId=i.identifier,n.ignoreEmulatedMouseEvents=!0,n.isOverTarget=!0,n.isPressed=!0,n.target=s.currentTarget,n.pointerType="touch",!u&&!m&&j(s.currentTarget),b||Ee(n.target),P(A(n.target,s),n.pointerType)&&s.stopPropagation(),E(ne(s.currentTarget),"scroll",v,!0)},f.onTouchMove=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let i=Se(s.nativeEvent,n.activePointerId),w=!0;i&&le(i,s.currentTarget)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,w=P(A(n.target,s),n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,w=k(A(n.target,s),n.pointerType,!1),H(A(n.target,s))),w&&s.stopPropagation()},f.onTouchEnd=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let i=Se(s.nativeEvent,n.activePointerId),w=!0;i&&le(i,s.currentTarget)&&n.pointerType!=null?(C(A(n.target,s),n.pointerType),w=k(A(n.target,s),n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(w=k(A(n.target,s),n.pointerType,!1)),w&&s.stopPropagation(),n.isPressed=!1,n.activePointerId=null,n.isOverTarget=!1,n.ignoreEmulatedMouseEvents=!0,n.target&&!b&&J(n.target),O()},f.onTouchCancel=s=>{s.currentTarget.contains(s.target)&&(s.stopPropagation(),n.isPressed&&D(A(n.target,s)))};let v=s=>{n.isPressed&&s.target.contains(n.target)&&D({currentTarget:n.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};f.onDragStart=s=>{s.currentTarget.contains(s.target)&&D(s)}}return f},[E,u,m,O,b,D,H,k,P,C]);return g.useEffect(()=>()=>{var n;b||J((n=T.current.target)!==null&&n!==void 0?n:void 0)},[b]),{isPressed:p||_,pressProps:W(S,fe)}}function ae(e){return e.tagName==="A"&&e.hasAttribute("href")}function ie(e,t){const{key:r,code:o}=e,a=t,d=a.getAttribute("role");return(r==="Enter"||r===" "||r==="Spacebar"||o==="Space")&&!(a instanceof ne(a).HTMLInputElement&&!De(a,r)||a instanceof ne(a).HTMLTextAreaElement||a.isContentEditable)&&!((d==="link"||!d&&ae(a))&&r!=="Enter")}function lt(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}function Se(e,t){const r=e.changedTouches;for(let o=0;o<r.length;o++){const a=r[o];if(a.identifier===t)return a}return null}function A(e,t){let r=0,o=0;return t.targetTouches&&t.targetTouches.length===1&&(r=t.targetTouches[0].clientX,o=t.targetTouches[0].clientY),{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:o}}function I(e,t){let r=t.clientX,o=t.clientY;return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:o}}function ut(e){let t=0,r=0;return e.width!==void 0?t=e.width/2:e.radiusX!==void 0&&(t=e.radiusX),e.height!==void 0?r=e.height/2:e.radiusY!==void 0&&(r=e.radiusY),{top:e.clientY-r,right:e.clientX+t,bottom:e.clientY+r,left:e.clientX-t}}function ct(e,t){return!(e.left>t.right||t.left>e.right||e.top>t.bottom||t.top>e.bottom)}function le(e,t){let r=t.getBoundingClientRect(),o=ut(e);return ct(r,o)}function ue(e){return!(e instanceof HTMLElement)||!e.hasAttribute("draggable")}function Ne(e){return e instanceof HTMLInputElement?!1:e instanceof HTMLButtonElement?e.type!=="submit"&&e.type!=="reset":!ae(e)}function Oe(e,t){return e instanceof HTMLInputElement?!De(e,t):Ne(e)}const dt=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function De(e,t){return e.type==="checkbox"||e.type==="radio"?t===" ":dt.has(e.type)}let ee=!1,ce=0;function de(){ee=!0,setTimeout(()=>{ee=!1},50)}function Ce(e){e.pointerType==="touch"&&de()}function pt(){if(!(typeof document>"u"))return typeof PointerEvent<"u"?document.addEventListener("pointerup",Ce):document.addEventListener("touchend",de),ce++,()=>{ce--,!(ce>0)&&(typeof PointerEvent<"u"?document.removeEventListener("pointerup",Ce):document.removeEventListener("touchend",de))}}function ft(e){let{onHoverStart:t,onHoverChange:r,onHoverEnd:o,isDisabled:a}=e,[d,u]=g.useState(!1),p=g.useRef({isHovered:!1,ignoreEmulatedMouseEvents:!1,pointerType:"",target:null}).current;g.useEffect(pt,[]);let{hoverProps:m,triggerHoverEnd:h}=g.useMemo(()=>{let b=(_,$)=>{if(p.pointerType=$,a||$==="touch"||p.isHovered||!_.currentTarget.contains(_.target))return;p.isHovered=!0;let T=_.currentTarget;p.target=T,t&&t({type:"hoverstart",target:T,pointerType:$}),r&&r(!0),u(!0)},B=(_,$)=>{if(p.pointerType="",p.target=null,$==="touch"||!p.isHovered)return;p.isHovered=!1;let T=_.currentTarget;o&&o({type:"hoverend",target:T,pointerType:$}),r&&r(!1),u(!1)},S={};return typeof PointerEvent<"u"?(S.onPointerEnter=_=>{ee&&_.pointerType==="mouse"||b(_,_.pointerType)},S.onPointerLeave=_=>{!a&&_.currentTarget.contains(_.target)&&B(_,_.pointerType)}):(S.onTouchStart=()=>{p.ignoreEmulatedMouseEvents=!0},S.onMouseEnter=_=>{!p.ignoreEmulatedMouseEvents&&!ee&&b(_,"mouse"),p.ignoreEmulatedMouseEvents=!1},S.onMouseLeave=_=>{!a&&_.currentTarget.contains(_.target)&&B(_,"mouse")}),{hoverProps:S,triggerHoverEnd:B}},[t,r,o,a,p]);return g.useEffect(()=>{a&&h({currentTarget:p.target},p.pointerType)},[a]),{hoverProps:m,isHovered:d}}function mt(e,t){let{elementType:r="button",isDisabled:o,onPress:a,onPressStart:d,onPressEnd:u,onPressUp:p,onPressChange:m,preventFocusOnPress:h,allowFocusWhenDisabled:b,onClick:B,href:S,target:_,rel:$,type:T="button"}=e,E;r==="button"?E={type:T,disabled:o}:E={role:"button",tabIndex:o?void 0:0,href:r==="a"&&!o?S:void 0,target:r==="a"?_:void 0,type:r==="input"?T:void 0,disabled:r==="input"?o:void 0,"aria-disabled":!o||r==="input"?void 0:o,rel:r==="a"?$:void 0};let{pressProps:O,isPressed:P}=it({onPressStart:d,onPressEnd:u,onPressChange:m,onPress:a,onPressUp:p,isDisabled:o,preventFocusOnPress:h,ref:t}),{focusableProps:k}=me.useFocusable(e,t);b&&(k.tabIndex=o?-1:k.tabIndex);let C=W(k,O,Ve(e,{labelable:!0}));return{isPressed:P,buttonProps:W(E,C,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],onClick:D=>{B&&(B(D),console.warn("onClick is deprecated, please use onPress"))}})}}function _t(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Ie(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(a){return Object.getOwnPropertyDescriptor(e,a).enumerable})),r.push.apply(r,o)}return r}function Ke(e){for(var t=1;t<arguments.length;t++){var r=arguments[t]!=null?arguments[t]:{};t%2?Ie(Object(r),!0).forEach(function(o){_t(e,o,r[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):Ie(Object(r)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(r,o))})}return e}var bt=(e,t,r)=>{for(var o of Object.keys(e)){var a;if(e[o]!==((a=t[o])!==null&&a!==void 0?a:r[o]))return!1}return!0},te=e=>t=>{var r=e.defaultClassName,o=Ke(Ke({},e.defaultVariants),t);for(var a in o){var d,u=(d=o[a])!==null&&d!==void 0?d:e.defaultVariants[a];if(u!=null){var p=u;typeof p=="boolean"&&(p=p===!0?"true":"false");var m=e.variantClassNames[a][p];m&&(r+=" "+m)}}for(var[h,b]of e.compoundVariants)bt(h,o,e.defaultVariants)&&(r+=" "+b);return r},gt=te({defaultClassName:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy0",variantClassNames:{disabled:{true:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy1",false:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy2"},kind:{default:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy3",link:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy4",confirm:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy5",delete:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy6",key:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy7",icon:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy8"},spinning:{true:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy9",false:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxya"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[[{kind:"icon",spinning:!0},"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyb"],[{kind:"default",spinning:!0},"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyc"],[{kind:"confirm",spinning:!0},"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyd"],[{kind:"delete",spinning:!0},"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxye"],[{kind:"key",spinning:!0},"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyf"],[{disabled:!0,spinning:!1},"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyg"]]}),ht=te({defaultClassName:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyh",variantClassNames:{disabled:{true:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyi",false:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyj"},kind:{icon:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyk",default:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyl",delete:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxym",key:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyn",confirm:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyo",link:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyp"},spinning:{true:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyq",false:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyr"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[]}),vt="pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy11",yt=te({defaultClassName:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy12",variantClassNames:{spinning:{true:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy13",false:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy14"}},defaultVariants:{spinning:!1},compoundVariants:[]}),kt=te({defaultClassName:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxys",variantClassNames:{spinning:{true:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyt",false:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyu"},kind:{icon:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyv",default:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyw",delete:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyx",key:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyy",confirm:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyz",link:"pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy10"}},defaultVariants:{spinning:!1},compoundVariants:[]});const pe=c.forwardRef(({as:e,onClick:t,onPress:r,children:o,className:a,isDisabled:d,disabled:u,href:p,icon:m,kind:h="default",spinning:b,spinningTitle:B,title:S,..._},$)=>{const T=e??(p?"a":"button"),E={onPress:r??t,isDisabled:u??d??b,..._},{"data-testid":O}=_,P=c.useRef(null),k=$||P,{buttonProps:C}=mt(E,k),{hoverProps:D}=ft({isDisabled:E.isDisabled}),{type:H,...fe}=C,n={...W(fe,D),ref:k,title:S,className:p?kt({spinning:b,kind:h}):ht({disabled:d||u,kind:h,spinning:b}),...p?{href:p}:{type:H},..._},{t:f}=c.useContext(G.I18nContext),x=m&&c.createElement(G.Icon,{className:vt,icon:m,"aria-hidden":"true","data-testid":`${O}__${m}-icon`});let l;h==="default"||h==="icon"||h==="link"?l="dark":l="light";const v=b&&c.createElement(G.Spinner,{color:l,className:yt({spinning:b}),title:B||f("design-system:button.spinningTitle"),"data-testid":`${O}__spinner`});return c.createElement(me.FocusRing,null,c.createElement("div",{className:G.cl(gt({disabled:d||u,kind:h,spinning:b}),a)},c.createElement(T,{...n},x,o?c.createElement("span",null,o):"",v)))});G.Metadata.set(pe,{name:"Button",props:{disabled:"boolean",href:"string",icon:"IconName",kind:{type:'"default" | "link" | "icon" | "confirm" | "delete" | "key"',default:'"default"'},spinning:"boolean",spinningTitle:"string",type:{type:'"button" | "submit"',default:'"button"'},as:"button | a",onClick:"() => void",onPress:"() => void",children:"ReactNode",className:"string",isDisabled:"boolean",style:"CSSProperties"},panellable:!0});const wt={Buttons:{components:[pe],description:()=>c.createElement(c.Fragment,null,c.createElement("div",{className:"sps-body-14"},"Buttons are used to initiate events or actions. The labels and/or icons describe what the button will do."),c.createElement("br",null),c.createElement("h5",null,"Variants"),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Default: "),"For tertiary actions or actions of lower importance on a page."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Key: "),"For primary or important actions on a page."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Confirm: "),"For the main call to action on a page. There should only be one Confirm button per screen."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Delete: "),"For deleting information or another destructive action. These should always be paired with a Delete Confirmation Modal."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"Disabled: "),"For actions that are not permitted in a particular state. These can be accompanied by a Tooltip on hover describing why it’s disabled."),c.createElement("div",{className:"sps-body-14"},c.createElement("span",{className:"sps-text-semibold"},"With an Icon: "),"For further illustrating the action. Example: Pencil icon in an Edit button. There can also be Icon Buttons without text.")),examples:{basic:{label:"Basic Buttons",description:({NavigateTo:e})=>c.createElement(c.Fragment,null,c.createElement("p",null,"The most common type of button that can be used in most cases. Example: Basic Buttons in a ",c.createElement(e,{to:"modals"},"Modal"),".")),examples:{withoutIcons:{description:"Without Icons",react:y.code`
2
2
  import { Button } from "@sps-woodland/buttons";
3
3
  import { sprinkles } from "@sps-woodland/tokens";
4
4
 
@@ -13,7 +13,7 @@
13
13
  </>
14
14
  )
15
15
  }
16
- `},withIcons:{description:"With Icons",react:k.code`
16
+ `},withIcons:{description:"With Icons",react:y.code`
17
17
  import { Button } from "@sps-woodland/buttons";
18
18
  import { sprinkles } from "@sps-woodland/tokens";
19
19
 
@@ -28,7 +28,7 @@
28
28
  </>
29
29
  )
30
30
  }
31
- `},spinning:{description:"Spinning",react:k.code`
31
+ `},spinning:{description:"Spinning",react:y.code`
32
32
  import { Button } from "@sps-woodland/buttons";
33
33
  import { sprinkles } from "@sps-woodland/tokens";
34
34
 
@@ -42,7 +42,7 @@
42
42
  </>
43
43
  )
44
44
  }
45
- `}}},dropdown:{label:"Dropdown Buttons",description:"Use these for actions that need to select an option to proceed. Example: Download button with optiosn related to the file format (PDF, PPT, etc.).",examples:{withoutIcons:{description:"Without Icons",react:k.code`
45
+ `}}},dropdown:{label:"Dropdown Buttons",description:"Use these for actions that need to select an option to proceed. Example: Download button with optiosn related to the file format (PDF, PPT, etc.).",examples:{withoutIcons:{description:"Without Icons",react:y.code`
46
46
  import { SpsDropdown } from "@spscommerce/ds-react";
47
47
 
48
48
  function Component() {
@@ -80,7 +80,7 @@
80
80
  </>
81
81
  )
82
82
  }
83
- `},withIcons:{description:"With Icons",react:k.code`
83
+ `},withIcons:{description:"With Icons",react:y.code`
84
84
  import { SpsDropdown } from "@spscommerce/ds-react";
85
85
 
86
86
  function Component() {
@@ -123,7 +123,7 @@
123
123
  </>
124
124
  )
125
125
  }
126
- `},spinning:{description:"Spinning",react:k.code`
126
+ `},spinning:{description:"Spinning",react:y.code`
127
127
  import { SpsDropdown } from "@spscommerce/ds-react";
128
128
 
129
129
  function Component() {
@@ -159,7 +159,7 @@
159
159
  </>
160
160
  )
161
161
  }
162
- `}}},splitButtons:{label:"Split Buttons",description:"Use when there is 1 primary action and other related actions can be taken.",examples:{withoutIcons:{description:"Without Icons",react:k.code`
162
+ `}}},splitButtons:{label:"Split Buttons",description:"Use when there is 1 primary action and other related actions can be taken.",examples:{withoutIcons:{description:"Without Icons",react:y.code`
163
163
  import { SpsSplitButton } from "@spscommerce/ds-react";
164
164
 
165
165
  function Component() {
@@ -185,7 +185,7 @@
185
185
  </>
186
186
  )
187
187
  }
188
- `},withIcons:{description:"With Icons",react:k.code`
188
+ `},withIcons:{description:"With Icons",react:y.code`
189
189
  import { SpsSplitButton } from "@spscommerce/ds-react";
190
190
 
191
191
  function Component() {
@@ -223,7 +223,7 @@
223
223
  </>
224
224
  )
225
225
  }
226
- `}}},iconButtons:{label:"Icon Buttons",description:({NavigateTo:e,Link:t})=>c.createElement(c.Fragment,null,c.createElement("p",null,"Use these for quick actions that can clearly be articulated by the use of an icon. Example: A Print button in the"," ",c.createElement(e,{to:"list-action-bar"},"List Action Bar"),". Do not use an icon that doesn't have a universally understood meaning; instead use a Basic Button or a Basic Button with an icon. ",c.createElement(t,{to:"/style-and-layout/icons/"},"View All Icons"))),examples:{standard:{description:"Standard Icon Buttons",react:k.code`
226
+ `}}},iconButtons:{label:"Icon Buttons",description:({NavigateTo:e,Link:t})=>c.createElement(c.Fragment,null,c.createElement("p",null,"Use these for quick actions that can clearly be articulated by the use of an icon. Example: A Print button in the"," ",c.createElement(e,{to:"list-action-bar"},"List Action Bar"),". Do not use an icon that doesn't have a universally understood meaning; instead use a Basic Button or a Basic Button with an icon. ",c.createElement(t,{to:"/style-and-layout/icons/"},"View All Icons"))),examples:{standard:{description:"Standard Icon Buttons",react:y.code`
227
227
  import { Button } from "@sps-woodland/buttons";
228
228
  import { sprinkles } from "@sps-woodland/tokens";
229
229
 
@@ -242,7 +242,7 @@
242
242
  </>
243
243
  )
244
244
  }
245
- `},dropdown:{description:({NavigateTo:e})=>c.createElement(c.Fragment,null,c.createElement("h5",null,"Dropdown Icon Buttons"),c.createElement("p",null,"Use these when there are several options available for action. Example: Dropdown Icon Button in a ",c.createElement(e,{to:"content-rows"},"Content Row"),".")),react:k.code`
245
+ `},dropdown:{description:({NavigateTo:e})=>c.createElement(c.Fragment,null,c.createElement("h5",null,"Dropdown Icon Buttons"),c.createElement("p",null,"Use these when there are several options available for action. Example: Dropdown Icon Button in a ",c.createElement(e,{to:"content-rows"},"Content Row"),".")),react:y.code`
246
246
  import { SpsDropdown } from "@spscommerce/ds-react";
247
247
 
248
248
  function Component() {
@@ -256,7 +256,7 @@
256
256
  </>
257
257
  )
258
258
  }
259
- `},spinner:{description:"Spinner",react:k.code`
259
+ `},spinner:{description:"Spinner",react:y.code`
260
260
  import { Button } from "@sps-woodland/buttons";
261
261
 
262
262
  function Component() {
@@ -266,7 +266,7 @@
266
266
  </>
267
267
  )
268
268
  }
269
- `}}},textButtons:{label:"Text Buttons",description:({NavigateTo:e})=>c.createElement("p",null,"Use for less important actions, or ones that aren't taken as frequently. They should not appear inline with other copy. Example: Advanced Search button in the"," ",c.createElement(e,{to:"list-toolbar"},"List Toolbar")),examples:{withoutIcons:{description:"Without Icons",react:k.code`
269
+ `}}},textButtons:{label:"Text Buttons",description:({NavigateTo:e})=>c.createElement("p",null,"Use for less important actions, or ones that aren't taken as frequently. They should not appear inline with other copy. Example: Advanced Search button in the"," ",c.createElement(e,{to:"list-toolbar"},"List Toolbar")),examples:{withoutIcons:{description:"Without Icons",react:y.code`
270
270
  import { Button } from "@sps-woodland/buttons";
271
271
  import { sprinkles } from "@sps-woodland/tokens";
272
272
 
@@ -279,7 +279,7 @@
279
279
  </>
280
280
  )
281
281
  }
282
- `},withIcons:{description:"With Icons",react:k.code`
282
+ `},withIcons:{description:"With Icons",react:y.code`
283
283
  import { Button } from "@sps-woodland/buttons";
284
284
  import { sprinkles } from "@sps-woodland/tokens";
285
285
 
@@ -292,7 +292,7 @@
292
292
  </>
293
293
  )
294
294
  }
295
- `},spinner:{description:"Spinner",react:k.code`
295
+ `},spinner:{description:"Spinner",react:y.code`
296
296
  import { Button } from "@sps-woodland/buttons";
297
297
 
298
298
  function Component() {
@@ -302,7 +302,7 @@
302
302
  </>
303
303
  )
304
304
  }
305
- `}}},submitButtons:{label:"Submit Buttons",description:({NavigateTo:e})=>c.createElement("p",null,"Use to submit a form. There can be a number of visual variations, for example a"," ",c.createElement(e,{to:"modals"},"Modal")," uses Basic Button (Key) as its Submit Button."),examples:{basic:{react:k.code`
305
+ `}}},submitButtons:{label:"Submit Buttons",description:({NavigateTo:e})=>c.createElement("p",null,"Use to submit a form. There can be a number of visual variations, for example a"," ",c.createElement(e,{to:"modals"},"Modal")," uses Basic Button (Key) as its Submit Button."),examples:{basic:{react:y.code`
306
306
  import { Button } from "@sps-woodland/buttons";
307
307
  import { sprinkles } from "@sps-woodland/tokens";
308
308
 
@@ -321,7 +321,7 @@
321
321
  </SpsForm>
322
322
  )
323
323
  }
324
- `}}},link:{label:"Button as a Link",description:"Used to link to another page, such as an external website. They may open in the same window or in a new one. It should only be used when a Text Button doesn't provide enough visual emphasis.",examples:{basic:{react:k.code`
324
+ `}}},link:{label:"Button as a Link",description:"Used to link to another page, such as an external website. They may open in the same window or in a new one. It should only be used when a Text Button doesn't provide enough visual emphasis.",examples:{basic:{react:y.code`
325
325
  import { Button } from "@sps-woodland/buttons";
326
326
 
327
327
  function Component() {
@@ -333,7 +333,7 @@
333
333
  </>
334
334
  )
335
335
  }
336
- `}}},buttonGroups:{label:"Button Groups",description:({NavigateTo:e})=>c.createElement("p",null,"Use button groups when there are a number of actions that can be taken in a view. When there are multiple button types in a group, they are separated using dividers. Example: Button groups in ",c.createElement(e,{to:"List Action Bar"},"List Action Bar"),"."),examples:{basic:{description:"Basic Button Groups",react:k.code`
336
+ `}}},buttonGroups:{label:"Button Groups",description:({NavigateTo:e})=>c.createElement("p",null,"Use button groups when there are a number of actions that can be taken in a view. When there are multiple button types in a group, they are separated using dividers. Example: Button groups in ",c.createElement(e,{to:"List Action Bar"},"List Action Bar"),"."),examples:{basic:{description:"Basic Button Groups",react:y.code`
337
337
  import { Button } from "@sps-woodland/buttons";
338
338
  import { sprinkles } from "@sps-woodland/tokens";
339
339
 
@@ -345,7 +345,7 @@
345
345
  </>
346
346
  )
347
347
  }
348
- `},icon:{description:"Icon Button Groups",react:k.code`
348
+ `},icon:{description:"Icon Button Groups",react:y.code`
349
349
  import { Button } from "@sps-woodland/buttons";
350
350
 
351
351
  function Component() {
@@ -356,7 +356,7 @@
356
356
  </>
357
357
  )
358
358
  }
359
- `},textAndIcons:{description:"Text Buttons + Icon Buttons Group",react:k.code`
359
+ `},textAndIcons:{description:"Text Buttons + Icon Buttons Group",react:y.code`
360
360
  import { Button } from "@sps-woodland/buttons";
361
361
  import { sprinkles } from "@sps-woodland/tokens";
362
362
  import { VericalRule } from "@sps-woodland/core";
@@ -371,7 +371,7 @@
371
371
  </>
372
372
  )
373
373
  }
374
- `},textAndBasic:{description:"Text Buttons + Basic Buttons Group",react:k.code`
374
+ `},textAndBasic:{description:"Text Buttons + Basic Buttons Group",react:y.code`
375
375
  import { Button } from "@sps-woodland/buttons";
376
376
  import { sprinkles } from "@sps-woodland/tokens";
377
377
  import { VericalRule } from "@sps-woodland/core";
@@ -387,7 +387,7 @@
387
387
  </>
388
388
  )
389
389
  }
390
- `},iconsAndBasic:{description:"Icon Buttons + Basic Buttons Group",react:k.code`
390
+ `},iconsAndBasic:{description:"Icon Buttons + Basic Buttons Group",react:y.code`
391
391
  import { Button } from "@sps-woodland/buttons";
392
392
  import { sprinkles } from "@sps-woodland/tokens";
393
393
  import { VericalRule } from "@sps-woodland/core";
@@ -404,7 +404,7 @@
404
404
  </>
405
405
  )
406
406
  }
407
- `},textIconsAndBasic:{description:"Text Buttons + Icon Buttons + Basic Buttons Group",react:k.code`
407
+ `},textIconsAndBasic:{description:"Text Buttons + Icon Buttons + Basic Buttons Group",react:y.code`
408
408
  import { Button } from "@sps-woodland/buttons";
409
409
  import { sprinkles } from "@sps-woodland/tokens";
410
410
  import { VericalRule } from "@sps-woodland/core";
package/lib/style.css CHANGED
@@ -1 +1 @@
1
- .pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy0{border-width:.0625rem;border-style:solid;border-radius:.25rem;cursor:pointer;display:inline-block;font-size:.75rem;font-weight:600;line-height:.875rem;padding:0;position:relative}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy3{background:#e9e9ea;border-color:#d2d4d4;color:#4b5356}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy3:hover{background:#d2d4d4}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy4{background:none transparent;border:0;color:#027db8}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy4:hover{background:none transparent;color:#08638d;text-decoration:none}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy5{background:#027db8;border-color:#08638d;color:#fff}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy5:hover{background:#08638d}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy6{background:#de012e;border-color:#a30d2d;color:#fff}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy6:hover{background:#a30d2d}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy7{background:#4b5356;border-color:#1f282c;color:#fff}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy7:hover{background:#1f282c}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy8{background:transparent;border-color:transparent;color:#4b5356}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy8:hover{background-color:#d2d4d4;border-color:#d2d4d4}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy9{color:transparent!important;cursor:not-allowed}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyb{background:#e9e9ea;border-color:#d2d4d4}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyb:hover,.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyc:hover{background:#e9e9ea}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyd:hover{background:#027db8}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxye:hover{background:#de012e}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyf:hover{background:#4b5356}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyg{background:#fff!important;border-color:#d2d4d4!important;color:#717779!important;cursor:not-allowed}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyg:hover{background:#fff}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyh{background:none transparent;border:0 none;color:inherit;display:block;font-size:inherit;font-weight:inherit;margin:0;text-decoration:none;padding:.5rem 1rem}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyh:hover{text-decoration:none}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyi{cursor:not-allowed!important}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyk{padding:.25rem .5rem}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyp{padding-top:.5rem;padding-bottom:.5rem;padding-right:0;padding-left:0}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyq{cursor:not-allowed!important}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxys{background:none transparent;border:0 none;color:inherit;cursor:inherit;display:block;font-size:inherit;font-weight:inherit;margin:0;padding:.5rem 1rem;text-decoration:none}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxys:hover{text-decoration:none;color:inherit}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyt{cursor:not-allowed}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxyv{padding:.25rem .5rem}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy11{line-height:0!important;position:relative}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy11:before{font-size:.875rem;line-height:0;position:relative;top:.125rem}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy11:not(:last-child){margin-right:.5rem}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy12{left:50%;margin:-.875rem -.4375rem;position:absolute}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy13{cursor:not-allowed;display:inline}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy14{display:none}.pkg_sps-woodland_buttons__version_8_23_17__hash_125pcxy12>i{border-width:.125rem;height:.875rem;width:.875rem}
1
+ .pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy0{border-width:.0625rem;border-style:solid;border-radius:.25rem;cursor:pointer;display:inline-block;font-size:.75rem;font-weight:600;line-height:.875rem;padding:0;position:relative}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy3{background:#e9e9ea;border-color:#d2d4d4;color:#4b5356}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy3:hover{background:#d2d4d4}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy4{background:none transparent;border:0;color:#027db8}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy4:hover{background:none transparent;color:#08638d;text-decoration:none}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy5{background:#027db8;border-color:#08638d;color:#fff}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy5:hover{background:#08638d}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy6{background:#de012e;border-color:#a30d2d;color:#fff}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy6:hover{background:#a30d2d}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy7{background:#4b5356;border-color:#1f282c;color:#fff}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy7:hover{background:#1f282c}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy8{background:transparent;border-color:transparent;color:#4b5356}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy8:hover{background-color:#d2d4d4;border-color:#d2d4d4}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy9{color:transparent!important;cursor:not-allowed}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyb{background:#e9e9ea;border-color:#d2d4d4}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyb:hover,.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyc:hover{background:#e9e9ea}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyd:hover{background:#027db8}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxye:hover{background:#de012e}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyf:hover{background:#4b5356}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyg{background:#fff!important;border-color:#d2d4d4!important;color:#717779!important;cursor:not-allowed}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyg:hover{background:#fff}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyh{background:none transparent;border:0 none;color:inherit;display:block;font-size:inherit;font-weight:inherit;margin:0;text-decoration:none;padding:.5rem 1rem}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyh:hover{text-decoration:none}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyi{cursor:not-allowed!important}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyk{padding:.25rem .5rem}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyp{padding-top:.5rem;padding-bottom:.5rem;padding-right:0;padding-left:0}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyq{cursor:not-allowed!important}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxys{background:none transparent;border:0 none;color:inherit;cursor:inherit;display:block;font-size:inherit;font-weight:inherit;margin:0;padding:.5rem 1rem;text-decoration:none}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxys:hover{text-decoration:none;color:inherit}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyt{cursor:not-allowed}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxyv{padding:.25rem .5rem}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy11{line-height:0!important;position:relative}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy11:before{font-size:.875rem;line-height:0;position:relative;top:.125rem}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy11:not(:last-child){margin-right:.5rem}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy12{left:50%;margin:-.875rem -.4375rem;position:absolute}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy13{cursor:not-allowed;display:inline}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy14{display:none}.pkg_sps-woodland_buttons__version_8_24_0__hash_125pcxy12>i{border-width:.125rem;height:.875rem;width:.875rem}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sps-woodland/buttons",
3
3
  "description": "SPS Woodland Design System button components",
4
- "version": "8.23.17",
4
+ "version": "8.24.0",
5
5
  "author": "SPS Commerce",
6
6
  "license": "UNLICENSED",
7
7
  "repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/buttons",
@@ -30,8 +30,8 @@
30
30
  "@spscommerce/utils": "^7.0.0",
31
31
  "react": "^16.9.0",
32
32
  "react-dom": "^16.9.0",
33
- "@sps-woodland/core": "8.23.17",
34
- "@sps-woodland/tokens": "8.23.17"
33
+ "@sps-woodland/core": "8.24.0",
34
+ "@sps-woodland/tokens": "8.24.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "@react-aria/button": "^3.3.5",
@@ -42,8 +42,8 @@
42
42
  "@vanilla-extract/recipes": "^0.2.5",
43
43
  "react": "^16.9.0",
44
44
  "react-dom": "^16.9.0",
45
- "@sps-woodland/core": "8.23.17",
46
- "@sps-woodland/tokens": "8.23.17"
45
+ "@sps-woodland/core": "8.24.0",
46
+ "@sps-woodland/tokens": "8.24.0"
47
47
  },
48
48
  "dependencies": {
49
49
  "@react-aria/button": "^3.7.0",