@spscommerce/ds-react 8.20.16 → 8.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.cjs.js +5 -5
- package/lib/index.es.js +5 -5
- package/lib/pagination/SpsPageSelector.d.ts +1 -1
- package/package.json +12 -12
package/lib/index.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var sv=Object.defineProperty;var Cc=e=>{throw TypeError(e)};var ov=(e,t,n)=>t in e?sv(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n;var Vt=(e,t,n)=>ov(e,typeof t!="symbol"?t+"":t,n),Dc=(e,t,n)=>t.has(e)||Cc("Cannot "+n);var Fn=(e,t,n)=>(Dc(e,t,"read from private field"),n?n.call(e):t.get(e)),Is=(e,t,n)=>t.has(e)?Cc("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(e):t.set(e,n),cn=(e,t,n,r)=>(Dc(e,t,"write to private field"),r?r.call(e,n):t.set(e,n),n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react"),v=require("@spscommerce/utils"),it=require("moment-timezone"),W=require("@spscommerce/ds-shared"),no=require("react-dom"),xa=require("@spscommerce/ds-colors"),av=require("@sps-woodland/tabs"),fr=require("@react-stately/collections"),up=require("@sps-woodland/illustrations");function mp(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const s=mp(_),vr=mp(it);function fp(e){var t,n,r="";if(typeof e=="string"||typeof e=="number")r+=e;else if(typeof e=="object")if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=fp(e[t]))&&(r&&(r+=" "),r+=n);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}function G(){for(var e,t,n=0,r="";n<arguments.length;)(e=arguments[n++])&&(t=fp(e))&&(r&&(r+=" "),r+=t);return r}let gt=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((t,n)=>(n&=63,n<36?t+=n.toString(36):n<62?t+=(n-26).toString(36).toUpperCase():n>62?t+="-":t+="_",t),"");function xn(e){return _.useRef(e||gt())}function Tt(e,t){const n=xn(e),r=_.useRef(`${n.current}_ctrl`);return _.useEffect(()=>{t&&(t.id=r.current,t.update())},[t]),{wrapperId:n.current||void 0,controlId:r.current}}var qt=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function ei(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var iv="[object Object]";function lv(e){var t=!1;if(e!=null&&typeof e.toString!="function")try{t=!!(e+"")}catch{}return t}function cv(e,t){return function(n){return e(t(n))}}var dv=Function.prototype,hp=Object.prototype,Sp=dv.toString,pv=hp.hasOwnProperty,uv=Sp.call(Object),mv=hp.toString,fv=cv(Object.getPrototypeOf,Object);function hv(e){return!!e&&typeof e=="object"}function Sv(e){if(!hv(e)||mv.call(e)!=iv||lv(e))return!1;var t=fv(e);if(t===null)return!0;var n=pv.call(t,"constructor")&&t.constructor;return typeof n=="function"&&n instanceof n&&Sp.call(n)==uv}var gv=Sv;const gp=ei(gv),Nt=new Set,Dr=new Set,Jt=new Set,ro=new Set;function bp(e){Nt.has(e)||Jt.has(e)||ro.has(e)||Dr.add(e)}function vp(e){Nt.has(e)||Jt.has(e)||Dr.has(e)||ro.add(e)}const et=vr.default||vr,yr="MM/DD/YYYY",bv="MM/DD/YYYY hh:mm A",vv="MM/DD/YYYY HH:mm",yv="hh:mm A",Tv="HH:mm",Ev=/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/,jr=Symbol("Date Parse Error");function dr(e){return et.isMoment(e)?e.year()*1e4+(e.month()+1)*100+e.date():e.year*1e4+e.month*100+e.date}const X=Object.freeze({createFrom(e,t){if(!e)return null;if(typeof e=="string"){if(t){const n=et(e,t,!0);if(n.isValid())return Object.freeze({year:n.year(),month:n.month()+1,date:n.date()})}else{const n=Ev.exec(e);if(n){const[,r,o,a]=n;return Object.freeze({year:Number(a),month:Number(r),date:Number(o)})}}return Object.freeze({[jr]:!0,year:void 0,month:void 0,date:void 0})}return Object.freeze({year:e.year(),month:e.month()+1,date:e.date()})},createMomentFrom(e,t){if(!e)return null;let n=null;return typeof e=="string"?t?n=et(e,t,!0):n=et(e):et.isMoment(e)?n=e:n=X.toMoment(e),n!==null&&et.isMoment(n)&&n.isValid()?n:Object.freeze({[jr]:!0,year:void 0,month:void 0,date:void 0})},getRangeSeparator(e){return e!=null&&e.includes("-")?"/":"-"},createRangeFrom(e,t){if(!e)return null;if(t){const n=X.getRangeSeparator(t),r=new RegExp(`[^\\d]*${n}[^\\d]*`);return e.split(r).slice(0,2).map(o=>X.createFrom(o,t))}else return e.split(/[^\d]*-[^\d]*/).slice(0,2).map(n=>X.createFrom(n))},isValid(e){var t;return e?et.isMoment(e)?e.isValid():typeof e=="object"&&typeof e.year=="number"&&typeof e.month=="number"&&typeof e.date=="number"&&((t=X.toMoment(e))==null?void 0:t.isValid()):!1},nullifyInvalidDate(e){return X.isValid(e)?e:null},toMoment(e){return e?et.isMoment(e)?e:et({...e,month:e.month-1}):null},toString(e,t){const n=X.toMoment(e);return n&&n.isValid()?n.format(t||yr):""},toStringRange(e,t){if(!e)return"";const n=X.getRangeSeparator(t);return e.slice(0,2).map(r=>X.toString(r,t)).join(n)},toDateTimeString(e,t=!1,n){return e&&et.isMoment(e)&&e.isValid()?n?t?e.format(`${n} ${Tv}`):e.format(`${n} ${yv}`):t?e.format(vv):e.format(bv):""},toDateTimeStringRange(e,t=!1,n){if(!e)return"";const r=X.getRangeSeparator(n);return e.map(o=>X.toDateTimeString(o,t,n)).join(r)},create(){const e=new Date;return Object.freeze({year:e.getFullYear(),month:e.getMonth()+1,date:e.getDate()})},isSameDate(e,t){return e&&t&&e.year===t.year&&e.month===t.month&&e.date===t.date},isSameMonth(e,t){return e&&t&&e.year===t.year&&e.month===t.month},isAfter(e,t){return!e||!t?null:dr(e)>dr(t)},isBefore(e,t){return!e||!t?null:dr(e)<dr(t)},isInRange(e,t,n=!0){if(!e||!t||!t[0]||!t[1])return null;const r=dr(e),[o,a]=t.map(dr);return e&&o&&a&&(n&&r>=o&&r<=a||!n&&r>o&&r<a)},prevMonth(e){return Object.freeze({year:e.month===1?e.year-1:e.year,month:e.month-1||12,date:e.date})},nextMonth(e){return Object.freeze({year:e.month===12?e.year+1:e.year,month:e.month+1>12?1:e.month+1,date:e.date})},createRangeFromPreset(e,t){if(typeof e.definition=="function")return e.definition();const n=et(),r=n.clone().subtract(et.duration(e.definition));return[X.createFrom(r,t),X.createFrom(n,t)]},createDateTimeRangeFromPreset(e){if(typeof e.definition=="function")return e.definition();let t;e.definition==="P0D"?t=et().startOf("day"):t=et().subtract(et.duration(e.definition));const n=et().endOf("day");return[t,n]},splitMomentInDateTimeParts(e,t=!1,n){return e&&et.isMoment(e)&&e.isValid()?X.toDateTimeString(e,t,n).split(" "):["",t?"00:00":"12:00",t?void 0:"AM"]},getCurrentMoment(){return et()},validateTimeString(e,t=!1){if(!e)return!0;const n=e.split(":"),r=n[0]||"0",o=n[1]||"0",a=Number.isNaN(Number(r))?NaN:parseInt(r,10),l=Number.isNaN(Number(o))?NaN:parseInt(o,10),c=n.length<=2&&r.length<=2&&o.length<=2;return t?c&&a>=0&&a<=23&&l>=0&&l<=59:c&&(!Number.isNaN(a)&&r.length===1||a>=1)&&a<=12&&l>=0&&l<=59},padIncompleteTimeString(e,t=!1){if(!e)return"";const n=e.split(":"),r=parseInt(n[0]||"0",10),o=parseInt(n[1]||"0",10);if(t){const a=r<10?`0${r}`:`${r}`,l=o<10?`0${o}`:`${o}`;return`${a}:${l}`}else{const a=r===0?"12":r<10?`0${r}`:`${r}`,l=o<10?`0${o}`:`${o}`;return`${a}:${l}`}}}),ka=["01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00"],Ia=["00:00","01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00","19:00","20:00","21:00","22:00","23:00"];let Ys=yr;function yp(e){Ys=e}const qr=function(t){if(Array.isArray(t)){const n=qr(t[0]),r=qr(t[1]);return n||r}if(t&&t.hasOwnProperty("year")){if(t[jr])return{dateFormat:Ys};if(!X.isValid(t))return{dateValidity:!0}}return null};Nt.add("dateFormat");Nt.add("dateValidity");const Tp=function(t){if(Array.isArray(t)){const n=qr(t);if(n)return n;if(t&&X.isBefore(t[1],t[0]))return{dateRangeOrder:!0}}return null};Nt.add("dateRangeOrder");const Ep=function({minDate:t,maxDate:n}){function r(o){const a=X.isBefore(o,t),l=X.isAfter(o,n),c={minExceeded:a?X.toString(t,Ys):null,maxExceeded:l?X.toString(n,Ys):null};return a||l?{dateConstraint:c}:null}return function(a){if(!a)return null;if(Array.isArray(a)){const l=r(a[0]),c=r(a[1]);return l||c}return a.hasOwnProperty("year")?r(a):null}};Nt.add("dateConstraint");const wv=Object.freeze(Object.defineProperty({__proto__:null,date:qr,dateConstraint:Ep,dateRange:Tp,setDateFormat:yp},Symbol.toStringTag,{value:"Module"}));function un(e,t){for(const n of[].concat(e)){const r=t(n);if(r)return r}return null}const Cv=function(t){function n(r){return Number(r)>=t?null:{min:t}}return r=>un(r,n)};Nt.add("min");const Dv=function(t){function n(r){return Number(r)<=t?null:{max:t}}return r=>un(r,n)};Dr.add("max");const Nv=function(t){return typeof t>"u"||t===null||t===""||Number.isNaN(t)||(t==null?void 0:t.length)===0?{required:!0}:null};Dr.add("required");const xv=function(t){function n(r){return r===void 0||r.toString().length<t?{minLength:t}:null}return r=>un(r,n)};Nt.add("minLength");const kv=function(t){function n(r){return r==null||Array.isArray(r)&&r.length<t?{minLengthArray:t}:null}return r=>n(r)};Nt.add("minLengthArray");const Iv=function(t){function n(r){return r===void 0||r.toString().length<=t?null:{maxLength:t}}return r=>un(r,n)};Jt.add("maxLength");const Mv=function(t){function n(r){return r==null||Array.isArray(r)&&r.length<=t?null:{maxLengthArray:t}}return r=>n(r)};Nt.add("maxLengthArray");const _v=function(t){const n=t instanceof RegExp?t:new RegExp(t);function r(o){return n.test(o)?null:{pattern:t}}return o=>un(o,r)};Nt.add("pattern");const Rv=function(e){function t(n){return new RegExp("^\\p{L}*$","u").test(n)?null:{alpha:!0}}return un(e,t)};Jt.add("alpha");const Lv=function(e){function t(n){return/^[0-9,. ]*$/.test(n)?null:{numeric:!0}}return un(e,t)};Jt.add("numeric");const Ov=function(e){function t(n){return/^-?[0-9,. ]*$/.test(n)?null:{positiveOrNegativeNumber:!0}}return un(e,t)};Jt.add("positiveOrNegativeNumber");const Pv=function(e){function t(n){return/^[^0-9]*$/.test(n)?null:{nonNumeric:!0}}return un(e,t)};Jt.add("nonNumeric");const so=Object.freeze({...wv,min:Cv,max:Dv,required:Nv,minLength:xv,minLengthArray:kv,maxLength:Iv,maxLengthArray:Mv,pattern:_v,alpha:Rv,numeric:Lv,nonNumeric:Pv,positiveOrNegativeNumber:Ov,OnBlurErrorKeys:Nt});function oo(e,t=[]){const n=t.reduce((r,o)=>Object.assign(r,o(e)||{}),{});return Object.keys(n).length?n:null}var zt=(e=>(e[e.ON_CHANGE=0]="ON_CHANGE",e[e.ON_BLUR=1]="ON_BLUR",e[e.ON_SUBMIT=2]="ON_SUBMIT",e))(zt||{});function Bv(e,t={},n=[]){for(const[r,o]of Object.entries(t))o===0?bp(r):o===2&&vp(r);return s.useCallback(e,n)}var Un,Tn,En;class Wn{constructor(t,n){Vt(this,"validators",[]);Is(this,Un,null);Is(this,Tn,null);Is(this,En,null);Vt(this,"preventativeErrors",[]);Vt(this,"submitted",!1);this.path=t,this.update=n}get errors(){return Fn(this,Un)===null&&Fn(this,Tn)===null&&Fn(this,En)===null?null:{...Fn(this,Un)??{},...Fn(this,Tn)??{},...Fn(this,En)??{}}}setValidators(t){return this.update(this.path,null,void 0,t),this}validate(t,n,r=!1){if(this.validators&&this.validators.length>0){const o=oo(t,this.validators);let a={onSubmit:{},onChange:{},onBlur:{}};o&&(a=Object.keys(o).reduce((l,c)=>(ro.has(c)?l.onSubmit[c]=o[c]:Dr.has(c)?l.onChange[c]=o[c]:l.onBlur[c]=o[c],l),a)),(typeof n>"u"||n===zt.ON_CHANGE)&&cn(this,Tn,Object.keys(a.onChange).length===0?null:a.onChange),(typeof n>"u"||n===zt.ON_BLUR)&&cn(this,En,Object.keys(a.onBlur).length===0?null:a.onBlur),(typeof n>"u"||n===zt.ON_SUBMIT)&&(cn(this,Un,Object.keys(a.onSubmit).length===0?null:a.onSubmit),cn(this,Tn,Object.keys(a.onChange).length===0?null:a.onChange),cn(this,En,Object.keys(a.onBlur).length===0?null:a.onBlur)),r||this.update(),this.isFocused()&&this.onFocus&&this.onFocus()}else this.errors&&(cn(this,Un,null),cn(this,En,null),cn(this,Tn,null),r||this.update());return this}isValid(){return!this.errors||this.isPristine()}hasErrors(){return!!this.errors}isVisibilyInvalid(){return!this.isValid()}hasError(t){return this.errors&&Object.prototype.hasOwnProperty.call(this.errors,t)}hasPreventativeError(t){return this.preventativeErrors.includes(t)}hasPreventativeErrors(){return this.preventativeErrors.length>0}isRequired(){return this.validators&&this.validators.indexOf(so.required)>-1}isSubmitted(){return this.submitted}onFocus(){}onBlur(){}}Un=new WeakMap,Tn=new WeakMap,En=new WeakMap;class Jr extends Wn{constructor(){super(...arguments);Vt(this,"id",gt());Vt(this,"focused",!1);Vt(this,"pristine",!0)}setValue(n){if(this.preventativeErrors=[],this.validators&&this.validators.length>0){const r=oo(n,this.validators);if(r&&Object.keys(r).filter(a=>Jt.has(a)).length>0){this.preventativeErrors=Object.keys(r);return}}this.update(this.path,n)}isPristine(){return this.pristine}markAsPristine(){return this.pristine=!0,this.update(),this}markAsDirty(){return this.pristine=!1,this.update(),this}isFocused(){return this.focused}markAsFocused(){return this.focused=!0,this.update(),this.onFocus&&this.onFocus(),this}markAsBlurred(){return this.update(this.path,null,!0),this.onBlur&&this.onBlur(),this.preventativeErrors=[],this}markAsSubmitted(){return this.submitted=!0,this.update(this.path,null,!1,void 0,!0),this}}class Gn extends Jr{constructor(n,r,o){super(o?r:n,o||r);Vt(this,"fields");o&&this.inferMembers(n)}isFocused(){return super.isFocused()||this.rollup("isFocused")}isValid(){return super.isValid()&&this.rollup("isValid")}hasErrors(){return super.hasErrors()||Object.keys(this.fields).some(n=>this.fields[n].hasErrors())}contentsAreValid(){return this.rollup("isValid")&&this.rollup("contentsAreValid")}isPristine(){return super.isPristine()&&this.rollup("isPristine")}markAsPristine(){super.markAsPristine();for(const n of Object.keys(this.fields))this.fields[n].markAsPristine();return this}markAsDirty(){super.markAsDirty();for(const n of Object.keys(this.fields))this.fields[n].markAsDirty();return this}markAsBlurred(){super.markAsBlurred();for(const n of Object.keys(this.fields))this.fields[n].markAsBlurred();return this}markAsSubmitted(){super.markAsSubmitted();for(const n of Object.keys(this.fields))this.fields[n].markAsSubmitted();return this}inferSpsControl(n,r){return Ks(n,[...this.path,r],this.update)}rollup(n){return Object.keys(this.fields).reduce((r,o)=>r&&(!this.fields[o][n]||this.fields[o][n]()),!0)}}class wp extends Gn{inferMembers(t){this.fields={};for(const n of Object.keys(t))this.fields[n]=this.inferSpsControl(t[n],n)}}class Cp extends Gn{inferMembers(t){this.fields=t.map((n,r)=>this.inferSpsControl(n,String(r)))}}function Ks(e,t,n){return e instanceof Wn?(e.path=t,e.update=n,e):Array.isArray(e)?new Cp(e,t,n):gp(e)?new wp(e,t,n):new Jr(t,n)}function Wr(e,t){return t.length===0||!e?e:Wr(e.fields[t[0]],t.slice(1,t.length))}function Ma(e,t){if(t.length===0||!e)return[e];const n=t[0];if(t=t.slice(1,t.length),n==="*"){const r=Array.isArray(e.fields)?e.fields:Object.keys(e.fields).map(o=>e.fields[o]);return t.length===0?r:r.reduce((o,a)=>[...o,...Ma(a,t)],[])}return Ma(e.fields[n],t)}function _a(e,t,n){for(const r of Object.keys(t)){const o=t[r];for(const a of Ma(e,r.split(".")))a&&o&&n(a,o)}}function Ms(e,t,n,r=!1,o=!1){_a(t,n,(a,l)=>{a.validators=typeof l=="function"?l(e):l,r&&a.validate(v.getPath(e,a.path),void 0,o)})}function Ra(e,t){const n=t[0];return t=t.slice(1),Array.isArray(e)?e.map((r,o)=>o===Number(n)?Ra(r,t):r):gp(e)?Object.keys(e).reduce((r,o)=>Object.assign(r,{[o]:o===n?Ra(e[o],t):e[o]}),{}):e}function Av(e){if(typeof e!="object"||e===null||Array.isArray(e))throw new TypeError("The initial value of useSpsForm() hook must be an object.")}function Dp(e,t={}){Av(e);const[,n]=_.useState({}),r=_.useRef(!1);r.current=!1;const o=_.useRef(t),a=_.useCallback(h=>{var T,E;const S=u.current;let y;if(h)if(h.path)if(h.markAsBlurred){const w=Wr(S.formMeta,h.path);if(w){w.focused=!1;const N=v.getPath(S.formValue,h.path);w.validate(N,zt.ON_BLUR)}}else if(h.newValidators){if(o.current){const w=h.path.join(".");o.current={...o.current,[w]:h.newValidators},Ms(S.formValue,S.formMeta,o.current,!0)}}else if(h.markAsSubmitted){const w=Wr(S.formMeta,h.path);if(w){w.submitted=!0;const N=v.getPath(S.formValue,h.path);w.validate(N,zt.ON_SUBMIT)}}else y=Ra(S.formValue,h.path),v.setPath(y,h.path,h.value);else y=h.value;if((T=h==null?void 0:h.updateFormOptions)!=null&&T.validators&&(o.current={...o.current,...h.updateFormOptions.validators},Ms(S.formValue,S.formMeta,o.current,((E=h.updateFormOptions)==null?void 0:E.runValidators)??!0)),y){S.formMeta.submitted=!1,v.deepFreeze(y);const w=v.diff(S.formValue,y);for(const{type:I,key:k,parentPath:x,objects:[,F]}of w){const P=Wr(S.formMeta,x);if(typeof k!="symbol"&&P){let C;switch(I){case v.DiffChange.ADDITION:P.fields[k]=Ks(F[k],[...x,k],c);break;case v.DiffChange.DELETION:Array.isArray(P.fields)?P.fields[k]=void 0:delete P.fields[k];break;case v.DiffChange.ALTERATION:C=Ks(F[k],[...x,k],c),(C instanceof Gn&&!(P.fields[k]instanceof Gn)||!(C instanceof Gn)&&P.fields[k]instanceof Gn)&&(C.pristine=!1,P.fields[k]=C);break}}}const N=new Set;if(w.filter(I=>I.type===v.DiffChange.DELETION).reduce((I,k)=>(I.has(k.parentPath)||I.add(k.parentPath),I),N),Array.from(N).forEach(I=>{const k=Wr(S.formMeta,I);Array.isArray(k.fields)&&(k.fields=k.fields.filter(x=>x!==void 0))}),o.current){Ms(y,S.formMeta,o.current);const I=new Set;t&&_a(S.formMeta,t,(k,x)=>{typeof x=="function"&&(k.validate(v.getPath(y,k.path)),I.add(k))});for(const{type:k,key:x,parentPath:F,objects:[,P]}of w)if(typeof x!="symbol"){let C=S.formMeta,L=y;if(C){for(const R of F)C=C.fields[R],L=L[R],I.has(C)||C.validate(L,zt.ON_CHANGE);if(k===v.DiffChange.ADDITION||k===v.DiffChange.ALTERATION){const R=C.fields[x];if(!I.has(R)&&(C.fields[x].validate(P[x],zt.ON_CHANGE),k===v.DiffChange.ADDITION&&R.fields))for(const[K,j]of Object.entries(R.fields))j.validate(P[x][K],zt.ON_CHANGE)}}}}}u.current={...S,formValue:y||S.formValue},r.current||n({})},[]),l=_.useCallback((h,S)=>{h||S?a({value:h,updateFormOptions:S}):a()},[a]),c=_.useCallback((h,S,y=!1,T,E=!1)=>{h?a({path:h,value:S,markAsBlurred:y,newValidators:T,markAsSubmitted:E}):l()},[a,l]),p=_.useMemo(()=>{v.deepFreeze(e);const h=Ks(e,[],c);return t&&Ms(e,h,t,!1,!0),h},[]),m=_.useCallback(()=>(u.current.formMeta.markAsDirty(),o.current&&_a(u.current.formMeta,o.current,(h,S)=>{(typeof S=="function"||Array.isArray(S))&&h.validate(v.getPath(u.current.formValue,h.path))}),u.current.formMeta.isValid()),[]),f=_.useCallback(()=>u.current.formValue,[]),u=_.useRef({formValue:e,formMeta:p,updateForm:l,validateForm:m,getCurrentFormValue:f});return u.current}const lt=s.forwardRef((e,t)=>{const{className:n,children:r,focusInputOnClick:o,formControl:a,formMeta:l,inputRef:c,onClick:p,...m}=e,f=s.useRef(),h=c||(t||f);function S(){h&&h!==t&&h.current&&h.current.focus()}function y(){h&&h!==t&&h.current&&l&&l instanceof Jr&&l.markAsFocused()}function T(){h&&h!==t&&h.current&&l&&l instanceof Jr&&l.markAsBlurred()}const E=G("sps-form-group",(a&&a.isRequired()||l&&l.isRequired())&&"sps-form-group--required",(a&&!a.isValid()||l&&l.isVisibilyInvalid())&&"sps-form-group--error",l&&l.hasPreventativeErrors()&&"sps-form-group--preventative-error",n);function w(N){o&&S(),p&&p(N)}return s.useEffect(()=>{function N(I){I.target.classList.contains("sps-form-control__clear-btn")&&I.preventDefault()}return document.addEventListener("mousedown",N),()=>{document.removeEventListener("mousedown",N)}},[]),s.createElement("div",{...m,className:E,ref:t,tabIndex:-1,onClick:w,onFocus:y,onBlur:T},r)});Object.assign(lt,{displayName:"SpsFormComponentWrapper"});function Nc(e){return typeof e=="object"&&e!=null&&e.nodeType===1}function xc(e,t){return(!t||e!=="hidden")&&e!=="visible"&&e!=="clip"}function Zo(e,t){if(e.clientHeight<e.scrollHeight||e.clientWidth<e.scrollWidth){var n=getComputedStyle(e,null);return xc(n.overflowY,t)||xc(n.overflowX,t)||function(r){var o=function(a){if(!a.ownerDocument||!a.ownerDocument.defaultView)return null;try{return a.ownerDocument.defaultView.frameElement}catch{return null}}(r);return!!o&&(o.clientHeight<r.scrollHeight||o.clientWidth<r.scrollWidth)}(e)}return!1}function _s(e,t,n,r,o,a,l,c){return a<e&&l>t||a>e&&l<t?0:a<=e&&c<=n||l>=t&&c>=n?a-e-r:l>t&&c<n||a<e&&c>n?l-t+o:0}var kc=function(e,t){var n=window,r=t.scrollMode,o=t.block,a=t.inline,l=t.boundary,c=t.skipOverflowHiddenElements,p=typeof l=="function"?l:function(Be){return Be!==l};if(!Nc(e))throw new TypeError("Invalid target");for(var m,f,u=document.scrollingElement||document.documentElement,h=[],S=e;Nc(S)&&p(S);){if((S=(f=(m=S).parentElement)==null?m.getRootNode().host||null:f)===u){h.push(S);break}S!=null&&S===document.body&&Zo(S)&&!Zo(document.documentElement)||S!=null&&Zo(S,c)&&h.push(S)}for(var y=n.visualViewport?n.visualViewport.width:innerWidth,T=n.visualViewport?n.visualViewport.height:innerHeight,E=window.scrollX||pageXOffset,w=window.scrollY||pageYOffset,N=e.getBoundingClientRect(),I=N.height,k=N.width,x=N.top,F=N.right,P=N.bottom,C=N.left,L=o==="start"||o==="nearest"?x:o==="end"?P:x+I/2,R=a==="center"?C+k/2:a==="end"?F:C,K=[],j=0;j<h.length;j++){var M=h[j],Q=M.getBoundingClientRect(),B=Q.height,ee=Q.width,V=Q.top,J=Q.right,se=Q.bottom,H=Q.left;if(r==="if-needed"&&x>=0&&C>=0&&P<=T&&F<=y&&x>=V&&P<=se&&C>=H&&F<=J)return K;var U=getComputedStyle(M),ne=parseInt(U.borderLeftWidth,10),te=parseInt(U.borderTopWidth,10),Y=parseInt(U.borderRightWidth,10),O=parseInt(U.borderBottomWidth,10),z=0,Z=0,re="offsetWidth"in M?M.offsetWidth-M.clientWidth-ne-Y:0,ie="offsetHeight"in M?M.offsetHeight-M.clientHeight-te-O:0,ce="offsetWidth"in M?M.offsetWidth===0?0:ee/M.offsetWidth:0,ae="offsetHeight"in M?M.offsetHeight===0?0:B/M.offsetHeight:0;if(u===M)z=o==="start"?L:o==="end"?L-T:o==="nearest"?_s(w,w+T,T,te,O,w+L,w+L+I,I):L-T/2,Z=a==="start"?R:a==="center"?R-y/2:a==="end"?R-y:_s(E,E+y,y,ne,Y,E+R,E+R+k,k),z=Math.max(0,z+w),Z=Math.max(0,Z+E);else{z=o==="start"?L-V-te:o==="end"?L-se+O+ie:o==="nearest"?_s(V,se,B,te,O+ie,L,L+I,I):L-(V+B/2)+ie/2,Z=a==="start"?R-H-ne:a==="center"?R-(H+ee/2)+re/2:a==="end"?R-J+Y+re:_s(H,J,ee,ne,Y+re,R,R+k,k);var oe=M.scrollLeft,Ee=M.scrollTop;L+=Ee-(z=Math.max(0,Math.min(Ee+z/ae,M.scrollHeight-B/ae+ie))),R+=oe-(Z=Math.max(0,Math.min(oe+Z/ce,M.scrollWidth-ee/ce+re)))}K.push({el:M,top:z,left:Z})}return K};function Np(e){return e===Object(e)&&Object.keys(e).length!==0}function Fv(e,t){t===void 0&&(t="auto");var n="scrollBehavior"in document.body.style;e.forEach(function(r){var o=r.el,a=r.top,l=r.left;o.scroll&&n?o.scroll({top:a,left:l,behavior:t}):(o.scrollTop=a,o.scrollLeft=l)})}function Vv(e){return e===!1?{block:"end",inline:"nearest"}:Np(e)?e:{block:"start",inline:"nearest"}}function ao(e,t){var n=e.isConnected||e.ownerDocument.documentElement.contains(e);if(Np(t)&&typeof t.behavior=="function")return t.behavior(n?kc(e,t):[]);if(n){var r=Vv(t);return Fv(kc(e,r),r.behavior)}}const ti=Object.freeze(Object.defineProperty({__proto__:null,default:ao},Symbol.toStringTag,{value:"Module"})),Ke=s.createContext(W.noI18nI18n),$v={alt:"string",size:"SpinnerSize",title:"string"};function ni(e){const{alt:t,className:n,size:r=W.SpinnerSize.MEDIUM,"data-testid":o,title:a,unsafelyReplaceClassName:l,...c}=e,{t:p}=s.useContext(Ke),m=t||a||p("design-system:spinner.defaultAltText"),f=G(l||"sps-spinner",`sps-spinner--${r}`,n);return s.createElement("i",{className:f,"data-testid":o,title:m,...c})}Object.assign(ni,{props:$v,displayName:"SpsSpinner"});const Kv=60;function Rs(e){return typeof e>"u"?"inherit":`${e}px`}function ri(e){switch(e){case W.Position.TOP_LEFT:return W.Position.BOTTOM_LEFT;case W.Position.TOP_MIDDLE:return W.Position.BOTTOM_MIDDLE;case W.Position.TOP_RIGHT:return W.Position.BOTTOM_RIGHT;case W.Position.RIGHT_TOP:return W.Position.LEFT_TOP;case W.Position.RIGHT_MIDDLE:return W.Position.LEFT_MIDDLE;case W.Position.RIGHT_BOTTOM:return W.Position.LEFT_BOTTOM;case W.Position.BOTTOM_RIGHT:return W.Position.TOP_RIGHT;case W.Position.BOTTOM_MIDDLE:return W.Position.TOP_MIDDLE;case W.Position.BOTTOM_LEFT:return W.Position.TOP_LEFT;case W.Position.LEFT_BOTTOM:return W.Position.RIGHT_BOTTOM;case W.Position.LEFT_MIDDLE:return W.Position.RIGHT_MIDDLE;case W.Position.LEFT_TOP:return W.Position.RIGHT_TOP}}function Hv(e,t,n,r,o,a,l,c){const p=l&&l.current,m=p?p.scrollTop:window.pageYOffset,f=c?0:m,u=p?p.scrollLeft:window.pageXOffset,h=c?0:u,[S,y]=e.split(" ");let T,E,w,N;switch(S){case"top":w=t.height-n.top-f-a[0];break;case"left":E=t.width-n.left-h-a[0];break;case"right":N=n.right+h-a[0];break;case"bottom":T=n.bottom+f-a[0];break;default:throw new Error(`Invalid position ${e}`)}switch(y){case"left":N=n.left+h+a[1];break;case"top":T=n.top+f+a[1];break;case"middle":S==="top"||S==="bottom"?N=n.left+h+n.width/2-o/2+a[1]:(S==="left"||S==="right")&&(T=n.top+f+n.height/2-r.height/2+a[1]);break;case"bottom":w=t.height-n.bottom-f+a[1];break;case"right":E=t.width-n.right-h+a[1];break;default:throw new Error(`Invalid position ${e}`)}return[T,E,w,N]}function zn(e,t,n,{altPosition:r,setMinWidth:o=!1,setWidth:a=!1,parentElementRef:l,fixed:c=!1,offsets:p=[0,0]}){if(e.current&&t.current){const m=Math.max(document.documentElement.clientHeight,window.innerHeight||0),f=document.documentElement.getBoundingClientRect().width,u=l&&l.current?l.current:document.documentElement,h=c?{width:f,height:m,top:0,left:0,bottom:m,right:f}:u.getBoundingClientRect(),S=e.current.getBoundingClientRect(),y=t.current.getBoundingClientRect(),[T]=n.split(" ");let E=n;r&&(T==="top"&&y.top-S.height<Kv||T==="right"&&y.right+S.width>f||T==="bottom"&&y.bottom+S.height>m||T==="left"&&y.left-S.width<0)&&(E=r);const w=o?Math.max(y.width,S.width):S.width,N=a?y.width:w,[I,k,x,F]=Hv(E,h,y,S,N,p,l,c),P={top:Rs(I),right:Rs(k),bottom:Rs(x),left:Rs(F)};return c&&(P.position="fixed",P.zIndex=W.ZStratum.BAR),o&&(P.minWidth=`${y.width}px`),a&&(P.width=`${y.width}px`),[P,E===r]}return[{},!1]}const Lt=_.createContext(null);function Nr(e,t=[]){const n=_.useContext(Lt);return _.useMemo(()=>r=>{const a=n&&n.parentElementRef&&n.parentElementRef.current||document.body;let l=null,c=a.lastElementChild;for(;c&&c!==a.firstElementChild;){if(c.hasAttribute("data-portalid")&&c.getAttribute("data-portalid")===e){l=c;break}c=c.previousElementSibling}if(l)a.contains(l)||a.appendChild(l);else{l=document.createElement("div"),l.setAttribute("data-portalid",e);for(const p of t)l.classList.add(p);a.appendChild(l)}return no.createPortal(r,l)},[n])}async function Ic(e,t,n,r,o,a){const l=typeof e.options=="function"?e.options(t.value):e.options||[],c=l instanceof Promise,p=u=>u.replace(/([.?*+^$[\]\\(){}|-])/g,"");n({pending:c}),a.current=c?l:null;const m=c?await l||[]:l||[];if(c&&a.current!==l)return;let f=Array.from(m).filter(Boolean).map(u=>new W.SpsOptionListOption(u,typeof u=="function"?{textKey:"label",captionKey:"caption"}:{textKey:e.textKey,captionKey:e.captionKey}));if(e.nullOption&&f.unshift(new W.SpsOptionListOption(null,{text:e.nullOption})),t.value&&!e.disableDefaultOptionsFiltering){const u=p(t.value);n({replacementPattern:new RegExp(`(${u})`,"ig")}),f=f.filter(h=>{const S=new RegExp(u,"i"),y=p(h.text);return e.filterByTextAndCaptionKey?S.test(y)||S.test(p(h.caption)):S.test(y)})}else n({replacementPattern:null});if(e.disabledOptions)for(const u of f)e.disabledOptions.includes(u.value)&&(u.disabled=!0);r(Object.freeze(f)),e.onOptionListChanged&&e.onOptionListChanged(f.length),o(f.some(u=>u.value&&!!u.value.icon)),n({pending:!1})}function Wv(e,t,n){const[r,o]=s.useState(Object.freeze([])),[a,l]=s.useState(!1),c=s.useRef(null),p=s.useRef(e.options);(typeof e.options!="function"||e.disableOptionsMemoization)&&(p.current=e.options);const m=s.useMemo(()=>typeof p.current=="function"?v.debounce(Ic,typeof e.searchDebounce<"u"?e.searchDebounce:500):Ic,[p.current,e.disabledOptions]);return s.useEffect(()=>{m(e,t,n,o,l,c)},[p.current,t.value,e.disabledOptions]),[r,a]}class kn{constructor(t,n){Vt(this,"nativeEvent");Vt(this,"currentTarget");Vt(this,"isPgStoppedInternal",!1);this.target=t,this.currentTarget=t,this.nativeEvent=new CustomEvent("change",n),Object.defineProperty(this.nativeEvent,"target",{value:t,writable:!1,configurable:!1,enumerable:!0})}get bubbles(){return this.nativeEvent.bubbles}get cancelable(){return this.nativeEvent.cancelable}get defaultPrevented(){return this.nativeEvent.defaultPrevented}get eventPhase(){return this.nativeEvent.eventPhase}get isTrusted(){return this.nativeEvent.isTrusted}get timeStamp(){return this.nativeEvent.timeStamp}get type(){return this.nativeEvent.type}preventDefault(){this.nativeEvent.preventDefault()}isDefaultPrevented(){return this.defaultPrevented}stopPropagation(){this.nativeEvent.stopPropagation(),this.isPgStoppedInternal=!0}isPropagationStopped(){return this.isPgStoppedInternal}persist(){throw new Error("This is not a real React ChangeEvent. React does not permit the creation of SyntheticEvents in userland.")}}function Gv(e,t){return{...e,...t}}function Zt(e){return _.useReducer(Gv,e)}function Yv({hideInlineSearch:e,options:t,onSearchChange:n,search:r="",searchPlaceholder:o="Search…",searchInputRef:a}){const[l,c]=Zt({isAsync:typeof t=="function",pending:!1,value:r,replacementPattern:null}),p=s.useCallback(S=>{c({value:S.target.value}),n&&n(S)},[n]),m=s.useCallback(S=>{S.nativeEvent.stopImmediatePropagation(),S.stopPropagation()},[]),f=s.useCallback(S=>{S.nativeEvent.stopImmediatePropagation(),c({value:""}),a!=null&&a.current&&(n&&n(new kn(a.current)),a.current.focus())},[n]),u=S=>{S&&(["Tab","Escape","Enter","Up","ArrowUp","Down","ArrowDown"].includes(S.key)||S.stopPropagation())};return s.useEffect(()=>{c({value:r})},[r]),[l.isAsync&&!e?s.createElement("div",{className:"sps-option-list__search sps-form-group sps-text-input"},s.createElement("div",{className:"sps-form-control"},!l.value&&s.createElement("i",{className:"sps-icon sps-icon-filter sps-text-input__icon"}),s.createElement("input",{type:"text",className:"sps-text-input__input",placeholder:o,ref:a,value:l.value,onChange:p,onClick:m,onKeyDown:u}),l.value&&s.createElement("i",{className:"sps-icon sps-icon-x-circle sps-form-control__clear-btn",onClick:f}))):s.createElement(s.Fragment,null),l,c]}const Uv=ao||ti,zv=["Tab","Escape","Enter","Up","ArrowUp","Down","ArrowDown"],jv=["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];function qv(e,t,n){return n?(e&&e[n])===(t&&t[n]):e===t}function Mc(e,t,n){return typeof n.value=="function"&&n.disabled?!0:t?!!(e!=null&&e.find(r=>{var o;return r[t]&&r[t]===((o=n==null?void 0:n.value)==null?void 0:o[t])})):!1}const as=s.forwardRef((e,t)=>{const{captionKey:n,comparisonKey:r,disabledOptions:o,options:a,tall:l,textKey:c,valueKey:p,zeroState:m,hideInlineSearch:f,onSearchChange:u,search:h,searchDebounce:S,searchPlaceholder:y,onSpecialActionSelect:T,attachTo:E,className:w,conformWidth:N,id:I,ignoreWidthStyles:k,isOpen:x,keepOpen:F,keyDown:P,nullOption:C,onOptionListChanged:L,onOptionSelected:R,onPositionFlip:K,onSelfToggle:j,optionRole:M,positionOverride:Q,selectedOption:B,specialAction:ee,unsafelyReplaceClassName:V,loading:J,filterByTextAndCaptionKey:se,maxHeightPx:H,maxHeightRem:U,disableOptionsMemoization:ne,disableDefaultOptionsFiltering:te,"data-testid":Y,...O}=e,z=s.useMemo(()=>ee?new W.SpsOptionListOption(ee,{textKey:"label",captionKey:"caption"}):null,[ee]),[Z,re]=s.useState(-1),[ie,ce]=s.useState(x),ae=t||s.useRef(null),oe=s.useRef(null),Ee=s.useRef(null),Be=Nr("sps-option-list-portal"),qe=s.useContext(Lt),[ct,ut]=Q||[W.Position.BOTTOM_LEFT,W.Position.TOP_LEFT],[[dt,he],ze]=s.useState([{},!1]),Ce=s.useRef(null),[ve,xe,Ze]=Yv({...e,searchInputRef:Ce}),[Ae,Xe]=Wv(e,xe,Ze);s.useEffect(()=>{ze(ie?zn(ae,E,ct,{altPosition:ut,setMinWidth:!k,setWidth:!k&&N,...qe}):[{},!1])},[ie,ct,ut,Ae]),s.useEffect(()=>{let ge;return ie&&(ge=()=>{ie&&ze(zn(ae,E,ct,{altPosition:ut,setMinWidth:!k,setWidth:!k&&N,...qe}))},document.addEventListener("scroll",ge)),()=>{ge&&document.removeEventListener("scroll",ge)}},[ie]),s.useEffect(()=>{re(-1)},[xe]);const Yt=G(V||"sps-option-list","z-stratum-dropdown",ie&&"sps-option-list--open",xe.isAsync&&"sps-option-list--searchable",he&&"sps-option-list--opens-upward",ee&&ee.label&&"sps-option-list--has-special-action",w),hn=G(V||"sps-option-list__options",l&&"sps-option-list__options--tall"),pe=s.useCallback(()=>{ie||(ce(!0),Ce.current&&Ce.current.focus(),re(-1),j&&j(!0))},[ie,j]),fe=s.useCallback(()=>{ie&&(ce(!1),re(-1),j&&j(!1))},[ie,j]),_e=s.useCallback((ge,ye)=>{ye||ge&&!ge.disabled&&(typeof ge.value=="function"?(ge.value(),T&&T()):typeof R=="function"&&R(ge.value),F||fe())},[R,fe]),st=s.useCallback((ge,ye,je)=>{ge.stopPropagation(),_e(ye,je)},[_e]),De=s.useRef(o||[]);De.current=o||[];const mt=s.useCallback(ge=>{switch(ge.key){case"Tab":case"Escape":fe();break;case"Enter":if(Z>-1){const ye=Ae[Z]||z;ge.preventDefault();const je=!!ye&&Mc(De.current,r||"",ye);!je&&ye&&typeof R=="function"&&typeof ye.value=="function"?ye.value():ye&&_e(ye,je)}break;case"Up":case"ArrowUp":{let ye=Z;he?Z<=-1?ye=Ae.length-1:Z===0?ee&&(ye=Ae.length):Z<Ae.length&&(ye=Z-1):Z>-1&&(ye=Z-1),ye!==Z&&(ge.preventDefault(),re(ye));break}case"Down":case"ArrowDown":{pe();let ye=Z;he?Z!==-1&&(Z>=Ae.length?ye=0:Z===Ae.length-1?ye=-1:ye=Z+1):Z<Ae.length-1+ +!!ee&&(ye=Z+1),ye!==Z&&(ge.preventDefault(),re(ye));break}default:pe()}},[fe,pe,Z,_e,R,he,Ae]),bt=s.useCallback(ge=>{const ye=Ae.findIndex(je=>{if(je.textKey){const Bt=je.textKey;return je.value[Bt].toLowerCase().charAt([0])===ge.key.toLocaleLowerCase()}return je.value.toString().toLowerCase().charAt([0])===ge.key.toLocaleLowerCase()});ye>-1&&re(ye)},[Ae]),Le=s.useCallback(ge=>{ge&&(zv.includes(ge.key)?mt(ge):jv.includes(ge.key)&&!f&&bt(ge))},[fe,pe,Z,_e,R,he,Ae]);s.useEffect(()=>{if(qe!==null&&document.getElementsByClassName("sps-modal__body").length>0){const ge=()=>{j&&j(!1)},ye=document.getElementsByClassName("sps-modal__body")[0];return ye.addEventListener("scroll",ge),()=>{ye.removeEventListener("scroll",ge)}}},[]),s.useEffect(()=>{ie&&Ee.current&&Uv(Ee.current,{scrollMode:"if-needed",block:"nearest",inline:"nearest"})},[Z,ie]),s.useEffect(()=>{ce(x),x?Ce.current&&Ce.current.focus():re(-1)},[x]),s.useEffect(()=>{P&&Le(P)},[P]),s.useEffect(()=>{!ie&&oe.current&&(Ze({value:""}),oe.current.scrollTop=0),ie&&K&&K(he)},[ie]);const ot=H?H/16:U,Ln=ot?{maxHeight:`${ot}rem`}:{};function Pt(ge,ye){return ye?s.createElement(s.Fragment,null,ge.split(ye).map((je,Bt)=>ye.test(je)?s.createElement("u",{key:Bt},je):s.createElement(s.Fragment,{key:Bt},je))):s.createElement(s.Fragment,null,ge)}return Be(s.createElement("div",{className:Yt,id:I,"aria-activedescendant":Z>-1?`${I}-option-${Z}`:"",tabIndex:-1,ref:ae,style:dt,onMouseLeave:()=>re(-1),"data-testid":Y,...O},ve,s.createElement("div",{className:hn,ref:oe,"data-testid":`${Y}-options`,style:Ln},!J&&!xe.pending&&m&&Ae.length===0&&s.createElement("div",{className:"sps-option-list__zero-state"},m),(J||xe.pending)&&s.createElement("div",{className:"sps-option-list__loading"},s.createElement(ni,null)),!J&&!xe.pending&&Ae.map((ge,ye)=>{const je=`${I}-option-${ye}`,Bt=qv(ge.value,B,r),On=Mc(De.current,r||"",ge);return s.createElement("a",{key:je,id:je,role:M,"aria-selected":Bt,href:ge.href,className:G("sps-option-list__option",ge.caption&&"sps-option-list__option--has-caption",ge.disabled&&"sps-option-list__option--disabled",ge.bold&&"sps-option-list__option--bold",(Bt||On)&&"sps-option-list__option--selected",Z===ye&&"sps-option-list__option--highlighted"),onClick:ue=>st(ue,ge,On),onMouseOver:()=>re(ye),tabIndex:-1,ref:Z===ye?Ee:null,"data-testid":`${Y}-option-${ye}`},ge.value&&ge.value.icon&&s.createElement("i",{className:G("sps-icon","sps-option-list__option-icon",`sps-icon-${String(ge.value.icon)}`)}),(!ge.value||!ge.value.icon&&Xe)&&s.createElement("span",{className:"sps-option-list__option-icon-spacer"}),s.createElement("span",null,Pt(ge.text,xe.replacementPattern)),ge.caption&&s.createElement("div",{className:"sps-option-list__option-caption"},s.createElement("span",null,Pt(ge.caption,xe.replacementPattern))))})),z&&(ee==null?void 0:ee.label)&&s.createElement("a",{className:G("sps-option-list__option","sps-option-list__special-action",Z===Ae.length&&"sps-option-list__option--highlighted",ee.disabled&&"sps-option-list__special-action--disabled"),href:z.href,target:z.href&&ee.newTab?"_blank":"_self",onClick:ge=>st(ge,z),onMouseOver:()=>re(Ae.length),"data-testid":`${Y}-special-action`},ee.icon&&s.createElement("i",{className:G("sps-icon","sps-option-list__option-icon",`sps-icon-${String(ee.icon)}`)}),!ee.icon&&Xe&&s.createElement("span",{className:"sps-option-list__option-icon-spacer"}),s.createElement("span",null,ee.label))))});Object.assign(as,{displayName:"SpsOptionList"});function Jv(e,t,n=[]){return s.useMemo(()=>{function r(o){return s.createElement(e,{...o,...t},o.children)}return r},n)}function yt(e){return typeof e=="function"?e():e}const xp=function({children:e,elements:t}){if(t.length===0)return s.createElement(s.Fragment,null,e);const[n,r]=Array.isArray(t[0])?t[0]:[t[0]];return s.createElement(n,{...r??{}},s.createElement(xp,{elements:t.slice(1)},e))},kp=function({children:e,providers:t=[],...n}){return s.createElement("div",{...n},s.createElement(xp,{elements:t},e))},Zv=function({children:e,className:t,...n}){return s.createElement(kp,{className:`sps-app ${t}`,...n},e)};function Ot(e=[],t=[]){const n=Array.isArray(e)?v.flatten(e):[e],r=t.map(a=>Array.isArray(a)?a:[a]),o=new Array(r.length+1).fill(null).map(()=>[]);for(const a of n){let l=!1;for(let c=0;c<r.length;c+=1)for(const{type:p,props:m={}}of r[c])if(a.type===p&&Object.keys(m).every(u=>m[u]===a.props[u])){l=!0,o[c].push(a);break}l||o[o.length-1].push(a)}return o}function Ip(e,t,n){const r=Object.entries(t).filter(([,a])=>typeof a!="string"&&a.deprecated).map(([a])=>a),o=r.map(a=>n[a]);s.useEffect(()=>{o.find(a=>typeof a<"u")&&console.warn(`The following prop(s) of ${e} are deprecated: ${r.join(", ")}`)},o)}function si(e,t){const n=_.useRef(!1);_.useEffect(()=>{if(n.current)return e();n.current=!0},t)}function La(e,t,n){const r=s.useRef(t(...n));s.useEffect(()=>(document.addEventListener(e,r.current,{capture:!0}),()=>document.removeEventListener(e,r.current)),[]),s.useEffect(()=>{document.removeEventListener(e,r.current),r.current=t(...n),document.addEventListener(e,r.current,{capture:!0})},n)}function _c(e,t,n){return function(o){var a,l;!((a=e.current)!=null&&a.contains(o.target))&&!((l=t.current)!=null&&l.contains(o.target))&&n()}}function xr(e,t,n){const r=s.useRef(!1),[o,a]=s.useState(!1),l=s.useCallback(()=>{r.current?r.current=!1:a(!0)},[]),c=s.useCallback((p=!1)=>{a(!1),r.current=p,n&&n()},[]);return La("mousedown",_c,[e,t,c]),La("pointerdown",_c,[e,t,c]),{showPopup:o,doShowPopup:l,doHidePopup:c}}const Mp=e=>{const t=/(auto|scroll)/,n=(c,p)=>c.parentNode===null?p:n(c.parentNode,p.concat([c])),r=(c,p)=>getComputedStyle(c,null).getPropertyValue(p),o=c=>r(c,"overflow")+r(c,"overflow-y"),a=c=>t.test(o(c));return(c=>{if(!(c instanceof HTMLElement||c instanceof SVGElement))return;const p=n(c.parentNode,[]);for(let m=0;m<p.length;m+=1)if(a(p[m]))return p[m];return null})(e)};let Xo=0;function io({isOpen:e,rootRef:t}){s.useLayoutEffect(()=>{let n,r,o;if(e&&t.current){Xo+=1,n=Mp(t.current)||document.body,r=n===document.body?window.innerWidth-document.documentElement.clientWidth:n.offsetWidth-n.clientWidth,n.style.overflow="hidden";const a=window.getComputedStyle(n).paddingRight;if(n.style.paddingRight=a&&a!=="0px"?`calc(${a} + ${r}px)`:`${r}px`,n===document.body)if(o=document.getElementsByClassName("sps-navbar-container").item(0),o&&window.getComputedStyle(o).position==="fixed"){const l=window.getComputedStyle(o).paddingRight;o.style.paddingRight=l&&l!=="0px"?`calc(${l} + ${r}px)`:`${r}px`}else{const l=document.getElementsByTagName("nav").item(0);if(o=l==null?void 0:l.parentElement,o&&window.getComputedStyle(o).position==="fixed"){const c=window.getComputedStyle(o).paddingRight;o.style.paddingRight=c&&c!=="0px"?`calc(${c} + ${r}px)`:`${r}px`}}}return()=>{n&&(Xo-=1,Xo===0&&(n.style.overflow=null,n.style.paddingRight=null,o&&(o.style.paddingRight=null)))}},[e])}const Xv={debounce:"number",disabled:"boolean",formMeta:"SpsFormFieldMeta<string>",icon:"SpsIcon",onChange:"React.ChangeEventHandler",onSelectionChange:"(newValue: string) => void",placeholder:"string",suggestions:{type:`
|
|
1
|
+
"use strict";var sv=Object.defineProperty;var Cc=e=>{throw TypeError(e)};var ov=(e,t,n)=>t in e?sv(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n;var Vt=(e,t,n)=>ov(e,typeof t!="symbol"?t+"":t,n),Dc=(e,t,n)=>t.has(e)||Cc("Cannot "+n);var Fn=(e,t,n)=>(Dc(e,t,"read from private field"),n?n.call(e):t.get(e)),Is=(e,t,n)=>t.has(e)?Cc("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(e):t.set(e,n),cn=(e,t,n,r)=>(Dc(e,t,"write to private field"),r?r.call(e,n):t.set(e,n),n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react"),v=require("@spscommerce/utils"),it=require("moment-timezone"),W=require("@spscommerce/ds-shared"),no=require("react-dom"),xa=require("@spscommerce/ds-colors"),av=require("@sps-woodland/tabs"),fr=require("@react-stately/collections"),up=require("@sps-woodland/illustrations");function mp(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const s=mp(_),vr=mp(it);function fp(e){var t,n,r="";if(typeof e=="string"||typeof e=="number")r+=e;else if(typeof e=="object")if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=fp(e[t]))&&(r&&(r+=" "),r+=n);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}function G(){for(var e,t,n=0,r="";n<arguments.length;)(e=arguments[n++])&&(t=fp(e))&&(r&&(r+=" "),r+=t);return r}let gt=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((t,n)=>(n&=63,n<36?t+=n.toString(36):n<62?t+=(n-26).toString(36).toUpperCase():n>62?t+="-":t+="_",t),"");function xn(e){return _.useRef(e||gt())}function Tt(e,t){const n=xn(e),r=_.useRef(`${n.current}_ctrl`);return _.useEffect(()=>{t&&(t.id=r.current,t.update())},[t]),{wrapperId:n.current||void 0,controlId:r.current}}var qt=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function ei(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var iv="[object Object]";function lv(e){var t=!1;if(e!=null&&typeof e.toString!="function")try{t=!!(e+"")}catch{}return t}function cv(e,t){return function(n){return e(t(n))}}var dv=Function.prototype,hp=Object.prototype,Sp=dv.toString,pv=hp.hasOwnProperty,uv=Sp.call(Object),mv=hp.toString,fv=cv(Object.getPrototypeOf,Object);function hv(e){return!!e&&typeof e=="object"}function Sv(e){if(!hv(e)||mv.call(e)!=iv||lv(e))return!1;var t=fv(e);if(t===null)return!0;var n=pv.call(t,"constructor")&&t.constructor;return typeof n=="function"&&n instanceof n&&Sp.call(n)==uv}var gv=Sv;const gp=ei(gv),Nt=new Set,Dr=new Set,Jt=new Set,ro=new Set;function bp(e){Nt.has(e)||Jt.has(e)||ro.has(e)||Dr.add(e)}function vp(e){Nt.has(e)||Jt.has(e)||Dr.has(e)||ro.add(e)}const et=vr.default||vr,yr="MM/DD/YYYY",bv="MM/DD/YYYY hh:mm A",vv="MM/DD/YYYY HH:mm",yv="hh:mm A",Tv="HH:mm",Ev=/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/,jr=Symbol("Date Parse Error");function dr(e){return et.isMoment(e)?e.year()*1e4+(e.month()+1)*100+e.date():e.year*1e4+e.month*100+e.date}const X=Object.freeze({createFrom(e,t){if(!e)return null;if(typeof e=="string"){if(t){const n=et(e,t,!0);if(n.isValid())return Object.freeze({year:n.year(),month:n.month()+1,date:n.date()})}else{const n=Ev.exec(e);if(n){const[,r,o,a]=n;return Object.freeze({year:Number(a),month:Number(r),date:Number(o)})}}return Object.freeze({[jr]:!0,year:void 0,month:void 0,date:void 0})}return Object.freeze({year:e.year(),month:e.month()+1,date:e.date()})},createMomentFrom(e,t){if(!e)return null;let n=null;return typeof e=="string"?t?n=et(e,t,!0):n=et(e):et.isMoment(e)?n=e:n=X.toMoment(e),n!==null&&et.isMoment(n)&&n.isValid()?n:Object.freeze({[jr]:!0,year:void 0,month:void 0,date:void 0})},getRangeSeparator(e){return e!=null&&e.includes("-")?"/":"-"},createRangeFrom(e,t){if(!e)return null;if(t){const n=X.getRangeSeparator(t),r=new RegExp(`[^\\d]*${n}[^\\d]*`);return e.split(r).slice(0,2).map(o=>X.createFrom(o,t))}else return e.split(/[^\d]*-[^\d]*/).slice(0,2).map(n=>X.createFrom(n))},isValid(e){var t;return e?et.isMoment(e)?e.isValid():typeof e=="object"&&typeof e.year=="number"&&typeof e.month=="number"&&typeof e.date=="number"&&((t=X.toMoment(e))==null?void 0:t.isValid()):!1},nullifyInvalidDate(e){return X.isValid(e)?e:null},toMoment(e){return e?et.isMoment(e)?e:et({...e,month:e.month-1}):null},toString(e,t){const n=X.toMoment(e);return n&&n.isValid()?n.format(t||yr):""},toStringRange(e,t){if(!e)return"";const n=X.getRangeSeparator(t);return e.slice(0,2).map(r=>X.toString(r,t)).join(n)},toDateTimeString(e,t=!1,n){return e&&et.isMoment(e)&&e.isValid()?n?t?e.format(`${n} ${Tv}`):e.format(`${n} ${yv}`):t?e.format(vv):e.format(bv):""},toDateTimeStringRange(e,t=!1,n){if(!e)return"";const r=X.getRangeSeparator(n);return e.map(o=>X.toDateTimeString(o,t,n)).join(r)},create(){const e=new Date;return Object.freeze({year:e.getFullYear(),month:e.getMonth()+1,date:e.getDate()})},isSameDate(e,t){return e&&t&&e.year===t.year&&e.month===t.month&&e.date===t.date},isSameMonth(e,t){return e&&t&&e.year===t.year&&e.month===t.month},isAfter(e,t){return!e||!t?null:dr(e)>dr(t)},isBefore(e,t){return!e||!t?null:dr(e)<dr(t)},isInRange(e,t,n=!0){if(!e||!t||!t[0]||!t[1])return null;const r=dr(e),[o,a]=t.map(dr);return o&&a&&(n&&r>=o&&r<=a||!n&&r>o&&r<a)},prevMonth(e){return Object.freeze({year:e.month===1?e.year-1:e.year,month:e.month-1||12,date:e.date})},nextMonth(e){return Object.freeze({year:e.month===12?e.year+1:e.year,month:e.month+1>12?1:e.month+1,date:e.date})},createRangeFromPreset(e,t){if(typeof e.definition=="function")return e.definition();const n=et(),r=n.clone().subtract(et.duration(e.definition));return[X.createFrom(r,t),X.createFrom(n,t)]},createDateTimeRangeFromPreset(e){if(typeof e.definition=="function")return e.definition();let t;e.definition==="P0D"?t=et().startOf("day"):t=et().subtract(et.duration(e.definition));const n=et().endOf("day");return[t,n]},splitMomentInDateTimeParts(e,t=!1,n){return e&&et.isMoment(e)&&e.isValid()?X.toDateTimeString(e,t,n).split(" "):["",t?"00:00":"12:00",t?void 0:"AM"]},getCurrentMoment(){return et()},validateTimeString(e,t=!1){if(!e)return!0;const n=e.split(":"),r=n[0]||"0",o=n[1]||"0",a=Number.isNaN(Number(r))?NaN:parseInt(r,10),l=Number.isNaN(Number(o))?NaN:parseInt(o,10),c=n.length<=2&&r.length<=2&&o.length<=2;return t?c&&a>=0&&a<=23&&l>=0&&l<=59:c&&(!Number.isNaN(a)&&r.length===1||a>=1)&&a<=12&&l>=0&&l<=59},padIncompleteTimeString(e,t=!1){if(!e)return"";const n=e.split(":"),r=parseInt(n[0]||"0",10),o=parseInt(n[1]||"0",10);if(t){const a=r<10?`0${r}`:`${r}`,l=o<10?`0${o}`:`${o}`;return`${a}:${l}`}else{const a=r===0?"12":r<10?`0${r}`:`${r}`,l=o<10?`0${o}`:`${o}`;return`${a}:${l}`}}}),ka=["01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00"],Ia=["00:00","01:00","02:00","03:00","04:00","05:00","06:00","07:00","08:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00","18:00","19:00","20:00","21:00","22:00","23:00"];let Ys=yr;function yp(e){Ys=e}const qr=function(t){if(Array.isArray(t)){const n=qr(t[0]),r=qr(t[1]);return n||r}if(t&&t.hasOwnProperty("year")){if(t[jr])return{dateFormat:Ys};if(!X.isValid(t))return{dateValidity:!0}}return null};Nt.add("dateFormat");Nt.add("dateValidity");const Tp=function(t){if(Array.isArray(t)){const n=qr(t);if(n)return n;if(t&&X.isBefore(t[1],t[0]))return{dateRangeOrder:!0}}return null};Nt.add("dateRangeOrder");const Ep=function({minDate:t,maxDate:n}){function r(o){const a=X.isBefore(o,t),l=X.isAfter(o,n),c={minExceeded:a?X.toString(t,Ys):null,maxExceeded:l?X.toString(n,Ys):null};return a||l?{dateConstraint:c}:null}return function(a){if(!a)return null;if(Array.isArray(a)){const l=r(a[0]),c=r(a[1]);return l||c}return a.hasOwnProperty("year")?r(a):null}};Nt.add("dateConstraint");const wv=Object.freeze(Object.defineProperty({__proto__:null,date:qr,dateConstraint:Ep,dateRange:Tp,setDateFormat:yp},Symbol.toStringTag,{value:"Module"}));function un(e,t){for(const n of[].concat(e)){const r=t(n);if(r)return r}return null}const Cv=function(t){function n(r){return Number(r)>=t?null:{min:t}}return r=>un(r,n)};Nt.add("min");const Dv=function(t){function n(r){return Number(r)<=t?null:{max:t}}return r=>un(r,n)};Dr.add("max");const Nv=function(t){return typeof t>"u"||t===null||t===""||Number.isNaN(t)||(t==null?void 0:t.length)===0?{required:!0}:null};Dr.add("required");const xv=function(t){function n(r){return r===void 0||r.toString().length<t?{minLength:t}:null}return r=>un(r,n)};Nt.add("minLength");const kv=function(t){function n(r){return r==null||Array.isArray(r)&&r.length<t?{minLengthArray:t}:null}return r=>n(r)};Nt.add("minLengthArray");const Iv=function(t){function n(r){return r===void 0||r.toString().length<=t?null:{maxLength:t}}return r=>un(r,n)};Jt.add("maxLength");const Mv=function(t){function n(r){return r==null||Array.isArray(r)&&r.length<=t?null:{maxLengthArray:t}}return r=>n(r)};Nt.add("maxLengthArray");const _v=function(t){const n=t instanceof RegExp?t:new RegExp(t);function r(o){return n.test(o)?null:{pattern:t}}return o=>un(o,r)};Nt.add("pattern");const Rv=function(e){function t(n){return new RegExp("^\\p{L}*$","u").test(n)?null:{alpha:!0}}return un(e,t)};Jt.add("alpha");const Lv=function(e){function t(n){return/^[0-9,. ]*$/.test(n)?null:{numeric:!0}}return un(e,t)};Jt.add("numeric");const Ov=function(e){function t(n){return/^-?[0-9,. ]*$/.test(n)?null:{positiveOrNegativeNumber:!0}}return un(e,t)};Jt.add("positiveOrNegativeNumber");const Pv=function(e){function t(n){return/^[^0-9]*$/.test(n)?null:{nonNumeric:!0}}return un(e,t)};Jt.add("nonNumeric");const so=Object.freeze({...wv,min:Cv,max:Dv,required:Nv,minLength:xv,minLengthArray:kv,maxLength:Iv,maxLengthArray:Mv,pattern:_v,alpha:Rv,numeric:Lv,nonNumeric:Pv,positiveOrNegativeNumber:Ov,OnBlurErrorKeys:Nt});function oo(e,t=[]){const n=t.reduce((r,o)=>Object.assign(r,o(e)||{}),{});return Object.keys(n).length?n:null}var zt=(e=>(e[e.ON_CHANGE=0]="ON_CHANGE",e[e.ON_BLUR=1]="ON_BLUR",e[e.ON_SUBMIT=2]="ON_SUBMIT",e))(zt||{});function Bv(e,t={},n=[]){for(const[r,o]of Object.entries(t))o===0?bp(r):o===2&&vp(r);return s.useCallback(e,n)}var Un,Tn,En;class Wn{constructor(t,n){Vt(this,"validators",[]);Is(this,Un,null);Is(this,Tn,null);Is(this,En,null);Vt(this,"preventativeErrors",[]);Vt(this,"submitted",!1);this.path=t,this.update=n}get errors(){return Fn(this,Un)===null&&Fn(this,Tn)===null&&Fn(this,En)===null?null:{...Fn(this,Un)??{},...Fn(this,Tn)??{},...Fn(this,En)??{}}}setValidators(t){return this.update(this.path,null,void 0,t),this}validate(t,n,r=!1){if(this.validators&&this.validators.length>0){const o=oo(t,this.validators);let a={onSubmit:{},onChange:{},onBlur:{}};o&&(a=Object.keys(o).reduce((l,c)=>(ro.has(c)?l.onSubmit[c]=o[c]:Dr.has(c)?l.onChange[c]=o[c]:l.onBlur[c]=o[c],l),a)),(typeof n>"u"||n===zt.ON_CHANGE)&&cn(this,Tn,Object.keys(a.onChange).length===0?null:a.onChange),(typeof n>"u"||n===zt.ON_BLUR)&&cn(this,En,Object.keys(a.onBlur).length===0?null:a.onBlur),(typeof n>"u"||n===zt.ON_SUBMIT)&&(cn(this,Un,Object.keys(a.onSubmit).length===0?null:a.onSubmit),cn(this,Tn,Object.keys(a.onChange).length===0?null:a.onChange),cn(this,En,Object.keys(a.onBlur).length===0?null:a.onBlur)),r||this.update(),this.isFocused()&&this.onFocus&&this.onFocus()}else this.errors&&(cn(this,Un,null),cn(this,En,null),cn(this,Tn,null),r||this.update());return this}isValid(){return!this.errors||this.isPristine()}hasErrors(){return!!this.errors}isVisibilyInvalid(){return!this.isValid()}hasError(t){return this.errors&&Object.prototype.hasOwnProperty.call(this.errors,t)}hasPreventativeError(t){return this.preventativeErrors.includes(t)}hasPreventativeErrors(){return this.preventativeErrors.length>0}isRequired(){return this.validators&&this.validators.indexOf(so.required)>-1}isSubmitted(){return this.submitted}onFocus(){}onBlur(){}}Un=new WeakMap,Tn=new WeakMap,En=new WeakMap;class Jr extends Wn{constructor(){super(...arguments);Vt(this,"id",gt());Vt(this,"focused",!1);Vt(this,"pristine",!0)}setValue(n){if(this.preventativeErrors=[],this.validators&&this.validators.length>0){const r=oo(n,this.validators);if(r&&Object.keys(r).filter(a=>Jt.has(a)).length>0){this.preventativeErrors=Object.keys(r);return}}this.update(this.path,n)}isPristine(){return this.pristine}markAsPristine(){return this.pristine=!0,this.update(),this}markAsDirty(){return this.pristine=!1,this.update(),this}isFocused(){return this.focused}markAsFocused(){return this.focused=!0,this.update(),this.onFocus&&this.onFocus(),this}markAsBlurred(){return this.update(this.path,null,!0),this.onBlur&&this.onBlur(),this.preventativeErrors=[],this}markAsSubmitted(){return this.submitted=!0,this.update(this.path,null,!1,void 0,!0),this}}class Gn extends Jr{constructor(n,r,o){super(o?r:n,o||r);Vt(this,"fields");o&&this.inferMembers(n)}isFocused(){return super.isFocused()||this.rollup("isFocused")}isValid(){return super.isValid()&&this.rollup("isValid")}hasErrors(){return super.hasErrors()||Object.keys(this.fields).some(n=>this.fields[n].hasErrors())}contentsAreValid(){return this.rollup("isValid")&&this.rollup("contentsAreValid")}isPristine(){return super.isPristine()&&this.rollup("isPristine")}markAsPristine(){super.markAsPristine();for(const n of Object.keys(this.fields))this.fields[n].markAsPristine();return this}markAsDirty(){super.markAsDirty();for(const n of Object.keys(this.fields))this.fields[n].markAsDirty();return this}markAsBlurred(){super.markAsBlurred();for(const n of Object.keys(this.fields))this.fields[n].markAsBlurred();return this}markAsSubmitted(){super.markAsSubmitted();for(const n of Object.keys(this.fields))this.fields[n].markAsSubmitted();return this}inferSpsControl(n,r){return Ks(n,[...this.path,r],this.update)}rollup(n){return Object.keys(this.fields).reduce((r,o)=>r&&(!this.fields[o][n]||this.fields[o][n]()),!0)}}class wp extends Gn{inferMembers(t){this.fields={};for(const n of Object.keys(t))this.fields[n]=this.inferSpsControl(t[n],n)}}class Cp extends Gn{inferMembers(t){this.fields=t.map((n,r)=>this.inferSpsControl(n,String(r)))}}function Ks(e,t,n){return e instanceof Wn?(e.path=t,e.update=n,e):Array.isArray(e)?new Cp(e,t,n):gp(e)?new wp(e,t,n):new Jr(t,n)}function Wr(e,t){return t.length===0||!e?e:Wr(e.fields[t[0]],t.slice(1,t.length))}function Ma(e,t){if(t.length===0||!e)return[e];const n=t[0];if(t=t.slice(1,t.length),n==="*"){const r=Array.isArray(e.fields)?e.fields:Object.keys(e.fields).map(o=>e.fields[o]);return t.length===0?r:r.reduce((o,a)=>[...o,...Ma(a,t)],[])}return Ma(e.fields[n],t)}function _a(e,t,n){for(const r of Object.keys(t)){const o=t[r];for(const a of Ma(e,r.split(".")))a&&o&&n(a,o)}}function Ms(e,t,n,r=!1,o=!1){_a(t,n,(a,l)=>{a.validators=typeof l=="function"?l(e):l,r&&a.validate(v.getPath(e,a.path),void 0,o)})}function Ra(e,t){const n=t[0];return t=t.slice(1),Array.isArray(e)?e.map((r,o)=>o===Number(n)?Ra(r,t):r):gp(e)?Object.keys(e).reduce((r,o)=>Object.assign(r,{[o]:o===n?Ra(e[o],t):e[o]}),{}):e}function Av(e){if(typeof e!="object"||e===null||Array.isArray(e))throw new TypeError("The initial value of useSpsForm() hook must be an object.")}function Dp(e,t={}){Av(e);const[,n]=_.useState({}),r=_.useRef(!1);r.current=!1;const o=_.useRef(t),a=_.useCallback(h=>{var T,E;const S=u.current;let y;if(h)if(h.path)if(h.markAsBlurred){const w=Wr(S.formMeta,h.path);if(w){w.focused=!1;const N=v.getPath(S.formValue,h.path);w.validate(N,zt.ON_BLUR)}}else if(h.newValidators){if(o.current){const w=h.path.join(".");o.current={...o.current,[w]:h.newValidators},Ms(S.formValue,S.formMeta,o.current,!0)}}else if(h.markAsSubmitted){const w=Wr(S.formMeta,h.path);if(w){w.submitted=!0;const N=v.getPath(S.formValue,h.path);w.validate(N,zt.ON_SUBMIT)}}else y=Ra(S.formValue,h.path),v.setPath(y,h.path,h.value);else y=h.value;if((T=h==null?void 0:h.updateFormOptions)!=null&&T.validators&&(o.current={...o.current,...h.updateFormOptions.validators},Ms(S.formValue,S.formMeta,o.current,((E=h.updateFormOptions)==null?void 0:E.runValidators)??!0)),y){S.formMeta.submitted=!1,v.deepFreeze(y);const w=v.diff(S.formValue,y);for(const{type:I,key:k,parentPath:x,objects:[,F]}of w){const P=Wr(S.formMeta,x);if(typeof k!="symbol"&&P){let C;switch(I){case v.DiffChange.ADDITION:P.fields[k]=Ks(F[k],[...x,k],c);break;case v.DiffChange.DELETION:Array.isArray(P.fields)?P.fields[k]=void 0:delete P.fields[k];break;case v.DiffChange.ALTERATION:C=Ks(F[k],[...x,k],c),(C instanceof Gn&&!(P.fields[k]instanceof Gn)||!(C instanceof Gn)&&P.fields[k]instanceof Gn)&&(C.pristine=!1,P.fields[k]=C);break}}}const N=new Set;if(w.filter(I=>I.type===v.DiffChange.DELETION).reduce((I,k)=>(I.has(k.parentPath)||I.add(k.parentPath),I),N),Array.from(N).forEach(I=>{const k=Wr(S.formMeta,I);Array.isArray(k.fields)&&(k.fields=k.fields.filter(x=>x!==void 0))}),o.current){Ms(y,S.formMeta,o.current);const I=new Set;t&&_a(S.formMeta,t,(k,x)=>{typeof x=="function"&&(k.validate(v.getPath(y,k.path)),I.add(k))});for(const{type:k,key:x,parentPath:F,objects:[,P]}of w)if(typeof x!="symbol"){let C=S.formMeta,L=y;if(C){for(const R of F)C=C.fields[R],L=L[R],I.has(C)||C.validate(L,zt.ON_CHANGE);if(k===v.DiffChange.ADDITION||k===v.DiffChange.ALTERATION){const R=C.fields[x];if(!I.has(R)&&(C.fields[x].validate(P[x],zt.ON_CHANGE),k===v.DiffChange.ADDITION&&R.fields))for(const[K,j]of Object.entries(R.fields))j.validate(P[x][K],zt.ON_CHANGE)}}}}}u.current={...S,formValue:y||S.formValue},r.current||n({})},[]),l=_.useCallback((h,S)=>{h||S?a({value:h,updateFormOptions:S}):a()},[a]),c=_.useCallback((h,S,y=!1,T,E=!1)=>{h?a({path:h,value:S,markAsBlurred:y,newValidators:T,markAsSubmitted:E}):l()},[a,l]),p=_.useMemo(()=>{v.deepFreeze(e);const h=Ks(e,[],c);return t&&Ms(e,h,t,!1,!0),h},[]),m=_.useCallback(()=>(u.current.formMeta.markAsDirty(),o.current&&_a(u.current.formMeta,o.current,(h,S)=>{(typeof S=="function"||Array.isArray(S))&&h.validate(v.getPath(u.current.formValue,h.path))}),u.current.formMeta.isValid()),[]),f=_.useCallback(()=>u.current.formValue,[]),u=_.useRef({formValue:e,formMeta:p,updateForm:l,validateForm:m,getCurrentFormValue:f});return u.current}const lt=s.forwardRef((e,t)=>{const{className:n,children:r,focusInputOnClick:o,formControl:a,formMeta:l,inputRef:c,onClick:p,...m}=e,f=s.useRef(),h=c||(t||f);function S(){h&&h!==t&&h.current&&h.current.focus()}function y(){h&&h!==t&&h.current&&l&&l instanceof Jr&&l.markAsFocused()}function T(){h&&h!==t&&h.current&&l&&l instanceof Jr&&l.markAsBlurred()}const E=G("sps-form-group",(a&&a.isRequired()||l&&l.isRequired())&&"sps-form-group--required",(a&&!a.isValid()||l&&l.isVisibilyInvalid())&&"sps-form-group--error",l&&l.hasPreventativeErrors()&&"sps-form-group--preventative-error",n);function w(N){o&&S(),p&&p(N)}return s.useEffect(()=>{function N(I){I.target.classList.contains("sps-form-control__clear-btn")&&I.preventDefault()}return document.addEventListener("mousedown",N),()=>{document.removeEventListener("mousedown",N)}},[]),s.createElement("div",{...m,className:E,ref:t,tabIndex:-1,onClick:w,onFocus:y,onBlur:T},r)});Object.assign(lt,{displayName:"SpsFormComponentWrapper"});function Nc(e){return typeof e=="object"&&e!=null&&e.nodeType===1}function xc(e,t){return(!t||e!=="hidden")&&e!=="visible"&&e!=="clip"}function Zo(e,t){if(e.clientHeight<e.scrollHeight||e.clientWidth<e.scrollWidth){var n=getComputedStyle(e,null);return xc(n.overflowY,t)||xc(n.overflowX,t)||function(r){var o=function(a){if(!a.ownerDocument||!a.ownerDocument.defaultView)return null;try{return a.ownerDocument.defaultView.frameElement}catch{return null}}(r);return!!o&&(o.clientHeight<r.scrollHeight||o.clientWidth<r.scrollWidth)}(e)}return!1}function _s(e,t,n,r,o,a,l,c){return a<e&&l>t||a>e&&l<t?0:a<=e&&c<=n||l>=t&&c>=n?a-e-r:l>t&&c<n||a<e&&c>n?l-t+o:0}var kc=function(e,t){var n=window,r=t.scrollMode,o=t.block,a=t.inline,l=t.boundary,c=t.skipOverflowHiddenElements,p=typeof l=="function"?l:function(Be){return Be!==l};if(!Nc(e))throw new TypeError("Invalid target");for(var m,f,u=document.scrollingElement||document.documentElement,h=[],S=e;Nc(S)&&p(S);){if((S=(f=(m=S).parentElement)==null?m.getRootNode().host||null:f)===u){h.push(S);break}S!=null&&S===document.body&&Zo(S)&&!Zo(document.documentElement)||S!=null&&Zo(S,c)&&h.push(S)}for(var y=n.visualViewport?n.visualViewport.width:innerWidth,T=n.visualViewport?n.visualViewport.height:innerHeight,E=window.scrollX||pageXOffset,w=window.scrollY||pageYOffset,N=e.getBoundingClientRect(),I=N.height,k=N.width,x=N.top,F=N.right,P=N.bottom,C=N.left,L=o==="start"||o==="nearest"?x:o==="end"?P:x+I/2,R=a==="center"?C+k/2:a==="end"?F:C,K=[],j=0;j<h.length;j++){var M=h[j],Q=M.getBoundingClientRect(),B=Q.height,ee=Q.width,V=Q.top,J=Q.right,se=Q.bottom,H=Q.left;if(r==="if-needed"&&x>=0&&C>=0&&P<=T&&F<=y&&x>=V&&P<=se&&C>=H&&F<=J)return K;var U=getComputedStyle(M),ne=parseInt(U.borderLeftWidth,10),te=parseInt(U.borderTopWidth,10),Y=parseInt(U.borderRightWidth,10),O=parseInt(U.borderBottomWidth,10),z=0,Z=0,re="offsetWidth"in M?M.offsetWidth-M.clientWidth-ne-Y:0,ie="offsetHeight"in M?M.offsetHeight-M.clientHeight-te-O:0,ce="offsetWidth"in M?M.offsetWidth===0?0:ee/M.offsetWidth:0,ae="offsetHeight"in M?M.offsetHeight===0?0:B/M.offsetHeight:0;if(u===M)z=o==="start"?L:o==="end"?L-T:o==="nearest"?_s(w,w+T,T,te,O,w+L,w+L+I,I):L-T/2,Z=a==="start"?R:a==="center"?R-y/2:a==="end"?R-y:_s(E,E+y,y,ne,Y,E+R,E+R+k,k),z=Math.max(0,z+w),Z=Math.max(0,Z+E);else{z=o==="start"?L-V-te:o==="end"?L-se+O+ie:o==="nearest"?_s(V,se,B,te,O+ie,L,L+I,I):L-(V+B/2)+ie/2,Z=a==="start"?R-H-ne:a==="center"?R-(H+ee/2)+re/2:a==="end"?R-J+Y+re:_s(H,J,ee,ne,Y+re,R,R+k,k);var oe=M.scrollLeft,Ee=M.scrollTop;L+=Ee-(z=Math.max(0,Math.min(Ee+z/ae,M.scrollHeight-B/ae+ie))),R+=oe-(Z=Math.max(0,Math.min(oe+Z/ce,M.scrollWidth-ee/ce+re)))}K.push({el:M,top:z,left:Z})}return K};function Np(e){return e===Object(e)&&Object.keys(e).length!==0}function Fv(e,t){t===void 0&&(t="auto");var n="scrollBehavior"in document.body.style;e.forEach(function(r){var o=r.el,a=r.top,l=r.left;o.scroll&&n?o.scroll({top:a,left:l,behavior:t}):(o.scrollTop=a,o.scrollLeft=l)})}function Vv(e){return e===!1?{block:"end",inline:"nearest"}:Np(e)?e:{block:"start",inline:"nearest"}}function ao(e,t){var n=e.isConnected||e.ownerDocument.documentElement.contains(e);if(Np(t)&&typeof t.behavior=="function")return t.behavior(n?kc(e,t):[]);if(n){var r=Vv(t);return Fv(kc(e,r),r.behavior)}}const ti=Object.freeze(Object.defineProperty({__proto__:null,default:ao},Symbol.toStringTag,{value:"Module"})),Ke=s.createContext(W.noI18nI18n),$v={alt:"string",size:"SpinnerSize",title:"string"};function ni(e){const{alt:t,className:n,size:r=W.SpinnerSize.MEDIUM,"data-testid":o,title:a,unsafelyReplaceClassName:l,...c}=e,{t:p}=s.useContext(Ke),m=t||a||p("design-system:spinner.defaultAltText"),f=G(l||"sps-spinner",`sps-spinner--${r}`,n);return s.createElement("i",{className:f,"data-testid":o,title:m,...c})}Object.assign(ni,{props:$v,displayName:"SpsSpinner"});const Kv=60;function Rs(e){return typeof e>"u"?"inherit":`${e}px`}function ri(e){switch(e){case W.Position.TOP_LEFT:return W.Position.BOTTOM_LEFT;case W.Position.TOP_MIDDLE:return W.Position.BOTTOM_MIDDLE;case W.Position.TOP_RIGHT:return W.Position.BOTTOM_RIGHT;case W.Position.RIGHT_TOP:return W.Position.LEFT_TOP;case W.Position.RIGHT_MIDDLE:return W.Position.LEFT_MIDDLE;case W.Position.RIGHT_BOTTOM:return W.Position.LEFT_BOTTOM;case W.Position.BOTTOM_RIGHT:return W.Position.TOP_RIGHT;case W.Position.BOTTOM_MIDDLE:return W.Position.TOP_MIDDLE;case W.Position.BOTTOM_LEFT:return W.Position.TOP_LEFT;case W.Position.LEFT_BOTTOM:return W.Position.RIGHT_BOTTOM;case W.Position.LEFT_MIDDLE:return W.Position.RIGHT_MIDDLE;case W.Position.LEFT_TOP:return W.Position.RIGHT_TOP}}function Hv(e,t,n,r,o,a,l,c){const p=l&&l.current,m=p?p.scrollTop:window.pageYOffset,f=c?0:m,u=p?p.scrollLeft:window.pageXOffset,h=c?0:u,[S,y]=e.split(" ");let T,E,w,N;switch(S){case"top":w=t.height-n.top-f-a[0];break;case"left":E=t.width-n.left-h-a[0];break;case"right":N=n.right+h-a[0];break;case"bottom":T=n.bottom+f-a[0];break;default:throw new Error(`Invalid position ${e}`)}switch(y){case"left":N=n.left+h+a[1];break;case"top":T=n.top+f+a[1];break;case"middle":S==="top"||S==="bottom"?N=n.left+h+n.width/2-o/2+a[1]:(S==="left"||S==="right")&&(T=n.top+f+n.height/2-r.height/2+a[1]);break;case"bottom":w=t.height-n.bottom-f+a[1];break;case"right":E=t.width-n.right-h+a[1];break;default:throw new Error(`Invalid position ${e}`)}return[T,E,w,N]}function zn(e,t,n,{altPosition:r,setMinWidth:o=!1,setWidth:a=!1,parentElementRef:l,fixed:c=!1,offsets:p=[0,0]}){if(e.current&&t.current){const m=Math.max(document.documentElement.clientHeight,window.innerHeight||0),f=document.documentElement.getBoundingClientRect().width,u=l&&l.current?l.current:document.documentElement,h=c?{width:f,height:m,top:0,left:0,bottom:m,right:f}:u.getBoundingClientRect(),S=e.current.getBoundingClientRect(),y=t.current.getBoundingClientRect(),[T]=n.split(" ");let E=n;r&&(T==="top"&&y.top-S.height<Kv||T==="right"&&y.right+S.width>f||T==="bottom"&&y.bottom+S.height>m||T==="left"&&y.left-S.width<0)&&(E=r);const w=o?Math.max(y.width,S.width):S.width,N=a?y.width:w,[I,k,x,F]=Hv(E,h,y,S,N,p,l,c),P={top:Rs(I),right:Rs(k),bottom:Rs(x),left:Rs(F)};return c&&(P.position="fixed",P.zIndex=W.ZStratum.BAR),o&&(P.minWidth=`${y.width}px`),a&&(P.width=`${y.width}px`),[P,E===r]}return[{},!1]}const Lt=_.createContext(null);function Nr(e,t=[]){const n=_.useContext(Lt);return _.useMemo(()=>r=>{const a=n&&n.parentElementRef&&n.parentElementRef.current||document.body;let l=null,c=a.lastElementChild;for(;c&&c!==a.firstElementChild;){if(c.hasAttribute("data-portalid")&&c.getAttribute("data-portalid")===e){l=c;break}c=c.previousElementSibling}if(l)a.contains(l)||a.appendChild(l);else{l=document.createElement("div"),l.setAttribute("data-portalid",e);for(const p of t)l.classList.add(p);a.appendChild(l)}return no.createPortal(r,l)},[n])}async function Ic(e,t,n,r,o,a){const l=typeof e.options=="function"?e.options(t.value):e.options||[],c=l instanceof Promise,p=u=>u.replace(/([.?*+^$[\]\\(){}|-])/g,"");n({pending:c}),a.current=c?l:null;const m=c?await l||[]:l||[];if(c&&a.current!==l)return;let f=Array.from(m).filter(Boolean).map(u=>new W.SpsOptionListOption(u,typeof u=="function"?{textKey:"label",captionKey:"caption"}:{textKey:e.textKey,captionKey:e.captionKey}));if(e.nullOption&&f.unshift(new W.SpsOptionListOption(null,{text:e.nullOption})),t.value&&!e.disableDefaultOptionsFiltering){const u=p(t.value);n({replacementPattern:new RegExp(`(${u})`,"ig")}),f=f.filter(h=>{const S=new RegExp(u,"i"),y=p(h.text);return e.filterByTextAndCaptionKey?S.test(y)||S.test(p(h.caption)):S.test(y)})}else n({replacementPattern:null});if(e.disabledOptions)for(const u of f)e.disabledOptions.includes(u.value)&&(u.disabled=!0);r(Object.freeze(f)),e.onOptionListChanged&&e.onOptionListChanged(f.length),o(f.some(u=>u.value&&!!u.value.icon)),n({pending:!1})}function Wv(e,t,n){const[r,o]=s.useState(Object.freeze([])),[a,l]=s.useState(!1),c=s.useRef(null),p=s.useRef(e.options);(typeof e.options!="function"||e.disableOptionsMemoization)&&(p.current=e.options);const m=s.useMemo(()=>typeof p.current=="function"?v.debounce(Ic,typeof e.searchDebounce<"u"?e.searchDebounce:500):Ic,[p.current,e.disabledOptions]);return s.useEffect(()=>{m(e,t,n,o,l,c)},[p.current,t.value,e.disabledOptions]),[r,a]}class kn{constructor(t,n){Vt(this,"nativeEvent");Vt(this,"currentTarget");Vt(this,"isPgStoppedInternal",!1);this.target=t,this.currentTarget=t,this.nativeEvent=new CustomEvent("change",n),Object.defineProperty(this.nativeEvent,"target",{value:t,writable:!1,configurable:!1,enumerable:!0})}get bubbles(){return this.nativeEvent.bubbles}get cancelable(){return this.nativeEvent.cancelable}get defaultPrevented(){return this.nativeEvent.defaultPrevented}get eventPhase(){return this.nativeEvent.eventPhase}get isTrusted(){return this.nativeEvent.isTrusted}get timeStamp(){return this.nativeEvent.timeStamp}get type(){return this.nativeEvent.type}preventDefault(){this.nativeEvent.preventDefault()}isDefaultPrevented(){return this.defaultPrevented}stopPropagation(){this.nativeEvent.stopPropagation(),this.isPgStoppedInternal=!0}isPropagationStopped(){return this.isPgStoppedInternal}persist(){throw new Error("This is not a real React ChangeEvent. React does not permit the creation of SyntheticEvents in userland.")}}function Gv(e,t){return{...e,...t}}function Zt(e){return _.useReducer(Gv,e)}function Yv({hideInlineSearch:e,options:t,onSearchChange:n,search:r="",searchPlaceholder:o="Search…",searchInputRef:a}){const[l,c]=Zt({isAsync:typeof t=="function",pending:!1,value:r,replacementPattern:null}),p=s.useCallback(S=>{c({value:S.target.value}),n&&n(S)},[n]),m=s.useCallback(S=>{S.nativeEvent.stopImmediatePropagation(),S.stopPropagation()},[]),f=s.useCallback(S=>{S.nativeEvent.stopImmediatePropagation(),c({value:""}),a!=null&&a.current&&(n&&n(new kn(a.current)),a.current.focus())},[n]),u=S=>{S&&(["Tab","Escape","Enter","Up","ArrowUp","Down","ArrowDown"].includes(S.key)||S.stopPropagation())};return s.useEffect(()=>{c({value:r})},[r]),[l.isAsync&&!e?s.createElement("div",{className:"sps-option-list__search sps-form-group sps-text-input"},s.createElement("div",{className:"sps-form-control"},!l.value&&s.createElement("i",{className:"sps-icon sps-icon-filter sps-text-input__icon"}),s.createElement("input",{type:"text",className:"sps-text-input__input",placeholder:o,ref:a,value:l.value,onChange:p,onClick:m,onKeyDown:u}),l.value&&s.createElement("i",{className:"sps-icon sps-icon-x-circle sps-form-control__clear-btn",onClick:f}))):s.createElement(s.Fragment,null),l,c]}const Uv=ao||ti,zv=["Tab","Escape","Enter","Up","ArrowUp","Down","ArrowDown"],jv=["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];function qv(e,t,n){return n?(e&&e[n])===(t&&t[n]):e===t}function Mc(e,t,n){return typeof n.value=="function"&&n.disabled?!0:t?!!(e!=null&&e.find(r=>{var o;return r[t]&&r[t]===((o=n==null?void 0:n.value)==null?void 0:o[t])})):!1}const as=s.forwardRef((e,t)=>{const{captionKey:n,comparisonKey:r,disabledOptions:o,options:a,tall:l,textKey:c,valueKey:p,zeroState:m,hideInlineSearch:f,onSearchChange:u,search:h,searchDebounce:S,searchPlaceholder:y,onSpecialActionSelect:T,attachTo:E,className:w,conformWidth:N,id:I,ignoreWidthStyles:k,isOpen:x,keepOpen:F,keyDown:P,nullOption:C,onOptionListChanged:L,onOptionSelected:R,onPositionFlip:K,onSelfToggle:j,optionRole:M,positionOverride:Q,selectedOption:B,specialAction:ee,unsafelyReplaceClassName:V,loading:J,filterByTextAndCaptionKey:se,maxHeightPx:H,maxHeightRem:U,disableOptionsMemoization:ne,disableDefaultOptionsFiltering:te,"data-testid":Y,...O}=e,z=s.useMemo(()=>ee?new W.SpsOptionListOption(ee,{textKey:"label",captionKey:"caption"}):null,[ee]),[Z,re]=s.useState(-1),[ie,ce]=s.useState(x),ae=t||s.useRef(null),oe=s.useRef(null),Ee=s.useRef(null),Be=Nr("sps-option-list-portal"),qe=s.useContext(Lt),[ct,ut]=Q||[W.Position.BOTTOM_LEFT,W.Position.TOP_LEFT],[[dt,he],ze]=s.useState([{},!1]),Ce=s.useRef(null),[ve,xe,Ze]=Yv({...e,searchInputRef:Ce}),[Ae,Xe]=Wv(e,xe,Ze);s.useEffect(()=>{ze(ie?zn(ae,E,ct,{altPosition:ut,setMinWidth:!k,setWidth:!k&&N,...qe}):[{},!1])},[ie,ct,ut,Ae]),s.useEffect(()=>{let ge;return ie&&(ge=()=>{ie&&ze(zn(ae,E,ct,{altPosition:ut,setMinWidth:!k,setWidth:!k&&N,...qe}))},document.addEventListener("scroll",ge)),()=>{ge&&document.removeEventListener("scroll",ge)}},[ie]),s.useEffect(()=>{re(-1)},[xe]);const Yt=G(V||"sps-option-list","z-stratum-dropdown",ie&&"sps-option-list--open",xe.isAsync&&"sps-option-list--searchable",he&&"sps-option-list--opens-upward",ee&&ee.label&&"sps-option-list--has-special-action",w),hn=G(V||"sps-option-list__options",l&&"sps-option-list__options--tall"),pe=s.useCallback(()=>{ie||(ce(!0),Ce.current&&Ce.current.focus(),re(-1),j&&j(!0))},[ie,j]),fe=s.useCallback(()=>{ie&&(ce(!1),re(-1),j&&j(!1))},[ie,j]),_e=s.useCallback((ge,ye)=>{ye||ge&&!ge.disabled&&(typeof ge.value=="function"?(ge.value(),T&&T()):typeof R=="function"&&R(ge.value),F||fe())},[R,fe]),st=s.useCallback((ge,ye,je)=>{ge.stopPropagation(),_e(ye,je)},[_e]),De=s.useRef(o||[]);De.current=o||[];const mt=s.useCallback(ge=>{switch(ge.key){case"Tab":case"Escape":fe();break;case"Enter":if(Z>-1){const ye=Ae[Z]||z;ge.preventDefault();const je=!!ye&&Mc(De.current,r||"",ye);!je&&ye&&typeof R=="function"&&typeof ye.value=="function"?ye.value():ye&&_e(ye,je)}break;case"Up":case"ArrowUp":{let ye=Z;he?Z<=-1?ye=Ae.length-1:Z===0?ee&&(ye=Ae.length):Z<Ae.length&&(ye=Z-1):Z>-1&&(ye=Z-1),ye!==Z&&(ge.preventDefault(),re(ye));break}case"Down":case"ArrowDown":{pe();let ye=Z;he?Z!==-1&&(Z>=Ae.length?ye=0:Z===Ae.length-1?ye=-1:ye=Z+1):Z<Ae.length-1+ +!!ee&&(ye=Z+1),ye!==Z&&(ge.preventDefault(),re(ye));break}default:pe()}},[fe,pe,Z,_e,R,he,Ae]),bt=s.useCallback(ge=>{const ye=Ae.findIndex(je=>{if(je.textKey){const Bt=je.textKey;return je.value[Bt].toLowerCase().charAt([0])===ge.key.toLocaleLowerCase()}return je.value.toString().toLowerCase().charAt([0])===ge.key.toLocaleLowerCase()});ye>-1&&re(ye)},[Ae]),Le=s.useCallback(ge=>{ge&&(zv.includes(ge.key)?mt(ge):jv.includes(ge.key)&&!f&&bt(ge))},[fe,pe,Z,_e,R,he,Ae]);s.useEffect(()=>{if(qe!==null&&document.getElementsByClassName("sps-modal__body").length>0){const ge=()=>{j&&j(!1)},ye=document.getElementsByClassName("sps-modal__body")[0];return ye.addEventListener("scroll",ge),()=>{ye.removeEventListener("scroll",ge)}}},[]),s.useEffect(()=>{ie&&Ee.current&&Uv(Ee.current,{scrollMode:"if-needed",block:"nearest",inline:"nearest"})},[Z,ie]),s.useEffect(()=>{ce(x),x?Ce.current&&Ce.current.focus():re(-1)},[x]),s.useEffect(()=>{P&&Le(P)},[P]),s.useEffect(()=>{!ie&&oe.current&&(Ze({value:""}),oe.current.scrollTop=0),ie&&K&&K(he)},[ie]);const ot=H?H/16:U,Ln=ot?{maxHeight:`${ot}rem`}:{};function Pt(ge,ye){return ye?s.createElement(s.Fragment,null,ge.split(ye).map((je,Bt)=>ye.test(je)?s.createElement("u",{key:Bt},je):s.createElement(s.Fragment,{key:Bt},je))):s.createElement(s.Fragment,null,ge)}return Be(s.createElement("div",{className:Yt,id:I,"aria-activedescendant":Z>-1?`${I}-option-${Z}`:"",tabIndex:-1,ref:ae,style:dt,onMouseLeave:()=>re(-1),"data-testid":Y,...O},ve,s.createElement("div",{className:hn,ref:oe,"data-testid":`${Y}-options`,style:Ln},!J&&!xe.pending&&m&&Ae.length===0&&s.createElement("div",{className:"sps-option-list__zero-state"},m),(J||xe.pending)&&s.createElement("div",{className:"sps-option-list__loading"},s.createElement(ni,null)),!J&&!xe.pending&&Ae.map((ge,ye)=>{const je=`${I}-option-${ye}`,Bt=qv(ge.value,B,r),On=Mc(De.current,r||"",ge);return s.createElement("a",{key:je,id:je,role:M,"aria-selected":Bt,href:ge.href,className:G("sps-option-list__option",ge.caption&&"sps-option-list__option--has-caption",ge.disabled&&"sps-option-list__option--disabled",ge.bold&&"sps-option-list__option--bold",(Bt||On)&&"sps-option-list__option--selected",Z===ye&&"sps-option-list__option--highlighted"),onClick:ue=>st(ue,ge,On),onMouseOver:()=>re(ye),tabIndex:-1,ref:Z===ye?Ee:null,"data-testid":`${Y}-option-${ye}`},ge.value&&ge.value.icon&&s.createElement("i",{className:G("sps-icon","sps-option-list__option-icon",`sps-icon-${String(ge.value.icon)}`)}),(!ge.value||!ge.value.icon&&Xe)&&s.createElement("span",{className:"sps-option-list__option-icon-spacer"}),s.createElement("span",null,Pt(ge.text,xe.replacementPattern)),ge.caption&&s.createElement("div",{className:"sps-option-list__option-caption"},s.createElement("span",null,Pt(ge.caption,xe.replacementPattern))))})),z&&(ee==null?void 0:ee.label)&&s.createElement("a",{className:G("sps-option-list__option","sps-option-list__special-action",Z===Ae.length&&"sps-option-list__option--highlighted",ee.disabled&&"sps-option-list__special-action--disabled"),href:z.href,target:z.href&&ee.newTab?"_blank":"_self",onClick:ge=>st(ge,z),onMouseOver:()=>re(Ae.length),"data-testid":`${Y}-special-action`},ee.icon&&s.createElement("i",{className:G("sps-icon","sps-option-list__option-icon",`sps-icon-${String(ee.icon)}`)}),!ee.icon&&Xe&&s.createElement("span",{className:"sps-option-list__option-icon-spacer"}),s.createElement("span",null,ee.label))))});Object.assign(as,{displayName:"SpsOptionList"});function Jv(e,t,n=[]){return s.useMemo(()=>{function r(o){return s.createElement(e,{...o,...t},o.children)}return r},n)}function yt(e){return typeof e=="function"?e():e}const xp=function({children:e,elements:t}){if(t.length===0)return s.createElement(s.Fragment,null,e);const[n,r]=Array.isArray(t[0])?t[0]:[t[0]];return s.createElement(n,{...r??{}},s.createElement(xp,{elements:t.slice(1)},e))},kp=function({children:e,providers:t=[],...n}){return s.createElement("div",{...n},s.createElement(xp,{elements:t},e))},Zv=function({children:e,className:t,...n}){return s.createElement(kp,{className:`sps-app ${t}`,...n},e)};function Ot(e=[],t=[]){const n=Array.isArray(e)?v.flatten(e):[e],r=t.map(a=>Array.isArray(a)?a:[a]),o=new Array(r.length+1).fill(null).map(()=>[]);for(const a of n){let l=!1;for(let c=0;c<r.length;c+=1)for(const{type:p,props:m={}}of r[c])if(a.type===p&&Object.keys(m).every(u=>m[u]===a.props[u])){l=!0,o[c].push(a);break}l||o[o.length-1].push(a)}return o}function Ip(e,t,n){const r=Object.entries(t).filter(([,a])=>typeof a!="string"&&a.deprecated).map(([a])=>a),o=r.map(a=>n[a]);s.useEffect(()=>{o.find(a=>typeof a<"u")&&console.warn(`The following prop(s) of ${e} are deprecated: ${r.join(", ")}`)},o)}function si(e,t){const n=_.useRef(!1);_.useEffect(()=>{if(n.current)return e();n.current=!0},t)}function La(e,t,n){const r=s.useRef(t(...n));s.useEffect(()=>(document.addEventListener(e,r.current,{capture:!0}),()=>document.removeEventListener(e,r.current)),[]),s.useEffect(()=>{document.removeEventListener(e,r.current),r.current=t(...n),document.addEventListener(e,r.current,{capture:!0})},n)}function _c(e,t,n){return function(o){var a,l;!((a=e.current)!=null&&a.contains(o.target))&&!((l=t.current)!=null&&l.contains(o.target))&&n()}}function xr(e,t,n){const r=s.useRef(!1),[o,a]=s.useState(!1),l=s.useCallback(()=>{r.current?r.current=!1:a(!0)},[]),c=s.useCallback((p=!1)=>{a(!1),r.current=p,n&&n()},[]);return La("mousedown",_c,[e,t,c]),La("pointerdown",_c,[e,t,c]),{showPopup:o,doShowPopup:l,doHidePopup:c}}const Mp=e=>{const t=/(auto|scroll)/,n=(c,p)=>c.parentNode===null?p:n(c.parentNode,p.concat([c])),r=(c,p)=>getComputedStyle(c,null).getPropertyValue(p),o=c=>r(c,"overflow")+r(c,"overflow-y"),a=c=>t.test(o(c));return(c=>{if(!(c instanceof HTMLElement||c instanceof SVGElement))return;const p=n(c.parentNode,[]);for(let m=0;m<p.length;m+=1)if(a(p[m]))return p[m];return null})(e)};let Xo=0;function io({isOpen:e,rootRef:t}){s.useLayoutEffect(()=>{let n,r,o;if(e&&t.current){Xo+=1,n=Mp(t.current)||document.body,r=n===document.body?window.innerWidth-document.documentElement.clientWidth:n.offsetWidth-n.clientWidth,n.style.overflow="hidden";const a=window.getComputedStyle(n).paddingRight;if(n.style.paddingRight=a&&a!=="0px"?`calc(${a} + ${r}px)`:`${r}px`,n===document.body)if(o=document.getElementsByClassName("sps-navbar-container").item(0),o&&window.getComputedStyle(o).position==="fixed"){const l=window.getComputedStyle(o).paddingRight;o.style.paddingRight=l&&l!=="0px"?`calc(${l} + ${r}px)`:`${r}px`}else{const l=document.getElementsByTagName("nav").item(0);if(o=l==null?void 0:l.parentElement,o&&window.getComputedStyle(o).position==="fixed"){const c=window.getComputedStyle(o).paddingRight;o.style.paddingRight=c&&c!=="0px"?`calc(${c} + ${r}px)`:`${r}px`}}}return()=>{n&&(Xo-=1,Xo===0&&(n.style.overflow=null,n.style.paddingRight=null,o&&(o.style.paddingRight=null)))}},[e])}const Xv={debounce:"number",disabled:"boolean",formMeta:"SpsFormFieldMeta<string>",icon:"SpsIcon",onChange:"React.ChangeEventHandler",onSelectionChange:"(newValue: string) => void",placeholder:"string",suggestions:{type:`
|
|
2
2
|
Eventually<Iterable<string>>
|
|
3
3
|
| ((filter?: string) => Eventually<Iterable<string>>)
|
|
4
4
|
`,required:!0},tallOptionList:"boolean",value:"string",zeroState:"string",loading:"boolean",maxHeightOptionListPx:"number",maxHeightOptionListRem:"number",disableOptionsMemoization:"boolean",inputNotClearable:"boolean",autoFocusOnSelection:"boolean"};function jt({className:e,debounce:t=0,disabled:n,formControl:r,formMeta:o,onChange:a,onSelectionChange:l,icon:c,id:p,placeholder:m="",suggestions:f,unsafelyReplaceClassName:u,tallOptionList:h,value:S="",zeroState:y,loading:T,maxHeightOptionListPx:E,maxHeightOptionListRem:w,disableOptionsMemoization:N,inputNotClearable:I,autoFocusOnSelection:k,"data-testid":x,...F}){const P=o||r,{wrapperId:C,controlId:L}=Tt(p,P),[R,K]=Zt({keyDown:null,opensUpward:!1}),j=s.useRef(null),M=s.useRef(null),Q=s.useRef(null),{showPopup:B,doShowPopup:ee,doHidePopup:V}=xr(j,Q);function J(O,z,Z=!1){P&&(P.setValue(O),P.markAsDirty()),l&&Z?l(O):a&&a(z||new kn({value:O}))}function se(O){M.current&&(M.current.value="",J("")),O.stopPropagation()}function H(O){J(O.target.value,O)}function U(O){n||(["Up","ArrowUp","Down","ArrowDown","Enter"].indexOf(O.key)>-1&&(O.preventDefault(),O.persist()),O.stopPropagation(),K({keyDown:O})),O.key==="Tab"&&V()}function ne(O){O?ee():V()}function te(O){K({opensUpward:O})}const Y=G(u||"sps-autocomplete",B&&"sps-autocomplete--open",B&&"z-stratum-dropdown",R.opensUpward&&"sps-autocomplete--opens-upward",n&&"sps-form-control--disabled",e);return s.useEffect(()=>{let O;return B&&(O=()=>{V()},window.addEventListener("resize",O)),()=>{O&&window.removeEventListener("resize",O)}},[B]),io({isOpen:B,rootRef:j}),s.createElement(lt,{id:C,className:Y,formControl:r,formMeta:o,inputRef:M,ref:j,focusInputOnClick:!0,onClick:O=>O.nativeEvent.stopImmediatePropagation(),"data-testid":`${x}`},s.createElement("div",{className:"sps-text-input"},s.createElement("div",{className:"sps-form-control"},c&&s.createElement("i",{className:G("sps-text-input__icon","sps-icon",`sps-icon-${c}`)}),s.createElement("input",{type:"text",ref:M,value:S,className:"sps-text-input__input",placeholder:m,onFocus:ee,onClick:ee,onChange:H,onKeyDown:U,disabled:n,id:L,"data-testid":`${x}__input`,...F}),S&&!n&&!I&&s.createElement("i",{"aria-label":"clear",className:"sps-icon sps-icon-x-circle sps-form-control__clear-btn",onClick:O=>se(O)}))),s.createElement(as,{id:`${C}_options`,ref:Q,attachTo:j,isOpen:B,options:f,hideInlineSearch:!0,keyDown:R.keyDown,onOptionSelected:O=>{var z;J(O,void 0,!0),k&&((z=M.current)==null||z.focus())},onPositionFlip:te,onSelfToggle:ne,offsets:[1,0],search:S,searchDebounce:t,tall:h,zeroState:y,loading:T,maxHeightPx:E,maxHeightRem:w,disableOptionsMemoization:N}))}Object.assign(jt,{props:Xv,displayName:"SpsAutocomplete"});const _p={basic:{label:"Basic",examples:{basic:{react:v.code`
|
|
@@ -223,7 +223,7 @@
|
|
|
223
223
|
</SpsSummaryListRow>
|
|
224
224
|
);
|
|
225
225
|
}
|
|
226
|
-
`}}}},ey={disabled:"boolean",href:"string",kind:"ClickableTagKind",onAdd:"() => void",onRemove:"() => void"};function is(e){const{children:t,className:n,disabled:r,href:o,kind:a=W.ClickableTagKind.BLUE,onAdd:l,onRemove:c,onClick:p,"data-testid":m,unsafelyReplaceClassName:f,...u}=e,h=G(f||"sps-clickable-tag",`sps-clickable-tag--${a}`,n,r&&"sps-clickable-tag--disabled",(l||c)&&"sps-clickable-tag--icon"),S=G("sps-clickable-tag__label",(o||p)&&"sps-clickable-tag__label--link"),y=s.Children.toArray(t).filter(w=>typeof w=="string").join("");function T(w){l?l():c&&c(),w.stopPropagation()}s.useEffect(()=>{if(c&&l)throw new Error("Clickable tag should have onRemove or onAdd, not both")},[l,c]);function E(w){w.stopPropagation(),p&&p(w)}return s.createElement("div",{className:h,"data-testid":m,...u},s.createElement("span",{className:S,title:y,onClick:E},o&&s.createElement("a",{href:o},t),!o&&t),(l||c)&&!r&&s.createElement("div",{className:"sps-clickable-tag__icon",onClick:
|
|
226
|
+
`}}}},ey={disabled:"boolean",href:"string",kind:"ClickableTagKind",onAdd:"() => void",onRemove:"() => void"};function is(e){const{children:t,className:n,disabled:r,href:o,kind:a=W.ClickableTagKind.BLUE,onAdd:l,onRemove:c,onClick:p,"data-testid":m,unsafelyReplaceClassName:f,...u}=e,h=G(f||"sps-clickable-tag",`sps-clickable-tag--${a}`,n,r&&"sps-clickable-tag--disabled",(l||c)&&"sps-clickable-tag--icon"),S=G("sps-clickable-tag__label",(o||p)&&"sps-clickable-tag__label--link"),y=s.Children.toArray(t).filter(w=>typeof w=="string").join("");function T(w){l?l():c&&c(),w.stopPropagation()}s.useEffect(()=>{if(c&&l)throw new Error("Clickable tag should have onRemove or onAdd, not both")},[l,c]);function E(w){w.stopPropagation(),p&&p(w)}return s.createElement("div",{className:h,"data-testid":m,...u},s.createElement("span",{className:S,title:y,onClick:E},o&&s.createElement("a",{href:o},t),!o&&t),(l||c)&&!r&&s.createElement("div",{className:"sps-clickable-tag__icon",onClick:T,tabIndex:-1,"aria-label":l?"Add":"Remove"},s.createElement("i",{"aria-hidden":"true",className:`sps-icon sps-icon-${l?W.SpsIcon.PLUS_SIGN:W.SpsIcon.X}`,"data-testid":`${m}__icon`})))}Object.assign(is,{props:ey,displayName:"SpsClickableTag"});const Lp={basic:{label:"Basic",examples:{basic:{react:v.code`
|
|
227
227
|
import { SpsClickableTag } from "@spscommerce/ds-react";
|
|
228
228
|
import { ClickableTagKind } from "@spscommerce/ds-shared";
|
|
229
229
|
function Component() {
|
|
@@ -1510,7 +1510,7 @@ Valid keys: `+JSON.stringify(Object.keys(H),null," "));var oe=ae(Z,ce,Y,O,z+"."
|
|
|
1510
1510
|
</div>
|
|
1511
1511
|
);
|
|
1512
1512
|
}
|
|
1513
|
-
`}}}},yN=ao||ti,TN={action:"SpsActionMethod",captionKey:"string",comparisonKey:"string",disabled:"boolean",formMeta:"SpsFormFieldMeta<any>",notClearable:"boolean",options:"Eventually<any[]> | (filter?: string) => Eventually<any[]>",onChange:"ChangeEventHandler",onOpen:"OnOpenHandler",placeholder:"string",searchDebounce:"number",searchPlaceholder:"string",tallOptionList:"boolean",textKey:"string",valueKey:"string",value:"any",zeroState:"string",autoFixWidth:"boolean",loading:"boolean",filterByTextAndCaptionKey:"boolean",maxHeightOptionListPx:"number",maxHeightOptionListRem:"number",disableOptionsMemoization:"boolean",onBeforeChange:"(value: string) => boolean | Promise<boolean>"},qn=s.forwardRef((e,t)=>{const{action:n,autoFixWidth:r=!1,captionKey:o,className:a,comparisonKey:l,disabled:c,formControl:p,formMeta:m,id:f,notClearable:u,options:h,onChange:S,onClick:y,onOpen:T,placeholder:E,searchDebounce:w,searchPlaceholder:N="Search…",tallOptionList:I,textKey:k,valueKey:x,unsafelyReplaceClassName:F,value:P,zeroState:C,loading:L,filterByTextAndCaptionKey:R,maxHeightOptionListPx:K,maxHeightOptionListRem:j,"data-testid":M,disableOptionsMemoization:Q,disableDefaultOptionsFiltering:B,onBeforeChange:ee,...V}=e,J=m||p,{wrapperId:se,controlId:H}=Tt(f,J),U=s.useRef(null),ne=s.useRef(null),te=s.useRef(null),{t:Y}=s.useContext(Ke),[O,z]=Zt({isOpen:!1,value:P,text:"",keyDown:null,opensUpward:!1,optionIds:""});function Z(he){z({value:he,text:he&&k?he[k]:he})}async function re(he){if(ee&&!await ee(he==null?void 0:he.value))return;Z(he);const ze=he&&x&&typeof he=="object"?he[x]:he;J&&(J.setValue(ze),J.markAsDirty()),S&&S(new kn({value:ze}))}s.useEffect(()=>{Z(P)},[P,k]);function ie(){re(void 0)}function ce(){z({isOpen:!1})}function ae(he){he.nativeEvent.stopImmediatePropagation(),c||z({isOpen:!O.isOpen})}function oe(he){c||(["Up","ArrowUp","Down","ArrowDown"," ","Spacebar"].indexOf(he.key)>-1&&he.preventDefault(),he.persist(),z({keyDown:he}))}function Ee(he){z({isOpen:he})}function Be(he){z({opensUpward:he})}function qe(he){he.detail!==se&&z({isOpen:!1})}function ct(he){z({optionIds:new Array(he).fill("").map((ze,Ce)=>`${se}-options-option-${Ce}`).join(",")})}s.useEffect(()=>(document.addEventListener("click",ce),document.addEventListener("DropdownOpened",qe),()=>{document.removeEventListener("click",ce),document.removeEventListener("DropdownOpened",qe)}),[]),s.useLayoutEffect(()=>{if(r&&te.current&&U.current){U.current.style.width="";const ze=`${U.current.getBoundingClientRect().width+6}px`;U.current.style.width=ze,te.current.style.width=ze,te.current.style.maxWidth=ze}}),si(()=>{if(O.isOpen){ne.current&&yN(ne.current,{scrollMode:"if-needed"}),T==null||T();const he=document.createEvent("CustomEvent");he.initCustomEvent("DropdownOpened",!1,!1,se),document.dispatchEvent(he)}},[O.isOpen]),s.useImperativeHandle(t,()=>({focus:()=>{var he;(he=ne.current)==null||he.focus()}})),s.useEffect(()=>{let he;return O.isOpen&&(he=()=>{z({isOpen:!1})},window.addEventListener("resize",he)),()=>{he&&window.removeEventListener("resize",he)}},[O.isOpen]),io({isOpen:O.isOpen,rootRef:ne});const ut=G(F||"sps-select",O.isOpen&&"sps-select--open",O.isOpen&&"z-stratum-dropdown",O.opensUpward&&"sps-select--opens-upward",a),dt=O.text||E||Y("design-system:select.defaultPlaceholder");return s.createElement(lt,{id:se,className:ut,onKeyDown:oe,formControl:p,formMeta:m,ref:ne,role:"listbox","aria-owns":O.optionIds,"data-testid":M,onClick:y,...V},s.createElement("div",{className:G("sps-select__dropctrl",c&&"disabled"),id:H,tabIndex:0,onClick:ae,ref:te,title:dt,"data-testid":`${M}-dropctrl`},s.createElement("div",{className:"sps-select__dropctrl-content"},s.createElement("span",{className:G("sps-select__value",!O.text&&"sps-select__value--placeholder"),"data-testid":`${M}-value`},dt),O.value&&!u&&!c&&s.createElement("i",{className:"sps-icon sps-icon-x-circle sps-select__clear-btn",onClick:ie,"data-testid":`${M}-clear-value`}),s.createElement("i",{className:"sps-icon sps-icon-chevron-down"}))),s.createElement(as,{id:`${se}-options`,ref:U,attachTo:te,captionKey:o,comparisonKey:l,isOpen:O.isOpen,keyDown:O.keyDown,options:h,onOptionSelected:re,onPositionFlip:Be,onSelfToggle:Ee,searchDebounce:w,searchPlaceholder:N,selectedOption:O.value,specialAction:n,tall:I,textKey:k,filterByTextAndCaptionKey:R,optionRole:"option",valueKey:x,onOptionListChanged:ct,zeroState:C,ignoreWidthStyles:r,loading:L,maxHeightPx:K,maxHeightRem:j,disableOptionsMemoization:Q,disableDefaultOptionsFiltering:B,"data-testid":`${M}-option-list`}))});Object.assign(qn,{props:TN,displayName:"SpsSelect"});const lm={general:{label:"General Usage",description:({NavigateTo:e})=>_.createElement(_.Fragment,null,_.createElement("h5",null,"Use a Select:"),_.createElement("ul",null,_.createElement("li",{className:"mb-2"},"When a list of predetermined values can be provided.")),_.createElement("h5",null,"Do Not Use a Select:"),_.createElement("ul",null,_.createElement("li",{className:"mb-2"},"When there are only two possible options. Consider"," ",_.createElement(e,{to:"checkbox"},"Checkboxes")," or"," ",_.createElement(e,{to:"radio-buttons"},"Radio Buttons")," insead."),_.createElement("li",{className:"mb-2"},"When it is ideal to display all available options without requiring a click. Consider"," ",_.createElement(e,{to:"checkbox"},"Checkboxes")," or"," ",_.createElement(e,{to:"radio-buttons"},"Radio Buttons")," insead.")),_.createElement("h5",null,"Using Selects in a Form"),_.createElement("p",null,"Reference the ",_.createElement(e,{to:"form"},"Forms")," page for guidelines for placing inputs in Form layouts"))},basic:{label:"Basic Select",description:()=>_.createElement("p",null,"Basic Selects include a label and dropdown menu containing a list of options. The user is allowed to make a single selection."),examples:{basic:{react:v.code`
|
|
1513
|
+
`}}}},yN=ao||ti,TN={action:"SpsActionMethod",captionKey:"string",comparisonKey:"string",disabled:"boolean",formMeta:"SpsFormFieldMeta<any>",notClearable:"boolean",options:"Eventually<any[]> | (filter?: string) => Eventually<any[]>",onChange:"ChangeEventHandler",onOpen:"OnOpenHandler",placeholder:"string",searchDebounce:"number",searchPlaceholder:"string",tallOptionList:"boolean",textKey:"string",valueKey:"string",value:"any",zeroState:"string",autoFixWidth:"boolean",loading:"boolean",filterByTextAndCaptionKey:"boolean",maxHeightOptionListPx:"number",maxHeightOptionListRem:"number",disableOptionsMemoization:"boolean",onBeforeChange:"(value: string) => boolean | Promise<boolean>"},qn=s.forwardRef((e,t)=>{const{action:n,autoFixWidth:r=!1,captionKey:o,className:a,comparisonKey:l,disabled:c,formControl:p,formMeta:m,id:f,notClearable:u,options:h,onChange:S,onClick:y,onOpen:T,placeholder:E,searchDebounce:w,searchPlaceholder:N="Search…",tallOptionList:I,textKey:k,valueKey:x,unsafelyReplaceClassName:F,value:P,zeroState:C,loading:L,filterByTextAndCaptionKey:R,maxHeightOptionListPx:K,maxHeightOptionListRem:j,"data-testid":M,disableOptionsMemoization:Q,disableDefaultOptionsFiltering:B,onBeforeChange:ee,...V}=e,J=m||p,{wrapperId:se,controlId:H}=Tt(f,J),U=s.useRef(null),ne=s.useRef(null),te=s.useRef(null),{t:Y}=s.useContext(Ke),[O,z]=Zt({isOpen:!1,value:P,text:"",keyDown:null,opensUpward:!1,optionIds:""});function Z(he){z({value:he,text:he&&k?he[k]:he})}async function re(he){if(ee&&!await ee(he==null?void 0:he.value))return;Z(he);const ze=he&&x&&typeof he=="object"?he[x]:he;J&&(J.setValue(ze),J.markAsDirty()),S&&S(new kn({value:ze}))}s.useEffect(()=>{Z(P)},[P,k]);function ie(){re(void 0)}function ce(){z({isOpen:!1})}function ae(he){he.nativeEvent.stopImmediatePropagation(),c||z({isOpen:!O.isOpen})}function oe(he){c||(["Up","ArrowUp","Down","ArrowDown"," ","Spacebar"].indexOf(he.key)>-1&&he.preventDefault(),he.persist(),z({keyDown:he}))}function Ee(he){z({isOpen:he})}function Be(he){z({opensUpward:he})}function qe(he){he.detail!==se&&z({isOpen:!1})}function ct(he){z({optionIds:new Array(he).fill("").map((ze,Ce)=>`${se}-options-option-${Ce}`).join(",")})}s.useEffect(()=>(document.addEventListener("click",ce),document.addEventListener("DropdownOpened",qe),()=>{document.removeEventListener("click",ce),document.removeEventListener("DropdownOpened",qe)}),[]),s.useLayoutEffect(()=>{if(r&&te.current&&U.current){U.current.style.width="";const ze=`${U.current.getBoundingClientRect().width+6}px`;U.current.style.width=ze,te.current.style.width=ze,te.current.style.maxWidth=ze}}),si(()=>{if(O.isOpen){ne.current&&yN(ne.current,{scrollMode:"if-needed"}),T==null||T();const he=document.createEvent("CustomEvent");he.initCustomEvent("DropdownOpened",!1,!1,se),document.dispatchEvent(he)}},[O.isOpen]),s.useImperativeHandle(t,()=>({focus:()=>{var he;(he=ne.current)==null||he.focus()}})),s.useEffect(()=>{let he;return O.isOpen&&(he=()=>{z({isOpen:!1})},window.addEventListener("resize",he)),()=>{he&&window.removeEventListener("resize",he)}},[O.isOpen]),io({isOpen:O.isOpen,rootRef:ne});const ut=G(F||"sps-select",O.isOpen&&"sps-select--open",O.isOpen&&"z-stratum-dropdown",O.opensUpward&&"sps-select--opens-upward",a),dt=O.text||E||Y("design-system:select.defaultPlaceholder");return s.createElement(lt,{id:se,className:ut,onKeyDown:oe,formControl:p,formMeta:m,ref:ne,role:"listbox","aria-owns":O.optionIds,"data-testid":M,onClick:y,...V},s.createElement("div",{className:G("sps-select__dropctrl",c&&"disabled"),id:H,tabIndex:0,onClick:ae,ref:te,title:dt,"data-testid":`${M}-dropctrl`},s.createElement("div",{className:"sps-select__dropctrl-content"},s.createElement("span",{className:G("sps-select__value",!O.text&&"sps-select__value--placeholder"),"data-testid":`${M}-value`},dt),O.value&&!u&&!c&&s.createElement("i",{className:"sps-icon sps-icon-x-circle sps-select__clear-btn",onClick:ie,"data-testid":`${M}-clear-value`}),s.createElement("i",{className:"sps-icon sps-icon-chevron-down sps-select__dropctrl-icon"}))),s.createElement(as,{id:`${se}-options`,ref:U,attachTo:te,captionKey:o,comparisonKey:l,isOpen:O.isOpen,keyDown:O.keyDown,options:h,onOptionSelected:re,onPositionFlip:Be,onSelfToggle:Ee,searchDebounce:w,searchPlaceholder:N,selectedOption:O.value,specialAction:n,tall:I,textKey:k,filterByTextAndCaptionKey:R,optionRole:"option",valueKey:x,onOptionListChanged:ct,zeroState:C,ignoreWidthStyles:r,loading:L,maxHeightPx:K,maxHeightRem:j,disableOptionsMemoization:Q,disableDefaultOptionsFiltering:B,"data-testid":`${M}-option-list`}))});Object.assign(qn,{props:TN,displayName:"SpsSelect"});const lm={general:{label:"General Usage",description:({NavigateTo:e})=>_.createElement(_.Fragment,null,_.createElement("h5",null,"Use a Select:"),_.createElement("ul",null,_.createElement("li",{className:"mb-2"},"When a list of predetermined values can be provided.")),_.createElement("h5",null,"Do Not Use a Select:"),_.createElement("ul",null,_.createElement("li",{className:"mb-2"},"When there are only two possible options. Consider"," ",_.createElement(e,{to:"checkbox"},"Checkboxes")," or"," ",_.createElement(e,{to:"radio-buttons"},"Radio Buttons")," insead."),_.createElement("li",{className:"mb-2"},"When it is ideal to display all available options without requiring a click. Consider"," ",_.createElement(e,{to:"checkbox"},"Checkboxes")," or"," ",_.createElement(e,{to:"radio-buttons"},"Radio Buttons")," insead.")),_.createElement("h5",null,"Using Selects in a Form"),_.createElement("p",null,"Reference the ",_.createElement(e,{to:"form"},"Forms")," page for guidelines for placing inputs in Form layouts"))},basic:{label:"Basic Select",description:()=>_.createElement("p",null,"Basic Selects include a label and dropdown menu containing a list of options. The user is allowed to make a single selection."),examples:{basic:{react:v.code`
|
|
1514
1514
|
import { SpsLabel, SpsSelect, useSpsForm } from "@spscommerce/ds-react";
|
|
1515
1515
|
function DemoComponent() {
|
|
1516
1516
|
const colors = ["red", "blue", "green"];
|
|
@@ -5769,7 +5769,7 @@ var r=n.defineLocale("zh-tw",{months:"一月_二月_三月_四月_五月_六月_
|
|
|
5769
5769
|
<br />
|
|
5770
5770
|
{JSON.stringify(formValue)}
|
|
5771
5771
|
</>
|
|
5772
|
-
}`}}}},ZN={page:"number",numPages:"number",onPageChange:"(number) => void",disabled:"boolean",unknownPageCount:"boolean",nextPageBtnDisabled:"boolean",onBeforeChange:"(page: number) => boolean | Promise<boolean>"};function Co(e){const{numPages:t=0,onPageChange:n,page:r=1,unsafelyReplaceClassName:o,className:a,"data-testid":l,disabled:c=!1,unknownPageCount:p=!1,nextPageBtnDisabled:m=!1,onBeforeChange:f,...u}=e,{t:h}=s.useContext(Ke),[S,y]=s.useState(r),[T,E]=s.useState(r);s.useEffect(()=>{E(r),y(r)},[r]);async function w(x){if(f&&!await f(x))return;const F=v.constrain(x,[1,t]);x!==T&&(E(F),y(F),n&&typeof n=="function"&&n(F))}function N(x){y(Number(x.target.value)||"")}const I=G(o||"sps-page-selector",a),k=xn();return s.createElement("div",{className:I,"data-testid":l,...u},!p&&s.createElement(s.Fragment,null,s.createElement("div",{className:"sps-pagination__input-wrapper","data-testid":`${l}__input`},s.createElement("div",{className:"sps-form-control sps-pagination__input-sizer"},S),s.createElement("label",{htmlFor:k.current,className:"sr-only"},h("design-system:pagination.page")),s.createElement(fs,{onSubmit:()=>w(Number(S))},s.createElement("input",{id:k.current,type:"text",value:S,onInput:N,onChange:()=>{},className:"sps-form-control sps-pagination__input",disabled:c,onBlur:()=>w(Number(S))}))),s.createElement("span",{className:"sps-page-selector__total-pages","data-testid":`${l}_page-count`},Number.isNaN(t)?h("design-system:pagination.ofMany"):h("design-system:pagination.ofPageCount",{pageCount:t}))),s.createElement("div",{className:"sps-icon-button-panel","data-testid":`${l}__buttons`},s.createElement("div",{className:G("sps-button","sps-button--icon",(T===1||c)&&"sps-button--disabled")},s.createElement("button",{type:"button",onClick:()=>w(T-1),disabled:T===1||c,title:h("design-system:pagination.prevPage")},s.createElement("i",{className:"sps-icon sps-icon-chevron-left","aria-hidden":"true"}))),s.createElement("div",{className:G("sps-button","sps-button--icon",(T===t||c||m)&&"sps-button--disabled")},s.createElement("button",{type:"button",onClick:()=>w(T+1),disabled:T===t||c||m,title:h("design-system:pagination.nextPage")},s.createElement("i",{className:"sps-icon sps-icon-chevron-right","aria-hidden":"true"})))))}Object.assign(Co,{props:ZN,displayName:"SpsPageSelector"});const XN={page:"number",pageSize:"number",pageSizeOptions:"Array<number>",totalResults:"number",onPageChange:"(page: number, pageSize: number, indices: [number, number]) => void",disabled:"boolean",unknownPageCount:"boolean",nextPageBtnDisabled:"boolean",resultsOnPage:"number",onBeforeChange:"(page: number, pageSize: number) => boolean | Promise<boolean>"};function tl(e){const{className:t,onPageChange:n,page:r=1,pageSizeOptions:o=W.DEFAULT_PAGE_SIZE_OPTIONS,pageSize:a=o[0],"data-testid":l,totalResults:c,unsafelyReplaceClassName:p,disabled:m=!1,unknownPageCount:f=!1,nextPageBtnDisabled:u=!1,resultsOnPage:h,onBeforeChange:S,...y}=e,[T,E]=Zt({page:r,pageSize:a,numPages:0,indices:[0,0]});function w(L=T.pageSize){return c!==void 0?Math.ceil(c/L):NaN}function N(L=T.page,R=T.pageSize){const K=w(R),j=L===K&&c!==void 0&&c%R||R,M=h||(K===0?0:j),Q=(L-1)*R;return K===0?[0,0]:[Q+1,Q+M]}function I(L){const R={page:L,indices:N(L)};return E(R),R}function k(L,R){const K={page:R,pageSize:L,numPages:w(L),indices:N(R,L)};return E(K),K}s.useEffect(()=>{E({numPages:w(),indices:N()})},[c,h]),s.useEffect(()=>{r!==T.page&&I(r)},[r]),s.useEffect(()=>{a!==T.pageSize&&k(a,r!==T.page?r:T.page)},[a]);function x(){return typeof c=="number"?c:"many"}function F(L){const R=k(L.target.value,1);n(R.page,R.pageSize,R.indices)}function P(L){const R=I(L);n(R.page,T.pageSize,R.indices)}const C=G(p||"sps-pagination",t);return s.createElement("div",{className:C,"data-testid":l,...y},s.createElement("div",{"data-testid":`${l}__size-selector`,className:"sps-page-size-selector"},"View",s.createElement(qn,{options:o,onChange:F,notClearable:!0,autoFixWidth:!0,value:T.pageSize,className:"ml-1 mr-1",disabled:m,onBeforeChange:S?L=>S(T.page,Number(L)):void 0}),"Per Page"),f?s.createElement("div",{className:"sps-pagination__details"},`Viewing ${T.indices[0]} - ${T.indices[1]} of many`):s.createElement("div",{className:"sps-pagination__details"},`Viewing ${T.indices[0]} - ${T.indices[1]} of ${x()}`),s.createElement(Co,{numPages:T.numPages,page:T.page,onPageChange:P,disabled:m,unknownPageCount:f,nextPageBtnDisabled:u,onBeforeChange:S?L=>S(L,T.pageSize):void 0}))}Object.assign(tl,{props:XN,displayName:"SpsPagination"});const Ym={general:{label:"General Usage",description:()=>s.createElement(s.Fragment,null,s.createElement("p",null,"Use the Standard Pagination Bar on a list page (comprised of a Table, Content Rows, or Content Tiles). It should always appear at the bottom of the listed records."),s.createElement("p",null,"Use the Mini Pagination component when a paginated list of results exists inside a smaller Card."))},pagination:{label:"Standard Pagination Bar",description:({Link:e})=>s.createElement(s.Fragment,null,s.createElement("p",null,"The Standard Pagination Bar is comprised of three main sections. The middle section is hidden from view when the width of its container is at the responsive breakpoint of 767 pixels."),s.createElement("ul",null,s.createElement("li",null,s.createElement("p",null,s.createElement("span",{className:"sps-text-semibold"},"Results-per-page Select")," (left): allows the user to adjust the number of records being displayed per page.*")),s.createElement("li",null,s.createElement("p",null,s.createElement("span",{className:"sps-text-semibold"},"Viewing details")," (middle): describes which results are being displayed on the current page.")),s.createElement("li",null,s.createElement("p",null,s.createElement("span",{className:"sps-text-semibold"},"Page Navigator")," (right): allows the user to navigate between pages of results"))),s.createElement("i",null,"*Note: For Tables and Content Rows, per-page options should be 25, 50, and 100. For Content Tiles, per-page options should be 24, 48, and 100."),s.createElement("br",null),s.createElement("p",{className:"mt-2"},"To see an example of the Standard Pagination Bar in context with a Table, view the Table Lists section on the ",s.createElement(e,{to:"/style-and-layout/page-types"},"Page Types")," page.")),examples:{basic:{description:()=>s.createElement("h4",null,"Building the Standard Pagination Bar"),react:v.code`
|
|
5772
|
+
}`}}}},ZN={page:"number",numPages:"number",onPageChange:"(pageNumber: number) => void",disabled:"boolean",unknownPageCount:"boolean",nextPageBtnDisabled:"boolean",onBeforeChange:"(page: number) => boolean | Promise<boolean>"};function Co(e){const{numPages:t=0,onPageChange:n,page:r=1,unsafelyReplaceClassName:o,className:a,"data-testid":l,disabled:c=!1,unknownPageCount:p=!1,nextPageBtnDisabled:m=!1,onBeforeChange:f,...u}=e,{t:h}=s.useContext(Ke),[S,y]=s.useState(r),[T,E]=s.useState(r);s.useEffect(()=>{E(r),y(r)},[r]);async function w(x){if(f&&!await f(x))return;const F=v.constrain(x,[1,t]);x!==T&&(E(F),y(F),n&&typeof n=="function"&&n(F))}function N(x){y(Number(x.target.value)||"")}const I=G(o||"sps-page-selector",a),k=xn();return s.createElement("div",{className:I,"data-testid":l,...u},!p&&s.createElement(s.Fragment,null,s.createElement("div",{className:"sps-pagination__input-wrapper","data-testid":`${l}__input`},s.createElement("div",{className:"sps-form-control sps-pagination__input-sizer"},S),s.createElement("label",{htmlFor:k.current,className:"sr-only"},h("design-system:pagination.page")),s.createElement(fs,{onSubmit:()=>w(Number(S))},s.createElement("input",{id:k.current,type:"text",value:S,onInput:N,onChange:()=>{},className:"sps-form-control sps-pagination__input",disabled:c,onBlur:()=>w(Number(S))}))),s.createElement("span",{className:"sps-page-selector__total-pages","data-testid":`${l}_page-count`},Number.isNaN(t)?h("design-system:pagination.ofMany"):h("design-system:pagination.ofPageCount",{pageCount:t}))),s.createElement("div",{className:"sps-icon-button-panel","data-testid":`${l}__buttons`},s.createElement("div",{className:G("sps-button","sps-button--icon",(T===1||c)&&"sps-button--disabled")},s.createElement("button",{type:"button",onClick:()=>w(T-1),disabled:T===1||c,title:h("design-system:pagination.prevPage")},s.createElement("i",{className:"sps-icon sps-icon-chevron-left","aria-hidden":"true"}))),s.createElement("div",{className:G("sps-button","sps-button--icon",(T===t||c||m)&&"sps-button--disabled")},s.createElement("button",{type:"button",onClick:()=>w(T+1),disabled:T===t||c||m,title:h("design-system:pagination.nextPage")},s.createElement("i",{className:"sps-icon sps-icon-chevron-right","aria-hidden":"true"})))))}Object.assign(Co,{props:ZN,displayName:"SpsPageSelector"});const XN={page:"number",pageSize:"number",pageSizeOptions:"Array<number>",totalResults:"number",onPageChange:"(page: number, pageSize: number, indices: [number, number]) => void",disabled:"boolean",unknownPageCount:"boolean",nextPageBtnDisabled:"boolean",resultsOnPage:"number",onBeforeChange:"(page: number, pageSize: number) => boolean | Promise<boolean>"};function tl(e){const{className:t,onPageChange:n,page:r=1,pageSizeOptions:o=W.DEFAULT_PAGE_SIZE_OPTIONS,pageSize:a=o[0],"data-testid":l,totalResults:c,unsafelyReplaceClassName:p,disabled:m=!1,unknownPageCount:f=!1,nextPageBtnDisabled:u=!1,resultsOnPage:h,onBeforeChange:S,...y}=e,[T,E]=Zt({page:r,pageSize:a,numPages:0,indices:[0,0]});function w(L=T.pageSize){return c!==void 0?Math.ceil(c/L):NaN}function N(L=T.page,R=T.pageSize){const K=w(R),j=L===K&&c!==void 0&&c%R||R,M=h||(K===0?0:j),Q=(L-1)*R;return K===0?[0,0]:[Q+1,Q+M]}function I(L){const R={page:L,indices:N(L)};return E(R),R}function k(L,R){const K={page:R,pageSize:L,numPages:w(L),indices:N(R,L)};return E(K),K}s.useEffect(()=>{E({numPages:w(),indices:N()})},[c,h]),s.useEffect(()=>{r!==T.page&&I(r)},[r]),s.useEffect(()=>{a!==T.pageSize&&k(a,r!==T.page?r:T.page)},[a]);function x(){return typeof c=="number"?c:"many"}function F(L){const R=k(L.target.value,1);n(R.page,R.pageSize,R.indices)}function P(L){const R=I(L);n(R.page,T.pageSize,R.indices)}const C=G(p||"sps-pagination",t);return s.createElement("div",{className:C,"data-testid":l,...y},s.createElement("div",{"data-testid":`${l}__size-selector`,className:"sps-page-size-selector"},"View",s.createElement(qn,{options:o,onChange:F,notClearable:!0,autoFixWidth:!0,value:T.pageSize,className:"ml-1 mr-1",disabled:m,onBeforeChange:S?L=>S(T.page,Number(L)):void 0}),"Per Page"),f?s.createElement("div",{className:"sps-pagination__details"},`Viewing ${T.indices[0]} - ${T.indices[1]} of many`):s.createElement("div",{className:"sps-pagination__details"},`Viewing ${T.indices[0]} - ${T.indices[1]} of ${x()}`),s.createElement(Co,{numPages:T.numPages,page:T.page,onPageChange:P,disabled:m,unknownPageCount:f,nextPageBtnDisabled:u,onBeforeChange:S?L=>S(L,T.pageSize):void 0}))}Object.assign(tl,{props:XN,displayName:"SpsPagination"});const Ym={general:{label:"General Usage",description:()=>s.createElement(s.Fragment,null,s.createElement("p",null,"Use the Standard Pagination Bar on a list page (comprised of a Table, Content Rows, or Content Tiles). It should always appear at the bottom of the listed records."),s.createElement("p",null,"Use the Mini Pagination component when a paginated list of results exists inside a smaller Card."))},pagination:{label:"Standard Pagination Bar",description:({Link:e})=>s.createElement(s.Fragment,null,s.createElement("p",null,"The Standard Pagination Bar is comprised of three main sections. The middle section is hidden from view when the width of its container is at the responsive breakpoint of 767 pixels."),s.createElement("ul",null,s.createElement("li",null,s.createElement("p",null,s.createElement("span",{className:"sps-text-semibold"},"Results-per-page Select")," (left): allows the user to adjust the number of records being displayed per page.*")),s.createElement("li",null,s.createElement("p",null,s.createElement("span",{className:"sps-text-semibold"},"Viewing details")," (middle): describes which results are being displayed on the current page.")),s.createElement("li",null,s.createElement("p",null,s.createElement("span",{className:"sps-text-semibold"},"Page Navigator")," (right): allows the user to navigate between pages of results"))),s.createElement("i",null,"*Note: For Tables and Content Rows, per-page options should be 25, 50, and 100. For Content Tiles, per-page options should be 24, 48, and 100."),s.createElement("br",null),s.createElement("p",{className:"mt-2"},"To see an example of the Standard Pagination Bar in context with a Table, view the Table Lists section on the ",s.createElement(e,{to:"/style-and-layout/page-types"},"Page Types")," page.")),examples:{basic:{description:()=>s.createElement("h4",null,"Building the Standard Pagination Bar"),react:v.code`
|
|
5773
5773
|
import { SpsPagination } from "@spscommerce/ds-react";
|
|
5774
5774
|
function Component() {
|
|
5775
5775
|
const [page, setPage] = React.useState(2);
|
|
@@ -10021,7 +10021,7 @@ ${t.join("").replace("]","\\]").replace(" ","\\s")}]+`);return e.split(n).filter
|
|
|
10021
10021
|
</>
|
|
10022
10022
|
)
|
|
10023
10023
|
}
|
|
10024
|
-
`}}}},gI={onSubmit:"FormEventHandler"};function Ol(e){const{children:t,onSubmit:n}=e;function r(o){o.preventDefault(),n&&n(o)}return s.createElement("form",{onSubmit:r,className:"sps-list-toolbar__search-form",noValidate:!0},s.createElement(Cr,{className:"sps-list-toolbar__search-field"},t))}Object.assign(Ol,{props:gI,displayName:"SpsListToolbarSearch"});const bI={};function Pl(e){const{children:t}=e;return s.createElement("div",null,t)}Object.assign(Pl,{props:bI,displayName:"SpsListToolbarSearchInfo"});const vI={activeTab:"SpsTab",advancedSearch:"{ isOpen: boolean, enteredFields: number }",onToggleAdvancedSearch:"(boolean) => void",onTabChange:"(SpsTab) => void",title:"string",tabs:"Array<SpsTab>",onToolbarPinned:"(boolean) => void",selectable:"boolean",isSelected:"boolean",isIndeterminate:"boolean",onSelectionChange:"(boolean) => void",pinResultsBar:"boolean",pinToolbar:"boolean"};function oh(e){const{activeTab:t,advancedSearch:n,children:r,className:o,onToggleAdvancedSearch:a,onTabChange:l,tabs:c,title:p,unsafelyReplaceClassName:m,onToolbarPinned:f,selectable:u,isSelected:h,isIndeterminate:S,onSelectionChange:y,pinResultsBar:T,pinToolbar:E=!0,"data-testid":w,...N}=e,{t:I}=s.useContext(Ke);let k=null;const[x,F]=s.useState(!1),P=s.useRef(null),C=s.useRef(null),L=v.lockToAnimationFrames(()=>{if(P.current&&E){const se=P.current.getBoundingClientRect();se&&se.height>0&&se.top<=60&&(typeof k=="number"?window.scrollY<k&&(k=null,F(!1)):(k=window.scrollY,F(!0),a&&a(!1)))}});s.useEffect(()=>(window.addEventListener("scroll",L),()=>{window.removeEventListener("scroll",L)}),[]);const R=s.useRef();s.useLayoutEffect(()=>{if(C.current&&P.current&&E){if(x&&R.current)C.current.style.height=R.current.height,C.current.style.width=R.current.width,C.current.style.marginBottom=R.current.marginBottom;else if(!x){C.current.style.height="",C.current.style.width="",C.current.style.marginBottom="";const se=window.getComputedStyle(P.current);R.current={height:se.height,width:se.width,marginBottom:se.marginBottom}}}},[x]);function K(se){l&&l(se)}function j(){a&&a(!(n!=null&&n.isOpen))}function M(se){f&&f(se)}s.useEffect(()=>{M(x)},[x]);const Q=G(m||"sps-list-toolbar",x&&E&&"sps-list-toolbar--pinned",x&&E&&"z-stratum-toolbar",n&&n.isOpen&&"sps-list-toolbar--advanced-search-open",o),[B,ee,V,J]=Ot(r,[{type:Ol},{type:Pl},{type:Ll}]);return s.createElement("div",{className:"sps-list-toolbar__wrapper",ref:C},s.createElement("div",{className:Q,"data-testid":w,ref:P,...N},s.createElement("div",{className:"sps-list-toolbar__content"},!!u&&s.createElement("div",{className:"sps-list-toolbar__selection-controls"},s.createElement(er,{checked:h,indeterminate:S,onChange:()=>{y==null||y(!h)}})),c&&s.createElement(rh,{tabs:c,onTabChange:K,activeTab:t,"data-testid":`${w}__tabs`}),s.createElement("div",{className:"sps-list-toolbar__search-controls"},!p&&B,!p&&ee,B.length>0&&n&&s.createElement("div",{className:"sps-list-toolbar__advanced-search-toggle","data-testid":`${w}__advanced-search`},s.createElement("div",{className:"sps-list-toolbar__advanced-search-toggle-button-wrapper"},s.createElement(Ue,{kind:W.ButtonKind.LINK,onClick:j},I("design-system:listToolbar.advancedSearchToggle"))),(n.enteredFields||0)>0&&s.createElement(Wt,{"data-testid":`${w}__entered_fields`,kind:W.TagKind.INFO},s.createElement("span",null,n.enteredFields))),p&&s.createElement("div",{"data-testid":`${w}-title`,className:"sps-list-toolbar__advanced-search-title"},p)),x?s.createElement("div",{className:"sps-list-toolbar__header-content"},s.createElement(Lt.Provider,{value:{fixed:!0}},J)):s.createElement("div",{className:"sps-list-toolbar__header-content"},J)),s.createElement("div",null,(!x||
|
|
10024
|
+
`}}}},gI={onSubmit:"FormEventHandler"};function Ol(e){const{children:t,onSubmit:n}=e;function r(o){o.preventDefault(),n&&n(o)}return s.createElement("form",{onSubmit:r,className:"sps-list-toolbar__search-form",noValidate:!0},s.createElement(Cr,{className:"sps-list-toolbar__search-field"},t))}Object.assign(Ol,{props:gI,displayName:"SpsListToolbarSearch"});const bI={};function Pl(e){const{children:t}=e;return s.createElement("div",null,t)}Object.assign(Pl,{props:bI,displayName:"SpsListToolbarSearchInfo"});const vI={activeTab:"SpsTab",advancedSearch:"{ isOpen: boolean, enteredFields: number }",onToggleAdvancedSearch:"(boolean) => void",onTabChange:"(SpsTab) => void",title:"string",tabs:"Array<SpsTab>",onToolbarPinned:"(boolean) => void",selectable:"boolean",isSelected:"boolean",isIndeterminate:"boolean",onSelectionChange:"(boolean) => void",pinResultsBar:"boolean",pinToolbar:"boolean"};function oh(e){const{activeTab:t,advancedSearch:n,children:r,className:o,onToggleAdvancedSearch:a,onTabChange:l,tabs:c,title:p,unsafelyReplaceClassName:m,onToolbarPinned:f,selectable:u,isSelected:h,isIndeterminate:S,onSelectionChange:y,pinResultsBar:T,pinToolbar:E=!0,"data-testid":w,...N}=e,{t:I}=s.useContext(Ke);let k=null;const[x,F]=s.useState(!1),P=s.useRef(null),C=s.useRef(null),L=v.lockToAnimationFrames(()=>{if(P.current&&E){const se=P.current.getBoundingClientRect();se&&se.height>0&&se.top<=60&&(typeof k=="number"?window.scrollY<k&&(k=null,F(!1)):(k=window.scrollY,F(!0),a&&a(!1)))}});s.useEffect(()=>(window.addEventListener("scroll",L),()=>{window.removeEventListener("scroll",L)}),[]);const R=s.useRef();s.useLayoutEffect(()=>{if(C.current&&P.current&&E){if(x&&R.current)C.current.style.height=R.current.height,C.current.style.width=R.current.width,C.current.style.marginBottom=R.current.marginBottom;else if(!x){C.current.style.height="",C.current.style.width="",C.current.style.marginBottom="";const se=window.getComputedStyle(P.current);R.current={height:se.height,width:se.width,marginBottom:se.marginBottom}}}},[x]);function K(se){l&&l(se)}function j(){a&&a(!(n!=null&&n.isOpen))}function M(se){f&&f(se)}s.useEffect(()=>{M(x)},[x]);const Q=G(m||"sps-list-toolbar",x&&E&&"sps-list-toolbar--pinned",x&&E&&"z-stratum-toolbar",n&&n.isOpen&&"sps-list-toolbar--advanced-search-open",o),[B,ee,V,J]=Ot(r,[{type:Ol},{type:Pl},{type:Ll}]);return s.createElement("div",{className:"sps-list-toolbar__wrapper",ref:C},s.createElement("div",{className:Q,"data-testid":w,ref:P,...N},s.createElement("div",{className:"sps-list-toolbar__content"},!!u&&s.createElement("div",{className:"sps-list-toolbar__selection-controls"},s.createElement(er,{checked:h,indeterminate:S,onChange:()=>{y==null||y(!h)}})),c&&s.createElement(rh,{tabs:c,onTabChange:K,activeTab:t,"data-testid":`${w}__tabs`}),s.createElement("div",{className:"sps-list-toolbar__search-controls"},!p&&B,!p&&ee,B.length>0&&n&&s.createElement("div",{className:"sps-list-toolbar__advanced-search-toggle","data-testid":`${w}__advanced-search`},s.createElement("div",{className:"sps-list-toolbar__advanced-search-toggle-button-wrapper"},s.createElement(Ue,{kind:W.ButtonKind.LINK,onClick:j},I("design-system:listToolbar.advancedSearchToggle"))),(n.enteredFields||0)>0&&s.createElement(Wt,{"data-testid":`${w}__entered_fields`,kind:W.TagKind.INFO},s.createElement("span",null,n.enteredFields))),p&&s.createElement("div",{"data-testid":`${w}-title`,className:"sps-list-toolbar__advanced-search-title"},p)),x?s.createElement("div",{className:"sps-list-toolbar__header-content"},s.createElement(Lt.Provider,{value:{fixed:!0}},J)):s.createElement("div",{className:"sps-list-toolbar__header-content"},J)),s.createElement("div",null,(!x||T)&&V)))}Object.assign(oh,{props:vI,displayName:"SpsListToolbar"});const yI={options:"SortOption[]",activeOption:"SortOption",onSortChange:"(option: SortOption) => void",defaultOption:"SortOption"};function ah(e){const{options:t,onSortChange:n,defaultOption:r,activeOption:o,className:a,unsafelyReplaceClassName:l}=e,c=(t||[]).map(m=>[{label:m.label,icon:m.icon},()=>{n&&n(m)}]),p=G(l||"sps-list-toolbar-sort-by",a);return s.createElement(nr,{className:p,icon:(o==null?void 0:o.icon)||(r==null?void 0:r.icon),label:(o==null?void 0:o.label)||(r==null?void 0:r.label),options:c})}Object.assign(ah,{props:yI,displayName:"SpsListToolbarSortBy"});function ih(){const[e,t]=s.useState(!1);function n(){t(!1)}function r(){t(!0)}return s.createElement(s.Fragment,null,s.createElement("p",null,"The List Bar is divided into a number of different sections. It spans the entire width of the corresponding list."),s.createElement(Ue,{kind:W.ButtonKind.LINK,onClick:r},"View Content Order Example"),s.createElement(_l,{isOpen:e,onClose:n},s.createElement("h1",null,"Content Order"),s.createElement("img",{src:"assets/images/list-toolbar-example.svg",alt:"A List Toolbar with labels on each section",className:"w-100 mb-3"}),s.createElement(rr,null,s.createElement(Mn,null,s.createElement(tt,{style:{width:"80px"}},"Order"),s.createElement(tt,null,"Section"),s.createElement(tt,null,"Notes")),s.createElement(_n,null,s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"1")),s.createElement(de,null,"Checkbox"),s.createElement(de,null,"For Content Rows and Content Tiles only.")),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"2")),s.createElement(de,null,"Search/Filter Box"),s.createElement(de,null)),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"3")),s.createElement(de,null,"Saved Search"),s.createElement(de,null)),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"4")),s.createElement(de,null,"Advanced Search"),s.createElement(de,null,"For more information, visit the Advanced Search page.")),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"5")),s.createElement(de,null,"Column Editor"),s.createElement(de,{wrap:500},"Use for Tables only. For more information, visit the Column Editor page.")),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"6")),s.createElement(de,null,"List View Selector"),s.createElement(de,null)),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"7")),s.createElement(de,null,"Sorting"),s.createElement(de,null)),s.createElement(Ge,null,s.createElement(de,null,s.createElement("span",{className:"sps-tag sps-tag--info"},"8")),s.createElement(de,null,"Buttons"),s.createElement(de,{wrap:500},"Buttons always appear in the rightmost section of the List Toolbar. For the ordering of Buttons, refer to the Button Groups section on the Buttons page."))))))}const TI={general:{label:"General Usage",description:()=>s.createElement(s.Fragment,null,s.createElement("h5",null,"Use a List Toolbar:"),s.createElement("ul",null,s.createElement("li",null,"When list content needs to be searched, filtered, sorted, or otherwise interacted with.")),s.createElement("h5",null,"Avoid a List Toolbar:"),s.createElement("ul",null,s.createElement("li",null,"When no list is present."),s.createElement("li",null,"When there will always be a small number of elements in the list, or the list does not require searching, filtering, or other actions.")))},contentOrder:{label:"Content Order",description:s.createElement(ih,null)},checkbox:{label:"Checkbox",description:({NavigateTo:e})=>s.createElement("p",null,"Use a Checkbox in the List Toolbar when items in a"," ",s.createElement(e,{to:"Content rows"},"Content Row")," or"," ",s.createElement(e,{to:"Content tiles"},"Content Tile")," are selectable. The Checkbox selects all items in the list, and will cause the Action Bar to appear. Do not use this with a Table, as Tables have a built-in checkbox in the header row."),examples:{checkbox:{react:v.code`
|
|
10025
10025
|
import {
|
|
10026
10026
|
SpsListToolbar,
|
|
10027
10027
|
SpsListToolbarSearch,
|
package/lib/index.es.js
CHANGED
|
@@ -211,7 +211,7 @@ const Z = Object.freeze({
|
|
|
211
211
|
if (!e || !t || !t[0] || !t[1])
|
|
212
212
|
return null;
|
|
213
213
|
const r = fr(e), [a, o] = t.map(fr);
|
|
214
|
-
return
|
|
214
|
+
return a && o && (n && r >= a && r <= o || !n && r > a && r < o);
|
|
215
215
|
},
|
|
216
216
|
prevMonth(e) {
|
|
217
217
|
return Object.freeze({
|
|
@@ -2396,7 +2396,7 @@ function ga(e) {
|
|
|
2396
2396
|
"div",
|
|
2397
2397
|
{
|
|
2398
2398
|
className: "sps-clickable-tag__icon",
|
|
2399
|
-
onClick:
|
|
2399
|
+
onClick: E,
|
|
2400
2400
|
tabIndex: -1,
|
|
2401
2401
|
"aria-label": l ? "Add" : "Remove"
|
|
2402
2402
|
},
|
|
@@ -12311,7 +12311,7 @@ const UD = {
|
|
|
12311
12311
|
onClick: oe,
|
|
12312
12312
|
"data-testid": `${M}-clear-value`
|
|
12313
12313
|
}
|
|
12314
|
-
), /* @__PURE__ */ s.createElement("i", { className: "sps-icon sps-icon-chevron-down" }))
|
|
12314
|
+
), /* @__PURE__ */ s.createElement("i", { className: "sps-icon sps-icon-chevron-down sps-select__dropctrl-icon" }))
|
|
12315
12315
|
),
|
|
12316
12316
|
/* @__PURE__ */ s.createElement(
|
|
12317
12317
|
hs,
|
|
@@ -23156,7 +23156,7 @@ const jN = {
|
|
|
23156
23156
|
}, qN = {
|
|
23157
23157
|
page: "number",
|
|
23158
23158
|
numPages: "number",
|
|
23159
|
-
onPageChange: "(number) => void",
|
|
23159
|
+
onPageChange: "(pageNumber: number) => void",
|
|
23160
23160
|
disabled: "boolean",
|
|
23161
23161
|
unknownPageCount: "boolean",
|
|
23162
23162
|
nextPageBtnDisabled: "boolean",
|
|
@@ -33244,7 +33244,7 @@ function $I(e) {
|
|
|
33244
33244
|
className: "sps-list-toolbar__advanced-search-title"
|
|
33245
33245
|
},
|
|
33246
33246
|
p
|
|
33247
|
-
)), x ? /* @__PURE__ */ s.createElement("div", { className: "sps-list-toolbar__header-content" }, /* @__PURE__ */ s.createElement(qt.Provider, { value: { fixed: !0 } }, j)) : /* @__PURE__ */ s.createElement("div", { className: "sps-list-toolbar__header-content" }, j)), /* @__PURE__ */ s.createElement("div", null, (!x ||
|
|
33247
|
+
)), x ? /* @__PURE__ */ s.createElement("div", { className: "sps-list-toolbar__header-content" }, /* @__PURE__ */ s.createElement(qt.Provider, { value: { fixed: !0 } }, j)) : /* @__PURE__ */ s.createElement("div", { className: "sps-list-toolbar__header-content" }, j)), /* @__PURE__ */ s.createElement("div", null, (!x || E) && F)));
|
|
33248
33248
|
}
|
|
33249
33249
|
Object.assign($I, {
|
|
33250
33250
|
props: VI,
|
|
@@ -2,7 +2,7 @@ import * as React from "react";
|
|
|
2
2
|
import type { SpsGlobalPropTypes } from "../prop-types";
|
|
3
3
|
export type SpsPageSelectorProps = React.PropsWithChildren<SpsGlobalPropTypes & {
|
|
4
4
|
numPages?: number;
|
|
5
|
-
onPageChange?: (
|
|
5
|
+
onPageChange?: (pageNumber: number) => void;
|
|
6
6
|
page?: number;
|
|
7
7
|
disabled?: boolean;
|
|
8
8
|
unknownPageCount?: boolean;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spscommerce/ds-react",
|
|
3
3
|
"description": "SPS Design System React components",
|
|
4
|
-
"version": "8.
|
|
4
|
+
"version": "8.21.0",
|
|
5
5
|
"author": "SPS Commerce",
|
|
6
6
|
"license": "UNLICENSED",
|
|
7
7
|
"repository": "https://github.com/spscommerce/woodland/tree/main/packages/@spscommerce/ds-react",
|
|
@@ -46,11 +46,11 @@
|
|
|
46
46
|
"moment-timezone": "^0.5.28",
|
|
47
47
|
"react": "^16.9.0",
|
|
48
48
|
"react-dom": "^16.9.0",
|
|
49
|
-
"@sps-woodland/illustrations": "8.
|
|
50
|
-
"@sps-woodland/tabs": "8.
|
|
51
|
-
"@spscommerce/ds-colors": "8.
|
|
52
|
-
"@spscommerce/ds-shared": "8.
|
|
53
|
-
"@spscommerce/positioning": "8.
|
|
49
|
+
"@sps-woodland/illustrations": "8.21.0",
|
|
50
|
+
"@sps-woodland/tabs": "8.21.0",
|
|
51
|
+
"@spscommerce/ds-colors": "8.21.0",
|
|
52
|
+
"@spscommerce/ds-shared": "8.21.0",
|
|
53
|
+
"@spscommerce/positioning": "8.21.0"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
56
|
"@react-spectrum/provider": "^3.4.1",
|
|
@@ -72,12 +72,12 @@
|
|
|
72
72
|
"raf-stub": "^2.0.2",
|
|
73
73
|
"react": "^16.9.0",
|
|
74
74
|
"react-dom": "^16.9.0",
|
|
75
|
-
"@sps-woodland/illustrations": "8.
|
|
76
|
-
"@sps-woodland/tabs": "8.
|
|
77
|
-
"@spscommerce/ds-colors": "8.
|
|
78
|
-
"@spscommerce/ds-shared": "8.
|
|
79
|
-
"@spscommerce/positioning": "8.
|
|
80
|
-
"test": "8.
|
|
75
|
+
"@sps-woodland/illustrations": "8.21.0",
|
|
76
|
+
"@sps-woodland/tabs": "8.21.0",
|
|
77
|
+
"@spscommerce/ds-colors": "8.21.0",
|
|
78
|
+
"@spscommerce/ds-shared": "8.21.0",
|
|
79
|
+
"@spscommerce/positioning": "8.21.0",
|
|
80
|
+
"test": "8.21.0"
|
|
81
81
|
},
|
|
82
82
|
"scripts": {
|
|
83
83
|
"build": "pnpm run build:js && pnpm run build:types",
|