@lglab/compose-ui 0.28.0 → 0.29.0

package/dist/avatar.js

@@ -1,81 +1,68 @@
-"use client";
-import { jsx as a, jsxs as u } from "react/jsx-runtime";
-import { Avatar as n } from "@base-ui/react/avatar";
-import { cva as A } from "class-variance-authority";
-import * as f from "react";
-import { c as s } from "./utils-B6yFEsav.js";
-const v = A(
-  [
-    "relative flex shrink-0 items-center justify-center overflow-hidden rounded-full",
-    "bg-muted text-foreground",
-    "border-2 border-background"
-  ],
-  {
-    variants: {
-      size: {
-        sm: "size-8 text-xs",
-        default: "size-10 text-sm",
-        lg: "size-12 text-base"
-      }
-    },
-    defaultVariants: {
-      size: "default"
-    }
-  }
-), h = ({ className: t, size: e, ...l }) => /* @__PURE__ */ a(n.Root, { className: s(v({ size: e }), t), ...l });
-h.displayName = "AvatarRoot";
-const g = ({ className: t, ...e }) => /* @__PURE__ */ a(
-  n.Image,
-  {
-    className: s("aspect-square h-full w-full object-cover", t),
-    ...e
-  }
-);
-g.displayName = "AvatarImage";
-const y = ({ className: t, ...e }) => /* @__PURE__ */ a(
-  n.Fallback,
-  {
-    className: s(
-      "flex h-full w-full items-center justify-center font-medium",
-      t
-    ),
-    ...e
-  }
-);
-y.displayName = "AvatarFallback";
-const z = ({
-  "aria-label": t,
-  maxVisible: e,
-  className: l,
-  children: p
-}) => {
-  const o = f.Children.toArray(p), i = o.length, c = e !== void 0 ? Math.min(e, i) : i, d = i - c, b = o.slice(0, c), x = (() => {
-    const r = o[0];
-    return f.isValidElement(r) && r.type === h ? r.props.size ?? "default" : "default";
-  })();
-  return /* @__PURE__ */ u("ul", { "aria-label": t, className: s("flex -space-x-2", l), children: [
-    b.map((r, m) => /* @__PURE__ */ a("li", { children: r }, m)),
-    d > 0 && /* @__PURE__ */ a("li", { children: /* @__PURE__ */ u(
-      "span",
-      {
-        className: s(
-          "relative flex shrink-0 items-center justify-center overflow-hidden rounded-full",
-          "bg-muted text-foreground border-2 border-background",
-          "font-medium",
-          v({ size: x })
-        ),
-        children: [
-          "+",
-          d
-        ]
-      }
-    ) })
-  ] });
+'use client';
+
+import { cn } from "./lib/utils.js";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Avatar } from "@base-ui/react/avatar";
+
+//#region src/components/avatar.tsx
+const avatarVariants = cva([
+	"relative flex shrink-0 items-center justify-center overflow-hidden rounded-full",
+	"bg-muted text-foreground",
+	"border-2 border-background"
+], {
+	variants: { size: {
+		sm: "size-8 text-xs",
+		default: "size-10 text-sm",
+		lg: "size-12 text-base"
+	} },
+	defaultVariants: { size: "default" }
+});
+const AvatarRoot = ({ className, size, ...props }) => {
+	return /* @__PURE__ */ jsx(Avatar.Root, {
+		className: cn(avatarVariants({ size }), className),
+		...props
+	});
 };
-z.displayName = "AvatarStack";
-export {
-  y as AvatarFallback,
-  g as AvatarImage,
-  h as AvatarRoot,
-  z as AvatarStack
+AvatarRoot.displayName = "AvatarRoot";
+const AvatarImage = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Avatar.Image, {
+		className: cn("aspect-square h-full w-full object-cover", className),
+		...props
+	});
 };
+AvatarImage.displayName = "AvatarImage";
+const AvatarFallback = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Avatar.Fallback, {
+		className: cn("flex h-full w-full items-center justify-center font-medium", className),
+		...props
+	});
+};
+AvatarFallback.displayName = "AvatarFallback";
+const AvatarStack = ({ "aria-label": ariaLabel, maxVisible, className, children }) => {
+	const childrenArray = React.Children.toArray(children);
+	const totalCount = childrenArray.length;
+	const visibleCount = maxVisible !== void 0 ? Math.min(maxVisible, totalCount) : totalCount;
+	const overflowCount = totalCount - visibleCount;
+	const visibleAvatars = childrenArray.slice(0, visibleCount);
+	const inferSizeFromFirstChild = () => {
+		const firstChild = childrenArray[0];
+		if (React.isValidElement(firstChild) && firstChild.type === AvatarRoot) return firstChild.props.size ?? "default";
+		return "default";
+	};
+	const overflowSize = inferSizeFromFirstChild();
+	return /* @__PURE__ */ jsxs("ul", {
+		"aria-label": ariaLabel,
+		className: cn("flex -space-x-2", className),
+		children: [visibleAvatars.map((child, index) => /* @__PURE__ */ jsx("li", { children: child }, index)), overflowCount > 0 && /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("span", {
+			className: cn("relative flex shrink-0 items-center justify-center overflow-hidden rounded-full", "bg-muted text-foreground border-2 border-background", "font-medium", avatarVariants({ size: overflowSize })),
+			children: ["+", overflowCount]
+		}) })]
+	});
+};
+AvatarStack.displayName = "AvatarStack";
+
+//#endregion
+export { AvatarFallback, AvatarImage, AvatarRoot, AvatarStack };
+//# sourceMappingURL=avatar.js.map

package/dist/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.js","names":["BaseAvatar"],"sources":["../src/components/avatar.tsx"],"sourcesContent":["'use client'\n\nimport { Avatar as BaseAvatar } from '@base-ui/react/avatar'\nimport { cva } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\n// ============================================================================\n// Avatar Variants\n// ============================================================================\n\nconst avatarVariants = cva(\n  [\n    'relative flex shrink-0 items-center justify-center overflow-hidden rounded-full',\n    'bg-muted text-foreground',\n    'border-2 border-background',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'size-8 text-xs',\n        default: 'size-10 text-sm',\n        lg: 'size-12 text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  },\n)\n\ntype AvatarSize = 'sm' | 'default' | 'lg'\n\n// ============================================================================\n// AvatarRoot\n// ============================================================================\n\ntype AvatarRootProps = React.ComponentProps<typeof BaseAvatar.Root> & {\n  /** Size of the avatar */\n  size?: AvatarSize\n}\n\nconst AvatarRoot = ({ className, size, ...props }: AvatarRootProps) => {\n  return (\n    <BaseAvatar.Root className={cn(avatarVariants({ size }), className)} {...props} />\n  )\n}\n\nAvatarRoot.displayName = 'AvatarRoot'\n\n// ============================================================================\n// AvatarImage\n// ============================================================================\n\ntype AvatarImageProps = React.ComponentProps<typeof BaseAvatar.Image>\n\nconst AvatarImage = ({ className, ...props }: AvatarImageProps) => {\n  return (\n    <BaseAvatar.Image\n      className={cn('aspect-square h-full w-full object-cover', className)}\n      {...props}\n    />\n  )\n}\n\nAvatarImage.displayName = 'AvatarImage'\n\n// ============================================================================\n// AvatarFallback\n// ============================================================================\n\ntype AvatarFallbackProps = React.ComponentProps<typeof BaseAvatar.Fallback>\n\nconst AvatarFallback = ({ className, ...props }: AvatarFallbackProps) => {\n  return (\n    <BaseAvatar.Fallback\n      className={cn(\n        'flex h-full w-full items-center justify-center font-medium',\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nAvatarFallback.displayName = 'AvatarFallback'\n\n// ============================================================================\n// AvatarStack\n// ============================================================================\n\ntype AvatarStackProps = {\n  /** ARIA label for the avatar stack list */\n  'aria-label': string\n  /** Maximum number of avatars to display before showing overflow indicator */\n  maxVisible?: number\n  /** Additional CSS classes */\n  className?: string\n  /** Avatar components to display */\n  children: React.ReactNode\n}\n\nconst AvatarStack = ({\n  'aria-label': ariaLabel,\n  maxVisible,\n  className,\n  children,\n}: AvatarStackProps) => {\n  const childrenArray = React.Children.toArray(children)\n  const totalCount = childrenArray.length\n  const visibleCount =\n    maxVisible !== undefined ? Math.min(maxVisible, totalCount) : totalCount\n  const overflowCount = totalCount - visibleCount\n\n  const visibleAvatars = childrenArray.slice(0, visibleCount)\n\n  const inferSizeFromFirstChild = (): AvatarSize => {\n    const firstChild = childrenArray[0]\n    if (React.isValidElement(firstChild) && firstChild.type === AvatarRoot) {\n      const childProps = firstChild.props as unknown as { size?: AvatarSize }\n      return childProps.size ?? 'default'\n    }\n    return 'default'\n  }\n\n  const overflowSize = inferSizeFromFirstChild()\n\n  return (\n    <ul aria-label={ariaLabel} className={cn('flex -space-x-2', className)}>\n      {visibleAvatars.map((child, index) => (\n        <li key={index}>{child}</li>\n      ))}\n      {overflowCount > 0 && (\n        <li>\n          <span\n            className={cn(\n              'relative flex shrink-0 items-center justify-center overflow-hidden rounded-full',\n              'bg-muted text-foreground border-2 border-background',\n              'font-medium',\n              avatarVariants({ size: overflowSize }),\n            )}\n          >\n            +{overflowCount}\n          </span>\n        </li>\n      )}\n    </ul>\n  )\n}\n\nAvatarStack.displayName = 'AvatarStack'\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport { AvatarRoot, AvatarImage, AvatarFallback, AvatarStack }\n\nexport type { AvatarRootProps, AvatarImageProps, AvatarFallbackProps, AvatarStackProps }\n"],"mappings":";;;;;;;;;AAYA,MAAM,iBAAiB,IACrB;CACE;CACA;CACA;CACD,EACD;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,SAAS;EACT,IAAI;EACL,EACF;CACD,iBAAiB,EACf,MAAM,WACP;CACF,CACF;AAaD,MAAM,cAAc,EAAE,WAAW,MAAM,GAAG,YAA6B;AACrE,QACE,oBAACA,OAAW;EAAK,WAAW,GAAG,eAAe,EAAE,MAAM,CAAC,EAAE,UAAU;EAAE,GAAI;GAAS;;AAItF,WAAW,cAAc;AAQzB,MAAM,eAAe,EAAE,WAAW,GAAG,YAA8B;AACjE,QACE,oBAACA,OAAW;EACV,WAAW,GAAG,4CAA4C,UAAU;EACpE,GAAI;GACJ;;AAIN,YAAY,cAAc;AAQ1B,MAAM,kBAAkB,EAAE,WAAW,GAAG,YAAiC;AACvE,QACE,oBAACA,OAAW;EACV,WAAW,GACT,8DACA,UACD;EACD,GAAI;GACJ;;AAIN,eAAe,cAAc;AAiB7B,MAAM,eAAe,EACnB,cAAc,WACd,YACA,WACA,eACsB;CACtB,MAAM,gBAAgB,MAAM,SAAS,QAAQ,SAAS;CACtD,MAAM,aAAa,cAAc;CACjC,MAAM,eACJ,eAAe,SAAY,KAAK,IAAI,YAAY,WAAW,GAAG;CAChE,MAAM,gBAAgB,aAAa;CAEnC,MAAM,iBAAiB,cAAc,MAAM,GAAG,aAAa;CAE3D,MAAM,gCAA4C;EAChD,MAAM,aAAa,cAAc;AACjC,MAAI,MAAM,eAAe,WAAW,IAAI,WAAW,SAAS,WAE1D,QADmB,WAAW,MACZ,QAAQ;AAE5B,SAAO;;CAGT,MAAM,eAAe,yBAAyB;AAE9C,QACE,qBAAC;EAAG,cAAY;EAAW,WAAW,GAAG,mBAAmB,UAAU;aACnE,eAAe,KAAK,OAAO,UAC1B,oBAAC,kBAAgB,SAAR,MAAmB,CAC5B,EACD,gBAAgB,KACf,oBAAC,kBACC,qBAAC;GACC,WAAW,GACT,mFACA,uDACA,eACA,eAAe,EAAE,MAAM,cAAc,CAAC,CACvC;cACF,KACG;IACG,GACJ;GAEJ;;AAIT,YAAY,cAAc"}

package/dist/badge.d.ts

@@ -1,42 +1,48 @@
-import { JSX } from 'react/jsx-runtime';
-import * as React_2 from 'react';
-
-export declare const Badge: {
-    ({ className, variant, appearance, size, shape, ...props }: BadgeProps): JSX.Element;
-    displayName: string;
-};
-
-export declare type BadgeAppearance = 'default' | 'outline' | 'light' | 'ghost';
-
-export declare const BadgeButton: {
-    ({ className, ...props }: BadgeButtonProps): JSX.Element;
-    displayName: string;
-};
-
-export declare type BadgeButtonProps = React_2.ComponentProps<'button'>;
-
-export declare const BadgeDot: {
-    ({ className, ...props }: BadgeDotProps): JSX.Element;
-    displayName: string;
-};
-
-export declare type BadgeDotProps = React_2.ComponentProps<'span'>;
-
-export declare type BadgeProps = React_2.ComponentProps<'span'> & {
-    /** Visual style variant */
-    variant?: BadgeVariant;
-    /** Appearance style */
-    appearance?: BadgeAppearance;
-    /** Size of the badge */
-    size?: BadgeSize;
-    /** Shape of the badge */
-    shape?: BadgeShape;
-};
-
-export declare type BadgeShape = 'pill' | 'rounded';
-
-export declare type BadgeSize = 'sm' | 'md' | 'lg';
-
-export declare type BadgeVariant = 'default' | 'secondary' | 'destructive' | 'success' | 'warning' | 'info';
-
-export { }
+import * as React from "react";
+import * as react_jsx_runtime225 from "react/jsx-runtime";
+
+//#region src/components/badge.d.ts
+type BadgeVariant = 'default' | 'secondary' | 'destructive' | 'success' | 'warning' | 'info';
+type BadgeAppearance = 'default' | 'outline' | 'light' | 'ghost';
+type BadgeSize = 'sm' | 'md' | 'lg';
+type BadgeShape = 'pill' | 'rounded';
+type BadgeProps = React.ComponentProps<'span'> & {
+  /** Visual style variant */
+  variant?: BadgeVariant;
+  /** Appearance style */
+  appearance?: BadgeAppearance;
+  /** Size of the badge */
+  size?: BadgeSize;
+  /** Shape of the badge */
+  shape?: BadgeShape;
+};
+declare const Badge: {
+  ({
+    className,
+    variant,
+    appearance,
+    size,
+    shape,
+    ...props
+  }: BadgeProps): react_jsx_runtime225.JSX.Element;
+  displayName: string;
+};
+type BadgeDotProps = React.ComponentProps<'span'>;
+declare const BadgeDot: {
+  ({
+    className,
+    ...props
+  }: BadgeDotProps): react_jsx_runtime225.JSX.Element;
+  displayName: string;
+};
+type BadgeButtonProps = React.ComponentProps<'button'>;
+declare const BadgeButton: {
+  ({
+    className,
+    ...props
+  }: BadgeButtonProps): react_jsx_runtime225.JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { Badge, BadgeAppearance, BadgeButton, type BadgeButtonProps, BadgeDot, type BadgeDotProps, type BadgeProps, BadgeShape, BadgeSize, BadgeVariant };
+//# sourceMappingURL=badge.d.ts.map

package/dist/badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.d.ts","names":[],"sources":["../src/components/badge.tsx"],"sourcesContent":[],"mappings":";;;;KAiLY,YAAA;KAQA,eAAA;KAEA,SAAA;AAVA,KAYA,UAAA,GAZY,MAAA,GAAA,SAAA;AAQxB,KAUK,UAAA,GAAa,KAAA,CAAM,cAVG,CAAA,MAAA,CAAA,GAAA;EAEf;EAEA,OAAA,CAAA,EAQA,YARU;EAMjB;EAAU,UAAA,CAAA,EAIA,eAJA;;MAEH,CAAA,EAIH,SAJG;;OAIH,CAAA,EAEC,UAFD;;cAKH,KAHc,EAAA;EAGd,CAAA;IAAA,SAOL;IAAA,OAAA;IAAA,UAAA;IAAA,IAAA;IAAA,KAAA;IAAA,GAAA;EAAA,CAAA,EAPyE,UAOzE,CAAA,EAPmF,oBAAA,CAAA,GAAA,CAAA,OAOnF;EAAA,WAAA,EAAA,MAAA;;KAQI,aAAA,GAAgB,KAAA,CAAM;cAErB;;;;KAAqC,gBAAa,oBAAA,CAAA,GAAA,CAAA;;;KAgBnD,gBAAA,GAAmB,KAAA,CAAM,cAjCsD,CAAA,QAAA,CAAA;cAmC9E,WAnC8E,EAAA;EAe/E,CAAA;IAAA,SAAA;IAAA,GAAa;EAAS,CAAT,EAoB4B,gBApBnB,CAAA,EAoBmC,oBAAA,CAAA,GAAA,CAAA,OApBrB;EAEnC,WAQL,EAAA,MAAA;CAAA"}