@giddaa-housing/ui 0.1.0 → 1.1.0

package/dist/alert.js

@@ -1,152 +1,64 @@
-// src/components/ui/alert.tsx
-import { cva } from "class-variance-authority";
+import { t as cn } from "./cn-BI_4DMBf.js";
 import { X } from "lucide-react";
-
-// src/lib/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      "font-size": [
-        {
-          text: [
-            "gdt-display",
-            "gdt-h1",
-            "gdt-h2",
-            "gdt-h3",
-            "gdt-h4",
-            "gdt-h5",
-            "gdt-xl",
-            "gdt-lg",
-            "gdt-md",
-            "gdt-sm",
-            "gdt-xs",
-            "gdt-subtext",
-            "gdt-capitalized"
-          ]
-        }
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/components/ui/alert.tsx
 import { jsx } from "react/jsx-runtime";
-var alertVariants = cva(
-  "grid w-full grid-cols-[0_minmax(0,1fr)_auto] items-start gap-y-1 rounded-xl border-2 px-4 py-3.5 text-gdt-sm transition-[background-color,border-color,color,box-shadow] has-[>svg]:grid-cols-[1.25rem_minmax(0,1fr)_auto] has-[>svg]:gap-x-3 [&>svg]:col-start-1 [&>svg]:row-span-2 [&>svg]:mt-0.5 [&>svg]:size-5 [&>svg]:text-current",
-  {
-    variants: {
-      variant: {
-        success: "border-status-success bg-surface-brand-subtle text-status-success",
-        info: "border-status-info bg-surface text-status-info",
-        warning: "border-status-warning bg-surface-accent-subtle text-status-warning",
-        error: "border-status-danger bg-surface-danger-subtle text-status-danger"
-      }
-    },
-    defaultVariants: {
-      variant: "info"
-    }
-  }
-);
-function Alert({
-  className,
-  variant = "info",
-  liveRegion,
-  role,
-  ...props
-}) {
-  const resolvedVariant = variant ?? "info";
-  const resolvedRole = role ?? (liveRegion === "off" ? void 0 : getAlertRole(resolvedVariant));
-  const resolvedLiveRegion = liveRegion === "off" ? void 0 : liveRegion ?? (resolvedVariant === "error" ? "assertive" : "polite");
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "alert",
-      "data-variant": resolvedVariant,
-      role: resolvedRole,
-      "aria-live": resolvedLiveRegion,
-      className: cn(alertVariants({ variant: resolvedVariant }), className),
-      ...props
-    }
-  );
+import { cva } from "class-variance-authority";
+//#region src/alert.tsx
+const alertVariants = cva("grid w-full grid-cols-[0_minmax(0,1fr)_auto] items-start gap-y-1 rounded-xl border-2 px-4 py-3.5 text-gdt-sm transition-[background-color,border-color,color,box-shadow] has-[>svg]:grid-cols-[1.25rem_minmax(0,1fr)_auto] has-[>svg]:gap-x-3 [&>svg]:col-start-1 [&>svg]:row-span-2 [&>svg]:mt-0.5 [&>svg]:size-5 [&>svg]:text-current", {
+	variants: { variant: {
+		success: "border-status-success bg-surface-brand-subtle text-status-success",
+		info: "border-status-info bg-surface text-status-info",
+		warning: "border-status-warning bg-surface-accent-subtle text-status-warning",
+		error: "border-status-danger bg-surface-danger-subtle text-status-danger"
+	} },
+	defaultVariants: { variant: "info" }
+});
+function Alert({ className, variant = "info", liveRegion, role, ...props }) {
+	const resolvedVariant = variant ?? "info";
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert",
+		"data-variant": resolvedVariant,
+		role: role ?? (liveRegion === "off" ? void 0 : getAlertRole(resolvedVariant)),
+		"aria-live": liveRegion === "off" ? void 0 : liveRegion ?? (resolvedVariant === "error" ? "assertive" : "polite"),
+		className: cn(alertVariants({ variant: resolvedVariant }), className),
+		...props
+	});
 }
 function AlertTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "alert-title",
-      className: cn(
-        "col-start-2 row-start-1 font-extrabold text-fg-primary",
-        className
-      ),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-title",
+		className: cn("col-start-2 row-start-1 font-extrabold text-fg-primary", className),
+		...props
+	});
 }
-function AlertDescription({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "alert-description",
-      className: cn(
-        "col-start-2 row-start-2 text-fg-secondary [&_p]:leading-relaxed",
-        className
-      ),
-      ...props
-    }
-  );
+function AlertDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-description",
+		className: cn("col-start-2 row-start-2 text-fg-secondary [&_p]:leading-relaxed", className),
+		...props
+	});
 }
 function AlertActions({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "alert-actions",
-      className: cn(
-        "col-start-2 row-start-3 mt-2 flex shrink-0 items-center gap-2 justify-self-start sm:col-start-3 sm:row-span-2 sm:row-start-1 sm:mt-[-0.125rem] sm:justify-self-end",
-        className
-      ),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-actions",
+		className: cn("col-start-2 row-start-3 mt-2 flex shrink-0 items-center gap-2 justify-self-start sm:col-start-3 sm:row-span-2 sm:row-start-1 sm:mt-[-0.125rem] sm:justify-self-end", className),
+		...props
+	});
 }
-function AlertClose({
-  className,
-  type = "button",
-  children,
-  "aria-label": ariaLabel = "Dismiss alert",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      "data-slot": "alert-close",
-      type,
-      className: cn(
-        "inline-flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-full border-0 bg-transparent p-0 text-fg-secondary transition-[background-color,color,box-shadow] hover:bg-surface-raised hover:text-fg-primary focus-visible:border-line-focus focus-visible:outline-none focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)]",
-        className
-      ),
-      "aria-label": ariaLabel,
-      ...props,
-      children: children ?? /* @__PURE__ */ jsx(X, { className: "size-4", "aria-hidden": "true" })
-    }
-  );
+function AlertClose({ className, type = "button", children, "aria-label": ariaLabel = "Dismiss alert", ...props }) {
+	return /* @__PURE__ */ jsx("button", {
+		"data-slot": "alert-close",
+		type,
+		className: cn("inline-flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-full border-0 bg-transparent p-0 text-fg-secondary transition-[background-color,color,box-shadow] hover:bg-surface-raised hover:text-fg-primary focus-visible:border-line-focus focus-visible:outline-none focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)]", className),
+		"aria-label": ariaLabel,
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(X, {
+			className: "size-4",
+			"aria-hidden": "true"
+		})
+	});
 }
 function getAlertRole(variant) {
-  return variant === "error" ? "alert" : "status";
+	return variant === "error" ? "alert" : "status";
 }
-export {
-  Alert,
-  AlertActions,
-  AlertClose,
-  AlertDescription,
-  AlertTitle,
-  alertVariants
-};
-//# sourceMappingURL=alert.js.map
+//#endregion
+export { Alert, AlertActions, AlertClose, AlertDescription, AlertTitle, alertVariants };

package/dist/auth-layout.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+//#region src/auth-layout.d.ts
+declare function AuthLayout({ className, ...props }: React.ComponentProps<"main">): React.JSX.Element;
+declare function AuthLayoutBrandPanel({ className, children, ...props }: React.ComponentProps<"section">): React.JSX.Element;
+declare function AuthLayoutBrandLogo({ children, className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutBrandContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutBrandTitle({ className, ...props }: React.ComponentProps<"h2">): React.JSX.Element;
+declare function AuthLayoutBrandDescription({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
+declare function AuthLayoutMedia({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutMediaItem({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutMain({ className, ...props }: React.ComponentProps<"section">): React.JSX.Element;
+declare function AuthLayoutCard({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutTopAction({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutMobileLogo({ children, className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutHeader({ className, ...props }: React.ComponentProps<"header">): React.JSX.Element;
+declare function AuthLayoutTitle({ className, ...props }: React.ComponentProps<"h1">): React.JSX.Element;
+declare function AuthLayoutDescription({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
+declare function AuthLayoutForm({ className, ...props }: React.ComponentProps<"form">): React.JSX.Element;
+declare function AuthLayoutActions({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutDivider({ children, className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AuthLayoutFooter({ className, ...props }: React.ComponentProps<"footer">): React.JSX.Element;
+//#endregion
+export { AuthLayout, AuthLayoutActions, AuthLayoutBrandContent, AuthLayoutBrandDescription, AuthLayoutBrandLogo, AuthLayoutBrandPanel, AuthLayoutBrandTitle, AuthLayoutCard, AuthLayoutDescription, AuthLayoutDivider, AuthLayoutFooter, AuthLayoutForm, AuthLayoutHeader, AuthLayoutMain, AuthLayoutMedia, AuthLayoutMediaItem, AuthLayoutMobileLogo, AuthLayoutTitle, AuthLayoutTopAction };

package/dist/auth-layout.js

@@ -0,0 +1,153 @@
+import { t as cn } from "./cn-BI_4DMBf.js";
+import { GiddaaLogo } from "./logo.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/auth-layout.tsx
+function AuthLayout({ className, ...props }) {
+	return /* @__PURE__ */ jsx("main", {
+		"data-slot": "auth-layout",
+		className: cn("grid min-h-svh bg-surface p-gdt-lg text-fg-primary lg:grid-cols-[minmax(0,1fr)_minmax(30rem,1fr)] lg:bg-surface-brand lg:p-0", className),
+		...props
+	});
+}
+function AuthLayoutBrandPanel({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx("section", {
+		"data-slot": "auth-layout-brand-panel",
+		className: cn("relative hidden min-h-svh overflow-hidden bg-surface-brand px-gdt-5xl py-gdt-5xl text-fg-on-brand lg:flex lg:flex-col", "before:absolute before:inset-0 before:bg-[radial-gradient(circle_at_20%_20%,rgb(255_255_255_/_0.12),transparent_24rem),radial-gradient(circle_at_80%_70%,rgb(0_0_0_/_0.14),transparent_28rem)] before:content-['']", "after:absolute after:inset-0 after:opacity-18 after:[background-image:radial-gradient(currentColor_0.7px,transparent_0.7px)] after:[background-size:7px_7px] after:content-['']", className),
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			className: "relative z-10 flex min-h-0 flex-1 flex-col",
+			children
+		})
+	});
+}
+function AuthLayoutBrandLogo({ children, className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-brand-logo",
+		className: cn("mb-gdt-3xl flex items-center text-fg-on-brand", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(GiddaaLogo, { className: "h-auto w-35" })
+	});
+}
+function AuthLayoutBrandContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-brand-content",
+		className: cn("max-w-[31rem]", className),
+		...props
+	});
+}
+function AuthLayoutBrandTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("h2", {
+		"data-slot": "auth-layout-brand-title",
+		className: cn("text-gdt-h1 text-balance", className),
+		...props
+	});
+}
+function AuthLayoutBrandDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "auth-layout-brand-description",
+		className: cn("mt-gdt-lg text-gdt-md text-pretty opacity-90", className),
+		...props
+	});
+}
+function AuthLayoutMedia({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-media",
+		className: cn("mt-auto grid h-58 grid-cols-3 items-end gap-gdt-lg pt-gdt-5xl", className),
+		...props
+	});
+}
+function AuthLayoutMediaItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-media-item",
+		className: cn("min-h-32 overflow-hidden rounded-t-4xl bg-surface-glass-overlay-container-1 shadow-3 odd:h-36 even:h-52", className),
+		...props
+	});
+}
+function AuthLayoutMain({ className, ...props }) {
+	return /* @__PURE__ */ jsx("section", {
+		"data-slot": "auth-layout-main",
+		className: cn("flex min-h-[calc(100svh-2rem)] items-stretch justify-center bg-canvas lg:min-h-svh lg:rounded-l-[5rem]", className),
+		...props
+	});
+}
+function AuthLayoutCard({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-card",
+		className: cn("flex w-full max-w-[26.5rem] flex-col border border-line-subtle bg-canvas px-gdt-lg py-gdt-2xl sm:px-gdt-2xl lg:max-w-[32rem] lg:border-0 lg:px-0 lg:py-gdt-5xl", className),
+		...props
+	});
+}
+function AuthLayoutTopAction({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-top-action",
+		className: cn("mb-gdt-4xl text-gdt-xs text-fg-secondary", className),
+		...props
+	});
+}
+function AuthLayoutMobileLogo({ children, className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-mobile-logo",
+		className: cn("mb-gdt-xl flex items-center text-fg-brand lg:hidden", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(GiddaaLogo, { className: "h-auto w-30" })
+	});
+}
+function AuthLayoutHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("header", {
+		"data-slot": "auth-layout-header",
+		className: cn("mb-gdt-xl flex flex-col gap-gdt-sm", className),
+		...props
+	});
+}
+function AuthLayoutTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("h1", {
+		"data-slot": "auth-layout-title",
+		className: cn("text-gdt-h2 text-fg-primary", className),
+		...props
+	});
+}
+function AuthLayoutDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "auth-layout-description",
+		className: cn("text-gdt-sm text-fg-secondary", className),
+		...props
+	});
+}
+function AuthLayoutForm({ className, ...props }) {
+	return /* @__PURE__ */ jsx("form", {
+		"data-slot": "auth-layout-form",
+		className: cn("flex flex-col gap-gdt-lg", className),
+		...props
+	});
+}
+function AuthLayoutActions({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "auth-layout-actions",
+		className: cn("flex flex-col gap-gdt-md", className),
+		...props
+	});
+}
+function AuthLayoutDivider({ children = "Or continue with", className, ...props }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "auth-layout-divider",
+		className: cn("relative flex items-center py-gdt-sm text-gdt-sm text-fg-secondary", className),
+		...props,
+		children: [
+			/* @__PURE__ */ jsx("div", { className: "h-px flex-1 bg-line-subtle" }),
+			/* @__PURE__ */ jsx("span", {
+				className: "px-gdt-md",
+				children
+			}),
+			/* @__PURE__ */ jsx("div", { className: "h-px flex-1 bg-line-subtle" })
+		]
+	});
+}
+function AuthLayoutFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("footer", {
+		"data-slot": "auth-layout-footer",
+		className: cn("mt-auto flex items-center justify-between gap-gdt-lg pt-gdt-5xl text-gdt-subtext text-fg-secondary", className),
+		...props
+	});
+}
+//#endregion
+export { AuthLayout, AuthLayoutActions, AuthLayoutBrandContent, AuthLayoutBrandDescription, AuthLayoutBrandLogo, AuthLayoutBrandPanel, AuthLayoutBrandTitle, AuthLayoutCard, AuthLayoutDescription, AuthLayoutDivider, AuthLayoutFooter, AuthLayoutForm, AuthLayoutHeader, AuthLayoutMain, AuthLayoutMedia, AuthLayoutMediaItem, AuthLayoutMobileLogo, AuthLayoutTitle, AuthLayoutTopAction };

package/dist/avatar.d.ts

@@ -1,14 +1,14 @@
-import { Avatar as Avatar$1 } from '@base-ui/react/avatar';
-import * as React from 'react';
-
+import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
+import * as React from "react";
+//#region src/avatar.d.ts
 type AvatarSize = "sm" | "md" | "lg";
 declare function Avatar({ className, size, ...props }: Avatar$1.Root.Props & {
-    size?: AvatarSize;
+  size?: AvatarSize;
 }): React.JSX.Element;
 declare function AvatarImage({ className, ...props }: Avatar$1.Image.Props): React.JSX.Element;
 declare function AvatarFallback({ className, ...props }: Avatar$1.Fallback.Props): React.JSX.Element;
 declare function AvatarStatus({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
 declare function AvatarGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare function AvatarGroupCount({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
-
-export { Avatar, AvatarStatus as AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, AvatarStatus };
+//#endregion
+export { Avatar, AvatarStatus as AvatarBadge, AvatarStatus, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };

package/dist/avatar.js

@@ -1,152 +1,50 @@
-// src/components/ui/avatar.tsx
-import { Avatar as AvatarPrimitive } from "@base-ui/react/avatar";
-
-// src/lib/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      "font-size": [
-        {
-          text: [
-            "gdt-display",
-            "gdt-h1",
-            "gdt-h2",
-            "gdt-h3",
-            "gdt-h4",
-            "gdt-h5",
-            "gdt-xl",
-            "gdt-lg",
-            "gdt-md",
-            "gdt-sm",
-            "gdt-xs",
-            "gdt-subtext",
-            "gdt-capitalized"
-          ]
-        }
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/components/ui/avatar.tsx
+"use client";
+import { t as cn } from "./cn-BI_4DMBf.js";
 import { jsx } from "react/jsx-runtime";
-function Avatar({
-  className,
-  size = "md",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Root,
-    {
-      "data-slot": "avatar",
-      "data-size": size,
-      className: cn(
-        "group/avatar relative flex shrink-0 rounded-full select-none bg-surface-brand",
-        size === "sm" && "size-8",
-        size === "md" && "size-10",
-        size === "lg" && "size-14",
-        className
-      ),
-      ...props
-    }
-  );
+import { Avatar as Avatar$1 } from "@base-ui/react/avatar";
+//#region src/avatar.tsx
+function Avatar({ className, size = "md", ...props }) {
+	return /* @__PURE__ */ jsx(Avatar$1.Root, {
+		"data-slot": "avatar",
+		"data-size": size,
+		className: cn("group/avatar relative flex shrink-0 rounded-full select-none bg-surface-brand", size === "sm" && "size-8", size === "md" && "size-10", size === "lg" && "size-14", className),
+		...props
+	});
 }
 function AvatarImage({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Image,
-    {
-      "data-slot": "avatar-image",
-      className: cn(
-        "aspect-square size-full rounded-full object-cover",
-        className
-      ),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx(Avatar$1.Image, {
+		"data-slot": "avatar-image",
+		className: cn("aspect-square size-full rounded-full object-cover", className),
+		...props
+	});
 }
-function AvatarFallback({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    AvatarPrimitive.Fallback,
-    {
-      "data-slot": "avatar-fallback",
-      className: cn(
-        "flex size-full items-center justify-center rounded-full",
-        "bg-surface-brand-subtle text-fg-brand font-semibold",
-        "group-data-[size=sm]/avatar:text-xs",
-        "group-data-[size=md]/avatar:text-sm",
-        "group-data-[size=lg]/avatar:text-base",
-        className
-      ),
-      ...props
-    }
-  );
+function AvatarFallback({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Avatar$1.Fallback, {
+		"data-slot": "avatar-fallback",
+		className: cn("flex size-full items-center justify-center rounded-full", "bg-surface-brand-subtle text-fg-brand font-semibold", "group-data-[size=sm]/avatar:text-xs", "group-data-[size=md]/avatar:text-sm", "group-data-[size=lg]/avatar:text-base", className),
+		...props
+	});
 }
 function AvatarStatus({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "data-slot": "avatar-status",
-      className: cn(
-        "absolute right-0 bottom-0 z-10 rounded-full bg-status-success ring-2 ring-canvas",
-        "group-data-[size=sm]/avatar:size-2",
-        "group-data-[size=md]/avatar:size-2.5",
-        "group-data-[size=lg]/avatar:size-3.5",
-        className
-      ),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "avatar-status",
+		className: cn("absolute right-0 bottom-0 z-10 rounded-full bg-status-success ring-2 ring-canvas", "group-data-[size=sm]/avatar:size-2", "group-data-[size=md]/avatar:size-2.5", "group-data-[size=lg]/avatar:size-3.5", className),
+		...props
+	});
 }
 function AvatarGroup({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "avatar-group",
-      className: cn(
-        "group/avatar-group flex -space-x-3",
-        "*:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-canvas",
-        className
-      ),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "avatar-group",
+		className: cn("group/avatar-group flex -space-x-3", "*:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-canvas", className),
+		...props
+	});
 }
-function AvatarGroupCount({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "avatar-group-count",
-      className: cn(
-        "relative flex shrink-0 items-center justify-center rounded-full",
-        "bg-action-tertiary text-fg-secondary text-xs font-semibold",
-        "ring-2 ring-canvas",
-        "size-10",
-        "group-has-data-[size=sm]/avatar-group:size-8",
-        "group-has-data-[size=lg]/avatar-group:size-14",
-        className
-      ),
-      ...props
-    }
-  );
+function AvatarGroupCount({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "avatar-group-count",
+		className: cn("relative flex shrink-0 items-center justify-center rounded-full", "bg-action-tertiary text-fg-secondary text-xs font-semibold", "ring-2 ring-canvas", "size-10", "group-has-data-[size=sm]/avatar-group:size-8", "group-has-data-[size=lg]/avatar-group:size-14", className),
+		...props
+	});
 }
-export {
-  Avatar,
-  AvatarStatus as AvatarBadge,
-  AvatarFallback,
-  AvatarGroup,
-  AvatarGroupCount,
-  AvatarImage,
-  AvatarStatus
-};
-//# sourceMappingURL=avatar.js.map
+//#endregion
+export { Avatar, AvatarStatus as AvatarBadge, AvatarStatus, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage };

package/dist/badge.d.ts

@@ -1,14 +1,13 @@
-import * as React from 'react';
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import { useRender } from '@base-ui/react/use-render';
-import { VariantProps } from 'class-variance-authority';
-
+import { useRender } from "@base-ui/react/use-render";
+import { VariantProps } from "class-variance-authority";
+//#region src/badge.d.ts
 declare const badgeVariants: (props?: ({
-    variant?: "success" | "info" | "warning" | "default" | "danger" | "secondary" | "destructive" | "outline" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
-    shape?: "box" | "round" | null | undefined;
-    border?: boolean | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Badge({ className, variant, size, shape, border, render, ...props }: useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
-
-export { Badge, badgeVariants };
+  variant?: "accent" | "danger" | "default" | "destructive" | "info" | "outline" | "secondary" | "success" | "warning" | null | undefined;
+  size?: "lg" | "md" | "sm" | null | undefined;
+  shape?: "box" | "round" | null | undefined;
+  border?: boolean | null | undefined;
+  iconOnly?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Badge({ className, variant, size, shape, border, iconOnly, render, children, ...props }: useRender.ComponentProps<"span"> & VariantProps<typeof badgeVariants>): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+//#endregion
+export { Badge, badgeVariants };