q2-tecton-elements 1.44.0 → 1.44.1

package/dist/collection/components/q2-icon/q2-icon.css

@@ -79,8 +79,6 @@ button {
 }
 
 svg {
-  height: var(--tct-icon-size, 24px);
-  width: var(--tct-icon-size, 24px);
   display: block;
   position: absolute;
   top: 0;

package/dist/collection/components/q2-icon/q2-icon.js

@@ -65,6 +65,10 @@ export class Q2Icon {
     get iconMarkup() {
         return (icons[this.type] && icons[this.type].markup()) || '';
     }
+    get iconCloneViewBox() {
+        var _a, _b;
+        return (_b = (_a = this.iconClone) === null || _a === void 0 ? void 0 : _a.getAttribute('viewBox')) !== null && _b !== void 0 ? _b : '0 0 24 24';
+    }
     /**
      * Checks for the sprite container element in the global DOM
      * If it does not exist, it creates and appends it to the body
@@ -158,7 +162,7 @@ export class Q2Icon {
     }
     render() {
         const { label } = this;
-        return this.isCustom ? (h("slot", null)) : (h("svg", { "aria-hidden": this.label ? undefined : 'true', role: "img", "aria-labelledby": label ? 'label' : undefined, viewBox: this.beta ? undefined : '0 0 26 26', xmlns: "http://www.w3.org/2000/svg" }, label && h("title", { id: "label" }, label), this.beta ? (h(Fragment, null, !!this.type && h("use", { href: `#tct-${this.type}` }), h("g", { ref: el => (this.spriteGroup = el) }))) : (this.iconMarkup)));
+        return this.isCustom ? (h("slot", null)) : (h("svg", { "aria-hidden": this.label ? undefined : 'true', role: "img", "aria-labelledby": label ? 'label' : undefined, viewBox: this.beta ? this.iconCloneViewBox : '0 0 26 26', xmlns: "http://www.w3.org/2000/svg" }, label && h("title", { id: "label" }, label), this.beta ? (h(Fragment, null, !!this.type && h("use", { href: `#tct-${this.type}` }), h("g", { ref: el => (this.spriteGroup = el) }))) : (this.iconMarkup)));
     }
     static get is() { return "q2-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/q2-icon/q2-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"q2-icon.js","sourceRoot":"","sources":["../../../../src/components/q2-icon/q2-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["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';\nimport icons from './icons';\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    /**\n     * @private\n     */\n    @Prop({ reflect: true, mutable: true }) beta: boolean = window.TectonElements?.beta || false;\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.beta) return;\n        if (!this.iconClone) return;\n        this.spriteGroup?.firstElementChild?.remove();\n        this.spriteGroup?.appendChild(this.iconClone);\n    }\n\n    @Watch('beta')\n    @Watch('type')\n    handleIcon() {\n        if (this.isCustom) {\n            this.setCustomSVGAttrs();\n        } else if (this.type && this.beta) {\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 iconMarkup() {\n        return (icons[this.type] && icons[this.type].markup()) || '';\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 to 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 } = this;\n        return this.isCustom ? (\n            <slot />\n        ) : (\n            <svg\n                aria-hidden={this.label ? undefined : 'true'}\n                role=\"img\"\n                aria-labelledby={label ? 'label' : undefined}\n                viewBox={this.beta ? undefined : '0 0 26 26'}\n                xmlns=\"http://www.w3.org/2000/svg\"\n            >\n                {label && <title id=\"label\">{label}</title>}\n                {this.beta ? (\n                    <Fragment>\n                        {!!this.type && <use href={`#tct-${this.type}`} />}\n                        <g ref={el => (this.spriteGroup = el)}></g>\n                    </Fragment>\n                ) : (\n                    this.iconMarkup\n                )}\n            </svg>\n        );\n    }\n}\n"]}
+{"version":3,"file":"q2-icon.js","sourceRoot":"","sources":["../../../../src/components/q2-icon/q2-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["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';\nimport icons from './icons';\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    /**\n     * @private\n     */\n    @Prop({ reflect: true, mutable: true }) beta: boolean = window.TectonElements?.beta || false;\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.beta) return;\n        if (!this.iconClone) return;\n        this.spriteGroup?.firstElementChild?.remove();\n        this.spriteGroup?.appendChild(this.iconClone);\n    }\n\n    @Watch('beta')\n    @Watch('type')\n    handleIcon() {\n        if (this.isCustom) {\n            this.setCustomSVGAttrs();\n        } else if (this.type && this.beta) {\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 iconMarkup() {\n        return (icons[this.type] && icons[this.type].markup()) || '';\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 to 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 } = this;\n        return this.isCustom ? (\n            <slot />\n        ) : (\n            <svg\n                aria-hidden={this.label ? undefined : 'true'}\n                role=\"img\"\n                aria-labelledby={label ? 'label' : undefined}\n                viewBox={this.beta ? this.iconCloneViewBox : '0 0 26 26'}\n                xmlns=\"http://www.w3.org/2000/svg\"\n            >\n                {label && <title id=\"label\">{label}</title>}\n                {this.beta ? (\n                    <Fragment>\n                        {!!this.type && <use href={`#tct-${this.type}`} />}\n                        <g ref={el => (this.spriteGroup = el)}></g>\n                    </Fragment>\n                ) : (\n                    this.iconMarkup\n                )}\n            </svg>\n        );\n    }\n}\n"]}

package/dist/collection/components/q2-input/q2-input.js

@@ -1175,7 +1175,7 @@ export class Q2Input {
                     "references": {
                         "InputType": {
                             "location": "local",
-                            "path": "/workspace/workspace/_Gitlab_tecton-production_master/packages/q2-tecton-elements/src/components/q2-input/q2-input.tsx",
+                            "path": "/workspace/workspace/tecton-production_release_1.44.x/packages/q2-tecton-elements/src/components/q2-input/q2-input.tsx",
                             "id": "src/components/q2-input/q2-input.tsx::InputType"
                         }
                     }

package/dist/collection/components/q2-option-list/q2-option-list.js

@@ -659,7 +659,7 @@ export class Q2OptionList {
                     "references": {
                         "IOptionValue": {
                             "location": "local",
-                            "path": "/workspace/workspace/_Gitlab_tecton-production_master/packages/q2-tecton-elements/src/components/q2-option-list/q2-option-list.tsx",
+                            "path": "/workspace/workspace/tecton-production_release_1.44.x/packages/q2-tecton-elements/src/components/q2-option-list/q2-option-list.tsx",
                             "id": "src/components/q2-option-list/q2-option-list.tsx::IOptionValue"
                         }
                     }
@@ -731,7 +731,7 @@ export class Q2OptionList {
                     "references": {
                         "IOptionValue": {
                             "location": "local",
-                            "path": "/workspace/workspace/_Gitlab_tecton-production_master/packages/q2-tecton-elements/src/components/q2-option-list/q2-option-list.tsx",
+                            "path": "/workspace/workspace/tecton-production_release_1.44.x/packages/q2-tecton-elements/src/components/q2-option-list/q2-option-list.tsx",
                             "id": "src/components/q2-option-list/q2-option-list.tsx::IOptionValue"
                         }
                     }

package/dist/collection/components/q2-stepper-pane/q2-stepper-pane.js

@@ -197,7 +197,7 @@ export class Q2StepperPane {
                     "references": {
                         "IStepperPaneEvent": {
                             "location": "local",
-                            "path": "/workspace/workspace/_Gitlab_tecton-production_master/packages/q2-tecton-elements/src/components/q2-stepper-pane/q2-stepper-pane.tsx",
+                            "path": "/workspace/workspace/tecton-production_release_1.44.x/packages/q2-tecton-elements/src/components/q2-stepper-pane/q2-stepper-pane.tsx",
                             "id": "src/components/q2-stepper-pane/q2-stepper-pane.tsx::IStepperPaneEvent"
                         }
                     }
@@ -218,7 +218,7 @@ export class Q2StepperPane {
                     "references": {
                         "IStepperPaneEvent": {
                             "location": "local",
-                            "path": "/workspace/workspace/_Gitlab_tecton-production_master/packages/q2-tecton-elements/src/components/q2-stepper-pane/q2-stepper-pane.tsx",
+                            "path": "/workspace/workspace/tecton-production_release_1.44.x/packages/q2-tecton-elements/src/components/q2-stepper-pane/q2-stepper-pane.tsx",
                             "id": "src/components/q2-stepper-pane/q2-stepper-pane.tsx::IStepperPaneEvent"
                         }
                     }

package/dist/components/q2-icon2.js

@@ -1,18 +1,18 @@
 import { h, proxyCustomElement, HTMLElement, getAssetPath, Fragment } from '@stencil/core/internal/client';
 import { c as createGuid } from './index2.js';
 
-const android = "legacy";
 const desktop = "system";
+const android = "legacy";
 const a11y = "standard";
 const error = "status";
 const laptop = "system";
 const add = "standard";
 const airplane = "standard";
-const info = "status";
 const chat = "communication";
+const info = "status";
 const ambulance = "standard";
-const success = "status";
 const apple = "standard";
+const success = "status";
 const warning = "status";
 const arts = "standard";
 const phone = "mobile";
@@ -39,18 +39,18 @@ const cash = "standard";
 const certificate = "standard";
 const check = "standard";
 const checkmark = "standard";
-const ios = "legacy";
 const clipboard = "standard";
 const close = "standard";
+const ios = "legacy";
 const coins = "standard";
 const compass = "standard";
 const conversation = "standard";
 const copy = "standard";
 const coupon = "standard";
 const dashboard = "standard";
-const revert = "legacy";
 const diploma = "standard";
 const divider = "standard";
+const revert = "legacy";
 const document$1 = "standard";
 const download = "standard";
 const edit = "standard";
@@ -148,154 +148,154 @@ const wallet = "standard";
 const watch = "standard";
 const world = "standard";
 const iconMap = {
-	"card-add": "cards",
-	"filetype-csv": "filetypes",
 	"chat-bubbles": "communication",
+	"card-add": "cards",
 	"currency-dollar-circle": "currencies",
-	"gesture-hand": "gestures",
-	android: android,
+	"filetype-csv": "filetypes",
 	"error-filled": "status",
+	"gesture-hand": "gestures",
 	desktop: desktop,
-	a11y: a11y,
 	"mobile-button": "mobile",
-	"filetype-doc": "filetypes",
+	android: android,
+	a11y: a11y,
 	"currency-dollar": "currencies",
 	"chat-question": "communication",
-	"gesture-scroll-horizontal": "gestures",
+	"filetype-doc": "filetypes",
 	error: error,
-	"brand-autobooks-color": "legacy",
-	"card-amazon": "cards",
 	laptop: laptop,
-	add: add,
+	"card-amazon": "cards",
+	"gesture-scroll-horizontal": "gestures",
 	"mobile-edit": "mobile",
-	"filetype-docx": "filetypes",
-	"currency-euro": "currencies",
-	"gesture-scroll-vertical": "gestures",
+	"brand-autobooks-color": "legacy",
+	add: add,
 	"chat-round": "communication",
+	"currency-euro": "currencies",
+	"filetype-docx": "filetypes",
 	"info-filled": "status",
-	"brand-autobooks-filled": "legacy",
-	airplane: airplane,
-	"mobile-heart": "mobile",
 	"card-amex": "cards",
-	"filetype-generic": "filetypes",
-	"gesture-stretch": "gestures",
-	info: info,
+	"mobile-heart": "mobile",
+	"gesture-scroll-vertical": "gestures",
+	airplane: airplane,
+	"brand-autobooks-filled": "legacy",
 	chat: chat,
 	"currency-pound": "currencies",
-	"brand-facebook-color": "legacy",
-	"alarm-clock": "standard",
-	"mobile-location": "mobile",
+	info: info,
+	"filetype-generic": "filetypes",
 	"card-applepay": "cards",
-	"filetype-gif": "filetypes",
-	"success-filled": "status",
-	"gesture-swipe-down": "gestures",
+	"mobile-location": "mobile",
+	"alarm-clock": "standard",
+	"gesture-stretch": "gestures",
+	"brand-facebook-color": "legacy",
 	"currency-yen": "currencies",
-	"brand-facebook-filled": "legacy",
-	ambulance: ambulance,
+	"success-filled": "status",
+	"filetype-gif": "filetypes",
 	"card-bitcoin": "cards",
 	"mobile-lock": "mobile",
+	ambulance: ambulance,
+	"gesture-swipe-down": "gestures",
+	"brand-facebook-filled": "legacy",
 	"filetype-iso": "filetypes",
-	success: success,
+	"mobile-remove": "mobile",
+	apple: apple,
 	"gesture-swipe-left": "gestures",
 	"brand-instagram-color": "legacy",
+	success: success,
 	"card-dinersclub": "cards",
-	apple: apple,
-	"mobile-remove": "mobile",
 	"filetype-jpg": "filetypes",
+	"arrow-down": "standard",
 	"gesture-swipe-right": "gestures",
-	"brand-instagram-filled": "legacy",
-	"card-discover": "cards",
 	"mobile-rotate": "mobile",
-	"arrow-down": "standard",
+	"brand-instagram-filled": "legacy",
 	"warning-filled": "status",
-	"gesture-swipe-up": "gestures",
+	"card-discover": "cards",
 	"filetype-otf": "filetypes",
-	"brand-linkedin-color": "legacy",
-	"card-edit": "cards",
 	"arrow-left": "standard",
+	"gesture-swipe-up": "gestures",
 	"mobile-search": "mobile",
+	"brand-linkedin-color": "legacy",
+	"card-edit": "cards",
 	warning: warning,
-	"gesture-tap": "gestures",
-	"brand-linkedin-filled": "legacy",
 	"filetype-pdf": "filetypes",
-	"card-gift": "cards",
+	"gesture-tap": "gestures",
 	"arrow-right": "standard",
+	"brand-linkedin-filled": "legacy",
 	"mobile-settings": "mobile",
-	"brand-messenger-color": "legacy",
+	"card-gift": "cards",
 	"filetype-png": "filetypes",
 	"arrow-up": "standard",
+	"brand-messenger-color": "legacy",
 	"mobile-time": "mobile",
 	"card-googlepay": "cards",
 	"filetype-ppt": "filetypes",
 	arts: arts,
 	"brand-messenger-filled": "legacy",
 	phone: phone,
+	"filetype-svg": "filetypes",
 	"card-heart": "cards",
 	atv: atv,
 	"brand-payrecs-color": "legacy",
-	"filetype-svg": "filetypes",
 	tablet: tablet,
+	"filetype-txt": "filetypes",
+	backpack: backpack,
 	"card-in-hand": "cards",
 	"brand-payrecs-filled": "legacy",
-	backpack: backpack,
-	"card-insert": "cards",
-	"filetype-txt": "filetypes",
-	"brand-snapchat-color": "legacy",
-	bank: bank,
 	"filetype-xls": "filetypes",
-	"card-jcb": "cards",
+	bank: bank,
+	"brand-snapchat-color": "legacy",
+	"filetype-xlsx": "filetypes",
+	"card-insert": "cards",
 	"barchart-trend": "standard",
 	"brand-snapchat-filled": "legacy",
-	"filetype-xlsx": "filetypes",
-	"card-join": "cards",
+	"filetype-xml": "filetypes",
+	"card-jcb": "cards",
 	barchart: barchart,
 	"brand-twitter-color": "legacy",
-	"filetype-xml": "filetypes",
-	"card-locked": "cards",
+	"card-join": "cards",
 	bed: bed,
 	"brand-twitter-filled": "legacy",
-	"card-maestro": "cards",
+	"card-locked": "cards",
 	bell: bell,
 	"brand-vimeo-color": "legacy",
-	"card-mastercard": "cards",
-	"brand-vimeo-filled": "legacy",
+	"card-maestro": "cards",
 	bicycle: bicycle,
-	"card-more": "cards",
+	"brand-vimeo-filled": "legacy",
+	"card-mastercard": "cards",
 	boat: boat,
 	"brand-x-color": "legacy",
+	"card-more": "cards",
 	box: box,
-	"card-paypal": "cards",
 	"brand-x-filled": "legacy",
-	"card-prohibited": "cards",
+	"card-paypal": "cards",
 	briefcase: briefcase,
 	"brand-youtube-color": "legacy",
-	"card-remove": "cards",
-	"brand-youtube-filled": "legacy",
+	"card-prohibited": "cards",
 	"bubble-graph": "standard",
-	"card-scissors": "cards",
-	"brand-zelle-color": "legacy",
+	"brand-youtube-filled": "legacy",
+	"card-remove": "cards",
 	bug: bug,
-	"card-star": "cards",
-	"brand-zelle-filled": "legacy",
+	"brand-zelle-color": "legacy",
+	"card-scissors": "cards",
 	"buildings-2": "standard",
-	"card-stripe": "cards",
-	"browser-chrome-color": "legacy",
+	"brand-zelle-filled": "legacy",
+	"card-star": "cards",
 	buildings: buildings,
-	"card-success": "cards",
-	"browser-chrome-filled": "legacy",
+	"browser-chrome-color": "legacy",
+	"card-stripe": "cards",
 	calculator: calculator,
-	"card-unknown": "cards",
-	"browser-chrome": "legacy",
+	"browser-chrome-filled": "legacy",
+	"card-success": "cards",
 	"calendar-create": "standard",
-	"card-update": "cards",
-	"browser-edge-color": "legacy",
+	"browser-chrome": "legacy",
+	"card-unknown": "cards",
 	"calendar-pay": "standard",
-	"card-visa": "cards",
-	"browser-edge-filled": "legacy",
+	"browser-edge-color": "legacy",
+	"card-update": "cards",
 	"calendar-remove": "standard",
-	card: card,
-	"browser-edge": "legacy",
+	"browser-edge-filled": "legacy",
+	"card-visa": "cards",
 	"calendar-repeat": "standard",
+	"browser-edge": "legacy",
+	card: card,
 	"calendar-skip": "standard",
 	"browser-firefox-color": "legacy",
 	"calendar-time": "standard",
@@ -306,8 +306,8 @@ const iconMap = {
 	"browser-ie-color": "legacy",
 	"car-front": "standard",
 	"browser-ie-filled": "legacy",
-	"browser-ie": "legacy",
 	car: car,
+	"browser-ie": "legacy",
 	"cart-moving": "standard",
 	"browser-opera-color": "legacy",
 	cart: cart,
@@ -317,75 +317,75 @@ const iconMap = {
 	"cash-coins": "standard",
 	"browser-safari-color": "legacy",
 	"cash-in-hand": "standard",
-	"browser-safari-filled": "legacy",
 	"cash-register": "standard",
-	"browser-safari": "legacy",
+	"browser-safari-filled": "legacy",
 	cash: cash,
-	"calendar-confirm": "legacy",
+	"browser-safari": "legacy",
 	certificate: certificate,
-	"call-color": "legacy",
+	"calendar-confirm": "legacy",
 	"check-add": "standard",
-	"call-filled": "legacy",
+	"call-color": "legacy",
 	"check-dollar": "standard",
-	"card-amazon-color": "legacy",
+	"call-filled": "legacy",
 	"check-edit": "standard",
-	"card-amex-color": "legacy",
+	"card-amazon-color": "legacy",
 	"check-remove": "standard",
+	"card-amex-color": "legacy",
+	"check-shield": "standard",
 	"card-applepay-color": "legacy",
+	check: check,
 	"card-bitcoin-color": "legacy",
-	"check-shield": "standard",
+	"checkmark-outline": "standard",
 	"card-dinersclub-color": "legacy",
-	check: check,
+	checkmark: checkmark,
+	"chevron-double-left": "standard",
 	"card-discover-color": "legacy",
-	"checkmark-outline": "standard",
+	"chevron-double-right": "standard",
 	"card-googlepay-color": "legacy",
-	checkmark: checkmark,
+	"chevron-down": "standard",
 	"card-jcb-color": "legacy",
-	"chevron-double-left": "standard",
+	"chevron-left": "standard",
 	"card-maestro-color": "legacy",
-	"chevron-double-right": "standard",
+	"chevron-right": "standard",
 	"card-mastercard-color": "legacy",
-	"chevron-down": "standard",
+	"chevron-up": "standard",
 	"card-paypal-color": "legacy",
-	"chevron-left": "standard",
 	"card-stripe-color": "legacy",
-	"chevron-right": "standard",
+	clipboard: clipboard,
 	"card-visa-color": "legacy",
-	"chevron-up": "standard",
+	close: close,
 	ios: ios,
-	clipboard: clipboard,
+	coins: coins,
 	"os-android-color": "legacy",
-	close: close,
+	compass: compass,
 	"os-android-filled": "legacy",
-	coins: coins,
+	conversation: conversation,
 	"os-android": "legacy",
-	compass: compass,
+	copy: copy,
 	"os-apple-color": "legacy",
-	conversation: conversation,
+	coupon: coupon,
 	"os-apple-filled": "legacy",
-	copy: copy,
+	"credit-score": "standard",
 	"os-apple": "legacy",
-	coupon: coupon,
+	dashboard: dashboard,
+	"delivery-truck": "standard",
 	"os-windows-color": "legacy",
-	"credit-score": "standard",
+	diploma: diploma,
 	"os-windows-filled": "legacy",
-	dashboard: dashboard,
+	divider: divider,
 	"os-windows": "legacy",
-	"delivery-truck": "standard",
+	"document-add": "standard",
 	revert: revert,
-	diploma: diploma,
+	"document-checklist": "standard",
 	"rss-color": "legacy",
-	divider: divider,
+	"document-remove": "standard",
 	"rss-filled": "legacy",
-	"document-add": "standard",
+	document: document$1,
 	"sms-color": "legacy",
-	"document-checklist": "standard",
+	download: download,
 	"sms-filled": "legacy",
-	"document-remove": "standard",
 	"venmo-colored": "legacy",
-	document: document$1,
 	"venmo-filled": "legacy",
-	download: download,
 	"drag-handle": "standard",
 	edit: edit,
 	ellipsis: ellipsis,
@@ -3436,7 +3436,7 @@ const icons = {
     },
 };
 
-const q2IconCss = "*{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{height:var(--tct-icon-size, 24px);width:var(--tct-icon-size, 24px);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-icon-fill:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host([type=success]),:host([type=success-filled]){--tct-icon-stroke-primary:transparent;--comp-icon-fill:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=warning]),:host([type=warning-filled]){--tct-icon-stroke-primary:transparent;--comp-icon-fill:var(--tct-stoplight-warning, var(--const-stoplight-warning, #c35500))}:host([type=error]),:host([type=error-filled]){--tct-icon-stroke-primary:transparent;--comp-icon-fill:var(--tct-stoplight-alert, var(--const-stoplight-alert, #d20a0a))}";
+const q2IconCss = "*{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-icon-fill:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host([type=success]),:host([type=success-filled]){--tct-icon-stroke-primary:transparent;--comp-icon-fill:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=warning]),:host([type=warning-filled]){--tct-icon-stroke-primary:transparent;--comp-icon-fill:var(--tct-stoplight-warning, var(--const-stoplight-warning, #c35500))}:host([type=error]),:host([type=error-filled]){--tct-icon-stroke-primary:transparent;--comp-icon-fill:var(--tct-stoplight-alert, var(--const-stoplight-alert, #d20a0a))}";
 const Q2IconStyle0 = q2IconCss;
 
 const Q2Icon = /*@__PURE__*/ proxyCustomElement(class Q2Icon extends HTMLElement {
@@ -3505,6 +3505,10 @@ const Q2Icon = /*@__PURE__*/ proxyCustomElement(class Q2Icon extends HTMLElement
     get iconMarkup() {
         return (icons[this.type] && icons[this.type].markup()) || '';
     }
+    get iconCloneViewBox() {
+        var _a, _b;
+        return (_b = (_a = this.iconClone) === null || _a === void 0 ? void 0 : _a.getAttribute('viewBox')) !== null && _b !== void 0 ? _b : '0 0 24 24';
+    }
     /**
      * Checks for the sprite container element in the global DOM
      * If it does not exist, it creates and appends it to the body
@@ -3598,7 +3602,7 @@ const Q2Icon = /*@__PURE__*/ proxyCustomElement(class Q2Icon extends HTMLElement
     }
     render() {
         const { label } = this;
-        return this.isCustom ? (h("slot", null)) : (h("svg", { "aria-hidden": this.label ? undefined : 'true', role: "img", "aria-labelledby": label ? 'label' : undefined, viewBox: this.beta ? undefined : '0 0 26 26', xmlns: "http://www.w3.org/2000/svg" }, label && h("title", { id: "label" }, label), this.beta ? (h(Fragment, null, !!this.type && h("use", { href: `#tct-${this.type}` }), h("g", { ref: el => (this.spriteGroup = el) }))) : (this.iconMarkup)));
+        return this.isCustom ? (h("slot", null)) : (h("svg", { "aria-hidden": this.label ? undefined : 'true', role: "img", "aria-labelledby": label ? 'label' : undefined, viewBox: this.beta ? this.iconCloneViewBox : '0 0 26 26', xmlns: "http://www.w3.org/2000/svg" }, label && h("title", { id: "label" }, label), this.beta ? (h(Fragment, null, !!this.type && h("use", { href: `#tct-${this.type}` }), h("g", { ref: el => (this.spriteGroup = el) }))) : (this.iconMarkup)));
     }
     static get assetsDirs() { return ["assets"]; }
     get hostElement() { return this; }