@maggioli-design-system/mds-progress 2.10.2 → 2.10.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/cjs/mds-progress.cjs.entry.js +1 -1
  2. package/dist/collection/common/date.js +13 -0
  3. package/dist/collection/common/locale.js +8 -2
  4. package/dist/collection/components/mds-progress/mds-progress.css +6 -6
  5. package/dist/collection/dictionary/button.js +6 -1
  6. package/dist/collection/dictionary/variant.js +6 -1
  7. package/dist/collection/type/date.js +1 -0
  8. package/dist/components/mds-progress.js +1 -1
  9. package/dist/documentation.json +1 -1
  10. package/dist/esm/mds-progress.entry.js +1 -1
  11. package/dist/esm-es5/mds-progress.entry.js +1 -1
  12. package/dist/mds-progress/mds-progress.esm.js +1 -1
  13. package/dist/mds-progress/p-18057705.system.entry.js +1 -0
  14. package/dist/mds-progress/p-247bfa7b.system.js +1 -1
  15. package/dist/mds-progress/p-2ca5093d.entry.js +1 -0
  16. package/dist/stats.json +20 -16
  17. package/dist/types/common/date.d.ts +4 -0
  18. package/dist/types/common/locale.d.ts +3 -2
  19. package/dist/types/dictionary/button.d.ts +2 -1
  20. package/dist/types/dictionary/variant.d.ts +2 -1
  21. package/dist/types/type/date.d.ts +5 -0
  22. package/dist/types/type/variant.d.ts +1 -1
  23. package/documentation.json +18 -8
  24. package/package.json +1 -1
  25. package/src/common/date.ts +21 -0
  26. package/src/common/locale.ts +10 -4
  27. package/src/components/mds-progress/mds-progress.css +6 -6
  28. package/src/dictionary/button.ts +7 -0
  29. package/src/dictionary/variant.ts +7 -0
  30. package/src/fixtures/icons.json +17 -0
  31. package/src/fixtures/iconsauce.json +17 -0
  32. package/src/type/date.ts +10 -0
  33. package/src/type/variant.ts +1 -1
  34. package/www/build/mds-progress.esm.js +1 -1
  35. package/www/build/p-18057705.system.entry.js +1 -0
  36. package/www/build/p-247bfa7b.system.js +1 -1
  37. package/www/build/p-2ca5093d.entry.js +1 -0
  38. package/dist/mds-progress/p-63b6c1a0.system.entry.js +0 -1
  39. package/dist/mds-progress/p-a9121660.entry.js +0 -1
  40. package/www/build/p-63b6c1a0.system.entry.js +0 -1
  41. package/www/build/p-a9121660.entry.js +0 -1
package/dist/cjs/mds-progress.cjs.entry.js CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-2c37527a.js');
6
6
 
7
- const mdsProgressCss = "@tailwind components;\n@tailwind utilities;\n\n\n/* @import '../../tailwind/static-components.css'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction=\"vertical\"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant=\"dark\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant=\"light\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant=\"warning\"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant=\"success\"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant=\"info\"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n";
7
+ const mdsProgressCss = "@tailwind components;\n@tailwind utilities;\n\n\n/* @import '../../tailwind/static-components.css'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction=\"vertical\"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant=\"dark\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant=\"light\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant=\"warning\"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant=\"success\"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant=\"info\"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n";
8
8
  const MdsProgressStyle0 = mdsProgressCss;
9
9
 
10
10
  const MdsProgress = class {
package/dist/collection/common/date.js ADDED
@@ -0,0 +1,13 @@
1
+ // ISO 8601 date regex allowing optional components (month, day, time)
2
+ const ISO8601RegexString = '^\\d{4}(-\\d{2})?(-\\d{2})?(T\\d{2}(:\\d{2})?(:\\d{2})?(\\.\\d{3})?)?([+-]\\d{2}:\\d{2}|Z)?$';
3
+ const isISO8601Date = (dateString) => {
4
+ const ISO8601Regex = new RegExp(ISO8601RegexString);
5
+ return ISO8601Regex.test(dateString);
6
+ };
7
+ const sanitizeISO8601Date = (dateString) => {
8
+ if (isISO8601Date(dateString)) {
9
+ return dateString;
10
+ }
11
+ return new Date(dateString).toISOString();
12
+ };
13
+ export { sanitizeISO8601Date, isISO8601Date, };
package/dist/collection/common/locale.js CHANGED
@@ -2,15 +2,19 @@ import Handlebars from "handlebars";
2
2
  export class Locale {
3
3
  constructor(configData) {
4
4
  this.rollbackLanguage = 'en';
5
+ this.set = (configData) => {
6
+ this.config = configData;
7
+ };
5
8
  this.lang = (element) => {
6
9
  this.closestElement = element.closest('[lang]');
7
10
  if (this.closestElement) {
8
11
  if (this.closestElement.lang) {
9
12
  this.language = this.closestElement.lang;
10
- return;
13
+ return this.language;
11
14
  }
12
15
  }
13
16
  this.language = this.rollbackLanguage;
17
+ return this.language;
14
18
  };
15
19
  this.pluralize = (tag, context) => {
16
20
  const languagePhrase = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
@@ -43,6 +47,8 @@ export class Locale {
43
47
  }
44
48
  return this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
45
49
  };
46
- this.config = configData;
50
+ if (configData) {
51
+ this.set(configData);
52
+ }
47
53
  }
48
54
  }
package/dist/collection/components/mds-progress/mds-progress.css CHANGED
@@ -74,12 +74,12 @@
74
74
  @tailwind utilities;
75
75
 
76
76
  /**
77
- * @prop --mds-progress-background: Sets the background-color of the component
78
- * @prop --mds-progress-color: Sets the background-color of the progress
79
- * @prop --mds-progress-duration: Sets the duration of the progress bar animation
80
- * @prop --mds-progress-radius: Sets the border-radius of the component
81
- * @prop --mds-progress-thickness: Sets the thickness of the progress bar
82
- */
77
+ * @prop --mds-progress-background: Sets the background-color of the component
78
+ * @prop --mds-progress-color: Sets the background-color of the progress
79
+ * @prop --mds-progress-duration: Sets the duration of the progress bar animation
80
+ * @prop --mds-progress-radius: Sets the border-radius of the component
81
+ * @prop --mds-progress-thickness: Sets the thickness of the progress bar
82
+ */
83
83
 
84
84
  :host {
85
85
 
package/dist/collection/dictionary/button.js CHANGED
@@ -27,4 +27,9 @@ const buttonIconPositionDictionary = [
27
27
  'left',
28
28
  'right',
29
29
  ];
30
- export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonVariantDictionary, };
30
+ const buttonTypeDictionary = [
31
+ 'button',
32
+ 'submit',
33
+ 'reset',
34
+ ];
35
+ export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, };
package/dist/collection/dictionary/variant.js CHANGED
@@ -83,8 +83,13 @@ const toneSimpleVariantDictionary = [
83
83
  'weak',
84
84
  'quiet',
85
85
  ];
86
+ const toneSmartVariantDictionary = [
87
+ 'strong',
88
+ 'weak',
89
+ 'ghost',
90
+ ];
86
91
  const toneMinimalVariantDictionary = [
87
92
  'strong',
88
93
  'weak',
89
94
  ];
90
- export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
95
+ export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };
package/dist/collection/type/date.js ADDED
@@ -0,0 +1 @@
1
+ export {};
package/dist/components/mds-progress.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
2
 
3
- const mdsProgressCss = "@tailwind components;\n@tailwind utilities;\n\n\n/* @import '../../tailwind/static-components.css'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction=\"vertical\"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant=\"dark\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant=\"light\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant=\"warning\"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant=\"success\"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant=\"info\"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n";
3
+ const mdsProgressCss = "@tailwind components;\n@tailwind utilities;\n\n\n/* @import '../../tailwind/static-components.css'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction=\"vertical\"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant=\"dark\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant=\"light\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant=\"warning\"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant=\"success\"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant=\"info\"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n";
4
4
  const MdsProgressStyle0 = mdsProgressCss;
5
5
 
6
6
  const MdsProgress$1 = /*@__PURE__*/ proxyCustomElement(class MdsProgress extends HTMLElement {
package/dist/documentation.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2024-09-17T06:01:36",
2
+ "timestamp": "2024-09-26T11:02:40",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.21.0",
package/dist/esm/mds-progress.entry.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { r as registerInstance, h, H as Host, g as getElement } from './index-2c599ac6.js';
2
2
 
3
- const mdsProgressCss = "@tailwind components;\n@tailwind utilities;\n\n\n/* @import '../../tailwind/static-components.css'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction=\"vertical\"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant=\"dark\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant=\"light\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant=\"warning\"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant=\"success\"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant=\"info\"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n";
3
+ const mdsProgressCss = "@tailwind components;\n@tailwind utilities;\n\n\n/* @import '../../tailwind/static-components.css'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction=\"vertical\"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant=\"dark\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant=\"light\"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant=\"warning\"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant=\"success\"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant=\"info\"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant=\"primary\"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant=\"error\"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant=\"warning\"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant=\"success\"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant=\"info\"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n";
4
4
  const MdsProgressStyle0 = mdsProgressCss;
5
5
 
6
6
  const MdsProgress = class {
package/dist/esm-es5/mds-progress.entry.js CHANGED
@@ -1 +1 @@
1
- import{r as registerInstance,h,H as Host,g as getElement}from"./index-2c599ac6.js";var mdsProgressCss='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';var MdsProgressStyle0=mdsProgressCss;var MdsProgress=function(){function n(n){registerInstance(this,n);this.stepsList=new Array;this.currentStep=undefined;this.progress=0;this.direction="horizontal";this.variant="primary";this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}n.prototype.componentWillLoad=function(){this.stepsList=this.steps.split(",");this.setProgress(this.progress)};n.prototype.setProgress=function(n){if(this.steps){this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))];this.element.setAttribute("aria-valuetext",this.currentStep)}};n.prototype.progressChanged=function(n){this.setProgress(n)};n.prototype.stepsChanged=function(n){this.stepsList=n.split(",")};n.prototype.render=function(){return h(Host,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(this.progress*100),role:"progressbar"},h("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),h("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:this.direction==="horizontal"?{flexGrow:"".concat(this.progress)}:{flexGrow:"".concat(this.progress),width:"100%"}}))};Object.defineProperty(n.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{progress:["progressChanged"],steps:["stepsChanged"]}},enumerable:false,configurable:true});return n}();MdsProgress.style=MdsProgressStyle0;export{MdsProgress as mds_progress};
1
+ import{r as registerInstance,h,H as Host,g as getElement}from"./index-2c599ac6.js";var mdsProgressCss='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';var MdsProgressStyle0=mdsProgressCss;var MdsProgress=function(){function n(n){registerInstance(this,n);this.stepsList=new Array;this.currentStep=undefined;this.progress=0;this.direction="horizontal";this.variant="primary";this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}n.prototype.componentWillLoad=function(){this.stepsList=this.steps.split(",");this.setProgress(this.progress)};n.prototype.setProgress=function(n){if(this.steps){this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))];this.element.setAttribute("aria-valuetext",this.currentStep)}};n.prototype.progressChanged=function(n){this.setProgress(n)};n.prototype.stepsChanged=function(n){this.stepsList=n.split(",")};n.prototype.render=function(){return h(Host,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(this.progress*100),role:"progressbar"},h("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),h("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:this.direction==="horizontal"?{flexGrow:"".concat(this.progress)}:{flexGrow:"".concat(this.progress),width:"100%"}}))};Object.defineProperty(n.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{progress:["progressChanged"],steps:["stepsChanged"]}},enumerable:false,configurable:true});return n}();MdsProgress.style=MdsProgressStyle0;export{MdsProgress as mds_progress};
package/dist/mds-progress/mds-progress.esm.js CHANGED
@@ -1 +1 @@
1
- import{p as r,b as e}from"./p-313d3f72.js";export{s as setNonce}from"./p-313d3f72.js";import{g as p}from"./p-e1255160.js";(()=>{const s=import.meta.url,e={};return""!==s&&(e.resourcesUrl=new URL(".",s).href),r(e)})().then((async s=>(await p(),e([["p-a9121660",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],s))));
1
+ import{p as r,b as e}from"./p-313d3f72.js";export{s as setNonce}from"./p-313d3f72.js";import{g as p}from"./p-e1255160.js";(()=>{const s=import.meta.url,e={};return""!==s&&(e.resourcesUrl=new URL(".",s).href),r(e)})().then((async s=>(await p(),e([["p-2ca5093d",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],s))));
package/dist/mds-progress/p-18057705.system.entry.js ADDED
@@ -0,0 +1 @@
1
+ System.register(["./p-ecdde885.system.js"],(function(n){"use strict";var r,t,a,o;return{setters:[function(n){r=n.r;t=n.h;a=n.H;o=n.g}],execute:function(){var e='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';var s=e;var i=n("mds_progress",function(){function n(n){r(this,n);this.stepsList=new Array;this.currentStep=undefined;this.progress=0;this.direction="horizontal";this.variant="primary";this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}n.prototype.componentWillLoad=function(){this.stepsList=this.steps.split(",");this.setProgress(this.progress)};n.prototype.setProgress=function(n){if(this.steps){this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))];this.element.setAttribute("aria-valuetext",this.currentStep)}};n.prototype.progressChanged=function(n){this.setProgress(n)};n.prototype.stepsChanged=function(n){this.stepsList=n.split(",")};n.prototype.render=function(){return t(a,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(this.progress*100),role:"progressbar"},t("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),t("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:this.direction==="horizontal"?{flexGrow:"".concat(this.progress)}:{flexGrow:"".concat(this.progress),width:"100%"}}))};Object.defineProperty(n.prototype,"element",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{progress:["progressChanged"],steps:["stepsChanged"]}},enumerable:false,configurable:true});return n}());i.style=s}}}));
package/dist/mds-progress/p-247bfa7b.system.js CHANGED
@@ -1 +1 @@
1
- var __awaiter=this&&this.__awaiter||function(t,n,e,r){function i(t){return t instanceof e?t:new e((function(n){n(t)}))}return new(e||(e=Promise))((function(e,s){function u(t){try{o(r.next(t))}catch(t){s(t)}}function c(t){try{o(r["throw"](t))}catch(t){s(t)}}function o(t){t.done?e(t.value):i(t.value).then(u,c)}o((r=r.apply(t,n||[])).next())}))};var __generator=this&&this.__generator||function(t,n){var e={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},r,i,s,u;return u={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(u[Symbol.iterator]=function(){return this}),u;function c(t){return function(n){return o([t,n])}}function o(c){if(r)throw new TypeError("Generator is already executing.");while(u&&(u=0,c[0]&&(e=0)),e)try{if(r=1,i&&(s=c[0]&2?i["return"]:c[0]?i["throw"]||((s=i["return"])&&s.call(i),0):i.next)&&!(s=s.call(i,c[1])).done)return s;if(i=0,s)c=[c[0]&2,s.value];switch(c[0]){case 0:case 1:s=c;break;case 4:e.label++;return{value:c[1],done:false};case 5:e.label++;i=c[1];c=[0];continue;case 7:c=e.ops.pop();e.trys.pop();continue;default:if(!(s=e.trys,s=s.length>0&&s[s.length-1])&&(c[0]===6||c[0]===2)){e=0;continue}if(c[0]===3&&(!s||c[1]>s[0]&&c[1]<s[3])){e.label=c[1];break}if(c[0]===6&&e.label<s[1]){e.label=s[1];s=c;break}if(s&&e.label<s[2]){e.label=s[2];e.ops.push(c);break}if(s[2])e.ops.pop();e.trys.pop();continue}c=n.call(t,e)}catch(t){c=[6,t];i=0}finally{r=s=0}if(c[0]&5)throw c[1];return{value:c[0]?c[1]:void 0,done:true}}};System.register(["./p-ecdde885.system.js","./p-56ba5cbf.system.js"],(function(t,n){"use strict";var e,r,i;return{setters:[function(n){e=n.p;r=n.b;t("setNonce",n.s)},function(t){i=t.g}],execute:function(){var t=this;var s=function(){var t=n.meta.url;var r={};if(t!==""){r.resourcesUrl=new URL(".",t).href}return e(r)};s().then((function(n){return __awaiter(t,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,i()];case 1:t.sent();return[2,r([["p-63b6c1a0.system",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],n)]}}))}))}))}}}));
1
+ var __awaiter=this&&this.__awaiter||function(t,n,e,r){function i(t){return t instanceof e?t:new e((function(n){n(t)}))}return new(e||(e=Promise))((function(e,s){function u(t){try{c(r.next(t))}catch(t){s(t)}}function o(t){try{c(r["throw"](t))}catch(t){s(t)}}function c(t){t.done?e(t.value):i(t.value).then(u,o)}c((r=r.apply(t,n||[])).next())}))};var __generator=this&&this.__generator||function(t,n){var e={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},r,i,s,u;return u={next:o(0),throw:o(1),return:o(2)},typeof Symbol==="function"&&(u[Symbol.iterator]=function(){return this}),u;function o(t){return function(n){return c([t,n])}}function c(o){if(r)throw new TypeError("Generator is already executing.");while(u&&(u=0,o[0]&&(e=0)),e)try{if(r=1,i&&(s=o[0]&2?i["return"]:o[0]?i["throw"]||((s=i["return"])&&s.call(i),0):i.next)&&!(s=s.call(i,o[1])).done)return s;if(i=0,s)o=[o[0]&2,s.value];switch(o[0]){case 0:case 1:s=o;break;case 4:e.label++;return{value:o[1],done:false};case 5:e.label++;i=o[1];o=[0];continue;case 7:o=e.ops.pop();e.trys.pop();continue;default:if(!(s=e.trys,s=s.length>0&&s[s.length-1])&&(o[0]===6||o[0]===2)){e=0;continue}if(o[0]===3&&(!s||o[1]>s[0]&&o[1]<s[3])){e.label=o[1];break}if(o[0]===6&&e.label<s[1]){e.label=s[1];s=o;break}if(s&&e.label<s[2]){e.label=s[2];e.ops.push(o);break}if(s[2])e.ops.pop();e.trys.pop();continue}o=n.call(t,e)}catch(t){o=[6,t];i=0}finally{r=s=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};System.register(["./p-ecdde885.system.js","./p-56ba5cbf.system.js"],(function(t,n){"use strict";var e,r,i;return{setters:[function(n){e=n.p;r=n.b;t("setNonce",n.s)},function(t){i=t.g}],execute:function(){var t=this;var s=function(){var t=n.meta.url;var r={};if(t!==""){r.resourcesUrl=new URL(".",t).href}return e(r)};s().then((function(n){return __awaiter(t,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,i()];case 1:t.sent();return[2,r([["p-18057705.system",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],n)]}}))}))}))}}}));
package/dist/mds-progress/p-2ca5093d.entry.js ADDED
@@ -0,0 +1 @@
1
+ import{r as n,h as r,H as t,g as a}from"./p-313d3f72.js";const o=class{constructor(r){n(this,r),this.stepsList=new Array,this.currentStep=void 0,this.progress=0,this.direction="horizontal",this.variant="primary",this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}componentWillLoad(){this.stepsList=this.steps.split(","),this.setProgress(this.progress)}setProgress(n){this.steps&&(this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))],this.element.setAttribute("aria-valuetext",this.currentStep))}progressChanged(n){this.setProgress(n)}stepsChanged(n){this.stepsList=n.split(",")}render(){return r(t,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(100*this.progress),role:"progressbar"},r("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),r("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:"horizontal"===this.direction?{flexGrow:`${this.progress}`}:{flexGrow:`${this.progress}`,width:"100%"}}))}get element(){return a(this)}static get watchers(){return{progress:["progressChanged"],steps:["stepsChanged"]}}};o.style='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';export{o as mds_progress}
package/dist/stats.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2024-09-17T06:01:36",
2
+ "timestamp": "2024-09-26T11:02:40",
3
3
  "compiler": {
4
4
  "name": "node",
5
5
  "version": "20.10.0"
@@ -9,13 +9,14 @@
9
9
  "fsNamespace": "mds-progress",
10
10
  "components": 1,
11
11
  "entries": 1,
12
- "bundles": 92,
12
+ "bundles": 94,
13
13
  "outputs": [
14
14
  {
15
15
  "name": "dist-collection",
16
- "files": 44,
16
+ "files": 46,
17
17
  "generatedFiles": [
18
18
  "./dist/collection/common/aria.js",
19
+ "./dist/collection/common/date.js",
19
20
  "./dist/collection/common/file.js",
20
21
  "./dist/collection/common/icon.js",
21
22
  "./dist/collection/common/keyboard-manager.js",
@@ -48,6 +49,7 @@
48
49
  "./dist/collection/interface/input-value.js",
49
50
  "./dist/collection/type/autocomplete.js",
50
51
  "./dist/collection/type/button.js",
52
+ "./dist/collection/type/date.js",
51
53
  "./dist/collection/type/file-types.js",
52
54
  "./dist/collection/type/floating-ui.js",
53
55
  "./dist/collection/type/form-rel.js",
@@ -98,23 +100,23 @@
98
100
  "./dist/mds-progress/index.esm.js",
99
101
  "./dist/mds-progress/mds-progress.esm.js",
100
102
  "./dist/mds-progress/mds-progress.js",
103
+ "./dist/mds-progress/p-18057705.system.entry.js",
101
104
  "./dist/mds-progress/p-247bfa7b.system.js",
105
+ "./dist/mds-progress/p-2ca5093d.entry.js",
102
106
  "./dist/mds-progress/p-313d3f72.js",
103
107
  "./dist/mds-progress/p-50ea2036.system.js",
104
108
  "./dist/mds-progress/p-56ba5cbf.system.js",
105
- "./dist/mds-progress/p-63b6c1a0.system.entry.js",
106
- "./dist/mds-progress/p-a9121660.entry.js",
107
109
  "./dist/mds-progress/p-e1255160.js",
108
110
  "./dist/mds-progress/p-ecdde885.system.js",
109
111
  "./www/build/index.esm.js",
110
112
  "./www/build/mds-progress.esm.js",
111
113
  "./www/build/mds-progress.js",
114
+ "./www/build/p-18057705.system.entry.js",
112
115
  "./www/build/p-247bfa7b.system.js",
116
+ "./www/build/p-2ca5093d.entry.js",
113
117
  "./www/build/p-313d3f72.js",
114
118
  "./www/build/p-50ea2036.system.js",
115
119
  "./www/build/p-56ba5cbf.system.js",
116
- "./www/build/p-63b6c1a0.system.entry.js",
117
- "./www/build/p-a9121660.entry.js",
118
120
  "./www/build/p-e1255160.js",
119
121
  "./www/build/p-ecdde885.system.js"
120
122
  ]
@@ -149,12 +151,12 @@
149
151
  "components": [
150
152
  "mds-progress"
151
153
  ],
152
- "bundleId": "p-a9121660",
153
- "fileName": "p-a9121660.entry.js",
154
+ "bundleId": "p-2ca5093d",
155
+ "fileName": "p-2ca5093d.entry.js",
154
156
  "imports": [
155
157
  "p-313d3f72.js"
156
158
  ],
157
- "originalByteSize": 13025
159
+ "originalByteSize": 13037
158
160
  }
159
161
  ],
160
162
  "esm": [
@@ -168,7 +170,7 @@
168
170
  "imports": [
169
171
  "index-2c599ac6.js"
170
172
  ],
171
- "originalByteSize": 13029
173
+ "originalByteSize": 13041
172
174
  }
173
175
  ],
174
176
  "es5": [
@@ -182,7 +184,7 @@
182
184
  "imports": [
183
185
  "index-2c599ac6.js"
184
186
  ],
185
- "originalByteSize": 13029
187
+ "originalByteSize": 13041
186
188
  }
187
189
  ],
188
190
  "system": [
@@ -191,12 +193,12 @@
191
193
  "components": [
192
194
  "mds-progress"
193
195
  ],
194
- "bundleId": "p-63b6c1a0.system",
195
- "fileName": "p-63b6c1a0.system.entry.js",
196
+ "bundleId": "p-18057705.system",
197
+ "fileName": "p-18057705.system.entry.js",
196
198
  "imports": [
197
199
  "p-ecdde885.system.js"
198
200
  ],
199
- "originalByteSize": 13490
201
+ "originalByteSize": 13502
200
202
  }
201
203
  ],
202
204
  "commonjs": [
@@ -210,7 +212,7 @@
210
212
  "imports": [
211
213
  "index-2c37527a.js"
212
214
  ],
213
- "originalByteSize": 13094
215
+ "originalByteSize": 13106
214
216
  }
215
217
  ]
216
218
  },
@@ -598,6 +600,7 @@
598
600
  },
599
601
  "sourceGraph": {
600
602
  "./src/common/aria.ts": [],
603
+ "./src/common/date.ts": [],
601
604
  "./src/common/file.ts": [],
602
605
  "./src/common/icon.ts": [],
603
606
  "./src/common/keyboard-manager.ts": [],
@@ -644,6 +647,7 @@
644
647
  "./src/interface/input-value.ts": [],
645
648
  "./src/type/autocomplete.ts": [],
646
649
  "./src/type/button.ts": [],
650
+ "./src/type/date.ts": [],
647
651
  "./src/type/file-types.ts": [],
648
652
  "./src/type/floating-ui.ts": [],
649
653
  "./src/type/form-rel.ts": [],
package/dist/types/common/date.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import { ISO8601Date } from '@type/date';
2
+ declare const isISO8601Date: (dateString: string) => boolean;
3
+ declare const sanitizeISO8601Date: (dateString: string) => ISO8601Date;
4
+ export { sanitizeISO8601Date, isISO8601Date, };
package/dist/types/common/locale.d.ts CHANGED
@@ -9,8 +9,9 @@ export declare class Locale {
9
9
  language: string;
10
10
  config: LocaleConfig;
11
11
  closestElement: HTMLElement;
12
- constructor(configData: LocaleConfig);
13
- lang: (element: HTMLElement) => void;
12
+ constructor(configData?: LocaleConfig);
13
+ set: (configData: LocaleConfig) => void;
14
+ lang: (element: HTMLElement) => string;
14
15
  private pluralize;
15
16
  get: (tag: string | string[], context?: Record<string, string | number>) => string;
16
17
  }
package/dist/types/dictionary/button.d.ts CHANGED
@@ -3,4 +3,5 @@ declare const buttonToneVariantDictionary: string[];
3
3
  declare const buttonTargetDictionary: string[];
4
4
  declare const buttonSizeDictionary: string[];
5
5
  declare const buttonIconPositionDictionary: string[];
6
- export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonVariantDictionary, };
6
+ declare const buttonTypeDictionary: string[];
7
+ export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, };
package/dist/types/dictionary/variant.d.ts CHANGED
@@ -7,5 +7,6 @@ declare const themeLabelVariantDictionary: string[];
7
7
  declare const toneVariantDictionary: string[];
8
8
  declare const toneActionVariantDictionary: string[];
9
9
  declare const toneSimpleVariantDictionary: string[];
10
+ declare const toneSmartVariantDictionary: string[];
10
11
  declare const toneMinimalVariantDictionary: string[];
11
- export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
12
+ export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };
package/dist/types/type/date.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ type ISO8601DateFormat<K, T> = K & {
2
+ __isISO8601DateFormat: T;
3
+ };
4
+ type ISO8601Date = ISO8601DateFormat<string, 'ISO8601Date'>;
5
+ export { ISO8601Date, };
package/dist/types/type/variant.d.ts CHANGED
@@ -8,5 +8,5 @@ export type ActionVariantType = 'primary' | 'dark' | 'light';
8
8
  export type StateVariantType = 'disabled' | 'focused' | 'readonly';
9
9
  export type ToneActionVariantType = 'primary' | 'secondary' | 'tertiary' | 'strong' | 'weak' | 'ghost' | 'quiet';
10
10
  export type ToneVariantType = 'strong' | 'weak' | 'ghost' | 'quiet';
11
- export type ToneSimpleVariantType = 'strong' | 'weak' | 'quiet';
11
+ export type ToneSimpleVariantType = 'quiet' | 'strong' | 'weak';
12
12
  export type ToneMinimalVariantType = 'strong' | 'weak';
package/documentation.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2024-09-17T03:14:28",
2
+ "timestamp": "2024-09-26T07:00:37",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.21.0",
@@ -240,8 +240,8 @@
240
240
  "docstring": "",
241
241
  "path": "src/type/variant.ts"
242
242
  },
243
- "src/type/variant.ts::ToneSimpleVariantType": {
244
- "declaration": "export type ToneSimpleVariantType =\n | 'strong'\n | 'weak'\n | 'quiet'",
243
+ "src/type/variant.ts::ToneVariantType": {
244
+ "declaration": "export type ToneVariantType =\n | 'strong' // background strong\n | 'weak' // background weak\n | 'ghost' // bordered\n | 'quiet'",
245
245
  "docstring": "",
246
246
  "path": "src/type/variant.ts"
247
247
  },
@@ -265,6 +265,11 @@
265
265
  "docstring": "",
266
266
  "path": "src/type/variant.ts"
267
267
  },
268
+ "src/type/variant.ts::ToneSimpleVariantType": {
269
+ "declaration": "export type ToneSimpleVariantType =\n | 'quiet'\n | 'strong'\n | 'weak'",
270
+ "docstring": "",
271
+ "path": "src/type/variant.ts"
272
+ },
268
273
  "src/components/mds-benchmark-bar/meta/types.ts::BenchmarkBarTypographyType": {
269
274
  "declaration": "export type BenchmarkBarTypographyType =\n | 'option'\n | 'label'",
270
275
  "docstring": "",
@@ -305,11 +310,6 @@
305
310
  "docstring": "",
306
311
  "path": "src/type/button.ts"
307
312
  },
308
- "src/type/variant.ts::ToneVariantType": {
309
- "declaration": "export type ToneVariantType =\n | 'strong' // background strong\n | 'weak' // background weak\n | 'ghost' // bordered\n | 'quiet'",
310
- "docstring": "",
311
- "path": "src/type/variant.ts"
312
- },
313
313
  "src/type/button.ts::ButtonSizeType": {
314
314
  "declaration": "export type ButtonSizeType =\n | 'sm'\n | 'md'\n | 'lg'\n | 'xl'",
315
315
  "docstring": "",
@@ -585,6 +585,16 @@
585
585
  "docstring": "",
586
586
  "path": "src/components/mds-progress/meta/types.ts"
587
587
  },
588
+ "src/type/date.ts::ISO8601Date": {
589
+ "declaration": "type ISO8601Date = ISO8601DateFormat<string, 'ISO8601Date'>",
590
+ "docstring": "",
591
+ "path": "src/type/date.ts"
592
+ },
593
+ "src/components/mds-push-notification/meta/types.ts::NotificationDateFormatType": {
594
+ "declaration": "string",
595
+ "docstring": "",
596
+ "path": "src/components/mds-push-notification/meta/types.ts"
597
+ },
588
598
  "src/components/mds-push-notification/meta/types.ts::NotificationPreviewType": {
589
599
  "declaration": "export type NotificationPreviewType =\n | 'avatar'\n | 'image'",
590
600
  "docstring": "",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@maggioli-design-system/mds-progress",
3
- "version": "2.10.2",
3
+ "version": "2.10.3",
4
4
  "description": "mds-progress 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.",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
package/src/common/date.ts ADDED
@@ -0,0 +1,21 @@
1
+ import { ISO8601Date } from '@type/date'
2
+
3
+ // ISO 8601 date regex allowing optional components (month, day, time)
4
+ const ISO8601RegexString = '^\\d{4}(-\\d{2})?(-\\d{2})?(T\\d{2}(:\\d{2})?(:\\d{2})?(\\.\\d{3})?)?([+-]\\d{2}:\\d{2}|Z)?$'
5
+
6
+ const isISO8601Date = (dateString: string): boolean => {
7
+ const ISO8601Regex = new RegExp(ISO8601RegexString)
8
+ return ISO8601Regex.test(dateString)
9
+ }
10
+
11
+ const sanitizeISO8601Date = (dateString: string): ISO8601Date => {
12
+ if (isISO8601Date(dateString)) {
13
+ return dateString as ISO8601Date
14
+ }
15
+ return new Date(dateString).toISOString() as ISO8601Date
16
+ }
17
+
18
+ export {
19
+ sanitizeISO8601Date,
20
+ isISO8601Date,
21
+ }
package/src/common/locale.ts CHANGED
@@ -13,22 +13,28 @@ export class Locale {
13
13
  config: LocaleConfig
14
14
  closestElement:HTMLElement
15
15
 
16
- constructor (configData: LocaleConfig) {
16
+ constructor (configData?: LocaleConfig) {
17
+ if (configData) {
18
+ this.set(configData)
19
+ }
20
+ }
21
+
22
+ set = (configData: LocaleConfig): void => {
17
23
  this.config = configData
18
24
  }
19
25
 
20
- lang = (element: HTMLElement): void => {
26
+ lang = (element: HTMLElement): string => {
21
27
  this.closestElement = element.closest('[lang]') as HTMLElement
22
28
 
23
-
24
29
  if (this.closestElement) {
25
30
  if (this.closestElement.lang) {
26
31
  this.language = this.closestElement.lang
27
- return
32
+ return this.language
28
33
  }
29
34
  }
30
35
 
31
36
  this.language = this.rollbackLanguage
37
+ return this.language
32
38
  }
33
39
 
34
40
  private pluralize = (tag: string | string[], context: Record<string, string | number>): string => {
package/src/components/mds-progress/mds-progress.css CHANGED
@@ -6,12 +6,12 @@
6
6
  @tailwind utilities;
7
7
 
8
8
  /**
9
- * @prop --mds-progress-background: Sets the background-color of the component
10
- * @prop --mds-progress-color: Sets the background-color of the progress
11
- * @prop --mds-progress-duration: Sets the duration of the progress bar animation
12
- * @prop --mds-progress-radius: Sets the border-radius of the component
13
- * @prop --mds-progress-thickness: Sets the thickness of the progress bar
14
- */
9
+ * @prop --mds-progress-background: Sets the background-color of the component
10
+ * @prop --mds-progress-color: Sets the background-color of the progress
11
+ * @prop --mds-progress-duration: Sets the duration of the progress bar animation
12
+ * @prop --mds-progress-radius: Sets the border-radius of the component
13
+ * @prop --mds-progress-thickness: Sets the thickness of the progress bar
14
+ */
15
15
 
16
16
  :host {
17
17
 
package/src/dictionary/button.ts CHANGED
@@ -32,10 +32,17 @@ const buttonIconPositionDictionary = [
32
32
  'right',
33
33
  ]
34
34
 
35
+ const buttonTypeDictionary = [
36
+ 'button',
37
+ 'submit',
38
+ 'reset',
39
+ ]
40
+
35
41
  export {
36
42
  buttonIconPositionDictionary,
37
43
  buttonSizeDictionary,
38
44
  buttonTargetDictionary,
39
45
  buttonToneVariantDictionary,
46
+ buttonTypeDictionary,
40
47
  buttonVariantDictionary,
41
48
  }
package/src/dictionary/variant.ts CHANGED
@@ -92,6 +92,12 @@ const toneSimpleVariantDictionary = [
92
92
  'quiet',
93
93
  ]
94
94
 
95
+ const toneSmartVariantDictionary = [
96
+ 'strong',
97
+ 'weak',
98
+ 'ghost',
99
+ ]
100
+
95
101
  const toneMinimalVariantDictionary = [
96
102
  'strong',
97
103
  'weak',
@@ -107,5 +113,6 @@ export {
107
113
  toneActionVariantDictionary,
108
114
  toneMinimalVariantDictionary,
109
115
  toneSimpleVariantDictionary,
116
+ toneSmartVariantDictionary,
110
117
  toneVariantDictionary,
111
118
  }
package/src/fixtures/icons.json CHANGED
@@ -33,6 +33,7 @@
33
33
  "mgg/address-book-off",
34
34
  "mgg/address-book-on",
35
35
  "mgg/adv-denied",
36
+ "mgg/ai",
36
37
  "mgg/alerts-pagopa",
37
38
  "mgg/ansc",
38
39
  "mgg/area-edificabile",
@@ -86,8 +87,16 @@
86
87
  "mgg/download-csv",
87
88
  "mgg/download-json",
88
89
  "mgg/electronic-document",
90
+ "mgg/email-assigned",
91
+ "mgg/email-open-blocked",
89
92
  "mgg/email-open-check",
93
+ "mgg/email-open-lock",
90
94
  "mgg/email-open-off",
95
+ "mgg/email-open-play",
96
+ "mgg/email-open-stop",
97
+ "mgg/email-open-user",
98
+ "mgg/email-open-view",
99
+ "mgg/email-to-assign",
91
100
  "mgg/face-to-face-meeting",
92
101
  "mgg/factory",
93
102
  "mgg/farmer",
@@ -115,12 +124,19 @@
115
124
  "mgg/fit-vertical",
116
125
  "mgg/forwarded-with-a-single-sending",
117
126
  "mgg/fullscreen-on-alt",
127
+ "mgg/google-book-closed",
128
+ "mgg/google-book-closed-outline",
129
+ "mgg/google-book-large",
130
+ "mgg/google-book-large-outline",
131
+ "mgg/google-book-opening",
132
+ "mgg/google-book-opening-outline",
118
133
  "mgg/google-check-small",
119
134
  "mgg/google-experiment",
120
135
  "mgg/google-face-retouching-off",
121
136
  "mgg/google-hub",
122
137
  "mgg/google-keyboard-double-arrow-down",
123
138
  "mgg/google-keyboard-double-arrow-up",
139
+ "mgg/google-newsstand",
124
140
  "mgg/google-place-item",
125
141
  "mgg/group-assigned-automatically-system",
126
142
  "mgg/group-ceased",
@@ -130,6 +146,7 @@
130
146
  "mgg/historic-building",
131
147
  "mgg/historic-building-unusable",
132
148
  "mgg/home-hammer",
149
+ "mgg/home-link",
133
150
  "mgg/home-number",
134
151
  "mgg/inagibile",
135
152
  "mgg/input-calendar-costs",
package/src/fixtures/iconsauce.json CHANGED
@@ -21,6 +21,7 @@
21
21
  "mgg/address-book-off",
22
22
  "mgg/address-book-on",
23
23
  "mgg/adv-denied",
24
+ "mgg/ai",
24
25
  "mgg/alerts-pagopa",
25
26
  "mgg/ansc",
26
27
  "mgg/area-edificabile",
@@ -74,8 +75,16 @@
74
75
  "mgg/download-csv",
75
76
  "mgg/download-json",
76
77
  "mgg/electronic-document",
78
+ "mgg/email-assigned",
79
+ "mgg/email-open-blocked",
77
80
  "mgg/email-open-check",
81
+ "mgg/email-open-lock",
78
82
  "mgg/email-open-off",
83
+ "mgg/email-open-play",
84
+ "mgg/email-open-stop",
85
+ "mgg/email-open-user",
86
+ "mgg/email-open-view",
87
+ "mgg/email-to-assign",
79
88
  "mgg/face-to-face-meeting",
80
89
  "mgg/factory",
81
90
  "mgg/farmer",
@@ -103,12 +112,19 @@
103
112
  "mgg/fit-vertical",
104
113
  "mgg/forwarded-with-a-single-sending",
105
114
  "mgg/fullscreen-on-alt",
115
+ "mgg/google-book-closed-outline",
116
+ "mgg/google-book-closed",
117
+ "mgg/google-book-large-outline",
118
+ "mgg/google-book-large",
119
+ "mgg/google-book-opening-outline",
120
+ "mgg/google-book-opening",
106
121
  "mgg/google-check-small",
107
122
  "mgg/google-experiment",
108
123
  "mgg/google-face-retouching-off",
109
124
  "mgg/google-hub",
110
125
  "mgg/google-keyboard-double-arrow-down",
111
126
  "mgg/google-keyboard-double-arrow-up",
127
+ "mgg/google-newsstand",
112
128
  "mgg/google-place-item",
113
129
  "mgg/group-assigned-automatically-system",
114
130
  "mgg/group-ceased",
@@ -118,6 +134,7 @@
118
134
  "mgg/historic-building-unusable",
119
135
  "mgg/historic-building",
120
136
  "mgg/home-hammer",
137
+ "mgg/home-link",
121
138
  "mgg/home-number",
122
139
  "mgg/inagibile",
123
140
  "mgg/input-calendar-costs",
package/src/type/date.ts ADDED
@@ -0,0 +1,10 @@
1
+ type ISO8601DateFormat<K, T> = K & { __isISO8601DateFormat: T };
2
+
3
+ // Defines a branded type for the date ISO 8601 string
4
+ type ISO8601Date = ISO8601DateFormat<string, 'ISO8601Date'>
5
+
6
+ // const validDate: ISO8601Date = sanitizeISO8601Date('2024-09-24T15:30:00Z')
7
+
8
+ export {
9
+ ISO8601Date,
10
+ }
package/src/type/variant.ts CHANGED
@@ -90,9 +90,9 @@ export type ToneVariantType =
90
90
  | 'quiet' // no background, no border
91
91
 
92
92
  export type ToneSimpleVariantType =
93
+ | 'quiet'
93
94
  | 'strong'
94
95
  | 'weak'
95
- | 'quiet'
96
96
 
97
97
  export type ToneMinimalVariantType =
98
98
  | 'strong'
package/www/build/mds-progress.esm.js CHANGED
@@ -1 +1 @@
1
- import{p as r,b as e}from"./p-313d3f72.js";export{s as setNonce}from"./p-313d3f72.js";import{g as p}from"./p-e1255160.js";(()=>{const s=import.meta.url,e={};return""!==s&&(e.resourcesUrl=new URL(".",s).href),r(e)})().then((async s=>(await p(),e([["p-a9121660",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],s))));
1
+ import{p as r,b as e}from"./p-313d3f72.js";export{s as setNonce}from"./p-313d3f72.js";import{g as p}from"./p-e1255160.js";(()=>{const s=import.meta.url,e={};return""!==s&&(e.resourcesUrl=new URL(".",s).href),r(e)})().then((async s=>(await p(),e([["p-2ca5093d",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],s))));
package/www/build/p-18057705.system.entry.js ADDED
@@ -0,0 +1 @@
1
+ System.register(["./p-ecdde885.system.js"],(function(n){"use strict";var r,t,a,o;return{setters:[function(n){r=n.r;t=n.h;a=n.H;o=n.g}],execute:function(){var e='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';var s=e;var i=n("mds_progress",function(){function n(n){r(this,n);this.stepsList=new Array;this.currentStep=undefined;this.progress=0;this.direction="horizontal";this.variant="primary";this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}n.prototype.componentWillLoad=function(){this.stepsList=this.steps.split(",");this.setProgress(this.progress)};n.prototype.setProgress=function(n){if(this.steps){this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))];this.element.setAttribute("aria-valuetext",this.currentStep)}};n.prototype.progressChanged=function(n){this.setProgress(n)};n.prototype.stepsChanged=function(n){this.stepsList=n.split(",")};n.prototype.render=function(){return t(a,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(this.progress*100),role:"progressbar"},t("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),t("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:this.direction==="horizontal"?{flexGrow:"".concat(this.progress)}:{flexGrow:"".concat(this.progress),width:"100%"}}))};Object.defineProperty(n.prototype,"element",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{progress:["progressChanged"],steps:["stepsChanged"]}},enumerable:false,configurable:true});return n}());i.style=s}}}));
package/www/build/p-247bfa7b.system.js CHANGED
@@ -1 +1 @@
1
- var __awaiter=this&&this.__awaiter||function(t,n,e,r){function i(t){return t instanceof e?t:new e((function(n){n(t)}))}return new(e||(e=Promise))((function(e,s){function u(t){try{o(r.next(t))}catch(t){s(t)}}function c(t){try{o(r["throw"](t))}catch(t){s(t)}}function o(t){t.done?e(t.value):i(t.value).then(u,c)}o((r=r.apply(t,n||[])).next())}))};var __generator=this&&this.__generator||function(t,n){var e={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},r,i,s,u;return u={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(u[Symbol.iterator]=function(){return this}),u;function c(t){return function(n){return o([t,n])}}function o(c){if(r)throw new TypeError("Generator is already executing.");while(u&&(u=0,c[0]&&(e=0)),e)try{if(r=1,i&&(s=c[0]&2?i["return"]:c[0]?i["throw"]||((s=i["return"])&&s.call(i),0):i.next)&&!(s=s.call(i,c[1])).done)return s;if(i=0,s)c=[c[0]&2,s.value];switch(c[0]){case 0:case 1:s=c;break;case 4:e.label++;return{value:c[1],done:false};case 5:e.label++;i=c[1];c=[0];continue;case 7:c=e.ops.pop();e.trys.pop();continue;default:if(!(s=e.trys,s=s.length>0&&s[s.length-1])&&(c[0]===6||c[0]===2)){e=0;continue}if(c[0]===3&&(!s||c[1]>s[0]&&c[1]<s[3])){e.label=c[1];break}if(c[0]===6&&e.label<s[1]){e.label=s[1];s=c;break}if(s&&e.label<s[2]){e.label=s[2];e.ops.push(c);break}if(s[2])e.ops.pop();e.trys.pop();continue}c=n.call(t,e)}catch(t){c=[6,t];i=0}finally{r=s=0}if(c[0]&5)throw c[1];return{value:c[0]?c[1]:void 0,done:true}}};System.register(["./p-ecdde885.system.js","./p-56ba5cbf.system.js"],(function(t,n){"use strict";var e,r,i;return{setters:[function(n){e=n.p;r=n.b;t("setNonce",n.s)},function(t){i=t.g}],execute:function(){var t=this;var s=function(){var t=n.meta.url;var r={};if(t!==""){r.resourcesUrl=new URL(".",t).href}return e(r)};s().then((function(n){return __awaiter(t,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,i()];case 1:t.sent();return[2,r([["p-63b6c1a0.system",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],n)]}}))}))}))}}}));
1
+ var __awaiter=this&&this.__awaiter||function(t,n,e,r){function i(t){return t instanceof e?t:new e((function(n){n(t)}))}return new(e||(e=Promise))((function(e,s){function u(t){try{c(r.next(t))}catch(t){s(t)}}function o(t){try{c(r["throw"](t))}catch(t){s(t)}}function c(t){t.done?e(t.value):i(t.value).then(u,o)}c((r=r.apply(t,n||[])).next())}))};var __generator=this&&this.__generator||function(t,n){var e={label:0,sent:function(){if(s[0]&1)throw s[1];return s[1]},trys:[],ops:[]},r,i,s,u;return u={next:o(0),throw:o(1),return:o(2)},typeof Symbol==="function"&&(u[Symbol.iterator]=function(){return this}),u;function o(t){return function(n){return c([t,n])}}function c(o){if(r)throw new TypeError("Generator is already executing.");while(u&&(u=0,o[0]&&(e=0)),e)try{if(r=1,i&&(s=o[0]&2?i["return"]:o[0]?i["throw"]||((s=i["return"])&&s.call(i),0):i.next)&&!(s=s.call(i,o[1])).done)return s;if(i=0,s)o=[o[0]&2,s.value];switch(o[0]){case 0:case 1:s=o;break;case 4:e.label++;return{value:o[1],done:false};case 5:e.label++;i=o[1];o=[0];continue;case 7:o=e.ops.pop();e.trys.pop();continue;default:if(!(s=e.trys,s=s.length>0&&s[s.length-1])&&(o[0]===6||o[0]===2)){e=0;continue}if(o[0]===3&&(!s||o[1]>s[0]&&o[1]<s[3])){e.label=o[1];break}if(o[0]===6&&e.label<s[1]){e.label=s[1];s=o;break}if(s&&e.label<s[2]){e.label=s[2];e.ops.push(o);break}if(s[2])e.ops.pop();e.trys.pop();continue}o=n.call(t,e)}catch(t){o=[6,t];i=0}finally{r=s=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};System.register(["./p-ecdde885.system.js","./p-56ba5cbf.system.js"],(function(t,n){"use strict";var e,r,i;return{setters:[function(n){e=n.p;r=n.b;t("setNonce",n.s)},function(t){i=t.g}],execute:function(){var t=this;var s=function(){var t=n.meta.url;var r={};if(t!==""){r.resourcesUrl=new URL(".",t).href}return e(r)};s().then((function(n){return __awaiter(t,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:return[4,i()];case 1:t.sent();return[2,r([["p-18057705.system",[[1,"mds-progress",{progress:[2],direction:[513],variant:[513],steps:[1],currentStep:[32]},null,{progress:["progressChanged"],steps:["stepsChanged"]}]]]],n)]}}))}))}))}}}));
package/www/build/p-2ca5093d.entry.js ADDED
@@ -0,0 +1 @@
1
+ import{r as n,h as r,H as t,g as a}from"./p-313d3f72.js";const o=class{constructor(r){n(this,r),this.stepsList=new Array,this.currentStep=void 0,this.progress=0,this.direction="horizontal",this.variant="primary",this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}componentWillLoad(){this.stepsList=this.steps.split(","),this.setProgress(this.progress)}setProgress(n){this.steps&&(this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))],this.element.setAttribute("aria-valuetext",this.currentStep))}progressChanged(n){this.setProgress(n)}stepsChanged(n){this.stepsList=n.split(",")}render(){return r(t,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(100*this.progress),role:"progressbar"},r("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),r("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:"horizontal"===this.direction?{flexGrow:`${this.progress}`}:{flexGrow:`${this.progress}`,width:"100%"}}))}get element(){return a(this)}static get watchers(){return{progress:["progressChanged"],steps:["stepsChanged"]}}};o.style='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n * @prop --mds-progress-background: Sets the background-color of the component\n * @prop --mds-progress-color: Sets the background-color of the progress\n * @prop --mds-progress-duration: Sets the duration of the progress bar animation\n * @prop --mds-progress-radius: Sets the border-radius of the component\n * @prop --mds-progress-thickness: Sets the thickness of the progress bar\n */\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';export{o as mds_progress}
package/dist/mds-progress/p-63b6c1a0.system.entry.js DELETED
@@ -1 +0,0 @@
1
- System.register(["./p-ecdde885.system.js"],(function(n){"use strict";var r,t,a,o;return{setters:[function(n){r=n.r;t=n.h;a=n.H;o=n.g}],execute:function(){var e='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';var s=e;var i=n("mds_progress",function(){function n(n){r(this,n);this.stepsList=new Array;this.currentStep=undefined;this.progress=0;this.direction="horizontal";this.variant="primary";this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}n.prototype.componentWillLoad=function(){this.stepsList=this.steps.split(",");this.setProgress(this.progress)};n.prototype.setProgress=function(n){if(this.steps){this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))];this.element.setAttribute("aria-valuetext",this.currentStep)}};n.prototype.progressChanged=function(n){this.setProgress(n)};n.prototype.stepsChanged=function(n){this.stepsList=n.split(",")};n.prototype.render=function(){return t(a,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(this.progress*100),role:"progressbar"},t("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),t("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:this.direction==="horizontal"?{flexGrow:"".concat(this.progress)}:{flexGrow:"".concat(this.progress),width:"100%"}}))};Object.defineProperty(n.prototype,"element",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{progress:["progressChanged"],steps:["stepsChanged"]}},enumerable:false,configurable:true});return n}());i.style=s}}}));
package/dist/mds-progress/p-a9121660.entry.js DELETED
@@ -1 +0,0 @@
1
- import{r as n,h as r,H as t,g as a}from"./p-313d3f72.js";const o=class{constructor(r){n(this,r),this.stepsList=new Array,this.currentStep=void 0,this.progress=0,this.direction="horizontal",this.variant="primary",this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}componentWillLoad(){this.stepsList=this.steps.split(","),this.setProgress(this.progress)}setProgress(n){this.steps&&(this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))],this.element.setAttribute("aria-valuetext",this.currentStep))}progressChanged(n){this.setProgress(n)}stepsChanged(n){this.stepsList=n.split(",")}render(){return r(t,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(100*this.progress),role:"progressbar"},r("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),r("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:"horizontal"===this.direction?{flexGrow:`${this.progress}`}:{flexGrow:`${this.progress}`,width:"100%"}}))}get element(){return a(this)}static get watchers(){return{progress:["progressChanged"],steps:["stepsChanged"]}}};o.style='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';export{o as mds_progress}
package/www/build/p-63b6c1a0.system.entry.js DELETED
@@ -1 +0,0 @@
1
- System.register(["./p-ecdde885.system.js"],(function(n){"use strict";var r,t,a,o;return{setters:[function(n){r=n.r;t=n.h;a=n.H;o=n.g}],execute:function(){var e='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';var s=e;var i=n("mds_progress",function(){function n(n){r(this,n);this.stepsList=new Array;this.currentStep=undefined;this.progress=0;this.direction="horizontal";this.variant="primary";this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}n.prototype.componentWillLoad=function(){this.stepsList=this.steps.split(",");this.setProgress(this.progress)};n.prototype.setProgress=function(n){if(this.steps){this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))];this.element.setAttribute("aria-valuetext",this.currentStep)}};n.prototype.progressChanged=function(n){this.setProgress(n)};n.prototype.stepsChanged=function(n){this.stepsList=n.split(",")};n.prototype.render=function(){return t(a,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(this.progress*100),role:"progressbar"},t("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),t("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:this.direction==="horizontal"?{flexGrow:"".concat(this.progress)}:{flexGrow:"".concat(this.progress),width:"100%"}}))};Object.defineProperty(n.prototype,"element",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(n,"watchers",{get:function(){return{progress:["progressChanged"],steps:["stepsChanged"]}},enumerable:false,configurable:true});return n}());i.style=s}}}));
package/www/build/p-a9121660.entry.js DELETED
@@ -1 +0,0 @@
1
- import{r as n,h as r,H as t,g as a}from"./p-313d3f72.js";const o=class{constructor(r){n(this,r),this.stepsList=new Array,this.currentStep=void 0,this.progress=0,this.direction="horizontal",this.variant="primary",this.steps="Inizio,Un quarto,Metà,Tre quarti,Fine"}componentWillLoad(){this.stepsList=this.steps.split(","),this.setProgress(this.progress)}setProgress(n){this.steps&&(this.currentStep=this.stepsList[Math.round(n*(this.stepsList.length-1))],this.element.setAttribute("aria-valuetext",this.currentStep))}progressChanged(n){this.setProgress(n)}stepsChanged(n){this.stepsList=n.split(",")}render(){return r(t,{key:"fadd41ff24e30137a6998f2d6627fcd5d44c68ae","aria-valuemax":"100","aria-valuemin":"0","aria-valuenow":Math.round(100*this.progress),role:"progressbar"},r("div",{key:"8e1cc488d34e9876b8e256e58c65c973a7fe7a11",class:"contrast-area"}),r("div",{key:"611728b4b0b6702b3f98e005a8de265e43f7cf7b",class:"progress",style:"horizontal"===this.direction?{flexGrow:`${this.progress}`}:{flexGrow:`${this.progress}`,width:"100%"}}))}get element(){return a(this)}static get watchers(){return{progress:["progressChanged"],steps:["stepsChanged"]}}};o.style='@tailwind components;\n@tailwind utilities;\n\n\n/* @import \'../../tailwind/static-components.css\'; */\n\n.svg{\n display: -ms-flexbox;\n display: flex;\n}\n\n.svg svg{\n aspect-ratio: 1/1;\n height: 100%;\n width: 100%;\n}\n\n.contrast-area {\n border-radius: inherit;\n -webkit-box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n box-shadow: 0 0 0 2px rgb(var(--tone-neutral-01) / 0.3) inset;\n display: none;\n inset: 0;\n opacity: 0;\n pointer-events: none;\n position: absolute;\n transition-behavior: allow-discrete;\n -webkit-transition-property: display opacity;\n transition-property: display opacity;\n\n -webkit-box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n\n box-shadow: 0 0 0 1px rgb(var(--tone-neutral-01) / 0.3) inset;\n }\n\n@container style(--magma-pref-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n\n@container style(--magma-pref-contrast: system) {\n\n @media (prefers-contrast: more) {\n .contrast-area,\n .contrast-area-50{\n display: block;\n opacity: 1;\n\n /* @starting-style {\n opacity: 0;\n } */\n }\n }\n }\n\n@container style(--magma-pref-animation: reduce) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n\n@container style(--magma-pref-animation: system) {\n \n @media (prefers-reduced-motion) {\n .contrast-area,\n .contrast-area-50{\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n }\n@tailwind utilities;\n\n/**\n* @prop --mds-progress-background: Sets the background-color of the component\n* @prop --mds-progress-color: Sets the background-color of the progress\n* @prop --mds-progress-duration: Sets the duration of the progress bar animation\n* @prop --mds-progress-radius: Sets the border-radius of the component\n* @prop --mds-progress-thickness: Sets the thickness of the progress bar\n*/\n\n:host {\n\n --mds-progress-background: rgb(var(--tone-neutral-08));\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-duration: 750ms;\n --mds-progress-radius: 0.5rem;\n --mds-progress-thickness: 0.5rem;\n -webkit-transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;\n -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n -webkit-transition-duration: 150ms;\n transition-duration: 150ms;\n\n background-color: var(--mds-progress-background);\n border-radius: var(--mds-progress-radius);\n display: -ms-flexbox;\n display: flex;\n height: var(--mds-progress-thickness);\n min-width: var(--mds-progress-thickness);\n overflow: hidden;\n position: relative;\n width: 100%;\n}\n\n:host( [direction="vertical"] ) {\n -ms-flex-direction: column;\n flex-direction: column;\n height: unset;\n min-height: var(--mds-progress-thickness);\n width: var(--mds-progress-thickness);\n}\n\n.progress{\n -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);\n\n background-color: var(--mds-progress-color);\n border-radius: var(--mds-progress-radius);\n -webkit-transition-duration: var(--mds-progress-duration);\n transition-duration: var(--mds-progress-duration);\n -webkit-transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow;\n transition-property: background-color, flex-grow, -ms-flex-positive;\n}\n\n@tailwind utilities;\n\n:host( [variant="dark"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral-04));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n:host( [variant="light"] ) {\n\n --mds-progress-color: rgb(var(--tone-neutral));\n --mds-progress-background: rgb(var(--tone-neutral-05));\n}\n\n:host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-06));\n --mds-progress-background: rgb(var(--status-error-09));\n}\n\n:host( [variant="warning"] ) {\n\n --mds-progress-color: rgb(var(--status-warning-06));\n --mds-progress-background: rgb(var(--status-warning-09));\n}\n\n:host( [variant="success"] ) {\n\n --mds-progress-color: rgb(var(--status-success-06));\n --mds-progress-background: rgb(var(--status-success-09));\n}\n\n:host( [variant="info"] ) {\n\n --mds-progress-color: rgb(var(--status-info-06));\n --mds-progress-background: rgb(var(--status-info-09));\n}\n\n:host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-03));\n --mds-progress-background: rgb(var(--tone-neutral-08));\n}\n\n@tailwind utilities;\n\n@container style(--magma-pref-animation: reduce) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n}\n\n@container style(--magma-pref-animation: system) {\n\n @media (prefers-reduced-motion) {\n :host,\n .progress {\n -webkit-transition-duration: 0s;\n transition-duration: 0s;\n }\n }\n}\n\n.static{\n position: static;\n}\n\n.fixed{\n position: fixed;\n}\n\n.absolute{\n position: absolute;\n}\n\n.border{\n border-width: 1px;\n}\n\n.bg-label-amaranth-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-amaranth-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-aqua-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-aqua-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-blue-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-blue-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-green-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-green-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-lime-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-lime-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orange-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orange-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-orchid-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-orchid-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-violet-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-violet-10) / var(--tw-bg-opacity));\n}\n\n.bg-label-yellow-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--label-yellow-10) / var(--tw-bg-opacity));\n}\n\n.bg-tone-neutral-10{\n --tw-bg-opacity: 1;\n background-color: rgb(var(--tone-neutral-10) / var(--tw-bg-opacity));\n}\n\n.fill-label-amaranth-04{\n fill: rgb(var(--label-amaranth-04));\n}\n\n.fill-label-aqua-04{\n fill: rgb(var(--label-aqua-04));\n}\n\n.fill-label-blue-04{\n fill: rgb(var(--label-blue-04));\n}\n\n.fill-label-green-04{\n fill: rgb(var(--label-green-04));\n}\n\n.fill-label-lime-04{\n fill: rgb(var(--label-lime-04));\n}\n\n.fill-label-orange-04{\n fill: rgb(var(--label-orange-04));\n}\n\n.fill-label-orchid-04{\n fill: rgb(var(--label-orchid-04));\n}\n\n.fill-label-violet-04{\n fill: rgb(var(--label-violet-04));\n}\n\n.fill-label-yellow-04{\n fill: rgb(var(--label-yellow-04));\n}\n\n.fill-tone-neutral-04{\n fill: rgb(var(--tone-neutral-04));\n}\n\n.text-label-amaranth-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-amaranth-04) / var(--tw-text-opacity));\n}\n\n.text-label-aqua-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-aqua-04) / var(--tw-text-opacity));\n}\n\n.text-label-blue-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-blue-04) / var(--tw-text-opacity));\n}\n\n.text-label-green-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-green-04) / var(--tw-text-opacity));\n}\n\n.text-label-lime-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-lime-04) / var(--tw-text-opacity));\n}\n\n.text-label-orange-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orange-04) / var(--tw-text-opacity));\n}\n\n.text-label-orchid-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-orchid-04) / var(--tw-text-opacity));\n}\n\n.text-label-violet-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-violet-04) / var(--tw-text-opacity));\n}\n\n.text-label-yellow-04{\n --tw-text-opacity: 1;\n color: rgb(var(--label-yellow-04) / var(--tw-text-opacity));\n}\n\n.text-tone-neutral-04{\n --tw-text-opacity: 1;\n color: rgb(var(--tone-neutral-04) / var(--tw-text-opacity));\n}\n\n.shadow{\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n@container style(--magma-pref-theme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n}\n\n@container style(--magma-pref-theme: system) {\n\n @media (prefers-color-scheme: dark) {\n :host,\n :host( [variant="primary"] ) {\n\n --mds-progress-color: rgb(var(--brand-maggioli-05));\n --mds-progress-background: rgb(var(--tone-neutral-07));\n }\n\n :host( [variant="error"] ) {\n\n --mds-progress-color: rgb(var(--status-error-04));\n --mds-progress-background: rgb(var(--status-error-07));\n }\n \n :host( [variant="warning"] ) {\n \n --mds-progress-color: rgb(var(--status-warning-04));\n --mds-progress-background: rgb(var(--status-warning-07));\n }\n \n :host( [variant="success"] ) {\n \n --mds-progress-color: rgb(var(--status-success-04));\n --mds-progress-background: rgb(var(--status-success-07));\n }\n \n :host( [variant="info"] ) {\n \n --mds-progress-color: rgb(var(--status-info-04));\n --mds-progress-background: rgb(var(--status-info-07));\n }\n }\n}\n\n';export{o as mds_progress}