tinkiet 0.4.4 → 0.4.10

package/box/box.d.ts

@@ -15,7 +15,7 @@ type Color = typeof colors;
  * @attr {"horizontal" | "vertical" | "true" | "false"} fill - Whether the width and/or height should fill the container.
  * @attr {"grow" | "shrink" | "true" | "false"} flex - flex-grow and/or flex-shrink
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} gap - The amount of spacing between child elements. This should not be used in conjunction with 'wrap' as the gap elements will not wrap gracefully. If a child is a Fragment, Box will not add a gap between the children of the Fragment.
- * @attr {"around" | "between" | "center" | "end" | "start" | "stretch"} justify - How to align the contents along the main axis.
+ * @attr {"around" | "between" | "center" | "end" | "evenly" | "start" | "stretch"} justify - How to align the contents along the main axis.
  * @attr [justify="stretch"]
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} margin - The amount of margin around the component. An object can be specified to distinguish horizontal margin, vertical margin, and margin on a particular side.
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} padding - The amount of padding around the box contents. An object can be specified to distinguish horizontal padding, vertical padding, and padding on a particular side of the box.

package/box/box.js

@@ -59,7 +59,7 @@ const colors = [
  * @attr {"horizontal" | "vertical" | "true" | "false"} fill - Whether the width and/or height should fill the container.
  * @attr {"grow" | "shrink" | "true" | "false"} flex - flex-grow and/or flex-shrink
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} gap - The amount of spacing between child elements. This should not be used in conjunction with 'wrap' as the gap elements will not wrap gracefully. If a child is a Fragment, Box will not add a gap between the children of the Fragment.
- * @attr {"around" | "between" | "center" | "end" | "start" | "stretch"} justify - How to align the contents along the main axis.
+ * @attr {"around" | "between" | "center" | "end" | "evenly" | "start" | "stretch"} justify - How to align the contents along the main axis.
  * @attr [justify="stretch"]
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} margin - The amount of margin around the component. An object can be specified to distinguish horizontal margin, vertical margin, and margin on a particular side.
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} padding - The amount of padding around the box contents. An object can be specified to distinguish horizontal padding, vertical padding, and padding on a particular side of the box.

package/box/box.scss.js

@@ -1,4 +1,4 @@
-var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{box-sizing:border-box;display:flex;flex-direction:column;position:relative;transition:background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease)}:host([hidden]){display:none}.ripple{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.ripple span{background-color:currentColor;border-radius:50%;opacity:.5;position:absolute}:host([align-content=start]){align-content:flex-start}:host([align-content=end]){align-content:flex-end}:host([align-content=stretch]){align-content:stretch}:host([align-content=center]){align-content:center}:host([align-content=around]){align-content:space-around}:host([align-content=between]){align-content:space-between}:host([align-items=start]){align-items:flex-start}:host([align-items=end]){align-items:flex-end}:host([align-items=stretch]){align-items:stretch}:host([align-items=center]){align-items:center}:host([align-items=baseline]){align-items:baseline}:host([align-self=start]){align-self:flex-start}:host([align-self=end]){align-self:flex-end}:host([align-self=stretch]){align-self:stretch}:host([align-self=center]){align-self:center}:host([background=primary-lighter]){background-color:var(--primary-lighter)}:host([color=primary-lighter]){color:var(--primary-lighter)}:host([background=primary-light]){background-color:var(--primary-light)}:host([color=primary-light]){color:var(--primary-light)}:host([background=primary]){background-color:var(--primary)}:host([color=primary]){color:var(--primary)}:host([background=primary-dark]){background-color:var(--primary-dark)}:host([color=primary-dark]){color:var(--primary-dark)}:host([background=primary-darker]){background-color:var(--primary-darker)}:host([color=primary-darker]){color:var(--primary-darker)}:host([background=on-primary-lighter]){background-color:var(--on-primary-lighter)}:host([color=on-primary-lighter]){color:var(--on-primary-lighter)}:host([background=on-primary-light]){background-color:var(--on-primary-light)}:host([color=on-primary-light]){color:var(--on-primary-light)}:host([background=on-primary]){background-color:var(--on-primary)}:host([color=on-primary]){color:var(--on-primary)}:host([background=on-primary-dark]){background-color:var(--on-primary-dark)}:host([color=on-primary-dark]){color:var(--on-primary-dark)}:host([background=on-primary-darker]){background-color:var(--on-primary-darker)}:host([color=on-primary-darker]){color:var(--on-primary-darker)}:host([background=accent-lighter]){background-color:var(--accent-lighter)}:host([color=accent-lighter]){color:var(--accent-lighter)}:host([background=accent-light]){background-color:var(--accent-light)}:host([color=accent-light]){color:var(--accent-light)}:host([background=accent]){background-color:var(--accent)}:host([color=accent]){color:var(--accent)}:host([background=accent-dark]){background-color:var(--accent-dark)}:host([color=accent-dark]){color:var(--accent-dark)}:host([background=accent-darker]){background-color:var(--accent-darker)}:host([color=accent-darker]){color:var(--accent-darker)}:host([background=on-accent-lighter]){background-color:var(--on-accent-lighter)}:host([color=on-accent-lighter]){color:var(--on-accent-lighter)}:host([background=on-accent-light]){background-color:var(--on-accent-light)}:host([color=on-accent-light]){color:var(--on-accent-light)}:host([background=on-accent]){background-color:var(--on-accent)}:host([color=on-accent]){color:var(--on-accent)}:host([background=on-accent-dark]){background-color:var(--on-accent-dark)}:host([color=on-accent-dark]){color:var(--on-accent-dark)}:host([background=on-accent-darker]){background-color:var(--on-accent-darker)}:host([color=on-accent-darker]){color:var(--on-accent-darker)}:host([background=error-lighter]){background-color:var(--error-lighter)}:host([color=error-lighter]){color:var(--error-lighter)}:host([background=error-light]){background-color:var(--error-light)}:host([color=error-light]){color:var(--error-light)}:host([background=error]){background-color:var(--error)}:host([color=error]){color:var(--error)}:host([background=error-dark]){background-color:var(--error-dark)}:host([color=error-dark]){color:var(--error-dark)}:host([background=error-darker]){background-color:var(--error-darker)}:host([color=error-darker]){color:var(--error-darker)}:host([background=on-error-lighter]){background-color:var(--on-error-lighter)}:host([color=on-error-lighter]){color:var(--on-error-lighter)}:host([background=on-error-light]){background-color:var(--on-error-light)}:host([color=on-error-light]){color:var(--on-error-light)}:host([background=on-error]){background-color:var(--on-error)}:host([color=on-error]){color:var(--on-error)}:host([background=on-error-dark]){background-color:var(--on-error-dark)}:host([color=on-error-dark]){color:var(--on-error-dark)}:host([background=on-error-darker]){background-color:var(--on-error-darker)}:host([color=on-error-darker]){color:var(--on-error-darker)}:host([background=shade-lighter]){background-color:var(--shade-lighter)}:host([color=shade-lighter]){color:var(--shade-lighter)}:host([background=shade-light]){background-color:var(--shade-light)}:host([color=shade-light]){color:var(--shade-light)}:host([background=shade]){background-color:var(--shade)}:host([color=shade]){color:var(--shade)}:host([background=shade-dark]){background-color:var(--shade-dark)}:host([color=shade-dark]){color:var(--shade-dark)}:host([background=shade-darker]){background-color:var(--shade-darker)}:host([color=shade-darker]){color:var(--shade-darker)}:host([background=on-shade-lighter]){background-color:var(--on-shade-lighter)}:host([color=on-shade-lighter]){color:var(--on-shade-lighter)}:host([background=on-shade-light]){background-color:var(--on-shade-light)}:host([color=on-shade-light]){color:var(--on-shade-light)}:host([background=on-shade]){background-color:var(--on-shade)}:host([color=on-shade]){color:var(--on-shade)}:host([background=on-shade-dark]){background-color:var(--on-shade-dark)}:host([color=on-shade-dark]){color:var(--on-shade-dark)}:host([background=on-shade-darker]){background-color:var(--on-shade-darker)}:host([color=on-shade-darker]){color:var(--on-shade-darker)}:host([background=foreground]){background-color:var(--foreground)}:host([color=foreground]){color:var(--foreground)}:host([background=background]){background-color:var(--background)}:host([color=background]){color:var(--background)}:host([direction=column]){flex-direction:column}:host([direction=row-reverse]){flex-direction:row-reverse}:host([direction=column-reverse]){flex-direction:column-reverse}:host([text=center]){text-align:center}:host([text=justify]){text-align:justify}:host([text=left]){text-align:left}:host([text=right]){text-align:right}:host([weight=\"100\"]){font-weight:100}:host([weight=\"200\"]){font-weight:200}:host([weight=\"300\"]){font-weight:300}:host([weight=\"400\"]){font-weight:400}:host([weight=\"500\"]){font-weight:500}:host([weight=\"600\"]){font-weight:600}:host([weight=\"700\"]){font-weight:700}:host([weight=\"800\"]){font-weight:800}:host([weight=\"900\"]){font-weight:900}:host([weight=lighter]){font-weight:lighter}:host([weight=bold]){font-weight:700}:host([weight=bolder]){font-weight:bolder}:host([direction=row]){flex-direction:row}:host([direction=row-reverse]){flex-direction:row}:host([elevation=xsmall]){box-shadow:var(--box-elevation,var(--elevation-1,0 1px 2px var(--shadow)))}:host([elevation=small]){box-shadow:var(--box-elevation,var(--elevation-2,0 2px 4px var(--shadow)))}:host([elevation=medium]){box-shadow:var(--box-elevation,var(--elevation-3,0 4px 8px var(--shadow)))}:host([elevation=large]){box-shadow:var(--box-elevation,var(--elevation-4,0 8px 16px var(--shadow)))}:host([elevation=xlarge]){box-shadow:var(--box-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}:host([fill=horizontal]){width:100%}:host([fill=vertical]){height:100%}:host([fill=true]){height:100%;width:100%}:host([flex=grow]){flex:1 0}:host([flex=shrink]){flex:0 1}:host([flex=true]){flex:1 1}:host([flex=false]){flex:0 0}:host([gap=xsmall]) ::slotted(*),:host([gap=xsmall][direction=column]) ::slotted(*){margin:var(--spacing-xs,.25rem) 0}:host([gap=xsmall][direction=row]) ::slotted(*){margin:0 var(--spacing-xs,.25rem)}:host([margin=xsmall]){margin:var(--box-margin,var(--spacing-xs,.25rem))}:host([margin=\"xsmall auto\"]){margin:var(--box-margin,var(--spacing-xs,.25rem)) auto}:host([margin=\"auto xsmall\"]){margin:auto var(--box-margin,var(--spacing-xs,.25rem))}:host([padding=xsmall]){padding:var(--box-padding,var(--spacing-xs,.25rem))}:host([gap=small]) ::slotted(*),:host([gap=small][direction=column]) ::slotted(*){margin:var(--spacing-s,.5rem) 0}:host([gap=small][direction=row]) ::slotted(*){margin:0 var(--spacing-s,.5rem)}:host([margin=small]){margin:var(--box-margin,var(--spacing-s,.5rem))}:host([margin=\"small auto\"]){margin:var(--box-margin,var(--spacing-s,.5rem)) auto}:host([margin=\"auto small\"]){margin:auto var(--box-margin,var(--spacing-s,.5rem))}:host([padding=small]){padding:var(--box-padding,var(--spacing-s,.5rem))}:host([gap=medium]) ::slotted(*),:host([gap=medium][direction=column]) ::slotted(*){margin:var(--spacing-m,1rem) 0}:host([gap=medium][direction=row]) ::slotted(*){margin:0 var(--spacing-m,1rem)}:host([margin=medium]){margin:var(--box-margin,var(--spacing-m,1rem))}:host([margin=\"medium auto\"]){margin:var(--box-margin,var(--spacing-m,1rem)) auto}:host([margin=\"auto medium\"]){margin:auto var(--box-margin,var(--spacing-m,1rem))}:host([padding=medium]){padding:var(--box-padding,var(--spacing-m,1rem))}:host([gap=large]) ::slotted(*),:host([gap=large][direction=column]) ::slotted(*){margin:var(--spacing-l,1.25rem) 0}:host([gap=large][direction=row]) ::slotted(*){margin:0 var(--spacing-l,1.25rem)}:host([margin=large]){margin:var(--box-margin,var(--spacing-l,1.25rem))}:host([margin=\"large auto\"]){margin:var(--box-margin,var(--spacing-l,1.25rem)) auto}:host([margin=\"auto large\"]){margin:auto var(--box-margin,var(--spacing-l,1.25rem))}:host([padding=large]){padding:var(--box-padding,var(--spacing-l,1.25rem))}:host([gap=xlarge]) ::slotted(*),:host([gap=xlarge][direction=column]) ::slotted(*){margin:var(--spacing-xl,2rem) 0}:host([gap=xlarge][direction=row]) ::slotted(*){margin:0 var(--spacing-xl,2rem)}:host([margin=xlarge]){margin:var(--box-margin,var(--spacing-xl,2rem))}:host([margin=\"xlarge auto\"]){margin:var(--box-margin,var(--spacing-xl,2rem)) auto}:host([margin=\"auto xlarge\"]){margin:auto var(--box-margin,var(--spacing-xl,2rem))}:host([padding=xlarge]){padding:var(--box-padding,var(--spacing-xl,2rem))}:host([font=xsmall]),:host([size=xsmall]){font-size:var(--box-font-size,var(--font-size-xs,.625rem))}:host([font=small]),:host([size=small]){font-size:var(--box-font-size,var(--font-size-s,.875rem))}:host([font=medium]),:host([size=medium]){font-size:var(--box-font-size,var(--font-size-m,1rem))}:host([font=large]),:host([size=large]){font-size:var(--box-font-size,var(--font-size-l,1.25rem))}:host([font=xlarge]),:host([size=xlarge]){font-size:var(--box-font-size,var(--font-size-xl,1.5rem))}:host([font=xxlarge]),:host([size=xxlarge]){font-size:var(--box-font-size,var(--font-size-xxl,2.25rem))}:host([justify=start]){justify-content:flex-start}:host([justify=end]){justify-content:flex-end}:host([justify=stretch]){justify-content:stretch}:host([justify=baseline]){justify-content:baseline}:host([justify=center]){justify-content:center}:host([justify=around]){justify-content:space-around}:host([justify=between]){justify-content:space-between}:host([overflow=auto]){overflow:auto}:host([overflow=hidden]){overflow:hidden}:host([overflow=scroll]){overflow:scroll}:host([overflow=visible]){overflow:visible}:host([radius=none]){border-radius:var(--box-border-radius,0)}:host([radius=small]){border-radius:var(--box-border-radius,var(--border-radius-small,.125rem))}:host([radius=medium]){border-radius:var(--box-border-radius,var(--border-radius-medium,.25rem))}:host([radius=large]){border-radius:var(--box-border-radius,var(--border-radius-large,.5rem))}:host([radius=xlarge]){border-radius:var(--box-border-radius,var(--border-radius-x-large,1rem))}:host([radius=circle]){border-radius:var(--box-border-radius,var(--border-radius-circle,50%))}:host([radius=pill]){border-radius:var(--box-border-radius,var(--border-radius-pill,9999px))}:host([max-width=xxsmall]){max-width:var(--box-max-width,var(--size-xxs,2rem))}:host([width=xxsmall]){width:var(--box-width,var(--size-xxs,2rem))}:host([max-height=xxsmall]){max-height:var(--box-max-height,var(--size-xxs,2rem))}:host([height=xxsmall]){height:var(--box-height,var(--size-xxs,2rem))}:host([max-width=xsmall]){max-width:var(--box-max-width,var(--size-xs,4rem))}:host([width=xsmall]){width:var(--box-width,var(--size-xs,4rem))}:host([max-height=xsmall]){max-height:var(--box-max-height,var(--size-xs,4rem))}:host([height=xsmall]){height:var(--box-height,var(--size-xs,4rem))}:host([max-width=small]){max-width:var(--box-max-width,var(--size-s,8rem))}:host([width=small]){width:var(--box-width,var(--size-s,8rem))}:host([max-height=small]){max-height:var(--box-max-height,var(--size-s,8rem))}:host([height=small]){height:var(--box-height,var(--size-s,8rem))}:host([max-width=medium]){max-width:var(--box-max-width,var(--size-m,16rem))}:host([width=medium]){width:var(--box-width,var(--size-m,16rem))}:host([max-height=medium]){max-height:var(--box-max-height,var(--size-m,16rem))}:host([height=medium]){height:var(--box-height,var(--size-m,16rem))}:host([max-width=large]){max-width:var(--box-max-width,var(--size-l,32rem))}:host([width=large]){width:var(--box-width,var(--size-l,32rem))}:host([max-height=large]){max-height:var(--box-max-height,var(--size-l,32rem))}:host([height=large]){height:var(--box-height,var(--size-l,32rem))}:host([max-width=xlarge]){max-width:var(--box-max-width,var(--size-xl,48rem))}:host([width=xlarge]){width:var(--box-width,var(--size-xl,48rem))}:host([max-height=xlarge]){max-height:var(--box-max-height,var(--size-xl,48rem))}:host([height=xlarge]){height:var(--box-height,var(--size-xl,48rem))}:host([max-width=xxlarge]){max-width:var(--box-max-width,var(--size-xxl,64rem))}:host([width=xxlarge]){width:var(--box-width,var(--size-xxl,64rem))}:host([max-height=xxlarge]){max-height:var(--box-max-height,var(--size-xxl,64rem))}:host([height=xxlarge]){height:var(--box-height,var(--size-xxl,64rem))}:host([wrap=true]){flex-wrap:wrap}:host([wrap=reverse]){flex-wrap:wrap-reverse}";
-var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{box-sizing:border-box;display:flex;flex-direction:column;position:relative;transition:background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease)}:host([hidden]){display:none}.ripple{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.ripple span{background-color:currentColor;border-radius:50%;opacity:.5;position:absolute}:host([align-content=start]){align-content:flex-start}:host([align-content=end]){align-content:flex-end}:host([align-content=stretch]){align-content:stretch}:host([align-content=center]){align-content:center}:host([align-content=around]){align-content:space-around}:host([align-content=between]){align-content:space-between}:host([align-items=start]){align-items:flex-start}:host([align-items=end]){align-items:flex-end}:host([align-items=stretch]){align-items:stretch}:host([align-items=center]){align-items:center}:host([align-items=baseline]){align-items:baseline}:host([align-self=start]){align-self:flex-start}:host([align-self=end]){align-self:flex-end}:host([align-self=stretch]){align-self:stretch}:host([align-self=center]){align-self:center}:host([background=primary-lighter]){background-color:var(--primary-lighter)}:host([color=primary-lighter]){color:var(--primary-lighter)}:host([background=primary-light]){background-color:var(--primary-light)}:host([color=primary-light]){color:var(--primary-light)}:host([background=primary]){background-color:var(--primary)}:host([color=primary]){color:var(--primary)}:host([background=primary-dark]){background-color:var(--primary-dark)}:host([color=primary-dark]){color:var(--primary-dark)}:host([background=primary-darker]){background-color:var(--primary-darker)}:host([color=primary-darker]){color:var(--primary-darker)}:host([background=on-primary-lighter]){background-color:var(--on-primary-lighter)}:host([color=on-primary-lighter]){color:var(--on-primary-lighter)}:host([background=on-primary-light]){background-color:var(--on-primary-light)}:host([color=on-primary-light]){color:var(--on-primary-light)}:host([background=on-primary]){background-color:var(--on-primary)}:host([color=on-primary]){color:var(--on-primary)}:host([background=on-primary-dark]){background-color:var(--on-primary-dark)}:host([color=on-primary-dark]){color:var(--on-primary-dark)}:host([background=on-primary-darker]){background-color:var(--on-primary-darker)}:host([color=on-primary-darker]){color:var(--on-primary-darker)}:host([background=accent-lighter]){background-color:var(--accent-lighter)}:host([color=accent-lighter]){color:var(--accent-lighter)}:host([background=accent-light]){background-color:var(--accent-light)}:host([color=accent-light]){color:var(--accent-light)}:host([background=accent]){background-color:var(--accent)}:host([color=accent]){color:var(--accent)}:host([background=accent-dark]){background-color:var(--accent-dark)}:host([color=accent-dark]){color:var(--accent-dark)}:host([background=accent-darker]){background-color:var(--accent-darker)}:host([color=accent-darker]){color:var(--accent-darker)}:host([background=on-accent-lighter]){background-color:var(--on-accent-lighter)}:host([color=on-accent-lighter]){color:var(--on-accent-lighter)}:host([background=on-accent-light]){background-color:var(--on-accent-light)}:host([color=on-accent-light]){color:var(--on-accent-light)}:host([background=on-accent]){background-color:var(--on-accent)}:host([color=on-accent]){color:var(--on-accent)}:host([background=on-accent-dark]){background-color:var(--on-accent-dark)}:host([color=on-accent-dark]){color:var(--on-accent-dark)}:host([background=on-accent-darker]){background-color:var(--on-accent-darker)}:host([color=on-accent-darker]){color:var(--on-accent-darker)}:host([background=error-lighter]){background-color:var(--error-lighter)}:host([color=error-lighter]){color:var(--error-lighter)}:host([background=error-light]){background-color:var(--error-light)}:host([color=error-light]){color:var(--error-light)}:host([background=error]){background-color:var(--error)}:host([color=error]){color:var(--error)}:host([background=error-dark]){background-color:var(--error-dark)}:host([color=error-dark]){color:var(--error-dark)}:host([background=error-darker]){background-color:var(--error-darker)}:host([color=error-darker]){color:var(--error-darker)}:host([background=on-error-lighter]){background-color:var(--on-error-lighter)}:host([color=on-error-lighter]){color:var(--on-error-lighter)}:host([background=on-error-light]){background-color:var(--on-error-light)}:host([color=on-error-light]){color:var(--on-error-light)}:host([background=on-error]){background-color:var(--on-error)}:host([color=on-error]){color:var(--on-error)}:host([background=on-error-dark]){background-color:var(--on-error-dark)}:host([color=on-error-dark]){color:var(--on-error-dark)}:host([background=on-error-darker]){background-color:var(--on-error-darker)}:host([color=on-error-darker]){color:var(--on-error-darker)}:host([background=shade-lighter]){background-color:var(--shade-lighter)}:host([color=shade-lighter]){color:var(--shade-lighter)}:host([background=shade-light]){background-color:var(--shade-light)}:host([color=shade-light]){color:var(--shade-light)}:host([background=shade]){background-color:var(--shade)}:host([color=shade]){color:var(--shade)}:host([background=shade-dark]){background-color:var(--shade-dark)}:host([color=shade-dark]){color:var(--shade-dark)}:host([background=shade-darker]){background-color:var(--shade-darker)}:host([color=shade-darker]){color:var(--shade-darker)}:host([background=on-shade-lighter]){background-color:var(--on-shade-lighter)}:host([color=on-shade-lighter]){color:var(--on-shade-lighter)}:host([background=on-shade-light]){background-color:var(--on-shade-light)}:host([color=on-shade-light]){color:var(--on-shade-light)}:host([background=on-shade]){background-color:var(--on-shade)}:host([color=on-shade]){color:var(--on-shade)}:host([background=on-shade-dark]){background-color:var(--on-shade-dark)}:host([color=on-shade-dark]){color:var(--on-shade-dark)}:host([background=on-shade-darker]){background-color:var(--on-shade-darker)}:host([color=on-shade-darker]){color:var(--on-shade-darker)}:host([background=foreground]){background-color:var(--foreground)}:host([color=foreground]){color:var(--foreground)}:host([background=background]){background-color:var(--background)}:host([color=background]){color:var(--background)}:host([direction=column]){flex-direction:column}:host([direction=row-reverse]){flex-direction:row-reverse}:host([direction=column-reverse]){flex-direction:column-reverse}:host([text=center]){text-align:center}:host([text=justify]){text-align:justify}:host([text=left]){text-align:left}:host([text=right]){text-align:right}:host([weight=\"100\"]){font-weight:100}:host([weight=\"200\"]){font-weight:200}:host([weight=\"300\"]){font-weight:300}:host([weight=\"400\"]){font-weight:400}:host([weight=\"500\"]){font-weight:500}:host([weight=\"600\"]){font-weight:600}:host([weight=\"700\"]){font-weight:700}:host([weight=\"800\"]){font-weight:800}:host([weight=\"900\"]){font-weight:900}:host([weight=lighter]){font-weight:lighter}:host([weight=bold]){font-weight:700}:host([weight=bolder]){font-weight:bolder}:host([direction=row]){flex-direction:row}:host([direction=row-reverse]){flex-direction:row}:host([elevation=xsmall]){box-shadow:var(--box-elevation,var(--elevation-1,0 1px 2px var(--shadow)))}:host([elevation=small]){box-shadow:var(--box-elevation,var(--elevation-2,0 2px 4px var(--shadow)))}:host([elevation=medium]){box-shadow:var(--box-elevation,var(--elevation-3,0 4px 8px var(--shadow)))}:host([elevation=large]){box-shadow:var(--box-elevation,var(--elevation-4,0 8px 16px var(--shadow)))}:host([elevation=xlarge]){box-shadow:var(--box-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}:host([fill=horizontal]){width:100%}:host([fill=vertical]){height:100%}:host([fill=true]){height:100%;width:100%}:host([flex=grow]){flex:1 0}:host([flex=shrink]){flex:0 1}:host([flex=true]){flex:1 1}:host([flex=false]){flex:0 0}:host([gap=xsmall]) ::slotted(*),:host([gap=xsmall][direction=column]) ::slotted(*){margin:var(--spacing-xs,.25rem) 0}:host([gap=xsmall][direction=row]) ::slotted(*){margin:0 var(--spacing-xs,.25rem)}:host([margin=xsmall]){margin:var(--box-margin,var(--spacing-xs,.25rem))}:host([margin=\"xsmall auto\"]){margin:var(--box-margin,var(--spacing-xs,.25rem)) auto}:host([margin=\"auto xsmall\"]){margin:auto var(--box-margin,var(--spacing-xs,.25rem))}:host([padding=xsmall]){padding:var(--box-padding,var(--spacing-xs,.25rem))}:host([gap=small]) ::slotted(*),:host([gap=small][direction=column]) ::slotted(*){margin:var(--spacing-s,.5rem) 0}:host([gap=small][direction=row]) ::slotted(*){margin:0 var(--spacing-s,.5rem)}:host([margin=small]){margin:var(--box-margin,var(--spacing-s,.5rem))}:host([margin=\"small auto\"]){margin:var(--box-margin,var(--spacing-s,.5rem)) auto}:host([margin=\"auto small\"]){margin:auto var(--box-margin,var(--spacing-s,.5rem))}:host([padding=small]){padding:var(--box-padding,var(--spacing-s,.5rem))}:host([gap=medium]) ::slotted(*),:host([gap=medium][direction=column]) ::slotted(*){margin:var(--spacing-m,1rem) 0}:host([gap=medium][direction=row]) ::slotted(*){margin:0 var(--spacing-m,1rem)}:host([margin=medium]){margin:var(--box-margin,var(--spacing-m,1rem))}:host([margin=\"medium auto\"]){margin:var(--box-margin,var(--spacing-m,1rem)) auto}:host([margin=\"auto medium\"]){margin:auto var(--box-margin,var(--spacing-m,1rem))}:host([padding=medium]){padding:var(--box-padding,var(--spacing-m,1rem))}:host([gap=large]) ::slotted(*),:host([gap=large][direction=column]) ::slotted(*){margin:var(--spacing-l,1.25rem) 0}:host([gap=large][direction=row]) ::slotted(*){margin:0 var(--spacing-l,1.25rem)}:host([margin=large]){margin:var(--box-margin,var(--spacing-l,1.25rem))}:host([margin=\"large auto\"]){margin:var(--box-margin,var(--spacing-l,1.25rem)) auto}:host([margin=\"auto large\"]){margin:auto var(--box-margin,var(--spacing-l,1.25rem))}:host([padding=large]){padding:var(--box-padding,var(--spacing-l,1.25rem))}:host([gap=xlarge]) ::slotted(*),:host([gap=xlarge][direction=column]) ::slotted(*){margin:var(--spacing-xl,2rem) 0}:host([gap=xlarge][direction=row]) ::slotted(*){margin:0 var(--spacing-xl,2rem)}:host([margin=xlarge]){margin:var(--box-margin,var(--spacing-xl,2rem))}:host([margin=\"xlarge auto\"]){margin:var(--box-margin,var(--spacing-xl,2rem)) auto}:host([margin=\"auto xlarge\"]){margin:auto var(--box-margin,var(--spacing-xl,2rem))}:host([padding=xlarge]){padding:var(--box-padding,var(--spacing-xl,2rem))}:host([font=xsmall]),:host([size=xsmall]){font-size:var(--box-font-size,var(--font-size-xs,.625rem))}:host([font=small]),:host([size=small]){font-size:var(--box-font-size,var(--font-size-s,.875rem))}:host([font=medium]),:host([size=medium]){font-size:var(--box-font-size,var(--font-size-m,1rem))}:host([font=large]),:host([size=large]){font-size:var(--box-font-size,var(--font-size-l,1.25rem))}:host([font=xlarge]),:host([size=xlarge]){font-size:var(--box-font-size,var(--font-size-xl,1.5rem))}:host([font=xxlarge]),:host([size=xxlarge]){font-size:var(--box-font-size,var(--font-size-xxl,2.25rem))}:host([justify=start]){justify-content:flex-start}:host([justify=end]){justify-content:flex-end}:host([justify=stretch]){justify-content:stretch}:host([justify=baseline]){justify-content:baseline}:host([justify=center]){justify-content:center}:host([justify=around]){justify-content:space-around}:host([justify=between]){justify-content:space-between}:host([overflow=auto]){overflow:auto}:host([overflow=hidden]){overflow:hidden}:host([overflow=scroll]){overflow:scroll}:host([overflow=visible]){overflow:visible}:host([radius=none]){border-radius:var(--box-border-radius,0)}:host([radius=small]){border-radius:var(--box-border-radius,var(--border-radius-small,.125rem))}:host([radius=medium]){border-radius:var(--box-border-radius,var(--border-radius-medium,.25rem))}:host([radius=large]){border-radius:var(--box-border-radius,var(--border-radius-large,.5rem))}:host([radius=xlarge]){border-radius:var(--box-border-radius,var(--border-radius-x-large,1rem))}:host([radius=circle]){border-radius:var(--box-border-radius,var(--border-radius-circle,50%))}:host([radius=pill]){border-radius:var(--box-border-radius,var(--border-radius-pill,9999px))}:host([max-width=xxsmall]){max-width:var(--box-max-width,var(--size-xxs,2rem))}:host([width=xxsmall]){width:var(--box-width,var(--size-xxs,2rem))}:host([max-height=xxsmall]){max-height:var(--box-max-height,var(--size-xxs,2rem))}:host([height=xxsmall]){height:var(--box-height,var(--size-xxs,2rem))}:host([max-width=xsmall]){max-width:var(--box-max-width,var(--size-xs,4rem))}:host([width=xsmall]){width:var(--box-width,var(--size-xs,4rem))}:host([max-height=xsmall]){max-height:var(--box-max-height,var(--size-xs,4rem))}:host([height=xsmall]){height:var(--box-height,var(--size-xs,4rem))}:host([max-width=small]){max-width:var(--box-max-width,var(--size-s,8rem))}:host([width=small]){width:var(--box-width,var(--size-s,8rem))}:host([max-height=small]){max-height:var(--box-max-height,var(--size-s,8rem))}:host([height=small]){height:var(--box-height,var(--size-s,8rem))}:host([max-width=medium]){max-width:var(--box-max-width,var(--size-m,16rem))}:host([width=medium]){width:var(--box-width,var(--size-m,16rem))}:host([max-height=medium]){max-height:var(--box-max-height,var(--size-m,16rem))}:host([height=medium]){height:var(--box-height,var(--size-m,16rem))}:host([max-width=large]){max-width:var(--box-max-width,var(--size-l,32rem))}:host([width=large]){width:var(--box-width,var(--size-l,32rem))}:host([max-height=large]){max-height:var(--box-max-height,var(--size-l,32rem))}:host([height=large]){height:var(--box-height,var(--size-l,32rem))}:host([max-width=xlarge]){max-width:var(--box-max-width,var(--size-xl,48rem))}:host([width=xlarge]){width:var(--box-width,var(--size-xl,48rem))}:host([max-height=xlarge]){max-height:var(--box-max-height,var(--size-xl,48rem))}:host([height=xlarge]){height:var(--box-height,var(--size-xl,48rem))}:host([max-width=xxlarge]){max-width:var(--box-max-width,var(--size-xxl,64rem))}:host([width=xxlarge]){width:var(--box-width,var(--size-xxl,64rem))}:host([max-height=xxlarge]){max-height:var(--box-max-height,var(--size-xxl,64rem))}:host([height=xxlarge]){height:var(--box-height,var(--size-xxl,64rem))}:host([wrap=true]){flex-wrap:wrap}:host([wrap=reverse]){flex-wrap:wrap-reverse}";
+var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{box-sizing:border-box;display:flex;flex-direction:column;position:relative;transition:background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease)}:host([hidden]){display:none}.ripple{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.ripple span{background-color:currentColor;border-radius:50%;opacity:.5;position:absolute}:host([align-content=start]){align-content:flex-start}:host([align-content=end]){align-content:flex-end}:host([align-content=stretch]){align-content:stretch}:host([align-content=center]){align-content:center}:host([align-content=around]){align-content:space-around}:host([align-content=between]){align-content:space-between}:host([align-items=start]){align-items:flex-start}:host([align-items=end]){align-items:flex-end}:host([align-items=stretch]){align-items:stretch}:host([align-items=center]){align-items:center}:host([align-items=baseline]){align-items:baseline}:host([align-self=start]){align-self:flex-start}:host([align-self=end]){align-self:flex-end}:host([align-self=stretch]){align-self:stretch}:host([align-self=center]){align-self:center}:host([background=primary-lighter]){background-color:var(--primary-lighter)}:host([color=primary-lighter]){color:var(--primary-lighter)}:host([background=primary-light]){background-color:var(--primary-light)}:host([color=primary-light]){color:var(--primary-light)}:host([background=primary]){background-color:var(--primary)}:host([color=primary]){color:var(--primary)}:host([background=primary-dark]){background-color:var(--primary-dark)}:host([color=primary-dark]){color:var(--primary-dark)}:host([background=primary-darker]){background-color:var(--primary-darker)}:host([color=primary-darker]){color:var(--primary-darker)}:host([background=on-primary-lighter]){background-color:var(--on-primary-lighter)}:host([color=on-primary-lighter]){color:var(--on-primary-lighter)}:host([background=on-primary-light]){background-color:var(--on-primary-light)}:host([color=on-primary-light]){color:var(--on-primary-light)}:host([background=on-primary]){background-color:var(--on-primary)}:host([color=on-primary]){color:var(--on-primary)}:host([background=on-primary-dark]){background-color:var(--on-primary-dark)}:host([color=on-primary-dark]){color:var(--on-primary-dark)}:host([background=on-primary-darker]){background-color:var(--on-primary-darker)}:host([color=on-primary-darker]){color:var(--on-primary-darker)}:host([background=accent-lighter]){background-color:var(--accent-lighter)}:host([color=accent-lighter]){color:var(--accent-lighter)}:host([background=accent-light]){background-color:var(--accent-light)}:host([color=accent-light]){color:var(--accent-light)}:host([background=accent]){background-color:var(--accent)}:host([color=accent]){color:var(--accent)}:host([background=accent-dark]){background-color:var(--accent-dark)}:host([color=accent-dark]){color:var(--accent-dark)}:host([background=accent-darker]){background-color:var(--accent-darker)}:host([color=accent-darker]){color:var(--accent-darker)}:host([background=on-accent-lighter]){background-color:var(--on-accent-lighter)}:host([color=on-accent-lighter]){color:var(--on-accent-lighter)}:host([background=on-accent-light]){background-color:var(--on-accent-light)}:host([color=on-accent-light]){color:var(--on-accent-light)}:host([background=on-accent]){background-color:var(--on-accent)}:host([color=on-accent]){color:var(--on-accent)}:host([background=on-accent-dark]){background-color:var(--on-accent-dark)}:host([color=on-accent-dark]){color:var(--on-accent-dark)}:host([background=on-accent-darker]){background-color:var(--on-accent-darker)}:host([color=on-accent-darker]){color:var(--on-accent-darker)}:host([background=error-lighter]){background-color:var(--error-lighter)}:host([color=error-lighter]){color:var(--error-lighter)}:host([background=error-light]){background-color:var(--error-light)}:host([color=error-light]){color:var(--error-light)}:host([background=error]){background-color:var(--error)}:host([color=error]){color:var(--error)}:host([background=error-dark]){background-color:var(--error-dark)}:host([color=error-dark]){color:var(--error-dark)}:host([background=error-darker]){background-color:var(--error-darker)}:host([color=error-darker]){color:var(--error-darker)}:host([background=on-error-lighter]){background-color:var(--on-error-lighter)}:host([color=on-error-lighter]){color:var(--on-error-lighter)}:host([background=on-error-light]){background-color:var(--on-error-light)}:host([color=on-error-light]){color:var(--on-error-light)}:host([background=on-error]){background-color:var(--on-error)}:host([color=on-error]){color:var(--on-error)}:host([background=on-error-dark]){background-color:var(--on-error-dark)}:host([color=on-error-dark]){color:var(--on-error-dark)}:host([background=on-error-darker]){background-color:var(--on-error-darker)}:host([color=on-error-darker]){color:var(--on-error-darker)}:host([background=shade-lighter]){background-color:var(--shade-lighter)}:host([color=shade-lighter]){color:var(--shade-lighter)}:host([background=shade-light]){background-color:var(--shade-light)}:host([color=shade-light]){color:var(--shade-light)}:host([background=shade]){background-color:var(--shade)}:host([color=shade]){color:var(--shade)}:host([background=shade-dark]){background-color:var(--shade-dark)}:host([color=shade-dark]){color:var(--shade-dark)}:host([background=shade-darker]){background-color:var(--shade-darker)}:host([color=shade-darker]){color:var(--shade-darker)}:host([background=on-shade-lighter]){background-color:var(--on-shade-lighter)}:host([color=on-shade-lighter]){color:var(--on-shade-lighter)}:host([background=on-shade-light]){background-color:var(--on-shade-light)}:host([color=on-shade-light]){color:var(--on-shade-light)}:host([background=on-shade]){background-color:var(--on-shade)}:host([color=on-shade]){color:var(--on-shade)}:host([background=on-shade-dark]){background-color:var(--on-shade-dark)}:host([color=on-shade-dark]){color:var(--on-shade-dark)}:host([background=on-shade-darker]){background-color:var(--on-shade-darker)}:host([color=on-shade-darker]){color:var(--on-shade-darker)}:host([background=foreground]){background-color:var(--foreground)}:host([color=foreground]){color:var(--foreground)}:host([background=background]){background-color:var(--background)}:host([color=background]){color:var(--background)}:host([direction=column]){flex-direction:column}:host([direction=row-reverse]){flex-direction:row-reverse}:host([direction=column-reverse]){flex-direction:column-reverse}:host([text=center]){text-align:center}:host([text=justify]){text-align:justify}:host([text=left]){text-align:left}:host([text=right]){text-align:right}:host([weight=\"100\"]){font-weight:100}:host([weight=\"200\"]){font-weight:200}:host([weight=\"300\"]){font-weight:300}:host([weight=\"400\"]){font-weight:400}:host([weight=\"500\"]){font-weight:500}:host([weight=\"600\"]){font-weight:600}:host([weight=\"700\"]){font-weight:700}:host([weight=\"800\"]){font-weight:800}:host([weight=\"900\"]){font-weight:900}:host([weight=lighter]){font-weight:lighter}:host([weight=bold]){font-weight:700}:host([weight=bolder]){font-weight:bolder}:host([direction=row]){flex-direction:row}:host([direction=row-reverse]){flex-direction:row}:host([elevation=xsmall]){box-shadow:var(--box-elevation,var(--elevation-1,0 1px 2px var(--shadow)))}:host([elevation=small]){box-shadow:var(--box-elevation,var(--elevation-2,0 2px 4px var(--shadow)))}:host([elevation=medium]){box-shadow:var(--box-elevation,var(--elevation-3,0 4px 8px var(--shadow)))}:host([elevation=large]){box-shadow:var(--box-elevation,var(--elevation-4,0 8px 16px var(--shadow)))}:host([elevation=xlarge]){box-shadow:var(--box-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}:host([fill=horizontal]){width:100%}:host([fill=vertical]){height:100%}:host([fill=true]){height:100%;width:100%}:host([flex=grow]){flex:1 0}:host([flex=shrink]){flex:0 1}:host([flex=true]){flex:1 1}:host([flex=false]){flex:0 0}:host([gap=xsmall]) ::slotted(*),:host([gap=xsmall][direction=column]) ::slotted(*){margin:var(--spacing-xs,.25rem) 0}:host([gap=xsmall][direction=row]) ::slotted(*){margin:0 var(--spacing-xs,.25rem)}:host([margin=xsmall]){margin:var(--box-margin,var(--spacing-xs,.25rem))}:host([margin=\"xsmall auto\"]){margin:var(--box-margin,var(--spacing-xs,.25rem)) auto}:host([margin=\"auto xsmall\"]){margin:auto var(--box-margin,var(--spacing-xs,.25rem))}:host([padding=xsmall]){padding:var(--box-padding,var(--spacing-xs,.25rem))}:host([gap=small]) ::slotted(*),:host([gap=small][direction=column]) ::slotted(*){margin:var(--spacing-s,.5rem) 0}:host([gap=small][direction=row]) ::slotted(*){margin:0 var(--spacing-s,.5rem)}:host([margin=small]){margin:var(--box-margin,var(--spacing-s,.5rem))}:host([margin=\"small auto\"]){margin:var(--box-margin,var(--spacing-s,.5rem)) auto}:host([margin=\"auto small\"]){margin:auto var(--box-margin,var(--spacing-s,.5rem))}:host([padding=small]){padding:var(--box-padding,var(--spacing-s,.5rem))}:host([gap=medium]) ::slotted(*),:host([gap=medium][direction=column]) ::slotted(*){margin:var(--spacing-m,1rem) 0}:host([gap=medium][direction=row]) ::slotted(*){margin:0 var(--spacing-m,1rem)}:host([margin=medium]){margin:var(--box-margin,var(--spacing-m,1rem))}:host([margin=\"medium auto\"]){margin:var(--box-margin,var(--spacing-m,1rem)) auto}:host([margin=\"auto medium\"]){margin:auto var(--box-margin,var(--spacing-m,1rem))}:host([padding=medium]){padding:var(--box-padding,var(--spacing-m,1rem))}:host([gap=large]) ::slotted(*),:host([gap=large][direction=column]) ::slotted(*){margin:var(--spacing-l,1.25rem) 0}:host([gap=large][direction=row]) ::slotted(*){margin:0 var(--spacing-l,1.25rem)}:host([margin=large]){margin:var(--box-margin,var(--spacing-l,1.25rem))}:host([margin=\"large auto\"]){margin:var(--box-margin,var(--spacing-l,1.25rem)) auto}:host([margin=\"auto large\"]){margin:auto var(--box-margin,var(--spacing-l,1.25rem))}:host([padding=large]){padding:var(--box-padding,var(--spacing-l,1.25rem))}:host([gap=xlarge]) ::slotted(*),:host([gap=xlarge][direction=column]) ::slotted(*){margin:var(--spacing-xl,2rem) 0}:host([gap=xlarge][direction=row]) ::slotted(*){margin:0 var(--spacing-xl,2rem)}:host([margin=xlarge]){margin:var(--box-margin,var(--spacing-xl,2rem))}:host([margin=\"xlarge auto\"]){margin:var(--box-margin,var(--spacing-xl,2rem)) auto}:host([margin=\"auto xlarge\"]){margin:auto var(--box-margin,var(--spacing-xl,2rem))}:host([padding=xlarge]){padding:var(--box-padding,var(--spacing-xl,2rem))}:host([font=xsmall]),:host([size=xsmall]){font-size:var(--box-font-size,var(--font-size-xs,.625rem))}:host([font=small]),:host([size=small]){font-size:var(--box-font-size,var(--font-size-s,.875rem))}:host([font=medium]),:host([size=medium]){font-size:var(--box-font-size,var(--font-size-m,1rem))}:host([font=large]),:host([size=large]){font-size:var(--box-font-size,var(--font-size-l,1.25rem))}:host([font=xlarge]),:host([size=xlarge]){font-size:var(--box-font-size,var(--font-size-xl,1.5rem))}:host([font=xxlarge]),:host([size=xxlarge]){font-size:var(--box-font-size,var(--font-size-xxl,2.25rem))}:host([justify=start]){justify-content:flex-start}:host([justify=end]){justify-content:flex-end}:host([justify=stretch]){justify-content:stretch}:host([justify=baseline]){justify-content:baseline}:host([justify=center]){justify-content:center}:host([justify=around]){justify-content:space-around}:host([justify=between]){justify-content:space-between}:host([justify=evenly]){justify-content:space-evenly}:host([overflow=auto]){overflow:auto}:host([overflow=hidden]){overflow:hidden}:host([overflow=scroll]){overflow:scroll}:host([overflow=visible]){overflow:visible}:host([radius=none]){border-radius:var(--box-border-radius,0)}:host([radius=small]){border-radius:var(--box-border-radius,var(--border-radius-small,.125rem))}:host([radius=medium]){border-radius:var(--box-border-radius,var(--border-radius-medium,.25rem))}:host([radius=large]){border-radius:var(--box-border-radius,var(--border-radius-large,.5rem))}:host([radius=xlarge]){border-radius:var(--box-border-radius,var(--border-radius-x-large,1rem))}:host([radius=circle]){border-radius:var(--box-border-radius,var(--border-radius-circle,50%))}:host([radius=pill]){border-radius:var(--box-border-radius,var(--border-radius-pill,9999px))}:host([max-width=xxsmall]){max-width:var(--box-max-width,var(--size-xxs,2rem))}:host([width=xxsmall]){width:var(--box-width,var(--size-xxs,2rem))}:host([max-height=xxsmall]){max-height:var(--box-max-height,var(--size-xxs,2rem))}:host([height=xxsmall]){height:var(--box-height,var(--size-xxs,2rem))}:host([max-width=xsmall]){max-width:var(--box-max-width,var(--size-xs,4rem))}:host([width=xsmall]){width:var(--box-width,var(--size-xs,4rem))}:host([max-height=xsmall]){max-height:var(--box-max-height,var(--size-xs,4rem))}:host([height=xsmall]){height:var(--box-height,var(--size-xs,4rem))}:host([max-width=small]){max-width:var(--box-max-width,var(--size-s,8rem))}:host([width=small]){width:var(--box-width,var(--size-s,8rem))}:host([max-height=small]){max-height:var(--box-max-height,var(--size-s,8rem))}:host([height=small]){height:var(--box-height,var(--size-s,8rem))}:host([max-width=medium]){max-width:var(--box-max-width,var(--size-m,16rem))}:host([width=medium]){width:var(--box-width,var(--size-m,16rem))}:host([max-height=medium]){max-height:var(--box-max-height,var(--size-m,16rem))}:host([height=medium]){height:var(--box-height,var(--size-m,16rem))}:host([max-width=large]){max-width:var(--box-max-width,var(--size-l,32rem))}:host([width=large]){width:var(--box-width,var(--size-l,32rem))}:host([max-height=large]){max-height:var(--box-max-height,var(--size-l,32rem))}:host([height=large]){height:var(--box-height,var(--size-l,32rem))}:host([max-width=xlarge]){max-width:var(--box-max-width,var(--size-xl,48rem))}:host([width=xlarge]){width:var(--box-width,var(--size-xl,48rem))}:host([max-height=xlarge]){max-height:var(--box-max-height,var(--size-xl,48rem))}:host([height=xlarge]){height:var(--box-height,var(--size-xl,48rem))}:host([max-width=xxlarge]){max-width:var(--box-max-width,var(--size-xxl,64rem))}:host([width=xxlarge]){width:var(--box-width,var(--size-xxl,64rem))}:host([max-height=xxlarge]){max-height:var(--box-max-height,var(--size-xxl,64rem))}:host([height=xxlarge]){height:var(--box-height,var(--size-xxl,64rem))}:host([wrap=true]){flex-wrap:wrap}:host([wrap=reverse]){flex-wrap:wrap-reverse}";
+var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{box-sizing:border-box;display:flex;flex-direction:column;position:relative;transition:background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease)}:host([hidden]){display:none}.ripple{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.ripple span{background-color:currentColor;border-radius:50%;opacity:.5;position:absolute}:host([align-content=start]){align-content:flex-start}:host([align-content=end]){align-content:flex-end}:host([align-content=stretch]){align-content:stretch}:host([align-content=center]){align-content:center}:host([align-content=around]){align-content:space-around}:host([align-content=between]){align-content:space-between}:host([align-items=start]){align-items:flex-start}:host([align-items=end]){align-items:flex-end}:host([align-items=stretch]){align-items:stretch}:host([align-items=center]){align-items:center}:host([align-items=baseline]){align-items:baseline}:host([align-self=start]){align-self:flex-start}:host([align-self=end]){align-self:flex-end}:host([align-self=stretch]){align-self:stretch}:host([align-self=center]){align-self:center}:host([background=primary-lighter]){background-color:var(--primary-lighter)}:host([color=primary-lighter]){color:var(--primary-lighter)}:host([background=primary-light]){background-color:var(--primary-light)}:host([color=primary-light]){color:var(--primary-light)}:host([background=primary]){background-color:var(--primary)}:host([color=primary]){color:var(--primary)}:host([background=primary-dark]){background-color:var(--primary-dark)}:host([color=primary-dark]){color:var(--primary-dark)}:host([background=primary-darker]){background-color:var(--primary-darker)}:host([color=primary-darker]){color:var(--primary-darker)}:host([background=on-primary-lighter]){background-color:var(--on-primary-lighter)}:host([color=on-primary-lighter]){color:var(--on-primary-lighter)}:host([background=on-primary-light]){background-color:var(--on-primary-light)}:host([color=on-primary-light]){color:var(--on-primary-light)}:host([background=on-primary]){background-color:var(--on-primary)}:host([color=on-primary]){color:var(--on-primary)}:host([background=on-primary-dark]){background-color:var(--on-primary-dark)}:host([color=on-primary-dark]){color:var(--on-primary-dark)}:host([background=on-primary-darker]){background-color:var(--on-primary-darker)}:host([color=on-primary-darker]){color:var(--on-primary-darker)}:host([background=accent-lighter]){background-color:var(--accent-lighter)}:host([color=accent-lighter]){color:var(--accent-lighter)}:host([background=accent-light]){background-color:var(--accent-light)}:host([color=accent-light]){color:var(--accent-light)}:host([background=accent]){background-color:var(--accent)}:host([color=accent]){color:var(--accent)}:host([background=accent-dark]){background-color:var(--accent-dark)}:host([color=accent-dark]){color:var(--accent-dark)}:host([background=accent-darker]){background-color:var(--accent-darker)}:host([color=accent-darker]){color:var(--accent-darker)}:host([background=on-accent-lighter]){background-color:var(--on-accent-lighter)}:host([color=on-accent-lighter]){color:var(--on-accent-lighter)}:host([background=on-accent-light]){background-color:var(--on-accent-light)}:host([color=on-accent-light]){color:var(--on-accent-light)}:host([background=on-accent]){background-color:var(--on-accent)}:host([color=on-accent]){color:var(--on-accent)}:host([background=on-accent-dark]){background-color:var(--on-accent-dark)}:host([color=on-accent-dark]){color:var(--on-accent-dark)}:host([background=on-accent-darker]){background-color:var(--on-accent-darker)}:host([color=on-accent-darker]){color:var(--on-accent-darker)}:host([background=error-lighter]){background-color:var(--error-lighter)}:host([color=error-lighter]){color:var(--error-lighter)}:host([background=error-light]){background-color:var(--error-light)}:host([color=error-light]){color:var(--error-light)}:host([background=error]){background-color:var(--error)}:host([color=error]){color:var(--error)}:host([background=error-dark]){background-color:var(--error-dark)}:host([color=error-dark]){color:var(--error-dark)}:host([background=error-darker]){background-color:var(--error-darker)}:host([color=error-darker]){color:var(--error-darker)}:host([background=on-error-lighter]){background-color:var(--on-error-lighter)}:host([color=on-error-lighter]){color:var(--on-error-lighter)}:host([background=on-error-light]){background-color:var(--on-error-light)}:host([color=on-error-light]){color:var(--on-error-light)}:host([background=on-error]){background-color:var(--on-error)}:host([color=on-error]){color:var(--on-error)}:host([background=on-error-dark]){background-color:var(--on-error-dark)}:host([color=on-error-dark]){color:var(--on-error-dark)}:host([background=on-error-darker]){background-color:var(--on-error-darker)}:host([color=on-error-darker]){color:var(--on-error-darker)}:host([background=shade-lighter]){background-color:var(--shade-lighter)}:host([color=shade-lighter]){color:var(--shade-lighter)}:host([background=shade-light]){background-color:var(--shade-light)}:host([color=shade-light]){color:var(--shade-light)}:host([background=shade]){background-color:var(--shade)}:host([color=shade]){color:var(--shade)}:host([background=shade-dark]){background-color:var(--shade-dark)}:host([color=shade-dark]){color:var(--shade-dark)}:host([background=shade-darker]){background-color:var(--shade-darker)}:host([color=shade-darker]){color:var(--shade-darker)}:host([background=on-shade-lighter]){background-color:var(--on-shade-lighter)}:host([color=on-shade-lighter]){color:var(--on-shade-lighter)}:host([background=on-shade-light]){background-color:var(--on-shade-light)}:host([color=on-shade-light]){color:var(--on-shade-light)}:host([background=on-shade]){background-color:var(--on-shade)}:host([color=on-shade]){color:var(--on-shade)}:host([background=on-shade-dark]){background-color:var(--on-shade-dark)}:host([color=on-shade-dark]){color:var(--on-shade-dark)}:host([background=on-shade-darker]){background-color:var(--on-shade-darker)}:host([color=on-shade-darker]){color:var(--on-shade-darker)}:host([background=foreground]){background-color:var(--foreground)}:host([color=foreground]){color:var(--foreground)}:host([background=background]){background-color:var(--background)}:host([color=background]){color:var(--background)}:host([direction=column]){flex-direction:column}:host([direction=row-reverse]){flex-direction:row-reverse}:host([direction=column-reverse]){flex-direction:column-reverse}:host([text=center]){text-align:center}:host([text=justify]){text-align:justify}:host([text=left]){text-align:left}:host([text=right]){text-align:right}:host([weight=\"100\"]){font-weight:100}:host([weight=\"200\"]){font-weight:200}:host([weight=\"300\"]){font-weight:300}:host([weight=\"400\"]){font-weight:400}:host([weight=\"500\"]){font-weight:500}:host([weight=\"600\"]){font-weight:600}:host([weight=\"700\"]){font-weight:700}:host([weight=\"800\"]){font-weight:800}:host([weight=\"900\"]){font-weight:900}:host([weight=lighter]){font-weight:lighter}:host([weight=bold]){font-weight:700}:host([weight=bolder]){font-weight:bolder}:host([direction=row]){flex-direction:row}:host([direction=row-reverse]){flex-direction:row}:host([elevation=xsmall]){box-shadow:var(--box-elevation,var(--elevation-1,0 1px 2px var(--shadow)))}:host([elevation=small]){box-shadow:var(--box-elevation,var(--elevation-2,0 2px 4px var(--shadow)))}:host([elevation=medium]){box-shadow:var(--box-elevation,var(--elevation-3,0 4px 8px var(--shadow)))}:host([elevation=large]){box-shadow:var(--box-elevation,var(--elevation-4,0 8px 16px var(--shadow)))}:host([elevation=xlarge]){box-shadow:var(--box-elevation,var(--elevation-5,0 12px 24px var(--shadow)))}:host([fill=horizontal]){width:100%}:host([fill=vertical]){height:100%}:host([fill=true]){height:100%;width:100%}:host([flex=grow]){flex:1 0}:host([flex=shrink]){flex:0 1}:host([flex=true]){flex:1 1}:host([flex=false]){flex:0 0}:host([gap=xsmall]) ::slotted(*),:host([gap=xsmall][direction=column]) ::slotted(*){margin:var(--spacing-xs,.25rem) 0}:host([gap=xsmall][direction=row]) ::slotted(*){margin:0 var(--spacing-xs,.25rem)}:host([margin=xsmall]){margin:var(--box-margin,var(--spacing-xs,.25rem))}:host([margin=\"xsmall auto\"]){margin:var(--box-margin,var(--spacing-xs,.25rem)) auto}:host([margin=\"auto xsmall\"]){margin:auto var(--box-margin,var(--spacing-xs,.25rem))}:host([padding=xsmall]){padding:var(--box-padding,var(--spacing-xs,.25rem))}:host([gap=small]) ::slotted(*),:host([gap=small][direction=column]) ::slotted(*){margin:var(--spacing-s,.5rem) 0}:host([gap=small][direction=row]) ::slotted(*){margin:0 var(--spacing-s,.5rem)}:host([margin=small]){margin:var(--box-margin,var(--spacing-s,.5rem))}:host([margin=\"small auto\"]){margin:var(--box-margin,var(--spacing-s,.5rem)) auto}:host([margin=\"auto small\"]){margin:auto var(--box-margin,var(--spacing-s,.5rem))}:host([padding=small]){padding:var(--box-padding,var(--spacing-s,.5rem))}:host([gap=medium]) ::slotted(*),:host([gap=medium][direction=column]) ::slotted(*){margin:var(--spacing-m,1rem) 0}:host([gap=medium][direction=row]) ::slotted(*){margin:0 var(--spacing-m,1rem)}:host([margin=medium]){margin:var(--box-margin,var(--spacing-m,1rem))}:host([margin=\"medium auto\"]){margin:var(--box-margin,var(--spacing-m,1rem)) auto}:host([margin=\"auto medium\"]){margin:auto var(--box-margin,var(--spacing-m,1rem))}:host([padding=medium]){padding:var(--box-padding,var(--spacing-m,1rem))}:host([gap=large]) ::slotted(*),:host([gap=large][direction=column]) ::slotted(*){margin:var(--spacing-l,1.25rem) 0}:host([gap=large][direction=row]) ::slotted(*){margin:0 var(--spacing-l,1.25rem)}:host([margin=large]){margin:var(--box-margin,var(--spacing-l,1.25rem))}:host([margin=\"large auto\"]){margin:var(--box-margin,var(--spacing-l,1.25rem)) auto}:host([margin=\"auto large\"]){margin:auto var(--box-margin,var(--spacing-l,1.25rem))}:host([padding=large]){padding:var(--box-padding,var(--spacing-l,1.25rem))}:host([gap=xlarge]) ::slotted(*),:host([gap=xlarge][direction=column]) ::slotted(*){margin:var(--spacing-xl,2rem) 0}:host([gap=xlarge][direction=row]) ::slotted(*){margin:0 var(--spacing-xl,2rem)}:host([margin=xlarge]){margin:var(--box-margin,var(--spacing-xl,2rem))}:host([margin=\"xlarge auto\"]){margin:var(--box-margin,var(--spacing-xl,2rem)) auto}:host([margin=\"auto xlarge\"]){margin:auto var(--box-margin,var(--spacing-xl,2rem))}:host([padding=xlarge]){padding:var(--box-padding,var(--spacing-xl,2rem))}:host([font=xsmall]),:host([size=xsmall]){font-size:var(--box-font-size,var(--font-size-xs,.625rem))}:host([font=small]),:host([size=small]){font-size:var(--box-font-size,var(--font-size-s,.875rem))}:host([font=medium]),:host([size=medium]){font-size:var(--box-font-size,var(--font-size-m,1rem))}:host([font=large]),:host([size=large]){font-size:var(--box-font-size,var(--font-size-l,1.25rem))}:host([font=xlarge]),:host([size=xlarge]){font-size:var(--box-font-size,var(--font-size-xl,1.5rem))}:host([font=xxlarge]),:host([size=xxlarge]){font-size:var(--box-font-size,var(--font-size-xxl,2.25rem))}:host([justify=start]){justify-content:flex-start}:host([justify=end]){justify-content:flex-end}:host([justify=stretch]){justify-content:stretch}:host([justify=baseline]){justify-content:baseline}:host([justify=center]){justify-content:center}:host([justify=around]){justify-content:space-around}:host([justify=between]){justify-content:space-between}:host([justify=evenly]){justify-content:space-evenly}:host([overflow=auto]){overflow:auto}:host([overflow=hidden]){overflow:hidden}:host([overflow=scroll]){overflow:scroll}:host([overflow=visible]){overflow:visible}:host([radius=none]){border-radius:var(--box-border-radius,0)}:host([radius=small]){border-radius:var(--box-border-radius,var(--border-radius-small,.125rem))}:host([radius=medium]){border-radius:var(--box-border-radius,var(--border-radius-medium,.25rem))}:host([radius=large]){border-radius:var(--box-border-radius,var(--border-radius-large,.5rem))}:host([radius=xlarge]){border-radius:var(--box-border-radius,var(--border-radius-x-large,1rem))}:host([radius=circle]){border-radius:var(--box-border-radius,var(--border-radius-circle,50%))}:host([radius=pill]){border-radius:var(--box-border-radius,var(--border-radius-pill,9999px))}:host([max-width=xxsmall]){max-width:var(--box-max-width,var(--size-xxs,2rem))}:host([width=xxsmall]){width:var(--box-width,var(--size-xxs,2rem))}:host([max-height=xxsmall]){max-height:var(--box-max-height,var(--size-xxs,2rem))}:host([height=xxsmall]){height:var(--box-height,var(--size-xxs,2rem))}:host([max-width=xsmall]){max-width:var(--box-max-width,var(--size-xs,4rem))}:host([width=xsmall]){width:var(--box-width,var(--size-xs,4rem))}:host([max-height=xsmall]){max-height:var(--box-max-height,var(--size-xs,4rem))}:host([height=xsmall]){height:var(--box-height,var(--size-xs,4rem))}:host([max-width=small]){max-width:var(--box-max-width,var(--size-s,8rem))}:host([width=small]){width:var(--box-width,var(--size-s,8rem))}:host([max-height=small]){max-height:var(--box-max-height,var(--size-s,8rem))}:host([height=small]){height:var(--box-height,var(--size-s,8rem))}:host([max-width=medium]){max-width:var(--box-max-width,var(--size-m,16rem))}:host([width=medium]){width:var(--box-width,var(--size-m,16rem))}:host([max-height=medium]){max-height:var(--box-max-height,var(--size-m,16rem))}:host([height=medium]){height:var(--box-height,var(--size-m,16rem))}:host([max-width=large]){max-width:var(--box-max-width,var(--size-l,32rem))}:host([width=large]){width:var(--box-width,var(--size-l,32rem))}:host([max-height=large]){max-height:var(--box-max-height,var(--size-l,32rem))}:host([height=large]){height:var(--box-height,var(--size-l,32rem))}:host([max-width=xlarge]){max-width:var(--box-max-width,var(--size-xl,48rem))}:host([width=xlarge]){width:var(--box-width,var(--size-xl,48rem))}:host([max-height=xlarge]){max-height:var(--box-max-height,var(--size-xl,48rem))}:host([height=xlarge]){height:var(--box-height,var(--size-xl,48rem))}:host([max-width=xxlarge]){max-width:var(--box-max-width,var(--size-xxl,64rem))}:host([width=xxlarge]){width:var(--box-width,var(--size-xxl,64rem))}:host([max-height=xxlarge]){max-height:var(--box-max-height,var(--size-xxl,64rem))}:host([height=xxlarge]){height:var(--box-height,var(--size-xxl,64rem))}:host([wrap=true]){flex-wrap:wrap}:host([wrap=reverse]){flex-wrap:wrap-reverse}";
 
 export { css_248z as default, stylesheet };

package/drawer/drawer.scss.js

@@ -1,4 +1,4 @@
-var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width,256px)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
-var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:#00000080;bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width,256px)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
+var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:rgba(0,0,0,.502);bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width,256px)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
+var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}.drawer{background-color:var(--background,#f7f7f7);color:var(--foreground,#454545);display:flex;flex-direction:column;height:100%;overflow:scroll;position:absolute;top:0;touch-action:pan-y;transform:translateX(-100%);transition:transform cubic-bezier(.4,0,.2,1) var(--transition-duration-medium,.18s);width:var(--drawer-width,256px);will-change:transform;z-index:var(--drawer-z-index,200)}.drawer .drawer-content{flex:1;overflow:scroll}:host([right]) .drawer{right:0;transform:translateX(100%)}.overlay{background-color:rgba(0,0,0,.502);bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:var(--drawer-overlay-z-index,200)}.container{background-color:var(--background,#f7f7f7);height:100%;overflow:scroll;transition:padding cubic-bezier(.4,0,.2,1) var(--transition-duration-slow,.25s)}:host([open]) .drawer{transform:none}:host([open]) .container{padding-left:var(--drawer-width,256px)}:host([open][over]) .container{padding-left:0}:host([open][over]) .overlay{display:block}@media (max-width:var(--drawer-trigger-width,400px)){:host([open]) .container{padding-left:0}:host([open]) .overlay{display:block}}";
 
 export { css_248z as default, stylesheet };

package/form/form.d.ts

@@ -0,0 +1,14 @@
+import { LitElement } from "lit";
+declare class TkForm extends LitElement {
+    value: any;
+    protected createRenderRoot(): Element | ShadowRoot;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    submit(e: SubmitEvent): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "tk-form": TkForm;
+    }
+}
+export { TkForm };

package/form/form.js

@@ -0,0 +1,53 @@
+import { __decorate, __metadata } from 'tslib';
+import { LitElement } from 'lit';
+import { property, customElement } from 'lit/decorators.js';
+
+let TkForm = class TkForm extends LitElement {
+    createRenderRoot() {
+        return this;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener("submit", this.submit);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener("submit", this.submit);
+    }
+    submit(e) {
+        e.preventDefault();
+        const $form = this.querySelector("form");
+        const result = {};
+        const data = new FormData($form);
+        data.forEach((value, key) => {
+            const $inputElement = this.querySelector(`[name=${key}]`);
+            if ($inputElement.tagName == "TK-SLIDER") {
+                value = Number(value);
+            }
+            if ($inputElement.tagName == "TK-CHECKBOX" && (value == "on" || value == "true")) {
+                value = true;
+            }
+            if ($inputElement.tagName == "TK-RADIO" && (value == "on" || value == "true")) {
+                value = true;
+            }
+            if (key.indexOf("-") > 0) {
+                const _ks = key.split("-");
+                result[_ks[0]] = result[_ks[0]] ?? {};
+                result[_ks[0]][_ks[1]] = value;
+            }
+            else {
+                result[key] = value;
+            }
+        });
+        this.dispatchEvent(new CustomEvent("fulfill", { detail: result }));
+    }
+};
+__decorate([
+    property(),
+    __metadata("design:type", Object)
+], TkForm.prototype, "value", void 0);
+TkForm = __decorate([
+    customElement("tk-form")
+], TkForm);
+
+export { TkForm };

package/form/index.d.ts

@@ -0,0 +1 @@
+export { TkForm } from "./form";

package/form/index.js

@@ -0,0 +1 @@
+export { TkForm } from './form.js';

package/index.d.ts

@@ -5,6 +5,7 @@ export * from "./button/index";
 export * from "./checkbox/index";
 export * from "./dialog/index";
 export * from "./drawer/index";
+export * from "./form/index";
 export * from "./icon/index";
 export * from "./list-item/index";
 export * from "./loading/index";

package/index.js

@@ -5,6 +5,7 @@ import './button/index.js';
 import './checkbox/index.js';
 import './dialog/index.js';
 import './drawer/index.js';
+import './form/index.js';
 import './icon/index.js';
 import './list-item/index.js';
 import './loading/index.js';
@@ -28,6 +29,7 @@ export { TkButton } from './button/button.js';
 export { TkCheckbox } from './checkbox/checkbox.js';
 export { TkDialog } from './dialog/dialog.js';
 export { TkDrawer } from './drawer/drawer.js';
+export { TkForm } from './form/form.js';
 export { TkIcon } from './icon/icon.js';
 export { TkIcons } from './icon/icons.js';
 export { TkListItem } from './list-item/list-item.js';

package/notie/notie.scss.js

@@ -1,4 +1,4 @@
-var css_248z = ":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:#00000080;bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}";
-var stylesheet=":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:#00000080;bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}";
+var css_248z = ":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:rgba(0,0,0,.502);bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}";
+var stylesheet=":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:rgba(0,0,0,.502);bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}";
 
 export { css_248z as default, stylesheet };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tinkiet",
-  "version": "0.4.4",
+  "version": "0.4.10",
   "description": "Pragmatic UI Web Components",
   "main": "index.js",
   "module": "index.js",

package/slider/slider.js

@@ -33,7 +33,6 @@ let TkSlider = class TkSlider extends LitElement {
         this.setAttribute("dirty", "");
     }
     updated() {
-        console.log("slider updated", this.$slider.valueAsNumber);
         requestAnimationFrame(() => {
             this.style.setProperty("--_perc", ((Number(this.value) - this.min) / (this.max - this.min)).toString());
         });

package/slider/slider.scss.js

@@ -1,4 +1,4 @@
-var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host{--_perc:0;--_slider-track-bg:var(--slider-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-track-bg-active:var(--slider-bg-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_slider-thumb-bg:var(--slider-thumb-bg,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));--_slider-thumb-border:var(--slider-thumb-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([disabled]){--_slider-track-bg:var(--slider-bg-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_slider-track-bg-active:var(--slider-bg-active-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_slider-thumb-bg:var(--slider-thumb-bg-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-thumb-border:var(--slider-thumb-bg,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host([thumblabel-persist]) #container,:host([thumblabel]) #container{padding-top:33px}#container{border:none;overflow:visible}#slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--_slider-track-bg-active) 0,var(--_slider-track-bg-active) calc(var(--_perc)*100%),var(--_slider-track-bg) calc(var(--_perc)*100%),var(--_slider-track-bg));border:none;border-radius:0;box-sizing:border-box;cursor:grab;height:var(--slider-height,.3125rem);margin:0;outline:none;top:calc(var(--slider-height, .3125rem)*-1/2)}#slider,#thumb-container{position:relative;width:100%}#thumb-label{--_thumb-label-transform-y:0.625rem;-webkit-text-fill-color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));align-items:center;border-radius:var(--slider-thumb-label-border-radius,100%);bottom:calc(100% + var(--slider-thumb-size, .75rem) + var(--slider-height, .3125rem) + var(--slider-thumb-space, .75rem));color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));display:flex;font-size:var(--slider-thumb-label-font-size,.75rem);height:var(--slider-thumb-label-size,1.875rem);justify-content:center;left:calc(var(--_perc)*100% - var(--slider-thumb-size, 1.2rem)*var(--_perc));opacity:0;pointer-events:none;text-overflow:ellipsis;transform:translate(calc(-50% + var(--slider-thumb-size, 1.2rem)/2),var(--_thumb-label-transform-y));transition:var(--slider-thumb-label-transition,opacity var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-label-size,1.875rem)}#thumb-label,#thumb-label:before{background:var(--slider-thumb-label-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));position:absolute}#thumb-label:before{border-radius:0 50% 50% 50%;content:\"\";height:100%;left:0;top:0;transform:rotate(225deg);width:100%;z-index:-1}#slider:focus+#thumb-container #thumb-label,:host([thumblabel-persist]) #thumb-label,:host:focus #thumb-label{--_thumb-label-transform-y:0;opacity:1}#slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:4px solid var(--_slider-thumb-border);border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-webkit-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider::-moz-range-thumb{-moz-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:none;border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-moz-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}#slider:focus::-moz-range-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}";
-var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host{--_perc:0;--_slider-track-bg:var(--slider-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-track-bg-active:var(--slider-bg-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_slider-thumb-bg:var(--slider-thumb-bg,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));--_slider-thumb-border:var(--slider-thumb-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([disabled]){--_slider-track-bg:var(--slider-bg-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_slider-track-bg-active:var(--slider-bg-active-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_slider-thumb-bg:var(--slider-thumb-bg-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-thumb-border:var(--slider-thumb-bg,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host([thumblabel-persist]) #container,:host([thumblabel]) #container{padding-top:33px}#container{border:none;overflow:visible}#slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--_slider-track-bg-active) 0,var(--_slider-track-bg-active) calc(var(--_perc)*100%),var(--_slider-track-bg) calc(var(--_perc)*100%),var(--_slider-track-bg));border:none;border-radius:0;box-sizing:border-box;cursor:grab;height:var(--slider-height,.3125rem);margin:0;outline:none;top:calc(var(--slider-height, .3125rem)*-1/2)}#slider,#thumb-container{position:relative;width:100%}#thumb-label{--_thumb-label-transform-y:0.625rem;-webkit-text-fill-color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));align-items:center;border-radius:var(--slider-thumb-label-border-radius,100%);bottom:calc(100% + var(--slider-thumb-size, .75rem) + var(--slider-height, .3125rem) + var(--slider-thumb-space, .75rem));color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));display:flex;font-size:var(--slider-thumb-label-font-size,.75rem);height:var(--slider-thumb-label-size,1.875rem);justify-content:center;left:calc(var(--_perc)*100% - var(--slider-thumb-size, 1.2rem)*var(--_perc));opacity:0;pointer-events:none;text-overflow:ellipsis;transform:translate(calc(-50% + var(--slider-thumb-size, 1.2rem)/2),var(--_thumb-label-transform-y));transition:var(--slider-thumb-label-transition,opacity var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-label-size,1.875rem)}#thumb-label,#thumb-label:before{background:var(--slider-thumb-label-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));position:absolute}#thumb-label:before{border-radius:0 50% 50% 50%;content:\"\";height:100%;left:0;top:0;transform:rotate(225deg);width:100%;z-index:-1}#slider:focus+#thumb-container #thumb-label,:host([thumblabel-persist]) #thumb-label,:host:focus #thumb-label{--_thumb-label-transform-y:0;opacity:1}#slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:4px solid var(--_slider-thumb-border);border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-webkit-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider::-moz-range-thumb{-moz-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:none;border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,#00000015);cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-moz-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}#slider:focus::-moz-range-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,#00000015);transform:var(--slider-thumb-transform-focus,scale(1.2))}";
+var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host{--_perc:0;--_slider-track-bg:var(--slider-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-track-bg-active:var(--slider-bg-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_slider-thumb-bg:var(--slider-thumb-bg,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));--_slider-thumb-border:var(--slider-thumb-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([disabled]){--_slider-track-bg:var(--slider-bg-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_slider-track-bg-active:var(--slider-bg-active-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_slider-thumb-bg:var(--slider-thumb-bg-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-thumb-border:var(--slider-thumb-bg,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host([thumblabel-persist]) #container,:host([thumblabel]) #container{padding-top:33px}#container{border:none;overflow:visible}#slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--_slider-track-bg-active) 0,var(--_slider-track-bg-active) calc(var(--_perc)*100%),var(--_slider-track-bg) calc(var(--_perc)*100%),var(--_slider-track-bg));border:none;border-radius:0;box-sizing:border-box;cursor:grab;height:var(--slider-height,.3125rem);margin:0;outline:none;top:calc(var(--slider-height, .3125rem)*-1/2)}#slider,#thumb-container{position:relative;width:100%}#thumb-label{--_thumb-label-transform-y:0.625rem;-webkit-text-fill-color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));align-items:center;border-radius:var(--slider-thumb-label-border-radius,100%);bottom:calc(100% + var(--slider-thumb-size, .75rem) + var(--slider-height, .3125rem) + var(--slider-thumb-space, .75rem));color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));display:flex;font-size:var(--slider-thumb-label-font-size,.75rem);height:var(--slider-thumb-label-size,1.875rem);justify-content:center;left:calc(var(--_perc)*100% - var(--slider-thumb-size, 1.2rem)*var(--_perc));opacity:0;pointer-events:none;text-overflow:ellipsis;transform:translate(calc(-50% + var(--slider-thumb-size, 1.2rem)/2),var(--_thumb-label-transform-y));transition:var(--slider-thumb-label-transition,opacity var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-label-size,1.875rem)}#thumb-label,#thumb-label:before{background:var(--slider-thumb-label-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));position:absolute}#thumb-label:before{border-radius:0 50% 50% 50%;content:\"\";height:100%;left:0;top:0;transform:rotate(225deg);width:100%;z-index:-1}#slider:focus+#thumb-container #thumb-label,:host([thumblabel-persist]) #thumb-label,:host:focus #thumb-label{--_thumb-label-transform-y:0;opacity:1}#slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:4px solid var(--_slider-thumb-border);border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-webkit-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider::-moz-range-thumb{-moz-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:none;border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-moz-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));transform:var(--slider-thumb-transform-focus,scale(1.2))}#slider:focus::-moz-range-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));transform:var(--slider-thumb-transform-focus,scale(1.2))}";
+var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host{--_perc:0;--_slider-track-bg:var(--slider-bg,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-track-bg-active:var(--slider-bg-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));--_slider-thumb-bg:var(--slider-thumb-bg,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));--_slider-thumb-border:var(--slider-thumb-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([disabled]){--_slider-track-bg:var(--slider-bg-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_slider-track-bg-active:var(--slider-bg-active-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_slider-thumb-bg:var(--slider-thumb-bg-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_slider-thumb-border:var(--slider-thumb-bg,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host([thumblabel-persist]) #container,:host([thumblabel]) #container{padding-top:33px}#container{border:none;overflow:visible}#slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:linear-gradient(90deg,var(--_slider-track-bg-active) 0,var(--_slider-track-bg-active) calc(var(--_perc)*100%),var(--_slider-track-bg) calc(var(--_perc)*100%),var(--_slider-track-bg));border:none;border-radius:0;box-sizing:border-box;cursor:grab;height:var(--slider-height,.3125rem);margin:0;outline:none;top:calc(var(--slider-height, .3125rem)*-1/2)}#slider,#thumb-container{position:relative;width:100%}#thumb-label{--_thumb-label-transform-y:0.625rem;-webkit-text-fill-color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));align-items:center;border-radius:var(--slider-thumb-label-border-radius,100%);bottom:calc(100% + var(--slider-thumb-size, .75rem) + var(--slider-height, .3125rem) + var(--slider-thumb-space, .75rem));color:var(--slider-thumb-label-color,var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%))));display:flex;font-size:var(--slider-thumb-label-font-size,.75rem);height:var(--slider-thumb-label-size,1.875rem);justify-content:center;left:calc(var(--_perc)*100% - var(--slider-thumb-size, 1.2rem)*var(--_perc));opacity:0;pointer-events:none;text-overflow:ellipsis;transform:translate(calc(-50% + var(--slider-thumb-size, 1.2rem)/2),var(--_thumb-label-transform-y));transition:var(--slider-thumb-label-transition,opacity var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-label-size,1.875rem)}#thumb-label,#thumb-label:before{background:var(--slider-thumb-label-bg,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))));position:absolute}#thumb-label:before{border-radius:0 50% 50% 50%;content:\"\";height:100%;left:0;top:0;transform:rotate(225deg);width:100%;z-index:-1}#slider:focus+#thumb-container #thumb-label,:host([thumblabel-persist]) #thumb-label,:host:focus #thumb-label{--_thumb-label-transform-y:0;opacity:1}#slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:4px solid var(--_slider-thumb-border);border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-webkit-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider::-moz-range-thumb{-moz-appearance:none;appearance:none;background:var(--_slider-thumb-bg);border:none;border-radius:var(--slider-thumb-border-radius,100%);box-shadow:0 0 0 0 var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));cursor:grab;height:var(--slider-thumb-size,1.2rem);position:relative;-moz-transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));transition:var(--slider-thumb-transition,transform var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),box-shadow var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--slider-thumb-size,1.2rem)}#slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));transform:var(--slider-thumb-transform-focus,scale(1.2))}#slider:focus::-moz-range-thumb{box-shadow:0 0 0 var(--slider-thumb-focus-ring-size,.75rem) var(--slider-thumb-focus-ring-bg,rgba(0,0,0,.082));transform:var(--slider-thumb-transform-focus,scale(1.2))}";
 
 export { css_248z as default, stylesheet };

package/theme/theme.js

@@ -50,7 +50,6 @@ let TkTheme = class TkTheme extends LitElement {
     }
     setThemeFontSize(e) {
         const ev = e;
-        console.log("ev", ev);
         this.style.setProperty("--font-size", ev.detail);
     }
     turnThemeToInverted() {

package/umd/tinkiet.min.d.ts

@@ -56,7 +56,7 @@ type Color = typeof colors;
  * @attr {"horizontal" | "vertical" | "true" | "false"} fill - Whether the width and/or height should fill the container.
  * @attr {"grow" | "shrink" | "true" | "false"} flex - flex-grow and/or flex-shrink
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} gap - The amount of spacing between child elements. This should not be used in conjunction with 'wrap' as the gap elements will not wrap gracefully. If a child is a Fragment, Box will not add a gap between the children of the Fragment.
- * @attr {"around" | "between" | "center" | "end" | "start" | "stretch"} justify - How to align the contents along the main axis.
+ * @attr {"around" | "between" | "center" | "end" | "evenly" | "start" | "stretch"} justify - How to align the contents along the main axis.
  * @attr [justify="stretch"]
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} margin - The amount of margin around the component. An object can be specified to distinguish horizontal margin, vertical margin, and margin on a particular side.
  * @attr {"xsmall" | "small" | "medium" | "large" | "xlarge"} padding - The amount of padding around the box contents. An object can be specified to distinguish horizontal padding, vertical padding, and padding on a particular side of the box.
@@ -233,6 +233,18 @@ declare global {
         "tk-drawer": TkDrawer;
     }
 }
+declare class TkForm extends LitElement {
+    value: any;
+    protected createRenderRoot(): Element | ShadowRoot;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    submit(e: SubmitEvent): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "tk-form": TkForm;
+    }
+}
 declare class TkIcon extends TkBox {
     static get styles(): import("lit").CSSResult[];
     name: string;
@@ -610,4 +622,4 @@ declare global {
         "tk-theme": TkTheme;
     }
 }
-export { TkAccordion, TkBadge, TkBox, TkButton, TkCheckbox, TkDialog, TkDrawer, TkIcon, TkIcons, TkListItem, TkLoading, TkNavbar, TkNotie, TkPages, TkProgress, TkRadio, TkSelect, TkSlider, TkSwitch, TkTabGroup, TkTag, TkTextarea, TkTextfield, TkTheme };
+export { TkAccordion, TkBadge, TkBox, TkButton, TkCheckbox, TkDialog, TkDrawer, TkForm, TkIcon, TkIcons, TkListItem, TkLoading, TkNavbar, TkNotie, TkPages, TkProgress, TkRadio, TkSelect, TkSlider, TkSwitch, TkTabGroup, TkTag, TkTextarea, TkTextfield, TkTheme };