npm - @swisspost/design-system-components - Versions diffs - 1.7.1 → 2.0.0 - Mend

@swisspost/design-system-components 1.7.1 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (207) hide show

package/dist/collection/components/post-collapsible/post-collapsible.js CHANGED Viewed

@@ -1,33 +1,22 @@
 import { h, Host, } from "@stencil/core";
 import { version } from "../../../package.json";
 import { collapse, expand } from "../../animations/collapse";
-import { checkEmptyOrOneOf, checkEmptyOrType, isMotionReduced } from "../../utils";
-import { HEADING_LEVELS } from "./heading-levels";
+import { checkEmptyOrType, isMotionReduced } from "../../utils";
 export class PostCollapsible {
     constructor() {
         this.isLoaded = false;
         this.id = undefined;
         this.isOpen = true;
-        this.hasHeader = undefined;
-        this.headingTag = undefined;
         this.collapsed = false;
-        this.headingLevel = 2;
     }
     validateCollapsed(newValue = this.collapsed) {
         checkEmptyOrType(newValue, 'boolean', 'The `collapsed` property of the `post-collapsible` must be a boolean.');
     }
-    validateHeadingLevel(newValue = this.headingLevel) {
-        checkEmptyOrOneOf(newValue, HEADING_LEVELS, 'The `headingLevel` property of the `post-collapsible` must be a number between 1 and 6.');
-    }
     connectedCallback() {
         this.validateCollapsed();
-        this.validateHeadingLevel();
     }
     componentWillRender() {
-        var _a;
         this.id = this.host.id || `c${crypto.randomUUID()}`;
-        this.hasHeader = this.host.querySelectorAll('[slot="header"]').length > 0;
-        this.headingTag = `h${(_a = this.headingLevel) !== null && _a !== void 0 ? _a : 2}`;
     }
     componentDidLoad() {
         if (this.collapsed)
@@ -44,7 +33,7 @@ export class PostCollapsible {
             return open;
         this.isOpen = !this.isOpen;
         if (this.isLoaded)
-            this.collapseChange.emit();
+            this.collapseChange.emit(this.isOpen);
         const animation = open ? expand(this.collapsible) : collapse(this.collapsible);
         if (!this.isLoaded || isMotionReduced())
             animation.finish();
@@ -53,8 +42,7 @@ export class PostCollapsible {
         return this.isOpen;
     }
     render() {
-        const collapse = (h("div", { "aria-labelledby": this.hasHeader ? `${this.id}--header` : undefined, class: `collapse${this.hasHeader ? ' accordion-collapse' : ''}`, id: `${this.id}--collapse`, ref: el => (this.collapsible = el) }, this.hasHeader ? (h("div", { class: "accordion-body" }, h("slot", null))) : (h("slot", null))));
-        return (h(Host, { id: this.id, "data-version": version }, this.hasHeader ? (h("div", { part: "accordion-item", class: "accordion-item" }, h(this.headingTag, { class: "accordion-header", id: `${this.id}--header` }, h("button", { "aria-controls": `${this.id}--collapse`, "aria-expanded": `${this.isOpen}`, class: `accordion-button${this.isOpen ? '' : ' collapsed'}`, onClick: () => this.toggle(), type: "button" }, h("slot", { name: "header" }))), collapse)) : (collapse)));
+        return (h(Host, { id: this.id, "data-version": version }, h("div", { class: "collapse", id: `${this.id}--collapse`, ref: el => (this.collapsible = el) }, h("slot", null))));
     }
     static get is() { return "post-collapsible"; }
     static get encapsulation() { return "shadow"; }
@@ -87,39 +75,13 @@ export class PostCollapsible {
                 "attribute": "collapsed",
                 "reflect": false,
                 "defaultValue": "false"
-            },
-            "headingLevel": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "HeadingLevel",
-                    "resolved": "1 | 2 | 3 | 4 | 5 | 6",
-                    "references": {
-                        "HeadingLevel": {
-                            "location": "import",
-                            "path": "./heading-levels",
-                            "id": "src/components/post-collapsible/heading-levels.ts::HeadingLevel"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Defines the hierarchical level of the collapsible header within the headings structure."
-                },
-                "attribute": "heading-level",
-                "reflect": false,
-                "defaultValue": "2"
             }
         };
     }
     static get states() {
         return {
             "id": {},
-            "isOpen": {},
-            "hasHeader": {},
-            "headingTag": {}
+            "isOpen": {}
         };
     }
     static get events() {
@@ -131,11 +93,11 @@ export class PostCollapsible {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "An event emitted when the collapse element is shown or hidden, before the transition. It has no payload."
+                    "text": "An event emitted when the collapse element is shown or hidden, before the transition.\n\nThe event payload is a boolean: `true` if the collapsible was opened, `false` if it was closed."
                 },
                 "complexType": {
-                    "original": "void",
-                    "resolved": "void",
+                    "original": "boolean",
+                    "resolved": "boolean",
                     "references": {}
                 }
             }];
@@ -170,9 +132,6 @@ export class PostCollapsible {
         return [{
                 "propName": "collapsed",
                 "methodName": "validateCollapsed"
-            }, {
-                "propName": "headingLevel",
-                "methodName": "validateHeadingLevel"
             }];
     }
 }

package/dist/collection/components/post-collapsible/post-collapsible.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"post-collapsible.js","sourceRoot":"","sources":["../../../../src/components/post-collapsible/post-collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,~~iBAAiB,EAAE,~~gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;~~AACnF,OAAO,EAAE,cAAc,EAAgB,MAAM,kBAAkB,CAAC;~~AAOhE,MAAM,OAAO,eAAe;;QAClB,aAAQ,GAAG,KAAK,CAAC;;sBAMP,IAAI~~;;;yBAOiB~~,KAAK~~;4BAcG,CAAC~~;;~~IAXhD~~,iBAAiB,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS;QACzC,gBAAgB,CACd,QAAQ,EACR,SAAS,EACT,uEAAuE,CACxE,CAAC;IACJ,CAAC;~~IAQD~~,~~oBAAoB,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY;QAC/C,~~iBAAiB~~,CACf,QAAQ,EACR,cAAc,EACd,yFAAyF,CAC1F,CAAC~~;~~IACJ,CAAC;IAOD,iBAAiB;~~QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;~~QACzB~~,~~IAAI,~~CAAC~~,oBAAoB,EAAE,CAAC~~;~~IAC9B,CAAC;~~IAED,mBAAmB;;QACjB,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,IAAI,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC;~~QACpD~~,~~IAAI,~~CAAC~~,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC~~;~~QAC1E,IAAI,CAAC,UAAU,GAAG,IAAI,MAAA,IAAI,CAAC,YAAY,mCAAI,CAAC,EAAE,CAAC;IACjD,CAAC;~~IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,SAAS;YAAE,KAAK,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5C,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAED;;;;OAIG;IAEH,KAAK,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,MAAM;QAC9B,IAAI,IAAI,KAAK,IAAI,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QAEtC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,cAAc,CAAC,IAAI,~~EAAE~~,CAAC;~~QAE9C~~,MAAM,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAE/E,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAe,EAAE;YAAE,SAAS,CAAC,MAAM,EAAE,CAAC;QAE5D,MAAM,SAAS,CAAC,QAAQ,CAAC;QAEzB,SAAS,CAAC,YAAY,EAAE,CAAC;QAEzB,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,MAAM;QACJ,MAAM,QAAQ,GAAG,CACf,8BACmB,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,EAClE,KAAK,EAAE,WAAW,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAAE,EAC/D,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,YAAY,EAC1B,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,IAEjC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAChB,WAAK,KAAK,EAAC,gBAAgB;YACzB,eAAQ,CACJ,CACP,CAAC,CAAC,CAAC,CACF,eAAQ,CACT,CACG,CACP,CAAC;QAEF,OAAO,CACL,EAAC,IAAI,IAAC,EAAE,EAAE,IAAI,CAAC,EAAE,kBAAgB,OAAO,~~IACrC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAChB,~~WAAK,~~IAAI,EAAC,gBAAgB,EAAC,~~KAAK,EAAC,~~gBAAgB;YAC/C,EAAC,IAAI,CAAC,~~UAAU,~~IAAC,KAAK,~~EAAC,~~kBAAkB,EAAC,~~EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,~~UAAU;gBAChE,+BACiB~~,~~GAAG,IAAI,CAAC,~~EAAE,~~YAAY,mBACtB,~~GAAG,~~IAAI,CAAC,MAAM,~~EAAE,~~EAC/B,KAAK,~~EAAE,~~mBAAmB,IAAI,~~CAAC,~~MAAM~~,CAAC,CAAC,~~CAAC~~,~~EAAE,~~CAAC,~~CAAC~~,~~CAAC,YAAY,EAAE,EAC3D,OAAO,EAAE,~~GAAG,EAAE,CAAC~~,IAAI,CAAC,MAAM,EAAE,EAC5B,IAAI,EAAC,QAAQ~~;~~oBAEb~~,~~YAAM~~,~~IAAI~~,~~EAAC~~,~~QAAQ,GAAG,CACf,CACO;YAEjB,QAAQ,CACL,CACP,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACI,~~CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { collapse, expand } from '../../animations/collapse';\nimport { ~~checkEmptyOrOneOf,~~ checkEmptyOrType, isMotionReduced } from '../../utils';\~~nimport { HEADING_LEVELS, HeadingLevel } from './heading-levels';\~~n\n@Component({\n tag: 'post-collapsible',\n styleUrl: 'post-collapsible.scss',\n shadow: true,\n})\nexport class PostCollapsible {\n private isLoaded = false;\n private collapsible: HTMLElement;\n\n @Element() host: HTMLPostCollapsibleElement;\n\n @State() id: string;\n @State() isOpen = true;\n ~~@State() hasHeader: boolean;\n @State() headingTag: string;\n~~\n /*\n If `true`, the element is initially collapsed otherwise it is displayed.\n /\n @Prop() readonly collapsed?: boolean = false;\n\n @Watch('collapsed')\n validateCollapsed(newValue = this.collapsed) {\n checkEmptyOrType(\n newValue,\n 'boolean',\n 'The `collapsed` property of the `post-collapsible` must be a boolean.',\n );\n }\n\n /\n ~~Defines~~ the ~~hierarchical~~ ~~level~~ of ~~the~~ ~~collapsible~~ ~~header~~ ~~within~~ the ~~headings structure~~.\n /\n ~~@Prop()~~ ~~readonly~~ ~~headingLevel?:~~ ~~HeadingLevel~~ = ~~2;\n\n @Watch('headingLevel')\n validateHeadingLevel(newValue~~ = ~~this.headingLevel) {\n checkEmptyOrOneOf(\n newValue,\n HEADING_LEVELS,\n 'The~~ `~~headingLevel~~` ~~property~~ of the ~~`post-~~collapsible` ~~must~~ ~~be a number between 1 and 6.',\n );\n }\n\n /\n An event emitted when the collapse element is shown or hidden~~, ~~before~~ ~~the~~ ~~transition.~~ It ~~has no payload~~.\n /\n @Event() collapseChange: EventEmitter<~~void~~>;\n\n connectedCallback() {\n this.validateCollapsed();\n ~~this.validateHeadingLevel();\n~~ }\n\n componentWillRender() {\n this.id = this.host.id \|\| `c${crypto.randomUUID()}`;\n ~~this.hasHeader = this.host.querySelectorAll('[slot=\"header\"]').length > 0;\n this.headingTag = `h${this.headingLevel ?? 2}`;\n~~ }\n\n componentDidLoad() {\n if (this.collapsed) void this.toggle(false);\n this.isLoaded = true;\n }\n\n /\n Triggers the collapse programmatically.\n \n If there is a collapsing transition running already, it will be reversed.\n */\n @Method()\n async toggle(open = !this.isOpen): Promise<boolean> {\n if (open === this.isOpen) return open;\n\n this.isOpen = !this.isOpen;\n if (this.isLoaded) this.collapseChange.emit();\n\n const animation = open ? expand(this.collapsible) : collapse(this.collapsible);\n\n if (!this.isLoaded \|\| isMotionReduced()) animation.finish();\n\n await animation.finished;\n\n animation.commitStyles();\n\n return this.isOpen;\n }\n\n render() {\n const collapse = (\n <div\n aria-labelledby={this.hasHeader ? `${this.id}--header` : undefined}\n class={`collapse${this.hasHeader ? ' accordion-collapse' : ''}`}\n id={`${this.id}--collapse`}\n ref={el => (this.collapsible = el)}\n >\n {this.hasHeader ? (\n <div class=\"accordion-body\">\n <slot />\n </div>\n ) : (\n <slot />\n )}\n </div>\n );\n\n return (\n <Host id={this.id} data-version={version}>\n ~~{this.hasHeader ? (\n~~ <div ~~part=\"accordion-item\"~~ class=\"~~accordion-item~~\"~~>\n <this.headingTag~~ ~~class=\"accordion-header\"~~ id={`${this.id}--~~header`}>\n <button\n aria-controls={`${this.id}--~~collapse`}~~\n aria-expanded={`${this.isOpen}`}\n class={`accordion-button${this.isOpen~~ ~~? '' : ' collapsed'}`}\n onClick~~={() => this.~~toggle(~~)}~~\n type=\"button\"\n~~ >\n <slot ~~name=\"header\"~~ />\n </~~button>\n </this.headingTag>\n\n {collapse}\n </~~div>\n ~~) : (\n collapse\n )}\n~~ </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"post-collapsible.js","sourceRoot":"","sources":["../../../../src/components/post-collapsible/post-collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,KAAK,EACL,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAOhE,MAAM,OAAO,eAAe;;QAClB,aAAQ,GAAG,KAAK,CAAC;;sBAMP,IAAI;yBAKiB,KAAK;;IAG5C,iBAAiB,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS;QACzC,gBAAgB,CACd,QAAQ,EACR,SAAS,EACT,uEAAuE,CACxE,CAAC;IACJ,CAAC;IASD,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,IAAI,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC;IACtD,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,SAAS;YAAE,KAAK,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC5C,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAED;;;;OAIG;IAEH,KAAK,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,MAAM;QAC9B,IAAI,IAAI,KAAK,IAAI,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QAEtC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC3B,IAAI,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAEzD,MAAM,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAE/E,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAe,EAAE;YAAE,SAAS,CAAC,MAAM,EAAE,CAAC;QAE5D,MAAM,SAAS,CAAC,QAAQ,CAAC;QAEzB,SAAS,CAAC,YAAY,EAAE,CAAC;QAEzB,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,IAAC,EAAE,EAAE,IAAI,CAAC,EAAE,kBAAgB,OAAO;YACtC,WAAK,KAAK,EAAC,UAAU,EAAC,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;gBAClF,eAAQ,CACJ,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { collapse, expand } from '../../animations/collapse';\nimport { checkEmptyOrType, isMotionReduced } from '../../utils';\n\n@Component({\n tag: 'post-collapsible',\n styleUrl: 'post-collapsible.scss',\n shadow: true,\n})\nexport class PostCollapsible {\n private isLoaded = false;\n private collapsible: HTMLElement;\n\n @Element() host: HTMLPostCollapsibleElement;\n\n @State() id: string;\n @State() isOpen = true;\n\n /*\n If `true`, the element is initially collapsed otherwise it is displayed.\n /\n @Prop() readonly collapsed?: boolean = false;\n\n @Watch('collapsed')\n validateCollapsed(newValue = this.collapsed) {\n checkEmptyOrType(\n newValue,\n 'boolean',\n 'The `collapsed` property of the `post-collapsible` must be a boolean.',\n );\n }\n\n /\n An event emitted when the collapse element is shown or hidden, before the transition.\n \n The event payload is a boolean: `true` if the collapsible was opened, `false` if it was closed.\n /\n @Event() collapseChange: EventEmitter<boolean>;\n\n connectedCallback() {\n this.validateCollapsed();\n }\n\n componentWillRender() {\n this.id = this.host.id \|\| `c${crypto.randomUUID()}`;\n }\n\n componentDidLoad() {\n if (this.collapsed) void this.toggle(false);\n this.isLoaded = true;\n }\n\n /\n Triggers the collapse programmatically.\n \n If there is a collapsing transition running already, it will be reversed.\n */\n @Method()\n async toggle(open = !this.isOpen): Promise<boolean> {\n if (open === this.isOpen) return open;\n\n this.isOpen = !this.isOpen;\n if (this.isLoaded) this.collapseChange.emit(this.isOpen);\n\n const animation = open ? expand(this.collapsible) : collapse(this.collapsible);\n\n if (!this.isLoaded \|\| isMotionReduced()) animation.finish();\n\n await animation.finished;\n\n animation.commitStyles();\n\n return this.isOpen;\n }\n\n render() {\n return (\n <Host id={this.id} data-version={version}>\n <div class=\"collapse\" id={`${this.id}--collapse`} ref={el => (this.collapsible = el)}>\n <slot />\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/post-popover/post-popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"post-popover.js","sourceRoot":"","sources":["../../../../src/components/post-popover/post-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport { Placement } from '@floating-ui/dom';\n\nimport { version } from '../../../package.json';\n@Component({\n tag: 'post-popover',\n styleUrl: 'post-popover.scss',\n shadow: true,\n})\nexport class PostPopover {\n private popoverRef: HTMLPostPopovercontainerElement;\n private localTogglePopover: (e: Event) => Promise<void>;\n private localEnterTogglePopover: (e: KeyboardEvent) => void;\n private localTouchTogglePopover: (e: TouchEvent) => void;\n private currentTarget: HTMLElement;\n\n @Element() host: HTMLPostPopoverElement;\n\n /*\n Defines the placement of the popover according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\n * Popoverss are automatically flipped to the opposite side if there is not enough available space and are shifted\n * towards the viewport if they would overlap edge boundaries.\n /\n @Prop() readonly placement?: Placement = 'top';\n\n /\n Define the caption of the close button for assistive technology\n /\n @Prop() readonly closeButtonCaption!: string;\n /\n Show a little indicator arrow\n /\n // eslint-disable-next-line @stencil-community/ban-default-true\n @Prop() readonly arrow?: boolean = true;\n\n constructor() {\n this.localTogglePopover = e => this.toggle(e.target as HTMLElement);\n this.localEnterTogglePopover = e => {\n if (e.key === 'Enter') this.toggle(e.target as HTMLElement);\n };\n this.localTouchTogglePopover = e => {\n e.preventDefault();\n this.toggle(e.target as HTMLElement);\n };\n }\n\n connectedCallback() {\n if (!this.triggers) {\n throw new Error(`No trigger found for <post-popover popover-id=\"${this.host.id}`);\n }\n\n // As long as cross-shadow-boundary [popovertarget] and button.popoverTargetElement are not working\n // we're left with listening to trigger events ourselves\n // https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/popoverTargetElement\n // https://github.com/whatwg/html/issues/9109#issuecomment-1494030465 (does not seem to work for now)\n // https://stackoverflow.com/questions/77324143/popovertargetelement-does-not-cross-shadow-boundaries?noredirect=1#comment136318281_77324143\n this.triggers.forEach(trigger => {\n // See this.onToggle for one time mouse event listener\n trigger.addEventListener('mouseup', this.localTogglePopover, { once: true });\n trigger.addEventListener('keypress', this.localEnterTogglePopover);\n trigger.addEventListener('touch', this.localTouchTogglePopover, { once: true });\n trigger.setAttribute('aria-expanded', 'false');\n });\n }\n\n disconnectedCallback() {\n this.triggers.forEach(trigger => {\n trigger.removeEventListener('mouseup', this.localTogglePopover);\n trigger.removeEventListener('keypress', this.localEnterTogglePopover);\n trigger.removeEventListener('touch', this.localTouchTogglePopover);\n trigger.removeAttribute('aria-expanded');\n });\n }\n\n /\n Programmatically display the popover\n * @param target An element with [data-popover-target=\"id\"] where the popover should be shown\n /\n @Method()\n async show(target: HTMLElement) {\n this.currentTarget = target;\n this.popoverRef.show(target);\n target.setAttribute('aria-expanded', 'true');\n }\n\n /\n Programmatically hide this popover\n /\n @Method()\n async hide() {\n this.popoverRef.hide();\n this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));\n }\n\n /\n Toggle popover display\n * @param target An element with [data-popover-target=\"id\"] where the popover should be anchored to\n * @param force Pass true to always show or false to always hide\n /\n @Method()\n async toggle(target: HTMLElement, force?: boolean) {\n this.currentTarget = target;\n const newState = await this.popoverRef.toggle(target, force);\n target.setAttribute('aria-expanded', `${newState}`);\n }\n\n private get triggers() {\n return document.querySelectorAll(`[data-popover-target=\"${this.host.id}\"]`);\n }\n\n /\n One time event handler for click events\n * A permanent event listener would prevent a toggle button from working properly:\n * A click opens the popover, a second click first closes it (due to light dismiss), then directly\n * opens it again because of the click listener on the button. Registering a new\n * one time listener after a small timeout solves this issue.\n * @param e toggle event from post-popovercontainer\n */\n private onToggle(e: CustomEvent<boolean>) {\n if (this.currentTarget) {\n this.currentTarget.setAttribute('aria-expanded', `${e.detail}`);\n }\n if (!e.detail) {\n window.requestAnimationFrame(() => {\n this.triggers.forEach(trigger => {\n trigger.addEventListener('mouseup', this.localTogglePopover, { once: true });\n trigger.addEventListener('touch', this.localTouchTogglePopover, { once: true });\n });\n });\n\n // Handle missing re-focusing logic after close. Can be removed as soon as popovertarget works correctly\n if (this.currentTarget) {\n this.currentTarget.focus();\n this.currentTarget = null;\n }\n }\n }\n\n // Fix for firefox to prevent the following lines from triggering\n // https://github.com/oddbird/popover-polyfill/blob/main/src/popover.ts#L338\n private stopImmediatePropagation(e: PointerEvent) {\n e.stopImmediatePropagation();\n }\n\n render() {\n return (\n <Host data-version={version}>\n <post-popovercontainer\n arrow={this.arrow}\n placement={this.placement}\n ref={e => (this.popoverRef = e)}\n onPostPopoverToggled={e => this.onToggle(e)}\n >\n <div\n class=\"popover-container\"\n onPointerDown={e => this.stopImmediatePropagation(e)}\n onPointerUp={e => this.stopImmediatePropagation(e)}\n >\n <div class=\"popover-content\">\n <slot></slot>\n </div>\n <button class=\"btn-close\" onClick={() => this.hide()}>\n <span class=\"visually-hidden\">{this.closeButtonCaption}</span>\n </button>\n </div>\n </post-popovercontainer>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"post-popover.js","sourceRoot":"","sources":["../../../../src/components/post-popover/post-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport { Placement } from '@floating-ui/dom';\n\nimport { version } from '../../../package.json';\n@Component({\n tag: 'post-popover',\n styleUrl: 'post-popover.scss',\n shadow: true,\n})\nexport class PostPopover {\n private popoverRef: HTMLPostPopovercontainerElement;\n private localTogglePopover: (e: Event) => Promise<void>;\n private localEnterTogglePopover: (e: KeyboardEvent) => void;\n private localTouchTogglePopover: (e: TouchEvent) => void;\n private currentTarget: HTMLElement;\n\n @Element() host: HTMLPostPopoverElement;\n\n /*\n Defines the placement of the popover according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\n * Popoverss are automatically flipped to the opposite side if there is not enough available space and are shifted\n * towards the viewport if they would overlap edge boundaries.\n /\n @Prop() readonly placement?: Placement = 'top';\n\n /\n Define the caption of the close button for assistive technology\n /\n @Prop() readonly closeButtonCaption!: string;\n /\n Show a little indicator arrow\n /\n // eslint-disable-next-line @stencil-community/ban-default-true\n @Prop() readonly arrow?: boolean = true;\n\n constructor() {\n this.localTogglePopover = e => this.toggle(e.target as HTMLElement);\n this.localEnterTogglePopover = e => {\n if (e.key === 'Enter') this.toggle(e.target as HTMLElement);\n };\n this.localTouchTogglePopover = e => {\n e.preventDefault();\n this.toggle(e.target as HTMLElement);\n };\n }\n\n connectedCallback() {\n if (!this.triggers) {\n throw new Error(`No trigger found for <post-popover popover-id=\"${this.host.id}`);\n }\n\n // As long as cross-shadow-boundary [popovertarget] and button.popoverTargetElement are not working\n // we're left with listening to trigger events ourselves\n // https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/popoverTargetElement\n // https://github.com/whatwg/html/issues/9109#issuecomment-1494030465 (does not seem to work for now)\n // https://stackoverflow.com/questions/77324143/popovertargetelement-does-not-cross-shadow-boundaries?noredirect=1#comment136318281_77324143\n this.triggers.forEach(trigger => {\n // See this.onToggle for one time mouse event listener\n trigger.addEventListener('mouseup', this.localTogglePopover, { once: true });\n trigger.addEventListener('keypress', this.localEnterTogglePopover);\n trigger.addEventListener('touch', this.localTouchTogglePopover, { once: true });\n trigger.setAttribute('aria-expanded', 'false');\n });\n }\n\n disconnectedCallback() {\n this.triggers.forEach(trigger => {\n trigger.removeEventListener('mouseup', this.localTogglePopover);\n trigger.removeEventListener('keypress', this.localEnterTogglePopover);\n trigger.removeEventListener('touch', this.localTouchTogglePopover);\n trigger.removeAttribute('aria-expanded');\n });\n }\n\n /\n Programmatically display the popover\n * @param target An element with [data-popover-target=\"id\"] where the popover should be shown\n /\n @Method()\n async show(target: HTMLElement) {\n this.currentTarget = target;\n this.popoverRef.show(target);\n target.setAttribute('aria-expanded', 'true');\n }\n\n /\n Programmatically hide this popover\n /\n @Method()\n async hide() {\n this.popoverRef.hide();\n this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));\n }\n\n /\n Toggle popover display\n * @param target An element with [data-popover-target=\"id\"] where the popover should be anchored to\n * @param force Pass true to always show or false to always hide\n /\n @Method()\n async toggle(target: HTMLElement, force?: boolean) {\n this.currentTarget = target;\n const newState = await this.popoverRef.toggle(target, force);\n target.setAttribute('aria-expanded', `${newState}`);\n }\n\n private get triggers() {\n return document.querySelectorAll(`[data-popover-target=\"${this.host.id}\"]`);\n }\n\n /\n One time event handler for click events\n * A permanent event listener would prevent a toggle button from working properly:\n * A click opens the popover, a second click first closes it (due to light dismiss), then directly\n * opens it again because of the click listener on the button. Registering a new\n * one time listener after a small timeout solves this issue.\n * @param e toggle event from post-popovercontainer\n */\n private onToggle(e: CustomEvent<boolean>) {\n if (this.currentTarget) {\n this.currentTarget.setAttribute('aria-expanded', `${e.detail}`);\n }\n if (!e.detail) {\n window.requestAnimationFrame(() => {\n this.triggers.forEach(trigger => {\n trigger.addEventListener('mouseup', this.localTogglePopover, { once: true });\n trigger.addEventListener('touch', this.localTouchTogglePopover, { once: true });\n });\n });\n\n // Handle missing re-focusing logic after close. Can be removed as soon as popovertarget works correctly\n if (this.currentTarget) {\n this.currentTarget.focus();\n this.currentTarget = null;\n }\n }\n }\n\n // Fix for firefox to prevent the following lines from triggering\n // https://github.com/oddbird/popover-polyfill/blob/main/src/popover.ts#L338\n private stopImmediatePropagation(e: PointerEvent) {\n e.stopImmediatePropagation();\n }\n\n render() {\n return (\n <Host data-version={version}>\n <post-popovercontainer\n arrow={this.arrow}\n placement={this.placement}\n ref={e => (this.popoverRef = e)}\n onPostPopoverToggled={e => this.onToggle(e)}\n >\n <div\n class=\"popover-container\"\n onPointerDown={e => this.stopImmediatePropagation(e)}\n onPointerUp={e => this.stopImmediatePropagation(e)}\n >\n <div class=\"popover-content\">\n <slot></slot>\n </div>\n <button class=\"btn-close\" onClick={() => this.hide()}>\n <span class=\"visually-hidden\">{this.closeButtonCaption}</span>\n </button>\n </div>\n </post-popovercontainer>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/post-popovercontainer/post-popovercontainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"post-popovercontainer.js","sourceRoot":"","sources":["../../../../src/components/post-popovercontainer/post-popovercontainer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport {\n arrow,\n autoUpdate,\n computePosition,\n flip,\n inline,\n offset,\n Placement,\n shift,\n limitShift,\n size,\n} from '@floating-ui/dom';\n\n// Polyfill for popovers, can be removed when https://caniuse.com/?search=popover is green\nimport '@oddbird/popover-polyfill';\n\nimport { version } from '../../../package.json';\n\nconst SIDE_MAP = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n};\n\ninterface PopoverElement {\n showPopover: () => void;\n hidePopover: () => void;\n togglePopover: (force?: boolean) => boolean;\n}\n\nexport type PostPopoverElement = HTMLElement & PopoverElement;\n\n@Component({\n tag: 'post-popovercontainer',\n styleUrl: 'post-popovercontainer.scss',\n shadow: true,\n})\nexport class PostPopovercontainer {\n @Element() host: HTMLPostPopovercontainerElement;\n private popoverRef: PostPopoverElement;\n private arrowRef: HTMLElement;\n private eventTarget: Element;\n private clearAutoUpdate: () => void;\n\n /*\n Fires whenever the popover gets shown or hidden, passing the new state in event.details as a boolean\n /\n @Event() postPopoverToggled: EventEmitter<boolean>;\n\n /\n Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\n * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted\n * towards the viewport if they would overlap edge boundaries.\n /\n @Prop() readonly placement?: Placement = 'top';\n\n /\n Wheter or not to display a little pointer arrow\n /\n @Prop() readonly arrow?: boolean = false;\n\n componentDidLoad() {\n this.popoverRef.setAttribute('popover', '');\n this.popoverRef.addEventListener('beforetoggle', this.handleToggle.bind(this));\n }\n\n disconnectedCallback() {\n if (this.popoverRef)\n this.popoverRef.removeEventListener('beforetoggle', e =>\n this.toggle(e.target as HTMLPostPopovercontainerElement),\n );\n\n if (typeof this.clearAutoUpdate === 'function') this.clearAutoUpdate();\n }\n\n /\n Programmatically display the tooltip\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n /\n @Method()\n async show(target: HTMLElement) {\n this.eventTarget = target;\n this.popoverRef.showPopover();\n }\n\n /\n Programmatically hide this tooltip\n /\n @Method()\n async hide() {\n this.eventTarget = null;\n this.popoverRef.hidePopover();\n }\n\n /\n Toggle tooltip display\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n * @param force Pass true to always show or false to always hide\n /\n @Method()\n async toggle(target: HTMLElement, force?: boolean): Promise<boolean> {\n this.eventTarget = target;\n this.popoverRef.togglePopover(force);\n return this.popoverRef.matches(':popover-open');\n }\n\n /\n Start or stop auto updates based on tooltip events.\n * Tooltips can be closed or opened with other methods than class members,\n * therefore listening to the toggle event is safer for cleaning up.\n * @param e ToggleEvent\n /\n private handleToggle(e: ToggleEvent) {\n const isOpen = e.newState === 'open';\n if (isOpen) {\n this.startAutoupdates();\n } else {\n if (typeof this.clearAutoUpdate === 'function') this.clearAutoUpdate();\n }\n this.postPopoverToggled.emit(isOpen);\n }\n\n /\n Start listening for DOM updates, scroll events etc. that have\n * an influence on tooltip positioning\n */\n private startAutoupdates() {\n this.clearAutoUpdate = autoUpdate(\n this.eventTarget,\n this.popoverRef,\n this.calculatePosition.bind(this),\n );\n }\n\n private async calculatePosition() {\n const middleware = [\n flip(),\n inline(),\n shift({\n padding: 8,\n\n // Prevents shifting away from the anchor too far, while shifting as far as possible\n // https://floating-ui.com/docs/shift#limiter\n limiter: limitShift({\n offset: 32,\n }),\n }),\n size({\n apply({ availableWidth, elements }) {\n Object.assign(elements.floating.style, {\n maxWidth: `${availableWidth - 16}px`,\n });\n },\n }),\n offset(this.arrow ? 12 : 8), // 4px outside of element to account for focus outline + ~arrow size\n ];\n\n if (this.arrow) {\n middleware.push(arrow({ element: this.arrowRef, padding: 8 }));\n }\n\n const {\n x,\n y,\n middlewareData,\n placement: currentPlacement,\n } = await computePosition(this.eventTarget, this.popoverRef, {\n placement: this.placement \|\| 'top',\n strategy: 'fixed',\n middleware,\n });\n\n // Tooltip\n this.popoverRef.style.left = `${x}px`;\n this.popoverRef.style.top = `${y}px`;\n\n // Arrow\n if (this.arrow) {\n // Tutorial: https://codesandbox.io/s/mystifying-kare-ee3hmh?file=/src/index.js\n const side = currentPlacement.split('-')[0];\n const { x: arrowX, y: arrowY } = middlewareData.arrow;\n const staticSide = SIDE_MAP[side];\n\n Object.assign(this.arrowRef.style, {\n top: arrowY ? `${arrowY}px` : '',\n left: arrowX ? `${arrowX}px` : '',\n [staticSide]: `${-this.arrowRef.offsetWidth / 2}px`,\n });\n }\n }\n\n render() {\n return (\n <Host data-version={version}>\n <div\n class=\"popover\"\n part=\"popover\"\n ref={(el: HTMLDivElement & PostPopoverElement) => (this.popoverRef = el)}\n >\n {this.arrow && (\n <span\n class=\"arrow\"\n ref={el => {\n this.arrowRef = el;\n }}\n ></span>\n )}\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"post-popovercontainer.js","sourceRoot":"","sources":["../../../../src/components/post-popovercontainer/post-popovercontainer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport {\n arrow,\n autoUpdate,\n computePosition,\n flip,\n inline,\n offset,\n Placement,\n shift,\n limitShift,\n size,\n} from '@floating-ui/dom';\n\n// Polyfill for popovers, can be removed when https://caniuse.com/?search=popover is green\nimport '@oddbird/popover-polyfill';\n\nimport { version } from '../../../package.json';\n\nconst SIDE_MAP = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n};\n\ninterface PopoverElement {\n showPopover: () => void;\n hidePopover: () => void;\n togglePopover: (force?: boolean) => boolean;\n}\n\nexport type PostPopoverElement = HTMLElement & PopoverElement;\n\n@Component({\n tag: 'post-popovercontainer',\n styleUrl: 'post-popovercontainer.scss',\n shadow: true,\n})\nexport class PostPopovercontainer {\n @Element() host: HTMLPostPopovercontainerElement;\n private popoverRef: PostPopoverElement;\n private arrowRef: HTMLElement;\n private eventTarget: Element;\n private clearAutoUpdate: () => void;\n\n /*\n Fires whenever the popover gets shown or hidden, passing the new state in event.details as a boolean\n /\n @Event() postPopoverToggled: EventEmitter<boolean>;\n\n /\n Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\n * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted\n * towards the viewport if they would overlap edge boundaries.\n /\n @Prop() readonly placement?: Placement = 'top';\n\n /\n Wheter or not to display a little pointer arrow\n /\n @Prop() readonly arrow?: boolean = false;\n\n componentDidLoad() {\n this.popoverRef.setAttribute('popover', '');\n this.popoverRef.addEventListener('beforetoggle', this.handleToggle.bind(this));\n }\n\n disconnectedCallback() {\n if (this.popoverRef)\n this.popoverRef.removeEventListener('beforetoggle', e =>\n this.toggle(e.target as HTMLPostPopovercontainerElement),\n );\n\n if (typeof this.clearAutoUpdate === 'function') this.clearAutoUpdate();\n }\n\n /\n Programmatically display the tooltip\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n /\n @Method()\n async show(target: HTMLElement) {\n this.eventTarget = target;\n this.popoverRef.showPopover();\n }\n\n /\n Programmatically hide this tooltip\n /\n @Method()\n async hide() {\n this.eventTarget = null;\n this.popoverRef.hidePopover();\n }\n\n /\n Toggle tooltip display\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n * @param force Pass true to always show or false to always hide\n /\n @Method()\n async toggle(target: HTMLElement, force?: boolean): Promise<boolean> {\n this.eventTarget = target;\n this.popoverRef.togglePopover(force);\n return this.popoverRef.matches(':popover-open');\n }\n\n /\n Start or stop auto updates based on tooltip events.\n * Tooltips can be closed or opened with other methods than class members,\n * therefore listening to the toggle event is safer for cleaning up.\n * @param e ToggleEvent\n /\n private handleToggle(e: ToggleEvent) {\n const isOpen = e.newState === 'open';\n if (isOpen) {\n this.startAutoupdates();\n } else {\n if (typeof this.clearAutoUpdate === 'function') this.clearAutoUpdate();\n }\n this.postPopoverToggled.emit(isOpen);\n }\n\n /\n Start listening for DOM updates, scroll events etc. that have\n * an influence on tooltip positioning\n */\n private startAutoupdates() {\n this.clearAutoUpdate = autoUpdate(\n this.eventTarget,\n this.popoverRef,\n this.calculatePosition.bind(this),\n );\n }\n\n private async calculatePosition() {\n const middleware = [\n flip(),\n inline(),\n shift({\n padding: 8,\n\n // Prevents shifting away from the anchor too far, while shifting as far as possible\n // https://floating-ui.com/docs/shift#limiter\n limiter: limitShift({\n offset: 32,\n }),\n }),\n size({\n apply({ availableWidth, elements }) {\n Object.assign(elements.floating.style, {\n maxWidth: `${availableWidth - 16}px`,\n });\n },\n }),\n offset(this.arrow ? 12 : 8), // 4px outside of element to account for focus outline + ~arrow size\n ];\n\n if (this.arrow) {\n middleware.push(arrow({ element: this.arrowRef, padding: 8 }));\n }\n\n const {\n x,\n y,\n middlewareData,\n placement: currentPlacement,\n } = await computePosition(this.eventTarget, this.popoverRef, {\n placement: this.placement \|\| 'top',\n strategy: 'fixed',\n middleware,\n });\n\n // Tooltip\n this.popoverRef.style.left = `${x}px`;\n this.popoverRef.style.top = `${y}px`;\n\n // Arrow\n if (this.arrow) {\n // Tutorial: https://codesandbox.io/s/mystifying-kare-ee3hmh?file=/src/index.js\n const side = currentPlacement.split('-')[0];\n const { x: arrowX, y: arrowY } = middlewareData.arrow;\n const staticSide = SIDE_MAP[side];\n\n Object.assign(this.arrowRef.style, {\n top: arrowY ? `${arrowY}px` : '',\n left: arrowX ? `${arrowX}px` : '',\n [staticSide]: `${-this.arrowRef.offsetWidth / 2}px`,\n });\n }\n }\n\n render() {\n return (\n <Host data-version={version}>\n <div\n class=\"popover\"\n part=\"popover\"\n ref={(el: HTMLDivElement & PostPopoverElement) => (this.popoverRef = el)}\n >\n {this.arrow && (\n <span\n class=\"arrow\"\n ref={el => {\n this.arrowRef = el;\n }}\n ></span>\n )}\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/post-tabs/post-tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"post-tabs.js","sourceRoot":"","sources":["../../../../src/components/post-tabs/post-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { fadeIn, fadeOut } from '../../animations';\n\n@Component({\n tag: 'post-tabs',\n styleUrl: 'post-tabs.scss',\n shadow: true,\n})\nexport class PostTabs {\n private activeTab: HTMLPostTabHeaderElement;\n private showing: Animation;\n private hiding: Animation;\n private isLoaded = false;\n\n private get tabs(): NodeListOf<HTMLPostTabHeaderElement> {\n return this.host.querySelectorAll('post-tab-header');\n }\n\n @Element() host: HTMLPostTabsElement;\n\n /*\n The name of the panel that is initially shown.\n * If not specified, it defaults to the panel associated with the first tab.\n \n Changing this value after initialization has no effect.\n /\n @Prop() readonly activePanel: HTMLPostTabPanelElement['name'];\n\n /\n An event emitted after the active tab changes, when the fade in transition of its associated panel is finished.\n * The payload is the name of the newly shown panel.\n /\n @Event() tabChange: EventEmitter<HTMLPostTabPanelElement['name']>;\n\n componentDidLoad() {\n this.moveMisplacedTabs();\n this.enableTabs();\n\n const initiallyActivePanel = this.activePanel \|\| this.tabs.item(0).panel;\n void this.show(initiallyActivePanel);\n\n this.isLoaded = true;\n }\n\n /\n Shows the panel with the given name and selects its associated tab.\n * Any other panel that was previously shown becomes hidden and its associated tab is unselected.\n */\n @Method()\n async show(panelName: string) {\n // do nothing if the tab is already active\n if (panelName === this.activeTab?.panel) {\n return;\n }\n\n const previousTab = this.activeTab;\n const newTab: HTMLPostTabHeaderElement = this.host.querySelector(\n `post-tab-header[panel=${panelName}]`,\n );\n this.activateTab(newTab);\n\n // if a panel is currently being displayed, remove it from the view and complete the associated animation\n if (this.showing) {\n this.showing.effect['target'].style.display = 'none';\n this.showing.finish();\n }\n\n // hide the currently visible panel only if no other animation is running\n if (previousTab && !this.showing && !this.hiding) {\n this.hidePanel(previousTab.panel);\n }\n\n // wait for any hiding animation to complete before showing the selected tab\n if (this.hiding) {\n await this.hiding.finished;\n }\n\n this.showSelectedPanel();\n\n // wait for any display animation to complete for the returned promise to fully resolve\n if (this.showing) {\n await this.showing.finished;\n }\n\n this.tabChange.emit(this.activeTab.panel);\n }\n\n private moveMisplacedTabs() {\n if (!this.tabs) return;\n\n this.tabs.forEach(tab => {\n if (tab.getAttribute('slot') === 'tabs') return;\n tab.setAttribute('slot', 'tabs');\n });\n }\n\n private enableTabs() {\n if (!this.tabs) return;\n\n this.tabs.forEach(async tab => {\n await tab.componentOnReady();\n\n const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n\n // if the tab has an \"aria-controls\" attribute it was already linked to its panel: do nothing\n if (tabTitle.getAttribute('aria-controls')) return;\n\n const tabPanel = this.getPanel(tab.panel).shadowRoot.querySelector('.tab-pane');\n tabTitle.setAttribute('aria-controls', tabPanel.id);\n tabPanel.setAttribute('aria-labelledby', tabTitle.id);\n\n tab.addEventListener('click', () => {\n void this.show(tab.panel);\n });\n\n tab.addEventListener('keydown', ({ key }) => {\n if (key === 'ArrowRight' \|\| key === 'ArrowLeft') this.navigateTabs(tab, key);\n });\n });\n\n // if the currently active tab was removed from the DOM then select the first one\n if (this.activeTab && !this.activeTab.isConnected) {\n void this.show(this.tabs.item(0).panel);\n }\n }\n\n private activateTab(tab: HTMLPostTabHeaderElement) {\n if (this.activeTab) {\n const tabTitle = this.activeTab.shadowRoot.querySelector('.tab-title');\n tabTitle.setAttribute('aria-selected', 'false');\n tabTitle.setAttribute('tabindex', '-1');\n tabTitle.classList.remove('active');\n }\n\n const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n tabTitle.setAttribute('aria-selected', 'true');\n tabTitle.removeAttribute('tabindex');\n tabTitle.classList.add('active');\n\n this.activeTab = tab;\n }\n\n private hidePanel(panelName: HTMLPostTabPanelElement['name']) {\n const previousPanel = this.getPanel(panelName);\n\n if (!previousPanel) return;\n\n this.hiding = fadeOut(previousPanel);\n this.hiding.onfinish = () => {\n previousPanel.style.display = 'none';\n this.hiding = null;\n };\n }\n\n private showSelectedPanel() {\n const panel = this.getPanel(this.activeTab.panel);\n panel.style.display = 'block';\n\n // prevent the initially selected panel from fading in\n if (!this.isLoaded) return;\n\n this.showing = fadeIn(panel);\n this.showing.onfinish = () => {\n this.showing = null;\n };\n }\n\n private getPanel(name: string): HTMLPostTabPanelElement {\n return this.host.querySelector(`post-tab-panel[name=${name}]`);\n }\n\n private navigateTabs(tab: HTMLPostTabHeaderElement, key: 'ArrowRight' \| 'ArrowLeft') {\n const activeTabIndex = Array.from(this.tabs).indexOf(tab);\n\n let nextTab: HTMLPostTabHeaderElement;\n if (key === 'ArrowRight') {\n nextTab = this.tabs[activeTabIndex + 1] \|\| this.tabs[0];\n } else {\n nextTab = this.tabs[activeTabIndex - 1] \|\| this.tabs[this.tabs.length - 1];\n }\n\n if (!nextTab) return;\n\n const nextTabTitle = nextTab.shadowRoot.querySelector('.tab-title') as HTMLAnchorElement;\n nextTabTitle.focus();\n }\n\n render() {\n return (\n <Host data-version={version}>\n <div class=\"tabs-wrapper\">\n <div class=\"tabs\" role=\"tablist\">\n <slot name=\"tabs\" onSlotchange={() => this.enableTabs()} />\n </div>\n </div>\n <div class=\"tab-content\">\n <slot onSlotchange={() => this.moveMisplacedTabs()} />\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"post-tabs.js","sourceRoot":"","sources":["../../../../src/components/post-tabs/post-tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { fadeIn, fadeOut } from '../../animations';\n\n@Component({\n tag: 'post-tabs',\n styleUrl: 'post-tabs.scss',\n shadow: true,\n})\nexport class PostTabs {\n private activeTab: HTMLPostTabHeaderElement;\n private showing: Animation;\n private hiding: Animation;\n private isLoaded = false;\n\n private get tabs(): NodeListOf<HTMLPostTabHeaderElement> {\n return this.host.querySelectorAll('post-tab-header');\n }\n\n @Element() host: HTMLPostTabsElement;\n\n /*\n The name of the panel that is initially shown.\n * If not specified, it defaults to the panel associated with the first tab.\n \n Changing this value after initialization has no effect.\n /\n @Prop() readonly activePanel: HTMLPostTabPanelElement['name'];\n\n /\n An event emitted after the active tab changes, when the fade in transition of its associated panel is finished.\n * The payload is the name of the newly shown panel.\n /\n @Event() tabChange: EventEmitter<HTMLPostTabPanelElement['name']>;\n\n componentDidLoad() {\n this.moveMisplacedTabs();\n this.enableTabs();\n\n const initiallyActivePanel = this.activePanel \|\| this.tabs.item(0).panel;\n void this.show(initiallyActivePanel);\n\n this.isLoaded = true;\n }\n\n /\n Shows the panel with the given name and selects its associated tab.\n * Any other panel that was previously shown becomes hidden and its associated tab is unselected.\n */\n @Method()\n async show(panelName: string) {\n // do nothing if the tab is already active\n if (panelName === this.activeTab?.panel) {\n return;\n }\n\n const previousTab = this.activeTab;\n const newTab: HTMLPostTabHeaderElement = this.host.querySelector(\n `post-tab-header[panel=${panelName}]`,\n );\n this.activateTab(newTab);\n\n // if a panel is currently being displayed, remove it from the view and complete the associated animation\n if (this.showing) {\n this.showing.effect['target'].style.display = 'none';\n this.showing.finish();\n }\n\n // hide the currently visible panel only if no other animation is running\n if (previousTab && !this.showing && !this.hiding) {\n this.hidePanel(previousTab.panel);\n }\n\n // wait for any hiding animation to complete before showing the selected tab\n if (this.hiding) {\n await this.hiding.finished;\n }\n\n this.showSelectedPanel();\n\n // wait for any display animation to complete for the returned promise to fully resolve\n if (this.showing) {\n await this.showing.finished;\n }\n\n this.tabChange.emit(this.activeTab.panel);\n }\n\n private moveMisplacedTabs() {\n if (!this.tabs) return;\n\n this.tabs.forEach(tab => {\n if (tab.getAttribute('slot') === 'tabs') return;\n tab.setAttribute('slot', 'tabs');\n });\n }\n\n private enableTabs() {\n if (!this.tabs) return;\n\n this.tabs.forEach(async tab => {\n await tab.componentOnReady();\n\n const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n\n // if the tab has an \"aria-controls\" attribute it was already linked to its panel: do nothing\n if (tabTitle.getAttribute('aria-controls')) return;\n\n const tabPanel = this.getPanel(tab.panel).shadowRoot.querySelector('.tab-pane');\n tabTitle.setAttribute('aria-controls', tabPanel.id);\n tabPanel.setAttribute('aria-labelledby', tabTitle.id);\n\n tab.addEventListener('click', () => {\n void this.show(tab.panel);\n });\n\n tab.addEventListener('keydown', ({ key }) => {\n if (key === 'ArrowRight' \|\| key === 'ArrowLeft') this.navigateTabs(tab, key);\n });\n });\n\n // if the currently active tab was removed from the DOM then select the first one\n if (this.activeTab && !this.activeTab.isConnected) {\n void this.show(this.tabs.item(0).panel);\n }\n }\n\n private activateTab(tab: HTMLPostTabHeaderElement) {\n if (this.activeTab) {\n const tabTitle = this.activeTab.shadowRoot.querySelector('.tab-title');\n tabTitle.setAttribute('aria-selected', 'false');\n tabTitle.setAttribute('tabindex', '-1');\n tabTitle.classList.remove('active');\n }\n\n const tabTitle = tab.shadowRoot.querySelector('.tab-title');\n tabTitle.setAttribute('aria-selected', 'true');\n tabTitle.removeAttribute('tabindex');\n tabTitle.classList.add('active');\n\n this.activeTab = tab;\n }\n\n private hidePanel(panelName: HTMLPostTabPanelElement['name']) {\n const previousPanel = this.getPanel(panelName);\n\n if (!previousPanel) return;\n\n this.hiding = fadeOut(previousPanel);\n this.hiding.onfinish = () => {\n previousPanel.style.display = 'none';\n this.hiding = null;\n };\n }\n\n private showSelectedPanel() {\n const panel = this.getPanel(this.activeTab.panel);\n panel.style.display = 'block';\n\n // prevent the initially selected panel from fading in\n if (!this.isLoaded) return;\n\n this.showing = fadeIn(panel);\n this.showing.onfinish = () => {\n this.showing = null;\n };\n }\n\n private getPanel(name: string): HTMLPostTabPanelElement {\n return this.host.querySelector(`post-tab-panel[name=${name}]`);\n }\n\n private navigateTabs(tab: HTMLPostTabHeaderElement, key: 'ArrowRight' \| 'ArrowLeft') {\n const activeTabIndex = Array.from(this.tabs).indexOf(tab);\n\n let nextTab: HTMLPostTabHeaderElement;\n if (key === 'ArrowRight') {\n nextTab = this.tabs[activeTabIndex + 1] \|\| this.tabs[0];\n } else {\n nextTab = this.tabs[activeTabIndex - 1] \|\| this.tabs[this.tabs.length - 1];\n }\n\n if (!nextTab) return;\n\n const nextTabTitle = nextTab.shadowRoot.querySelector('.tab-title') as HTMLAnchorElement;\n nextTabTitle.focus();\n }\n\n render() {\n return (\n <Host data-version={version}>\n <div class=\"tabs-wrapper\">\n <div class=\"tabs\" role=\"tablist\">\n <slot name=\"tabs\" onSlotchange={() => this.enableTabs()} />\n </div>\n </div>\n <div class=\"tab-content\">\n <slot onSlotchange={() => this.moveMisplacedTabs()} />\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/post-tooltip/post-tooltip.css CHANGED Viewed

	@@ -1 +1 @@
1	- :host{--post-contrast-color: #fff;--post-bg-rgb: 51, 51, 51}post-popovercontainer::part(popover){padding:.25rem .5rem}
1	+ :host{--post-contrast-color: #fff;--post-bg-rgb: 51, 51, 51}post-popovercontainer::part(popover){padding:.25rem .5rem;max-width:13.5rem;min-height:1rem}

package/dist/collection/components/post-tooltip/post-tooltip.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { version } from "../../../package.json";
 export class PostTooltip {
     constructor() {
         this.placement = 'top';
+        this.arrow = true;
         // Create local versions of event handlers for de-registration
         // https://stackoverflow.com/questions/33859113/javascript-removeeventlistener-not-working-inside-a-class
         this.localShowTooltip = e => this.show(e.target);
@@ -13,7 +14,9 @@ export class PostTooltip {
     }
     connectedCallback() {
         if (!this.host.id) {
-            throw new Error('No id set: <post-tooltip> must have an id, linking it to it\'s target element using the data-tooltip-target attribute.');
+            throw new Error(
+            /*prettier-ignore*/
+            'No id set: <post-tooltip> must have an id, linking it to it\'s target element using the data-tooltip-target attribute.');
         }
         if (!this.triggers) {
             throw new Error(`No trigger found for <post-tooltip id="${this.host.id}">, please add the 'data-tooltip-target="${this.host.id}" attribute to the trigger element.`);
@@ -81,7 +84,7 @@ export class PostTooltip {
         }
     }
     render() {
-        return (h(Host, { "data-version": version }, h("post-popovercontainer", { role: "tooltip", tabindex: "-1", arrow: true, placement: this.placement, ref: (el) => (this.popoverRef = el) }, h("slot", null))));
+        return (h(Host, { "data-version": version }, h("post-popovercontainer", { role: "tooltip", tabindex: "-1", arrow: this.arrow, placement: this.placement, ref: (el) => (this.popoverRef = el) }, h("slot", null))));
     }
     static get is() { return "post-tooltip"; }
     static get encapsulation() { return "shadow"; }
@@ -120,6 +123,24 @@ export class PostTooltip {
                 "attribute": "placement",
                 "reflect": false,
                 "defaultValue": "'top'"
+            },
+            "arrow": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Wheter or not to display a little pointer arrow"
+                },
+                "attribute": "arrow",
+                "reflect": false,
+                "defaultValue": "true"
             }
         };
     }

package/dist/collection/components/post-tooltip/post-tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"post-tooltip.js","sourceRoot":"","sources":["../../../../src/components/post-tooltip/post-tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAE1E,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD,wCAAwC;AACxC,OAAO,kBAAkB,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAMhD,MAAM,OAAO,WAAW;~~IActB~~;~~yBAFyC~~,KAAK;~~QAG5C~~,8DAA8D;QAC9D,yGAAyG;QACzG,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAqB,CAAC,CAAC;QAChE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC9C;IAED,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE;~~YACjB~~,MAAM,IAAI,KAAK,~~CACb~~,wHAAwH,CACzH,CAAC;~~SACH~~;QAED,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;~~YAClB~~,MAAM,IAAI,KAAK,CACb,0CAA0C,IAAI,CAAC,IAAI,CAAC,EAAE,4CAA4C,IAAI,CAAC,IAAI,CAAC,EAAE,qCAAqC,CACpJ,CAAC;~~SACH~~;QAED,8DAA8D;QAC9D,uEAAuE;QACvE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,gCAAgC,CAAC,OAAO,CAAC,CAAC,CAAC;IACnF,CAAC;IAED;;OAEG;IACH,oBAAoB;QAClB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;YAC9B,OAAO,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACjE,OAAO,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YACjE,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YAC5D,OAAO,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YAC3D,OAAO,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACnE,CAAC,CAAC,CAAC;IACL,CAAC;IAED,iBAAiB;QACf,yFAAyF;QACzF,8CAA8C;QAC9C,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvC,CAAC;IAED;;;OAGG;IAEH,KAAK,CAAC,IAAI,CAAC,MAAmB;QAC5B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC/B,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,IAAI;QACR,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAED;;;;OAIG;IAEH,KAAK,CAAC,MAAM,CAAC,MAAmB,EAAE,KAAe;QAC/C,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACxC,CAAC;IAED,IAAY,QAAQ;QAClB,OAAO,QAAQ,CAAC,gBAAgB,CAAC,yBAAyB,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC;IAC9E,CAAC;IAEO,gCAAgC,CAAC,OAAgB;QACvD,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAC9D,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAC9D,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACzD,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACxD,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAE9D,6FAA6F;QAC7F,MAAM,WAAW,GAAG,OAAO,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;QAC7D,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA,EAAE;~~YACxC~~,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,IAAI,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;YACrF,OAAO,CAAC,YAAY,CAAC,kBAAkB,EAAE,cAAc,CAAC,CAAC;~~SAC1D~~;QAED,qDAAqD;QACrD,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE;~~YACzB~~,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;~~SACvC~~;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,oBAAe,OAAO;YACzB,6BACE,IAAI,EAAC,SAAS,EACd,QAAQ,EAAC,IAAI,EACb,KAAK,~~QACL~~,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,EAAmC,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;gBAEpE,eAAa,CACS,CACnB,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport { Placement } from '@floating-ui/dom';\nimport isFocusable from 'ally.js/esm/is/focusable';\n\n// Patch for long press on touch devices\nimport 'long-press-event';\n\nimport { version } from '../../../package.json';\n@Component({\n tag: 'post-tooltip',\n styleUrl: 'post-tooltip.scss',\n shadow: true,\n})\nexport class PostTooltip {\n private popoverRef: HTMLPostPopovercontainerElement;\n private readonly localShowTooltip: (e: Event) => Promise<void>;\n private readonly localHideTooltip: () => Promise<void>;\n\n @Element() host: HTMLPostTooltipElement;\n\n /*\n Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\n * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted\n * towards the viewport if they would overlap edge boundaries.\n /\n @Prop() readonly placement?: Placement = 'top';\n\n constructor() {\n // Create local versions of event handlers for de-registration\n // https://stackoverflow.com/questions/33859113/javascript-removeeventlistener-not-working-inside-a-class\n this.localShowTooltip = e => this.show(e.target as HTMLElement);\n this.localHideTooltip = this.hide.bind(this);\n }\n\n connectedCallback() {\n if (!this.host.id) {\n throw new Error(\n 'No id set: <post-tooltip> must have an id, linking it to it\\'s target element using the data-tooltip-target attribute.',\n );\n }\n\n if (!this.triggers) {\n throw new Error(\n `No trigger found for <post-tooltip id=\"${this.host.id}\">, please add the 'data-tooltip-target=\"${this.host.id}\" attribute to the trigger element.`,\n );\n }\n\n // Patch popovertargetaction=\"interest\" until it's implemented\n // https://github.com/openui/open-ui/issues/767#issuecomment-1654177227\n this.triggers.forEach(trigger => this.patchPopoverTargetActionInterest(trigger));\n }\n\n /\n Remove a bunch of event listeners if the tooltip gets removed from the DOM\n /\n disconnectedCallback() {\n this.triggers.forEach(trigger => {\n trigger.removeEventListener('mouseenter', this.localShowTooltip);\n trigger.removeEventListener('mouseleave', this.localHideTooltip);\n trigger.removeEventListener('focus', this.localShowTooltip);\n trigger.removeEventListener('blur', this.localHideTooltip);\n trigger.removeEventListener('long-press', this.localShowTooltip);\n });\n }\n\n componentWillLoad() {\n // Append tooltip host to the end of the body to get around overflow: hidden restrictions\n // for browsers that don't support popover yet\n document.body.appendChild(this.host);\n }\n\n /\n Programmatically display the tooltip\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n /\n @Method()\n async show(target: HTMLElement) {\n this.popoverRef.show(target);\n }\n\n /\n Programmatically hide this tooltip\n /\n @Method()\n async hide() {\n this.popoverRef.hide();\n }\n\n /\n Toggle tooltip display\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n * @param force Pass true to always show or false to always hide\n */\n @Method()\n async toggle(target: HTMLElement, force?: boolean) {\n this.popoverRef.toggle(target, force);\n }\n\n private get triggers() {\n return document.querySelectorAll(`[data-tooltip-target=\"${this.host.id}\"]`);\n }\n\n private patchPopoverTargetActionInterest(trigger: Element) {\n trigger.addEventListener('mouseenter', this.localShowTooltip);\n trigger.addEventListener('mouseleave', this.localHideTooltip);\n trigger.addEventListener('focus', this.localShowTooltip);\n trigger.addEventListener('blur', this.localHideTooltip);\n trigger.addEventListener('long-press', this.localShowTooltip);\n\n // Patch missing aria-describedby attribute on the trigger without overriding existing values\n const describedBy = trigger.getAttribute('aria-describedby');\n if (!describedBy?.includes(this.host.id)) {\n const newDescribedBy = describedBy ? `${describedBy} ${this.host.id}` : this.host.id;\n trigger.setAttribute('aria-describedby', newDescribedBy);\n }\n\n // Patch missing focus ability on the trigger element\n if (!isFocusable(trigger)) {\n trigger.setAttribute('tabindex', '0');\n }\n }\n\n render() {\n return (\n <Host data-version={version}>\n <post-popovercontainer\n role=\"tooltip\"\n tabindex=\"-1\"\n arrow\n placement={this.placement}\n ref={(el: HTMLPostPopovercontainerElement) => (this.popoverRef = el)}\n >\n <slot></slot>\n </post-popovercontainer>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"post-tooltip.js","sourceRoot":"","sources":["../../../../src/components/post-tooltip/post-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport { Placement } from '@floating-ui/dom';\nimport isFocusable from 'ally.js/esm/is/focusable';\n\n// Patch for long press on touch devices\nimport 'long-press-event';\n\nimport { version } from '../../../package.json';\n@Component({\n tag: 'post-tooltip',\n styleUrl: 'post-tooltip.scss',\n shadow: true,\n})\nexport class PostTooltip {\n private popoverRef: HTMLPostPopovercontainerElement;\n private readonly localShowTooltip: (e: Event) => Promise<void>;\n private readonly localHideTooltip: () => Promise<void>;\n\n @Element() host: HTMLPostTooltipElement;\n\n /*\n Defines the placement of the tooltip according to the floating-ui options available at https://floating-ui.com/docs/computePosition#placement.\n * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted\n * towards the viewport if they would overlap edge boundaries.\n /\n @Prop() readonly placement?: Placement = 'top';\n\n /\n Wheter or not to display a little pointer arrow\n /\n @Prop() readonly arrow?: boolean = true;\n\n constructor() {\n // Create local versions of event handlers for de-registration\n // https://stackoverflow.com/questions/33859113/javascript-removeeventlistener-not-working-inside-a-class\n this.localShowTooltip = e => this.show(e.target as HTMLElement);\n this.localHideTooltip = this.hide.bind(this);\n }\n\n connectedCallback() {\n if (!this.host.id) {\n throw new Error(\n /prettier-ignore/\n 'No id set: <post-tooltip> must have an id, linking it to it\\'s target element using the data-tooltip-target attribute.',\n );\n }\n\n if (!this.triggers) {\n throw new Error(\n `No trigger found for <post-tooltip id=\"${this.host.id}\">, please add the 'data-tooltip-target=\"${this.host.id}\" attribute to the trigger element.`,\n );\n }\n\n // Patch popovertargetaction=\"interest\" until it's implemented\n // https://github.com/openui/open-ui/issues/767#issuecomment-1654177227\n this.triggers.forEach(trigger => this.patchPopoverTargetActionInterest(trigger));\n }\n\n /\n Remove a bunch of event listeners if the tooltip gets removed from the DOM\n /\n disconnectedCallback() {\n this.triggers.forEach(trigger => {\n trigger.removeEventListener('mouseenter', this.localShowTooltip);\n trigger.removeEventListener('mouseleave', this.localHideTooltip);\n trigger.removeEventListener('focus', this.localShowTooltip);\n trigger.removeEventListener('blur', this.localHideTooltip);\n trigger.removeEventListener('long-press', this.localShowTooltip);\n });\n }\n\n componentWillLoad() {\n // Append tooltip host to the end of the body to get around overflow: hidden restrictions\n // for browsers that don't support popover yet\n document.body.appendChild(this.host);\n }\n\n /\n Programmatically display the tooltip\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n /\n @Method()\n async show(target: HTMLElement) {\n this.popoverRef.show(target);\n }\n\n /\n Programmatically hide this tooltip\n /\n @Method()\n async hide() {\n this.popoverRef.hide();\n }\n\n /\n Toggle tooltip display\n * @param target An element with [data-tooltip-target=\"id\"] where the tooltip should be shown\n * @param force Pass true to always show or false to always hide\n */\n @Method()\n async toggle(target: HTMLElement, force?: boolean) {\n this.popoverRef.toggle(target, force);\n }\n\n private get triggers() {\n return document.querySelectorAll(`[data-tooltip-target=\"${this.host.id}\"]`);\n }\n\n private patchPopoverTargetActionInterest(trigger: Element) {\n trigger.addEventListener('mouseenter', this.localShowTooltip);\n trigger.addEventListener('mouseleave', this.localHideTooltip);\n trigger.addEventListener('focus', this.localShowTooltip);\n trigger.addEventListener('blur', this.localHideTooltip);\n trigger.addEventListener('long-press', this.localShowTooltip);\n\n // Patch missing aria-describedby attribute on the trigger without overriding existing values\n const describedBy = trigger.getAttribute('aria-describedby');\n if (!describedBy?.includes(this.host.id)) {\n const newDescribedBy = describedBy ? `${describedBy} ${this.host.id}` : this.host.id;\n trigger.setAttribute('aria-describedby', newDescribedBy);\n }\n\n // Patch missing focus ability on the trigger element\n if (!isFocusable(trigger)) {\n trigger.setAttribute('tabindex', '0');\n }\n }\n\n render() {\n return (\n <Host data-version={version}>\n <post-popovercontainer\n role=\"tooltip\"\n tabindex=\"-1\"\n arrow={this.arrow}\n placement={this.placement}\n ref={(el: HTMLPostPopovercontainerElement) => (this.popoverRef = el)}\n >\n <slot></slot>\n </post-popovercontainer>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/utils/property-checkers/check-non-empty.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"check-non-empty.js","sourceRoot":"","sources":["../../../../src/utils/property-checkers/check-non-empty.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,UAAU,aAAa,CAAC,KAAc,EAAE,KAAa;IACzD,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,EAAE;~~QACvC~~,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;~~KACxB~~;AACH,CAAC","sourcesContent":["import { EMPTY_VALUES } from './constants';\n\nexport function checkNonEmpty(value: unknown, error: string) {\n if (EMPTY_VALUES.some(v => v === value)) {\n throw new Error(error);\n }\n}\n"]}
1	+ {"version":3,"file":"check-non-empty.js","sourceRoot":"","sources":["../../../../src/utils/property-checkers/check-non-empty.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,UAAU,aAAa,CAAC,KAAc,EAAE,KAAa;IACzD,IAAI,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,EAAE,CAAC;QACxC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC;AACH,CAAC","sourcesContent":["import { EMPTY_VALUES } from './constants';\n\nexport function checkNonEmpty(value: unknown, error: string) {\n if (EMPTY_VALUES.some(v => v === value)) {\n throw new Error(error);\n }\n}\n"]}

package/dist/collection/utils/property-checkers/check-type.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"check-type.js","sourceRoot":"","sources":["../../../../src/utils/property-checkers/check-type.ts"],"names":[],"mappings":"AAQA,MAAM,UAAU,SAAS,CAAC,KAAc,EAAE,IAAkB,EAAE,KAAa;IACzE,MAAM,WAAW,GAAG,IAAI,KAAK,OAAO,CAAC;IACrC,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAE1C,IAAI,WAAW,IAAI,YAAY,EAAE;~~QAC/B~~,IAAI,YAAY,KAAK,WAAW;YAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;~~KAC1D~~;SAAM;~~QACL~~,IAAI,OAAO,KAAK,KAAK,IAAI;YAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;~~KACnD~~;AACH,CAAC","sourcesContent":["export type PropertyType =\n \| 'boolean'\n \| 'number'\n \| 'string'\n \| 'array'\n \| 'object'\n \| 'function';\n\nexport function checkType(value: unknown, type: PropertyType, error: string) {\n const typeIsArray = type === 'array';\n const valueIsArray = Array.isArray(value);\n\n if (typeIsArray \|\| valueIsArray) {\n if (valueIsArray !== typeIsArray) throw new Error(error);\n } else {\n if (typeof value !== type) throw new Error(error);\n }\n}\n"]}
1	+ {"version":3,"file":"check-type.js","sourceRoot":"","sources":["../../../../src/utils/property-checkers/check-type.ts"],"names":[],"mappings":"AAQA,MAAM,UAAU,SAAS,CAAC,KAAc,EAAE,IAAkB,EAAE,KAAa;IACzE,MAAM,WAAW,GAAG,IAAI,KAAK,OAAO,CAAC;IACrC,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAE1C,IAAI,WAAW,IAAI,YAAY,EAAE,CAAC;QAChC,IAAI,YAAY,KAAK,WAAW;YAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;IAC3D,CAAC;SAAM,CAAC;QACN,IAAI,OAAO,KAAK,KAAK,IAAI;YAAE,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;AACH,CAAC","sourcesContent":["export type PropertyType =\n \| 'boolean'\n \| 'number'\n \| 'string'\n \| 'array'\n \| 'object'\n \| 'function';\n\nexport function checkType(value: unknown, type: PropertyType, error: string) {\n const typeIsArray = type === 'array';\n const valueIsArray = Array.isArray(value);\n\n if (typeIsArray \|\| valueIsArray) {\n if (valueIsArray !== typeIsArray) throw new Error(error);\n } else {\n if (typeof value !== type) throw new Error(error);\n }\n}\n"]}

package/dist/components/package.js CHANGED Viewed

@@ -1,4 +1,4 @@
-const version = "1.7.1";
+const version = "2.0.0";
 export { version as v };

package/dist/components/post-accordion-item.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+interface PostAccordionItem extends Components.PostAccordionItem, HTMLElement {}
+export const PostAccordionItem: {
+    prototype: PostAccordionItem;
+    new (): PostAccordionItem;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/post-accordion-item.js ADDED Viewed

@@ -0,0 +1,82 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { v as version } from './package.js';
+import { b as checkEmptyOrOneOf } from './index2.js';
+import { d as defineCustomElement$2 } from './post-collapsible2.js';
+const HEADING_LEVELS = [1, 2, 3, 4, 5, 6];
+const postAccordionItemCss = "post-accordion-item::part(accordion-item),.bg-yellow post-accordion-item::part(accordion-item),.bg-light post-accordion-item::part(accordion-item),.bg-gray post-accordion-item::part(accordion-item),.bg-dark post-accordion-item::part(accordion-item),.bg-primary post-accordion-item::part(accordion-item),.bg-white post-accordion-item::part(accordion-item),.bg-black post-accordion-item::part(accordion-item),.bg-info post-accordion-item::part(accordion-item),.bg-success post-accordion-item::part(accordion-item),.bg-warning post-accordion-item::part(accordion-item),.bg-danger post-accordion-item::part(accordion-item),.bg-nightblue post-accordion-item::part(accordion-item),.bg-nightblue-bright post-accordion-item::part(accordion-item),.bg-petrol post-accordion-item::part(accordion-item),.bg-petrol-bright post-accordion-item::part(accordion-item),.bg-coral post-accordion-item::part(accordion-item),.bg-coral-bright post-accordion-item::part(accordion-item),.bg-olive post-accordion-item::part(accordion-item),.bg-olive-bright post-accordion-item::part(accordion-item),.bg-purple post-accordion-item::part(accordion-item),.bg-purple-bright post-accordion-item::part(accordion-item),.bg-aubergine post-accordion-item::part(accordion-item),.bg-aubergine-bright post-accordion-item::part(accordion-item),.bg-success-green post-accordion-item::part(accordion-item),.bg-error-red post-accordion-item::part(accordion-item),.bg-warning-orange post-accordion-item::part(accordion-item),.bg-success-background post-accordion-item::part(accordion-item),.bg-error-background post-accordion-item::part(accordion-item),.bg-warning-background post-accordion-item::part(accordion-item),.accordion-item,.bg-yellow .accordion-item,.bg-light .accordion-item,.bg-gray .accordion-item,.bg-dark .accordion-item,.bg-primary .accordion-item,.bg-white .accordion-item,.bg-black .accordion-item,.bg-info .accordion-item,.bg-success .accordion-item,.bg-warning .accordion-item,.bg-danger .accordion-item,.bg-nightblue .accordion-item,.bg-nightblue-bright .accordion-item,.bg-petrol .accordion-item,.bg-petrol-bright .accordion-item,.bg-coral .accordion-item,.bg-coral-bright .accordion-item,.bg-olive .accordion-item,.bg-olive-bright .accordion-item,.bg-purple .accordion-item,.bg-purple-bright .accordion-item,.bg-aubergine .accordion-item,.bg-aubergine-bright .accordion-item,.bg-success-green .accordion-item,.bg-error-red .accordion-item,.bg-warning-orange .accordion-item,.bg-success-background .accordion-item,.bg-error-background .accordion-item,.bg-warning-background .accordion-item{--post-bg-opacity:1;background-color:rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;color:var(--post-contrast-color) !important}post-accordion-item::part(accordion-item),.bg-yellow post-accordion-item::part(accordion-item),.bg-light post-accordion-item::part(accordion-item),.bg-gray post-accordion-item::part(accordion-item),.bg-dark post-accordion-item::part(accordion-item),.bg-primary post-accordion-item::part(accordion-item),.bg-white post-accordion-item::part(accordion-item),.bg-black post-accordion-item::part(accordion-item),.bg-info post-accordion-item::part(accordion-item),.bg-success post-accordion-item::part(accordion-item),.bg-warning post-accordion-item::part(accordion-item),.bg-danger post-accordion-item::part(accordion-item),.bg-nightblue post-accordion-item::part(accordion-item),.bg-nightblue-bright post-accordion-item::part(accordion-item),.bg-petrol post-accordion-item::part(accordion-item),.bg-petrol-bright post-accordion-item::part(accordion-item),.bg-coral post-accordion-item::part(accordion-item),.bg-coral-bright post-accordion-item::part(accordion-item),.bg-olive post-accordion-item::part(accordion-item),.bg-olive-bright post-accordion-item::part(accordion-item),.bg-purple post-accordion-item::part(accordion-item),.bg-purple-bright post-accordion-item::part(accordion-item),.bg-aubergine post-accordion-item::part(accordion-item),.bg-aubergine-bright post-accordion-item::part(accordion-item),.bg-success-green post-accordion-item::part(accordion-item),.bg-error-red post-accordion-item::part(accordion-item),.bg-warning-orange post-accordion-item::part(accordion-item),.bg-success-background post-accordion-item::part(accordion-item),.bg-error-background post-accordion-item::part(accordion-item),.bg-warning-background post-accordion-item::part(accordion-item),.accordion-item,.bg-yellow .accordion-item,.bg-light .accordion-item,.bg-gray .accordion-item,.bg-dark .accordion-item,.bg-primary .accordion-item,.bg-white .accordion-item,.bg-black .accordion-item,.bg-info .accordion-item,.bg-success .accordion-item,.bg-warning .accordion-item,.bg-danger .accordion-item,.bg-nightblue .accordion-item,.bg-nightblue-bright .accordion-item,.bg-petrol .accordion-item,.bg-petrol-bright .accordion-item,.bg-coral .accordion-item,.bg-coral-bright .accordion-item,.bg-olive .accordion-item,.bg-olive-bright .accordion-item,.bg-purple .accordion-item,.bg-purple-bright .accordion-item,.bg-aubergine .accordion-item,.bg-aubergine-bright .accordion-item,.bg-success-green .accordion-item,.bg-error-red .accordion-item,.bg-warning-orange .accordion-item,.bg-success-background .accordion-item,.bg-error-background .accordion-item,.bg-warning-background .accordion-item{--post-contrast-color:#000;--post-contrast-color-inverted:#fff;--post-gray-10:hsl(0, 0%, 90%);--post-gray-20:hsl(0, 0%, 80%);--post-gray-40:hsl(0, 0%, 60%);--post-gray-60:hsl(0, 0%, 40%);--post-gray-80:hsl(0, 0%, 20%);--post-yellow:#fc0;--post-light:#faf9f8;--post-gray:#f4f3f1;--post-dark:hsl(0, 0%, 20%);--post-primary:hsl(0, 0%, 20%);--post-white:#fff;--post-black:#000;--post-info:#cce4ee;--post-success:#2c911c;--post-warning:#f49e00;--post-danger:#a51728;--post-nightblue:#004976;--post-nightblue-bright:#0076a8;--post-petrol:#006d68;--post-petrol-bright:#00968f;--post-coral:#9e2a2f;--post-coral-bright:#e03c31;--post-olive:#716135;--post-olive-bright:#aa9d2e;--post-purple:#80276c;--post-purple-bright:#c5299b;--post-aubergine:#523178;--post-aubergine-bright:#7566a0;--post-success-green:#2c871d;--post-error-red:#a51728;--post-warning-orange:#f49e00;--post-success-background:#c0debb;--post-error-background:#ffdade;--post-warning-background:#fce2b2;--post-contrast-color-rgb:0, 0, 0;--post-contrast-color-inverted-rgb:255, 255, 255;--post-gray-10-rgb:230, 230, 230;--post-gray-20-rgb:204, 204, 204;--post-gray-40-rgb:153, 153, 153;--post-gray-60-rgb:102, 102, 102;--post-gray-80-rgb:51, 51, 51;--post-yellow-rgb:255, 204, 0;--post-light-rgb:250, 249, 248;--post-gray-rgb:244, 243, 241;--post-dark-rgb:51, 51, 51;--post-primary-rgb:51, 51, 51;--post-white-rgb:255, 255, 255;--post-black-rgb:0, 0, 0;--post-info-rgb:204, 228, 238;--post-success-rgb:44, 145, 28;--post-warning-rgb:244, 158, 0;--post-danger-rgb:165, 23, 40;--post-nightblue-rgb:0, 73, 118;--post-nightblue-bright-rgb:0, 118, 168;--post-petrol-rgb:0, 109, 104;--post-petrol-bright-rgb:0, 150, 143;--post-coral-rgb:158, 42, 47;--post-coral-bright-rgb:224, 60, 49;--post-olive-rgb:113, 97, 53;--post-olive-bright-rgb:170, 157, 46;--post-purple-rgb:128, 39, 108;--post-purple-bright-rgb:197, 41, 155;--post-aubergine-rgb:82, 49, 120;--post-aubergine-bright-rgb:117, 102, 160;--post-success-green-rgb:44, 135, 29;--post-error-red-rgb:165, 23, 40;--post-warning-orange-rgb:244, 158, 0;--post-success-background-rgb:192, 222, 187;--post-error-background-rgb:255, 218, 222;--post-warning-background-rgb:252, 226, 178}.accordion-item{--post-bg-rgb:244, 243, 241;border-block:2px solid #666}.bg-yellow .accordion-item{--post-bg-rgb:255, 255, 255}.bg-light .accordion-item{--post-bg-rgb:255, 255, 255}.bg-gray .accordion-item{--post-bg-rgb:255, 255, 255}.bg-dark .accordion-item{--post-bg-rgb:255, 255, 255}.bg-primary .accordion-item{--post-bg-rgb:255, 255, 255}.bg-white .accordion-item{--post-bg-rgb:244, 243, 241}.bg-black .accordion-item{--post-bg-rgb:255, 255, 255}.bg-info .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning .accordion-item{--post-bg-rgb:255, 255, 255}.bg-danger .accordion-item{--post-bg-rgb:255, 255, 255}.bg-nightblue .accordion-item{--post-bg-rgb:255, 255, 255}.bg-nightblue-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-petrol .accordion-item{--post-bg-rgb:255, 255, 255}.bg-petrol-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-coral .accordion-item{--post-bg-rgb:255, 255, 255}.bg-coral-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-olive .accordion-item{--post-bg-rgb:255, 255, 255}.bg-olive-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-purple .accordion-item{--post-bg-rgb:255, 255, 255}.bg-purple-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-aubergine .accordion-item{--post-bg-rgb:255, 255, 255}.bg-aubergine-bright .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success-green .accordion-item{--post-bg-rgb:255, 255, 255}.bg-error-red .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning-orange .accordion-item{--post-bg-rgb:255, 255, 255}.bg-success-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-error-background .accordion-item{--post-bg-rgb:255, 255, 255}.bg-warning-background .accordion-item{--post-bg-rgb:255, 255, 255}.accordion-item+.accordion-item{border-block-start:0}.accordion-header{color:#333;font-size:1rem;font-weight:700;line-height:1.5;margin:0}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;-webkit-appearance:button;appearance:button;outline:none;width:100%;position:relative;padding-block:1rem;padding-inline-start:1rem;padding-inline-end:3rem;text-align:start;transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms}.accordion-button:focus-visible{outline:2px solid #1976c8}.accordion-button:hover{color:#000;background-color:#e6e6e6}.accordion-button:disabled{opacity:.4;pointer-events:none}.accordion-button::after{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m23.6 18.3-.9.9-6.7-6.6-6.6 6.6-.9-.9 7.5-7.6z'/%3E%3C/g%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg xml:space='preserve' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='icon'%3E%3Cpath d='m23.6 18.3-.9.9-6.7-6.6-6.6 6.6-.9-.9 7.5-7.6z'/%3E%3C/g%3E%3C/svg%3E\");background-color:currentColor;content:\"\";display:block;height:1.5rem;width:1.5rem;position:absolute;inset-inline-end:1rem;inset-block-start:50%;transform:translateY(-50%);transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed::after{transform:translateY(-50%) rotate(-180deg)}.accordion-button>.text-truncate{display:block}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover:not(:disabled),.accordion-button:focus-visible:not(:disabled){outline:2px solid Highlight}.accordion-button:disabled{opacity:1 !important}}.accordion-body{padding:.5rem 1rem 1rem;font-weight:300}.accordion-button>*,.accordion-body>:first-child{margin-block-start:0 !important}.accordion-button>*,.accordion-body>:last-child{margin-block-end:0 !important}:host{display:block}.accordion-button{cursor:pointer}.accordion-button>::slotted(.text-truncate){display:block}post-accordion-item::part(accordion-item){--post-bg-rgb:244, 243, 241}.bg-yellow post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-light post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-gray post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-dark post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-primary post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-white post-accordion-item::part(accordion-item){--post-bg-rgb:244, 243, 241}.bg-black post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-info post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-danger post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-nightblue post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-nightblue-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-petrol post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-petrol-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-coral post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-coral-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-olive post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-olive-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-purple post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-purple-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-aubergine post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-aubergine-bright post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success-green post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-error-red post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning-orange post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-success-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-error-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}.bg-warning-background post-accordion-item::part(accordion-item){--post-bg-rgb:255, 255, 255}post-accordion-item+post-accordion-item::part(accordion-item){border-block-start:0 !important}";
+const PostAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class PostAccordionItem extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.id = undefined;
+        this.isOpen = undefined;
+        this.collapsed = false;
+        this.headingLevel = 2;
+    }
+    validateHeadingLevel(newValue = this.headingLevel) {
+        checkEmptyOrOneOf(newValue, HEADING_LEVELS, 'The `headingLevel` property of the `post-accordion-item` must be a number between 1 and 6.');
+    }
+    connectedCallback() {
+        this.validateHeadingLevel();
+    }
+    componentWillLoad() {
+        this.isOpen = !this.collapsed;
+        this.id = this.host.id || `a${crypto.randomUUID()}`;
+    }
+    onCollapseChange(event) {
+        this.isOpen = event.detail;
+    }
+    /**
+     * Triggers the collapse programmatically.
+     */
+    async toggle(force) {
+        return this.collapsible.toggle(force);
+    }
+    render() {
+        var _a;
+        const HeadingTag = `h${(_a = this.headingLevel) !== null && _a !== void 0 ? _a : 2}`;
+        return (h(Host, { id: this.id, "data-version": version }, h("div", { part: "accordion-item", class: "accordion-item" }, h(HeadingTag, { class: "accordion-header", id: `${this.id}--header` }, h("button", { "aria-controls": `${this.id}--collapse`, "aria-expanded": `${this.isOpen}`, class: `accordion-button${this.isOpen ? '' : ' collapsed'}`, onClick: () => this.toggle(), type: "button" }, h("slot", { name: "header" }))), h("post-collapsible", { collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { class: "accordion-body" }, h("slot", null))))));
+    }
+    get host() { return this; }
+    static get watchers() { return {
+        "headingLevel": ["validateHeadingLevel"]
+    }; }
+    static get style() { return postAccordionItemCss; }
+}, [1, "post-accordion-item", {
+        "collapsed": [4],
+        "headingLevel": [2, "heading-level"],
+        "id": [32],
+        "isOpen": [32],
+        "toggle": [64]
+    }, [[0, "collapseChange", "onCollapseChange"]], {
+        "headingLevel": ["validateHeadingLevel"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["post-accordion-item", "post-collapsible"];
+    components.forEach(tagName => { switch (tagName) {
+        case "post-accordion-item":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, PostAccordionItem$1);
+            }
+            break;
+        case "post-collapsible":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+const PostAccordionItem = PostAccordionItem$1;
+const defineCustomElement = defineCustomElement$1;
+export { PostAccordionItem, defineCustomElement };
+//# sourceMappingURL=post-accordion-item.js.map

package/dist/components/post-accordion-item.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"post-accordion-item.js","mappings":";;;;;AAAO,MAAM,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAU;;ACAzD,MAAM,oBAAoB,GAAG,oobAAoob;;MCUppbA,mBAAiB;;;;;;;yBAWW,KAAK;4BAKG,CAAC;;IAGhD,oBAAoB,CAAC,QAAQ,GAAG,IAAI,CAAC,YAAY;QAC/C,iBAAiB,CACf,QAAQ,EACR,cAAc,EACd,4FAA4F,CAC7F,CAAC;KACH;IAED,iBAAiB;QACf,IAAI,CAAC,oBAAoB,EAAE,CAAC;KAC7B;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QAC9B,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,IAAI,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC;KACrD;IAGD,gBAAgB,CAAC,KAA2B;QAC1C,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;KAC5B;;;;IAMD,MAAM,MAAM,CAAC,KAAe;QAC1B,OAAO,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;KACvC;IAED,MAAM;;QACJ,MAAM,UAAU,GAAG,IAAI,MAAA,IAAI,CAAC,YAAY,mCAAI,CAAC,EAAE,CAAC;QAEhD,QACE,EAAC,IAAI,IAAC,EAAE,EAAE,IAAI,CAAC,EAAE,kBAAgB,OAAO,IACtC,WAAK,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAC,gBAAgB,IAC/C,EAAC,UAAU,IAAC,KAAK,EAAC,kBAAkB,EAAC,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,UAAU,IAC3D,+BACiB,GAAG,IAAI,CAAC,EAAE,YAAY,mBACtB,GAAG,IAAI,CAAC,MAAM,EAAE,EAC/B,KAAK,EAAE,mBAAmB,IAAI,CAAC,MAAM,GAAG,EAAE,GAAG,YAAY,EAAE,EAC3D,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,EAAE,EAC5B,IAAI,EAAC,QAAQ,IAEb,YAAM,IAAI,EAAC,QAAQ,GAAG,CACf,CACE,EAEb,wBAAkB,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,IAC7E,WAAK,KAAK,EAAC,gBAAgB,IACzB,eAAQ,CACJ,CACW,CACf,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PostAccordionItem"],"sources":["src/components/post-accordion-item/heading-levels.ts","src/components/post-accordion-item/post-accordion-item.scss?tag=post-accordion-item&encapsulation=shadow","src/components/post-accordion-item/post-accordion-item.tsx"],"sourcesContent":["export const HEADING_LEVELS = [1, 2, 3, 4, 5, 6] as const;\n\nexport type HeadingLevel = typeof HEADING_LEVELS[number];\n","@use '@swisspost/design-system-styles/components/accordion';\n@use '@swisspost/design-system-styles/mixins/accordion' as accordion-mx;\n\n:host {\n display: block;\n}\n\n.accordion-button {\n cursor: pointer;\n\n > ::slotted(.text-truncate) {\n display: block;\n }\n}\n\npost-accordion-item::part(accordion-item) {\n @include accordion-mx.background-color;\n\n post-accordion-item + & {\n border-block-start: 0!important;\n }\n}\n","import { Component, Element, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { checkEmptyOrOneOf } from '../../utils';\nimport { HEADING_LEVELS, HeadingLevel } from './heading-levels';\n\n@Component({\n tag: 'post-accordion-item',\n styleUrl: 'post-accordion-item.scss',\n shadow: true,\n})\nexport class PostAccordionItem {\n private collapsible: HTMLPostCollapsibleElement;\n\n @Element() host: HTMLPostAccordionItemElement;\n\n @State() id: string;\n @State() isOpen: boolean;\n\n /**\n * If `true`, the element is initially collapsed otherwise it is displayed.\n */\n @Prop() readonly collapsed?: boolean = false;\n\n /**\n * Defines the hierarchical level of the accordion item header within the headings structure.\n */\n @Prop() readonly headingLevel?: HeadingLevel = 2;\n\n @Watch('headingLevel')\n validateHeadingLevel(newValue = this.headingLevel) {\n checkEmptyOrOneOf(\n newValue,\n HEADING_LEVELS,\n 'The `headingLevel` property of the `post-accordion-item` must be a number between 1 and 6.',\n );\n }\n\n connectedCallback() {\n this.validateHeadingLevel();\n }\n\n componentWillLoad() {\n this.isOpen = !this.collapsed;\n this.id = this.host.id || `a${crypto.randomUUID()}`;\n }\n\n @Listen('collapseChange')\n onCollapseChange(event: CustomEvent<boolean>): void {\n this.isOpen = event.detail;\n }\n\n /**\n * Triggers the collapse programmatically.\n */\n @Method()\n async toggle(force?: boolean): Promise<boolean> {\n return this.collapsible.toggle(force);\n }\n\n render() {\n const HeadingTag = `h${this.headingLevel ?? 2}`;\n\n return (\n <Host id={this.id} data-version={version}>\n <div part=\"accordion-item\" class=\"accordion-item\">\n <HeadingTag class=\"accordion-header\" id={`${this.id}--header`}>\n <button\n aria-controls={`${this.id}--collapse`}\n aria-expanded={`${this.isOpen}`}\n class={`accordion-button${this.isOpen ? '' : ' collapsed'}`}\n onClick={() => this.toggle()}\n type=\"button\"\n >\n <slot name=\"header\" />\n </button>\n </HeadingTag>\n\n <post-collapsible collapsed={this.collapsed} ref={el => (this.collapsible = el)}>\n <div class=\"accordion-body\">\n <slot />\n </div>\n </post-collapsible>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}