q2-tecton-elements 1.54.5 → 1.55.1

package/dist/q2-tecton-elements/q2-action-group.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["q2ActionGroupCss","Q2ActionGroupStyle0","Q2ActionGroup","this","checkForQ2Link","links","hostElement","querySelectorAll","hasQ2Link","length","handleResize","event","width","detail","entries","contentRect","shouldBeVertical","orientationThreshold","autoOrientation","initMutationObserver","observer","MutationObserver","onMutationObserved","observe","childList","subtree","mutationObserver","disconnectedCallback","disconnect","componentDidLoad","window","toggleHiddenForOneFrame","container","style","display","nextPaint","computedOrientation","orientation","shouldDisableResizeObserver","render","fullWidth","containerClassNames","push","h","key","onTctResize","disabled","ref","el","class","join","role"],"sources":["src/components/q2-action-group/q2-action-group.scss?tag=q2-action-group&encapsulation=shadow","src/components/q2-action-group/q2-action-group.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host(:not([hidden])) {\n    display: block;\n    width: 100%;\n    --comp-default-action-group-margin: #{var-list(--app-scale-5x, 25px)} 0;\n    margin: var-list(--tct-action-group-margin, --comp-default-action-group-margin);\n}\n\n.container {\n    --comp-default-action-group-gap: #{var-list(--tct-action-group-gap, --app-scale-2x, 10px)};\n    --comp-link-gap: #{var-list(--tct-action-group-gap, --app-scale-4x, 20px)};\n    width: 100%;\n    display: flex;\n    gap: var(--comp-default-action-group-gap);\n\n    &.vertical {\n        flex-direction: var-list(--tct-action-group-vertical-flex-direction, column);\n\n        ::slotted(q2-btn) {\n            display: block;\n            width: 100%;\n        }\n    }\n\n    &.horizontal {\n        justify-content: var-list(--tct-action-group-horizontal-justify-content, flex-start);\n        flex-direction: var-list(--tct-action-group-horizontal-flex-direction, row-reverse);\n        align-items: var-list(--tct-action-group-horizontal-align-items, center);\n        flex-wrap: var-list(--tct-action-group-horizontal-flex-wrap, wrap);\n\n        &.full-width {\n            flex-wrap: nowrap;\n        }\n\n        &.has-q2-link {\n            gap: var(--comp-link-gap);\n            ::slotted(q2-link) {\n                position: relative;\n            }\n            ::slotted(q2-link:not(:last-child))::before {\n                content: '';\n                display: inline-block;\n                width: 0;\n                height: 28px;\n                border-left: 1px solid var(--t-gray-12, #d9d9d9);\n                position: absolute;\n                left: calc(var(--comp-link-gap) * -0.5);\n            }\n        }\n    }\n\n    &.vertical,\n    &.horizontal.full-width {\n        ::slotted(q2-btn) {\n            display: block;\n            width: 100%;\n        }\n    }\n}\n","import { Q2ResizeObserverCustomEvent } from '@/components';\nimport { nextPaint } from '@/utils';\nimport { Component, ComponentInterface, h, Element, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n    tag: 'q2-action-group',\n    styleUrl: 'q2-action-group.scss',\n    shadow: true,\n})\nexport class Q2ActionGroup implements ComponentInterface {\n    // #region Own Properties\n\n    container: HTMLDivElement;\n    mutationObserver: MutationObserver;\n\n    // #endregion\n    // #region Host HTML Element\n\n    @Element()\n    hostElement: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    autoOrientation: 'vertical' | 'horizontal' = 'vertical';\n\n    @State()\n    hasQ2Link: boolean = false;\n\n    // #endregion\n    // #region Public Property API\n\n    /**\n     * Whether the buttons should take up the full width of the container when in horizontal orientation.\n     *\n     * @warning\n     * This will prevent the buttons from wrapping when the container is too small to fit all buttons.\n     */\n    @Prop({ reflect: true })\n    fullWidth: boolean;\n\n    /**\n     * The orientation of the buttons, which will override the auto orientation.\n     *\n     * @info\n     * This will override and disable the auto determination of the orientation.\n     */\n    @Prop({ reflect: true })\n    orientation: 'auto' | 'vertical' | 'horizontal' = 'auto';\n\n    /**\n     * The width, in pixels, that determines whether to display the buttons in vertical or horizontal orientation\n     *\n     * @info\n     * The component determines this based on the width of the element itself, not the browser window.\n     */\n    @Prop({ reflect: false })\n    orientationThreshold: number = 440;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback(): void {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n            this.mutationObserver = null;\n        }\n    }\n\n    componentDidLoad() {\n        this.checkForQ2Link();\n        if ('MutationObserver' in window) this.initMutationObserver();\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('orientation')\n    toggleHiddenForOneFrame() {\n        const { container } = this;\n        container.style.display = 'none';\n        // Fixes Safari not making the buttons fill the container when going from horizontal and full-width to vertical\n        nextPaint(() =>\n            nextPaint(() => {\n                container.style.display = null;\n            })\n        );\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get computedOrientation(): 'vertical' | 'horizontal' {\n        let orientation = this.orientation;\n        if (!orientation) orientation = 'auto';\n        return orientation === 'auto' ? this.autoOrientation : orientation;\n    }\n\n    get shouldDisableResizeObserver(): boolean {\n        let orientation = this.orientation;\n        if (!orientation) orientation = 'auto';\n        return orientation !== 'auto';\n    }\n\n    checkForQ2Link = () => {\n        const links = this.hostElement.querySelectorAll('q2-link');\n        this.hasQ2Link = links.length > 0;\n    };\n\n    handleResize = (\n        event: Q2ResizeObserverCustomEvent<{\n            entries: ResizeObserverEntry[];\n        }>\n    ) => {\n        const width = event.detail.entries[0].contentRect.width;\n        const shouldBeVertical = this.orientationThreshold > width;\n        this.autoOrientation = shouldBeVertical ? 'vertical' : 'horizontal';\n    };\n\n    initMutationObserver = () => {\n        const observer = new MutationObserver(this.onMutationObserved);\n        observer.observe(this.hostElement, { childList: true, subtree: true });\n        this.mutationObserver = observer;\n    };\n\n    onMutationObserved = () => {\n        this.checkForQ2Link();\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        const { shouldDisableResizeObserver, computedOrientation, fullWidth, hasQ2Link } = this;\n        const containerClassNames = ['container'];\n        if (fullWidth && computedOrientation === 'horizontal') containerClassNames.push('full-width');\n        if (hasQ2Link) containerClassNames.push('has-q2-link');\n        containerClassNames.push(computedOrientation);\n\n        return (\n            <q2-resize-observer\n                onTctResize={this.handleResize}\n                disabled={shouldDisableResizeObserver}\n            >\n                <div\n                    ref={el => (this.container = el)}\n                    class={containerClassNames.join(' ')}\n                    role=\"group\"\n                >\n                    <slot />\n                </div>\n            </q2-resize-observer>\n        );\n    }\n\n    // #endregion\n}\n"],"mappings":";;;;AAAA,MAAMA,IAAmB;;AACzB,MAAAC,IAAeD;;MCQFE,IAAa;;;IAgGtBC,KAAAC,iBAAiB;MACb,MAAMC,IAAQF,KAAKG,YAAYC,iBAAiB;MAChDJ,KAAKK,YAAYH,EAAMI,SAAS;AAAC;IAGrCN,KAAAO,eACIC;MAIA,MAAMC,IAAQD,EAAME,OAAOC,QAAQ,GAAGC,YAAYH;MAClD,MAAMI,IAAmBb,KAAKc,uBAAuBL;MACrDT,KAAKe,kBAAkBF,IAAmB,aAAa;AAAY;IAGvEb,KAAAgB,uBAAuB;MACnB,MAAMC,IAAW,IAAIC,iBAAiBlB,KAAKmB;MAC3CF,EAASG,QAAQpB,KAAKG,aAAa;QAAEkB,WAAW;QAAMC,SAAS;;MAC/DtB,KAAKuB,mBAAmBN;AAAQ;IAGpCjB,KAAAmB,qBAAqB;MACjBnB,KAAKC;AAAgB;2BAtGoB;qBAGxB;;uBAqB6B;gCASnB;;;;EAK/B,oBAAAuB;IACI,IAAIxB,KAAKuB,kBAAkB;MACvBvB,KAAKuB,iBAAiBE;MACtBzB,KAAKuB,mBAAmB;;;EAIhC,gBAAAG;IACI1B,KAAKC;IACL,IAAI,sBAAsB0B,QAAQ3B,KAAKgB;;;;EAO3C,uBAAAY;IACI,OAAMC,WAAEA,KAAc7B;IACtB6B,EAAUC,MAAMC,UAAU;;QAE1BC,GAAU,MACNA,GAAU;MACNH,EAAUC,MAAMC,UAAU;AAAI;;;;EAQ1C,uBAAIE;IACA,IAAIC,IAAclC,KAAKkC;IACvB,KAAKA,GAAaA,IAAc;IAChC,OAAOA,MAAgB,SAASlC,KAAKe,kBAAkBmB;;EAG3D,+BAAIC;IACA,IAAID,IAAclC,KAAKkC;IACvB,KAAKA,GAAaA,IAAc;IAChC,OAAOA,MAAgB;;;;EA+B3B,MAAAE;IACI,OAAMD,6BAAEA,GAA2BF,qBAAEA,GAAmBI,WAAEA,GAAShC,WAAEA,KAAcL;IACnF,MAAMsC,IAAsB,EAAC;IAC7B,IAAID,KAAaJ,MAAwB,cAAcK,EAAoBC,KAAK;IAChF,IAAIlC,GAAWiC,EAAoBC,KAAK;IACxCD,EAAoBC,KAAKN;IAEzB,OACIO,EAAA;MAAAC,KAAA;MACIC,aAAa1C,KAAKO;MAClBoC,UAAUR;OAEVK,EAAA;MAAAC,KAAA;MACIG,KAAKC,KAAO7C,KAAK6B,YAAYgB;MAC7BC,OAAOR,EAAoBS,KAAK;MAChCC,MAAK;OAELR,EAAA;MAAAC,KAAA"}
+{"version":3,"names":["q2ActionGroupCss","Q2ActionGroupStyle0","Q2ActionGroup","this","filterSlottedElements","window","computedOrientation","slot","hostElement","shadowRoot","querySelector","assignedElements","Array","from","flatten","length","approvedElements","tagName","isCoinIntent","reduce","acc","el","includes","getAttribute","intent","tagNameMismatch","coinIntentMismatch","remove","incompatibleOrientation","console","warn","orientation","combinedTagName","slottedTagName","toLowerCase","handleResize","event","width","detail","entries","contentRect","shouldBeVertical","orientationThreshold","autoOrientation","initMutationObserver","observer","MutationObserver","onMutationObserved","observe","childList","subtree","mutationObserver","disconnectedCallback","disconnect","componentDidLoad","toggleHiddenForOneFrame","container","style","display","nextPaint","shouldDisableResizeObserver","render","fullWidth","containerClassNames","push","h","key","onTctResize","disabled","ref","class","join","role"],"sources":["src/components/q2-action-group/q2-action-group.scss?tag=q2-action-group&encapsulation=shadow","src/components/q2-action-group/q2-action-group.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host(:not([hidden])) {\n    display: block;\n    width: 100%;\n    --comp-default-action-group-margin: #{var-list(--app-scale-5x, 25px)} 0;\n    margin: var-list(--tct-action-group-margin, --comp-default-action-group-margin);\n}\n\n.container {\n    --comp-default-action-group-gap: #{var-list(--tct-action-group-gap, --app-scale-2x, 10px)};\n    --comp-link-gap: #{var-list(--tct-action-group-gap, --app-scale-4x, 20px)};\n    width: 100%;\n    display: flex;\n    gap: var(--comp-default-action-group-gap);\n\n    &.has-q2-link {\n        gap: var(--comp-link-gap);\n    }\n\n    &.has-q2-btn-coin {\n        column-gap: var-list(--tct-action-group-coin-column-gap, --app-scale-1x, 5px);\n        row-gap: var-list(--tct-action-group-coin-row-gap, --app-scale-5x, 25px);\n    }\n\n    &.vertical {\n        flex-direction: var-list(--tct-action-group-vertical-flex-direction, column);\n\n        ::slotted(q2-btn) {\n            display: block;\n            width: 100%;\n        }\n    }\n\n    &.horizontal {\n        justify-content: var-list(--tct-action-group-horizontal-justify-content, flex-start);\n        flex-direction: var-list(--tct-action-group-horizontal-flex-direction, row-reverse);\n        align-items: var-list(--tct-action-group-horizontal-align-items, center);\n        flex-wrap: var-list(--tct-action-group-horizontal-flex-wrap, wrap);\n\n        &.full-width {\n            flex-wrap: nowrap;\n        }\n\n        &.has-q2-btn-coin {\n            justify-content: var(--tct-action-group-coin-horizontal-justify-content, center);\n        }\n\n        ::slotted(q2-link) {\n            position: relative;\n        }\n        ::slotted(q2-link:not(:last-child))::before {\n            content: '';\n            display: inline-block;\n            width: 0;\n            height: 28px;\n            border-left: 1px solid var(--t-gray-12, #d9d9d9);\n            position: absolute;\n            left: calc(var(--comp-link-gap) * -0.5);\n        }\n    }\n\n    &.vertical,\n    &.horizontal.full-width {\n        ::slotted(q2-btn) {\n            display: block;\n            width: 100%;\n        }\n    }\n}\n","import { Q2ResizeObserverCustomEvent } from '@/components';\nimport { nextPaint } from '@/utils';\nimport { Component, ComponentInterface, h, Element, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n    tag: 'q2-action-group',\n    styleUrl: 'q2-action-group.scss',\n    shadow: true,\n})\nexport class Q2ActionGroup implements ComponentInterface {\n    // #region Own Properties\n\n    container: HTMLDivElement;\n    mutationObserver: MutationObserver;\n\n    // #endregion\n    // #region Host HTML Element\n\n    @Element()\n    hostElement: HTMLElement;\n\n    // #endregion\n    // #region State Properties\n\n    @State()\n    autoOrientation: 'vertical' | 'horizontal' = 'vertical';\n\n    @State()\n    slottedTagName: string;\n\n    // #endregion\n    // #region Public Property API\n\n    /**\n     * Whether the buttons should take up the full width of the container when in horizontal orientation.\n     *\n     * @warning\n     * This will prevent the buttons from wrapping when the container is too small to fit all buttons.\n     */\n    @Prop({ reflect: true })\n    fullWidth: boolean;\n\n    /**\n     * The orientation of the buttons, which will override the auto orientation.\n     *\n     * @info\n     * This will override and disable the auto determination of the orientation.\n     * @warning\n     * Vertical orientation is not supported for [Links](https://tecton.q2developer.com/design-system/q2-link/)\n     * or `\"coin\"` [Buttons](https://tecton.q2developer.com/design-system/q2-btn/), and will be set to \"horizontal\".\n     */\n    @Prop({ reflect: true })\n    orientation: 'auto' | 'vertical' | 'horizontal' = 'auto';\n\n    /**\n     * The width, in pixels, that determines whether to display the buttons in vertical or horizontal orientation\n     *\n     * @info\n     * The component determines this based on the width of the element itself, not the browser window.\n     */\n    @Prop({ reflect: false })\n    orientationThreshold: number = 440;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback(): void {\n        if (this.mutationObserver) {\n            this.mutationObserver.disconnect();\n            this.mutationObserver = null;\n        }\n    }\n\n    componentDidLoad() {\n        this.filterSlottedElements();\n        this.initMutationObserver();\n    }\n\n    // #endregion\n    // #region Watchers\n\n    @Watch('orientation')\n    toggleHiddenForOneFrame() {\n        const { container } = this;\n        container.style.display = 'none';\n        // Fixes Safari not making the buttons fill the container when going from horizontal and full-width to vertical\n        nextPaint(() =>\n            nextPaint(() => {\n                container.style.display = null;\n                this.filterSlottedElements();\n            })\n        );\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get computedOrientation(): 'vertical' | 'horizontal' {\n        let orientation = this.orientation;\n        if (!orientation) orientation = 'auto';\n        return orientation === 'auto' ? this.autoOrientation : orientation;\n    }\n\n    get shouldDisableResizeObserver(): boolean {\n        let orientation = this.orientation;\n        if (!orientation) orientation = 'auto';\n        // these are not supported in a 'vertical' orientation, so we will disable resizing\n        if (['q2-btn-coin', 'q2-link'].includes(this.slottedTagName)) return true;\n        return orientation !== 'auto';\n    }\n\n    filterSlottedElements = () => {\n        if (!('HTMLSlotElement' in window)) return;\n        const { computedOrientation } = this;\n        const slot = this.hostElement.shadowRoot.querySelector('slot');\n        const assignedElements = Array.from(slot?.assignedElements({ flatten: true }));\n        if (!assignedElements.length) return;\n\n        // Remove all elements that are not Q2-BTN or Q2-LINK\n        const approvedElements = ['Q2-BTN', 'Q2-LINK'];\n        const { tagName, isCoinIntent } = assignedElements.reduce(\n            (acc, el) => {\n                if (!acc.tagName && approvedElements.includes(el.tagName)) {\n                    acc.tagName = el.tagName;\n                    acc.isCoinIntent = el.getAttribute('intent') === 'coin';\n                }\n                const intent = el.getAttribute('intent');\n                const tagNameMismatch = acc.tagName !== el.tagName;\n                const coinIntentMismatch = acc.isCoinIntent && intent !== 'coin';\n\n                if (tagNameMismatch || coinIntentMismatch) el.remove();\n\n                return acc;\n            },\n            { tagName: null, isCoinIntent: false }\n        );\n\n        const incompatibleOrientation = computedOrientation === 'vertical' && (tagName === 'Q2-LINK' || isCoinIntent);\n        if (incompatibleOrientation) {\n            console.warn(\n                'Q2-ACTION-GROUP: \"Vertical\" orientation is not supported for Q2-LINK or Q2-BTN with intent=\"coin\". Orientation will be set to \"horizontal\".'\n            );\n            this.orientation = 'horizontal';\n        }\n        const combinedTagName = isCoinIntent ? `${tagName}-coin` : tagName;\n        this.slottedTagName = combinedTagName.toLowerCase();\n    };\n\n    handleResize = (\n        event: Q2ResizeObserverCustomEvent<{\n            entries: ResizeObserverEntry[];\n        }>\n    ) => {\n        const width = event.detail.entries[0].contentRect.width;\n        const shouldBeVertical = this.orientationThreshold > width;\n        this.autoOrientation = shouldBeVertical ? 'vertical' : 'horizontal';\n    };\n\n    initMutationObserver = () => {\n        if (!('MutationObserver' in window)) return;\n        const observer = new MutationObserver(this.onMutationObserved);\n        observer.observe(this.hostElement, { childList: true, subtree: true });\n        this.mutationObserver = observer;\n    };\n\n    onMutationObserved = () => {\n        this.filterSlottedElements();\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        const { shouldDisableResizeObserver, computedOrientation, fullWidth, slottedTagName } = this;\n        const containerClassNames = ['container'];\n        if (fullWidth && computedOrientation === 'horizontal') containerClassNames.push('full-width');\n        if (slottedTagName) containerClassNames.push(`has-${slottedTagName}`);\n        containerClassNames.push(computedOrientation);\n\n        return (\n            <q2-resize-observer\n                onTctResize={this.handleResize}\n                disabled={shouldDisableResizeObserver}\n            >\n                <div\n                    ref={el => (this.container = el)}\n                    class={containerClassNames.join(' ')}\n                    role=\"group\"\n                >\n                    <slot />\n                </div>\n            </q2-resize-observer>\n        );\n    }\n\n    // #endregion\n}\n"],"mappings":";;;;AAAA,MAAMA,IAAmB;;AACzB,MAAAC,IAAeD;;MCQFE,IAAa;;;IAsGtBC,KAAAC,wBAAwB;MACpB,MAAM,qBAAqBC,SAAS;MACpC,OAAMC,qBAAEA,KAAwBH;MAChC,MAAMI,IAAOJ,KAAKK,YAAYC,WAAWC,cAAc;MACvD,MAAMC,IAAmBC,MAAMC,KAAKN,MAAI,QAAJA,WAAI,aAAJA,EAAMI,iBAAiB;QAAEG,SAAS;;MACtE,KAAKH,EAAiBI,QAAQ;;YAG9B,MAAMC,IAAmB,EAAC,UAAU;MACpC,OAAMC,SAAEA,GAAOC,cAAEA,KAAiBP,EAAiBQ,QAC/C,CAACC,GAAKC;QACF,KAAKD,EAAIH,WAAWD,EAAiBM,SAASD,EAAGJ,UAAU;UACvDG,EAAIH,UAAUI,EAAGJ;UACjBG,EAAIF,eAAeG,EAAGE,aAAa,cAAc;;QAErD,MAAMC,IAASH,EAAGE,aAAa;QAC/B,MAAME,IAAkBL,EAAIH,YAAYI,EAAGJ;QAC3C,MAAMS,IAAqBN,EAAIF,gBAAgBM,MAAW;QAE1D,IAAIC,KAAmBC,GAAoBL,EAAGM;QAE9C,OAAOP;AAAG,UAEd;QAAEH,SAAS;QAAMC,cAAc;;MAGnC,MAAMU,IAA0BtB,MAAwB,eAAeW,MAAY,aAAaC;MAChG,IAAIU,GAAyB;QACzBC,QAAQC,KACJ;QAEJ3B,KAAK4B,cAAc;;MAEvB,MAAMC,IAAkBd,IAAe,GAAGD,WAAiBA;MAC3Dd,KAAK8B,iBAAiBD,EAAgBE;AAAa;IAGvD/B,KAAAgC,eACIC;MAIA,MAAMC,IAAQD,EAAME,OAAOC,QAAQ,GAAGC,YAAYH;MAClD,MAAMI,IAAmBtC,KAAKuC,uBAAuBL;MACrDlC,KAAKwC,kBAAkBF,IAAmB,aAAa;AAAY;IAGvEtC,KAAAyC,uBAAuB;MACnB,MAAM,sBAAsBvC,SAAS;MACrC,MAAMwC,IAAW,IAAIC,iBAAiB3C,KAAK4C;MAC3CF,EAASG,QAAQ7C,KAAKK,aAAa;QAAEyC,WAAW;QAAMC,SAAS;;MAC/D/C,KAAKgD,mBAAmBN;AAAQ;IAGpC1C,KAAA4C,qBAAqB;MACjB5C,KAAKC;AAAuB;2BA7Ia;;;uBA2BK;gCASnB;;;;EAK/B,oBAAAgD;IACI,IAAIjD,KAAKgD,kBAAkB;MACvBhD,KAAKgD,iBAAiBE;MACtBlD,KAAKgD,mBAAmB;;;EAIhC,gBAAAG;IACInD,KAAKC;IACLD,KAAKyC;;;;EAOT,uBAAAW;IACI,OAAMC,WAAEA,KAAcrD;IACtBqD,EAAUC,MAAMC,UAAU;;QAE1BC,GAAU,MACNA,GAAU;MACNH,EAAUC,MAAMC,UAAU;MAC1BvD,KAAKC;AAAuB;;;;EAQxC,uBAAIE;IACA,IAAIyB,IAAc5B,KAAK4B;IACvB,KAAKA,GAAaA,IAAc;IAChC,OAAOA,MAAgB,SAAS5B,KAAKwC,kBAAkBZ;;EAG3D,+BAAI6B;IACA,IAAI7B,IAAc5B,KAAK4B;IACvB,KAAKA,GAAaA,IAAc;;QAEhC,IAAI,EAAC,eAAe,YAAWT,SAASnB,KAAK8B,iBAAiB,OAAO;IACrE,OAAOF,MAAgB;;;;EAgE3B,MAAA8B;IACI,OAAMD,6BAAEA,GAA2BtD,qBAAEA,GAAmBwD,WAAEA,GAAS7B,gBAAEA,KAAmB9B;IACxF,MAAM4D,IAAsB,EAAC;IAC7B,IAAID,KAAaxD,MAAwB,cAAcyD,EAAoBC,KAAK;IAChF,IAAI/B,GAAgB8B,EAAoBC,KAAK,OAAO/B;IACpD8B,EAAoBC,KAAK1D;IAEzB,OACI2D,EAAA;MAAAC,KAAA;MACIC,aAAahE,KAAKgC;MAClBiC,UAAUR;OAEVK,EAAA;MAAAC,KAAA;MACIG,KAAKhD,KAAOlB,KAAKqD,YAAYnC;MAC7BiD,OAAOP,EAAoBQ,KAAK;MAChCC,MAAK;OAELP,EAAA;MAAAC,KAAA"}