@ultraviolet/ui 3.0.0-beta.8 → 3.0.0

package/dist/components/Row/styles.css.d.ts

@@ -7,23 +7,23 @@ export type JustifyContentType = (typeof justifyContentValues)[number];
 export declare const responsiveProperties: {
     conditions: {
         defaultCondition: "xxsmall";
-        conditionNames: ("small" | "large" | "medium" | "xlarge" | "xsmall" | "xxsmall")[];
-        responsiveArray: ("small" | "large" | "medium" | "xlarge" | "xsmall" | "xxsmall")[] & {
+        conditionNames: ("large" | "medium" | "small" | "xlarge" | "xsmall" | "xxsmall")[];
+        responsiveArray: ("large" | "medium" | "small" | "xlarge" | "xsmall" | "xxsmall")[] & {
             length: 5;
         };
     };
     styles: {
         gap: {
-            responsiveArray: ("small" | "large" | "medium" | "xlarge" | "xsmall" | "xxsmall")[] & {
+            responsiveArray: ("large" | "medium" | "small" | "xlarge" | "xsmall" | "xxsmall")[] & {
                 length: 5;
             };
             values: {
                 [x: string]: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -32,16 +32,16 @@ export declare const responsiveProperties: {
             };
         };
         alignItems: {
-            responsiveArray: ("small" | "large" | "medium" | "xlarge" | "xsmall" | "xxsmall")[] & {
+            responsiveArray: ("large" | "medium" | "small" | "xlarge" | "xsmall" | "xxsmall")[] & {
                 length: 5;
             };
             values: {
                 [x: string & {}]: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -50,9 +50,9 @@ export declare const responsiveProperties: {
                 "-moz-initial": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -61,9 +61,9 @@ export declare const responsiveProperties: {
                 inherit: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -72,9 +72,9 @@ export declare const responsiveProperties: {
                 initial: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -83,9 +83,9 @@ export declare const responsiveProperties: {
                 revert: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -94,9 +94,9 @@ export declare const responsiveProperties: {
                 "revert-layer": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -105,9 +105,9 @@ export declare const responsiveProperties: {
                 unset: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -116,9 +116,9 @@ export declare const responsiveProperties: {
                 normal: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -127,9 +127,9 @@ export declare const responsiveProperties: {
                 stretch: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -138,9 +138,9 @@ export declare const responsiveProperties: {
                 center: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -149,9 +149,9 @@ export declare const responsiveProperties: {
                 end: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -160,9 +160,9 @@ export declare const responsiveProperties: {
                 "flex-end": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -171,9 +171,9 @@ export declare const responsiveProperties: {
                 "flex-start": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -182,9 +182,9 @@ export declare const responsiveProperties: {
                 start: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -193,9 +193,9 @@ export declare const responsiveProperties: {
                 baseline: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -204,9 +204,9 @@ export declare const responsiveProperties: {
                 "self-end": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -215,9 +215,20 @@ export declare const responsiveProperties: {
                 "self-start": {
                     defaultClass: string;
                     conditions: {
+                        large: string;
+                        medium: string;
                         small: string;
+                        xlarge: string;
+                        xsmall: string;
+                        xxsmall: string;
+                    };
+                };
+                "anchor-center": {
+                    defaultClass: string;
+                    conditions: {
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -226,16 +237,16 @@ export declare const responsiveProperties: {
             };
         };
         justifyContent: {
-            responsiveArray: ("small" | "large" | "medium" | "xlarge" | "xsmall" | "xxsmall")[] & {
+            responsiveArray: ("large" | "medium" | "small" | "xlarge" | "xsmall" | "xxsmall")[] & {
                 length: 5;
             };
             values: {
                 [x: string & {}]: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -244,9 +255,9 @@ export declare const responsiveProperties: {
                 "-moz-initial": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -255,9 +266,9 @@ export declare const responsiveProperties: {
                 inherit: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -266,9 +277,9 @@ export declare const responsiveProperties: {
                 initial: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -277,9 +288,9 @@ export declare const responsiveProperties: {
                 revert: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -288,9 +299,9 @@ export declare const responsiveProperties: {
                 "revert-layer": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -299,9 +310,9 @@ export declare const responsiveProperties: {
                 unset: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -310,9 +321,9 @@ export declare const responsiveProperties: {
                 normal: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -321,9 +332,9 @@ export declare const responsiveProperties: {
                 left: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -332,9 +343,9 @@ export declare const responsiveProperties: {
                 right: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -343,9 +354,9 @@ export declare const responsiveProperties: {
                 "space-around": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -354,9 +365,9 @@ export declare const responsiveProperties: {
                 "space-between": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -365,9 +376,9 @@ export declare const responsiveProperties: {
                 "space-evenly": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -376,9 +387,9 @@ export declare const responsiveProperties: {
                 stretch: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -387,9 +398,9 @@ export declare const responsiveProperties: {
                 center: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -398,9 +409,9 @@ export declare const responsiveProperties: {
                 end: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -409,9 +420,9 @@ export declare const responsiveProperties: {
                 "flex-end": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -420,9 +431,9 @@ export declare const responsiveProperties: {
                 "flex-start": {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -431,9 +442,9 @@ export declare const responsiveProperties: {
                 start: {
                     defaultClass: string;
                     conditions: {
-                        small: string;
                         large: string;
                         medium: string;
+                        small: string;
                         xlarge: string;
                         xsmall: string;
                         xxsmall: string;
@@ -444,16 +455,16 @@ export declare const responsiveProperties: {
     };
 };
 export declare const sprinkles: ((props: {
-    gap?: import("@vanilla-extract/sprinkles").ResponsiveArray<2 | 1 | 3 | 4 | 5, string | null> | (string | {
-        small?: string | undefined;
+    gap?: import("@vanilla-extract/sprinkles").ResponsiveArray<1 | 2 | 3 | 4 | 5, string | null> | (string | {
         large?: string | undefined;
         medium?: string | undefined;
+        small?: string | undefined;
         xlarge?: string | undefined;
         xsmall?: string | undefined;
         xxsmall?: string | undefined;
     } | undefined);
-    alignItems?: ({} | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<2 | 1 | 3 | 4 | 5, import("csstype").Property.AlignItems | null | undefined>;
-    justifyContent?: ({} | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<2 | 1 | 3 | 4 | 5, import("csstype").Property.JustifyContent | null | undefined>;
+    alignItems?: ({} | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<1 | 2 | 3 | 4 | 5, import("csstype").Property.AlignItems | null | undefined>;
+    justifyContent?: ({} | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<1 | 2 | 3 | 4 | 5, import("csstype").Property.JustifyContent | null | undefined>;
 }) => string) & {
     properties: Set<"alignItems" | "justifyContent" | "gap">;
 };

package/dist/components/Row/styles.css.js

@@ -2,13 +2,13 @@
 /* empty css                          */
 import { createSprinkles } from "@vanilla-extract/sprinkles/createRuntimeSprinkles";
 var row = "uv_x6hyh50";
-var responsiveProperties = function() {
+var responsiveProperties = (function() {
   var x = { conditions: { defaultCondition: "xxsmall", conditionNames: ["xxsmall", "xsmall", "small", "medium", "large", "xlarge"], responsiveArray: ["xxsmall", "xsmall", "small", "medium", "large"] }, styles: { gap: { values: { "0rem": { conditions: { xxsmall: "uv_x6hyh51", xsmall: "uv_x6hyh52", small: "uv_x6hyh53", medium: "uv_x6hyh54", large: "uv_x6hyh55", xlarge: "uv_x6hyh56" }, defaultClass: "uv_x6hyh51" }, "0.5rem": { conditions: { xxsmall: "uv_x6hyh57", xsmall: "uv_x6hyh58", small: "uv_x6hyh59", medium: "uv_x6hyh5a", large: "uv_x6hyh5b", xlarge: "uv_x6hyh5c" }, defaultClass: "uv_x6hyh57" }, "1rem": { conditions: { xxsmall: "uv_x6hyh5d", xsmall: "uv_x6hyh5e", small: "uv_x6hyh5f", medium: "uv_x6hyh5g", large: "uv_x6hyh5h", xlarge: "uv_x6hyh5i" }, defaultClass: "uv_x6hyh5d" }, "1.5rem": { conditions: { xxsmall: "uv_x6hyh5j", xsmall: "uv_x6hyh5k", small: "uv_x6hyh5l", medium: "uv_x6hyh5m", large: "uv_x6hyh5n", xlarge: "uv_x6hyh5o" }, defaultClass: "uv_x6hyh5j" }, "2rem": { conditions: { xxsmall: "uv_x6hyh5p", xsmall: "uv_x6hyh5q", small: "uv_x6hyh5r", medium: "uv_x6hyh5s", large: "uv_x6hyh5t", xlarge: "uv_x6hyh5u" }, defaultClass: "uv_x6hyh5p" }, "2.5rem": { conditions: { xxsmall: "uv_x6hyh5v", xsmall: "uv_x6hyh5w", small: "uv_x6hyh5x", medium: "uv_x6hyh5y", large: "uv_x6hyh5z", xlarge: "uv_x6hyh510" }, defaultClass: "uv_x6hyh5v" }, "3rem": { conditions: { xxsmall: "uv_x6hyh511", xsmall: "uv_x6hyh512", small: "uv_x6hyh513", medium: "uv_x6hyh514", large: "uv_x6hyh515", xlarge: "uv_x6hyh516" }, defaultClass: "uv_x6hyh511" }, "3.5rem": { conditions: { xxsmall: "uv_x6hyh517", xsmall: "uv_x6hyh518", small: "uv_x6hyh519", medium: "uv_x6hyh51a", large: "uv_x6hyh51b", xlarge: "uv_x6hyh51c" }, defaultClass: "uv_x6hyh517" }, "4rem": { conditions: { xxsmall: "uv_x6hyh51d", xsmall: "uv_x6hyh51e", small: "uv_x6hyh51f", medium: "uv_x6hyh51g", large: "uv_x6hyh51h", xlarge: "uv_x6hyh51i" }, defaultClass: "uv_x6hyh51d" }, "4.5rem": { conditions: { xxsmall: "uv_x6hyh51j", xsmall: "uv_x6hyh51k", small: "uv_x6hyh51l", medium: "uv_x6hyh51m", large: "uv_x6hyh51n", xlarge: "uv_x6hyh51o" }, defaultClass: "uv_x6hyh51j" }, "5rem": { conditions: { xxsmall: "uv_x6hyh51p", xsmall: "uv_x6hyh51q", small: "uv_x6hyh51r", medium: "uv_x6hyh51s", large: "uv_x6hyh51t", xlarge: "uv_x6hyh51u" }, defaultClass: "uv_x6hyh51p" }, "0.25rem": { conditions: { xxsmall: "uv_x6hyh51v", xsmall: "uv_x6hyh51w", small: "uv_x6hyh51x", medium: "uv_x6hyh51y", large: "uv_x6hyh51z", xlarge: "uv_x6hyh520" }, defaultClass: "uv_x6hyh51v" }, "0.125rem": { conditions: { xxsmall: "uv_x6hyh521", xsmall: "uv_x6hyh522", small: "uv_x6hyh523", medium: "uv_x6hyh524", large: "uv_x6hyh525", xlarge: "uv_x6hyh526" }, defaultClass: "uv_x6hyh521" }, "0.75rem": { conditions: { xxsmall: "uv_x6hyh527", xsmall: "uv_x6hyh528", small: "uv_x6hyh529", medium: "uv_x6hyh52a", large: "uv_x6hyh52b", xlarge: "uv_x6hyh52c" }, defaultClass: "uv_x6hyh527" } }, responsiveArray: void 0 }, alignItems: { values: { normal: { conditions: { xxsmall: "uv_x6hyh52d", xsmall: "uv_x6hyh52e", small: "uv_x6hyh52f", medium: "uv_x6hyh52g", large: "uv_x6hyh52h", xlarge: "uv_x6hyh52i" }, defaultClass: "uv_x6hyh52d" }, stretch: { conditions: { xxsmall: "uv_x6hyh52j", xsmall: "uv_x6hyh52k", small: "uv_x6hyh52l", medium: "uv_x6hyh52m", large: "uv_x6hyh52n", xlarge: "uv_x6hyh52o" }, defaultClass: "uv_x6hyh52j" }, center: { conditions: { xxsmall: "uv_x6hyh52p", xsmall: "uv_x6hyh52q", small: "uv_x6hyh52r", medium: "uv_x6hyh52s", large: "uv_x6hyh52t", xlarge: "uv_x6hyh52u" }, defaultClass: "uv_x6hyh52p" }, start: { conditions: { xxsmall: "uv_x6hyh52v", xsmall: "uv_x6hyh52w", small: "uv_x6hyh52x", medium: "uv_x6hyh52y", large: "uv_x6hyh52z", xlarge: "uv_x6hyh530" }, defaultClass: "uv_x6hyh52v" }, end: { conditions: { xxsmall: "uv_x6hyh531", xsmall: "uv_x6hyh532", small: "uv_x6hyh533", medium: "uv_x6hyh534", large: "uv_x6hyh535", xlarge: "uv_x6hyh536" }, defaultClass: "uv_x6hyh531" }, "flex-start": { conditions: { xxsmall: "uv_x6hyh537", xsmall: "uv_x6hyh538", small: "uv_x6hyh539", medium: "uv_x6hyh53a", large: "uv_x6hyh53b", xlarge: "uv_x6hyh53c" }, defaultClass: "uv_x6hyh537" }, "flex-end": { conditions: { xxsmall: "uv_x6hyh53d", xsmall: "uv_x6hyh53e", small: "uv_x6hyh53f", medium: "uv_x6hyh53g", large: "uv_x6hyh53h", xlarge: "uv_x6hyh53i" }, defaultClass: "uv_x6hyh53d" }, "self-start": { conditions: { xxsmall: "uv_x6hyh53j", xsmall: "uv_x6hyh53k", small: "uv_x6hyh53l", medium: "uv_x6hyh53m", large: "uv_x6hyh53n", xlarge: "uv_x6hyh53o" }, defaultClass: "uv_x6hyh53j" }, "self-end": { conditions: { xxsmall: "uv_x6hyh53p", xsmall: "uv_x6hyh53q", small: "uv_x6hyh53r", medium: "uv_x6hyh53s", large: "uv_x6hyh53t", xlarge: "uv_x6hyh53u" }, defaultClass: "uv_x6hyh53p" }, baseline: { conditions: { xxsmall: "uv_x6hyh53v", xsmall: "uv_x6hyh53w", small: "uv_x6hyh53x", medium: "uv_x6hyh53y", large: "uv_x6hyh53z", xlarge: "uv_x6hyh540" }, defaultClass: "uv_x6hyh53v" }, "first baseline": { conditions: { xxsmall: "uv_x6hyh541", xsmall: "uv_x6hyh542", small: "uv_x6hyh543", medium: "uv_x6hyh544", large: "uv_x6hyh545", xlarge: "uv_x6hyh546" }, defaultClass: "uv_x6hyh541" }, "last baseline": { conditions: { xxsmall: "uv_x6hyh547", xsmall: "uv_x6hyh548", small: "uv_x6hyh549", medium: "uv_x6hyh54a", large: "uv_x6hyh54b", xlarge: "uv_x6hyh54c" }, defaultClass: "uv_x6hyh547" }, "safe center": { conditions: { xxsmall: "uv_x6hyh54d", xsmall: "uv_x6hyh54e", small: "uv_x6hyh54f", medium: "uv_x6hyh54g", large: "uv_x6hyh54h", xlarge: "uv_x6hyh54i" }, defaultClass: "uv_x6hyh54d" }, "unsafe center": { conditions: { xxsmall: "uv_x6hyh54j", xsmall: "uv_x6hyh54k", small: "uv_x6hyh54l", medium: "uv_x6hyh54m", large: "uv_x6hyh54n", xlarge: "uv_x6hyh54o" }, defaultClass: "uv_x6hyh54j" } }, responsiveArray: void 0 }, justifyContent: { values: { normal: { conditions: { xxsmall: "uv_x6hyh54p", xsmall: "uv_x6hyh54q", small: "uv_x6hyh54r", medium: "uv_x6hyh54s", large: "uv_x6hyh54t", xlarge: "uv_x6hyh54u" }, defaultClass: "uv_x6hyh54p" }, center: { conditions: { xxsmall: "uv_x6hyh54v", xsmall: "uv_x6hyh54w", small: "uv_x6hyh54x", medium: "uv_x6hyh54y", large: "uv_x6hyh54z", xlarge: "uv_x6hyh550" }, defaultClass: "uv_x6hyh54v" }, start: { conditions: { xxsmall: "uv_x6hyh551", xsmall: "uv_x6hyh552", small: "uv_x6hyh553", medium: "uv_x6hyh554", large: "uv_x6hyh555", xlarge: "uv_x6hyh556" }, defaultClass: "uv_x6hyh551" }, end: { conditions: { xxsmall: "uv_x6hyh557", xsmall: "uv_x6hyh558", small: "uv_x6hyh559", medium: "uv_x6hyh55a", large: "uv_x6hyh55b", xlarge: "uv_x6hyh55c" }, defaultClass: "uv_x6hyh557" }, "flex-start": { conditions: { xxsmall: "uv_x6hyh55d", xsmall: "uv_x6hyh55e", small: "uv_x6hyh55f", medium: "uv_x6hyh55g", large: "uv_x6hyh55h", xlarge: "uv_x6hyh55i" }, defaultClass: "uv_x6hyh55d" }, "flex-end": { conditions: { xxsmall: "uv_x6hyh55j", xsmall: "uv_x6hyh55k", small: "uv_x6hyh55l", medium: "uv_x6hyh55m", large: "uv_x6hyh55n", xlarge: "uv_x6hyh55o" }, defaultClass: "uv_x6hyh55j" }, left: { conditions: { xxsmall: "uv_x6hyh55p", xsmall: "uv_x6hyh55q", small: "uv_x6hyh55r", medium: "uv_x6hyh55s", large: "uv_x6hyh55t", xlarge: "uv_x6hyh55u" }, defaultClass: "uv_x6hyh55p" }, right: { conditions: { xxsmall: "uv_x6hyh55v", xsmall: "uv_x6hyh55w", small: "uv_x6hyh55x", medium: "uv_x6hyh55y", large: "uv_x6hyh55z", xlarge: "uv_x6hyh560" }, defaultClass: "uv_x6hyh55v" }, "space-between": { conditions: { xxsmall: "uv_x6hyh561", xsmall: "uv_x6hyh562", small: "uv_x6hyh563", medium: "uv_x6hyh564", large: "uv_x6hyh565", xlarge: "uv_x6hyh566" }, defaultClass: "uv_x6hyh561" }, "space-around": { conditions: { xxsmall: "uv_x6hyh567", xsmall: "uv_x6hyh568", small: "uv_x6hyh569", medium: "uv_x6hyh56a", large: "uv_x6hyh56b", xlarge: "uv_x6hyh56c" }, defaultClass: "uv_x6hyh567" }, "space-evenly": { conditions: { xxsmall: "uv_x6hyh56d", xsmall: "uv_x6hyh56e", small: "uv_x6hyh56f", medium: "uv_x6hyh56g", large: "uv_x6hyh56h", xlarge: "uv_x6hyh56i" }, defaultClass: "uv_x6hyh56d" }, stretch: { conditions: { xxsmall: "uv_x6hyh56j", xsmall: "uv_x6hyh56k", small: "uv_x6hyh56l", medium: "uv_x6hyh56m", large: "uv_x6hyh56n", xlarge: "uv_x6hyh56o" }, defaultClass: "uv_x6hyh56j" } }, responsiveArray: void 0 } } };
   x.styles.gap.responsiveArray = x.conditions.responsiveArray;
   x.styles.alignItems.responsiveArray = x.conditions.responsiveArray;
   x.styles.justifyContent.responsiveArray = x.conditions.responsiveArray;
   return x;
-}();
+})();
 var sprinkles = createSprinkles(responsiveProperties);
 export {
   responsiveProperties,

package/dist/components/Row/variables.css.js

@@ -1,3 +1,4 @@
+/* empty css                             */
 var templateColumn = { large: "var(--uv_3mg8xe0)", xlarge: "var(--uv_3mg8xe1)", medium: "var(--uv_3mg8xe2)", small: "var(--uv_3mg8xe3)", xsmall: "var(--uv_3mg8xe4)", xxsmall: "var(--uv_3mg8xe5)" };
 var paddings = { large: "var(--uv_3mg8xe6)", xlarge: "var(--uv_3mg8xe7)", medium: "var(--uv_3mg8xe8)", small: "var(--uv_3mg8xe9)", xsmall: "var(--uv_3mg8xea)", xxsmall: "var(--uv_3mg8xeb)" };
 export {

package/dist/components/SearchInput/KeyGroup.d.ts

@@ -5,5 +5,5 @@ type KeyGroupProps = {
     disabled: ComponentProps<typeof Key>['disabled'];
     onClick?: () => void;
 };
-export declare const KeyGroup: ({ keys, disabled, onClick }: KeyGroupProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const KeyGroup: ({ keys, disabled, onClick }: KeyGroupProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/SearchInput/KeyGroup.js

@@ -1,29 +1,9 @@
 "use client";
-import { jsx } from "@emotion/react/jsx-runtime";
-import _styled from "@emotion/styled/base";
+import { jsx } from "react/jsx-runtime";
 import { Key } from "../Key/index.js";
 import { Stack } from "../Stack/index.js";
-function _EMOTION_STRINGIFIED_CSS_ERROR__() {
-  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
-}
-const ClickableStack = /* @__PURE__ */ _styled(Stack, process.env.NODE_ENV === "production" ? {
-  target: "e1anqdc20"
-} : {
-  target: "e1anqdc20",
-  label: "ClickableStack"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1jbm2s3",
-  styles: "cursor:text"
-} : {
-  name: "1jbm2s3",
-  styles: "cursor:text/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3VpL3NyYy9jb21wb25lbnRzL1NlYXJjaElucHV0L0tleUdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPb0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvdWkvc3JjL2NvbXBvbmVudHMvU2VhcmNoSW5wdXQvS2V5R3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiJ3VzZSBjbGllbnQnXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHR5cGUgeyBDb21wb25lbnRQcm9wcyB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgS2V5IH0gZnJvbSAnLi4vS2V5J1xuaW1wb3J0IHsgU3RhY2sgfSBmcm9tICcuLi9TdGFjaydcblxuY29uc3QgQ2xpY2thYmxlU3RhY2sgPSBzdHlsZWQoU3RhY2spYFxuICBjdXJzb3I6IHRleHQ7XG5gXG5cbnR5cGUgS2V5R3JvdXBQcm9wcyA9IHtcbiAga2V5czogQ29tcG9uZW50UHJvcHM8dHlwZW9mIEtleT5bJ2NoaWxkcmVuJ11bXVxuICBkaXNhYmxlZDogQ29tcG9uZW50UHJvcHM8dHlwZW9mIEtleT5bJ2Rpc2FibGVkJ11cbiAgb25DbGljaz86ICgpID0+IHZvaWRcbn1cblxuZXhwb3J0IGNvbnN0IEtleUdyb3VwID0gKHsga2V5cywgZGlzYWJsZWQsIG9uQ2xpY2sgfTogS2V5R3JvdXBQcm9wcykgPT4gKFxuICA8Q2xpY2thYmxlU3RhY2sgZGlyZWN0aW9uPVwicm93XCIgZ2FwPXswLjV9IG9uQ2xpY2s9e29uQ2xpY2t9PlxuICAgIHtrZXlzLm1hcChrZXkgPT4gKFxuICAgICAgPEtleSBkYXRhLXRlc3RpZD17YGtleS0ke2tleX1gfSBkaXNhYmxlZD17ZGlzYWJsZWR9IGtleT17a2V5fT5cbiAgICAgICAge2tleX1cbiAgICAgIDwvS2V5PlxuICAgICkpfVxuICA8L0NsaWNrYWJsZVN0YWNrPlxuKVxuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const KeyGroup = ({
-  keys,
-  disabled,
-  onClick
-}) => /* @__PURE__ */ jsx(ClickableStack, { direction: "row", gap: 0.5, onClick, children: keys.map((key) => /* @__PURE__ */ jsx(Key, { "data-testid": `key-${key}`, disabled, children: key }, key)) });
+import { clickableStack } from "./styles.css.js";
+const KeyGroup = ({ keys, disabled, onClick }) => /* @__PURE__ */ jsx(Stack, { className: clickableStack, direction: "row", gap: 0.5, onClick, children: keys.map((key) => /* @__PURE__ */ jsx(Key, { "data-testid": `key-${key}`, disabled, children: key }, key)) });
 export {
   KeyGroup
 };