@kyndryl-design-system/shidoka-applications 2.53.1 → 2.53.2

package/components/reusable/colorInput/colorInput.d.ts

@@ -4,6 +4,9 @@ declare const ColorInput_base: (new (...args: any[]) => import("../../../common/
  * Color input.
  * @fires on-input - Captures the input event and emits the selected value and original event details. `detail:{ value: string, origEvent: Event }`
  * @slot tooltip - Slot for tooltip.
+ * @attr {string} [value=''] - The value of the input.
+ * @attr {string} [name=''] - The name of the input, used for form submission.
+ * @attr {string} [invalidText=''] - The custom validation message when the input is invalid.
  */
 export declare class ColorInput extends ColorInput_base {
     static styles: import("lit").CSSResult;
@@ -13,12 +16,15 @@ export declare class ColorInput extends ColorInput_base {
     accessor caption: string;
     /** Input disabled state. */
     accessor disabled: boolean;
+    /** Input required state. */
+    accessor required: boolean;
     /** Visually hide the label. */
     accessor hideLabel: boolean;
     /** Input readonly state. */
     accessor readonly: boolean;
     /** Customizable text strings. */
     accessor textStrings: {
+        requiredText: string;
         errorText: string;
         pleaseSelectColor: string;
         invalidFormat: string;
@@ -30,6 +36,7 @@ export declare class ColorInput extends ColorInput_base {
      * @internal
      */
     accessor _textStrings: {
+        requiredText: string;
         errorText: string;
         pleaseSelectColor: string;
         invalidFormat: string;

package/components/reusable/colorInput/colorInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"colorInput.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/colorInput/colorInput.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;;AAgBlD;;;;GAIG;AACH,qBACa,UAAW,SAAQ,eAAqB;IACnD,OAAgB,MAAM,0BAAqB;IAE3C,kBAAkB;IAElB,QAAQ,CAAC,KAAK,SAAM;IAEpB,uCAAuC;IAEvC,QAAQ,CAAC,OAAO,SAAM;IAEtB,4BAA4B;IAE5B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,+BAA+B;IAE/B,QAAQ,CAAC,SAAS,UAAS;IAE3B,4BAA4B;IAE5B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,iCAAiC;IAEjC,QAAQ,CAAC,WAAW;;;;;MAAuB;IAE3C,mIAAmI;IAEnI,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAS;IAEtC;;OAEG;IAEH,QAAQ,CAAC,YAAY;;;;;MAAuB;IAE5C;;;OAGG;IAEH,QAAQ,CAAC,aAAa,EAAG,gBAAgB,CAAC;IAE1C;;;OAGG;IAEH,QAAQ,CAAC,QAAQ,EAAG,gBAAgB,CAAC;IAErC;;OAEG;IAEH,QAAQ,CAAC,cAAc,UAAS;IAEvB,MAAM;IA6Ef,OAAO,CAAC,iBAAiB;IAOzB,OAAO,CAAC,eAAe;IAOvB,OAAO,CAAC,UAAU;IAclB,OAAO,CAAC,SAAS;IA0CR,OAAO,CAAC,YAAY,EAAE,GAAG;IASzB,UAAU,CAAC,YAAY,EAAE,GAAG;CAKtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,UAAU,CAAC;KAC/B;CACF"}
+{"version":3,"file":"colorInput.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/colorInput/colorInput.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;;AAiBlD;;;;;;;GAOG;AACH,qBACa,UAAW,SAAQ,eAAqB;IACnD,OAAgB,MAAM,0BAAqB;IAE3C,kBAAkB;IAElB,QAAQ,CAAC,KAAK,SAAM;IAEpB,uCAAuC;IAEvC,QAAQ,CAAC,OAAO,SAAM;IAEtB,4BAA4B;IAE5B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,4BAA4B;IAE5B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,+BAA+B;IAE/B,QAAQ,CAAC,SAAS,UAAS;IAE3B,4BAA4B;IAE5B,QAAQ,CAAC,QAAQ,UAAS;IAE1B,iCAAiC;IAEjC,QAAQ,CAAC,WAAW;;;;;;MAAuB;IAE3C,mIAAmI;IAEnI,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAS;IAEtC;;OAEG;IAEH,QAAQ,CAAC,YAAY;;;;;;MAAuB;IAE5C;;;OAGG;IAEH,QAAQ,CAAC,aAAa,EAAG,gBAAgB,CAAC;IAE1C;;;OAGG;IAEH,QAAQ,CAAC,QAAQ,EAAG,gBAAgB,CAAC;IAErC;;OAEG;IAEH,QAAQ,CAAC,cAAc,UAAS;IAEvB,MAAM;IAwFf,OAAO,CAAC,iBAAiB;IAOzB,OAAO,CAAC,eAAe;IAOvB,OAAO,CAAC,UAAU;IAclB,OAAO,CAAC,SAAS;IA4CR,OAAO,CAAC,YAAY,EAAE,GAAG;IASzB,UAAU,CAAC,YAAY,EAAE,GAAG;CAKtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,UAAU,CAAC;KAC/B;CACF"}

package/components/reusable/colorInput/colorInput.js

@@ -546,7 +546,7 @@ input[type=text] {
 
 input[type=color].readonly {
   pointer-events: none;
-}`;const k={errorText:"Error",pleaseSelectColor:"Please select a color",invalidFormat:"Enter a valid hex color (e.g. #FF0000)",colorTextInput:"Color text input"};let x=(()=>{var o,x,y,w,z,_,S,$,C,E,I;let M,j,W,L,T,V,F,B,O,q,P,U,Y,A=[n("kyn-color-input")],D=[],G=b(m),H=[],J=[],K=[],N=[],Q=[],R=[],X=[],Z=[],tt=[],et=[],it=[],at=[],rt=[],ot=[],lt=[],nt=[],st=[],dt=[],ct=[],pt=[],ht=[],ut=[];return j=class extends G{get label(){return a(this,o,"f")}set label(t){r(this,o,t,"f")}get caption(){return a(this,x,"f")}set caption(t){r(this,x,t,"f")}get disabled(){return a(this,y,"f")}set disabled(t){r(this,y,t,"f")}get hideLabel(){return a(this,w,"f")}set hideLabel(t){r(this,w,t,"f")}get readonly(){return a(this,z,"f")}set readonly(t){r(this,z,t,"f")}get textStrings(){return a(this,_,"f")}set textStrings(t){r(this,_,t,"f")}get autoComplete(){return a(this,S,"f")}set autoComplete(t){r(this,S,t,"f")}get _textStrings(){return a(this,$,"f")}set _textStrings(t){r(this,$,t,"f")}get _inputColorEl(){return a(this,C,"f")}set _inputColorEl(t){r(this,C,t,"f")}get _inputEl(){return a(this,E,"f")}set _inputEl(t){r(this,E,t,"f")}get _hasInteracted(){return a(this,I,"f")}set _hasInteracted(t){r(this,I,t,"f")}render(){return h`
+}`;const k={requiredText:"Required",errorText:"Error",pleaseSelectColor:"Please select a color",invalidFormat:"Enter a valid hex color (e.g. #FF0000)",colorTextInput:"Color text input"};let x=(()=>{var o,x,y,w,z,_,$,S,C,E,I,M;let q,j,W,T,L,V,F,B,O,P,R,U,Y,A,D=[n("kyn-color-input")],G=[],H=b(m),J=[],K=[],N=[],Q=[],X=[],Z=[],tt=[],et=[],it=[],at=[],rt=[],ot=[],lt=[],nt=[],st=[],dt=[],ct=[],pt=[],ht=[],ut=[],mt=[],vt=[],gt=[],bt=[];return j=class extends H{get label(){return a(this,o,"f")}set label(t){r(this,o,t,"f")}get caption(){return a(this,x,"f")}set caption(t){r(this,x,t,"f")}get disabled(){return a(this,y,"f")}set disabled(t){r(this,y,t,"f")}get required(){return a(this,w,"f")}set required(t){r(this,w,t,"f")}get hideLabel(){return a(this,z,"f")}set hideLabel(t){r(this,z,t,"f")}get readonly(){return a(this,_,"f")}set readonly(t){r(this,_,t,"f")}get textStrings(){return a(this,$,"f")}set textStrings(t){r(this,$,t,"f")}get autoComplete(){return a(this,S,"f")}set autoComplete(t){r(this,S,t,"f")}get _textStrings(){return a(this,C,"f")}set _textStrings(t){r(this,C,t,"f")}get _inputColorEl(){return a(this,E,"f")}set _inputColorEl(t){r(this,E,t,"f")}get _inputEl(){return a(this,I,"f")}set _inputEl(t){r(this,I,t,"f")}get _hasInteracted(){return a(this,M,"f")}set _hasInteracted(t){r(this,M,t,"f")}render(){var t;return h`
       <div
         class="text-input"
         ?disabled=${this.disabled}
@@ -556,6 +556,13 @@ input[type=color].readonly {
           class="label-text ${this.hideLabel?"sr-only":""}"
           for=${this.name}
         >
+          ${this.required?h`<abbr
+                  class="required"
+                  title=${this._textStrings.requiredText}
+                  role="img"
+                  aria-label=${(null===(t=this._textStrings)||void 0===t?void 0:t.requiredText)||"Required"}
+                  >*</abbr
+                >`:null}
           ${this.label}
           <slot name="tooltip"></slot>
         </label>
@@ -606,5 +613,5 @@ input[type=color].readonly {
           </div>
         </div>
       </div>
-    `}handleColorChange(t){this.value=t.target.value,this._inputEl.value=t.target.value,this._validate(!0,!1),this._emitValue(t)}handleTextInput(t){this.value=t.target.value,this._inputColorEl.value=t.target.value,this._validate(!0,!1),this._emitValue(t)}_emitValue(t){const e={value:this.value};t&&(e.origEvent=t);const i=new CustomEvent("on-input",{detail:e});this.dispatchEvent(i)}_validate(t,e){t&&(this._hasInteracted=!0);const i=this._inputEl.value,a={valueMissing:!1,patternMismatch:!1,customError:!1,valid:!0};let r="";i?/^#([0-9a-fA-F]{6})$/.test(i)||(a.patternMismatch=!0,a.valid=!1,r=this._textStrings.invalidFormat):(a.valueMissing=!0,a.valid=!1,r=this._textStrings.pleaseSelectColor),this._internals.setValidity(a,r,this._inputEl),t&&(this._internalValidationMsg=r),e&&this._internals.reportValidity()}updated(t){this._onUpdated(t),t.has("value")&&(this._inputEl.value=this.value)}willUpdate(t){t.has("textStrings")&&(this._textStrings=v(k,this.textStrings))}constructor(){super(...arguments),o.set(this,i(this,H,"")),x.set(this,(i(this,J),i(this,K,""))),y.set(this,(i(this,N),i(this,Q,!1))),w.set(this,(i(this,R),i(this,X,!1))),z.set(this,(i(this,Z),i(this,tt,!1))),_.set(this,(i(this,et),i(this,it,k))),S.set(this,(i(this,at),i(this,rt,"off"))),$.set(this,(i(this,ot),i(this,lt,k))),C.set(this,(i(this,nt),i(this,st,void 0))),E.set(this,(i(this,dt),i(this,ct,void 0))),I.set(this,(i(this,pt),i(this,ht,!1))),i(this,ut)}},o=new WeakMap,x=new WeakMap,y=new WeakMap,w=new WeakMap,z=new WeakMap,_=new WeakMap,S=new WeakMap,$=new WeakMap,C=new WeakMap,E=new WeakMap,I=new WeakMap,t(j,"ColorInput"),(()=>{var t;const i="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(t=G[Symbol.metadata])&&void 0!==t?t:null):void 0;W=[d({type:String})],L=[d({type:String})],T=[d({type:Boolean})],V=[d({type:Boolean})],F=[d({type:Boolean})],B=[d({type:Object})],O=[d({type:String})],q=[l()],P=[c('input[type="color"]')],U=[c('input[type="text"]')],Y=[l()],e(j,null,W,{kind:"accessor",name:"label",static:!1,private:!1,access:{has:t=>"label"in t,get:t=>t.label,set:(t,e)=>{t.label=e}},metadata:i},H,J),e(j,null,L,{kind:"accessor",name:"caption",static:!1,private:!1,access:{has:t=>"caption"in t,get:t=>t.caption,set:(t,e)=>{t.caption=e}},metadata:i},K,N),e(j,null,T,{kind:"accessor",name:"disabled",static:!1,private:!1,access:{has:t=>"disabled"in t,get:t=>t.disabled,set:(t,e)=>{t.disabled=e}},metadata:i},Q,R),e(j,null,V,{kind:"accessor",name:"hideLabel",static:!1,private:!1,access:{has:t=>"hideLabel"in t,get:t=>t.hideLabel,set:(t,e)=>{t.hideLabel=e}},metadata:i},X,Z),e(j,null,F,{kind:"accessor",name:"readonly",static:!1,private:!1,access:{has:t=>"readonly"in t,get:t=>t.readonly,set:(t,e)=>{t.readonly=e}},metadata:i},tt,et),e(j,null,B,{kind:"accessor",name:"textStrings",static:!1,private:!1,access:{has:t=>"textStrings"in t,get:t=>t.textStrings,set:(t,e)=>{t.textStrings=e}},metadata:i},it,at),e(j,null,O,{kind:"accessor",name:"autoComplete",static:!1,private:!1,access:{has:t=>"autoComplete"in t,get:t=>t.autoComplete,set:(t,e)=>{t.autoComplete=e}},metadata:i},rt,ot),e(j,null,q,{kind:"accessor",name:"_textStrings",static:!1,private:!1,access:{has:t=>"_textStrings"in t,get:t=>t._textStrings,set:(t,e)=>{t._textStrings=e}},metadata:i},lt,nt),e(j,null,P,{kind:"accessor",name:"_inputColorEl",static:!1,private:!1,access:{has:t=>"_inputColorEl"in t,get:t=>t._inputColorEl,set:(t,e)=>{t._inputColorEl=e}},metadata:i},st,dt),e(j,null,U,{kind:"accessor",name:"_inputEl",static:!1,private:!1,access:{has:t=>"_inputEl"in t,get:t=>t._inputEl,set:(t,e)=>{t._inputEl=e}},metadata:i},ct,pt),e(j,null,Y,{kind:"accessor",name:"_hasInteracted",static:!1,private:!1,access:{has:t=>"_hasInteracted"in t,get:t=>t._hasInteracted,set:(t,e)=>{t._hasInteracted=e}},metadata:i},ht,ut),e(null,M={value:j},A,{kind:"class",name:j.name,metadata:i},null,D),j=M.value,i&&Object.defineProperty(j,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:i})})(),j.styles=s(f),i(j,D),j})();export{x as ColorInput};
+    `}handleColorChange(t){this.value=t.target.value,this._inputEl.value=t.target.value,this._validate(!0,!1),this._emitValue(t)}handleTextInput(t){this.value=t.target.value,this._inputColorEl.value=t.target.value,this._validate(!0,!1),this._emitValue(t)}_emitValue(t){const e={value:this.value};t&&(e.origEvent=t);const i=new CustomEvent("on-input",{detail:e});this.dispatchEvent(i)}_validate(t,e){t&&(this._hasInteracted=!0);const i=this._inputEl.value,a={valueMissing:!1,patternMismatch:!1,customError:!1,valid:!0};let r="";this.required&&!i&&(a.valueMissing=!0,a.valid=!1,r=this._textStrings.pleaseSelectColor),""==i||/^#([0-9a-fA-F]{6})$/.test(i)||(a.patternMismatch=!0,a.valid=!1,r=this._textStrings.invalidFormat),this._internals.setValidity(a,r,this._inputEl),t&&(this._internalValidationMsg=r),e&&this._internals.reportValidity()}updated(t){this._onUpdated(t),t.has("value")&&(this._inputEl.value=this.value)}willUpdate(t){t.has("textStrings")&&(this._textStrings=v(k,this.textStrings))}constructor(){super(...arguments),o.set(this,i(this,J,"")),x.set(this,(i(this,K),i(this,N,""))),y.set(this,(i(this,Q),i(this,X,!1))),w.set(this,(i(this,Z),i(this,tt,!1))),z.set(this,(i(this,et),i(this,it,!1))),_.set(this,(i(this,at),i(this,rt,!1))),$.set(this,(i(this,ot),i(this,lt,k))),S.set(this,(i(this,nt),i(this,st,"off"))),C.set(this,(i(this,dt),i(this,ct,k))),E.set(this,(i(this,pt),i(this,ht,void 0))),I.set(this,(i(this,ut),i(this,mt,void 0))),M.set(this,(i(this,vt),i(this,gt,!1))),i(this,bt)}},o=new WeakMap,x=new WeakMap,y=new WeakMap,w=new WeakMap,z=new WeakMap,_=new WeakMap,$=new WeakMap,S=new WeakMap,C=new WeakMap,E=new WeakMap,I=new WeakMap,M=new WeakMap,t(j,"ColorInput"),(()=>{var t;const i="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(t=H[Symbol.metadata])&&void 0!==t?t:null):void 0;W=[d({type:String})],T=[d({type:String})],L=[d({type:Boolean})],V=[d({type:Boolean})],F=[d({type:Boolean})],B=[d({type:Boolean})],O=[d({type:Object})],P=[d({type:String})],R=[l()],U=[c('input[type="color"]')],Y=[c('input[type="text"]')],A=[l()],e(j,null,W,{kind:"accessor",name:"label",static:!1,private:!1,access:{has:t=>"label"in t,get:t=>t.label,set:(t,e)=>{t.label=e}},metadata:i},J,K),e(j,null,T,{kind:"accessor",name:"caption",static:!1,private:!1,access:{has:t=>"caption"in t,get:t=>t.caption,set:(t,e)=>{t.caption=e}},metadata:i},N,Q),e(j,null,L,{kind:"accessor",name:"disabled",static:!1,private:!1,access:{has:t=>"disabled"in t,get:t=>t.disabled,set:(t,e)=>{t.disabled=e}},metadata:i},X,Z),e(j,null,V,{kind:"accessor",name:"required",static:!1,private:!1,access:{has:t=>"required"in t,get:t=>t.required,set:(t,e)=>{t.required=e}},metadata:i},tt,et),e(j,null,F,{kind:"accessor",name:"hideLabel",static:!1,private:!1,access:{has:t=>"hideLabel"in t,get:t=>t.hideLabel,set:(t,e)=>{t.hideLabel=e}},metadata:i},it,at),e(j,null,B,{kind:"accessor",name:"readonly",static:!1,private:!1,access:{has:t=>"readonly"in t,get:t=>t.readonly,set:(t,e)=>{t.readonly=e}},metadata:i},rt,ot),e(j,null,O,{kind:"accessor",name:"textStrings",static:!1,private:!1,access:{has:t=>"textStrings"in t,get:t=>t.textStrings,set:(t,e)=>{t.textStrings=e}},metadata:i},lt,nt),e(j,null,P,{kind:"accessor",name:"autoComplete",static:!1,private:!1,access:{has:t=>"autoComplete"in t,get:t=>t.autoComplete,set:(t,e)=>{t.autoComplete=e}},metadata:i},st,dt),e(j,null,R,{kind:"accessor",name:"_textStrings",static:!1,private:!1,access:{has:t=>"_textStrings"in t,get:t=>t._textStrings,set:(t,e)=>{t._textStrings=e}},metadata:i},ct,pt),e(j,null,U,{kind:"accessor",name:"_inputColorEl",static:!1,private:!1,access:{has:t=>"_inputColorEl"in t,get:t=>t._inputColorEl,set:(t,e)=>{t._inputColorEl=e}},metadata:i},ht,ut),e(j,null,Y,{kind:"accessor",name:"_inputEl",static:!1,private:!1,access:{has:t=>"_inputEl"in t,get:t=>t._inputEl,set:(t,e)=>{t._inputEl=e}},metadata:i},mt,vt),e(j,null,A,{kind:"accessor",name:"_hasInteracted",static:!1,private:!1,access:{has:t=>"_hasInteracted"in t,get:t=>t._hasInteracted,set:(t,e)=>{t._hasInteracted=e}},metadata:i},gt,bt),e(null,q={value:j},D,{kind:"class",name:j.name,metadata:i},null,G),j=q.value,i&&Object.defineProperty(j,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:i})})(),j.styles=s(f),i(j,G),j})();export{x as ColorInput};
 //# sourceMappingURL=colorInput.js.map

package/components/reusable/colorInput/colorInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"colorInput.js","sources":["../../../../src/components/reusable/colorInput/colorInput.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from 'lit';\nimport { customElement, state, query, property } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { classMap } from 'lit/directives/class-map.js';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/error-filled.svg';\nimport Styles from './colorInput.scss?inline';\nimport { FormMixin } from '../../../common/mixins/form-input';\n\nconst _defaultTextStrings = {\n  errorText: 'Error',\n  pleaseSelectColor: 'Please select a color',\n  invalidFormat: 'Enter a valid hex color (e.g. #FF0000)',\n  colorTextInput: 'Color text input',\n};\n\n/**\n * Color input.\n * @fires on-input - Captures the input event and emits the selected value and original event details. `detail:{ value: string, origEvent: Event }`\n * @slot tooltip - Slot for tooltip.\n */\n@customElement('kyn-color-input')\nexport class ColorInput extends FormMixin(LitElement) {\n  static override styles = unsafeCSS(Styles);\n\n  /** Label text. */\n  @property({ type: String })\n  accessor label = '';\n\n  /** Optional text beneath the input. */\n  @property({ type: String })\n  accessor caption = '';\n\n  /** Input disabled state. */\n  @property({ type: Boolean })\n  accessor disabled = false;\n\n  /** Visually hide the label. */\n  @property({ type: Boolean })\n  accessor hideLabel = false;\n\n  /** Input readonly state. */\n  @property({ type: Boolean })\n  accessor readonly = false;\n\n  /** Customizable text strings. */\n  @property({ type: Object })\n  accessor textStrings = _defaultTextStrings;\n\n  /** Control for native browser autocomplete. Use `on`, `off`, or a space-separated `token-list` describing autocomplete behavior.*/\n  @property({ type: String })\n  accessor autoComplete: string = 'off';\n\n  /** Internal text strings.\n   * @internal\n   */\n  @state()\n  accessor _textStrings = _defaultTextStrings;\n\n  /**\n   * Queries the <input[type=\"color\"]> DOM element.\n   * @ignore\n   */\n  @query('input[type=\"color\"]')\n  accessor _inputColorEl!: HTMLInputElement;\n\n  /**\n   * Queries the <input[type=\"text\"]> DOM element.\n   * @ignore\n   */\n  @query('input[type=\"text\"]')\n  accessor _inputEl!: HTMLInputElement;\n\n  /** Sets whether user has interacted with input text for error handling..\n   * @internal\n   */\n  @state()\n  accessor _hasInteracted = false;\n\n  override render() {\n    return html`\n      <div\n        class=\"text-input\"\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n      >\n        <label\n          class=\"label-text ${this.hideLabel ? 'sr-only' : ''}\"\n          for=${this.name}\n        >\n          ${this.label}\n          <slot name=\"tooltip\"></slot>\n        </label>\n        <div class=\"color-input-wrapper\">\n          <input\n          class=${classMap({\n            'custom-color': true,\n            readonly: this.readonly,\n          })}\n            type=\"color\"\n            name=\"colorInput\"\n            id=\"colorInput\"\n            .value=${this.value}\n            ?disabled=${this.disabled}\n            @input=${this.handleColorChange}\n          />\n          </div>\n          <input\n            class=\"${classMap({\n              'is-readonly': this.readonly,\n            })}\"\n            type=\"text\"\n            name=${this.name}\n            .value=${this.value}\n            ?disabled=${this.disabled}\n            ?readonly=${this.readonly}\n            ?invalid=${this._isInvalid}\n            aria-label=${this._textStrings.colorTextInput}\n            aria-invalid=${this._isInvalid}\n            aria-describedby=${this._isInvalid ? 'error' : ''}\n            autocomplete=${this.autoComplete}\n            @input=${(e: any) => this.handleTextInput(e)}\n          />\n          <div class=\"caption-error-count\">\n            <div>\n              ${\n                this.caption !== ''\n                  ? html`\n                      <div class=\"caption\" aria-disabled=${this.disabled}>\n                        ${this.caption}\n                      </div>\n                    `\n                  : null\n              }\n              ${\n                this._isInvalid\n                  ? html`\n                      <div id=\"error\" class=\"error\">\n                        <span\n                          role=\"img\"\n                          class=\"error-icon\"\n                          aria-label=${this._textStrings.errorText}\n                          >${unsafeSVG(errorIcon)}</span\n                        >\n                        ${this.invalidText || this._internalValidationMsg}\n                      </div>\n                    `\n                  : null\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private handleColorChange(e: any) {\n    this.value = e.target.value;\n    this._inputEl.value = e.target.value;\n    this._validate(true, false);\n    this._emitValue(e);\n  }\n\n  private handleTextInput(e: any) {\n    this.value = e.target.value;\n    this._inputColorEl.value = e.target.value;\n    this._validate(true, false);\n    this._emitValue(e);\n  }\n\n  private _emitValue(e?: any) {\n    const Detail: any = {\n      value: this.value,\n    };\n    if (e) {\n      Detail.origEvent = e;\n    }\n\n    const event = new CustomEvent('on-input', {\n      detail: Detail,\n    });\n    this.dispatchEvent(event);\n  }\n\n  private _validate(interacted: Boolean, report: Boolean) {\n    // get validity state from inputEl\n    if (interacted) this._hasInteracted = true;\n    const hexPattern = /^#([0-9a-fA-F]{6})$/;\n    const value = this._inputEl.value;\n    const validityFlags = {\n      valueMissing: false,\n      patternMismatch: false,\n      customError: false,\n      valid: true,\n    };\n\n    let validationMessage = '';\n\n    if (!value) {\n      validityFlags.valueMissing = true;\n      validityFlags.valid = false;\n      validationMessage = this._textStrings.pleaseSelectColor;\n    } else if (!hexPattern.test(value)) {\n      validityFlags.patternMismatch = true;\n      validityFlags.valid = false;\n      validationMessage = this._textStrings.invalidFormat;\n    }\n\n    // set validity on custom element, anchor to inputEl\n    this._internals.setValidity(\n      validityFlags,\n      validationMessage,\n      this._inputEl\n    );\n\n    // set internal validation message if value was changed by user input\n    if (interacted) {\n      this._internalValidationMsg = validationMessage;\n    }\n\n    // focus the form field to show validity\n    if (report) {\n      this._internals.reportValidity();\n    }\n  }\n\n  override updated(changedProps: any) {\n    // preserve FormMixin updated function\n    this._onUpdated(changedProps);\n\n    if (changedProps.has('value')) {\n      this._inputEl.value = this.value;\n    }\n  }\n\n  override willUpdate(changedProps: any) {\n    if (changedProps.has('textStrings')) {\n      this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-color-input': ColorInput;\n  }\n}\n"],"names":["_defaultTextStrings","errorText","pleaseSelectColor","invalidFormat","colorTextInput","ColorInput","customElement","FormMixin","LitElement","_classThis","_classSuper","label","__classPrivateFieldGet","this","_ColorInput_label_accessor_storage","value","__classPrivateFieldSet","caption","_ColorInput_caption_accessor_storage","disabled","_ColorInput_disabled_accessor_storage","hideLabel","_ColorInput_hideLabel_accessor_storage","readonly","_ColorInput_readonly_accessor_storage","textStrings","_ColorInput_textStrings_accessor_storage","autoComplete","_ColorInput_autoComplete_accessor_storage","_textStrings","_ColorInput__textStrings_accessor_storage","_inputColorEl","_ColorInput__inputColorEl_accessor_storage","_inputEl","_ColorInput__inputEl_accessor_storage","_hasInteracted","_ColorInput__hasInteracted_accessor_storage","render","html","name","classMap","handleColorChange","_isInvalid","e","handleTextInput","unsafeSVG","errorIcon","invalidText","_internalValidationMsg","target","_validate","_emitValue","Detail","origEvent","event","CustomEvent","detail","dispatchEvent","interacted","report","validityFlags","valueMissing","patternMismatch","customError","valid","validationMessage","test","_internals","setValidity","reportValidity","updated","changedProps","_onUpdated","has","willUpdate","deepmerge","set","__runInitializers","_label_initializers","_label_extraInitializers","_caption_initializers","_caption_extraInitializers","_disabled_initializers","_disabled_extraInitializers","_hideLabel_initializers","_hideLabel_extraInitializers","_readonly_initializers","_readonly_extraInitializers","_textStrings_initializers","_textStrings_extraInitializers","_autoComplete_initializers","_autoComplete_extraInitializers","__textStrings_initializers","__textStrings_extraInitializers","__inputColorEl_initializers","__inputColorEl_extraInitializers","__inputEl_initializers","__inputEl_extraInitializers","__hasInteracted_initializers","_label_decorators","property","type","String","_caption_decorators","_disabled_decorators","Boolean","_hideLabel_decorators","_readonly_decorators","_textStrings_decorators","Object","_autoComplete_decorators","__textStrings_decorators","state","query","__hasInteracted_decorators","__esDecorate","kind","static","private","access","obj","get","metadata","_metadata","__inputColorEl_decorators","__inputEl_decorators","__hasInteracted_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","Styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GASA,MAAMA,EAAsB,CAC1BC,UAAW,QACXC,kBAAmB,wBACnBC,cAAe,yCACfC,eAAgB,wBASLC,EAAU,iEADtBC,EAAc,2BACiBC,EAAUC,sIAAlBC,EAAA,cAAQC,EAK9B,SAASC,GAAK,OAAAC,EAAAC,KAAAC,EAAA,IAAA,CAAd,SAASH,CAAKI,GAAAC,EAAAH,KAAAC,EAAAC,EAAA,IAAA,CAId,WAASE,GAAO,OAAAL,EAAAC,KAAAK,EAAA,IAAA,CAAhB,WAASD,CAAOF,GAAAC,EAAAH,KAAAK,EAAAH,EAAA,IAAA,CAIhB,YAASI,GAAQ,OAAAP,EAAAC,KAAAO,EAAA,IAAA,CAAjB,YAASD,CAAQJ,GAAAC,EAAAH,KAAAO,EAAAL,EAAA,IAAA,CAIjB,aAASM,GAAS,OAAAT,EAAAC,KAAAS,EAAA,IAAA,CAAlB,aAASD,CAASN,GAAAC,EAAAH,KAAAS,EAAAP,EAAA,IAAA,CAIlB,YAASQ,GAAQ,OAAAX,EAAAC,KAAAW,EAAA,IAAA,CAAjB,YAASD,CAAQR,GAAAC,EAAAH,KAAAW,EAAAT,EAAA,IAAA,CAIjB,eAASU,GAAW,OAAAb,EAAAC,KAAAa,EAAA,IAAA,CAApB,eAASD,CAAWV,GAAAC,EAAAH,KAAAa,EAAAX,EAAA,IAAA,CAIpB,gBAASY,GAAY,OAAAf,EAAAC,KAAAe,EAAA,IAAA,CAArB,gBAASD,CAAYZ,GAAAC,EAAAH,KAAAe,EAAAb,EAAA,IAAA,CAMrB,gBAASc,GAAY,OAAAjB,EAAAC,KAAAiB,EAAA,IAAA,CAArB,gBAASD,CAAYd,GAAAC,EAAAH,KAAAiB,EAAAf,EAAA,IAAA,CAOrB,iBAASgB,GAAa,OAAAnB,EAAAC,KAAAmB,EAAA,IAAA,CAAtB,iBAASD,CAAahB,GAAAC,EAAAH,KAAAmB,EAAAjB,EAAA,IAAA,CAOtB,YAASkB,GAAQ,OAAArB,EAAAC,KAAAqB,EAAA,IAAA,CAAjB,YAASD,CAAQlB,GAAAC,EAAAH,KAAAqB,EAAAnB,EAAA,IAAA,CAMjB,kBAASoB,GAAc,OAAAvB,EAAAC,KAAAuB,EAAA,IAAA,CAAvB,kBAASD,CAAcpB,GAAAC,EAAAH,KAAAuB,EAAArB,EAAA,IAAA,CAEd,MAAAsB,GACP,OAAOC,CAAI;;;oBAGKzB,KAAKM;oBACLN,KAAKU;;;8BAGKV,KAAKQ,UAAY,UAAY;gBAC3CR,KAAK0B;;YAET1B,KAAKF;;;;;kBAKC6B,EAAS,CACf,gBAAgB,EAChBjB,SAAUV,KAAKU;;;;qBAKNV,KAAKE;wBACFF,KAAKM;qBACRN,KAAK4B;;;;qBAILD,EAAS,CAChB,cAAe3B,KAAKU;;mBAGfV,KAAK0B;qBACH1B,KAAKE;wBACFF,KAAKM;wBACLN,KAAKU;uBACNV,KAAK6B;yBACH7B,KAAKgB,aAAazB;2BAChBS,KAAK6B;+BACD7B,KAAK6B,WAAa,QAAU;2BAChC7B,KAAKc;qBACVgB,GAAW9B,KAAK+B,gBAAgBD;;;;gBAKrB,KAAjB9B,KAAKI,QACDqB,CAAI;2DACmCzB,KAAKM;0BACtCN,KAAKI;;sBAGX;gBAGJJ,KAAK6B,WACDJ,CAAI;;;;;uCAKezB,KAAKgB,aAAa5B;6BAC5B4C,EAAUC;;0BAEbjC,KAAKkC,aAAelC,KAAKmC;;sBAG/B;;;;;MASV,iBAAAP,CAAkBE,GACxB9B,KAAKE,MAAQ4B,EAAEM,OAAOlC,MACtBF,KAAKoB,SAASlB,MAAQ4B,EAAEM,OAAOlC,MAC/BF,KAAKqC,WAAU,GAAM,GACrBrC,KAAKsC,WAAWR,GAGV,eAAAC,CAAgBD,GACtB9B,KAAKE,MAAQ4B,EAAEM,OAAOlC,MACtBF,KAAKkB,cAAchB,MAAQ4B,EAAEM,OAAOlC,MACpCF,KAAKqC,WAAU,GAAM,GACrBrC,KAAKsC,WAAWR,GAGV,UAAAQ,CAAWR,GACjB,MAAMS,EAAc,CAClBrC,MAAOF,KAAKE,OAEV4B,IACFS,EAAOC,UAAYV,GAGrB,MAAMW,EAAQ,IAAIC,YAAY,WAAY,CACxCC,OAAQJ,IAEVvC,KAAK4C,cAAcH,GAGb,SAAAJ,CAAUQ,EAAqBC,GAEjCD,IAAY7C,KAAKsB,gBAAiB,GACtC,MACMpB,EAAQF,KAAKoB,SAASlB,MACtB6C,EAAgB,CACpBC,cAAc,EACdC,iBAAiB,EACjBC,aAAa,EACbC,OAAO,GAGT,IAAIC,EAAoB,GAEnBlD,EAXc,sBAeImD,KAAKnD,KAC1B6C,EAAcE,iBAAkB,EAChCF,EAAcI,OAAQ,EACtBC,EAAoBpD,KAAKgB,aAAa1B,gBANtCyD,EAAcC,cAAe,EAC7BD,EAAcI,OAAQ,EACtBC,EAAoBpD,KAAKgB,aAAa3B,mBAQxCW,KAAKsD,WAAWC,YACdR,EACAK,EACApD,KAAKoB,UAIHyB,IACF7C,KAAKmC,uBAAyBiB,GAI5BN,GACF9C,KAAKsD,WAAWE,iBAIX,OAAAC,CAAQC,GAEf1D,KAAK2D,WAAWD,GAEZA,EAAaE,IAAI,WACnB5D,KAAKoB,SAASlB,MAAQF,KAAKE,OAItB,UAAA2D,CAAWH,GACdA,EAAaE,IAAI,iBACnB5D,KAAKgB,aAAe8C,EAAU3E,EAAqBa,KAAKY,gDAlNnDX,EAAA8D,IAAA/D,KAAAgE,EAAAhE,KAAAiE,EAAQ,KAIR5D,EAAA0D,IAAA/D,MAAAgE,EAAAhE,KAAAkE,GAAAF,EAAAhE,KAAAmE,EAAU,MAIV5D,EAAAwD,IAAA/D,MAAAgE,EAAAhE,KAAAoE,GAAAJ,EAAAhE,KAAAqE,GAAW,KAIX5D,EAAAsD,IAAA/D,MAAAgE,EAAAhE,KAAAsE,GAAAN,EAAAhE,KAAAuE,GAAY,KAIZ5D,EAAAoD,IAAA/D,MAAAgE,EAAAhE,KAAAwE,GAAAR,EAAAhE,KAAAyE,IAAW,KAIX5D,EAAAkD,IAAA/D,MAAAgE,EAAAhE,KAAA0E,IAAAV,EAAAhE,KAAA2E,GAAcxF,KAId4B,EAAAgD,IAAA/D,MAAAgE,EAAAhE,KAAA4E,IAAAZ,EAAAhE,KAAA6E,GAAuB,SAMvB5D,EAAA8C,IAAA/D,MAAAgE,EAAAhE,KAAA8E,IAAAd,EAAAhE,KAAA+E,GAAe5F,KAOfgC,EAAA4C,IAAA/D,MAAAgE,EAAAhE,KAAAgF,IAAAhB,EAAAhE,KAAAiF,QAAA,KAOA5D,EAAA0C,IAAA/D,MAAAgE,EAAAhE,KAAAkF,IAAAlB,EAAAhE,KAAAmF,QAAA,KAMA5D,EAAAwC,IAAA/D,MAAAgE,EAAAhE,KAAAoF,IAAApB,EAAAhE,KAAAqF,IAAiB,oUAnDzBC,EAAA,CAAAC,EAAS,CAAEC,KAAMC,UAIjBC,EAAA,CAAAH,EAAS,CAAEC,KAAMC,UAIjBE,EAAA,CAAAJ,EAAS,CAAEC,KAAMI,WAIjBC,EAAA,CAAAN,EAAS,CAAEC,KAAMI,WAIjBE,EAAA,CAAAP,EAAS,CAAEC,KAAMI,WAIjBG,EAAA,CAAAR,EAAS,CAAEC,KAAMQ,UAIjBC,EAAA,CAAAV,EAAS,CAAEC,KAAMC,UAMjBS,EAAA,CAAAC,QAOAC,EAAM,2BAONA,EAAM,uBAMNC,EAAA,CAAAF,KAjDDG,EAAA1G,EAAA,KAAA0F,EAAA,CAAAiB,KAAA,WAAA7E,KAAA,QAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,UAAAA,EAAAC,IAAAD,GAAAA,EAAS7G,MAAKiE,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAL7G,MAAKI,CAAA,GAAA2G,SAAAC,GAAA7C,EAAAC,GAIdoC,EAAA1G,EAAA,KAAA8F,EAAA,CAAAa,KAAA,WAAA7E,KAAA,UAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,YAAAA,EAAAC,IAAAD,GAAAA,EAASvG,QAAO2D,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAPvG,QAAOF,CAAA,GAAA2G,SAAAC,GAAA3C,EAAAC,GAIhBkC,EAAA1G,EAAA,KAAA+F,EAAA,CAAAY,KAAA,WAAA7E,KAAA,WAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASrG,SAAQyD,IAAA,CAAA4C,EAAAzG,KAAAyG,EAARrG,SAAQJ,CAAA,GAAA2G,SAAAC,GAAAzC,EAAAC,GAIjBgC,EAAA1G,EAAA,KAAAiG,EAAA,CAAAU,KAAA,WAAA7E,KAAA,YAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,cAAAA,EAAAC,IAAAD,GAAAA,EAASnG,UAASuD,IAAA,CAAA4C,EAAAzG,KAAAyG,EAATnG,UAASN,CAAA,GAAA2G,SAAAC,GAAAvC,EAAAC,GAIlB8B,EAAA1G,EAAA,KAAAkG,EAAA,CAAAS,KAAA,WAAA7E,KAAA,WAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASjG,SAAQqD,IAAA,CAAA4C,EAAAzG,KAAAyG,EAARjG,SAAQR,CAAA,GAAA2G,SAAAC,GAAArC,GAAAC,IAIjB4B,EAAA1G,EAAA,KAAAmG,EAAA,CAAAQ,KAAA,WAAA7E,KAAA,cAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,gBAAAA,EAAAC,IAAAD,GAAAA,EAAS/F,YAAWmD,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAX/F,YAAWV,CAAA,GAAA2G,SAAAC,GAAAnC,GAAAC,IAIpB0B,EAAA1G,EAAA,KAAAqG,EAAA,CAAAM,KAAA,WAAA7E,KAAA,eAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,iBAAAA,EAAAC,IAAAD,GAAAA,EAAS7F,aAAYiD,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAZ7F,aAAYZ,CAAA,GAAA2G,SAAAC,GAAAjC,GAAAC,IAMrBwB,EAAA1G,EAAA,KAAAsG,EAAA,CAAAK,KAAA,WAAA7E,KAAA,eAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,iBAAAA,EAAAC,IAAAD,GAAAA,EAAS3F,aAAY+C,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAZ3F,aAAYd,CAAA,GAAA2G,SAAAC,GAAA/B,GAAAC,IAOrBsB,EAAA1G,EAAA,KAAAmH,EAAA,CAAAR,KAAA,WAAA7E,KAAA,gBAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,kBAAAA,EAAAC,IAAAD,GAAAA,EAASzF,cAAa6C,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAbzF,cAAahB,CAAA,GAAA2G,SAAAC,GAAA7B,GAAAC,IAOtBoB,EAAA1G,EAAA,KAAAoH,EAAA,CAAAT,KAAA,WAAA7E,KAAA,WAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASvF,SAAQ2C,IAAA,CAAA4C,EAAAzG,KAAAyG,EAARvF,SAAQlB,CAAA,GAAA2G,SAAAC,GAAA3B,GAAAC,IAMjBkB,EAAA1G,EAAA,KAAAyG,EAAA,CAAAE,KAAA,WAAA7E,KAAA,iBAAA8E,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAA9C,IAAA+C,GAAA,mBAAAA,EAAAC,IAAAD,GAAAA,EAASrF,eAAcyC,IAAA,CAAA4C,EAAAzG,KAAAyG,EAAdrF,eAAcpB,CAAA,GAAA2G,SAAAC,GAAAzB,GAAA4B,IAvDzBX,EAAA,KAAAY,EAAA,CAAAhH,MAAAN,GAAAuH,EAAA,CAAAZ,KAAA,QAAA7E,KAAA9B,EAAA8B,KAAAmF,SAAAC,GAAA,KAAAM,iHACkBxH,EAAAyH,OAASC,EAAUC,GADxBvD,EAAApE,EAAAwH,MAAU"}
+{"version":3,"file":"colorInput.js","sources":["../../../../src/components/reusable/colorInput/colorInput.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from 'lit';\nimport { customElement, state, query, property } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit-html/directives/unsafe-svg.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { classMap } from 'lit/directives/class-map.js';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/16/error-filled.svg';\nimport Styles from './colorInput.scss?inline';\nimport { FormMixin } from '../../../common/mixins/form-input';\n\nconst _defaultTextStrings = {\n  requiredText: 'Required',\n  errorText: 'Error',\n  pleaseSelectColor: 'Please select a color',\n  invalidFormat: 'Enter a valid hex color (e.g. #FF0000)',\n  colorTextInput: 'Color text input',\n};\n\n/**\n * Color input.\n * @fires on-input - Captures the input event and emits the selected value and original event details. `detail:{ value: string, origEvent: Event }`\n * @slot tooltip - Slot for tooltip.\n * @attr {string} [value=''] - The value of the input.\n * @attr {string} [name=''] - The name of the input, used for form submission.\n * @attr {string} [invalidText=''] - The custom validation message when the input is invalid.\n */\n@customElement('kyn-color-input')\nexport class ColorInput extends FormMixin(LitElement) {\n  static override styles = unsafeCSS(Styles);\n\n  /** Label text. */\n  @property({ type: String })\n  accessor label = '';\n\n  /** Optional text beneath the input. */\n  @property({ type: String })\n  accessor caption = '';\n\n  /** Input disabled state. */\n  @property({ type: Boolean })\n  accessor disabled = false;\n\n  /** Input required state. */\n  @property({ type: Boolean })\n  accessor required = false;\n\n  /** Visually hide the label. */\n  @property({ type: Boolean })\n  accessor hideLabel = false;\n\n  /** Input readonly state. */\n  @property({ type: Boolean })\n  accessor readonly = false;\n\n  /** Customizable text strings. */\n  @property({ type: Object })\n  accessor textStrings = _defaultTextStrings;\n\n  /** Control for native browser autocomplete. Use `on`, `off`, or a space-separated `token-list` describing autocomplete behavior.*/\n  @property({ type: String })\n  accessor autoComplete: string = 'off';\n\n  /** Internal text strings.\n   * @internal\n   */\n  @state()\n  accessor _textStrings = _defaultTextStrings;\n\n  /**\n   * Queries the <input[type=\"color\"]> DOM element.\n   * @ignore\n   */\n  @query('input[type=\"color\"]')\n  accessor _inputColorEl!: HTMLInputElement;\n\n  /**\n   * Queries the <input[type=\"text\"]> DOM element.\n   * @ignore\n   */\n  @query('input[type=\"text\"]')\n  accessor _inputEl!: HTMLInputElement;\n\n  /** Sets whether user has interacted with input text for error handling..\n   * @internal\n   */\n  @state()\n  accessor _hasInteracted = false;\n\n  override render() {\n    return html`\n      <div\n        class=\"text-input\"\n        ?disabled=${this.disabled}\n        ?readonly=${this.readonly}\n      >\n        <label\n          class=\"label-text ${this.hideLabel ? 'sr-only' : ''}\"\n          for=${this.name}\n        >\n          ${\n            this.required\n              ? html`<abbr\n                  class=\"required\"\n                  title=${this._textStrings.requiredText}\n                  role=\"img\"\n                  aria-label=${this._textStrings?.requiredText || 'Required'}\n                  >*</abbr\n                >`\n              : null\n          }\n          ${this.label}\n          <slot name=\"tooltip\"></slot>\n        </label>\n        <div class=\"color-input-wrapper\">\n          <input\n          class=${classMap({\n            'custom-color': true,\n            readonly: this.readonly,\n          })}\n            type=\"color\"\n            name=\"colorInput\"\n            id=\"colorInput\"\n            .value=${this.value}\n            ?disabled=${this.disabled}\n            @input=${this.handleColorChange}\n          />\n          </div>\n          <input\n            class=\"${classMap({\n              'is-readonly': this.readonly,\n            })}\"\n            type=\"text\"\n            name=${this.name}\n            .value=${this.value}\n            ?disabled=${this.disabled}\n            ?readonly=${this.readonly}\n            ?invalid=${this._isInvalid}\n            aria-label=${this._textStrings.colorTextInput}\n            aria-invalid=${this._isInvalid}\n            aria-describedby=${this._isInvalid ? 'error' : ''}\n            autocomplete=${this.autoComplete}\n            @input=${(e: any) => this.handleTextInput(e)}\n          />\n          <div class=\"caption-error-count\">\n            <div>\n              ${\n                this.caption !== ''\n                  ? html`\n                      <div class=\"caption\" aria-disabled=${this.disabled}>\n                        ${this.caption}\n                      </div>\n                    `\n                  : null\n              }\n              ${\n                this._isInvalid\n                  ? html`\n                      <div id=\"error\" class=\"error\">\n                        <span\n                          role=\"img\"\n                          class=\"error-icon\"\n                          aria-label=${this._textStrings.errorText}\n                          >${unsafeSVG(errorIcon)}</span\n                        >\n                        ${this.invalidText || this._internalValidationMsg}\n                      </div>\n                    `\n                  : null\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private handleColorChange(e: any) {\n    this.value = e.target.value;\n    this._inputEl.value = e.target.value;\n    this._validate(true, false);\n    this._emitValue(e);\n  }\n\n  private handleTextInput(e: any) {\n    this.value = e.target.value;\n    this._inputColorEl.value = e.target.value;\n    this._validate(true, false);\n    this._emitValue(e);\n  }\n\n  private _emitValue(e?: any) {\n    const Detail: any = {\n      value: this.value,\n    };\n    if (e) {\n      Detail.origEvent = e;\n    }\n\n    const event = new CustomEvent('on-input', {\n      detail: Detail,\n    });\n    this.dispatchEvent(event);\n  }\n\n  private _validate(interacted: Boolean, report: Boolean) {\n    // get validity state from inputEl\n    if (interacted) this._hasInteracted = true;\n    const hexPattern = /^#([0-9a-fA-F]{6})$/;\n    const value = this._inputEl.value;\n    const validityFlags = {\n      valueMissing: false,\n      patternMismatch: false,\n      customError: false,\n      valid: true,\n    };\n\n    let validationMessage = '';\n\n    if (this.required && !value) {\n      validityFlags.valueMissing = true;\n      validityFlags.valid = false;\n      validationMessage = this._textStrings.pleaseSelectColor;\n    }\n\n    if (value != '' && !hexPattern.test(value)) {\n      validityFlags.patternMismatch = true;\n      validityFlags.valid = false;\n      validationMessage = this._textStrings.invalidFormat;\n    }\n\n    // set validity on custom element, anchor to inputEl\n    this._internals.setValidity(\n      validityFlags,\n      validationMessage,\n      this._inputEl\n    );\n\n    // set internal validation message if value was changed by user input\n    if (interacted) {\n      this._internalValidationMsg = validationMessage;\n    }\n\n    // focus the form field to show validity\n    if (report) {\n      this._internals.reportValidity();\n    }\n  }\n\n  override updated(changedProps: any) {\n    // preserve FormMixin updated function\n    this._onUpdated(changedProps);\n\n    if (changedProps.has('value')) {\n      this._inputEl.value = this.value;\n    }\n  }\n\n  override willUpdate(changedProps: any) {\n    if (changedProps.has('textStrings')) {\n      this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-color-input': ColorInput;\n  }\n}\n"],"names":["_defaultTextStrings","requiredText","errorText","pleaseSelectColor","invalidFormat","colorTextInput","ColorInput","customElement","FormMixin","LitElement","_classThis","_classSuper","label","__classPrivateFieldGet","this","_ColorInput_label_accessor_storage","value","__classPrivateFieldSet","caption","_ColorInput_caption_accessor_storage","disabled","_ColorInput_disabled_accessor_storage","required","_ColorInput_required_accessor_storage","hideLabel","_ColorInput_hideLabel_accessor_storage","readonly","_ColorInput_readonly_accessor_storage","textStrings","_ColorInput_textStrings_accessor_storage","autoComplete","_ColorInput_autoComplete_accessor_storage","_textStrings","_ColorInput__textStrings_accessor_storage","_inputColorEl","_ColorInput__inputColorEl_accessor_storage","_inputEl","_ColorInput__inputEl_accessor_storage","_hasInteracted","_ColorInput__hasInteracted_accessor_storage","render","html","name","_a","classMap","handleColorChange","_isInvalid","e","handleTextInput","unsafeSVG","errorIcon","invalidText","_internalValidationMsg","target","_validate","_emitValue","Detail","origEvent","event","CustomEvent","detail","dispatchEvent","interacted","report","validityFlags","valueMissing","patternMismatch","customError","valid","validationMessage","test","_internals","setValidity","reportValidity","updated","changedProps","_onUpdated","has","willUpdate","deepmerge","set","__runInitializers","_label_initializers","_label_extraInitializers","_caption_initializers","_caption_extraInitializers","_disabled_initializers","_disabled_extraInitializers","_required_initializers","_required_extraInitializers","_hideLabel_initializers","_hideLabel_extraInitializers","_readonly_initializers","_readonly_extraInitializers","_textStrings_initializers","_textStrings_extraInitializers","_autoComplete_initializers","_autoComplete_extraInitializers","__textStrings_initializers","__textStrings_extraInitializers","__inputColorEl_initializers","__inputColorEl_extraInitializers","__inputEl_initializers","__inputEl_extraInitializers","__hasInteracted_initializers","_label_decorators","property","type","String","_caption_decorators","_disabled_decorators","Boolean","_required_decorators","_hideLabel_decorators","_readonly_decorators","_textStrings_decorators","Object","_autoComplete_decorators","__textStrings_decorators","state","query","__hasInteracted_decorators","__esDecorate","kind","static","private","access","obj","get","metadata","_metadata","__inputColorEl_decorators","__inputEl_decorators","__hasInteracted_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","Styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GASA,MAAMA,EAAsB,CAC1BC,aAAc,WACdC,UAAW,QACXC,kBAAmB,wBACnBC,cAAe,yCACfC,eAAgB,wBAYLC,EAAU,qEADtBC,EAAc,2BACiBC,EAAUC,oJAAlBC,EAAA,cAAQC,EAK9B,SAASC,GAAK,OAAAC,EAAAC,KAAAC,EAAA,IAAA,CAAd,SAASH,CAAKI,GAAAC,EAAAH,KAAAC,EAAAC,EAAA,IAAA,CAId,WAASE,GAAO,OAAAL,EAAAC,KAAAK,EAAA,IAAA,CAAhB,WAASD,CAAOF,GAAAC,EAAAH,KAAAK,EAAAH,EAAA,IAAA,CAIhB,YAASI,GAAQ,OAAAP,EAAAC,KAAAO,EAAA,IAAA,CAAjB,YAASD,CAAQJ,GAAAC,EAAAH,KAAAO,EAAAL,EAAA,IAAA,CAIjB,YAASM,GAAQ,OAAAT,EAAAC,KAAAS,EAAA,IAAA,CAAjB,YAASD,CAAQN,GAAAC,EAAAH,KAAAS,EAAAP,EAAA,IAAA,CAIjB,aAASQ,GAAS,OAAAX,EAAAC,KAAAW,EAAA,IAAA,CAAlB,aAASD,CAASR,GAAAC,EAAAH,KAAAW,EAAAT,EAAA,IAAA,CAIlB,YAASU,GAAQ,OAAAb,EAAAC,KAAAa,EAAA,IAAA,CAAjB,YAASD,CAAQV,GAAAC,EAAAH,KAAAa,EAAAX,EAAA,IAAA,CAIjB,eAASY,GAAW,OAAAf,EAAAC,KAAAe,EAAA,IAAA,CAApB,eAASD,CAAWZ,GAAAC,EAAAH,KAAAe,EAAAb,EAAA,IAAA,CAIpB,gBAASc,GAAY,OAAAjB,EAAAC,KAAAiB,EAAA,IAAA,CAArB,gBAASD,CAAYd,GAAAC,EAAAH,KAAAiB,EAAAf,EAAA,IAAA,CAMrB,gBAASgB,GAAY,OAAAnB,EAAAC,KAAAmB,EAAA,IAAA,CAArB,gBAASD,CAAYhB,GAAAC,EAAAH,KAAAmB,EAAAjB,EAAA,IAAA,CAOrB,iBAASkB,GAAa,OAAArB,EAAAC,KAAAqB,EAAA,IAAA,CAAtB,iBAASD,CAAalB,GAAAC,EAAAH,KAAAqB,EAAAnB,EAAA,IAAA,CAOtB,YAASoB,GAAQ,OAAAvB,EAAAC,KAAAuB,EAAA,IAAA,CAAjB,YAASD,CAAQpB,GAAAC,EAAAH,KAAAuB,EAAArB,EAAA,IAAA,CAMjB,kBAASsB,GAAc,OAAAzB,EAAAC,KAAAyB,EAAA,IAAA,CAAvB,kBAASD,CAActB,GAAAC,EAAAH,KAAAyB,EAAAvB,EAAA,IAAA,CAEd,MAAAwB,SACP,OAAOC,CAAI;;;oBAGK3B,KAAKM;oBACLN,KAAKY;;;8BAGKZ,KAAKU,UAAY,UAAY;gBAC3CV,KAAK4B;;YAGT5B,KAAKQ,SACDmB,CAAI;;0BAEM3B,KAAKkB,aAAa/B;;gCAEI,UAAjBa,KAAKkB,oBAAY,IAAAW,OAAA,EAAAA,EAAE1C,eAAgB;;mBAGlD;YAEJa,KAAKF;;;;;kBAKCgC,EAAS,CACf,gBAAgB,EAChBlB,SAAUZ,KAAKY;;;;qBAKNZ,KAAKE;wBACFF,KAAKM;qBACRN,KAAK+B;;;;qBAILD,EAAS,CAChB,cAAe9B,KAAKY;;mBAGfZ,KAAK4B;qBACH5B,KAAKE;wBACFF,KAAKM;wBACLN,KAAKY;uBACNZ,KAAKgC;yBACHhC,KAAKkB,aAAa3B;2BAChBS,KAAKgC;+BACDhC,KAAKgC,WAAa,QAAU;2BAChChC,KAAKgB;qBACViB,GAAWjC,KAAKkC,gBAAgBD;;;;gBAKrB,KAAjBjC,KAAKI,QACDuB,CAAI;2DACmC3B,KAAKM;0BACtCN,KAAKI;;sBAGX;gBAGJJ,KAAKgC,WACDL,CAAI;;;;;uCAKe3B,KAAKkB,aAAa9B;6BAC5B+C,EAAUC;;0BAEbpC,KAAKqC,aAAerC,KAAKsC;;sBAG/B;;;;;MASV,iBAAAP,CAAkBE,GACxBjC,KAAKE,MAAQ+B,EAAEM,OAAOrC,MACtBF,KAAKsB,SAASpB,MAAQ+B,EAAEM,OAAOrC,MAC/BF,KAAKwC,WAAU,GAAM,GACrBxC,KAAKyC,WAAWR,GAGV,eAAAC,CAAgBD,GACtBjC,KAAKE,MAAQ+B,EAAEM,OAAOrC,MACtBF,KAAKoB,cAAclB,MAAQ+B,EAAEM,OAAOrC,MACpCF,KAAKwC,WAAU,GAAM,GACrBxC,KAAKyC,WAAWR,GAGV,UAAAQ,CAAWR,GACjB,MAAMS,EAAc,CAClBxC,MAAOF,KAAKE,OAEV+B,IACFS,EAAOC,UAAYV,GAGrB,MAAMW,EAAQ,IAAIC,YAAY,WAAY,CACxCC,OAAQJ,IAEV1C,KAAK+C,cAAcH,GAGb,SAAAJ,CAAUQ,EAAqBC,GAEjCD,IAAYhD,KAAKwB,gBAAiB,GACtC,MACMtB,EAAQF,KAAKsB,SAASpB,MACtBgD,EAAgB,CACpBC,cAAc,EACdC,iBAAiB,EACjBC,aAAa,EACbC,OAAO,GAGT,IAAIC,EAAoB,GAEpBvD,KAAKQ,WAAaN,IACpBgD,EAAcC,cAAe,EAC7BD,EAAcI,OAAQ,EACtBC,EAAoBvD,KAAKkB,aAAa7B,mBAG3B,IAATa,GAjBe,sBAiBYsD,KAAKtD,KAClCgD,EAAcE,iBAAkB,EAChCF,EAAcI,OAAQ,EACtBC,EAAoBvD,KAAKkB,aAAa5B,eAIxCU,KAAKyD,WAAWC,YACdR,EACAK,EACAvD,KAAKsB,UAIH0B,IACFhD,KAAKsC,uBAAyBiB,GAI5BN,GACFjD,KAAKyD,WAAWE,iBAIX,OAAAC,CAAQC,GAEf7D,KAAK8D,WAAWD,GAEZA,EAAaE,IAAI,WACnB/D,KAAKsB,SAASpB,MAAQF,KAAKE,OAItB,UAAA8D,CAAWH,GACdA,EAAaE,IAAI,iBACnB/D,KAAKkB,aAAe+C,EAAU/E,EAAqBc,KAAKc,gDAnOnDb,EAAAiE,IAAAlE,KAAAmE,EAAAnE,KAAAoE,EAAQ,KAIR/D,EAAA6D,IAAAlE,MAAAmE,EAAAnE,KAAAqE,GAAAF,EAAAnE,KAAAsE,EAAU,MAIV/D,EAAA2D,IAAAlE,MAAAmE,EAAAnE,KAAAuE,GAAAJ,EAAAnE,KAAAwE,GAAW,KAIX/D,EAAAyD,IAAAlE,MAAAmE,EAAAnE,KAAAyE,GAAAN,EAAAnE,KAAA0E,IAAW,KAIX/D,EAAAuD,IAAAlE,MAAAmE,EAAAnE,KAAA2E,IAAAR,EAAAnE,KAAA4E,IAAY,KAIZ/D,EAAAqD,IAAAlE,MAAAmE,EAAAnE,KAAA6E,IAAAV,EAAAnE,KAAA8E,IAAW,KAIX/D,EAAAmD,IAAAlE,MAAAmE,EAAAnE,KAAA+E,IAAAZ,EAAAnE,KAAAgF,GAAc9F,KAId+B,EAAAiD,IAAAlE,MAAAmE,EAAAnE,KAAAiF,IAAAd,EAAAnE,KAAAkF,GAAuB,SAMvB/D,EAAA+C,IAAAlE,MAAAmE,EAAAnE,KAAAmF,IAAAhB,EAAAnE,KAAAoF,GAAelG,KAOfmC,EAAA6C,IAAAlE,MAAAmE,EAAAnE,KAAAqF,IAAAlB,EAAAnE,KAAAsF,QAAA,KAOA/D,EAAA2C,IAAAlE,MAAAmE,EAAAnE,KAAAuF,IAAApB,EAAAnE,KAAAwF,QAAA,KAMA/D,EAAAyC,IAAAlE,MAAAmE,EAAAnE,KAAAyF,IAAAtB,EAAAnE,KAAA0F,IAAiB,kVAvDzBC,EAAA,CAAAC,EAAS,CAAEC,KAAMC,UAIjBC,EAAA,CAAAH,EAAS,CAAEC,KAAMC,UAIjBE,EAAA,CAAAJ,EAAS,CAAEC,KAAMI,WAIjBC,EAAA,CAAAN,EAAS,CAAEC,KAAMI,WAIjBE,EAAA,CAAAP,EAAS,CAAEC,KAAMI,WAIjBG,EAAA,CAAAR,EAAS,CAAEC,KAAMI,WAIjBI,EAAA,CAAAT,EAAS,CAAEC,KAAMS,UAIjBC,EAAA,CAAAX,EAAS,CAAEC,KAAMC,UAMjBU,EAAA,CAAAC,QAOAC,EAAM,2BAONA,EAAM,uBAMNC,EAAA,CAAAF,KArDDG,EAAAhH,EAAA,KAAA+F,EAAA,CAAAkB,KAAA,WAAAjF,KAAA,QAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,UAAAA,EAAAC,IAAAD,GAAAA,EAASnH,MAAKoE,IAAA,CAAA+C,EAAA/G,KAAA+G,EAALnH,MAAKI,CAAA,GAAAiH,SAAAC,GAAAhD,EAAAC,GAIduC,EAAAhH,EAAA,KAAAmG,EAAA,CAAAc,KAAA,WAAAjF,KAAA,UAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,YAAAA,EAAAC,IAAAD,GAAAA,EAAS7G,QAAO8D,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAP7G,QAAOF,CAAA,GAAAiH,SAAAC,GAAA9C,EAAAC,GAIhBqC,EAAAhH,EAAA,KAAAoG,EAAA,CAAAa,KAAA,WAAAjF,KAAA,WAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAAS3G,SAAQ4D,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAR3G,SAAQJ,CAAA,GAAAiH,SAAAC,GAAA5C,EAAAC,GAIjBmC,EAAAhH,EAAA,KAAAsG,EAAA,CAAAW,KAAA,WAAAjF,KAAA,WAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASzG,SAAQ0D,IAAA,CAAA+C,EAAA/G,KAAA+G,EAARzG,SAAQN,CAAA,GAAAiH,SAAAC,GAAA1C,GAAAC,IAIjBiC,EAAAhH,EAAA,KAAAuG,EAAA,CAAAU,KAAA,WAAAjF,KAAA,YAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,cAAAA,EAAAC,IAAAD,GAAAA,EAASvG,UAASwD,IAAA,CAAA+C,EAAA/G,KAAA+G,EAATvG,UAASR,CAAA,GAAAiH,SAAAC,GAAAxC,GAAAC,IAIlB+B,EAAAhH,EAAA,KAAAwG,EAAA,CAAAS,KAAA,WAAAjF,KAAA,WAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASrG,SAAQsD,IAAA,CAAA+C,EAAA/G,KAAA+G,EAARrG,SAAQV,CAAA,GAAAiH,SAAAC,GAAAtC,GAAAC,IAIjB6B,EAAAhH,EAAA,KAAAyG,EAAA,CAAAQ,KAAA,WAAAjF,KAAA,cAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,gBAAAA,EAAAC,IAAAD,GAAAA,EAASnG,YAAWoD,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAXnG,YAAWZ,CAAA,GAAAiH,SAAAC,GAAApC,GAAAC,IAIpB2B,EAAAhH,EAAA,KAAA2G,EAAA,CAAAM,KAAA,WAAAjF,KAAA,eAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,iBAAAA,EAAAC,IAAAD,GAAAA,EAASjG,aAAYkD,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAZjG,aAAYd,CAAA,GAAAiH,SAAAC,GAAAlC,GAAAC,IAMrByB,EAAAhH,EAAA,KAAA4G,EAAA,CAAAK,KAAA,WAAAjF,KAAA,eAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,iBAAAA,EAAAC,IAAAD,GAAAA,EAAS/F,aAAYgD,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAZ/F,aAAYhB,CAAA,GAAAiH,SAAAC,GAAAhC,GAAAC,IAOrBuB,EAAAhH,EAAA,KAAAyH,EAAA,CAAAR,KAAA,WAAAjF,KAAA,gBAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,kBAAAA,EAAAC,IAAAD,GAAAA,EAAS7F,cAAa8C,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAb7F,cAAalB,CAAA,GAAAiH,SAAAC,GAAA9B,GAAAC,IAOtBqB,EAAAhH,EAAA,KAAA0H,EAAA,CAAAT,KAAA,WAAAjF,KAAA,WAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAAS3F,SAAQ4C,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAR3F,SAAQpB,CAAA,GAAAiH,SAAAC,GAAA5B,GAAAC,IAMjBmB,EAAAhH,EAAA,KAAA+G,EAAA,CAAAE,KAAA,WAAAjF,KAAA,iBAAAkF,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAjD,IAAAkD,GAAA,mBAAAA,EAAAC,IAAAD,GAAAA,EAASzF,eAAc0C,IAAA,CAAA+C,EAAA/G,KAAA+G,EAAdzF,eAActB,CAAA,GAAAiH,SAAAC,GAAA1B,GAAA6B,IA3DzBX,EAAA,KAAAY,EAAA,CAAAtH,MAAAN,GAAA6H,EAAA,CAAAZ,KAAA,QAAAjF,KAAAhC,EAAAgC,KAAAuF,SAAAC,GAAA,KAAAM,iHACkB9H,EAAA+H,OAASC,EAAUC,GADxB1D,EAAAvE,EAAA8H,MAAU"}

package/components/reusable/fileUploader/fileUploader.d.ts

@@ -9,9 +9,12 @@ declare const FileUploader_base: (new (...args: any[]) => import("../../../commo
  * File Uploader
  * @fires selected-files - Emits the uploaded files.`detail:{ validFiles: Array, invalidFiles: Array }`
  * @slot upload-status - Slot for upload status/notification.
+ * @attr {string} [name=''] - The name of the input, used for form submission.
  */
 export declare class FileUploader extends FileUploader_base {
     static styles: import("lit").CSSResult;
+    /** @internal */
+    value: FormData;
     /**
      * Set the file types that the component accepts. By default, it accepts all file types.
      * @example
@@ -125,7 +128,6 @@ export declare class FileUploader extends FileUploader_base {
      */
     accessor _inputEl: HTMLInputElement;
     willUpdate(changedProps: any): void;
-    updated(changedProps: any): void;
     render(): import("lit-html").TemplateResult<1>;
     handleDragOver(event: DragEvent): void;
     handleDrop(event: DragEvent): void;

package/components/reusable/fileUploader/fileUploader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fileUploader.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAYlD,OAAO,6BAA6B,CAAC;AACrC,OAAO,WAAW,CAAC;AACnB,OAAO,YAAY,CAAC;AACpB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;;AAsBzB;;;;GAIG;AACH,qBACa,YAAa,SAAQ,iBAAqB;IACrD,OAAgB,MAAM,0BAA+B;IAErD;;;;;;;OAOG;IAEH,QAAQ,CAAC,MAAM,EAAE,MAAM,EAAE,CAAM;IAE/B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B;;OAEG;IAEH,QAAQ,CAAC,WAAW;;;;;;;;;;;;;;;;;;MAAuB;IAE3C;;;;;;OAMG;IAEH,QAAQ,CAAC,WAAW,SAAW;IAE/B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B;;OAEG;IAEH,QAAQ,CAAC,UAAU,EAAE;QACnB,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,KAAK,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;KACpD,EAAE,CAAM;IAET;;OAEG;IAEH,QAAQ,CAAC,YAAY,EAAE;QACrB,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,WAAW,GAAG,WAAW,GAAG,cAAc,CAAC;QACnD,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,EAAE,CAAM;IAET;;;OAGG;IAEH,QAAQ,CAAC,YAAY;;;;;;;;;;;;;;;;;;MAAuB;IAE5C;;;OAGG;IAEH,QAAQ,CAAC,SAAS,UAAS;IAE3B;;;OAGG;IAEH,QAAQ,CAAC,aAAa,EAAE,MAAM,EAAE,CAAM;IAEtC;;;OAGG;IAEH,QAAQ,CAAC,WAAW,EAAE,MAAM,EAAE,CAAM;IAEpC;;;OAGG;IAEH,QAAQ,CAAC,2BAA2B,UAAS;IAE7C;;;OAGG;IAEH,QAAQ,CAAC,QAAQ,EAAG,gBAAgB,CAAC;IAE5B,UAAU,CAAC,YAAY,EAAE,GAAG;IAa5B,OAAO,CAAC,YAAY,EAAE,GAAG;IAUzB,MAAM;IA4Jf,cAAc,CAAC,KAAK,EAAE,SAAS;IAM/B,UAAU,CAAC,KAAK,EAAE,SAAS;IAiB3B,OAAO,CAAC,kBAAkB;IAO1B,gBAAgB,CAAC,KAAK,EAAE,KAAK;IAa7B,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,cAAc;IA2EtB,OAAO,CAAC,SAAS;IAuCjB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,eAAe;IAuBvB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,oBAAoB;CAS7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,YAAY,CAAC;KACnC;CACF"}
+{"version":3,"file":"fileUploader.d.ts","sourceRoot":"","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAYlD,OAAO,6BAA6B,CAAC;AACrC,OAAO,WAAW,CAAC;AACnB,OAAO,YAAY,CAAC;AACpB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;;AAsBzB;;;;;GAKG;AACH,qBACa,YAAa,SAAQ,iBAAqB;IACrD,OAAgB,MAAM,0BAA+B;IAErD,gBAAgB;IACP,KAAK,EAAG,QAAQ,CAAC;IAE1B;;;;;;;OAOG;IAEH,QAAQ,CAAC,MAAM,EAAE,MAAM,EAAE,CAAM;IAE/B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B;;OAEG;IAEH,QAAQ,CAAC,WAAW;;;;;;;;;;;;;;;;;;MAAuB;IAE3C;;;;;;OAMG;IAEH,QAAQ,CAAC,WAAW,SAAW;IAE/B;;OAEG;IAEH,QAAQ,CAAC,QAAQ,UAAS;IAE1B;;OAEG;IAEH,QAAQ,CAAC,UAAU,EAAE;QACnB,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,KAAK,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;KACpD,EAAE,CAAM;IAET;;OAEG;IAEH,QAAQ,CAAC,YAAY,EAAE;QACrB,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,WAAW,GAAG,WAAW,GAAG,cAAc,CAAC;QACnD,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,EAAE,CAAM;IAET;;;OAGG;IAEH,QAAQ,CAAC,YAAY;;;;;;;;;;;;;;;;;;MAAuB;IAE5C;;;OAGG;IAEH,QAAQ,CAAC,SAAS,UAAS;IAE3B;;;OAGG;IAEH,QAAQ,CAAC,aAAa,EAAE,MAAM,EAAE,CAAM;IAEtC;;;OAGG;IAEH,QAAQ,CAAC,WAAW,EAAE,MAAM,EAAE,CAAM;IAEpC;;;OAGG;IAEH,QAAQ,CAAC,2BAA2B,UAAS;IAE7C;;;OAGG;IAEH,QAAQ,CAAC,QAAQ,EAAG,gBAAgB,CAAC;IAE5B,UAAU,CAAC,YAAY,EAAE,GAAG;IAe5B,MAAM;IA4Jf,cAAc,CAAC,KAAK,EAAE,SAAS;IAM/B,UAAU,CAAC,KAAK,EAAE,SAAS;IAiB3B,OAAO,CAAC,kBAAkB;IAO1B,gBAAgB,CAAC,KAAK,EAAE,KAAK;IAa7B,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,cAAc;IA2EtB,OAAO,CAAC,SAAS;IAuCjB,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,eAAe;IAuBvB,OAAO,CAAC,WAAW;IAYnB,OAAO,CAAC,oBAAoB;CAS7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,YAAY,CAAC;KACnC;CACF"}

package/components/reusable/fileUploader/fileUploader.js

@@ -1,4 +1,4 @@
-import{_ as i,a as e,b as t,c as a,d as n}from"../../../vendor/tslib-Ac8XvvSX.js";import{i as l,a as s,t as r,r as o,n as d,e as c}from"../../../vendor/@lit/reactive-element-f91Vet7N.js";import{e as h,o as p,x as f}from"../../../vendor/lit-html-BRBT5o_V.js";import{i as m}from"../../../vendor/lit-element-m-OqzV5s.js";import{d as g}from"../../../vendor/deepmerge-ts-OFb5ej8y.js";import{R as u,S as v,T as x,U as k,V as y}from"../../../vendor/@kyndryl-design-system/shidoka-icons-bi0_OAYf.js";import{FormMixin as _}from"../../../common/mixins/form-input.js";import"./fileUploaderListContainer.js";import"../button/button.js";import"../loaders/loader.js";import"../loaders/inline.js";import"../loaders/skeleton.js";import"../inlineConfirm/inlineConfirm.js";import"../notification/notification.js";import"../notification/notificationContainer.js";import"../link/link.js";import"../link/defs.js";import"../../../common/helpers/helpers.js";import"../button/defs.js";import"../../../vendor/lottie-web-t-JWAnz9.js";import"../../../vendor/flatpickr-D1_FkiHZ.js";import"../card/card.js";import"../card/vitalCard.skeleton.js";import"../../../cardSample-CUzFck1J.js";import"../card/informationalCard.skeleton.js";import"../badge/badge.js";var b=l`*,
+import{_ as i,a as e,b as t,c as a,d as n}from"../../../vendor/tslib-Ac8XvvSX.js";import{i as l,a as s,t as r,r as o,n as d,e as c}from"../../../vendor/@lit/reactive-element-f91Vet7N.js";import{e as h,o as p,x as f}from"../../../vendor/lit-html-BRBT5o_V.js";import{i as g}from"../../../vendor/lit-element-m-OqzV5s.js";import{d as m}from"../../../vendor/deepmerge-ts-OFb5ej8y.js";import{R as u,S as v,T as x,U as k,V as y}from"../../../vendor/@kyndryl-design-system/shidoka-icons-bi0_OAYf.js";import{FormMixin as _}from"../../../common/mixins/form-input.js";import"./fileUploaderListContainer.js";import"../button/button.js";import"../loaders/loader.js";import"../loaders/inline.js";import"../loaders/skeleton.js";import"../inlineConfirm/inlineConfirm.js";import"../notification/notification.js";import"../notification/notificationContainer.js";import"../link/link.js";import"../link/defs.js";import"../../../common/helpers/helpers.js";import"../button/defs.js";import"../../../vendor/lottie-web-t-JWAnz9.js";import"../../../vendor/flatpickr-D1_FkiHZ.js";import"../card/card.js";import"../card/vitalCard.skeleton.js";import"../../../cardSample-CUzFck1J.js";import"../card/informationalCard.skeleton.js";import"../badge/badge.js";var b=l`*,
 *::before,
 *::after {
   box-sizing: border-box;
@@ -299,7 +299,7 @@ import{_ as i,a as e,b as t,c as a,d as n}from"../../../vendor/tslib-Ac8XvvSX.js
 }
 .file-uploader-container .actions {
   margin-left: auto;
-}`;const F={dragAndDropText:"Drag files here to upload",separatorText:"or",buttonText:"Browse files",maxFileSizeText:"Max file size",supportedFileTypeText:"Supported file type: ",fileTypeDisplyText:"Any file type",invalidFileListLabel:"Some files could not be added:",validFileListLabel:"Files added:",clearListText:"Clear list",fileTypeErrorText:"Invaild file type",fileSizeErrorText:"Max file size exceeded",customFileErrorText:"Custom file error",inlineConfirmAnchorText:"Delete",inlineConfirmConfirmText:"Confirm",inlineConfirmCancelText:"Cancel",validationNotificationTitle:"Multiple files not allowed",validationNotificationMessage:"Please select only one file."};let z=(()=>{var l,z,w,S,$,T,E,j,M,C,V,N,D;let W,A,L,B,I,U,O,P,R,q,G,K,H,J,Q,X=[r("kyn-file-uploader")],Y=[],Z=_(m),ii=[],ei=[],ti=[],ai=[],ni=[],li=[],si=[],ri=[],oi=[],di=[],ci=[],hi=[],pi=[],fi=[],mi=[],gi=[],ui=[],vi=[],xi=[],ki=[],yi=[],_i=[],bi=[],Fi=[],zi=[],wi=[];return A=class extends Z{get accept(){return a(this,l,"f")}set accept(i){n(this,l,i,"f")}get multiple(){return a(this,z,"f")}set multiple(i){n(this,z,i,"f")}get textStrings(){return a(this,w,"f")}set textStrings(i){n(this,w,i,"f")}get maxFileSize(){return a(this,S,"f")}set maxFileSize(i){n(this,S,i,"f")}get disabled(){return a(this,$,"f")}set disabled(i){n(this,$,i,"f")}get validFiles(){return a(this,T,"f")}set validFiles(i){n(this,T,i,"f")}get invalidFiles(){return a(this,E,"f")}set invalidFiles(i){n(this,E,i,"f")}get _textStrings(){return a(this,j,"f")}set _textStrings(i){n(this,j,i,"f")}get _dragging(){return a(this,M,"f")}set _dragging(i){n(this,M,i,"f")}get _invalidFiles(){return a(this,C,"f")}set _invalidFiles(i){n(this,C,i,"f")}get _validFiles(){return a(this,V,"f")}set _validFiles(i){n(this,V,i,"f")}get _showValidationNotification(){return a(this,N,"f")}set _showValidationNotification(i){n(this,N,i,"f")}get _inputEl(){return a(this,D,"f")}set _inputEl(i){n(this,D,i,"f")}willUpdate(i){i.has("textStrings")&&(this._textStrings=g(F,this.textStrings)),i.has("validFiles")&&(this._validFiles=this.validFiles,this._setFormValue()),i.has("invalidFiles")&&(this._invalidFiles=this.invalidFiles)}updated(i){i.has("validFiles")&&(this._validFiles=this.validFiles,this._setFormValue()),i.has("invalidFiles")&&(this._invalidFiles=this.invalidFiles)}render(){const i={"drag-drop-container":!0,dragging:this._dragging,disabled:this.disabled};return f`
+}`;const F={dragAndDropText:"Drag files here to upload",separatorText:"or",buttonText:"Browse files",maxFileSizeText:"Max file size",supportedFileTypeText:"Supported file type: ",fileTypeDisplyText:"Any file type",invalidFileListLabel:"Some files could not be added:",validFileListLabel:"Files added:",clearListText:"Clear list",fileTypeErrorText:"Invaild file type",fileSizeErrorText:"Max file size exceeded",customFileErrorText:"Custom file error",inlineConfirmAnchorText:"Delete",inlineConfirmConfirmText:"Confirm",inlineConfirmCancelText:"Cancel",validationNotificationTitle:"Multiple files not allowed",validationNotificationMessage:"Please select only one file."};let z=(()=>{var l,z,w,S,$,T,E,j,M,C,V,N,D;let W,A,L,B,I,U,O,P,R,q,G,K,H,J,Q,X=[r("kyn-file-uploader")],Y=[],Z=_(g),ii=[],ei=[],ti=[],ai=[],ni=[],li=[],si=[],ri=[],oi=[],di=[],ci=[],hi=[],pi=[],fi=[],gi=[],mi=[],ui=[],vi=[],xi=[],ki=[],yi=[],_i=[],bi=[],Fi=[],zi=[],wi=[];return A=class extends Z{get accept(){return a(this,l,"f")}set accept(i){n(this,l,i,"f")}get multiple(){return a(this,z,"f")}set multiple(i){n(this,z,i,"f")}get textStrings(){return a(this,w,"f")}set textStrings(i){n(this,w,i,"f")}get maxFileSize(){return a(this,S,"f")}set maxFileSize(i){n(this,S,i,"f")}get disabled(){return a(this,$,"f")}set disabled(i){n(this,$,i,"f")}get validFiles(){return a(this,T,"f")}set validFiles(i){n(this,T,i,"f")}get invalidFiles(){return a(this,E,"f")}set invalidFiles(i){n(this,E,i,"f")}get _textStrings(){return a(this,j,"f")}set _textStrings(i){n(this,j,i,"f")}get _dragging(){return a(this,M,"f")}set _dragging(i){n(this,M,i,"f")}get _invalidFiles(){return a(this,C,"f")}set _invalidFiles(i){n(this,C,i,"f")}get _validFiles(){return a(this,V,"f")}set _validFiles(i){n(this,V,i,"f")}get _showValidationNotification(){return a(this,N,"f")}set _showValidationNotification(i){n(this,N,i,"f")}get _inputEl(){return a(this,D,"f")}set _inputEl(i){n(this,D,i,"f")}willUpdate(i){i.has("textStrings")&&(this._textStrings=m(F,this.textStrings)),i.has("validFiles")&&(this._validFiles=this.validFiles,this._setFormValue()),i.has("invalidFiles")&&(this._invalidFiles=this.invalidFiles)}render(){const i={"drag-drop-container":!0,dragging:this._dragging,disabled:this.disabled};return f`
       <div class="file-uploader-container">
         <!-- Drag and drop container -->
         <div class="drag-drop-container-wrapper">
@@ -415,7 +415,7 @@ import{_ as i,a as e,b as t,c as a,d as n}from"../../../vendor/tslib-Ac8XvvSX.js
           <slot name="upload-status"></slot>
         </div>
       </div>
-    `}handleDragOver(i){i.preventDefault(),i.stopPropagation(),this._dragging=!0}handleDrop(i){var e;if(i.preventDefault(),i.stopPropagation(),this._dragging=!1,this._showValidationNotification=!1,!this.disabled&&(null===(e=i.dataTransfer)||void 0===e?void 0:e.files)){const e=Array.from(i.dataTransfer.files);this._validateFiles(e),this._validate(!0,!1),this._setFormValue(),this._emitFileUploadEvent()}}_triggerFileSelect(){var i;const e=null===(i=this.shadowRoot)||void 0===i?void 0:i.querySelector("#fileInput");null==e||e.click()}handleFileChange(i){this._showValidationNotification=!1;const e=i.target;if(e.files){const i=Array.from(e.files);this._validateFiles(i),this._validate(!0,!1),this._setFormValue(),this._emitFileUploadEvent()}}_getFilesSize(i){if(i<1024)return`${i} Bytes`;if(i<1048576){const e=i/1024;return e%1==0?`${Math.floor(e)} KB`:`${e.toFixed(2)} KB`}if(i<1073741824){const e=i/1048576;return e%1==0?`${Math.floor(e)} MB`:`${e.toFixed(2)} MB`}{const e=i/1073741824;return e%1==0?`${Math.floor(e)} GB`:`${e.toFixed(2)} GB`}}_clearInvalidFiles(){this._invalidFiles=[],this._emitFileUploadEvent()}_validateFiles(i){if(!this.multiple&&i.length>1)return void(this._showValidationNotification=!0);const e=this.multiple?[...this._validFiles]:[],t=this.multiple?[...this._invalidFiles]:[];i.forEach((i=>{const a=i.name,n=i.type,l=i.size,s=this.accept.includes("image/*"),r=this.accept.includes("audio/*"),o=this.accept.includes("video/*"),d=(a.split(".").pop()||"").replace(/^/,".");this.accept.includes(n);const c=0===this.accept.length||s&&n.includes("image")||r&&n.includes("audio")||o&&n.includes("video")||this.accept.includes(n)||this.accept.includes(d),h=l<=this.maxFileSize,p=e.some((e=>e.file.name===i.name)),f=t.some((e=>e.file.name===i.name));if(c&&h&&!p)e.push({file:i,id:a,status:"new"});else if(!(c&&h||f)){let e="";e=c?h?"unknownError":"sizeError":"typeError",t.push({file:i,id:a,status:e})}})),(e.length>0||!this.multiple)&&(this._validFiles=e),(t.length>0||!this.multiple)&&(this._invalidFiles=t)}_validate(i,e){const t=""!==this.invalidText?{...this._inputEl.validity,customError:!0}:this._inputEl.validity;let a="";if(this._invalidFiles.length>0){const i=this._invalidFiles.some((i=>"typeError"===i.status)),e=this._invalidFiles.some((i=>"sizeError"===i.status));a=i&&e?"Invalid file type and Exceeds maximum file size":i?"Invalid file type":"Exceeds maximum file size"}const n=""!==this.invalidText?this.invalidText:a;(i||""!==this.invalidText)&&(this._internals.setValidity(t,n),i&&(this._internalValidationMsg=a)),e&&this._internals.reportValidity()}_setFormValue(){const i=new FormData;this._validFiles.forEach((e=>{const{file:t}=e;i.append(this.name,t)})),this._internals.setFormValue(i)}_displayActions(i){return"uploading"===i.status?f` <kyn-loader-inline></kyn-loader-inline> `:"uploaded"===i.status?f`
+    `}handleDragOver(i){i.preventDefault(),i.stopPropagation(),this._dragging=!0}handleDrop(i){var e;if(i.preventDefault(),i.stopPropagation(),this._dragging=!1,this._showValidationNotification=!1,!this.disabled&&(null===(e=i.dataTransfer)||void 0===e?void 0:e.files)){const e=Array.from(i.dataTransfer.files);this._validateFiles(e),this._validate(!0,!1),this._setFormValue(),this._emitFileUploadEvent()}}_triggerFileSelect(){var i;const e=null===(i=this.shadowRoot)||void 0===i?void 0:i.querySelector("#fileInput");null==e||e.click()}handleFileChange(i){this._showValidationNotification=!1;const e=i.target;if(e.files){const i=Array.from(e.files);this._validateFiles(i),this._validate(!0,!1),this._setFormValue(),this._emitFileUploadEvent()}}_getFilesSize(i){if(i<1024)return`${i} Bytes`;if(i<1048576){const e=i/1024;return e%1==0?`${Math.floor(e)} KB`:`${e.toFixed(2)} KB`}if(i<1073741824){const e=i/1048576;return e%1==0?`${Math.floor(e)} MB`:`${e.toFixed(2)} MB`}{const e=i/1073741824;return e%1==0?`${Math.floor(e)} GB`:`${e.toFixed(2)} GB`}}_clearInvalidFiles(){this._invalidFiles=[],this._emitFileUploadEvent()}_validateFiles(i){if(!this.multiple&&i.length>1)return void(this._showValidationNotification=!0);const e=this.multiple?[...this._validFiles]:[],t=this.multiple?[...this._invalidFiles]:[];i.forEach((i=>{const a=i.name,n=i.type,l=i.size,s=this.accept.includes("image/*"),r=this.accept.includes("audio/*"),o=this.accept.includes("video/*"),d=(a.split(".").pop()||"").replace(/^/,".");this.accept.includes(n);const c=0===this.accept.length||s&&n.includes("image")||r&&n.includes("audio")||o&&n.includes("video")||this.accept.includes(n)||this.accept.includes(d),h=l<=this.maxFileSize,p=e.some((e=>e.file.name===i.name)),f=t.some((e=>e.file.name===i.name));if(c&&h&&!p)e.push({file:i,id:a,status:"new"});else if(!(c&&h||f)){let e="";e=c?h?"unknownError":"sizeError":"typeError",t.push({file:i,id:a,status:e})}})),(e.length>0||!this.multiple)&&(this._validFiles=e),(t.length>0||!this.multiple)&&(this._invalidFiles=t)}_validate(i,e){const t=""!==this.invalidText?{...this._inputEl.validity,customError:!0}:this._inputEl.validity;let a="";if(this._invalidFiles.length>0){const i=this._invalidFiles.some((i=>"typeError"===i.status)),e=this._invalidFiles.some((i=>"sizeError"===i.status));a=i&&e?"Invalid file type and Exceeds maximum file size":i?"Invalid file type":"Exceeds maximum file size"}const n=""!==this.invalidText?this.invalidText:a;(i||""!==this.invalidText)&&(this._internals.setValidity(t,n),i&&(this._internalValidationMsg=a)),e&&this._internals.reportValidity()}_setFormValue(){const i=new FormData;this._validFiles.forEach((e=>{const{file:t}=e;i.append(this.name,t)})),this.value=i}_displayActions(i){return"uploading"===i.status?f` <kyn-loader-inline></kyn-loader-inline> `:"uploaded"===i.status?f`
         <span class="success-icon">${p(x)}</span>
       `:"error"===i.status?f` <span class="error-icon">${p(k)}</span> `:f` <kyn-inline-confirm
         ?destructive=${!0}
@@ -426,5 +426,5 @@ import{_ as i,a as e,b as t,c as a,d as n}from"../../../vendor/tslib-Ac8XvvSX.js
       >
         <span>${p(y)}</span>
         <span slot="confirmIcon">${p(y)}</span>
-      </kyn-inline-confirm>`}_deleteFile(i){var e;this._validFiles=this._validFiles.filter((e=>e.id!==i));(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("#fileInput")).value="",this._setFormValue(),this._emitFileUploadEvent()}_emitFileUploadEvent(){const i=new CustomEvent("selected-files",{detail:{validFiles:this._validFiles,invalidFiles:this._invalidFiles}});this.dispatchEvent(i)}constructor(){super(...arguments),l.set(this,t(this,ii,[])),z.set(this,(t(this,ei),t(this,ti,!1))),w.set(this,(t(this,ai),t(this,ni,F))),S.set(this,(t(this,li),t(this,si,1048576))),$.set(this,(t(this,ri),t(this,oi,!1))),T.set(this,(t(this,di),t(this,ci,[]))),E.set(this,(t(this,hi),t(this,pi,[]))),j.set(this,(t(this,fi),t(this,mi,F))),M.set(this,(t(this,gi),t(this,ui,!1))),C.set(this,(t(this,vi),t(this,xi,[]))),V.set(this,(t(this,ki),t(this,yi,[]))),N.set(this,(t(this,_i),t(this,bi,!1))),D.set(this,(t(this,Fi),t(this,zi,void 0))),t(this,wi)}},l=new WeakMap,z=new WeakMap,w=new WeakMap,S=new WeakMap,$=new WeakMap,T=new WeakMap,E=new WeakMap,j=new WeakMap,M=new WeakMap,C=new WeakMap,V=new WeakMap,N=new WeakMap,D=new WeakMap,i(A,"FileUploader"),(()=>{var i;const t="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(i=Z[Symbol.metadata])&&void 0!==i?i:null):void 0;L=[d({type:Array})],B=[d({type:Boolean})],I=[d({type:Object})],U=[d({type:Number})],O=[d({type:Boolean})],P=[d({type:Array})],R=[d({type:Array})],q=[s()],G=[s()],K=[s()],H=[s()],J=[s()],Q=[c("input")],e(A,null,L,{kind:"accessor",name:"accept",static:!1,private:!1,access:{has:i=>"accept"in i,get:i=>i.accept,set:(i,e)=>{i.accept=e}},metadata:t},ii,ei),e(A,null,B,{kind:"accessor",name:"multiple",static:!1,private:!1,access:{has:i=>"multiple"in i,get:i=>i.multiple,set:(i,e)=>{i.multiple=e}},metadata:t},ti,ai),e(A,null,I,{kind:"accessor",name:"textStrings",static:!1,private:!1,access:{has:i=>"textStrings"in i,get:i=>i.textStrings,set:(i,e)=>{i.textStrings=e}},metadata:t},ni,li),e(A,null,U,{kind:"accessor",name:"maxFileSize",static:!1,private:!1,access:{has:i=>"maxFileSize"in i,get:i=>i.maxFileSize,set:(i,e)=>{i.maxFileSize=e}},metadata:t},si,ri),e(A,null,O,{kind:"accessor",name:"disabled",static:!1,private:!1,access:{has:i=>"disabled"in i,get:i=>i.disabled,set:(i,e)=>{i.disabled=e}},metadata:t},oi,di),e(A,null,P,{kind:"accessor",name:"validFiles",static:!1,private:!1,access:{has:i=>"validFiles"in i,get:i=>i.validFiles,set:(i,e)=>{i.validFiles=e}},metadata:t},ci,hi),e(A,null,R,{kind:"accessor",name:"invalidFiles",static:!1,private:!1,access:{has:i=>"invalidFiles"in i,get:i=>i.invalidFiles,set:(i,e)=>{i.invalidFiles=e}},metadata:t},pi,fi),e(A,null,q,{kind:"accessor",name:"_textStrings",static:!1,private:!1,access:{has:i=>"_textStrings"in i,get:i=>i._textStrings,set:(i,e)=>{i._textStrings=e}},metadata:t},mi,gi),e(A,null,G,{kind:"accessor",name:"_dragging",static:!1,private:!1,access:{has:i=>"_dragging"in i,get:i=>i._dragging,set:(i,e)=>{i._dragging=e}},metadata:t},ui,vi),e(A,null,K,{kind:"accessor",name:"_invalidFiles",static:!1,private:!1,access:{has:i=>"_invalidFiles"in i,get:i=>i._invalidFiles,set:(i,e)=>{i._invalidFiles=e}},metadata:t},xi,ki),e(A,null,H,{kind:"accessor",name:"_validFiles",static:!1,private:!1,access:{has:i=>"_validFiles"in i,get:i=>i._validFiles,set:(i,e)=>{i._validFiles=e}},metadata:t},yi,_i),e(A,null,J,{kind:"accessor",name:"_showValidationNotification",static:!1,private:!1,access:{has:i=>"_showValidationNotification"in i,get:i=>i._showValidationNotification,set:(i,e)=>{i._showValidationNotification=e}},metadata:t},bi,Fi),e(A,null,Q,{kind:"accessor",name:"_inputEl",static:!1,private:!1,access:{has:i=>"_inputEl"in i,get:i=>i._inputEl,set:(i,e)=>{i._inputEl=e}},metadata:t},zi,wi),e(null,W={value:A},X,{kind:"class",name:A.name,metadata:t},null,Y),A=W.value,t&&Object.defineProperty(A,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})})(),A.styles=o(b),t(A,Y),A})();export{z as FileUploader};
+      </kyn-inline-confirm>`}_deleteFile(i){var e;this._validFiles=this._validFiles.filter((e=>e.id!==i));(null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("#fileInput")).value="",this._setFormValue(),this._emitFileUploadEvent()}_emitFileUploadEvent(){const i=new CustomEvent("selected-files",{detail:{validFiles:this._validFiles,invalidFiles:this._invalidFiles}});this.dispatchEvent(i)}constructor(){super(...arguments),l.set(this,t(this,ii,[])),z.set(this,(t(this,ei),t(this,ti,!1))),w.set(this,(t(this,ai),t(this,ni,F))),S.set(this,(t(this,li),t(this,si,1048576))),$.set(this,(t(this,ri),t(this,oi,!1))),T.set(this,(t(this,di),t(this,ci,[]))),E.set(this,(t(this,hi),t(this,pi,[]))),j.set(this,(t(this,fi),t(this,gi,F))),M.set(this,(t(this,mi),t(this,ui,!1))),C.set(this,(t(this,vi),t(this,xi,[]))),V.set(this,(t(this,ki),t(this,yi,[]))),N.set(this,(t(this,_i),t(this,bi,!1))),D.set(this,(t(this,Fi),t(this,zi,void 0))),t(this,wi)}},l=new WeakMap,z=new WeakMap,w=new WeakMap,S=new WeakMap,$=new WeakMap,T=new WeakMap,E=new WeakMap,j=new WeakMap,M=new WeakMap,C=new WeakMap,V=new WeakMap,N=new WeakMap,D=new WeakMap,i(A,"FileUploader"),(()=>{var i;const t="function"==typeof Symbol&&Symbol.metadata?Object.create(null!==(i=Z[Symbol.metadata])&&void 0!==i?i:null):void 0;L=[d({type:Array})],B=[d({type:Boolean})],I=[d({type:Object})],U=[d({type:Number})],O=[d({type:Boolean})],P=[d({type:Array})],R=[d({type:Array})],q=[s()],G=[s()],K=[s()],H=[s()],J=[s()],Q=[c("input")],e(A,null,L,{kind:"accessor",name:"accept",static:!1,private:!1,access:{has:i=>"accept"in i,get:i=>i.accept,set:(i,e)=>{i.accept=e}},metadata:t},ii,ei),e(A,null,B,{kind:"accessor",name:"multiple",static:!1,private:!1,access:{has:i=>"multiple"in i,get:i=>i.multiple,set:(i,e)=>{i.multiple=e}},metadata:t},ti,ai),e(A,null,I,{kind:"accessor",name:"textStrings",static:!1,private:!1,access:{has:i=>"textStrings"in i,get:i=>i.textStrings,set:(i,e)=>{i.textStrings=e}},metadata:t},ni,li),e(A,null,U,{kind:"accessor",name:"maxFileSize",static:!1,private:!1,access:{has:i=>"maxFileSize"in i,get:i=>i.maxFileSize,set:(i,e)=>{i.maxFileSize=e}},metadata:t},si,ri),e(A,null,O,{kind:"accessor",name:"disabled",static:!1,private:!1,access:{has:i=>"disabled"in i,get:i=>i.disabled,set:(i,e)=>{i.disabled=e}},metadata:t},oi,di),e(A,null,P,{kind:"accessor",name:"validFiles",static:!1,private:!1,access:{has:i=>"validFiles"in i,get:i=>i.validFiles,set:(i,e)=>{i.validFiles=e}},metadata:t},ci,hi),e(A,null,R,{kind:"accessor",name:"invalidFiles",static:!1,private:!1,access:{has:i=>"invalidFiles"in i,get:i=>i.invalidFiles,set:(i,e)=>{i.invalidFiles=e}},metadata:t},pi,fi),e(A,null,q,{kind:"accessor",name:"_textStrings",static:!1,private:!1,access:{has:i=>"_textStrings"in i,get:i=>i._textStrings,set:(i,e)=>{i._textStrings=e}},metadata:t},gi,mi),e(A,null,G,{kind:"accessor",name:"_dragging",static:!1,private:!1,access:{has:i=>"_dragging"in i,get:i=>i._dragging,set:(i,e)=>{i._dragging=e}},metadata:t},ui,vi),e(A,null,K,{kind:"accessor",name:"_invalidFiles",static:!1,private:!1,access:{has:i=>"_invalidFiles"in i,get:i=>i._invalidFiles,set:(i,e)=>{i._invalidFiles=e}},metadata:t},xi,ki),e(A,null,H,{kind:"accessor",name:"_validFiles",static:!1,private:!1,access:{has:i=>"_validFiles"in i,get:i=>i._validFiles,set:(i,e)=>{i._validFiles=e}},metadata:t},yi,_i),e(A,null,J,{kind:"accessor",name:"_showValidationNotification",static:!1,private:!1,access:{has:i=>"_showValidationNotification"in i,get:i=>i._showValidationNotification,set:(i,e)=>{i._showValidationNotification=e}},metadata:t},bi,Fi),e(A,null,Q,{kind:"accessor",name:"_inputEl",static:!1,private:!1,access:{has:i=>"_inputEl"in i,get:i=>i._inputEl,set:(i,e)=>{i._inputEl=e}},metadata:t},zi,wi),e(null,W={value:A},X,{kind:"class",name:A.name,metadata:t},null,Y),A=W.value,t&&Object.defineProperty(A,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})})(),A.styles=o(b),t(A,Y),A})();export{z as FileUploader};
 //# sourceMappingURL=fileUploader.js.map

package/components/reusable/fileUploader/fileUploader.js.map

@@ -1 +1 @@
-{"version":3,"file":"fileUploader.js","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport uploadIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/upload.svg';\nimport errorFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/error-filled.svg';\nimport deleteIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/delete.svg';\nimport checkmarkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/checkmark.svg';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/error.svg';\nimport { FormMixin } from '../../../common/mixins/form-input';\nimport FileUploaderScss from './fileUploader.scss?inline';\nimport './fileUploaderListContainer';\nimport '../button';\nimport '../loaders';\nimport '../inlineConfirm';\nimport '../notification';\n\nconst _defaultTextStrings = {\n  dragAndDropText: 'Drag files here to upload',\n  separatorText: 'or',\n  buttonText: 'Browse files',\n  maxFileSizeText: 'Max file size',\n  supportedFileTypeText: 'Supported file type: ',\n  fileTypeDisplyText: 'Any file type',\n  invalidFileListLabel: 'Some files could not be added:',\n  validFileListLabel: 'Files added:',\n  clearListText: 'Clear list',\n  fileTypeErrorText: 'Invaild file type',\n  fileSizeErrorText: 'Max file size exceeded',\n  customFileErrorText: 'Custom file error',\n  inlineConfirmAnchorText: 'Delete',\n  inlineConfirmConfirmText: 'Confirm',\n  inlineConfirmCancelText: 'Cancel',\n  validationNotificationTitle: 'Multiple files not allowed',\n  validationNotificationMessage: 'Please select only one file.',\n};\n\n/**\n * File Uploader\n * @fires selected-files - Emits the uploaded files.`detail:{ validFiles: Array, invalidFiles: Array }`\n * @slot upload-status - Slot for upload status/notification.\n */\n@customElement('kyn-file-uploader')\nexport class FileUploader extends FormMixin(LitElement) {\n  static override styles = unsafeCSS(FileUploaderScss);\n\n  /**\n   * Set the file types that the component accepts. By default, it accepts all file types.\n   * @example\n   * ['image/jpeg', 'image/png']\n   * ['image/*']\n   * ['audio/*']\n   * ['application/pdf', 'text/plain']\n   */\n  @property({ type: Array })\n  accessor accept: string[] = [];\n\n  /**\n   * Accept multiple files. Default value is `false`.\n   */\n  @property({ type: Boolean })\n  accessor multiple = false;\n\n  /**\n   * Customizable text strings.\n   */\n  @property({ type: Object })\n  accessor textStrings = _defaultTextStrings;\n\n  /**\n   * Set the maximum file size in bytes. Default value is `1048576` (1MB).\n   * @example\n   * 1048576 // 1MB\n   * 5242880 // 5MB\n   * 1073741824 // 1GB\n   */\n  @property({ type: Number })\n  accessor maxFileSize = 1048576; // 1MB\n\n  /**\n   * Disable the file uploader. Default value is `false`.\n   */\n  @property({ type: Boolean })\n  accessor disabled = false;\n\n  /**\n   * Valid files. This property is used to set the initial or updated state of the valid files.\n   */\n  @property({ type: Array })\n  accessor validFiles: {\n    id: string;\n    file: File;\n    status: 'new' | 'uploading' | 'uploaded' | 'error';\n  }[] = [];\n\n  /**\n   * Invalid files. This property is used to set the initial state of the invalid files.\n   */\n  @property({ type: Array })\n  accessor invalidFiles: {\n    id: string;\n    file: File;\n    status: 'sizeError' | 'typeError' | 'unknownError';\n    customErrorMsg?: string;\n  }[] = [];\n\n  /**\n   * Internal text strings.\n   * @internal\n   */\n  @state()\n  accessor _textStrings = _defaultTextStrings;\n\n  /**\n   * Internal dragging state.\n   * @internal\n   */\n  @state()\n  accessor _dragging = false;\n\n  /**\n   * Internal invalid files.\n   * @internal\n   */\n  @state()\n  accessor _invalidFiles: Object[] = [];\n\n  /**\n   * Internal valid files.\n   * @internal\n   */\n  @state()\n  accessor _validFiles: Object[] = [];\n\n  /**\n   * Internal notification message flag.\n   * @internal\n   */\n  @state()\n  accessor _showValidationNotification = false;\n\n  /**\n   * Queries the <input> DOM element.\n   * @ignore\n   */\n  @query('input')\n  accessor _inputEl!: HTMLInputElement;\n\n  override willUpdate(changedProps: any) {\n    if (changedProps.has('textStrings')) {\n      this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n    }\n    if (changedProps.has('validFiles')) {\n      this._validFiles = this.validFiles;\n      this._setFormValue();\n    }\n    if (changedProps.has('invalidFiles')) {\n      this._invalidFiles = this.invalidFiles;\n    }\n  }\n\n  override updated(changedProps: any) {\n    if (changedProps.has('validFiles')) {\n      this._validFiles = this.validFiles;\n      this._setFormValue();\n    }\n    if (changedProps.has('invalidFiles')) {\n      this._invalidFiles = this.invalidFiles;\n    }\n  }\n\n  override render() {\n    const dragDropContainerClasses = {\n      'drag-drop-container': true,\n      dragging: this._dragging,\n      disabled: this.disabled,\n    };\n    return html`\n      <div class=\"file-uploader-container\">\n        <!-- Drag and drop container -->\n        <div class=\"drag-drop-container-wrapper\">\n          <div\n            class=${classMap(dragDropContainerClasses)}\n            @dragover=\"${this.handleDragOver}\"\n            @dragleave=\"${() => (this._dragging = false)}\"\n            @drop=\"${this.handleDrop}\"\n          >\n            <div class=\"uploader-status-icon\">\n              <span>${unsafeSVG(uploadIcon)}</span>\n            </div>\n            <p class=\"drag-drop-text\">${this._textStrings.dragAndDropText}</p>\n            <p class=\"or-text\">${this._textStrings.separatorText}</p>\n            <kyn-button\n              kind=\"outline\"\n              size=\"small\"\n              ?disabled=${this.disabled}\n              @on-click=\"${this._triggerFileSelect}\"\n            >\n              ${this._textStrings.buttonText}\n            </kyn-button>\n            <input\n              class=\"file-input\"\n              type=\"file\"\n              @change=\"${(e: any) => this.handleFileChange(e)}\"\n              id=\"fileInput\"\n              accept=${this.accept.length > 0 ? this.accept.join(',') : '*/*'}\n              ?multiple=${this.multiple}\n            />\n          </div>\n          <div\n            class=${classMap({\n              'upload-constraints': true,\n              disabled: this.disabled,\n            })}\n          >\n            <p>\n              ${this._textStrings.maxFileSizeText}\n              <strong>${this._getFilesSize(this.maxFileSize)}</strong>.\n              ${this._textStrings.supportedFileTypeText}\n              <strong>${this._textStrings.fileTypeDisplyText}</strong>.\n            </p>\n          </div>\n        </div>\n        <!-- File list -->\n        <div\n          class=${classMap({\n            'file-info-container': true,\n            'border-and-padding':\n              this._validFiles.length > 0 || this._invalidFiles.length > 0,\n          })}\n        >\n          <!-- Invalid files -->\n          ${this._invalidFiles.length > 0\n            ? html`\n                <kyn-file-uploader-list-container\n                  id=\"invalidFiles\"\n                  .titleText=${this._textStrings.invalidFileListLabel}\n                >\n                  ${this._invalidFiles.length > 0\n                    ? this._invalidFiles.map(\n                        (file: any) => html`\n                          <div class=\"file-uploader-item-container\">\n                            <span class=\"error-filled-icon\"\n                              >${unsafeSVG(errorFilledIcon)}</span\n                            >\n                            <div class=\"file-details-container\">\n                              <p class=\"file-name\">${file.file.name}</p>\n                              <div class=\"error-info-container\">\n                                <p class=\"file-size\">\n                                  ${this._getFilesSize(file.file.size)}\n                                </p>\n                                ·\n                                <p class=\"file-size error\">\n                                  ${file.customErrorMsg &&\n                                  file.customErrorMsg !== ''\n                                    ? file.customErrorMsg\n                                    : file.status === 'unknownError'\n                                    ? this._textStrings.customFileErrorText\n                                    : file.status === 'typeError'\n                                    ? this._textStrings.fileTypeErrorText\n                                    : this._textStrings.fileSizeErrorText}\n                                </p>\n                              </div>\n                            </div>\n                          </div>\n                        `\n                      )\n                    : ''}\n                  <kyn-button\n                    slot=\"action-button\"\n                    kind=\"ghost\"\n                    size=\"small\"\n                    @on-click=${this._clearInvalidFiles}\n                  >\n                    ${this._textStrings.clearListText}\n                  </kyn-button>\n                </kyn-file-uploader-list-container>\n              `\n            : ''}\n          <!-- Valid files -->\n          ${this._validFiles.length > 0\n            ? html`\n                <kyn-file-uploader-list-container\n                  .titleText=${this._textStrings.validFileListLabel}\n                  id=\"validFiles\"\n                >\n                  ${this._validFiles.length > 0\n                    ? this._validFiles.map(\n                        (file: any) => html`\n                          <div class=\"file-uploader-item-container\">\n                            <div class=\"file-details-container\">\n                              <p class=\"file-name success\">${file.file.name}</p>\n                              <p class=\"file-size\">\n                                ${this._getFilesSize(file.file.size)}\n                              </p>\n                            </div>\n                            <div class=\"actions\">\n                              ${this._displayActions(file)}\n                            </div>\n                          </div>\n                        `\n                      )\n                    : ''}\n                </kyn-file-uploader-list-container>\n              `\n            : ''}\n        </div>\n        ${this._showValidationNotification\n          ? html` <kyn-notification\n              .type=${'inline'}\n              .tagStatus=${'error'}\n              .notificationTitle=${this._textStrings\n                .validationNotificationTitle}\n              @on-close=${() => {\n                this._showValidationNotification = false;\n              }}\n            >\n              ${this._textStrings.validationNotificationMessage}\n            </kyn-notification>`\n          : ''}\n        <div class=\"upload-status-container\">\n          <slot name=\"upload-status\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  handleDragOver(event: DragEvent) {\n    event.preventDefault();\n    event.stopPropagation();\n    this._dragging = true;\n  }\n\n  handleDrop(event: DragEvent) {\n    event.preventDefault();\n    event.stopPropagation();\n    this._dragging = false;\n    this._showValidationNotification = false;\n    if (this.disabled) return;\n\n    if (event.dataTransfer?.files) {\n      const files = Array.from(event.dataTransfer.files);\n\n      this._validateFiles(files);\n      this._validate(true, false);\n      this._setFormValue();\n      this._emitFileUploadEvent();\n    }\n  }\n\n  private _triggerFileSelect() {\n    const fileInputElement = this.shadowRoot?.querySelector(\n      '#fileInput'\n    ) as HTMLInputElement;\n    fileInputElement?.click();\n  }\n\n  handleFileChange(event: Event) {\n    this._showValidationNotification = false;\n    const target = event.target as HTMLInputElement;\n    if (target.files) {\n      const files = Array.from(target.files);\n\n      this._validateFiles(files);\n      this._validate(true, false);\n      this._setFormValue();\n      this._emitFileUploadEvent();\n    }\n  }\n\n  private _getFilesSize(bytes: number) {\n    if (bytes < 1024) {\n      return `${bytes} Bytes`;\n    } else if (bytes < 1024 * 1024) {\n      const kb = bytes / 1024;\n      return kb % 1 === 0 ? `${Math.floor(kb)} KB` : `${kb.toFixed(2)} KB`;\n    } else if (bytes < 1024 * 1024 * 1024) {\n      const mb = bytes / (1024 * 1024);\n      return mb % 1 === 0 ? `${Math.floor(mb)} MB` : `${mb.toFixed(2)} MB`;\n    } else {\n      const gb = bytes / (1024 * 1024 * 1024);\n      return gb % 1 === 0 ? `${Math.floor(gb)} GB` : `${gb.toFixed(2)} GB`;\n    }\n  }\n\n  private _clearInvalidFiles() {\n    this._invalidFiles = [];\n    this._emitFileUploadEvent();\n  }\n\n  // Validate files\n  private _validateFiles(files: File[]) {\n    // Check if multiple files are uploaded\n    if (!this.multiple && files.length > 1) {\n      this._showValidationNotification = true;\n      return;\n    }\n\n    const validFiles: Object[] = this.multiple ? [...this._validFiles] : [];\n    const invalidFiles: Object[] = this.multiple ? [...this._invalidFiles] : [];\n\n    files.forEach((file) => {\n      const fileName = file.name;\n      const fileType = file.type;\n      const fileSize = file.size;\n\n      // Check if the file type is valid\n      const imageWildcard = this.accept.includes('image/*');\n      const audioWildcard = this.accept.includes('audio/*');\n      const videoWildcard = this.accept.includes('video/*');\n\n      const fileExtension = (fileName.split('.').pop() || '').replace(/^/, '.');\n      this.accept.includes(fileType);\n\n      const isValidType =\n        this.accept.length === 0 ||\n        (imageWildcard && fileType.includes('image')) ||\n        (audioWildcard && fileType.includes('audio')) ||\n        (videoWildcard && fileType.includes('video')) ||\n        this.accept.includes(fileType) ||\n        this.accept.includes(fileExtension);\n\n      // Check if the file size is valid\n      const isValidSize = fileSize <= this.maxFileSize;\n\n      const fileAlreadyValid = validFiles.some(\n        (existingFile: any) => existingFile.file.name === file.name\n      );\n      const fileAlreadyInvalid = invalidFiles.some(\n        (existingFile: any) => existingFile.file.name === file.name\n      );\n\n      if (isValidType && isValidSize && !fileAlreadyValid) {\n        validFiles.push({\n          file,\n          id: fileName,\n          status: 'new',\n        });\n      } else if ((!isValidType || !isValidSize) && !fileAlreadyInvalid) {\n        let errorMsg = '';\n        if (!isValidType) {\n          errorMsg = 'typeError';\n        } else if (!isValidSize) {\n          errorMsg = 'sizeError';\n        } else {\n          errorMsg = 'unknownError';\n        }\n        invalidFiles.push({\n          file,\n          id: fileName,\n          status: errorMsg,\n        });\n      }\n    });\n\n    // Update valid files\n    if (validFiles.length > 0 || !this.multiple) {\n      this._validFiles = validFiles;\n    }\n\n    // Update invalid files\n    if (invalidFiles.length > 0 || !this.multiple) {\n      this._invalidFiles = invalidFiles;\n    }\n  }\n\n  private _validate(interacted: Boolean, report: Boolean) {\n    const Validity =\n      this.invalidText !== ''\n        ? { ...this._inputEl.validity, customError: true }\n        : this._inputEl.validity;\n\n    let InternalMsg = '';\n    if (this._invalidFiles.length > 0) {\n      const hasTypeError = this._invalidFiles.some(\n        (file: any) => file.status === 'typeError'\n      );\n      const hasSizeError = this._invalidFiles.some(\n        (file: any) => file.status === 'sizeError'\n      );\n      InternalMsg =\n        hasTypeError && hasSizeError\n          ? 'Invalid file type and Exceeds maximum file size'\n          : hasTypeError\n          ? 'Invalid file type'\n          : 'Exceeds maximum file size';\n    }\n\n    const ValidationMessage =\n      this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n    if (interacted || this.invalidText !== '') {\n      this._internals.setValidity(Validity, ValidationMessage);\n\n      // set internal validation message if value was changed by user input\n      if (interacted) {\n        this._internalValidationMsg = InternalMsg;\n      }\n    }\n\n    if (report) {\n      this._internals.reportValidity();\n    }\n  }\n\n  private _setFormValue() {\n    const formData = new FormData();\n    this._validFiles.forEach((fileObj: any) => {\n      const { file } = fileObj;\n      formData.append(this.name, file);\n    });\n    this._internals.setFormValue(formData);\n  }\n\n  private _displayActions(file: any) {\n    if (file.status === 'uploading') {\n      return html` <kyn-loader-inline></kyn-loader-inline> `;\n    } else if (file.status === 'uploaded') {\n      return html`\n        <span class=\"success-icon\">${unsafeSVG(checkmarkIcon)}</span>\n      `;\n    } else if (file.status === 'error') {\n      return html` <span class=\"error-icon\">${unsafeSVG(errorIcon)}</span> `;\n    } else {\n      return html` <kyn-inline-confirm\n        ?destructive=${true}\n        .anchorText=${this._textStrings.inlineConfirmAnchorText}\n        .confirmText=${this._textStrings.inlineConfirmConfirmText}\n        .cancelText=${this._textStrings.inlineConfirmCancelText}\n        @on-confirm=${() => this._deleteFile(file.id)}\n      >\n        <span>${unsafeSVG(deleteIcon)}</span>\n        <span slot=\"confirmIcon\">${unsafeSVG(deleteIcon)}</span>\n      </kyn-inline-confirm>`;\n    }\n  }\n\n  private _deleteFile(fileId: string) {\n    this._validFiles = this._validFiles.filter(\n      (file: any) => file.id !== fileId\n    );\n    const fileInputElement = this.shadowRoot?.querySelector(\n      '#fileInput'\n    ) as HTMLInputElement;\n    fileInputElement.value = ''; // Clear the file input value\n    this._setFormValue();\n    this._emitFileUploadEvent();\n  }\n\n  private _emitFileUploadEvent() {\n    const event = new CustomEvent('selected-files', {\n      detail: {\n        validFiles: this._validFiles,\n        invalidFiles: this._invalidFiles,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-file-uploader': FileUploader;\n  }\n}\n"],"names":["_defaultTextStrings","dragAndDropText","separatorText","buttonText","maxFileSizeText","supportedFileTypeText","fileTypeDisplyText","invalidFileListLabel","validFileListLabel","clearListText","fileTypeErrorText","fileSizeErrorText","customFileErrorText","inlineConfirmAnchorText","inlineConfirmConfirmText","inlineConfirmCancelText","validationNotificationTitle","validationNotificationMessage","FileUploader","customElement","FormMixin","LitElement","_classThis","_classSuper","accept","__classPrivateFieldGet","this","_FileUploader_accept_accessor_storage","value","__classPrivateFieldSet","multiple","_FileUploader_multiple_accessor_storage","textStrings","_FileUploader_textStrings_accessor_storage","maxFileSize","_FileUploader_maxFileSize_accessor_storage","disabled","_FileUploader_disabled_accessor_storage","validFiles","_FileUploader_validFiles_accessor_storage","invalidFiles","_FileUploader_invalidFiles_accessor_storage","_textStrings","_FileUploader__textStrings_accessor_storage","_dragging","_FileUploader__dragging_accessor_storage","_invalidFiles","_FileUploader__invalidFiles_accessor_storage","_validFiles","_FileUploader__validFiles_accessor_storage","_showValidationNotification","_FileUploader__showValidationNotification_accessor_storage","_inputEl","_FileUploader__inputEl_accessor_storage","willUpdate","changedProps","has","deepmerge","_setFormValue","updated","render","dragDropContainerClasses","dragging","html","classMap","handleDragOver","handleDrop","unsafeSVG","uploadIcon","_triggerFileSelect","e","handleFileChange","length","join","_getFilesSize","map","file","errorFilledIcon","name","size","customErrorMsg","status","_clearInvalidFiles","_displayActions","event","preventDefault","stopPropagation","dataTransfer","_a","files","Array","from","_validateFiles","_validate","_emitFileUploadEvent","fileInputElement","shadowRoot","querySelector","click","target","bytes","kb","Math","floor","toFixed","mb","gb","forEach","fileName","fileType","type","fileSize","imageWildcard","includes","audioWildcard","videoWildcard","fileExtension","split","pop","replace","isValidType","isValidSize","fileAlreadyValid","some","existingFile","fileAlreadyInvalid","push","id","errorMsg","interacted","report","Validity","invalidText","validity","customError","InternalMsg","hasTypeError","hasSizeError","ValidationMessage","_internals","setValidity","_internalValidationMsg","reportValidity","formData","FormData","fileObj","append","setFormValue","checkmarkIcon","errorIcon","_deleteFile","deleteIcon","fileId","filter","CustomEvent","detail","dispatchEvent","set","__runInitializers","_accept_initializers","_accept_extraInitializers","_multiple_initializers","_multiple_extraInitializers","_textStrings_initializers","_textStrings_extraInitializers","_maxFileSize_initializers","_maxFileSize_extraInitializers","_disabled_initializers","_disabled_extraInitializers","_validFiles_initializers","_validFiles_extraInitializers","_invalidFiles_initializers","_invalidFiles_extraInitializers","__textStrings_initializers","__textStrings_extraInitializers","__dragging_initializers","__dragging_extraInitializers","__invalidFiles_initializers","__invalidFiles_extraInitializers","__validFiles_initializers","__validFiles_extraInitializers","__showValidationNotification_initializers","__showValidationNotification_extraInitializers","__inputEl_initializers","_accept_decorators","property","_multiple_decorators","Boolean","_textStrings_decorators","Object","_maxFileSize_decorators","Number","_disabled_decorators","_validFiles_decorators","_invalidFiles_decorators","__textStrings_decorators","state","__dragging_decorators","__invalidFiles_decorators","__validFiles_decorators","__showValidationNotification_decorators","query","__esDecorate","kind","static","private","access","obj","get","metadata","_metadata","__inputEl_decorators","__inputEl_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","FileUploaderScss"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkBA,MAAMA,EAAsB,CAC1BC,gBAAiB,4BACjBC,cAAe,KACfC,WAAY,eACZC,gBAAiB,gBACjBC,sBAAuB,wBACvBC,mBAAoB,gBACpBC,qBAAsB,iCACtBC,mBAAoB,eACpBC,cAAe,aACfC,kBAAmB,oBACnBC,kBAAmB,yBACnBC,oBAAqB,oBACrBC,wBAAyB,SACzBC,yBAA0B,UAC1BC,wBAAyB,SACzBC,4BAA6B,6BAC7BC,8BAA+B,oCASpBC,EAAY,yEADxBC,EAAc,6BACmBC,EAAUC,sKAAlBC,EAAA,cAAQC,EAYhC,UAASC,GAAM,OAAAC,EAAAC,KAAAC,EAAA,IAAA,CAAf,UAASH,CAAMI,GAAAC,EAAAH,KAAAC,EAAAC,EAAA,IAAA,CAMf,YAASE,GAAQ,OAAAL,EAAAC,KAAAK,EAAA,IAAA,CAAjB,YAASD,CAAQF,GAAAC,EAAAH,KAAAK,EAAAH,EAAA,IAAA,CAMjB,eAASI,GAAW,OAAAP,EAAAC,KAAAO,EAAA,IAAA,CAApB,eAASD,CAAWJ,GAAAC,EAAAH,KAAAO,EAAAL,EAAA,IAAA,CAUpB,eAASM,GAAW,OAAAT,EAAAC,KAAAS,EAAA,IAAA,CAApB,eAASD,CAAWN,GAAAC,EAAAH,KAAAS,EAAAP,EAAA,IAAA,CAMpB,YAASQ,GAAQ,OAAAX,EAAAC,KAAAW,EAAA,IAAA,CAAjB,YAASD,CAAQR,GAAAC,EAAAH,KAAAW,EAAAT,EAAA,IAAA,CAMjB,cAASU,GAAU,OAAAb,EAAAC,KAAAa,EAAA,IAAA,CAAnB,cAASD,CAAUV,GAAAC,EAAAH,KAAAa,EAAAX,EAAA,IAAA,CAUnB,gBAASY,GAAY,OAAAf,EAAAC,KAAAe,EAAA,IAAA,CAArB,gBAASD,CAAYZ,GAAAC,EAAAH,KAAAe,EAAAb,EAAA,IAAA,CAYrB,gBAASc,GAAY,OAAAjB,EAAAC,KAAAiB,EAAA,IAAA,CAArB,gBAASD,CAAYd,GAAAC,EAAAH,KAAAiB,EAAAf,EAAA,IAAA,CAOrB,aAASgB,GAAS,OAAAnB,EAAAC,KAAAmB,EAAA,IAAA,CAAlB,aAASD,CAAShB,GAAAC,EAAAH,KAAAmB,EAAAjB,EAAA,IAAA,CAOlB,iBAASkB,GAAa,OAAArB,EAAAC,KAAAqB,EAAA,IAAA,CAAtB,iBAASD,CAAalB,GAAAC,EAAAH,KAAAqB,EAAAnB,EAAA,IAAA,CAOtB,eAASoB,GAAW,OAAAvB,EAAAC,KAAAuB,EAAA,IAAA,CAApB,eAASD,CAAWpB,GAAAC,EAAAH,KAAAuB,EAAArB,EAAA,IAAA,CAOpB,+BAASsB,GAA2B,OAAAzB,EAAAC,KAAAyB,EAAA,IAAA,CAApC,+BAASD,CAA2BtB,GAAAC,EAAAH,KAAAyB,EAAAvB,EAAA,IAAA,CAOpC,YAASwB,GAAQ,OAAA3B,EAAAC,KAAA2B,EAAA,IAAA,CAAjB,YAASD,CAAQxB,GAAAC,EAAAH,KAAA2B,EAAAzB,EAAA,IAAA,CAER,UAAA0B,CAAWC,GACdA,EAAaC,IAAI,iBACnB9B,KAAKgB,aAAee,EAAUzD,EAAqB0B,KAAKM,cAEtDuB,EAAaC,IAAI,gBACnB9B,KAAKsB,YAActB,KAAKY,WACxBZ,KAAKgC,iBAEHH,EAAaC,IAAI,kBACnB9B,KAAKoB,cAAgBpB,KAAKc,cAIrB,OAAAmB,CAAQJ,GACXA,EAAaC,IAAI,gBACnB9B,KAAKsB,YAActB,KAAKY,WACxBZ,KAAKgC,iBAEHH,EAAaC,IAAI,kBACnB9B,KAAKoB,cAAgBpB,KAAKc,cAIrB,MAAAoB,GACP,MAAMC,EAA2B,CAC/B,uBAAuB,EACvBC,SAAUpC,KAAKkB,UACfR,SAAUV,KAAKU,UAEjB,OAAO2B,CAAI;;;;;oBAKKC,EAASH;yBACJnC,KAAKuC;0BACJ,IAAOvC,KAAKkB,WAAY;qBAC7BlB,KAAKwC;;;sBAGJC,EAAUC;;wCAEQ1C,KAAKgB,aAAazC;iCACzByB,KAAKgB,aAAaxC;;;;0BAIzBwB,KAAKU;2BACJV,KAAK2C;;gBAEhB3C,KAAKgB,aAAavC;;;;;yBAKRmE,GAAW5C,KAAK6C,iBAAiBD;;uBAEpC5C,KAAKF,OAAOgD,OAAS,EAAI9C,KAAKF,OAAOiD,KAAK,KAAO;0BAC9C/C,KAAKI;;;;oBAIXkC,EAAS,CACf,sBAAsB,EACtB5B,SAAUV,KAAKU;;;gBAIbV,KAAKgB,aAAatC;wBACVsB,KAAKgD,cAAchD,KAAKQ;gBAChCR,KAAKgB,aAAarC;wBACVqB,KAAKgB,aAAapC;;;;;;kBAMxB0D,EAAS,CACf,uBAAuB,EACvB,qBACEtC,KAAKsB,YAAYwB,OAAS,GAAK9C,KAAKoB,cAAc0B,OAAS;;;YAI7D9C,KAAKoB,cAAc0B,OAAS,EAC1BT,CAAI;;;+BAGarC,KAAKgB,aAAanC;;oBAE7BmB,KAAKoB,cAAc0B,OAAS,EAC1B9C,KAAKoB,cAAc6B,KAChBC,GAAcb,CAAI;;;iCAGVI,EAAUU;;;qDAGUD,EAAKA,KAAKE;;;oCAG3BpD,KAAKgD,cAAcE,EAAKA,KAAKG;;;;oCAI7BH,EAAKI,gBACiB,KAAxBJ,EAAKI,eACDJ,EAAKI,eACW,iBAAhBJ,EAAKK,OACLvD,KAAKgB,aAAa9B,oBACF,cAAhBgE,EAAKK,OACLvD,KAAKgB,aAAahC,kBAClBgB,KAAKgB,aAAa/B;;;;;4BAOlC;;;;;gCAKUe,KAAKwD;;sBAEfxD,KAAKgB,aAAajC;;;gBAI1B;;YAEFiB,KAAKsB,YAAYwB,OAAS,EACxBT,CAAI;;+BAEarC,KAAKgB,aAAalC;;;oBAG7BkB,KAAKsB,YAAYwB,OAAS,EACxB9C,KAAKsB,YAAY2B,KACdC,GAAcb,CAAI;;;6DAGkBa,EAAKA,KAAKE;;kCAErCpD,KAAKgD,cAAcE,EAAKA,KAAKG;;;;gCAI/BrD,KAAKyD,gBAAgBP;;;4BAK/B;;gBAGR;;UAEJlD,KAAKwB,4BACHa,CAAI;sBACM;2BACK;mCACQrC,KAAKgB,aACvB1B;0BACS,KACVU,KAAKwB,6BAA8B,CAAK;;gBAGxCxB,KAAKgB,aAAazB;iCAEtB;;;;;MAQV,cAAAgD,CAAemB,GACbA,EAAMC,iBACND,EAAME,kBACN5D,KAAKkB,WAAY,EAGnB,UAAAsB,CAAWkB,SAKT,GAJAA,EAAMC,iBACND,EAAME,kBACN5D,KAAKkB,WAAY,EACjBlB,KAAKwB,6BAA8B,GAC/BxB,KAAKU,WAEa,UAAlBgD,EAAMG,oBAAY,IAAAC,OAAA,EAAAA,EAAEC,OAAO,CAC7B,MAAMA,EAAQC,MAAMC,KAAKP,EAAMG,aAAaE,OAE5C/D,KAAKkE,eAAeH,GACpB/D,KAAKmE,WAAU,GAAM,GACrBnE,KAAKgC,gBACLhC,KAAKoE,wBAID,kBAAAzB,SACN,MAAM0B,EAAkC,QAAfP,EAAA9D,KAAKsE,kBAAU,IAAAR,OAAA,EAAAA,EAAES,cACxC,cAEFF,SAAAA,EAAkBG,QAGpB,gBAAA3B,CAAiBa,GACf1D,KAAKwB,6BAA8B,EACnC,MAAMiD,EAASf,EAAMe,OACrB,GAAIA,EAAOV,MAAO,CAChB,MAAMA,EAAQC,MAAMC,KAAKQ,EAAOV,OAEhC/D,KAAKkE,eAAeH,GACpB/D,KAAKmE,WAAU,GAAM,GACrBnE,KAAKgC,gBACLhC,KAAKoE,wBAID,aAAApB,CAAc0B,GACpB,GAAIA,EAAQ,KACV,MAAO,GAAGA,UACL,GAAIA,EAAQ,QAAa,CAC9B,MAAMC,EAAKD,EAAQ,KACnB,OAAOC,EAAK,GAAM,EAAI,GAAGC,KAAKC,MAAMF,QAAW,GAAGA,EAAGG,QAAQ,QACxD,GAAIJ,EAAQ,WAAoB,CACrC,MAAMK,EAAKL,UACX,OAAOK,EAAK,GAAM,EAAI,GAAGH,KAAKC,MAAME,QAAW,GAAGA,EAAGD,QAAQ,QACxD,CACL,MAAME,EAAKN,EAAK,WAChB,OAAOM,EAAK,GAAM,EAAI,GAAGJ,KAAKC,MAAMG,QAAW,GAAGA,EAAGF,QAAQ,SAIzD,kBAAAtB,GACNxD,KAAKoB,cAAgB,GACrBpB,KAAKoE,uBAIC,cAAAF,CAAeH,GAErB,IAAK/D,KAAKI,UAAY2D,EAAMjB,OAAS,EAEnC,YADA9C,KAAKwB,6BAA8B,GAIrC,MAAMZ,EAAuBZ,KAAKI,SAAW,IAAIJ,KAAKsB,aAAe,GAC/DR,EAAyBd,KAAKI,SAAW,IAAIJ,KAAKoB,eAAiB,GAEzE2C,EAAMkB,SAAS/B,IACb,MAAMgC,EAAWhC,EAAKE,KAChB+B,EAAWjC,EAAKkC,KAChBC,EAAWnC,EAAKG,KAGhBiC,EAAgBtF,KAAKF,OAAOyF,SAAS,WACrCC,EAAgBxF,KAAKF,OAAOyF,SAAS,WACrCE,EAAgBzF,KAAKF,OAAOyF,SAAS,WAErCG,GAAiBR,EAASS,MAAM,KAAKC,OAAS,IAAIC,QAAQ,IAAK,KACrE7F,KAAKF,OAAOyF,SAASJ,GAErB,MAAMW,EACmB,IAAvB9F,KAAKF,OAAOgD,QACXwC,GAAiBH,EAASI,SAAS,UACnCC,GAAiBL,EAASI,SAAS,UACnCE,GAAiBN,EAASI,SAAS,UACpCvF,KAAKF,OAAOyF,SAASJ,IACrBnF,KAAKF,OAAOyF,SAASG,GAGjBK,EAAcV,GAAYrF,KAAKQ,YAE/BwF,EAAmBpF,EAAWqF,MACjCC,GAAsBA,EAAahD,KAAKE,OAASF,EAAKE,OAEnD+C,EAAqBrF,EAAamF,MACrCC,GAAsBA,EAAahD,KAAKE,OAASF,EAAKE,OAGzD,GAAI0C,GAAeC,IAAgBC,EACjCpF,EAAWwF,KAAK,CACdlD,OACAmD,GAAInB,EACJ3B,OAAQ,aAEL,KAAMuC,GAAgBC,GAAiBI,GAAoB,CAChE,IAAIG,EAAW,GAMbA,EALGR,EAEOC,EAGC,eAFA,YAFA,YAMbjF,EAAasF,KAAK,CAChBlD,OACAmD,GAAInB,EACJ3B,OAAQ+C,SAMV1F,EAAWkC,OAAS,IAAM9C,KAAKI,YACjCJ,KAAKsB,YAAcV,IAIjBE,EAAagC,OAAS,IAAM9C,KAAKI,YACnCJ,KAAKoB,cAAgBN,GAIjB,SAAAqD,CAAUoC,EAAqBC,GACrC,MAAMC,EACiB,KAArBzG,KAAK0G,YACD,IAAK1G,KAAK0B,SAASiF,SAAUC,aAAa,GAC1C5G,KAAK0B,SAASiF,SAEpB,IAAIE,EAAc,GAClB,GAAI7G,KAAKoB,cAAc0B,OAAS,EAAG,CACjC,MAAMgE,EAAe9G,KAAKoB,cAAc6E,MACrC/C,GAA8B,cAAhBA,EAAKK,SAEhBwD,EAAe/G,KAAKoB,cAAc6E,MACrC/C,GAA8B,cAAhBA,EAAKK,SAEtBsD,EACEC,GAAgBC,EACZ,kDACAD,EACA,oBACA,4BAGR,MAAME,EACiB,KAArBhH,KAAK0G,YAAqB1G,KAAK0G,YAAcG,GAE3CN,GAAmC,KAArBvG,KAAK0G,eACrB1G,KAAKiH,WAAWC,YAAYT,EAAUO,GAGlCT,IACFvG,KAAKmH,uBAAyBN,IAI9BL,GACFxG,KAAKiH,WAAWG,iBAIZ,aAAApF,GACN,MAAMqF,EAAW,IAAIC,SACrBtH,KAAKsB,YAAY2D,SAASsC,IACxB,MAAMrE,KAAEA,GAASqE,EACjBF,EAASG,OAAOxH,KAAKoD,KAAMF,EAAK,IAElClD,KAAKiH,WAAWQ,aAAaJ,GAGvB,eAAA5D,CAAgBP,GACtB,MAAoB,cAAhBA,EAAKK,OACAlB,CAAI,4CACc,aAAhBa,EAAKK,OACPlB,CAAI;qCACoBI,EAAUiF;QAEhB,UAAhBxE,EAAKK,OACPlB,CAAI,6BAA6BI,EAAUkF,aAE3CtF,CAAI;wBACM;sBACDrC,KAAKgB,aAAa7B;uBACjBa,KAAKgB,aAAa5B;sBACnBY,KAAKgB,aAAa3B;sBAClB,IAAMW,KAAK4H,YAAY1E,EAAKmD;;gBAElC5D,EAAUoF;mCACSpF,EAAUoF;6BAKnC,WAAAD,CAAYE,SAClB9H,KAAKsB,YAActB,KAAKsB,YAAYyG,QACjC7E,GAAcA,EAAKmD,KAAOyB,KAEW,QAAfhE,EAAA9D,KAAKsE,kBAAU,IAAAR,OAAA,EAAAA,EAAES,cACxC,eAEerE,MAAQ,GACzBF,KAAKgC,gBACLhC,KAAKoE,uBAGC,oBAAAA,GACN,MAAMV,EAAQ,IAAIsE,YAAY,iBAAkB,CAC9CC,OAAQ,CACNrH,WAAYZ,KAAKsB,YACjBR,aAAcd,KAAKoB,iBAGvBpB,KAAKkI,cAAcxE,qCArfZzD,EAAAkI,IAAAnI,KAAAoI,EAAApI,KAAAqI,GAAmB,KAMnBhI,EAAA8H,IAAAnI,MAAAoI,EAAApI,KAAAsI,IAAAF,EAAApI,KAAAuI,IAAW,KAMXhI,EAAA4H,IAAAnI,MAAAoI,EAAApI,KAAAwI,IAAAJ,EAAApI,KAAAyI,GAAcnK,KAUdmC,EAAA0H,IAAAnI,MAAAoI,EAAApI,KAAA0I,IAAAN,EAAApI,KAAA2I,GAAc,WAMdhI,EAAAwH,IAAAnI,MAAAoI,EAAApI,KAAA4I,IAAAR,EAAApI,KAAA6I,IAAW,KAMXhI,EAAAsH,IAAAnI,MAAAoI,EAAApI,KAAA8I,IAAAV,EAAApI,KAAA+I,GAIH,MAMGhI,EAAAoH,IAAAnI,MAAAoI,EAAApI,KAAAgJ,IAAAZ,EAAApI,KAAAiJ,GAKH,MAOGhI,EAAAkH,IAAAnI,MAAAoI,EAAApI,KAAAkJ,IAAAd,EAAApI,KAAAmJ,GAAe7K,KAOf6C,EAAAgH,IAAAnI,MAAAoI,EAAApI,KAAAoJ,IAAAhB,EAAApI,KAAAqJ,IAAY,KAOZhI,EAAA8G,IAAAnI,MAAAoI,EAAApI,KAAAsJ,IAAAlB,EAAApI,KAAAuJ,GAA0B,MAO1BhI,EAAA4G,IAAAnI,MAAAoI,EAAApI,KAAAwJ,IAAApB,EAAApI,KAAAyJ,GAAwB,MAOxBhI,EAAA0G,IAAAnI,MAAAoI,EAAApI,KAAA0J,IAAAtB,EAAApI,KAAA2J,IAA8B,KAO9BhI,EAAAwG,IAAAnI,MAAAoI,EAAApI,KAAA4J,IAAAxB,EAAApI,KAAA6J,QAAA,kWA5FRC,EAAA,CAAAC,EAAS,CAAE3E,KAAMpB,SAMjBgG,EAAA,CAAAD,EAAS,CAAE3E,KAAM6E,WAMjBC,EAAA,CAAAH,EAAS,CAAE3E,KAAM+E,UAUjBC,EAAA,CAAAL,EAAS,CAAE3E,KAAMiF,UAMjBC,EAAA,CAAAP,EAAS,CAAE3E,KAAM6E,WAMjBM,EAAA,CAAAR,EAAS,CAAE3E,KAAMpB,SAUjBwG,EAAA,CAAAT,EAAS,CAAE3E,KAAMpB,SAYjByG,EAAA,CAAAC,KAOAC,EAAA,CAAAD,KAOAE,EAAA,CAAAF,KAOAG,EAAA,CAAAH,KAOAI,EAAA,CAAAJ,QAOAK,EAAM,UA1FPC,EAAApL,EAAA,KAAAkK,EAAA,CAAAmB,KAAA,WAAA7H,KAAA,SAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,WAAAA,EAAAC,IAAAD,GAAAA,EAASvL,OAAMqI,IAAA,CAAAkD,EAAAnL,KAAAmL,EAANvL,OAAMI,CAAA,GAAAqL,SAAAC,GAAAnD,GAAAC,IAMf0C,EAAApL,EAAA,KAAAoK,EAAA,CAAAiB,KAAA,WAAA7H,KAAA,WAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAASjL,SAAQ+H,IAAA,CAAAkD,EAAAnL,KAAAmL,EAARjL,SAAQF,CAAA,GAAAqL,SAAAC,GAAAjD,GAAAC,IAMjBwC,EAAApL,EAAA,KAAAsK,EAAA,CAAAe,KAAA,WAAA7H,KAAA,cAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,gBAAAA,EAAAC,IAAAD,GAAAA,EAAS/K,YAAW6H,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAX/K,YAAWJ,CAAA,GAAAqL,SAAAC,GAAA/C,GAAAC,IAUpBsC,EAAApL,EAAA,KAAAwK,EAAA,CAAAa,KAAA,WAAA7H,KAAA,cAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,gBAAAA,EAAAC,IAAAD,GAAAA,EAAS7K,YAAW2H,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAX7K,YAAWN,CAAA,GAAAqL,SAAAC,GAAA7C,GAAAC,IAMpBoC,EAAApL,EAAA,KAAA0K,EAAA,CAAAW,KAAA,WAAA7H,KAAA,WAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAAS3K,SAAQyH,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAR3K,SAAQR,CAAA,GAAAqL,SAAAC,GAAA3C,GAAAC,IAMjBkC,EAAApL,EAAA,KAAA2K,EAAA,CAAAU,KAAA,WAAA7H,KAAA,aAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,eAAAA,EAAAC,IAAAD,GAAAA,EAASzK,WAAUuH,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAVzK,WAAUV,CAAA,GAAAqL,SAAAC,GAAAzC,GAAAC,IAUnBgC,EAAApL,EAAA,KAAA4K,EAAA,CAAAS,KAAA,WAAA7H,KAAA,eAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,iBAAAA,EAAAC,IAAAD,GAAAA,EAASvK,aAAYqH,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAZvK,aAAYZ,CAAA,GAAAqL,SAAAC,GAAAvC,GAAAC,IAYrB8B,EAAApL,EAAA,KAAA6K,EAAA,CAAAQ,KAAA,WAAA7H,KAAA,eAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,iBAAAA,EAAAC,IAAAD,GAAAA,EAASrK,aAAYmH,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAZrK,aAAYd,CAAA,GAAAqL,SAAAC,GAAArC,GAAAC,IAOrB4B,EAAApL,EAAA,KAAA+K,EAAA,CAAAM,KAAA,WAAA7H,KAAA,YAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,cAAAA,EAAAC,IAAAD,GAAAA,EAASnK,UAASiH,IAAA,CAAAkD,EAAAnL,KAAAmL,EAATnK,UAAShB,CAAA,GAAAqL,SAAAC,GAAAnC,GAAAC,IAOlB0B,EAAApL,EAAA,KAAAgL,EAAA,CAAAK,KAAA,WAAA7H,KAAA,gBAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,kBAAAA,EAAAC,IAAAD,GAAAA,EAASjK,cAAa+G,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAbjK,cAAalB,CAAA,GAAAqL,SAAAC,GAAAjC,GAAAC,IAOtBwB,EAAApL,EAAA,KAAAiL,EAAA,CAAAI,KAAA,WAAA7H,KAAA,cAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,gBAAAA,EAAAC,IAAAD,GAAAA,EAAS/J,YAAW6G,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAX/J,YAAWpB,CAAA,GAAAqL,SAAAC,GAAA/B,GAAAC,IAOpBsB,EAAApL,EAAA,KAAAkL,EAAA,CAAAG,KAAA,WAAA7H,KAAA,8BAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,gCAAAA,EAAAC,IAAAD,GAAAA,EAAS7J,4BAA2B2G,IAAA,CAAAkD,EAAAnL,KAAAmL,EAA3B7J,4BAA2BtB,CAAA,GAAAqL,SAAAC,GAAA7B,GAAAC,IAOpCoB,EAAApL,EAAA,KAAA6L,EAAA,CAAAR,KAAA,WAAA7H,KAAA,WAAA8H,QAAA,EAAAC,SAAA,EAAAC,OAAA,CAAAtJ,IAAAuJ,GAAA,aAAAA,EAAAC,IAAAD,GAAAA,EAAS3J,SAAQyG,IAAA,CAAAkD,EAAAnL,KAAAmL,EAAR3J,SAAQxB,CAAA,GAAAqL,SAAAC,GAAA3B,GAAA6B,IAvGnBV,EAAA,KAAAW,EAAA,CAAAzL,MAAAN,GAAAgM,EAAA,CAAAX,KAAA,QAAA7H,KAAAxD,EAAAwD,KAAAmI,SAAAC,GAAA,KAAAK,iHACkBjM,EAAAkM,OAASC,EAAUC,GADxB5D,EAAAxI,EAAAiM,MAAY"}
+{"version":3,"file":"fileUploader.js","sources":["../../../../src/components/reusable/fileUploader/fileUploader.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { deepmerge } from 'deepmerge-ts';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport uploadIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/upload.svg';\nimport errorFilledIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/error-filled.svg';\nimport deleteIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/20/delete.svg';\nimport checkmarkIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/checkmark.svg';\nimport errorIcon from '@kyndryl-design-system/shidoka-icons/svg/monochrome/24/error.svg';\nimport { FormMixin } from '../../../common/mixins/form-input';\nimport FileUploaderScss from './fileUploader.scss?inline';\nimport './fileUploaderListContainer';\nimport '../button';\nimport '../loaders';\nimport '../inlineConfirm';\nimport '../notification';\n\nconst _defaultTextStrings = {\n  dragAndDropText: 'Drag files here to upload',\n  separatorText: 'or',\n  buttonText: 'Browse files',\n  maxFileSizeText: 'Max file size',\n  supportedFileTypeText: 'Supported file type: ',\n  fileTypeDisplyText: 'Any file type',\n  invalidFileListLabel: 'Some files could not be added:',\n  validFileListLabel: 'Files added:',\n  clearListText: 'Clear list',\n  fileTypeErrorText: 'Invaild file type',\n  fileSizeErrorText: 'Max file size exceeded',\n  customFileErrorText: 'Custom file error',\n  inlineConfirmAnchorText: 'Delete',\n  inlineConfirmConfirmText: 'Confirm',\n  inlineConfirmCancelText: 'Cancel',\n  validationNotificationTitle: 'Multiple files not allowed',\n  validationNotificationMessage: 'Please select only one file.',\n};\n\n/**\n * File Uploader\n * @fires selected-files - Emits the uploaded files.`detail:{ validFiles: Array, invalidFiles: Array }`\n * @slot upload-status - Slot for upload status/notification.\n * @attr {string} [name=''] - The name of the input, used for form submission.\n */\n@customElement('kyn-file-uploader')\nexport class FileUploader extends FormMixin(LitElement) {\n  static override styles = unsafeCSS(FileUploaderScss);\n\n  /** @internal */\n  override value!: FormData;\n\n  /**\n   * Set the file types that the component accepts. By default, it accepts all file types.\n   * @example\n   * ['image/jpeg', 'image/png']\n   * ['image/*']\n   * ['audio/*']\n   * ['application/pdf', 'text/plain']\n   */\n  @property({ type: Array })\n  accessor accept: string[] = [];\n\n  /**\n   * Accept multiple files. Default value is `false`.\n   */\n  @property({ type: Boolean })\n  accessor multiple = false;\n\n  /**\n   * Customizable text strings.\n   */\n  @property({ type: Object })\n  accessor textStrings = _defaultTextStrings;\n\n  /**\n   * Set the maximum file size in bytes. Default value is `1048576` (1MB).\n   * @example\n   * 1048576 // 1MB\n   * 5242880 // 5MB\n   * 1073741824 // 1GB\n   */\n  @property({ type: Number })\n  accessor maxFileSize = 1048576; // 1MB\n\n  /**\n   * Disable the file uploader. Default value is `false`.\n   */\n  @property({ type: Boolean })\n  accessor disabled = false;\n\n  /**\n   * Valid files. This property is used to set the initial or updated state of the valid files.\n   */\n  @property({ type: Array })\n  accessor validFiles: {\n    id: string;\n    file: File;\n    status: 'new' | 'uploading' | 'uploaded' | 'error';\n  }[] = [];\n\n  /**\n   * Invalid files. This property is used to set the initial state of the invalid files.\n   */\n  @property({ type: Array })\n  accessor invalidFiles: {\n    id: string;\n    file: File;\n    status: 'sizeError' | 'typeError' | 'unknownError';\n    customErrorMsg?: string;\n  }[] = [];\n\n  /**\n   * Internal text strings.\n   * @internal\n   */\n  @state()\n  accessor _textStrings = _defaultTextStrings;\n\n  /**\n   * Internal dragging state.\n   * @internal\n   */\n  @state()\n  accessor _dragging = false;\n\n  /**\n   * Internal invalid files.\n   * @internal\n   */\n  @state()\n  accessor _invalidFiles: Object[] = [];\n\n  /**\n   * Internal valid files.\n   * @internal\n   */\n  @state()\n  accessor _validFiles: Object[] = [];\n\n  /**\n   * Internal notification message flag.\n   * @internal\n   */\n  @state()\n  accessor _showValidationNotification = false;\n\n  /**\n   * Queries the <input> DOM element.\n   * @ignore\n   */\n  @query('input')\n  accessor _inputEl!: HTMLInputElement;\n\n  override willUpdate(changedProps: any) {\n    if (changedProps.has('textStrings')) {\n      this._textStrings = deepmerge(_defaultTextStrings, this.textStrings);\n    }\n\n    if (changedProps.has('validFiles')) {\n      this._validFiles = this.validFiles;\n      this._setFormValue();\n    }\n\n    if (changedProps.has('invalidFiles')) {\n      this._invalidFiles = this.invalidFiles;\n    }\n  }\n\n  override render() {\n    const dragDropContainerClasses = {\n      'drag-drop-container': true,\n      dragging: this._dragging,\n      disabled: this.disabled,\n    };\n    return html`\n      <div class=\"file-uploader-container\">\n        <!-- Drag and drop container -->\n        <div class=\"drag-drop-container-wrapper\">\n          <div\n            class=${classMap(dragDropContainerClasses)}\n            @dragover=\"${this.handleDragOver}\"\n            @dragleave=\"${() => (this._dragging = false)}\"\n            @drop=\"${this.handleDrop}\"\n          >\n            <div class=\"uploader-status-icon\">\n              <span>${unsafeSVG(uploadIcon)}</span>\n            </div>\n            <p class=\"drag-drop-text\">${this._textStrings.dragAndDropText}</p>\n            <p class=\"or-text\">${this._textStrings.separatorText}</p>\n            <kyn-button\n              kind=\"outline\"\n              size=\"small\"\n              ?disabled=${this.disabled}\n              @on-click=\"${this._triggerFileSelect}\"\n            >\n              ${this._textStrings.buttonText}\n            </kyn-button>\n            <input\n              class=\"file-input\"\n              type=\"file\"\n              @change=\"${(e: any) => this.handleFileChange(e)}\"\n              id=\"fileInput\"\n              accept=${this.accept.length > 0 ? this.accept.join(',') : '*/*'}\n              ?multiple=${this.multiple}\n            />\n          </div>\n          <div\n            class=${classMap({\n              'upload-constraints': true,\n              disabled: this.disabled,\n            })}\n          >\n            <p>\n              ${this._textStrings.maxFileSizeText}\n              <strong>${this._getFilesSize(this.maxFileSize)}</strong>.\n              ${this._textStrings.supportedFileTypeText}\n              <strong>${this._textStrings.fileTypeDisplyText}</strong>.\n            </p>\n          </div>\n        </div>\n        <!-- File list -->\n        <div\n          class=${classMap({\n            'file-info-container': true,\n            'border-and-padding':\n              this._validFiles.length > 0 || this._invalidFiles.length > 0,\n          })}\n        >\n          <!-- Invalid files -->\n          ${this._invalidFiles.length > 0\n            ? html`\n                <kyn-file-uploader-list-container\n                  id=\"invalidFiles\"\n                  .titleText=${this._textStrings.invalidFileListLabel}\n                >\n                  ${this._invalidFiles.length > 0\n                    ? this._invalidFiles.map(\n                        (file: any) => html`\n                          <div class=\"file-uploader-item-container\">\n                            <span class=\"error-filled-icon\"\n                              >${unsafeSVG(errorFilledIcon)}</span\n                            >\n                            <div class=\"file-details-container\">\n                              <p class=\"file-name\">${file.file.name}</p>\n                              <div class=\"error-info-container\">\n                                <p class=\"file-size\">\n                                  ${this._getFilesSize(file.file.size)}\n                                </p>\n                                ·\n                                <p class=\"file-size error\">\n                                  ${file.customErrorMsg &&\n                                  file.customErrorMsg !== ''\n                                    ? file.customErrorMsg\n                                    : file.status === 'unknownError'\n                                    ? this._textStrings.customFileErrorText\n                                    : file.status === 'typeError'\n                                    ? this._textStrings.fileTypeErrorText\n                                    : this._textStrings.fileSizeErrorText}\n                                </p>\n                              </div>\n                            </div>\n                          </div>\n                        `\n                      )\n                    : ''}\n                  <kyn-button\n                    slot=\"action-button\"\n                    kind=\"ghost\"\n                    size=\"small\"\n                    @on-click=${this._clearInvalidFiles}\n                  >\n                    ${this._textStrings.clearListText}\n                  </kyn-button>\n                </kyn-file-uploader-list-container>\n              `\n            : ''}\n          <!-- Valid files -->\n          ${this._validFiles.length > 0\n            ? html`\n                <kyn-file-uploader-list-container\n                  .titleText=${this._textStrings.validFileListLabel}\n                  id=\"validFiles\"\n                >\n                  ${this._validFiles.length > 0\n                    ? this._validFiles.map(\n                        (file: any) => html`\n                          <div class=\"file-uploader-item-container\">\n                            <div class=\"file-details-container\">\n                              <p class=\"file-name success\">${file.file.name}</p>\n                              <p class=\"file-size\">\n                                ${this._getFilesSize(file.file.size)}\n                              </p>\n                            </div>\n                            <div class=\"actions\">\n                              ${this._displayActions(file)}\n                            </div>\n                          </div>\n                        `\n                      )\n                    : ''}\n                </kyn-file-uploader-list-container>\n              `\n            : ''}\n        </div>\n        ${this._showValidationNotification\n          ? html` <kyn-notification\n              .type=${'inline'}\n              .tagStatus=${'error'}\n              .notificationTitle=${this._textStrings\n                .validationNotificationTitle}\n              @on-close=${() => {\n                this._showValidationNotification = false;\n              }}\n            >\n              ${this._textStrings.validationNotificationMessage}\n            </kyn-notification>`\n          : ''}\n        <div class=\"upload-status-container\">\n          <slot name=\"upload-status\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  handleDragOver(event: DragEvent) {\n    event.preventDefault();\n    event.stopPropagation();\n    this._dragging = true;\n  }\n\n  handleDrop(event: DragEvent) {\n    event.preventDefault();\n    event.stopPropagation();\n    this._dragging = false;\n    this._showValidationNotification = false;\n    if (this.disabled) return;\n\n    if (event.dataTransfer?.files) {\n      const files = Array.from(event.dataTransfer.files);\n\n      this._validateFiles(files);\n      this._validate(true, false);\n      this._setFormValue();\n      this._emitFileUploadEvent();\n    }\n  }\n\n  private _triggerFileSelect() {\n    const fileInputElement = this.shadowRoot?.querySelector(\n      '#fileInput'\n    ) as HTMLInputElement;\n    fileInputElement?.click();\n  }\n\n  handleFileChange(event: Event) {\n    this._showValidationNotification = false;\n    const target = event.target as HTMLInputElement;\n    if (target.files) {\n      const files = Array.from(target.files);\n\n      this._validateFiles(files);\n      this._validate(true, false);\n      this._setFormValue();\n      this._emitFileUploadEvent();\n    }\n  }\n\n  private _getFilesSize(bytes: number) {\n    if (bytes < 1024) {\n      return `${bytes} Bytes`;\n    } else if (bytes < 1024 * 1024) {\n      const kb = bytes / 1024;\n      return kb % 1 === 0 ? `${Math.floor(kb)} KB` : `${kb.toFixed(2)} KB`;\n    } else if (bytes < 1024 * 1024 * 1024) {\n      const mb = bytes / (1024 * 1024);\n      return mb % 1 === 0 ? `${Math.floor(mb)} MB` : `${mb.toFixed(2)} MB`;\n    } else {\n      const gb = bytes / (1024 * 1024 * 1024);\n      return gb % 1 === 0 ? `${Math.floor(gb)} GB` : `${gb.toFixed(2)} GB`;\n    }\n  }\n\n  private _clearInvalidFiles() {\n    this._invalidFiles = [];\n    this._emitFileUploadEvent();\n  }\n\n  // Validate files\n  private _validateFiles(files: File[]) {\n    // Check if multiple files are uploaded\n    if (!this.multiple && files.length > 1) {\n      this._showValidationNotification = true;\n      return;\n    }\n\n    const validFiles: Object[] = this.multiple ? [...this._validFiles] : [];\n    const invalidFiles: Object[] = this.multiple ? [...this._invalidFiles] : [];\n\n    files.forEach((file) => {\n      const fileName = file.name;\n      const fileType = file.type;\n      const fileSize = file.size;\n\n      // Check if the file type is valid\n      const imageWildcard = this.accept.includes('image/*');\n      const audioWildcard = this.accept.includes('audio/*');\n      const videoWildcard = this.accept.includes('video/*');\n\n      const fileExtension = (fileName.split('.').pop() || '').replace(/^/, '.');\n      this.accept.includes(fileType);\n\n      const isValidType =\n        this.accept.length === 0 ||\n        (imageWildcard && fileType.includes('image')) ||\n        (audioWildcard && fileType.includes('audio')) ||\n        (videoWildcard && fileType.includes('video')) ||\n        this.accept.includes(fileType) ||\n        this.accept.includes(fileExtension);\n\n      // Check if the file size is valid\n      const isValidSize = fileSize <= this.maxFileSize;\n\n      const fileAlreadyValid = validFiles.some(\n        (existingFile: any) => existingFile.file.name === file.name\n      );\n      const fileAlreadyInvalid = invalidFiles.some(\n        (existingFile: any) => existingFile.file.name === file.name\n      );\n\n      if (isValidType && isValidSize && !fileAlreadyValid) {\n        validFiles.push({\n          file,\n          id: fileName,\n          status: 'new',\n        });\n      } else if ((!isValidType || !isValidSize) && !fileAlreadyInvalid) {\n        let errorMsg = '';\n        if (!isValidType) {\n          errorMsg = 'typeError';\n        } else if (!isValidSize) {\n          errorMsg = 'sizeError';\n        } else {\n          errorMsg = 'unknownError';\n        }\n        invalidFiles.push({\n          file,\n          id: fileName,\n          status: errorMsg,\n        });\n      }\n    });\n\n    // Update valid files\n    if (validFiles.length > 0 || !this.multiple) {\n      this._validFiles = validFiles;\n    }\n\n    // Update invalid files\n    if (invalidFiles.length > 0 || !this.multiple) {\n      this._invalidFiles = invalidFiles;\n    }\n  }\n\n  private _validate(interacted: Boolean, report: Boolean) {\n    const Validity =\n      this.invalidText !== ''\n        ? { ...this._inputEl.validity, customError: true }\n        : this._inputEl.validity;\n\n    let InternalMsg = '';\n    if (this._invalidFiles.length > 0) {\n      const hasTypeError = this._invalidFiles.some(\n        (file: any) => file.status === 'typeError'\n      );\n      const hasSizeError = this._invalidFiles.some(\n        (file: any) => file.status === 'sizeError'\n      );\n      InternalMsg =\n        hasTypeError && hasSizeError\n          ? 'Invalid file type and Exceeds maximum file size'\n          : hasTypeError\n          ? 'Invalid file type'\n          : 'Exceeds maximum file size';\n    }\n\n    const ValidationMessage =\n      this.invalidText !== '' ? this.invalidText : InternalMsg;\n\n    if (interacted || this.invalidText !== '') {\n      this._internals.setValidity(Validity, ValidationMessage);\n\n      // set internal validation message if value was changed by user input\n      if (interacted) {\n        this._internalValidationMsg = InternalMsg;\n      }\n    }\n\n    if (report) {\n      this._internals.reportValidity();\n    }\n  }\n\n  private _setFormValue() {\n    const formData = new FormData();\n    this._validFiles.forEach((fileObj: any) => {\n      const { file } = fileObj;\n      formData.append(this.name, file);\n    });\n\n    this.value = formData;\n  }\n\n  private _displayActions(file: any) {\n    if (file.status === 'uploading') {\n      return html` <kyn-loader-inline></kyn-loader-inline> `;\n    } else if (file.status === 'uploaded') {\n      return html`\n        <span class=\"success-icon\">${unsafeSVG(checkmarkIcon)}</span>\n      `;\n    } else if (file.status === 'error') {\n      return html` <span class=\"error-icon\">${unsafeSVG(errorIcon)}</span> `;\n    } else {\n      return html` <kyn-inline-confirm\n        ?destructive=${true}\n        .anchorText=${this._textStrings.inlineConfirmAnchorText}\n        .confirmText=${this._textStrings.inlineConfirmConfirmText}\n        .cancelText=${this._textStrings.inlineConfirmCancelText}\n        @on-confirm=${() => this._deleteFile(file.id)}\n      >\n        <span>${unsafeSVG(deleteIcon)}</span>\n        <span slot=\"confirmIcon\">${unsafeSVG(deleteIcon)}</span>\n      </kyn-inline-confirm>`;\n    }\n  }\n\n  private _deleteFile(fileId: string) {\n    this._validFiles = this._validFiles.filter(\n      (file: any) => file.id !== fileId\n    );\n    const fileInputElement = this.shadowRoot?.querySelector(\n      '#fileInput'\n    ) as HTMLInputElement;\n    fileInputElement.value = ''; // Clear the file input value\n    this._setFormValue();\n    this._emitFileUploadEvent();\n  }\n\n  private _emitFileUploadEvent() {\n    const event = new CustomEvent('selected-files', {\n      detail: {\n        validFiles: this._validFiles,\n        invalidFiles: this._invalidFiles,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kyn-file-uploader': FileUploader;\n  }\n}\n"],"names":["_defaultTextStrings","dragAndDropText","separatorText","buttonText","maxFileSizeText","supportedFileTypeText","fileTypeDisplyText","invalidFileListLabel","validFileListLabel","clearListText","fileTypeErrorText","fileSizeErrorText","customFileErrorText","inlineConfirmAnchorText","inlineConfirmConfirmText","inlineConfirmCancelText","validationNotificationTitle","validationNotificationMessage","FileUploader","customElement","FormMixin","LitElement","_classThis","_classSuper","accept","__classPrivateFieldGet","this","_FileUploader_accept_accessor_storage","value","__classPrivateFieldSet","multiple","_FileUploader_multiple_accessor_storage","textStrings","_FileUploader_textStrings_accessor_storage","maxFileSize","_FileUploader_maxFileSize_accessor_storage","disabled","_FileUploader_disabled_accessor_storage","validFiles","_FileUploader_validFiles_accessor_storage","invalidFiles","_FileUploader_invalidFiles_accessor_storage","_textStrings","_FileUploader__textStrings_accessor_storage","_dragging","_FileUploader__dragging_accessor_storage","_invalidFiles","_FileUploader__invalidFiles_accessor_storage","_validFiles","_FileUploader__validFiles_accessor_storage","_showValidationNotification","_FileUploader__showValidationNotification_accessor_storage","_inputEl","_FileUploader__inputEl_accessor_storage","willUpdate","changedProps","has","deepmerge","_setFormValue","render","dragDropContainerClasses","dragging","html","classMap","handleDragOver","handleDrop","unsafeSVG","uploadIcon","_triggerFileSelect","e","handleFileChange","length","join","_getFilesSize","map","file","errorFilledIcon","name","size","customErrorMsg","status","_clearInvalidFiles","_displayActions","event","preventDefault","stopPropagation","dataTransfer","_a","files","Array","from","_validateFiles","_validate","_emitFileUploadEvent","fileInputElement","shadowRoot","querySelector","click","target","bytes","kb","Math","floor","toFixed","mb","gb","forEach","fileName","fileType","type","fileSize","imageWildcard","includes","audioWildcard","videoWildcard","fileExtension","split","pop","replace","isValidType","isValidSize","fileAlreadyValid","some","existingFile","fileAlreadyInvalid","push","id","errorMsg","interacted","report","Validity","invalidText","validity","customError","InternalMsg","hasTypeError","hasSizeError","ValidationMessage","_internals","setValidity","_internalValidationMsg","reportValidity","formData","FormData","fileObj","append","checkmarkIcon","errorIcon","_deleteFile","deleteIcon","fileId","filter","CustomEvent","detail","dispatchEvent","set","__runInitializers","_accept_initializers","_accept_extraInitializers","_multiple_initializers","_multiple_extraInitializers","_textStrings_initializers","_textStrings_extraInitializers","_maxFileSize_initializers","_maxFileSize_extraInitializers","_disabled_initializers","_disabled_extraInitializers","_validFiles_initializers","_validFiles_extraInitializers","_invalidFiles_initializers","_invalidFiles_extraInitializers","__textStrings_initializers","__textStrings_extraInitializers","__dragging_initializers","__dragging_extraInitializers","__invalidFiles_initializers","__invalidFiles_extraInitializers","__validFiles_initializers","__validFiles_extraInitializers","__showValidationNotification_initializers","__showValidationNotification_extraInitializers","__inputEl_initializers","_accept_decorators","property","_multiple_decorators","Boolean","_textStrings_decorators","Object","_maxFileSize_decorators","Number","_disabled_decorators","_validFiles_decorators","_invalidFiles_decorators","__textStrings_decorators","state","__dragging_decorators","__invalidFiles_decorators","__validFiles_decorators","__showValidationNotification_decorators","query","__esDecorate","kind","static","private","access","obj","get","metadata","_metadata","__inputEl_decorators","__inputEl_extraInitializers","_classDescriptor","_classDecorators","_classExtraInitializers","styles","unsafeCSS","FileUploaderScss"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyndryl-design-system/shidoka-applications",
-  "version": "2.53.1",
+  "version": "2.53.2",
   "description": "Shidoka Web Components for Applications",
   "license": "MIT",
   "main": "index.js",