@sps-woodland/buttons 8.1.0 → 8.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.cjs.js +1 -1
- package/lib/index.es.js +116 -113
- package/package.json +5 -5
package/lib/index.cjs.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("react"),G=require("@sps-woodland/core"),g=require("@spscommerce/utils"),Re=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function Ue(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const ce=Re(y),d=Ue(y);function De(e){var t,n,o="";if(typeof e=="string"||typeof e=="number")o+=e;else if(typeof e=="object")if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=De(e[t]))&&(o&&(o+=" "),o+=n);else for(t in e)e[t]&&(o&&(o+=" "),o+=t);return o}function Ve(){for(var e,t,n=0,o="";n<arguments.length;)(e=arguments[n++])&&(t=De(e))&&(o&&(o+=" "),o+=t);return o}const ue=typeof document<"u"?ce.default.useLayoutEffect:()=>{};function A(e){const t=y.useRef(null);return ue(()=>{t.current=e},[e]),y.useCallback((...n)=>{const o=t.current;return o(...n)},[])}let ge=new Map;function Ge(e,t){if(e===t)return e;let n=ge.get(e);if(n)return n(t),t;let o=ge.get(t);return o?(o(e),e):t}function We(...e){return(...t)=>{for(let n of e)typeof n=="function"&&n(...t)}}const D=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:D(e).defaultView||window;function U(...e){let t={...e[0]};for(let n=1;n<e.length;n++){let o=e[n];for(let s in o){let u=t[s],c=o[s];typeof u=="function"&&typeof c=="function"&&s[0]==="o"&&s[1]==="n"&&s.charCodeAt(2)>=65&&s.charCodeAt(2)<=90?t[s]=We(u,c):(s==="className"||s==="UNSAFE_className")&&typeof u=="string"&&typeof c=="string"?t[s]=Ve(u,c):s==="id"&&u&&c?t.id=Ge(u,c):t[s]=c!==void 0?c:u}}return t}const He=new Set(["id"]),je=new Set(["aria-label","aria-labelledby","aria-describedby","aria-details"]),ze=new Set(["href","target","rel","download","ping","referrerPolicy"]),Ye=/^(data-.*)$/;function qe(e,t={}){let{labelable:n,isLink:o,propNames:s}=t,u={};for(const c in e)Object.prototype.hasOwnProperty.call(e,c)&&(He.has(c)||n&&je.has(c)||o&&ze.has(c)||(s==null?void 0:s.has(c))||Ye.test(c))&&(u[c]=e[c]);return u}function K(e){if(Xe())e.focus({preventScroll:!0});else{let t=Je(e);e.focus(),Qe(t)}}let q=null;function Xe(){if(q==null){q=!1;try{var e=document.createElement("div");e.focus({get preventScroll(){return q=!0,!0}})}catch{}}return q}function Je(e){for(var t=e.parentNode,n=[],o=document.scrollingElement||document.documentElement;t instanceof HTMLElement&&t!==o;)(t.offsetHeight<t.scrollHeight||t.offsetWidth<t.scrollWidth)&&n.push({element:t,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft}),t=t.parentNode;return o instanceof HTMLElement&&n.push({element:o,scrollTop:o.scrollTop,scrollLeft:o.scrollLeft}),n}function Qe(e){for(let{element:t,scrollTop:n,scrollLeft:o}of e)t.scrollTop=n,t.scrollLeft=o}function ee(e){var t;return typeof window>"u"||window.navigator==null?!1:((t=window.navigator.userAgentData)===null||t===void 0?void 0:t.brands.some(n=>e.test(n.brand)))||e.test(window.navigator.userAgent)}function de(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 W(){return de(/^Mac/i)}function Ze(){return de(/^iPhone/i)}function Oe(){return de(/^iPad/i)||W()&&navigator.maxTouchPoints>1}function Ce(){return Ze()||Oe()}function et(){return ee(/AppleWebKit/i)&&!tt()}function tt(){return ee(/Chrome/i)}function _e(){return ee(/Android/i)}function nt(){return ee(/Firefox/i)}function H(e,t,n=!0){var o,s;let{metaKey:u,ctrlKey:c,altKey:m,shiftKey:p}=t;nt()&&((s=window.event)===null||s===void 0||(o=s.type)===null||o===void 0?void 0:o.startsWith("key"))&&e.target==="_blank"&&(W()?u=!0:c=!0);let h=et()&&W()&&!Oe()?new KeyboardEvent("keydown",{keyIdentifier:"Enter",metaKey:u,ctrlKey:c,altKey:m,shiftKey:p}):new MouseEvent("click",{metaKey:u,ctrlKey:c,altKey:m,shiftKey:p,bubbles:!0,cancelable:!0});H.isOpening=n,K(e),e.dispatchEvent(h),H.isOpening=!1}H.isOpening=!1;let F=new Map,se=new Set;function ve(){if(typeof window>"u")return;let e=n=>{let o=F.get(n.target);o||(o=new Set,F.set(n.target,o),n.target.addEventListener("transitioncancel",t)),o.add(n.propertyName)},t=n=>{let o=F.get(n.target);if(!!o&&(o.delete(n.propertyName),o.size===0&&(n.target.removeEventListener("transitioncancel",t),F.delete(n.target)),F.size===0)){for(let s of se)s();se.clear()}};document.body.addEventListener("transitionrun",e),document.body.addEventListener("transitionend",t)}typeof document<"u"&&(document.readyState!=="loading"?ve():document.addEventListener("DOMContentLoaded",ve));function Ke(e){requestAnimationFrame(()=>{F.size===0?e():se.add(e)})}function rt(){let e=y.useRef(new Map),t=y.useCallback((s,u,c,m)=>{let p=m!=null&&m.once?(...h)=>{e.current.delete(c),c(...h)}:c;e.current.set(c,{type:u,eventTarget:s,fn:p,options:m}),s.addEventListener(u,c,m)},[]),n=y.useCallback((s,u,c,m)=>{var p;let h=((p=e.current.get(c))===null||p===void 0?void 0:p.fn)||c;s.removeEventListener(u,h,m),e.current.delete(c)},[]),o=y.useCallback(()=>{e.current.forEach((s,u)=>{n(s.eventTarget,s.type,u,s.options)})},[n]);return y.useEffect(()=>o,[o]),{addGlobalListener:t,removeGlobalListener:n,removeAllGlobalListeners:o}}function Le(e,t){ue(()=>{if(e&&e.ref&&t)return e.ref.current=t.current,()=>{e.ref.current=null}})}function ae(e){return e.mozInputSource===0&&e.isTrusted?!0:_e()&&e.pointerType?e.type==="click"&&e.buttons===1:e.detail===0&&!e.pointerType}function ot(e){return!_e()&&e.width===0&&e.height===0||e.width===1&&e.height===1&&e.pressure===0&&e.detail===0&&e.pointerType==="mouse"}function st(e,t){return t.get?t.get.call(e):t.value}function Ie(e,t,n){if(!t.has(e))throw new TypeError("attempted to "+n+" private field on non-instance");return t.get(e)}function at(e,t){var n=Ie(e,t,"get");return st(e,n)}function it(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function lt(e,t,n){it(e,t),t.set(e,n)}function ct(e,t,n){if(t.set)t.set.call(e,n);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=n}}function ye(e,t,n){var o=Ie(e,t,"set");return ct(e,o,n),n}let R="default",ie="",Z=new WeakMap;function he(e){if(Ce()){if(R==="default"){const t=D(e);ie=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}R="disabled"}else(e instanceof HTMLElement||e instanceof SVGElement)&&(Z.set(e,e.style.userSelect),e.style.userSelect="none")}function X(e){if(Ce()){if(R!=="disabled")return;R="restoring",setTimeout(()=>{Ke(()=>{if(R==="restoring"){const t=D(e);t.documentElement.style.webkitUserSelect==="none"&&(t.documentElement.style.webkitUserSelect=ie||""),ie="",R="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&Z.has(e)){let t=Z.get(e);e.style.userSelect==="none"&&t&&(e.style.userSelect=t),e.getAttribute("style")===""&&e.removeAttribute("style"),Z.delete(e)}}const Me=ce.default.createContext({register:()=>{}});Me.displayName="PressResponderContext";function ut(e){let t=y.useContext(Me);if(t){let{register:n,...o}=t;e=U(o,e),n()}return Le(t,e.ref),e}var J=new WeakMap;class Q{continuePropagation(){ye(this,J,!1)}get shouldStopPropagation(){return at(this,J)}constructor(t,n,o){lt(this,J,{writable:!0,value:void 0}),ye(this,J,!0),this.type=t,this.pointerType=n,this.target=o.currentTarget,this.shiftKey=o.shiftKey,this.metaKey=o.metaKey,this.ctrlKey=o.ctrlKey,this.altKey=o.altKey}}const $e=Symbol("linkClicked");function dt(e){let{onPress:t,onPressChange:n,onPressStart:o,onPressEnd:s,onPressUp:u,isDisabled:c,isPressed:m,preventFocusOnPress:p,shouldCancelOnPointerExit:h,allowTextSelectionOnPress:k,ref:O,...C}=ut(e),[V,_]=y.useState(!1),P=y.useRef({isPressed:!1,ignoreEmulatedMouseEvents:!1,ignoreClickAfterPress:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null}),{addGlobalListener:T,removeAllGlobalListeners:S}=rt(),w=A((r,f)=>{let x=P.current;if(c||x.didFirePressStart)return!1;let l=!0;if(x.isTriggeringEvent=!0,o){let b=new Q("pressstart",f,r);o(b),l=b.shouldStopPropagation}return n&&n(!0),x.isTriggeringEvent=!1,x.didFirePressStart=!0,_(!0),l}),v=A((r,f,x=!0)=>{let l=P.current;if(!l.didFirePressStart)return!1;l.ignoreClickAfterPress=!0,l.didFirePressStart=!1,l.isTriggeringEvent=!0;let b=!0;if(s){let a=new Q("pressend",f,r);s(a),b=a.shouldStopPropagation}if(n&&n(!1),_(!1),t&&x&&!c){let a=new Q("press",f,r);t(a),b&&(b=a.shouldStopPropagation)}return l.isTriggeringEvent=!1,b}),E=A((r,f)=>{let x=P.current;if(c)return!1;if(u){x.isTriggeringEvent=!0;let l=new Q("pressup",f,r);return u(l),x.isTriggeringEvent=!1,l.shouldStopPropagation}return!0}),B=A(r=>{let f=P.current;f.isPressed&&f.target&&(f.isOverTarget&&f.pointerType!=null&&v(N(f.target,r),f.pointerType,!1),f.isPressed=!1,f.isOverTarget=!1,f.activePointerId=null,f.pointerType=null,S(),k||X(f.target))}),Y=A(r=>{h&&B(r)}),Fe=y.useMemo(()=>{let r=P.current,f={onKeyDown(l){if(ne(l.nativeEvent,l.currentTarget)&&l.currentTarget.contains(l.target)){var b;we(l.target,l.key)&&l.preventDefault();let a=!0;!r.isPressed&&!l.repeat&&(r.target=l.currentTarget,r.isPressed=!0,a=w(l,"keyboard"),T(D(l.currentTarget),"keyup",x,!1)),a&&l.stopPropagation(),l.metaKey&&W()&&((b=r.metaKeyEvents)===null||b===void 0||b.set(l.key,l.nativeEvent))}else l.key==="Meta"&&(r.metaKeyEvents=new Map)},onKeyUp(l){ne(l.nativeEvent,l.currentTarget)&&!l.repeat&&l.currentTarget.contains(l.target)&&r.target&&E(N(r.target,l),"keyboard")},onClick(l){if(!(l&&!l.currentTarget.contains(l.target))&&l&&l.button===0&&!r.isTriggeringEvent&&!H.isOpening){let b=!0;if(c&&l.preventDefault(),!r.ignoreClickAfterPress&&!r.ignoreEmulatedMouseEvents&&!r.isPressed&&(r.pointerType==="virtual"||ae(l.nativeEvent))){!c&&!p&&K(l.currentTarget);let a=w(l,"virtual"),i=E(l,"virtual"),$=v(l,"virtual");b=a&&i&&$}r.ignoreEmulatedMouseEvents=!1,r.ignoreClickAfterPress=!1,b&&l.stopPropagation()}}},x=l=>{var b;if(r.isPressed&&r.target&&ne(l,r.target)){var a;we(l.target,l.key)&&l.preventDefault();let $=l.target,te=v(N(r.target,l),"keyboard",r.target.contains($));S(),te&&l.stopPropagation(),l.key!=="Enter"&&pe(r.target)&&r.target.contains($)&&!l[$e]&&(l[$e]=!0,H(r.target,l,!1)),r.isPressed=!1,(a=r.metaKeyEvents)===null||a===void 0||a.delete(l.key)}else if(l.key==="Meta"&&((b=r.metaKeyEvents)===null||b===void 0?void 0:b.size)){var i;let $=r.metaKeyEvents;r.metaKeyEvents=void 0;for(let te of $.values())(i=r.target)===null||i===void 0||i.dispatchEvent(new KeyboardEvent("keyup",te))}};if(typeof PointerEvent<"u"){f.onPointerDown=i=>{if(i.button!==0||!i.currentTarget.contains(i.target))return;if(ot(i.nativeEvent)){r.pointerType="virtual";return}re(i.currentTarget)&&i.preventDefault(),r.pointerType=i.pointerType;let $=!0;r.isPressed||(r.isPressed=!0,r.isOverTarget=!0,r.activePointerId=i.pointerId,r.target=i.currentTarget,!c&&!p&&K(i.currentTarget),k||he(r.target),$=w(i,r.pointerType),T(D(i.currentTarget),"pointermove",l,!1),T(D(i.currentTarget),"pointerup",b,!1),T(D(i.currentTarget),"pointercancel",a,!1)),$&&i.stopPropagation()},f.onMouseDown=i=>{!i.currentTarget.contains(i.target)||i.button===0&&(re(i.currentTarget)&&i.preventDefault(),i.stopPropagation())},f.onPointerUp=i=>{!i.currentTarget.contains(i.target)||r.pointerType==="virtual"||i.button===0&&I(i,i.currentTarget)&&E(i,r.pointerType||i.pointerType)};let l=i=>{i.pointerId===r.activePointerId&&(r.target&&I(i,r.target)?!r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!0,w(N(r.target,i),r.pointerType)):r.target&&r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!1,v(N(r.target,i),r.pointerType,!1),Y(i)))},b=i=>{i.pointerId===r.activePointerId&&r.isPressed&&i.button===0&&r.target&&(I(i,r.target)&&r.pointerType!=null?v(N(r.target,i),r.pointerType):r.isOverTarget&&r.pointerType!=null&&v(N(r.target,i),r.pointerType,!1),r.isPressed=!1,r.isOverTarget=!1,r.activePointerId=null,r.pointerType=null,S(),k||X(r.target))},a=i=>{B(i)};f.onDragStart=i=>{!i.currentTarget.contains(i.target)||B(i)}}else{f.onMouseDown=a=>{if(a.button!==0||!a.currentTarget.contains(a.target))return;if(re(a.currentTarget)&&a.preventDefault(),r.ignoreEmulatedMouseEvents){a.stopPropagation();return}r.isPressed=!0,r.isOverTarget=!0,r.target=a.currentTarget,r.pointerType=ae(a.nativeEvent)?"virtual":"mouse",!c&&!p&&K(a.currentTarget),w(a,r.pointerType)&&a.stopPropagation(),T(D(a.currentTarget),"mouseup",l,!1)},f.onMouseEnter=a=>{if(!a.currentTarget.contains(a.target))return;let i=!0;r.isPressed&&!r.ignoreEmulatedMouseEvents&&r.pointerType!=null&&(r.isOverTarget=!0,i=w(a,r.pointerType)),i&&a.stopPropagation()},f.onMouseLeave=a=>{if(!a.currentTarget.contains(a.target))return;let i=!0;r.isPressed&&!r.ignoreEmulatedMouseEvents&&r.pointerType!=null&&(r.isOverTarget=!1,i=v(a,r.pointerType,!1),Y(a)),i&&a.stopPropagation()},f.onMouseUp=a=>{!a.currentTarget.contains(a.target)||!r.ignoreEmulatedMouseEvents&&a.button===0&&E(a,r.pointerType||"mouse")};let l=a=>{if(a.button===0){if(r.isPressed=!1,S(),r.ignoreEmulatedMouseEvents){r.ignoreEmulatedMouseEvents=!1;return}r.target&&I(a,r.target)&&r.pointerType!=null?v(N(r.target,a),r.pointerType):r.target&&r.isOverTarget&&r.pointerType!=null&&v(N(r.target,a),r.pointerType,!1),r.isOverTarget=!1}};f.onTouchStart=a=>{if(!a.currentTarget.contains(a.target))return;let i=pt(a.nativeEvent);if(!i)return;r.activePointerId=i.identifier,r.ignoreEmulatedMouseEvents=!0,r.isOverTarget=!0,r.isPressed=!0,r.target=a.currentTarget,r.pointerType="touch",!c&&!p&&K(a.currentTarget),k||he(r.target),w(a,r.pointerType)&&a.stopPropagation(),T(oe(a.currentTarget),"scroll",b,!0)},f.onTouchMove=a=>{if(!a.currentTarget.contains(a.target))return;if(!r.isPressed){a.stopPropagation();return}let i=ke(a.nativeEvent,r.activePointerId),$=!0;i&&I(i,a.currentTarget)?!r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!0,$=w(a,r.pointerType)):r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!1,$=v(a,r.pointerType,!1),Y(a)),$&&a.stopPropagation()},f.onTouchEnd=a=>{if(!a.currentTarget.contains(a.target))return;if(!r.isPressed){a.stopPropagation();return}let i=ke(a.nativeEvent,r.activePointerId),$=!0;i&&I(i,a.currentTarget)&&r.pointerType!=null?(E(a,r.pointerType),$=v(a,r.pointerType)):r.isOverTarget&&r.pointerType!=null&&($=v(a,r.pointerType,!1)),$&&a.stopPropagation(),r.isPressed=!1,r.activePointerId=null,r.isOverTarget=!1,r.ignoreEmulatedMouseEvents=!0,r.target&&!k&&X(r.target),S()},f.onTouchCancel=a=>{!a.currentTarget.contains(a.target)||(a.stopPropagation(),r.isPressed&&B(a))};let b=a=>{r.isPressed&&a.target.contains(r.target)&&B({currentTarget:r.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};f.onDragStart=a=>{!a.currentTarget.contains(a.target)||B(a)}}return f},[T,c,p,S,k,B,Y,v,w,E]);return y.useEffect(()=>()=>{var r;k||X((r=P.current.target)!==null&&r!==void 0?r:void 0)},[k]),{isPressed:m||V,pressProps:U(C,Fe)}}function pe(e){return e.tagName==="A"&&e.hasAttribute("href")}function ne(e,t){const{key:n,code:o}=e,s=t,u=s.getAttribute("role");return(n==="Enter"||n===" "||n==="Spacebar"||o==="Space")&&!(s instanceof oe(s).HTMLInputElement&&!Ae(s,n)||s instanceof oe(s).HTMLTextAreaElement||s.isContentEditable)&&!((u==="link"||!u&&pe(s))&&n!=="Enter")}function pt(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}function ke(e,t){const n=e.changedTouches;for(let o=0;o<n.length;o++){const s=n[o];if(s.identifier===t)return s}return null}function N(e,t){return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey}}function ft(e){let t=0,n=0;return e.width!==void 0?t=e.width/2:e.radiusX!==void 0&&(t=e.radiusX),e.height!==void 0?n=e.height/2:e.radiusY!==void 0&&(n=e.radiusY),{top:e.clientY-n,right:e.clientX+t,bottom:e.clientY+n,left:e.clientX-t}}function mt(e,t){return!(e.left>t.right||t.left>e.right||e.top>t.bottom||t.top>e.bottom)}function I(e,t){let n=t.getBoundingClientRect(),o=ft(e);return mt(n,o)}function re(e){return!(e instanceof HTMLElement)||!e.hasAttribute("draggable")}function we(e,t){return e instanceof HTMLInputElement?!Ae(e,t):e instanceof HTMLButtonElement?e.type!=="submit"&&e.type!=="reset":!pe(e)}const bt=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function Ae(e,t){return e.type==="checkbox"||e.type==="radio"?t===" ":bt.has(e.type)}class gt{isDefaultPrevented(){return this.nativeEvent.defaultPrevented}preventDefault(){this.defaultPrevented=!0,this.nativeEvent.preventDefault()}stopPropagation(){this.nativeEvent.stopPropagation(),this.isPropagationStopped=()=>!0}isPropagationStopped(){return!1}persist(){}constructor(t,n){this.nativeEvent=n,this.target=n.target,this.currentTarget=n.currentTarget,this.relatedTarget=n.relatedTarget,this.bubbles=n.bubbles,this.cancelable=n.cancelable,this.defaultPrevented=n.defaultPrevented,this.eventPhase=n.eventPhase,this.isTrusted=n.isTrusted,this.timeStamp=n.timeStamp,this.type=t}}function vt(e){let t=y.useRef({isFocused:!1,observer:null});ue(()=>{const o=t.current;return()=>{o.observer&&(o.observer.disconnect(),o.observer=null)}},[]);let n=A(o=>{e==null||e(o)});return y.useCallback(o=>{if(o.target instanceof HTMLButtonElement||o.target instanceof HTMLInputElement||o.target instanceof HTMLTextAreaElement||o.target instanceof HTMLSelectElement){t.current.isFocused=!0;let s=o.target,u=c=>{t.current.isFocused=!1,s.disabled&&n(new gt("blur",c)),t.current.observer&&(t.current.observer.disconnect(),t.current.observer=null)};s.addEventListener("focusout",u,{once:!0}),t.current.observer=new MutationObserver(()=>{if(t.current.isFocused&&s.disabled){var c;(c=t.current.observer)===null||c===void 0||c.disconnect();let m=s===document.activeElement?null:document.activeElement;s.dispatchEvent(new FocusEvent("blur",{relatedTarget:m})),s.dispatchEvent(new FocusEvent("focusout",{bubbles:!0,relatedTarget:m}))}}),t.current.observer.observe(s,{attributes:!0,attributeFilter:["disabled"]})}},[n])}function yt(e){let{isDisabled:t,onFocus:n,onBlur:o,onFocusChange:s}=e;const u=y.useCallback(p=>{if(p.target===p.currentTarget)return o&&o(p),s&&s(!1),!0},[o,s]),c=vt(u),m=y.useCallback(p=>{p.target===p.currentTarget&&document.activeElement===p.target&&(n&&n(p),s&&s(!0),c(p))},[s,n,c]);return{focusProps:{onFocus:!t&&(n||s||o)?m:void 0,onBlur:!t&&(o||s)?u:void 0}}}let j=null,ht=new Set,Te=!1,L=!1,le=!1;function fe(e,t){for(let n of ht)n(e,t)}function $t(e){return!(e.metaKey||!W()&&e.altKey||e.ctrlKey||e.key==="Control"||e.key==="Shift"||e.key==="Meta")}function Pe(e){L=!0,$t(e)&&(j="keyboard",fe("keyboard",e))}function M(e){j="pointer",(e.type==="mousedown"||e.type==="pointerdown")&&(L=!0,fe("pointer",e))}function kt(e){ae(e)&&(L=!0,j="virtual")}function wt(e){e.target===window||e.target===document||(!L&&!le&&(j="virtual",fe("virtual",e)),L=!1,le=!1)}function Tt(){L=!1,le=!0}function Be(){if(typeof window>"u"||Te)return;let e=HTMLElement.prototype.focus;HTMLElement.prototype.focus=function(){L=!0,e.apply(this,arguments)},document.addEventListener("keydown",Pe,!0),document.addEventListener("keyup",Pe,!0),document.addEventListener("click",kt,!0),window.addEventListener("focus",wt,!0),window.addEventListener("blur",Tt,!1),typeof PointerEvent<"u"?(document.addEventListener("pointerdown",M,!0),document.addEventListener("pointermove",M,!0),document.addEventListener("pointerup",M,!0)):(document.addEventListener("mousedown",M,!0),document.addEventListener("mousemove",M,!0),document.addEventListener("mouseup",M,!0)),Te=!0}typeof document<"u"&&(document.readyState!=="loading"?Be():document.addEventListener("DOMContentLoaded",Be));function Pt(){return j}function Ee(e){if(!e)return;let t=!0;return n=>{let o={...n,preventDefault(){n.preventDefault()},isDefaultPrevented(){return n.isDefaultPrevented()},stopPropagation(){console.error("stopPropagation is now the default behavior for events in React Spectrum. You can use continuePropagation() to revert this behavior.")},continuePropagation(){t=!1}};e(o),t&&n.stopPropagation()}}function Bt(e){return{keyboardProps:e.isDisabled?{}:{onKeyDown:Ee(e.onKeyDown),onKeyUp:Ee(e.onKeyUp)}}}function Et(e){if(Pt()==="virtual"){let t=document.activeElement;Ke(()=>{document.activeElement===t&&document.contains(e)&&K(e)})}else K(e)}function xt(e,t){return!e||!t?!1:t.some(n=>n.contains(e))}class me{get size(){return this.fastMap.size}getTreeNode(t){return this.fastMap.get(t)}addTreeNode(t,n,o){let s=this.fastMap.get(n!=null?n:null);if(!s)return;let u=new xe({scopeRef:t});s.addChild(u),u.parent=s,this.fastMap.set(t,u),o&&(u.nodeToRestore=o)}addNode(t){this.fastMap.set(t.scopeRef,t)}removeTreeNode(t){if(t===null)return;let n=this.fastMap.get(t);if(!n)return;let o=n.parent;for(let u of this.traverse())u!==n&&n.nodeToRestore&&u.nodeToRestore&&n.scopeRef&&n.scopeRef.current&&xt(u.nodeToRestore,n.scopeRef.current)&&(u.nodeToRestore=n.nodeToRestore);let s=n.children;o&&(o.removeChild(n),s.size>0&&s.forEach(u=>o&&o.addChild(u))),this.fastMap.delete(n.scopeRef)}*traverse(t=this.root){if(t.scopeRef!=null&&(yield t),t.children.size>0)for(let n of t.children)yield*this.traverse(n)}clone(){var t;let n=new me;var o;for(let s of this.traverse())n.addTreeNode(s.scopeRef,(o=(t=s.parent)===null||t===void 0?void 0:t.scopeRef)!==null&&o!==void 0?o:null,s.nodeToRestore);return n}constructor(){this.fastMap=new Map,this.root=new xe({scopeRef:null}),this.fastMap.set(null,this.root)}}class xe{addChild(t){this.children.add(t),t.parent=this}removeChild(t){this.children.delete(t),t.parent=void 0}constructor(t){this.children=new Set,this.contain=!1,this.scopeRef=t.scopeRef}}new me;let St=ce.default.createContext(null);function Nt(e){let t=y.useContext(St)||{};Le(t,e);let{ref:n,...o}=t;return o}function Dt(e,t){let{focusProps:n}=yt(e),{keyboardProps:o}=Bt(e),s=U(n,o),u=Nt(t),c=e.isDisabled?{}:u,m=y.useRef(e.autoFocus);return y.useEffect(()=>{m.current&&t.current&&Et(t.current),m.current=!1},[t]),{focusableProps:U({...s,tabIndex:e.excludeFromTabOrder&&!e.isDisabled?-1:void 0},c)}}function Ot(e,t){let{elementType:n="button",isDisabled:o,onPress:s,onPressStart:u,onPressEnd:c,onPressUp:m,onPressChange:p,preventFocusOnPress:h,allowFocusWhenDisabled:k,onClick:O,href:C,target:V,rel:_,type:P="button"}=e,T;n==="button"?T={type:P,disabled:o}:T={role:"button",tabIndex:o?void 0:0,href:n==="a"&&o?void 0:C,target:n==="a"?V:void 0,type:n==="input"?P:void 0,disabled:n==="input"?o:void 0,"aria-disabled":!o||n==="input"?void 0:o,rel:n==="a"?_:void 0};let{pressProps:S,isPressed:w}=dt({onPressStart:u,onPressEnd:c,onPressChange:p,onPress:s,onPressUp:m,isDisabled:o,preventFocusOnPress:h,ref:t}),{focusableProps:v}=Dt(e,t);k&&(v.tabIndex=o?-1:v.tabIndex);let E=U(v,S,qe(e,{labelable:!0}));return{isPressed:w,buttonProps:U(T,E,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],onClick:B=>{O&&(O(B),console.warn("onClick is deprecated, please use onPress"))}})}}function Ct(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Se(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(s){return Object.getOwnPropertyDescriptor(e,s).enumerable})),n.push.apply(n,o)}return n}function Ne(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Se(Object(n),!0).forEach(function(o){Ct(e,o,n[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Se(Object(n)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(n,o))})}return e}var _t=(e,t,n)=>{for(var o of Object.keys(e)){var s;if(e[o]!==((s=t[o])!==null&&s!==void 0?s:n[o]))return!1}return!0},z=e=>t=>{var n=e.defaultClassName,o=Ne(Ne({},e.defaultVariants),t);for(var s in o){var u,c=(u=o[s])!==null&&u!==void 0?u:e.defaultVariants[s];if(c!=null){var m=c;typeof m=="boolean"&&(m=m===!0?"true":"false");var p=e.variantClassNames[s][m];p&&(n+=" "+p)}}for(var[h,k]of e.compoundVariants)_t(h,o,e.defaultVariants)&&(n+=" "+k);return n},Kt=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"]]}),Lt=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:[]}),It=z({defaultClassName:"_125pcxyv",variantClassNames:{kind:{icon:"_125pcxyw",default:"_125pcxyx",key:"_125pcxyy",delete:"_125pcxyz",confirm:"_125pcxy10",link:"_125pcxy11"}},defaultVariants:{kind:"default"},compoundVariants:[]}),Mt=z({defaultClassName:"_125pcxy12",variantClassNames:{spinning:{true:"_125pcxy13",false:"_125pcxy14"}},defaultVariants:{spinning:!1},compoundVariants:[]}),At=z({defaultClassName:"_125pcxys",variantClassNames:{spinning:{true:"_125pcxyt",false:"_125pcxyu"}},defaultVariants:{spinning:!1},compoundVariants:[]});const be=d.forwardRef(({onClick:e,onPress:t,children:n,className:o,isDisabled:s,disabled:u,href:c,icon:m,kind:p="default",spinning:h,spinningTitle:k,...O},C)=>{var B;const V={onPress:t!=null?t:e,isDisabled:(B=u!=null?u:s)!=null?B:h,...O},{"data-testid":_}=O,P=C!=null?C:d.useRef(null),{buttonProps:T}=Ot(V,P),{t:S}=d.useContext(G.I18nContext),w=m&&d.createElement(G.Icon,{className:It({kind:p}),icon:m,"aria-hidden":"true","data-testid":`${_}__${m}-icon`});let v;p==="default"||p==="icon"||p==="link"?v="dark":v="light";const E=h&&d.createElement(G.Spinner,{color:v,className:Mt({spinning:h}),title:k||S("design-system:button.spinningTitle"),"data-testid":`${_}__spinner`});return d.createElement("div",{className:G.cl(Kt({disabled:s||u,kind:p,spinning:h}),o)},c?d.createElement("a",{className:At({spinning:h}),...O,href:c},w,n,E):d.createElement(d.Fragment,null,d.createElement("button",{className:Lt({disabled:s||u,kind:p,spinning:h}),disabled:s,...T,ref:P},w,n,E)))});G.Metadata.set(be,{name:"Buttons",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"'}}});const Ft={components:[be],description:()=>d.createElement(d.Fragment,null,d.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."),d.createElement("br",null),d.createElement("h5",null,"Variants"),d.createElement("div",{className:"sps-body-14"},d.createElement("span",{className:"sps-text-semibold"},"Default: "),"For tertiary actions or actions of lower importance on a page."),d.createElement("div",{className:"sps-body-14"},d.createElement("span",{className:"sps-text-semibold"},"Key: "),"For primary or important actions on a page."),d.createElement("div",{className:"sps-body-14"},d.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."),d.createElement("div",{className:"sps-body-14"},d.createElement("span",{className:"sps-text-semibold"},"Delete: "),"For deleting information or another destructive action. These should always be paired with a Delete Confirmation Modal."),d.createElement("div",{className:"sps-body-14"},d.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."),d.createElement("div",{className:"sps-body-14"},d.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})=>d.createElement(d.Fragment,null,d.createElement("p",null,"The most common type of button that can be used in most cases. Example: Basic Buttons in a ",d.createElement(e,{to:"modals"},"Modal"),".")),examples:{withoutIcons:{description:"Without Icons",react:g.code`
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("react"),W=require("@sps-woodland/core"),g=require("@spscommerce/utils"),Re=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function Ue(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const ce=Re(v),d=Ue(v);function De(e){var t,n,o="";if(typeof e=="string"||typeof e=="number")o+=e;else if(typeof e=="object")if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=De(e[t]))&&(o&&(o+=" "),o+=n);else for(t in e)e[t]&&(o&&(o+=" "),o+=t);return o}function Ve(){for(var e,t,n=0,o="";n<arguments.length;)(e=arguments[n++])&&(t=De(e))&&(o&&(o+=" "),o+=t);return o}const ue=typeof document<"u"?ce.default.useLayoutEffect:()=>{};function R(e){const t=v.useRef(null);return ue(()=>{t.current=e},[e]),v.useCallback((...n)=>{const o=t.current;return o(...n)},[])}let ge=new Map;function Ge(e,t){if(e===t)return e;let n=ge.get(e);if(n)return n(t),t;let o=ge.get(t);return o?(o(e),e):t}function We(...e){return(...t)=>{for(let n of e)typeof n=="function"&&n(...t)}}const D=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:D(e).defaultView||window;function G(...e){let t={...e[0]};for(let n=1;n<e.length;n++){let o=e[n];for(let s in o){let u=t[s],c=o[s];typeof u=="function"&&typeof c=="function"&&s[0]==="o"&&s[1]==="n"&&s.charCodeAt(2)>=65&&s.charCodeAt(2)<=90?t[s]=We(u,c):(s==="className"||s==="UNSAFE_className")&&typeof u=="string"&&typeof c=="string"?t[s]=Ve(u,c):s==="id"&&u&&c?t.id=Ge(u,c):t[s]=c!==void 0?c:u}}return t}const He=new Set(["id"]),je=new Set(["aria-label","aria-labelledby","aria-describedby","aria-details"]),ze=new Set(["href","target","rel","download","ping","referrerPolicy"]),Ye=/^(data-.*)$/;function qe(e,t={}){let{labelable:n,isLink:o,propNames:s}=t,u={};for(const c in e)Object.prototype.hasOwnProperty.call(e,c)&&(He.has(c)||n&&je.has(c)||o&&ze.has(c)||(s==null?void 0:s.has(c))||Ye.test(c))&&(u[c]=e[c]);return u}function K(e){if(Xe())e.focus({preventScroll:!0});else{let t=Je(e);e.focus(),Qe(t)}}let q=null;function Xe(){if(q==null){q=!1;try{var e=document.createElement("div");e.focus({get preventScroll(){return q=!0,!0}})}catch{}}return q}function Je(e){for(var t=e.parentNode,n=[],o=document.scrollingElement||document.documentElement;t instanceof HTMLElement&&t!==o;)(t.offsetHeight<t.scrollHeight||t.offsetWidth<t.scrollWidth)&&n.push({element:t,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft}),t=t.parentNode;return o instanceof HTMLElement&&n.push({element:o,scrollTop:o.scrollTop,scrollLeft:o.scrollLeft}),n}function Qe(e){for(let{element:t,scrollTop:n,scrollLeft:o}of e)t.scrollTop=n,t.scrollLeft=o}function ee(e){var t;return typeof window>"u"||window.navigator==null?!1:((t=window.navigator.userAgentData)===null||t===void 0?void 0:t.brands.some(n=>e.test(n.brand)))||e.test(window.navigator.userAgent)}function de(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 H(){return de(/^Mac/i)}function Ze(){return de(/^iPhone/i)}function Oe(){return de(/^iPad/i)||H()&&navigator.maxTouchPoints>1}function Ce(){return Ze()||Oe()}function et(){return ee(/AppleWebKit/i)&&!tt()}function tt(){return ee(/Chrome/i)}function _e(){return ee(/Android/i)}function nt(){return ee(/Firefox/i)}function j(e,t,n=!0){var o,s;let{metaKey:u,ctrlKey:c,altKey:m,shiftKey:p}=t;nt()&&((s=window.event)===null||s===void 0||(o=s.type)===null||o===void 0?void 0:o.startsWith("key"))&&e.target==="_blank"&&(H()?u=!0:c=!0);let h=et()&&H()&&!Oe()?new KeyboardEvent("keydown",{keyIdentifier:"Enter",metaKey:u,ctrlKey:c,altKey:m,shiftKey:p}):new MouseEvent("click",{metaKey:u,ctrlKey:c,altKey:m,shiftKey:p,bubbles:!0,cancelable:!0});j.isOpening=n,K(e),e.dispatchEvent(h),j.isOpening=!1}j.isOpening=!1;let U=new Map,se=new Set;function ve(){if(typeof window>"u")return;let e=n=>{let o=U.get(n.target);o||(o=new Set,U.set(n.target,o),n.target.addEventListener("transitioncancel",t)),o.add(n.propertyName)},t=n=>{let o=U.get(n.target);if(!!o&&(o.delete(n.propertyName),o.size===0&&(n.target.removeEventListener("transitioncancel",t),U.delete(n.target)),U.size===0)){for(let s of se)s();se.clear()}};document.body.addEventListener("transitionrun",e),document.body.addEventListener("transitionend",t)}typeof document<"u"&&(document.readyState!=="loading"?ve():document.addEventListener("DOMContentLoaded",ve));function Ke(e){requestAnimationFrame(()=>{U.size===0?e():se.add(e)})}function rt(){let e=v.useRef(new Map),t=v.useCallback((s,u,c,m)=>{let p=m!=null&&m.once?(...h)=>{e.current.delete(c),c(...h)}:c;e.current.set(c,{type:u,eventTarget:s,fn:p,options:m}),s.addEventListener(u,c,m)},[]),n=v.useCallback((s,u,c,m)=>{var p;let h=((p=e.current.get(c))===null||p===void 0?void 0:p.fn)||c;s.removeEventListener(u,h,m),e.current.delete(c)},[]),o=v.useCallback(()=>{e.current.forEach((s,u)=>{n(s.eventTarget,s.type,u,s.options)})},[n]);return v.useEffect(()=>o,[o]),{addGlobalListener:t,removeGlobalListener:n,removeAllGlobalListeners:o}}function Le(e,t){ue(()=>{if(e&&e.ref&&t)return e.ref.current=t.current,()=>{e.ref.current=null}})}function ae(e){return e.mozInputSource===0&&e.isTrusted?!0:_e()&&e.pointerType?e.type==="click"&&e.buttons===1:e.detail===0&&!e.pointerType}function ot(e){return!_e()&&e.width===0&&e.height===0||e.width===1&&e.height===1&&e.pressure===0&&e.detail===0&&e.pointerType==="mouse"}function st(e,t){return t.get?t.get.call(e):t.value}function Ie(e,t,n){if(!t.has(e))throw new TypeError("attempted to "+n+" private field on non-instance");return t.get(e)}function at(e,t){var n=Ie(e,t,"get");return st(e,n)}function it(e,t){if(t.has(e))throw new TypeError("Cannot initialize the same private elements twice on an object")}function lt(e,t,n){it(e,t),t.set(e,n)}function ct(e,t,n){if(t.set)t.set.call(e,n);else{if(!t.writable)throw new TypeError("attempted to set read only private field");t.value=n}}function ye(e,t,n){var o=Ie(e,t,"set");return ct(e,o,n),n}let V="default",ie="",Z=new WeakMap;function he(e){if(Ce()){if(V==="default"){const t=D(e);ie=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}V="disabled"}else(e instanceof HTMLElement||e instanceof SVGElement)&&(Z.set(e,e.style.userSelect),e.style.userSelect="none")}function X(e){if(Ce()){if(V!=="disabled")return;V="restoring",setTimeout(()=>{Ke(()=>{if(V==="restoring"){const t=D(e);t.documentElement.style.webkitUserSelect==="none"&&(t.documentElement.style.webkitUserSelect=ie||""),ie="",V="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&Z.has(e)){let t=Z.get(e);e.style.userSelect==="none"&&t&&(e.style.userSelect=t),e.getAttribute("style")===""&&e.removeAttribute("style"),Z.delete(e)}}const Me=ce.default.createContext({register:()=>{}});Me.displayName="PressResponderContext";function ut(e){let t=v.useContext(Me);if(t){let{register:n,...o}=t;e=G(o,e),n()}return Le(t,e.ref),e}var J=new WeakMap;class Q{continuePropagation(){ye(this,J,!1)}get shouldStopPropagation(){return at(this,J)}constructor(t,n,o){lt(this,J,{writable:!0,value:void 0}),ye(this,J,!0),this.type=t,this.pointerType=n,this.target=o.currentTarget,this.shiftKey=o.shiftKey,this.metaKey=o.metaKey,this.ctrlKey=o.ctrlKey,this.altKey=o.altKey}}const $e=Symbol("linkClicked");function dt(e){let{onPress:t,onPressChange:n,onPressStart:o,onPressEnd:s,onPressUp:u,isDisabled:c,isPressed:m,preventFocusOnPress:p,shouldCancelOnPointerExit:h,allowTextSelectionOnPress:k,ref:I,...O}=ut(e),[C,M]=v.useState(!1),P=v.useRef({isPressed:!1,ignoreEmulatedMouseEvents:!1,ignoreClickAfterPress:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null}),{addGlobalListener:w,removeAllGlobalListeners:S}=rt(),T=R((r,f)=>{let x=P.current;if(c||x.didFirePressStart)return!1;let l=!0;if(x.isTriggeringEvent=!0,o){let b=new Q("pressstart",f,r);o(b),l=b.shouldStopPropagation}return n&&n(!0),x.isTriggeringEvent=!1,x.didFirePressStart=!0,M(!0),l}),y=R((r,f,x=!0)=>{let l=P.current;if(!l.didFirePressStart)return!1;l.ignoreClickAfterPress=!0,l.didFirePressStart=!1,l.isTriggeringEvent=!0;let b=!0;if(s){let a=new Q("pressend",f,r);s(a),b=a.shouldStopPropagation}if(n&&n(!1),M(!1),t&&x&&!c){let a=new Q("press",f,r);t(a),b&&(b=a.shouldStopPropagation)}return l.isTriggeringEvent=!1,b}),B=R((r,f)=>{let x=P.current;if(c)return!1;if(u){x.isTriggeringEvent=!0;let l=new Q("pressup",f,r);return u(l),x.isTriggeringEvent=!1,l.shouldStopPropagation}return!0}),E=R(r=>{let f=P.current;f.isPressed&&f.target&&(f.isOverTarget&&f.pointerType!=null&&y(N(f.target,r),f.pointerType,!1),f.isPressed=!1,f.isOverTarget=!1,f.activePointerId=null,f.pointerType=null,S(),k||X(f.target))}),_=R(r=>{h&&E(r)}),Fe=v.useMemo(()=>{let r=P.current,f={onKeyDown(l){if(ne(l.nativeEvent,l.currentTarget)&&l.currentTarget.contains(l.target)){var b;we(l.target,l.key)&&l.preventDefault();let a=!0;!r.isPressed&&!l.repeat&&(r.target=l.currentTarget,r.isPressed=!0,a=T(l,"keyboard"),w(D(l.currentTarget),"keyup",x,!1)),a&&l.stopPropagation(),l.metaKey&&H()&&((b=r.metaKeyEvents)===null||b===void 0||b.set(l.key,l.nativeEvent))}else l.key==="Meta"&&(r.metaKeyEvents=new Map)},onKeyUp(l){ne(l.nativeEvent,l.currentTarget)&&!l.repeat&&l.currentTarget.contains(l.target)&&r.target&&B(N(r.target,l),"keyboard")},onClick(l){if(!(l&&!l.currentTarget.contains(l.target))&&l&&l.button===0&&!r.isTriggeringEvent&&!j.isOpening){let b=!0;if(c&&l.preventDefault(),!r.ignoreClickAfterPress&&!r.ignoreEmulatedMouseEvents&&!r.isPressed&&(r.pointerType==="virtual"||ae(l.nativeEvent))){!c&&!p&&K(l.currentTarget);let a=T(l,"virtual"),i=B(l,"virtual"),$=y(l,"virtual");b=a&&i&&$}r.ignoreEmulatedMouseEvents=!1,r.ignoreClickAfterPress=!1,b&&l.stopPropagation()}}},x=l=>{var b;if(r.isPressed&&r.target&&ne(l,r.target)){var a;we(l.target,l.key)&&l.preventDefault();let $=l.target,te=y(N(r.target,l),"keyboard",r.target.contains($));S(),te&&l.stopPropagation(),l.key!=="Enter"&&pe(r.target)&&r.target.contains($)&&!l[$e]&&(l[$e]=!0,j(r.target,l,!1)),r.isPressed=!1,(a=r.metaKeyEvents)===null||a===void 0||a.delete(l.key)}else if(l.key==="Meta"&&((b=r.metaKeyEvents)===null||b===void 0?void 0:b.size)){var i;let $=r.metaKeyEvents;r.metaKeyEvents=void 0;for(let te of $.values())(i=r.target)===null||i===void 0||i.dispatchEvent(new KeyboardEvent("keyup",te))}};if(typeof PointerEvent<"u"){f.onPointerDown=i=>{if(i.button!==0||!i.currentTarget.contains(i.target))return;if(ot(i.nativeEvent)){r.pointerType="virtual";return}re(i.currentTarget)&&i.preventDefault(),r.pointerType=i.pointerType;let $=!0;r.isPressed||(r.isPressed=!0,r.isOverTarget=!0,r.activePointerId=i.pointerId,r.target=i.currentTarget,!c&&!p&&K(i.currentTarget),k||he(r.target),$=T(i,r.pointerType),w(D(i.currentTarget),"pointermove",l,!1),w(D(i.currentTarget),"pointerup",b,!1),w(D(i.currentTarget),"pointercancel",a,!1)),$&&i.stopPropagation()},f.onMouseDown=i=>{!i.currentTarget.contains(i.target)||i.button===0&&(re(i.currentTarget)&&i.preventDefault(),i.stopPropagation())},f.onPointerUp=i=>{!i.currentTarget.contains(i.target)||r.pointerType==="virtual"||i.button===0&&A(i,i.currentTarget)&&B(i,r.pointerType||i.pointerType)};let l=i=>{i.pointerId===r.activePointerId&&(r.target&&A(i,r.target)?!r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!0,T(N(r.target,i),r.pointerType)):r.target&&r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!1,y(N(r.target,i),r.pointerType,!1),_(i)))},b=i=>{i.pointerId===r.activePointerId&&r.isPressed&&i.button===0&&r.target&&(A(i,r.target)&&r.pointerType!=null?y(N(r.target,i),r.pointerType):r.isOverTarget&&r.pointerType!=null&&y(N(r.target,i),r.pointerType,!1),r.isPressed=!1,r.isOverTarget=!1,r.activePointerId=null,r.pointerType=null,S(),k||X(r.target))},a=i=>{E(i)};f.onDragStart=i=>{!i.currentTarget.contains(i.target)||E(i)}}else{f.onMouseDown=a=>{if(a.button!==0||!a.currentTarget.contains(a.target))return;if(re(a.currentTarget)&&a.preventDefault(),r.ignoreEmulatedMouseEvents){a.stopPropagation();return}r.isPressed=!0,r.isOverTarget=!0,r.target=a.currentTarget,r.pointerType=ae(a.nativeEvent)?"virtual":"mouse",!c&&!p&&K(a.currentTarget),T(a,r.pointerType)&&a.stopPropagation(),w(D(a.currentTarget),"mouseup",l,!1)},f.onMouseEnter=a=>{if(!a.currentTarget.contains(a.target))return;let i=!0;r.isPressed&&!r.ignoreEmulatedMouseEvents&&r.pointerType!=null&&(r.isOverTarget=!0,i=T(a,r.pointerType)),i&&a.stopPropagation()},f.onMouseLeave=a=>{if(!a.currentTarget.contains(a.target))return;let i=!0;r.isPressed&&!r.ignoreEmulatedMouseEvents&&r.pointerType!=null&&(r.isOverTarget=!1,i=y(a,r.pointerType,!1),_(a)),i&&a.stopPropagation()},f.onMouseUp=a=>{!a.currentTarget.contains(a.target)||!r.ignoreEmulatedMouseEvents&&a.button===0&&B(a,r.pointerType||"mouse")};let l=a=>{if(a.button===0){if(r.isPressed=!1,S(),r.ignoreEmulatedMouseEvents){r.ignoreEmulatedMouseEvents=!1;return}r.target&&A(a,r.target)&&r.pointerType!=null?y(N(r.target,a),r.pointerType):r.target&&r.isOverTarget&&r.pointerType!=null&&y(N(r.target,a),r.pointerType,!1),r.isOverTarget=!1}};f.onTouchStart=a=>{if(!a.currentTarget.contains(a.target))return;let i=pt(a.nativeEvent);if(!i)return;r.activePointerId=i.identifier,r.ignoreEmulatedMouseEvents=!0,r.isOverTarget=!0,r.isPressed=!0,r.target=a.currentTarget,r.pointerType="touch",!c&&!p&&K(a.currentTarget),k||he(r.target),T(a,r.pointerType)&&a.stopPropagation(),w(oe(a.currentTarget),"scroll",b,!0)},f.onTouchMove=a=>{if(!a.currentTarget.contains(a.target))return;if(!r.isPressed){a.stopPropagation();return}let i=ke(a.nativeEvent,r.activePointerId),$=!0;i&&A(i,a.currentTarget)?!r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!0,$=T(a,r.pointerType)):r.isOverTarget&&r.pointerType!=null&&(r.isOverTarget=!1,$=y(a,r.pointerType,!1),_(a)),$&&a.stopPropagation()},f.onTouchEnd=a=>{if(!a.currentTarget.contains(a.target))return;if(!r.isPressed){a.stopPropagation();return}let i=ke(a.nativeEvent,r.activePointerId),$=!0;i&&A(i,a.currentTarget)&&r.pointerType!=null?(B(a,r.pointerType),$=y(a,r.pointerType)):r.isOverTarget&&r.pointerType!=null&&($=y(a,r.pointerType,!1)),$&&a.stopPropagation(),r.isPressed=!1,r.activePointerId=null,r.isOverTarget=!1,r.ignoreEmulatedMouseEvents=!0,r.target&&!k&&X(r.target),S()},f.onTouchCancel=a=>{!a.currentTarget.contains(a.target)||(a.stopPropagation(),r.isPressed&&E(a))};let b=a=>{r.isPressed&&a.target.contains(r.target)&&E({currentTarget:r.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};f.onDragStart=a=>{!a.currentTarget.contains(a.target)||E(a)}}return f},[w,c,p,S,k,E,_,y,T,B]);return v.useEffect(()=>()=>{var r;k||X((r=P.current.target)!==null&&r!==void 0?r:void 0)},[k]),{isPressed:m||C,pressProps:G(O,Fe)}}function pe(e){return e.tagName==="A"&&e.hasAttribute("href")}function ne(e,t){const{key:n,code:o}=e,s=t,u=s.getAttribute("role");return(n==="Enter"||n===" "||n==="Spacebar"||o==="Space")&&!(s instanceof oe(s).HTMLInputElement&&!Ae(s,n)||s instanceof oe(s).HTMLTextAreaElement||s.isContentEditable)&&!((u==="link"||!u&&pe(s))&&n!=="Enter")}function pt(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}function ke(e,t){const n=e.changedTouches;for(let o=0;o<n.length;o++){const s=n[o];if(s.identifier===t)return s}return null}function N(e,t){return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey}}function ft(e){let t=0,n=0;return e.width!==void 0?t=e.width/2:e.radiusX!==void 0&&(t=e.radiusX),e.height!==void 0?n=e.height/2:e.radiusY!==void 0&&(n=e.radiusY),{top:e.clientY-n,right:e.clientX+t,bottom:e.clientY+n,left:e.clientX-t}}function mt(e,t){return!(e.left>t.right||t.left>e.right||e.top>t.bottom||t.top>e.bottom)}function A(e,t){let n=t.getBoundingClientRect(),o=ft(e);return mt(n,o)}function re(e){return!(e instanceof HTMLElement)||!e.hasAttribute("draggable")}function we(e,t){return e instanceof HTMLInputElement?!Ae(e,t):e instanceof HTMLButtonElement?e.type!=="submit"&&e.type!=="reset":!pe(e)}const bt=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function Ae(e,t){return e.type==="checkbox"||e.type==="radio"?t===" ":bt.has(e.type)}class gt{isDefaultPrevented(){return this.nativeEvent.defaultPrevented}preventDefault(){this.defaultPrevented=!0,this.nativeEvent.preventDefault()}stopPropagation(){this.nativeEvent.stopPropagation(),this.isPropagationStopped=()=>!0}isPropagationStopped(){return!1}persist(){}constructor(t,n){this.nativeEvent=n,this.target=n.target,this.currentTarget=n.currentTarget,this.relatedTarget=n.relatedTarget,this.bubbles=n.bubbles,this.cancelable=n.cancelable,this.defaultPrevented=n.defaultPrevented,this.eventPhase=n.eventPhase,this.isTrusted=n.isTrusted,this.timeStamp=n.timeStamp,this.type=t}}function vt(e){let t=v.useRef({isFocused:!1,observer:null});ue(()=>{const o=t.current;return()=>{o.observer&&(o.observer.disconnect(),o.observer=null)}},[]);let n=R(o=>{e==null||e(o)});return v.useCallback(o=>{if(o.target instanceof HTMLButtonElement||o.target instanceof HTMLInputElement||o.target instanceof HTMLTextAreaElement||o.target instanceof HTMLSelectElement){t.current.isFocused=!0;let s=o.target,u=c=>{t.current.isFocused=!1,s.disabled&&n(new gt("blur",c)),t.current.observer&&(t.current.observer.disconnect(),t.current.observer=null)};s.addEventListener("focusout",u,{once:!0}),t.current.observer=new MutationObserver(()=>{if(t.current.isFocused&&s.disabled){var c;(c=t.current.observer)===null||c===void 0||c.disconnect();let m=s===document.activeElement?null:document.activeElement;s.dispatchEvent(new FocusEvent("blur",{relatedTarget:m})),s.dispatchEvent(new FocusEvent("focusout",{bubbles:!0,relatedTarget:m}))}}),t.current.observer.observe(s,{attributes:!0,attributeFilter:["disabled"]})}},[n])}function yt(e){let{isDisabled:t,onFocus:n,onBlur:o,onFocusChange:s}=e;const u=v.useCallback(p=>{if(p.target===p.currentTarget)return o&&o(p),s&&s(!1),!0},[o,s]),c=vt(u),m=v.useCallback(p=>{p.target===p.currentTarget&&document.activeElement===p.target&&(n&&n(p),s&&s(!0),c(p))},[s,n,c]);return{focusProps:{onFocus:!t&&(n||s||o)?m:void 0,onBlur:!t&&(o||s)?u:void 0}}}let z=null,ht=new Set,Te=!1,L=!1,le=!1;function fe(e,t){for(let n of ht)n(e,t)}function $t(e){return!(e.metaKey||!H()&&e.altKey||e.ctrlKey||e.key==="Control"||e.key==="Shift"||e.key==="Meta")}function Pe(e){L=!0,$t(e)&&(z="keyboard",fe("keyboard",e))}function F(e){z="pointer",(e.type==="mousedown"||e.type==="pointerdown")&&(L=!0,fe("pointer",e))}function kt(e){ae(e)&&(L=!0,z="virtual")}function wt(e){e.target===window||e.target===document||(!L&&!le&&(z="virtual",fe("virtual",e)),L=!1,le=!1)}function Tt(){L=!1,le=!0}function Be(){if(typeof window>"u"||Te)return;let e=HTMLElement.prototype.focus;HTMLElement.prototype.focus=function(){L=!0,e.apply(this,arguments)},document.addEventListener("keydown",Pe,!0),document.addEventListener("keyup",Pe,!0),document.addEventListener("click",kt,!0),window.addEventListener("focus",wt,!0),window.addEventListener("blur",Tt,!1),typeof PointerEvent<"u"?(document.addEventListener("pointerdown",F,!0),document.addEventListener("pointermove",F,!0),document.addEventListener("pointerup",F,!0)):(document.addEventListener("mousedown",F,!0),document.addEventListener("mousemove",F,!0),document.addEventListener("mouseup",F,!0)),Te=!0}typeof document<"u"&&(document.readyState!=="loading"?Be():document.addEventListener("DOMContentLoaded",Be));function Pt(){return z}function Ee(e){if(!e)return;let t=!0;return n=>{let o={...n,preventDefault(){n.preventDefault()},isDefaultPrevented(){return n.isDefaultPrevented()},stopPropagation(){console.error("stopPropagation is now the default behavior for events in React Spectrum. You can use continuePropagation() to revert this behavior.")},continuePropagation(){t=!1}};e(o),t&&n.stopPropagation()}}function Bt(e){return{keyboardProps:e.isDisabled?{}:{onKeyDown:Ee(e.onKeyDown),onKeyUp:Ee(e.onKeyUp)}}}function Et(e){if(Pt()==="virtual"){let t=document.activeElement;Ke(()=>{document.activeElement===t&&document.contains(e)&&K(e)})}else K(e)}function xt(e,t){return!e||!t?!1:t.some(n=>n.contains(e))}class me{get size(){return this.fastMap.size}getTreeNode(t){return this.fastMap.get(t)}addTreeNode(t,n,o){let s=this.fastMap.get(n!=null?n:null);if(!s)return;let u=new xe({scopeRef:t});s.addChild(u),u.parent=s,this.fastMap.set(t,u),o&&(u.nodeToRestore=o)}addNode(t){this.fastMap.set(t.scopeRef,t)}removeTreeNode(t){if(t===null)return;let n=this.fastMap.get(t);if(!n)return;let o=n.parent;for(let u of this.traverse())u!==n&&n.nodeToRestore&&u.nodeToRestore&&n.scopeRef&&n.scopeRef.current&&xt(u.nodeToRestore,n.scopeRef.current)&&(u.nodeToRestore=n.nodeToRestore);let s=n.children;o&&(o.removeChild(n),s.size>0&&s.forEach(u=>o&&o.addChild(u))),this.fastMap.delete(n.scopeRef)}*traverse(t=this.root){if(t.scopeRef!=null&&(yield t),t.children.size>0)for(let n of t.children)yield*this.traverse(n)}clone(){var t;let n=new me;var o;for(let s of this.traverse())n.addTreeNode(s.scopeRef,(o=(t=s.parent)===null||t===void 0?void 0:t.scopeRef)!==null&&o!==void 0?o:null,s.nodeToRestore);return n}constructor(){this.fastMap=new Map,this.root=new xe({scopeRef:null}),this.fastMap.set(null,this.root)}}class xe{addChild(t){this.children.add(t),t.parent=this}removeChild(t){this.children.delete(t),t.parent=void 0}constructor(t){this.children=new Set,this.contain=!1,this.scopeRef=t.scopeRef}}new me;let St=ce.default.createContext(null);function Nt(e){let t=v.useContext(St)||{};Le(t,e);let{ref:n,...o}=t;return o}function Dt(e,t){let{focusProps:n}=yt(e),{keyboardProps:o}=Bt(e),s=G(n,o),u=Nt(t),c=e.isDisabled?{}:u,m=v.useRef(e.autoFocus);return v.useEffect(()=>{m.current&&t.current&&Et(t.current),m.current=!1},[t]),{focusableProps:G({...s,tabIndex:e.excludeFromTabOrder&&!e.isDisabled?-1:void 0},c)}}function Ot(e,t){let{elementType:n="button",isDisabled:o,onPress:s,onPressStart:u,onPressEnd:c,onPressUp:m,onPressChange:p,preventFocusOnPress:h,allowFocusWhenDisabled:k,onClick:I,href:O,target:C,rel:M,type:P="button"}=e,w;n==="button"?w={type:P,disabled:o}:w={role:"button",tabIndex:o?void 0:0,href:n==="a"&&o?void 0:O,target:n==="a"?C:void 0,type:n==="input"?P:void 0,disabled:n==="input"?o:void 0,"aria-disabled":!o||n==="input"?void 0:o,rel:n==="a"?M:void 0};let{pressProps:S,isPressed:T}=dt({onPressStart:u,onPressEnd:c,onPressChange:p,onPress:s,onPressUp:m,isDisabled:o,preventFocusOnPress:h,ref:t}),{focusableProps:y}=Dt(e,t);k&&(y.tabIndex=o?-1:y.tabIndex);let B=G(y,S,qe(e,{labelable:!0}));return{isPressed:T,buttonProps:G(w,B,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],onClick:E=>{I&&(I(E),console.warn("onClick is deprecated, please use onPress"))}})}}function Ct(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function Se(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(s){return Object.getOwnPropertyDescriptor(e,s).enumerable})),n.push.apply(n,o)}return n}function Ne(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]!=null?arguments[t]:{};t%2?Se(Object(n),!0).forEach(function(o){Ct(e,o,n[o])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Se(Object(n)).forEach(function(o){Object.defineProperty(e,o,Object.getOwnPropertyDescriptor(n,o))})}return e}var _t=(e,t,n)=>{for(var o of Object.keys(e)){var s;if(e[o]!==((s=t[o])!==null&&s!==void 0?s:n[o]))return!1}return!0},Y=e=>t=>{var n=e.defaultClassName,o=Ne(Ne({},e.defaultVariants),t);for(var s in o){var u,c=(u=o[s])!==null&&u!==void 0?u:e.defaultVariants[s];if(c!=null){var m=c;typeof m=="boolean"&&(m=m===!0?"true":"false");var p=e.variantClassNames[s][m];p&&(n+=" "+p)}}for(var[h,k]of e.compoundVariants)_t(h,o,e.defaultVariants)&&(n+=" "+k);return n},Kt=Y({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"]]}),Lt=Y({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:[]}),It=Y({defaultClassName:"_125pcxyv",variantClassNames:{kind:{icon:"_125pcxyw",default:"_125pcxyx",key:"_125pcxyy",delete:"_125pcxyz",confirm:"_125pcxy10",link:"_125pcxy11"}},defaultVariants:{kind:"default"},compoundVariants:[]}),Mt=Y({defaultClassName:"_125pcxy12",variantClassNames:{spinning:{true:"_125pcxy13",false:"_125pcxy14"}},defaultVariants:{spinning:!1},compoundVariants:[]}),At=Y({defaultClassName:"_125pcxys",variantClassNames:{spinning:{true:"_125pcxyt",false:"_125pcxyu"}},defaultVariants:{spinning:!1},compoundVariants:[]});const be=d.forwardRef(({onClick:e,onPress:t,children:n,className:o,isDisabled:s,disabled:u,href:c,icon:m,kind:p="default",spinning:h,spinningTitle:k,title:I,...O},C)=>{var _;const M={onPress:t!=null?t:e,isDisabled:(_=u!=null?u:s)!=null?_:h,...O},{"data-testid":P}=O,w=C!=null?C:d.useRef(null),{buttonProps:S}=Ot(M,w),{t:T}=d.useContext(W.I18nContext),y=m&&d.createElement(W.Icon,{className:It({kind:p}),icon:m,"aria-hidden":"true","data-testid":`${P}__${m}-icon`});let B;p==="default"||p==="icon"||p==="link"?B="dark":B="light";const E=h&&d.createElement(W.Spinner,{color:B,className:Mt({spinning:h}),title:k||T("design-system:button.spinningTitle"),"data-testid":`${P}__spinner`});return d.createElement("div",{className:W.cl(Kt({disabled:s||u,kind:p,spinning:h}),o)},c?d.createElement("a",{className:At({spinning:h}),...O,href:c,title:I},y,n,E):d.createElement(d.Fragment,null,d.createElement("button",{className:Lt({disabled:s||u,kind:p,spinning:h}),disabled:s,...S,ref:w,title:I},y,n,E)))});W.Metadata.set(be,{name:"Buttons",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"'}}});const Ft={components:[be],description:()=>d.createElement(d.Fragment,null,d.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."),d.createElement("br",null),d.createElement("h5",null,"Variants"),d.createElement("div",{className:"sps-body-14"},d.createElement("span",{className:"sps-text-semibold"},"Default: "),"For tertiary actions or actions of lower importance on a page."),d.createElement("div",{className:"sps-body-14"},d.createElement("span",{className:"sps-text-semibold"},"Key: "),"For primary or important actions on a page."),d.createElement("div",{className:"sps-body-14"},d.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."),d.createElement("div",{className:"sps-body-14"},d.createElement("span",{className:"sps-text-semibold"},"Delete: "),"For deleting information or another destructive action. These should always be paired with a Delete Confirmation Modal."),d.createElement("div",{className:"sps-body-14"},d.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."),d.createElement("div",{className:"sps-body-14"},d.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})=>d.createElement(d.Fragment,null,d.createElement("p",null,"The most common type of button that can be used in most cases. Example: Basic Buttons in a ",d.createElement(e,{to:"modals"},"Modal"),".")),examples:{withoutIcons:{description:"Without Icons",react:g.code`
|
2
2
|
import { Button } from "@sps-woodland/buttons";
|
3
3
|
import { sprinkles } from "@sps-woodland/tokens";
|
4
4
|
|
package/lib/index.es.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as d from "react";
|
2
|
-
import ce, { useRef as
|
2
|
+
import ce, { useRef as j, useCallback as K, useEffect as ue, useState as Ve, useMemo as Ge, useContext as De } from "react";
|
3
3
|
import { I18nContext as We, Icon as He, Spinner as je, cl as ze, Metadata as Ye } from "@sps-woodland/core";
|
4
4
|
import { code as g } from "@spscommerce/utils";
|
5
5
|
function Oe(e) {
|
@@ -22,8 +22,8 @@ function Xe() {
|
|
22
22
|
}
|
23
23
|
const de = typeof document < "u" ? ce.useLayoutEffect : () => {
|
24
24
|
};
|
25
|
-
function
|
26
|
-
const t =
|
25
|
+
function R(e) {
|
26
|
+
const t = j(null);
|
27
27
|
return de(() => {
|
28
28
|
t.current = e;
|
29
29
|
}, [
|
@@ -53,7 +53,7 @@ const N = (e) => {
|
|
53
53
|
var t;
|
54
54
|
return (t = e == null ? void 0 : e.ownerDocument) !== null && t !== void 0 ? t : document;
|
55
55
|
}, oe = (e) => e && "window" in e && e.window === e ? e : N(e).defaultView || window;
|
56
|
-
function
|
56
|
+
function G(...e) {
|
57
57
|
let t = {
|
58
58
|
...e[0]
|
59
59
|
};
|
@@ -138,14 +138,14 @@ function pe(e) {
|
|
138
138
|
var t;
|
139
139
|
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;
|
140
140
|
}
|
141
|
-
function
|
141
|
+
function W() {
|
142
142
|
return pe(/^Mac/i);
|
143
143
|
}
|
144
144
|
function at() {
|
145
145
|
return pe(/^iPhone/i);
|
146
146
|
}
|
147
147
|
function Ce() {
|
148
|
-
return pe(/^iPad/i) ||
|
148
|
+
return pe(/^iPad/i) || W() && navigator.maxTouchPoints > 1;
|
149
149
|
}
|
150
150
|
function _e() {
|
151
151
|
return at() || Ce();
|
@@ -162,11 +162,11 @@ function Ke() {
|
|
162
162
|
function ct() {
|
163
163
|
return ee(/Firefox/i);
|
164
164
|
}
|
165
|
-
function
|
165
|
+
function H(e, t, n = !0) {
|
166
166
|
var o, s;
|
167
167
|
let { metaKey: u, ctrlKey: c, altKey: m, shiftKey: p } = t;
|
168
|
-
ct() && ((s = window.event) === null || s === void 0 || (o = s.type) === null || o === void 0 ? void 0 : o.startsWith("key")) && e.target === "_blank" && (
|
169
|
-
let y = it() &&
|
168
|
+
ct() && ((s = window.event) === null || s === void 0 || (o = s.type) === null || o === void 0 ? void 0 : o.startsWith("key")) && e.target === "_blank" && (W() ? u = !0 : c = !0);
|
169
|
+
let y = it() && W() && !Ce() ? new KeyboardEvent("keydown", {
|
170
170
|
keyIdentifier: "Enter",
|
171
171
|
metaKey: u,
|
172
172
|
ctrlKey: c,
|
@@ -180,19 +180,19 @@ function W(e, t, n = !0) {
|
|
180
180
|
bubbles: !0,
|
181
181
|
cancelable: !0
|
182
182
|
});
|
183
|
-
|
183
|
+
H.isOpening = n, _(e), e.dispatchEvent(y), H.isOpening = !1;
|
184
184
|
}
|
185
|
-
|
186
|
-
let
|
185
|
+
H.isOpening = !1;
|
186
|
+
let U = /* @__PURE__ */ new Map(), se = /* @__PURE__ */ new Set();
|
187
187
|
function ve() {
|
188
188
|
if (typeof window > "u")
|
189
189
|
return;
|
190
190
|
let e = (n) => {
|
191
|
-
let o =
|
192
|
-
o || (o = /* @__PURE__ */ new Set(),
|
191
|
+
let o = U.get(n.target);
|
192
|
+
o || (o = /* @__PURE__ */ new Set(), U.set(n.target, o), n.target.addEventListener("transitioncancel", t)), o.add(n.propertyName);
|
193
193
|
}, t = (n) => {
|
194
|
-
let o =
|
195
|
-
if (!!o && (o.delete(n.propertyName), o.size === 0 && (n.target.removeEventListener("transitioncancel", t),
|
194
|
+
let o = U.get(n.target);
|
195
|
+
if (!!o && (o.delete(n.propertyName), o.size === 0 && (n.target.removeEventListener("transitioncancel", t), U.delete(n.target)), U.size === 0)) {
|
196
196
|
for (let s of se)
|
197
197
|
s();
|
198
198
|
se.clear();
|
@@ -203,11 +203,11 @@ function ve() {
|
|
203
203
|
typeof document < "u" && (document.readyState !== "loading" ? ve() : document.addEventListener("DOMContentLoaded", ve));
|
204
204
|
function Le(e) {
|
205
205
|
requestAnimationFrame(() => {
|
206
|
-
|
206
|
+
U.size === 0 ? e() : se.add(e);
|
207
207
|
});
|
208
208
|
}
|
209
209
|
function ut() {
|
210
|
-
let e =
|
210
|
+
let e = j(/* @__PURE__ */ new Map()), t = K((s, u, c, m) => {
|
211
211
|
let p = m != null && m.once ? (...y) => {
|
212
212
|
e.current.delete(c), c(...y);
|
213
213
|
} : c;
|
@@ -282,26 +282,26 @@ function ye(e, t, n) {
|
|
282
282
|
var o = Ae(e, t, "set");
|
283
283
|
return gt(e, o, n), n;
|
284
284
|
}
|
285
|
-
let
|
285
|
+
let V = "default", ie = "", Z = /* @__PURE__ */ new WeakMap();
|
286
286
|
function he(e) {
|
287
287
|
if (_e()) {
|
288
|
-
if (
|
288
|
+
if (V === "default") {
|
289
289
|
const t = N(e);
|
290
290
|
ie = t.documentElement.style.webkitUserSelect, t.documentElement.style.webkitUserSelect = "none";
|
291
291
|
}
|
292
|
-
|
292
|
+
V = "disabled";
|
293
293
|
} else
|
294
294
|
(e instanceof HTMLElement || e instanceof SVGElement) && (Z.set(e, e.style.userSelect), e.style.userSelect = "none");
|
295
295
|
}
|
296
296
|
function q(e) {
|
297
297
|
if (_e()) {
|
298
|
-
if (
|
298
|
+
if (V !== "disabled")
|
299
299
|
return;
|
300
|
-
|
300
|
+
V = "restoring", setTimeout(() => {
|
301
301
|
Le(() => {
|
302
|
-
if (
|
302
|
+
if (V === "restoring") {
|
303
303
|
const t = N(e);
|
304
|
-
t.documentElement.style.webkitUserSelect === "none" && (t.documentElement.style.webkitUserSelect = ie || ""), ie = "",
|
304
|
+
t.documentElement.style.webkitUserSelect === "none" && (t.documentElement.style.webkitUserSelect = ie || ""), ie = "", V = "default";
|
305
305
|
}
|
306
306
|
});
|
307
307
|
}, 300);
|
@@ -319,7 +319,7 @@ function vt(e) {
|
|
319
319
|
let t = De(Me);
|
320
320
|
if (t) {
|
321
321
|
let { register: n, ...o } = t;
|
322
|
-
e =
|
322
|
+
e = G(o, e), n();
|
323
323
|
}
|
324
324
|
return Ie(t, e.ref), e;
|
325
325
|
}
|
@@ -351,9 +351,9 @@ function yt(e) {
|
|
351
351
|
preventFocusOnPress: p,
|
352
352
|
shouldCancelOnPointerExit: y,
|
353
353
|
allowTextSelectionOnPress: $,
|
354
|
-
ref:
|
355
|
-
...
|
356
|
-
} = vt(e), [
|
354
|
+
ref: I,
|
355
|
+
...D
|
356
|
+
} = vt(e), [O, A] = Ve(!1), T = j({
|
357
357
|
isPressed: !1,
|
358
358
|
ignoreEmulatedMouseEvents: !1,
|
359
359
|
ignoreClickAfterPress: !1,
|
@@ -363,7 +363,7 @@ function yt(e) {
|
|
363
363
|
target: null,
|
364
364
|
isOverTarget: !1,
|
365
365
|
pointerType: null
|
366
|
-
}), { addGlobalListener:
|
366
|
+
}), { addGlobalListener: k, removeAllGlobalListeners: x } = ut(), w = R((r, f) => {
|
367
367
|
let E = T.current;
|
368
368
|
if (c || E.didFirePressStart)
|
369
369
|
return !1;
|
@@ -372,8 +372,8 @@ function yt(e) {
|
|
372
372
|
let b = new Q("pressstart", f, r);
|
373
373
|
o(b), l = b.shouldStopPropagation;
|
374
374
|
}
|
375
|
-
return n && n(!0), E.isTriggeringEvent = !1, E.didFirePressStart = !0,
|
376
|
-
}), v =
|
375
|
+
return n && n(!0), E.isTriggeringEvent = !1, E.didFirePressStart = !0, A(!0), l;
|
376
|
+
}), v = R((r, f, E = !0) => {
|
377
377
|
let l = T.current;
|
378
378
|
if (!l.didFirePressStart)
|
379
379
|
return !1;
|
@@ -383,12 +383,12 @@ function yt(e) {
|
|
383
383
|
let a = new Q("pressend", f, r);
|
384
384
|
s(a), b = a.shouldStopPropagation;
|
385
385
|
}
|
386
|
-
if (n && n(!1),
|
386
|
+
if (n && n(!1), A(!1), t && E && !c) {
|
387
387
|
let a = new Q("press", f, r);
|
388
388
|
t(a), b && (b = a.shouldStopPropagation);
|
389
389
|
}
|
390
390
|
return l.isTriggeringEvent = !1, b;
|
391
|
-
}),
|
391
|
+
}), B = R((r, f) => {
|
392
392
|
let E = T.current;
|
393
393
|
if (c)
|
394
394
|
return !1;
|
@@ -398,11 +398,11 @@ function yt(e) {
|
|
398
398
|
return u(l), E.isTriggeringEvent = !1, l.shouldStopPropagation;
|
399
399
|
}
|
400
400
|
return !0;
|
401
|
-
}),
|
401
|
+
}), P = R((r) => {
|
402
402
|
let f = T.current;
|
403
403
|
f.isPressed && f.target && (f.isOverTarget && f.pointerType != null && v(S(f.target, r), f.pointerType, !1), f.isPressed = !1, f.isOverTarget = !1, f.activePointerId = null, f.pointerType = null, x(), $ || q(f.target));
|
404
|
-
}),
|
405
|
-
y &&
|
404
|
+
}), C = R((r) => {
|
405
|
+
y && P(r);
|
406
406
|
}), Ue = Ge(() => {
|
407
407
|
let r = T.current, f = {
|
408
408
|
onKeyDown(l) {
|
@@ -410,19 +410,19 @@ function yt(e) {
|
|
410
410
|
var b;
|
411
411
|
we(l.target, l.key) && l.preventDefault();
|
412
412
|
let a = !0;
|
413
|
-
!r.isPressed && !l.repeat && (r.target = l.currentTarget, r.isPressed = !0, a =
|
413
|
+
!r.isPressed && !l.repeat && (r.target = l.currentTarget, r.isPressed = !0, a = w(l, "keyboard"), k(N(l.currentTarget), "keyup", E, !1)), a && l.stopPropagation(), l.metaKey && W() && ((b = r.metaKeyEvents) === null || b === void 0 || b.set(l.key, l.nativeEvent));
|
414
414
|
} else
|
415
415
|
l.key === "Meta" && (r.metaKeyEvents = /* @__PURE__ */ new Map());
|
416
416
|
},
|
417
417
|
onKeyUp(l) {
|
418
|
-
ne(l.nativeEvent, l.currentTarget) && !l.repeat && l.currentTarget.contains(l.target) && r.target &&
|
418
|
+
ne(l.nativeEvent, l.currentTarget) && !l.repeat && l.currentTarget.contains(l.target) && r.target && B(S(r.target, l), "keyboard");
|
419
419
|
},
|
420
420
|
onClick(l) {
|
421
|
-
if (!(l && !l.currentTarget.contains(l.target)) && l && l.button === 0 && !r.isTriggeringEvent && !
|
421
|
+
if (!(l && !l.currentTarget.contains(l.target)) && l && l.button === 0 && !r.isTriggeringEvent && !H.isOpening) {
|
422
422
|
let b = !0;
|
423
423
|
if (c && l.preventDefault(), !r.ignoreClickAfterPress && !r.ignoreEmulatedMouseEvents && !r.isPressed && (r.pointerType === "virtual" || ae(l.nativeEvent))) {
|
424
424
|
!c && !p && _(l.currentTarget);
|
425
|
-
let a =
|
425
|
+
let a = w(l, "virtual"), i = B(l, "virtual"), h = v(l, "virtual");
|
426
426
|
b = a && i && h;
|
427
427
|
}
|
428
428
|
r.ignoreEmulatedMouseEvents = !1, r.ignoreClickAfterPress = !1, b && l.stopPropagation();
|
@@ -434,7 +434,7 @@ function yt(e) {
|
|
434
434
|
var a;
|
435
435
|
we(l.target, l.key) && l.preventDefault();
|
436
436
|
let h = l.target, te = v(S(r.target, l), "keyboard", r.target.contains(h));
|
437
|
-
x(), te && l.stopPropagation(), l.key !== "Enter" && fe(r.target) && r.target.contains(h) && !l[$e] && (l[$e] = !0,
|
437
|
+
x(), te && l.stopPropagation(), l.key !== "Enter" && fe(r.target) && r.target.contains(h) && !l[$e] && (l[$e] = !0, H(r.target, l, !1)), r.isPressed = !1, (a = r.metaKeyEvents) === null || a === void 0 || a.delete(l.key);
|
438
438
|
} else if (l.key === "Meta" && ((b = r.metaKeyEvents) === null || b === void 0 ? void 0 : b.size)) {
|
439
439
|
var i;
|
440
440
|
let h = r.metaKeyEvents;
|
@@ -453,21 +453,21 @@ function yt(e) {
|
|
453
453
|
}
|
454
454
|
re(i.currentTarget) && i.preventDefault(), r.pointerType = i.pointerType;
|
455
455
|
let h = !0;
|
456
|
-
r.isPressed || (r.isPressed = !0, r.isOverTarget = !0, r.activePointerId = i.pointerId, r.target = i.currentTarget, !c && !p && _(i.currentTarget), $ || he(r.target), h =
|
456
|
+
r.isPressed || (r.isPressed = !0, r.isOverTarget = !0, r.activePointerId = i.pointerId, r.target = i.currentTarget, !c && !p && _(i.currentTarget), $ || he(r.target), h = w(i, r.pointerType), k(N(i.currentTarget), "pointermove", l, !1), k(N(i.currentTarget), "pointerup", b, !1), k(N(i.currentTarget), "pointercancel", a, !1)), h && i.stopPropagation();
|
457
457
|
}, f.onMouseDown = (i) => {
|
458
458
|
!i.currentTarget.contains(i.target) || i.button === 0 && (re(i.currentTarget) && i.preventDefault(), i.stopPropagation());
|
459
459
|
}, f.onPointerUp = (i) => {
|
460
|
-
!i.currentTarget.contains(i.target) || r.pointerType === "virtual" || i.button === 0 &&
|
460
|
+
!i.currentTarget.contains(i.target) || r.pointerType === "virtual" || i.button === 0 && M(i, i.currentTarget) && B(i, r.pointerType || i.pointerType);
|
461
461
|
};
|
462
462
|
let l = (i) => {
|
463
|
-
i.pointerId === r.activePointerId && (r.target &&
|
463
|
+
i.pointerId === r.activePointerId && (r.target && M(i, r.target) ? !r.isOverTarget && r.pointerType != null && (r.isOverTarget = !0, w(S(r.target, i), r.pointerType)) : r.target && r.isOverTarget && r.pointerType != null && (r.isOverTarget = !1, v(S(r.target, i), r.pointerType, !1), C(i)));
|
464
464
|
}, b = (i) => {
|
465
|
-
i.pointerId === r.activePointerId && r.isPressed && i.button === 0 && r.target && (
|
465
|
+
i.pointerId === r.activePointerId && r.isPressed && i.button === 0 && r.target && (M(i, r.target) && r.pointerType != null ? v(S(r.target, i), r.pointerType) : r.isOverTarget && r.pointerType != null && v(S(r.target, i), r.pointerType, !1), r.isPressed = !1, r.isOverTarget = !1, r.activePointerId = null, r.pointerType = null, x(), $ || q(r.target));
|
466
466
|
}, a = (i) => {
|
467
|
-
|
467
|
+
P(i);
|
468
468
|
};
|
469
469
|
f.onDragStart = (i) => {
|
470
|
-
!i.currentTarget.contains(i.target) ||
|
470
|
+
!i.currentTarget.contains(i.target) || P(i);
|
471
471
|
};
|
472
472
|
} else {
|
473
473
|
f.onMouseDown = (a) => {
|
@@ -477,19 +477,19 @@ function yt(e) {
|
|
477
477
|
a.stopPropagation();
|
478
478
|
return;
|
479
479
|
}
|
480
|
-
r.isPressed = !0, r.isOverTarget = !0, r.target = a.currentTarget, r.pointerType = ae(a.nativeEvent) ? "virtual" : "mouse", !c && !p && _(a.currentTarget),
|
480
|
+
r.isPressed = !0, r.isOverTarget = !0, r.target = a.currentTarget, r.pointerType = ae(a.nativeEvent) ? "virtual" : "mouse", !c && !p && _(a.currentTarget), w(a, r.pointerType) && a.stopPropagation(), k(N(a.currentTarget), "mouseup", l, !1);
|
481
481
|
}, f.onMouseEnter = (a) => {
|
482
482
|
if (!a.currentTarget.contains(a.target))
|
483
483
|
return;
|
484
484
|
let i = !0;
|
485
|
-
r.isPressed && !r.ignoreEmulatedMouseEvents && r.pointerType != null && (r.isOverTarget = !0, i =
|
485
|
+
r.isPressed && !r.ignoreEmulatedMouseEvents && r.pointerType != null && (r.isOverTarget = !0, i = w(a, r.pointerType)), i && a.stopPropagation();
|
486
486
|
}, f.onMouseLeave = (a) => {
|
487
487
|
if (!a.currentTarget.contains(a.target))
|
488
488
|
return;
|
489
489
|
let i = !0;
|
490
|
-
r.isPressed && !r.ignoreEmulatedMouseEvents && r.pointerType != null && (r.isOverTarget = !1, i = v(a, r.pointerType, !1),
|
490
|
+
r.isPressed && !r.ignoreEmulatedMouseEvents && r.pointerType != null && (r.isOverTarget = !1, i = v(a, r.pointerType, !1), C(a)), i && a.stopPropagation();
|
491
491
|
}, f.onMouseUp = (a) => {
|
492
|
-
!a.currentTarget.contains(a.target) || !r.ignoreEmulatedMouseEvents && a.button === 0 &&
|
492
|
+
!a.currentTarget.contains(a.target) || !r.ignoreEmulatedMouseEvents && a.button === 0 && B(a, r.pointerType || "mouse");
|
493
493
|
};
|
494
494
|
let l = (a) => {
|
495
495
|
if (a.button === 0) {
|
@@ -497,7 +497,7 @@ function yt(e) {
|
|
497
497
|
r.ignoreEmulatedMouseEvents = !1;
|
498
498
|
return;
|
499
499
|
}
|
500
|
-
r.target &&
|
500
|
+
r.target && M(a, r.target) && r.pointerType != null ? v(S(r.target, a), r.pointerType) : r.target && r.isOverTarget && r.pointerType != null && v(S(r.target, a), r.pointerType, !1), r.isOverTarget = !1;
|
501
501
|
}
|
502
502
|
};
|
503
503
|
f.onTouchStart = (a) => {
|
@@ -506,7 +506,7 @@ function yt(e) {
|
|
506
506
|
let i = ht(a.nativeEvent);
|
507
507
|
if (!i)
|
508
508
|
return;
|
509
|
-
r.activePointerId = i.identifier, r.ignoreEmulatedMouseEvents = !0, r.isOverTarget = !0, r.isPressed = !0, r.target = a.currentTarget, r.pointerType = "touch", !c && !p && _(a.currentTarget), $ || he(r.target),
|
509
|
+
r.activePointerId = i.identifier, r.ignoreEmulatedMouseEvents = !0, r.isOverTarget = !0, r.isPressed = !0, r.target = a.currentTarget, r.pointerType = "touch", !c && !p && _(a.currentTarget), $ || he(r.target), w(a, r.pointerType) && a.stopPropagation(), k(oe(a.currentTarget), "scroll", b, !0);
|
510
510
|
}, f.onTouchMove = (a) => {
|
511
511
|
if (!a.currentTarget.contains(a.target))
|
512
512
|
return;
|
@@ -515,7 +515,7 @@ function yt(e) {
|
|
515
515
|
return;
|
516
516
|
}
|
517
517
|
let i = ke(a.nativeEvent, r.activePointerId), h = !0;
|
518
|
-
i &&
|
518
|
+
i && M(i, a.currentTarget) ? !r.isOverTarget && r.pointerType != null && (r.isOverTarget = !0, h = w(a, r.pointerType)) : r.isOverTarget && r.pointerType != null && (r.isOverTarget = !1, h = v(a, r.pointerType, !1), C(a)), h && a.stopPropagation();
|
519
519
|
}, f.onTouchEnd = (a) => {
|
520
520
|
if (!a.currentTarget.contains(a.target))
|
521
521
|
return;
|
@@ -524,12 +524,12 @@ function yt(e) {
|
|
524
524
|
return;
|
525
525
|
}
|
526
526
|
let i = ke(a.nativeEvent, r.activePointerId), h = !0;
|
527
|
-
i &&
|
527
|
+
i && M(i, a.currentTarget) && r.pointerType != null ? (B(a, r.pointerType), h = v(a, r.pointerType)) : r.isOverTarget && r.pointerType != null && (h = v(a, r.pointerType, !1)), h && a.stopPropagation(), r.isPressed = !1, r.activePointerId = null, r.isOverTarget = !1, r.ignoreEmulatedMouseEvents = !0, r.target && !$ && q(r.target), x();
|
528
528
|
}, f.onTouchCancel = (a) => {
|
529
|
-
!a.currentTarget.contains(a.target) || (a.stopPropagation(), r.isPressed &&
|
529
|
+
!a.currentTarget.contains(a.target) || (a.stopPropagation(), r.isPressed && P(a));
|
530
530
|
};
|
531
531
|
let b = (a) => {
|
532
|
-
r.isPressed && a.target.contains(r.target) &&
|
532
|
+
r.isPressed && a.target.contains(r.target) && P({
|
533
533
|
currentTarget: r.target,
|
534
534
|
shiftKey: !1,
|
535
535
|
ctrlKey: !1,
|
@@ -538,21 +538,21 @@ function yt(e) {
|
|
538
538
|
});
|
539
539
|
};
|
540
540
|
f.onDragStart = (a) => {
|
541
|
-
!a.currentTarget.contains(a.target) ||
|
541
|
+
!a.currentTarget.contains(a.target) || P(a);
|
542
542
|
};
|
543
543
|
}
|
544
544
|
return f;
|
545
545
|
}, [
|
546
|
-
|
546
|
+
k,
|
547
547
|
c,
|
548
548
|
p,
|
549
549
|
x,
|
550
550
|
$,
|
551
|
-
|
552
|
-
|
551
|
+
P,
|
552
|
+
C,
|
553
553
|
v,
|
554
|
-
|
555
|
-
|
554
|
+
w,
|
555
|
+
B
|
556
556
|
]);
|
557
557
|
return ue(() => () => {
|
558
558
|
var r;
|
@@ -560,8 +560,8 @@ function yt(e) {
|
|
560
560
|
}, [
|
561
561
|
$
|
562
562
|
]), {
|
563
|
-
isPressed: m ||
|
564
|
-
pressProps:
|
563
|
+
isPressed: m || O,
|
564
|
+
pressProps: G(D, Ue)
|
565
565
|
};
|
566
566
|
}
|
567
567
|
function fe(e) {
|
@@ -605,7 +605,7 @@ function $t(e) {
|
|
605
605
|
function kt(e, t) {
|
606
606
|
return !(e.left > t.right || t.left > e.right || e.top > t.bottom || t.top > e.bottom);
|
607
607
|
}
|
608
|
-
function
|
608
|
+
function M(e, t) {
|
609
609
|
let n = t.getBoundingClientRect(), o = $t(e);
|
610
610
|
return kt(n, o);
|
611
611
|
}
|
@@ -649,7 +649,7 @@ class Tt {
|
|
649
649
|
}
|
650
650
|
}
|
651
651
|
function Bt(e) {
|
652
|
-
let t =
|
652
|
+
let t = j({
|
653
653
|
isFocused: !1,
|
654
654
|
observer: null
|
655
655
|
});
|
@@ -659,7 +659,7 @@ function Bt(e) {
|
|
659
659
|
o.observer && (o.observer.disconnect(), o.observer = null);
|
660
660
|
};
|
661
661
|
}, []);
|
662
|
-
let n =
|
662
|
+
let n = R((o) => {
|
663
663
|
e == null || e(o);
|
664
664
|
});
|
665
665
|
return K((o) => {
|
@@ -715,25 +715,25 @@ function Pt(e) {
|
|
715
715
|
}
|
716
716
|
};
|
717
717
|
}
|
718
|
-
let
|
718
|
+
let z = null, Et = /* @__PURE__ */ new Set(), Te = !1, L = !1, le = !1;
|
719
719
|
function me(e, t) {
|
720
720
|
for (let n of Et)
|
721
721
|
n(e, t);
|
722
722
|
}
|
723
723
|
function xt(e) {
|
724
|
-
return !(e.metaKey || !
|
724
|
+
return !(e.metaKey || !W() && e.altKey || e.ctrlKey || e.key === "Control" || e.key === "Shift" || e.key === "Meta");
|
725
725
|
}
|
726
726
|
function Be(e) {
|
727
|
-
L = !0, xt(e) && (
|
727
|
+
L = !0, xt(e) && (z = "keyboard", me("keyboard", e));
|
728
728
|
}
|
729
|
-
function
|
730
|
-
|
729
|
+
function F(e) {
|
730
|
+
z = "pointer", (e.type === "mousedown" || e.type === "pointerdown") && (L = !0, me("pointer", e));
|
731
731
|
}
|
732
732
|
function St(e) {
|
733
|
-
ae(e) && (L = !0,
|
733
|
+
ae(e) && (L = !0, z = "virtual");
|
734
734
|
}
|
735
735
|
function Nt(e) {
|
736
|
-
e.target === window || e.target === document || (!L && !le && (
|
736
|
+
e.target === window || e.target === document || (!L && !le && (z = "virtual", me("virtual", e)), L = !1, le = !1);
|
737
737
|
}
|
738
738
|
function Dt() {
|
739
739
|
L = !1, le = !0;
|
@@ -744,11 +744,11 @@ function Pe() {
|
|
744
744
|
let e = HTMLElement.prototype.focus;
|
745
745
|
HTMLElement.prototype.focus = function() {
|
746
746
|
L = !0, e.apply(this, arguments);
|
747
|
-
}, document.addEventListener("keydown", Be, !0), document.addEventListener("keyup", Be, !0), document.addEventListener("click", St, !0), window.addEventListener("focus", Nt, !0), window.addEventListener("blur", Dt, !1), typeof PointerEvent < "u" ? (document.addEventListener("pointerdown",
|
747
|
+
}, document.addEventListener("keydown", Be, !0), document.addEventListener("keyup", Be, !0), document.addEventListener("click", St, !0), window.addEventListener("focus", Nt, !0), window.addEventListener("blur", Dt, !1), typeof PointerEvent < "u" ? (document.addEventListener("pointerdown", F, !0), document.addEventListener("pointermove", F, !0), document.addEventListener("pointerup", F, !0)) : (document.addEventListener("mousedown", F, !0), document.addEventListener("mousemove", F, !0), document.addEventListener("mouseup", F, !0)), Te = !0;
|
748
748
|
}
|
749
749
|
typeof document < "u" && (document.readyState !== "loading" ? Pe() : document.addEventListener("DOMContentLoaded", Pe));
|
750
750
|
function Ot() {
|
751
|
-
return
|
751
|
+
return z;
|
752
752
|
}
|
753
753
|
function Ee(e) {
|
754
754
|
if (!e)
|
@@ -863,13 +863,13 @@ function It(e) {
|
|
863
863
|
return o;
|
864
864
|
}
|
865
865
|
function At(e, t) {
|
866
|
-
let { focusProps: n } = Pt(e), { keyboardProps: o } = Ct(e), s =
|
866
|
+
let { focusProps: n } = Pt(e), { keyboardProps: o } = Ct(e), s = G(n, o), u = It(t), c = e.isDisabled ? {} : u, m = j(e.autoFocus);
|
867
867
|
return ue(() => {
|
868
868
|
m.current && t.current && _t(t.current), m.current = !1;
|
869
869
|
}, [
|
870
870
|
t
|
871
871
|
]), {
|
872
|
-
focusableProps:
|
872
|
+
focusableProps: G({
|
873
873
|
...s,
|
874
874
|
tabIndex: e.excludeFromTabOrder && !e.isDisabled ? -1 : void 0
|
875
875
|
}, c)
|
@@ -886,26 +886,26 @@ function Mt(e, t) {
|
|
886
886
|
onPressChange: p,
|
887
887
|
preventFocusOnPress: y,
|
888
888
|
allowFocusWhenDisabled: $,
|
889
|
-
onClick:
|
890
|
-
href:
|
891
|
-
target:
|
892
|
-
rel:
|
889
|
+
onClick: I,
|
890
|
+
href: D,
|
891
|
+
target: O,
|
892
|
+
rel: A,
|
893
893
|
type: T = "button"
|
894
|
-
} = e,
|
895
|
-
n === "button" ?
|
894
|
+
} = e, k;
|
895
|
+
n === "button" ? k = {
|
896
896
|
type: T,
|
897
897
|
disabled: o
|
898
|
-
} :
|
898
|
+
} : k = {
|
899
899
|
role: "button",
|
900
900
|
tabIndex: o ? void 0 : 0,
|
901
|
-
href: n === "a" && o ? void 0 :
|
902
|
-
target: n === "a" ?
|
901
|
+
href: n === "a" && o ? void 0 : D,
|
902
|
+
target: n === "a" ? O : void 0,
|
903
903
|
type: n === "input" ? T : void 0,
|
904
904
|
disabled: n === "input" ? o : void 0,
|
905
905
|
"aria-disabled": !o || n === "input" ? void 0 : o,
|
906
|
-
rel: n === "a" ?
|
906
|
+
rel: n === "a" ? A : void 0
|
907
907
|
};
|
908
|
-
let { pressProps: x, isPressed:
|
908
|
+
let { pressProps: x, isPressed: w } = yt({
|
909
909
|
onPressStart: u,
|
910
910
|
onPressEnd: c,
|
911
911
|
onPressChange: p,
|
@@ -916,18 +916,18 @@ function Mt(e, t) {
|
|
916
916
|
ref: t
|
917
917
|
}), { focusableProps: v } = At(e, t);
|
918
918
|
$ && (v.tabIndex = o ? -1 : v.tabIndex);
|
919
|
-
let
|
919
|
+
let B = G(v, x, nt(e, {
|
920
920
|
labelable: !0
|
921
921
|
}));
|
922
922
|
return {
|
923
|
-
isPressed:
|
924
|
-
buttonProps:
|
923
|
+
isPressed: w,
|
924
|
+
buttonProps: G(k, B, {
|
925
925
|
"aria-haspopup": e["aria-haspopup"],
|
926
926
|
"aria-expanded": e["aria-expanded"],
|
927
927
|
"aria-controls": e["aria-controls"],
|
928
928
|
"aria-pressed": e["aria-pressed"],
|
929
|
-
onClick: (
|
930
|
-
|
929
|
+
onClick: (P) => {
|
930
|
+
I && (I(P), console.warn("onClick is deprecated, please use onPress"));
|
931
931
|
}
|
932
932
|
})
|
933
933
|
};
|
@@ -968,7 +968,7 @@ var Rt = (e, t, n) => {
|
|
968
968
|
return !1;
|
969
969
|
}
|
970
970
|
return !0;
|
971
|
-
},
|
971
|
+
}, Y = (e) => (t) => {
|
972
972
|
var n = e.defaultClassName, o = Ne(Ne({}, e.defaultVariants), t);
|
973
973
|
for (var s in o) {
|
974
974
|
var u, c = (u = o[s]) !== null && u !== void 0 ? u : e.defaultVariants[s];
|
@@ -982,7 +982,7 @@ var Rt = (e, t, n) => {
|
|
982
982
|
for (var [y, $] of e.compoundVariants)
|
983
983
|
Rt(y, o, e.defaultVariants) && (n += " " + $);
|
984
984
|
return n;
|
985
|
-
}, Ut =
|
985
|
+
}, Ut = Y({ 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"]] }), Vt = Y({ 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: [] }), Gt = Y({ defaultClassName: "_125pcxyv", variantClassNames: { kind: { icon: "_125pcxyw", default: "_125pcxyx", key: "_125pcxyy", delete: "_125pcxyz", confirm: "_125pcxy10", link: "_125pcxy11" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), Wt = Y({ defaultClassName: "_125pcxy12", variantClassNames: { spinning: { true: "_125pcxy13", false: "_125pcxy14" } }, defaultVariants: { spinning: !1 }, compoundVariants: [] }), Ht = Y({ defaultClassName: "_125pcxys", variantClassNames: { spinning: { true: "_125pcxyt", false: "_125pcxyu" } }, defaultVariants: { spinning: !1 }, compoundVariants: [] });
|
986
986
|
const Re = d.forwardRef(
|
987
987
|
({
|
988
988
|
onClick: e,
|
@@ -996,39 +996,42 @@ const Re = d.forwardRef(
|
|
996
996
|
kind: p = "default",
|
997
997
|
spinning: y,
|
998
998
|
spinningTitle: $,
|
999
|
+
title: I,
|
999
1000
|
...D
|
1000
1001
|
}, O) => {
|
1001
|
-
var
|
1002
|
-
const
|
1002
|
+
var C;
|
1003
|
+
const A = {
|
1003
1004
|
onPress: t != null ? t : e,
|
1004
|
-
isDisabled: (
|
1005
|
+
isDisabled: (C = u != null ? u : s) != null ? C : y,
|
1005
1006
|
...D
|
1006
|
-
}, { "data-testid":
|
1007
|
+
}, { "data-testid": T } = D, k = O != null ? O : d.useRef(null), { buttonProps: x } = Mt(A, k), { t: w } = d.useContext(We), v = m && /* @__PURE__ */ d.createElement(He, {
|
1007
1008
|
className: Gt({ kind: p }),
|
1008
1009
|
icon: m,
|
1009
1010
|
"aria-hidden": "true",
|
1010
|
-
"data-testid": `${
|
1011
|
+
"data-testid": `${T}__${m}-icon`
|
1011
1012
|
});
|
1012
|
-
let
|
1013
|
-
p === "default" || p === "icon" || p === "link" ?
|
1013
|
+
let B;
|
1014
|
+
p === "default" || p === "icon" || p === "link" ? B = "dark" : B = "light";
|
1014
1015
|
const P = y && /* @__PURE__ */ d.createElement(je, {
|
1015
|
-
color:
|
1016
|
+
color: B,
|
1016
1017
|
className: Wt({ spinning: y }),
|
1017
|
-
title: $ ||
|
1018
|
-
"data-testid": `${
|
1018
|
+
title: $ || w("design-system:button.spinningTitle"),
|
1019
|
+
"data-testid": `${T}__spinner`
|
1019
1020
|
});
|
1020
1021
|
return /* @__PURE__ */ d.createElement("div", {
|
1021
1022
|
className: ze(Ut({ disabled: s || u, kind: p, spinning: y }), o)
|
1022
1023
|
}, c ? /* @__PURE__ */ d.createElement("a", {
|
1023
1024
|
className: Ht({ spinning: y }),
|
1024
1025
|
...D,
|
1025
|
-
href: c
|
1026
|
-
|
1026
|
+
href: c,
|
1027
|
+
title: I
|
1028
|
+
}, v, n, P) : /* @__PURE__ */ d.createElement(d.Fragment, null, /* @__PURE__ */ d.createElement("button", {
|
1027
1029
|
className: Vt({ disabled: s || u, kind: p, spinning: y }),
|
1028
1030
|
disabled: s,
|
1029
|
-
...
|
1030
|
-
ref:
|
1031
|
-
|
1031
|
+
...x,
|
1032
|
+
ref: k,
|
1033
|
+
title: I
|
1034
|
+
}, v, n, P)));
|
1032
1035
|
}
|
1033
1036
|
);
|
1034
1037
|
Ye.set(Re, {
|
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.1.
|
4
|
+
"version": "8.1.2",
|
5
5
|
"author": "SPS Commerce",
|
6
6
|
"license": "UNLICENSED",
|
7
7
|
"repository": "https://github.com/SPSCommerce/woodland/tree/main/packages/@sps-woodland/buttons",
|
@@ -29,8 +29,8 @@
|
|
29
29
|
"@spscommerce/utils": "^6.12.1",
|
30
30
|
"react": "^16.9.0",
|
31
31
|
"react-dom": "^16.9.0",
|
32
|
-
"@sps-woodland/core": "8.1.
|
33
|
-
"@sps-woodland/tokens": "8.1.
|
32
|
+
"@sps-woodland/core": "8.1.2",
|
33
|
+
"@sps-woodland/tokens": "8.1.2"
|
34
34
|
},
|
35
35
|
"devDependencies": {
|
36
36
|
"@vanilla-extract/css": "^1.9.3",
|
@@ -39,8 +39,8 @@
|
|
39
39
|
"@react-aria/button": "^3.3.5",
|
40
40
|
"react": "^16.9.0",
|
41
41
|
"react-dom": "^16.9.0",
|
42
|
-
"@sps-woodland/core": "8.1.
|
43
|
-
"@sps-woodland/tokens": "8.1.
|
42
|
+
"@sps-woodland/core": "8.1.2",
|
43
|
+
"@sps-woodland/tokens": "8.1.2"
|
44
44
|
},
|
45
45
|
"scripts": {
|
46
46
|
"build": "pnpm run build:js && pnpm run build:types",
|