npm - @nova-design-system/nova-webcomponents - Versions diffs - 3.6.0 → 3.7.0 - Mend

@nova-design-system/nova-webcomponents 3.6.0 → 3.7.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 (291) hide show

package/dist/cjs/nv-menuitem.cjs.entry.js CHANGED Viewed

@@ -50,7 +50,7 @@ const NvMenuitem = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'c008da503776b85bec237b25e321e4bba02d153f', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && index.h("nv-icon", { key: '66341d40e68409b4c0ab6595a67eed1e4354d6ba', name: this.icon }), index.h("slot", { key: 'e3960af26ffbc703a5702981e948013179b1a83b' }), this.label && index.h("span", { key: '9633388dcbad3080b54b83845ced54f9b9d05061', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && index.h("kbd", { key: 'da358858336a86a7a49bbd4a52b5f628aadc1c29' }, this.shortcut), this.hasSubmenu && index.h("nv-icon", { key: '36a85c271a5dbe2c41eefac33209e5d9a909ae04', name: "chevron-right" })));
+        return (index.h(index.Host, { key: '327165c89f4e5decf8dc4b7b28e18562e528056d', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && index.h("nv-icon", { key: '4247d922bca3797dc3f2917218749a8d3c038df1', name: this.icon }), index.h("slot", { key: '1f81464ccf47a5bd918873ef70d3d3385e870638' }), this.label && index.h("span", { key: '113358a0cacfa53710ec0049a8e1c5e981de5b15', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && index.h("kbd", { key: 'ee7c773b89bf1f55876cf297600247883cd54937' }, this.shortcut), this.hasSubmenu && index.h("nv-icon", { key: '70cbe2df51d9fbffe3b474b54e87aa06801acef7', name: "chevron-right" })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/nv-popover.cjs.entry.js CHANGED Viewed

@@ -2368,7 +2368,7 @@ const NvPopover = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '843ac572358b402d6338945d671446fec1c51a6d' }, index.h("slot", { key: '090f01aea3932cb95357985766a20112c63c4992', name: "trigger" }), index.h("div", { key: '737822dd1539381bb485a389670f09a071441365', "data-scope": "popover", hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (index.h("div", { key: '9d268df3f0e1df7b2a2264154143c3db14619661', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), index.h("slot", { key: '432aae053b25d2e7d6594203ad0ff3ecee26c059', name: "content" }))));
+        return (index.h(index.Host, { key: '27f6f8acc148b3dc2b16a391c54a4a1de0637a57' }, index.h("slot", { key: 'd25614b3bfc5565d3729da11f6f83b4d92e83e19', name: "trigger" }), index.h("div", { key: '3b777862573405b2bb2a377750d9bb859a4bb20b', "data-scope": "popover", hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (index.h("div", { key: 'dda88155630bca69ec06a766e2999ed369d5d6c6', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), index.h("slot", { key: '51eaf873fe239d3c4106e997f6cdd37b1bb29074', name: "content" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/nv-row.cjs.entry.js CHANGED Viewed

@@ -14,7 +14,7 @@ const NvRow = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '20e40e37c82b00712ed3d60d46d460f5f877e10a' }, index.h("slot", { key: '80ba27becb4d56ff0785054597d88c728fb3eca5' })));
+        return (index.h(index.Host, { key: 'daad5f10b72b95468ac50a3deab7faf87769be42' }, index.h("slot", { key: '16509b69358739997fe97a45ea9476f30682de2b' })));
     }
 };
 NvRow.style = NvRowStyle0;

package/dist/cjs/nv-stack.cjs.entry.js CHANGED Viewed

@@ -23,7 +23,7 @@ const NvStack = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '24cca0f7101de5f37d30884983da28a839df9bee', class: clsx.clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gap-x-${this.gutter}`, this.gutter && this.vertical && `gap-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, index.h("slot", { key: '3521e5dd684d2c6185fd434711ae85a6ea0b68ab' })));
+        return (index.h(index.Host, { key: '0a93c321e46c7e17ac0efe09556ee4447fec5f74', class: clsx.clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gap-x-${this.gutter}`, this.gutter && this.vertical && `gap-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, index.h("slot", { key: 'faf55f3f579311c333e1ea66f1a19ace98594377' })));
     }
 };
 NvStack.style = NvStackStyle0;

package/dist/cjs/nv-table.cjs.entry.js CHANGED Viewed

@@ -315,14 +315,14 @@ const NvTable = class {
         const rows = !this.table || this.table === undefined || this.parsedData.length === 0
             ? []
             : this.table.data;
-        return (index.h(index.Host, { key: '0e7b7e03592f9f68b9158e8374986986e0f155d4' }, index.h("div", { key: 'eeebf671dde65fcd725fbbe78099816d1c07c65f', class: "hidden" }, index.h("slot", { key: '2ac114cec120874bb0f7bf6ddde9ec9c88d978cf' })), index.h("slot", { key: 'b8dea8ff4c987b679ab78e73c4b7698a608c1ee3', name: "before" }), this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (index.h("div", { class: "no-data" }, this.noColumnsNoDataMessage)) : (index.h("table", { class: "table" }, this.parsedColumns.length > 0 && headerGroups.length > 0 && (index.h("thead", { class: "table-header" }, index.h("tr", null, headerGroups &&
+        return (index.h(index.Host, { key: 'a389cee4e6b29cdb852b8b6c0f8fd39926474525' }, index.h("div", { key: 'ea7629bc0cba0ec1cbe59f6f03ac2527095d9abb', class: "hidden" }, index.h("slot", { key: 'b070a8e7f54fd3846744bb659447b97547d1c7cf' })), index.h("slot", { key: 'b0eb0a2d7c98073e88282b1e2e513b9e6a335345', name: "before" }), this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (index.h("div", { class: "no-data" }, this.noColumnsNoDataMessage)) : (index.h("table", { class: "table" }, this.parsedColumns.length > 0 && headerGroups.length > 0 && (index.h("thead", { class: "table-header" }, index.h("tr", null, headerGroups &&
             headerGroups.map(col => {
                 return (index.h("th", { key: col.name }, this.renderTemplate(this.headerTemplateCache.get(col.name), {}) || col.header));
             })))), index.h("tbody", { class: "table-body" }, !rows || rows.length === 0 ? (index.h("tr", null, index.h("td", { colSpan: headerGroups.length || 12, class: "no-data" }, this.noDataMessage))) : (rows.map(row => (index.h("tr", { key: JSON.stringify(row) }, headerGroups.map(col => {
             var _a;
             return (index.h("td", null, this.renderTemplate(this.templateCache.get(col.name), row) ||
                 ((_a = row[col.name]) !== null && _a !== void 0 ? _a : this.fallbackValue)));
-        })))))))), index.h("slot", { key: '4dc0404a05946bc942f65af599fea186166cde9c', name: "after" })));
+        })))))))), index.h("slot", { key: '599e4c1663c3a80375e3c511358be381b06eec2f', name: "after" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/nv-toggle.cjs.entry.js CHANGED Viewed

@@ -66,8 +66,8 @@ const NvToggle = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '9b3a2c50180d17241f514ebfecb2d959d6aaf263', class: clsx.clsx(this.labelPlacement === 'before' && 'label-placement-before') }, index.h("div", { key: '70420566c51bb19c3ef9b8718ba0069bd739fd26', class: "input-container" }, index.h("input", { key: '5c1cfd0858a14cf1854de5a09b2daa55c4e781ba', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), index.h("div", { key: 'f4678a7ed5a7e58397aadfe5155b95a395f39fba', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '4d25373b9c782d3016da002d1fa22dd551a1597a', htmlFor: this.inputId, class: clsx.clsx(this.hideLabel && 'visually-hidden') }, index.h("slot", { key: 'f297abef15befddc6b180edffe3ab7b0bb39d223', name: "label" }, this.label))), (this.description ||
-            this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '97f2b1045c5152fb66da582c7fcf2975cbe10e68', class: "description" }, index.h("slot", { key: 'fae238400ac3a106079a7e361d179598a99363a4', name: "description" }, this.description))))));
+        return (index.h(index.Host, { key: '7aac2ef8519d5c033a0e74461755e2286420032a', class: clsx.clsx(this.labelPlacement === 'before' && 'label-placement-before') }, index.h("div", { key: 'fb0f560aff50b9d3c2b75ba2b59dd68012f5af10', class: "input-container" }, index.h("input", { key: '61ff98c20dec0822979f04ad3b3316fc3caac31f', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), index.h("div", { key: '543ad351428f6ae60e94bd31e3a7a6922c02e5d4', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '42f764c9c4454cf5b8b1fa88c2c43654170a5222', htmlFor: this.inputId, class: clsx.clsx(this.hideLabel && 'visually-hidden') }, index.h("slot", { key: '125247eeea72b68de829f36ad817a4381541ad07', name: "label" }, this.label))), (this.description ||
+            this.el.querySelector('[slot="description"]')) && (index.h("div", { key: 'a2fcd0d39a8f555e7d6b64879e84ff7f011e4901', class: "description" }, index.h("slot", { key: '4e7af6b6a0a25fcb4d9529dcb1a32cb7c928c7de', name: "description" }, this.description))))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/nv-tooltip.cjs.entry.js CHANGED Viewed

@@ -37,7 +37,7 @@ const NvTooltip = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'eb3e25818bb1e57340ac169d1c40a0e4e9c56668' }, index.h("slot", { key: '7937859bff530ff10a0de9076a77c92afa9ec9e7' }), index.h("nv-popover", { key: 'e825c93c7d90f5598416f1f081c95517c7a27883', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, index.h("p", { key: '5a5987e3a04f02be104e5f8fcca2f40b75938a97', slot: "content" }, this.message), index.h("slot", { key: 'd7efc512e29969e7c8c1a693f2fb15f9319e1fa8', name: "content" }))));
+        return (index.h(index.Host, { key: 'ced39f0ebd3ee8eba520e6d6241728e95031dafc' }, index.h("slot", { key: '2b65cb626604a29e1924e7eb2bbb4e937c1a9e9c' }), index.h("nv-popover", { key: 'd4c91e52da651c1545b6d7af98c740e08eeaffbf', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, index.h("p", { key: '45805ecf6ffee80f4f81acce2d921ad66585bf2b', slot: "content" }, this.message), index.h("slot", { key: 'e6a7e80c35c3a87627a50b271c86783fab791338', name: "content" }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/collection/components/nv-accordion/nv-accordion.docs.js CHANGED Viewed

@@ -9,7 +9,7 @@ const NvAccordionDocs = {
             description: 'Accordion with simple items',
             args: {
                 mode: 'accordion',
-                data: JSON.stringify([
+                data: [
                     {
                         id: '1',
                         title: 'Title 1',
@@ -20,7 +20,7 @@ const NvAccordionDocs = {
                         title: 'Title 2',
                         content: 'Content of title 2',
                     },
-                ]),
+                ],
             },
             template: h("nv-accordion", { "data-storybook-args": true }),
         },
@@ -29,7 +29,7 @@ const NvAccordionDocs = {
             description: 'Accordion allowing multiple items to be open',
             args: {
                 mode: 'multi',
-                data: JSON.stringify([
+                data: [
                     {
                         id: '1',
                         title: 'Title 1',
@@ -40,26 +40,33 @@ const NvAccordionDocs = {
                         title: 'Title 2',
                         content: 'Content of title 2',
                     },
-                ]),
+                ],
             },
             template: h("nv-accordion", { "data-storybook-args": true }),
         },
         {
             name: 'CustomHeader',
             description: 'Real-world example with TraXes Connection Points',
-            template: (h("nv-accordion", { mode: "accordion", openIndexes: [0, 2] }, h("nv-accordion-item", null, h("div", { slot: "header" }, h("div", { class: "flex items-center justify-between w-full" }, h("div", { class: "flex flex-col border-r border-[#E3E3E3] pr-4 mr-4" }, h("span", { class: "nv-accordion-item__title" }, "EC-308"), h("span", { class: "nv-accordion-item__subtitle" }, "Connection point")), h("nv-badge", { color: "success", label: "Running" }, h("nv-icon", { slot: "leading-icon", name: "check", size: "sm" })))), h("div", { slot: "content", class: "flex items-center justify-between" }, h("div", null, h("p", null, "Single accordion or accordion group"), h("p", null, "Use the accordion as a single instance, or in a group of accordions stacked vertically."), h("p", null, "The accordion title is wrapped in a heading tag by default. Alter it to fit the information architecture of the page.")))), h("nv-accordion-item", null, h("div", { slot: "header" }, h("div", { class: "flex items-center justify-between w-full" }, h("div", { class: "flex flex-col border-r border-[#E3E3E3] pr-4 mr-4" }, h("span", { class: "nv-accordion-item__title" }, "EC-309"), h("span", { class: "nv-accordion-item__subtitle" }, "Connection point")), h("nv-badge", { color: "success", label: "Running" }, h("nv-icon", { slot: "leading-icon", name: "check", size: "sm" })))), h("div", { slot: "content" }, h("p", null, "Content for EC-309 connection point"))), h("nv-accordion-item", null, h("div", { slot: "header" }, h("div", { class: "flex items-center justify-between w-full" }, h("div", { class: "flex flex-col border-r border-[#E3E3E3] pr-4 mr-4" }, h("span", { class: "nv-accordion-item__title" }, "EC-310"), h("span", { class: "nv-accordion-item__subtitle" }, "Connection point")), h("nv-badge", { color: "error", label: "Stopped" }, h("nv-icon", { slot: "leading-icon", name: "x", size: "sm" })))), h("div", { slot: "content" }, h("p", null, "Content for EC-310 connection point (stopped)"))))),
+            args: {
+                mode: 'accordion',
+                openIndexes: [0, 2],
+            },
+            template: (h("nv-accordion", { "data-storybook-args": true }, h("nv-accordion-item", null, h("div", { slot: "header" }, h("div", { "data-class": "flex items-center justify-between w-full" }, h("div", { "data-class": "flex flex-col border-r border-[#E3E3E3] pr-4 mr-4" }, h("span", { "data-class": "nv-accordion-item__title" }, "EC-308"), h("span", { "data-class": "nv-accordion-item__subtitle" }, "Connection point")), h("nv-badge", { color: "success", label: "Running" }, h("nv-icon", { slot: "leading-icon", name: "check", size: "sm" })))), h("div", { slot: "content", "data-class": "flex items-center justify-between" }, h("div", null, h("p", null, "Single accordion or accordion group"), h("p", null, "Use the accordion as a single instance, or in a group of accordions stacked vertically."), h("p", null, "The accordion title is wrapped in a heading tag by default. Alter it to fit the information architecture of the page.")))), h("nv-accordion-item", null, h("div", { slot: "header" }, h("div", { "data-class": "flex items-center justify-between w-full" }, h("div", { "data-class": "flex flex-col border-r border-[#E3E3E3] pr-4 mr-4" }, h("span", { "data-class": "nv-accordion-item__title" }, "EC-309"), h("span", { "data-class": "nv-accordion-item__subtitle" }, "Connection point")), h("nv-badge", { color: "success", label: "Running" }, h("nv-icon", { slot: "leading-icon", name: "check", size: "sm" })))), h("div", { slot: "content" }, h("p", null, "Content for EC-309 connection point"))), h("nv-accordion-item", null, h("div", { slot: "header" }, h("div", { "data-class": "flex items-center justify-between w-full" }, h("div", { "data-class": "flex flex-col border-r border-[#E3E3E3] pr-4 mr-4" }, h("span", { "data-class": "nv-accordion-item__title" }, "EC-310"), h("span", { "data-class": "nv-accordion-item__subtitle" }, "Connection point")), h("nv-badge", { color: "error", label: "Stopped" }, h("nv-icon", { slot: "leading-icon", name: "x", size: "sm" })))), h("div", { slot: "content" }, h("p", null, "Content for EC-310 connection point (stopped)"))))),
         },
         {
             name: 'DisabledItem',
             description: 'Accordion with a disabled item',
-            template: (h("nv-accordion", { mode: "accordion" }, h("nv-accordion-item", { itemtitle: "Active item", open: true }, h("div", { slot: "content" }, "This item is accessible")), h("nv-accordion-item", { itemtitle: "Disabled item", disabled: true }, h("div", { slot: "content" }, "This item is not accessible because it is disabled")))),
+            args: {
+                mode: 'accordion',
+            },
+            template: (h("nv-accordion", { "data-storybook-args": true }, h("nv-accordion-item", { itemTitle: "Active item", open: true }, h("div", { slot: "content" }, "This item is accessible")), h("nv-accordion-item", { itemTitle: "Disabled item", disabled: true }, h("div", { slot: "content" }, "This item is not accessible because it is disabled")))),
         },
         {
             name: 'OpenIndexesDemo',
             description: 'Demonstration of openIndexes with multiple items and first item pre-opened',
             args: {
                 mode: 'accordion',
-                data: JSON.stringify([
+                data: [
                     {
                         id: '1',
                         title: 'Item 1 - Pre-opened',
@@ -110,7 +117,7 @@ const NvAccordionDocs = {
                         title: 'Item 10',
                         content: 'Content of the tenth item.',
                     },
-                ]),
+                ],
                 openIndexes: [0],
             },
             template: h("nv-accordion", { "data-storybook-args": true }),
@@ -120,7 +127,7 @@ const NvAccordionDocs = {
             description: 'Accordion with complex data including all possible attributes',
             args: {
                 mode: 'accordion',
-                data: JSON.stringify([
+                data: [
                     {
                         id: '1',
                         title: 'Complete section',
@@ -135,7 +142,7 @@ const NvAccordionDocs = {
                         content: 'Inaccessible content',
                         disabled: true,
                     },
-                ]),
+                ],
                 openIndexes: [0],
             },
             template: h("nv-accordion", { "data-storybook-args": true }),

package/dist/collection/components/nv-accordion/nv-accordion.docs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nv-accordion.docs.js","sourceRoot":"","sources":["../../../src/components/nv-accordion/nv-accordion.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\n\nconst NvAccordionDocs: NovaDocs<Components.NvAccordion> = {\n component: 'nv-accordion',\n subcomponents: ['nv-accordion-item', 'nv-icon', 'nv-button', 'nv-badge'],\n badge: 'beta',\n stories: [\n {\n name: 'Default',\n description: 'Accordion with simple items',\n args: {\n mode: 'accordion',\n data: JSON.stringify([\n {\n id: '1',\n title: 'Title 1',\n content: 'Content of title 1',\n },\n {\n id: '2',\n title: 'Title 2',\n content: 'Content of title 2',\n },\n ]),\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n {\n name: 'MultiMode',\n description: 'Accordion allowing multiple items to be open',\n args: {\n mode: 'multi',\n data: JSON.stringify([\n {\n id: '1',\n title: 'Title 1',\n content: 'Content of title 1',\n },\n {\n id: '2',\n title: 'Title 2',\n content: 'Content of title 2',\n },\n ]),\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n {\n name: 'CustomHeader',\n description: 'Real-world example with TraXes Connection Points',\n template: (\n <nv-accordion mode=\"accordion\" openIndexes={[0, 2]}>\n <nv-accordion-item>\n <div slot=\"header\">\n <div class=\"flex items-center justify-between w-full\">\n <div class=\"flex flex-col border-r border-[#E3E3E3] pr-4 mr-4\">\n <span class=\"nv-accordion-item__title\">EC-308</span>\n <span class=\"nv-accordion-item__subtitle\">\n Connection point\n </span>\n </div>\n <nv-badge color=\"success\" label=\"Running\">\n <nv-icon slot=\"leading-icon\" name=\"check\" size=\"sm\" />\n </nv-badge>\n </div>\n </div>\n <div slot=\"content\" class=\"flex items-center justify-between\">\n <div>\n <p>Single accordion or accordion group</p>\n <p>\n Use the accordion as a single instance, or in a group of\n accordions stacked vertically.\n </p>\n <p>\n The accordion title is wrapped in a heading tag by default.\n Alter it to fit the information architecture of the page.\n </p>\n </div>\n </div>\n </nv-accordion-item>\n <nv-accordion-item>\n <div slot=\"header\">\n <div class=\"flex items-center justify-between w-full\">\n <div class=\"flex flex-col border-r border-[#E3E3E3] pr-4 mr-4\">\n <span class=\"nv-accordion-item__title\">EC-309</span>\n <span class=\"nv-accordion-item__subtitle\">\n Connection point\n </span>\n </div>\n <nv-badge color=\"success\" label=\"Running\">\n <nv-icon slot=\"leading-icon\" name=\"check\" size=\"sm\" />\n </nv-badge>\n </div>\n </div>\n <div slot=\"content\">\n <p>Content for EC-309 connection point</p>\n </div>\n </nv-accordion-item>\n <nv-accordion-item>\n <div slot=\"header\">\n <div class=\"flex items-center justify-between w-full\">\n <div class=\"flex flex-col border-r border-[#E3E3E3] pr-4 mr-4\">\n <span class=\"nv-accordion-item__title\">EC-310</span>\n <span class=\"nv-accordion-item__subtitle\">\n Connection point\n </span>\n </div>\n <nv-badge color=\"error\" label=\"Stopped\">\n <nv-icon slot=\"leading-icon\" name=\"x\" size=\"sm\" />\n </nv-badge>\n </div>\n </div>\n <div slot=\"content\">\n <p>Content for EC-310 connection point (stopped)</p>\n </div>\n </nv-accordion-item>\n </nv-accordion>\n ),\n },\n {\n name: 'DisabledItem',\n description: 'Accordion with a disabled item',\n template: (\n <nv-accordion mode=\"accordion\">\n <nv-accordion-item itemtitle=\"Active item\" open>\n <div slot=\"content\">This item is accessible</div>\n </nv-accordion-item>\n <nv-accordion-item itemtitle=\"Disabled item\" disabled>\n <div slot=\"content\">\n This item is not accessible because it is disabled\n </div>\n </nv-accordion-item>\n </nv-accordion>\n ),\n },\n {\n name: 'OpenIndexesDemo',\n description:\n 'Demonstration of openIndexes with multiple items and first item pre-opened',\n args: {\n mode: 'accordion',\n data: JSON.stringify([\n {\n id: '1',\n title: 'Item 1 - Pre-opened',\n content:\n 'This is the first item that is opened by default using openIndexes.',\n },\n {\n id: '2',\n title: 'Item 2',\n content: 'Content of the second item.',\n },\n {\n id: '3',\n title: 'Item 3',\n content: 'Content of the third item.',\n },\n {\n id: '4',\n title: 'Item 4',\n content: 'Content of the fourth item.',\n },\n {\n id: '5',\n title: 'Item 5',\n content: 'Content of the fifth item.',\n },\n {\n id: '6',\n title: 'Item 6',\n content: 'Content of the sixth item.',\n },\n {\n id: '7',\n title: 'Item 7',\n content: 'Content of the seventh item.',\n },\n {\n id: '8',\n title: 'Item 8',\n content: 'Content of the eighth item.',\n },\n {\n id: '9',\n title: 'Item 9',\n content: 'Content of the ninth item.',\n },\n {\n id: '10',\n title: 'Item 10',\n content: 'Content of the tenth item.',\n },\n ]),\n openIndexes: [0],\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n {\n name: 'ComplexData',\n description:\n 'Accordion with complex data including all possible attributes',\n args: {\n mode: 'accordion',\n data: JSON.stringify([\n {\n id: '1',\n title: 'Complete section',\n subtitle: 'With all attributes',\n content: 'Main content',\n disabled: false,\n },\n {\n id: '2',\n title: 'Disabled section',\n subtitle: 'Not accessible',\n content: 'Inaccessible content',\n disabled: true,\n },\n ]),\n openIndexes: [0],\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n ],\n};\n\nexport default NvAccordionDocs;\n"]}
1	+ {"version":3,"file":"nv-accordion.docs.js","sourceRoot":"","sources":["../../../src/components/nv-accordion/nv-accordion.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\n\nconst NvAccordionDocs: NovaDocs<Components.NvAccordion> = {\n component: 'nv-accordion',\n subcomponents: ['nv-accordion-item', 'nv-icon', 'nv-button', 'nv-badge'],\n badge: 'beta',\n stories: [\n {\n name: 'Default',\n description: 'Accordion with simple items',\n args: {\n mode: 'accordion',\n data: [\n {\n id: '1',\n title: 'Title 1',\n content: 'Content of title 1',\n },\n {\n id: '2',\n title: 'Title 2',\n content: 'Content of title 2',\n },\n ],\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n {\n name: 'MultiMode',\n description: 'Accordion allowing multiple items to be open',\n args: {\n mode: 'multi',\n data: [\n {\n id: '1',\n title: 'Title 1',\n content: 'Content of title 1',\n },\n {\n id: '2',\n title: 'Title 2',\n content: 'Content of title 2',\n },\n ],\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n {\n name: 'CustomHeader',\n description: 'Real-world example with TraXes Connection Points',\n args: {\n mode: 'accordion',\n openIndexes: [0, 2],\n },\n template: (\n <nv-accordion data-storybook-args>\n <nv-accordion-item>\n <div slot=\"header\">\n <div data-class=\"flex items-center justify-between w-full\">\n <div data-class=\"flex flex-col border-r border-[#E3E3E3] pr-4 mr-4\">\n <span data-class=\"nv-accordion-item__title\">EC-308</span>\n <span data-class=\"nv-accordion-item__subtitle\">\n Connection point\n </span>\n </div>\n <nv-badge color=\"success\" label=\"Running\">\n <nv-icon slot=\"leading-icon\" name=\"check\" size=\"sm\" />\n </nv-badge>\n </div>\n </div>\n <div slot=\"content\" data-class=\"flex items-center justify-between\">\n <div>\n <p>Single accordion or accordion group</p>\n <p>\n Use the accordion as a single instance, or in a group of\n accordions stacked vertically.\n </p>\n <p>\n The accordion title is wrapped in a heading tag by default.\n Alter it to fit the information architecture of the page.\n </p>\n </div>\n </div>\n </nv-accordion-item>\n <nv-accordion-item>\n <div slot=\"header\">\n <div data-class=\"flex items-center justify-between w-full\">\n <div data-class=\"flex flex-col border-r border-[#E3E3E3] pr-4 mr-4\">\n <span data-class=\"nv-accordion-item__title\">EC-309</span>\n <span data-class=\"nv-accordion-item__subtitle\">\n Connection point\n </span>\n </div>\n <nv-badge color=\"success\" label=\"Running\">\n <nv-icon slot=\"leading-icon\" name=\"check\" size=\"sm\" />\n </nv-badge>\n </div>\n </div>\n <div slot=\"content\">\n <p>Content for EC-309 connection point</p>\n </div>\n </nv-accordion-item>\n <nv-accordion-item>\n <div slot=\"header\">\n <div data-class=\"flex items-center justify-between w-full\">\n <div data-class=\"flex flex-col border-r border-[#E3E3E3] pr-4 mr-4\">\n <span data-class=\"nv-accordion-item__title\">EC-310</span>\n <span data-class=\"nv-accordion-item__subtitle\">\n Connection point\n </span>\n </div>\n <nv-badge color=\"error\" label=\"Stopped\">\n <nv-icon slot=\"leading-icon\" name=\"x\" size=\"sm\" />\n </nv-badge>\n </div>\n </div>\n <div slot=\"content\">\n <p>Content for EC-310 connection point (stopped)</p>\n </div>\n </nv-accordion-item>\n </nv-accordion>\n ),\n },\n {\n name: 'DisabledItem',\n description: 'Accordion with a disabled item',\n args: {\n mode: 'accordion',\n },\n template: (\n <nv-accordion data-storybook-args>\n <nv-accordion-item itemTitle=\"Active item\" open>\n <div slot=\"content\">This item is accessible</div>\n </nv-accordion-item>\n <nv-accordion-item itemTitle=\"Disabled item\" disabled>\n <div slot=\"content\">\n This item is not accessible because it is disabled\n </div>\n </nv-accordion-item>\n </nv-accordion>\n ),\n },\n {\n name: 'OpenIndexesDemo',\n description:\n 'Demonstration of openIndexes with multiple items and first item pre-opened',\n args: {\n mode: 'accordion',\n data: [\n {\n id: '1',\n title: 'Item 1 - Pre-opened',\n content:\n 'This is the first item that is opened by default using openIndexes.',\n },\n {\n id: '2',\n title: 'Item 2',\n content: 'Content of the second item.',\n },\n {\n id: '3',\n title: 'Item 3',\n content: 'Content of the third item.',\n },\n {\n id: '4',\n title: 'Item 4',\n content: 'Content of the fourth item.',\n },\n {\n id: '5',\n title: 'Item 5',\n content: 'Content of the fifth item.',\n },\n {\n id: '6',\n title: 'Item 6',\n content: 'Content of the sixth item.',\n },\n {\n id: '7',\n title: 'Item 7',\n content: 'Content of the seventh item.',\n },\n {\n id: '8',\n title: 'Item 8',\n content: 'Content of the eighth item.',\n },\n {\n id: '9',\n title: 'Item 9',\n content: 'Content of the ninth item.',\n },\n {\n id: '10',\n title: 'Item 10',\n content: 'Content of the tenth item.',\n },\n ],\n openIndexes: [0],\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n {\n name: 'ComplexData',\n description:\n 'Accordion with complex data including all possible attributes',\n args: {\n mode: 'accordion',\n data: [\n {\n id: '1',\n title: 'Complete section',\n subtitle: 'With all attributes',\n content: 'Main content',\n disabled: false,\n },\n {\n id: '2',\n title: 'Disabled section',\n subtitle: 'Not accessible',\n content: 'Inaccessible content',\n disabled: true,\n },\n ],\n openIndexes: [0],\n },\n template: <nv-accordion data-storybook-args></nv-accordion>,\n },\n ],\n};\n\nexport default NvAccordionDocs;\n"]}

package/dist/collection/components/nv-accordion/nv-accordion.js CHANGED Viewed

@@ -4,6 +4,12 @@ import { Host, h, } from "@stencil/core";
  */
 export class NvAccordion {
     constructor() {
+        /****************************************************************************/
+        //#region PROPERTIES
+        /**
+         * Data to display as a list of items (title, subtitle, content).
+         */
+        this.data = [];
         /**
          * Expansion mode: 'accordion' (single open) or 'multi' (multiple open)
          */
@@ -15,12 +21,6 @@ export class NvAccordion {
          * Internal index of open items (not exposed)
          */
         this.internalOpenIndexes = [];
-        /**
-         * Parsed data from data prop
-         */
-        this.parsedData = [];
-        // Synchronization openIndexes <-> internalOpenIndexes
-        this.itemToggleHandlers = [];
     }
     //#endregion EVENTS
     /****************************************************************************/
@@ -61,7 +61,7 @@ export class NvAccordion {
             }
         }
         this.internalOpenIndexes = openIndexes;
-        this.nvChange.emit({ openIndexes });
+        this.openChanged.emit({ openIndexes });
         if (this.openIndexes !== undefined) {
             this.openIndexes =
                 this.mode === 'accordion'
@@ -83,9 +83,6 @@ export class NvAccordion {
      * @param {CustomEvent<boolean>} event Event emitted by nv-accordion-item
      */
     onItemToggle(event) {
-        // Ignore if using data (handled by itemToggleHandlers)
-        if (this.parsedData && this.parsedData.length > 0)
-            return;
         // Find the index of the item that emitted the event
         const items = Array.from(this.el.querySelectorAll('nv-accordion-item'));
         const targetItem = event.target;
@@ -113,8 +110,8 @@ export class NvAccordion {
                 // If the item is closing, remove it from internalOpenIndexes
                 this.internalOpenIndexes = this.internalOpenIndexes.filter(i => i !== index);
             }
-            // Emit nvChange event
-            this.nvChange.emit({ openIndexes: this.internalOpenIndexes });
+            // Emit openChanged event
+            this.openChanged.emit({ openIndexes: this.internalOpenIndexes });
             if (this.openIndexes !== undefined) {
                 this.openIndexes =
                     this.mode === 'accordion'
@@ -126,35 +123,17 @@ export class NvAccordion {
     //#endregion METHODS
     /****************************************************************************/
     //#region WATCHERS
-    dataChanged() {
-        this.parseData();
-    }
-    parseData() {
-        if (typeof this.data === 'string') {
-            try {
-                this.parsedData = JSON.parse(this.data);
-            }
-            catch (e) {
-                console.error('nv-accordion: Failed to parse data prop.', e);
-                this.parsedData = [];
-            }
-        }
-        else {
-            this.parsedData = this.data || [];
-        }
-        if (this.parsedData) {
-            this.itemToggleHandlers = this.parsedData.map((_, i) => () => this.toggleItem(i));
-        }
-    }
+    //#endregion WATCHERS
+    /****************************************************************************/
+    //#region LIFECYCLE
     componentWillLoad() {
-        this.parseData();
         if (this.openIndexes !== undefined) {
             this.internalOpenIndexes = [...this.openIndexes];
         }
     }
     componentDidLoad() {
         // If using direct child elements, initialize their state
-        if (!this.parsedData || this.parsedData.length === 0) {
+        if (!this.data || this.data.length === 0) {
             this.updateChildrenState();
         }
     }
@@ -163,16 +142,13 @@ export class NvAccordion {
             this.internalOpenIndexes = [...this.openIndexes];
         }
     }
-    //#endregion WATCHERS
-    /****************************************************************************/
-    //#region LIFECYCLE
     //#endregion LIFECYCLE
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '5dcc9ea52a404dff7c4bb176b8a9781019e64bd3', role: "list", class: "nv-accordion" }, this.parsedData && this.parsedData.length > 0 ? (this.parsedData.map((item, i) => {
+        return (h(Host, { key: 'a6cb21b274024a00e60e0d0db780f25fab6e5bc2', role: "list", class: "nv-accordion" }, this.data && this.data.length > 0 ? (this.data.map((item, i) => {
             var _a;
-            return (h("nv-accordion-item", { key: (_a = item.id) !== null && _a !== void 0 ? _a : i, itemtitle: item.title, disabled: item.disabled, open: (this.internalOpenIndexes || []).includes(i), onItemToggle: this.itemToggleHandlers[i] }, item.subtitle ? (h("div", { slot: "header" }, h("div", { class: "nv-accordion-item__header-content" }, h("span", { class: "nv-accordion-item__title" }, item.title), h("span", { class: "nv-accordion-item__subtitle" }, item.subtitle)))) : null, h("div", { slot: "content" }, item.content), item.footer && h("div", { slot: "footer" }, item.footer)));
+            return (h("nv-accordion-item", { key: (_a = item.id) !== null && _a !== void 0 ? _a : i, itemTitle: item.title, disabled: item.disabled, open: (this.internalOpenIndexes || []).includes(i) }, item.subtitle ? (h("div", { slot: "header" }, h("div", { class: "nv-accordion-item__header-content" }, h("span", { class: "nv-accordion-item__title" }, item.title), h("span", { class: "nv-accordion-item__subtitle" }, item.subtitle)))) : null, h("div", { slot: "content" }, item.content), item.footer && h("div", { slot: "footer" }, item.footer)));
         })) : (h("slot", null))));
     }
     static get is() { return "nv-accordion"; }
@@ -189,23 +165,22 @@ export class NvAccordion {
     static get properties() {
         return {
             "data": {
-                "type": "string",
+                "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "{\n    /** Unique identifier of the item */\n    id: string;\n    /** Item title */\n    title: string;\n    /** Optional subtitle */\n    subtitle?: string;\n    /** Main content */\n    content: string;\n    /** Optional footer */\n    footer?: string;\n    /** Disabled state */\n    disabled?: boolean;\n  }[]",
+                    "resolved": "{ id: string; title: string; subtitle?: string; content: string; footer?: string; disabled?: boolean; }[]",
                     "references": {}
                 },
                 "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Data to display as a list of items (title, subtitle, content).\nMust be provided as a JSON string containing an array of items with:\n- title: main title (required)\n- subtitle: subtitle (optional)\n- content: main content (required)\n- footer: footer (optional)\n- disabled: disables the item (optional)\n- id: unique identifier (optional)"
+                    "text": "Data to display as a list of items (title, subtitle, content)."
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "data",
-                "reflect": true
+                "defaultValue": "[]"
             },
             "mode": {
                 "type": "string",
@@ -248,14 +223,13 @@ export class NvAccordion {
     }
     static get states() {
         return {
-            "internalOpenIndexes": {},
-            "parsedData": {}
+            "internalOpenIndexes": {}
         };
     }
     static get events() {
         return [{
-                "method": "nvChange",
-                "name": "nvChange",
+                "method": "openChanged",
+                "name": "openChanged",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
@@ -323,12 +297,6 @@ export class NvAccordion {
         };
     }
     static get elementRef() { return "el"; }
-    static get watchers() {
-        return [{
-                "propName": "data",
-                "methodName": "dataChanged"
-            }];
-    }
     static get listeners() {
         return [{
                 "name": "itemToggle",

package/dist/collection/components/nv-accordion/nv-accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nv-accordion.js","sourceRoot":"","sources":["../../../src/components/nv-accordion/nv-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n State,\n Event,\n EventEmitter,\n Method,\n Listen,\n Element,\n Watch,\n} from '@stencil/core';\n/*\n Interface defining the structure of an accordion item\n /\nexport interface AccordionItem {\n /* Unique identifier of the item /\n id: string;\n /* Item title /\n title: string;\n /* Optional subtitle /\n subtitle?: string;\n /* Main content /\n content: string;\n /* Optional footer /\n footer?: string;\n /* Disabled state /\n disabled?: boolean;\n}\n\n/\n Interface for nv-accordion-item component props\n /\nexport interface AccordionItemProps {\n /* Item title (displayed if header slot is absent) /\n itemtitle?: string;\n /* Item subtitle (displayed if header slot is absent) /\n subtitle?: string;\n /* Open or closed /\n open?: boolean;\n /* Disables the item /\n disabled?: boolean;\n /* Parent expansion mode (accordion or multi) /\n mode?: 'accordion' \| 'multi';\n}\n\n/\n @slot default - Slot for custom content (optional, ignored if data is provided)\n /\n@Component({\n tag: 'nv-accordion',\n styleUrl: 'styles/nv-accordion.scss',\n shadow: false,\n})\nexport class NvAccordion {\n /*************************************************************************/\n //#region PROPERTIES\n /\n * Data to display as a list of items (title, subtitle, content).\n * Must be provided as a JSON string containing an array of items with:\n * - title: main title (required)\n * - subtitle: subtitle (optional)\n * - content: main content (required)\n * - footer: footer (optional)\n * - disabled: disables the item (optional)\n * - id: unique identifier (optional)\n /\n @Prop({ reflect: true })\n readonly data: string;\n\n /\n Expansion mode: 'accordion' (single open) or 'multi' (multiple open)\n /\n @Prop({ reflect: true })\n readonly mode: 'accordion' \| 'multi' = 'accordion';\n\n /\n Index of open items (external control possible)\n /\n @Prop({ reflect: true, mutable: true })\n openIndexes?: number[];\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region STATE\n /\n * Internal index of open items (not exposed)\n /\n @State()\n internalOpenIndexes: number[] = [];\n\n /\n Parsed data from data prop\n /\n @State()\n private parsedData: AccordionItem[] = [];\n\n /\n Reference to host element to access children\n /\n @Element() el!: HTMLNvAccordionElement;\n //#endregion STATE\n /*************************************************************************/\n //#region EVENTS\n /\n * Event emitted when an item's open state changes\n /\n @Event()\n nvChange: EventEmitter<{\n /* Index of open items /\n openIndexes: number[];\n }>;\n //#endregion EVENTS\n /*************************************************************************/\n //#region METHODS\n /\n * Opens an item by its index (Public API)\n * @param {number} index Index of the item to open\n /\n @Method()\n async open(index: number) {\n this.toggleItem(index, true);\n }\n /\n Closes an item by its index (Public API)\n * @param {number} index Index of the item to close\n /\n @Method()\n async close(index: number) {\n this.toggleItem(index, false);\n }\n /\n Toggles an item's state (internal)\n * @param {number} index Item index\n * @param {boolean} [forceOpen] Force open (true) or close (false)\n /\n private toggleItem(index: number, forceOpen?: boolean) {\n let openIndexes =\n this.openIndexes !== undefined\n ? [...this.openIndexes]\n : [...(this.internalOpenIndexes \|\| [])];\n const isOpen = openIndexes.includes(index);\n if (this.mode === 'accordion') {\n openIndexes = forceOpen === false \|\| isOpen ? [] : [index];\n } else {\n if (forceOpen === false) {\n openIndexes = openIndexes.filter(i => i !== index);\n } else if (!isOpen) {\n openIndexes.push(index);\n }\n }\n this.internalOpenIndexes = openIndexes;\n this.nvChange.emit({ openIndexes });\n if (this.openIndexes !== undefined) {\n this.openIndexes =\n this.mode === 'accordion'\n ? [openIndexes[0]].filter(x => x !== undefined)\n : [...openIndexes];\n }\n\n // Update child elements state - for both data and slot usage\n this.updateChildrenState();\n }\n\n /\n Updates the open state of child elements based on internalOpenIndexes\n /\n private async updateChildrenState() {\n // Force a re-render by updating the state\n this.internalOpenIndexes = [...(this.internalOpenIndexes \|\| [])];\n }\n\n /\n Listens to itemToggle events from nv-accordion-item elements\n * @param {CustomEvent<boolean>} event Event emitted by nv-accordion-item\n /\n @Listen('itemToggle')\n onItemToggle(event: CustomEvent<boolean>) {\n // Ignore if using data (handled by itemToggleHandlers)\n if (this.parsedData && this.parsedData.length > 0) return;\n\n // Find the index of the item that emitted the event\n const items = Array.from(\n this.el.querySelectorAll('nv-accordion-item'),\n ) as HTMLNvAccordionItemElement[];\n const targetItem = event.target as HTMLNvAccordionItemElement;\n const index = items.indexOf(targetItem);\n\n if (index !== -1) {\n // If the event comes from an item that is opening, handle accordion mode\n if (event.detail === true) {\n if (this.mode === 'accordion') {\n // Close all other items\n items.forEach((item, i) => {\n if (i !== index && item.open) {\n item.open = false;\n }\n });\n this.internalOpenIndexes = [index];\n } else {\n // Add index to internalOpenIndexes if not already present\n if (!this.internalOpenIndexes.includes(index)) {\n this.internalOpenIndexes = [...this.internalOpenIndexes, index];\n }\n }\n } else {\n // If the item is closing, remove it from internalOpenIndexes\n this.internalOpenIndexes = this.internalOpenIndexes.filter(\n i => i !== index,\n );\n }\n\n // Emit nvChange event\n this.nvChange.emit({ openIndexes: this.internalOpenIndexes });\n if (this.openIndexes !== undefined) {\n this.openIndexes =\n this.mode === 'accordion'\n ? [this.internalOpenIndexes[0]].filter(x => x !== undefined)\n : [...this.internalOpenIndexes];\n }\n }\n }\n //#endregion METHODS\n /*************************************************************************/\n //#region WATCHERS\n @Watch('data')\n dataChanged() {\n this.parseData();\n }\n\n // Synchronization openIndexes <-> internalOpenIndexes\n private itemToggleHandlers: Array<() => void> = [];\n\n private parseData() {\n if (typeof this.data === 'string') {\n try {\n this.parsedData = JSON.parse(this.data);\n } catch (e) {\n console.error('nv-accordion: Failed to parse data prop.', e);\n this.parsedData = [];\n }\n } else {\n this.parsedData = this.data \|\| [];\n }\n\n if (this.parsedData) {\n this.itemToggleHandlers = this.parsedData.map(\n (_, i) => () => this.toggleItem(i),\n );\n }\n }\n\n componentWillLoad() {\n this.parseData();\n if (this.openIndexes !== undefined) {\n this.internalOpenIndexes = [...this.openIndexes];\n }\n }\n\n componentDidLoad() {\n // If using direct child elements, initialize their state\n if (!this.parsedData \|\| this.parsedData.length === 0) {\n this.updateChildrenState();\n }\n }\n\n componentWillUpdate() {\n if (this.openIndexes !== undefined) {\n this.internalOpenIndexes = [...this.openIndexes];\n }\n }\n //#endregion WATCHERS\n /************************************************************************/\n //#region LIFECYCLE\n //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n render() {\n return (\n <Host role=\"list\" class=\"nv-accordion\">\n {this.parsedData && this.parsedData.length > 0 ? (\n this.parsedData.map((item, i) => (\n <nv-accordion-item\n key={item.id ?? i}\n itemtitle={item.title}\n disabled={item.disabled}\n open={(this.internalOpenIndexes \|\| []).includes(i)}\n onItemToggle={this.itemToggleHandlers[i]}\n >\n {item.subtitle ? (\n <div slot=\"header\">\n <div class=\"nv-accordion-item__header-content\">\n <span class=\"nv-accordion-item__title\">{item.title}</span>\n <span class=\"nv-accordion-item__subtitle\">\n {item.subtitle}\n </span>\n </div>\n </div>\n ) : null}\n <div slot=\"content\">{item.content}</div>\n {item.footer && <div slot=\"footer\">{item.footer}</div>}\n </nv-accordion-item>\n ))\n ) : (\n <slot></slot>\n )}\n </Host>\n );\n }\n // #endregion RENDER\n}\n"]}
1	+ {"version":3,"file":"nv-accordion.js","sourceRoot":"","sources":["../../../src/components/nv-accordion/nv-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n State,\n Event,\n EventEmitter,\n Method,\n Listen,\n Element,\n} from '@stencil/core';\n\n/*\n @slot default - Slot for custom content (optional, ignored if data is provided)\n /\n@Component({\n tag: 'nv-accordion',\n styleUrl: 'styles/nv-accordion.scss',\n shadow: false,\n})\nexport class NvAccordion {\n /*************************************************************************/\n //#region PROPERTIES\n /\n * Data to display as a list of items (title, subtitle, content).\n /\n @Prop({ reflect: false })\n readonly data: {\n /* Unique identifier of the item /\n id: string;\n /* Item title /\n title: string;\n /* Optional subtitle /\n subtitle?: string;\n /* Main content /\n content: string;\n /* Optional footer /\n footer?: string;\n /* Disabled state /\n disabled?: boolean;\n }[] = [];\n\n /\n Expansion mode: 'accordion' (single open) or 'multi' (multiple open)\n /\n @Prop({ reflect: true })\n readonly mode: 'accordion' \| 'multi' = 'accordion';\n\n /\n Index of open items (external control possible)\n /\n @Prop({ reflect: false, mutable: true })\n openIndexes?: number[];\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region STATE\n /\n * Internal index of open items (not exposed)\n /\n @State()\n internalOpenIndexes: number[] = [];\n\n /\n Reference to host element to access children\n /\n @Element() el!: HTMLNvAccordionElement;\n //#endregion STATE\n /*************************************************************************/\n //#region EVENTS\n /\n * Event emitted when an item's open state changes\n /\n @Event()\n openChanged: EventEmitter<{\n /* Index of open items /\n openIndexes: number[];\n }>;\n //#endregion EVENTS\n /*************************************************************************/\n //#region METHODS\n /\n * Opens an item by its index (Public API)\n * @param {number} index Index of the item to open\n /\n @Method()\n async open(index: number) {\n this.toggleItem(index, true);\n }\n /\n Closes an item by its index (Public API)\n * @param {number} index Index of the item to close\n /\n @Method()\n async close(index: number) {\n this.toggleItem(index, false);\n }\n /\n Toggles an item's state (internal)\n * @param {number} index Item index\n * @param {boolean} [forceOpen] Force open (true) or close (false)\n /\n private toggleItem(index: number, forceOpen?: boolean) {\n let openIndexes =\n this.openIndexes !== undefined\n ? [...this.openIndexes]\n : [...(this.internalOpenIndexes \|\| [])];\n const isOpen = openIndexes.includes(index);\n if (this.mode === 'accordion') {\n openIndexes = forceOpen === false \|\| isOpen ? [] : [index];\n } else {\n if (forceOpen === false) {\n openIndexes = openIndexes.filter(i => i !== index);\n } else if (!isOpen) {\n openIndexes.push(index);\n }\n }\n this.internalOpenIndexes = openIndexes;\n this.openChanged.emit({ openIndexes });\n if (this.openIndexes !== undefined) {\n this.openIndexes =\n this.mode === 'accordion'\n ? [openIndexes[0]].filter(x => x !== undefined)\n : [...openIndexes];\n }\n\n // Update child elements state - for both data and slot usage\n this.updateChildrenState();\n }\n\n /\n Updates the open state of child elements based on internalOpenIndexes\n /\n private async updateChildrenState() {\n // Force a re-render by updating the state\n this.internalOpenIndexes = [...(this.internalOpenIndexes \|\| [])];\n }\n\n /\n Listens to itemToggle events from nv-accordion-item elements\n * @param {CustomEvent<boolean>} event Event emitted by nv-accordion-item\n /\n @Listen('itemToggle')\n onItemToggle(event: CustomEvent<boolean>) {\n // Find the index of the item that emitted the event\n const items = Array.from(\n this.el.querySelectorAll('nv-accordion-item'),\n ) as HTMLNvAccordionItemElement[];\n const targetItem = event.target as HTMLNvAccordionItemElement;\n const index = items.indexOf(targetItem);\n\n if (index !== -1) {\n // If the event comes from an item that is opening, handle accordion mode\n if (event.detail === true) {\n if (this.mode === 'accordion') {\n // Close all other items\n items.forEach((item, i) => {\n if (i !== index && item.open) {\n item.open = false;\n }\n });\n this.internalOpenIndexes = [index];\n } else {\n // Add index to internalOpenIndexes if not already present\n if (!this.internalOpenIndexes.includes(index)) {\n this.internalOpenIndexes = [...this.internalOpenIndexes, index];\n }\n }\n } else {\n // If the item is closing, remove it from internalOpenIndexes\n this.internalOpenIndexes = this.internalOpenIndexes.filter(\n i => i !== index,\n );\n }\n\n // Emit openChanged event\n this.openChanged.emit({ openIndexes: this.internalOpenIndexes });\n if (this.openIndexes !== undefined) {\n this.openIndexes =\n this.mode === 'accordion'\n ? [this.internalOpenIndexes[0]].filter(x => x !== undefined)\n : [...this.internalOpenIndexes];\n }\n }\n }\n\n //#endregion METHODS\n /*************************************************************************/\n //#region WATCHERS\n //#endregion WATCHERS\n /************************************************************************/\n //#region LIFECYCLE\n componentWillLoad() {\n if (this.openIndexes !== undefined) {\n this.internalOpenIndexes = [...this.openIndexes];\n }\n }\n\n componentDidLoad() {\n // If using direct child elements, initialize their state\n if (!this.data \|\| this.data.length === 0) {\n this.updateChildrenState();\n }\n }\n\n componentWillUpdate() {\n if (this.openIndexes !== undefined) {\n this.internalOpenIndexes = [...this.openIndexes];\n }\n }\n //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n render() {\n return (\n <Host role=\"list\" class=\"nv-accordion\">\n {this.data && this.data.length > 0 ? (\n this.data.map((item, i) => (\n <nv-accordion-item\n key={item.id ?? i}\n itemTitle={item.title}\n disabled={item.disabled}\n open={(this.internalOpenIndexes \|\| []).includes(i)}\n >\n {item.subtitle ? (\n <div slot=\"header\">\n <div class=\"nv-accordion-item__header-content\">\n <span class=\"nv-accordion-item__title\">{item.title}</span>\n <span class=\"nv-accordion-item__subtitle\">\n {item.subtitle}\n </span>\n </div>\n </div>\n ) : null}\n <div slot=\"content\">{item.content}</div>\n {item.footer && <div slot=\"footer\">{item.footer}</div>}\n </nv-accordion-item>\n ))\n ) : (\n <slot></slot>\n )}\n </Host>\n );\n }\n // #endregion RENDER\n}\n"]}

package/dist/collection/components/nv-accordion-item/nv-accordion-item.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { useCollapse } from "../../animations";
 /**
  * Accordion item element for nv-accordion.
  *
- * @slot header - Custom header (replaces itemtitle/subtitle)
+ * @slot header - Custom header (replaces itemTitle/subtitle)
  * @slot content - Main content (expandable area)
  */
 export class NvAccordionItem {
@@ -157,12 +157,12 @@ export class NvAccordionItem {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'fd0200c1d78b3e3ae7361783dbba14d55732e7cf', class: {
+        return (h(Host, { key: 'dfb8ca76f8ac40c938323be1ccba4353ea33a616', class: {
                 'nv-accordion-item': true,
                 'is-open': this.open,
                 'is-disabled': this.disabled,
                 'is-animating': this.isAnimating,
-            }, role: "listitem", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '471cc5dc8ec8a3fff592b5b443a82270aea9a477', class: "nv-accordion-item__header", onClick: this.handleHeaderClick, "aria-controls": "content" }, h("slot", { key: 'dacf57578644d0ff3d6c5cf55c382c9c04a6fdf4', name: "header" }, h("div", { key: 'd0e23a45fd43046f4dcebcc9cece8c2650cdaf9e', class: "nv-accordion-item__header-content" }, this.itemtitle && (h("span", { key: '061068f7afa0d25d3273868d70d9f55c336d93d7', class: "nv-accordion-item__title" }, this.itemtitle)), this.subtitle && (h("span", { key: '1ba3c4754c95d6fbe97fb4111dba06543879e400', class: "nv-accordion-item__subtitle" }, this.subtitle)))), h("nv-iconbutton", { key: '834c4aa3111a8619f4c974e87899d0dfa6d14280', emphasis: "low", size: "sm", shape: "square", name: this.chevronIconName, tabindex: this.disabled ? -1 : 0, onClick: this.handleIconClick, onKeyDown: this.handleHeaderKeyDown, "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "content", "aria-label": this.open ? 'Fermer la section' : 'Ouvrir la section' })), h("div", { key: '79ba605179905a7a58a642a2c5d1f0bdf90d67ae', id: "content", class: "nv-accordion-item__content", "aria-hidden": !this.open ? 'true' : 'false', ref: el => (this.contentRef = el) }, h("div", { key: '6ca4b0d9acd5262a4a041ad9d59bbace5cc7850d', class: "nv-accordion-item__content-inner" }, h("slot", { key: '85c288666cf3b13abcd1ee1dbaced7ceb9ff9e6e', name: "content" })))));
+            }, role: "listitem", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: '258efe0502a39d963a9e75c16285ee9cbc65cb9f', class: "nv-accordion-item__header", onClick: this.handleHeaderClick, "aria-controls": "content" }, h("slot", { key: 'bb4dae743f06e3d41d1f7b8c17793b668df9347b', name: "header" }, h("div", { key: 'f3142a81c6be776d95ab9292101b889db6e35805', class: "nv-accordion-item__header-content" }, this.itemTitle && (h("span", { key: 'e897d8b4d414ba4e93b2853c152059579063335e', class: "nv-accordion-item__title" }, this.itemTitle)), this.subtitle && (h("span", { key: 'b8e03ceb1ca0e4c0b0fe24398f0e1c592ac077ab', class: "nv-accordion-item__subtitle" }, this.subtitle)))), h("nv-iconbutton", { key: '8d90711a96f5ce2e7d6f5ebcf3922cd0fedd69bd', emphasis: "low", size: "sm", shape: "square", name: this.chevronIconName, tabindex: this.disabled ? -1 : 0, onClick: this.handleIconClick, onKeyDown: this.handleHeaderKeyDown, "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "content", "aria-label": this.open ? 'Fermer la section' : 'Ouvrir la section' })), h("div", { key: '171b5165f3663fa5f0fa28ef84145dfc998e9f10', id: "content", class: "nv-accordion-item__content", "aria-hidden": !this.open ? 'true' : 'false', ref: el => (this.contentRef = el) }, h("div", { key: 'dcf753f23cec073a036d8137f1299dcf4ca4af78', class: "nv-accordion-item__content-inner" }, h("slot", { key: '3dc85def21aace19f3d211262b6cf66ccb9438fa', name: "content" })))));
     }
     static get is() { return "nv-accordion-item"; }
     static get originalStyleUrls() {
@@ -177,7 +177,7 @@ export class NvAccordionItem {
     }
     static get properties() {
         return {
-            "itemtitle": {
+            "itemTitle": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -193,7 +193,7 @@ export class NvAccordionItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "itemtitle",
+                "attribute": "item-title",
                 "reflect": true
             },
             "subtitle": {