q2-tecton-elements 1.51.0 → 1.52.0

package/dist/q2-tecton-elements/q2-avatar.entry.js

@@ -0,0 +1,101 @@
+import { r as a, h as t, g as r } from "./index-7a5365e2.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(t) {
+    a(this, t);
+    this.onError = () => {
+      this.badSrc = true;
+    };
+    this.onLoad = () => {
+      this.isLoaded = true;
+    };
+    this.badSrc = false;
+    this.isLoaded = false;
+    this.icon = "person";
+    this.initials = undefined;
+    this.name = undefined;
+    this.src = undefined;
+  }
+  // #endregion
+  // #region Watchers
+  srcDidUpdate() {
+    this.badSrc = false;
+  }
+  // #endregion
+  // #region Local Methods
+  get computedInitials() {
+    const {initials: a, name: t} = this;
+    if (!a && !t) return;
+    let r = "";
+    if (a) {
+      r = a.substr(0, 4);
+    } else if (t) {
+      const a = t.split(" ");
+      const i = a[0][0];
+      const e = a.length > 1 ? a[a.length - 1][0] : undefined;
+      r += i;
+      if (e) r += e;
+    }
+    r = r === null || r === void 0 ? void 0 : r.toUpperCase();
+    return r;
+  }
+  // #endregion
+  // #region Render Methods
+  render() {
+    const {computedInitials: a} = 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 t("div", {
+      key: "2377fb1226c542252d8c1826aa762cc0267bb8a2"
+    }, r && t("img", {
+      key: "baa5c36dd4be833bd017daa75b57dc0cf9ea01bf",
+      class: i ? "avatar-img" : "avatar-img-default",
+      "test-id": "userImage",
+      src: this.src,
+      onError: this.onError,
+      onLoad: this.onLoad,
+      alt: this.name || ""
+    }), e && t("svg", {
+      key: "d4977d3adf04544ed9f13b079abfa2a2e1ce3a56",
+      viewBox: "0 0 100 100",
+      preserveAspectRatio: "xMidYMid meet",
+      "test-id": "userInitials",
+      class: `avatar-initials size-${a.length}`,
+      "aria-label": this.name,
+      "aria-hidden": !this.name && "true"
+    }, t("text", {
+      key: "8de6490d4949b8f20beef384ba78c371edf1d81a",
+      x: "50",
+      y: "50",
+      "dominant-baseline": "central",
+      "text-anchor": "middle",
+      "aria-hidden": "true"
+    }, a)), c && t("div", {
+      key: "9946f0f312626acb2693ef058b98480a5c4011ed",
+      "test-id": "fallbackIcon",
+      class: "fallback"
+    }, t("q2-icon", {
+      key: "d6c99a8f8b12216c7a00d936f22ec7ac49aec151",
+      type: this.icon
+    })));
+  }
+  get el() {
+    return r(this);
+  }
+  static get watchers() {
+    return {
+      src: [ "srcDidUpdate" ]
+    };
+  }
+};
+
+c.style = e;
+
+export { c as q2_avatar };
+//# sourceMappingURL=q2-avatar.entry.js.map

package/dist/q2-tecton-elements/{p-07d1c3ae.entry.js.map → q2-avatar.entry.js.map}

@@ -1 +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    // #region Host HTML Element\n\n    @Element()\n    el: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    badSrc: boolean = false;\n\n    @State()\n    isLoaded: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /** A [q2-icon](https://tecton.q2developer.com/design-system/q2-icon/) to display as the fallback. */\n    @Prop()\n    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 })\n    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 })\n    name: string;\n\n    /**  Displays the image provided by the user. */\n    @Prop({ reflect: true })\n    src: string;\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('src')\n    srcDidUpdate() {\n        this.badSrc = false;\n    }\n\n    // #endregion\n    // #region Local Methods\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    onError = () => {\n        this.badSrc = true;\n    };\n\n    onLoad = () => {\n        this.isLoaded = true;\n    };\n\n    // #endregion\n    // #region Render Methods\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    // #endregion\n}\n"],"mappings":"kDAAA,MAAMA,EAAc,oyFACpB,MAAAC,EAAeD,E,MCEFE,EAAQ,M,yBAuEjBC,KAAAC,QAAU,KACND,KAAKE,OAAS,IAAI,EAGtBF,KAAAG,OAAS,KACLH,KAAKI,SAAW,IAAI,E,YAlEN,M,cAGE,M,UAOL,S,+DAwBf,YAAAC,GACIL,KAAKE,OAAS,K,CAMlB,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,CAcX,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"}
+{"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    // #region Host HTML Element\n\n    @Element()\n    el: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    badSrc: boolean = false;\n\n    @State()\n    isLoaded: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /** A [q2-icon](https://tecton.q2developer.com/design-system/q2-icon/) to display as the fallback. */\n    @Prop()\n    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 })\n    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 })\n    name: string;\n\n    /**  Displays the image provided by the user. */\n    @Prop({ reflect: true })\n    src: string;\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('src')\n    srcDidUpdate() {\n        this.badSrc = false;\n    }\n\n    // #endregion\n    // #region Local Methods\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    onError = () => {\n        this.badSrc = true;\n    };\n\n    onLoad = () => {\n        this.isLoaded = true;\n    };\n\n    // #endregion\n    // #region Render Methods\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    // #endregion\n}\n"],"mappings":";;AAAA,MAAMA,IAAc;;AACpB,MAAAC,IAAeD;;MCEFE,IAAQ;;;IAuEjBC,KAAAC,UAAU;MACND,KAAKE,SAAS;AAAI;IAGtBF,KAAAG,SAAS;MACLH,KAAKI,WAAW;AAAI;kBAlEN;oBAGE;gBAOL;;;;;;;EAwBf,YAAAC;IACIL,KAAKE,SAAS;;;;EAMlB,oBAAII;IACA,OAAMC,UAAEA,GAAQC,MAAEA,KAASR;IAC3B,KAAKO,MAAaC,GAAM;IAExB,IAAIC,IAAS;IACb,IAAIF,GAAU;MACVE,IAASF,EAASG,OAAO,GAAG;WACzB,IAAIF,GAAM;MACb,MAAMG,IAAQH,EAAKI,MAAM;MACzB,MAAMC,IAAiBF,EAAM,GAAG;MAChC,MAAMG,IAAgBH,EAAMI,SAAS,IAAIJ,EAAMA,EAAMI,SAAS,GAAG,KAAKC;MACtEP,KAAUI;MACV,IAAIC,GAAeL,KAAUK;;IAGjCL,IAASA,MAAM,QAANA,WAAM,aAANA,EAAQQ;IAEjB,OAAOR;;;;EAcX,MAAAS;IACI,OAAMZ,kBAAEA,KAAqBN;IAC7B,MAAMmB,IAAUnB,KAAKoB,QAAQpB,KAAKE;IAClC,MAAME,IAAWJ,KAAKI;IACtB,MAAMiB,KAAgBrB,KAAKQ,QAAQR,KAAKO,eAAeP,KAAKoB,OAAOpB,KAAKE;IACxE,MAAMoB,KAAgBtB,KAAKQ,SAASR,KAAKO,cAAcP,KAAKoB,OAAOpB,KAAKE;IAExE,OACIqB,EAAA;MAAAC,KAAA;OACKL,KACGI,EAAA;MAAAC,KAAA;MACIC,OAAOrB,IAAW,eAAe;MAAoB,WAC7C;MACRgB,KAAKpB,KAAKoB;MACVnB,SAASD,KAAKC;MACdE,QAAQH,KAAKG;MACbuB,KAAK1B,KAAKQ,QAAQ;QAGzBa,KACGE,EAAA;MAAAC,KAAA;MACIG,SAAQ;MACRC,qBAAoB;MAAe,WAC3B;MACRH,OAAO,wBAAwBnB,EAAiBS;MAAQ,cAC5Cf,KAAKQ;MAAI,gBACPR,KAAKQ,QAAQ;OAE3Be,EAAA;MAAAC,KAAA;MACIK,GAAE;MACFC,GAAE;MAAI,qBACY;MAAS,eACf;MAAQ,eACR;OAEXxB,KAIZgB,KACGC,EAAA;MAAAC,KAAA;MAAA,WACY;MACRC,OAAM;OAENF,EAAA;MAAAC,KAAA;MAASO,MAAM/B,KAAKgC"}