ids-enterprise-wc 1.4.2 → 1.5.1

package/chunks/{ids-chunk-FYH3C73J.js → ids-chunk-27FXL3K6.js}

@@ -1,4 +1,4 @@
-import{a as o,b as s}from"./ids-chunk-XE4WFW5M.js";import{a as l}from"./ids-chunk-KBS65QZP.js";import{a as e}from"./ids-chunk-Y32WUP63.js";var r=`/* Ids Scroll Container */
+import{a as o,b as s}from"./ids-chunk-XE4WFW5M.js";import{a as l}from"./ids-chunk-W3LDHTW6.js";import{a as e}from"./ids-chunk-ZMMCFAAI.js";var r=`/* Ids Scroll Container */
 :host {
   display: flex;
   flex-flow: column;

package/chunks/ids-chunk-2DOQHUSX.js

@@ -0,0 +1,59 @@
+import{a as k}from"./ids-chunk-U4K5B3VN.js";import{f as E}from"./ids-chunk-ZUHWNQKP.js";import{a as w}from"./ids-chunk-XE4WFW5M.js";import{a as T}from"./ids-chunk-W3LDHTW6.js";import{a as I,b,d as y,f as g}from"./ids-chunk-ZMMCFAAI.js";var o,$,A,H,L,G,u=class extends k(T){constructor(){super({noShadowRoot:!0});y(this,o);b(this,"rootNode");b(this,"headerCheckbox");b(this,"isHeaderExpanderCollapsed",!1);this.state={headerMenuData:null}}connectedCallback(){super.connectedCallback(),g(this,o,$).call(this)}get dataGrid(){return this.rootNode||(this.rootNode=this.getRootNode()),this.rootNode.host}get expanderIcons(){return[...this.querySelectorAll("ids-icon.header-expander")]}setIsHeaderExpanderCollapsed(){let t=this.dataGrid?.rows?.filter(a=>a?.hasAttribute("aria-expanded"))||[],e=t.filter(a=>a?.getAttribute("aria-expanded")==="false");t.length&&t.length===e.length&&(this.isHeaderExpanderCollapsed=!0)}openExpanderIcons(){this.isHeaderExpanderCollapsed=!1,this.expanderIcons?.forEach(t=>{t.icon="plusminus-folder-open"})}closeExpanderIcons(){this.isHeaderExpanderCollapsed=!0,this.expanderIcons?.forEach(t=>{t.icon="plusminus-folder-closed"})}setHeaderCheckbox(){if(!this.dataGrid?.rowSelection||this.dataGrid?.rowSelection==="single"||!this.headerCheckbox)return;let t=this.dataGrid?.selectedRows.length,e=this.dataGrid?.data.length;if(t===0){this.headerCheckbox.classList.remove("indeterminate"),this.headerCheckbox.classList.remove("checked"),this.headerCheckbox.setAttribute("aria-checked","false");return}if(t===e){this.headerCheckbox.classList.remove("indeterminate"),this.headerCheckbox.classList.add("checked"),this.headerCheckbox.setAttribute("aria-checked","true");return}t!==e&&(this.headerCheckbox.classList.add("indeterminate"),this.headerCheckbox.setAttribute("aria-checked","mixed"))}setSortState(t,e){let a=[...this.querySelectorAll(".is-sortable")].map(d=>d.closest(".ids-data-grid-header-cell"));a.forEach(d=>d?.removeAttribute("aria-sort"));let s=this.querySelector(`[column-id="${t}"]`);s&&a.includes(s)&&s.setAttribute("aria-sort",e?"ascending":"descending")}resetSortStates(){this.querySelectorAll(".ids-data-grid-header-cell").forEach(t=>t.removeAttribute("aria-sort"))}setFilterRow(){return this?.querySelectorAll(".ids-data-grid-header-cell-filter-wrapper")?.forEach(e=>e?.classList?.[this.dataGrid?.filterable?"remove":"add"]("hidden")),this.dataGrid?.triggerEvent(this.dataGrid?.filterable?"filterrowopened":"filterrowclosed",this.dataGrid,{detail:{elem:this,filterable:this.dataGrid?.filterable}}),this}static template(t){let e=`<ids-data-grid-header class="ids-data-grid-header" role="rowgroup" part="header">
+      <ids-data-grid-row class="ids-data-grid-row" role="row">
+        ${t.visibleColumns.map((a,s)=>`${this.headerCellTemplate(t,a,s)}`).join("")}
+      </ids-data-grid-row>
+    </ids-data-grid-header>`;return this.columnGroupsTemplate(t)+e}static headerCellTemplate(t,e,a){let s=`
+      <span class="ids-data-grid-checkbox-container">
+        <span
+          role="checkbox"
+          aria-checked="false"
+          aria-label="${e.name}"
+          class="ids-data-grid-checkbox"
+        >
+        </span>
+      </span>
+    `,d=t.rowHeight==="xxs"?'size="small"':"",l=`
+      <span class="sort-indicator">
+        <ids-icon icon="dropdown" ${d}></ids-icon>
+        <ids-icon icon="dropdown" ${d}></ids-icon>
+      </span>
+    `,r='<ids-icon class="header-expander" icon="plusminus-folder-closed"></ids-icon>',i='<span class="resizer"></span>',n='<div class="reorderer"><ids-icon icon="drag" size="medium"></ids-icon></div>',c=["expander","tree"].includes(e.formatter?.name??""),v=e?.showHeaderExpander||c?r:"",h=e.id!=="selectionRadio"&&e.id==="selectionCheckbox",m="";Array.isArray(e.name)?m=`
+        ${E(e.name[0].text)}
+        <br>
+        ${e.name[1].emphasis==="subtle"?"<small>":""}
+        ${E(e.name[1].text)}
+        ${e.name[1].emphasis==="subtle"?"</small>":""}
+      `:m=E(e.name);let S=`
+      ${h?s:""}
+      ${e.id!=="selectionRadio"&&e.id!=="selectionCheckbox"&&m?m:""}
+    `.trim(),p="ids-data-grid-header-cell-content";p+=e.sortable?" is-sortable":"",p+=h?" has-selectioncheckbox vertical-align-center":"",p+=e.headerIcon?" has-headericon":"",p+=e.reorderable?" is-reorderable":"",p+=e?.showHeaderExpander?" column-header-expander":"";let z=`<span class="${p}">
+        ${v}
+        ${e.sortable&&e.align==="right"?l:""}
+        <span class="ids-data-grid-header-text">
+          ${S}
+        </span>
+        ${this.headerIconTemplate(e)}
+        ${e.sortable&&e.align!=="right"?l:""}
+      </span>${e.resizable?i:""}${e.reorderable?n:""}`,D=t?.filters?.filterTemplate(e)||"",x=e.align?` align-${e.align}`:"";e.headerAlign&&(x=` align-${e.headerAlign}`);let M=t?.leftFrozenColumns.length,R=e?.frozen?` frozen frozen-${e?.frozen}${a+1===M?" frozen-last":""}`:"",C=(typeof e?.uppercase=="function"?e.uppercase("header-cell",e,a):e?.uppercase==="true"||e?.uppercase===!0)?" is-uppercase":"";return C+=e?.showHeaderExpander||e.sortable||e.reorderable?" is-actionable":"",`
+      <span
+        class="ids-data-grid-header-cell${C}${x}${R}"
+        ${e.reorderable?'draggable="true"':""}
+        part="header-cell"
+        aria-colindex="${a+1}"
+        column-id="${e.id}"
+        role="columnheader">
+        ${z}
+        ${D}
+      </span>
+    `}static headerIconTemplate(t){let e=typeof t?.headerIcon=="string"?t.headerIcon:"";return e===""?"":`
+      <span class="ids-data-grid-header-icon" data-headericontooltip="${t.headerIconTooltip||e}">
+        <ids-icon icon="${e}" size="medium"></ids-icon>
+      </span>`}static columnGroupsTemplate(t){if(!t?.columnGroups)return"";let e=`<ids-data-grid-header class="ids-data-grid-header column-groups" part="header" role="rowgroup">
+    <div role="row" class="ids-data-grid-row ids-data-grid-column-groups">`;return t?.columnGroups.forEach(a=>{let s=a.align?` align-${a.align}`:"",d="ids-data-grid-header-cell-content";d+=a.headerIcon?" has-headericon":"";let l=`<span class="ids-data-grid-header-cell${s}" part="header-cell" column-group-id="${a.id||"id"}" role="columnheader">
+        <span class="${d}">
+          <span class="ids-data-grid-header-text">
+            ${a.name||""}
+          </span>
+          ${this.headerIconTemplate(a)}
+        </span>
+      </span>`;e+=l}),e+="</div></ids-data-grid-header>",e}};o=new WeakSet,$=function(){g(this,o,H).call(this),g(this,o,A).call(this),g(this,o,L).call(this),g(this,o,G).call(this)},A=function(){this.offEvent("click.sort",this),this.onEvent("click.sort",this,t=>{if(this.dataGrid?.isResizing){this.dataGrid.isResizing=!1;return}if(t.target?.classList?.contains("header-expander")){if(!t.target?.closest(".column-header-expander")&&!this.dataGrid?.showHeaderExpander)return;let s=this.isHeaderExpanderCollapsed;this.isHeaderExpanderCollapsed=!s,s?this.dataGrid.expandAll():this.dataGrid.collapseAll();return}let e=t.target.closest(".is-sortable")?.closest(".ids-data-grid-header-cell");e&&this.dataGrid?.setSortColumn(e.getAttribute("column-id"),e.getAttribute("aria-sort")!=="ascending")})},H=function(){this.headerCheckbox=this.querySelector("ids-data-grid-header .ids-data-grid-checkbox-container .ids-data-grid-checkbox"),this.offEvent("click.select",this.headerCheckbox),this.onEvent("click.select",this.headerCheckbox,t=>{t.target.classList.contains("checked")||t.target.classList.contains("indeterminate")?this.dataGrid?.deSelectAllRows():this.dataGrid?.selectAllRows()})},L=function(){let t=0,e=0,a="",s,d=r=>{r.preventDefault();let i=r.clientX-t;this.dataGrid?.setColumnWidth(a,e+(this.dataGrid.localeAPI.isRTL()?-i:i))},l=()=>{document.removeEventListener("mousemove",d),document.removeEventListener("mouseup",l),this?.style.setProperty("cursor",""),requestAnimationFrame(()=>{this.dataGrid.isResizing=!1,s?.parentElement?.querySelectorAll("[draggable]").forEach(r=>r.setAttribute("draggable","true"))})};this.offEvent("mousedown.resize",this),this.onEvent("mousedown.resize",this,r=>{let i=r.target;if(!i.classList.contains("resizer"))return;t=r.clientX,s=i.closest(".ids-data-grid-header-cell"),s.parentElement?.querySelectorAll("[draggable]").forEach(c=>c.setAttribute("draggable","false"));let n=window.getComputedStyle(s);a=s.getAttribute("column-id")||"",e=parseInt(n.width,10),document.addEventListener("mousemove",d),document.addEventListener("mouseup",l),this?.style.setProperty("cursor","col-resize"),this.dataGrid.isResizing=!0})},G=function(){let t=this.dataGrid?.wrapper?.querySelector(".ids-data-grid-sort-arrows"),e,a=0,s=!1,d;this.offEvent("mousedown.reorder",this),this.onEvent("mousedown.reorder",this,r=>{r.target.nodeName==="IDS-INPUT"&&(d=r.target.closest(".ids-data-grid-header-cell"),d?.setAttribute("draggable","false"))}),this.offEvent("mouseup.reorder",this),this.onEvent("mouseup.reorder",this,()=>{d?.setAttribute("draggable","true")}),this.offEvent("dragstart.reorder",this),this.onEvent("dragstart.reorder",this,r=>{let i=r.target,n=r.target.nodeName;this.dataGrid.isResizing||!i||n==="IDS-INPUT"||(s=!0,i.classList.add("active-drag-column"),e=i.cloneNode(!0),e.classList.add("dragging"),this?.appendChild(e),r?.dataTransfer?.setDragImage(e,this.dataGrid?.localeAPI.isRTL()?100:10,18),a=i.getAttribute("aria-colindex"))}),this.offEvent("dragenter.reorder",this),this.onEvent("dragenter.reorder",this,r=>{if(!s){r.target?.getAttribute("color-variant")==="alternate-formatter"&&(r.target.style.backgroundColor="var(--ids-data-grid-filter-input-drop-background-color)");return}let i=r.target.closest(".ids-data-grid-header-cell");if(i.classList.contains("active-drag-column"))return;let n=i.getBoundingClientRect(),c=i.getAttribute("aria-colindex"),f=n.left+(a<c?n.width+1:1),v=n.left+(a<c?1:n.width+1),h=0;this.offsetParent&&(h=this.offsetParent.getBoundingClientRect().left-this.offsetParent.offsetLeft),f=f<3?0:f,t?.style.setProperty("left",`${this.dataGrid?.localeAPI.isRTL()?v-h:f-h}px`),t?.style.setProperty("height",`${n.height-2}px`),t?.style.setProperty("display","block"),r.preventDefault()}),this.offEvent("dragover.reorder",this),this.onEvent("dragover.reorder",this,r=>{s&&(r.dataTransfer.dropEffect="move",r.preventDefault())}),this.offEvent("dragleave.reorder",this),this.onEvent("dragleave.reorder",this,r=>{!s&&r.target?.getAttribute("color-variant")==="alternate-formatter"&&(r.target.style.backgroundColor="")});let l=r=>{this.querySelector(".active-drag-column")?.classList.remove("active-drag-column"),e?.remove(),t?.style.setProperty("display","none"),r.preventDefault()};this.offEvent("dragend.reorder",this),this.onEvent("dragend.reorder",this,r=>{if(!s){r.target?.getAttribute("color-variant")==="alternate-formatter"&&(r.target.style.backgroundColor="");return}s=!1,l(r)}),this.offEvent("drop.reorder",this),this.onEvent("drop.reorder",this,r=>{if(!s){r.target?.getAttribute("color-variant")==="alternate-formatter"&&(r.target.style.backgroundColor="");return}s=!1;let i=r.target.closest(".ids-data-grid-header-cell");this.dataGrid?.moveColumn(a-1,i.getAttribute("aria-colindex")-1),l(r)})},u=I([w("ids-data-grid-header")],u);export{u as a};

package/chunks/{ids-chunk-FGNPUVA5.js → ids-chunk-2HOUBCCQ.js}

@@ -1 +1 @@
-import{a,b as n}from"./ids-chunk-FTY43IYJ.js";import{a as o,b as i}from"./ids-chunk-XE4WFW5M.js";import{e as u}from"./ids-chunk-5Q3WPKMB.js";import{a as t}from"./ids-chunk-H4WFYJQQ.js";import{a as s}from"./ids-chunk-Y32WUP63.js";var e=class extends n{constructor(){super()}connectedCallback(){super.connectedCallback()}static get attributes(){return[...super.attributes,t.CONFIRM,t.CANCEL]}get protoClasses(){return["ids-modal-button"]}get cancel(){return this.hasAttribute(t.CANCEL)}set cancel(r){u(r)?this.setAttribute(t.CANCEL,`${r}`):this.removeAttribute(t.CANCEL)}};e=s([o("ids-modal-button"),i(a)],e);export{e as a};
+import{a,b as n}from"./ids-chunk-YTGZJ74N.js";import{a as o,b as i}from"./ids-chunk-XE4WFW5M.js";import{e as u}from"./ids-chunk-Y6KVKFJX.js";import{a as t}from"./ids-chunk-TFRXZ5TN.js";import{a as s}from"./ids-chunk-ZMMCFAAI.js";var e=class extends n{constructor(){super()}connectedCallback(){super.connectedCallback()}static get attributes(){return[...super.attributes,t.CONFIRM,t.CANCEL]}get protoClasses(){return["ids-modal-button"]}get cancel(){return this.hasAttribute(t.CANCEL)}set cancel(r){u(r)?this.setAttribute(t.CANCEL,`${r}`):this.removeAttribute(t.CANCEL)}};e=s([o("ids-modal-button"),i(a)],e);export{e as a};

package/chunks/{ids-chunk-W5DKOEIG.js → ids-chunk-2JIRASBM.js}

@@ -1,4 +1,4 @@
-import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUIAPU.js";import{a as F}from"./ids-chunk-5SAPHO33.js";import{a as j}from"./ids-chunk-BSKVVUAV.js";import{b as X}from"./ids-chunk-O5MQZ2A2.js";import{a as U}from"./ids-chunk-6XQQHFMN.js";import{a as _}from"./ids-chunk-3DA43NO3.js";import{a as V,b as $}from"./ids-chunk-XE4WFW5M.js";import{a as N}from"./ids-chunk-KBS65QZP.js";import{e as a}from"./ids-chunk-5Q3WPKMB.js";import{a as o}from"./ids-chunk-H4WFYJQQ.js";import{a as q,b as I,d as l,g as r}from"./ids-chunk-Y32WUP63.js";var Z=`@charset "UTF-8";
+import{a as R}from"./ids-chunk-D4HPOEWX.js";import{a as y}from"./ids-chunk-5ZRTZIUA.js";import{a as z}from"./ids-chunk-SRRV3GCP.js";import{a as O}from"./ids-chunk-SP2KE7O5.js";import{b as H}from"./ids-chunk-5ZEQ2WTS.js";import{a as D}from"./ids-chunk-VEO6QETS.js";import{a as B}from"./ids-chunk-U4K5B3VN.js";import{a as C,b as T}from"./ids-chunk-XE4WFW5M.js";import{a as P}from"./ids-chunk-W3LDHTW6.js";import{e as s}from"./ids-chunk-Y6KVKFJX.js";import{a as o}from"./ids-chunk-TFRXZ5TN.js";import{a as S,b as g,d as L,f as e}from"./ids-chunk-ZMMCFAAI.js";var M=`@charset "UTF-8";
 /**
  * Css for clearable mixin
  */
@@ -81,8 +81,9 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   display: flex;
-  font-family: var(--ids-font-family-default);
-  margin-top: var(--ids-space-xxs);
+  font-family: var(--ids-font-family-default), var(--ids-font-family-system-sans);
+  margin-top: var(--ids-space-2xs);
+  max-width: var(--ids-input-width-full);
 }
 .validation-message.has-custom-icon {
   color: var(--ids-icon-color-default);
@@ -91,7 +92,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   color: var(--ids-input-color-text-disabled);
 }
 .validation-message .ids-icon {
-  margin-inline-end: var(--ids-space-xxs);
+  margin-inline-end: var(--ids-space-2xs);
 }
 .validation-message.alert {
   color: var(--ids-color-caution-default);
@@ -133,7 +134,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 .ids-label-text {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  font-family: var(--ids-font-family-default);
+  font-family: var(--ids-font-family-default), var(--ids-font-family-system-sans);
   color: var(--ids-input-label-color-text-default);
   display: flex;
   margin-block-end: var(--ids-input-margin-bottom);
@@ -145,10 +146,10 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 }
 .ids-label-text.required::after {
   position: relative;
-  font-family: var(--ids-font-family-default);
-  margin-inline-start: var(--ids-space-xxxs);
-  margin-inline-end: var(--ids-space-xxxs);
-  font-size: var(--ids-font-size-50);
+  font-family: var(--ids-font-family-default), var(--ids-font-family-system-sans);
+  margin-inline-start: var(--ids-space-3xs);
+  margin-inline-end: var(--ids-space-3xs);
+  font-size: var(--ids-font-size-md);
   color: var(--ids-input-required-indicator-color-text-default);
   content: "*";
   margin-top: -10px;
@@ -190,7 +191,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   white-space: nowrap;
 }
 :host([label-wrap=ellipsis]) .ids-label-text.required {
-  padding-inline-end: 8px;
+  padding-inline-end: var(--ids-space-xs);
 }
 :host([label-wrap=ellipsis]) .ids-label-text.required::after {
   display: block;
@@ -206,7 +207,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   white-space: nowrap;
 }
 :host([label-wrap=ellipsis-no-stretch]) .ids-label-text.required {
-  padding-inline-end: 8px;
+  padding-inline-end: var(--ids-space-xs);
 }
 :host([label-wrap=ellipsis-no-stretch]) .ids-label-text.required::after {
   display: block;
@@ -262,7 +263,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 .ids-input .field-container {
   border: 1px solid;
   border-collapse: separate;
-  border-radius: 2px;
+  border-radius: var(--ids-border-radius-2xs);
   box-sizing: border-box;
   color: inherit;
   display: flex;
@@ -276,11 +277,11 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   transition: border var(--ids-motion-duration) var(--ids-motion-ease);
 }
 .ids-input .field-container.square {
-  border-radius: 0;
+  border-radius: var(--ids-border-radius-none);
 }
 .ids-input:focus-within .ids-input-field, .ids-input.readonly:focus-within .ids-input-field, .ids-input.is-active .ids-input-field {
   outline: none;
-  outline-color: transparent;
+  outline-color: var(--ids-color-transparent);
 }
 .ids-input:focus-within .field-container, .ids-input.readonly:focus-within .field-container, .ids-input.is-active .field-container {
   border-color: var(--ids-input-color-border-focus);
@@ -296,17 +297,17 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   box-sizing: border-box;
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
   border: none;
-  font-family: var(--ids-font-family-default);
-  padding-block-start: var(--ids-space-xxs);
-  padding-block-end: var(--ids-space-xxs);
+  color: inherit;
+  font-family: var(--ids-font-family-default), var(--ids-font-family-system-sans);
+  padding-block-start: var(--ids-space-2xs);
+  padding-block-end: var(--ids-space-2xs);
   padding-inline-start: var(--ids-space-12);
   padding-inline-end: var(--ids-space-12);
   font-size: var(--ids-input-font-size);
   width: 100%;
   appearance: none;
-  color: currentColor;
   display: inline-block;
   height: fit-content;
   resize: none;
@@ -332,58 +333,69 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   text-align: end;
 }
 .ids-input .validation-message {
-  margin-block-start: var(--ids-space-xxs);
-  margin-bottom: 0;
+  margin-block-start: var(--ids-space-2xs);
+  margin-bottom: var(--ids-space-none);
+}
+.ids-input .validation-message .ids-icon {
+  place-self: self-start;
+  margin-top: 1px;
 }
 .ids-input.no-margins, .ids-input.no-margins.compact {
-  margin: 0;
+  margin: var(--ids-space-none);
 }
 .ids-input.no-margins.field-height-xs, .ids-input.no-margins.compact.field-height-xs {
-  margin-block-end: 0;
+  margin-block-end: var(--ids-space-none);
 }
 .ids-input.no-margins .field-container, .ids-input.no-margins.compact .field-container {
-  margin-bottom: 0;
+  margin-bottom: var(--ids-space-none);
 }
 .ids-input.no-margins .ids-input-field, .ids-input.no-margins.compact .ids-input-field {
-  margin: 0;
+  margin: var(--ids-space-none);
 }
 .ids-input.no-margins .validation-message, .ids-input.no-margins.compact .validation-message {
-  margin-bottom: 0;
-  margin-block-start: var(--ids-space-xxs);
+  margin-bottom: var(--ids-space-none);
+  margin-block-start: var(--ids-space-2xs);
 }
 .ids-input.no-margins .ids-label-text.empty, .ids-input.no-margins.compact .ids-label-text.empty {
-  margin: 0;
+  margin: var(--ids-space-none);
   visibility: hidden;
   height: 0;
 }
-.ids-input.xs .field-container {
+.ids-input.xs .field-container,
+.ids-input.xs .validation-message {
   width: calc(var(--ids-input-width-10) - 2px);
 }
-.ids-input.sm .field-container {
+.ids-input.sm .field-container,
+.ids-input.sm .validation-message {
   width: calc(var(--ids-input-width-20) - 2px);
 }
-.ids-input.mm .field-container {
+.ids-input.mm .field-container,
+.ids-input.mm .validation-message {
   width: calc(var(--ids-input-width-30) - 2px);
 }
-.ids-input.md .field-container {
+.ids-input.md .field-container,
+.ids-input.md .validation-message {
   width: calc(var(--ids-input-width-40) - 2px);
 }
-.ids-input.lg .field-container {
+.ids-input.lg .field-container,
+.ids-input.lg .validation-message {
   width: calc(var(--ids-input-width-50) - 2px);
 }
 .ids-input.full {
   display: block;
 }
-.ids-input.full .field-container {
+.ids-input.full .field-container,
+.ids-input.full .validation-message {
   width: var(--ids-input-width-full);
 }
 @media (max-width: 360px) {
-  .ids-input .field-container {
+  .ids-input .field-container,
+  .ids-input .validation-message {
     max-width: calc(var(--ids-input-width-30) - 2px);
   }
 }
 .ids-input.field-height-xs {
-  margin-block-end: var(--ids-font-size-20);
+  margin-block-end: var(--ids-font-size-2xs);
 }
 .ids-input.field-height-xs .icon-dirty {
   left: -1px;
@@ -393,19 +405,19 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   font-size: var(--ids-input-label-font-size);
 }
 .ids-input.field-height-xs .ids-input-field {
-  padding-inline-start: var(--ids-space-xxs);
-  padding-inline-end: var(--ids-space-xxs);
+  padding-inline-start: var(--ids-space-2xs);
+  padding-inline-end: var(--ids-space-2xs);
   padding-top: 0;
   padding-bottom: 0;
   font-size: var(--ids-input-font-size-sm);
   height: calc(var(--ids-input-height-10) - 2px);
 }
 .ids-input.field-height-xs.no-margin-bottom {
-  margin-bottom: 0;
+  margin-bottom: var(--ids-space-none);
 }
 .ids-input.field-height-xs.no-margin-bottom .field-container,
 .ids-input.field-height-xs.no-margin-bottom .ids-input-field {
-  margin-bottom: 0;
+  margin-bottom: var(--ids-space-none);
 }
 .ids-input.field-height-sm .ids-input-field {
   height: calc(var(--ids-input-height-20) - 2px);
@@ -417,7 +429,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   height: calc(var(--ids-input-height-40) - 2px);
 }
 .ids-input.compact {
-  margin-block-end: var(--ids-font-size-20);
+  margin-block-end: var(--ids-font-size-2xs);
 }
 .ids-input.compact .icon-dirty {
   left: -1px;
@@ -427,28 +439,28 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   font-size: var(--ids-input-label-font-size);
 }
 .ids-input.compact .ids-input-field {
-  padding-inline-start: var(--ids-space-xxs);
-  padding-inline-end: var(--ids-space-xxs);
+  padding-inline-start: var(--ids-space-2xs);
+  padding-inline-end: var(--ids-space-2xs);
   padding-top: 0;
   padding-bottom: 0;
   font-size: var(--ids-input-font-size-sm);
   height: calc(var(--ids-input-height-10) - 2px);
 }
 .ids-input.compact.no-margin-bottom {
-  margin-bottom: 0;
+  margin-bottom: var(--ids-space-none);
 }
 .ids-input.compact.no-margin-bottom .field-container,
 .ids-input.compact.no-margin-bottom .ids-input-field {
-  margin-bottom: 0;
+  margin-bottom: var(--ids-space-none);
   height: calc(var(--ids-input-height-10) - 2px);
 }
 .ids-input.color-variant-borderless {
-  --ids-input-color-border-focus: transparent;
+  --ids-input-color-border-focus: var(--ids-color-transparent);
   margin: 1px;
-  border-radius: 0;
+  border-radius: var(--ids-border-radius-none);
 }
 .ids-input.color-variant-borderless input {
-  font-size: var(--ids-font-size-40);
+  font-size: var(--ids-font-size-sm);
 }
 .ids-input.color-variant-borderless slot[name=trigger-start],
 .ids-input.color-variant-borderless slot[name=trigger-end] {
@@ -464,7 +476,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   display: none;
 }
 .ids-input.color-variant-borderless .field-container {
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
   border-color: transparent !important;
 }
 .ids-input.color-variant-borderless:focus-within .field-container {
@@ -481,23 +493,23 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 }
 .ids-input.color-variant-borderless.ids-input.field-height-xs .ids-input-field {
   font-size: var(--ids-data-grid-font-size-sm);
-  padding-inline: var(--ids-space-xxxs);
+  padding-inline: var(--ids-space-3xs);
 }
 .ids-input.color-variant-borderless.ids-input.field-height-xs slot[name=trigger-end] {
-  padding-inline-end: 0;
+  padding-inline-end: var(--ids-space-none);
 }
 .ids-input.color-variant-borderless.ids-input.field-height-xxs .ids-input-field {
   font-size: var(--ids-data-grid-font-size-sm);
-  padding-inline: var(--ids-space-xxxxs);
+  padding-inline: var(--ids-space-4xs);
 }
 .ids-input.color-variant-borderless.ids-input.field-height-xxs slot[name=trigger-end] {
-  padding-inline-end: 0;
+  padding-inline-end: var(--ids-space-none);
 }
 .ids-input.color-variant-in-cell {
   margin: 1px;
 }
 .ids-input.color-variant-in-cell input {
-  font-size: var(--ids-font-size-40);
+  font-size: var(--ids-font-size-sm);
 }
 .ids-input.color-variant-in-cell .validation-message {
   display: none;
@@ -515,11 +527,11 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   height: 30px;
 }
 .ids-input.color-variant-in-cell.ids-input.field-height-sm .ids-input-field {
-  padding-inline: 4px;
+  padding-inline: var(--ids-space-2xs);
   height: 27px;
 }
 .ids-input.color-variant-in-cell.ids-input.field-height-sm.full .field-container {
-  margin-inline: 2px;
+  margin-inline: var(--ids-space-3xs);
 }
 .ids-input.color-variant-in-cell.ids-input.field-height-xs .ids-input-field {
   padding-inline: 1px;
@@ -529,7 +541,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   margin-inline: 1px;
 }
 .ids-input.color-variant-module-nav {
-  margin-block-end: 0;
+  margin-block-end: var(--ids-space-none);
   transform: background-color var(--ids-motion-duration) var(--ids-motion-ease), border-color var(--ids-motion-duration) var(--ids-motion-ease), color var(--ids-motion-duration) var(--ids-motion-ease);
 }
 .ids-input.color-variant-module-nav .field-container {
@@ -537,7 +549,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   border: var(--ids-module-nav-input-border-width) solid transparent;
 }
 .ids-input.color-variant-module-nav input {
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
   color: inherit;
 }
 .ids-input.color-variant-module-nav input::placeholder {
@@ -571,10 +583,10 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   -webkit-text-fill-color: var(--ids-input-color-text-disabled);
 }
 .ids-input:not([class*=color-variant-]).bg-transparent .field-container, .ids-input:not([class*=color-variant-]).bg-transparent.readonly .field-container, .ids-input:not([class*=color-variant-]).bg-transparent.disabled .field-container {
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
 }
 .ids-input:not([class*=color-variant-]).bg-transparent:focus-within .field-container {
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
 }
 .ids-input:not([class*=color-variant-]):hover:not(.readonly):not(.disabled):not(:focus):not(:focus-within) .field-container, .ids-input:not([class*=color-variant-]):hover.readonly.readonly-background .field-container {
   border-color: var(--ids-input-color-border-hover);
@@ -894,7 +906,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 .ids-input.color-variant-alternate-formatter:hover.readonly.readonly-background .field-container, .ids-input.color-variant-alternate-formatter:hover:not(.readonly):not(.disabled) .field-container {
   border-color: var(--ids-data-grid-filter-input-color-border-hover);
 }
-.ids-input.color-variant-alternate-formatter:focus-within .field-container, .ids-input.color-variant-alternate-formatter:focus-within:hover .field-container {
+.ids-input.color-variant-alternate-formatter:focus-within .field-container, .ids-input.color-variant-alternate-formatter:focus-within:hover.readonly.readonly-background, .ids-input.color-variant-alternate-formatter:focus-within:hover:not(.readonly):not(.disabled) .field-container {
   border-color: var(--ids-data-grid-filter-input-color-border-focus);
 }
 .ids-input.color-variant-alternate-formatter:focus-within .ids-input-field {
@@ -916,7 +928,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   color: var(--ids-input-color-text-app-menu);
 }
 .ids-input.color-variant-list-builder .field-container {
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
   color: var(--ids-list-builder-input-text-color);
   border: 0;
 }
@@ -925,12 +937,12 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   /* stylelint-disable-next-line no-duplicate-selectors */
 }
 .ids-input.color-variant-module-nav .field-container {
-  background-color: transparent;
-  border-color: transparent;
+  background-color: var(--ids-color-transparent);
+  border-color: var(--ids-color-transparent);
   color: inherit;
 }
 .ids-input.color-variant-module-nav .ids-input-field {
-  background-color: transparent;
+  background-color: var(--ids-color-transparent);
   color: inherit;
 }
 .ids-input.color-variant-module-nav .ids-input-field::placeholder {
@@ -943,7 +955,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
   margin-inline-end: 5px;
 }
 .ids-input.color-variant-module-nav:hover .field-container {
-  background-color: var(--ids-module-nav-item-hover-bg-color);
+  background-color: var(--ids-module-nav-search-input-hover-bg-color);
 }
 .ids-input.color-variant-module-nav:hover .ids-input-field::placeholder {
   color: var(--ids-module-nav-search-input-placeholder-text-color);
@@ -964,8 +976,12 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 }
 
 .caps-lock-indicator {
-  padding-inline-start: 8px;
-  padding-inline-end: 8px;
+  padding-inline-start: var(--ids-space-xs);
+  padding-inline-end: var(--ids-space-xs);
+}
+
+.show-hide-password {
+  padding-inline-end: var(--ids-space-3xs);
 }
 
 .is-uppercase {
@@ -1030,17 +1046,17 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 }
 :host([show-loading-indicator=true]) ::slotted(.slot-loading-indicator) {
   margin-inline-end: 12px;
-  margin-inline-start: 8px;
+  margin-inline-start: var(--ids-space-xs);
 }
 
 :host([show-loading-indicator=true][field-height=xs]) ::slotted(.slot-loading-indicator) {
-  margin-inline-start: 4px;
-  margin-inline-end: 4px;
+  margin-inline-start: var(--ids-space-2xs);
+  margin-inline-end: var(--ids-space-2xs);
 }
 
 :host([show-loading-indicator=true][field-height=sm]) ::slotted(.slot-loading-indicator) {
-  margin-inline-end: 8px;
-  margin-inline-start: 4px;
+  margin-inline-end: var(--ids-space-xs);
+  margin-inline-start: var(--ids-space-2xs);
 }
 
 ::slotted(.audible) {
@@ -1055,7 +1071,7 @@ import{a as Y}from"./ids-chunk-VP4AQN3F.js";import{a as z}from"./ids-chunk-BWHUI
 }
 
 .ids-color-picker {
-  margin-bottom: 16px;
+  margin-bottom: var(--ids-space-sm);
   display: block;
   position: relative;
   max-width: var(--ids-input-width-20);
@@ -1105,8 +1121,8 @@ ids-input::part(container) {
   align-content: center;
   justify-content: center;
   justify-items: center;
-  column-gap: 8px;
-  row-gap: 4px;
+  column-gap: var(--ids-space-xs);
+  row-gap: var(--ids-space-2xs);
   width: auto;
   min-width: 265px;
 }
@@ -1116,10 +1132,10 @@ ids-input::part(container) {
   bottom: var(--ids-space-sm);
   visibility: hidden;
   opacity: 0;
-}`;var oi=j(X(F(U(Y(_(N)))))),L,K,g,S,y,O,k,H,A,R,d,v,c,f,C,G,T,J,u,b,D,Q,E,M,w=class extends oi{constructor(){super();l(this,L);l(this,g);l(this,y);l(this,k);l(this,A);l(this,d);l(this,c);l(this,C);l(this,T);l(this,u);l(this,D);l(this,E);I(this,"isFormComponent",!0);I(this,"useDefaultSwatches",!0);I(this,"initialized",!1)}connectedCallback(){super.connectedCallback(),this.swatches.length||(this.useDefaultSwatches=!0,this.append(...this.defaultSwatches)),this.clearable&&this.appendClearableButton(),r(this,u,b).call(this,this.value),r(this,d,v).call(this),r(this,L,K).call(this),this.initialized=!0}disconnectedCallback(){super.disconnectedCallback(),r(this,y,O).call(this)}static get attributes(){return[...super.attributes,o.ADVANCED,o.CHECKED,o.COMPACT,o.DISABLED,o.ID,o.LABEL,o.PLACEHOLDER,o.SUPPRESS_LABELS,o.READONLY,o.TABBABLE,o.TABINDEX,o.SIZE,o.SUPPRESS_TOOLTIPS,o.TOOLTIP,o.VALIDATE,o.VALUE]}template(){let i=this.swatchSize(),t=this.readonly?"readonly":"",e=this.disabled?"disabled":"",n=this.dirtyTracker?"dirty-tracker":"",s=this.advanced?this.colorPickerAdvancedHtml:"",h=this.value?`value="${this.value}"`:"",m=this.label?`label="${this.label}"`:"";return`<div class="ids-color-picker">
-      ${s}
-      <ids-trigger-field ${m} ${t} ${e} ${n} ${h}>
-        <ids-color ${e} size="${i}" tabindex="-1" class="color-preview" slot="trigger-start"></ids-color>
+}`;var F=O(H(z(D(R(B(P)))))),t,q,m,k,A,E,c,p,V,$,v,U,I,b=class extends F{constructor(){super();L(this,t);g(this,"isFormComponent",!0);g(this,"useDefaultSwatches",!1);g(this,"initialized",!1)}connectedCallback(){super.connectedCallback(),this.swatches.length||(this.useDefaultSwatches=!0,this.append(...this.defaultSwatches)),this.clearable&&this.appendClearableButton(),e(this,t,v).call(this,this.value),e(this,t,c).call(this),e(this,t,q).call(this),this.initialized=!0}disconnectedCallback(){super.disconnectedCallback(),e(this,t,k).call(this)}static get attributes(){return[...super.attributes,o.ADVANCED,o.CHECKED,o.COMPACT,o.DISABLED,o.ID,o.LABEL,o.PLACEHOLDER,o.SUPPRESS_LABELS,o.READONLY,o.TABBABLE,o.TABINDEX,o.SIZE,o.SUPPRESS_TOOLTIPS,o.TOOLTIP,o.VALIDATE,o.VALUE]}template(){let i=this.swatchSize(),r=this.readonly?"readonly":"",n=this.disabled?"disabled":"",a=this.dirtyTracker?"dirty-tracker":"",l=this.advanced?this.colorPickerAdvancedHtml:"",u=this.value?`value="${this.value}"`:"",h=this.label?`label="${this.label}"`:"";return`<div class="ids-color-picker">
+      ${l}
+      <ids-trigger-field ${h} ${r} ${n} ${a} ${u}>
+        <ids-color ${n} size="${i}" tabindex="-1" class="color-preview" slot="trigger-start"></ids-color>
         <ids-trigger-button slot="trigger-end" class="color-picker-trigger-btn" tabindex="-1">
           <ids-text audible="true" translate-text="true"></ids-text>
           <ids-icon icon="dropdown"></ids-icon>
@@ -1128,4 +1144,4 @@ ids-input::part(container) {
       <ids-popup id="color-picker-popup" type="menu">
         <slot slot="content" class="color-popup"></slot>
       </ids-popup>
-    </ids-color-picker>`}get textInput(){return this.container?.querySelector("ids-trigger-field")||null}get colorInput(){return this.container?.querySelector(".advanced-color-picker")||null}get colorPreview(){return this.container?.querySelector(".color-preview")||null}get triggerBtn(){return this.container?.querySelector("ids-trigger-button")||null}get colorPreviewHtml(){return`<ids-color${this.disabled?" disabled":""} tabindex="-1" class="color-preview" size="${this.swatchSize()}"></ids-color>`}get popup(){return this.container?.querySelector("#color-picker-popup")}get colorPickerAdvancedHtml(){return this.advanced?'<input class="advanced-color-picker" tabindex="-1" type="color"/>':""}get swatches(){return[...this.querySelectorAll("ids-color")]}get defaultSwatches(){let i=/^--ids-color-(([^0-9]+)-([0-9]+))$/,t=n=>{let s=new z,[h,m,B,p]=n.match(i)||[];return s.label=m,s.tooltip=`${B} ${p}`,s.hex=getComputedStyle(this.parentElement).getPropertyValue(String(h))||`var(${h})`,s.classList.add(Number(p)<40?"light":"dark"),s};return[...Object.values(["--ids-color-red-10","--ids-color-red-20","--ids-color-red-30","--ids-color-red-40","--ids-color-red-50","--ids-color-red-60","--ids-color-red-70","--ids-color-red-80","--ids-color-red-90","--ids-color-red-100"]),...Object.values(["--ids-color-orange-10","--ids-color-orange-20","--ids-color-orange-30","--ids-color-orange-40","--ids-color-orange-50","--ids-color-orange-60","--ids-color-orange-70","--ids-color-orange-80","--ids-color-orange-90","--ids-color-orange-100"]),...Object.values(["--ids-color-green-10","--ids-color-green-20","--ids-color-green-30","--ids-color-green-40","--ids-color-green-50","--ids-color-green-60","--ids-color-green-70","--ids-color-green-80","--ids-color-green-90","--ids-color-green-100"]),...Object.values(["--ids-color-blue-10","--ids-color-blue-20","--ids-color-blue-30","--ids-color-blue-40","--ids-color-blue-50","--ids-color-blue-60","--ids-color-blue-70","--ids-color-blue-80","--ids-color-blue-90","--ids-color-blue-100"]),...Object.values(["--ids-color-teal-10","--ids-color-teal-20","--ids-color-teal-30","--ids-color-teal-40","--ids-color-teal-50","--ids-color-teal-60","--ids-color-teal-70","--ids-color-teal-80","--ids-color-teal-90","--ids-color-teal-100"]),...Object.values(["--ids-color-purple-10","--ids-color-purple-20","--ids-color-purple-30","--ids-color-purple-40","--ids-color-purple-50","--ids-color-purple-60","--ids-color-purple-70","--ids-color-purple-80","--ids-color-purple-90","--ids-color-purple-100"]),...Object.values(["--ids-color-gray-10","--ids-color-gray-20","--ids-color-gray-30","--ids-color-gray-40","--ids-color-gray-50","--ids-color-gray-60","--ids-color-gray-70","--ids-color-gray-80","--ids-color-gray-90","--ids-color-gray-100"])].map(t)}set value(i){i=i?.trim()??"",i?this.setAttribute(o.VALUE,i):this.removeAttribute(o.VALUE),r(this,E,M).call(this,i),r(this,D,Q).call(this,r(this,c,f).call(this,i))}get value(){return this.getAttribute(o.VALUE)??""}set placeholder(i){i?(this.setAttribute(o.PLACEHOLDER,i),this.textInput?.setAttribute(o.PLACEHOLDER,i)):(this.removeAttribute(o.PLACEHOLDER),this.textInput?.removeAttribute(o.PLACEHOLDER))}get placeholder(){return this.getAttribute(o.PLACEHOLDER)??""}set size(i){i?(this.setAttribute(o.SIZE,i),this.textInput?.setAttribute(o.SIZE,i)):(this.removeAttribute(o.SIZE),this.textInput?.removeAttribute(o.SIZE))}get size(){return this.getAttribute(o.SIZE)}set validate(i){i?(this.setAttribute(o.VALIDATE,i),this.textInput?.setAttribute(o.VALIDATE,i)):(this.removeAttribute(o.VALIDATE),this.textInput?.removeAttribute(o.VALIDATE))}get validate(){return this.getAttribute(o.VALIDATE)}set tabbable(i){a(i)?(this.setAttribute(o.TABBABLE,""),this.textInput?.setAttribute(o.TABBABLE,"")):(this.removeAttribute(o.TABBABLE),this.textInput?.removeAttribute(o.TABBABLE))}get tabbable(){return a(this.getAttribute(o.TABBABLE))}set tooltip(i){i?(this.setAttribute(o.TOOLTIP,i),this.textInput?.setAttribute(o.TOOLTIP,i)):(this.removeAttribute(o.TOOLTIP),this.textInput?.removeAttribute(o.TOOLTIP))}get tooltip(){return this.getAttribute(o.TOOLTIP)}set advanced(i){let t=["#",/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/];a(i)?(this.setAttribute(o.ADVANCED,"true"),this.colorInput||this.container?.insertAdjacentHTML("afterbegin",this.colorPickerAdvancedHtml),r(this,k,H).call(this),r(this,E,M).call(this,this.value),this.textInput&&(this.textInput.mask=t)):(this.removeAttribute(o.ADVANCED),r(this,A,R).call(this),this.colorInput?.remove(),this.textInput&&(this.textInput.mask=void 0))}get advanced(){return a(this.getAttribute(o.ADVANCED))||!1}set disabled(i){a(i)?(this.setAttribute(o.DISABLED,""),this.textInput?.setAttribute(o.DISABLED,""),this.triggerBtn?.setAttribute(o.DISABLED,""),this.triggerBtn?.setAttribute(o.TABBABLE,"false")):(this.removeAttribute(o.DISABLED),this.textInput?.removeAttribute(o.DISABLED),this.triggerBtn?.removeAttribute(o.DISABLED),this.triggerBtn?.setAttribute(o.TABBABLE,String(this.tabbable)))}get disabled(){return a(this.getAttribute(o.DISABLED))}set readonly(i){a(i)?(this.setAttribute(o.READONLY,""),this.textInput?.setAttribute(o.READONLY,""),this.triggerBtn?.setAttribute(o.DISABLED,"")):(this.removeAttribute(o.READONLY),this.textInput?.removeAttribute(o.READONLY),this.triggerBtn?.removeAttribute(o.DISABLED))}get readonly(){return a(this.getAttribute(o.READONLY))}set suppressLabels(i){a(i)?this.setAttribute(o.SUPPRESS_LABELS,"true"):this.removeAttribute(o.SUPPRESS_LABELS),r(this,d,v).call(this)}get suppressLabels(){return this.advanced?!0:a(this.getAttribute(o.SUPPRESS_LABELS))||!1}set suppressTooltips(i){a(i)?this.setAttribute(o.SUPPRESS_TOOLTIPS,"true"):this.removeAttribute(o.SUPPRESS_TOOLTIPS),r(this,d,v).call(this)}get suppressTooltips(){return this.advanced?!0:a(this.getAttribute(o.SUPPRESS_TOOLTIPS))||!1}set compact(i){a(i)?(this.setAttribute(o.COMPACT,""),this.textInput?.setAttribute(o.COMPACT,""),this.textInput?.querySelector("ids-color")?.setAttribute("size","mm")):(this.removeAttribute(o.COMPACT),this.textInput?.removeAttribute(o.COMPACT),this.textInput?.querySelector("ids-color")?.setAttribute("size","md"))}get compact(){return a(this.getAttribute(o.COMPACT))}set id(i){this.shadowRoot?.querySelector("ids-trigger-field")?.setAttribute(o.ID,`${i}-trigger-field`),this.setAttribute(o.ID,i)}get id(){return this.getAttribute(o.ID)||"none"}close(){this.popup?.setAttribute(o.VISIBLE,"false"),this.popup?.removeOpenEvents(),r(this,d,v).call(this)}open(){if(this.advanced||this.disabled||this.readonly||!this.popup)return;if(this.useDefaultSwatches){let t=this.swatches;for(let e=0;e<t.length;e++)t[e].remove();this.append(...this.defaultSwatches)}let i=this.localeAPI.isRTL();this.popup.align=`bottom, ${i?"right":"left"}`,this.popup.arrow="bottom",this.popup.arrowTarget=this.triggerBtn,this.popup.alignTarget=this.textInput,this.popup.visible=!0,this.popup.show(),this.popup?.addOpenEvents(),r(this,d,v).call(this,!0)}onOutsideClick(){this.close()}appendClearableButton(){!this.swatches.find(t=>!t.getAttribute(o.HEX))&&this.initialized&&(this.append(new z),r(this,d,v).call(this))}removeClearableButton(){this.swatches.find(t=>!t.getAttribute(o.HEX))?.remove()}swatchSize(){let i=this.compact?"mm":this.fieldHeight;return{compact:"xs",xs:"mm",sm:"mm",mm:"mm",md:"md",lg:"lg"}[i]||"md"}onFieldHeightChange(i){this.textInput?.setAttribute(o.FIELD_HEIGHT,i),this.colorPreview?.setAttribute(o.SIZE,this.swatchSize())}onDirtyTrackerChange(i){this.textInput?.setAttribute(o.DIRTY_TRACKER,String(i))}onLabelChange(i){this.textInput?.setAttribute("label",i??"")}onLabelStateChange(i){i?this.textInput?.setAttribute(o.LABEL_STATE,i):this.textInput?.removeAttribute(o.LABEL_STATE)}};L=new WeakSet,K=function(){r(this,y,O).call(this),this.onEvent("change",this.textInput,i=>{i.stopPropagation(),r(this,u,b).call(this,i.detail.value),this.triggerEvent("change",this,{bubbles:!0,detail:{...i.detail,elem:this}})}),this.onEvent("input",this.textInput,i=>{i.stopPropagation();let t=i.target;r(this,g,S).call(this,t.value),this.triggerEvent("input",this,{bubbles:!0,detail:{elem:this,value:t?.value}})}),this.onEvent("click.color-picker-container",this.container,i=>{let t=i.target;if(!this.readonly&&!this.disabled){if(t.closest(".color-picker-trigger-btn, .color-preview")){r(this,T,J).call(this);return}t.name?.toLowerCase()==="ids-color"&&!t.classList.contains("color-preview")&&(r(this,u,b).call(this,t?.hex),this.close())}}),this.advanced&&r(this,k,H).call(this),this.onEvent("keydown.color-picker",this,i=>{if(i.target.name==="id-color-picker"&&i.preventDefault(),i.key==="Escape")this.close();else if(["Enter","Space"," "].includes(i.key))if(this.popup?.visible){let e=String(i.target.name).toLowerCase()==="ids-color"?i.target:document.activeElement;r(this,u,b).call(this,e?.hex),this.close()}else i.key==="Enter"&&this.open();else i.key==="ArrowDown"&&(i.preventDefault(),this.popup?.visible||this.open())}),this.onEvent("keydown.color-picker-popup",this.popup,i=>{if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Space"," "].includes(i.key)){i.preventDefault();let e=10,n=this.swatches,s=n[0],h=n[n.length-1],m=document.activeElement?.closest("ids-color")||s,B=i.target.name.toLowerCase()==="ids-color"?i.target:m,p=n.indexOf(B),W=n[p-1]||h,ii=n[p+1]||s;if(i.key==="ArrowRight")ii.swatch?.focus();else if(i.key==="ArrowLeft")W.swatch?.focus();else if(i.key==="ArrowUp"){let x=p-e;if(x>=0){let[P]=n.splice(x,1);P?.swatch?.focus()}}else if(i.key==="ArrowDown"){let x=p+e;if(x<n.length){let[P]=n.splice(x,1);P?.swatch?.focus()}}}})},g=new WeakSet,S=function(i){this.colorPreview?.setAttribute(o.HEX,r(this,c,f).call(this,i)?.hex||i||"")},y=new WeakSet,O=function(){this.offEvent("click.color-picker-container",this.container),this.offEvent("change.color-picer-text",this.textInput),this.offEvent("input.color-picker-text",this.textInput),this.offEvent("keydown.color-picker",this),this.offEvent("keydown.color-picker-popup",this.popup),r(this,A,R).call(this)},k=new WeakSet,H=function(){this.offEvent("change.color-picker-input",this.colorInput),this.onEvent("change.color-picker-input",this.colorInput,i=>{r(this,u,b).call(this,i.target.value)}),this.offEvent("input.color-picker-input",this.colorInput),this.onEvent("input.color-picker-input",this.colorInput,i=>{i.stopPropagation(),r(this,g,S).call(this,i.target.value)})},A=new WeakSet,R=function(){this.offEvent("change.color-picker-input",this.colorInput),this.offEvent("input.color-picker-input",this.colorInput)},d=new WeakSet,v=function(i=!1){this.swatches.forEach(t=>{t.classList.add("outlined"),t.tooltip=this.suppressLabels?this.tooltip||t.hex:this.tooltip||t.label,this.suppressTooltips&&(t.tooltip=""),this.popup?.visible?t.removeAttribute(o.TABINDEX):t.setAttribute(o.TABINDEX,"-1")}),i&&(r(this,c,f).call(this,this.value)||this.swatches[0])?.swatch?.focus()},c=new WeakSet,f=function(i){return this.swatches.find(e=>{if(!i)return!e.hex;let n=String(e.hex).trim().toLowerCase(),s=String(e.label).trim().toLowerCase();return[n,s].includes(String(i).trim().toLowerCase())})},C=new WeakSet,G=function(){if(this.advanced)return this.colorInput?this.colorInput.value:null;let i=this.querySelectorAll("ids-color[checked]")?.[0];return i?i.hex:null},T=new WeakSet,J=function(){if(this.advanced){this.colorInput?.click();return}this.popup?.visible?this.close():this.open()},u=new WeakSet,b=function(i){if(i){let t=r(this,c,f).call(this,i);this.value=t?.hex||i}else this.value=""},D=new WeakSet,Q=function(i){let t=this.querySelector("[checked]");t&&t.removeAttribute(o.CHECKED),i&&i.setAttribute(o.CHECKED,"")},E=new WeakSet,M=function(i){if(!this.colorPreview)return;let t=i??r(this,C,G).call(this),e=r(this,c,f).call(this,t),n=e?.hex||t;if(r(this,g,S).call(this,n??""),this.advanced&&this.colorInput&&(this.colorInput.value=n?.length!==7?"#ffffff":n),n&&this.textInput){let s=!this.suppressLabels&&e?.label||e?.hex||n;this.textInput.setAttribute("value",s)}else this.textInput&&this.textInput.setAttribute("value","")},w=q([V("ids-color-picker"),$(Z)],w);export{w as a};
+    </ids-color-picker>`}get textInput(){return this.container?.querySelector("ids-trigger-field")||null}get colorInput(){return this.container?.querySelector(".advanced-color-picker")||null}get colorPreview(){return this.container?.querySelector(".color-preview")||null}get triggerBtn(){return this.container?.querySelector("ids-trigger-button")||null}get colorPreviewHtml(){return`<ids-color${this.disabled?" disabled":""} tabindex="-1" class="color-preview" size="${this.swatchSize()}"></ids-color>`}get popup(){return this.container?.querySelector("#color-picker-popup")}get colorPickerAdvancedHtml(){return this.advanced?'<input class="advanced-color-picker" tabindex="-1" type="color"/>':""}get swatches(){return[...this.querySelectorAll("ids-color")]}get defaultSwatches(){let i=/^--ids-color-(([^0-9]+)-([0-9]+))$/,r=a=>{let l=new y,[u,h,w,d]=a.match(i)||[];return l.label=h,l.tooltip=`${w} ${d}`,l.hex=getComputedStyle(this.parentElement).getPropertyValue(String(u))||`var(${u})`,l.classList.add(Number(d)<40?"light":"dark"),l};return[...Object.values(["--ids-color-red-10","--ids-color-red-20","--ids-color-red-30","--ids-color-red-40","--ids-color-red-50","--ids-color-red-60","--ids-color-red-70","--ids-color-red-80","--ids-color-red-90","--ids-color-red-100"]),...Object.values(["--ids-color-orange-10","--ids-color-orange-20","--ids-color-orange-30","--ids-color-orange-40","--ids-color-orange-50","--ids-color-orange-60","--ids-color-orange-70","--ids-color-orange-80","--ids-color-orange-90","--ids-color-orange-100"]),...Object.values(["--ids-color-green-10","--ids-color-green-20","--ids-color-green-30","--ids-color-green-40","--ids-color-green-50","--ids-color-green-60","--ids-color-green-70","--ids-color-green-80","--ids-color-green-90","--ids-color-green-100"]),...Object.values(["--ids-color-blue-10","--ids-color-blue-20","--ids-color-blue-30","--ids-color-blue-40","--ids-color-blue-50","--ids-color-blue-60","--ids-color-blue-70","--ids-color-blue-80","--ids-color-blue-90","--ids-color-blue-100"]),...Object.values(["--ids-color-teal-10","--ids-color-teal-20","--ids-color-teal-30","--ids-color-teal-40","--ids-color-teal-50","--ids-color-teal-60","--ids-color-teal-70","--ids-color-teal-80","--ids-color-teal-90","--ids-color-teal-100"]),...Object.values(["--ids-color-purple-10","--ids-color-purple-20","--ids-color-purple-30","--ids-color-purple-40","--ids-color-purple-50","--ids-color-purple-60","--ids-color-purple-70","--ids-color-purple-80","--ids-color-purple-90","--ids-color-purple-100"]),...Object.values(["--ids-color-neutral-10","--ids-color-neutral-20","--ids-color-neutral-30","--ids-color-neutral-40","--ids-color-neutral-50","--ids-color-neutral-60","--ids-color-neutral-70","--ids-color-neutral-80","--ids-color-neutral-90","--ids-color-neutral-100"])].map(r)}set value(i){i=i?.trim()??"",i?this.setAttribute(o.VALUE,i):this.removeAttribute(o.VALUE),e(this,t,I).call(this,i),e(this,t,U).call(this,e(this,t,p).call(this,i))}get value(){return this.getAttribute(o.VALUE)??""}set placeholder(i){i?(this.setAttribute(o.PLACEHOLDER,i),this.textInput?.setAttribute(o.PLACEHOLDER,i)):(this.removeAttribute(o.PLACEHOLDER),this.textInput?.removeAttribute(o.PLACEHOLDER))}get placeholder(){return this.getAttribute(o.PLACEHOLDER)??""}set size(i){i?(this.setAttribute(o.SIZE,i),this.textInput?.setAttribute(o.SIZE,i)):(this.removeAttribute(o.SIZE),this.textInput?.removeAttribute(o.SIZE))}get size(){return this.getAttribute(o.SIZE)}set validate(i){i?(this.setAttribute(o.VALIDATE,i),this.textInput?.setAttribute(o.VALIDATE,i)):(this.removeAttribute(o.VALIDATE),this.textInput?.removeAttribute(o.VALIDATE))}get validate(){return this.getAttribute(o.VALIDATE)}set tabbable(i){s(i)?(this.setAttribute(o.TABBABLE,""),this.textInput?.setAttribute(o.TABBABLE,"")):(this.removeAttribute(o.TABBABLE),this.textInput?.removeAttribute(o.TABBABLE))}get tabbable(){return s(this.getAttribute(o.TABBABLE))}set tooltip(i){i?(this.setAttribute(o.TOOLTIP,i),this.textInput?.setAttribute(o.TOOLTIP,i)):(this.removeAttribute(o.TOOLTIP),this.textInput?.removeAttribute(o.TOOLTIP))}get tooltip(){return this.getAttribute(o.TOOLTIP)}set advanced(i){let r=["#",/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/,/[0-9a-fA-F]/];s(i)?(this.setAttribute(o.ADVANCED,"true"),this.colorInput||this.container?.insertAdjacentHTML("afterbegin",this.colorPickerAdvancedHtml),e(this,t,A).call(this),e(this,t,I).call(this,this.value),this.textInput&&(this.textInput.mask=r)):(this.removeAttribute(o.ADVANCED),e(this,t,E).call(this),this.colorInput?.remove(),this.textInput&&(this.textInput.mask=void 0))}get advanced(){return s(this.getAttribute(o.ADVANCED))||!1}set disabled(i){s(i)?(this.setAttribute(o.DISABLED,""),this.textInput?.setAttribute(o.DISABLED,""),this.triggerBtn?.setAttribute(o.DISABLED,""),this.triggerBtn?.setAttribute(o.TABBABLE,"false")):(this.removeAttribute(o.DISABLED),this.textInput?.removeAttribute(o.DISABLED),this.triggerBtn?.removeAttribute(o.DISABLED),this.triggerBtn?.setAttribute(o.TABBABLE,String(this.tabbable)))}get disabled(){return s(this.getAttribute(o.DISABLED))}set readonly(i){s(i)?(this.setAttribute(o.READONLY,""),this.textInput?.setAttribute(o.READONLY,""),this.triggerBtn?.setAttribute(o.DISABLED,"")):(this.removeAttribute(o.READONLY),this.textInput?.removeAttribute(o.READONLY),this.triggerBtn?.removeAttribute(o.DISABLED))}get readonly(){return s(this.getAttribute(o.READONLY))}set suppressLabels(i){s(i)?this.setAttribute(o.SUPPRESS_LABELS,"true"):this.removeAttribute(o.SUPPRESS_LABELS),e(this,t,c).call(this)}get suppressLabels(){return this.advanced?!0:s(this.getAttribute(o.SUPPRESS_LABELS))||!1}set suppressTooltips(i){s(i)?this.setAttribute(o.SUPPRESS_TOOLTIPS,"true"):this.removeAttribute(o.SUPPRESS_TOOLTIPS),e(this,t,c).call(this)}get suppressTooltips(){return this.advanced?!0:s(this.getAttribute(o.SUPPRESS_TOOLTIPS))||!1}set compact(i){s(i)?(this.setAttribute(o.COMPACT,""),this.textInput?.setAttribute(o.COMPACT,""),this.textInput?.querySelector("ids-color")?.setAttribute("size","mm")):(this.removeAttribute(o.COMPACT),this.textInput?.removeAttribute(o.COMPACT),this.textInput?.querySelector("ids-color")?.setAttribute("size","md"))}get compact(){return s(this.getAttribute(o.COMPACT))}set id(i){this.shadowRoot?.querySelector("ids-trigger-field")?.setAttribute(o.ID,`${i}-trigger-field`),this.setAttribute(o.ID,i)}get id(){return this.getAttribute(o.ID)||"none"}close(){this.popup?.setAttribute(o.VISIBLE,"false"),this.popup?.removeOpenEvents(),e(this,t,c).call(this)}open(){if(this.advanced||this.disabled||this.readonly||!this.popup)return;if(this.useDefaultSwatches){let r=this.swatches;for(let n=0;n<r.length;n++)r[n].remove();this.append(...this.defaultSwatches)}let i=this.localeAPI.isRTL();this.popup.align=`bottom, ${i?"right":"left"}`,this.popup.arrow="bottom",this.popup.arrowTarget=this.triggerBtn,this.popup.alignTarget=this.textInput,this.popup.visible=!0,this.popup.show(),this.popup?.addOpenEvents(),e(this,t,c).call(this,!0)}onOutsideClick(){this.close()}appendClearableButton(){!this.swatches.find(r=>!r.getAttribute(o.HEX))&&this.initialized&&(this.append(new y),e(this,t,c).call(this))}removeClearableButton(){this.swatches.find(r=>!r.getAttribute(o.HEX))?.remove()}swatchSize(){let i=this.compact?"mm":this.fieldHeight;return{compact:"xs",xs:"mm",sm:"mm",mm:"mm",md:"md",lg:"lg"}[i]||"md"}onFieldHeightChange(i){this.textInput?.setAttribute(o.FIELD_HEIGHT,i),this.colorPreview?.setAttribute(o.SIZE,this.swatchSize())}onDirtyTrackerChange(i){this.textInput?.setAttribute(o.DIRTY_TRACKER,String(i))}onLabelChange(i){this.textInput?.setAttribute("label",i??"")}onLabelStateChange(i){i?this.textInput?.setAttribute(o.LABEL_STATE,i):this.textInput?.removeAttribute(o.LABEL_STATE)}};t=new WeakSet,q=function(){e(this,t,k).call(this),this.onEvent("change",this.textInput,i=>{i.stopPropagation(),e(this,t,v).call(this,i.detail.value),this.triggerEvent("change",this,{bubbles:!0,detail:{...i.detail,elem:this}})}),this.onEvent("input",this.textInput,i=>{i.stopPropagation();let r=i.target;e(this,t,m).call(this,r.value),this.triggerEvent("input",this,{bubbles:!0,detail:{elem:this,value:r?.value}})}),this.onEvent("click.color-picker-container",this.container,i=>{let r=i.target;if(!this.readonly&&!this.disabled){if(r.closest(".color-picker-trigger-btn, .color-preview")){e(this,t,$).call(this);return}r.name?.toLowerCase()==="ids-color"&&!r.classList.contains("color-preview")&&(e(this,t,v).call(this,r?.hex),this.close())}}),this.advanced&&e(this,t,A).call(this),this.onEvent("keydown.color-picker",this,i=>{if(i.target.name==="id-color-picker"&&i.preventDefault(),i.key==="Escape")this.close();else if(["Enter","Space"," "].includes(i.key))if(this.popup?.visible){let n=String(i.target.name).toLowerCase()==="ids-color"?i.target:document.activeElement;e(this,t,v).call(this,n?.hex),this.close()}else i.key==="Enter"&&this.open();else i.key==="ArrowDown"&&(i.preventDefault(),this.popup?.visible||this.open())}),this.onEvent("keydown.color-picker-popup",this.popup,i=>{if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Space"," "].includes(i.key)){i.preventDefault();let n=10,a=this.swatches,l=a[0],u=a[a.length-1],h=document.activeElement?.closest("ids-color")||l,w=i.target.name.toLowerCase()==="ids-color"?i.target:h,d=a.indexOf(w),_=a[d-1]||u,N=a[d+1]||l;if(i.key==="ArrowRight")N.swatch?.focus();else if(i.key==="ArrowLeft")_.swatch?.focus();else if(i.key==="ArrowUp"){let f=d-n;if(f>=0){let[x]=a.splice(f,1);x?.swatch?.focus()}}else if(i.key==="ArrowDown"){let f=d+n;if(f<a.length){let[x]=a.splice(f,1);x?.swatch?.focus()}}}})},m=function(i){this.colorPreview?.setAttribute(o.HEX,e(this,t,p).call(this,i)?.hex||i||"")},k=function(){this.offEvent("click.color-picker-container",this.container),this.offEvent("change.color-picer-text",this.textInput),this.offEvent("input.color-picker-text",this.textInput),this.offEvent("keydown.color-picker",this),this.offEvent("keydown.color-picker-popup",this.popup),e(this,t,E).call(this)},A=function(){this.offEvent("change.color-picker-input",this.colorInput),this.onEvent("change.color-picker-input",this.colorInput,i=>{e(this,t,v).call(this,i.target.value)}),this.offEvent("input.color-picker-input",this.colorInput),this.onEvent("input.color-picker-input",this.colorInput,i=>{i.stopPropagation(),e(this,t,m).call(this,i.target.value)})},E=function(){this.offEvent("change.color-picker-input",this.colorInput),this.offEvent("input.color-picker-input",this.colorInput)},c=function(i=!1){this.swatches.forEach(r=>{r.classList.add("outlined"),r.tooltip=this.suppressLabels?this.tooltip||r.hex:this.tooltip||r.label,this.suppressTooltips&&(r.tooltip=""),this.popup?.visible?r.removeAttribute(o.TABINDEX):r.setAttribute(o.TABINDEX,"-1")}),i&&(e(this,t,p).call(this,this.value)||this.swatches[0])?.swatch?.focus()},p=function(i){return this.swatches.find(n=>{if(!i)return!n.hex;let a=String(n.hex).trim().toLowerCase(),l=String(n.label).trim().toLowerCase();return[a,l].includes(String(i).trim().toLowerCase())})},V=function(){if(this.advanced)return this.colorInput?this.colorInput.value:null;let i=this.querySelectorAll("ids-color[checked]")?.[0];return i?i.hex:null},$=function(){if(this.advanced){this.colorInput?.click();return}this.popup?.visible?this.close():this.open()},v=function(i){if(i){let r=e(this,t,p).call(this,i);this.value=r?.hex||i}else this.value=""},U=function(i){let r=this.querySelector("[checked]");r&&r.removeAttribute(o.CHECKED),i&&i.setAttribute(o.CHECKED,"")},I=function(i){if(!this.colorPreview)return;let r=i??e(this,t,V).call(this),n=e(this,t,p).call(this,r),a=n?.hex||r;if(e(this,t,m).call(this,a??""),this.advanced&&this.colorInput&&(this.colorInput.value=a?.length!==7?"#ffffff":a),a&&this.textInput){let l=!this.suppressLabels&&n?.label||n?.hex||a;this.textInput.setAttribute("value",l)}else this.textInput&&this.textInput.setAttribute("value","")},b=S([C("ids-color-picker"),T(M)],b);export{b as a};

package/chunks/{ids-chunk-CRDP5GP7.js → ids-chunk-2L7G2PMO.js}

@@ -1 +1 @@
-import{a as E}from"./ids-chunk-H4WFYJQQ.js";var N=[E.AUTOSELECT,E.AUTOUPDATE,E.DISABLED,E.EMBEDDABLE,E.ID,E.LABEL,E.NO_MARGINS,E.PLACEHOLDER,E.READONLY,E.SIZE,E.TABBABLE,E.VALIDATE,E.VALIDATION_EVENTS,E.VALUE],O=[E.END_HOUR,E.FORMAT,E.HOURS,E.MINUTES,E.MINUTE_INTERVAL,E.PERIOD,E.SECONDS,E.SECOND_INTERVAL,E.START_HOUR,E.USE_CURRENT_TIME],D=(A,T,I=1)=>A>T?[]:[A,...D(A+Math.abs(I),T,I)];export{N as a,O as b,D as c};
+import{a as E}from"./ids-chunk-TFRXZ5TN.js";var N=[E.AUTOSELECT,E.AUTOUPDATE,E.DISABLED,E.EMBEDDABLE,E.ID,E.LABEL,E.NO_MARGINS,E.PLACEHOLDER,E.READONLY,E.SIZE,E.TABBABLE,E.VALIDATE,E.VALIDATION_EVENTS,E.VALUE],O=[E.END_HOUR,E.FORMAT,E.HOURS,E.MINUTES,E.MINUTE_INTERVAL,E.PERIOD,E.SECONDS,E.SECOND_INTERVAL,E.START_HOUR,E.USE_CURRENT_TIME],D=(A,T,I=1)=>A>T?[]:[A,...D(A+Math.abs(I),T,I)];export{N as a,O as b,D as c};