@maggioli-design-system/mds-stepper-bar - npm Package Compare versions

Comparing version 5.7.3 to 6.0.0

dist/cjs/loader.cjs.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-51fc279a.js');
+const index = require('./index-4f2917b0.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
@@ -8,0 +8,0 @@

dist/cjs/mds-stepper-bar.cjs.entry.js

@@ -5,5 +5,5 @@ 'use strict';
 
-const index = require('./index-51fc279a.js');
+const index = require('./index-4f2917b0.js');
 
-const mdsStepperBarCss = "@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear=\"true\"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear=\"false\"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n.static{\n\n  position: static;\n}\n\n.fixed{\n\n  position: fixed;\n}\n\n.absolute{\n\n  position: absolute;\n}\n\n.relative{\n\n  position: relative;\n}\n\n.bottom-600{\n\n  bottom: 1.5rem;\n}\n\n.left-600{\n\n  left: 1.5rem;\n}\n\n.right-600{\n\n  right: 1.5rem;\n}\n\n.flex{\n\n  display: -ms-flexbox;\n\n  display: flex;\n}\n\n.contents{\n\n  display: contents;\n}\n\n.hidden{\n\n  display: none;\n}\n\n.min-h-8000{\n\n  min-height: 20rem;\n}\n\n.items-center{\n\n  -ms-flex-align: center;\n\n  align-items: center;\n}\n\n.justify-center{\n\n  -ms-flex-pack: center;\n\n  justify-content: center;\n}\n\n.rounded-lg{\n\n  border-radius: 0.5rem;\n}\n\n.border{\n\n  border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-sky-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-sky-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n\n  fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n\n  fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n\n  fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n\n  fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n\n  fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n\n  fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n\n  fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n\n  fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n\n  fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n\n  fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-sky-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-sky-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n\n  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n\n  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n\n  -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n";
+const mdsStepperBarCss = "@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear=\"true\"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear=\"false\"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n";
 const MdsStepperBarStyle0 = mdsStepperBarCss;
@@ -10,0 +10,0 @@

dist/cjs/mds-stepper-bar.cjs.js

@@ -5,7 +5,7 @@ 'use strict';
 
-const index = require('./index-51fc279a.js');
+const index = require('./index-4f2917b0.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 
 /*
- Stencil Client Patch Browser v4.21.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.22.2 | MIT Licensed | https://stenciljs.com
  */
@@ -12,0 +12,0 @@ var patchBrowser = () => {

dist/collection/collection-manifest.json

@@ -7,4 +7,4 @@ {
     "name": "@stencil/core",
-    "version": "4.21.0",
-    "typescriptVersion": "5.5.3"
+    "version": "4.22.2",
+    "typescriptVersion": "5.5.4"
   },
@@ -11,0 +11,0 @@ "collections": [],

dist/collection/common/locale.js

@@ -1,2 +0,2 @@
-import Handlebars from "handlebars";
+import { render } from "mustache";
 export class Locale {
@@ -8,4 +8,5 @@ constructor(configData) {
         };
-        this.lang = (element) => {
-            this.closestElement = element.closest('[lang]');
+        this.lang = (el) => {
+            this.element = el;
+            this.closestElement = this.element.closest('[lang]');
             if (this.closestElement) {
@@ -20,2 +21,14 @@ if (this.closestElement.lang) {
         };
+        this.update = (doc) => {
+            const context = doc !== null && doc !== void 0 ? doc : this.element.shadowRoot;
+            context && context.querySelectorAll('*').forEach(el => {
+                if (el.tagName.toLowerCase().startsWith('mds-')) {
+                    // eslint-disable-next-line no-restricted-syntax
+                    if (el && 'updateLang' in el) {
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                        el.updateLang();
+                    }
+                }
+            });
+        };
         this.pluralize = (tag, context) => {
@@ -43,4 +56,3 @@ const languagePhrase = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
             }
-            const template = Handlebars.compile(translatePhrase);
-            return template(context);
+            return render(translatePhrase, context);
         };
@@ -47,0 +59,0 @@ this.get = (tag, context) => {

dist/collection/dictionary/button.js

@@ -7,2 +7,3 @@ const buttonVariantDictionary = [
     'primary',
+    'secondary',
     'success',
@@ -9,0 +10,0 @@ 'warning',

dist/collection/dictionary/variant.js

@@ -73,2 +73,11 @@ const themeVariantDictionary = [
 ];
+const themeVariantChipDictionary = [
+    'primary',
+    'secondary',
+    'dark',
+    'error',
+    'info',
+    'success',
+    'warning',
+];
 const toneActionVariantDictionary = [
@@ -96,2 +105,2 @@ 'primary',
 ];
-export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, themeVariantChipDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };

dist/collection/type/variant-file-format.js

@@ -18,101 +18,67 @@ import baselineFolderZip from "@icon/mi/baseline/folder-zip.svg";
     archive: {
-        color: 'fill-label-amaranth-04 text-label-amaranth-04',
         icon: baselineFolderZip,
-        iconBackground: 'bg-label-amaranth-10',
         variant: 'amaranth',
     },
     attachment: {
-        color: 'fill-tone-neutral-04 text-tone-neutral-04',
         icon: baselineAttachFile,
-        iconBackground: 'bg-tone-neutral-10',
         variant: 'dark',
     },
     audio: {
-        color: 'fill-label-violet-04 text-label-violet-04',
         icon: baselineAudiotrack,
-        iconBackground: 'bg-label-violet-10',
         variant: 'violet',
     },
     code: {
-        color: 'fill-label-yellow-04 text-label-yellow-04',
         icon: baselineTerminal,
-        iconBackground: 'bg-label-yellow-10',
         variant: 'yellow',
     },
     data: {
-        color: 'fill-label-yellow-04 text-label-yellow-04',
         icon: mdiHardDisk,
-        iconBackground: 'bg-label-yellow-10',
         variant: 'yellow',
     },
     document: {
-        color: 'fill-label-orange-04 text-label-orange-04',
         icon: baselineInsertDriveFile,
-        iconBackground: 'bg-label-orange-10',
         variant: 'orange',
     },
     email: {
-        color: 'fill-label-blue-04 text-label-blue-04',
         icon: baselineEmail,
-        iconBackground: 'bg-label-blue-10',
         variant: 'blue',
     },
     executable: {
-        color: 'fill-label-amaranth-04 text-label-amaranth-04',
         icon: baselineWysiwyg,
-        iconBackground: 'bg-label-amaranth-10',
         variant: 'amaranth',
     },
     image: {
-        color: 'fill-label-green-04 text-label-green-04',
         icon: baselinePanorama,
-        iconBackground: 'bg-label-green-10',
         variant: 'green',
     },
     imageRaster: {
-        color: 'fill-label-green-04 text-label-green-04',
         icon: baselinePanorama,
-        iconBackground: 'bg-label-green-10',
         variant: 'green',
     },
     markup: {
-        color: 'fill-label-yellow-04 text-label-yellow-04',
         icon: baselineWeb,
-        iconBackground: 'bg-label-yellow-10',
         variant: 'yellow',
     },
     slide: {
-        color: 'fill-label-orchid-04 text-label-orchid-04',
         icon: baselineTV,
-        iconBackground: 'bg-label-orchid-10',
         variant: 'orchid',
     },
     spreadsheet: {
-        color: 'fill-label-lime-04 text-label-lime-04',
         icon: baselineBorderAll,
-        iconBackground: 'bg-label-lime-10',
         variant: 'lime',
     },
     text: {
-        color: 'fill-label-blue-04 text-label-blue-04',
         icon: baselineDescription,
-        iconBackground: 'bg-label-blue-10',
         variant: 'blue',
     },
     vectorImage: {
-        color: 'fill-label-aqua-04 text-label-aqua-04',
         icon: mdiVectorCurve,
-        iconBackground: 'bg-label-aqua-10',
         variant: 'aqua',
     },
     vector: {
-        color: 'fill-label-aqua-04 text-label-aqua-04',
         icon: mdiVectorCurve,
-        iconBackground: 'bg-label-aqua-10',
         variant: 'aqua',
     },
     video: {
-        color: 'fill-label-violet-04 text-label-violet-04',
         icon: baselineVideocam,
-        iconBackground: 'bg-label-violet-10',
         variant: 'violet',
@@ -119,0 +85,0 @@ },

dist/components/mds-stepper-bar.js

 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 
-const mdsStepperBarCss = "@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear=\"true\"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear=\"false\"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n.static{\n\n  position: static;\n}\n\n.fixed{\n\n  position: fixed;\n}\n\n.absolute{\n\n  position: absolute;\n}\n\n.relative{\n\n  position: relative;\n}\n\n.bottom-600{\n\n  bottom: 1.5rem;\n}\n\n.left-600{\n\n  left: 1.5rem;\n}\n\n.right-600{\n\n  right: 1.5rem;\n}\n\n.flex{\n\n  display: -ms-flexbox;\n\n  display: flex;\n}\n\n.contents{\n\n  display: contents;\n}\n\n.hidden{\n\n  display: none;\n}\n\n.min-h-8000{\n\n  min-height: 20rem;\n}\n\n.items-center{\n\n  -ms-flex-align: center;\n\n  align-items: center;\n}\n\n.justify-center{\n\n  -ms-flex-pack: center;\n\n  justify-content: center;\n}\n\n.rounded-lg{\n\n  border-radius: 0.5rem;\n}\n\n.border{\n\n  border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-sky-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-sky-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n\n  fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n\n  fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n\n  fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n\n  fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n\n  fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n\n  fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n\n  fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n\n  fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n\n  fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n\n  fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-sky-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-sky-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n\n  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n\n  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n\n  -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n";
+const mdsStepperBarCss = "@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear=\"true\"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear=\"false\"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n";
 const MdsStepperBarStyle0 = mdsStepperBarCss;
@@ -5,0 +5,0 @@

dist/documentation.json

 {
-  "timestamp": "2024-09-26T11:03:11",
+  "timestamp": "2024-11-25T16:15:48",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.21.0",
-    "typescriptVersion": "5.5.3"
+    "version": "4.22.2",
+    "typescriptVersion": "5.5.4"
   },
@@ -8,0 +8,0 @@ "components": [

dist/esm-es5/loader.js

@@ -1,1 +0,1 @@
-var __awaiter=this&&this.__awaiter||function(e,t,n,r){function i(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function a(e){try{s(r.next(e))}catch(e){o(e)}}function f(e){try{s(r["throw"](e))}catch(e){o(e)}}function s(e){e.done?n(e.value):i(e.value).then(a,f)}s((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,i,o,a;return a={next:f(0),throw:f(1),return:f(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function f(e){return function(t){return s([e,t])}}function s(f){if(r)throw new TypeError("Generator is already executing.");while(a&&(a=0,f[0]&&(n=0)),n)try{if(r=1,i&&(o=f[0]&2?i["return"]:f[0]?i["throw"]||((o=i["return"])&&o.call(i),0):i.next)&&!(o=o.call(i,f[1])).done)return o;if(i=0,o)f=[f[0]&2,o.value];switch(f[0]){case 0:case 1:o=f;break;case 4:n.label++;return{value:f[1],done:false};case 5:n.label++;i=f[1];f=[0];continue;case 7:f=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(f[0]===6||f[0]===2)){n=0;continue}if(f[0]===3&&(!o||f[1]>o[0]&&f[1]<o[3])){n.label=f[1];break}if(f[0]===6&&n.label<o[1]){n.label=o[1];o=f;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(f);break}if(o[2])n.ops.pop();n.trys.pop();continue}f=t.call(e,n)}catch(e){f=[6,e];i=0}finally{r=o=0}if(f[0]&5)throw f[1];return{value:f[0]?f[1]:void 0,done:true}}};import{b as bootstrapLazy}from"./index-cf7f20f4.js";export{s as setNonce}from"./index-cf7f20f4.js";import{g as globalScripts}from"./app-globals-0f993ce5.js";var defineCustomElements=function(e,t){return __awaiter(void 0,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:if(typeof window==="undefined")return[2,undefined];return[4,globalScripts()];case 1:e.sent();return[2,bootstrapLazy([["mds-stepper-bar",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],t)]}}))}))};export{defineCustomElements};
+var __awaiter=this&&this.__awaiter||function(e,t,n,r){function i(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function a(e){try{u(r.next(e))}catch(e){o(e)}}function s(e){try{u(r["throw"](e))}catch(e){o(e)}}function u(e){e.done?n(e.value):i(e.value).then(a,s)}u((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,i,o,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return u([e,t])}}function u(s){if(r)throw new TypeError("Generator is already executing.");while(a&&(a=0,s[0]&&(n=0)),n)try{if(r=1,i&&(o=s[0]&2?i["return"]:s[0]?i["throw"]||((o=i["return"])&&o.call(i),0):i.next)&&!(o=o.call(i,s[1])).done)return o;if(i=0,o)s=[s[0]&2,o.value];switch(s[0]){case 0:case 1:o=s;break;case 4:n.label++;return{value:s[1],done:false};case 5:n.label++;i=s[1];s=[0];continue;case 7:s=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(s[0]===6||s[0]===2)){n=0;continue}if(s[0]===3&&(!o||s[1]>o[0]&&s[1]<o[3])){n.label=s[1];break}if(s[0]===6&&n.label<o[1]){n.label=o[1];o=s;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(s);break}if(o[2])n.ops.pop();n.trys.pop();continue}s=t.call(e,n)}catch(e){s=[6,e];i=0}finally{r=o=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};import{b as bootstrapLazy}from"./index-894aedf1.js";export{s as setNonce}from"./index-894aedf1.js";import{g as globalScripts}from"./app-globals-0f993ce5.js";var defineCustomElements=function(e,t){return __awaiter(void 0,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:if(typeof window==="undefined")return[2,undefined];return[4,globalScripts()];case 1:e.sent();return[2,bootstrapLazy([["mds-stepper-bar",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],t)]}}))}))};export{defineCustomElements};

dist/esm-es5/mds-stepper-bar.entry.js

@@ -1,1 +0,1 @@
-import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-cf7f20f4.js";var mdsStepperBarCss='@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear="true"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear="false"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n.static{\n\n  position: static;\n}\n\n.fixed{\n\n  position: fixed;\n}\n\n.absolute{\n\n  position: absolute;\n}\n\n.relative{\n\n  position: relative;\n}\n\n.bottom-600{\n\n  bottom: 1.5rem;\n}\n\n.left-600{\n\n  left: 1.5rem;\n}\n\n.right-600{\n\n  right: 1.5rem;\n}\n\n.flex{\n\n  display: -ms-flexbox;\n\n  display: flex;\n}\n\n.contents{\n\n  display: contents;\n}\n\n.hidden{\n\n  display: none;\n}\n\n.min-h-8000{\n\n  min-height: 20rem;\n}\n\n.items-center{\n\n  -ms-flex-align: center;\n\n  align-items: center;\n}\n\n.justify-center{\n\n  -ms-flex-pack: center;\n\n  justify-content: center;\n}\n\n.rounded-lg{\n\n  border-radius: 0.5rem;\n}\n\n.border{\n\n  border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-sky-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-sky-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n\n  fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n\n  fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n\n  fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n\n  fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n\n  fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n\n  fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n\n  fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n\n  fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n\n  fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n\n  fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-sky-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-sky-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n\n  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n\n  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n\n  -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n';var MdsStepperBarStyle0=mdsStepperBarCss;var MdsStepperBar=function(){function n(n){var t=this;registerInstance(this,n);this.changedEvent=createEvent(this,"mdsStepperBarChange",7);this.queryItems=function(){return t.element.querySelectorAll("mds-stepper-bar-item")};this.queryContentItems=function(){return t.element.querySelectorAll("[slot=content]")};this.minmax=function(n,t,e){return Math.min(Math.max(n,t),e)};this.setCurrent=function(n){t.items=t.queryItems();t.currentItem=n-1;var e=new Array;t.items.forEach((function(n,a){n.done=false;if(a<t.currentItem){n.done=true;if(n.value){e.push(n.value)}}n.current=false;if(a===t.currentItem){n.current=true;t.currentItem=a}}));t.changedEvent.emit({value:e.toString(),step:t.currentItem});t.scrollItems();t.setCurrentContent()};this.setCurrentContent=function(){t.contentItems.forEach((function(n,e){n.classList.add("hidden");if(e===t.currentItem){n.classList.remove("hidden")}}))};this.scrollItems=function(){var n;var e=(n=t.element.shadowRoot)===null||n===void 0?void 0:n.querySelector(".items");var a=t.queryItems();var r=t.minmax(t.currentItem,0,t.items.length-1);if(!e)throw Error("No mds-stepper-bar-items found");if(r<=0){e.scrollLeft=0;return}if(r>=a.length){var l=a[a.length-1];e.scrollLeft=l.offsetLeft-e.offsetLeft;return}var o=a[r];e.scrollLeft=o.offsetLeft-e.offsetLeft-e.offsetWidth/2+o.offsetWidth/2};this.currentItem=0;this.itemsDone=1}n.prototype.componentWillLoad=function(){this.items=this.queryItems();this.items.forEach((function(n,t){n.id="mds-stepper-bar-item-".concat(t)}))};n.prototype.componentDidLoad=function(){this.contentItems=this.queryContentItems();this.setCurrent(this.itemsDone)};n.prototype.itemDone=function(n){this.setCurrent(n)};n.prototype.changeEventHandler=function(n){var t=this;this.items=this.queryItems();this.items.forEach((function(e,a){e.done=false;if("mds-stepper-bar-item-".concat(a)===n.detail){e.current=true;t.currentItem=a}}))};n.prototype.render=function(){return h(Host,{key:"8d1259a594c1061617a0b6da6ce4ed8f90d2a5f2"},h("div",{key:"fe55f909a7563bc731a43e82272a4208b58a00a9",class:"items"},h("slot",{key:"982ffaded2a3654eeb79013062fcaeff7786e7b8"})),h("div",{key:"d37d15f629a84bcee4b92dc8380836a2e2e8342b",class:"contents",part:"contents"},h("slot",{key:"3a4fd9a91c82021dd1e4ea80eeb1842afc212fa8",name:"content"})))};Object.defineProperty(n.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{itemsDone:["itemDone"]}},enumerable:false,configurable:true});return n}();MdsStepperBar.style=MdsStepperBarStyle0;export{MdsStepperBar as mds_stepper_bar};
+import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-894aedf1.js";var mdsStepperBarCss='@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear="true"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear="false"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n';var MdsStepperBarStyle0=mdsStepperBarCss;var MdsStepperBar=function(){function n(n){var t=this;registerInstance(this,n);this.changedEvent=createEvent(this,"mdsStepperBarChange",7);this.queryItems=function(){return t.element.querySelectorAll("mds-stepper-bar-item")};this.queryContentItems=function(){return t.element.querySelectorAll("[slot=content]")};this.minmax=function(n,t,e){return Math.min(Math.max(n,t),e)};this.setCurrent=function(n){t.items=t.queryItems();t.currentItem=n-1;var e=new Array;t.items.forEach((function(n,i){n.done=false;if(i<t.currentItem){n.done=true;if(n.value){e.push(n.value)}}n.current=false;if(i===t.currentItem){n.current=true;t.currentItem=i}}));t.changedEvent.emit({value:e.toString(),step:t.currentItem});t.scrollItems();t.setCurrentContent()};this.setCurrentContent=function(){t.contentItems.forEach((function(n,e){n.classList.add("hidden");if(e===t.currentItem){n.classList.remove("hidden")}}))};this.scrollItems=function(){var n;var e=(n=t.element.shadowRoot)===null||n===void 0?void 0:n.querySelector(".items");var i=t.queryItems();var s=t.minmax(t.currentItem,0,t.items.length-1);if(!e)throw Error("No mds-stepper-bar-items found");if(s<=0){e.scrollLeft=0;return}if(s>=i.length){var r=i[i.length-1];e.scrollLeft=r.offsetLeft-e.offsetLeft;return}var a=i[s];e.scrollLeft=a.offsetLeft-e.offsetLeft-e.offsetWidth/2+a.offsetWidth/2};this.currentItem=0;this.itemsDone=1}n.prototype.componentWillLoad=function(){this.items=this.queryItems();this.items.forEach((function(n,t){n.id="mds-stepper-bar-item-".concat(t)}))};n.prototype.componentDidLoad=function(){this.contentItems=this.queryContentItems();this.setCurrent(this.itemsDone)};n.prototype.itemDone=function(n){this.setCurrent(n)};n.prototype.changeEventHandler=function(n){var t=this;this.items=this.queryItems();this.items.forEach((function(e,i){e.done=false;if("mds-stepper-bar-item-".concat(i)===n.detail){e.current=true;t.currentItem=i}}))};n.prototype.render=function(){return h(Host,{key:"8d1259a594c1061617a0b6da6ce4ed8f90d2a5f2"},h("div",{key:"fe55f909a7563bc731a43e82272a4208b58a00a9",class:"items"},h("slot",{key:"982ffaded2a3654eeb79013062fcaeff7786e7b8"})),h("div",{key:"d37d15f629a84bcee4b92dc8380836a2e2e8342b",class:"contents",part:"contents"},h("slot",{key:"3a4fd9a91c82021dd1e4ea80eeb1842afc212fa8",name:"content"})))};Object.defineProperty(n.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{itemsDone:["itemDone"]}},enumerable:false,configurable:true});return n}();MdsStepperBar.style=MdsStepperBarStyle0;export{MdsStepperBar as mds_stepper_bar};

dist/esm-es5/mds-stepper-bar.js

@@ -1,1 +0,1 @@
-var __awaiter=this&&this.__awaiter||function(e,t,r,n){function o(e){return e instanceof r?e:new r((function(t){t(e)}))}return new(r||(r=Promise))((function(r,i){function a(e){try{c(n.next(e))}catch(e){i(e)}}function s(e){try{c(n["throw"](e))}catch(e){i(e)}}function c(e){e.done?r(e.value):o(e.value).then(a,s)}c((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var r={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},n,o,i,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return c([e,t])}}function c(s){if(n)throw new TypeError("Generator is already executing.");while(a&&(a=0,s[0]&&(r=0)),r)try{if(n=1,o&&(i=s[0]&2?o["return"]:s[0]?o["throw"]||((i=o["return"])&&i.call(o),0):o.next)&&!(i=i.call(o,s[1])).done)return i;if(o=0,i)s=[s[0]&2,i.value];switch(s[0]){case 0:case 1:i=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;o=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(i=r.trys,i=i.length>0&&i[i.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!i||s[1]>i[0]&&s[1]<i[3])){r.label=s[1];break}if(s[0]===6&&r.label<i[1]){r.label=i[1];i=s;break}if(i&&r.label<i[2]){r.label=i[2];r.ops.push(s);break}if(i[2])r.ops.pop();r.trys.pop();continue}s=t.call(e,r)}catch(e){s=[6,e];o=0}finally{n=i=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};import{p as promiseResolve,b as bootstrapLazy}from"./index-cf7f20f4.js";export{s as setNonce}from"./index-cf7f20f4.js";import{g as globalScripts}from"./app-globals-0f993ce5.js";var patchBrowser=function(){var e=import.meta.url;var t={};if(e!==""){t.resourcesUrl=new URL(".",e).href}return promiseResolve(t)};patchBrowser().then((function(e){return __awaiter(void 0,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,globalScripts()];case 1:t.sent();return[2,bootstrapLazy([["mds-stepper-bar",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],e)]}}))}))}));
+var __awaiter=this&&this.__awaiter||function(e,t,r,n){function o(e){return e instanceof r?e:new r((function(t){t(e)}))}return new(r||(r=Promise))((function(r,i){function a(e){try{c(n.next(e))}catch(e){i(e)}}function s(e){try{c(n["throw"](e))}catch(e){i(e)}}function c(e){e.done?r(e.value):o(e.value).then(a,s)}c((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var r={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},n,o,i,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return c([e,t])}}function c(s){if(n)throw new TypeError("Generator is already executing.");while(a&&(a=0,s[0]&&(r=0)),r)try{if(n=1,o&&(i=s[0]&2?o["return"]:s[0]?o["throw"]||((i=o["return"])&&i.call(o),0):o.next)&&!(i=i.call(o,s[1])).done)return i;if(o=0,i)s=[s[0]&2,i.value];switch(s[0]){case 0:case 1:i=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;o=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(i=r.trys,i=i.length>0&&i[i.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!i||s[1]>i[0]&&s[1]<i[3])){r.label=s[1];break}if(s[0]===6&&r.label<i[1]){r.label=i[1];i=s;break}if(i&&r.label<i[2]){r.label=i[2];r.ops.push(s);break}if(i[2])r.ops.pop();r.trys.pop();continue}s=t.call(e,r)}catch(e){s=[6,e];o=0}finally{n=i=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};import{p as promiseResolve,b as bootstrapLazy}from"./index-894aedf1.js";export{s as setNonce}from"./index-894aedf1.js";import{g as globalScripts}from"./app-globals-0f993ce5.js";var patchBrowser=function(){var e=import.meta.url;var t={};if(e!==""){t.resourcesUrl=new URL(".",e).href}return promiseResolve(t)};patchBrowser().then((function(e){return __awaiter(void 0,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,globalScripts()];case 1:t.sent();return[2,bootstrapLazy([["mds-stepper-bar",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],e)]}}))}))}));

dist/esm/loader.js

@@ -1,3 +0,3 @@
-import { b as bootstrapLazy } from './index-cf7f20f4.js';
-export { s as setNonce } from './index-cf7f20f4.js';
+import { b as bootstrapLazy } from './index-894aedf1.js';
+export { s as setNonce } from './index-894aedf1.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
@@ -4,0 +4,0 @@

dist/esm/mds-stepper-bar.entry.js

@@ -1,4 +0,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-cf7f20f4.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-894aedf1.js';
 
-const mdsStepperBarCss = "@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear=\"true\"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear=\"false\"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n.static{\n\n  position: static;\n}\n\n.fixed{\n\n  position: fixed;\n}\n\n.absolute{\n\n  position: absolute;\n}\n\n.relative{\n\n  position: relative;\n}\n\n.bottom-600{\n\n  bottom: 1.5rem;\n}\n\n.left-600{\n\n  left: 1.5rem;\n}\n\n.right-600{\n\n  right: 1.5rem;\n}\n\n.flex{\n\n  display: -ms-flexbox;\n\n  display: flex;\n}\n\n.contents{\n\n  display: contents;\n}\n\n.hidden{\n\n  display: none;\n}\n\n.min-h-8000{\n\n  min-height: 20rem;\n}\n\n.items-center{\n\n  -ms-flex-align: center;\n\n  align-items: center;\n}\n\n.justify-center{\n\n  -ms-flex-pack: center;\n\n  justify-content: center;\n}\n\n.rounded-lg{\n\n  border-radius: 0.5rem;\n}\n\n.border{\n\n  border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-sky-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-sky-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n\n  --tw-bg-opacity: 1;\n\n  background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n\n  fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n\n  fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n\n  fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n\n  fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n\n  fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n\n  fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n\n  fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n\n  fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n\n  fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n\n  fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-sky-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-sky-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n\n  --tw-text-opacity: 1;\n\n  color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n\n  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n\n  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n\n  -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n";
+const mdsStepperBarCss = "@tailwind utilities;\n\n:host{\n\n  gap: 1.5rem;\n\n  display: grid;\n  position: relative;\n}\n\n.items{\n\n  z-index: 10;\n\n  width: 100%;\n\n  gap: 0rem;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-positive: 1;\n  flex-grow: 1;\n  overflow: auto;\n  position: relative;\n  scroll-behavior: smooth;\n  -webkit-scroll-snap-type: x mandatory;\n  -ms-scroll-snap-type: x mandatory;\n  scroll-snap-type: x mandatory;\n}\n\n:host( [linear=\"true\"] ) ::slotted( mds-stepper-bar-item ),\n:host( [linear] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: none;\n}\n\n:host( [linear=\"false\"] ) ::slotted( mds-stepper-bar-item ) {\n  pointer-events: auto;\n}\n\n\n.contents{\n\n  width: 100%;\n\n  opacity: 0;\n\n  -webkit-transition-property: opacity;\n\n  transition-property: opacity;\n\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -webkit-transition-duration: 150ms;\n\n  transition-duration: 150ms;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -ms-flex-direction: column;\n  flex-direction: column;\n}\n\n:host( [hydrated] ) .contents {\n  opacity: 1;\n}\n\n@container style(--magma-pref-animation: reduce) {\n  .contents,\n  .items {\n    scroll-behavior: unset;\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n@container style(--magma-pref-animation: system) {\n\n  @media (prefers-reduced-motion) {\n    .contents,\n    .items {\n      scroll-behavior: unset;\n      -webkit-transition-duration: 0s;\n      transition-duration: 0s;\n    }\n  }\n}\n\n";
 const MdsStepperBarStyle0 = mdsStepperBarCss;
@@ -5,0 +5,0 @@

dist/esm/mds-stepper-bar.js

@@ -1,7 +0,7 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-cf7f20f4.js';
-export { s as setNonce } from './index-cf7f20f4.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-894aedf1.js';
+export { s as setNonce } from './index-894aedf1.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 /*
- Stencil Client Patch Browser v4.21.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.22.2 | MIT Licensed | https://stenciljs.com
  */
@@ -8,0 +8,0 @@ var patchBrowser = () => {

dist/mds-stepper-bar/mds-stepper-bar.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as t}from"./p-40f1944f.js";export{s as setNonce}from"./p-40f1944f.js";import{g as r}from"./p-e1255160.js";(()=>{const t=import.meta.url,s={};return""!==t&&(s.resourcesUrl=new URL(".",t).href),e(s)})().then((async e=>(await r(),t([["p-7cf8213a",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],e))));
+import{p as e,b as t}from"./p-59e6a2e4.js";export{s as setNonce}from"./p-59e6a2e4.js";import{g as r}from"./p-e1255160.js";(()=>{const t=import.meta.url,s={};return""!==t&&(s.resourcesUrl=new URL(".",t).href),e(s)})().then((async e=>(await r(),t([["p-1ae5d1bd",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],e))));

dist/stats.json

 {
-  "timestamp": "2024-09-26T11:03:11",
+  "timestamp": "2024-11-25T16:15:48",
   "compiler": {
     "name": "node",
-    "version": "20.10.0"
+    "version": "22.11.0"
   },
@@ -12,7 +12,7 @@ "app": {
     "entries": 1,
-    "bundles": 93,
+    "bundles": 92,
     "outputs": [
       {
         "name": "dist-collection",
-        "files": 45,
+        "files": 44,
         "generatedFiles": [
@@ -49,3 +49,2 @@ "./dist/collection/common/aria.js",
           "./dist/collection/fixtures/filenames.js",
-          "./dist/collection/interface/input-value.js",
           "./dist/collection/type/autocomplete.js",
@@ -57,4 +56,4 @@ "./dist/collection/type/button.js",
           "./dist/collection/type/form-rel.js",
+          "./dist/collection/type/header-bar.js",
           "./dist/collection/type/input.js",
-          "./dist/collection/type/language.js",
           "./dist/collection/type/loading.js",
@@ -83,3 +82,3 @@ "./dist/collection/type/preference.js",
           "./dist/cjs/app-globals-3a1e7e63.js",
-          "./dist/cjs/index-51fc279a.js",
+          "./dist/cjs/index-4f2917b0.js",
           "./dist/cjs/index.cjs.js",
@@ -90,3 +89,3 @@ "./dist/cjs/loader.cjs.js",
           "./dist/esm-es5/app-globals-0f993ce5.js",
-          "./dist/esm-es5/index-cf7f20f4.js",
+          "./dist/esm-es5/index-894aedf1.js",
           "./dist/esm-es5/index.js",
@@ -97,3 +96,3 @@ "./dist/esm-es5/loader.js",
           "./dist/esm/app-globals-0f993ce5.js",
-          "./dist/esm/index-cf7f20f4.js",
+          "./dist/esm/index-894aedf1.js",
           "./dist/esm/index.js",
@@ -108,9 +107,9 @@ "./dist/esm/loader.js",
           "./dist/mds-stepper-bar/mds-stepper-bar.js",
-          "./dist/mds-stepper-bar/p-4013927b.system.js",
-          "./dist/mds-stepper-bar/p-40f1944f.js",
-          "./dist/mds-stepper-bar/p-4a45ce16.system.entry.js",
+          "./dist/mds-stepper-bar/p-0761c60f.system.js",
+          "./dist/mds-stepper-bar/p-1ae5d1bd.entry.js",
           "./dist/mds-stepper-bar/p-50ea2036.system.js",
           "./dist/mds-stepper-bar/p-56ba5cbf.system.js",
-          "./dist/mds-stepper-bar/p-7cf8213a.entry.js",
-          "./dist/mds-stepper-bar/p-a5ad4788.system.js",
+          "./dist/mds-stepper-bar/p-59e6a2e4.js",
+          "./dist/mds-stepper-bar/p-62028295.system.js",
+          "./dist/mds-stepper-bar/p-e0a2f60b.system.entry.js",
           "./dist/mds-stepper-bar/p-e1255160.js",
@@ -120,9 +119,9 @@ "./www/build/index.esm.js",
           "./www/build/mds-stepper-bar.js",
-          "./www/build/p-4013927b.system.js",
-          "./www/build/p-40f1944f.js",
-          "./www/build/p-4a45ce16.system.entry.js",
+          "./www/build/p-0761c60f.system.js",
+          "./www/build/p-1ae5d1bd.entry.js",
           "./www/build/p-50ea2036.system.js",
           "./www/build/p-56ba5cbf.system.js",
-          "./www/build/p-7cf8213a.entry.js",
-          "./www/build/p-a5ad4788.system.js",
+          "./www/build/p-59e6a2e4.js",
+          "./www/build/p-62028295.system.js",
+          "./www/build/p-e0a2f60b.system.entry.js",
           "./www/build/p-e1255160.js"
@@ -161,8 +160,8 @@ ]
         ],
-        "bundleId": "p-7cf8213a",
-        "fileName": "p-7cf8213a.entry.js",
+        "bundleId": "p-1ae5d1bd",
+        "fileName": "p-1ae5d1bd.entry.js",
         "imports": [
-          "p-40f1944f.js"
+          "p-59e6a2e4.js"
         ],
-        "originalByteSize": 10389
+        "originalByteSize": 5883
       }
@@ -179,5 +178,5 @@ ],
         "imports": [
-          "index-cf7f20f4.js"
+          "index-894aedf1.js"
         ],
-        "originalByteSize": 10393
+        "originalByteSize": 5887
       }
@@ -194,5 +193,5 @@ ],
         "imports": [
-          "index-cf7f20f4.js"
+          "index-894aedf1.js"
         ],
-        "originalByteSize": 10393
+        "originalByteSize": 5887
       }
@@ -206,8 +205,8 @@ ],
         ],
-        "bundleId": "p-4a45ce16.system",
-        "fileName": "p-4a45ce16.system.entry.js",
+        "bundleId": "p-e0a2f60b.system",
+        "fileName": "p-e0a2f60b.system.entry.js",
         "imports": [
-          "p-a5ad4788.system.js"
+          "p-62028295.system.js"
         ],
-        "originalByteSize": 11207
+        "originalByteSize": 6701
       }
@@ -224,5 +223,5 @@ ],
         "imports": [
-          "index-51fc279a.js"
+          "index-4f2917b0.js"
         ],
-        "originalByteSize": 10458
+        "originalByteSize": 5952
       }
@@ -511,3 +510,3 @@ ]
     "sc-mds-stepper-bar": [
-      "p-40f1944f.js"
+      "p-59e6a2e4.js"
     ]
@@ -558,3 +557,2 @@ },
     "./src/fixtures/filenames.ts": [],
-    "./src/interface/input-value.ts": [],
     "./src/type/autocomplete.ts": [],
@@ -566,4 +564,4 @@ "./src/type/button.ts": [],
     "./src/type/form-rel.ts": [],
+    "./src/type/header-bar.ts": [],
     "./src/type/input.ts": [],
-    "./src/type/language.ts": [],
     "./src/type/loading.ts": [],
@@ -570,0 +568,0 @@ "./src/type/preference.ts": [],

dist/types/common/date.d.ts

@@ -1,4 +0,4 @@
-import { ISO8601Date } from '@type/date';
+import { ISO8601Date } from "../type/date";
 declare const isISO8601Date: (dateString: string) => boolean;
 declare const sanitizeISO8601Date: (dateString: string) => ISO8601Date;
 export { sanitizeISO8601Date, isISO8601Date, };

dist/types/common/file.d.ts

@@ -1,7 +0,6 @@
-import { ExtensionInfo } from '@dictionary/file-extensions';
+import { ExtensionInfo } from "../dictionary/file-extensions";
+import { ThemeFullVariantType } from "../type/variant";
 interface FileFormatsVariants {
-    color: string;
     icon: string;
-    iconBackground: string;
-    variant: string;
+    variant: ThemeFullVariantType;
 }
@@ -8,0 +7,0 @@ declare const getName: (rawFilename: string) => string;

dist/types/common/locale.d.ts

@@ -12,5 +12,7 @@ type LocaleConfig = {
     closestElement: HTMLElement;
+    element: HTMLElement;
     constructor(configData?: LocaleConfig);
     set: (configData: LocaleConfig) => void;
-    lang: (element: HTMLElement) => string;
+    lang: (el: HTMLElement) => string;
+    update: (doc?: Document | ShadowRoot) => void;
     private pluralize;
@@ -17,0 +19,0 @@ get: (tag: string | string[], context?: Record<string, string | number>) => string;

dist/types/dictionary/file-extensions.d.ts

@@ -0,1 +1,2 @@
+import { FileFormat } from "../type/variant-file-format";
 interface FileExtenstion {
@@ -6,3 +7,3 @@ [key: string]: ExtensionInfo;
     preview?: boolean;
-    format: string;
+    format: FileFormat;
     description: string;
@@ -9,0 +10,0 @@ }

dist/types/dictionary/variant.d.ts

@@ -8,2 +8,3 @@ declare const themeVariantDictionary: string[];
 declare const toneVariantDictionary: string[];
+declare const themeVariantChipDictionary: string[];
 declare const toneActionVariantDictionary: string[];
@@ -13,2 +14,2 @@ declare const toneSimpleVariantDictionary: string[];
 declare const toneMinimalVariantDictionary: string[];
-export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, themeVariantChipDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };

dist/types/type/autocomplete.d.ts

@@ -1,2 +0,2 @@
-export type AutocompleteType = 'additional-name' | 'address' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'bday' | 'bday-day' | 'bday-month' | 'bday-year' | 'cc-additional-name' | 'cc-csc' | 'cc-exp' | 'cc-exp-month' | 'cc-exp-year' | 'cc-family-name' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-number' | 'cc-type' | 'country' | 'country-name' | 'current-password' | 'email' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'impp' | 'language' | 'name' | 'new-password' | 'nickname' | 'off' | 'on' | 'one-time-code' | 'organization' | 'organization-title' | 'photo' | 'postal-code' | 'sex' | 'street-address' | 'tel' | 'tel-area-code' | 'tel-country-code' | 'tel-extension' | 'tel-local' | 'tel-national' | 'transaction-amount' | 'transaction-currency' | 'url' | 'username';
+export type AutocompleteType = 'additional-name' | 'address' | 'address-level1' | 'address-level2' | 'address-level3' | 'address-level4' | 'address-line1' | 'address-line2' | 'address-line3' | 'bday' | 'bday-day' | 'bday-month' | 'bday-year' | 'cc-additional-name' | 'cc-csc' | 'cc-exp' | 'cc-exp-month' | 'cc-exp-year' | 'cc-family-name' | 'cc-given-name' | 'cc-name' | 'cc-number' | 'cc-type' | 'country' | 'country-name' | 'current-password' | 'email' | 'family-name' | 'given-name' | 'honorific-prefix' | 'honorific-suffix' | 'impp' | 'language' | 'name' | 'new-password' | 'nickname' | 'off' | 'on' | 'one-time-code' | 'organization' | 'organization-title' | 'photo' | 'postal-code' | 'sex' | 'street-address' | 'tel' | 'tel-area-code' | 'tel-country-code' | 'tel-extension' | 'tel-local' | 'tel-national' | 'transaction-amount' | 'transaction-currency' | 'url' | 'username';
 export type InputTextType = 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'textarea' | 'time' | 'url';

dist/types/type/button.d.ts

@@ -5,2 +5,2 @@ export type ButtonType = 'a' | 'button' | 'reset' | 'submit';
 export type ButtonIconPositionType = 'left' | 'right';
-export type ButtonVariantType = 'primary' | 'dark' | 'light' | 'error' | 'info' | 'success' | 'warning';
+export type ButtonVariantType = 'primary' | 'secondary' | 'dark' | 'light' | 'error' | 'info' | 'success' | 'warning';

dist/types/type/input.d.ts

@@ -5,1 +5,4 @@ export type InputControlsLayoutType = 'horizontal' | 'vertical';
 export type InputTextType = 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'textarea' | 'time' | 'url';
+export interface MdsInputEventDetail {
+    value?: File | string | FormData | null;
+}

dist/types/type/variant-file-format.d.ts

@@ -0,6 +1,6 @@
+import { ThemeFullVariantType } from "./variant";
+type FileFormat = 'archive' | 'attachment' | 'audio' | 'code' | 'data' | 'document' | 'email' | 'executable' | 'image' | 'markup' | 'slide' | 'spreadsheet' | 'text' | 'vector' | 'video';
 interface FileFormatVariant {
-    color: string;
     icon: string;
-    iconBackground: string;
-    variant: string;
+    variant: ThemeFullVariantType;
 }
@@ -11,2 +11,2 @@ interface FileFormatVariants {
 declare const fileFormatsVariant: FileFormatVariants;
-export { fileFormatsVariant, FileFormatVariant, FileFormatVariants, };
+export { fileFormatsVariant, FileFormat, FileFormatVariant, FileFormatVariants, };

dist/types/type/variant.d.ts

@@ -8,6 +8,7 @@ export type ThemeStatusVariantType = 'error' | 'info' | 'success' | 'warning';
 export type ActionVariantType = 'primary' | 'dark' | 'light';
+export type ChipVariantType = 'primary' | 'secondary' | 'dark' | 'error' | 'info' | 'success' | 'warning';
 export type StateVariantType = 'disabled' | 'focused' | 'readonly';
-export type ToneActionVariantType = 'primary' | 'secondary' | 'tertiary' | 'strong' | 'weak' | 'ghost' | 'quiet';
+export type ToneActionVariantType = 'primary' | 'secondary' | 'strong' | 'weak' | 'ghost' | 'quiet';
 export type ToneVariantType = 'strong' | 'weak' | 'ghost' | 'quiet';
 export type ToneSimpleVariantType = 'quiet' | 'strong' | 'weak';
 export type ToneMinimalVariantType = 'strong' | 'weak';

documentation.json

 {
-  "timestamp": "2024-09-26T07:00:37",
+  "timestamp": "2024-11-25T16:00:58",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.21.0",
-    "typescriptVersion": "5.5.3"
+    "version": "4.22.2",
+    "typescriptVersion": "5.5.4"
   },
@@ -13,4 +13,4 @@ "components": [
       "tag": "mds-stepper-bar",
-      "readme": "# mds-stepper-bar\n\n\n\nThis is a web-component from Maggioli Design System [Magma](https://magma.maggiolicloud.it), built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.\n",
-      "docs": "This is a web-component from Maggioli Design System [Magma](https://magma.maggiolicloud.it), built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.",
+      "readme": "# mds-stepper-bar\n\n\n\nThis is a web-component from Maggioli Design System [Magma](https://magma.maggiolicloud.it), built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.\n",
+      "docs": "This is a web-component from Maggioli Design System [Magma](https://magma.maggiolicloud.it), built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.",
       "docsTags": [
@@ -119,2 +119,7 @@ {
     },
+    "src/components/mds-accordion-timer/meta/event-detail.ts::MdsAccordionTimerEventDetail": {
+      "declaration": "export interface MdsAccordionTimerEventDetail {\n  index: number;\n}",
+      "docstring": "",
+      "path": "src/components/mds-accordion-timer/meta/event-detail.ts"
+    },
     "src/components/mds-accordion-timer-item/meta/event-detail.ts::MdsAccordionTimerItemEventDetail": {
@@ -206,3 +211,3 @@ "declaration": "export interface MdsAccordionTimerItemEventDetail {\n  selected: boolean;\n  uuid: number;\n}",
     "src/type/button.ts::ButtonVariantType": {
-      "declaration": "export type ButtonVariantType =\n  | 'primary'\n  | 'dark'\n  | 'light'\n  | 'error'\n  | 'info'\n  | 'success'\n  | 'warning'",
+      "declaration": "export type ButtonVariantType =\n  | 'primary'\n  | 'secondary'\n  | 'dark'\n  | 'light'\n  | 'error'\n  | 'info'\n  | 'success'\n  | 'warning'",
       "docstring": "",
@@ -221,2 +226,7 @@ "path": "src/type/button.ts"
     },
+    "src/type/variant.ts::ChipVariantType": {
+      "declaration": "export type ChipVariantType =\n  | 'primary'\n  | 'secondary'\n  | 'dark'\n  | 'error'\n  | 'info'\n  | 'success'\n  | 'warning'",
+      "docstring": "",
+      "path": "src/type/variant.ts"
+    },
     "src/components/mds-chip/meta/interface.ts::MdsChipEvent": {
@@ -263,3 +273,3 @@ "declaration": "interface MdsChipEvent {\n  event: Event\n  element: HTMLMdsChipElement\n}",
     "src/components/mds-file-preview/meta/event-detail.ts::MdsFilePreviewEventDetail": {
-      "declaration": "export interface MdsFilePreviewEventDetail {\n  extension: string\n  filename: string\n  target: HTMLMdsFileElement\n}",
+      "declaration": "export interface MdsFilePreviewEventDetail {\n  extension: string\n  filename: string\n  target: HTMLMdsFilePreviewElement\n}",
       "docstring": "",
@@ -278,7 +288,12 @@ "path": "src/components/mds-file-preview/meta/event-detail.ts"
     },
-    "src/components/mds-header-bar/meta/types.ts::MenuType": {
-      "declaration": "export type MenuType =\n  | 'all'\n  | 'desktop'\n  | 'mobile'\n  | 'none'",
+    "src/type/header-bar.ts::HeaderBarMenuType": {
+      "declaration": "export type HeaderBarMenuType =\n  | 'all'\n  | 'desktop'\n  | 'mobile'\n  | 'none'",
       "docstring": "",
-      "path": "src/components/mds-header-bar/meta/types.ts"
+      "path": "src/type/header-bar.ts"
     },
+    "src/type/header-bar.ts::HeaderBarNavType": {
+      "declaration": "export type HeaderBarNavType =\n  | 'all'\n  | 'desktop'\n  | 'mobile'\n  | 'none'",
+      "docstring": "",
+      "path": "src/type/header-bar.ts"
+    },
     "src/components/mds-header/meta/event-detail.ts::MdsHeaderEventDetail": {
@@ -320,3 +335,3 @@ "declaration": "export interface MdsHeaderEventDetail {\n  bar: HTMLMdsHeaderBarElement\n}",
     "src/type/autocomplete.ts::AutocompleteType": {
-      "declaration": "export type AutocompleteType =\n  | 'additional-name'\n  | 'address'\n  | 'address-level1'\n  | 'address-level2'\n  | 'address-level3'\n  | 'address-level4'\n  | 'address-line1'\n  | 'address-line2'\n  | 'address-line3'\n  | 'bday'\n  | 'bday-day'\n  | 'bday-month'\n  | 'bday-year'\n  | 'cc-additional-name'\n  | 'cc-csc'\n  | 'cc-exp'\n  | 'cc-exp-month'\n  | 'cc-exp-year'\n  | 'cc-family-name'\n  | 'cc-family-name'\n  | 'cc-given-name'\n  | 'cc-name'\n  | 'cc-number'\n  | 'cc-type'\n  | 'country'\n  | 'country-name'\n  | 'current-password'\n  | 'email'\n  | 'family-name'\n  | 'given-name'\n  | 'honorific-prefix'\n  | 'honorific-suffix'\n  | 'impp'\n  | 'language'\n  | 'name'\n  | 'new-password'\n  | 'nickname'\n  | 'off'\n  | 'on'\n  | 'one-time-code'\n  | 'organization'\n  | 'organization-title'\n  | 'photo'\n  | 'postal-code'\n  | 'sex'\n  | 'street-address'\n  | 'tel'\n  | 'tel-area-code'\n  | 'tel-country-code'\n  | 'tel-extension'\n  | 'tel-local'\n  | 'tel-national'\n  | 'transaction-amount'\n  | 'transaction-currency'\n  | 'url'\n  | 'username'",
+      "declaration": "export type AutocompleteType =\n  | 'additional-name'\n  | 'address'\n  | 'address-level1'\n  | 'address-level2'\n  | 'address-level3'\n  | 'address-level4'\n  | 'address-line1'\n  | 'address-line2'\n  | 'address-line3'\n  | 'bday'\n  | 'bday-day'\n  | 'bday-month'\n  | 'bday-year'\n  | 'cc-additional-name'\n  | 'cc-csc'\n  | 'cc-exp'\n  | 'cc-exp-month'\n  | 'cc-exp-year'\n  | 'cc-family-name'\n  | 'cc-given-name'\n  | 'cc-name'\n  | 'cc-number'\n  | 'cc-type'\n  | 'country'\n  | 'country-name'\n  | 'current-password'\n  | 'email'\n  | 'family-name'\n  | 'given-name'\n  | 'honorific-prefix'\n  | 'honorific-suffix'\n  | 'impp'\n  | 'language'\n  | 'name'\n  | 'new-password'\n  | 'nickname'\n  | 'off'\n  | 'on'\n  | 'one-time-code'\n  | 'organization'\n  | 'organization-title'\n  | 'photo'\n  | 'postal-code'\n  | 'sex'\n  | 'street-address'\n  | 'tel'\n  | 'tel-area-code'\n  | 'tel-country-code'\n  | 'tel-extension'\n  | 'tel-local'\n  | 'tel-national'\n  | 'transaction-amount'\n  | 'transaction-currency'\n  | 'url'\n  | 'username'",
       "docstring": "",
@@ -350,6 +365,6 @@ "path": "src/type/autocomplete.ts"
     },
-    "src/components/mds-input/meta/event-detail.ts::MdsInputEventDetail": {
-      "declaration": "export interface MdsInputEventDetail {\n  value?: string\n}",
+    "src/type/input.ts::MdsInputEventDetail": {
+      "declaration": "export interface MdsInputEventDetail {\n  value?: File | string | FormData | null\n}",
       "docstring": "",
-      "path": "src/components/mds-input/meta/event-detail.ts"
+      "path": "src/type/input.ts"
     },
@@ -371,7 +386,2 @@ "src/components/mds-input-field/meta/types.ts::InputFieldType": {
     },
-    "src/interface/input-value.ts::InputValue": {
-      "declaration": "export interface InputValue {\n  value: InputValueType\n}",
-      "docstring": "",
-      "path": "src/interface/input-value.ts"
-    },
     "src/components/mds-input-switch/meta/types.ts::InputSwitchSizeType": {
@@ -423,6 +433,11 @@ "declaration": "export type InputSwitchSizeType =\n  | 'sm'\n  | 'md'\n  | 'lg'",
     "src/components/mds-modal/meta/types.ts::ModalPositionType": {
-      "declaration": "export type ModalPositionType =\n  | 'bottom'\n  | 'center'\n  | 'left'\n  | 'right'\n  | 'top'",
+      "declaration": "export type ModalPositionType =\n  | 'bottom'\n  | 'bottom-left'\n  | 'bottom-right'\n  | 'center'\n  | 'left'\n  | 'right'\n  | 'top'\n  | 'top-left'\n  | 'top-right'",
       "docstring": "",
       "path": "src/components/mds-modal/meta/types.ts"
     },
+    "src/components/mds-modal/meta/types.ts::ModalAnimationStateType": {
+      "declaration": "export type ModalAnimationStateType =\n  | 'intro'\n  | 'none'\n  | 'outro'",
+      "docstring": "",
+      "path": "src/components/mds-modal/meta/types.ts"
+    },
     "src/type/variant.ts::LabelVariantType": {
@@ -463,9 +478,4 @@ "declaration": "export type LabelVariantType =\n  | 'amaranth'\n  | 'aqua'\n  | 'blue'\n  | 'green'\n  | 'lime'\n  | 'orange'\n  | 'orchid'\n  | 'sky'\n  | 'violet'\n  | 'yellow'",
     },
-    "src/type/language.ts::LanguageType": {
-      "declaration": "export type LanguageType =\n  | 'auto'\n  | `${Lowercase<string>}${Lowercase<string>}`\n  | `${Lowercase<string>}${Lowercase<string>}${Lowercase<string>}`",
-      "docstring": "",
-      "path": "src/type/language.ts"
-    },
     "src/event-detail/language.ts::MdsPrefLanguageEventDetail": {
-      "declaration": "export interface MdsPrefLanguageEventDetail {\n  language?: LanguageType\n}",
+      "declaration": "export interface MdsPrefLanguageEventDetail {\n  /* A string representing the language version as defined in {@link https://datatracker.ietf.org/doc/html/rfc5646 RFC 5646: Tags for Identifying Languages (also known as BCP 47)}.\n   *\n   * `Examples of valid language codes include \"en\", \"en-US\", \"fr\", \"fr-FR\", \"es-ES\", etc.`\n   */\n  language?: string\n}",
       "docstring": "",
@@ -544,2 +554,7 @@ "path": "src/event-detail/language.ts"
     },
+    "src/components/mds-table-header-cell/meta/types.ts::SortDirectionType": {
+      "declaration": "export type SortDirectionType =\n  | 'asc'\n  | 'desc'\n  | 'none'",
+      "docstring": "",
+      "path": "src/components/mds-table-header-cell/meta/types.ts"
+    },
     "src/components/mds-text/meta/types.ts::TextAnimationType": {
@@ -546,0 +561,0 @@ "declaration": "export type TextAnimationType =\n  | 'none'\n  | 'yugop'",

package.json

 {
   "name": "@maggioli-design-system/mds-stepper-bar",
-  "version": "5.7.3",
-  "description": "mds-stepper-bar is a web-component from Magma Design System, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.",
+  "version": "6.0.0",
+  "description": "mds-stepper-bar is a web-component from Magma Design System, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.",
   "main": "dist/index.cjs.js",
@@ -26,6 +26,6 @@ "module": "dist/index.js",
   "dependencies": {
-    "@maggioli-design-system/mds-progress": "2.10.3",
-    "@maggioli-design-system/mds-stepper-bar-item": "5.6.9",
-    "@maggioli-design-system/styles": "15.3.2",
-    "@stencil/core": "4.21.0"
+    "@maggioli-design-system/mds-progress": "3.0.0",
+    "@maggioli-design-system/mds-stepper-bar-item": "6.0.0",
+    "@maggioli-design-system/styles": "15.5.0",
+    "@stencil/core": "4.22.2"
   },
@@ -32,0 +32,0 @@ "license": "MIT",

readme.md

@@ -5,3 +5,3 @@ # mds-stepper-bar
 
-This is a web-component from Maggioli Design System [Magma](https://magma.maggiolicloud.it), built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScirpt framework you are using.
+This is a web-component from Maggioli Design System [Magma](https://magma.maggiolicloud.it), built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.
 
@@ -8,0 +8,0 @@ <!-- Auto Generated Below -->

src/common/file.ts

 import { fileExtensionsDictionary, ExtensionInfo } from '@dictionary/file-extensions'
 import { fileFormatsVariant } from '@type/variant-file-format'
+import { ThemeFullVariantType } from '@type/variant'
 
 interface FileFormatsVariants {
-  color: string
   icon: string
-  iconBackground: string
-  variant: string
+  variant: ThemeFullVariantType
 }
@@ -10,0 +9,0 @@

src/common/locale.ts

@@ -1,2 +0,2 @@
-import Handlebars from 'handlebars'
+import { render } from 'mustache'
 
@@ -15,2 +15,3 @@ type LocaleConfig = {
   closestElement:HTMLElement
+  element: HTMLElement
 
@@ -27,4 +28,5 @@ constructor (configData?: LocaleConfig) {
 
-  lang = (element: HTMLElement): string => {
-    this.closestElement = element.closest('[lang]') as HTMLElement
+  lang = (el: HTMLElement): string => {
+    this.element = el
+    this.closestElement = this.element.closest('[lang]') as HTMLElement
 
@@ -42,2 +44,15 @@ if (this.closestElement) {
 
+  update = (doc?: Document | ShadowRoot): void => {
+    const context = doc ?? this.element.shadowRoot
+    context && context.querySelectorAll('*').forEach(el => {
+      if (el.tagName.toLowerCase().startsWith('mds-')) {
+        // eslint-disable-next-line no-restricted-syntax
+        if (el && 'updateLang' in el) {
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          (el as any).updateLang()
+        }
+      }
+    })
+  }
+
   private pluralize = (tag: string | string[], context: Record<string, string | number>): string => {
@@ -47,3 +62,3 @@
     const phrases: string[] = []
-    
+
     if (Array.isArray(languagePhrase)) {
@@ -70,4 +85,3 @@ phrases.push(languagePhrase[0])
 
-    const template = Handlebars.compile(translatePhrase)
-    return template(context)
+    return render(translatePhrase, context)
   }
@@ -74,0 +88,0 @@

src/common/unit.ts

@@ -26,3 +26,3 @@ const cssDurationToMilliseconds = (duration: string, defaultValue = 1000): number => {
   }
-  
+
   return defaultValue
@@ -29,0 +29,0 @@ }

src/dictionary/button.ts

@@ -7,2 +7,3 @@ const buttonVariantDictionary = [
   'primary',
+  'secondary',
   'success',
@@ -9,0 +10,0 @@ 'warning',

src/dictionary/file-extensions.ts

@@ -0,1 +1,3 @@
+import { FileFormat } from '@type/variant-file-format'
+
 interface FileExtenstion {
@@ -7,3 +9,3 @@ [key: string]: ExtensionInfo
   preview?: boolean
-  format: string
+  format: FileFormat
   description: string
@@ -10,0 +12,0 @@ }

src/dictionary/variant.ts

@@ -80,2 +80,12 @@ const themeVariantDictionary = [
 
+const themeVariantChipDictionary = [
+  'primary',
+  'secondary',
+  'dark',
+  'error',
+  'info',
+  'success',
+  'warning',
+]
+
 const toneActionVariantDictionary = [
@@ -114,2 +124,3 @@ 'primary',
   themeVariantDictionary,
+  themeVariantChipDictionary,
   toneActionVariantDictionary,
@@ -116,0 +127,0 @@ toneMinimalVariantDictionary,

src/fixtures/icons.json

@@ -36,4 +36,12 @@ [
     "mgg/adv-denied",
-    "mgg/ai",
+    "mgg/ai-brain",
+    "mgg/ai-brain-outline",
+    "mgg/ai-message",
+    "mgg/ai-outline",
+    "mgg/ai-status-completed",
+    "mgg/ai-status-error",
+    "mgg/ai-status-processing",
+    "mgg/ai-status-suspended",
     "mgg/alerts-pagopa",
+    "mgg/anpr",
     "mgg/ansc",
@@ -50,2 +58,3 @@ "mgg/area-edificabile",
     "mgg/auto-awesome-motion",
+    "mgg/back-to-document",
     "mgg/balance",
@@ -91,2 +100,3 @@ "mgg/bill",
     "mgg/download-json",
+    "mgg/edit-article",
     "mgg/electronic-document",
@@ -173,2 +183,6 @@ "mgg/email-assigned",
     "mgg/masks-office",
+    "mgg/mdi-binoculars",
+    "mgg/mdi-graph-outline",
+    "mgg/mdi-microscope",
+    "mgg/mdi-telescope",
     "mgg/military-draft",
@@ -239,2 +253,3 @@ "mgg/money-bag-settings",
     "mgg/square-viewfinder",
+    "mgg/stacked-documents",
     "mgg/stamp",
@@ -249,2 +264,5 @@ "mgg/status-progress-a-quarter",
     "mgg/terminal",
+    "mgg/tie",
+    "mgg/to-single-document",
+    "mgg/to-stacked-documents",
     "mgg/todo",
@@ -287,4 +305,6 @@ "mgg/todo-action-businessman-view",
     "mgg/user-signed-out",
+    "mgg/user-substitution",
     "mgg/view-chart-gantt",
     "mgg/view-side-by-side",
+    "mgg/vote",
     "mgg/warning-superscript",
@@ -320,2 +340,4 @@ "mgg/web-app-ansc",
     "mi/baseline/description",
+    "mi/baseline/directions-run",
+    "mi/baseline/directions-walk",
     "mi/baseline/done",
@@ -329,3 +351,2 @@ "mi/baseline/downhill-skiing",
     "mi/baseline/folder-zip",
-    "mi/baseline/groups",
     "mi/baseline/horizontal-rule",
@@ -352,6 +373,12 @@ "mi/baseline/indeterminate-check-box",
     "mi/baseline/settings",
+    "mi/baseline/sports",
+    "mi/baseline/sports-soccer",
+    "mi/baseline/stadium",
     "mi/baseline/terminal",
     "mi/baseline/timer",
     "mi/baseline/tv",
+    "mi/baseline/unfold-more",
     "mi/baseline/videocam",
+    "mi/baseline/visibility",
+    "mi/baseline/visibility-off",
     "mi/baseline/warning",
@@ -368,3 +395,2 @@ "mi/baseline/warning-amber",
     "mi/round/email",
-    "mi/round/groups",
     "mi/round/menu",
@@ -371,0 +397,0 @@ "mi/round/more-vert",

src/fixtures/iconsauce.json

@@ -24,4 +24,12 @@ [
     "mgg/adv-denied",
-    "mgg/ai",
+    "mgg/ai-brain-outline",
+    "mgg/ai-brain",
+    "mgg/ai-message",
+    "mgg/ai-outline",
+    "mgg/ai-status-completed",
+    "mgg/ai-status-error",
+    "mgg/ai-status-processing",
+    "mgg/ai-status-suspended",
     "mgg/alerts-pagopa",
+    "mgg/anpr",
     "mgg/ansc",
@@ -38,2 +46,3 @@ "mgg/area-edificabile",
     "mgg/auto-awesome-motion",
+    "mgg/back-to-document",
     "mgg/balance",
@@ -79,2 +88,3 @@ "mgg/bill",
     "mgg/download-json",
+    "mgg/edit-article",
     "mgg/electronic-document",
@@ -161,2 +171,6 @@ "mgg/email-assigned",
     "mgg/masks-office",
+    "mgg/mdi-binoculars",
+    "mgg/mdi-graph-outline",
+    "mgg/mdi-microscope",
+    "mgg/mdi-telescope",
     "mgg/military-draft",
@@ -227,2 +241,3 @@ "mgg/money-bag-settings",
     "mgg/square-viewfinder",
+    "mgg/stacked-documents",
     "mgg/stamp",
@@ -237,2 +252,5 @@ "mgg/status-progress-a-quarter",
     "mgg/terminal",
+    "mgg/tie",
+    "mgg/to-single-document",
+    "mgg/to-stacked-documents",
     "mgg/todo-action-businessman-view",
@@ -275,4 +293,6 @@ "mgg/todo-action-certificate",
     "mgg/user-signed-out",
+    "mgg/user-substitution",
     "mgg/view-chart-gantt",
     "mgg/view-side-by-side",
+    "mgg/vote",
     "mgg/warning-superscript",
@@ -279,0 +299,0 @@ "mgg/web-app-ansc",

src/type/autocomplete.ts

@@ -21,3 +21,2 @@ export type AutocompleteType =
   | 'cc-family-name'
-  | 'cc-family-name'
   | 'cc-given-name'
@@ -24,0 +23,0 @@ | 'cc-name'

src/type/button.ts

@@ -23,2 +23,3 @@ export type ButtonType =
   | 'primary'
+  | 'secondary'
   | 'dark'
@@ -25,0 +26,0 @@ | 'light'

src/type/input.ts

@@ -26,1 +26,5 @@ export type InputControlsLayoutType =
   | 'url'
+
+export interface MdsInputEventDetail {
+  value?: File | string | FormData | null
+}

src/type/variant-file-format.ts

@@ -16,8 +16,24 @@ import baselineFolderZip from '@icon/mi/baseline/folder-zip.svg'
 import baselineVideocam from '@icon/mi/baseline/videocam.svg'
+import { ThemeFullVariantType } from '@type/variant'
 
+type FileFormat =
+  | 'archive'
+  | 'attachment'
+  | 'audio'
+  | 'code'
+  | 'data'
+  | 'document'
+  | 'email'
+  | 'executable'
+  | 'image'
+  | 'markup'
+  | 'slide'
+  | 'spreadsheet'
+  | 'text'
+  | 'vector'
+  | 'video'
+
 interface FileFormatVariant {
-  color: string
   icon: string
-  iconBackground: string
-  variant: string
+  variant: ThemeFullVariantType
 }
@@ -31,101 +47,67 @@
   archive: {
-    color: 'fill-label-amaranth-04 text-label-amaranth-04',
     icon: baselineFolderZip,
-    iconBackground: 'bg-label-amaranth-10',
     variant: 'amaranth',
   },
   attachment: {
-    color: 'fill-tone-neutral-04 text-tone-neutral-04',
     icon: baselineAttachFile,
-    iconBackground: 'bg-tone-neutral-10',
     variant: 'dark',
   },
   audio: {
-    color: 'fill-label-violet-04 text-label-violet-04',
     icon: baselineAudiotrack,
-    iconBackground: 'bg-label-violet-10',
     variant: 'violet',
   },
   code: {
-    color: 'fill-label-yellow-04 text-label-yellow-04',
     icon: baselineTerminal,
-    iconBackground: 'bg-label-yellow-10',
     variant: 'yellow',
   },
   data: {
-    color: 'fill-label-yellow-04 text-label-yellow-04',
     icon: mdiHardDisk,
-    iconBackground: 'bg-label-yellow-10',
     variant: 'yellow',
   },
   document: {
-    color: 'fill-label-orange-04 text-label-orange-04',
     icon: baselineInsertDriveFile,
-    iconBackground: 'bg-label-orange-10',
     variant: 'orange',
   },
   email: {
-    color: 'fill-label-blue-04 text-label-blue-04',
     icon: baselineEmail,
-    iconBackground: 'bg-label-blue-10',
     variant: 'blue',
   },
   executable: {
-    color: 'fill-label-amaranth-04 text-label-amaranth-04',
     icon: baselineWysiwyg,
-    iconBackground: 'bg-label-amaranth-10',
     variant: 'amaranth',
   },
   image: {
-    color: 'fill-label-green-04 text-label-green-04',
     icon: baselinePanorama,
-    iconBackground: 'bg-label-green-10',
     variant: 'green',
   },
   imageRaster: {
-    color: 'fill-label-green-04 text-label-green-04',
     icon: baselinePanorama,
-    iconBackground: 'bg-label-green-10',
     variant: 'green',
   },
   markup: {
-    color: 'fill-label-yellow-04 text-label-yellow-04',
     icon: baselineWeb,
-    iconBackground: 'bg-label-yellow-10',
     variant: 'yellow',
   },
   slide: {
-    color: 'fill-label-orchid-04 text-label-orchid-04',
     icon: baselineTV,
-    iconBackground: 'bg-label-orchid-10',
     variant: 'orchid',
   },
   spreadsheet: {
-    color: 'fill-label-lime-04 text-label-lime-04',
     icon: baselineBorderAll,
-    iconBackground: 'bg-label-lime-10',
     variant: 'lime',
   },
   text: {
-    color: 'fill-label-blue-04 text-label-blue-04',
     icon: baselineDescription,
-    iconBackground: 'bg-label-blue-10',
     variant: 'blue',
   },
   vectorImage: {
-    color: 'fill-label-aqua-04 text-label-aqua-04',
     icon: mdiVectorCurve,
-    iconBackground: 'bg-label-aqua-10',
     variant: 'aqua',
   },
   vector: {
-    color: 'fill-label-aqua-04 text-label-aqua-04',
     icon: mdiVectorCurve,
-    iconBackground: 'bg-label-aqua-10',
     variant: 'aqua',
   },
   video: {
-    color: 'fill-label-violet-04 text-label-violet-04',
     icon: baselineVideocam,
-    iconBackground: 'bg-label-violet-10',
     variant: 'violet',
@@ -137,4 +119,5 @@ },
   fileFormatsVariant,
+  FileFormat,
   FileFormatVariant,
   FileFormatVariants,
 }

src/type/variant.ts

@@ -72,2 +72,11 @@ export type ThemeStatusVariantType =
 
+export type ChipVariantType =
+  | 'primary'
+  | 'secondary'
+  | 'dark'
+  | 'error'
+  | 'info'
+  | 'success'
+  | 'warning'
+
 export type StateVariantType =
@@ -81,3 +90,2 @@ | 'disabled'
   | 'secondary' // background weak
-  | 'tertiary' // no background, no border
   | 'strong' // background strong
@@ -84,0 +92,0 @@ | 'weak' // background weak

www/build/mds-stepper-bar.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as t}from"./p-40f1944f.js";export{s as setNonce}from"./p-40f1944f.js";import{g as r}from"./p-e1255160.js";(()=>{const t=import.meta.url,s={};return""!==t&&(s.resourcesUrl=new URL(".",t).href),e(s)})().then((async e=>(await r(),t([["p-7cf8213a",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],e))));
+import{p as e,b as t}from"./p-59e6a2e4.js";export{s as setNonce}from"./p-59e6a2e4.js";import{g as r}from"./p-e1255160.js";(()=>{const t=import.meta.url,s={};return""!==t&&(s.resourcesUrl=new URL(".",t).href),e(s)})().then((async e=>(await r(),t([["p-1ae5d1bd",[[1,"mds-stepper-bar",{itemsDone:[2,"items-done"],currentItem:[32]},[[0,"mdsStepperBarItemDone","changeEventHandler"]],{itemsDone:["itemDone"]}]]]],e))));

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

859259

decreased by-4.09%

Number of package files

208

decreased by-1.42%

Lines of code

12369

decreased by-0.94%

Dependency changes

• + Added@fontsource/karla@5.1.0(transitive)

• + Added@fontsource/merriweather@5.1.0(transitive)

• + Added@fontsource/roboto@5.1.0(transitive)

• + Added@fontsource/roboto-mono@5.1.0(transitive)

• + Added@maggioli-design-system/design-tokens@13.5.0(transitive)

• + Added@maggioli-design-system/mds-badge@3.2.0(transitive)

• + Added@maggioli-design-system/mds-progress@3.0.0(transitive)

• + Added@maggioli-design-system/mds-stepper-bar-item@6.0.0(transitive)

• + Added@maggioli-design-system/mds-text@4.5.1(transitive)

• + Added@maggioli-design-system/styles@15.5.0(transitive)

• + Added@stencil/core@4.22.2(transitive)

• - Removed@fontsource/karla@5.0.19(transitive)

• - Removed@fontsource/merriweather@5.0.12(transitive)

• - Removed@fontsource/roboto@5.0.12(transitive)

• - Removed@fontsource/roboto-mono@5.0.17(transitive)

• - Removed@maggioli-design-system/design-tokens@13.2.0(transitive)

• - Removed@maggioli-design-system/mds-badge@3.1.0(transitive)

• - Removed@maggioli-design-system/mds-progress@2.10.3(transitive)

• - Removed@maggioli-design-system/mds-stepper-bar-item@5.6.9(transitive)

• - Removed@maggioli-design-system/mds-text@4.4.3(transitive)

• - Removed@maggioli-design-system/styles@15.3.2(transitive)

• - Removed@stencil/core@4.21.0(transitive)

• Updated@maggioli-design-system/mds-progress@3.0.0

• Updated@maggioli-design-system/mds-stepper-bar-item@6.0.0

• Updated@maggioli-design-system/styles@15.5.0

• Updated@stencil/core@4.22.2