@six-group/ui-library 4.0.0-beta.0 → 4.0.0-beta.2

package/dist/ui-library/p-5eb21538.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixRootCss","SixRoot","this","resizeObserver","ResizeObserver","host","width","contentRect","collapse","breakpoint","handleCollapsed","collapsed","collapsedEvent","emit","componentWillLoad","observe","disconnectedCallback","disconnect","render","h","class","part","stage","version","name","value","open","padded"],"sources":["./src/components/six-root/six-root.scss?tag=six-root&encapsulation=shadow","./src/components/six-root/six-root.tsx"],"sourcesContent":["@import 'src/global/mixins/scrollbar';\n\n:host {\n  display: block;\n  overflow: hidden;\n  height: inherit;\n}\n\n.six-root {\n  display: grid;\n  grid-template: auto 1fr auto / auto 1fr auto;\n  height: 100%;\n\n  &__container {\n    &--padded {\n      padding: var(--six-spacing-xxx-large);\n    }\n  }\n\n  &__left-sidebar {\n    height: 100%;\n    overflow: scroll;\n    grid-column: 1 / 2;\n  }\n\n  &__right-sidebar {\n    height: 100%;\n    overflow: scroll;\n    grid-column: 3 / 4;\n  }\n\n  nav {\n    overflow: hidden;\n  }\n}\n\nheader {\n  grid-column: 1 / 4;\n  position: sticky;\n  top: 0;\n  z-index: var(--six-z-index-header);\n  // border fix\n  margin-right: 2px;\n}\n\nmain {\n  height: 100%;\n\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  grid-column: 2 / 3;\n  overflow: auto;\n}\n\nfooter {\n  grid-column: 1 / 4;\n}\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\nimport { StageType } from '../six-stage-indicator/six-stage-indicator';\n\nexport interface SixRootCollapsedPayload {\n  collapsed: boolean;\n}\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot header - Used to define the header component.\n * @slot main - Used to define the components in the main area.\n * @slot left-sidebar - Used to define the side bar on the left side.\n * @slot right-sidebar - Used to define the side bar on the right side.\n * @slot footer - Used to define the footer component.\n */\n\n@Component({\n  tag: 'six-root',\n  styleUrl: 'six-root.scss',\n  shadow: true,\n})\nexport class SixRoot {\n  @Element() host: HTMLSixRootElement;\n\n  /** Breakpoint for smaller screens when the right sidebar is collapsed by default. */\n  @Prop() breakpoint = 1024;\n\n  /** Defines whether the content section should be padded */\n  @Prop() padded = true;\n\n  /** Defines the stage of the application*/\n  @Prop() stage: StageType = null;\n\n  /** Defines the version of the application*/\n  @Prop() version = '';\n\n  /** Emitted when display size is updated. */\n  @Event({ eventName: 'six-root-collapsed' }) collapsedEvent: EventEmitter<SixRootCollapsedPayload>;\n\n  @State() collapse: boolean;\n\n  resizeObserver = new ResizeObserver(([host]) => {\n    const { width } = host.contentRect;\n    this.collapse = width < this.breakpoint;\n  });\n\n  @Watch('collapse')\n  handleCollapsed(collapsed: boolean) {\n    this.collapsedEvent.emit({ collapsed });\n  }\n\n  componentWillLoad() {\n    this.resizeObserver.observe(this.host);\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver.disconnect();\n  }\n\n  render() {\n    return (\n      <host class=\"six-root\">\n        <header part=\"header\">\n          {this.stage && <six-stage-indicator stage={this.stage}>{this.version}</six-stage-indicator>}\n          <slot name=\"header\" />\n        </header>\n        <nav class=\"six-root__left-sidebar\" part=\"left-sidebar\">\n          <set-attributes value={{ open: !this.collapse }}>\n            <slot name=\"left-sidebar\" />\n          </set-attributes>\n        </nav>\n        <main part=\"main\">\n          <div class={{ 'six-root__container': true, 'six-root__container--padded': this.padded }} part=\"container\">\n            <slot name=\"main\" />\n          </div>\n          <div class=\"six-root__footer\">\n            <slot name=\"footer\" />\n          </div>\n        </main>\n        <nav class=\"six-root__right-sidebar\" part=\"right-sidebar\">\n          <slot name=\"right-sidebar\" />\n        </nav>\n      </host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAa,mlB,MCuBNC,EAAO,M,4EAoBlBC,KAAAC,eAAiB,IAAIC,gBAAe,EAAEC,MACpC,MAAMC,MAAEA,GAAUD,EAAKE,YACvBL,KAAKM,SAAWF,EAAQJ,KAAKO,UAAU,I,gBAlBpB,K,YAGJ,K,WAGU,K,aAGT,G,wBAalBC,gBAAgBC,GACdT,KAAKU,eAAeC,KAAK,CAAEF,a,CAG7BG,oBACEZ,KAAKC,eAAeY,QAAQb,KAAKG,K,CAGnCW,uBACEd,KAAKC,eAAec,Y,CAGtBC,SACE,OACEC,EAAA,QAAMC,MAAM,YACVD,EAAA,UAAQE,KAAK,UACVnB,KAAKoB,OAASH,EAAA,uBAAqBG,MAAOpB,KAAKoB,OAAQpB,KAAKqB,SAC7DJ,EAAA,QAAMK,KAAK,YAEbL,EAAA,OAAKC,MAAM,yBAAyBC,KAAK,gBACvCF,EAAA,kBAAgBM,MAAO,CAAEC,MAAOxB,KAAKM,WACnCW,EAAA,QAAMK,KAAK,mBAGfL,EAAA,QAAME,KAAK,QACTF,EAAA,OAAKC,MAAO,CAAE,sBAAuB,KAAM,8BAA+BlB,KAAKyB,QAAUN,KAAK,aAC5FF,EAAA,QAAMK,KAAK,UAEbL,EAAA,OAAKC,MAAM,oBACTD,EAAA,QAAMK,KAAK,aAGfL,EAAA,OAAKC,MAAM,0BAA0BC,KAAK,iBACxCF,EAAA,QAAMK,KAAK,mB"}

package/dist/ui-library/p-60c5395c.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as i,H as s,c as e}from"./p-16b99232.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:table-cell;padding:var(--six-spacing-medium);font-size:var(--six-font-size-small)}";const r=class{constructor(i){t(this,i)}render(){return i(s,null,i("slot",null))}};r.style=o;const n=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:table-header-group;cursor:pointer;font-family:var(--six-font-family);font-weight:var(--six-font-weight-bold);color:var(--six-table-header-color);border-bottom:solid 2px var(--six-table-header-border-color);padding:0.75rem}";const a=class{constructor(i){t(this,i)}render(){return i(s,null,i("slot",null))}};a.style=n;const l=t=>i=>{const s=t.indexOf(i)+1;return t[s<t.length?s:0]};const h=l(["none","asc","desc"]);const d=l(Object.values(["eq","ne","in","ni"]));const c=(t,i)=>({[t]:i});const b=(t,i,s)=>({[t]:{[i]:s}});const x={["asc"]:"arrow_drop_up",["desc"]:"arrow_drop_down",["none"]:"swap_vert"};const f={["eq"]:"=",["ne"]:"&ne;",["in"]:"&isin;",["ni"]:"&notin;"};const u=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:table-cell;padding:var(--six-spacing-medium) var(--six-spacing-medium) var(--six-spacing-x-small);font-size:var(--six-font-size-small)}six-icon{vertical-align:text-top;width:1.5rem}.header:hover .header__trigger-icon,.header--selected .header__trigger-icon{opacity:1}.header__trigger-icon{color:var(--six-color-web-rock-600);opacity:0}.header__trigger-icon-box{float:right}[slot=prefix]{font-size:1.5em}six-dropdown::part(panel){overflow:inherit}";const p=class{constructor(i){t(this,i);this.sortUpdated=e(this,"six-table-header-cell-sort-updated",7);this.filterUpdated=e(this,"six-table-header-cell-filter-updated",7);this.handleSortNext=()=>{this.sortUpdated.emit(c(this.name,h(this.sort)))};this.handleFilterNext=()=>{this.filterUpdated.emit(b(this.name,d(this.filter),this.inputElement.value))};this.handleFilterChange=()=>{this.filterUpdated.emit(b(this.name,this.filter,this.inputElement.value))};this.handleFilterClear=()=>{this.filterUpdated.emit(b(this.name,this.filter,undefined));this.filterRef.hide()};this.name=undefined;this.sort=undefined;this.filter=undefined;this.value=undefined}render(){const t=this.sort&&i("six-icon",{filled:true,class:{"header__trigger-icon":this.sort==="none"},onClick:this.handleSortNext,"data-testid":`table-sort-${this.name}`},x[this.sort]);const e=this.filter&&i("six-dropdown",{ref:t=>this.filterRef=t,hoist:true,"data-testid":`table-filter-${this.name}`},i("six-icon",{slot:"trigger",class:"header__trigger-icon"},"filter_alt"),i("six-input",{ref:t=>this.inputElement=t,value:this.value,"onSix-input-input":this.handleFilterChange},i("six-icon-button",{slot:"prefix",html:f[this.filter],onClick:this.handleFilterNext,"data-testid":`table-filter-prefix-${this.name}`}),i("six-icon-button",{slot:"suffix",name:"clear",label:"Clear",onClick:this.handleFilterClear,"data-testid":`table-filter-suffix-${this.name}`})));return i(s,null,i("div",{class:{header:true,"header--selected":this.value!==undefined}},i("slot",null),i("div",{class:"header__trigger-icon-box"},t,e)))}};p.style=u;const g=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:table-row;font-family:var(--six-font-family)}:host(:hover){background-color:var(--six-table-row-background-color-hover)}";const _=class{constructor(i){t(this,i)}render(){return i(s,null,i("slot",null))}};_.style=g;export{r as six_table_cell,a as six_table_header,p as six_table_header_cell,_ as six_table_row};
-//# sourceMappingURL=p-60c5395c.entry.js.map

package/dist/ui-library/p-60c5395c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixTableCellCss","SixTableCell","render","h","Host","sixTableHeaderCss","SixTableHeader","getNextState","states","current","next","indexOf","length","getNextSortState","getNextFilterState","Object","values","createSortModel","key","value","createFilterModel","filter","SortIcon","FilterIcon","sixTableHeaderCellCss","SixTableHeaderCell","this","handleSortNext","sortUpdated","emit","name","sort","handleFilterNext","filterUpdated","inputElement","handleFilterChange","handleFilterClear","undefined","filterRef","hide","filled","class","onClick","ref","el","hoist","slot","html","label","header","sixTableRowCss","SixTableRow"],"sources":["./src/components/six-table-cell/six-table-cell.scss?tag=six-table-cell&encapsulation=shadow","./src/components/six-table-cell/six-table-cell.tsx","./src/components/six-table-header/six-table-header.scss?tag=six-table-header&encapsulation=shadow","./src/components/six-table-header/six-table-header.tsx","./src/components/six-table-header-cell/util/get-next-state.ts","./src/components/six-table-header-cell/util/create-model.ts","./src/components/six-table-header-cell/icons.ts","./src/components/six-table-header-cell/six-table-header-cell.scss?tag=six-table-header-cell&encapsulation=shadow","./src/components/six-table-header-cell/six-table-header-cell.tsx","./src/components/six-table-row/six-table-row.scss?tag=six-table-row&encapsulation=shadow","./src/components/six-table-row/six-table-row.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: table-cell;\n  padding: var(--six-spacing-medium);\n  font-size: var(--six-font-size-small);\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the content of the cell.\n */\n\n@Component({\n  tag: 'six-table-cell',\n  styleUrl: 'six-table-cell.scss',\n  shadow: true,\n})\nexport class SixTableCell {\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n","@import 'src/global/component';\n\n:host {\n  display: table-header-group;\n  cursor: pointer;\n  font-family: var(--six-font-family);\n  font-weight: var(--six-font-weight-bold);\n  color: var(--six-table-header-color);\n  border-bottom: solid 2px var(--six-table-header-border-color);\n  padding: 0.75rem;\n}\n","import { Component, Host, h } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the cells of the header.\n */\n\n@Component({\n  tag: 'six-table-header',\n  styleUrl: 'six-table-header.scss',\n  shadow: true,\n})\nexport class SixTableHeader {\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n","import { FilterMode, SortDirection } from '../types';\n\nconst getNextState =\n  <T>(states: T[]) =>\n  (current: T): T => {\n    const next = states.indexOf(current) + 1;\n    return states[next < states.length ? next : 0];\n  };\n\nexport const getNextSortState = getNextState(['none', 'asc', 'desc'] as SortDirection[]);\nexport const getNextFilterState = getNextState(Object.values(['eq', 'ne', 'in', 'ni'] as FilterMode[]));\n","import { Item, SortModel, FilterModel } from '../../six-table/types';\nimport { SortDirection, FilterMode } from '../types';\n\nexport const createSortModel = <T extends Item>(key: keyof T, value: SortDirection): SortModel<T> => {\n  return { [key]: value } as any;\n};\n\nexport const createFilterModel = <T extends Item>(key: keyof T, filter: FilterMode, value: string): FilterModel<T> => {\n  return { [key]: { [filter]: value } } as any;\n};\n","import { FilterMode, SortDirection } from './types';\n\nexport const SortIcon: Record<SortDirection, string> = {\n  ['asc']: 'arrow_drop_up',\n  ['desc']: 'arrow_drop_down',\n  ['none']: 'swap_vert',\n};\n\nexport const FilterIcon: Record<FilterMode, string> = {\n  ['eq']: '=',\n  ['ne']: '&ne;',\n  ['in']: '&isin;',\n  ['ni']: '&notin;',\n};\n","@import 'src/global/component';\n\n:host {\n  display: table-cell;\n  padding: var(--six-spacing-medium) var(--six-spacing-medium) var(--six-spacing-x-small);\n  font-size: var(--six-font-size-small);\n}\n\nsix-icon {\n  vertical-align: text-top;\n  width: 1.5rem;\n}\n\n.header {\n  &:hover,\n  &--selected {\n    .header__trigger-icon {\n      opacity: 1;\n    }\n  }\n\n  &__trigger-icon {\n    color: var(--six-color-web-rock-600);\n    opacity: 0;\n  }\n\n  &__trigger-icon-box {\n    float: right;\n  }\n}\n\n[slot='prefix'] {\n  font-size: 1.5em;\n}\n\nsix-dropdown::part(panel) {\n  overflow: inherit;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { FilterMode, SortDirection } from './types';\nimport { FilterModel, Item, SortModel } from '../six-table/types';\nimport { getNextFilterState, getNextSortState } from './util/get-next-state';\nimport { createFilterModel, createSortModel } from './util/create-model';\nimport { FilterIcon, SortIcon } from './icons';\n\nexport type SixTableHeaderCellSortUpdatedPayload = SortModel<Item>;\nexport type SixTableHeaderCellFilterUpdatedPayload = FilterModel<Item>;\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the label of the header field.\n */\n\n@Component({\n  tag: 'six-table-header-cell',\n  styleUrl: 'six-table-header-cell.scss',\n  shadow: true,\n})\nexport class SixTableHeaderCell {\n  filterRef: HTMLSixDropdownElement;\n\n  /** Table row property name. Used in the custom events to identify the row. */\n  @Prop() name: keyof Item;\n  /** Sort direction. Applied only when set. */\n  @Prop() sort: SortDirection;\n  /** Filter mode. Applied only when set. */\n  @Prop() filter: FilterMode;\n  /** Filter value. Applied only when filter mode is set. */\n  @Prop() value: string;\n\n  /** Emitted when sort model is updated. */\n  @Event({ eventName: 'six-table-header-cell-sort-updated' })\n  sortUpdated: EventEmitter<SixTableHeaderCellSortUpdatedPayload>;\n  /** Emitted when filter model is updated. */\n  @Event({ eventName: 'six-table-header-cell-filter-updated' })\n  filterUpdated: EventEmitter<SixTableHeaderCellFilterUpdatedPayload>;\n\n  inputElement: HTMLSixInputElement;\n\n  handleSortNext = () => {\n    this.sortUpdated.emit(createSortModel(this.name, getNextSortState(this.sort)));\n  };\n\n  handleFilterNext = () => {\n    this.filterUpdated.emit(createFilterModel(this.name, getNextFilterState(this.filter), this.inputElement.value));\n  };\n\n  handleFilterChange = () => {\n    this.filterUpdated.emit(createFilterModel(this.name, this.filter, this.inputElement.value));\n  };\n\n  handleFilterClear = () => {\n    this.filterUpdated.emit(createFilterModel(this.name, this.filter, undefined));\n    this.filterRef.hide();\n  };\n\n  render() {\n    const sort = this.sort && (\n      <six-icon\n        filled={true}\n        class={{ 'header__trigger-icon': this.sort === 'none' }}\n        onClick={this.handleSortNext}\n        data-testid={`table-sort-${this.name}`}\n      >\n        {SortIcon[this.sort]}\n      </six-icon>\n    );\n\n    const filter = this.filter && (\n      <six-dropdown ref={(el) => (this.filterRef = el)} hoist data-testid={`table-filter-${this.name}`}>\n        <six-icon slot=\"trigger\" class=\"header__trigger-icon\">\n          filter_alt\n        </six-icon>\n        <six-input\n          ref={(el) => (this.inputElement = el)}\n          value={this.value}\n          onSix-input-input={this.handleFilterChange}\n        >\n          <six-icon-button\n            slot=\"prefix\"\n            html={FilterIcon[this.filter]}\n            onClick={this.handleFilterNext}\n            data-testid={`table-filter-prefix-${this.name}`}\n          />\n          <six-icon-button\n            slot=\"suffix\"\n            name=\"clear\"\n            label=\"Clear\"\n            onClick={this.handleFilterClear}\n            data-testid={`table-filter-suffix-${this.name}`}\n          />\n        </six-input>\n      </six-dropdown>\n    );\n\n    return (\n      <Host>\n        <div class={{ header: true, 'header--selected': this.value !== undefined }}>\n          <slot />\n          <div class=\"header__trigger-icon-box\">\n            {sort}\n            {filter}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import 'src/global/component';\n\n:host {\n  display: table-row;\n  font-family: var(--six-font-family);\n}\n\n:host(:hover) {\n  background-color: var(--six-table-row-background-color-hover);\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the cells of the row.\n */\n\n@Component({\n  tag: 'six-table-row',\n  styleUrl: 'six-table-row.scss',\n  shadow: true,\n})\nexport class SixTableRow {\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAkB,yM,MCcXC,EAAY,M,yBACvBC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,a,aClBR,MAAME,EAAoB,qV,MCcbC,EAAc,M,yBACzBJ,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,a,aChBR,MAAMI,EACAC,GACHC,IACC,MAAMC,EAAOF,EAAOG,QAAQF,GAAW,EACvC,OAAOD,EAAOE,EAAOF,EAAOI,OAASF,EAAO,EAAE,EAG3C,MAAMG,EAAmBN,EAAa,CAAC,OAAQ,MAAO,SACtD,MAAMO,EAAqBP,EAAaQ,OAAOC,OAAO,CAAC,KAAM,KAAM,KAAM,QCPzE,MAAMC,EAAkB,CAAiBC,EAAcC,KACrD,CAAED,CAACA,GAAMC,IAGX,MAAMC,EAAoB,CAAiBF,EAAcG,EAAoBF,KAC3E,CAAED,CAACA,GAAM,CAAEG,CAACA,GAASF,KCNvB,MAAMG,EAA0C,CACrD,CAAC,OAAQ,gBACT,CAAC,QAAS,kBACV,CAAC,QAAS,aAGL,MAAMC,EAAyC,CACpD,CAAC,MAAO,IACR,CAAC,MAAO,OACR,CAAC,MAAO,SACR,CAAC,MAAO,WCZV,MAAMC,EAAwB,qjB,MCsBjBC,EAAkB,M,6JAqB7BC,KAAAC,eAAiB,KACfD,KAAKE,YAAYC,KAAKZ,EAAgBS,KAAKI,KAAMjB,EAAiBa,KAAKK,OAAO,EAGhFL,KAAAM,iBAAmB,KACjBN,KAAKO,cAAcJ,KAAKT,EAAkBM,KAAKI,KAAMhB,EAAmBY,KAAKL,QAASK,KAAKQ,aAAaf,OAAO,EAGjHO,KAAAS,mBAAqB,KACnBT,KAAKO,cAAcJ,KAAKT,EAAkBM,KAAKI,KAAMJ,KAAKL,OAAQK,KAAKQ,aAAaf,OAAO,EAG7FO,KAAAU,kBAAoB,KAClBV,KAAKO,cAAcJ,KAAKT,EAAkBM,KAAKI,KAAMJ,KAAKL,OAAQgB,YAClEX,KAAKY,UAAUC,MAAM,E,mFAGvBrC,SACE,MAAM6B,EAAOL,KAAKK,MAChB5B,EAAA,YACEqC,OAAQ,KACRC,MAAO,CAAE,uBAAwBf,KAAKK,OAAS,QAC/CW,QAAShB,KAAKC,eAAc,cACf,cAAcD,KAAKI,QAE/BR,EAASI,KAAKK,OAInB,MAAMV,EAASK,KAAKL,QAClBlB,EAAA,gBAAcwC,IAAMC,GAAQlB,KAAKY,UAAYM,EAAKC,MAAK,mBAAc,gBAAgBnB,KAAKI,QACxF3B,EAAA,YAAU2C,KAAK,UAAUL,MAAM,wBAAsB,cAGrDtC,EAAA,aACEwC,IAAMC,GAAQlB,KAAKQ,aAAeU,EAClCzB,MAAOO,KAAKP,MAAK,oBACEO,KAAKS,oBAExBhC,EAAA,mBACE2C,KAAK,SACLC,KAAMxB,EAAWG,KAAKL,QACtBqB,QAAShB,KAAKM,iBAAgB,cACjB,uBAAuBN,KAAKI,SAE3C3B,EAAA,mBACE2C,KAAK,SACLhB,KAAK,QACLkB,MAAM,QACNN,QAAShB,KAAKU,kBAAiB,cAClB,uBAAuBV,KAAKI,WAMjD,OACE3B,EAACC,EAAI,KACHD,EAAA,OAAKsC,MAAO,CAAEQ,OAAQ,KAAM,mBAAoBvB,KAAKP,QAAUkB,YAC7DlC,EAAA,aACAA,EAAA,OAAKsC,MAAM,4BACRV,EACAV,I,aCzGb,MAAM6B,EAAiB,+O,MCcVC,EAAW,M,yBACtBjD,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,a"}

package/dist/ui-library/p-694829b8.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-6cc82df5.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixLanguageSwitcherCss","DEFAULT_LANGUAGES","SixLanguageSwitcher","this","handleLanguageSwitching","newLanguage","languageValue","undefined","sixChange","emit","selected","handleChangesLanguages","newValue","Array","isArray","Error","updateSelectedLanguage","componentWillLoad","selectedLanguage","languages","key","value","render","h","part","class","map","lang","index","language","onClick","length"],"sources":["./src/components/six-language-switcher/six-language-switcher.scss?tag=six-language-switcher&encapsulation=shadow","./src/components/six-language-switcher/six-language-switcher.tsx"],"sourcesContent":[".language-switcher {\n  &__container {\n    display: flex;\n  }\n\n  &__separator {\n    padding: 0 0.25rem;\n  }\n\n  &__label {\n    cursor: pointer;\n\n    &:hover {\n      color: var(--six-color-red);\n    }\n\n    &--selected {\n      color: var(--six-color-red);\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @since 2.1.0\n * @status experimental\n **/\n\nexport interface SixLanguageSwitcherInput {\n  key: string;\n  value: string;\n}\nexport type SixLanguageSwitcherChangePayload = string;\n\nconst DEFAULT_LANGUAGES = ['EN', 'DE', 'ES'];\n\n/*\n * @since 2.2.0\n * @status experimental\n * @part container - The whole component container\n * @part label - The language label\n * @part separator - The separator between the language labels\n */\n@Component({\n  tag: 'six-language-switcher',\n  styleUrl: 'six-language-switcher.scss',\n  shadow: true,\n})\nexport class SixLanguageSwitcher {\n  /** The language which should be shown as selected */\n  @Prop({ mutable: true, reflect: true }) selected?: string;\n\n  /** The languages which should be selectable options. */\n  @Prop() languages: string[] | SixLanguageSwitcherInput[] = DEFAULT_LANGUAGES;\n\n  @Watch('languages')\n  handleChangesLanguages(newValue: string[]) {\n    if (!Array.isArray(newValue)) {\n      throw new Error('languages is expected to be an array');\n    }\n\n    this.updateSelectedLanguage();\n  }\n  /**\n   * Emitted when the language switchers value changes\n   */\n  @Event({ eventName: 'six-language-switcher-change' }) sixChange: EventEmitter<SixLanguageSwitcherChangePayload>;\n\n  componentWillLoad() {\n    if (this.selected === undefined) {\n      this.updateSelectedLanguage();\n    }\n  }\n\n  private updateSelectedLanguage() {\n    const selectedLanguage = this.languages[0];\n    if (typeof selectedLanguage === 'string') {\n      this.selected = selectedLanguage;\n      this.sixChange.emit(this.selected);\n    } else {\n      this.selected = selectedLanguage.key;\n      this.sixChange.emit(selectedLanguage.value);\n    }\n  }\n\n  private handleLanguageSwitching = (newLanguage: string, languageValue?: string) => () => {\n    if (languageValue !== undefined) {\n      this.sixChange.emit(languageValue);\n    } else {\n      this.sixChange.emit(newLanguage);\n    }\n    this.selected = newLanguage;\n  };\n\n  render() {\n    return (\n      <div part=\"container\" class=\"language-switcher__container\">\n        {this.languages.map((lang, index) => {\n          const language = typeof lang === 'string' ? lang : lang.key;\n          return (\n            <div onClick={this.handleLanguageSwitching(language, lang.value)}>\n              <span\n                part=\"label\"\n                class={{\n                  'language-switcher__label': true,\n                  'language-switcher__label--selected': this.selected === language,\n                }}\n              >\n                {language}\n              </span>\n              {index < this.languages.length - 1 && (\n                <span part=\"separator\" class=\"language-switcher__separator\">\n                  /\n                </span>\n              )}\n            </div>\n          );\n        })}\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAyB,iQCa/B,MAAMC,EAAoB,CAAC,KAAM,KAAM,M,MAc1BC,EAAmB,M,iFAqCtBC,KAAAC,wBAA0B,CAACC,EAAqBC,IAA2B,KACjF,GAAIA,IAAkBC,UAAW,CAC/BJ,KAAKK,UAAUC,KAAKH,E,KACf,CACLH,KAAKK,UAAUC,KAAKJ,E,CAEtBF,KAAKO,SAAWL,CAAW,E,uCAtC8BJ,C,CAG3DU,uBAAuBC,GACrB,IAAKC,MAAMC,QAAQF,GAAW,CAC5B,MAAM,IAAIG,MAAM,uC,CAGlBZ,KAAKa,wB,CAOPC,oBACE,GAAId,KAAKO,WAAaH,UAAW,CAC/BJ,KAAKa,wB,EAIDA,yBACN,MAAME,EAAmBf,KAAKgB,UAAU,GACxC,UAAWD,IAAqB,SAAU,CACxCf,KAAKO,SAAWQ,EAChBf,KAAKK,UAAUC,KAAKN,KAAKO,S,KACpB,CACLP,KAAKO,SAAWQ,EAAiBE,IACjCjB,KAAKK,UAAUC,KAAKS,EAAiBG,M,EAazCC,SACE,OACEC,EAAA,OAAKC,KAAK,YAAYC,MAAM,gCACzBtB,KAAKgB,UAAUO,KAAI,CAACC,EAAMC,KACzB,MAAMC,SAAkBF,IAAS,SAAWA,EAAOA,EAAKP,IACxD,OACEG,EAAA,OAAKO,QAAS3B,KAAKC,wBAAwByB,EAAUF,EAAKN,QACxDE,EAAA,QACEC,KAAK,QACLC,MAAO,CACL,2BAA4B,KAC5B,qCAAsCtB,KAAKO,WAAamB,IAGzDA,GAEFD,EAAQzB,KAAKgB,UAAUY,OAAS,GAC/BR,EAAA,QAAMC,KAAK,YAAYC,MAAM,gCAA8B,KAIzD,I"}

package/dist/ui-library/p-7115416e.entry.js

@@ -1,2 +0,0 @@
-import{h as t,r as e,c as i,g as s}from"./p-16b99232.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-table-row-background-color-hover)}.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-7115416e.entry.js.map

package/dist/ui-library/p-7115416e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["i18nDate","en","months","monthsShort","monthsShortGrouped","weekdays","weekdaysShort","weekdaysMin","de","fr","it","now","Date","isValidDate","value","isNil","isNumber","isDate","isNaN","getTime","toString","year","date","getFullYear","Error","month","getMonth","day","getDate","hours","getHours","minutes","getMinutes","seconds","getSeconds","getFirstDayOfTheWeek","weekdayDiff","setDate","getDay","isSameYear","a","b","isSameMonth","isSameDay","isSameWeek","isValidDateString","datestring","format","isString","length","getDateParts","toDate","isInRange","minDate","maxDate","lookAhead","iFormat","match","increment","followingCharacterMatches","charAt","hasProperLength","formatNumber","len","num","String","formatDate","output","FORMATTING_TOKENS","TWO_NUMERICS_REGEX","FOUR_NUMERICS_REGEX","NON_NUMERIC_REGEX","YEAR","MONTH","DAY","HOUR","MINUTE","SECOND","parseFlags","addParseFlag","token","regex","callback","tokens","Array","isArray","func","input","parseInt","forEach","key","cent","Math","floor","getFullInputArray","backupDate","result","backupArr","useBackup","i","undefined","createDate","hour","minute","second","isFinite","setFullYear","makeParser","dateString","mark","parseTo","word","replace","indexOf","substr","parser","exec","obj","Object","assign","getCleanDateString","dirtyDateString","separator","split","map","s","join","inputArray","parsedDate","e","NaN","createCalendarGrid","calendarGridArguments","firstDateOfBox","allowedDates","dateFormat","selectedDate","pointerDate","weekDatePointer","dayDatePointer","calendar","row","display","label","isToday","isSelected","isDisabled","isOutdated","SixDateFormats","MonthSelection","locale","onClickMonthCell","isSelectedMonth","findIndex","m","h","class","part","onClick","DaySelection","calendarGrid","onClickDateCell","weekday","cell","YearSelection","yearSelection","onClickYearCell","sixDatepickerCss","NUMBER_OF_YEARS_SHOWN","MIN_POPUP_HEIGHT","SelectionMode","getYearSelectionAroundYear","numberOfElementsPerRow","from","keys","n","reduce","curr","item","index","push","SixDatepicker","this","eventListeners","EventListeners","defaultValue","handleDocumentKeyDown","event","open","stopPropagation","closePopup","inputElement","setFocus","handleDocumentMouseDown","path","composedPath","includes","container","onTimepickerChange","sixTimepickerChange","time","detail","newDate","setHours","SixTimePropertyName","HOURS","MINUTES","SECONDS","updateValue","updatePointerDates","select","selectedMonth","monthShort","selectionMode","handleInputChange","inputValue","inputValueDate","min","max","updateIfChanged","datesOnly","isDateValid","displayCustomMessage","handleOnBlur","formattedDate","sixBlur","emit","getCurrentDateAsPointer","type","DDMMYYY_DOT","DEFAULT_DEBOUNCE_FAST","debounceChanged","sixSelect","debounceEvent","debounce","valueChanged","isValidValue","console","warn","async","calcIsDropDownContentUp","moveOpenHoistedPopup","adjustPopupPosition","containingElement","host","reportValidity","checkValidity","message","setCustomValidity","reset","wrapper","inputBoundingRect","getBoundingClientRect","wrapperBoundingRect","minPopupHeight","height","moreSpaceInTop","y","window","innerHeight","isDropDownContentUp","bottom","getMonthStringForIndex","previousUnit","previousMonth","previousYear","previousYearGroup","nextUnit","nextMonth","nextYear","nextYearGroup","openCalendar","disabled","setupEventListenersForOpenPopup","add","document","handleClearClick","sixClear","inline","remove","getPointerDate","differsFromPointerDate","defaultDate","_a","closeOnSelect","componentWillLoad","validateProps","componentDidLoad","renderHeader","viewBox","width","d","points","renderBody","renderCustomIcon","icon","hasSlot","name","size","slot","prefix","iconPosition","renderClearable","clearable","tabindex","render","ref","el","placeholder","readonly","required","errorText","errorOnBlur","popup","datepicker__popup","placement","_b","_c","adjustPopupForHoisting","adjustPopupForSmallScreens","hoist","popupBoundingClientRect","popupHeight","inputBoundingClientRect","inputTop","top","inputHeight","style","setTimeout","setPopupAsFixPosition","position","property","abs","innerWidth","x","left","popupTop","connectedCallback","bind","disconnectedCallback","removeAll","valid","static"],"sources":["./src/utils/date-util.ts","./src/components/six-datepicker/six-date-formats.tsx","./src/components/six-datepicker/components/month-selection.tsx","./src/components/six-datepicker/components/day-selection.tsx","./src/components/six-datepicker/components/year-selection.tsx","./src/components/six-datepicker/six-datepicker.scss?tag=six-datepicker&encapsulation=shadow","./src/components/six-datepicker/six-datepicker.tsx"],"sourcesContent":["import { isDate, isNil, isNumber, isString } from './type-check';\nimport { SixDateFormats } from '../components/six-datepicker/six-date-formats';\nimport { CalendarCell } from '../components/six-datepicker/six-datepicker';\n\nexport const i18nDate = {\n  en: {\n    months: [\n      'January',\n      'February',\n      'March',\n      'April',\n      'May',\n      'June',\n      'July',\n      'August',\n      'September',\n      'October',\n      'November',\n      'December',\n    ],\n    monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n    monthsShortGrouped: [\n      ['Jan', 'Feb', 'Mar', 'Apr'],\n      ['May', 'Jun', 'Jul', 'Aug'],\n      ['Sep', 'Oct', 'Nov', 'Dec'],\n    ],\n    weekdays: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],\n    weekdaysShort: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],\n    weekdaysMin: ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'],\n  },\n  de: {\n    months: [\n      'Januar',\n      'Februar',\n      'März',\n      'April',\n      'Mai',\n      'Juni',\n      'Juli',\n      'August',\n      'September',\n      'Oktober',\n      'November',\n      'Dezember',\n    ],\n    monthsShort: ['Jan.', 'Feb.', 'März', 'Apr.', 'Mai', 'Juni', 'Juli', 'Aug.', 'Sep.', 'Okt.', 'Nov.', 'Dez.'],\n    monthsShortGrouped: [\n      ['Jan.', 'Feb.', 'März', 'Apr.'],\n      ['Mai', 'Juni', 'Juli', 'Aug.'],\n      ['Sep.', 'Okt.', 'Nov.', 'Dez.'],\n    ],\n    weekdays: ['Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag', 'Sonntag'],\n    weekdaysShort: ['Mo.', 'Di.', 'Mi.', 'Do.', 'Fr.', 'Sa.', 'So.'],\n    weekdaysMin: ['Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa', 'So'],\n  },\n  fr: {\n    months: [\n      'janvier',\n      'février',\n      'mars',\n      'avril',\n      'mai',\n      'juin',\n      'juillet',\n      'août',\n      'septembre',\n      'octobre',\n      'novembre',\n      'décembre',\n    ],\n    monthsShort: ['janv.', 'févr.', 'mars', 'avr.', 'mai', 'juin', 'juil.', 'août', 'sept.', 'oct.', 'nov.', 'déc.'],\n    monthsShortGrouped: [\n      ['janv.', 'févr.', 'mars', 'avr.'],\n      ['mai', 'juin', 'juil.', 'août'],\n      ['sept.', 'oct.', 'nov.', 'déc.'],\n    ],\n    weekdays: ['lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi', 'dimanche'],\n    weekdaysShort: ['lun.', 'mar.', 'mer.', 'jeu.', 'ven.', 'sam.', 'dim.'],\n    weekdaysMin: ['lu', 'ma', 'me', 'je', 've', 'sa', 'di'],\n  },\n  it: {\n    months: [\n      'gennaio',\n      'febbraio',\n      'marzo',\n      'aprile',\n      'maggio',\n      'giugno',\n      'luglio',\n      'agosto',\n      'settembre',\n      'ottobre',\n      'novembre',\n      'dicembre',\n    ],\n    monthsShort: ['gen', 'feb', 'mar', 'apr', 'mag', 'giu', 'lug', 'ago', 'set', 'ott', 'nov', 'dic'],\n    monthsShortGrouped: [\n      ['gen', 'feb', 'mar', 'apr'],\n      ['mag', 'giu', 'lug', 'ago'],\n      ['set', 'ott', 'nov', 'dic'],\n    ],\n    weekdays: ['lunedì', 'martedì', 'mercoledì', 'giovedì', 'venerdì', 'sabato', 'domenica'],\n    weekdaysShort: ['lun', 'mar', 'mer', 'gio', 'ven', 'sab', 'dom'],\n    weekdaysMin: ['lu', 'ma', 'me', 'gi', 've', 'sa', 'do'],\n  },\n};\n\n/**\n * Returns a JS Date instance of the exact moment\n *\n * ```typescript\n * const date = now()\n * // Wed Mar 10 2021 20:30:32 GMT+0100 (Central European Standard Time)\n * ```\n */\nexport const now = () => new Date();\n\nexport const pad = (value: number) => String(value).padStart(2, '0');\n\n/**\n * Returns `true` if the given date is valid\n */\nexport const isValidDate = (value: any): boolean => {\n  if (isNil(value)) {\n    return false;\n  }\n\n  if (isNumber(value)) {\n    return false;\n  }\n\n  if (isDate(value)) {\n    return !isNaN(value.getTime());\n  }\n\n  return new Date(value).toString() !== 'Invalid Date';\n};\n\n/**\n * Returns the year number of the given date\n *\n * ```typescript\n * year(new Date(2020, 0, 1)) // 2020\n * ```\n */\nexport const year = (date: Date | undefined): number => {\n  if (date && isValidDate(date)) {\n    return date.getFullYear();\n  }\n  throw new Error('Not a valid date');\n};\n\n/**\n * Returns the month number of the given date\n *\n * ```typescript\n * month(new Date(2020, 0, 1)) // 0\n * ```\n */\nexport const month = (date: Date | undefined): number => {\n  if (date && isValidDate(date)) {\n    return date.getMonth();\n  }\n  throw new Error('Not a valid date');\n};\n\n/**\n * Returns the day number of the given date\n *\n * ```typescript\n * day(new Date(2020, 0, 1)) // 1\n * ```\n */\nexport const day = (date: Date | undefined): number => {\n  if (date && isValidDate(date)) {\n    return date.getDate();\n  }\n  throw new Error('Not a valid date');\n};\n\n/**\n * Returns the hours of the given date\n */\nexport const hours = (date: Date | undefined): number => {\n  if (date && isValidDate(date)) {\n    return date.getHours();\n  }\n  throw new Error('Not a valid date');\n};\n\n/**\n * Returns the minutes of the given date\n */\nexport const minutes = (date: Date | undefined): number => {\n  if (date && isValidDate(date)) {\n    return date.getMinutes();\n  }\n  throw new Error('Not a valid date');\n};\n\n/**\n * Returns the seconds of the given date\n */\nexport const seconds = (date: Date | undefined): number => {\n  if (date && isValidDate(date)) {\n    return date.getSeconds();\n  }\n  throw new Error('Not a valid date');\n};\n\n/**\n * Returns the first day of the week of the given date.\n */\nexport const getFirstDayOfTheWeek = (date: Date) => {\n  const weekdayDiff = [6, 0, 1, 2, 3, 4, 5];\n  const day = new Date(date);\n  day.setDate(day.getDate() - weekdayDiff[day.getDay()]);\n  return day;\n};\n\n/**\n * Returns `true` when the year of the dates are the same\n */\nexport const isSameYear = (a: Date, b: Date) => a?.getFullYear() === b?.getFullYear();\n\n/**\n * Returns `true` when the month of the dates are the same\n */\nexport const isSameMonth = (a: Date, b: Date) => isSameYear(a, b) && a?.getMonth() === b?.getMonth();\n\n/**\n * Returns `true` when the day of the dates are the same\n */\nexport const isSameDay = (a: Date, b: Date) => isSameMonth(a, b) && a?.getDate() === b?.getDate();\n\n/**\n * Returns `true` when the week of the dates are the same\n */\nexport const isSameWeek = (a: Date, b: Date) => isSameDay(getFirstDayOfTheWeek(a), getFirstDayOfTheWeek(b));\n\nconst localDatetime = (date: Date) => new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));\n\n/**\n * Returns the ISO string `yyyy-mm-dd` of the given date\n *\n * ```typescript\n * isoString(new Date(2020, 0, 13)) // '2020-01-13'\n * ```\n */\nexport const isoString = (date: Date | undefined): string => {\n  if (isNil(date) || Date.toString() === 'Invalid Date') {\n    return '';\n  }\n\n  return `${year(date)}-${pad(month(date) + 1)}-${pad(day(date))}`;\n};\n\n/**\n * Returns the ISO string `yyyy-mm-dd` of the given parameters year, month and day\n *\n * ```typescript\n * newDateString(2020, 0, 13) // '2020-01-13'\n * or\n * newDateString(new Date(2020, 0, 13)) // '2020-01-13'\n * ```\n */\nexport const newDateString = (yearOrDate: Date | number, month?: number, day?: number): string => {\n  let date;\n  if (isDate(yearOrDate)) {\n    date = localDatetime(yearOrDate);\n  } else {\n    date = new Date(Date.UTC(yearOrDate, (month as number) - 1, day as number));\n  }\n\n  return isoString(date);\n};\n\n/**\n * Returns `true` if the given datestring is valid\n */\nexport const isValidDateString = (datestring: string, format: string) => {\n  if (!isString(datestring) || !isString(format)) {\n    return false;\n  }\n\n  if (datestring.length < 6 || format.length < 6) {\n    return false;\n  }\n\n  const { day, month } = getDateParts(datestring, format);\n\n  if (day > 31 || month > 11 || day <= 0 || month < 0) {\n    return false;\n  }\n\n  const date = toDate(datestring, format);\n\n  if (isNil(date)) {\n    return false;\n  }\n\n  return date.toString() !== 'Invalid Date';\n};\n\n/**\n * Returns `true` when the given date is not smaller than the minDate and not bigger than the maxDate.\n *\n * ```typescript\n * isInRange(new Date(2020, 1, 1), new Date(2020, 0, 1), new Date(2020, 2, 1)) // true\n * ```\n */\nexport const isInRange = (date: Date | undefined, minDate: Date | undefined, maxDate: Date | undefined): boolean => {\n  if (!date) {\n    return true;\n  }\n\n  if (minDate && date < minDate) {\n    return false;\n  }\n\n  if (maxDate && maxDate < date) {\n    return false;\n  }\n\n  return true;\n};\n\nconst validateTwoDates = (\n  first: any,\n  second: Date | string | undefined,\n  validateFn: (irst: Date, second: Date) => boolean\n) => {\n  if (isNil(first) && isNil(second)) {\n    return false;\n  }\n\n  const _first: Date = new Date(first as string | Date);\n  const _second: Date = new Date(second as string | Date);\n\n  if (!isValidDate(_first) || !isValidDate(_second)) {\n    return false;\n  }\n\n  return validateFn(_first, _second);\n};\n\n/**\n * Returns `true` when the given date is not smaller than the before date.\n *\n * ```typescript\n * isBefore(new Date(2020, 1, 1), new Date(2020, 3, 1)) // true\n * ```\n */\nexport const isBefore = (date: any, beforeDate: Date | string | undefined): boolean =>\n  validateTwoDates(date, beforeDate, (first, second) => first < second);\n\n/**\n * Returns `true` when the given date is not smaller than the before date.\n *\n * ```typescript\n * isAfter(new Date(2020, 5, 1), new Date(2020, 3, 1)) // true\n * ```\n */\nexport const isAfter = (date: any, afterDate: Date | string | undefined): boolean =>\n  validateTwoDates(date, afterDate, (first, second) => first > second);\n\n/**\n * Increases the year of a date and retunrs the result\n *\n * ```typescript\n * increaseYear(new Date(2020, 0, 1), 1) // 2021\n * ```\n */\nexport const increaseYear = (date: Date, years: number): number => year(date) + years;\n\n/**\n * Decreases the year of a date and retunrs the result\n *\n * ```typescript\n * decreaseYear(new Date(2020, 0, 1), 1) // 2019\n * ```\n */\nexport const decreaseYear = (date: Date, years: number): number => year(date) - years;\n\nconst lookAhead = (iFormat: number, format: string, match: string, length = 2) => {\n  const increment = length - 1;\n  const followingCharacterMatches = format.charAt(iFormat + increment) === match;\n  const hasProperLength = iFormat + increment < format.length;\n  return hasProperLength && followingCharacterMatches;\n};\n\nconst formatNumber = (value, len) => {\n  let num = String(value);\n\n  while (num.length < len) {\n    num = '0' + num;\n  }\n\n  return num;\n};\n\nexport const formatDate = (date: Date, format: string) => {\n  if (!date) {\n    return '';\n  }\n\n  let output = '';\n\n  for (let iFormat = 0; iFormat < format.length; iFormat++) {\n    switch (format.charAt(iFormat)) {\n      case 'd':\n        if (lookAhead(iFormat, format, 'd')) {\n          output += formatNumber(date.getDate(), 2);\n          iFormat++;\n        } else {\n          output += String(date.getDate());\n        }\n        break;\n      case 'm':\n        if (lookAhead(iFormat, format, 'm')) {\n          output += formatNumber(date.getMonth() + 1, 2);\n          iFormat++;\n        } else {\n          output += String(date.getMonth() + 1);\n        }\n        break;\n      case 'y':\n        if (lookAhead(iFormat, format, 'y', 4)) {\n          iFormat += 3;\n          output += date.getFullYear();\n        } else {\n          output += (date.getFullYear() % 100 < 10 ? '0' : '') + (date.getFullYear() % 100);\n          iFormat++;\n        }\n        break;\n      case 'h':\n        if (lookAhead(iFormat, format, 'h')) {\n          output += formatNumber(date.getHours(), 2);\n          iFormat++;\n        } else {\n          output += String(date.getHours());\n        }\n        break;\n      case 'M':\n        if (lookAhead(iFormat, format, 'M')) {\n          output += formatNumber(date.getMinutes(), 2);\n          iFormat++;\n        } else {\n          output += String(date.getMinutes());\n        }\n        break;\n      case 's':\n        if (lookAhead(iFormat, format, 's')) {\n          output += formatNumber(date.getSeconds(), 2);\n          iFormat++;\n        } else {\n          output += String(date.getSeconds());\n        }\n        break;\n      default:\n        output += format.charAt(iFormat);\n    }\n  }\n  return output;\n};\n\nconst daylightSavingAdjust = (date): Date => {\n  if (!date) {\n    return null;\n  }\n\n  date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0);\n\n  return date;\n};\n\nconst getDaysCountInMonth = (month: number, year: number) =>\n  32 - daylightSavingAdjust(new Date(year, month, 32)).getDate();\n\nexport const parseDate = (value: any, format: string, locale: string): Date => {\n  if (format == null || value == null) {\n    throw 'Invalid arguments';\n  }\n\n  value = typeof value === 'object' ? value.toString() : value + '';\n  if (value === '') {\n    return null;\n  }\n\n  let iFormat;\n  let dim;\n  let extra;\n  let iValue = 0;\n  let shortYearCutoff = 100;\n  let year = -1;\n  let month = -1;\n  let day = -1;\n  let doy = -1;\n  let literal = false;\n  let date: Date;\n  let lookAhead = (match: string, len = 2) => {\n    const increment = len - 1;\n    let matches = iFormat + increment < format.length && format.charAt(iFormat + increment) === match;\n    if (matches) {\n      iFormat += increment;\n    }\n    return matches;\n  };\n  let getNumber = (match, len = 2) => {\n    let isDoubled = lookAhead(match, len),\n      size = match === '@' ? 14 : match === '!' ? 20 : match === 'y' && isDoubled ? 4 : match === 'o' ? 3 : 2,\n      minSize = match === 'y' ? size : 1,\n      digits = new RegExp('^\\\\d{' + minSize + ',' + size + '}'),\n      num = value.substring(iValue).match(digits);\n    if (!num) {\n      throw 'Missing number at position ' + iValue;\n    }\n    iValue += num[0].length;\n    return parseInt(num[0], 10);\n  };\n  let getName = (match, shortNames, longNames) => {\n    let index = -1;\n    let arr = lookAhead(match) ? longNames : shortNames;\n    let names = [];\n\n    for (let i = 0; i < arr.length; i++) {\n      names.push([i, arr[i]]);\n    }\n    names.sort((a, b) => {\n      return -(a[1].length - b[1].length);\n    });\n\n    for (let i = 0; i < names.length; i++) {\n      let name = names[i][1];\n      if (value.substr(iValue, name.length).toLowerCase() === name.toLowerCase()) {\n        index = names[i][0];\n        iValue += name.length;\n        break;\n      }\n    }\n\n    if (index !== -1) {\n      return index + 1;\n    } else {\n      throw 'Unknown name at position ' + iValue;\n    }\n  };\n  let checkLiteral = () => {\n    if (value.charAt(iValue) !== format.charAt(iFormat)) {\n      throw 'Unexpected literal at position ' + iValue;\n    }\n    iValue++;\n  };\n\n  for (iFormat = 0; iFormat < format.length; iFormat++) {\n    if (literal) {\n      if (format.charAt(iFormat) === \"'\" && !lookAhead(\"'\")) {\n        literal = false;\n      } else {\n        checkLiteral();\n      }\n    } else {\n      switch (format.charAt(iFormat)) {\n        case 'd':\n          day = getNumber('d');\n          break;\n        case 'D':\n          getName('D', i18nDate[locale].weekdaysShort, i18nDate[locale].weekdays);\n          break;\n        case 'm':\n          month = getNumber('m');\n          break;\n        case 'M':\n          month = getName('M', i18nDate[locale].monthsShort, i18nDate[locale].months);\n          break;\n        case 'y':\n          year = getNumber('y', 4);\n          break;\n        default:\n          checkLiteral();\n      }\n    }\n  }\n\n  if (iValue < value.length) {\n    extra = value.substr(iValue);\n    if (!/^\\s+/.test(extra)) {\n      throw 'Extra/unparsed characters found in date: ' + extra;\n    }\n  }\n\n  if (year === -1) {\n    year = new Date().getFullYear();\n  } else if (year < 100) {\n    year += new Date().getFullYear() - (new Date().getFullYear() % 100) + (year <= shortYearCutoff ? 0 : -100);\n  }\n\n  if (doy > -1) {\n    month = 1;\n    day = doy;\n    do {\n      dim = getDaysCountInMonth(year, month - 1);\n      if (day <= dim) {\n        break;\n      }\n      month++;\n      day -= dim;\n    } while (true);\n  }\n\n  date = daylightSavingAdjust(new Date(year, month - 1, day));\n  if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) {\n    throw 'Invalid date'; // E.g. 31/02/00\n  }\n\n  return date;\n};\n\nconst FORMATTING_TOKENS = /(\\[[^\\[]*\\])|(mm|dd|yyyy|yy|hh|MM|ss|.)/g;\n\nconst TWO_NUMERICS_REGEX = /\\d\\d/; // 00 - 99\nconst FOUR_NUMERICS_REGEX = /\\d{4}/; // 0000 - 9999\nconst NON_NUMERIC_REGEX = /[^0-9]/g;\n\nconst YEAR = 'year';\nconst MONTH = 'month';\nconst DAY = 'day';\nconst HOUR = 'hour';\nconst MINUTE = 'minute';\nconst SECOND = 'second';\n\ninterface ParseFlagMark {\n  year: number;\n  month: number;\n  day: number;\n  hour: number;\n  minute: number;\n  second: number;\n  date: Date;\n}\n\ntype ParseFlagCallBackReturn = any;\n\ntype ParseFlagRegExp = RegExp | ((locale: any) => RegExp);\ntype ParseFlagCallBack = (input: string) => ParseFlagCallBackReturn;\n\ninterface ParseFlag {\n  [key: string]: [ParseFlagRegExp, ParseFlagCallBack];\n}\n\nconst parseFlags: ParseFlag = {};\n\nconst addParseFlag = (token: string | string[], regex: ParseFlagRegExp, callback) => {\n  const tokens = Array.isArray(token) ? token : [token];\n  let func: ParseFlagCallBack;\n  if (typeof callback === 'string') {\n    func = (input) => {\n      const value = parseInt(input, 10);\n      return { [callback]: value };\n    };\n  } else {\n    func = callback;\n  }\n  tokens.forEach((key) => {\n    parseFlags[key] = [regex, func];\n  });\n};\n\naddParseFlag('yy', TWO_NUMERICS_REGEX, (input) => {\n  const year = new Date().getFullYear();\n  const cent = Math.floor(year / 100);\n  let value = parseInt(input, 10);\n  value = (value > 68 ? cent - 1 : cent) * 100 + value;\n  return { [YEAR]: value };\n});\naddParseFlag('yyyy', FOUR_NUMERICS_REGEX, YEAR);\naddParseFlag('mm', TWO_NUMERICS_REGEX, (input) => ({ [MONTH]: parseInt(input, 10) - 1 }));\naddParseFlag('dd', TWO_NUMERICS_REGEX, DAY);\naddParseFlag('hh', TWO_NUMERICS_REGEX, HOUR);\naddParseFlag('MM', TWO_NUMERICS_REGEX, MINUTE);\naddParseFlag('ss', TWO_NUMERICS_REGEX, SECOND);\n\ntype DateArgs = [number, number, number, number, number, number];\n\nconst getFullInputArray = (input: Array<number | undefined>, backupDate = new Date()) => {\n  const result: DateArgs = [0, 0, 1, 0, 0, 0];\n  const backupArr = [\n    backupDate.getFullYear(),\n    backupDate.getMonth(),\n    backupDate.getDate(),\n    backupDate.getHours(),\n    backupDate.getMinutes(),\n    backupDate.getSeconds(),\n  ];\n\n  let useBackup = true;\n  for (let i = 0; i < 7; i++) {\n    if (input[i] === undefined) {\n      result[i] = useBackup ? backupArr[i] : result[i];\n    } else {\n      result[i] = input[i]!;\n      useBackup = false;\n    }\n  }\n  return result;\n};\n\nconst createDate = (year: number, month: number, day: number, hour: number, minute: number, second: number) => {\n  if (!(year < 100 && year >= 0)) {\n    return new Date(year, month, day, hour, minute, second);\n  }\n\n  const date = new Date(year + 400, month, day, hour, minute, second);\n  if (isFinite(date.getFullYear())) {\n    date.setFullYear(year);\n  }\n  return date;\n};\n\nconst makeParser = (dateString: string, format: string) => {\n  const tokens = format.match(FORMATTING_TOKENS);\n  if (!tokens) {\n    throw new Error();\n  }\n  const { length } = tokens;\n  let mark: Partial<ParseFlagMark> = {};\n  for (let i = 0; i < length; i += 1) {\n    const token = tokens[i];\n    const parseTo = parseFlags[token];\n    if (!parseTo) {\n      const word = token.replace(/^\\[|\\]$/g, '');\n      if (dateString.indexOf(word) === 0) {\n        dateString = dateString.substr(word.length);\n      } else {\n        throw new Error('not match');\n      }\n    } else {\n      const regex = parseTo[0] as RegExp;\n      const parser = parseTo[1];\n      const value = (regex.exec(dateString) || [])[0];\n      const obj = parser(value);\n      mark = { ...mark, ...obj };\n      dateString = dateString.replace(value, '');\n    }\n  }\n  return mark;\n};\n\nconst getCleanDateString = (dirtyDateString: string, format: string) => {\n  if (dirtyDateString.length === format.length) {\n    return dirtyDateString;\n  }\n\n  const separator = dirtyDateString.match(NON_NUMERIC_REGEX)[0];\n\n  // pad signle digits to follow supported dateformats\n  return dirtyDateString\n    .split(separator)\n    .map((s) => (s.length === 1 ? '0' + s : s))\n    .join(separator);\n};\n\nconst getDateParts = (dirtyDateString: string, format: string) => {\n  const dateString = getCleanDateString(dirtyDateString, format);\n\n  return makeParser(dateString, format);\n};\n\nexport const toDate = (dirtyDateString: string, format: string) => {\n  try {\n    const { backupDate = new Date() } = {};\n    const { year, month, day, hour, minute, second, date } = getDateParts(dirtyDateString, format);\n\n    if (date) {\n      return date;\n    }\n\n    const inputArray = [year, month, day, hour, minute, second];\n\n    let parsedDate: Date;\n\n    const result = getFullInputArray(inputArray, backupDate);\n\n    parsedDate = createDate(...result);\n\n    return parsedDate;\n  } catch (e) {\n    return new Date(NaN);\n  }\n};\n\nexport interface PointerDate {\n  year: number;\n  month: number;\n  day: number;\n  hours: number;\n  minutes: number;\n  seconds: number;\n}\n\nexport interface CalendarGridArgs {\n  firstDateOfBox: Date;\n  minDate: Date;\n  dateFormat: SixDateFormats;\n  pointerDate: { month: number; year: number; day: number };\n  allowedDates: (date: Date) => boolean;\n  maxDate: Date;\n  locale: 'en' | 'de' | 'fr' | 'it';\n  selectedDate: Date;\n}\n\nexport const createCalendarGrid = (calendarGridArguments: CalendarGridArgs) => {\n  const { firstDateOfBox, allowedDates, dateFormat, selectedDate, minDate, maxDate, pointerDate } =\n    calendarGridArguments;\n\n  const weekDatePointer = new Date(firstDateOfBox);\n  const dayDatePointer = new Date(firstDateOfBox);\n\n  let calendar: CalendarCell[][] = [];\n\n  do {\n    let row: CalendarCell[] = [];\n    do {\n      row = [\n        ...row,\n        {\n          date: new Date(dayDatePointer),\n          display: formatDate(dayDatePointer, dateFormat),\n          dateString: formatDate(dayDatePointer, dateFormat),\n          label: day(dayDatePointer).toString(),\n          isToday: isSameDay(dayDatePointer, now()),\n          isSelected: selectedDate && isSameDay(dayDatePointer, selectedDate),\n          isDisabled: !allowedDates(dayDatePointer) || !isInRange(dayDatePointer, minDate, maxDate),\n          isOutdated: pointerDate.month !== dayDatePointer.getMonth() || !isInRange(dayDatePointer, minDate, maxDate),\n        },\n      ];\n      dayDatePointer.setDate(dayDatePointer.getDate() + 1);\n    } while (isSameWeek(dayDatePointer, weekDatePointer));\n    calendar = [...calendar, row];\n    weekDatePointer.setDate(weekDatePointer.getDate() + 7);\n  } while (isSameMonth(new Date(pointerDate.year, pointerDate.month, pointerDate.day), dayDatePointer));\n  return calendar;\n};\n","export enum SixDateFormats {\n  DDMMYYY_DOT = 'dd.mm.yyyy',\n  YYYYMMDD_DASH = 'yyyy-mm-dd',\n  DDMMYYYY_DASH = 'dd-mm-yyyy',\n  DDMMYYYY_SLASH = 'dd/mm/yyyy',\n  YYYYMMDD_SLASH = 'yyyy/mm/dd',\n  DDMMYY_DOT = 'dd.mm.yy',\n  YYMMDD_DASH = 'yy-mm-dd',\n  DDMMYY_DASH = 'dd-mm-yy',\n  DDMMYY_SLASH = 'dd/mm/yy',\n  YYMMDD_SLASH = 'yy/mm/dd',\n\n  DDMMYYY_DOT_TIME = 'dd.mm.yyyy hh:MM:ss',\n  YYYYMMDD_DASH_TIME = 'yyyy-mm-dd hh:MM:ss',\n  DDMMYYYY_DASH_TIME = 'dd-mm-yyyy hh:MM:ss',\n  DDMMYYYY_SLASH_TIME = 'dd/mm/yyyy hh:MM:ss',\n  YYYYMMDD_SLASH_TIME = 'yyyy/mm/dd hh:MM:ss',\n  DDMMYY_DOT_TIME = 'dd.mm.yy hh:MM:ss',\n  YYMMDD_DASH_TIME = 'yy-mm-dd hh:MM:ss',\n  DDMMYY_DASH_TIME = 'dd-mm-yy hh:MM:ss',\n  DDMMYY_SLASH_TIME = 'dd/mm/yy hh:MM:ss',\n  YYMMDD_SLASH_TIME = 'yy/mm/dd hh:MM:ss',\n}\n","import { h } from '@stencil/core';\nimport { now } from '../../../utils/date-util';\n\nexport const MonthSelection = ({ locale, selectedDate, onClickMonthCell }) => {\n  const isToday = (value: string) => locale.monthsShort[now().getMonth()] === value;\n\n  const isSelectedMonth = (value: string) =>\n    selectedDate?.getMonth() === locale.monthsShort.findIndex((m) => m === value);\n\n  return (\n    <table class=\"datepicker-table\" part=\"month-selection\">\n      <tbody>\n        {locale.monthsShortGrouped.map((row) => (\n          <tr class=\"datepicker-table__row\">\n            {row.map((month) => (\n              <td\n                onClick={() => onClickMonthCell(month)}\n                class={{\n                  'datepicker-table__cell': true,\n                  'datepicker-table__cell--is-today': isToday(month),\n                  'datepicker-table__cell--is-selected': isSelectedMonth(month),\n                }}\n              >\n                {month}\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n","import { h } from '@stencil/core';\n\nexport const DaySelection = ({ locale, calendarGrid, onClickDateCell }) => {\n  return (\n    <table class=\"datepicker-table\" part=\"day-selection\">\n      <thead part=\"weekday-header\">\n        {locale.weekdaysMin.map((weekday) => (\n          <th class=\"datepicker__cell\">{weekday}</th>\n        ))}\n      </thead>\n      <tbody>\n        {calendarGrid.map((row) => (\n          <tr class=\"datepicker-table__row\">\n            {row.map((cell) => (\n              <td\n                data-date={cell.dateString}\n                onClick={() => onClickDateCell(cell)}\n                class={{\n                  'datepicker-table__cell': true,\n                  'datepicker-table__cell--is-today': cell.isToday,\n                  'datepicker-table__cell--is-selected': cell.isSelected,\n                  'datepicker-table__cell--is-outdated': cell.isOutdated,\n                  'datepicker-table__cell--is-disabled': cell.isDisabled,\n                  'datepicker-table__cell--is-selectable': !cell.isDisabled,\n                }}\n              >\n                {cell.label}\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n","import { now } from '../../../utils/date-util';\nimport { h } from '@stencil/core';\n\nexport const YearSelection = ({ selectedDate, yearSelection, onClickYearCell }) => {\n  return (\n    <table class=\"datepicker-table\" part=\"year-selection\">\n      <tbody>\n        {yearSelection.map((row) => (\n          <tr class=\"datepicker-table__row\">\n            {row.map((year) => (\n              <td\n                onClick={() => onClickYearCell(year)}\n                class={{\n                  'datepicker-table__cell': true,\n                  'datepicker-table__cell--is-today': now().getFullYear() === year,\n                  'datepicker-table__cell--is-selected': selectedDate?.getFullYear() === year,\n                }}\n              >\n                {year}\n              </td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n","@import 'src/global/component';\n\n:host {\n  display: block;\n  font-family: var(--six-font-family);\n}\n\n.datepicker {\n  &__container {\n    position: relative;\n  }\n\n  &__popup {\n    min-width: 400px;\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      // fix problem where you would need to jump around with the cursor when switching months and\n      // its a dropup since not all months have the same height\n      min-height: 382px;\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\n.datepicker-header {\n  display: flex;\n  justify-content: space-between;\n  border-bottom: 1px solid var(--six-color-web-rock-400);\n  padding: 0.5em;\n  margin-bottom: 1em;\n\n  & svg {\n    fill: var(--six-color-web-rock-900);\n    stroke: none;\n  }\n\n  &__btn {\n    cursor: pointer;\n    width: 2.5em;\n    height: 2.5em;\n    display: flex;\n    vertical-align: middle;\n    align-items: center;\n    justify-content: center;\n\n    &:hover {\n      background-color: var(--six-color-web-rock-100);\n      border-radius: 100%;\n    }\n  }\n\n  &__label {\n    display: flex;\n\n    & > div {\n      cursor: pointer;\n      padding: 0.5em;\n      display: flex;\n      vertical-align: middle;\n      align-items: center;\n      justify-content: center;\n\n      &:hover {\n        background-color: var(--six-color-web-rock-100);\n      }\n    }\n  }\n}\n\n.datepicker-table {\n  width: 100%;\n\n  &__cell {\n    text-align: center;\n    width: 2.5rem;\n    height: 2.5rem;\n    cursor: pointer;\n\n    &:hover {\n      background-color: var(--six-table-row-background-color-hover);\n    }\n\n    &--is-today {\n      border: 1px solid var(--six-color-web-rock-400);\n    }\n\n    &--is-selected {\n      background-color: var(--six-color-red);\n      color: var(--six-color-white);\n    }\n\n    &--is-disabled {\n      background-color: var(--six-color-web-rock-200);\n      cursor: initial;\n\n      &:hover {\n        background-color: var(--six-color-web-rock-200);\n      }\n    }\n\n    &--is-outdated {\n      color: var(--six-color-web-rock-400);\n    }\n  }\n}\n\n// Clearable\n.datepicker-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.input--empty .datepicker-clear {\n  visibility: hidden;\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\n// time-picker\nsix-timepicker::part(popup) {\n  border: none;\n  padding: 0.5em 0.5em 0;\n  min-height: 0;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Method, Prop, State, Watch } from '@stencil/core';\nimport {\n  createCalendarGrid,\n  day,\n  formatDate,\n  getFirstDayOfTheWeek,\n  hours,\n  i18nDate,\n  isValidDate,\n  isValidDateString,\n  minutes,\n  month,\n  now,\n  PointerDate,\n  seconds,\n  toDate,\n  year,\n} from '../../utils/date-util';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { isNil } from '../../utils/type-check';\nimport { debounce, debounceEvent, DEFAULT_DEBOUNCE_FAST } from '../../utils/execution-control';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { SixDateFormats } from './six-date-formats';\nimport { MonthSelection } from './components/month-selection';\nimport { DaySelection } from './components/day-selection';\nimport { YearSelection } from './components/year-selection';\nimport { SixTimepickerChange } from '../six-timepicker/six-timepicker';\nimport { SixTimePropertyName } from '../six-timepicker/six-timepicker.types';\n\nconst NUMBER_OF_YEARS_SHOWN = 25;\n\nconst MIN_POPUP_HEIGHT = 400;\n\nexport type SixDatepickerSelectPayload = Date | undefined | null;\n\nexport interface CalendarCell {\n  date: Date;\n  dateString: string;\n  display: string;\n  isDisabled: boolean;\n  isOutdated: boolean;\n  isSelected: boolean;\n  isToday: boolean;\n  label: string;\n}\n\nenum SelectionMode {\n  DAY = 'day',\n  MONTH = 'month',\n  YEAR = 'year',\n}\n\nconst getYearSelectionAroundYear = (year: number): number[][] => {\n  const numberOfElementsPerRow = 5;\n  return Array.from(new Array(NUMBER_OF_YEARS_SHOWN).keys())\n    .map((n) => n + year - Math.floor(NUMBER_OF_YEARS_SHOWN / 2))\n    .reduce((curr, item, index) => {\n      if (index % numberOfElementsPerRow === 0) {\n        curr.push([]);\n      }\n\n      curr[curr.length - 1].push(item);\n\n      return curr;\n    }, []);\n};\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define a footer for the date picker.\n */\n@Component({\n  tag: 'six-datepicker',\n  styleUrl: 'six-datepicker.scss',\n  shadow: true,\n})\nexport class SixDatepicker {\n  private readonly eventListeners = new EventListeners();\n\n  private inputElement: HTMLSixInputElement;\n\n  private popup: HTMLElement;\n\n  private wrapper: HTMLElement;\n\n  @Element()\n  readonly host: HTMLSixDatepickerElement;\n\n  private selectedDate: Date | null = null;\n\n  @State() private pointerDate = SixDatepicker.getCurrentDateAsPointer();\n  @State() selectionMode: SelectionMode = SelectionMode.DAY;\n  @State() isDropDownContentUp = false;\n\n  /**\n   * Set the type.\n   */\n  @Prop() type: 'date' | 'date-time' = 'date';\n\n  /**\n   * The language used to render the weekdays and months.\n   */\n  @Prop() locale: 'en' | 'de' | 'fr' | 'it' = 'en';\n\n  /** Indicates whether or not the calendar 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 calendar 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 date via the component in the popup, 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   * Callback to determine which date in the datepicker should be selectable.\n   * the callback function will get a datestring as an argument, e.g. '2021-07-04'\n   *\n   * Usage e.g.:\n   * const datepicker = document.getElementById('allowed-date-picker');\n   * datepicker.allowedDates = datestring => parseInt(datestring.split('-')[2], 10) % 2 === 0;\n   */\n  @Prop() allowedDates: (date: Date) => boolean = () => true;\n\n  /**\n   * The minimum datetime allowed. Value must be a date object\n   */\n  @Prop() min?: Date | null = null;\n\n  /**\n   * The maximum datetime allowed. Value must be a date object\n   */\n  @Prop() max?: Date | null = null;\n\n  /**\n   * Closes the datepicker dropdown after selection\n   */\n  @Prop() closeOnSelect = this.type === 'date';\n\n  /**\n   * The enforced placement of the dropdown panel.\n   */\n  @Prop() placement: 'top' | 'bottom';\n\n  /** Datepicker 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 date to defines where the datepicker popup starts. The prop accepts ISO 8601 date strings (YYYY-MM-DD).\n   */\n  @Prop() defaultDate?: string | null;\n\n  /**\n   * The placeholder defines what text to be shown on the input element\n   */\n  @Prop() placeholder?: string | null;\n\n  /**\n   * The value of the form field, which accepts a date object.\n   */\n  @Prop({ mutable: true }) value?: Date | null = null;\n\n  /** The dropdown will close when the user interacts outside of this element (e.g. clicking). */\n  @Prop() containingElement: HTMLElement;\n\n  /** Define the dateFormat. Valid formats are:\n   * 'dd.mm.yyyy'\n   * 'yyyy-mm-dd'\n   * 'dd-mm-yyyy'\n   * 'dd/mm/yyyy'\n   * 'yyyy/mm/dd'\n   * 'dd.mm.yy'\n   * 'yy-mm-dd'\n   * 'dd-mm-yy'\n   * 'dd/mm/yy'\n   * 'yy/mm/dd'\n   * */\n  @Prop() dateFormat: SixDateFormats = SixDateFormats.DDMMYYY_DOT;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `dateChange` event after each keystroke.\n   */\n  @Prop() debounce = DEFAULT_DEBOUNCE_FAST;\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  @Watch('debounce')\n  protected debounceChanged() {\n    this.sixSelect = debounceEvent(this.sixSelect, this.debounce);\n  }\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n  protected valueChanged() {\n    // map unreadable values to undefined to make the datepicker fault-tolerant\n    if (this.isValidValue()) {\n      console.warn('Encountered unreadable date, will map to undefined. Received value', this.value);\n      this.value = undefined;\n      return;\n    }\n\n    this.selectedDate = this.value;\n    this.updatePointerDates();\n    this.sixSelect.emit(this.value);\n  }\n\n  /**\n   * Emitted when a option got selected.\n   */\n  @Event({ eventName: 'six-datepicker-select' }) sixSelect: EventEmitter<SixDatepickerSelectPayload>;\n\n  /**\n   * Emitted when the clear button is activated.\n   */\n  @Event({ eventName: 'six-datepicker-clear' }) sixClear: EventEmitter<EmptyPayload>;\n\n  /**\n   * Emitted when a option got selected.\n   */\n  @Event({ eventName: 'six-datepicker-blur' }) sixBlur: EventEmitter<SixDatepickerSelectPayload>;\n\n  @Listen('resize', { target: 'window' })\n  async resizeHandler() {\n    this.calcIsDropDownContentUp();\n    this.moveOpenHoistedPopup();\n    this.adjustPopupPosition();\n  }\n\n  @Listen('scroll', { target: 'window' })\n  async scrollHandler() {\n    this.calcIsDropDownContentUp();\n    this.moveOpenHoistedPopup();\n  }\n\n  private defaultValue: Date = null;\n\n  get container() {\n    return this.containingElement || this.host;\n  }\n\n  get firstDateOfBox(): Date {\n    const date = new Date(this.pointerDate.year, this.pointerDate.month, 1);\n    return getFirstDayOfTheWeek(date);\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.value = this.defaultValue;\n    this.inputElement.value = formatDate(this.defaultValue, this.dateFormat);\n    await this.inputElement.reset();\n  }\n\n  private isValidValue() {\n    if (this.value === undefined || this.value === null) {\n      return false;\n    }\n\n    if (!(this.value instanceof Date)) {\n      return true;\n    }\n\n    return this.value instanceof Date && isNaN(this.value as any);\n  }\n\n  get calendarGrid() {\n    return createCalendarGrid({\n      firstDateOfBox: this.firstDateOfBox,\n      allowedDates: this.allowedDates,\n      dateFormat: this.dateFormat,\n      locale: this.locale,\n      selectedDate: this.selectedDate,\n      minDate: this.min,\n      maxDate: this.max,\n      pointerDate: this.pointerDate,\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  private getMonthStringForIndex(index: number) {\n    return i18nDate[this.locale].months[index];\n  }\n\n  private previousUnit() {\n    if (this.selectionMode === SelectionMode.DAY) {\n      this.previousMonth();\n    } else if (this.selectionMode === SelectionMode.MONTH) {\n      this.previousYear();\n    } else if (this.selectionMode === SelectionMode.YEAR) {\n      this.previousYearGroup();\n    }\n  }\n\n  private previousYear() {\n    this.pointerDate = { ...this.pointerDate, year: this.pointerDate.year - 1 };\n  }\n\n  private previousYearGroup() {\n    this.pointerDate = { ...this.pointerDate, year: this.pointerDate.year - NUMBER_OF_YEARS_SHOWN };\n  }\n\n  private previousMonth() {\n    if (this.pointerDate.month === 0) {\n      this.pointerDate = { year: this.pointerDate.year - 1, month: 11, day: 1, hours: 0, minutes: 0, seconds: 0 };\n    } else {\n      this.pointerDate = {\n        year: this.pointerDate.year,\n        month: this.pointerDate.month - 1,\n        day: 1,\n        hours: 0,\n        minutes: 0,\n        seconds: 0,\n      };\n    }\n  }\n\n  private nextUnit() {\n    if (this.selectionMode === SelectionMode.DAY) {\n      this.nextMonth();\n    } else if (this.selectionMode === SelectionMode.MONTH) {\n      this.nextYear();\n    } else if (this.selectionMode === SelectionMode.YEAR) {\n      this.nextYearGroup();\n    }\n  }\n\n  private nextMonth() {\n    if (this.pointerDate.month === 11) {\n      this.pointerDate = { year: this.pointerDate.year + 1, month: 0, day: 1, hours: 0, minutes: 0, seconds: 0 };\n    } else {\n      this.pointerDate = {\n        year: this.pointerDate.year,\n        month: this.pointerDate.month + 1,\n        day: 1,\n        hours: 0,\n        minutes: 0,\n        seconds: 0,\n      };\n    }\n  }\n\n  private nextYear() {\n    this.pointerDate = { ...this.pointerDate, year: this.pointerDate.year + 1 };\n  }\n\n  private nextYearGroup() {\n    this.pointerDate = { ...this.pointerDate, year: this.pointerDate.year + NUMBER_OF_YEARS_SHOWN };\n  }\n\n  openCalendar() {\n    if (!this.open && !this.disabled) {\n      this.open = true;\n      this.setupEventListenersForOpenPopup();\n    }\n  }\n\n  private setupEventListenersForOpenPopup() {\n    this.eventListeners.add(document, 'keydown', this.handleDocumentKeyDown);\n    this.eventListeners.add(document, 'mousedown', this.handleDocumentMouseDown);\n  }\n\n  handleDocumentKeyDown = (event: KeyboardEvent) => {\n    // Close when escape is pressed\n    if (this.open && event.key === 'Escape') {\n      event.stopPropagation();\n      this.closePopup();\n      void this.inputElement.setFocus();\n    }\n\n    // Handle tabbing\n    if (event.key === 'Tab') {\n      this.closePopup();\n    }\n  };\n\n  handleDocumentMouseDown = (event: MouseEvent) => {\n    // Close when clicking outside of the containing element\n    const path = event.composedPath() as EventTarget[];\n    if (!path.includes(this.container)) {\n      this.closePopup();\n      return;\n    }\n  };\n\n  handleClearClick(event: MouseEvent) {\n    event.stopPropagation();\n    void this.select(undefined);\n    this.sixClear.emit();\n  }\n\n  private closePopup() {\n    if (this.inline) {\n      return;\n    }\n\n    this.open = false;\n    this.eventListeners.remove(document, 'keydown', this.handleDocumentKeyDown);\n    this.eventListeners.remove(document, 'mousedown', this.handleDocumentMouseDown);\n    this.selectionMode = SelectionMode.DAY;\n  }\n\n  private updatePointerDates() {\n    const date = this.getPointerDate();\n    if (this.differsFromPointerDate(date)) {\n      this.pointerDate = {\n        year: year(date),\n        month: month(date),\n        day: day(date),\n        hours: hours(date),\n        minutes: minutes(date),\n        seconds: seconds(date),\n      };\n    }\n  }\n\n  private differsFromPointerDate(date: Date): boolean {\n    return (\n      this.pointerDate.day !== day(date) ||\n      this.pointerDate.month !== month(date) ||\n      this.pointerDate.year !== year(date) ||\n      this.pointerDate.hours !== hours(date) ||\n      this.pointerDate.minutes !== minutes(date) ||\n      this.pointerDate.seconds !== seconds(date)\n    );\n  }\n\n  private getPointerDate() {\n    if (this.selectedDate !== undefined && this.selectedDate !== null) {\n      return this.selectedDate;\n    }\n\n    if (isNil(this.defaultDate)) {\n      return now();\n    } else {\n      return this.defaultDate && toDate(this.defaultDate, this.dateFormat);\n    }\n  }\n\n  private updateValue(newDate: Date | undefined | null) {\n    this.displayCustomMessage(true);\n    this.updateIfChanged(newDate);\n  }\n\n  updateIfChanged(newDate: Date) {\n    if (this.value?.getTime() === newDate?.getTime()) {\n      return;\n    }\n\n    this.value = newDate;\n  }\n\n  /**\n   * Selects an option\n   */\n  @Method()\n  async select(datestring: string) {\n    if (!datestring) {\n      this.updateValue(undefined);\n    } else {\n      const newDate = toDate(datestring, this.dateFormat);\n      newDate.setHours(this.pointerDate.hours, this.pointerDate.minutes, this.pointerDate.seconds);\n      this.updateValue(newDate);\n    }\n\n    this.updatePointerDates();\n\n    if (this.closeOnSelect) {\n      this.closePopup();\n    }\n  }\n\n  onTimepickerChange = (sixTimepickerChange: CustomEvent<SixTimepickerChange>) => {\n    const time = sixTimepickerChange.detail.value;\n    const newDate = new Date();\n\n    if (this.selectedDate) {\n      newDate.setFullYear(this.selectedDate.getFullYear(), this.selectedDate.getMonth(), this.selectedDate.getDate());\n    }\n\n    newDate.setHours(\n      time[SixTimePropertyName.HOURS],\n      time[SixTimePropertyName.MINUTES],\n      time[SixTimePropertyName.SECONDS]\n    );\n\n    this.updateValue(newDate);\n    this.updatePointerDates();\n  };\n\n  onClickDateCell = (cell: CalendarCell) => {\n    if (!cell.isDisabled) {\n      void this.select(cell.dateString);\n    }\n  };\n\n  onClickMonthCell = (selectedMonth: string) => {\n    const month = i18nDate[this.locale].monthsShort.findIndex((monthShort) => monthShort === selectedMonth);\n    this.pointerDate = { ...this.pointerDate, month };\n    this.selectionMode = SelectionMode.DAY;\n  };\n\n  onClickYearCell = (year: number) => {\n    this.pointerDate = { ...this.pointerDate, year };\n    this.selectionMode = SelectionMode.DAY;\n  };\n\n  handleInputChange = (event: Event) => {\n    const inputValue = this.inputElement.value;\n\n    if (!isValidDateString(inputValue, this.dateFormat)) {\n      return;\n    }\n\n    const inputValueDate = toDate(inputValue, this.dateFormat);\n\n    if (inputValueDate === undefined) {\n      return;\n    }\n\n    if (this.min && this.min.getTime() > inputValueDate.getTime()) {\n      return;\n    }\n\n    if (this.max && this.max.getTime() < inputValueDate.getTime()) {\n      return;\n    }\n\n    this.updateIfChanged(inputValueDate);\n    event.stopPropagation();\n\n    const datesOnly = inputValue.replace(/[^\\d]/g, '');\n\n    let isDateValid = !inputValue;\n\n    if (inputValue && datesOnly.length >= 6) {\n      const date = toDate(inputValue, this.dateFormat);\n      const datestring = formatDate(date, this.dateFormat);\n      if (isValidDateString(datestring, this.dateFormat)) {\n        this.selectedDate = toDate(datestring, this.dateFormat);\n        this.updatePointerDates();\n        this.updateValue(this.selectedDate);\n        isDateValid = true;\n      }\n    }\n    this.displayCustomMessage(isDateValid);\n  };\n\n  handleOnBlur = (event: Event) => {\n    // clear the value if the user deleted the date\n    if (this.inputElement.value === '' && isValidDate(this.value)) {\n      this.value = undefined;\n    }\n\n    event.stopPropagation();\n    const inputValue = this.inputElement.value;\n    const inputValueDate = toDate(inputValue, this.dateFormat);\n    const formattedDate = formatDate(this.value, this.dateFormat);\n\n    if (inputValueDate && inputValue !== formattedDate) {\n      // properly format date if necessary\n      this.inputElement.value = formattedDate;\n    }\n\n    this.sixBlur.emit(this.value);\n  };\n\n  componentWillLoad() {\n    this.validateProps();\n\n    this.defaultValue = this.value;\n    this.selectedDate = this.value;\n    this.updatePointerDates();\n    this.updateValue(this.value);\n\n    if (this.inline) {\n      this.open = true;\n    }\n\n    if (this.open) {\n      this.setupEventListenersForOpenPopup();\n    }\n  }\n\n  private validateProps() {\n    if (this.value !== null && this.value !== undefined && !(this.value instanceof Date)) {\n      throw new Error('Datepicker no longer supports strings as value. Use a date object instead!');\n    }\n\n    if (this.min !== null && this.min !== undefined && !(this.min instanceof Date)) {\n      throw new Error('Datepicker no longer supports strings as min. Use a date object instead!');\n    }\n\n    if (this.max !== null && this.max !== undefined && !(this.max instanceof Date)) {\n      throw new Error('Datepicker no longer supports strings as min. Use a date object instead!');\n    }\n  }\n\n  componentDidLoad() {\n    this.eventListeners.add(this.inputElement, 'six-input-input', debounce(this.handleInputChange, this.debounce));\n    this.eventListeners.add(this.inputElement, 'six-input-blur', this.handleOnBlur);\n  }\n\n  renderHeader() {\n    return (\n      <header class=\"datepicker-header\" part=\"header\">\n        <div class=\"datepicker-header__btn prev\" onClick={() => this.previousUnit()}>\n          <svg viewBox=\"0 5 13 13\" width=\"14\" height=\"23\">\n            <path d=\"M11.67 3.87L9.9 2.1 0 12l9.9 9.9 1.77-1.77L3.54 12z\" />\n          </svg>\n        </div>\n\n        <div class=\"datepicker-header__label\">\n          {this.selectionMode === SelectionMode.DAY && (\n            <div onClick={() => (this.selectionMode = SelectionMode.MONTH)}>\n              <span class=\"datepicker-header__label-month\">{this.getMonthStringForIndex(this.pointerDate.month)}</span>\n              <span>\n                <svg viewBox=\"-3 -4 24 24\" width=\"20\" height=\"20\">\n                  <polyline points=\"6 9 12 15 18 9\" />\n                </svg>\n              </span>\n            </div>\n          )}\n\n          {this.selectionMode !== SelectionMode.YEAR && (\n            <div onClick={() => (this.selectionMode = SelectionMode.YEAR)}>\n              <span class=\"datepicker-header__label-year\">{this.pointerDate.year}</span>\n              <span>\n                <svg viewBox=\"-3 -4 24 24\" width=\"20\" height=\"20\">\n                  <polyline points=\"6 9 12 15 18 9\" />\n                </svg>\n              </span>\n            </div>\n          )}\n\n          {this.selectionMode === SelectionMode.YEAR && (\n            <div>\n              {this.pointerDate.year - Math.floor(NUMBER_OF_YEARS_SHOWN / 2)} –{' '}\n              {this.pointerDate.year + Math.floor(NUMBER_OF_YEARS_SHOWN / 2)}\n            </div>\n          )}\n        </div>\n\n        <div class=\"datepicker-header__btn next\" onClick={() => this.nextUnit()}>\n          <svg viewBox=\"5 5 13 13\" width=\"14\" height=\"23\">\n            <path d=\"M5.88 4.12L13.76 12l-7.88 7.88L8 22l10-10L8 2z\" />\n          </svg>\n        </div>\n      </header>\n    );\n  }\n\n  renderBody() {\n    switch (this.selectionMode) {\n      case SelectionMode.DAY:\n        return (\n          <DaySelection\n            locale={i18nDate[this.locale]}\n            calendarGrid={this.calendarGrid}\n            onClickDateCell={this.onClickDateCell}\n          />\n        );\n      case SelectionMode.MONTH:\n        return (\n          <MonthSelection\n            locale={i18nDate[this.locale]}\n            selectedDate={this.selectedDate}\n            onClickMonthCell={this.onClickMonthCell}\n          />\n        );\n      case SelectionMode.YEAR:\n        return (\n          <YearSelection\n            selectedDate={this.selectedDate}\n            yearSelection={getYearSelectionAroundYear(this.pointerDate.year)}\n            onClickYearCell={this.onClickYearCell}\n          />\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}>today</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 renderClearable() {\n    return (\n      this.clearable && (\n        <button\n          slot=\"suffix\"\n          class={{\n            'datepicker-clear': true,\n            'datepicker-clear--right': this.iconPosition === 'left',\n            'datepicker-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  render() {\n    this.adjustPopupPosition();\n\n    return (\n      <div ref={(el) => (this.wrapper = el)} class=\"datepicker__container\">\n        <six-input\n          part=\"base\"\n          value={formatDate(this.value, this.dateFormat)}\n          ref={(el) => (this.inputElement = el)}\n          placeholder={this.placeholder}\n          readonly={this.readonly}\n          disabled={this.disabled}\n          name={this.name}\n          label={this.label}\n          required={this.required}\n          error-text={this.errorText}\n          error-on-blur={this.errorOnBlur}\n          onClick={() => this.openCalendar()}\n          size={this.size}\n          class={{ 'input--empty': !this.value }}\n        >\n          {this.renderCustomIcon()}\n          {this.renderClearable()}\n\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            part=\"popup\"\n            ref={(el) => (this.popup = el)}\n            class={{\n              datepicker__popup: true,\n              'datepicker__popup--is-up': this.placement ? this.placement === 'top' : this.isDropDownContentUp,\n              'datepicker__popup--is-inline': this.inline,\n            }}\n          >\n            {this.renderHeader()}\n            {this.renderBody()}\n            {this.type === 'date-time' && (\n              <six-timepicker\n                inline={true}\n                onSix-timepicker-change-debounced={(event) => this.onTimepickerChange(event)}\n                value={\n                  this.selectedDate?.getHours() +\n                  ':' +\n                  this.selectedDate?.getMinutes() +\n                  ':' +\n                  this.selectedDate?.getSeconds()\n                }\n              ></six-timepicker>\n            )}\n            <div class=\"datepicker__footer\">\n              <slot />\n            </div>\n          </div>\n        )}\n      </div>\n    );\n  }\n\n  private adjustPopupPosition() {\n    this.adjustPopupForHoisting();\n    this.adjustPopupForSmallScreens();\n  }\n\n  /*\n   * The position of the hoisted datepicker 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 datepicker 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.calcIsDropDownContentUp();\n\n    if (this.isDropDownContentUp) {\n      this.popup.style.top = `${inputTop - popupHeight}px`;\n    } else {\n      this.popup.style.top = `${inputTop + inputHeight}px`;\n    }\n  }\n\n  /*\n   * For small screens the datepicker popup could be cut-off even though there might still be space within the viewport.\n   * This is because the popup is always aligned with the trigger input field. However in the scenario of small screens\n   * we should reposition the popup to use the space available.\n   */\n  private adjustPopupForSmallScreens() {\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      const popupBoundingClientRect = this.popup.getBoundingClientRect();\n\n      const setPopupAsFixPosition = () => {\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\n      if (\n        popupBoundingClientRect.y < 0 &&\n        window.innerHeight - popupBoundingClientRect.height > 0 &&\n        Math.abs(popupBoundingClientRect.y) <= popupBoundingClientRect.height\n      ) {\n        // handle case where popup is cut-off on top but there is still space available\n\n        setPopupAsFixPosition();\n        this.popup.style.top = '0px';\n      } else if (\n        window.innerHeight < popupBoundingClientRect.y + popupBoundingClientRect.height &&\n        window.innerHeight > popupBoundingClientRect.height &&\n        Math.abs(popupBoundingClientRect.y - window.innerHeight) <= popupBoundingClientRect.height\n      ) {\n        // handle case where popup is cut-off at the bottom but there is still space available above\n        // apply screen position to fixed popup\n        setPopupAsFixPosition();\n        this.popup.style.top = `${window.innerHeight - popupBoundingClientRect.height}px`;\n      }\n\n      if (\n        window.innerWidth < popupBoundingClientRect.x + popupBoundingClientRect.width &&\n        window.innerWidth > popupBoundingClientRect.width &&\n        Math.abs(popupBoundingClientRect.x - window.innerWidth) <= popupBoundingClientRect.width\n      ) {\n        // handle case where popup is cut-off to the right\n        setPopupAsFixPosition();\n        this.popup.style.left = `${window.innerWidth - popupBoundingClientRect.width}px`;\n      }\n    }, 0);\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 datepicker is at bottom of screen\n        this.popup.style.top = `${popupTop - popupBoundingClientRect.height - inputBoundingClientRect.height}px`;\n      }\n    }, 0);\n  }\n\n  connectedCallback() {\n    this.handleClearClick = this.handleClearClick.bind(this);\n  }\n\n  disconnectedCallback() {\n    this.eventListeners.removeAll();\n  }\n\n  private displayCustomMessage(valid: boolean) {\n    if (!this.inputElement) {\n      return;\n    }\n    if (valid) {\n      void this.setCustomValidity('');\n    } else {\n      const message = this.errorText ? this.errorText : 'Invalid date format';\n      void this.setCustomValidity(message);\n    }\n  }\n\n  private static getCurrentDateAsPointer(): PointerDate {\n    return {\n      year: year(now()),\n      month: month(now()),\n      day: day(now()),\n      hours: hours(now()),\n      minutes: minutes(now()),\n      seconds: seconds(now()),\n    };\n  }\n}\n"],"mappings":"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"}

package/dist/ui-library/p-788281d0.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixMainContainerCss","SixMainContainer","render","h","Host","part","class","content","this","padded"],"sources":["./src/components/six-main-container/six-main-container.scss?tag=six-main-container&encapsulation=shadow","./src/components/six-main-container/six-main-container.tsx"],"sourcesContent":["$margin-default-width: 10rem;\n$content-default-width: 60rem;\n$content-min-width: 48rem;\n$content-max-width: 100rem;\n\n:host {\n  display: flex;\n  flex-wrap: nowrap;\n  min-width: fit-content;\n}\n\n.left-margin,\n.right-margin {\n  flex: 1 6 $margin-default-width;\n  min-width: var(--six-spacing-xxx-large);\n}\n\n.content {\n  flex: 6 1 $content-default-width;\n  min-width: $content-min-width;\n  max-width: $content-max-width;\n  &--padded {\n    padding: var(--six-spacing-xxx-large) 0;\n  }\n}\n","import { Component, Element, Host, h, Prop } from '@stencil/core';\n\n/**\n * @since 1.01\n * @status stable\n *\n * @slot - The main container's content.\n *\n * @part left-margin  - The component's left margin area.\n * @part content      - The component's content area.\n * @part right-margin - The component's right margin area.\n */\n\n@Component({\n  tag: 'six-main-container',\n  styleUrl: 'six-main-container.scss',\n  shadow: true,\n})\nexport class SixMainContainer {\n  @Element() host: HTMLSixMainContainerElement;\n\n  /** Set to false to remove top and bottom padding.  */\n  @Prop() padded = true;\n\n  render() {\n    return (\n      <Host>\n        <div part=\"left-margin\" class=\"left-margin\" />\n        <div part=\"content\" class={{ content: true, 'content--padded': this.padded }}>\n          <slot />\n        </div>\n        <div part=\"right-margin\" class=\"right-margin\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,+P,MCkBfC,EAAgB,M,qCAIV,I,CAEjBC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,KAAK,cAAcC,MAAM,gBAC9BH,EAAA,OAAKE,KAAK,UAAUC,MAAO,CAAEC,QAAS,KAAM,kBAAmBC,KAAKC,SAClEN,EAAA,cAEFA,EAAA,OAAKE,KAAK,eAAeC,MAAM,iB"}

package/dist/ui-library/p-7cbc261b.entry.js

@@ -1,2 +0,0 @@
-import{r as i,c as s,h as t,g as e}from"./p-16b99232.js";import{f as a}from"./p-b1e66136.js";const o=":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{--hide-duration:var(--six-transition-medium);--hide-timing-function:ease;--show-duration:var(--six-transition-medium);--show-timing-function:ease;font-family:var(--six-font-family);display:block}.details{border:solid var(--six-border-width) var(--six-input-border-color);border-radius:var(--six-border-radius-medium);color:var(--six-details-color);overflow-anchor:none;font-size:var(--six-input-font-size-medium)}.details:hover:not(.details--disabled):not(.details--open){border-color:var(--six-input-border-color-hover)}.details.inline{border:none;color:var(--six-sidebar-color)}.details.inline:hover{background-color:var(--six-sidebar-hover-background-color)}.details.inline.details--open{background-color:var(--six-color-web-rock-50)}.details.inline.details--open:hover{border:none;box-shadow:none}.details.inline.details--open>.details__header{color:var(--six-sidebar-color);font-weight:var(--six-font-weight-bold);background-color:var(--six-sidebar-header-background-color)}.details--disabled{background-color:var(--six-input-background-color-disabled);border-color:var(--six-input-border-color-disabled);color:var(--six-input-color-disabled)}.details__header{display:flex;align-items:center;border-radius:inherit;padding:var(--six-spacing-medium);user-select:none;cursor:pointer}.details__header:focus{outline:none}.details--disabled .details__header{cursor:not-allowed;border-width:1px}.details--disabled .details__header:focus{outline:none;box-shadow:none}.details__summary{flex:1 1 auto;display:flex;align-items:center}.details__summary-icon{flex:0 0 auto;display:flex;align-items:center;font-size:1.2em;transition:var(--six-transition-medium) transform ease}.details--open .details__summary-icon--animate{transform:rotate(-180deg)}.details--open:hover{color:var(--six-input-color-focus)}.details__body{height:0;overflow:hidden;transition-property:height;transition-duration:var(--hide-duration);transition-timing-function:var(--hide-timing-function)}.details--open .details__body{transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.details__content{padding:var(--six-spacing-medium)}";let r=0;const n=class{constructor(t){i(this,t);this.sixShow=s(this,"six-details-show",7);this.sixAfterShow=s(this,"six-details-after-show",7);this.sixHide=s(this,"six-details-hide",7);this.sixAfterHide=s(this,"six-details-after-hide",7);this.componentId=`details-${++r}`;this.isVisible=false;this.animateSummaryIcon=true;this.open=false;this.summary="";this.summaryIcon=undefined;this.summaryIconSize="inherit";this.disabled=false;this.inline=false;this.selectableEmpty=false;this.hasContent=true}handleOpenChange(){if(this.body){this.open?this.show():this.hide()}}connectedCallback(){this.handleBodyTransitionEnd=this.handleBodyTransitionEnd.bind(this);this.handleSummaryClick=this.handleSummaryClick.bind(this);this.handleSummaryKeyDown=this.handleSummaryKeyDown.bind(this)}componentDidLoad(){a.observe(this.details);this.body.hidden=!this.open;if(this.open){this.show()}}disconnectedCallback(){a.unobserve(this.details)}async show(){if(this.isVisible){return}const i=this.sixShow.emit();if(i.defaultPrevented){this.open=false;return}this.body.hidden=false;if(this.body.scrollHeight===0){this.body.style.height="auto";this.body.style.overflow="visible"}else{this.body.style.height=`${this.body.scrollHeight}px`;this.body.style.overflow="hidden"}this.isVisible=true;this.open=true}async hide(){if(!this.isVisible){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}this.body.style.height=`${this.body.scrollHeight}px`;this.body.style.overflow="hidden";requestAnimationFrame((()=>{this.body.style.height="0"}));this.isVisible=false;this.open=false}handleBodyTransitionEnd(i){const s=i.target;if(i.propertyName==="height"&&s.classList.contains("details__body")){this.body.style.overflow=this.open?"visible":"hidden";this.body.style.height=this.open?"auto":"0";this.open?this.sixAfterShow.emit():this.sixAfterHide.emit();this.body.hidden=!this.open}}handleSummaryClick(){if(!this.disabled&&(this.hasContent||this.selectableEmpty)){this.open?this.hide():this.show();this.header.focus()}}handleSummaryKeyDown(i){if(i.key==="Enter"||i.key===" "){i.preventDefault();this.open?this.hide():this.show()}if(i.key==="ArrowUp"||i.key==="ArrowLeft"){i.preventDefault();this.hide()}if(i.key==="ArrowDown"||i.key==="ArrowRight"){i.preventDefault();this.show()}}render(){const i=this.hasContent&&(this.summaryIcon||"expand_more");return t("div",{ref:i=>this.details=i,part:"base",class:{details:true,"details--open":this.open,"details--disabled":this.disabled,inline:this.inline}},t("header",{ref:i=>this.header=i,part:"header",id:`${this.componentId}-header`,class:"details__header",role:"button","aria-expanded":this.open?"true":"false","aria-controls":`${this.componentId}-content`,"aria-disabled":this.disabled?"true":"false",tabIndex:this.disabled?-1:0,onClick:this.handleSummaryClick,onKeyDown:this.handleSummaryKeyDown},t("div",{part:"summary",class:"details__summary"},t("slot",{name:"summary"},this.summary)),t("span",{part:"summary-icon",class:{"details__summary-icon":true,"details__summary-icon--animate":this.animateSummaryIcon}},t("slot",{name:"summary-icon",onSlotchange:()=>this.animateSummaryIcon=false},i&&t("six-icon",{size:this.summaryIconSize},i)))),t("div",{ref:i=>this.body=i,class:"details__body",onTransitionEnd:this.handleBodyTransitionEnd},t("div",{part:"content",id:`${this.componentId}-content`,class:"details__content",role:"region","aria-labelledby":`${this.componentId}-header`},t("slot",null))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"]}}};n.style=o;export{n as six_details};
-//# sourceMappingURL=p-7cbc261b.entry.js.map

package/dist/ui-library/p-7cbc261b.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixDetailsCss","id","SixDetails","this","componentId","isVisible","handleOpenChange","body","open","show","hide","connectedCallback","handleBodyTransitionEnd","bind","handleSummaryClick","handleSummaryKeyDown","componentDidLoad","focusVisible","observe","details","hidden","disconnectedCallback","unobserve","async","sixShow","emit","defaultPrevented","scrollHeight","style","height","overflow","sixHide","requestAnimationFrame","event","target","propertyName","classList","contains","sixAfterShow","sixAfterHide","disabled","hasContent","selectableEmpty","header","focus","key","preventDefault","render","summaryIcon","h","ref","el","part","class","inline","role","tabIndex","onClick","onKeyDown","name","summary","animateSummaryIcon","onSlotchange","size","summaryIconSize","onTransitionEnd"],"sources":["./src/components/six-details/six-details.scss?tag=six-details&encapsulation=shadow","./src/components/six-details/six-details.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --hide-duration: The length of the hide transition.\n * @prop --hide-timing-function: The timing function (easing) to use for the hide transition.\n * @prop --show-duration: The length of the show transition.\n * @prop --show-timing-function: The timing function (easing) to use for the show transition.\n */\n:host {\n  --hide-duration: var(--six-transition-medium);\n  --hide-timing-function: ease;\n  --show-duration: var(--six-transition-medium);\n  --show-timing-function: ease;\n\n  font-family: var(--six-font-family);\n  display: block;\n}\n\n.details {\n  border: solid var(--six-border-width) var(--six-input-border-color);\n  border-radius: var(--six-border-radius-medium);\n  color: var(--six-details-color);\n  overflow-anchor: none;\n  font-size: var(--six-input-font-size-medium);\n\n  &:hover:not(.details--disabled):not(.details--open) {\n    border-color: var(--six-input-border-color-hover);\n  }\n\n  &.inline {\n    border: none;\n    color: var(--six-sidebar-color);\n\n    &:hover {\n      background-color: var(--six-sidebar-hover-background-color);\n    }\n\n    &.details--open {\n      background-color: var(--six-color-web-rock-50);\n\n      &:hover {\n        border: none;\n        box-shadow: none;\n      }\n\n      & > .details__header {\n        color: var(--six-sidebar-color);\n        font-weight: var(--six-font-weight-bold);\n        background-color: var(--six-sidebar-header-background-color);\n      }\n    }\n  }\n}\n\n.details--disabled {\n  background-color: var(--six-input-background-color-disabled);\n  border-color: var(--six-input-border-color-disabled);\n  color: var(--six-input-color-disabled);\n}\n\n.details__header {\n  display: flex;\n  align-items: center;\n  border-radius: inherit;\n  padding: var(--six-spacing-medium);\n  user-select: none;\n  cursor: pointer;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.focus-visible .details__header:focus {\n}\n\n.details--disabled .details__header {\n  cursor: not-allowed;\n  border-width: 1px;\n\n  &:focus {\n    outline: none;\n    box-shadow: none;\n  }\n}\n\n.details__summary {\n  flex: 1 1 auto;\n  display: flex;\n  align-items: center;\n}\n\n.details__summary-icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.2em;\n  transition: var(--six-transition-medium) transform ease;\n}\n\n.details--open .details__summary-icon--animate {\n  transform: rotate(-180deg);\n}\n\n.details--open:hover {\n  color: var(--six-input-color-focus);\n}\n\n.details__body {\n  height: 0;\n  overflow: hidden;\n  transition-property: height;\n  transition-duration: var(--hide-duration);\n  transition-timing-function: var(--hide-timing-function);\n}\n\n.details--open .details__body {\n  transition-duration: var(--show-duration);\n  transition-timing-function: var(--show-timing-function);\n}\n\n.details__content {\n  padding: var(--six-spacing-medium);\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\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 details' content.\n * @slot summary - The details' summary. Alternatively, you can use the summary prop.\n *\n * @part base - The component's base wrapper.\n * @part header - The summary header.\n * @part summary - The details summary.\n * @part summary-icon - The expand/collapse summary icon.\n * @part content - The details content.\n */\n\n@Component({\n  tag: 'six-details',\n  styleUrl: 'six-details.scss',\n  shadow: true,\n})\nexport class SixDetails {\n  @Element() readonly host: HTMLSixDetailsElement;\n\n  @State() animateSummaryIcon = true;\n\n  body: HTMLElement;\n  componentId = `details-${++id}`;\n  details: HTMLElement;\n  header: HTMLElement;\n  isVisible = false;\n\n  /** Indicates whether or not the details is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** The summary to show in the details header. If you need to display HTML, use the `summary` slot instead. */\n  @Prop() summary = '';\n\n  /** The summary icon to show in the details header. If you need to display HTML, use the `summary-icon` slot instead. */\n  @Prop() summaryIcon: string;\n\n  /** The icon's size. */\n  @Prop({ reflect: true }) summaryIconSize:\n    | 'inherit'\n    | 'xSmall'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'xLarge'\n    | 'xxLarge'\n    | 'xxxLarge' = 'inherit';\n\n  /** Set to true to prevent the user from toggling the details. */\n  @Prop() disabled = false;\n\n  /** Set to true when you want to use six-details inline e.g. in a sidebar */\n  @Prop() inline = false;\n\n  /** Set to true when you want details without content to be selectable. This is important if you e.g. have a toggled sidebar where some menus have no children  */\n  @Prop() selectableEmpty = false;\n\n  @Prop() readonly hasContent: boolean = true;\n\n  @Watch('open')\n  handleOpenChange() {\n    if (this.body) {\n      this.open ? this.show() : this.hide();\n    }\n  }\n\n  /** Emitted when the details opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event({ eventName: 'six-details-show' }) sixShow: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the details opens and all transitions are complete. */\n  @Event({ eventName: 'six-details-after-show' }) sixAfterShow: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the details closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event({ eventName: 'six-details-hide' }) sixHide: EventEmitter<EmptyPayload>;\n\n  /** Emitted after the details closes and all transitions are complete. */\n  @Event({ eventName: 'six-details-after-hide' }) sixAfterHide: EventEmitter<EmptyPayload>;\n\n  connectedCallback() {\n    this.handleBodyTransitionEnd = this.handleBodyTransitionEnd.bind(this);\n    this.handleSummaryClick = this.handleSummaryClick.bind(this);\n    this.handleSummaryKeyDown = this.handleSummaryKeyDown.bind(this);\n  }\n\n  componentDidLoad() {\n    focusVisible.observe(this.details);\n\n    this.body.hidden = !this.open;\n\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n  }\n\n  disconnectedCallback() {\n    focusVisible.unobserve(this.details);\n  }\n\n  /** Shows the detail body */\n  @Method()\n  async show() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (this.isVisible) {\n      return;\n    }\n\n    const sixShow = this.sixShow.emit();\n    if (sixShow.defaultPrevented) {\n      this.open = false;\n      return;\n    }\n\n    this.body.hidden = false;\n\n    if (this.body.scrollHeight === 0) {\n      // When the scroll height can't be measured, use auto. This prevents a borked open state when the details is open\n      // intiially, but not immediately visible (i.e. in a tab panel).\n      this.body.style.height = 'auto';\n      this.body.style.overflow = 'visible';\n    } else {\n      this.body.style.height = `${this.body.scrollHeight}px`;\n      this.body.style.overflow = 'hidden';\n    }\n\n    this.isVisible = true;\n    this.open = true;\n  }\n\n  /** Hides the detail body */\n  @Method()\n  async hide() {\n    // Prevent subsequent calls to the method, whether manually or triggered by the `open` watcher\n    if (!this.isVisible) {\n      return;\n    }\n\n    const sixHide = this.sixHide.emit();\n    if (sixHide.defaultPrevented) {\n      this.open = true;\n      return;\n    }\n\n    // We can't transition out of `height: auto`, so let's set it to the current height first\n    this.body.style.height = `${this.body.scrollHeight}px`;\n    this.body.style.overflow = 'hidden';\n\n    requestAnimationFrame(() => {\n      // tslint:disable-next-line: no-unused-expression\n      this.body.clientWidth; // force a reflow\n      this.body.style.height = '0';\n    });\n\n    this.isVisible = false;\n    this.open = false;\n  }\n\n  handleBodyTransitionEnd(event: TransitionEvent) {\n    const target = event.target as HTMLElement;\n\n    // Ensure we only emit one event when the target element is no longer visible\n    if (event.propertyName === 'height' && target.classList.contains('details__body')) {\n      this.body.style.overflow = this.open ? 'visible' : 'hidden';\n      this.body.style.height = this.open ? 'auto' : '0';\n      this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n      this.body.hidden = !this.open;\n    }\n  }\n\n  handleSummaryClick() {\n    if (!this.disabled && (this.hasContent || this.selectableEmpty)) {\n      this.open ? this.hide() : this.show();\n      this.header.focus();\n    }\n  }\n\n  handleSummaryKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.open ? this.hide() : this.show();\n    }\n\n    if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n      event.preventDefault();\n      this.hide();\n    }\n\n    if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n      event.preventDefault();\n      this.show();\n    }\n  }\n\n  render() {\n    const summaryIcon = this.hasContent && (this.summaryIcon || 'expand_more');\n\n    return (\n      <div\n        ref={(el) => (this.details = el)}\n        part=\"base\"\n        class={{\n          details: true,\n          'details--open': this.open,\n          'details--disabled': this.disabled,\n          inline: this.inline,\n        }}\n      >\n        <header\n          ref={(el) => (this.header = el)}\n          part=\"header\"\n          id={`${this.componentId}-header`}\n          class=\"details__header\"\n          role=\"button\"\n          aria-expanded={this.open ? 'true' : 'false'}\n          aria-controls={`${this.componentId}-content`}\n          aria-disabled={this.disabled ? 'true' : 'false'}\n          tabIndex={this.disabled ? -1 : 0}\n          onClick={this.handleSummaryClick}\n          onKeyDown={this.handleSummaryKeyDown}\n        >\n          <div part=\"summary\" class=\"details__summary\">\n            <slot name=\"summary\">{this.summary}</slot>\n          </div>\n\n          <span\n            part=\"summary-icon\"\n            class={{\n              'details__summary-icon': true,\n              'details__summary-icon--animate': this.animateSummaryIcon,\n            }}\n          >\n            <slot name=\"summary-icon\" onSlotchange={() => (this.animateSummaryIcon = false)}>\n              {summaryIcon && <six-icon size={this.summaryIconSize}>{summaryIcon}</six-icon>}\n            </slot>\n          </span>\n        </header>\n\n        <div ref={(el) => (this.body = el)} class=\"details__body\" onTransitionEnd={this.handleBodyTransitionEnd}>\n          <div\n            part=\"content\"\n            id={`${this.componentId}-content`}\n            class=\"details__content\"\n            role=\"region\"\n            aria-labelledby={`${this.componentId}-header`}\n          >\n            <slot />\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAgB,ysECItB,IAAIC,EAAK,E,MAuBIC,EAAU,M,uNAMrBC,KAAAC,YAAc,aAAaH,IAG3BE,KAAAE,UAAY,M,wBANkB,K,UASiB,M,aAG7B,G,gDAcD,U,cAGE,M,YAGF,M,qBAGS,M,gBAEa,I,CAGvCC,mBACE,GAAIH,KAAKI,KAAM,CACbJ,KAAKK,KAAOL,KAAKM,OAASN,KAAKO,M,EAgBnCC,oBACER,KAAKS,wBAA0BT,KAAKS,wBAAwBC,KAAKV,MACjEA,KAAKW,mBAAqBX,KAAKW,mBAAmBD,KAAKV,MACvDA,KAAKY,qBAAuBZ,KAAKY,qBAAqBF,KAAKV,K,CAG7Da,mBACEC,EAAaC,QAAQf,KAAKgB,SAE1BhB,KAAKI,KAAKa,QAAUjB,KAAKK,KAGzB,GAAIL,KAAKK,KAAM,CACbL,KAAKM,M,EAITY,uBACEJ,EAAaK,UAAUnB,KAAKgB,Q,CAK9BI,aAEE,GAAIpB,KAAKE,UAAW,CAClB,M,CAGF,MAAMmB,EAAUrB,KAAKqB,QAAQC,OAC7B,GAAID,EAAQE,iBAAkB,CAC5BvB,KAAKK,KAAO,MACZ,M,CAGFL,KAAKI,KAAKa,OAAS,MAEnB,GAAIjB,KAAKI,KAAKoB,eAAiB,EAAG,CAGhCxB,KAAKI,KAAKqB,MAAMC,OAAS,OACzB1B,KAAKI,KAAKqB,MAAME,SAAW,S,KACtB,CACL3B,KAAKI,KAAKqB,MAAMC,OAAS,GAAG1B,KAAKI,KAAKoB,iBACtCxB,KAAKI,KAAKqB,MAAME,SAAW,Q,CAG7B3B,KAAKE,UAAY,KACjBF,KAAKK,KAAO,I,CAKde,aAEE,IAAKpB,KAAKE,UAAW,CACnB,M,CAGF,MAAM0B,EAAU5B,KAAK4B,QAAQN,OAC7B,GAAIM,EAAQL,iBAAkB,CAC5BvB,KAAKK,KAAO,KACZ,M,CAIFL,KAAKI,KAAKqB,MAAMC,OAAS,GAAG1B,KAAKI,KAAKoB,iBACtCxB,KAAKI,KAAKqB,MAAME,SAAW,SAE3BE,uBAAsB,KAGpB7B,KAAKI,KAAKqB,MAAMC,OAAS,GAAG,IAG9B1B,KAAKE,UAAY,MACjBF,KAAKK,KAAO,K,CAGdI,wBAAwBqB,GACtB,MAAMC,EAASD,EAAMC,OAGrB,GAAID,EAAME,eAAiB,UAAYD,EAAOE,UAAUC,SAAS,iBAAkB,CACjFlC,KAAKI,KAAKqB,MAAME,SAAW3B,KAAKK,KAAO,UAAY,SACnDL,KAAKI,KAAKqB,MAAMC,OAAS1B,KAAKK,KAAO,OAAS,IAC9CL,KAAKK,KAAOL,KAAKmC,aAAab,OAAStB,KAAKoC,aAAad,OACzDtB,KAAKI,KAAKa,QAAUjB,KAAKK,I,EAI7BM,qBACE,IAAKX,KAAKqC,WAAarC,KAAKsC,YAActC,KAAKuC,iBAAkB,CAC/DvC,KAAKK,KAAOL,KAAKO,OAASP,KAAKM,OAC/BN,KAAKwC,OAAOC,O,EAIhB7B,qBAAqBkB,GACnB,GAAIA,EAAMY,MAAQ,SAAWZ,EAAMY,MAAQ,IAAK,CAC9CZ,EAAMa,iBACN3C,KAAKK,KAAOL,KAAKO,OAASP,KAAKM,M,CAGjC,GAAIwB,EAAMY,MAAQ,WAAaZ,EAAMY,MAAQ,YAAa,CACxDZ,EAAMa,iBACN3C,KAAKO,M,CAGP,GAAIuB,EAAMY,MAAQ,aAAeZ,EAAMY,MAAQ,aAAc,CAC3DZ,EAAMa,iBACN3C,KAAKM,M,EAITsC,SACE,MAAMC,EAAc7C,KAAKsC,aAAetC,KAAK6C,aAAe,eAE5D,OACEC,EAAA,OACEC,IAAMC,GAAQhD,KAAKgB,QAAUgC,EAC7BC,KAAK,OACLC,MAAO,CACLlC,QAAS,KACT,gBAAiBhB,KAAKK,KACtB,oBAAqBL,KAAKqC,SAC1Bc,OAAQnD,KAAKmD,SAGfL,EAAA,UACEC,IAAMC,GAAQhD,KAAKwC,OAASQ,EAC5BC,KAAK,SACLnD,GAAI,GAAGE,KAAKC,qBACZiD,MAAM,kBACNE,KAAK,SAAQ,gBACEpD,KAAKK,KAAO,OAAS,QAAO,gBAC5B,GAAGL,KAAKC,sBAAqB,gBAC7BD,KAAKqC,SAAW,OAAS,QACxCgB,SAAUrD,KAAKqC,UAAY,EAAI,EAC/BiB,QAAStD,KAAKW,mBACd4C,UAAWvD,KAAKY,sBAEhBkC,EAAA,OAAKG,KAAK,UAAUC,MAAM,oBACxBJ,EAAA,QAAMU,KAAK,WAAWxD,KAAKyD,UAG7BX,EAAA,QACEG,KAAK,eACLC,MAAO,CACL,wBAAyB,KACzB,iCAAkClD,KAAK0D,qBAGzCZ,EAAA,QAAMU,KAAK,eAAeG,aAAc,IAAO3D,KAAK0D,mBAAqB,OACtEb,GAAeC,EAAA,YAAUc,KAAM5D,KAAK6D,iBAAkBhB,MAK7DC,EAAA,OAAKC,IAAMC,GAAQhD,KAAKI,KAAO4C,EAAKE,MAAM,gBAAgBY,gBAAiB9D,KAAKS,yBAC9EqC,EAAA,OACEG,KAAK,UACLnD,GAAI,GAAGE,KAAKC,sBACZiD,MAAM,mBACNE,KAAK,SAAQ,kBACI,GAAGpD,KAAKC,sBAEzB6C,EAAA,e"}

package/dist/ui-library/p-80f32909.entry.js

@@ -1,2 +0,0 @@
-import{r as i,c as e,h as t,g as s}from"./p-16b99232.js";import{h as l}from"./p-b4dfb7cf.js";const a=':host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:inherit}:host{display:inline-block}.tile{min-height:var(--tile-size);width:var(--tile-size);background-color:var(--six-color-clay-50);display:inline-grid;grid-template-columns:100%;grid-template-areas:"header" "middle" "footer"}.tile--small{--tile-size:80px;--tile-padding-size:var(--six-spacing-medium)}.tile--medium{--tile-size:120px;--tile-padding-size:var(--six-spacing-large)}.tile--large{--tile-size:160px;--tile-padding-size:var(--six-spacing-x-large)}.tile:not(.tile--visible){visibility:hidden}.tile--elevated{border:0;box-shadow:var(--six-elevation-8dp)}.tile__header{grid-area:header;height:5%;justify-self:right;display:flex;justify-content:right;opacity:0;transition:var(--six-transition-fast) opacity}.tile:hover>.tile__header{opacity:1}.tile__header--hidden{visibility:hidden}.tile__header six-icon-button{margin-top:-6px;margin-right:-6px;margin-bottom:-16px}.tile__body,.tile__body--large,.tile__body--medium,.tile__body--small{grid-area:middle;display:grid;place-items:center;cursor:pointer;padding-left:var(--tile-padding-size);padding-right:var(--tile-padding-size)}.tile__body six-icon::part(base),.tile__body--large six-icon::part(base),.tile__body--medium six-icon::part(base),.tile__body--small six-icon::part(base){padding:0}.tile__body--small{--tile-padding-size:var(--six-spacing-medium)}.tile__body--medium{--tile-padding-size:var(--six-spacing-large)}.tile__body--large{--tile-padding-size:var(--six-spacing-x-large)}.tile__footer,.tile__footer--large,.tile__footer--medium,.tile__footer--small{grid-area:footer;display:flex;justify-content:center;cursor:pointer;font-weight:var(--six-font-weight-normal);color:var(--six-color-web-rock-900)}.tile__footer--small{font-size:var(--six-font-size-xxx-small)}.tile__footer--medium{font-size:var(--six-font-size-xx-small)}.tile__footer--large{font-size:var(--six-font-size-small)}.tile__footer .label__footer,.tile__footer--small .label__footer,.tile__footer--medium .label__footer,.tile__footer--large .label__footer{overflow:hidden;text-overflow:ellipsis;width:calc(var(--tile-size) - 2em);text-align:center}';const o=class{constructor(t){i(this,t);this.sixTileClose=e(this,"six-tile-closed",7);this.sixTileSelected=e(this,"six-tile-selected",7);this.handleCloseClickEvent=()=>{this.visible=false;this.sixTileClose.emit()};this.handleClickEvent=()=>{this.sixTileSelected.emit()};this.label="";this.iconName=undefined;this.closeable=true;this.elevated=false;this.disableTooltip=true;this.disabled=false;this.size="medium";this.visible=true;this.hasIconSlot=false;this.hasLabelSlot=false}async hide(){this.visible=false}async show(){this.visible=true}connectedCallback(){this.handleSlotChange=this.handleSlotChange.bind(this)}componentWillLoad(){this.handleSlotChange()}handleSlotChange(){this.hasIconSlot=l(this.host,"icon");this.hasLabelSlot=l(this.host,"label");if(this.hasIconSlot){let i=this.host.querySelector(`[slot="icon"]`);i.addEventListener("click",this.handleClickEvent)}if(this.hasLabelSlot){let i=this.host.querySelector(`[slot="label"]`);i.addEventListener("click",this.handleClickEvent)}}render(){return t("six-tooltip",{disabled:this.disableTooltip||this.label==="",content:this.label},t("div",{part:"base",class:{tile:true,"tile--visible":this.visible,"tile--small":this.size==="small","tile--medium":this.size==="medium","tile--large":this.size==="large","tile--elevated":this.elevated}},t("div",{part:"header",class:"tile__header"},t("six-icon-button",{class:{"tile__header--hidden":!this.closeable},name:"close",size:r(this.size),onClick:this.handleCloseClickEvent})),t("div",{part:"body",class:"tile__body"},this.iconName&&t("six-icon",{onClick:this.handleClickEvent,size:d(this.size)},this.iconName),this.hasIconSlot&&t("slot",{name:"icon"})),t("div",{part:"footer",class:{"tile__footer--small":this.size==="small","tile__footer--medium":this.size==="medium","tile__footer--large":this.size==="large"}},this.label&&t("div",{class:{".label__footer":true},onClick:this.handleClickEvent},this.label),this.hasLabelSlot&&t("slot",{name:"label"}))))}get host(){return s(this)}};const r=i=>({small:"xxSmall",medium:"medium",large:"medium"}[i]);const d=i=>({small:"xLarge",medium:"xxLarge",large:"xxxLarge"}[i]);o.style=a;export{o as six_tile};
-//# sourceMappingURL=p-80f32909.entry.js.map

package/dist/ui-library/p-80f32909.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixTileCss","SixTile","this","handleCloseClickEvent","visible","sixTileClose","emit","handleClickEvent","sixTileSelected","async","connectedCallback","handleSlotChange","bind","componentWillLoad","hasIconSlot","hasSlot","host","hasLabelSlot","slot","querySelector","addEventListener","render","h","disabled","disableTooltip","label","content","part","class","tile","size","elevated","closeable","name","closeIconSize","onClick","iconName","iconSize","small","medium","large"],"sources":["./src/components/six-tile/six-tile.scss?tag=six-tile&encapsulation=shadow","./src/components/six-tile/six-tile.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n  display: inline-block;\n}\n\n.tile {\n  &--small {\n    --tile-size: 80px;\n    --tile-padding-size: var(--six-spacing-medium);\n  }\n\n  &--medium {\n    --tile-size: 120px;\n    --tile-padding-size: var(--six-spacing-large);\n  }\n\n  &--large {\n    --tile-size: 160px;\n    --tile-padding-size: var(--six-spacing-x-large);\n  }\n\n  min-height: var(--tile-size);\n  width: var(--tile-size);\n\n  background-color: var(--six-color-clay-50);\n\n  display: inline-grid;\n  grid-template-columns: 100%;\n  grid-template-areas:\n    'header'\n    'middle'\n    'footer';\n\n  &:not(.tile--visible) {\n    visibility: hidden;\n  }\n\n  &--elevated {\n    border: 0;\n    box-shadow: var(--six-elevation-8dp);\n  }\n}\n\n.tile__header {\n  grid-area: header;\n  height: 5%;\n  justify-self: right;\n  display: flex;\n  justify-content: right;\n  opacity: 0;\n  transition: var(--six-transition-fast) opacity;\n\n  .tile:hover > & {\n    opacity: 1;\n  }\n\n  &--hidden {\n    visibility: hidden;\n  }\n\n  six-icon-button {\n    margin-top: -6px;\n    margin-right: -6px;\n    margin-bottom: -16px;\n  }\n}\n\n.tile__body {\n  grid-area: middle;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n\n  six-icon::part(base) {\n    padding: 0;\n  }\n\n  &--small {\n    @extend .tile__body;\n    --tile-padding-size: var(--six-spacing-medium);\n  }\n\n  &--medium {\n    @extend .tile__body;\n    --tile-padding-size: var(--six-spacing-large);\n  }\n\n  &--large {\n    @extend .tile__body;\n    --tile-padding-size: var(--six-spacing-x-large);\n  }\n\n  padding-left: var(--tile-padding-size);\n  padding-right: var(--tile-padding-size);\n}\n\n.tile__footer {\n  grid-area: footer;\n  display: flex;\n  justify-content: center;\n  cursor: pointer;\n  font-weight: var(--six-font-weight-normal);\n  color: var(--six-color-web-rock-900);\n\n  &--small {\n    @extend .tile__footer;\n    font-size: var(--six-font-size-xxx-small);\n  }\n\n  &--medium {\n    @extend .tile__footer;\n    font-size: var(--six-font-size-xx-small);\n  }\n\n  &--large {\n    @extend .tile__footer;\n    font-size: var(--six-font-size-small);\n  }\n\n  .label__footer {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    width: calc(var(--tile-size) - 2em);\n    text-align: center;\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { hasSlot } from '../../utils/slot';\n\n/**\n * @since 1.0\n * @status stable\n */\n\n@Component({\n  tag: 'six-tile',\n  styleUrl: 'six-tile.scss',\n  shadow: true,\n})\nexport class SixTile {\n  @Element() host: HTMLSixTileElement;\n\n  /** The tile's label. */\n  @Prop() label = '';\n\n  /** The icon's name. */\n  @Prop() iconName;\n\n  /** Flag, whether the tile is closeable. */\n  @Prop() closeable = true;\n\n  /** Flag, whether the tile should cast a shadow. */\n  @Prop() elevated = false;\n\n  /** Enables tile tooltip for tiles */\n  @Prop() disableTooltip: boolean = true;\n\n  /** Set to true to disable the tile. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** The tile's size. */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n  @State() visible = true;\n\n  /** Emitted when the tile was closed. */\n  @Event({ eventName: 'six-tile-closed' }) sixTileClose: EventEmitter<EmptyPayload>;\n\n  /** Emitted when the tile is selected. */\n  @Event({ eventName: 'six-tile-selected' }) sixTileSelected: EventEmitter<EmptyPayload>;\n\n  /** Hides the tile */\n  @Method()\n  async hide() {\n    this.visible = false;\n  }\n\n  /** Shows the tile */\n  @Method()\n  async show() {\n    this.visible = true;\n  }\n\n  @State() hasIconSlot = false;\n\n  @State() hasLabelSlot = false;\n\n  connectedCallback() {\n    this.handleSlotChange = this.handleSlotChange.bind(this);\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n  }\n\n  handleSlotChange() {\n    this.hasIconSlot = hasSlot(this.host, 'icon');\n    this.hasLabelSlot = hasSlot(this.host, 'label');\n\n    if (this.hasIconSlot) {\n      let slot: HTMLElement = this.host.querySelector(`[slot=\"icon\"]`);\n      slot.addEventListener('click', this.handleClickEvent);\n    }\n\n    if (this.hasLabelSlot) {\n      let slot: HTMLElement = this.host.querySelector(`[slot=\"label\"]`);\n      slot.addEventListener('click', this.handleClickEvent);\n    }\n  }\n\n  render() {\n    return (\n      <six-tooltip disabled={this.disableTooltip || this.label === ''} content={this.label}>\n        <div\n          part=\"base\"\n          class={{\n            tile: true,\n            'tile--visible': this.visible,\n            'tile--small': this.size === 'small',\n            'tile--medium': this.size === 'medium',\n            'tile--large': this.size === 'large',\n            'tile--elevated': this.elevated,\n          }}\n        >\n          <div part=\"header\" class=\"tile__header\">\n            <six-icon-button\n              class={{\n                'tile__header--hidden': !this.closeable,\n              }}\n              name=\"close\"\n              size={closeIconSize(this.size)}\n              onClick={this.handleCloseClickEvent}\n            />\n          </div>\n\n          <div part=\"body\" class=\"tile__body\">\n            {this.iconName && (\n              <six-icon onClick={this.handleClickEvent} size={iconSize(this.size)}>\n                {this.iconName}\n              </six-icon>\n            )}\n            {this.hasIconSlot && <slot name=\"icon\"></slot>}\n          </div>\n\n          <div\n            part=\"footer\"\n            class={{\n              'tile__footer--small': this.size === 'small',\n              'tile__footer--medium': this.size === 'medium',\n              'tile__footer--large': this.size === 'large',\n            }}\n          >\n            {this.label && (\n              <div\n                class={{\n                  '.label__footer': true,\n                }}\n                onClick={this.handleClickEvent}\n              >\n                {this.label}\n              </div>\n            )}\n            {this.hasLabelSlot && <slot name=\"label\"></slot>}\n          </div>\n        </div>\n      </six-tooltip>\n    );\n  }\n\n  private handleCloseClickEvent = () => {\n    this.visible = false;\n    this.sixTileClose.emit();\n  };\n\n  private handleClickEvent = () => {\n    this.sixTileSelected.emit();\n  };\n}\n\nconst closeIconSize = (size: string) => {\n  return {\n    small: 'xxSmall',\n    medium: 'medium',\n    large: 'medium',\n  }[size] as 'xSmall' | 'medium';\n};\n\nconst iconSize = (size: string) => {\n  return {\n    small: 'xLarge',\n    medium: 'xxLarge',\n    large: 'xxxLarge',\n  }[size] as 'xLarge' | 'xxLarge' | 'xxxLarge';\n};\n"],"mappings":"6FAAA,MAAMA,EAAa,moE,MCcNC,EAAO,M,0HAkIVC,KAAAC,sBAAwB,KAC9BD,KAAKE,QAAU,MACfF,KAAKG,aAAaC,MAAM,EAGlBJ,KAAAK,iBAAmB,KACzBL,KAAKM,gBAAgBF,MAAM,E,WApIb,G,uCAMI,K,cAGD,M,oBAGe,K,cAGE,M,UAG0B,S,aAE3C,K,iBAoBI,M,kBAEC,K,CAZxBG,aACEP,KAAKE,QAAU,K,CAKjBK,aACEP,KAAKE,QAAU,I,CAOjBM,oBACER,KAAKS,iBAAmBT,KAAKS,iBAAiBC,KAAKV,K,CAGrDW,oBACEX,KAAKS,kB,CAGPA,mBACET,KAAKY,YAAcC,EAAQb,KAAKc,KAAM,QACtCd,KAAKe,aAAeF,EAAQb,KAAKc,KAAM,SAEvC,GAAId,KAAKY,YAAa,CACpB,IAAII,EAAoBhB,KAAKc,KAAKG,cAAc,iBAChDD,EAAKE,iBAAiB,QAASlB,KAAKK,iB,CAGtC,GAAIL,KAAKe,aAAc,CACrB,IAAIC,EAAoBhB,KAAKc,KAAKG,cAAc,kBAChDD,EAAKE,iBAAiB,QAASlB,KAAKK,iB,EAIxCc,SACE,OACEC,EAAA,eAAaC,SAAUrB,KAAKsB,gBAAkBtB,KAAKuB,QAAU,GAAIC,QAASxB,KAAKuB,OAC7EH,EAAA,OACEK,KAAK,OACLC,MAAO,CACLC,KAAM,KACN,gBAAiB3B,KAAKE,QACtB,cAAeF,KAAK4B,OAAS,QAC7B,eAAgB5B,KAAK4B,OAAS,SAC9B,cAAe5B,KAAK4B,OAAS,QAC7B,iBAAkB5B,KAAK6B,WAGzBT,EAAA,OAAKK,KAAK,SAASC,MAAM,gBACvBN,EAAA,mBACEM,MAAO,CACL,wBAAyB1B,KAAK8B,WAEhCC,KAAK,QACLH,KAAMI,EAAchC,KAAK4B,MACzBK,QAASjC,KAAKC,yBAIlBmB,EAAA,OAAKK,KAAK,OAAOC,MAAM,cACpB1B,KAAKkC,UACJd,EAAA,YAAUa,QAASjC,KAAKK,iBAAkBuB,KAAMO,EAASnC,KAAK4B,OAC3D5B,KAAKkC,UAGTlC,KAAKY,aAAeQ,EAAA,QAAMW,KAAK,UAGlCX,EAAA,OACEK,KAAK,SACLC,MAAO,CACL,sBAAuB1B,KAAK4B,OAAS,QACrC,uBAAwB5B,KAAK4B,OAAS,SACtC,sBAAuB5B,KAAK4B,OAAS,UAGtC5B,KAAKuB,OACJH,EAAA,OACEM,MAAO,CACL,iBAAkB,MAEpBO,QAASjC,KAAKK,kBAEbL,KAAKuB,OAGTvB,KAAKe,cAAgBK,EAAA,QAAMW,KAAK,Y,6BAiB7C,MAAMC,EAAiBJ,IACd,CACLQ,MAAO,UACPC,OAAQ,SACRC,MAAO,UACPV,IAGJ,MAAMO,EAAYP,IACT,CACLQ,MAAO,SACPC,OAAQ,UACRC,MAAO,YACPV,I"}

package/dist/ui-library/p-8187701c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixSidebarItemCss","SixSidebarItem","render","h","class","this","selected","disabled","role"],"sources":["./src/components/six-sidebar-item/six-sidebar-item.scss?tag=six-sidebar-item&encapsulation=shadow","./src/components/six-sidebar-item/six-sidebar-item.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n.sidebar-item {\n  font-size: 0.9rem;\n  color: var(--six-sidebar-color);\n  cursor: pointer;\n  padding: 8px 8px 16px 16px;\n  font-family: var(--six-font-family);\n\n  &:hover:not(.sidebar-item--disabled) {\n    color: var(--six-color-web-rock-600);\n  }\n\n  &.sidebar-item--disabled {\n    outline: none;\n    color: var(--six-input-color-disabled);\n    cursor: not-allowed;\n  }\n\n  &.sidebar-item--selected {\n    font-weight: var(--six-font-weight-bold);\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the nested displayed text of the item.\n */\n\n@Component({\n  tag: 'six-sidebar-item',\n  styleUrl: 'six-sidebar-item.scss',\n  shadow: true,\n})\nexport class SixSidebarItem {\n  /** A unique value to store in the sidebar item. This can be used as a way to identify sidebar items when selected. */\n  @Prop({ reflect: true }) value = '';\n\n  /** Set to true to draw the item in a selected state. */\n  @Prop({ reflect: true }) selected = false;\n\n  /** Set to true to draw the sidebar item in a disabled state. */\n  @Prop({ reflect: true }) disabled = false;\n\n  render() {\n    return (\n      <div\n        class={{\n          'sidebar-item': true,\n          'sidebar-item--selected': this.selected,\n          'sidebar-item--disabled': this.disabled,\n        }}\n        role=\"menuitem\"\n        aria-selected={this.selected ? 'true' : 'false'}\n        aria-disabled={this.disabled ? 'true' : 'false'}\n      >\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"mappings":"2CAAA,MAAMA,EAAoB,8a,MCcbC,EAAc,M,oCAEQ,G,cAGG,M,cAGA,K,CAEpCC,SACE,OACEC,EAAA,OACEC,MAAO,CACL,eAAgB,KAChB,yBAA0BC,KAAKC,SAC/B,yBAA0BD,KAAKE,UAEjCC,KAAK,WAAU,gBACAH,KAAKC,SAAW,OAAS,QAAO,gBAChCD,KAAKE,SAAW,OAAS,SAExCJ,EAAA,a"}

package/dist/ui-library/p-94ab37b2.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sixFileListItemCss","SixFileListItem","this","downloadFile","nodownload","downloadEvent","emit","fileId","identifier","name","removeFile","nodelete","removeEvent","render","h","class","onClick","date","size","undefined","Math","round"],"sources":["./src/components/six-file-list-item/six-file-list-item.scss?tag=six-file-list-item&encapsulation=shadow","./src/components/six-file-list-item/six-file-list-item.tsx"],"sourcesContent":[".six-files-list-item {\n  padding-bottom: 0.5rem;\n\n  &__name {\n    color: var(--six-color-action-600);\n    cursor: pointer;\n\n    &--disabled {\n      cursor: inherit;\n      color: var(--six-color-web-rock-500);\n    }\n\n    &:hover:not(&--disabled) {\n      color: var(--six-color-action-500);\n    }\n  }\n\n  &__date {\n    padding-left: 1rem;\n    color: var(--six-color-web-rock-600);\n  }\n\n  &__size {\n    padding-left: 1rem;\n    color: var(--six-color-web-rock-600);\n  }\n\n  &__icon {\n    padding-left: 0.5rem;\n    display: inline-block;\n    transform: translateY(-1px);\n    cursor: pointer;\n    color: var(--six-color-web-rock-600);\n\n    &--disabled {\n      cursor: not-allowed;\n      color: var(--six-color-web-rock-500);\n    }\n\n    &:hover:not(&--disabled) {\n      color: var(--six-color-web-rock-900);\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\n\nexport interface SixFileListDownloadPayload {\n  fileId: string;\n  name: string;\n}\n\nexport interface SixFileListRemovePayload {\n  fileId: string;\n  name: string;\n}\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n */\n@Component({\n  tag: 'six-file-list-item',\n  styleUrl: 'six-file-list-item.scss',\n  shadow: true,\n})\nexport class SixFileListItem {\n  /** An id to clearly identify the file */\n  @Prop({ reflect: true }) identifier = '';\n\n  /** The filename */\n  @Prop({ reflect: true }) name = '';\n\n  /** The date when the file was uploaded */\n  @Prop({ reflect: true }) date = '';\n\n  /** The file size. This number will be divided by 1024 to show the filesize in KB */\n  @Prop({ reflect: true }) size: number;\n\n  /** Set to true if you don't want to allow to download this file */\n  @Prop({ reflect: true }) nodownload = false;\n\n  /** Set to true if you don't want to allow to delete this file */\n  @Prop({ reflect: true }) nodelete = false;\n\n  /** Triggered on file download. */\n  @Event({ eventName: 'six-file-list-item-download' }) downloadEvent: EventEmitter<SixFileListDownloadPayload>;\n\n  /** Triggered on file remove. */\n  @Event({ eventName: 'six-file-list-item-remove' }) removeEvent: EventEmitter<SixFileListRemovePayload>;\n\n  downloadFile = () => {\n    if (this.nodownload) {\n      return;\n    }\n\n    this.downloadEvent.emit({ fileId: this.identifier, name: this.name });\n  };\n\n  removeFile = () => {\n    if (this.nodelete) {\n      return;\n    }\n\n    this.removeEvent.emit({ fileId: this.identifier, name: this.name });\n  };\n\n  render() {\n    return (\n      <div class=\"six-files-list-item\">\n        <span\n          class={{\n            'six-files-list-item__name': true,\n            'six-files-list-item__name--disabled': this.nodownload,\n          }}\n          onClick={this.downloadFile}\n        >\n          {this.name}\n        </span>\n        <span class=\"six-files-list-item__date\">{this.date}</span>\n        {this.size !== undefined && <span class=\"six-files-list-item__size\">{Math.round(this.size / 1024)} KB</span>}\n        <six-icon\n          class={{\n            'six-files-list-item__icon': true,\n            'six-files-list-item__icon--disabled': this.nodelete,\n          }}\n          size=\"small\"\n          onClick={this.removeFile}\n        >\n          delete\n        </six-icon>\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,8zB,MCsBdC,EAAe,M,2IAyB1BC,KAAAC,aAAe,KACb,GAAID,KAAKE,WAAY,CACnB,M,CAGFF,KAAKG,cAAcC,KAAK,CAAEC,OAAQL,KAAKM,WAAYC,KAAMP,KAAKO,MAAO,EAGvEP,KAAAQ,WAAa,KACX,GAAIR,KAAKS,SAAU,CACjB,M,CAGFT,KAAKU,YAAYN,KAAK,CAAEC,OAAQL,KAAKM,WAAYC,KAAMP,KAAKO,MAAO,E,gBApC/B,G,UAGN,G,UAGA,G,oCAMM,M,cAGF,K,CAwBpCI,SACE,OACEC,EAAA,OAAKC,MAAM,uBACTD,EAAA,QACEC,MAAO,CACL,4BAA6B,KAC7B,sCAAuCb,KAAKE,YAE9CY,QAASd,KAAKC,cAEbD,KAAKO,MAERK,EAAA,QAAMC,MAAM,6BAA6Bb,KAAKe,MAC7Cf,KAAKgB,OAASC,WAAaL,EAAA,QAAMC,MAAM,6BAA6BK,KAAKC,MAAMnB,KAAKgB,KAAO,MAAK,OACjGJ,EAAA,YACEC,MAAO,CACL,4BAA6B,KAC7B,sCAAuCb,KAAKS,UAE9CO,KAAK,QACLF,QAASd,KAAKQ,YAAU,U"}

package/dist/ui-library/p-9a860acc.js

@@ -1,2 +0,0 @@
-const t=t=>e=>Object.keys(t).every((s=>t[s]===e[s]));class e{constructor(){this.eventListeners=[];this.add=(t,e,s,i=null)=>{this.eventListeners.push({el:t,name:e,listener:s,identifier:i});t.addEventListener(e,s)};this.remove=(e,s,i)=>{const n=t({el:e,name:s,listener:i});this.eventListeners=this.getFilteredEventListeners(n)};this.removeByIdentifier=t=>{const e=e=>e.identifier===t;const s=this.eventListeners.find(e)!==undefined;if(!s){return}this.eventListeners=this.getFilteredEventListeners(e)};this.removeAll=()=>{while(this.eventListeners.length){const{el:t,name:e,listener:s}=this.eventListeners.pop();t.removeEventListener(e,s)}}}getFilteredEventListeners(t){return this.eventListeners.filter((e=>{if(t(e)){e.el.removeEventListener(e.name,e.listener);return false}else{return true}}))}}export{e as E};
-//# sourceMappingURL=p-9a860acc.js.map

package/dist/ui-library/p-9a860acc.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["equals","a","b","Object","keys","every","key","EventListeners","constructor","this","eventListeners","add","el","name","listener","identifier","push","addEventListener","remove","sameItem","getFilteredEventListeners","removeByIdentifier","foundListener","find","undefined","removeAll","length","pop","removeEventListener","filter","item"],"sources":["./src/utils/event-listeners.ts"],"sourcesContent":["interface EventListener {\n  el: DocumentAndElementEventHandlers;\n  name: string;\n  listener: EventListenerOrEventListenerObject;\n  identifier?: string | null;\n}\n\nconst equals =\n  <A extends Object>(a: A) =>\n  <B extends Object>(b: B) =>\n    Object.keys(a).every((key) => a[key] === b[key]);\n\nexport class EventListeners {\n  eventListeners: EventListener[] = [];\n\n  add = <T extends DocumentAndElementEventHandlers>(\n    el: T,\n    name: string,\n    listener: EventListenerOrEventListenerObject,\n    identifier = null\n  ) => {\n    this.eventListeners.push({ el, name, listener, identifier });\n    el.addEventListener(name, listener);\n  };\n\n  remove = <T extends DocumentAndElementEventHandlers>(\n    el: T,\n    name: string,\n    listener: EventListenerOrEventListenerObject\n  ) => {\n    const sameItem = equals({ el, name, listener });\n    this.eventListeners = this.getFilteredEventListeners(sameItem);\n  };\n\n  removeByIdentifier = (identifier: string) => {\n    const sameItem = (el) => el.identifier === identifier;\n    const foundListener = this.eventListeners.find(sameItem) !== undefined;\n\n    if (!foundListener) {\n      return;\n    }\n\n    this.eventListeners = this.getFilteredEventListeners(sameItem);\n  };\n\n  private getFilteredEventListeners(sameItem: (el) => boolean) {\n    return this.eventListeners.filter((item) => {\n      if (sameItem(item)) {\n        item.el.removeEventListener(item.name, item.listener);\n        return false;\n      } else {\n        return true;\n      }\n    });\n  }\n\n  removeAll = () => {\n    while (this.eventListeners.length) {\n      const { el, name, listener } = this.eventListeners.pop();\n      el.removeEventListener(name, listener);\n    }\n  };\n}\n"],"mappings":"AAOA,MAAMA,EACeC,GACAC,GACjBC,OAAOC,KAAKH,GAAGI,OAAOC,GAAQL,EAAEK,KAASJ,EAAEI,K,MAElCC,EAAbC,cACEC,KAAAC,eAAkC,GAElCD,KAAAE,IAAM,CACJC,EACAC,EACAC,EACAC,EAAa,QAEbN,KAAKC,eAAeM,KAAK,CAAEJ,KAAIC,OAAMC,WAAUC,eAC/CH,EAAGK,iBAAiBJ,EAAMC,EAAS,EAGrCL,KAAAS,OAAS,CACPN,EACAC,EACAC,KAEA,MAAMK,EAAWnB,EAAO,CAAEY,KAAIC,OAAMC,aACpCL,KAAKC,eAAiBD,KAAKW,0BAA0BD,EAAS,EAGhEV,KAAAY,mBAAsBN,IACpB,MAAMI,EAAYP,GAAOA,EAAGG,aAAeA,EAC3C,MAAMO,EAAgBb,KAAKC,eAAea,KAAKJ,KAAcK,UAE7D,IAAKF,EAAe,CAClB,M,CAGFb,KAAKC,eAAiBD,KAAKW,0BAA0BD,EAAS,EAchEV,KAAAgB,UAAY,KACV,MAAOhB,KAAKC,eAAegB,OAAQ,CACjC,MAAMd,GAAEA,EAAEC,KAAEA,EAAIC,SAAEA,GAAaL,KAAKC,eAAeiB,MACnDf,EAAGgB,oBAAoBf,EAAMC,E,GAdzBM,0BAA0BD,GAChC,OAAOV,KAAKC,eAAemB,QAAQC,IACjC,GAAIX,EAASW,GAAO,CAClBA,EAAKlB,GAAGgB,oBAAoBE,EAAKjB,KAAMiB,EAAKhB,UAC5C,OAAO,K,KACF,CACL,OAAO,I"}