@six-group/ui-library 0.0.0-insider.a358260 → 0.0.0-insider.cd0cd0d

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixMenuItemCss","SixMenuItem","connectedCallback","this","handleBlur","bind","handleFocus","handleMouseEnter","handleMouseLeave","async","options","menuItem","focus","blur","getTextLabel","Promise","resolve","getTextContent","defaultSlot","hasFocus","setFocus","removeFocus","render","h","ref","el","part","class","checked","disabled","role","tabIndex","onFocus","onBlur","onMouseEnter","onMouseLeave","name","size"],"sources":["./src/components/six-menu-item/six-menu-item.scss?tag=six-menu-item&encapsulation=shadow","./src/components/six-menu-item/six-menu-item.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: block;\n}\n\n.menu-item {\n  position: relative;\n  display: flex;\n  align-items: stretch;\n  font-family: var(--six-font-sans);\n  font-size: var(--six-font-size-small);\n  font-weight: var(--six-font-weight-normal);\n  line-height: var(--six-line-height-normal);\n  letter-spacing: var(--six-letter-spacing-normal);\n  text-align: left;\n  color: var(--six-input-color);\n  border-radius: var(--six-border-radius-medium);\n  padding: var(--six-spacing-medium) var(--six-spacing-medium);\n  transition: var(--six-transition-fast) fill;\n  user-select: none;\n  white-space: nowrap;\n  cursor: pointer;\n\n  &.menu-item--focused:not(.menu-item--disabled) {\n    outline: none;\n    background-color: var(--six-menu-item-background-color);\n  }\n\n  &.menu-item--disabled {\n    outline: none;\n    color: var(--six-input-color-disabled);\n    cursor: not-allowed;\n  }\n\n  .menu-item__label {\n    flex: 1 1 auto;\n    align-self: center;\n  }\n\n  .menu-item__prefix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n\n    ::slotted(:last-child) {\n      margin-right: 0.5em;\n    }\n  }\n\n  .menu-item__suffix {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n\n    ::slotted(:first-child) {\n      margin-left: 0.5em;\n    }\n  }\n\n  .menu-item__check {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    margin-left: var(--six-spacing-small);\n    visibility: hidden;\n    font-size: inherit;\n  }\n}\n\n.menu-item--checked .menu-item__check {\n  visibility: visible;\n}\n","import { Component, Method, Prop, State, h } from '@stencil/core';\nimport { getTextContent } from '../../utils/slot';\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 menu item's label.\n * @slot prefix - Used to prepend an icon or similar element to the menu item.\n * @slot suffix - Used to append an icon or similar element to the menu item.\n *\n * @part base - The component's base wrapper.\n * @part checked-icon - The container that wraps the checked icon.\n * @part prefix - The prefix container.\n * @part label - The menu item label.\n * @part suffix - The suffix container.\n */\n\n@Component({\n  tag: 'six-menu-item',\n  styleUrl: 'six-menu-item.scss',\n  shadow: true,\n})\nexport class SixMenuItem {\n  menuItem: HTMLElement;\n  defaultSlot: HTMLSlotElement;\n\n  @State() hasFocus = false;\n\n  /** Set to true to draw the item in a checked state. */\n  @Prop({ reflect: true }) checked = false;\n\n  /** A unique value to store in the menu item. This can be used as a way to identify menu items when selected. */\n  @Prop({ reflect: true }) value = '';\n\n  /** Set to true to draw the menu item in a disabled state. */\n  @Prop({ reflect: true }) disabled = false;\n\n  connectedCallback() {\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleMouseEnter = this.handleMouseEnter.bind(this);\n    this.handleMouseLeave = this.handleMouseLeave.bind(this);\n  }\n\n  /** Sets focus on the button. */\n  @Method()\n  async setFocus(options?: FocusOptions) {\n    this.menuItem.focus(options);\n  }\n\n  /** Removes focus from the button. */\n  @Method()\n  async removeFocus() {\n    this.menuItem.blur();\n  }\n\n  /** Returns a text label based on the contents of the menu item's default slot. */\n  @Method()\n  getTextLabel() {\n    return Promise.resolve(getTextContent(this.defaultSlot));\n  }\n\n  handleBlur() {\n    this.hasFocus = false;\n  }\n\n  handleFocus() {\n    this.hasFocus = true;\n  }\n\n  handleMouseEnter() {\n    this.setFocus();\n  }\n\n  handleMouseLeave() {\n    this.removeFocus();\n  }\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.menuItem = el)}\n        part=\"base\"\n        class={{\n          'menu-item': true,\n          'menu-item--checked': this.checked,\n          'menu-item--disabled': this.disabled,\n          'menu-item--focused': this.hasFocus,\n        }}\n        role=\"menuitem\"\n        aria-disabled={this.disabled ? 'true' : 'false'}\n        aria-checked={this.checked ? 'true' : 'false'}\n        tabIndex={!this.disabled ? 0 : null}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        onMouseEnter={this.handleMouseEnter}\n        onMouseLeave={this.handleMouseLeave}\n      >\n        <span part=\"prefix\" class=\"menu-item__prefix\">\n          <slot name=\"prefix\" />\n        </span>\n\n        <span part=\"label\" class=\"menu-item__label\">\n          <slot ref={(el) => (this.defaultSlot = el as HTMLSlotElement)} />\n        </span>\n\n        <span part=\"suffix\" class=\"menu-item__suffix\">\n          <slot name=\"suffix\" />\n        </span>\n\n        <span part=\"checked-icon\" class=\"menu-item__check\">\n          <six-icon size=\"small\" aria-hidden=\"true\">\n            check\n          </six-icon>\n        </span>\n      </div>\n    );\n  }\n}\n"],"mappings":"+EAAA,MAAMA,EAAiB,64C,MCyBVC,EAAW,M,uCAIF,M,aAGe,M,WAGF,G,cAGG,K,CAEpCC,oBACEC,KAAKC,WAAaD,KAAKC,WAAWC,KAAKF,MACvCA,KAAKG,YAAcH,KAAKG,YAAYD,KAAKF,MACzCA,KAAKI,iBAAmBJ,KAAKI,iBAAiBF,KAAKF,MACnDA,KAAKK,iBAAmBL,KAAKK,iBAAiBH,KAAKF,K,CAKrDM,eAAeC,GACbP,KAAKQ,SAASC,MAAMF,E,CAKtBD,oBACEN,KAAKQ,SAASE,M,CAKhBC,eACE,OAAOC,QAAQC,QAAQC,EAAed,KAAKe,a,CAG7Cd,aACED,KAAKgB,SAAW,K,CAGlBb,cACEH,KAAKgB,SAAW,I,CAGlBZ,mBACEJ,KAAKiB,U,CAGPZ,mBACEL,KAAKkB,a,CAGPC,SACE,OACEC,EAAA,OACEC,IAAMC,GAAQtB,KAAKQ,SAAWc,EAC9BC,KAAK,OACLC,MAAO,CACL,YAAa,KACb,qBAAsBxB,KAAKyB,QAC3B,sBAAuBzB,KAAK0B,SAC5B,qBAAsB1B,KAAKgB,UAE7BW,KAAK,WAAU,gBACA3B,KAAK0B,SAAW,OAAS,QAAO,eACjC1B,KAAKyB,QAAU,OAAS,QACtCG,UAAW5B,KAAK0B,SAAW,EAAI,KAC/BG,QAAS7B,KAAKG,YACd2B,OAAQ9B,KAAKC,WACb8B,aAAc/B,KAAKI,iBACnB4B,aAAchC,KAAKK,kBAEnBe,EAAA,QAAMG,KAAK,SAASC,MAAM,qBACxBJ,EAAA,QAAMa,KAAK,YAGbb,EAAA,QAAMG,KAAK,QAAQC,MAAM,oBACvBJ,EAAA,QAAMC,IAAMC,GAAQtB,KAAKe,YAAcO,KAGzCF,EAAA,QAAMG,KAAK,SAASC,MAAM,qBACxBJ,EAAA,QAAMa,KAAK,YAGbb,EAAA,QAAMG,KAAK,eAAeC,MAAM,oBAC9BJ,EAAA,YAAUc,KAAK,QAAO,cAAa,QAAM,U"}

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

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as s,g as e}from"./p-ac4f4d45.js";import{I as n}from"./p-25a3bf57.js";import{d as r,T as o,e as h,i as a,S as c}from"./p-d12c6092.js";import{D as p,b as l,a as u}from"./p-0786fa7c.js";import{E as m}from"./p-9a860acc.js";import{h as d}from"./p-b4dfb7cf.js";var f;(function(t){t["HHmmss"]="HH:mm:ss";t["hhmmssaa"]="hh:mm:ss:aa";t["HHmmssms"]="HH:mm:ss:ms";t["hhmmssmsaa"]="hh:mm:ss:ms:aa";t["HHmm"]="HH:mm";t["hhmmaa"]="hh:mm:aa";t["HH"]="HH";t["hhaa"]="hh:aa";t["mm"]="mm";t["ss"]="ss";t["ms"]="ms"})(f||(f={}));const x=()=>{const t=new Date;return{hours:t.getHours(),minutes:t.getMinutes(),seconds:t.getSeconds(),milliseconds:t.getMilliseconds(),has24Hours:true}};const g=12;const k=t=>t>g?t-g:t;const b=()=>{const t=new Date;const i=t.getHours();return{hours:k(i),minutes:t.getMinutes(),seconds:t.getSeconds(),milliseconds:t.getMilliseconds(),has24Hours:false,period:i>=g?r.PM:r.AM}};const v=(t=true)=>t?x():b();const _=":";const y=(t,i)=>{const s=t.split(_);const e=i.split(_);return s.length===e.length};const w=(t,i)=>{const s=t.split(_);const e=i.split(_);if(!y(t,i)){console.error(`Timestring did not match expected format.\nExpected format: ${i}\nReceived timestring: ${t}`)}const n={};s.forEach(((t,i)=>{const s=e[i];const a=h[s];if(a!==undefined){if(s===o.PERIOD){n.period=t.toUpperCase()===r.PM?r.PM:r.AM}else{n[a]=Number(t)}}if(s===o.HOUR_24){n.has24Hours=true}else if(s===o.HOUR_12){n.has24Hours=false}}));return n};const H=(t,i)=>i.split(_).map((i=>{const s=h[i];const e=i===o.MILLISECOND?3:2;return String(t[s]).padStart(e,"0")})).join(_);const C=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block;font-family:var(--six-font-family)}.timepicker_clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.timepicker_clear:hover{color:var(--six-input-icon-color-hover)}.timepicker_clear:focus{outline:none}.timepicker_clear--right{right:0;position:absolute}.timepicker_clear--left{right:35px;position:absolute}.timepicker__container{position:relative}.timepicker__popup{display:flex;justify-content:center;min-width:min-content;min-height:145px;background-color:white;padding:0.5em 0.5em 1.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.timepicker__popup--is-up{bottom:100%}.timepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.timepicker__separator{display:flex;align-items:center}.timepicker__item--wide{padding-left:0.5rem;padding-right:0.5rem}.input--empty .timepicker_clear{visibility:hidden}.input--hide{display:none}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}";const P=`[SIX-TIMEPICKER]`;const S="debounced-timepicker";const z=145;const j=class{constructor(s){t(this,s);this.sixChange=i(this,"six-timepicker-change",7);this.sixChangeDebounced=i(this,"six-timepicker-change-debounced",7);this.sixClear=i(this,"six-timepicker-clear",7);this.eventListeners=new m;this.defaultValue=null;this.handleInputChange=t=>{t.stopPropagation();const i=this.inputElement.value;if(!y(i,this.format)){this.sixChange.emit({value:{},valueAsString:""});return}this.internalValue=w(i,this.format);this.sixChange.emit({value:this.internalValue,valueAsString:H(this.internalValue,this.format)})};this.handleSixTimepickerChangeDebounced=({detail:t})=>{this.sixChangeDebounced.emit(t)};this.handleChange=(t,i)=>{t.stopPropagation();this.internalValue[i]=t.detail;const s=H(this.internalValue,this.format);this.sixChange.emit({changedProperty:i,value:this.internalValue,valueAsString:s});this.value=s};this.handleDocumentMouseDown=t=>{const i=t.composedPath();if(!i.includes(this.host)){this.closePopup();return}};this.handleClearClick=t=>{t.stopPropagation();this.value=undefined;this.sixClear.emit()};this.format=f.HHmmss;this.separator=_;this.value=undefined;this.open=false;this.inline=false;this.readonly=false;this.disabled=false;this.placement=undefined;this.size="medium";this.required=undefined;this.placeholder=undefined;this.errorOnBlur=false;this.errorText="";this.label="";this.name="";this.clearable=false;this.iconPosition="left";this.hoist=false;this.timeout=p;this.interval=l;this.defaultTime=undefined;this.debounce=p;this.isPopupContentUp=false;this.isDropDownContentUp=false;this.internalValue=undefined}async resizeHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}async scrollHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}debounceChanged(){this.eventListeners.removeByIdentifier(S);this.eventListeners.add(this.host,"six-timepicker-change",u(this.handleSixTimepickerChangeDebounced,this.debounce),S)}valueChanged(t){if(this.value!==t){this.value=t}this.setupInternalTime();this.sixChange.emit({value:this.internalValue,valueAsString:H(this.internalValue,this.format)})}async reportValidity(){return this.inputElement.reportValidity()}async checkValidity(){return this.inputElement.checkValidity()}async setCustomValidity(t){await this.inputElement.setCustomValidity(t)}async reset(){this.internalValue=this.defaultValue;this.inputElement.value=H(this.internalValue,this.format);await this.inputElement.reset()}componentWillLoad(){this.setupInternalTime();if(this.inline){this.open=true}if(this.open){this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}componentDidLoad(){this.eventListeners.add(this.host,"six-timepicker-change",u(this.handleSixTimepickerChangeDebounced,this.debounce),S);this.eventListeners.add(this.inputElement,"six-input-input",u(this.handleInputChange,this.debounce))}disconnectedCallback(){this.eventListeners.removeAll()}calcIsPopupContentUp(){if(!this.inputElement||!this.wrapper){return}const t=this.inputElement.getBoundingClientRect();const i=this.wrapper.getBoundingClientRect();const s=Math.max(i.height,z);const e=t.y>window.innerHeight/2;this.isPopupContentUp=e&&window.innerHeight<t.bottom+s}moveOpenHoistedPopup(){if(!this.hoist||!this.open){return}const t=this.popup.getBoundingClientRect();const i=t.height;const s=this.inputElement.getBoundingClientRect();const e=s.top;const n=s.height;this.calcIsPopupContentUp();if(this.isPopupContentUp){this.popup.style.top=`${e-i}px`}else{this.popup.style.top=`${e+n}px`}}getSixTimeUnitPicker(t){return s("six-item-picker",{class:t.class,timeout:this.timeout,interval:this.interval,padded:true,min:t.min,max:t.max,value:this.internalValue[t.propertyName],items:t.items,type:t.type||n.NUMBER,"padding-length":t.paddingLength,"onSix-item-picker-change":i=>this.handleChange(i,t.propertyName)})}setupInternalTime(){if(this.is12HourClock()&&!this.format.includes(o.PERIOD)){console.error(`${P} You provided a 12-hour-clock format but are missing the period (am or pm) in the time-format-string!`)}if(this.value===null||this.value===undefined){this.internalValue=a(this.defaultTime)?v(this.is24HourClock()):w(this.defaultTime,this.format)}else{this.internalValue=w(this.value,this.format)}this.defaultValue=this.internalValue}getHour24Picker(){if(!this.is24HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:23,propertyName:c.HOURS})}is24HourClock(){return this.format.includes(o.HOUR_24)}getHour12Picker(){if(!this.is12HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:11,propertyName:c.HOURS})}is12HourClock(){return this.format.includes(o.HOUR_12)}getAmPmPicker(){if(!this.is12HourClock()){return}const t=["AM","PM"];return this.getSixTimeUnitPicker({items:t,type:n.CUSTOM,propertyName:c.PERIOD})}getMinutePicker(){if(!this.format.includes(o.MINUTE)){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:c.MINUTES})}getSecondsPicker(){if(!this.format.includes(o.SECOND)){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:c.SECONDS})}getMillisecondsPicker(){if(!this.format.includes(o.MILLISECOND)){return}return this.getSixTimeUnitPicker({min:0,max:999,class:"timepicker__item--wide",paddingLength:3,propertyName:c.MILLISECONDS})}getSeparator(){return s("div",{class:"timepicker__separator"},s("span",null,this.separator))}getContent(){const t=[this.getHour24Picker(),this.getHour12Picker(),this.getMinutePicker(),this.getSecondsPicker(),this.getMillisecondsPicker()];const i=t.filter((t=>t!==undefined));return i.map(((t,s)=>{if(s===i.length-1){return[t]}return[t,this.getSeparator()]}))}openPopup(){if(!this.open&&!this.disabled){this.open=true;this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}closePopup(){if(this.inline){return}this.open=false;this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown)}renderClearable(){return this.clearable&&s("button",{slot:"suffix",class:{timepicker_clear:true,"timepicker_clear--right":this.iconPosition==="left","timepicker_clear--left":this.iconPosition==="right"},type:"button",onClick:this.handleClearClick,tabindex:"-1"},s("six-icon",{size:"small"},"clear"))}renderCustomIcon(){const t=d(this.host,"custom-icon")?s("slot",{name:"custom-icon"}):s("six-icon",{size:this.size==="large"?"medium":this.size},"watch_later");return s("span",{slot:"prefix",part:"icon",class:{prefix:true,"prefix--right":this.iconPosition==="right"}},t)}calcIsDropDownContentUp(){if(!this.inputElement||!this.wrapper){return}const t=this.inputElement.getBoundingClientRect();const i=this.wrapper.getBoundingClientRect();const s=Math.max(i.height,z);const e=t.y>window.innerHeight/2;this.isDropDownContentUp=e&&window.innerHeight<t.bottom+s}adjustPopupForHoisting(){if(!this.hoist){return}setTimeout((()=>{if(!this.popup){return}const t=this.popup.getBoundingClientRect();this.popup.style.position="fixed";["top","left","width","height"].forEach((i=>{this.popup.style[i]=`${t[i]}px`}));const i=this.inputElement.getBoundingClientRect();const s=i.top;const e=t.top;this.calcIsDropDownContentUp();if(this.isDropDownContentUp&&s<e){this.popup.style.top=`${e-t.height-i.height}px`}}),0)}render(){this.adjustPopupForHoisting();return s("div",{part:"container",ref:t=>this.wrapper=t,class:"timepicker__container"},s("six-input",{ref:t=>this.inputElement=t,part:"input",onClick:()=>this.openPopup(),value:this.value,placeholder:this.placeholder,readonly:this.readonly,disabled:this.disabled,size:this.size,name:this.name,label:this.label,required:this.required,"error-text":this.errorText,"error-on-blur":this.errorOnBlur,class:{"input--empty":!this.value,"input--hide":this.inline}},this.renderCustomIcon(),this.renderClearable(),d(this.host,"error-text")?s("span",{slot:"error-text"},s("slot",{name:"error-text"})):null,d(this.host,"label")?s("span",{slot:"label"},s("slot",{name:"label"})):null),this.open&&s("div",{ref:t=>this.popup=t,part:"popup",class:{timepicker__popup:true,"timepicker__popup--is-up":this.placement?this.placement==="top":this.isPopupContentUp,"timepicker__popup--is-inline":this.inline}},...this.getContent(),this.getAmPmPicker()))}get host(){return e(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};j.style=C;export{j as six_timepicker};
-//# sourceMappingURL=p-c53a63f9.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["SixTimeFormat","getCurrentTimeIn24Hours","now","Date","hours","getHours","minutes","getMinutes","seconds","getSeconds","milliseconds","getMilliseconds","has24Hours","HOURS_IN_12_HOUR_CLOCK_FORMAT","getHoursIn12HourFormat","getCurrentTimeIn12Hours","period","SixTimePeriod","PM","AM","getCurrentTime","TIME_FORMAT_SEPARATOR","isValidTimeString","timeStr","format","timeStringParts","split","timeFormatParts","length","parseTimeString","console","error","sixTime","forEach","timeStringPart","i","formatStringPart","sixTimePropertyName","TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP","undefined","TIME_FORMAT_CHAR","PERIOD","toUpperCase","Number","HOUR_24","HOUR_12","createTimeString","time","map","timeFormatPart","paddingLength","MILLISECOND","String","padStart","join","sixTimepickerCss","TAG","DEBOUNCE_TIMEPICKER_LISTENER","MIN_POPUP_HEIGHT","SixTimepicker","this","eventListeners","EventListeners","defaultValue","handleInputChange","event","stopPropagation","inputValue","inputElement","value","sixChange","emit","valueAsString","internalValue","handleSixTimepickerChangeDebounced","detail","sixChangeDebounced","handleChange","property","timeString","changedProperty","handleDocumentMouseDown","path","composedPath","includes","host","closePopup","handleClearClick","sixClear","HHmmss","DEFAULT_DEBOUNCE_FAST","DEFAULT_DEBOUNCE_INSANELY_FAST","async","calcIsPopupContentUp","moveOpenHoistedPopup","debounceChanged","removeByIdentifier","add","debounce","valueChanged","newValue","setupInternalTime","reportValidity","checkValidity","message","setCustomValidity","reset","componentWillLoad","inline","open","document","componentDidLoad","disconnectedCallback","removeAll","wrapper","inputBoundingRect","getBoundingClientRect","wrapperBoundingRect","minPopupHeight","Math","max","height","moreSpaceInTop","y","window","innerHeight","isPopupContentUp","bottom","hoist","popupBoundingClientRect","popup","popupHeight","inputBoundingClientRect","inputTop","top","inputHeight","style","getSixTimeUnitPicker","params","h","class","timeout","interval","padded","min","propertyName","items","type","ItemPickerType","NUMBER","is12HourClock","isNil","defaultTime","is24HourClock","getHour24Picker","SixTimePropertyName","HOURS","getHour12Picker","getAmPmPicker","CUSTOM","getMinutePicker","MINUTE","MINUTES","getSecondsPicker","SECOND","SECONDS","getMillisecondsPicker","MILLISECONDS","getSeparator","separator","getContent","elementsInOrder","visibleElements","filter","el","idx","openPopup","disabled","remove","renderClearable","clearable","slot","timepicker_clear","iconPosition","onClick","tabindex","size","renderCustomIcon","icon","hasSlot","name","part","prefix","calcIsDropDownContentUp","isDropDownContentUp","adjustPopupForHoisting","setTimeout","position","popupTop","render","ref","placeholder","readonly","label","required","errorText","errorOnBlur","timepicker__popup","placement"],"sources":["./src/components/six-timepicker/six-time-format.tsx","./src/utils/time.util.ts","./src/components/six-timepicker/six-timepicker.scss?tag=six-timepicker&encapsulation=shadow","./src/components/six-timepicker/six-timepicker.tsx"],"sourcesContent":["export enum SixTimeFormat {\n  HHmmss = 'HH:mm:ss', // 24 hour format\n  hhmmssaa = 'hh:mm:ss:aa',\n  HHmmssms = 'HH:mm:ss:ms',\n  hhmmssmsaa = 'hh:mm:ss:ms:aa',\n  HHmm = 'HH:mm',\n  hhmmaa = 'hh:mm:aa',\n  HH = 'HH',\n  hhaa = 'hh:aa',\n  mm = 'mm',\n  ss = 'ss',\n  ms = 'ms',\n}\n","/*\n * Returns the current time in the format of your choice\n */\nimport {\n  SixTime,\n  SixTimePeriod,\n  TIME_FORMAT_CHAR,\n  TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP,\n} from '../components/six-timepicker/six-timepicker.types';\nimport { SixTimeFormat } from '../components/six-timepicker/six-time-format';\n\nexport const getCurrentTimeIn24Hours = (): SixTime => {\n  const now = new Date();\n  return {\n    hours: now.getHours(),\n    minutes: now.getMinutes(),\n    seconds: now.getSeconds(),\n    milliseconds: now.getMilliseconds(),\n    has24Hours: true,\n  };\n};\n\nconst HOURS_IN_12_HOUR_CLOCK_FORMAT = 12;\n\nexport const getHoursIn12HourFormat = (hours: number) =>\n  hours > HOURS_IN_12_HOUR_CLOCK_FORMAT ? hours - HOURS_IN_12_HOUR_CLOCK_FORMAT : hours;\n\nexport const getCurrentTimeIn12Hours = (): SixTime => {\n  const now = new Date();\n  const hours = now.getHours();\n  return {\n    hours: getHoursIn12HourFormat(hours),\n    minutes: now.getMinutes(),\n    seconds: now.getSeconds(),\n    milliseconds: now.getMilliseconds(),\n    has24Hours: false,\n    period: hours >= HOURS_IN_12_HOUR_CLOCK_FORMAT ? SixTimePeriod.PM : SixTimePeriod.AM,\n  };\n};\n\nexport const getCurrentTime = (has24Hours: boolean = true): SixTime => {\n  return has24Hours ? getCurrentTimeIn24Hours() : getCurrentTimeIn12Hours();\n};\n\nexport const TIME_FORMAT_SEPARATOR = ':';\nexport const isValidTimeString = (timeStr: string, format: SixTimeFormat) => {\n  const timeStringParts = timeStr.split(TIME_FORMAT_SEPARATOR);\n  const timeFormatParts = format.split(TIME_FORMAT_SEPARATOR);\n  return timeStringParts.length === timeFormatParts.length;\n};\n\nexport const parseTimeString = (timeStr: string, format: SixTimeFormat): SixTime => {\n  const timeStringParts = timeStr.split(TIME_FORMAT_SEPARATOR);\n  const timeFormatParts = format.split(TIME_FORMAT_SEPARATOR);\n\n  if (!isValidTimeString(timeStr, format)) {\n    console.error(\n      `Timestring did not match expected format.\\nExpected format: ${format}\\nReceived timestring: ${timeStr}`\n    );\n  }\n\n  const sixTime: SixTime = {};\n\n  timeStringParts.forEach((timeStringPart, i) => {\n    const formatStringPart = timeFormatParts[i];\n    const sixTimePropertyName = TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP[formatStringPart];\n\n    if (sixTimePropertyName !== undefined) {\n      if (formatStringPart === TIME_FORMAT_CHAR.PERIOD) {\n        sixTime.period = timeStringPart.toUpperCase() === SixTimePeriod.PM ? SixTimePeriod.PM : SixTimePeriod.AM;\n      } else {\n        sixTime[sixTimePropertyName] = Number(timeStringPart);\n      }\n    }\n\n    if (formatStringPart === TIME_FORMAT_CHAR.HOUR_24) {\n      sixTime.has24Hours = true;\n    } else if (formatStringPart === TIME_FORMAT_CHAR.HOUR_12) {\n      sixTime.has24Hours = false;\n    }\n  });\n\n  return sixTime;\n};\n\nexport const createTimeString = (time: SixTime, format: SixTimeFormat) => {\n  return format\n    .split(TIME_FORMAT_SEPARATOR)\n    .map((timeFormatPart) => {\n      const sixTimePropertyName = TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP[timeFormatPart];\n      const paddingLength = timeFormatPart === TIME_FORMAT_CHAR.MILLISECOND ? 3 : 2;\n      return String(time[sixTimePropertyName]).padStart(paddingLength, '0');\n    })\n    .join(TIME_FORMAT_SEPARATOR);\n};\n","@import 'src/global/component';\n\n:host {\n  display: block;\n  font-family: var(--six-font-family);\n}\n\n.timepicker {\n  &_clear {\n    display: inline-flex;\n    align-items: center;\n    font-size: inherit;\n    color: var(--six-input-icon-color);\n    border: none;\n    background: none;\n    padding: 0;\n    transition: var(--six-transition-fast) color;\n    cursor: pointer;\n\n    &:hover {\n      color: var(--six-input-icon-color-hover);\n    }\n\n    &:focus {\n      outline: none;\n    }\n\n    &--right {\n      right: 0;\n      position: absolute;\n    }\n\n    &--left {\n      right: 35px;\n      position: absolute;\n    }\n  }\n\n  &__container {\n    position: relative;\n  }\n\n  &__popup {\n    display: flex;\n    justify-content: center;\n    min-width: min-content;\n    min-height: 145px;\n    background-color: white;\n    padding: 0.5em 0.5em 1.5em;\n    box-shadow: 0 2px 4px -1px rgb(0 0 0 / 20%), 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%);\n    user-select: none;\n    position: absolute;\n    z-index: var(--six-z-index-dropdown);\n    right: 0;\n    left: 0;\n\n    &--is-up {\n      bottom: 100%;\n    }\n\n    &--is-inline {\n      position: initial;\n      box-shadow: none;\n      border: 1px solid var(--six-color-web-rock-400);\n    }\n  }\n\n  &__separator {\n    display: flex;\n    align-items: center;\n  }\n\n  &__item {\n    &--wide {\n      padding-left: 0.5rem;\n      padding-right: 0.5rem;\n    }\n  }\n}\n\n.input--empty .timepicker_clear {\n  visibility: hidden;\n}\n\n.input--hide {\n  display: none;\n}\n\n// Icon position\n.prefix {\n  cursor: pointer;\n\n  &--right {\n    right: 0;\n    display: inline-flex;\n    position: absolute;\n    font-size: inherit;\n    color: var(--six-input-icon-color);\n    border: none;\n    background: none;\n    margin-right: var(--six-input-spacing-medium);\n    transition: var(--six-transition-fast) color;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Method, Prop, State, Watch } from '@stencil/core';\nimport { ItemPickerType } from '../six-item-picker/types';\nimport { SixTimeFormat } from './six-time-format';\nimport { SixTime, SixTimePropertyName, TIME_FORMAT_CHAR } from './six-timepicker.types';\nimport {\n  createTimeString,\n  getCurrentTime,\n  isValidTimeString,\n  parseTimeString,\n  TIME_FORMAT_SEPARATOR,\n} from '../../utils/time.util';\nimport { debounce, DEFAULT_DEBOUNCE_FAST, DEFAULT_DEBOUNCE_INSANELY_FAST } from '../../utils/execution-control';\nimport { SixItemPickerChangePayload } from '../six-item-picker/six-item-picker';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { isNil } from '../../utils/type-check';\n\ninterface SixTimepickerBasePayload {\n  value: SixTime;\n  valueAsString: string;\n}\n\nexport interface SixTimepickerChange extends SixTimepickerBasePayload {\n  changedProperty?: string;\n}\n\nexport interface SixTimepickerInput extends SixTimepickerBasePayload {}\n\nexport interface SixTimepickerBlur extends SixTimepickerBasePayload {}\n\ninterface SixTimeUnitPickerParams {\n  min?: number;\n  max?: number;\n  items?: string[];\n  type?: ItemPickerType;\n  class?: string;\n  paddingLength?: number;\n  propertyName: string;\n}\n\nconst TAG = `[SIX-TIMEPICKER]`;\nconst DEBOUNCE_TIMEPICKER_LISTENER = 'debounced-timepicker';\nconst MIN_POPUP_HEIGHT = 145;\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n * @part input - The input field\n * @part container - The container of whole component\n * @part popup - The popup of the timepicker component\n *\n */\n@Component({\n  tag: 'six-timepicker',\n  styleUrl: 'six-timepicker.scss',\n  shadow: true,\n})\nexport class SixTimepicker {\n  private readonly eventListeners = new EventListeners();\n\n  private popup: HTMLElement;\n\n  private wrapper: HTMLElement;\n\n  private inputElement: HTMLSixInputElement;\n\n  @Element() host: HTMLSixTimepickerElement;\n\n  /**\n   * Define the time format. Valid formats are:\n   *\n   * HH:mm:ss\n   * hh:mm:ss:aa\n   * HH:mm:ss:ms\n   * hh:mm:ss:ms:aa\n   * HH:mm\n   * hh:mm:aa\n   * HH\n   * hh:aa\n   * mm\n   * ss\n   * ms\n   *\n   * where HH is the 24 hour format\n   * and hh is the 12 hour format\n   *\n   * Please notice that when using the 12-hour-clock (hh)\n   * you always need a period indicator (aa). So the time can be parsed as either am or pm\n   * */\n  @Prop() format: SixTimeFormat = SixTimeFormat.HHmmss;\n\n  /**\n   * Define the separator to be shown between the time unit pickers.\n   * Please be aware that this property will modify the displayed separator only.\n   * The separator for a timestring is always expected to be a colon (eg. '13:52:20')\n   * */\n  @Prop() separator = TIME_FORMAT_SEPARATOR;\n\n  /**\n   * The value of the timepicker provided as a string. The string mast match the provided format (or default format)\n   */\n  @Prop({ mutable: true }) value?: string | null;\n\n  /** Indicates whether or not the timepicker dropdown is open on startup. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Indicates whether or not the timepicker should be shown as an inline (always open) component */\n  @Prop({ reflect: true }) inline = false;\n\n  /**\n   * If `true` the user can only select a time via the timepicker but not directly edit the input field.\n   */\n  @Prop() readonly = false;\n\n  /**\n   * If `true` the component is disabled.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * The enforced placement of the dropdown panel.\n   */\n  @Prop() placement: 'top' | 'bottom';\n\n  /** Timepicker size. */\n  @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n\n  /** Set to true to make the input a required field. */\n  @Prop({ reflect: true }) required: boolean;\n\n  /**\n   * The placeholder defines what text to be shown on the input element\n   */\n  @Prop() placeholder?: string | null;\n\n  /** Set to display the error text on blur and not when typing */\n  @Prop() errorOnBlur = false;\n\n  /** The input's error text. Alternatively, you can use the error-text slot. */\n  @Prop() errorText = '';\n\n  /** The input's label. Alternatively, you can use the label slot. */\n  @Prop() label = '';\n\n  /** The input's name attribute. */\n  @Prop({ reflect: true }) name = '';\n\n  /** Set to true to add a clear button when the input is populated. */\n  @Prop() clearable = false;\n\n  /** Set the position of the icon */\n  @Prop() iconPosition: 'left' | 'right' = 'left';\n\n  /**\n   * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n   * `overflow: auto|scroll`.\n   */\n  @Prop() hoist = false;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger faster switching between timeunits (e.g. hours).\n   */\n  @Prop() timeout = DEFAULT_DEBOUNCE_FAST;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait between switching to next timeunit (e.g. next hour) when mouse button is held pressed.\n   */\n  @Prop() interval = DEFAULT_DEBOUNCE_INSANELY_FAST;\n\n  /**\n   * The defaultTime defines the default setting for the timepicker when you open the popup. Default time must match the provided format.\n   */\n  @Prop() defaultTime?: string | null;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `six-timepicker-change-debounced` event.\n   * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce\n   * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click\n   * (and keep pressed) and once you release\n   */\n  @Prop() debounce = DEFAULT_DEBOUNCE_FAST;\n\n  /**\n   * Emitted when the timepicker's value changes\n   */\n  @Event({ eventName: 'six-timepicker-change' }) sixChange: EventEmitter<SixTimepickerChange>;\n\n  /**\n   * Emitted when the timepicker's value changes, but debounced\n   */\n  @Event({ eventName: 'six-timepicker-change-debounced' })\n  sixChangeDebounced: EventEmitter<SixTimepickerChange>;\n\n  /**\n   * Emitted when the clear button is activated.\n   */\n  @Event({ eventName: 'six-timepicker-clear' }) sixClear: EventEmitter<EmptyPayload>;\n\n  @State() isPopupContentUp = false;\n\n  @State() isDropDownContentUp = false;\n\n  @Listen('resize', { target: 'window' })\n  async resizeHandler() {\n    this.calcIsPopupContentUp();\n    this.moveOpenHoistedPopup();\n  }\n\n  @Listen('scroll', { target: 'window' })\n  async scrollHandler() {\n    this.calcIsPopupContentUp();\n    this.moveOpenHoistedPopup();\n  }\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    this.eventListeners.removeByIdentifier(DEBOUNCE_TIMEPICKER_LISTENER);\n    this.eventListeners.add(\n      this.host,\n      'six-timepicker-change',\n      debounce(this.handleSixTimepickerChangeDebounced, this.debounce),\n      DEBOUNCE_TIMEPICKER_LISTENER\n    );\n  }\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n  protected valueChanged(newValue: string) {\n    if (this.value !== newValue) {\n      this.value = newValue;\n    }\n    this.setupInternalTime();\n    this.sixChange.emit({\n      value: this.internalValue,\n      valueAsString: createTimeString(this.internalValue, this.format),\n    });\n  }\n\n  /** Checks for validity and shows the browser's validation message if the control is invalid. */\n  @Method()\n  async reportValidity() {\n    return this.inputElement.reportValidity();\n  }\n\n  /** Checks for validity. */\n  @Method()\n  async checkValidity() {\n    return this.inputElement.checkValidity();\n  }\n\n  /** Sets a custom validation message. If `message` is not empty, the field will be considered invalid. */\n  @Method()\n  async setCustomValidity(message: string) {\n    await this.inputElement.setCustomValidity(message);\n  }\n\n  /** Resets the formcontrol */\n  @Method()\n  async reset() {\n    this.internalValue = this.defaultValue;\n    this.inputElement.value = createTimeString(this.internalValue, this.format);\n    await this.inputElement.reset();\n  }\n\n  /*\n   * Internally the six-timepicker uses a standardized representation of time, so we don't have a mess,\n   * when switching between formats\n   */\n  @State()\n  private internalValue: SixTime;\n\n  private defaultValue: SixTime = null;\n\n  componentWillLoad() {\n    this.setupInternalTime();\n\n    if (this.inline) {\n      this.open = true;\n    }\n\n    if (this.open) {\n      this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n    }\n  }\n\n  componentDidLoad() {\n    this.eventListeners.add(\n      this.host,\n      'six-timepicker-change',\n      debounce(this.handleSixTimepickerChangeDebounced, this.debounce),\n      DEBOUNCE_TIMEPICKER_LISTENER\n    );\n    this.eventListeners.add(this.inputElement, 'six-input-input', debounce(this.handleInputChange, this.debounce));\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  private handleInputChange = (event: Event) => {\n    event.stopPropagation();\n    const inputValue = this.inputElement.value;\n\n    if (!isValidTimeString(inputValue, this.format)) {\n      this.sixChange.emit({\n        value: {},\n        valueAsString: '',\n      });\n      return;\n    }\n\n    this.internalValue = parseTimeString(inputValue, this.format);\n    this.sixChange.emit({\n      value: this.internalValue,\n      valueAsString: createTimeString(this.internalValue, this.format),\n    });\n  };\n\n  private calcIsPopupContentUp() {\n    if (!this.inputElement || !this.wrapper) {\n      return;\n    }\n\n    const inputBoundingRect = this.inputElement.getBoundingClientRect();\n    const wrapperBoundingRect = this.wrapper.getBoundingClientRect();\n    const minPopupHeight = Math.max(wrapperBoundingRect.height, MIN_POPUP_HEIGHT);\n\n    const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;\n    this.isPopupContentUp = moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + minPopupHeight;\n  }\n\n  /*\n   * The position of the hoisted timepicker needs to be correctly calculated since the position changes to fixed.\n   * Thus if the user scrolls or adjusts the screen size we need to recalculate the timepicker position.\n   */\n  private moveOpenHoistedPopup() {\n    if (!this.hoist || !this.open) {\n      return;\n    }\n\n    const popupBoundingClientRect = this.popup.getBoundingClientRect();\n    const popupHeight = popupBoundingClientRect.height;\n    const inputBoundingClientRect = this.inputElement.getBoundingClientRect();\n    const inputTop = inputBoundingClientRect.top;\n    const inputHeight = inputBoundingClientRect.height;\n\n    this.calcIsPopupContentUp();\n\n    if (this.isPopupContentUp) {\n      this.popup.style.top = `${inputTop - popupHeight}px`;\n    } else {\n      this.popup.style.top = `${inputTop + inputHeight}px`;\n    }\n  }\n\n  private handleSixTimepickerChangeDebounced = ({ detail }) => {\n    this.sixChangeDebounced.emit(detail);\n  };\n\n  private handleChange = (event: CustomEvent<SixItemPickerChangePayload>, property: string) => {\n    // stop propagation, since the timepicker should not expose the events of the underlying item-picker\n    event.stopPropagation();\n\n    // update the internal state\n    this.internalValue[property] = event.detail;\n\n    const timeString = createTimeString(this.internalValue, this.format);\n\n    // fire timepicker's own event\n    this.sixChange.emit({\n      changedProperty: property,\n      value: this.internalValue,\n      valueAsString: timeString,\n    });\n\n    // update the input value\n    this.value = timeString;\n  };\n\n  private getSixTimeUnitPicker(params: SixTimeUnitPickerParams) {\n    return (\n      <six-item-picker\n        class={params.class}\n        timeout={this.timeout}\n        interval={this.interval}\n        padded\n        min={params.min}\n        max={params.max}\n        value={this.internalValue[params.propertyName]}\n        items={params.items}\n        type={params.type || ItemPickerType.NUMBER}\n        padding-length={params.paddingLength}\n        onSix-item-picker-change={(event) => this.handleChange(event, params.propertyName)}\n      ></six-item-picker>\n    );\n  }\n\n  private setupInternalTime() {\n    if (this.is12HourClock() && !this.format.includes(TIME_FORMAT_CHAR.PERIOD)) {\n      console.error(\n        `${TAG} You provided a 12-hour-clock format but are missing the period (am or pm) in the time-format-string!`\n      );\n    }\n\n    if (this.value === null || this.value === undefined) {\n      this.internalValue = isNil(this.defaultTime)\n        ? getCurrentTime(this.is24HourClock())\n        : parseTimeString(this.defaultTime, this.format);\n    } else {\n      this.internalValue = parseTimeString(this.value, this.format);\n    }\n\n    this.defaultValue = this.internalValue;\n  }\n\n  private getHour24Picker() {\n    if (!this.is24HourClock()) {\n      return;\n    }\n\n    return this.getSixTimeUnitPicker({ min: 0, max: 23, propertyName: SixTimePropertyName.HOURS });\n  }\n\n  private is24HourClock() {\n    return this.format.includes(TIME_FORMAT_CHAR.HOUR_24);\n  }\n\n  private getHour12Picker() {\n    if (!this.is12HourClock()) {\n      return;\n    }\n\n    return this.getSixTimeUnitPicker({ min: 0, max: 11, propertyName: SixTimePropertyName.HOURS });\n  }\n\n  private is12HourClock() {\n    return this.format.includes(TIME_FORMAT_CHAR.HOUR_12);\n  }\n\n  private getAmPmPicker() {\n    if (!this.is12HourClock()) {\n      return;\n    }\n\n    const items = ['AM', 'PM'];\n    return this.getSixTimeUnitPicker({\n      items,\n      type: ItemPickerType.CUSTOM,\n      propertyName: SixTimePropertyName.PERIOD,\n    });\n  }\n\n  private getMinutePicker() {\n    if (!this.format.includes(TIME_FORMAT_CHAR.MINUTE)) {\n      return;\n    }\n\n    return this.getSixTimeUnitPicker({ min: 0, max: 59, propertyName: SixTimePropertyName.MINUTES });\n  }\n\n  private getSecondsPicker() {\n    if (!this.format.includes(TIME_FORMAT_CHAR.SECOND)) {\n      return;\n    }\n\n    return this.getSixTimeUnitPicker({ min: 0, max: 59, propertyName: SixTimePropertyName.SECONDS });\n  }\n\n  private getMillisecondsPicker() {\n    if (!this.format.includes(TIME_FORMAT_CHAR.MILLISECOND)) {\n      return;\n    }\n\n    return this.getSixTimeUnitPicker({\n      min: 0,\n      max: 999,\n      class: 'timepicker__item--wide',\n      paddingLength: 3,\n      propertyName: SixTimePropertyName.MILLISECONDS,\n    });\n  }\n\n  private getSeparator() {\n    return (\n      <div class=\"timepicker__separator\">\n        <span>{this.separator}</span>\n      </div>\n    );\n  }\n\n  private getContent() {\n    const elementsInOrder = [\n      this.getHour24Picker(),\n      this.getHour12Picker(),\n      this.getMinutePicker(),\n      this.getSecondsPicker(),\n      this.getMillisecondsPicker(),\n    ];\n\n    const visibleElements = elementsInOrder.filter((el) => el !== undefined);\n\n    return visibleElements.map((el, idx) => {\n      if (idx === visibleElements.length - 1) {\n        return [el];\n      }\n\n      return [el, this.getSeparator()];\n    });\n  }\n\n  private openPopup() {\n    if (!this.open && !this.disabled) {\n      this.open = true;\n      this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n    }\n  }\n\n  private closePopup() {\n    if (this.inline) {\n      return;\n    }\n\n    this.open = false;\n    this.eventListeners.remove(document, 'mousedown', this.handleDocumentMouseDown);\n  }\n\n  private handleDocumentMouseDown = (event: MouseEvent) => {\n    // Close when clicking outside of the containing element\n    const path = event.composedPath() as EventTarget[];\n    if (!path.includes(this.host)) {\n      this.closePopup();\n      return;\n    }\n  };\n\n  private handleClearClick = (event: MouseEvent) => {\n    event.stopPropagation();\n    this.value = undefined;\n    this.sixClear.emit();\n  };\n\n  private renderClearable() {\n    return (\n      this.clearable && (\n        <button\n          slot=\"suffix\"\n          class={{\n            timepicker_clear: true,\n            'timepicker_clear--right': this.iconPosition === 'left',\n            'timepicker_clear--left': this.iconPosition === 'right',\n          }}\n          type=\"button\"\n          onClick={this.handleClearClick}\n          tabindex=\"-1\"\n        >\n          <six-icon size=\"small\">clear</six-icon>\n        </button>\n      )\n    );\n  }\n\n  private renderCustomIcon() {\n    const icon = hasSlot(this.host, 'custom-icon') ? (\n      <slot name=\"custom-icon\"></slot>\n    ) : (\n      <six-icon size={this.size === 'large' ? 'medium' : this.size}>watch_later</six-icon>\n    );\n\n    return (\n      <span\n        slot=\"prefix\"\n        part=\"icon\"\n        class={{\n          prefix: true,\n          'prefix--right': this.iconPosition === 'right',\n        }}\n      >\n        {icon}\n      </span>\n    );\n  }\n\n  private calcIsDropDownContentUp() {\n    if (!this.inputElement || !this.wrapper) {\n      return;\n    }\n\n    const inputBoundingRect = this.inputElement.getBoundingClientRect();\n    const wrapperBoundingRect = this.wrapper.getBoundingClientRect();\n    const minPopupHeight = Math.max(wrapperBoundingRect.height, MIN_POPUP_HEIGHT);\n\n    const moreSpaceInTop = inputBoundingRect.y > window.innerHeight / 2;\n    this.isDropDownContentUp = moreSpaceInTop && window.innerHeight < inputBoundingRect.bottom + minPopupHeight;\n  }\n\n  /*\n   * If the popup is hoisted we popup is hoisted its position will change to fix to not be clipped of by a containing container.\n   * To render the popup correctly we render it normally, and then assign this screenposition to the fixed popup\n   */\n  private adjustPopupForHoisting() {\n    if (!this.hoist) {\n      return;\n    }\n\n    // execute after dropdown has been rendered to make sure the popup reference is correctly set\n    setTimeout(() => {\n      if (!this.popup) {\n        return;\n      }\n\n      // take a snapshot of normally rendered popup\n      const popupBoundingClientRect = this.popup.getBoundingClientRect();\n\n      // apply screen position to fixed popup\n      this.popup.style.position = 'fixed';\n      ['top', 'left', 'width', 'height'].forEach((property) => {\n        this.popup.style[property] = `${popupBoundingClientRect[property]}px`;\n      });\n\n      const inputBoundingClientRect = this.inputElement.getBoundingClientRect();\n      const inputTop = inputBoundingClientRect.top;\n      const popupTop = popupBoundingClientRect.top;\n\n      this.calcIsDropDownContentUp();\n      // check screen position to check whether the popup should be moved above or below the trigger element\n      if (this.isDropDownContentUp && inputTop < popupTop) {\n        //  move popup above input field if timepicker is at bottom of screen\n        this.popup.style.top = `${popupTop - popupBoundingClientRect.height - inputBoundingClientRect.height}px`;\n      }\n    }, 0);\n  }\n\n  render() {\n    this.adjustPopupForHoisting();\n\n    return (\n      <div part=\"container\" ref={(el) => (this.wrapper = el)} class=\"timepicker__container\">\n        <six-input\n          ref={(el) => (this.inputElement = el)}\n          part=\"input\"\n          onClick={() => this.openPopup()}\n          value={this.value}\n          placeholder={this.placeholder}\n          readonly={this.readonly}\n          disabled={this.disabled}\n          size={this.size}\n          name={this.name}\n          label={this.label}\n          required={this.required}\n          error-text={this.errorText}\n          error-on-blur={this.errorOnBlur}\n          class={{\n            'input--empty': !this.value,\n            'input--hide': this.inline,\n          }}\n        >\n          {this.renderCustomIcon()}\n          {this.renderClearable()}\n          {hasSlot(this.host, 'error-text') ? (\n            <span slot=\"error-text\">\n              <slot name=\"error-text\" />\n            </span>\n          ) : null}\n          {hasSlot(this.host, 'label') ? (\n            <span slot=\"label\">\n              <slot name=\"label\" />\n            </span>\n          ) : null}\n        </six-input>\n        {this.open && (\n          <div\n            ref={(el) => (this.popup = el)}\n            part=\"popup\"\n            class={{\n              timepicker__popup: true,\n              'timepicker__popup--is-up': this.placement ? this.placement === 'top' : this.isPopupContentUp,\n              'timepicker__popup--is-inline': this.inline,\n            }}\n          >\n            {...this.getContent()}\n            {this.getAmPmPicker()}\n          </div>\n        )}\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as s}from"./p-ac4f4d45.js";import{E as e}from"./p-9a860acc.js";const n=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block}";const a=class{constructor(s){t(this,s);this.sixSubmit=i(this,"six-form-submit",7);this.sixChange=i(this,"six-form-change",7);this.sixReset=i(this,"six-form-reset",7);this.eventListeners=new e;this.novalidate=false}connectedCallback(){this.formControls=[{tag:"six-button",serialize:(t,i)=>t.name&&!t.disabled?i.append(t.name,t.value):null,click:t=>{const i=t.target;if(i.submit){this.submit()}if(i.reset){this.reset()}}},{tag:"six-checkbox",serialize:(t,i)=>t.name&&t.checked&&!t.disabled?i.append(t.name,t.value):null,changeEventName:"six-checkbox-change"},{tag:"six-color-picker",serialize:(t,i)=>t.name&&!t.disabled?i.append(t.name,t.value):null},{tag:"six-input",serialize:(t,i)=>t.name&&!t.disabled?i.append(t.name,t.value):null,keyDown:t=>{if(t.key==="Enter"&&!t.defaultPrevented){this.submit()}},changeEventName:"six-input-change"},{tag:"six-datepicker",serialize:(t,i)=>{var s;return t.name&&!t.disabled?i.append(t.name,(s=t.value)===null||s===void 0?void 0:s.toISOString()):null},keyDown:t=>{if(t.key==="Enter"&&!t.defaultPrevented){this.submit()}},changeEventName:"six-datepicker-select"},{tag:"six-radio",serialize:(t,i)=>t.name&&t.checked&&!t.disabled?i.append(t.name,t.value):null,changeEventName:"six-radio-change"},{tag:"six-range",serialize:(t,i)=>{if(t.name&&!t.disabled){i.append(t.name,t.value+"")}},changeEventName:"six-range-change"},{tag:"six-select",serialize:(t,i)=>{if(t.name&&!t.disabled){if(t.multiple){const s=[...t.value];if(s.length){s.map((s=>i.append(t.name,s)))}else{i.append(t.name,"")}}else{i.append(t.name,t.value+"")}}},changeEventName:"six-select-change"},{tag:"six-switch",serialize:(t,i)=>t.name&&t.checked&&!t.disabled?i.append(t.name,t.value):null,changeEventName:"six-switch-change"},{tag:"six-textarea",serialize:(t,i)=>t.name&&!t.disabled?i.append(t.name,t.value):null,changeEventName:"six-textarea-change"},{tag:"six-timepicker",serialize:(t,i)=>t.name&&!t.disabled?i.append(t.name,t.value):null,keyDown:t=>{if(t.key==="Enter"&&!t.defaultPrevented){this.submit()}},changeEventName:"six-timepicker-change"}];this.handleClick=this.handleClick.bind(this);this.handleKeyDown=this.handleKeyDown.bind(this)}disconnectedCallback(){this.eventListeners.removeAll()}componentDidLoad(){this.getFormControls().then((t=>t.forEach((t=>this.appendChangeListener(t)))))}appendChangeListener(t){const i=t.tagName.toLowerCase();for(const s of this.formControls){if(s.tag===i&&s.changeEventName){this.eventListeners.add(t,s.changeEventName,(()=>this.handleChange(t)))}}}async getFormData(){const t=new FormData;const i=await this.getFormControls();i.map((i=>this.serializeElement(i,t)));return t}async getFormControls(){const t=this.form.querySelector("slot");const i=this.formControls.map((t=>t.tag));return t.assignedElements({flatten:true}).reduce(((t,i)=>t.concat(i,[...i.querySelectorAll("*")])),[]).filter((t=>i.includes(t.tagName.toLowerCase())))}async submit(){const t=await this.getFormData();const i=await this.getFormControls();const s=i.filter((t=>typeof t.reportValidity==="function"));if(!this.novalidate){let t=true;for(const i of s){if(!await i.reportValidity()){t=false}}if(!t){return false}}this.sixSubmit.emit({formData:t,formControls:i});return true}async checkValidity(){const t=await this.getFormControls();const i=t.filter((t=>typeof t.checkValidity==="function")).map((t=>t.checkValidity()));const s=await Promise.all(i).then((t=>t.filter((t=>t===false))));return s.length==0}async reset(){const t=await this.getFormControls();t.filter((t=>(t===null||t===void 0?void 0:t.reset)&&typeof(t===null||t===void 0?void 0:t.reset)==="function")).forEach((t=>t.reset()));this.sixReset.emit()}handleClick(t){const i=t.target;const s=i.tagName.toLowerCase();for(const i of this.formControls){if(i.tag===s&&i.click){i.click(t)}}}handleKeyDown(t){const i=t.target;const s=i.tagName.toLowerCase();for(const i of this.formControls){if(i.tag===s&&i.keyDown){i.keyDown(t)}}}handleChange(t){this.checkValidity().then((i=>this.sixChange.emit({valid:i,formControl:t})))}serializeElement(t,i){const s=t.tagName.toLowerCase();for(const e of this.formControls){if(e.tag===s){return e.serialize(t,i)}}return null}render(){return s("div",{ref:t=>this.form=t,part:"base",class:"form",role:"form",onClick:this.handleClick,onKeyDown:this.handleKeyDown},s("slot",null))}};a.style=n;export{a as six_form};
-//# sourceMappingURL=p-c640c2d8.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixFormCss","SixForm","this","eventListeners","EventListeners","connectedCallback","formControls","tag","serialize","el","formData","name","disabled","append","value","click","event","target","submit","reset","checked","changeEventName","keyDown","key","defaultPrevented","_a","toISOString","multiple","selectedOptions","length","map","handleClick","bind","handleKeyDown","disconnectedCallback","removeAll","componentDidLoad","getFormControls","then","controls","forEach","control","appendChangeListener","tagName","toLowerCase","formControl","add","handleChange","async","FormData","serializeElement","slot","form","querySelector","tags","assignedElements","flatten","reduce","all","concat","querySelectorAll","filter","includes","getFormData","formControlsThatReport","reportValidity","novalidate","isValid","sixSubmit","emit","validationTasks","checkValidity","invalidControls","Promise","results","valid","sixReset","sixChange","render","h","ref","part","class","role","onClick","onKeyDown"],"sources":["./src/components/six-form/six-form.scss?tag=six-form&encapsulation=shadow","./src/components/six-form/six-form.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: block;\n}\n","import { Component, Event, EventEmitter, h, Method, Prop } from '@stencil/core';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { EmptyPayload } from '../../utils/types';\n\nexport interface SixFormSubmitPayload {\n  formData: FormData;\n  formControls: HTMLFormElement[];\n}\n\nexport interface SixFormChangePayload {\n  formControl: HTMLFormElement;\n  valid: boolean;\n}\n\ninterface FormControl {\n  tag: string;\n\n  serialize(el: HTMLFormElement | HTMLElement, formData: FormData): void;\n\n  click?(event: MouseEvent): any;\n\n  keyDown?(event: KeyboardEvent): any;\n\n  changeEventName?: string;\n}\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 form's content.\n *\n * @part base - The component's base wrapper.\n */\n@Component({\n  tag: 'six-form',\n  styleUrl: 'six-form.scss',\n  shadow: true,\n})\nexport class SixForm {\n  form: HTMLElement;\n  formControls: FormControl[];\n\n  readonly eventListeners = new EventListeners();\n\n  /** Prevent the form from validating inputs before submitting. */\n  @Prop() novalidate = false;\n\n  /**\n   * Emitted when the form is submitted. This event will not be emitted if any form control inside of it is in an\n   * invalid state, unless the form has the `novalidate` attribute. Note that there is never a need to prevent this\n   * event, since it doen't send a GET or POST request like native forms. To \"prevent\" submission, use a conditional\n   * around the XHR request you use to submit the form's data with.\n   */\n  @Event({ eventName: 'six-form-submit' }) sixSubmit: EventEmitter<SixFormSubmitPayload>;\n\n  /** Emitted when the control's value changes. */\n  @Event({ eventName: 'six-form-change' }) sixChange: EventEmitter<SixFormChangePayload>;\n\n  /** Emitted when the forms values are reset. */\n  @Event({ eventName: 'six-form-reset' }) sixReset: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.formControls = [\n      {\n        tag: 'six-button',\n        serialize: (el: HTMLSixButtonElement, formData) =>\n          el.name && !el.disabled ? formData.append(el.name, el.value) : null,\n        click: (event) => {\n          const target = event.target as HTMLSixButtonElement;\n          if (target.submit) {\n            this.submit();\n          }\n\n          if (target.reset) {\n            this.reset();\n          }\n        },\n      },\n      {\n        tag: 'six-checkbox',\n        serialize: (el: HTMLSixCheckboxElement, formData) =>\n          el.name && el.checked && !el.disabled ? formData.append(el.name, el.value) : null,\n        changeEventName: 'six-checkbox-change',\n      },\n      {\n        tag: 'six-color-picker',\n        serialize: (el: HTMLSixCheckboxElement, formData) =>\n          el.name && !el.disabled ? formData.append(el.name, el.value) : null,\n      },\n      {\n        tag: 'six-input',\n        serialize: (el: HTMLSixInputElement, formData) =>\n          el.name && !el.disabled ? formData.append(el.name, el.value) : null,\n        keyDown: (event) => {\n          if (event.key === 'Enter' && !event.defaultPrevented) {\n            this.submit();\n          }\n        },\n        changeEventName: 'six-input-change',\n      },\n      {\n        tag: 'six-datepicker',\n        serialize: (el: HTMLSixDatepickerElement, formData) =>\n          el.name && !el.disabled ? formData.append(el.name, el.value?.toISOString()) : null,\n        keyDown: (event) => {\n          if (event.key === 'Enter' && !event.defaultPrevented) {\n            this.submit();\n          }\n        },\n        changeEventName: 'six-datepicker-select',\n      },\n      {\n        tag: 'six-radio',\n        serialize: (el: HTMLSixRadioElement, formData) =>\n          el.name && el.checked && !el.disabled ? formData.append(el.name, el.value) : null,\n        changeEventName: 'six-radio-change',\n      },\n      {\n        tag: 'six-range',\n        serialize: (el: HTMLSixRangeElement, formData) => {\n          if (el.name && !el.disabled) {\n            formData.append(el.name, el.value + '');\n          }\n        },\n        changeEventName: 'six-range-change',\n      },\n      {\n        tag: 'six-select',\n        serialize: (el: HTMLSixSelectElement, formData) => {\n          if (el.name && !el.disabled) {\n            if (el.multiple) {\n              const selectedOptions = [...el.value];\n              if (selectedOptions.length) {\n                selectedOptions.map((value) => formData.append(el.name, value));\n              } else {\n                formData.append(el.name, '');\n              }\n            } else {\n              formData.append(el.name, el.value + '');\n            }\n          }\n        },\n        changeEventName: 'six-select-change',\n      },\n      {\n        tag: 'six-switch',\n        serialize: (el: HTMLSixSwitchElement, formData) =>\n          el.name && el.checked && !el.disabled ? formData.append(el.name, el.value) : null,\n        changeEventName: 'six-switch-change',\n      },\n      {\n        tag: 'six-textarea',\n        serialize: (el: HTMLSixTextareaElement, formData) =>\n          el.name && !el.disabled ? formData.append(el.name, el.value) : null,\n        changeEventName: 'six-textarea-change',\n      },\n      {\n        tag: 'six-timepicker',\n        serialize: (el: HTMLSixTimepickerElement, formData) =>\n          el.name && !el.disabled ? formData.append(el.name, el.value) : null,\n        keyDown: (event) => {\n          if (event.key === 'Enter' && !event.defaultPrevented) {\n            this.submit();\n          }\n        },\n        changeEventName: 'six-timepicker-change',\n      },\n    ];\n\n    this.handleClick = this.handleClick.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  componentDidLoad() {\n    this.getFormControls().then((controls) => controls.forEach((control) => this.appendChangeListener(control)));\n  }\n\n  private appendChangeListener(el: HTMLFormElement) {\n    const tag = el.tagName.toLowerCase();\n    for (const formControl of this.formControls) {\n      if (formControl.tag === tag && formControl.changeEventName) {\n        this.eventListeners.add(el as HTMLElement, formControl.changeEventName, () => this.handleChange(el));\n      }\n    }\n  }\n\n  /** Serializes all form controls elements and returns a `FormData` object. */\n  @Method()\n  async getFormData() {\n    const formData = new FormData();\n    const formControls = await this.getFormControls();\n\n    formControls.map((el) => this.serializeElement(el, formData));\n\n    return formData;\n  }\n\n  /** Gets all form control elements (native and custom). */\n  @Method()\n  async getFormControls() {\n    const slot = this.form.querySelector('slot');\n    const tags = this.formControls.map((control) => control.tag);\n    return slot\n      .assignedElements({ flatten: true })\n      .reduce((all, el) => all.concat(el, [...el.querySelectorAll('*')]), [])\n      .filter((el) => tags.includes(el.tagName.toLowerCase())) as HTMLFormElement[];\n  }\n\n  /**\n   * Submits the form. If all controls are valid, the `six-form-submit` event will be emitted and the promise will resolve\n   * with `true`. If any form control is invalid, the promise will resolve with `false` and no event will be emitted.\n   */\n  @Method()\n  async submit() {\n    const formData = await this.getFormData();\n    const formControls = await this.getFormControls();\n    const formControlsThatReport = formControls.filter(\n      (el: HTMLFormElement) => typeof el.reportValidity === 'function'\n    ) as any;\n\n    if (!this.novalidate) {\n      let isValid = true;\n      for (const el of formControlsThatReport) {\n        if (!(await el.reportValidity())) {\n          isValid = false;\n        }\n      }\n      if (!isValid) {\n        return false;\n      }\n    }\n\n    this.sixSubmit.emit({ formData, formControls });\n\n    return true;\n  }\n\n  /** Checks for validity. */\n  @Method()\n  async checkValidity() {\n    const formControls = await this.getFormControls();\n    const validationTasks = formControls\n      .filter((el: HTMLFormElement) => typeof el.checkValidity === 'function')\n      .map((el: HTMLFormElement) => el.checkValidity());\n    const invalidControls = await Promise.all(validationTasks).then((results) =>\n      results.filter((valid) => valid === false)\n    );\n    return invalidControls.length == 0;\n  }\n\n  /** Resets the form and resets the value of all descendants*/\n  @Method()\n  async reset() {\n    const formControls = await this.getFormControls();\n\n    formControls\n      .filter((control) => control?.reset && typeof control?.reset === 'function')\n      .forEach((formControl) => formControl.reset());\n\n    this.sixReset.emit();\n  }\n\n  handleClick(event: MouseEvent) {\n    const target = event.target as HTMLFormElement;\n    const tag = target.tagName.toLowerCase();\n\n    for (const formControl of this.formControls) {\n      if (formControl.tag === tag && formControl.click) {\n        formControl.click(event);\n      }\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    const target = event.target as HTMLFormElement;\n    const tag = target.tagName.toLowerCase();\n\n    for (const formControl of this.formControls) {\n      if (formControl.tag === tag && formControl.keyDown) {\n        formControl.keyDown(event);\n      }\n    }\n  }\n\n  handleChange(el: HTMLFormElement) {\n    this.checkValidity().then((isValid) =>\n      this.sixChange.emit({\n        valid: isValid,\n        formControl: el,\n      })\n    );\n  }\n\n  serializeElement(el: HTMLFormElement, formData: FormData) {\n    const tag = el.tagName.toLowerCase();\n\n    for (const formControl of this.formControls) {\n      if (formControl.tag === tag) {\n        return formControl.serialize(el, formData);\n      }\n    }\n\n    return null;\n  }\n\n  render() {\n    return (\n      <div\n        ref={(el) => (this.form = el)}\n        part=\"base\"\n        class=\"form\"\n        role=\"form\"\n        onClick={this.handleClick}\n        onKeyDown={this.handleKeyDown}\n      >\n        <slot />\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as s,h as r}from"./p-ac4f4d45.js";const t=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--track-color:var(--six-progress-track-color);--indicator-color:var(--six-progress-indicator-color);display:inline-flex}.progress-ring{display:inline-flex;align-items:center;justify-content:center;position:relative}.progress-ring__image{transform:rotate(-90deg);transform-origin:50% 50%}.progress-ring__track{stroke:var(--track-color)}.progress-ring__indicator{stroke:var(--indicator-color);transition:0.35s stroke-dashoffset, 0.35s stroke}.progress-ring__label{display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;user-select:none;font-family:var(--six-font-family)}";const i=class{constructor(r){s(this,r);this.size=128;this.strokeWidth=4;this.percentage=undefined}handlePercentageChange(){this.updateProgress()}componentDidLoad(){this.updateProgress()}updateProgress(){if(!this.indicator.r){return}const s=this.indicator.r.baseVal.value;const r=s*2*Math.PI;const t=r-this.percentage/100*r;this.indicator.style.strokeDasharray=`${r} ${r}`;this.indicator.style.strokeDashoffset=`${t}`}render(){return r("div",{part:"base",class:"progress-ring"},r("svg",{class:"progress-ring__image",width:this.size,height:this.size},r("circle",{class:"progress-ring__track","stroke-width":this.strokeWidth,"stroke-linecap":"round",fill:"transparent",r:this.size/2-this.strokeWidth*2,cx:this.size/2,cy:this.size/2}),r("circle",{ref:s=>this.indicator=s,class:"progress-ring__indicator","stroke-width":this.strokeWidth,"stroke-linecap":"round",fill:"transparent",r:this.size/2-this.strokeWidth*2,cx:this.size/2,cy:this.size/2})),r("span",{part:"label",class:"progress-ring__label"},r("slot",null)))}static get watchers(){return{percentage:["handlePercentageChange"]}}};i.style=t;export{i as six_progress_ring};
-//# sourceMappingURL=p-c94d0b07.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixProgressRingCss","SixProgressRing","handlePercentageChange","this","updateProgress","componentDidLoad","indicator","r","radius","baseVal","value","circumference","Math","PI","offset","percentage","style","strokeDasharray","strokeDashoffset","render","h","part","class","width","size","height","strokeWidth","fill","cx","cy","ref","el"],"sources":["./src/components/six-progress-ring/six-progress-ring.scss?tag=six-progress-ring&encapsulation=shadow","./src/components/six-progress-ring/six-progress-ring.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --track-color: The track color.\n * @prop --indicator-color: The indicator color.\n */\n:host {\n  --track-color: var(--six-progress-track-color);\n  --indicator-color: var(--six-progress-indicator-color);\n\n  display: inline-flex;\n}\n\n.progress-ring {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n}\n\n.progress-ring__image {\n  transform: rotate(-90deg);\n  transform-origin: 50% 50%;\n}\n\n.progress-ring__track {\n  stroke: var(--track-color);\n}\n\n.progress-ring__indicator {\n  stroke: var(--indicator-color);\n  transition: 0.35s stroke-dashoffset, 0.35s stroke;\n}\n\n.progress-ring__label {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  text-align: center;\n  user-select: none;\n  font-family: var(--six-font-family);\n}\n","import { Component, h, Prop, Watch } from '@stencil/core';\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 - A label to show inside the ring.\n *\n * @part base - The component's base wrapper.\n * @part label - The progress ring label.\n */\n\n@Component({\n  tag: 'six-progress-ring',\n  styleUrl: 'six-progress-ring.scss',\n  shadow: true,\n})\nexport class SixProgressRing {\n  indicator: SVGCircleElement;\n\n  /** The size of the progress ring in pixels. */\n  @Prop() size = 128;\n\n  /** The stroke width of the progress ring in pixels. */\n  @Prop() strokeWidth = 4;\n\n  /** The current progress percentage, 0 - 100. */\n  @Prop() percentage: number;\n\n  @Watch('percentage')\n  handlePercentageChange() {\n    this.updateProgress();\n  }\n\n  componentDidLoad() {\n    this.updateProgress();\n  }\n\n  updateProgress() {\n    if (!this.indicator.r) {\n      return;\n    }\n    const radius = this.indicator.r.baseVal.value;\n    const circumference = radius * 2 * Math.PI;\n    const offset = circumference - (this.percentage / 100) * circumference;\n\n    this.indicator.style.strokeDasharray = `${circumference} ${circumference}`;\n    this.indicator.style.strokeDashoffset = `${offset}`;\n  }\n\n  render() {\n    return (\n      <div part=\"base\" class=\"progress-ring\">\n        <svg class=\"progress-ring__image\" width={this.size} height={this.size}>\n          <circle\n            class=\"progress-ring__track\"\n            stroke-width={this.strokeWidth}\n            stroke-linecap=\"round\"\n            fill=\"transparent\"\n            r={this.size / 2 - this.strokeWidth * 2}\n            cx={this.size / 2}\n            cy={this.size / 2}\n          />\n\n          <circle\n            ref={(el: SVGCircleElement) => (this.indicator = el)}\n            class=\"progress-ring__indicator\"\n            stroke-width={this.strokeWidth}\n            stroke-linecap=\"round\"\n            fill=\"transparent\"\n            r={this.size / 2 - this.strokeWidth * 2}\n            cx={this.size / 2}\n            cy={this.size / 2}\n          />\n        </svg>\n\n        <span part=\"label\" class=\"progress-ring__label\">\n          <slot />\n        </span>\n      </div>\n    );\n  }\n}\n"],"mappings":"2CAAA,MAAMA,EAAqB,gvB,MCmBdC,EAAe,M,mCAIX,I,iBAGO,E,0BAMtBC,yBACEC,KAAKC,gB,CAGPC,mBACEF,KAAKC,gB,CAGPA,iBACE,IAAKD,KAAKG,UAAUC,EAAG,CACrB,M,CAEF,MAAMC,EAASL,KAAKG,UAAUC,EAAEE,QAAQC,MACxC,MAAMC,EAAgBH,EAAS,EAAII,KAAKC,GACxC,MAAMC,EAASH,EAAiBR,KAAKY,WAAa,IAAOJ,EAEzDR,KAAKG,UAAUU,MAAMC,gBAAkB,GAAGN,KAAiBA,IAC3DR,KAAKG,UAAUU,MAAME,iBAAmB,GAAGJ,G,CAG7CK,SACE,OACEC,EAAA,OAAKC,KAAK,OAAOC,MAAM,iBACrBF,EAAA,OAAKE,MAAM,uBAAuBC,MAAOpB,KAAKqB,KAAMC,OAAQtB,KAAKqB,MAC/DJ,EAAA,UACEE,MAAM,uBAAsB,eACdnB,KAAKuB,YAAW,iBACf,QACfC,KAAK,cACLpB,EAAGJ,KAAKqB,KAAO,EAAIrB,KAAKuB,YAAc,EACtCE,GAAIzB,KAAKqB,KAAO,EAChBK,GAAI1B,KAAKqB,KAAO,IAGlBJ,EAAA,UACEU,IAAMC,GAA0B5B,KAAKG,UAAYyB,EACjDT,MAAM,2BAA0B,eAClBnB,KAAKuB,YAAW,iBACf,QACfC,KAAK,cACLpB,EAAGJ,KAAKqB,KAAO,EAAIrB,KAAKuB,YAAc,EACtCE,GAAIzB,KAAKqB,KAAO,EAChBK,GAAI1B,KAAKqB,KAAO,KAIpBJ,EAAA,QAAMC,KAAK,QAAQC,MAAM,wBACvBF,EAAA,c"}

package/dist/ui-library/p-d12c6092.js

@@ -1,2 +0,0 @@
-const s=s=>typeof s==="string";const n=s=>s==null;const o=s=>s instanceof Date;const a=s=>s==="number";var t;(function(s){s["AM"]="AM";s["PM"]="PM"})(t||(t={}));var c;(function(s){s["HOURS"]="hours";s["MINUTES"]="minutes";s["SECONDS"]="seconds";s["MILLISECONDS"]="milliseconds";s["HAS_24_HOURS"]="has24Hours";s["PERIOD"]="period"})(c||(c={}));var e;(function(s){s["HOUR_24"]="HH";s["HOUR_12"]="hh";s["MINUTE"]="mm";s["SECOND"]="ss";s["MILLISECOND"]="ms";s["PERIOD"]="aa"})(e||(e={}));const i={[e.HOUR_24]:"hours",[e.HOUR_12]:"hours",[e.MINUTE]:"minutes",[e.SECOND]:"seconds",[e.MILLISECOND]:"milliseconds",[e.PERIOD]:"period"};export{c as S,e as T,a,o as b,s as c,t as d,i as e,n as i};
-//# sourceMappingURL=p-d12c6092.js.map

package/dist/ui-library/p-d12c6092.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["isString","value","isNil","isDate","Date","isNumber","SixTimePeriod","SixTimePropertyName","TIME_FORMAT_CHAR","TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP","HOUR_24","HOUR_12","MINUTE","SECOND","MILLISECOND","PERIOD"],"sources":["./src/utils/type-check.ts","./src/components/six-timepicker/six-timepicker.types.tsx"],"sourcesContent":["export const isString = (value: any): value is string => typeof value === 'string';\n\n// only use '==' instead of '===' to also catch undefined and void\nexport const isNil = (value) => value == null;\n\nexport const isDate = (value): value is Date => value instanceof Date;\n\nexport const isNumber = (value): value is number => value === 'number';\n","/*\n * Defines the different time periods for the 12-hour-clock\n */\nexport enum SixTimePeriod {\n  AM = 'AM',\n  PM = 'PM',\n}\n\nexport enum SixTimePropertyName {\n  HOURS = 'hours',\n  MINUTES = 'minutes',\n  SECONDS = 'seconds',\n  MILLISECONDS = 'milliseconds',\n  HAS_24_HOURS = 'has24Hours',\n  PERIOD = 'period',\n}\n\n/*\n * Defines a format independent interface for time used internally in the six-timepicker\n */\nexport interface SixTime {\n  [SixTimePropertyName.HOURS]?: number;\n  [SixTimePropertyName.MINUTES]?: number;\n  [SixTimePropertyName.SECONDS]?: number;\n  [SixTimePropertyName.MILLISECONDS]?: number;\n  [SixTimePropertyName.HAS_24_HOURS]?: boolean; // true => 24h, false => 12h\n  [SixTimePropertyName.PERIOD]?: SixTimePeriod; // only needed for 12-hour clock\n}\n\n/*\n * Defines the different time units allowed to use in a timestring\n */\nexport enum TIME_FORMAT_CHAR {\n  HOUR_24 = 'HH',\n  HOUR_12 = 'hh',\n  MINUTE = 'mm',\n  SECOND = 'ss',\n  MILLISECOND = 'ms',\n  PERIOD = 'aa',\n}\n\n/*\n * Defines a mapping from the time format unit characters to the sixTime property name\n */\nexport const TIME_FORMAT_CHAR_TO_SIX_TIME_PROPERTY_MAP = {\n  [TIME_FORMAT_CHAR.HOUR_24]: 'hours',\n  [TIME_FORMAT_CHAR.HOUR_12]: 'hours',\n  [TIME_FORMAT_CHAR.MINUTE]: 'minutes',\n  [TIME_FORMAT_CHAR.SECOND]: 'seconds',\n  [TIME_FORMAT_CHAR.MILLISECOND]: 'milliseconds',\n  [TIME_FORMAT_CHAR.PERIOD]: 'period',\n};\n"],"mappings":"MAAaA,EAAYC,UAAuCA,IAAU,S,MAG7DC,EAASD,GAAUA,GAAS,K,MAE5BE,EAAUF,GAAyBA,aAAiBG,K,MAEpDC,EAAYJ,GAA2BA,IAAU,S,ICJlDK,GAAZ,SAAYA,GACVA,EAAA,WACAA,EAAA,UACD,EAHD,CAAYA,MAAa,K,IAKbC,GAAZ,SAAYA,GACVA,EAAA,iBACAA,EAAA,qBACAA,EAAA,qBACAA,EAAA,+BACAA,EAAA,6BACAA,EAAA,kBACD,EAPD,CAAYA,MAAmB,K,IAwBnBC,GAAZ,SAAYA,GACVA,EAAA,gBACAA,EAAA,gBACAA,EAAA,eACAA,EAAA,eACAA,EAAA,oBACAA,EAAA,cACD,EAPD,CAAYA,MAAgB,K,MAYfC,EAA4C,CACvD,CAACD,EAAiBE,SAAU,QAC5B,CAACF,EAAiBG,SAAU,QAC5B,CAACH,EAAiBI,QAAS,UAC3B,CAACJ,EAAiBK,QAAS,UAC3B,CAACL,EAAiBM,aAAc,eAChC,CAACN,EAAiBO,QAAS,iB"}

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixTooltipCss","id","SixTooltip","this","componentId","isVisible","handleOpenChange","open","show","hide","connectedCallback","handleBlur","bind","handleClick","handleFocus","handleKeyDown","handleMouseOver","handleMouseOut","handleSlotChange","componentDidLoad","target","getTarget","popover","Popover","tooltipPositioner","syncOptions","host","addEventListener","hidden","componentDidUpdate","disconnectedCallback","destroy","removeEventListener","async","disabled","sixShow","emit","defaultPrevented","sixHide","children","find","el","tagName","toLowerCase","getAttribute","Error","hasTrigger","event","key","stopPropagation","oldTarget","newTarget","removeAttribute","setAttribute","triggerType","triggers","trigger","split","includes","setOptions","placement","distance","skidding","transitionElement","tooltip","onAfterHide","sixAfterHide","onAfterShow","sixAfterShow","render","h","Host","onKeyDown","onMouseOver","onMouseOut","onSlotchange","ref","class","part","role","name","content"],"sources":["./src/components/six-tooltip/six-tooltip.scss?tag=six-tooltip&encapsulation=shadow","./src/components/six-tooltip/six-tooltip.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --hide-delay: The amount of time to wait before hiding the tooltip.\n * @prop --hide-duration: The amount of time the hide transition takes to complete.\n * @prop --hide-timing-function: The timing function (easing) to use for the hide transition.\n * @prop --max-width: The maximum width of the tooltip.\n * @prop --show-delay: The amount of time to wait before showing the tooltip.\n * @prop --show-duration: The amount of time the show transition takes to complete.\n * @prop --show-timing-function: The timing function (easing) to use for the show transition.\n */\n:host {\n  --max-width: 20rem;\n  --hide-delay: 0s;\n  --hide-duration: 0.125s;\n  --hide-timing-function: ease;\n  --show-delay: 0.125s;\n  --show-duration: 0.125s;\n  --show-timing-function: ease;\n\n  display: contents;\n}\n\n.tooltip-positioner {\n  position: absolute;\n  z-index: var(--six-z-index-tooltip);\n  pointer-events: none;\n}\n\n.tooltip {\n  max-width: var(--max-width);\n  border-radius: var(--six-border-radius-medium);\n  background-color: var(--six-tooltip-background-color);\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-tooltip-color);\n  opacity: 0;\n  padding: var(--six-spacing-xxx-small) var(--six-spacing-x-small);\n  transform: scale(0.8);\n  transform-origin: bottom;\n  transition-property: opacity, transform;\n  transition-delay: var(--hide-delay);\n  transition-duration: var(--hide-duration);\n  transition-timing-function: var(--hide-timing-function);\n\n  &::after {\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n  }\n}\n\n.tooltip-positioner {\n  &[data-popper-placement^='top'] .tooltip {\n    transform-origin: bottom;\n  }\n\n  &[data-popper-placement^='bottom'] .tooltip {\n    transform-origin: top;\n  }\n\n  &[data-popper-placement^='left'] .tooltip {\n    transform-origin: right;\n  }\n\n  &[data-popper-placement^='right'] .tooltip {\n    transform-origin: left;\n  }\n\n  &.popover-visible .tooltip {\n    opacity: 1;\n    transform: none;\n    transition-delay: var(--show-delay);\n    transition-duration: var(--show-duration);\n    transition-timing-function: var(--show-timing-function);\n  }\n}\n\n// Arrow + bottom\n.tooltip-positioner[data-popper-placement^='bottom'] .tooltip::after {\n  bottom: 100%;\n  left: calc(50% - var(--six-tooltip-arrow-size));\n  border-bottom: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n  border-left: var(--six-tooltip-arrow-size) solid transparent;\n  border-right: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='bottom-start'] .tooltip::after {\n  left: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='bottom-end'] .tooltip::after {\n  right: var(--six-tooltip-arrow-start-end-offset);\n  left: auto;\n}\n\n// Arrow + top\n.tooltip-positioner[data-popper-placement^='top'] .tooltip::after {\n  top: 100%;\n  left: calc(50% - var(--six-tooltip-arrow-size));\n  border-top: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n  border-left: var(--six-tooltip-arrow-size) solid transparent;\n  border-right: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='top-start'] .tooltip::after {\n  left: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='top-end'] .tooltip::after {\n  right: var(--six-tooltip-arrow-start-end-offset);\n  left: auto;\n}\n\n// Arrow + left\n.tooltip-positioner[data-popper-placement^='left'] .tooltip::after {\n  top: calc(50% - var(--six-tooltip-arrow-size));\n  left: 100%;\n  border-left: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n  border-top: var(--six-tooltip-arrow-size) solid transparent;\n  border-bottom: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='left-start'] .tooltip::after {\n  top: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='left-end'] .tooltip::after {\n  top: auto;\n  bottom: var(--six-tooltip-arrow-start-end-offset);\n}\n\n// Arrow + right\n.tooltip-positioner[data-popper-placement^='right'] .tooltip::after {\n  top: calc(50% - var(--six-tooltip-arrow-size));\n  right: 100%;\n  border-right: var(--six-tooltip-arrow-size) solid var(--six-tooltip-background-color);\n  border-top: var(--six-tooltip-arrow-size) solid transparent;\n  border-bottom: var(--six-tooltip-arrow-size) solid transparent;\n}\n\n.tooltip-positioner[data-popper-placement='right-start'] .tooltip::after {\n  top: var(--six-tooltip-arrow-start-end-offset);\n}\n\n.tooltip-positioner[data-popper-placement='right-end'] .tooltip::after {\n  top: auto;\n  bottom: var(--six-tooltip-arrow-start-end-offset);\n}\n","import { Component, Element, Event, EventEmitter, Host, Method, Prop, Watch, h } from '@stencil/core';\nimport Popover from '../../utils/popover';\nimport { EmptyPayload } from '../../utils/types';\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 tooltip's target element. Only the first element will be used as the target.\n * @slot content - The tooltip's content. Alternatively, you can use the content prop.\n *\n * @part base - The component's base wrapper.\n */\n\n@Component({\n  tag: 'six-tooltip',\n  styleUrl: 'six-tooltip.scss',\n  shadow: true,\n})\nexport class SixTooltip {\n  componentId = `tooltip-${++id}`;\n  isVisible = false;\n  popover: Popover;\n  tooltipPositioner: HTMLElement;\n  target: HTMLElement;\n  tooltip: any;\n\n  @Element() host: HTMLSixTooltipElement;\n\n  /** The tooltip's content. Alternatively, you can use the content slot. */\n  @Prop() content = '';\n\n  /**\n   * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip\n   * inside of the viewport.\n   */\n  @Prop() placement:\n    | 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end' = 'top';\n\n  /** Set to true to disable the tooltip so it won't show when triggered. */\n  @Prop() disabled = false;\n\n  /** The distance in pixels from which to offset the tooltip away from its target. */\n  @Prop() distance = 10;\n\n  /** Indicates whether or not the tooltip is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** The distance in pixels from which to offset the tooltip along its target. */\n  @Prop() skidding = 0;\n\n  /**\n   * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple\n   * options can be passed by separating them with a space. When manual is used, the tooltip must be activated\n   * programmatically.\n   */\n  @Prop() trigger = 'hover focus';\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  /** Emitted when the tooltip begins to show. Calling `event.preventDefault()` will prevent it from being shown. */\n  @Event({ eventName: 'six-tooltip-show' }) sixShow: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the tooltip has shown and all transitions are complete. */\n  @Event({ eventName: 'six-tooltip-after-show' }) sixAfterShow: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the tooltip begins to hide. Calling `event.preventDefault()` will prevent it from being hidden. */\n  @Event({ eventName: 'six-tooltip-hide' }) sixHide: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the tooltip has hidden and all transitions are complete. */\n  @Event({ eventName: 'six-tooltip-after-hide' }) sixAfterHide: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleClick = this.handleClick.bind(this);\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n    this.handleMouseOver = this.handleMouseOver.bind(this);\n    this.handleMouseOut = this.handleMouseOut.bind(this);\n    this.handleSlotChange = this.handleSlotChange.bind(this);\n  }\n\n  componentDidLoad() {\n    this.target = this.getTarget();\n    this.popover = new Popover(this.target, this.tooltipPositioner);\n    this.syncOptions();\n\n    this.host.addEventListener('blur', this.handleBlur, true);\n    this.host.addEventListener('click', this.handleClick, true);\n    this.host.addEventListener('focus', this.handleFocus, true);\n\n    // Show on init if open\n    this.tooltipPositioner.hidden = !this.open;\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  componentDidUpdate() {\n    this.syncOptions();\n  }\n\n  disconnectedCallback() {\n    if (this.popover) {\n      this.popover.destroy();\n    }\n\n    this.host.removeEventListener('blur', this.handleBlur, true);\n    this.host.removeEventListener('click', this.handleClick, true);\n    this.host.removeEventListener('focus', this.handleFocus, true);\n  }\n\n  /** Shows the tooltip. */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible || this.disabled) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.isVisible = true;\n    this.open = true;\n    this.popover.show();\n  }\n\n  /** Shows the tooltip. */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible || this.disabled) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    this.isVisible = false;\n    this.open = false;\n    this.popover.hide();\n  }\n\n  getTarget() {\n    // Get the first child that isn't a <style> or content slot\n    const target = [...this.host.children].find(\n      (el) => el.tagName.toLowerCase() !== 'style' && el.getAttribute('slot') !== 'content'\n    ) as HTMLElement;\n\n    if (!target) {\n      throw new Error('Invalid tooltip target: no child element was found.');\n    }\n\n    return target;\n  }\n\n  handleBlur() {\n    if (this.hasTrigger('focus')) {\n      this.hide();\n    }\n  }\n\n  handleClick() {\n    if (this.hasTrigger('click')) {\n      this.open ? this.hide() : this.show();\n    }\n  }\n\n  handleFocus() {\n    if (this.hasTrigger('focus')) {\n      this.show();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    // Pressing escape when the target element has focus should dismiss the tooltip\n    if (this.open && event.key === 'Escape') {\n      event.stopPropagation();\n      this.hide();\n    }\n  }\n\n  handleMouseOver() {\n    if (this.hasTrigger('hover')) {\n      this.show();\n    }\n  }\n\n  handleMouseOut() {\n    if (this.hasTrigger('hover')) {\n      this.hide();\n    }\n  }\n\n  handleSlotChange() {\n    const oldTarget = this.target;\n    const newTarget = this.getTarget();\n\n    if (newTarget !== oldTarget) {\n      if (oldTarget) {\n        oldTarget.removeAttribute('aria-describedby');\n      }\n      newTarget.setAttribute('aria-describedby', this.componentId);\n    }\n  }\n\n  hasTrigger(triggerType: string) {\n    const triggers = this.trigger.split(' ');\n    return triggers.includes(triggerType);\n  }\n\n  syncOptions() {\n    this.popover.setOptions({\n      placement: this.placement,\n      distance: this.distance,\n      skidding: this.skidding,\n      transitionElement: this.tooltip,\n      onAfterHide: () => this.sixAfterHide.emit(),\n      onAfterShow: () => this.sixAfterShow.emit(),\n    });\n  }\n\n  render() {\n    return (\n      <Host onKeyDown={this.handleKeyDown} onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut}>\n        <slot onSlotchange={this.handleSlotChange} />\n        <div ref={(el) => (this.tooltipPositioner = el)} class=\"tooltip-positioner\">\n          <div\n            part=\"base\"\n            ref={(el) => (this.tooltip = el)}\n            id={this.componentId}\n            class={{\n              tooltip: true,\n              'tooltip--open': this.open,\n            }}\n            role=\"tooltip\"\n            aria-hidden={this.open ? 'false' : 'true'}\n          >\n            <slot name=\"content\">{this.content}</slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as s,h as t,H as n,g as o}from"./p-ac4f4d45.js";const r=":host{display:grid;grid-template-columns:repeat(var(--no-of-columns), 1fr);grid-column-gap:1rem}";const e=class{constructor(t){s(this,t);this.columns=undefined}handleColumnsChange(){const s=this.columns?this.columns:12;this.host.style.setProperty("--no-of-columns",String(s))}componentWillLoad(){this.handleColumnsChange()}render(){return t(n,null,t("slot",null))}get host(){return o(this)}static get watchers(){return{columns:["handleColumnsChange"]}}};e.style=r;export{e as six_layout_grid};
-//# sourceMappingURL=p-df655bc9.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["sixLayoutGridCss","SixLayoutGrid","handleColumnsChange","columns","this","host","style","setProperty","String","componentWillLoad","render","h","Host"],"sources":["./src/components/six-layout-grid/six-layout-grid.scss?tag=six-layout-grid&encapsulation=shadow","./src/components/six-layout-grid/six-layout-grid.tsx"],"sourcesContent":[":host {\n  display: grid;\n  grid-template-columns: repeat(var(--no-of-columns), 1fr);\n  grid-column-gap: 1rem;\n}\n","import { Component, Element, Host, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @since 1.01\n * @status stable\n *\n * @slot - The grid's content\n */\n\n@Component({\n  tag: 'six-layout-grid',\n  styleUrl: 'six-layout-grid.scss',\n  shadow: true,\n})\nexport class SixLayoutGrid {\n  @Element() host: HTMLSixLayoutGridElement;\n\n  /** Set the number of grid columns */\n  @Prop() columns;\n\n  @Watch('columns')\n  handleColumnsChange() {\n    const columns = this.columns ? this.columns : 12;\n    this.host.style.setProperty('--no-of-columns', String(columns));\n  }\n\n  componentWillLoad() {\n    this.handleColumnsChange();\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAmB,mG,MCcZC,EAAa,M,gDAOxBC,sBACE,MAAMC,EAAUC,KAAKD,QAAUC,KAAKD,QAAU,GAC9CC,KAAKC,KAAKC,MAAMC,YAAY,kBAAmBC,OAAOL,G,CAGxDM,oBACEL,KAAKF,qB,CAGPQ,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,a"}

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

@@ -1,2 +0,0 @@
-import{h as t,r as e,c as i,g as s}from"./p-ac4f4d45.js";import{i as r,a as n,b as o,c as a,S as h}from"./p-d12c6092.js";import{E as l}from"./p-9a860acc.js";import{D as d,d as c,a as u}from"./p-0786fa7c.js";import{h as p}from"./p-b4dfb7cf.js";const m={en:{months:["January","February","March","April","May","June","July","August","September","October","November","December"],monthsShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],monthsShortGrouped:[["Jan","Feb","Mar","Apr"],["May","Jun","Jul","Aug"],["Sep","Oct","Nov","Dec"]],weekdays:["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"],weekdaysShort:["Mon","Tue","Wed","Thu","Fri","Sat","Sun"],weekdaysMin:["Mo","Tu","We","Th","Fr","Sa","Su"]},de:{months:["Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember"],monthsShort:["Jan.","Feb.","März","Apr.","Mai","Juni","Juli","Aug.","Sep.","Okt.","Nov.","Dez."],monthsShortGrouped:[["Jan.","Feb.","März","Apr."],["Mai","Juni","Juli","Aug."],["Sep.","Okt.","Nov.","Dez."]],weekdays:["Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag","Sonntag"],weekdaysShort:["Mo.","Di.","Mi.","Do.","Fr.","Sa.","So."],weekdaysMin:["Mo","Di","Mi","Do","Fr","Sa","So"]},fr:{months:["janvier","février","mars","avril","mai","juin","juillet","août","septembre","octobre","novembre","décembre"],monthsShort:["janv.","févr.","mars","avr.","mai","juin","juil.","août","sept.","oct.","nov.","déc."],monthsShortGrouped:[["janv.","févr.","mars","avr."],["mai","juin","juil.","août"],["sept.","oct.","nov.","déc."]],weekdays:["lundi","mardi","mercredi","jeudi","vendredi","samedi","dimanche"],weekdaysShort:["lun.","mar.","mer.","jeu.","ven.","sam.","dim."],weekdaysMin:["lu","ma","me","je","ve","sa","di"]},it:{months:["gennaio","febbraio","marzo","aprile","maggio","giugno","luglio","agosto","settembre","ottobre","novembre","dicembre"],monthsShort:["gen","feb","mar","apr","mag","giu","lug","ago","set","ott","nov","dic"],monthsShortGrouped:[["gen","feb","mar","apr"],["mag","giu","lug","ago"],["set","ott","nov","dic"]],weekdays:["lunedì","martedì","mercoledì","giovedì","venerdì","sabato","domenica"],weekdaysShort:["lun","mar","mer","gio","ven","sab","dom"],weekdaysMin:["lu","ma","me","gi","ve","sa","do"]}};const f=()=>new Date;const y=t=>{if(r(t)){return false}if(n(t)){return false}if(o(t)){return!isNaN(t.getTime())}return new Date(t).toString()!=="Invalid Date"};const b=t=>{if(t&&y(t)){return t.getFullYear()}throw new Error("Not a valid date")};const v=t=>{if(t&&y(t)){return t.getMonth()}throw new Error("Not a valid date")};const k=t=>{if(t&&y(t)){return t.getDate()}throw new Error("Not a valid date")};const g=t=>{if(t&&y(t)){return t.getHours()}throw new Error("Not a valid date")};const w=t=>{if(t&&y(t)){return t.getMinutes()}throw new Error("Not a valid date")};const x=t=>{if(t&&y(t)){return t.getSeconds()}throw new Error("Not a valid date")};const _=t=>{const e=[6,0,1,2,3,4,5];const i=new Date(t);i.setDate(i.getDate()-e[i.getDay()]);return i};const M=(t,e)=>(t===null||t===void 0?void 0:t.getFullYear())===(e===null||e===void 0?void 0:e.getFullYear());const D=(t,e)=>M(t,e)&&(t===null||t===void 0?void 0:t.getMonth())===(e===null||e===void 0?void 0:e.getMonth());const S=(t,e)=>D(t,e)&&(t===null||t===void 0?void 0:t.getDate())===(e===null||e===void 0?void 0:e.getDate());const j=(t,e)=>S(_(t),_(e));const C=(t,e)=>{if(!a(t)||!a(e)){return false}if(t.length<6||e.length<6){return false}const{day:i,month:s}=R(t,e);if(i>31||s>11||i<=0||s<0){return false}const n=K(t,e);if(r(n)){return false}return n.toString()!=="Invalid Date"};const O=(t,e,i)=>{if(!t){return true}if(e&&t<e){return false}if(i&&i<t){return false}return true};const F=(t,e,i,s=2)=>{const r=s-1;const n=e.charAt(t+r)===i;const o=t+r<e.length;return o&&n};const z=(t,e)=>{let i=String(t);while(i.length<e){i="0"+i}return i};const J=(t,e)=>{if(!t){return""}let i="";for(let s=0;s<e.length;s++){switch(e.charAt(s)){case"d":if(F(s,e,"d")){i+=z(t.getDate(),2);s++}else{i+=String(t.getDate())}break;case"m":if(F(s,e,"m")){i+=z(t.getMonth()+1,2);s++}else{i+=String(t.getMonth()+1)}break;case"y":if(F(s,e,"y",4)){s+=3;i+=t.getFullYear()}else{i+=(t.getFullYear()%100<10?"0":"")+t.getFullYear()%100;s++}break;case"h":if(F(s,e,"h")){i+=z(t.getHours(),2);s++}else{i+=String(t.getHours())}break;case"M":if(F(s,e,"M")){i+=z(t.getMinutes(),2);s++}else{i+=String(t.getMinutes())}break;case"s":if(F(s,e,"s")){i+=z(t.getSeconds(),2);s++}else{i+=String(t.getSeconds())}break;default:i+=e.charAt(s)}}return i};const N=/(\[[^\[]*\])|(mm|dd|yyyy|yy|hh|MM|ss|.)/g;const A=/\d\d/;const E=/\d{4}/;const P=/[^0-9]/g;const I="year";const T="month";const G="day";const B="hour";const L="minute";const $="second";const U={};const V=(t,e,i)=>{const s=Array.isArray(t)?t:[t];let r;if(typeof i==="string"){r=t=>{const e=parseInt(t,10);return{[i]:e}}}else{r=i}s.forEach((t=>{U[t]=[e,r]}))};V("yy",A,(t=>{const e=(new Date).getFullYear();const i=Math.floor(e/100);let s=parseInt(t,10);s=(s>68?i-1:i)*100+s;return{[I]:s}}));V("yyyy",E,I);V("mm",A,(t=>({[T]:parseInt(t,10)-1})));V("dd",A,G);V("hh",A,B);V("MM",A,L);V("ss",A,$);const Y=(t,e=new Date)=>{const i=[0,0,1,0,0,0];const s=[e.getFullYear(),e.getMonth(),e.getDate(),e.getHours(),e.getMinutes(),e.getSeconds()];let r=true;for(let e=0;e<7;e++){if(t[e]===undefined){i[e]=r?s[e]:i[e]}else{i[e]=t[e];r=false}}return i};const H=(t,e,i,s,r,n)=>{if(!(t<100&&t>=0)){return new Date(t,e,i,s,r,n)}const o=new Date(t+400,e,i,s,r,n);if(isFinite(o.getFullYear())){o.setFullYear(t)}return o};const W=(t,e)=>{const i=e.match(N);if(!i){throw new Error}const{length:s}=i;let r={};for(let e=0;e<s;e+=1){const s=i[e];const n=U[s];if(!n){const e=s.replace(/^\[|\]$/g,"");if(t.indexOf(e)===0){t=t.substr(e.length)}else{throw new Error("not match")}}else{const e=n[0];const i=n[1];const s=(e.exec(t)||[])[0];const o=i(s);r=Object.assign(Object.assign({},r),o);t=t.replace(s,"")}}return r};const q=(t,e)=>{if(t.length===e.length){return t}const i=t.match(P)[0];return t.split(i).map((t=>t.length===1?"0"+t:t)).join(i)};const R=(t,e)=>{const i=q(t,e);return W(i,e)};const K=(t,e)=>{try{const{backupDate:i=new Date}={};const{year:s,month:r,day:n,hour:o,minute:a,second:h,date:l}=R(t,e);if(l){return l}const d=[s,r,n,o,a,h];let c;const u=Y(d,i);c=H(...u);return c}catch(t){return new Date(NaN)}};const Q=t=>{const{firstDateOfBox:e,allowedDates:i,dateFormat:s,selectedDate:r,minDate:n,maxDate:o,pointerDate:a}=t;const h=new Date(e);const l=new Date(e);let d=[];do{let t=[];do{t=[...t,{date:new Date(l),display:J(l,s),dateString:J(l,s),label:k(l).toString(),isToday:S(l,f()),isSelected:r&&S(l,r),isDisabled:!i(l)||!O(l,n,o),isOutdated:a.month!==l.getMonth()||!O(l,n,o)}];l.setDate(l.getDate()+1)}while(j(l,h));d=[...d,t];h.setDate(h.getDate()+7)}while(D(new Date(a.year,a.month,a.day),l));return d};var X;(function(t){t["DDMMYYY_DOT"]="dd.mm.yyyy";t["YYYYMMDD_DASH"]="yyyy-mm-dd";t["DDMMYYYY_DASH"]="dd-mm-yyyy";t["DDMMYYYY_SLASH"]="dd/mm/yyyy";t["YYYYMMDD_SLASH"]="yyyy/mm/dd";t["DDMMYY_DOT"]="dd.mm.yy";t["YYMMDD_DASH"]="yy-mm-dd";t["DDMMYY_DASH"]="dd-mm-yy";t["DDMMYY_SLASH"]="dd/mm/yy";t["YYMMDD_SLASH"]="yy/mm/dd";t["DDMMYYY_DOT_TIME"]="dd.mm.yyyy hh:MM:ss";t["YYYYMMDD_DASH_TIME"]="yyyy-mm-dd hh:MM:ss";t["DDMMYYYY_DASH_TIME"]="dd-mm-yyyy hh:MM:ss";t["DDMMYYYY_SLASH_TIME"]="dd/mm/yyyy hh:MM:ss";t["YYYYMMDD_SLASH_TIME"]="yyyy/mm/dd hh:MM:ss";t["DDMMYY_DOT_TIME"]="dd.mm.yy hh:MM:ss";t["YYMMDD_DASH_TIME"]="yy-mm-dd hh:MM:ss";t["DDMMYY_DASH_TIME"]="dd-mm-yy hh:MM:ss";t["DDMMYY_SLASH_TIME"]="dd/mm/yy hh:MM:ss";t["YYMMDD_SLASH_TIME"]="yy/mm/dd hh:MM:ss"})(X||(X={}));const Z=({locale:e,selectedDate:i,onClickMonthCell:s})=>{const r=t=>e.monthsShort[f().getMonth()]===t;const n=t=>(i===null||i===void 0?void 0:i.getMonth())===e.monthsShort.findIndex((e=>e===t));return t("table",{class:"datepicker-table",part:"month-selection"},t("tbody",null,e.monthsShortGrouped.map((e=>t("tr",{class:"datepicker-table__row"},e.map((e=>t("td",{onClick:()=>s(e),class:{"datepicker-table__cell":true,"datepicker-table__cell--is-today":r(e),"datepicker-table__cell--is-selected":n(e)}},e))))))))};const tt=({locale:e,calendarGrid:i,onClickDateCell:s})=>t("table",{class:"datepicker-table",part:"day-selection"},t("thead",{part:"weekday-header"},e.weekdaysMin.map((e=>t("th",{class:"datepicker__cell"},e)))),t("tbody",null,i.map((e=>t("tr",{class:"datepicker-table__row"},e.map((e=>t("td",{"data-date":e.dateString,onClick:()=>s(e),class:{"datepicker-table__cell":true,"datepicker-table__cell--is-today":e.isToday,"datepicker-table__cell--is-selected":e.isSelected,"datepicker-table__cell--is-outdated":e.isOutdated,"datepicker-table__cell--is-disabled":e.isDisabled,"datepicker-table__cell--is-selectable":!e.isDisabled}},e.label))))))));const et=({selectedDate:e,yearSelection:i,onClickYearCell:s})=>t("table",{class:"datepicker-table",part:"year-selection"},t("tbody",null,i.map((i=>t("tr",{class:"datepicker-table__row"},i.map((i=>t("td",{onClick:()=>s(i),class:{"datepicker-table__cell":true,"datepicker-table__cell--is-today":f().getFullYear()===i,"datepicker-table__cell--is-selected":(e===null||e===void 0?void 0:e.getFullYear())===i}},i))))))));const it=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:block;font-family:var(--six-font-family)}.datepicker__container{position:relative}.datepicker__popup{min-width:400px;background-color:white;padding:0.5em 0.5em 1.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.datepicker__popup--is-up{bottom:100%;min-height:382px}.datepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.datepicker-header{display:flex;justify-content:space-between;border-bottom:1px solid var(--six-color-web-rock-400);padding:0.5em;margin-bottom:1em}.datepicker-header svg{fill:var(--six-color-web-rock-900);stroke:none}.datepicker-header__btn{cursor:pointer;width:2.5em;height:2.5em;display:flex;vertical-align:middle;align-items:center;justify-content:center}.datepicker-header__btn:hover{background-color:var(--six-color-web-rock-100);border-radius:100%}.datepicker-header__label{display:flex}.datepicker-header__label>div{cursor:pointer;padding:0.5em;display:flex;vertical-align:middle;align-items:center;justify-content:center}.datepicker-header__label>div:hover{background-color:var(--six-color-web-rock-100)}.datepicker-table{width:100%}.datepicker-table__cell{text-align:center;width:2.5rem;height:2.5rem;cursor:pointer}.datepicker-table__cell:hover{background-color:var(--six-color-web-rock-100)}.datepicker-table__cell--is-today{border:1px solid var(--six-color-web-rock-400)}.datepicker-table__cell--is-selected{background-color:var(--six-color-red);color:var(--six-color-white)}.datepicker-table__cell--is-disabled{background-color:var(--six-color-web-rock-200);cursor:initial}.datepicker-table__cell--is-disabled:hover{background-color:var(--six-color-web-rock-200)}.datepicker-table__cell--is-outdated{color:var(--six-color-web-rock-400)}.datepicker-clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.datepicker-clear:hover{color:var(--six-input-icon-color-hover)}.datepicker-clear:focus{outline:none}.datepicker-clear--right{right:0;position:absolute}.datepicker-clear--left{right:35px;position:absolute}.input--empty .datepicker-clear{visibility:hidden}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}six-timepicker::part(popup){border:none;padding:0.5em 0.5em 0;min-height:0}";const st=25;const rt=400;var nt;(function(t){t["DAY"]="day";t["MONTH"]="month";t["YEAR"]="year"})(nt||(nt={}));const ot=t=>{const e=5;return Array.from(new Array(st).keys()).map((e=>e+t-Math.floor(st/2))).reduce(((t,i,s)=>{if(s%e===0){t.push([])}t[t.length-1].push(i);return t}),[])};const at=class{constructor(t){e(this,t);this.sixSelect=i(this,"six-datepicker-select",7);this.sixClear=i(this,"six-datepicker-clear",7);this.sixBlur=i(this,"six-datepicker-blur",7);this.eventListeners=new l;this.selectedDate=null;this.defaultValue=null;this.handleDocumentKeyDown=t=>{if(this.open&&t.key==="Escape"){t.stopPropagation();this.closePopup();void this.inputElement.setFocus()}if(t.key==="Tab"){this.closePopup()}};this.handleDocumentMouseDown=t=>{const e=t.composedPath();if(!e.includes(this.container)){this.closePopup();return}};this.onTimepickerChange=t=>{const e=t.detail.value;const i=new Date;if(this.selectedDate){i.setFullYear(this.selectedDate.getFullYear(),this.selectedDate.getMonth(),this.selectedDate.getDate())}i.setHours(e[h.HOURS],e[h.MINUTES],e[h.SECONDS]);this.updateValue(i);this.updatePointerDates()};this.onClickDateCell=t=>{if(!t.isDisabled){void this.select(t.dateString)}};this.onClickMonthCell=t=>{const e=m[this.locale].monthsShort.findIndex((e=>e===t));this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{month:e});this.selectionMode=nt.DAY};this.onClickYearCell=t=>{this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{year:t});this.selectionMode=nt.DAY};this.handleInputChange=t=>{const e=this.inputElement.value;if(!C(e,this.dateFormat)){return}const i=K(e,this.dateFormat);if(i===undefined){return}if(this.min&&this.min.getTime()>i.getTime()){return}if(this.max&&this.max.getTime()<i.getTime()){return}this.updateIfChanged(i);t.stopPropagation();const s=e.replace(/[^\d]/g,"");let r=!e;if(e&&s.length>=6){const t=K(e,this.dateFormat);const i=J(t,this.dateFormat);if(C(i,this.dateFormat)){this.selectedDate=K(i,this.dateFormat);this.updatePointerDates();this.updateValue(this.selectedDate);r=true}}this.displayCustomMessage(r)};this.handleOnBlur=t=>{if(this.inputElement.value===""&&y(this.value)){this.value=undefined}t.stopPropagation();const e=this.inputElement.value;const i=K(e,this.dateFormat);const s=J(this.value,this.dateFormat);if(i&&e!==s){this.inputElement.value=s}this.sixBlur.emit(this.value)};this.pointerDate=at.getCurrentDateAsPointer();this.selectionMode=nt.DAY;this.isDropDownContentUp=false;this.type="date";this.locale="en";this.open=false;this.inline=false;this.readonly=false;this.disabled=false;this.allowedDates=()=>true;this.min=null;this.max=null;this.closeOnSelect=this.type==="date";this.placement=undefined;this.size="medium";this.required=undefined;this.defaultDate=undefined;this.placeholder=undefined;this.value=null;this.containingElement=undefined;this.dateFormat=X.DDMMYYY_DOT;this.debounce=d;this.errorOnBlur=false;this.errorText="";this.label="";this.name="";this.clearable=false;this.iconPosition="left";this.hoist=false}debounceChanged(){this.sixSelect=c(this.sixSelect,this.debounce)}valueChanged(){if(this.isValidValue()){console.warn("Encountered unreadable date, will map to undefined. Received value",this.value);this.value=undefined;return}this.selectedDate=this.value;this.updatePointerDates();this.sixSelect.emit(this.value)}async resizeHandler(){this.calcIsDropDownContentUp();this.moveOpenHoistedPopup();this.adjustPopupPosition()}async scrollHandler(){this.calcIsDropDownContentUp();this.moveOpenHoistedPopup()}get container(){return this.containingElement||this.host}get firstDateOfBox(){const t=new Date(this.pointerDate.year,this.pointerDate.month,1);return _(t)}async reportValidity(){return this.inputElement.reportValidity()}async checkValidity(){return this.inputElement.checkValidity()}async setCustomValidity(t){await this.inputElement.setCustomValidity(t)}async reset(){this.value=this.defaultValue;this.inputElement.value=J(this.defaultValue,this.dateFormat);await this.inputElement.reset()}isValidValue(){if(this.value===undefined||this.value===null){return false}if(!(this.value instanceof Date)){return true}return this.value instanceof Date&&isNaN(this.value)}get calendarGrid(){return Q({firstDateOfBox:this.firstDateOfBox,allowedDates:this.allowedDates,dateFormat:this.dateFormat,locale:this.locale,selectedDate:this.selectedDate,minDate:this.min,maxDate:this.max,pointerDate:this.pointerDate})}calcIsDropDownContentUp(){if(!this.inputElement||!this.wrapper){return}const t=this.inputElement.getBoundingClientRect();const e=this.wrapper.getBoundingClientRect();const i=Math.max(e.height,rt);const s=t.y>window.innerHeight/2;this.isDropDownContentUp=s&&window.innerHeight<t.bottom+i}getMonthStringForIndex(t){return m[this.locale].months[t]}previousUnit(){if(this.selectionMode===nt.DAY){this.previousMonth()}else if(this.selectionMode===nt.MONTH){this.previousYear()}else if(this.selectionMode===nt.YEAR){this.previousYearGroup()}}previousYear(){this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{year:this.pointerDate.year-1})}previousYearGroup(){this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{year:this.pointerDate.year-st})}previousMonth(){if(this.pointerDate.month===0){this.pointerDate={year:this.pointerDate.year-1,month:11,day:1,hours:0,minutes:0,seconds:0}}else{this.pointerDate={year:this.pointerDate.year,month:this.pointerDate.month-1,day:1,hours:0,minutes:0,seconds:0}}}nextUnit(){if(this.selectionMode===nt.DAY){this.nextMonth()}else if(this.selectionMode===nt.MONTH){this.nextYear()}else if(this.selectionMode===nt.YEAR){this.nextYearGroup()}}nextMonth(){if(this.pointerDate.month===11){this.pointerDate={year:this.pointerDate.year+1,month:0,day:1,hours:0,minutes:0,seconds:0}}else{this.pointerDate={year:this.pointerDate.year,month:this.pointerDate.month+1,day:1,hours:0,minutes:0,seconds:0}}}nextYear(){this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{year:this.pointerDate.year+1})}nextYearGroup(){this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{year:this.pointerDate.year+st})}openCalendar(){if(!this.open&&!this.disabled){this.open=true;this.setupEventListenersForOpenPopup()}}setupEventListenersForOpenPopup(){this.eventListeners.add(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}handleClearClick(t){t.stopPropagation();void this.select(undefined);this.sixClear.emit()}closePopup(){if(this.inline){return}this.open=false;this.eventListeners.remove(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown);this.selectionMode=nt.DAY}updatePointerDates(){const t=this.getPointerDate();if(this.differsFromPointerDate(t)){this.pointerDate={year:b(t),month:v(t),day:k(t),hours:g(t),minutes:w(t),seconds:x(t)}}}differsFromPointerDate(t){return this.pointerDate.day!==k(t)||this.pointerDate.month!==v(t)||this.pointerDate.year!==b(t)||this.pointerDate.hours!==g(t)||this.pointerDate.minutes!==w(t)||this.pointerDate.seconds!==x(t)}getPointerDate(){if(this.selectedDate!==undefined&&this.selectedDate!==null){return this.selectedDate}if(r(this.defaultDate)){return f()}else{return this.defaultDate&&K(this.defaultDate,this.dateFormat)}}updateValue(t){this.displayCustomMessage(true);this.updateIfChanged(t)}updateIfChanged(t){var e;if(((e=this.value)===null||e===void 0?void 0:e.getTime())===(t===null||t===void 0?void 0:t.getTime())){return}this.value=t}async select(t){if(!t){this.updateValue(undefined)}else{const e=K(t,this.dateFormat);e.setHours(this.pointerDate.hours,this.pointerDate.minutes,this.pointerDate.seconds);this.updateValue(e)}this.updatePointerDates();if(this.closeOnSelect){this.closePopup()}}componentWillLoad(){this.validateProps();this.defaultValue=this.value;this.selectedDate=this.value;this.updatePointerDates();this.updateValue(this.value);if(this.inline){this.open=true}if(this.open){this.setupEventListenersForOpenPopup()}}validateProps(){if(this.value!==null&&this.value!==undefined&&!(this.value instanceof Date)){throw new Error("Datepicker no longer supports strings as value. Use a date object instead!")}if(this.min!==null&&this.min!==undefined&&!(this.min instanceof Date)){throw new Error("Datepicker no longer supports strings as min. Use a date object instead!")}if(this.max!==null&&this.max!==undefined&&!(this.max instanceof Date)){throw new Error("Datepicker no longer supports strings as min. Use a date object instead!")}}componentDidLoad(){this.eventListeners.add(this.inputElement,"six-input-input",u(this.handleInputChange,this.debounce));this.eventListeners.add(this.inputElement,"six-input-blur",this.handleOnBlur)}renderHeader(){return t("header",{class:"datepicker-header",part:"header"},t("div",{class:"datepicker-header__btn prev",onClick:()=>this.previousUnit()},t("svg",{viewBox:"0 5 13 13",width:"14",height:"23"},t("path",{d:"M11.67 3.87L9.9 2.1 0 12l9.9 9.9 1.77-1.77L3.54 12z"}))),t("div",{class:"datepicker-header__label"},this.selectionMode===nt.DAY&&t("div",{onClick:()=>this.selectionMode=nt.MONTH},t("span",{class:"datepicker-header__label-month"},this.getMonthStringForIndex(this.pointerDate.month)),t("span",null,t("svg",{viewBox:"-3 -4 24 24",width:"20",height:"20"},t("polyline",{points:"6 9 12 15 18 9"})))),this.selectionMode!==nt.YEAR&&t("div",{onClick:()=>this.selectionMode=nt.YEAR},t("span",{class:"datepicker-header__label-year"},this.pointerDate.year),t("span",null,t("svg",{viewBox:"-3 -4 24 24",width:"20",height:"20"},t("polyline",{points:"6 9 12 15 18 9"})))),this.selectionMode===nt.YEAR&&t("div",null,this.pointerDate.year-Math.floor(st/2)," –"," ",this.pointerDate.year+Math.floor(st/2))),t("div",{class:"datepicker-header__btn next",onClick:()=>this.nextUnit()},t("svg",{viewBox:"5 5 13 13",width:"14",height:"23"},t("path",{d:"M5.88 4.12L13.76 12l-7.88 7.88L8 22l10-10L8 2z"}))))}renderBody(){switch(this.selectionMode){case nt.DAY:return t(tt,{locale:m[this.locale],calendarGrid:this.calendarGrid,onClickDateCell:this.onClickDateCell});case nt.MONTH:return t(Z,{locale:m[this.locale],selectedDate:this.selectedDate,onClickMonthCell:this.onClickMonthCell});case nt.YEAR:return t(et,{selectedDate:this.selectedDate,yearSelection:ot(this.pointerDate.year),onClickYearCell:this.onClickYearCell})}}renderCustomIcon(){const e=p(this.host,"custom-icon")?t("slot",{name:"custom-icon"}):t("six-icon",{size:this.size==="large"?"medium":this.size},"today");return t("span",{slot:"prefix",part:"icon",class:{prefix:true,"prefix--right":this.iconPosition==="right"}},e)}renderClearable(){return this.clearable&&t("button",{slot:"suffix",class:{"datepicker-clear":true,"datepicker-clear--right":this.iconPosition==="left","datepicker-clear--left":this.iconPosition==="right"},type:"button",onClick:this.handleClearClick,tabindex:"-1"},t("six-icon",{size:"small"},"clear"))}render(){var e,i,s;this.adjustPopupPosition();return t("div",{ref:t=>this.wrapper=t,class:"datepicker__container"},t("six-input",{part:"base",value:J(this.value,this.dateFormat),ref:t=>this.inputElement=t,placeholder:this.placeholder,readonly:this.readonly,disabled:this.disabled,name:this.name,label:this.label,required:this.required,"error-text":this.errorText,"error-on-blur":this.errorOnBlur,onClick:()=>this.openCalendar(),size:this.size,class:{"input--empty":!this.value}},this.renderCustomIcon(),this.renderClearable(),p(this.host,"error-text")?t("span",{slot:"error-text"},t("slot",{name:"error-text"})):null,p(this.host,"label")?t("span",{slot:"label"},t("slot",{name:"label"})):null),this.open&&t("div",{part:"popup",ref:t=>this.popup=t,class:{datepicker__popup:true,"datepicker__popup--is-up":this.placement?this.placement==="top":this.isDropDownContentUp,"datepicker__popup--is-inline":this.inline}},this.renderHeader(),this.renderBody(),this.type==="date-time"&&t("six-timepicker",{inline:true,"onSix-timepicker-change-debounced":t=>this.onTimepickerChange(t),value:((e=this.selectedDate)===null||e===void 0?void 0:e.getHours())+":"+((i=this.selectedDate)===null||i===void 0?void 0:i.getMinutes())+":"+((s=this.selectedDate)===null||s===void 0?void 0:s.getSeconds())}),t("div",{class:"datepicker__footer"},t("slot",null))))}adjustPopupPosition(){this.adjustPopupForHoisting();this.adjustPopupForSmallScreens()}moveOpenHoistedPopup(){if(!this.hoist||!this.open){return}const t=this.popup.getBoundingClientRect();const e=t.height;const i=this.inputElement.getBoundingClientRect();const s=i.top;const r=i.height;this.calcIsDropDownContentUp();if(this.isDropDownContentUp){this.popup.style.top=`${s-e}px`}else{this.popup.style.top=`${s+r}px`}}adjustPopupForSmallScreens(){setTimeout((()=>{if(!this.popup){return}const t=this.popup.getBoundingClientRect();const e=()=>{this.popup.style.position="fixed";["top","left","width","height"].forEach((e=>{this.popup.style[e]=`${t[e]}px`}))};if(t.y<0&&window.innerHeight-t.height>0&&Math.abs(t.y)<=t.height){e();this.popup.style.top="0px"}else if(window.innerHeight<t.y+t.height&&window.innerHeight>t.height&&Math.abs(t.y-window.innerHeight)<=t.height){e();this.popup.style.top=`${window.innerHeight-t.height}px`}if(window.innerWidth<t.x+t.width&&window.innerWidth>t.width&&Math.abs(t.x-window.innerWidth)<=t.width){e();this.popup.style.left=`${window.innerWidth-t.width}px`}}),0)}adjustPopupForHoisting(){if(!this.hoist){return}setTimeout((()=>{if(!this.popup){return}const t=this.popup.getBoundingClientRect();this.popup.style.position="fixed";["top","left","width","height"].forEach((e=>{this.popup.style[e]=`${t[e]}px`}));const e=this.inputElement.getBoundingClientRect();const i=e.top;const s=t.top;this.calcIsDropDownContentUp();if(this.isDropDownContentUp&&i<s){this.popup.style.top=`${s-t.height-e.height}px`}}),0)}connectedCallback(){this.handleClearClick=this.handleClearClick.bind(this)}disconnectedCallback(){this.eventListeners.removeAll()}displayCustomMessage(t){if(!this.inputElement){return}if(t){void this.setCustomValidity("")}else{const t=this.errorText?this.errorText:"Invalid date format";void this.setCustomValidity(t)}}static getCurrentDateAsPointer(){return{year:b(f()),month:v(f()),day:k(f()),hours:g(f()),minutes:w(f()),seconds:x(f())}}get host(){return s(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};at.style=it;export{at as six_datepicker};
-//# sourceMappingURL=p-f18ba86f.entry.js.map