@kyralabs/m3e-css 1.5.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/dist/assist-chip.css +1 -1
  2. package/dist/checkbox.css +1 -0
  3. package/dist/chip-set.css +1 -0
  4. package/dist/chip.css +1 -0
  5. package/dist/filter-chip.css +1 -0
  6. package/dist/focus-ring.css +1 -1
  7. package/dist/index.css +1 -1
  8. package/dist/input-chip.css +1 -0
  9. package/dist/list.css +1 -0
  10. package/dist/radio-button.css +1 -0
  11. package/dist/slider.css +1 -0
  12. package/dist/state-layer.css +1 -1
  13. package/dist/suggestion-chip.css +1 -0
  14. package/dist/switch.css +1 -0
  15. package/dist/text-field.css +1 -0
  16. package/package.json +2 -2
package/dist/input-chip.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/chips.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@import"@kyralabs/m3e-tokens/components/elevation-motion.css";@import"@kyralabs/m3e-tokens/components/input-chip.css";@import"@kyralabs/m3e-tokens/components/chips-defaults.css";@property --_m3e-chip-shape{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@layer m3e.components{:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip){--_m3e-chip-outline: inset 0 0 0 var(--_m3e-chip-outline-width) var(--_m3e-chip-outline-color);--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-outgoing-duration-hovered);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-outgoing-easing);--m3e-comp-state-layer-color: var(--_m3e-chip-state-layer);display:inline-flex;align-items:center;box-sizing:border-box;min-block-size:var(--_m3e-chip-height);margin:0;padding-block:0;padding-inline:var(--_m3e-chip-padding-start) var(--_m3e-chip-padding-end);border:none;border-radius:var(--_m3e-chip-shape);background-color:var(--_m3e-chip-container);box-shadow:var(--_m3e-chip-shadow);color:var(--_m3e-chip-label);font-family:var(--_m3e-chip-font);font-size:var(--_m3e-chip-font-size);font-weight:var(--_m3e-chip-font-weight);line-height:var(--_m3e-chip-line-height);letter-spacing:var(--_m3e-chip-tracking);text-align:start;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:box-shadow var(--_m3e-chip-shadow-duration) var(--_m3e-chip-shadow-easing)}:is(.m3e-filter-chip--expressive,.m3e-input-chip--expressive){transition:box-shadow var(--_m3e-chip-shadow-duration) var(--_m3e-chip-shadow-easing),border-radius var(--m3e-comp-selectable-chip-shape-duration) var(--m3e-comp-selectable-chip-shape-easing)}:is(.m3e-filter-chip--expressive,.m3e-input-chip--expressive)[data-spring]{transition-property:box-shadow}.m3e-input-chip__cell{display:flex;flex:1 1 auto;align-items:center;align-self:stretch;min-inline-size:0}:is(.m3e-assist-chip__label,.m3e-filter-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label){flex:1 1 auto;padding-inline:var(--_m3e-chip-label-start) var(--_m3e-chip-label-end)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip__cell,.m3e-suggestion-chip) .m3e-icon{--m3e-comp-icon-size: var(--_m3e-chip-icon-size);color:var(--_m3e-chip-leading)}:is(.m3e-assist-chip__label,.m3e-filter-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~.m3e-icon,:is(.m3e-assist-chip__label,.m3e-filter-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~* .m3e-icon{color:var(--_m3e-chip-trailing)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip):after{content:"";position:absolute;inset-block:min(0%,calc((var(--_m3e-chip-height) - var(--m3e-comp-minimum-interactive-component-size)) / 2));inset-inline:min(0%,calc((100% - var(--m3e-comp-minimum-interactive-component-size)) / 2))}@media(hover:hover){:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip):hover{--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-hovered)}}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):focus-visible,.m3e-filter-chip:has(>.m3e-filter-chip__input:focus-visible){--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-focused)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:active,[data-pressed]){--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-pressed)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip)[data-dragged]{--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-dragged)}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]),.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled){background-color:var(--_m3e-chip-container-disabled);box-shadow:var(--_m3e-chip-shadow-disabled);color:var(--_m3e-chip-label-disabled);cursor:default;transition:none}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) .m3e-icon,.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled) .m3e-icon{color:var(--_m3e-chip-leading-disabled)}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) :is(.m3e-assist-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~* .m3e-icon,:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) :is(.m3e-assist-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~.m3e-icon,.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled) .m3e-filter-chip__label~.m3e-icon{color:var(--_m3e-chip-trailing-disabled)}@media(forced-colors:active){:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip){border:var(--m3e-comp-chips-outline-width-unselected) solid ButtonText}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip__cell,.m3e-suggestion-chip) .m3e-icon{color:ButtonText}.m3e-filter-chip:has(>.m3e-filter-chip__input:checked),.m3e-input-chip[aria-selected=true]{border-color:Highlight;outline:var(--m3e-comp-chips-outline-width-unselected) solid Highlight}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]),:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) .m3e-icon,.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled),.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled) .m3e-icon{border-color:GrayText;color:GrayText}}}@layer m3e.components{.m3e-input-chip{--_m3e-chip-height: var(--m3e-comp-input-chip-container-height);--_m3e-chip-padding-start: var(--m3e-comp-input-chip-content-padding-start);--_m3e-chip-padding-end: var(--m3e-comp-input-chip-content-padding-end);--_m3e-chip-label-start: var(--m3e-comp-chip-default-horizontal-spacing);--_m3e-chip-label-end: var(--m3e-comp-chip-default-horizontal-spacing);--_m3e-chip-shape: var(--m3e-comp-input-chip-container-shape);--_m3e-chip-icon-size: var(--m3e-comp-input-chip-leading-icon-size);--_m3e-chip-font: var(--m3e-comp-input-chip-label-text-font);--_m3e-chip-font-size: var(--m3e-comp-input-chip-label-text-size);--_m3e-chip-font-weight: var(--m3e-comp-input-chip-label-text-weight);--_m3e-chip-line-height: var(--m3e-comp-input-chip-label-text-line-height);--_m3e-chip-tracking: var(--m3e-comp-input-chip-label-text-tracking);--_m3e-chip-outline-width: var(--m3e-comp-input-chip-outline-width-unselected);--_m3e-chip-outline-color: var(--m3e-comp-input-chip-outline-color-unselected);--_m3e-chip-container: transparent;--_m3e-chip-shadow: var(--_m3e-chip-outline);--_m3e-chip-shadow-hovered: var(--_m3e-chip-outline);--_m3e-chip-shadow-focused: var(--_m3e-chip-outline);--_m3e-chip-shadow-pressed: var(--_m3e-chip-outline);--_m3e-chip-shadow-dragged: var(--m3e-comp-input-chip-container-shadow-dragged), var(--_m3e-chip-outline);--_m3e-chip-shadow-disabled: inset 0 0 0 var(--_m3e-chip-outline-width) color-mix( in srgb, var(--m3e-comp-input-chip-outline-color-disabled-unselected) calc(var(--m3e-comp-input-chip-outline-opacity-disabled-unselected) * 100%), transparent );--_m3e-chip-container-disabled: transparent;--_m3e-chip-label: var(--m3e-comp-input-chip-label-text-color-unselected);--_m3e-chip-state-layer: var(--m3e-sys-color-on-surface);--_m3e-chip-leading: var(--m3e-comp-input-chip-leading-icon-color-unselected);--_m3e-chip-trailing: var(--m3e-comp-input-chip-trailing-icon-color-unselected);--_m3e-chip-label-disabled: color-mix( in srgb, var(--m3e-comp-input-chip-label-text-color-disabled) calc(var(--m3e-comp-input-chip-label-text-opacity-disabled) * 100%), transparent );--_m3e-chip-leading-disabled: color-mix( in srgb, var(--m3e-comp-input-chip-leading-icon-color-disabled) calc(var(--m3e-comp-input-chip-leading-icon-opacity-disabled) * 100%), transparent );--_m3e-chip-trailing-disabled: color-mix( in srgb, var(--m3e-comp-input-chip-trailing-icon-color-disabled) calc(var(--m3e-comp-input-chip-trailing-icon-opacity-disabled) * 100%), transparent )}.m3e-input-chip:has(>.m3e-input-chip__cell>.m3e-input-chip__label~*){--_m3e-chip-padding-end: var(--m3e-comp-input-chip-content-padding-end-icon)}.m3e-input-chip:has(>.m3e-input-chip__cell>.m3e-icon+.m3e-input-chip__label):not(:has(>.m3e-input-chip__cell>.m3e-input-chip__avatar)){--_m3e-chip-padding-start: var(--m3e-comp-input-chip-content-padding-start-icon)}.m3e-input-chip__avatar{--_m3e-chip-icon-size: var(--m3e-comp-input-chip-avatar-size);display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--m3e-comp-input-chip-avatar-size);block-size:var(--m3e-comp-input-chip-avatar-size);overflow:hidden;border-radius:min(var(--m3e-comp-input-chip-avatar-shape),calc(var(--m3e-comp-input-chip-avatar-size) / 2));object-fit:cover}.m3e-input-chip .m3e-input-chip__cell .m3e-input-chip__avatar .m3e-icon{color:inherit}.m3e-input-chip[aria-disabled=true] .m3e-input-chip__avatar{opacity:var(--m3e-comp-input-chip-avatar-opacity-disabled)}.m3e-input-chip__remove{--_m3e-chip-icon-size: var(--m3e-comp-input-chip-trailing-icon-size);position:relative;z-index:1;display:inline-flex;flex:none;align-items:center;justify-content:center;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.m3e-input-chip__remove:after{content:"";position:absolute;inset:calc((var(--m3e-comp-input-chip-trailing-icon-size) - var(--m3e-comp-minimum-interactive-component-size)) / 2)}.m3e-input-chip__remove:disabled{cursor:default}.m3e-input-chip[aria-selected=true]{--_m3e-chip-outline-width: var(--m3e-comp-input-chip-outline-width-selected);--_m3e-chip-outline-color: transparent;--_m3e-chip-container: var(--m3e-comp-input-chip-container-color-selected);--_m3e-chip-container-disabled: color-mix( in srgb, var(--m3e-comp-input-chip-container-color-disabled-selected) calc(var(--m3e-comp-input-chip-container-opacity-disabled-selected) * 100%), transparent );--_m3e-chip-label: var(--m3e-comp-input-chip-label-text-color-selected);--_m3e-chip-state-layer: var(--m3e-comp-input-chip-label-text-color-selected);--_m3e-chip-leading: var(--m3e-comp-input-chip-leading-icon-color-selected);--_m3e-chip-trailing: var(--m3e-comp-input-chip-trailing-icon-color-selected)}.m3e-input-chip--expressive{--_m3e-chip-shape: min( var(--m3e-comp-chips-shape-unselected), calc(var(--_m3e-chip-height) / 2) );--_m3e-chip-leading: var(--m3e-comp-input-chip-leading-icon-color-tonal)}.m3e-input-chip--expressive[aria-selected=true]{--_m3e-chip-shape: min(var(--m3e-comp-chips-shape-selected), calc(var(--_m3e-chip-height) / 2));--_m3e-chip-leading: var(--m3e-comp-input-chip-leading-icon-color-selected)}.m3e-input-chip--expressive:is(:active,[data-pressed]):not([aria-disabled=true]){--_m3e-chip-shape: min(var(--m3e-comp-chips-shape-pressed), calc(var(--_m3e-chip-height) / 2))}.m3e-input-chip--expressive:has(>.m3e-input-chip__cell>:is(.m3e-input-chip__avatar,.m3e-icon)+.m3e-input-chip__label,>.m3e-input-chip__cell>.m3e-input-chip__label~*){--_m3e-chip-label-start: var(--m3e-comp-input-chip-compact-horizontal-spacing);--_m3e-chip-label-end: var(--m3e-comp-input-chip-horizontal-spacing)}.m3e-input-chip--expressive:has(>.m3e-input-chip__cell>:is(.m3e-input-chip__avatar,.m3e-icon)+.m3e-input-chip__label):has(>.m3e-input-chip__cell>.m3e-input-chip__label~*){--_m3e-chip-label-end: var(--m3e-comp-input-chip-compact-horizontal-spacing)}}
package/dist/list.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/list.css";@import"@kyralabs/m3e-tokens/components/reorder-list.css";@import"@kyralabs/m3e-tokens/components/list-defaults.css";@import"@kyralabs/m3e-tokens/components/checkbox.css";@import"@kyralabs/m3e-tokens/components/checkbox-defaults.css";@import"@kyralabs/m3e-tokens/components/radio-button.css";@import"@kyralabs/m3e-tokens/components/radio-button-defaults.css";@import"@kyralabs/m3e-tokens/components/switch.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@import"@kyralabs/m3e-tokens/components/divider.css";@property --_m3e-list-item-radius-top{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@property --_m3e-list-item-radius-bottom{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@layer m3e.components{.m3e-list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.m3e-list:has(>.m3e-list-item--segmented,>*>.m3e-list-item--segmented){gap:var(--m3e-comp-list-item-segmented-gap)}.m3e-list>*{--_m3e-list-item-outer-top: var(--m3e-comp-list-item-shape);--_m3e-list-item-outer-bottom: var(--m3e-comp-list-item-shape)}.m3e-list>:first-child{--_m3e-list-item-outer-top: var(--m3e-comp-list-item-segmented-shape)}.m3e-list>:last-child{--_m3e-list-item-outer-bottom: var(--m3e-comp-list-item-segmented-shape)}.m3e-list-item{--_m3e-list-item-container: var(--m3e-comp-list-item-container-color);--_m3e-list-item-headline: var(--m3e-comp-list-item-headline-content-color);--_m3e-list-item-leading: var(--m3e-comp-list-item-leading-content-color);--_m3e-list-item-trailing: var(--m3e-comp-list-item-trailing-content-color);--_m3e-list-item-overline: var(--m3e-comp-list-item-overline-content-color);--_m3e-list-item-supporting: var(--m3e-comp-list-item-supporting-content-color);--_m3e-list-item-shadow: var(--m3e-comp-list-item-shadow);--_m3e-list-item-rest-top: var(--m3e-comp-list-item-shape);--_m3e-list-item-rest-bottom: var(--m3e-comp-list-item-shape);--_m3e-list-item-radius-top: var(--_m3e-list-item-rest-top);--_m3e-list-item-radius-bottom: var(--_m3e-list-item-rest-bottom);--_m3e-list-item-color-transition: var(--m3e-comp-list-item-color-duration) var(--m3e-comp-list-item-color-easing);position:relative;display:flex;align-items:center;box-sizing:border-box;inline-size:100%;min-block-size:var(--m3e-comp-list-item-one-line-min-height);margin:0;padding-block:var(--m3e-comp-list-item-padding-top) var(--m3e-comp-list-item-padding-bottom);padding-inline:var(--m3e-comp-list-item-padding-start) var(--m3e-comp-list-item-padding-end);border:0;border-start-start-radius:var(--_m3e-list-item-radius-top);border-start-end-radius:var(--_m3e-list-item-radius-top);border-end-start-radius:var(--_m3e-list-item-radius-bottom);border-end-end-radius:var(--_m3e-list-item-radius-bottom);background-color:var(--_m3e-list-item-container);box-shadow:var(--_m3e-list-item-shadow);color:var(--_m3e-list-item-headline);font-family:var(--m3e-comp-list-item-headline-style-font);font-size:var(--m3e-comp-list-item-headline-style-size);font-weight:var(--m3e-comp-list-item-headline-style-weight);line-height:var(--m3e-comp-list-item-headline-style-line-height);letter-spacing:var(--m3e-comp-list-item-headline-style-tracking);text-align:start;text-decoration:none;list-style:none;appearance:none;-webkit-tap-highlight-color:transparent}.m3e-list-item__leading,.m3e-list-item__trailing{display:flex;flex:none;align-items:center;transition:color var(--_m3e-list-item-color-transition)}.m3e-list-item__leading{margin-inline-end:var(--m3e-comp-list-item-space);color:var(--_m3e-list-item-leading);font-family:var(--m3e-comp-list-item-leading-style-font);font-size:var(--m3e-comp-list-item-leading-style-size);font-weight:var(--m3e-comp-list-item-leading-style-weight);line-height:var(--m3e-comp-list-item-leading-style-line-height);letter-spacing:var(--m3e-comp-list-item-leading-style-tracking)}.m3e-list-item__trailing{margin-inline-start:var(--m3e-comp-list-item-space);color:var(--_m3e-list-item-trailing);font-family:var(--m3e-comp-list-item-trailing-style-font);font-size:var(--m3e-comp-list-item-trailing-style-size);font-weight:var(--m3e-comp-list-item-trailing-style-weight);line-height:var(--m3e-comp-list-item-trailing-style-line-height);letter-spacing:var(--m3e-comp-list-item-trailing-style-tracking)}.m3e-list-item__content{display:flex;flex:1 1 auto;flex-direction:column;min-inline-size:0}.m3e-list-item__headline{transition:color var(--_m3e-list-item-color-transition)}.m3e-list-item__overline{color:var(--_m3e-list-item-overline);font-family:var(--m3e-comp-list-item-overline-style-font);font-size:var(--m3e-comp-list-item-overline-style-size);font-weight:var(--m3e-comp-list-item-overline-style-weight);line-height:var(--m3e-comp-list-item-overline-style-line-height);letter-spacing:var(--m3e-comp-list-item-overline-style-tracking);transition:color var(--_m3e-list-item-color-transition)}.m3e-list-item__supporting{color:var(--_m3e-list-item-supporting);font-family:var(--m3e-comp-list-item-supporting-style-font);font-size:var(--m3e-comp-list-item-supporting-style-size);font-weight:var(--m3e-comp-list-item-supporting-style-weight);line-height:var(--m3e-comp-list-item-supporting-style-line-height);letter-spacing:var(--m3e-comp-list-item-supporting-style-tracking);transition:color var(--_m3e-list-item-color-transition)}.m3e-list-item__avatar{display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--m3e-comp-list-item-leading-avatar-size);block-size:var(--m3e-comp-list-item-leading-avatar-size);overflow:hidden;border-radius:var(--m3e-comp-list-item-leading-avatar-shape);background-color:var(--m3e-comp-list-item-leading-avatar-color);color:var(--m3e-comp-list-item-leading-avatar-label-color);object-fit:cover}.m3e-list-item__image{flex:none;inline-size:var(--m3e-comp-list-item-leading-image-width);block-size:var(--m3e-comp-list-item-leading-image-height);border-radius:var(--m3e-comp-list-item-leading-image-expressive-shape);object-fit:cover}.m3e-list-item__video{flex:none;inline-size:var(--m3e-comp-list-item-small-leading-video-width);block-size:var(--m3e-comp-list-item-small-leading-video-height);border-radius:var(--m3e-comp-list-item-leading-video-shape);object-fit:cover}.m3e-list-item__video--large{inline-size:var(--m3e-comp-list-item-large-leading-video-width);block-size:var(--m3e-comp-list-item-large-leading-video-height)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-checkbox{--_m3e-list-item-control: calc( var(--_m3e-checkbox-size) + (var(--m3e-comp-checkbox-box-padding) + var(--m3e-comp-checkbox-box-padding)) * (1 - var(--_m3e-checkbox-fix)) )}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-radio-button{--_m3e-list-item-control: calc( var(--m3e-comp-radio-button-icon-size) + var(--m3e-comp-radio-button-padding) + var(--m3e-comp-radio-button-padding) )}:is(.m3e-list-item__leading,.m3e-list-item__trailing) :is(.m3e-checkbox__input,.m3e-radio-button__input){margin:calc((var(--_m3e-list-item-control) - var(--m3e-comp-minimum-interactive-component-size)) / 2)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-checkbox__box{inset-inline-start:calc((var(--_m3e-list-item-control) - var(--_m3e-checkbox-size)) / 2)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-radio-button__icon{inset-inline-start:var(--m3e-comp-radio-button-padding)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-checkbox__state{inset-inline-start:calc((var(--_m3e-list-item-control) - var(--m3e-comp-checkbox-state-layer-size)) / 2)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-radio-button__state{inset-inline-start:calc((var(--_m3e-list-item-control) - var(--m3e-comp-radio-button-state-layer-size)) / 2)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-switch{min-block-size:var(--m3e-comp-switch-track-height)}:is(.m3e-list-item__leading,.m3e-list-item__trailing) .m3e-switch__input{inset-block:calc((var(--m3e-comp-switch-track-height) - var(--m3e-comp-minimum-interactive-component-size)) / 2)}.m3e-list-item [inert]{cursor:inherit}.m3e-list-item--segmented{--_m3e-list-item-container: var(--m3e-comp-list-item-segmented-container-color);--_m3e-list-item-rest-top: var( --_m3e-list-item-outer-top, var(--m3e-comp-list-item-segmented-shape) );--_m3e-list-item-rest-bottom: var( --_m3e-list-item-outer-bottom, var(--m3e-comp-list-item-segmented-shape) )}.m3e-list-item--interactive{cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-radius var(--m3e-comp-list-item-morph-duration) var(--m3e-comp-list-item-morph-easing),background-color var(--_m3e-list-item-color-transition),color var(--_m3e-list-item-color-transition),box-shadow var(--m3e-comp-list-item-elevation-duration) var(--m3e-comp-list-item-elevation-easing)}.m3e-list-item--interactive[data-spring]{transition-property:background-color,color,box-shadow}@media(hover:hover){.m3e-list-item--interactive:where(:hover:not([aria-disabled=true])){--_m3e-list-item-radius-top: var(--m3e-comp-list-item-shape-hovered);--_m3e-list-item-radius-bottom: var(--m3e-comp-list-item-shape-hovered)}}.m3e-list-item--interactive:where(:focus-visible:not([aria-disabled=true])){--_m3e-list-item-radius-top: var(--m3e-comp-list-item-shape-focused);--_m3e-list-item-radius-bottom: var(--m3e-comp-list-item-shape-focused)}.m3e-list-item:where([aria-selected=true]){--_m3e-list-item-radius-top: var(--m3e-comp-list-item-shape-selected);--_m3e-list-item-radius-bottom: var(--m3e-comp-list-item-shape-selected);--_m3e-list-item-container: var(--m3e-comp-list-item-container-color-selected);--_m3e-list-item-headline: var(--m3e-comp-list-item-headline-content-color-selected);--_m3e-list-item-leading: var(--m3e-comp-list-item-leading-content-color-selected);--_m3e-list-item-trailing: var(--m3e-comp-list-item-trailing-content-color-selected);--_m3e-list-item-overline: var(--m3e-comp-list-item-overline-content-color-selected);--_m3e-list-item-supporting: var(--m3e-comp-list-item-supporting-content-color-selected)}.m3e-list-item:where([data-dragged]){--_m3e-list-item-radius-top: var(--m3e-comp-list-item-shape-dragged);--_m3e-list-item-radius-bottom: var(--m3e-comp-list-item-shape-dragged);--_m3e-list-item-container: var(--m3e-comp-reorder-list-item-container-color);--_m3e-list-item-headline: var(--m3e-comp-list-item-headline-content-color-dragged);--_m3e-list-item-leading: var(--m3e-comp-list-item-leading-content-color-dragged);--_m3e-list-item-trailing: var(--m3e-comp-list-item-trailing-content-color-dragged);--_m3e-list-item-overline: var(--m3e-comp-list-item-overline-content-color-dragged);--_m3e-list-item-supporting: var(--m3e-comp-list-item-supporting-content-color-dragged);--_m3e-list-item-shadow: var(--m3e-comp-list-item-shadow-dragged);z-index:1}.m3e-list-item--interactive:where(:active,[data-pressed]):where(:not([aria-disabled=true])){--_m3e-list-item-radius-top: var(--m3e-comp-list-item-shape-pressed);--_m3e-list-item-radius-bottom: var(--m3e-comp-list-item-shape-pressed)}.m3e-list-item:where([aria-disabled=true],.m3e-list-item--disabled){--_m3e-list-item-container: var(--m3e-comp-list-item-container-color);--_m3e-list-item-headline: var(--m3e-comp-list-item-headline-content-color-disabled);--_m3e-list-item-leading: var(--m3e-comp-list-item-leading-content-color-disabled);--_m3e-list-item-trailing: var(--m3e-comp-list-item-trailing-content-color-disabled);--_m3e-list-item-overline: var(--m3e-comp-list-item-overline-content-color-disabled);--_m3e-list-item-supporting: var(--m3e-comp-list-item-supporting-content-color-disabled);cursor:default}.m3e-list-item--segmented:where([aria-disabled=true],.m3e-list-item--disabled){--_m3e-list-item-container: var(--m3e-comp-list-item-segmented-container-color)}.m3e-list-item:has(>.m3e-list-item__content>:is(.m3e-list-item__overline,.m3e-list-item__supporting)){min-block-size:var(--m3e-comp-list-item-two-line-min-height)}.m3e-list-item:has(>.m3e-list-item__leading>.m3e-list-item__video--large){align-items:flex-start}.m3e-list-item:is(.m3e-list-item--three-line,:has(>.m3e-list-item__content>.m3e-list-item__overline):has(>.m3e-list-item__content>.m3e-list-item__supporting)){align-items:flex-start;min-block-size:var(--m3e-comp-list-item-three-line-min-height)}.m3e-list-item--baseline{--_m3e-list-item-radius-top: var(--m3e-comp-list-item-baseline-shape);--_m3e-list-item-radius-bottom: var(--m3e-comp-list-item-baseline-shape);padding-block:var(--m3e-comp-list-item-baseline-padding-vertical);padding-inline:var(--m3e-comp-list-item-baseline-padding-start) var(--m3e-comp-list-item-baseline-padding-end)}.m3e-list-item--baseline>.m3e-list-item__leading{margin-inline-end:var(--m3e-comp-list-item-baseline-leading-space)}.m3e-list-item--baseline>.m3e-list-item__trailing{margin-inline-start:var(--m3e-comp-list-item-baseline-trailing-space)}.m3e-list-item--baseline:is(.m3e-list-item--three-line,:has(>.m3e-list-item__content>.m3e-list-item__overline):has(>.m3e-list-item__content>.m3e-list-item__supporting)){padding-block:var(--m3e-comp-list-item-baseline-three-line-padding-vertical)}.m3e-list-item--baseline:has(>.m3e-list-item__leading>.m3e-list-item__video--large):not(.m3e-list-item--three-line,:has(>.m3e-list-item__content>.m3e-list-item__overline):has(>.m3e-list-item__content>.m3e-list-item__supporting)){align-items:center}@media(forced-colors:active){:is(.m3e-list-item--segmented,.m3e-list-item--interactive){outline:var(--m3e-comp-divider-thickness) solid CanvasText;outline-offset:calc(var(--m3e-comp-divider-thickness) * -1)}.m3e-list-item[aria-selected=true]{outline:var(--m3e-sys-state-focus-indicator-thickness) solid Highlight;outline-offset:var(--m3e-sys-state-focus-indicator-inner-offset)}.m3e-list-item:is([aria-disabled=true],.m3e-list-item--disabled),.m3e-list-item:is([aria-disabled=true],.m3e-list-item--disabled) *{color:GrayText}}}
package/dist/radio-button.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/radio-button.css";@import"@kyralabs/m3e-tokens/components/radio-button-defaults.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@property --_m3e-radio-button-dot-radius{syntax: "<length>"; inherits: false; initial-value: 0;}@layer m3e.components{.m3e-radio-group{display:flex;flex-direction:column;min-inline-size:0;margin:0;padding:0;border:0}.m3e-radio-group:is([aria-orientation=horizontal],.m3e-radio-group--horizontal){flex-flow:row wrap;align-items:center}.m3e-radio-button{position:relative;display:inline-flex;align-items:center;vertical-align:middle;cursor:pointer;-webkit-tap-highlight-color:transparent}.m3e-radio-button__input{appearance:none;position:relative;z-index:1;flex:none;box-sizing:border-box;inline-size:var(--m3e-comp-minimum-interactive-component-size);block-size:var(--m3e-comp-minimum-interactive-component-size);margin:0;padding:0;border:0;background:none;opacity:0;cursor:inherit;outline:none}.m3e-radio-button__icon,.m3e-radio-button__state{position:absolute;inset-block:0;margin-block:auto;pointer-events:none}.m3e-radio-button__icon{--_m3e-radio-button-color: var(--m3e-comp-radio-button-color-unselected);--_m3e-radio-button-color-duration: var(--m3e-comp-radio-button-color-duration);inset-inline-start:calc((var(--m3e-comp-minimum-interactive-component-size) - var(--m3e-comp-radio-button-icon-size)) / 2);box-sizing:border-box;inline-size:var(--m3e-comp-radio-button-icon-size);block-size:var(--m3e-comp-radio-button-icon-size);border:var(--m3e-comp-radio-button-stroke-width) solid currentcolor;border-radius:var(--m3e-sys-shape-corner-full);color:var(--_m3e-radio-button-color);transition:color var(--_m3e-radio-button-color-duration) var(--m3e-comp-radio-button-color-easing)}.m3e-radio-button__icon:before{--_m3e-radio-button-dot-radius: 0;--_m3e-radio-button-half-stroke: calc(var(--m3e-comp-radio-button-stroke-width) / 2);content:"";position:absolute;inset:calc(50% - max(var(--_m3e-radio-button-dot-radius),var(--_m3e-radio-button-half-stroke)) + var(--_m3e-radio-button-half-stroke));border-radius:inherit;background-color:currentcolor;transition:--_m3e-radio-button-dot-radius var(--m3e-comp-radio-button-dot-duration) var(--m3e-comp-radio-button-dot-easing)}.m3e-radio-button__input:checked~.m3e-radio-button__icon{--_m3e-radio-button-color: var(--m3e-comp-radio-button-color-selected)}.m3e-radio-button__input:checked~.m3e-radio-button__icon:before{--_m3e-radio-button-dot-radius: calc(var(--m3e-comp-radio-button-dot-size) / 2)}.m3e-radio-button:has(>.m3e-radio-button__input:disabled){cursor:default}.m3e-radio-button__input:disabled~.m3e-radio-button__icon{--_m3e-radio-button-color: color-mix( in srgb, var(--m3e-comp-radio-button-color-unselected-disabled) calc(var(--m3e-comp-radio-button-opacity-unselected-disabled) * 100%), transparent );--_m3e-radio-button-color-duration: calc(var(--m3e-comp-radio-button-color-duration) * 0)}.m3e-radio-button__input:disabled:checked~.m3e-radio-button__icon{--_m3e-radio-button-color: color-mix( in srgb, var(--m3e-comp-radio-button-color-selected-disabled) calc(var(--m3e-comp-radio-button-opacity-selected-disabled) * 100%), transparent )}.m3e-radio-button__state{--m3e-comp-state-layer-color: var(--m3e-comp-radio-button-state-layer-color);inset-inline-start:calc((var(--m3e-comp-minimum-interactive-component-size) - var(--m3e-comp-radio-button-state-layer-size)) / 2);inline-size:var(--m3e-comp-radio-button-state-layer-size);block-size:var(--m3e-comp-radio-button-state-layer-size);border-radius:var(--m3e-comp-radio-button-state-layer-shape)}.m3e-radio-button__state:before{--_m3e-ripple-x: 50%;--_m3e-ripple-y: 50%;--_m3e-ripple-radius: calc(var(--m3e-comp-radio-button-state-layer-size) / 2)}.m3e-radio-button__label{margin-inline-start:calc(var(--m3e-comp-radio-button-label-space) - (var(--m3e-comp-minimum-interactive-component-size) - var(--m3e-comp-radio-button-icon-size)) / 2 + var(--m3e-comp-radio-button-padding));font-family:var(--m3e-comp-radio-button-label-text-font);font-size:var(--m3e-comp-radio-button-label-text-size);font-weight:var(--m3e-comp-radio-button-label-text-weight);line-height:var(--m3e-comp-radio-button-label-text-line-height);letter-spacing:var(--m3e-comp-radio-button-label-text-tracking)}.m3e-radio-group:not([aria-orientation=horizontal],.m3e-radio-group--horizontal)>.m3e-radio-button{min-block-size:var(--m3e-comp-radio-button-group-row-height)}@media(forced-colors:active){.m3e-radio-button{--m3e-comp-radio-button-color-unselected: CanvasText;--m3e-comp-radio-button-color-selected: Highlight;--m3e-comp-radio-button-color-unselected-disabled: GrayText;--m3e-comp-radio-button-opacity-unselected-disabled: 1;--m3e-comp-radio-button-color-selected-disabled: GrayText;--m3e-comp-radio-button-opacity-selected-disabled: 1}.m3e-radio-button__icon{forced-color-adjust:none}}}
package/dist/slider.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/slider.css";@import"@kyralabs/m3e-tokens/components/slider-defaults.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@layer m3e.components{.m3e-slider{--_m3e-slider-thickness: var(--m3e-comp-slider-x-small-track-height);--_m3e-slider-thumb-length: var(--m3e-comp-slider-x-small-thumb-height);--_m3e-slider-corner: var(--m3e-comp-slider-x-small-track-corner-size);--_m3e-slider-icon-size: var(--m3e-comp-slider-medium-icon-size);--_m3e-slider-icon-padding: var(--m3e-comp-slider-medium-icon-padding);--_m3e-slider-shrink: 0;--_m3e-slider-steps: var(--m3e-comp-slider-steps, 0);--_m3e-slider-end: var(--m3e-comp-slider-value, 0);--_m3e-slider-start: var(--m3e-comp-slider-start-value, 0);--_m3e-slider-active: var(--m3e-comp-slider-track-color-active);--_m3e-slider-inactive: var(--m3e-comp-slider-track-color-inactive);--_m3e-slider-tick-active: var(--m3e-comp-slider-tick-color-active);--_m3e-slider-tick-inactive: var(--m3e-comp-slider-tick-color-inactive);--_m3e-slider-stop: var(--m3e-comp-slider-track-stop-indicator-color);--_m3e-slider-thumb: var(--m3e-comp-slider-thumb-color);--_m3e-slider-icon-active: var(--m3e-comp-slider-icon-color-active);--_m3e-slider-icon-inactive: var(--m3e-comp-slider-icon-color-inactive);position:relative;display:block;box-sizing:border-box;block-size:max(var(--m3e-comp-minimum-interactive-component-size),var(--_m3e-slider-thumb-length));-webkit-tap-highlight-color:transparent}.m3e-slider--size-s{--_m3e-slider-thickness: var(--m3e-comp-slider-small-track-height);--_m3e-slider-thumb-length: var(--m3e-comp-slider-small-thumb-height);--_m3e-slider-corner: var(--m3e-comp-slider-small-track-corner-size);--_m3e-slider-shrink: 1}.m3e-slider--size-m{--_m3e-slider-thickness: var(--m3e-comp-slider-medium-track-height);--_m3e-slider-thumb-length: var(--m3e-comp-slider-medium-thumb-height);--_m3e-slider-corner: var(--m3e-comp-slider-medium-track-corner-size);--_m3e-slider-icon-size: var(--m3e-comp-slider-medium-icon-size);--_m3e-slider-icon-padding: var(--m3e-comp-slider-medium-icon-padding);--_m3e-slider-shrink: 1}.m3e-slider--size-l{--_m3e-slider-thickness: var(--m3e-comp-slider-large-track-height);--_m3e-slider-thumb-length: var(--m3e-comp-slider-large-thumb-height);--_m3e-slider-corner: var(--m3e-comp-slider-large-track-corner-size);--_m3e-slider-icon-size: var(--m3e-comp-slider-large-icon-size);--_m3e-slider-icon-padding: var(--m3e-comp-slider-large-icon-padding);--_m3e-slider-shrink: 1}.m3e-slider--size-xl{--_m3e-slider-thickness: var(--m3e-comp-slider-x-large-track-height);--_m3e-slider-thumb-length: var(--m3e-comp-slider-x-large-thumb-height);--_m3e-slider-corner: var(--m3e-comp-slider-x-large-track-corner-size);--_m3e-slider-icon-size: var(--m3e-comp-slider-x-large-icon-size);--_m3e-slider-icon-padding: var(--m3e-comp-slider-x-large-icon-padding);--_m3e-slider-shrink: 1}.m3e-slider.m3e-slider--range{--_m3e-slider-shrink: 0}.m3e-slider.m3e-slider--centered{--_m3e-slider-shrink: 1}.m3e-slider__track{--_m3e-slider-length: 100cqi;--_m3e-slider-zero: calc(var(--_m3e-slider-length) * 0);--_m3e-slider-half: calc(var(--_m3e-slider-length) / 2);--_m3e-slider-gap: calc( var(--m3e-comp-slider-thumb-width) / 2 + var(--m3e-comp-slider-thumb-track-gap-size) );--_m3e-slider-inside: var(--m3e-comp-slider-track-inside-corner-size);--_m3e-slider-discrete: min(1, var(--_m3e-slider-steps));--_m3e-slider-thresholded: calc( 1 - var(--_m3e-slider-shrink) + var(--_m3e-slider-shrink) * var(--_m3e-slider-discrete) );--_m3e-slider-pos: calc( var(--_m3e-slider-end) * var(--_m3e-slider-length) + var(--_m3e-slider-discrete) * round(up, min(var(--_m3e-slider-end), 1 - var(--_m3e-slider-end)), 1) * var(--_m3e-slider-corner) * (1 - var(--_m3e-slider-end) - var(--_m3e-slider-end)) );--_m3e-slider-start-pos: calc( var(--_m3e-slider-start) * var(--_m3e-slider-length) + var(--_m3e-slider-discrete) * round(up, min(var(--_m3e-slider-start), 1 - var(--_m3e-slider-start)), 1) * var(--_m3e-slider-corner) * (1 - var(--_m3e-slider-start) - var(--_m3e-slider-start)) );--_m3e-slider-start-raw: var(--_m3e-slider-zero);--_m3e-slider-start-threshold: var(--_m3e-slider-zero);--_m3e-slider-active-from: var(--_m3e-slider-zero);--_m3e-slider-active-raw: calc(var(--_m3e-slider-pos) - var(--_m3e-slider-gap));--_m3e-slider-active-threshold: calc( var(--_m3e-slider-corner) * var(--_m3e-slider-thresholded) );--_m3e-slider-active-start-radius: var(--_m3e-slider-corner);--_m3e-slider-end-raw: calc( var(--_m3e-slider-length) - var(--_m3e-slider-pos) - var(--_m3e-slider-gap) );--_m3e-slider-end-threshold: calc(var(--_m3e-slider-corner) * var(--_m3e-slider-thresholded));--_m3e-slider-thumb-gap: var(--_m3e-slider-gap);--_m3e-slider-start-gap-centre: var(--_m3e-slider-zero);--_m3e-slider-start-gap: calc(var(--_m3e-slider-length) * -1);--_m3e-slider-centre-gap: calc(var(--_m3e-slider-length) * -1);position:absolute;inset-block:0;inset-inline:calc(var(--m3e-comp-slider-thumb-width) / 2);container-type:inline-size;touch-action:none}.m3e-slider--range>.m3e-slider__track{--_m3e-slider-start-raw: calc(var(--_m3e-slider-start-pos) - var(--_m3e-slider-gap));--_m3e-slider-start-threshold: calc(var(--_m3e-slider-corner) * var(--_m3e-slider-thresholded));--_m3e-slider-active-from: calc(var(--_m3e-slider-start-pos) + var(--_m3e-slider-gap));--_m3e-slider-active-raw: calc( var(--_m3e-slider-pos) - var(--_m3e-slider-start-pos) - var(--_m3e-slider-gap) - var(--_m3e-slider-gap) );--_m3e-slider-active-threshold: calc( var(--_m3e-slider-inside) * var(--_m3e-slider-thresholded) );--_m3e-slider-active-start-radius: var(--_m3e-slider-inside);--_m3e-slider-start-gap-centre: var(--_m3e-slider-start-pos);--_m3e-slider-start-gap: var(--_m3e-slider-gap)}.m3e-slider--centered>.m3e-slider__track{--_m3e-slider-after: round(up, max(0, var(--_m3e-slider-end) - .5 ), 1);--_m3e-slider-before: round(up, max(0, .5 - var(--_m3e-slider-end)), 1);--_m3e-slider-gap-to-start: calc( var(--m3e-comp-slider-thumb-width) * (1 - var(--_m3e-slider-after)) / 2 + var(--m3e-comp-slider-thumb-track-gap-size) );--_m3e-slider-gap-to-end: calc( var(--m3e-comp-slider-thumb-width) * (1 - var(--_m3e-slider-before)) / 2 + var(--m3e-comp-slider-thumb-track-gap-size) );--_m3e-slider-low: min(var(--_m3e-slider-pos), var(--_m3e-slider-half));--_m3e-slider-high: max(var(--_m3e-slider-pos), var(--_m3e-slider-half));--_m3e-slider-start-raw: calc(var(--_m3e-slider-low) - var(--_m3e-slider-gap-to-start));--_m3e-slider-start-threshold: calc(var(--_m3e-slider-corner) * var(--_m3e-slider-thresholded));--_m3e-slider-active-from: calc( var(--_m3e-slider-low) + var(--_m3e-slider-before) * var(--_m3e-slider-gap-to-start) );--_m3e-slider-active-raw: calc( var(--_m3e-slider-high) - var(--_m3e-slider-after) * var(--_m3e-slider-gap-to-end) - var(--_m3e-slider-active-from) );--_m3e-slider-active-threshold: calc( var(--_m3e-slider-inside) * var(--_m3e-slider-thresholded) );--_m3e-slider-active-start-radius: var(--_m3e-slider-inside);--_m3e-slider-end-raw: calc( var(--_m3e-slider-length) - var(--_m3e-slider-high) - var(--_m3e-slider-gap-to-end) );--_m3e-slider-thumb-gap: calc( var(--_m3e-slider-after) * var(--_m3e-slider-gap-to-end) + (1 - var(--_m3e-slider-after)) * var(--_m3e-slider-gap-to-start) );--_m3e-slider-centre-gap: calc( var(--_m3e-slider-after) * var(--_m3e-slider-gap-to-start) + (1 - var(--_m3e-slider-after)) * var(--_m3e-slider-gap-to-end) )}.m3e-slider__inactive-start,.m3e-slider__active,.m3e-slider__inactive-end{--_m3e-slider-size: min( max(var(--_m3e-slider-zero), var(--_m3e-slider-raw)), round( up, max(var(--_m3e-slider-zero), var(--_m3e-slider-raw) - var(--_m3e-slider-threshold)), var(--_m3e-slider-length) ) );position:absolute;inset-block:0;box-sizing:border-box;inline-size:var(--_m3e-slider-size);block-size:var(--_m3e-slider-thickness);margin-block:auto;background-color:var(--_m3e-slider-inactive);pointer-events:none}.m3e-slider__inactive-start{--_m3e-slider-raw: var(--_m3e-slider-start-raw);--_m3e-slider-threshold: var(--_m3e-slider-start-threshold);inset-inline-start:0;border-start-start-radius:var(--_m3e-slider-corner);border-end-start-radius:var(--_m3e-slider-corner);border-start-end-radius:var(--_m3e-slider-inside);border-end-end-radius:var(--_m3e-slider-inside)}.m3e-slider__active{--_m3e-slider-raw: var(--_m3e-slider-active-raw);--_m3e-slider-threshold: var(--_m3e-slider-active-threshold);inset-inline-start:var(--_m3e-slider-active-from);border-start-start-radius:var(--_m3e-slider-active-start-radius);border-end-start-radius:var(--_m3e-slider-active-start-radius);border-start-end-radius:var(--_m3e-slider-inside);border-end-end-radius:var(--_m3e-slider-inside);background-color:var(--_m3e-slider-active)}.m3e-slider__inactive-end{--_m3e-slider-raw: var(--_m3e-slider-end-raw);--_m3e-slider-threshold: var(--_m3e-slider-end-threshold);inset-inline-end:0;border-start-start-radius:var(--_m3e-slider-inside);border-end-start-radius:var(--_m3e-slider-inside);border-start-end-radius:var(--_m3e-slider-corner);border-end-end-radius:var(--_m3e-slider-corner)}.m3e-slider__inactive-start:after,.m3e-slider__inactive-end:after{--_m3e-slider-dot: min( var(--m3e-comp-slider-track-stop-indicator-size), round(up, var(--_m3e-slider-size), var(--_m3e-slider-length)) );content:"";position:absolute;inset-block:0;inline-size:var(--_m3e-slider-dot);block-size:var(--_m3e-slider-dot);margin-block:auto;border-radius:var(--m3e-comp-slider-stop-indicator-shape);background-color:var(--_m3e-slider-stop)}.m3e-slider__inactive-start:after{inset-inline-start:calc(var(--_m3e-slider-corner) - var(--_m3e-slider-dot) / 2)}.m3e-slider__inactive-end:after{inset-inline-end:calc(var(--_m3e-slider-corner) - var(--_m3e-slider-dot) / 2)}.m3e-slider__ticks{position:absolute;inset:0;pointer-events:none}.m3e-slider__tick{--_m3e-slider-spacing: calc( (var(--_m3e-slider-length) - var(--_m3e-slider-corner) - var(--_m3e-slider-corner)) / (var(--_m3e-slider-steps) + 1) );--_m3e-slider-at: calc( var(--_m3e-slider-corner) + var(--m3e-comp-slider-tick-index, 0) * var(--_m3e-slider-spacing) );--_m3e-slider-past-thumb: calc( max( var(--_m3e-slider-at) - var(--_m3e-slider-pos), var(--_m3e-slider-pos) - var(--_m3e-slider-at) ) - var(--_m3e-slider-thumb-gap) );--_m3e-slider-past-start: calc( max( var(--_m3e-slider-at) - var(--_m3e-slider-start-gap-centre), var(--_m3e-slider-start-gap-centre) - var(--_m3e-slider-at) ) - var(--_m3e-slider-start-gap) );--_m3e-slider-past-centre: calc( max( var(--_m3e-slider-at) - var(--_m3e-slider-half), var(--_m3e-slider-half) - var(--_m3e-slider-at) ) - var(--_m3e-slider-centre-gap) );--_m3e-slider-dot: min( var(--m3e-comp-slider-tick-size), round( up, max(var(--_m3e-slider-zero), var(--_m3e-slider-past-thumb)), var(--_m3e-slider-length) ), round( up, max(var(--_m3e-slider-zero), var(--_m3e-slider-past-start)), var(--_m3e-slider-length) ), round( up, max(var(--_m3e-slider-zero), var(--_m3e-slider-past-centre)), var(--_m3e-slider-length) ) );--_m3e-slider-on-active: min( round( up, max(var(--_m3e-slider-zero), var(--_m3e-slider-at) - var(--_m3e-slider-active-from)), var(--_m3e-slider-length) ), round( up, max( var(--_m3e-slider-zero), var(--_m3e-slider-active-from) + var(--_m3e-slider-active-raw) - var(--_m3e-slider-at) ), var(--_m3e-slider-length) ) );position:absolute;inset-block:0;inset-inline-start:var(--_m3e-slider-at);inline-size:var(--_m3e-slider-dot);block-size:var(--_m3e-slider-dot);margin-block:auto;margin-inline-start:calc(var(--_m3e-slider-dot) / 2 * -1);border-radius:var(--m3e-comp-slider-stop-indicator-shape);background:linear-gradient(var(--_m3e-slider-tick-active) var(--_m3e-slider-on-active),var(--_m3e-slider-tick-inactive) var(--_m3e-slider-on-active))}.m3e-slider__icon{--m3e-comp-icon-size: var(--_m3e-slider-icon-size);--_m3e-slider-icon-shown: min( var(--_m3e-slider-icon-size), round( up, max( var(--_m3e-slider-zero), var(--_m3e-slider-active-raw) - var(--_m3e-slider-icon-size) - var(--_m3e-slider-icon-padding) - var(--_m3e-slider-icon-padding) ), var(--_m3e-slider-length) ) );--_m3e-slider-icon-at: var(--_m3e-slider-icon-padding);position:absolute;inset-block:0;inset-inline-start:var(--_m3e-slider-icon-at);inline-size:var(--_m3e-slider-icon-shown);margin-block:auto;color:var(--_m3e-slider-icon-active);pointer-events:none}.m3e-slider__icon--inactive{--_m3e-slider-icon-shown: min( var(--_m3e-slider-icon-size), round( up, max( var(--_m3e-slider-zero), var(--_m3e-slider-icon-size) + var(--_m3e-slider-icon-padding) + var(--_m3e-slider-icon-padding) - var(--_m3e-slider-active-raw) ), var(--_m3e-slider-length) ) );--_m3e-slider-icon-at: calc( var(--_m3e-slider-pos) + var(--_m3e-slider-gap) + var(--_m3e-slider-icon-padding) );color:var(--_m3e-slider-icon-inactive)}.m3e-slider__icon:dir(rtl){inset-inline:auto var(--_m3e-slider-icon-at)}.m3e-slider__thumb{--_m3e-slider-at: var(--_m3e-slider-pos);position:absolute;inset-block:0;inset-inline-start:calc(var(--_m3e-slider-at) - var(--m3e-comp-slider-thumb-width) / 2);inline-size:var(--m3e-comp-slider-thumb-width);block-size:var(--_m3e-slider-thumb-length);margin-block:auto;cursor:pointer}.m3e-slider__thumb--start{--_m3e-slider-at: var(--_m3e-slider-start-pos)}.m3e-slider__input{appearance:none;position:absolute;inset:0;box-sizing:border-box;inline-size:auto;block-size:auto;margin:0;padding:0;border:0;background:none;opacity:0;pointer-events:none;outline:none}.m3e-slider__handle{position:absolute;inset:0;inline-size:var(--m3e-comp-slider-thumb-width);margin-inline:auto;border-radius:var(--m3e-comp-slider-handle-shape);background-color:var(--_m3e-slider-thumb)}.m3e-slider__value-indicator{position:absolute;inset-block-end:calc(100% + var(--m3e-comp-slider-value-indicator-active-bottom-space));inset-inline-start:50%;display:none;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--m3e-comp-slider-value-indicator-container-width);block-size:var(--m3e-comp-slider-value-indicator-container-height);margin-inline-start:calc(var(--m3e-comp-slider-value-indicator-container-width) / 2 * -1);border-radius:var(--m3e-comp-slider-value-indicator-container-shape);background-color:var(--m3e-comp-slider-value-indicator-container-color);color:var(--m3e-comp-slider-value-indicator-label-text-color);font-family:var(--m3e-comp-slider-value-indicator-label-text-font);font-size:var(--m3e-comp-slider-value-indicator-label-text-size);font-weight:var(--m3e-comp-slider-value-indicator-label-text-weight);line-height:var(--m3e-comp-slider-value-indicator-label-text-line-height);letter-spacing:var(--m3e-comp-slider-value-indicator-label-text-tracking);white-space:nowrap;pointer-events:none}.m3e-slider--vertical{inline-size:max(var(--m3e-comp-minimum-interactive-component-size),var(--_m3e-slider-thumb-length));block-size:auto}.m3e-slider--vertical>.m3e-slider__track{--_m3e-slider-length: 100cqb;inset-block:calc(var(--m3e-comp-slider-thumb-width) / 2);inset-inline:0;container-type:size}.m3e-slider--vertical :is(.m3e-slider__inactive-start,.m3e-slider__active,.m3e-slider__inactive-end){inset-block:auto;inset-inline:0;inline-size:var(--_m3e-slider-thickness);block-size:var(--_m3e-slider-size);margin-block:0;margin-inline:auto}.m3e-slider--vertical .m3e-slider__inactive-start{inset-block-end:0;border-start-start-radius:var(--_m3e-slider-inside);border-start-end-radius:var(--_m3e-slider-inside);border-end-start-radius:var(--_m3e-slider-corner);border-end-end-radius:var(--_m3e-slider-corner)}.m3e-slider--vertical .m3e-slider__active{inset-block-end:var(--_m3e-slider-active-from);border-start-start-radius:var(--_m3e-slider-inside);border-start-end-radius:var(--_m3e-slider-inside);border-end-start-radius:var(--_m3e-slider-active-start-radius);border-end-end-radius:var(--_m3e-slider-active-start-radius)}.m3e-slider--vertical .m3e-slider__inactive-end{inset-block-start:0;border-start-start-radius:var(--_m3e-slider-corner);border-start-end-radius:var(--_m3e-slider-corner);border-end-start-radius:var(--_m3e-slider-inside);border-end-end-radius:var(--_m3e-slider-inside)}.m3e-slider--vertical :is(.m3e-slider__inactive-start,.m3e-slider__inactive-end):after{inset-block:auto;inset-inline:0;margin-block:0;margin-inline:auto}.m3e-slider--vertical .m3e-slider__inactive-start:after{inset-block-end:calc(var(--_m3e-slider-corner) - var(--_m3e-slider-dot) / 2)}.m3e-slider--vertical .m3e-slider__inactive-end:after{inset-block-start:calc(var(--_m3e-slider-corner) - var(--_m3e-slider-dot) / 2)}.m3e-slider--vertical .m3e-slider__tick{inset-block:auto;inset-block-end:var(--_m3e-slider-at);inset-inline:0;margin-block:0 calc(var(--_m3e-slider-dot) / 2 * -1);margin-inline:auto}.m3e-slider--vertical .m3e-slider__icon{inset-block:auto;inset-block-end:var(--_m3e-slider-icon-at);inset-inline:0;inline-size:var(--_m3e-slider-icon-size);block-size:var(--_m3e-slider-icon-shown);margin-block:0;margin-inline:auto}.m3e-slider--vertical .m3e-slider__thumb{inset-block:auto;inset-block-end:calc(var(--_m3e-slider-at) - var(--m3e-comp-slider-thumb-width) / 2);inset-inline:0;inline-size:var(--_m3e-slider-thumb-length);block-size:var(--m3e-comp-slider-thumb-width);margin-block:0;margin-inline:auto}.m3e-slider--vertical .m3e-slider__handle{inset:0;inline-size:auto;block-size:var(--m3e-comp-slider-thumb-width);margin:auto 0}.m3e-slider--vertical .m3e-slider__value-indicator{inset-block:50% auto;inset-inline:auto calc(100% + var(--m3e-comp-slider-value-indicator-active-bottom-space));margin-block-start:calc(var(--m3e-comp-slider-value-indicator-container-height) / 2 * -1);margin-inline-start:0}.m3e-slider:has(.m3e-slider__icon) .m3e-slider__inactive-end:after{display:none}.m3e-slider:not(:has(.m3e-slider__icon)) .m3e-slider__tick:last-child,.m3e-slider:is(.m3e-slider--range,.m3e-slider--centered) .m3e-slider__tick:first-child{display:none}.m3e-slider:is(.m3e-slider--range,.m3e-slider--centered) .m3e-slider__icon,.m3e-slider:not(.m3e-slider--size-m,.m3e-slider--size-l,.m3e-slider--size-xl) .m3e-slider__icon{display:none}.m3e-slider__thumb:is([data-dragging],:has(>.m3e-slider__input:focus-visible))>.m3e-slider__handle{inline-size:calc(var(--m3e-comp-slider-thumb-width) / 2)}.m3e-slider__thumb:is([data-dragging],:has(>.m3e-slider__input:focus-visible))>.m3e-slider__value-indicator{display:flex}.m3e-slider--vertical .m3e-slider__thumb:is([data-dragging],:has(>.m3e-slider__input:focus-visible))>.m3e-slider__handle{inline-size:auto;block-size:calc(var(--m3e-comp-slider-thumb-width) / 2)}.m3e-slider:has(.m3e-slider__input:disabled){--_m3e-slider-active: var(--m3e-comp-slider-track-color-active-disabled);--_m3e-slider-inactive: var(--m3e-comp-slider-track-color-inactive-disabled);--_m3e-slider-tick-active: var(--m3e-comp-slider-tick-color-active-disabled);--_m3e-slider-tick-inactive: var(--m3e-comp-slider-tick-color-inactive-disabled);--_m3e-slider-stop: var(--m3e-comp-slider-track-stop-indicator-color-disabled);--_m3e-slider-thumb: var(--m3e-comp-slider-thumb-color-disabled);--_m3e-slider-icon-active: var(--m3e-comp-slider-icon-color-active-disabled);--_m3e-slider-icon-inactive: var(--m3e-comp-slider-icon-color-inactive-disabled)}.m3e-slider:has(.m3e-slider__input:disabled) .m3e-slider__thumb{cursor:default}@media(forced-colors:active){.m3e-slider{--_m3e-slider-active: Highlight;--_m3e-slider-inactive: GrayText;--_m3e-slider-tick-active: HighlightText;--_m3e-slider-tick-inactive: CanvasText;--_m3e-slider-stop: CanvasText;--_m3e-slider-thumb: CanvasText;--_m3e-slider-icon-active: HighlightText;--_m3e-slider-icon-inactive: CanvasText}.m3e-slider:has(.m3e-slider__input:disabled){--_m3e-slider-active: GrayText;--_m3e-slider-inactive: GrayText;--_m3e-slider-tick-active: Canvas;--_m3e-slider-tick-inactive: Canvas;--_m3e-slider-stop: Canvas;--_m3e-slider-thumb: GrayText;--_m3e-slider-icon-active: Canvas;--_m3e-slider-icon-inactive: Canvas}.m3e-slider__track{forced-color-adjust:none}.m3e-slider__value-indicator{border:var(--m3e-sys-state-focus-indicator-thickness) solid CanvasText;background-color:Canvas;color:CanvasText}}}
package/dist/state-layer.css CHANGED
@@ -1 +1 @@
1
- @property --_m3e-ripple-size{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@keyframes m3e-ripple-grow{0%{--_m3e-ripple-size: 0%}}@layer m3e.base{:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result){position:relative;isolation:isolate}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result):before{--_m3e-state-layer-opacity: 0;content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background-color:var(--m3e-comp-state-layer-color, currentcolor);opacity:var(--_m3e-state-layer-opacity);pointer-events:none;transition:opacity var(--m3e-sys-motion-spring-default-effects-duration) var(--m3e-sys-motion-spring-default-effects-easing)}@media(hover:hover){:where(.m3e-navigation-item:hover .m3e-navigation-item__state):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-hover-state-layer-opacity)}}:where(.m3e-navigation-item:focus-visible .m3e-navigation-item__state):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-navigation-item:active .m3e-navigation-item__state):before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-navigation-item[aria-disabled=true] .m3e-navigation-item__state):before{display:none}@media(hover:hover){:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result):hover:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-hover-state-layer-opacity)}}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result):focus-visible:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result)[data-dragged]:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-dragged-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result):active:before,:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result)[data-pressed]:before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result):is(:disabled,[aria-disabled=true]):before{display:none}:where(.m3e-card--interactive):has(.m3e-card__action:focus-visible):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-card--interactive):has(.m3e-card__action:active):before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-card--interactive):has(.m3e-card__action[aria-disabled=true]):before{display:none}:where(.m3e-search__result)[data-focus-visible]:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result)[data-ripple][data-pressed]:before{--_m3e-ripple-opacity: calc( var(--_m3e-state-layer-opacity) + var(--m3e-sys-state-pressed-state-layer-opacity) - var(--_m3e-state-layer-opacity) * var(--m3e-sys-state-pressed-state-layer-opacity) );--_m3e-ripple-size: var(--_m3e-ripple-radius, 100%);background:radial-gradient(circle at var(--_m3e-ripple-x, 50%) var(--_m3e-ripple-y, 50%),var(--m3e-comp-state-layer-color, currentcolor) var(--_m3e-ripple-size),color-mix(in srgb,var(--m3e-comp-state-layer-color, currentcolor) calc(var(--_m3e-state-layer-opacity) / var(--_m3e-ripple-opacity) * 100%),transparent) var(--_m3e-ripple-size));opacity:var(--_m3e-ripple-opacity);transition:none;animation:m3e-ripple-grow var(--m3e-sys-motion-spring-default-effects-duration) var(--m3e-sys-motion-spring-default-effects-easing) both}@media(forced-colors:active){:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result):before{display:none}}}
1
+ @property --_m3e-ripple-size{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@keyframes m3e-ripple-grow{0%{--_m3e-ripple-size: 0%}}@layer m3e.base{:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive,.m3e-checkbox__state,.m3e-radio-button__state,.m3e-switch__state){position:relative;isolation:isolate}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive,.m3e-checkbox__state,.m3e-radio-button__state,.m3e-switch__state):before{--_m3e-state-layer-opacity: 0;content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background-color:var(--m3e-comp-state-layer-color, currentcolor);opacity:var(--_m3e-state-layer-opacity);pointer-events:none;transition:opacity var(--m3e-sys-motion-spring-default-effects-duration) var(--m3e-sys-motion-spring-default-effects-easing)}@media(hover:hover){:where(.m3e-navigation-item:hover .m3e-navigation-item__state):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-hover-state-layer-opacity)}}:where(.m3e-navigation-item:focus-visible .m3e-navigation-item__state):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-navigation-item:active .m3e-navigation-item__state):before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-navigation-item[aria-disabled=true] .m3e-navigation-item__state):before{display:none}@media(hover:hover){:where(.m3e-checkbox:hover .m3e-checkbox__state,.m3e-radio-button:hover .m3e-radio-button__state,.m3e-switch:hover .m3e-switch__state):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-hover-state-layer-opacity)}}:where(.m3e-checkbox__input:focus-visible~.m3e-checkbox__state,.m3e-radio-button__input:focus-visible~.m3e-radio-button__state,.m3e-switch__input:focus-visible~.m3e-switch__track .m3e-switch__state):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-checkbox:active .m3e-checkbox__state,.m3e-radio-button:active .m3e-radio-button__state,.m3e-switch:active .m3e-switch__state):before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-checkbox__input:disabled~.m3e-checkbox__state,.m3e-radio-button__input:disabled~.m3e-radio-button__state,.m3e-switch__input:disabled~.m3e-switch__track .m3e-switch__state):before{display:none}@media(hover:hover){:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive):hover:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-hover-state-layer-opacity)}}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive):focus-visible:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive)[data-dragged]:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-dragged-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive):active:before,:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive,.m3e-checkbox__state,.m3e-radio-button__state,.m3e-switch__state)[data-pressed]:before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive):is(:disabled,[aria-disabled=true]):before{display:none}:where(.m3e-card--interactive):has(.m3e-card__action:focus-visible):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-card--interactive):has(.m3e-card__action:active):before{opacity:var(--m3e-sys-state-pressed-state-layer-opacity)}:where(.m3e-card--interactive):has(.m3e-card__action[aria-disabled=true]):before{display:none}:where(.m3e-filter-chip):has(>.m3e-filter-chip__input:focus-visible):before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-filter-chip):has(>.m3e-filter-chip__input:disabled):before{display:none}:where(.m3e-search__result)[data-focus-visible]:before{--_m3e-state-layer-opacity: var(--m3e-sys-state-focus-state-layer-opacity)}:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive,.m3e-checkbox__state,.m3e-radio-button__state,.m3e-switch__state)[data-ripple][data-pressed]:before{--_m3e-ripple-opacity: calc( var(--_m3e-state-layer-opacity) + var(--m3e-sys-state-pressed-state-layer-opacity) - var(--_m3e-state-layer-opacity) * var(--m3e-sys-state-pressed-state-layer-opacity) );--_m3e-ripple-size: var(--_m3e-ripple-radius, 100%);background:radial-gradient(circle at var(--_m3e-ripple-x, 50%) var(--_m3e-ripple-y, 50%),var(--m3e-comp-state-layer-color, currentcolor) var(--_m3e-ripple-size),color-mix(in srgb,var(--m3e-comp-state-layer-color, currentcolor) calc(var(--_m3e-state-layer-opacity) / var(--_m3e-ripple-opacity) * 100%),transparent) var(--_m3e-ripple-size));opacity:var(--_m3e-ripple-opacity);transition:none;animation:m3e-ripple-grow var(--m3e-sys-motion-spring-default-effects-duration) var(--m3e-sys-motion-spring-default-effects-easing) both}@media(forced-colors:active){:where(.m3e-state-layer,.m3e-button,.m3e-icon-button,.m3e-card--interactive,.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip,.m3e-fab,.m3e-extended-fab,.m3e-navigation-item__state,.m3e-navigation-drawer-item,.m3e-tab,.m3e-menu__item,.m3e-fab-menu__item,.m3e-search__result,.m3e-list-item--interactive,.m3e-checkbox__state,.m3e-radio-button__state,.m3e-switch__state):before{display:none}}}
package/dist/suggestion-chip.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/chips.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@import"@kyralabs/m3e-tokens/components/elevation-motion.css";@import"@kyralabs/m3e-tokens/components/suggestion-chip.css";@import"@kyralabs/m3e-tokens/components/chips-defaults.css";@property --_m3e-chip-shape{syntax: "<length-percentage>"; inherits: false; initial-value: 0%;}@layer m3e.components{:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip){--_m3e-chip-outline: inset 0 0 0 var(--_m3e-chip-outline-width) var(--_m3e-chip-outline-color);--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-outgoing-duration-hovered);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-outgoing-easing);--m3e-comp-state-layer-color: var(--_m3e-chip-state-layer);display:inline-flex;align-items:center;box-sizing:border-box;min-block-size:var(--_m3e-chip-height);margin:0;padding-block:0;padding-inline:var(--_m3e-chip-padding-start) var(--_m3e-chip-padding-end);border:none;border-radius:var(--_m3e-chip-shape);background-color:var(--_m3e-chip-container);box-shadow:var(--_m3e-chip-shadow);color:var(--_m3e-chip-label);font-family:var(--_m3e-chip-font);font-size:var(--_m3e-chip-font-size);font-weight:var(--_m3e-chip-font-weight);line-height:var(--_m3e-chip-line-height);letter-spacing:var(--_m3e-chip-tracking);text-align:start;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:box-shadow var(--_m3e-chip-shadow-duration) var(--_m3e-chip-shadow-easing)}:is(.m3e-filter-chip--expressive,.m3e-input-chip--expressive){transition:box-shadow var(--_m3e-chip-shadow-duration) var(--_m3e-chip-shadow-easing),border-radius var(--m3e-comp-selectable-chip-shape-duration) var(--m3e-comp-selectable-chip-shape-easing)}:is(.m3e-filter-chip--expressive,.m3e-input-chip--expressive)[data-spring]{transition-property:box-shadow}.m3e-input-chip__cell{display:flex;flex:1 1 auto;align-items:center;align-self:stretch;min-inline-size:0}:is(.m3e-assist-chip__label,.m3e-filter-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label){flex:1 1 auto;padding-inline:var(--_m3e-chip-label-start) var(--_m3e-chip-label-end)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip__cell,.m3e-suggestion-chip) .m3e-icon{--m3e-comp-icon-size: var(--_m3e-chip-icon-size);color:var(--_m3e-chip-leading)}:is(.m3e-assist-chip__label,.m3e-filter-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~.m3e-icon,:is(.m3e-assist-chip__label,.m3e-filter-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~* .m3e-icon{color:var(--_m3e-chip-trailing)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip):after{content:"";position:absolute;inset-block:min(0%,calc((var(--_m3e-chip-height) - var(--m3e-comp-minimum-interactive-component-size)) / 2));inset-inline:min(0%,calc((100% - var(--m3e-comp-minimum-interactive-component-size)) / 2))}@media(hover:hover){:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip):hover{--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-hovered)}}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):focus-visible,.m3e-filter-chip:has(>.m3e-filter-chip__input:focus-visible){--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-focused)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:active,[data-pressed]){--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-pressed)}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip)[data-dragged]{--_m3e-chip-shadow-duration: var(--m3e-comp-elevation-incoming-duration);--_m3e-chip-shadow-easing: var(--m3e-comp-elevation-incoming-easing);box-shadow:var(--_m3e-chip-shadow-dragged)}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]),.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled){background-color:var(--_m3e-chip-container-disabled);box-shadow:var(--_m3e-chip-shadow-disabled);color:var(--_m3e-chip-label-disabled);cursor:default;transition:none}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) .m3e-icon,.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled) .m3e-icon{color:var(--_m3e-chip-leading-disabled)}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) :is(.m3e-assist-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~* .m3e-icon,:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) :is(.m3e-assist-chip__label,.m3e-input-chip__label,.m3e-suggestion-chip__label)~.m3e-icon,.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled) .m3e-filter-chip__label~.m3e-icon{color:var(--_m3e-chip-trailing-disabled)}@media(forced-colors:active){:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip,.m3e-suggestion-chip){border:var(--m3e-comp-chips-outline-width-unselected) solid ButtonText}:is(.m3e-assist-chip,.m3e-filter-chip,.m3e-input-chip__cell,.m3e-suggestion-chip) .m3e-icon{color:ButtonText}.m3e-filter-chip:has(>.m3e-filter-chip__input:checked),.m3e-input-chip[aria-selected=true]{border-color:Highlight;outline:var(--m3e-comp-chips-outline-width-unselected) solid Highlight}:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]),:is(.m3e-assist-chip,.m3e-input-chip,.m3e-suggestion-chip):is(:disabled,[aria-disabled=true]) .m3e-icon,.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled),.m3e-filter-chip:has(>.m3e-filter-chip__input:disabled) .m3e-icon{border-color:GrayText;color:GrayText}}}@layer m3e.components{.m3e-suggestion-chip{--_m3e-chip-height: var(--m3e-comp-suggestion-chip-container-height);--_m3e-chip-padding-start: var(--m3e-comp-suggestion-chip-content-padding-horizontal);--_m3e-chip-padding-end: var(--m3e-comp-suggestion-chip-content-padding-horizontal);--_m3e-chip-label-start: var(--m3e-comp-chip-default-horizontal-spacing);--_m3e-chip-label-end: var(--m3e-comp-chip-default-horizontal-spacing);--_m3e-chip-shape: var(--m3e-comp-suggestion-chip-container-shape);--_m3e-chip-icon-size: var(--m3e-comp-suggestion-chip-leading-icon-size);--_m3e-chip-font: var(--m3e-comp-suggestion-chip-label-text-font);--_m3e-chip-font-size: var(--m3e-comp-suggestion-chip-label-text-size);--_m3e-chip-font-weight: var(--m3e-comp-suggestion-chip-label-text-weight);--_m3e-chip-line-height: var(--m3e-comp-suggestion-chip-label-text-line-height);--_m3e-chip-tracking: var(--m3e-comp-suggestion-chip-label-text-tracking);--_m3e-chip-outline-width: var(--m3e-comp-suggestion-chip-flat-outline-width);--_m3e-chip-outline-color: var(--m3e-comp-suggestion-chip-flat-outline-color);--_m3e-chip-container: transparent;--_m3e-chip-shadow: var(--_m3e-chip-outline);--_m3e-chip-shadow-hovered: var(--_m3e-chip-outline);--_m3e-chip-shadow-focused: var(--_m3e-chip-outline);--_m3e-chip-shadow-pressed: var(--_m3e-chip-outline);--_m3e-chip-shadow-dragged: var(--m3e-comp-suggestion-chip-container-shadow-dragged), var(--_m3e-chip-outline);--_m3e-chip-shadow-disabled: inset 0 0 0 var(--m3e-comp-suggestion-chip-flat-outline-width) color-mix( in srgb, var(--m3e-comp-suggestion-chip-flat-outline-color-disabled) calc(var(--m3e-comp-suggestion-chip-flat-outline-opacity-disabled) * 100%), transparent );--_m3e-chip-container-disabled: transparent;--_m3e-chip-label: var(--m3e-comp-suggestion-chip-label-text-color);--_m3e-chip-state-layer: var(--m3e-sys-color-on-surface);--_m3e-chip-leading: var(--m3e-comp-suggestion-chip-leading-icon-color);--_m3e-chip-trailing: var(--m3e-comp-suggestion-chip-leading-icon-color);--_m3e-chip-label-disabled: color-mix( in srgb, var(--m3e-comp-suggestion-chip-label-text-color-disabled) calc(var(--m3e-comp-suggestion-chip-label-text-opacity-disabled) * 100%), transparent );--_m3e-chip-leading-disabled: color-mix( in srgb, var(--m3e-comp-suggestion-chip-leading-icon-color-disabled) calc(var(--m3e-comp-suggestion-chip-leading-icon-opacity-disabled) * 100%), transparent );--_m3e-chip-trailing-disabled: var(--_m3e-chip-leading-disabled)}.m3e-suggestion-chip--elevated{--_m3e-chip-container: var(--m3e-comp-suggestion-chip-elevated-container-color);--_m3e-chip-shadow: var(--m3e-comp-suggestion-chip-elevated-container-shadow);--_m3e-chip-shadow-hovered: var(--m3e-comp-suggestion-chip-elevated-container-shadow-hover);--_m3e-chip-shadow-focused: var(--m3e-comp-suggestion-chip-elevated-container-shadow-focus);--_m3e-chip-shadow-pressed: var(--m3e-comp-suggestion-chip-elevated-container-shadow-pressed);--_m3e-chip-shadow-dragged: var(--m3e-comp-suggestion-chip-container-shadow-dragged);--_m3e-chip-shadow-disabled: var(--m3e-comp-suggestion-chip-elevated-container-shadow-disabled);--_m3e-chip-container-disabled: var( --m3e-comp-suggestion-chip-elevated-disabled-container-color );--_m3e-chip-leading-disabled: var(--m3e-comp-suggestion-chip-elevated-disabled-icon-color);--_m3e-chip-trailing-disabled: var(--m3e-comp-suggestion-chip-elevated-disabled-icon-color)}}
package/dist/switch.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/switch.css";@import"@kyralabs/m3e-tokens/components/switch-defaults.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@layer m3e.components{.m3e-switch{position:relative;display:inline-flex;align-items:center;vertical-align:middle;min-block-size:var(--m3e-comp-minimum-interactive-component-size);cursor:pointer;-webkit-tap-highlight-color:transparent}.m3e-switch__input{appearance:none;position:absolute;inset:0;z-index:1;box-sizing:border-box;inline-size:auto;block-size:auto;margin:0;padding:0;border:0;background:none;opacity:0;cursor:inherit;outline:none}.m3e-switch__track{--_m3e-switch-track: var(--m3e-comp-switch-track-color-unchecked);--_m3e-switch-outline: var(--m3e-comp-switch-track-outline-color-unchecked);--_m3e-switch-handle: var(--m3e-comp-switch-handle-color-unchecked);--_m3e-switch-icon: var(--m3e-comp-switch-icon-color-unchecked);position:relative;flex:none;box-sizing:border-box;inline-size:var(--m3e-comp-switch-track-width);block-size:var(--m3e-comp-switch-track-height);border-radius:var(--m3e-comp-switch-track-shape);background-color:var(--_m3e-switch-track);pointer-events:none}.m3e-switch__track:after{content:"";position:absolute;inset:0;border:var(--m3e-comp-switch-track-outline-width) solid var(--_m3e-switch-outline);border-radius:inherit}.m3e-switch__handle{--_m3e-switch-size: var(--m3e-comp-switch-unchecked-thumb-diameter);--_m3e-switch-offset: calc((var(--m3e-comp-switch-track-height) - var(--_m3e-switch-size)) / 2);--_m3e-switch-press-offset: var(--m3e-comp-switch-track-outline-width);position:absolute;inset-block:0;inset-inline-start:var(--_m3e-switch-offset);display:flex;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--_m3e-switch-size);block-size:var(--_m3e-switch-size);margin-block:auto;border-radius:var(--m3e-comp-switch-handle-shape);background-color:var(--_m3e-switch-handle);transition-property:inset-inline-start,inline-size,block-size;transition-duration:var(--m3e-comp-switch-handle-duration);transition-timing-function:var(--m3e-comp-switch-handle-easing)}.m3e-switch__handle:has(>.m3e-switch__icon:not(.m3e-switch__icon--checked)){--_m3e-switch-size: var(--m3e-comp-switch-thumb-diameter)}.m3e-switch__input:checked~.m3e-switch__track{--_m3e-switch-track: var(--m3e-comp-switch-track-color-checked);--_m3e-switch-outline: var(--m3e-comp-switch-track-outline-color-checked);--_m3e-switch-handle: var(--m3e-comp-switch-handle-color-checked);--_m3e-switch-icon: var(--m3e-comp-switch-icon-color-checked)}.m3e-switch__input:checked~.m3e-switch__track>.m3e-switch__handle{--_m3e-switch-size: var(--m3e-comp-switch-thumb-diameter);--_m3e-switch-offset: calc( var(--m3e-comp-switch-track-width) - var(--m3e-comp-switch-thumb-diameter) - (var(--m3e-comp-switch-track-height) - var(--m3e-comp-switch-thumb-diameter)) / 2 );--_m3e-switch-press-offset: calc( var(--_m3e-switch-offset) - var(--m3e-comp-switch-track-outline-width) )}.m3e-switch__input:enabled:is(:active,.m3e-switch:active>*)~.m3e-switch__track>.m3e-switch__handle,.m3e-switch__input:enabled~.m3e-switch__track>.m3e-switch__handle:has(>.m3e-switch__state[data-pressed]){inset-inline-start:var(--_m3e-switch-press-offset);inline-size:var(--m3e-comp-switch-pressed-thumb-diameter);block-size:var(--m3e-comp-switch-pressed-thumb-diameter);transition-duration:var(--m3e-comp-switch-handle-press-duration)}.m3e-switch__icon{--m3e-comp-icon-size: var(--m3e-comp-switch-icon-size);color:var(--_m3e-switch-icon)}.m3e-switch__input:checked~.m3e-switch__track .m3e-switch__icon--unchecked,.m3e-switch__input:not(:checked)~.m3e-switch__track .m3e-switch__icon--checked{display:none}.m3e-switch:has(>.m3e-switch__input:disabled){cursor:default}.m3e-switch__input:disabled~.m3e-switch__track{--_m3e-switch-track: var(--m3e-comp-switch-track-color-unchecked-disabled);--_m3e-switch-outline: var(--m3e-comp-switch-track-outline-color-unchecked-disabled);--_m3e-switch-handle: var(--m3e-comp-switch-handle-color-unchecked-disabled);--_m3e-switch-icon: var(--m3e-comp-switch-icon-color-unchecked-disabled)}.m3e-switch__input:disabled:checked~.m3e-switch__track{--_m3e-switch-track: var(--m3e-comp-switch-track-color-checked-disabled);--_m3e-switch-outline: var(--m3e-comp-switch-track-outline-color-checked-disabled);--_m3e-switch-handle: var(--m3e-comp-switch-handle-color-checked-disabled);--_m3e-switch-icon: var(--m3e-comp-switch-icon-color-checked-disabled)}.m3e-switch__state{--m3e-comp-state-layer-color: var(--m3e-comp-switch-state-layer-color);position:absolute;inset-block-start:50%;inset-inline-start:50%;inline-size:var(--m3e-comp-switch-state-layer-size);block-size:var(--m3e-comp-switch-state-layer-size);margin-block-start:calc(var(--m3e-comp-switch-state-layer-size) / 2 * -1);margin-inline-start:calc(var(--m3e-comp-switch-state-layer-size) / 2 * -1);border-radius:var(--m3e-comp-switch-state-layer-shape);pointer-events:none}.m3e-switch__state:before{--_m3e-ripple-x: 50%;--_m3e-ripple-y: 50%;--_m3e-ripple-radius: calc(var(--m3e-comp-switch-state-layer-size) / 2)}.m3e-switch__label{position:relative;z-index:2;font-family:var(--m3e-comp-switch-label-text-font);font-size:var(--m3e-comp-switch-label-text-size);font-weight:var(--m3e-comp-switch-label-text-weight);line-height:var(--m3e-comp-switch-label-text-line-height);letter-spacing:var(--m3e-comp-switch-label-text-tracking)}.m3e-switch__track~.m3e-switch__label{margin-inline-start:var(--m3e-comp-switch-label-space)}.m3e-switch__label:first-child{margin-inline-end:var(--m3e-comp-switch-label-space)}@media(forced-colors:active){.m3e-switch{--m3e-comp-switch-track-color-unchecked: Canvas;--m3e-comp-switch-track-outline-color-unchecked: CanvasText;--m3e-comp-switch-handle-color-unchecked: CanvasText;--m3e-comp-switch-icon-color-unchecked: Canvas;--m3e-comp-switch-track-color-checked: Highlight;--m3e-comp-switch-track-outline-color-checked: Highlight;--m3e-comp-switch-handle-color-checked: HighlightText;--m3e-comp-switch-icon-color-checked: Highlight;--m3e-comp-switch-track-color-unchecked-disabled: Canvas;--m3e-comp-switch-track-outline-color-unchecked-disabled: GrayText;--m3e-comp-switch-handle-color-unchecked-disabled: GrayText;--m3e-comp-switch-icon-color-unchecked-disabled: Canvas;--m3e-comp-switch-track-color-checked-disabled: GrayText;--m3e-comp-switch-track-outline-color-checked-disabled: GrayText;--m3e-comp-switch-handle-color-checked-disabled: Canvas;--m3e-comp-switch-icon-color-checked-disabled: GrayText}.m3e-switch__track,.m3e-switch__icon{forced-color-adjust:none}}}
package/dist/text-field.css ADDED
@@ -0,0 +1 @@
1
+ @import"@kyralabs/m3e-tokens/components/filled-text-field.css";@import"@kyralabs/m3e-tokens/components/outlined-text-field.css";@import"@kyralabs/m3e-tokens/components/text-field-defaults.css";@import"@kyralabs/m3e-tokens/components/button-defaults.css";@import"@kyralabs/m3e-tokens/components/small-icon-button.css";@property --_m3e-text-field-progress{syntax: "<number>"; inherits: true; initial-value: 0;}@property --_m3e-text-field-indicator-width{syntax: "<length>"; inherits: true; initial-value: 0;}@layer m3e.components{.m3e-text-field{--_m3e-text-field-text: var(--m3e-comp-text-field-filled-text-color);--_m3e-text-field-container: var(--m3e-comp-text-field-filled-container-color);--_m3e-text-field-indicator: var(--m3e-comp-text-field-filled-indicator-color);--_m3e-text-field-leading: var(--m3e-comp-text-field-filled-leading-icon-color);--_m3e-text-field-trailing: var(--m3e-comp-text-field-filled-trailing-icon-color);--_m3e-text-field-label: var(--m3e-comp-text-field-filled-label-color);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-filled-placeholder-color);--_m3e-text-field-supporting: var(--m3e-comp-text-field-filled-supporting-color);--_m3e-text-field-prefix: var(--m3e-comp-text-field-filled-prefix-color);--_m3e-text-field-suffix: var(--m3e-comp-text-field-filled-suffix-color);--_m3e-text-field-cursor: var(--m3e-comp-text-field-filled-cursor-color);--_m3e-text-field-indicator-width: var(--m3e-comp-text-field-indicator-thickness);--_m3e-text-field-indicator-duration: var(--m3e-comp-text-field-indicator-width-duration);--_m3e-text-field-color-duration: var(--m3e-comp-text-field-indicator-color-duration);--_m3e-text-field-label-duration: var(--m3e-comp-text-field-label-duration);--_m3e-text-field-has-leading: 0;--_m3e-text-field-has-trailing: 0;--_m3e-text-field-leading-width: calc( var(--m3e-comp-minimum-interactive-component-size) * var(--_m3e-text-field-has-leading) );--_m3e-text-field-trailing-width: calc( var(--m3e-comp-minimum-interactive-component-size) * var(--_m3e-text-field-has-trailing) );--_m3e-text-field-start: calc( var(--m3e-comp-text-field-padding) - var(--m3e-comp-text-field-icon-padding) * var(--_m3e-text-field-has-leading) );--_m3e-text-field-end: calc( var(--m3e-comp-text-field-padding) - var(--m3e-comp-text-field-icon-padding) * var(--_m3e-text-field-has-trailing) );--_m3e-text-field-top: var(--m3e-comp-text-field-padding);--_m3e-text-field-bottom: var(--m3e-comp-text-field-padding);--_m3e-text-field-progress: 0;--_m3e-text-field-p: var(--_m3e-text-field-progress);--_m3e-text-field-label-size: calc( var(--m3e-comp-text-field-label-expanded-size) + ( var(--m3e-comp-text-field-label-minimized-size) - var(--m3e-comp-text-field-label-expanded-size) ) * var(--_m3e-text-field-p) );--_m3e-text-field-label-line-height: calc( var(--m3e-comp-text-field-label-expanded-line-height) + ( var(--m3e-comp-text-field-label-minimized-line-height) - var(--m3e-comp-text-field-label-expanded-line-height) ) * var(--_m3e-text-field-p) );--_m3e-text-field-label-tracking: calc( var(--m3e-comp-text-field-label-expanded-tracking) + ( var(--m3e-comp-text-field-label-minimized-tracking) - var(--m3e-comp-text-field-label-expanded-tracking) ) * var(--_m3e-text-field-p) );--_m3e-text-field-label-y0: calc( var(--m3e-comp-text-field-label-vertical-padding) + var(--m3e-comp-text-field-cutout-label-space) );--_m3e-text-field-label-y1: var(--m3e-comp-text-field-label-vertical-padding);--_m3e-text-field-label-x0: calc( var(--_m3e-text-field-leading-width) + var(--_m3e-text-field-start) );--_m3e-text-field-label-x1: var(--_m3e-text-field-label-x0);--_m3e-text-field-label-end0: calc( var(--_m3e-text-field-trailing-width) + var(--_m3e-text-field-end) );--_m3e-text-field-label-end1: var(--_m3e-text-field-label-end0);position:relative;display:inline-flex;flex-direction:column;box-sizing:border-box;min-inline-size:var(--m3e-comp-text-field-min-width);vertical-align:top;transition:--_m3e-text-field-progress var(--_m3e-text-field-label-duration) var(--m3e-comp-text-field-label-easing),--_m3e-text-field-indicator-width var(--_m3e-text-field-indicator-duration) var(--m3e-comp-text-field-indicator-width-easing);-webkit-tap-highlight-color:transparent}.m3e-text-field:has(.m3e-text-field__leading){--_m3e-text-field-has-leading: 1}.m3e-text-field:has(.m3e-text-field__trailing){--_m3e-text-field-has-trailing: 1}.m3e-text-field:has(.m3e-text-field__input:is(:focus,:not(:placeholder-shown),:autofill)){--_m3e-text-field-progress: 1}.m3e-text-field:not(.m3e-text-field--outlined,.m3e-text-field--label-above):has(.m3e-text-field__label){--_m3e-text-field-top: calc( var(--m3e-comp-text-field-label-vertical-padding) + var(--m3e-comp-text-field-label-minimized-line-height) );--_m3e-text-field-bottom: var(--m3e-comp-text-field-label-vertical-padding)}.m3e-text-field:has(.m3e-text-field__input:focus){--_m3e-text-field-text: var(--m3e-comp-text-field-filled-text-color-focused);--_m3e-text-field-container: var(--m3e-comp-text-field-filled-container-color-focused);--_m3e-text-field-indicator: var(--m3e-comp-text-field-filled-indicator-color-focused);--_m3e-text-field-leading: var(--m3e-comp-text-field-filled-leading-icon-color-focused);--_m3e-text-field-trailing: var(--m3e-comp-text-field-filled-trailing-icon-color-focused);--_m3e-text-field-label: var(--m3e-comp-text-field-filled-label-color-focused);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-filled-placeholder-color-focused);--_m3e-text-field-supporting: var(--m3e-comp-text-field-filled-supporting-color-focused);--_m3e-text-field-prefix: var(--m3e-comp-text-field-filled-prefix-color-focused);--_m3e-text-field-suffix: var(--m3e-comp-text-field-filled-suffix-color-focused);--_m3e-text-field-indicator-width: var(--m3e-comp-text-field-indicator-thickness-focused)}.m3e-text-field:has(.m3e-text-field__input[aria-invalid=true]){--_m3e-text-field-text: var(--m3e-comp-text-field-filled-text-color-error);--_m3e-text-field-container: var(--m3e-comp-text-field-filled-container-color-error);--_m3e-text-field-indicator: var(--m3e-comp-text-field-filled-indicator-color-error);--_m3e-text-field-leading: var(--m3e-comp-text-field-filled-leading-icon-color-error);--_m3e-text-field-trailing: var(--m3e-comp-text-field-filled-trailing-icon-color-error);--_m3e-text-field-label: var(--m3e-comp-text-field-filled-label-color-error);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-filled-placeholder-color-error);--_m3e-text-field-supporting: var(--m3e-comp-text-field-filled-supporting-color-error);--_m3e-text-field-prefix: var(--m3e-comp-text-field-filled-prefix-color-error);--_m3e-text-field-suffix: var(--m3e-comp-text-field-filled-suffix-color-error);--_m3e-text-field-cursor: var(--m3e-comp-text-field-filled-cursor-color-error)}.m3e-text-field:has(.m3e-text-field__input:disabled){--_m3e-text-field-text: var(--m3e-comp-text-field-filled-text-color-disabled);--_m3e-text-field-container: var(--m3e-comp-text-field-filled-container-color-disabled);--_m3e-text-field-indicator: var(--m3e-comp-text-field-filled-indicator-color-disabled);--_m3e-text-field-leading: var(--m3e-comp-text-field-filled-leading-icon-color-disabled);--_m3e-text-field-trailing: var(--m3e-comp-text-field-filled-trailing-icon-color-disabled);--_m3e-text-field-label: var(--m3e-comp-text-field-filled-label-color-disabled);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-filled-placeholder-color-disabled);--_m3e-text-field-supporting: var(--m3e-comp-text-field-filled-supporting-color-disabled);--_m3e-text-field-prefix: var(--m3e-comp-text-field-filled-prefix-color-disabled);--_m3e-text-field-suffix: var(--m3e-comp-text-field-filled-suffix-color-disabled);--_m3e-text-field-indicator-width: var(--m3e-comp-text-field-indicator-thickness);--_m3e-text-field-indicator-duration: calc(var(--m3e-comp-text-field-label-duration) * 0);--_m3e-text-field-color-duration: calc(var(--m3e-comp-text-field-label-duration) * 0)}.m3e-text-field--outlined{--_m3e-text-field-text: var(--m3e-comp-text-field-outlined-text-color);--_m3e-text-field-container: var(--m3e-comp-text-field-outlined-container-color);--_m3e-text-field-indicator: var(--m3e-comp-text-field-outlined-indicator-color);--_m3e-text-field-leading: var(--m3e-comp-text-field-outlined-leading-icon-color);--_m3e-text-field-trailing: var(--m3e-comp-text-field-outlined-trailing-icon-color);--_m3e-text-field-label: var(--m3e-comp-text-field-outlined-label-color);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-outlined-placeholder-color);--_m3e-text-field-supporting: var(--m3e-comp-text-field-outlined-supporting-color);--_m3e-text-field-prefix: var(--m3e-comp-text-field-outlined-prefix-color);--_m3e-text-field-suffix: var(--m3e-comp-text-field-outlined-suffix-color);--_m3e-text-field-cursor: var(--m3e-comp-text-field-outlined-cursor-color);--_m3e-text-field-indicator-width: var(--m3e-comp-text-field-outline-thickness);--_m3e-text-field-label-y0: var(--m3e-comp-text-field-padding);--_m3e-text-field-label-y1: calc(var(--_m3e-text-field-label-line-height) / 2 * -1);--_m3e-text-field-label-x1: var(--m3e-comp-text-field-padding);--_m3e-text-field-label-end1: var(--m3e-comp-text-field-padding);min-inline-size:var(--m3e-comp-text-field-outlined-min-width)}.m3e-text-field--outlined:has(.m3e-text-field__input:focus){--_m3e-text-field-text: var(--m3e-comp-text-field-outlined-text-color-focused);--_m3e-text-field-container: var(--m3e-comp-text-field-outlined-container-color-focused);--_m3e-text-field-indicator: var(--m3e-comp-text-field-outlined-indicator-color-focused);--_m3e-text-field-leading: var(--m3e-comp-text-field-outlined-leading-icon-color-focused);--_m3e-text-field-trailing: var(--m3e-comp-text-field-outlined-trailing-icon-color-focused);--_m3e-text-field-label: var(--m3e-comp-text-field-outlined-label-color-focused);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-outlined-placeholder-color-focused);--_m3e-text-field-supporting: var(--m3e-comp-text-field-outlined-supporting-color-focused);--_m3e-text-field-prefix: var(--m3e-comp-text-field-outlined-prefix-color-focused);--_m3e-text-field-suffix: var(--m3e-comp-text-field-outlined-suffix-color-focused);--_m3e-text-field-indicator-width: var(--m3e-comp-text-field-outline-thickness-focused)}.m3e-text-field--outlined:has(.m3e-text-field__input[aria-invalid=true]){--_m3e-text-field-text: var(--m3e-comp-text-field-outlined-text-color-error);--_m3e-text-field-container: var(--m3e-comp-text-field-outlined-container-color-error);--_m3e-text-field-indicator: var(--m3e-comp-text-field-outlined-indicator-color-error);--_m3e-text-field-leading: var(--m3e-comp-text-field-outlined-leading-icon-color-error);--_m3e-text-field-trailing: var(--m3e-comp-text-field-outlined-trailing-icon-color-error);--_m3e-text-field-label: var(--m3e-comp-text-field-outlined-label-color-error);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-outlined-placeholder-color-error);--_m3e-text-field-supporting: var(--m3e-comp-text-field-outlined-supporting-color-error);--_m3e-text-field-prefix: var(--m3e-comp-text-field-outlined-prefix-color-error);--_m3e-text-field-suffix: var(--m3e-comp-text-field-outlined-suffix-color-error);--_m3e-text-field-cursor: var(--m3e-comp-text-field-outlined-cursor-color-error)}.m3e-text-field--outlined:has(.m3e-text-field__input:disabled){--_m3e-text-field-text: var(--m3e-comp-text-field-outlined-text-color-disabled);--_m3e-text-field-container: var(--m3e-comp-text-field-outlined-container-color-disabled);--_m3e-text-field-indicator: var(--m3e-comp-text-field-outlined-indicator-color-disabled);--_m3e-text-field-leading: var(--m3e-comp-text-field-outlined-leading-icon-color-disabled);--_m3e-text-field-trailing: var(--m3e-comp-text-field-outlined-trailing-icon-color-disabled);--_m3e-text-field-label: var(--m3e-comp-text-field-outlined-label-color-disabled);--_m3e-text-field-placeholder: var(--m3e-comp-text-field-outlined-placeholder-color-disabled);--_m3e-text-field-supporting: var(--m3e-comp-text-field-outlined-supporting-color-disabled);--_m3e-text-field-prefix: var(--m3e-comp-text-field-outlined-prefix-color-disabled);--_m3e-text-field-suffix: var(--m3e-comp-text-field-outlined-suffix-color-disabled);--_m3e-text-field-indicator-width: var(--m3e-comp-text-field-outline-thickness)}.m3e-text-field--outlined:not(.m3e-text-field--label-above):has(.m3e-text-field__label){padding-block-start:var(--m3e-comp-text-field-cutout-label-space)}.m3e-text-field--label-above{--_m3e-text-field-progress: 1;--_m3e-text-field-label-y0: calc( ( var(--m3e-comp-text-field-label-minimized-line-height) + var(--m3e-comp-text-field-above-label-bottom-padding) ) * -1 );--_m3e-text-field-label-y1: var(--_m3e-text-field-label-y0);--_m3e-text-field-label-x0: var(--m3e-comp-text-field-above-label-horizontal-padding);--_m3e-text-field-label-x1: var(--_m3e-text-field-label-x0);--_m3e-text-field-label-end0: var(--m3e-comp-text-field-above-label-horizontal-padding);--_m3e-text-field-label-end1: var(--_m3e-text-field-label-end0);--_m3e-text-field-label-duration: calc(var(--m3e-comp-text-field-label-duration) * 0)}.m3e-text-field--label-above:has(.m3e-text-field__label){padding-block-start:calc(var(--m3e-comp-text-field-label-minimized-line-height) + var(--m3e-comp-text-field-above-label-bottom-padding))}.m3e-text-field__container{position:relative;display:grid;grid-template-columns:[leading] auto [prefix] auto [input] minmax(0,1fr) [suffix] auto [trailing] auto;align-items:start;box-sizing:border-box;min-block-size:var(--m3e-comp-text-field-min-height);border-start-start-radius:var(--m3e-comp-filled-text-field-container-shape-start-start);border-start-end-radius:var(--m3e-comp-filled-text-field-container-shape-start-end);border-end-end-radius:var(--m3e-comp-filled-text-field-container-shape-end-end);border-end-start-radius:var(--m3e-comp-filled-text-field-container-shape-end-start);background-color:var(--_m3e-text-field-container);cursor:text;transition:background-color var(--m3e-comp-text-field-container-color-duration) var(--m3e-comp-text-field-container-color-easing)}.m3e-text-field:not(.m3e-text-field--outlined)>.m3e-text-field__container:after{content:"";position:absolute;inset-inline:0;inset-block-end:0;border-block-end:var(--_m3e-text-field-indicator-width) solid var(--_m3e-text-field-indicator);border-end-start-radius:inherit;border-end-end-radius:inherit;pointer-events:none;transition:border-block-end-color var(--_m3e-text-field-color-duration) var(--m3e-comp-text-field-indicator-color-easing)}.m3e-text-field--outlined>.m3e-text-field__container{min-block-size:var(--m3e-comp-text-field-outlined-min-height);border-radius:var(--m3e-comp-outlined-text-field-container-shape)}.m3e-text-field__outline{position:absolute;inset:0;box-sizing:border-box;min-inline-size:0;margin:0;padding-block:0;padding-inline:calc(var(--m3e-comp-text-field-padding) - var(--m3e-comp-text-field-cutout-padding) - var(--_m3e-text-field-indicator-width)) 0;border:var(--_m3e-text-field-indicator-width) solid var(--_m3e-text-field-indicator);border-radius:inherit;pointer-events:none;transition:border-color var(--_m3e-text-field-color-duration) var(--m3e-comp-text-field-indicator-color-easing)}.m3e-text-field:not(.m3e-text-field--label-above) .m3e-text-field__outline:has(>.m3e-text-field__notch){inset-block-start:calc((var(--_m3e-text-field-indicator-width) - var(--m3e-comp-text-field-label-minimized-line-height)) / 2)}.m3e-text-field__notch{display:block;block-size:var(--m3e-comp-text-field-label-minimized-line-height);max-inline-size:100%;padding-block:0;padding-inline:calc(var(--m3e-comp-text-field-cutout-padding) * max(sign(var(--_m3e-text-field-p)),0));overflow:hidden;font-family:var(--m3e-comp-text-field-label-expanded-font);font-size:calc(var(--_m3e-text-field-label-size) * max(var(--_m3e-text-field-p),0));font-weight:var(--m3e-comp-text-field-label-expanded-weight);line-height:var(--m3e-comp-text-field-label-minimized-line-height);letter-spacing:calc(var(--_m3e-text-field-label-tracking) * max(var(--_m3e-text-field-p),0));white-space:nowrap;visibility:hidden}.m3e-text-field--label-above .m3e-text-field__notch{display:none}.m3e-text-field__label{--_m3e-text-field-label-x: calc( var(--_m3e-text-field-label-x0) + (var(--_m3e-text-field-label-x1) - var(--_m3e-text-field-label-x0)) * var(--_m3e-text-field-p) );--_m3e-text-field-label-end: calc( var(--_m3e-text-field-label-end0) + (var(--_m3e-text-field-label-end1) - var(--_m3e-text-field-label-end0)) * var(--_m3e-text-field-p) );position:absolute;z-index:1;inset-block-start:calc(var(--_m3e-text-field-label-y0) + (var(--_m3e-text-field-label-y1) - var(--_m3e-text-field-label-y0)) * var(--_m3e-text-field-p));inset-inline-start:var(--_m3e-text-field-label-x);box-sizing:border-box;max-inline-size:calc(100% - var(--_m3e-text-field-label-x) - var(--_m3e-text-field-label-end));overflow:hidden;font-family:var(--m3e-comp-text-field-label-expanded-font);font-size:var(--_m3e-text-field-label-size);font-weight:var(--m3e-comp-text-field-label-expanded-weight);line-height:var(--_m3e-text-field-label-line-height);letter-spacing:var(--_m3e-text-field-label-tracking);color:var(--_m3e-text-field-label);white-space:nowrap;text-overflow:ellipsis;cursor:inherit;transition:color var(--m3e-comp-text-field-label-color-duration) var(--m3e-comp-text-field-label-color-easing)}.m3e-text-field:has(.m3e-text-field__input:is(:required,[aria-required=true])) :is(.m3e-text-field__label,.m3e-text-field__notch>span):after{content:"*"}.m3e-text-field__leading,.m3e-text-field__trailing{display:grid;place-items:center;align-self:center;inline-size:var(--m3e-comp-minimum-interactive-component-size);block-size:var(--m3e-comp-minimum-interactive-component-size);cursor:default}.m3e-text-field__leading{grid-column:leading;color:var(--_m3e-text-field-leading)}.m3e-text-field__trailing{grid-column:trailing;color:var(--_m3e-text-field-trailing)}.m3e-text-field__leading>.m3e-icon{--m3e-comp-icon-size: var(--m3e-comp-filled-text-field-leading-icon-size)}.m3e-text-field__trailing>.m3e-icon{--m3e-comp-icon-size: var(--m3e-comp-filled-text-field-trailing-icon-size)}.m3e-text-field--outlined .m3e-text-field__leading>.m3e-icon{--m3e-comp-icon-size: var(--m3e-comp-outlined-text-field-leading-icon-size)}.m3e-text-field--outlined .m3e-text-field__trailing>.m3e-icon{--m3e-comp-icon-size: var(--m3e-comp-outlined-text-field-trailing-icon-size)}.m3e-text-field__input,.m3e-text-field__prefix,.m3e-text-field__suffix{box-sizing:border-box;min-block-size:calc(var(--_m3e-text-field-top) + var(--m3e-comp-text-field-min-text-line-height) + var(--_m3e-text-field-bottom));padding-block:var(--_m3e-text-field-top) var(--_m3e-text-field-bottom)}.m3e-text-field__prefix,.m3e-text-field__suffix{font-family:var(--m3e-comp-text-field-affix-font);font-size:var(--m3e-comp-text-field-affix-size);font-weight:var(--m3e-comp-text-field-affix-weight);line-height:var(--m3e-comp-text-field-affix-line-height);letter-spacing:var(--m3e-comp-text-field-affix-tracking);white-space:nowrap;transition:opacity var(--m3e-comp-text-field-affix-alpha-duration) var(--m3e-comp-text-field-affix-alpha-easing)}.m3e-text-field__prefix{grid-column:prefix;padding-inline:var(--_m3e-text-field-start) var(--m3e-comp-text-field-affix-padding);color:var(--_m3e-text-field-prefix)}.m3e-text-field__suffix{grid-column:suffix;padding-inline:var(--m3e-comp-text-field-affix-padding) var(--_m3e-text-field-end);color:var(--_m3e-text-field-suffix)}.m3e-text-field__input{grid-column:input;appearance:none;inline-size:100%;min-inline-size:0;margin:0;padding-inline:var(--_m3e-text-field-start) var(--_m3e-text-field-end);border:0;border-radius:0;outline:none;background:none;font-family:var(--m3e-comp-filled-text-field-input-font);font-size:var(--m3e-comp-filled-text-field-input-size);font-weight:var(--m3e-comp-filled-text-field-input-weight);line-height:var(--m3e-comp-filled-text-field-input-line-height);letter-spacing:var(--m3e-comp-filled-text-field-input-tracking);color:var(--_m3e-text-field-text);caret-color:var(--_m3e-text-field-cursor);text-overflow:ellipsis}.m3e-text-field--outlined .m3e-text-field__input{font-family:var(--m3e-comp-outlined-text-field-input-font);font-size:var(--m3e-comp-outlined-text-field-input-size);font-weight:var(--m3e-comp-outlined-text-field-input-weight);line-height:var(--m3e-comp-outlined-text-field-input-line-height);letter-spacing:var(--m3e-comp-outlined-text-field-input-tracking)}.m3e-text-field__prefix~.m3e-text-field__input{padding-inline-start:0}.m3e-text-field__input:has(~.m3e-text-field__suffix){padding-inline-end:0}.m3e-text-field__input::selection{background-color:var(--m3e-comp-text-field-selection-color)}.m3e-text-field__input:disabled{cursor:default}textarea.m3e-text-field__input{display:block;field-sizing:content;resize:none}@supports not (field-sizing: content){textarea.m3e-text-field__input{resize:vertical}}.m3e-text-field__input::placeholder{font-family:var(--m3e-comp-text-field-placeholder-font);font-size:var(--m3e-comp-text-field-placeholder-size);font-weight:var(--m3e-comp-text-field-placeholder-weight);line-height:var(--m3e-comp-text-field-placeholder-line-height);letter-spacing:var(--m3e-comp-text-field-placeholder-tracking);color:var(--_m3e-text-field-placeholder);opacity:1;transition:opacity var(--m3e-comp-text-field-placeholder-in-duration) var(--m3e-comp-text-field-placeholder-in-easing)}.m3e-text-field:not(.m3e-text-field--label-above):has(.m3e-text-field__label):not(:has(.m3e-text-field__input:focus)) .m3e-text-field__input::placeholder{opacity:0;transition:opacity var(--m3e-comp-text-field-placeholder-out-duration) var(--m3e-comp-text-field-placeholder-out-easing)}.m3e-text-field:not(.m3e-text-field--label-above):has(.m3e-text-field__label):not(:has(.m3e-text-field__input:is(:focus,:not(:placeholder-shown),:autofill))) :is(.m3e-text-field__prefix,.m3e-text-field__suffix){opacity:0}.m3e-text-field__supporting{display:flex;box-sizing:border-box;min-block-size:calc(var(--m3e-comp-text-field-supporting-top-padding) + var(--m3e-comp-text-field-min-supporting-line-height));padding-block:var(--m3e-comp-text-field-supporting-top-padding) 0;padding-inline:var(--m3e-comp-text-field-padding);font-family:var(--m3e-comp-text-field-supporting-font);font-size:var(--m3e-comp-text-field-supporting-size);font-weight:var(--m3e-comp-text-field-supporting-weight);line-height:var(--m3e-comp-text-field-supporting-line-height);letter-spacing:var(--m3e-comp-text-field-supporting-tracking);color:var(--_m3e-text-field-supporting)}.m3e-text-field__supporting-text{flex:1;min-inline-size:0}.m3e-text-field__counter{flex:none;margin-inline-start:auto;padding-inline-start:var(--m3e-comp-text-field-counter-space)}.m3e-text-field__a11y{position:absolute;inline-size:0;block-size:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(forced-colors:active){.m3e-text-field{--_m3e-text-field-indicator: CanvasText;--_m3e-text-field-label: CanvasText}.m3e-text-field:has(.m3e-text-field__input:focus){--_m3e-text-field-indicator: Highlight;--_m3e-text-field-label: Highlight}.m3e-text-field:has(.m3e-text-field__input:disabled){--_m3e-text-field-indicator: GrayText;--_m3e-text-field-label: GrayText;--_m3e-text-field-text: GrayText;--_m3e-text-field-supporting: GrayText}.m3e-text-field:not(.m3e-text-field--outlined)>.m3e-text-field__container{outline:var(--m3e-comp-text-field-indicator-thickness) solid transparent;outline-offset:calc(var(--m3e-comp-text-field-indicator-thickness) * -1)}.m3e-text-field__container:after,.m3e-text-field__outline,.m3e-text-field__label{forced-color-adjust:none}}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kyralabs/m3e-css",
3
- "version": "1.5.0",
3
+ "version": "1.6.0",
4
4
  "description": "Framework-free Material 3 Expressive component classes. No JavaScript.",
5
5
  "keywords": [
6
6
  "material-design",
@@ -40,7 +40,7 @@
40
40
  "provenance": true
41
41
  },
42
42
  "dependencies": {
43
- "@kyralabs/m3e-tokens": "^1.5.0"
43
+ "@kyralabs/m3e-tokens": "^1.6.0"
44
44
  },
45
45
  "scripts": {
46
46
  "build": "node ../../tools/build-css.js"