q2-tecton-elements 1.44.1 → 1.45.1

package/dist/q2-tecton-elements/p-a214077c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2TagCss","Q2TagStyle0","Q2Tag","this","determineOptionCount","numberOfOptions","hostElement","querySelectorAll","length","optionCount","onClickElsewhere","event","target","localName","stopPropagation","popoverElement","open","handleChange","value","detail","click","emit","handleClick","async","controlElement","dropdownBtn","shouldShowActionSheet","showActionSheetList","toggle","handleKeydown","isTabMetaOrCtrl","metaKey","ctrlKey","key","preventDefault","optionList","handleExternalKeydown","handleButtonFocusout","relatedTarget","_a","tagName","handleWrapperClick","focus","window","Tecton","useActionSheets","componentWillLoad","observer","MutationObserver","observe","childList","attributes","mutationObserver","componentDidLoad","overrideFocus","disconnectedCallback","disconnect","delegateFocus","isEventFromElement","popoverStateHandler","setActiveElement","generateHiddenElement","h","id","class","loc","render","wrapperClassNames","push","Host","role","onChange","Fragment","onClick","ref","el","type","onKeyDown","onFocusout","join","label","e","minHeight","popoverMinHeight","direction","popoverDirection","align","popoverAlignment","optionListLabel"],"sources":["src/components/q2-tag/q2-tag.scss?tag=q2-tag&encapsulation=shadow","src/components/q2-tag/q2-tag.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: inline-block;\n    position: relative;\n    line-height: 0;\n}\n\n:host(:not(:last-child)) {\n    margin-inline-end: var-list(var-prefixer(tag-margin), --app-scale-2x, 10px);\n}\n\n.tag-wrapper {\n    --comp-tag-btn-size: #{var-list(var-prefixer(tag-btn-size), --app-scale-6x, 30px)};\n    --comp-tag-background: #{var-list(var-prefixer(tag-background), --t-gray-13, #e6e6e6)};\n    --comp-tag-color: #{var-list(var-prefixer(tag-color), --t-gray-3, #262626)};\n    background: var(--comp-tag-background);\n    color: var(--comp-tag-color);\n    border-radius: var-list(var-prefixer(tag-border-radius), --app-border-radius-1, 3px);\n    position: relative;\n\n    :host([theme='primary']) & {\n        --comp-tag-background: #{var-list(--tct-tag-primary-background, --t-primary, #0079c1)};\n        --comp-tag-color: #{var-list(--tct-tag-primary-font-color, --t-primary-text, #ffffff)};\n    }\n\n    :host([theme='secondary']) & {\n        --comp-tag-background: #{var-list(--tct-tag-secondary-background, --t-secondary, #b3c2cc)};\n        --comp-tag-color: #{var-list(--tct-tag-secondary-font-color, --t-secondary-text, #141414)};\n    }\n\n    :host([theme='tertiary']) & {\n        --comp-tag-background: #{var-list(--tct-tag-tertiary-background, --t-tertiary, #e8f5fc)};\n        --comp-tag-color: #{var-list(--tct-tag-tertiary-font-color, --t-tertiary-text, #141414)};\n    }\n}\n\n.tag {\n    display: flex;\n    width: max-content;\n    height: var-list(var-prefixer(tag-height), --app-scale-6x, 30px);\n    line-height: var-list(var-prefixer(tag-height), --app-scale-6x, 30px);\n    padding-inline: var-list(var-prefixer(tag-padding-inline), --app-scale-3x, 15px);\n}\n\n.tag.has-options {\n    padding-right: 6px;\n}\n\n.btn-wrapper {\n    --comp-tag-clickable-size: #{var-list(var-prefixer(tag-clickable-size), 44px)};\n    --comp-tag-btn-offset: calc(calc(calc(var(--comp-tag-clickable-size) - var(--comp-tag-btn-size)) / 2) * -1);\n    --comp-tag-background: #{var-list(var-prefixer(tag-background), --t-gray-13, #e6e6e6)};\n    height: var(--comp-tag-clickable-size);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    right: var(--comp-tag-btn-offset);\n    top: var(--comp-tag-btn-offset);\n    cursor: pointer;\n}\n\nbutton {\n    height: var(--comp-tag-btn-size);\n    stroke: var(--comp-tag-color);\n    --tct-icon-stroke-primary: var(--comp-tag-color);\n    cursor: pointer;\n    border: 0;\n    background: transparent;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0;\n    padding-right: 6px;\n    --tct-icon-size: 18px;\n}\n","import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Host,\n    Listen,\n    Element,\n    EventEmitter,\n    Event,\n    Fragment,\n} from '@stencil/core';\nimport { isEventFromElement, loc, overrideFocus } from 'src/utils';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n@Component({ tag: 'q2-tag', shadow: true, styleUrl: 'q2-tag.scss' })\nexport class Q2Tag implements ComponentInterface {\n    /**\n     * Instructs the component to use the action sheet workflow for displaying its options.\n     *\n     * For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n     */\n    @Prop() hoist: boolean = !!window.Tecton?.useActionSheets;\n\n    /**\n     * The text that populates the label.\n     * @localizable\n     */\n    @Prop({ reflect: true }) label: string;\n\n    /** Determine whether the popover is open or closed. */\n    @Prop({ reflect: true, mutable: true }) open: boolean;\n\n    /** Determines the label that is applied to the option list for accessibility purposes. */\n    @Prop() optionListLabel: string = 'options';\n\n    /**\n     * Force the direction of the popover dropdown when it opens.\n     * If no value is passed, the component will auto-detect the direction based on available space.\n     */\n    @Prop() popoverDirection: 'up' | 'down';\n\n    /** Aligns the popover dropdown to the left or right side of the input field. */\n    @Prop({ mutable: true }) popoverAlignment: 'left' | 'right' = 'right';\n\n    /** @deprecated */\n    @Prop() popoverMinHeight: number = 150;\n\n    /** The color of the element. */\n    @Prop({ reflect: true }) theme: 'primary' | 'secondary' | 'tertiary';\n\n    @State() optionCount: number;\n\n    @Element() hostElement: HTMLElement;\n\n    /**\n     * Emitted when a provided option is clicked.\n     *\n     * Requires at least one option to be provided.\n     */\n    @Event() click: EventEmitter<{ value: string }>;\n    dropdownBtn: HTMLButtonElement;\n    popoverElement: HTMLQ2PopoverElement;\n    optionList: HTMLQ2OptionListElement;\n    mutationObserver: MutationObserver;\n\n    /// LifeCycle Hooks ///\n    componentWillLoad() {\n        const observer = new MutationObserver(this.determineOptionCount);\n        observer.observe(this.hostElement, { childList: true, attributes: true });\n        this.mutationObserver = observer;\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n    }\n\n    disconnectedCallback() {\n        this.mutationObserver.disconnect();\n        this.mutationObserver = null;\n    }\n\n    /// Getters ///\n\n    /// Helpers\n    determineOptionCount = () => {\n        const numberOfOptions = this.hostElement.querySelectorAll('q2-option').length;\n        this.optionCount = numberOfOptions;\n    };\n\n    /// Listeners ///\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        if (!this.optionCount) return;\n        this.dropdownBtn.focus();\n    }\n\n    @Listen('popoverStateChanged')\n    popoverStateHandler({ detail: { open } }: CustomEvent<{ open: boolean }>) {\n        if (this.open !== open) this.open = open;\n        if (open) return;\n        this.optionList.setActiveElement(null);\n    }\n\n    /// Event Handlers ///\n    onClickElsewhere = (event: CustomEvent) => {\n        const target = event.target as HTMLClickElsewhereElement;\n        if (target.localName === 'click-elsewhere') {\n            event.stopPropagation();\n            const { popoverElement } = this;\n            if (!popoverElement) return;\n            popoverElement.open = false;\n        }\n    };\n\n    handleChange = event => {\n        event.stopPropagation();\n        if (!this.optionCount) return;\n        const { value } = event.detail;\n\n        this.click.emit({ value });\n    };\n\n    handleClick = async (event: MouseEvent) => {\n        event.stopPropagation();\n        this.popoverElement.controlElement = this.dropdownBtn;\n        if (shouldShowActionSheet(this)) {\n            const { value } = await showActionSheetList(this, event);\n            this.click.emit({ value });\n        } else {\n            await this.popoverElement.toggle();\n        }\n    };\n\n    handleKeydown = async (event: KeyboardEvent) => {\n        const isTabMetaOrCtrl = event.metaKey || event.ctrlKey || event.key === 'Tab';\n        if (isTabMetaOrCtrl) return;\n\n        event.preventDefault();\n        this.popoverElement.controlElement = this.dropdownBtn;\n        if (shouldShowActionSheet(this, event)) {\n            const { value } = await showActionSheetList(this, event);\n            this.click.emit({ value });\n        } else {\n            this.optionList.handleExternalKeydown(event);\n        }\n    };\n\n    handleButtonFocusout = async (event: FocusEvent) => {\n        const relatedTarget = event.relatedTarget as unknown as HTMLElement;\n        if (relatedTarget?.tagName === 'Q2-OPTION' ?? false) return;\n        this.open = false;\n    };\n\n    handleWrapperClick = () => {\n        this.dropdownBtn.focus();\n        this.dropdownBtn.click();\n    };\n\n    /// DOM ///\n    generateHiddenElement() {\n        return (\n            <div\n                id=\"option-description\"\n                class=\"sr\"\n                aria-hidden=\"true\"\n            >\n                {loc('tecton.element.optionList.optionCount', [this.optionCount])}\n            </div>\n        );\n    }\n\n    render() {\n        const { optionCount, open } = this;\n        const wrapperClassNames = ['tag'];\n        if (optionCount) wrapperClassNames.push('has-options');\n\n        return (\n            <Host role=\"listitem\">\n                <click-elsewhere onChange={this.onClickElsewhere}>\n                    {this.optionCount ? (\n                        <Fragment>\n                            <div\n                                class=\"btn-wrapper\"\n                                onClick={this.handleWrapperClick}\n                            >\n                                <button\n                                    class=\"tag-wrapper\"\n                                    ref={el => (this.dropdownBtn = el)}\n                                    test-id=\"btn-control\"\n                                    type=\"button\"\n                                    role=\"combobox\"\n                                    onClick={this.handleClick}\n                                    onKeyDown={this.handleKeydown}\n                                    onFocusout={this.handleButtonFocusout}\n                                    aria-controls=\"option-list\"\n                                    aria-expanded={open ? 'true' : 'false'}\n                                    aria-describedby=\"option-description\"\n                                >\n                                    <div class={wrapperClassNames.join(' ')}>{this.label}</div>\n                                    <q2-icon type=\"options\"></q2-icon>\n                                </button>\n                            </div>\n                            {this.generateHiddenElement()}\n                        </Fragment>\n                    ) : (\n                        <div\n                            class=\"tag-wrapper\"\n                            onClick={e => e.stopPropagation()}\n                        >\n                            <div class={wrapperClassNames.join(' ')}>{this.label}</div>\n                        </div>\n                    )}\n\n                    {this.optionCount > 0 && (\n                        <q2-popover\n                            ref={el => (this.popoverElement = el)}\n                            controlElement={this.dropdownBtn}\n                            open={this.open}\n                            minHeight={this.popoverMinHeight}\n                            direction={this.popoverDirection}\n                            align={this.popoverAlignment}\n                        >\n                            <q2-option-list\n                                id=\"option-list\"\n                                ref={el => (this.optionList = el)}\n                                onChange={this.handleChange}\n                                type=\"menu\"\n                                align=\"right\"\n                                label={loc('tecton.element.optionList.label', [this.optionListLabel])}\n                                no-select\n                            >\n                                <slot />\n                            </q2-option-list>\n                        </q2-popover>\n                    )}\n                </click-elsewhere>\n            </Host>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/{p-3bc27513.entry.js → p-aec64fcb.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as i,h as e,g as s}from"./p-a5f18e27.js";import{l as n,h as a,o as r,i as h,w as d}from"./p-5c46acb8.js";const l="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;max-width:100%}.q2-editable-field-wrapper:not([hidden]){display:flex}.q2-editable-field-wrapper.editing{align-items:flex-end}:host([block]){display:block;width:100%}:host([block]) .q2-editable-field-wrapper:not([hidden]){display:grid;grid-template-columns:1fr auto auto}q2-input,.text-wrapper{margin:0 var(--tct-scale-2, var(--app-scale-2x, 10px)) 0 0}q2-input{flex:1 1 auto;min-width:170px}.text-wrapper{flex:0 auto;align-self:center;display:inline-block}:host([truncated]) .text-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}q2-btn{flex:0 0 44px}dl{margin:var(--tct-scale-0, var(--app-scale-0x, 0))}dt{font-weight:600}dd{margin-left:var(--tct-scale-0, var(--app-scale-0x, 0));display:flex;align-items:center}";const o=l;const c=class{constructor(e){t(this,e);this.input=i(this,"input",7);this.change=i(this,"change",7);this.scheduledAfterRender=[];this.defaultValue=this.value;this.inputInput=t=>{t.stopPropagation();this.input.emit(t.detail);this.formattedValue=t.detail.formattedValue;this.innerValue=t.detail.value};this.inputChange=t=>{t.stopPropagation()};this.inputKeyDown=t=>{if(t.key==="Escape"||t.key==="Esc"){t.preventDefault();this.cancelClick();return}if(t.key==="Enter"){t.preventDefault();this.saveClick();return}};this.inputClick=t=>{t.stopPropagation()};this.saveClick=t=>{t&&t.stopPropagation();const i=this.hostElement.shadowRoot.querySelector("q2-input").value;this.defaultValue=i;this.change.emit({editing:false,name:"save",value:this.innerValue||i,formattedValue:this.formattedValue||i});setTimeout((()=>{const{errors:t=[]}=this;if(!t.length)return;this.hostElement.focus()}),1)};this.editClick=t=>{t===null||t===void 0?void 0:t.stopPropagation();this.change.emit({editing:true,name:"edit"})};this.cancelClick=t=>{t===null||t===void 0?void 0:t.stopPropagation();this.change.emit({editing:false,name:"cancel"});this.inputElement.setValue(this.defaultValue)};this.block=undefined;this.disabled=undefined;this.editing=false;this.errors=undefined;this.formatModifier=undefined;this.hideLabel=undefined;this.hints=undefined;this.label="";this.maxlength=undefined;this.persistentLabel=undefined;this.truncated=undefined;this.type=undefined;this.value="";this.ariaLabel=undefined;this.formattedValue=undefined}get locLabel(){return this.label&&n(this.label)||""}componentWillLoad(){a(this)}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[];this.formattedValue=this.inputElement.formattedValue}componentDidLoad(){r(this.hostElement)}errorsObserver(){var t;const{editing:i,errors:e=[]}=this;const s=this.hostElement.shadowRoot.activeElement;const n=(t=(s===null||s===void 0?void 0:s.tagName)==="Q2-INPUT")!==null&&t!==void 0?t:false;const a=e.length;if(n||!s||!i||!a)return;this.inputElement.focus()}ariaLabelObserver(){a(this)}observesEditing(t,i){if(t===i)return;this.scheduledAfterRender.push(this.hostElement.focus)}get wrapperClass(){return`q2-editable-field-wrapper ${this.editing?"editing":""}`}onHostElementChange(t){if(!h(t,this.hostElement)||this.hostElement.onchange)return;switch(t.detail.name){case"save":this.value=t.detail.value;break;case"cancel":this.inputElement.value=this.value;break}this.editing=t.detail.editing}delegateFocus(t){if(!h(t,this.hostElement))return;this.hostElement.shadowRoot.querySelector(this.editing?"q2-input":"q2-btn.begin-edit").focus()}clickEdit(){var t;if(this.editing)return;(t=this.editBtnElement)===null||t===void 0?void 0:t.click()}clickCancel(){var t;if(!this.editing)return;(t=this.cancelBtnElement)===null||t===void 0?void 0:t.click()}clickSave(){var t;if(!this.editing)return;(t=this.saveBtnElement)===null||t===void 0?void 0:t.click()}async setValue(t,i={clickSave:true}){await this.clickEdit();await d();await this.inputElement.setValue(t);if(i.clickSave){await this.clickSave();await d()}}render(){return e("div",{key:"66150588f5a753181d584bde5472b782af4051c3"},this.generateEditStateDOM(),this.generateReadStateDOM())}generateEditStateDOM(){return e("div",{class:this.wrapperClass,hidden:!this.editing},e("q2-input",{ref:t=>this.inputElement=t,label:this.locLabel,hideLabel:this.hideLabel,value:this.value,hints:Array.isArray(this.hints)&&this.hints.map((t=>n(t)))||undefined,errors:Array.isArray(this.errors)&&this.errors.map((t=>n(t)))||undefined,type:this.type,disabled:this.disabled,formatModifier:this.formatModifier,maxlength:this.maxlength,"test-id":"editableInput",onInput:this.inputInput,onChange:this.inputChange,onKeyDown:this.inputKeyDown,onClick:this.inputClick}),e("q2-btn",{ref:t=>this.cancelBtnElement=t,class:"cancel-edit",label:`${n("tecton.element.editableField.cancel")} ${this.locLabel}`,"hide-label":true,"test-id":"cancelButton",onClick:this.cancelClick},e("q2-icon",{type:"close"})),e("q2-btn",{ref:t=>this.saveBtnElement=t,class:"save-edit",label:`${n("tecton.element.editableField.save")} ${this.locLabel}`,"hide-label":true,"test-id":"saveButton",onClick:this.saveClick},e("q2-icon",{type:"checkmark"})))}generateReadStateDOM(){if(this.persistentLabel&&this.locLabel){return e("div",{class:this.wrapperClass,hidden:this.editing},e("dl",null,e("dt",{class:"read-state-label"},this.locLabel),e("dd",null,e("span",{class:"text-wrapper"},this.formattedValue||this.value),this.generateEditBtn())))}return e("div",{class:this.wrapperClass,hidden:this.editing},e("div",{class:"text-wrapper"},this.formattedValue||this.value),this.generateEditBtn())}generateEditBtn(){return e("q2-btn",{ref:t=>this.editBtnElement=t,class:"begin-edit",label:`${n("tecton.element.editableField.edit")} ${this.locLabel}`,"hide-label":true,disabled:this.disabled,"test-id":"editButton",onClick:this.editClick},e("q2-icon",{type:"edit"}))}get hostElement(){return s(this)}static get watchers(){return{errors:["errorsObserver"],ariaLabel:["ariaLabelObserver"],editing:["observesEditing"]}}};c.style=o;export{c as q2_editable_field};
-//# sourceMappingURL=p-3bc27513.entry.js.map
+import{r as t,c as i,h as e,g as s}from"./p-a5f18e27.js";import{l as n,h as a,o as r,i as h,w as d}from"./p-42302f6f.js";const l="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;max-width:100%}.q2-editable-field-wrapper:not([hidden]){display:flex}.q2-editable-field-wrapper.editing{align-items:flex-end}:host([block]){display:block;width:100%}:host([block]) .q2-editable-field-wrapper:not([hidden]){display:grid;grid-template-columns:1fr auto auto}q2-input,.text-wrapper{margin:0 var(--tct-scale-2, var(--app-scale-2x, 10px)) 0 0}q2-input{flex:1 1 auto;min-width:170px}.text-wrapper{flex:0 auto;align-self:center;display:inline-block}:host([truncated]) .text-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}q2-btn{flex:0 0 44px}dl{margin:var(--tct-scale-0, var(--app-scale-0x, 0))}dt{font-weight:600}dd{margin-left:var(--tct-scale-0, var(--app-scale-0x, 0));display:flex;align-items:center}";const o=l;const c=class{constructor(e){t(this,e);this.input=i(this,"input",7);this.change=i(this,"change",7);this.scheduledAfterRender=[];this.defaultValue=this.value;this.inputInput=t=>{t.stopPropagation();this.input.emit(t.detail);this.formattedValue=t.detail.formattedValue;this.innerValue=t.detail.value};this.inputChange=t=>{t.stopPropagation()};this.inputKeyDown=t=>{if(t.key==="Escape"||t.key==="Esc"){t.preventDefault();this.cancelClick();return}if(t.key==="Enter"){t.preventDefault();this.saveClick();return}};this.inputClick=t=>{t.stopPropagation()};this.saveClick=t=>{t&&t.stopPropagation();const i=this.hostElement.shadowRoot.querySelector("q2-input").value;this.defaultValue=i;this.change.emit({editing:false,name:"save",value:this.innerValue||i,formattedValue:this.formattedValue||i});setTimeout((()=>{const{errors:t=[]}=this;if(!t.length)return;this.hostElement.focus()}),1)};this.editClick=t=>{t===null||t===void 0?void 0:t.stopPropagation();this.change.emit({editing:true,name:"edit"})};this.cancelClick=t=>{t===null||t===void 0?void 0:t.stopPropagation();this.change.emit({editing:false,name:"cancel"});this.inputElement.setValue(this.defaultValue)};this.block=undefined;this.disabled=undefined;this.editing=false;this.errors=undefined;this.formatModifier=undefined;this.hideLabel=undefined;this.hints=undefined;this.label="";this.maxlength=undefined;this.persistentLabel=undefined;this.truncated=undefined;this.type=undefined;this.value="";this.ariaLabel=undefined;this.formattedValue=undefined}get locLabel(){return this.label&&n(this.label)||""}componentWillLoad(){a(this)}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[];this.formattedValue=this.inputElement.formattedValue}componentDidLoad(){r(this.hostElement)}errorsObserver(){var t;const{editing:i,errors:e=[]}=this;const s=this.hostElement.shadowRoot.activeElement;const n=(t=(s===null||s===void 0?void 0:s.tagName)==="Q2-INPUT")!==null&&t!==void 0?t:false;const a=e.length;if(n||!s||!i||!a)return;this.inputElement.focus()}ariaLabelObserver(){a(this)}observesEditing(t,i){if(t===i)return;this.scheduledAfterRender.push(this.hostElement.focus)}get wrapperClass(){return`q2-editable-field-wrapper ${this.editing?"editing":""}`}onHostElementChange(t){if(!h(t,this.hostElement)||this.hostElement.onchange)return;switch(t.detail.name){case"save":this.value=t.detail.value;break;case"cancel":this.inputElement.value=this.value;break}this.editing=t.detail.editing}delegateFocus(t){if(!h(t,this.hostElement))return;this.hostElement.shadowRoot.querySelector(this.editing?"q2-input":"q2-btn.begin-edit").focus()}clickEdit(){var t;if(this.editing)return;(t=this.editBtnElement)===null||t===void 0?void 0:t.click()}clickCancel(){var t;if(!this.editing)return;(t=this.cancelBtnElement)===null||t===void 0?void 0:t.click()}clickSave(){var t;if(!this.editing)return;(t=this.saveBtnElement)===null||t===void 0?void 0:t.click()}async setValue(t,i={clickSave:true}){await this.clickEdit();await d();await this.inputElement.setValue(t);if(i.clickSave){await this.clickSave();await d()}}render(){return e("div",{key:"66150588f5a753181d584bde5472b782af4051c3"},this.generateEditStateDOM(),this.generateReadStateDOM())}generateEditStateDOM(){return e("div",{class:this.wrapperClass,hidden:!this.editing},e("q2-input",{ref:t=>this.inputElement=t,label:this.locLabel,hideLabel:this.hideLabel,value:this.value,hints:Array.isArray(this.hints)&&this.hints.map((t=>n(t)))||undefined,errors:Array.isArray(this.errors)&&this.errors.map((t=>n(t)))||undefined,type:this.type,disabled:this.disabled,formatModifier:this.formatModifier,maxlength:this.maxlength,"test-id":"editableInput",onInput:this.inputInput,onChange:this.inputChange,onKeyDown:this.inputKeyDown,onClick:this.inputClick}),e("q2-btn",{ref:t=>this.cancelBtnElement=t,class:"cancel-edit",label:`${n("tecton.element.editableField.cancel")} ${this.locLabel}`,"hide-label":true,"test-id":"cancelButton",onClick:this.cancelClick},e("q2-icon",{type:"close"})),e("q2-btn",{ref:t=>this.saveBtnElement=t,class:"save-edit",label:`${n("tecton.element.editableField.save")} ${this.locLabel}`,"hide-label":true,"test-id":"saveButton",onClick:this.saveClick},e("q2-icon",{type:"checkmark"})))}generateReadStateDOM(){if(this.persistentLabel&&this.locLabel){return e("div",{class:this.wrapperClass,hidden:this.editing},e("dl",null,e("dt",{class:"read-state-label"},this.locLabel),e("dd",null,e("span",{class:"text-wrapper"},this.formattedValue||this.value),this.generateEditBtn())))}return e("div",{class:this.wrapperClass,hidden:this.editing},e("div",{class:"text-wrapper"},this.formattedValue||this.value),this.generateEditBtn())}generateEditBtn(){return e("q2-btn",{ref:t=>this.editBtnElement=t,class:"begin-edit",label:`${n("tecton.element.editableField.edit")} ${this.locLabel}`,"hide-label":true,disabled:this.disabled,"test-id":"editButton",onClick:this.editClick},e("q2-icon",{type:"edit"}))}get hostElement(){return s(this)}static get watchers(){return{errors:["errorsObserver"],ariaLabel:["ariaLabelObserver"],editing:["observesEditing"]}}};c.style=o;export{c as q2_editable_field};
+//# sourceMappingURL=p-aec64fcb.entry.js.map

package/dist/q2-tecton-elements/p-aed969d4.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as a,g as r}from"./p-a5f18e27.js";const i="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.avatar-img,.avatar-img-default{object-fit:cover;height:var(--tct-avatar-img-height, var(--tct-avatar-height, 44px));width:var(--tct-avatar-img-width, var(--tct-avatar-width, 44px));border-radius:var(--tct-avatar-img-border-radius, var(--tct-avatar-img-br, var(--tct-avatar-border-radius, 50%)))}.avatar-img-default{background:var(--tct-avatar-background, var(--tct-avatar-bg, #9e9e9e))}.avatar-initials{height:var(--tct-avatar-height, 44px);width:var(--tct-avatar-width, 44px);background:var(--tct-avatar-background, var(--tct-avatar-bg, var(--t-gray-8, #9e9e9e)));border-radius:var(--tct-avatar-br, 50%)}.size-1{--tct-avatar-font-size:var(--tct-avatar-size-1, 60px)}.size-2{--tct-avatar-font-size:var(--tct-avatar-size-2, 48px)}.size-3{--tct-avatar-font-size:var(--tct-avatar-size-3, 40px)}.size-4{--tct-avatar-font-size:var(--tct-avatar-size-4, 30px)}text{fill:var(--tct-avatar-text-color, var(--tct-avatar-color, #ffffff));font-weight:var(--tct-avatar-font-weight, 200);font-size:var(--tct-avatar-font-size, 40px)}.fallback{height:var(--tct-avatar-fallback-height, var(--tct-avatar-height, 44px));width:var(--tct-avatar-fallback-width, var(--tct-avatar-width, 44px));border-radius:var(--tct-avatar-fallback-border-radius, var(--tct-avatar-fallback-br, var(--tct-avatar-img-border-radius, var(--tct-avatar-img-br, 50%))));background:var(--tct-avatar-fallback-background, var(--tct-avatar-fallback-bg, var(--tct-avatar-background, var(--tct-avatar-bg, var(--t-gray-8, #9e9e9e)))));display:inline-flex;align-items:center;justify-content:center}q2-icon{--t-icon-size:var(--tct-avatar-icon-size, var(--tct-avatar-fallback-icon-size, 65%));--t-icon-stroke-primary:var(--tct-avatar-icon-stroke-primary, var(--tct-avatar-fallback-stroke-primary, currentcolor));--t-icon-stroke-secondary:var(--tct-avatar-icon-stroke-secondary, var(--tct-avatar-fallback-stroke-secondary, currentcolor));--tct-icon-fill:var(--tct-avatar-icon-fill, var(--tct-avatar-fallback-fill));color:var(--tct-avatar-icon-color, var(--tct-avatar-fallback-color, var(--tct-avatar-color, var(--t-base, #ffffff))));width:var(--tct-avatar-icon-size, var(--t-icon-size));height:var(--tct-avatar-icon-size, var(--t-icon-size))}";const e=i;const c=class{constructor(a){t(this,a);this.onError=()=>{this.badSrc=true};this.onLoad=()=>{this.isLoaded=true};this.icon="person";this.initials=undefined;this.name=undefined;this.src=undefined;this.badSrc=false;this.isLoaded=false}srcDidUpdate(){this.badSrc=false}get computedInitials(){const{initials:t,name:a}=this;if(!t&&!a)return;let r="";if(t){r=t.substr(0,4)}else if(a){const t=a.split(" ");const i=t[0][0];const e=t.length>1?t[t.length-1][0]:undefined;r+=i;if(e)r+=e}r=r===null||r===void 0?void 0:r.toUpperCase();return r}render(){const{computedInitials:t}=this;const r=this.src&&!this.badSrc;const i=this.isLoaded;const e=(this.name||this.initials)&&(!this.src||this.badSrc);const c=!this.name&&!this.initials&&(!this.src||this.badSrc);return a("div",{key:"40f7061e1f9d697594afaee38c047d428c4ad1ec"},r&&a("img",{key:"f4cd6e36e9cb369708cd11d33949313c0953f5bc",class:i?"avatar-img":"avatar-img-default","test-id":"userImage",src:this.src,onError:this.onError,onLoad:this.onLoad,alt:this.name||""}),e&&a("svg",{key:"3598be173d93b0b281b1135ea6f588275163269d",viewBox:"0 0 100 100",preserveAspectRatio:"xMidYMid meet","test-id":"userInitials",class:`avatar-initials size-${t.length}`,"aria-label":this.name,"aria-hidden":!this.name&&"true"},a("text",{key:"259ee67504f57470175c0ffc6e8b0b6057f9cd64",x:"50",y:"50","dominant-baseline":"central","text-anchor":"middle","aria-hidden":"true"},t)),c&&a("div",{key:"bc08abd0494d88c6626d0fd58f5d2440563ead53","test-id":"fallbackIcon",class:"fallback"},a("q2-icon",{key:"3205d7a5d917687d4142aa81c031599fe820ada0",type:this.icon})))}get el(){return r(this)}static get watchers(){return{src:["srcDidUpdate"]}}};c.style=e;export{c as q2_avatar};
+//# sourceMappingURL=p-aed969d4.entry.js.map

package/dist/q2-tecton-elements/p-aed969d4.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2AvatarCss","Q2AvatarStyle0","Q2Avatar","this","onError","badSrc","onLoad","isLoaded","srcDidUpdate","computedInitials","initials","name","result","substr","parts","split","firstCharacter","lastCharacter","length","undefined","toUpperCase","render","showImg","src","showInitials","showFallback","h","key","class","alt","viewBox","preserveAspectRatio","x","y","type","icon"],"sources":["src/components/q2-avatar/q2-avatar.scss?tag=q2-avatar&encapsulation=shadow","src/components/q2-avatar/q2-avatar.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n.avatar-img,\n.avatar-img-default {\n    object-fit: cover;\n    height: var-list(--tct-avatar-img-height, --tct-avatar-height, 44px);\n    width: var-list(--tct-avatar-img-width, --tct-avatar-width, 44px);\n    border-radius: var-list(--tct-avatar-img-border-radius, --tct-avatar-img-br, --tct-avatar-border-radius, 50%);\n}\n\n.avatar-img-default {\n    background: var-list(--tct-avatar-background, --tct-avatar-bg, #9e9e9e);\n}\n\n.avatar-initials {\n    height: var(--tct-avatar-height, 44px);\n    width: var(--tct-avatar-width, 44px);\n    background: var-list(--tct-avatar-background, --tct-avatar-bg, --t-gray-8, #9e9e9e);\n    border-radius: var(--tct-avatar-br, 50%);\n}\n\n.size-1 {\n    --tct-avatar-font-size: var(--tct-avatar-size-1, 60px);\n}\n.size-2 {\n    --tct-avatar-font-size: var(--tct-avatar-size-2, 48px);\n}\n.size-3 {\n    --tct-avatar-font-size: var(--tct-avatar-size-3, 40px);\n}\n.size-4 {\n    --tct-avatar-font-size: var(--tct-avatar-size-4, 30px);\n}\n\ntext {\n    fill: var-list(--tct-avatar-text-color, --tct-avatar-color, #ffffff);\n    font-weight: var(--tct-avatar-font-weight, 200);\n    font-size: var(--tct-avatar-font-size, 40px);\n}\n\n.fallback {\n    height: var-list(--tct-avatar-fallback-height, --tct-avatar-height, 44px);\n    width: var-list(--tct-avatar-fallback-width, --tct-avatar-width, 44px);\n    border-radius: var-list(\n        --tct-avatar-fallback-border-radius,\n        --tct-avatar-fallback-br,\n        --tct-avatar-img-border-radius,\n        --tct-avatar-img-br,\n        50%\n    );\n    background: var-list(\n        --tct-avatar-fallback-background,\n        --tct-avatar-fallback-bg,\n        --tct-avatar-background,\n        --tct-avatar-bg,\n        --t-gray-8,\n        #9e9e9e\n    );\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n}\n\nq2-icon {\n    --t-icon-size: #{var-list(--tct-avatar-icon-size, --tct-avatar-fallback-icon-size, 65%)};\n    --t-icon-stroke-primary: #{var-list(\n            --tct-avatar-icon-stroke-primary,\n            --tct-avatar-fallback-stroke-primary,\n            currentcolor\n        )};\n    --t-icon-stroke-secondary: #{var-list(\n            --tct-avatar-icon-stroke-secondary,\n            --tct-avatar-fallback-stroke-secondary,\n            currentcolor\n        )};\n    --tct-icon-fill: #{var-list(--tct-avatar-icon-fill, --tct-avatar-fallback-fill)};\n    color: var-list(--tct-avatar-icon-color, --tct-avatar-fallback-color, --tct-avatar-color, --t-base, #ffffff);\n    width: var-list(--tct-avatar-icon-size, --t-icon-size);\n    height: var-list(--tct-avatar-icon-size, --t-icon-size);\n}\n","import { Component, ComponentInterface, Prop, Element, h, State, Watch } from '@stencil/core';\n\n@Component({ tag: 'q2-avatar', shadow: true, styleUrl: 'q2-avatar.scss' })\nexport class Q2Avatar implements ComponentInterface {\n    /** A [q2-icon](https://tecton.q2developer.com/ui/q2-icon/) to display as the fallback. */\n    @Prop() icon: string = 'person';\n\n    /** A set of up to four initials to display as capitalized text. Takes priority over `name`. */\n    @Prop({ reflect: true }) initials: string;\n\n    /**\n     * The name associated with the avatar.\n     * The initials of the first and last words provided will display as capital letters.\n     *\n     * @info\n     * We recommend always providing a name when you want the avatar to be presented to screen readers.\n     */\n    @Prop({ reflect: true }) name: string;\n\n    /**  Displays the image provided by the user. */\n    @Prop({ reflect: true }) src: string;\n\n    @State() badSrc: boolean = false;\n    @State() isLoaded: boolean = false;\n    @Element() el: HTMLElement;\n\n    @Watch('src')\n    srcDidUpdate() {\n        this.badSrc = false;\n    }\n\n    onError = () => {\n        this.badSrc = true;\n    };\n\n    onLoad = () => {\n        this.isLoaded = true;\n    };\n\n    get computedInitials() {\n        const { initials, name } = this;\n        if (!initials && !name) return;\n\n        let result = '';\n        if (initials) {\n            result = initials.substr(0, 4);\n        } else if (name) {\n            const parts = name.split(' ');\n            const firstCharacter = parts[0][0];\n            const lastCharacter = parts.length > 1 ? parts[parts.length - 1][0] : undefined;\n            result += firstCharacter;\n            if (lastCharacter) result += lastCharacter;\n        }\n\n        result = result?.toUpperCase();\n\n        return result;\n    }\n\n    render() {\n        const { computedInitials } = this;\n        const showImg = this.src && !this.badSrc;\n        const isLoaded = this.isLoaded;\n        const showInitials = (this.name || this.initials) && (!this.src || this.badSrc);\n        const showFallback = !this.name && !this.initials && (!this.src || this.badSrc);\n\n        return (\n            <div>\n                {showImg && (\n                    <img\n                        class={isLoaded ? 'avatar-img' : 'avatar-img-default'}\n                        test-id=\"userImage\"\n                        src={this.src}\n                        onError={this.onError}\n                        onLoad={this.onLoad}\n                        alt={this.name || ''}\n                    />\n                )}\n                {showInitials && (\n                    <svg\n                        viewBox=\"0 0 100 100\"\n                        preserveAspectRatio=\"xMidYMid meet\"\n                        test-id=\"userInitials\"\n                        class={`avatar-initials size-${computedInitials.length}`}\n                        aria-label={this.name}\n                        aria-hidden={!this.name && 'true'}\n                    >\n                        <text\n                            x=\"50\"\n                            y=\"50\"\n                            dominant-baseline=\"central\"\n                            text-anchor=\"middle\"\n                            aria-hidden=\"true\"\n                        >\n                            {computedInitials}\n                        </text>\n                    </svg>\n                )}\n                {showFallback && (\n                    <div\n                        test-id=\"fallbackIcon\"\n                        class=\"fallback\"\n                    >\n                        <q2-icon type={this.icon}></q2-icon>\n                    </div>\n                )}\n            </div>\n        );\n    }\n}\n"],"mappings":"kDAAA,MAAMA,EAAc,oyFACpB,MAAAC,EAAeD,E,MCEFE,EAAQ,M,yBA4BjBC,KAAAC,QAAU,KACND,KAAKE,OAAS,IAAI,EAGtBF,KAAAG,OAAS,KACLH,KAAKI,SAAW,IAAI,E,UA/BD,S,2EAiBI,M,cACE,K,CAI7B,YAAAC,GACIL,KAAKE,OAAS,K,CAWlB,oBAAII,GACA,MAAMC,SAAEA,EAAQC,KAAEA,GAASR,KAC3B,IAAKO,IAAaC,EAAM,OAExB,IAAIC,EAAS,GACb,GAAIF,EAAU,CACVE,EAASF,EAASG,OAAO,EAAG,E,MACzB,GAAIF,EAAM,CACb,MAAMG,EAAQH,EAAKI,MAAM,KACzB,MAAMC,EAAiBF,EAAM,GAAG,GAChC,MAAMG,EAAgBH,EAAMI,OAAS,EAAIJ,EAAMA,EAAMI,OAAS,GAAG,GAAKC,UACtEP,GAAUI,EACV,GAAIC,EAAeL,GAAUK,C,CAGjCL,EAASA,IAAM,MAANA,SAAM,SAANA,EAAQQ,cAEjB,OAAOR,C,CAGX,MAAAS,GACI,MAAMZ,iBAAEA,GAAqBN,KAC7B,MAAMmB,EAAUnB,KAAKoB,MAAQpB,KAAKE,OAClC,MAAME,EAAWJ,KAAKI,SACtB,MAAMiB,GAAgBrB,KAAKQ,MAAQR,KAAKO,aAAeP,KAAKoB,KAAOpB,KAAKE,QACxE,MAAMoB,GAAgBtB,KAAKQ,OAASR,KAAKO,YAAcP,KAAKoB,KAAOpB,KAAKE,QAExE,OACIqB,EAAA,OAAAC,IAAA,4CACKL,GACGI,EAAA,OAAAC,IAAA,2CACIC,MAAOrB,EAAW,aAAe,qBAAoB,UAC7C,YACRgB,IAAKpB,KAAKoB,IACVnB,QAASD,KAAKC,QACdE,OAAQH,KAAKG,OACbuB,IAAK1B,KAAKQ,MAAQ,KAGzBa,GACGE,EAAA,OAAAC,IAAA,2CACIG,QAAQ,cACRC,oBAAoB,gBAAe,UAC3B,eACRH,MAAO,wBAAwBnB,EAAiBS,SAAQ,aAC5Cf,KAAKQ,KAAI,eACPR,KAAKQ,MAAQ,QAE3Be,EAAA,QAAAC,IAAA,2CACIK,EAAE,KACFC,EAAE,KAAI,oBACY,UAAS,cACf,SAAQ,cACR,QAEXxB,IAIZgB,GACGC,EAAA,OAAAC,IAAA,qDACY,eACRC,MAAM,YAENF,EAAA,WAAAC,IAAA,2CAASO,KAAM/B,KAAKgC,Q"}

package/dist/q2-tecton-elements/{p-1954ab7d.entry.js → p-b3322f94.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as t,g as a,F as e}from"./p-a5f18e27.js";const o="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block}.badge-wrapper{--comp-badge-background:var(--tct-badge-background, var(--t-gray8, #61c4ff));--comp-badge-color:var(--tct-badge-color, var(--t-base, #ffffff));--comp-badge-border-style:var(--tct-badge-border-style, solid);--comp-badge-border-color:var(--tct-badge-border-color, var(--t-secondary-l1, #9a9898))}:host([status=info]) .badge-wrapper{--comp-badge-background:var(--tct-badge-info-background, var(--const-stoplight-info, #0079c1));--comp-badge-color:var(--tct-badge-info-color, var(--const-stoplight-info-text, #ffffff));--comp-badge-border-color:var(--tct-badge-info-border-color, var(--const-stoplight-info-l1, #3a9bd6))}:host([status=alert]) .badge-wrapper{--comp-badge-background:var(--tct-badge-alert-background, var(--const-stoplight-alert, #d20a0a));--comp-badge-color:var(--tct-badge-alert-color, var(--const-stoplight-alert-text, #ffffff));--comp-badge-border-color:var(--tct-badge-alert-border-color, var(--const-stoplight-alert-l1, #e42929))}:host([status=warning]) .badge-wrapper{--comp-badge-background:var(--tct-badge-warning-background, var(--const-stoplight-warning, #c35500));--comp-badge-color:var(--tct-badge-warning-color, var(--const-stoplight-warning-text, #423535));--comp-badge-border-color:var(--tct-badge-warning-border-color, var(--const-stoplight-warning-l1, #f9ce4c))}:host([status=success]) .badge-wrapper{--comp-badge-background:var(--tct-badge-success-background, var(--const-stoplight-success, #57fc45));--comp-badge-color:var(--tct-badge-success-color, var(--const-stoplight-success-text, #ffffff));--comp-badge-border-color:var(--tct-badge-success-border-color, var(--const-stoplight-success-l1, #2eaa21))}:host([theme=primary]) .badge-wrapper{--comp-badge-background:var(--tct-badge-primary-background, var(--t-primary, #0079c2));--comp-badge-color:var(--tct-badge-primary-color, var(--t-primary-text, #ffffff));--comp-badge-border-color:var(--tct-badge-primary-border-color, var(--t-primary-l1, #3a9bd6))}:host([theme=secondary]) .badge-wrapper{--comp-badge-background:var(--tct-badge-secondary-background, var(--t-secondary, #b4c2cd));--comp-badge-color:var(--tct-badge-secondary-color, var(--t-secondary-text, #ffffff));--comp-badge-border-color:var(--tct-badge-secondary-border-color, var(--t-secondary-l1, #c6d1db))}:host([theme=tertiary]) .badge-wrapper{--comp-badge-background:var(--tct-badge-tertiary-background, var(--t-tertiary, #e9f5fc));--comp-badge-color:var(--tct-badge-tertiary-color, var(--t-tertiary-text, #000000));--comp-badge-border-color:var(--tct-badge-tertiary-border-color, var(--t-tertiary-l1, #f3f4f5))}.badge{font-size:var(--tct-badge-font-size, 10px);line-height:var(--tct-badge-line-height, 14px);height:var(--tct-badge-height, 16px);min-width:var(--tct-badge-min-width, 16px);text-align:center;padding:var(--tct-badge-padding, 0 4px);color:var(--comp-badge-color);background:var(--comp-badge-background);border-style:var(--comp-badge-border-style);border-color:var(--comp-badge-border-color);border-width:var(--tct-badge-border-width, var(--t-badge-border-width, 1px));border-radius:var(--tct-badge-border-radius, var(--t-badge-border-radius, 8px))}.badge.size-large{font-size:var(--tct-badge-large-font-size, 14px);line-height:var(--tct-badge-large-line-height, 20px);height:var(--tct-badge-large-height, 22px);min-width:var(--tct-badge-large-min-width, 22px);border-radius:var(--tct-badge-large-border-radius, 11px);padding:var(--tct-badge-large-padding, 0 6px)}.badge-wrapper{display:flex;align-items:center;justify-content:center}";const d=o;const c=class{constructor(t){r(this,t);this.maxLength=undefined;this.size=undefined;this.status=undefined;this.theme=undefined;this.value=0}get badgeText(){if(this.hostElement.textContent.trim())return this.hostElement.textContent.trim();const r=Math.pow(10,this.maxLength||2)-1;let t=this.value||0;if(isNaN(t)||t<=0){t=""}else if(t<=r){t=Number(t).toLocaleString()}else{t=Number(r).toLocaleString()+"+"}return t}render(){const r=["badge"];if(this.size==="large")r.push("size-large");return!this.badgeText?t(e,null):t("div",{class:"badge-wrapper"},t("div",{class:r.join(" ")},t("span",{class:"badge-text"},t("slot",null,this.badgeText))))}get hostElement(){return a(this)}};c.style=d;export{c as q2_badge};
-//# sourceMappingURL=p-1954ab7d.entry.js.map
+import{r,h as t,g as a,F as e}from"./p-a5f18e27.js";const o="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block}.badge-wrapper{--comp-badge-background:var(--tct-badge-background, var(--t-gray8, #61c4ff));--comp-badge-color:var(--tct-badge-color, var(--t-base, #ffffff));--comp-badge-border-style:var(--tct-badge-border-style, solid);--comp-badge-border-color:var(--tct-badge-border-color, var(--t-secondary-l1, #9a9898))}:host([status=info]) .badge-wrapper{--comp-badge-background:var(--tct-badge-info-background, var(--const-stoplight-info, #0079c1));--comp-badge-color:var(--tct-badge-info-color, var(--const-stoplight-info-text, #ffffff));--comp-badge-border-color:var(--tct-badge-info-border-color, var(--const-stoplight-info-l1, #3a9bd6))}:host([status=alert]) .badge-wrapper{--comp-badge-background:var(--tct-badge-alert-background, var(--const-stoplight-alert, #d20a0a));--comp-badge-color:var(--tct-badge-alert-color, var(--const-stoplight-alert-text, #ffffff));--comp-badge-border-color:var(--tct-badge-alert-border-color, var(--const-stoplight-alert-l1, #e42929))}:host([status=warning]) .badge-wrapper{--comp-badge-background:var(--tct-badge-warning-background, var(--const-stoplight-warning, #c35500));--comp-badge-color:var(--tct-badge-warning-color, var(--const-stoplight-warning-text, #423535));--comp-badge-border-color:var(--tct-badge-warning-border-color, var(--const-stoplight-warning-l1, #f9ce4c))}:host([status=success]) .badge-wrapper{--comp-badge-background:var(--tct-badge-success-background, var(--const-stoplight-success, #57fc45));--comp-badge-color:var(--tct-badge-success-color, var(--const-stoplight-success-text, #ffffff));--comp-badge-border-color:var(--tct-badge-success-border-color, var(--const-stoplight-success-l1, #2eaa21))}:host([theme=primary]) .badge-wrapper{--comp-badge-background:var(--tct-badge-primary-background, var(--t-primary, #0079c2));--comp-badge-color:var(--tct-badge-primary-color, var(--t-primary-text, #ffffff));--comp-badge-border-color:var(--tct-badge-primary-border-color, var(--t-primary-l1, #3a9bd6))}:host([theme=secondary]) .badge-wrapper{--comp-badge-background:var(--tct-badge-secondary-background, var(--t-secondary, #b4c2cd));--comp-badge-color:var(--tct-badge-secondary-color, var(--t-secondary-text, #ffffff));--comp-badge-border-color:var(--tct-badge-secondary-border-color, var(--t-secondary-l1, #c6d1db))}:host([theme=tertiary]) .badge-wrapper{--comp-badge-background:var(--tct-badge-tertiary-background, var(--t-tertiary, #e9f5fc));--comp-badge-color:var(--tct-badge-tertiary-color, var(--t-tertiary-text, #000000));--comp-badge-border-color:var(--tct-badge-tertiary-border-color, var(--t-tertiary-l1, #f3f4f5))}.badge{font-size:var(--tct-badge-font-size, 10px);line-height:var(--tct-badge-line-height, 14px);height:var(--tct-badge-height, 16px);min-width:var(--tct-badge-min-width, 16px);text-align:center;padding:var(--tct-badge-padding, 0 4px);color:var(--comp-badge-color);background:var(--comp-badge-background);border-style:var(--comp-badge-border-style);border-color:var(--comp-badge-border-color);border-width:var(--tct-badge-border-width, var(--t-badge-border-width, 1px));border-radius:var(--tct-badge-border-radius, var(--t-badge-border-radius, 8px))}.badge.size-large{font-size:var(--tct-badge-large-font-size, 14px);line-height:var(--tct-badge-large-line-height, 20px);height:var(--tct-badge-large-height, 22px);min-width:var(--tct-badge-large-min-width, 22px);border-radius:var(--tct-badge-large-border-radius, 11px);padding:var(--tct-badge-large-padding, 0 6px)}.badge-wrapper{display:flex;align-items:center;justify-content:center}";const d=o;const c=class{constructor(t){r(this,t);this.maxLength=undefined;this.size=undefined;this.status=undefined;this.theme=undefined;this.value=0}get badgeText(){const r=Math.pow(10,this.maxLength||2)-1;let t=this.value||0;if(isNaN(t)||t<=0){t=""}else if(t<=r){t=Number(t).toLocaleString()}else{t=Number(r).toLocaleString()+"+"}return t}get hasSlot(){return!!this.hostElement.innerHTML.trim()}render(){const r=["badge"];if(this.size==="large")r.push("size-large");return!this.badgeText&&!this.hasSlot?t(e,null):t("div",{class:"badge-wrapper"},t("div",{class:r.join(" ")},t("span",{class:"badge-text"},this.hasSlot?t("slot",null):this.badgeText)))}get hostElement(){return a(this)}};c.style=d;export{c as q2_badge};
+//# sourceMappingURL=p-b3322f94.entry.js.map

package/dist/q2-tecton-elements/p-b3322f94.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2BadgeCss","Q2BadgeStyle0","Q2Badge","badgeText","maxValue","Math","pow","this","maxLength","value","isNaN","Number","toLocaleString","hasSlot","hostElement","innerHTML","trim","render","badgeClass","size","push","h","Fragment","class","join"],"sources":["src/components/q2-badge/q2-badge.scss?tag=q2-badge&encapsulation=shadow","src/components/q2-badge/q2-badge.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: inline-block;\n}\n\n.badge-wrapper {\n    --comp-badge-background: #{var-list(--tct-badge-background, --t-gray8, #61c4ff)};\n    --comp-badge-color: #{var-list(--tct-badge-color, --t-base, #ffffff)};\n    --comp-badge-border-style: #{var-list(--tct-badge-border-style, solid)};\n    --comp-badge-border-color: #{var-list(--tct-badge-border-color, --t-secondary-l1, #9a9898)};\n\n    :host([status='info']) & {\n        --comp-badge-background: #{var-list(--tct-badge-info-background, --const-stoplight-info, #0079c1)};\n        --comp-badge-color: #{var-list(--tct-badge-info-color, --const-stoplight-info-text, #ffffff)};\n        --comp-badge-border-color: #{var-list(--tct-badge-info-border-color, --const-stoplight-info-l1, #3a9bd6)};\n    }\n\n    :host([status='alert']) & {\n        --comp-badge-background: #{var-list(--tct-badge-alert-background, --const-stoplight-alert, #d20a0a)};\n        --comp-badge-color: #{var-list(--tct-badge-alert-color, --const-stoplight-alert-text, #ffffff)};\n        --comp-badge-border-color: #{var-list(--tct-badge-alert-border-color, --const-stoplight-alert-l1, #e42929)};\n    }\n\n    :host([status='warning']) & {\n        --comp-badge-background: #{var-list(--tct-badge-warning-background, --const-stoplight-warning, #c35500)};\n        --comp-badge-color: #{var-list(--tct-badge-warning-color, --const-stoplight-warning-text, #423535)};\n        --comp-badge-border-color: #{var-list(--tct-badge-warning-border-color, --const-stoplight-warning-l1, #f9ce4c)};\n    }\n\n    :host([status='success']) & {\n        --comp-badge-background: #{var-list(--tct-badge-success-background, --const-stoplight-success, #57fc45)};\n        --comp-badge-color: #{var-list(--tct-badge-success-color, --const-stoplight-success-text, #ffffff)};\n        --comp-badge-border-color: #{var-list(--tct-badge-success-border-color, --const-stoplight-success-l1, #2eaa21)};\n    }\n\n    :host([theme='primary']) & {\n        --comp-badge-background: #{var-list(--tct-badge-primary-background, --t-primary, #0079c2)};\n        --comp-badge-color: #{var-list(--tct-badge-primary-color, --t-primary-text, #ffffff)};\n        --comp-badge-border-color: #{var-list(--tct-badge-primary-border-color, --t-primary-l1, #3a9bd6)};\n    }\n\n    :host([theme='secondary']) & {\n        --comp-badge-background: #{var-list(--tct-badge-secondary-background, --t-secondary, #b4c2cd)};\n        --comp-badge-color: #{var-list(--tct-badge-secondary-color, --t-secondary-text, #ffffff)};\n        --comp-badge-border-color: #{var-list(--tct-badge-secondary-border-color, --t-secondary-l1, #c6d1db)};\n    }\n\n    :host([theme='tertiary']) & {\n        --comp-badge-background: #{var-list(--tct-badge-tertiary-background, --t-tertiary, #e9f5fc)};\n        --comp-badge-color: #{var-list(--tct-badge-tertiary-color, --t-tertiary-text, #000000)};\n        --comp-badge-border-color: #{var-list(--tct-badge-tertiary-border-color, --t-tertiary-l1, #f3f4f5)};\n    }\n}\n\n.badge {\n    font-size: var-list(--tct-badge-font-size, 10px);\n    line-height: var-list(--tct-badge-line-height, 14px);\n    height: var-list(--tct-badge-height, 16px);\n    min-width: var-list(--tct-badge-min-width, 16px);\n    text-align: center;\n    padding: var-list(--tct-badge-padding, unquote('0 4px'));\n    color: var(--comp-badge-color);\n    background: var(--comp-badge-background);\n    border-style: var(--comp-badge-border-style);\n    border-color: var(--comp-badge-border-color);\n    border-width: var-list(var-prefixer(badge-border-width), 1px);\n    border-radius: var-list(var-prefixer(badge-border-radius), 8px);\n}\n\n.badge.size-large {\n    font-size: var-list(--tct-badge-large-font-size, 14px);\n    line-height: var-list(--tct-badge-large-line-height, 20px);\n    height: var-list(--tct-badge-large-height, 22px);\n    min-width: var-list(--tct-badge-large-min-width, 22px);\n    border-radius: var-list(--tct-badge-large-border-radius, 11px);\n    padding: var-list(--tct-badge-large-padding, unquote('0 6px'));\n}\n\n.badge-wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n","// import { hasSlotContent } from 'src/utils';\nimport { Component, Prop, h, ComponentInterface, Element, Fragment } from '@stencil/core';\n\n@Component({ tag: 'q2-badge', shadow: true, styleUrl: 'q2-badge.scss' })\nexport class Q2Badge implements ComponentInterface {\n    /** The number of digits to show. */\n    @Prop({ reflect: true }) maxLength: number | undefined;\n\n    /** The size of the badge. */\n    @Prop({ reflect: true }) size: 'default' | 'large' | undefined;\n\n    /** The stoplight color of the element when `theme` is not present. */\n    @Prop({ reflect: true }) status: 'info' | 'alert' | 'warning' | 'success' | undefined;\n\n    /**\n     * The color of the badge when in the active state.\n     * The `theme` has higher priority than `status`.\n     */\n    @Prop({ reflect: true }) theme: 'primary' | 'secondary' | 'tertiary' | undefined;\n\n    /** The number to display in the badge. `q2-badge` also allows slot HTML elements which can be any string. */\n    @Prop({ reflect: true }) value: number = 0;\n\n    @Element() hostElement: HTMLElement;\n\n    get badgeText(): string {\n        const maxValue = Math.pow(10, this.maxLength || 2) - 1;\n        let value: string | number = this.value || 0;\n        if (isNaN(value) || value <= 0) {\n            value = '';\n        } else if (value <= maxValue) {\n            value = Number(value).toLocaleString();\n        } else {\n            value = Number(maxValue).toLocaleString() + '+';\n        }\n        return value;\n    }\n\n    get hasSlot(): boolean {\n        return !!this.hostElement.innerHTML.trim();\n    }\n\n    render() {\n        const badgeClass = ['badge'];\n        if (this.size === 'large') badgeClass.push('size-large');\n        return !this.badgeText && !this.hasSlot ? (\n            <Fragment />\n        ) : (\n            <div class=\"badge-wrapper\">\n                <div class={badgeClass.join(' ')}>\n                    <span class=\"badge-text\">{this.hasSlot ? <slot></slot> : this.badgeText}</span>\n                </div>\n            </div>\n        );\n    }\n}\n"],"mappings":"oDAAA,MAAMA,EAAa,0mIACnB,MAAAC,EAAeD,E,MCGFE,EAAO,M,4HAiByB,C,CAIzC,aAAIC,GACA,MAAMC,EAAWC,KAAKC,IAAI,GAAIC,KAAKC,WAAa,GAAK,EACrD,IAAIC,EAAyBF,KAAKE,OAAS,EAC3C,GAAIC,MAAMD,IAAUA,GAAS,EAAG,CAC5BA,EAAQ,E,MACL,GAAIA,GAASL,EAAU,CAC1BK,EAAQE,OAAOF,GAAOG,gB,KACnB,CACHH,EAAQE,OAAOP,GAAUQ,iBAAmB,G,CAEhD,OAAOH,C,CAGX,WAAII,GACA,QAASN,KAAKO,YAAYC,UAAUC,M,CAGxC,MAAAC,GACI,MAAMC,EAAa,CAAC,SACpB,GAAIX,KAAKY,OAAS,QAASD,EAAWE,KAAK,cAC3C,OAAQb,KAAKJ,YAAcI,KAAKM,QAC5BQ,EAACC,EAAQ,MAETD,EAAA,OAAKE,MAAM,iBACPF,EAAA,OAAKE,MAAOL,EAAWM,KAAK,MACxBH,EAAA,QAAME,MAAM,cAAchB,KAAKM,QAAUQ,EAAA,aAAgBd,KAAKJ,Y"}

package/dist/q2-tecton-elements/{p-79cd6ab5.entry.js → p-b376c111.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,F as s,g as i}from"./p-a5f18e27.js";import{d as n}from"./p-be430cd5.js";const a="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline}";const r=a;const o=class{constructor(t){e(this,t);this.syncTimer=null;this.trimSuffix=false;this.baseDate=undefined;this.locale=document.documentElement.lang||"en-US";this.messageFormat="short";this.numeric="auto";this.sync=true;this.date=undefined;this.unit=undefined;this.displayedMessage=undefined}componentWillLoad(){this.updateMessage()}connectedCallback(){this.syncUpdated()}disconnectedCallback(){window.clearInterval(this.syncTimer);this.syncTimer=null}get shouldShow(){return!!this.displayedMessage}get validDate(){const e=new Date(this.date);return n.isValid(e)}get handleDate(){if(!this.validDate)console.warn("Error: Invalid date provided to q2-relative-time.");return new Date(this.date)}get validBaseDate(){const e=new Date(this.baseDate);return n.isValid(e)}get handleBaseDate(){if(this.validBaseDate){this.trimSuffix=true;this.sync=false;return new Date(this.baseDate)}else{this.trimSuffix=false;this.sync=true;return new Date}}get isValidUnit(){if(["second","minute","hour","day","month","quarter","year"].includes(this.unit))return true;return false}get handleNumeric(){if(this.validBaseDate)return"always";return this.numeric}syncUpdated(){if(this.sync){this.syncTimer=window.setInterval((()=>{this.updateMessage()}),1e3)}else{window.clearInterval(this.syncTimer);this.syncTimer=null}}updateMessage(){const{validDate:e,handleDate:t,handleBaseDate:s,locale:i,handleNumeric:a,messageFormat:r,isValidUnit:o,unit:d,trimSuffix:h}=this;if(!e){this.sync=false;this.displayedMessage="Invalid Date Provided";return}const l=n.intlFormatDistance(new Date(t),new Date(s),{locale:i,localeMatcher:"best fit",numeric:a,style:r,unit:o?d:null});if(h){this.displayedMessage=this.trimMessage(l)}else{this.displayedMessage=l}}trimMessage(e){return e.replace(/^in\s?/,"").replace(/\sago$/,"")}async displayedMessageValue(){return this.displayedMessage}render(){const{shouldShow:e,displayedMessage:i}=this;return t(s,{key:"dd7a52aa76dc9326d95870ad16d73e8f3c1d59b4"},e?t("time",{dateTime:i},i):null)}get hostElement(){return i(this)}static get watchers(){return{sync:["syncUpdated"],messageFormat:["updateMessage"],locale:["updateMessage"],date:["updateMessage"],baseDate:["updateMessage"],numeric:["updateMessage"],unit:["updateMessage"]}}};o.style=r;export{o as q2_relative_time};
-//# sourceMappingURL=p-79cd6ab5.entry.js.map
+import{r as e,h as t,F as s,g as i}from"./p-a5f18e27.js";import{d as n}from"./p-7ce6e587.js";const a="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline}";const r=a;const o=class{constructor(t){e(this,t);this.syncTimer=null;this.trimSuffix=false;this.baseDate=undefined;this.locale=document.documentElement.lang||"en-US";this.messageFormat="short";this.numeric="auto";this.sync=true;this.date=undefined;this.unit=undefined;this.displayedMessage=undefined}componentWillLoad(){this.updateMessage()}connectedCallback(){this.syncUpdated()}disconnectedCallback(){window.clearInterval(this.syncTimer);this.syncTimer=null}get shouldShow(){return!!this.displayedMessage}get validDate(){const e=new Date(this.date);return n.isValid(e)}get handleDate(){if(!this.validDate)console.warn("Error: Invalid date provided to q2-relative-time.");return new Date(this.date)}get validBaseDate(){const e=new Date(this.baseDate);return n.isValid(e)}get handleBaseDate(){if(this.validBaseDate){this.trimSuffix=true;this.sync=false;return new Date(this.baseDate)}else{this.trimSuffix=false;this.sync=true;return new Date}}get isValidUnit(){if(["second","minute","hour","day","month","quarter","year"].includes(this.unit))return true;return false}get handleNumeric(){if(this.validBaseDate)return"always";return this.numeric}syncUpdated(){if(this.sync){this.syncTimer=window.setInterval((()=>{this.updateMessage()}),1e3)}else{window.clearInterval(this.syncTimer);this.syncTimer=null}}updateMessage(){const{validDate:e,handleDate:t,handleBaseDate:s,locale:i,handleNumeric:a,messageFormat:r,isValidUnit:o,unit:d,trimSuffix:h}=this;if(!e){this.sync=false;this.displayedMessage="Invalid Date Provided";return}const l=n.intlFormatDistance(new Date(t),new Date(s),{locale:i,localeMatcher:"best fit",numeric:a,style:r,unit:o?d:null});if(h){this.displayedMessage=this.trimMessage(l)}else{this.displayedMessage=l}}trimMessage(e){return e.replace(/^in\s?/,"").replace(/\sago$/,"")}async displayedMessageValue(){return this.displayedMessage}render(){const{shouldShow:e,displayedMessage:i}=this;return t(s,{key:"e9d882c872bd92a7d74171ca050b0afec7ecbecc"},e?t("time",{dateTime:i},i):null)}get hostElement(){return i(this)}static get watchers(){return{sync:["syncUpdated"],messageFormat:["updateMessage"],locale:["updateMessage"],date:["updateMessage"],baseDate:["updateMessage"],numeric:["updateMessage"],unit:["updateMessage"]}}};o.style=r;export{o as q2_relative_time};
+//# sourceMappingURL=p-b376c111.entry.js.map

package/dist/q2-tecton-elements/{p-25eccf38.entry.js → p-b3d10d52.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,g as n}from"./p-a5f18e27.js";import{n as a,o,i as s,l as r}from"./p-5c46acb8.js";const c="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{text-align:right;display:block;width:100%}:host([hidden]){display:none}.container{display:inline-flex;column-gap:var(--tct-pagination-column-gap, var(--t-pagination-column-gap, var(--app-scale-2x, 10px)));align-items:center;height:var(--tct-pagination-height, var(--t-pagination-height, 44px))}.btn-group{display:flex;gap:var(--tct-pagination-btn-gap, var(--t-pagination-btn-gap, 0))}.description,.controls{white-space:nowrap}.controls{display:grid;grid-template-columns:auto 50px auto;align-items:center;gap:var(--tct-pagination-controls-gap, var(--t-pagination-controls-gap, var(--app-scale-1x, 5px)))}.controls[hidden]{display:none}.input-wrapper{height:var(--tct-pagination-height, var(--t-pagination-height, 44px));display:flex;align-items:center}q2-btn{--tct-btn-border-radius:var(--tct-pagination-btn-border-radius, var(--t-pagination-btn-border-radius));--tct-btn-border:var(--tct-pagination-btn-border, var(--t-pagination-btn-border))}q2-icon{--tct-icon-size:var(--tct-pagination-icon-size, var(--t-pagination-icon-size, 12px));color:var(--tct-pagination-icon-color, var(--t-pagination-icon-color, var(--t-text, #4d4d4d)))}q2-input{--tct-input-margin-top:0;--tct-input-margin-bottom:0;--tct-input-height:var(--tct-pagination-input-height, var(--t-pagination-input-height, 30px));--tct-input-min-height:var(--tct-input-height);--tct-input-align:center}";const d=c;const l=class{constructor(i){t(this,i);this.change=e(this,"change",7);this.handlePageChange=t=>{const{totalPages:e,inputField:i}=this;if(t<1){t=1}else if(t>e){t=e}if(i.value!==`${t}`)i.value=`${t}`;if(!this.hostElement.onchange){this.page=t}this.change.emit({page:t})};this.checkSize=()=>{const{hostElement:t,containerElement:e}=this;const i=this.containerWidth>t.clientWidth;this.isSmall=i;if(i)return;a((()=>{const t=this.containerWidth===e.clientWidth;if(t)return;this.containerWidth=e.clientWidth;this.checkSize()}))};this.autoSize=true;this.total=undefined;this.page=undefined;this.pages=undefined;this.pagesOnly=undefined;this.perPage=undefined;this.recordsOnly=undefined;this.recordType=undefined;this.isSmall=undefined}componentWillLoad(){this.manageResizeObserver()}componentDidLoad(){this.containerWidth=this.containerElement.clientWidth;o(this.hostElement)}disconnectedCallback(){this.removeResizeObserver()}manageResizeObserver(){if(this.autoSize&&!this.recordsOnly&&!this.pagesOnly){if(this.resizeObserver)return;this.resizeObserver=new ResizeObserver((()=>this.checkSize()));this.resizeObserver.observe(this.hostElement);window.addEventListener("resize",this.checkSize)}else{this.isSmall=false;this.removeResizeObserver()}}onHostElementFocus(t){var e;if(!s(t,this.hostElement))return;const{isFullViewHidden:i,containerElement:n,inputField:a}=this;if(i){(e=n.querySelector("q2-btn:not([disabled])"))===null||e===void 0?void 0:e.focus()}else{a.focus()}}get isFullViewHidden(){return this.isSmall||this.recordsOnly||this.pagesOnly}get pageWithDefault(){return this.page||1}get perPageWithDefault(){return this.perPage||10}get totalWithDefault(){return this.total||0}get recordTypeWithDefault(){return this.recordType||r("tecton.element.pagination.defaultRecordType")}get currentRange(){const{perPageWithDefault:t,totalWithDefault:e,pageWithDefault:i}=this;const n=(i-1)*t+1;const a=Math.min(i*t,e);return`${n} - ${a}`}get nextRange(){const{perPageWithDefault:t,totalWithDefault:e,pageWithDefault:i}=this;const n=i*t+1;const a=Math.min((i+1)*t,e);return`${n} - ${a}`}get prevRange(){const{perPageWithDefault:t,pageWithDefault:e}=this;const i=Math.max(1,(e-2)*t+1);const n=(e-1)*t;return`${i} - ${n}`}get totalPages(){const{pagesOnly:t,totalWithDefault:e,perPageWithDefault:i,pages:n}=this;if(t&&n&&!isNaN(parseInt(`${n}`)))return n;return Math.ceil(e/i)}removeResizeObserver(){var t;if(this.resizeObserver){(t=this.resizeObserver)===null||t===void 0?void 0:t.unobserve(this.hostElement);this.resizeObserver=null;window.removeEventListener("resize",this.checkSize)}}render(){const{pagesOnly:t,recordsOnly:e,isFullViewHidden:n,recordTypeWithDefault:a,totalPages:o,totalWithDefault:s,pageWithDefault:c,currentRange:d,nextRange:l,prevRange:h}=this;const p=c===1;const g=c===o;let b="";let f="";if(t){f=r("tecton.element.pagination.goToPages",{next:c-1,total:o});b=r("tecton.element.pagination.goToPages",{next:c+1,total:o})}else if(e){f=r("tecton.element.pagination.goToRecords",{range:h,recordType:a.toLowerCase(),total:s});b=r("tecton.element.pagination.goToRecords",{range:l,recordType:a.toLowerCase(),total:s})}return i("nav",{key:"96bcb9c4a977162f1a3cf086ad71052a040fbc02",class:"container",ref:t=>this.containerElement=t,"aria-label":r("tecton.element.pagination.title")},i("div",{key:"885ec8867dcfe56fcec401e3af167dcecc33b70f",class:"description","test-id":"description"},t?r("tecton.element.pagination.pages",{current:c,total:o}):r("tecton.element.pagination.description",{range:d,recordType:a.toLowerCase(),total:s.toLocaleString()})),i("div",{key:"aaaffc1971d83c47f71dc7f576043bb269589dd6",class:"btn-group"},i("q2-btn",{key:"dbc5c9cdcc90be091cbdc24fef330b4e83f84723",label:r("tecton.element.pagination.goToFirstPage"),disabled:p,hidden:n,onClick:()=>this.handlePageChange(1),"test-id":"firstPageBtn","hide-label":true},i("q2-icon",{key:"6b61c526965bac728905b20081d1b3fc2ee10d13",type:"chevron-double-left"})),i("q2-btn",{key:"4156c64395f16f7c4c6ca7928f5dc50ba20007dc",label:f,disabled:p,onClick:()=>this.handlePageChange(c-1),"test-id":"prevPageBtn","hide-label":true},i("q2-icon",{key:"bdb78a15f9852087531947b93e96e1b3c5518ff2",type:"chevron-left"}))),i("div",{key:"f655f178bbbd3b41c43ca4f68442c59c8f3f0674",class:"controls",hidden:n,"test-id":"controls"},i("span",{key:"60afc8c8bd8805bf38813b73c75fb260abe8deb4","aria-hidden":"true"},r("tecton.element.pagination.page")),i("div",{key:"7ab2d59e80533d82739fc53d98416305cbe365c9",class:"input-wrapper",onClick:()=>this.inputField.dispatchEvent(new FocusEvent("focus"))},i("q2-input",{key:"943e3b3a74853ec57b4939e897ad2d2296d875be",type:"number",value:`${c}`,min:1,max:this.totalPages,hideLabel:true,optional:true,label:`${r("tecton.element.pagination.page")} (${r("tecton.element.pagination.ofPages",[o.toLocaleString()])})`,onChange:t=>this.handlePageChange(t.detail.value),"test-id":"pageInput",current:"page",ref:t=>this.inputField=t})),i("span",{key:"e5da3d0850ec40c8123ec39bb3992260bf6001fc","aria-hidden":"true"},r("tecton.element.pagination.ofPages",[o.toLocaleString()]))),i("div",{key:"7ecaaedfdb80f3fb45c5ae74da0811f88797ab2c",class:"btn-group"},i("q2-btn",{key:"76aaadc41047bda4ff909eaa7269c6b00826cef9",label:b,disabled:g,onClick:()=>this.handlePageChange(c+1),"test-id":"nextPageBtn","hide-label":true},i("q2-icon",{key:"3c2a3ecd6d8f75391a2200c6e4ee69be1fbaa6ad",type:"chevron-right"})),i("q2-btn",{key:"433de5183eb6c4350a886c691c813ab8e709a64d",label:"tecton.element.pagination.goToLastPage",disabled:g,hidden:n,onClick:()=>this.handlePageChange(o),"test-id":"lastPageBtn","hide-label":true},i("q2-icon",{key:"48bf23391120c809d793b8a48c6de128b12ac75d",type:"chevron-double-right"}))))}get hostElement(){return n(this)}static get watchers(){return{recordsOnly:["manageResizeObserver"],pagesOnly:["manageResizeObserver"],autoSize:["manageResizeObserver"]}}};l.style=d;export{l as q2_pagination};
-//# sourceMappingURL=p-25eccf38.entry.js.map
+import{r as t,c as e,h as i,g as n}from"./p-a5f18e27.js";import{n as a,o,i as s,l as r}from"./p-42302f6f.js";const c="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{text-align:right;display:block;width:100%}:host([hidden]){display:none}.container{display:inline-flex;column-gap:var(--tct-pagination-column-gap, var(--t-pagination-column-gap, var(--app-scale-2x, 10px)));align-items:center;height:var(--tct-pagination-height, var(--t-pagination-height, 44px))}.btn-group{display:flex;gap:var(--tct-pagination-btn-gap, var(--t-pagination-btn-gap, 0))}.description,.controls{white-space:nowrap}.controls{display:grid;grid-template-columns:auto 50px auto;align-items:center;gap:var(--tct-pagination-controls-gap, var(--t-pagination-controls-gap, var(--app-scale-1x, 5px)))}.controls[hidden]{display:none}.input-wrapper{height:var(--tct-pagination-height, var(--t-pagination-height, 44px));display:flex;align-items:center}q2-btn{--tct-btn-border-radius:var(--tct-pagination-btn-border-radius, var(--t-pagination-btn-border-radius));--tct-btn-border:var(--tct-pagination-btn-border, var(--t-pagination-btn-border))}q2-icon{--tct-icon-size:var(--tct-pagination-icon-size, var(--t-pagination-icon-size, 12px));color:var(--tct-pagination-icon-color, var(--t-pagination-icon-color, var(--t-text, #4d4d4d)))}q2-input{--tct-input-margin-top:0;--tct-input-margin-bottom:0;--tct-input-height:var(--tct-pagination-input-height, var(--t-pagination-input-height, 30px));--tct-input-min-height:var(--tct-input-height);--tct-input-align:center}";const d=c;const l=class{constructor(i){t(this,i);this.change=e(this,"change",7);this.handlePageChange=t=>{const{totalPages:e,inputField:i}=this;if(t<1){t=1}else if(t>e){t=e}if(i.value!==`${t}`)i.value=`${t}`;if(!this.hostElement.onchange){this.page=t}this.change.emit({page:t})};this.checkSize=()=>{const{hostElement:t,containerElement:e}=this;const i=this.containerWidth>t.clientWidth;this.isSmall=i;if(i)return;a((()=>{const t=this.containerWidth===e.clientWidth;if(t)return;this.containerWidth=e.clientWidth;this.checkSize()}))};this.autoSize=true;this.total=undefined;this.page=undefined;this.pages=undefined;this.pagesOnly=undefined;this.perPage=undefined;this.recordsOnly=undefined;this.recordType=undefined;this.isSmall=undefined}componentWillLoad(){this.manageResizeObserver()}componentDidLoad(){this.containerWidth=this.containerElement.clientWidth;o(this.hostElement)}disconnectedCallback(){this.removeResizeObserver()}manageResizeObserver(){if(this.autoSize&&!this.recordsOnly&&!this.pagesOnly){if(this.resizeObserver)return;this.resizeObserver=new ResizeObserver((()=>this.checkSize()));this.resizeObserver.observe(this.hostElement);window.addEventListener("resize",this.checkSize)}else{this.isSmall=false;this.removeResizeObserver()}}onHostElementFocus(t){var e;if(!s(t,this.hostElement))return;const{isFullViewHidden:i,containerElement:n,inputField:a}=this;if(i){(e=n.querySelector("q2-btn:not([disabled])"))===null||e===void 0?void 0:e.focus()}else{a.focus()}}get isFullViewHidden(){return this.isSmall||this.recordsOnly||this.pagesOnly}get pageWithDefault(){return this.page||1}get perPageWithDefault(){return this.perPage||10}get totalWithDefault(){return this.total||0}get recordTypeWithDefault(){return this.recordType||r("tecton.element.pagination.defaultRecordType")}get currentRange(){const{perPageWithDefault:t,totalWithDefault:e,pageWithDefault:i}=this;const n=(i-1)*t+1;const a=Math.min(i*t,e);return`${n} - ${a}`}get nextRange(){const{perPageWithDefault:t,totalWithDefault:e,pageWithDefault:i}=this;const n=i*t+1;const a=Math.min((i+1)*t,e);return`${n} - ${a}`}get prevRange(){const{perPageWithDefault:t,pageWithDefault:e}=this;const i=Math.max(1,(e-2)*t+1);const n=(e-1)*t;return`${i} - ${n}`}get totalPages(){const{pagesOnly:t,totalWithDefault:e,perPageWithDefault:i,pages:n}=this;if(t&&n&&!isNaN(parseInt(`${n}`)))return n;return Math.ceil(e/i)}removeResizeObserver(){var t;if(this.resizeObserver){(t=this.resizeObserver)===null||t===void 0?void 0:t.unobserve(this.hostElement);this.resizeObserver=null;window.removeEventListener("resize",this.checkSize)}}render(){const{pagesOnly:t,recordsOnly:e,isFullViewHidden:n,recordTypeWithDefault:a,totalPages:o,totalWithDefault:s,pageWithDefault:c,currentRange:d,nextRange:l,prevRange:h}=this;const p=c===1;const g=c===o;let u="";let f="";if(t){f=r("tecton.element.pagination.goToPages",{next:c-1,total:o});u=r("tecton.element.pagination.goToPages",{next:c+1,total:o})}else if(e){f=r("tecton.element.pagination.goToRecords",{range:h,recordType:a.toLowerCase(),total:s});u=r("tecton.element.pagination.goToRecords",{range:l,recordType:a.toLowerCase(),total:s})}return i("nav",{key:"74561394c7bdb496d306e959ad5b1e5361e42ec7",class:"container",ref:t=>this.containerElement=t,"aria-label":r("tecton.element.pagination.title")},i("div",{key:"2500a292e1823d4d24136be40a4fa4f9346bc9c8",class:"description","test-id":"description"},t?r("tecton.element.pagination.pages",{current:c,total:o}):r("tecton.element.pagination.description",{range:d,recordType:a.toLowerCase(),total:s.toLocaleString()})),i("div",{key:"653ee492dfd5b7e80d8d1e1eb680364cbdb13f17",class:"btn-group"},i("q2-btn",{key:"512e60ac934efaa54a87862ab81677956d80c7dc",label:r("tecton.element.pagination.goToFirstPage"),disabled:p,hidden:n,onClick:()=>this.handlePageChange(1),"test-id":"firstPageBtn","hide-label":true},i("q2-icon",{key:"7c0c57fbb28c7221467457ced6e2f196f5c0c41a",type:"chevron-double-left"})),i("q2-btn",{key:"5a3ad7135ac650be29b2dcbd0f4e2dd1e0303a14",label:f,disabled:p,onClick:()=>this.handlePageChange(c-1),"test-id":"prevPageBtn","hide-label":true},i("q2-icon",{key:"9955d71cb14f809d7794022aff67c4403dd59e0c",type:"chevron-left"}))),i("div",{key:"b7bbe334d869c527093f50b61419cd680dad7205",class:"controls",hidden:n,"test-id":"controls"},i("span",{key:"778f9842501854d5427f481e02924b2f967f8ec7","aria-hidden":"true"},r("tecton.element.pagination.page")),i("div",{key:"2761c3e8acd7150aba435d86c545e0903482163d",class:"input-wrapper",onClick:()=>this.inputField.dispatchEvent(new FocusEvent("focus"))},i("q2-input",{key:"00e1cfc6c391311920928694844875715ed2fd97",type:"number",value:`${c}`,min:1,max:this.totalPages,hideLabel:true,optional:true,label:`${r("tecton.element.pagination.page")} (${r("tecton.element.pagination.ofPages",[o.toLocaleString()])})`,onChange:t=>this.handlePageChange(t.detail.value),"test-id":"pageInput",current:"page",ref:t=>this.inputField=t})),i("span",{key:"f14e720d12dcf4deb0b1ccf1b290f8ef1b3f9dab","aria-hidden":"true"},r("tecton.element.pagination.ofPages",[o.toLocaleString()]))),i("div",{key:"6acb2c32ca833bdd68fe0e09cee75df7c8abaae3",class:"btn-group"},i("q2-btn",{key:"0ac42aecaf056348a8c2e2729d1e35e7db44750b",label:u,disabled:g,onClick:()=>this.handlePageChange(c+1),"test-id":"nextPageBtn","hide-label":true},i("q2-icon",{key:"f1c87ff1bc99dc529a2e5efdaad614f1b1c4b520",type:"chevron-right"})),i("q2-btn",{key:"2f6d47cc2805f3e9e3215448e5c6ca0909b7ad80",label:"tecton.element.pagination.goToLastPage",disabled:g,hidden:n,onClick:()=>this.handlePageChange(o),"test-id":"lastPageBtn","hide-label":true},i("q2-icon",{key:"88a16778a20430935b7cc5d23393897f426d4548",type:"chevron-double-right"}))))}get hostElement(){return n(this)}static get watchers(){return{recordsOnly:["manageResizeObserver"],pagesOnly:["manageResizeObserver"],autoSize:["manageResizeObserver"]}}};l.style=d;export{l as q2_pagination};
+//# sourceMappingURL=p-b3d10d52.entry.js.map

package/dist/q2-tecton-elements/{p-25eccf38.entry.js.map → p-b3d10d52.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["q2PaginationCss","Q2PaginationStyle0","Q2Pagination","this","handlePageChange","page","totalPages","inputField","value","hostElement","onchange","change","emit","checkSize","containerElement","isOverflowing","containerWidth","clientWidth","isSmall","nextPaint","containerWidthHasNotChanged","componentWillLoad","manageResizeObserver","componentDidLoad","overrideFocus","disconnectedCallback","removeResizeObserver","autoSize","recordsOnly","pagesOnly","resizeObserver","ResizeObserver","observe","window","addEventListener","onHostElementFocus","event","isEventFromElement","isFullViewHidden","_a","querySelector","focus","pageWithDefault","perPageWithDefault","perPage","totalWithDefault","total","recordTypeWithDefault","recordType","loc","currentRange","start","end","Math","min","nextRange","prevRange","max","pages","isNaN","parseInt","ceil","unobserve","removeEventListener","render","onFirstPage","onLastPage","nextButtonLabel","prevButtonLabel","next","range","toLowerCase","h","key","class","ref","el","current","toLocaleString","label","disabled","hidden","onClick","type","dispatchEvent","FocusEvent","hideLabel","optional","onChange","detail"],"sources":["src/components/q2-pagination/q2-pagination.scss?tag=q2-pagination&encapsulation=shadow","src/components/q2-pagination/q2-pagination.tsx"],"sourcesContent":["@import '../../styles/host';\n@import '../../styles/functions';\n\n:host {\n    text-align: right;\n    display: block;\n    width: 100%;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n.container {\n    display: inline-flex;\n    column-gap: var-list(var-prefixer(pagination-column-gap), --app-scale-2x, 10px);\n    align-items: center;\n    height: var-list(var-prefixer(pagination-height), 44px);\n}\n\n.btn-group {\n    display: flex;\n    gap: var-list(var-prefixer(pagination-btn-gap), 0);\n}\n\n.description,\n.controls {\n    white-space: nowrap;\n}\n\n.controls {\n    display: grid;\n    grid-template-columns: auto 50px auto;\n    align-items: center;\n    gap: var-list(var-prefixer(pagination-controls-gap), --app-scale-1x, 5px);\n\n    &[hidden] {\n        display: none;\n    }\n}\n\n.input-wrapper {\n    height: var-list(var-prefixer(pagination-height), 44px);\n    display: flex;\n    align-items: center;\n}\n\nq2-btn {\n    --tct-btn-border-radius: #{var-list(var-prefixer(pagination-btn-border-radius))};\n    --tct-btn-border: #{var-list(var-prefixer(pagination-btn-border))};\n}\n\nq2-icon {\n    --tct-icon-size: #{var-list(var-prefixer(pagination-icon-size), 12px)};\n    color: var-list(var-prefixer(pagination-icon-color), --t-text, #4d4d4d);\n}\n\nq2-input {\n    --tct-input-margin-top: 0;\n    --tct-input-margin-bottom: 0;\n    --tct-input-height: #{var-list(var-prefixer(pagination-input-height), 30px)};\n    --tct-input-min-height: var(--tct-input-height);\n    --tct-input-align: center;\n}\n","import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Watch,\n    Listen,\n    Element,\n    Event,\n    EventEmitter,\n} from '@stencil/core';\nimport { isEventFromElement, loc, nextPaint, overrideFocus } from 'src/utils';\n\n@Component({ tag: 'q2-pagination', shadow: true, styleUrl: 'q2-pagination.scss' })\nexport class Q2Pagination implements ComponentInterface {\n    /** Determines whether the component uses the dynamic resizing behavior. */\n    @Prop({ reflect: true, mutable: true }) autoSize: boolean = true;\n\n    /** The total number of records to paginate. */\n    @Prop({ reflect: true }) total: number;\n\n    /** The current page that is being displayed. */\n    @Prop({ reflect: true, mutable: true }) page: number;\n\n    /**\n     * The number of pages that can be displayed.\n     * @info\n     * Only referenced when `pagesOnly` is true.\n     */\n    @Prop({ reflect: true, mutable: true }) pages: number;\n\n    /** Indicates to only display the current and total pages. */\n    @Prop({ reflect: true, mutable: true }) pagesOnly: boolean;\n\n    /** The total number of records displayed on each page. */\n    @Prop() perPage: number;\n\n    /** Indicates to only display the current and total records. */\n    @Prop({ reflect: true, mutable: true }) recordsOnly: boolean;\n\n    /** Description of the record tupe to be displayed alongside the record count. */\n    @Prop() recordType: string;\n\n    @Element() hostElement: HTMLElement;\n\n    /**\n     * Emitted when the page is changed.\n     * @legacyEvent\n     */\n    @Event() change: EventEmitter<{ page: number }>;\n\n    @State() isSmall: boolean;\n\n    inputField: HTMLQ2InputElement;\n    containerElement: HTMLElement;\n    containerWidth: number;\n    resizeObserver: ResizeObserver;\n\n    ////////// LIFECYCLE HOOKS ////////\n    componentWillLoad(): void {\n        this.manageResizeObserver();\n    }\n\n    componentDidLoad(): void {\n        this.containerWidth = this.containerElement.clientWidth;\n\n        overrideFocus(this.hostElement);\n    }\n\n    disconnectedCallback() {\n        this.removeResizeObserver();\n    }\n\n    ///////// OBSERVERS /////////\n\n    @Watch('recordsOnly')\n    @Watch('pagesOnly')\n    @Watch('autoSize')\n    manageResizeObserver() {\n        if (this.autoSize && !this.recordsOnly && !this.pagesOnly) {\n            if (this.resizeObserver) return;\n            this.resizeObserver = new ResizeObserver(() => this.checkSize());\n            this.resizeObserver.observe(this.hostElement);\n            window.addEventListener('resize', this.checkSize);\n        } else {\n            this.isSmall = false;\n            this.removeResizeObserver();\n        }\n    }\n\n    ///////// HOST ELEMENT EVENTS /////////\n\n    @Listen('focus')\n    onHostElementFocus(event) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        const { isFullViewHidden, containerElement, inputField } = this;\n        if (isFullViewHidden) {\n            containerElement.querySelector<HTMLElement>('q2-btn:not([disabled])')?.focus();\n        } else {\n            inputField.focus();\n        }\n    }\n\n    ///////// GETTERS /////////\n\n    get isFullViewHidden() {\n        return this.isSmall || this.recordsOnly || this.pagesOnly;\n    }\n\n    get pageWithDefault() {\n        return this.page || 1;\n    }\n\n    get perPageWithDefault() {\n        return this.perPage || 10;\n    }\n\n    get totalWithDefault() {\n        return this.total || 0;\n    }\n\n    get recordTypeWithDefault() {\n        return this.recordType || loc('tecton.element.pagination.defaultRecordType');\n    }\n\n    get currentRange() {\n        const { perPageWithDefault: perPage, totalWithDefault: total, pageWithDefault: page } = this;\n        const start = (page - 1) * perPage + 1;\n        const end = Math.min(page * perPage, total);\n        return `${start} - ${end}`;\n    }\n\n    get nextRange() {\n        const { perPageWithDefault: perPage, totalWithDefault: total, pageWithDefault: page } = this;\n        const start = page * perPage + 1;\n        const end = Math.min((page + 1) * perPage, total);\n        return `${start} - ${end}`;\n    }\n\n    get prevRange() {\n        const { perPageWithDefault: perPage, pageWithDefault: page } = this;\n        const start = Math.max(1, (page - 2) * perPage + 1);\n        const end = (page - 1) * perPage;\n        return `${start} - ${end}`;\n    }\n\n    get totalPages() {\n        const { pagesOnly, totalWithDefault: total, perPageWithDefault: perPage, pages } = this;\n\n        if (pagesOnly && pages && !isNaN(parseInt(`${pages}`))) return pages;\n\n        return Math.ceil(total / perPage);\n    }\n\n    ///////// HELPERS /////////\n\n    removeResizeObserver() {\n        if (this.resizeObserver) {\n            this.resizeObserver?.unobserve(this.hostElement);\n            this.resizeObserver = null;\n            window.removeEventListener('resize', this.checkSize);\n        }\n    }\n\n    handlePageChange = (page: number) => {\n        const { totalPages, inputField } = this;\n        if (page < 1) {\n            page = 1;\n        } else if (page > totalPages) {\n            page = totalPages;\n        }\n\n        if (inputField.value !== `${page}`) inputField.value = `${page}`;\n\n        if (!this.hostElement.onchange) {\n            this.page = page;\n        }\n\n        this.change.emit({ page });\n    };\n\n    checkSize = () => {\n        const { hostElement, containerElement } = this;\n        const isOverflowing = this.containerWidth > hostElement.clientWidth;\n        this.isSmall = isOverflowing;\n        if (isOverflowing) return;\n\n        nextPaint(() => {\n            const containerWidthHasNotChanged = this.containerWidth === containerElement.clientWidth;\n            if (containerWidthHasNotChanged) return;\n            this.containerWidth = containerElement.clientWidth;\n            this.checkSize();\n        });\n    };\n\n    render() {\n        const {\n            pagesOnly,\n            recordsOnly,\n            isFullViewHidden,\n            recordTypeWithDefault: recordType,\n            totalPages,\n            totalWithDefault: total,\n            pageWithDefault: page,\n            currentRange,\n            nextRange,\n            prevRange,\n        } = this;\n        const onFirstPage = page === 1;\n        const onLastPage = page === totalPages;\n\n        let nextButtonLabel: string = '';\n        let prevButtonLabel: string = '';\n        if (pagesOnly) {\n            prevButtonLabel = loc('tecton.element.pagination.goToPages', { next: page - 1, total: totalPages });\n            nextButtonLabel = loc('tecton.element.pagination.goToPages', { next: page + 1, total: totalPages });\n        } else if (recordsOnly) {\n            prevButtonLabel = loc('tecton.element.pagination.goToRecords', {\n                range: prevRange,\n                recordType: recordType.toLowerCase(),\n                total,\n            });\n            nextButtonLabel = loc('tecton.element.pagination.goToRecords', {\n                range: nextRange,\n                recordType: recordType.toLowerCase(),\n                total,\n            });\n        }\n\n        return (\n            <nav\n                class=\"container\"\n                ref={el => (this.containerElement = el)}\n                aria-label={loc('tecton.element.pagination.title')}\n            >\n                <div\n                    class=\"description\"\n                    test-id=\"description\"\n                >\n                    {pagesOnly\n                        ? loc('tecton.element.pagination.pages', {\n                              current: page,\n                              total: totalPages,\n                          })\n                        : loc('tecton.element.pagination.description', {\n                              range: currentRange,\n                              recordType: recordType.toLowerCase(),\n                              total: total.toLocaleString(),\n                          })}\n                </div>\n                <div class=\"btn-group\">\n                    <q2-btn\n                        label={loc('tecton.element.pagination.goToFirstPage')}\n                        disabled={onFirstPage}\n                        hidden={isFullViewHidden}\n                        onClick={() => this.handlePageChange(1)}\n                        test-id=\"firstPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-double-left\" />\n                    </q2-btn>\n                    <q2-btn\n                        label={prevButtonLabel}\n                        disabled={onFirstPage}\n                        onClick={() => this.handlePageChange(page - 1)}\n                        test-id=\"prevPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-left\" />\n                    </q2-btn>\n                </div>\n                <div\n                    class=\"controls\"\n                    hidden={isFullViewHidden}\n                    test-id=\"controls\"\n                >\n                    <span aria-hidden=\"true\">{loc('tecton.element.pagination.page')}</span>\n                    <div\n                        class=\"input-wrapper\"\n                        onClick={() => this.inputField.dispatchEvent(new FocusEvent('focus'))}\n                    >\n                        <q2-input\n                            type=\"number\"\n                            value={`${page}`}\n                            min={1}\n                            max={this.totalPages}\n                            hideLabel\n                            optional\n                            label={`${loc('tecton.element.pagination.page')} (${loc(\n                                'tecton.element.pagination.ofPages',\n                                [totalPages.toLocaleString()]\n                            )})`}\n                            onChange={event => this.handlePageChange(event.detail.value)}\n                            test-id=\"pageInput\"\n                            current=\"page\"\n                            ref={el => (this.inputField = el)}\n                        ></q2-input>\n                    </div>\n                    <span aria-hidden=\"true\">\n                        {loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()])}\n                    </span>\n                </div>\n                <div class=\"btn-group\">\n                    <q2-btn\n                        label={nextButtonLabel}\n                        disabled={onLastPage}\n                        onClick={() => this.handlePageChange(page + 1)}\n                        test-id=\"nextPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-right\" />\n                    </q2-btn>\n                    <q2-btn\n                        label=\"tecton.element.pagination.goToLastPage\"\n                        disabled={onLastPage}\n                        hidden={isFullViewHidden}\n                        onClick={() => this.handlePageChange(totalPages)}\n                        test-id=\"lastPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-double-right\" />\n                    </q2-btn>\n                </div>\n            </nav>\n        );\n    }\n}\n"],"mappings":"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"}
+{"version":3,"names":["q2PaginationCss","Q2PaginationStyle0","Q2Pagination","this","handlePageChange","page","totalPages","inputField","value","hostElement","onchange","change","emit","checkSize","containerElement","isOverflowing","containerWidth","clientWidth","isSmall","nextPaint","containerWidthHasNotChanged","componentWillLoad","manageResizeObserver","componentDidLoad","overrideFocus","disconnectedCallback","removeResizeObserver","autoSize","recordsOnly","pagesOnly","resizeObserver","ResizeObserver","observe","window","addEventListener","onHostElementFocus","event","isEventFromElement","isFullViewHidden","_a","querySelector","focus","pageWithDefault","perPageWithDefault","perPage","totalWithDefault","total","recordTypeWithDefault","recordType","loc","currentRange","start","end","Math","min","nextRange","prevRange","max","pages","isNaN","parseInt","ceil","unobserve","removeEventListener","render","onFirstPage","onLastPage","nextButtonLabel","prevButtonLabel","next","range","toLowerCase","h","key","class","ref","el","current","toLocaleString","label","disabled","hidden","onClick","type","dispatchEvent","FocusEvent","hideLabel","optional","onChange","detail"],"sources":["src/components/q2-pagination/q2-pagination.scss?tag=q2-pagination&encapsulation=shadow","src/components/q2-pagination/q2-pagination.tsx"],"sourcesContent":["@import '../../styles/host';\n@import '../../styles/functions';\n\n:host {\n    text-align: right;\n    display: block;\n    width: 100%;\n}\n\n:host([hidden]) {\n    display: none;\n}\n\n.container {\n    display: inline-flex;\n    column-gap: var-list(var-prefixer(pagination-column-gap), --app-scale-2x, 10px);\n    align-items: center;\n    height: var-list(var-prefixer(pagination-height), 44px);\n}\n\n.btn-group {\n    display: flex;\n    gap: var-list(var-prefixer(pagination-btn-gap), 0);\n}\n\n.description,\n.controls {\n    white-space: nowrap;\n}\n\n.controls {\n    display: grid;\n    grid-template-columns: auto 50px auto;\n    align-items: center;\n    gap: var-list(var-prefixer(pagination-controls-gap), --app-scale-1x, 5px);\n\n    &[hidden] {\n        display: none;\n    }\n}\n\n.input-wrapper {\n    height: var-list(var-prefixer(pagination-height), 44px);\n    display: flex;\n    align-items: center;\n}\n\nq2-btn {\n    --tct-btn-border-radius: #{var-list(var-prefixer(pagination-btn-border-radius))};\n    --tct-btn-border: #{var-list(var-prefixer(pagination-btn-border))};\n}\n\nq2-icon {\n    --tct-icon-size: #{var-list(var-prefixer(pagination-icon-size), 12px)};\n    color: var-list(var-prefixer(pagination-icon-color), --t-text, #4d4d4d);\n}\n\nq2-input {\n    --tct-input-margin-top: 0;\n    --tct-input-margin-bottom: 0;\n    --tct-input-height: #{var-list(var-prefixer(pagination-input-height), 30px)};\n    --tct-input-min-height: var(--tct-input-height);\n    --tct-input-align: center;\n}\n","import {\n    Component,\n    State,\n    Prop,\n    h,\n    ComponentInterface,\n    Watch,\n    Listen,\n    Element,\n    Event,\n    EventEmitter,\n} from '@stencil/core';\nimport { isEventFromElement, loc, nextPaint, overrideFocus } from 'src/utils';\n\n@Component({ tag: 'q2-pagination', shadow: true, styleUrl: 'q2-pagination.scss' })\nexport class Q2Pagination implements ComponentInterface {\n    /** Determines whether the component uses the dynamic resizing behavior. */\n    @Prop({ reflect: true, mutable: true }) autoSize: boolean = true;\n\n    /** The total number of records to paginate. */\n    @Prop({ reflect: true }) total: number;\n\n    /** The current page that is being displayed. */\n    @Prop({ reflect: true, mutable: true }) page: number;\n\n    /**\n     * The number of pages that can be displayed.\n     * @info\n     * Only referenced when `pagesOnly` is true.\n     */\n    @Prop({ reflect: true, mutable: true }) pages: number;\n\n    /** Indicates to only display the current and total pages. */\n    @Prop({ reflect: true, mutable: true }) pagesOnly: boolean;\n\n    /** The total number of records displayed on each page. */\n    @Prop() perPage: number;\n\n    /** Indicates to only display the current and total records. */\n    @Prop({ reflect: true, mutable: true }) recordsOnly: boolean;\n\n    /** Description of the record type to be displayed alongside the record count. */\n    @Prop() recordType: string;\n\n    @Element() hostElement: HTMLElement;\n\n    /**\n     * Emitted when the page is changed.\n     * @legacyEvent\n     */\n    @Event() change: EventEmitter<{ page: number }>;\n\n    @State() isSmall: boolean;\n\n    inputField: HTMLQ2InputElement;\n    containerElement: HTMLElement;\n    containerWidth: number;\n    resizeObserver: ResizeObserver;\n\n    ////////// LIFECYCLE HOOKS ////////\n    componentWillLoad(): void {\n        this.manageResizeObserver();\n    }\n\n    componentDidLoad(): void {\n        this.containerWidth = this.containerElement.clientWidth;\n\n        overrideFocus(this.hostElement);\n    }\n\n    disconnectedCallback() {\n        this.removeResizeObserver();\n    }\n\n    ///////// OBSERVERS /////////\n\n    @Watch('recordsOnly')\n    @Watch('pagesOnly')\n    @Watch('autoSize')\n    manageResizeObserver() {\n        if (this.autoSize && !this.recordsOnly && !this.pagesOnly) {\n            if (this.resizeObserver) return;\n            this.resizeObserver = new ResizeObserver(() => this.checkSize());\n            this.resizeObserver.observe(this.hostElement);\n            window.addEventListener('resize', this.checkSize);\n        } else {\n            this.isSmall = false;\n            this.removeResizeObserver();\n        }\n    }\n\n    ///////// HOST ELEMENT EVENTS /////////\n\n    @Listen('focus')\n    onHostElementFocus(event) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        const { isFullViewHidden, containerElement, inputField } = this;\n        if (isFullViewHidden) {\n            containerElement.querySelector<HTMLElement>('q2-btn:not([disabled])')?.focus();\n        } else {\n            inputField.focus();\n        }\n    }\n\n    ///////// GETTERS /////////\n\n    get isFullViewHidden() {\n        return this.isSmall || this.recordsOnly || this.pagesOnly;\n    }\n\n    get pageWithDefault() {\n        return this.page || 1;\n    }\n\n    get perPageWithDefault() {\n        return this.perPage || 10;\n    }\n\n    get totalWithDefault() {\n        return this.total || 0;\n    }\n\n    get recordTypeWithDefault() {\n        return this.recordType || loc('tecton.element.pagination.defaultRecordType');\n    }\n\n    get currentRange() {\n        const { perPageWithDefault: perPage, totalWithDefault: total, pageWithDefault: page } = this;\n        const start = (page - 1) * perPage + 1;\n        const end = Math.min(page * perPage, total);\n        return `${start} - ${end}`;\n    }\n\n    get nextRange() {\n        const { perPageWithDefault: perPage, totalWithDefault: total, pageWithDefault: page } = this;\n        const start = page * perPage + 1;\n        const end = Math.min((page + 1) * perPage, total);\n        return `${start} - ${end}`;\n    }\n\n    get prevRange() {\n        const { perPageWithDefault: perPage, pageWithDefault: page } = this;\n        const start = Math.max(1, (page - 2) * perPage + 1);\n        const end = (page - 1) * perPage;\n        return `${start} - ${end}`;\n    }\n\n    get totalPages() {\n        const { pagesOnly, totalWithDefault: total, perPageWithDefault: perPage, pages } = this;\n\n        if (pagesOnly && pages && !isNaN(parseInt(`${pages}`))) return pages;\n\n        return Math.ceil(total / perPage);\n    }\n\n    ///////// HELPERS /////////\n\n    removeResizeObserver() {\n        if (this.resizeObserver) {\n            this.resizeObserver?.unobserve(this.hostElement);\n            this.resizeObserver = null;\n            window.removeEventListener('resize', this.checkSize);\n        }\n    }\n\n    handlePageChange = (page: number) => {\n        const { totalPages, inputField } = this;\n        if (page < 1) {\n            page = 1;\n        } else if (page > totalPages) {\n            page = totalPages;\n        }\n\n        if (inputField.value !== `${page}`) inputField.value = `${page}`;\n\n        if (!this.hostElement.onchange) {\n            this.page = page;\n        }\n\n        this.change.emit({ page });\n    };\n\n    checkSize = () => {\n        const { hostElement, containerElement } = this;\n        const isOverflowing = this.containerWidth > hostElement.clientWidth;\n        this.isSmall = isOverflowing;\n        if (isOverflowing) return;\n\n        nextPaint(() => {\n            const containerWidthHasNotChanged = this.containerWidth === containerElement.clientWidth;\n            if (containerWidthHasNotChanged) return;\n            this.containerWidth = containerElement.clientWidth;\n            this.checkSize();\n        });\n    };\n\n    render() {\n        const {\n            pagesOnly,\n            recordsOnly,\n            isFullViewHidden,\n            recordTypeWithDefault: recordType,\n            totalPages,\n            totalWithDefault: total,\n            pageWithDefault: page,\n            currentRange,\n            nextRange,\n            prevRange,\n        } = this;\n        const onFirstPage = page === 1;\n        const onLastPage = page === totalPages;\n\n        let nextButtonLabel: string = '';\n        let prevButtonLabel: string = '';\n        if (pagesOnly) {\n            prevButtonLabel = loc('tecton.element.pagination.goToPages', { next: page - 1, total: totalPages });\n            nextButtonLabel = loc('tecton.element.pagination.goToPages', { next: page + 1, total: totalPages });\n        } else if (recordsOnly) {\n            prevButtonLabel = loc('tecton.element.pagination.goToRecords', {\n                range: prevRange,\n                recordType: recordType.toLowerCase(),\n                total,\n            });\n            nextButtonLabel = loc('tecton.element.pagination.goToRecords', {\n                range: nextRange,\n                recordType: recordType.toLowerCase(),\n                total,\n            });\n        }\n\n        return (\n            <nav\n                class=\"container\"\n                ref={el => (this.containerElement = el)}\n                aria-label={loc('tecton.element.pagination.title')}\n            >\n                <div\n                    class=\"description\"\n                    test-id=\"description\"\n                >\n                    {pagesOnly\n                        ? loc('tecton.element.pagination.pages', {\n                              current: page,\n                              total: totalPages,\n                          })\n                        : loc('tecton.element.pagination.description', {\n                              range: currentRange,\n                              recordType: recordType.toLowerCase(),\n                              total: total.toLocaleString(),\n                          })}\n                </div>\n                <div class=\"btn-group\">\n                    <q2-btn\n                        label={loc('tecton.element.pagination.goToFirstPage')}\n                        disabled={onFirstPage}\n                        hidden={isFullViewHidden}\n                        onClick={() => this.handlePageChange(1)}\n                        test-id=\"firstPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-double-left\" />\n                    </q2-btn>\n                    <q2-btn\n                        label={prevButtonLabel}\n                        disabled={onFirstPage}\n                        onClick={() => this.handlePageChange(page - 1)}\n                        test-id=\"prevPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-left\" />\n                    </q2-btn>\n                </div>\n                <div\n                    class=\"controls\"\n                    hidden={isFullViewHidden}\n                    test-id=\"controls\"\n                >\n                    <span aria-hidden=\"true\">{loc('tecton.element.pagination.page')}</span>\n                    <div\n                        class=\"input-wrapper\"\n                        onClick={() => this.inputField.dispatchEvent(new FocusEvent('focus'))}\n                    >\n                        <q2-input\n                            type=\"number\"\n                            value={`${page}`}\n                            min={1}\n                            max={this.totalPages}\n                            hideLabel\n                            optional\n                            label={`${loc('tecton.element.pagination.page')} (${loc(\n                                'tecton.element.pagination.ofPages',\n                                [totalPages.toLocaleString()]\n                            )})`}\n                            onChange={event => this.handlePageChange(event.detail.value)}\n                            test-id=\"pageInput\"\n                            current=\"page\"\n                            ref={el => (this.inputField = el)}\n                        ></q2-input>\n                    </div>\n                    <span aria-hidden=\"true\">\n                        {loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()])}\n                    </span>\n                </div>\n                <div class=\"btn-group\">\n                    <q2-btn\n                        label={nextButtonLabel}\n                        disabled={onLastPage}\n                        onClick={() => this.handlePageChange(page + 1)}\n                        test-id=\"nextPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-right\" />\n                    </q2-btn>\n                    <q2-btn\n                        label=\"tecton.element.pagination.goToLastPage\"\n                        disabled={onLastPage}\n                        hidden={isFullViewHidden}\n                        onClick={() => this.handlePageChange(totalPages)}\n                        test-id=\"lastPageBtn\"\n                        hide-label\n                    >\n                        <q2-icon type=\"chevron-double-right\" />\n                    </q2-btn>\n                </div>\n            </nav>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/{p-5b3f885f.entry.js → p-b7d5fd12.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as a,h as t,H as r,g as o}from"./p-a5f18e27.js";import{l as n}from"./p-5c46acb8.js";const s="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}q2-carousel .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;transition:all 0.2s}q2-carousel-pane.q2-carousel-pane{--comp-carousel-pane-tween:var(--tct-tween-1, var(--app-tween-1, 0.2s ease));--comp-carousel-shadow:var(--app-shadow-2, 0px 2px 8px 0px var(--t-top-a1, rgba(0, 0, 0, 0.25)));cursor:grab}q2-carousel-pane.q2-carousel-pane:not([is-active-pane]) *{cursor:pointer}q2-carousel-pane.q2-carousel-pane:focus{box-shadow:none}q2-carousel-pane.q2-carousel-pane:focus .q2-carousel-pane-main-content{outline:none;box-shadow:var(--const-double-focus-ring)}q2-carousel-pane.q2-carousel-pane button{border:0;background:transparent;transition:all 0.2s;opacity:0.3;cursor:pointer}q2-carousel-pane.q2-carousel-pane button:hover{opacity:0.7}q2-carousel-pane.q2-carousel-pane .q2-carousel-pane-main-content{box-shadow:var(--comp-carousel-shadow);transition:var(--comp-carousel-pane-tween);background:var(--tct-carousel-background, var(--tct-carousel-background-color, var(--t-carousel-background-color, var(--tct-white, var(--app-white, #ffffff)))));border:var(--tct-carousel-pane-border-width, var(--t-carousel-pane-border-width, 0px)) solid var(--tct-carousel-pane-border-color, var(--t-carousel-pane-border-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));border-radius:var(--tct-carousel-pane-border-radius, var(--t-carousel-pane-border-radius, 8px));padding:var(--tct-carousel-pane-padding, var(--t-carousel-pane-padding, 7px));height:var(--tct-carousel-pane-height, var(--t-carousel-pane-height, 10em))}q2-carousel-pane.q2-carousel-pane .q2-carousel-pane-main-content:hover{box-shadow:var(--const-double-focus-ring), var(--comp-carousel-shadow)}";const i=s;const c=class{constructor(t){e(this,t);this.clickCarouselPane=a(this,"clickCarouselPane",7);this.generatePaneClass=e=>`q2-carousel-pane swiper-slide q2-carousel-pane-${e}`;this.paneClicked=e=>{if(this.isActivePane)return;e.preventDefault();this.clickCarouselPane.emit({paneIndex:this.index,pane:this.hostElement})};this.index=undefined;this.siblingCount=undefined;this.isActivePane=undefined;this.label=undefined}get currentPaneIndex(){return Array.prototype.indexOf.call(this.hostElement.parentElement.children,this.hostElement)}componentDidLoad(){this.determineDisabledContent()}determineDisabledContent(){const{isActivePane:e}=this;const a=this.hostElement.querySelectorAll('q2-btn, a[href], button, [tabindex]:not([tabindex="-1"])');a.forEach((a=>{const t=a.hasAttribute("tabindex")&&parseInt(a.getAttribute("tabindex"))>=0;if(t){a.dataset.q2Tabindex=`${a.tabIndex}`}if(e){if(a.hasAttribute("data-q2-tabindex")){a.tabIndex=parseInt(a.getAttribute("data-q2-tabindex"));a.removeAttribute("data-q2-tabindex")}else if(a.tagName.startsWith("Q2-")){a.tabIndex=undefined}else{a.removeAttribute("tabindex")}}else{a.tabIndex=-1}}))}render(){const{label:e}=this;return t(r,{key:"fd5d9d03af8d68ff9edfd8ed39fdf4186d7b36a2",class:this.generatePaneClass(this.currentPaneIndex),tabIndex:this.isActivePane?0:-1,role:"group","aria-roledescription":"slide","aria-hidden":this.isActivePane?undefined:"true","aria-label":e?n(e):n("tecton.element.carousel.itemDescription",[(this.currentPaneIndex+1).toString(),(this.siblingCount||0).toString()]),onClick:this.paneClicked},t("article",{key:"f947a07e8fae57beabcd93e7fc599701cedfacc6",class:"q2-carousel-pane-main-content"},t("slot",{key:"e35fc5d6f4bab2909902938ba205a9ceaaf0e1be"})))}get hostElement(){return o(this)}static get watchers(){return{isActivePane:["determineDisabledContent"]}}};c.style=i;export{c as q2_carousel_pane};
-//# sourceMappingURL=p-5b3f885f.entry.js.map
+import{r as e,c as a,h as t,H as r,g as o}from"./p-a5f18e27.js";import{l as n}from"./p-42302f6f.js";const s="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}q2-carousel .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;transition:all 0.2s}q2-carousel-pane.q2-carousel-pane{--comp-carousel-pane-tween:var(--tct-tween-1, var(--app-tween-1, 0.2s ease));--comp-carousel-shadow:var(--app-shadow-2, 0px 2px 8px 0px var(--t-top-a1, rgba(0, 0, 0, 0.25)));cursor:grab}q2-carousel-pane.q2-carousel-pane:not([is-active-pane]) *{cursor:pointer}q2-carousel-pane.q2-carousel-pane:focus{box-shadow:none}q2-carousel-pane.q2-carousel-pane:focus .q2-carousel-pane-main-content{outline:none;box-shadow:var(--const-double-focus-ring)}q2-carousel-pane.q2-carousel-pane button{border:0;background:transparent;transition:all 0.2s;opacity:0.3;cursor:pointer}q2-carousel-pane.q2-carousel-pane button:hover{opacity:0.7}q2-carousel-pane.q2-carousel-pane .q2-carousel-pane-main-content{box-shadow:var(--comp-carousel-shadow);transition:var(--comp-carousel-pane-tween);background:var(--tct-carousel-background, var(--tct-carousel-background-color, var(--t-carousel-background-color, var(--tct-white, var(--app-white, #ffffff)))));border:var(--tct-carousel-pane-border-width, var(--t-carousel-pane-border-width, 0px)) solid var(--tct-carousel-pane-border-color, var(--t-carousel-pane-border-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));border-radius:var(--tct-carousel-pane-border-radius, var(--t-carousel-pane-border-radius, 8px));padding:var(--tct-carousel-pane-padding, var(--t-carousel-pane-padding, 7px));height:var(--tct-carousel-pane-height, var(--t-carousel-pane-height, 10em))}q2-carousel-pane.q2-carousel-pane .q2-carousel-pane-main-content:hover{box-shadow:var(--const-double-focus-ring), var(--comp-carousel-shadow)}q2-carousel-pane.q2-carousel-pane[slot-frameless]:not([slot-frameless=false]) .q2-carousel-pane-main-content{box-shadow:none;border:0;border-radius:0;padding:0}";const i=s;const c=class{constructor(t){e(this,t);this.clickCarouselPane=a(this,"clickCarouselPane",7);this.generatePaneClass=e=>`q2-carousel-pane swiper-slide q2-carousel-pane-${e}`;this.paneClicked=e=>{if(this.isActivePane)return;e.preventDefault();this.clickCarouselPane.emit({paneIndex:this.index,pane:this.hostElement})};this.index=undefined;this.siblingCount=undefined;this.isActivePane=undefined;this.label=undefined;this.slotFrameless=undefined}get currentPaneIndex(){return Array.prototype.indexOf.call(this.hostElement.parentElement.children,this.hostElement)}componentDidLoad(){this.determineDisabledContent()}determineDisabledContent(){const{isActivePane:e}=this;const a=this.hostElement.querySelectorAll('q2-btn, q2-dropdown, a[href], button, [tabindex]:not([tabindex="-1"])');a.forEach((a=>{const t=a.hasAttribute("tabindex")&&parseInt(a.getAttribute("tabindex"))>=0;if(t){a.setAttribute("data-q2-tabindex",`${a.tabIndex}`)}if(e){if(a.hasAttribute("data-q2-tabindex")){a.tabIndex=parseInt(a.getAttribute("data-q2-tabindex"));a.removeAttribute("data-q2-tabindex")}else if(a.tagName.startsWith("Q2-")){a.tabIndex=undefined}else{a.removeAttribute("tabindex")}}else{a.tabIndex=-1}}))}render(){const{label:e}=this;return t(r,{key:"3408598713aeea60c644c3ea0750f0dce2d40ca9",class:this.generatePaneClass(this.currentPaneIndex),tabIndex:this.isActivePane?0:-1,role:"group","aria-roledescription":"slide","aria-hidden":this.isActivePane?undefined:"true","aria-label":e?n(e):n("tecton.element.carousel.itemDescription",[(this.currentPaneIndex+1).toString(),(this.siblingCount||0).toString()]),onClick:this.paneClicked},t("article",{key:"a03a7125b958195b21d731f9cbeebdb1c8f9a0b3",class:"q2-carousel-pane-main-content"},t("slot",{key:"c07f1d5fc75a902a6f9741e746279bad8c094a13"})))}get hostElement(){return o(this)}static get watchers(){return{isActivePane:["determineDisabledContent"]}}};c.style=i;export{c as q2_carousel_pane};
+//# sourceMappingURL=p-b7d5fd12.entry.js.map

package/dist/q2-tecton-elements/p-b7d5fd12.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2CarouselPaneCss","Q2CarouselPaneStyle0","Q2CarouselPane","this","generatePaneClass","currentIndex","paneClicked","event","isActivePane","preventDefault","clickCarouselPane","emit","paneIndex","index","pane","hostElement","currentPaneIndex","Array","prototype","indexOf","call","parentElement","children","componentDidLoad","determineDisabledContent","focusableElements","querySelectorAll","forEach","element","hasValidTabIndex","hasAttribute","parseInt","getAttribute","setAttribute","tabIndex","removeAttribute","tagName","startsWith","undefined","render","label","h","Host","key","class","role","loc","toString","siblingCount","onClick"],"sources":["src/components/q2-carousel-pane/q2-carousel-pane.scss?tag=q2-carousel-pane","src/components/q2-carousel-pane/q2-carousel-pane.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\nq2-carousel .swiper-slide {\n    flex-shrink: 0;\n    width: 100%;\n    height: 100%;\n    position: relative;\n    transition-property: transform;\n    transition: all 0.2s;\n}\n\nq2-carousel-pane.q2-carousel-pane {\n    --comp-carousel-pane-tween: #{var-list(--tct-tween-1, --app-tween-1, unquote('0.2s ease'))};\n    --comp-carousel-shadow: #{var-list(--app-shadow-2, unquote('0px 2px 8px 0px var(--t-top-a1, rgba(0, 0, 0, 0.25))'))};\n\n    cursor: grab;\n\n    &:not([is-active-pane]) * {\n        cursor: pointer;\n    }\n\n    &:focus {\n        box-shadow: none;\n        .q2-carousel-pane-main-content {\n            outline: none;\n            box-shadow: var(--const-double-focus-ring);\n        }\n    }\n\n    button {\n        border: 0;\n        background: transparent;\n        transition: all 0.2s;\n        opacity: 0.3;\n        cursor: pointer;\n\n        &:hover {\n            opacity: 0.7;\n        }\n    }\n\n    .q2-carousel-pane-main-content {\n        box-shadow: var(--comp-carousel-shadow);\n        transition: var(--comp-carousel-pane-tween);\n        background: var-list(\n            --tct-carousel-background,\n            var-prefixer(carousel-background-color),\n            --tct-white,\n            --app-white,\n            #ffffff\n        );\n        border: var-list(var-prefixer(carousel-pane-border-width), 0px) solid\n            var-list(\n                var-prefixer(carousel-pane-border-color),\n                var-prefixer(gray-11),\n                --tct-gray-l1,\n                --app-gray-l1,\n                #cccccc\n            );\n        border-radius: var-list(var-prefixer(carousel-pane-border-radius), 8px);\n        padding: var-list(var-prefixer(carousel-pane-padding), 7px);\n        height: var-list(var-prefixer(carousel-pane-height), 10em);\n    }\n\n    .q2-carousel-pane-main-content:hover {\n        box-shadow: var(--const-double-focus-ring), var(--comp-carousel-shadow);\n    }\n    &[slot-frameless]:not([slot-frameless='false']) {\n        .q2-carousel-pane-main-content {\n            box-shadow: none;\n            border: 0;\n            border-radius: 0;\n            padding: 0;\n        }\n    }\n}\n","import { Component, ComponentInterface, Event, Element, Host, Watch, Prop, h, EventEmitter } from '@stencil/core';\nimport { loc } from 'src/utils';\n\n@Component({ tag: 'q2-carousel-pane', shadow: false, styleUrl: 'q2-carousel-pane.scss' })\nexport class Q2CarouselPane implements ComponentInterface {\n    /**\n     * Used by q2-carousel to determine the pane's index.\n     * @private\n     */\n    @Prop({ reflect: false }) index: number;\n\n    /**\n     * Used by q2-carousel to indicate how many panes are in the carousel.\n     * @private\n     */\n    @Prop({ reflect: false }) siblingCount: number;\n\n    /**\n     * Used by `q2-carousel` to indicate which pane is currently active.\n     * @private\n     */\n    @Prop({ reflect: true }) isActivePane: boolean;\n\n    /**\n     * Text used only as an `aria-label` for accessibility purposes.\n     * @localizable\n     */\n    @Prop({ reflect: true }) label: string;\n\n    /**\n     * Used by `q2-carousel` to indicate the pane should be frameless\n     * @private\n     */\n    @Prop({ reflect: true }) slotFrameless: boolean;\n\n    @Element() hostElement: HTMLElement;\n\n    get currentPaneIndex() {\n        return Array.prototype.indexOf.call(this.hostElement.parentElement.children, this.hostElement);\n    }\n\n    componentDidLoad(): void {\n        this.determineDisabledContent();\n    }\n\n    generatePaneClass = (currentIndex: number) => {\n        return `q2-carousel-pane swiper-slide q2-carousel-pane-${currentIndex}`;\n    };\n\n    /**\n     * Emitted when the pane is clicked.\n     */\n    @Event() clickCarouselPane: EventEmitter<{ paneIndex: number; pane: HTMLElement }>;\n\n    paneClicked = event => {\n        if (this.isActivePane) return;\n        event.preventDefault();\n        this.clickCarouselPane.emit({\n            paneIndex: this.index,\n            pane: this.hostElement,\n        });\n    };\n\n    @Watch('isActivePane')\n    determineDisabledContent() {\n        const { isActivePane } = this;\n        const focusableElements = this.hostElement.querySelectorAll<HTMLElement>(\n            'q2-btn, q2-dropdown, a[href], button, [tabindex]:not([tabindex=\"-1\"])'\n        );\n\n        focusableElements.forEach(element => {\n            const hasValidTabIndex =\n                element.hasAttribute('tabindex') && parseInt(element.getAttribute('tabindex')) >= 0;\n\n            if (hasValidTabIndex) {\n                element.setAttribute('data-q2-tabindex', `${element.tabIndex}`);\n            }\n\n            if (isActivePane) {\n                if (element.hasAttribute('data-q2-tabindex')) {\n                    element.tabIndex = parseInt(element.getAttribute('data-q2-tabindex'));\n                    element.removeAttribute('data-q2-tabindex');\n                } else if (element.tagName.startsWith('Q2-')) {\n                    element.tabIndex = undefined;\n                } else {\n                    element.removeAttribute('tabindex');\n                }\n            } else {\n                element.tabIndex = -1;\n            }\n        });\n    }\n\n    render() {\n        const { label } = this;\n\n        return (\n            <Host\n                class={this.generatePaneClass(this.currentPaneIndex)}\n                tabIndex={this.isActivePane ? 0 : -1}\n                role=\"group\"\n                aria-roledescription=\"slide\"\n                aria-hidden={this.isActivePane ? undefined : 'true'}\n                aria-label={\n                    label\n                        ? loc(label)\n                        : loc('tecton.element.carousel.itemDescription', [\n                              (this.currentPaneIndex + 1).toString(),\n                              (this.siblingCount || 0).toString(),\n                          ])\n                }\n                onClick={this.paneClicked}\n            >\n                <article class=\"q2-carousel-pane-main-content\">\n                    <slot></slot>\n                </article>\n            </Host>\n        );\n    }\n}\n"],"mappings":"oGAAA,MAAMA,EAAoB,sgFAC1B,MAAAC,EAAeD,E,MCGFE,EAAc,M,8EAyCvBC,KAAAC,kBAAqBC,GACV,kDAAkDA,IAQ7DF,KAAAG,YAAcC,IACV,GAAIJ,KAAKK,aAAc,OACvBD,EAAME,iBACNN,KAAKO,kBAAkBC,KAAK,CACxBC,UAAWT,KAAKU,MAChBC,KAAMX,KAAKY,aACb,E,+HAvBN,oBAAIC,GACA,OAAOC,MAAMC,UAAUC,QAAQC,KAAKjB,KAAKY,YAAYM,cAAcC,SAAUnB,KAAKY,Y,CAGtF,gBAAAQ,GACIpB,KAAKqB,0B,CAsBT,wBAAAA,GACI,MAAMhB,aAAEA,GAAiBL,KACzB,MAAMsB,EAAoBtB,KAAKY,YAAYW,iBACvC,yEAGJD,EAAkBE,SAAQC,IACtB,MAAMC,EACFD,EAAQE,aAAa,aAAeC,SAASH,EAAQI,aAAa,cAAgB,EAEtF,GAAIH,EAAkB,CAClBD,EAAQK,aAAa,mBAAoB,GAAGL,EAAQM,W,CAGxD,GAAI1B,EAAc,CACd,GAAIoB,EAAQE,aAAa,oBAAqB,CAC1CF,EAAQM,SAAWH,SAASH,EAAQI,aAAa,qBACjDJ,EAAQO,gBAAgB,mB,MACrB,GAAIP,EAAQQ,QAAQC,WAAW,OAAQ,CAC1CT,EAAQM,SAAWI,S,KAChB,CACHV,EAAQO,gBAAgB,W,MAEzB,CACHP,EAAQM,UAAY,C,KAKhC,MAAAK,GACI,MAAMC,MAAEA,GAAUrC,KAElB,OACIsC,EAACC,EAAI,CAAAC,IAAA,2CACDC,MAAOzC,KAAKC,kBAAkBD,KAAKa,kBACnCkB,SAAU/B,KAAKK,aAAe,GAAK,EACnCqC,KAAK,QAAO,uBACS,QAAO,cACf1C,KAAKK,aAAe8B,UAAY,OAAM,aAE/CE,EACMM,EAAIN,GACJM,EAAI,0CAA2C,EAC1C3C,KAAKa,iBAAmB,GAAG+B,YAC3B5C,KAAK6C,cAAgB,GAAGD,aAGvCE,QAAS9C,KAAKG,aAEdmC,EAAA,WAAAE,IAAA,2CAASC,MAAM,iCACXH,EAAA,QAAAE,IAAA,8C"}

package/dist/q2-tecton-elements/{p-cb30f949.entry.js → p-bf125cdf.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as r,F as i,g as o}from"./p-a5f18e27.js";import{o as a,i as s,l as n}from"./p-5c46acb8.js";const l='*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block;position:relative}ul{--comp-bullet-background:var(--tct-stepper-bullet-active-background, var(--tct-stepper-bullet-active-bg, var(--t-stepper-bullet-active-bg, var(--t-primary, #0079c1))));--comp-bullet-font-color:var(--tct-stepper-bullet-active-font-color, var(--t-stepper-bullet-active-font-color, var(--t-primary-font-color, #ffffff)));--comp-bullet-size:var(--tct-stepper-btn-icon-size, var(--t-stepper-btn-icon-size, 24px));--comp-bullet-gap:var(--tct-stepper-btn-gap, var(--t-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-bullet-font-size:var-list(var-prefixer(stepper-btn-label-font-size), 16px);--comp-step-width:var(--tct-stepper-step-width, var(--t-stepper-step-width, var(--t-stepper-step-width, 80px)));--comp-step-gap:var(--tct-stepper-step-gap, var(--t-stepper-step-gap, 5px));--comp-btn-icon-size:var(--tct-stepper-btn-icon-size, var(--t-stepper-btn-icon-size, 24px));--comp-btn-label-font-size:var-list(var-prefixer(stepper-btn-label-font-size), 16px);--comp-tween:var(--tct-stepper-tween, var(--t-stepper-tween, var(--app-tween-1, 0.2s ease)));overflow-x:auto;display:flex;justify-content:center;list-style:none;padding:0;padding:var(--tct-stepper-list-padding, var(--t-stepper-list-padding, 2px));margin:0;gap:var(--comp-step-gap);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 3px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}ul::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}ul::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}ul::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}.has-scroll ul{justify-content:unset}li{min-height:var(--tct-stepper-min-height, var(--t-stepper-min-height, 50px));flex:0 0 auto;position:relative;width:var(--comp-step-width);text-align:center;max-width:150px;min-width:80px}.step-btn{position:relative;background:transparent;border:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;height:calc(100% - 4px);width:100%;transition:var(--comp-tween);padding:0;transition-property:box-shadow;outline:none;margin-top:2px;--comp-active-color:var(--comp-bullet-background)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #d20a0a)}.step-btn[aria-disabled]{cursor:not-allowed}.step-btn[aria-disabled],.step-btn[aria-disabled]+.step-divider{--comp-bullet-font-color:var(--tct-stepper-bullet-inactive-font-color, var(--t-stepper-bullet-inactive-font-color, var(--t-text, #4d4d4d)));--comp-bullet-background:var(--tct-stepper-bullet-inactive-background, var(--tct-stepper-bullet-inactive-bg, var(--t-stepper-bullet-inactive-bg, var(--t-gray-12, #d9d9d9))))}.step-icon,.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0;margin:var(--comp-bullet-gap) auto;color:var(--comp-bullet-font-color);width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);min-height:var(--comp-btn-icon-size);font-size:var(--comp-bullet-font-size);transition:var(--comp-tween);transition-property:background, color;border-radius:50%;position:relative}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:"";display:block;background:var(--comp-bullet-font-color);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}[aria-selected] .step-icon,[aria-selected] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color);font-weight:var(--tct-stepper-bullet-active-font-weight, var(--t-stepper-bullet-active-font-weight, 600))}.step-bubble{background:var(--comp-bullet-background)}.step-divider{width:calc(var(--comp-step-width) - var(--comp-step-gap) - var(--comp-bullet-gap) - var(--comp-bullet-size));top:calc(var(--comp-bullet-size) / 2 + var(--comp-bullet-gap));left:calc(var(--comp-step-width) * -0.5 + var(--comp-step-gap) + var(--comp-bullet-gap));border:0;border-top:1px solid var(--comp-bullet-background);height:0;position:absolute;margin:0;transition:border var(--comp-tween)}.step-container{position:relative}.step-label{color:var(--tct-stepper-label-color, var(--tct-stepper-title-color, var(--t-stepper-title-color, var(--t-text, #4d4d4d))));font-size:var(--tct-stepper-label-font-size, var(--tct-stepper-title-font-size, var(--t-stepper-title-font-size, var(--app-font-size-small, 12px))));line-height:var(--tct-stepper-label-line-height, 1.5em);text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-label-line-count, 2);-webkit-box-orient:vertical}[aria-selected] .step-label{font-weight:var(--tct-stepper-active-font-weight, var(--t-stepper-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:var(--tct-stepper-label-line-count, 1)}.step-description{color:var(--tct-stepper-description-color, var(--t-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-stepper-description-font-size, var(--t-stepper-description-font-size, var(--app-font-size-small, 12px)));text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-description-line-count, 4);-webkit-box-orient:vertical;padding-bottom:0.2em}.step-description .ellipsize{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--comp-step-width);display:block}.gradient-left,.gradient-right{z-index:1;position:absolute;top:0;height:100%;width:18px}.gradient-left{background-image:linear-gradient(to left, var(--t-base-a0, rgba(255, 255, 255, 0)), var(--t-base-a2, rgba(255, 255, 255, 0.5)) 10%, var(--t-base, #ffffff) 100%);left:0}.gradient-right{background-image:linear-gradient(to right, var(--t-base-a0, rgba(255, 255, 255, 0)), var(--t-base-a2, rgba(255, 255, 255, 0.5)) 10%, var(--t-base, #ffffff) 100%);right:0}.btn-left,.btn-right{--tct-icon-size:18px;--tct-btn-icon-hover-background:transparent;--tct-btn-icon-width:22px;--tct-icon-stroke-primary:var(--tct-stepper-scroll-arrow-color, var(--t-stepper-scroll-arrow-color, var(--t-text, #4d4d4d)));position:absolute;top:calc(50% - 22px);z-index:2}.btn-left q2-icon,.btn-right q2-icon{--tct-icon-stroke-width:3}.btn-left{left:0}.btn-right{right:0}';const c=l;const p=class{constructor(r){t(this,r);this.change=e(this,"change",7);this.scheduledAfterRender=[];this.onSlotChange=()=>{this.checkForPanes();this.checkScrollState()};this.onScrollBtnClick=t=>{const e=Math.floor(this.listElement.clientWidth/2);this.listElement.scrollBy({left:t==="left"?-e:e,behavior:"smooth"})};this.onStepClick=(t,e)=>{t.stopPropagation();const{currentStep:r,stepCount:i,lastEnabledStep:o}=this;if(e>o||e===r)return;this.change.emit({selectedStep:e,lastEnabledStep:o,currentStep:r,stepCount:i})};this.onStepKeyDown=(t,e)=>{const{lastEnabledStep:r,stepCount:i}=this;const{key:o}=t;let a;switch(o){case"ArrowLeft":t.preventDefault();a=Math.max(e-1,0);break;case"ArrowRight":t.preventDefault();a=Math.min(e+1,i);break;case"Home":t.preventDefault();a=1;break;case"End":t.preventDefault();a=r;break}if(!a)return;this.focusStep(a,true)};this.checkForPanes=()=>{const{allPanes:t}=this;if(!t.length)return;this.stepCount=t.length};this.checkScrollState=()=>{if(!this.listElement)return;const{scrollLeft:t,scrollWidth:e,clientWidth:r}=this.listElement;this.scrollEnabled=e>r;this.showScrollLeft=!!t;this.showScrollRight=e!==t+r};this.currentStep=1;this.stepCount=undefined;this.lastEnabledStep=undefined;this.contentChangeTriggerCount=0;this.scrollEnabled=false;this.showScrollLeft=false;this.showScrollRight=false}componentWillLoad(){if(!this.lastEnabledStep)this.lastEnabledStep=this.currentStep||1;this.resizeObserver=new ResizeObserver((()=>this.checkScrollState()));this.checkForPanes()}componentDidLoad(){this.resizeObserver.observe(this.listElement);this.checkScrollState();a(this.hostElement);setTimeout((()=>this.showStep(this.currentStep||1)),0)}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}disconnectedCallback(){this.resizeObserver.disconnect()}currentStepChanged(t){this.showStep(t)}defaultChangeHandler(t){const{hostElement:e}=this;if(t.target===e&&!e.getAttribute("onchange")&&!!t.detail){this.currentStep=t.detail.selectedStep}}delegateFocus(t){if(!s(t,this.hostElement))return;this.focusStep(this.currentStep,true,true)}statusChangeHandler(t){const e=Array.from(this.allPanes).findIndex((e=>t.detail.id===e.id));if(e>-1){this.allPanes[e].status=t.detail.status;this.renderStepBtn(e)}}contentChangeHandler(){this.contentChangeTriggerCount+=1}get allPanes(){return this.hostElement.querySelectorAll("q2-stepper-pane")}showStep(t){if(t>this.lastEnabledStep){const{currentStep:e,stepCount:r}=this;this.lastEnabledStep=t;this.change.emit({selectedStep:null,lastEnabledStep:t,currentStep:e,stepCount:r})}this.scheduledAfterRender.push(this.resizeIframe);this.showStepPane(t);this.focusStep(t,this.scrollEnabled)}resizeIframe(){var t,e;return(e=(t=window===null||window===void 0?void 0:window.TectonElements)===null||t===void 0?void 0:t.resizeIframe)===null||e===void 0?void 0:e.call(t)}showStepPane(t){this.allPanes.forEach(((e,r)=>{e.isActive=t===r+1}))}focusStep(t,e,r){var i;const o=this.listElement.children[t-1];const a=document.activeElement===this.hostElement;if(!o)return;if(a||r){(i=o.firstElementChild)===null||i===void 0?void 0:i.focus()}if(e){const t=o.offsetLeft-this.listElement.clientWidth/2;this.listElement.scrollTo({left:t,behavior:"smooth"})}}getPaneSlotOrProperty(t,e){var r;const i=t.querySelector(`[slot="${e}"]`);return(r=i===null||i===void 0?void 0:i.outerHTML)!==null&&r!==void 0?r:n(t[e])}renderStepBtn(t){var e;const{allPanes:o,stepCount:a,currentStep:s,lastEnabledStep:l}=this;const c=(e=o===null||o===void 0?void 0:o[t])!==null&&e!==void 0?e:null;const{id:p,status:b}=c;const d=this.getPaneSlotOrProperty(c,"label");const h=this.getPaneSlotOrProperty(c,"description");const v=t+1;const u=v===s;const f=!!d&&`label-${p}`;const g=!!d&&!!h&&`description-${p}`;const m=!d&&n("tecton.element.stepper.number",[`${v}`,`${a}`]);let w;if(b==="complete")w="success-filled";else if(b==="error")w="warning-filled";const x=["step-btn"];if(b)x.push(`status-${b}`);const k=b==="locked";const y=k||v>l;return r("li",{role:"presentation"},r("button",{class:x.join(" "),type:"button","aria-labelledby":f,"aria-describedBy":g,"aria-label":m,"aria-selected":u,"aria-controls":p,"aria-disabled":y?"true":null,role:"tab",tabIndex:u?0:-1,onKeyDown:t=>this.onStepKeyDown(t,v),onClick:t=>!k&&this.onStepClick(t,v)},r(i,null,w?r("div",{class:"step-icon"},r("q2-icon",{type:w})):r("div",{class:"step-bubble"},v),f&&r("div",{class:"step-label",id:f,innerHTML:d}),f&&g&&r("div",{class:"step-description",id:g,innerHTML:h}))),t?r("div",{class:"step-divider"}):"")}render(){const{stepCount:t,scrollEnabled:e,showScrollLeft:o,showScrollRight:a}=this;const s=["step-container"];if(e)s.push("has-scroll");return r(i,{key:"965d2f62ad31f1261ac4b5075b5c9b81314ec0ea"},r("div",{key:"38f57eda34c0c8bda0ebe56cb3a8ab6a5923eea4",class:s.join(" ")},e&&r(i,{key:"0f07c432180e66c9381ad74ee21523954af7b5ba"},r("div",{key:"2ecfa2e708506d28de8d6d3ccb6c8e79c239e8cc",class:"gradient-left",hidden:!o}),r("div",{key:"1059a8cd55972546358d68fb9db5c20a8cbdb66d",class:"gradient-right",hidden:!a}),r("q2-btn",{key:"a2d33950402827781ff23fe6afdae01b9aac6a27",class:"btn-left",hidden:!this.showScrollLeft,onClick:()=>this.onScrollBtnClick("left")},r("q2-icon",{key:"1af94b1d9408aaa913b43e9b76e7e5f1b6da4617",type:"chevron-left"})),r("q2-btn",{key:"f323277f414a4fb7a8c29a4c9b25becdb19aab14",class:"btn-right",hidden:!this.showScrollRight,onClick:()=>this.onScrollBtnClick("right")},r("q2-icon",{key:"8610ca1651bef3e92133ec52802082f66b95d04f",type:"chevron-right"}))),r("ul",{key:"6362aa56e9e76be08956f9d413b1a16a0f844273",onScroll:this.checkScrollState,ref:t=>this.listElement=t,role:"tablist"},t>0&&[...Array(t).keys()].map((t=>this.renderStepBtn(t))))),r("div",{key:"7bc7f714397f19db7fb208919c35a1e6fe9f0757"},r("slot",{key:"af091365538eae26e68a0086b4f099960015c26f",onSlotchange:()=>this.onSlotChange()})))}get hostElement(){return o(this)}static get watchers(){return{currentStep:["currentStepChanged"]}}};p.style=c;export{p as q2_stepper};
-//# sourceMappingURL=p-cb30f949.entry.js.map
+import{r as t,c as e,h as r,F as i,g as o}from"./p-a5f18e27.js";import{o as s,i as a,l as n}from"./p-42302f6f.js";const l='*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block;position:relative}ul{--comp-bullet-background:var(--tct-stepper-bullet-active-background, var(--tct-stepper-bullet-active-bg, var(--t-stepper-bullet-active-bg, var(--t-primary, #0079c1))));--comp-bullet-font-color:var(--tct-stepper-bullet-active-font-color, var(--t-stepper-bullet-active-font-color, var(--t-primary-font-color, #ffffff)));--comp-bullet-size:var(--tct-stepper-btn-icon-size, var(--t-stepper-btn-icon-size, 24px));--comp-bullet-gap:var(--tct-stepper-btn-gap, var(--t-stepper-btn-gap, var(--app-scale-3x, 15px)));--comp-bullet-font-size:var-list(var-prefixer(stepper-btn-label-font-size), 16px);--comp-step-width:var(--tct-stepper-step-width, var(--t-stepper-step-width, var(--t-stepper-step-width, 80px)));--comp-step-gap:var(--tct-stepper-step-gap, var(--t-stepper-step-gap, 5px));--comp-btn-icon-size:var(--tct-stepper-btn-icon-size, var(--t-stepper-btn-icon-size, 24px));--comp-btn-label-font-size:var-list(var-prefixer(stepper-btn-label-font-size), 16px);--comp-tween:var(--tct-stepper-tween, var(--t-stepper-tween, var(--app-tween-1, 0.2s ease)));overflow-x:auto;display:flex;justify-content:center;list-style:none;padding:0;padding:var(--tct-stepper-list-padding, var(--t-stepper-list-padding, 2px));margin:0;gap:var(--comp-step-gap);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 3px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}ul::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}ul::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}ul::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}.has-scroll ul{justify-content:unset}li{min-height:var(--tct-stepper-min-height, var(--t-stepper-min-height, 50px));flex:0 0 auto;position:relative;width:var(--comp-step-width);text-align:center;max-width:150px;min-width:80px}.step-btn{position:relative;background:transparent;border:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;height:calc(100% - 4px);width:100%;transition:var(--comp-tween);padding:0;transition-property:box-shadow;outline:none;margin-top:2px;--comp-active-color:var(--comp-bullet-background)}.step-btn.status-complete{--comp-active-color:var(--const-stoplight-success, #0e8a00)}.step-btn.status-error{--comp-active-color:var(--const-stoplight-alert, #d20a0a)}.step-btn[aria-disabled]{cursor:not-allowed}.step-btn[aria-disabled],.step-btn[aria-disabled]+.step-divider{--comp-bullet-font-color:var(--tct-stepper-bullet-inactive-font-color, var(--t-stepper-bullet-inactive-font-color, var(--t-text, #4d4d4d)));--comp-bullet-background:var(--tct-stepper-bullet-inactive-background, var(--tct-stepper-bullet-inactive-bg, var(--t-stepper-bullet-inactive-bg, var(--t-gray-12, #d9d9d9))))}.step-icon,.step-bubble{display:flex;justify-content:center;align-items:center;line-height:0;margin:var(--comp-bullet-gap) auto;color:var(--comp-bullet-font-color);width:var(--comp-btn-icon-size);height:var(--comp-btn-icon-size);min-height:var(--comp-btn-icon-size);font-size:var(--comp-bullet-font-size);transition:var(--comp-tween);transition-property:background, color;border-radius:50%;position:relative}.step-icon q2-icon,.step-bubble q2-icon{--tct-icon-fill:var(--comp-active-color)}.step-icon q2-icon:before,.step-bubble q2-icon:before{content:"";display:block;background:var(--comp-bullet-font-color);position:absolute;width:80%;height:80%;left:11%;top:11%;border-radius:50%}.status-complete .step-icon,.status-error .step-icon,.status-complete .step-bubble,.status-error .step-bubble{background:var(--comp-active-color)}[aria-selected] .step-icon,[aria-selected] .step-bubble{box-shadow:0 0 0 2px var(--t-base, #ffffff), 0 0 0 4px var(--comp-active-color);font-weight:var(--tct-stepper-bullet-active-font-weight, var(--t-stepper-bullet-active-font-weight, 600))}.step-bubble{background:var(--comp-bullet-background)}.step-divider{width:calc(var(--comp-step-width) - var(--comp-step-gap) - var(--comp-bullet-gap) - var(--comp-bullet-size));top:calc(var(--comp-bullet-size) / 2 + var(--comp-bullet-gap));left:calc(var(--comp-step-width) * -0.5 + var(--comp-step-gap) + var(--comp-bullet-gap));border:0;border-top:1px solid var(--comp-bullet-background);height:0;position:absolute;margin:0;transition:border var(--comp-tween)}.step-container{position:relative}.step-label{color:var(--tct-stepper-label-color, var(--tct-stepper-title-color, var(--t-stepper-title-color, var(--t-text, #4d4d4d))));font-size:var(--tct-stepper-label-font-size, var(--tct-stepper-title-font-size, var(--t-stepper-title-font-size, var(--app-font-size-small, 12px))));line-height:var(--tct-stepper-label-line-height, 1.5em);text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-label-line-count, 2);-webkit-box-orient:vertical}[aria-selected] .step-label{font-weight:var(--tct-stepper-active-font-weight, var(--t-stepper-active-font-weight, 600))}[aria-describedby] .step-label{-webkit-line-clamp:var(--tct-stepper-label-line-count, 1)}.step-description{color:var(--tct-stepper-description-color, var(--t-stepper-description-color, var(--t-textA, rgba(77, 77, 77, 0.77))));font-size:var(--tct-stepper-description-font-size, var(--t-stepper-description-font-size, var(--app-font-size-small, 12px)));text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:var(--tct-stepper-description-line-count, 4);-webkit-box-orient:vertical;padding-bottom:0.2em}.step-description .ellipsize{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--comp-step-width);display:block}.gradient-left,.gradient-right{z-index:1;position:absolute;top:0;height:100%;width:18px}.gradient-left{background-image:linear-gradient(to left, var(--t-base-a0, rgba(255, 255, 255, 0)), var(--t-base-a2, rgba(255, 255, 255, 0.5)) 10%, var(--t-base, #ffffff) 100%);left:0}.gradient-right{background-image:linear-gradient(to right, var(--t-base-a0, rgba(255, 255, 255, 0)), var(--t-base-a2, rgba(255, 255, 255, 0.5)) 10%, var(--t-base, #ffffff) 100%);right:0}.btn-left,.btn-right{--tct-icon-size:18px;--tct-btn-icon-hover-background:transparent;--tct-btn-icon-width:22px;--tct-icon-stroke-primary:var(--tct-stepper-scroll-arrow-color, var(--t-stepper-scroll-arrow-color, var(--t-text, #4d4d4d)));position:absolute;top:calc(50% - 22px);z-index:2}.btn-left q2-icon,.btn-right q2-icon{--tct-icon-stroke-width:3}.btn-left{left:0}.btn-right{right:0}';const c=l;const p=class{constructor(r){t(this,r);this.change=e(this,"change",7);this.scheduledAfterRender=[];this.onSlotChange=()=>{this.checkForPanes();this.checkScrollState()};this.onScrollBtnClick=t=>{const e=Math.floor(this.listElement.clientWidth/2);this.listElement.scrollBy({left:t==="left"?-e:e,behavior:"smooth"})};this.onStepClick=(t,e)=>{t.stopPropagation();const{currentStep:r,stepCount:i,lastEnabledStep:o}=this;if(e>o||e===r)return;this.change.emit({selectedStep:e,lastEnabledStep:o,currentStep:r,stepCount:i})};this.onStepKeyDown=(t,e)=>{const{lastEnabledStep:r,stepCount:i}=this;const{key:o}=t;let s;switch(o){case"ArrowLeft":t.preventDefault();s=Math.max(e-1,0);break;case"ArrowRight":t.preventDefault();s=Math.min(e+1,i);break;case"Home":t.preventDefault();s=1;break;case"End":t.preventDefault();s=r;break}if(!s)return;this.focusStep(s,true)};this.checkForPanes=()=>{const{allPanes:t}=this;if(!t.length)return;this.stepCount=t.length};this.checkScrollState=()=>{if(!this.listElement)return;const{scrollLeft:t,scrollWidth:e,clientWidth:r}=this.listElement;this.scrollEnabled=e>r;this.showScrollLeft=!!t;this.showScrollRight=e!==t+r};this.currentStep=1;this.stepCount=undefined;this.lastEnabledStep=undefined;this.contentChangeTriggerCount=0;this.scrollEnabled=false;this.showScrollLeft=false;this.showScrollRight=false}componentWillLoad(){if(!this.lastEnabledStep)this.lastEnabledStep=this.currentStep||1;this.resizeObserver=new ResizeObserver((()=>this.checkScrollState()));this.checkForPanes()}componentDidLoad(){this.resizeObserver.observe(this.listElement);this.checkScrollState();s(this.hostElement);setTimeout((()=>this.showStep(this.currentStep||1)),0)}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}disconnectedCallback(){this.resizeObserver.disconnect()}currentStepChanged(t){this.showStep(t)}defaultChangeHandler(t){const{hostElement:e}=this;if(t.target===e&&!e.getAttribute("onchange")&&!!t.detail){this.currentStep=t.detail.selectedStep}}delegateFocus(t){if(!a(t,this.hostElement))return;this.focusStep(this.currentStep,true,true)}statusChangeHandler(t){const e=Array.from(this.allPanes).findIndex((e=>t.detail.id===e.id));if(e>-1){this.allPanes[e].status=t.detail.status;this.renderStepBtn(e)}}contentChangeHandler(){this.contentChangeTriggerCount+=1}get allPanes(){return this.hostElement.querySelectorAll("q2-stepper-pane")}showStep(t){if(t>this.lastEnabledStep){const{currentStep:e,stepCount:r}=this;this.lastEnabledStep=t;this.change.emit({selectedStep:null,lastEnabledStep:t,currentStep:e,stepCount:r})}this.scheduledAfterRender.push(this.resizeIframe);this.showStepPane(t);this.focusStep(t,this.scrollEnabled)}resizeIframe(){var t,e;return(e=(t=window===null||window===void 0?void 0:window.TectonElements)===null||t===void 0?void 0:t.resizeIframe)===null||e===void 0?void 0:e.call(t)}showStepPane(t){this.allPanes.forEach(((e,r)=>{e.isActive=t===r+1}))}focusStep(t,e,r){var i;const o=this.listElement.children[t-1];const s=document.activeElement===this.hostElement;if(!o)return;if(s||r){(i=o.firstElementChild)===null||i===void 0?void 0:i.focus()}if(e){const t=o.offsetLeft-this.listElement.clientWidth/2;this.listElement.scrollTo({left:t,behavior:"smooth"})}}getPaneSlotOrProperty(t,e){var r;const i=t.querySelector(`[slot="${e}"]`);return(r=i===null||i===void 0?void 0:i.outerHTML)!==null&&r!==void 0?r:n(t[e])}renderStepBtn(t){var e;const{allPanes:o,stepCount:s,currentStep:a,lastEnabledStep:l}=this;const c=(e=o===null||o===void 0?void 0:o[t])!==null&&e!==void 0?e:null;const{id:p,status:d}=c;const b=this.getPaneSlotOrProperty(c,"label");const h=this.getPaneSlotOrProperty(c,"description");const v=t+1;const u=v===a;const f=!!b&&`label-${p}`;const g=!!b&&!!h&&`description-${p}`;const m=!b&&n("tecton.element.stepper.number",[`${v}`,`${s}`]);let w;if(d==="complete")w="success-filled";else if(d==="error")w="warning-filled";const x=["step-btn"];if(d)x.push(`status-${d}`);const k=d==="locked";const y=k||v>l;return r("li",{role:"presentation"},r("button",{class:x.join(" "),type:"button","aria-labelledby":f,"aria-describedBy":g,"aria-label":m,"aria-selected":u,"aria-controls":p,"aria-disabled":y?"true":null,role:"tab",tabIndex:u?0:-1,onKeyDown:t=>this.onStepKeyDown(t,v),onClick:t=>!k&&this.onStepClick(t,v)},r(i,null,w?r("div",{class:"step-icon"},r("q2-icon",{type:w})):r("div",{class:"step-bubble"},v),f&&r("div",{class:"step-label",id:f,innerHTML:b}),f&&g&&r("div",{class:"step-description",id:g,innerHTML:h}))),t?r("div",{class:"step-divider"}):"")}render(){const{stepCount:t,scrollEnabled:e,showScrollLeft:o,showScrollRight:s}=this;const a=["step-container"];if(e)a.push("has-scroll");return r(i,{key:"0725d44fe3643cf8cfa22615c2e84c1b2d94c73a"},r("div",{key:"cce4ed1010c247e4a73a9875fd3ca3d2aff40308",class:a.join(" ")},e&&r(i,{key:"3308619f909ba2d72587e285502c1e5bde37eec1"},r("div",{key:"d41c11095e7710bd23a59dba23d1730c9a129782",class:"gradient-left",hidden:!o}),r("div",{key:"9537b4b2b45e388be063e623b01b271e6b6f952c",class:"gradient-right",hidden:!s}),r("q2-btn",{key:"4d6cc7e82d6ead7bcd5ec2a9cadb6c224bf54644",class:"btn-left",hidden:!this.showScrollLeft,onClick:()=>this.onScrollBtnClick("left")},r("q2-icon",{key:"cd9eb6d9868eafd32c84d3b60b6f798d3327e3f8",type:"chevron-left"})),r("q2-btn",{key:"61ef838d8648d998e5d69ee1b2b4d14659dcd43c",class:"btn-right",hidden:!this.showScrollRight,onClick:()=>this.onScrollBtnClick("right")},r("q2-icon",{key:"b6542d47f5eeb4c1208c1405d03b49199d7245f6",type:"chevron-right"}))),r("ul",{key:"3065e3524afc7071ec57260511c30bb769218998",onScroll:this.checkScrollState,ref:t=>this.listElement=t,role:"tablist"},t>0&&[...Array(t).keys()].map((t=>this.renderStepBtn(t))))),r("div",{key:"66838a87e2dcebe837fccc32557e1639a1f961fc"},r("slot",{key:"bdda7acf5353fd55e3f643826e30619f0b6f9bdf",onSlotchange:()=>this.onSlotChange()})))}get hostElement(){return o(this)}static get watchers(){return{currentStep:["currentStepChanged"]}}};p.style=c;export{p as q2_stepper};
+//# sourceMappingURL=p-bf125cdf.entry.js.map

package/dist/q2-tecton-elements/p-c4c458b7.entry.js

@@ -0,0 +1,2 @@
+import{r as t,a,h as r,F as s,g as e}from"./p-a5f18e27.js";import{c as n}from"./p-42302f6f.js";const d="standard";const o="standard";const c="standard";const i="standard";const l="legacy";const p="standard";const g="standard";const h="standard";const u="standard";const y="standard";const f="standard";const m="standard";const b="standard";const v="standard";const w="standard";const k="standard";const x="standard";const z="standard";const $="standard";const N="standard";const j="standard";const E="standard";const C="standard";const F="cards";const I="standard";const S="standard";const q="standard";const B="communication";const V="standard";const D="standard";const G="standard";const A="standard";const L="standard";const O="standard";const R="standard";const W="standard";const _="standard";const H="standard";const J="system";const K="standard";const M="standard";const P="standard";const Q="standard";const T="standard";const U="standard";const X="status";const Y="standard";const Z="standard";const tt="standard";const at="standard";const rt="standard";const st="standard";const et="standard";const nt="standard";const dt="standard";const ot="standard";const ct="standard";const it="standard";const lt="standard";const pt="standard";const gt="standard";const ht="standard";const ut="standard";const yt="status";const ft="legacy";const mt="standard";const bt="system";const vt="standard";const wt="standard";const kt="standard";const xt="standard";const zt="standard";const $t="standard";const Nt="standard";const jt="standard";const Et="standard";const Ct="standard";const Ft="standard";const It="standard";const St="standard";const qt="standard";const Bt="standard";const Vt="standard";const Dt="standard";const Gt="standard";const At="standard";const Lt="standard";const Ot="standard";const Rt="standard";const Wt="standard";const _t="standard";const Ht="standard";const Jt="standard";const Kt="standard";const Mt="standard";const Pt="standard";const Qt="standard";const Tt="mobile";const Ut="standard";const Xt="standard";const Yt="standard";const Zt="standard";const ta="standard";const aa="standard";const ra="standard";const sa="standard";const ea="standard";const na="standard";const da="legacy";const oa="standard";const ca="standard";const ia="standard";const la="standard";const pa="standard";const ga="standard";const ha="standard";const ua="standard";const ya="standard";const fa="standard";const ma="standard";const ba="standard";const va="standard";const wa="standard";const ka="standard";const xa="standard";const za="standard";const $a="standard";const Na="status";const ja="mobile";const Ea="standard";const Ca="standard";const Fa="standard";const Ia="standard";const Sa="standard";const qa="standard";const Ba="standard";const Va="standard";const Da="standard";const Ga="standard";const Aa="standard";const La="standard";const Oa="standard";const Ra="standard";const Wa="status";const _a="standard";const Ha="standard";const Ja={a11y:d,add:o,airplane:c,"alarm-clock":"standard",ambulance:i,android:l,apple:p,"arrow-down":"standard","arrow-left":"standard","arrow-right":"standard","arrow-up":"standard",arts:g,atv:h,backpack:u,bank:y,barchart:f,"barchart-trend":"standard",bed:m,bell:b,bicycle:v,boat:w,box:k,"brand-autobooks-color":"legacy","brand-autobooks-filled":"legacy","brand-facebook-color":"legacy","brand-facebook-filled":"legacy","brand-instagram-color":"legacy","brand-instagram-filled":"legacy","brand-linkedin-color":"legacy","brand-linkedin-filled":"legacy","brand-messenger-color":"legacy","brand-messenger-filled":"legacy","brand-payrecs-color":"legacy","brand-payrecs-filled":"legacy","brand-snapchat-color":"legacy","brand-snapchat-filled":"legacy","brand-twitter-color":"legacy","brand-twitter-filled":"legacy","brand-vimeo-color":"legacy","brand-vimeo-filled":"legacy","brand-x-color":"legacy","brand-x-filled":"legacy","brand-youtube-color":"legacy","brand-youtube-filled":"legacy","brand-zelle-color":"legacy","brand-zelle-filled":"legacy",briefcase:x,"browser-chrome":"legacy","browser-chrome-color":"legacy","browser-chrome-filled":"legacy","browser-edge":"legacy","browser-edge-color":"legacy","browser-edge-filled":"legacy","browser-firefox":"legacy","browser-firefox-color":"legacy","browser-firefox-filled":"legacy","browser-ie":"legacy","browser-ie-color":"legacy","browser-ie-filled":"legacy","browser-opera":"legacy","browser-opera-color":"legacy","browser-opera-filled":"legacy","browser-safari":"legacy","browser-safari-color":"legacy","browser-safari-filled":"legacy","bubble-graph":"standard",bug:z,buildings:$,"buildings-2":"standard",calculator:N,calendar:j,"calendar-confirm":"legacy","calendar-create":"standard","calendar-pay":"standard","calendar-remove":"standard","calendar-repeat":"standard","calendar-skip":"standard","calendar-time":"standard","call-color":"legacy","call-filled":"legacy",camera:E,car:C,"car-front":"standard",card:F,"card-add":"cards","card-amazon":"cards","card-amazon-color":"legacy","card-amex":"cards","card-amex-color":"legacy","card-applepay":"cards","card-applepay-color":"legacy","card-bitcoin":"cards","card-bitcoin-color":"legacy","card-dinersclub":"cards","card-dinersclub-color":"legacy","card-discover":"cards","card-discover-color":"legacy","card-edit":"cards","card-gift":"cards","card-googlepay":"cards","card-googlepay-color":"legacy","card-heart":"cards","card-in-hand":"cards","card-insert":"cards","card-jcb":"cards","card-jcb-color":"legacy","card-join":"cards","card-locked":"cards","card-maestro":"cards","card-maestro-color":"legacy","card-mastercard":"cards","card-mastercard-color":"legacy","card-more":"cards","card-paypal":"cards","card-paypal-color":"legacy","card-prohibited":"cards","card-remove":"cards","card-scissors":"cards","card-star":"cards","card-stripe":"cards","card-stripe-color":"legacy","card-success":"cards","card-unknown":"cards","card-update":"cards","card-visa":"cards","card-visa-color":"legacy",cart:I,"cart-moving":"standard",cash:S,"cash-bills":"standard","cash-coins":"standard","cash-in-hand":"standard","cash-register":"standard",certificate:q,chat:B,"chat-bubbles":"communication","chat-question":"communication","chat-round":"communication",check:V,"check-add":"standard","check-dollar":"standard","check-edit":"standard","check-remove":"standard","check-shield":"standard",checkmark:D,"checkmark-outline":"standard","chevron-double-left":"standard","chevron-double-right":"standard","chevron-down":"standard","chevron-left":"standard","chevron-right":"standard","chevron-up":"standard",clipboard:G,close:A,coins:L,compass:O,conversation:R,copy:W,coupon:_,"credit-score":"standard","currency-dollar":"currencies","currency-dollar-circle":"currencies","currency-euro":"currencies","currency-pound":"currencies","currency-yen":"currencies",dashboard:H,"delivery-truck":"standard",desktop:J,diploma:K,divider:M,document:P,"document-add":"standard","document-checklist":"standard","document-remove":"standard",download:Q,"drag-handle":"standard",edit:T,ellipsis:U,error:X,"error-filled":"status","external-link":"standard","eye-hide":"standard","eye-show":"standard","face-id":"standard",factory:Y,failed:Z,filebox:tt,"filetype-csv":"filetypes","filetype-doc":"filetypes","filetype-docx":"filetypes","filetype-generic":"filetypes","filetype-gif":"filetypes","filetype-iso":"filetypes","filetype-jpg":"filetypes","filetype-otf":"filetypes","filetype-pdf":"filetypes","filetype-png":"filetypes","filetype-ppt":"filetypes","filetype-svg":"filetypes","filetype-txt":"filetypes","filetype-xls":"filetypes","filetype-xlsx":"filetypes","filetype-xml":"filetypes",filter:at,fingerprint:rt,flag:st,gear:et,"gesture-hand":"gestures","gesture-scroll-horizontal":"gestures","gesture-scroll-vertical":"gestures","gesture-stretch":"gestures","gesture-swipe-down":"gestures","gesture-swipe-left":"gestures","gesture-swipe-right":"gestures","gesture-swipe-up":"gestures","gesture-tap":"gestures",gift:nt,"gold-bars":"standard",government:dt,gps:ot,"graduation-cap":"standard","grid-x2":"standard","grid-x3":"standard","hamburger-menu":"standard",hand:ct,"hand-with-coins":"standard","hand-with-key":"standard",handshake:it,headset:lt,health:pt,heart:gt,"heart-add":"standard","heart-remove":"standard",home:ht,"home-chimney":"standard","home-gear":"standard","id-badge":"standard",inbox:ut,"inbox-checked":"standard","inbox-full":"standard",info:yt,"info-filled":"status",ios:ft,key:mt,laptop:bt,law:vt,leaf:wt,lightbulb:kt,linechart:xt,"linechart-trend":"standard",link:zt,list:$t,location:Nt,"location-base":"standard","location-prohibited":"standard",lock:jt,logout:Et,loop:Ct,mail:Ft,math:It,medal:St,megaphone:qt,"message-forward":"standard","message-reply":"standard","message-response":"standard",microscope:Bt,"mobile-button":"mobile","mobile-edit":"mobile","mobile-fast-dollar":"standard","mobile-heart":"mobile","mobile-location":"mobile","mobile-lock":"mobile","mobile-remove":"mobile","mobile-rotate":"mobile","mobile-search":"mobile","mobile-settings":"mobile","mobile-time":"mobile","money-time":"standard",mortgage:Vt,motorcycle:Dt,motorhome:Gt,mountains:At,movie:Lt,music:Ot,"nest-egg":"standard",newspaper:Rt,options:Wt,"os-android":"legacy","os-android-color":"legacy","os-android-filled":"legacy","os-apple":"legacy","os-apple-color":"legacy","os-apple-filled":"legacy","os-windows":"legacy","os-windows-color":"legacy","os-windows-filled":"legacy",palette:_t,"paper-plane":"standard",paperclip:Ht,pause:Jt,paw:Kt,people:Mt,"people-group":"standard",percent:Pt,person:Qt,"person-add":"standard","person-lock":"standard","person-remove":"standard","person-settings":"standard","person-to-person":"standard","personal-care":"standard",phone:Tt,piechart:Ut,"piechart-expanded":"standard","piggy-bank":"standard",play:Xt,pricetag:Yt,"pricetag-blank":"standard","pricetag-time":"standard",print:Zt,prohibited:ta,question:aa,receipt:ra,"receipt-list":"standard","receipt-list-top":"standard","receipt-top":"standard",refresh:sa,remove:ea,repeat:na,"repeat-time":"standard",revert:da,ribbon:oa,ring:ca,roadblock:ia,"rss-color":"legacy","rss-filled":"legacy",save:la,school:pa,search:ga,section:ha,service:ua,shield:ya,sign:fa,"sign-closed":"standard","sign-open":"standard","sign-sale":"standard","sign-sold":"standard",silverware:ma,skip:ba,"sms-color":"legacy","sms-filled":"legacy",sort:va,speedometer:wa,split:ka,star:xa,"star-add":"standard","star-remove":"standard",statements:za,"steering-wheel":"standard","stop-payment":"standard",storefront:$a,"storefront-add":"standard","storefront-prohibited":"standard","storefront-remove":"standard","storefront-settings":"standard",success:Na,"success-filled":"status",tablet:ja,target:Ea,taxi:Ca,time:Fa,todo:Ia,tools:Sa,tractor:qa,transfer:Ba,"transfer-receive":"standard","transfer-send":"standard",trash:Va,tree:Da,"truck-with-lock":"standard",umbrella:Ga,unlink:Aa,upload:La,"venmo-colored":"legacy","venmo-filled":"legacy",virus:Oa,wallet:Ra,warning:Wa,"warning-filled":"status",watch:_a,world:Ha,"zoom-in":"standard","zoom-out":"standard"};const Ka="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline-block;height:var(--tct-icon-size, 24px);width:var(--tct-icon-size, 24px);position:relative;fill:none}:host([inline]){height:1em;width:1em}svg{display:block;position:absolute;top:0;left:0;stroke-width:var(--tct-icon-stroke-width, var(--t-icon-stroke-width, 1.5));stroke-linecap:var(--tct-icon-cap, var(--t-icon-cap, round));stroke-linejoin:var(--tct-icon-cap, var(--t-icon-cap, round));transition:var(--tct-icon-transition, none)}.stroke-primary{stroke:var(--tct-icon-stroke-primary, var(--t-icon-stroke-primary, var(--t-text, currentcolor)));transition:var(--tct-icon-stroke-primary-transition, none)}.stroke-secondary{stroke:var(--tct-icon-stroke-secondary, var(--t-icon-stroke-secondary, var(--t-text, currentcolor)));transition:var(--tct-icon-stroke-secondary-transition, none)}.fill-primary{fill:var(--tct-icon-stroke-primary, var(--t-icon-stroke-primary, var(--t-text, currentcolor)));transition:var(--tct-icon-stroke-primary-transition, none)}.fill-secondary{fill:var(--tct-icon-stroke-secondary, var(--t-icon-stroke-secondary, var(--t-text, currentcolor)));transition:var(--tct-icon-stroke-secondary-transition, none)}.filled{fill:var(--tct-icon-fill, var(--comp-icon-fill, var(--t-icon-fill, none)));transition:var(--tct-icon-fill-transition, none)}.uniform{fill:var(--tct-icon-stroke-primary, var(--t-icon-stroke-primary, currentcolor));transition:var(--tct-icon-stroke-primary-transition, none)}:host([type=info]),:host([type=info-filled]){--tct-icon-stroke-primary:transparent;--comp-status-color:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host([type=success]),:host([type=success-filled]){--tct-icon-stroke-primary:transparent;--comp-status-color:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=warning]),:host([type=warning-filled]){--tct-icon-stroke-primary:transparent;--comp-status-color:var(--tct-stoplight-warning, var(--const-stoplight-warning, #c35500))}:host([type=error]),:host([type=error-filled]){--tct-icon-stroke-primary:transparent;--comp-status-color:var(--tct-stoplight-alert, var(--const-stoplight-alert, #d20a0a))}";const Ma=Ka;const Pa=class{constructor(a){t(this,a);this.inline=undefined;this.label=undefined;this.type=undefined;this.iconClone=undefined}componentWillLoad(){this.handleIcon()}componentDidRender(){var t,a,r;if(!this.iconClone)return;(a=(t=this.spriteGroup)===null||t===void 0?void 0:t.firstElementChild)===null||a===void 0?void 0:a.remove();(r=this.spriteGroup)===null||r===void 0?void 0:r.appendChild(this.iconClone)}handleIcon(){var t,a;if(this.isCustom){this.setCustomSVGAttrs()}else if(this.type){this.fetchSprite()}else{this.iconClone=null;(a=(t=this.spriteGroup)===null||t===void 0?void 0:t.firstElementChild)===null||a===void 0?void 0:a.remove()}}get isCustom(){return this.type==="custom"}get spriteFileName(){if(this.isCustom)return;return Ja[this.type]}get spriteId(){const{spriteFileName:t}=this;if(!t)return;return`tecton-sprite-${t}`}get spriteElement(){const{spriteId:t}=this;if(!t)return;return document.querySelector(`#${t}`)}get spriteEventName(){const{spriteFileName:t}=this;if(!t)return;return`tct-loaded-${t}`}get iconCloneViewBox(){var t,a;return(a=(t=this.iconClone)===null||t===void 0?void 0:t.getAttribute("viewBox"))!==null&&a!==void 0?a:"0 0 24 24"}getOrCreateSpriteContainer(){const t="tecton-sprites";let a=document.querySelector(`#${t}`);if(a)return a;a=document.createElement("div");a.id=t;a.style.display="none";document.body.appendChild(a);return a}checkForSprite(){var t;const{spriteId:a,spriteEventName:r}=this;const s=this.getOrCreateSpriteContainer();let e=document.querySelector(`#${a}`);if((t=e===null||e===void 0?void 0:e.hasAttribute("data-loaded"))!==null&&t!==void 0?t:false){this.cloneSpriteNode();return true}s.addEventListener(r,(()=>{this.cloneSpriteNode()}),{once:true});if(e)return true;e=document.createElement("div");e.id=a;s.appendChild(e);return false}async fetchSprite(){const{spriteFileName:t,spriteId:r,spriteEventName:s}=this;const e=this.checkForSprite();if(e)return;if(!t)return;const n=a(`assets/${t}.symbol.svg`);const d=await fetch(n);const o=await d.text();const c=document.createElement("div");c.innerHTML=o;const i=c.querySelector("svg");i.id=r;i.setAttribute("data-loaded","");let{spriteElement:l}=this;if((l===null||l===void 0?void 0:l.tagName)==="SVG")return;if(typeof l.replaceWith==="function"){l.replaceWith(i)}else{l.parentNode.replaceChild(i,l)}l=document.querySelector(`#${r}`);l.dispatchEvent(new CustomEvent(s,{bubbles:true}))}cloneSpriteNode(){const t=this.getOrCreateSpriteContainer();const a=t.querySelector(`#tct-${this.type}`);this.iconClone=a?a.cloneNode(true):undefined}setCustomSVGAttrs(){const t=this.hostElement.querySelector("svg");if(!t)return;t.setAttribute("role","img");t.setAttribute("xmlns","http://www.w3.org/2000/svg");const{label:a}=this;if(a){const r=document.createElement("title");const s=`label-${n()}`;r.id=s;r.textContent=a;t.appendChild(r);t.setAttribute("aria-labelledby",s)}else{t.setAttribute("aria-hidden","true")}}render(){const{label:t,type:a}=this;return this.isCustom?r("slot",null):r("svg",{"aria-hidden":t?undefined:"true",role:"img","aria-labelledby":t?"label":undefined,viewBox:this.iconCloneViewBox,xmlns:"http://www.w3.org/2000/svg"},t&&r("title",{id:"label"},t),r(s,null,!!a&&r("use",{href:`#tct-${a}`}),r("g",{ref:t=>this.spriteGroup=t})))}static get assetsDirs(){return["assets"]}get hostElement(){return e(this)}static get watchers(){return{type:["handleIcon"]}}};Pa.style=Ma;export{Pa as q2_icon};
+//# sourceMappingURL=p-c4c458b7.entry.js.map

package/dist/q2-tecton-elements/p-c4c458b7.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["q2IconCss","Q2IconStyle0","Q2Icon","componentWillLoad","this","handleIcon","componentDidRender","iconClone","_b","_a","spriteGroup","firstElementChild","remove","_c","appendChild","isCustom","setCustomSVGAttrs","type","fetchSprite","spriteFileName","iconMap","spriteId","spriteElement","document","querySelector","spriteEventName","iconCloneViewBox","getAttribute","getOrCreateSpriteContainer","spriteContainerId","spriteContainer","createElement","id","style","display","body","checkForSprite","hasAttribute","cloneSpriteNode","addEventListener","once","spriteExists","spritePath","getAssetPath","response","fetch","data","text","wrappingDiv","innerHTML","svg","setAttribute","tagName","replaceWith","parentNode","replaceChild","dispatchEvent","CustomEvent","bubbles","spriteNode","cloneNode","undefined","innerSVG","hostElement","label","title","labelId","createGuid","textContent","render","h","role","viewBox","xmlns","Fragment","href","ref","el"],"sources":["src/components/q2-icon/q2-icon.scss?tag=q2-icon&encapsulation=shadow","src/components/q2-icon/q2-icon.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n    display: inline-block;\n    height: var(--tct-icon-size, 24px);\n    width: var(--tct-icon-size, 24px);\n    position: relative;\n    fill: none;\n}\n\n:host([inline]) {\n    height: 1em;\n    width: 1em;\n}\n\nsvg {\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    stroke-width: var-list(--tct-icon-stroke-width, --t-icon-stroke-width, 1.5);\n    stroke-linecap: var-list(--tct-icon-cap, --t-icon-cap, round);\n    stroke-linejoin: var-list(--tct-icon-cap, --t-icon-cap, round);\n    transition: var(--tct-icon-transition, none);\n}\n\n.stroke-primary {\n    stroke: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, --t-text, currentcolor);\n    transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n.stroke-secondary {\n    stroke: var-list(--tct-icon-stroke-secondary, --t-icon-stroke-secondary, --t-text, currentcolor);\n    transition: var(--tct-icon-stroke-secondary-transition, none);\n}\n\n.fill-primary {\n    fill: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, --t-text, currentcolor);\n    transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n.fill-secondary {\n    fill: var-list(--tct-icon-stroke-secondary, --t-icon-stroke-secondary, --t-text, currentcolor);\n    transition: var(--tct-icon-stroke-secondary-transition, none);\n}\n\n.filled {\n    fill: var-list(--tct-icon-fill, --comp-icon-fill, --t-icon-fill, none);\n    transition: var(--tct-icon-fill-transition, none);\n}\n\n.uniform {\n    fill: var-list(--tct-icon-stroke-primary, --t-icon-stroke-primary, currentcolor);\n    transition: var(--tct-icon-stroke-primary-transition, none);\n}\n\n:host([type='info']),\n:host([type='info-filled']) {\n    --tct-icon-stroke-primary: transparent;\n    --comp-status-color: #{var-list(--tct-stoplight-info, --const-stoplight-info, #0079c1)};\n}\n\n:host([type='success']),\n:host([type='success-filled']) {\n    --tct-icon-stroke-primary: transparent;\n    --comp-status-color: #{var-list(--tct-stoplight-success, --const-stoplight-success, #0e8a00)};\n}\n\n:host([type='warning']),\n:host([type='warning-filled']) {\n    --tct-icon-stroke-primary: transparent;\n    --comp-status-color: #{var-list(--tct-stoplight-warning, --const-stoplight-warning, #c35500)};\n}\n\n:host([type='error']),\n:host([type='error-filled']) {\n    --tct-icon-stroke-primary: transparent;\n    --comp-status-color: #{var-list(--tct-stoplight-alert, --const-stoplight-alert, #d20a0a)};\n}\n","import { Component, ComponentInterface, Prop, h, Element, Watch, getAssetPath, State, Fragment } from '@stencil/core';\nimport { createGuid } from 'src/utils';\nimport iconMap from './assets/icon-map.json';\n\n@Component({ tag: 'q2-icon', shadow: true, styleUrl: 'q2-icon.scss', assetsDirs: ['assets'] })\nexport class Q2Icon implements ComponentInterface {\n    /** Styles the component to have a `height` and `width` of `1em`, making it easy to place alongside text. */\n    @Prop({ reflect: true }) inline: boolean;\n\n    /** The text that is presented by screen-readers when they encounter the icon. */\n    @Prop({ reflect: true }) label: string;\n\n    /** The name of the icon to be displayed. */\n    @Prop({ reflect: true }) type: string;\n\n    @Element() hostElement: HTMLElement;\n\n    @State() iconClone: SVGSymbolElement;\n\n    spriteGroup: SVGElement;\n\n    componentWillLoad() {\n        this.handleIcon();\n    }\n\n    componentDidRender(): void {\n        if (!this.iconClone) return;\n        this.spriteGroup?.firstElementChild?.remove();\n        this.spriteGroup?.appendChild(this.iconClone);\n    }\n\n    @Watch('type')\n    handleIcon() {\n        if (this.isCustom) {\n            this.setCustomSVGAttrs();\n        } else if (this.type) {\n            this.fetchSprite();\n        } else {\n            this.iconClone = null;\n            this.spriteGroup?.firstElementChild?.remove();\n        }\n    }\n\n    get isCustom() {\n        return this.type === 'custom';\n    }\n\n    get spriteFileName() {\n        if (this.isCustom) return;\n        return iconMap[this.type];\n    }\n\n    get spriteId() {\n        const { spriteFileName } = this;\n        if (!spriteFileName) return;\n        return `tecton-sprite-${spriteFileName}`;\n    }\n\n    get spriteElement() {\n        const { spriteId } = this;\n        if (!spriteId) return;\n        return document.querySelector<HTMLElement>(`#${spriteId}`);\n    }\n\n    get spriteEventName() {\n        const { spriteFileName } = this;\n        if (!spriteFileName) return;\n        return `tct-loaded-${spriteFileName}`;\n    }\n\n    get iconCloneViewBox() {\n        return this.iconClone?.getAttribute('viewBox') ?? '0 0 24 24';\n    }\n\n    /**\n     * Checks for the sprite container element in the global DOM\n     * If it does not exist, it creates and appends it to the body\n     */\n    getOrCreateSpriteContainer() {\n        const spriteContainerId = 'tecton-sprites';\n        let spriteContainer: HTMLDivElement = document.querySelector(`#${spriteContainerId}`);\n\n        if (spriteContainer) return spriteContainer;\n        spriteContainer = document.createElement('div');\n        spriteContainer.id = spriteContainerId;\n        spriteContainer.style.display = 'none';\n        document.body.appendChild(spriteContainer);\n        return spriteContainer;\n    }\n\n    checkForSprite() {\n        const { spriteId, spriteEventName } = this;\n        const spriteContainer = this.getOrCreateSpriteContainer();\n        let spriteElement: HTMLElement = document.querySelector(`#${spriteId}`);\n\n        // If the sprite element exists and has the `data-loaded` attribute, we know we have everything we need\n        if (spriteElement?.hasAttribute('data-loaded') ?? false) {\n            this.cloneSpriteNode();\n            return true;\n        }\n\n        // If the sprite element exists but does not have the `data-loaded` attribute, we know it's being loaded\n        // We'll listen for the event that will be dispatched when the sprite is loaded\n        spriteContainer.addEventListener(\n            spriteEventName,\n            () => {\n                this.cloneSpriteNode();\n            },\n            { once: true }\n        );\n\n        // If the sprite element exists, we know it's being loaded and will be handled by the event listener\n        if (spriteElement) return true;\n\n        // If sprite element does not exist, create a placeholder\n        // This will let other icons know the sprite is being loaded\n        spriteElement = document.createElement('div');\n        spriteElement.id = spriteId;\n        spriteContainer.appendChild(spriteElement);\n        return false;\n    }\n\n    async fetchSprite() {\n        const { spriteFileName, spriteId, spriteEventName } = this;\n\n        const spriteExists = this.checkForSprite();\n        if (spriteExists) return;\n\n        if (!spriteFileName) return;\n        const spritePath = getAssetPath(`assets/${spriteFileName}.symbol.svg`);\n        const response = await fetch(spritePath);\n        const data = await response.text();\n        const wrappingDiv = document.createElement('div');\n        wrappingDiv.innerHTML = data;\n        const svg = wrappingDiv.querySelector('svg');\n\n        svg.id = spriteId;\n        svg.setAttribute('data-loaded', '');\n\n        let { spriteElement } = this;\n        if (spriteElement?.tagName === 'SVG') return;\n\n        if (typeof spriteElement.replaceWith === 'function') {\n            spriteElement.replaceWith(svg);\n        } else {\n            spriteElement.parentNode.replaceChild(svg, spriteElement);\n        }\n\n        spriteElement = document.querySelector(`#${spriteId}`);\n        spriteElement.dispatchEvent(new CustomEvent(spriteEventName, { bubbles: true }));\n    }\n\n    cloneSpriteNode() {\n        const spriteContainer = this.getOrCreateSpriteContainer();\n        const spriteNode = spriteContainer.querySelector<HTMLElement>(`#tct-${this.type}`);\n        this.iconClone = spriteNode ? (spriteNode.cloneNode(true) as SVGSymbolElement) : undefined;\n    }\n\n    setCustomSVGAttrs() {\n        const innerSVG = this.hostElement.querySelector('svg');\n\n        if (!innerSVG) return;\n\n        innerSVG.setAttribute('role', 'img');\n        innerSVG.setAttribute('xmlns', 'http://www.w3.org/2000/svg');\n\n        const { label } = this;\n        if (label) {\n            const title = document.createElement('title');\n            const labelId = `label-${createGuid()}`;\n            title.id = labelId;\n            title.textContent = label;\n            innerSVG.appendChild(title);\n            innerSVG.setAttribute('aria-labelledby', labelId);\n        } else {\n            innerSVG.setAttribute('aria-hidden', 'true');\n        }\n    }\n\n    render() {\n        const { label, type } = this;\n        return this.isCustom ? (\n            <slot />\n        ) : (\n            <svg\n                aria-hidden={label ? undefined : 'true'}\n                role=\"img\"\n                aria-labelledby={label ? 'label' : undefined}\n                viewBox={this.iconCloneViewBox}\n                xmlns=\"http://www.w3.org/2000/svg\"\n            >\n                {label && <title id=\"label\">{label}</title>}\n                <Fragment>\n                    {!!type && <use href={`#tct-${type}`} />}\n                    <g ref={el => (this.spriteGroup = el)}></g>\n                </Fragment>\n            </svg>\n        );\n    }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/p-d1a9ed3d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,g as i}from"./p-a5f18e27.js";import{f as s}from"./p-42302f6f.js";const n="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host([bordered]:not([bordered=false])) ::slotted(q2-item:not(:last-child)),:host([bordered]:not([bordered=false])) .header{border-bottom:var(--tct-list-item-separator, 1px solid #949494)}.header{--comp-default-header-padding:var(--app-scale-2x, 8px) var(--app-scale-4x, 16px);display:flex;gap:var(--app-scale-3x, 12px);padding:var(--tct-list-header-padding, var(--tct-item-padding, var(--comp-default-header-padding)));min-height:var(--tct-list-header-min-height, var(--t-list-header-min-height, 44px))}.header-spacebetween{justify-content:space-between}.header-start{justify-content:flex-start}.header-end{justify-content:flex-end}.header .label{width:100%;height:var(--tct-list-label-height, 44px);line-height:var(--tct-list-label-line-height, 44px);font-size:var(--tct-list-label-font-size, 16px);font-weight:var(--tct-list-label-font-weight, 600);color:var(--tct-list-label-font-color, var(--t-text, #4d4d4d))}.main{grid-column:2;grid-row:1}.main-no-action-nor-bullet{grid-column:1}.main-no-bullet{grid-column:1}";const o=n;const r=class{constructor(e){t(this,e);this.scheduledAfterRender=[];this.onMutationObserved=()=>{this.renderTrigger+=1;this.scheduledAfterRender.push((()=>{Array.from(this.hostElement.children).forEach((t=>{if(t.tagName==="Q2-ITEM")t.role="listitem"}))}))};this.label=undefined;this.renderTrigger=0;this.bordered=undefined}componentDidLoad(){if(typeof MutationObserver!=="undefined"){const t=new MutationObserver(this.onMutationObserved);t.observe(this.hostElement,{childList:true,subtree:true,attributes:true});this.mutationObserver=t;this.onMutationObserved()}}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}disconnectedCallback(){if(this.mutationObserver){this.mutationObserver.disconnect();this.mutationObserver=null}}get hasLabelContent(){return!!this.label}get hasFilterSlot(){return!!this.hostElement.querySelector("q2-pill")||s(this.hostElement,"pill")}get headerClasses(){const t=["header"];if(this.hasLabelContent&&this.hasFilterSlot){t.push("header-spacebetween")}else if(this.hasLabelContent&&!this.hasFilterSlot){t.push("header-start")}else if(!this.hasLabelContent&&this.hasFilterSlot){t.push("header-end")}return t.join(" ")}get listClasses(){const t=["list"];return t.join(" ")}render(){return e("div",{key:"37b0671ca94200f7e753f2b5e02a3dfd00efc6a3",class:this.listClasses,ref:t=>this.listElement=t},(this.hasFilterSlot||this.hasLabelContent)&&e("div",{key:"a00b89d9153d707f5b7a3c0aaea857e5d489caff",class:this.headerClasses},e("div",{key:"6ab05c1b898d8340526e9c45b457eb1920d37431",class:"label"},this.label),this.hasFilterSlot&&e("slot",{key:"cb491e1700fc4312aa65016f897c35501ada01ff",name:"filter"})),e("div",{key:"b5af288fd5a3b233f981f67156bf1fbb59e1326d",role:"list"},e("slot",{key:"3c48768066b42cecfc998506537a9447b5b61ff5"})))}get hostElement(){return i(this)}};r.style=o;export{r as q2_list};
+//# sourceMappingURL=p-d1a9ed3d.entry.js.map