q2-tecton-elements 1.52.1 → 1.53.0

package/dist/q2-tecton-elements/q2-list.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["q2ListCss","Q2ListStyle0","Q2List","this","scheduledAfterRender","onMutationObserved","renderTrigger","push","Array","from","hostElement","children","forEach","child","tagName","role","disconnectedCallback","_a","mutationObserver","disconnect","componentDidLoad","MutationObserver","observer","observe","childList","subtree","componentDidRender","fn","hasFilterSlot","querySelector","hasSlotContent","hasLabelContent","label","headerClasses","classes","join","listClasses","render","h","key","class","ref","el","listElement","name"],"sources":["src/components/q2-list/q2-list.scss?tag=q2-list&encapsulation=shadow","src/components/q2-list/q2-list.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../q2-btn/q2-btn-mixins';\n\n:host([bordered]:not([bordered='false'])) {\n    ::slotted(q2-item:not(:last-child)),\n    .header {\n        border-style: var-list(--tct-list-item-border-style, solid);\n        border-width: var-list(--tct-list-item-border-width, unquote('0 0 1px 0'));\n        border-color: var-list(--tct-list-item-border-color, --t-gray-12, #d9d9d9);\n    }\n}\n\n::slotted(q2-item) {\n    --comp-item-padding: #{var-list(\n            --tct-list-item-padding,\n            unquote('#{var-list(--app-scale-2x, 10px) var-list(--app-scale-4x, 20px)}')\n        )};\n    --tct-item-padding: var(--comp-item-padding);\n}\n\n.header {\n    --comp-default-header-padding: 0 var(--app-scale-4x, 20px);\n    display: flex;\n    gap: var(--app-scale-3x, 12px);\n    padding: var-list(--tct-list-header-padding, --comp-default-header-padding);\n    min-height: var-list(var-prefixer(list-header-min-height), 44px);\n    &-spacebetween {\n        justify-content: space-between;\n    }\n    &-start {\n        justify-content: flex-start;\n    }\n    &-end {\n        justify-content: flex-end;\n    }\n    .label {\n        width: 100%;\n        height: var(--tct-list-label-height, 44px);\n        line-height: var(--tct-list-label-line-height, 44px);\n        font-size: var-list(--tct-list-label-font-size, --app-font-size, 14px);\n        font-weight: var(--tct-list-label-font-weight, 600);\n        color: var-list(--tct-list-label-font-color, --t-text, #4d4d4d);\n    }\n}\n","import { Component, Element, h, State, Prop } from '@stencil/core';\nimport { hasSlotContent } from 'src/utils';\n\n@Component({\n    tag: 'q2-list',\n    styleUrl: 'q2-list.scss',\n    shadow: true,\n})\nexport class Q2List {\n    // #region Own Properties\n\n    listElement: HTMLDivElement;\n    mutationObserver: MutationObserver;\n    scheduledAfterRender: (() => void)[] = [];\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    renderTrigger: number = 0;\n\n    // #endregion\n    // #region Public Property API\n\n    /** Adds a border between each items */\n    @Prop({ mutable: true, reflect: true })\n    bordered: boolean;\n\n    /** label text on header area */\n    @Prop({ reflect: true })\n    label: string;\n\n    // #endregion\n    // #region Component Lifecycle Events\n\n    disconnectedCallback() {\n        this.mutationObserver?.disconnect();\n        this.mutationObserver = null;\n    }\n\n    componentDidLoad() {\n        if (typeof MutationObserver === 'undefined') return;\n        const observer = new MutationObserver(this.onMutationObserved);\n        observer.observe(this.hostElement, { childList: true, subtree: true });\n        this.mutationObserver = observer;\n        this.onMutationObserved();\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    // #endregion\n    // #region Local Methods\n\n    get hasFilterSlot() {\n        return !!this.hostElement.querySelector('q2-pill') || hasSlotContent(this.hostElement, 'pill');\n    }\n\n    get hasLabelContent() {\n        return !!this.label;\n    }\n\n    get headerClasses() {\n        const classes = ['header'];\n        if (this.hasLabelContent && this.hasFilterSlot) {\n            classes.push('header-spacebetween');\n        } else if (this.hasLabelContent && !this.hasFilterSlot) {\n            classes.push('header-start');\n        } else if (!this.hasLabelContent && this.hasFilterSlot) {\n            classes.push('header-end');\n        }\n        return classes.join(' ');\n    }\n\n    get listClasses() {\n        const classes = ['list'];\n        return classes.join(' ');\n    }\n\n    onMutationObserved = () => {\n        this.renderTrigger += 1;\n        this.scheduledAfterRender.push(() => {\n            Array.from(this.hostElement.children).forEach(child => {\n                if (child.tagName === 'Q2-ITEM') child.role = 'listitem';\n            });\n        });\n    };\n\n    // #endregion\n    // #region Render Methods\n\n    render() {\n        return (\n            <div\n                class={this.listClasses}\n                ref={el => (this.listElement = el)}\n            >\n                {(this.hasFilterSlot || this.hasLabelContent) && (\n                    <div class={this.headerClasses}>\n                        <div class=\"label\">{this.label}</div>\n                        {this.hasFilterSlot && <slot name=\"filter\" />}\n                    </div>\n                )}\n                <div role=\"list\">\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n\n    // #endregion\n}\n"],"mappings":";;;;AAAA,MAAMA,IAAY;;AAClB,MAAAC,IAAeD;;MCOFE,IAAM;;;IAKfC,KAAAC,uBAAuC;IA0EvCD,KAAAE,qBAAqB;MACjBF,KAAKG,iBAAiB;MACtBH,KAAKC,qBAAqBG,MAAK;QAC3BC,MAAMC,KAAKN,KAAKO,YAAYC,UAAUC,SAAQC;UAC1C,IAAIA,EAAMC,YAAY,WAAWD,EAAME,OAAO;AAAU;AAC1D;AACJ;yBApEkB;;;;;;EAgBxB,oBAAAC;;KACIC,IAAAd,KAAKe,sBAAgB,QAAAD,WAAA,aAAAA,EAAEE;IACvBhB,KAAKe,mBAAmB;;EAG5B,gBAAAE;IACI,WAAWC,qBAAqB,aAAa;IAC7C,MAAMC,IAAW,IAAID,iBAAiBlB,KAAKE;IAC3CiB,EAASC,QAAQpB,KAAKO,aAAa;MAAEc,WAAW;MAAMC,SAAS;;IAC/DtB,KAAKe,mBAAmBI;IACxBnB,KAAKE;;EAGT,kBAAAqB;IACIvB,KAAKC,qBAAqBQ,SAAQe,KAAMA;IACxCxB,KAAKC,uBAAuB;;;;EAMhC,iBAAIwB;IACA,SAASzB,KAAKO,YAAYmB,cAAc,cAAcC,EAAe3B,KAAKO,aAAa;;EAG3F,mBAAIqB;IACA,SAAS5B,KAAK6B;;EAGlB,iBAAIC;IACA,MAAMC,IAAU,EAAC;IACjB,IAAI/B,KAAK4B,mBAAmB5B,KAAKyB,eAAe;MAC5CM,EAAQ3B,KAAK;WACV,IAAIJ,KAAK4B,oBAAoB5B,KAAKyB,eAAe;MACpDM,EAAQ3B,KAAK;WACV,KAAKJ,KAAK4B,mBAAmB5B,KAAKyB,eAAe;MACpDM,EAAQ3B,KAAK;;IAEjB,OAAO2B,EAAQC,KAAK;;EAGxB,eAAIC;IACA,MAAMF,IAAU,EAAC;IACjB,OAAOA,EAAQC,KAAK;;;;EAexB,MAAAE;IACI,OACIC,EAAA;MAAAC,KAAA;MACIC,OAAOrC,KAAKiC;MACZK,KAAKC,KAAOvC,KAAKwC,cAAcD;QAE7BvC,KAAKyB,iBAAiBzB,KAAK4B,oBACzBO,EAAA;MAAAC,KAAA;MAAKC,OAAOrC,KAAK8B;OACbK,EAAA;MAAAC,KAAA;MAAKC,OAAM;OAASrC,KAAK6B,QACxB7B,KAAKyB,iBAAiBU,EAAA;MAAAC,KAAA;MAAMK,MAAK;SAG1CN,EAAA;MAAAC,KAAA;MAAKxB,MAAK;OACNuB,EAAA;MAAAC,KAAA"}