@sps-woodland/buttons 8.7.3 → 8.7.5
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 +2 -2
- package/lib/index.es.js +386 -425
- package/lib/style.css +1 -1
- package/package.json +5 -5
- /package/{vite.config.js → vite.config.mjs} +0 -0
package/lib/index.cjs.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const k=require("react"),V=require("@sps-woodland/core"),Oe=require("@react-aria/focus"),y=require("@spscommerce/utils"),Ve=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function je(e){if(e&&e.__esModule)return 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 Ne=Ve(k),c=je(k);function De(e){var t,r,o="";if(typeof e=="string"||typeof e=="number")o+=e;else if(typeof e=="object")if(Array.isArray(e)){var i=e.length;for(t=0;t<i;t++)e[t]&&(r=De(e[t]))&&(o&&(o+=" "),o+=r)}else for(r in e)e[r]&&(o&&(o+=" "),o+=r);return o}function We(){for(var e,t,r=0,o="",i=arguments.length;r<i;r++)(e=arguments[r])&&(t=De(e))&&(o&&(o+=" "),o+=t);return o}const Ce=typeof document<"u"?Ne.default.useLayoutEffect:()=>{};function G(e){const t=k.useRef(null);return Ce(()=>{t.current=e},[e]),k.useCallback((...r)=>{const o=t.current;return o==null?void 0:o(...r)},[])}let ye=new Map;function Ye(e,t){if(e===t)return e;let r=ye.get(e);if(r)return r(t),t;let o=ye.get(t);return o?(o(e),e):t}function Le(...e){return(...t)=>{for(let r of e)typeof r=="function"&&r(...t)}}const C=e=>{var t;return(t=e==null?void 0:e.ownerDocument)!==null&&t!==void 0?t:document},R=e=>e&&"window"in e&&e.window===e?e:C(e).defaultView||window;function Y(...e){let t={...e[0]};for(let r=1;r<e.length;r++){let o=e[r];for(let i in o){let d=t[i],u=o[i];typeof d=="function"&&typeof u=="function"&&i[0]==="o"&&i[1]==="n"&&i.charCodeAt(2)>=65&&i.charCodeAt(2)<=90?t[i]=Le(d,u):(i==="className"||i==="UNSAFE_className")&&typeof d=="string"&&typeof u=="string"?t[i]=We(d,u):i==="id"&&d&&u?t.id=Ye(d,u):t[i]=u!==void 0?u:d}}return t}const qe=new Set(["id"]),ze=new Set(["aria-label","aria-labelledby","aria-describedby","aria-details"]),Xe=new Set(["href","target","rel","download","ping","referrerPolicy"]),Je=/^(data-.*)$/;function Qe(e,t={}){let{labelable:r,isLink:o,propNames:i}=t,d={};for(const u in e)Object.prototype.hasOwnProperty.call(e,u)&&(qe.has(u)||r&&ze.has(u)||o&&Xe.has(u)||(i==null?void 0:i.has(u))||Je.test(u))&&(d[u]=e[u]);return d}function j(e){if(Ze())e.focus({preventScroll:!0});else{let t=et(e);e.focus(),tt(t)}}let X=null;function Ze(){if(X==null){X=!1;try{document.createElement("div").focus({get preventScroll(){return X=!0,!0}})}catch{}}return X}function et(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 tt(e){for(let{element:t,scrollTop:r,scrollLeft:o}of e)t.scrollTop=r,t.scrollLeft=o}function re(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 me(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 q(){return me(/^Mac/i)}function nt(){return me(/^iPhone/i)}function _e(){return me(/^iPad/i)||q()&&navigator.maxTouchPoints>1}function Ke(){return nt()||_e()}function rt(){return re(/AppleWebKit/i)&&!ot()}function ot(){return re(/Chrome/i)}function Ie(){return re(/Android/i)}function st(){return re(/Firefox/i)}function z(e,t,r=!0){var o,i;let{metaKey:d,ctrlKey:u,altKey:p,shiftKey:b}=t;st()&&((i=window.event)===null||i===void 0||(o=i.type)===null||o===void 0?void 0:o.startsWith("key"))&&e.target==="_blank"&&(q()?d=!0:u=!0);let E=rt()&&q()&&!_e()?new KeyboardEvent("keydown",{keyIdentifier:"Enter",metaKey:d,ctrlKey:u,altKey:p,shiftKey:b}):new MouseEvent("click",{metaKey:d,ctrlKey:u,altKey:p,shiftKey:b,bubbles:!0,cancelable:!0});z.isOpening=r,j(e),e.dispatchEvent(E),z.isOpening=!1}z.isOpening=!1;let U=new Map,ue=new Set;function he(){if(typeof window>"u")return;function e(o){return"propertyName"in o}let t=o=>{if(!e(o)||!o.target)return;let i=U.get(o.target);i||(i=new Set,U.set(o.target,i),o.target.addEventListener("transitioncancel",r,{once:!0})),i.add(o.propertyName)},r=o=>{if(!e(o)||!o.target)return;let i=U.get(o.target);if(!!i&&(i.delete(o.propertyName),i.size===0&&(o.target.removeEventListener("transitioncancel",r),U.delete(o.target)),U.size===0)){for(let d of ue)d();ue.clear()}};document.body.addEventListener("transitionrun",t),document.body.addEventListener("transitionend",r)}typeof document<"u"&&(document.readyState!=="loading"?he():document.addEventListener("DOMContentLoaded",he));function it(e){requestAnimationFrame(()=>{U.size===0?e():ue.add(e)})}function at(){let e=k.useRef(new Map),t=k.useCallback((i,d,u,p)=>{let b=p!=null&&p.once?(...E)=>{e.current.delete(u),u(...E)}:u;e.current.set(u,{type:d,eventTarget:i,fn:b,options:p}),i.addEventListener(d,u,p)},[]),r=k.useCallback((i,d,u,p)=>{var b;let E=((b=e.current.get(u))===null||b===void 0?void 0:b.fn)||u;i.removeEventListener(d,E,p),e.current.delete(u)},[]),o=k.useCallback(()=>{e.current.forEach((i,d)=>{r(i.eventTarget,i.type,d,i.options)})},[r]);return k.useEffect(()=>o,[o]),{addGlobalListener:t,removeGlobalListener:r,removeAllGlobalListeners:o}}function lt(e,t){Ce(()=>{if(e&&e.ref&&t)return e.ref.current=t.current,()=>{e.ref&&(e.ref.current=null)}})}function ce(e){return e.mozInputSource===0&&e.isTrusted?!0:Ie()&&e.pointerType?e.type==="click"&&e.buttons===1:e.detail===0&&!e.pointerType}function ut(e){return!Ie()&&e.width===0&&e.height===0||e.width===1&&e.height===1&&e.pressure===0&&e.detail===0&&e.pointerType==="mouse"}function ct(e,t){return t.get?t.get.call(e):t.value}function Me(e,t,r){if(!t.has(e))throw new TypeError("attempted to "+r+" private field on non-instance");return t.get(e)}function dt(e,t){var r=Me(e,t,"get");return ct(e,r)}function pt(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function ft(e,t,r){pt(e,t),t.set(e,r)}function mt(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 Ee(e,t,r){var o=Me(e,t,"set");return mt(e,o,r),r}let H="default",de="",ee=new WeakMap;function $e(e){if(Ke()){if(H==="default"){const t=C(e);de=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}H="disabled"}else(e instanceof HTMLElement||e instanceof SVGElement)&&(ee.set(e,e.style.userSelect),e.style.userSelect="none")}function J(e){if(Ke()){if(H!=="disabled")return;H="restoring",setTimeout(()=>{it(()=>{if(H==="restoring"){const t=C(e);t.documentElement.style.webkitUserSelect==="none"&&(t.documentElement.style.webkitUserSelect=de||""),de="",H="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&ee.has(e)){let t=ee.get(e);e.style.userSelect==="none"&&(e.style.userSelect=t),e.getAttribute("style")===""&&e.removeAttribute("style"),ee.delete(e)}}const Ae=Ne.default.createContext({register:()=>{}});Ae.displayName="PressResponderContext";function bt(e){let t=k.useContext(Ae);if(t){let{register:r,...o}=t;e=Y(o,e),r()}return lt(t,e.ref),e}var Q=new WeakMap;class Z{continuePropagation(){Ee(this,Q,!1)}get shouldStopPropagation(){return dt(this,Q)}constructor(t,r,o){ft(this,Q,{writable:!0,value:void 0}),Ee(this,Q,!0),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}}const ke=Symbol("linkClicked");function gt(e){let{onPress:t,onPressChange:r,onPressStart:o,onPressEnd:i,onPressUp:d,isDisabled:u,isPressed:p,preventFocusOnPress:b,shouldCancelOnPointerExit:E,allowTextSelectionOnPress:v,ref:_,...x}=bt(e),[m,S]=k.useState(!1),w=k.useRef({isPressed:!1,ignoreEmulatedMouseEvents:!1,ignoreClickAfterPress:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null}),{addGlobalListener:B,removeAllGlobalListeners:N}=at(),P=G((n,f)=>{let T=w.current;if(u||T.didFirePressStart)return!1;let l=!0;if(T.isTriggeringEvent=!0,o){let g=new Z("pressstart",f,n);o(g),l=g.shouldStopPropagation}return r&&r(!0),T.isTriggeringEvent=!1,T.didFirePressStart=!0,S(!0),l}),$=G((n,f,T=!0)=>{let l=w.current;if(!l.didFirePressStart)return!1;l.ignoreClickAfterPress=!0,l.didFirePressStart=!1,l.isTriggeringEvent=!0;let g=!0;if(i){let s=new Z("pressend",f,n);i(s),g=s.shouldStopPropagation}if(r&&r(!1),S(!1),t&&T&&!u){let s=new Z("press",f,n);t(s),g&&(g=s.shouldStopPropagation)}return l.isTriggeringEvent=!1,g}),L=G((n,f)=>{let T=w.current;if(u)return!1;if(d){T.isTriggeringEvent=!0;let l=new Z("pressup",f,n);return d(l),T.isTriggeringEvent=!1,l.shouldStopPropagation}return!0}),D=G(n=>{let f=w.current;f.isPressed&&f.target&&(f.isOverTarget&&f.pointerType!=null&&$(K(f.target,n),f.pointerType,!1),f.isPressed=!1,f.isOverTarget=!1,f.activePointerId=null,f.pointerType=null,N(),v||J(f.target))}),M=G(n=>{E&&D(n)}),se=k.useMemo(()=>{let n=w.current,f={onKeyDown(l){if(ie(l.nativeEvent,l.currentTarget)&&l.currentTarget.contains(l.target)){var g;Te(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 a=l.currentTarget,h=A=>{ie(A,a)&&!A.repeat&&a.contains(A.target)&&n.target&&L(K(n.target,A),"keyboard")};B(C(l.currentTarget),"keyup",Le(h,T),!0)}s&&l.stopPropagation(),l.metaKey&&q()&&((g=n.metaKeyEvents)===null||g===void 0||g.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&&!z.isOpening){let g=!0;if(u&&l.preventDefault(),!n.ignoreClickAfterPress&&!n.ignoreEmulatedMouseEvents&&!n.isPressed&&(n.pointerType==="virtual"||ce(l.nativeEvent))){!u&&!b&&j(l.currentTarget);let s=P(l,"virtual"),a=L(l,"virtual"),h=$(l,"virtual");g=s&&a&&h}n.ignoreEmulatedMouseEvents=!1,n.ignoreClickAfterPress=!1,g&&l.stopPropagation()}}},T=l=>{var g;if(n.isPressed&&n.target&&ie(l,n.target)){var s;Te(l.target,l.key)&&l.preventDefault();let h=l.target;$(K(n.target,l),"keyboard",n.target.contains(h)),N(),l.key!=="Enter"&&be(n.target)&&n.target.contains(h)&&!l[ke]&&(l[ke]=!0,z(n.target,l,!1)),n.isPressed=!1,(s=n.metaKeyEvents)===null||s===void 0||s.delete(l.key)}else if(l.key==="Meta"&&((g=n.metaKeyEvents)===null||g===void 0?void 0:g.size)){var a;let h=n.metaKeyEvents;n.metaKeyEvents=void 0;for(let A of h.values())(a=n.target)===null||a===void 0||a.dispatchEvent(new KeyboardEvent("keyup",A))}};if(typeof PointerEvent<"u"){f.onPointerDown=a=>{if(a.button!==0||!a.currentTarget.contains(a.target))return;if(ut(a.nativeEvent)){n.pointerType="virtual";return}ae(a.currentTarget)&&a.preventDefault(),n.pointerType=a.pointerType;let h=!0;n.isPressed||(n.isPressed=!0,n.isOverTarget=!0,n.activePointerId=a.pointerId,n.target=a.currentTarget,!u&&!b&&j(a.currentTarget),v||$e(n.target),h=P(a,n.pointerType),B(C(a.currentTarget),"pointermove",l,!1),B(C(a.currentTarget),"pointerup",g,!1),B(C(a.currentTarget),"pointercancel",s,!1)),h&&a.stopPropagation()},f.onMouseDown=a=>{!a.currentTarget.contains(a.target)||a.button===0&&(ae(a.currentTarget)&&a.preventDefault(),a.stopPropagation())},f.onPointerUp=a=>{!a.currentTarget.contains(a.target)||n.pointerType==="virtual"||a.button===0&&F(a,a.currentTarget)&&L(a,n.pointerType||a.pointerType)};let l=a=>{a.pointerId===n.activePointerId&&(n.target&&F(a,n.target)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,P(K(n.target,a),n.pointerType)):n.target&&n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,$(K(n.target,a),n.pointerType,!1),M(a)))},g=a=>{a.pointerId===n.activePointerId&&n.isPressed&&a.button===0&&n.target&&(F(a,n.target)&&n.pointerType!=null?$(K(n.target,a),n.pointerType):n.isOverTarget&&n.pointerType!=null&&$(K(n.target,a),n.pointerType,!1),n.isPressed=!1,n.isOverTarget=!1,n.activePointerId=null,n.pointerType=null,N(),v||J(n.target))},s=a=>{D(a)};f.onDragStart=a=>{!a.currentTarget.contains(a.target)||D(a)}}else{f.onMouseDown=s=>{if(s.button!==0||!s.currentTarget.contains(s.target))return;if(ae(s.currentTarget)&&s.preventDefault(),n.ignoreEmulatedMouseEvents){s.stopPropagation();return}n.isPressed=!0,n.isOverTarget=!0,n.target=s.currentTarget,n.pointerType=ce(s.nativeEvent)?"virtual":"mouse",!u&&!b&&j(s.currentTarget),P(s,n.pointerType)&&s.stopPropagation(),B(C(s.currentTarget),"mouseup",l,!1)},f.onMouseEnter=s=>{if(!s.currentTarget.contains(s.target))return;let a=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!0,a=P(s,n.pointerType)),a&&s.stopPropagation()},f.onMouseLeave=s=>{if(!s.currentTarget.contains(s.target))return;let a=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!1,a=$(s,n.pointerType,!1),M(s)),a&&s.stopPropagation()},f.onMouseUp=s=>{!s.currentTarget.contains(s.target)||!n.ignoreEmulatedMouseEvents&&s.button===0&&L(s,n.pointerType||"mouse")};let l=s=>{if(s.button===0){if(n.isPressed=!1,N(),n.ignoreEmulatedMouseEvents){n.ignoreEmulatedMouseEvents=!1;return}n.target&&F(s,n.target)&&n.pointerType!=null?$(K(n.target,s),n.pointerType):n.target&&n.isOverTarget&&n.pointerType!=null&&$(K(n.target,s),n.pointerType,!1),n.isOverTarget=!1}};f.onTouchStart=s=>{if(!s.currentTarget.contains(s.target))return;let a=vt(s.nativeEvent);if(!a)return;n.activePointerId=a.identifier,n.ignoreEmulatedMouseEvents=!0,n.isOverTarget=!0,n.isPressed=!0,n.target=s.currentTarget,n.pointerType="touch",!u&&!b&&j(s.currentTarget),v||$e(n.target),P(s,n.pointerType)&&s.stopPropagation(),B(R(s.currentTarget),"scroll",g,!0)},f.onTouchMove=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let a=we(s.nativeEvent,n.activePointerId),h=!0;a&&F(a,s.currentTarget)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,h=P(s,n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,h=$(s,n.pointerType,!1),M(s)),h&&s.stopPropagation()},f.onTouchEnd=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let a=we(s.nativeEvent,n.activePointerId),h=!0;a&&F(a,s.currentTarget)&&n.pointerType!=null?(L(s,n.pointerType),h=$(s,n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(h=$(s,n.pointerType,!1)),h&&s.stopPropagation(),n.isPressed=!1,n.activePointerId=null,n.isOverTarget=!1,n.ignoreEmulatedMouseEvents=!0,n.target&&!v&&J(n.target),N()},f.onTouchCancel=s=>{!s.currentTarget.contains(s.target)||(s.stopPropagation(),n.isPressed&&D(s))};let g=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},[B,u,b,N,v,D,M,$,P,L]);return k.useEffect(()=>()=>{var n;v||J((n=w.current.target)!==null&&n!==void 0?n:void 0)},[v]),{isPressed:p||m,pressProps:Y(x,se)}}function be(e){return e.tagName==="A"&&e.hasAttribute("href")}function ie(e,t){const{key:r,code:o}=e,i=t,d=i.getAttribute("role");return(r==="Enter"||r===" "||r==="Spacebar"||o==="Space")&&!(i instanceof R(i).HTMLInputElement&&!Fe(i,r)||i instanceof R(i).HTMLTextAreaElement||i.isContentEditable)&&!((d==="link"||!d&&be(i))&&r!=="Enter")}function vt(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}function we(e,t){const r=e.changedTouches;for(let o=0;o<r.length;o++){const i=r[o];if(i.identifier===t)return i}return null}function K(e,t){return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey}}function yt(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 ht(e,t){return!(e.left>t.right||t.left>e.right||e.top>t.bottom||t.top>e.bottom)}function F(e,t){let r=t.getBoundingClientRect(),o=yt(e);return ht(r,o)}function ae(e){return!(e instanceof HTMLElement)||!e.hasAttribute("draggable")}function Te(e,t){return e instanceof HTMLInputElement?!Fe(e,t):e instanceof HTMLButtonElement?e.type!=="submit"&&e.type!=="reset":!be(e)}const Et=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function Fe(e,t){return e.type==="checkbox"||e.type==="radio"?t===" ":Et.has(e.type)}let $t=new Set,W=new Map,I=!1,pe=!1;function ge(e,t){for(let r of $t)r(e,t)}function kt(e){return!(e.metaKey||!q()&&e.altKey||e.ctrlKey||e.key==="Control"||e.key==="Shift"||e.key==="Meta")}function te(e){I=!0,kt(e)&&ge("keyboard",e)}function O(e){(e.type==="mousedown"||e.type==="pointerdown")&&(I=!0,ge("pointer",e))}function Ue(e){ce(e)&&(I=!0)}function He(e){e.target===window||e.target===document||(!I&&!pe&&ge("virtual",e),I=!1,pe=!1)}function Re(){I=!1,pe=!0}function Be(e){if(typeof window>"u"||W.get(R(e)))return;const t=R(e),r=C(e);let o=t.HTMLElement.prototype.focus;t.HTMLElement.prototype.focus=function(){I=!0,o.apply(this,arguments)},r.addEventListener("keydown",te,!0),r.addEventListener("keyup",te,!0),r.addEventListener("click",Ue,!0),t.addEventListener("focus",He,!0),t.addEventListener("blur",Re,!1),typeof PointerEvent<"u"?(r.addEventListener("pointerdown",O,!0),r.addEventListener("pointermove",O,!0),r.addEventListener("pointerup",O,!0)):(r.addEventListener("mousedown",O,!0),r.addEventListener("mousemove",O,!0),r.addEventListener("mouseup",O,!0)),t.addEventListener("beforeunload",()=>{Ge(e)},{once:!0}),W.set(t,{focus:o})}const Ge=(e,t)=>{const r=R(e),o=C(e);t&&o.removeEventListener("DOMContentLoaded",t),W.has(r)&&(r.HTMLElement.prototype.focus=W.get(r).focus,o.removeEventListener("keydown",te,!0),o.removeEventListener("keyup",te,!0),o.removeEventListener("click",Ue,!0),r.removeEventListener("focus",He,!0),r.removeEventListener("blur",Re,!1),typeof PointerEvent<"u"?(o.removeEventListener("pointerdown",O,!0),o.removeEventListener("pointermove",O,!0),o.removeEventListener("pointerup",O,!0)):(o.removeEventListener("mousedown",O,!0),o.removeEventListener("mousemove",O,!0),o.removeEventListener("mouseup",O,!0)),W.delete(r))};function wt(e){const t=C(e);let r;return t.readyState!=="loading"?Be(e):(r=()=>{Be(e)},t.addEventListener("DOMContentLoaded",r)),()=>Ge(e,r)}typeof document<"u"&&wt();let ne=!1,le=0;function fe(){ne=!0,setTimeout(()=>{ne=!1},50)}function Pe(e){e.pointerType==="touch"&&fe()}function Tt(){if(!(typeof document>"u"))return typeof PointerEvent<"u"?document.addEventListener("pointerup",Pe):document.addEventListener("touchend",fe),le++,()=>{le--,!(le>0)&&(typeof PointerEvent<"u"?document.removeEventListener("pointerup",Pe):document.removeEventListener("touchend",fe))}}function Bt(e){let{onHoverStart:t,onHoverChange:r,onHoverEnd:o,isDisabled:i}=e,[d,u]=k.useState(!1),p=k.useRef({isHovered:!1,ignoreEmulatedMouseEvents:!1,pointerType:"",target:null}).current;k.useEffect(Tt,[]);let{hoverProps:b,triggerHoverEnd:E}=k.useMemo(()=>{let v=(m,S)=>{if(p.pointerType=S,i||S==="touch"||p.isHovered||!m.currentTarget.contains(m.target))return;p.isHovered=!0;let w=m.currentTarget;p.target=w,t&&t({type:"hoverstart",target:w,pointerType:S}),r&&r(!0),u(!0)},_=(m,S)=>{if(p.pointerType="",p.target=null,S==="touch"||!p.isHovered)return;p.isHovered=!1;let w=m.currentTarget;o&&o({type:"hoverend",target:w,pointerType:S}),r&&r(!1),u(!1)},x={};return typeof PointerEvent<"u"?(x.onPointerEnter=m=>{ne&&m.pointerType==="mouse"||v(m,m.pointerType)},x.onPointerLeave=m=>{!i&&m.currentTarget.contains(m.target)&&_(m,m.pointerType)}):(x.onTouchStart=()=>{p.ignoreEmulatedMouseEvents=!0},x.onMouseEnter=m=>{!p.ignoreEmulatedMouseEvents&&!ne&&v(m,"mouse"),p.ignoreEmulatedMouseEvents=!1},x.onMouseLeave=m=>{!i&&m.currentTarget.contains(m.target)&&_(m,"mouse")}),{hoverProps:x,triggerHoverEnd:_}},[t,r,o,i,p]);return k.useEffect(()=>{i&&E({currentTarget:p.target},p.pointerType)},[i]),{hoverProps:b,isHovered:d}}function Pt(e,t){let{elementType:r="button",isDisabled:o,onPress:i,onPressStart:d,onPressEnd:u,onPressUp:p,onPressChange:b,preventFocusOnPress:E,allowFocusWhenDisabled:v,onClick:_,href:x,target:m,rel:S,type:w="button"}=e,B;r==="button"?B={type:w,disabled:o}:B={role:"button",tabIndex:o?void 0:0,href:r==="a"&&o?void 0:x,target:r==="a"?m:void 0,type:r==="input"?w:void 0,disabled:r==="input"?o:void 0,"aria-disabled":!o||r==="input"?void 0:o,rel:r==="a"?S:void 0};let{pressProps:N,isPressed:P}=gt({onPressStart:d,onPressEnd:u,onPressChange:b,onPress:i,onPressUp:p,isDisabled:o,preventFocusOnPress:E,ref:t}),{focusableProps:$}=Oe.useFocusable(e,t);v&&($.tabIndex=o?-1:$.tabIndex);let L=Y($,N,Qe(e,{labelable:!0}));return{isPressed:P,buttonProps:Y(B,L,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],onClick:D=>{_&&(_(D),console.warn("onClick is deprecated, please use onPress"))}})}}function St(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function Se(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(i){return Object.getOwnPropertyDescriptor(e,i).enumerable})),r.push.apply(r,o)}return r}function xe(e){for(var t=1;t<arguments.length;t++){var r=arguments[t]!=null?arguments[t]:{};t%2?Se(Object(r),!0).forEach(function(o){St(e,o,r[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):Se(Object(r)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(r,o))})}return e}var xt=(e,t,r)=>{for(var o of Object.keys(e)){var i;if(e[o]!==((i=t[o])!==null&&i!==void 0?i:r[o]))return!1}return!0},oe=e=>t=>{var r=e.defaultClassName,o=xe(xe({},e.defaultVariants),t);for(var i in o){var d,u=(d=o[i])!==null&&d!==void 0?d:e.defaultVariants[i];if(u!=null){var p=u;typeof p=="boolean"&&(p=p===!0?"true":"false");var b=e.variantClassNames[i][p];b&&(r+=" "+b)}}for(var[E,v]of e.compoundVariants)xt(E,o,e.defaultVariants)&&(r+=" "+v);return r},Ot=oe({defaultClassName:"_125pcxy0",variantClassNames:{disabled:{true:"_125pcxy1",false:"_125pcxy2"},kind:{default:"_125pcxy3",link:"_125pcxy4",confirm:"_125pcxy5",delete:"_125pcxy6",key:"_125pcxy7",icon:"_125pcxy8"},spinning:{true:"_125pcxy9",false:"_125pcxya"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[[{kind:"icon",spinning:!0},"_125pcxyb"],[{kind:"default",spinning:!0},"_125pcxyc"],[{kind:"confirm",spinning:!0},"_125pcxyd"],[{kind:"delete",spinning:!0},"_125pcxye"],[{kind:"key",spinning:!0},"_125pcxyf"],[{disabled:!0,spinning:!1},"_125pcxyg"]]}),Nt=oe({defaultClassName:"_125pcxyh",variantClassNames:{disabled:{true:"_125pcxyi",false:"_125pcxyj"},kind:{icon:"_125pcxyk",default:"_125pcxyl",delete:"_125pcxym",key:"_125pcxyn",confirm:"_125pcxyo",link:"_125pcxyp"},spinning:{true:"_125pcxyq",false:"_125pcxyr"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[]}),Dt="_125pcxyv",Ct=oe({defaultClassName:"_125pcxyw",variantClassNames:{spinning:{true:"_125pcxyx",false:"_125pcxyy"}},defaultVariants:{spinning:!1},compoundVariants:[]}),Lt=oe({defaultClassName:"_125pcxys",variantClassNames:{spinning:{true:"_125pcxyt",false:"_125pcxyu"}},defaultVariants:{spinning:!1},compoundVariants:[]});function _t({as:e,onClick:t,onPress:r,children:o,className:i,isDisabled:d,disabled:u,href:p,icon:b,kind:E="default",spinning:v,spinningTitle:_,title:x,...m},S){var g;const w=e!=null?e:p?"a":"button",B={onPress:r!=null?r:t,isDisabled:(g=u!=null?u:d)!=null?g:v,...m},{"data-testid":N}=m,P=S||c.useRef(null),{buttonProps:$}=Pt(B,P),{hoverProps:L}=Bt({isDisabled:B.isDisabled}),{type:D,...M}=$,se={...Y(M,L),ref:P,title:x,className:p?Lt({spinning:v}):Nt({disabled:d||u,kind:E,spinning:v}),...p?{href:p}:{type:D}},{t:n}=c.useContext(V.I18nContext),f=b&&c.createElement(V.Icon,{className:Dt,icon:b,"aria-hidden":"true","data-testid":`${N}__${b}-icon`});let T;E==="default"||E==="icon"||E==="link"?T="dark":T="light";const l=v&&c.createElement(V.Spinner,{color:T,className:Ct({spinning:v}),title:_||n("design-system:button.spinningTitle"),"data-testid":`${N}__spinner`});return c.createElement(Oe.FocusRing,null,c.createElement("div",{className:V.cl(Ot({disabled:d||u,kind:E,spinning:v}),i)},c.createElement(w,{...se},f,o?c.createElement("span",null,o):"",l)))}const ve=c.forwardRef(_t);V.Metadata.set(ve,{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"'}},panellable:!0});const Kt={components:[ve],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\u2019s 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`
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react"),R=require("@sps-woodland/core"),Te=require("@react-aria/focus"),y=require("@spscommerce/utils");function Ce(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=Ce(k),Be=typeof document<"u"?k.useLayoutEffect:()=>{};function U(e){const t=k.useRef(null);return Be(()=>{t.current=e},[e]),k.useCallback((...r)=>{const o=t.current;return o==null?void 0:o(...r)},[])}let de=new Map;function _e(e,t){if(e===t)return e;let r=de.get(e);if(r)return r(t),t;let o=de.get(t);return o?(o(e),e):t}function Pe(...e){return(...t)=>{for(let r of e)typeof r=="function"&&r(...t)}}const I=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:I(e).defaultView||window;function $e(e){var t,r,o="";if(typeof e=="string"||typeof e=="number")o+=e;else if(typeof e=="object")if(Array.isArray(e)){var i=e.length;for(t=0;t<i;t++)e[t]&&(r=$e(e[t]))&&(o&&(o+=" "),o+=r)}else for(r in e)e[r]&&(o&&(o+=" "),o+=r);return o}function Ie(){for(var e,t,r=0,o="",i=arguments.length;r<i;r++)(e=arguments[r])&&(t=$e(e))&&(o&&(o+=" "),o+=t);return o}function G(...e){let t={...e[0]};for(let r=1;r<e.length;r++){let o=e[r];for(let i in o){let d=t[i],u=o[i];typeof d=="function"&&typeof u=="function"&&i[0]==="o"&&i[1]==="n"&&i.charCodeAt(2)>=65&&i.charCodeAt(2)<=90?t[i]=Pe(d,u):(i==="className"||i==="UNSAFE_className")&&typeof d=="string"&&typeof u=="string"?t[i]=Ie(d,u):i==="id"&&d&&u?t.id=_e(d,u):t[i]=u!==void 0?u:d}}return t}const Ke=new Set(["id"]),Ae=new Set(["aria-label","aria-labelledby","aria-describedby","aria-details"]),Le=new Set(["href","hrefLang","target","rel","download","ping","referrerPolicy"]),Me=/^(data-.*)$/;function Fe(e,t={}){let{labelable:r,isLink:o,propNames:i}=t,d={};for(const u in e)Object.prototype.hasOwnProperty.call(e,u)&&(Ke.has(u)||r&&Ae.has(u)||o&&Le.has(u)||i!=null&&i.has(u)||Me.test(u))&&(d[u]=e[u]);return d}function H(e){if(Ue())e.focus({preventScroll:!0});else{let t=Re(e);e.focus(),He(t)}}let W=null;function Ue(){if(W==null){W=!1;try{document.createElement("div").focus({get preventScroll(){return W=!0,!0}})}catch{}}return W}function Re(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 He(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 le(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 X(){return le(/^Mac/i)}function Ge(){return le(/^iPhone/i)}function we(){return le(/^iPad/i)||X()&&navigator.maxTouchPoints>1}function Se(){return Ge()||we()}function Ve(){return Q(/AppleWebKit/i)&&!We()}function We(){return Q(/Chrome/i)}function xe(){return Q(/Android/i)}function je(){return Q(/Firefox/i)}function V(e,t,r=!0){var o,i;let{metaKey:d,ctrlKey:u,altKey:p,shiftKey:b}=t;je()&&(!((i=window.event)===null||i===void 0||(o=i.type)===null||o===void 0)&&o.startsWith("key"))&&e.target==="_blank"&&(X()?d=!0:u=!0);let E=Ve()&&X()&&!we()?new KeyboardEvent("keydown",{keyIdentifier:"Enter",metaKey:d,ctrlKey:u,altKey:p,shiftKey:b}):new MouseEvent("click",{metaKey:d,ctrlKey:u,altKey:p,shiftKey:b,bubbles:!0,cancelable:!0});V.isOpening=r,H(e),e.dispatchEvent(E),V.isOpening=!1}V.isOpening=!1;let M=new Map,se=new Set;function pe(){if(typeof window>"u")return;function e(o){return"propertyName"in o}let t=o=>{if(!e(o)||!o.target)return;let i=M.get(o.target);i||(i=new Set,M.set(o.target,i),o.target.addEventListener("transitioncancel",r,{once:!0})),i.add(o.propertyName)},r=o=>{if(!e(o)||!o.target)return;let i=M.get(o.target);if(i&&(i.delete(o.propertyName),i.size===0&&(o.target.removeEventListener("transitioncancel",r),M.delete(o.target)),M.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"?pe():document.addEventListener("DOMContentLoaded",pe));function Ye(e){requestAnimationFrame(()=>{M.size===0?e():se.add(e)})}function qe(){let e=k.useRef(new Map),t=k.useCallback((i,d,u,p)=>{let b=p!=null&&p.once?(...E)=>{e.current.delete(u),u(...E)}:u;e.current.set(u,{type:d,eventTarget:i,fn:b,options:p}),i.addEventListener(d,u,p)},[]),r=k.useCallback((i,d,u,p)=>{var b;let E=((b=e.current.get(u))===null||b===void 0?void 0:b.fn)||u;i.removeEventListener(d,E,p),e.current.delete(u)},[]),o=k.useCallback(()=>{e.current.forEach((i,d)=>{r(i.eventTarget,i.type,d,i.options)})},[r]);return k.useEffect(()=>o,[o]),{addGlobalListener:t,removeGlobalListener:r,removeAllGlobalListeners:o}}function ze(e,t){Be(()=>{if(e&&e.ref&&t)return e.ref.current=t.current,()=>{e.ref&&(e.ref.current=null)}})}function fe(e){return e.mozInputSource===0&&e.isTrusted?!0:xe()&&e.pointerType?e.type==="click"&&e.buttons===1:e.detail===0&&!e.pointerType}function Xe(e){return!xe()&&e.width===0&&e.height===0||e.width===1&&e.height===1&&e.pressure===0&&e.detail===0&&e.pointerType==="mouse"}let F="default",ie="",z=new WeakMap;function me(e){if(Se()){if(F==="default"){const t=I(e);ie=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}F="disabled"}else(e instanceof HTMLElement||e instanceof SVGElement)&&(z.set(e,e.style.userSelect),e.style.userSelect="none")}function j(e){if(Se()){if(F!=="disabled")return;F="restoring",setTimeout(()=>{Ye(()=>{if(F==="restoring"){const t=I(e);t.documentElement.style.webkitUserSelect==="none"&&(t.documentElement.style.webkitUserSelect=ie||""),ie="",F="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 Ne=k.createContext({register:()=>{}});Ne.displayName="PressResponderContext";function Je(e,t){return t.get?t.get.call(e):t.value}function Oe(e,t,r){if(!t.has(e))throw new TypeError("attempted to "+r+" private field on non-instance");return t.get(e)}function Qe(e,t){var r=Oe(e,t,"get");return Je(e,r)}function Ze(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function et(e,t,r){Ze(e,t),t.set(e,r)}function tt(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 be(e,t,r){var o=Oe(e,t,"set");return tt(e,o,r),r}function nt(e){let t=k.useContext(Ne);if(t){let{register:r,...o}=t;e=G(o,e),r()}return ze(t,e.ref),e}var Y=new WeakMap;class q{continuePropagation(){be(this,Y,!1)}get shouldStopPropagation(){return Qe(this,Y)}constructor(t,r,o){et(this,Y,{writable:!0,value:void 0}),be(this,Y,!0),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}}const ge=Symbol("linkClicked");function rt(e){let{onPress:t,onPressChange:r,onPressStart:o,onPressEnd:i,onPressUp:d,isDisabled:u,isPressed:p,preventFocusOnPress:b,shouldCancelOnPointerExit:E,allowTextSelectionOnPress:g,ref:C,...x}=nt(e),[m,S]=k.useState(!1),B=k.useRef({isPressed:!1,ignoreEmulatedMouseEvents:!1,ignoreClickAfterPress:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null}),{addGlobalListener:$,removeAllGlobalListeners:N}=qe(),w=U((n,f)=>{let P=B.current;if(u||P.didFirePressStart)return!1;let l=!0;if(P.isTriggeringEvent=!0,o){let v=new q("pressstart",f,n);o(v),l=v.shouldStopPropagation}return r&&r(!0),P.isTriggeringEvent=!1,P.didFirePressStart=!0,S(!0),l}),T=U((n,f,P=!0)=>{let l=B.current;if(!l.didFirePressStart)return!1;l.ignoreClickAfterPress=!0,l.didFirePressStart=!1,l.isTriggeringEvent=!0;let v=!0;if(i){let s=new q("pressend",f,n);i(s),v=s.shouldStopPropagation}if(r&&r(!1),S(!1),t&&P&&!u){let s=new q("press",f,n);t(s),v&&(v=s.shouldStopPropagation)}return l.isTriggeringEvent=!1,v}),D=U((n,f)=>{let P=B.current;if(u)return!1;if(d){P.isTriggeringEvent=!0;let l=new q("pressup",f,n);return d(l),P.isTriggeringEvent=!1,l.shouldStopPropagation}return!0}),O=U(n=>{let f=B.current;f.isPressed&&f.target&&(f.isOverTarget&&f.pointerType!=null&&T(_(f.target,n),f.pointerType,!1),f.isPressed=!1,f.isOverTarget=!1,f.activePointerId=null,f.pointerType=null,N(),g||j(f.target))}),K=U(n=>{E&&O(n)}),ee=k.useMemo(()=>{let n=B.current,f={onKeyDown(l){if(te(l.nativeEvent,l.currentTarget)&&l.currentTarget.contains(l.target)){var v;ye(l.target,l.key)&&l.preventDefault();let s=!0;if(!n.isPressed&&!l.repeat){n.target=l.currentTarget,n.isPressed=!0,s=w(l,"keyboard");let a=l.currentTarget,h=A=>{te(A,a)&&!A.repeat&&a.contains(A.target)&&n.target&&D(_(n.target,A),"keyboard")};$(I(l.currentTarget),"keyup",Pe(h,P),!0)}s&&l.stopPropagation(),l.metaKey&&X()&&((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&&!V.isOpening){let v=!0;if(u&&l.preventDefault(),!n.ignoreClickAfterPress&&!n.ignoreEmulatedMouseEvents&&!n.isPressed&&(n.pointerType==="virtual"||fe(l.nativeEvent))){!u&&!b&&H(l.currentTarget);let s=w(l,"virtual"),a=D(l,"virtual"),h=T(l,"virtual");v=s&&a&&h}n.ignoreEmulatedMouseEvents=!1,n.ignoreClickAfterPress=!1,v&&l.stopPropagation()}}},P=l=>{var v;if(n.isPressed&&n.target&&te(l,n.target)){var s;ye(l.target,l.key)&&l.preventDefault();let h=l.target;T(_(n.target,l),"keyboard",n.target.contains(h)),N(),l.key!=="Enter"&&ue(n.target)&&n.target.contains(h)&&!l[ge]&&(l[ge]=!0,V(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 a;let h=n.metaKeyEvents;n.metaKeyEvents=void 0;for(let A of h.values())(a=n.target)===null||a===void 0||a.dispatchEvent(new KeyboardEvent("keyup",A))}};if(typeof PointerEvent<"u"){f.onPointerDown=a=>{if(a.button!==0||!a.currentTarget.contains(a.target))return;if(Xe(a.nativeEvent)){n.pointerType="virtual";return}ne(a.currentTarget)&&a.preventDefault(),n.pointerType=a.pointerType;let h=!0;n.isPressed||(n.isPressed=!0,n.isOverTarget=!0,n.activePointerId=a.pointerId,n.target=a.currentTarget,!u&&!b&&H(a.currentTarget),g||me(n.target),h=w(a,n.pointerType),$(I(a.currentTarget),"pointermove",l,!1),$(I(a.currentTarget),"pointerup",v,!1),$(I(a.currentTarget),"pointercancel",s,!1)),h&&a.stopPropagation()},f.onMouseDown=a=>{a.currentTarget.contains(a.target)&&a.button===0&&(ne(a.currentTarget)&&a.preventDefault(),a.stopPropagation())},f.onPointerUp=a=>{!a.currentTarget.contains(a.target)||n.pointerType==="virtual"||a.button===0&&L(a,a.currentTarget)&&D(a,n.pointerType||a.pointerType)};let l=a=>{a.pointerId===n.activePointerId&&(n.target&&L(a,n.target)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,w(_(n.target,a),n.pointerType)):n.target&&n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,T(_(n.target,a),n.pointerType,!1),K(a)))},v=a=>{a.pointerId===n.activePointerId&&n.isPressed&&a.button===0&&n.target&&(L(a,n.target)&&n.pointerType!=null?T(_(n.target,a),n.pointerType):n.isOverTarget&&n.pointerType!=null&&T(_(n.target,a),n.pointerType,!1),n.isPressed=!1,n.isOverTarget=!1,n.activePointerId=null,n.pointerType=null,N(),g||j(n.target))},s=a=>{O(a)};f.onDragStart=a=>{a.currentTarget.contains(a.target)&&O(a)}}else{f.onMouseDown=s=>{if(s.button!==0||!s.currentTarget.contains(s.target))return;if(ne(s.currentTarget)&&s.preventDefault(),n.ignoreEmulatedMouseEvents){s.stopPropagation();return}n.isPressed=!0,n.isOverTarget=!0,n.target=s.currentTarget,n.pointerType=fe(s.nativeEvent)?"virtual":"mouse",!u&&!b&&H(s.currentTarget),w(s,n.pointerType)&&s.stopPropagation(),$(I(s.currentTarget),"mouseup",l,!1)},f.onMouseEnter=s=>{if(!s.currentTarget.contains(s.target))return;let a=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!0,a=w(s,n.pointerType)),a&&s.stopPropagation()},f.onMouseLeave=s=>{if(!s.currentTarget.contains(s.target))return;let a=!0;n.isPressed&&!n.ignoreEmulatedMouseEvents&&n.pointerType!=null&&(n.isOverTarget=!1,a=T(s,n.pointerType,!1),K(s)),a&&s.stopPropagation()},f.onMouseUp=s=>{s.currentTarget.contains(s.target)&&!n.ignoreEmulatedMouseEvents&&s.button===0&&D(s,n.pointerType||"mouse")};let l=s=>{if(s.button===0){if(n.isPressed=!1,N(),n.ignoreEmulatedMouseEvents){n.ignoreEmulatedMouseEvents=!1;return}n.target&&L(s,n.target)&&n.pointerType!=null?T(_(n.target,s),n.pointerType):n.target&&n.isOverTarget&&n.pointerType!=null&&T(_(n.target,s),n.pointerType,!1),n.isOverTarget=!1}};f.onTouchStart=s=>{if(!s.currentTarget.contains(s.target))return;let a=ot(s.nativeEvent);if(!a)return;n.activePointerId=a.identifier,n.ignoreEmulatedMouseEvents=!0,n.isOverTarget=!0,n.isPressed=!0,n.target=s.currentTarget,n.pointerType="touch",!u&&!b&&H(s.currentTarget),g||me(n.target),w(s,n.pointerType)&&s.stopPropagation(),$(oe(s.currentTarget),"scroll",v,!0)},f.onTouchMove=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let a=ve(s.nativeEvent,n.activePointerId),h=!0;a&&L(a,s.currentTarget)?!n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!0,h=w(s,n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(n.isOverTarget=!1,h=T(s,n.pointerType,!1),K(s)),h&&s.stopPropagation()},f.onTouchEnd=s=>{if(!s.currentTarget.contains(s.target))return;if(!n.isPressed){s.stopPropagation();return}let a=ve(s.nativeEvent,n.activePointerId),h=!0;a&&L(a,s.currentTarget)&&n.pointerType!=null?(D(s,n.pointerType),h=T(s,n.pointerType)):n.isOverTarget&&n.pointerType!=null&&(h=T(s,n.pointerType,!1)),h&&s.stopPropagation(),n.isPressed=!1,n.activePointerId=null,n.isOverTarget=!1,n.ignoreEmulatedMouseEvents=!0,n.target&&!g&&j(n.target),N()},f.onTouchCancel=s=>{s.currentTarget.contains(s.target)&&(s.stopPropagation(),n.isPressed&&O(s))};let v=s=>{n.isPressed&&s.target.contains(n.target)&&O({currentTarget:n.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};f.onDragStart=s=>{s.currentTarget.contains(s.target)&&O(s)}}return f},[$,u,b,N,g,O,K,T,w,D]);return k.useEffect(()=>()=>{var n;g||j((n=B.current.target)!==null&&n!==void 0?n:void 0)},[g]),{isPressed:p||m,pressProps:G(x,ee)}}function ue(e){return e.tagName==="A"&&e.hasAttribute("href")}function te(e,t){const{key:r,code:o}=e,i=t,d=i.getAttribute("role");return(r==="Enter"||r===" "||r==="Spacebar"||o==="Space")&&!(i instanceof oe(i).HTMLInputElement&&!De(i,r)||i instanceof oe(i).HTMLTextAreaElement||i.isContentEditable)&&!((d==="link"||!d&&ue(i))&&r!=="Enter")}function ot(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}function ve(e,t){const r=e.changedTouches;for(let o=0;o<r.length;o++){const i=r[o];if(i.identifier===t)return i}return null}function _(e,t){return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey}}function st(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 it(e,t){return!(e.left>t.right||t.left>e.right||e.top>t.bottom||t.top>e.bottom)}function L(e,t){let r=t.getBoundingClientRect(),o=st(e);return it(r,o)}function ne(e){return!(e instanceof HTMLElement)||!e.hasAttribute("draggable")}function ye(e,t){return e instanceof HTMLInputElement?!De(e,t):e instanceof HTMLButtonElement?e.type!=="submit"&&e.type!=="reset":!ue(e)}const at=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function De(e,t){return e.type==="checkbox"||e.type==="radio"?t===" ":at.has(e.type)}let J=!1,re=0;function ae(){J=!0,setTimeout(()=>{J=!1},50)}function he(e){e.pointerType==="touch"&&ae()}function lt(){if(!(typeof document>"u"))return typeof PointerEvent<"u"?document.addEventListener("pointerup",he):document.addEventListener("touchend",ae),re++,()=>{re--,!(re>0)&&(typeof PointerEvent<"u"?document.removeEventListener("pointerup",he):document.removeEventListener("touchend",ae))}}function ut(e){let{onHoverStart:t,onHoverChange:r,onHoverEnd:o,isDisabled:i}=e,[d,u]=k.useState(!1),p=k.useRef({isHovered:!1,ignoreEmulatedMouseEvents:!1,pointerType:"",target:null}).current;k.useEffect(lt,[]);let{hoverProps:b,triggerHoverEnd:E}=k.useMemo(()=>{let g=(m,S)=>{if(p.pointerType=S,i||S==="touch"||p.isHovered||!m.currentTarget.contains(m.target))return;p.isHovered=!0;let B=m.currentTarget;p.target=B,t&&t({type:"hoverstart",target:B,pointerType:S}),r&&r(!0),u(!0)},C=(m,S)=>{if(p.pointerType="",p.target=null,S==="touch"||!p.isHovered)return;p.isHovered=!1;let B=m.currentTarget;o&&o({type:"hoverend",target:B,pointerType:S}),r&&r(!1),u(!1)},x={};return typeof PointerEvent<"u"?(x.onPointerEnter=m=>{J&&m.pointerType==="mouse"||g(m,m.pointerType)},x.onPointerLeave=m=>{!i&&m.currentTarget.contains(m.target)&&C(m,m.pointerType)}):(x.onTouchStart=()=>{p.ignoreEmulatedMouseEvents=!0},x.onMouseEnter=m=>{!p.ignoreEmulatedMouseEvents&&!J&&g(m,"mouse"),p.ignoreEmulatedMouseEvents=!1},x.onMouseLeave=m=>{!i&&m.currentTarget.contains(m.target)&&C(m,"mouse")}),{hoverProps:x,triggerHoverEnd:C}},[t,r,o,i,p]);return k.useEffect(()=>{i&&E({currentTarget:p.target},p.pointerType)},[i]),{hoverProps:b,isHovered:d}}function ct(e,t){let{elementType:r="button",isDisabled:o,onPress:i,onPressStart:d,onPressEnd:u,onPressUp:p,onPressChange:b,preventFocusOnPress:E,allowFocusWhenDisabled:g,onClick:C,href:x,target:m,rel:S,type:B="button"}=e,$;r==="button"?$={type:B,disabled:o}:$={role:"button",tabIndex:o?void 0:0,href:r==="a"&&o?void 0:x,target:r==="a"?m:void 0,type:r==="input"?B:void 0,disabled:r==="input"?o:void 0,"aria-disabled":!o||r==="input"?void 0:o,rel:r==="a"?S:void 0};let{pressProps:N,isPressed:w}=rt({onPressStart:d,onPressEnd:u,onPressChange:b,onPress:i,onPressUp:p,isDisabled:o,preventFocusOnPress:E,ref:t}),{focusableProps:T}=Te.useFocusable(e,t);g&&(T.tabIndex=o?-1:T.tabIndex);let D=G(T,N,Fe(e,{labelable:!0}));return{isPressed:w,buttonProps:G($,D,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],onClick:O=>{C&&(C(O),console.warn("onClick is deprecated, please use onPress"))}})}}function dt(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(i){return Object.getOwnPropertyDescriptor(e,i).enumerable})),r.push.apply(r,o)}return r}function Ee(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){dt(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 pt=(e,t,r)=>{for(var o of Object.keys(e)){var i;if(e[o]!==((i=t[o])!==null&&i!==void 0?i:r[o]))return!1}return!0},Z=e=>t=>{var r=e.defaultClassName,o=Ee(Ee({},e.defaultVariants),t);for(var i in o){var d,u=(d=o[i])!==null&&d!==void 0?d:e.defaultVariants[i];if(u!=null){var p=u;typeof p=="boolean"&&(p=p===!0?"true":"false");var b=e.variantClassNames[i][p];b&&(r+=" "+b)}}for(var[E,g]of e.compoundVariants)pt(E,o,e.defaultVariants)&&(r+=" "+g);return r},ft=Z({defaultClassName:"_125pcxy0",variantClassNames:{disabled:{true:"_125pcxy1",false:"_125pcxy2"},kind:{default:"_125pcxy3",link:"_125pcxy4",confirm:"_125pcxy5",delete:"_125pcxy6",key:"_125pcxy7",icon:"_125pcxy8"},spinning:{true:"_125pcxy9",false:"_125pcxya"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[[{kind:"icon",spinning:!0},"_125pcxyb"],[{kind:"default",spinning:!0},"_125pcxyc"],[{kind:"confirm",spinning:!0},"_125pcxyd"],[{kind:"delete",spinning:!0},"_125pcxye"],[{kind:"key",spinning:!0},"_125pcxyf"],[{disabled:!0,spinning:!1},"_125pcxyg"]]}),mt=Z({defaultClassName:"_125pcxyh",variantClassNames:{disabled:{true:"_125pcxyi",false:"_125pcxyj"},kind:{icon:"_125pcxyk",default:"_125pcxyl",delete:"_125pcxym",key:"_125pcxyn",confirm:"_125pcxyo",link:"_125pcxyp"},spinning:{true:"_125pcxyq",false:"_125pcxyr"}},defaultVariants:{disabled:!1,kind:"default",spinning:!1},compoundVariants:[]}),bt="_125pcxyv",gt=Z({defaultClassName:"_125pcxyw",variantClassNames:{spinning:{true:"_125pcxyx",false:"_125pcxyy"}},defaultVariants:{spinning:!1},compoundVariants:[]}),vt=Z({defaultClassName:"_125pcxys",variantClassNames:{spinning:{true:"_125pcxyt",false:"_125pcxyu"}},defaultVariants:{spinning:!1},compoundVariants:[]});function yt({as:e,onClick:t,onPress:r,children:o,className:i,isDisabled:d,disabled:u,href:p,icon:b,kind:E="default",spinning:g,spinningTitle:C,title:x,...m},S){const B=e??(p?"a":"button"),$={onPress:r??t,isDisabled:u??d??g,...m},{"data-testid":N}=m,w=S||c.useRef(null),{buttonProps:T}=ct($,w),{hoverProps:D}=ut({isDisabled:$.isDisabled}),{type:O,...K}=T,ee={...G(K,D),ref:w,title:x,className:p?vt({spinning:g}):mt({disabled:d||u,kind:E,spinning:g}),...p?{href:p}:{type:O}},{t:n}=c.useContext(R.I18nContext),f=b&&c.createElement(R.Icon,{className:bt,icon:b,"aria-hidden":"true","data-testid":`${N}__${b}-icon`});let P;E==="default"||E==="icon"||E==="link"?P="dark":P="light";const l=g&&c.createElement(R.Spinner,{color:P,className:gt({spinning:g}),title:C||n("design-system:button.spinningTitle"),"data-testid":`${N}__spinner`});return c.createElement(Te.FocusRing,null,c.createElement("div",{className:R.cl(ft({disabled:d||u,kind:E,spinning:g}),i)},c.createElement(B,{...ee},f,o?c.createElement("span",null,o):"",l)))}const ce=c.forwardRef(yt);R.Metadata.set(ce,{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"'}},panellable:!0});const ht={components:[ce],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
|
|
@@ -423,4 +423,4 @@
|
|
423
423
|
</>
|
424
424
|
)
|
425
425
|
}
|
426
|
-
`}}}}},
|
426
|
+
`}}}}},kt={Buttons:ht};exports.Button=ce;exports.MANIFEST=kt;
|