igniteui-webcomponents 7.3.0 → 7.3.1

package/components/chip/themes/shared/chip.bootstrap.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host button:focus{outline:.25rem solid var(--focus-shadow-color)}:host([selected]) button:not([disabled]):focus{outline:.25rem solid var(--focus-selected-shadow-color)}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){color:var(--ig-primary-700-contrast)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:var(--ig-primary-500);color:var(--ig-primary-700-contrast);outline:.25rem solid hsl(from var(--ig-primary-500) h s l/0.38)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:var(--ig-primary-600);color:var(--ig-primary-700-contrast)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){color:var(--ig-info-700-contrast)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:var(--ig-info-500);color:var(--ig-info-700-contrast);outline:.25rem solid hsl(from var(--ig-info-500) h s l/0.38)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:var(--ig-info-600);color:var(--ig-info-700-contrast)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){color:var(--ig-success-700-contrast)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:var(--ig-success-500);color:var(--ig-success-700-contrast);outline:.25rem solid hsl(from var(--ig-success-500) h s l/0.38)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:var(--ig-success-600);color:var(--ig-success-700-contrast)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){color:var(--ig-warn-700-contrast)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:var(--ig-warn-500);color:var(--ig-warn-700-contrast);outline:.25rem solid hsl(from var(--ig-warn-500) h s l/0.38)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:var(--ig-warn-600);color:var(--ig-warn-700-contrast)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){color:var(--ig-error-700-contrast)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:var(--ig-error-500);color:var(--ig-error-700-contrast);outline:.25rem solid hsl(from var(--ig-error-500) h s l/0.38)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:var(--ig-error-600);color:var(--ig-error-700-contrast)}:host([outlined][variant=primary]) button,:host([selected][outlined][variant=primary]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=primary]) button:hover,:host([selected][outlined][variant=primary]) button:not([disabled]):hover{background:hsl(from var(--ig-primary-600) h s l/0.3)}:host([outlined][variant=primary]) button:focus,:host([selected][outlined][variant=primary]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=info]) button,:host([selected][outlined][variant=info]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=info]) button:hover,:host([selected][outlined][variant=info]) button:not([disabled]):hover{background:hsl(from var(--ig-info-600) h s l/0.3)}:host([outlined][variant=info]) button:focus,:host([selected][outlined][variant=info]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=success]) button,:host([selected][outlined][variant=success]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=success]) button:hover,:host([selected][outlined][variant=success]) button:not([disabled]):hover{background:hsl(from var(--ig-success-600) h s l/0.3)}:host([outlined][variant=success]) button:focus,:host([selected][outlined][variant=success]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) button,:host([selected][outlined][variant=warning]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=warning]) button:hover,:host([selected][outlined][variant=warning]) button:not([disabled]):hover{background:hsl(from var(--ig-warn-600) h s l/0.3)}:host([outlined][variant=warning]) button:focus,:host([selected][outlined][variant=warning]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) button,:host([selected][outlined][variant=danger]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=danger]) button:hover,:host([selected][outlined][variant=danger]) button:not([disabled]):hover{background:hsl(from var(--ig-error-600) h s l/0.3)}:host([outlined][variant=danger]) button:focus,:host([selected][outlined][variant=danger]) button:not([disabled]):focus{background:rgba(0,0,0,0)}`;
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host [part=base]:focus-within{outline:.25rem solid var(--focus-shadow-color)}:host([selected]:not([disabled])) [part=base]:focus-within{outline:.25rem solid var(--focus-selected-shadow-color)}:host([variant=primary]) [part=base],:host([selected][variant=primary]:not([disabled])) [part=base]{color:var(--ig-primary-700-contrast)}:host([variant=primary]) [part=base]:focus-within,:host([selected][variant=primary]:not([disabled])) [part=base]:focus-within{background:var(--ig-primary-500);color:var(--ig-primary-700-contrast);outline:.25rem solid hsl(from var(--ig-primary-500) h s l/0.38)}:host([variant=primary]) [part=base]:hover,:host([selected][variant=primary]:not([disabled])) [part=base]:hover{background:var(--ig-primary-600);color:var(--ig-primary-700-contrast)}:host([variant=info]) [part=base],:host([selected][variant=info]:not([disabled])) [part=base]{color:var(--ig-info-700-contrast)}:host([variant=info]) [part=base]:focus-within,:host([selected][variant=info]:not([disabled])) [part=base]:focus-within{background:var(--ig-info-500);color:var(--ig-info-700-contrast);outline:.25rem solid hsl(from var(--ig-info-500) h s l/0.38)}:host([variant=info]) [part=base]:hover,:host([selected][variant=info]:not([disabled])) [part=base]:hover{background:var(--ig-info-600);color:var(--ig-info-700-contrast)}:host([variant=success]) [part=base],:host([selected][variant=success]:not([disabled])) [part=base]{color:var(--ig-success-700-contrast)}:host([variant=success]) [part=base]:focus-within,:host([selected][variant=success]:not([disabled])) [part=base]:focus-within{background:var(--ig-success-500);color:var(--ig-success-700-contrast);outline:.25rem solid hsl(from var(--ig-success-500) h s l/0.38)}:host([variant=success]) [part=base]:hover,:host([selected][variant=success]:not([disabled])) [part=base]:hover{background:var(--ig-success-600);color:var(--ig-success-700-contrast)}:host([variant=warning]) [part=base],:host([selected][variant=warning]:not([disabled])) [part=base]{color:var(--ig-warn-700-contrast)}:host([variant=warning]) [part=base]:focus-within,:host([selected][variant=warning]:not([disabled])) [part=base]:focus-within{background:var(--ig-warn-500);color:var(--ig-warn-700-contrast);outline:.25rem solid hsl(from var(--ig-warn-500) h s l/0.38)}:host([variant=warning]) [part=base]:hover,:host([selected][variant=warning]:not([disabled])) [part=base]:hover{background:var(--ig-warn-600);color:var(--ig-warn-700-contrast)}:host([variant=danger]) [part=base],:host([selected][variant=danger]:not([disabled])) [part=base]{color:var(--ig-error-700-contrast)}:host([variant=danger]) [part=base]:focus-within,:host([selected][variant=danger]:not([disabled])) [part=base]:focus-within{background:var(--ig-error-500);color:var(--ig-error-700-contrast);outline:.25rem solid hsl(from var(--ig-error-500) h s l/0.38)}:host([variant=danger]) [part=base]:hover,:host([selected][variant=danger]:not([disabled])) [part=base]:hover{background:var(--ig-error-600);color:var(--ig-error-700-contrast)}:host([outlined][variant=primary]) [part=base],:host([selected][outlined][variant=primary]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=primary]) [part=base]:hover,:host([selected][outlined][variant=primary]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-primary-600) h s l/0.3)}:host([outlined][variant=primary]) [part=base]:focus-within,:host([selected][outlined][variant=primary]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=info]) [part=base],:host([selected][outlined][variant=info]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=info]) [part=base]:hover,:host([selected][outlined][variant=info]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-info-600) h s l/0.3)}:host([outlined][variant=info]) [part=base]:focus-within,:host([selected][outlined][variant=info]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=success]) [part=base],:host([selected][outlined][variant=success]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=success]) [part=base]:hover,:host([selected][outlined][variant=success]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-success-600) h s l/0.3)}:host([outlined][variant=success]) [part=base]:focus-within,:host([selected][outlined][variant=success]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) [part=base],:host([selected][outlined][variant=warning]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) [part=base]:hover,:host([selected][outlined][variant=warning]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-warn-600) h s l/0.3)}:host([outlined][variant=warning]) [part=base]:focus-within,:host([selected][outlined][variant=warning]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) [part=base],:host([selected][outlined][variant=danger]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) [part=base]:hover,:host([selected][outlined][variant=danger]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-error-600) h s l/0.3)}:host([outlined][variant=danger]) [part=base]:focus-within,:host([selected][outlined][variant=danger]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}`;
 //# sourceMappingURL=chip.bootstrap.css.js.map

package/components/chip/themes/shared/chip.bootstrap.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.bootstrap.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,+9JAA+9J,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size))}:host button:focus{outline:.25rem solid var(--focus-shadow-color)}:host([selected]) button:not([disabled]):focus{outline:.25rem solid var(--focus-selected-shadow-color)}:host([variant=primary]) button,:host([selected][variant=primary]) button:not([disabled]){color:var(--ig-primary-700-contrast)}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{background:var(--ig-primary-500);color:var(--ig-primary-700-contrast);outline:.25rem solid hsl(from var(--ig-primary-500) h s l/0.38)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{background:var(--ig-primary-600);color:var(--ig-primary-700-contrast)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){color:var(--ig-info-700-contrast)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:var(--ig-info-500);color:var(--ig-info-700-contrast);outline:.25rem solid hsl(from var(--ig-info-500) h s l/0.38)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:var(--ig-info-600);color:var(--ig-info-700-contrast)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){color:var(--ig-success-700-contrast)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{background:var(--ig-success-500);color:var(--ig-success-700-contrast);outline:.25rem solid hsl(from var(--ig-success-500) h s l/0.38)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:var(--ig-success-600);color:var(--ig-success-700-contrast)}:host([variant=warning]) button,:host([selected][variant=warning]) button:not([disabled]){color:var(--ig-warn-700-contrast)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:var(--ig-warn-500);color:var(--ig-warn-700-contrast);outline:.25rem solid hsl(from var(--ig-warn-500) h s l/0.38)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:var(--ig-warn-600);color:var(--ig-warn-700-contrast)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){color:var(--ig-error-700-contrast)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:var(--ig-error-500);color:var(--ig-error-700-contrast);outline:.25rem solid hsl(from var(--ig-error-500) h s l/0.38)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:var(--ig-error-600);color:var(--ig-error-700-contrast)}:host([outlined][variant=primary]) button,:host([selected][outlined][variant=primary]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=primary]) button:hover,:host([selected][outlined][variant=primary]) button:not([disabled]):hover{background:hsl(from var(--ig-primary-600) h s l/0.3)}:host([outlined][variant=primary]) button:focus,:host([selected][outlined][variant=primary]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=info]) button,:host([selected][outlined][variant=info]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=info]) button:hover,:host([selected][outlined][variant=info]) button:not([disabled]):hover{background:hsl(from var(--ig-info-600) h s l/0.3)}:host([outlined][variant=info]) button:focus,:host([selected][outlined][variant=info]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=success]) button,:host([selected][outlined][variant=success]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=success]) button:hover,:host([selected][outlined][variant=success]) button:not([disabled]):hover{background:hsl(from var(--ig-success-600) h s l/0.3)}:host([outlined][variant=success]) button:focus,:host([selected][outlined][variant=success]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) button,:host([selected][outlined][variant=warning]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=warning]) button:hover,:host([selected][outlined][variant=warning]) button:not([disabled]):hover{background:hsl(from var(--ig-warn-600) h s l/0.3)}:host([outlined][variant=warning]) button:focus,:host([selected][outlined][variant=warning]) button:not([disabled]):focus{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) button,:host([selected][outlined][variant=danger]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=danger]) button:hover,:host([selected][outlined][variant=danger]) button:not([disabled]):hover{background:hsl(from var(--ig-error-600) h s l/0.3)}:host([outlined][variant=danger]) button:focus,:host([selected][outlined][variant=danger]) button:not([disabled]):focus{background:rgba(0,0,0,0)}`;\n  "]}
+{"version":3,"file":"chip.bootstrap.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.bootstrap.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,+6KAA+6K,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size))}:host [part=base]:focus-within{outline:.25rem solid var(--focus-shadow-color)}:host([selected]:not([disabled])) [part=base]:focus-within{outline:.25rem solid var(--focus-selected-shadow-color)}:host([variant=primary]) [part=base],:host([selected][variant=primary]:not([disabled])) [part=base]{color:var(--ig-primary-700-contrast)}:host([variant=primary]) [part=base]:focus-within,:host([selected][variant=primary]:not([disabled])) [part=base]:focus-within{background:var(--ig-primary-500);color:var(--ig-primary-700-contrast);outline:.25rem solid hsl(from var(--ig-primary-500) h s l/0.38)}:host([variant=primary]) [part=base]:hover,:host([selected][variant=primary]:not([disabled])) [part=base]:hover{background:var(--ig-primary-600);color:var(--ig-primary-700-contrast)}:host([variant=info]) [part=base],:host([selected][variant=info]:not([disabled])) [part=base]{color:var(--ig-info-700-contrast)}:host([variant=info]) [part=base]:focus-within,:host([selected][variant=info]:not([disabled])) [part=base]:focus-within{background:var(--ig-info-500);color:var(--ig-info-700-contrast);outline:.25rem solid hsl(from var(--ig-info-500) h s l/0.38)}:host([variant=info]) [part=base]:hover,:host([selected][variant=info]:not([disabled])) [part=base]:hover{background:var(--ig-info-600);color:var(--ig-info-700-contrast)}:host([variant=success]) [part=base],:host([selected][variant=success]:not([disabled])) [part=base]{color:var(--ig-success-700-contrast)}:host([variant=success]) [part=base]:focus-within,:host([selected][variant=success]:not([disabled])) [part=base]:focus-within{background:var(--ig-success-500);color:var(--ig-success-700-contrast);outline:.25rem solid hsl(from var(--ig-success-500) h s l/0.38)}:host([variant=success]) [part=base]:hover,:host([selected][variant=success]:not([disabled])) [part=base]:hover{background:var(--ig-success-600);color:var(--ig-success-700-contrast)}:host([variant=warning]) [part=base],:host([selected][variant=warning]:not([disabled])) [part=base]{color:var(--ig-warn-700-contrast)}:host([variant=warning]) [part=base]:focus-within,:host([selected][variant=warning]:not([disabled])) [part=base]:focus-within{background:var(--ig-warn-500);color:var(--ig-warn-700-contrast);outline:.25rem solid hsl(from var(--ig-warn-500) h s l/0.38)}:host([variant=warning]) [part=base]:hover,:host([selected][variant=warning]:not([disabled])) [part=base]:hover{background:var(--ig-warn-600);color:var(--ig-warn-700-contrast)}:host([variant=danger]) [part=base],:host([selected][variant=danger]:not([disabled])) [part=base]{color:var(--ig-error-700-contrast)}:host([variant=danger]) [part=base]:focus-within,:host([selected][variant=danger]:not([disabled])) [part=base]:focus-within{background:var(--ig-error-500);color:var(--ig-error-700-contrast);outline:.25rem solid hsl(from var(--ig-error-500) h s l/0.38)}:host([variant=danger]) [part=base]:hover,:host([selected][variant=danger]:not([disabled])) [part=base]:hover{background:var(--ig-error-600);color:var(--ig-error-700-contrast)}:host([outlined][variant=primary]) [part=base],:host([selected][outlined][variant=primary]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=primary]) [part=base]:hover,:host([selected][outlined][variant=primary]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-primary-600) h s l/0.3)}:host([outlined][variant=primary]) [part=base]:focus-within,:host([selected][outlined][variant=primary]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=info]) [part=base],:host([selected][outlined][variant=info]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=info]) [part=base]:hover,:host([selected][outlined][variant=info]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-info-600) h s l/0.3)}:host([outlined][variant=info]) [part=base]:focus-within,:host([selected][outlined][variant=info]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=success]) [part=base],:host([selected][outlined][variant=success]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=success]) [part=base]:hover,:host([selected][outlined][variant=success]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-success-600) h s l/0.3)}:host([outlined][variant=success]) [part=base]:focus-within,:host([selected][outlined][variant=success]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) [part=base],:host([selected][outlined][variant=warning]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) [part=base]:hover,:host([selected][outlined][variant=warning]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-warn-600) h s l/0.3)}:host([outlined][variant=warning]) [part=base]:focus-within,:host([selected][outlined][variant=warning]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) [part=base],:host([selected][outlined][variant=danger]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) [part=base]:hover,:host([selected][outlined][variant=danger]:not([disabled])) [part=base]:hover{background:hsl(from var(--ig-error-600) h s l/0.3)}:host([outlined][variant=danger]) [part=base]:focus-within,:host([selected][outlined][variant=danger]:not([disabled])) [part=base]:focus-within{background:rgba(0,0,0,0)}`;\n  "]}

package/components/chip/themes/shared/chip.common.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));--chip-size: var(--component-size)}:host button{border-radius:var(--border-radius);background:var(--background);color:var(--text-color);outline:none;height:var(--size)}:host button [part=content]{padding-inline:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host button:focus{background:var(--focus-background);color:var(--focus-text-color)}:host button:hover{background:var(--hover-background);color:var(--hover-text-color)}:host button[disabled]{background:var(--disabled-background);color:var(--disabled-text-color)}:host button ::slotted([slot=remove]){color:var(--remove-icon-color)}:host button ::slotted([slot=remove]):focus-within{color:var(--remove-icon-color-focus)}:host button slot[name=remove] igc-icon,:host button slot[name=remove] ::slotted(igc-icon){color:var(--remove-icon-color)}:host button slot[name=remove]:focus-within igc-icon,:host button slot[name=remove]:focus-within ::slotted(igc-icon){color:var(--remove-icon-color-focus)}:host button igc-icon,:host button ::slotted(igc-icon){--component-size: var(--chip-size)}:host button ::slotted(*){--default-size: var(--chip-size);display:inline-flex;place-items:center}:host button ::slotted(igc-avatar){--size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host button ::slotted(igc-circular-progress){--diameter: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]) button:not([disabled]){background:var(--selected-background);color:var(--selected-text-color)}:host([selected]) button:not([disabled]):focus{background:var(--focus-selected-background);color:var(--focus-selected-text-color)}:host([selected]) button:not([disabled]):hover{background:var(--hover-selected-background);color:var(--hover-selected-text-color)}:host([selected]) button[disabled]{background:var(--disabled-selected-background);color:var(--disabled-selected-text-color)}:host([outlined]) button{background:var(--outlined-background);color:var(--outlined-text-color);border:.0625rem solid var(--border-color)}:host([outlined]) button:focus{background:var(--focus-outlined-background);color:var(--focus-outlined-text-color);border-color:var(--focus-border-color)}:host([outlined]) button:hover{background:var(--hover-outlined-background);color:var(--hover-outlined-text-color);border-color:var(--hover-border-color)}:host([outlined]) button[disabled]{background:var(--disabled-outlined-background);color:var(--disabled-outlined-text-color);border-color:var(--disabled-border-color)}:host([selected][outlined]) button:not([disabled]){background:var(--selected-outlined-background);color:var(--selected-outlined-text-color);border-color:var(--selected-border-color)}:host([selected][outlined]) button:not([disabled]):focus{background:var(--focus-selected-outlined-background);color:var(--focus-selected-outlined-text-color);border-color:var(--focus-selected-border-color)}:host([selected][outlined]) button:not([disabled]):hover{background:var(--hover-selected-outlined-background);color:var(--hover-selected-outlined-text-color);border-color:var(--hover-selected-border-color)}:host([selected][outlined]) button[disabled]{background:var(--disabled-selected-outlined-background);color:var(--disabled-selected-outlined-text-color);border-color:var(--disabled-selected-border-color)}`;
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));--chip-size: var(--component-size)}:host [part=base]{border-radius:var(--border-radius);background:var(--background);color:var(--text-color);outline:none;height:var(--size)}:host [part=base] [part=content]{padding-inline:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host [part=base]:focus-within{background:var(--focus-background);color:var(--focus-text-color)}:host [part=base]:hover{background:var(--hover-background);color:var(--hover-text-color)}:host [part=base] ::slotted([slot=remove]){color:var(--remove-icon-color)}:host [part=base] ::slotted([slot=remove]):focus-within{color:var(--remove-icon-color-focus)}:host [part=base] slot[name=remove] igc-icon,:host [part=base] slot[name=remove] ::slotted(igc-icon){color:var(--remove-icon-color)}:host [part=base] slot[name=remove]:focus-within igc-icon,:host [part=base] slot[name=remove]:focus-within ::slotted(igc-icon){color:var(--remove-icon-color-focus)}:host [part=base] igc-icon,:host [part=base] ::slotted(igc-icon){--component-size: var(--chip-size)}:host [part=base] ::slotted(*){--default-size: var(--chip-size);display:inline-flex;place-items:center}:host [part=base] ::slotted(igc-avatar){--size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host [part=base] ::slotted(igc-circular-progress){--diameter: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([disabled]) [part=base]{background:var(--disabled-background);color:var(--disabled-text-color)}:host([selected]:not([disabled])) [part=base]{background:var(--selected-background);color:var(--selected-text-color)}:host([selected]:not([disabled])) [part=base]:focus-within{background:var(--focus-selected-background);color:var(--focus-selected-text-color)}:host([selected]:not([disabled])) [part=base]:hover{background:var(--hover-selected-background);color:var(--hover-selected-text-color)}:host([selected][disabled]) [part=base]{background:var(--disabled-selected-background);color:var(--disabled-selected-text-color)}:host([outlined]) [part=base]{background:var(--outlined-background);color:var(--outlined-text-color);border:.0625rem solid var(--border-color)}:host([outlined]) [part=base]:focus-within{background:var(--focus-outlined-background);color:var(--focus-outlined-text-color);border-color:var(--focus-border-color)}:host([outlined]) [part=base]:hover{background:var(--hover-outlined-background);color:var(--hover-outlined-text-color);border-color:var(--hover-border-color)}:host([outlined][disabled]) [part=base]{background:var(--disabled-outlined-background);color:var(--disabled-outlined-text-color);border-color:var(--disabled-border-color)}:host([selected][outlined]:not([disabled])) [part=base]{background:var(--selected-outlined-background);color:var(--selected-outlined-text-color);border-color:var(--selected-border-color)}:host([selected][outlined]:not([disabled])) [part=base]:focus-within{background:var(--focus-selected-outlined-background);color:var(--focus-selected-outlined-text-color);border-color:var(--focus-selected-border-color)}:host([selected][outlined]:not([disabled])) [part=base]:hover{background:var(--hover-selected-outlined-background);color:var(--hover-selected-outlined-text-color);border-color:var(--hover-selected-border-color)}:host([selected][outlined][disabled]) [part=base]{background:var(--disabled-selected-outlined-background);color:var(--disabled-selected-outlined-text-color);border-color:var(--disabled-selected-border-color)}`;
 //# sourceMappingURL=chip.common.css.js.map

package/components/chip/themes/shared/chip.common.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.common.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.common.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,qwHAAqwH,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size));--chip-size: var(--component-size)}:host button{border-radius:var(--border-radius);background:var(--background);color:var(--text-color);outline:none;height:var(--size)}:host button [part=content]{padding-inline:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host button:focus{background:var(--focus-background);color:var(--focus-text-color)}:host button:hover{background:var(--hover-background);color:var(--hover-text-color)}:host button[disabled]{background:var(--disabled-background);color:var(--disabled-text-color)}:host button ::slotted([slot=remove]){color:var(--remove-icon-color)}:host button ::slotted([slot=remove]):focus-within{color:var(--remove-icon-color-focus)}:host button slot[name=remove] igc-icon,:host button slot[name=remove] ::slotted(igc-icon){color:var(--remove-icon-color)}:host button slot[name=remove]:focus-within igc-icon,:host button slot[name=remove]:focus-within ::slotted(igc-icon){color:var(--remove-icon-color-focus)}:host button igc-icon,:host button ::slotted(igc-icon){--component-size: var(--chip-size)}:host button ::slotted(*){--default-size: var(--chip-size);display:inline-flex;place-items:center}:host button ::slotted(igc-avatar){--size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host button ::slotted(igc-circular-progress){--diameter: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]) button:not([disabled]){background:var(--selected-background);color:var(--selected-text-color)}:host([selected]) button:not([disabled]):focus{background:var(--focus-selected-background);color:var(--focus-selected-text-color)}:host([selected]) button:not([disabled]):hover{background:var(--hover-selected-background);color:var(--hover-selected-text-color)}:host([selected]) button[disabled]{background:var(--disabled-selected-background);color:var(--disabled-selected-text-color)}:host([outlined]) button{background:var(--outlined-background);color:var(--outlined-text-color);border:.0625rem solid var(--border-color)}:host([outlined]) button:focus{background:var(--focus-outlined-background);color:var(--focus-outlined-text-color);border-color:var(--focus-border-color)}:host([outlined]) button:hover{background:var(--hover-outlined-background);color:var(--hover-outlined-text-color);border-color:var(--hover-border-color)}:host([outlined]) button[disabled]{background:var(--disabled-outlined-background);color:var(--disabled-outlined-text-color);border-color:var(--disabled-border-color)}:host([selected][outlined]) button:not([disabled]){background:var(--selected-outlined-background);color:var(--selected-outlined-text-color);border-color:var(--selected-border-color)}:host([selected][outlined]) button:not([disabled]):focus{background:var(--focus-selected-outlined-background);color:var(--focus-selected-outlined-text-color);border-color:var(--focus-selected-border-color)}:host([selected][outlined]) button:not([disabled]):hover{background:var(--hover-selected-outlined-background);color:var(--hover-selected-outlined-text-color);border-color:var(--hover-selected-border-color)}:host([selected][outlined]) button[disabled]{background:var(--disabled-selected-outlined-background);color:var(--disabled-selected-outlined-text-color);border-color:var(--disabled-selected-border-color)}`;\n  "]}
+{"version":3,"file":"chip.common.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.common.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,+6HAA+6H,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size));--chip-size: var(--component-size)}:host [part=base]{border-radius:var(--border-radius);background:var(--background);color:var(--text-color);outline:none;height:var(--size)}:host [part=base] [part=content]{padding-inline:max(var(--is-large, 1)*max(0.5rem, -1 * 0.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(0.375rem, -1 * 0.375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(0.1875rem, -1 * 0.1875rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host [part=base]:focus-within{background:var(--focus-background);color:var(--focus-text-color)}:host [part=base]:hover{background:var(--hover-background);color:var(--hover-text-color)}:host [part=base] ::slotted([slot=remove]){color:var(--remove-icon-color)}:host [part=base] ::slotted([slot=remove]):focus-within{color:var(--remove-icon-color-focus)}:host [part=base] slot[name=remove] igc-icon,:host [part=base] slot[name=remove] ::slotted(igc-icon){color:var(--remove-icon-color)}:host [part=base] slot[name=remove]:focus-within igc-icon,:host [part=base] slot[name=remove]:focus-within ::slotted(igc-icon){color:var(--remove-icon-color-focus)}:host [part=base] igc-icon,:host [part=base] ::slotted(igc-icon){--component-size: var(--chip-size)}:host [part=base] ::slotted(*){--default-size: var(--chip-size);display:inline-flex;place-items:center}:host [part=base] ::slotted(igc-avatar){--size: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host [part=base] ::slotted(igc-circular-progress){--diameter: max(var(--is-large, 1) * max(1.5rem, -1 * 1.5rem), var(--is-medium, 1) * max(1.125rem, -1 * 1.125rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([disabled]) [part=base]{background:var(--disabled-background);color:var(--disabled-text-color)}:host([selected]:not([disabled])) [part=base]{background:var(--selected-background);color:var(--selected-text-color)}:host([selected]:not([disabled])) [part=base]:focus-within{background:var(--focus-selected-background);color:var(--focus-selected-text-color)}:host([selected]:not([disabled])) [part=base]:hover{background:var(--hover-selected-background);color:var(--hover-selected-text-color)}:host([selected][disabled]) [part=base]{background:var(--disabled-selected-background);color:var(--disabled-selected-text-color)}:host([outlined]) [part=base]{background:var(--outlined-background);color:var(--outlined-text-color);border:.0625rem solid var(--border-color)}:host([outlined]) [part=base]:focus-within{background:var(--focus-outlined-background);color:var(--focus-outlined-text-color);border-color:var(--focus-border-color)}:host([outlined]) [part=base]:hover{background:var(--hover-outlined-background);color:var(--hover-outlined-text-color);border-color:var(--hover-border-color)}:host([outlined][disabled]) [part=base]{background:var(--disabled-outlined-background);color:var(--disabled-outlined-text-color);border-color:var(--disabled-border-color)}:host([selected][outlined]:not([disabled])) [part=base]{background:var(--selected-outlined-background);color:var(--selected-outlined-text-color);border-color:var(--selected-border-color)}:host([selected][outlined]:not([disabled])) [part=base]:focus-within{background:var(--focus-selected-outlined-background);color:var(--focus-selected-outlined-text-color);border-color:var(--focus-selected-border-color)}:host([selected][outlined]:not([disabled])) [part=base]:hover{background:var(--hover-selected-outlined-background);color:var(--hover-selected-outlined-text-color);border-color:var(--hover-selected-border-color)}:host([selected][outlined][disabled]) [part=base]{background:var(--disabled-selected-outlined-background);color:var(--disabled-selected-outlined-text-color);border-color:var(--disabled-selected-border-color)}`;\n  "]}

package/components/chip/themes/shared/chip.fluent.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host button{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom)}:host([outlined][variant=primary]) button,:host([selected][outlined][variant=primary]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=info]) button,:host([selected][outlined][variant=info]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=success]) button,:host([selected][outlined][variant=success]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=warning]) button,:host([selected][outlined][variant=warning]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=danger]) button,:host([selected][outlined][variant=danger]) button:not([disabled]){background:rgba(0,0,0,0)}`;
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host [part=base]{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom)}:host([outlined][variant=primary]) [part=base],:host([selected][outlined][variant=primary]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=info]) [part=base],:host([selected][outlined][variant=info]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=success]) [part=base],:host([selected][outlined][variant=success]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) [part=base],:host([selected][outlined][variant=warning]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) [part=base],:host([selected][outlined][variant=danger]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}`;
 //# sourceMappingURL=chip.fluent.css.js.map

package/components/chip/themes/shared/chip.fluent.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.fluent.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,0pCAA0pC,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size))}:host button{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom)}:host([outlined][variant=primary]) button,:host([selected][outlined][variant=primary]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=info]) button,:host([selected][outlined][variant=info]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=success]) button,:host([selected][outlined][variant=success]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=warning]) button,:host([selected][outlined][variant=warning]) button:not([disabled]){background:rgba(0,0,0,0)}:host([outlined][variant=danger]) button,:host([selected][outlined][variant=danger]) button:not([disabled]){background:rgba(0,0,0,0)}`;\n  "]}
+{"version":3,"file":"chip.fluent.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.fluent.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,itCAAitC,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size))}:host [part=base]{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom)}:host([outlined][variant=primary]) [part=base],:host([selected][outlined][variant=primary]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=info]) [part=base],:host([selected][outlined][variant=info]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=success]) [part=base],:host([selected][outlined][variant=success]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=warning]) [part=base],:host([selected][outlined][variant=warning]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}:host([outlined][variant=danger]) [part=base],:host([selected][outlined][variant=danger]:not([disabled])) [part=base]{background:rgba(0,0,0,0)}`;\n  "]}

package/components/chip/themes/shared/chip.indigo.css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const styles = css `:host{--component-size: var(--ig-size, var(--default-size))}:host button{padding:0 max(var(--is-large, 1)*max(7px, -1 * 7px)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(5px, -1 * 5px)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host button:focus{box-shadow:0 0 0 .1875rem var(--focus-shadow-color)}:host button igc-icon,:host button ::slotted(igc-icon){--size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(0.875rem, -1 * 0.875rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]) button:not([disabled]){color:var(--selected-text-color);background:var(--selected-background)}:host([selected]) button:not([disabled]):focus{box-shadow:0 0 0 .1875rem var(--focus-selected-shadow-color)}:host([selected]) button[disabled]{opacity:.4}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{color:var(--ig-primary-900-contrast);background:var(--ig-primary-500);box-shadow:0 0 0 .1875rem hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{color:var(--ig-primary-900-contrast);background:var(--ig-primary-400)}:host([variant=primary]) button[disabled],:host([selected][variant=primary]) button[disabled]{background:hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){color:var(--ig-info-900-contrast)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:var(--ig-info-500);color:var(--ig-info-900-contrast)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:var(--ig-info-400);color:var(--ig-info-900-contrast)}:host([variant=info]) button[disabled],:host([selected][variant=info]) button[disabled]{opacity:.4;color:var(--ig-info-900-contrast);background:var(--ig-info-500)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{color:var(--ig-success-900-contrast)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:var(--ig-success-700);color:var(--ig-success-900-contrast)}:host([variant=success]) button[disabled],:host([selected][variant=success]) button[disabled]{opacity:.4;color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:var(--ig-warn-500)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:var(--ig-warn-400)}:host([variant=warning]) button[disabled],:host([selected][variant=warning]) button[disabled]{opacity:.4;background:var(--ig-warn-500)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:var(--ig-error-600);color:var(--ig-error-900-contrast)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:var(--ig-error-500);color:var(--ig-error-900-contrast)}:host([variant=danger]) button[disabled],:host([selected][variant=danger]) button[disabled]{opacity:.4;color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([outlined][variant=primary]) button[disabled]{opacity:.4}`;
+export const styles = css `:host{--component-size: var(--ig-size, var(--default-size));--chip-padding-inline: max(var(--is-large, 1) * max(7px, -1 * 7px) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))), var(--is-medium, 1) * max(5px, -1 * 5px) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))), var(--is-small, 1) * max(3px, -1 * 3px) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host [part=base]:focus-within{box-shadow:0 0 0 .1875rem var(--focus-shadow-color)}:host [part=base] igc-icon,:host [part=base] ::slotted(igc-icon){--size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(0.875rem, -1 * 0.875rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]:not([disabled])) [part=base]{color:var(--selected-text-color);background:var(--selected-background)}:host([selected]:not([disabled])) [part=base]:focus-within{box-shadow:0 0 0 .1875rem var(--focus-selected-shadow-color)}:host([selected][disabled]) [part=base]{opacity:.4}:host([variant=primary]) [part=base]:focus-within,:host([selected][variant=primary]:not([disabled])) [part=base]:focus-within{color:var(--ig-primary-900-contrast);background:var(--ig-primary-500);box-shadow:0 0 0 .1875rem hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=primary]) [part=base]:hover,:host([selected][variant=primary]:not([disabled])) [part=base]:hover{color:var(--ig-primary-900-contrast);background:var(--ig-primary-400)}:host([variant=primary][disabled]) [part=base],:host([selected][variant=primary][disabled]) [part=base]{background:hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=info]) [part=base],:host([selected][variant=info]:not([disabled])) [part=base]{color:var(--ig-info-900-contrast)}:host([variant=info]) [part=base]:focus-within,:host([selected][variant=info]:not([disabled])) [part=base]:focus-within{background:var(--ig-info-500);color:var(--ig-info-900-contrast)}:host([variant=info]) [part=base]:hover,:host([selected][variant=info]:not([disabled])) [part=base]:hover{background:var(--ig-info-400);color:var(--ig-info-900-contrast)}:host([variant=info][disabled]) [part=base],:host([selected][variant=info][disabled]) [part=base]{opacity:.4;color:var(--ig-info-900-contrast);background:var(--ig-info-500)}:host([variant=success]) [part=base],:host([selected][variant=success]:not([disabled])) [part=base]{color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=success]) [part=base]:focus-within,:host([selected][variant=success]:not([disabled])) [part=base]:focus-within{color:var(--ig-success-900-contrast)}:host([variant=success]) [part=base]:hover,:host([selected][variant=success]:not([disabled])) [part=base]:hover{background:var(--ig-success-700);color:var(--ig-success-900-contrast)}:host([variant=success][disabled]) [part=base],:host([selected][variant=success][disabled]) [part=base]{opacity:.4;color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=warning]) [part=base]:focus-within,:host([selected][variant=warning]:not([disabled])) [part=base]:focus-within{background:var(--ig-warn-500)}:host([variant=warning]) [part=base]:hover,:host([selected][variant=warning]:not([disabled])) [part=base]:hover{background:var(--ig-warn-400)}:host([variant=warning][disabled]) [part=base],:host([selected][variant=warning][disabled]) [part=base]{opacity:.4;background:var(--ig-warn-500)}:host([variant=danger]) [part=base],:host([selected][variant=danger]:not([disabled])) [part=base]{color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([variant=danger]) [part=base]:focus-within,:host([selected][variant=danger]:not([disabled])) [part=base]:focus-within{background:var(--ig-error-600);color:var(--ig-error-900-contrast)}:host([variant=danger]) [part=base]:hover,:host([selected][variant=danger]:not([disabled])) [part=base]:hover{background:var(--ig-error-500);color:var(--ig-error-900-contrast)}:host([variant=danger][disabled]) [part=base],:host([selected][variant=danger][disabled]) [part=base]{opacity:.4;color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([outlined][variant=primary][disabled]) [part=base]{opacity:.4}`;
 //# sourceMappingURL=chip.indigo.css.js.map

package/components/chip/themes/shared/chip.indigo.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.indigo.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,m0HAAm0H,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size))}:host button{padding:0 max(var(--is-large, 1)*max(7px, -1 * 7px)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(5px, -1 * 5px)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(3px, -1 * 3px)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host button:focus{box-shadow:0 0 0 .1875rem var(--focus-shadow-color)}:host button igc-icon,:host button ::slotted(igc-icon){--size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(0.875rem, -1 * 0.875rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]) button:not([disabled]){color:var(--selected-text-color);background:var(--selected-background)}:host([selected]) button:not([disabled]):focus{box-shadow:0 0 0 .1875rem var(--focus-selected-shadow-color)}:host([selected]) button[disabled]{opacity:.4}:host([variant=primary]) button:focus,:host([selected][variant=primary]) button:not([disabled]):focus{color:var(--ig-primary-900-contrast);background:var(--ig-primary-500);box-shadow:0 0 0 .1875rem hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=primary]) button:hover,:host([selected][variant=primary]) button:not([disabled]):hover{color:var(--ig-primary-900-contrast);background:var(--ig-primary-400)}:host([variant=primary]) button[disabled],:host([selected][variant=primary]) button[disabled]{background:hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=info]) button,:host([selected][variant=info]) button:not([disabled]){color:var(--ig-info-900-contrast)}:host([variant=info]) button:focus,:host([selected][variant=info]) button:not([disabled]):focus{background:var(--ig-info-500);color:var(--ig-info-900-contrast)}:host([variant=info]) button:hover,:host([selected][variant=info]) button:not([disabled]):hover{background:var(--ig-info-400);color:var(--ig-info-900-contrast)}:host([variant=info]) button[disabled],:host([selected][variant=info]) button[disabled]{opacity:.4;color:var(--ig-info-900-contrast);background:var(--ig-info-500)}:host([variant=success]) button,:host([selected][variant=success]) button:not([disabled]){color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=success]) button:focus,:host([selected][variant=success]) button:not([disabled]):focus{color:var(--ig-success-900-contrast)}:host([variant=success]) button:hover,:host([selected][variant=success]) button:not([disabled]):hover{background:var(--ig-success-700);color:var(--ig-success-900-contrast)}:host([variant=success]) button[disabled],:host([selected][variant=success]) button[disabled]{opacity:.4;color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=warning]) button:focus,:host([selected][variant=warning]) button:not([disabled]):focus{background:var(--ig-warn-500)}:host([variant=warning]) button:hover,:host([selected][variant=warning]) button:not([disabled]):hover{background:var(--ig-warn-400)}:host([variant=warning]) button[disabled],:host([selected][variant=warning]) button[disabled]{opacity:.4;background:var(--ig-warn-500)}:host([variant=danger]) button,:host([selected][variant=danger]) button:not([disabled]){color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([variant=danger]) button:focus,:host([selected][variant=danger]) button:not([disabled]):focus{background:var(--ig-error-600);color:var(--ig-error-900-contrast)}:host([variant=danger]) button:hover,:host([selected][variant=danger]) button:not([disabled]):hover{background:var(--ig-error-500);color:var(--ig-error-900-contrast)}:host([variant=danger]) button[disabled],:host([selected][variant=danger]) button[disabled]{opacity:.4;color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([outlined][variant=primary]) button[disabled]{opacity:.4}`;\n  "]}
+{"version":3,"file":"chip.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/chip/themes/shared/chip.indigo.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,4nIAA4nI,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--component-size: var(--ig-size, var(--default-size));--chip-padding-inline: max(var(--is-large, 1) * max(7px, -1 * 7px) * var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))), var(--is-medium, 1) * max(5px, -1 * 5px) * var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))), var(--is-small, 1) * max(3px, -1 * 3px) * var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}:host [part=base]:focus-within{box-shadow:0 0 0 .1875rem var(--focus-shadow-color)}:host [part=base] igc-icon,:host [part=base] ::slotted(igc-icon){--size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(0.875rem, -1 * 0.875rem), var(--is-small, 1) * max(0.875rem, -1 * 0.875rem))}:host([selected]:not([disabled])) [part=base]{color:var(--selected-text-color);background:var(--selected-background)}:host([selected]:not([disabled])) [part=base]:focus-within{box-shadow:0 0 0 .1875rem var(--focus-selected-shadow-color)}:host([selected][disabled]) [part=base]{opacity:.4}:host([variant=primary]) [part=base]:focus-within,:host([selected][variant=primary]:not([disabled])) [part=base]:focus-within{color:var(--ig-primary-900-contrast);background:var(--ig-primary-500);box-shadow:0 0 0 .1875rem hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=primary]) [part=base]:hover,:host([selected][variant=primary]:not([disabled])) [part=base]:hover{color:var(--ig-primary-900-contrast);background:var(--ig-primary-400)}:host([variant=primary][disabled]) [part=base],:host([selected][variant=primary][disabled]) [part=base]{background:hsl(from var(--ig-primary-400) h s l/0.5)}:host([variant=info]) [part=base],:host([selected][variant=info]:not([disabled])) [part=base]{color:var(--ig-info-900-contrast)}:host([variant=info]) [part=base]:focus-within,:host([selected][variant=info]:not([disabled])) [part=base]:focus-within{background:var(--ig-info-500);color:var(--ig-info-900-contrast)}:host([variant=info]) [part=base]:hover,:host([selected][variant=info]:not([disabled])) [part=base]:hover{background:var(--ig-info-400);color:var(--ig-info-900-contrast)}:host([variant=info][disabled]) [part=base],:host([selected][variant=info][disabled]) [part=base]{opacity:.4;color:var(--ig-info-900-contrast);background:var(--ig-info-500)}:host([variant=success]) [part=base],:host([selected][variant=success]:not([disabled])) [part=base]{color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=success]) [part=base]:focus-within,:host([selected][variant=success]:not([disabled])) [part=base]:focus-within{color:var(--ig-success-900-contrast)}:host([variant=success]) [part=base]:hover,:host([selected][variant=success]:not([disabled])) [part=base]:hover{background:var(--ig-success-700);color:var(--ig-success-900-contrast)}:host([variant=success][disabled]) [part=base],:host([selected][variant=success][disabled]) [part=base]{opacity:.4;color:var(--ig-success-900-contrast);background:var(--ig-success-800)}:host([variant=warning]) [part=base]:focus-within,:host([selected][variant=warning]:not([disabled])) [part=base]:focus-within{background:var(--ig-warn-500)}:host([variant=warning]) [part=base]:hover,:host([selected][variant=warning]:not([disabled])) [part=base]:hover{background:var(--ig-warn-400)}:host([variant=warning][disabled]) [part=base],:host([selected][variant=warning][disabled]) [part=base]{opacity:.4;background:var(--ig-warn-500)}:host([variant=danger]) [part=base],:host([selected][variant=danger]:not([disabled])) [part=base]{color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([variant=danger]) [part=base]:focus-within,:host([selected][variant=danger]:not([disabled])) [part=base]:focus-within{background:var(--ig-error-600);color:var(--ig-error-900-contrast)}:host([variant=danger]) [part=base]:hover,:host([selected][variant=danger]:not([disabled])) [part=base]:hover{background:var(--ig-error-500);color:var(--ig-error-900-contrast)}:host([variant=danger][disabled]) [part=base],:host([selected][variant=danger][disabled]) [part=base]{opacity:.4;color:var(--ig-error-900-contrast);background:var(--ig-error-600)}:host([outlined][variant=primary][disabled]) [part=base]{opacity:.4}`;\n  "]}

package/components/color-picker/color-picker.d.ts

@@ -2,7 +2,7 @@ import { type PropertyValues, type TemplateResult } from 'lit';
 import { IgcBaseComboBoxComponent } from '#internals/mixins/combo-box.js';
 import type { AbstractConstructor } from '#internals/mixins/constructor.js';
 import type { ColorFormat, ColorPickerMode } from '../types.js';
-export interface IgcColorPickerEventMap {
+export interface IgcColorPickerComponentEventMap {
     igcOpening: CustomEvent<void>;
     igcOpened: CustomEvent<void>;
     igcClosing: CustomEvent<void>;
@@ -10,7 +10,7 @@ export interface IgcColorPickerEventMap {
     igcInput: CustomEvent<string>;
     igcChange: CustomEvent<string>;
 }
-declare const IgcColorPickerComponent_base: import("#internals/mixins/constructor.js").Constructor<import("../../internals/mixins/forms/types.js").FormRequiredInterface & import("../../internals/mixins/forms/types.js").FormAssociatedElementInterface> & import("#internals/mixins/constructor.js").Constructor<import("#internals/mixins/event-emitter.js").EventEmitterInterface<IgcColorPickerEventMap>> & AbstractConstructor<IgcBaseComboBoxComponent>;
+declare const IgcColorPickerComponent_base: import("#internals/mixins/constructor.js").Constructor<import("../../internals/mixins/forms/types.js").FormRequiredInterface & import("../../internals/mixins/forms/types.js").FormAssociatedElementInterface> & import("#internals/mixins/constructor.js").Constructor<import("#internals/mixins/event-emitter.js").EventEmitterInterface<IgcColorPickerComponentEventMap>> & AbstractConstructor<IgcBaseComboBoxComponent>;
 /**
  * Color input component.
  *

package/components/color-picker/color-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker.js","sourceRoot":"","sources":["../../../src/components/color-picker/color-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, type PropertyValues, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addAriaProjector } from '#internals/controllers/aria-projection.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowRight,\n  arrowUp,\n  endKey,\n  escapeKey,\n} from '#internals/controllers/key-bindings.js';\nimport { addRootClickController } from '#internals/controllers/root-click.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { shadowOptions } from '#internals/decorators/shadow-options.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { IgcBaseComboBoxComponent } from '#internals/mixins/combo-box.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { partMap } from '#internals/part-map.js';\nimport { isEmpty } from '#internals/utils/arrays.js';\nimport {\n  addSafeEventListener,\n  focusLeftHost,\n  getElementFromPath,\n  stopPropagation,\n} from '#internals/utils/events.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { asNumber, clamp } from '#internals/utils/math.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport IgcDividerComponent from '../divider/divider.js';\nimport IgcFocusTrapComponent from '../focus-trap/focus-trap.js';\nimport IgcInputComponent from '../input/input.js';\nimport IgcPopoverComponent from '../popover/popover.js';\nimport type IgcSelectItemComponent from '../select/select-item.js';\nimport IgcSelectComponent from '../select/select.js';\nimport type { ColorFormat, ColorPickerMode } from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport IgcVisuallyHiddenComponent from '../visually-hidden/visually-hidden.js';\nimport { isValidColor, normalizeColor } from './common.js';\nimport { ColorModel, getContext } from './model.js';\nimport IgcPickerCanvasComponent, {\n  type PickerCanvasEventDetail,\n} from './picker-canvas.js';\nimport { styles } from './themes/color-picker.base.css.js';\nimport { styles as shared } from './themes/shared/color-picker.common.css.js';\nimport { all } from './themes/themes.js';\nimport { colorPickerValidators } from './validators.js';\n\nexport interface IgcColorPickerEventMap {\n  igcOpening: CustomEvent<void>;\n  igcOpened: CustomEvent<void>;\n  igcClosing: CustomEvent<void>;\n  igcClosed: CustomEvent<void>;\n  igcInput: CustomEvent<string>;\n  igcChange: CustomEvent<string>;\n}\n\nconst Slots = setSlots(\n  'value-missing',\n  'custom-error',\n  'invalid',\n  'helper-text'\n);\n\n/** The color string shape of each format. Shown while the input is empty. */\nconst formatPlaceholders: Record<ColorFormat, string> = {\n  hex: '#rrggbb',\n  rgb: 'rgb(r g b)',\n  hsl: 'hsl(h s% l%)',\n};\n\n/** The alpha text is `<digits>%`. An edit removes every other character. */\nconst nonDigits = /\\D/g;\n\n/** The last caret offset in `<digits>%`, the position in front of the `%`. */\nfunction caretLimit(text: string): number {\n  return Math.max(text.length - 1, 0);\n}\n\n/**\n * The part of the EyeDropper API that this component uses.\n *\n * The type is declared locally, because the API is not in the baseline DOM\n * typings. Firefox and Safari do not implement it.\n */\ninterface EyeDropperLike {\n  open(): Promise<{ sRGBHex: string }>;\n}\n\ntype EyeDropperConstructor = new () => EyeDropperLike;\n\n/** Returns the EyeDropper constructor, if the browser provides one. */\nfunction getEyeDropper(): EyeDropperConstructor | undefined {\n  return (globalThis as { EyeDropper?: EyeDropperConstructor }).EyeDropper;\n}\n\n/**\n * Color input component.\n *\n * The user picks a color with the HSV saturation/value canvas, the hue slider\n * and the optional alpha slider. The user can also type a color string: hex,\n * rgb(a), hsl(a) or a named CSS color.\n *\n * The component supports pre-defined swatches and the native EyeDropper API,\n * where the browser provides one. The anchor is a trigger button\n * (`mode=\"default\"`) or an editable text field (`mode=\"input\"`).\n *\n * @element igc-color-picker\n *\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n * @slot helper-text - Renders content below the picker.\n *\n * @fires igcOpening - Emitted just before the picker dropdown is open.\n * @fires igcOpened - Emitted after the picker dropdown is open.\n * @fires igcClosing - Emitted just before the picker dropdown is closed.\n * @fires igcClosed - Emitted after closing the picker dropdown.\n * @fires igcInput - Emitted when the value of the component is changed.\n * @fires igcChange - Emitted when the value of the component is committed.\n *\n * @csspart anchor - The trigger element that opens the picker (the button in default mode, or the swatch prefix in input mode).\n * @csspart empty - Applied alongside `anchor` when no color value is set, rendering a checkered background.\n * @csspart label - The label rendered above the anchor in default mode.\n * @csspart picker - The popover container holding the canvas, sliders, inputs and swatches.\n * @csspart main-row - The row containing the hue slider and the copy/eyedropper buttons.\n * @csspart alpha-row - The row containing the alpha slider and input, rendered when `show-alpha` is set.\n * @csspart inputs-row - The row containing the format select and the color value input.\n * @csspart buttons - The wrapper around the copy and eyedropper buttons.\n * @csspart hue - The hue slider.\n * @csspart alpha - The alpha slider.\n * @csspart copy - The button that copies the current color value to the clipboard.\n * @csspart eye-dropper - The button that activates the EyeDropper API.\n * @csspart format-select - The select control used to switch the color string format.\n * @csspart swatches - The container of the pre-defined color swatches.\n * @csspart swatch - An individual color swatch button.\n */\n@shadowOptions({ delegatesFocus: true })\nexport default class IgcColorPickerComponent extends FormAssociatedRequiredMixin(\n  EventEmitterMixin<\n    IgcColorPickerEventMap,\n    AbstractConstructor<IgcBaseComboBoxComponent>\n  >(IgcBaseComboBoxComponent)\n) {\n  public static readonly tagName = 'igc-color-picker';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcColorPickerComponent,\n      IgcInputComponent,\n      IgcPopoverComponent,\n      IgcFocusTrapComponent,\n      IgcSelectComponent,\n      IgcPickerCanvasComponent,\n      IgcDividerComponent,\n      IgcButtonComponent,\n      IgcIconButtonComponent,\n      IgcValidationContainerComponent,\n      IgcVisuallyHiddenComponent\n    );\n  }\n\n  //#region Internal state and properties\n\n  protected override get __validators() {\n    return colorPickerValidators;\n  }\n\n  protected readonly _slots = addSlotController(this, { slots: Slots });\n\n  protected override readonly _rootClickController = addRootClickController(\n    this,\n    {\n      onHide: this._handleClosing,\n    }\n  );\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: '',\n  });\n\n  private readonly _alphaRef = createRef<HTMLInputElement>();\n  private readonly _alphaInputRef = createRef<IgcInputComponent>();\n  private readonly _canvasRef = createRef<IgcPickerCanvasComponent>();\n  private readonly _hueRef = createRef<HTMLInputElement>();\n  private readonly _anchorRef = createRef<\n    HTMLButtonElement | IgcInputComponent\n  >();\n\n  private readonly _supportsEyeDropper = Boolean(getEyeDropper());\n  private _color = ColorModel.empty();\n  private _oldValue = '';\n\n  /** The last value written for each host custom property. */\n  private readonly _appliedProperties = new Map<string, string>();\n\n  @query('#helper-text')\n  private readonly _helperText!: IgcValidationContainerComponent | null;\n\n  private get _isInputMode(): boolean {\n    return this.mode === 'input';\n  }\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /**\n   * The label of the component.\n   *\n   * In `mode=\"input\"` the component forwards the label to the anchor input.\n   * In `mode=\"default\"` it renders the label as a separate element.\n   * @attr label\n   */\n  @property()\n  public label?: string;\n\n  /**\n   * The value of the component as a CSS color string. Accepts hex, rgb(a),\n   * hsl(a) and named colors.\n   *\n   * An empty, whitespace-only or invalid string clears the value.\n   *\n   * @attr value\n   */\n  @property()\n  public set value(value: string) {\n    this._color = ColorModel.parse(value);\n    this._updateColor();\n  }\n\n  public get value(): string {\n    return this._formValue.value;\n  }\n\n  /**\n   * Sets the color format of the string value.\n   *\n   * A format change renders `value` in the new notation. The color does not\n   * change, so the component emits no `igcInput` or `igcChange`.\n   *\n   * @attr format\n   * @default 'hex'\n   */\n  @property()\n  public format: ColorFormat = 'hex';\n\n  /**\n   * Whether to hide the format picker buttons.\n   *\n   * @attr hide-formats\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-formats' })\n  public hideFormats = false;\n\n  /**\n   * Whether to show the alpha slider and input.\n   *\n   * @attr show-alpha\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'show-alpha' })\n  public showAlpha = false;\n\n  /**\n   * The mode of the color picker.\n   *\n   * In `\"default\"` mode the anchor is a trigger button. In `\"input\"` mode the\n   * anchor is an editable text field with a color swatch prefix. The prefix\n   * also opens the picker.\n   *\n   * @attr mode\n   * @default 'default'\n   */\n  @property({ reflect: true })\n  public mode: ColorPickerMode = 'default';\n\n  /**\n   * Pre-defined color strings. The component renders them as clickable\n   * swatches below the picker controls. A click on a swatch commits its color\n   * as the value.\n   */\n  @property({ attribute: false })\n  public swatches: string[] = [];\n\n  //#endregion\n\n  //#region Lifecycle\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n    addSafeEventListener(this, 'focusin', this._handleFocusIn);\n    addSafeEventListener(this, 'focusout', this._handleFocusOut);\n\n    addKeybindings(this, { skip: () => this.disabled })\n      .set(escapeKey, this._handleKeyboardClosing)\n      .set([altKey, arrowDown], this._handleAnchorClick)\n      .set([altKey, arrowUp], this._handleKeyboardClosing);\n\n    addKeybindings(this, {\n      skip: () => this.disabled || !this._alphaInputRef.value,\n      ref: this._alphaInputRef,\n      bindingDefaults: { repeat: true },\n    })\n      .set(arrowUp, () => this._handleAlphaInputSpin(1))\n      .set(arrowDown, () => this._handleAlphaInputSpin(-1))\n      .set(arrowRight, this._handleAlphaInputCaretForward, {\n        preventDefault: false,\n      })\n      .set(endKey, this._handleAlphaInputCaretForward, {\n        preventDefault: false,\n      });\n\n    addAriaProjector(this, {\n      target: () => (this._isInputMode ? this._anchorRef.value : null),\n      state: () => ({\n        hasPopup: 'dialog',\n        expanded: `${this.open}`,\n        labelledBy: this._internals.labels,\n        describedBy: this._helperText ? [this._helperText] : null,\n      }),\n    });\n  }\n\n  protected override update(props: PropertyValues<this>): void {\n    if (props.has('open')) {\n      this._rootClickController.update();\n    }\n\n    if (this.hasUpdated && props.has('format')) {\n      this._formValue.setValueAndFormState(this._color.asString(this.format));\n    }\n\n    this._applyColorProperties();\n\n    super.update(props);\n  }\n\n  protected override updated(props: PropertyValues<this>): void {\n    super.updated(props);\n\n    if (props.has('open') || props.has('value')) {\n      // Wait for the paint, then sync the marker position with the color.\n      requestAnimationFrame(() => this._syncCanvasPosition());\n    }\n  }\n\n  //#endregion\n\n  //#region Form associated overrides\n\n  protected override formResetCallback(): void {\n    super.formResetCallback();\n\n    if (this._isInputMode) {\n      const input = this._anchorRef.value as IgcInputComponent;\n      input?.['formResetCallback']();\n    }\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  private _handleClosing(): void {\n    this._hide(true);\n  }\n\n  private async _handleKeyboardClosing(): Promise<void> {\n    if (await this._hide(true)) {\n      this._anchorRef.value?.focus();\n    }\n  }\n\n  private _handleFocusIn(event: FocusEvent): void {\n    if (focusLeftHost(this, event)) {\n      this._oldValue = this._alphaColor;\n    }\n  }\n\n  private _handleFocusOut(event: FocusEvent): void {\n    if (!focusLeftHost(this, event)) {\n      return;\n    }\n\n    this._handleBlur();\n\n    if (this._alphaColor !== this._oldValue) {\n      this._oldValue = this._alphaColor;\n      this.emitEvent('igcChange', { detail: this.value });\n    }\n  }\n\n  private _handleCanvasColorPicked(\n    event: CustomEvent<PickerCanvasEventDetail>\n  ): void {\n    this._color.setSaturationAndValue(event.detail.x, 100 - event.detail.y);\n    this._updateColor();\n    this._emitInputEvent();\n  }\n\n  private _handleHueValueChange(event: Event): void {\n    stopPropagation(event);\n\n    this._color.h = asNumber(this._hueRef.value?.value);\n    this._updateColor();\n    this._emitInputEvent();\n  }\n\n  private _handleAlphaSliderValueChange(event: Event): void {\n    stopPropagation(event);\n\n    this._setAlpha(asNumber(this._alphaRef.value?.value));\n  }\n\n  /**\n   * Rewrites the alpha field as `<digits>%` after each edit.\n   *\n   * The `%` is part of the value and not a suffix element, so the browser\n   * treats it as editable text. This handler normalizes the result of an edit\n   * instead of a filter on the keystrokes in `beforeinput`. The `%` then\n   * behaves as a literal for each way that text reaches the field: typing,\n   * paste, drop, composition, undo and autofill. Of these, `beforeinput`\n   * carries `data` only for typing.\n   */\n  private _handleAlphaInputEdit(event: Event): void {\n    const input = this._alphaInputRef.value;\n    const native = getElementFromPath<HTMLInputElement>('input', event);\n\n    if (!input || !native) return;\n\n    const caret = native.selectionStart ?? native.value.length;\n    const typed = native.value.slice(0, caret).replace(nonDigits, '').length;\n    const digits = native.value.replace(nonDigits, '');\n    const percent = clamp(asNumber(digits), 0, 100);\n\n    const text = digits ? `${percent}%` : '';\n\n    this._writeAlphaText(input, text, Math.min(typed, caretLimit(text)));\n\n    if (digits) {\n      this._setAlpha(percent);\n    }\n  }\n\n  /**\n   * Keeps the caret and the selection inside the digits.\n   *\n   * The trailing `%` is a literal. Without this handler the caret goes after\n   * the `%` on focus, on a click past the text, and after a shifted selection\n   * extends over it. The handler therefore runs on `keyup` as well as on\n   * `focusin` and `click`. Text after the `%` falls outside the number, and the\n   * parse discards it.\n   */\n  private _handleAlphaInputCaret(event: Event): void {\n    const native = getElementFromPath<HTMLInputElement>('input', event);\n    if (!native) return;\n\n    const limit = caretLimit(native.value);\n\n    native.setSelectionRange(\n      Math.min(native.selectionStart ?? 0, limit),\n      Math.min(native.selectionEnd ?? 0, limit)\n    );\n  }\n\n  /**\n   * Steps the alpha by one percent.\n   *\n   * The step applies to the color and not to the text of the field. This keeps\n   * a held arrow key correct. The key downs repeat faster than a render, so the\n   * text of the field can be stale.\n   *\n   * The handler writes the new text and does not leave it to the render, so\n   * that the caret does not move. A value assignment puts the caret behind the\n   * `%`. A write from the render applies one frame after the keypress, which\n   * the user sees as a jump forward and back.\n   */\n  private _handleAlphaInputSpin(increment: -1 | 1): void {\n    const input = this._alphaInputRef.value;\n    const percent = clamp(this._alphaPercent + increment, 0, 100);\n\n    if (!input || percent === this._alphaPercent) return;\n\n    this._writeAlphaText(input, `${percent}%`);\n    this._setAlpha(percent);\n  }\n\n  /**\n   * Holds the caret at the `%`. Without this handler the caret steps past the\n   * `%`, and `keyup` pulls it back. This is the frame-late jump that\n   * {@link _handleAlphaInputSpin} describes.\n   */\n  private _handleAlphaInputCaretForward(event: KeyboardEvent): void {\n    const native = getElementFromPath<HTMLInputElement>('input', event);\n    if (!native) return;\n\n    const limit = caretLimit(native.value);\n\n    if (event.key === endKey || (native.selectionEnd ?? 0) >= limit) {\n      event.preventDefault();\n      native.setSelectionRange(limit, limit);\n    }\n  }\n\n  private _handleAlphaInputChange(event: CustomEvent<string>): void {\n    stopPropagation(event);\n\n    const input = event.target as IgcInputComponent;\n\n    if (!input.value) {\n      input.value = `${this._alphaPercent}%`;\n    }\n  }\n\n  private _handleFormatChange(\n    event: CustomEvent<IgcSelectItemComponent>\n  ): void {\n    stopPropagation(event);\n    this.format = event.detail.value as ColorFormat;\n  }\n\n  private _handleColorInputChange(event: CustomEvent<string>): void {\n    stopPropagation(event);\n\n    const input = event.target as IgcInputComponent;\n    const value = normalizeColor(event.detail);\n    const cleared = !value;\n\n    // An invalid and non-empty value reverts the input to the current color.\n    // An empty value clears the color.\n    if (!cleared && !isValidColor(value, getContext())) {\n      input.value = this._color.asString(this.format);\n      return;\n    }\n\n    this._color = cleared ? ColorModel.empty() : ColorModel.parse(value);\n    this._updateColor();\n    this._syncCanvasPosition();\n  }\n\n  private _handleEyeDropperClick(): void {\n    const EyeDropper = getEyeDropper();\n\n    if (!EyeDropper) return;\n\n    new EyeDropper()\n      .open()\n      .then((result) => {\n        this.value = result.sRGBHex;\n        this._emitInputEvent();\n      })\n      .catch(() => {});\n  }\n\n  private _handleCopy(): void {\n    navigator.clipboard?.writeText(this.value).catch(() => {});\n  }\n\n  private _handleSwatchClick(event: Event): void {\n    const swatch = getElementFromPath<HTMLButtonElement>(\n      'button[part=\"swatch\"]',\n      event\n    );\n    const color = swatch?.dataset.color;\n\n    if (color) {\n      this.value = color;\n      this._emitInputEvent();\n    }\n  }\n\n  //#endregion\n\n  //#region Internal methods\n\n  /**\n   * The current color with its alpha, in a notation that is independent of\n   * `format`.\n   */\n  private get _alphaColor(): string {\n    return this._color.asString('rgb', true);\n  }\n\n  /**\n   * The current color with an opaque alpha channel.\n   *\n   * The swatch preview paints this color over one half of its surface, and\n   * {@link _alphaColor} over the other half. A translucent color is then shown\n   * next to its opaque form. At full alpha the two halves are identical and the\n   * split is invisible, so opaque colors need no separate branch.\n   *\n   * This value is defined also with no color value. An empty color is white,\n   * which is where the alpha ramp and the canvas marker belong before the first\n   * pick. The anchor keeps its \"no color\" mark, because {@link _previewStyle}\n   * uses {@link _alphaColor}, which stays empty.\n   */\n  private get _opaqueColor(): string {\n    return new ColorModel(this._color.toRGB()).asString('rgb');\n  }\n\n  /** The alpha channel as the whole percentage that both alpha controls use. */\n  private get _alphaPercent(): number {\n    return Math.round(this._color.alpha * 100);\n  }\n\n  /** The pure hue that the saturation/value plane and the hue thumb use. */\n  private get _currentColor(): string {\n    return `hsl(${this._color.h} 100% 50%)`;\n  }\n\n  /**\n   * Mirrors the colors that the stylesheet needs onto the host.\n   *\n   * `update()` drives this, and not the handlers that change the color. It\n   * therefore also runs for the first render. A picker with no value calls none\n   * of those handlers, and the plane would keep the stylesheet fallback instead\n   * of its actual hue.\n   */\n  private _applyColorProperties(): void {\n    const properties = {\n      '--_current-color': this._currentColor,\n      '--_selected-color': this._opaqueColor,\n    };\n\n    for (const [name, value] of Object.entries(properties)) {\n      if (this._appliedProperties.get(name) !== value) {\n        this._appliedProperties.set(name, value);\n        this.style.setProperty(name, value);\n      }\n    }\n  }\n\n  /**\n   * Replaces the whole text of the alpha field and puts the caret in front of\n   * the `%` by default.\n   */\n  private _writeAlphaText(\n    input: IgcInputComponent,\n    text: string,\n    caret = caretLimit(text)\n  ): void {\n    input.setRangeText(text, 0, input.value.length);\n    input.setSelectionRange(caret, caret);\n  }\n\n  private _setAlpha(percent: number): void {\n    const alpha = clamp(percent, 0, 100) / 100;\n\n    if (this._color.alpha === alpha) {\n      return;\n    }\n\n    this._color.alpha = alpha;\n    this._updateColor();\n    this._emitInputEvent();\n  }\n\n  private _updateColor(): void {\n    this._formValue.setValueAndFormState(this._color.asString(this.format));\n    this.requestUpdate();\n  }\n\n  private _syncCanvasPosition(): void {\n    if (!this._canvasRef.value || !this.open) return;\n\n    const rect = this._canvasRef.value.getBoundingClientRect();\n    const { width: markerWidth, height: markerHeight } =\n      this._canvasRef.value.getMarkerDimensions();\n\n    const [, s, v] = this._color.toHSV();\n    const x = (s / 100) * rect.width - markerWidth;\n    const y = ((100 - v) / 100) * rect.height - markerHeight;\n\n    this._canvasRef.value.x = x;\n    this._canvasRef.value.y = y;\n  }\n\n  private _emitInputEvent(): void {\n    this.emitEvent('igcInput', { detail: this.value });\n  }\n\n  //#endregion\n\n  //#region Canvas area rendering\n\n  private _renderCanvasGradient(): TemplateResult {\n    const [, saturation, brightness] = this._color.toHSV();\n\n    return html`\n      <igc-picker-canvas\n        exportparts=\"marker, dragging\"\n        part=\"picker-canvas\"\n        ${ref(this._canvasRef)}\n        @igcColorPicked=${this._handleCanvasColorPicked}\n        currentColor=${this._currentColor}\n        markerColor=${this._opaqueColor}\n        .saturation=${saturation}\n        .brightness=${brightness}\n      >\n      </igc-picker-canvas>\n    `;\n  }\n\n  //#endregion\n\n  //#region Hue row and buttons rendering\n\n  private _renderHueSlider(): TemplateResult {\n    return html`\n      <input\n        ${ref(this._hueRef)}\n        aria-label=\"Hue\"\n        type=\"range\"\n        part=\"hue\"\n        min=\"0\"\n        max=\"360\"\n        .value=${String(Math.round(this._color.h))}\n        @input=${this._handleHueValueChange}\n        @change=${stopPropagation}\n      />\n    `;\n  }\n\n  private _renderIconButton(\n    part: string,\n    icon: string,\n    label: string,\n    handler: () => void,\n    disabled = false\n  ): TemplateResult {\n    return html`\n      <igc-icon-button\n        part=${part}\n        variant=\"flat\"\n        name=${icon}\n        ?disabled=${disabled}\n        @click=${handler}\n      >\n        <igc-visually-hidden>${label}</igc-visually-hidden>\n      </igc-icon-button>\n    `;\n  }\n\n  private _renderPickerButtons(): TemplateResult {\n    return html`\n      <div part=\"buttons\">\n        ${this._renderIconButton(\n          'copy',\n          'copy_content',\n          'Copy color value to clipboard',\n          this._handleCopy\n        )}\n        ${this._renderIconButton(\n          'eye-dropper',\n          'eye_dropper',\n          'Pick a color from the screen',\n          this._handleEyeDropperClick,\n          !this._supportsEyeDropper\n        )}\n      </div>\n    `;\n  }\n\n  //#endregion\n\n  //#region Alpha row rendering\n\n  private _renderAlphaRow(): TemplateResult {\n    return html`\n      <input\n        ${ref(this._alphaRef)}\n        aria-label=\"Alpha slider\"\n        type=\"range\"\n        part=\"alpha\"\n        min=\"0\"\n        max=\"100\"\n        .value=${String(this._alphaPercent)}\n        @input=${this._handleAlphaSliderValueChange}\n        @change=${stopPropagation}\n      />\n\n      <igc-visually-hidden>\n        <label for=\"alpha\">Alpha value</label>\n      </igc-visually-hidden>\n\n      <igc-input\n        ${ref(this._alphaInputRef)}\n        id=\"alpha\"\n        name=\"alpha\"\n        placeholder=\"Alpha value\"\n        inputmode=\"numeric\"\n        part=\"alpha-input\"\n        outlined\n        type=\"text\"\n        .value=${live(`${this._alphaPercent}%`)}\n        @input=${this._handleAlphaInputEdit}\n        @focusin=${this._handleAlphaInputCaret}\n        @click=${this._handleAlphaInputCaret}\n        @keyup=${this._handleAlphaInputCaret}\n        @igcChange=${this._handleAlphaInputChange}\n      ></igc-input>\n    `;\n  }\n\n  //#endregion\n\n  //#region Color formats and input row rendering\n\n  private _renderSelect(): TemplateResult {\n    return html`\n      <igc-visually-hidden>\n        <label for=\"format-select\">Color format</label>\n      </igc-visually-hidden>\n\n      <igc-select\n        id=\"format-select\"\n        part=\"format-select\"\n        placeholder=\"Color format\"\n        name=\"format\"\n        outlined\n        .value=${this.format}\n        @igcChange=${this._handleFormatChange}\n      >\n        <igc-select-item value=\"hex\">Hex</igc-select-item>\n        <igc-select-item value=\"rgb\">RGB</igc-select-item>\n        <igc-select-item value=\"hsl\">HSL</igc-select-item>\n      </igc-select>\n    `;\n  }\n\n  private _renderInputsRow(): TemplateResult {\n    return html`\n      ${cache(this.hideFormats ? nothing : this._renderSelect())}\n      <igc-visually-hidden>\n        <label for=\"color-input\"> Color value input </label>\n      </igc-visually-hidden>\n\n      <igc-input\n        id=\"color-input\"\n        name=\"color-input\"\n        placeholder=${formatPlaceholders[this.format]}\n        outlined\n        .value=${live(this._color.asString(this.format))}\n        @igcChange=${this._handleColorInputChange}\n      ></igc-input>\n    `;\n  }\n\n  //#endregion\n\n  //#region Swatches rendering\n\n  private _renderSwatches(): TemplateResult | typeof nothing {\n    return !isEmpty(this.swatches)\n      ? html`\n          <igc-divider></igc-divider>\n          <div part=\"swatches\" @click=${this._handleSwatchClick}>\n            ${this.swatches.map(\n              (color) => html`\n                <button\n                  type=\"button\"\n                  part=\"swatch\"\n                  data-color=${color}\n                  aria-label=${color}\n                  style=\"background-color: ${color}\"\n                ></button>\n              `\n            )}\n          </div>\n        `\n      : nothing;\n  }\n\n  //#endregion\n\n  //#region Anchor rendering\n\n  private get _anchorParts(): ReturnType<typeof partMap> {\n    return partMap({\n      anchor: true,\n      empty: this._color.isEmpty,\n      'input-mode': this._isInputMode,\n    });\n  }\n\n  /**\n   * The swatch preview style that both anchors use.\n   *\n   * `--_color-preview` paints the opaque color over the left half.\n   * `--_alpha-preview` paints the color with its real alpha over the whole\n   * surface. Do not transpose the two. See the `swatch-preview` mixin.\n   */\n  private _previewStyle(): ReturnType<typeof styleMap> {\n    const color = this._alphaColor;\n\n    return bindIf(\n      color,\n      styleMap({\n        '--_alpha-preview': color,\n        '--_color-preview': this._opaqueColor,\n      })\n    );\n  }\n\n  private _renderButtonAnchor(): TemplateResult {\n    return html`\n      <button\n        ${ref(this._anchorRef)}\n        id=\"trigger\"\n        type=\"button\"\n        aria-haspopup=\"dialog\"\n        aria-controls=\"picker\"\n        aria-expanded=${this.open}\n        aria-describedby=\"helper-text\"\n        part=${this._anchorParts}\n        slot=\"anchor\"\n        style=${this._previewStyle()}\n        ?disabled=${this.disabled}\n        @click=${this._handleAnchorClick}\n      >\n        <igc-visually-hidden>Open color picker</igc-visually-hidden>\n      </button>\n    `;\n  }\n\n  private _renderInputAnchor(): TemplateResult {\n    return html`\n      <igc-input\n        ${ref(this._anchorRef)}\n        slot=\"anchor\"\n        outlined\n        placeholder=${formatPlaceholders[this.format]}\n        label=${ifDefined(this.label)}\n        ?required=${this.required}\n        ?disabled=${this.disabled}\n        .value=${live(this.value)}\n        .invalid=${this.invalid}\n        @igcChange=${this._handleColorInputChange}\n      >\n        <div slot=\"prefix\">\n          <button\n            type=\"button\"\n            part=${this._anchorParts}\n            aria-label=\"Open color picker\"\n            aria-haspopup=\"dialog\"\n            aria-controls=\"picker\"\n            aria-expanded=${this.open}\n            style=${this._previewStyle()}\n            ?disabled=${this.disabled}\n            @click=${this._handleAnchorClick}\n          ></button>\n        </div>\n      </igc-input>\n    `;\n  }\n\n  private _renderAnchor(): TemplateResult {\n    return this._isInputMode\n      ? this._renderInputAnchor()\n      : this._renderButtonAnchor();\n  }\n\n  private _renderHelperText(): TemplateResult {\n    return this._renderValidationContainer({\n      id: 'helper-text',\n      hasHelperText: true,\n    });\n  }\n\n  //#endregion\n\n  private _renderPicker(): TemplateResult {\n    return html`\n      <igc-focus-trap ?disabled=${!this.open} .inert=${!this.open}>\n        <div\n          id=\"picker\"\n          part=\"picker\"\n          role=\"dialog\"\n          aria-label=\"Color picker\"\n          aria-modal=\"false\"\n        >\n          ${this._renderCanvasGradient()}\n          <div part=\"main-row\">\n            ${this._renderHueSlider()}${this._renderPickerButtons()}\n          </div>\n          ${\n            this.showAlpha\n              ? html`<div part=\"alpha-row\">${this._renderAlphaRow()}</div>`\n              : nothing\n          }\n          <div part=\"inputs-row\">${this._renderInputsRow()}</div>\n          ${this._renderSwatches()}\n        </div>\n      </igc-focus-trap>\n    `;\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n      <div part=\"color-picker\">\n        <igc-popover ?open=${this.open} shift flip>\n          ${this._renderAnchor()}${this._renderPicker()}\n        </igc-popover>\n        ${\n          !this._isInputMode && this.label\n            ? html`<label part=\"label\" for=\"trigger\">${this.label}</label>`\n            : nothing\n        }\n        ${this._renderHelperText()}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-color-picker': IgcColorPickerComponent;\n  }\n}\n"]}
+{"version":3,"file":"color-picker.js","sourceRoot":"","sources":["../../../src/components/color-picker/color-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing, type PropertyValues, type TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { cache } from 'lit/directives/cache.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { addAriaProjector } from '#internals/controllers/aria-projection.js';\nimport {\n  addKeybindings,\n  altKey,\n  arrowDown,\n  arrowRight,\n  arrowUp,\n  endKey,\n  escapeKey,\n} from '#internals/controllers/key-bindings.js';\nimport { addRootClickController } from '#internals/controllers/root-click.js';\nimport { addSlotController, setSlots } from '#internals/controllers/slot.js';\nimport { shadowOptions } from '#internals/decorators/shadow-options.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { IgcBaseComboBoxComponent } from '#internals/mixins/combo-box.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { FormAssociatedRequiredMixin } from '#internals/mixins/forms/associated-required.js';\nimport { createFormValueState } from '#internals/mixins/forms/form-value.js';\nimport { partMap } from '#internals/part-map.js';\nimport { isEmpty } from '#internals/utils/arrays.js';\nimport {\n  addSafeEventListener,\n  focusLeftHost,\n  getElementFromPath,\n  stopPropagation,\n} from '#internals/utils/events.js';\nimport { bindIf } from '#internals/utils/lit.js';\nimport { asNumber, clamp } from '#internals/utils/math.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport IgcButtonComponent from '../button/button.js';\nimport IgcIconButtonComponent from '../button/icon-button.js';\nimport IgcDividerComponent from '../divider/divider.js';\nimport IgcFocusTrapComponent from '../focus-trap/focus-trap.js';\nimport IgcInputComponent from '../input/input.js';\nimport IgcPopoverComponent from '../popover/popover.js';\nimport type IgcSelectItemComponent from '../select/select-item.js';\nimport IgcSelectComponent from '../select/select.js';\nimport type { ColorFormat, ColorPickerMode } from '../types.js';\nimport IgcValidationContainerComponent from '../validation-container/validation-container.js';\nimport IgcVisuallyHiddenComponent from '../visually-hidden/visually-hidden.js';\nimport { isValidColor, normalizeColor } from './common.js';\nimport { ColorModel, getContext } from './model.js';\nimport IgcPickerCanvasComponent, {\n  type PickerCanvasEventDetail,\n} from './picker-canvas.js';\nimport { styles } from './themes/color-picker.base.css.js';\nimport { styles as shared } from './themes/shared/color-picker.common.css.js';\nimport { all } from './themes/themes.js';\nimport { colorPickerValidators } from './validators.js';\n\nexport interface IgcColorPickerComponentEventMap {\n  igcOpening: CustomEvent<void>;\n  igcOpened: CustomEvent<void>;\n  igcClosing: CustomEvent<void>;\n  igcClosed: CustomEvent<void>;\n  igcInput: CustomEvent<string>;\n  igcChange: CustomEvent<string>;\n}\n\nconst Slots = setSlots(\n  'value-missing',\n  'custom-error',\n  'invalid',\n  'helper-text'\n);\n\n/** The color string shape of each format. Shown while the input is empty. */\nconst formatPlaceholders: Record<ColorFormat, string> = {\n  hex: '#rrggbb',\n  rgb: 'rgb(r g b)',\n  hsl: 'hsl(h s% l%)',\n};\n\n/** The alpha text is `<digits>%`. An edit removes every other character. */\nconst nonDigits = /\\D/g;\n\n/** The last caret offset in `<digits>%`, the position in front of the `%`. */\nfunction caretLimit(text: string): number {\n  return Math.max(text.length - 1, 0);\n}\n\n/**\n * The part of the EyeDropper API that this component uses.\n *\n * The type is declared locally, because the API is not in the baseline DOM\n * typings. Firefox and Safari do not implement it.\n */\ninterface EyeDropperLike {\n  open(): Promise<{ sRGBHex: string }>;\n}\n\ntype EyeDropperConstructor = new () => EyeDropperLike;\n\n/** Returns the EyeDropper constructor, if the browser provides one. */\nfunction getEyeDropper(): EyeDropperConstructor | undefined {\n  return (globalThis as { EyeDropper?: EyeDropperConstructor }).EyeDropper;\n}\n\n/**\n * Color input component.\n *\n * The user picks a color with the HSV saturation/value canvas, the hue slider\n * and the optional alpha slider. The user can also type a color string: hex,\n * rgb(a), hsl(a) or a named CSS color.\n *\n * The component supports pre-defined swatches and the native EyeDropper API,\n * where the browser provides one. The anchor is a trigger button\n * (`mode=\"default\"`) or an editable text field (`mode=\"input\"`).\n *\n * @element igc-color-picker\n *\n * @slot value-missing - Renders content when the required validation fails.\n * @slot custom-error - Renders content when setCustomValidity(message) is set.\n * @slot invalid - Renders content when the component is in invalid state (validity.valid = false).\n * @slot helper-text - Renders content below the picker.\n *\n * @fires igcOpening - Emitted just before the picker dropdown is open.\n * @fires igcOpened - Emitted after the picker dropdown is open.\n * @fires igcClosing - Emitted just before the picker dropdown is closed.\n * @fires igcClosed - Emitted after closing the picker dropdown.\n * @fires igcInput - Emitted when the value of the component is changed.\n * @fires igcChange - Emitted when the value of the component is committed.\n *\n * @csspart anchor - The trigger element that opens the picker (the button in default mode, or the swatch prefix in input mode).\n * @csspart empty - Applied alongside `anchor` when no color value is set, rendering a checkered background.\n * @csspart label - The label rendered above the anchor in default mode.\n * @csspart picker - The popover container holding the canvas, sliders, inputs and swatches.\n * @csspart main-row - The row containing the hue slider and the copy/eyedropper buttons.\n * @csspart alpha-row - The row containing the alpha slider and input, rendered when `show-alpha` is set.\n * @csspart inputs-row - The row containing the format select and the color value input.\n * @csspart buttons - The wrapper around the copy and eyedropper buttons.\n * @csspart hue - The hue slider.\n * @csspart alpha - The alpha slider.\n * @csspart copy - The button that copies the current color value to the clipboard.\n * @csspart eye-dropper - The button that activates the EyeDropper API.\n * @csspart format-select - The select control used to switch the color string format.\n * @csspart swatches - The container of the pre-defined color swatches.\n * @csspart swatch - An individual color swatch button.\n */\n@shadowOptions({ delegatesFocus: true })\nexport default class IgcColorPickerComponent extends FormAssociatedRequiredMixin(\n  EventEmitterMixin<\n    IgcColorPickerComponentEventMap,\n    AbstractConstructor<IgcBaseComboBoxComponent>\n  >(IgcBaseComboBoxComponent)\n) {\n  public static readonly tagName = 'igc-color-picker';\n  public static styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(\n      IgcColorPickerComponent,\n      IgcInputComponent,\n      IgcPopoverComponent,\n      IgcFocusTrapComponent,\n      IgcSelectComponent,\n      IgcPickerCanvasComponent,\n      IgcDividerComponent,\n      IgcButtonComponent,\n      IgcIconButtonComponent,\n      IgcValidationContainerComponent,\n      IgcVisuallyHiddenComponent\n    );\n  }\n\n  //#region Internal state and properties\n\n  protected override get __validators() {\n    return colorPickerValidators;\n  }\n\n  protected readonly _slots = addSlotController(this, { slots: Slots });\n\n  protected override readonly _rootClickController = addRootClickController(\n    this,\n    {\n      onHide: this._handleClosing,\n    }\n  );\n\n  protected override readonly _formValue = createFormValueState(this, {\n    initialValue: '',\n  });\n\n  private readonly _alphaRef = createRef<HTMLInputElement>();\n  private readonly _alphaInputRef = createRef<IgcInputComponent>();\n  private readonly _canvasRef = createRef<IgcPickerCanvasComponent>();\n  private readonly _hueRef = createRef<HTMLInputElement>();\n  private readonly _anchorRef = createRef<\n    HTMLButtonElement | IgcInputComponent\n  >();\n\n  private readonly _supportsEyeDropper = Boolean(getEyeDropper());\n  private _color = ColorModel.empty();\n  private _oldValue = '';\n\n  /** The last value written for each host custom property. */\n  private readonly _appliedProperties = new Map<string, string>();\n\n  @query('#helper-text')\n  private readonly _helperText!: IgcValidationContainerComponent | null;\n\n  private get _isInputMode(): boolean {\n    return this.mode === 'input';\n  }\n\n  //#endregion\n\n  //#region Public attributes and properties\n\n  /**\n   * The label of the component.\n   *\n   * In `mode=\"input\"` the component forwards the label to the anchor input.\n   * In `mode=\"default\"` it renders the label as a separate element.\n   * @attr label\n   */\n  @property()\n  public label?: string;\n\n  /**\n   * The value of the component as a CSS color string. Accepts hex, rgb(a),\n   * hsl(a) and named colors.\n   *\n   * An empty, whitespace-only or invalid string clears the value.\n   *\n   * @attr value\n   */\n  @property()\n  public set value(value: string) {\n    this._color = ColorModel.parse(value);\n    this._updateColor();\n  }\n\n  public get value(): string {\n    return this._formValue.value;\n  }\n\n  /**\n   * Sets the color format of the string value.\n   *\n   * A format change renders `value` in the new notation. The color does not\n   * change, so the component emits no `igcInput` or `igcChange`.\n   *\n   * @attr format\n   * @default 'hex'\n   */\n  @property()\n  public format: ColorFormat = 'hex';\n\n  /**\n   * Whether to hide the format picker buttons.\n   *\n   * @attr hide-formats\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-formats' })\n  public hideFormats = false;\n\n  /**\n   * Whether to show the alpha slider and input.\n   *\n   * @attr show-alpha\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'show-alpha' })\n  public showAlpha = false;\n\n  /**\n   * The mode of the color picker.\n   *\n   * In `\"default\"` mode the anchor is a trigger button. In `\"input\"` mode the\n   * anchor is an editable text field with a color swatch prefix. The prefix\n   * also opens the picker.\n   *\n   * @attr mode\n   * @default 'default'\n   */\n  @property({ reflect: true })\n  public mode: ColorPickerMode = 'default';\n\n  /**\n   * Pre-defined color strings. The component renders them as clickable\n   * swatches below the picker controls. A click on a swatch commits its color\n   * as the value.\n   */\n  @property({ attribute: false })\n  public swatches: string[] = [];\n\n  //#endregion\n\n  //#region Lifecycle\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n    addSafeEventListener(this, 'focusin', this._handleFocusIn);\n    addSafeEventListener(this, 'focusout', this._handleFocusOut);\n\n    addKeybindings(this, { skip: () => this.disabled })\n      .set(escapeKey, this._handleKeyboardClosing)\n      .set([altKey, arrowDown], this._handleAnchorClick)\n      .set([altKey, arrowUp], this._handleKeyboardClosing);\n\n    addKeybindings(this, {\n      skip: () => this.disabled || !this._alphaInputRef.value,\n      ref: this._alphaInputRef,\n      bindingDefaults: { repeat: true },\n    })\n      .set(arrowUp, () => this._handleAlphaInputSpin(1))\n      .set(arrowDown, () => this._handleAlphaInputSpin(-1))\n      .set(arrowRight, this._handleAlphaInputCaretForward, {\n        preventDefault: false,\n      })\n      .set(endKey, this._handleAlphaInputCaretForward, {\n        preventDefault: false,\n      });\n\n    addAriaProjector(this, {\n      target: () => (this._isInputMode ? this._anchorRef.value : null),\n      state: () => ({\n        hasPopup: 'dialog',\n        expanded: `${this.open}`,\n        labelledBy: this._internals.labels,\n        describedBy: this._helperText ? [this._helperText] : null,\n      }),\n    });\n  }\n\n  protected override update(props: PropertyValues<this>): void {\n    if (props.has('open')) {\n      this._rootClickController.update();\n    }\n\n    if (this.hasUpdated && props.has('format')) {\n      this._formValue.setValueAndFormState(this._color.asString(this.format));\n    }\n\n    this._applyColorProperties();\n\n    super.update(props);\n  }\n\n  protected override updated(props: PropertyValues<this>): void {\n    super.updated(props);\n\n    if (props.has('open') || props.has('value')) {\n      // Wait for the paint, then sync the marker position with the color.\n      requestAnimationFrame(() => this._syncCanvasPosition());\n    }\n  }\n\n  //#endregion\n\n  //#region Form associated overrides\n\n  protected override formResetCallback(): void {\n    super.formResetCallback();\n\n    if (this._isInputMode) {\n      const input = this._anchorRef.value as IgcInputComponent;\n      input?.['formResetCallback']();\n    }\n  }\n\n  //#endregion\n\n  //#region Event handlers\n\n  private _handleClosing(): void {\n    this._hide(true);\n  }\n\n  private async _handleKeyboardClosing(): Promise<void> {\n    if (await this._hide(true)) {\n      this._anchorRef.value?.focus();\n    }\n  }\n\n  private _handleFocusIn(event: FocusEvent): void {\n    if (focusLeftHost(this, event)) {\n      this._oldValue = this._alphaColor;\n    }\n  }\n\n  private _handleFocusOut(event: FocusEvent): void {\n    if (!focusLeftHost(this, event)) {\n      return;\n    }\n\n    this._handleBlur();\n\n    if (this._alphaColor !== this._oldValue) {\n      this._oldValue = this._alphaColor;\n      this.emitEvent('igcChange', { detail: this.value });\n    }\n  }\n\n  private _handleCanvasColorPicked(\n    event: CustomEvent<PickerCanvasEventDetail>\n  ): void {\n    this._color.setSaturationAndValue(event.detail.x, 100 - event.detail.y);\n    this._updateColor();\n    this._emitInputEvent();\n  }\n\n  private _handleHueValueChange(event: Event): void {\n    stopPropagation(event);\n\n    this._color.h = asNumber(this._hueRef.value?.value);\n    this._updateColor();\n    this._emitInputEvent();\n  }\n\n  private _handleAlphaSliderValueChange(event: Event): void {\n    stopPropagation(event);\n\n    this._setAlpha(asNumber(this._alphaRef.value?.value));\n  }\n\n  /**\n   * Rewrites the alpha field as `<digits>%` after each edit.\n   *\n   * The `%` is part of the value and not a suffix element, so the browser\n   * treats it as editable text. This handler normalizes the result of an edit\n   * instead of a filter on the keystrokes in `beforeinput`. The `%` then\n   * behaves as a literal for each way that text reaches the field: typing,\n   * paste, drop, composition, undo and autofill. Of these, `beforeinput`\n   * carries `data` only for typing.\n   */\n  private _handleAlphaInputEdit(event: Event): void {\n    const input = this._alphaInputRef.value;\n    const native = getElementFromPath<HTMLInputElement>('input', event);\n\n    if (!input || !native) return;\n\n    const caret = native.selectionStart ?? native.value.length;\n    const typed = native.value.slice(0, caret).replace(nonDigits, '').length;\n    const digits = native.value.replace(nonDigits, '');\n    const percent = clamp(asNumber(digits), 0, 100);\n\n    const text = digits ? `${percent}%` : '';\n\n    this._writeAlphaText(input, text, Math.min(typed, caretLimit(text)));\n\n    if (digits) {\n      this._setAlpha(percent);\n    }\n  }\n\n  /**\n   * Keeps the caret and the selection inside the digits.\n   *\n   * The trailing `%` is a literal. Without this handler the caret goes after\n   * the `%` on focus, on a click past the text, and after a shifted selection\n   * extends over it. The handler therefore runs on `keyup` as well as on\n   * `focusin` and `click`. Text after the `%` falls outside the number, and the\n   * parse discards it.\n   */\n  private _handleAlphaInputCaret(event: Event): void {\n    const native = getElementFromPath<HTMLInputElement>('input', event);\n    if (!native) return;\n\n    const limit = caretLimit(native.value);\n\n    native.setSelectionRange(\n      Math.min(native.selectionStart ?? 0, limit),\n      Math.min(native.selectionEnd ?? 0, limit)\n    );\n  }\n\n  /**\n   * Steps the alpha by one percent.\n   *\n   * The step applies to the color and not to the text of the field. This keeps\n   * a held arrow key correct. The key downs repeat faster than a render, so the\n   * text of the field can be stale.\n   *\n   * The handler writes the new text and does not leave it to the render, so\n   * that the caret does not move. A value assignment puts the caret behind the\n   * `%`. A write from the render applies one frame after the keypress, which\n   * the user sees as a jump forward and back.\n   */\n  private _handleAlphaInputSpin(increment: -1 | 1): void {\n    const input = this._alphaInputRef.value;\n    const percent = clamp(this._alphaPercent + increment, 0, 100);\n\n    if (!input || percent === this._alphaPercent) return;\n\n    this._writeAlphaText(input, `${percent}%`);\n    this._setAlpha(percent);\n  }\n\n  /**\n   * Holds the caret at the `%`. Without this handler the caret steps past the\n   * `%`, and `keyup` pulls it back. This is the frame-late jump that\n   * {@link _handleAlphaInputSpin} describes.\n   */\n  private _handleAlphaInputCaretForward(event: KeyboardEvent): void {\n    const native = getElementFromPath<HTMLInputElement>('input', event);\n    if (!native) return;\n\n    const limit = caretLimit(native.value);\n\n    if (event.key === endKey || (native.selectionEnd ?? 0) >= limit) {\n      event.preventDefault();\n      native.setSelectionRange(limit, limit);\n    }\n  }\n\n  private _handleAlphaInputChange(event: CustomEvent<string>): void {\n    stopPropagation(event);\n\n    const input = event.target as IgcInputComponent;\n\n    if (!input.value) {\n      input.value = `${this._alphaPercent}%`;\n    }\n  }\n\n  private _handleFormatChange(\n    event: CustomEvent<IgcSelectItemComponent>\n  ): void {\n    stopPropagation(event);\n    this.format = event.detail.value as ColorFormat;\n  }\n\n  private _handleColorInputChange(event: CustomEvent<string>): void {\n    stopPropagation(event);\n\n    const input = event.target as IgcInputComponent;\n    const value = normalizeColor(event.detail);\n    const cleared = !value;\n\n    // An invalid and non-empty value reverts the input to the current color.\n    // An empty value clears the color.\n    if (!cleared && !isValidColor(value, getContext())) {\n      input.value = this._color.asString(this.format);\n      return;\n    }\n\n    this._color = cleared ? ColorModel.empty() : ColorModel.parse(value);\n    this._updateColor();\n    this._syncCanvasPosition();\n  }\n\n  private _handleEyeDropperClick(): void {\n    const EyeDropper = getEyeDropper();\n\n    if (!EyeDropper) return;\n\n    new EyeDropper()\n      .open()\n      .then((result) => {\n        this.value = result.sRGBHex;\n        this._emitInputEvent();\n      })\n      .catch(() => {});\n  }\n\n  private _handleCopy(): void {\n    navigator.clipboard?.writeText(this.value).catch(() => {});\n  }\n\n  private _handleSwatchClick(event: Event): void {\n    const swatch = getElementFromPath<HTMLButtonElement>(\n      'button[part=\"swatch\"]',\n      event\n    );\n    const color = swatch?.dataset.color;\n\n    if (color) {\n      this.value = color;\n      this._emitInputEvent();\n    }\n  }\n\n  //#endregion\n\n  //#region Internal methods\n\n  /**\n   * The current color with its alpha, in a notation that is independent of\n   * `format`.\n   */\n  private get _alphaColor(): string {\n    return this._color.asString('rgb', true);\n  }\n\n  /**\n   * The current color with an opaque alpha channel.\n   *\n   * The swatch preview paints this color over one half of its surface, and\n   * {@link _alphaColor} over the other half. A translucent color is then shown\n   * next to its opaque form. At full alpha the two halves are identical and the\n   * split is invisible, so opaque colors need no separate branch.\n   *\n   * This value is defined also with no color value. An empty color is white,\n   * which is where the alpha ramp and the canvas marker belong before the first\n   * pick. The anchor keeps its \"no color\" mark, because {@link _previewStyle}\n   * uses {@link _alphaColor}, which stays empty.\n   */\n  private get _opaqueColor(): string {\n    return new ColorModel(this._color.toRGB()).asString('rgb');\n  }\n\n  /** The alpha channel as the whole percentage that both alpha controls use. */\n  private get _alphaPercent(): number {\n    return Math.round(this._color.alpha * 100);\n  }\n\n  /** The pure hue that the saturation/value plane and the hue thumb use. */\n  private get _currentColor(): string {\n    return `hsl(${this._color.h} 100% 50%)`;\n  }\n\n  /**\n   * Mirrors the colors that the stylesheet needs onto the host.\n   *\n   * `update()` drives this, and not the handlers that change the color. It\n   * therefore also runs for the first render. A picker with no value calls none\n   * of those handlers, and the plane would keep the stylesheet fallback instead\n   * of its actual hue.\n   */\n  private _applyColorProperties(): void {\n    const properties = {\n      '--_current-color': this._currentColor,\n      '--_selected-color': this._opaqueColor,\n    };\n\n    for (const [name, value] of Object.entries(properties)) {\n      if (this._appliedProperties.get(name) !== value) {\n        this._appliedProperties.set(name, value);\n        this.style.setProperty(name, value);\n      }\n    }\n  }\n\n  /**\n   * Replaces the whole text of the alpha field and puts the caret in front of\n   * the `%` by default.\n   */\n  private _writeAlphaText(\n    input: IgcInputComponent,\n    text: string,\n    caret = caretLimit(text)\n  ): void {\n    input.setRangeText(text, 0, input.value.length);\n    input.setSelectionRange(caret, caret);\n  }\n\n  private _setAlpha(percent: number): void {\n    const alpha = clamp(percent, 0, 100) / 100;\n\n    if (this._color.alpha === alpha) {\n      return;\n    }\n\n    this._color.alpha = alpha;\n    this._updateColor();\n    this._emitInputEvent();\n  }\n\n  private _updateColor(): void {\n    this._formValue.setValueAndFormState(this._color.asString(this.format));\n    this.requestUpdate();\n  }\n\n  private _syncCanvasPosition(): void {\n    if (!this._canvasRef.value || !this.open) return;\n\n    const rect = this._canvasRef.value.getBoundingClientRect();\n    const { width: markerWidth, height: markerHeight } =\n      this._canvasRef.value.getMarkerDimensions();\n\n    const [, s, v] = this._color.toHSV();\n    const x = (s / 100) * rect.width - markerWidth;\n    const y = ((100 - v) / 100) * rect.height - markerHeight;\n\n    this._canvasRef.value.x = x;\n    this._canvasRef.value.y = y;\n  }\n\n  private _emitInputEvent(): void {\n    this.emitEvent('igcInput', { detail: this.value });\n  }\n\n  //#endregion\n\n  //#region Canvas area rendering\n\n  private _renderCanvasGradient(): TemplateResult {\n    const [, saturation, brightness] = this._color.toHSV();\n\n    return html`\n      <igc-picker-canvas\n        exportparts=\"marker, dragging\"\n        part=\"picker-canvas\"\n        ${ref(this._canvasRef)}\n        @igcColorPicked=${this._handleCanvasColorPicked}\n        currentColor=${this._currentColor}\n        markerColor=${this._opaqueColor}\n        .saturation=${saturation}\n        .brightness=${brightness}\n      >\n      </igc-picker-canvas>\n    `;\n  }\n\n  //#endregion\n\n  //#region Hue row and buttons rendering\n\n  private _renderHueSlider(): TemplateResult {\n    return html`\n      <input\n        ${ref(this._hueRef)}\n        aria-label=\"Hue\"\n        type=\"range\"\n        part=\"hue\"\n        min=\"0\"\n        max=\"360\"\n        .value=${String(Math.round(this._color.h))}\n        @input=${this._handleHueValueChange}\n        @change=${stopPropagation}\n      />\n    `;\n  }\n\n  private _renderIconButton(\n    part: string,\n    icon: string,\n    label: string,\n    handler: () => void,\n    disabled = false\n  ): TemplateResult {\n    return html`\n      <igc-icon-button\n        part=${part}\n        variant=\"flat\"\n        name=${icon}\n        ?disabled=${disabled}\n        @click=${handler}\n      >\n        <igc-visually-hidden>${label}</igc-visually-hidden>\n      </igc-icon-button>\n    `;\n  }\n\n  private _renderPickerButtons(): TemplateResult {\n    return html`\n      <div part=\"buttons\">\n        ${this._renderIconButton(\n          'copy',\n          'copy_content',\n          'Copy color value to clipboard',\n          this._handleCopy\n        )}\n        ${this._renderIconButton(\n          'eye-dropper',\n          'eye_dropper',\n          'Pick a color from the screen',\n          this._handleEyeDropperClick,\n          !this._supportsEyeDropper\n        )}\n      </div>\n    `;\n  }\n\n  //#endregion\n\n  //#region Alpha row rendering\n\n  private _renderAlphaRow(): TemplateResult {\n    return html`\n      <input\n        ${ref(this._alphaRef)}\n        aria-label=\"Alpha slider\"\n        type=\"range\"\n        part=\"alpha\"\n        min=\"0\"\n        max=\"100\"\n        .value=${String(this._alphaPercent)}\n        @input=${this._handleAlphaSliderValueChange}\n        @change=${stopPropagation}\n      />\n\n      <igc-visually-hidden>\n        <label for=\"alpha\">Alpha value</label>\n      </igc-visually-hidden>\n\n      <igc-input\n        ${ref(this._alphaInputRef)}\n        id=\"alpha\"\n        name=\"alpha\"\n        placeholder=\"Alpha value\"\n        inputmode=\"numeric\"\n        part=\"alpha-input\"\n        outlined\n        type=\"text\"\n        .value=${live(`${this._alphaPercent}%`)}\n        @input=${this._handleAlphaInputEdit}\n        @focusin=${this._handleAlphaInputCaret}\n        @click=${this._handleAlphaInputCaret}\n        @keyup=${this._handleAlphaInputCaret}\n        @igcChange=${this._handleAlphaInputChange}\n      ></igc-input>\n    `;\n  }\n\n  //#endregion\n\n  //#region Color formats and input row rendering\n\n  private _renderSelect(): TemplateResult {\n    return html`\n      <igc-visually-hidden>\n        <label for=\"format-select\">Color format</label>\n      </igc-visually-hidden>\n\n      <igc-select\n        id=\"format-select\"\n        part=\"format-select\"\n        placeholder=\"Color format\"\n        name=\"format\"\n        outlined\n        .value=${this.format}\n        @igcChange=${this._handleFormatChange}\n      >\n        <igc-select-item value=\"hex\">Hex</igc-select-item>\n        <igc-select-item value=\"rgb\">RGB</igc-select-item>\n        <igc-select-item value=\"hsl\">HSL</igc-select-item>\n      </igc-select>\n    `;\n  }\n\n  private _renderInputsRow(): TemplateResult {\n    return html`\n      ${cache(this.hideFormats ? nothing : this._renderSelect())}\n      <igc-visually-hidden>\n        <label for=\"color-input\"> Color value input </label>\n      </igc-visually-hidden>\n\n      <igc-input\n        id=\"color-input\"\n        name=\"color-input\"\n        placeholder=${formatPlaceholders[this.format]}\n        outlined\n        .value=${live(this._color.asString(this.format))}\n        @igcChange=${this._handleColorInputChange}\n      ></igc-input>\n    `;\n  }\n\n  //#endregion\n\n  //#region Swatches rendering\n\n  private _renderSwatches(): TemplateResult | typeof nothing {\n    return !isEmpty(this.swatches)\n      ? html`\n          <igc-divider></igc-divider>\n          <div part=\"swatches\" @click=${this._handleSwatchClick}>\n            ${this.swatches.map(\n              (color) => html`\n                <button\n                  type=\"button\"\n                  part=\"swatch\"\n                  data-color=${color}\n                  aria-label=${color}\n                  style=\"background-color: ${color}\"\n                ></button>\n              `\n            )}\n          </div>\n        `\n      : nothing;\n  }\n\n  //#endregion\n\n  //#region Anchor rendering\n\n  private get _anchorParts(): ReturnType<typeof partMap> {\n    return partMap({\n      anchor: true,\n      empty: this._color.isEmpty,\n      'input-mode': this._isInputMode,\n    });\n  }\n\n  /**\n   * The swatch preview style that both anchors use.\n   *\n   * `--_color-preview` paints the opaque color over the left half.\n   * `--_alpha-preview` paints the color with its real alpha over the whole\n   * surface. Do not transpose the two. See the `swatch-preview` mixin.\n   */\n  private _previewStyle(): ReturnType<typeof styleMap> {\n    const color = this._alphaColor;\n\n    return bindIf(\n      color,\n      styleMap({\n        '--_alpha-preview': color,\n        '--_color-preview': this._opaqueColor,\n      })\n    );\n  }\n\n  private _renderButtonAnchor(): TemplateResult {\n    return html`\n      <button\n        ${ref(this._anchorRef)}\n        id=\"trigger\"\n        type=\"button\"\n        aria-haspopup=\"dialog\"\n        aria-controls=\"picker\"\n        aria-expanded=${this.open}\n        aria-describedby=\"helper-text\"\n        part=${this._anchorParts}\n        slot=\"anchor\"\n        style=${this._previewStyle()}\n        ?disabled=${this.disabled}\n        @click=${this._handleAnchorClick}\n      >\n        <igc-visually-hidden>Open color picker</igc-visually-hidden>\n      </button>\n    `;\n  }\n\n  private _renderInputAnchor(): TemplateResult {\n    return html`\n      <igc-input\n        ${ref(this._anchorRef)}\n        slot=\"anchor\"\n        outlined\n        placeholder=${formatPlaceholders[this.format]}\n        label=${ifDefined(this.label)}\n        ?required=${this.required}\n        ?disabled=${this.disabled}\n        .value=${live(this.value)}\n        .invalid=${this.invalid}\n        @igcChange=${this._handleColorInputChange}\n      >\n        <div slot=\"prefix\">\n          <button\n            type=\"button\"\n            part=${this._anchorParts}\n            aria-label=\"Open color picker\"\n            aria-haspopup=\"dialog\"\n            aria-controls=\"picker\"\n            aria-expanded=${this.open}\n            style=${this._previewStyle()}\n            ?disabled=${this.disabled}\n            @click=${this._handleAnchorClick}\n          ></button>\n        </div>\n      </igc-input>\n    `;\n  }\n\n  private _renderAnchor(): TemplateResult {\n    return this._isInputMode\n      ? this._renderInputAnchor()\n      : this._renderButtonAnchor();\n  }\n\n  private _renderHelperText(): TemplateResult {\n    return this._renderValidationContainer({\n      id: 'helper-text',\n      hasHelperText: true,\n    });\n  }\n\n  //#endregion\n\n  private _renderPicker(): TemplateResult {\n    return html`\n      <igc-focus-trap ?disabled=${!this.open} .inert=${!this.open}>\n        <div\n          id=\"picker\"\n          part=\"picker\"\n          role=\"dialog\"\n          aria-label=\"Color picker\"\n          aria-modal=\"false\"\n        >\n          ${this._renderCanvasGradient()}\n          <div part=\"main-row\">\n            ${this._renderHueSlider()}${this._renderPickerButtons()}\n          </div>\n          ${\n            this.showAlpha\n              ? html`<div part=\"alpha-row\">${this._renderAlphaRow()}</div>`\n              : nothing\n          }\n          <div part=\"inputs-row\">${this._renderInputsRow()}</div>\n          ${this._renderSwatches()}\n        </div>\n      </igc-focus-trap>\n    `;\n  }\n\n  protected override render(): TemplateResult {\n    return html`\n      <div part=\"color-picker\">\n        <igc-popover ?open=${this.open} shift flip>\n          ${this._renderAnchor()}${this._renderPicker()}\n        </igc-popover>\n        ${\n          !this._isInputMode && this.label\n            ? html`<label part=\"label\" for=\"trigger\">${this.label}</label>`\n            : nothing\n        }\n        ${this._renderHelperText()}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-color-picker': IgcColorPickerComponent;\n  }\n}\n"]}

package/components/color-picker/picker-canvas.js

@@ -11,7 +11,7 @@ import { addKeybindings, arrowDown, arrowLeft, arrowRight, arrowUp, } from '#int
 import { registerComponent } from '#internals/definitions/register.js';
 import { EventEmitterMixin } from '#internals/mixins/event-emitter.js';
 import { partMap } from '#internals/part-map.js';
-import { addSafeEventListener } from '#internals/utils/events.js';
+import { addSafeEventListener, preventDefault, } from '#internals/utils/events.js';
 import { asPercent, clamp } from '#internals/utils/math.js';
 import { styles } from './themes/picker-canvas.base.css.js';
 export default class IgcPickerCanvasComponent extends EventEmitterMixin(LitElement) {
@@ -31,6 +31,7 @@ export default class IgcPickerCanvasComponent extends EventEmitterMixin(LitEleme
         this.brightness = 0;
         this.markerLabel = 'Saturation and value';
         addSafeEventListener(this, 'pointerdown', this._handlePointerDown);
+        addSafeEventListener(this, 'touchmove', preventDefault, { passive: false });
         addSafeEventListener(this, 'lostpointercapture', this._handleLostPointerCapture);
         addKeybindings(this, { bindingDefaults: { repeat: true } })
             .set(arrowDown, this._onArrowKey.bind(this, { dx: 0, dy: 1 }))

package/components/color-picker/picker-canvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"picker-canvas.js","sourceRoot":"","sources":["../../../src/components/color-picker/picker-canvas.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, type PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport {\n  addKeybindings,\n  arrowDown,\n  arrowLeft,\n  arrowRight,\n  arrowUp,\n} from '#internals/controllers/key-bindings.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { partMap } from '#internals/part-map.js';\nimport { addSafeEventListener } from '#internals/utils/events.js';\nimport { asPercent, clamp } from '#internals/utils/math.js';\nimport { styles } from './themes/picker-canvas.base.css.js';\n\nexport interface IgcPickerCanvasEventMap {\n  /**\n   * Emitted when the color is picked in the canvas. Does not bubble.\n   */\n  igcColorPicked: CustomEvent<PickerCanvasEventDetail>;\n}\n\nexport type PickerCanvasEventDetail = { x: number; y: number };\n\n/** The measurements a marker position is resolved against. */\ntype CanvasGeometry = {\n  rect: DOMRect;\n  marker: { width: number; height: number };\n};\n\n/* blazorSuppress */\n/**\n * The saturation/value plane of {@link IgcColorPickerComponent} and the marker\n * that moves across it.\n *\n * An internal building block of `igc-color-picker` - it is registered so the\n * picker can render it, but it is not part of the public component surface and\n * is not exported from the package entry point.\n *\n * @element igc-picker-canvas\n *\n * @fires igcColorPicked - Emitted when a color is picked on the canvas. Does not bubble.\n *\n * @csspart marker - The draggable marker indicating the picked saturation/value.\n * @csspart dragging - Present on the marker while it is being dragged.\n */\nexport default class IgcPickerCanvasComponent extends EventEmitterMixin<\n  IgcPickerCanvasEventMap,\n  AbstractConstructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-picker-canvas';\n  public static styles = styles;\n\n  public static register(): void {\n    registerComponent(IgcPickerCanvasComponent);\n  }\n\n  @query('[part~=\"marker\"]', true)\n  private readonly _marker?: HTMLDivElement;\n\n  /** Geometry captured for the duration of a pointer drag. */\n  private _dragGeometry?: CanvasGeometry;\n\n  /** Whether a pointer drag is currently in progress. */\n  @state()\n  private _dragging = false;\n\n  @property()\n  public currentColor = '';\n\n  /**\n   * The color the marker is filled with.\n   *\n   * Distinct from `currentColor`: that one is the pure hue the saturation/value\n   * plane is built from, while this is the color actually picked out of it.\n   */\n  @property()\n  public markerColor = '';\n\n  @property({ attribute: false })\n  public x = 0;\n\n  @property({ attribute: false })\n  public y = 0;\n\n  /**\n   * The HSV saturation the marker currently sits at (0-100).\n   *\n   * The canvas positions the marker in pixels and has no notion of the color\n   * space behind it, so the owning picker feeds the saturation/value pair back\n   * in purely to give the marker an announceable value.\n   */\n  @property({ type: Number, attribute: false })\n  public saturation = 0;\n\n  /**\n   * The HSV value the marker currently sits at (0-100).\n   *\n   * Named for the B of HSB rather than the V of HSV - on a custom element a\n   * bare `value` reads as a form value, which this is not.\n   */\n  @property({ type: Number, attribute: false })\n  public brightness = 0;\n\n  /** The accessible name of the marker. */\n  @property()\n  public markerLabel = 'Saturation and value';\n\n  constructor() {\n    super();\n\n    addSafeEventListener(this, 'pointerdown', this._handlePointerDown);\n    addSafeEventListener(\n      this,\n      'lostpointercapture',\n      this._handleLostPointerCapture\n    );\n\n    addKeybindings(this, { bindingDefaults: { repeat: true } })\n      .set(arrowDown, this._onArrowKey.bind(this, { dx: 0, dy: 1 }))\n      .set(arrowUp, this._onArrowKey.bind(this, { dx: 0, dy: -1 }))\n      .set(arrowLeft, this._onArrowKey.bind(this, { dx: -1, dy: 0 }))\n      .set(arrowRight, this._onArrowKey.bind(this, { dx: 1, dy: 0 }));\n  }\n\n  protected override updated(properties: PropertyValues<this>): void {\n    if (properties.has('currentColor')) {\n      this.style.color = this.currentColor;\n    }\n\n    // Handed to the marker through a custom property rather than an inline\n    // style on the marker itself, so that a consumer styling `::part(marker)`\n    // can still win - an inline style could not be overridden.\n    if (properties.has('markerColor')) {\n      this.style.setProperty('--_marker-fill', this.markerColor);\n    }\n  }\n\n  /**\n   * The canvas box and half-marker offsets every interaction measures against.\n   *\n   * Both reads force a layout, so a drag takes this once on pointerdown rather\n   * than on each of the frames it spans.\n   */\n  private _measure(): CanvasGeometry {\n    return {\n      rect: this.getBoundingClientRect(),\n      marker: this.getMarkerDimensions(),\n    };\n  }\n\n  /**\n   * Clamps the marker inside the canvas and reports the position it settled on\n   * as saturation/value percentages.\n   */\n  private _commitPosition(\n    x: number,\n    y: number,\n    { rect, marker }: CanvasGeometry\n  ): void {\n    const nextX = clamp(x, -marker.width, rect.width - marker.width);\n    const nextY = clamp(y, -marker.height, rect.height - marker.height);\n\n    if (nextX === this.x && nextY === this.y) {\n      return;\n    }\n\n    this.x = nextX;\n    this.y = nextY;\n\n    this.emitEvent('igcColorPicked', {\n      detail: {\n        x: Math.round(asPercent(nextX + marker.width, rect.width)),\n        y: Math.round(asPercent(nextY + marker.height, rect.height)),\n      },\n      bubbles: false,\n    });\n  }\n\n  private _onArrowKey({ dx, dy }: { dx: number; dy: number }): void {\n    this._commitPosition(this.x + dx, this.y + dy, this._measure());\n  }\n\n  private _move(event: PointerEvent): void {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const geometry = this._dragGeometry ?? this._measure();\n    const { rect, marker } = geometry;\n\n    this._commitPosition(\n      event.clientX - rect.x - marker.width,\n      event.clientY - rect.y - marker.height,\n      geometry\n    );\n  }\n\n  private _handlePointerDown(event: PointerEvent): void {\n    if (event.button !== 0) return;\n    this.setPointerCapture(event.pointerId);\n    this.addEventListener('pointermove', this._handlePointerMove);\n    this._dragGeometry = this._measure();\n    this._dragging = true;\n    this._move(event);\n  }\n\n  private _handleLostPointerCapture(): void {\n    this.removeEventListener('pointermove', this._handlePointerMove);\n    this._dragGeometry = undefined;\n    this._dragging = false;\n    this._marker?.focus();\n  }\n\n  private _handlePointerMove(event: PointerEvent): void {\n    this._move(event);\n  }\n\n  public getMarkerDimensions(): { width: number; height: number } {\n    const marker = this._marker;\n\n    // Offsets rather than a client rect: the marker is scaled up while dragged\n    // and a rect would report the transformed box, shifting every position\n    // resolved against it.\n    return marker\n      ? { width: marker.offsetWidth / 2, height: marker.offsetHeight / 2 }\n      : { width: 0, height: 0 };\n  }\n\n  protected override render() {\n    const styles = styleMap({\n      top: `${this.y}px`,\n      left: `${this.x}px`,\n    });\n\n    const saturation = Math.round(this.saturation);\n    const brightness = Math.round(this.brightness);\n\n    // ARIA has no two-dimensional slider, so the marker is exposed as a single\n    // slider tracking saturation, with `aria-valuetext` carrying both axes -\n    // otherwise vertical movement would be announced as \"no change\".\n    return html`\n      <div\n        part=${partMap({ marker: true, dragging: this._dragging })}\n        style=${styles}\n        tabindex=\"0\"\n        role=\"slider\"\n        aria-label=${this.markerLabel}\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"\n        aria-valuenow=${saturation}\n        aria-valuetext=\"Saturation ${saturation}%, brightness ${brightness}%\"\n      ></div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-picker-canvas': IgcPickerCanvasComponent;\n  }\n}\n"]}
+{"version":3,"file":"picker-canvas.js","sourceRoot":"","sources":["../../../src/components/color-picker/picker-canvas.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, type PropertyValues } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport {\n  addKeybindings,\n  arrowDown,\n  arrowLeft,\n  arrowRight,\n  arrowUp,\n} from '#internals/controllers/key-bindings.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport type { AbstractConstructor } from '#internals/mixins/constructor.js';\nimport { EventEmitterMixin } from '#internals/mixins/event-emitter.js';\nimport { partMap } from '#internals/part-map.js';\nimport {\n  addSafeEventListener,\n  preventDefault,\n} from '#internals/utils/events.js';\nimport { asPercent, clamp } from '#internals/utils/math.js';\nimport { styles } from './themes/picker-canvas.base.css.js';\n\nexport interface IgcPickerCanvasEventMap {\n  /**\n   * Emitted when the color is picked in the canvas. Does not bubble.\n   */\n  igcColorPicked: CustomEvent<PickerCanvasEventDetail>;\n}\n\nexport type PickerCanvasEventDetail = { x: number; y: number };\n\n/** The measurements a marker position is resolved against. */\ntype CanvasGeometry = {\n  rect: DOMRect;\n  marker: { width: number; height: number };\n};\n\n/* blazorSuppress */\n/**\n * The saturation/value plane of {@link IgcColorPickerComponent} and the marker\n * that moves across it.\n *\n * An internal building block of `igc-color-picker` - it is registered so the\n * picker can render it, but it is not part of the public component surface and\n * is not exported from the package entry point.\n *\n * @element igc-picker-canvas\n *\n * @fires igcColorPicked - Emitted when a color is picked on the canvas. Does not bubble.\n *\n * @csspart marker - The draggable marker indicating the picked saturation/value.\n * @csspart dragging - Present on the marker while it is being dragged.\n */\nexport default class IgcPickerCanvasComponent extends EventEmitterMixin<\n  IgcPickerCanvasEventMap,\n  AbstractConstructor<LitElement>\n>(LitElement) {\n  public static readonly tagName = 'igc-picker-canvas';\n  public static styles = styles;\n\n  public static register(): void {\n    registerComponent(IgcPickerCanvasComponent);\n  }\n\n  @query('[part~=\"marker\"]', true)\n  private readonly _marker?: HTMLDivElement;\n\n  /** Geometry captured for the duration of a pointer drag. */\n  private _dragGeometry?: CanvasGeometry;\n\n  /** Whether a pointer drag is currently in progress. */\n  @state()\n  private _dragging = false;\n\n  @property()\n  public currentColor = '';\n\n  /**\n   * The color the marker is filled with.\n   *\n   * Distinct from `currentColor`: that one is the pure hue the saturation/value\n   * plane is built from, while this is the color actually picked out of it.\n   */\n  @property()\n  public markerColor = '';\n\n  @property({ attribute: false })\n  public x = 0;\n\n  @property({ attribute: false })\n  public y = 0;\n\n  /**\n   * The HSV saturation the marker currently sits at (0-100).\n   *\n   * The canvas positions the marker in pixels and has no notion of the color\n   * space behind it, so the owning picker feeds the saturation/value pair back\n   * in purely to give the marker an announceable value.\n   */\n  @property({ type: Number, attribute: false })\n  public saturation = 0;\n\n  /**\n   * The HSV value the marker currently sits at (0-100).\n   *\n   * Named for the B of HSB rather than the V of HSV - on a custom element a\n   * bare `value` reads as a form value, which this is not.\n   */\n  @property({ type: Number, attribute: false })\n  public brightness = 0;\n\n  /** The accessible name of the marker. */\n  @property()\n  public markerLabel = 'Saturation and value';\n\n  constructor() {\n    super();\n\n    addSafeEventListener(this, 'pointerdown', this._handlePointerDown);\n    addSafeEventListener(this, 'touchmove', preventDefault, { passive: false });\n    addSafeEventListener(\n      this,\n      'lostpointercapture',\n      this._handleLostPointerCapture\n    );\n\n    addKeybindings(this, { bindingDefaults: { repeat: true } })\n      .set(arrowDown, this._onArrowKey.bind(this, { dx: 0, dy: 1 }))\n      .set(arrowUp, this._onArrowKey.bind(this, { dx: 0, dy: -1 }))\n      .set(arrowLeft, this._onArrowKey.bind(this, { dx: -1, dy: 0 }))\n      .set(arrowRight, this._onArrowKey.bind(this, { dx: 1, dy: 0 }));\n  }\n\n  protected override updated(properties: PropertyValues<this>): void {\n    if (properties.has('currentColor')) {\n      this.style.color = this.currentColor;\n    }\n\n    // Handed to the marker through a custom property rather than an inline\n    // style on the marker itself, so that a consumer styling `::part(marker)`\n    // can still win - an inline style could not be overridden.\n    if (properties.has('markerColor')) {\n      this.style.setProperty('--_marker-fill', this.markerColor);\n    }\n  }\n\n  /**\n   * The canvas box and half-marker offsets every interaction measures against.\n   *\n   * Both reads force a layout, so a drag takes this once on pointerdown rather\n   * than on each of the frames it spans.\n   */\n  private _measure(): CanvasGeometry {\n    return {\n      rect: this.getBoundingClientRect(),\n      marker: this.getMarkerDimensions(),\n    };\n  }\n\n  /**\n   * Clamps the marker inside the canvas and reports the position it settled on\n   * as saturation/value percentages.\n   */\n  private _commitPosition(\n    x: number,\n    y: number,\n    { rect, marker }: CanvasGeometry\n  ): void {\n    const nextX = clamp(x, -marker.width, rect.width - marker.width);\n    const nextY = clamp(y, -marker.height, rect.height - marker.height);\n\n    if (nextX === this.x && nextY === this.y) {\n      return;\n    }\n\n    this.x = nextX;\n    this.y = nextY;\n\n    this.emitEvent('igcColorPicked', {\n      detail: {\n        x: Math.round(asPercent(nextX + marker.width, rect.width)),\n        y: Math.round(asPercent(nextY + marker.height, rect.height)),\n      },\n      bubbles: false,\n    });\n  }\n\n  private _onArrowKey({ dx, dy }: { dx: number; dy: number }): void {\n    this._commitPosition(this.x + dx, this.y + dy, this._measure());\n  }\n\n  private _move(event: PointerEvent): void {\n    event.preventDefault();\n    event.stopPropagation();\n\n    const geometry = this._dragGeometry ?? this._measure();\n    const { rect, marker } = geometry;\n\n    this._commitPosition(\n      event.clientX - rect.x - marker.width,\n      event.clientY - rect.y - marker.height,\n      geometry\n    );\n  }\n\n  private _handlePointerDown(event: PointerEvent): void {\n    if (event.button !== 0) return;\n    this.setPointerCapture(event.pointerId);\n    this.addEventListener('pointermove', this._handlePointerMove);\n    this._dragGeometry = this._measure();\n    this._dragging = true;\n    this._move(event);\n  }\n\n  private _handleLostPointerCapture(): void {\n    this.removeEventListener('pointermove', this._handlePointerMove);\n    this._dragGeometry = undefined;\n    this._dragging = false;\n    this._marker?.focus();\n  }\n\n  private _handlePointerMove(event: PointerEvent): void {\n    this._move(event);\n  }\n\n  public getMarkerDimensions(): { width: number; height: number } {\n    const marker = this._marker;\n\n    // Offsets rather than a client rect: the marker is scaled up while dragged\n    // and a rect would report the transformed box, shifting every position\n    // resolved against it.\n    return marker\n      ? { width: marker.offsetWidth / 2, height: marker.offsetHeight / 2 }\n      : { width: 0, height: 0 };\n  }\n\n  protected override render() {\n    const styles = styleMap({\n      top: `${this.y}px`,\n      left: `${this.x}px`,\n    });\n\n    const saturation = Math.round(this.saturation);\n    const brightness = Math.round(this.brightness);\n\n    // ARIA has no two-dimensional slider, so the marker is exposed as a single\n    // slider tracking saturation, with `aria-valuetext` carrying both axes -\n    // otherwise vertical movement would be announced as \"no change\".\n    return html`\n      <div\n        part=${partMap({ marker: true, dragging: this._dragging })}\n        style=${styles}\n        tabindex=\"0\"\n        role=\"slider\"\n        aria-label=${this.markerLabel}\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"\n        aria-valuenow=${saturation}\n        aria-valuetext=\"Saturation ${saturation}%, brightness ${brightness}%\"\n      ></div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-picker-canvas': IgcPickerCanvasComponent;\n  }\n}\n"]}