@paperless/core 0.1.0-alpha.99 → 1.3.0

package/dist/collection/components/molecules/pagination/pagination.component.js

@@ -1,14 +1,6 @@
-import { Component, Event, h, Host, Prop, Watch, } from '@stencil/core';
+import { h, Host, } from '@stencil/core';
 export class Pagination {
   constructor() {
-    /**
-     * The current page
-     */
-    this.page = 1;
-    /**
-     * The amount of items per page
-     */
-    this.pageSize = 12;
     this._pages = [];
     this._set = [];
     this._nextClick = () => {
@@ -101,13 +93,17 @@ export class Pagination {
       }
       return set;
     };
+    this.page = 1;
+    this.pageSize = 12;
+    this.hideOnSinglePage = false;
+    this.total = undefined;
   }
   componentWillRender() {
     this._generate();
   }
   render() {
-    var _a;
-    return (h(Host, { class: "p-pagination" }, (_a = this._set) === null || _a === void 0 ? void 0 : _a.map((p) => {
+    var _a, _b;
+    return (h(Host, { class: `p-pagination ${this.hideOnSinglePage && ((_a = this._set) === null || _a === void 0 ? void 0 : _a.length) === 3 && 'hidden'}` }, (_b = this._set) === null || _b === void 0 ? void 0 : _b.map((p) => {
       if (p.type === 'previous' || p.type === 'next') {
         return (h("p-pagination-item", { onClick: () => p.type === 'previous'
             ? this._previousClick()
@@ -152,91 +148,120 @@ export class Pagination {
     return new Array(pages).fill(undefined).map((_, i) => i + 1);
   }
   static get is() { return "p-pagination"; }
-  static get originalStyleUrls() { return {
-    "$": ["pagination.component.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["pagination.component.css"]
-  }; }
-  static get properties() { return {
-    "page": {
-      "type": "number",
-      "mutable": true,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The current page"
-      },
-      "attribute": "page",
-      "reflect": true,
-      "defaultValue": "1"
-    },
-    "pageSize": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The amount of items per page"
-      },
-      "attribute": "page-size",
-      "reflect": false,
-      "defaultValue": "12"
-    },
-    "total": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["pagination.component.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["pagination.component.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "page": {
+        "type": "number",
+        "mutable": true,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The current page"
+        },
+        "attribute": "page",
+        "reflect": true,
+        "defaultValue": "1"
       },
-      "required": true,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The total amount of items"
+      "pageSize": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The amount of items per page"
+        },
+        "attribute": "page-size",
+        "reflect": false,
+        "defaultValue": "12"
       },
-      "attribute": "total",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "pageChange",
-      "name": "pageChange",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "hideOnSinglePage": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Wether to hide when there is only 1 page available"
+        },
+        "attribute": "hide-on-single-page",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
+      "total": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The total amount of items"
+        },
+        "attribute": "total",
+        "reflect": false
       }
-    }]; }
-  static get watchers() { return [{
-      "propName": "page",
-      "methodName": "pageChangeHandler"
-    }, {
-      "propName": "pageSize",
-      "methodName": "pageChangeHandler"
-    }, {
-      "propName": "total",
-      "methodName": "pageChangeHandler"
-    }]; }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "pageChange",
+        "name": "pageChange",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Event whenever the page changes"
+        },
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        }
+      }];
+  }
+  static get watchers() {
+    return [{
+        "propName": "page",
+        "methodName": "pageChangeHandler"
+      }, {
+        "propName": "pageSize",
+        "methodName": "pageChangeHandler"
+      }, {
+        "propName": "total",
+        "methodName": "pageChangeHandler"
+      }];
+  }
 }
+//# sourceMappingURL=pagination.component.js.map

package/dist/collection/components/molecules/pagination/pagination.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/pagination/pagination.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,SAAS,EACT,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,KAAK,GACR,MAAM,eAAe,CAAC;AAWvB,MAAM,OAAO,UAAU;;IA0BX,WAAM,GAAa,EAAE,CAAC;IACtB,SAAI,GAAwB,EAAE,CAAC;IA+E/B,eAAU,GAAG,GAAG,EAAE;MACtB,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC;MAC/B,IAAI,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE;QAChD,OAAO;OACV;MAED,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEM,eAAU,GAAG,CAAC,CAAU,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;IAWjD,iBAAY,GAAG,CACnB,QAAgB,CAAC,EACjB,mBAA4B,IAAI,EACb,EAAE;MACrB,MAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC;MAEtC,IAAI,CAAC,UAAU,EAAE;QACb,OAAO,EAAE,CAAC;OACb;MAED,IAAI,KAAK,GAAG,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;MAC9B,IAAI,GAAG,GAAG,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;MAE5B,IAAI,GAAG,GAAG,UAAU,EAAE;QAClB,GAAG,GAAG,UAAU,CAAC;QACjB,KAAK,GAAG,UAAU,GAAG,KAAK,GAAG,CAAC,CAAC;QAC/B,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;OACjC;MAED,IAAI,KAAK,IAAI,CAAC,EAAE;QACZ,KAAK,GAAG,CAAC,CAAC;QACV,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAE,UAAU,CAAC,CAAC;OAC7C;MAED,MAAM,GAAG,GAAG,EAAE,CAAC;MAEf,MAAM,QAAQ,GAAG;QACb,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,cAAQ,OAAO,EAAC,SAAS,EAAC,MAAM,EAAE,EAAE,GAAI;OAClD,CAAC;MAEF,MAAM,IAAI,GAAG;QACT,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,cAAQ,OAAO,EAAC,SAAS,EAAC,MAAM,EAAE,CAAC,EAAE,GAAI;OACnD,CAAC;MAEF,4CAA4C;MAC5C,IAAI,KAAK,KAAK,IAAI,EAAE;QAChB,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;UAC9B,IAAI,EAAE,MAAM;UACZ,KAAK,EAAE,CAAC;SACX,CAAC,CAAC,CAAC;QAEJ,OAAO,gBAAgB,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;OACxD;MAED,IAAI,gBAAgB,EAAE;QAClB,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;OACtB;MAED,IAAI,KAAK,IAAI,CAAC,EAAE;QACZ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE;UAC5B,GAAG,CAAC,IAAI,CAAC;YACL,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;WAC5B,CAAC,CAAC;SACN;OACJ;WAAM;QACH,GAAG,CAAC,IAAI,CAAC;UACL,IAAI,EAAE,MAAM;UACZ,KAAK,EAAE,CAAC;SACX,CAAC,CAAC;QAEH,GAAG,CAAC,IAAI,CAAC;UACL,IAAI,EAAE,UAAU;UAChB,KAAK,EAAE,UAAU;SACpB,CAAC,CAAC;OACN;MAED,KAAK,IAAI,CAAC,GAAG,KAAK,EAAE,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,EAAE;QAC/B,GAAG,CAAC,IAAI,CAAC;UACL,IAAI,EAAE,MAAM;UACZ,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;SAC5B,CAAC,CAAC;OACN;MAED,IAAI,GAAG,IAAI,UAAU,GAAG,CAAC,EAAE;QACvB,KAAK,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC,EAAE,CAAC,IAAI,UAAU,EAAE,CAAC,EAAE,EAAE;UACxC,GAAG,CAAC,IAAI,CAAC;YACL,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;WAC5B,CAAC,CAAC;SACN;OACJ;WAAM;QACH,GAAG,CAAC,IAAI,CAAC;UACL,IAAI,EAAE,UAAU;SACnB,CAAC,CAAC;QAEH,GAAG,CAAC,IAAI,CAAC;UACL,IAAI,EAAE,MAAM;UACZ,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;SAC7C,CAAC,CAAC;OACN;MAED,IAAI,gBAAgB,EAAE;QAClB,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;OAClB;MAED,OAAO,GAAG,CAAC;IACf,CAAC,CAAC;gBA7NqD,CAAC;oBAU7B,EAAE;4BAKO,KAAK;;;EAUzC,mBAAmB;IACf,IAAI,CAAC,SAAS,EAAE,CAAC;EACrB,CAAC;EAED,MAAM;;IACF,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE,gBACH,IAAI,CAAC,gBAAgB,IAAI,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,MAAK,CAAC,IAAI,QACxD,EAAE,IAED,MAAA,IAAI,CAAC,IAAI,0CAAE,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;MAClB,IAAI,CAAC,CAAC,IAAI,KAAK,UAAU,IAAI,CAAC,CAAC,IAAI,KAAK,MAAM,EAAE;QAC5C,OAAO,CACH,yBACI,OAAO,EAAE,GAAG,EAAE,CACV,CAAC,CAAC,IAAI,KAAK,UAAU;YACjB,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE;YACvB,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,IAG1B,CAAC,CAAC,KAAK,CACQ,CACvB,CAAC;OACL;MAED,IAAI,CAAC,CAAC,IAAI,KAAK,UAAU,EAAE;QACvB,OAAO,mCAA0C,CAAC;OACrD;MAED,OAAO,CACH,yBACI,MAAM,EAAE,CAAC,CAAC,KAAK,KAAK,IAAI,CAAC,IAAI,EAC7B,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,KAAe,CAAC,IAEhD,CAAC,CAAC,KAAK,CACQ,CACvB,CAAC;IACN,CAAC,CAAC,CACC,CACV,CAAC;EACN,CAAC;EAKS,iBAAiB;IACvB,IAAI,CAAC,SAAS,EAAE,CAAC;EACrB,CAAC;EAEO,SAAS;;IACb,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;IACpC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;IAEhC,IAAI,IAAI,CAAC,IAAI,IAAG,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,CAAA,EAAE;MACjC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;KACxC;EACL,CAAC;EAEO,WAAW,CAAC,CAAU;IAC1B,IAAI,CAAC,CAAC,EAAE;MACJ,OAAO;KACV;IAED,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC;IACd,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACpC,CAAC;EAEO,cAAc;IAClB,MAAM,YAAY,GAAG,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC;IACnC,IAAI,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;MAC/B,OAAO;KACV;IAED,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;EACnC,CAAC;EAaO,cAAc;IAClB,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;MAC/B,OAAO,EAAE,CAAC;KACb;IAED,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;IACpD,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;EACjE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsGJ","sourcesContent":["import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    Watch,\n} from '@stencil/core';\n\ntype PaginationSetItem = {\n    type: string;\n    value?: number | Element | JSX.Element | string;\n};\n\n@Component({\n    tag: 'p-pagination',\n    styleUrl: 'pagination.component.scss',\n})\nexport class Pagination {\n    /**\n     * The current page\n     */\n    @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n    /**\n     * Event whenever the page changes\n     */\n    @Event() pageChange: EventEmitter<number>;\n\n    /**\n     * The amount of items per page\n     */\n    @Prop() pageSize: number = 12;\n\n    /**\n     * Wether to hide when there is only 1 page available\n     */\n    @Prop() hideOnSinglePage: boolean = false;\n\n    /**\n     * The total amount of items\n     */\n    @Prop() total!: number;\n\n    private _pages: number[] = [];\n    private _set: PaginationSetItem[] = [];\n\n    componentWillRender() {\n        this._generate();\n    }\n\n    render() {\n        return (\n            <Host\n                class={`p-pagination ${\n                    this.hideOnSinglePage && this._set?.length === 3 && 'hidden'\n                }`}\n            >\n                {this._set?.map((p) => {\n                    if (p.type === 'previous' || p.type === 'next') {\n                        return (\n                            <p-pagination-item\n                                onClick={() =>\n                                    p.type === 'previous'\n                                        ? this._previousClick()\n                                        : this._nextClick()\n                                }\n                            >\n                                {p.value}\n                            </p-pagination-item>\n                        );\n                    }\n\n                    if (p.type === 'ellipsis') {\n                        return <p-pagination-item>...</p-pagination-item>;\n                    }\n\n                    return (\n                        <p-pagination-item\n                            active={p.value === this.page}\n                            onClick={() => this._pageClick(p.value as number)}\n                        >\n                            {p.value}\n                        </p-pagination-item>\n                    );\n                })}\n            </Host>\n        );\n    }\n\n    @Watch('page')\n    @Watch('pageSize')\n    @Watch('total')\n    protected pageChangeHandler() {\n        this._generate();\n    }\n\n    private _generate() {\n        this._pages = this._generatePages();\n        this._set = this._generateSet();\n\n        if (this.page > this._pages?.length) {\n            this._changePage(this._pages.length);\n        }\n    }\n\n    private _changePage(p?: number) {\n        if (!p) {\n            return;\n        }\n\n        this.page = p;\n        this.pageChange.emit(this.page);\n    }\n\n    private _previousClick() {\n        const previousPage = this.page - 1;\n        if (previousPage < this._pages[0]) {\n            return;\n        }\n\n        this._changePage(previousPage);\n    }\n\n    private _nextClick = () => {\n        const nextPage = this.page + 1;\n        if (nextPage > this._pages[this._pages.length - 1]) {\n            return;\n        }\n\n        this._changePage(nextPage);\n    };\n\n    private _pageClick = (p?: number) => this._changePage(p);\n\n    private _generatePages() {\n        if (!this.total || !this.pageSize) {\n            return [];\n        }\n\n        const pages = Math.ceil(this.total / this.pageSize);\n        return new Array(pages).fill(undefined).map((_, i) => i + 1);\n    }\n\n    private _generateSet = (\n        range: number = 1,\n        enableBoundaries: boolean = true\n    ): PaginationSetItem[] => {\n        const totalPages = this._pages.length;\n\n        if (!totalPages) {\n            return [];\n        }\n\n        let start = this.page - range;\n        let end = this.page + range;\n\n        if (end > totalPages) {\n            end = totalPages;\n            start = totalPages - range * 2;\n            start = start < 1 ? 1 : start;\n        }\n\n        if (start <= 1) {\n            start = 1;\n            end = Math.min(range * 2 + 1, totalPages);\n        }\n\n        const set = [];\n\n        const previous = {\n            type: 'previous',\n            value: <p-icon variant=\"chevron\" rotate={90} />,\n        };\n\n        const next = {\n            type: 'next',\n            value: <p-icon variant=\"chevron\" rotate={-90} />,\n        };\n\n        // Disable page range, display all the pages\n        if (range === null) {\n            const p = this._pages.map((p) => ({\n                type: 'page',\n                value: p,\n            }));\n\n            return enableBoundaries ? [previous, ...p, next] : p;\n        }\n\n        if (enableBoundaries) {\n            set.push(previous);\n        }\n\n        if (start <= 3) {\n            for (let i = 1; i < start; i++) {\n                set.push({\n                    type: 'page',\n                    value: this._pages[i - 1],\n                });\n            }\n        } else {\n            set.push({\n                type: 'page',\n                value: 1,\n            });\n\n            set.push({\n                type: 'ellipsis',\n                value: 'ellipsis',\n            });\n        }\n\n        for (let i = start; i <= end; i++) {\n            set.push({\n                type: 'page',\n                value: this._pages[i - 1],\n            });\n        }\n\n        if (end >= totalPages - 2) {\n            for (let i = end + 1; i <= totalPages; i++) {\n                set.push({\n                    type: 'page',\n                    value: this._pages[i - 1],\n                });\n            }\n        } else {\n            set.push({\n                type: 'ellipsis',\n            });\n\n            set.push({\n                type: 'page',\n                value: this._pages[this._pages.length - 1],\n            });\n        }\n\n        if (enableBoundaries) {\n            set.push(next);\n        }\n\n        return set;\n    };\n}\n"]}

package/dist/collection/components/molecules/profile/profile.component.css

@@ -1,36 +1 @@
-:host {
-  @apply flex;
-}
-:host .content {
-  @apply flex gap-3 items-center w-full h-12;
-}
-:host .content .name {
-  @apply flex flex-col justify-center overflow-hidden;
-}
-:host .content .name > *:nth-child(1) {
-  @apply text-sm text-storm-dark;
-  @apply font-semibold;
-}
-:host .content .name > *:nth-child(2) {
-  @apply text-sm text-storm-vague;
-}
-:host .content .name ::slotted(*) {
-  @apply text-ellipsis overflow-hidden whitespace-nowrap;
-}
-
-:host(.has-dropdown) {
-  @apply cursor-pointer;
-}
-:host(.has-dropdown) .content {
-  @apply px-2 rounded;
-  @apply border border-solid border-mystic-dark !important;
-}
-
-:host(.has-dropdown:hover) .content,
-:host(.active) .content {
-  @apply shadow-4;
-}
-
-:host(.active) .content p-icon {
-  @apply text-indigo;
-} .static{position:static!important}.absolute{position:absolute!important}.ml-auto{margin-left:auto!important}.flex{display:flex!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}*{box-sizing:border-box}
+.flex{display:flex!important}.h-\[3\.125rem\]{height:3.125rem!important}.h-\[4\.125rem\]{height:4.125rem!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.gap-3{gap:.75rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.p-2{padding:.5rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}*{box-sizing:border-box}:host{display:flex}:host .content{align-items:center;display:flex;gap:.75rem;width:100%}:host .content .name{display:flex;flex-direction:column;justify-content:center;overflow:hidden}:host .content .name>:first-child{--tw-text-opacity:1;color:rgb(39 40 56/var(--tw-text-opacity));font-size:.875rem;font-weight:600;line-height:1.25rem}:host .content .name>:nth-child(2){--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem}:host .content .name ::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([size=small]){height:2rem}:host([size=medium]){height:3.125rem}:host([size=large]){height:4rem}:host(.has-dropdown){cursor:pointer}:host(.has-dropdown) .content{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.25rem;border-style:solid!important;border-width:1px!important;padding:.5rem}:host(.has-dropdown[size=small]){height:3rem}:host(.has-dropdown[size=medium]){height:4.125rem}:host(.has-dropdown[size=large]){height:5rem}:host(.active) .content,:host(.has-dropdown:hover) .content{--tw-shadow:0px 0.3125rem 1rem rgba(0,24,98,.08),0px 0.0625rem 0.1875rem rgba(0,24,98,.13);--tw-shadow-colored:0px 0.3125rem 1rem var(--tw-shadow-color),0px 0.0625rem 0.1875rem var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}:host(.active) .content p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.static{position:static!important}.absolute{position:absolute!important}.ml-auto{margin-left:auto!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.visible{visibility:visible!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important}.text-lg,.text-xl{line-height:1.75rem!important}.text-xl{font-size:1.25rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}

package/dist/collection/components/molecules/profile/profile.component.js

@@ -1,92 +1,90 @@
-import { Component, Element, h, Host, Prop, State } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class Profile {
   constructor() {
-    /**
-     * The variant of the profile
-     */
     this.variant = 'user';
-    /**
-     * The size of the profile avatar
-     */
     this.size = 'small';
     this._dropdownOpen = false;
   }
+  componentWillRender() {
+    this._updateAvatar();
+  }
   render() {
-    const hasDropdownSlot = !!this._el.querySelector('[slot="dropdown"]');
+    const hasDropdownSlot = !!this._el.querySelector(':scope > [slot="dropdown"]');
     const content = this._getContent(hasDropdownSlot);
-    return (h(Host, { class: `p-profile ${hasDropdownSlot && 'has-dropdown'} ${this._dropdownOpen && 'active'}` }, hasDropdownSlot ? (h("p-dropdown", { class: "w-full min-w-0", strategy: "absolute", placement: this.variant === 'user' ? 'top-end' : 'bottom-end', onIsOpen: (ev) => (this._dropdownOpen = ev.detail) },
-      content,
-      h("div", { slot: "items" },
-        h("slot", { name: "dropdown" })))) : (content)));
+    return (h(Host, { class: `p-profile ${hasDropdownSlot && 'has-dropdown'} ${this._dropdownOpen && 'active'}` }, hasDropdownSlot ? (h("p-dropdown", { class: "w-full min-w-0", strategy: "absolute", placement: this.variant === 'user' ? 'top-end' : 'bottom-end', applyFullWidth: true, applyMaxWidth: false, onIsOpen: (ev) => (this._dropdownOpen = ev.detail) }, content, h("div", { slot: "items" }, h("slot", { name: "dropdown" })))) : (content)));
   }
   _getContent(hasDropdownSlot) {
-    const avatar = this._generateAvatar();
-    return (h("div", { class: "content", slot: "trigger" },
-      avatar,
-      h("div", { class: "name" },
-        h("slot", { name: "title" }),
-        h("slot", { name: "subtitle" })),
-      hasDropdownSlot && this._getIcon()));
+    return (h("div", { class: "content", slot: "trigger" }, h("slot", { name: "avatar" }), h("div", { class: "name" }, h("slot", { name: "title" }), h("slot", { name: "subtitle" })), hasDropdownSlot && this._getIcon()));
   }
-  _generateAvatar() {
-    var _a, _b, _c;
+  _updateAvatar() {
+    var _a, _b;
     const avatar = this._el.querySelector('p-avatar[slot="avatar"]');
     if (!avatar) {
       return;
     }
-    return (h("p-avatar", { class: "flex", src: (_a = avatar.src) !== null && _a !== void 0 ? _a : null, "default-image": (_b = avatar.defaultImage) !== null && _b !== void 0 ? _b : null, variant: (_c = this.variant) !== null && _c !== void 0 ? _c : avatar.variant, size: this.size }));
+    avatar.variant = (_a = this.variant) !== null && _a !== void 0 ? _a : avatar.variant;
+    avatar.size = (_b = this.size) !== null && _b !== void 0 ? _b : avatar === null || avatar === void 0 ? void 0 : avatar.size;
   }
   _getIcon() {
     return (h("p-icon", { class: "ml-auto", variant: this.variant === 'company' ? 'chevron' : 'more' }));
   }
   static get is() { return "p-profile"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["profile.component.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["profile.component.css"]
-  }; }
-  static get properties() { return {
-    "variant": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'company' | 'user'",
-        "resolved": "\"company\" | \"user\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The variant of the profile"
-      },
-      "attribute": "variant",
-      "reflect": false,
-      "defaultValue": "'user'"
-    },
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'small' | 'medium' | 'large'",
-        "resolved": "\"large\" | \"medium\" | \"small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The size of the profile avatar"
+  static get originalStyleUrls() {
+    return {
+      "$": ["profile.component.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["profile.component.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'company' | 'user'",
+          "resolved": "\"company\" | \"user\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The variant of the profile"
+        },
+        "attribute": "variant",
+        "reflect": false,
+        "defaultValue": "'user'"
       },
-      "attribute": "size",
-      "reflect": true,
-      "defaultValue": "'small'"
-    }
-  }; }
-  static get states() { return {
-    "_dropdownOpen": {}
-  }; }
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'small' | 'medium' | 'large'",
+          "resolved": "\"large\" | \"medium\" | \"small\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The size of the profile avatar"
+        },
+        "attribute": "size",
+        "reflect": true,
+        "defaultValue": "'small'"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "_dropdownOpen": {}
+    };
+  }
   static get elementRef() { return "_el"; }
 }
+//# sourceMappingURL=profile.component.js.map

package/dist/collection/components/molecules/profile/profile.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"profile.component.js","sourceRoot":"","sources":["../../../../src/components/molecules/profile/profile.component.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOzE,MAAM,OAAO,OAAO;;mBAIsB,MAAM;gBAKkB,OAAO;yBAOpC,KAAK;;EAEtC,mBAAmB;IACf,IAAI,CAAC,aAAa,EAAE,CAAC;EACzB,CAAC;EAED,MAAM;IACF,MAAM,eAAe,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAC5C,4BAA4B,CAC/B,CAAC;IACF,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;IAClD,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE,aAAa,eAAe,IAAI,cAAc,IACjD,IAAI,CAAC,aAAa,IAAI,QAC1B,EAAE,IAED,eAAe,CAAC,CAAC,CAAC,CACf,kBACI,KAAK,EAAC,gBAAgB,EACtB,QAAQ,EAAC,UAAU,EACnB,SAAS,EACL,IAAI,CAAC,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,EAEtD,cAAc,EAAE,IAAI,EACpB,aAAa,EAAE,KAAK,EACpB,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,MAAM,CAAC;MAEjD,OAAO;MACR,WAAK,IAAI,EAAC,OAAO;QACb,YAAM,IAAI,EAAC,UAAU,GAAG,CACtB,CACG,CAChB,CAAC,CAAC,CAAC,CACA,OAAO,CACV,CACE,CACV,CAAC;EACN,CAAC;EAEO,WAAW,CAAC,eAAe;IAC/B,OAAO,CACH,WAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,SAAS;MAC/B,YAAM,IAAI,EAAC,QAAQ,GAAG;MACtB,WAAK,KAAK,EAAC,MAAM;QACb,YAAM,IAAI,EAAC,OAAO,GAAG;QACrB,YAAM,IAAI,EAAC,UAAU,GAAG,CACtB;MAEL,eAAe,IAAI,IAAI,CAAC,QAAQ,EAAE,CACjC,CACT,CAAC;EACN,CAAC;EAEO,aAAa;;IACjB,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CACjC,yBAAyB,CACN,CAAC;IAExB,IAAI,CAAC,MAAM,EAAE;MACT,OAAO;KACV;IAED,MAAM,CAAC,OAAO,GAAG,MAAA,IAAI,CAAC,OAAO,mCAAI,MAAM,CAAC,OAAO,CAAC;IAChD,MAAM,CAAC,IAAI,GAAG,MAAA,IAAI,CAAC,IAAI,mCAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,CAAC;EAC5C,CAAC;EAEO,QAAQ;IACZ,OAAO,CACH,cACI,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,GAC1D,CACL,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n    tag: 'p-profile',\n    styleUrl: 'profile.component.scss',\n    shadow: true,\n})\nexport class Profile {\n    /**\n     * The variant of the profile\n     */\n    @Prop() variant: 'company' | 'user' = 'user';\n\n    /**\n     * The size of the profile avatar\n     */\n    @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'small';\n\n    /**\n     * The host element\n     */\n    @Element() private _el: HTMLElement;\n\n    @State() private _dropdownOpen = false;\n\n    componentWillRender() {\n        this._updateAvatar();\n    }\n\n    render() {\n        const hasDropdownSlot = !!this._el.querySelector(\n            ':scope > [slot=\"dropdown\"]'\n        );\n        const content = this._getContent(hasDropdownSlot);\n        return (\n            <Host\n                class={`p-profile ${hasDropdownSlot && 'has-dropdown'} ${\n                    this._dropdownOpen && 'active'\n                }`}\n            >\n                {hasDropdownSlot ? (\n                    <p-dropdown\n                        class=\"w-full min-w-0\"\n                        strategy=\"absolute\"\n                        placement={\n                            this.variant === 'user' ? 'top-end' : 'bottom-end'\n                        }\n                        applyFullWidth={true}\n                        applyMaxWidth={false}\n                        onIsOpen={(ev) => (this._dropdownOpen = ev.detail)}\n                    >\n                        {content}\n                        <div slot=\"items\">\n                            <slot name=\"dropdown\" />\n                        </div>\n                    </p-dropdown>\n                ) : (\n                    content\n                )}\n            </Host>\n        );\n    }\n\n    private _getContent(hasDropdownSlot) {\n        return (\n            <div class=\"content\" slot=\"trigger\">\n                <slot name=\"avatar\" />\n                <div class=\"name\">\n                    <slot name=\"title\" />\n                    <slot name=\"subtitle\" />\n                </div>\n\n                {hasDropdownSlot && this._getIcon()}\n            </div>\n        );\n    }\n\n    private _updateAvatar() {\n        const avatar = this._el.querySelector(\n            'p-avatar[slot=\"avatar\"]'\n        ) as HTMLPAvatarElement;\n\n        if (!avatar) {\n            return;\n        }\n\n        avatar.variant = this.variant ?? avatar.variant;\n        avatar.size = this.size ?? avatar?.size;\n    }\n\n    private _getIcon() {\n        return (\n            <p-icon\n                class=\"ml-auto\"\n                variant={this.variant === 'company' ? 'chevron' : 'more'}\n            />\n        );\n    }\n}\n"]}

package/dist/collection/components/molecules/select/select.component.css

@@ -0,0 +1 @@
+.flex{display:flex!important}.w-full{width:100%!important}*{box-sizing:border-box}p-select{display:flex;flex-direction:column;width:100%}p-select input.read-only{text-overflow:ellipsis}.static{position:static!important}.h-6{height:1.5rem!important}.cursor-pointer{cursor:pointer!important}.rounded{border-radius:.25rem!important}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.visible{visibility:visible!important}.absolute{position:absolute!important}.blur{--tw-blur:blur(8px)!important;filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative-light{--tw-text-opacity:1!important;color:rgb(255 204 211/var(--tw-text-opacity))!important}.hover\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.items-end{align-items:flex-end!important}.justify-between{justify-content:space-between!important}.rounded-bl-none{border-bottom-left-radius:0!important}.rounded-br-none{border-bottom-right-radius:0!important}.rounded-tl-none{border-top-left-radius:0!important}.rounded-tr-none{border-top-right-radius:0!important}.border-l-0{border-left-width:0!important}.border-r-0{border-right-width:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.inline{display:inline!important}.justify-center{justify-content:center!important}