@nova-design-system/nova-webcomponents 3.12.0 → 3.13.0

package/dist/collection/components/nv-dialog/nv-dialog.docs.js

@@ -39,34 +39,42 @@ const NvDialogDocs = {
         },
         {
             name: nameof(x => x.heading),
+            descriptionSource: 'nv-dialogheader',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("nv-dialogheader", { slot: "header", heading: "Dialog Heading" }), h("p", null, "Child Content"))),
         },
         {
             name: nameof(x => x.subheading),
+            descriptionSource: 'nv-dialogheader',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("nv-dialogheader", { slot: "header", heading: "Dialog Heading", subheading: "Dialog Subheading" }), h("p", null, "Child Content"))),
         },
         {
             name: nameof(x => x.leadingIcon),
+            descriptionSource: 'nv-dialogfooter',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("p", null, "Child Content"), h("nv-dialogfooter", { slot: "footer", "leading-icon": "user" }))),
         },
         {
             name: nameof(x => x.trailingIcon),
+            descriptionSource: 'nv-dialogfooter',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("p", null, "Child Content"), h("nv-dialogfooter", { slot: "footer", "trailing-icon": "user" }))),
         },
         {
             name: nameof(x => x.danger),
+            descriptionSource: 'nv-dialogfooter',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("p", null, "Child Content"), h("nv-dialogfooter", { slot: "footer", danger: true }))),
         },
         {
             name: nameof(x => x.cancelLabel),
+            descriptionSource: 'nv-dialogfooter',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("p", null, "Child Content"), h("nv-dialogfooter", { slot: "footer", "cancel-label": "Abbrechen" }))),
         },
         {
             name: nameof(x => x.primaryLabel),
+            descriptionSource: 'nv-dialogfooter',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("p", null, "Child Content"), h("nv-dialogfooter", { slot: "footer", "submit-label": "Akzeptieren" }))),
         },
         {
             name: nameof(x => x.form),
+            descriptionSource: 'nv-dialogfooter',
             template: (h("nv-dialog", { "data-storybook-args": true }, h("nv-button", { slot: "trigger" }, "Open Dialog"), h("form", { id: "test-form" }), h("nv-dialogfooter", { slot: "footer", form: "test-form" }))),
         },
     ],

package/dist/collection/components/nv-dialog/nv-dialog.docs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-dialog.docs.js","sourceRoot":"","sources":["../../../src/components/nv-dialog/nv-dialog.docs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGlC,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,MAAM,YAAY,GAAkC;IAClD,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,WAAW,EAAE,SAAS,CAAC;IAC7E,kBAAkB,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,CAAC;IAE1D,OAAO,EAAE;QACP;YACE,IAAI,EAAE,SAAS;YACf,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB,CACV,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;YAC9C,IAAI,EAAE;gBACJ,IAAI,EAAE,KAAK;aACZ;YACD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB,CACV,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC;YACvD,IAAI,EAAE;gBACJ,aAAa,EAAE,IAAI;aACpB;YACD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB,CACV,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC;YACtD,IAAI,EAAE;gBACJ,YAAY,EAAE,IAAI;aACnB;YACD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB,CACV,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAAsB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;YAC9C,IAAI,EAAE;gBACJ,IAAI,EAAE,IAAI;aACX;YACD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,4FAGI,CACM,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;YACvD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,uBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,gBAAgB,GACP;gBACnB,6BAAoB,CACV,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,CAAC;YAC1D,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,uBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,gBAAgB,EACxB,UAAU,EAAC,mBAAmB,GACb;gBACnB,6BAAoB,CACV,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC;YAC3D,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB;gBACpB,uBAAiB,IAAI,EAAC,QAAQ,kBAAc,MAAM,GAAmB,CAC3D,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC;YAC5D,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB;gBACpB,uBAAiB,IAAI,EAAC,QAAQ,mBAAe,MAAM,GAAmB,CAC5D,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC;YACtD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB;gBACpB,uBAAiB,IAAI,EAAC,QAAQ,EAAC,MAAM,SAAmB,CAC9C,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC;YAC3D,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB;gBACpB,uBACE,IAAI,EAAC,QAAQ,kBACA,WAAW,GACP,CACT,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC;YAC5D,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,6BAAoB;gBACpB,uBACE,IAAI,EAAC,QAAQ,kBACA,aAAa,GACT,CACT,CACb;SACF;QACD;YACE,IAAI,EAAE,MAAM,CAA4B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;YACpD,QAAQ,EAAE,CACR;gBACE,iBAAW,IAAI,EAAC,SAAS,kBAAwB;gBACjD,YAAM,EAAE,EAAC,WAAW,GAAQ;gBAC5B,uBAAiB,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,WAAW,GAAmB,CACxD,CACb;SACF;KACF;CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\nimport { nameof } from '../../utils/class.utils';\n\nconst NvDialogDocs: NovaDocs<Components.NvDialog> = {\n  component: 'nv-dialog',\n  subcomponents: ['nv-dialogheader', 'nv-dialogfooter', 'nv-button', 'nv-icon'],\n  composedComponents: ['nv-dialogheader', 'nv-dialogfooter'],\n\n  stories: [\n    {\n      name: 'Default',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.open),\n      args: {\n        open: false,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.undismissable),\n      args: {\n        undismissable: true,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.clickOutside),\n      args: {\n        clickOutside: true,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.full),\n      args: {\n        full: true,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>\n            The dialog will take the full width of the screen regardless of the\n            content.\n          </p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogheader>(x => x.heading),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <nv-dialogheader\n            slot=\"header\"\n            heading=\"Dialog Heading\"\n          ></nv-dialogheader>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogheader>(x => x.subheading),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <nv-dialogheader\n            slot=\"header\"\n            heading=\"Dialog Heading\"\n            subheading=\"Dialog Subheading\"\n          ></nv-dialogheader>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.leadingIcon),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter slot=\"footer\" leading-icon=\"user\"></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.trailingIcon),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter slot=\"footer\" trailing-icon=\"user\"></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.danger),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter slot=\"footer\" danger></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.cancelLabel),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter\n            slot=\"footer\"\n            cancel-label=\"Abbrechen\"\n          ></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.primaryLabel),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter\n            slot=\"footer\"\n            submit-label=\"Akzeptieren\"\n          ></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.form),\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <form id=\"test-form\"></form>\n          <nv-dialogfooter slot=\"footer\" form=\"test-form\"></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n  ],\n};\n\nexport default NvDialogDocs;\n"]}
+{"version":3,"file":"nv-dialog.docs.js","sourceRoot":"","sources":["../../../src/components/nv-dialog/nv-dialog.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\nimport { nameof } from '../../utils/class.utils';\n\nconst NvDialogDocs: NovaDocs<Components.NvDialog> = {\n  component: 'nv-dialog',\n  subcomponents: ['nv-dialogheader', 'nv-dialogfooter', 'nv-button', 'nv-icon'],\n  composedComponents: ['nv-dialogheader', 'nv-dialogfooter'],\n\n  stories: [\n    {\n      name: 'Default',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.open),\n      args: {\n        open: false,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.undismissable),\n      args: {\n        undismissable: true,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.clickOutside),\n      args: {\n        clickOutside: true,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialog>(x => x.full),\n      args: {\n        full: true,\n      },\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>\n            The dialog will take the full width of the screen regardless of the\n            content.\n          </p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogheader>(x => x.heading),\n      descriptionSource: 'nv-dialogheader',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <nv-dialogheader\n            slot=\"header\"\n            heading=\"Dialog Heading\"\n          ></nv-dialogheader>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogheader>(x => x.subheading),\n      descriptionSource: 'nv-dialogheader',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <nv-dialogheader\n            slot=\"header\"\n            heading=\"Dialog Heading\"\n            subheading=\"Dialog Subheading\"\n          ></nv-dialogheader>\n          <p>Child Content</p>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.leadingIcon),\n      descriptionSource: 'nv-dialogfooter',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter slot=\"footer\" leading-icon=\"user\"></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.trailingIcon),\n      descriptionSource: 'nv-dialogfooter',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter slot=\"footer\" trailing-icon=\"user\"></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.danger),\n      descriptionSource: 'nv-dialogfooter',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter slot=\"footer\" danger></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.cancelLabel),\n      descriptionSource: 'nv-dialogfooter',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter\n            slot=\"footer\"\n            cancel-label=\"Abbrechen\"\n          ></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.primaryLabel),\n      descriptionSource: 'nv-dialogfooter',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <p>Child Content</p>\n          <nv-dialogfooter\n            slot=\"footer\"\n            submit-label=\"Akzeptieren\"\n          ></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n    {\n      name: nameof<Components.NvDialogfooter>(x => x.form),\n      descriptionSource: 'nv-dialogfooter',\n      template: (\n        <nv-dialog data-storybook-args>\n          <nv-button slot=\"trigger\">Open Dialog</nv-button>\n          <form id=\"test-form\"></form>\n          <nv-dialogfooter slot=\"footer\" form=\"test-form\"></nv-dialogfooter>\n        </nv-dialog>\n      ),\n    },\n  ],\n};\n\nexport default NvDialogDocs;\n"]}

package/dist/collection/components/nv-dialogfooter/nv-dialogfooter.js

@@ -37,10 +37,6 @@ export class NvDialogfooter {
          * Sets the label for the primary button.
          */
         this.primaryLabel = 'Primary';
-        /**
-         * Sets the type of the primary button.
-         */
-        this.primaryButtonType = ButtonType.Button;
         //#endregion EVENTS
         /****************************************************************************/
         //#region METHODS
@@ -71,11 +67,18 @@ export class NvDialogfooter {
                 !node.hasAttribute('slot'));
         });
     }
+    componentDidLoad() {
+        // Set the default button type based on the form property
+        this.primaryButtonType =
+            this.primaryButtonType || this.form
+                ? ButtonType.Submit
+                : ButtonType.Button;
+    }
     //#endregion LIFECYCLE
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '313836d5d0bc1704325aa200f0ed115bf3e63e7d' }, !this.hasSlot ? (h(Fragment, null, !this.undismissable && (h("nv-button", { onClick: this.handleCancel, emphasis: "low", size: "sm" }, this.cancelLabel)), h("nv-button", { onClick: this.handlePrimary, disabled: this.disabled, danger: this.danger, size: "sm", emphasis: "high", form: this.form, type: this.primaryButtonType }, this.leadingIcon && (h("nv-icon", { slot: "leading-icon", name: this.leadingIcon, size: "sm" })), this.primaryLabel, this.trailingIcon && (h("nv-icon", { slot: "trailing-icon", name: this.trailingIcon, size: "sm" }))))) : (h("slot", null))));
+        return (h(Host, { key: '0868c3af73f89219eee7c006b4ddca47c6da29b0' }, !this.hasSlot ? (h(Fragment, null, !this.undismissable && (h("nv-button", { onClick: this.handleCancel, emphasis: "low", size: "sm" }, this.cancelLabel)), h("nv-button", { onClick: this.handlePrimary, disabled: this.disabled, danger: this.danger, size: "sm", emphasis: "high", form: this.form, type: this.primaryButtonType }, this.leadingIcon && (h("nv-icon", { slot: "leading-icon", name: this.leadingIcon, size: "sm" })), this.primaryLabel, this.trailingIcon && (h("nv-icon", { slot: "trailing-icon", name: this.trailingIcon, size: "sm" }))))) : (h("slot", null))));
     }
     static get is() { return "nv-dialogfooter"; }
     static get formAssociated() { return true; }
@@ -233,7 +236,7 @@ export class NvDialogfooter {
             },
             "primaryButtonType": {
                 "type": "string",
-                "mutable": false,
+                "mutable": true,
                 "complexType": {
                     "original": "`${ButtonType}`",
                     "resolved": "\"button\" | \"reset\" | \"submit\"",
@@ -249,13 +252,12 @@ export class NvDialogfooter {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Sets the type of the primary button."
+                    "text": "Sets the type of the primary button. If using a form, this will default to\n'submit' if nothing passed."
                 },
                 "getter": false,
                 "setter": false,
                 "attribute": "primary-button-type",
-                "reflect": true,
-                "defaultValue": "ButtonType.Button"
+                "reflect": true
             },
             "form": {
                 "type": "string",
@@ -269,7 +271,7 @@ export class NvDialogfooter {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Sets the form for the dialog footer."
+                    "text": "A form inside the dialog can be submitted through the dialog footer by\ngiving the form an id and passing that id to the form attribute."
                 },
                 "getter": false,
                 "setter": false,
@@ -302,7 +304,7 @@ export class NvDialogfooter {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Emitted when the primary button is clicked. This allows to handle the primary action and potential data capture before closing the dialog."
+                    "text": "Emitted when the primary button is clicked. This allows to handle the\nprimary action and potential data capture before closing the dialog."
                 },
                 "complexType": {
                     "original": "void",

package/dist/collection/components/nv-dialogfooter/nv-dialogfooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-dialogfooter.js","sourceRoot":"","sources":["../../../src/components/nv-dialogfooter/nv-dialogfooter.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  AttachInternals,\n  Component,\n  h,\n  Host,\n  Prop,\n  Event,\n  EventEmitter,\n  Fragment,\n  Element,\n} from '@stencil/core';\nimport { ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Custom content for the dialog footer. When provided, the default buttons will not be rendered.\n */\n@Component({\n  tag: 'nv-dialogfooter',\n  styleUrl: 'nv-dialogfooter.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvDialogfooter {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvDialogfooterElement;\n  private hasSlot = false;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Disables the primary button, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Controls the visibility of the cancel button. When true, the cancel button is\n   * hidden.\n   */\n  @Prop({ reflect: true })\n  readonly undismissable: boolean = false;\n\n  /**\n   * Sets the leading icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly leadingIcon: string = '';\n\n  /**\n   * Sets the trailing icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly trailingIcon: string = '';\n\n  /**\n   * Sets the danger state for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\n\n  /**\n   * Sets the label for the cancel button.\n   */\n  @Prop({ reflect: true })\n  readonly cancelLabel: string = 'Cancel';\n\n  /**\n   * Sets the label for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly primaryLabel: string = 'Primary';\n\n  /**\n   * Sets the type of the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly primaryButtonType: `${ButtonType}` = ButtonType.Button;\n\n  /**\n   * Sets the form for the dialog footer.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the cancel button is clicked. This will close the dialog.\n   */\n  @Event()\n  dialogCanceled: EventEmitter<void>;\n\n  /**\n   * Emitted when the primary button is clicked. This allows to handle the primary action and potential data capture before closing the dialog.\n   */\n  @Event()\n  dialogPrimaryClicked: EventEmitter<void>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the primary action when the primary button is clicked.\n   * @param {Event} event - The click event.\n   */\n\n  private handlePrimary = (event: Event) => {\n    event.stopPropagation();\n    this.dialogPrimaryClicked.emit();\n  };\n\n  /**\n   * Handles the cancel action when the cancel button is clicked. This will close the dialog.\n   * @param {Event} event - The click event.\n   */\n  private handleCancel = (event: Event) => {\n    event.stopPropagation();\n    this.dialogCanceled.emit();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    // Check if there are any child elements that don't have a slot attribute\n    this.hasSlot = Array.from(this.el.childNodes).some(node => {\n      return (\n        node.nodeType === Node.ELEMENT_NODE &&\n        !(node as Element).hasAttribute('slot')\n      );\n    });\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {!this.hasSlot ? (\n          <Fragment>\n            {!this.undismissable && (\n              <nv-button onClick={this.handleCancel} emphasis=\"low\" size=\"sm\">\n                {this.cancelLabel}\n              </nv-button>\n            )}\n            <nv-button\n              onClick={this.handlePrimary}\n              disabled={this.disabled}\n              danger={this.danger}\n              size=\"sm\"\n              emphasis=\"high\"\n              form={this.form}\n              type={this.primaryButtonType}\n            >\n              {this.leadingIcon && (\n                <nv-icon\n                  slot=\"leading-icon\"\n                  name={this.leadingIcon}\n                  size=\"sm\"\n                />\n              )}\n              {this.primaryLabel}\n              {this.trailingIcon && (\n                <nv-icon\n                  slot=\"trailing-icon\"\n                  name={this.trailingIcon}\n                  size=\"sm\"\n                />\n              )}\n            </nv-button>\n          </Fragment>\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"]}
+{"version":3,"file":"nv-dialogfooter.js","sourceRoot":"","sources":["../../../src/components/nv-dialogfooter/nv-dialogfooter.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  AttachInternals,\n  Component,\n  h,\n  Host,\n  Prop,\n  Event,\n  EventEmitter,\n  Fragment,\n  Element,\n} from '@stencil/core';\nimport { ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Custom content for the dialog footer. When provided, the default buttons will not be rendered.\n */\n@Component({\n  tag: 'nv-dialogfooter',\n  styleUrl: 'nv-dialogfooter.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvDialogfooter {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvDialogfooterElement;\n  private hasSlot = false;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Disables the primary button, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Controls the visibility of the cancel button. When true, the cancel button is\n   * hidden.\n   */\n  @Prop({ reflect: true })\n  readonly undismissable: boolean = false;\n\n  /**\n   * Sets the leading icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly leadingIcon: string = '';\n\n  /**\n   * Sets the trailing icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly trailingIcon: string = '';\n\n  /**\n   * Sets the danger state for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\n\n  /**\n   * Sets the label for the cancel button.\n   */\n  @Prop({ reflect: true })\n  readonly cancelLabel: string = 'Cancel';\n\n  /**\n   * Sets the label for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly primaryLabel: string = 'Primary';\n\n  /**\n   * Sets the type of the primary button. If using a form, this will default to\n   * 'submit' if nothing passed.\n   */\n  @Prop({ reflect: true, mutable: true })\n  primaryButtonType: `${ButtonType}`;\n\n  /**\n   * A form inside the dialog can be submitted through the dialog footer by\n   * giving the form an id and passing that id to the form attribute.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the cancel button is clicked. This will close the dialog.\n   */\n  @Event()\n  dialogCanceled: EventEmitter<void>;\n\n  /**\n   * Emitted when the primary button is clicked. This allows to handle the\n   * primary action and potential data capture before closing the dialog.\n   */\n  @Event()\n  dialogPrimaryClicked: EventEmitter<void>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the primary action when the primary button is clicked.\n   * @param {Event} event - The click event.\n   */\n\n  private handlePrimary = (event: Event) => {\n    event.stopPropagation();\n    this.dialogPrimaryClicked.emit();\n  };\n\n  /**\n   * Handles the cancel action when the cancel button is clicked. This will close the dialog.\n   * @param {Event} event - The click event.\n   */\n  private handleCancel = (event: Event) => {\n    event.stopPropagation();\n    this.dialogCanceled.emit();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    // Check if there are any child elements that don't have a slot attribute\n    this.hasSlot = Array.from(this.el.childNodes).some(node => {\n      return (\n        node.nodeType === Node.ELEMENT_NODE &&\n        !(node as Element).hasAttribute('slot')\n      );\n    });\n  }\n\n  componentDidLoad() {\n    // Set the default button type based on the form property\n    this.primaryButtonType =\n      this.primaryButtonType || this.form\n        ? ButtonType.Submit\n        : ButtonType.Button;\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {!this.hasSlot ? (\n          <Fragment>\n            {!this.undismissable && (\n              <nv-button onClick={this.handleCancel} emphasis=\"low\" size=\"sm\">\n                {this.cancelLabel}\n              </nv-button>\n            )}\n            <nv-button\n              onClick={this.handlePrimary}\n              disabled={this.disabled}\n              danger={this.danger}\n              size=\"sm\"\n              emphasis=\"high\"\n              form={this.form}\n              type={this.primaryButtonType}\n            >\n              {this.leadingIcon && (\n                <nv-icon\n                  slot=\"leading-icon\"\n                  name={this.leadingIcon}\n                  size=\"sm\"\n                />\n              )}\n              {this.primaryLabel}\n              {this.trailingIcon && (\n                <nv-icon\n                  slot=\"trailing-icon\"\n                  name={this.trailingIcon}\n                  size=\"sm\"\n                />\n              )}\n            </nv-button>\n          </Fragment>\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"]}

package/dist/collection/components/nv-fieldmultiselect/nv-fieldmultiselect.js

@@ -126,7 +126,6 @@ export class NvFieldmultiselect {
          * Handle badge close for options mode.
          */
         this.handleBadgeCloseOptions = () => {
-            console.info('handleBadgeCloseOptions:', this.value);
             this.value = [];
             this.valueChanged.emit(this.value);
             // Uncheck all elements
@@ -144,7 +143,6 @@ export class NvFieldmultiselect {
          * Handle badge close for slots mode.
          */
         this.handleBadgeCloseSlots = () => {
-            console.info('handleBadgeCloseSlots:', this.value);
             this.value = [];
             this.valueChanged.emit(this.value);
             // Uncheck all elements
@@ -353,7 +351,6 @@ export class NvFieldmultiselect {
             try {
                 // Get visible and enabled option values from DOM
                 const visibleOptionValues = this.getVisibleEnabledOptionItems();
-                console.info('[SelectAll][Options] toggleSelectAllOptions called. selectAll:', selectAll, 'visibleOptionValues:', visibleOptionValues, 'Current value:', this.value);
                 if (selectAll) {
                     // Select all visible options - merge with existing selections
                     this.value = [...new Set([...this.value, ...visibleOptionValues])];
@@ -362,7 +359,6 @@ export class NvFieldmultiselect {
                     // Deselect only the visible options, keep others that might be filtered out
                     this.value = this.value.filter(val => !visibleOptionValues.includes(val));
                 }
-                console.info('[SelectAll][Options] New value after toggle:', this.value);
                 // Emit the change event
                 this.valueChanged.emit(this.value);
                 // Synchronize child components
@@ -388,7 +384,6 @@ export class NvFieldmultiselect {
             try {
                 // Get visible and enabled items
                 const items = this.getVisibleEnabledSlotItems();
-                console.info('[SelectAll][Slots] toggleSelectAllSlots called. selectAll:', selectAll, 'visible slot items:', items.map(item => item.getAttribute('value') || item.getAttribute('label')), 'Current value:', this.value);
                 if (selectAll) {
                     // Select all visible items
                     const allActiveValues = items
@@ -403,7 +398,6 @@ export class NvFieldmultiselect {
                         .filter(value => value !== '');
                     this.value = this.value.filter(val => !visibleValues.includes(val));
                 }
-                console.info('[SelectAll][Slots] New value after toggle:', this.value);
                 // Emit the change event
                 this.valueChanged.emit(this.value);
                 // Force synchronization with a small delay to ensure DOM is updated
@@ -426,15 +420,12 @@ export class NvFieldmultiselect {
         this.handleSelectAllCheckboxOptionsClick = (event) => {
             event.stopPropagation();
             event.preventDefault();
-            console.info('[handleSelectAllCheckboxOptionsClick] event:', event);
             const currentState = this.getSelectAllCheckboxStateOptions();
-            console.info('[SelectAll][Options] Checkbox clicked. Current state:', currentState, 'Current value:', this.value);
             // Logic to handle the indeterminate state
             // - unchecked → select all
             // - indeterminate → select all (clicking on indeterminate will change to checked)
             // - checked → deselect all
             const shouldSelectAll = currentState === 'unchecked' || currentState === 'indeterminate';
-            console.info('[SelectAll][Options] shouldSelectAll:', shouldSelectAll);
             this.toggleSelectAllOptions(shouldSelectAll);
         };
         /**
@@ -444,15 +435,12 @@ export class NvFieldmultiselect {
         this.handleSelectAllCheckboxSlotsClick = (event) => {
             event.stopPropagation();
             event.preventDefault();
-            console.info('[handleSelectAllCheckboxSlotsClick] event:', event);
             const currentState = this.getSelectAllCheckboxStateSlots();
-            console.info('[SelectAll][Slots] Checkbox clicked. Current state:', currentState, 'Current value:', this.value);
             // Logic to handle the indeterminate state
             // - unchecked → select all
             // - indeterminate → select all (clicking on indeterminate will change to checked)
             // - checked → deselect all
             const shouldSelectAll = currentState === 'unchecked' || currentState === 'indeterminate';
-            console.info('[SelectAll][Slots] shouldSelectAll:', shouldSelectAll);
             this.toggleSelectAllSlots(shouldSelectAll);
         };
         //#endregion METHODS
@@ -495,8 +483,6 @@ export class NvFieldmultiselect {
     /****************************************************************************/
     //#region WATCHERS
     handleOptionsChange(newValue) {
-        console.info('[Watch:options] newValue:', newValue);
-        console.info('[Watch:options] current value before update:', this.value);
         if (!newValue)
             return;
         // If the parent has set a value prop, use it. Otherwise, derive from checked options.
@@ -505,22 +491,18 @@ export class NvFieldmultiselect {
             this.value = newValue
                 .filter(option => option.checked)
                 .map(option => option.value);
-            console.info('[Watch:options] updated value from checked options:', this.value);
         }
         else {
             // If value is set, ensure checked states in options match value
             newValue.forEach(option => {
                 option.checked = this.value.includes(option.value);
             });
-            console.info('[Watch:options] options checked state synced to value:', newValue);
         }
         this.reorderOptionsContent();
     }
     watchValueHandler() {
-        console.info('[Watch:value] Value changed:', this.value, 'isBulkOperation:', this.isBulkOperation);
         // Skip processing during bulk operations
         if (this.isBulkOperation) {
-            console.info('[Watch:value] Skipping syncChildComponents and options update due to bulk operation');
             return;
         }
         // Synchronize child components when value changes programmatically
@@ -569,11 +551,9 @@ export class NvFieldmultiselect {
     handleItemChecked(event) {
         if (this.disabled || this.readonly || this.isBulkOperation) {
             // Skip processing itemChecked events during bulk operations
-            console.info('[Event:itemChecked] Skipped due to bulk operation or disabled/readonly', event.detail);
             return;
         }
         const { value, checked } = event.detail;
-        console.info('[Event:itemChecked] value:', value, 'checked:', checked, 'current value:', this.value);
         if (value !== undefined && value !== null) {
             const newValue = [...this.value];
             const valueIndex = newValue.indexOf(value);
@@ -586,7 +566,6 @@ export class NvFieldmultiselect {
                 newValue.splice(valueIndex, 1);
                 hasChanged = true;
             }
-            console.info('[Event:itemChecked] newValue after update:', newValue);
             if (hasChanged) {
                 this.value = newValue;
                 this.valueChanged.emit(this.value);
@@ -620,7 +599,6 @@ export class NvFieldmultiselect {
      * Subscribe to click outside event.
      */
     connectedCallback() {
-        console.info('[Lifecycle] connectedCallback - value:', this.value);
         // Bind once and reuse the same reference for add/remove to avoid leaks
         if (!this._boundHandleClickOutside) {
             this._boundHandleClickOutside = this.handleClickOutside.bind(this);
@@ -632,7 +610,6 @@ export class NvFieldmultiselect {
      */
     componentWillLoad() {
         var _a;
-        console.info('[Lifecycle] componentWillLoad - value:', this.value, 'options:', this.options);
         // Don't call handleOptionsChange if we are in slots mode
         if (this.options) {
             this.handleOptionsChange(this.options);
@@ -666,7 +643,6 @@ export class NvFieldmultiselect {
      * Force reorder if options mode in componentDidLoad because of the initial render not trigger @watch
      */
     componentDidLoad() {
-        console.info('[Lifecycle] componentDidLoad - value:', this.value, 'options:', this.options);
         if (this.options) {
             this.handleOptionsChange(this.options);
         }
@@ -682,7 +658,6 @@ export class NvFieldmultiselect {
      * Unsubscribe from click outside event.
      */
     disconnectedCallback() {
-        console.info('[Lifecycle] disconnectedCallback - value:', this.value);
         if (this._boundHandleClickOutside) {
             document.removeEventListener('click', this._boundHandleClickOutside);
         }
@@ -727,7 +702,6 @@ export class NvFieldmultiselect {
      * @returns {string[]} The selected values.
      */
     async getSelectedValues() {
-        console.info('getSelectedValues:', this.value);
         return this.value;
     }
     /**
@@ -1208,12 +1182,10 @@ export class NvFieldmultiselect {
             return;
         }
         const items = Array.from(this.el.querySelectorAll('nv-fielddropdownitemcheck'));
-        console.info('[syncChildComponents] value:', this.value);
         items.forEach(item => {
             // Get the effective value: use explicit value if present, otherwise use label
             const itemValue = item.getAttribute('value') || item.getAttribute('label') || '';
             const shouldBeChecked = this.value.includes(itemValue);
-            console.info('[syncChildComponents] itemValue:', itemValue, 'shouldBeChecked:', shouldBeChecked, 'item.checked(before):', item.checked);
             // Only update if the checked state differs to avoid triggering unnecessary events
             if (item.checked !== shouldBeChecked) {
                 // Set attribute and property, but avoid triggering itemChecked during bulk
@@ -1232,7 +1204,6 @@ export class NvFieldmultiselect {
                     item.checked = shouldBeChecked;
                 }
             }
-            console.info('[syncChildComponents] itemValue:', itemValue, 'item.checked(after):', item.checked);
         });
     }
     /**
@@ -1330,7 +1301,6 @@ export class NvFieldmultiselect {
             .map(item => item.getAttribute('value') || item.getAttribute('label') || '');
         // Combine with current this.value (set by code), ensuring uniqueness
         this.value = Array.from(new Set([...(this.value || []), ...checkedValues]));
-        console.info('[initializeValueFromSlots] checkedValues:', checkedValues, 'combined value:', this.value);
     }
     /**
      * Renders description and error description sections