npm - @six-group/ui-library - Versions diffs - 0.0.0-insider.b26fdef → 0.0.0-insider.b2db78f - Mend

@six-group/ui-library 0.0.0-insider.b26fdef → 0.0.0-insider.b2db78f

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2558) hide show

package/dist/ui-library/p-15d09aea.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixButtonCss","SixButton","constructor","hostRef","this","hasFocus","hasLabel","hasPrefix","hasSuffix","type","size","caret","disabled","loading","pill","circle","submit","reset","name","value","handleSlotChange","hasSlot","host","prefixIcon","querySelector","suffixIcon","tagName","toLowerCase","setAttribute","mapSizeToIconSize","handleBlur","sixBlur","emit","handleFocus","sixFocus","handleClick","event","preventDefault","stopPropagation","submitForm","componentWillLoad","setFocus","options","_a","nativeButton","focus","removeFocus","blur","buttonSize","sizeMap","small","medium","large","render","isLink","href","isButton","Button","h","key","onClick","class","ref","el","part","button","undefined","tabindex","target","download","rel","onBlur","onFocus","onSlotchange","viewBox","fill","stroke","points"],"sources":["src/components/six-button/six-button.scss?tag=six-button&encapsulation=shadow","src/components/six-button/six-button.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: inline-block;\n width: auto;\n cursor: pointer;\n}\n\n.button {\n display: inline-flex;\n align-items: stretch;\n justify-content: center;\n width: 100%;\n border-style: solid;\n border-width: var(--six-border-width);\n border-radius: 0;\n font-family: var(--six-font-family);\n font-weight: var(--six-font-weight-semibold);\n text-decoration: none;\n user-select: none;\n white-space: nowrap;\n vertical-align: middle;\n padding: 0;\n transition: var(--six-transition-fast) background-color, var(--six-transition-fast) color,\n var(--six-transition-fast) border, var(--six-transition-fast) box-shadow;\n cursor: inherit;\n\n &::-moz-focus-inner {\n border: 0;\n }\n\n &:focus {\n outline: none;\n }\n\n &.button--disabled {\n pointer-events: none;\n }\n\n ::slotted(six-icon) {\n // Clicks on icons shouldn't prevent the button from gaining focus\n pointer-events: none;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n}\n\n.button-wrapper--disabled {\n cursor: not-allowed;\n}\n\n.button__prefix,\n.button__suffix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Standard buttons\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button {\n &:focus-visible {\n outline: var(--six-focus-ring);\n outline-offset: var(--six-focus-ring-offset);\n }\n\n &.button--secondary {\n background-color: var(--six-color-white);\n border-color: var(--six-color-web-rock-900);\n color: var(--six-color-web-rock-900);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-web-rock-100);\n }\n\n &:active:not(.button--disabled) {\n background-color: var(--six-color-web-rock-300);\n border-color: var(--six-color-web-rock-900);\n border-width: 1px;\n }\n }\n\n &.button--primary {\n background-color: var(--six-color-web-rock-900);\n border-color: var(--six-color-web-rock-900);\n color: var(--six-color-white);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-web-rock-800);\n border-color: var(--six-color-web-rock-800);\n }\n\n &:active:not(.button--disabled) {\n background-color: var(--six-color-web-rock-900);\n border-color: var(--six-color-web-rock-900);\n opacity: 70%;\n }\n }\n\n &.button--link {\n background-color: transparent;\n border-color: transparent;\n color: var(--six-color-action-500);\n\n &.button--disabled {\n color: var(--six-color-web-rock-400);\n }\n\n &:hover:not(.button--disabled) {\n color: var(--six-color-action-600);\n }\n\n &:active:not(.button--disabled) {\n color: var(--six-color-action-light-to-be-defined);\n }\n }\n\n &.button--danger {\n background-color: var(--six-color-danger-800);\n border-color: var(--six-color-danger-800);\n color: var(--six-color-white);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-danger-900);\n border-color: var(--six-color-danger-900);\n }\n\n &:active:not(.button--disabled) {\n background-color: var(--six-color-danger-800);\n border-color: var(--six-color-danger-800);\n opacity: 70%;\n }\n }\n\n &.button--warning {\n background-color: var(--six-color-warning-700);\n border-color: var(--six-color-warning-700);\n color: var(--six-color-web-rock-900);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-warning-800);\n border-color: var(--six-color-warning-800);\n }\n\n &:active:not(.button--disabled) {\n background-color: var(--six-color-warning-700);\n border-color: var(--six-color-warning-700);\n opacity: 70%;\n }\n }\n\n &.button--success {\n background-color: var(--six-color-success-500);\n border-color: var(--six-color-success-500);\n color: var(--six-color-web-rock-900);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-success-600);\n border-color: var(--six-color-success-600);\n }\n\n &:active:not(.button--disabled) {\n background-color: var(--six-color-success-500);\n border-color: var(--six-color-success-500);\n opacity: 70%;\n }\n }\n\n &.button--action {\n background-color: var(--six-color-action-500);\n border-color: var(--six-color-action-500);\n color: var(--six-color-white);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-action-600);\n border-color: var(--six-color-action-600);\n }\n\n &:active:not(.button--disabled) {\n background-color: var(--six-color-action-500);\n border-color: var(--six-color-action-500);\n opacity: 70%;\n }\n }\n\n &.button--action-outline {\n border-color: var(--six-color-action-500);\n background-color: var(--six-color-white);\n color: var(--six-color-action-500);\n\n &.button--disabled {\n background-color: var(--six-color-web-rock-400);\n border-color: var(--six-color-web-rock-400);\n color: var(--six-color-web-rock-700);\n }\n\n &:hover:not(.button--disabled) {\n background-color: var(--six-color-web-rock-100);\n }\n\n &:active:not(.button--disabled) {\n border-color: var(--six-color-action-500);\n opacity: 70%;\n }\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Size modifiers\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button--small {\n font-size: var(--six-button-font-size-small);\n height: var(--six-height-small);\n line-height: calc(var(--six-height-small) - var(--six-border-width) * 2);\n}\n\n.button--medium {\n font-size: var(--six-button-font-size-medium);\n height: var(--six-height-medium);\n line-height: calc(var(--six-height-medium) - var(--six-border-width) * 2);\n}\n\n.button--large {\n font-size: var(--six-button-font-size-large);\n height: var(--six-height-large);\n line-height: calc(var(--six-height-large) - var(--six-border-width) * 2);\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Pill modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button--pill {\n &.button--small {\n border-radius: var(--six-height-small);\n }\n\n &.button--medium {\n border-radius: var(--six-height-medium);\n }\n\n &.button--large {\n border-radius: var(--six-height-large);\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Circle modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button--circle {\n padding-left: 0;\n padding-right: 0;\n font-size: revert;\n\n &.button--small {\n width: var(--six-height-small);\n border-radius: 50%;\n }\n\n &.button--medium {\n width: var(--six-height-medium);\n border-radius: 50%;\n }\n\n &.button--large {\n width: var(--six-height-large);\n border-radius: 50%;\n }\n\n .button__prefix,\n .button__suffix,\n .button__caret {\n display: none;\n\n svg {\n color: var(--six-color-web-rock-900);\n }\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Caret modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button--caret {\n .button__suffix {\n display: none;\n }\n\n .button__caret {\n display: flex;\n align-items: center;\n\n svg {\n color: var(--six-color-web-rock-900);\n width: 1em;\n height: 1em;\n }\n }\n}\n\n.button--primary,\n.button--action,\n.button--danger {\n .button__caret {\n svg {\n color: var(--six-color-white);\n }\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Loading modifier\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button--loading {\n position: relative;\n cursor: wait;\n\n .button__prefix,\n .button__label,\n .button__suffix,\n .button__caret {\n visibility: hidden;\n }\n\n six-spinner {\n --indicator-color: currentColor;\n position: absolute;\n height: 1em;\n width: 1em;\n top: calc(50% - 0.5em);\n left: calc(50% - 0.5em);\n }\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Badges\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button ::slotted(six-badge) {\n position: absolute;\n top: 0;\n right: 0;\n transform: translateY(-50%) translateX(50%);\n pointer-events: none;\n}\n\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n// Button spacing\n////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////\n\n.button--has-label {\n &.button--small .button__label {\n padding: 0 var(--six-spacing-small);\n }\n\n &.button--medium .button__label {\n padding: 0 var(--six-spacing-medium);\n }\n\n &.button--large .button__label {\n padding: 0 var(--six-spacing-large);\n }\n}\n\n.button--has-prefix {\n &.button--small {\n padding-left: var(--six-spacing-x-small);\n\n .button__label {\n padding-left: var(--six-spacing-x-small);\n }\n }\n\n &.button--medium {\n padding-left: var(--six-spacing-small);\n\n .button__label {\n padding-left: var(--six-spacing-small);\n }\n }\n\n &.button--large {\n padding-left: var(--six-spacing-small);\n\n .button__label {\n padding-left: var(--six-spacing-small);\n }\n }\n}\n\n.button--has-suffix,\n.button--caret {\n &.button--small {\n padding-right: var(--six-spacing-x-small);\n\n .button__label {\n padding-right: var(--six-spacing-x-small);\n }\n }\n\n &.button--medium {\n padding-right: var(--six-spacing-small);\n\n .button__label {\n padding-right: var(--six-spacing-small);\n }\n }\n\n &.button--large {\n padding-right: var(--six-spacing-small);\n\n .button__label {\n padding-right: var(--six-spacing-small);\n }\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State } from '@stencil/core';\nimport { hasSlot } from '../../utils/slot';\nimport { EmptyPayload } from '../../utils/types';\nimport { submitForm } from '../../utils/form';\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 button's label.\n * @slot prefix - Used to prepend an icon or similar element to the button.\n * @slot suffix - Used to append an icon or similar element to the button.\n *\n * @part base - The component's base wrapper.\n * @part prefix - The prefix container.\n * @part label - The button's label.\n * @part suffix - The suffix container.\n * @part caret - The button's caret.\n */\n\n@Component({\n tag: 'six-button',\n styleUrl: 'six-button.scss',\n shadow: true,\n})\nexport class SixButton {\n private nativeButton?: HTMLButtonElement | HTMLAnchorElement;\n\n @Element() host!: HTMLSixButtonElement;\n\n @State() hasFocus = false;\n @State() hasLabel = false;\n @State() hasPrefix = false;\n @State() hasSuffix = false;\n\n /** The button's type. */\n @Prop({ reflect: true }) type:\n | 'secondary'\n | 'primary'\n | 'link'\n | 'success'\n | 'warning'\n | 'danger'\n | 'action'\n | 'action-outline' = 'primary';\n\n /** The button's size. */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Set to true to draw the button with a caret for use with dropdowns, popovers, etc. */\n @Prop() caret = false;\n\n /** Set to true to disable the button. */\n @Prop({ reflect: true }) disabled = false;\n\n /** Set to true to draw the button in a loading state. */\n @Prop({ reflect: true }) loading = false;\n\n /** Set to true to draw a pill-style button with rounded edges. */\n @Prop({ reflect: true }) pill = false;\n\n /** Set to true to draw a circle button. */\n @Prop({ reflect: true }) circle = false;\n\n /** Indicates if activating the button should submit the form. Ignored when `href` is set. */\n @Prop({ reflect: true }) submit = false;\n\n /** Indicates if activating the button should reset the form. */\n @Prop({ reflect: true }) reset = false;\n\n /** An optional name for the button. Ignored when `href` is set. */\n @Prop() name = '';\n\n /** An optional value for the button. Ignored when `href` is set. */\n @Prop() value = '';\n\n /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n @Prop() href?: string;\n\n /** Tells the browser where to open the link. Only used when `href` is set. */\n @Prop() target?: '_blank' | '_parent' | '_self' | '_top';\n\n /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n @Prop() download?: string;\n\n /** Emitted when the button loses focus. */\n @Event({ eventName: 'six-button-blur' }) sixBlur!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the button gains focus. */\n @Event({ eventName: 'six-button-focus' }) sixFocus!: EventEmitter<EmptyPayload>;\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n /** Sets focus on the button. */\n @Method()\n async setFocus(options?: FocusOptions) {\n this.nativeButton?.focus(options);\n }\n\n /** Removes focus from the button. */\n @Method()\n async removeFocus() {\n this.nativeButton?.blur();\n }\n\n private handleSlotChange = () => {\n this.hasLabel = hasSlot(this.host);\n this.hasPrefix = hasSlot(this.host, 'prefix');\n this.hasSuffix = hasSlot(this.host, 'suffix');\n\n // set the correct icon size for suffix and prefix icons\n const prefixIcon = this.host.querySelector('[slot=\"prefix\"]');\n const suffixIcon = this.host.querySelector('[slot=\"suffix\"]');\n\n if (prefixIcon?.tagName.toLowerCase() === 'six-icon') {\n prefixIcon.setAttribute('size', this.mapSizeToIconSize(this.size));\n }\n\n if (suffixIcon?.tagName.toLowerCase() === 'six-icon') {\n suffixIcon.setAttribute('size', this.mapSizeToIconSize(this.size));\n }\n };\n\n private mapSizeToIconSize(buttonSize: 'small' | 'medium' | 'large'): string {\n const sizeMap = {\n small: 'xSmall',\n medium: 'small',\n large: 'medium',\n };\n return sizeMap[buttonSize] || 'small'; // Default to small\n }\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.sixBlur.emit();\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.sixFocus.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n if (this.disabled || this.loading) {\n event.preventDefault();\n event.stopPropagation();\n return;\n }\n\n if (this.submit) {\n event.preventDefault();\n submitForm(this.host);\n }\n };\n\n render() {\n const isLink = this.href != null;\n const isButton = !isLink;\n const Button = isLink ? 'a' : 'button';\n\n return (\n <div onClick={this.handleClick} class={{ 'button-wrapper--disabled': this.disabled }}>\n <Button\n ref={(el) => (this.nativeButton = el)}\n part=\"base\"\n class={{\n button: true,\n\n // Types\n 'button--secondary': this.type === 'secondary',\n 'button--primary': this.type === 'primary',\n 'button--link': this.type === 'link',\n 'button--success': this.type === 'success',\n 'button--warning': this.type === 'warning',\n 'button--danger': this.type === 'danger',\n 'button--action': this.type === 'action',\n 'button--action-outline': this.type === 'action-outline',\n\n // Sizes\n 'button--small': this.size === 'small',\n 'button--medium': this.size === 'medium',\n 'button--large': this.size === 'large',\n\n // Modifiers\n 'button--caret': this.caret,\n 'button--circle': this.circle,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--loading': this.loading,\n 'button--pill': this.pill,\n 'button--has-label': this.hasLabel,\n 'button--has-prefix': this.hasPrefix,\n 'button--has-suffix': this.hasSuffix,\n }}\n disabled={isButton ? this.disabled : undefined}\n tabindex={this.disabled ? '-1' : undefined}\n type={isButton ? (this.submit ? 'submit' : this.reset ? 'reset' : 'button') : undefined}\n name={isButton ? this.name : undefined}\n value={isButton ? this.value : undefined}\n href={isLink ? this.href : undefined}\n target={isLink && this.target != null ? this.target : undefined}\n download={isLink && this.download != null ? this.download : undefined}\n rel={isLink && this.target != null ? 'noreferrer noopener' : undefined}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n data-testid=\"button\"\n >\n <span part=\"prefix\" class=\"button__prefix\">\n <slot onSlotchange={this.handleSlotChange} name=\"prefix\" />\n </span>\n <span part=\"label\" class=\"button__label\">\n <slot onSlotchange={this.handleSlotChange} />\n </span>\n <span part=\"suffix\" class=\"button__suffix\">\n <slot onSlotchange={this.handleSlotChange} name=\"suffix\" />\n </span>\n {this.caret && (\n <span part=\"caret\" class=\"button__caret\">\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n >\n <polyline points=\"6 9 12 15 18 9\" />\n </svg>\n </span>\n )}\n\n {this.loading && <six-spinner />}\n </Button>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-16fefaf7.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as e,h as i,g as s}from"./p-BF09Gr5y.js";import{I as n,a as r}from"./p-WA6V9mN8.js";import{D as h,b as o,d as l}from"./p-ltzGzaAu.js";import{E as c}from"./p-C4h4qpGl.js";const u=".item_picker__container{width:2.5em;display:flex;flex-wrap:wrap;justify-content:center}.item_picker__container:focus-visible{outline:var(--six-focus-ring);outline-offset:0}.item_picker__content{font-size:1.5rem}.item_picker__btn{cursor:pointer;width:2.5em;height:2.5em;display:flex;vertical-align:middle;align-items:center;justify-content:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:var(--six-color-web-rock-500)}.item_picker__btn:hover{background-color:var(--six-color-web-rock-100);border-radius:100%}.item_picker__btn:active{color:var(--six-color-web-rock-400)}.item_picker__btn--disabled{color:var(--six-color-web-rock-300);cursor:not-allowed}.item_picker__btn--disabled:hover{background-color:initial}.item_picker__btn--disabled:active{color:var(--six-color-web-rock-300)}.item_picker__btn:focus-visible{outline:var(--six-focus-ring);outline-offset:0}";const a="ABCDEFGHIJKLMNOPQRSTUVWXYZ";const d=[...a].flatMap((t=>[t,t.toLowerCase()]));const m={alphabet:d,letterIndexes:Object.fromEntries(d.map(((t,e)=>[t,e])))};const p={alphabet:[...a].flatMap((t=>[t])),letterIndexes:Object.fromEntries([...a].map(((t,e)=>[t,e])))};const b={alphabet:[...a.toLowerCase()].flatMap((t=>[t])),letterIndexes:Object.fromEntries([...a.toLowerCase()].map(((t,e)=>[t,e])))};const f=t=>Object.fromEntries([...t].map(((t,e)=>[t,e])));const g=`[SIX-ITEM-PICKER]`;const x=(t,e)=>t-e;const I=(t,e)=>t+e;const v="debounced-item-picker";const _=class{constructor(i){t(this,i);this.sixChange=e(this,"six-item-picker-change");this.sixChangeDebounced=e(this,"six-item-picker-change-debounced");this.eventListeners=new c;this.value="";this.type=n.NUMBER;this.roundtrip=true;this.step=1;this.padded=false;this.paddingLength=2;this.paddingChar="0";this.paddingDirection=r.BEFORE;this.timeout=h;this.interval=o;this.debounce=h;this._items=[];this._itemIndexes={};this.handleSixItemPickerChangeDebounced=()=>{this.sixChangeDebounced.emit(this.value)}}handleValueChange(){this.setup()}debounceChanged(){this.eventListeners.removeByIdentifier(v);this.eventListeners.add(this.host,"six-item-picker-change",l(this.handleSixItemPickerChangeDebounced,this.debounce),v)}handleSetChange(){this.setup();this.min=this._items[0];this.max=this.getLastStringItem()}componentWillLoad(){this.setup()}componentDidLoad(){this.eventListeners.add(this.host,"six-item-picker-change",l(this.handleSixItemPickerChangeDebounced,this.debounce),v)}disconnectedCallback(){this.eventListeners.removeAll()}setup(){if(this.isNumber()){this.setupNumberItems()}else{this.setUpStringItems()}}setupNumberItems(){var t;if(this.isInvalidNumber()){console.warn(`${g} Expected number but value is not a number: "${this.value}"`);console.info(`${g} Will set value to either minimum or if not provided to zero.`);this.value=(t=this.min)!==null&&t!==void 0?t:0}}setUpStringItems(){this._items=this.getStringItems();this._itemIndexes=this.getItemIndexes();const t=this._items.find((t=>String(t)===String(this.value)))===undefined;if(t){console.warn(`${g} Expected item from item set but value was not found in set: "${this.value}"`);console.info(`${g} Will set value to either minimum or if not provided to "${this._items[0]}".`);this.value=this._items[0]}if(this.min===undefined){if(!this.roundtrip){console.warn(`${g} Expected a min value`);console.info(`${g} Will set min value to ${this._items[0]}`)}this.min=this._items[0]}if(this.max===undefined){const t=this.getLastStringItem();if(!this.roundtrip){console.warn(`${g} Expected a min value if roundtrip is enabled`);console.info(`${g} Will set min value to ${t}`)}this.max=t}}getLastStringItem(){return this._items[this._items.length-1]}getStringItems(){switch(this.type){case n.NUMBER:console.warn(`${g}: unexpected type ${this.type}`);return[];case n.LETTER:return m.alphabet;case n.CAPITAL_LETTER:return p.alphabet;case n.LOWER_LETTER:return b.alphabet;case n.CUSTOM:if(this.items==null\|\|this.items.length===0){console.warn(`${g}: no items defined for type ${this.type}`);return[]}return this.items}}getItemIndexes(){switch(this.type){case n.NUMBER:console.warn(`${g}: unexpected type ${this.type}`);return{};case n.LETTER:return m.letterIndexes;case n.CAPITAL_LETTER:return p.letterIndexes;case n.LOWER_LETTER:return b.letterIndexes;case n.CUSTOM:return f(this._items)}}previousItem(){if(this.isNumber()){this.previousNumber()}else{this.previousStringItem()}this.sixChange.emit(this.value)}previousNumber(){this.changeValue({isNextItemAllowed:()=>!this.isPreviousNumberDisabled(),getNextItem:()=>Number(this.value)-this.step,getRoundtripItem:()=>Number(this.max),isRoundtripPossible:()=>this.max===undefined&&this.roundtrip})}previousStringItem(){const t=String(this.value);const e=String(this.min);this.changeValue({isNextItemAllowed:()=>e===undefined\|\|this.getStringItemIndex(t)>this.getStringItemIndex(e),getNextItem:()=>this.getNextItemByOperation(x),getRoundtripItem:()=>String(this.max),isRoundtripPossible:()=>this.max==null&&this.roundtrip})}nextItem(){if(this.isNumber()){this.nextNumber()}else{this.nextStringItem()}this.sixChange.emit(this.value)}nextNumber(){this.changeValue({isNextItemAllowed:()=>!this.isNextNumberDisabled(),getNextItem:()=>Number(this.value)+this.step,getRoundtripItem:()=>Number(this.min),isRoundtripPossible:()=>this.min===undefined&&this.roundtrip})}getStringItemIndex(t){return this._itemIndexes[t]}nextStringItem(){const t=String(this.value);const e=String(this.max);this.changeValue({isNextItemAllowed:()=>e===undefined\|\|this.getStringItemIndex(t)<this.getStringItemIndex(e),getNextItem:()=>this.getNextItemByOperation(I),getRoundtripItem:()=>String(this.min),isRoundtripPossible:()=>this.min===undefined&&this.roundtrip})}getNextItemByOperation(t,e=this.step){const i=String(this.value);const s=t(this.getStringItemIndex(i),e);const n=this._items.length;const r=(s%n+n)%n;return this._items[r]}changeValue(t){if(t.isNextItemAllowed()){this.value=t.getNextItem();return}if(t.isRoundtripPossible()){console.error(`${g} Item picker is expected to perform a roundtrip, but either max or min value is missing so a roundtrip is not possible`);return}if(this.roundtrip){this.value=t.getRoundtripItem();return}console.warn(`${g} Roundtrip is not allowed, but was still triggered, please report this issue to the developer of six-item-picker`);this.sixChange.emit(this.value)}isNumber(){return this.type===n.NUMBER}isInvalidNumber(){return this.value===""\|\|isNaN(this.value)}isNextDisabled(){if(this.roundtrip){return false}if(this.isNumber()){return this.isNextNumberDisabled()}else{return this._itemIndexes[String(this.value)]+this.step>this._itemIndexes[String(this.max)]}}isNextNumberDisabled(){var t;return Number(this.value)+this.step>Number((t=this.max)!==null&&t!==void 0?t:Infinity)}isPrevDisabled(){if(this.roundtrip){return false}if(this.isNumber()){return this.isPreviousNumberDisabled()}else{return this._itemIndexes[String(this.value)]-this.step<this._itemIndexes[String(this.min)]}}isPreviousNumberDisabled(){var t;return Number(this.value)-this.step<Number((t=this.min)!==null&&t!==void 0?t:-Infinity)}onMouseDownNext(){if(this.isNextDisabled()){return}this.nextItem();this._timeoutNext=setTimeout((()=>{this._intervalNext=setInterval((()=>{this.nextItem()}),this.interval)}),this.timeout)}onMouseUpNext(){clearTimeout(this._timeoutNext);clearInterval(this._intervalNext)}onMouseDownPrev(){if(this.isPrevDisabled()){return}this.previousItem();this._timeoutPrev=setTimeout((()=>{this._intervalPrev=setInterval((()=>{this.previousItem()}),this.interval)}),this.timeout)}onMouseUpPrev(){clearTimeout(this._timeoutPrev);clearInterval(this._intervalPrev)}getFormattedValue(){if(this.value===undefined\|\|this.value===null){return this.value}if(!this.padded){return this.value}if(this.paddingDirection===r.BEFORE){return String(this.value).padStart(this.paddingLength,this.paddingChar)}else if(this.paddingDirection===r.AFTER){return String(this.value).padEnd(this.paddingLength,this.paddingChar)}return this.value}handleKeyPress(t){if(t.key==="Enter"){t.preventDefault();if(t.target===this.upButton){this.nextItem()}else if(t.target===this.downButton){this.previousItem()}}else if(t.key==="ArrowUp"){t.preventDefault();this.nextItem()}else if(t.key==="ArrowDown"){t.preventDefault();this.previousItem()}else if(t.key==="PageUp"){t.preventDefault();this.pageUp()}else if(t.key==="PageDown"){t.preventDefault();this.pageDown()}else if(t.key==="Home"){t.preventDefault();this.goToMin()}else if(t.key==="End"){t.preventDefault();this.goToMax()}}pageUp(){if(this.isNumber()){this.changeValue({isNextItemAllowed:()=>!this.isNextNumberDisabled(),getNextItem:()=>Number(this.value)+5this.step,getRoundtripItem:()=>Number(this.min),isRoundtripPossible:()=>this.min===undefined&&this.roundtrip})}else{const t=String(this.value);const e=String(this.min);this.changeValue({isNextItemAllowed:()=>e===undefined\|\|this.getStringItemIndex(t)>this.getStringItemIndex(e),getNextItem:()=>this.getNextItemByOperation(I,5),getRoundtripItem:()=>String(this.min),isRoundtripPossible:()=>this.min===undefined&&this.roundtrip})}}pageDown(){if(this.isNumber()){this.changeValue({isNextItemAllowed:()=>!this.isPreviousNumberDisabled(),getNextItem:()=>Number(this.value)-5this.step,getRoundtripItem:()=>Number(this.max),isRoundtripPossible:()=>this.max===undefined&&this.roundtrip})}else{const t=String(this.value);const e=String(this.max);this.changeValue({isNextItemAllowed:()=>e===undefined\|\|this.getStringItemIndex(t)<this.getStringItemIndex(e),getNextItem:()=>this.getNextItemByOperation(x,5),getRoundtripItem:()=>String(this.max),isRoundtripPossible:()=>this.max==null&&this.roundtrip})}}goToMin(){var t;if(this.isNumber()){this.value=(t=this.min)!==null&&t!==void 0?t:0}else{this.value=this._items[0]}this.sixChange.emit(this.value)}goToMax(){var t;if(this.isNumber()){this.value=(t=this.max)!==null&&t!==void 0?t:Infinity}else{this.value=this.getLastStringItem()}this.sixChange.emit(this.value)}render(){return i("div",{key:"9696809f37fa9db9f3b3212ea6c21cccb648ccab",part:"container",class:"item_picker__container",onKeyDown:t=>this.handleKeyPress(t),tabindex:"0"},i("div",{key:"5864af2b6f193d090e3411c8cd54842f58fe6609",ref:t=>this.upButton=t,part:"up",class:{item_picker__btn:true,"item_picker__btn--disabled":this.isNextDisabled()},onMouseDown:()=>this.onMouseDownNext(),onMouseUp:()=>this.onMouseUpNext(),tabindex:"-1"},i("six-icon",{key:"37ac08eea928d8eaa2b3113879bd48a422261bb2",size:"large"},"expand_less")),i("div",{key:"54948f29b05477d73228d00825c0b10b2f62d8bb",part:"content",class:"item_picker__content"},this.getFormattedValue()),i("div",{key:"911a69c54e9151dd508d962867642e38eb8f0652",ref:t=>this.downButton=t,part:"down",class:{item_picker__btn:true,"item_picker__btn--disabled":this.isPrevDisabled()},onMouseDown:()=>this.onMouseDownPrev(),onMouseUp:()=>this.onMouseUpPrev(),tabindex:"-1"},i("six-icon",{key:"86785c1389e748d3a3c54dd09d5b8fc892882ee8",size:"large"},"expand_more")))}get host(){return s(this)}static get watchers(){return{value:["handleValueChange"],debounce:["debounceChanged"],items:["handleSetChange"]}}};_.style=u;export{_ as six_item_picker};
2	+ //# sourceMappingURL=p-16fefaf7.entry.js.map

package/dist/ui-library/p-16fefaf7.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixItemPickerCss","uppercaseLetters","upperAndLowercaseLetters","flatMap","c","toLowerCase","ALPHABET","alphabet","letterIndexes","Object","fromEntries","map","i","CAPITAL_ALPHABET","LOWERCASE_ALPHABET","createItemIndexes","arr","TAG","subtract","a","b","add","DEBOUNCE_ITEM_PICKER_LISTENER","SixItemPicker","constructor","hostRef","this","eventListeners","EventListeners","value","type","ItemPickerType","NUMBER","roundtrip","step","padded","paddingLength","paddingChar","paddingDirection","ItemPickerPaddingDirection","BEFORE","timeout","DEFAULT_DEBOUNCE_FAST","interval","DEFAULT_DEBOUNCE_INSANELY_FAST","debounce","_items","_itemIndexes","handleSixItemPickerChangeDebounced","sixChangeDebounced","emit","handleValueChange","setup","debounceChanged","removeByIdentifier","host","handleSetChange","min","max","getLastStringItem","componentWillLoad","componentDidLoad","disconnectedCallback","removeAll","isNumber","setupNumberItems","setUpStringItems","isInvalidNumber","console","warn","info","_a","getStringItems","getItemIndexes","itemsMissValue","find","String","undefined","maxItem","length","LETTER","CAPITAL_LETTER","LOWER_LETTER","CUSTOM","items","previousItem","previousNumber","previousStringItem","sixChange","changeValue","isNextItemAllowed","isPreviousNumberDisabled","getNextItem","Number","getRoundtripItem","isRoundtripPossible","minLetter","getStringItemIndex","getNextItemByOperation","nextItem","nextNumber","nextStringItem","isNextNumberDisabled","char","maxLetter","operation","increment","nextIndexCandidate","numberOfItems","nextIndex","params","error","isNaN","isNextDisabled","Infinity","isPrevDisabled","onMouseDownNext","_timeoutNext","setTimeout","_intervalNext","setInterval","onMouseUpNext","clearTimeout","clearInterval","onMouseDownPrev","_timeoutPrev","_intervalPrev","onMouseUpPrev","getFormattedValue","padStart","AFTER","padEnd","handleKeyPress","event","key","preventDefault","target","upButton","downButton","pageUp","pageDown","goToMin","goToMax","render","h","part","class","onKeyDown","tabindex","ref","el","item_picker__btn","onMouseDown","onMouseUp","size"],"sources":["src/components/six-item-picker/six-item-picker.scss?tag=six-item-picker&encapsulation=shadow","src/components/six-item-picker/six-item-picker.tsx"],"sourcesContent":[".item_picker {\n &__container {\n width: 2.5em;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n\n &:focus-visible {\n outline: var(--six-focus-ring);\n outline-offset: 0;\n }\n }\n\n &__content {\n font-size: 1.5rem;\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 -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n color: var(--six-color-web-rock-500);\n\n &:hover {\n background-color: var(--six-color-web-rock-100);\n border-radius: 100%;\n }\n\n &:active {\n color: var(--six-color-web-rock-400);\n }\n\n &--disabled {\n color: var(--six-color-web-rock-300);\n cursor: not-allowed;\n\n &:hover {\n background-color: initial;\n }\n\n &:active {\n color: var(--six-color-web-rock-300);\n }\n }\n\n &:focus-visible {\n outline: var(--six-focus-ring);\n outline-offset: 0;\n }\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\nimport { ItemPickerPaddingDirection, ItemPickerType } from './types';\nimport { debounce, DEFAULT_DEBOUNCE_FAST, DEFAULT_DEBOUNCE_INSANELY_FAST } from '../../utils/execution-control';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { TimePeriod } from '../../utils/time.util';\n\ninterface Alphabet {\n alphabet: string[];\n letterIndexes: Record<string, number>;\n}\n\nconst uppercaseLetters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';\nconst upperAndLowercaseLetters = [...uppercaseLetters].flatMap((c) => [c, c.toLowerCase()]);\nconst ALPHABET: Alphabet = {\n alphabet: upperAndLowercaseLetters,\n letterIndexes: Object.fromEntries(upperAndLowercaseLetters.map((c, i) => [c, i])),\n};\nconst CAPITAL_ALPHABET: Alphabet = {\n alphabet: [...uppercaseLetters].flatMap((c) => [c]),\n letterIndexes: Object.fromEntries([...uppercaseLetters].map((c, i) => [c, i])),\n};\nconst LOWERCASE_ALPHABET: Alphabet = {\n alphabet: [...uppercaseLetters.toLowerCase()].flatMap((c) => [c]),\n letterIndexes: Object.fromEntries([...uppercaseLetters.toLowerCase()].map((c, i) => [c, i])),\n};\n\nconst createItemIndexes = (arr: string[]): Record<string, number> => {\n return Object.fromEntries([...arr].map((c, i) => [c, i]));\n};\n\nconst TAG = `[SIX-ITEM-PICKER]`;\n\nconst subtract = (a: number, b: number) => a - b;\nconst add = (a: number, b: number) => a + b;\n\nexport type SixItemPickerChangePayload = number | string | boolean | TimePeriod;\n\nconst DEBOUNCE_ITEM_PICKER_LISTENER = 'debounced-item-picker';\n\n/**\n * @since 2.0.0\n * @status experimental\n * @part container - The whole component container\n * @part up - The up button\n * @part content - The content area\n * @part down - The down button\n *\n */\n@Component({\n tag: 'six-item-picker',\n styleUrl: 'six-item-picker.scss',\n shadow: true,\n})\nexport class SixItemPicker {\n private readonly eventListeners = new EventListeners();\n\n @Element() host!: HTMLSixItemPickerElement;\n\n /** The item picker's value attribute. */\n @Prop({ mutable: true, reflect: true }) value: number | string = '';\n\n /** The type of items you want to rotate through. */\n @Prop() type: ItemPickerType = ItemPickerType.NUMBER;\n\n /** The minimum value allowed to pick. */\n @Prop({ reflect: true, mutable: true }) min?: number | string;\n\n /** The maximum value allowed to pick. */\n @Prop({ reflect: true, mutable: true }) max?: number | string;\n\n /** Define whether the picker should to a roundtrip i.e. start at max when reaching min and vice versa. */\n // eslint-disable-next-line @stencil-community/ban-default-true\n @Prop({ reflect: true }) roundtrip = true;\n\n /** Defines how many steps should be taken when navigating */\n @Prop({ reflect: true }) step = 1;\n\n /** Defines a custom list of items you can iterate through */\n @Prop() items?: string[];\n\n /** Defines whether the items should be padded */\n @Prop() padded = false;\n\n /** Defines the length of the padded area */\n @Prop() paddingLength = 2;\n\n /** Defines the character used for padding */\n @Prop() paddingChar = '0';\n\n /** Defines whether the padding should be before or after the value. You can either use 'before' or 'after'. By default,\n * before is selected */\n @Prop() paddingDirection: ItemPickerPaddingDirection = ItemPickerPaddingDirection.BEFORE;\n\n /**\n * Set the amount of time, in milliseconds, to wait to trigger faster switching between items.\n */\n @Prop() timeout = DEFAULT_DEBOUNCE_FAST;\n\n /**\n * Set the amount of time, in milliseconds, to wait between switching to next item when mouse button is held pressed.\n */\n @Prop() interval = DEFAULT_DEBOUNCE_INSANELY_FAST;\n\n /**\n * Emitted when the item picker's value changes\n */\n @Event({ eventName: 'six-item-picker-change' }) sixChange!: EventEmitter<SixItemPickerChangePayload>;\n\n /**\n * Emitted when the item picker's value changes, but debounced\n */\n @Event({ eventName: 'six-item-picker-change-debounced' })\n sixChangeDebounced!: EventEmitter<SixItemPickerChangePayload>;\n\n /**\n * Set the amount of time, in milliseconds, to wait to trigger the `six-item-picker-change-debounced` event.\n * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce\n * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click\n * (and keep pressed) and once you release\n */\n @Prop() debounce = DEFAULT_DEBOUNCE_FAST;\n\n @Watch('value')\n handleValueChange() {\n this.setup();\n }\n\n @Watch('debounce')\n protected debounceChanged() {\n this.eventListeners.removeByIdentifier(DEBOUNCE_ITEM_PICKER_LISTENER);\n this.eventListeners.add(\n this.host,\n 'six-item-picker-change',\n debounce(this.handleSixItemPickerChangeDebounced, this.debounce),\n DEBOUNCE_ITEM_PICKER_LISTENER\n );\n }\n\n @Watch('items')\n handleSetChange() {\n this.setup();\n this.min = this._items[0];\n this.max = this.getLastStringItem();\n }\n\n @State() _items: string[] = [];\n @State() _itemIndexes: Record<string, number> = {};\n\n // used for fast increasing when keeping the mouse button held down\n private _timeoutNext!: ReturnType<typeof setTimeout>;\n private _intervalNext!: ReturnType<typeof setInterval>;\n\n private _timeoutPrev!: ReturnType<typeof setTimeout>;\n private _intervalPrev!: ReturnType<typeof setInterval>;\n\n componentWillLoad() {\n this.setup();\n }\n\n componentDidLoad() {\n this.eventListeners.add(\n this.host,\n 'six-item-picker-change',\n debounce(this.handleSixItemPickerChangeDebounced, this.debounce),\n DEBOUNCE_ITEM_PICKER_LISTENER\n );\n }\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n private handleSixItemPickerChangeDebounced = () => {\n this.sixChangeDebounced.emit(this.value);\n };\n\n private setup() {\n if (this.isNumber()) {\n this.setupNumberItems();\n } else {\n this.setUpStringItems();\n }\n }\n\n private setupNumberItems() {\n if (this.isInvalidNumber()) {\n console.warn(`${TAG} Expected number but value is not a number: \"${this.value}\"`);\n console.info(`${TAG} Will set value to either minimum or if not provided to zero.`);\n this.value = this.min ?? 0;\n }\n }\n\n private setUpStringItems() {\n this._items = this.getStringItems();\n this._itemIndexes = this.getItemIndexes();\n const itemsMissValue = this._items.find((i) => String(i) === String(this.value)) === undefined;\n if (itemsMissValue) {\n console.warn(`${TAG} Expected item from item set but value was not found in set: \"${this.value}\"`);\n console.info(`${TAG} Will set value to either minimum or if not provided to \"${this._items[0]}\".`);\n this.value = this._items[0];\n }\n\n if (this.min === undefined) {\n if (!this.roundtrip) {\n console.warn(`${TAG} Expected a min value`);\n console.info(`${TAG} Will set min value to ${this._items[0]}`);\n }\n this.min = this._items[0];\n }\n\n if (this.max === undefined) {\n const maxItem = this.getLastStringItem();\n if (!this.roundtrip) {\n console.warn(`${TAG} Expected a min value if roundtrip is enabled`);\n console.info(`${TAG} Will set min value to ${maxItem}`);\n }\n this.max = maxItem;\n }\n }\n\n private getLastStringItem() {\n return this._items[this._items.length - 1];\n }\n\n private getStringItems(): string[] {\n switch (this.type) {\n case ItemPickerType.NUMBER:\n console.warn(`${TAG}: unexpected type ${this.type}`);\n return [];\n case ItemPickerType.LETTER:\n return ALPHABET.alphabet;\n case ItemPickerType.CAPITAL_LETTER:\n return CAPITAL_ALPHABET.alphabet;\n case ItemPickerType.LOWER_LETTER:\n return LOWERCASE_ALPHABET.alphabet;\n case ItemPickerType.CUSTOM:\n if (this.items == null || this.items.length === 0) {\n console.warn(`${TAG}: no items defined for type ${this.type}`);\n return [];\n }\n return this.items;\n }\n }\n\n private getItemIndexes(): Record<string, number> {\n switch (this.type) {\n case ItemPickerType.NUMBER:\n console.warn(`${TAG}: unexpected type ${this.type}`);\n return {};\n case ItemPickerType.LETTER:\n return ALPHABET.letterIndexes;\n case ItemPickerType.CAPITAL_LETTER:\n return CAPITAL_ALPHABET.letterIndexes;\n case ItemPickerType.LOWER_LETTER:\n return LOWERCASE_ALPHABET.letterIndexes;\n case ItemPickerType.CUSTOM:\n return createItemIndexes(this._items);\n }\n }\n\n private previousItem() {\n if (this.isNumber()) {\n this.previousNumber();\n } else {\n this.previousStringItem();\n }\n\n this.sixChange.emit(this.value);\n }\n\n private previousNumber() {\n this.changeValue({\n isNextItemAllowed: () => !this.isPreviousNumberDisabled(),\n getNextItem: () => Number(this.value) - this.step,\n getRoundtripItem: () => Number(this.max),\n isRoundtripPossible: () => this.max === undefined && this.roundtrip,\n });\n }\n\n private previousStringItem() {\n const value = String(this.value);\n const minLetter = String(this.min);\n\n this.changeValue({\n isNextItemAllowed: () =>\n minLetter === undefined || this.getStringItemIndex(value) > this.getStringItemIndex(minLetter),\n getNextItem: () => this.getNextItemByOperation(subtract),\n getRoundtripItem: () => String(this.max),\n isRoundtripPossible: () => this.max == null && this.roundtrip,\n });\n }\n\n private nextItem() {\n if (this.isNumber()) {\n this.nextNumber();\n } else {\n this.nextStringItem();\n }\n\n this.sixChange.emit(this.value);\n }\n\n private nextNumber() {\n this.changeValue({\n isNextItemAllowed: () => !this.isNextNumberDisabled(),\n getNextItem: () => Number(this.value) + this.step,\n getRoundtripItem: () => Number(this.min),\n isRoundtripPossible: () => this.min === undefined && this.roundtrip,\n });\n }\n\n private getStringItemIndex(char: string): number {\n return this._itemIndexes[char];\n }\n\n private nextStringItem() {\n const value = String(this.value);\n const maxLetter = String(this.max);\n\n this.changeValue({\n isNextItemAllowed: () =>\n maxLetter === undefined || this.getStringItemIndex(value) < this.getStringItemIndex(maxLetter),\n getNextItem: () => this.getNextItemByOperation(add),\n getRoundtripItem: () => String(this.min),\n isRoundtripPossible: () => this.min === undefined && this.roundtrip,\n });\n }\n\n private getNextItemByOperation(operation: (a: number, b: number) => number, increment: number = this.step) {\n const value = String(this.value);\n const nextIndexCandidate = operation(this.getStringItemIndex(value), increment);\n const numberOfItems = this._items.length;\n const nextIndex = ((nextIndexCandidate % numberOfItems) + numberOfItems) % numberOfItems;\n return this._items[nextIndex];\n }\n\n private changeValue(params: {\n getNextItem: () => number | string;\n isNextItemAllowed: () => boolean;\n getRoundtripItem: () => number | string;\n isRoundtripPossible: () => boolean;\n }) {\n if (params.isNextItemAllowed()) {\n this.value = params.getNextItem();\n return;\n }\n\n if (params.isRoundtripPossible()) {\n console.error(\n `${TAG} Item picker is expected to perform a roundtrip, but either max or min value is missing so a roundtrip is not possible`\n );\n return;\n }\n\n if (this.roundtrip) {\n this.value = params.getRoundtripItem();\n return;\n }\n\n console.warn(\n `${TAG} Roundtrip is not allowed, but was still triggered, please report this issue to the developer of six-item-picker`\n );\n\n this.sixChange.emit(this.value);\n }\n\n private isNumber() {\n return this.type === ItemPickerType.NUMBER;\n }\n\n private isInvalidNumber() {\n return this.value === '' || isNaN(this.value as number);\n }\n\n private isNextDisabled() {\n if (this.roundtrip) {\n return false;\n }\n\n if (this.isNumber()) {\n return this.isNextNumberDisabled();\n } else {\n return this._itemIndexes[String(this.value)] + this.step > this._itemIndexes[String(this.max)];\n }\n }\n\n private isNextNumberDisabled() {\n return Number(this.value) + this.step > Number(this.max ?? Infinity);\n }\n\n private isPrevDisabled() {\n if (this.roundtrip) {\n return false;\n }\n\n if (this.isNumber()) {\n return this.isPreviousNumberDisabled();\n } else {\n return this._itemIndexes[String(this.value)] - this.step < this._itemIndexes[String(this.min)];\n }\n }\n\n private isPreviousNumberDisabled() {\n return Number(this.value) - this.step < Number(this.min ?? -Infinity);\n }\n\n private onMouseDownNext() {\n if (this.isNextDisabled()) {\n return;\n }\n\n this.nextItem();\n\n this._timeoutNext = setTimeout(() => {\n this._intervalNext = setInterval(() => {\n this.nextItem();\n }, this.interval);\n }, this.timeout);\n }\n\n private onMouseUpNext() {\n clearTimeout(this._timeoutNext);\n clearInterval(this._intervalNext);\n }\n\n private onMouseDownPrev() {\n if (this.isPrevDisabled()) {\n return;\n }\n\n this.previousItem();\n\n this._timeoutPrev = setTimeout(() => {\n this._intervalPrev = setInterval(() => {\n this.previousItem();\n }, this.interval);\n }, this.timeout);\n }\n\n private onMouseUpPrev() {\n clearTimeout(this._timeoutPrev);\n clearInterval(this._intervalPrev);\n }\n\n private getFormattedValue() {\n if (this.value === undefined || this.value === null) {\n return this.value;\n }\n\n if (!this.padded) {\n return this.value;\n }\n\n if (this.paddingDirection === ItemPickerPaddingDirection.BEFORE) {\n return String(this.value).padStart(this.paddingLength, this.paddingChar);\n } else if (this.paddingDirection === ItemPickerPaddingDirection.AFTER) {\n return String(this.value).padEnd(this.paddingLength, this.paddingChar);\n }\n\n return this.value;\n }\n\n private handleKeyPress(event: KeyboardEvent) {\n if (event.key === 'Enter') {\n event.preventDefault();\n\n if (event.target === this.upButton) {\n this.nextItem();\n } else if (event.target === this.downButton) {\n this.previousItem();\n }\n } else if (event.key === 'ArrowUp') {\n event.preventDefault();\n this.nextItem();\n } else if (event.key === 'ArrowDown') {\n event.preventDefault();\n this.previousItem();\n } else if (event.key === 'PageUp') {\n event.preventDefault();\n this.pageUp();\n } else if (event.key === 'PageDown') {\n event.preventDefault();\n this.pageDown();\n } else if (event.key === 'Home') {\n event.preventDefault();\n this.goToMin();\n } else if (event.key === 'End') {\n event.preventDefault();\n this.goToMax();\n }\n }\n\n private pageUp() {\n if (this.isNumber()) {\n this.changeValue({\n isNextItemAllowed: () => !this.isNextNumberDisabled(),\n getNextItem: () => Number(this.value) + 5 * this.step,\n getRoundtripItem: () => Number(this.min),\n isRoundtripPossible: () => this.min === undefined && this.roundtrip,\n });\n } else {\n const value = String(this.value);\n const minLetter = String(this.min);\n\n this.changeValue({\n isNextItemAllowed: () =>\n minLetter === undefined || this.getStringItemIndex(value) > this.getStringItemIndex(minLetter),\n getNextItem: () => this.getNextItemByOperation(add, 5),\n getRoundtripItem: () => String(this.min),\n isRoundtripPossible: () => this.min === undefined && this.roundtrip,\n });\n }\n }\n\n private pageDown() {\n if (this.isNumber()) {\n this.changeValue({\n isNextItemAllowed: () => !this.isPreviousNumberDisabled(),\n getNextItem: () => Number(this.value) - 5 * this.step,\n getRoundtripItem: () => Number(this.max),\n isRoundtripPossible: () => this.max === undefined && this.roundtrip,\n });\n } else {\n const value = String(this.value);\n const maxLetter = String(this.max);\n\n this.changeValue({\n isNextItemAllowed: () =>\n maxLetter === undefined || this.getStringItemIndex(value) < this.getStringItemIndex(maxLetter),\n getNextItem: () => this.getNextItemByOperation(subtract, 5),\n getRoundtripItem: () => String(this.max),\n isRoundtripPossible: () => this.max == null && this.roundtrip,\n });\n }\n }\n\n private goToMin() {\n if (this.isNumber()) {\n this.value = this.min ?? 0;\n } else {\n this.value = this._items[0];\n }\n\n this.sixChange.emit(this.value);\n }\n\n private goToMax() {\n if (this.isNumber()) {\n this.value = this.max ?? Infinity;\n } else {\n this.value = this.getLastStringItem();\n }\n\n this.sixChange.emit(this.value);\n }\n\n private upButton!: HTMLDivElement;\n private downButton!: HTMLDivElement;\n\n render() {\n return (\n <div\n part=\"container\"\n class=\"item_picker__container\"\n onKeyDown={(event) => this.handleKeyPress(event)}\n tabindex=\"0\"\n >\n <div\n ref={(el) => (this.upButton = el as HTMLDivElement)}\n part=\"up\"\n class={{\n item_picker__btn: true,\n 'item_picker__btn--disabled': this.isNextDisabled(),\n }}\n onMouseDown={() => this.onMouseDownNext()}\n onMouseUp={() => this.onMouseUpNext()}\n tabindex=\"-1\"\n >\n <six-icon size=\"large\">expand_less</six-icon>\n </div>\n <div part=\"content\" class=\"item_picker__content\">\n {this.getFormattedValue()}\n </div>\n <div\n ref={(el) => (this.downButton = el as HTMLDivElement)}\n part=\"down\"\n class={{\n item_picker__btn: true,\n 'item_picker__btn--disabled': this.isPrevDisabled(),\n }}\n onMouseDown={() => this.onMouseDownPrev()}\n onMouseUp={() => this.onMouseUpPrev()}\n tabindex=\"-1\"\n >\n <six-icon size=\"large\">expand_more</six-icon>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-1dfee586.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as i,h as s,H as t,g as e}from"./p-BF09Gr5y.js";const h=":host div{height:24px;width:24px;display:inline-block;background-size:cover;background-repeat:no-repeat}:host div.is-size-xSmall{height:12px;width:12px}:host div.is-size-small{height:18px;width:18px}:host div.is-size-medium{height:24px;width:24px}:host div.is-size-large{height:36px;width:36px}:host div.is-size-xLarge{height:48px;width:48px}:host div.is-size-xxLarge{height:72px;width:72px}:host div.is-size-xxxLarge{height:96px;width:96px}:host div.is-size-4xl{height:250px;width:250px}";const o=class{constructor(s){i(this,s);this.size="medium";this.svgContent=null}async componentWillLoad(){var i;const s=(i=this.host.innerHTML)===null\|\|i===void 0?void 0:i.trim();if(!!s){try{const i=await fetch(`/assets/pictograms/${s}.svg`);if(i.ok){this.svgContent=await i.text()}else{console.error(`Icon "${s}" not found in assets/pictograms.`)}}catch(i){console.error(`Error loading icon "${s}":`,i)}}}render(){return s(t,{key:"5b88e27072aa32496f6eba5c863abd8818c6ba15"},s("div",{key:"533593aad450d6aab0fe12e4c8ba1d883386906e",part:"icon",class:{[`is-size-${this.size}`]:true},innerHTML:this.svgContent\|\|""}))}get host(){return e(this)}};o.style=h;export{o as six_picto};
2	+ //# sourceMappingURL=p-1dfee586.entry.js.map

package/dist/ui-library/p-1dfee586.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixPictoCss","SixPicto","constructor","hostRef","this","size","svgContent","componentWillLoad","iconName","_a","host","innerHTML","trim","response","fetch","ok","text","console","error","render","h","Host","key","part","class"],"sources":["src/components/six-picto/six-picto.scss?tag=six-picto&encapsulation=shadow","src/components/six-picto/six-picto.tsx"],"sourcesContent":[":host {\n div {\n height: 24px;\n width: 24px;\n display: inline-block;\n background-size: cover;\n background-repeat: no-repeat;\n }\n\n div.is-size-xSmall {\n height: 12px;\n width: 12px;\n }\n\n div.is-size-small {\n height: 18px;\n width: 18px;\n }\n\n div.is-size-medium {\n height: 24px;\n width: 24px;\n }\n\n div.is-size-large {\n height: 36px;\n width: 36px;\n }\n\n div.is-size-xLarge {\n height: 48px;\n width: 48px;\n }\n\n div.is-size-xxLarge {\n height: 72px;\n width: 72px;\n }\n\n div.is-size-xxxLarge {\n height: 96px;\n width: 96px;\n }\n\n div.is-size-4xl {\n height: 250px;\n width: 250px;\n }\n}\n","import { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n/**\n * @since 1.1\n * @status stable\n *\n * @part icon - The component's icon wrapper.\n */\n\n@Component({\n tag: 'six-picto',\n styleUrl: 'six-picto.scss',\n shadow: true,\n})\nexport class SixPicto {\n @Element() host!: HTMLSixPictoElement;\n\n /**\n * Defines the size of the icon.\n */\n @Prop() size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge' | '4xl' = 'medium';\n\n @State() svgContent: string | null = null;\n\n async componentWillLoad() {\n const iconName = this.host.innerHTML?.trim();\n if (!!iconName) {\n try {\n const response = await fetch(`/assets/pictograms/${iconName}.svg`);\n if (response.ok) {\n this.svgContent = await response.text();\n } else {\n console.error(`Icon \"${iconName}\" not found in assets/pictograms.`);\n }\n } catch (error) {\n console.error(`Error loading icon \"${iconName}\":`, error);\n }\n }\n }\n\n render() {\n return (\n <Host>\n <div\n part=\"icon\"\n class={{\n [`is-size-${this.size}`]: true,\n }}\n innerHTML={this.svgContent || ''} // Inject the loaded SVG content into the component\n ></div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAc,2e,MCcPC,EAAQ,MALrB,WAAAC,CAAAC,G,UAWUC,KAAIC,KAAwF,SAE3FD,KAAUE,WAAkB,IA+BtC,CA7BC,uBAAMC,G,MACJ,MAAMC,GAAWC,EAAAL,KAAKM,KAAKC,aAAS,MAAAF,SAAA,SAAAA,EAAEG,OACtC,KAAMJ,EAAU,CACd,IACE,MAAMK,QAAiBC,MAAM,sBAAsBN,SACnD,GAAIK,EAASE,GAAI,CACfX,KAAKE,iBAAmBO,EAASG,M,KAC5B,CACLC,QAAQC,MAAM,SAASV,qC,EAEzB,MAAOU,GACPD,QAAQC,MAAM,uBAAuBV,MAAcU,E,GAKzD,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CACEC,KAAK,OACLC,MAAO,CACL,CAAC,WAAWpB,KAAKC,QAAS,MAE5BM,UAAWP,KAAKE,YAAc,K","ignoreList":[]}

package/dist/ui-library/p-1oJarDAY.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ const e=["de","fr","it","en","es"];const a=new Intl.DateTimeFormat("de-CH");function r(e,r){try{const i=t[e][r.key];switch(r.key){case"required":case"requiredtrue":case"email":return i;case"minlength":case"maxlength":return i.replace("{requiredLength}",String(r.requiredLength));case"pattern":return i.replace("{pattern}",String(r.requiredPattern));case"min":return i.replace("{min}",String(r.min));case"max":return i.replace("{max}",String(r.max));case"mindate":return i.replace("{mindate}",a.format(typeof r.mindate==="string"?new Date(r.mindate):r.mindate));case"maxdate":return i.replace("{maxdate}",a.format(typeof r.maxdate==="string"?new Date(r.maxdate):r.maxdate));case"invaliddate":return i;case"custom":return r.text}}catch(a){console.warn(`no error message in '${e}' for error: ${r}`,a);return undefined}}function i(){const a=document.documentElement.lang;if(e.includes(a)){return a}return"de"}const t={en:{required:"Please fill out this field.",minlength:"Please enter at least {requiredLength} characters.",maxlength:"Please enter no more than {requiredLength} characters.",pattern:"Please enter a value that matches the pattern: {pattern}.",email:"Please enter a valid email address.",min:"Please enter a value greater than or equal to {min}.",max:"Please enter a value less than or equal to {max}.",requiredtrue:"Please check this field.",mindate:"Please enter a date on or after {mindate}.",maxdate:"Please enter a date on or before {maxdate}.",invaliddate:"Please enter a valid date."},fr:{required:"Veuillez remplir ce champ s'il vous plaît.",minlength:"Veuillez entrer au moins {requiredLength} caractères.",maxlength:"Veuillez entrer au maximum {requiredLength} caractères.",pattern:"Veuillez entrer une valeur qui correspond au format : {pattern}.",email:"Veuillez entrer une adresse email valide.",min:"Veuillez entrer une valeur supérieure ou égale à {min}.",max:"Veuillez entrer une valeur inférieure ou égale à {max}.",requiredtrue:"Veuillez cocher cette case s'il vous plaît.",mindate:"Veuillez entrer une date le {mindate} ou après.",maxdate:"Veuillez entrer une date le {maxdate} ou avant.",invaliddate:"Veuillez entrer une date valide."},de:{required:"Bitte füllen Sie dieses Feld aus.",minlength:"Bitte geben Sie mindestens {requiredLength} Zeichen ein.",maxlength:"Bitte geben Sie höchstens {requiredLength} Zeichen ein.",pattern:"Bitte geben Sie einen Wert ein, der dem Muster entspricht: {pattern}.",email:"Bitte geben Sie eine gültige E-Mail-Adresse ein.",min:"Bitte geben Sie einen Wert größer oder gleich {min} ein.",max:"Bitte geben Sie einen Wert kleiner oder gleich {max} ein.",requiredtrue:"Bitte aktivieren Sie dieses Feld.",mindate:"Bitte geben Sie ein Datum am oder nach dem {mindate} ein.",maxdate:"Bitte geben Sie ein Datum am oder vor dem {maxdate} ein.",invaliddate:"Bitte geben Sie ein gültiges Datum ein."},it:{required:"Si prega di compilare questo campo.",minlength:"Si prega di inserire almeno {requiredLength} caratteri.",maxlength:"Si prega di inserire al massimo {requiredLength} caratteri.",pattern:"Si prega di inserire un valore che corrisponde al formato: {pattern}.",email:"Si prega di inserire un indirizzo email valido.",min:"Si prega di inserire un valore maggiore o uguale a {min}.",max:"Si prega di inserire un valore minore o uguale a {max}.",requiredtrue:"Si prega di spuntare questo campo.",mindate:"Si prega di inserire una data il {mindate} o successiva.",maxdate:"Si prega di inserire una data il {maxdate} o precedente.",invaliddate:"Inserisci una data valida."},es:{required:"Por favor, rellene este campo.",minlength:"Por favor, introduzca al menos {requiredLength} caracteres.",maxlength:"Por favor, introduzca no más de {requiredLength} caracteres.",pattern:"Por favor, introduzca un valor que coincida con el patrón: {pattern}.",email:"Por favor, introduzca una dirección de correo electrónico válida.",min:"Por favor, introduzca un valor mayor o igual a {min}.",max:"Por favor, introduzca un valor menor o igual a {max}.",requiredtrue:"Por favor, marque este campo.",mindate:"Por favor, introduzca una fecha igual o posterior a {mindate}.",maxdate:"Por favor, introduzca una fecha igual o anterior a {maxdate}.",invaliddate:"Por favor, introduzca una fecha válida."}};export{i as a,r as g,e as l};
2	+ //# sourceMappingURL=p-1oJarDAY.js.map

package/dist/ui-library/p-1oJarDAY.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"p-1oJarDAY.js","sources":["src/utils/error-messages.ts"],"sourcesContent":["export const languages = ['de', 'fr', 'it', 'en', 'es'] as const;\nexport type Language = (typeof languages)[number];\n\nconst dateFormat = new Intl.DateTimeFormat('de-CH');\n\nexport type ValidationError =\n | { key: 'required' }\n | { key: 'requiredtrue' }\n | { key: 'email'; requiredPattern: string }\n | { key: 'minlength'; requiredLength: number }\n | { key: 'maxlength'; requiredLength: number }\n | { key: 'pattern'; requiredPattern: string }\n | { key: 'min'; min: number }\n | { key: 'max'; max: number }\n | { key: 'mindate'; mindate: Date; actual: Date | string }\n | { key: 'maxdate'; maxdate: Date; actual: Date | string }\n | { key: 'invaliddate'; actual: Date }\n | { key: 'custom'; text: string };\n\n/**\n * Returns an error message for the given language and error.\n */\nexport function getErrorMessage(language: Language, error: ValidationError): string | undefined {\n try {\n const message = translation[language][error.key];\n switch (error.key) {\n case 'required':\n case 'requiredtrue':\n case 'email':\n return message;\n case 'minlength':\n case 'maxlength':\n return message.replace('{requiredLength}', String(error.requiredLength));\n case 'pattern':\n return message.replace('{pattern}', String(error.requiredPattern));\n case 'min':\n return message.replace('{min}', String(error.min));\n case 'max':\n return message.replace('{max}', String(error.max));\n case 'mindate':\n return message.replace(\n '{mindate}',\n dateFormat.format(typeof error.mindate === 'string' ? new Date(error.mindate) : error.mindate)\n );\n case 'maxdate':\n return message.replace(\n '{maxdate}',\n dateFormat.format(typeof error.maxdate === 'string' ? new Date(error.maxdate) : error.maxdate)\n );\n case 'invaliddate':\n return message;\n case 'custom':\n return error.text;\n }\n } catch (e) {\n console.warn(`no error message in '${language}' for error: ${error}`, e);\n\n return undefined;\n }\n}\n\nexport function getLanguage(): Language {\n const documentLang = document.documentElement.lang as Language;\n if (languages.includes(documentLang)) {\n return documentLang;\n }\n return 'de';\n}\n\nconst translation: Record<Language, Record<string, string>> = {\n en: {\n required: 'Please fill out this field.',\n minlength: 'Please enter at least {requiredLength} characters.',\n maxlength: 'Please enter no more than {requiredLength} characters.',\n pattern: 'Please enter a value that matches the pattern: {pattern}.',\n email: 'Please enter a valid email address.',\n min: 'Please enter a value greater than or equal to {min}.',\n max: 'Please enter a value less than or equal to {max}.',\n requiredtrue: 'Please check this field.',\n mindate: 'Please enter a date on or after {mindate}.',\n maxdate: 'Please enter a date on or before {maxdate}.',\n invaliddate: 'Please enter a valid date.',\n },\n fr: {\n required: \"Veuillez remplir ce champ s'il vous plaît.\",\n minlength: 'Veuillez entrer au moins {requiredLength} caractères.',\n maxlength: 'Veuillez entrer au maximum {requiredLength} caractères.',\n pattern: 'Veuillez entrer une valeur qui correspond au format : {pattern}.',\n email: 'Veuillez entrer une adresse email valide.',\n min: 'Veuillez entrer une valeur supérieure ou égale à {min}.',\n max: 'Veuillez entrer une valeur inférieure ou égale à {max}.',\n requiredtrue: \"Veuillez cocher cette case s'il vous plaît.\",\n mindate: 'Veuillez entrer une date le {mindate} ou après.',\n maxdate: 'Veuillez entrer une date le {maxdate} ou avant.',\n invaliddate: 'Veuillez entrer une date valide.',\n },\n de: {\n required: 'Bitte füllen Sie dieses Feld aus.',\n minlength: 'Bitte geben Sie mindestens {requiredLength} Zeichen ein.',\n maxlength: 'Bitte geben Sie höchstens {requiredLength} Zeichen ein.',\n pattern: 'Bitte geben Sie einen Wert ein, der dem Muster entspricht: {pattern}.',\n email: 'Bitte geben Sie eine gültige E-Mail-Adresse ein.',\n min: 'Bitte geben Sie einen Wert größer oder gleich {min} ein.',\n max: 'Bitte geben Sie einen Wert kleiner oder gleich {max} ein.',\n requiredtrue: 'Bitte aktivieren Sie dieses Feld.',\n mindate: 'Bitte geben Sie ein Datum am oder nach dem {mindate} ein.',\n maxdate: 'Bitte geben Sie ein Datum am oder vor dem {maxdate} ein.',\n invaliddate: 'Bitte geben Sie ein gültiges Datum ein.',\n },\n it: {\n required: 'Si prega di compilare questo campo.',\n minlength: 'Si prega di inserire almeno {requiredLength} caratteri.',\n maxlength: 'Si prega di inserire al massimo {requiredLength} caratteri.',\n pattern: 'Si prega di inserire un valore che corrisponde al formato: {pattern}.',\n email: 'Si prega di inserire un indirizzo email valido.',\n min: 'Si prega di inserire un valore maggiore o uguale a {min}.',\n max: 'Si prega di inserire un valore minore o uguale a {max}.',\n requiredtrue: 'Si prega di spuntare questo campo.',\n mindate: 'Si prega di inserire una data il {mindate} o successiva.',\n maxdate: 'Si prega di inserire una data il {maxdate} o precedente.',\n invaliddate: 'Inserisci una data valida.',\n },\n\n es: {\n required: 'Por favor, rellene este campo.',\n minlength: 'Por favor, introduzca al menos {requiredLength} caracteres.',\n maxlength: 'Por favor, introduzca no más de {requiredLength} caracteres.',\n pattern: 'Por favor, introduzca un valor que coincida con el patrón: {pattern}.',\n email: 'Por favor, introduzca una dirección de correo electrónico válida.',\n min: 'Por favor, introduzca un valor mayor o igual a {min}.',\n max: 'Por favor, introduzca un valor menor o igual a {max}.',\n requiredtrue: 'Por favor, marque este campo.',\n mindate: 'Por favor, introduzca una fecha igual o posterior a {mindate}.',\n maxdate: 'Por favor, introduzca una fecha igual o anterior a {maxdate}.',\n invaliddate: 'Por favor, introduzca una fecha válida.',\n },\n};\n"],"names":[],"mappings":"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"}

package/dist/ui-library/p-220ffc25.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as r}from"./p-BF09Gr5y.js";const s=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host :after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{--track-color:var(--six-progress-track-color);--indicator-color:var(--six-progress-indicator-color);display:inline-flex}.progress-ring{display:inline-flex;align-items:center;justify-content:center;position:relative}.progress-ring__image{transform:rotate(-90deg);transform-origin:50% 50%}.progress-ring__track{stroke:var(--track-color)}.progress-ring__indicator{stroke:var(--indicator-color);transition:0.35s stroke-dashoffset, 0.35s stroke}.progress-ring__label{display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;user-select:none;font-family:var(--six-font-family)}";const t=class{constructor(r){e(this,r);this.size=128;this.strokeWidth=4;this.percentage=0}handlePercentageChange(){this.updateProgress()}componentDidLoad(){this.updateProgress()}updateProgress(){var e;if(((e=this.indicator)===null\|\|e===void 0?void 0:e.r)==null)return;const r=this.indicator.r.baseVal.value;const s=r2Math.PI;const t=s-this.percentage/100s;this.indicator.style.strokeDasharray=`${s} ${s}`;this.indicator.style.strokeDashoffset=`${t}`}render(){return r("div",{key:"6f48ef171c32eef14162bb15d53befc7bf30f923",part:"base",class:"progress-ring"},r("svg",{key:"b1479eec3a5dbabdb39716484c58396a09db1272",class:"progress-ring__image",width:this.size,height:this.size},r("circle",{key:"abb6fd5f35d514fe1580e02fd251774e107da5ce",class:"progress-ring__track","stroke-width":this.strokeWidth,"stroke-linecap":"round",fill:"transparent",r:this.size/2-this.strokeWidth2,cx:this.size/2,cy:this.size/2}),r("circle",{key:"ca3fb1650516df81c8757594a0ce0d62d82febd3",ref:e=>this.indicator=e,class:"progress-ring__indicator","stroke-width":this.strokeWidth,"stroke-linecap":"round",fill:"transparent",r:this.size/2-this.strokeWidth2,cx:this.size/2,cy:this.size/2})),r("span",{key:"c9b746f63f7c8bb0b325397d0344f6d82b8e3c0d",part:"label",class:"progress-ring__label"},r("slot",{key:"905b3a001f4d95c31e80e5d74ecd29d0ec59992a"})))}static get watchers(){return{percentage:["handlePercentageChange"]}}};t.style=s;export{t as six_progress_ring};
2	+ //# sourceMappingURL=p-220ffc25.entry.js.map

package/dist/ui-library/p-220ffc25.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixProgressRingCss","SixProgressRing","constructor","hostRef","this","size","strokeWidth","percentage","handlePercentageChange","updateProgress","componentDidLoad","_a","indicator","r","radius","baseVal","value","circumference","Math","PI","offset","style","strokeDasharray","strokeDashoffset","render","h","key","part","class","width","height","fill","cx","cy","ref","el"],"sources":["src/components/six-progress-ring/six-progress-ring.scss?tag=six-progress-ring&encapsulation=shadow","src/components/six-progress-ring/six-progress-ring.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --track-color: The track color.\n * @prop --indicator-color: The indicator color.\n */\n:host {\n --track-color: var(--six-progress-track-color);\n --indicator-color: var(--six-progress-indicator-color);\n\n display: inline-flex;\n}\n\n.progress-ring {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n position: relative;\n}\n\n.progress-ring__image {\n transform: rotate(-90deg);\n transform-origin: 50% 50%;\n}\n\n.progress-ring__track {\n stroke: var(--track-color);\n}\n\n.progress-ring__indicator {\n stroke: var(--indicator-color);\n transition: 0.35s stroke-dashoffset, 0.35s stroke;\n}\n\n.progress-ring__label {\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n text-align: center;\n user-select: none;\n font-family: var(--six-font-family);\n}\n","import { Component, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - A label to show inside the ring.\n *\n * @part base - The component's base wrapper.\n * @part label - The progress ring label.\n */\n\n@Component({\n tag: 'six-progress-ring',\n styleUrl: 'six-progress-ring.scss',\n shadow: true,\n})\nexport class SixProgressRing {\n private indicator?: SVGCircleElement;\n\n /** The size of the progress ring in pixels. */\n @Prop() size = 128;\n\n /** The stroke width of the progress ring in pixels. */\n @Prop() strokeWidth = 4;\n\n /** The current progress percentage, 0 - 100. */\n @Prop() percentage = 0;\n\n @Watch('percentage')\n handlePercentageChange() {\n this.updateProgress();\n }\n\n componentDidLoad() {\n this.updateProgress();\n }\n\n private updateProgress() {\n if (this.indicator?.r == null) return;\n\n const radius = this.indicator.r.baseVal.value;\n const circumference = radius * 2 * Math.PI;\n const offset = circumference - (this.percentage / 100) * circumference;\n\n this.indicator.style.strokeDasharray = `${circumference} ${circumference}`;\n this.indicator.style.strokeDashoffset = `${offset}`;\n }\n\n render() {\n return (\n <div part=\"base\" class=\"progress-ring\">\n <svg class=\"progress-ring__image\" width={this.size} height={this.size}>\n <circle\n class=\"progress-ring__track\"\n stroke-width={this.strokeWidth}\n stroke-linecap=\"round\"\n fill=\"transparent\"\n r={this.size / 2 - this.strokeWidth * 2}\n cx={this.size / 2}\n cy={this.size / 2}\n />\n\n <circle\n ref={(el) => (this.indicator = el as SVGCircleElement)}\n class=\"progress-ring__indicator\"\n stroke-width={this.strokeWidth}\n stroke-linecap=\"round\"\n fill=\"transparent\"\n r={this.size / 2 - this.strokeWidth * 2}\n cx={this.size / 2}\n cy={this.size / 2}\n />\n </svg>\n\n <span part=\"label\" class=\"progress-ring__label\">\n <slot />\n </span>\n </div>\n );\n }\n}\n"],"mappings":"2CAAA,MAAMA,EAAqB,82B,MCmBdC,EAAe,MAL5B,WAAAC,CAAAC,G,UASUC,KAAIC,KAAG,IAGPD,KAAWE,YAAG,EAGdF,KAAUG,WAAG,CAsDtB,CAnDC,sBAAAC,GACEJ,KAAKK,gB,CAGP,gBAAAC,GACEN,KAAKK,gB,CAGC,cAAAA,G,MACN,KAAIE,EAAAP,KAAKQ,aAAW,MAAAD,SAAA,SAAAA,EAAAE,IAAK,KAAM,OAE/B,MAAMC,EAASV,KAAKQ,UAAUC,EAAEE,QAAQC,MACxC,MAAMC,EAAgBH,EAAS,EAAII,KAAKC,GACxC,MAAMC,EAASH,EAAiBb,KAAKG,WAAa,IAAOU,EAEzDb,KAAKQ,UAAUS,MAAMC,gBAAkB,GAAGL,KAAiBA,IAC3Db,KAAKQ,UAAUS,MAAME,iBAAmB,GAAGH,G,CAG7C,MAAAI,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,KAAK,OAAOC,MAAM,iBACrBH,EAAA,OAAAC,IAAA,2CAAKE,MAAM,uBAAuBC,MAAOzB,KAAKC,KAAMyB,OAAQ1B,KAAKC,MAC/DoB,EAAA,UAAAC,IAAA,2CACEE,MAAM,uBAAsB,eACdxB,KAAKE,YACJ,yBACfyB,KAAK,cACLlB,EAAGT,KAAKC,KAAO,EAAID,KAAKE,YAAc,EACtC0B,GAAI5B,KAAKC,KAAO,EAChB4B,GAAI7B,KAAKC,KAAO,IAGlBoB,EACE,UAAAC,IAAA,2CAAAQ,IAAMC,GAAQ/B,KAAKQ,UAAYuB,EAC/BP,MAAM,2BAA0B,eAClBxB,KAAKE,YAAW,iBACf,QACfyB,KAAK,cACLlB,EAAGT,KAAKC,KAAO,EAAID,KAAKE,YAAc,EACtC0B,GAAI5B,KAAKC,KAAO,EAChB4B,GAAI7B,KAAKC,KAAO,KAIpBoB,EAAA,QAAAC,IAAA,2CAAMC,KAAK,QAAQC,MAAM,wBACvBH,EAAQ,QAAAC,IAAA,8C","ignoreList":[]}

package/dist/ui-library/p-2bac7418.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as e,h as s,H as i,g as a}from"./p-BF09Gr5y.js";import{E as r}from"./p-C4h4qpGl.js";import{g as t}from"./p-j3oIB5oT.js";const o=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host :after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block;user-select:none;--search-border-width:1px}::slotted(six-search-field){position:absolute;margin-left:var(--search-border-width);width:calc(100% - 2 var(--search-border-width))}.six-header{display:flex;width:100%;height:var(--six-header-height);background-color:var(--six-header-background-color);align-items:stretch;box-shadow:var(--six-shadow-medium);border-bottom:var(--six-header-border-with) solid var(--six-header-border-color)}.six-header__search-field{opacity:0;transform:scale(0.9);transition:var(--six-transition-fast) opacity, var(--six-transition-fast) transform;display:none}.six-header__search-field--visible{opacity:1;transform:none;display:block}.six-header__search-field--shift-content.six-header__search-field--visible{height:2.65rem;transition:var(--six-transition-fast) height}.six-header__search-field--shift-content:not(.six-header__search-field--visible){height:0;transition:var(--six-transition-fast) height}";const h=class{constructor(s){e(this,s);this.shiftContent=false;this.openSearch=false;this.eventListeners=new r}handleOpenSearchChange(){if(this.openSearch){setTimeout((async()=>{var e,s,i;return(i=(s=(e=t(this.host,"search-field"))===null\|\|e===void 0?void 0:e.shadowRoot)===null\|\|s===void 0?void 0:s.querySelector("six-input"))===null\|\|i===void 0?void 0:i.setFocus()}),50)}}disconnectedCallback(){this.eventListeners.removeAll()}render(){return s(i,{key:"3c03ee28b12600576e0b714e5077ea2c800a4c65"},s("header",{key:"8d3807cb3b05ca07cce629bf1dcdbdb49a6d400a",part:"header",class:"six-header"},s("slot",{key:"7a920fedf946e99c4d7a538706e8061e165a0015"})),s("div",{key:"c884119828755832b8312412647b8ff89fae5a88",class:{"six-header__search-field":true,"six-header__search-field--visible":this.openSearch,"six-header__search-field--shift-content":this.shiftContent}},s("slot",{key:"42d1ab374144bc3da2b1cd144e3328c64ee75204",name:"search-field"})))}static get assetsDirs(){return["assets"]}get host(){return a(this)}static get watchers(){return{openSearch:["handleOpenSearchChange"]}}};h.style=o;export{h as six_header};
2	+ //# sourceMappingURL=p-2bac7418.entry.js.map

package/dist/ui-library/p-2bac7418.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixHeaderCss","SixHeader","constructor","hostRef","this","shiftContent","openSearch","eventListeners","EventListeners","handleOpenSearchChange","setTimeout","async","_a","_b","_c","getSlot","host","shadowRoot","querySelector","setFocus","disconnectedCallback","removeAll","render","h","Host","key","part","class","name"],"sources":["src/components/six-header/six-header.scss?tag=six-header&encapsulation=shadow","src/components/six-header/six-header.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: block;\n user-select: none;\n --search-border-width: 1px;\n}\n\n::slotted(six-search-field) {\n position: absolute;\n margin-left: var(--search-border-width);\n width: calc(100% - 2 * var(--search-border-width));\n}\n\n.six-header {\n display: flex;\n width: 100%;\n height: var(--six-header-height);\n background-color: var(--six-header-background-color);\n align-items: stretch;\n box-shadow: var(--six-shadow-medium);\n border-bottom: var(--six-header-border-with) solid var(--six-header-border-color);\n\n &__search-field {\n opacity: 0;\n transform: scale(0.9);\n transition: var(--six-transition-fast) opacity, var(--six-transition-fast) transform;\n display: none;\n\n &--visible {\n opacity: 1;\n transform: none;\n display: block;\n }\n\n &--shift-content.six-header__search-field--visible {\n height: 2.65rem;\n transition: var(--six-transition-fast) height;\n }\n\n &--shift-content:not(.six-header__search-field--visible) {\n height: 0;\n transition: var(--six-transition-fast) height;\n }\n }\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\nimport { EventListeners } from '../../utils/event-listeners';\nimport { getSlot } from '../../utils/slot';\n\n/**\n * @since 1.0\n * @status stable\n * @slot search-field - Used to define the search field component in the header.\n */\n@Component({\n tag: 'six-header',\n styleUrl: 'six-header.scss',\n shadow: true,\n assetsDirs: ['assets'],\n})\nexport class SixHeader {\n /** Indicates if content should be shifted down when search field is visible. */\n @Prop() shiftContent = false;\n\n /**\n * Set the header search input to be in an open or closed state.\n *\n * Focuses the first `six-input` found in the search slot.\n */\n @Prop() openSearch = false;\n\n @Watch('openSearch')\n handleOpenSearchChange() {\n if (this.openSearch) {\n // deferred due to https://github.com/ionic-team/stencil/issues/3772\n setTimeout(\n async () => getSlot(this.host, 'search-field')?.shadowRoot?.querySelector('six-input')?.setFocus(),\n 50\n );\n }\n }\n\n @Element() host!: HTMLSixHeaderElement;\n\n private eventListeners = new EventListeners();\n\n disconnectedCallback() {\n this.eventListeners.removeAll();\n }\n\n render() {\n return (\n <Host>\n <header part=\"header\" class=\"six-header\">\n <slot />\n </header>\n <div\n class={{\n 'six-header__search-field': true,\n 'six-header__search-field--visible': this.openSearch,\n 'six-header__search-field--shift-content': this.shiftContent,\n }}\n >\n <slot name={'search-field'} />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"iIAAA,MAAMA,EAAe,gqC,MCeRC,EAAS,MANtB,WAAAC,CAAAC,G,UAQUC,KAAYC,aAAG,MAOfD,KAAUE,WAAG,MAebF,KAAAG,eAAiB,IAAIC,CAwB9B,CApCC,sBAAAC,GACE,GAAIL,KAAKE,WAAY,CAEnBI,YACEC,UAAA,IAAAC,EAAAC,EAAAC,EAAY,OAAAA,GAAAD,GAAAD,EAAAG,EAAQX,KAAKY,KAAM,mBAAe,MAAAJ,SAAA,SAAAA,EAAEK,cAAU,MAAAJ,SAAA,SAAAA,EAAEK,cAAc,gBAAY,MAAAJ,SAAA,SAAAA,EAAEK,UAAU,GAClG,G,EASN,oBAAAC,GACEhB,KAAKG,eAAec,W,CAGtB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CAAQC,KAAK,SAASC,MAAM,cAC1BJ,EAAA,QAAAE,IAAA,8CAEFF,EAAA,OAAAE,IAAA,2CACEE,MAAO,CACL,2BAA4B,KAC5B,oCAAqCvB,KAAKE,WAC1C,0CAA2CF,KAAKC,eAGlDkB,EAAA,QAAAE,IAAA,2CAAMG,KAAM,kB","ignoreList":[]}

package/dist/ui-library/p-2db80aaf.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as i,c as s,h as t}from"./p-BF09Gr5y.js";import{s as e}from"./p-BY6hIEFX.js";const o=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block;height:100%}.sidebar__container{height:100%;overflow:auto}.sidebar__container.sidebar--open{border-right:1px solid var(--six-color-web-rock-300)}.sidebar__container:not(.sidebar--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.sidebar--left{color:var(--six-sidebar-color);background-color:var(--six-sidebar-background-color);transition:var(--six-transition-medium) margin-left;background-size:300vw 70%;background-position:bottom;background-repeat:no-repeat}.sidebar--right{transition:var(--six-transition-medium) margin-right}.sidebar--open.sidebar--left{margin-right:2px}.sidebar--open.sidebar--right{margin-left:2px}";const r=i=>{var s;return((s=i===null\|\|i===void 0?void 0:i.tagName)===null\|\|s===void 0?void 0:s.toLowerCase())==="six-sidebar-item-group"};const n=class{constructor(t){i(this,t);this.sixShow=s(this,"six-sidebar-show");this.sixAfterShow=s(this,"six-sidebar-after-show");this.sixHide=s(this,"six-sidebar-hide");this.sixAfterHide=s(this,"six-sidebar-after-hide");this.sixInitialFocus=s(this,"six-sidebar-initial-focus");this.willShow=false;this.willHide=false;this.isVisible=false;this.position="left";this.open=false;this.width="16rem";this.toggled=false;this.handleTransitionEnd=i=>{const s=i.target;if(i.type==="transitionend"&&s.classList.contains("sidebar__container")){this.resetTransitionVariables()}};this.closeSiblingDetailsOnShow=i=>{const s=i.target;if(this.sidebar!=null){e(s,this.sidebar)}const t=i=>{var t;let e=s;while(i(e)!=null){e=i(e);if(r(e)){const i=(t=e===null\|\|e===void 0?void 0:e.shadowRoot)===null\|\|t===void 0?void 0:t.querySelector("six-details");if(i!=null){i.open=false}}}};t((i=>i===null\|\|i===void 0?void 0:i.previousElementSibling));t((i=>i===null\|\|i===void 0?void 0:i.nextElementSibling))}}handleOpenChange(){this.open?this.show():this.hide()}componentWillLoad(){if(this.open){void this.show();this.resetTransitionVariables()}}componentDidRender(){this.setupTogglableMenuItems()}disconnectedCallback(){var i;(i=this.sidebar)===null\|\|i===void 0?void 0:i.removeEventListener("six-details-show",this.closeSiblingDetailsOnShow)}setupTogglableMenuItems(){if(!this.toggled\|\|this.sidebar==null)return;this.markAllMenuItemsAsSelectableEmpty();this.sidebar.addEventListener("six-details-show",this.closeSiblingDetailsOnShow)}markAllMenuItemsAsSelectableEmpty(){var i;const s=(i=this.sidebar)===null\|\|i===void 0?void 0:i.querySelector("slot");const t=(s===null\|\|s===void 0?void 0:s.assignedElements())\|\|[];const e=[];while(t.length>0){const i=t.pop();if((i===null\|\|i===void 0?void 0:i.shadowRoot)==null){continue}const s=i.shadowRoot.querySelectorAll("six-details");e.push(...s);const o=Array.from(i.children).filter(r);t.push(...o)}e.forEach((i=>i.selectableEmpty=true))}async toggle(){if(this.willShow\|\|this.willHide){return}if(this.open){await this.hide()}else{await this.show()}}async show(){if(this.willShow){return}const i=this.sixShow.emit();if(i.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true}async hide(){if(this.willHide){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false}async selectItemByIndex(i){if(this.sidebar==null)return;const s=this.sidebar.querySelector("slot");const t=((s===null\|\|s===void 0?void 0:s.assignedElements())\|\|[]).flatMap((i=>{var s;const t=(s=i.shadowRoot)===null\|\|s===void 0?void 0:s.querySelector("six-details");if(t==null){return[]}return[t]}));if(i<0\|\|i>t.length-1){console.error(`Tried to access sidebar menu item by index, but provided index out of range. Provided index: ${i}`);return}await t[i].show()}async selectItemByName(i){var s,t,e;const o=(s=this.sidebar)===null\|\|s===void 0?void 0:s.querySelector("slot");const r=o===null\|\|o===void 0?void 0:o.assignedElements();if(r==null){return}const n=r.findIndex((s=>(s===null\|\|s===void 0?void 0:s.name)===i));const a=(e=(t=r.at(n))===null\|\|t===void 0?void 0:t.shadowRoot)===null\|\|e===void 0?void 0:e.querySelector("six-details");await(a===null\|\|a===void 0?void 0:a.show())}resetTransitionVariables(){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}render(){return t("host",{key:"38d2d55b73e862c71ef3912fac01f6abd43a3b7c",class:"six-sidebar"},t("div",{key:"b8a7a32d48016310f943b42d03f1c4a44ff5bca4",class:{sidebar__container:true,"sidebar--visible":this.isVisible,"sidebar--open":this.open,"sidebar--left":this.position==="left","sidebar--right":this.position==="right"},style:{width:this.width,[`margin-${this.position}`]:this.open?"0":`calc(1rem - ${this.width})`},ref:i=>this.sidebar=i,"aria-hidden":this.open?"false":"true",onTransitionEnd:this.handleTransitionEnd},t("slot",{key:"a13e1cd44a68fa3ad15a94ccc56ec7c09f689e4c"})))}static get watchers(){return{open:["handleOpenChange"]}}};n.style=o;export{n as six_sidebar};
2	+ //# sourceMappingURL=p-2db80aaf.entry.js.map

package/dist/ui-library/p-2db80aaf.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["sixSidebarCss","isSidebarItemGroup","node","_a","tagName","toLowerCase","SixSidebar","constructor","hostRef","this","willShow","willHide","isVisible","position","open","width","toggled","handleTransitionEnd","event","target","type","classList","contains","resetTransitionVariables","closeSiblingDetailsOnShow","clickedMenuItem","sidebar","scrollIntoView","closeAllSiblingsBySiblingProperty","getSibling","detailsElement","shadowRoot","querySelector","previousElementSibling","nextElementSibling","handleOpenChange","show","hide","componentWillLoad","componentDidRender","setupTogglableMenuItems","disconnectedCallback","removeEventListener","markAllMenuItemsAsSelectableEmpty","addEventListener","slot","nodes","assignedElements","menuItems","length","pop","menuItemsForCurrentNode","querySelectorAll","push","newItemGroups","Array","from","children","filter","forEach","details","selectableEmpty","toggle","sixShow","emit","defaultPrevented","sixHide","selectItemByIndex","index","menuItemsOnRootLevel","flatMap","el","console","error","selectItemByName","value","sidebarItemGroups","indexOfSelectedElement","findIndex","name","selectedItem","_c","_b","at","sixAfterShow","sixAfterHide","render","h","key","class","sidebar__container","style","ref","onTransitionEnd"],"sources":["src/components/six-sidebar/six-sidebar.scss?tag=six-sidebar&encapsulation=shadow","src/components/six-sidebar/six-sidebar.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n@import 'src/global/mixins/scrollbar';\n\n:host {\n display: block;\n height: 100%;\n}\n\n.sidebar {\n &__container {\n // scroll\n height: 100%;\n overflow: auto;\n\n &.sidebar--open {\n border-right: 1px solid var(--six-color-web-rock-300);\n }\n\n &:not(.sidebar--visible) {\n @include hidden;\n }\n }\n\n &--left {\n color: var(--six-sidebar-color);\n background-color: var(--six-sidebar-background-color);\n // collapse\n transition: var(--six-transition-medium) margin-left;\n // six background\n background-size: 300vw 70%;\n background-position: bottom;\n background-repeat: no-repeat;\n }\n\n &--right {\n // collapse\n transition: var(--six-transition-medium) margin-right;\n }\n\n // if the sidebar is embedded within six-root it cuts-off the border styling, for thus we need to guarante a margin\n &--open {\n &.sidebar--left {\n margin-right: 2px;\n }\n\n &.sidebar--right {\n margin-left: 2px;\n }\n }\n}\n","import { Component, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { EmptyPayload } from '../../utils/types';\nimport { scrollIntoView } from '../../utils/scroll';\n\nconst isSidebarItemGroup = (node?: Element | null): boolean =>\n node?.tagName?.toLowerCase() === 'six-sidebar-item-group';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the nested side bar [group] items.\n */\n\n@Component({\n tag: 'six-sidebar',\n styleUrl: 'six-sidebar.scss',\n shadow: true,\n})\nexport class SixSidebar {\n private willShow = false;\n private willHide = false;\n\n private sidebar?: HTMLElement;\n\n @State() isVisible = false;\n\n /** Sidebar position */\n @Prop() position: 'left' | 'right' = 'left';\n\n /** Indicates whether the sidebar is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /** Sidebar width */\n @Prop() width = '16rem';\n\n /** Define whether sidebar is toggled meaning only one menu can be open at the same time*/\n @Prop() toggled = false;\n\n /** Emitted when the sidebar opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event({ eventName: 'six-sidebar-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the sidebar opens and all transitions are complete. */\n @Event({ eventName: 'six-sidebar-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the sidebar closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event({ eventName: 'six-sidebar-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the sidebar closes and all transitions are complete. */\n @Event({ eventName: 'six-sidebar-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n /**\n * Emitted when the sidebar opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and\n * allow you to set it on a different element in the sidebar, such as an input or button.\n */\n @Event({ eventName: 'six-sidebar-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n private handleTransitionEnd = (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.type === 'transitionend' && target.classList.contains('sidebar__container')) {\n this.resetTransitionVariables();\n }\n };\n\n componentWillLoad() {\n // Show on init if open\n if (this.open) {\n void this.show();\n // if the sidebar is open by default we need to manually reset the\n // transition variables since there will be no transition event\n this.resetTransitionVariables();\n }\n }\n\n componentDidRender() {\n this.setupTogglableMenuItems();\n }\n\n disconnectedCallback() {\n this.sidebar?.removeEventListener('six-details-show', this.closeSiblingDetailsOnShow);\n }\n\n private closeSiblingDetailsOnShow = (event: Event) => {\n const clickedMenuItem = event.target as HTMLElement;\n if (this.sidebar != null) {\n scrollIntoView(clickedMenuItem, this.sidebar);\n }\n\n const closeAllSiblingsBySiblingProperty = (\n getSibling: (node: Element | null | undefined) => Element | null | undefined\n ) => {\n let node: Element | null | undefined = clickedMenuItem;\n while (getSibling(node) != null) {\n node = getSibling(node);\n if (isSidebarItemGroup(node)) {\n const detailsElement = node?.shadowRoot?.querySelector('six-details');\n if (detailsElement != null) {\n detailsElement.open = false;\n }\n }\n }\n };\n\n // close all previous siblings\n closeAllSiblingsBySiblingProperty((node) => node?.previousElementSibling);\n // close all further siblings\n closeAllSiblingsBySiblingProperty((node) => node?.nextElementSibling);\n };\n\n private setupTogglableMenuItems() {\n if (!this.toggled || this.sidebar == null) return;\n this.markAllMenuItemsAsSelectableEmpty();\n this.sidebar.addEventListener('six-details-show', this.closeSiblingDetailsOnShow);\n }\n\n private markAllMenuItemsAsSelectableEmpty() {\n // when you have a toggled menu you also want to close other menu items when you click on an item without children\n // nice benefit this item will then also be highlighted\n const slot = this.sidebar?.querySelector('slot');\n const nodes = slot?.assignedElements() || [];\n\n // since we don't just want to make the top level empty menuItems selectable in toggled mode,\n // but also nested items we need to traverse the whole menu item tree\n const menuItems = [];\n while (nodes.length > 0) {\n const node = nodes.pop();\n if (node?.shadowRoot == null) {\n continue;\n }\n\n // collect six-details in the current shadowDOM\n const menuItemsForCurrentNode = node.shadowRoot.querySelectorAll('six-details');\n menuItems.push(...menuItemsForCurrentNode);\n\n // collect all six-sidebar-item-group children of the current node to afterwards check their shadowDOM too\n const newItemGroups = Array.from(node.children).filter(isSidebarItemGroup);\n nodes.push(...newItemGroups);\n }\n\n menuItems.forEach((details) => (details.selectableEmpty = true));\n }\n\n /** Toggles whether the sidebar should be shown or hidden */\n @Method()\n async toggle() {\n if (this.willShow || this.willHide) {\n return;\n }\n\n if (this.open) {\n await this.hide();\n } else {\n await this.show();\n }\n }\n\n /** Shows the sidebar */\n @Method()\n async show() {\n if (this.willShow) {\n return;\n }\n\n const sixShow = this.sixShow.emit();\n if (sixShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.willShow = true;\n this.isVisible = true;\n this.open = true;\n }\n\n /** Hides the sidebar */\n @Method()\n async hide() {\n if (this.willHide) {\n return;\n }\n\n const sixHide = this.sixHide.emit();\n if (sixHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.willHide = true;\n this.open = false;\n }\n\n /** Allows to select a menu item programmatically by index */\n @Method()\n async selectItemByIndex(index: number) {\n if (this.sidebar == null) return;\n\n const slot = this.sidebar.querySelector('slot');\n const menuItemsOnRootLevel: HTMLSixDetailsElement[] = (slot?.assignedElements() || []).flatMap((el) => {\n const detailsElement = el.shadowRoot?.querySelector('six-details');\n if (detailsElement == null) {\n return [];\n }\n return [detailsElement];\n });\n if (index < 0 || index > menuItemsOnRootLevel.length - 1) {\n console.error(\n `Tried to access sidebar menu item by index, but provided index out of range. Provided index: ${index}`\n );\n return;\n }\n await menuItemsOnRootLevel[index].show();\n }\n\n /** Allows to select a menu item programmatically by name */\n @Method()\n async selectItemByName(value: string) {\n const slot = this.sidebar?.querySelector('slot');\n const sidebarItemGroups = slot?.assignedElements() as HTMLSixSidebarItemGroupElement[];\n if (sidebarItemGroups == null) {\n return;\n }\n\n const indexOfSelectedElement = sidebarItemGroups.findIndex((el) => el?.name === value);\n const selectedItem = sidebarItemGroups.at(indexOfSelectedElement)?.shadowRoot?.querySelector('six-details');\n await selectedItem?.show();\n }\n\n private resetTransitionVariables() {\n this.isVisible = this.open;\n this.willShow = false;\n this.willHide = false;\n this.open ? this.sixAfterShow.emit() : this.sixAfterHide.emit();\n }\n\n render() {\n return (\n <host class=\"six-sidebar\">\n <div\n class={{\n sidebar__container: true,\n 'sidebar--visible': this.isVisible,\n 'sidebar--open': this.open,\n 'sidebar--left': this.position === 'left',\n 'sidebar--right': this.position === 'right',\n }}\n style={{\n width: this.width,\n [`margin-${this.position}`]: this.open ? '0' : `calc(1rem - ${this.width})`,\n }}\n ref={(el) => (this.sidebar = el)}\n aria-hidden={this.open ? 'false' : 'true'}\n onTransitionEnd={this.handleTransitionEnd}\n >\n <slot />\n </div>\n </host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-2f001f2b.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{h as e,r as t,c as i,g as s}from"./p-BF09Gr5y.js";import{E as r}from"./p-C4h4qpGl.js";import{D as o,a,d as n}from"./p-ltzGzaAu.js";import{h}from"./p-j3oIB5oT.js";import{m as l,c as d,a as c,b as u}from"./p-Dd6pdO8C.js";const p=e=>typeof e==="string";const m=e=>e==null;const b={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"]},es:{months:["enero","febrero","marzo","abril","mayo","junio","julio","agosto","septiembre","octubre","noviembre","diciembre"],monthsShort:["ene","feb","mar","abr","may","jun","jul","ago","sep","oct","nov","dic"],monthsShortGrouped:[["ene","feb","mar","abr"],["may","jun","jul","ago"],["sep","oct","nov","dic"]],weekdays:["lunes","martes","miércoles","jueves","viernes","sábado","domingo"],weekdaysShort:["lun","mar","mié","jue","vie","sáb","dom"],weekdaysMin:["lu","ma","mi","ju","vi","sa","do"]}};const f=()=>new Date;const y=e=>new Date(e.getFullYear(),e.getMonth(),e.getDate());const v=e=>e instanceof Date&&!isNaN(e.getTime())&&new Date(e).toString()!=="Invalid Date";const k=e=>{if(e&&v(e)){return e.getFullYear()}throw new Error("Not a valid date")};const g=e=>{if(e&&v(e)){return e.getMonth()}throw new Error("Not a valid date")};const w=e=>{if(e&&v(e)){return e.getDate()}throw new Error("Not a valid date")};const x=e=>{if(e&&v(e)){return e.getHours()}throw new Error("Not a valid date")};const _=e=>{if(e&&v(e)){return e.getMinutes()}throw new Error("Not a valid date")};const M=e=>{if(e&&v(e)){return e.getSeconds()}throw new Error("Not a valid date")};const D=e=>{const t=[6,0,1,2,3,4,5];const i=new Date(e);i.setDate(i.getDate()-t[i.getDay()]);return i};const j=(e,t)=>(e===null\|\|e===void 0?void 0:e.getFullYear())===(t===null\|\|t===void 0?void 0:t.getFullYear());const S=(e,t)=>j(e,t)&&(e===null\|\|e===void 0?void 0:e.getMonth())===(t===null\|\|t===void 0?void 0:t.getMonth());const C=(e,t)=>S(e,t)&&(e===null\|\|e===void 0?void 0:e.getDate())===(t===null\|\|t===void 0?void 0:t.getDate());const O=(e,t)=>C(D(e),D(t));const z=(e,t)=>{if(!p(e)\|\|!p(t)){return false}if(e.length<6\|\|t.length<6){return false}const{day:i,month:s}=U(e,t);if(i>31\|\|s>11\|\|i<=0\|\|s<0){return false}const r=X(e,t);if(m(r)){return false}return r.toString()!=="Invalid Date"};const F=(e,t,i)=>{if(!e){return true}if(t&&e<t){return false}if(i&&i<e){return false}return true};const J=(e,t,i,s=2)=>{const r=s-1;const o=t.charAt(e+r)===i;const a=e+r<t.length;return a&&o};const A=(e,t)=>{let i=String(e);while(i.length<t){i="0"+i}return i};const N=(e,t)=>{if(e==null){return""}let i="";for(let s=0;s<t.length;s++){switch(t.charAt(s)){case"d":if(J(s,t,"d")){i+=A(e.getDate(),2);s++}else{i+=String(e.getDate())}break;case"m":if(J(s,t,"m")){i+=A(e.getMonth()+1,2);s++}else{i+=String(e.getMonth()+1)}break;case"y":if(J(s,t,"y",4)){s+=3;i+=e.getFullYear()}else{i+=(e.getFullYear()%100<10?"0":"")+e.getFullYear()%100;s++}break;case"h":if(J(s,t,"h")){i+=A(e.getHours(),2);s++}else{i+=String(e.getHours())}break;case"M":if(J(s,t,"M")){i+=A(e.getMinutes(),2);s++}else{i+=String(e.getMinutes())}break;case"s":if(J(s,t,"s")){i+=A(e.getSeconds(),2);s++}else{i+=String(e.getSeconds())}break;default:i+=t.charAt(s)}}return i};const G=/(\[[^\[]\])\|(mm\|dd\|yyyy\|yy\|hh\|MM\|ss\|.)/g;const E=/\d\d/;const T=/\d{4}/;const B=/[^0-9]/g;const I="year";const P="month";const L="day";const Y="hour";const H="minute";const W="second";const q={};const R=(e,t,i)=>{const s=Array.isArray(e)?e:[e];let r;if(typeof i==="string"){r=e=>{const t=parseInt(e,10);return{[i]:t}}}else{r=i}s.forEach((e=>{q[e]=[t,r]}))};R("yy",E,(e=>{const t=(new Date).getFullYear();const i=Math.floor(t/100);let s=parseInt(e,10);s=(s>68?i-1:i)100+s;return{[I]:s}}));R("yyyy",T,I);R("mm",E,(e=>({[P]:parseInt(e,10)-1})));R("dd",E,L);R("hh",E,Y);R("MM",E,H);R("ss",E,W);const V=(e,t=new Date)=>{const i=[0,0,1,0,0,0];const s=[t.getFullYear(),t.getMonth(),t.getDate(),t.getHours(),t.getMinutes(),t.getSeconds()];let r=true;for(let t=0;t<7;t++){if(e[t]===undefined){i[t]=r?s[t]:i[t]}else{i[t]=e[t];r=false}}return i};const $=(e,t,i,s,r,o)=>{if(!(e<100&&e>=0)){return new Date(e,t,i,s,r,o)}const a=new Date(e+400,t,i,s,r,o);if(isFinite(a.getFullYear())){a.setFullYear(e)}return a};const K=(e,t)=>{const i=t.match(G);if(!i){throw new Error}const{length:s}=i;let r={};for(let t=0;t<s;t+=1){const s=i[t];const o=q[s];if(!o){const t=s.replace(/^\[\|\]$/g,"");if(e.indexOf(t)===0){e=e.substr(t.length)}else{throw new Error("not match")}}else{const t=o[0];const i=o[1];const s=(t.exec(e)\|\|[])[0];const a=i(s);r=Object.assign(Object.assign({},r),a);e=e.replace(s,"")}}return r};const Q=(e,t)=>{if(e.length===t.length){return e}const i=e.match(B)[0];return e.split(i).map((e=>e.length===1?"0"+e:e)).join(i)};const U=(e,t)=>{const i=Q(e,t);return K(i,t)};const X=(e,t)=>{try{const{backupDate:i=new Date}={};const{year:s,month:r,day:o,hour:a,minute:n,second:h,date:l}=U(e,t);if(l!=null){return l}const d=[s,r,o,a,n,h];const c=V(d,i);return $(...c)}catch(e){return new Date(NaN)}};const Z=e=>{const{firstDateOfBox:t,allowedDates:i,dateFormat:s,selectedDate:r,minDate:o,maxDate:a,pointerDate:n}=e;const h=new Date(t);const l=new Date(t);let d=[];do{let e=[];do{e=[...e,{date:new Date(l),display:N(l,s),dateString:N(l,s),label:w(l).toString(),isToday:C(l,f()),isSelected:r&&C(l,r),isDisabled:!i(l)\|\|!F(l,o,a),isOutdated:n.month!==l.getMonth()\|\|!F(l,o,a)}];l.setDate(l.getDate()+1)}while(O(l,h));d=[...d,e];h.setDate(h.getDate()+7)}while(S(new Date(n.year,n.month,n.day),l));return d};function ee(e,t){const i=5;return[...Array(t).keys()].map((i=>i+e-Math.floor(t/2))).reduce(((e,t,s)=>{if(s%i===0){e.push([])}e[e.length-1].push(t);return e}),[])}var te;(function(e){e["DDMMYYY_DOT"]="dd.mm.yyyy";e["YYYYMMDD_DASH"]="yyyy-mm-dd";e["DDMMYYYY_DASH"]="dd-mm-yyyy";e["DDMMYYYY_SLASH"]="dd/mm/yyyy";e["YYYYMMDD_SLASH"]="yyyy/mm/dd";e["DDMMYY_DOT"]="dd.mm.yy";e["YYMMDD_DASH"]="yy-mm-dd";e["DDMMYY_DASH"]="dd-mm-yy";e["DDMMYY_SLASH"]="dd/mm/yy";e["YYMMDD_SLASH"]="yy/mm/dd";e["DDMMYYY_DOT_TIME"]="dd.mm.yyyy hh:MM:ss";e["YYYYMMDD_DASH_TIME"]="yyyy-mm-dd hh:MM:ss";e["DDMMYYYY_DASH_TIME"]="dd-mm-yyyy hh:MM:ss";e["DDMMYYYY_SLASH_TIME"]="dd/mm/yyyy hh:MM:ss";e["YYYYMMDD_SLASH_TIME"]="yyyy/mm/dd hh:MM:ss";e["DDMMYY_DOT_TIME"]="dd.mm.yy hh:MM:ss";e["YYMMDD_DASH_TIME"]="yy-mm-dd hh:MM:ss";e["DDMMYY_DASH_TIME"]="dd-mm-yy hh:MM:ss";e["DDMMYY_SLASH_TIME"]="dd/mm/yy hh:MM:ss";e["YYMMDD_SLASH_TIME"]="yy/mm/dd hh:MM:ss"})(te\|\|(te={}));const ie=t=>{const i=t.locale;const s=e=>i.monthsShort[f().getMonth()]===e;const r=e=>{var s;return((s=t.selectedDate)===null\|\|s===void 0?void 0:s.getMonth())===i.monthsShort.findIndex((t=>t===e))};return e("table",{class:"datepicker-table",part:"month-selection"},e("tbody",null,i.monthsShortGrouped.map((i=>e("tr",{class:"datepicker-table__row"},i.map((i=>e("td",{onClick:()=>t.onClickMonthCell(i),class:{"datepicker-table__cell":true,"datepicker-table__cell--is-today":s(i),"datepicker-table__cell--is-selected":r(i)}},i))))))))};const se=t=>e("table",{class:"datepicker-table",part:"day-selection"},e("thead",{part:"weekday-header"},t.locale.weekdaysMin.map((t=>e("th",{class:"datepicker__cell"},t)))),e("tbody",null,t.calendarGrid.map((i=>e("tr",{class:"datepicker-table__row"},i.map((i=>e("td",{"data-date":i.dateString,onClick:()=>t.onClickDateCell(i),class:{"datepicker-table__cell":true,"datepicker-table__cell--is-today":i.isToday,"datepicker-table__cell--is-selected":i.isSelected,"datepicker-table__cell--is-outdated":i.isOutdated,"datepicker-table__cell--is-disabled":i.isDisabled,"datepicker-table__cell--is-selectable":!i.isDisabled}},i.label))))))));const re=t=>e("table",{class:"datepicker-table",part:"year-selection"},e("tbody",null,t.yearSelection.map((i=>e("tr",{class:"datepicker-table__row"},i.map((i=>{var s;return e("td",{onClick:()=>t.onClickYearCell(i),class:{"datepicker-table__cell":true,"datepicker-table__cell--is-today":f().getFullYear()===i,"datepicker-table__cell--is-selected":((s=t.selectedDate)===null\|\|s===void 0?void 0:s.getFullYear())===i}},i)})))))));const oe=":host{position:relative;box-sizing:border-box}:host ,:host :before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:block;font-family:var(--six-font-family)}.datepicker__container{position:relative}.datepicker__popup{min-width:400px;background-color:white;padding:0.5em 0.5em 1.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.datepicker__popup--is-up{bottom:100%;min-height:382px}.datepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.datepicker-header{display:flex;justify-content:space-between;border-bottom:1px solid var(--six-color-web-rock-400);padding:0.5em;margin-bottom:1em}.datepicker-header svg{fill:var(--six-color-web-rock-900);stroke:none}.datepicker-header__btn{cursor:pointer;width:2.5em;height:2.5em;display:flex;vertical-align:middle;align-items:center;justify-content:center}.datepicker-header__btn:hover{background-color:var(--six-color-web-rock-100);border-radius:100%}.datepicker-header__label{display:flex}.datepicker-header__label>div{cursor:pointer;padding:0.5em;display:flex;vertical-align:middle;align-items:center;justify-content:center}.datepicker-header__label>div:hover{background-color:var(--six-color-web-rock-100)}.datepicker-table{width:100%}.datepicker-table__cell{text-align:center;width:2.5rem;height:2.5rem;cursor:pointer}.datepicker-table__cell:hover{background-color:var(--six-color-web-rock-100)}.datepicker-table__cell--is-today{border:1px solid var(--six-color-web-rock-400)}.datepicker-table__cell--is-selected{background-color:var(--six-color-red);color:var(--six-color-white)}.datepicker-table__cell--is-disabled{background-color:var(--six-color-web-rock-200);cursor:initial}.datepicker-table__cell--is-disabled:hover{background-color:var(--six-color-web-rock-200)}.datepicker-table__cell--is-outdated{color:var(--six-color-web-rock-400)}.datepicker-clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.datepicker-clear:hover{color:var(--six-input-icon-color-hover)}.datepicker-clear:focus{outline:none}.datepicker-clear--right{right:0;position:absolute}.datepicker-clear--left{right:35px;position:absolute}.input--empty .datepicker-clear{visibility:hidden}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}six-timepicker::part(popup){border:none;padding:0.5em 0.5em 0;min-height:0}";const ae=25;const ne=400;var he;(function(e){e["DAY"]="day";e["MONTH"]="month";e["YEAR"]="year"})(he\|\|(he={}));const le=class{constructor(e){t(this,e);this.sixSelect=i(this,"six-datepicker-select");this.sixClear=i(this,"six-datepicker-clear");this.sixBlur=i(this,"six-datepicker-blur");this.eventListeners=new r;this.pointerDate=le.getCurrentDateAsPointer();this.selectionMode=he.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.closeOnSelect=this.type==="date";this.size="medium";this.required=false;this.label="";this.errorText="";this.invalid=false;this.dateFormat=te.DDMMYYY_DOT;this.debounce=o;this.name="";this.clearable=false;this.iconPosition="left";this.hoist=false;this.previousUnit=()=>{if(this.selectionMode===he.DAY){this.previousMonth()}else if(this.selectionMode===he.MONTH){this.previousYear()}else if(this.selectionMode===he.YEAR){this.previousYearGroup()}};this.nextUnit=()=>{if(this.selectionMode===he.DAY){this.nextMonth()}else if(this.selectionMode===he.MONTH){this.nextYear()}else if(this.selectionMode===he.YEAR){this.nextYearGroup()}};this.handleDocumentKeyDown=e=>{var t;const i=e;if(this.open&&i.key==="Escape"){i.stopPropagation();this.closePopup();void((t=this.inputElement)===null\|\|t===void 0?void 0:t.setFocus())}if(i.key==="Tab"){this.closePopup()}};this.handleDocumentMouseDown=e=>{const t=e.composedPath();if(!t.includes(this.container)){this.closePopup();return}};this.handleClearClick=async e=>{e.stopPropagation();await this.select(undefined);this.sixClear.emit()};this.onTimepickerChange=e=>{const t=e.detail.value;const i=new Date;if(this.selectedDate!=null){i.setFullYear(this.selectedDate.getFullYear(),this.selectedDate.getMonth(),this.selectedDate.getDate())}if(t!=null){const e=t.hours;const s=t.minutes;const r=t.seconds;if(e!=null){i.setHours(e,s,r)}}this.updateValue(i);this.updatePointerDates()};this.onClickDateCell=e=>{if(!e.isDisabled){void this.select(e.dateString)}};this.onClickMonthCell=e=>{const t=b[this.locale].monthsShort.findIndex((t=>t===e));this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{month:t});this.selectionMode=he.DAY};this.onClickYearCell=e=>{this.pointerDate=Object.assign(Object.assign({},this.pointerDate),{year:e});this.selectionMode=he.DAY};this.handleInputChange=e=>{if(this.inputElement==null){return}e.stopPropagation();const t=this.inputElement.value;if(!z(t,this.dateFormat)){return}const i=X(t,this.dateFormat);if(i===undefined){return}this.updateIfChanged(i);const s=t.replace(/[^\d]/g,"");if(s.length>=6){const e=X(t,this.dateFormat);const i=N(e,this.dateFormat);if(z(i,this.dateFormat)){this.selectedDate=X(i,this.dateFormat);this.updatePointerDates();this.updateValue(this.selectedDate)}}};this.handleOnBlur=e=>{var t,i,s;e.stopPropagation();if(((t=this.inputElement)===null\|\|t===void 0?void 0:t.value)===""&&v(this.value)){this.value=undefined;this.sixSelect.emit(this.value)}const r=X((i=this.inputElement)===null\|\|i===void 0?void 0:i.value,this.dateFormat);if(v(r)&&((s=this.value)===null\|\|s===void 0?void 0:s.getTime())!==(r===null\|\|r===void 0?void 0:r.getTime())){this.value=r}if(this.inputElement!=null){this.inputElement.value=N(this.value,this.dateFormat)}this.sixBlur.emit(this.value)}}debounceChanged(){this.sixSelect=a(this.sixSelect,this.debounce)}valueChanged(){if(this.value!=null&&!v(this.value)){console.warn("invalid date value: ",this.value);this.value=undefined;this.sixSelect.emit(this.value)}this.selectedDate=this.value;this.updatePointerDates()}async resizeHandler(){this.updateDropdownDirection();this.moveOpenHoistedPopup();this.adjustPopupPosition()}async scrollHandler(){this.updateDropdownDirection();this.moveOpenHoistedPopup()}moveOpenHoistedPopup(){l(this.hoist,this.open,this.popup,this.inputElement,this.wrapper,ne)}get container(){return this.containingElement\|\|this.host}get firstDateOfBox(){const e=new Date(this.pointerDate.year,this.pointerDate.month,1);return D(e)}async setFocus(e){var t;(t=this.inputElement)===null\|\|t===void 0?void 0:t.setFocus(e)}get calendarGrid(){return Z({firstDateOfBox:this.firstDateOfBox,allowedDates:this.allowedDates,dateFormat:this.dateFormat,selectedDate:this.selectedDate,minDate:this.min,maxDate:this.max,pointerDate:this.pointerDate})}updateDropdownDirection(){if(this.inputElement==null\|\|this.wrapper==null){return}this.isDropDownContentUp=d(this.inputElement,this.wrapper,ne)}getMonthStringForIndex(e){return b[this.locale].months[e]}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-ae})}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}}}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+ae})}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)}closePopup(){if(this.inline){return}this.open=false;this.eventListeners.remove(document,"keydown",this.handleDocumentKeyDown);this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown);this.selectionMode=he.DAY}updatePointerDates(){const e=this.getPointerDate();if(this.differsFromPointerDate(e)){this.pointerDate={year:k(e),month:g(e),day:w(e),hours:x(e),minutes:_(e),seconds:M(e)}}}differsFromPointerDate(e){return this.pointerDate.day!==w(e)\|\|this.pointerDate.month!==g(e)\|\|this.pointerDate.year!==k(e)\|\|this.pointerDate.hours!==x(e)\|\|this.pointerDate.minutes!==_(e)\|\|this.pointerDate.seconds!==M(e)}getPointerDate(){if(this.selectedDate!==undefined&&this.selectedDate!==null){return this.selectedDate}if(this.defaultDate==null){return this.type==="date"?y(f()):f()}else{return X(this.defaultDate,this.dateFormat)}}updateValue(e){this.updateIfChanged(e)}updateIfChanged(e){var t;if(((t=this.value)===null\|\|t===void 0?void 0:t.getTime())===(e===null\|\|e===void 0?void 0:e.getTime())){return}this.value=e;this.sixSelect.emit(this.value)}async select(e){if(e==null){this.updateValue(undefined)}else{const t=X(e,this.dateFormat);t===null\|\|t===void 0?void 0:t.setHours(this.pointerDate.hours,this.pointerDate.minutes,this.pointerDate.seconds);this.updateValue(t)}this.updatePointerDates();if(this.closeOnSelect){this.closePopup()}}componentWillLoad(){this.selectedDate=this.value;this.updatePointerDates();this.updateValue(this.value);if(this.inline){this.open=true}if(this.open){this.setupEventListenersForOpenPopup()}}componentDidLoad(){if(this.inputElement!=null){this.eventListeners.add(this.inputElement,"six-input-input",n(this.handleInputChange,this.debounce));this.eventListeners.add(this.inputElement,"six-input-blur",this.handleOnBlur)}}componentDidRender(){this.adjustPopupPosition()}renderHeader(){return e("header",{class:"datepicker-header",part:"header"},e("div",{class:"datepicker-header__btn prev",onClick:this.previousUnit},e("svg",{viewBox:"0 5 13 13",width:"14",height:"23"},e("path",{d:"M11.67 3.87L9.9 2.1 0 12l9.9 9.9 1.77-1.77L3.54 12z"}))),e("div",{class:"datepicker-header__label"},this.selectionMode===he.DAY&&e("div",{onClick:()=>this.selectionMode=he.MONTH},e("span",{class:"datepicker-header__label-month"},this.getMonthStringForIndex(this.pointerDate.month)),e("span",null,e("svg",{viewBox:"-3 -4 24 24",width:"20",height:"20"},e("polyline",{points:"6 9 12 15 18 9"})))),this.selectionMode!==he.YEAR&&e("div",{onClick:()=>this.selectionMode=he.YEAR},e("span",{class:"datepicker-header__label-year"},this.pointerDate.year),e("span",null,e("svg",{viewBox:"-3 -4 24 24",width:"20",height:"20"},e("polyline",{points:"6 9 12 15 18 9"})))),this.selectionMode===he.YEAR&&e("div",null,this.pointerDate.year-Math.floor(ae/2)," –"," ",this.pointerDate.year+Math.floor(ae/2))),e("div",{class:"datepicker-header__btn next",onClick:this.nextUnit},e("svg",{viewBox:"5 5 13 13",width:"14",height:"23"},e("path",{d:"M5.88 4.12L13.76 12l-7.88 7.88L8 22l10-10L8 2z"}))))}renderBody(){switch(this.selectionMode){case he.DAY:return e(se,{locale:b[this.locale],calendarGrid:this.calendarGrid,onClickDateCell:this.onClickDateCell});case he.MONTH:return e(ie,{locale:b[this.locale],selectedDate:this.selectedDate,onClickMonthCell:this.onClickMonthCell});case he.YEAR:return e(re,{selectedDate:this.selectedDate,yearSelection:ee(this.pointerDate.year,ae),onClickYearCell:this.onClickYearCell})}}renderCustomIcon(){const t=h(this.host,"custom-icon")?e("slot",{name:"custom-icon"}):e("six-icon",{size:this.size==="large"?"medium":this.size},"today");return e("span",{slot:"prefix",part:"icon",class:{prefix:true,"prefix--right":this.iconPosition==="right"}},t)}renderClearable(){return this.clearable&&e("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"},e("six-icon",{size:"small"},"clear"))}render(){var t,i,s;this.adjustPopupPosition();return e("div",{key:"b5ba1d95babef5f6f47bd176f607756df09f293b",ref:e=>this.wrapper=e,class:"datepicker__container"},e("six-input",{key:"bbc7941bb975cb5e66eda215fea89dc3455724a3",part:"base",value:N(this.value,this.dateFormat),ref:e=>this.inputElement=e,placeholder:this.placeholder,readonly:this.readonly,disabled:this.disabled,name:this.name,label:this.label,required:this.required,errorText:this.errorText,errorTextCount:this.errorTextCount,invalid:this.invalid,onClick:()=>this.openCalendar(),size:this.size,class:{"input--empty":this.value==null}},this.renderCustomIcon(),this.renderClearable(),h(this.host,"label")?e("span",{slot:"label"},e("slot",{name:"label"})):null,h(this.host,"error-text")?e("span",{slot:"error-text"},e("slot",{name:"error-text"})):null),this.open&&e("div",{key:"ceaf12686b514b8708e1b254e8ed8990c519e19b",part:"popup",ref:e=>this.popup=e,class:{datepicker__popup:true,"datepicker__popup--is-up":this.placement!=null?this.placement==="top":this.isDropDownContentUp,"datepicker__popup--is-inline":this.inline}},this.renderHeader(),this.renderBody(),this.type==="date-time"&&e("six-timepicker",{key:"c978d4bf39f7b212eb6f4f37acbfc2f5533e2ebc",debounce:this.debounce,inline:true,"onSix-timepicker-change-debounced":e=>this.onTimepickerChange(e),value:((t=this.selectedDate)===null\|\|t===void 0?void 0:t.getHours())+":"+((i=this.selectedDate)===null\|\|i===void 0?void 0:i.getMinutes())+":"+((s=this.selectedDate)===null\|\|s===void 0?void 0:s.getSeconds())}),e("div",{key:"ffaec9fff60951e6f8134437f31b359d93b3b91e",class:"datepicker__footer"},e("slot",{key:"58655ebaf55d53e2524eee16e87ecf629fe9eb29"}))))}adjustPopupPosition(){c(this.hoist,this.popup,this.inputElement,this.wrapper,ne,(e=>this.isDropDownContentUp=e));u(this.popup)}connectedCallback(){this.eventListeners.forward("six-datepicker-select","change",this.host);this.eventListeners.forward("six-datepicker-blur","blur",this.host)}disconnectedCallback(){this.eventListeners.removeAll()}static getCurrentDateAsPointer(){return{year:k(f()),month:g(f()),day:w(f()),hours:x(f()),minutes:_(f()),seconds:M(f())}}get host(){return s(this)}static get watchers(){return{debounce:["debounceChanged"],value:["valueChanged"]}}};le.style=oe;export{le as six_datepicker};
2	+ //# sourceMappingURL=p-2f001f2b.entry.js.map