@pg-labs-incubator/cobweb 0.0.1 → 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 +3 -2
- package/target/esbuild/input/text-field.css +1 -1
- package/target/esbuild/navigation/base.jsx +1 -1
- package/target/esbuild/surface/dialog.jsx +7 -7
- package/target/esbuild/surface/surface.css +1 -1
- package/target/tsc/navigation/base.d.ts +11 -0
- package/target/tsc/surface/dialog.d.ts +3 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pg-labs-incubator/cobweb",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.3",
|
|
4
4
|
"description": "Cobweb components library, based on Material 3 design, for SolidJS.",
|
|
5
5
|
"license": "MPL-2.0",
|
|
6
6
|
"homepage": "https://pglabs.ai/projects/cobweb",
|
|
@@ -110,5 +110,6 @@
|
|
|
110
110
|
},
|
|
111
111
|
"peerDependencies": {
|
|
112
112
|
"solid-js": "^1.9.9"
|
|
113
|
-
}
|
|
113
|
+
},
|
|
114
|
+
"scripts": {}
|
|
114
115
|
}
|
|
@@ -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;}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{children as M,createUniqueId as L,mergeProps as x}from"solid-js";import{DragVelocity as A}from"../surface/drag";import{deferAfterDelegatedCancellation as B}from"../util/event";const u=new WeakMap,d=new WeakMap,g=":modal, :popover-open",
|
|
1
|
+
import{children as M,createUniqueId as L,mergeProps as x}from"solid-js";import{DragVelocity as A}from"../surface/drag";import{deferAfterDelegatedCancellation as B}from"../util/event";const u=new WeakMap,d=new WeakMap,g=":modal, :popover-open",h=/[^a-zA-Z0-9_-]+/g,D=50,m=8,E=.5,S=["lostpointercapture","pointercancel","pointerdown","pointermove","pointerup"];function N(t,e,n){const r=t,o={},i=new Set(["children",...n]),s=l=>{const T=M(()=>l==="children"&&e!==void 0?e:r[l]);Object.defineProperty(o,l,{enumerable:!0,get:T})};for(const l of Object.keys(r))i.delete(l)&&s(l);for(const l of i)l==="children"?s(l):o[l]=void 0;return x(t,o)}function H(t,e){const n=L().replace(h,"-");return e===void 0||e===""?`${t}-${n}`:`${t}-${e.replace(h,"-")}-${n}`}function X(t){return"value"in t?t.value:"selectedValue"in t?t.selectedValue:t.defaultValue}function y(t){return t.matches(":disabled")||t.hasAttribute("disabled")||t.getAttribute("aria-disabled")==="true"}function C(t,e){const n=[];let r=!0;for(let o=t;o!==null;o=o.parentElement){const i=e?.get(o);if(i!==void 0){r=i;break}if(n.push(o),o.hasAttribute("hidden")||o.hasAttribute("inert")){r=!1;break}const s=p(o);if(s.display==="none"||s.visibility==="hidden"||s.visibility==="collapse"){r=!1;break}}for(const o of n)e?.set(o,r);return r}function P(t){const e=t.getAttribute("popover");return e===null||e===""||e==="auto"}function R(t){const e=t.ownerDocument,n=u.get(e)??[];let r=d.get(e);if(r===void 0){const i={order:new WeakMap,sequence:0,onToggle(s){!f(s.target)||!("newState"in s)||(s.newState==="open"?i.order.set(s.target,++i.sequence):n.includes(s.target)||i.order.delete(s.target))}};r=i,d.set(e,i),e.addEventListener("beforetoggle",i.onToggle,!0)}try{for(const i of Array.from(e.querySelectorAll(g)))r.order.has(i)||r.order.set(i,++r.sequence)}catch{}r.order.set(t,++r.sequence),n.push(t),u.set(e,n);const o=r;return()=>{const i=n.lastIndexOf(t);i>=0&&n.splice(i,1),n.length===0&&u.get(e)===n&&(e.removeEventListener("beforetoggle",o.onToggle,!0),d.delete(e),u.delete(e))}}function _(t){const e=t.ownerDocument,n=u.get(e),r=d.get(e);let o;if(n===void 0||r===void 0)return!1;try{o=Array.from(e.querySelectorAll(g))}catch{return n.at(-1)===t}for(const a of o)r.order.has(a)||r.order.set(a,++r.sequence);const i=n.filter(a=>o.some(l=>l.contains(a))),s=r.order.get(t)??0;return(i.length>0?i:n).at(-1)!==t?!1:o.every(a=>a.contains(t)||n.includes(a)||!P(a)||(r.order.get(a)??0)<s)}function f(t){return typeof t=="object"&&t!==null&&t.nodeType===1}function v(t){return f(t)&&t.localName==="a"}function q(t){return f(t)&&t.localName==="button"}function I(){throw new Error("server renderer requested on the client")}function V(t,e){return v(e)&&(t.button!==0||t.altKey||t.ctrlKey||t.metaKey||t.shiftKey)}function W(t,e){v(e)&&y(e)&&(t.key==="Enter"||t.key===" ")&&t.preventDefault()}function c(t){return(t?.nodeType===9?t:t?.ownerDocument)?.defaultView}function p(t){return c(t)?.getComputedStyle(t)??getComputedStyle(t)}function J(t){return c(t)?.MutationObserver??globalThis.MutationObserver}function b(t){const e=Number.parseFloat(t);return Number.isFinite(e)?t.trim().endsWith("ms")?e:e*1e3:0}function w(t,e){const n=p(t),r=n.transitionDuration.split(","),o=n.transitionDelay.split(",");let i=0;return n.transitionProperty.split(",").forEach((s,a)=>{(e.includes(s.trim())||s.trim()==="all")&&(i=Math.max(0,b(r[a%r.length]??"0s")+b(o[a%o.length]??"0s")))}),i}function K(t,e,n){const r=c(t),o=w(t,e);let i;const s=()=>{t.removeEventListener("transitionend",a),i!==void 0&&r?.clearTimeout(i),i=void 0},a=l=>{l.target!==t||!e.includes(l.propertyName)||(s(),n())};return o===0||r===void 0?(n(),()=>{}):(t.addEventListener("transitionend",a),i=r.setTimeout(()=>{s(),n()},o+D),s)}function Y(t,e=!1){return Array.from(t.querySelectorAll("button, a[href], input, select, textarea, [role=button], [tabindex]")).filter(n=>n.closest("[role=toolbar]")===t&&!y(n)&&(n.matches("button, a[href], input, select, textarea")||n.tabIndex>=0||e&&n.matches("[role=button], [tabindex]")))}function j(t,...e){const n=new Set;for(const r of t)r!==void 0&&!n.has(r)&&(n.add(r),r(...e))}function $(t,e,n){return Math.abs(e)>=n?e>0:e>0?t>=E:t>E}class F{#s;#n;#l;#u;#r;#t;#d;#i;#e;#a;#o;constructor(e){this.#s=e,this.#n=new A,this.#l=n=>this.#f(n),this.#u=n=>{this.#o&&(this.#o=!1,n.preventDefault(),n.stopPropagation())},this.#r=null,this.#t=null,this.#d=0,this.#i=0,this.#e=0,this.#a=-1,this.#o=!1}attach(e){const n=this.#r;if(n!==e){this.#t=null,this.#e=0;for(const r of S)n?.removeEventListener(r,this.#l),e?.addEventListener(r,this.#l);n?.removeEventListener("click",this.#u,!0),e?.addEventListener("click",this.#u,!0),this.#r=e}}#f(e){const n=this.#t;if(e.type==="pointerdown"){n===null&&e.isPrimary&&e.button===0&&(this.#t=e,this.#i=e.clientX,this.#n.reset(),this.#n.track(e,r=>r.clientX));return}if(!(n===null||e.pointerId!==n.pointerId)){if(e.type!=="pointermove"){e.type==="pointerup"&&(this.#i=e.clientX),this.#h(e);return}this.#n.track(e,r=>r.clientX),this.#i=e.clientX,this.#e===0&&this.#p(n,e),this.#e>0&&this.#s.update(this.#c())}}#p(e,n){const r=this.#r,o=n.clientX-e.clientX,i=n.clientY-e.clientY;if(r===null||Math.max(Math.abs(o),Math.abs(i))<=m)return;if(Math.abs(i)>=Math.abs(o)){this.#t=null;return}const s=this.#s.begin(e);if(s===null||s<=0){this.#t=null;return}this.#e=s,this.#a=p(r).direction==="rtl"?1:-1,this.#d=e.clientX+Math.sign(o)*m;try{r.setPointerCapture(n.pointerId)}catch{}}#h(e){const n=this.#e,r=c(this.#r);if(this.#t=null,n===0)return;const o=this.#c(),i=e.type==="pointerup"?this.#n.release(e)*this.#a/n:0;this.#e=0,this.#o=!0,r?.setTimeout(()=>this.#o=!1,0),this.#s.end(o,i,e)}#c(){return(this.#i-this.#d)*this.#a/this.#e}}export{F as DismissDrag,K as afterTransition,p as computedStyleOf,j as dedupeCallbacks,B as deferAfterDelegatedCancellation,Y as directActionableChildren,V as isAlternateLinkActivation,v as isAnchorElement,q as isButtonElement,y as isDisabledElement,$ as isDismissedAt,f as isElementNode,_ as isTopModalLayer,C as isVisibleElement,J as mutationObserverOf,c as ownerWindow,W as preventDisabledLinkKey,R as registerModalLayer,N as resolveNavigationSlots,X as selectedValueOf,w as transitionTimeOf,H as uniqueId,I as unreachableServerRender};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{createUniqueId as l,untrack as F}from"solid-js";import{insert as
|
|
1
|
+
import{createUniqueId as l,untrack as F}from"solid-js";import{insert as _}from"solid-js/web";import{defineDomComponent as w}from"..";import{Button as D}from"../action/button";import{IconButton as T}from"../action/icon-button";import{ELEVATION_SHADOW_CSS_CLASS as v}from"../container/elevation-shadow";import{DomController as H}from"../dom/client";import{isElementNode as y,isTopModalLayer as R,registerModalLayer as X,transitionTimeOf as J}from"../navigation/base";import{deferAfterDelegatedCancellation as q}from"../util/event";import{resolveSurfaceSlots as P}from"./slots";import"../container/elevation-shadow.css";import"./surface.css";const N="a[href], area[href], button, input:not([type=hidden]), select, textarea, summary, iframe, [contenteditable]:not([contenteditable=false]), [tabindex]",k="data-cw-dialog-action",M="cw-AlertDialog-noDismiss",I="cw-FullScreenDialog-noConfirm",$="cw-FullScreenDialog-scrolled";let O;function z(){return O??=typeof CSS<"u"&&CSS.supports("overlay","auto"),O}function E(n){const e=n.getRootNode().activeElement;return y(e)?e:null}function L(n,e){return!n.hidden&&!n.matches(":disabled")&&n.getAttribute("aria-disabled")!=="true"&&(!e||!n.hasAttribute("tabindex")||n.tabIndex>=0)&&n.closest("[hidden], [inert], [aria-hidden='true']")===null&&n.checkVisibility({visibilityProperty:!0})}function S(n,e){const t=Array.from(n.querySelectorAll(N));return e&&t.reverse(),t.find(i=>L(i,!0))}function B(n,e){const t=e.target,i=y(t)?t.closest(`[${k}]`):null;return n===null||i?.closest("dialog")!==n?null:i.getAttribute(k)}function K(n){const e=n,t={};for(const i of Object.keys(e))["children","aria-describedby","aria-label","aria-labelledby","aria-modal"].includes(i)||(t[i]=e[i]);return t}function C(n){return("open"in n?n.open:n.defaultOpen)===!0}function A(n,e,t){const i=n,s=i["aria-label"],o=i["aria-labelledby"]??(s===void 0?t.labelledBy:void 0);return{...K(n),"aria-describedby":i["aria-describedby"]??t.describedBy,"aria-label":s??(o===void 0?e.label??t.label:void 0),"aria-labelledby":o,"aria-modal":"aria-modal"in i?i["aria-modal"]:e.modal!==!1?"true":void 0,classList:{...n.classList,...t.classes},open:C(e),role:e.role??t.role,tabIndex:e.tabIndex}}function V(n,e){return<dialog{...A(n,e,{classes:{[v]:!0,"cw-Dialog":!0,"cw-Dialog-open":C(e)},label:"Dialog",role:"dialog"})}>{n.children}</dialog>}class x extends H{#n;#o;#l;#t;#r;#u;#e;#i;#s;#a;#h;#b;#D;#f;#m;#v;#d;#c;#y;constructor(e,t="cw-Dialog"){super(e,{styleElementIsFunction:!0}),this.#n=t,this.#o="open"in e,this.#l="attr:aria-modal"in e,this.#e=null,this.#i=F(()=>(this.#o?e.open:e.defaultOpen)===!0),this.#s=F(()=>e.modal!==!1),this.#a=!1,this.#h=null,this.#b=0,this.#D=!1,this.#f=!1,this.#m=void 0,this.#v=!1,this.#d=void 0,this.#c=void 0,this.#y=!1;const i=super.consumeProps([],["onOpenChange","onClose","onCancel"]);this.#t=i.onOpenChange,this.#r=i.onClose,this.#u=i.onCancel}defaultRole(){return"dialog"}defaultLabel(){return this.props.label??"Dialog"}defaultLabelledBy(){}defaultDescribedBy(){}allowDismiss(e,t){return!0}requestDismiss(e,t){this.allowDismiss(e,t)&&this.close(e,t)}onOpenStateChanged(e){}onShown(){}isOpen(){return this.#i}open(){this.#C(!0,!0,"programmatic")}close(e="programmatic",t){this.#C(!1,!0,e,t)}toggle(){this.#i?this.close():this.open()}#E(e,t,i){this.#t?.(e,t,i)}#T(e){this.#i=e,super.setClass(`${this.#n}-open`,e),this.onOpenStateChanged(e)}#C(e,t,i,s){const o=e!==this.#i;if(t&&this.#o){o&&this.#E(e,s,i);return}!o&&(this.#e===null||(this.#e.open&&this.#c===void 0)===e)||(this.#T(e),e?this.#p():this.#_(),t&&o&&this.#E(e,s,i))}#p(){const e=this.#e;if(!(e===null||!this.#i)){if(!e.isConnected){this.#H(e);return}if(this.#S(),this.#M()&&this.#a===this.#s){this.#P(e);return}if(this.#h===null){const t=E(e);t!==null&&!e.contains(t)&&(this.#h=t)}if(e.open){if(this.#a===this.#s)return;this.#a?(this.#b++,e.close()):e.removeAttribute("open")}this.#s&&this.props.returnFocus===!1&&E(e)?.blur();try{this.#s?e.showModal():e.show(),this.#a=this.#s}catch{e.setAttribute("open",""),this.#a=!1}this.#P(e)}}#P(e){this.#R(),this.#d?.(),this.#d=this.#s?X(e):void 0,this.onShown()}#_(){const e=this.#e;if(this.#S(),this.#d?.(),this.#d=void 0,e!==null){if(e.open&&!z()){super.setClass(`_${this.#n}-closing`,!0);const t=J(e,["display"]),i=e.ownerDocument.defaultView;if(t>0&&i!==null){this.#c=i.setTimeout(()=>this.#g(e),t);return}super.setClass(`_${this.#n}-closing`,!1)}this.#g(e)}}#g(e){const t=this.#L(e);if(this.#M(),e.open)try{e.close()}catch{e.removeAttribute("open")}this.#a=!1,this.#I(t)}#M(){const e=this.#c;return e===void 0?!1:(this.#c=void 0,this.#e?.ownerDocument.defaultView?.clearTimeout(e),super.setClass(`_${this.#n}-closing`,!1),!0)}#H(e){const t=()=>{const i=e.ownerDocument.defaultView;this.#m=void 0,!(!this.#f||this.#e!==e)&&(e.isConnected?(this.#f=!1,this.#p()):i!==null&&(this.#m=i.requestAnimationFrame(t)))};this.#f||(this.#f=!0,queueMicrotask(t))}#S(){const e=this.#m;this.#f=!1,this.#m=void 0,e!==void 0&&this.#e?.ownerDocument.defaultView?.cancelAnimationFrame(e)}#L(e){const t=E(e);return t===null||t===e.ownerDocument.body||e.contains(t)}#I(e){const t=this.#h;this.#h=null,!(t===null||!e||this.props.returnFocus===!1)&&queueMicrotask(()=>{const i=this.#e;t.isConnected&&(i===null||this.#L(i))&&t.focus()})}#R(){this.#D||(this.#D=!0,queueMicrotask(()=>{const e=this.#e,t=this.props.initialFocus;let i=null;if(this.#D=!1,!this.#i||e===null)return;if(typeof t=="string")try{i=e.querySelector(t)}catch{}else y(t)&&e.contains(t)&&(i=t);(i!==null&&L(i,!1)?i:Array.from(e.querySelectorAll("[autofocus]")).find(o=>L(o,!1))??S(e,!1)??e).focus()}))}#X(e,t){const i=S(e,!1),s=S(e,!0),o=E(e);i===void 0||s===void 0?(t.preventDefault(),e.focus()):(t.shiftKey?o===i||o===e:o===s)&&(t.preventDefault(),(t.shiftKey?s:i).focus())}#B(e){const t=this.#e,i=t?.getBoundingClientRect();return t!==null&&e.target===t&&i!==void 0&&(e.clientX<i.left||e.clientX>i.right||e.clientY<i.top||e.clientY>i.bottom)}#w=e=>{const t=this.#e;if(this.#c!==void 0){e.preventDefault();return}t!==null&&this.#s&&!R(t)||(this.#u?.(e),!e.defaultPrevented&&(this.requestDismiss("cancel",e),e.preventDefault()))};#A=e=>{const t=this.#e;if(this.#b>0){this.#b--;return}if(this.#r?.(e),t!==null&&!t.open&&this.#c!==void 0&&this.#g(t),!(t===null||t.open||!this.#i)){if(this.#d?.(),this.#d=void 0,this.#a=!1,this.#o){this.#E(!1,e,"close"),queueMicrotask(()=>this.#p());return}this.#T(!1),this.#E(!1,e,"close"),this.#I(this.#L(t))}};#x=e=>{this.#v=this.#B(e)};#F=e=>{const t=this.#v;this.#v=!1,t&&this.#i&&this.props.closeOnBackdrop!==!1&&this.#B(e)&&this.requestDismiss("backdrop",e)};#k=e=>{const t=this.#e;if(!(t===null||e.defaultPrevented||!this.#i||!y(e.target)||e.target.closest("dialog")!==t))if(e.key==="Escape"){if(e.isTrusted&&this.#a)return;q(e,t,()=>{const i=t.ownerDocument.defaultView?.Event??Event;this.#e===t&&this.#i&&t.dispatchEvent(new i("cancel",{cancelable:!0}))})}else e.key==="Tab"&&this.#s&&this.#X(t,e)};#O(e,t){this.#e?.getAttribute(e)!==(t??null)&&super.setAttribute(e,t)}applyComponentProps(){const e=super.readProps(["attr:aria-describedby","attr:aria-label","attr:aria-labelledby","label","modal","open","role","tabIndex"]),t=e["attr:aria-label"],i=e["attr:aria-labelledby"]??(t===void 0?this.defaultLabelledBy():void 0);e.modalChanged&&(this.#s=e.modal!==!1,this.#l||super.setAttribute("aria-modal",this.#s?"true":void 0),this.#p()),e.roleChanged&&super.setAttribute("role",e.role??this.defaultRole()),e.tabIndexChanged&&super.setAttribute("tabindex",e.tabIndex),this.#O("aria-label",t??(i===void 0?this.defaultLabel():void 0)),this.#O("aria-labelledby",i),this.#O("aria-describedby",e["attr:aria-describedby"]??this.defaultDescribedBy()),this.#y||(this.#y=!0,super.setClass(`${this.#n}-open`,this.#i)),e.openChanged&&this.#o&&this.#C(e.open===!0,!1,"programmatic")}onStyleElementChanged(e){const t=this.#e;super.onStyleElementChanged(e),t!==null&&(this.#c!==void 0&&this.#g(t),t.removeEventListener("cancel",this.#w),t.removeEventListener("close",this.#A),t.removeEventListener("click",this.#F),t.removeEventListener("keydown",this.#k),t.removeEventListener("pointerdown",this.#x)),this.#e=e,this.#e!==null&&(this.#e.addEventListener("cancel",this.#w),this.#e.addEventListener("close",this.#A),this.#e.addEventListener("click",this.#F),this.#e.addEventListener("keydown",this.#k),this.#e.addEventListener("pointerdown",this.#x),this.#p())}render(e){const t=<dialog class={`cw-Dialog ${v}`}/>;return _(t,e),t}onControllerCleanup(){const e=this.#e;if(this.#i=!1,this.#S(),this.#d?.(),this.#d=void 0,e!==null&&(this.#c!==void 0&&this.#g(e),e.removeEventListener("cancel",this.#w),e.removeEventListener("close",this.#A),e.removeEventListener("click",this.#F),e.removeEventListener("keydown",this.#k),e.removeEventListener("pointerdown",this.#x),e.open))try{e.close()}catch{e.removeAttribute("open")}super.onControllerCleanup()}}const he=w(()=>V,()=>x),U=["children","confirmLabel","dismissLabel","icon","supportingText","text","title"];function j(n,e){const t=l(),i=l();return<dialog{...A(n,e,{classes:{[v]:!0,[M]:e.showDismiss===!1,"cw-AlertDialog":!0,"cw-Dialog":!0,"cw-Dialog-open":C(e)},describedBy:i,label:e.title===void 0?"Alert dialog":void 0,labelledBy:e.label===void 0&&e.title!==void 0?t:void 0,role:"alertdialog"})}>
|
|
2
2
|
<div class="cw-AlertDialog-icon">{e.icon}</div>
|
|
3
3
|
<h2 class="cw-AlertDialog-title"id={t}>{e.title}</h2>
|
|
4
4
|
<div class="cw-AlertDialog-text"id={i}>
|
|
@@ -8,7 +8,7 @@ import{createUniqueId as l,untrack as F}from"solid-js";import{insert as B}from"s
|
|
|
8
8
|
<D attr:data-cw-dialog-action="dismiss"class="cw-AlertDialog-dismiss"size="sm"variant="text">{e.dismissLabel??"Cancel"}</D>
|
|
9
9
|
<D attr:data-cw-dialog-action="confirm"class="cw-AlertDialog-confirm"size="sm"variant="text">{e.confirmLabel??"OK"}</D>
|
|
10
10
|
</div>
|
|
11
|
-
</dialog>}class
|
|
11
|
+
</dialog>}class G extends x{#n;#o;#l;#t;constructor(e){super(e),this.#l=l(),this.#t=l();const t=super.consumeProps([],["onConfirm","onDismiss"]);this.#n=t.onConfirm,this.#o=t.onDismiss}defaultRole(){return"alertdialog"}defaultLabel(){return this.props.label??(this.props.title===void 0?"Alert dialog":void 0)}defaultLabelledBy(){return this.props.label===void 0&&this.props.title!==void 0?this.#l:void 0}defaultDescribedBy(){return this.#t}#r=e=>{const t=B(this.styleElement,e);t==="confirm"?(this.#n?.(e),e.defaultPrevented||this.close("confirm",e)):t==="dismiss"&&(this.#o?.(e),e.defaultPrevented||this.close("dismiss",e))};applyComponentProps(){const e=super.readProps(["showDismiss"]);super.applyComponentProps(),e.showDismissChanged&&super.setClass(M,e.showDismiss===!1)}onStyleElementChanged(e){this.styleElement?.removeEventListener("click",this.#r),super.onStyleElementChanged(e),e?.addEventListener("click",this.#r)}render(e){const t=this.props,i=this.#l,s=this.#t;return<dialog class={`cw-Dialog cw-AlertDialog ${v}`}>
|
|
12
12
|
<div class="cw-AlertDialog-icon">{t.icon}</div>
|
|
13
13
|
<h2 class="cw-AlertDialog-title"id={i}>{t.title}</h2>
|
|
14
14
|
<div class="cw-AlertDialog-text"id={s}>
|
|
@@ -18,18 +18,18 @@ import{createUniqueId as l,untrack as F}from"solid-js";import{insert as B}from"s
|
|
|
18
18
|
<D attr:data-cw-dialog-action="dismiss"class="cw-AlertDialog-dismiss"size="sm"variant="text">{t.dismissLabel??"Cancel"}</D>
|
|
19
19
|
<D attr:data-cw-dialog-action="confirm"class="cw-AlertDialog-confirm"size="sm"variant="text">{t.confirmLabel??"OK"}</D>
|
|
20
20
|
</div>
|
|
21
|
-
</dialog>}onControllerCleanup(){this.styleElement?.removeEventListener("click",this.#
|
|
21
|
+
</dialog>}onControllerCleanup(){this.styleElement?.removeEventListener("click",this.#r),super.onControllerCleanup()}}const Y=w(()=>j,()=>G),me=n=>Y(P(n,U)),Q=["children","closeIcon","confirmLabel","title"];function W(n,e){const t=l();return<dialog{...A(n,e,{classes:{[I]:e.confirmLabel===void 0,"cw-FullScreenDialog":!0,"cw-FullScreenDialog-open":C(e)},label:e.title===void 0?"Dialog":void 0,labelledBy:e.label===void 0&&e.title!==void 0?t:void 0,role:"dialog"})}>
|
|
22
22
|
<div class={`cw-FullScreenDialog-header ${v}`}>
|
|
23
|
-
<
|
|
23
|
+
<T attr:aria-label={e.closeLabel??"Close"}attr:data-cw-dialog-action="dismiss"class="cw-FullScreenDialog-close"size="sm">{e.closeIcon??"close"}</T>
|
|
24
24
|
<h2 class="cw-FullScreenDialog-title"id={t}>{e.title}</h2>
|
|
25
25
|
<D attr:data-cw-dialog-action="confirm"class="cw-FullScreenDialog-confirm"size="sm"variant="text">{e.confirmLabel}</D>
|
|
26
26
|
</div>
|
|
27
27
|
<div class="cw-FullScreenDialog-content">{n.children}</div>
|
|
28
|
-
</dialog>}class
|
|
28
|
+
</dialog>}class Z extends x{#n;#o;#l;#t;#r;constructor(e){super(e,"cw-FullScreenDialog"),this.#l=l(),this.#t=null,this.#r=!1;const t=super.consumeProps([],["onConfirm","onDismiss"]);this.#n=t.onConfirm,this.#o=t.onDismiss}defaultLabel(){return this.props.label??(this.props.title===void 0?"Dialog":void 0)}defaultLabelledBy(){return this.props.label===void 0&&this.props.title!==void 0?this.#l:void 0}#u=e=>{const t=B(this.styleElement,e);t==="confirm"?(this.#n?.(e),e.defaultPrevented||this.close("confirm",e)):t==="dismiss"&&(this.#o?.(e),e.defaultPrevented||this.close("dismiss",e))};#e=()=>{const e=(this.#t?.scrollTop??0)>0;e!==this.#r&&(this.#r=e,super.setClass($,e))};applyComponentProps(){const e=super.readProps(["confirmLabel"]);super.applyComponentProps(),e.confirmLabelChanged&&super.setClass(I,e.confirmLabel===void 0)}onStyleElementChanged(e){this.styleElement?.removeEventListener("click",this.#u),this.#t?.removeEventListener("scroll",this.#e),super.onStyleElementChanged(e),this.#t=e?.querySelector(".cw-FullScreenDialog-content")??null,e?.addEventListener("click",this.#u),this.#t?.addEventListener("scroll",this.#e,{passive:!0})}render(e){const t=this.props,i=this.#l;return<dialog class="cw-FullScreenDialog">
|
|
29
29
|
<div class={`cw-FullScreenDialog-header ${v}`}>
|
|
30
|
-
<
|
|
30
|
+
<T attr:aria-label={t.closeLabel??"Close"}attr:data-cw-dialog-action="dismiss"class="cw-FullScreenDialog-close"size="sm">{t.closeIcon??"close"}</T>
|
|
31
31
|
<h2 class="cw-FullScreenDialog-title"id={i}>{t.title}</h2>
|
|
32
32
|
<D attr:data-cw-dialog-action="confirm"class="cw-FullScreenDialog-confirm"size="sm"variant="text">{t.confirmLabel}</D>
|
|
33
33
|
</div>
|
|
34
34
|
<div class="cw-FullScreenDialog-content">{e}</div>
|
|
35
|
-
</dialog>}onControllerCleanup(){this.styleElement?.removeEventListener("click",this.#
|
|
35
|
+
</dialog>}onControllerCleanup(){this.styleElement?.removeEventListener("click",this.#u),this.#t?.removeEventListener("scroll",this.#e),super.onControllerCleanup()}}const ee=w(()=>W,()=>Z),pe=n=>ee(P(n,Q));export{me as AlertDialog,G as AlertDialogController,he as Dialog,x as DialogController,pe as FullScreenDialog,Z as FullScreenDialogController,B as actionOf,E as activeElementOf,A as dialogAttributesOf,C as isInitiallyOpen};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@cw-attribute-roles cw-Surface;@property --_cw-Surface-shape{syntax: "*"; inherits: false;}@property --_cw-BottomSheet-offset{syntax: "<number>"; inherits: false; initial-value: 0;}@property --_cw-BottomSheet-overshoot{syntax: "<number>"; inherits: false; initial-value: 0;}@layer cw-theme{.cw-Surface-expressive,.cw-theme-expressive.cw-Surface,.cw-theme-expressive .cw-Surface,.cw-theme-expressive.cw-List,.cw-theme-expressive .cw-List,.cw-theme-expressive.cw-ListItem,.cw-theme-expressive .cw-ListItem,.cw-theme-expressive.cw-Menu,.cw-theme-expressive .cw-Menu,.cw-theme-expressive.cw-Menu-popup,.cw-theme-expressive .cw-Menu-popup,.cw-theme-expressive.cw-MenuItem,.cw-theme-expressive .cw-MenuItem,.cw-theme-expressive.cw-SwipeToDismiss,.cw-theme-expressive .cw-SwipeToDismiss,.cw-theme-expressive.cw-Carousel,.cw-theme-expressive .cw-Carousel,.cw-theme-expressive.cw-Carousel-viewport,.cw-theme-expressive .cw-Carousel-viewport,.cw-theme-expressive.cw-Carousel-controls button,.cw-theme-expressive .cw-Carousel-controls button{@cw-apply-theme expressive,cw-Surface;}}@layer cw-style{.cw-Surface{--cw-interactable-focusIndicator-color: cw-var(--cw-Surface-focusIndicatorColor);--cw-interactable-focusIndicator-offset: cw-var(--cw-State-focusIndicator-outerOffset);--cw-interactable-focusIndicator-thickness: cw-var(--cw-State-focusIndicator-thickness);background-color:cw-var(--cw-Surface-color);border-color:cw-var(--cw-Surface-outlineColor);border-radius:var(--_cw-Surface-shape, cw-var(--cw-Surface-shape));border-style:solid;border-width:cw-var(--cw-Surface-outlineThickness);box-sizing:border-box;color:cw-var(--cw-Surface-onColor);display:flex;flex-flow:column nowrap;min-inline-size:0;position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,border-color,color,--cw-elevationShadow-level;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-List,.cw-ListItem,.cw-Menu,.cw-Menu-popup,.cw-MenuItem,.cw-SwipeToDismiss,.cw-Carousel,.cw-Carousel-viewport,.cw-Carousel-controls button,.cw-PullToRefresh{--cw-Surface-color: cw-var(--cw-Surface-color, default);--cw-Surface-onColor: cw-var(--cw-Surface-onColor, default);--cw-Surface-shape: cw-var(--cw-Surface-shape, default);--cw-Surface-outlineColor: cw-var(--cw-Surface-outlineColor, default);--cw-Surface-outlineThickness: cw-var(--cw-Surface-outlineThickness, default);--cw-Surface-selectedColor: cw-var(--cw-Surface-selectedColor, default);--cw-Surface-dividerColor: cw-var(--cw-Surface-dividerColor, default);--cw-Surface-dividerThickness: cw-var(--cw-Surface-dividerThickness, default);--cw-Surface-listItemHeight: cw-var(--cw-Surface-listItemHeight, default);--cw-Surface-listItemHeightDense: cw-var(--cw-Surface-listItemHeightDense, default);--cw-Surface-dialogScrimColor: cw-var(--cw-Surface-dialogScrimColor, default);--cw-Surface-dialogShape: cw-var(--cw-Surface-dialogShape, default);--cw-Surface-menuColor: cw-var(--cw-Surface-menuColor, default);--cw-Surface-menuShape: cw-var(--cw-Surface-menuShape, default);--cw-Surface-sheetColor: cw-var(--cw-Surface-sheetColor, default);--cw-Surface-sheetShape: cw-var(--cw-Surface-sheetShape, default);--cw-Surface-sheetPeekHeight: cw-var(--cw-Surface-sheetPeekHeight, default);--cw-Surface-focusIndicatorColor: cw-var(--cw-Surface-focusIndicatorColor, default)}.cw-List,.cw-Menu,.cw-SwipeToDismiss,.cw-Carousel,.cw-PullToRefresh{--cw-surface-color: cw-var(--cw-Surface-color);--cw-surface-on-color: cw-var(--cw-Surface-onColor);--cw-surface-shape: cw-var(--cw-Surface-shape);--cw-surface-outline-color: cw-var(--cw-Surface-outlineColor);--cw-surface-outline-thickness: cw-var(--cw-Surface-outlineThickness);--cw-surface-selected-color: cw-var(--cw-Surface-selectedColor);--cw-surface-divider-color: cw-var(--cw-Surface-dividerColor);--cw-surface-divider-thickness: cw-var(--cw-Surface-dividerThickness);--cw-surface-list-item-height: cw-var(--cw-Surface-listItemHeight);--cw-surface-list-item-height-dense: cw-var(--cw-Surface-listItemHeightDense);--cw-surface-dialog-scrim-color: cw-var(--cw-Surface-dialogScrimColor);--cw-surface-dialog-shape: cw-var(--cw-Surface-dialogShape);--cw-surface-menu-color: cw-var(--cw-Surface-menuColor);--cw-surface-menu-shape: cw-var(--cw-Surface-menuShape);--cw-surface-sheet-color: cw-var(--cw-Surface-sheetColor);--cw-surface-sheet-shape: cw-var(--cw-Surface-sheetShape);--cw-surface-sheet-peek-height: cw-var(--cw-Surface-sheetPeekHeight);--cw-surface-focus-indicator-color: cw-var(--cw-Surface-focusIndicatorColor)}.cw-Surface-clickable,.cw-Surface-selectable{cursor:pointer}.cw-Surface-hover{--cw-interactable-stateLayer-color: currentcolor;--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity)}.cw-Surface-focus{--cw-interactable-stateLayer-color: currentcolor;--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity)}.cw-Surface-press{--cw-interactable-ripple-color: currentcolor;--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity)}.cw-Surface-selected{background-color:cw-var(--cw-Surface-selectedColor);color:cw-var(--cw-Surface-selectedOnColor)}.cw-Surface-disabled{cursor:default;opacity:cw-var(--cw-Surface-disabledOpacity);pointer-events:none;user-select:none}._cw-Surface-surface{--cw-Surface-color: cw-var(--cw-Color-surface-fill)}._cw-Surface-surface-dim{--cw-Surface-color: cw-var(--cw-Color-surface-fillDim)}._cw-Surface-surface-bright{--cw-Surface-color: cw-var(--cw-Color-surface-fillBright)}._cw-Surface-surface-container-lowest{--cw-Surface-color: cw-var(--cw-Color-surface-containerLowest)}._cw-Surface-surface-container-low{--cw-Surface-color: cw-var(--cw-Color-surface-containerLow)}._cw-Surface-surface-container{--cw-Surface-color: cw-var(--cw-Color-surface-container)}._cw-Surface-surface-container-high{--cw-Surface-color: cw-var(--cw-Color-surface-containerHigh)}._cw-Surface-surface-container-highest{--cw-Surface-color: cw-var(--cw-Color-surface-containerHighest)}._cw-Surface-inverse{--cw-Surface-color: cw-var(--cw-Color-surface-inverseFill);--cw-Surface-onColor: cw-var(--cw-Color-surface-inverseOnFill)}._cw-Surface-primary{--cw-Surface-color: cw-var(--cw-Color-primary-fill);--cw-Surface-onColor: cw-var(--cw-Color-primary-onFill)}._cw-Surface-secondary{--cw-Surface-color: cw-var(--cw-Color-secondary-fill);--cw-Surface-onColor: cw-var(--cw-Color-secondary-onFill)}._cw-Surface-tertiary{--cw-Surface-color: cw-var(--cw-Color-tertiary-fill);--cw-Surface-onColor: cw-var(--cw-Color-tertiary-onFill)}._cw-Surface-error{--cw-Surface-color: cw-var(--cw-Color-error-fill);--cw-Surface-onColor: cw-var(--cw-Color-error-onFill)}._cw-Surface-elevation-0{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-0)}._cw-Surface-elevation-1{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-1)}._cw-Surface-elevation-2{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-2)}._cw-Surface-elevation-3{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-3)}._cw-Surface-elevation-4{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-4)}._cw-Surface-elevation-5{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-5)}._cw-Surface-shape-none{--_cw-Surface-shape: cw-var(--cw-CornerRadius-none)}._cw-Surface-shape-extra-small{--_cw-Surface-shape: cw-var(--cw-CornerRadius-xsmall)}._cw-Surface-shape-small{--_cw-Surface-shape: cw-var(--cw-CornerRadius-small)}._cw-Surface-shape-medium{--_cw-Surface-shape: cw-var(--cw-CornerRadius-medium)}._cw-Surface-shape-large{--_cw-Surface-shape: cw-var(--cw-CornerRadius-large)}._cw-Surface-shape-extra-large{--_cw-Surface-shape: cw-var(--cw-CornerRadius-xlarge)}._cw-Surface-shape-full{--_cw-Surface-shape: cw-var(--cw-CornerRadius-full)}.cw-Divider{--cw-Surface-dividerColor: cw-var(--cw-Surface-dividerColor, default);border-color:cw-var(--cw-Surface-dividerColor);border-style:solid;border-width:0;box-sizing:border-box;flex:none}._cw-Divider-horizontal{block-size:0;border-block-start-width:var(--_cw-Divider-thickness, cw-var(--cw-Surface-dividerThickness))}._cw-Divider-vertical{align-self:stretch;border-inline-start-width:var(--_cw-Divider-thickness, cw-var(--cw-Surface-dividerThickness));inline-size:0;min-block-size:1lh}._cw-Divider-horizontal:is(._cw-Divider-inset-start,._cw-Divider-inset-both){margin-inline-start:cw-var(--cw-Surface-dividerInset)}._cw-Divider-horizontal:is(._cw-Divider-inset-end,._cw-Divider-inset-both){margin-inline-end:cw-var(--cw-Surface-dividerInset)}._cw-Divider-vertical:is(._cw-Divider-inset-start,._cw-Divider-inset-both){margin-block-start:cw-var(--cw-Surface-dividerInset)}._cw-Divider-vertical:is(._cw-Divider-inset-end,._cw-Divider-inset-both){margin-block-end:cw-var(--cw-Surface-dividerInset)}.cw-Dialog{--cw-Surface-dialogColor: cw-var(--cw-Surface-dialogColor, default);--cw-Surface-dialogElevation: cw-var(--cw-Surface-dialogElevation, default);--cw-Surface-dialogShape: cw-var(--cw-Surface-dialogShape, default);--cw-elevationShadow-level: cw-var(--cw-Surface-dialogElevation);--_cw-Dialog-effect-duration: cw-var(--cw-Motion-spring-effect-default-duration);--_cw-Dialog-effect-easing: cw-var(--cw-Motion-spring-effect-default-easing);background-color:cw-var(--cw-Surface-dialogColor);border-radius:cw-var(--cw-Surface-dialogShape);border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);inline-size:fit-content;inset:0;margin:auto;max-block-size:calc(100% - (2*cw-var(--cw-Surface-dialogMargin)));max-inline-size:min(cw-var(--cw-Surface-dialogMaxWidth),100% - 2 * cw-var(--cw-Surface-dialogMargin));min-inline-size:min(cw-var(--cw-Surface-dialogMinWidth),100% - 2 * cw-var(--cw-Surface-dialogMargin));overflow:auto;padding:cw-var(--cw-Surface-dialogPadding);position:fixed;transition-behavior:allow-discrete;transition-duration:var(--_cw-Dialog-effect-duration),var(--_cw-Dialog-effect-duration),var(--_cw-Dialog-effect-duration),cw-var(--cw-Motion-spring-spatial-default-duration);transition-property:display,opacity,overlay,scale;transition-timing-function:var(--_cw-Dialog-effect-easing),var(--_cw-Dialog-effect-easing),var(--_cw-Dialog-effect-easing),cw-var(--cw-Motion-spring-spatial-default-easing)}.cw-Dialog:not([open]){--_cw-Dialog-effect-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-Dialog-effect-easing: cw-var(--cw-Motion-spring-effect-fast-easing);opacity:0}:is(.cw-Dialog,.cw-ModalBottomSheet,.cw-SideSheet)::backdrop{--cw-Surface-dialogScrimColor: cw-var(--cw-Surface-dialogScrimColor, default);background-color:cw-scale-opacity(cw-var(--cw-Surface-dialogScrimColor),cw-var(--cw-Surface-dialogScrimOpacity));transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration);transition-property:background-color,display,overlay;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing)}:is(.cw-Dialog,.cw-ModalBottomSheet,.cw-SideSheet):not([open])::backdrop,._cw-ModalBottomSheet-hiding::backdrop{background-color:transparent}.cw-Dialog:not([open])::backdrop{transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}@starting-style{.cw-Dialog[open]{opacity:0;scale:.8}:is(.cw-Dialog,.cw-ModalBottomSheet,.cw-SideSheet)[open]::backdrop{background-color:transparent}}.cw-Dialog:focus-visible,.cw-BottomSheet-dragHandle:focus-visible{outline-color:cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);outline-style:solid;outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-FullScreenDialog:focus-visible,.cw-ModalBottomSheet:focus-visible,.cw-BottomSheet-surface:focus-visible,.cw-SideSheet:focus-visible{outline-color:cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-innerOffset);outline-style:solid;outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-AlertDialog{--cw-Surface-dialogHeadlineColor: cw-var(--cw-Surface-dialogHeadlineColor, default);--cw-Surface-dialogIconColor: cw-var(--cw-Surface-dialogIconColor, default);--cw-Surface-dialogSupportingTextColor: cw-var(--cw-Surface-dialogSupportingTextColor, default);--cw-Surface-dividerColor: cw-var(--cw-Surface-dividerColor, default);--_cw-AlertDialog-color: cw-var(--cw-Surface-dialogColor);--_cw-AlertDialog-dividerColor: cw-var(--cw-Surface-dividerColor);--_cw-AlertDialog-headlineColor: cw-var(--cw-Surface-dialogHeadlineColor);--_cw-AlertDialog-iconColor: cw-var(--cw-Surface-dialogIconColor);--_cw-AlertDialog-iconSize: cw-var(--cw-Surface-dialogIconSize);--_cw-AlertDialog-spacing: cw-var(--cw-Surface-dialogSpacing);--_cw-AlertDialog-supportingTextColor: cw-var(--cw-Surface-dialogSupportingTextColor);--_cw-AlertDialog-textSpacing: cw-var(--cw-Surface-dialogPadding);flex-direction:column;max-block-size:min(cw-var(--cw-Surface-dialogMaxHeight),100% - 2 * cw-var(--cw-Surface-dialogMargin));overflow:hidden}.cw-AlertDialog[open]{display:flex}.cw-AlertDialog-icon{align-self:center;color:var(--_cw-AlertDialog-iconColor);display:flex;flex:none;font-size:var(--_cw-AlertDialog-iconSize);margin-block-end:var(--_cw-AlertDialog-spacing)}.cw-AlertDialog-icon>.cw-Icon{--cw-Icon-size: var(--_cw-AlertDialog-iconSize)}.cw-AlertDialog-title{-cw-typescale:--cw-Typescale-headline-small;color:var(--_cw-AlertDialog-headlineColor);flex:none;margin-block-end:var(--_cw-AlertDialog-spacing);margin-block-start:0;margin-inline:0}.cw-AlertDialog:has(>.cw-AlertDialog-icon:not(:empty))>.cw-AlertDialog-title{text-align:center}.cw-AlertDialog-text{-cw-typescale:--cw-Typescale-body-medium;background-attachment:local,local,scroll,scroll;background-image:linear-gradient(var(--_cw-AlertDialog-color) 0 0),linear-gradient(var(--_cw-AlertDialog-color) 0 0),linear-gradient(var(--_cw-AlertDialog-dividerColor) 0 0),linear-gradient(var(--_cw-AlertDialog-dividerColor) 0 0);background-position:top,bottom,top,bottom;background-repeat:no-repeat;background-size:100% 1px;color:var(--_cw-AlertDialog-supportingTextColor);flex:0 1 auto;min-block-size:0;overflow:auto}.cw-AlertDialog-actions{column-gap:8px;display:flex;flex:none;flex-wrap:wrap;justify-content:flex-end;margin-block-start:var(--_cw-AlertDialog-textSpacing);row-gap:12px}.cw-AlertDialog-icon:empty,.cw-AlertDialog-title:empty,.cw-AlertDialog-noDismiss .cw-AlertDialog-dismiss{display:none}.cw-FullScreenDialog{--cw-Surface-fullScreenDialogColor: cw-var(--cw-Surface-fullScreenDialogColor, default);--cw-Surface-fullScreenDialogHeaderScrolledColor: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledColor, default);--cw-Surface-fullScreenDialogHeaderScrolledElevation: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledElevation, default);--_cw-FullScreenDialog-headerHeight: cw-var(--cw-Surface-fullScreenDialogHeaderHeight);--_cw-FullScreenDialog-scrolledColor: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledColor);--_cw-FullScreenDialog-scrolledElevation: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledElevation);--_cw-FullScreenDialog-padding: cw-var(--cw-Surface-dialogPadding);--_cw-FullScreenDialog-duration: cw-var(--cw-Motion-spring-spatial-slow-duration);--_cw-FullScreenDialog-easing: cw-var(--cw-Motion-spring-spatial-slow-easing);background-color:cw-var(--cw-Surface-fullScreenDialogColor);block-size:100%;border-radius:0;border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);flex-direction:column;inline-size:100%;inset:0;margin:0;max-block-size:none;max-inline-size:none;overflow:hidden;padding:0;position:fixed;transition-behavior:allow-discrete;transition-duration:var(--_cw-FullScreenDialog-duration);transition-property:display,overlay,translate;transition-timing-function:var(--_cw-FullScreenDialog-easing)}.cw-FullScreenDialog[open]{display:flex}.cw-FullScreenDialog:not([open]){--_cw-FullScreenDialog-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-FullScreenDialog-easing: cw-var(--cw-Motion-spring-effect-fast-easing);translate:0 100%}@starting-style{.cw-FullScreenDialog[open]{translate:0 100%}}.cw-FullScreenDialog::backdrop{background-color:transparent}.cw-FullScreenDialog-header{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-0);align-items:center;block-size:var(--_cw-FullScreenDialog-headerHeight);box-sizing:border-box;display:flex;flex:none;padding-inline:4px;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration);transition-property:background-color,--cw-elevationShadow-level;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing)}.cw-FullScreenDialog-scrolled .cw-FullScreenDialog-header{--cw-elevationShadow-level: var(--_cw-FullScreenDialog-scrolledElevation);background-color:var(--_cw-FullScreenDialog-scrolledColor)}.cw-FullScreenDialog-title{-cw-typescale:--cw-Typescale-title-large;flex:1 1 auto;margin-block:0;margin-inline:12px 0;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cw-FullScreenDialog-content{flex:1 1 auto;min-block-size:0;overflow:auto;padding:var(--_cw-FullScreenDialog-padding)}.cw-FullScreenDialog-noConfirm .cw-FullScreenDialog-confirm{display:none}.cw-SideSheet{--cw-Surface-sideSheetColor: cw-var(--cw-Surface-sideSheetColor, default);--cw-Surface-sideSheetDividerColor: cw-var(--cw-Surface-sideSheetDividerColor, default);--cw-Surface-sideSheetHeadlineColor: cw-var(--cw-Surface-sideSheetHeadlineColor, default);--cw-Surface-sideSheetModalColor: cw-var(--cw-Surface-sideSheetModalColor, default);--cw-Surface-sideSheetModalElevation: cw-var(--cw-Surface-sideSheetModalElevation, default);--cw-Surface-sideSheetShape: cw-var(--cw-Surface-sideSheetShape, default);--cw-elevationShadow-level: cw-var(--cw-Elevation-level-0);--_cw-SideSheet-direction: 1;--_cw-SideSheet-dividerColor: cw-var(--cw-Surface-sideSheetDividerColor);--_cw-SideSheet-duration: cw-var(--cw-Motion-spring-spatial-default-duration);--_cw-SideSheet-easing: cw-var(--cw-Motion-spring-spatial-default-easing);--_cw-SideSheet-headlineColor: cw-var(--cw-Surface-sideSheetHeadlineColor);--_cw-SideSheet-hidden: calc(var(--_cw-SideSheet-direction) * (100% + var(--_cw-SideSheet-margin)));--_cw-SideSheet-margin: 0px;background-color:cw-var(--cw-Surface-sideSheetColor);block-size:calc(100% - 2 * var(--_cw-SideSheet-margin));border-radius:0;border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);flex-direction:column;inline-size:cw-var(--cw-Surface-sideSheetWidth);inset-block:var(--_cw-SideSheet-margin);inset-inline-end:var(--_cw-SideSheet-margin);inset-inline-start:auto;margin:0;max-block-size:none;max-inline-size:calc(100% - 2 * var(--_cw-SideSheet-margin));padding:0;position:fixed;transition-behavior:allow-discrete;transition-duration:var(--_cw-SideSheet-duration);transition-property:display,overlay,translate;transition-timing-function:var(--_cw-SideSheet-easing)}.cw-SideSheet[open]{display:flex}.cw-SideSheet[data-cw-side-sheet-edge=start]{--_cw-SideSheet-direction: -1;inset-inline-end:auto;inset-inline-start:var(--_cw-SideSheet-margin)}.cw-SideSheet:dir(rtl){--_cw-SideSheet-direction: -1}.cw-SideSheet[data-cw-side-sheet-edge=start]:dir(rtl){--_cw-SideSheet-direction: 1}.cw-SideSheet:not([open]){--_cw-SideSheet-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-SideSheet-easing: cw-var(--cw-Motion-spring-effect-fast-easing);translate:var(--_cw-SideSheet-hidden) 0}@starting-style{.cw-SideSheet[open]{translate:var(--_cw-SideSheet-hidden) 0}}.cw-SideSheet-modal{--cw-elevationShadow-level: cw-var(--cw-Surface-sideSheetModalElevation);background-color:cw-var(--cw-Surface-sideSheetModalColor);border-end-start-radius:cw-var(--cw-Surface-sideSheetShape);border-start-start-radius:cw-var(--cw-Surface-sideSheetShape)}.cw-SideSheet-modal[data-cw-side-sheet-edge=start]{border-end-end-radius:cw-var(--cw-Surface-sideSheetShape);border-end-start-radius:0;border-start-end-radius:cw-var(--cw-Surface-sideSheetShape);border-start-start-radius:0}.cw-SideSheet-detached{--_cw-SideSheet-margin: cw-var(--cw-Surface-sideSheetDetachedMargin);border-radius:cw-var(--cw-Surface-sideSheetShape)}.cw-SideSheet-header{align-items:center;box-sizing:border-box;display:flex;flex:none;gap:16px;padding-block:16px;padding-inline:24px}.cw-SideSheet-header:has(>.cw-SideSheet-icon:not(:empty)){padding-inline-start:16px}.cw-SideSheet-title{-cw-typescale:--cw-Typescale-title-large;color:var(--_cw-SideSheet-headlineColor);flex:1 1 auto;margin:0;min-inline-size:0}.cw-SideSheet-body{box-sizing:border-box;flex:1 1 auto;min-block-size:0;overflow:auto;padding-block-end:24px;padding-inline:24px}.cw-SideSheet-actions{align-items:center;border-block-start-color:var(--_cw-SideSheet-dividerColor);border-block-start-style:solid;border-block-start-width:1px;box-sizing:border-box;display:flex;flex:none;gap:8px;padding-block:16px;padding-inline:24px}.cw-SideSheet-icon:empty,.cw-SideSheet-actions:empty,.cw-SideSheet-noDismiss .cw-SideSheet-dismiss{display:none}@media (forced-colors: active){.cw-Dialog,.cw-FullScreenDialog,.cw-ModalBottomSheet,.cw-BottomSheet>.cw-BottomSheet-surface,.cw-SideSheet{outline-color:CanvasText;outline-style:solid;outline-width:2px}}.cw-ModalBottomSheet{--cw-Surface-dragHandleColor: cw-var(--cw-Surface-dragHandleColor, default);--cw-Surface-sheetColor: cw-var(--cw-Surface-sheetColor, default);--cw-Surface-sheetElevation: cw-var(--cw-Surface-sheetElevation, default);--cw-Surface-sheetShape: cw-var(--cw-Surface-sheetShape, default);--cw-elevationShadow-level: cw-var(--cw-Surface-sheetElevation);--_cw-BottomSheet-detent: max(0px, 100% - 50dvh);--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-spatial-default-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-spatial-default-easing);--_cw-BottomSheet-handleColor: cw-var(--cw-Surface-dragHandleColor);--_cw-BottomSheet-handleHeight: cw-var(--cw-Surface-dragHandleHeight);--_cw-BottomSheet-handleWidth: cw-var(--cw-Surface-dragHandleWidth);background-color:cw-var(--cw-Surface-sheetColor);border-start-end-radius:cw-var(--cw-Surface-sheetShape);border-start-start-radius:cw-var(--cw-Surface-sheetShape);border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);flex-direction:column;inline-size:100%;inset-block-end:0;inset-block-start:auto;inset-inline:0;margin-block:0;margin-inline:auto;max-block-size:100%;max-inline-size:cw-var(--cw-Surface-sheetMaxWidth);overflow:hidden;padding:0;position:fixed;transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration),cw-var(--cw-Motion-spring-effect-default-duration),var(--_cw-BottomSheet-duration);transition-property:display,overlay,translate;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing),cw-var(--cw-Motion-spring-effect-default-easing),var(--_cw-BottomSheet-easing);translate:0 var(--_cw-BottomSheet-detent)}.cw-ModalBottomSheet[open]{display:flex}.cw-ModalBottomSheet-expanded{--_cw-BottomSheet-detent: 0px}.cw-ModalBottomSheet._cw-BottomSheet-tracking,.cw-BottomSheet._cw-BottomSheet-tracking>.cw-BottomSheet-surface{--_cw-BottomSheet-duration: 0s;--_cw-BottomSheet-overshoot: max(0, -1 * var(--_cw-BottomSheet-offset));scale:1 calc(1 + var(--_cw-BottomSheet-overshoot) / var(--_cw-BottomSheet-height));transform-origin:top;translate:0 calc(var(--_cw-BottomSheet-offset) * 1px)}.cw-ModalBottomSheet._cw-BottomSheet-tracking>.cw-BottomSheet-surface,.cw-BottomSheet._cw-BottomSheet-tracking>.cw-BottomSheet-surface>*{--_cw-BottomSheet-overshoot: inherit;scale:1 calc(var(--_cw-BottomSheet-height) / (var(--_cw-BottomSheet-height) + var(--_cw-BottomSheet-overshoot)));transform-origin:top}.cw-BottomSheet._cw-BottomSheet-tracking:not(.cw-BottomSheet-noDragHandle)>.cw-BottomSheet-surface>.cw-BottomSheet-content{transform-origin:50% calc(-1 * var(--_cw-BottomSheet-handleSize))}.cw-ModalBottomSheet:not([open]){--_cw-BottomSheet-detent: 100%;--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-BottomSheet{--cw-Surface-dragHandleColor: cw-var(--cw-Surface-dragHandleColor, default);--cw-Surface-sheetColor: cw-var(--cw-Surface-sheetColor, default);--cw-Surface-sheetElevation: cw-var(--cw-Surface-sheetElevation, default);--cw-Surface-sheetShape: cw-var(--cw-Surface-sheetShape, default);--_cw-BottomSheet-color: cw-var(--cw-Surface-sheetColor);--_cw-BottomSheet-elevation: cw-var(--cw-Surface-sheetElevation);--_cw-BottomSheet-handleColor: cw-var(--cw-Surface-dragHandleColor);--_cw-BottomSheet-handleHeight: cw-var(--cw-Surface-dragHandleHeight);--_cw-BottomSheet-handleWidth: cw-var(--cw-Surface-dragHandleWidth);--_cw-BottomSheet-maxWidth: cw-var(--cw-Surface-sheetMaxWidth);--_cw-BottomSheet-peek: var( --_cw-BottomSheet-peekHeight, var(--_cw-Scaffold-sheetPeekHeight, cw-var(--cw-Surface-sheetPeekHeight)) );--_cw-BottomSheet-shape: cw-var(--cw-Surface-sheetShape);inset:0;pointer-events:none;position:fixed;transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:display;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-BottomSheet:not(.cw-BottomSheet-open){display:none}.cw-BottomSheet>.cw-BottomSheet-surface{--cw-elevationShadow-level: var(--_cw-BottomSheet-elevation);--_cw-BottomSheet-detent: calc(100% - var(--_cw-BottomSheet-peek));--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-spatial-default-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-spatial-default-easing);background-color:var(--_cw-BottomSheet-color);border-start-end-radius:var(--_cw-BottomSheet-shape);border-start-start-radius:var(--_cw-BottomSheet-shape);box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);inline-size:100%;inset-block-end:0;inset-inline:0;margin-inline:auto;max-block-size:100%;max-inline-size:var(--_cw-BottomSheet-maxWidth);min-block-size:var(--_cw-BottomSheet-peek);pointer-events:auto;position:absolute;transition-duration:var(--_cw-BottomSheet-duration);transition-property:translate;transition-timing-function:var(--_cw-BottomSheet-easing);translate:0 var(--_cw-BottomSheet-detent)}.cw-BottomSheet-expanded>.cw-BottomSheet-surface{--_cw-BottomSheet-detent: 0px}.cw-BottomSheet:not(.cw-BottomSheet-open)>.cw-BottomSheet-surface{--_cw-BottomSheet-detent: 100%;--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-BottomSheet-surface{--_cw-BottomSheet-handleSize: 48px;display:flex;flex-direction:column}.cw-ModalBottomSheet>.cw-BottomSheet-surface{flex:0 1 auto;min-block-size:0}.cw-BottomSheet-dragHandle{align-self:center;appearance:none;background-color:transparent;block-size:var(--_cw-BottomSheet-handleSize);border-radius:cw-var(--cw-CornerRadius-full);border-style:none;color:var(--_cw-BottomSheet-handleColor);cursor:grab;display:grid;flex:none;inline-size:var(--_cw-BottomSheet-handleSize);padding:0;place-items:center;touch-action:none;user-select:none}.cw-BottomSheet-dragHandle:empty:before{background-color:currentcolor;block-size:var(--_cw-BottomSheet-handleHeight);border-radius:cw-var(--cw-CornerRadius-full);content:"";inline-size:var(--_cw-BottomSheet-handleWidth)}.cw-BottomSheet-dragging .cw-BottomSheet-dragHandle{cursor:grabbing}.cw-BottomSheet-noDragHandle .cw-BottomSheet-dragHandle{display:none}.cw-BottomSheet-content{box-sizing:border-box;flex:0 1 auto;min-block-size:0;overflow:auto;overscroll-behavior:contain;padding-block-end:env(safe-area-inset-bottom)}.cw-Scaffold{--_cw-Scaffold-bottomInset: 0px;--_cw-Scaffold-fabSpacing: cw-var(--cw-Surface-scaffoldFabSpacing);background-color:cw-var(--cw-Color-background);box-sizing:border-box;color:cw-var(--cw-Color-onBackground);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;isolation:isolate;min-block-size:100%;min-inline-size:0;position:relative}.cw-Scaffold-topBar{grid-area:1 / 1;min-inline-size:0}.cw-Scaffold-content{box-sizing:border-box;grid-area:2 / 1;min-block-size:0;min-inline-size:0;overflow:auto;padding-block-end:var(--_cw-Scaffold-bottomInset)}.cw-Scaffold-bottomBar{grid-area:4 / 1;min-inline-size:0}.cw-Scaffold-layer{display:grid;grid-area:2 / 1 / 4;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;min-block-size:0;overflow:clip;pointer-events:none;position:relative;z-index:1}.cw-Scaffold-overlay{align-self:end;box-sizing:border-box;display:flex;flex-direction:column;grid-area:1 / 1;min-block-size:0;padding-block-end:var(--_cw-Scaffold-bottomInset);pointer-events:none}._cw-Scaffold-fab-endOverlay:not(:has(>.cw-Scaffold-layer>.cw-Scaffold-sheet>.cw-BottomSheet-open))>.cw-Scaffold-layer{grid-row:2 / 5}._cw-Scaffold-fab-endOverlay:not(:has(>.cw-Scaffold-layer>.cw-Scaffold-sheet>.cw-BottomSheet-open))>.cw-Scaffold-layer>.cw-Scaffold-overlay{grid-row:1 / -1}.cw-Scaffold-sheet{grid-area:2 / 1;min-block-size:0}.cw-Scaffold-sheet>.cw-BottomSheet{block-size:var(--_cw-BottomSheet-peek);position:static}.cw-Scaffold-sheet>:not(.cw-BottomSheet){pointer-events:auto}.cw-Scaffold-snackbar{align-self:center;max-inline-size:100%;pointer-events:none;position:relative;z-index:1}.cw-Scaffold-snackbar:has(>.cw-SnackbarHost){align-self:stretch}.cw-Scaffold-snackbar>.cw-SnackbarHost{inset:auto;padding:12px;position:relative}.cw-Scaffold-fab{align-self:flex-end;margin-block:0 var(--_cw-Scaffold-fabSpacing);margin-inline:var(--_cw-Scaffold-fabSpacing);pointer-events:none}._cw-Scaffold-fab-start>.cw-Scaffold-layer>.cw-Scaffold-overlay>.cw-Scaffold-fab{align-self:flex-start}._cw-Scaffold-fab-center>.cw-Scaffold-layer>.cw-Scaffold-overlay>.cw-Scaffold-fab{align-self:center}.cw-Scaffold-snackbar>:not(.cw-SnackbarHost),.cw-Scaffold-fab>*{pointer-events:auto}.cw-Scaffold-topBar:empty,.cw-Scaffold-bottomBar:empty,.cw-Scaffold-sheet:empty,.cw-Scaffold-snackbar:empty,.cw-Scaffold-fab:empty{display:none}.cw-Scaffold-safeArea{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.cw-Scaffold-safeArea>.cw-Scaffold-topBar{padding-top:env(safe-area-inset-top)}.cw-Scaffold-safeArea>.cw-Scaffold-bottomBar{padding-bottom:env(safe-area-inset-bottom)}.cw-Scaffold-safeArea:has(>.cw-Scaffold-topBar:empty)>.cw-Scaffold-content{padding-top:env(safe-area-inset-top)}.cw-Scaffold-safeArea:has(>.cw-Scaffold-bottomBar:empty){--_cw-Scaffold-bottomInset: env(safe-area-inset-bottom)}.cw-PaneScaffold{box-sizing:border-box;display:flex;gap:cw-var(--cw-Surface-paneSpacing);min-block-size:0;min-inline-size:0;padding-inline:cw-var(--cw-Surface-paneMarginCompact)}.cw-PaneScaffold-pane{box-sizing:border-box;display:none;flex:1 1 0;min-block-size:0;min-inline-size:0;overflow:auto}:is(._cw-PaneScaffold-active-primary>._cw-PaneScaffold-primary,._cw-PaneScaffold-active-secondary>._cw-PaneScaffold-secondary,._cw-PaneScaffold-active-tertiary>._cw-PaneScaffold-tertiary):not(:empty){display:block}@media (min-width: 600px){.cw-PaneScaffold{padding-inline:cw-var(--cw-Surface-paneMargin)}}@media (min-width: 840px){.cw-PaneScaffold>._cw-PaneScaffold-primary:not(:empty),.cw-PaneScaffold:not(._cw-PaneScaffold-active-tertiary)>._cw-PaneScaffold-secondary:not(:empty){display:block}.cw-PaneScaffold>:is(._cw-PaneScaffold-secondary,._cw-PaneScaffold-tertiary){flex:0 0 cw-var(--cw-Surface-panePreferredWidth)}}@media (min-width: 1200px){.cw-PaneScaffold>.cw-PaneScaffold-pane:not(:empty){display:block}.cw-PaneScaffold>:is(._cw-PaneScaffold-secondary,._cw-PaneScaffold-tertiary){flex-basis:cw-var(--cw-Surface-panePreferredWidthExtraLarge)}}.cw-PaneScaffold-pane>.cw-SideSheet:not(.cw-SideSheet-modal){block-size:100%;inline-size:100%;inset:auto;max-inline-size:none;position:relative;translate:none}.cw-PaneScaffold>.cw-PaneScaffold-pane:has(>.cw-SideSheet:not([open]):only-child){display:none}}
|
|
1
|
+
@cw-attribute-roles cw-Surface;@property --_cw-Surface-shape{syntax: "*"; inherits: false;}@property --_cw-BottomSheet-offset{syntax: "<number>"; inherits: false; initial-value: 0;}@property --_cw-BottomSheet-overshoot{syntax: "<number>"; inherits: false; initial-value: 0;}@layer cw-theme{.cw-Surface-expressive,.cw-theme-expressive.cw-Surface,.cw-theme-expressive .cw-Surface,.cw-theme-expressive.cw-List,.cw-theme-expressive .cw-List,.cw-theme-expressive.cw-ListItem,.cw-theme-expressive .cw-ListItem,.cw-theme-expressive.cw-Menu,.cw-theme-expressive .cw-Menu,.cw-theme-expressive.cw-Menu-popup,.cw-theme-expressive .cw-Menu-popup,.cw-theme-expressive.cw-MenuItem,.cw-theme-expressive .cw-MenuItem,.cw-theme-expressive.cw-SwipeToDismiss,.cw-theme-expressive .cw-SwipeToDismiss,.cw-theme-expressive.cw-Carousel,.cw-theme-expressive .cw-Carousel,.cw-theme-expressive.cw-Carousel-viewport,.cw-theme-expressive .cw-Carousel-viewport,.cw-theme-expressive.cw-Carousel-controls button,.cw-theme-expressive .cw-Carousel-controls button{@cw-apply-theme expressive,cw-Surface;}}@layer cw-style{.cw-Surface{--cw-interactable-focusIndicator-color: cw-var(--cw-Surface-focusIndicatorColor);--cw-interactable-focusIndicator-offset: cw-var(--cw-State-focusIndicator-outerOffset);--cw-interactable-focusIndicator-thickness: cw-var(--cw-State-focusIndicator-thickness);background-color:cw-var(--cw-Surface-color);border-color:cw-var(--cw-Surface-outlineColor);border-radius:var(--_cw-Surface-shape, cw-var(--cw-Surface-shape));border-style:solid;border-width:cw-var(--cw-Surface-outlineThickness);box-sizing:border-box;color:cw-var(--cw-Surface-onColor);display:flex;flex-flow:column nowrap;min-inline-size:0;position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,border-color,color,--cw-elevationShadow-level;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-List,.cw-ListItem,.cw-Menu,.cw-Menu-popup,.cw-MenuItem,.cw-SwipeToDismiss,.cw-Carousel,.cw-Carousel-viewport,.cw-Carousel-controls button,.cw-PullToRefresh{--cw-Surface-color: cw-var(--cw-Surface-color, default);--cw-Surface-onColor: cw-var(--cw-Surface-onColor, default);--cw-Surface-shape: cw-var(--cw-Surface-shape, default);--cw-Surface-outlineColor: cw-var(--cw-Surface-outlineColor, default);--cw-Surface-outlineThickness: cw-var(--cw-Surface-outlineThickness, default);--cw-Surface-selectedColor: cw-var(--cw-Surface-selectedColor, default);--cw-Surface-dividerColor: cw-var(--cw-Surface-dividerColor, default);--cw-Surface-dividerThickness: cw-var(--cw-Surface-dividerThickness, default);--cw-Surface-listItemHeight: cw-var(--cw-Surface-listItemHeight, default);--cw-Surface-listItemHeightDense: cw-var(--cw-Surface-listItemHeightDense, default);--cw-Surface-dialogScrimColor: cw-var(--cw-Surface-dialogScrimColor, default);--cw-Surface-dialogShape: cw-var(--cw-Surface-dialogShape, default);--cw-Surface-menuColor: cw-var(--cw-Surface-menuColor, default);--cw-Surface-menuShape: cw-var(--cw-Surface-menuShape, default);--cw-Surface-sheetColor: cw-var(--cw-Surface-sheetColor, default);--cw-Surface-sheetShape: cw-var(--cw-Surface-sheetShape, default);--cw-Surface-sheetPeekHeight: cw-var(--cw-Surface-sheetPeekHeight, default);--cw-Surface-focusIndicatorColor: cw-var(--cw-Surface-focusIndicatorColor, default)}.cw-List,.cw-Menu,.cw-SwipeToDismiss,.cw-Carousel,.cw-PullToRefresh{--cw-surface-color: cw-var(--cw-Surface-color);--cw-surface-on-color: cw-var(--cw-Surface-onColor);--cw-surface-shape: cw-var(--cw-Surface-shape);--cw-surface-outline-color: cw-var(--cw-Surface-outlineColor);--cw-surface-outline-thickness: cw-var(--cw-Surface-outlineThickness);--cw-surface-selected-color: cw-var(--cw-Surface-selectedColor);--cw-surface-divider-color: cw-var(--cw-Surface-dividerColor);--cw-surface-divider-thickness: cw-var(--cw-Surface-dividerThickness);--cw-surface-list-item-height: cw-var(--cw-Surface-listItemHeight);--cw-surface-list-item-height-dense: cw-var(--cw-Surface-listItemHeightDense);--cw-surface-dialog-scrim-color: cw-var(--cw-Surface-dialogScrimColor);--cw-surface-dialog-shape: cw-var(--cw-Surface-dialogShape);--cw-surface-menu-color: cw-var(--cw-Surface-menuColor);--cw-surface-menu-shape: cw-var(--cw-Surface-menuShape);--cw-surface-sheet-color: cw-var(--cw-Surface-sheetColor);--cw-surface-sheet-shape: cw-var(--cw-Surface-sheetShape);--cw-surface-sheet-peek-height: cw-var(--cw-Surface-sheetPeekHeight);--cw-surface-focus-indicator-color: cw-var(--cw-Surface-focusIndicatorColor)}.cw-Surface-clickable,.cw-Surface-selectable{cursor:pointer}.cw-Surface-hover{--cw-interactable-stateLayer-color: currentcolor;--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity)}.cw-Surface-focus{--cw-interactable-stateLayer-color: currentcolor;--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity)}.cw-Surface-press{--cw-interactable-ripple-color: currentcolor;--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity)}.cw-Surface-selected{background-color:cw-var(--cw-Surface-selectedColor);color:cw-var(--cw-Surface-selectedOnColor)}.cw-Surface-disabled{cursor:default;opacity:cw-var(--cw-Surface-disabledOpacity);pointer-events:none;user-select:none}._cw-Surface-surface{--cw-Surface-color: cw-var(--cw-Color-surface-fill)}._cw-Surface-surface-dim{--cw-Surface-color: cw-var(--cw-Color-surface-fillDim)}._cw-Surface-surface-bright{--cw-Surface-color: cw-var(--cw-Color-surface-fillBright)}._cw-Surface-surface-container-lowest{--cw-Surface-color: cw-var(--cw-Color-surface-containerLowest)}._cw-Surface-surface-container-low{--cw-Surface-color: cw-var(--cw-Color-surface-containerLow)}._cw-Surface-surface-container{--cw-Surface-color: cw-var(--cw-Color-surface-container)}._cw-Surface-surface-container-high{--cw-Surface-color: cw-var(--cw-Color-surface-containerHigh)}._cw-Surface-surface-container-highest{--cw-Surface-color: cw-var(--cw-Color-surface-containerHighest)}._cw-Surface-inverse{--cw-Surface-color: cw-var(--cw-Color-surface-inverseFill);--cw-Surface-onColor: cw-var(--cw-Color-surface-inverseOnFill)}._cw-Surface-primary{--cw-Surface-color: cw-var(--cw-Color-primary-fill);--cw-Surface-onColor: cw-var(--cw-Color-primary-onFill)}._cw-Surface-secondary{--cw-Surface-color: cw-var(--cw-Color-secondary-fill);--cw-Surface-onColor: cw-var(--cw-Color-secondary-onFill)}._cw-Surface-tertiary{--cw-Surface-color: cw-var(--cw-Color-tertiary-fill);--cw-Surface-onColor: cw-var(--cw-Color-tertiary-onFill)}._cw-Surface-error{--cw-Surface-color: cw-var(--cw-Color-error-fill);--cw-Surface-onColor: cw-var(--cw-Color-error-onFill)}._cw-Surface-elevation-0{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-0)}._cw-Surface-elevation-1{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-1)}._cw-Surface-elevation-2{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-2)}._cw-Surface-elevation-3{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-3)}._cw-Surface-elevation-4{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-4)}._cw-Surface-elevation-5{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-5)}._cw-Surface-shape-none{--_cw-Surface-shape: cw-var(--cw-CornerRadius-none)}._cw-Surface-shape-extra-small{--_cw-Surface-shape: cw-var(--cw-CornerRadius-xsmall)}._cw-Surface-shape-small{--_cw-Surface-shape: cw-var(--cw-CornerRadius-small)}._cw-Surface-shape-medium{--_cw-Surface-shape: cw-var(--cw-CornerRadius-medium)}._cw-Surface-shape-large{--_cw-Surface-shape: cw-var(--cw-CornerRadius-large)}._cw-Surface-shape-extra-large{--_cw-Surface-shape: cw-var(--cw-CornerRadius-xlarge)}._cw-Surface-shape-full{--_cw-Surface-shape: cw-var(--cw-CornerRadius-full)}.cw-Divider{--cw-Surface-dividerColor: cw-var(--cw-Surface-dividerColor, default);border-color:cw-var(--cw-Surface-dividerColor);border-style:solid;border-width:0;box-sizing:border-box;flex:none}._cw-Divider-horizontal{block-size:0;border-block-start-width:var(--_cw-Divider-thickness, cw-var(--cw-Surface-dividerThickness))}._cw-Divider-vertical{align-self:stretch;border-inline-start-width:var(--_cw-Divider-thickness, cw-var(--cw-Surface-dividerThickness));inline-size:0;min-block-size:1lh}._cw-Divider-horizontal:is(._cw-Divider-inset-start,._cw-Divider-inset-both){margin-inline-start:cw-var(--cw-Surface-dividerInset)}._cw-Divider-horizontal:is(._cw-Divider-inset-end,._cw-Divider-inset-both){margin-inline-end:cw-var(--cw-Surface-dividerInset)}._cw-Divider-vertical:is(._cw-Divider-inset-start,._cw-Divider-inset-both){margin-block-start:cw-var(--cw-Surface-dividerInset)}._cw-Divider-vertical:is(._cw-Divider-inset-end,._cw-Divider-inset-both){margin-block-end:cw-var(--cw-Surface-dividerInset)}.cw-Dialog{--cw-Surface-dialogColor: cw-var(--cw-Surface-dialogColor, default);--cw-Surface-dialogElevation: cw-var(--cw-Surface-dialogElevation, default);--cw-Surface-dialogShape: cw-var(--cw-Surface-dialogShape, default);--cw-elevationShadow-level: cw-var(--cw-Surface-dialogElevation);--_cw-Dialog-effect-duration: cw-var(--cw-Motion-spring-effect-default-duration);--_cw-Dialog-effect-easing: cw-var(--cw-Motion-spring-effect-default-easing);background-color:cw-var(--cw-Surface-dialogColor);border-radius:cw-var(--cw-Surface-dialogShape);border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);inline-size:fit-content;inset:0;margin:auto;max-block-size:calc(100% - (2*cw-var(--cw-Surface-dialogMargin)));max-inline-size:min(cw-var(--cw-Surface-dialogMaxWidth),100% - 2 * cw-var(--cw-Surface-dialogMargin));min-inline-size:min(cw-var(--cw-Surface-dialogMinWidth),100% - 2 * cw-var(--cw-Surface-dialogMargin));overflow:auto;padding:cw-var(--cw-Surface-dialogPadding);position:fixed;transition-behavior:allow-discrete;transition-duration:var(--_cw-Dialog-effect-duration),var(--_cw-Dialog-effect-duration),var(--_cw-Dialog-effect-duration),cw-var(--cw-Motion-spring-spatial-default-duration);transition-property:display,opacity,overlay,scale;transition-timing-function:var(--_cw-Dialog-effect-easing),var(--_cw-Dialog-effect-easing),var(--_cw-Dialog-effect-easing),cw-var(--cw-Motion-spring-spatial-default-easing)}.cw-Dialog:is(:not([open]),._cw-Dialog-closing){--_cw-Dialog-effect-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-Dialog-effect-easing: cw-var(--cw-Motion-spring-effect-fast-easing);opacity:0}:is(.cw-Dialog,.cw-ModalBottomSheet,.cw-SideSheet)::backdrop{--cw-Surface-dialogScrimColor: cw-var(--cw-Surface-dialogScrimColor, default);background-color:cw-scale-opacity(cw-var(--cw-Surface-dialogScrimColor),cw-var(--cw-Surface-dialogScrimOpacity));transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration);transition-property:background-color,display,overlay;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing)}:is(.cw-Dialog,.cw-ModalBottomSheet,.cw-SideSheet):is(:not([open]),._cw-Dialog-closing,._cw-ModalBottomSheet-closing,._cw-SideSheet-closing)::backdrop,._cw-ModalBottomSheet-hiding::backdrop{background-color:transparent}.cw-Dialog:is(:not([open]),._cw-Dialog-closing)::backdrop{transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}@starting-style{.cw-Dialog[open]{opacity:0;scale:.8}:is(.cw-Dialog,.cw-ModalBottomSheet,.cw-SideSheet)[open]::backdrop{background-color:transparent}}.cw-Dialog:focus-visible,.cw-BottomSheet-dragHandle:focus-visible{outline-color:cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);outline-style:solid;outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-FullScreenDialog:focus-visible,.cw-ModalBottomSheet:focus-visible,.cw-BottomSheet-surface:focus-visible,.cw-SideSheet:focus-visible{outline-color:cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-innerOffset);outline-style:solid;outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-AlertDialog{--cw-Surface-dialogHeadlineColor: cw-var(--cw-Surface-dialogHeadlineColor, default);--cw-Surface-dialogIconColor: cw-var(--cw-Surface-dialogIconColor, default);--cw-Surface-dialogSupportingTextColor: cw-var(--cw-Surface-dialogSupportingTextColor, default);--cw-Surface-dividerColor: cw-var(--cw-Surface-dividerColor, default);--_cw-AlertDialog-color: cw-var(--cw-Surface-dialogColor);--_cw-AlertDialog-dividerColor: cw-var(--cw-Surface-dividerColor);--_cw-AlertDialog-headlineColor: cw-var(--cw-Surface-dialogHeadlineColor);--_cw-AlertDialog-iconColor: cw-var(--cw-Surface-dialogIconColor);--_cw-AlertDialog-iconSize: cw-var(--cw-Surface-dialogIconSize);--_cw-AlertDialog-spacing: cw-var(--cw-Surface-dialogSpacing);--_cw-AlertDialog-supportingTextColor: cw-var(--cw-Surface-dialogSupportingTextColor);--_cw-AlertDialog-textSpacing: cw-var(--cw-Surface-dialogPadding);flex-direction:column;max-block-size:min(cw-var(--cw-Surface-dialogMaxHeight),100% - 2 * cw-var(--cw-Surface-dialogMargin));overflow:hidden}.cw-AlertDialog[open]{display:flex}.cw-AlertDialog-icon{align-self:center;color:var(--_cw-AlertDialog-iconColor);display:flex;flex:none;font-size:var(--_cw-AlertDialog-iconSize);margin-block-end:var(--_cw-AlertDialog-spacing)}.cw-AlertDialog-icon>.cw-Icon{--cw-Icon-size: var(--_cw-AlertDialog-iconSize)}.cw-AlertDialog-title{-cw-typescale:--cw-Typescale-headline-small;color:var(--_cw-AlertDialog-headlineColor);flex:none;margin-block-end:var(--_cw-AlertDialog-spacing);margin-block-start:0;margin-inline:0}.cw-AlertDialog:has(>.cw-AlertDialog-icon:not(:empty))>.cw-AlertDialog-title{text-align:center}.cw-AlertDialog-text{-cw-typescale:--cw-Typescale-body-medium;background-attachment:local,local,scroll,scroll;background-image:linear-gradient(var(--_cw-AlertDialog-color) 0 0),linear-gradient(var(--_cw-AlertDialog-color) 0 0),linear-gradient(var(--_cw-AlertDialog-dividerColor) 0 0),linear-gradient(var(--_cw-AlertDialog-dividerColor) 0 0);background-position:top,bottom,top,bottom;background-repeat:no-repeat;background-size:100% 1px;color:var(--_cw-AlertDialog-supportingTextColor);flex:0 1 auto;min-block-size:0;overflow:auto}.cw-AlertDialog-actions{column-gap:8px;display:flex;flex:none;flex-wrap:wrap;justify-content:flex-end;margin-block-start:var(--_cw-AlertDialog-textSpacing);row-gap:12px}.cw-AlertDialog-icon:empty,.cw-AlertDialog-title:empty,.cw-AlertDialog-noDismiss .cw-AlertDialog-dismiss{display:none}.cw-FullScreenDialog{--cw-Surface-fullScreenDialogColor: cw-var(--cw-Surface-fullScreenDialogColor, default);--cw-Surface-fullScreenDialogHeaderScrolledColor: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledColor, default);--cw-Surface-fullScreenDialogHeaderScrolledElevation: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledElevation, default);--_cw-FullScreenDialog-headerHeight: cw-var(--cw-Surface-fullScreenDialogHeaderHeight);--_cw-FullScreenDialog-scrolledColor: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledColor);--_cw-FullScreenDialog-scrolledElevation: cw-var(--cw-Surface-fullScreenDialogHeaderScrolledElevation);--_cw-FullScreenDialog-padding: cw-var(--cw-Surface-dialogPadding);--_cw-FullScreenDialog-duration: cw-var(--cw-Motion-spring-spatial-slow-duration);--_cw-FullScreenDialog-easing: cw-var(--cw-Motion-spring-spatial-slow-easing);background-color:cw-var(--cw-Surface-fullScreenDialogColor);block-size:100%;border-radius:0;border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);flex-direction:column;inline-size:100%;inset:0;margin:0;max-block-size:none;max-inline-size:none;overflow:hidden;padding:0;position:fixed;transition-behavior:allow-discrete;transition-duration:var(--_cw-FullScreenDialog-duration);transition-property:display,overlay,translate;transition-timing-function:var(--_cw-FullScreenDialog-easing)}.cw-FullScreenDialog[open]{display:flex}.cw-FullScreenDialog:is(:not([open]),._cw-FullScreenDialog-closing){--_cw-FullScreenDialog-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-FullScreenDialog-easing: cw-var(--cw-Motion-spring-effect-fast-easing);translate:0 100%}@starting-style{.cw-FullScreenDialog[open]{translate:0 100%}}.cw-FullScreenDialog::backdrop{background-color:transparent}.cw-FullScreenDialog-header{--cw-elevationShadow-level: cw-var(--cw-Elevation-level-0);align-items:center;block-size:var(--_cw-FullScreenDialog-headerHeight);box-sizing:border-box;display:flex;flex:none;padding-inline:4px;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration);transition-property:background-color,--cw-elevationShadow-level;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing)}.cw-FullScreenDialog-scrolled .cw-FullScreenDialog-header{--cw-elevationShadow-level: var(--_cw-FullScreenDialog-scrolledElevation);background-color:var(--_cw-FullScreenDialog-scrolledColor)}.cw-FullScreenDialog-title{-cw-typescale:--cw-Typescale-title-large;flex:1 1 auto;margin-block:0;margin-inline:12px 0;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cw-FullScreenDialog-content{flex:1 1 auto;min-block-size:0;overflow:auto;padding:var(--_cw-FullScreenDialog-padding)}.cw-FullScreenDialog-noConfirm .cw-FullScreenDialog-confirm{display:none}.cw-SideSheet{--cw-Surface-sideSheetColor: cw-var(--cw-Surface-sideSheetColor, default);--cw-Surface-sideSheetDividerColor: cw-var(--cw-Surface-sideSheetDividerColor, default);--cw-Surface-sideSheetHeadlineColor: cw-var(--cw-Surface-sideSheetHeadlineColor, default);--cw-Surface-sideSheetModalColor: cw-var(--cw-Surface-sideSheetModalColor, default);--cw-Surface-sideSheetModalElevation: cw-var(--cw-Surface-sideSheetModalElevation, default);--cw-Surface-sideSheetShape: cw-var(--cw-Surface-sideSheetShape, default);--cw-elevationShadow-level: cw-var(--cw-Elevation-level-0);--_cw-SideSheet-direction: 1;--_cw-SideSheet-dividerColor: cw-var(--cw-Surface-sideSheetDividerColor);--_cw-SideSheet-duration: cw-var(--cw-Motion-spring-spatial-default-duration);--_cw-SideSheet-easing: cw-var(--cw-Motion-spring-spatial-default-easing);--_cw-SideSheet-headlineColor: cw-var(--cw-Surface-sideSheetHeadlineColor);--_cw-SideSheet-hidden: calc(var(--_cw-SideSheet-direction) * (100% + var(--_cw-SideSheet-margin)));--_cw-SideSheet-margin: 0px;background-color:cw-var(--cw-Surface-sideSheetColor);block-size:calc(100% - 2 * var(--_cw-SideSheet-margin));border-radius:0;border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);flex-direction:column;inline-size:cw-var(--cw-Surface-sideSheetWidth);inset-block:var(--_cw-SideSheet-margin);inset-inline-end:var(--_cw-SideSheet-margin);inset-inline-start:auto;margin:0;max-block-size:none;max-inline-size:calc(100% - 2 * var(--_cw-SideSheet-margin));padding:0;position:fixed;transition-behavior:allow-discrete;transition-duration:var(--_cw-SideSheet-duration);transition-property:display,overlay,translate;transition-timing-function:var(--_cw-SideSheet-easing)}.cw-SideSheet[open]{display:flex}.cw-SideSheet[data-cw-side-sheet-edge=start]{--_cw-SideSheet-direction: -1;inset-inline-end:auto;inset-inline-start:var(--_cw-SideSheet-margin)}.cw-SideSheet:dir(rtl){--_cw-SideSheet-direction: -1}.cw-SideSheet[data-cw-side-sheet-edge=start]:dir(rtl){--_cw-SideSheet-direction: 1}.cw-SideSheet:is(:not([open]),._cw-SideSheet-closing){--_cw-SideSheet-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-SideSheet-easing: cw-var(--cw-Motion-spring-effect-fast-easing);translate:var(--_cw-SideSheet-hidden) 0}@starting-style{.cw-SideSheet[open]{translate:var(--_cw-SideSheet-hidden) 0}}.cw-SideSheet-modal{--cw-elevationShadow-level: cw-var(--cw-Surface-sideSheetModalElevation);background-color:cw-var(--cw-Surface-sideSheetModalColor);border-end-start-radius:cw-var(--cw-Surface-sideSheetShape);border-start-start-radius:cw-var(--cw-Surface-sideSheetShape)}.cw-SideSheet-modal[data-cw-side-sheet-edge=start]{border-end-end-radius:cw-var(--cw-Surface-sideSheetShape);border-end-start-radius:0;border-start-end-radius:cw-var(--cw-Surface-sideSheetShape);border-start-start-radius:0}.cw-SideSheet-detached{--_cw-SideSheet-margin: cw-var(--cw-Surface-sideSheetDetachedMargin);border-radius:cw-var(--cw-Surface-sideSheetShape)}.cw-SideSheet-header{align-items:center;box-sizing:border-box;display:flex;flex:none;gap:16px;padding-block:16px;padding-inline:24px}.cw-SideSheet-header:has(>.cw-SideSheet-icon:not(:empty)){padding-inline-start:16px}.cw-SideSheet-title{-cw-typescale:--cw-Typescale-title-large;color:var(--_cw-SideSheet-headlineColor);flex:1 1 auto;margin:0;min-inline-size:0}.cw-SideSheet-body{box-sizing:border-box;flex:1 1 auto;min-block-size:0;overflow:auto;padding-block-end:24px;padding-inline:24px}.cw-SideSheet-actions{align-items:center;border-block-start-color:var(--_cw-SideSheet-dividerColor);border-block-start-style:solid;border-block-start-width:1px;box-sizing:border-box;display:flex;flex:none;gap:8px;padding-block:16px;padding-inline:24px}.cw-SideSheet-icon:empty,.cw-SideSheet-actions:empty,.cw-SideSheet-noDismiss .cw-SideSheet-dismiss{display:none}@media (forced-colors: active){.cw-Dialog,.cw-FullScreenDialog,.cw-ModalBottomSheet,.cw-BottomSheet>.cw-BottomSheet-surface,.cw-SideSheet{outline-color:CanvasText;outline-style:solid;outline-width:2px}}.cw-ModalBottomSheet{--cw-Surface-dragHandleColor: cw-var(--cw-Surface-dragHandleColor, default);--cw-Surface-sheetColor: cw-var(--cw-Surface-sheetColor, default);--cw-Surface-sheetElevation: cw-var(--cw-Surface-sheetElevation, default);--cw-Surface-sheetShape: cw-var(--cw-Surface-sheetShape, default);--cw-elevationShadow-level: cw-var(--cw-Surface-sheetElevation);--_cw-BottomSheet-detent: max(0px, 100% - 50dvh);--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-spatial-default-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-spatial-default-easing);--_cw-BottomSheet-handleColor: cw-var(--cw-Surface-dragHandleColor);--_cw-BottomSheet-handleHeight: cw-var(--cw-Surface-dragHandleHeight);--_cw-BottomSheet-handleWidth: cw-var(--cw-Surface-dragHandleWidth);background-color:cw-var(--cw-Surface-sheetColor);border-start-end-radius:cw-var(--cw-Surface-sheetShape);border-start-start-radius:cw-var(--cw-Surface-sheetShape);border-style:none;box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);flex-direction:column;inline-size:100%;inset-block-end:0;inset-block-start:auto;inset-inline:0;margin-block:0;margin-inline:auto;max-block-size:100%;max-inline-size:cw-var(--cw-Surface-sheetMaxWidth);overflow:hidden;padding:0;position:fixed;transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration),cw-var(--cw-Motion-spring-effect-default-duration),var(--_cw-BottomSheet-duration);transition-property:display,overlay,translate;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing),cw-var(--cw-Motion-spring-effect-default-easing),var(--_cw-BottomSheet-easing);translate:0 var(--_cw-BottomSheet-detent)}.cw-ModalBottomSheet[open]{display:flex}.cw-ModalBottomSheet-expanded{--_cw-BottomSheet-detent: 0px}.cw-ModalBottomSheet._cw-BottomSheet-tracking,.cw-BottomSheet._cw-BottomSheet-tracking>.cw-BottomSheet-surface{--_cw-BottomSheet-duration: 0s;--_cw-BottomSheet-overshoot: max(0, -1 * var(--_cw-BottomSheet-offset));scale:1 calc(1 + var(--_cw-BottomSheet-overshoot) / var(--_cw-BottomSheet-height));transform-origin:top;translate:0 calc(var(--_cw-BottomSheet-offset) * 1px)}.cw-ModalBottomSheet._cw-BottomSheet-tracking>.cw-BottomSheet-surface,.cw-BottomSheet._cw-BottomSheet-tracking>.cw-BottomSheet-surface>*{--_cw-BottomSheet-overshoot: inherit;scale:1 calc(var(--_cw-BottomSheet-height) / (var(--_cw-BottomSheet-height) + var(--_cw-BottomSheet-overshoot)));transform-origin:top}.cw-BottomSheet._cw-BottomSheet-tracking:not(.cw-BottomSheet-noDragHandle)>.cw-BottomSheet-surface>.cw-BottomSheet-content{transform-origin:50% calc(-1 * var(--_cw-BottomSheet-handleSize))}.cw-ModalBottomSheet:is(:not([open]),._cw-ModalBottomSheet-closing){--_cw-BottomSheet-detent: 100%;--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-BottomSheet{--cw-Surface-dragHandleColor: cw-var(--cw-Surface-dragHandleColor, default);--cw-Surface-sheetColor: cw-var(--cw-Surface-sheetColor, default);--cw-Surface-sheetElevation: cw-var(--cw-Surface-sheetElevation, default);--cw-Surface-sheetShape: cw-var(--cw-Surface-sheetShape, default);--_cw-BottomSheet-color: cw-var(--cw-Surface-sheetColor);--_cw-BottomSheet-elevation: cw-var(--cw-Surface-sheetElevation);--_cw-BottomSheet-handleColor: cw-var(--cw-Surface-dragHandleColor);--_cw-BottomSheet-handleHeight: cw-var(--cw-Surface-dragHandleHeight);--_cw-BottomSheet-handleWidth: cw-var(--cw-Surface-dragHandleWidth);--_cw-BottomSheet-maxWidth: cw-var(--cw-Surface-sheetMaxWidth);--_cw-BottomSheet-peek: var( --_cw-BottomSheet-peekHeight, var(--_cw-Scaffold-sheetPeekHeight, cw-var(--cw-Surface-sheetPeekHeight)) );--_cw-BottomSheet-shape: cw-var(--cw-Surface-sheetShape);inset:0;pointer-events:none;position:fixed;transition-behavior:allow-discrete;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:display;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-BottomSheet:not(.cw-BottomSheet-open){display:none}.cw-BottomSheet>.cw-BottomSheet-surface{--cw-elevationShadow-level: var(--_cw-BottomSheet-elevation);--_cw-BottomSheet-detent: calc(100% - var(--_cw-BottomSheet-peek));--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-spatial-default-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-spatial-default-easing);background-color:var(--_cw-BottomSheet-color);border-start-end-radius:var(--_cw-BottomSheet-shape);border-start-start-radius:var(--_cw-BottomSheet-shape);box-sizing:border-box;color:cw-var(--cw-Color-surface-onFill);inline-size:100%;inset-block-end:0;inset-inline:0;margin-inline:auto;max-block-size:100%;max-inline-size:var(--_cw-BottomSheet-maxWidth);min-block-size:var(--_cw-BottomSheet-peek);pointer-events:auto;position:absolute;transition-duration:var(--_cw-BottomSheet-duration);transition-property:translate;transition-timing-function:var(--_cw-BottomSheet-easing);translate:0 var(--_cw-BottomSheet-detent)}.cw-BottomSheet-expanded>.cw-BottomSheet-surface{--_cw-BottomSheet-detent: 0px}.cw-BottomSheet:not(.cw-BottomSheet-open)>.cw-BottomSheet-surface{--_cw-BottomSheet-detent: 100%;--_cw-BottomSheet-duration: cw-var(--cw-Motion-spring-effect-fast-duration);--_cw-BottomSheet-easing: cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-BottomSheet-surface{--_cw-BottomSheet-handleSize: 48px;display:flex;flex-direction:column}.cw-ModalBottomSheet>.cw-BottomSheet-surface{flex:0 1 auto;min-block-size:0}.cw-BottomSheet-dragHandle{align-self:center;appearance:none;background-color:transparent;block-size:var(--_cw-BottomSheet-handleSize);border-radius:cw-var(--cw-CornerRadius-full);border-style:none;color:var(--_cw-BottomSheet-handleColor);cursor:grab;display:grid;flex:none;inline-size:var(--_cw-BottomSheet-handleSize);padding:0;place-items:center;touch-action:none;user-select:none}.cw-BottomSheet-dragHandle:empty:before{background-color:currentcolor;block-size:var(--_cw-BottomSheet-handleHeight);border-radius:cw-var(--cw-CornerRadius-full);content:"";inline-size:var(--_cw-BottomSheet-handleWidth)}.cw-BottomSheet-dragging .cw-BottomSheet-dragHandle{cursor:grabbing}.cw-BottomSheet-noDragHandle .cw-BottomSheet-dragHandle{display:none}.cw-BottomSheet-content{box-sizing:border-box;flex:0 1 auto;min-block-size:0;overflow:auto;overscroll-behavior:contain;padding-block-end:env(safe-area-inset-bottom)}.cw-Scaffold{--_cw-Scaffold-bottomInset: 0px;--_cw-Scaffold-fabSpacing: cw-var(--cw-Surface-scaffoldFabSpacing);background-color:cw-var(--cw-Color-background);box-sizing:border-box;color:cw-var(--cw-Color-onBackground);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;isolation:isolate;min-block-size:100%;min-inline-size:0;position:relative}.cw-Scaffold-topBar{grid-area:1 / 1;min-inline-size:0}.cw-Scaffold-content{box-sizing:border-box;grid-area:2 / 1;min-block-size:0;min-inline-size:0;overflow:auto;padding-block-end:var(--_cw-Scaffold-bottomInset)}.cw-Scaffold-bottomBar{grid-area:4 / 1;min-inline-size:0}.cw-Scaffold-layer{display:grid;grid-area:2 / 1 / 4;grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;min-block-size:0;overflow:clip;pointer-events:none;position:relative;z-index:1}.cw-Scaffold-overlay{align-self:end;box-sizing:border-box;display:flex;flex-direction:column;grid-area:1 / 1;min-block-size:0;padding-block-end:var(--_cw-Scaffold-bottomInset);pointer-events:none}._cw-Scaffold-fab-endOverlay:not(:has(>.cw-Scaffold-layer>.cw-Scaffold-sheet>.cw-BottomSheet-open))>.cw-Scaffold-layer{grid-row:2 / 5}._cw-Scaffold-fab-endOverlay:not(:has(>.cw-Scaffold-layer>.cw-Scaffold-sheet>.cw-BottomSheet-open))>.cw-Scaffold-layer>.cw-Scaffold-overlay{grid-row:1 / -1}.cw-Scaffold-sheet{grid-area:2 / 1;min-block-size:0}.cw-Scaffold-sheet>.cw-BottomSheet{block-size:var(--_cw-BottomSheet-peek);position:static}.cw-Scaffold-sheet>:not(.cw-BottomSheet){pointer-events:auto}.cw-Scaffold-snackbar{align-self:center;max-inline-size:100%;pointer-events:none;position:relative;z-index:1}.cw-Scaffold-snackbar:has(>.cw-SnackbarHost){align-self:stretch}.cw-Scaffold-snackbar>.cw-SnackbarHost{inset:auto;padding:12px;position:relative}.cw-Scaffold-fab{align-self:flex-end;margin-block:0 var(--_cw-Scaffold-fabSpacing);margin-inline:var(--_cw-Scaffold-fabSpacing);pointer-events:none}._cw-Scaffold-fab-start>.cw-Scaffold-layer>.cw-Scaffold-overlay>.cw-Scaffold-fab{align-self:flex-start}._cw-Scaffold-fab-center>.cw-Scaffold-layer>.cw-Scaffold-overlay>.cw-Scaffold-fab{align-self:center}.cw-Scaffold-snackbar>:not(.cw-SnackbarHost),.cw-Scaffold-fab>*{pointer-events:auto}.cw-Scaffold-topBar:empty,.cw-Scaffold-bottomBar:empty,.cw-Scaffold-sheet:empty,.cw-Scaffold-snackbar:empty,.cw-Scaffold-fab:empty{display:none}.cw-Scaffold-safeArea{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.cw-Scaffold-safeArea>.cw-Scaffold-topBar{padding-top:env(safe-area-inset-top)}.cw-Scaffold-safeArea>.cw-Scaffold-bottomBar{padding-bottom:env(safe-area-inset-bottom)}.cw-Scaffold-safeArea:has(>.cw-Scaffold-topBar:empty)>.cw-Scaffold-content{padding-top:env(safe-area-inset-top)}.cw-Scaffold-safeArea:has(>.cw-Scaffold-bottomBar:empty){--_cw-Scaffold-bottomInset: env(safe-area-inset-bottom)}.cw-PaneScaffold{box-sizing:border-box;display:flex;gap:cw-var(--cw-Surface-paneSpacing);min-block-size:0;min-inline-size:0;padding-inline:cw-var(--cw-Surface-paneMarginCompact)}.cw-PaneScaffold-pane{box-sizing:border-box;display:none;flex:1 1 0;min-block-size:0;min-inline-size:0;overflow:auto}:is(._cw-PaneScaffold-active-primary>._cw-PaneScaffold-primary,._cw-PaneScaffold-active-secondary>._cw-PaneScaffold-secondary,._cw-PaneScaffold-active-tertiary>._cw-PaneScaffold-tertiary):not(:empty){display:block}@media (min-width: 600px){.cw-PaneScaffold{padding-inline:cw-var(--cw-Surface-paneMargin)}}@media (min-width: 840px){.cw-PaneScaffold>._cw-PaneScaffold-primary:not(:empty),.cw-PaneScaffold:not(._cw-PaneScaffold-active-tertiary)>._cw-PaneScaffold-secondary:not(:empty){display:block}.cw-PaneScaffold>:is(._cw-PaneScaffold-secondary,._cw-PaneScaffold-tertiary){flex:0 0 cw-var(--cw-Surface-panePreferredWidth)}}@media (min-width: 1200px){.cw-PaneScaffold>.cw-PaneScaffold-pane:not(:empty){display:block}.cw-PaneScaffold>:is(._cw-PaneScaffold-secondary,._cw-PaneScaffold-tertiary){flex-basis:cw-var(--cw-Surface-panePreferredWidthExtraLarge)}}.cw-PaneScaffold-pane>.cw-SideSheet:not(.cw-SideSheet-modal){block-size:100%;inline-size:100%;inset:auto;max-inline-size:none;position:relative;translate:none}.cw-PaneScaffold>.cw-PaneScaffold-pane:has(>.cw-SideSheet:is(:not([open]),._cw-SideSheet-closing):only-child){display:none}}
|
|
@@ -241,6 +241,17 @@ export declare function computedStyleOf(element: Element): CSSStyleDeclaration;
|
|
|
241
241
|
* @returns constructor, or `undefined` when the realm does not support mutation observers
|
|
242
242
|
*/
|
|
243
243
|
export declare function mutationObserverOf(node: Node): typeof MutationObserver | undefined;
|
|
244
|
+
/**
|
|
245
|
+
* Determine the total time a transition of an element's property takes, including its delay.
|
|
246
|
+
*
|
|
247
|
+
* Transition lists repeat cyclically when they are shorter than `transition-property`, as CSS
|
|
248
|
+
* specifies; the last entry naming one of `properties`, or `all`, determines the time.
|
|
249
|
+
*
|
|
250
|
+
* @param elem - element to read the computed transition of
|
|
251
|
+
* @param properties - names under which the transitioned property may be listed
|
|
252
|
+
* @returns transition time in milliseconds, or `0` when the property does not transition
|
|
253
|
+
*/
|
|
254
|
+
export declare function transitionTimeOf(elem: Element, properties: readonly string[]): number;
|
|
244
255
|
/**
|
|
245
256
|
* Invoke a callback once a transition of an element's property completes.
|
|
246
257
|
*
|
|
@@ -245,7 +245,9 @@ export declare function activeElementOf(node: Node): HTMLElement | null;
|
|
|
245
245
|
* | {@link DialogController.close | `close`} | closes, then notifies | asks `onOpenChange` |
|
|
246
246
|
*
|
|
247
247
|
* While the dialog is open, the `<css>-open` class is applied, where `<css>` is the public CSS
|
|
248
|
-
* class name the controller is constructed with.
|
|
248
|
+
* class name the controller is constructed with. In an engine which does not {@link
|
|
249
|
+
* supportsOverlay | support `overlay`}, the private `_<css>-closing` class is applied while a
|
|
250
|
+
* closed dialog exits with its native dialog still open.
|
|
249
251
|
*
|
|
250
252
|
* @typeParam P - component properties type
|
|
251
253
|
*/
|