@maggioli-design-system/mds-breadcrumb - npm Package Compare versions

Comparing version 2.6.4 to 2.7.0

dist/cjs/mds-breadcrumb.cjs.entry.js

@@ -50,3 +50,3 @@ 'use strict';
 
-const mdsBreadcrumbCss = "@-webkit-keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;height:2rem;width:2rem;border-radius:9999px;-ms-flex-align:center;align-items:center;background-color:var(--mds-breadcrumb-button-background);cursor:pointer;display:-ms-flexbox;display:flex;fill:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center}.back:hover{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-hover);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";
+const mdsBreadcrumbCss = "@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.bg-label-amaranth-10{--tw-bg-opacity:1;background-color:rgb(var(--label-amaranth-10) / var(--tw-bg-opacity))}.bg-label-aqua-10{--tw-bg-opacity:1;background-color:rgb(var(--label-aqua-10) / var(--tw-bg-opacity))}.bg-label-blue-10{--tw-bg-opacity:1;background-color:rgb(var(--label-blue-10) / var(--tw-bg-opacity))}.bg-label-green-10{--tw-bg-opacity:1;background-color:rgb(var(--label-green-10) / var(--tw-bg-opacity))}.bg-label-lime-10{--tw-bg-opacity:1;background-color:rgb(var(--label-lime-10) / var(--tw-bg-opacity))}.bg-label-orange-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orange-10) / var(--tw-bg-opacity))}.bg-label-orchid-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orchid-10) / var(--tw-bg-opacity))}.bg-label-violet-10{--tw-bg-opacity:1;background-color:rgb(var(--label-violet-10) / var(--tw-bg-opacity))}.bg-label-yellow-10{--tw-bg-opacity:1;background-color:rgb(var(--label-yellow-10) / var(--tw-bg-opacity))}.bg-tone-neutral-10{--tw-bg-opacity:1;background-color:rgb(var(--tone-neutral-10) / var(--tw-bg-opacity))}.fill-label-amaranth-04{fill:rgb(var(--label-amaranth-04))}.fill-label-aqua-04{fill:rgb(var(--label-aqua-04))}.fill-label-blue-04{fill:rgb(var(--label-blue-04))}.fill-label-green-04{fill:rgb(var(--label-green-04))}.fill-label-lime-04{fill:rgb(var(--label-lime-04))}.fill-label-orange-04{fill:rgb(var(--label-orange-04))}.fill-label-orchid-04{fill:rgb(var(--label-orchid-04))}.fill-label-violet-04{fill:rgb(var(--label-violet-04))}.fill-label-yellow-04{fill:rgb(var(--label-yellow-04))}.fill-tone-neutral-04{fill:rgb(var(--tone-neutral-04))}.text-label-amaranth-04{--tw-text-opacity:1;color:rgb(var(--label-amaranth-04) / var(--tw-text-opacity))}.text-label-aqua-04{--tw-text-opacity:1;color:rgb(var(--label-aqua-04) / var(--tw-text-opacity))}.text-label-blue-04{--tw-text-opacity:1;color:rgb(var(--label-blue-04) / var(--tw-text-opacity))}.text-label-green-04{--tw-text-opacity:1;color:rgb(var(--label-green-04) / var(--tw-text-opacity))}.text-label-lime-04{--tw-text-opacity:1;color:rgb(var(--label-lime-04) / var(--tw-text-opacity))}.text-label-orange-04{--tw-text-opacity:1;color:rgb(var(--label-orange-04) / var(--tw-text-opacity))}.text-label-orchid-04{--tw-text-opacity:1;color:rgb(var(--label-orchid-04) / var(--tw-text-opacity))}.text-label-violet-04{--tw-text-opacity:1;color:rgb(var(--label-violet-04) / var(--tw-text-opacity))}.text-label-yellow-04{--tw-text-opacity:1;color:rgb(var(--label-yellow-04) / var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgb(var(--tone-neutral-04) / var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;--mds-button-background:var(--mds-breadcrumb-button-background);--mds-button-icon-color:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0}.back:hover{--mds-button-background:var(--mds-breadcrumb-button-background-hover);--mds-button-icon-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-button-icon-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";
 
@@ -134,3 +134,3 @@ const MdsBreadcrumb = class {
         return (index.h(index.Host, null, this.back &&
-            index.h("div", { tabindex: "0", class: "back focus-bounce", onClick: this.togglePrevious }, index.h("i", { class: "svg icon", innerHTML: miBaselineArrowBack })), index.h("slot", null)));
+            index.h("mds-button", { class: "back", icon: miBaselineArrowBack, onClick: this.togglePrevious }), index.h("slot", null)));
     }
@@ -137,0 +137,0 @@ get element() { return index.getElement(this); }

dist/cjs/mds-breadcrumb.cjs.js

@@ -8,3 +8,3 @@ 'use strict';
 /*
- Stencil Client Patch Browser v4.9.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.10.0 | MIT Licensed | https://stenciljs.com
  */
@@ -11,0 +11,0 @@ const patchBrowser = () => {

dist/collection/collection-manifest.json

@@ -7,4 +7,4 @@ {
     "name": "@stencil/core",
-    "version": "4.9.1",
-    "typescriptVersion": "5.2.2"
+    "version": "4.10.0",
+    "typescriptVersion": "5.3.3"
   },
@@ -11,0 +11,0 @@ "collections": [],

dist/collection/common/unit.js

 const cssDurationToMilliseconds = (duration, defaultValue = 1000) => {
+    if (duration.includes('ms')) {
+        return Number(duration.replace('ms', ''));
+    }
     if (duration.includes('s')) {
         return Number(duration.replace('s', '')) * 1000;
     }
-    if (duration.includes('ms')) {
-        return Number(duration.replace('s', ''));
+    return defaultValue;
+};
+const cssSizeToNumber = (size, defaultValue = 0) => {
+    if (size.includes('px')) {
+        return Number(size.replace('px', ''));
     }
+    if (size.includes('rem')) {
+        return Number(size.replace('rem', '')) * 16;
+    }
+    if (size.includes('em')) {
+        return Number(size.replace('em', '')) * 16;
+    }
     return defaultValue;
 };
-export { cssDurationToMilliseconds, };
+export { cssDurationToMilliseconds, cssSizeToNumber, };

dist/collection/components/mds-breadcrumb/mds-breadcrumb.js

@@ -86,3 +86,3 @@ import { Host, h } from "@stencil/core";
         return (h(Host, null, this.back &&
-            h("div", { tabindex: "0", class: "back focus-bounce", onClick: this.togglePrevious }, h("i", { class: "svg icon", innerHTML: miBaselineArrowBack })), h("slot", null)));
+            h("mds-button", { class: "back", icon: miBaselineArrowBack, onClick: this.togglePrevious }), h("slot", null)));
     }
@@ -89,0 +89,0 @@ static get is() { return "mds-breadcrumb"; }

dist/collection/dictionary/icon.js

@@ -5,2 +5,7 @@ import jsonIconsDictionary from "../fixtures/icons.json";
 const mggIconsDictionary = jsonMggIconsDictionary;
-export { iconsDictionary, mggIconsDictionary, };
+const svgIconsDictionary = [
+    `${location.origin}/svg/mi/baseline/email.svg`,
+    'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Im0yMzMtODAgNjUtMjgxTDgwLTU1MGwyODgtMjUgMTEyLTI2NSAxMTIgMjY1IDI4OCAyNS0yMTggMTg5IDY1IDI4MS0yNDctMTQ5TDIzMy04MFoiLz48L3N2Zz4=',
+    '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8z"/></svg>',
+];
+export { iconsDictionary, mggIconsDictionary, svgIconsDictionary, };

dist/collection/dictionary/variant.js

@@ -38,2 +38,19 @@ const themeVariantDictionary = [
 ];
+const themeFullVariantAvatarDictionary = [
+    'amaranth',
+    'aqua',
+    'blue',
+    'error',
+    'green',
+    'info',
+    'lime',
+    'orange',
+    'orchid',
+    'primary',
+    'sky',
+    'success',
+    'violet',
+    'warning',
+    'yellow',
+];
 const themeLabelVariantDictionary = [
@@ -74,2 +91,2 @@ 'amaranth',
 ];
-export { themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };

dist/components/mds-breadcrumb.js

@@ -46,3 +46,3 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 
-const mdsBreadcrumbCss = "@-webkit-keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;height:2rem;width:2rem;border-radius:9999px;-ms-flex-align:center;align-items:center;background-color:var(--mds-breadcrumb-button-background);cursor:pointer;display:-ms-flexbox;display:flex;fill:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center}.back:hover{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-hover);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";
+const mdsBreadcrumbCss = "@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.bg-label-amaranth-10{--tw-bg-opacity:1;background-color:rgb(var(--label-amaranth-10) / var(--tw-bg-opacity))}.bg-label-aqua-10{--tw-bg-opacity:1;background-color:rgb(var(--label-aqua-10) / var(--tw-bg-opacity))}.bg-label-blue-10{--tw-bg-opacity:1;background-color:rgb(var(--label-blue-10) / var(--tw-bg-opacity))}.bg-label-green-10{--tw-bg-opacity:1;background-color:rgb(var(--label-green-10) / var(--tw-bg-opacity))}.bg-label-lime-10{--tw-bg-opacity:1;background-color:rgb(var(--label-lime-10) / var(--tw-bg-opacity))}.bg-label-orange-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orange-10) / var(--tw-bg-opacity))}.bg-label-orchid-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orchid-10) / var(--tw-bg-opacity))}.bg-label-violet-10{--tw-bg-opacity:1;background-color:rgb(var(--label-violet-10) / var(--tw-bg-opacity))}.bg-label-yellow-10{--tw-bg-opacity:1;background-color:rgb(var(--label-yellow-10) / var(--tw-bg-opacity))}.bg-tone-neutral-10{--tw-bg-opacity:1;background-color:rgb(var(--tone-neutral-10) / var(--tw-bg-opacity))}.fill-label-amaranth-04{fill:rgb(var(--label-amaranth-04))}.fill-label-aqua-04{fill:rgb(var(--label-aqua-04))}.fill-label-blue-04{fill:rgb(var(--label-blue-04))}.fill-label-green-04{fill:rgb(var(--label-green-04))}.fill-label-lime-04{fill:rgb(var(--label-lime-04))}.fill-label-orange-04{fill:rgb(var(--label-orange-04))}.fill-label-orchid-04{fill:rgb(var(--label-orchid-04))}.fill-label-violet-04{fill:rgb(var(--label-violet-04))}.fill-label-yellow-04{fill:rgb(var(--label-yellow-04))}.fill-tone-neutral-04{fill:rgb(var(--tone-neutral-04))}.text-label-amaranth-04{--tw-text-opacity:1;color:rgb(var(--label-amaranth-04) / var(--tw-text-opacity))}.text-label-aqua-04{--tw-text-opacity:1;color:rgb(var(--label-aqua-04) / var(--tw-text-opacity))}.text-label-blue-04{--tw-text-opacity:1;color:rgb(var(--label-blue-04) / var(--tw-text-opacity))}.text-label-green-04{--tw-text-opacity:1;color:rgb(var(--label-green-04) / var(--tw-text-opacity))}.text-label-lime-04{--tw-text-opacity:1;color:rgb(var(--label-lime-04) / var(--tw-text-opacity))}.text-label-orange-04{--tw-text-opacity:1;color:rgb(var(--label-orange-04) / var(--tw-text-opacity))}.text-label-orchid-04{--tw-text-opacity:1;color:rgb(var(--label-orchid-04) / var(--tw-text-opacity))}.text-label-violet-04{--tw-text-opacity:1;color:rgb(var(--label-violet-04) / var(--tw-text-opacity))}.text-label-yellow-04{--tw-text-opacity:1;color:rgb(var(--label-yellow-04) / var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgb(var(--tone-neutral-04) / var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;--mds-button-background:var(--mds-breadcrumb-button-background);--mds-button-icon-color:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0}.back:hover{--mds-button-background:var(--mds-breadcrumb-button-background-hover);--mds-button-icon-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-button-icon-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";
 
@@ -132,3 +132,3 @@ const MdsBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class MdsBreadcrumb extends HTMLElement {
         return (h(Host, null, this.back &&
-            h("div", { tabindex: "0", class: "back focus-bounce", onClick: this.togglePrevious }, h("i", { class: "svg icon", innerHTML: miBaselineArrowBack })), h("slot", null)));
+            h("mds-button", { class: "back", icon: miBaselineArrowBack, onClick: this.togglePrevious }), h("slot", null)));
     }
@@ -135,0 +135,0 @@ get element() { return this; }

dist/documentation.json

 {
-  "timestamp": "2024-01-10T08:23:32",
+  "timestamp": "2024-02-09T11:15:15",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.9.1",
-    "typescriptVersion": "5.2.2"
+    "version": "4.10.0",
+    "typescriptVersion": "5.3.3"
   },
@@ -8,0 +8,0 @@ "components": [

dist/esm-es5/mds-breadcrumb.entry.js

@@ -1,1 +0,1 @@
-import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-09e1cadd.js";var miBaselineArrowBack='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8l8 8l1.41-1.41L7.83 13H20v-2z"/></svg>';var KeyboardManager=function(){function t(){var t=this;this.elements=[];this.handleClickBehaviorDispatchEvent=function(t){if(t.code==="Space"||t.code==="Enter"||t.code==="NumpadEnter"){t.target.click()}};this.handleEscapeBehaviorDispatchEvent=function(o){if(o.code==="Escape"&&t.escapeCallback){t.escapeCallback()}};this.addElement=function(o,r){if(r===void 0){r="element"}t.elements[r]=o};this.attachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].addEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.detachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].removeEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.attachEscapeBehavior=function(o){t.escapeCallback=o;if(window!==undefined){window.addEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}};this.detachEscapeBehavior=function(){t.escapeCallback=function(){return};if(window!==undefined){window.removeEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}}}return t}();var mdsBreadcrumbCss="@-webkit-keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;height:2rem;width:2rem;border-radius:9999px;-ms-flex-align:center;align-items:center;background-color:var(--mds-breadcrumb-button-background);cursor:pointer;display:-ms-flexbox;display:flex;fill:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center}.back:hover{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-hover);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";var MdsBreadcrumb=function(){function t(t){var o=this;registerInstance(this,t);this.changedEvent=createEvent(this,"mdsBreadcrumbChange",7);this.kb=new KeyboardManager;this.queryItems=function(){return o.element.querySelectorAll("mds-breadcrumb-item")};this.updateBackButton=function(t){var r;if(!o.back)return;var n=(r=o.element.shadowRoot)===null||r===void 0?void 0:r.querySelector(".back");if(t===0){n.classList.add("disabled");o.kb.detachClickBehavior();return}n.classList.remove("disabled");o.kb.attachClickBehavior()};this.togglePrevious=function(){var t=o.element.querySelector("mds-breadcrumb-item[selected]");if(!t)return;var r=Number(t.id.replace("item-",""));var n=o.queryItems();var e=0;n.forEach((function(t,o){t.selected=o===r-1;if(t.selected){e=o}}));o.updateBackButton(e);o.onChanged(e,t)};this.onChanged=function(t,r){o.changedEvent.emit({id:t.toString(),caller:r})};this.back=true}t.prototype.componentDidLoad=function(){var t;var o=this.queryItems();o.forEach((function(t,o){return t.id="item-".concat(o)}));var r=this.element.querySelector("mds-breadcrumb-item[selected]");if(!r||r.id==="item-0"){this.updateBackButton(0)}if(this.back){var n=(t=this.element.shadowRoot)===null||t===void 0?void 0:t.querySelector(".back");this.kb.addElement(n);this.kb.attachClickBehavior()}};t.prototype.componentDidUpdate=function(){var t;if(this.back){var o=(t=this.element.shadowRoot)===null||t===void 0?void 0:t.querySelector(".back");this.kb.addElement(o);this.kb.attachClickBehavior();return}this.kb.detachClickBehavior()};t.prototype.disconnectedCallback=function(){this.kb.detachClickBehavior()};t.prototype.activedEventHandler=function(t){var o=this.queryItems();var r=0;o.forEach((function(o,n){o.selected="item-".concat(n)===t.detail.id&&t.detail.selected;if(o.selected){r=n}}));this.updateBackButton(r);this.onChanged(r,t.target)};t.prototype.render=function(){return h(Host,null,this.back&&h("div",{tabindex:"0",class:"back focus-bounce",onClick:this.togglePrevious},h("i",{class:"svg icon",innerHTML:miBaselineArrowBack})),h("slot",null))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();MdsBreadcrumb.style=mdsBreadcrumbCss;export{MdsBreadcrumb as mds_breadcrumb};
+import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-09e1cadd.js";var miBaselineArrowBack='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8l8 8l1.41-1.41L7.83 13H20v-2z"/></svg>';var KeyboardManager=function(){function t(){var t=this;this.elements=[];this.handleClickBehaviorDispatchEvent=function(t){if(t.code==="Space"||t.code==="Enter"||t.code==="NumpadEnter"){t.target.click()}};this.handleEscapeBehaviorDispatchEvent=function(a){if(a.code==="Escape"&&t.escapeCallback){t.escapeCallback()}};this.addElement=function(a,r){if(r===void 0){r="element"}t.elements[r]=a};this.attachClickBehavior=function(a){if(a===void 0){a="element"}if(t.elements[a]){t.elements[a].addEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.detachClickBehavior=function(a){if(a===void 0){a="element"}if(t.elements[a]){t.elements[a].removeEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.attachEscapeBehavior=function(a){t.escapeCallback=a;if(window!==undefined){window.addEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}};this.detachEscapeBehavior=function(){t.escapeCallback=function(){return};if(window!==undefined){window.removeEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}}}return t}();var mdsBreadcrumbCss="@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.bg-label-amaranth-10{--tw-bg-opacity:1;background-color:rgb(var(--label-amaranth-10) / var(--tw-bg-opacity))}.bg-label-aqua-10{--tw-bg-opacity:1;background-color:rgb(var(--label-aqua-10) / var(--tw-bg-opacity))}.bg-label-blue-10{--tw-bg-opacity:1;background-color:rgb(var(--label-blue-10) / var(--tw-bg-opacity))}.bg-label-green-10{--tw-bg-opacity:1;background-color:rgb(var(--label-green-10) / var(--tw-bg-opacity))}.bg-label-lime-10{--tw-bg-opacity:1;background-color:rgb(var(--label-lime-10) / var(--tw-bg-opacity))}.bg-label-orange-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orange-10) / var(--tw-bg-opacity))}.bg-label-orchid-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orchid-10) / var(--tw-bg-opacity))}.bg-label-violet-10{--tw-bg-opacity:1;background-color:rgb(var(--label-violet-10) / var(--tw-bg-opacity))}.bg-label-yellow-10{--tw-bg-opacity:1;background-color:rgb(var(--label-yellow-10) / var(--tw-bg-opacity))}.bg-tone-neutral-10{--tw-bg-opacity:1;background-color:rgb(var(--tone-neutral-10) / var(--tw-bg-opacity))}.fill-label-amaranth-04{fill:rgb(var(--label-amaranth-04))}.fill-label-aqua-04{fill:rgb(var(--label-aqua-04))}.fill-label-blue-04{fill:rgb(var(--label-blue-04))}.fill-label-green-04{fill:rgb(var(--label-green-04))}.fill-label-lime-04{fill:rgb(var(--label-lime-04))}.fill-label-orange-04{fill:rgb(var(--label-orange-04))}.fill-label-orchid-04{fill:rgb(var(--label-orchid-04))}.fill-label-violet-04{fill:rgb(var(--label-violet-04))}.fill-label-yellow-04{fill:rgb(var(--label-yellow-04))}.fill-tone-neutral-04{fill:rgb(var(--tone-neutral-04))}.text-label-amaranth-04{--tw-text-opacity:1;color:rgb(var(--label-amaranth-04) / var(--tw-text-opacity))}.text-label-aqua-04{--tw-text-opacity:1;color:rgb(var(--label-aqua-04) / var(--tw-text-opacity))}.text-label-blue-04{--tw-text-opacity:1;color:rgb(var(--label-blue-04) / var(--tw-text-opacity))}.text-label-green-04{--tw-text-opacity:1;color:rgb(var(--label-green-04) / var(--tw-text-opacity))}.text-label-lime-04{--tw-text-opacity:1;color:rgb(var(--label-lime-04) / var(--tw-text-opacity))}.text-label-orange-04{--tw-text-opacity:1;color:rgb(var(--label-orange-04) / var(--tw-text-opacity))}.text-label-orchid-04{--tw-text-opacity:1;color:rgb(var(--label-orchid-04) / var(--tw-text-opacity))}.text-label-violet-04{--tw-text-opacity:1;color:rgb(var(--label-violet-04) / var(--tw-text-opacity))}.text-label-yellow-04{--tw-text-opacity:1;color:rgb(var(--label-yellow-04) / var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgb(var(--tone-neutral-04) / var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;--mds-button-background:var(--mds-breadcrumb-button-background);--mds-button-icon-color:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0}.back:hover{--mds-button-background:var(--mds-breadcrumb-button-background-hover);--mds-button-icon-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-button-icon-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";var MdsBreadcrumb=function(){function t(t){var a=this;registerInstance(this,t);this.changedEvent=createEvent(this,"mdsBreadcrumbChange",7);this.kb=new KeyboardManager;this.queryItems=function(){return a.element.querySelectorAll("mds-breadcrumb-item")};this.updateBackButton=function(t){var r;if(!a.back)return;var o=(r=a.element.shadowRoot)===null||r===void 0?void 0:r.querySelector(".back");if(t===0){o.classList.add("disabled");a.kb.detachClickBehavior();return}o.classList.remove("disabled");a.kb.attachClickBehavior()};this.togglePrevious=function(){var t=a.element.querySelector("mds-breadcrumb-item[selected]");if(!t)return;var r=Number(t.id.replace("item-",""));var o=a.queryItems();var e=0;o.forEach((function(t,a){t.selected=a===r-1;if(t.selected){e=a}}));a.updateBackButton(e);a.onChanged(e,t)};this.onChanged=function(t,r){a.changedEvent.emit({id:t.toString(),caller:r})};this.back=true}t.prototype.componentDidLoad=function(){var t;var a=this.queryItems();a.forEach((function(t,a){return t.id="item-".concat(a)}));var r=this.element.querySelector("mds-breadcrumb-item[selected]");if(!r||r.id==="item-0"){this.updateBackButton(0)}if(this.back){var o=(t=this.element.shadowRoot)===null||t===void 0?void 0:t.querySelector(".back");this.kb.addElement(o);this.kb.attachClickBehavior()}};t.prototype.componentDidUpdate=function(){var t;if(this.back){var a=(t=this.element.shadowRoot)===null||t===void 0?void 0:t.querySelector(".back");this.kb.addElement(a);this.kb.attachClickBehavior();return}this.kb.detachClickBehavior()};t.prototype.disconnectedCallback=function(){this.kb.detachClickBehavior()};t.prototype.activedEventHandler=function(t){var a=this.queryItems();var r=0;a.forEach((function(a,o){a.selected="item-".concat(o)===t.detail.id&&t.detail.selected;if(a.selected){r=o}}));this.updateBackButton(r);this.onChanged(r,t.target)};t.prototype.render=function(){return h(Host,null,this.back&&h("mds-button",{class:"back",icon:miBaselineArrowBack,onClick:this.togglePrevious}),h("slot",null))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();MdsBreadcrumb.style=mdsBreadcrumbCss;export{MdsBreadcrumb as mds_breadcrumb};

dist/esm/mds-breadcrumb.entry.js

@@ -46,3 +46,3 @@ import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-09e1cadd.js';
 
-const mdsBreadcrumbCss = "@-webkit-keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@keyframes focus-bounce{0%,75%,100%{outline-offset:var(--magma-outline-focus-offset)}50%{outline-offset:var(--magma-outline-blur-offset)}}@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;height:2rem;width:2rem;border-radius:9999px;-ms-flex-align:center;align-items:center;background-color:var(--mds-breadcrumb-button-background);cursor:pointer;display:-ms-flexbox;display:flex;fill:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center}.back:hover{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-hover);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-breadcrumb-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-breadcrumb-button-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";
+const mdsBreadcrumbCss = "@tailwind components; .focus-bounce{-webkit-animation-duration:var(--magma-outline-animation-duration, 1s);animation-duration:var(--magma-outline-animation-duration, 1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:focus-bounce;animation-name:focus-bounce;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-animation-timing-function:cubic-bezier(0, 0, 0.2, 1);animation-timing-function:cubic-bezier(0, 0, 0.2, 1);outline:var(--magma-outline-blur);-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}.focus-bounce--focused,.focus-bounce:focus-visible{--magma-outline-blur:var(--magma-outline-focus);-webkit-animation-play-state:running;animation-play-state:running}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1/1;height:100%;width:100%}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.border{border-width:1px}.bg-label-amaranth-10{--tw-bg-opacity:1;background-color:rgb(var(--label-amaranth-10) / var(--tw-bg-opacity))}.bg-label-aqua-10{--tw-bg-opacity:1;background-color:rgb(var(--label-aqua-10) / var(--tw-bg-opacity))}.bg-label-blue-10{--tw-bg-opacity:1;background-color:rgb(var(--label-blue-10) / var(--tw-bg-opacity))}.bg-label-green-10{--tw-bg-opacity:1;background-color:rgb(var(--label-green-10) / var(--tw-bg-opacity))}.bg-label-lime-10{--tw-bg-opacity:1;background-color:rgb(var(--label-lime-10) / var(--tw-bg-opacity))}.bg-label-orange-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orange-10) / var(--tw-bg-opacity))}.bg-label-orchid-10{--tw-bg-opacity:1;background-color:rgb(var(--label-orchid-10) / var(--tw-bg-opacity))}.bg-label-violet-10{--tw-bg-opacity:1;background-color:rgb(var(--label-violet-10) / var(--tw-bg-opacity))}.bg-label-yellow-10{--tw-bg-opacity:1;background-color:rgb(var(--label-yellow-10) / var(--tw-bg-opacity))}.bg-tone-neutral-10{--tw-bg-opacity:1;background-color:rgb(var(--tone-neutral-10) / var(--tw-bg-opacity))}.fill-label-amaranth-04{fill:rgb(var(--label-amaranth-04))}.fill-label-aqua-04{fill:rgb(var(--label-aqua-04))}.fill-label-blue-04{fill:rgb(var(--label-blue-04))}.fill-label-green-04{fill:rgb(var(--label-green-04))}.fill-label-lime-04{fill:rgb(var(--label-lime-04))}.fill-label-orange-04{fill:rgb(var(--label-orange-04))}.fill-label-orchid-04{fill:rgb(var(--label-orchid-04))}.fill-label-violet-04{fill:rgb(var(--label-violet-04))}.fill-label-yellow-04{fill:rgb(var(--label-yellow-04))}.fill-tone-neutral-04{fill:rgb(var(--tone-neutral-04))}.text-label-amaranth-04{--tw-text-opacity:1;color:rgb(var(--label-amaranth-04) / var(--tw-text-opacity))}.text-label-aqua-04{--tw-text-opacity:1;color:rgb(var(--label-aqua-04) / var(--tw-text-opacity))}.text-label-blue-04{--tw-text-opacity:1;color:rgb(var(--label-blue-04) / var(--tw-text-opacity))}.text-label-green-04{--tw-text-opacity:1;color:rgb(var(--label-green-04) / var(--tw-text-opacity))}.text-label-lime-04{--tw-text-opacity:1;color:rgb(var(--label-lime-04) / var(--tw-text-opacity))}.text-label-orange-04{--tw-text-opacity:1;color:rgb(var(--label-orange-04) / var(--tw-text-opacity))}.text-label-orchid-04{--tw-text-opacity:1;color:rgb(var(--label-orchid-04) / var(--tw-text-opacity))}.text-label-violet-04{--tw-text-opacity:1;color:rgb(var(--label-violet-04) / var(--tw-text-opacity))}.text-label-yellow-04{--tw-text-opacity:1;color:rgb(var(--label-yellow-04) / var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgb(var(--tone-neutral-04) / var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-breadcrumb-arrow-depth-color:rgb(var(--tone-neutral-04));--mds-breadcrumb-button-background-current:rgb(var(--tone-neutral-09));--mds-breadcrumb-button-background-disabled:transparent;--mds-breadcrumb-button-background-hover:rgb(var(--tone-neutral-10));--mds-breadcrumb-button-background:transparent;--mds-breadcrumb-button-color-current:rgb(var(--tone-neutral-01));--mds-breadcrumb-button-color-disabled:rgb(var(--tone-neutral-06));--mds-breadcrumb-button-color-hover:rgb(var(--tone-neutral-02));--mds-breadcrumb-button-color:rgb(var(--tone-neutral-02));--mds-breadcrumb-current-button-color:rgb(var(--tone-neutral-05));-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none;gap:0rem;padding:0.5rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;overflow:auto;scroll-behavior:smooth;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}:host::-webkit-scrollbar{display:none}.back{margin-right:0.25rem;--mds-button-background:var(--mds-breadcrumb-button-background);--mds-button-icon-color:var(--mds-breadcrumb-button-color);-ms-flex-negative:0;flex-shrink:0}.back:hover{--mds-button-background:var(--mds-breadcrumb-button-background-hover);--mds-button-icon-color:var(--mds-breadcrumb-button-color-hover)}.disabled{--mds-button-background:var(--mds-breadcrumb-button-background-disabled);--mds-button-icon-color:var(--mds-breadcrumb-button-color-disabled);pointer-events:none}";
 
@@ -130,3 +130,3 @@ const MdsBreadcrumb = class {
         return (h(Host, null, this.back &&
-            h("div", { tabindex: "0", class: "back focus-bounce", onClick: this.togglePrevious }, h("i", { class: "svg icon", innerHTML: miBaselineArrowBack })), h("slot", null)));
+            h("mds-button", { class: "back", icon: miBaselineArrowBack, onClick: this.togglePrevious }), h("slot", null)));
     }
@@ -133,0 +133,0 @@ get element() { return getElement(this); }

dist/esm/mds-breadcrumb.js

@@ -5,3 +5,3 @@ import { p as promiseResolve, b as bootstrapLazy } from './index-09e1cadd.js';
 /*
- Stencil Client Patch Browser v4.9.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.10.0 | MIT Licensed | https://stenciljs.com
  */
@@ -8,0 +8,0 @@ const patchBrowser = () => {

dist/mds-breadcrumb/mds-breadcrumb.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as r}from"./p-67d90702.js";export{s as setNonce}from"./p-67d90702.js";(()=>{const r=import.meta.url,t={};return""!==r&&(t.resourcesUrl=new URL(".",r).href),e(t)})().then((e=>r([["p-cd30aef8",[[1,"mds-breadcrumb",{back:[4]},[[0,"mdsBreadcrumbItemSelect","activedEventHandler"]]]]]],e)));
+import{p as e,b as r}from"./p-67d90702.js";export{s as setNonce}from"./p-67d90702.js";(()=>{const r=import.meta.url,t={};return""!==r&&(t.resourcesUrl=new URL(".",r).href),e(t)})().then((e=>r([["p-6f909ae5",[[1,"mds-breadcrumb",{back:[4]},[[0,"mdsBreadcrumbItemSelect","activedEventHandler"]]]]]],e)));

dist/stats.json

 {
-  "timestamp": "2024-01-10T08:23:32",
+  "timestamp": "2024-02-09T11:15:15",
   "compiler": {
@@ -12,11 +12,20 @@ "name": "node",
     "entries": 1,
-    "bundles": 67,
+    "bundles": 82,
     "outputs": [
       {
         "name": "dist-collection",
-        "files": 26,
+        "files": 41,
         "generatedFiles": [
           "./dist/collection/common/aria.js",
+          "./dist/collection/common/file.js",
+          "./dist/collection/common/icon.js",
           "./dist/collection/common/keyboard-manager.js",
           "./dist/collection/common/unit.js",
+          "./dist/collection/common/yugop/core.js",
+          "./dist/collection/common/yugop/index.js",
+          "./dist/collection/common/yugop/random-text.js",
+          "./dist/collection/common/yugop/utils/math.js",
+          "./dist/collection/common/yugop/utils/noop.js",
+          "./dist/collection/common/yugop/utils/prng.js",
+          "./dist/collection/common/yugop/utils/string.js",
           "./dist/collection/components/mds-breadcrumb/mds-breadcrumb.js",
@@ -29,2 +38,3 @@ "./dist/collection/components/mds-breadcrumb/meta/event-detail.js",
           "./dist/collection/dictionary/color.js",
+          "./dist/collection/dictionary/file-extensions.js",
           "./dist/collection/dictionary/floating-ui.js",
@@ -34,8 +44,11 @@ "./dist/collection/dictionary/icon.js",
           "./dist/collection/dictionary/loading.js",
+          "./dist/collection/dictionary/text.js",
           "./dist/collection/dictionary/typography.js",
           "./dist/collection/dictionary/variant.js",
           "./dist/collection/fixtures/cities.js",
+          "./dist/collection/fixtures/filenames.js",
           "./dist/collection/interface/input-value.js",
           "./dist/collection/type/autocomplete.js",
           "./dist/collection/type/button.js",
+          "./dist/collection/type/file-types.js",
           "./dist/collection/type/floating-ui.js",
@@ -45,3 +58,5 @@ "./dist/collection/type/form-rel.js",
           "./dist/collection/type/loading.js",
+          "./dist/collection/type/text.js",
           "./dist/collection/type/typography.js",
+          "./dist/collection/type/variant-file-format.js",
           "./dist/collection/type/variant.js"
@@ -84,7 +99,7 @@ ]
           "./dist/mds-breadcrumb/mds-breadcrumb.js",
-          "./dist/mds-breadcrumb/p-406f8791.system.entry.js",
           "./dist/mds-breadcrumb/p-50ea2036.system.js",
           "./dist/mds-breadcrumb/p-67d90702.js",
-          "./dist/mds-breadcrumb/p-cd30aef8.entry.js",
-          "./dist/mds-breadcrumb/p-f427aa24.system.js",
+          "./dist/mds-breadcrumb/p-6f909ae5.entry.js",
+          "./dist/mds-breadcrumb/p-974424a7.system.js",
+          "./dist/mds-breadcrumb/p-cca324d1.system.entry.js",
           "./dist/mds-breadcrumb/p-f59e1e58.system.js",
@@ -94,7 +109,7 @@ "./www/build/index.esm.js",
           "./www/build/mds-breadcrumb.js",
-          "./www/build/p-406f8791.system.entry.js",
           "./www/build/p-50ea2036.system.js",
           "./www/build/p-67d90702.js",
-          "./www/build/p-cd30aef8.entry.js",
-          "./www/build/p-f427aa24.system.js",
+          "./www/build/p-6f909ae5.entry.js",
+          "./www/build/p-974424a7.system.js",
+          "./www/build/p-cca324d1.system.entry.js",
           "./www/build/p-f59e1e58.system.js"
@@ -133,8 +148,8 @@ ]
         ],
-        "bundleId": "p-cd30aef8",
-        "fileName": "p-cd30aef8.entry.js",
+        "bundleId": "p-6f909ae5",
+        "fileName": "p-6f909ae5.entry.js",
         "imports": [
           "p-67d90702.js"
         ],
-        "originalByteSize": 9257
+        "originalByteSize": 11345
       }
@@ -153,3 +168,3 @@ ],
         ],
-        "originalByteSize": 9261
+        "originalByteSize": 11349
       }
@@ -168,3 +183,3 @@ ],
         ],
-        "originalByteSize": 9261
+        "originalByteSize": 11349
       }
@@ -178,8 +193,8 @@ ],
         ],
-        "bundleId": "p-406f8791.system",
-        "fileName": "p-406f8791.system.entry.js",
+        "bundleId": "p-cca324d1.system",
+        "fileName": "p-cca324d1.system.entry.js",
         "imports": [
           "p-f59e1e58.system.js"
         ],
-        "originalByteSize": 11095
+        "originalByteSize": 13183
       }
@@ -198,3 +213,3 @@ ],
         ],
-        "originalByteSize": 9320
+        "originalByteSize": 11402
       }
@@ -261,3 +276,5 @@ ]
       "methods": [],
-      "potentialCmpRefs": [],
+      "potentialCmpRefs": [
+        "mds-button"
+      ],
       "properties": [
@@ -489,10 +506,8 @@ {
           "htmlAttrNames": [
-            "tabindex",
             "class",
-            "onClick",
-            "innerHTML"
+            "icon",
+            "onClick"
           ],
           "htmlTagNames": [
-            "div",
-            "i",
+            "mds-button",
             "slot"
@@ -502,3 +517,5 @@ ],
           "isUpdateable": true,
-          "potentialCmpRefs": [],
+          "potentialCmpRefs": [
+            "mds-button"
+          ],
           "dependents": [],
@@ -520,4 +537,22 @@ "dependencies": [],
     "./src/common/aria.ts": [],
+    "./src/common/file.ts": [],
+    "./src/common/icon.ts": [],
     "./src/common/keyboard-manager.ts": [],
     "./src/common/unit.ts": [],
+    "./src/common/yugop/core.ts": [
+      "./src/common/yugop/utils/math",
+      "./src/common/yugop/utils/prng",
+      "./src/common/yugop/utils/string"
+    ],
+    "./src/common/yugop/index.ts": [],
+    "./src/common/yugop/random-text.ts": [
+      "./src/common/yugop/core",
+      "./src/common/yugop/utils/noop"
+    ],
+    "./src/common/yugop/utils/math.ts": [
+      "./src/common/yugop/utils/prng"
+    ],
+    "./src/common/yugop/utils/noop.ts": [],
+    "./src/common/yugop/utils/prng.ts": [],
+    "./src/common/yugop/utils/string.ts": [],
     "./src/components/mds-breadcrumb/mds-breadcrumb.tsx": [],
@@ -530,2 +565,3 @@ "./src/components/mds-breadcrumb/meta/event-detail.ts": [],
     "./src/dictionary/color.ts": [],
+    "./src/dictionary/file-extensions.ts": [],
     "./src/dictionary/floating-ui.ts": [],
@@ -538,8 +574,11 @@ "./src/dictionary/icon.ts": [
     "./src/dictionary/loading.ts": [],
+    "./src/dictionary/text.ts": [],
     "./src/dictionary/typography.ts": [],
     "./src/dictionary/variant.ts": [],
     "./src/fixtures/cities.ts": [],
+    "./src/fixtures/filenames.ts": [],
     "./src/interface/input-value.ts": [],
     "./src/type/autocomplete.ts": [],
     "./src/type/button.ts": [],
+    "./src/type/file-types.ts": [],
     "./src/type/floating-ui.ts": [],
@@ -549,3 +588,5 @@ "./src/type/form-rel.ts": [],
     "./src/type/loading.ts": [],
+    "./src/type/text.ts": [],
     "./src/type/typography.ts": [],
+    "./src/type/variant-file-format.ts": [],
     "./src/type/variant.ts": []
@@ -552,0 +593,0 @@ },

dist/types/common/unit.d.ts

 declare const cssDurationToMilliseconds: (duration: string, defaultValue?: number) => number;
-export { cssDurationToMilliseconds, };
+declare const cssSizeToNumber: (size: string, defaultValue?: number) => number;
+export { cssDurationToMilliseconds, cssSizeToNumber, };

dist/types/dictionary/icon.d.ts

 declare const iconsDictionary: string[];
 declare const mggIconsDictionary: string[];
-export { iconsDictionary, mggIconsDictionary, };
+declare const svgIconsDictionary: string[];
+export { iconsDictionary, mggIconsDictionary, svgIconsDictionary, };

dist/types/dictionary/variant.d.ts

@@ -5,2 +5,3 @@ declare const themeVariantDictionary: string[];
 declare const themeFullVariantDictionary: string[];
+declare const themeFullVariantAvatarDictionary: string[];
 declare const themeLabelVariantDictionary: string[];
@@ -11,2 +12,2 @@ declare const toneVariantDictionary: string[];
 declare const toneMinimalVariantDictionary: string[];
-export { themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };

dist/types/type/variant.d.ts

 export type ThemeStatusVariantType = 'error' | 'info' | 'success' | 'warning';
 export type ThemeVariantType = 'dark' | 'error' | 'info' | 'light' | 'primary' | 'success' | 'warning';
 export type ThemeFullVariantType = 'amaranth' | 'aqua' | 'blue' | 'dark' | 'error' | 'green' | 'info' | 'light' | 'lime' | 'orange' | 'orchid' | 'sky' | 'success' | 'violet' | 'warning' | 'yellow';
+export type ThemeFullVariantAvatarType = 'amaranth' | 'aqua' | 'blue' | 'error' | 'green' | 'info' | 'lime' | 'orange' | 'orchid' | 'primary' | 'sky' | 'success' | 'violet' | 'warning' | 'yellow';
 export type ThemeLuminanceVariantType = 'dark' | 'light';
@@ -5,0 +6,0 @@ export type LabelVariantType = 'amaranth' | 'aqua' | 'blue' | 'green' | 'lime' | 'orange' | 'orchid' | 'sky' | 'violet' | 'yellow';

documentation.json

 {
-  "timestamp": "2024-01-10T08:00:22",
+  "timestamp": "2024-02-09T11:00:13",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.9.1",
-    "typescriptVersion": "5.2.2"
+    "version": "4.10.0",
+    "typescriptVersion": "5.3.3"
   },
@@ -139,4 +139,15 @@ "components": [
       "dependents": [],
-      "dependencies": [],
-      "dependencyGraph": {}
+      "dependencies": [
+        "mds-button"
+      ],
+      "dependencyGraph": {
+        "mds-breadcrumb": [
+          "mds-button"
+        ],
+        "mds-button": [
+          "mds-spinner",
+          "mds-icon",
+          "mds-text"
+        ]
+      }
     }
@@ -165,2 +176,12 @@ ],
     },
+    "src/type/variant.ts::ToneMinimalVariantType": {
+      "declaration": "export type ToneMinimalVariantType =\n| 'strong'\n| 'weak'",
+      "docstring": "",
+      "path": "src/type/variant.ts"
+    },
+    "src/type/variant.ts::ThemeFullVariantAvatarType": {
+      "declaration": "export type ThemeFullVariantAvatarType =\n  | 'amaranth'\n  | 'aqua'\n  | 'blue'\n  | 'error'\n  | 'green'\n  | 'info'\n  | 'lime'\n  | 'orange'\n  | 'orchid'\n  | 'primary'\n  | 'sky'\n  | 'success'\n  | 'violet'\n  | 'warning'\n  | 'yellow'",
+      "docstring": "",
+      "path": "src/type/variant.ts"
+    },
     "src/type/variant.ts::ThemeFullVariantType": {
@@ -271,6 +292,6 @@ "declaration": "export type ThemeFullVariantType =\n  | 'amaranth'\n  | 'aqua'\n  | 'blue'\n  | 'dark'\n  | 'error'\n  | 'green'\n  | 'info'\n  | 'light'\n  | 'lime'\n  | 'orange'\n  | 'orchid'\n  | 'sky'\n  | 'success'\n  | 'violet'\n  | 'warning'\n  | 'yellow'",
     },
-    "src/components/mds-file/meta/types.ts::ExtensionSuffixType": {
-      "declaration": "export type ExtensionSuffixType =\n  | '7z'\n  | 'ace'\n  | 'ai'\n  | 'db'\n  | 'default'\n  | 'dmg'\n  | 'doc'\n  | 'docm'\n  | 'docx'\n  | 'eml'\n  | 'eps'\n  | 'exe'\n  | 'flac'\n  | 'gif'\n  | 'htm'\n  | 'html'\n  | 'jpe'\n  | 'jpeg'\n  | 'jpg'\n  | 'js'\n  | 'json'\n  | 'jsx'\n  | 'm2v'\n  | 'mp2'\n  | 'mp3'\n  | 'mp4'\n  | 'mp4v'\n  | 'mpeg'\n  | 'mpg'\n  | 'mpg4'\n  | 'mpga'\n  | 'odp'\n  | 'ods'\n  | 'odt'\n  | 'pdf'\n  | 'php'\n  | 'png'\n  | 'ppt'\n  | 'rar'\n  | 'rtf'\n  | 'sass'\n  | 'shtml'\n  | 'svg'\n  | 'tar'\n  | 'ts'\n  | 'txt'\n  | 'wav'\n  | 'xar'\n  | 'xls'\n  | 'xlsx'\n  | 'zip'",
+    "src/type/file-types.ts::ExtensionSuffixType": {
+      "declaration": "export type ExtensionSuffixType =\n  | '7z'\n  | 'ace'\n  | 'ai'\n  | 'db'\n  | 'default'\n  | 'dmg'\n  | 'doc'\n  | 'docm'\n  | 'docx'\n  | 'eml'\n  | 'eps'\n  | 'exe'\n  | 'flac'\n  | 'gif'\n  | 'heic'\n  | 'htm'\n  | 'html'\n  | 'jpe'\n  | 'jpeg'\n  | 'jpg'\n  | 'js'\n  | 'json'\n  | 'jsx'\n  | 'm2v'\n  | 'mp2'\n  | 'mp3'\n  | 'mp4'\n  | 'mp4v'\n  | 'mpeg'\n  | 'mpg'\n  | 'mpg4'\n  | 'mpga'\n  | 'odp'\n  | 'ods'\n  | 'odt'\n  | 'pdf'\n  | 'php'\n  | 'png'\n  | 'ppt'\n  | 'rar'\n  | 'rtf'\n  | 'sass'\n  | 'shtml'\n  | 'svg'\n  | 'tar'\n  | 'tiff'\n  | 'ts'\n  | 'txt'\n  | 'wav'\n  | 'webp'\n  | 'xar'\n  | 'xls'\n  | 'xlsx'\n  | 'zip'",
       "docstring": "",
-      "path": "src/components/mds-file/meta/types.ts"
+      "path": "src/type/file-types.ts"
     },
@@ -282,2 +303,12 @@ "src/components/mds-file/meta/event-detail.ts::MdsFileEventDetail": {
     },
+    "src/type/text.ts::TypographyTruncateType": {
+      "declaration": "export type TypographyTruncateType =\n  | 'all'\n  | 'none'\n  | 'word'",
+      "docstring": "",
+      "path": "src/type/text.ts"
+    },
+    "src/components/mds-file-preview/meta/event-detail.ts::MdsFilePreviewEventDetail": {
+      "declaration": "export interface MdsFilePreviewEventDetail {\n  extension: string\n  filename: string\n  target: HTMLMdsFileElement\n}",
+      "docstring": "",
+      "path": "src/components/mds-file-preview/meta/event-detail.ts"
+    },
     "src/components/mds-filter/meta/event-detail.ts::MdsFilterEventDetail": {
@@ -418,2 +449,7 @@ "declaration": "export interface MdsFilterEventDetail {\n  children: NodeListOf<HTMLMdsFilterItemElement>\n  value: string\n}",
     },
+    "src/components/mds-input-upload/meta/types.ts::AttachmentSort": {
+      "declaration": "enum AttachmentSort {\n  status = 'status',\n  date = 'date',\n}",
+      "docstring": "",
+      "path": "src/components/mds-input-upload/meta/types.ts"
+    },
     "src/type/typography.ts::TypographyType": {
@@ -459,2 +495,7 @@ "declaration": "export type TypographyType =\n  | 'action'\n  | 'caption'\n  | 'snippet'\n  | 'detail'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6'\n  | 'hack'\n  | 'label'\n  | 'option'\n  | 'paragraph'\n  | 'tip'",
     },
+    "src/components/mds-push-notification/meta/types.ts::NotificationPreviewType": {
+      "declaration": "export type NotificationPreviewType =\n  | 'avatar'\n  | 'image'",
+      "docstring": "",
+      "path": "src/components/mds-push-notification/meta/types.ts"
+    },
     "src/components/mds-stepper-bar/meta/event-detail.ts::MdsStepperBarEventDetail": {
@@ -471,3 +512,3 @@ "declaration": "export interface MdsStepperBarEventDetail {\n  step: number\n  value: string\n}",
     "src/components/mds-tab/meta/event-detail.ts::MdsTabEventDetail": {
-      "declaration": "export interface MdsTabEventDetail {\n  id: number\n}",
+      "declaration": "export interface MdsTabEventDetail {\n  id: number\n  value?: string\n}",
       "docstring": "",
@@ -486,2 +527,12 @@ "path": "src/components/mds-tab/meta/event-detail.ts"
     },
+    "src/components/mds-tab-item/meta/event-detail.ts::MdsTabItemEventDetail": {
+      "declaration": "export interface MdsTabItemEventDetail {\n  target: HTMLMdsTabItemElement\n  value?: string\n}",
+      "docstring": "",
+      "path": "src/components/mds-tab-item/meta/event-detail.ts"
+    },
+    "src/components/mds-text/meta/types.ts::TextAnimationType": {
+      "declaration": "export type TextAnimationType =\n  | 'none'\n  | 'yugop'",
+      "docstring": "",
+      "path": "src/components/mds-text/meta/types.ts"
+    },
     "src/components/mds-text/meta/types.ts::TypographyTagType": {
@@ -497,7 +548,2 @@ "declaration": "export type TypographyTagType =\n  | 'abbr'\n  | 'address'\n  | 'article'\n  | 'b'\n  | 'bdo'\n  | 'blockquote'\n  | 'cite'\n  | 'code'\n  | 'dd'\n  | 'del'\n  | 'details'\n  | 'dfn'\n  | 'div'\n  | 'dl'\n  | 'dt'\n  | 'em'\n  | 'figcaption'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6'\n  | 'i'\n  | 'ins'\n  | 'kbd'\n  | 'label'\n  | 'legend'\n  | 'li'\n  | 'mark'\n  | 'ol'\n  | 'p'\n  | 'pre'\n  | 'q'\n  | 'rb'\n  | 'rt'\n  | 'ruby'\n  | 's'\n  | 'samp'\n  | 'small'\n  | 'span'\n  | 'strong'\n  | 'sub'\n  | 'summary'\n  | 'sup'\n  | 'time'\n  | 'u'\n  | 'ul'\n  | 'var'",
     },
-    "src/type/variant.ts::ToneMinimalVariantType": {
-      "declaration": "export type ToneMinimalVariantType =\n| 'strong'\n| 'weak'",
-      "docstring": "",
-      "path": "src/type/variant.ts"
-    },
     "src/components/mds-toast/meta/types.ts::ToastPosition": {
@@ -504,0 +550,0 @@ "declaration": "export type ToastPosition =\n  | 'top-left'\n  | 'top-center'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-center'\n  | 'bottom-right'",

package.json

 {
   "name": "@maggioli-design-system/mds-breadcrumb",
-  "version": "2.6.4",
+  "version": "2.7.0",
   "description": "mds-breadcrumb 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.",
@@ -27,5 +27,6 @@ "main": "dist/index.cjs.js",
   "dependencies": {
+    "@maggioli-design-system/mds-button": "4.15.0",
     "@maggioli-design-system/mds-breadcrumb-item": "2.6.4",
-    "@maggioli-design-system/styles": "14.1.0",
-    "@stencil/core": "4.9.1"
+    "@maggioli-design-system/styles": "14.2.1",
+    "@stencil/core": "4.10.0"
   },
@@ -32,0 +33,0 @@ "license": "MIT",

readme.md

@@ -47,4 +47,20 @@ # mds-breadcrumb
 
+## Dependencies
+
+### Depends on
+
+- [mds-button](../mds-button)
+
+### Graph
+```mermaid
+graph TD;
+  mds-breadcrumb --> mds-button
+  mds-button --> mds-spinner
+  mds-button --> mds-icon
+  mds-button --> mds-text
+  style mds-breadcrumb fill:#f9f,stroke:#333,stroke-width:4px
+```
+
 ----------------------------------------------
 
 Built with love @ [Gruppo Maggioli](https://www.maggioli.com) from [R&D Department](https://www.maggioli.com/it-it/chi-siamo/ricerca-sviluppo)

src/common/unit.ts

 const cssDurationToMilliseconds = (duration: string, defaultValue = 1000): number => {
+
+  if (duration.includes('ms')) {
+    return Number(duration.replace('ms', ''))
+  }
+
   if (duration.includes('s')) {
@@ -6,10 +11,24 @@ return Number(duration.replace('s', '')) * 1000
 
-  if (duration.includes('ms')) {
-    return Number(duration.replace('s', ''))
+  return defaultValue
+}
+
+const cssSizeToNumber = (size: string, defaultValue = 0): number => {
+  if (size.includes('px')) {
+    return Number(size.replace('px', ''))
   }
 
+  if (size.includes('rem')) {
+    return Number(size.replace('rem', '')) * 16
+  }
+
+  if (size.includes('em')) {
+    return Number(size.replace('em', '')) * 16
+  }
+  
   return defaultValue
 }
+
 export {
   cssDurationToMilliseconds,
+  cssSizeToNumber,
 }

src/dictionary/icon.ts

@@ -5,2 +5,7 @@ import jsonIconsDictionary from '../fixtures/icons.json'
 const mggIconsDictionary = jsonMggIconsDictionary
+const svgIconsDictionary = [
+  `${location.origin}/svg/mi/baseline/email.svg`,
+  'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Im0yMzMtODAgNjUtMjgxTDgwLTU1MGwyODgtMjUgMTEyLTI2NSAxMTIgMjY1IDI4OCAyNS0yMTggMTg5IDY1IDI4MS0yNDctMTQ5TDIzMy04MFoiLz48L3N2Zz4=',
+  '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8z"/></svg>',
+]
 
@@ -10,2 +15,3 @@ export {
   mggIconsDictionary,
+  svgIconsDictionary,
 }

src/dictionary/variant.ts

@@ -42,2 +42,20 @@ const themeVariantDictionary = [
 
+const themeFullVariantAvatarDictionary = [
+  'amaranth',
+  'aqua',
+  'blue',
+  'error',
+  'green',
+  'info',
+  'lime',
+  'orange',
+  'orchid',
+  'primary',
+  'sky',
+  'success',
+  'violet',
+  'warning',
+  'yellow',
+]
+
 const themeLabelVariantDictionary = [
@@ -84,2 +102,3 @@ 'amaranth',
 export {
+  themeFullVariantAvatarDictionary,
   themeFullVariantDictionary,
@@ -86,0 +105,0 @@ themeLabelVariantDictionary,

src/fixtures/icons.json

@@ -9,2 +9,3 @@ [
     "mdi/email",
+    "mdi/file-document-remove-outline",
     "mdi/harddisk",
@@ -25,2 +26,3 @@ "mdi/map-marker",
     "mgg/action-show-sidebar-right",
+    "mgg/activation-key",
     "mgg/activity-list",
@@ -232,2 +234,3 @@ "mgg/add-document-settings",
     "mgg/touchpoint-laptop-info",
+    "mgg/touchpoint-laptop-search",
     "mgg/traffic-cone",
@@ -245,2 +248,3 @@ "mgg/trending-down",
     "mgg/view-side-by-side",
+    "mgg/warning-superscript",
     "mgg/work-book",
@@ -250,2 +254,3 @@ "mi/baseline/account-balance",
     "mi/baseline/add",
+    "mi/baseline/add-circle",
     "mi/baseline/adobe",
@@ -256,2 +261,3 @@ "mi/baseline/agriculture",
     "mi/baseline/attach-file",
+    "mi/baseline/attachment",
     "mi/baseline/audiotrack",
@@ -262,2 +268,3 @@ "mi/baseline/badge",
     "mi/baseline/cancel",
+    "mi/baseline/category",
     "mi/baseline/check-box",
@@ -275,2 +282,3 @@ "mi/baseline/check-box-outline-blank",
     "mi/baseline/explore",
+    "mi/baseline/file-download-done",
     "mi/baseline/folder-zip",
@@ -295,2 +303,3 @@ "mi/baseline/groups",
     "mi/baseline/remove",
+    "mi/baseline/remove-circle",
     "mi/baseline/route",
@@ -307,2 +316,3 @@ "mi/baseline/settings",
     "mi/outline/help-outline",
+    "mi/outline/schedule",
     "mi/round/arrow-circle-down",
@@ -309,0 +319,0 @@ "mi/round/email",

src/fixtures/iconsauce.json

@@ -13,2 +13,3 @@ [
     "mgg/action-show-sidebar-right",
+    "mgg/activation-key",
     "mgg/activity-list",
@@ -220,2 +221,3 @@ "mgg/add-document-settings",
     "mgg/touchpoint-laptop-info",
+    "mgg/touchpoint-laptop-search",
     "mgg/traffic-cone",
@@ -233,3 +235,4 @@ "mgg/trending-down",
     "mgg/view-side-by-side",
+    "mgg/warning-superscript",
     "mgg/work-book"
 ]

src/type/variant.ts

@@ -34,2 +34,19 @@ export type ThemeStatusVariantType =
 
+export type ThemeFullVariantAvatarType =
+  | 'amaranth'
+  | 'aqua'
+  | 'blue'
+  | 'error'
+  | 'green'
+  | 'info'
+  | 'lime'
+  | 'orange'
+  | 'orchid'
+  | 'primary'
+  | 'sky'
+  | 'success'
+  | 'violet'
+  | 'warning'
+  | 'yellow'
+
 export type ThemeLuminanceVariantType =
@@ -36,0 +53,0 @@ | 'dark'

www/build/mds-breadcrumb.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as r}from"./p-67d90702.js";export{s as setNonce}from"./p-67d90702.js";(()=>{const r=import.meta.url,t={};return""!==r&&(t.resourcesUrl=new URL(".",r).href),e(t)})().then((e=>r([["p-cd30aef8",[[1,"mds-breadcrumb",{back:[4]},[[0,"mdsBreadcrumbItemSelect","activedEventHandler"]]]]]],e)));
+import{p as e,b as r}from"./p-67d90702.js";export{s as setNonce}from"./p-67d90702.js";(()=>{const r=import.meta.url,t={};return""!==r&&(t.resourcesUrl=new URL(".",r).href),e(t)})().then((e=>r([["p-6f909ae5",[[1,"mds-breadcrumb",{back:[4]},[[0,"mdsBreadcrumbItemSelect","activedEventHandler"]]]]]],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

Improved metrics

Total package byte prevSize

925263

increased by7.57%

Number of package files

189

increased by31.25%

Lines of code

13209

increased by12%

Number of lines in readme file

66

increased by32%

Worsened metrics

Dependency count

4

increased by33.33%

Dependency changes

• + Added@maggioli-design-system/mds-button@4.15.0

• + Added@maggioli-design-system/mds-button@4.15.0(transitive)

• + Added@maggioli-design-system/mds-icon@2.9.0(transitive)

• + Added@maggioli-design-system/mds-spinner@2.4.3(transitive)

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

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

• + Addedidb-keyval@6.2.1(transitive)

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

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

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

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

• Updated@stencil/core@4.10.0