@rovula/ui 0.1.3 → 0.1.5

package/dist/cjs/bundle.css

@@ -660,6 +660,9 @@ input[type=number] {
 .top-full{
   top: 100%;
 }
+.isolate{
+  isolation: isolate;
+}
 .-z-10{
   z-index: -10;
 }
@@ -835,6 +838,10 @@ input[type=number] {
   width: 18px;
   height: 18px;
 }
+.size-\[22px\]{
+  width: 22px;
+  height: 22px;
+}
 .size-\[30px\]{
   width: 30px;
   height: 30px;
@@ -1066,6 +1073,14 @@ input[type=number] {
 .border-collapse{
   border-collapse: collapse;
 }
+.-translate-x-1\/2{
+  --tw-translate-x: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.-translate-y-1\/2{
+  --tw-translate-y: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .translate-x-\[-50\%\]{
   --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1149,6 +1164,9 @@ input[type=number] {
 .grid-cols-\[160px_16px\]{
   grid-template-columns: 160px 16px;
 }
+.grid-cols-\[1fr_40px\]{
+  grid-template-columns: 1fr 40px;
+}
 .grid-cols-\[repeat\(3\2c minmax\(0\2c 1fr\)\)\]{
   grid-template-columns: repeat(3,minmax(0,1fr));
 }
@@ -1277,6 +1295,9 @@ input[type=number] {
 .overflow-hidden{
   overflow: hidden;
 }
+.overflow-visible{
+  overflow: visible;
+}
 .overflow-x-auto{
   overflow-x: auto;
 }
@@ -1641,6 +1662,10 @@ input[type=number] {
   --tw-border-opacity: 1;
   border-left-color: color-mix(in srgb, var(--input-color-error) calc(100% * var(--tw-border-opacity, 1)), transparent);
 }
+.border-l-warning-stroke{
+  --tw-border-opacity: 1;
+  border-left-color: color-mix(in srgb, var(--state-color-warning-stroke) calc(100% * var(--tw-border-opacity, 1)), transparent);
+}
 .border-r-input-default-stroke{
   --tw-border-opacity: 1;
   border-right-color: color-mix(in srgb, var(--input-color-default-stroke) calc(100% * var(--tw-border-opacity, 1)), transparent);
@@ -1649,6 +1674,10 @@ input[type=number] {
   --tw-border-opacity: 1;
   border-right-color: color-mix(in srgb, var(--input-color-error) calc(100% * var(--tw-border-opacity, 1)), transparent);
 }
+.border-r-warning-stroke{
+  --tw-border-opacity: 1;
+  border-right-color: color-mix(in srgb, var(--state-color-warning-stroke) calc(100% * var(--tw-border-opacity, 1)), transparent);
+}
 .border-t-\[var\(--footer-border-color\)\]{
   border-top-color: var(--footer-border-color);
 }
@@ -3079,12 +3108,6 @@ input[type=number] {
 .stroke-input-disable-stroke{
   stroke: color-mix(in srgb, var(--input-color-disable-stroke) calc(100% * 1), transparent);
 }
-.stroke-input-error{
-  stroke: color-mix(in srgb, var(--input-color-error) calc(100% * 1), transparent);
-}
-.stroke-input-filled-text{
-  stroke: color-mix(in srgb, var(--input-color-filled-text) calc(100% * 1), transparent);
-}
 .stroke-primary-default{
   stroke: color-mix(in srgb, var(--state-color-primary-default) calc(100% * 1), transparent);
 }
@@ -3115,6 +3138,10 @@ input[type=number] {
 .p-8{
   padding: 2rem;
 }
+.px-1{
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
 .px-2{
   padding-left: 0.5rem;
   padding-right: 0.5rem;
@@ -3810,6 +3837,9 @@ input[type=number] {
 .caret-primary{
   caret-color: color-mix(in srgb, var(--state-color-primary-default) calc(100% * 1), transparent);
 }
+.opacity-0{
+  opacity: 0;
+}
 .opacity-50{
   opacity: 0.5;
 }
@@ -3824,6 +3854,11 @@ input[type=number] {
   --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
+.shadow-\[0px_8px_16px_0px_rgba\(0\2c 0\2c 0\2c 0\.12\)\]{
+  --tw-shadow: 0px 8px 16px 0px rgba(0,0,0,0.12);
+  --tw-shadow-colored: 0px 8px 16px 0px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
 .shadow-lg{
   --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
@@ -3889,6 +3924,10 @@ input[type=number] {
   --tw-ring-opacity: 1;
   --tw-ring-color: color-mix(in srgb, var(--input-color-error) calc(100% * var(--tw-ring-opacity, 1)), transparent);
 }
+.ring-warning-stroke{
+  --tw-ring-opacity: 1;
+  --tw-ring-color: color-mix(in srgb, var(--state-color-warning-stroke) calc(100% * var(--tw-ring-opacity, 1)), transparent);
+}
 .ring-offset-background{
   --tw-ring-offset-color: color-mix(in srgb, var(--background) calc(100% * 1), transparent);
 }
@@ -3910,6 +3949,11 @@ input[type=number] {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
+.transition-\[transform\2c background-color\2c color\2c filter\]{
+  transition-property: transform,background-color,color,filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
 .transition-all{
   transition-property: all;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -3930,11 +3974,6 @@ input[type=number] {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
-.transition-transform{
-  transition-property: transform;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
 .delay-150{
   transition-delay: 150ms;
 }
@@ -4113,6 +4152,9 @@ input[type=number] {
     display: none;
     /* background: transparent; */
   }
+.\[filter\:var\(--switch-thumb-filter\)\]{
+  filter: var(--switch-thumb-filter);
+}
 .placeholder\:text-input-default-text::-moz-placeholder{
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--input-color-default-text) calc(100% * var(--tw-text-opacity, 1)), transparent);
@@ -4147,10 +4189,35 @@ input[type=number] {
   content: var(--tw-content);
   inset: 0px;
 }
+.before\:left-1::before{
+  content: var(--tw-content);
+  left: 0.25rem;
+}
+.before\:top-1\/2::before{
+  content: var(--tw-content);
+  top: 50%;
+}
+.before\:h-3::before{
+  content: var(--tw-content);
+  height: 0.75rem;
+}
+.before\:w-8::before{
+  content: var(--tw-content);
+  width: 2rem;
+}
+.before\:-translate-y-1\/2::before{
+  content: var(--tw-content);
+  --tw-translate-y: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .before\:rounded-\[inherit\]::before{
   content: var(--tw-content);
   border-radius: inherit;
 }
+.before\:rounded-full::before{
+  content: var(--tw-content);
+  border-radius: 9999px;
+}
 .before\:border::before{
   content: var(--tw-content);
   border-width: 1px;
@@ -4163,6 +4230,12 @@ input[type=number] {
   content: var(--tw-content);
   border-color: inherit;
 }
+.before\:transition-colors::before{
+  content: var(--tw-content);
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
 .before\:content-\[\'\'\]::before{
   --tw-content: '';
   content: var(--tw-content);
@@ -4275,6 +4348,14 @@ input[type=number] {
   --tw-border-opacity: 1;
   border-color: color-mix(in srgb, var(--input-color-active-stroke) calc(100% * var(--tw-border-opacity, 1)), transparent);
 }
+.hover\:border-l-input-active-stroke:hover{
+  --tw-border-opacity: 1;
+  border-left-color: color-mix(in srgb, var(--input-color-active-stroke) calc(100% * var(--tw-border-opacity, 1)), transparent);
+}
+.hover\:border-r-input-active-stroke:hover{
+  --tw-border-opacity: 1;
+  border-right-color: color-mix(in srgb, var(--input-color-active-stroke) calc(100% * var(--tw-border-opacity, 1)), transparent);
+}
 .hover\:bg-\[var\(--dropdown-menu-hover-bg\)\]:hover{
   background-color: var(--dropdown-menu-hover-bg);
 }
@@ -4493,8 +4574,8 @@ input[type=number] {
 .hover\:fill-input-default-text:hover{
   fill: color-mix(in srgb, var(--input-color-default-text) calc(100% * 1), transparent);
 }
-.hover\:stroke-input-active-stroke:hover{
-  stroke: color-mix(in srgb, var(--input-color-active-stroke) calc(100% * 1), transparent);
+.hover\:fill-input-filled-text:hover{
+  fill: color-mix(in srgb, var(--input-color-filled-text) calc(100% * 1), transparent);
 }
 .hover\:stroke-input-filled-text:hover{
   stroke: color-mix(in srgb, var(--input-color-filled-text) calc(100% * 1), transparent);
@@ -4643,6 +4724,10 @@ input[type=number] {
   --tw-ring-opacity: 1;
   --tw-ring-color: color-mix(in srgb, var(--input-color-error) calc(100% * var(--tw-ring-opacity, 1)), transparent);
 }
+.hover\:ring-warning-stroke:hover{
+  --tw-ring-opacity: 1;
+  --tw-ring-color: color-mix(in srgb, var(--state-color-warning-stroke) calc(100% * var(--tw-ring-opacity, 1)), transparent);
+}
 .hover\:placeholder\:text-input-disable-text:hover::-moz-placeholder{
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--input-color-disable-text) calc(100% * var(--tw-text-opacity, 1)), transparent);
@@ -4703,6 +4788,10 @@ input[type=number] {
   --tw-ring-opacity: 1;
   --tw-ring-color: color-mix(in srgb, var(--input-color-error) calc(100% * var(--tw-ring-opacity, 1)), transparent);
 }
+.focus\:ring-warning-stroke:focus{
+  --tw-ring-opacity: 1;
+  --tw-ring-color: color-mix(in srgb, var(--state-color-warning-stroke) calc(100% * var(--tw-ring-opacity, 1)), transparent);
+}
 .focus\:ring-offset-2:focus{
   --tw-ring-offset-width: 2px;
 }
@@ -5502,12 +5591,7 @@ input[type=number] {
 .disabled\:opacity-50:disabled{
   opacity: 0.5;
 }
-.group:hover .group-hover\:ring{
-  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
-  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
-  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
-}
-.group:disabled .group-disabled\:\!bg-\[--switch-thumb-disabled-color\]{
+.group:disabled .group-disabled\:\!bg-\[var\(--switch-thumb-disabled-color\)\]{
   background-color: var(--switch-thumb-disabled-color) !important;
 }
 .peer:-moz-placeholder-shown ~ .peer-placeholder-shown\:top-2{
@@ -5669,8 +5753,8 @@ input[type=number] {
   --tw-translate-x: 1rem;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
-.data-\[state\=unchecked\]\:-translate-x-\[2px\][data-state="unchecked"]{
-  --tw-translate-x: -2px;
+.data-\[state\=unchecked\]\:translate-x-0[data-state="unchecked"]{
+  --tw-translate-x: 0px;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 .data-\[swipe\=cancel\]\:translate-x-0[data-swipe="cancel"]{
@@ -5790,9 +5874,6 @@ input[type=number] {
 .data-\[disabled\]\:\!bg-\[var\(--dropdown-menu-disabled-bg\)\][data-disabled]{
   background-color: var(--dropdown-menu-disabled-bg) !important;
 }
-.data-\[disabled\]\:\!bg-\[var\(--switch-disabled-color\)\][data-disabled]{
-  background-color: var(--switch-disabled-color) !important;
-}
 .data-\[loading\=true\]\:bg-button-error-flat-active[data-loading="true"]{
   --tw-bg-opacity: 1;
   background-color: color-mix(in srgb, var(--button-error-flat-active-bg) calc(100% * var(--tw-bg-opacity, 1)), transparent);
@@ -5880,12 +5961,12 @@ input[type=number] {
 .data-\[state\=\'checked\'\]\:bg-\[var\(--dropdown-menu-selected-bg\)\][data-state='checked']{
   background-color: var(--dropdown-menu-selected-bg);
 }
-.data-\[state\=checked\]\:bg-\[var\(--switch-active-color\)\][data-state="checked"]{
-  background-color: var(--switch-active-color);
-}
 .data-\[state\=checked\]\:bg-\[var\(--switch-thumb-active-color\)\][data-state="checked"]{
   background-color: var(--switch-thumb-active-color);
 }
+.data-\[state\=checked\]\:bg-\[var\(--switch-thumb-active-hover-color\)\][data-state="checked"]{
+  background-color: var(--switch-thumb-active-hover-color);
+}
 .data-\[state\=checked\]\:bg-function-active-solid[data-state="checked"]{
   --tw-bg-opacity: 1;
   background-color: color-mix(in srgb, var(--function-active-solid) calc(100% * var(--tw-bg-opacity, 1)), transparent);
@@ -5902,12 +5983,12 @@ input[type=number] {
   --tw-bg-opacity: 1;
   background-color: color-mix(in srgb, var(--grey-grey-20) calc(100% * var(--tw-bg-opacity, 1)), transparent);
 }
-.data-\[state\=unchecked\]\:bg-\[var\(--switch-default-color\)\][data-state="unchecked"]{
-  background-color: var(--switch-default-color);
-}
 .data-\[state\=unchecked\]\:bg-\[var\(--switch-thumb-default-color\)\][data-state="unchecked"]{
   background-color: var(--switch-thumb-default-color);
 }
+.data-\[state\=unchecked\]\:bg-\[var\(--switch-thumb-hover-color\)\][data-state="unchecked"]{
+  background-color: var(--switch-thumb-hover-color);
+}
 .data-\[disabled\]\:\!fill-state-disable-solid[data-disabled]{
   fill: color-mix(in srgb, var(--state-color-disable-solid) calc(100% * 1), transparent) !important;
 }
@@ -6068,6 +6149,9 @@ input[type=number] {
 .data-\[state\=\'checked\'\]\:text-\[var\(--dropdown-menu-selected-text\)\][data-state='checked']{
   color: var(--dropdown-menu-selected-text);
 }
+.data-\[state\=checked\]\:text-\[var\(--state-color-primary-hover-bg\)\][data-state="checked"]{
+  color: var(--state-color-primary-hover-bg);
+}
 .data-\[state\=checked\]\:text-function-active-icon[data-state="checked"]{
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--function-active-icon) calc(100% * var(--tw-text-opacity, 1)), transparent);
@@ -6084,6 +6168,9 @@ input[type=number] {
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--primary-foreground) calc(100% * var(--tw-text-opacity, 1)), transparent);
 }
+.data-\[state\=unchecked\]\:text-\[var\(--state-color-tertiary-hover-bg\)\][data-state="unchecked"]{
+  color: var(--state-color-tertiary-hover-bg);
+}
 .data-\[swipe\=move\]\:transition-none[data-swipe="move"]{
   transition-property: none;
 }
@@ -6092,6 +6179,26 @@ input[type=number] {
   line-height: var(--subtitle5-line-height, 22px);
   font-weight: var(--subtitle5-weight, 500);
 }
+.data-\[disabled\]\:before\:\!bg-\[var\(--switch-disabled-color\)\][data-disabled]::before{
+  content: var(--tw-content);
+  background-color: var(--switch-disabled-color) !important;
+}
+.data-\[state\=checked\]\:before\:bg-\[var\(--switch-active-color\)\][data-state="checked"]::before{
+  content: var(--tw-content);
+  background-color: var(--switch-active-color);
+}
+.data-\[state\=checked\]\:before\:bg-\[var\(--switch-active-hover-color\)\][data-state="checked"]::before{
+  content: var(--tw-content);
+  background-color: var(--switch-active-hover-color);
+}
+.data-\[state\=unchecked\]\:before\:bg-\[var\(--switch-default-color\)\][data-state="unchecked"]::before{
+  content: var(--tw-content);
+  background-color: var(--switch-default-color);
+}
+.data-\[state\=unchecked\]\:before\:bg-\[var\(--switch-hover-color\)\][data-state="unchecked"]::before{
+  content: var(--tw-content);
+  background-color: var(--switch-hover-color);
+}
 .hover\:data-\[state\=checked\]\:border-function-active-hover[data-state="checked"]:hover{
   --tw-border-opacity: 1;
   border-color: color-mix(in srgb, var(--function-active-hover) calc(100% * var(--tw-border-opacity, 1)), transparent);
@@ -6100,9 +6207,6 @@ input[type=number] {
   --tw-border-opacity: 1;
   border-color: color-mix(in srgb, var(--function-active-hover) calc(100% * var(--tw-border-opacity, 1)), transparent);
 }
-.hover\:data-\[state\=checked\]\:bg-\[var\(--switch-active-hover-color\)\][data-state="checked"]:hover{
-  background-color: var(--switch-active-hover-color);
-}
 .hover\:data-\[state\=checked\]\:bg-function-active-hover[data-state="checked"]:hover{
   --tw-bg-opacity: 1;
   background-color: color-mix(in srgb, var(--function-active-hover) calc(100% * var(--tw-bg-opacity, 1)), transparent);
@@ -6111,13 +6215,18 @@ input[type=number] {
   --tw-bg-opacity: 1;
   background-color: color-mix(in srgb, var(--function-active-hover) calc(100% * var(--tw-bg-opacity, 1)), transparent);
 }
-.hover\:data-\[state\=unchecked\]\:bg-\[var\(--switch-hover-color\)\][data-state="unchecked"]:hover{
-  background-color: var(--switch-hover-color);
-}
 .hover\:data-\[state\=checked\]\:text-function-active-hover[data-state="checked"]:hover{
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--function-active-hover) calc(100% * var(--tw-text-opacity, 1)), transparent);
 }
+.hover\:data-\[state\=checked\]\:before\:bg-\[var\(--switch-active-hover-color\)\][data-state="checked"]:hover::before{
+  content: var(--tw-content);
+  background-color: var(--switch-active-hover-color);
+}
+.hover\:data-\[state\=unchecked\]\:before\:bg-\[var\(--switch-hover-color\)\][data-state="unchecked"]:hover::before{
+  content: var(--tw-content);
+  background-color: var(--switch-hover-color);
+}
 .disabled\:data-\[state\=checked\]\:bg-state-disable-solid[data-state="checked"]:disabled{
   --tw-bg-opacity: 1;
   background-color: color-mix(in srgb, var(--state-color-disable-solid) calc(100% * var(--tw-bg-opacity, 1)), transparent);
@@ -6132,12 +6241,6 @@ input[type=number] {
 .group:hover .group-hover\:data-\[state\=unchecked\]\:bg-\[var\(--switch-thumb-hover-color\)\][data-state="unchecked"]{
   background-color: var(--switch-thumb-hover-color);
 }
-.group:hover .group-hover\:data-\[state\=checked\]\:ring-\[var\(--switch-thumb-active-hover-ring\)\][data-state="checked"]{
-  --tw-ring-color: var(--switch-thumb-active-hover-ring);
-}
-.group:hover .group-hover\:data-\[state\=unchecked\]\:ring-\[var\(--switch-thumb-hover-ring\)\][data-state="unchecked"]{
-  --tw-ring-color: var(--switch-thumb-hover-ring);
-}
 @media (min-width: 640px){
 
   .sm\:mt-0{
@@ -6203,6 +6306,15 @@ input[type=number] {
 .\[\&\[data-state\=indeterminate\]_\.checkbox-minus-icon\]\:block[data-state=indeterminate] .checkbox-minus-icon{
   display: block;
 }
+.\[\&_\.switch-thumb-halo\]\:opacity-100 .switch-thumb-halo{
+  opacity: 1;
+}
+.group:hover .group-hover\:\[\&_\.switch-thumb-halo\]\:opacity-100 .switch-thumb-halo{
+  opacity: 1;
+}
+.group:disabled .group-disabled\:\[\&_\.switch-thumb-halo\]\:opacity-0 .switch-thumb-halo{
+  opacity: 0;
+}
 .\[\&_button\]\:rounded-full button{
   border-radius: 9999px;
 }
@@ -6252,6 +6364,10 @@ input[type=number] {
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--input-color-default-text) calc(100% * var(--tw-text-opacity, 1)), transparent);
 }
+.hover\:\[\&_svg\]\:text-input-filled-text svg:hover{
+  --tw-text-opacity: 1;
+  color: color-mix(in srgb, var(--input-color-filled-text) calc(100% * var(--tw-text-opacity, 1)), transparent);
+}
 .peer:hover ~ .peer-hover\:\[\&_svg\]\:text-input-filled-text svg{
   --tw-text-opacity: 1;
   color: color-mix(in srgb, var(--input-color-filled-text) calc(100% * var(--tw-text-opacity, 1)), transparent);