@maggioli-design-system/styles 17.2.0 → 17.3.0

package/dist/css/globals.css

@@ -485,7 +485,7 @@
 
 @property --mds-badge-radius {
   inherits: true;
-  initial-value: 16px;
+  initial-value: 1000px;
   syntax: '<length>';
 }
 
@@ -619,28 +619,16 @@
   syntax: '<color>';
 }
 
-@property --mds-breadcrumb-button-color-current {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
-@property --mds-breadcrumb-current-button-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
 /* mds-button-dropdown */
 @property --mds-button-dropdown-radius {
   inherits: true;
-  initial-value: 24px;
+  initial-value: 40px;
   syntax: '<length>';
 }
 
 @property --mds-button-dropdown-window-radius {
   inherits: true;
-  initial-value: 24px;
+  initial-value: 40px;
   syntax: '<length>';
 }
 
@@ -669,18 +657,6 @@
   syntax: '<number>';
 }
 
-@property --mds-button-border-high-contrast-hover-width {
-  inherits: true;
-  initial-value: 3px;
-  syntax: '<length>';
-}
-
-@property --mds-button-border-high-contrast-width {
-  inherits: true;
-  initial-value: 2px;
-  syntax: '<length>';
-}
-
 @property --mds-button-border-hover-opacity {
   inherits: true;
   initial-value: 0.75;
@@ -729,6 +705,12 @@
   syntax: '<length>';
 }
 
+@property --mds-button-label-transform {
+  inherits: true;
+  initial-value: uppercase;
+  syntax: 'none | capitalize | uppercase | lowercase | full-width | full-size-kana';
+}
+
 @property --mds-button-line-clamp {
   inherits: true;
   initial-value: 1;
@@ -741,223 +723,6 @@
   syntax: '<length>';
 }
 
-/* mds-calendar-cell */
-@property --mds-calendar-cell-background {
-  inherits: true;
-  initial-value: transparent;
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-boundaries-background {
-  inherits: true;
-  initial-value: transparent;
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-boundaries-color {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-boundaries-padding {
-  inherits: true;
-  initial-value: 4px;
-  syntax: '<length>';
-}
-
-@property --mds-calendar-cell-color {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-disabled-background {
-  inherits: true;
-  initial-value: transparent;
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-disabled-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-other-month-background {
-  inherits: true;
-  initial-value: transparent;
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-other-month-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-current-month-background {
-  inherits: true;
-  initial-value: rgb(204 212 226);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-current-month-boundaries-background {
-  inherits: true;
-  initial-value: rgb( 236 237 240 );
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-current-month-boundaries-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-current-month-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-other-month-background {
-  inherits: true;
-  initial-value: rgb(220 224 231);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-other-month-boundaries-background {
-  inherits: true;
-  initial-value: rgb(248 248 248);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-other-month-boundaries-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-other-month-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-today-background {
-  inherits: true;
-  initial-value: rgb(220 224 231);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-preselection-today-color {
-  inherits: true;
-  initial-value: rgb(7 76 204);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-boundaries-border-radius {
-  inherits: true;
-  initial-value: 200px;
-  syntax: '<length>';
-}
-
-@property --mds-calendar-cell-selection-current-month-background {
-  inherits: true;
-  initial-value: rgb(36 103 231);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-boundaries-background {
-  inherits: true;
-  initial-value: rgb(248 248 248);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-boundaries-color {
-  inherits: true;
-  initial-value: rgb(73 73 73);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-color {
-  inherits: true;
-  initial-value: rgb(255 255 255);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-weekend-background {
-  inherits: true;
-  initial-value: rgb(7 76 204);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-weekend-boundaries-background {
-  inherits: true;
-  initial-value: rgb( 7 76 204 );
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-weekend-boundaries-color {
-  inherits: true;
-  initial-value: rgb(73 73 73);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-current-month-weekend-color {
-  inherits: true;
-  initial-value: rgb(148 172 218);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-other-month-background {
-  inherits: true;
-  initial-value: rgb(204 212 226);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-other-month-boundaries-background {
-  inherits: true;
-  initial-value: rgb(236 237 240);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-other-month-boundaries-color {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-other-month-color {
-  inherits: true;
-  initial-value: rgb(99 99 99);
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-selection-week-boundaries-border-radius {
-  inherits: true;
-  initial-value: 200px;
-  syntax: '<length>';
-}
-
-@property --mds-calendar-cell-size {
-  inherits: true;
-  initial-value: 48px;
-  syntax: '<length>';
-}
-
-@property --mds-calendar-cell-weekend-background {
-  inherits: true;
-  initial-value: transparent;
-  syntax: '<color>';
-}
-
-@property --mds-calendar-cell-weekend-color {
-  inherits: true;
-  initial-value: rgb(99 99 99);
-  syntax: '<color>';
-}
-
 /* mds-calendar */
 @property --mds-calendar-background {
   inherits: true;
@@ -967,16 +732,10 @@
 
 @property --mds-calendar-border-radius {
   inherits: true;
-  initial-value: 16px;
+  initial-value: 28px;
   syntax: '<length>';
 }
 
-@property --mds-calendar-day-number-color {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
 @property --mds-calendar-max-width {
   inherits: true;
   initial-value: 480px;
@@ -1017,7 +776,7 @@
 /* mds-chip */
 @property --mds-chip-background {
   inherits: true;
-  initial-value: rgb(225 225 225);
+  initial-value: rgb(255 255 255);
   syntax: '<color>';
 }
 
@@ -1079,7 +838,7 @@
 
 @property --mds-dropdown-backdrop-duration {
   inherits: true;
-  initial-value: 200ms;
+  initial-value: 300ms;
   syntax: '<time>';
 }
 
@@ -1103,13 +862,13 @@
 
 @property --mds-dropdown-duration {
   inherits: true;
-  initial-value: 0.5s;
+  initial-value: 500ms;
   syntax: '<time>';
 }
 
 @property --mds-dropdown-mouseover-delay {
   inherits: true;
-  initial-value: 0.5s;
+  initial-value: 500ms;
   syntax: '<time>';
 }
 
@@ -1309,7 +1068,7 @@
 
 @property --mds-entity-icon-radius {
   inherits: true;
-  initial-value: 12px;
+  initial-value: 20px;
   syntax: '<length>';
 }
 
@@ -1444,18 +1203,6 @@
   syntax: 'true | false';
 }
 
-@property --mds-header-color {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
-@property --mds-header-icon-color {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
 @property --mds-header-inline-margin {
   inherits: true;
   initial-value: 24px;
@@ -1738,12 +1485,6 @@
   syntax: '<color>';
 }
 
-@property --mds-input-date-icon-color-rgb {
-  inherits: true;
-  initial-value: 0 0 0;
-  syntax: '<integer>+';
-}
-
 @property --mds-input-date-variant-color-rgb {
   inherits: true;
   initial-value: 0 0 0;
@@ -2115,13 +1856,13 @@
 /* mds-keyboard */
 @property --mds-keyboard-background {
   inherits: true;
-  initial-value: rgb(201 208 219);
+  initial-value: rgb(208 208 208);
   syntax: '<color>';
 }
 
 @property --mds-keyboard-background-default {
   inherits: true;
-  initial-value: rgb(201 208 219);
+  initial-value: rgb(208 208 208);
   syntax: '<color>';
 }
 
@@ -2187,7 +1928,7 @@
 
 @property --mds-keyboard-spinner-duration {
   inherits: true;
-  initial-value: 1s;
+  initial-value: 1000ms;
   syntax: '<time>';
 }
 
@@ -2240,6 +1981,25 @@
   syntax: '<color>';
 }
 
+/* mds-link */
+@property --private-link-band {
+  inherits: false;
+  initial-value: 0px;
+  syntax: '<length>';
+}
+
+@property --private-link-fill {
+  inherits: false;
+  initial-value: 0px;
+  syntax: '<length>';
+}
+
+@property --private-link-ink {
+  inherits: false;
+  initial-value: 100%;
+  syntax: '<percentage>';
+}
+
 /* mds-list-item */
 @property --mds-list-item-icon-margin {
   inherits: true;
@@ -2431,67 +2191,6 @@
   syntax: '<number>';
 }
 
-/* mds-paginator-item */
-@property --mds-paginator-item-background {
-  inherits: true;
-  initial-value: transparent;
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-background-disabled {
-  inherits: true;
-  initial-value: rgb(225 225 225);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-background-hover {
-  inherits: true;
-  initial-value: rgb(208 208 208);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-background-selected {
-  inherits: true;
-  initial-value: rgb(7 76 204);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-color {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-color-disabled {
-  inherits: true;
-  initial-value: rgb(119 119 119);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-color-hover {
-  inherits: true;
-  initial-value: rgb(5 5 5);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-color-selected {
-  inherits: true;
-  initial-value: rgb(255 255 255);
-  syntax: '<color>';
-}
-
-@property --mds-paginator-item-radius {
-  inherits: true;
-  initial-value: 200px;
-  syntax: '<length>';
-}
-
-@property --mds-paginator-item-size {
-  inherits: true;
-  initial-value: 36px;
-  syntax: '<length>';
-}
-
 /* mds-paginator */
 @property --mds-paginator-background {
   inherits: true;
@@ -2606,11 +2305,7 @@
 }
 
 /* mds-price-table-features */
-@property --mds-price-table-features-border-color {
-  inherits: true;
-  initial-value: rgb(219 219 219);
-  syntax: '<color>';
-}
+
 
 /* mds-price-table-list-item */
 @property --mds-price-table-list-item-supported-icon-color {
@@ -2659,7 +2354,7 @@
 
 @property --mds-progress-radius {
   inherits: true;
-  initial-value: 28px;
+  initial-value: 40px;
   syntax: '<length>';
 }
 
@@ -3055,7 +2750,7 @@
 
 @property --mds-tab-transition-duration {
   inherits: true;
-  initial-value: 0.5s;
+  initial-value: 500ms;
   syntax: '<time>';
 }
 
@@ -3106,7 +2801,13 @@
 /* mds-table */
 @property --mds-table-border-color {
   inherits: true;
-  initial-value: rgb(196 196 196);
+  initial-value: rgb(219 219 219);
+  syntax: '<color>';
+}
+
+@property --mds-table-separator-color {
+  inherits: true;
+  initial-value: rgb(219 219 219);
   syntax: '<color>';
 }
 
@@ -3141,6 +2842,13 @@
   syntax: '<color>';
 }
 
+/* mds-toast-region */
+@property --mds-toast-region-gap {
+  inherits: true;
+  initial-value: 8px;
+  syntax: '<length>';
+}
+
 /* mds-toast */
 @property --mds-toast-background {
   inherits: true;
@@ -3187,7 +2895,7 @@
 
 @property --mds-tooltip-delay {
   inherits: true;
-  initial-value: 1s;
+  initial-value: 1000ms;
   syntax: '<time>';
 }
 
@@ -3199,7 +2907,7 @@
 
 @property --mds-tooltip-duration {
   inherits: true;
-  initial-value: 0.5s;
+  initial-value: 500ms;
   syntax: '<time>';
 }
 
@@ -3224,7 +2932,7 @@
 /* mds-tree-item */
 @property --mds-tree-item-branch-border-radius {
   inherits: true;
-  initial-value: 16px;
+  initial-value: 28px;
   syntax: '<length>';
 }
 
@@ -3235,24 +2943,6 @@
   syntax: 'true | false';
 }
 
-@property --mds-tree-toggle-icon-chevron-expanded-background {
-  inherits: true;
-  initial-value: rgb(36 103 231);
-  syntax: '<color>';
-}
-
-@property --mds-tree-toggle-icon-chevron-expanded-color {
-  inherits: true;
-  initial-value: rgb(255 255 255);
-  syntax: '<color>';
-}
-
-@property --mds-tree-toggle-icon-folder-expanded-color {
-  inherits: true;
-  initial-value: rgb(36 103 231);
-  syntax: '<color>';
-}
-
 /* mds-url-view */
 @property --mds-url-view-background {
   inherits: true;
@@ -3268,7 +2958,7 @@
 
 @property --mds-url-view-radius {
   inherits: true;
-  initial-value: 12px;
+  initial-value: 20px;
   syntax: '<length>';
 }
 

package/dist/css/hydrated.css

@@ -55,6 +55,7 @@ mds-keyboard-key:not(:is([hydrated], .hydrated)),
 mds-kpi:not(:is([hydrated], .hydrated)),
 mds-kpi-item:not(:is([hydrated], .hydrated)),
 mds-label:not(:is([hydrated], .hydrated)),
+mds-link:not(:is([hydrated], .hydrated)),
 mds-list:not(:is([hydrated], .hydrated)),
 mds-list-item:not(:is([hydrated], .hydrated)),
 mds-mention:not(:is([hydrated], .hydrated)),
@@ -105,6 +106,7 @@ mds-table-header-cell:not(:is([hydrated], .hydrated)),
 mds-table-row:not(:is([hydrated], .hydrated)),
 mds-text:not(:is([hydrated], .hydrated)),
 mds-toast:not(:is([hydrated], .hydrated)),
+mds-toast-region:not(:is([hydrated], .hydrated)),
 mds-tooltip:not(:is([hydrated], .hydrated)),
 mds-tree:not(:is([hydrated], .hydrated)),
 mds-tree-item:not(:is([hydrated], .hydrated)),
@@ -189,6 +191,7 @@ mds-keyboard-key:is([hydrated], .hydrated),
 mds-kpi:is([hydrated], .hydrated),
 mds-kpi-item:is([hydrated], .hydrated),
 mds-label:is([hydrated], .hydrated),
+mds-link:is([hydrated], .hydrated),
 mds-list:is([hydrated], .hydrated),
 mds-list-item:is([hydrated], .hydrated),
 mds-mention:is([hydrated], .hydrated),
@@ -239,6 +242,7 @@ mds-table-header-cell:is([hydrated], .hydrated),
 mds-table-row:is([hydrated], .hydrated),
 mds-text:is([hydrated], .hydrated),
 mds-toast:is([hydrated], .hydrated),
+mds-toast-region:is([hydrated], .hydrated),
 mds-tooltip:is([hydrated], .hydrated),
 mds-tree:is([hydrated], .hydrated),
 mds-tree-item:is([hydrated], .hydrated),

package/dist/css/semantic.css

@@ -187,16 +187,18 @@
   --magma-accent-ai-on-emphasis: var(--magma-tint-text-on-emphasis);
 }
 
-/* Dark ink: the canvas, not pure black (spec 6.5) */
+/* Dark: the fill ink takes the canvas (spec 6.5), the shadow ink pure black (spec 6.1c) */
 :root:not(.pref-theme-scheme-light).pref-mode-dark,
 :root.pref-theme-scheme-dark {
   --magma-tint-text-on-emphasis: var(--magma-tint-default);
+  --magma-shadow-ink: var(--tone-neutral-seed);
 }
 
 @media (prefers-color-scheme: dark) {
   :root:not(.pref-theme-scheme-light).pref-mode-system,
   :root:not([data-magma-pref]) {
     --magma-tint-text-on-emphasis: var(--magma-tint-default);
+    --magma-shadow-ink: var(--tone-neutral-seed);
   }
 }
 

package/dist/css/tailwind-theme-color.css

@@ -1,8 +1,8 @@
 /*
-@magma-design-system/design-tokens v15.2.0
+@magma-design-system/design-tokens v15.2.2
 Generated by Style Dictionary
 Do not edit directly
-Generated at Thu, 15 Oct 2026 16:07:06 GMT
+Generated at Wed, 21 Oct 2026 16:52:01 GMT
 */
 
 @theme {