@ropav/styles 0.3.0 → 0.5.0

package/dist/components/card.css

@@ -4,7 +4,7 @@
 .card {
   @apply relative flex flex-col gap-3 overflow-visible p-4;
   @apply shadow-surface;
-  border-radius: min(32px, var(--radius-3xl));
+  border-radius: min(32px, var(--component-radius));
 }
 
 /* Element - header */
@@ -40,12 +40,33 @@
 
 .card--default {
   @apply bg-surface;
+
+  /* Forced Colors Mode flattens the fill onto the page and strips the shadow, so the container
+   * stops having any shape and its contents sit loose on the page. */
+  @media (forced-colors: active) {
+    outline: 1px solid CanvasText;
+    outline-offset: -1px;
+  }
 }
 
 .card--secondary {
   @apply bg-surface-secondary;
+
+  /* Forced Colors Mode flattens the fill onto the page and strips the shadow, so the container
+   * stops having any shape and its contents sit loose on the page. */
+  @media (forced-colors: active) {
+    outline: 1px solid CanvasText;
+    outline-offset: -1px;
+  }
 }
 
 .card--tertiary {
   @apply bg-surface-tertiary;
+
+  /* Forced Colors Mode flattens the fill onto the page and strips the shadow, so the container
+   * stops having any shape and its contents sit loose on the page. */
+  @media (forced-colors: active) {
+    outline: 1px solid CanvasText;
+    outline-offset: -1px;
+  }
 }

package/dist/components/chip.css

@@ -8,6 +8,19 @@
 
   background-color: var(--chip-bg);
   color: var(--chip-fg);
+
+  /* A chip is nothing but its colour, so Forced Colors Mode leaves it as bare label text -
+   * not a weaker chip, no chip at all, indistinguishable from the copy around it. The edge
+   * brings the shape back.
+   *
+   * What cannot come back is the status. The mode has no keyword for success or warning, so
+   * every colour collapses onto one appearance and the label is what has to carry the
+   * meaning - which is the same reason a chip should not lean on colour alone in the first
+   * place. Only the emphasis split survives, on `.chip--primary` below. */
+  @media (forced-colors: active) {
+    outline: 1px solid CanvasText;
+    outline-offset: -1px;
+  }
 }
 
 .chip__label {
@@ -37,6 +50,14 @@
 
 /* Variant styles */
 .chip--primary {
+  /* The one distinction worth keeping: solid against outlined. `forced-color-adjust` is what
+   * makes it readable - without it Chromium paints a `Canvas` backplate over this fill and the
+   * label goes with it. */
+  @media (forced-colors: active) {
+    forced-color-adjust: none;
+    background-color: CanvasText;
+    color: Canvas;
+  }
 }
 
 .chip--secondary {

package/dist/components/close-button.css

@@ -47,6 +47,14 @@
 .close-button--default {
   @apply bg-default text-muted;
 
+  /* Forced Colors Mode flattens the fill onto the page and strips the shadow, leaving a control
+   * with nothing to say it is one. `ButtonBorder` is the keyword the platform uses for a
+   * control's edge. */
+  @media (forced-colors: active) {
+    outline: 1px solid ButtonBorder;
+    outline-offset: -1px;
+  }
+
   &:active,
   &[data-pressed="true"] {
   }

package/dist/components/color-input-group/color-input-group.styles.d.ts

@@ -6,6 +6,15 @@ export declare const colorInputGroupVariants: import("tailwind-variants").TVRetu
             base: string;
         };
     };
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {};
+        sm: {
+            base: string;
+        };
+    };
     variant: {
         primary: {
             base: string;
@@ -26,6 +35,15 @@ export declare const colorInputGroupVariants: import("tailwind-variants").TVRetu
             base: string;
         };
     };
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {};
+        sm: {
+            base: string;
+        };
+    };
     variant: {
         primary: {
             base: string;
@@ -46,6 +64,15 @@ export declare const colorInputGroupVariants: import("tailwind-variants").TVRetu
             base: string;
         };
     };
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {};
+        sm: {
+            base: string;
+        };
+    };
     variant: {
         primary: {
             base: string;

package/dist/components/color-input-group/color-input-group.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-input-group.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-input-group/color-input-group.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,uBAAuB;;QAa9B,KAAK;QACL,IAAI;YACF,IAAI;;;;QAIN,OAAO;YACL,IAAI;;QAEN,SAAS;YACP,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,uBAAuB,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,CAAC"}
+{"version":3,"file":"color-input-group.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-input-group/color-input-group.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,uBAAuB;;QAc9B,KAAK;QACL,IAAI;YACF,IAAI;;;;QAIN,EAAE;YACA,IAAI;;QAEN,EAAE;QACF,EAAE;YACA,IAAI;;;;QAIN,OAAO;YACL,IAAI;;QAEN,SAAS;YACP,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,uBAAuB,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,CAAC"}

package/dist/components/color-input-group/color-input-group.styles.js

@@ -3,6 +3,7 @@ import { tv } from "tailwind-variants";
 const colorInputGroupVariants = tv({
 	defaultVariants: {
 		fullWidth: false,
+		size: "md",
 		variant: "primary"
 	},
 	slots: {
@@ -16,6 +17,11 @@ const colorInputGroupVariants = tv({
 			false: {},
 			true: { base: "color-input-group--full-width" }
 		},
+		size: {
+			lg: { base: "color-input-group--lg" },
+			md: {},
+			sm: { base: "color-input-group--sm" }
+		},
 		variant: {
 			primary: { base: "color-input-group--primary" },
 			secondary: { base: "color-input-group--secondary" }

package/dist/components/color-input-group.css

@@ -8,6 +8,15 @@
   border-width: var(--border-width-field);
   border-color: var(--field-border);
 
+  /* Forced Colors Mode flattens the fill onto the page and strips the shadow, leaving a field that
+   * reads as bare text - `--border-width-field` is 0, so the declared border brings nothing back on
+   * its own. An outline rather than a width so nothing shifts, and the focus ring replaces it while
+   * focused, which is the right order of importance. */
+  @media (forced-colors: active) {
+    outline: 1px solid ButtonBorder;
+    outline-offset: -1px;
+  }
+
   /**
    * Transitions
    * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
@@ -52,7 +61,7 @@
    ========================================================================== */
 
 .color-input-group__input {
-  @apply flex h-full flex-1 cursor-text items-center rounded-none border-0 bg-transparent px-3 py-2 text-base shadow-none outline-none sm:text-sm;
+  @apply flex h-full flex-1 cursor-text items-center rounded-none border-0 bg-transparent px-3 field-line-md shadow-none outline-none;
 
   /* Placeholder styling */
   &::placeholder {
@@ -133,3 +142,23 @@
 .color-input-group--full-width {
   @apply w-full;
 }
+
+/* ==========================================================================
+   Size variants
+   ========================================================================== */
+
+.color-input-group--sm {
+  @apply h-8;
+
+  .color-input-group__input {
+    @apply field-line-sm;
+  }
+}
+
+.color-input-group--lg {
+  @apply h-10;
+
+  .color-input-group__input {
+    @apply field-line-lg;
+  }
+}

package/dist/components/color-swatch-picker.css

@@ -14,6 +14,13 @@
 .color-swatch-picker__item {
   @apply relative flex size-8 items-center justify-center rounded-2xl border-2 border-transparent outline-none no-highlight;
 
+  /* The unselected border is transparent purely to hold the ring's width, and forced colors turns
+   * a transparent border-color opaque - so every swatch drew the same border and the selected one
+   * stopped being the selected one. */
+  @media (forced-colors: active) {
+    border-color: Canvas;
+  }
+
   /* Cursor */
   cursor: var(--cursor-interactive);
 
@@ -41,6 +48,10 @@
   &[data-selected="true"] {
     border-color: var(--color-swatch-current);
     box-shadow: var(--field-shadow);
+
+    @media (forced-colors: active) {
+      border-color: Highlight;
+    }
     /* Shrink the swatch to reveal the white gap */
     .color-swatch-picker__swatch {
       transform: scale(0.77);

package/dist/components/combo-box/combo-box.styles.d.ts

@@ -7,6 +7,15 @@ export declare const comboBoxVariants: import("tailwind-variants").TVReturnType<
             inputGroup: string;
         };
     };
+    size: {
+        lg: {
+            popover: string;
+        };
+        md: {};
+        sm: {
+            popover: string;
+        };
+    };
 }, {
     base: string;
     inputGroup: string;
@@ -21,6 +30,15 @@ export declare const comboBoxVariants: import("tailwind-variants").TVReturnType<
             inputGroup: string;
         };
     };
+    size: {
+        lg: {
+            popover: string;
+        };
+        md: {};
+        sm: {
+            popover: string;
+        };
+    };
 }, {
     base: string;
     inputGroup: string;
@@ -35,6 +53,15 @@ export declare const comboBoxVariants: import("tailwind-variants").TVReturnType<
             inputGroup: string;
         };
     };
+    size: {
+        lg: {
+            popover: string;
+        };
+        md: {};
+        sm: {
+            popover: string;
+        };
+    };
 }, {
     base: string;
     inputGroup: string;

package/dist/components/combo-box/combo-box.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combo-box.styles.d.ts","sourceRoot":"","sources":["../../../src/components/combo-box/combo-box.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,gBAAgB;;QAavB,KAAK;QACL,IAAI;YACF,IAAI;YACJ,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIhB,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
+{"version":3,"file":"combo-box.styles.d.ts","sourceRoot":"","sources":["../../../src/components/combo-box/combo-box.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,gBAAgB;;QAcvB,KAAK;QACL,IAAI;YACF,IAAI;YACJ,UAAU;;;;QAMZ,EAAE;YACA,OAAO;;QAET,EAAE;QACF,EAAE;YACA,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIb,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC"}

package/dist/components/combo-box/combo-box.styles.js

@@ -1,7 +1,10 @@
 import { tv } from "tailwind-variants";
 //#region src/components/combo-box/combo-box.styles.ts
 const comboBoxVariants = tv({
-	defaultVariants: { fullWidth: false },
+	defaultVariants: {
+		fullWidth: false,
+		size: "md"
+	},
 	slots: {
 		base: "combo-box",
 		inputGroup: "combo-box__input-group",
@@ -9,13 +12,20 @@ const comboBoxVariants = tv({
 		trigger: "combo-box__trigger",
 		value: "combo-box__value"
 	},
-	variants: { fullWidth: {
-		false: {},
-		true: {
-			base: "combo-box--full-width",
-			inputGroup: "combo-box__input-group--full-width"
+	variants: {
+		fullWidth: {
+			false: {},
+			true: {
+				base: "combo-box--full-width",
+				inputGroup: "combo-box__input-group--full-width"
+			}
+		},
+		size: {
+			lg: { popover: "combo-box__popover--lg" },
+			md: {},
+			sm: { popover: "combo-box__popover--sm" }
 		}
-	} }
+	}
 });
 //#endregion
 export { comboBoxVariants };

package/dist/components/combo-box.css

@@ -100,7 +100,7 @@
 /* Similar to popover content styles */
 .combo-box__popover {
   @apply min-w-(--trigger-width) origin-(--trigger-anchor-point) scroll-py-1 scrollbar overflow-y-auto overscroll-contain bg-overlay p-0 text-sm;
-  border-radius: min(32px, var(--radius-3xl));
+  border-radius: min(32px, var(--component-radius));
   box-shadow: var(--shadow-overlay);
 
   /* Focus state */
@@ -174,6 +174,26 @@
   }
 }
 
+/* ==========================================================================
+   Size variants
+   ========================================================================== */
+
+/* The input inside sizes itself from the context the root provides, so only the option rows are
+ * left - reached from the popover's own class, since it is teleported out of this tree. */
+.combo-box__popover--sm {
+  [data-slot="list-box-item"] {
+    @apply min-h-8 py-1;
+  }
+}
+
+.combo-box__popover--lg {
+  @apply text-base;
+
+  [data-slot="list-box-item"] {
+    @apply min-h-10 py-2;
+  }
+}
+
 /* Full width modifier */
 .combo-box--full-width {
   @apply w-full;

package/dist/components/date-input-group/date-input-group.styles.d.ts

@@ -6,6 +6,15 @@ export declare const dateInputGroupVariants: import("tailwind-variants").TVRetur
             base: string;
         };
     };
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {};
+        sm: {
+            base: string;
+        };
+    };
     variant: {
         primary: {
             base: string;
@@ -28,6 +37,15 @@ export declare const dateInputGroupVariants: import("tailwind-variants").TVRetur
             base: string;
         };
     };
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {};
+        sm: {
+            base: string;
+        };
+    };
     variant: {
         primary: {
             base: string;
@@ -50,6 +68,15 @@ export declare const dateInputGroupVariants: import("tailwind-variants").TVRetur
             base: string;
         };
     };
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {};
+        sm: {
+            base: string;
+        };
+    };
     variant: {
         primary: {
             base: string;

package/dist/components/date-input-group/date-input-group.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-input-group.styles.d.ts","sourceRoot":"","sources":["../../../src/components/date-input-group/date-input-group.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,sBAAsB;;QAe7B,KAAK;QACL,IAAI;YACF,IAAI;;;;QAIN,OAAO;YACL,IAAI;;QAEN,SAAS;YACP,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,sBAAsB,CAAC,CAAC"}
+{"version":3,"file":"date-input-group.styles.d.ts","sourceRoot":"","sources":["../../../src/components/date-input-group/date-input-group.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,sBAAsB;;QAgB7B,KAAK;QACL,IAAI;YACF,IAAI;;;;QAIN,EAAE;YACA,IAAI;;QAEN,EAAE;QACF,EAAE;YACA,IAAI;;;;QAIN,OAAO;YACL,IAAI;;QAEN,SAAS;YACP,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,sBAAsB,CAAC,CAAC"}

package/dist/components/date-input-group/date-input-group.styles.js

@@ -3,6 +3,7 @@ import { tv } from "tailwind-variants";
 const dateInputGroupVariants = tv({
 	defaultVariants: {
 		fullWidth: false,
+		size: "md",
 		variant: "primary"
 	},
 	slots: {
@@ -18,6 +19,11 @@ const dateInputGroupVariants = tv({
 			false: {},
 			true: { base: "date-input-group--full-width" }
 		},
+		size: {
+			lg: { base: "date-input-group--lg" },
+			md: {},
+			sm: { base: "date-input-group--sm" }
+		},
 		variant: {
 			primary: { base: "date-input-group--primary" },
 			secondary: { base: "date-input-group--secondary" }

package/dist/components/date-input-group.css

@@ -4,6 +4,15 @@
   border-width: var(--border-width-field);
   border-color: var(--field-border);
 
+  /* Forced Colors Mode flattens the fill onto the page and strips the shadow, leaving a field that
+   * reads as bare text - `--border-width-field` is 0, so the declared border brings nothing back on
+   * its own. An outline rather than a width so nothing shifts, and the focus ring replaces it while
+   * focused, which is the right order of importance. */
+  @media (forced-colors: active) {
+    outline: 1px solid ButtonBorder;
+    outline-offset: -1px;
+  }
+
   /**
    * Transitions
    * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
@@ -58,7 +67,7 @@
 }
 
 .date-input-group__input {
-  @apply flex flex-1 cursor-text items-center gap-px rounded-none border-0 bg-transparent px-3 py-2 text-base shadow-none outline-none sm:text-sm;
+  @apply flex flex-1 cursor-text items-center gap-px rounded-none border-0 bg-transparent px-3 field-line-md shadow-none outline-none;
 
   /* Remove border radius on left side when prefix is present */
   .date-input-group:has([data-slot="date-input-group-prefix"]) & {
@@ -180,3 +189,23 @@
 .date-input-group--full-width {
   @apply w-full;
 }
+
+/* ==========================================================================
+   Size variants
+   ========================================================================== */
+
+.date-input-group--sm {
+  @apply h-8;
+
+  .date-input-group__input {
+    @apply field-line-sm;
+  }
+}
+
+.date-input-group--lg {
+  @apply h-10;
+
+  .date-input-group__input {
+    @apply field-line-lg;
+  }
+}

package/dist/components/dropdown/dropdown.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.styles.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAO3B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
+{"version":3,"file":"dropdown.styles.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAS3B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC"}

package/dist/components/dropdown/dropdown.styles.js

@@ -1,7 +1,7 @@
 import { tv } from "tailwind-variants";
 //#region src/components/dropdown/dropdown.styles.ts
 const dropdownVariants = tv({ slots: {
-	menu: "dropdown__menu",
+	menu: "menu dropdown__menu",
 	popover: "dropdown__popover",
 	root: "dropdown",
 	trigger: "dropdown__trigger"

package/dist/components/dropdown.css

@@ -10,6 +10,18 @@
   @apply inline-block;
   /* Only visible when using a custom trigger  - not passing "Button" as a child - hence we use some button styles (custom trigger) */
   @apply outline-none;
+
+  /* A custom trigger borrows the button's look by wearing its classes, and the `outline-none`
+   * above lands later in the cascade than the button's own forced-colors edge, stripping it back
+   * off. Handed back here rather than on the bare trigger: when a `Button` is passed as a child
+   * instead, this element is only a wrapper around it and an outline would draw a second ring
+   * around the real one. */
+  &.button {
+    @media (forced-colors: active) {
+      outline: 1px solid ButtonBorder;
+      outline-offset: -1px;
+    }
+  }
   /**
    * Transitions
    * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
@@ -50,7 +62,7 @@
 /* Similar to select popover styles */
 .dropdown__popover {
   @apply max-w-[48svw] origin-(--trigger-anchor-point) scroll-py-1 scrollbar overflow-y-auto overscroll-contain bg-overlay p-0 text-sm will-change-transform md:min-w-55;
-  border-radius: min(32px, var(--radius-3xl));
+  border-radius: min(32px, var(--component-radius));
   box-shadow: var(--shadow-overlay);
 
   /* Focus state */
@@ -109,21 +121,14 @@
     rotate: 90deg;
   }
 
-  /* Menu styles */
+  /* Menu styles. The block itself is `.menu`; these are the dropdown's departures from it, and
+   * they sit here rather than on `.dropdown__menu` because `menu.css` is imported after this file
+   * and would otherwise win at equal specificity. */
   [data-slot="dropdown-menu"] {
-    @apply p-1.5 outline-none;
+    @apply gap-0.5 p-1.5 outline-none;
   }
 
   [data-slot="menu-item"] {
     @apply px-2.5;
   }
 }
-
-.dropdown__menu {
-  @apply relative flex w-full flex-col gap-0.5 overflow-clip p-1;
-
-  /* This makes the separator take up 94% of the width and be centered */
-  [data-slot="separator"] {
-    @apply ms-[3%] w-[94%];
-  }
-}

package/dist/components/index.css

@@ -30,6 +30,7 @@
 @import "./disclosure.css";
 @import "./link.css";
 @import "./pagination.css";
+@import "./sidebar.css";
 @import "./tabs.css";
 
 /* ------------------------------------------------------------------------------------------------
@@ -68,6 +69,7 @@
 /* ------------------------------------------------------------------------------------------------
  * Controls
  * ------------------------------------------------------------------------------------------------ */
+@import "./segmented-control.css";
 @import "./slider.css";
 @import "./switch.css";
 @import "./switch-group.css";
@@ -125,6 +127,7 @@
 @import "./card.css";
 @import "./header.css";
 @import "./separator.css";
+@import "./splitter.css";
 @import "./surface.css";
 
 /* ------------------------------------------------------------------------------------------------
@@ -158,3 +161,4 @@
  * Utilities
  * ------------------------------------------------------------------------------------------------ */
 @import "./scroll-shadow.css";
+@import "./virtualizer.css";

package/dist/components/index.d.ts

@@ -60,11 +60,14 @@ export * from "./radio";
 export * from "./radio-group";
 export * from "./scroll-shadow";
 export * from "./search-field";
+export * from "./segmented-control";
 export * from "./select";
 export * from "./separator";
+export * from "./sidebar";
 export * from "./skeleton";
 export * from "./slider";
 export * from "./spinner";
+export * from "./splitter";
 export * from "./surface";
 export * from "./switch";
 export * from "./switch-group";
@@ -81,4 +84,5 @@ export * from "./toggle-button";
 export * from "./toggle-button-group";
 export * from "./toolbar";
 export * from "./tooltip";
+export * from "./virtualizer";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC"}

package/dist/components/input/input.styles.d.ts

@@ -4,6 +4,11 @@ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
         false: "";
         true: "input--full-width";
     };
+    size: {
+        lg: "input--lg";
+        md: "";
+        sm: "input--sm";
+    };
     variant: {
         primary: "input--primary";
         secondary: "input--secondary";
@@ -13,6 +18,11 @@ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
         false: "";
         true: "input--full-width";
     };
+    size: {
+        lg: "input--lg";
+        md: "";
+        sm: "input--sm";
+    };
     variant: {
         primary: "input--primary";
         secondary: "input--secondary";
@@ -22,6 +32,11 @@ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
         false: "";
         true: "input--full-width";
     };
+    size: {
+        lg: "input--lg";
+        md: "";
+        sm: "input--sm";
+    };
     variant: {
         primary: "input--primary";
         secondary: "input--secondary";

package/dist/components/input/input.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.styles.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;cAgBxB,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}
+{"version":3,"file":"input.styles.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAsBxB,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}