@rarui/styles 1.31.0-rc.7 → 1.31.0

package/dist/index.d.ts

@@ -3974,6 +3974,11 @@ declare const fontSizeProperties: {
 	"label-m": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 	"label-l": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 };
+declare const fontFamilyProperties: {
+	body: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+	heading: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+	button: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
 declare const lineHeightProperties: {
 	readonly hero: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 	readonly "body-xxs": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -4166,19 +4171,19 @@ export interface BoxSprinkle extends BoxDynamicProperties {
 	 */
 	borderRadius?: AddDollar<keyof typeof borderRadiusProperties> | BoxConditions<AddDollar<keyof typeof borderRadiusProperties>>;
 	/**
-	 * The borderRadius property rounds the corners of an box's outer border edge.
+	 * The borderTopLeftRadius property rounds the corners of an box's outer border edge.
 	 */
 	borderTopLeftRadius?: AddDollar<keyof typeof borderRadiusProperties> | BoxConditions<AddDollar<keyof typeof borderRadiusProperties>>;
 	/**
-	 * The borderRadius property rounds the corners of an box's outer border edge.
+	 * The borderTopRightRadius property rounds the corners of an box's outer border edge.
 	 */
 	borderTopRightRadius?: AddDollar<keyof typeof borderRadiusProperties> | BoxConditions<AddDollar<keyof typeof borderRadiusProperties>>;
 	/**
-	 * The borderRadius property rounds the corners of an box's outer border edge.
+	 * The borderBottomLeftRadius property rounds the corners of an box's outer border edge.
 	 */
 	borderBottomLeftRadius?: AddDollar<keyof typeof borderRadiusProperties> | BoxConditions<AddDollar<keyof typeof borderRadiusProperties>>;
 	/**
-	 * The borderRadius property rounds the corners of an box's outer border edge.
+	 * The borderBottomRightRadius property rounds the corners of an box's outer border edge.
 	 */
 	borderBottomRightRadius?: AddDollar<keyof typeof borderRadiusProperties> | BoxConditions<AddDollar<keyof typeof borderRadiusProperties>>;
 	/**
@@ -4333,6 +4338,10 @@ export interface BoxSprinkle extends BoxDynamicProperties {
 	 * The marginY property defines the margin area on the top and bottom of a box
 	 */
 	marginY?: AddDollar<keyof typeof marginProperties> | BoxConditions<AddDollar<keyof typeof marginProperties>>;
+	/**
+	 * The fontFamily property sets the font family of the box.
+	 */
+	fontFamily?: AddDollar<keyof typeof fontFamilyProperties> | BoxConditions<AddDollar<keyof typeof fontFamilyProperties>>;
 	/**
 	 * The fontSize property sets the size of the box.
 	 */
@@ -4704,15 +4713,15 @@ export declare const box: {
 				};
 				borderRadius: {
 					values: {
-						xs: {
+						button: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						xl: {
+						xs: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						button: {
+						xl: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
@@ -4766,15 +4775,15 @@ export declare const box: {
 				};
 				borderTopLeftRadius: {
 					values: {
-						xs: {
+						button: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						xl: {
+						xs: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						button: {
+						xl: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
@@ -4828,15 +4837,15 @@ export declare const box: {
 				};
 				borderTopRightRadius: {
 					values: {
-						xs: {
+						button: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						xl: {
+						xs: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						button: {
+						xl: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
@@ -4890,15 +4899,15 @@ export declare const box: {
 				};
 				borderBottomLeftRadius: {
 					values: {
-						xs: {
+						button: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						xl: {
+						xs: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						button: {
+						xl: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
@@ -4952,15 +4961,15 @@ export declare const box: {
 				};
 				borderBottomRightRadius: {
 					values: {
-						xs: {
+						button: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						xl: {
+						xs: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
-						button: {
+						xl: {
 							default: string;
 							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
 						};
@@ -6601,6 +6610,28 @@ export declare const box: {
 					};
 					name: "fontSize";
 				};
+				fontFamily: {
+					values: {
+						body: {
+							default: string;
+							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
+						};
+						heading: {
+							default: string;
+							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
+						};
+						button: {
+							default: string;
+							conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
+						};
+					};
+					staticScale: {
+						body: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+						heading: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+						button: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+					};
+					name: "fontFamily";
+				};
 			};
 		} & {
 			config: {
@@ -8595,7 +8626,21 @@ declare const progressStyles: {
 	}>;
 	circleText: string;
 };
+declare const progressBackgroundColorProperties: {
+	info: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+	success: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+	brand: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+};
 export type ProgressVariants = RecipeVariants<typeof progressStyles.circle>;
+export interface ProgressSprinkle {
+	/**
+	 * Specifies the background color of the progress.
+	 * This prop accepts one of the following values: "$info", "$success" or "$brand"
+	 * @default $info
+	 * @examples ["$brand", { xs: "$brand", md: "$info" }]
+	 */
+	backgroundColor?: AddDollar<keyof typeof progressBackgroundColorProperties>;
+}
 export declare const progress: {
 	classnames: {
 		progress: string;
@@ -8627,6 +8672,9 @@ export declare const progress: {
 			config: {
 				backgroundColor: {
 					values: {
+						brand: {
+							default: string;
+						};
 						info: {
 							default: string;
 						};
@@ -8637,6 +8685,7 @@ export declare const progress: {
 					staticScale: {
 						info: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 						success: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+						brand: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 					};
 					name: "backgroundColor";
 				};
@@ -11266,7 +11315,22 @@ declare const sideNavigationStyles: {
 			};
 		};
 	}>;
-	sideNavigationItem: string;
+	sideNavigationItem: import("@vanilla-extract/recipes").RuntimeFn<{
+		/**
+		 * Determines the level of nesting for the item.
+		 */
+		level: {
+			0: {
+				paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+			};
+			1: {
+				paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+			};
+			2: {
+				paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+			};
+		};
+	}>;
 	name: import("@vanilla-extract/recipes").RuntimeFn<{
 		active: {
 			true: {
@@ -11290,13 +11354,13 @@ declare const sideNavigationStyles: {
 		open: {
 			true: {
 				overflow: "visible";
-				maxHeight: "100vh";
+				maxHeight: "unset";
 				marginTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 			};
 		};
 	}>;
 };
-export type SideNavigationVariants = RecipeVariants<typeof sideNavigationStyles.sideNavigation>;
+export type SideNavigationVariants = NonNullable<RecipeVariants<typeof sideNavigationStyles.sideNavigation> & RecipeVariants<typeof sideNavigationStyles.sideNavigationItem>>;
 export declare const sideNavigation: {
 	classnames: {
 		sideNavigation: import("@vanilla-extract/recipes").RuntimeFn<{
@@ -11325,7 +11389,19 @@ export declare const sideNavigation: {
 				};
 			};
 		}>;
-		sideNavigationItem: string;
+		sideNavigationItem: import("@vanilla-extract/recipes").RuntimeFn<{
+			level: {
+				0: {
+					paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+				};
+				1: {
+					paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+				};
+				2: {
+					paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+				};
+			};
+		}>;
 		name: import("@vanilla-extract/recipes").RuntimeFn<{
 			active: {
 				true: {
@@ -11349,7 +11425,7 @@ export declare const sideNavigation: {
 			open: {
 				true: {
 					overflow: "visible";
-					maxHeight: "100vh";
+					maxHeight: "unset";
 					marginTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 				};
 			};