@waveso/ui 0.13.0 → 0.14.0

package/dist/badge.d.ts

@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/badge.d.ts
 declare const badgeVariants: (props?: ({
-  variant?: "default" | "outline" | "link" | "success" | "destructive" | "warning" | "secondary" | "ghost" | null | undefined;
+  variant?: "default" | "link" | "outline" | "success" | "warning" | "secondary" | "ghost" | "destructive" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type BadgeProps = useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>;
 declare function Badge({

package/dist/button.d.ts

@@ -6,8 +6,8 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
 
 //#region src/button.d.ts
 declare const buttonVariants: (props?: ({
-  variant?: "default" | "outline" | "link" | "destructive" | "secondary" | "ghost" | null | undefined;
-  size?: "default" | "sm" | "xs" | "icon" | "lg" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+  variant?: "default" | "link" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
+  size?: "default" | "sm" | "lg" | "xs" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type ButtonProps = React.ComponentProps<typeof Button$1> & VariantProps<typeof buttonVariants>;
 declare function Button({

package/dist/input-group.d.ts

@@ -1,4 +1,5 @@
 import { Button } from "./button.js";
+import { Input } from "./input.js";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import * as React from "react";
 import { VariantProps } from "class-variance-authority";
@@ -11,7 +12,7 @@ type InputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, "size" |
   type?: "button" | "submit" | "reset";
 };
 type InputGroupTextProps = React.ComponentProps<"span">;
-type InputGroupInputProps = React.ComponentProps<"input">;
+type InputGroupInputProps = React.ComponentProps<typeof Input>;
 type InputGroupTextareaProps = React.ComponentProps<"textarea">;
 declare function InputGroup({
   className,

package/dist/input.d.ts

@@ -1,13 +1,19 @@
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 import * as React from "react";
+import { VariantProps } from "class-variance-authority";
 import { Input as Input$1 } from "@base-ui/react/input";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
 
 //#region src/input.d.ts
-type InputProps = React.ComponentProps<typeof Input$1>;
+declare const inputVariants: (props?: ({
+  size?: "default" | "sm" | "lg" | "xs" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+type InputProps = Omit<React.ComponentProps<typeof Input$1>, "size"> & VariantProps<typeof inputVariants>;
 declare function Input({
   className,
   type,
+  size,
   ...props
 }: InputProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Input, type InputProps };
+export { Input, type InputProps, inputVariants };

package/dist/input.js

@@ -1,14 +1,25 @@
 import { cn } from "./lib/utils.js";
 import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
 import { Input as Input$1 } from "@base-ui/react/input";
 //#region src/input.tsx
-function Input({ className, type, ...props }) {
+const inputVariants = cva("dark:bg-edge/30 hover:bg-edge/50 dark:hover:bg-edge/50 border-edge focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/30 aria-invalid:border-destructive disabled:bg-edge/50 dark:disabled:bg-edge/80 placeholder:text-soft flex w-full min-w-0 items-center overflow-hidden rounded-md border bg-transparent motion-color outline-hidden file:inline-flex file:my-[3px] file:items-center file:me-3 file:cursor-clickable file:rounded-md file:border-0 file:bg-primary file:px-2.5 file:leading-none file:font-medium file:text-white file:motion-color file:hover:bg-primary/80 focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 aria-invalid:ring-3", {
+	variants: { size: {
+		xs: "h-6 rounded-sm px-2 text-xs file:-ms-[5px] file:h-4",
+		sm: "h-8 px-2.5 text-base file:-ms-[7px] file:h-6 md:text-sm",
+		default: "h-9 px-3 text-base file:-ms-[9px] file:h-7 md:text-sm",
+		lg: "h-10 px-3.5 text-base file:-ms-[11px] file:h-8"
+	} },
+	defaultVariants: { size: "default" }
+});
+function Input({ className, type, size = "default", ...props }) {
 	return /* @__PURE__ */ jsx(Input$1, {
 		type,
 		"data-slot": "input",
-		className: cn("dark:bg-edge/30 border-edge focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/30 aria-invalid:border-destructive disabled:bg-edge/50 dark:disabled:bg-edge/80 file:text-contrast placeholder:text-soft h-8 w-full min-w-0 rounded-md border bg-transparent px-2.5 py-1 text-base transition-colors outline-hidden file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm", className),
+		"data-size": size,
+		className: cn(inputVariants({ size }), className),
 		...props
 	});
 }
 //#endregion
-export { Input };
+export { Input, inputVariants };

package/dist/item.d.ts

@@ -11,7 +11,7 @@ declare const itemVariants: (props?: ({
   size?: "default" | "sm" | "xs" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare const itemMediaVariants: (props?: ({
-  variant?: "default" | "icon" | "image" | null | undefined;
+  variant?: "default" | "image" | "icon" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 type ItemGroupProps = React.ComponentProps<"div">;
 type ItemSeparatorProps = React.ComponentProps<typeof Separator>;

package/dist/styles.css

@@ -42,11 +42,14 @@
  * circular arc: softer, friendlier. It composes with `border-radius` and
  * respects borders / rings / shadows, and degrades to normal rounding where
  * unsupported (Chrome 2025+ today; Safari/Firefox pending). Pills and circles
- * opt back out — a squircled circle reads as an app icon, not an avatar. */
+ * opt back out — a squircled circle reads as an app icon, not an avatar.
+ * `::file-selector-button` is listed too — `*` doesn't match pseudo-elements,
+ * so the file-input button would otherwise stay round at the squircle radius. */
 @layer base {
   *,
   ::before,
-  ::after {
+  ::after,
+  ::file-selector-button {
     corner-shape: squircle;
   }
   [class*="rounded-full"] {

package/dist/toast.d.ts

@@ -7,7 +7,7 @@ import * as _$_base_ui_react0 from "@base-ui/react";
 //#region src/toast.d.ts
 declare const toastRootClass = "bg-elevated text-contrast ring-contrast/10 rounded-md p-4 text-sm shadow-md ring-1 outline-hidden";
 declare const toastIconVariants: (props?: ({
-  type?: "success" | "warning" | "loading" | "info" | "error" | null | undefined;
+  type?: "loading" | "success" | "info" | "warning" | "error" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare const toastViewportVariants: (props?: ({
   position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | null | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@waveso/ui",
-  "version": "0.13.0",
+  "version": "0.14.0",
   "description": "Wave UI component library built on Base UI and Tailwind CSS",
   "type": "module",
   "sideEffects": [