@pg-labs-incubator/cobweb 0.0.2 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@cw-attribute-roles cw-TextField;@property --_CW-FIELD-LABEL_PROGRESS{syntax: "<number>"; inherits: true; initial-value: 1;}@property --_CW-FIELD-LABEL_FLOATED{syntax: "<number>"; inherits: true; initial-value: 1;}@property --_CW-FIELD-LABEL_RESTED{syntax: "<number>"; inherits: true; initial-value: 0;}@layer cw-style{.cw-TextField{--_cw-field-affix-color: cw-var(--cw-TextField-input-affixColor);--_cw-field-caret-color: cw-var(--cw-TextField-input-caretColor);--_cw-field-container-color: cw-var(--cw-TextField-container-color);--_cw-field-height: cw-var(--cw-TextField-container-height);--_cw-field-icon-size: cw-var(--cw-TextField-icon-size);--_cw-field-indicator-color: cw-var(--cw-TextField-indicator-color);--_cw-field-indicator-focus-opacity: 0;--_cw-field-indicator-focus-thickness: cw-var(--cw-TextField-focus-indicatorThickness);--_cw-field-indicator-thickness: cw-var(--cw-TextField-indicator-thickness);--_cw-field-input-color: cw-var(--cw-TextField-input-color);--_cw-field-label-color: cw-var(--cw-TextField-label-color);--_cw-field-leading-color: cw-var(--cw-TextField-icon-leadingColor);--_cw-field-menu-color: cw-var(--cw-TextField-menu-color);--_cw-field-menu-elevation: cw-var(--cw-TextField-menu-elevation);--_cw-field-menu-item-height: cw-var(--cw-TextField-menu-itemHeight);--_cw-field-menu-item-label-color: cw-var(--cw-TextField-menu-itemLabelColor);--_cw-field-menu-item-padding: cw-var(--cw-TextField-menu-itemPadding);--_cw-field-menu-item-state-layer-color: cw-var(--cw-TextField-menu-itemStateLayerColor);--_cw-field-menu-shadow-color: cw-var(--cw-TextField-menu-shadowColor);--_cw-field-menu-shape: cw-var(--cw-TextField-menu-shape);--_cw-field-padding: cw-var(--cw-TextField-container-padding);--_cw-field-placeholder-color: cw-var(--cw-TextField-input-placeholderColor);--_cw-field-state-layer-color: transparent;--_cw-field-state-layer-opacity: cw-var(--cw-TextField-hover-stateLayerOpacity);--_cw-field-supporting-color: cw-var(--cw-TextField-supportingText-color);--_cw-field-trailing-color: cw-var(--cw-TextField-icon-trailingColor);-cw-border-radius:--cw-TextField-container-shape}.cw-TextField:where(:has(>.cw-TextField-control:hover)){--_cw-field-indicator-color: cw-var(--cw-TextField-hover-indicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-hover-labelColor);--_cw-field-state-layer-color: cw-var(--cw-TextField-hover-stateLayerColor)}.cw-TextField:where(:has(.cw-TextField-input:focus)){--_cw-field-indicator-color: cw-var(--cw-TextField-focus-indicatorColor);--_cw-field-indicator-focus-opacity: 1;--_cw-field-label-color: cw-var(--cw-TextField-focus-labelColor);--_cw-field-trailing-color: cw-var(--cw-TextField-focus-trailingIconColor)}.cw-TextField:where(.cw-TextField-error){--_cw-field-caret-color: cw-var(--cw-TextField-error-caretColor);--_cw-field-indicator-color: cw-var(--cw-TextField-error-indicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-error-labelColor);--_cw-field-supporting-color: cw-var(--cw-TextField-error-supportingTextColor);--_cw-field-trailing-color: cw-var(--cw-TextField-error-trailingIconColor)}.cw-TextField:where(.cw-TextField-error:has(>.cw-TextField-control:hover)){--_cw-field-indicator-color: cw-var(--cw-TextField-error-hoverIndicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-error-hoverLabelColor);--_cw-field-trailing-color: cw-var(--cw-TextField-error-hoverTrailingIconColor)}.cw-TextField:where(.cw-TextField-error:has(.cw-TextField-input:focus)){--_cw-field-indicator-color: cw-var(--cw-TextField-error-indicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-error-labelColor);--_cw-field-trailing-color: cw-var(--cw-TextField-error-trailingIconColor)}.cw-TextField:where(.cw-TextField-disabled){--_cw-field-affix-color: var(--_cw-field-disabled-content-color);--_cw-field-container-color: cw-scale-opacity( cw-var(--cw-TextField-disabled-containerColor), cw-var(--cw-TextField-disabled-containerOpacity) );--_cw-field-disabled-content-color: cw-scale-opacity( cw-var(--cw-TextField-disabled-contentColor), cw-var(--cw-TextField-disabled-contentOpacity) );--_cw-field-indicator-color: cw-scale-opacity( cw-var(--cw-TextField-disabled-indicatorColor), cw-var(--cw-TextField-disabled-indicatorOpacity) );--_cw-field-input-color: var(--_cw-field-disabled-content-color);--_cw-field-label-color: var(--_cw-field-disabled-content-color);--_cw-field-leading-color: var(--_cw-field-disabled-content-color);--_cw-field-placeholder-color: var(--_cw-field-disabled-content-color);--_cw-field-supporting-color: var(--_cw-field-disabled-content-color);--_cw-field-trailing-color: var(--_cw-field-disabled-content-color)}:is(.cw-TextField,.cw-Select){--_cw-field-direction: 1;--_cw-field-icon-box: 48px;--_cw-field-icon-gap: calc( var(--_cw-field-padding) - (var(--_cw-field-icon-box) - var(--_cw-field-icon-size)) / 2 );--_cw-field-icon-text-inset: calc(var(--_cw-field-icon-box) + var(--_cw-field-icon-gap));--_cw-field-label-end: 0px;--_cw-field-label-float-x: 0px;--_cw-field-label-float-y: calc(8px + cw-var(--cw-Typescale-body-small-lineHeight)/2) ;--_cw-field-label-floated-delay: cw-var(--cw-Motion-spring-spatial-fast-duration);--_cw-field-label-motion-opacity: calc( 1 - var(--_CW-FIELD-LABEL_FLOATED) - var(--_CW-FIELD-LABEL_RESTED) );--_cw-field-label-origin: var(--_cw-field-notch-padding) 50%;--_cw-field-label-rested-delay: 0s;--_cw-field-label-scale: .75;--_cw-field-label-start: 0px;--_CW-FIELD-LABEL_FLOATED: 1;--_CW-FIELD-LABEL_PROGRESS: 1;--_CW-FIELD-LABEL_RESTED: 0;--_cw-field-notch-padding: 4px;--_cw-field-notch-start: calc(var(--_cw-field-padding) - var(--_cw-field-notch-padding));--_cw-field-text-bottom: 16px;--_cw-field-text-top: 16px;box-sizing:border-box;display:inline-flex;flex-flow:column nowrap;gap:4px;max-inline-size:100%;min-inline-size:min(280px,100%);position:relative;transition-delay:var(--_cw-field-label-floated-delay),0s,var(--_cw-field-label-rested-delay);transition-duration:0s,cw-var(--cw-Motion-spring-spatial-fast-duration),0s;transition-property:--_CW-FIELD-LABEL_FLOATED,--_CW-FIELD-LABEL_PROGRESS,--_CW-FIELD-LABEL_RESTED;transition-timing-function:linear,cw-var(--cw-Motion-spring-spatial-fast-easing),linear;vertical-align:top}:is(.cw-TextField,.cw-Select):dir(rtl){--_cw-field-direction: -1;--_cw-field-label-origin: calc(100% - var(--_cw-field-notch-padding)) 50%}:is(.cw-TextField,.cw-Select):has(>*>:is(.cw-TextField-leading,.cw-Select-leading):not(:empty)){--_cw-field-label-start: calc(var(--_cw-field-icon-text-inset) - var(--_cw-field-padding))}:is(.cw-TextField,.cw-Select):has(>*>:is(.cw-TextField-trailing:not(:empty),.cw-TextField-reveal,.cw-Select-arrow)){--_cw-field-label-end: calc(var(--_cw-field-icon-text-inset) - var(--_cw-field-padding))}:is(._cw-TextField-filled,._cw-Select-filled):has(:is(.cw-TextField-labelText,.cw-Select-labelText):not(:empty)){--_cw-field-text-bottom: 8px;--_cw-field-text-top: calc(8px + cw-var(--cw-Typescale-body-small-lineHeight)) }:is(.cw-TextField-disabled,.cw-Select-disabled){cursor:default;pointer-events:none;user-select:none}:is(.cw-TextField-control,.cw-Select-control){-cw-typescale:--cw-Typescale-body-large;align-items:center;background-color:var(--_cw-field-container-color);border-radius:inherit;box-sizing:border-box;color:var(--_cw-field-input-color);isolation:isolate;min-block-size:var(--_cw-field-height);position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-control,.cw-Select-control):before{background-color:currentcolor;border-radius:inherit;color:var(--_cw-field-state-layer-color);content:"";inset:0;opacity:var(--_cw-field-state-layer-opacity);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);z-index:-3}:is(.cw-TextField-leading,.cw-TextField-trailing,.cw-Select-leading){--cw-Icon-size: var(--_cw-field-icon-size);align-items:center;display:flex;flex:none;font-size:var(--_cw-field-icon-size);justify-content:center;min-block-size:var(--_cw-field-icon-box);min-inline-size:var(--_cw-field-icon-box);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-leading,.cw-Select-leading){color:var(--_cw-field-leading-color)}:is(.cw-TextField-leading,.cw-TextField-trailing,.cw-Select-leading)>.cw-Icon{--cw-Icon-color: currentcolor;--cw-Icon-size: var(--_cw-field-icon-size)}:is(.cw-TextField-leading,.cw-TextField-trailing,.cw-Select-leading):empty{display:none}:is(.cw-TextField-outline,.cw-Select-outline){border-color:currentcolor;border-radius:inherit;border-style:solid;border-width:0 0 var(--_cw-field-indicator-thickness);box-sizing:border-box;color:var(--_cw-field-indicator-color);container-type:inline-size;inset:0;margin:0;min-inline-size:0;padding-block:0;padding-inline:var(--_cw-field-notch-start);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);z-index:-1}:is(.cw-TextField-outline,.cw-Select-outline):after{border-color:currentcolor;border-radius:inherit;border-style:solid;border-width:0 0 var(--_cw-field-indicator-focus-thickness);box-sizing:border-box;content:"";inset:0 0 calc(-1 * var(--_cw-field-indicator-thickness));opacity:var(--_cw-field-indicator-focus-opacity);position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-legend,.cw-Select-legend){block-size:0;line-height:0;padding:0;position:relative;white-space:nowrap}:is(.cw-TextField-label,.cw-Select-label){-cw-typescale:--cw-Typescale-body-small;box-sizing:border-box;color:var(--_cw-field-label-color);display:inline-block;inset-block-start:8px;inset-inline-start:var(--_cw-field-label-start);max-inline-size:calc(100cqi - var(--_cw-field-label-end) - var(--_cw-field-label-start));opacity:var(--_CW-FIELD-LABEL_FLOATED);overflow:hidden;padding-inline:var(--_cw-field-notch-padding);pointer-events:none;position:relative;text-overflow:ellipsis;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);vertical-align:top;white-space:nowrap}:is(.cw-TextField-restingLabel,.cw-TextField-restingMotion,.cw-TextField-floatingMotion,.cw-Select-restingLabel,.cw-Select-restingMotion,.cw-Select-floatingMotion){box-sizing:border-box;color:var(--_cw-field-label-color);inset-block-start:calc((var(--_cw-field-height) - 1lh) / 2);inset-inline-start:calc(var(--_cw-field-notch-start) + var(--_cw-field-label-start));max-inline-size:calc(100% - 2 * var(--_cw-field-notch-start) - var(--_cw-field-label-start) - var(--_cw-field-label-end));overflow:hidden;padding-inline:var(--_cw-field-notch-padding);pointer-events:none;position:absolute;text-overflow:ellipsis;transform-origin:var(--_cw-field-label-origin);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);white-space:nowrap;z-index:-2}:is(.cw-TextField-restingLabel,.cw-Select-restingLabel){-cw-typescale:--cw-Typescale-body-large;opacity:var(--_CW-FIELD-LABEL_RESTED)}:is(.cw-TextField-restingMotion,.cw-Select-restingMotion){-cw-typescale:--cw-Typescale-body-large;opacity:calc(var(--_cw-field-label-motion-opacity) * (1 - round(down,var(--_CW-FIELD-LABEL_PROGRESS) + .5,1)));transform:translate(calc(var(--_cw-field-direction) * var(--_cw-field-label-float-x) * var(--_CW-FIELD-LABEL_PROGRESS)),calc((var(--_cw-field-label-float-y) - var(--_cw-field-height) / 2) * var(--_CW-FIELD-LABEL_PROGRESS))) scale(calc(1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)))}:is(.cw-TextField-floatingMotion,.cw-Select-floatingMotion){-cw-typescale:--cw-Typescale-body-small;opacity:calc(var(--_cw-field-label-motion-opacity) * round(down,var(--_CW-FIELD-LABEL_PROGRESS) + .5,1));transform:translate(calc(var(--_cw-field-direction) * var(--_cw-field-label-float-x) * var(--_CW-FIELD-LABEL_PROGRESS)),calc((var(--_cw-field-label-float-y) - var(--_cw-field-height) / 2) * var(--_CW-FIELD-LABEL_PROGRESS))) scale(calc((1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)) / var(--_cw-field-label-scale)))}:is(.cw-TextField,.cw-Select):has(:is(.cw-TextField-labelText,.cw-Select-labelText):empty) :is(.cw-TextField-label,.cw-TextField-restingLabel,.cw-TextField-restingMotion,.cw-TextField-floatingMotion,.cw-Select-label,.cw-Select-restingLabel,.cw-Select-restingMotion,.cw-Select-floatingMotion){display:none}:is(.cw-TextField-asterisk,.cw-Select-asterisk){display:none}:is(._cw-TextField-outlined,._cw-Select-outlined){--_cw-field-label-float-x: calc(-1 * var(--_cw-field-label-start));--_cw-field-label-float-y: calc(var(--_cw-field-indicator-thickness) / 2);--_cw-field-label-text-top: calc( var(--_cw-field-height) / 2 + (var(--_cw-field-label-float-y) - var(--_cw-field-height) / 2) * var(--_CW-FIELD-LABEL_PROGRESS) - (1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)) * 1cap / 2 );--_cw-field-notch-inline-size: calc( var(--_cw-field-notch-opening) * ( (var(--_cw-field-label-inline-size) - 2 * var(--_cw-field-notch-padding)) * (1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)) / var(--_cw-field-label-scale) + 2 * var(--_cw-field-notch-padding) ) );--_cw-field-notch-opening: clamp( 0, round( up, tan(atan2( var(--_cw-field-indicator-focus-thickness) - var(--_cw-field-label-text-top), var(--_cw-field-indicator-focus-thickness) )), 1 ), 1 );--_cw-field-notch-overhang: 1px;:is(.cw-TextField-outline,.cw-Select-outline){border-width:var(--_cw-field-indicator-thickness);inset-block-start:calc(-1 * var(--_cw-field-notch-overhang));padding-inline:calc(var(--_cw-field-notch-start) - var(--_cw-field-indicator-thickness))}:is(.cw-TextField-legend,.cw-Select-legend){block-size:calc(var(--_cw-field-indicator-thickness) + 2 * var(--_cw-field-notch-overhang));inline-size:var(--_cw-field-notch-inline-size, auto);max-inline-size:var( --_cw-field-notch-inline-size, calc((1 - var(--_CW-FIELD-LABEL_RESTED)) * 100%) )}:is(.cw-TextField-outline,.cw-Select-outline):after{border-width:var(--_cw-field-indicator-focus-thickness);clip-path:polygon(0 0,var(--_cw-field-notch-start) 0,var(--_cw-field-notch-start) 50%,calc(100% - var(--_cw-field-notch-start)) 50%,calc(100% - var(--_cw-field-notch-start)) 0,100% 0,100% 100%,0 100%);inset:calc(-1 * var(--_cw-field-indicator-thickness));inset-block-start:calc(-1 * var(--_cw-field-indicator-thickness) - var(--_cw-field-notch-overhang))}:is(.cw-TextField-legend,.cw-Select-legend):after{border-block-start:var(--_cw-field-indicator-focus-thickness) solid currentcolor;content:"";inline-size:calc(100cqi - 100%);inset-block-start:var(--_cw-field-notch-overhang);inset-inline-start:100%;opacity:var(--_cw-field-indicator-focus-opacity);position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-label,.cw-Select-label){inset-block-start:calc(var(--_cw-field-notch-overhang) + var(--_cw-field-indicator-thickness) / 2 - .5lh);inset-inline-start:0}}:is(.cw-TextField-footer,.cw-Select-footer){-cw-typescale:--cw-Typescale-body-small;color:var(--_cw-field-supporting-color);display:flex;gap:var(--_cw-field-padding);padding-inline:var(--_cw-field-padding);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-footer,.cw-Select-footer):not(:has(>:not(:empty))){display:none}:is(.cw-TextField-supporting,.cw-Select-supporting){flex:1 1 auto;min-inline-size:0;overflow-wrap:anywhere}.cw-TextField-control{cursor:text;display:flex;padding-inline:var(--_cw-field-padding)}.cw-TextField-leading{margin-inline:calc(-1 * var(--_cw-field-padding)) var(--_cw-field-icon-gap)}.cw-TextField-trailing{color:var(--_cw-field-trailing-color);margin-inline:var(--_cw-field-icon-gap) calc(-1 * var(--_cw-field-padding))}.cw-TextField-field{align-items:stretch;display:flex;flex:1 1 auto;min-inline-size:0}.cw-TextField-input{appearance:none;background:transparent;block-size:auto;border:0;box-sizing:content-box;caret-color:var(--_cw-field-caret-color);color:inherit;flex:1 1 auto;font:inherit;inline-size:100%;letter-spacing:inherit;margin:0;min-inline-size:0;outline:none;padding:var(--_cw-field-text-top) 0 var(--_cw-field-text-bottom)}.cw-TextField-input:autofill{-webkit-text-fill-color:var(--_cw-field-input-color);background-clip:text}.cw-TextField-input::-webkit-datetime-edit-fields-wrapper{padding-block:0}textarea.cw-TextField-input{overflow-wrap:anywhere;resize:none}@supports (field-sizing: content){textarea.cw-TextField-input{field-sizing:content;min-block-size:calc(var(--_cw-TextField-rows, 1) * 1lh)}}.cw-TextField-input::placeholder{color:var(--_cw-field-placeholder-color);opacity:1;transition-duration:cw-var(--cw-Motion-spring-effect-slow-duration);transition-property:opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-slow-easing)}:is(.cw-TextField-prefix,.cw-TextField-suffix){color:var(--_cw-field-affix-color);flex:none;opacity:1;padding-block:var(--_cw-field-text-top) var(--_cw-field-text-bottom);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color,opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing);white-space:nowrap}.cw-TextField-prefix{padding-inline-end:2px}.cw-TextField-suffix{padding-inline-start:2px}:is(.cw-TextField-prefix,.cw-TextField-suffix):empty{display:none}.cw-TextField:has(.cw-TextField-input:required):not(._cw-TextField-noAsterisk){.cw-TextField-asterisk{display:inline}}.cw-TextField:not(:has(.cw-TextField-input:is(:focus,:not(:placeholder-shown)))){--_cw-field-label-floated-delay: 0s;--_cw-field-label-rested-delay: cw-var(--cw-Motion-spring-spatial-fast-duration);--_CW-FIELD-LABEL_FLOATED: 0;--_CW-FIELD-LABEL_PROGRESS: 0;--_CW-FIELD-LABEL_RESTED: 1;&:has(.cw-TextField-labelText:not(:empty)) :is(.cw-TextField-prefix,.cw-TextField-suffix){opacity:0}&:has(.cw-TextField-labelText:not(:empty)) .cw-TextField-input::placeholder{opacity:0;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}}.cw-TextField-reveal{align-items:center;appearance:none;background:transparent;border:0;color:var(--_cw-field-trailing-color);cursor:pointer;display:flex;flex:none;font:inherit;justify-content:center;margin-block:0;margin-inline:var(--_cw-field-icon-gap) calc(-1 * var(--_cw-field-padding));min-block-size:var(--_cw-field-icon-box);min-inline-size:var(--_cw-field-icon-box);outline:none;padding:0;position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-TextField-reveal:has(+.cw-TextField-trailing:not(:empty)){margin-inline-end:0}.cw-TextField-reveal+.cw-TextField-trailing{margin-inline-start:0}.cw-TextField-reveal>.cw-Icon{--cw-Icon-color: currentcolor;--cw-Icon-size: var(--_cw-field-icon-size)}.cw-TextField-reveal:before{background-color:currentcolor;block-size:40px;border-radius:50%;color:transparent;content:"";inline-size:40px;opacity:cw-var(--cw-State-layer-hoverOpacity);outline:0 solid cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-TextField-reveal:hover:before{color:var(--_cw-field-trailing-color)}.cw-TextField-reveal:is(:focus-visible,:active):before{color:var(--_cw-field-trailing-color);opacity:cw-var(--cw-State-layer-pressOpacity)}.cw-TextField-reveal:focus-visible:before{opacity:cw-var(--cw-State-layer-focusOpacity);outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-TextField-counter{margin-inline-start:auto;white-space:nowrap}.cw-Autocomplete-menu{--cw-elevationShadow-color: var(--_cw-field-menu-shadow-color);--cw-elevationShadow-level: var(--_cw-field-menu-elevation);background-color:var(--_cw-field-menu-color);border:0;border-radius:var(--_cw-field-menu-shape);box-sizing:border-box;color:var(--_cw-field-menu-item-label-color);inset:auto;margin:0;opacity:0;overflow:hidden auto;overscroll-behavior:contain;padding:8px 0;position:fixed;transform:scale(.8);transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:display,opacity,overlay,transform;transition-timing-function:cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}.cw-Autocomplete-menu:popover-open{opacity:1;transform:none}@starting-style{.cw-Autocomplete-menu:popover-open{opacity:0;transform:scale(.8)}}.cw-Autocomplete-option{-cw-typescale:--cw-Typescale-label-large;align-items:center;box-sizing:border-box;cursor:pointer;display:flex;min-block-size:var(--_cw-field-menu-item-height);padding-inline:var(--_cw-field-menu-item-padding);position:relative;user-select:none}.cw-Autocomplete-option:before{background-color:currentcolor;color:transparent;content:"";inset:0;opacity:cw-var(--cw-State-layer-hoverOpacity);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-Autocomplete-option:hover:before{color:var(--_cw-field-menu-item-state-layer-color)}.cw-Autocomplete-option[aria-selected=true]:before{color:var(--_cw-field-menu-item-state-layer-color);opacity:cw-var(--cw-State-layer-focusOpacity)}.cw-Autocomplete-option:active:before{opacity:cw-var(--cw-State-layer-pressOpacity)}}@layer cw-theme{._cw-TextField-outlined{@cw-apply-theme outlined,cw-TextField;}}
|
|
1
|
+
@cw-attribute-roles cw-TextField;@property --_CW-FIELD-LABEL_PROGRESS{syntax: "<number>"; inherits: true; initial-value: 1;}@property --_CW-FIELD-LABEL_FLOATED{syntax: "<number>"; inherits: true; initial-value: 1;}@property --_CW-FIELD-LABEL_RESTED{syntax: "<number>"; inherits: true; initial-value: 0;}@layer cw-style{.cw-TextField{--_cw-field-affix-color: cw-var(--cw-TextField-input-affixColor);--_cw-field-caret-color: cw-var(--cw-TextField-input-caretColor);--_cw-field-container-color: cw-var(--cw-TextField-container-color);--_cw-field-height: cw-var(--cw-TextField-container-height);--_cw-field-icon-size: cw-var(--cw-TextField-icon-size);--_cw-field-indicator-color: cw-var(--cw-TextField-indicator-color);--_cw-field-indicator-focus-opacity: 0;--_cw-field-indicator-focus-thickness: cw-var(--cw-TextField-focus-indicatorThickness);--_cw-field-indicator-thickness: cw-var(--cw-TextField-indicator-thickness);--_cw-field-input-color: cw-var(--cw-TextField-input-color);--_cw-field-label-color: cw-var(--cw-TextField-label-color);--_cw-field-leading-color: cw-var(--cw-TextField-icon-leadingColor);--_cw-field-menu-color: cw-var(--cw-TextField-menu-color);--_cw-field-menu-elevation: cw-var(--cw-TextField-menu-elevation);--_cw-field-menu-item-height: cw-var(--cw-TextField-menu-itemHeight);--_cw-field-menu-item-label-color: cw-var(--cw-TextField-menu-itemLabelColor);--_cw-field-menu-item-padding: cw-var(--cw-TextField-menu-itemPadding);--_cw-field-menu-item-state-layer-color: cw-var(--cw-TextField-menu-itemStateLayerColor);--_cw-field-menu-shadow-color: cw-var(--cw-TextField-menu-shadowColor);--_cw-field-menu-shape: cw-var(--cw-TextField-menu-shape);--_cw-field-padding: cw-var(--cw-TextField-container-padding);--_cw-field-placeholder-color: cw-var(--cw-TextField-input-placeholderColor);--_cw-field-state-layer-color: transparent;--_cw-field-state-layer-opacity: cw-var(--cw-TextField-hover-stateLayerOpacity);--_cw-field-supporting-color: cw-var(--cw-TextField-supportingText-color);--_cw-field-trailing-color: cw-var(--cw-TextField-icon-trailingColor);-cw-border-radius:--cw-TextField-container-shape}.cw-TextField:where(:has(>.cw-TextField-control:hover)){--_cw-field-indicator-color: cw-var(--cw-TextField-hover-indicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-hover-labelColor);--_cw-field-state-layer-color: cw-var(--cw-TextField-hover-stateLayerColor)}.cw-TextField:where(:has(.cw-TextField-input:focus)){--_cw-field-indicator-color: cw-var(--cw-TextField-focus-indicatorColor);--_cw-field-indicator-focus-opacity: 1;--_cw-field-label-color: cw-var(--cw-TextField-focus-labelColor);--_cw-field-trailing-color: cw-var(--cw-TextField-focus-trailingIconColor)}.cw-TextField:where(.cw-TextField-error){--_cw-field-caret-color: cw-var(--cw-TextField-error-caretColor);--_cw-field-indicator-color: cw-var(--cw-TextField-error-indicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-error-labelColor);--_cw-field-supporting-color: cw-var(--cw-TextField-error-supportingTextColor);--_cw-field-trailing-color: cw-var(--cw-TextField-error-trailingIconColor)}.cw-TextField:where(.cw-TextField-error:has(>.cw-TextField-control:hover)){--_cw-field-indicator-color: cw-var(--cw-TextField-error-hoverIndicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-error-hoverLabelColor);--_cw-field-trailing-color: cw-var(--cw-TextField-error-hoverTrailingIconColor)}.cw-TextField:where(.cw-TextField-error:has(.cw-TextField-input:focus)){--_cw-field-indicator-color: cw-var(--cw-TextField-error-indicatorColor);--_cw-field-label-color: cw-var(--cw-TextField-error-labelColor);--_cw-field-trailing-color: cw-var(--cw-TextField-error-trailingIconColor)}.cw-TextField:where(.cw-TextField-disabled){--_cw-field-affix-color: var(--_cw-field-disabled-content-color);--_cw-field-container-color: cw-scale-opacity( cw-var(--cw-TextField-disabled-containerColor), cw-var(--cw-TextField-disabled-containerOpacity) );--_cw-field-disabled-content-color: cw-scale-opacity( cw-var(--cw-TextField-disabled-contentColor), cw-var(--cw-TextField-disabled-contentOpacity) );--_cw-field-indicator-color: cw-scale-opacity( cw-var(--cw-TextField-disabled-indicatorColor), cw-var(--cw-TextField-disabled-indicatorOpacity) );--_cw-field-input-color: var(--_cw-field-disabled-content-color);--_cw-field-label-color: var(--_cw-field-disabled-content-color);--_cw-field-leading-color: var(--_cw-field-disabled-content-color);--_cw-field-placeholder-color: var(--_cw-field-disabled-content-color);--_cw-field-supporting-color: var(--_cw-field-disabled-content-color);--_cw-field-trailing-color: var(--_cw-field-disabled-content-color)}:is(.cw-TextField,.cw-Select){--_cw-field-direction: 1;--_cw-field-icon-box: 48px;--_cw-field-icon-gap: calc( var(--_cw-field-padding) - (var(--_cw-field-icon-box) - var(--_cw-field-icon-size)) / 2 );--_cw-field-icon-text-inset: calc(var(--_cw-field-icon-box) + var(--_cw-field-icon-gap));--_cw-field-label-end: 0px;--_cw-field-label-float-x: 0px;--_cw-field-label-float-y: calc(8px + cw-var(--cw-Typescale-body-small-lineHeight)/2) ;--_cw-field-label-floated-delay: cw-var(--cw-Motion-spring-spatial-fast-duration);--_cw-field-label-motion-opacity: calc( 1 - var(--_CW-FIELD-LABEL_FLOATED) - var(--_CW-FIELD-LABEL_RESTED) );--_cw-field-label-origin: var(--_cw-field-notch-padding) 50%;--_cw-field-label-rested-delay: 0s;--_cw-field-label-scale: .75;--_cw-field-label-start: 0px;--_CW-FIELD-LABEL_FLOATED: 1;--_CW-FIELD-LABEL_PROGRESS: 1;--_CW-FIELD-LABEL_RESTED: 0;--_cw-field-notch-padding: 4px;--_cw-field-notch-start: calc(var(--_cw-field-padding) - var(--_cw-field-notch-padding));--_cw-field-text-bottom: 16px;--_cw-field-text-top: 16px;box-sizing:border-box;display:inline-flex;flex-flow:column nowrap;gap:4px;max-inline-size:100%;min-inline-size:min(280px,100%);position:relative;transition-delay:var(--_cw-field-label-floated-delay),0s,var(--_cw-field-label-rested-delay);transition-duration:0s,cw-var(--cw-Motion-spring-spatial-fast-duration),0s;transition-property:--_CW-FIELD-LABEL_FLOATED,--_CW-FIELD-LABEL_PROGRESS,--_CW-FIELD-LABEL_RESTED;transition-timing-function:linear,cw-var(--cw-Motion-spring-spatial-fast-easing),linear;vertical-align:top}:is(.cw-TextField,.cw-Select):dir(rtl){--_cw-field-direction: -1;--_cw-field-label-origin: calc(100% - var(--_cw-field-notch-padding)) 50%}:is(.cw-TextField,.cw-Select):has(>*>:is(.cw-TextField-leading,.cw-Select-leading):not(:empty)){--_cw-field-label-start: calc(var(--_cw-field-icon-text-inset) - var(--_cw-field-padding))}:is(.cw-TextField,.cw-Select):has(>*>:is(.cw-TextField-trailing:not(:empty),.cw-TextField-reveal,.cw-Select-arrow)){--_cw-field-label-end: calc(var(--_cw-field-icon-text-inset) - var(--_cw-field-padding))}:is(._cw-TextField-filled,._cw-Select-filled):has(:is(.cw-TextField-labelText,.cw-Select-labelText):not(:empty)){--_cw-field-text-bottom: 8px;--_cw-field-text-top: calc(8px + cw-var(--cw-Typescale-body-small-lineHeight)) }:is(.cw-TextField-disabled,.cw-Select-disabled){cursor:default;pointer-events:none;user-select:none}:is(.cw-TextField-control,.cw-Select-control){-cw-typescale:--cw-Typescale-body-large;align-items:center;background-color:var(--_cw-field-container-color);border-radius:inherit;box-sizing:border-box;color:var(--_cw-field-input-color);isolation:isolate;min-block-size:var(--_cw-field-height);position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-control,.cw-Select-control):before{background-color:currentcolor;border-radius:inherit;color:var(--_cw-field-state-layer-color);content:"";inset:0;opacity:var(--_cw-field-state-layer-opacity);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);z-index:-3}:is(.cw-TextField-leading,.cw-TextField-trailing,.cw-Select-leading){--cw-Icon-size: var(--_cw-field-icon-size);align-items:center;display:flex;flex:none;font-size:var(--_cw-field-icon-size);justify-content:center;min-block-size:var(--_cw-field-icon-box);min-inline-size:var(--_cw-field-icon-box);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-leading,.cw-Select-leading){color:var(--_cw-field-leading-color)}:is(.cw-TextField-leading,.cw-TextField-trailing,.cw-Select-leading)>.cw-Icon{--cw-Icon-color: currentcolor;--cw-Icon-size: var(--_cw-field-icon-size)}:is(.cw-TextField-leading,.cw-TextField-trailing,.cw-Select-leading):empty{display:none}:is(.cw-TextField-outline,.cw-Select-outline){border-color:currentcolor;border-radius:inherit;border-style:solid;border-width:0 0 var(--_cw-field-indicator-thickness);box-sizing:border-box;color:var(--_cw-field-indicator-color);container-type:inline-size;inset:0;margin:0;min-inline-size:0;padding-block:0;padding-inline:var(--_cw-field-notch-start);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);z-index:-1}:is(.cw-TextField-outline,.cw-Select-outline):after{border-color:currentcolor;border-radius:inherit;border-style:solid;border-width:0 0 var(--_cw-field-indicator-focus-thickness);box-sizing:border-box;content:"";inset:0 0 calc(-1 * var(--_cw-field-indicator-thickness));opacity:var(--_cw-field-indicator-focus-opacity);position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-legend,.cw-Select-legend){block-size:0;line-height:0;padding:0;position:relative;white-space:nowrap}:is(.cw-TextField-label,.cw-Select-label){-cw-typescale:--cw-Typescale-body-small;box-sizing:border-box;color:var(--_cw-field-label-color);display:inline-block;inset-block-start:8px;inset-inline-start:var(--_cw-field-label-start);max-inline-size:calc(100cqi - var(--_cw-field-label-end) - var(--_cw-field-label-start));opacity:var(--_CW-FIELD-LABEL_FLOATED);overflow:hidden;padding-inline:var(--_cw-field-notch-padding);pointer-events:none;position:relative;text-overflow:ellipsis;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);vertical-align:top;white-space:nowrap}:is(.cw-TextField-restingLabel,.cw-TextField-restingMotion,.cw-TextField-floatingMotion,.cw-Select-restingLabel,.cw-Select-restingMotion,.cw-Select-floatingMotion){box-sizing:border-box;color:var(--_cw-field-label-color);inset-block-start:calc((var(--_cw-field-height) - 1lh) / 2);inset-inline-start:calc(var(--_cw-field-notch-start) + var(--_cw-field-label-start));max-inline-size:calc(100% - 2 * var(--_cw-field-notch-start) - var(--_cw-field-label-start) - var(--_cw-field-label-end));overflow:hidden;padding-inline:var(--_cw-field-notch-padding);pointer-events:none;position:absolute;text-overflow:ellipsis;transform-origin:var(--_cw-field-label-origin);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing);white-space:nowrap;z-index:-2}:is(.cw-TextField-restingLabel,.cw-Select-restingLabel){-cw-typescale:--cw-Typescale-body-large;opacity:var(--_CW-FIELD-LABEL_RESTED)}:is(.cw-TextField-restingMotion,.cw-Select-restingMotion){-cw-typescale:--cw-Typescale-body-large;opacity:calc(var(--_cw-field-label-motion-opacity) * (1 - round(down,var(--_CW-FIELD-LABEL_PROGRESS) + .5,1)));transform:translate(calc(var(--_cw-field-direction) * var(--_cw-field-label-float-x) * var(--_CW-FIELD-LABEL_PROGRESS)),calc((var(--_cw-field-label-float-y) - var(--_cw-field-height) / 2) * var(--_CW-FIELD-LABEL_PROGRESS))) scale(calc(1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)))}:is(.cw-TextField-floatingMotion,.cw-Select-floatingMotion){-cw-typescale:--cw-Typescale-body-small;opacity:calc(var(--_cw-field-label-motion-opacity) * round(down,var(--_CW-FIELD-LABEL_PROGRESS) + .5,1));transform:translate(calc(var(--_cw-field-direction) * var(--_cw-field-label-float-x) * var(--_CW-FIELD-LABEL_PROGRESS)),calc((var(--_cw-field-label-float-y) - var(--_cw-field-height) / 2) * var(--_CW-FIELD-LABEL_PROGRESS))) scale(calc((1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)) / var(--_cw-field-label-scale)))}:is(.cw-TextField,.cw-Select):has(:is(.cw-TextField-labelText,.cw-Select-labelText):empty) :is(.cw-TextField-label,.cw-TextField-restingLabel,.cw-TextField-restingMotion,.cw-TextField-floatingMotion,.cw-Select-label,.cw-Select-restingLabel,.cw-Select-restingMotion,.cw-Select-floatingMotion){display:none}:is(.cw-TextField-asterisk,.cw-Select-asterisk){display:none}:is(._cw-TextField-outlined,._cw-Select-outlined){--_cw-field-label-float-x: calc(-1 * var(--_cw-field-label-start));--_cw-field-label-float-y: calc(var(--_cw-field-indicator-thickness) / 2);--_cw-field-label-text-top: calc( var(--_cw-field-height) / 2 + (var(--_cw-field-label-float-y) - var(--_cw-field-height) / 2) * var(--_CW-FIELD-LABEL_PROGRESS) - (1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)) * 1cap / 2 );--_cw-field-notch-inline-size: clamp( 0px, (var(--_cw-field-indicator-focus-thickness) - var(--_cw-field-label-text-top)) * 1000000, (var(--_cw-field-label-inline-size) - 2 * var(--_cw-field-notch-padding)) * (1 - (1 - var(--_cw-field-label-scale)) * var(--_CW-FIELD-LABEL_PROGRESS)) / var(--_cw-field-label-scale) + 2 * var(--_cw-field-notch-padding) );--_cw-field-notch-overhang: 1px;:is(.cw-TextField-outline,.cw-Select-outline){border-width:var(--_cw-field-indicator-thickness);inset-block-start:calc(-1 * var(--_cw-field-notch-overhang));padding-inline:calc(var(--_cw-field-notch-start) - var(--_cw-field-indicator-thickness))}:is(.cw-TextField-legend,.cw-Select-legend){block-size:calc(var(--_cw-field-indicator-thickness) + 2 * var(--_cw-field-notch-overhang));inline-size:var(--_cw-field-notch-inline-size, auto);max-inline-size:var( --_cw-field-notch-inline-size, calc((1 - var(--_CW-FIELD-LABEL_RESTED)) * 100%) )}:is(.cw-TextField-outline,.cw-Select-outline):after{border-width:var(--_cw-field-indicator-focus-thickness);clip-path:polygon(0 0,var(--_cw-field-notch-start) 0,var(--_cw-field-notch-start) 50%,calc(100% - var(--_cw-field-notch-start)) 50%,calc(100% - var(--_cw-field-notch-start)) 0,100% 0,100% 100%,0 100%);inset:calc(-1 * var(--_cw-field-indicator-thickness));inset-block-start:calc(-1 * var(--_cw-field-indicator-thickness) - var(--_cw-field-notch-overhang))}:is(.cw-TextField-legend,.cw-Select-legend):after{border-block-start:var(--_cw-field-indicator-focus-thickness) solid currentcolor;content:"";inline-size:calc(100cqi - 100%);inset-block-start:var(--_cw-field-notch-overhang);inset-inline-start:100%;opacity:var(--_cw-field-indicator-focus-opacity);position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-label,.cw-Select-label){inset-block-start:calc(var(--_cw-field-notch-overhang) + var(--_cw-field-indicator-thickness) / 2 - .5lh);inset-inline-start:0}}:is(.cw-TextField-footer,.cw-Select-footer){-cw-typescale:--cw-Typescale-body-small;color:var(--_cw-field-supporting-color);display:flex;gap:var(--_cw-field-padding);padding-inline:var(--_cw-field-padding);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}:is(.cw-TextField-footer,.cw-Select-footer):not(:has(>:not(:empty))){display:none}:is(.cw-TextField-supporting,.cw-Select-supporting){flex:1 1 auto;min-inline-size:0;overflow-wrap:anywhere}.cw-TextField-control{cursor:text;display:flex;padding-inline:var(--_cw-field-padding)}.cw-TextField-leading{margin-inline:calc(-1 * var(--_cw-field-padding)) var(--_cw-field-icon-gap)}.cw-TextField-trailing{color:var(--_cw-field-trailing-color);margin-inline:var(--_cw-field-icon-gap) calc(-1 * var(--_cw-field-padding))}.cw-TextField-field{align-items:stretch;display:flex;flex:1 1 auto;min-inline-size:0}.cw-TextField-input{appearance:none;background:transparent;block-size:auto;border:0;box-sizing:content-box;caret-color:var(--_cw-field-caret-color);color:inherit;flex:1 1 auto;font:inherit;inline-size:100%;letter-spacing:inherit;margin:0;min-inline-size:0;outline:none;padding:var(--_cw-field-text-top) 0 var(--_cw-field-text-bottom)}.cw-TextField-input:autofill{-webkit-text-fill-color:var(--_cw-field-input-color);background-clip:text}.cw-TextField-input::-webkit-datetime-edit-fields-wrapper{padding-block:0}textarea.cw-TextField-input{overflow-wrap:anywhere;resize:none}@supports (field-sizing: content){textarea.cw-TextField-input{field-sizing:content;min-block-size:calc(var(--_cw-TextField-rows, 1) * 1lh)}}.cw-TextField-input::placeholder{color:var(--_cw-field-placeholder-color);opacity:1;transition-duration:cw-var(--cw-Motion-spring-effect-slow-duration);transition-property:opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-slow-easing)}:is(.cw-TextField-prefix,.cw-TextField-suffix){color:var(--_cw-field-affix-color);flex:none;opacity:1;padding-block:var(--_cw-field-text-top) var(--_cw-field-text-bottom);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color,opacity;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing);white-space:nowrap}.cw-TextField-prefix{padding-inline-end:2px}.cw-TextField-suffix{padding-inline-start:2px}:is(.cw-TextField-prefix,.cw-TextField-suffix):empty{display:none}.cw-TextField:has(.cw-TextField-input:required):not(._cw-TextField-noAsterisk){.cw-TextField-asterisk{display:inline}}.cw-TextField:not(:has(.cw-TextField-input:is(:focus,:not(:placeholder-shown)))){--_cw-field-label-floated-delay: 0s;--_cw-field-label-rested-delay: cw-var(--cw-Motion-spring-spatial-fast-duration);--_CW-FIELD-LABEL_FLOATED: 0;--_CW-FIELD-LABEL_PROGRESS: 0;--_CW-FIELD-LABEL_RESTED: 1;&:has(.cw-TextField-labelText:not(:empty)) :is(.cw-TextField-prefix,.cw-TextField-suffix){opacity:0}&:has(.cw-TextField-labelText:not(:empty)) .cw-TextField-input::placeholder{opacity:0;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}}.cw-TextField-reveal{align-items:center;appearance:none;background:transparent;border:0;color:var(--_cw-field-trailing-color);cursor:pointer;display:flex;flex:none;font:inherit;justify-content:center;margin-block:0;margin-inline:var(--_cw-field-icon-gap) calc(-1 * var(--_cw-field-padding));min-block-size:var(--_cw-field-icon-box);min-inline-size:var(--_cw-field-icon-box);outline:none;padding:0;position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-TextField-reveal:has(+.cw-TextField-trailing:not(:empty)){margin-inline-end:0}.cw-TextField-reveal+.cw-TextField-trailing{margin-inline-start:0}.cw-TextField-reveal>.cw-Icon{--cw-Icon-color: currentcolor;--cw-Icon-size: var(--_cw-field-icon-size)}.cw-TextField-reveal:before{background-color:currentcolor;block-size:40px;border-radius:50%;color:transparent;content:"";inline-size:40px;opacity:cw-var(--cw-State-layer-hoverOpacity);outline:0 solid cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-TextField-reveal:hover:before{color:var(--_cw-field-trailing-color)}.cw-TextField-reveal:is(:focus-visible,:active):before{color:var(--_cw-field-trailing-color);opacity:cw-var(--cw-State-layer-pressOpacity)}.cw-TextField-reveal:focus-visible:before{opacity:cw-var(--cw-State-layer-focusOpacity);outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-TextField-counter{margin-inline-start:auto;white-space:nowrap}.cw-Autocomplete-menu{--cw-elevationShadow-color: var(--_cw-field-menu-shadow-color);--cw-elevationShadow-level: var(--_cw-field-menu-elevation);background-color:var(--_cw-field-menu-color);border:0;border-radius:var(--_cw-field-menu-shape);box-sizing:border-box;color:var(--_cw-field-menu-item-label-color);inset:auto;margin:0;opacity:0;overflow:hidden auto;overscroll-behavior:contain;padding:8px 0;position:fixed;transform:scale(.8);transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:display,opacity,overlay,transform;transition-timing-function:cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}.cw-Autocomplete-menu:popover-open{opacity:1;transform:none}@starting-style{.cw-Autocomplete-menu:popover-open{opacity:0;transform:scale(.8)}}.cw-Autocomplete-option{-cw-typescale:--cw-Typescale-label-large;align-items:center;box-sizing:border-box;cursor:pointer;display:flex;min-block-size:var(--_cw-field-menu-item-height);padding-inline:var(--_cw-field-menu-item-padding);position:relative;user-select:none}.cw-Autocomplete-option:before{background-color:currentcolor;color:transparent;content:"";inset:0;opacity:cw-var(--cw-State-layer-hoverOpacity);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-Autocomplete-option:hover:before{color:var(--_cw-field-menu-item-state-layer-color)}.cw-Autocomplete-option[aria-selected=true]:before{color:var(--_cw-field-menu-item-state-layer-color);opacity:cw-var(--cw-State-layer-focusOpacity)}.cw-Autocomplete-option:active:before{opacity:cw-var(--cw-State-layer-pressOpacity)}}@layer cw-theme{._cw-TextField-outlined{@cw-apply-theme outlined,cw-TextField;}}
|