@six-group/ui-library 5.0.0-rc.1 → 5.0.0-rc.2

package/dist/ui-library/{p-f4dd7b57.entry.js → p-d9e770ab.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as o,h as i,g as r}from"./p-JoG9I7EO.js";import{E as s}from"./p-C4h4qpGl.js";import{F as e}from"./p-Dg9366Gk.js";import{h as l}from"./p-j3oIB5oT.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*";transform:scale(1.1);margin-left:var(--six-spacing-xxx-small);position:absolute}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{--height:var(--six-selection-control-toggle-size);--thumb-size:calc(var(--six-selection-control-toggle-size) - 4px);--width:calc(var(--height) * 2);display:inline-block}.switch{display:inline-flex;align-items:center;font-family:var(--six-font-family);font-size:var(--six-input-font-size-medium);font-weight:var(--six-input-font-weight);color:var(--six-input-color);vertical-align:middle;cursor:pointer}.switch__control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--width);height:var(--height);background-color:var(--six-selection-control-color-disabled);border-radius:var(--height);transition:var(--six-transition-fast) border-color, var(--six-transition-fast) background-color}.switch__control .switch__thumb{width:var(--thumb-size);height:var(--thumb-size);background-color:var(--six-input-background-color);border-radius:50%;transform:translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));transition:var(--six-transition-fast) transform ease, var(--six-transition-fast) background-color, var(--six-transition-fast) border-color, var(--six-transition-fast) box-shadow}.switch__control input[type=checkbox]{position:absolute;opacity:0;padding:0;margin:0;pointer-events:none}.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-hover)}.switch--checked .switch__control{background-color:var(--six-selection-control-color)}.switch--checked .switch__control .switch__thumb{background-color:var(--six-color-white);transform:translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2))}.switch.switch--checked:not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-focus)}.switch--disabled{cursor:not-allowed;color:var(--six-selection-control-color-disabled)}.switch--disabled .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch--disabled.switch--checked .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch__label{line-height:var(--height);margin-left:0.5em;user-select:none}';let c=0;const n=class{constructor(i){t(this,i);this.sixBlur=o(this,"six-switch-blur");this.sixChange=o(this,"six-switch-change");this.sixFocus=o(this,"six-switch-focus");this.switchId=`switch-${++c}`;this.labelId=`switch-label-${c}`;this.errorTextId=`input-error-text-${c}`;this.eventListeners=new s;this.hasFocus=false;this.hasErrorTextSlot=false;this.name="";this.value="on";this.disabled=false;this.required=false;this.checked=false;this.label="";this.errorText="";this.invalid=false;this.handleSlotChange=()=>{this.hasErrorTextSlot=l(this.host,"error-text")};this.handleClick=()=>{if(this.inputElement!=null){this.checked=this.inputElement.checked;this.sixChange.emit(this.checked)}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit(this.checked)};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleKeyDown=t=>{if(t.key==="ArrowLeft"){t.preventDefault();this.checked=false;this.sixChange.emit(this.checked)}if(t.key==="ArrowRight"){t.preventDefault();this.checked=true;this.sixChange.emit(this.checked)}};this.handleMouseDown=t=>{var o;t.preventDefault();(o=this.inputElement)===null||o===void 0?void 0:o.focus()}}componentWillLoad(){this.handleSlotChange()}handleCheckedChange(){if(this.inputElement!=null){this.inputElement.checked=this.checked;this.checked=this.inputElement.checked}}connectedCallback(){var t;(t=this.host.shadowRoot)===null||t===void 0?void 0:t.addEventListener("slotchange",this.handleSlotChange);this.eventListeners.forward("six-switch-change","change",this.host);this.eventListeners.forward("six-switch-blur","blur",this.host);this.eventListeners.forward("six-switch-focus","focus",this.host)}disconnectedCallback(){var t;(t=this.host.shadowRoot)===null||t===void 0?void 0:t.removeEventListener("slotchange",this.handleSlotChange);this.eventListeners.removeAll()}handleLabelChange(){this.handleSlotChange()}async setFocus(t){var o;(o=this.inputElement)===null||o===void 0?void 0:o.focus(t)}async removeFocus(){var t;(t=this.inputElement)===null||t===void 0?void 0:t.blur()}render(){return i(e,{key:"a358f086b57322b8e3225f4775b09506e766c968",inputId:this.switchId,label:this.label,labelId:this.labelId,hasLabelSlot:false,errorTextId:this.errorTextId,errorText:this.errorText,errorTextCount:this.errorTextCount,hasErrorTextSlot:this.hasErrorTextSlot,size:"medium",disabled:this.disabled,required:this.required,displayError:this.invalid},i("label",{key:"7b87b1d45026bb79c0c1ce5c0cf2e969ee0d0ca7",part:"base",htmlFor:this.switchId,class:{switch:true,"switch--checked":this.checked,"switch--disabled":this.disabled,"switch--focused":this.hasFocus},onMouseDown:this.handleMouseDown},i("span",{key:"35bd92fabfb1b177a048789e9f0f9d68499b7bd0",part:"control",class:"switch__control"},i("span",{key:"0c85de3b5d75b3d083554931a5648be5ba26f7fc",part:"thumb",class:"switch__thumb"}),i("input",{key:"5c807156b356962f347820301050cd096ba67330",ref:t=>this.inputElement=t,id:this.switchId,type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,required:this.required,role:"switch","aria-checked":this.checked?"true":"false","aria-labelledby":this.labelId,onClick:this.handleClick,onBlur:this.handleBlur,onFocus:this.handleFocus,onKeyDown:this.handleKeyDown})),i("span",{key:"923235545aec3ccb5c04aec3316fd8e5a2d027e2",part:"label",id:this.labelId,class:"switch__label"},i("slot",{key:"53e2689b7efaac1a93954d02eb7d6b1cdadc8c73"}))))}get host(){return r(this)}static get watchers(){return{checked:["handleCheckedChange"],errorText:["handleLabelChange"],label:["handleLabelChange"]}}};n.style=a;export{n as six_switch};
-//# sourceMappingURL=p-f4dd7b57.entry.js.map
+import{r as t,c as o,h as i,g as r}from"./p-JoG9I7EO.js";import{E as s}from"./p-C4h4qpGl.js";import{F as e}from"./p-Dg9366Gk.js";import{h as l}from"./p-j3oIB5oT.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:"*";transform:scale(1.1);margin-left:var(--six-spacing-xxx-small);position:absolute}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host{--height:var(--six-selection-control-toggle-size);--thumb-size:calc(var(--six-selection-control-toggle-size) - 4px);--width:calc(var(--height) * 2);display:inline-block}.switch{display:inline-flex;align-items:center;font-family:var(--six-font-family);font-size:var(--six-input-font-size-medium);font-weight:var(--six-input-font-weight);color:var(--six-input-color);vertical-align:middle;cursor:pointer}.switch__control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--width);height:var(--height);background-color:var(--six-selection-control-color-disabled);border-radius:var(--height);transition:var(--six-transition-fast) border-color, var(--six-transition-fast) background-color}.switch__control .switch__thumb{width:var(--thumb-size);height:var(--thumb-size);background-color:var(--six-input-background-color);border-radius:50%;transform:translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));transition:var(--six-transition-fast) transform ease, var(--six-transition-fast) background-color, var(--six-transition-fast) border-color, var(--six-transition-fast) box-shadow}.switch__control input[type=checkbox]{position:absolute;opacity:0;padding:0;margin:0;pointer-events:none}.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-hover)}.switch--checked .switch__control{background-color:var(--six-selection-control-color)}.switch--checked .switch__control .switch__thumb{background-color:var(--six-color-white);transform:translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2))}.switch.switch--checked:not(.switch--disabled) .switch__control:hover{background-color:var(--six-input-border-color-focus)}.switch--disabled{cursor:not-allowed;color:var(--six-selection-control-color-disabled)}.switch--disabled .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch--disabled.switch--checked .switch__control{background-color:var(--six-selection-control-color-disabled)}.switch__label{line-height:var(--height);margin-left:0.5em;user-select:none}';let n=0;const c=class{constructor(i){t(this,i);this.sixBlur=o(this,"six-switch-blur");this.sixChange=o(this,"six-switch-change");this.sixFocus=o(this,"six-switch-focus");this.switchId=`switch-${++n}`;this.labelId=`switch-label-${n}`;this.errorTextId=`input-error-text-${n}`;this.eventListeners=new s;this.hasFocus=false;this.hasErrorTextSlot=false;this.name="";this.value="on";this.disabled=false;this.required=false;this.checked=false;this.label="";this.errorText="";this.invalid=false;this.handleSlotChange=()=>{this.hasErrorTextSlot=l(this.host,"error-text")};this.handleClick=()=>{if(this.inputElement!=null){this.checked=this.inputElement.checked;this.sixChange.emit(this.checked)}};this.handleBlur=()=>{this.hasFocus=false;this.sixBlur.emit(this.checked)};this.handleFocus=()=>{this.hasFocus=true;this.sixFocus.emit()};this.handleKeyDown=t=>{if(t.key==="ArrowLeft"){t.preventDefault();this.checked=false;this.sixChange.emit(this.checked)}if(t.key==="ArrowRight"){t.preventDefault();this.checked=true;this.sixChange.emit(this.checked)}};this.handleMouseDown=t=>{var o;t.preventDefault();(o=this.inputElement)===null||o===void 0?void 0:o.focus()}}componentWillLoad(){this.handleSlotChange()}handleCheckedChange(){if(this.inputElement!=null){this.inputElement.checked=this.checked;this.checked=this.inputElement.checked}}connectedCallback(){var t;(t=this.host.shadowRoot)===null||t===void 0?void 0:t.addEventListener("slotchange",this.handleSlotChange);this.eventListeners.forward("six-switch-change","change",this.host);this.eventListeners.forward("six-switch-blur","blur",this.host);this.eventListeners.forward("six-switch-focus","focus",this.host)}disconnectedCallback(){var t;(t=this.host.shadowRoot)===null||t===void 0?void 0:t.removeEventListener("slotchange",this.handleSlotChange);this.eventListeners.removeAll()}handleLabelChange(){this.handleSlotChange()}async setFocus(t){var o;(o=this.inputElement)===null||o===void 0?void 0:o.focus(t)}async removeFocus(){var t;(t=this.inputElement)===null||t===void 0?void 0:t.blur()}render(){return i(e,{key:"fd6c9c888316e46623e92b779c2215888783413b",inputId:this.switchId,label:this.label,labelId:this.labelId,hasLabelSlot:false,errorTextId:this.errorTextId,errorText:this.errorText,errorTextCount:this.errorTextCount,hasErrorTextSlot:this.hasErrorTextSlot,size:"medium",disabled:this.disabled,required:this.required,displayError:this.invalid},i("label",{key:"d7d5f569d8aea4f7203f7c0973cf212bd6bcfc60",part:"base",htmlFor:this.switchId,class:{switch:true,"switch--checked":this.checked,"switch--disabled":this.disabled,"switch--focused":this.hasFocus},onMouseDown:this.handleMouseDown},i("span",{key:"4043bb4abed6a44a360b5409b0e4ebd5929a719f",part:"control",class:"switch__control"},i("span",{key:"d93e868866ea81ae2c2832ddc6fdcb11c0b23679",part:"thumb",class:"switch__thumb"}),i("input",{key:"7e5cff86449295f36e85b221f8795f3df18808ae",ref:t=>this.inputElement=t,id:this.switchId,type:"checkbox",name:this.name,value:this.value,checked:this.checked,disabled:this.disabled,required:this.required,role:"switch","aria-checked":this.checked?"true":"false","aria-labelledby":this.labelId,onClick:this.handleClick,onBlur:this.handleBlur,onFocus:this.handleFocus,onKeyDown:this.handleKeyDown})),i("span",{key:"c0823f84eb3a30c2e0fdfe5acb6f1390e2b389aa",part:"label",id:this.labelId,class:"switch__label"},i("slot",{key:"aeb69e52fd37efab7ee8061d3c69bfab1c174933"}))))}get host(){return r(this)}static get watchers(){return{checked:["handleCheckedChange"],errorText:["handleLabelChange"],label:["handleLabelChange"]}}};c.style=a;export{c as six_switch};
+//# sourceMappingURL=p-d9e770ab.entry.js.map

package/dist/ui-library/p-d9e770ab.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sixSwitchCss","id","SixSwitch","constructor","hostRef","this","switchId","labelId","errorTextId","eventListeners","EventListeners","hasFocus","hasErrorTextSlot","name","value","disabled","required","checked","label","errorText","invalid","handleSlotChange","hasSlot","host","handleClick","inputElement","sixChange","emit","handleBlur","sixBlur","handleFocus","sixFocus","handleKeyDown","event","key","preventDefault","handleMouseDown","_a","focus","componentWillLoad","handleCheckedChange","connectedCallback","shadowRoot","addEventListener","forward","disconnectedCallback","removeEventListener","removeAll","handleLabelChange","setFocus","options","removeFocus","blur","render","h","FormControl","inputId","hasLabelSlot","errorTextCount","size","displayError","part","htmlFor","class","switch","onMouseDown","ref","el","type","role","onClick","onBlur","onFocus","onKeyDown"],"sources":["src/components/six-switch/six-switch.scss?tag=six-switch&encapsulation=shadow","src/components/six-switch/six-switch.tsx"],"sourcesContent":["@import '../../../src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n/**\n * @prop --width: The width of the switch.\n * @prop --height: The height of the switch.\n * @prop --thumb-size: The size of the thumb.\n */\n:host {\n  --height: var(--six-selection-control-toggle-size);\n  --thumb-size: calc(var(--six-selection-control-toggle-size) - 4px);\n  --width: calc(var(--height) * 2);\n\n  display: inline-block;\n}\n\n.switch {\n  display: inline-flex;\n  align-items: center;\n  font-family: var(--six-font-family);\n  font-size: var(--six-input-font-size-medium);\n  font-weight: var(--six-input-font-weight);\n  color: var(--six-input-color);\n  vertical-align: middle;\n  cursor: pointer;\n}\n\n.switch__control {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--width);\n  height: var(--height);\n  background-color: var(--six-selection-control-color-disabled);\n  border-radius: var(--height);\n  transition:\n    var(--six-transition-fast) border-color,\n    var(--six-transition-fast) background-color;\n\n  .switch__thumb {\n    width: var(--thumb-size);\n    height: var(--thumb-size);\n    background-color: var(--six-input-background-color);\n    border-radius: 50%;\n    transform: translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));\n    transition:\n      var(--six-transition-fast) transform ease,\n      var(--six-transition-fast) background-color,\n      var(--six-transition-fast) border-color,\n      var(--six-transition-fast) box-shadow;\n  }\n\n  input[type='checkbox'] {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n}\n\n// Hover\n.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n  background-color: var(--six-input-border-color-hover);\n}\n\n// Checked\n.switch--checked .switch__control {\n  background-color: var(--six-selection-control-color);\n\n  .switch__thumb {\n    background-color: var(--six-color-white);\n    transform: translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2));\n  }\n}\n\n// Checked + hover\n.switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n  background-color: var(--six-input-border-color-focus);\n}\n\n// Disabled\n.switch--disabled {\n  cursor: not-allowed;\n  color: var(--six-selection-control-color-disabled);\n\n  .switch__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n\n  &.switch--checked .switch__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n}\n\n.switch__label {\n  line-height: var(--height);\n  margin-left: 0.5em;\n  user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The switch's label.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part control - The switch control.\n * @part thumb - The switch position indicator.\n * @part label - The switch label.\n */\n\n@Component({\n  tag: 'six-switch',\n  styleUrl: 'six-switch.scss',\n  shadow: true,\n})\nexport class SixSwitch {\n  private switchId = `switch-${++id}`;\n  private labelId = `switch-label-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n\n  private inputElement?: HTMLInputElement;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixSwitchElement;\n\n  @State() hasFocus = false;\n  @State() hasErrorTextSlot = false;\n\n  /** The switch's name attribute. */\n  @Prop() name = '';\n\n  /** The switch's value attribute. */\n  @Prop() value = 'on';\n\n  /** Set to true to disable the switch. */\n  @Prop() disabled = false;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** Set to true to draw the switch in a checked state. */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  @Watch('checked')\n  handleCheckedChange() {\n    if (this.inputElement != null) {\n      this.inputElement.checked = this.checked;\n      this.checked = this.inputElement.checked;\n    }\n  }\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-switch-blur' }) sixBlur!: EventEmitter<boolean>;\n\n  /** Emitted when the control's checked state changes. */\n  @Event({ eventName: 'six-switch-change' }) sixChange!: EventEmitter<boolean>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-switch-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-switch-change', 'change', this.host);\n    this.eventListeners.forward('six-switch-blur', 'blur', this.host);\n    this.eventListeners.forward('six-switch-focus', 'focus', this.host);\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  private handleSlotChange = () => {\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  /** Sets focus on the switch. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.inputElement?.focus(options);\n  }\n\n  /** Removes focus from the switch. */\n  @Method()\n  async removeFocus() {\n    this.inputElement?.blur();\n  }\n\n  private handleClick = () => {\n    if (this.inputElement != null) {\n      this.checked = this.inputElement.checked;\n      this.sixChange.emit(this.checked);\n    }\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit(this.checked);\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      this.checked = false;\n      this.sixChange.emit(this.checked);\n    }\n\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      this.checked = true;\n      this.sixChange.emit(this.checked);\n    }\n  };\n\n  private handleMouseDown = (event: MouseEvent) => {\n    // Prevent clicks on the label from briefly blurring the input\n    event.preventDefault();\n    this.inputElement?.focus();\n  };\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.switchId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={false}\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        size=\"medium\"\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <label\n          part=\"base\"\n          htmlFor={this.switchId}\n          class={{\n            switch: true,\n            'switch--checked': this.checked,\n            'switch--disabled': this.disabled,\n            'switch--focused': this.hasFocus,\n          }}\n          onMouseDown={this.handleMouseDown}\n        >\n          <span part=\"control\" class=\"switch__control\">\n            <span part=\"thumb\" class=\"switch__thumb\" />\n\n            <input\n              ref={(el) => (this.inputElement = el)}\n              id={this.switchId}\n              type=\"checkbox\"\n              name={this.name}\n              value={this.value}\n              checked={this.checked}\n              disabled={this.disabled}\n              required={this.required}\n              role=\"switch\"\n              aria-checked={this.checked ? 'true' : 'false'}\n              aria-labelledby={this.labelId}\n              onClick={this.handleClick}\n              onBlur={this.handleBlur}\n              onFocus={this.handleFocus}\n              onKeyDown={this.handleKeyDown}\n            />\n          </span>\n\n          <span part=\"label\" id={this.labelId} class=\"switch__label\">\n            <slot />\n          </span>\n        </label>\n      </FormControl>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-ea3bf68d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as a,H as s,g as e}from"./p-JoG9I7EO.js";const i=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block;font-family:var(--six-font-family)}.tab-panel{border:solid 1px transparent;padding:20px 20px}";let o=0;const r=class{constructor(a){t(this,a);this.componentId=`tab-panel-${++o}`;this.name="";this.active=false}render(){return a(s,{key:"b4c54fb42d68a3462abbd78dda16b1738e81dc57",id:this.host.id||this.componentId,style:{display:this.active?"block":"none"}},a("div",{key:"734645855fb3a875a6a43e46383122ddad15bbb3",part:"base",class:"tab-panel",role:"tabpanel","aria-selected":this.active?"true":"false","aria-hidden":this.active?"false":"true"},a("slot",{key:"1a789d112f5a048ac36f9a7e70208c99fb66c6c9"})))}get host(){return e(this)}};r.style=i;export{r as six_tab_panel};
+//# sourceMappingURL=p-ea3bf68d.entry.js.map

package/dist/ui-library/p-ee980a0f.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["sixRangeCss","id","SixRange","constructor","hostRef","this","inputId","labelId","helpTextId","errorTextId","eventListeners","EventListeners","hasFocus","hasHelpTextSlot","hasErrorTextSlot","hasLabelSlot","hasTooltip","name","value","required","helpText","disabled","label","errorText","invalid","min","max","step","tooltip","tooltipFormatter","toString","handleInput","nativeInput","update","parseFloat","requestAnimationFrame","sixChange","emit","handleBlur","sixBlur","_a","resizeObserver","unobserve","handleFocus","sixFocus","observe","handleSlotChange","hasSlot","host","handleTouchStart","setFocus","handleLabelChange","handleValueChange","connectedCallback","shadowRoot","addEventListener","componentWillLoad","componentDidLoad","ResizeObserver","disconnectedCallback","removeEventListener","removeAll","componentDidUpdate","getMinMax","syncTooltip","Number","_b","options","focus","removeFocus","blur","output","percent","Math","inputWidth","offsetWidth","tooltipWidth","thumbSize","getComputedStyle","getPropertyValue","x","style","transform","marginLeft","isFirefox","navigator","userAgent","toLowerCase","indexOf","updateValue","parsedValue","isNaN","getDefaultValue","calculateColorRunnableTrack","ceil","background","render","h","FormControl","key","size","errorTextCount","displayError","part","class","range","onTouchStart","ref","el","type","onInput","onFocus","onBlur"],"sources":["src/components/six-range/six-range.scss?tag=six-range&encapsulation=shadow","src/components/six-range/six-range.tsx"],"sourcesContent":["@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  --thumb-size: 14px;\n  --tooltip-offset-y: 10px;\n  --track-color: var(--six-color-web-rock-900);\n  --thumb-color: var(--six-color-web-rock-900);\n  --track-height: 3px;\n\n  display: block;\n}\n\n.range {\n  position: relative;\n\n  .range__control {\n    -webkit-appearance: none;\n    width: 100%;\n    height: var(--six-input-height-medium);\n    background: transparent;\n    line-height: var(--six-input-height-medium);\n    vertical-align: middle;\n\n    &::-webkit-slider-runnable-track {\n      width: 100%;\n      height: var(--track-height);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-webkit-slider-thumb {\n      border: none;\n      width: var(--thumb-size);\n      height: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      -webkit-appearance: none;\n      margin-top: calc(var(--thumb-size) / -2 + var(--track-height) / 2);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-webkit-slider-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  Firefox\n    &::-moz-focus-outer {\n      border: 0;\n    }\n\n    &::-moz-range-track {\n      width: 100%;\n      height: var(--track-height);\n      background-color: var(--six-progress-track-color);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-moz-range-progress {\n      height: var(--track-height);\n      border-radius: 3px;\n      background-color: var(--track-color);\n      border: none;\n    }\n\n    &::-moz-range-thumb {\n      border: none;\n      height: var(--thumb-size);\n      width: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-moz-range-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-moz-range-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-moz-range-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  States\n    &:focus {\n      outline: none;\n    }\n\n    &:disabled {\n      &::-webkit-slider-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n\n      &::-moz-range-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n    }\n  }\n}\n\n// Tooltip\n.range__tooltip {\n  position: absolute;\n  z-index: var(--six-z-index-tooltip);\n  left: 2px;\n  border-radius: var(--six-border-radius-medium);\n  background-color: var(--six-color-web-rock-900);\n  font-family: var(--six-font-family);\n  font-size: var(--six-tooltip-font-size);\n  font-weight: var(--six-tooltip-font-weight);\n  line-height: var(--six-tooltip-line-height);\n  color: var(--six-color-white);\n  opacity: 0;\n  padding: var(--six-spacing-xxx-small) var(--six-spacing-xx-small);\n  transition: var(--six-transition-fast) opacity;\n  pointer-events: none;\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n    left: 50%;\n    margin-left: calc(-1 * var(--six-tooltip-arrow-size));\n  }\n}\n\n.range--tooltip-visible .range__tooltip {\n  opacity: 1;\n}\n\n// Tooltip on top\n.range--tooltip-top .range__tooltip {\n  top: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-top: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    top: 100%;\n  }\n}\n\n// Tooltip on bottom\n.range--tooltip-bottom .range__tooltip {\n  bottom: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-bottom: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    bottom: 100%;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot label - The input's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the input. Alternatively, you can use the help-text prop.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part input - The native range input.\n * @part tooltip - The range tooltip.\n */\n@Component({\n  tag: 'six-range',\n  styleUrl: 'six-range.scss',\n  shadow: true,\n})\nexport class SixRange {\n  private inputId = `input-${++id}`;\n  private labelId = `input-label-${id}`;\n  private helpTextId = `input-help-text-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n  private eventListeners = new EventListeners();\n  private resizeObserver?: ResizeObserver;\n\n  private output?: HTMLElement;\n  private nativeInput?: HTMLInputElement;\n\n  @Element() host!: HTMLSixRangeElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasErrorTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasTooltip = false;\n\n  /** The input's name attribute. */\n  @Prop() name = '';\n\n  /** The input's value attribute. */\n  @Prop({ mutable: true }) value = 0;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The range's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Set to true to disable the input. */\n  @Prop() disabled = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** The input's min attribute. */\n  @Prop() min = 0;\n\n  /** The input's max attribute. */\n  @Prop() max = 100;\n\n  /** The input's step attribute. */\n  @Prop() step = 1;\n\n  /** The preferred placedment of the tooltip. */\n  @Prop() tooltip: 'top' | 'bottom' | 'none' = 'top';\n\n  /** A function used to format the tooltip's value. */\n  @Prop() tooltipFormatter = (value: number) => value.toString();\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-range-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-range-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-range-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  @Watch('label')\n  @Watch('errorText')\n  @Watch('helpText')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('value')\n  @Watch('min')\n  @Watch('max')\n  handleValueChange() {\n    this.update();\n  }\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  componentWillLoad() {\n    this.update();\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    const nativeInput = this.nativeInput;\n    if (nativeInput == null) {\n      return;\n    }\n    this.update();\n    this.resizeObserver = new ResizeObserver(() => this.update());\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  componentDidUpdate() {\n    const { min, max } = this.getMinMax();\n    this.syncTooltip(min, max, this.value);\n  }\n\n  private getMinMax() {\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    return { min, max };\n  }\n\n  /** Sets focus on the input. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the input. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  private handleInput = () => {\n    if (this.nativeInput != null) {\n      this.update(parseFloat(this.nativeInput.value));\n    }\n    requestAnimationFrame(() => {\n      this.sixChange.emit();\n    });\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.hasTooltip = false;\n    this.sixBlur.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.unobserve(this.nativeInput);\n    }\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.hasTooltip = true;\n    this.sixFocus.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.observe(this.nativeInput);\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  private handleTouchStart = () => {\n    this.setFocus();\n  };\n\n  private syncTooltip(min: number, max: number, value: number) {\n    if (this.tooltip !== 'none' && this.nativeInput != null && this.output != null) {\n      const percent = Math.max(0, (value - min) / (max - min));\n      const inputWidth = this.nativeInput.offsetWidth;\n      const tooltipWidth = this.output.offsetWidth;\n      const thumbSize = getComputedStyle(this.nativeInput).getPropertyValue('--thumb-size');\n      const x = `calc(${inputWidth * percent}px - calc(calc(${percent} * ${thumbSize}) - calc(${thumbSize} / 2)))`;\n      this.output.style.transform = `translateX(${x})`;\n      this.output.style.marginLeft = `-${tooltipWidth / 2}px`;\n    }\n  }\n\n  private isFirefox() {\n    return navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n  }\n\n  private update(updateValue?: number) {\n    if (updateValue != null) {\n      this.value = updateValue;\n    }\n\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    let value;\n    const parsedValue = parseFloat(this.value as never);\n    if (isNaN(parsedValue)) {\n      value = this.getDefaultValue(min, max);\n    } else {\n      value = parsedValue;\n    }\n\n    if (this.nativeInput != null) {\n      // The value may have constraints, so we set the native control's\n      // value and sync it back to ensure it adheres to min, max, and step\n      // properly.\n      this.nativeInput.value = value.toString();\n      this.value = parseFloat(this.nativeInput.value);\n    } else {\n      this.value = value;\n    }\n    this.calculateColorRunnableTrack(min, max, this.value);\n    this.syncTooltip(min, max, this.value);\n  }\n\n  /**\n   * from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#value\n   */\n  private getDefaultValue(min: number, max: number): number {\n    return max < min ? min : min + (max - min) / 2;\n  }\n\n  /**\n   * For Firefox this functionality is not needed because it is supported by standard CSS.\n   */\n  private calculateColorRunnableTrack(min: number, max: number, value: number) {\n    if (!this.isFirefox() && this.nativeInput != null) {\n      const percent = Math.ceil(((value - min) / (max - min)) * 100);\n      this.nativeInput.style.background =\n        '-webkit-linear-gradient(left, var(--track-color) 0%, var(--track-color) ' +\n        percent +\n        '%, var(--six-color-web-rock-300) ' +\n        percent +\n        '%)';\n    }\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        helpTextId={this.helpTextId}\n        helpText={this.helpText}\n        hasHelpTextSlot={this.hasHelpTextSlot}\n        size=\"medium\"\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        errorTextCount={this.errorTextCount}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <div\n          part=\"base\"\n          class={{\n            range: true,\n\n            // States\n            'range--disabled': this.disabled,\n            'range--focused': this.hasFocus,\n            'range--tooltip-visible': this.hasTooltip,\n            'range--tooltip-top': this.tooltip === 'top',\n            'range--tooltip-bottom': this.tooltip === 'bottom',\n          }}\n          onTouchStart={this.handleTouchStart}\n        >\n          <input\n            part=\"input\"\n            ref={(el) => (this.nativeInput = el)}\n            type=\"range\"\n            class=\"range__control\"\n            name={this.name}\n            disabled={this.disabled}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            value={this.value}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          {this.tooltip !== 'none' && (\n            <output part=\"tooltip\" ref={(el) => (this.output = el)} class=\"range__tooltip\">\n              {this.tooltipFormatter(this.value)}\n            </output>\n          )}\n        </div>\n      </FormControl>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["sixRangeCss","id","SixRange","constructor","hostRef","this","inputId","labelId","helpTextId","errorTextId","eventListeners","EventListeners","hasFocus","hasHelpTextSlot","hasErrorTextSlot","hasLabelSlot","hasTooltip","name","value","required","helpText","disabled","label","errorText","invalid","min","max","step","tooltip","tooltipFormatter","toString","handleInput","nativeInput","update","parseFloat","requestAnimationFrame","sixChange","emit","handleBlur","sixBlur","_a","resizeObserver","unobserve","handleFocus","sixFocus","observe","handleSlotChange","hasSlot","host","handleTouchStart","setFocus","handleLabelChange","handleValueChange","connectedCallback","shadowRoot","addEventListener","componentWillLoad","componentDidLoad","ResizeObserver","disconnectedCallback","removeEventListener","removeAll","componentDidUpdate","getMinMax","syncTooltip","Number","_b","options","focus","removeFocus","blur","output","percent","Math","inputWidth","offsetWidth","tooltipWidth","thumbSize","getComputedStyle","getPropertyValue","x","style","transform","marginLeft","isFirefox","navigator","userAgent","toLowerCase","indexOf","updateValue","parsedValue","isNaN","getDefaultValue","calculateColorRunnableTrack","ceil","background","render","h","FormControl","key","size","errorTextCount","displayError","part","class","range","onTouchStart","ref","el","type","onInput","onFocus","onBlur"],"sources":["src/components/six-range/six-range.scss?tag=six-range&encapsulation=shadow","src/components/six-range/six-range.tsx"],"sourcesContent":["@import '../../../src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  --thumb-size: 14px;\n  --tooltip-offset-y: 10px;\n  --track-color: var(--six-color-web-rock-900);\n  --thumb-color: var(--six-color-web-rock-900);\n  --track-height: 3px;\n\n  display: block;\n}\n\n.range {\n  position: relative;\n\n  .range__control {\n    -webkit-appearance: none;\n    width: 100%;\n    height: var(--six-input-height-medium);\n    background: transparent;\n    line-height: var(--six-input-height-medium);\n    vertical-align: middle;\n\n    &::-webkit-slider-runnable-track {\n      width: 100%;\n      height: var(--track-height);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-webkit-slider-thumb {\n      border: none;\n      width: var(--thumb-size);\n      height: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      -webkit-appearance: none;\n      margin-top: calc(var(--thumb-size) / -2 + var(--track-height) / 2);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-webkit-slider-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  Firefox\n    &::-moz-focus-outer {\n      border: 0;\n    }\n\n    &::-moz-range-track {\n      width: 100%;\n      height: var(--track-height);\n      background-color: var(--six-progress-track-color);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-moz-range-progress {\n      height: var(--track-height);\n      border-radius: 3px;\n      background-color: var(--track-color);\n      border: none;\n    }\n\n    &::-moz-range-thumb {\n      border: none;\n      height: var(--thumb-size);\n      width: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-moz-range-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-moz-range-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-moz-range-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  States\n    &:focus {\n      outline: none;\n    }\n\n    &:disabled {\n      &::-webkit-slider-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n\n      &::-moz-range-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n    }\n  }\n}\n\n// Tooltip\n.range__tooltip {\n  position: absolute;\n  z-index: var(--six-z-index-tooltip);\n  left: 2px;\n  border-radius: var(--six-border-radius-medium);\n  background-color: var(--six-color-web-rock-900);\n  font-family: var(--six-font-family);\n  font-size: var(--six-tooltip-font-size);\n  font-weight: var(--six-tooltip-font-weight);\n  line-height: var(--six-tooltip-line-height);\n  color: var(--six-color-white);\n  opacity: 0;\n  padding: var(--six-spacing-xxx-small) var(--six-spacing-xx-small);\n  transition: var(--six-transition-fast) opacity;\n  pointer-events: none;\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n    left: 50%;\n    margin-left: calc(-1 * var(--six-tooltip-arrow-size));\n  }\n}\n\n.range--tooltip-visible .range__tooltip {\n  opacity: 1;\n}\n\n// Tooltip on top\n.range--tooltip-top .range__tooltip {\n  top: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-top: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    top: 100%;\n  }\n}\n\n// Tooltip on bottom\n.range--tooltip-bottom .range__tooltip {\n  bottom: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-bottom: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    bottom: 100%;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot label - The input's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the input. Alternatively, you can use the help-text prop.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part input - The native range input.\n * @part tooltip - The range tooltip.\n */\n@Component({\n  tag: 'six-range',\n  styleUrl: 'six-range.scss',\n  shadow: true,\n})\nexport class SixRange {\n  private inputId = `input-${++id}`;\n  private labelId = `input-label-${id}`;\n  private helpTextId = `input-help-text-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n  private eventListeners = new EventListeners();\n  private resizeObserver?: ResizeObserver;\n\n  private output?: HTMLElement;\n  private nativeInput?: HTMLInputElement;\n\n  @Element() host!: HTMLSixRangeElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasErrorTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasTooltip = false;\n\n  /** The input's name attribute. */\n  @Prop() name = '';\n\n  /** The input's value attribute. */\n  @Prop({ mutable: true }) value = 0;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The range's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Set to true to disable the input. */\n  @Prop() disabled = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** The input's min attribute. */\n  @Prop() min = 0;\n\n  /** The input's max attribute. */\n  @Prop() max = 100;\n\n  /** The input's step attribute. */\n  @Prop() step = 1;\n\n  /** The preferred placedment of the tooltip. */\n  @Prop() tooltip: 'top' | 'bottom' | 'none' = 'top';\n\n  /** A function used to format the tooltip's value. */\n  @Prop() tooltipFormatter = (value: number) => value.toString();\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-range-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-range-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-range-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  @Watch('label')\n  @Watch('errorText')\n  @Watch('helpText')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('value')\n  @Watch('min')\n  @Watch('max')\n  handleValueChange() {\n    this.update();\n  }\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  componentWillLoad() {\n    this.update();\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    const nativeInput = this.nativeInput;\n    if (nativeInput == null) {\n      return;\n    }\n    this.update();\n    this.resizeObserver = new ResizeObserver(() => this.update());\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  componentDidUpdate() {\n    const { min, max } = this.getMinMax();\n    this.syncTooltip(min, max, this.value);\n  }\n\n  private getMinMax() {\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    return { min, max };\n  }\n\n  /** Sets focus on the input. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the input. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  private handleInput = () => {\n    if (this.nativeInput != null) {\n      this.update(parseFloat(this.nativeInput.value));\n    }\n    requestAnimationFrame(() => {\n      this.sixChange.emit();\n    });\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.hasTooltip = false;\n    this.sixBlur.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.unobserve(this.nativeInput);\n    }\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.hasTooltip = true;\n    this.sixFocus.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.observe(this.nativeInput);\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  private handleTouchStart = () => {\n    this.setFocus();\n  };\n\n  private syncTooltip(min: number, max: number, value: number) {\n    if (this.tooltip !== 'none' && this.nativeInput != null && this.output != null) {\n      const percent = Math.max(0, (value - min) / (max - min));\n      const inputWidth = this.nativeInput.offsetWidth;\n      const tooltipWidth = this.output.offsetWidth;\n      const thumbSize = getComputedStyle(this.nativeInput).getPropertyValue('--thumb-size');\n      const x = `calc(${inputWidth * percent}px - calc(calc(${percent} * ${thumbSize}) - calc(${thumbSize} / 2)))`;\n      this.output.style.transform = `translateX(${x})`;\n      this.output.style.marginLeft = `-${tooltipWidth / 2}px`;\n    }\n  }\n\n  private isFirefox() {\n    return navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n  }\n\n  private update(updateValue?: number) {\n    if (updateValue != null) {\n      this.value = updateValue;\n    }\n\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    let value;\n    const parsedValue = parseFloat(this.value as never);\n    if (isNaN(parsedValue)) {\n      value = this.getDefaultValue(min, max);\n    } else {\n      value = parsedValue;\n    }\n\n    if (this.nativeInput != null) {\n      // The value may have constraints, so we set the native control's\n      // value and sync it back to ensure it adheres to min, max, and step\n      // properly.\n      this.nativeInput.value = value.toString();\n      this.value = parseFloat(this.nativeInput.value);\n    } else {\n      this.value = value;\n    }\n    this.calculateColorRunnableTrack(min, max, this.value);\n    this.syncTooltip(min, max, this.value);\n  }\n\n  /**\n   * from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#value\n   */\n  private getDefaultValue(min: number, max: number): number {\n    return max < min ? min : min + (max - min) / 2;\n  }\n\n  /**\n   * For Firefox this functionality is not needed because it is supported by standard CSS.\n   */\n  private calculateColorRunnableTrack(min: number, max: number, value: number) {\n    if (!this.isFirefox() && this.nativeInput != null) {\n      const percent = Math.ceil(((value - min) / (max - min)) * 100);\n      this.nativeInput.style.background =\n        '-webkit-linear-gradient(left, var(--track-color) 0%, var(--track-color) ' +\n        percent +\n        '%, var(--six-color-web-rock-300) ' +\n        percent +\n        '%)';\n    }\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        helpTextId={this.helpTextId}\n        helpText={this.helpText}\n        hasHelpTextSlot={this.hasHelpTextSlot}\n        size=\"medium\"\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        errorTextCount={this.errorTextCount}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <div\n          part=\"base\"\n          class={{\n            range: true,\n\n            // States\n            'range--disabled': this.disabled,\n            'range--focused': this.hasFocus,\n            'range--tooltip-visible': this.hasTooltip,\n            'range--tooltip-top': this.tooltip === 'top',\n            'range--tooltip-bottom': this.tooltip === 'bottom',\n          }}\n          onTouchStart={this.handleTouchStart}\n        >\n          <input\n            part=\"input\"\n            ref={(el) => (this.nativeInput = el)}\n            type=\"range\"\n            class=\"range__control\"\n            name={this.name}\n            disabled={this.disabled}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            value={this.value}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          {this.tooltip !== 'none' && (\n            <output part=\"tooltip\" ref={(el) => (this.output = el)} class=\"range__tooltip\">\n              {this.tooltipFormatter(this.value)}\n            </output>\n          )}\n        </div>\n      </FormControl>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/{p-29d79fe3.entry.js → p-f54d3616.entry.js}

@@ -1,2 +1,2 @@
-import{r as a,c as i,h as r}from"./p-JoG9I7EO.js";import{a as s}from"./p-j3oIB5oT.js";import{a as t}from"./p-CKhg9ibv.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-block;overflow:hidden}.tag{display:flex;align-items:center;border:solid 1px;font-family:var(--six-font-family);line-height:1;white-space:nowrap;user-select:none;cursor:default}.tag__content{text-overflow:ellipsis;overflow:hidden}.tag__clear::part(base){color:inherit;padding:0}.tag--info{color:var(--six-color-white);background-color:var(--six-color-web-rock-900);border-color:var(--six-color-web-rock-900)}.tag--success{color:var(--six-color-web-rock-900);border-color:var(--six-color-success-500);background-color:var(--six-color-success-500)}.tag--primary{color:var(--six-color-web-rock-900);border-color:var(--six-color-clay-50);background-color:var(--six-color-clay-50)}.tag--warning{color:var(--six-color-web-rock-900);border-color:var(--six-color-warning-700);background-color:var(--six-color-warning-700)}.tag--danger{color:var(--six-color-white);border-color:var(--six-color-danger-800);background-color:var(--six-color-danger-800)}.tag--action{color:var(--six-color-white);border-color:var(--six-color-action-500);background-color:var(--six-color-action-500)}.tag--small{font-size:var(--six-button-font-size-small);height:calc(var(--six-height-small) * 0.8);line-height:calc(var(--six-height-small) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-small);padding:0 var(--six-spacing-x-small)}.tag--small .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-xxx-small))}.tag--medium{font-size:var(--six-button-font-size-medium);height:calc(var(--six-height-medium) * 0.8);line-height:calc(var(--six-height-medium) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-medium);padding:0 var(--six-spacing-small)}.tag--medium .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-xx-small))}.tag--large{font-size:var(--six-button-font-size-large);height:calc(var(--six-height-large) * 0.8);line-height:calc(var(--six-height-large) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-large);padding:0 var(--six-spacing-medium)}.tag--large .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-x-small))}.tag--pill{border-radius:var(--six-border-radius-pill)}";const e=class{constructor(r){a(this,r);this.sixClear=i(this,"six-tag-clear");this.type="primary";this.size="medium";this.pill=false;this.clearable=false;this.resizeObserver=new ResizeObserver(t((()=>this.updateTooltip())));this.updateTooltip=()=>{if(this.tooltipElement!=null&&this.contentSlotElement!=null&&this.contentElement!=null){this.tooltipElement.content=s(this.contentSlotElement);this.tooltipElement.disabled=!(this.contentElement.offsetWidth<this.contentElement.scrollWidth)}};this.handleClearClick=()=>{this.sixClear.emit()}}connectedCallback(){if(this.contentElement!=null){this.resizeObserver.observe(this.contentElement)}}componentDidLoad(){if(this.contentElement!=null){this.resizeObserver.observe(this.contentElement)}}disconnectedCallback(){this.resizeObserver.disconnect()}render(){return r("span",{key:"6d436b39d9a220ad7e764afb2a61db3c15052bd8",part:"base",class:{tag:true,"tag--primary":this.type==="primary","tag--success":this.type==="success","tag--info":this.type==="info","tag--warning":this.type==="warning","tag--danger":this.type==="danger","tag--action":this.type==="action","tag--text":this.type==="text","tag--small":this.size==="small","tag--medium":this.size==="medium","tag--large":this.size==="large","tag--pill":this.pill,"tag--clear":this.clearable}},r("six-tooltip",{key:"12faec51f7e0ac427c47037b815564ff6509fa5b",ref:a=>this.tooltipElement=a},r("span",{key:"38d9b9a805f423491334d8c91463ec7f5c4a5460",ref:a=>this.contentElement=a,part:"content",class:"tag__content"},r("slot",{key:"1dce2aee10cb11b41ea4ff2a3691a7ed6050e3b9",ref:a=>this.contentSlotElement=a}))),this.clearable&&r("six-icon-button",{key:"d31750ec14c421b44ddc7a2f62db6dfd4ac19dd1",exportparts:"base:clear-button",size:"xSmall",name:"clear",class:"tag__clear",onClick:this.handleClearClick}))}};e.style=o;export{e as six_tag};
-//# sourceMappingURL=p-29d79fe3.entry.js.map
+import{r as a,c as i,h as r}from"./p-JoG9I7EO.js";import{a as s}from"./p-j3oIB5oT.js";import{a as t}from"./p-CKhg9ibv.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-block;overflow:hidden}.tag{display:flex;align-items:center;border:solid 1px;font-family:var(--six-font-family);line-height:1;white-space:nowrap;user-select:none;cursor:default}.tag__content{text-overflow:ellipsis;overflow:hidden}.tag__clear::part(base){color:inherit;padding:0}.tag--info{color:var(--six-color-white);background-color:var(--six-color-web-rock-900);border-color:var(--six-color-web-rock-900)}.tag--success{color:var(--six-color-web-rock-900);border-color:var(--six-color-success-500);background-color:var(--six-color-success-500)}.tag--primary{color:var(--six-color-web-rock-900);border-color:var(--six-color-clay-50);background-color:var(--six-color-clay-50)}.tag--warning{color:var(--six-color-web-rock-900);border-color:var(--six-color-warning-700);background-color:var(--six-color-warning-700)}.tag--danger{color:var(--six-color-white);border-color:var(--six-color-danger-800);background-color:var(--six-color-danger-800)}.tag--action{color:var(--six-color-white);border-color:var(--six-color-action-500);background-color:var(--six-color-action-500)}.tag--small{font-size:var(--six-button-font-size-small);height:calc(var(--six-height-small) * 0.8);line-height:calc(var(--six-height-small) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-small);padding:0 var(--six-spacing-x-small)}.tag--small .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-xxx-small))}.tag--medium{font-size:var(--six-button-font-size-medium);height:calc(var(--six-height-medium) * 0.8);line-height:calc(var(--six-height-medium) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-medium);padding:0 var(--six-spacing-small)}.tag--medium .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-xx-small))}.tag--large{font-size:var(--six-button-font-size-large);height:calc(var(--six-height-large) * 0.8);line-height:calc(var(--six-height-large) - var(--six-border-width) * 2);border-radius:var(--six-input-border-radius-large);padding:0 var(--six-spacing-medium)}.tag--large .tag__clear{margin-left:var(--six-spacing-xx-small);margin-right:calc(-1 * var(--six-spacing-x-small))}.tag--pill{border-radius:var(--six-border-radius-pill)}";const e=class{constructor(r){a(this,r);this.sixClear=i(this,"six-tag-clear");this.type="primary";this.size="medium";this.pill=false;this.clearable=false;this.resizeObserver=new ResizeObserver(t((()=>this.updateTooltip())));this.updateTooltip=()=>{if(this.tooltipElement!=null&&this.contentSlotElement!=null&&this.contentElement!=null){this.tooltipElement.content=s(this.contentSlotElement);this.tooltipElement.disabled=!(this.contentElement.offsetWidth<this.contentElement.scrollWidth)}};this.handleClearClick=()=>{this.sixClear.emit()}}connectedCallback(){if(this.contentElement!=null){this.resizeObserver.observe(this.contentElement)}}componentDidLoad(){if(this.contentElement!=null){this.resizeObserver.observe(this.contentElement)}}disconnectedCallback(){this.resizeObserver.disconnect()}render(){return r("span",{key:"e8a2448511ebcfa91f9714c1e575679fca929310",part:"base",class:{tag:true,"tag--primary":this.type==="primary","tag--success":this.type==="success","tag--info":this.type==="info","tag--warning":this.type==="warning","tag--danger":this.type==="danger","tag--action":this.type==="action","tag--text":this.type==="text","tag--small":this.size==="small","tag--medium":this.size==="medium","tag--large":this.size==="large","tag--pill":this.pill,"tag--clear":this.clearable}},r("six-tooltip",{key:"a8bffabc14f61bff5f499cd9324cb17497a6082b",ref:a=>this.tooltipElement=a},r("span",{key:"28a60248833682018fa9f11be5d02372893645e5",ref:a=>this.contentElement=a,part:"content",class:"tag__content"},r("slot",{key:"d47d95687a69a4822575ac3219872a51f445441d",ref:a=>this.contentSlotElement=a}))),this.clearable&&r("six-icon-button",{key:"477d12d125ff90d1cc0adb2bb62bf11bc6510927",exportparts:"base:clear-button",size:"xSmall",name:"clear",class:"tag__clear",onClick:this.handleClearClick}))}};e.style=o;export{e as six_tag};
+//# sourceMappingURL=p-f54d3616.entry.js.map

package/dist/ui-library/{p-285666de.entry.js → p-f6a1c20b.entry.js}

@@ -1,2 +1,2 @@
-import{r as i,h as e}from"./p-JoG9I7EO.js";const s=":host{display:block}a{text-decoration:none;display:block}.sidebar-item{padding:var(--six-spacing-small) var(--six-spacing-medium);color:var(--six-sidebar-color);cursor:pointer;font-family:var(--six-font-family);margin-left:var(--six-spacing-xx-small);display:flex;align-items:center}.sidebar-item:hover:not(.sidebar-item--disabled){color:var(--six-color-web-rock-600)}.sidebar-item.sidebar-item--disabled{outline:none;color:var(--six-input-color-disabled);cursor:not-allowed}.sidebar-item.sidebar-item--selected{font-weight:var(--six-font-weight-bold)}.sidebar-item:focus{outline:none}.sidebar-item:focus-visible{outline:var(--six-focus-ring);outline-offset:var(--six-focus-ring-offset)}.six-sidebar-item__icon{margin-right:var(--six-spacing-medium)}";const a=class{constructor(e){i(this,e);this.value="";this.selected=false;this.disabled=false;this.icon=""}render(){const i=this.href!=null?"a":"div";return e(i,{key:"d36654ad6af78000c79191da18b9af02d582dde1",class:{"sidebar-item":true,"sidebar-item--selected":this.selected,"sidebar-item--disabled":this.disabled},role:"menuitem",href:this.href,"aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false"},this.icon&&e("six-icon",{key:"8664269ee064fa6abd7529ddf92bfcd62e1fe83d",class:"six-sidebar-item__icon"},this.icon),e("slot",{key:"528d1bd9d6b2e329292a90b7f21412f441dce27b"}))}};a.style=s;export{a as six_sidebar_item};
-//# sourceMappingURL=p-285666de.entry.js.map
+import{r as i,h as e}from"./p-JoG9I7EO.js";const s=":host{display:block}a{text-decoration:none;display:block}.sidebar-item{padding:var(--six-spacing-small) var(--six-spacing-medium);color:var(--six-sidebar-color);cursor:pointer;font-family:var(--six-font-family);margin-left:var(--six-spacing-xx-small);display:flex;align-items:center}.sidebar-item:hover:not(.sidebar-item--disabled){color:var(--six-color-web-rock-600)}.sidebar-item.sidebar-item--disabled{outline:none;color:var(--six-input-color-disabled);cursor:not-allowed}.sidebar-item.sidebar-item--selected{font-weight:var(--six-font-weight-bold)}.sidebar-item:focus{outline:none}.sidebar-item:focus-visible{outline:var(--six-focus-ring);outline-offset:var(--six-focus-ring-offset)}.six-sidebar-item__icon{margin-right:var(--six-spacing-medium)}";const a=class{constructor(e){i(this,e);this.value="";this.selected=false;this.disabled=false;this.icon=""}render(){const i=this.href!=null?"a":"div";return e(i,{key:"968d681e125a0c399973cfa9d37ac5f9c269042f",class:{"sidebar-item":true,"sidebar-item--selected":this.selected,"sidebar-item--disabled":this.disabled},role:"menuitem",href:this.href,"aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false"},this.icon&&e("six-icon",{key:"cd6ecec3465b0aeb625d3f0d0e7f8f6a8e76a25f",class:"six-sidebar-item__icon"},this.icon),e("slot",{key:"a54998cb6bc27463ab2f9402736008a8767b8358"}))}};a.style=s;export{a as six_sidebar_item};
+//# sourceMappingURL=p-f6a1c20b.entry.js.map

package/dist/ui-library/six-range.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"six-range.entry.esm.js","sources":["src/components/six-range/six-range.scss?tag=six-range&encapsulation=shadow","src/components/six-range/six-range.tsx"],"sourcesContent":["@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  --thumb-size: 14px;\n  --tooltip-offset-y: 10px;\n  --track-color: var(--six-color-web-rock-900);\n  --thumb-color: var(--six-color-web-rock-900);\n  --track-height: 3px;\n\n  display: block;\n}\n\n.range {\n  position: relative;\n\n  .range__control {\n    -webkit-appearance: none;\n    width: 100%;\n    height: var(--six-input-height-medium);\n    background: transparent;\n    line-height: var(--six-input-height-medium);\n    vertical-align: middle;\n\n    &::-webkit-slider-runnable-track {\n      width: 100%;\n      height: var(--track-height);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-webkit-slider-thumb {\n      border: none;\n      width: var(--thumb-size);\n      height: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      -webkit-appearance: none;\n      margin-top: calc(var(--thumb-size) / -2 + var(--track-height) / 2);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-webkit-slider-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  Firefox\n    &::-moz-focus-outer {\n      border: 0;\n    }\n\n    &::-moz-range-track {\n      width: 100%;\n      height: var(--track-height);\n      background-color: var(--six-progress-track-color);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-moz-range-progress {\n      height: var(--track-height);\n      border-radius: 3px;\n      background-color: var(--track-color);\n      border: none;\n    }\n\n    &::-moz-range-thumb {\n      border: none;\n      height: var(--thumb-size);\n      width: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-moz-range-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-moz-range-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-moz-range-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  States\n    &:focus {\n      outline: none;\n    }\n\n    &:disabled {\n      &::-webkit-slider-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n\n      &::-moz-range-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n    }\n  }\n}\n\n// Tooltip\n.range__tooltip {\n  position: absolute;\n  z-index: var(--six-z-index-tooltip);\n  left: 2px;\n  border-radius: var(--six-border-radius-medium);\n  background-color: var(--six-color-web-rock-900);\n  font-family: var(--six-font-family);\n  font-size: var(--six-tooltip-font-size);\n  font-weight: var(--six-tooltip-font-weight);\n  line-height: var(--six-tooltip-line-height);\n  color: var(--six-color-white);\n  opacity: 0;\n  padding: var(--six-spacing-xxx-small) var(--six-spacing-xx-small);\n  transition: var(--six-transition-fast) opacity;\n  pointer-events: none;\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n    left: 50%;\n    margin-left: calc(-1 * var(--six-tooltip-arrow-size));\n  }\n}\n\n.range--tooltip-visible .range__tooltip {\n  opacity: 1;\n}\n\n// Tooltip on top\n.range--tooltip-top .range__tooltip {\n  top: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-top: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    top: 100%;\n  }\n}\n\n// Tooltip on bottom\n.range--tooltip-bottom .range__tooltip {\n  bottom: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-bottom: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    bottom: 100%;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot label - The input's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the input. Alternatively, you can use the help-text prop.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part input - The native range input.\n * @part tooltip - The range tooltip.\n */\n@Component({\n  tag: 'six-range',\n  styleUrl: 'six-range.scss',\n  shadow: true,\n})\nexport class SixRange {\n  private inputId = `input-${++id}`;\n  private labelId = `input-label-${id}`;\n  private helpTextId = `input-help-text-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n  private eventListeners = new EventListeners();\n  private resizeObserver?: ResizeObserver;\n\n  private output?: HTMLElement;\n  private nativeInput?: HTMLInputElement;\n\n  @Element() host!: HTMLSixRangeElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasErrorTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasTooltip = false;\n\n  /** The input's name attribute. */\n  @Prop() name = '';\n\n  /** The input's value attribute. */\n  @Prop({ mutable: true }) value = 0;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The range's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Set to true to disable the input. */\n  @Prop() disabled = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** The input's min attribute. */\n  @Prop() min = 0;\n\n  /** The input's max attribute. */\n  @Prop() max = 100;\n\n  /** The input's step attribute. */\n  @Prop() step = 1;\n\n  /** The preferred placedment of the tooltip. */\n  @Prop() tooltip: 'top' | 'bottom' | 'none' = 'top';\n\n  /** A function used to format the tooltip's value. */\n  @Prop() tooltipFormatter = (value: number) => value.toString();\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-range-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-range-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-range-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  @Watch('label')\n  @Watch('errorText')\n  @Watch('helpText')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('value')\n  @Watch('min')\n  @Watch('max')\n  handleValueChange() {\n    this.update();\n  }\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  componentWillLoad() {\n    this.update();\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    const nativeInput = this.nativeInput;\n    if (nativeInput == null) {\n      return;\n    }\n    this.update();\n    this.resizeObserver = new ResizeObserver(() => this.update());\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  componentDidUpdate() {\n    const { min, max } = this.getMinMax();\n    this.syncTooltip(min, max, this.value);\n  }\n\n  private getMinMax() {\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    return { min, max };\n  }\n\n  /** Sets focus on the input. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the input. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  private handleInput = () => {\n    if (this.nativeInput != null) {\n      this.update(parseFloat(this.nativeInput.value));\n    }\n    requestAnimationFrame(() => {\n      this.sixChange.emit();\n    });\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.hasTooltip = false;\n    this.sixBlur.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.unobserve(this.nativeInput);\n    }\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.hasTooltip = true;\n    this.sixFocus.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.observe(this.nativeInput);\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  private handleTouchStart = () => {\n    this.setFocus();\n  };\n\n  private syncTooltip(min: number, max: number, value: number) {\n    if (this.tooltip !== 'none' && this.nativeInput != null && this.output != null) {\n      const percent = Math.max(0, (value - min) / (max - min));\n      const inputWidth = this.nativeInput.offsetWidth;\n      const tooltipWidth = this.output.offsetWidth;\n      const thumbSize = getComputedStyle(this.nativeInput).getPropertyValue('--thumb-size');\n      const x = `calc(${inputWidth * percent}px - calc(calc(${percent} * ${thumbSize}) - calc(${thumbSize} / 2)))`;\n      this.output.style.transform = `translateX(${x})`;\n      this.output.style.marginLeft = `-${tooltipWidth / 2}px`;\n    }\n  }\n\n  private isFirefox() {\n    return navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n  }\n\n  private update(updateValue?: number) {\n    if (updateValue != null) {\n      this.value = updateValue;\n    }\n\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    let value;\n    const parsedValue = parseFloat(this.value as never);\n    if (isNaN(parsedValue)) {\n      value = this.getDefaultValue(min, max);\n    } else {\n      value = parsedValue;\n    }\n\n    if (this.nativeInput != null) {\n      // The value may have constraints, so we set the native control's\n      // value and sync it back to ensure it adheres to min, max, and step\n      // properly.\n      this.nativeInput.value = value.toString();\n      this.value = parseFloat(this.nativeInput.value);\n    } else {\n      this.value = value;\n    }\n    this.calculateColorRunnableTrack(min, max, this.value);\n    this.syncTooltip(min, max, this.value);\n  }\n\n  /**\n   * from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#value\n   */\n  private getDefaultValue(min: number, max: number): number {\n    return max < min ? min : min + (max - min) / 2;\n  }\n\n  /**\n   * For Firefox this functionality is not needed because it is supported by standard CSS.\n   */\n  private calculateColorRunnableTrack(min: number, max: number, value: number) {\n    if (!this.isFirefox() && this.nativeInput != null) {\n      const percent = Math.ceil(((value - min) / (max - min)) * 100);\n      this.nativeInput.style.background =\n        '-webkit-linear-gradient(left, var(--track-color) 0%, var(--track-color) ' +\n        percent +\n        '%, var(--six-color-web-rock-300) ' +\n        percent +\n        '%)';\n    }\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        helpTextId={this.helpTextId}\n        helpText={this.helpText}\n        hasHelpTextSlot={this.hasHelpTextSlot}\n        size=\"medium\"\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        errorTextCount={this.errorTextCount}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <div\n          part=\"base\"\n          class={{\n            range: true,\n\n            // States\n            'range--disabled': this.disabled,\n            'range--focused': this.hasFocus,\n            'range--tooltip-visible': this.hasTooltip,\n            'range--tooltip-top': this.tooltip === 'top',\n            'range--tooltip-bottom': this.tooltip === 'bottom',\n          }}\n          onTouchStart={this.handleTouchStart}\n        >\n          <input\n            part=\"input\"\n            ref={(el) => (this.nativeInput = el)}\n            type=\"range\"\n            class=\"range__control\"\n            name={this.name}\n            disabled={this.disabled}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            value={this.value}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          {this.tooltip !== 'none' && (\n            <output part=\"tooltip\" ref={(el) => (this.output = el)} class=\"range__tooltip\">\n              {this.tooltipFormatter(this.value)}\n            </output>\n          )}\n        </div>\n      </FormControl>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"six-range.entry.esm.js","sources":["src/components/six-range/six-range.scss?tag=six-range&encapsulation=shadow","src/components/six-range/six-range.tsx"],"sourcesContent":["@import '../../../src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  --thumb-size: 14px;\n  --tooltip-offset-y: 10px;\n  --track-color: var(--six-color-web-rock-900);\n  --thumb-color: var(--six-color-web-rock-900);\n  --track-height: 3px;\n\n  display: block;\n}\n\n.range {\n  position: relative;\n\n  .range__control {\n    -webkit-appearance: none;\n    width: 100%;\n    height: var(--six-input-height-medium);\n    background: transparent;\n    line-height: var(--six-input-height-medium);\n    vertical-align: middle;\n\n    &::-webkit-slider-runnable-track {\n      width: 100%;\n      height: var(--track-height);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-webkit-slider-thumb {\n      border: none;\n      width: var(--thumb-size);\n      height: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      -webkit-appearance: none;\n      margin-top: calc(var(--thumb-size) / -2 + var(--track-height) / 2);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-webkit-slider-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-webkit-slider-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  Firefox\n    &::-moz-focus-outer {\n      border: 0;\n    }\n\n    &::-moz-range-track {\n      width: 100%;\n      height: var(--track-height);\n      background-color: var(--six-progress-track-color);\n      border-radius: 3px;\n      border: none;\n    }\n\n    &::-moz-range-progress {\n      height: var(--track-height);\n      border-radius: 3px;\n      background-color: var(--track-color);\n      border: none;\n    }\n\n    &::-moz-range-thumb {\n      border: none;\n      height: var(--thumb-size);\n      width: var(--thumb-size);\n      border-radius: 50%;\n      background-color: var(--thumb-color);\n      transition:\n        var(--six-transition-fast) border-color,\n        var(--six-transition-fast) background-color,\n        var(--six-transition-fast) color,\n        var(--six-transition-fast) box-shadow,\n        var(--six-transition-fast) transform;\n      cursor: pointer;\n    }\n\n    &:not(:disabled)::-moz-range-thumb:hover {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled):focus::-moz-range-thumb {\n      background-color: var(--thumb-color);\n    }\n\n    &:not(:disabled)::-moz-range-thumb:active {\n      background-color: var(--thumb-color);\n      cursor: grabbing;\n    }\n\n    //  States\n    &:focus {\n      outline: none;\n    }\n\n    &:disabled {\n      &::-webkit-slider-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n\n      &::-moz-range-thumb {\n        cursor: not-allowed;\n        color: var(--six-color-web-rock-300);\n        border-color: var(--six-color-web-rock-300);\n        background-color: var(--six-color-web-rock-300);\n      }\n    }\n  }\n}\n\n// Tooltip\n.range__tooltip {\n  position: absolute;\n  z-index: var(--six-z-index-tooltip);\n  left: 2px;\n  border-radius: var(--six-border-radius-medium);\n  background-color: var(--six-color-web-rock-900);\n  font-family: var(--six-font-family);\n  font-size: var(--six-tooltip-font-size);\n  font-weight: var(--six-tooltip-font-weight);\n  line-height: var(--six-tooltip-line-height);\n  color: var(--six-color-white);\n  opacity: 0;\n  padding: var(--six-spacing-xxx-small) var(--six-spacing-xx-small);\n  transition: var(--six-transition-fast) opacity;\n  pointer-events: none;\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n    left: 50%;\n    margin-left: calc(-1 * var(--six-tooltip-arrow-size));\n  }\n}\n\n.range--tooltip-visible .range__tooltip {\n  opacity: 1;\n}\n\n// Tooltip on top\n.range--tooltip-top .range__tooltip {\n  top: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-top: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    top: 100%;\n  }\n}\n\n// Tooltip on bottom\n.range--tooltip-bottom .range__tooltip {\n  bottom: calc(-1 * var(--thumb-size) - var(--tooltip-offset-y));\n\n  &::after {\n    border-bottom: var(--six-tooltip-arrow-size) solid var(--six-color-web-rock-900);\n    border-left: var(--six-tooltip-arrow-size) solid transparent;\n    border-right: var(--six-tooltip-arrow-size) solid transparent;\n    bottom: 100%;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot label - The input's label. Alternatively, you can use the label prop.\n * @slot help-text - Help text that describes how to use the input. Alternatively, you can use the help-text prop.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part input - The native range input.\n * @part tooltip - The range tooltip.\n */\n@Component({\n  tag: 'six-range',\n  styleUrl: 'six-range.scss',\n  shadow: true,\n})\nexport class SixRange {\n  private inputId = `input-${++id}`;\n  private labelId = `input-label-${id}`;\n  private helpTextId = `input-help-text-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n  private eventListeners = new EventListeners();\n  private resizeObserver?: ResizeObserver;\n\n  private output?: HTMLElement;\n  private nativeInput?: HTMLInputElement;\n\n  @Element() host!: HTMLSixRangeElement;\n\n  @State() hasFocus = false;\n  @State() hasHelpTextSlot = false;\n  @State() hasErrorTextSlot = false;\n  @State() hasLabelSlot = false;\n  @State() hasTooltip = false;\n\n  /** The input's name attribute. */\n  @Prop() name = '';\n\n  /** The input's value attribute. */\n  @Prop({ mutable: true }) value = 0;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The range's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Set to true to disable the input. */\n  @Prop() disabled = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** The input's min attribute. */\n  @Prop() min = 0;\n\n  /** The input's max attribute. */\n  @Prop() max = 100;\n\n  /** The input's step attribute. */\n  @Prop() step = 1;\n\n  /** The preferred placedment of the tooltip. */\n  @Prop() tooltip: 'top' | 'bottom' | 'none' = 'top';\n\n  /** A function used to format the tooltip's value. */\n  @Prop() tooltipFormatter = (value: number) => value.toString();\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-range-change' }) sixChange!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-range-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-range-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  @Watch('label')\n  @Watch('errorText')\n  @Watch('helpText')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  @Watch('value')\n  @Watch('min')\n  @Watch('max')\n  handleValueChange() {\n    this.update();\n  }\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  componentWillLoad() {\n    this.update();\n    this.handleSlotChange();\n  }\n\n  componentDidLoad() {\n    const nativeInput = this.nativeInput;\n    if (nativeInput == null) {\n      return;\n    }\n    this.update();\n    this.resizeObserver = new ResizeObserver(() => this.update());\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  componentDidUpdate() {\n    const { min, max } = this.getMinMax();\n    this.syncTooltip(min, max, this.value);\n  }\n\n  private getMinMax() {\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    return { min, max };\n  }\n\n  /** Sets focus on the input. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.nativeInput?.focus(options);\n  }\n\n  /** Removes focus from the input. */\n  @Method()\n  async removeFocus() {\n    this.nativeInput?.blur();\n  }\n\n  private handleInput = () => {\n    if (this.nativeInput != null) {\n      this.update(parseFloat(this.nativeInput.value));\n    }\n    requestAnimationFrame(() => {\n      this.sixChange.emit();\n    });\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.hasTooltip = false;\n    this.sixBlur.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.unobserve(this.nativeInput);\n    }\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.hasTooltip = true;\n    this.sixFocus.emit();\n    if (this.nativeInput != null) {\n      this.resizeObserver?.observe(this.nativeInput);\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasHelpTextSlot = hasSlot(this.host, 'help-text');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  private handleTouchStart = () => {\n    this.setFocus();\n  };\n\n  private syncTooltip(min: number, max: number, value: number) {\n    if (this.tooltip !== 'none' && this.nativeInput != null && this.output != null) {\n      const percent = Math.max(0, (value - min) / (max - min));\n      const inputWidth = this.nativeInput.offsetWidth;\n      const tooltipWidth = this.output.offsetWidth;\n      const thumbSize = getComputedStyle(this.nativeInput).getPropertyValue('--thumb-size');\n      const x = `calc(${inputWidth * percent}px - calc(calc(${percent} * ${thumbSize}) - calc(${thumbSize} / 2)))`;\n      this.output.style.transform = `translateX(${x})`;\n      this.output.style.marginLeft = `-${tooltipWidth / 2}px`;\n    }\n  }\n\n  private isFirefox() {\n    return navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n  }\n\n  private update(updateValue?: number) {\n    if (updateValue != null) {\n      this.value = updateValue;\n    }\n\n    const min = Number(this.min) ?? 0;\n    const max = Number(this.max) ?? 0;\n    let value;\n    const parsedValue = parseFloat(this.value as never);\n    if (isNaN(parsedValue)) {\n      value = this.getDefaultValue(min, max);\n    } else {\n      value = parsedValue;\n    }\n\n    if (this.nativeInput != null) {\n      // The value may have constraints, so we set the native control's\n      // value and sync it back to ensure it adheres to min, max, and step\n      // properly.\n      this.nativeInput.value = value.toString();\n      this.value = parseFloat(this.nativeInput.value);\n    } else {\n      this.value = value;\n    }\n    this.calculateColorRunnableTrack(min, max, this.value);\n    this.syncTooltip(min, max, this.value);\n  }\n\n  /**\n   * from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#value\n   */\n  private getDefaultValue(min: number, max: number): number {\n    return max < min ? min : min + (max - min) / 2;\n  }\n\n  /**\n   * For Firefox this functionality is not needed because it is supported by standard CSS.\n   */\n  private calculateColorRunnableTrack(min: number, max: number, value: number) {\n    if (!this.isFirefox() && this.nativeInput != null) {\n      const percent = Math.ceil(((value - min) / (max - min)) * 100);\n      this.nativeInput.style.background =\n        '-webkit-linear-gradient(left, var(--track-color) 0%, var(--track-color) ' +\n        percent +\n        '%, var(--six-color-web-rock-300) ' +\n        percent +\n        '%)';\n    }\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.inputId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        helpTextId={this.helpTextId}\n        helpText={this.helpText}\n        hasHelpTextSlot={this.hasHelpTextSlot}\n        size=\"medium\"\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        errorTextCount={this.errorTextCount}\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <div\n          part=\"base\"\n          class={{\n            range: true,\n\n            // States\n            'range--disabled': this.disabled,\n            'range--focused': this.hasFocus,\n            'range--tooltip-visible': this.hasTooltip,\n            'range--tooltip-top': this.tooltip === 'top',\n            'range--tooltip-bottom': this.tooltip === 'bottom',\n          }}\n          onTouchStart={this.handleTouchStart}\n        >\n          <input\n            part=\"input\"\n            ref={(el) => (this.nativeInput = el)}\n            type=\"range\"\n            class=\"range__control\"\n            name={this.name}\n            disabled={this.disabled}\n            min={this.min}\n            max={this.max}\n            step={this.step}\n            value={this.value}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          {this.tooltip !== 'none' && (\n            <output part=\"tooltip\" ref={(el) => (this.output = el)} class=\"range__tooltip\">\n              {this.tooltipFormatter(this.value)}\n            </output>\n          )}\n        </div>\n      </FormControl>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/ui-library/six-rating.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"six-rating.entry.esm.js","sources":["src/components/six-rating/six-rating.scss?tag=six-rating&encapsulation=shadow","src/components/six-rating/six-rating.tsx"],"sourcesContent":["@import '../../../src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n:host {\n  --six-rating-color: var(--six-color-web-rock-500);\n  --six-rating-color-active: var(--six-color-warning-700);\n  --six-rating-color-disabled-opacity: 0.4;\n\n  display: block;\n}\n\n.six-rating {\n  display: inline-flex;\n  flex-direction: row;\n  user-select: none;\n  cursor: pointer;\n\n  &--readonly {\n    cursor: unset;\n  }\n\n  &--disabled {\n    cursor: not-allowed;\n    opacity: var(--six-rating-color-disabled-opacity);\n  }\n\n  &__star {\n    color: var(--six-rating-color);\n\n    &--filled {\n      color: var(--six-rating-color-active);\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { EmptyPayload } from '../../utils/types';\nimport { hasSlot } from '../../utils/slot';\n\n@Component({\n  tag: 'six-rating',\n  styleUrl: 'six-rating.scss',\n  shadow: true,\n})\nexport class SixRating {\n  @Element() el!: HTMLSixRatingElement;\n\n  /** The rating's name attribute. */\n  @Prop() name = '';\n\n  /** The rating's value attribute. */\n  @Prop({ mutable: true }) value: number = 0;\n\n  /** Set to true to disable the rating. */\n  @Prop() disabled = false;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** The label text. */\n  @Prop() label: string = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  /** Maximum number of stars. Default is 5 */\n  @Prop() max: number = 5;\n\n  /** Size of the stars */\n  @Prop({ reflect: true }) size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge' = 'medium';\n\n  /** If its readonly */\n  @Prop() readonly: boolean = false;\n\n  /** The rating's help text. Alternatively, you can use the help-text slot. */\n  @Prop() helpText = '';\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-rating-blur' }) sixBlur!: EventEmitter<number>;\n\n  /** Emitted when the control's checked state changes. */\n  @Event({ eventName: 'six-rating-change' }) sixChange!: EventEmitter<number>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-rating-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  // --\n\n  @State() hasFocus = false;\n  @State() hasLabelSlot = false;\n  @State() hasErrorSlot = false;\n  @State() hoveredValue = this.value;\n\n  private static id: number = 0;\n\n  private ratingId = `rating-${++SixRating.id}`;\n  private labelId = `rating-label-${SixRating.id}`;\n  private errorTextId = `input-error-text-${SixRating.id}`;\n\n  @Watch('value')\n  handleValueChange() {\n    this.sixChange.emit(this.value);\n  }\n\n  connectedCallback() {\n    this.el.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  disconnectedCallback() {\n    this.el.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n  }\n\n  private handleSlotChange = () => {\n    this.hasLabelSlot = hasSlot(this.el, 'label');\n    this.hasErrorSlot = hasSlot(this.el, 'error-text');\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit(this.value);\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      if (this.hoveredValue > 0) {\n        this.hoveredValue = this.hoveredValue - 1;\n        this.value = this.hoveredValue;\n      }\n    }\n\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      if (this.hoveredValue < this.max) {\n        this.hoveredValue = this.hoveredValue + 1;\n      }\n    }\n  };\n\n  private renderStars() {\n    return Array.from({ length: this.max }, (_, i) => {\n      const handleEvent = (event: Event) => {\n        if (this.readonly || this.disabled) {\n          return;\n        }\n        switch (event.type) {\n          case 'mouseover':\n            this.hoveredValue = i + 1;\n            break;\n          case 'mouseout':\n            this.hoveredValue = this.value;\n            break;\n          case 'click':\n            this.value = this.hoveredValue;\n            break;\n        }\n      };\n\n      return (\n        <six-icon\n          class={{\n            'six-rating__star': true,\n            'six-rating__star--filled': i < this.hoveredValue,\n          }}\n          filled\n          size={this.size}\n          onMouseOver={handleEvent}\n          onMouseOut={handleEvent}\n          onClick={handleEvent}\n        >\n          star_rate\n        </six-icon>\n      );\n    });\n  }\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.ratingId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={this.hasLabelSlot}\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        helpText={this.helpText}\n        hasErrorTextSlot={this.hasErrorSlot}\n        size=\"medium\"\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <div\n          part=\"base\"\n          class={{\n            'six-rating': true,\n            'six-rating--readonly': this.readonly,\n            'six-rating--disabled': this.disabled,\n          }}\n          role=\"slider\"\n          aria-label={this.label}\n          aria-disabled={this.disabled ? 'true' : 'false'}\n          aria-readonly={this.readonly ? 'true' : 'false'}\n          aria-valuenow={this.value}\n          aria-valuemin={0}\n          aria-valuemax={this.max}\n          tabindex={this.disabled ? '-1' : '0'}\n          onBlur={this.handleBlur}\n          onFocus={this.handleFocus}\n          onKeyDown={this.handleKeyDown}\n        >\n          {this.renderStars()}\n\n          <input\n            part=\"input\"\n            id={this.ratingId}\n            type=\"hidden\"\n            max={this.max}\n            min={0}\n            name={this.name}\n            value={this.value}\n            disabled={this.disabled}\n            required={this.required}\n            role=\"slider\"\n            aria-labelledby={this.labelId}\n          />\n        </div>\n      </FormControl>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/ui-library/six-switch.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"six-switch.entry.esm.js","sources":["src/components/six-switch/six-switch.scss?tag=six-switch&encapsulation=shadow","src/components/six-switch/six-switch.tsx"],"sourcesContent":["@import 'src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n/**\n * @prop --width: The width of the switch.\n * @prop --height: The height of the switch.\n * @prop --thumb-size: The size of the thumb.\n */\n:host {\n  --height: var(--six-selection-control-toggle-size);\n  --thumb-size: calc(var(--six-selection-control-toggle-size) - 4px);\n  --width: calc(var(--height) * 2);\n\n  display: inline-block;\n}\n\n.switch {\n  display: inline-flex;\n  align-items: center;\n  font-family: var(--six-font-family);\n  font-size: var(--six-input-font-size-medium);\n  font-weight: var(--six-input-font-weight);\n  color: var(--six-input-color);\n  vertical-align: middle;\n  cursor: pointer;\n}\n\n.switch__control {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--width);\n  height: var(--height);\n  background-color: var(--six-selection-control-color-disabled);\n  border-radius: var(--height);\n  transition:\n    var(--six-transition-fast) border-color,\n    var(--six-transition-fast) background-color;\n\n  .switch__thumb {\n    width: var(--thumb-size);\n    height: var(--thumb-size);\n    background-color: var(--six-input-background-color);\n    border-radius: 50%;\n    transform: translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));\n    transition:\n      var(--six-transition-fast) transform ease,\n      var(--six-transition-fast) background-color,\n      var(--six-transition-fast) border-color,\n      var(--six-transition-fast) box-shadow;\n  }\n\n  input[type='checkbox'] {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n}\n\n// Hover\n.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n  background-color: var(--six-input-border-color-hover);\n}\n\n// Checked\n.switch--checked .switch__control {\n  background-color: var(--six-selection-control-color);\n\n  .switch__thumb {\n    background-color: var(--six-color-white);\n    transform: translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2));\n  }\n}\n\n// Checked + hover\n.switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n  background-color: var(--six-input-border-color-focus);\n}\n\n// Disabled\n.switch--disabled {\n  cursor: not-allowed;\n  color: var(--six-selection-control-color-disabled);\n\n  .switch__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n\n  &.switch--checked .switch__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n}\n\n.switch__label {\n  line-height: var(--height);\n  margin-left: 0.5em;\n  user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The switch's label.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part control - The switch control.\n * @part thumb - The switch position indicator.\n * @part label - The switch label.\n */\n\n@Component({\n  tag: 'six-switch',\n  styleUrl: 'six-switch.scss',\n  shadow: true,\n})\nexport class SixSwitch {\n  private switchId = `switch-${++id}`;\n  private labelId = `switch-label-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n\n  private inputElement?: HTMLInputElement;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixSwitchElement;\n\n  @State() hasFocus = false;\n  @State() hasErrorTextSlot = false;\n\n  /** The switch's name attribute. */\n  @Prop() name = '';\n\n  /** The switch's value attribute. */\n  @Prop() value = 'on';\n\n  /** Set to true to disable the switch. */\n  @Prop() disabled = false;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** Set to true to draw the switch in a checked state. */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  @Watch('checked')\n  handleCheckedChange() {\n    if (this.inputElement != null) {\n      this.inputElement.checked = this.checked;\n      this.checked = this.inputElement.checked;\n    }\n  }\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-switch-blur' }) sixBlur!: EventEmitter<boolean>;\n\n  /** Emitted when the control's checked state changes. */\n  @Event({ eventName: 'six-switch-change' }) sixChange!: EventEmitter<boolean>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-switch-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-switch-change', 'change', this.host);\n    this.eventListeners.forward('six-switch-blur', 'blur', this.host);\n    this.eventListeners.forward('six-switch-focus', 'focus', this.host);\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  private handleSlotChange = () => {\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  /** Sets focus on the switch. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.inputElement?.focus(options);\n  }\n\n  /** Removes focus from the switch. */\n  @Method()\n  async removeFocus() {\n    this.inputElement?.blur();\n  }\n\n  private handleClick = () => {\n    if (this.inputElement != null) {\n      this.checked = this.inputElement.checked;\n      this.sixChange.emit(this.checked);\n    }\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit(this.checked);\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      this.checked = false;\n      this.sixChange.emit(this.checked);\n    }\n\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      this.checked = true;\n      this.sixChange.emit(this.checked);\n    }\n  };\n\n  private handleMouseDown = (event: MouseEvent) => {\n    // Prevent clicks on the label from briefly blurring the input\n    event.preventDefault();\n    this.inputElement?.focus();\n  };\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.switchId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={false}\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        size=\"medium\"\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <label\n          part=\"base\"\n          htmlFor={this.switchId}\n          class={{\n            switch: true,\n            'switch--checked': this.checked,\n            'switch--disabled': this.disabled,\n            'switch--focused': this.hasFocus,\n          }}\n          onMouseDown={this.handleMouseDown}\n        >\n          <span part=\"control\" class=\"switch__control\">\n            <span part=\"thumb\" class=\"switch__thumb\" />\n\n            <input\n              ref={(el) => (this.inputElement = el)}\n              id={this.switchId}\n              type=\"checkbox\"\n              name={this.name}\n              value={this.value}\n              checked={this.checked}\n              disabled={this.disabled}\n              required={this.required}\n              role=\"switch\"\n              aria-checked={this.checked ? 'true' : 'false'}\n              aria-labelledby={this.labelId}\n              onClick={this.handleClick}\n              onBlur={this.handleBlur}\n              onFocus={this.handleFocus}\n              onKeyDown={this.handleKeyDown}\n            />\n          </span>\n\n          <span part=\"label\" id={this.labelId} class=\"switch__label\">\n            <slot />\n          </span>\n        </label>\n      </FormControl>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"six-switch.entry.esm.js","sources":["src/components/six-switch/six-switch.scss?tag=six-switch&encapsulation=shadow","src/components/six-switch/six-switch.tsx"],"sourcesContent":["@import '../../../src/global/component';\n@import '../../functional-components/form-control/form-control';\n\n/**\n * @prop --width: The width of the switch.\n * @prop --height: The height of the switch.\n * @prop --thumb-size: The size of the thumb.\n */\n:host {\n  --height: var(--six-selection-control-toggle-size);\n  --thumb-size: calc(var(--six-selection-control-toggle-size) - 4px);\n  --width: calc(var(--height) * 2);\n\n  display: inline-block;\n}\n\n.switch {\n  display: inline-flex;\n  align-items: center;\n  font-family: var(--six-font-family);\n  font-size: var(--six-input-font-size-medium);\n  font-weight: var(--six-input-font-weight);\n  color: var(--six-input-color);\n  vertical-align: middle;\n  cursor: pointer;\n}\n\n.switch__control {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--width);\n  height: var(--height);\n  background-color: var(--six-selection-control-color-disabled);\n  border-radius: var(--height);\n  transition:\n    var(--six-transition-fast) border-color,\n    var(--six-transition-fast) background-color;\n\n  .switch__thumb {\n    width: var(--thumb-size);\n    height: var(--thumb-size);\n    background-color: var(--six-input-background-color);\n    border-radius: 50%;\n    transform: translateX(calc(var(--width) / -2 + var(--thumb-size) / 2 - (var(--thumb-size) - var(--height)) / 2));\n    transition:\n      var(--six-transition-fast) transform ease,\n      var(--six-transition-fast) background-color,\n      var(--six-transition-fast) border-color,\n      var(--six-transition-fast) box-shadow;\n  }\n\n  input[type='checkbox'] {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n}\n\n// Hover\n.switch:not(.switch--checked):not(.switch--disabled) .switch__control:hover {\n  background-color: var(--six-input-border-color-hover);\n}\n\n// Checked\n.switch--checked .switch__control {\n  background-color: var(--six-selection-control-color);\n\n  .switch__thumb {\n    background-color: var(--six-color-white);\n    transform: translateX(calc(var(--width) / 2 - var(--thumb-size) / 2 + (var(--thumb-size) - var(--height)) / 2));\n  }\n}\n\n// Checked + hover\n.switch.switch--checked:not(.switch--disabled) .switch__control:hover {\n  background-color: var(--six-input-border-color-focus);\n}\n\n// Disabled\n.switch--disabled {\n  cursor: not-allowed;\n  color: var(--six-selection-control-color-disabled);\n\n  .switch__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n\n  &.switch--checked .switch__control {\n    background-color: var(--six-selection-control-color-disabled);\n  }\n}\n\n.switch__label {\n  line-height: var(--height);\n  margin-left: 0.5em;\n  user-select: none;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { EventListeners } from '../../utils/event-listeners';\nimport FormControl from '../../functional-components/form-control/form-control';\nimport { hasSlot } from '../../utils/slot';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The switch's label.\n * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.\n *\n * @part base - The component's base wrapper.\n * @part control - The switch control.\n * @part thumb - The switch position indicator.\n * @part label - The switch label.\n */\n\n@Component({\n  tag: 'six-switch',\n  styleUrl: 'six-switch.scss',\n  shadow: true,\n})\nexport class SixSwitch {\n  private switchId = `switch-${++id}`;\n  private labelId = `switch-label-${id}`;\n  private errorTextId = `input-error-text-${id}`;\n\n  private inputElement?: HTMLInputElement;\n  private eventListeners = new EventListeners();\n\n  @Element() host!: HTMLSixSwitchElement;\n\n  @State() hasFocus = false;\n  @State() hasErrorTextSlot = false;\n\n  /** The switch's name attribute. */\n  @Prop() name = '';\n\n  /** The switch's value attribute. */\n  @Prop() value = 'on';\n\n  /** Set to true to disable the switch. */\n  @Prop() disabled = false;\n\n  /** Set to true to show an asterisk beneath the label. */\n  @Prop() required = false;\n\n  /** Set to true to draw the switch in a checked state. */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /** The label text. */\n  @Prop() label = '';\n\n  /** The error message shown, if `invalid` is set to true.  */\n  @Prop() errorText: string | string[] = '';\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  @Prop() errorTextCount?: number;\n\n  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */\n  @Prop({ reflect: true }) invalid = false;\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  @Watch('checked')\n  handleCheckedChange() {\n    if (this.inputElement != null) {\n      this.inputElement.checked = this.checked;\n      this.checked = this.inputElement.checked;\n    }\n  }\n\n  /** Emitted when the control loses focus. */\n  @Event({ eventName: 'six-switch-blur' }) sixBlur!: EventEmitter<boolean>;\n\n  /** Emitted when the control's checked state changes. */\n  @Event({ eventName: 'six-switch-change' }) sixChange!: EventEmitter<boolean>;\n\n  /** Emitted when the control gains focus. */\n  @Event({ eventName: 'six-switch-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.forward('six-switch-change', 'change', this.host);\n    this.eventListeners.forward('six-switch-blur', 'blur', this.host);\n    this.eventListeners.forward('six-switch-focus', 'focus', this.host);\n  }\n\n  disconnectedCallback() {\n    this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n    this.eventListeners.removeAll();\n  }\n\n  @Watch('errorText')\n  @Watch('label')\n  handleLabelChange() {\n    this.handleSlotChange();\n  }\n\n  private handleSlotChange = () => {\n    this.hasErrorTextSlot = hasSlot(this.host, 'error-text');\n  };\n\n  /** Sets focus on the switch. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.inputElement?.focus(options);\n  }\n\n  /** Removes focus from the switch. */\n  @Method()\n  async removeFocus() {\n    this.inputElement?.blur();\n  }\n\n  private handleClick = () => {\n    if (this.inputElement != null) {\n      this.checked = this.inputElement.checked;\n      this.sixChange.emit(this.checked);\n    }\n  };\n\n  private handleBlur = () => {\n    this.hasFocus = false;\n    this.sixBlur.emit(this.checked);\n  };\n\n  private handleFocus = () => {\n    this.hasFocus = true;\n    this.sixFocus.emit();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      this.checked = false;\n      this.sixChange.emit(this.checked);\n    }\n\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      this.checked = true;\n      this.sixChange.emit(this.checked);\n    }\n  };\n\n  private handleMouseDown = (event: MouseEvent) => {\n    // Prevent clicks on the label from briefly blurring the input\n    event.preventDefault();\n    this.inputElement?.focus();\n  };\n\n  render() {\n    return (\n      <FormControl\n        inputId={this.switchId}\n        label={this.label}\n        labelId={this.labelId}\n        hasLabelSlot={false}\n        errorTextId={this.errorTextId}\n        errorText={this.errorText}\n        errorTextCount={this.errorTextCount}\n        hasErrorTextSlot={this.hasErrorTextSlot}\n        size=\"medium\"\n        disabled={this.disabled}\n        required={this.required}\n        displayError={this.invalid}\n      >\n        <label\n          part=\"base\"\n          htmlFor={this.switchId}\n          class={{\n            switch: true,\n            'switch--checked': this.checked,\n            'switch--disabled': this.disabled,\n            'switch--focused': this.hasFocus,\n          }}\n          onMouseDown={this.handleMouseDown}\n        >\n          <span part=\"control\" class=\"switch__control\">\n            <span part=\"thumb\" class=\"switch__thumb\" />\n\n            <input\n              ref={(el) => (this.inputElement = el)}\n              id={this.switchId}\n              type=\"checkbox\"\n              name={this.name}\n              value={this.value}\n              checked={this.checked}\n              disabled={this.disabled}\n              required={this.required}\n              role=\"switch\"\n              aria-checked={this.checked ? 'true' : 'false'}\n              aria-labelledby={this.labelId}\n              onClick={this.handleClick}\n              onBlur={this.handleBlur}\n              onFocus={this.handleFocus}\n              onKeyDown={this.handleKeyDown}\n            />\n          </span>\n\n          <span part=\"label\" id={this.labelId} class=\"switch__label\">\n            <slot />\n          </span>\n        </label>\n      </FormControl>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}