@govtechsg/sgds-web-component 3.30.1-rc.4 → 3.30.1-rc.6
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/components/Datepicker/index.umd.min.js +3 -3
- package/components/Datepicker/index.umd.min.js.map +1 -1
- package/components/Datepicker/sgds-datepicker.d.ts +1 -1
- package/components/Datepicker/sgds-datepicker.js +5 -1
- package/components/Datepicker/sgds-datepicker.js.map +1 -1
- package/components/Input/index.umd.min.js +2 -2
- package/components/Input/index.umd.min.js.map +1 -1
- package/components/Input/sgds-input.d.ts +1 -0
- package/components/Input/sgds-input.js +7 -0
- package/components/Input/sgds-input.js.map +1 -1
- package/components/QuantityToggle/index.umd.min.js +230 -230
- package/components/QuantityToggle/index.umd.min.js.map +1 -1
- package/components/QuantityToggle/sgds-quantity-toggle.d.ts +1 -0
- package/components/QuantityToggle/sgds-quantity-toggle.js +9 -0
- package/components/QuantityToggle/sgds-quantity-toggle.js.map +1 -1
- package/components/Radio/index.umd.min.js +1 -1
- package/components/Radio/index.umd.min.js.map +1 -1
- package/components/Radio/sgds-radio-group.d.ts +1 -1
- package/components/Radio/sgds-radio-group.js +5 -1
- package/components/Radio/sgds-radio-group.js.map +1 -1
- package/components/Textarea/index.umd.min.js +1 -1
- package/components/Textarea/index.umd.min.js.map +1 -1
- package/components/Textarea/sgds-textarea.d.ts +1 -1
- package/components/Textarea/sgds-textarea.js +6 -2
- package/components/Textarea/sgds-textarea.js.map +1 -1
- package/components/index.umd.min.js +7 -7
- package/components/index.umd.min.js.map +1 -1
- package/custom-elements.json +11 -1
- package/index.umd.min.js +7 -7
- package/index.umd.min.js.map +1 -1
- package/package.json +1 -1
- package/react/components/Datepicker/sgds-datepicker.cjs.js +5 -1
- package/react/components/Datepicker/sgds-datepicker.cjs.js.map +1 -1
- package/react/components/Datepicker/sgds-datepicker.js +5 -1
- package/react/components/Datepicker/sgds-datepicker.js.map +1 -1
- package/react/components/Input/sgds-input.cjs.js +7 -0
- package/react/components/Input/sgds-input.cjs.js.map +1 -1
- package/react/components/Input/sgds-input.js +7 -0
- package/react/components/Input/sgds-input.js.map +1 -1
- package/react/components/QuantityToggle/sgds-quantity-toggle.cjs.js +9 -0
- package/react/components/QuantityToggle/sgds-quantity-toggle.cjs.js.map +1 -1
- package/react/components/QuantityToggle/sgds-quantity-toggle.js +9 -0
- package/react/components/QuantityToggle/sgds-quantity-toggle.js.map +1 -1
- package/react/components/Radio/sgds-radio-group.cjs.js +5 -1
- package/react/components/Radio/sgds-radio-group.cjs.js.map +1 -1
- package/react/components/Radio/sgds-radio-group.js +5 -1
- package/react/components/Radio/sgds-radio-group.js.map +1 -1
- package/react/components/Textarea/sgds-textarea.cjs.js +6 -2
- package/react/components/Textarea/sgds-textarea.cjs.js.map +1 -1
- package/react/components/Textarea/sgds-textarea.js +6 -2
- package/react/components/Textarea/sgds-textarea.js.map +1 -1
- package/react/utils/ssr-nonce-patch.js +1 -2
|
@@ -2538,7 +2538,7 @@ let wr=Symbol.for(``),Tr=e=>{if(e?.r===wr)return e?._$litStatic$},Er=(e,...t)=>(
|
|
|
2538
2538
|
>
|
|
2539
2539
|
</sgds-icon-button>
|
|
2540
2540
|
</div>
|
|
2541
|
-
`}};H([A({attribute:!1})],dg.prototype,`displayDate`,void 0),H([A({attribute:!1})],dg.prototype,`focusedDate`,void 0),H([A({attribute:!1})],dg.prototype,`selectedDate`,void 0),H([A()],dg.prototype,`view`,void 0),H([A()],dg.prototype,`focusedTabIndex`,void 0),H([Cr(`focusedTabIndex`,{waitUntilFirstUpdate:!0})],dg.prototype,`_handleFocusedTabIndexChange`,null);let fg=[`January`,`February`,`March`,`April`,`May`,`June`,`July`,`August`,`September`,`October`,`November`,`December`];var pg=class{constructor(e,t){this.listeners=/* @__PURE__ */ new Map,this.input=e,this.placeholderStr=this._buildPlaceholder(t.pattern),this._state=this.placeholderStr,this.listeners.set(`accept`,[]),this.listeners.set(`complete`,[]);let n={value:``,isComplete:!1};Object.defineProperties(n,{value:{get:()=>this._state,enumerable:!0},isComplete:{get:()=>this._state.length>0&&!/[DMY]/.test(this._state),enumerable:!0}}),this.masked=n,this.input.value&&this.input.value.length===this._state.length&&!/[DMY]/.test(this.input.value)?this._state=this.input.value:this.input.value=this._state,this._boundHandleBeforeInput=this._handleBeforeInput.bind(this),this._boundHandleInput=this._handleInput.bind(this),this._boundHandleKeydown=this._handleKeydown.bind(this),this._boundHandleFocus=this._handleFocus.bind(this),this._boundHandleBlur=this._handleBlur.bind(this),this._valueAtFocus=this._state,this.input.addEventListener(`beforeinput`,this._boundHandleBeforeInput),this.input.addEventListener(`input`,this._boundHandleInput),this.input.addEventListener(`keydown`,this._boundHandleKeydown),this.input.addEventListener(`focus`,this._boundHandleFocus),this.input.addEventListener(`blur`,this._boundHandleBlur)}get value(){return this._state}set value(e){this._state=!e||e===``?this.placeholderStr:e,this.input.value=this._state,this._emit(`accept`)}on(e,t){this.listeners.get(e)?.push(t)}updateValue(){this._state=this.input.value}destroy(){this.input.removeEventListener(`beforeinput`,this._boundHandleBeforeInput),this.input.removeEventListener(`input`,this._boundHandleInput),this.input.removeEventListener(`keydown`,this._boundHandleKeydown),this.input.removeEventListener(`focus`,this._boundHandleFocus),this.input.removeEventListener(`blur`,this._boundHandleBlur),this.listeners.clear()}_handleFocus(){this._valueAtFocus=this._state}_handleBlur(){this._state!==this._valueAtFocus&&this.input.dispatchEvent(new Event(`change`,{bubbles:!0}))}_buildPlaceholder(e){return e.replace(/`/g,``).replace(/\{(\/)\}/g,`$1`).replace(/d/g,`D`).replace(/m/g,`M`).replace(/y/g,`Y`)}_getDigitPositions(){let e=[];for(let t=0;t<this.placeholderStr.length;t++){let n=this.placeholderStr[t];(n===`D`||n===`M`||n===`Y`)&&e.push(t)}return e}_handleBeforeInput(e){e.preventDefault()}_handleInput(){this.input.value!==this._state&&(this.input.value=this._state)}_handleKeydown(e){e.key===`Backspace`?(e.preventDefault(),this._backspace()):e.key===`Delete`?(e.preventDefault(),this._deleteForward()):e.key.length===1&&/\d/.test(e.key)&&(e.preventDefault(),this._insertDigit(e.key))}_insertDigit(e){let t=this._getDigitPositions(),n=this._state.split(``),r=-1;for(let e of t)if(/[DMY]/.test(n[e])){r=e;break}if(r===-1)return;n[r]=e,this._state=n.join(``),this.input.value=this._state;let i=this._findNextInputPos(r);this.input.setSelectionRange(i,i),this._emit(`accept`),this.masked.isComplete&&this._emit(`complete`)}_backspace(){let e=this.input.selectionStart??this._state.length,t=this._state.split(``),n=e-1;for(;n>=0&&!/\d/.test(t[n]);)n--;n>=0&&(t[n]=this.placeholderStr[n],this._state=t.join(``),this.input.value=this._state,this.input.setSelectionRange(n,n),this._emit(`accept`))}_deleteForward(){let e=this.input.selectionStart??0,t=this._state.split(``),n=e;for(;n<t.length&&!/\d/.test(t[n]);)n++;n<t.length&&(t[n]=this.placeholderStr[n],this._state=t.join(``),this.input.value=this._state,this.input.setSelectionRange(e,e),this._emit(`accept`))}_findNextInputPos(e){for(let t=e+1;t<this._state.length;t++)if(/[DMY]/.test(this._state[t]))return t;return this._state.length}_emit(e){let t=this.listeners.get(e);if(t)for(let e of t)e()}};k();var mg=y`.invalid-feedback-container{display:flex;gap:var(--sgds-form-gap-sm)}.invalid-feedback,.invalid-feedback-container{color:var(--sgds-form-danger-color-default);line-height:var(--sgds-line-height-20)}.invalid-feedback{font-size:var(--sgds-font-size-label-sm);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`;k();var hg=y`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-label-sm);line-height:var(--sgds-line-height-2-xs)}.form-text.disabled{opacity:var(--sgds-opacity-40)}`;k();var gg=y`.form-label{color:var(--sgds-form-color-default);font-weight:var(--sgds-font-weight-semibold);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-40)}.form-check-label{color:var(--sgds-form-color-default)}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:not-allowed}`;k();var _g=y`.form-control::placeholder{color:var(--sgds-form-color-subtle);font-family:var(--sgds-font-family-label);font-weight:var(--sgds-font-weight-light);line-height:var(--sgds-line-height-24)}`,vg=class extends U{constructor(...e){super(...e),this.label=``,this.hintText=``,this.disabled=!1,this.invalid=!1,this._controlId=ur(`input`),this._labelId=ur(`label`)}static{this.styles=[...U.styles,mg,hg,gg,_g]}setInvalid(e){this.invalid=e,e?this.emit(`sgds-invalid`):this.emit(`sgds-valid`)}};H([A({reflect:!0})],vg.prototype,`label`,void 0),H([A({reflect:!0})],vg.prototype,`hintText`,void 0),H([A({reflect:!0})],vg.prototype,`name`,void 0),H([A({type:Boolean,reflect:!0})],vg.prototype,`disabled`,void 0),H([A({type:Boolean,reflect:!0})],vg.prototype,`invalid`,void 0),k();var yg=y`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius));display:flex;gap:var(--sgds-form-gap-md);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-label);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-outline-offset-focus)}`;k();let bg=(e=`value`)=>(t,n)=>{let r=t.constructor,i=r.prototype.attributeChangedCallback;r.prototype.attributeChangedCallback=function(t,a,o){let s=r.getPropertyOptions(e);if(t===(typeof s.attribute==`string`?s.attribute:e).toLowerCase()){let t=s.converter||pe,r=(typeof t==`function`?t:t?.fromAttribute??pe.fromAttribute)(o,s.type);this[e]!==r&&(this[n]=r)}i.call(this,t,a,o)}};var xg=class{constructor(e,t){(this.host=e).addController(this),this._internals=e._internals||this.host.attachInternals(),this.options={setInvalid:(e,t)=>{e.invalid=t},value:e=>e.value,input:e=>e.input,...t}}hostConnected(){this.host.addEventListener(`invalid`,e=>this.handleInvalid(e))}hostDisconnected(){this.host.removeEventListener(`invalid`,e=>this.handleInvalid(e))}handleInvalid(e){e.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(e){let t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){let t=e.target;this.validateInput(t),this.options.setInvalid(this.host,!this.checkValidity())}get form(){return this._internals.form}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}get willValidate(){return this._internals.willValidate}updateInvalidState(){this.options.setInvalid(this.host,!this.checkValidity())}resetValidity(){return this._internals.setValidity({})}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}setValidity(e,t,n){return this._internals.setValidity(e,t,n)}setFormValue(){let e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});let t=e.validity;if(t.valid)this._internals.setValidity({});else for(let n in t)t[n]&&(this.validationError=n.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}};let Sg=e=>{class t extends e{static{this.formAssociated=!0}constructor(...e){super(...e),this._isTouched=!1,this._internals=this.attachInternals()}connectedCallback(){super.connectedCallback(),this.inputValidationController??=new xg(this)}async firstUpdated(e){super.firstUpdated(e),this.input=this.shadowRoot.querySelector(`input`)||await this.sgdsInput||this.shadowRoot.querySelector(`textarea`)||await this.sgdsDatepickerInput,this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(e){this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.handleChange(e)}_mixinHandleInputChange(e){this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.handleInput(e)}_mixinResetValidity(e){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this._isTouched&&=!1,!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.validateInput(e)}_mixinValidate(e){this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinSetFormValue(){let e=this.value;this._internals.setFormValue(e)}_mixinCheckValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.checkValidity()}_mixinReportValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.reportValidity()}_mixinGetValidity(){return this._internals.validity}_mixinGetValidationMessage(){return this._internals.validationMessage}_mixinSetValidity(e,t,n){if(!this._mixinShouldSkipSgdsValidation())return this.inputValidationController.setValidity(e,t,n)}_mixinShouldSkipSgdsValidation(){return this.closest(`form`)?.noValidate||this.noValidate}}return H([st(`sgds-input`)],t.prototype,`sgdsInput`,void 0),H([st(`sgds-datepicker-input`)],t.prototype,`sgdsDatepickerInput`,void 0),t};k();var Cg=y`:host{--input-border-radius:var(--sgds-form-border-radius);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs);height:100%;justify-content:center}.form-control-prefix{border-right:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-right:var(--sgds-form-padding-x)}.form-control-suffix{border-left:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-left:var(--sgds-form-padding-x)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;k();var Q=class extends Sg(vg){constructor(...e){super(...e),this.type=`text`,this.placeholder=`placeholder`,this.autofocus=!1,this.readonly=!1,this.autocomplete=`on`,this.defaultValue=``,this.valid=!1,this.loading=!1,this.required=!1,this.noValidate=!1,this.value=``,this._isTouched=!1,this._showPassword=!1}static{this.styles=[...vg.styles,yg,_g,Cg]}static{this.dependencies={"sgds-spinner":sg,"sgds-icon":ig}}focus(e){this.input.focus(e)}blur(){this.input.blur()}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setValidity(e,t,n){return this._mixinSetValidity(e,t,n)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_handleFocus(){this.emit(`sgds-focus`)}_handleBlur(){let e=this.emit(`sgds-blur`,{cancelable:!0});this._mixinShouldSkipSgdsValidation()||e.defaultPrevented||(this.setInvalid(!this._mixinCheckValidity()),this._isTouched=!0)}_handleClick(){this.focus()}_handleChange(e){this.value=this.input.value,!this.emit(`sgds-change`,{cancelable:!0}).defaultPrevented&&super._mixinHandleChange(e)}_handleInputChange(e){this.value=this.input.value,!this.emit(`sgds-input`,{cancelable:!0}).defaultPrevented&&super._mixinHandleInputChange(e)}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&this.setInvalid(!this._mixinCheckValidity())}_handleDisabledChange(){this.setInvalid(!1)}_renderInput(){let e=this.hasFeedback===`both`||this.hasFeedback===`style`,t=this.hasFeedback===`both`||this.hasFeedback===`text`,n=[this.hintText?`${this._controlId}Help`:``,this.invalid&&t?`${this._controlId}-invalid`:``].filter(Boolean).join(` `)||void 0;return J`
|
|
2541
|
+
`}};H([A({attribute:!1})],dg.prototype,`displayDate`,void 0),H([A({attribute:!1})],dg.prototype,`focusedDate`,void 0),H([A({attribute:!1})],dg.prototype,`selectedDate`,void 0),H([A()],dg.prototype,`view`,void 0),H([A()],dg.prototype,`focusedTabIndex`,void 0),H([Cr(`focusedTabIndex`,{waitUntilFirstUpdate:!0})],dg.prototype,`_handleFocusedTabIndexChange`,null);let fg=[`January`,`February`,`March`,`April`,`May`,`June`,`July`,`August`,`September`,`October`,`November`,`December`];var pg=class{constructor(e,t){this.listeners=/* @__PURE__ */ new Map,this.input=e,this.placeholderStr=this._buildPlaceholder(t.pattern),this._state=this.placeholderStr,this.listeners.set(`accept`,[]),this.listeners.set(`complete`,[]);let n={value:``,isComplete:!1};Object.defineProperties(n,{value:{get:()=>this._state,enumerable:!0},isComplete:{get:()=>this._state.length>0&&!/[DMY]/.test(this._state),enumerable:!0}}),this.masked=n,this.input.value&&this.input.value.length===this._state.length&&!/[DMY]/.test(this.input.value)?this._state=this.input.value:this.input.value=this._state,this._boundHandleBeforeInput=this._handleBeforeInput.bind(this),this._boundHandleInput=this._handleInput.bind(this),this._boundHandleKeydown=this._handleKeydown.bind(this),this._boundHandleFocus=this._handleFocus.bind(this),this._boundHandleBlur=this._handleBlur.bind(this),this._valueAtFocus=this._state,this.input.addEventListener(`beforeinput`,this._boundHandleBeforeInput),this.input.addEventListener(`input`,this._boundHandleInput),this.input.addEventListener(`keydown`,this._boundHandleKeydown),this.input.addEventListener(`focus`,this._boundHandleFocus),this.input.addEventListener(`blur`,this._boundHandleBlur)}get value(){return this._state}set value(e){this._state=!e||e===``?this.placeholderStr:e,this.input.value=this._state,this._emit(`accept`)}on(e,t){this.listeners.get(e)?.push(t)}updateValue(){this._state=this.input.value}destroy(){this.input.removeEventListener(`beforeinput`,this._boundHandleBeforeInput),this.input.removeEventListener(`input`,this._boundHandleInput),this.input.removeEventListener(`keydown`,this._boundHandleKeydown),this.input.removeEventListener(`focus`,this._boundHandleFocus),this.input.removeEventListener(`blur`,this._boundHandleBlur),this.listeners.clear()}_handleFocus(){this._valueAtFocus=this._state}_handleBlur(){this._state!==this._valueAtFocus&&this.input.dispatchEvent(new Event(`change`,{bubbles:!0}))}_buildPlaceholder(e){return e.replace(/`/g,``).replace(/\{(\/)\}/g,`$1`).replace(/d/g,`D`).replace(/m/g,`M`).replace(/y/g,`Y`)}_getDigitPositions(){let e=[];for(let t=0;t<this.placeholderStr.length;t++){let n=this.placeholderStr[t];(n===`D`||n===`M`||n===`Y`)&&e.push(t)}return e}_handleBeforeInput(e){e.preventDefault()}_handleInput(){this.input.value!==this._state&&(this.input.value=this._state)}_handleKeydown(e){e.key===`Backspace`?(e.preventDefault(),this._backspace()):e.key===`Delete`?(e.preventDefault(),this._deleteForward()):e.key.length===1&&/\d/.test(e.key)&&(e.preventDefault(),this._insertDigit(e.key))}_insertDigit(e){let t=this._getDigitPositions(),n=this._state.split(``),r=-1;for(let e of t)if(/[DMY]/.test(n[e])){r=e;break}if(r===-1)return;n[r]=e,this._state=n.join(``),this.input.value=this._state;let i=this._findNextInputPos(r);this.input.setSelectionRange(i,i),this._emit(`accept`),this.masked.isComplete&&this._emit(`complete`)}_backspace(){let e=this.input.selectionStart??this._state.length,t=this._state.split(``),n=e-1;for(;n>=0&&!/\d/.test(t[n]);)n--;n>=0&&(t[n]=this.placeholderStr[n],this._state=t.join(``),this.input.value=this._state,this.input.setSelectionRange(n,n),this._emit(`accept`))}_deleteForward(){let e=this.input.selectionStart??0,t=this._state.split(``),n=e;for(;n<t.length&&!/\d/.test(t[n]);)n++;n<t.length&&(t[n]=this.placeholderStr[n],this._state=t.join(``),this.input.value=this._state,this.input.setSelectionRange(e,e),this._emit(`accept`))}_findNextInputPos(e){for(let t=e+1;t<this._state.length;t++)if(/[DMY]/.test(this._state[t]))return t;return this._state.length}_emit(e){let t=this.listeners.get(e);if(t)for(let e of t)e()}};k();var mg=y`.invalid-feedback-container{display:flex;gap:var(--sgds-form-gap-sm)}.invalid-feedback,.invalid-feedback-container{color:var(--sgds-form-danger-color-default);line-height:var(--sgds-line-height-20)}.invalid-feedback{font-size:var(--sgds-font-size-label-sm);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`;k();var hg=y`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-label-sm);line-height:var(--sgds-line-height-2-xs)}.form-text.disabled{opacity:var(--sgds-opacity-40)}`;k();var gg=y`.form-label{color:var(--sgds-form-color-default);font-weight:var(--sgds-font-weight-semibold);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-40)}.form-check-label{color:var(--sgds-form-color-default)}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:not-allowed}`;k();var _g=y`.form-control::placeholder{color:var(--sgds-form-color-subtle);font-family:var(--sgds-font-family-label);font-weight:var(--sgds-font-weight-light);line-height:var(--sgds-line-height-24)}`,vg=class extends U{constructor(...e){super(...e),this.label=``,this.hintText=``,this.disabled=!1,this.invalid=!1,this._controlId=ur(`input`),this._labelId=ur(`label`)}static{this.styles=[...U.styles,mg,hg,gg,_g]}setInvalid(e){this.invalid=e,e?this.emit(`sgds-invalid`):this.emit(`sgds-valid`)}};H([A({reflect:!0})],vg.prototype,`label`,void 0),H([A({reflect:!0})],vg.prototype,`hintText`,void 0),H([A({reflect:!0})],vg.prototype,`name`,void 0),H([A({type:Boolean,reflect:!0})],vg.prototype,`disabled`,void 0),H([A({type:Boolean,reflect:!0})],vg.prototype,`invalid`,void 0),k();var yg=y`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius));display:flex;gap:var(--sgds-form-gap-md);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-label);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-outline-offset-focus)}`;k();let bg=(e=`value`)=>(t,n)=>{let r=t.constructor,i=r.prototype.attributeChangedCallback;r.prototype.attributeChangedCallback=function(t,a,o){let s=r.getPropertyOptions(e);if(t===(typeof s.attribute==`string`?s.attribute:e).toLowerCase()){let t=s.converter||pe,r=(typeof t==`function`?t:t?.fromAttribute??pe.fromAttribute)(o,s.type);this[e]!==r&&(this[n]=r)}i.call(this,t,a,o)}};var xg=class{constructor(e,t){(this.host=e).addController(this),this._internals=e._internals||this.host.attachInternals(),this.options={setInvalid:(e,t)=>{e.invalid=t},value:e=>e.value,input:e=>e.input,...t}}hostConnected(){this.host.addEventListener(`invalid`,e=>this.handleInvalid(e))}hostDisconnected(){this.host.removeEventListener(`invalid`,e=>this.handleInvalid(e))}handleInvalid(e){e.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(e){let t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){let t=e.target;this.validateInput(t),this.options.setInvalid(this.host,!this.checkValidity())}get form(){return this._internals.form}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}get willValidate(){return this._internals.willValidate}updateInvalidState(){this.options.setInvalid(this.host,!this.checkValidity())}resetValidity(){return this._internals.setValidity({})}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}setValidity(e,t,n){return this._internals.setValidity(e,t,n)}setFormValue(){let e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});let t=e.validity;if(t.valid)this._internals.setValidity({});else for(let n in t)t[n]&&(this.validationError=n.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}};let Sg=e=>{class t extends e{static{this.formAssociated=!0}constructor(...e){super(...e),this._isTouched=!1,this._internals=this.attachInternals()}connectedCallback(){super.connectedCallback(),this.inputValidationController??=new xg(this)}async firstUpdated(e){super.firstUpdated(e),this.input=this.shadowRoot.querySelector(`input`)||await this.sgdsInput||this.shadowRoot.querySelector(`textarea`)||await this.sgdsDatepickerInput,this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(e){this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.handleChange(e)}_mixinHandleInputChange(e){this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.handleInput(e)}_mixinResetValidity(e){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this._isTouched&&=!1,!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.validateInput(e)}_mixinValidate(e){this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinSetFormValue(){let e=this.value;this._internals.setFormValue(e)}_mixinCheckValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.checkValidity()}_mixinReportValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.reportValidity()}_mixinGetValidity(){return this._internals.validity}_mixinGetValidationMessage(){return this._internals.validationMessage}_mixinSetValidity(e,t,n){if(!this._mixinShouldSkipSgdsValidation())return this.inputValidationController.setValidity(e,t,n)}_mixinShouldSkipSgdsValidation(){return this.closest(`form`)?.noValidate||this.noValidate}}return H([st(`sgds-input`)],t.prototype,`sgdsInput`,void 0),H([st(`sgds-datepicker-input`)],t.prototype,`sgdsDatepickerInput`,void 0),t};k();var Cg=y`:host{--input-border-radius:var(--sgds-form-border-radius);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs);height:100%;justify-content:center}.form-control-prefix{border-right:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-right:var(--sgds-form-padding-x)}.form-control-suffix{border-left:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-left:var(--sgds-form-padding-x)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;k();var Q=class extends Sg(vg){constructor(...e){super(...e),this.type=`text`,this.placeholder=`placeholder`,this.autofocus=!1,this.readonly=!1,this.autocomplete=`on`,this.defaultValue=``,this.valid=!1,this.loading=!1,this.required=!1,this.noValidate=!1,this.value=``,this._isTouched=!1,this._showPassword=!1}static{this.styles=[...vg.styles,yg,_g,Cg]}static{this.dependencies={"sgds-spinner":sg,"sgds-icon":ig}}focus(e){this.input.focus(e)}blur(){this.input.blur()}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setValidity(e,t,n){return this._mixinSetValidity(e,t,n)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_handleFocus(){this.emit(`sgds-focus`)}_handleBlur(){let e=this.emit(`sgds-blur`,{cancelable:!0});this._mixinShouldSkipSgdsValidation()||e.defaultPrevented||(this.setInvalid(!this._mixinCheckValidity()),this._isTouched=!0)}_handleClick(){this.focus()}_handleChange(e){this.value=this.input.value,!this.emit(`sgds-change`,{cancelable:!0}).defaultPrevented&&super._mixinHandleChange(e)}_handleInputChange(e){this.value=this.input.value,!this.emit(`sgds-input`,{cancelable:!0}).defaultPrevented&&super._mixinHandleInputChange(e)}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&this.setInvalid(!this._mixinCheckValidity())}_handleDisabledChange(){this.setInvalid(!1)}async _handleValueChange(){this._mixinSetFormValue(),await this.updateComplete,!this._mixinShouldSkipSgdsValidation()&&this._mixinValidate(this.input)}_renderInput(){let e=this.hasFeedback===`both`||this.hasFeedback===`style`,t=this.hasFeedback===`both`||this.hasFeedback===`text`,n=[this.hintText?`${this._controlId}Help`:``,this.invalid&&t?`${this._controlId}-invalid`:``].filter(Boolean).join(` `)||void 0;return J`
|
|
2542
2542
|
<div
|
|
2543
2543
|
class="form-control-group ${K({disabled:this.disabled,readonly:this.readonly,"is-invalid":this.invalid&&e})}"
|
|
2544
2544
|
@click=${this._handleClick}
|
|
@@ -2607,7 +2607,7 @@ let wr=Symbol.for(``),Tr=e=>{if(e?.r===wr)return e?._$litStatic$},Er=(e,...t)=>(
|
|
|
2607
2607
|
</div>
|
|
2608
2608
|
${this._renderFeedback()}
|
|
2609
2609
|
</div>
|
|
2610
|
-
`}};H([A({reflect:!0})],Q.prototype,`type`,void 0),H([A({type:String})],Q.prototype,`prefix`,void 0),H([A({type:String})],Q.prototype,`suffix`,void 0),H([A({type:Number,reflect:!0})],Q.prototype,`minlength`,void 0),H([A({type:Number,reflect:!0})],Q.prototype,`maxlength`,void 0),H([A()],Q.prototype,`min`,void 0),H([A()],Q.prototype,`max`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`placeholder`,void 0),H([A({type:String})],Q.prototype,`pattern`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`autofocus`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`readonly`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`autocomplete`,void 0),H([A()],Q.prototype,`step`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`hasFeedback`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`invalidFeedback`,void 0),H([bg()],Q.prototype,`defaultValue`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`valid`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`loading`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`required`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`noValidate`,void 0),H([A({reflect:!0})],Q.prototype,`value`,void 0),H([j()],Q.prototype,`_isTouched`,void 0),H([j()],Q.prototype,`_showPassword`,void 0),H([Cr(`_isTouched`,{waitUntilFirstUpdate:!0})],Q.prototype,`_handleIsTouched`,null),H([Cr(`disabled`,{waitUntilFirstUpdate:!0})],Q.prototype,`_handleDisabledChange`,null),k();var wg=y`.datepicker-input-container{display:flex;flex-direction:row;width:-webkit-fill-available;width:-moz-available}.datepicker-input-container .form-control-group{border-right:0}.calendar-btn{all:unset}`;k();var Tg=class extends Q{static{this.styles=[...Q.styles,wg]}constructor(){super(),this.dateFormat=`DD/MM/YYYY`,this.mode=`single`,this._validateInput=async()=>{let e=this.mask.value.split(` - `).filter(e=>e!==this.dateFormat).map(e=>G(f(e,yr[this.dateFormat].fnsPattern))),t=e.filter(e=>!u(e)||s(e,new Date(0,0,1))||s(e,G(new Date(this.minDate)))||o(e,G(new Date(this.maxDate))));if(t.length>0||this.mode===`range`&&e.length===1)return this.setInvalid(!0),this.emit(`i-sgds-invalid-input`);if(t.length===0&&e.length>0)return this.setInvalid(!1),this.emit(`i-sgds-selectdates-input`,{detail:e});if(e.length===0&&t.length===0)return this.setInvalid(!1),this.emit(`i-sgds-empty-input`)},this.type=`text`}_handleBlur(){let e=this.mask.value.split(` - `).filter(e=>e!==this.dateFormat).map(e=>G(f(e,yr[this.dateFormat].fnsPattern))),t=e.filter(e=>!u(e)||s(e,new Date(0,0,1))||s(e,G(new Date(this.minDate)))||o(e,G(new Date(this.maxDate))));this.mask.masked.isComplete&&t.length>0&&e.length>0&&(this.value=``,this.mask.value=``,this.setInvalid(!1)),this.emit(`sgds-blur`)}async _handleChange(e){this.value=this.input.value,this.emit(`sgds-change`),super._mixinHandleChange(e),await this._validateInput()}async firstUpdated(e){super.firstUpdated(e),this._applyInputMask(this.dateFormat)}async _applyInputMask(e){let t=await this.shadowInput,n=this.mode===`single`?yr[e].imPattern:yr[e].imRangePattern;this.mask=new pg(t,{pattern:n}),this.mask.on(`accept`,()=>{this.value=this.mask.masked.value,this.emit(`i-sgds-mask-input-change`,{detail:this.value})}),this.mask.on(`complete`,this._validateInput)}updateMaskValue(){this.mask?.updateValue()}destroyInputMask(){this.mask?.destroy()}async applyInputMask(){return await this._applyInputMask(this.dateFormat)}async focus(){return(await this.shadowInput).focus()}render(){return w`
|
|
2610
|
+
`}};H([A({reflect:!0})],Q.prototype,`type`,void 0),H([A({type:String})],Q.prototype,`prefix`,void 0),H([A({type:String})],Q.prototype,`suffix`,void 0),H([A({type:Number,reflect:!0})],Q.prototype,`minlength`,void 0),H([A({type:Number,reflect:!0})],Q.prototype,`maxlength`,void 0),H([A()],Q.prototype,`min`,void 0),H([A()],Q.prototype,`max`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`placeholder`,void 0),H([A({type:String})],Q.prototype,`pattern`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`autofocus`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`readonly`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`autocomplete`,void 0),H([A()],Q.prototype,`step`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`hasFeedback`,void 0),H([A({type:String,reflect:!0})],Q.prototype,`invalidFeedback`,void 0),H([bg()],Q.prototype,`defaultValue`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`valid`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`loading`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`required`,void 0),H([A({type:Boolean,reflect:!0})],Q.prototype,`noValidate`,void 0),H([A({reflect:!0})],Q.prototype,`value`,void 0),H([j()],Q.prototype,`_isTouched`,void 0),H([j()],Q.prototype,`_showPassword`,void 0),H([Cr(`_isTouched`,{waitUntilFirstUpdate:!0})],Q.prototype,`_handleIsTouched`,null),H([Cr(`disabled`,{waitUntilFirstUpdate:!0})],Q.prototype,`_handleDisabledChange`,null),H([Cr(`value`,{waitUntilFirstUpdate:!0})],Q.prototype,`_handleValueChange`,null),k();var wg=y`.datepicker-input-container{display:flex;flex-direction:row;width:-webkit-fill-available;width:-moz-available}.datepicker-input-container .form-control-group{border-right:0}.calendar-btn{all:unset}`;k();var Tg=class extends Q{static{this.styles=[...Q.styles,wg]}constructor(){super(),this.dateFormat=`DD/MM/YYYY`,this.mode=`single`,this._validateInput=async()=>{let e=this.mask.value.split(` - `).filter(e=>e!==this.dateFormat).map(e=>G(f(e,yr[this.dateFormat].fnsPattern))),t=e.filter(e=>!u(e)||s(e,new Date(0,0,1))||s(e,G(new Date(this.minDate)))||o(e,G(new Date(this.maxDate))));if(t.length>0||this.mode===`range`&&e.length===1)return this.setInvalid(!0),this.emit(`i-sgds-invalid-input`);if(t.length===0&&e.length>0)return this.setInvalid(!1),this.emit(`i-sgds-selectdates-input`,{detail:e});if(e.length===0&&t.length===0)return this.setInvalid(!1),this.emit(`i-sgds-empty-input`)},this.type=`text`}_handleBlur(){let e=this.mask.value.split(` - `).filter(e=>e!==this.dateFormat).map(e=>G(f(e,yr[this.dateFormat].fnsPattern))),t=e.filter(e=>!u(e)||s(e,new Date(0,0,1))||s(e,G(new Date(this.minDate)))||o(e,G(new Date(this.maxDate))));this.mask.masked.isComplete&&t.length>0&&e.length>0&&(this.value=``,this.mask.value=``,this.setInvalid(!1)),this.emit(`sgds-blur`)}async _handleChange(e){this.value=this.input.value,this.emit(`sgds-change`),super._mixinHandleChange(e),await this._validateInput()}async firstUpdated(e){super.firstUpdated(e),this._applyInputMask(this.dateFormat)}async _applyInputMask(e){let t=await this.shadowInput,n=this.mode===`single`?yr[e].imPattern:yr[e].imRangePattern;this.mask=new pg(t,{pattern:n}),this.mask.on(`accept`,()=>{this.value=this.mask.masked.value,this.emit(`i-sgds-mask-input-change`,{detail:this.value})}),this.mask.on(`complete`,this._validateInput)}updateMaskValue(){this.mask?.updateValue()}destroyInputMask(){this.mask?.destroy()}async applyInputMask(){return await this._applyInputMask(this.dateFormat)}async focus(){return(await this.shadowInput).focus()}render(){return w`
|
|
2611
2611
|
<div
|
|
2612
2612
|
class="form-control-container ${K({disabled:this.disabled})}"
|
|
2613
2613
|
>
|
|
@@ -2618,7 +2618,7 @@ let wr=Symbol.for(``),Tr=e=>{if(e?.r===wr)return e?._$litStatic$},Er=(e,...t)=>(
|
|
|
2618
2618
|
</div>
|
|
2619
2619
|
${this._renderFeedback()}
|
|
2620
2620
|
</div>
|
|
2621
|
-
`}};H([A({type:String})],Tg.prototype,`minDate`,void 0),H([A({type:String})],Tg.prototype,`maxDate`,void 0),H([A({type:String,reflect:!0})],Tg.prototype,`mode`,void 0),H([st(`input`)],Tg.prototype,`shadowInput`,void 0),k();var Eg=y`:host{--datepicker-theme-color:var(--sgds-primary);--datepicker-hover-bg:var(--sgds-primary-100);--datepicker-bg:#fff;--datepicker-close-btn-bg:var(--datepicker-theme-color);--datepicker-close-btn-hover-bg:var(--sgds-primary-700);--datepicker-close-btn-color:#fff;--datepicker-selected-date-bg:var(--sgds-primary);--datepicker-selected-date-color:#fff}:host([menuisopen]:not([disabled]):not([readonly])) .dropdown-menu{background-color:var(--sgds-form-surface-default);border-radius:var(--sgds-overlay-border-radius);display:flex;flex-direction:column;gap:var(--sgds-form-gap-sm);overflow:unset;padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x);width:var(--sgds-dimension-320)}.dropdown{display:flex;height:100%}sgds-datepicker-input{--input-border-radius:var(--sgds-form-border-radius) 0 0 var(--sgds-form-border-radius);flex:1;margin-right:0}sgds-icon-button{--btn-border-radius:0 var(--sgds-form-border-radius) var(--sgds-form-border-radius) 0}.m-width-160{min-width:var(--sgds-dimension-160)}`;k();var $=class extends Sg(W){static{this.styles=[...W.styles,Pr,Eg]}static{this.dependencies={"sgds-datepicker-input":Tg,"sgds-datepicker-calendar":Z,"sgds-datepicker-header":dg,"sgds-button":X,"sgds-icon-button":lg}}constructor(){super(),this.required=!1,this.disabled=!1,this.noValidate=!1,this.value=``,this.initialValue=[],this.dateFormat=`DD/MM/YYYY`,this.minDate=``,this.maxDate=``,this.mode=`single`,this.hasFeedback=!1,this.label=``,this.hintText=``,this.noFlip=!1,this.drop=`down`,this.defaultValue=``,this.invalid=!1,this.view=`days`,this.selectedDateRange=[],this.focusedTabIndex=3,this.initialDisplayDate=/* @__PURE__ */ new Date,this._makeInputValueString=(e,t,n)=>{if(!e&&!t)return this.value;let r=e=>i(e,yr[n].fnsPattern);switch(this.mode){case`single`:e&&(this.value=r(e));break;case`range`:e&&t&&(this.value=`${r(e)} - ${r(t)}`),e&&!t&&(this.value=`${r(e)} - ${this.dateFormat}`)}return this.value},this._dialogAriaLabels={days:`Choose date`,months:`Choose month`,years:`Choose year`},this.floatingOpts={placement:`bottom-end`}}isValueEmpty(){return this.value===``||this.value===`DD/MM/YYYY`||this.value===`DD/MM/YYYY - DD/MM/YYYY`}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setInvalid(e){this.invalid=e,this.datepickerInput&&this.datepickerInput.setInvalid(e)}setValidity(e,t,n){return this._mixinSetValidity(e,t,n)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}async connectedCallback(){if(super.connectedCallback(),this.addEventListener(`sgds-view`,this._handleViewChanged),this.addEventListener(`sgds-change-calendar`,this._handleDateChanged),this.addEventListener(`sgds-update-focus`,this._handleFocusDateChanged),this.addEventListener(`sgds-selectmonth`,this._handleSelectMonth),this.addEventListener(`sgds-selectyear`,this._handleSelectYear),this.addEventListener(`sgds-selectdates`,this._handleSelectDatesAndClose),this.addEventListener(`i-sgds-selectdates-input`,this._handleSelectDatesInput),this.addEventListener(`i-sgds-empty-input`,this._handleEmptyInput),this.addEventListener(`keydown`,this._handleTab),this.addEventListener(`sgds-hide`,this._handleCloseMenu),this.addEventListener(`sgds-show`,this._handleOpenMenu),this.addEventListener(`blur`,this._mixinCheckValidity),this.initialValue=this.value?this.value.split(` - `).map(e=>e.trim()):this.initialValue,this.initialDisplayDate=this.displayDate||/* @__PURE__ */ new Date,this.initialValue&&this.initialValue.length>0){let e=new RegExp(this._getDateFormatRegex()),t=this.initialValue.filter(t=>!e.test(t));if(t.length>0)return console.error(`Invalid date format in initialValue:`,t);{let e=this.initialValue.map(e=>G(f(e,yr[this.dateFormat].fnsPattern)));this._handleSelectDates(e)}}else this.displayDate=this.initialDisplayDate;(await this.datepickerInputAsync).setInvalid(this.invalid)}async firstUpdated(e){if(super.firstUpdated(e),this.menuIsOpen){let e=await this.datepickerInputAsync;await this.updateFloatingPosition(),(await this.calendar).focusOnCalendar(e)}}_getDateFormatRegex(){return this.dateFormat.replace(/[.*+?^${}()|[\]\\]/g,`\\$&`).replace(`MM`,`\\d{2}`).replace(`DD`,`\\d{2}`).replace(`YYYY`,`\\d{4}`).replace(`/`,`\\/`)}_handleTab(e){if(!this.menuIsOpen)return;let t=[,,,,];e.shiftKey&&e.key===`Tab`?(e.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex-1+t.length)%t.length):e.key===`Tab`&&(e.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex+1+t.length)%t.length)}_handleValueChange(){this.emit(`sgds-change-date`)}async _handleCloseMenu(){if(this.selectedDateRange.length===0)this.displayDate=this.initialDisplayDate;else{let e=this.selectedDateRange.length;this.displayDate=this.selectedDateRange[e-1],(await this.calendar)._updateFocusedDate()}await this.updateComplete,(await this.datepickerInputAsync).focus()}async _handleOpenMenu(){let e=await this.calendar,t=await this.datepickerInputAsync;e.focusOnCalendar(t)}_handleSelectDatesInput(e){this._handleSelectDates(e.detail)}async _handleSelectDates(e){e.sort((e,t)=>e.getTime()-t.getTime()),this.displayDate=e[0],this.focusedDate=e[0],this.selectedDateRange=e;let t=this._makeInputValueString(this.selectedDateRange[0],this.selectedDateRange[1],this.dateFormat);this.value=t,(await this.datepickerInputAsync).updateMaskValue(),this._manageInternalsValid()}async _handleSelectDatesAndClose(e){await this._handleSelectDates(e.detail),(this.mode===`range`&&this.selectedDateRange.length===2||this.mode===`single`&&this.selectedDateRange.length===1)&&this.hideMenu()}_handleViewChanged(e){this.view=e.detail}_handleDateChanged(e){this.displayDate=e.detail}_handleFocusDateChanged(e){this.focusedDate=e.detail}_handleSelectMonth(e){this.displayDate=e.detail}_handleSelectYear(e){this.displayDate=e.detail}async _handleInvalidInput(){this.selectedDateRange=[],this.displayDate=this.initialDisplayDate,!this._mixinShouldSkipSgdsValidation()&&(this.invalid=!0,this._manageInternalsBadInput())}async _handleEmptyInput(){this.required&&this._manageEmptyInput()}async _resetDatepicker(e=``){this.displayDate=this.initialDisplayDate,this.selectedDateRange=[],this.value=e,this.view=`days`;let t=await this.datepickerInputAsync;t.setInvalid(this.invalid),t.destroyInputMask(),await t.applyInputMask(),this._mixinResetValidity(t),this.isValueEmpty()&&this._handleEmptyInput()}_manageInternalsBadInput(){this._mixinSetValidity({badInput:!0},`Invalid date input`,this.datepickerInput)}_manageEmptyInput(){this._mixinSetValidity({valueMissing:!0},`Please fill in this field`,this.datepickerInput)}_manageInternalsValid(){this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&(this._mixinSetValidity({}),this.invalid=this.datepickerInput.invalid=!1)}async _mixinResetFormControl(){this._resetDatepicker(this.defaultValue)}async _handleInputMaskChange(e){this.value=e.detail,this.isValueEmpty()&&this._resetDatepicker()}render(){return w`
|
|
2621
|
+
`}};H([A({type:String})],Tg.prototype,`minDate`,void 0),H([A({type:String})],Tg.prototype,`maxDate`,void 0),H([A({type:String,reflect:!0})],Tg.prototype,`mode`,void 0),H([st(`input`)],Tg.prototype,`shadowInput`,void 0),k();var Eg=y`:host{--datepicker-theme-color:var(--sgds-primary);--datepicker-hover-bg:var(--sgds-primary-100);--datepicker-bg:#fff;--datepicker-close-btn-bg:var(--datepicker-theme-color);--datepicker-close-btn-hover-bg:var(--sgds-primary-700);--datepicker-close-btn-color:#fff;--datepicker-selected-date-bg:var(--sgds-primary);--datepicker-selected-date-color:#fff}:host([menuisopen]:not([disabled]):not([readonly])) .dropdown-menu{background-color:var(--sgds-form-surface-default);border-radius:var(--sgds-overlay-border-radius);display:flex;flex-direction:column;gap:var(--sgds-form-gap-sm);overflow:unset;padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x);width:var(--sgds-dimension-320)}.dropdown{display:flex;height:100%}sgds-datepicker-input{--input-border-radius:var(--sgds-form-border-radius) 0 0 var(--sgds-form-border-radius);flex:1;margin-right:0}sgds-icon-button{--btn-border-radius:0 var(--sgds-form-border-radius) var(--sgds-form-border-radius) 0}.m-width-160{min-width:var(--sgds-dimension-160)}`;k();var $=class extends Sg(W){static{this.styles=[...W.styles,Pr,Eg]}static{this.dependencies={"sgds-datepicker-input":Tg,"sgds-datepicker-calendar":Z,"sgds-datepicker-header":dg,"sgds-button":X,"sgds-icon-button":lg}}constructor(){super(),this.required=!1,this.disabled=!1,this.noValidate=!1,this.value=``,this.initialValue=[],this.dateFormat=`DD/MM/YYYY`,this.minDate=``,this.maxDate=``,this.mode=`single`,this.hasFeedback=!1,this.label=``,this.hintText=``,this.noFlip=!1,this.drop=`down`,this.defaultValue=``,this.invalid=!1,this.view=`days`,this.selectedDateRange=[],this.focusedTabIndex=3,this.initialDisplayDate=/* @__PURE__ */ new Date,this._makeInputValueString=(e,t,n)=>{if(!e&&!t)return this.value;let r=e=>i(e,yr[n].fnsPattern);switch(this.mode){case`single`:e&&(this.value=r(e));break;case`range`:e&&t&&(this.value=`${r(e)} - ${r(t)}`),e&&!t&&(this.value=`${r(e)} - ${this.dateFormat}`)}return this.value},this._dialogAriaLabels={days:`Choose date`,months:`Choose month`,years:`Choose year`},this.floatingOpts={placement:`bottom-end`}}isValueEmpty(){return this.value===``||this.value===`DD/MM/YYYY`||this.value===`DD/MM/YYYY - DD/MM/YYYY`}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setInvalid(e){this.invalid=e,this.datepickerInput&&this.datepickerInput.setInvalid(e)}setValidity(e,t,n){return this._mixinSetValidity(e,t,n)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}async connectedCallback(){if(super.connectedCallback(),this.addEventListener(`sgds-view`,this._handleViewChanged),this.addEventListener(`sgds-change-calendar`,this._handleDateChanged),this.addEventListener(`sgds-update-focus`,this._handleFocusDateChanged),this.addEventListener(`sgds-selectmonth`,this._handleSelectMonth),this.addEventListener(`sgds-selectyear`,this._handleSelectYear),this.addEventListener(`sgds-selectdates`,this._handleSelectDatesAndClose),this.addEventListener(`i-sgds-selectdates-input`,this._handleSelectDatesInput),this.addEventListener(`i-sgds-empty-input`,this._handleEmptyInput),this.addEventListener(`keydown`,this._handleTab),this.addEventListener(`sgds-hide`,this._handleCloseMenu),this.addEventListener(`sgds-show`,this._handleOpenMenu),this.addEventListener(`blur`,this._mixinCheckValidity),this.initialValue=this.value?this.value.split(` - `).map(e=>e.trim()):this.initialValue,this.initialDisplayDate=this.displayDate||/* @__PURE__ */ new Date,this.initialValue&&this.initialValue.length>0){let e=new RegExp(this._getDateFormatRegex()),t=this.initialValue.filter(t=>!e.test(t));if(t.length>0)return console.error(`Invalid date format in initialValue:`,t);{let e=this.initialValue.map(e=>G(f(e,yr[this.dateFormat].fnsPattern)));this._handleSelectDates(e)}}else this.displayDate=this.initialDisplayDate;(await this.datepickerInputAsync).setInvalid(this.invalid)}async firstUpdated(e){if(super.firstUpdated(e),this.menuIsOpen){let e=await this.datepickerInputAsync;await this.updateFloatingPosition(),(await this.calendar).focusOnCalendar(e)}}_getDateFormatRegex(){return this.dateFormat.replace(/[.*+?^${}()|[\]\\]/g,`\\$&`).replace(`MM`,`\\d{2}`).replace(`DD`,`\\d{2}`).replace(`YYYY`,`\\d{4}`).replace(`/`,`\\/`)}_handleTab(e){if(!this.menuIsOpen)return;let t=[,,,,];e.shiftKey&&e.key===`Tab`?(e.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex-1+t.length)%t.length):e.key===`Tab`&&(e.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex+1+t.length)%t.length)}async _handleValueChange(){this._mixinSetFormValue(),this.emit(`sgds-change-date`),await this.updateComplete,!this._mixinShouldSkipSgdsValidation()&&this._mixinValidate(this.input)}async _handleCloseMenu(){if(this.selectedDateRange.length===0)this.displayDate=this.initialDisplayDate;else{let e=this.selectedDateRange.length;this.displayDate=this.selectedDateRange[e-1],(await this.calendar)._updateFocusedDate()}await this.updateComplete,(await this.datepickerInputAsync).focus()}async _handleOpenMenu(){let e=await this.calendar,t=await this.datepickerInputAsync;e.focusOnCalendar(t)}_handleSelectDatesInput(e){this._handleSelectDates(e.detail)}async _handleSelectDates(e){e.sort((e,t)=>e.getTime()-t.getTime()),this.displayDate=e[0],this.focusedDate=e[0],this.selectedDateRange=e;let t=this._makeInputValueString(this.selectedDateRange[0],this.selectedDateRange[1],this.dateFormat);this.value=t,(await this.datepickerInputAsync).updateMaskValue(),this._manageInternalsValid()}async _handleSelectDatesAndClose(e){await this._handleSelectDates(e.detail),(this.mode===`range`&&this.selectedDateRange.length===2||this.mode===`single`&&this.selectedDateRange.length===1)&&this.hideMenu()}_handleViewChanged(e){this.view=e.detail}_handleDateChanged(e){this.displayDate=e.detail}_handleFocusDateChanged(e){this.focusedDate=e.detail}_handleSelectMonth(e){this.displayDate=e.detail}_handleSelectYear(e){this.displayDate=e.detail}async _handleInvalidInput(){this.selectedDateRange=[],this.displayDate=this.initialDisplayDate,!this._mixinShouldSkipSgdsValidation()&&(this.invalid=!0,this._manageInternalsBadInput())}async _handleEmptyInput(){this.required&&this._manageEmptyInput()}async _resetDatepicker(e=``){this.displayDate=this.initialDisplayDate,this.selectedDateRange=[],this.value=e,this.view=`days`;let t=await this.datepickerInputAsync;t.setInvalid(this.invalid),t.destroyInputMask(),await t.applyInputMask(),this._mixinResetValidity(t),this.isValueEmpty()&&this._handleEmptyInput()}_manageInternalsBadInput(){this._mixinSetValidity({badInput:!0},`Invalid date input`,this.datepickerInput)}_manageEmptyInput(){this._mixinSetValidity({valueMissing:!0},`Please fill in this field`,this.datepickerInput)}_manageInternalsValid(){this._mixinSetFormValue(),!this._mixinShouldSkipSgdsValidation()&&(this._mixinSetValidity({}),this.invalid=this.datepickerInput.invalid=!1)}async _mixinResetFormControl(){this._resetDatepicker(this.defaultValue)}async _handleInputMaskChange(e){this.value=e.detail,this.isValueEmpty()&&this._resetDatepicker()}render(){return w`
|
|
2622
2622
|
<div class="datepicker-container m-width-160">
|
|
2623
2623
|
<sgds-datepicker-input
|
|
2624
2624
|
.value=${mt(this.value)}
|