@pihanga2/shadcn 0.2.20 → 0.2.22

package/components/ui/bubble.js

@@ -0,0 +1,73 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { cva as t } from "class-variance-authority";
+import { Slot as n } from "radix-ui";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/ui/bubble.tsx
+function i({ className: t, ...n }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "bubble-group",
+		className: e("flex min-w-0 flex-col gap-2", t),
+		...n
+	});
+}
+var a = t("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
+	variants: { variant: {
+		default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
+		secondary: "*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]",
+		muted: "*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
+		tinted: "*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.93_calc(c*0.4)_h)] *:data-[slot=bubble-content]:text-foreground dark:*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.3_calc(c*0.4)_h)] [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.88_calc(c*0.5)_h)] dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.35_calc(c*0.5)_h)]",
+		outline: "*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30",
+		ghost: "border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:p-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50",
+		destructive: "*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function o({ variant: t = "default", align: n = "start", className: i, ...o }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "bubble",
+		"data-variant": t,
+		"data-align": n,
+		className: e(a({ variant: t }), i),
+		...o
+	});
+}
+function s({ asChild: t = !1, className: i, ...a }) {
+	return /* @__PURE__ */ r(t ? n.Root : "div", {
+		"data-slot": "bubble-content",
+		className: e("w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50", i),
+		...a
+	});
+}
+var c = t("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-muted px-1.5 py-0.5 text-sm ring-3 ring-card has-[button]:p-0", {
+	variants: {
+		side: {
+			top: "top-0 -translate-y-3/4",
+			bottom: "bottom-0 translate-y-3/4"
+		},
+		align: {
+			start: "left-3",
+			end: "right-3"
+		}
+	},
+	defaultVariants: {
+		side: "bottom",
+		align: "end"
+	}
+});
+function l({ side: t = "bottom", align: n = "end", className: i, ...a }) {
+	return /* @__PURE__ */ r("div", {
+		"data-slot": "bubble-reactions",
+		"data-align": n,
+		"data-side": t,
+		className: e(c({
+			side: t,
+			align: n
+		}), i),
+		...a
+	});
+}
+//#endregion
+export { o as Bubble, s as BubbleContent, i as BubbleGroup, l as BubbleReactions };
+
+//# sourceMappingURL=bubble.js.map

package/components/ui/bubble.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bubble.js","names":[],"sources":["../../../src/components/ui/bubble.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {cva, type VariantProps} from \"class-variance-authority\";\nimport {Slot} from \"radix-ui\";\n\nimport {cn} from \"@/lib/utils\";\n\nfunction BubbleGroup({className, ...props}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"bubble-group\"\n      className={cn(\"flex min-w-0 flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\nconst bubbleVariants = cva(\n  \"group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80\",\n        secondary:\n          \"*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]\",\n        muted:\n          \"*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]\",\n        tinted:\n          \"*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.93_calc(c*0.4)_h)] *:data-[slot=bubble-content]:text-foreground dark:*:data-[slot=bubble-content]:bg-[oklch(from_var(--primary)_0.3_calc(c*0.4)_h)] [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.88_calc(c*0.5)_h)] dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-[oklch(from_var(--primary)_0.35_calc(c*0.5)_h)]\",\n        outline:\n          \"*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30\",\n        ghost:\n          \"border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:p-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50\",\n        destructive:\n          \"*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\nfunction Bubble({\n  variant = \"default\",\n  align = \"start\",\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> &\n  VariantProps<typeof bubbleVariants> & {\n    align?: \"start\" | \"end\";\n  }) {\n  return (\n    <div\n      data-slot=\"bubble\"\n      data-variant={variant}\n      data-align={align}\n      className={cn(bubbleVariants({variant}), className)}\n      {...props}\n    />\n  );\n}\n\nfunction BubbleContent({\n  asChild = false,\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  asChild?: boolean;\n}) {\n  const Comp = asChild ? Slot.Root : \"div\";\n\n  return (\n    <Comp\n      data-slot=\"bubble-content\"\n      className={cn(\n        \"w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nconst bubbleReactionsVariants = cva(\n  \"absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-muted px-1.5 py-0.5 text-sm ring-3 ring-card has-[button]:p-0\",\n  {\n    variants: {\n      side: {\n        top: \"top-0 -translate-y-3/4\",\n        bottom: \"bottom-0 translate-y-3/4\",\n      },\n      align: {\n        start: \"left-3\",\n        end: \"right-3\",\n      },\n    },\n    defaultVariants: {\n      side: \"bottom\",\n      align: \"end\",\n    },\n  },\n);\n\nfunction BubbleReactions({\n  side = \"bottom\",\n  align = \"end\",\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  align?: \"start\" | \"end\";\n  side?: \"top\" | \"bottom\";\n}) {\n  return (\n    <div\n      data-slot=\"bubble-reactions\"\n      data-align={align}\n      data-side={side}\n      className={cn(bubbleReactionsVariants({side, align}), className)}\n      {...props}\n    />\n  );\n}\n\nexport {BubbleGroup, Bubble, BubbleContent, BubbleReactions};\n"],"mappings":";;;;;;AAMA,SAAS,EAAY,EAAC,cAAW,GAAG,KAAqC;CACvE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EAAG,+BAA+B,CAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,IAAiB,EACrB,yKACA;CACE,UAAU,EACR,SAAS;EACP,SACE;EACF,WACE;EACF,OACE;EACF,QACE;EACF,SACE;EACF,OACE;EACF,aACE;CACJ,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAEA,SAAS,EAAO,EACd,aAAU,WACV,WAAQ,SACR,cACA,GAAG,KAIA;CACH,OACE,kBAAC,OAAD;EACE,aAAU;EACV,gBAAc;EACd,cAAY;EACZ,WAAW,EAAG,EAAe,EAAC,WAAO,CAAC,GAAG,CAAS;EAClD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EACrB,aAAU,IACV,cACA,GAAG,KAGF;CAGD,OACE,kBAHW,IAAU,EAAK,OAAO,OAGjC;EACE,aAAU;EACV,WAAW,EACT,6VACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,IAA0B,EAC9B,qJACA;CACE,UAAU;EACR,MAAM;GACJ,KAAK;GACL,QAAQ;EACV;EACA,OAAO;GACL,OAAO;GACP,KAAK;EACP;CACF;CACA,iBAAiB;EACf,MAAM;EACN,OAAO;CACT;AACF,CACF;AAEA,SAAS,EAAgB,EACvB,UAAO,UACP,WAAQ,OACR,cACA,GAAG,KAIF;CACD,OACE,kBAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,aAAW;EACX,WAAW,EAAG,EAAwB;GAAC;GAAM;EAAK,CAAC,GAAG,CAAS;EAC/D,GAAI;CACL,CAAA;AAEL"}

package/components/ui/button.js

@@ -1,10 +1,10 @@
 import { cn as e } from "../../lib/utils.js";
 import "react";
-import { Slot as t } from "radix-ui";
-import { jsx as n } from "react/jsx-runtime";
-import { cva as r } from "class-variance-authority";
+import { cva as t } from "class-variance-authority";
+import { Slot as n } from "radix-ui";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/components/ui/button.tsx
-var i = r("inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
+var i = t("inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
 	variants: {
 		variant: {
 			default: "bg-primary text-primary-foreground hover:bg-primary/90",
@@ -48,8 +48,8 @@ var i = r("inline-flex shrink-0 items-center justify-center gap-2 rounded-md tex
 		size: "default"
 	}
 });
-function a({ className: r, variant: a = "default", size: o = "default", asChild: s = !1, label: c, active: l, focused: u, isMenu: d, truncate: f, loading: p, isPending: m, loadingClassName: h, ...g }) {
-	return /* @__PURE__ */ n(s ? t.Root : "button", {
+function a({ className: t, variant: a = "default", size: o = "default", asChild: s = !1, label: c, active: l, focused: u, isMenu: d, truncate: f, loading: p, isPending: m, loadingClassName: h, ...g }) {
+	return /* @__PURE__ */ r(s ? n.Root : "button", {
 		"data-slot": "button",
 		"data-variant": a,
 		"data-size": o,
@@ -62,15 +62,15 @@ function a({ className: r, variant: a = "default", size: o = "default", asChild:
 		className: e(i({
 			variant: a,
 			size: o,
-			className: r
+			className: t
 		}), f && "truncate"),
 		...g
 	});
 }
-function o({ className: t, variant: r = "default", size: a = "default", href: o, target: s, label: c, active: l, focused: u, isMenu: d, truncate: f, loading: p, isPending: m, loadingClassName: h, onClick: g, children: _, ...v }) {
-	return /* @__PURE__ */ n("a", {
+function o({ className: t, variant: n = "default", size: a = "default", href: o, target: s, label: c, active: l, focused: u, isMenu: d, truncate: f, loading: p, isPending: m, loadingClassName: h, onClick: g, children: _, ...v }) {
+	return /* @__PURE__ */ r("a", {
 		"data-slot": "button",
-		"data-variant": r,
+		"data-variant": n,
 		"data-size": a,
 		href: o,
 		target: s,
@@ -81,7 +81,7 @@ function o({ className: t, variant: r = "default", size: a = "default", href: o,
 		"data-loading": p || void 0,
 		"data-pending": m || void 0,
 		className: e(i({
-			variant: r,
+			variant: n,
 			size: a,
 			className: t
 		}), f && "truncate"),

package/components/ui/empty.js

@@ -1,36 +1,36 @@
 import { cn as e } from "../../lib/utils.js";
-import { jsx as t } from "react/jsx-runtime";
-import { cva as n } from "class-variance-authority";
+import { cva as t } from "class-variance-authority";
+import { jsx as n } from "react/jsx-runtime";
 //#region src/components/ui/empty.tsx
-function r({ className: n, ...r }) {
-	return /* @__PURE__ */ t("div", {
+function r({ className: t, ...r }) {
+	return /* @__PURE__ */ n("div", {
 		"data-slot": "empty",
-		className: e("flex min-w-0 flex-1 flex-col items-center justify-center gap-6 text-balance rounded-lg border-dashed p-6 text-center md:p-12", n),
+		className: e("flex min-w-0 flex-1 flex-col items-center justify-center gap-6 text-balance rounded-lg border-dashed p-6 text-center md:p-12", t),
 		...r
 	});
 }
-var i = n("mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+var i = t("mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
 	variants: { variant: {
 		default: "bg-transparent",
 		icon: "bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6"
 	} },
 	defaultVariants: { variant: "default" }
 });
-function a({ className: n, variant: r = "default", ...a }) {
-	return /* @__PURE__ */ t("div", {
+function a({ className: t, variant: r = "default", ...a }) {
+	return /* @__PURE__ */ n("div", {
 		"data-slot": "empty-icon",
 		"data-variant": r,
 		className: e(i({
 			variant: r,
-			className: n
+			className: t
 		})),
 		...a
 	});
 }
-function o({ className: n, ...r }) {
-	return /* @__PURE__ */ t("div", {
+function o({ className: t, ...r }) {
+	return /* @__PURE__ */ n("div", {
 		"data-slot": "empty-content",
-		className: e("flex w-full min-w-0 max-w-sm flex-col items-center gap-4 text-balance text-sm", n),
+		className: e("flex w-full min-w-0 max-w-sm flex-col items-center gap-4 text-balance text-sm", t),
 		...r
 	});
 }

package/components/ui/field.js

@@ -2,10 +2,10 @@ import { cn as e } from "../../lib/utils.js";
 import { Label as t } from "./label.js";
 import "./separator.js";
 import { useMemo as n } from "react";
-import { jsx as r } from "react/jsx-runtime";
-import { cva as i } from "class-variance-authority";
+import { cva as r } from "class-variance-authority";
+import { jsx as i } from "react/jsx-runtime";
 //#region src/components/ui/field.tsx
-var a = i("group/field flex w-full gap-3 data-[invalid=true]:text-destructive", {
+var a = r("group/field flex w-full gap-3 data-[invalid=true]:text-destructive", {
 	variants: { orientation: {
 		vertical: ["flex-col [&>*]:w-full [&>.sr-only]:w-auto"],
 		horizontal: [
@@ -21,40 +21,40 @@ var a = i("group/field flex w-full gap-3 data-[invalid=true]:text-destructive",
 	} },
 	defaultVariants: { orientation: "vertical" }
 });
-function o({ className: t, orientation: n = "vertical", ...i }) {
-	return /* @__PURE__ */ r("div", {
+function o({ className: t, orientation: n = "vertical", ...r }) {
+	return /* @__PURE__ */ i("div", {
 		role: "group",
 		"data-slot": "field",
 		"data-orientation": n,
 		className: e(a({ orientation: n }), t),
-		...i
+		...r
 	});
 }
-function s({ className: n, ...i }) {
-	return /* @__PURE__ */ r(t, {
+function s({ className: n, ...r }) {
+	return /* @__PURE__ */ i(t, {
 		"data-slot": "field-label",
 		className: e("group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50", "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border [&>*]:data-[slot=field]:p-4", "has-data-[state=checked]:border-primary has-data-[state=checked]:bg-primary/5 dark:has-data-[state=checked]:bg-primary/10", n),
-		...i
+		...r
 	});
 }
 function c({ className: t, ...n }) {
-	return /* @__PURE__ */ r("p", {
+	return /* @__PURE__ */ i("p", {
 		"data-slot": "field-description",
 		className: e("text-sm leading-normal font-normal text-muted-foreground group-has-[[data-orientation=horizontal]]/field:text-balance", "last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5", "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", t),
 		...n
 	});
 }
-function l({ className: t, children: i, errors: a, ...o }) {
+function l({ className: t, children: r, errors: a, ...o }) {
 	let s = n(() => {
-		if (i) return i;
+		if (r) return r;
 		if (!a?.length) return null;
 		let e = [...new Map(a.map((e) => [e?.message, e])).values()];
-		return e?.length == 1 ? e[0]?.message : /* @__PURE__ */ r("ul", {
+		return e?.length == 1 ? e[0]?.message : /* @__PURE__ */ i("ul", {
 			className: "ml-4 flex list-disc flex-col gap-1",
-			children: e.map((e, t) => e?.message && /* @__PURE__ */ r("li", { children: e.message }, t))
+			children: e.map((e, t) => e?.message && /* @__PURE__ */ i("li", { children: e.message }, t))
 		});
-	}, [i, a]);
-	return s ? /* @__PURE__ */ r("div", {
+	}, [r, a]);
+	return s ? /* @__PURE__ */ i("div", {
 		role: "alert",
 		"data-slot": "field-error",
 		className: e("text-sm font-normal text-destructive", t),

package/components/ui/message.js

@@ -0,0 +1,51 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/ui/message.tsx
+function n({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "message-group",
+		className: e("flex min-w-0 flex-col gap-2", n),
+		...r
+	});
+}
+function r({ className: n, align: r = "start", ...i }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "message",
+		"data-align": r,
+		className: e("group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse", n),
+		...i
+	});
+}
+function i({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "message-avatar",
+		className: e("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-8", n),
+		...r
+	});
+}
+function a({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "message-content",
+		className: e("flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end", n),
+		...r
+	});
+}
+function o({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "message-header",
+		className: e("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0", n),
+		...r
+	});
+}
+function s({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "message-footer",
+		className: e("flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end", n),
+		...r
+	});
+}
+//#endregion
+export { r as Message, i as MessageAvatar, a as MessageContent, s as MessageFooter, n as MessageGroup, o as MessageHeader };
+
+//# sourceMappingURL=message.js.map

package/components/ui/message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message.js","names":[],"sources":["../../../src/components/ui/message.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport {cn} from \"@/lib/utils\";\n\nfunction MessageGroup({className, ...props}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"message-group\"\n      className={cn(\"flex min-w-0 flex-col gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Message({\n  className,\n  align = \"start\",\n  ...props\n}: React.ComponentProps<\"div\"> & {align?: \"start\" | \"end\"}) {\n  return (\n    <div\n      data-slot=\"message\"\n      data-align={align}\n      className={cn(\n        \"group/message relative flex w-full min-w-0 gap-2 text-sm data-[align=end]:flex-row-reverse\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MessageAvatar({className, ...props}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"message-avatar\"\n      className={cn(\n        \"flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-8\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MessageContent({className, ...props}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"message-content\"\n      className={cn(\n        \"flex w-full min-w-0 flex-col gap-2.5 wrap-break-word group-data-[align=end]/message:*:data-slot:self-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MessageHeader({className, ...props}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"message-header\"\n      className={cn(\n        \"flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction MessageFooter({className, ...props}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"message-footer\"\n      className={cn(\n        \"flex max-w-full min-w-0 items-center px-3 text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {MessageGroup, Message, MessageAvatar, MessageContent, MessageFooter, MessageHeader};\n"],"mappings":";;;;AAIA,SAAS,EAAa,EAAC,cAAW,GAAG,KAAqC;CACxE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EAAG,+BAA+B,CAAS;EACtD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAQ,EACf,cACA,WAAQ,SACR,GAAG,KACuD;CAC1D,OACE,kBAAC,OAAD;EACE,aAAU;EACV,cAAY;EACZ,WAAW,EACT,8FACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EAAC,cAAW,GAAG,KAAqC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,sKACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAe,EAAC,cAAW,GAAG,KAAqC;CAC1E,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,4GACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EAAC,cAAW,GAAG,KAAqC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,mIACA,CACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,EAAc,EAAC,cAAW,GAAG,KAAqC;CACzE,OACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,8KACA,CACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/components/ui/toggle-group.js

@@ -2,9 +2,9 @@
 import { cn as e } from "../../lib/utils.js";
 import { toggleVariants as t } from "./toggle.js";
 import * as n from "react";
+import "class-variance-authority";
 import { ToggleGroup as r } from "radix-ui";
 import { jsx as i } from "react/jsx-runtime";
-import "class-variance-authority";
 //#region src/components/ui/toggle-group.tsx
 var a = n.createContext({
 	size: "default",

package/components/ui/toggle.js

@@ -1,8 +1,8 @@
 import "../../lib/utils.js";
 import "react";
+import { cva as e } from "class-variance-authority";
 import "radix-ui";
 import "react/jsx-runtime";
-import { cva as e } from "class-variance-authority";
 //#region src/components/ui/toggle.tsx
 var t = e("inline-flex items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-[color,box-shadow] outline-none hover:bg-muted hover:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
 	variants: {

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "@pihanga2/shadcn",
-  "version": "0.2.20",
+  "version": "0.2.22",
   "description": "Pihanga core card components built on shadcn/ui and Radix UI — the npm distribution of pihanga-shadcn.",
   "type": "module",
   "exports": {
+    "./cards/attachment": {
+      "import": "./cards/attachment/index.js",
+      "types": "./cards/attachment/index.d.ts"
+    },
     "./cards/avatar": {
       "import": "./cards/avatar/index.js",
       "types": "./cards/avatar/index.d.ts"
@@ -16,6 +20,10 @@
       "import": "./cards/box/index.js",
       "types": "./cards/box/index.d.ts"
     },
+    "./cards/bubble": {
+      "import": "./cards/bubble/index.js",
+      "types": "./cards/bubble/index.d.ts"
+    },
     "./cards/button": {
       "import": "./cards/button/index.js",
       "types": "./cards/button/index.d.ts"
@@ -108,6 +116,10 @@
       "import": "./cards/menu/index.js",
       "types": "./cards/menu/index.d.ts"
     },
+    "./cards/message": {
+      "import": "./cards/message/index.js",
+      "types": "./cards/message/index.d.ts"
+    },
     "./cards/modeToggle": {
       "import": "./cards/modeToggle/index.js",
       "types": "./cards/modeToggle/index.d.ts"
@@ -226,9 +238,11 @@
     }
   },
   "sideEffects": [
+    "./cards/attachment/index.js",
     "./cards/avatar/index.js",
     "./cards/badge/index.js",
     "./cards/box/index.js",
+    "./cards/bubble/index.js",
     "./cards/button/index.js",
     "./cards/checkbox/index.js",
     "./cards/collapsibleCard/index.js",
@@ -252,6 +266,7 @@
     "./cards/loadingOverlay/index.js",
     "./cards/loadingSkeleton/index.js",
     "./cards/menu/index.js",
+    "./cards/message/index.js",
     "./cards/modeToggle/index.js",
     "./cards/navbarSearch/index.js",
     "./cards/observable/index.js",
@@ -295,7 +310,7 @@
   "peerDependencies": {
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
-    "@pihanga2/core": "0.3.38",
+    "@pihanga2/core": "^0.3.40",
     "@pihanga2/cards": "*"
   },
   "dependencies": {