@rarui/styles 2.2.5 → 2.3.0-rc.2

package/dist/packages/navigation/breadcrumb/rarui-breadcrumb.css

@@ -0,0 +1,39 @@
+.rarui-breadcrumb__s9ulv20 {
+  list-style: none;
+  display: flex;
+  align-items: center;
+  padding: 0;
+  margin: 0;
+  gap: var(--rarui-spacing-3xs);
+}
+.rarui-breadcrumb_item__s9ulv21 {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  background-color: transparent;
+  border: none;
+  width: 100%;
+  transition: all 150ms ease;
+  text-decoration: underline;
+  box-sizing: border-box;
+  border-radius: var(--rarui-shape-border-radius-2xs);
+  gap: var(--rarui-spacing-3xs);
+  padding: var(--rarui-spacing-3xs);
+  color: var(--rarui-colors-content-secondary);
+  font-weight: var(--rarui-fontWeight-medium);
+  font-size: var(--rarui-fontSize-button-s);
+  font-family: var(--rarui-fontFamily-body);
+}
+.rarui-breadcrumb_item__s9ulv21:focus-within {
+  outline: none;
+  box-shadow: var(--rarui-elevation-focus-ring);
+}
+.rarui-breadcrumb_item__s9ulv21:hover {
+  color: var(--rarui-colors-content-brand);
+}
+.rarui-breadcrumb_item__s9ulv21:disabled {
+  color: var(--rarui-colors-content-disabled);
+}
+.rarui-breadcrumb_item_active_true__s9ulv22 {
+  color: var(--rarui-colors-content-brand);
+}

package/dist/packages/navigation/breadcrumb/rarui-breadcrumb.css.d.ts

@@ -0,0 +1,18 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const breadcrumbStyles: {
+    breadcrumb: string;
+    item: RuntimeFn<{
+        /**
+         * Indicates whether the breadcrumb item is currently active.
+         * An active item is typically styled differently to show that it represents the current page.
+         */
+        active: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+};
+
+export { breadcrumbStyles };

package/dist/packages/navigation/breadcrumb/rarui-breadcrumb.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-breadcrumb.css";import{c as r}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";var a={breadcrumb:"rarui-breadcrumb__s9ulv20",item:r({defaultClassName:"rarui-breadcrumb_item__s9ulv21",variantClassNames:{active:{true:"rarui-breadcrumb_item_active_true__s9ulv22"}},defaultVariants:{},compoundVariants:[]})};export{a as breadcrumbStyles};

package/dist/packages/navigation/breadcrumb/rarui-breadcrumb.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { breadcrumbStyles } from './rarui-breadcrumb.css.js';
+
+type BreadcrumbVariants = NonNullable<RecipeVariants<typeof breadcrumbStyles.item>>;
+
+export type { BreadcrumbVariants };

package/dist/packages/navigation/link/index.d.ts

@@ -0,0 +1,38 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const link: {
+    classnames: {
+        link: RuntimeFn<{
+            appearance: {
+                brand: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                neutral: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                inverted: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+            size: {
+                large: {
+                    fontSize: "1.125rem";
+                    lineHeight: "1.75rem";
+                    letterSpacing: ".0112rem";
+                };
+                small: {
+                    fontSize: ".875rem";
+                    lineHeight: "1.25rem";
+                    letterSpacing: ".0088rem";
+                };
+                medium: {
+                    fontSize: "1rem";
+                    lineHeight: "1.5rem";
+                    letterSpacing: ".01rem";
+                };
+            };
+        }>;
+    };
+};
+
+export { link };

package/dist/packages/navigation/link/index.js

@@ -0,0 +1 @@
+import{__assign as r}from"tslib";import{styles as s}from"./rarui-link.css.js";var i={classnames:r({},s)};export{i as link};

package/dist/packages/navigation/link/rarui-link.css

@@ -0,0 +1,45 @@
+.rarui-link__ttd2ma0 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: fit-content;
+  cursor: pointer;
+  position: relative;
+  gap: var(--rarui-spacing-4xs);
+  text-decoration: underline;
+  font-weight: var(--rarui-fontWeight-regular);
+  font-family: var(--rarui-fontFamily-body);
+  background-color: transparent;
+  border: none;
+}
+.rarui-link__ttd2ma0:hover {
+  text-decoration: none;
+}
+.rarui-link__ttd2ma0:disabled {
+  color: var(--rarui-colors-content-disabled);
+  cursor: not-allowed;
+}
+.rarui-link_appearance_brand__ttd2ma1 {
+  color: var(--rarui-colors-content-brand);
+}
+.rarui-link_appearance_neutral__ttd2ma2 {
+  color: var(--rarui-colors-content-primary);
+}
+.rarui-link_appearance_inverted__ttd2ma3 {
+  color: var(--rarui-colors-content-invert);
+}
+.rarui-link_size_large__ttd2ma4 {
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+  letter-spacing: .0112rem;
+}
+.rarui-link_size_small__ttd2ma5 {
+  font-size: .875rem;
+  line-height: 1.25rem;
+  letter-spacing: .0088rem;
+}
+.rarui-link_size_medium__ttd2ma6 {
+  font-size: 1rem;
+  line-height: 1.5rem;
+  letter-spacing: .01rem;
+}

package/dist/packages/navigation/link/rarui-link.css.d.ts

@@ -0,0 +1,42 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const styles: {
+    link: RuntimeFn<{
+        /**
+         * Determines the visual style of the link.
+         */
+        appearance: {
+            brand: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            neutral: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            inverted: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+        /**
+         * Specifies the size of the link.
+         */
+        size: {
+            large: {
+                fontSize: "1.125rem";
+                lineHeight: "1.75rem";
+                letterSpacing: ".0112rem";
+            };
+            small: {
+                fontSize: ".875rem";
+                lineHeight: "1.25rem";
+                letterSpacing: ".0088rem";
+            };
+            medium: {
+                fontSize: "1rem";
+                lineHeight: "1.5rem";
+                letterSpacing: ".01rem";
+            };
+        };
+    }>;
+};
+
+export { styles };

package/dist/packages/navigation/link/rarui-link.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-link.css";import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";var r={link:a({defaultClassName:"rarui-link__ttd2ma0",variantClassNames:{appearance:{brand:"rarui-link_appearance_brand__ttd2ma1",neutral:"rarui-link_appearance_neutral__ttd2ma2",inverted:"rarui-link_appearance_inverted__ttd2ma3"},size:{large:"rarui-link_size_large__ttd2ma4",small:"rarui-link_size_small__ttd2ma5",medium:"rarui-link_size_medium__ttd2ma6"}},defaultVariants:{},compoundVariants:[]})};export{r as styles};

package/dist/packages/navigation/link/rarui-link.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { styles } from './rarui-link.css.js';
+
+type LinkVariants = NonNullable<RecipeVariants<typeof styles.link>>;
+
+export type { LinkVariants };

package/dist/packages/navigation/pagination/index.d.ts

@@ -0,0 +1,47 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const pagination: {
+    classnames: {
+        container: RuntimeFn<{
+            size: {
+                dot: {
+                    gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                small: {};
+                large: {};
+            };
+        }>;
+        item: RuntimeFn<{
+            selected: {
+                true: {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    ":hover": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                        color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                };
+            };
+            size: {
+                dot: {
+                    width: "0.75rem";
+                    height: "0.75rem";
+                    borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                small: {
+                    minWidth: "2.5rem";
+                    height: "2.5rem";
+                    fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                large: {
+                    minWidth: "2.75rem";
+                    height: "2.75rem";
+                    fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+    };
+};
+
+export { pagination };

package/dist/packages/navigation/pagination/index.js

@@ -0,0 +1 @@
+import{paginationStyles as a}from"./rarui-pagination.css.js";var r={classnames:a};export{r as pagination};

package/dist/packages/navigation/pagination/rarui-pagination.css

@@ -0,0 +1,73 @@
+.rarui-pagination_container__1s0rx9q0 {
+  display: flex;
+  align-items: center;
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  gap: var(--rarui-spacing-4xs);
+  transition: all 150ms ease;
+}
+.rarui-pagination_container_size_dot__1s0rx9q1 {
+  gap: var(--rarui-spacing-xs);
+}
+.rarui-pagination_item__1s0rx9q4 {
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: transparent;
+  transition: all 150ms ease;
+  border: none;
+  color: var(--rarui-colors-content-primary);
+  border-radius: var(--rarui-shape-border-radius-2xs);
+  font-family: var(--rarui-fontFamily-body);
+  font-weight: var(--rarui-fontWeight-semiBold);
+}
+.rarui-pagination_item__1s0rx9q4:focus-within {
+  outline: none;
+  box-shadow: var(--rarui-elevation-focus-ring);
+}
+.rarui-pagination_item__1s0rx9q4:hover {
+  background-color: var(--rarui-colors-surface-brand-hover);
+  color: var(--rarui-colors-content-brand);
+}
+.rarui-pagination_item__1s0rx9q4:active {
+  background-color: var(--rarui-colors-surface-brand-press);
+}
+.rarui-pagination_item__1s0rx9q4:disabled {
+  cursor: not-allowed;
+  background-color: transparent;
+  color: var(--rarui-colors-content-disabled);
+}
+.rarui-pagination_item_selected_true__1s0rx9q5 {
+  background-color: var(--rarui-colors-surface-brand);
+  color: var(--rarui-colors-content-on-brand);
+}
+.rarui-pagination_item_selected_true__1s0rx9q5:hover {
+  background-color: var(--rarui-colors-surface-brand);
+  color: var(--rarui-colors-content-on-brand);
+}
+.rarui-pagination_item_size_dot__1s0rx9q6 {
+  width: 0.75rem;
+  height: 0.75rem;
+  border-radius: var(--rarui-shape-border-radius-pill);
+  background-color: var(--rarui-colors-content-disabled);
+}
+.rarui-pagination_item_size_small__1s0rx9q7 {
+  min-width: 2.5rem;
+  height: 2.5rem;
+  font-size: var(--rarui-fontSize-button-s);
+}
+.rarui-pagination_item_size_large__1s0rx9q8 {
+  min-width: 2.75rem;
+  height: 2.75rem;
+  font-size: var(--rarui-fontSize-button-m);
+}
+.rarui-pagination_item_compound_0__1s0rx9q9 {
+  width: 1.25rem;
+  background-color: var(--rarui-colors-content-brand);
+}
+.rarui-pagination_item_compound_0__1s0rx9q9:hover {
+  background-color: var(--rarui-colors-content-brand);
+  color: var(--rarui-colors-content-on-brand);
+}

package/dist/packages/navigation/pagination/rarui-pagination.css.d.ts

@@ -0,0 +1,49 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const paginationStyles: {
+    container: RuntimeFn<{
+        size: {
+            dot: {
+                gap: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            small: {};
+            large: {};
+        };
+    }>;
+    item: RuntimeFn<{
+        selected: {
+            true: {
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                ":hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        };
+        /**
+         * Specifies the size of the Pagination component.
+         * @default medium
+         */
+        size: {
+            dot: {
+                width: "0.75rem";
+                height: "0.75rem";
+                borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            small: {
+                minWidth: "2.5rem";
+                height: "2.5rem";
+                fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+            large: {
+                minWidth: "2.75rem";
+                height: "2.75rem";
+                fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+};
+
+export { paginationStyles };

package/dist/packages/navigation/pagination/rarui-pagination.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-pagination.css";import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";a({defaultClassName:"rarui-pagination_container__1s0rx9q0",variantClassNames:{size:{dot:"rarui-pagination_container_size_dot__1s0rx9q1",small:"rarui-pagination_container_size_small__1s0rx9q2",large:"rarui-pagination_container_size_large__1s0rx9q3"}},defaultVariants:{},compoundVariants:[]});var i={container:a({defaultClassName:"rarui-pagination_container__1s0rx9q0",variantClassNames:{size:{dot:"rarui-pagination_container_size_dot__1s0rx9q1",small:"rarui-pagination_container_size_small__1s0rx9q2",large:"rarui-pagination_container_size_large__1s0rx9q3"}},defaultVariants:{},compoundVariants:[]}),item:a({defaultClassName:"rarui-pagination_item__1s0rx9q4",variantClassNames:{selected:{true:"rarui-pagination_item_selected_true__1s0rx9q5"},size:{dot:"rarui-pagination_item_size_dot__1s0rx9q6",small:"rarui-pagination_item_size_small__1s0rx9q7",large:"rarui-pagination_item_size_large__1s0rx9q8"}},defaultVariants:{},compoundVariants:[[{size:"dot",selected:!0},"rarui-pagination_item_compound_0__1s0rx9q9"]]})};export{i as paginationStyles};

package/dist/packages/navigation/pagination/rarui-pagination.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { paginationStyles } from './rarui-pagination.css.js';
+
+type PaginationVariants = Omit<NonNullable<RecipeVariants<typeof paginationStyles.item>>, "selected">;
+
+export type { PaginationVariants };

package/dist/packages/navigation/sideNavigation/index.d.ts

@@ -0,0 +1,75 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const sideNavigation: {
+    classnames: {
+        sideNavigation: RuntimeFn<{
+            active: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    ":after": {
+                        content: "";
+                        position: "absolute";
+                        left: number;
+                        right: number;
+                        top: number;
+                        bottom: number;
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":hover": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":active": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    };
+                    ":disabled": {
+                        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                        cursor: "not-allowed";
+                    };
+                };
+            };
+        }>;
+        item: 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: RuntimeFn<{
+            active: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+            disabled: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+        description: RuntimeFn<{
+            disabled: {
+                true: {
+                    color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+        content: RuntimeFn<{
+            open: {
+                true: {
+                    overflow: "visible";
+                    maxHeight: "unset";
+                    marginTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+            };
+        }>;
+    };
+};
+
+export { sideNavigation };

package/dist/packages/navigation/sideNavigation/index.js

@@ -0,0 +1 @@
+import{sideNavigationStyles as s}from"./rarui-sideNavigation.css.js";var a={classnames:s};export{a as sideNavigation};

package/dist/packages/navigation/sideNavigation/rarui-sideNavigation.css

@@ -0,0 +1,103 @@
+.rarui-sideNavigation__1ce544k0 {
+  padding: var(--rarui-spacing-2xs);
+  border-radius: var(--rarui-shape-border-radius-2xs);
+  font-family: var(--rarui-fontFamily-body);
+  color: var(--rarui-colors-content-secondary);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  transition: all 150ms ease;
+  width: 100%;
+  min-height: 42px;
+  box-sizing: border-box;
+  cursor: pointer;
+  background-color: transparent;
+  border: none;
+  text-align: left;
+  position: relative;
+  overflow: hidden;
+}
+.rarui-sideNavigation__1ce544k0:hover {
+  background-color: var(--rarui-colors-surface-hover);
+}
+.rarui-sideNavigation__1ce544k0:active {
+  background-color: var(--rarui-colors-surface-press);
+}
+.rarui-sideNavigation__1ce544k0:focus-within {
+  outline: none;
+  box-shadow: var(--rarui-elevation-focus-ring);
+}
+.rarui-sideNavigation__1ce544k0:disabled {
+  background-color: var(--rarui-colors-surface-disabled);
+  cursor: not-allowed;
+}
+.rarui-sideNavigation_active_true__1ce544k1 {
+  color: var(--rarui-colors-content-brand);
+}
+.rarui-sideNavigation_active_true__1ce544k1:after {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  background-color: var(--rarui-colors-surface-brand-subdued);
+}
+.rarui-sideNavigation_active_true__1ce544k1:hover {
+  background-color: var(--rarui-colors-surface-brand-hover);
+}
+.rarui-sideNavigation_active_true__1ce544k1:active {
+  background-color: var(--rarui-colors-surface-brand-press);
+}
+.rarui-sideNavigation_active_true__1ce544k1:disabled {
+  background-color: var(--rarui-colors-surface-disabled);
+  cursor: not-allowed;
+}
+.rarui-sideNavigation_name__1ce544k2 {
+  font-size: var(--rarui-fontSize-button-s);
+  color: var(--rarui-colors-content-primary);
+  font-weight: var(--rarui-fontWeight-bold);
+}
+.rarui-sideNavigation_name_active_true__1ce544k3 {
+  color: var(--rarui-colors-content-brand);
+}
+.rarui-sideNavigation_name_disabled_true__1ce544k4 {
+  color: var(--rarui-colors-content-disabled);
+}
+.rarui-sideNavigation_description__1ce544k5 {
+  font-size: var(--rarui-fontSize-button-xs);
+  color: var(--rarui-colors-content-secondary);
+}
+.rarui-sideNavigation_description_disabled_true__1ce544k6 {
+  color: var(--rarui-colors-content-disabled);
+}
+.rarui-sideNavigation_item__1ce544k7 {
+  background-color: transparent;
+  font-size: var(--rarui-fontSize-button-s);
+  text-decoration: none;
+}
+.rarui-sideNavigation_item__1ce544k7:after {
+  background-color: transparent;
+}
+.rarui-sideNavigation_item_level_0__1ce544k8 {
+  padding-left: var(--rarui-spacing-xs);
+}
+.rarui-sideNavigation_item_level_1__1ce544k9 {
+  padding-left: var(--rarui-spacing-md);
+}
+.rarui-sideNavigation_item_level_2__1ce544ka {
+  padding-left: var(--rarui-spacing-2xl);
+}
+.rarui-sideNavigation_content__1ce544kb {
+  display: flex;
+  flex-direction: column;
+  max-height: 0vh;
+  overflow: hidden;
+  transition: all 150ms ease;
+  gap: var(--rarui-spacing-4xs);
+}
+.rarui-sideNavigation_content_open_true__1ce544kc {
+  overflow: visible;
+  max-height: unset;
+  margin-top: var(--rarui-spacing-3xs);
+}

package/dist/packages/navigation/sideNavigation/rarui-sideNavigation.css.d.ts

@@ -0,0 +1,76 @@
+import { RuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+
+declare const sideNavigationStyles: {
+    sideNavigation: RuntimeFn<{
+        active: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                ":after": {
+                    content: "";
+                    position: "absolute";
+                    left: number;
+                    right: number;
+                    top: number;
+                    bottom: number;
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":hover": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":active": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                };
+                ":disabled": {
+                    backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+                    cursor: "not-allowed";
+                };
+            };
+        };
+    }>;
+    item: 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: RuntimeFn<{
+        active: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+        disabled: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+    description: RuntimeFn<{
+        disabled: {
+            true: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+    content: RuntimeFn<{
+        open: {
+            true: {
+                overflow: "visible";
+                maxHeight: "unset";
+                marginTop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
+    }>;
+};
+
+export { sideNavigationStyles };

package/dist/packages/navigation/sideNavigation/rarui-sideNavigation.css.js

@@ -0,0 +1 @@
+import"./../../../themes/globals.css";import"./rarui-sideNavigation.css";import{c as a}from"../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";a({defaultClassName:"rarui-sideNavigation_item__1ce544k7",variantClassNames:{level:{0:"rarui-sideNavigation_item_level_0__1ce544k8",1:"rarui-sideNavigation_item_level_1__1ce544k9",2:"rarui-sideNavigation_item_level_2__1ce544ka"}},defaultVariants:{},compoundVariants:[]});var e={sideNavigation:a({defaultClassName:"rarui-sideNavigation__1ce544k0",variantClassNames:{active:{true:"rarui-sideNavigation_active_true__1ce544k1"}},defaultVariants:{},compoundVariants:[]}),item:a({defaultClassName:"rarui-sideNavigation_item__1ce544k7",variantClassNames:{level:{0:"rarui-sideNavigation_item_level_0__1ce544k8",1:"rarui-sideNavigation_item_level_1__1ce544k9",2:"rarui-sideNavigation_item_level_2__1ce544ka"}},defaultVariants:{},compoundVariants:[]}),name:a({defaultClassName:"rarui-sideNavigation_name__1ce544k2",variantClassNames:{active:{true:"rarui-sideNavigation_name_active_true__1ce544k3"},disabled:{true:"rarui-sideNavigation_name_disabled_true__1ce544k4"}},defaultVariants:{},compoundVariants:[]}),description:a({defaultClassName:"rarui-sideNavigation_description__1ce544k5",variantClassNames:{disabled:{true:"rarui-sideNavigation_description_disabled_true__1ce544k6"}},defaultVariants:{},compoundVariants:[]}),content:a({defaultClassName:"rarui-sideNavigation_content__1ce544kb",variantClassNames:{open:{true:"rarui-sideNavigation_content_open_true__1ce544kc"}},defaultVariants:{},compoundVariants:[]})};export{e as sideNavigationStyles};

package/dist/packages/navigation/sideNavigation/rarui-sideNavigation.types.d.ts

@@ -0,0 +1,6 @@
+import { RecipeVariants } from '../../../node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.cjs.d.js';
+import { sideNavigationStyles } from './rarui-sideNavigation.css.js';
+
+type SideNavigationVariants = NonNullable<RecipeVariants<typeof sideNavigationStyles.sideNavigation> & RecipeVariants<typeof sideNavigationStyles.item>>;
+
+export type { SideNavigationVariants };