npm - @six-group/ui-library - Versions diffs - 0.0.0-insider.afba913 → 0.0.0-insider.b0fd8e9 - Mend

@six-group/ui-library 0.0.0-insider.afba913 → 0.0.0-insider.b0fd8e9

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 (632) hide show

package/dist/components/p-Cemjz04k.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-Cemjz04k.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"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:\n var(--six-transition-fast) background-color,\n var(--six-transition-fast) color,\n var(--six-transition-fast) border,\n 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"],"version":3}

package/dist/components/p-Mse5vRUS.js DELETED Viewed

@@ -1,52 +0,0 @@
-import { p as proxyCustomElement, H, h } from './p-BtF2Ym6T.js';
-const sixIconCss = ":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}:host{display:inline-flex;vertical-align:middle}.material-icons{vertical-align:middle;font-weight:normal;font-style:normal;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\";user-select:none}.material-icons-filled{font-family:\"Material Icons\"}.material-icons-outlined{font-family:\"Material Icons Outlined\"}.icon--xsmall{font-size:12px}.icon--small{font-size:18px}.icon--medium{font-size:24px}.icon--large{font-size:36px}.icon--xlarge{font-size:48px}.icon--xxlarge{font-size:72px}.icon--xxxlarge{font-size:96px}.icon--inherit{font-size:1.5em}";
-const SixIcon = /*@__PURE__*/ proxyCustomElement(class SixIcon extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        /** The icon's size. */
-        this.size = 'inherit';
-        /** If set to true the default material outlined icons are not used. */
-        this.filled = false;
-    }
-    render() {
-        return (h("i", { key: '748f3396556d9bee11a96c550c4f04b5d4945842', class: {
-                'material-icons': true,
-                'material-icons-outlined': !this.filled,
-                'material-icons-filled': this.filled,
-                'icon--xsmall': this.size === 'xSmall',
-                'icon--small': this.size === 'small',
-                'icon--medium': this.size === 'medium',
-                'icon--large': this.size === 'large',
-                'icon--xlarge': this.size === 'xLarge',
-                'icon--xxlarge': this.size === 'xxLarge',
-                'icon--xxxlarge': this.size === 'xxxLarge',
-                'icon--inherit': this.size === 'inherit',
-            } }, h("slot", { key: 'd80f49ba0904122e01610b0f23bae0915ee9c6ec' })));
-    }
-    static get style() { return sixIconCss; }
-}, [1, "six-icon", {
-        "size": [513],
-        "filled": [4]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["six-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "six-icon":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SixIcon);
-            }
-            break;
-    } });
-}
-export { SixIcon as S, defineCustomElement as d };
-//# sourceMappingURL=p-Mse5vRUS.js.map
-//# sourceMappingURL=p-Mse5vRUS.js.map

package/dist/components/p-Mse5vRUS.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"file":"p-Mse5vRUS.js","mappings":";;AAAA,MAAM,UAAU,GAAG,s7BAAs7B;;MCc57B,OAAO,iBAAAA,kBAAA,CAAA,MAAA,OAAA,SAAAC,CAAA,CAAA;AALpB,IAAA,WAAA,GAAA;;;;;AAO2B,QAAA,IAAI,CAAA,IAAA,GAQZ,SAAS;;AAGlB,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAuBvB;IArBC,MAAM,GAAA;QACJ,QACE,CACE,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE;AACL,gBAAA,gBAAgB,EAAE,IAAI;AACtB,gBAAA,yBAAyB,EAAE,CAAC,IAAI,CAAC,MAAM;gBACvC,uBAAuB,EAAE,IAAI,CAAC,MAAM;AACpC,gBAAA,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;AACtC,gBAAA,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;AACpC,gBAAA,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;AACtC,gBAAA,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;AACpC,gBAAA,cAAc,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;AACtC,gBAAA,eAAe,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;AACxC,gBAAA,gBAAgB,EAAE,IAAI,CAAC,IAAI,KAAK,UAAU;AAC1C,gBAAA,eAAe,EAAE,IAAI,CAAC,IAAI,KAAK,SAAS;AACzC,aAAA,EAAA,EAED,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACX;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/six-icon/six-icon.scss?tag=six-icon&encapsulation=shadow","src/components/six-icon/six-icon.tsx"],"sourcesContent":["@import 'src/global/component';\n\n:host {\n display: inline-flex;\n vertical-align: middle;\n}\n\n.material-icons {\n vertical-align: middle;\n font-weight: normal;\n font-style: normal;\n text-transform: none;\n letter-spacing: normal;\n word-wrap: normal;\n white-space: nowrap;\n direction: ltr;\n\n /* Support for all WebKit browsers. */\n -webkit-font-smoothing: antialiased;\n /* Support for Safari and Chrome. */\n text-rendering: optimizeLegibility;\n\n /* Support for Firefox. */\n -moz-osx-font-smoothing: grayscale;\n\n /* Support for IE. */\n font-feature-settings: 'liga';\n\n /* Icon name should not be selectable. */\n user-select: none;\n}\n\n.material-icons-filled {\n font-family: 'Material Icons';\n}\n\n.material-icons-outlined {\n font-family: 'Material Icons Outlined';\n}\n\n.icon {\n &--xsmall {\n font-size: 12px;\n }\n\n &--small {\n font-size: 18px;\n }\n\n &--medium {\n font-size: 24px;\n }\n\n &--large {\n font-size: 36px;\n }\n\n &--xlarge {\n font-size: 48px;\n }\n\n &--xxlarge {\n font-size: 72px;\n }\n\n &--xxxlarge {\n font-size: 96px;\n }\n\n &--inherit {\n font-size: 1.5em;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @since 1.0\n * @status stable\n *\n * @slot - Used to define the material icon name.\n */\n\n@Component({\n tag: 'six-icon',\n styleUrls: ['six-icon.scss'],\n shadow: true,\n})\nexport class SixIcon {\n /** The icon's size. */\n @Prop({ reflect: true }) size:\n | 'inherit'\n | 'xSmall'\n | 'small'\n | 'medium'\n | 'large'\n | 'xLarge'\n | 'xxLarge'\n | 'xxxLarge' = 'inherit';\n\n /** If set to true the default material outlined icons are not used. */\n @Prop() filled = false;\n\n render() {\n return (\n <i\n class={{\n 'material-icons': true,\n 'material-icons-outlined': !this.filled,\n 'material-icons-filled': this.filled,\n 'icon--xsmall': this.size === 'xSmall',\n 'icon--small': this.size === 'small',\n 'icon--medium': this.size === 'medium',\n 'icon--large': this.size === 'large',\n 'icon--xlarge': this.size === 'xLarge',\n 'icon--xxlarge': this.size === 'xxLarge',\n 'icon--xxxlarge': this.size === 'xxxLarge',\n 'icon--inherit': this.size === 'inherit',\n }}\n >\n <slot></slot>\n </i>\n );\n }\n}\n"],"version":3}

package/dist/esm/six-button.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"six-button.entry.js","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:\n var(--six-transition-fast) background-color,\n var(--six-transition-fast) color,\n var(--six-transition-fast) border,\n 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"],"names":[],"mappings":"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"}

package/dist/esm/six-spinner.entry.js DELETED Viewed

@@ -1,56 +0,0 @@
-import { r as registerInstance, h } from './index-D0Go1Zjj.js';
-const sixSpinnerCss = ":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);--stroke-width:2px;display:inline-flex}.spinner{display:inline-block;width:1em;height:1em;border-radius:50%;border:solid var(--stroke-width) var(--track-color);border-top-color:var(--indicator-color);border-right-color:var(--indicator-color);animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.six-spinner{width:auto;height:auto;position:relative}.six-spinner .six-spinner__container{margin:0;transform:translateX(0)}.six-spinner .six-spinner__container svg{transform:translateX(0)}.six-spinner__container{position:relative;margin:0 auto;top:calc(50% - 20px);z-index:1}.six-spinner__container,.six-spinner__container svg{width:40px;height:40px;display:block;transform:translateX(40px)}.six-spinner path{stroke-dashoffset:70px;stroke-dasharray:70, 444;-webkit-animation:six-spinner 2s cubic-bezier(0.56, 0.39, 0.51, 0.96) infinite;animation:six-spinner 2s cubic-bezier(0.56, 0.39, 0.51, 0.96) infinite}.six-spinner polygon{stroke-dasharray:310;stroke-dashoffset:310;animation:big-polygon-draw 2s ease-in-out infinite;-webkit-animation:big-polygon-draw 2s ease-in-out infinite}.six-spinner polygon:nth-child(2),.six-spinner polygon:nth-child(3){stroke-dasharray:110;stroke-dashoffset:110;animation:small-polygon-draw 2s ease-in-out infinite;-webkit-animation:small-polygon-draw 2s ease-in-out infinite}@keyframes big-polygon-draw{0%,100%{stroke-dashoffset:310}50%{stroke-dashoffset:140}}@-webkit-keyframes big-polygon-draw{0%,100%{stroke-dashoffset:310}50%{stroke-dashoffset:140}}@keyframes small-polygon-draw{0%,100%{stroke-dashoffset:110}50%{stroke-dashoffset:50}}@-webkit-keyframes small-polygon-draw{0%,100%{stroke-dashoffset:110}50%{stroke-dashoffset:50}}@-webkit-keyframes six-spinner{to{stroke-dashoffset:-444}}@keyframes six-spinner{to{stroke-dashoffset:-444}}";
-const SixSpinner = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    /**
-     * Renders a container with a given SVG content.
-     */
-    renderWrapper(content) {
-        return (h("span", { class: "six-spinner", "aria-busy": "true", "aria-live": "polite" }, h("div", { class: "six-spinner__container" }, content)));
-    }
-    /**
-     * Renders the SIX logo spinner.
-     */
-    renderSIXLogo() {
-        const sixLogo = (h("svg", { viewBox: "0 0 40 40", part: "svg" }, h("path", { fill: "none", stroke: "#de3919", "stroke-width": "5", "stroke-linecap": "round", d: "M 35 5 V 35 H 5 T 5 5 H 35 V 35 H 5 V 5 H 35 V 35 H -34 V 30 H 7 A 9 8 0 0 0 14 27 L 27 14 A 8 6 0 0 1 33 12 H 42" })));
-        return this.renderWrapper(sixLogo);
-    }
-    /**
-     * Renders the BME logo spinner.
-     */
-    renderBMELogo() {
-        const bmeLogo = (h("svg", { viewBox: "0 0 45 55", part: "svg" }, h("polygon", { fill: "none", stroke: "black", "stroke-width": "2", "stroke-linecap": "round", points: "4.42 51.96 17.02 31.473 2 31.473 2 22.486 17.02 22.486 4.42 2 15.404 2 30.289 26.98 14.763 51.96 4.42 51.96" }), h("polygon", { fill: "none", stroke: "black", "stroke-width": "2", "stroke-linecap": "round", points: "42 51.96 31.655 51.96 24.598 40.498 29.831 32.073 42 51.96" }), h("polygon", { fill: "none", stroke: "black", "stroke-width": "2", "stroke-linecap": "round", points: "24.518 12.719 31.014 2 42 2 29.831 21.637 24.518 12.719" })));
-        return this.renderWrapper(bmeLogo);
-    }
-    /**
-     * Renders a simple spinner.
-     */
-    renderSimpleSpinner() {
-        return h("span", { part: "base", class: "spinner", "aria-busy": "true", "aria-live": "polite" });
-    }
-    render() {
-        // Check the deprecated `six` property first
-        if (this.six) {
-            console.warn('The "six" prop is deprecated. Use "logo=\'six\'" instead.');
-            return this.renderSIXLogo();
-        }
-        switch (this.logo) {
-            case 'six':
-                return this.renderSIXLogo();
-            case 'bme':
-                return this.renderBMELogo();
-            default:
-                return this.renderSimpleSpinner();
-        }
-    }
-};
-SixSpinner.style = sixSpinnerCss;
-export { SixSpinner as six_spinner };
-//# sourceMappingURL=six-spinner.entry.js.map
-//# sourceMappingURL=six-spinner.entry.js.map

package/dist/esm/six-spinner.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"six-spinner.entry.js","sources":["src/components/six-spinner/six-spinner.scss?tag=six-spinner&encapsulation=shadow","src/components/six-spinner/six-spinner.tsx"],"sourcesContent":["@import 'src/global/component';\n\n/**\n * @prop --track-color: The color of the spinner's track.\n * @prop --indicator-color: The color of the spinner's indicator.\n * @prop --stroke-width: The width of the indicator.\n */\n:host {\n --track-color: var(--six-progress-track-color);\n --indicator-color: var(--six-progress-indicator-color);\n --stroke-width: 2px;\n\n display: inline-flex;\n}\n\n.spinner {\n display: inline-block;\n width: 1em;\n height: 1em;\n border-radius: 50%;\n border: solid var(--stroke-width) var(--track-color);\n border-top-color: var(--indicator-color);\n border-right-color: var(--indicator-color);\n animation: 1s linear infinite spin;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n$color-six-spinner-background: rgba(255, 255, 255, 0.7);\n\n.six-spinner {\n width: auto;\n height: auto;\n position: relative;\n\n .six-spinner__container {\n margin: 0;\n transform: translateX(0);\n }\n\n .six-spinner__container svg {\n transform: translateX(0);\n }\n\n &__container {\n position: relative;\n margin: 0 auto;\n top: calc(50% - 20px);\n z-index: 1;\n }\n\n &__container,\n &__container svg {\n width: 40px;\n height: 40px;\n display: block;\n transform: translateX(40px);\n }\n\n path {\n stroke-dashoffset: 70px;\n stroke-dasharray: 70, 444;\n -webkit-animation: six-spinner 2s cubic-bezier(0.56, 0.39, 0.51, 0.96) infinite;\n animation: six-spinner 2s cubic-bezier(0.56, 0.39, 0.51, 0.96) infinite;\n }\n\n polygon {\n stroke-dasharray: 310;\n stroke-dashoffset: 310;\n animation: big-polygon-draw 2s ease-in-out infinite;\n -webkit-animation: big-polygon-draw 2s ease-in-out infinite;\n }\n\n polygon:nth-child(2),\n polygon:nth-child(3) {\n stroke-dasharray: 110;\n stroke-dashoffset: 110;\n animation: small-polygon-draw 2s ease-in-out infinite;\n -webkit-animation: small-polygon-draw 2s ease-in-out infinite;\n }\n\n @keyframes big-polygon-draw {\n 0%,\n 100% {\n stroke-dashoffset: 310;\n }\n 50% {\n stroke-dashoffset: 140;\n }\n }\n\n @-webkit-keyframes big-polygon-draw {\n 0%,\n 100% {\n stroke-dashoffset: 310;\n }\n 50% {\n stroke-dashoffset: 140;\n }\n }\n\n @keyframes small-polygon-draw {\n 0%,\n 100% {\n stroke-dashoffset: 110;\n }\n 50% {\n stroke-dashoffset: 50;\n }\n }\n\n @-webkit-keyframes small-polygon-draw {\n 0%,\n 100% {\n stroke-dashoffset: 110;\n }\n 50% {\n stroke-dashoffset: 50;\n }\n }\n\n @-webkit-keyframes six-spinner {\n to {\n stroke-dashoffset: -444;\n }\n }\n\n @keyframes six-spinner {\n to {\n stroke-dashoffset: -444;\n }\n }\n}\n","import { Component, h, Prop } 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 * @part base - The component's base wrapper.\n * @part svg - The spinner icon.\n */\n@Component({\n tag: 'six-spinner',\n styleUrl: 'six-spinner.scss',\n shadow: true,\n})\nexport class SixSpinner {\n /** Indicates if the spinner is shown as animated SIX or BME logo or a simple spinner. */\n @Prop() logo?: 'six' | 'bme';\n /**\n * **@deprecated** Use `logo=\"six\"` instead.\n *\n * If set to true, the spinner displays the SIX logo.\n */\n @Prop() six?: boolean;\n\n /**\n * Renders a container with a given SVG content.\n */\n private renderWrapper(content: SVGElement) {\n return (\n <span class=\"six-spinner\" aria-busy=\"true\" aria-live=\"polite\">\n <div class=\"six-spinner__container\">{content}</div>\n </span>\n );\n }\n\n /**\n * Renders the SIX logo spinner.\n */\n private renderSIXLogo() {\n const sixLogo = (\n <svg viewBox=\"0 0 40 40\" part=\"svg\">\n <path\n fill=\"none\"\n stroke=\"#de3919\"\n stroke-width=\"5\"\n stroke-linecap=\"round\"\n d=\"M 35 5 V 35 H 5 T 5 5 H 35 V 35 H 5 V 5 H 35 V 35 H -34 V 30 H 7 A 9 8 0 0 0 14 27 L 27 14 A 8 6 0 0 1 33 12 H 42\"\n ></path>\n </svg>\n );\n return this.renderWrapper(sixLogo);\n }\n\n /**\n * Renders the BME logo spinner.\n */\n private renderBMELogo() {\n const bmeLogo = (\n <svg viewBox=\"0 0 45 55\" part=\"svg\">\n <polygon\n fill=\"none\"\n stroke=\"black\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n points=\"4.42 51.96 17.02 31.473 2 31.473 2 22.486 17.02 22.486 4.42 2 15.404 2 30.289 26.98 14.763 51.96 4.42 51.96\"\n />\n <polygon\n fill=\"none\"\n stroke=\"black\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n points=\"42 51.96 31.655 51.96 24.598 40.498 29.831 32.073 42 51.96\"\n />\n <polygon\n fill=\"none\"\n stroke=\"black\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n points=\"24.518 12.719 31.014 2 42 2 29.831 21.637 24.518 12.719\"\n />\n </svg>\n );\n return this.renderWrapper(bmeLogo);\n }\n\n /**\n * Renders a simple spinner.\n */\n private renderSimpleSpinner() {\n return <span part=\"base\" class=\"spinner\" aria-busy=\"true\" aria-live=\"polite\" />;\n }\n\n render() {\n // Check the deprecated `six` property first\n if (this.six) {\n console.warn('The \"six\" prop is deprecated. Use \"logo=\\'six\\'\" instead.');\n return this.renderSIXLogo();\n }\n\n switch (this.logo) {\n case 'six':\n return this.renderSIXLogo();\n case 'bme':\n return this.renderBMELogo();\n default:\n return this.renderSimpleSpinner();\n }\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,aAAa,GAAG,8mEAA8mE;;MCgBvnE,UAAU,GAAA,MAAA;;;;AAUrB;;AAEG;AACK,IAAA,aAAa,CAAC,OAAmB,EAAA;AACvC,QAAA,QACE,YAAM,KAAK,EAAC,aAAa,EAAW,WAAA,EAAA,MAAM,eAAW,QAAQ,EAAA,EAC3D,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,wBAAwB,EAAA,EAAE,OAAO,CAAO,CAC9C;;AAIX;;AAEG;IACK,aAAa,GAAA;QACnB,MAAM,OAAO,IACX,CAAK,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,KAAK,EAAA,EACjC,CAAA,CAAA,MAAA,EAAA,EACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,SAAS,EACH,cAAA,EAAA,GAAG,EACD,gBAAA,EAAA,OAAO,EACtB,CAAC,EAAC,mHAAmH,EAC/G,CAAA,CACJ,CACP;AACD,QAAA,OAAO,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;;AAGpC;;AAEG;IACK,aAAa,GAAA;QACnB,MAAM,OAAO,IACX,CAAK,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,KAAK,EAAA,EACjC,CAAA,CAAA,SAAA,EAAA,EACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,OAAO,EACD,cAAA,EAAA,GAAG,oBACD,OAAO,EACtB,MAAM,EAAC,6GAA6G,EACpH,CAAA,EACF,CAAA,CAAA,SAAA,EAAA,EACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,OAAO,EACD,cAAA,EAAA,GAAG,oBACD,OAAO,EACtB,MAAM,EAAC,4DAA4D,EACnE,CAAA,EACF,CAAA,CAAA,SAAA,EAAA,EACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,OAAO,EACD,cAAA,EAAA,GAAG,EACD,gBAAA,EAAA,OAAO,EACtB,MAAM,EAAC,yDAAyD,EAChE,CAAA,CACE,CACP;AACD,QAAA,OAAO,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;;AAGpC;;AAEG;IACK,mBAAmB,GAAA;QACzB,OAAO,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,EAAW,WAAA,EAAA,MAAM,EAAW,WAAA,EAAA,QAAQ,GAAG;;IAGjF,MAAM,GAAA;;AAEJ,QAAA,IAAI,IAAI,CAAC,GAAG,EAAE;AACZ,YAAA,OAAO,CAAC,IAAI,CAAC,2DAA2D,CAAC;AACzE,YAAA,OAAO,IAAI,CAAC,aAAa,EAAE;;AAG7B,QAAA,QAAQ,IAAI,CAAC,IAAI;AACf,YAAA,KAAK,KAAK;AACR,gBAAA,OAAO,IAAI,CAAC,aAAa,EAAE;AAC7B,YAAA,KAAK,KAAK;AACR,gBAAA,OAAO,IAAI,CAAC,aAAa,EAAE;AAC7B,YAAA;AACE,gBAAA,OAAO,IAAI,CAAC,mBAAmB,EAAE;;;;;;;;"}

package/dist/ui-library/p-0b438d5a.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as i,c as t,h as a,g as s}from"./p-D0Go1Zjj.js";import{u as e,l as o}from"./p-BY6hIEFX.js";import{h as l}from"./p-j3oIB5oT.js";import{M as r}from"./p-CfIoyvm-.js";const n=":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{--width:31rem;display:contents}.dialog{display:flex;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--six-z-index-dialog);color:var(--six-color-web-rock-900)}.dialog:not(.dialog--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.dialog__panel{display:flex;flex-direction:column;z-index:2;width:var(--width);max-width:calc(100% - var(--six-spacing-xx-large));max-height:calc(100% - var(--six-spacing-xx-large));background-color:var(--six-panel-background-color);border-radius:var(--six-border-radius-medium);box-shadow:var(--six-shadow-large);opacity:0;transform:scale(0.8);transition:var(--six-transition-medium) opacity, var(--six-transition-medium) transform}.dialog__panel:focus{outline:none}@media screen and (max-width: 420px){.dialog__panel{max-height:80vh}}.dialog--open .dialog__panel{display:flex;opacity:1;transform:none}.dialog__header{flex:0 0 auto;display:flex}.dialog__title{flex:1 1 auto;font-size:var(--six-font-size-x-large);font-weight:var(--six-font-weight-bold);line-height:var(--six-line-height-dense);padding:var(--six-spacing-large) var(--six-spacing-large) var(--six-spacing-small)}.dialog__close{flex:0 0 auto;display:flex;align-items:center;font-size:var(--six-font-size-x-large);padding:0 var(--six-spacing-x-small)}.dialog__body{flex:1 1 auto;padding:var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-large);overflow:auto;-webkit-overflow-scrolling:touch}.dialog__footer{flex:0 0 auto;text-align:right;padding:var(--six-spacing-large)}.dialog__footer ::slotted(six-button:not(:first-of-type)){margin-left:var(--six-spacing-xx-small)}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--six-overlay-background-color);opacity:0;transition:var(--six-transition-medium) opacity}.dialog--open .dialog__overlay{opacity:0.8}";let d=0;const h=class{constructor(a){i(this,a);this.sixShow=t(this,"six-dialog-show");this.sixAfterShow=t(this,"six-dialog-after-show");this.sixHide=t(this,"six-dialog-hide");this.sixAfterHide=t(this,"six-dialog-after-hide");this.sixInitialFocus=t(this,"six-dialog-initial-focus");this.sixOverlayDismiss=t(this,"six-dialog-overlay-dismiss");this.componentId=`dialog-${++d}`;this.willShow=false;this.willHide=false;this.hasFooter=false;this.isVisible=false;this.open=false;this.label="";this.noHeader=false;this.handleCloseClick=()=>{this.hide()};this.handleKeyDown=i=>{if(i.key==="Escape"){this.hide()}};this.handleOverlayClick=()=>{const i=this.sixOverlayDismiss.emit();if(!i.defaultPrevented){this.hide()}};this.handleSlotChange=()=>{this.hasFooter=l(this.host,"footer")};this.handleTransitionEnd=i=>{const t=i.target;if(i.propertyName==="opacity"&&t.classList.contains("dialog__panel")){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.sixAfterShow.emit():this.sixAfterHide.emit()}}}handleOpenChange(){this.open?this.show():this.hide()}connectedCallback(){this.modal=new r(this.host,{onFocusOut:()=>{var i;return(i=this.panel)===null\|\|i===void 0?void 0:i.focus()}})}componentWillLoad(){this.handleSlotChange()}componentDidLoad(){if(this.open){this.show()}}disconnectedCallback(){e(this.host)}async show(){if(this.willShow\|\|this.modal==null\|\|this.panel==null\|\|this.dialog==null){return}const i=this.panel;const t=this.sixShow.emit();if(t.defaultPrevented){this.open=false;return}this.willShow=true;this.isVisible=true;this.open=true;this.modal.activate();o(this.host);if(this.open){requestAnimationFrame((()=>{const t=this.sixInitialFocus.emit();if(!t.defaultPrevented){i.focus({preventScroll:true})}}))}}async hide(){if(this.willHide\|\|this.modal==null){return}const i=this.sixHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();e(this.host)}render(){return a("div",{key:"4fb15d0b1b8cb52082d6faadd337f92c51d4a6ba",ref:i=>this.dialog=i,part:"base",class:{dialog:true,"dialog--open":this.open,"dialog--visible":this.isVisible,"dialog--has-footer":this.hasFooter},onKeyDown:this.handleKeyDown,onTransitionEnd:this.handleTransitionEnd},a("div",{key:"f1f7f2f0c69dda4f3a9fe464aef1880a3ccc8435",part:"overlay",class:"dialog__overlay",onClick:this.handleOverlayClick}),a("div",{key:"988baac44c75d2299f55e4dd848155ac535679cc",ref:i=>this.panel=i,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},!this.noHeader&&a("header",{key:"a167200e75358f3b7b778f7475ca437f23a58797",part:"header",class:"dialog__header"},a("span",{key:"3c3edc39e39eb0bda2c745719476278b8db86037",part:"title",class:"dialog__title",id:`${this.componentId}-title`},a("slot",{key:"3cd726aaebef3f72bcfda02cbd98c16c38fd6d6e",name:"label"},this.label\|\|String.fromCharCode(65279))),a("six-icon-button",{key:"e1110789a7bdb41cef385814d53bbed678aa99e8",exportparts:"base:close-button",class:"dialog__close",name:"close",onClick:this.handleCloseClick})),a("div",{key:"7c0c4a8388d2e6ff53e8dffce614314c327c311d",part:"body",class:"dialog__body"},a("slot",{key:"ed90c7246c3922ef3ee0cea389879ff52c910120"})),a("footer",{key:"cbc879ecfe209e9be681bbc8d34d2defb1cc6f45",part:"footer",class:"dialog__footer"},a("slot",{key:"0d86102a449cef6ebaaf1c7738fd444e249bbe86",name:"footer",onSlotchange:this.handleSlotChange}))))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"]}}};h.style=n;export{h as six_dialog};
2	- //# sourceMappingURL=p-0b438d5a.entry.js.map

package/dist/ui-library/p-0b438d5a.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["sixDialogCss","id","SixDialog","constructor","hostRef","this","componentId","willShow","willHide","hasFooter","isVisible","open","label","noHeader","handleCloseClick","hide","handleKeyDown","event","key","handleOverlayClick","sixOverlayDismiss","emit","defaultPrevented","handleSlotChange","hasSlot","host","handleTransitionEnd","target","propertyName","classList","contains","sixAfterShow","sixAfterHide","handleOpenChange","show","connectedCallback","modal","Modal","onFocusOut","_a","panel","focus","componentWillLoad","componentDidLoad","disconnectedCallback","unlockBodyScrolling","dialog","sixShow","activate","lockBodyScrolling","requestAnimationFrame","sixInitialFocus","preventScroll","sixHide","deactivate","render","h","ref","el","part","class","onKeyDown","onTransitionEnd","onClick","role","tabIndex","name","String","fromCharCode","exportparts","onSlotchange"],"sources":["src/components/six-dialog/six-dialog.scss?tag=six-dialog&encapsulation=shadow","src/components/six-dialog/six-dialog.tsx"],"sourcesContent":["@import 'src/global/component';\n@import 'src/global/mixins/hidden';\n\n/**\n * @prop --width: The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens.\n */\n:host {\n --width: 31rem;\n\n display: contents;\n}\n\n.dialog {\n display: flex;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: var(--six-z-index-dialog);\n color: var(--six-color-web-rock-900);\n\n &:not(.dialog--visible) {\n @include hidden;\n }\n}\n\n.dialog__panel {\n display: flex;\n flex-direction: column;\n z-index: 2;\n width: var(--width);\n max-width: calc(100% - var(--six-spacing-xx-large));\n max-height: calc(100% - var(--six-spacing-xx-large));\n background-color: var(--six-panel-background-color);\n border-radius: var(--six-border-radius-medium);\n box-shadow: var(--six-shadow-large);\n opacity: 0;\n transform: scale(0.8);\n transition:\n var(--six-transition-medium) opacity,\n var(--six-transition-medium) transform;\n\n &:focus {\n outline: none;\n }\n}\n\n// Ensure there's enough vertical padding for phones that don't update vh when chrome appears (e.g. iPhone)\n@media screen and (max-width: 420px) {\n .dialog__panel {\n max-height: 80vh;\n }\n}\n\n.dialog--open .dialog__panel {\n display: flex;\n opacity: 1;\n transform: none;\n}\n\n.dialog__header {\n flex: 0 0 auto;\n display: flex;\n}\n\n.dialog__title {\n flex: 1 1 auto;\n font-size: var(--six-font-size-x-large);\n font-weight: var(--six-font-weight-bold);\n line-height: var(--six-line-height-dense);\n padding: var(--six-spacing-large) var(--six-spacing-large) var(--six-spacing-small);\n}\n\n.dialog__close {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n font-size: var(--six-font-size-x-large);\n padding: 0 var(--six-spacing-x-small);\n}\n\n.dialog__body {\n flex: 1 1 auto;\n padding: var(--six-spacing-small) var(--six-spacing-large) var(--six-spacing-large);\n overflow: auto;\n -webkit-overflow-scrolling: touch;\n}\n\n.dialog__footer {\n flex: 0 0 auto;\n text-align: right;\n padding: var(--six-spacing-large);\n\n ::slotted(six-button:not(:first-of-type)) {\n margin-left: var(--six-spacing-xx-small);\n }\n}\n\n.dialog:not(.dialog--has-footer) .dialog__footer {\n display: none;\n}\n\n.dialog__overlay {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: var(--six-overlay-background-color);\n opacity: 0;\n transition: var(--six-transition-medium) opacity;\n}\n\n.dialog--open .dialog__overlay {\n opacity: 0.8;\n}\n","import { Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { hasSlot } from '../../utils/slot';\nimport Modal from '../../utils/modal';\nimport { EmptyPayload } from '../../utils/types';\n\nlet id = 0;\n\n/**\n * @since 1.0\n * @status stable\n *\n * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.\n *\n * @slot - The dialog's content.\n * @slot label - The dialog's label. Alternatively, you can use the label prop.\n * @slot footer - The dialog's footer, usually one or more buttons representing various options.\n *\n * @part base - The component's base wrapper.\n * @part overlay - The overlay.\n * @part panel - The dialog panel (where the dialog and its content is rendered).\n * @part header - The dialog header.\n * @part title - The dialog title.\n * @part close-button - The close button.\n * @part body - The dialog body.\n * @part footer - The dialog footer.\n *\n */\n@Component({\n tag: 'six-dialog',\n styleUrl: 'six-dialog.scss',\n shadow: true,\n})\nexport class SixDialog {\n private componentId = `dialog-${++id}`;\n private dialog?: HTMLElement;\n private modal?: Modal;\n private panel?: HTMLElement;\n private willShow = false;\n private willHide = false;\n\n @Element() host!: HTMLSixDialogElement;\n\n @State() hasFooter = false;\n @State() isVisible = false;\n\n /** Indicates whether the dialog is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n /**\n * The dialog's label as displayed in the header. You should always include a relevant label even when using\n * `no-header`, as it is required for proper accessibility.\n */\n @Prop() label = '';\n\n /**\n * Set to true to disable the header. This will also remove the default close button, so please ensure you provide an\n * easy, accessible way for users to dismiss the dialog.\n */\n @Prop() noHeader = false;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n /** Emitted when the dialog opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event({ eventName: 'six-dialog-show' }) sixShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the dialog opens and all transitions are complete. */\n @Event({ eventName: 'six-dialog-after-show' }) sixAfterShow!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the dialog closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event({ eventName: 'six-dialog-hide' }) sixHide!: EventEmitter<EmptyPayload>;\n\n /** Emitted after the dialog closes and all transitions are complete. */\n @Event({ eventName: 'six-dialog-after-hide' }) sixAfterHide!: EventEmitter<EmptyPayload>;\n\n /**\n * Emitted when the dialog 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 dialog, such as an input or button.\n */\n @Event({ eventName: 'six-dialog-initial-focus' }) sixInitialFocus!: EventEmitter<EmptyPayload>;\n\n /** Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the dialog from closing. */\n @Event({ eventName: 'six-dialog-overlay-dismiss' }) sixOverlayDismiss!: EventEmitter<EmptyPayload>;\n\n connectedCallback() {\n this.modal = new Modal(this.host, {\n onFocusOut: () => this.panel?.focus(),\n });\n }\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n componentDidLoad() {\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n disconnectedCallback() {\n unlockBodyScrolling(this.host);\n }\n\n /** Shows the dialog */\n @Method()\n async show() {\n if (this.willShow || this.modal == null || this.panel == null || this.dialog == null) {\n return;\n }\n const panel = this.panel;\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 this.modal.activate();\n\n lockBodyScrolling(this.host);\n\n if (this.open) {\n requestAnimationFrame(() => {\n const sixInitialFocus = this.sixInitialFocus.emit();\n if (!sixInitialFocus.defaultPrevented) {\n panel.focus({ preventScroll: true });\n }\n });\n }\n }\n\n /** Hides the dialog */\n @Method()\n async hide() {\n if (this.willHide || this.modal == null) {\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 this.modal.deactivate();\n\n unlockBodyScrolling(this.host);\n }\n\n private handleCloseClick = () => {\n this.hide();\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.hide();\n }\n };\n\n private handleOverlayClick = () => {\n const sixOverlayDismiss = this.sixOverlayDismiss.emit();\n\n if (!sixOverlayDismiss.defaultPrevented) {\n this.hide();\n }\n };\n\n private handleSlotChange = () => {\n this.hasFooter = hasSlot(this.host, 'footer');\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.propertyName === 'opacity' && target.classList.contains('dialog__panel')) {\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\n render() {\n return (\n <div\n ref={(el) => (this.dialog = el)}\n part=\"base\"\n class={{\n dialog: true,\n 'dialog--open': this.open,\n 'dialog--visible': this.isVisible,\n 'dialog--has-footer': this.hasFooter,\n }}\n onKeyDown={this.handleKeyDown}\n onTransitionEnd={this.handleTransitionEnd}\n >\n <div part=\"overlay\" class=\"dialog__overlay\" onClick={this.handleOverlayClick} />\n\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class=\"dialog__panel\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden={this.open ? 'false' : 'true'}\n aria-label={this.noHeader ? this.label : null}\n aria-labelledby={!this.noHeader ? `${this.componentId}-title` : null}\n tabIndex={0}\n >\n {!this.noHeader && (\n <header part=\"header\" class=\"dialog__header\">\n <span part=\"title\" class=\"dialog__title\" id={`${this.componentId}-title`}>\n <slot name=\"label\">\n {/* If there's no label, use an invisible character to prevent the heading from collapsing */}\n {this.label || String.fromCharCode(65279)}\n </slot>\n </span>\n <six-icon-button\n exportparts=\"base:close-button\"\n class=\"dialog__close\"\n name=\"close\"\n onClick={this.handleCloseClick}\n />\n </header>\n )}\n\n <div part=\"body\" class=\"dialog__body\">\n <slot />\n </div>\n\n <footer part=\"footer\" class=\"dialog__footer\">\n <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n </footer>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-0d97e592.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r,h as e}from"./p-D0Go1Zjj.js";const o=".six-error-container{text-align:left;color:var(--six-color-danger-800);width:100%;font-size:var(--six-input-help-text-font-size-medium)}";const t=class{constructor(e){r(this,e)}render(){return e("div",{key:"35e774adc232f29f26ed0dcc98f6befe1f2a6735",class:"six-error-container"},e("slot",{key:"3ef7bc24a95509089baaf676986a5a6c91d32274"}))}};t.style=o;export{t as six_error};
2	- //# sourceMappingURL=p-0d97e592.entry.js.map

package/dist/ui-library/p-1323f2cb.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"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:\n var(--six-transition-fast) background-color,\n var(--six-transition-fast) color,\n var(--six-transition-fast) border,\n 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-27e8e8a6.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as i,c as s,h as e,g as l}from"./p-D0Go1Zjj.js";import{h as o}from"./p-j3oIB5oT.js";const a=".sc-six-file-upload-h{position:relative;box-sizing:border-box}.sc-six-file-upload-h .sc-six-file-upload,.sc-six-file-upload-h .sc-six-file-upload:before,.sc-six-file-upload-h *.sc-six-file-upload:after{box-sizing:border-box}.sr-only.sc-six-file-upload{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.sc-six-file-upload-h{position:static;display:block}.six-file-upload.sc-six-file-upload six-card.sc-six-file-upload{box-shadow:none;padding:0;width:100%}.six-file-upload__label--highlighted.sc-six-file-upload{color:var(--six-color-action-600)}.six-file-upload__container--full.sc-six-file-upload{border:dashed 1px var(--six-color-web-rock-500)}.six-file-upload__drop-zone.sc-six-file-upload{padding:2rem 0;display:flex;justify-content:center;width:100%;transition:background-color 0.3s}.six-file-upload__drop-zone__spinner-container.sc-six-file-upload{display:flex;align-items:center}.six-file-upload__drop-zone__spinner-container.sc-six-file-upload six-spinner.sc-six-file-upload{margin-right:var(--six-spacing-x-small)}.six-file-upload__drop-zone--compact.sc-six-file-upload{padding:0}.six-file-upload__input.sc-six-file-upload{cursor:pointer;position:absolute;top:0;left:0;width:100%;user-select:none;height:100%;opacity:0;outline:none}.six-file-upload--disabled.sc-six-file-upload .six-file-upload__drop-zone.sc-six-file-upload{background-color:var(--six-color-inactive);cursor:not-allowed}.six-file-upload.sc-six-file-upload:not(.six-file-upload--disabled) .six-file-upload__drop-zone.sc-six-file-upload:hover,.six-file-upload__drop-zone--hover.sc-six-file-upload{background-color:var(--six-color-action-light-to-be-defined)}.six-file-upload.sc-six-file-upload:not(.six-file-upload--disabled) .six-file-upload__drop-zone.sc-six-file-upload:hover.six-file-upload__drop-zone--compact,.six-file-upload__drop-zone--hover.six-file-upload__drop-zone--compact.sc-six-file-upload{background-color:inherit}.six-file-upload--disabled.sc-six-file-upload .six-file-upload__input.sc-six-file-upload{cursor:not-allowed}.six-file-upload__error-text.sc-six-file-upload{font-size:var(--six-input-help-text-font-size-medium)}";const t=class{constructor(e){i(this,e);this.success=s(this,"six-file-upload-success");this.failure=s(this,"six-file-upload-failure");this.isOver=false;this.hasError=false;this.compact=false;this.disabled=false;this.multiple=false;this.uploading=false;this.errorText="";this.invalid=false;this.handleSlotChange=()=>{let i=false;if(this.errorText!=null&&(typeof this.errorText=="string"&&this.errorText.trim().length>0\|\|typeof this.errorText=="object"&&this.errorText.length>0)){i=true}this.hasError=i\|\|o(this.host,"error-text")};this.handleFiles=i=>{if(this.disabled\|\|i.length===0\|\|this.uploading){return}if(!this.multiple&&i.length>1){return this.failure.emit({reason:"Only one file is allowed."})}for(const s of i){if(s==null){return}let e=[];if(this.accept!=null){e=this.accept.replace(/\s/g,"").split(",")}if(e.length>0&&e.indexOf(s.type)===-1){const s=i.length>1?"One or more files have invalid MIME type.":"File has invalid MIME type.";return this.failure.emit({reason:s})}if(this.maxFileSize!=null&&s.size>this.maxFileSize){const s=i.length>1?"One or more files are too big":"File is too big.";return this.failure.emit({reason:s})}}this.success.emit({files:i})};this.onChange=()=>{var i;if(((i=this.fileInput)===null\|\|i===void 0?void 0:i.files)!=null){const i=this.fileInput.files;this.handleFiles(i);this.fileInput.value=""}}}dragenterHandler(){if(!this.disabled){this.isOver=true}}dragoverHandler(){if(!this.disabled){this.isOver=true}}dragleaveHandler(){if(!this.disabled){this.isOver=false}}dropHandler(){if(!this.disabled){this.isOver=false}}componentWillLoad(){this.handleSlotChange()}componentDidLoad(){var i;["dragenter","dragover","dragleave","drop"].forEach((i=>{this.host.addEventListener(i,this.preventDefaults,false);document.body.addEventListener(i,this.preventDefaults,false)}));(i=this.host.shadowRoot)===null\|\|i===void 0?void 0:i.addEventListener("slotchange",this.handleSlotChange)}disconnectedCallback(){var i;["dragenter","dragover","dragleave","drop"].forEach((i=>{this.host.removeEventListener(i,this.preventDefaults,false);document.body.removeEventListener(i,this.preventDefaults,false)}));(i=this.host.shadowRoot)===null\|\|i===void 0?void 0:i.removeEventListener("slotchange",this.handleSlotChange)}preventDefaults(i){i.preventDefault();i.stopPropagation()}renderLabel(){var i;return(i=this.label)!==null&&i!==void 0?i:this.compact?"Upload":e("span",null,"Drop files to upload, or ",e("span",{class:"six-file-upload__label--highlighted"},"browse"))}render(){const i=this.compact?"six-button":"six-card";const s=(Array.isArray(this.errorText)?this.errorText:[this.errorText]).filter((i=>i!=null&&i.trim()!==""));return e("div",{key:"9a218054b8c8ebb757b52443eec09a1d0aeaed9f",class:{"six-file-upload":true,"six-file-upload--disabled":this.disabled\|\|this.uploading}},e(i,{key:"b46e0045f3c2a5b4500dc427cf26958a0e9c95db",disabled:this.disabled\|\|this.uploading,"aria-invalid":this.invalid?"true":"false",class:{"six-file-upload__container--compact":this.compact,"six-file-upload__container--full":!this.compact}},this.compact&&!this.uploading&&e("six-icon",{key:"5554e0b4f58b9070e5f187c3fb398c7799d3e2cb",slot:"prefix"},"arrow_circle_up"),e("div",{key:"fd1c35f6ae2bf980b50725af2c8de5caf6d23ca0",class:{"six-file-upload__drop-zone":true,"six-file-upload__drop-zone--hover":this.isOver,"six-file-upload__drop-zone--compact":this.compact}},this.uploading?e("span",{class:"six-file-upload__drop-zone__spinner-container"},e("six-spinner",null)," Uploading..."):e("div",null,e("span",null,this.renderLabel()),e("input",{class:"six-file-upload__input",type:"file",name:"resume",disabled:this.disabled,accept:this.accept,multiple:this.multiple,onChange:this.onChange,ref:i=>this.fileInput=i})))),e("div",{key:"25185ad2032778268e923c6b618129bb25e317df","aria-hidden":this.invalid?"false":"true"},e("slot",{key:"48a849e787fb9a3607990204d6cc2a8c3a31dc70",name:"error-text"},s.map((i=>e("six-error",null,e("div",{class:"six-file-upload__error-text"},i)))))))}get host(){return l(this)}};t.style=a;export{t as six_file_upload};
2	- //# sourceMappingURL=p-27e8e8a6.entry.js.map

package/dist/ui-library/p-27e8e8a6.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["sixFileUploadCss","SixFileUpload","constructor","hostRef","this","isOver","hasError","compact","disabled","multiple","uploading","errorText","invalid","handleSlotChange","validType","trim","length","hasSlot","host","handleFiles","files","failure","emit","reason","file","acceptedTypesList","accept","replace","split","indexOf","type","maxFileSize","size","success","onChange","_a","fileInput","value","dragenterHandler","dragoverHandler","dragleaveHandler","dropHandler","componentWillLoad","componentDidLoad","forEach","eventName","addEventListener","preventDefaults","document","body","shadowRoot","disconnectedCallback","removeEventListener","e","preventDefault","stopPropagation","renderLabel","label","h","class","render","Container","errorMessages","Array","isArray","filter","text","key","slot","name","ref","el","map"],"sources":["src/components/six-file-upload/six-file-upload.scss?tag=six-file-upload&encapsulation=scoped","src/components/six-file-upload/six-file-upload.tsx"],"sourcesContent":["@import 'src/global/component';\n\n$over-color: var(--six-color-action-light-to-be-defined);\n$disabled-color: var(--six-color-inactive);\n$transition: 0.3s;\n$margin: 1rem;\n\n:host {\n position: static;\n display: block;\n}\n\n.six-file-upload {\n six-card {\n box-shadow: none;\n padding: 0;\n width: 100%;\n }\n\n &__label {\n &--highlighted {\n color: var(--six-color-action-600);\n }\n }\n\n &__container {\n &--full {\n border: dashed 1px var(--six-color-web-rock-500);\n }\n }\n\n &__drop-zone {\n padding: 2rem 0;\n display: flex;\n justify-content: center;\n width: 100%;\n transition: background-color $transition;\n\n &__spinner-container {\n display: flex;\n align-items: center;\n\n six-spinner {\n margin-right: var(--six-spacing-x-small);\n }\n }\n\n &--compact {\n padding: 0;\n }\n }\n\n &__input {\n cursor: pointer;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n user-select: none;\n height: 100%;\n opacity: 0;\n outline: none;\n }\n\n &--disabled &__drop-zone {\n background-color: $disabled-color;\n cursor: not-allowed;\n }\n\n &:not(.six-file-upload--disabled) &__drop-zone:hover,\n &__drop-zone--hover {\n background-color: $over-color;\n\n &.six-file-upload__drop-zone--compact {\n background-color: inherit;\n }\n }\n\n &--disabled &__input {\n cursor: not-allowed;\n }\n\n &__error-text {\n font-size: var(--six-input-help-text-font-size-medium);\n }\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { hasSlot } from '../../utils/slot';\n\nexport interface SixFileUploadSuccessPayload {\n files: FileList;\n}\n\nexport interface SixFileUploadFailurePayload {\n reason: string;\n}\n\n/**\n * @since 2.0.0\n * @status experimental\n *\n * @slot error-text - Error text that is shown when the status is set to invalid. Alternatively, you can use the error-text prop.\n */\n@Component({\n tag: 'six-file-upload',\n styleUrl: 'six-file-upload.scss',\n scoped: true,\n shadow: false,\n})\nexport class SixFileUpload {\n @Element() readonly host!: HTMLSixFileUploadElement;\n\n private fileInput?: HTMLInputElement;\n\n @State() isOver = false;\n @State() hasError = false;\n\n /** Set to true if file control should be small. */\n @Prop() readonly compact: boolean = false;\n\n /** Label of the drop area. */\n @Prop() readonly label?: string;\n\n /** Set when button is disabled. */\n @Prop() readonly disabled = false;\n\n /** Accepted MIME-Types. */\n @Prop() readonly accept?: string;\n\n /** More than one file allowed. */\n @Prop() readonly multiple = false;\n\n /** Allowed max file size in bytes. */\n @Prop() readonly maxFileSize?: number;\n\n /** Set to true to draw the control in a loading state. */\n @Prop({ reflect: true }) uploading = false;\n\n /** The error message shown, if `invalid` is set to true. */\n @Prop() errorText: string | string[] = '';\n\n /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed. */\n @Prop({ reflect: true }) invalid = false;\n\n /** Triggers when a file is added. */\n @Event({ eventName: 'six-file-upload-success' }) success!: EventEmitter<SixFileUploadSuccessPayload>;\n\n /** Triggers when an uploaded file doesn't match MIME type or max file size. */\n @Event({ eventName: 'six-file-upload-failure' }) failure!: EventEmitter<SixFileUploadFailurePayload>;\n\n @Listen('dragenter', { capture: false })\n dragenterHandler() {\n if (!this.disabled) {\n this.isOver = true;\n }\n }\n\n @Listen('dragover', { capture: false })\n dragoverHandler() {\n if (!this.disabled) {\n this.isOver = true;\n }\n }\n\n @Listen('dragleave', { capture: false })\n dragleaveHandler() {\n if (!this.disabled) {\n this.isOver = false;\n }\n }\n\n @Listen('drop', { capture: false })\n dropHandler() {\n if (!this.disabled) {\n this.isOver = false;\n }\n }\n\n private handleSlotChange = () => {\n let validType = false;\n\n if (\n this.errorText != null &&\n ((typeof this.errorText == 'string' && this.errorText.trim().length > 0) ||\n (typeof this.errorText == 'object' && this.errorText.length > 0))\n ) {\n validType = true;\n }\n\n this.hasError = validType || hasSlot(this.host, 'error-text');\n };\n\n private handleFiles = (files: FileList) => {\n if (this.disabled || files.length === 0 || this.uploading) {\n return;\n }\n\n if (!this.multiple && files.length > 1) {\n return this.failure.emit({ reason: 'Only one file is allowed.' });\n }\n\n for (const file of files) {\n if (file == null) {\n return;\n }\n\n let acceptedTypesList: string[] = [];\n if (this.accept != null) {\n acceptedTypesList = this.accept.replace(/\\s/g, '').split(',');\n }\n\n if (acceptedTypesList.length > 0 && acceptedTypesList.indexOf(file.type) === -1) {\n const reason = files.length > 1 ? 'One or more files have invalid MIME type.' : 'File has invalid MIME type.';\n return this.failure.emit({ reason });\n }\n\n if (this.maxFileSize != null && file.size > this.maxFileSize) {\n const reason = files.length > 1 ? 'One or more files are too big' : 'File is too big.';\n return this.failure.emit({ reason });\n }\n }\n\n this.success.emit({ files } as SixFileUploadSuccessPayload);\n };\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n componentDidLoad() {\n ['dragenter', 'dragover', 'dragleave', 'drop'].forEach((eventName) => {\n this.host.addEventListener(eventName, this.preventDefaults, false);\n document.body.addEventListener(eventName, this.preventDefaults, false);\n });\n this.host.shadowRoot?.addEventListener('slotchange', this.handleSlotChange);\n }\n\n disconnectedCallback() {\n ['dragenter', 'dragover', 'dragleave', 'drop'].forEach((eventName) => {\n this.host.removeEventListener(eventName, this.preventDefaults, false);\n document.body.removeEventListener(eventName, this.preventDefaults, false);\n });\n this.host.shadowRoot?.removeEventListener('slotchange', this.handleSlotChange);\n }\n\n private preventDefaults(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n private onChange = () => {\n if (this.fileInput?.files != null) {\n const files = this.fileInput.files;\n this.handleFiles(files);\n this.fileInput.value = '';\n }\n };\n\n private renderLabel() {\n return (\n this.label ??\n (this.compact ? (\n 'Upload'\n ) : (\n <span>\n Drop files to upload, or <span class=\"six-file-upload__label--highlighted\">browse</span>\n </span>\n ))\n );\n }\n\n render() {\n const Container = this.compact ? 'six-button' : 'six-card';\n\n const errorMessages = (Array.isArray(this.errorText) ? this.errorText : [this.errorText]).filter(\n (text) => text != null && text.trim() !== ''\n );\n\n return (\n <div\n class={{\n 'six-file-upload': true,\n 'six-file-upload--disabled': this.disabled || this.uploading,\n }}\n >\n <Container\n disabled={this.disabled || this.uploading}\n aria-invalid={this.invalid ? 'true' : 'false'}\n class={{\n 'six-file-upload__container--compact': this.compact,\n 'six-file-upload__container--full': !this.compact,\n }}\n >\n {this.compact && !this.uploading && <six-icon slot=\"prefix\">arrow_circle_up</six-icon>}\n <div\n class={{\n 'six-file-upload__drop-zone': true,\n 'six-file-upload__drop-zone--hover': this.isOver,\n 'six-file-upload__drop-zone--compact': this.compact,\n }}\n >\n {this.uploading ? (\n <span class=\"six-file-upload__drop-zone__spinner-container\">\n <six-spinner /> Uploading...\n </span>\n ) : (\n <div>\n <span>{this.renderLabel()}</span>\n <input\n class=\"six-file-upload__input\"\n type=\"file\"\n name=\"resume\"\n disabled={this.disabled}\n accept={this.accept}\n multiple={this.multiple}\n onChange={this.onChange}\n ref={(el) => (this.fileInput = el)}\n />\n </div>\n )}\n </div>\n </Container>\n <div aria-hidden={this.invalid ? 'false' : 'true'}>\n <slot name=\"error-text\">\n {errorMessages.map((text) => (\n <six-error>\n <div class=\"six-file-upload__error-text\">{text}</div>\n </six-error>\n ))}\n </slot>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ui-library/p-5a579e9f.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as t,c as i,h as s,g as e}from"./p-D0Go1Zjj.js";import{I as r}from"./p-WA6V9mN8.js";import{D as n,b as o,d as h}from"./p-ltzGzaAu.js";import{E as a}from"./p-C4h4qpGl.js";import{h as c}from"./p-j3oIB5oT.js";import{a as l,m as p}from"./p-Dd6pdO8C.js";const u=()=>{const t=new Date;return{hours:t.getHours(),minutes:t.getMinutes(),seconds:t.getSeconds(),milliseconds:t.getMilliseconds(),has24Hours:true}};const m=12;const d=t=>t>m?t-m:t;const f=()=>{const t=new Date;const i=t.getHours();return{hours:d(i),minutes:t.getMinutes(),seconds:t.getSeconds(),milliseconds:t.getMilliseconds(),has24Hours:false,period:i>=m?"PM":"AM"}};const g=(t=true)=>t?u():f();const x=(t,i)=>{const s=t.split(":");const e=i.split(":");return s.length===e.length};const b=(t,i)=>{const s=t.split(":");const e=i.split(":");if(!x(t,i)){console.error(`Timestring did not match expected format.\nExpected format: ${i}\nReceived timestring: ${t}`)}const r={};s.forEach(((t,i)=>{const s=e[i];switch(s){case"HH":r.hours=Number(t);r.has24Hours=true;break;case"hh":r.hours=Number(t);r.has24Hours=false;break;case"mm":r.minutes=Number(t);break;case"ss":r.seconds=Number(t);break;case"ms":r.milliseconds=Number(t);break;case"aa":r.period=t.toUpperCase()==="PM"?"PM":"AM"}}));return r};const k=(t,i)=>{if(t==null){return""}const s=i.split(":");return s.map((i=>{switch(i){case"HH":case"hh":return String(t.hours).padStart(2,"0");case"mm":return String(t.minutes).padStart(2,"0");case"ss":return String(t.seconds).padStart(2,"0");case"ms":return String(t.milliseconds).padStart(3,"0");case"aa":return String(t.period)}})).join(":")};const v=":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)}.timepicker_clear{display:inline-flex;align-items:center;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;padding:0;transition:var(--six-transition-fast) color;cursor:pointer}.timepicker_clear:hover{color:var(--six-input-icon-color-hover)}.timepicker_clear:focus{outline:none}.timepicker_clear--right{right:0;position:absolute}.timepicker_clear--left{right:35px;position:absolute}.timepicker__container{position:relative}.timepicker__popup{display:flex;justify-content:center;min-width:min-content;background-color:white;padding:0.5em;box-shadow:0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);user-select:none;position:absolute;z-index:var(--six-z-index-dropdown);right:0;left:0}.timepicker__popup--is-up{bottom:100%}.timepicker__popup--is-inline{position:initial;box-shadow:none;border:1px solid var(--six-color-web-rock-400)}.timepicker__separator{display:flex;align-items:center}.timepicker__item--wide{padding-left:0.5rem;padding-right:0.5rem}.input--empty .timepicker_clear{visibility:hidden}.input--hide{display:none}.prefix{cursor:pointer}.prefix--right{right:0;display:inline-flex;position:absolute;font-size:inherit;color:var(--six-input-icon-color);border:none;background:none;margin-right:var(--six-input-spacing-medium);transition:var(--six-transition-fast) color}";const _=145;const y=class{constructor(s){t(this,s);this.sixChange=i(this,"six-timepicker-change");this.sixChangeDebounced=i(this,"six-timepicker-change-debounced");this.sixClear=i(this,"six-timepicker-clear");this.eventListeners=new a;this.format="HH:mm:ss";this.separator=":";this.value="";this.open=false;this.inline=false;this.readonly=false;this.disabled=false;this.size="medium";this.required=false;this.errorText="";this.label="";this.invalid=false;this.name="";this.clearable=false;this.iconPosition="left";this.hoist=false;this.timeout=n;this.interval=o;this.debounce=n;this.isPopupContentUp=false;this.isDropDownContentUp=false;this.popupValue={};this.handlePickerChange=(t,i)=>{t.stopPropagation();if(this.popupValue==null){return}this.popupValue[i]=t.detail;const s=k(this.popupValue,this.format);this.value=s;this.sixChange.emit({changedProperty:i,value:this.popupValue,valueAsString:s})};this.handleDocumentMouseDown=t=>{const i=t.composedPath();if(!i.includes(this.host)){this.closePopup();return}};this.handleClearClick=t=>{t.stopPropagation();this.value="";this.sixClear.emit();this.sixChange.emit({value:{},valueAsString:""})}}async resizeHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}async scrollHandler(){this.calcIsPopupContentUp();this.moveOpenHoistedPopup()}valueChanged(){this.updateValue()}async setFocus(t){var i;(i=this.inputElement)===null\|\|i===void 0?void 0:i.setFocus(t)}connectedCallback(){this.eventListeners.forward("six-timepicker-change","change",this.host)}componentWillLoad(){this.updateValue();if(this.inline){this.open=true}if(this.open){this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}componentDidLoad(){if(this.inputElement==null)return;const t=this.inputElement;this.eventListeners.add(this.host,"six-timepicker-change",h((t=>this.sixChangeDebounced.emit(t.detail)),this.debounce));this.eventListeners.add(t,"six-input-input",h((i=>{i.stopPropagation();if(!x(t.value,this.format)){this.value=t.value;this.sixChange.emit({value:{},valueAsString:""});return}this.value=t.value;this.popupValue=b(t.value,this.format);this.sixChange.emit({value:this.popupValue,valueAsString:k(this.popupValue,this.format)})}),this.debounce))}componentDidRender(){l(this.hoist,this.popup,this.inputElement,this.wrapper,_,(t=>this.isDropDownContentUp=t))}disconnectedCallback(){this.eventListeners.removeAll()}updateValue(){if(typeof this.value!=="string"\|\|!x(this.value,this.format)){this.value=""}if(this.value===""){if(this.defaultTime==null){this.popupValue=g(this.is24HourClock())}else{this.popupValue=b(this.defaultTime,this.format)}}else{this.popupValue=b(this.value,this.format)}}calcIsPopupContentUp(){if(this.inputElement==null\|\|this.wrapper==null){return}const t=this.inputElement.getBoundingClientRect();const i=this.wrapper.getBoundingClientRect();const s=Math.max(i.height,_);const e=t.y>window.innerHeight/2;this.isPopupContentUp=e&&window.innerHeight<t.bottom+s}moveOpenHoistedPopup(){p(this.hoist,this.open,this.popup,this.inputElement,this.wrapper,_)}getSixTimeUnitPicker(t){return s("six-item-picker",{class:t.class,timeout:this.timeout,interval:this.interval,padded:true,min:t.min,max:t.max,value:this.popupValue[t.propertyName],items:t.items,type:t.type\|\|r.NUMBER,"padding-length":t.paddingLength,"onSix-item-picker-change":i=>this.handlePickerChange(i,t.propertyName)})}getHour24Picker(){if(!this.is24HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:23,propertyName:"hours"})}is24HourClock(){return this.format.includes("HH")}getHour12Picker(){if(!this.is12HourClock()){return}return this.getSixTimeUnitPicker({min:0,max:11,propertyName:"hours"})}is12HourClock(){return this.format.includes("hh")}getAmPmPicker(){if(!this.is12HourClock()){return}const t=["AM","PM"];return this.getSixTimeUnitPicker({items:t,type:r.CUSTOM,propertyName:"period"})}getMinutePicker(){if(!this.format.includes("mm")){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:"minutes"})}getSecondsPicker(){if(!this.format.includes("ss")){return}return this.getSixTimeUnitPicker({min:0,max:59,propertyName:"seconds"})}getMillisecondsPicker(){if(!this.format.includes("ms")){return}return this.getSixTimeUnitPicker({min:0,max:999,class:"timepicker__item--wide",paddingLength:3,propertyName:"milliseconds"})}getSeparator(){return s("div",{class:"timepicker__separator"},s("span",null,this.separator))}getContent(){const t=[this.getHour24Picker(),this.getHour12Picker(),this.getMinutePicker(),this.getSecondsPicker(),this.getMillisecondsPicker()];const i=t.filter((t=>t!==undefined));return i.map(((t,s)=>{if(s===i.length-1){return[t]}return[t,this.getSeparator()]}))}openPopup(){if(!this.open&&!this.disabled){this.open=true;this.eventListeners.add(document,"mousedown",this.handleDocumentMouseDown)}}closePopup(){if(this.inline){return}this.open=false;this.eventListeners.remove(document,"mousedown",this.handleDocumentMouseDown)}renderClearable(){return this.clearable&&s("button",{slot:"suffix",class:{timepicker_clear:true,"timepicker_clear--right":this.iconPosition==="left","timepicker_clear--left":this.iconPosition==="right"},type:"button",onClick:this.handleClearClick,tabindex:"-1"},s("six-icon",{size:"small"},"clear"))}renderCustomIcon(){const t=c(this.host,"custom-icon")?s("slot",{name:"custom-icon"}):s("six-icon",{size:this.size==="large"?"medium":this.size},"watch_later");return s("span",{slot:"prefix",part:"icon",class:{prefix:true,"prefix--right":this.iconPosition==="right"}},t)}render(){return s("div",{key:"58240c7c32227225d1811fa59e9cf336aad03a4d",part:"container",ref:t=>this.wrapper=t,class:"timepicker__container"},s("six-input",{key:"1b6e9b28d997b67a933d055fa3e73e3c0751aa53",ref:t=>this.inputElement=t,part:"input",onClick:()=>this.openPopup(),value:this.value,placeholder:this.placeholder,readonly:this.readonly,disabled:this.disabled,errorTextCount:this.errorTextCount,errorText:this.errorText,invalid:this.invalid,size:this.size,name:this.name,label:this.label,required:this.required,class:{"input--empty":this.value==="","input--hide":this.inline}},this.renderCustomIcon(),this.renderClearable(),c(this.host,"label")?s("span",{slot:"label"},s("slot",{name:"label"})):null,c(this.host,"error-text")?s("span",{slot:"error-text"},s("slot",{name:"error-text"})):null),this.open&&s("div",{key:"b762116d0af1bc11d7f2cbb255b071e8fe3b52cf",ref:t=>this.popup=t,part:"popup",class:{timepicker__popup:true,"timepicker__popup--is-up":this.placement==null?this.placement==="top":this.isPopupContentUp,"timepicker__popup--is-inline":this.inline}},...this.getContent(),this.getAmPmPicker()))}get host(){return e(this)}static get watchers(){return{value:["valueChanged"]}}};y.style=v;export{y as six_timepicker};
2	- //# sourceMappingURL=p-5a579e9f.entry.js.map