@ada-cx/lovelace 1.4.0 → 1.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Banner/Banner.css.d.ts +1 -0
- package/dist/components/Banner/Banner.css.js +7 -0
- package/dist/components/Banner/Banner.css.js.map +1 -0
- package/dist/components/Banner/Banner.d.ts +51 -0
- package/dist/components/Banner/Banner.js +25 -0
- package/dist/components/Banner/Banner.js.map +1 -0
- package/dist/components/Banner/BannerSurface.d.ts +17 -0
- package/dist/components/Banner/BannerSurface.js +65 -0
- package/dist/components/Banner/BannerSurface.js.map +1 -0
- package/dist/components/Banner/index.d.ts +1 -0
- package/dist/components/BubbleOverlay/BubbleOverlay.js +21 -20
- package/dist/components/BubbleOverlay/BubbleOverlay.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.css.d.ts +1 -0
- package/dist/components/Checkbox/Checkbox.css.js +6 -6
- package/dist/components/Checkbox/Checkbox.css.js.map +1 -1
- package/dist/components/Checkbox/CheckboxGroup.d.ts +15 -0
- package/dist/components/Checkbox/CheckboxGroup.js +16 -0
- package/dist/components/Checkbox/CheckboxGroup.js.map +1 -0
- package/dist/components/Checkbox/index.d.ts +1 -0
- package/dist/components/Dialog/DialogIcon.js +5 -5
- package/dist/components/DialogOverlay/DialogOverlay.js +23 -22
- package/dist/components/DialogOverlay/DialogOverlay.js.map +1 -1
- package/dist/components/FullscreenOverlay/FullscreenOverlay.js +21 -20
- package/dist/components/FullscreenOverlay/FullscreenOverlay.js.map +1 -1
- package/dist/components/Input/InputRoot.js +4 -4
- package/dist/components/Input/InputTextArea.js +7 -7
- package/dist/components/MenuItem/MenuItemRoot.js +9 -9
- package/dist/components/SheetOverlay/SheetOverlay.js +22 -21
- package/dist/components/SheetOverlay/SheetOverlay.js.map +1 -1
- package/dist/components/ToastNotification/ToastNotification.css.d.ts +1 -14
- package/dist/components/ToastNotification/ToastNotification.css.js +1 -9
- package/dist/components/ToastNotification/ToastNotification.css.js.map +1 -1
- package/dist/components/ToastNotification/ToastNotification.d.ts +30 -11
- package/dist/components/ToastNotification/ToastNotification.js +29 -18
- package/dist/components/ToastNotification/ToastNotification.js.map +1 -1
- package/dist/components/ToastNotification/index.d.ts +1 -1
- package/dist/components/ToastRegion/ToastContent.d.ts +9 -0
- package/dist/components/ToastRegion/ToastRegion.css.d.ts +2 -0
- package/dist/components/ToastRegion/ToastRegion.css.js +7 -0
- package/dist/components/ToastRegion/ToastRegion.css.js.map +1 -0
- package/dist/components/ToastRegion/ToastRegion.d.ts +45 -0
- package/dist/components/ToastRegion/ToastRegion.js +38 -0
- package/dist/components/ToastRegion/ToastRegion.js.map +1 -0
- package/dist/components/ToastRegion/ToastRegionItem.d.ts +13 -0
- package/dist/components/ToastRegion/ToastRegionItem.js +49 -0
- package/dist/components/ToastRegion/ToastRegionItem.js.map +1 -0
- package/dist/components/ToastRegion/ToastRegionLandmark.d.ts +15 -0
- package/dist/components/ToastRegion/ToastRegionLandmark.js +62 -0
- package/dist/components/ToastRegion/ToastRegionLandmark.js.map +1 -0
- package/dist/components/ToastRegion/index.d.ts +4 -0
- package/dist/components/ToastRegion/index.js +3 -0
- package/dist/components/Tooltip/Tooltip.js +8 -8
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/overlayRegistry.d.ts +22 -0
- package/dist/hooks/overlayRegistry.js +32 -0
- package/dist/hooks/overlayRegistry.js.map +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +77 -72
- package/dist/runtime/LovelaceProvider.js +12 -12
- package/dist/style.css +1 -1
- package/dist/utils/animation.d.ts +28 -0
- package/dist/utils/animation.js +68 -0
- package/dist/utils/animation.js.map +1 -0
- package/package.json +3 -2
package/dist/style.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
._1xn6t060{align-items:flex-start;gap:var(--lovelace-gap-12);display:flex}._1xn6t061{text-align:start;min-width:0;min-height:24px;color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);overflow-wrap:anywhere;word-break:break-word;flex-direction:column;flex:1 0 0;justify-content:center;margin:0;display:flex}.kmbju21{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-avatar);background-color:var(--lovelace-avatar-background);color:var(--lovelace-avatar-content);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-semi-bold);text-align:center;-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden}.kmbju22{width:24px;height:24px;font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body)}.kmbju23{width:36px;height:36px;font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body)}.kmbju24{width:48px;height:48px;font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body)}.kmbju25{width:72px;height:72px;font-size:var(--lovelace-font-size-title-large);line-height:var(--lovelace-line-height-title-large)}.kmbju26{flex-shrink:0}.kmbju27{width:24px;height:24px}.kmbju28{width:36px;height:36px}.kmbju29{width:48px;height:48px}.kmbju2a{width:72px;height:72px}.kmbju20 [data-slot=image]{object-fit:cover;border-radius:inherit;width:100%;height:100%;position:absolute;inset:0}.kmbju20 [data-slot=icon]{flex-shrink:0}.kmbju20[data-size=sm] [data-slot=icon]{font-size:var(--lovelace-icon-size-sm)}.kmbju20[data-size=md] [data-slot=icon]{font-size:var(--lovelace-icon-size-md)}.kmbju20[data-size=lg] [data-slot=icon]{font-size:32px}.kmbju20[data-size=xl] [data-slot=icon]{font-size:36px}.xywi8y0{padding:var(--lovelace-padding-16);justify-content:flex-end;align-items:center}.xywi8y1{background-color:var(--lovelace-color-background-default);border-radius:var(--lovelace-border-radius-container);flex-direction:column;width:fit-content;max-width:min(320px,100%);min-height:0;max-height:100%;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 24px 4px #0000001f}.xywi8y1[data-entering],.xywi8y1[data-exiting]{transform:translateY(8px)}.xywi8y2{outline:none;flex-direction:column;flex:auto;min-height:0;max-height:100%;display:flex}@media (prefers-reduced-motion:no-preference){.xywi8y1{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}._1r1codi0{z-index:200;flex-direction:column;display:flex;position:fixed;inset:0}._1r1codi0[data-entering],._1r1codi0[data-exiting]{opacity:0}@media (prefers-reduced-motion:no-preference){._1r1codi0{transition:opacity var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}.ateptb1{isolation:isolate;justify-content:center;align-items:center;gap:var(--lovelace-gap-8);padding-inline:var(--lovelace-padding-12);box-sizing:border-box;border:var(--lovelace-border-width-default) solid transparent;border-radius:var(--lovelace-border-radius-button);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;text-decoration:none;display:inline-flex;position:relative}.ateptb1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.ateptb1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.ateptb1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.ateptb1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.ateptb1[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.ateptb1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.ateptb2{background-color:var(--lovelace-button-primary-background);color:var(--lovelace-button-primary-content)}.ateptb2[data-disabled]{background-color:var(--lovelace-color-background-disabled)}.ateptb3{background-color:var(--lovelace-color-background-destructive);color:var(--lovelace-color-content-on-destructive)}.ateptb3[data-disabled]{background-color:var(--lovelace-color-background-disabled)}.ateptb4{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);border-color:var(--lovelace-color-border-default)}.ateptb5{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-destructive);border-color:var(--lovelace-color-border-destructive)}.ateptb6{color:var(--lovelace-color-content-default);background-color:#0000}.ateptb7{color:var(--lovelace-color-content-destructive);background-color:#0000}.ateptb8{height:40px}.ateptb9{height:32px}.ateptb0 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){.ateptb1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.s7h2sn1{font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-default);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.s7h2sn1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.s7h2sn2{align-items:center;gap:var(--lovelace-gap-12);display:inline-flex}.s7h2sn3{isolation:isolate;box-sizing:border-box;align-items:center;gap:var(--lovelace-gap-12);min-height:40px;padding-inline:var(--lovelace-padding-8);padding-block:var(--lovelace-padding-4);border-radius:var(--lovelace-border-radius-button);border:var(--lovelace-border-width-default) solid transparent;background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;display:flex;position:relative}.s7h2sn3:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.s7h2sn3[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.s7h2sn3[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.s7h2sn3[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.s7h2sn3[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.s7h2sn3[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.s7h2sn0>[data-slot=icon]{font-size:var(--lovelace-icon-size-lg);flex-shrink:0}.s7h2sn0>[data-slot=label]{text-align:start;overflow-wrap:anywhere;flex:1;min-width:0}.s7h2sn4{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-6);border-style:solid;border-width:var(--lovelace-border-width-default);border-color:var(--lovelace-color-border-default);background-color:var(--lovelace-color-background-default);width:24px;height:24px;color:var(--lovelace-color-content-inverse);transition-property:border-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);flex-shrink:0;position:relative}.s7h2sn4:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.s7h2sn5{color:currentColor;opacity:0;pointer-events:none;width:16px;height:16px;margin:auto;position:absolute;inset:0}[data-selected]>.s7h2sn4,[data-indeterminate]>.s7h2sn4{background-color:var(--lovelace-color-background-inverse);border-color:#0000}[data-hovered]:not([data-disabled]):not([data-selected]):not([data-indeterminate])>.s7h2sn4[data-state-layer]{border-color:var(--lovelace-color-border-medium)}[data-hovered]:not([data-disabled])>.s7h2sn4[data-state-layer]:after{opacity:var(--lovelace-opacity-state-hover)}[data-focus-visible]:not([data-disabled])>.s7h2sn4[data-state-layer]:after{opacity:var(--lovelace-opacity-state-focus)}[data-pressed]:not([data-disabled])>.s7h2sn4[data-state-layer]:after{opacity:var(--lovelace-opacity-state-pressed)}[data-focus-visible]:not([data-disabled])>.s7h2sn4[data-state-layer]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}[data-disabled]>.s7h2sn4{background-color:var(--lovelace-color-background-disabled);border-color:var(--lovelace-color-border-default);color:var(--lovelace-color-content-disabled)}[data-selected]:not([data-indeterminate])>.s7h2sn4>.s7h2sn5[data-glyph=check],[data-indeterminate]>.s7h2sn4>.s7h2sn5[data-glyph=dash]{opacity:1}@media (forced-colors:active){.s7h2sn3[data-focus-visible]:not([data-disabled]),[data-focus-visible]:not([data-disabled])>.s7h2sn4[data-state-layer]{outline-offset:2px;outline:2px solid highlight}}._18cnc771{isolation:isolate;box-sizing:border-box;border:var(--lovelace-border-width-default) solid transparent;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;justify-content:center;align-items:center;display:inline-flex;position:relative}._18cnc771:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}._18cnc771:not([data-selected]){background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);border-color:var(--lovelace-color-border-default)}._18cnc771[data-selected]{background-color:var(--lovelace-chip-background-selected);color:var(--lovelace-color-content-on-accent);border-color:#0000}._18cnc771[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}._18cnc771[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}._18cnc771[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}._18cnc771[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}._18cnc771[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}._18cnc772{min-width:80px;padding-inline:var(--lovelace-padding-12);border-radius:var(--lovelace-border-radius-pill)}._18cnc773,._18cnc774{border-radius:var(--lovelace-border-radius-button)}._18cnc777{height:40px}._18cnc778{height:48px}._18cnc779{width:40px;height:40px}._18cnc77a{width:48px;height:48px}._18cnc77b{width:40px;height:40px}._18cnc77c{width:48px;height:48px;font-size:var(--lovelace-font-size-title-large)}._18cnc770 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){._18cnc771[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.onnuc90{text-align:center;align-items:center;gap:var(--lovelace-gap-16);padding:var(--lovelace-padding-16);flex-direction:column;display:flex}.onnuc91{flex-shrink:0;font-size:32px;line-height:0;display:flex}.onnuc92{color:var(--lovelace-color-content-warning)}.onnuc93{color:var(--lovelace-color-content-success)}.onnuc94{align-items:center;gap:var(--lovelace-gap-8);flex-direction:column;width:100%;display:flex}.onnuc95{text-align:center;width:100%;font-family:var(--lovelace-font-family-heading);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-title-large);line-height:var(--lovelace-line-height-title-large);color:var(--lovelace-color-content-default);margin:0}.onnuc96{text-align:center;width:100%;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-secondary);margin:0}.onnuc97{align-items:stretch;gap:var(--lovelace-gap-8);flex-direction:column;width:100%;display:flex}._1lzdalt0{aspect-ratio:1;color:currentColor;flex-shrink:0;justify-content:center;align-items:center;width:auto;height:1em;line-height:0;display:inline-flex}._9zd2r40{padding:var(--lovelace-padding-16);background-color:var(--lovelace-color-background-neutral-overlay);justify-content:center;align-items:center}._9zd2r41{background-color:var(--lovelace-color-background-default);border-radius:var(--lovelace-border-radius-container);flex-direction:column;width:366px;max-width:100%;max-height:90%;display:flex;overflow:hidden;box-shadow:0 12px 24px 4px #0000001f}._9zd2r41[data-entering],._9zd2r41[data-exiting]{opacity:0;transform:scale(.95)}._9zd2r42{box-sizing:border-box;outline:none;flex-direction:column;flex:auto;width:100%;min-height:0;display:flex;overflow-y:auto}@media (prefers-reduced-motion:no-preference){._9zd2r41{transition-property:opacity,transform;transition-duration:var(--lovelace-duration-medium);transition-timing-function:var(--lovelace-easing-standard)}}.a07ce60{box-sizing:border-box}.a07ce61{width:100%;display:block}.a07ce62{justify-content:center;align-items:center;gap:var(--lovelace-gap-8);width:100%;display:flex}.a07ce63{justify-content:center;align-items:center;gap:var(--lovelace-gap-4);text-align:center;flex-direction:column;display:flex}.a07ce64{border:none;border-top:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);flex:1 1 0;width:100%;min-width:1px;height:0;margin:0}.a07ce65{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);font-weight:var(--lovelace-font-weight-regular);white-space:nowrap;flex-shrink:0;margin:0}.a07ce66{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);font-weight:var(--lovelace-font-weight-medium);margin:0}.a07ce67{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);font-weight:var(--lovelace-font-weight-regular);margin:0}._6ivfy30{background-color:var(--lovelace-color-background-neutral-overlay)}._6ivfy31{background-color:var(--lovelace-color-background-default);flex-direction:column;width:100%;height:100%;min-height:0;max-height:100%;display:flex;position:relative;overflow:hidden}._6ivfy31[data-entering],._6ivfy31[data-exiting]{transform:translateY(100%)}._6ivfy32{outline:none;flex-direction:column;flex:auto;min-height:0;max-height:100%;display:flex}@media (prefers-reduced-motion:no-preference){._6ivfy31{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}._1x52ra20{background-color:var(--lovelace-header-background);color:var(--lovelace-header-content);height:56px;padding:0 var(--lovelace-padding-12);align-items:center;gap:var(--lovelace-spacing-8);flex-shrink:0;display:flex;position:relative;overflow:hidden}._1x52ra20 [data-slot=icon]{color:var(--lovelace-header-content)}._1x52ra20 [data-slot=avatar] [data-slot=icon]{color:var(--lovelace-avatar-content)}._1x52ra21{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--lovelace-font-size-title-small);line-height:var(--lovelace-line-height-title-small);font-weight:var(--lovelace-font-weight-medium);flex:1;margin:0;overflow:hidden}._3tx76z0{aspect-ratio:37.5/12}._1nvcxt20{isolation:isolate;box-sizing:border-box;border:var(--lovelace-border-width-default) solid transparent;border-radius:var(--lovelace-border-radius-button);font-size:var(--lovelace-icon-size-control);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative}._1nvcxt20:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}._1nvcxt20[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}._1nvcxt20[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}._1nvcxt20[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}._1nvcxt20[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}._1nvcxt20[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}._1nvcxt21{background-color:var(--lovelace-button-primary-background);color:var(--lovelace-button-primary-content)}._1nvcxt21[data-disabled]{background-color:var(--lovelace-color-background-disabled)}._1nvcxt22{background-color:var(--lovelace-color-background-destructive);color:var(--lovelace-color-content-on-destructive)}._1nvcxt22[data-disabled]{background-color:var(--lovelace-color-background-disabled)}._1nvcxt23{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);border-color:var(--lovelace-color-border-default)}._1nvcxt24{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-destructive);border-color:var(--lovelace-color-border-destructive)}._1nvcxt25{color:var(--lovelace-color-content-default);background-color:#0000}._1nvcxt26{color:var(--lovelace-color-content-destructive);background-color:#0000}._1nvcxt27{width:40px;height:40px}._1nvcxt28{width:32px;height:32px}._1nvcxt29{width:24px;height:24px}@media (forced-colors:active){._1nvcxt20[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.ptvtw60{max-width:100%;display:block}.ynzg8v0{width:100%;font-family:var(--lovelace-font-family-body);flex-direction:column;display:flex}.ynzg8v3{align-items:flex-end;gap:var(--lovelace-gap-8);box-sizing:border-box;width:100%;min-height:40px;padding-inline:var(--lovelace-padding-12);padding-block:var(--lovelace-padding-8);border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);background-color:var(--lovelace-color-background-default);border-radius:var(--lovelace-border-radius-input);cursor:text;display:flex}.ynzg8v3[data-focus-within]{border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.ynzg8v3[data-invalid]{border-color:var(--lovelace-color-border-destructive)}.ynzg8v3[data-disabled]{background-color:var(--lovelace-color-background-disabled);cursor:not-allowed}.ynzg8v5{border-radius:var(--lovelace-border-radius-composer);border:var(--lovelace-border-width-default) solid var(--lovelace-composer-border-default);background-color:var(--lovelace-composer-background)}.ynzg8v5[data-focus-within]{border-color:var(--lovelace-composer-border-active);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-composer-border-focus)}.ynzg8v5[data-invalid]{border-color:var(--lovelace-color-border-destructive)}.ynzg8v6{-webkit-appearance:none;appearance:none;min-width:0;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-default);background-color:#0000;border:none;outline:none;flex:1;margin:0;padding:0}.ynzg8v6::placeholder{color:var(--lovelace-color-content-secondary);opacity:1}.ynzg8v6[data-disabled]{color:var(--lovelace-color-content-disabled);cursor:not-allowed}.ynzg8v6[data-disabled]::placeholder{color:var(--lovelace-color-content-disabled)}.ynzg8v7{box-sizing:border-box;resize:none;overflow-wrap:anywhere;word-break:break-word;scrollbar-width:thin;scrollbar-color:var(--lovelace-color-border-default) transparent;width:100%;display:block;overflow-y:auto}.ynzg8v8{isolation:isolate;border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-button-primary-background);width:22px;height:22px;color:var(--lovelace-button-primary-content);cursor:pointer;-webkit-appearance:none;appearance:none;border:none;outline:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative;overflow:hidden}.ynzg8v8:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;background-color:currentColor;position:absolute;inset:0}.ynzg8v8[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.ynzg8v8[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.ynzg8v8[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.ynzg8v8[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.ynzg8v8[data-disabled]{cursor:not-allowed;background-color:var(--lovelace-color-background-disabled);color:var(--lovelace-color-content-disabled)}.ynzg8v9{font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);margin-bottom:var(--lovelace-gap-8);color:var(--lovelace-color-content-default)}.ynzg8va{margin-top:var(--lovelace-gap-4);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary)}.ynzg8va[data-invalid]{color:var(--lovelace-color-content-destructive)}.ynzg8v1 [data-slot=icon],.ynzg8v8 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}.ynzg8v1>[data-slot=icon]{color:var(--lovelace-color-content-secondary)}.ynzg8v1[data-disabled]>[data-slot=icon]{color:var(--lovelace-color-content-disabled)}.ynzg8v2 .ynzg8v6{color:var(--lovelace-composer-content-default)}.ynzg8v2 .ynzg8v6::placeholder,.ynzg8v2>[data-slot=icon]{color:var(--lovelace-composer-content-secondary)}.ynzg8v2 .ynzg8v6[data-disabled],.ynzg8v2 .ynzg8v6[data-disabled]::placeholder{color:var(--lovelace-color-content-disabled)}@media (prefers-reduced-motion:no-preference){.ynzg8v3{transition-property:border-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard)}.ynzg8v8:after{transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}@media (forced-colors:active){.ynzg8v3[data-focus-within],.ynzg8v8[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.k107bi1{isolation:isolate;align-items:center;gap:var(--lovelace-gap-4);color:var(--lovelace-color-content-link);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);word-break:break-word;cursor:pointer;border-radius:var(--lovelace-border-radius-6);outline:none;text-decoration:none;display:inline-flex;position:relative}.k107bi1:after{content:"";inset-block:0;inset-inline:calc(-1 * var(--lovelace-padding-4));border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute}.k107bi1:not([data-icon]){text-decoration:underline}.k107bi1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.k107bi1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.k107bi1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.k107bi1[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.k107bi1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.k107bi2{text-decoration:underline}.k107bi0 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}[dir=rtl] .k107bi0:not([data-download]) [data-slot=icon]{transform:scaleX(-1)}@media (forced-colors:active){.k107bi1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.fa1x5n0{outline:none;flex-direction:column;display:flex}.fa1x5n1{isolation:isolate;box-sizing:border-box;align-items:center;gap:var(--lovelace-gap-12);min-height:40px;padding-inline:var(--lovelace-padding-8);padding-block:var(--lovelace-padding-4);border-radius:var(--lovelace-border-radius-button);border:var(--lovelace-border-width-default) solid transparent;background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;display:flex;position:relative}.fa1x5n1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.fa1x5n1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.fa1x5n1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.fa1x5n1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.fa1x5n1[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.fa1x5n1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.fa1x5n1>[data-slot=icon]{font-size:var(--lovelace-icon-size-lg);flex-shrink:0}.fa1x5n1>[data-slot=label]{text-align:start;overflow-wrap:anywhere;flex:1;min-width:0}@media (forced-colors:active){.fa1x5n1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.mufew31{gap:var(--lovelace-gap-20);flex-direction:column;display:flex}.mufew31[data-orientation=horizontal]{flex-direction:row}.mufew32{cursor:pointer;-webkit-user-select:none;user-select:none}.mufew32[data-disabled]{cursor:not-allowed}.mufew33{align-items:center;gap:var(--lovelace-gap-12);display:inline-flex}.mufew34{isolation:isolate;box-sizing:border-box;align-items:center;gap:var(--lovelace-gap-12);min-height:40px;padding-inline:var(--lovelace-padding-8);padding-block:var(--lovelace-padding-4);border-radius:var(--lovelace-border-radius-button);border:var(--lovelace-border-width-default) solid transparent;background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;display:flex;position:relative}.mufew34:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.mufew34[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.mufew34[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.mufew34[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.mufew34[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.mufew34[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.mufew30>[data-slot=icon]{font-size:var(--lovelace-icon-size-lg);flex-shrink:0}.mufew30>[data-slot=label]{text-align:start;overflow-wrap:anywhere;flex:1;min-width:0}.mufew35{box-sizing:border-box;border-radius:var(--lovelace-border-radius-full);border-style:solid;border-width:var(--lovelace-border-width-default);background-color:var(--lovelace-color-background-default);border-color:var(--lovelace-color-border-default);width:24px;height:24px;transition-property:background-color,border-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);flex-shrink:0;position:relative}[data-hovered]:not([data-selected]):not([data-disabled])>.mufew35[data-state-layer]{border-color:var(--lovelace-color-border-medium)}[data-selected]>.mufew35{background-color:var(--lovelace-color-background-inverse);border-color:var(--lovelace-color-background-inverse)}[data-focus-visible]:not([data-disabled])>.mufew35[data-state-layer]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}[data-focus-visible]:not([data-selected]):not([data-disabled])>.mufew35[data-state-layer]{border-color:var(--lovelace-color-border-accent)}[data-disabled]:not([data-selected])>.mufew35{background-color:var(--lovelace-color-background-tertiary);border-color:var(--lovelace-color-border-default)}[data-disabled][data-selected]>.mufew35{background-color:var(--lovelace-color-background-disabled);border-color:var(--lovelace-color-background-disabled)}.mufew36{border-radius:var(--lovelace-border-radius-full);pointer-events:none;background-color:#0000;position:absolute;inset:5px}[data-selected]>.mufew35>.mufew36{background-color:var(--lovelace-color-background-default)}[data-selected][data-disabled]>.mufew35>.mufew36{background-color:var(--lovelace-color-background-tertiary)}.mufew37{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-default)}[data-disabled]>.mufew37{color:var(--lovelace-color-content-disabled)}@media (forced-colors:active){.mufew34[data-focus-visible]:not([data-disabled]),[data-focus-visible]:not([data-disabled])>.mufew35[data-state-layer]{outline-offset:2px;outline:2px solid highlight}[data-selected]>.mufew35>.mufew36{background-color:canvastext}}._1s0itzy0{cursor:pointer;outline:none;flex-shrink:0;display:inline-flex}._1s0itzy0[data-disabled]{cursor:not-allowed}._1s0itzy1{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-color-background-quaternary);width:44px;height:24px;color:var(--lovelace-color-content-inverse);flex-shrink:0;display:inline-block;position:relative;box-shadow:0 1px 1px #00000014}._1s0itzy1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;background-color:currentColor;position:absolute;inset:0}[data-selected]>._1s0itzy1{background-color:var(--lovelace-color-background-success);box-shadow:none}[data-hovered]:not([data-disabled])>._1s0itzy1[data-state-layer]:after{opacity:var(--lovelace-opacity-state-hover)}[data-focus-visible]:not([data-disabled])>._1s0itzy1[data-state-layer]:after{opacity:var(--lovelace-opacity-state-focus)}[data-pressed]:not([data-disabled])>._1s0itzy1[data-state-layer]:after{opacity:var(--lovelace-opacity-state-pressed)}[data-focus-visible]:not([data-disabled])>._1s0itzy1[data-state-layer]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}[data-disabled]>._1s0itzy1{background-color:var(--lovelace-color-background-disabled);box-shadow:none}[data-disabled][data-selected]>._1s0itzy1{background-color:var(--lovelace-color-background-success)}[data-disabled][data-selected]>._1s0itzy1:after{opacity:.3}._1s0itzy2{border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-color-background-default);pointer-events:none;width:22px;height:22px;position:absolute;inset-block-start:1px;inset-inline-start:1px;box-shadow:0 1px 2px #00000014}[data-selected]>._1s0itzy1>._1s0itzy2{inset-inline-start:calc(100% - 23px)}@media (prefers-reduced-motion:no-preference){._1s0itzy1{transition-property:background-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard)}._1s0itzy1:after{transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}._1s0itzy2{transition:inset-inline-start var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}@media (forced-colors:active){[data-focus-visible]:not([data-disabled])>._1s0itzy1[data-state-layer]{outline-offset:2px;outline:2px solid highlight}}._14rcj9q1{box-sizing:border-box;border-radius:var(--lovelace-border-radius-media-preview);border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}._14rcj9q2{aspect-ratio:16/9}._14rcj9q3{aspect-ratio:4/3}._14rcj9q4{aspect-ratio:1}._14rcj9q5{aspect-ratio:3/4}._14rcj9q6{aspect-ratio:9/16}._14rcj9q7{background-color:var(--lovelace-color-background-disabled);color:var(--lovelace-color-content-disabled)}._14rcj9q9{object-fit:cover;width:100%;height:100%;display:block}._14rcj9q0 [data-slot=icon]{font-size:var(--lovelace-icon-size-lg)}.rygqx10{isolation:isolate;justify-content:center;align-items:center;gap:var(--lovelace-gap-8);padding-inline:var(--lovelace-padding-12);box-sizing:border-box;border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);border-radius:var(--lovelace-border-radius-pill);background-color:var(--lovelace-color-background-default);color:var(--lovelace-pill-content-primary);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;text-decoration:none;display:inline-flex;position:relative}.rygqx10:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.rygqx10[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.rygqx10[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.rygqx10[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.rygqx10[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.rygqx10[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.rygqx11{height:40px}.rygqx12{height:32px}[data-slot=pill-button] [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){.rygqx10[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.y22qey0{box-sizing:border-box;width:fit-content;min-height:48px;padding-block:var(--lovelace-padding-8);padding-inline:var(--lovelace-padding-16);border-radius:var(--lovelace-border-radius-message);background-color:var(--lovelace-color-background-default);border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);text-align:start;overflow-wrap:anywhere;flex-direction:column;justify-content:center;align-items:flex-start;display:flex;box-shadow:0 8px 24px #00000014}[data-theme=dark] .y22qey0{box-shadow:0 8px 24px #ffffff14}._19x8abf1{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-full);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);border:none;outline:none;justify-content:center;align-items:center;display:inline-flex;position:relative;box-shadow:0 4px 14px #0000000f}._19x8abf1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}._19x8abf1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}._19x8abf1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}._19x8abf1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}._19x8abf1[data-focus-visible]:not([data-disabled]){box-shadow:0 4px 14px 0 #0000000f, 0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}._19x8abf2{background-color:var(--lovelace-scrollmarker-background);color:var(--lovelace-scrollmarker-content)}._19x8abf3{background-color:var(--lovelace-color-background-accent);color:var(--lovelace-color-content-on-accent)}._19x8abf4{width:40px;height:40px;padding:0}._19x8abf5{height:38px;padding-inline:var(--lovelace-padding-12);gap:var(--lovelace-gap-8)}._19x8abf0 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){._19x8abf1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.mf01c90{box-sizing:border-box;background-color:var(--lovelace-color-background-default);width:100%;min-height:0;max-height:100%;color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);flex-direction:column;flex:0 auto;display:flex;overflow-y:auto}.mf01c91{height:56px;padding-inline:var(--lovelace-padding-12);box-sizing:border-box;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.mf01c92{color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);text-align:center;margin:0}.mf01c93{inset-inline-start:var(--lovelace-padding-12);align-items:center;display:flex;position:absolute;top:0;bottom:0}.mf01c94{inset-inline-end:var(--lovelace-padding-12);align-items:center;display:flex;position:absolute;top:0;bottom:0}[dir=rtl] .mf01c95{transform:scaleX(-1)}.mf01c96{min-height:var(--lovelace-spacing-48);padding:var(--lovelace-padding-12);box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--lovelace-color-border-default) transparent;flex:0 auto;overflow-y:auto}.mf01c97{align-items:stretch;gap:var(--lovelace-gap-12);padding:var(--lovelace-padding-12);box-sizing:border-box;flex-direction:column;flex-shrink:0;display:flex}._1hi4ecs0{background-color:var(--lovelace-color-background-neutral-overlay);justify-content:flex-end;align-items:center}._1hi4ecs1{background-color:var(--lovelace-color-background-default);border-start-start-radius:var(--lovelace-border-radius-container);border-start-end-radius:var(--lovelace-border-radius-container);flex-direction:column;width:100%;min-height:0;max-height:80%;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 24px 4px #0000001f}._1hi4ecs1[data-entering],._1hi4ecs1[data-exiting]{transform:translateY(100%)}._1hi4ecs2{outline:none;flex-direction:column;flex:auto;min-height:0;max-height:100%;display:flex}@media (prefers-reduced-motion:no-preference){._1hi4ecs1{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}@keyframes _2rqyvg0{to{transform:rotate(360deg)}}._2rqyvg1{box-sizing:border-box;border-style:solid;border-color:var(--lovelace-color-background-neutral-overlay);border-radius:50%;animation:.8s linear infinite _2rqyvg0;display:inline-block}._2rqyvg1[data-reduced-motion]{animation-duration:2.4s}._2rqyvg2{border-width:2px;width:16px;height:16px}._2rqyvg3{border-width:3px;width:32px;height:32px}._2rqyvg4{border-top-color:var(--lovelace-color-content-default)}._2rqyvg5{border-top-color:var(--lovelace-color-content-on-accent)}@media (prefers-reduced-motion:reduce){._2rqyvg1{animation-duration:2.4s}}.jzxfg70{gap:var(--lovelace-gap-8);flex-direction:column;width:fit-content;display:flex}.jzxfg71{justify-content:center;align-items:center;gap:var(--lovelace-gap-8);flex-wrap:wrap;width:100%;display:flex}.jzxfg72{width:100%;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);justify-content:space-between;display:flex}._1y87qec0{justify-content:center;align-items:center;gap:var(--lovelace-gap-8);flex-wrap:wrap;width:100%;display:flex}@keyframes _9az62f0{0%{background-position-x:200%}to{background-position-x:0%}}@keyframes _9az62f1{0%,80%,to{vertical-align:0}40%{vertical-align:.3em}}._9az62f2{font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;background-image:linear-gradient(90deg, var(--lovelace-color-content-secondary) 0%, var(--lovelace-color-content-secondary) 35%, var(--lovelace-color-content-default) 50%, var(--lovelace-color-content-secondary) 65%, var(--lovelace-color-content-secondary) 100%);color:#0000;-webkit-text-fill-color:transparent;background-repeat:repeat;background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:2s linear infinite _9az62f0;display:inline-block}._9az62f3{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._9az62f4{display:inline}._9az62f5{line-height:0;animation:1.4s ease-in-out infinite _9az62f1;display:inline}._9az62f5:nth-child(2){animation-delay:.16s}._9az62f5:nth-child(3){animation-delay:.32s}@media (prefers-reduced-motion:reduce){._9az62f2{color:var(--lovelace-color-content-secondary);-webkit-text-fill-color:var(--lovelace-color-content-secondary);background-image:none;animation:none}._9az62f5{animation:none}}.k6tn090{box-sizing:border-box;justify-content:center;align-items:center;gap:var(--lovelace-gap-8);width:100%;padding-inline:var(--lovelace-padding-12);padding-block:var(--lovelace-padding-8);display:flex}.k6tn092{background-color:var(--lovelace-color-background-success-light);color:var(--lovelace-color-content-success)}.k6tn093{background-color:var(--lovelace-color-background-warning-light);color:var(--lovelace-color-content-warning)}.k6tn094{background-color:var(--lovelace-color-background-destructive-light);color:var(--lovelace-color-content-destructive)}.k6tn095{color:inherit;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);overflow-wrap:break-word;margin:0}.k6tn096{white-space:nowrap;text-align:center;flex-shrink:0}.k6tn097{text-align:left;flex:1 0 0;min-width:0}.k6tn090 [data-slot=icon]{font-size:var(--lovelace-icon-size-control)}.s6807p0{box-sizing:border-box;max-width:184px;padding:var(--lovelace-spacing-8);border-radius:var(--lovelace-border-radius-6);background-color:var(--lovelace-color-background-inverse);color:var(--lovelace-color-content-inverse);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);text-align:center;word-break:break-word;filter:drop-shadow(0 4px 14px #0000000f)}.s6807p0[data-entering],.s6807p0[data-exiting]{opacity:0}.s6807p1{display:block}.s6807p2{fill:var(--lovelace-color-background-inverse);display:block}.s6807p0[data-placement^=top] .s6807p2{transform:rotate(0)}.s6807p0[data-placement^=bottom] .s6807p2{transform:rotate(180deg)}.s6807p0[data-placement^=left] .s6807p2{transform:rotate(-90deg)}.s6807p0[data-placement^=right] .s6807p2{transform:rotate(90deg)}@media (prefers-reduced-motion:no-preference){.s6807p0{transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}@keyframes bwq5ac0{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}.bwq5ac1{align-items:center;gap:var(--lovelace-gap-4);height:38px;padding-inline:var(--lovelace-padding-20);background-color:var(--lovelace-color-background-quaternary);border-start-start-radius:var(--lovelace-border-radius-20);border-start-end-radius:var(--lovelace-border-radius-20);border-end-end-radius:var(--lovelace-border-radius-20);border-end-start-radius:0;display:inline-flex}.bwq5ac2{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.bwq5ac3{width:var(--lovelace-spacing-8);height:var(--lovelace-spacing-8);border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-color-content-default);flex-shrink:0;animation:.9s ease-in-out infinite bwq5ac0}.bwq5ac3:nth-child(2){animation-delay:.15s}.bwq5ac3:nth-child(3){animation-delay:.3s}@media (prefers-reduced-motion:reduce){.bwq5ac3{animation:none}}.jxp4or0{align-items:flex-end;gap:var(--lovelace-gap-4);box-sizing:border-box;flex-direction:column;width:100%;padding-inline-start:var(--lovelace-padding-20);display:flex}.jxp4or1{box-sizing:border-box;max-width:100%;padding-inline:var(--lovelace-padding-12);padding-block:var(--lovelace-padding-8);border-radius:var(--lovelace-border-radius-message);background-color:var(--lovelace-message-user-background);align-items:center;display:flex}.jxp4or2{color:var(--lovelace-message-user-content);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);overflow-wrap:anywhere;word-break:break-word;margin:0}.jxp4or3{justify-content:flex-end;width:100%;display:flex}.jxp4or4{min-height:var(--lovelace-icon-size-lg);align-items:center;gap:var(--lovelace-gap-4);color:var(--lovelace-color-content-destructive);margin:0;display:inline-flex}.jxp4or5{border-radius:var(--lovelace-border-radius-6);cursor:pointer;background:0 0;border:none;outline:none;padding:0}.jxp4or5[data-focus-visible]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.jxp4or6{color:inherit;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);margin:0}.jxp4or4 [data-slot=icon]{font-size:var(--lovelace-icon-size-lg)}@media (forced-colors:active){.jxp4or5[data-focus-visible]{outline-offset:2px;outline:2px solid highlight}}
|
|
1
|
+
._1xn6t060{align-items:flex-start;gap:var(--lovelace-gap-12);display:flex}._1xn6t061{text-align:start;min-width:0;min-height:24px;color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);overflow-wrap:anywhere;word-break:break-word;flex-direction:column;flex:1 0 0;justify-content:center;margin:0;display:flex}.kmbju21{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-avatar);background-color:var(--lovelace-avatar-background);color:var(--lovelace-avatar-content);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-semi-bold);text-align:center;-webkit-user-select:none;user-select:none;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden}.kmbju22{width:24px;height:24px;font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body)}.kmbju23{width:36px;height:36px;font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body)}.kmbju24{width:48px;height:48px;font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body)}.kmbju25{width:72px;height:72px;font-size:var(--lovelace-font-size-title-large);line-height:var(--lovelace-line-height-title-large)}.kmbju26{flex-shrink:0}.kmbju27{width:24px;height:24px}.kmbju28{width:36px;height:36px}.kmbju29{width:48px;height:48px}.kmbju2a{width:72px;height:72px}.kmbju20 [data-slot=image]{object-fit:cover;border-radius:inherit;width:100%;height:100%;position:absolute;inset:0}.kmbju20 [data-slot=icon]{flex-shrink:0}.kmbju20[data-size=sm] [data-slot=icon]{font-size:var(--lovelace-icon-size-sm)}.kmbju20[data-size=md] [data-slot=icon]{font-size:var(--lovelace-icon-size-md)}.kmbju20[data-size=lg] [data-slot=icon]{font-size:32px}.kmbju20[data-size=xl] [data-slot=icon]{font-size:36px}.fpbgjm0{align-items:flex-end;display:flex;position:relative;overflow:hidden}.fpbgjm0[data-exiting]{transform:translateY(-100%)}.fpbgjm0[data-swapping]{opacity:0}@media (prefers-reduced-motion:no-preference){.fpbgjm0{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard), height var(--lovelace-duration-medium) var(--lovelace-easing-standard), opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}._1lzdalt0{aspect-ratio:1;color:currentColor;flex-shrink:0;justify-content:center;align-items:center;width:auto;height:1em;line-height:0;display:inline-flex}._1nvcxt20{isolation:isolate;box-sizing:border-box;border:var(--lovelace-border-width-default) solid transparent;border-radius:var(--lovelace-border-radius-button);font-size:var(--lovelace-icon-size-control);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative}._1nvcxt20:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}._1nvcxt20[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}._1nvcxt20[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}._1nvcxt20[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}._1nvcxt20[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}._1nvcxt20[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}._1nvcxt21{background-color:var(--lovelace-button-primary-background);color:var(--lovelace-button-primary-content)}._1nvcxt21[data-disabled]{background-color:var(--lovelace-color-background-disabled)}._1nvcxt22{background-color:var(--lovelace-color-background-destructive);color:var(--lovelace-color-content-on-destructive)}._1nvcxt22[data-disabled]{background-color:var(--lovelace-color-background-disabled)}._1nvcxt23{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);border-color:var(--lovelace-color-border-default)}._1nvcxt24{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-destructive);border-color:var(--lovelace-color-border-destructive)}._1nvcxt25{color:var(--lovelace-color-content-default);background-color:#0000}._1nvcxt26{color:var(--lovelace-color-content-destructive);background-color:#0000}._1nvcxt27{width:40px;height:40px}._1nvcxt28{width:32px;height:32px}._1nvcxt29{width:24px;height:24px}@media (forced-colors:active){._1nvcxt20[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.k6tn090{gap:var(--lovelace-gap-8);box-sizing:border-box;width:100%;padding-inline:var(--lovelace-padding-12);padding-block:var(--lovelace-padding-8);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);text-align:center;overflow-wrap:break-word;align-items:flex-start;display:flex}.k6tn092{background-color:var(--lovelace-color-background-success-light);color:var(--lovelace-color-content-success)}.k6tn093{background-color:var(--lovelace-color-background-warning-light);color:var(--lovelace-color-content-warning)}.k6tn094{background-color:var(--lovelace-color-background-destructive-light);color:var(--lovelace-color-content-destructive)}.k6tn095{min-width:0;margin-inline-end:auto}.k6tn090>[data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0;margin-inline-start:auto}.k6tn090>[data-slot=button]{color:inherit}.k6tn090>[data-slot=button] [data-slot=icon]{font-size:var(--lovelace-icon-size-sm)}.k6tn090>[data-slot=button][data-disabled]{color:inherit;cursor:inherit}.xywi8y0{padding:var(--lovelace-padding-16);justify-content:flex-end;align-items:center}.xywi8y1{background-color:var(--lovelace-color-background-default);border-radius:var(--lovelace-border-radius-container);flex-direction:column;width:fit-content;max-width:min(320px,100%);min-height:0;max-height:100%;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 24px 4px #0000001f}.xywi8y1[data-entering],.xywi8y1[data-exiting]{transform:translateY(8px)}.xywi8y2{outline:none;flex-direction:column;flex:auto;min-height:0;max-height:100%;display:flex}@media (prefers-reduced-motion:no-preference){.xywi8y1{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}._1r1codi0{z-index:200;flex-direction:column;display:flex;position:fixed;inset:0}._1r1codi0[data-entering],._1r1codi0[data-exiting]{opacity:0}@media (prefers-reduced-motion:no-preference){._1r1codi0{transition:opacity var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}.ateptb1{isolation:isolate;justify-content:center;align-items:center;gap:var(--lovelace-gap-8);padding-inline:var(--lovelace-padding-12);box-sizing:border-box;border:var(--lovelace-border-width-default) solid transparent;border-radius:var(--lovelace-border-radius-button);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;text-decoration:none;display:inline-flex;position:relative}.ateptb1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.ateptb1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.ateptb1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.ateptb1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.ateptb1[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.ateptb1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.ateptb2{background-color:var(--lovelace-button-primary-background);color:var(--lovelace-button-primary-content)}.ateptb2[data-disabled]{background-color:var(--lovelace-color-background-disabled)}.ateptb3{background-color:var(--lovelace-color-background-destructive);color:var(--lovelace-color-content-on-destructive)}.ateptb3[data-disabled]{background-color:var(--lovelace-color-background-disabled)}.ateptb4{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);border-color:var(--lovelace-color-border-default)}.ateptb5{background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-destructive);border-color:var(--lovelace-color-border-destructive)}.ateptb6{color:var(--lovelace-color-content-default);background-color:#0000}.ateptb7{color:var(--lovelace-color-content-destructive);background-color:#0000}.ateptb8{height:40px}.ateptb9{height:32px}.ateptb0 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){.ateptb1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.s7h2sn0{gap:var(--lovelace-gap-20);flex-direction:column;display:flex}.s7h2sn2{font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-default);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.s7h2sn2[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.s7h2sn3{align-items:center;gap:var(--lovelace-gap-12);display:inline-flex}.s7h2sn4{isolation:isolate;box-sizing:border-box;align-items:center;gap:var(--lovelace-gap-12);min-height:40px;padding-inline:var(--lovelace-padding-8);padding-block:var(--lovelace-padding-4);border-radius:var(--lovelace-border-radius-button);border:var(--lovelace-border-width-default) solid transparent;background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;display:flex;position:relative}.s7h2sn4:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.s7h2sn4[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.s7h2sn4[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.s7h2sn4[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.s7h2sn4[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.s7h2sn4[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.s7h2sn1>[data-slot=icon]{font-size:var(--lovelace-icon-size-lg);flex-shrink:0}.s7h2sn1>[data-slot=label]{text-align:start;overflow-wrap:anywhere;flex:1;min-width:0}.s7h2sn5{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-6);border-style:solid;border-width:var(--lovelace-border-width-default);border-color:var(--lovelace-color-border-default);background-color:var(--lovelace-color-background-default);width:24px;height:24px;color:var(--lovelace-color-content-inverse);transition-property:border-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);flex-shrink:0;position:relative}.s7h2sn5:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.s7h2sn6{color:currentColor;opacity:0;pointer-events:none;width:16px;height:16px;margin:auto;position:absolute;inset:0}[data-selected]>.s7h2sn5,[data-indeterminate]>.s7h2sn5{background-color:var(--lovelace-color-background-inverse);border-color:#0000}[data-hovered]:not([data-disabled]):not([data-selected]):not([data-indeterminate])>.s7h2sn5[data-state-layer]{border-color:var(--lovelace-color-border-medium)}[data-hovered]:not([data-disabled])>.s7h2sn5[data-state-layer]:after{opacity:var(--lovelace-opacity-state-hover)}[data-focus-visible]:not([data-disabled])>.s7h2sn5[data-state-layer]:after{opacity:var(--lovelace-opacity-state-focus)}[data-pressed]:not([data-disabled])>.s7h2sn5[data-state-layer]:after{opacity:var(--lovelace-opacity-state-pressed)}[data-focus-visible]:not([data-disabled])>.s7h2sn5[data-state-layer]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}[data-disabled]>.s7h2sn5{background-color:var(--lovelace-color-background-disabled);border-color:var(--lovelace-color-border-default);color:var(--lovelace-color-content-disabled)}[data-selected]:not([data-indeterminate])>.s7h2sn5>.s7h2sn6[data-glyph=check],[data-indeterminate]>.s7h2sn5>.s7h2sn6[data-glyph=dash]{opacity:1}@media (forced-colors:active){.s7h2sn4[data-focus-visible]:not([data-disabled]),[data-focus-visible]:not([data-disabled])>.s7h2sn5[data-state-layer]{outline-offset:2px;outline:2px solid highlight}}._18cnc771{isolation:isolate;box-sizing:border-box;border:var(--lovelace-border-width-default) solid transparent;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;justify-content:center;align-items:center;display:inline-flex;position:relative}._18cnc771:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}._18cnc771:not([data-selected]){background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);border-color:var(--lovelace-color-border-default)}._18cnc771[data-selected]{background-color:var(--lovelace-chip-background-selected);color:var(--lovelace-color-content-on-accent);border-color:#0000}._18cnc771[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}._18cnc771[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}._18cnc771[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}._18cnc771[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}._18cnc771[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}._18cnc772{min-width:80px;padding-inline:var(--lovelace-padding-12);border-radius:var(--lovelace-border-radius-pill)}._18cnc773,._18cnc774{border-radius:var(--lovelace-border-radius-button)}._18cnc777{height:40px}._18cnc778{height:48px}._18cnc779{width:40px;height:40px}._18cnc77a{width:48px;height:48px}._18cnc77b{width:40px;height:40px}._18cnc77c{width:48px;height:48px;font-size:var(--lovelace-font-size-title-large)}._18cnc770 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){._18cnc771[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.onnuc90{text-align:center;align-items:center;gap:var(--lovelace-gap-16);padding:var(--lovelace-padding-16);flex-direction:column;display:flex}.onnuc91{flex-shrink:0;font-size:32px;line-height:0;display:flex}.onnuc92{color:var(--lovelace-color-content-warning)}.onnuc93{color:var(--lovelace-color-content-success)}.onnuc94{align-items:center;gap:var(--lovelace-gap-8);flex-direction:column;width:100%;display:flex}.onnuc95{text-align:center;width:100%;font-family:var(--lovelace-font-family-heading);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-title-large);line-height:var(--lovelace-line-height-title-large);color:var(--lovelace-color-content-default);margin:0}.onnuc96{text-align:center;width:100%;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-secondary);margin:0}.onnuc97{align-items:stretch;gap:var(--lovelace-gap-8);flex-direction:column;width:100%;display:flex}._9zd2r40{padding:var(--lovelace-padding-16);background-color:var(--lovelace-color-background-neutral-overlay);justify-content:center;align-items:center}._9zd2r41{background-color:var(--lovelace-color-background-default);border-radius:var(--lovelace-border-radius-container);flex-direction:column;width:366px;max-width:100%;max-height:90%;display:flex;overflow:hidden;box-shadow:0 12px 24px 4px #0000001f}._9zd2r41[data-entering],._9zd2r41[data-exiting]{opacity:0;transform:scale(.95)}._9zd2r42{box-sizing:border-box;outline:none;flex-direction:column;flex:auto;width:100%;min-height:0;display:flex;overflow-y:auto}@media (prefers-reduced-motion:no-preference){._9zd2r41{transition-property:opacity,transform;transition-duration:var(--lovelace-duration-medium);transition-timing-function:var(--lovelace-easing-standard)}}.a07ce60{box-sizing:border-box}.a07ce61{width:100%;display:block}.a07ce62{justify-content:center;align-items:center;gap:var(--lovelace-gap-8);width:100%;display:flex}.a07ce63{justify-content:center;align-items:center;gap:var(--lovelace-gap-4);text-align:center;flex-direction:column;display:flex}.a07ce64{border:none;border-top:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);flex:1 1 0;width:100%;min-width:1px;height:0;margin:0}.a07ce65{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);font-weight:var(--lovelace-font-weight-regular);white-space:nowrap;flex-shrink:0;margin:0}.a07ce66{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);font-weight:var(--lovelace-font-weight-medium);margin:0}.a07ce67{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);font-weight:var(--lovelace-font-weight-regular);margin:0}._6ivfy30{background-color:var(--lovelace-color-background-neutral-overlay)}._6ivfy31{background-color:var(--lovelace-color-background-default);flex-direction:column;width:100%;height:100%;min-height:0;max-height:100%;display:flex;position:relative;overflow:hidden}._6ivfy31[data-entering],._6ivfy31[data-exiting]{transform:translateY(100%)}._6ivfy32{outline:none;flex-direction:column;flex:auto;min-height:0;max-height:100%;display:flex}@media (prefers-reduced-motion:no-preference){._6ivfy31{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}._1x52ra20{background-color:var(--lovelace-header-background);color:var(--lovelace-header-content);height:56px;padding:0 var(--lovelace-padding-12);align-items:center;gap:var(--lovelace-spacing-8);flex-shrink:0;display:flex;position:relative;overflow:hidden}._1x52ra20 [data-slot=icon]{color:var(--lovelace-header-content)}._1x52ra20 [data-slot=avatar] [data-slot=icon]{color:var(--lovelace-avatar-content)}._1x52ra21{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--lovelace-font-size-title-small);line-height:var(--lovelace-line-height-title-small);font-weight:var(--lovelace-font-weight-medium);flex:1;margin:0;overflow:hidden}._3tx76z0{aspect-ratio:37.5/12}.ptvtw60{max-width:100%;display:block}.ynzg8v0{width:100%;font-family:var(--lovelace-font-family-body);flex-direction:column;display:flex}.ynzg8v3{align-items:flex-end;gap:var(--lovelace-gap-8);box-sizing:border-box;width:100%;min-height:40px;padding-inline:var(--lovelace-padding-12);padding-block:var(--lovelace-padding-8);border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);background-color:var(--lovelace-color-background-default);border-radius:var(--lovelace-border-radius-input);cursor:text;display:flex}.ynzg8v3[data-focus-within]{border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.ynzg8v3[data-invalid]{border-color:var(--lovelace-color-border-destructive)}.ynzg8v3[data-disabled]{background-color:var(--lovelace-color-background-disabled);cursor:not-allowed}.ynzg8v5{border-radius:var(--lovelace-border-radius-composer);border:var(--lovelace-border-width-default) solid var(--lovelace-composer-border-default);background-color:var(--lovelace-composer-background)}.ynzg8v5[data-focus-within]{border-color:var(--lovelace-composer-border-active);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-composer-border-focus)}.ynzg8v5[data-invalid]{border-color:var(--lovelace-color-border-destructive)}.ynzg8v6{-webkit-appearance:none;appearance:none;min-width:0;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-default);background-color:#0000;border:none;outline:none;flex:1;margin:0;padding:0}.ynzg8v6::placeholder{color:var(--lovelace-color-content-secondary);opacity:1}.ynzg8v6[data-disabled]{color:var(--lovelace-color-content-disabled);cursor:not-allowed}.ynzg8v6[data-disabled]::placeholder{color:var(--lovelace-color-content-disabled)}.ynzg8v7{box-sizing:border-box;resize:none;overflow-wrap:anywhere;word-break:break-word;scrollbar-width:thin;scrollbar-color:var(--lovelace-color-border-default) transparent;width:100%;display:block;overflow-y:auto}.ynzg8v8{isolation:isolate;border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-button-primary-background);width:22px;height:22px;color:var(--lovelace-button-primary-content);cursor:pointer;-webkit-appearance:none;appearance:none;border:none;outline:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative;overflow:hidden}.ynzg8v8:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;background-color:currentColor;position:absolute;inset:0}.ynzg8v8[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.ynzg8v8[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.ynzg8v8[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.ynzg8v8[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.ynzg8v8[data-disabled]{cursor:not-allowed;background-color:var(--lovelace-color-background-disabled);color:var(--lovelace-color-content-disabled)}.ynzg8v9{font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);margin-bottom:var(--lovelace-gap-8);color:var(--lovelace-color-content-default)}.ynzg8va{margin-top:var(--lovelace-gap-4);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary)}.ynzg8va[data-invalid]{color:var(--lovelace-color-content-destructive)}.ynzg8v1 [data-slot=icon],.ynzg8v8 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}.ynzg8v1>[data-slot=icon]{color:var(--lovelace-color-content-secondary)}.ynzg8v1[data-disabled]>[data-slot=icon]{color:var(--lovelace-color-content-disabled)}.ynzg8v2 .ynzg8v6{color:var(--lovelace-composer-content-default)}.ynzg8v2 .ynzg8v6::placeholder,.ynzg8v2>[data-slot=icon]{color:var(--lovelace-composer-content-secondary)}.ynzg8v2 .ynzg8v6[data-disabled],.ynzg8v2 .ynzg8v6[data-disabled]::placeholder{color:var(--lovelace-color-content-disabled)}@media (prefers-reduced-motion:no-preference){.ynzg8v3{transition-property:border-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard)}.ynzg8v8:after{transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}@media (forced-colors:active){.ynzg8v3[data-focus-within],.ynzg8v8[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.k107bi1{isolation:isolate;align-items:center;gap:var(--lovelace-gap-4);color:var(--lovelace-color-content-link);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);word-break:break-word;cursor:pointer;border-radius:var(--lovelace-border-radius-6);outline:none;text-decoration:none;display:inline-flex;position:relative}.k107bi1:after{content:"";inset-block:0;inset-inline:calc(-1 * var(--lovelace-padding-4));border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute}.k107bi1:not([data-icon]){text-decoration:underline}.k107bi1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.k107bi1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.k107bi1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.k107bi1[data-focus-visible]:not([data-disabled]){box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.k107bi1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.k107bi2{text-decoration:underline}.k107bi0 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}[dir=rtl] .k107bi0:not([data-download]) [data-slot=icon]{transform:scaleX(-1)}@media (forced-colors:active){.k107bi1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.fa1x5n0{outline:none;flex-direction:column;display:flex}.fa1x5n1{isolation:isolate;box-sizing:border-box;align-items:center;gap:var(--lovelace-gap-12);min-height:40px;padding-inline:var(--lovelace-padding-8);padding-block:var(--lovelace-padding-4);border-radius:var(--lovelace-border-radius-button);border:var(--lovelace-border-width-default) solid transparent;background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;display:flex;position:relative}.fa1x5n1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.fa1x5n1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.fa1x5n1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.fa1x5n1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.fa1x5n1[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.fa1x5n1[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.fa1x5n1>[data-slot=icon]{font-size:var(--lovelace-icon-size-lg);flex-shrink:0}.fa1x5n1>[data-slot=label]{text-align:start;overflow-wrap:anywhere;flex:1;min-width:0}@media (forced-colors:active){.fa1x5n1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.mufew31{gap:var(--lovelace-gap-20);flex-direction:column;display:flex}.mufew31[data-orientation=horizontal]{flex-direction:row}.mufew32{cursor:pointer;-webkit-user-select:none;user-select:none}.mufew32[data-disabled]{cursor:not-allowed}.mufew33{align-items:center;gap:var(--lovelace-gap-12);display:inline-flex}.mufew34{isolation:isolate;box-sizing:border-box;align-items:center;gap:var(--lovelace-gap-12);min-height:40px;padding-inline:var(--lovelace-padding-8);padding-block:var(--lovelace-padding-4);border-radius:var(--lovelace-border-radius-button);border:var(--lovelace-border-width-default) solid transparent;background-color:var(--lovelace-color-background-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;display:flex;position:relative}.mufew34:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.mufew34[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.mufew34[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.mufew34[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.mufew34[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.mufew34[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.mufew30>[data-slot=icon]{font-size:var(--lovelace-icon-size-lg);flex-shrink:0}.mufew30>[data-slot=label]{text-align:start;overflow-wrap:anywhere;flex:1;min-width:0}.mufew35{box-sizing:border-box;border-radius:var(--lovelace-border-radius-full);border-style:solid;border-width:var(--lovelace-border-width-default);background-color:var(--lovelace-color-background-default);border-color:var(--lovelace-color-border-default);width:24px;height:24px;transition-property:background-color,border-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);flex-shrink:0;position:relative}[data-hovered]:not([data-selected]):not([data-disabled])>.mufew35[data-state-layer]{border-color:var(--lovelace-color-border-medium)}[data-selected]>.mufew35{background-color:var(--lovelace-color-background-inverse);border-color:var(--lovelace-color-background-inverse)}[data-focus-visible]:not([data-disabled])>.mufew35[data-state-layer]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}[data-focus-visible]:not([data-selected]):not([data-disabled])>.mufew35[data-state-layer]{border-color:var(--lovelace-color-border-accent)}[data-disabled]:not([data-selected])>.mufew35{background-color:var(--lovelace-color-background-tertiary);border-color:var(--lovelace-color-border-default)}[data-disabled][data-selected]>.mufew35{background-color:var(--lovelace-color-background-disabled);border-color:var(--lovelace-color-background-disabled)}.mufew36{border-radius:var(--lovelace-border-radius-full);pointer-events:none;background-color:#0000;position:absolute;inset:5px}[data-selected]>.mufew35>.mufew36{background-color:var(--lovelace-color-background-default)}[data-selected][data-disabled]>.mufew35>.mufew36{background-color:var(--lovelace-color-background-tertiary)}.mufew37{font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);font-weight:var(--lovelace-font-weight-regular);line-height:var(--lovelace-line-height-body);color:var(--lovelace-color-content-default)}[data-disabled]>.mufew37{color:var(--lovelace-color-content-disabled)}@media (forced-colors:active){.mufew34[data-focus-visible]:not([data-disabled]),[data-focus-visible]:not([data-disabled])>.mufew35[data-state-layer]{outline-offset:2px;outline:2px solid highlight}[data-selected]>.mufew35>.mufew36{background-color:canvastext}}._1s0itzy0{cursor:pointer;outline:none;flex-shrink:0;display:inline-flex}._1s0itzy0[data-disabled]{cursor:not-allowed}._1s0itzy1{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-color-background-quaternary);width:44px;height:24px;color:var(--lovelace-color-content-inverse);flex-shrink:0;display:inline-block;position:relative;box-shadow:0 1px 1px #00000014}._1s0itzy1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;background-color:currentColor;position:absolute;inset:0}[data-selected]>._1s0itzy1{background-color:var(--lovelace-color-background-success);box-shadow:none}[data-hovered]:not([data-disabled])>._1s0itzy1[data-state-layer]:after{opacity:var(--lovelace-opacity-state-hover)}[data-focus-visible]:not([data-disabled])>._1s0itzy1[data-state-layer]:after{opacity:var(--lovelace-opacity-state-focus)}[data-pressed]:not([data-disabled])>._1s0itzy1[data-state-layer]:after{opacity:var(--lovelace-opacity-state-pressed)}[data-focus-visible]:not([data-disabled])>._1s0itzy1[data-state-layer]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}[data-disabled]>._1s0itzy1{background-color:var(--lovelace-color-background-disabled);box-shadow:none}[data-disabled][data-selected]>._1s0itzy1{background-color:var(--lovelace-color-background-success)}[data-disabled][data-selected]>._1s0itzy1:after{opacity:.3}._1s0itzy2{border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-color-background-default);pointer-events:none;width:22px;height:22px;position:absolute;inset-block-start:1px;inset-inline-start:1px;box-shadow:0 1px 2px #00000014}[data-selected]>._1s0itzy1>._1s0itzy2{inset-inline-start:calc(100% - 23px)}@media (prefers-reduced-motion:no-preference){._1s0itzy1{transition-property:background-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard)}._1s0itzy1:after{transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}._1s0itzy2{transition:inset-inline-start var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}@media (forced-colors:active){[data-focus-visible]:not([data-disabled])>._1s0itzy1[data-state-layer]{outline-offset:2px;outline:2px solid highlight}}._14rcj9q1{box-sizing:border-box;border-radius:var(--lovelace-border-radius-media-preview);border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}._14rcj9q2{aspect-ratio:16/9}._14rcj9q3{aspect-ratio:4/3}._14rcj9q4{aspect-ratio:1}._14rcj9q5{aspect-ratio:3/4}._14rcj9q6{aspect-ratio:9/16}._14rcj9q7{background-color:var(--lovelace-color-background-disabled);color:var(--lovelace-color-content-disabled)}._14rcj9q9{object-fit:cover;width:100%;height:100%;display:block}._14rcj9q0 [data-slot=icon]{font-size:var(--lovelace-icon-size-lg)}.rygqx10{isolation:isolate;justify-content:center;align-items:center;gap:var(--lovelace-gap-8);padding-inline:var(--lovelace-padding-12);box-sizing:border-box;border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);border-radius:var(--lovelace-border-radius-pill);background-color:var(--lovelace-color-background-default);color:var(--lovelace-pill-content-primary);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,border-color;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);outline:none;text-decoration:none;display:inline-flex;position:relative}.rygqx10:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}.rygqx10[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}.rygqx10[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}.rygqx10[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}.rygqx10[data-focus-visible]:not([data-disabled]){border-color:var(--lovelace-color-border-accent);box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.rygqx10[data-disabled]{cursor:not-allowed;color:var(--lovelace-color-content-disabled)}.rygqx11{height:40px}.rygqx12{height:32px}[data-slot=pill-button] [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){.rygqx10[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.y22qey0{box-sizing:border-box;width:fit-content;min-height:48px;padding-block:var(--lovelace-padding-8);padding-inline:var(--lovelace-padding-16);border-radius:var(--lovelace-border-radius-message);background-color:var(--lovelace-color-background-default);border:var(--lovelace-border-width-default) solid var(--lovelace-color-border-default);color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);text-align:start;overflow-wrap:anywhere;flex-direction:column;justify-content:center;align-items:flex-start;display:flex;box-shadow:0 8px 24px #00000014}[data-theme=dark] .y22qey0{box-shadow:0 8px 24px #ffffff14}._19x8abf1{isolation:isolate;box-sizing:border-box;border-radius:var(--lovelace-border-radius-full);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;appearance:none;transition-property:background-color,box-shadow;transition-duration:var(--lovelace-duration-fast);transition-timing-function:var(--lovelace-easing-standard);border:none;outline:none;justify-content:center;align-items:center;display:inline-flex;position:relative;box-shadow:0 4px 14px #0000000f}._19x8abf1:after{content:"";border-radius:inherit;opacity:0;pointer-events:none;z-index:-1;transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard);background-color:currentColor;position:absolute;inset:0}._19x8abf1[data-hovered]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-hover)}._19x8abf1[data-focus-visible]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-focus)}._19x8abf1[data-pressed]:not([data-disabled]):after{opacity:var(--lovelace-opacity-state-pressed)}._19x8abf1[data-focus-visible]:not([data-disabled]){box-shadow:0 4px 14px 0 #0000000f, 0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}._19x8abf2{background-color:var(--lovelace-scrollmarker-background);color:var(--lovelace-scrollmarker-content)}._19x8abf3{background-color:var(--lovelace-color-background-accent);color:var(--lovelace-color-content-on-accent)}._19x8abf4{width:40px;height:40px;padding:0}._19x8abf5{height:38px;padding-inline:var(--lovelace-padding-12);gap:var(--lovelace-gap-8)}._19x8abf0 [data-slot=icon]{font-size:var(--lovelace-icon-size-control);flex-shrink:0}@media (forced-colors:active){._19x8abf1[data-focus-visible]:not([data-disabled]){outline-offset:2px;outline:2px solid highlight}}.mf01c90{box-sizing:border-box;background-color:var(--lovelace-color-background-default);width:100%;min-height:0;max-height:100%;color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);flex-direction:column;flex:0 auto;display:flex;overflow-y:auto}.mf01c91{height:56px;padding-inline:var(--lovelace-padding-12);box-sizing:border-box;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.mf01c92{color:var(--lovelace-color-content-default);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);text-align:center;margin:0}.mf01c93{inset-inline-start:var(--lovelace-padding-12);align-items:center;display:flex;position:absolute;top:0;bottom:0}.mf01c94{inset-inline-end:var(--lovelace-padding-12);align-items:center;display:flex;position:absolute;top:0;bottom:0}[dir=rtl] .mf01c95{transform:scaleX(-1)}.mf01c96{min-height:var(--lovelace-spacing-48);padding:var(--lovelace-padding-12);box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--lovelace-color-border-default) transparent;flex:0 auto;overflow-y:auto}.mf01c97{align-items:stretch;gap:var(--lovelace-gap-12);padding:var(--lovelace-padding-12);box-sizing:border-box;flex-direction:column;flex-shrink:0;display:flex}._1hi4ecs0{background-color:var(--lovelace-color-background-neutral-overlay);justify-content:flex-end;align-items:center}._1hi4ecs1{background-color:var(--lovelace-color-background-default);border-start-start-radius:var(--lovelace-border-radius-container);border-start-end-radius:var(--lovelace-border-radius-container);flex-direction:column;width:100%;min-height:0;max-height:80%;display:flex;position:relative;overflow:hidden;box-shadow:0 12px 24px 4px #0000001f}._1hi4ecs1[data-entering],._1hi4ecs1[data-exiting]{transform:translateY(100%)}._1hi4ecs2{outline:none;flex-direction:column;flex:auto;min-height:0;max-height:100%;display:flex}@media (prefers-reduced-motion:no-preference){._1hi4ecs1{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}@keyframes _2rqyvg0{to{transform:rotate(360deg)}}._2rqyvg1{box-sizing:border-box;border-style:solid;border-color:var(--lovelace-color-background-neutral-overlay);border-radius:50%;animation:.8s linear infinite _2rqyvg0;display:inline-block}._2rqyvg1[data-reduced-motion]{animation-duration:2.4s}._2rqyvg2{border-width:2px;width:16px;height:16px}._2rqyvg3{border-width:3px;width:32px;height:32px}._2rqyvg4{border-top-color:var(--lovelace-color-content-default)}._2rqyvg5{border-top-color:var(--lovelace-color-content-on-accent)}@media (prefers-reduced-motion:reduce){._2rqyvg1{animation-duration:2.4s}}.jzxfg70{gap:var(--lovelace-gap-8);flex-direction:column;width:fit-content;display:flex}.jzxfg71{justify-content:center;align-items:center;gap:var(--lovelace-gap-8);flex-wrap:wrap;width:100%;display:flex}.jzxfg72{width:100%;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);color:var(--lovelace-color-content-secondary);justify-content:space-between;display:flex}._1y87qec0{justify-content:center;align-items:center;gap:var(--lovelace-gap-8);flex-wrap:wrap;width:100%;display:flex}@keyframes _9az62f0{0%{background-position-x:200%}to{background-position-x:0%}}@keyframes _9az62f1{0%,80%,to{vertical-align:0}40%{vertical-align:.3em}}._9az62f2{font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-medium);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);white-space:nowrap;background-image:linear-gradient(90deg, var(--lovelace-color-content-secondary) 0%, var(--lovelace-color-content-secondary) 35%, var(--lovelace-color-content-default) 50%, var(--lovelace-color-content-secondary) 65%, var(--lovelace-color-content-secondary) 100%);color:#0000;-webkit-text-fill-color:transparent;background-repeat:repeat;background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:2s linear infinite _9az62f0;display:inline-block}._9az62f3{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._9az62f4{display:inline}._9az62f5{line-height:0;animation:1.4s ease-in-out infinite _9az62f1;display:inline}._9az62f5:nth-child(2){animation-delay:.16s}._9az62f5:nth-child(3){animation-delay:.32s}@media (prefers-reduced-motion:reduce){._9az62f2{color:var(--lovelace-color-content-secondary);-webkit-text-fill-color:var(--lovelace-color-content-secondary);background-image:none;animation:none}._9az62f5{animation:none}}.kycjg90{outline:none;flex-direction:column;display:flex;position:relative}.kycjg91{z-index:1;outline:none;position:relative}.kycjg91[data-entering],.kycjg91[data-exiting]{transform:translateY(-100%)}.kycjg91[data-replacing][data-dropped]{z-index:0;position:absolute;top:0;left:0;right:0}.kycjg91[data-focus-visible]{box-shadow:inset 0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}@media (prefers-reduced-motion:no-preference){.kycjg91{transition:transform var(--lovelace-duration-medium) var(--lovelace-easing-standard)}}@media (forced-colors:active){.kycjg91[data-focus-visible]{outline-offset:-2px;outline:2px solid highlight}}.s6807p0{box-sizing:border-box;max-width:184px;padding:var(--lovelace-spacing-8);border-radius:var(--lovelace-border-radius-6);background-color:var(--lovelace-color-background-inverse);color:var(--lovelace-color-content-inverse);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);text-align:center;word-break:break-word;filter:drop-shadow(0 4px 14px #0000000f)}.s6807p0[data-entering],.s6807p0[data-exiting]{opacity:0}.s6807p1{display:block}.s6807p2{fill:var(--lovelace-color-background-inverse);display:block}.s6807p0[data-placement^=top] .s6807p2{transform:rotate(0)}.s6807p0[data-placement^=bottom] .s6807p2{transform:rotate(180deg)}.s6807p0[data-placement^=left] .s6807p2{transform:rotate(-90deg)}.s6807p0[data-placement^=right] .s6807p2{transform:rotate(90deg)}@media (prefers-reduced-motion:no-preference){.s6807p0{transition:opacity var(--lovelace-duration-fast) var(--lovelace-easing-standard)}}@keyframes bwq5ac0{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}.bwq5ac1{align-items:center;gap:var(--lovelace-gap-4);height:38px;padding-inline:var(--lovelace-padding-20);background-color:var(--lovelace-color-background-quaternary);border-start-start-radius:var(--lovelace-border-radius-20);border-start-end-radius:var(--lovelace-border-radius-20);border-end-end-radius:var(--lovelace-border-radius-20);border-end-start-radius:0;display:inline-flex}.bwq5ac2{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.bwq5ac3{width:var(--lovelace-spacing-8);height:var(--lovelace-spacing-8);border-radius:var(--lovelace-border-radius-full);background-color:var(--lovelace-color-content-default);flex-shrink:0;animation:.9s ease-in-out infinite bwq5ac0}.bwq5ac3:nth-child(2){animation-delay:.15s}.bwq5ac3:nth-child(3){animation-delay:.3s}@media (prefers-reduced-motion:reduce){.bwq5ac3{animation:none}}.jxp4or0{align-items:flex-end;gap:var(--lovelace-gap-4);box-sizing:border-box;flex-direction:column;width:100%;padding-inline-start:var(--lovelace-padding-20);display:flex}.jxp4or1{box-sizing:border-box;max-width:100%;padding-inline:var(--lovelace-padding-12);padding-block:var(--lovelace-padding-8);border-radius:var(--lovelace-border-radius-message);background-color:var(--lovelace-message-user-background);align-items:center;display:flex}.jxp4or2{color:var(--lovelace-message-user-content);font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-body);line-height:var(--lovelace-line-height-body);overflow-wrap:anywhere;word-break:break-word;margin:0}.jxp4or3{justify-content:flex-end;width:100%;display:flex}.jxp4or4{min-height:var(--lovelace-icon-size-lg);align-items:center;gap:var(--lovelace-gap-4);color:var(--lovelace-color-content-destructive);margin:0;display:inline-flex}.jxp4or5{border-radius:var(--lovelace-border-radius-6);cursor:pointer;background:0 0;border:none;outline:none;padding:0}.jxp4or5[data-focus-visible]{box-shadow:0 0 0 var(--lovelace-border-width-focus) var(--lovelace-color-border-focus)}.jxp4or6{color:inherit;font-family:var(--lovelace-font-family-body);font-weight:var(--lovelace-font-weight-regular);font-size:var(--lovelace-font-size-caption);line-height:var(--lovelace-line-height-caption);margin:0}.jxp4or4 [data-slot=icon]{font-size:var(--lovelace-icon-size-lg)}@media (forced-colors:active){.jxp4or5[data-focus-visible]{outline-offset:2px;outline:2px solid highlight}}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import type { RefObject } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* True until the element's entrance animation finishes. Style the "from" state
|
|
4
|
+
* off `[data-entering]`; removing the attribute is what starts the transition.
|
|
5
|
+
*/
|
|
6
|
+
export declare function useEnterAnimation(ref: RefObject<HTMLElement | null>): boolean;
|
|
7
|
+
/**
|
|
8
|
+
* True while the element plays its exit animation after `isPresent` goes false.
|
|
9
|
+
* Keep the element mounted until it returns false, and style the "to" state off
|
|
10
|
+
* `[data-exiting]`.
|
|
11
|
+
*/
|
|
12
|
+
export declare function useExitAnimation(ref: RefObject<HTMLElement | null>, isPresent: boolean): boolean;
|
|
13
|
+
/**
|
|
14
|
+
* The height to render the element at while it arrives or leaves, or null once it
|
|
15
|
+
* is settled and its own content should size it.
|
|
16
|
+
*
|
|
17
|
+
* A surface whose box already holds its full height reports the space before it
|
|
18
|
+
* arrives and keeps it after it leaves: whatever sits below jumps a full height at
|
|
19
|
+
* once, then waits out the travel against a gap. Animating the height moves that
|
|
20
|
+
* content in step with the surface instead.
|
|
21
|
+
*
|
|
22
|
+
* The height has to be measured, since a transition cannot run from `auto`. Each
|
|
23
|
+
* direction sets its start value in the commit that changed `isPresent`, then its
|
|
24
|
+
* end value on the next frame, so the browser has something to interpolate from.
|
|
25
|
+
* An arriving surface drops back to `null` once its transition ends, so a later
|
|
26
|
+
* change to its content can size it again.
|
|
27
|
+
*/
|
|
28
|
+
export declare function useSlideHeight(ref: RefObject<HTMLElement | null>, isPresent: boolean): number | null;
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { readPrefersReducedMotion as e } from "../hooks/usePrefersReducedMotion.js";
|
|
2
|
+
import { useCallback as t, useLayoutEffect as n, useRef as r, useState as i } from "react";
|
|
3
|
+
import { flushSync as a } from "react-dom";
|
|
4
|
+
//#region src/utils/animation.ts
|
|
5
|
+
function o(e, t, r) {
|
|
6
|
+
n(() => {
|
|
7
|
+
let n = e.current;
|
|
8
|
+
if (!t || !n) return;
|
|
9
|
+
if (!("getAnimations" in n)) {
|
|
10
|
+
r();
|
|
11
|
+
return;
|
|
12
|
+
}
|
|
13
|
+
let i = n.getAnimations();
|
|
14
|
+
if (i.length === 0) {
|
|
15
|
+
r();
|
|
16
|
+
return;
|
|
17
|
+
}
|
|
18
|
+
let o = !1;
|
|
19
|
+
return Promise.allSettled(i.map((e) => e.finished)).then(() => {
|
|
20
|
+
o || a(r);
|
|
21
|
+
}), () => {
|
|
22
|
+
o = !0;
|
|
23
|
+
};
|
|
24
|
+
}, [
|
|
25
|
+
e,
|
|
26
|
+
t,
|
|
27
|
+
r
|
|
28
|
+
]);
|
|
29
|
+
}
|
|
30
|
+
function s(e) {
|
|
31
|
+
let [n, r] = i(!0);
|
|
32
|
+
return o(e, n, t(() => r(!1), [])), n;
|
|
33
|
+
}
|
|
34
|
+
function c(e, n) {
|
|
35
|
+
let [r, a] = i(n ? "present" : "exited");
|
|
36
|
+
n && r !== "present" ? a("present") : !n && r === "present" && a("exiting");
|
|
37
|
+
let s = r === "exiting";
|
|
38
|
+
return o(e, s, t(() => a((e) => e === "exiting" ? "exited" : e), [])), s;
|
|
39
|
+
}
|
|
40
|
+
function l(t, a) {
|
|
41
|
+
let [o, s] = i(null), c = r(null);
|
|
42
|
+
return n(() => {
|
|
43
|
+
let n = t.current;
|
|
44
|
+
if (!n || c.current === a) return;
|
|
45
|
+
if (c.current = a, e()) {
|
|
46
|
+
s(null);
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
let r = n.offsetHeight;
|
|
50
|
+
if (r === 0) {
|
|
51
|
+
s(null);
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
s(a ? 0 : r);
|
|
55
|
+
let i = requestAnimationFrame(() => s(a ? r : 0));
|
|
56
|
+
if (!a) return () => cancelAnimationFrame(i);
|
|
57
|
+
let o = (e) => {
|
|
58
|
+
e.propertyName === "height" && s(null);
|
|
59
|
+
};
|
|
60
|
+
return n.addEventListener("transitionend", o), () => {
|
|
61
|
+
cancelAnimationFrame(i), n.removeEventListener("transitionend", o);
|
|
62
|
+
};
|
|
63
|
+
}, [t, a]), o;
|
|
64
|
+
}
|
|
65
|
+
//#endregion
|
|
66
|
+
export { s as useEnterAnimation, c as useExitAnimation, l as useSlideHeight };
|
|
67
|
+
|
|
68
|
+
//# sourceMappingURL=animation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animation.js","names":[],"sources":["../../src/utils/animation.ts"],"sourcesContent":["import type { RefObject } from \"react\";\nimport { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport { readPrefersReducedMotion } from \"../hooks/usePrefersReducedMotion.js\";\n\n/**\n * Runs `onEnd` once every animation on the element has settled. Modelled on\n * react-aria's overlay animation handling, which is private API — RAC drives\n * `data-entering`/`data-exiting` for us on Dialog and Sheet, but its Toast does\n * not, so lovelace needs its own copy for the toast surfaces.\n *\n * Two cases resolve immediately and both are load-bearing: jsdom has no\n * `getAnimations`, and an element whose transition has not started yet reports\n * none. The latter is what removes `data-entering` and lets the transition run.\n */\nfunction useAnimationEnd(\n\tref: RefObject<HTMLElement | null>,\n\tisActive: boolean,\n\tonEnd: () => void,\n) {\n\tuseLayoutEffect(() => {\n\t\tconst element = ref.current;\n\t\tif (!isActive || !element) {\n\t\t\treturn;\n\t\t}\n\t\tif (!(\"getAnimations\" in element)) {\n\t\t\tonEnd();\n\t\t\treturn;\n\t\t}\n\t\tconst animations = element.getAnimations();\n\t\tif (animations.length === 0) {\n\t\t\tonEnd();\n\t\t\treturn;\n\t\t}\n\t\tlet cancelled = false;\n\t\tPromise.allSettled(animations.map((animation) => animation.finished)).then(\n\t\t\t() => {\n\t\t\t\tif (!cancelled) {\n\t\t\t\t\tflushSync(onEnd);\n\t\t\t\t}\n\t\t\t},\n\t\t);\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t};\n\t}, [ref, isActive, onEnd]);\n}\n\n/**\n * True until the element's entrance animation finishes. Style the \"from\" state\n * off `[data-entering]`; removing the attribute is what starts the transition.\n */\nexport function useEnterAnimation(ref: RefObject<HTMLElement | null>): boolean {\n\tconst [isEntering, setIsEntering] = useState(true);\n\tuseAnimationEnd(\n\t\tref,\n\t\tisEntering,\n\t\tuseCallback(() => setIsEntering(false), []),\n\t);\n\treturn isEntering;\n}\n\n/**\n * True while the element plays its exit animation after `isPresent` goes false.\n * Keep the element mounted until it returns false, and style the \"to\" state off\n * `[data-exiting]`.\n */\nexport function useExitAnimation(\n\tref: RefObject<HTMLElement | null>,\n\tisPresent: boolean,\n): boolean {\n\tconst [phase, setPhase] = useState<\"present\" | \"exiting\" | \"exited\">(\n\t\tisPresent ? \"present\" : \"exited\",\n\t);\n\n\t// Derive during render rather than in an effect so the exit styles land in the\n\t// same commit that dropped `isPresent` — a frame of the entered state would\n\t// otherwise paint first and the transition would start from the wrong place.\n\tif (isPresent && phase !== \"present\") {\n\t\tsetPhase(\"present\");\n\t} else if (!isPresent && phase === \"present\") {\n\t\tsetPhase(\"exiting\");\n\t}\n\n\tconst isExiting = phase === \"exiting\";\n\tuseAnimationEnd(\n\t\tref,\n\t\tisExiting,\n\t\tuseCallback(\n\t\t\t() => setPhase((current) => (current === \"exiting\" ? \"exited\" : current)),\n\t\t\t[],\n\t\t),\n\t);\n\treturn isExiting;\n}\n\n/**\n * The height to render the element at while it arrives or leaves, or null once it\n * is settled and its own content should size it.\n *\n * A surface whose box already holds its full height reports the space before it\n * arrives and keeps it after it leaves: whatever sits below jumps a full height at\n * once, then waits out the travel against a gap. Animating the height moves that\n * content in step with the surface instead.\n *\n * The height has to be measured, since a transition cannot run from `auto`. Each\n * direction sets its start value in the commit that changed `isPresent`, then its\n * end value on the next frame, so the browser has something to interpolate from.\n * An arriving surface drops back to `null` once its transition ends, so a later\n * change to its content can size it again.\n */\nexport function useSlideHeight(\n\tref: RefObject<HTMLElement | null>,\n\tisPresent: boolean,\n): number | null {\n\tconst [height, setHeight] = useState<number | null>(null);\n\tconst settledRef = useRef<boolean | null>(null);\n\n\tuseLayoutEffect(() => {\n\t\tconst element = ref.current;\n\t\tif (!element || settledRef.current === isPresent) {\n\t\t\treturn;\n\t\t}\n\t\tsettledRef.current = isPresent;\n\n\t\t// The surface only transitions its height under `no-preference`, so pinning\n\t\t// a measured height here would never hear the `transitionend` that hands\n\t\t// sizing back, and later, longer copy would be clipped for good.\n\t\tif (readPrefersReducedMotion()) {\n\t\t\tsetHeight(null);\n\t\t\treturn;\n\t\t}\n\n\t\t// A surface measured inside a hidden frame reports 0. Pinning that would clip\n\t\t// it shut for good: the height never changes, so no transition starts and no\n\t\t// `transitionend` arrives to hand sizing back.\n\t\tconst content = element.offsetHeight;\n\t\tif (content === 0) {\n\t\t\tsetHeight(null);\n\t\t\treturn;\n\t\t}\n\t\tsetHeight(isPresent ? 0 : content);\n\t\tconst frame = requestAnimationFrame(() =>\n\t\t\tsetHeight(isPresent ? content : 0),\n\t\t);\n\n\t\tif (!isPresent) {\n\t\t\treturn () => cancelAnimationFrame(frame);\n\t\t}\n\t\t// Hand sizing back to the content once it is in. A leaving surface keeps its\n\t\t// zero height instead — it is about to unmount.\n\t\tconst handleEnd = (event: TransitionEvent) => {\n\t\t\tif (event.propertyName === \"height\") {\n\t\t\t\tsetHeight(null);\n\t\t\t}\n\t\t};\n\t\telement.addEventListener(\"transitionend\", handleEnd);\n\t\treturn () => {\n\t\t\tcancelAnimationFrame(frame);\n\t\t\telement.removeEventListener(\"transitionend\", handleEnd);\n\t\t};\n\t}, [ref, isPresent]);\n\n\treturn height;\n}\n"],"mappings":";;;;AAeA,SAAS,EACR,GACA,GACA,GACC;AACD,SAAsB;EACrB,IAAM,IAAU,EAAI;AACpB,MAAI,CAAC,KAAY,CAAC,EACjB;AAED,MAAI,EAAE,mBAAmB,IAAU;AAClC,MAAO;AACP;;EAED,IAAM,IAAa,EAAQ,eAAe;AAC1C,MAAI,EAAW,WAAW,GAAG;AAC5B,MAAO;AACP;;EAED,IAAI,IAAY;AAQhB,SAPA,QAAQ,WAAW,EAAW,KAAK,MAAc,EAAU,SAAS,CAAC,CAAC,WAC/D;AACL,GAAK,KACJ,EAAU,EAAM;IAGlB,QACY;AACZ,OAAY;;IAEX;EAAC;EAAK;EAAU;EAAM,CAAC;;AAO3B,SAAgB,EAAkB,GAA6C;CAC9E,IAAM,CAAC,GAAY,KAAiB,EAAS,GAAK;AAMlD,QALA,EACC,GACA,GACA,QAAkB,EAAc,GAAM,EAAE,EAAE,CAAC,CAC3C,EACM;;AAQR,SAAgB,EACf,GACA,GACU;CACV,IAAM,CAAC,GAAO,KAAY,EACzB,IAAY,YAAY,SACxB;AAKD,CAAI,KAAa,MAAU,YAC1B,EAAS,UAAU,GACT,CAAC,KAAa,MAAU,aAClC,EAAS,UAAU;CAGpB,IAAM,IAAY,MAAU;AAS5B,QARA,EACC,GACA,GACA,QACO,GAAU,MAAa,MAAY,YAAY,WAAW,EAAS,EACzE,EAAE,CACF,CACD,EACM;;AAkBR,SAAgB,EACf,GACA,GACgB;CAChB,IAAM,CAAC,GAAQ,KAAa,EAAwB,KAAK,EACnD,IAAa,EAAuB,KAAK;AA+C/C,QA7CA,QAAsB;EACrB,IAAM,IAAU,EAAI;AACpB,MAAI,CAAC,KAAW,EAAW,YAAY,EACtC;AAOD,MALA,EAAW,UAAU,GAKjB,GAA0B,EAAE;AAC/B,KAAU,KAAK;AACf;;EAMD,IAAM,IAAU,EAAQ;AACxB,MAAI,MAAY,GAAG;AAClB,KAAU,KAAK;AACf;;AAED,IAAU,IAAY,IAAI,EAAQ;EAClC,IAAM,IAAQ,4BACb,EAAU,IAAY,IAAU,EAAE,CAClC;AAED,MAAI,CAAC,EACJ,cAAa,qBAAqB,EAAM;EAIzC,IAAM,KAAa,MAA2B;AAC7C,GAAI,EAAM,iBAAiB,YAC1B,EAAU,KAAK;;AAIjB,SADA,EAAQ,iBAAiB,iBAAiB,EAAU,QACvC;AAEZ,GADA,qBAAqB,EAAM,EAC3B,EAAQ,oBAAoB,iBAAiB,EAAU;;IAEtD,CAAC,GAAK,EAAU,CAAC,EAEb"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ada-cx/lovelace",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"description": "Ada's messaging design system primitives: React Aria Components behavior, vanilla-extract styling, Figma-generated design tokens.",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"type": "module",
|
|
@@ -52,7 +52,8 @@
|
|
|
52
52
|
"@vanilla-extract/css": "^1.20.1",
|
|
53
53
|
"@vanilla-extract/recipes": "^0.5.7",
|
|
54
54
|
"react-aria": "^3.48.0",
|
|
55
|
-
"react-aria-components": "^1.15.1"
|
|
55
|
+
"react-aria-components": "^1.15.1",
|
|
56
|
+
"react-stately": "^3.46.0"
|
|
56
57
|
},
|
|
57
58
|
"peerDependencies": {
|
|
58
59
|
"react": "^19.0.0",
|