@zanichelli/albe-web-components 19.3.0-RC4 → 19.3.0-RC5

package/dist/collection/components/z-skip-to-content/index.js

@@ -6,7 +6,7 @@ import { getElementTree, handleKeyboardSubmit } from "../../utils/utils";
  */
 export class ZSkipToContent {
     constructor() {
-        this.variant = undefined;
+        /** Array to fill link into skip-content */
         this.links = [];
         this.visible = false;
         this.visibleLink = "";
@@ -45,7 +45,7 @@ export class ZSkipToContent {
         this.visible = false;
     }
     render() {
-        return (h(Host, { key: '8b913cd494118ddb3e53d529d40a60693b75a157', class: {
+        return (h(Host, { key: '453b88d07dba674089b87d0e203154d57967ae20', class: {
                 [this.variant]: true,
                 "skip-to-content-visible": this.visible,
             } }, this.links.map((link, i) => {
@@ -84,7 +84,8 @@ export class ZSkipToContent {
                         "ThemeVariant": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::ThemeVariant"
+                            "id": "src/beans/index.tsx::ThemeVariant",
+                            "referenceLocation": "ThemeVariant"
                         }
                     }
                 },
@@ -94,8 +95,10 @@ export class ZSkipToContent {
                     "tags": [],
                     "text": "Graphical variant: `dark`, `light`."
                 },
-                "attribute": "variant",
-                "reflect": true
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "variant"
             },
             "links": {
                 "type": "string",
@@ -107,7 +110,8 @@ export class ZSkipToContent {
                         "SkipToContentLink": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::SkipToContentLink"
+                            "id": "src/beans/index.tsx::SkipToContentLink",
+                            "referenceLocation": "SkipToContentLink"
                         }
                     }
                 },
@@ -117,8 +121,10 @@ export class ZSkipToContent {
                     "tags": [],
                     "text": "Array to fill link into skip-content"
                 },
-                "attribute": "links",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "links",
                 "defaultValue": "[]"
             }
         };
@@ -146,4 +152,3 @@ export class ZSkipToContent {
             }];
     }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-skip-to-content/index.stories.js

@@ -38,4 +38,3 @@ export const Default = {
       links=${JSON.stringify(args.links)}
     ></z-skip-to-content>`,
 };
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-stepper/index.js

@@ -4,7 +4,7 @@ import { Host, h } from "@stencil/core";
  */
 export class ZStepper {
     render() {
-        return (h(Host, { key: '1d1f9c22822efd4ff78ada101c84a0989da9f71b', role: "navigation" }, h("slot", { key: 'f6068efbdab8ba800c82f5c89ed1e88e983ef369' })));
+        return (h(Host, { key: 'ebb63998048529b08157000dd0b6e444732ccb28', role: "navigation" }, h("slot", { key: '14743c8ee6a293c944b32b522ff78e763be263c2' })));
     }
     static get is() { return "z-stepper"; }
     static get encapsulation() { return "shadow"; }
@@ -19,4 +19,3 @@ export class ZStepper {
         };
     }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-stepper/index.stories.js

@@ -106,4 +106,3 @@ export const Checked = {
       >
     </z-stepper>`,
 };
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-stepper-item/index.js

@@ -1,12 +1,5 @@
 import { Host, h } from "@stencil/core";
 export class ZStepperItem {
-    constructor() {
-        this.index = undefined;
-        this.href = undefined;
-        this.pressed = undefined;
-        this.checked = undefined;
-        this.disabled = undefined;
-    }
     getAttributes() {
         const href = this.href && !this.pressed && !this.disabled ? { onClick: () => (location.href = this.href) } : undefined;
         const role = href ? { role: "link" } : undefined;
@@ -15,7 +8,7 @@ export class ZStepperItem {
         return Object.assign(Object.assign(Object.assign(Object.assign({}, href), role), current), tabindex);
     }
     render() {
-        return (h(Host, { key: '19c73e3cc4e553720f5fb782f73931737007f7a4', role: "listitem" }, h("button", Object.assign({ key: 'b2bcbd197fe0ba3b90442544f354589394ac0007', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: 'bc7e3054c6ece39171d65a03360ff16502a46b3c', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: 'e18deeb657c6ff859ba1e6cff18103550bf0a4db' }, h("slot", { key: '7646d57e96b50b8268e5353003a118737687c2b5' })))));
+        return (h(Host, { key: '7aa1de5d716837aadddf7f403322ff3cd296848e', role: "listitem" }, h("button", Object.assign({ key: 'beb11602a3c794d7a745ab82a58d033b6e0752e5', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: '892e9dc3c317594f13616a6f3581ad2451721cf1', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: '4e91ebaf7ed054394482485c8a67c973a783ed48' }, h("slot", { key: '7faef9a6f126d000f742e4e8a58d6b37cdf48504' })))));
     }
     static get is() { return "z-stepper-item"; }
     static get encapsulation() { return "shadow"; }
@@ -45,8 +38,10 @@ export class ZStepperItem {
                     "tags": [],
                     "text": "The number of the step item."
                 },
-                "attribute": "index",
-                "reflect": true
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "index"
             },
             "href": {
                 "type": "string",
@@ -62,8 +57,10 @@ export class ZStepperItem {
                     "tags": [],
                     "text": "The href to navigate on click."
                 },
-                "attribute": "href",
-                "reflect": true
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "href"
             },
             "pressed": {
                 "type": "boolean",
@@ -79,8 +76,10 @@ export class ZStepperItem {
                     "tags": [],
                     "text": "The pressed state of the item."
                 },
-                "attribute": "pressed",
-                "reflect": true
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "pressed"
             },
             "checked": {
                 "type": "boolean",
@@ -96,8 +95,10 @@ export class ZStepperItem {
                     "tags": [],
                     "text": "The checked state of the item."
                 },
-                "attribute": "checked",
-                "reflect": true
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "checked"
             },
             "disabled": {
                 "type": "boolean",
@@ -113,10 +114,11 @@ export class ZStepperItem {
                     "tags": [],
                     "text": "The disabled state of the item."
                 },
-                "attribute": "disabled",
-                "reflect": true
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "disabled"
             }
         };
     }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-stepper-item/index.stories.js

@@ -56,4 +56,3 @@ export const Checked = {
       >${args.text}</z-stepper-item
     >`,
 };
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-tag/index.js

@@ -6,17 +6,11 @@ import { Host, h } from "@stencil/core";
  * @cssprop --z-tag-bg - background color of the z-tag.
  */
 export class ZTag {
-    constructor() {
-        this.icon = undefined;
-        this.expandable = undefined;
-    }
     render() {
-        var _a;
-        const hasText = ((_a = this.host.textContent) === null || _a === void 0 ? void 0 : _a.trim().length) > 0;
-        return (h(Host, { key: '1414ca0881e2a62586b1e093e1fef75f1f74f6fe', class: {
+        return (h(Host, { key: '79058b7bd9a1c161e6bc55fc0a737e6f2f3c8a06', class: {
                 "expandable": this.expandable && !!this.icon,
-                "has-text": hasText,
-            } }, this.icon && h("z-icon", { key: '1be6964fc0121d351bbdebdfe255d26702e81f8f', name: this.icon }), h("div", { key: 'a7dac7e78d2cbc4a6d779a683e1d2b820af0fe6a' }, h("slot", { key: '95de2b4d5958f7af33015e887ac854c472979ae3' }))));
+                "has-text": !!this.host.textContent.trim(),
+            } }, this.icon && h("z-icon", { key: 'ac25c974cbb40a04bb83adabe53011bb4dd89dd3', name: this.icon }), h("div", { key: '4150a1f6301110f690a595c5e2b5169d90aa4802' }, h("slot", { key: 'd3f2e88bf2635ec142a71c5752f264cd9e0077f7' }))));
     }
     static get is() { return "z-tag"; }
     static get encapsulation() { return "scoped"; }
@@ -46,8 +40,10 @@ export class ZTag {
                     "tags": [],
                     "text": "[optional] Tag icon"
                 },
-                "attribute": "icon",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "icon"
             },
             "expandable": {
                 "type": "boolean",
@@ -63,11 +59,12 @@ export class ZTag {
                     "tags": [],
                     "text": "[optional] Hide the text and show it on hover"
                 },
-                "attribute": "expandable",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "expandable"
             }
         };
     }
     static get elementRef() { return "host"; }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-tag/index.stories.js

@@ -61,4 +61,3 @@ export const LongText = {
       >${args.text}
     </z-tag>`,
 };
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-toast-notification/index.js

@@ -2,6 +2,13 @@ import { Host, h } from "@stencil/core";
 import { KeyboardCode, ToastNotificationTransition } from "../../beans";
 import DOMPurify from "dompurify";
 import Hammer from "hammerjs";
+/** Map of slide-in transitions to their corresponding slide-out transitions */
+const SLIDE_OUT_TRANSITION_MAP = {
+    [ToastNotificationTransition.SLIDE_IN_DOWN]: ToastNotificationTransition.SLIDE_OUT_UP,
+    [ToastNotificationTransition.SLIDE_IN_UP]: ToastNotificationTransition.SLIDE_OUT_DOWN,
+    [ToastNotificationTransition.SLIDE_IN_LEFT]: ToastNotificationTransition.SLIDE_OUT_RIGHT,
+    [ToastNotificationTransition.SLIDE_IN_RIGHT]: ToastNotificationTransition.SLIDE_OUT_LEFT,
+};
 /**
  * ZToastNotification component.
  * @slot message - Custom HTML message
@@ -9,17 +16,13 @@ import Hammer from "hammerjs";
  */
 export class ZToastNotification {
     constructor() {
-        this.isCloseEventCalled = false;
-        this.heading = undefined;
-        this.message = undefined;
-        this.closebutton = undefined;
-        this.autoclose = undefined;
+        /** toast notification autoclose can be paused */
         this.pauseonfocusloss = true;
-        this.type = undefined;
+        /** toast notification can be draggable*/
         this.isdraggable = true;
+        /** toast notification draggable percentage*/
         this.draggablepercentage = 80;
-        this.transition = undefined;
-        this.percentage = undefined;
+        this.isCloseEventCalled = false;
     }
     watchPropIsdraggable(newValue) {
         if (newValue) {
@@ -43,42 +46,28 @@ export class ZToastNotification {
             }
         }
     }
-    emitToastClose(cssClass, stopTimer) {
+    close(closingTransition, stopTimer) {
         if (stopTimer && this.timeoutHandle) {
             clearTimeout(this.timeoutHandle);
         }
         this.timeoutHandle = null;
         this.elapsedTime = null;
         this.toastClose.emit();
-        if (cssClass) {
-            this.hostElement.classList.add(cssClass);
+        if (closingTransition) {
+            this.hostElement.classList.add(closingTransition);
         }
         else {
             this.hostElement.parentNode.removeChild(this.hostElement);
         }
     }
-    componentWillLoad() {
-        this.validateAutoclose();
-        this.percentage = 0;
-    }
-    componentDidLoad() {
-        this.startTime = Date.now();
-        if (this.autoclose) {
-            if (this.pauseonfocusloss) {
-                document.addEventListener("visibilitychange", this.visibilityChangeEventHandler);
-            }
-            if (!this.transition) {
-                this.startClosingTimeout(this.autoclose);
-            }
-        }
-        this.isdraggable && this.handleSlideOutDragAnimation();
-    }
     visibilityChangeEventHandler() {
         if (document.visibilityState === "hidden") {
-            this.timeoutHandle && this.onBlur();
+            if (this.timeoutHandle) {
+                this.onBlur();
+            }
         }
-        else {
-            this.elapsedTime && this.onFocus();
+        else if (this.elapsedTime) {
+            this.onFocus();
         }
     }
     validateAutoclose() {
@@ -86,20 +75,6 @@ export class ZToastNotification {
             console.error("At least one between autoclose and closebutton must be present");
         }
     }
-    mapSlideOutClass() {
-        switch (this.transition) {
-            case ToastNotificationTransition.SLIDE_IN_DOWN:
-                return ToastNotificationTransition.SLIDE_OUT_UP;
-            case ToastNotificationTransition.SLIDE_IN_UP:
-                return ToastNotificationTransition.SLIDE_OUT_DOWN;
-            case ToastNotificationTransition.SLIDE_IN_LEFT:
-                return ToastNotificationTransition.SLIDE_OUT_RIGHT;
-            case ToastNotificationTransition.SLIDE_IN_RIGHT:
-                return ToastNotificationTransition.SLIDE_OUT_LEFT;
-            default:
-                return null;
-        }
-    }
     calculateDraggedPercentage(e) {
         const bounding = this.hostElement.getBoundingClientRect();
         return Math.round((100 * e.deltaX) / bounding.width);
@@ -124,7 +99,9 @@ export class ZToastNotification {
                 this.hostElement.style.transform = translateObj.translate;
                 if (Math.abs(this.percentage) > this.draggablepercentage && !this.isCloseEventCalled) {
                     this.isCloseEventCalled = true;
-                    this.emitToastClose(e.direction === Hammer.DIRECTION_LEFT ? "slide-out-left" : "slide-out-right", true);
+                    this.close(e.direction === Hammer.DIRECTION_LEFT
+                        ? ToastNotificationTransition.SLIDE_OUT_LEFT
+                        : ToastNotificationTransition.SLIDE_OUT_RIGHT, true);
                 }
             }
             if (e.isFinal && Math.abs(this.percentage) < this.draggablepercentage) {
@@ -149,25 +126,44 @@ export class ZToastNotification {
         clearTimeout(this.timeoutHandle);
     }
     startClosingTimeout(time) {
-        this.timeoutHandle = window.setTimeout(() => this.emitToastClose(this.mapSlideOutClass(), false), time);
+        this.timeoutHandle = window.setTimeout(() => this.close(SLIDE_OUT_TRANSITION_MAP[this.transition], false), time);
     }
-    renderContent() {
-        return (h("div", { id: "external-container", tabIndex: 0, class: { [this.type]: !!this.type } }, h("div", { id: "inner-container" }, h("div", { id: "text" }, this.heading && h("span", { class: "title" }, this.heading), h("span", { class: "message" }, h("slot", { name: "message" }, h("span", { innerHTML: DOMPurify.sanitize(this.message || " ") })))), h("div", { id: "button" }, h("slot", { name: "button" }))), h("div", { id: "icon" }, this.closebutton && (h("z-icon", { tabIndex: 0, name: "multiply-circled", width: 15, height: 15, onClick: () => this.emitToastClose(this.mapSlideOutClass(), true), onKeyPress: (e) => {
-                if (e.code == KeyboardCode.SPACE || e.code == KeyboardCode.ENTER) {
-                    e.preventDefault();
-                    this.emitToastClose(this.mapSlideOutClass(), true);
-                }
-            } })))));
+    checkSlottedButton() {
+        this.hasSlottedButton = !!this.hostElement.querySelector("[slot='button']");
+    }
+    componentWillLoad() {
+        this.validateAutoclose();
+        this.checkSlottedButton();
+        this.percentage = 0;
+    }
+    componentDidLoad() {
+        this.startTime = Date.now();
+        if (this.autoclose) {
+            if (this.pauseonfocusloss) {
+                document.addEventListener("visibilitychange", this.visibilityChangeEventHandler);
+            }
+            if (!this.transition) {
+                this.startClosingTimeout(this.autoclose);
+            }
+        }
+        if (this.isdraggable) {
+            this.handleSlideOutDragAnimation();
+        }
     }
     render() {
-        return (h(Host, { key: '9961ade1e0cb9ac345293770938cb7540656282c', style: { "--percentuale": `${this.percentage}%` }, class: this.transition ? this.transition : "", onAnimationEnd: (e) => {
+        return (h(Host, { key: 'e0a58f45156d16fb3ec1cac2e4a13e6bdaf719b7', style: { "--percentuale": `${this.percentage}%` }, class: { [this.transition]: !!this.transition, [this.type]: !!this.type }, onAnimationEnd: (e) => {
                 if (this.autoclose && e.animationName.includes("slidein")) {
                     this.startClosingTimeout(this.autoclose);
                 }
                 if (e.animationName.includes("slideout")) {
                     this.hostElement.parentNode.removeChild(this.hostElement);
                 }
-            } }, this.renderContent()));
+            } }, h("div", { key: 'dc37f25eddcc763014c01766f43fba82ed54eb64', class: "toast-notification-container" }, h("div", { key: '3b832ddf285d2f203a5172ea20c221d7c5fecf8b', class: "toast-notification-content" }, h("div", { key: 'b701ba1ea667e98092b858cd31275f8beb1cf89a', class: "toast-notification-text" }, this.heading && h("span", { key: '643748547bf51bbb5ffeae968e9a6f5fb1f8db1e', class: "title" }, this.heading), h("span", { key: '2c1d2f616dc9c34b847732af066a0750e1ea49a2', class: "message" }, h("slot", { key: 'fea0d0b716ff11a64eeb98d2013da6887eeb5c99', name: "message" }, this.message && h("span", { key: '5867861be21564191c97f7cabace3c33645b4cd2', innerHTML: DOMPurify.sanitize(this.message) })))), h("div", { key: '3405e83126816b47017f59da2bd95a8195c30a25', class: "button-container", hidden: !this.hasSlottedButton }, h("slot", { key: '821f8f8ce998969cf16323c72c151c5dc0a72d62', name: "button", onSlotchange: () => this.checkSlottedButton() }))), this.closebutton && (h("button", { key: 'c3e84a06feaf5632d0733971786dc824b2fa3ab6', class: "close-button", "aria-label": "Chiudi notifica", onClick: () => this.close(SLIDE_OUT_TRANSITION_MAP[this.transition], true), onKeyDown: (e) => {
+                if (e.code == KeyboardCode.SPACE || e.code == KeyboardCode.ENTER) {
+                    e.preventDefault();
+                    this.close(SLIDE_OUT_TRANSITION_MAP[this.transition], true);
+                }
+            } }, h("z-icon", { key: '67397c893a19e479e6f76e5c1428ce301f12416e', name: "multiply-circled" }))))));
     }
     static get is() { return "z-toast-notification"; }
     static get encapsulation() { return "shadow"; }
@@ -197,8 +193,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification's title"
                 },
-                "attribute": "heading",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "heading"
             },
             "message": {
                 "type": "string",
@@ -214,8 +212,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification's message"
                 },
-                "attribute": "message",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "message"
             },
             "closebutton": {
                 "type": "boolean",
@@ -231,8 +231,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toggles closing button rendering"
                 },
-                "attribute": "closebutton",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "closebutton"
             },
             "autoclose": {
                 "type": "number",
@@ -248,8 +250,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification closing timeout (ms)"
                 },
-                "attribute": "autoclose",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "autoclose"
             },
             "pauseonfocusloss": {
                 "type": "boolean",
@@ -265,8 +269,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification autoclose can be paused"
                 },
-                "attribute": "pauseonfocusloss",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "pauseonfocusloss",
                 "defaultValue": "true"
             },
             "type": {
@@ -279,7 +285,8 @@ export class ZToastNotification {
                         "ToastNotification": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::ToastNotification"
+                            "id": "src/beans/index.tsx::ToastNotification",
+                            "referenceLocation": "ToastNotification"
                         }
                     }
                 },
@@ -289,8 +296,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification type: dark, light, accent, error, success, warning"
                 },
-                "attribute": "type",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "type"
             },
             "isdraggable": {
                 "type": "boolean",
@@ -306,8 +315,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification can be draggable"
                 },
-                "attribute": "isdraggable",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "isdraggable",
                 "defaultValue": "true"
             },
             "draggablepercentage": {
@@ -324,8 +335,10 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification draggable percentage"
                 },
-                "attribute": "draggablepercentage",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "draggablepercentage",
                 "defaultValue": "80"
             },
             "transition": {
@@ -338,7 +351,8 @@ export class ZToastNotification {
                         "ToastNotificationTransition": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::ToastNotificationTransition"
+                            "id": "src/beans/index.tsx::ToastNotificationTransition",
+                            "referenceLocation": "ToastNotificationTransition"
                         }
                     }
                 },
@@ -348,14 +362,17 @@ export class ZToastNotification {
                     "tags": [],
                     "text": "toast notification animation type: slide-in-left, slide-in-right, slide-in-down, slide-in-up"
                 },
-                "attribute": "transition",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "transition"
             }
         };
     }
     static get states() {
         return {
-            "percentage": {}
+            "percentage": {},
+            "hasSlottedButton": {}
         };
     }
     static get events() {
@@ -390,4 +407,3 @@ export class ZToastNotification {
             }];
     }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-toast-notification/index.stories.js

@@ -22,7 +22,7 @@ const StoryMeta = {
     argTypes: {
         type: {
             control: {
-                type: "select",
+                type: "inline-radio",
             },
             options: Object.values(ToastNotification),
         },
@@ -125,6 +125,7 @@ export const SlottedButtonLongText = {
 };
 export const SlottedMessage = {
     args: { transition: ToastNotificationTransition.SLIDE_IN_DOWN },
+    parameters: { controls: { exclude: ["message"] } },
     render: (args) => html `<div class="toast-container">
       <z-toast-notification
         heading="${args.heading}"
@@ -150,6 +151,7 @@ export const SlottedMessage = {
 };
 export const SlottedMessageLongText = {
     args: { transition: ToastNotificationTransition.SLIDE_IN_DOWN },
+    parameters: { controls: { exclude: ["message"] } },
     render: (args) => html `<div class="toast-container">
       <z-toast-notification
         heading="Titolo abbastanza lungo"
@@ -172,4 +174,3 @@ export const SlottedMessageLongText = {
       </z-toast-notification>
     </div>`,
 };
-//# sourceMappingURL=index.stories.js.map