material-inspired-component-library 8.1.0 → 9.0.0

package/dist/sidesheet.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-layout-pane-spacer: 24px}@media(max-width: 599px){:root{--md-sys-layout-window-margin: 16px}}@media(min-width: 600px)and (max-width: 839px){:root{--md-sys-layout-window-margin: 24px}}@media(min-width: 840px)and (max-width: 1199px){:root{--md-sys-layout-window-margin: 24px}}@media(min-width: 1200px)and (max-width: 1599px){:root{--md-sys-layout-window-margin: 24px}}@media(min-width: 1600px){:root{--md-sys-layout-window-margin: 24px}}.micl-window{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);margin:0;background-color:var(--md-sys-color-surface)}.micl-window .micl-body .micl-appbar{margin-inline:calc(-1*var(--md-sys-layout-window-margin))}.micl-window:not(.micl-window--spatial):has(nav.micl-navigationrail) .micl-body .micl-appbar{margin-inline-start:0}.micl-window.micl-window--spatial{--md-sys-layout-spatial-radius: calc(var(--md-sys-shape-corner-medium) + var(--md-sys-layout-window-margin));display:flex;padding-block:calc(2*var(--md-sys-layout-window-margin));gap:var(--md-sys-layout-window-margin)}.micl-window.micl-window--spatial .micl-navigationrail{display:flex;align-self:flex-start;block-size:inherit;min-block-size:inherit;margin:0;padding-block-end:var(--md-sys-navigationrail-top-space, 0px);border-radius:var(--md-sys-layout-spatial-radius)}.micl-window.micl-window--spatial .micl-body{background:rgba(0,0,0,0)}.micl-window.micl-window--spatial .micl-pane{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);border-radius:var(--md-sys-layout-spatial-radius);background-color:var(--md-sys-color-surface)}.micl-body{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--md-sys-comp-margin, 8px) var(--md-sys-layout-pane-spacer);background-color:inherit}.micl-body.micl-body--split:has(>.micl-pane:nth-child(2)) .micl-pane{flex-basis:50%}.micl-body.micl-body--evenly .micl-pane{flex:1 1 0}.micl-pane{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane.micl-pane--fixed{flex:0 0 auto}.micl-pane:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined),.micl-pane>*:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns{display:flex}.micl-pane>.micl-pane__columns:has(>.micl-pane__column>.micl-card-elevated,>.micl-pane__column>.micl-card-filled,>.micl-pane__column>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane>.micl-pane__columns>.micl-pane__column:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){row-gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column.micl-pane__column--fixed{flex:0 0 auto}.micl-pane>.micl-pane__columns.micl-pane__columns--evenly>.micl-pane__column{flex:1 1 0}@media(max-width: 599px){.micl-body.micl-body--stacked-to-medium,.micl-body.micl-body--stacked-to-expanded,.micl-body.micl-body--stacked-to-large,.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-medium,.micl-pane.micl-pane--hidden-to-expanded,.micl-pane.micl-pane--hidden-to-large,.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-medium,.micl-pane__columns.micl-pane__columns--stacked-to-expanded,.micl-pane__columns.micl-pane__columns--stacked-to-large,.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}@media(min-width: 600px)and (max-width: 839px){.micl-body.micl-body--stacked-to-expanded,.micl-body.micl-body--stacked-to-large,.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-expanded,.micl-pane.micl-pane--hidden-to-large,.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-expanded,.micl-pane__columns.micl-pane__columns--stacked-to-large,.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}@media(min-width: 840px)and (max-width: 1199px){.micl-body.micl-body--stacked-to-large,.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-large,.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-large,.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}@media(min-width: 1200px)and (max-width: 1599px){.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}:root{--md-sys-shape-corner-none: 0px}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-state-backdrop-opacity: 32%}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-sys-sidesheet-width: 256px;--md-sys-sidesheet-maxwidth: 400px;--md-sys-sidesheet-padding-standard: var(--md-sys-layout-window-margin, 24px)}body{--md-sys-sidesheet-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-sys-sidesheet-motion-duration: 650ms;--md-sys-sidesheet-motion-duration-reverse: 500ms}dialog.micl-sidesheet{--md-sys-sidesheet-spring-buffer: 40px;box-sizing:border-box;display:none;flex-direction:column;justify-content:space-between;min-inline-size:calc(var(--md-sys-sidesheet-width) + var(--md-sys-sidesheet-spring-buffer));max-inline-size:calc(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer));block-size:100vh;max-block-size:100%;min-block-size:100%;margin-block:0;margin-inline-start:auto;margin-inline-end:calc(-1*(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer)));padding-block:var(--md-sys-sidesheet-padding-standard) 0;padding-inline:0 var(--md-sys-sidesheet-spring-buffer);background-color:var(--md-sys-color-surface);border:none;border-radius:var(--md-sys-shape-corner-none);box-shadow:var(--md-sys-elevation-level0);opacity:0;overflow:hidden;transition:opacity var(--md-sys-sidesheet-motion-duration-reverse) linear,margin-inline-end var(--md-sys-sidesheet-motion-duration-reverse) var(--md-sys-sidesheet-motion-spatial),overlay var(--md-sys-sidesheet-motion-duration-reverse) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration-reverse) linear allow-discrete}dialog.micl-sidesheet .micl-sidesheet__headline{display:flex;align-items:center;block-size:var(--md-sys-typescale-title-large-line-height);padding-inline:var(--md-sys-sidesheet-padding-standard);margin-block-end:16px;column-gap:12px;color:var(--md-sys-color-on-surface-variant)}dialog.micl-sidesheet .micl-sidesheet__headline h1,dialog.micl-sidesheet .micl-sidesheet__headline h2,dialog.micl-sidesheet .micl-sidesheet__headline h3,dialog.micl-sidesheet .micl-sidesheet__headline h4,dialog.micl-sidesheet .micl-sidesheet__headline h5,dialog.micl-sidesheet .micl-sidesheet__headline h6,dialog.micl-sidesheet .micl-sidesheet__headline .micl-heading{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);flex:1 2 fit-content;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}dialog.micl-sidesheet .micl-sidesheet__headline button{margin-inline:-12px}dialog.micl-sidesheet .micl-sidesheet__headline button:first-child{margin-inline-start:-16px}dialog.micl-sidesheet .micl-sidesheet__content{box-sizing:border-box;flex:1 1 auto;padding-inline:var(--md-sys-sidesheet-padding-standard);overflow:hidden auto}dialog.micl-sidesheet .micl-sidesheet__actions{box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:start;padding-block:16px var(--md-sys-sidesheet-padding-standard);padding-inline:var(--md-sys-sidesheet-padding-standard);column-gap:8px;overflow:hidden}dialog.micl-sidesheet[open]{background-color:var(--md-sys-color-surface-container-low);border-start-start-radius:var(--md-sys-shape-corner-large);border-end-start-radius:var(--md-sys-shape-corner-large);box-shadow:var(--md-sys-elevation-level1)}dialog.micl-sidesheet:popover-open{--md-sys-divider-color: var(--md-sys-color-outline, gray);border-inline-start:var(--md-sys-divider-thickness, 1px) solid var(--md-sys-divider-color)}dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{display:flex;margin-inline-end:calc(-1*var(--md-sys-sidesheet-spring-buffer));opacity:100%;transition:opacity var(--md-sys-sidesheet-motion-duration) linear,margin-inline-end var(--md-sys-sidesheet-motion-duration) var(--md-sys-sidesheet-motion-spatial),overlay var(--md-sys-sidesheet-motion-duration) linear allow-discrete,display var(--md-sys-sidesheet-motion-duration) linear allow-discrete}@starting-style{dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{margin-inline-end:calc(-1*(var(--md-sys-sidesheet-maxwidth) + var(--md-sys-sidesheet-spring-buffer)));opacity:0}}dialog.micl-sidesheet::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--md-sys-sidesheet-motion-duration-reverse) linear}dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0, 0, 0, var(--md-sys-state-backdrop-opacity, 32%));transition:background-color var(--md-sys-sidesheet-motion-duration) linear}@starting-style{dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0,0,0,0)}}body:has(dialog.micl-sidesheet[popover]){box-sizing:border-box;max-inline-size:100%;margin:0;transition:max-inline-size var(--md-sys-sidesheet-motion-duration-reverse)}body:has(dialog.micl-sidesheet:popover-open){max-inline-size:calc(100vw - var(--md-sys-sidesheet-maxwidth));transition:max-inline-size var(--md-sys-sidesheet-motion-duration) var(--md-sys-sidesheet-motion-spatial)}
+:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-layout-pane-spacer: 24px;--md-sys-layout-window-margin: 24px}@media(max-width: 599px){:root{--md-sys-layout-window-margin: 16px}}@media(min-width: 840px)and (max-width: 1199px){:root{--md-sys-layout-pane-fixed-width: 360px}}@media(min-width: 1200px){:root{--md-sys-layout-pane-fixed-width: 412px}}.micl-window{padding:env(safe-area-inset-top, 0px) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-right, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-left, 0px));margin:0;background-color:var(--md-sys-color-surface)}.micl-window .micl-panes .micl-appbar{margin-inline:calc(-1*var(--md-sys-layout-window-margin))}.micl-window:not(.micl-window--spatial):has(nav.micl-navigationrail) .micl-panes .micl-appbar{margin-inline-start:0}.micl-window.micl-window--spatial{--md-sys-layout-spatial-radius: calc(var(--md-sys-shape-corner-medium) + var(--md-sys-layout-window-margin));display:flex;padding-block:calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-top, 0px)) calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px));gap:var(--md-sys-layout-window-margin)}.micl-window.micl-window--spatial .micl-navigationrail{display:flex;align-self:flex-start;block-size:inherit;min-block-size:inherit;margin:0;padding-block-end:var(--md-sys-navigationrail-top-space, 0px);border-radius:var(--md-sys-layout-spatial-radius)}.micl-window.micl-window--spatial .micl-panes{background:rgba(0,0,0,0)}.micl-window.micl-window--spatial .micl-pane{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);border-radius:var(--md-sys-layout-spatial-radius);background-color:var(--md-sys-color-surface)}.micl-panes{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--md-sys-comp-margin, 8px) var(--md-sys-layout-pane-spacer);background-color:inherit}.micl-panes.micl-panes--split>.micl-pane+.micl-pane{--_layout-safe-inline-end: env(safe-area-inset-right, 0px);box-sizing:border-box;flex:0 1 var(--_layout-stacked-pane-size, calc(50vw - var(--md-sys-layout-window-margin, 0px) - var(--_layout-safe-inline-end) - var(--md-sys-layout-pane-spacer) / 2))}.micl-panes.micl-panes--split>.micl-pane+.micl-pane:dir(rtl){--_layout-safe-inline-end: env(safe-area-inset-left, 0px)}.micl-panes.micl-panes--evenly .micl-pane{flex:1 1 0}.micl-pane{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane.micl-pane--fixed{flex:0 0 auto;box-sizing:border-box;inline-size:var(--_layout-stacked-pane-size, var(--md-sys-layout-pane-fixed-width, auto))}.micl-pane:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined),.micl-pane>*:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns{display:flex}.micl-pane>.micl-pane__columns:has(>.micl-pane__column>.micl-card-elevated,>.micl-pane__column>.micl-card-filled,>.micl-pane__column>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane>.micl-pane__columns>.micl-pane__column:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){row-gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column.micl-pane__column--fixed{flex:0 0 auto}.micl-pane>.micl-pane__columns.micl-pane__columns--evenly>.micl-pane__column{flex:1 1 0}@media(max-width: 599px){.micl-panes.micl-panes--stacked-to-medium{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-medium{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-medium{flex-direction:column}}@media(max-width: 839px){.micl-panes.micl-panes--stacked-to-expanded{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-expanded{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-expanded{flex-direction:column}}@media(max-width: 1199px){.micl-panes.micl-panes--stacked-to-large{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-large{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-large{flex-direction:column}}@media(max-width: 1599px){.micl-panes.micl-panes--stacked-to-extralarge{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level0: none}body{--md-sys-elevation-level1: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 2px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 1px 3px 1px}:root{--md-sys-shape-corner-none: 0px}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-state-backdrop-opacity: 32%}:root{--md-sys-typescale-title-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-title-large-size: 1.375rem;--md-sys-typescale-title-large-line-height: 1.75rem;--md-sys-typescale-title-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-title-large-tracking: 0}:root{--md-comp-sidesheet-container-width: 256px;--md-comp-sidesheet-container-max-width: 400px;--md-comp-sidesheet-padding: var(--md-sys-layout-window-margin, 24px)}body{--md-comp-sidesheet-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-comp-sidesheet-motion-duration: 650ms;--md-comp-sidesheet-motion-duration-reverse: 500ms}dialog.micl-sidesheet{--micl-spring-buffer: 40px;--micl-duration: var(--md-comp-sidesheet-motion-duration-reverse);box-sizing:border-box;display:none;flex-direction:column;min-inline-size:calc(var(--md-comp-sidesheet-container-width) + var(--micl-spring-buffer));max-inline-size:calc(var(--md-comp-sidesheet-container-max-width) + var(--micl-spring-buffer));block-size:100%;min-block-size:100%;margin-block:0;margin-inline-start:auto;margin-inline-end:calc(-1*(var(--md-comp-sidesheet-container-max-width) + var(--micl-spring-buffer)));padding-block:var(--md-comp-sidesheet-padding) 0;padding-inline:0 var(--micl-spring-buffer);background-color:var(--md-comp-sidesheet-standard-container-color, var(--md-sys-color-surface));border:none;border-radius:var(--md-comp-sidesheet-container-shape, var(--md-sys-shape-corner-none));box-shadow:var(--md-comp-sidesheet-standard-container-elevation, var(--md-sys-elevation-level0));opacity:0;overflow:hidden;transition:opacity var(--micl-duration) linear,margin-inline-end var(--micl-duration) var(--md-comp-sidesheet-motion-spatial),overlay var(--micl-duration) linear allow-discrete,display var(--micl-duration) linear allow-discrete}dialog.micl-sidesheet .micl-sidesheet__headline{display:flex;align-items:center;block-size:var(--md-sys-typescale-title-large-line-height);padding-inline:var(--md-comp-sidesheet-padding);margin-block-end:16px;column-gap:12px;color:var(--md-sys-color-on-surface-variant)}dialog.micl-sidesheet .micl-sidesheet__headline h1,dialog.micl-sidesheet .micl-sidesheet__headline h2,dialog.micl-sidesheet .micl-sidesheet__headline h3,dialog.micl-sidesheet .micl-sidesheet__headline h4,dialog.micl-sidesheet .micl-sidesheet__headline h5,dialog.micl-sidesheet .micl-sidesheet__headline h6,dialog.micl-sidesheet .micl-sidesheet__headline .micl-heading{font-family:var(--md-sys-typescale-title-large-font);font-size:var(--md-sys-typescale-title-large-size);line-height:var(--md-sys-typescale-title-large-line-height);font-weight:var(--md-sys-typescale-title-large-weight);letter-spacing:var(--md-sys-typescale-title-large-tracking);flex:1 2 fit-content;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}dialog.micl-sidesheet .micl-sidesheet__headline button{margin-inline:-12px}dialog.micl-sidesheet .micl-sidesheet__headline button:first-child{margin-inline-start:-16px}dialog.micl-sidesheet .micl-sidesheet__content{box-sizing:border-box;flex:1 1 auto;padding-inline:var(--md-comp-sidesheet-padding);overflow:hidden auto}dialog.micl-sidesheet .micl-sidesheet__actions{box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:start;padding-block:16px var(--md-comp-sidesheet-padding);padding-inline:var(--md-comp-sidesheet-padding);column-gap:8px;overflow:hidden}dialog.micl-sidesheet[open]{background-color:var(--md-comp-sidesheet-modal-container-color, var(--md-sys-color-surface-container-low));border-start-start-radius:var(--md-comp-sidesheet-modal-container-shape, var(--md-sys-shape-corner-large));border-end-start-radius:var(--md-comp-sidesheet-modal-container-shape, var(--md-sys-shape-corner-large));box-shadow:var(--md-comp-sidesheet-modal-container-elevation, var(--md-sys-elevation-level1))}dialog.micl-sidesheet:popover-open{border-inline-start:var(--md-comp-sidesheet-divider-thickness, 1px) solid var(--md-comp-sidesheet-divider-color, var(--md-sys-color-outline, gray))}dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{--micl-duration: var(--md-comp-sidesheet-motion-duration);display:flex;margin-inline-end:calc(-1*var(--micl-spring-buffer));opacity:100%}@starting-style{dialog.micl-sidesheet:popover-open,dialog.micl-sidesheet[open]{margin-inline-end:calc(-1*(var(--md-comp-sidesheet-container-max-width) + var(--micl-spring-buffer)));opacity:0}}dialog.micl-sidesheet::backdrop{background-color:rgba(0,0,0,0);transition:background-color var(--micl-duration) linear}dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0, 0, 0, var(--md-sys-state-backdrop-opacity, 32%))}@starting-style{dialog.micl-sidesheet[open]::backdrop{background-color:rgba(0,0,0,0)}}body:has(dialog.micl-sidesheet[popover]){box-sizing:border-box;max-inline-size:100%;margin:0;transition:max-inline-size var(--md-comp-sidesheet-motion-duration-reverse)}body:has(dialog.micl-sidesheet:popover-open){max-inline-size:calc(100vw - var(--md-comp-sidesheet-container-max-width));transition:max-inline-size var(--md-comp-sidesheet-motion-duration) var(--md-comp-sidesheet-motion-spatial)}

package/dist/sidesheet.js

@@ -1 +1 @@
-!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.micl=o():e.micl=o()}(self,()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";let e={};return(e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());

package/dist/slider.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-shape-corner-extra-large: 28px}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}:root{--md-sys-motion-duration-medium2: 300ms}:root{--md-sys-motion-duration-long2: 500ms}input[type=range].micl-slider-xs{--md-sys-slider-handle-height: 44px;--md-sys-slider-track-height: 16px;--md-sys-slider-track-radius: var(--md-sys-shape-corner-small)}input[type=range].micl-slider-s{--md-sys-slider-handle-height: 44px;--md-sys-slider-track-height: 24px;--md-sys-slider-track-radius: var(--md-sys-shape-corner-small)}input[type=range].micl-slider-m{--md-sys-slider-handle-height: 52px;--md-sys-slider-track-height: 40px;--md-sys-slider-track-radius: var(--md-sys-shape-corner-medium)}input[type=range].micl-slider-l{--md-sys-slider-handle-height: 68px;--md-sys-slider-track-height: 56px;--md-sys-slider-track-radius: var(--md-sys-shape-corner-large)}input[type=range].micl-slider-xl{--md-sys-slider-handle-height: 108px;--md-sys-slider-track-height: 96px;--md-sys-slider-track-radius: var(--md-sys-shape-corner-extra-large)}input[type=range].micl-slider-xs,input[type=range].micl-slider-s,input[type=range].micl-slider-m,input[type=range].micl-slider-l,input[type=range].micl-slider-xl{--md-sys-slider-thumb-space: 6px;--md-sys-slider-track-direction: to right;appearance:none;position:relative;block-size:var(--md-sys-slider-track-height);margin:0;outline:none;color:var(--md-sys-color-surface-container-low);background-color:inherit;accent-color:var(--md-sys-color-primary)}input[type=range].micl-slider-xs::before,input[type=range].micl-slider-s::before,input[type=range].micl-slider-m::before,input[type=range].micl-slider-l::before,input[type=range].micl-slider-xl::before{content:attr(data-miclsliderticks);box-sizing:border-box;position:absolute;inline-size:100%;max-inline-size:100%;block-size:var(--md-sys-slider-track-height);line-height:var(--md-sys-slider-track-height);padding:0 4px;inset:0;color:var(--md-sys-color-on-primary);mix-blend-mode:difference;text-align:end;text-wrap-mode:nowrap}input[type=range].micl-slider-xs::after,input[type=range].micl-slider-s::after,input[type=range].micl-slider-m::after,input[type=range].micl-slider-l::after,input[type=range].micl-slider-xl::after{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);--md-sys-slider-tip-space: 4px;content:var(--md-sys-slider-tip);box-sizing:border-box;position:absolute;inline-size:fit-content;min-inline-size:48px;block-size:40px;inset:0;inset-block-start:calc(-1*(var(--md-sys-slider-handle-height) - var(--md-sys-slider-track-height))/2 - 40px - var(--md-sys-slider-tip-space));inset-inline-start:calc(-16px + (100% - 16px)*(var(--md-sys-slider-value) - var(--md-sys-slider-min))/(var(--md-sys-slider-max) - var(--md-sys-slider-min)));padding-block:12px;padding-inline:16px;border-radius:20px;background-color:var(--md-sys-color-inverse-surface);color:var(--md-sys-color-inverse-on-surface);text-align:center;opacity:0;z-index:3;transition:opacity var(--md-sys-motion-duration-long2) cubic-bezier(0.05, 0.7, 0.1, 1)}input[type=range].micl-slider-xs::-webkit-slider-container,input[type=range].micl-slider-s::-webkit-slider-container,input[type=range].micl-slider-m::-webkit-slider-container,input[type=range].micl-slider-l::-webkit-slider-container,input[type=range].micl-slider-xl::-webkit-slider-container{background-color:inherit}input[type=range].micl-slider-xs::-webkit-slider-runnable-track,input[type=range].micl-slider-s::-webkit-slider-runnable-track,input[type=range].micl-slider-m::-webkit-slider-runnable-track,input[type=range].micl-slider-l::-webkit-slider-runnable-track,input[type=range].micl-slider-xl::-webkit-slider-runnable-track{block-size:var(--md-sys-slider-track-height);border-radius:var(--md-sys-slider-track-radius);background-color:inherit;background-image:linear-gradient(var(--md-sys-slider-track-direction), var(--md-sys-color-primary) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), transparent calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), var(--md-sys-color-secondary-container) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), var(--md-sys-color-secondary-container) 100%, transparent)}input[type=range].micl-slider-xs::-moz-range-track,input[type=range].micl-slider-s::-moz-range-track,input[type=range].micl-slider-m::-moz-range-track,input[type=range].micl-slider-l::-moz-range-track,input[type=range].micl-slider-xl::-moz-range-track{block-size:var(--md-sys-slider-track-height);border-radius:var(--md-sys-slider-track-radius);background-color:inherit;background-image:linear-gradient(var(--md-sys-slider-track-direction), var(--md-sys-color-primary) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), transparent calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), var(--md-sys-color-secondary-container) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), var(--md-sys-color-secondary-container) 100%, transparent)}input[type=range].micl-slider-xs::-webkit-slider-thumb,input[type=range].micl-slider-s::-webkit-slider-thumb,input[type=range].micl-slider-m::-webkit-slider-thumb,input[type=range].micl-slider-l::-webkit-slider-thumb,input[type=range].micl-slider-xl::-webkit-slider-thumb{appearance:none;box-sizing:content-box;position:relative;inline-size:16px;block-size:var(--md-sys-slider-handle-height);inset:0;inset-block-start:calc(-1*(var(--md-sys-slider-handle-height) - var(--md-sys-slider-track-height) + 8px)/2);padding-block:4px;border:none;border-radius:8px;background-color:inherit;background-image:linear-gradient(var(--md-sys-slider-track-direction), transparent 0px, transparent var(--md-sys-slider-thumb-space), var(--md-sys-color-primary) var(--md-sys-slider-thumb-space), var(--md-sys-color-primary) 10px, transparent 10px, transparent 16px);background-clip:content-box;cursor:pointer;z-index:2}input[type=range].micl-slider-xs::-moz-range-thumb,input[type=range].micl-slider-s::-moz-range-thumb,input[type=range].micl-slider-m::-moz-range-thumb,input[type=range].micl-slider-l::-moz-range-thumb,input[type=range].micl-slider-xl::-moz-range-thumb{appearance:none;box-sizing:content-box;position:relative;inline-size:16px;block-size:var(--md-sys-slider-handle-height);inset:0;inset-block-start:calc(-1*(var(--md-sys-slider-handle-height) - var(--md-sys-slider-track-height) + 8px)/2);padding-block:4px;border:none;border-radius:8px;background-color:inherit;background-image:linear-gradient(var(--md-sys-slider-track-direction), transparent 0px, transparent var(--md-sys-slider-thumb-space), var(--md-sys-color-primary) var(--md-sys-slider-thumb-space), var(--md-sys-color-primary) 10px, transparent 10px, transparent 16px);background-clip:content-box;cursor:pointer;z-index:2}input[type=range].micl-slider-xs::-moz-range-progress,input[type=range].micl-slider-s::-moz-range-progress,input[type=range].micl-slider-m::-moz-range-progress,input[type=range].micl-slider-l::-moz-range-progress,input[type=range].micl-slider-xl::-moz-range-progress{block-size:var(--md-sys-slider-track-height)}input[type=range].micl-slider-xs:disabled::-webkit-slider-runnable-track,input[type=range].micl-slider-s:disabled::-webkit-slider-runnable-track,input[type=range].micl-slider-m:disabled::-webkit-slider-runnable-track,input[type=range].micl-slider-l:disabled::-webkit-slider-runnable-track,input[type=range].micl-slider-xl:disabled::-webkit-slider-runnable-track{background-image:linear-gradient(var(--md-sys-slider-track-direction), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity, 38%), transparent) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), transparent calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) 100%, transparent)}input[type=range].micl-slider-xs:disabled::-moz-range-track,input[type=range].micl-slider-s:disabled::-moz-range-track,input[type=range].micl-slider-m:disabled::-moz-range-track,input[type=range].micl-slider-l:disabled::-moz-range-track,input[type=range].micl-slider-xl:disabled::-moz-range-track{background-image:linear-gradient(var(--md-sys-slider-track-direction), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity, 38%), transparent) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), transparent calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) calc(100% * (var(--md-sys-slider-value) - var(--md-sys-slider-min)) / (var(--md-sys-slider-max) - var(--md-sys-slider-min))), color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) 100%, transparent)}input[type=range].micl-slider-xs:disabled::-webkit-slider-thumb,input[type=range].micl-slider-s:disabled::-webkit-slider-thumb,input[type=range].micl-slider-m:disabled::-webkit-slider-thumb,input[type=range].micl-slider-l:disabled::-webkit-slider-thumb,input[type=range].micl-slider-xl:disabled::-webkit-slider-thumb{background-color:inherit;background-image:linear-gradient(var(--md-sys-slider-track-direction), transparent 0px, transparent var(--md-sys-slider-thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity, 38%), var(--md-sys-color-surface)) var(--md-sys-slider-thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity, 38%), var(--md-sys-color-surface)) 10px, transparent 10px, transparent 16px);cursor:default}input[type=range].micl-slider-xs:disabled::-moz-range-thumb,input[type=range].micl-slider-s:disabled::-moz-range-thumb,input[type=range].micl-slider-m:disabled::-moz-range-thumb,input[type=range].micl-slider-l:disabled::-moz-range-thumb,input[type=range].micl-slider-xl:disabled::-moz-range-thumb{background-color:inherit;background-image:linear-gradient(var(--md-sys-slider-track-direction), transparent 0px, transparent var(--md-sys-slider-thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity, 38%), var(--md-sys-color-surface)) var(--md-sys-slider-thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity, 38%), var(--md-sys-color-surface)) 10px, transparent 10px, transparent 16px);cursor:default}input[type=range].micl-slider-xs.micl-slider--vertical,input[type=range].micl-slider-s.micl-slider--vertical,input[type=range].micl-slider-m.micl-slider--vertical,input[type=range].micl-slider-l.micl-slider--vertical,input[type=range].micl-slider-xl.micl-slider--vertical{--md-sys-slider-track-direction: to top;writing-mode:sideways-lr}input[type=range].micl-slider-xs.micl-slider--vertical::after,input[type=range].micl-slider-s.micl-slider--vertical::after,input[type=range].micl-slider-m.micl-slider--vertical::after,input[type=range].micl-slider-l.micl-slider--vertical::after,input[type=range].micl-slider-xl.micl-slider--vertical::after{--md-sys-slider-tip-space: 8px;transform:rotate(90deg)}input[type=range].micl-slider-xs:not(:disabled):active::after,input[type=range].micl-slider-xs:not(:disabled):focus::after,input[type=range].micl-slider-xs:not(:disabled):focus-visible::after,input[type=range].micl-slider-s:not(:disabled):active::after,input[type=range].micl-slider-s:not(:disabled):focus::after,input[type=range].micl-slider-s:not(:disabled):focus-visible::after,input[type=range].micl-slider-m:not(:disabled):active::after,input[type=range].micl-slider-m:not(:disabled):focus::after,input[type=range].micl-slider-m:not(:disabled):focus-visible::after,input[type=range].micl-slider-l:not(:disabled):active::after,input[type=range].micl-slider-l:not(:disabled):focus::after,input[type=range].micl-slider-l:not(:disabled):focus-visible::after,input[type=range].micl-slider-xl:not(:disabled):active::after,input[type=range].micl-slider-xl:not(:disabled):focus::after,input[type=range].micl-slider-xl:not(:disabled):focus-visible::after{opacity:1;transition:opacity var(--md-sys-motion-duration-medium2) cubic-bezier(0.3, 0, 0.8, 0.15)}input[type=range].micl-slider-xs:not(:disabled):focus-visible::-webkit-slider-thumb,input[type=range].micl-slider-s:not(:disabled):focus-visible::-webkit-slider-thumb,input[type=range].micl-slider-m:not(:disabled):focus-visible::-webkit-slider-thumb,input[type=range].micl-slider-l:not(:disabled):focus-visible::-webkit-slider-thumb,input[type=range].micl-slider-xl:not(:disabled):focus-visible::-webkit-slider-thumb{outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary)}input[type=range].micl-slider-xs:not(:disabled):focus-visible::-moz-range-thumb,input[type=range].micl-slider-s:not(:disabled):focus-visible::-moz-range-thumb,input[type=range].micl-slider-m:not(:disabled):focus-visible::-moz-range-thumb,input[type=range].micl-slider-l:not(:disabled):focus-visible::-moz-range-thumb,input[type=range].micl-slider-xl:not(:disabled):focus-visible::-moz-range-thumb{outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary)}input[type=range].micl-slider-xs:not(:disabled):active::-webkit-slider-thumb,input[type=range].micl-slider-s:not(:disabled):active::-webkit-slider-thumb,input[type=range].micl-slider-m:not(:disabled):active::-webkit-slider-thumb,input[type=range].micl-slider-l:not(:disabled):active::-webkit-slider-thumb,input[type=range].micl-slider-xl:not(:disabled):active::-webkit-slider-thumb{background-image:linear-gradient(var(--md-sys-slider-track-direction), transparent 0px, transparent calc(var(--md-sys-slider-thumb-space) + 1px), var(--md-sys-color-primary) calc(var(--md-sys-slider-thumb-space) + 1px), var(--md-sys-color-primary) calc(var(--md-sys-slider-thumb-space) + 3px), transparent calc(var(--md-sys-slider-thumb-space) + 3px), transparent calc(2 * var(--md-sys-slider-thumb-space) + 4px));outline:none;cursor:grabbing}input[type=range].micl-slider-xs:not(:disabled):active::-moz-range-thumb,input[type=range].micl-slider-s:not(:disabled):active::-moz-range-thumb,input[type=range].micl-slider-m:not(:disabled):active::-moz-range-thumb,input[type=range].micl-slider-l:not(:disabled):active::-moz-range-thumb,input[type=range].micl-slider-xl:not(:disabled):active::-moz-range-thumb{background-image:linear-gradient(var(--md-sys-slider-track-direction), transparent 0px, transparent calc(var(--md-sys-slider-thumb-space) + 1px), var(--md-sys-color-primary) calc(var(--md-sys-slider-thumb-space) + 1px), var(--md-sys-color-primary) calc(var(--md-sys-slider-thumb-space) + 3px), transparent calc(var(--md-sys-slider-thumb-space) + 3px), transparent calc(2 * var(--md-sys-slider-thumb-space) + 4px));outline:none;cursor:grabbing}.micl-slider__container{display:grid;grid-template-areas:"slider-icon";flex-shrink:0;align-items:center;justify-items:flex-start;background-color:inherit}.micl-slider__container:has(>.micl-slider-m,>.micl-slider-l,>.micl-slider-xl) .micl-slider__icon{grid-area:slider-icon;inset:0;margin:6px;font-size:var(--md-sys-icon-size, 24px);color:var(--md-sys-color-on-primary);z-index:1}.micl-slider__container>input[type=range]{grid-area:slider-icon}.micl-slider__container .micl-slider__icon:has(+input[type=range].micl-slider-xl),.micl-slider__container input[type=range].micl-slider-xl+.micl-slider__icon{margin:8px;font-size:32px}@supports(-moz-appearance: none){.micl-slider__container:has(>input[type=range]){position:relative}.micl-slider__container:has(>input[type=range])::after{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);--md-sys-slider-tip-space: 4px;content:var(--md-sys-slider-tip);box-sizing:border-box;position:absolute;inline-size:fit-content;min-inline-size:48px;block-size:40px;inset:0;inset-block-start:calc(-1*(var(--md-sys-slider-handle-height) - var(--md-sys-slider-track-height))/2 - 40px - var(--md-sys-slider-tip-space));inset-inline-start:calc(-16px + (100% - 16px)*(var(--md-sys-slider-value) - var(--md-sys-slider-min))/(var(--md-sys-slider-max) - var(--md-sys-slider-min)));padding-block:12px;padding-inline:16px;border-radius:20px;background-color:var(--md-sys-color-inverse-surface);color:var(--md-sys-color-inverse-on-surface);text-align:center;opacity:0;z-index:3;transition:opacity var(--md-sys-motion-duration-long2) cubic-bezier(0.05, 0.7, 0.1, 1)}.micl-slider__container:has(>input[type=range]:not(:disabled):active)::after,.micl-slider__container:has(>input[type=range]:not(:disabled):focus)::after,.micl-slider__container:has(>input[type=range]:not(:disabled):focus-visible)::after{opacity:1}.micl-slider__container:has(>input[type=range].micl-slider--vertical){--md-sys-slider-track-direction: to top;writing-mode:sideways-lr}.micl-slider__container:has(>input[type=range].micl-slider--vertical)::after{--md-sys-slider-tip-space: 8px;transform:rotate(90deg)}}[dir=rtl] input[type=range].micl-slider--vertical,[dir=rtl] .micl-slider__container:has(>input[type=range].micl-slider--vertical){writing-mode:sideways-rl}[dir=rtl] input[type=range].micl-slider--vertical::after,[dir=rtl] .micl-slider__container:has(>input[type=range].micl-slider--vertical)::after{transform:rotate(-90deg)}[dir=rtl] input[type=range].micl-slider-xs:not(.micl-slider--vertical),[dir=rtl] input[type=range].micl-slider-s:not(.micl-slider--vertical),[dir=rtl] input[type=range].micl-slider-m:not(.micl-slider--vertical),[dir=rtl] input[type=range].micl-slider-l:not(.micl-slider--vertical),[dir=rtl] input[type=range].micl-slider-xl:not(.micl-slider--vertical){--md-sys-slider-track-direction: to left}
+:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-shape-corner-large: 16px}:root{--md-sys-shape-corner-extra-large: 28px}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-typescale-label-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-large-size: 0.875rem;--md-sys-typescale-label-large-line-height: 1.25rem;--md-sys-typescale-label-large-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-large-tracking: 0.00625rem}:root{--md-sys-motion-duration-medium2: 300ms}:root{--md-sys-motion-duration-long2: 500ms}input[type=range].micl-slider-xs{--_handle-height: var(--md-comp-slider-handle-height, 44px);--_track-height: var(--md-comp-slider-track-height, 16px);--_track-shape: var(--md-comp-slider-track-shape, var(--md-sys-shape-corner-small))}input[type=range].micl-slider-s{--_handle-height: var(--md-comp-slider-handle-height, 44px);--_track-height: var(--md-comp-slider-track-height, 24px);--_track-shape: var(--md-comp-slider-track-shape, var(--md-sys-shape-corner-small))}input[type=range].micl-slider-m{--_handle-height: var(--md-comp-slider-handle-height, 52px);--_track-height: var(--md-comp-slider-track-height, 40px);--_track-shape: var(--md-comp-slider-track-shape, var(--md-sys-shape-corner-medium))}input[type=range].micl-slider-l{--_handle-height: var(--md-comp-slider-handle-height, 68px);--_track-height: var(--md-comp-slider-track-height, 56px);--_track-shape: var(--md-comp-slider-track-shape, var(--md-sys-shape-corner-large))}input[type=range].micl-slider-xl{--_handle-height: var(--md-comp-slider-handle-height, 108px);--_track-height: var(--md-comp-slider-track-height, 96px);--_track-shape: var(--md-comp-slider-track-shape, var(--md-sys-shape-corner-extra-large))}input[type=range][class*=micl-slider-]{--_thumb-space: 6px;--_direction: to right;--_fraction: calc((var(--micl-slider-value) - var(--micl-slider-min)) / (var(--micl-slider-max) - var(--micl-slider-min)));--_thumb-position: calc(var(--_fraction) * (100% - 16px));--_active-track-color: var(--md-comp-slider-active-track-color, var(--md-sys-color-primary));--_inactive-track-color: var(--md-comp-slider-inactive-track-color, var(--md-sys-color-secondary-container));--_handle-color: var(--md-comp-slider-handle-color, var(--md-sys-color-primary));appearance:none;position:relative;block-size:var(--_track-height);margin:0;outline:none;color:var(--md-sys-color-surface-container-low);background-color:inherit;accent-color:var(--md-sys-color-primary)}input[type=range][class*=micl-slider-]::before{content:attr(data-miclsliderticks);box-sizing:border-box;position:absolute;inline-size:100%;max-inline-size:100%;block-size:var(--_track-height);line-height:var(--_track-height);padding:0 4px;inset:0;color:var(--md-comp-slider-stop-indicator-color, var(--md-sys-color-on-primary));mix-blend-mode:difference;text-align:end;text-wrap-mode:nowrap}input[type=range][class*=micl-slider-]::after{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);--_tip-space: 4px;content:var(--micl-slider-tip);box-sizing:border-box;position:absolute;inline-size:fit-content;min-inline-size:48px;block-size:40px;inset:0;inset-block-start:calc(-1*(var(--_handle-height) - var(--_track-height))/2 - 40px - var(--_tip-space));inset-inline-start:calc(-16px + (100% - 16px)*var(--_fraction));padding-block:12px;padding-inline:16px;border-radius:20px;background-color:var(--md-comp-slider-value-indicator-container-color, var(--md-sys-color-inverse-surface));color:var(--md-comp-slider-value-indicator-label-text-color, var(--md-sys-color-inverse-on-surface));text-align:center;opacity:0;z-index:3;transition:opacity var(--md-sys-motion-duration-long2) cubic-bezier(0.05, 0.7, 0.1, 1)}input[type=range][class*=micl-slider-]::-webkit-slider-container{background-color:inherit}input[type=range][class*=micl-slider-]::-webkit-slider-runnable-track{block-size:var(--_track-height);border-radius:var(--_track-shape);background-color:inherit;background-image:linear-gradient(var(--_direction), var(--_active-track-color) var(--_thumb-position), transparent var(--_thumb-position) calc(var(--_thumb-position) + 16px), var(--_inactive-track-color) calc(var(--_thumb-position) + 16px))}input[type=range][class*=micl-slider-]::-moz-range-track{block-size:var(--_track-height);border-radius:var(--_track-shape);background-color:inherit;background-image:linear-gradient(var(--_direction), var(--_active-track-color) var(--_thumb-position), transparent var(--_thumb-position) calc(var(--_thumb-position) + 16px), var(--_inactive-track-color) calc(var(--_thumb-position) + 16px))}input[type=range][class*=micl-slider-]::-webkit-slider-thumb{appearance:none;box-sizing:content-box;position:relative;inline-size:16px;block-size:var(--_handle-height);inset:0;inset-block-start:calc(-1*(var(--_handle-height) - var(--_track-height) + 8px)/2);padding-block:4px;border:none;border-radius:8px;background-image:linear-gradient(var(--_direction), transparent 0px, transparent var(--_thumb-space), var(--_handle-color) var(--_thumb-space), var(--_handle-color) 10px, transparent 10px, transparent 16px);background-clip:content-box;cursor:pointer;z-index:2}input[type=range][class*=micl-slider-]::-moz-range-thumb{appearance:none;box-sizing:content-box;position:relative;inline-size:16px;block-size:var(--_handle-height);inset:0;inset-block-start:calc(-1*(var(--_handle-height) - var(--_track-height) + 8px)/2);padding-block:4px;border:none;border-radius:8px;background-image:linear-gradient(var(--_direction), transparent 0px, transparent var(--_thumb-space), var(--_handle-color) var(--_thumb-space), var(--_handle-color) 10px, transparent 10px, transparent 16px);background-clip:content-box;cursor:pointer;z-index:2}input[type=range][class*=micl-slider-]::-moz-range-progress{block-size:var(--_track-height)}input[type=range][class*=micl-slider-]:disabled::-webkit-slider-runnable-track{background-image:linear-gradient(var(--_direction), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity), transparent) var(--_thumb-position), transparent var(--_thumb-position) calc(var(--_thumb-position) + 16px), color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) calc(var(--_thumb-position) + 16px))}input[type=range][class*=micl-slider-]:disabled::-moz-range-track{background-image:linear-gradient(var(--_direction), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity), transparent) var(--_thumb-position), transparent var(--_thumb-position) calc(var(--_thumb-position) + 16px), color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) calc(var(--_thumb-position) + 16px))}input[type=range][class*=micl-slider-]:disabled::-webkit-slider-thumb{background-image:linear-gradient(var(--_direction), transparent 0px, transparent var(--_thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity), var(--md-sys-color-surface)) var(--_thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity), var(--md-sys-color-surface)) 10px, transparent 10px, transparent 16px);cursor:default}input[type=range][class*=micl-slider-]:disabled::-moz-range-thumb{background-image:linear-gradient(var(--_direction), transparent 0px, transparent var(--_thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity), var(--md-sys-color-surface)) var(--_thumb-space), color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-disabled-state-layer-opacity), var(--md-sys-color-surface)) 10px, transparent 10px, transparent 16px);cursor:default}input[type=range][class*=micl-slider-].micl-slider--vertical{--_direction: to top;writing-mode:sideways-lr}input[type=range][class*=micl-slider-].micl-slider--vertical::after{--_tip-space: 8px;transform:rotate(90deg)}input[type=range][class*=micl-slider-]:not(:disabled):active::after,input[type=range][class*=micl-slider-]:not(:disabled):focus::after,input[type=range][class*=micl-slider-]:not(:disabled):focus-visible::after{opacity:1;transition:opacity var(--md-sys-motion-duration-medium2) cubic-bezier(0.3, 0, 0.8, 0.15)}input[type=range][class*=micl-slider-]:not(:disabled):focus-visible::-webkit-slider-thumb{outline:var(--md-sys-state-focus-indicator-thickness) solid var(--md-sys-color-secondary)}input[type=range][class*=micl-slider-]:not(:disabled):focus-visible::-moz-range-thumb{outline:var(--md-sys-state-focus-indicator-thickness) solid var(--md-sys-color-secondary)}input[type=range][class*=micl-slider-]:not(:disabled):active::-webkit-slider-thumb{background-image:linear-gradient(var(--_direction), transparent 0px, transparent calc(var(--_thumb-space) + 1px), var(--_handle-color) calc(var(--_thumb-space) + 1px), var(--_handle-color) calc(var(--_thumb-space) + 3px), transparent calc(var(--_thumb-space) + 3px), transparent calc(2 * var(--_thumb-space) + 4px));outline:none;cursor:grabbing}input[type=range][class*=micl-slider-]:not(:disabled):active::-moz-range-thumb{background-image:linear-gradient(var(--_direction), transparent 0px, transparent calc(var(--_thumb-space) + 1px), var(--_handle-color) calc(var(--_thumb-space) + 1px), var(--_handle-color) calc(var(--_thumb-space) + 3px), transparent calc(var(--_thumb-space) + 3px), transparent calc(2 * var(--_thumb-space) + 4px));outline:none;cursor:grabbing}.micl-slider__container{display:grid;grid-template-areas:"slider-icon";flex-shrink:0;align-items:center;justify-items:flex-start;background-color:inherit}.micl-slider__container:has(>.micl-slider-m,>.micl-slider-l,>.micl-slider-xl) .micl-slider__icon{grid-area:slider-icon;inset:0;margin:6px;font-size:var(--md-sys-icon-size, 24px);color:var(--md-sys-color-on-primary);z-index:1}.micl-slider__container>input[type=range]{grid-area:slider-icon}.micl-slider__container .micl-slider__icon:has(+input[type=range].micl-slider-xl),.micl-slider__container input[type=range].micl-slider-xl+.micl-slider__icon{margin:8px;font-size:32px}@supports(-moz-appearance: none){.micl-slider__container:has(>input[type=range]){--_fraction: calc((var(--micl-slider-value) - var(--micl-slider-min)) / (var(--micl-slider-max) - var(--micl-slider-min)));position:relative}.micl-slider__container:has(>input[type=range])::after{font-family:var(--md-sys-typescale-label-large-font);font-size:var(--md-sys-typescale-label-large-size);line-height:var(--md-sys-typescale-label-large-line-height);font-weight:var(--md-sys-typescale-label-large-weight);letter-spacing:var(--md-sys-typescale-label-large-tracking);--_tip-space: 4px;content:var(--micl-slider-tip);box-sizing:border-box;position:absolute;inline-size:fit-content;min-inline-size:48px;block-size:40px;inset:0;inset-block-start:calc(-1*(var(--_handle-height) - var(--_track-height))/2 - 40px - var(--_tip-space));inset-inline-start:calc(-16px + (100% - 16px)*var(--_fraction));padding-block:12px;padding-inline:16px;border-radius:20px;background-color:var(--md-comp-slider-value-indicator-container-color, var(--md-sys-color-inverse-surface));color:var(--md-comp-slider-value-indicator-label-text-color, var(--md-sys-color-inverse-on-surface));text-align:center;opacity:0;z-index:3;transition:opacity var(--md-sys-motion-duration-long2) cubic-bezier(0.05, 0.7, 0.1, 1)}.micl-slider__container:has(>input[type=range]:not(:disabled):active)::after,.micl-slider__container:has(>input[type=range]:not(:disabled):focus)::after,.micl-slider__container:has(>input[type=range]:not(:disabled):focus-visible)::after{opacity:1}.micl-slider__container:has(>input[type=range].micl-slider--vertical){--_direction: to top;writing-mode:sideways-lr}.micl-slider__container:has(>input[type=range].micl-slider--vertical)::after{--_tip-space: 8px;transform:rotate(90deg)}}input[type=range].micl-slider--vertical:dir(rtl),.micl-slider__container:dir(rtl):has(>input[type=range].micl-slider--vertical){writing-mode:sideways-rl}input[type=range].micl-slider--vertical:dir(rtl)::after,.micl-slider__container:dir(rtl):has(>input[type=range].micl-slider--vertical)::after{transform:rotate(-90deg)}input[type=range][class*=micl-slider-]:dir(rtl):not(.micl-slider--vertical){--_direction: to left}

package/dist/slider.js

@@ -1 +1 @@
-!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.micl=o():e.micl=o()}(self,()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={56(e,t,o){const r=globalThis.__miclRegistry??={map:{},rippled:new WeakSet,activated:!1},n=()=>Object.keys(r.map).join(","),i=e=>Object.entries(r.map).find(([t,{type:o}])=>e.matches(t)&&e instanceof o)?.[1],l=e=>{const t=i(e);t&&"function"==typeof t.component.initialize&&t.component.initialize(e)},s=e=>{const t=i(e);t&&"function"==typeof t.component.cleanup&&t.component.cleanup(e)},c=e=>{const t=n();if(!t)return;const o=e.target.closest(t);if(!(o instanceof HTMLElement))return;const r=i(o),l=e.type;r&&"function"==typeof r.component[l]&&r.component[l]?.(e)},a=()=>{r.activated||(r.activated=!0,new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=n();t&&e.matches(t)&&l(e),t&&e.querySelectorAll(t).forEach(l)}}),e.removedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=n();t&&e.matches(t)&&s(e),(e=>{const t=n();t&&e.querySelectorAll(t).forEach(s)})(e)}}))})}).observe(document.body,{childList:!0,subtree:!0}),(e=>{const t=n();t&&e.querySelectorAll(t).forEach(l),e.querySelectorAll('[class*="micl-"], [class*="micl-"] > summary').forEach(e=>{r.rippled.has(e)||"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&(e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();const o=e.getBoundingClientRect();e.style.setProperty("--micl-x",(t.clientX-o.left)/o.width*100+"%"),e.style.setProperty("--micl-y",(t.clientY-o.top)/o.height*100+"%"),e.classList.remove("micl-rippling"),e.offsetWidth,e.classList.add("micl-rippling");const r=t=>{"micl-ripple"===t.animationName&&(e.classList.remove("micl-rippling"),e.style.removeProperty("--micl-x"),e.style.removeProperty("--micl-y"),e.removeEventListener("animationend",r))};e.addEventListener("animationend",r)}),r.rippled.add(e))}),document.documentElement.style.setProperty("--md-sys-scrollbar-thumb-color",window.getComputedStyle(document.body).getPropertyValue("--md-sys-color-outline").trim())})(document),document.addEventListener("change",c),document.addEventListener("input",c),document.addEventListener("keydown",c))},d=()=>{document.removeEventListener("DOMContentLoaded",d),a()};"loading"!==document.readyState?a():document.addEventListener("DOMContentLoaded",d),o.d(t,["register",0,(e,t,o)=>(r.map[e]={component:t,type:o},r.activated&&document.querySelectorAll(e).forEach(l),t)])}};const t={};function o(r){const n=t[r];if(void 0!==n)return n.exports;const i=t[r]={exports:{}};return e[r](i,i.exports,o),i.exports}o.d=(e,t)=>{if(Array.isArray(t))for(var r=0;r<t.length;){var n=t[r++],i=t[r++];o.o(e,n)?0===i&&r++:0===i?Object.defineProperty(e,n,{enumerable:!0,value:t[r++]}):Object.defineProperty(e,n,{enumerable:!0,get:i})}else for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};let r={};o.r(r);var n=o(56);const i="input[type=range][class*=micl-slider-]",l=String.fromCharCode(8226),s=String.fromCharCode(8201),c=e=>e.parentElement?.classList.contains("micl-slider__container")?e.parentElement:null,a=(e,t)=>{e.dataset.miclsliderticks=t},d=e=>{let t=JSON.stringify(e.value+""),o=c(e);o&&(o.style.setProperty("--micl-slider-value",e.value),o.style.setProperty("--micl-slider-tip",t)),e.style.setProperty("--micl-slider-value",e.value),e.style.setProperty("--micl-slider-tip",t)},m=(0,n.register)(i,{initialize:e=>{if(!e.matches(i))return;(e=>{let t=e.max||"100";c(e)?.style.setProperty("--micl-slider-max",t),e.style.setProperty("--micl-slider-max",t)})(e),(e=>{let t=e.min||"0";c(e)?.style.setProperty("--micl-slider-min",t),e.style.setProperty("--micl-slider-min",t)})(e),d(e),(e=>{let t=c(e);if(t){const o=window.getComputedStyle(e);["--_handle-height","--_track-height"].forEach(e=>{t.style.setProperty(e,o.getPropertyValue(e))})}})(e);const t=parseFloat(e.max),o=parseFloat(e.min),r=e.getBoundingClientRect(),n=((e,t,o)=>{const r=[];return e.list&&t>o&&e.list.querySelectorAll("option[value]").forEach(e=>{let n=parseFloat(e.value);!isNaN(n)&&n>=o&&n<=t&&r.push(n)}),r})(e,t,o).sort((e,t)=>e-t).map(e=>Math.round(100*(e-o)/(t-o)));if(n.length>0){const t=document.createElement("canvas"),o=t.getContext("2d");if(o){o.font=window.getComputedStyle(e).getPropertyValue("font");let t=o.measureText(s).width,i=o.measureText(l).width,c=r.width-10,d=0,m="";n.forEach(e=>{let o=c*e/100,r=Math.round((o-d)/t)-1;for(let e=0;e<r;e++)m+=s,d+=t;m+=l,d+=i}),a(e,m)}t.remove()}else a(e,l)},input:e=>{e.target.matches(i)&&e.target instanceof HTMLInputElement&&!e.target.disabled&&d(e.target)}},HTMLInputElement);return o.d(r,["default",0,m,"sliderSelector",0,i]),r})());

package/dist/snackbar.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-layout-pane-spacer: 24px}@media(max-width: 599px){:root{--md-sys-layout-window-margin: 16px}}@media(min-width: 600px)and (max-width: 839px){:root{--md-sys-layout-window-margin: 24px}}@media(min-width: 840px)and (max-width: 1199px){:root{--md-sys-layout-window-margin: 24px}}@media(min-width: 1200px)and (max-width: 1599px){:root{--md-sys-layout-window-margin: 24px}}@media(min-width: 1600px){:root{--md-sys-layout-window-margin: 24px}}.micl-window{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);margin:0;background-color:var(--md-sys-color-surface)}.micl-window .micl-body .micl-appbar{margin-inline:calc(-1*var(--md-sys-layout-window-margin))}.micl-window:not(.micl-window--spatial):has(nav.micl-navigationrail) .micl-body .micl-appbar{margin-inline-start:0}.micl-window.micl-window--spatial{--md-sys-layout-spatial-radius: calc(var(--md-sys-shape-corner-medium) + var(--md-sys-layout-window-margin));display:flex;padding-block:calc(2*var(--md-sys-layout-window-margin));gap:var(--md-sys-layout-window-margin)}.micl-window.micl-window--spatial .micl-navigationrail{display:flex;align-self:flex-start;block-size:inherit;min-block-size:inherit;margin:0;padding-block-end:var(--md-sys-navigationrail-top-space, 0px);border-radius:var(--md-sys-layout-spatial-radius)}.micl-window.micl-window--spatial .micl-body{background:rgba(0,0,0,0)}.micl-window.micl-window--spatial .micl-pane{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);border-radius:var(--md-sys-layout-spatial-radius);background-color:var(--md-sys-color-surface)}.micl-body{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--md-sys-comp-margin, 8px) var(--md-sys-layout-pane-spacer);background-color:inherit}.micl-body.micl-body--split:has(>.micl-pane:nth-child(2)) .micl-pane{flex-basis:50%}.micl-body.micl-body--evenly .micl-pane{flex:1 1 0}.micl-pane{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane.micl-pane--fixed{flex:0 0 auto}.micl-pane:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined),.micl-pane>*:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns{display:flex}.micl-pane>.micl-pane__columns:has(>.micl-pane__column>.micl-card-elevated,>.micl-pane__column>.micl-card-filled,>.micl-pane__column>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane>.micl-pane__columns>.micl-pane__column:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){row-gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column.micl-pane__column--fixed{flex:0 0 auto}.micl-pane>.micl-pane__columns.micl-pane__columns--evenly>.micl-pane__column{flex:1 1 0}@media(max-width: 599px){.micl-body.micl-body--stacked-to-medium,.micl-body.micl-body--stacked-to-expanded,.micl-body.micl-body--stacked-to-large,.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-medium,.micl-pane.micl-pane--hidden-to-expanded,.micl-pane.micl-pane--hidden-to-large,.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-medium,.micl-pane__columns.micl-pane__columns--stacked-to-expanded,.micl-pane__columns.micl-pane__columns--stacked-to-large,.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}@media(min-width: 600px)and (max-width: 839px){.micl-body.micl-body--stacked-to-expanded,.micl-body.micl-body--stacked-to-large,.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-expanded,.micl-pane.micl-pane--hidden-to-large,.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-expanded,.micl-pane__columns.micl-pane__columns--stacked-to-large,.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}@media(min-width: 840px)and (max-width: 1199px){.micl-body.micl-body--stacked-to-large,.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-large,.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-large,.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}@media(min-width: 1200px)and (max-width: 1599px){.micl-body.micl-body--stacked-to-extralarge{flex-direction:column}.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level3: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 4px 8px 3px}:root{--md-sys-shape-corner-extra-small: 4px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.0125rem}:root{--md-comp-snackbar-margin: 24px;--md-comp-snackbar-padding: 16px;--md-comp-snackbar-dir-factor: 1}[dir=rtl]{--md-comp-snackbar-dir-factor: -1}.micl-snackbar{--md-comp-snackbar-motion-spatial: cubic-bezier(0.38, 1.21, 0.22, 1);--md-comp-snackbar-motion-duration: 500ms;--md-comp-snackbar-motion-duration-reverse: 350ms;--statelayer-color: var(--md-sys-color-inverse-primary);--statelayer-opacity: 0;box-sizing:border-box;position:fixed;display:flex;align-items:center;justify-content:space-between;column-gap:4px;block-size:0;inline-size:max-content;max-inline-size:min(1199px,100vw - 2*var(--md-sys-layout-window-margin));min-inline-size:300px;inset:auto;inset-block-end:calc(var(--md-comp-snackbar-margin, 24px) + env(safe-area-inset-bottom));inset-inline-start:50%;margin:0;padding-block:0;padding-inline:var(--md-comp-snackbar-padding, 16px);border:none;outline:none;border-radius:var(--md-comp-snackbar-container-shape, var(--md-sys-shape-corner-extra-small));box-shadow:var(--md-comp-snackbar-container-elevation, var(--md-sys-elevation-level3));background-color:var(--md-comp-snackbar-container-color, var(--md-sys-color-inverse-surface));background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;opacity:0;overflow-y:hidden;translate:calc(var(--md-comp-snackbar-dir-factor, 1)*-50%);transition:block-size var(--md-comp-snackbar-motion-duration-reverse) var(--md-comp-snackbar-motion-spatial),opacity var(--md-comp-snackbar-motion-duration-reverse) linear,display var(--md-comp-snackbar-motion-duration-reverse) linear allow-discrete,overlay var(--md-comp-snackbar-motion-duration-reverse) linear allow-discrete,--statelayer-opacity var(--md-comp-snackbar-motion-duration) linear}.micl-snackbar:hover{--statelayer-color: var(--md-comp-snackbar-action-hover-state-layer-color, var(--md-sys-color-inverse-primary));--statelayer-opacity: var(--md-comp-snackbar-action-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity))}.micl-snackbar:focus-visible{--statelayer-color: var(--md-comp-snackbar-action-focus-state-layer-color, var(--md-sys-color-inverse-primary));--statelayer-opacity: var(--md-comp-snackbar-action-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity))}.micl-snackbar:active{--statelayer-color: var(--md-comp-snackbar-action-pressed-state-layer-color, var(--md-sys-color-inverse-primary));--statelayer-opacity: var(--md-comp-snackbar-action-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity))}.micl-snackbar:popover-open{block-size:var(--md-comp-snackbar-with-single-line-container-height, 48px);opacity:1;transition:block-size var(--md-comp-snackbar-motion-duration) var(--md-comp-snackbar-motion-spatial),opacity var(--md-comp-snackbar-motion-duration-reverse) linear,--statelayer-opacity var(--md-comp-snackbar-motion-duration) linear}@starting-style{.micl-snackbar:popover-open{block-size:0;opacity:0}}.micl-snackbar.micl-snackbar--two:popover-open{block-size:var(--md-comp-snackbar-with-two-lines-container-height, 68px)}.micl-snackbar .micl-snackbar__supporting-text{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking);display:flex;flex-direction:column;color:var(--md-comp-snackbar-supporting-text-color, var(--md-sys-color-inverse-on-surface))}.micl-snackbar:has(button){padding-inline-end:4px}.micl-snackbar button{--statelayer-color: var(--md-comp-snackbar-action-label-text-color, var(--md-sys-color-inverse-primary));color:var(--md-comp-snackbar-action-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button:hover{color:var(--md-comp-snackbar-action-hover-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button:focus-visible{color:var(--md-comp-snackbar-action-focus-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button:active{color:var(--md-comp-snackbar-action-pressed-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button[class*=micl-iconbutton]{--statelayer-color: var(--md-comp-snackbar-icon-color, var(--md-sys-color-inverse-on-surface));color:var(--md-comp-snackbar-icon-color, var(--md-sys-color-inverse-on-surface));font-size:var(--md-comp-snackbar-icon-size, var(--md-sys-icon-size, 24px))}.micl-snackbar button[class*=micl-iconbutton]:hover{color:var(--md-comp-snackbar-icon-hover-icon-color, var(--md-sys-color-inverse-on-surface))}.micl-snackbar button[class*=micl-iconbutton]:focus-visible{color:var(--md-comp-snackbar-icon-focus-icon-color, var(--md-sys-color-inverse-on-surface))}.micl-snackbar button[class*=micl-iconbutton]:active{color:var(--md-comp-snackbar-icon-pressed-icon-color, var(--md-sys-color-inverse-on-surface))}@media(max-width: 599px){.micl-snackbar{inline-size:calc(100vw - 2*var(--md-sys-layout-window-margin));min-inline-size:auto}}
+:root{--md-sys-shape-corner-medium: 12px}:root{--md-sys-layout-pane-spacer: 24px;--md-sys-layout-window-margin: 24px}@media(max-width: 599px){:root{--md-sys-layout-window-margin: 16px}}@media(min-width: 840px)and (max-width: 1199px){:root{--md-sys-layout-pane-fixed-width: 360px}}@media(min-width: 1200px){:root{--md-sys-layout-pane-fixed-width: 412px}}.micl-window{padding:env(safe-area-inset-top, 0px) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-right, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px)) calc(var(--md-sys-layout-window-margin) + env(safe-area-inset-left, 0px));margin:0;background-color:var(--md-sys-color-surface)}.micl-window .micl-panes .micl-appbar{margin-inline:calc(-1*var(--md-sys-layout-window-margin))}.micl-window:not(.micl-window--spatial):has(nav.micl-navigationrail) .micl-panes .micl-appbar{margin-inline-start:0}.micl-window.micl-window--spatial{--md-sys-layout-spatial-radius: calc(var(--md-sys-shape-corner-medium) + var(--md-sys-layout-window-margin));display:flex;padding-block:calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-top, 0px)) calc(2*var(--md-sys-layout-window-margin) + env(safe-area-inset-bottom, 0px));gap:var(--md-sys-layout-window-margin)}.micl-window.micl-window--spatial .micl-navigationrail{display:flex;align-self:flex-start;block-size:inherit;min-block-size:inherit;margin:0;padding-block-end:var(--md-sys-navigationrail-top-space, 0px);border-radius:var(--md-sys-layout-spatial-radius)}.micl-window.micl-window--spatial .micl-panes{background:rgba(0,0,0,0)}.micl-window.micl-window--spatial .micl-pane{padding:0 var(--md-sys-layout-window-margin) var(--md-sys-layout-window-margin);border-radius:var(--md-sys-layout-spatial-radius);background-color:var(--md-sys-color-surface)}.micl-panes{box-sizing:border-box;display:flex;flex-direction:row;gap:var(--md-sys-comp-margin, 8px) var(--md-sys-layout-pane-spacer);background-color:inherit}.micl-panes.micl-panes--split>.micl-pane+.micl-pane{--_layout-safe-inline-end: env(safe-area-inset-right, 0px);box-sizing:border-box;flex:0 1 var(--_layout-stacked-pane-size, calc(50vw - var(--md-sys-layout-window-margin, 0px) - var(--_layout-safe-inline-end) - var(--md-sys-layout-pane-spacer) / 2))}.micl-panes.micl-panes--split>.micl-pane+.micl-pane:dir(rtl){--_layout-safe-inline-end: env(safe-area-inset-left, 0px)}.micl-panes.micl-panes--evenly .micl-pane{flex:1 1 0}.micl-pane{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane.micl-pane--fixed{flex:0 0 auto;box-sizing:border-box;inline-size:var(--_layout-stacked-pane-size, var(--md-sys-layout-pane-fixed-width, auto))}.micl-pane:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined),.micl-pane>*:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns{display:flex}.micl-pane>.micl-pane__columns:has(>.micl-pane__column>.micl-card-elevated,>.micl-pane__column>.micl-card-filled,>.micl-pane__column>.micl-card-outlined){gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column{display:flex;flex-direction:column;flex:1 1 auto;min-inline-size:0;background-color:inherit}.micl-pane>.micl-pane__columns>.micl-pane__column:has(>.micl-card-elevated,>.micl-card-filled,>.micl-card-outlined){row-gap:var(--md-comp-card-margin, 8px)}.micl-pane>.micl-pane__columns>.micl-pane__column.micl-pane__column--fixed{flex:0 0 auto}.micl-pane>.micl-pane__columns.micl-pane__columns--evenly>.micl-pane__column{flex:1 1 0}@media(max-width: 599px){.micl-panes.micl-panes--stacked-to-medium{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-medium{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-medium{flex-direction:column}}@media(max-width: 839px){.micl-panes.micl-panes--stacked-to-expanded{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-expanded{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-expanded{flex-direction:column}}@media(max-width: 1199px){.micl-panes.micl-panes--stacked-to-large{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-large{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-large{flex-direction:column}}@media(max-width: 1599px){.micl-panes.micl-panes--stacked-to-extralarge{--_layout-stacked-pane-size: auto;flex-direction:column}.micl-pane.micl-pane--hidden-to-extralarge{display:none}.micl-pane__columns.micl-pane__columns--stacked-to-extralarge{flex-direction:column}}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}body{--md-sys-elevation-level3: rgb(from var(--md-sys-color-shadow) r g b/0.3) 0 1px 3px 0, rgb(from var(--md-sys-color-shadow) r g b/0.15) 0 4px 8px 3px}:root{--md-sys-shape-corner-extra-small: 4px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-medium-size: 0.875rem;--md-sys-typescale-body-medium-line-height: 1.25rem;--md-sys-typescale-body-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-medium-tracking: 0.0125rem}.micl-snackbar{--md-comp-snackbar-motion-spatial: cubic-bezier(0.38, 1.21, 0.22, 1);--md-comp-snackbar-motion-duration: 500ms;--md-comp-snackbar-motion-duration-reverse: 350ms;--micl-duration: var(--md-comp-snackbar-motion-duration-reverse);--statelayer-color: var(--md-sys-color-inverse-primary);--statelayer-opacity: 0%;box-sizing:border-box;position:fixed;display:flex;align-items:center;justify-content:space-between;column-gap:4px;block-size:0;inline-size:max-content;max-inline-size:min(1199px,100vw - 2*var(--md-sys-layout-window-margin));min-inline-size:300px;inset:auto;inset-block-end:calc(var(--md-comp-snackbar-margin, 24px) + env(safe-area-inset-bottom));inset-inline:0;margin-block:0;margin-inline:auto;padding-block:0;padding-inline:var(--md-comp-snackbar-padding, 16px);border:none;outline:none;border-radius:var(--md-comp-snackbar-container-shape, var(--md-sys-shape-corner-extra-small));box-shadow:var(--md-comp-snackbar-container-elevation, var(--md-sys-elevation-level3));background-color:var(--md-comp-snackbar-container-color, var(--md-sys-color-inverse-surface));background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;opacity:0;overflow-y:hidden;transition:block-size var(--micl-duration) var(--md-comp-snackbar-motion-spatial),opacity var(--md-comp-snackbar-motion-duration-reverse) linear,display var(--md-comp-snackbar-motion-duration-reverse) linear allow-discrete,overlay var(--md-comp-snackbar-motion-duration-reverse) linear allow-discrete,--statelayer-opacity var(--md-comp-snackbar-motion-duration) linear}.micl-snackbar:hover{--statelayer-color: var(--md-comp-snackbar-action-hover-state-layer-color, var(--md-sys-color-inverse-primary));--statelayer-opacity: var(--md-comp-snackbar-action-hover-state-layer-opacity, var(--md-sys-state-hover-state-layer-opacity))}.micl-snackbar:focus-visible{--statelayer-color: var(--md-comp-snackbar-action-focus-state-layer-color, var(--md-sys-color-inverse-primary));--statelayer-opacity: var(--md-comp-snackbar-action-focus-state-layer-opacity, var(--md-sys-state-focus-state-layer-opacity))}.micl-snackbar:active{--statelayer-color: var(--md-comp-snackbar-action-pressed-state-layer-color, var(--md-sys-color-inverse-primary));--statelayer-opacity: var(--md-comp-snackbar-action-pressed-state-layer-opacity, var(--md-sys-state-pressed-state-layer-opacity))}.micl-snackbar:popover-open{--micl-duration: var(--md-comp-snackbar-motion-duration);block-size:var(--md-comp-snackbar-with-single-line-container-height, 48px);opacity:1}@starting-style{.micl-snackbar:popover-open{block-size:0;opacity:0}}.micl-snackbar.micl-snackbar--two:popover-open{block-size:var(--md-comp-snackbar-with-two-lines-container-height, 68px)}.micl-snackbar .micl-snackbar__supporting-text{font-family:var(--md-sys-typescale-body-medium-font);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);font-weight:var(--md-sys-typescale-body-medium-weight);letter-spacing:var(--md-sys-typescale-body-medium-tracking);display:flex;flex-direction:column;color:var(--md-comp-snackbar-supporting-text-color, var(--md-sys-color-inverse-on-surface))}.micl-snackbar:has(button){padding-inline-end:4px}.micl-snackbar button{--statelayer-color: var(--md-comp-snackbar-action-label-text-color, var(--md-sys-color-inverse-primary));color:var(--md-comp-snackbar-action-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button:hover{color:var(--md-comp-snackbar-action-hover-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button:focus-visible{color:var(--md-comp-snackbar-action-focus-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button:active{color:var(--md-comp-snackbar-action-pressed-label-text-color, var(--md-sys-color-inverse-primary))}.micl-snackbar button[class*=micl-iconbutton]{--statelayer-color: var(--md-comp-snackbar-icon-color, var(--md-sys-color-inverse-on-surface));color:var(--md-comp-snackbar-icon-color, var(--md-sys-color-inverse-on-surface));font-size:var(--md-comp-snackbar-icon-size, var(--md-sys-icon-size, 24px))}.micl-snackbar button[class*=micl-iconbutton]:hover{color:var(--md-comp-snackbar-icon-hover-icon-color, var(--md-sys-color-inverse-on-surface))}.micl-snackbar button[class*=micl-iconbutton]:focus-visible{color:var(--md-comp-snackbar-icon-focus-icon-color, var(--md-sys-color-inverse-on-surface))}.micl-snackbar button[class*=micl-iconbutton]:active{color:var(--md-comp-snackbar-icon-pressed-icon-color, var(--md-sys-color-inverse-on-surface))}@media(max-width: 599px){.micl-snackbar{inline-size:calc(100vw - 2*var(--md-sys-layout-window-margin));min-inline-size:auto}}

package/dist/snackbar.js

@@ -1 +1 @@
-!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.micl=o():e.micl=o()}(self,()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={56(e,t,o){const n=globalThis.__miclRegistry??={map:{},rippled:new WeakSet,activated:!1},i=()=>Object.keys(n.map).join(","),r=e=>Object.entries(n.map).find(([t,{type:o}])=>e.matches(t)&&e instanceof o)?.[1],a=e=>{const t=r(e);t&&"function"==typeof t.component.initialize&&t.component.initialize(e)},c=e=>{const t=r(e);t&&"function"==typeof t.component.cleanup&&t.component.cleanup(e)},l=e=>{const t=i();if(!t)return;const o=e.target.closest(t);if(!(o instanceof HTMLElement))return;const n=r(o),a=e.type;n&&"function"==typeof n.component[a]&&n.component[a]?.(e)},s=()=>{n.activated||(n.activated=!0,new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=i();t&&e.matches(t)&&a(e),t&&e.querySelectorAll(t).forEach(a)}}),e.removedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=i();t&&e.matches(t)&&c(e),(e=>{const t=i();t&&e.querySelectorAll(t).forEach(c)})(e)}}))})}).observe(document.body,{childList:!0,subtree:!0}),(e=>{const t=i();t&&e.querySelectorAll(t).forEach(a),e.querySelectorAll('[class*="micl-"], [class*="micl-"] > summary').forEach(e=>{n.rippled.has(e)||"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&(e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();const o=e.getBoundingClientRect();e.style.setProperty("--micl-x",(t.clientX-o.left)/o.width*100+"%"),e.style.setProperty("--micl-y",(t.clientY-o.top)/o.height*100+"%"),e.classList.remove("micl-rippling"),e.offsetWidth,e.classList.add("micl-rippling");const n=t=>{"micl-ripple"===t.animationName&&(e.classList.remove("micl-rippling"),e.style.removeProperty("--micl-x"),e.style.removeProperty("--micl-y"),e.removeEventListener("animationend",n))};e.addEventListener("animationend",n)}),n.rippled.add(e))}),document.documentElement.style.setProperty("--md-sys-scrollbar-thumb-color",window.getComputedStyle(document.body).getPropertyValue("--md-sys-color-outline").trim())})(document),document.addEventListener("change",l),document.addEventListener("input",l),document.addEventListener("keydown",l))},d=()=>{document.removeEventListener("DOMContentLoaded",d),s()};"loading"!==document.readyState?s():document.addEventListener("DOMContentLoaded",d),o.d(t,["register",0,(e,t,o)=>(n.map[e]={component:t,type:o},n.activated&&document.querySelectorAll(e).forEach(a),t)])}};const t={};function o(n){const i=t[n];if(void 0!==i)return i.exports;const r=t[n]={exports:{}};return e[n](r,r.exports,o),r.exports}o.d=(e,t)=>{if(Array.isArray(t))for(var n=0;n<t.length;){var i=t[n++],r=t[n++];o.o(e,i)?0===r&&n++:0===r?Object.defineProperty(e,i,{enumerable:!0,value:t[n++]}):Object.defineProperty(e,i,{enumerable:!0,get:r})}else for(var i in t)o.o(t,i)&&!o.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};let n={};o.r(n);var i=o(56);const r=".micl-snackbar",a=new WeakMap,c=e=>{const t=a.get(e);t&&t.timeoutid&&(clearTimeout(t.timeoutid),t.timeoutid=void 0)},l=e=>{c(e);const t=a.get(e);t&&(t.timeoutid=window.setTimeout(()=>{e.isConnected&&e.matches(":popover-open")&&e.hidePopover()},t.delay))},s=(0,i.register)(r,{initialize:e=>{if(!e.matches(r)||e.dataset.miclinitialized)return;const t=e.dataset.micldelay,o=t?parseInt(t,10):0;if(isNaN(o)||o<=0)return;e.dataset.miclinitialized="1";const n=()=>c(e),i=t=>{"open"===t.newState?l(e):c(e)},s=()=>{e.matches(":popover-open")&&l(e)};a.set(e,{delay:o,boundHandleToggle:i,boundClearTimer:n,boundHandleMouseLeave:s}),e.addEventListener("toggle",i),e.addEventListener("mouseenter",n),e.addEventListener("mouseleave",s)},cleanup:e=>{const t=a.get(e);t&&(c(e),e.removeEventListener("toggle",t.boundHandleToggle),e.removeEventListener("mouseenter",t.boundClearTimer),e.removeEventListener("mouseleave",t.boundHandleMouseLeave),a.delete(e)),delete e.dataset.miclinitialized}},HTMLElement);return o.d(n,["default",0,s,"snackbarSelector",0,r]),n})());

package/dist/stepper.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-stepper-counter-style: decimal;--md-sys-stepper-dot-size: 12px}body{--md-sys-stepper-dot-done-color: var(--md-sys-color-tertiary-container, blue)}.micl-stepper{--md-sys-stepper-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-sys-stepper-motion-duration: 650ms;--md-sys-stepper-motion-duration-reverse: 500ms;box-sizing:border-box;display:flex;flex-direction:column;row-gap:var(--md-sys-padding-xl, 24px);margin:0}.micl-stepper .micl-stepper__header{--md-sys-stepper-dot-size: 24px;display:flex;justify-content:space-between;align-items:flex-start;margin-inline:-10px;background-image:linear-gradient(90deg, var(--md-sys-divider-color), var(--md-sys-divider-color));background-position:center;background-repeat:no-repeat;background-size:100% 1px;counter-reset:dotnumber}.micl-stepper .micl-stepper__header button{background-color:var(--_card-background-color, inherit);pointer-events:none}.micl-stepper .micl-stepper__header button.micl-stepper__progress--done{pointer-events:inherit}.micl-stepper .micl-stepper__header .micl-stepper__progress-dot::before{content:counter(dotnumber, var(--md-sys-stepper-counter-style))}.micl-stepper.micl-stepper--nonlinear .micl-stepper__header button{pointer-events:inherit}.micl-stepper .micl-stepper__steps{display:grid;grid-template-areas:"stepper-steps";overflow-x:hidden}.micl-stepper .micl-stepper__steps .micl-stepper__step{grid-area:stepper-steps;display:flex;visibility:hidden;flex-direction:column;margin:0;padding:0;border:none;opacity:0%;transform:translateX(100%);transition:opacity var(--md-sys-stepper-motion-duration) linear,transform var(--md-sys-stepper-motion-duration) var(--md-sys-stepper-motion-spatial)}.micl-stepper .micl-stepper__steps .micl-stepper__step:has(~.micl-stepper__step[aria-current=step]){transform:translateX(-100%)}.micl-stepper .micl-stepper__steps .micl-stepper__step.micl-stepper__step--toselected{visibility:visible}.micl-stepper .micl-stepper__steps .micl-stepper__step[aria-current=step]{visibility:visible;opacity:100%;transform:translateX(0%)}.micl-stepper .micl-stepper__steps .micl-stepper__step.micl-stepper__step--fromselected{visibility:visible}.micl-stepper .micl-stepper__actions{display:flex;flex-direction:row;justify-content:center;inline-size:100%;align-items:center}.micl-stepper .micl-stepper__actions>:first-child,.micl-stepper .micl-stepper__actions>:last-child{display:flex;flex:1 1 0;column-gap:var(--md-sys-padding-xs, 8px)}.micl-stepper .micl-stepper__actions>:last-child{justify-content:flex-end}.micl-stepper .micl-stepper__progress-dots{display:flex;align-items:center;column-gap:4px}.micl-stepper .micl-stepper__progress-dot{block-size:var(--md-sys-stepper-dot-size);inline-size:var(--md-sys-stepper-dot-size);min-inline-size:var(--md-sys-stepper-dot-size);line-height:var(--md-sys-stepper-dot-size);border-radius:calc(var(--md-sys-stepper-dot-size)/2);text-align:center;background-color:var(--md-sys-color-on-surface);color:var(--md-sys-color-surface);opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%);counter-increment:dotnumber 1}.micl-stepper .micl-stepper__progress--done.micl-stepper__progress-dot,.micl-stepper .micl-stepper__progress--done .micl-stepper__progress-dot{background-color:var(--md-sys-stepper-dot-done-color);color:var(--md-sys-color-on-tertiary-container);opacity:100%}[dir=rtl] .micl-stepper .micl-stepper__steps .micl-stepper__step{transform:translateX(-100%)}[dir=rtl] .micl-stepper .micl-stepper__steps .micl-stepper__step:has(~.micl-stepper__step[aria-current=step]){transform:translateX(100%)}[dir=rtl] .micl-stepper .micl-stepper__steps .micl-stepper__step[aria-current=step]{transform:translateX(0%)}
+:root{--md-sys-state-disabled-state-layer-opacity: 38%}.micl-stepper{--md-comp-stepper-motion-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);--md-comp-stepper-motion-duration: 650ms;--_dot-size: var(--md-comp-stepper-dot-size, 12px);box-sizing:border-box;display:flex;flex-direction:column;row-gap:var(--md-sys-padding-xl, 24px);margin:0}.micl-stepper .micl-stepper__header{--_dot-size: var(--md-comp-stepper-header-dot-size, 24px);position:relative;display:flex;justify-content:space-between;align-items:flex-start;margin-inline:-10px;counter-reset:dotnumber;anchor-scope:all}.micl-stepper .micl-stepper__header button{position:static;anchor-name:var(--micl-stepper-anchor);pointer-events:none}.micl-stepper .micl-stepper__header button::before{inset:auto;inset-block-start:calc(anchor(var(--micl-stepper-anchor) center) - var(--md-sys-target-size, 48px)/2);inset-inline-start:anchor(var(--micl-stepper-anchor) start);inset-inline-end:anchor(var(--micl-stepper-anchor) end);inline-size:auto}.micl-stepper .micl-stepper__header button:not(:first-child)::after{content:"";position:absolute;inset-block-start:calc(anchor(var(--micl-stepper-anchor) center) - .5px);inset-inline-start:anchor(var(--micl-stepper-prev) end);inset-inline-end:anchor(var(--micl-stepper-anchor) start);block-size:1px;background-color:var(--md-comp-divider-color, var(--md-sys-color-outline-variant));pointer-events:none}.micl-stepper .micl-stepper__header button.micl-stepper__progress--done{pointer-events:inherit}.micl-stepper .micl-stepper__header .micl-stepper__progress-dot::before{content:counter(dotnumber, var(--md-comp-stepper-counter-style, decimal))}.micl-stepper.micl-stepper--nonlinear .micl-stepper__header button{pointer-events:inherit}.micl-stepper .micl-stepper__steps{display:grid;grid-template-areas:"stepper-steps";overflow-x:hidden}.micl-stepper .micl-stepper__steps .micl-stepper__step{grid-area:stepper-steps;display:flex;visibility:hidden;flex-direction:column;margin:0;padding:0;border:none;opacity:0%;transform:translateX(100%);transition:opacity var(--md-comp-stepper-motion-duration) linear,transform var(--md-comp-stepper-motion-duration) var(--md-comp-stepper-motion-spatial)}.micl-stepper .micl-stepper__steps .micl-stepper__step:has(~.micl-stepper__step[aria-current=step]){transform:translateX(-100%)}.micl-stepper .micl-stepper__steps .micl-stepper__step.micl-stepper__step--toselected{visibility:visible}.micl-stepper .micl-stepper__steps .micl-stepper__step[aria-current=step]{visibility:visible;opacity:100%;transform:translateX(0%)}.micl-stepper .micl-stepper__steps .micl-stepper__step.micl-stepper__step--fromselected{visibility:visible}.micl-stepper .micl-stepper__actions{display:flex;flex-direction:row;justify-content:center;inline-size:100%;align-items:center}.micl-stepper .micl-stepper__actions>:first-child,.micl-stepper .micl-stepper__actions>:last-child{display:flex;flex:1 1 0;column-gap:var(--md-sys-padding-xs, 8px)}.micl-stepper .micl-stepper__actions>:last-child{justify-content:flex-end}.micl-stepper .micl-stepper__progress-dots{display:flex;align-items:center;column-gap:4px}.micl-stepper .micl-stepper__progress-dot{block-size:var(--_dot-size);inline-size:var(--_dot-size);min-inline-size:var(--_dot-size);line-height:var(--_dot-size);border-radius:calc(var(--_dot-size)/2);text-align:center;background-color:var(--md-comp-stepper-dot-color, var(--md-sys-color-on-surface));color:var(--md-comp-stepper-dot-label-color, var(--md-sys-color-surface));opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%);counter-increment:dotnumber 1}.micl-stepper .micl-stepper__progress--done.micl-stepper__progress-dot,.micl-stepper .micl-stepper__progress--done .micl-stepper__progress-dot{background-color:var(--md-comp-stepper-dot-done-color, var(--md-sys-color-tertiary-container));color:var(--md-comp-stepper-dot-done-label-color, var(--md-sys-color-on-tertiary-container));opacity:100%}.micl-stepper .micl-stepper__steps .micl-stepper__step:dir(rtl){transform:translateX(-100%)}.micl-stepper .micl-stepper__steps .micl-stepper__step:dir(rtl):has(~.micl-stepper__step[aria-current=step]){transform:translateX(100%)}.micl-stepper .micl-stepper__steps .micl-stepper__step:dir(rtl)[aria-current=step]{transform:translateX(0%)}.micl-stepper__action--hidden,.micl-stepper__step--hidden{display:none !important}

package/dist/stepper.js

@@ -1 +1 @@
-!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.micl=o():e.micl=o()}(self,()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={603(e,t,r){const n=e=>"willValidate"in e,o=e=>{const t=e.target;n(t)&&t.setCustomValidity("")},i=e=>{const t=e.dataset.miclvalidateMessage||"";if(t&&e.matches("[data-miclvalidate-checkboxes-name]")){const r=e.dataset.miclvalidateCheckboxesName||"",n=e.dataset.miclvalidateCheckboxesCountEqual||"",i=e.dataset.miclvalidateCheckboxesCountMax||"",l=e.dataset.miclvalidateCheckboxesCountMin||"";if(r&&(n||i||l)){const s=e.querySelectorAll(`input[type="checkbox"][name="${r}"]:checked`).length,a=parseInt(n,10),c=parseInt(i,10),d=parseInt(l,10);let m=!isNaN(a)&&s!=a||!isNaN(c)&&s>c||!isNaN(d)&&s<d;e.setCustomValidity(m?t:"");const p=e.querySelector(`input[type="checkbox"][name="${r}"]`);p&&(p.setCustomValidity(m?t:""),m?p.addEventListener("change",o):p.removeEventListener("change",o))}}},l=(e,t)=>{let r=!1;return e.querySelectorAll("fieldset").forEach(i),Array.from(e.elements).forEach(e=>{if(n(e)&&e.willValidate){e.checkValidity()||(r=!0);let o=(e=>{if(!e.parentElement||!n(e))return!1;let t=!1;return e instanceof HTMLInputElement&&"checkbox"===e.type&&e.classList.contains("micl-checkbox")?t=(e=>(e.classList.toggle("micl-checkbox--error",!!e.validationMessage),!1))(e):(e.parentElement.classList.contains("micl-textfield-outlined")||e.parentElement.classList.contains("micl-textfield-filled"))&&(t=((e,t)=>{e.classList.toggle("micl-textfield--error",!!t);const r=e.querySelector(".micl-textfield__supporting-text");return r&&(t?(r.dataset.micltext||(r.dataset.micltext=r.textContent),r.textContent=t):"micltext"in r.dataset&&(r.textContent=r.dataset.micltext||"")),!!t&&!!r})(e.parentElement,e.validationMessage)),t})(e);!o&&t&&e.reportValidity()}}),!r},s={validateFieldSet:(e,t)=>(i(e),l(e,t)),validateForm:(e,t)=>l(e,t)};r.d(t,["default",0,s])},56(e,t,r){const n=globalThis.__miclRegistry??={map:{},rippled:new WeakSet,activated:!1},o=()=>Object.keys(n.map).join(","),i=e=>Object.entries(n.map).find(([t,{type:r}])=>e.matches(t)&&e instanceof r)?.[1],l=e=>{const t=i(e);t&&"function"==typeof t.component.initialize&&t.component.initialize(e)},s=e=>{const t=i(e);t&&"function"==typeof t.component.cleanup&&t.component.cleanup(e)},a=e=>{const t=o();if(!t)return;const r=e.target.closest(t);if(!(r instanceof HTMLElement))return;const n=i(r),l=e.type;n&&"function"==typeof n.component[l]&&n.component[l]?.(e)},c=()=>{n.activated||(n.activated=!0,new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=o();t&&e.matches(t)&&l(e),t&&e.querySelectorAll(t).forEach(l)}}),e.removedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=o();t&&e.matches(t)&&s(e),(e=>{const t=o();t&&e.querySelectorAll(t).forEach(s)})(e)}}))})}).observe(document.body,{childList:!0,subtree:!0}),(e=>{const t=o();t&&e.querySelectorAll(t).forEach(l),e.querySelectorAll('[class*="micl-"], [class*="micl-"] > summary').forEach(e=>{n.rippled.has(e)||"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&(e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();const r=e.getBoundingClientRect();e.style.setProperty("--micl-x",(t.clientX-r.left)/r.width*100+"%"),e.style.setProperty("--micl-y",(t.clientY-r.top)/r.height*100+"%"),e.classList.remove("micl-rippling"),e.offsetWidth,e.classList.add("micl-rippling");const n=t=>{"micl-ripple"===t.animationName&&(e.classList.remove("micl-rippling"),e.style.removeProperty("--micl-x"),e.style.removeProperty("--micl-y"),e.removeEventListener("animationend",n))};e.addEventListener("animationend",n)}),n.rippled.add(e))}),document.documentElement.style.setProperty("--md-sys-scrollbar-thumb-color",window.getComputedStyle(document.body).getPropertyValue("--md-sys-color-outline").trim())})(document),document.addEventListener("change",a),document.addEventListener("input",a),document.addEventListener("keydown",a))},d=()=>{document.removeEventListener("DOMContentLoaded",d),c()};"loading"!==document.readyState?c():document.addEventListener("DOMContentLoaded",d),r.d(t,["register",0,(e,t,r)=>(n.map[e]={component:t,type:r},n.activated&&document.querySelectorAll(e).forEach(l),t)])}};const t={};function r(n){const o=t[n];if(void 0!==o)return o.exports;const i=t[n]={exports:{}};return e[n](i,i.exports,r),i.exports}r.d=(e,t)=>{if(Array.isArray(t))for(var n=0;n<t.length;){var o=t[n++],i=t[n++];r.o(e,o)?0===i&&n++:0===i?Object.defineProperty(e,o,{enumerable:!0,value:t[n++]}):Object.defineProperty(e,o,{enumerable:!0,get:i})}else for(var o in t)r.o(t,o)&&!r.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};let n={};r.r(n);var o=r(603),i=r(56);const l=".micl-stepper",s=".micl-stepper__action-back,.micl-stepper__action-next",a=".micl-stepper__header button[role=tab][aria-controls]",c="micl-stepper__step",d="."+c,m=e=>e.querySelector(`${d}[aria-current=step]`)||u(e,e.querySelector(d)),p=(e,t)=>Array.from(e.querySelectorAll(d)).indexOf(t)+1,u=(e,t)=>{if(!t)return null;let r=0;e.querySelectorAll(d).forEach((e,n)=>{e.setAttribute("aria-current",e===t?"step":"false"),e===t&&(r=n)});const n=e.querySelectorAll(a).item(r);return e.querySelectorAll(a).forEach(e=>{e.setAttribute("aria-selected",e===n?"true":"false")}),g(e,t),t},f=e=>{const t=e.currentTarget;"transform"===e.propertyName&&t&&(t.classList.remove("micl-stepper__step--fromselected","micl-stepper__step--toselected"),t.removeEventListener("transitionend",f))},y=e=>e.classList.contains("micl-stepper__action-back"),g=(e,t)=>{((e,t)=>{Array.from(e.querySelectorAll(s)).forEach(e=>{const r=y(e)?"previousElementSibling":"nextElementSibling",n=t[r]?.classList.contains(c);e.classList.toggle("micl-stepper__action--hidden",!n)})})(e,t),((e,t)=>{const r=e.querySelectorAll(d).length,n=p(e,t);e.querySelectorAll("[data-step]").forEach(e=>{const t=parseInt(e.dataset.step||"0",10);e.classList.toggle("micl-stepper__step--hidden",t>0?t!=n:r+t+1!=n)})})(e,t),((e,t)=>{const r=p(e,t),n=e.querySelectorAll(d).length,o=!e.classList.contains("micl-stepper--nonlinear"),i=(t,r)=>{e.querySelectorAll(t).forEach(e=>{e.textContent=r})};i(".micl-stepper__progress-current",`${r}`),i(".micl-stepper__progress-total",`${n}`),e.querySelectorAll(".micl-stepper__progress-dots").forEach(e=>{const t=document.createDocumentFragment();e.innerHTML="";for(let e=1;e<=n;e++){let n=document.createElement("span");n.classList.add("micl-stepper__progress-dot"),(o&&e<=r||!o&&e===r)&&n.classList.add("micl-stepper__progress--done"),t.appendChild(n)}e.appendChild(t)}),e.querySelectorAll(a).forEach((e,t)=>{e.classList.toggle("micl-stepper__progress--done",o?t+1<=r:t+1===r)})})(e,t)},h=(0,i.register)(l,{initialize:e=>{if(!e.matches(l)||e.dataset.miclinitialized)return;e.dataset.miclinitialized="1";const t=m(e),r=e.querySelector(".micl-stepper__header");t&&(g(e,t),r?.querySelectorAll("button[role=tab][aria-controls]").forEach((t,r)=>{t.style.setProperty("--micl-stepper-anchor",`--micl-step-${r}`),r>0&&t.style.setProperty("--micl-stepper-prev","--micl-step-"+(r-1)),t.addEventListener("click",()=>{if("ariaControlsElements"in Element.prototype&&t.ariaControlsElements)u(e,t.ariaControlsElements[0]);else{const r=t.getAttribute("aria-controls");r&&u(e,document.getElementById(r))}})})),Array.from(e.querySelectorAll(s)).forEach(t=>{t.addEventListener("click",function(t){const r=y(this),n=m(e);if(!n||!r&&n instanceof HTMLFieldSetElement&&!o.default.validateFieldSet(n,!0))return void(r||t.stopImmediatePropagation());const i=n[r?"previousElementSibling":"nextElementSibling"];i?.classList.contains(c)&&((e,t,r)=>{t.addEventListener("transitionend",f),t.classList.add("micl-stepper__step--fromselected"),t.offsetHeight,r.addEventListener("transitionend",f),r.classList.add("micl-stepper__step--toselected"),r.offsetHeight,u(e,r)})(e,n,i)},!0)}),e instanceof HTMLFormElement&&e.addEventListener("submit",t=>{t.submitter?.classList.contains("micl-form--dosubmit")||t.preventDefault(),o.default.validateForm(e,!0)||t.stopImmediatePropagation()},!0)}},HTMLElement);return r.d(n,["default",0,h,"stepperSelector",0,l]),n})());

package/dist/switch.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-switch-handle-size: 16px;--md-sys-switch-handle-selected-size: 24px;--md-sys-switch-handle-pressed-size: 28px;--md-sys-switch-outline-width: 2px;--md-sys-switch-target-height: 32px;--md-sys-switch-target-width: 52px}input[type=checkbox].micl-switch{--md-sys-switch-unselected-icon: "+";--md-sys-switch-selected-icon: "\AC";--md-sys-switch-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-sys-switch-motion-duration: 300ms;--md-sys-switch-motion-duration-reverse: 200ms;appearance:none;position:relative;inline-size:var(--md-sys-switch-target-width);block-size:var(--md-sys-target-size);margin:0;border-radius:calc(var(--md-sys-switch-target-height)/2);outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=checkbox].micl-switch::before{content:"";box-sizing:border-box;display:block;inline-size:var(--md-sys-switch-target-width);block-size:var(--md-sys-switch-target-height);margin-block:calc((var(--md-sys-target-size, 48px) - var(--md-sys-switch-target-height))/2);border:var(--md-sys-switch-outline-width) solid var(--md-sys-color-outline);border-radius:inherit;background-color:var(--md-sys-color-surface-container-highest);transition:background-color var(--md-sys-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch::after{content:var(--md-sys-switch-unselected-icon);box-sizing:border-box;position:absolute;inline-size:var(--md-sys-state-layer-size, 40px);block-size:var(--md-sys-state-layer-size, 40px);inset:0;inset-inline-start:calc((var(--md-sys-target-size, 48px) - var(--md-sys-state-layer-size, 40px) - 16px)/2);margin:auto 0;font:300 16px/1rem var(--md-ref-typeface-plain);color:var(--md-sys-color-surface-container-highest);text-align:center;background-color:var(--md-sys-color-outline);background-clip:content-box;border:calc((var(--md-sys-state-layer-size, 40px) - var(--md-sys-switch-handle-size))/2) solid rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);transform:rotate(135deg);transition:inset-inline-start var(--md-sys-switch-motion-duration) var(--md-sys-switch-motion-effects),border-width var(--md-sys-switch-motion-duration) var(--md-sys-switch-motion-effects),line-height var(--md-sys-switch-motion-duration) var(--md-sys-switch-motion-effects),color var(--md-sys-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),border-color var(--md-sys-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),background-color var(--md-sys-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch:checked::before{background-color:var(--md-sys-color-primary)}input[type=checkbox].micl-switch:checked::after{content:var(--md-sys-switch-selected-icon);inset-inline-start:calc(var(--md-sys-switch-target-width) - (var(--md-sys-state-layer-size, 40px) + var(--md-sys-target-size, 48px) - 16px)/2);font-size:1.6rem;line-height:1.3rem;letter-spacing:.1rem;border:calc((var(--md-sys-state-layer-size, 40px) - var(--md-sys-switch-handle-selected-size))/2) solid rgba(0,0,0,0);color:var(--md-sys-color-on-primary-container);background-color:var(--md-sys-color-on-primary)}input[type=checkbox].micl-switch:not(:disabled){cursor:pointer}input[type=checkbox].micl-switch:not(:disabled):hover::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):hover:checked::after{border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::before{outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}input[type=checkbox].micl-switch:not(:disabled):focus-visible:checked::after{border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):focus-visible:not(:checked)::after{background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):active::after{line-height:1.7rem;border:calc((var(--md-sys-state-layer-size, 40px) - var(--md-sys-switch-handle-pressed-size))/2) solid rgba(0,0,0,0);background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):active:checked::after{line-height:1.6rem;border-width:calc((var(--md-sys-state-layer-size, 40px) - var(--md-sys-switch-handle-pressed-size))/2);border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):active:not(:checked)::after{inset-inline-start:calc((var(--md-sys-target-size, 48px) - var(--md-sys-state-layer-size, 40px) - 16px)/2);border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:disabled::before{border-color:var(--md-sys-color-on-surface);background-color:var(--md-sys-color-surface-container-highest);opacity:12%}input[type=checkbox].micl-switch:disabled:checked::before{background-color:var(--md-sys-color-on-surface)}input[type=checkbox].micl-switch:disabled::after{color:rgb(from var(--md-sys-color-surface-container-highest) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-sys-color-on-surface);opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}input[type=checkbox].micl-switch:disabled:checked::after{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-sys-color-surface);opacity:100%}input[type=checkbox].micl-switch:not(:disabled)+label,label:has(+input[type=checkbox].micl-switch:not(:disabled)){-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer}input[type=checkbox].micl-switch+label,label:has(+input[type=checkbox].micl-switch){color:var(--md-sys-color-on-surface)}[dir=rtl] input[type=checkbox].micl-switch::after{transform:rotate(45deg) scaleY(-1)}
+:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}input[type=checkbox].micl-switch:not(:disabled)+label,label:has(+input[type=checkbox].micl-switch:not(:disabled)){-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer}input[type=checkbox].micl-switch+label,label:has(+input[type=checkbox].micl-switch){color:var(--md-sys-color-on-surface)}input[type=checkbox].micl-switch:disabled+label,label:has(+input[type=checkbox].micl-switch:disabled){opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}input[type=checkbox].micl-switch{--md-comp-switch-unselected-icon: "+";--md-comp-switch-selected-icon: "\AC";--md-comp-switch-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-comp-switch-motion-duration: 300ms;--_track-width: var(--md-comp-switch-track-width, 52px);--_track-height: var(--md-comp-switch-track-height, 32px);--_track-outline-width: var(--md-comp-switch-track-outline-width, 2px);--_handle-size: var(--md-comp-switch-handle-size, 16px);--_handle-selected-size: var(--md-comp-switch-selected-handle-size, 24px);--_handle-pressed-size: var(--md-comp-switch-pressed-handle-size, 28px);--_layer: var(--md-sys-state-layer-size, 40px);--_target: var(--md-sys-target-size, 48px);appearance:none;position:relative;inline-size:var(--_track-width);block-size:var(--_target);margin:0;border-radius:calc(var(--_track-height)/2);outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=checkbox].micl-switch::before{content:"";box-sizing:border-box;display:block;inline-size:var(--_track-width);block-size:var(--_track-height);margin-block:calc((var(--_target) - var(--_track-height))/2);border:var(--_track-outline-width) solid var(--md-comp-switch-unselected-track-outline-color, var(--md-sys-color-outline));border-radius:inherit;background-color:var(--md-comp-switch-unselected-track-color, var(--md-sys-color-surface-container-highest));transition:background-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch::after{content:var(--md-comp-switch-unselected-icon);box-sizing:border-box;position:absolute;inline-size:var(--_layer);block-size:var(--_layer);inset:0;inset-inline-start:calc((var(--_target) - var(--_layer) - 16px)/2);margin:auto 0;font:300 16px/16px var(--md-ref-typeface-plain);color:var(--md-comp-switch-unselected-icon-color, var(--md-sys-color-surface-container-highest));text-align:center;background-color:var(--md-comp-switch-unselected-handle-color, var(--md-sys-color-outline));background-clip:content-box;border:calc((var(--_layer) - var(--_handle-size))/2) solid rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);transform:rotate(135deg);transition:inset-inline-start var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),border-width var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),line-height var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),border-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),background-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch:checked::before{background-color:var(--md-comp-switch-selected-track-color, var(--md-sys-color-primary))}input[type=checkbox].micl-switch:checked::after{content:var(--md-comp-switch-selected-icon);inset-inline-start:calc(var(--_track-width) - (var(--_layer) + var(--_target) - 16px)/2);font-size:25.6px;line-height:20.8px;letter-spacing:1.6px;border:calc((var(--_layer) - var(--_handle-selected-size))/2) solid rgba(0,0,0,0);color:var(--md-comp-switch-selected-icon-color, var(--md-sys-color-on-primary-container));background-color:var(--md-comp-switch-selected-handle-color, var(--md-sys-color-on-primary))}input[type=checkbox].micl-switch:not(:disabled){cursor:pointer}input[type=checkbox].micl-switch:not(:disabled):hover::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):hover:checked::after{border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::before{outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}input[type=checkbox].micl-switch:not(:disabled):focus-visible:checked::after{border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):focus-visible:not(:checked)::after{background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):active::after{line-height:27.2px;border:calc((var(--_layer) - var(--_handle-pressed-size))/2) solid rgba(0,0,0,0);background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):active:checked::after{line-height:25.6px;border-width:calc((var(--_layer) - var(--_handle-pressed-size))/2);border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):active:not(:checked)::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:disabled::before{border-color:var(--md-sys-color-on-surface);background-color:var(--md-sys-color-surface-container-highest);opacity:12%}input[type=checkbox].micl-switch:disabled:checked::before{background-color:var(--md-sys-color-on-surface)}input[type=checkbox].micl-switch:disabled::after{color:rgb(from var(--md-sys-color-surface-container-highest) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-sys-color-on-surface);opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}input[type=checkbox].micl-switch:disabled:checked::after{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-sys-color-surface);opacity:100%}input[type=checkbox].micl-switch:dir(rtl)::after{transform:rotate(45deg) scaleY(-1)}

package/dist/switch.js

@@ -1 +1 @@
-!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.micl=o():e.micl=o()}(self,()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";let e={};return(e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());

package/dist/textfield.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-extra-small: 4px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem}.micl-textfield-filled,.micl-textfield-outlined{--md-sys-textfield-height: 56px;--md-sys-textfield-icon-size: 24px;--md-sys-textfield-icon-space: 12px;--md-sys-textfield-input-space: 16px;--md-sys-textfield-prefix-space: 1em;--md-sys-textfield-suffix-space: 1em;--md-sys-textfield-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-sys-textfield-motion-duration: 300ms;--md-sys-textfield-motion-duration-reverse: 200ms;display:grid;grid-template-areas:"textfield" "supporting";align-items:center;background-color:inherit}.micl-textfield-filled>label,.micl-textfield-outlined>label{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);box-sizing:content-box;grid-area:textfield;align-self:flex-start;width:fit-content;padding-inline:4px;margin-block-start:calc((var(--md-sys-textfield-height) - var(--md-sys-typescale-body-large-line-height))/2);margin-inline:12px 4px;border-radius:4px;background-color:var(--_dialog-background-color, var(--_card-background-color, inherit));color:var(--md-sys-color-on-surface-variant);z-index:1;transition:margin-block-start var(--md-sys-textfield-motion-duration) var(--md-sys-textfield-motion-effects),margin-inline-start var(--md-sys-textfield-motion-duration) var(--md-sys-textfield-motion-effects),font-size var(--md-sys-textfield-motion-duration) linear,letter-spacing var(--md-sys-textfield-motion-duration) linear}.micl-textfield-filled>input,.micl-textfield-filled>select,.micl-textfield-filled>textarea,.micl-textfield-outlined>input,.micl-textfield-outlined>select,.micl-textfield-outlined>textarea{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);box-sizing:border-box;grid-area:textfield;margin:0;padding-inline:var(--md-sys-textfield-input-space);border:none;border-block-end:1px solid var(--md-sys-color-on-surface-variant);border-radius:var(--md-sys-shape-corner-extra-small);outline:none;color:var(--md-sys-color-on-surface);background-color:rgba(0,0,0,0);text-overflow:ellipsis;caret-color:var(--md-sys-color-primary)}.micl-textfield-filled>input:disabled,.micl-textfield-filled>select:disabled,.micl-textfield-filled>textarea:disabled,.micl-textfield-outlined>input:disabled,.micl-textfield-outlined>select:disabled,.micl-textfield-outlined>textarea:disabled{border-block-end-color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}.micl-textfield-filled>input::placeholder,.micl-textfield-filled>select::placeholder,.micl-textfield-filled>textarea::placeholder,.micl-textfield-outlined>input::placeholder,.micl-textfield-outlined>select::placeholder,.micl-textfield-outlined>textarea::placeholder{color:var(--md-sys-color-on-surface-variant)}.micl-textfield-filled>input::-webkit-inner-spin-button,.micl-textfield-filled>input::-webkit-outer-spin-button,.micl-textfield-filled>select::-webkit-inner-spin-button,.micl-textfield-filled>select::-webkit-outer-spin-button,.micl-textfield-filled>textarea::-webkit-inner-spin-button,.micl-textfield-filled>textarea::-webkit-outer-spin-button,.micl-textfield-outlined>input::-webkit-inner-spin-button,.micl-textfield-outlined>input::-webkit-outer-spin-button,.micl-textfield-outlined>select::-webkit-inner-spin-button,.micl-textfield-outlined>select::-webkit-outer-spin-button,.micl-textfield-outlined>textarea::-webkit-inner-spin-button,.micl-textfield-outlined>textarea::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.micl-textfield-filled>input[type=number],.micl-textfield-filled>select[type=number],.micl-textfield-filled>textarea[type=number],.micl-textfield-outlined>input[type=number],.micl-textfield-outlined>select[type=number],.micl-textfield-outlined>textarea[type=number]{-moz-appearance:textfield}.micl-textfield-filled>input,.micl-textfield-filled>select,.micl-textfield-outlined>input,.micl-textfield-outlined>select{height:var(--md-sys-textfield-height);padding-block:0}.micl-textfield-filled>textarea,.micl-textfield-outlined>textarea{min-height:var(--md-sys-textfield-height);padding-block:calc((var(--md-sys-textfield-height) - var(--md-sys-typescale-body-large-line-height))/2);resize:none}.micl-textfield-filled>textarea[rows],.micl-textfield-outlined>textarea[rows]{padding-block-start:0;border-block-start:8px solid rgba(0,0,0,0);overflow:hidden}.micl-textfield-filled>textarea:not([rows]),.micl-textfield-outlined>textarea:not([rows]){field-sizing:content}.micl-textfield-filled>.micl-textfield__prefix,.micl-textfield-filled>.micl-textfield__suffix,.micl-textfield-outlined>.micl-textfield__prefix,.micl-textfield-outlined>.micl-textfield__suffix{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);grid-area:textfield;align-content:center;height:var(--md-sys-textfield-height);color:var(--md-sys-color-on-surface-variant);opacity:0;z-index:1;transition:opacity var(--md-sys-textfield-motion-duration-reverse) linear}.micl-textfield-filled>.micl-textfield__prefix,.micl-textfield-outlined>.micl-textfield__prefix{width:var(--md-sys-textfield-prefix-space);padding-inline-start:var(--md-sys-textfield-input-space)}.micl-textfield-filled>.micl-textfield__suffix,.micl-textfield-outlined>.micl-textfield__suffix{width:var(--md-sys-textfield-suffix-space);padding-inline-end:var(--md-sys-textfield-input-space);margin-inline:auto 0}.micl-textfield-filled>.micl-textfield__icon-leading,.micl-textfield-filled>.micl-textfield__icon-trailing,.micl-textfield-outlined>.micl-textfield__icon-leading,.micl-textfield-outlined>.micl-textfield__icon-trailing{grid-area:textfield;width:1em;margin-inline:var(--md-sys-textfield-icon-space) auto;font-size:var(--md-sys-textfield-icon-size);color:var(--md-sys-color-on-surface-variant);z-index:1}.micl-textfield-filled>.micl-textfield__icon-trailing,.micl-textfield-outlined>.micl-textfield__icon-trailing{margin-inline:auto var(--md-sys-textfield-icon-space)}.micl-textfield-filled:has(>.micl-textfield__prefix)>input,.micl-textfield-filled:has(>.micl-textfield__prefix)>textarea,.micl-textfield-outlined:has(>.micl-textfield__prefix)>input,.micl-textfield-outlined:has(>.micl-textfield__prefix)>textarea{padding-inline-start:calc(var(--md-sys-textfield-input-space) + var(--md-sys-textfield-prefix-space))}.micl-textfield-filled:has(>.micl-textfield__suffix)>input,.micl-textfield-filled:has(>.micl-textfield__suffix)>textarea,.micl-textfield-outlined:has(>.micl-textfield__suffix)>input,.micl-textfield-outlined:has(>.micl-textfield__suffix)>textarea{padding-inline-end:calc(var(--md-sys-textfield-suffix-space) + var(--md-sys-textfield-input-space))}.micl-textfield-filled:has(>.micl-textfield__icon-leading)>label,.micl-textfield-outlined:has(>.micl-textfield__icon-leading)>label{margin-inline-start:calc(var(--md-sys-textfield-icon-space) + var(--md-sys-textfield-icon-size) + var(--md-sys-textfield-input-space))}.micl-textfield-filled:has(>.micl-textfield__icon-leading)>.micl-textfield__prefix,.micl-textfield-filled:has(>.micl-textfield__icon-leading)>input,.micl-textfield-filled:has(>.micl-textfield__icon-leading)>textarea,.micl-textfield-outlined:has(>.micl-textfield__icon-leading)>.micl-textfield__prefix,.micl-textfield-outlined:has(>.micl-textfield__icon-leading)>input,.micl-textfield-outlined:has(>.micl-textfield__icon-leading)>textarea{padding-inline-start:calc(var(--md-sys-textfield-icon-space) + var(--md-sys-textfield-icon-size) + var(--md-sys-textfield-input-space))}.micl-textfield-filled:has(>.micl-textfield__icon-leading):has(>.micl-textfield__prefix)>input,.micl-textfield-filled:has(>.micl-textfield__icon-leading):has(>.micl-textfield__prefix)>textarea,.micl-textfield-outlined:has(>.micl-textfield__icon-leading):has(>.micl-textfield__prefix)>input,.micl-textfield-outlined:has(>.micl-textfield__icon-leading):has(>.micl-textfield__prefix)>textarea{padding-inline-start:calc(var(--md-sys-textfield-input-space) + var(--md-sys-textfield-icon-size) + var(--md-sys-textfield-icon-space) + var(--md-sys-textfield-prefix-space))}.micl-textfield-filled:has(>.micl-textfield__icon-trailing)>.micl-textfield__suffix,.micl-textfield-filled:has(>.micl-textfield__icon-trailing)>input,.micl-textfield-filled:has(>.micl-textfield__icon-trailing)>textarea,.micl-textfield-outlined:has(>.micl-textfield__icon-trailing)>.micl-textfield__suffix,.micl-textfield-outlined:has(>.micl-textfield__icon-trailing)>input,.micl-textfield-outlined:has(>.micl-textfield__icon-trailing)>textarea{padding-inline-end:calc(var(--md-sys-textfield-input-space) + var(--md-sys-textfield-icon-size) + var(--md-sys-textfield-icon-space))}.micl-textfield-filled:has(>.micl-textfield__icon-trailing):has(>.micl-textfield__suffix)>input,.micl-textfield-filled:has(>.micl-textfield__icon-trailing):has(>.micl-textfield__suffix)>textarea,.micl-textfield-outlined:has(>.micl-textfield__icon-trailing):has(>.micl-textfield__suffix)>input,.micl-textfield-outlined:has(>.micl-textfield__icon-trailing):has(>.micl-textfield__suffix)>textarea{padding-inline-end:calc(var(--md-sys-textfield-input-space) + var(--md-sys-textfield-icon-size) + var(--md-sys-textfield-prefix-space) + var(--md-sys-textfield-icon-space))}.micl-textfield-filled>.micl-textfield__supporting-text,.micl-textfield-filled>.micl-textfield__character-counter,.micl-textfield-outlined>.micl-textfield__supporting-text,.micl-textfield-outlined>.micl-textfield__character-counter{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking);grid-area:supporting;padding-block:4px 0;padding-inline:16px;color:var(--md-sys-color-on-surface-variant)}.micl-textfield-filled>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled>.micl-textfield__character-counter.micl-textfield__supporting-text--focus,.micl-textfield-outlined>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined>.micl-textfield__character-counter.micl-textfield__supporting-text--focus{visibility:hidden}.micl-textfield-filled>.micl-textfield__character-counter,.micl-textfield-outlined>.micl-textfield__character-counter{justify-self:flex-end}.micl-textfield-filled:has(>input:active)>label,.micl-textfield-filled:has(>select:active)>label,.micl-textfield-filled:has(>textarea:active)>label,.micl-textfield-filled:has(>input:focus)>label,.micl-textfield-filled:has(>select:focus)>label,.micl-textfield-filled:has(>textarea:focus)>label,.micl-textfield-filled:has(>input:focus-visible)>label,.micl-textfield-filled:has(>select:focus-visible)>label,.micl-textfield-filled:has(>textarea:focus-visible)>label,.micl-textfield-outlined:has(>input:active)>label,.micl-textfield-outlined:has(>select:active)>label,.micl-textfield-outlined:has(>textarea:active)>label,.micl-textfield-outlined:has(>input:focus)>label,.micl-textfield-outlined:has(>select:focus)>label,.micl-textfield-outlined:has(>textarea:focus)>label,.micl-textfield-outlined:has(>input:focus-visible)>label,.micl-textfield-outlined:has(>select:focus-visible)>label,.micl-textfield-outlined:has(>textarea:focus-visible)>label{color:var(--md-sys-color-primary)}.micl-textfield-filled:has(>input:active)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>select:active)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>textarea:active)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>input:focus)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>select:focus)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>textarea:focus)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>input:focus-visible)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>select:focus-visible)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-filled:has(>textarea:focus-visible)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>input:active)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>select:active)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>textarea:active)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>input:focus)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>select:focus)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>textarea:focus)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>input:focus-visible)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>select:focus-visible)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus,.micl-textfield-outlined:has(>textarea:focus-visible)>.micl-textfield__supporting-text.micl-textfield__supporting-text--focus{visibility:visible}.micl-textfield-filled:has(>input:disabled)>label,.micl-textfield-filled:has(>select:disabled)>label,.micl-textfield-filled:has(>textarea:disabled)>label,.micl-textfield-outlined:has(>input:disabled)>label,.micl-textfield-outlined:has(>select:disabled)>label,.micl-textfield-outlined:has(>textarea:disabled)>label{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}.micl-textfield-filled:has(>input:disabled)>.micl-textfield__icon-leading,.micl-textfield-filled:has(>input:disabled)>.micl-textfield__icon-trailing,.micl-textfield-filled:has(>input:disabled)>.micl-textfield__supporting-text,.micl-textfield-filled:has(>select:disabled)>.micl-textfield__icon-leading,.micl-textfield-filled:has(>select:disabled)>.micl-textfield__icon-trailing,.micl-textfield-filled:has(>select:disabled)>.micl-textfield__supporting-text,.micl-textfield-filled:has(>textarea:disabled)>.micl-textfield__icon-leading,.micl-textfield-filled:has(>textarea:disabled)>.micl-textfield__icon-trailing,.micl-textfield-filled:has(>textarea:disabled)>.micl-textfield__supporting-text,.micl-textfield-outlined:has(>input:disabled)>.micl-textfield__icon-leading,.micl-textfield-outlined:has(>input:disabled)>.micl-textfield__icon-trailing,.micl-textfield-outlined:has(>input:disabled)>.micl-textfield__supporting-text,.micl-textfield-outlined:has(>select:disabled)>.micl-textfield__icon-leading,.micl-textfield-outlined:has(>select:disabled)>.micl-textfield__icon-trailing,.micl-textfield-outlined:has(>select:disabled)>.micl-textfield__supporting-text,.micl-textfield-outlined:has(>textarea:disabled)>.micl-textfield__icon-leading,.micl-textfield-outlined:has(>textarea:disabled)>.micl-textfield__icon-trailing,.micl-textfield-outlined:has(>textarea:disabled)>.micl-textfield__supporting-text{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}.micl-textfield-filled:has(>input:disabled)>.micl-textfield__character-counter,.micl-textfield-filled:has(>select:disabled)>.micl-textfield__character-counter,.micl-textfield-filled:has(>textarea:disabled)>.micl-textfield__character-counter,.micl-textfield-outlined:has(>input:disabled)>.micl-textfield__character-counter,.micl-textfield-outlined:has(>select:disabled)>.micl-textfield__character-counter,.micl-textfield-outlined:has(>textarea:disabled)>.micl-textfield__character-counter{display:none}.micl-textfield-filled:has(>input:not([maxlength]))>.micl-textfield__character-counter,.micl-textfield-filled:has(>textarea:not([maxlength]))>.micl-textfield__character-counter,.micl-textfield-outlined:has(>input:not([maxlength]))>.micl-textfield__character-counter,.micl-textfield-outlined:has(>textarea:not([maxlength]))>.micl-textfield__character-counter{display:none}.micl-textfield-filled:has(>input[maxlength]:not(:disabled)):has(>.micl-textfield__character-counter)>.micl-textfield__supporting-text,.micl-textfield-filled:has(>textarea[maxlength]:not(:disabled)):has(>.micl-textfield__character-counter)>.micl-textfield__supporting-text,.micl-textfield-outlined:has(>input[maxlength]:not(:disabled)):has(>.micl-textfield__character-counter)>.micl-textfield__supporting-text,.micl-textfield-outlined:has(>textarea[maxlength]:not(:disabled)):has(>.micl-textfield__character-counter)>.micl-textfield__supporting-text{padding-inline-end:64px}.micl-textfield-filled>label{background-color:rgba(0,0,0,0)}.micl-textfield-filled:hover>input:not(:disabled),.micl-textfield-filled:hover>select:not(:disabled),.micl-textfield-filled:hover>textarea:not(:disabled){--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%);border-block-end-color:var(--md-sys-color-on-surface)}.micl-textfield-filled>input,.micl-textfield-filled>select,.micl-textfield-filled>textarea{--statelayer-color: var(--md-sys-color-on-surface);padding-block-start:18px;padding-block-end:2px;border-end-start-radius:0;border-end-end-radius:0;outline:none;background-color:var(--md-sys-color-surface-container-highest);background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;transition:--statelayer-opacity var(--md-sys-textfield-motion-duration) linear}.micl-textfield-filled>input:disabled,.micl-textfield-filled>select:disabled,.micl-textfield-filled>textarea:disabled{background-color:rgb(from var(--md-sys-color-on-surface) r g b/4%)}.micl-textfield-filled>input:not(:disabled):focus,.micl-textfield-filled>input:not(:disabled):focus-visible,.micl-textfield-filled>input:not(:disabled):active,.micl-textfield-filled>select:not(:disabled):focus,.micl-textfield-filled>select:not(:disabled):focus-visible,.micl-textfield-filled>select:not(:disabled):active,.micl-textfield-filled>textarea:not(:disabled):focus,.micl-textfield-filled>textarea:not(:disabled):focus-visible,.micl-textfield-filled>textarea:not(:disabled):active{padding-block-end:0px;border-block-end-width:3px;border-block-end-color:var(--md-sys-color-primary)}.micl-textfield-filled>input{width:100%}.micl-textfield-filled>textarea{padding-block-start:24px}.micl-textfield-filled:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue])>label{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking);margin-block-start:8px;margin-inline-start:12px}.micl-textfield-filled:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue]):has(>.micl-textfield__icon-leading)>label{margin-inline-start:calc(var(--md-sys-textfield-input-space) + var(--md-sys-textfield-icon-size) + var(--md-sys-textfield-icon-space) - 4px)}.micl-textfield-filled:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue])>.micl-textfield__prefix,.micl-textfield-filled:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue])>.micl-textfield__suffix{height:40px;margin-block-start:16px;opacity:1}.micl-textfield-outlined{margin-block-start:calc(2px + var(--md-sys-typescale-body-small-line-height)/2)}.micl-textfield-outlined:hover>label{color:var(--md-sys-color-on-surface)}.micl-textfield-outlined:hover>input:not(:disabled),.micl-textfield-outlined:hover>select:not(:disabled),.micl-textfield-outlined:hover>textarea:not(:disabled){outline-color:var(--md-sys-color-on-surface);color:var(--md-sys-color-on-surface)}.micl-textfield-outlined>input,.micl-textfield-outlined>select,.micl-textfield-outlined>textarea{margin:0px 3px 3px 3px;border:none;outline:1px solid var(--md-sys-color-outline)}.micl-textfield-outlined>input:disabled,.micl-textfield-outlined>select:disabled,.micl-textfield-outlined>textarea:disabled{outline-color:rgb(from var(--md-sys-color-on-surface) r g b/12%)}.micl-textfield-outlined>input:not(:disabled):focus,.micl-textfield-outlined>input:not(:disabled):focus-visible,.micl-textfield-outlined>input:not(:disabled):active,.micl-textfield-outlined>select:not(:disabled):focus,.micl-textfield-outlined>select:not(:disabled):focus-visible,.micl-textfield-outlined>select:not(:disabled):active,.micl-textfield-outlined>textarea:not(:disabled):focus,.micl-textfield-outlined>textarea:not(:disabled):focus-visible,.micl-textfield-outlined>textarea:not(:disabled):active{outline-width:3px;outline-color:var(--md-sys-color-primary)}.micl-textfield-outlined>input{width:calc(100% - 3px - 3px)}.micl-textfield-outlined:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue])>label{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking);margin-block-start:calc(-2px - var(--md-sys-typescale-body-small-line-height)/2);margin-inline-start:12px}.micl-textfield-outlined:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue])>.micl-textfield__prefix,.micl-textfield-outlined:has(>input:focus,>input[value]:not([value=""]):not([data-miclinitialized]),>input[data-miclvalue],>input[type=date],>input[type=datetime-local],>input[type=month],>input[type=time],>input[type=week],>select:focus,>select:not([data-miclinitialized]) option:checked:not([value=""]),>select[data-miclvalue],>textarea:focus,>textarea:not(:empty):not([data-miclinitialized]),>textarea[data-miclvalue])>.micl-textfield__suffix{opacity:1}.micl-textfield-filled.micl-textfield--error>label,.micl-textfield-filled.micl-textfield--error>.micl-textfield__icon-trailing,.micl-textfield-filled.micl-textfield--error>.micl-textfield__supporting-text,.micl-textfield-filled.micl-textfield--error>.micl-textfield__character-counter,.micl-textfield-outlined.micl-textfield--error>label,.micl-textfield-outlined.micl-textfield--error>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error>.micl-textfield__supporting-text,.micl-textfield-outlined.micl-textfield--error>.micl-textfield__character-counter{color:var(--md-sys-color-error)}.micl-textfield-filled.micl-textfield--error>input,.micl-textfield-filled.micl-textfield--error>textarea,.micl-textfield-outlined.micl-textfield--error>input,.micl-textfield-outlined.micl-textfield--error>textarea{border-block-end-color:var(--md-sys-color-error);outline-color:var(--md-sys-color-error);caret-color:var(--md-sys-color-error)}.micl-textfield-filled.micl-textfield--error>input:active,.micl-textfield-filled.micl-textfield--error>input:focus,.micl-textfield-filled.micl-textfield--error>input:focus-visible,.micl-textfield-filled.micl-textfield--error>textarea:active,.micl-textfield-filled.micl-textfield--error>textarea:focus,.micl-textfield-filled.micl-textfield--error>textarea:focus-visible,.micl-textfield-outlined.micl-textfield--error>input:active,.micl-textfield-outlined.micl-textfield--error>input:focus,.micl-textfield-outlined.micl-textfield--error>input:focus-visible,.micl-textfield-outlined.micl-textfield--error>textarea:active,.micl-textfield-outlined.micl-textfield--error>textarea:focus,.micl-textfield-outlined.micl-textfield--error>textarea:focus-visible{border-block-end-color:var(--md-sys-color-error);outline-color:var(--md-sys-color-error)}.micl-textfield-filled.micl-textfield--error:hover>label,.micl-textfield-filled.micl-textfield--error:hover>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:hover>label,.micl-textfield-outlined.micl-textfield--error:hover>.micl-textfield__icon-trailing{color:var(--md-sys-color-on-error-container)}.micl-textfield-filled.micl-textfield--error:hover>input,.micl-textfield-filled.micl-textfield--error:hover>textarea,.micl-textfield-outlined.micl-textfield--error:hover>input,.micl-textfield-outlined.micl-textfield--error:hover>textarea{border-block-end-color:var(--md-sys-color-on-error-container);outline-color:var(--md-sys-color-on-error-container)}.micl-textfield-filled.micl-textfield--error:has(>input:active)>label,.micl-textfield-filled.micl-textfield--error:has(>input:active)>.micl-textfield__icon-trailing,.micl-textfield-filled.micl-textfield--error:has(>input:focus)>label,.micl-textfield-filled.micl-textfield--error:has(>input:focus)>.micl-textfield__icon-trailing,.micl-textfield-filled.micl-textfield--error:has(>input:focus-visible)>label,.micl-textfield-filled.micl-textfield--error:has(>input:focus-visible)>.micl-textfield__icon-trailing,.micl-textfield-filled.micl-textfield--error:has(>textarea:active)>label,.micl-textfield-filled.micl-textfield--error:has(>textarea:active)>.micl-textfield__icon-trailing,.micl-textfield-filled.micl-textfield--error:has(>textarea:focus)>label,.micl-textfield-filled.micl-textfield--error:has(>textarea:focus)>.micl-textfield__icon-trailing,.micl-textfield-filled.micl-textfield--error:has(>textarea:focus-visible)>label,.micl-textfield-filled.micl-textfield--error:has(>textarea:focus-visible)>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:has(>input:active)>label,.micl-textfield-outlined.micl-textfield--error:has(>input:active)>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:has(>input:focus)>label,.micl-textfield-outlined.micl-textfield--error:has(>input:focus)>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:has(>input:focus-visible)>label,.micl-textfield-outlined.micl-textfield--error:has(>input:focus-visible)>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:has(>textarea:active)>label,.micl-textfield-outlined.micl-textfield--error:has(>textarea:active)>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:has(>textarea:focus)>label,.micl-textfield-outlined.micl-textfield--error:has(>textarea:focus)>.micl-textfield__icon-trailing,.micl-textfield-outlined.micl-textfield--error:has(>textarea:focus-visible)>label,.micl-textfield-outlined.micl-textfield--error:has(>textarea:focus-visible)>.micl-textfield__icon-trailing{color:var(--md-sys-color-error)}[dir=rtl] .micl-textfield-filled>.micl-textfield__icon-leading,[dir=rtl] .micl-textfield-outlined>.micl-textfield__icon-leading{margin-inline:auto var(--md-sys-textfield-icon-space)}[dir=rtl] .micl-textfield-filled>.micl-textfield__icon-trailing,[dir=rtl] .micl-textfield-outlined>.micl-textfield__icon-trailing{margin-inline:var(--md-sys-textfield-icon-space) auto}
+:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-extra-small: 4px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem}:is(.micl-textfield-filled,.micl-textfield-outlined){--_height: var(--md-comp-text-field-container-height, 56px);--_shape: var(--md-sys-shape-corner-extra-small);--_icon-size: var(--md-comp-text-field-icon-size, 24px);--_icon-space: var(--md-comp-text-field-icon-space, 12px);--_input-space: var(--md-comp-text-field-input-space, 16px);--_icon-leading: 0px;--_icon-trailing: 0px;--_prefix: 0px;--_suffix: 0px;--_outline-width: 1px;--_label-color: var(--md-comp-text-field-label-color, var(--md-sys-color-on-surface-variant));--_effects: var(--md-comp-text-field-motion-effects, cubic-bezier(0.34, 0.88, 0.34, 1));--_duration: var(--md-comp-text-field-motion-duration, 300ms);--_duration-reverse: var(--md-comp-text-field-motion-duration-reverse, 200ms);display:grid;grid-template-areas:"textfield" "supporting";align-items:center}:is(.micl-textfield-filled,.micl-textfield-outlined)>label{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);box-sizing:content-box;grid-area:textfield;align-self:flex-start;width:fit-content;padding-inline:4px;margin-block-start:calc((var(--_height) - var(--md-sys-typescale-body-large-line-height))/2);color:var(--_label-color);z-index:1;transition:margin var(--_duration) var(--_effects),font-size var(--_duration) linear,letter-spacing var(--_duration) linear}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea){font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);box-sizing:border-box;grid-area:textfield;margin:0;padding-inline:calc(var(--_input-space) - var(--_border, 0px) + var(--_icon-leading) + var(--_prefix)) calc(var(--_input-space) - var(--_border, 0px) + var(--_icon-trailing) + var(--_suffix));border:none;border-radius:var(--_shape);outline:none;color:var(--md-comp-text-field-input-color, var(--md-sys-color-on-surface));background-color:rgba(0,0,0,0);text-overflow:ellipsis;caret-color:var(--_caret-color, var(--md-comp-text-field-caret-color, var(--md-sys-color-primary)))}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea):disabled{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea):disabled::placeholder{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea)::placeholder{color:var(--md-comp-text-field-input-placeholder-color, var(--md-sys-color-on-surface-variant))}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea)::-webkit-inner-spin-button,:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea)::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select,textarea)[type=number]{-moz-appearance:textfield}:is(.micl-textfield-filled,.micl-textfield-outlined)>:is(input,select){height:var(--_height);padding-block:0}:is(.micl-textfield-filled,.micl-textfield-outlined)>textarea{min-height:var(--_height);padding-block:calc((var(--_height) - var(--md-sys-typescale-body-large-line-height))/2);resize:none}:is(.micl-textfield-filled,.micl-textfield-outlined)>textarea[rows]{padding-block-start:0;border-block-start:8px solid rgba(0,0,0,0);overflow:hidden}:is(.micl-textfield-filled,.micl-textfield-outlined)>textarea:not([rows]){field-sizing:content}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__prefix,:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__suffix{font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);grid-area:textfield;align-content:center;height:var(--_height);color:var(--md-sys-color-on-surface-variant);opacity:0;z-index:1;transition:opacity var(--_duration-reverse) linear}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__prefix{width:var(--md-comp-text-field-prefix-space, 1em);padding-inline-start:calc(var(--_input-space) + var(--_icon-leading))}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__suffix{width:var(--md-comp-text-field-suffix-space, 1em);padding-inline-end:calc(var(--_input-space) + var(--_icon-trailing));margin-inline:auto 0}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__icon-leading,:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__icon-trailing{grid-area:textfield;width:1em;margin-inline:var(--_icon-space) auto;font-size:var(--_icon-size);color:var(--md-comp-text-field-icon-color, var(--md-sys-color-on-surface-variant));z-index:1}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__icon-trailing{margin-inline:auto var(--_icon-space)}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>.micl-textfield__prefix){--_prefix: var(--md-comp-text-field-prefix-space, 1em)}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>.micl-textfield__suffix){--_suffix: var(--md-comp-text-field-suffix-space, 1em)}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>.micl-textfield__icon-leading){--_icon-leading: calc(var(--_icon-size) + var(--_icon-space))}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>.micl-textfield__icon-trailing){--_icon-trailing: calc(var(--_icon-size) + var(--_icon-space))}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>label):not(:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized])))>select{color:rgba(0,0,0,0)}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>label):not(:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized])))>:is(input,select,textarea)::placeholder{color:rgba(0,0,0,0)}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__supporting-text,:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__character-counter{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking);grid-area:supporting;padding-block:4px 0;padding-inline:16px;color:var(--md-comp-text-field-supporting-text-color, var(--md-sys-color-on-surface-variant))}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__supporting-text--focus{visibility:hidden}:is(.micl-textfield-filled,.micl-textfield-outlined)>.micl-textfield__character-counter{justify-self:flex-end}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:is(input,textarea):not([maxlength]),>select)>.micl-textfield__character-counter{display:none}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:is(input,textarea)[maxlength]:not(:disabled)):has(>.micl-textfield__character-counter)>.micl-textfield__supporting-text{padding-inline-end:64px}.micl-textfield-filled{--_outline-color: var(--md-comp-filled-text-field-active-indicator-color, var(--md-sys-color-on-surface-variant));--_focus-outline-color: var(--md-comp-filled-text-field-focus-active-indicator-color, var(--md-sys-color-primary))}.micl-textfield-filled>label{margin-inline:12px 4px}.micl-textfield-filled:hover>:is(input,select,textarea):not(:disabled){--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}.micl-textfield-filled>:is(input,select,textarea){--statelayer-color: var(--md-sys-color-on-surface);padding-block-start:18px;padding-block-end:calc(3px - var(--_outline-width));border-block-end:var(--_outline-width) solid var(--_outline-color);border-end-start-radius:0;border-end-end-radius:0;background-color:var(--md-comp-filled-text-field-container-color, var(--md-sys-color-surface-container-highest));background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;transition:--statelayer-opacity var(--_duration) linear}.micl-textfield-filled>:is(input,select,textarea):disabled{background-color:rgb(from var(--md-sys-color-on-surface) r g b/4%)}.micl-textfield-filled>textarea{padding-block-start:24px}.micl-textfield-filled:has(>.micl-textfield__icon-leading)>label{margin-inline-start:calc(var(--_input-space) + var(--_icon-leading))}.micl-textfield-filled:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>label{margin-block-start:8px;margin-inline-start:12px}.micl-textfield-filled:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized])):has(>.micl-textfield__icon-leading)>label{margin-inline-start:calc(var(--_input-space) + var(--_icon-leading) - 4px)}.micl-textfield-filled:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>.micl-textfield__prefix,.micl-textfield-filled:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>.micl-textfield__suffix{height:40px;margin-block-start:16px}.micl-textfield-outlined{--_outline-color: var(--md-comp-outlined-text-field-outline-color, var(--md-sys-color-outline));--_focus-outline-color: var(--md-comp-outlined-text-field-focus-outline-color, var(--md-sys-color-primary));--_disabled-outline-opacity: 12%;--_border: var(--_outline-width);--_outline-extra: calc(var(--_outline-width) - 1px);grid-template:"textfield textfield textfield" "supporting supporting supporting"/12px fit-content(calc(100% - 24px)) 1fr;margin-block-start:calc(2px + var(--md-sys-typescale-body-small-line-height)/2)}.micl-textfield-outlined::before,.micl-textfield-outlined::after{content:"";grid-area:textfield;align-self:start;height:var(--_shape);border-block-start:var(--_outline-width) solid var(--_outline-color)}.micl-textfield-outlined::before{grid-column:1/3;border-start-start-radius:var(--_shape)}.micl-textfield-outlined::after{grid-column:3;border-start-end-radius:var(--_shape)}.micl-textfield-outlined:hover{--_label-color: var(--md-sys-color-on-surface)}.micl-textfield-outlined>label{grid-column:2}.micl-textfield-outlined:has(>.micl-textfield__icon-leading)>label{margin-inline-start:calc(var(--_input-space) + var(--_icon-leading) - 12px)}.micl-textfield-outlined>:is(input,select,textarea){border-block-end:var(--_border) solid var(--_outline-color);border-inline:var(--_border) solid var(--_outline-color)}.micl-textfield-outlined>input{padding-block-start:calc(var(--_border) - 1px)}.micl-textfield-outlined>textarea{--_border: 1px;box-shadow:inset var(--_outline-extra) 0 var(--_outline-color),inset calc(0px - var(--_outline-extra)) 0 var(--_outline-color),inset 0 calc(0px - var(--_outline-extra)) var(--_outline-color)}.micl-textfield-outlined:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))::before{grid-column:1}.micl-textfield-outlined:has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>label{margin-block-start:calc(-2px - var(--md-sys-typescale-body-small-line-height)/2);margin-inline-start:0}:is(.micl-textfield-filled,.micl-textfield-outlined):hover{--_outline-color: var(--md-sys-color-on-surface)}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:focus){--_outline-width: 3px;--_outline-color: var(--_focus-outline-color);--_label-color: var(--md-comp-text-field-focus-label-color, var(--md-sys-color-primary))}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:focus)>.micl-textfield__supporting-text--focus{visibility:visible}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>label{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking)}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>.micl-textfield__prefix,:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:focus,>[data-miclvalue],>:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]),>input[value]:not([value=""],[data-miclinitialized]),>select:not([data-miclinitialized]) option:checked:not([value=""]),>textarea:not(:empty,[data-miclinitialized]))>.micl-textfield__suffix{opacity:1}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:disabled){--_outline-color: rgb(from var(--md-sys-color-on-surface) r g b / var(--_disabled-outline-opacity, 38%))}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:disabled)>:is(label,[class*=micl-textfield__]:not(.micl-textfield__character-counter)){color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}:is(.micl-textfield-filled,.micl-textfield-outlined):has(>:disabled)>.micl-textfield__character-counter{display:none}.micl-textfield--error:not(:has(>:disabled)){--_outline-color: var(--md-sys-color-error);--_caret-color: var(--md-sys-color-error);--_label-color: var(--md-sys-color-error)}.micl-textfield--error:not(:has(>:disabled))>.micl-textfield__icon-trailing,.micl-textfield--error:not(:has(>:disabled))>.micl-textfield__supporting-text,.micl-textfield--error:not(:has(>:disabled))>.micl-textfield__character-counter{color:var(--md-sys-color-error)}.micl-textfield--error:not(:has(>:disabled)):hover:not(:has(>:focus)){--_outline-color: var(--md-sys-color-on-error-container);--_label-color: var(--md-sys-color-on-error-container)}.micl-textfield--error:not(:has(>:disabled)):hover:not(:has(>:focus))>.micl-textfield__icon-trailing{color:var(--md-sys-color-on-error-container)}:is(.micl-textfield-filled,.micl-textfield-outlined):dir(rtl)>.micl-textfield__icon-leading{margin-inline:auto var(--_icon-space)}:is(.micl-textfield-filled,.micl-textfield-outlined):dir(rtl)>.micl-textfield__icon-trailing{margin-inline:var(--_icon-space) auto}

package/dist/textfield.js

@@ -1 +1 @@
-!function(e,o){"object"==typeof exports&&"object"==typeof module?module.exports=o():"function"==typeof define&&define.amd?define([],o):"object"==typeof exports?exports.micl=o():e.micl=o()}(self,()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={56(e,t,n){const o=globalThis.__miclRegistry??={map:{},rippled:new WeakSet,activated:!1},i=()=>Object.keys(o.map).join(","),a=e=>Object.entries(o.map).find(([t,{type:n}])=>e.matches(t)&&e instanceof n)?.[1],r=e=>{const t=a(e);t&&"function"==typeof t.component.initialize&&t.component.initialize(e)},l=e=>{const t=a(e);t&&"function"==typeof t.component.cleanup&&t.component.cleanup(e)},c=e=>{const t=i();if(!t)return;const n=e.target.closest(t);if(!(n instanceof HTMLElement))return;const o=a(n),r=e.type;o&&"function"==typeof o.component[r]&&o.component[r]?.(e)},s=()=>{o.activated||(o.activated=!0,new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=i();t&&e.matches(t)&&r(e),t&&e.querySelectorAll(t).forEach(r)}}),e.removedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=i();t&&e.matches(t)&&l(e),(e=>{const t=i();t&&e.querySelectorAll(t).forEach(l)})(e)}}))})}).observe(document.body,{childList:!0,subtree:!0}),(e=>{const t=i();t&&e.querySelectorAll(t).forEach(r),e.querySelectorAll('[class*="micl-"], [class*="micl-"] > summary').forEach(e=>{o.rippled.has(e)||"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&(e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();const n=e.getBoundingClientRect();e.style.setProperty("--micl-x",(t.clientX-n.left)/n.width*100+"%"),e.style.setProperty("--micl-y",(t.clientY-n.top)/n.height*100+"%"),e.classList.remove("micl-rippling"),e.offsetWidth,e.classList.add("micl-rippling");const o=t=>{"micl-ripple"===t.animationName&&(e.classList.remove("micl-rippling"),e.style.removeProperty("--micl-x"),e.style.removeProperty("--micl-y"),e.removeEventListener("animationend",o))};e.addEventListener("animationend",o)}),o.rippled.add(e))}),document.documentElement.style.setProperty("--md-sys-scrollbar-thumb-color",window.getComputedStyle(document.body).getPropertyValue("--md-sys-color-outline").trim())})(document),document.addEventListener("change",c),document.addEventListener("input",c),document.addEventListener("keydown",c))},d=()=>{document.removeEventListener("DOMContentLoaded",d),s()};"loading"!==document.readyState?s():document.addEventListener("DOMContentLoaded",d),n.d(t,["register",0,(e,t,n)=>(o.map[e]={component:t,type:n},o.activated&&document.querySelectorAll(e).forEach(r),t)])}};const t={};function n(o){const i=t[o];if(void 0!==i)return i.exports;const a=t[o]={exports:{}};return e[o](a,a.exports,n),a.exports}n.d=(e,t)=>{if(Array.isArray(t))for(var o=0;o<t.length;){var i=t[o++],a=t[o++];n.o(e,i)?0===a&&o++:0===a?Object.defineProperty(e,i,{enumerable:!0,value:t[o++]}):Object.defineProperty(e,i,{enumerable:!0,get:a})}else for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};let o={};n.r(o);var i=n(56);const a=".micl-textfield-outlined > input,.micl-textfield-filled > input",r=".micl-textfield-outlined > textarea,.micl-textfield-filled > textarea",l=".micl-textfield-filled > select,.micl-textfield-outlined > select",c=`${a},${l},${r}`,s=e=>{if(!e.parentElement||e instanceof HTMLSelectElement||!e.maxLength)return;const t=e.parentElement.querySelector(".micl-textfield__character-counter");t&&(t.textContent=`${e.value.length}/${e.maxLength}`)},d=e=>{e.target.matches(c)&&e.target.dataset.miclinitialized&&!e.target.disabled&&(e.target instanceof HTMLInputElement&&e.target.dataset.micldateformat&&((e,t)=>{const n=(e.dataset.micldateformat||"").match(/([DMY]{2,4})([^DMY])?([DMY]{2,4})([^DMY])?([DMY]{2,4})/);if(!n)return;const o=[{type:n[1],length:n[1].length,separator:n[2]||""},{type:n[3],length:n[3].length,separator:n[4]||""},{type:n[5],length:n[5].length,separator:""}];e.maxLength=o.reduce((e,t)=>e+t.length+(t.separator?1:0),0);let i=e.value.replace(/\D/g,""),a="",r=0,l=e.selectionStart||0;for(let e=0;e<o.length;e++){const t=o[e];if(i.length<r)break;const n=i.substring(r,r+t.length);a+=n,r+=n.length,n.length===t.length&&t.separator&&(a+=t.separator)}const c=e.value.length;e.value=a.substring(0,e.maxLength);const s=e.value.length;t?.startsWith("deleteContent")?l>0&&e.setSelectionRange(l,l):s>c&&s>l?e.setSelectionRange(s,s):e.setSelectionRange(l,l)})(e.target,e.inputType),e.target.value?e.target.dataset.miclvalue="1":delete e.target.dataset.miclvalue,s(e.target))},m={initialize:e=>{if(!e.dataset.miclinitialized){if(e.dataset.miclinitialized="1",e.value&&(e.dataset.miclvalue="1"),e instanceof HTMLSelectElement){const t=()=>{const t=e.getBoundingClientRect(),n=t.top,o=window.innerHeight-t.bottom;!e.matches(":open")&&e.style.setProperty("--micl-select-picker-origin",n>o?"bottom":"top")};e.addEventListener("mousedown",t),e.addEventListener("keydown",t)}if(e.matches("input[type=time][data-timepicker],input[type=date][data-datepicker]")){const t=document.getElementById(e.dataset.timepicker||e.dataset.datepicker||"");if(t instanceof HTMLDialogElement){const n=e=>{e.preventDefault(),t.showModal()};e.addEventListener("click",n),e.addEventListener("keydown",e=>{const t=e.key;"Enter"!==t&&" "!==t||n(e)})}}s(e)}},change:d,input:d};(0,i.register)(a,m,HTMLInputElement),(0,i.register)(r,m,HTMLTextAreaElement),(0,i.register)(l,m,HTMLSelectElement);const p=m;return n.d(o,["default",0,p,"selectSelector",0,l,"textareaSelector",0,r,"textfieldSelector",0,a]),o})());

package/dist/timepicker.css

@@ -1 +1 @@
-:root{--md-sys-icon-size: 24px;--md-sys-padding-xxs: 4px;--md-sys-padding-xs: 8px;--md-sys-padding-s: 12px;--md-sys-padding-m: 16px;--md-sys-padding-l: 20px;--md-sys-padding-xl: 24px;--md-sys-padding-xxl: 28px}.micl-hidden{display:none !important}.micl-no-transition{transition:none !important}.micl-flex--vcenter{display:flex;flex-direction:row;align-items:center}.micl-grid-field,.micl-grid-iconfield{box-sizing:border-box;display:grid;row-gap:var(--md-sys-padding-xl, 24px)}.micl-grid-iconfield{grid-template-columns:48px 1fr}.micl-grid-iconfield__icon{grid-column:1;margin-block-start:.6rem}.micl-grid-iconfield__field{grid-column:2}.micl-link{display:flex;align-items:center;justify-content:center;text-decoration:none}@property --micl-ripple{syntax:"<integer>";inherits:false;initial-value:0}@property --micl-x{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-y{syntax:"<length>";inherits:false;initial-value:-100000px}@property --micl-width{syntax:"<length>";inherits:true;initial-value:0px}@property --micl-height{syntax:"<length>";inherits:true;initial-value:0px}:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.0125rem}:root{--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}:root{--md-sys-timepicker-input-height: 72px;--md-sys-timepicker-input-width: 96px;--md-sys-timepicker-input-width-24h: 114px;--md-sys-timepicker-separator-width: 24px;--md-sys-timepicker-period-height: 72px;--md-sys-timepicker-period-width: 52px;--md-sys-timepicker-dial-size: 256px;--md-sys-timepicker-dial-center-size: 8px;--md-sys-timepicker-dial-track-width: 2px}dialog.micl-dialog.micl-timepicker{--md-sys-timepicker-motion-duration: 350ms}dialog.micl-dialog.micl-timepicker .micl-dialog__headline{padding-block-end:20px}dialog.micl-dialog.micl-timepicker .micl-dialog__headline h2{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);color:var(--md-sys-color-on-surface-variant)}dialog.micl-dialog.micl-timepicker .micl-dialog__content{display:grid;padding-block-start:1px;grid-template-areas:"timepicker-hour timepicker-separator timepicker-minute timepicker-period" "timepicker-hour-supporting timepicker-hour-supporting timepicker-minute-supporting timepicker-minute-supporting" "timepicker-dial timepicker-dial timepicker-dial timepicker-dial";grid-template-columns:auto var(--md-sys-timepicker-separator-width) var(--md-sys-timepicker-input-width) auto}dialog.micl-dialog.micl-timepicker .micl-dialog__actions:has(.micl-timepicker__inputmode){justify-content:space-between}dialog.micl-dialog.micl-timepicker .micl-dialog__actions .micl-timepicker__inputmode{margin-inline-start:-8px}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)){--md-sys-timepicker-input-height: 80px;--md-sys-timepicker-period-height: 80px}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal{--md-sys-timepicker-period-height: 38px}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal .micl-dialog__headline{padding-block-end:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal .micl-dialog__content{grid-template-areas:"timepicker-dummy timepicker-dummy timepicker-dummy timepicker-dial" "timepicker-hour timepicker-separator timepicker-minute timepicker-dial" "timepicker-period timepicker-period timepicker-period timepicker-dial";grid-template-rows:72px var(--md-sys-timepicker-input-height) auto}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period{--md-sys-timepicker-ampm-height: var(--md-sys-timepicker-period-height);--md-sys-timepicker-period-width: calc(2 * var(--md-sys-timepicker-input-width) + var(--md-sys-timepicker-separator-width));display:flex;align-self:flex-start;margin-inline:0;margin-block:16px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__am{border-start-end-radius:0;border-end-start-radius:var(--md-sys-shape-corner-small)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__pm{border-block-start-width:1px;border-inline-start-width:0px;border-start-end-radius:var(--md-sys-shape-corner-small);border-end-start-radius:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__dial{margin-block:0;margin-inline:40px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)) .micl-timepicker__supporting-text-hour,dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)) .micl-timepicker__supporting-text-minute{display:none}.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{--statelayer-color: var(--md-sys-color-on-surface);font-family:var(--md-sys-typescale-display-medium-font);font-size:var(--md-sys-typescale-display-medium-size);line-height:var(--md-sys-typescale-display-medium-line-height);font-weight:var(--md-sys-typescale-display-medium-weight);letter-spacing:var(--md-sys-typescale-display-medium-tracking);box-sizing:border-box;inline-size:var(--md-sys-timepicker-input-width);block-size:var(--md-sys-timepicker-input-height);margin:0;padding:0;border:none;outline:none;border-radius:var(--md-sys-shape-corner-small);background-color:var(--md-sys-color-surface-container-highest);background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;color:var(--md-sys-color-on-surface);text-align:center;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-moz-appearance:textfield;transition:--statelayer-opacity var(--md-sys-timepicker-motion-duration) linear}.micl-timepicker input[name=hour]::-webkit-inner-spin-button,.micl-timepicker input[name=hour]::-webkit-outer-spin-button,.micl-timepicker input[name=minute]::-webkit-inner-spin-button,.micl-timepicker input[name=minute]::-webkit-outer-spin-button{-webkit-appearance:none}.micl-timepicker input[name=hour]::selection,.micl-timepicker input[name=minute]::selection{background-color:rgba(0,0,0,0)}.micl-timepicker input[name=hour].micl-timepicker--selected,.micl-timepicker input[name=minute].micl-timepicker--selected{--statelayer-color: var(--md-sys-color-on-primary-container);background-color:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container);border:2px solid var(--md-sys-color-primary)}.micl-timepicker input[name=hour]:hover,.micl-timepicker input[name=minute]:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}.micl-timepicker input[name=hour]:focus-visible,.micl-timepicker input[name=minute]:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%)}.micl-timepicker input[name=hour]:active,.micl-timepicker input[name=minute]:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity, 10%)}.micl-timepicker input[name=hour]{grid-area:timepicker-hour;justify-self:flex-end}.micl-timepicker input[name=minute]{grid-area:timepicker-minute}.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)) input[name=hour],.micl-timepicker:has(.micl-timepicker__dial:not(.micl-hidden)) input[name=minute]{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking);border:none;cursor:pointer}.micl-timepicker:not(:has(.micl-timepicker__am)):not(:has(.micl-timepicker__dial:not(.micl-hidden))){--md-sys-timepicker-input-width: var(--md-sys-timepicker-input-width-24h)}.micl-timepicker__separator{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking);grid-area:timepicker-separator;block-size:var(--md-sys-timepicker-input-height);line-height:var(--md-sys-timepicker-input-height);inline-size:var(--md-sys-timepicker-separator-width);text-align:center;color:var(--md-sys-color-on-surface)}.micl-timepicker__period{--md-sys-timepicker-ampm-height: calc(var(--md-sys-timepicker-period-height) / 2);grid-area:timepicker-period;block-size:var(--md-sys-timepicker-period-height);inline-size:0}.micl-timepicker__period:has(.micl-timepicker__am){inline-size:var(--md-sys-timepicker-period-width);margin-inline:12px 0}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm{--statelayer-color: var(--md-sys-color-on-surface-variant);font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);appearance:none;box-sizing:border-box;position:relative;display:flex;align-items:center;inline-size:var(--md-sys-timepicker-period-width);block-size:var(--md-sys-timepicker-ampm-height);min-block-size:var(--md-sys-timepicker-ampm-height);margin:0;border:1px solid var(--md-sys-color-outline);outline:none;color:var(--md-sys-color-on-surface-variant);background-color:rgba(0,0,0,0);background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:--statelayer-opacity var(--md-sys-timepicker-motion-duration) linear}.micl-timepicker__period .micl-timepicker__am::before,.micl-timepicker__period .micl-timepicker__pm::before{content:"AM";position:absolute;inline-size:100%;text-align:center}.micl-timepicker__period .micl-timepicker__am:checked,.micl-timepicker__period .micl-timepicker__pm:checked{color:var(--md-sys-color-on-tertiary-container);background-color:var(--md-sys-color-tertiary-container)}.micl-timepicker__period .micl-timepicker__am:hover:checked,.micl-timepicker__period .micl-timepicker__am:focus-visible:checked,.micl-timepicker__period .micl-timepicker__am:active:checked,.micl-timepicker__period .micl-timepicker__pm:hover:checked,.micl-timepicker__period .micl-timepicker__pm:focus-visible:checked,.micl-timepicker__period .micl-timepicker__pm:active:checked{--statelayer-color: var(--md-sys-color-on-tertiary-container)}.micl-timepicker__period .micl-timepicker__am:hover::after,.micl-timepicker__period .micl-timepicker__am:focus-visible::after,.micl-timepicker__period .micl-timepicker__am:active::after,.micl-timepicker__period .micl-timepicker__pm:hover::after,.micl-timepicker__period .micl-timepicker__pm:focus-visible::after,.micl-timepicker__period .micl-timepicker__pm:active::after{border-color:var(--md-sys-color-on-surface)}.micl-timepicker__period .micl-timepicker__am:hover:checked::after,.micl-timepicker__period .micl-timepicker__am:focus-visible:checked::after,.micl-timepicker__period .micl-timepicker__am:active:checked::after,.micl-timepicker__period .micl-timepicker__pm:hover:checked::after,.micl-timepicker__period .micl-timepicker__pm:focus-visible:checked::after,.micl-timepicker__period .micl-timepicker__pm:active:checked::after{border-color:var(--md-sys-color-primary)}.micl-timepicker__period .micl-timepicker__am:hover,.micl-timepicker__period .micl-timepicker__pm:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity, 8%)}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity, 10%);outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:-2px}.micl-timepicker__period .micl-timepicker__am:active,.micl-timepicker__period .micl-timepicker__pm:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity, 10%)}.micl-timepicker__period .micl-timepicker__am{border-start-start-radius:var(--md-sys-shape-corner-small);border-start-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm{border-block-start-width:0px;border-end-start-radius:var(--md-sys-shape-corner-small);border-end-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm::before{content:"PM"}.micl-timepicker__supporting-text-hour,.micl-timepicker__supporting-text-minute{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking);grid-area:timepicker-hour-supporting;padding-block:4px 0;color:var(--md-sys-color-on-surface-variant)}.micl-timepicker__supporting-text-minute{grid-area:timepicker-minute-supporting}.micl-timepicker .micl-timepicker__dial{--micl-dial-radius: calc((var(--md-sys-timepicker-dial-size, 256px) - var(--md-sys-target-size, 48px)) / 2);--micl-hour-radius: var(--micl-dial-radius);--micl-angle: 0deg;position:relative;grid-area:timepicker-dial;justify-self:center;block-size:var(--md-sys-timepicker-dial-size, 256px);inline-size:var(--md-sys-timepicker-dial-size, 256px);margin-block:36px 0;margin-inline:0;outline:none;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-sys-color-surface-container-highest);list-style-type:none;touch-action:none}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner{--micl-hour-radius: calc(var(--micl-dial-radius) - var(--md-sys-target-size, 48px) + 12px);z-index:2}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner::before{z-index:2}.micl-timepicker .micl-timepicker__dial data{--micl-a: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * cos(var(--micl-angle))));--micl-b: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * sin(var(--micl-angle))));font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);position:absolute;display:grid;place-content:center;block-size:var(--md-sys-target-size, 48px);inline-size:var(--md-sys-target-size, 48px);inset-inline-start:var(--micl-a);inset-block-start:var(--micl-b);outline:none;border-radius:var(--md-sys-shape-corner-full);color:var(--md-sys-color-on-surface);cursor:pointer;z-index:1;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__time--selected{color:var(--md-sys-color-on-primary);background-color:var(--md-sys-color-primary)}.micl-timepicker .micl-timepicker__dial data::before{content:"";position:absolute;block-size:var(--md-sys-target-size, 48px);inline-size:calc(2*var(--md-sys-target-size, 48px));inset-inline-start:0;inset-block-end:0;transform:rotate(var(--micl-angle)) translate(calc(-1 * var(--md-sys-target-size, 48px)));transform-origin:calc(var(--md-sys-target-size, 48px)/2) center;z-index:1}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track{--micl-track-length: 92px;position:relative;display:block;inline-size:var(--md-sys-timepicker-dial-track-width, 2px);block-size:var(--micl-track-length);inset-inline-start:calc((var(--md-sys-timepicker-dial-size, 256px) - var(--md-sys-timepicker-dial-track-width, 2px))/2);inset-block-start:calc(var(--md-sys-timepicker-dial-size, 256px)/2 - var(--micl-track-length));border-radius:calc(var(--md-sys-timepicker-dial-track-width, 2px)*2);background-color:var(--md-sys-color-primary);transform:rotate(calc(90deg + var(--micl-angle)));transform-origin:bottom}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track::before{content:"";position:absolute;display:block;block-size:var(--md-sys-timepicker-dial-center-size, 8px);inline-size:var(--md-sys-timepicker-dial-center-size, 8px);inset-block-end:-3px;inset-inline-start:-3px;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-sys-color-primary)}
+:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.0125rem}:root{--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm,.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{--statelayer-color: currentColor;background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:--statelayer-opacity var(--md-comp-time-picker-motion-duration) linear}.micl-timepicker__period .micl-timepicker__am:hover,.micl-timepicker__period .micl-timepicker__pm:hover,.micl-timepicker input[name=hour]:hover,.micl-timepicker input[name=minute]:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible,.micl-timepicker input[name=hour]:focus-visible,.micl-timepicker input[name=minute]:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}.micl-timepicker__period .micl-timepicker__am:active,.micl-timepicker__period .micl-timepicker__pm:active,.micl-timepicker input[name=hour]:active,.micl-timepicker input[name=minute]:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity)}dialog.micl-dialog.micl-timepicker{--md-comp-time-picker-motion-duration: 350ms;--_input-height: var(--md-comp-time-picker-time-selector-container-height, 72px);--_input-width: var(--md-comp-time-picker-time-selector-container-width, 96px);--_separator-width: var(--md-comp-time-picker-separator-width, 24px);--_period-height: var(--md-comp-time-picker-period-selector-container-height, 72px);--_period-width: var(--md-comp-time-picker-period-selector-container-width, 52px);--_dial-size: var(--md-comp-time-picker-clock-dial-container-size, 256px);--_center-size: var(--md-comp-time-picker-clock-dial-selector-center-container-size, 8px);--_track-width: var(--md-comp-time-picker-clock-dial-selector-track-container-width, 2px);--_target: var(--md-sys-target-size, 48px)}dialog.micl-dialog.micl-timepicker .micl-dialog__headline{padding-block-end:20px}dialog.micl-dialog.micl-timepicker .micl-dialog__headline h2{font-family:var(--md-sys-typescale-label-medium-font);font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking);color:var(--md-comp-time-picker-headline-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog.micl-timepicker .micl-dialog__content{display:grid;padding-block-start:1px;grid-template-areas:"hr sep min per" "hsup hsup msup msup" "dial dial dial dial";grid-template-columns:auto var(--_separator-width) var(--_input-width) auto}dialog.micl-dialog.micl-timepicker .micl-dialog__actions:has(.micl-timepicker__inputmode){justify-content:space-between}dialog.micl-dialog.micl-timepicker .micl-dialog__actions .micl-timepicker__inputmode{margin-inline-start:-8px}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)){--_input-height: var(--md-comp-time-picker-time-selector-container-height, 80px);--_period-height: var(--md-comp-time-picker-period-selector-container-height, 80px)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal{--_period-height: var(--md-comp-time-picker-period-selector-container-height, 38px)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__headline{padding-block-end:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content{grid-template-areas:"x x x dial" "hr sep min dial" "per per per dial";grid-template-rows:72px var(--_input-height) auto}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period{--_ampm-height: var(--_period-height);--_period-width: calc(2 * var(--_input-width) + var(--_separator-width));display:flex;align-self:flex-start;margin-inline:0;margin-block:16px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__am{border-start-end-radius:0;border-end-start-radius:var(--md-sys-shape-corner-small)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__pm{border-block-start-width:1px;border-inline-start-width:0px;border-start-end-radius:var(--md-sys-shape-corner-small);border-end-start-radius:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__dial{margin-block:0;margin-inline:40px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) .micl-timepicker__supporting-text-hour,dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) .micl-timepicker__supporting-text-minute{display:none}.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{font-family:var(--md-sys-typescale-display-medium-font);font-size:var(--md-sys-typescale-display-medium-size);line-height:var(--md-sys-typescale-display-medium-line-height);font-weight:var(--md-sys-typescale-display-medium-weight);letter-spacing:var(--md-sys-typescale-display-medium-tracking);box-sizing:border-box;inline-size:var(--_input-width);block-size:var(--_input-height);margin:0;padding:0;border:none;outline:none;border-radius:var(--md-sys-shape-corner-small);background-color:var(--md-comp-time-picker-time-selector-unselected-container-color, var(--md-sys-color-surface-container-highest));color:var(--md-comp-time-picker-time-selector-unselected-label-text-color, var(--md-sys-color-on-surface));text-align:center;user-select:none;-moz-appearance:textfield}.micl-timepicker input[name=hour]::-webkit-inner-spin-button,.micl-timepicker input[name=hour]::-webkit-outer-spin-button,.micl-timepicker input[name=minute]::-webkit-inner-spin-button,.micl-timepicker input[name=minute]::-webkit-outer-spin-button{-webkit-appearance:none}.micl-timepicker input[name=hour]::selection,.micl-timepicker input[name=minute]::selection{background-color:rgba(0,0,0,0)}.micl-timepicker input[name=hour].micl-timepicker--selected,.micl-timepicker input[name=minute].micl-timepicker--selected{background-color:var(--md-comp-time-picker-time-selector-selected-container-color, var(--md-sys-color-primary-container));color:var(--md-comp-time-picker-time-selector-selected-label-text-color, var(--md-sys-color-on-primary-container));border:2px solid var(--md-comp-time-input-focus-outline-color, var(--md-sys-color-primary))}.micl-timepicker input[name=hour]{grid-area:hr;justify-self:flex-end}.micl-timepicker input[name=minute]{grid-area:min}.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) input[name=hour],.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) input[name=minute]{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking);border:none;cursor:pointer}.micl-timepicker:not(:has(.micl-timepicker__am)):not(:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden))){--_input-width: var(--md-comp-time-picker-time-selector-24h-container-width, 114px)}.micl-timepicker__separator{font-family:var(--md-sys-typescale-display-large-font);font-size:var(--md-sys-typescale-display-large-size);line-height:var(--md-sys-typescale-display-large-line-height);font-weight:var(--md-sys-typescale-display-large-weight);letter-spacing:var(--md-sys-typescale-display-large-tracking);grid-area:sep;block-size:var(--_input-height);line-height:var(--_input-height);inline-size:var(--_separator-width);text-align:center;color:var(--md-comp-time-picker-separator-color, var(--md-sys-color-on-surface))}.micl-timepicker__period{--_ampm-height: calc(var(--_period-height) / 2);grid-area:per;block-size:var(--_period-height);inline-size:0}.micl-timepicker__period:has(.micl-timepicker__am){inline-size:var(--_period-width);margin-inline:12px 0}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm{font-family:var(--md-sys-typescale-title-medium-font);font-size:var(--md-sys-typescale-title-medium-size);line-height:var(--md-sys-typescale-title-medium-line-height);font-weight:var(--md-sys-typescale-title-medium-weight);letter-spacing:var(--md-sys-typescale-title-medium-tracking);appearance:none;box-sizing:border-box;position:relative;display:flex;align-items:center;inline-size:var(--_period-width);block-size:var(--_ampm-height);min-block-size:var(--_ampm-height);margin:0;border:1px solid var(--md-comp-time-picker-period-selector-outline-color, var(--md-sys-color-outline));outline:none;color:var(--md-comp-time-picker-period-selector-unselected-label-text-color, var(--md-sys-color-on-surface-variant));background-color:rgba(0,0,0,0);cursor:pointer}.micl-timepicker__period .micl-timepicker__am::before,.micl-timepicker__period .micl-timepicker__pm::before{content:"AM";position:absolute;inline-size:100%;text-align:center}.micl-timepicker__period .micl-timepicker__am:checked,.micl-timepicker__period .micl-timepicker__pm:checked{color:var(--md-comp-time-picker-period-selector-selected-label-text-color, var(--md-sys-color-on-tertiary-container));background-color:var(--md-comp-time-picker-period-selector-selected-container-color, var(--md-sys-color-tertiary-container))}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible{outline:var(--md-sys-state-focus-indicator-thickness) solid var(--md-sys-color-secondary);outline-offset:-2px}.micl-timepicker__period .micl-timepicker__am{border-start-start-radius:var(--md-sys-shape-corner-small);border-start-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm{border-block-start-width:0px;border-end-start-radius:var(--md-sys-shape-corner-small);border-end-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm::before{content:"PM"}.micl-timepicker__supporting-text-hour,.micl-timepicker__supporting-text-minute{font-family:var(--md-sys-typescale-body-small-font);font-size:var(--md-sys-typescale-body-small-size);line-height:var(--md-sys-typescale-body-small-line-height);font-weight:var(--md-sys-typescale-body-small-weight);letter-spacing:var(--md-sys-typescale-body-small-tracking);grid-area:hsup;padding-block:4px 0;color:var(--md-comp-time-picker-supporting-text-color, var(--md-sys-color-on-surface-variant))}.micl-timepicker__supporting-text-minute{grid-area:msup}.micl-timepicker .micl-timepicker__dial{--micl-dial-radius: calc((var(--_dial-size) - var(--_target)) / 2);--micl-hour-radius: var(--micl-dial-radius);--micl-angle: 0deg;position:relative;grid-area:dial;justify-self:center;block-size:var(--_dial-size);inline-size:var(--_dial-size);margin-block:36px 0;margin-inline:0;outline:none;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-comp-time-picker-clock-dial-color, var(--md-sys-color-surface-container-highest));list-style-type:none;touch-action:none}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner{--micl-hour-radius: calc(var(--micl-dial-radius) - var(--_target) + 12px);z-index:2}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner::before{z-index:2}.micl-timepicker .micl-timepicker__dial data{--micl-a: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * cos(var(--micl-angle))));--micl-b: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * sin(var(--micl-angle))));font-family:var(--md-sys-typescale-body-large-font);font-size:var(--md-sys-typescale-body-large-size);line-height:var(--md-sys-typescale-body-large-line-height);font-weight:var(--md-sys-typescale-body-large-weight);letter-spacing:var(--md-sys-typescale-body-large-tracking);position:absolute;display:grid;place-content:center;block-size:var(--_target);inline-size:var(--_target);inset-inline-start:var(--micl-a);inset-block-start:var(--micl-b);outline:none;border-radius:var(--md-sys-shape-corner-full);color:var(--md-comp-time-picker-clock-dial-unselected-label-text-color, var(--md-sys-color-on-surface));cursor:pointer;z-index:1;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__time--selected{color:var(--md-comp-time-picker-clock-dial-selected-label-text-color, var(--md-sys-color-on-primary));background-color:var(--md-comp-time-picker-clock-dial-selector-handle-container-color, var(--md-sys-color-primary))}.micl-timepicker .micl-timepicker__dial data::before{content:"";position:absolute;block-size:var(--_target);inline-size:calc(2*var(--_target));inset-inline-start:0;inset-block-end:0;transform:rotate(var(--micl-angle)) translate(calc(-1 * var(--_target)));transform-origin:calc(var(--_target)/2) center;z-index:1}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track{--micl-track-length: 92px;position:relative;display:block;inline-size:var(--_track-width);block-size:var(--micl-track-length);inset-inline-start:calc((var(--_dial-size) - var(--_track-width))/2);inset-block-start:calc(var(--_dial-size)/2 - var(--micl-track-length));border-radius:calc(var(--_track-width)*2);background-color:var(--md-comp-time-picker-clock-dial-selector-track-container-color, var(--md-sys-color-primary));transform:rotate(calc(90deg + var(--micl-angle)));transform-origin:bottom}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track::before{content:"";position:absolute;display:block;block-size:var(--_center-size);inline-size:var(--_center-size);inset-block-end:-3px;inset-inline-start:-3px;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-comp-time-picker-clock-dial-selector-center-container-color, var(--md-sys-color-primary))}.micl-timepicker__dial--hidden{display:none !important}