@elmeragroup/fuse 0.1.0-canary.1

package/components/item/index.js

@@ -0,0 +1,24 @@
+import { ItemActions, ItemContent, ItemDescription, ItemFooter, ItemHeader, ItemMedia, ItemTitle } from "./item-markup.js";
+import { ItemGroup, ItemRoot, ItemSeparator } from "./item.js";
+//#region src/components/item/index.ts
+/**
+* Server-visible namespace for `Item`.
+* The implementation stays a client module; this file has no directive,
+* so a server component can read each part instead of dotting into a client reference.
+*/
+const Item = {
+	Root: ItemRoot,
+	Media: ItemMedia,
+	Content: ItemContent,
+	Actions: ItemActions,
+	Group: ItemGroup,
+	Separator: ItemSeparator,
+	Title: ItemTitle,
+	Description: ItemDescription,
+	Header: ItemHeader,
+	Footer: ItemFooter
+};
+//#endregion
+export { Item };
+
+//# sourceMappingURL=index.js.map

package/components/item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/item/index.ts"],"sourcesContent":["/**\n * Server-visible namespace for `Item`.\n * The implementation stays a client module; this file has no directive,\n * so a server component can read each part instead of dotting into a client reference.\n */\nimport { ItemRoot, ItemGroup, ItemSeparator } from \"./item\";\nimport {\n  ItemMedia,\n  ItemContent,\n  ItemActions,\n  ItemTitle,\n  ItemDescription,\n  ItemHeader,\n  ItemFooter,\n} from \"./item-markup\";\n\nexport const Item = {\n  Root: ItemRoot,\n  Media: ItemMedia,\n  Content: ItemContent,\n  Actions: ItemActions,\n  Group: ItemGroup,\n  Separator: ItemSeparator,\n  Title: ItemTitle,\n  Description: ItemDescription,\n  Header: ItemHeader,\n  Footer: ItemFooter,\n};\n"],"mappings":";;;;;;;;AAgBA,MAAa,OAAO;CAClB,MAAM;CACN,OAAO;CACP,SAAS;CACT,SAAS;CACT,OAAO;CACP,WAAW;CACX,OAAO;CACP,aAAa;CACb,QAAQ;CACR,QAAQ;AACV"}

package/components/item/item-markup.d.ts

@@ -0,0 +1,85 @@
+import { itemVariants } from "./item-variants.js";
+import { ComponentProps, ReactElement, ReactNode } from "react";
+import { VariantProps } from "tailwind-variants";
+//#region src/components/item/item-markup.d.ts
+/**
+ * Out-of-group `Item.Root` element. No hooks and no `render` prop, so Alert can
+ * render it from a server component. Public `Item.Root` stays client: it reads
+ * group context and forwards `render` through `useRender`. Both take their
+ * attributes and classes from `itemRootProps`.
+ */
+export declare function ItemRootElement({ className, variant, size, ...props }: ComponentProps<"div"> & VariantProps<typeof itemVariants>): ReactElement;
+declare const itemMediaVariants: import("tailwind-variants").TVReturnType<{
+  variant: {
+    default: "bg-transparent";
+    icon: "[&_svg:not([class*='size-'])]:size-4";
+    image: "outline-black/10 size-10 overflow-hidden rounded-sm outline outline-1 -outline-offset-1 group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover";
+  };
+}, undefined, "flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
+  variant: {
+    default: "bg-transparent";
+    icon: "[&_svg:not([class*='size-'])]:size-4";
+    image: "outline-black/10 size-10 overflow-hidden rounded-sm outline outline-1 -outline-offset-1 group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover";
+  };
+}, undefined, import("tailwind-variants").TVReturnTypeLike<{
+  variant: {
+    default: "bg-transparent";
+    icon: "[&_svg:not([class*='size-'])]:size-4";
+    image: "outline-black/10 size-10 overflow-hidden rounded-sm outline outline-1 -outline-offset-1 group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover";
+  };
+}, undefined>>;
+export declare function ItemMedia({ className, variant, ...props }: ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): ReactElement;
+export declare namespace ItemMedia {
+  var displayName: string;
+}
+export declare function ItemContent({ className, ...props }: ComponentProps<"div">): ReactElement;
+export declare namespace ItemContent {
+  var displayName: string;
+}
+export declare function ItemTitle({ className, ...props }: ComponentProps<"div">): ReactElement;
+export declare namespace ItemTitle {
+  var displayName: string;
+}
+export declare function ItemDescription({ className, ...props }: ComponentProps<"p">): ReactElement;
+export declare namespace ItemDescription {
+  var displayName: string;
+}
+export declare function ItemActions({ className, ...props }: ComponentProps<"div">): ReactElement;
+export declare namespace ItemActions {
+  var displayName: string;
+}
+export declare function ItemHeader({ className, ...props }: ComponentProps<"div">): ReactElement;
+export declare namespace ItemHeader {
+  var displayName: string;
+}
+declare const itemFooterVariants: import("tailwind-variants").TVReturnType<{
+  mode: {
+    default: "grid-rows-[minmax(0,1fr)] pt-3 opacity-100";
+    visible: string[];
+    hidden: string[];
+  };
+}, undefined, "grid", {
+  mode: {
+    default: "grid-rows-[minmax(0,1fr)] pt-3 opacity-100";
+    visible: string[];
+    hidden: string[];
+  };
+}, undefined, import("tailwind-variants").TVReturnTypeLike<{
+  mode: {
+    default: "grid-rows-[minmax(0,1fr)] pt-3 opacity-100";
+    visible: string[];
+    hidden: string[];
+  };
+}, undefined>>;
+export declare function ItemFooter({ children, className, mode, inert, ...props }: ComponentProps<"div"> & VariantProps<typeof itemFooterVariants> & {
+  /**
+   * Footer content, wrapped in the inner `item-footer-content` element that `mode`
+   * reveals or collapses via the grid-row animation.
+   */
+  children?: ReactNode;
+}): ReactElement;
+export declare namespace ItemFooter {
+  var displayName: string;
+}
+//#endregion
+//# sourceMappingURL=item-markup.d.ts.map

package/components/item/item-markup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-markup.d.ts","names":[],"sources":["../../../src/components/item/item-markup.tsx"],"mappings":";;;;;;;;;;wBAgBgB,kBACd,WACA,SACA,SACG,SACF,wBAAwB,oBAAoB,gBAAgB;cAIzD,+CAAiB;;;;;;;;;;;;;;;;;;;wBAeP,YACd,WACA,YACG,SACF,wBAAwB,oBAAoB,qBAAqB;yBAJpD;MAAA;;wBAeA,cAAc,cAAc,SAAS,wBAAwB;yBAA7D;MAAA;;wBAaA,YAAY,cAAc,SAAS,wBAAwB;yBAA3D;MAAA;;wBAIA,kBAAkB,cAAc,SAAS,sBAAsB;yBAA/D;MAAA;;wBAaA,cAAc,cAAc,SAAS,wBAAwB;yBAA7D;MAAA;;wBAIA,aAAa,cAAc,SAAS,wBAAwB;yBAA5D;MAAA;;cAUV,gDAAkB;;;;;;;;;;;;;;;;;;;wBAqBR,aACd,UACA,WACA,MACA,UACG,SACF,wBACD,oBAAoB;;;;;EAKlB,WAAW;IACT;yBAbU;MAAA"}

package/components/item/item-markup.js

@@ -0,0 +1,112 @@
+import { cn } from "../../styles/cn.js";
+import { itemRootProps } from "./item-root-props.js";
+import { ITEM_TITLE_CLASSES } from "./item-title-classes.js";
+import { tv } from "tailwind-variants";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/item/item-markup.tsx
+/**
+* Out-of-group `Item.Root` element. No hooks and no `render` prop, so Alert can
+* render it from a server component. Public `Item.Root` stays client: it reads
+* group context and forwards `render` through `useRender`. Both take their
+* attributes and classes from `itemRootProps`.
+*/
+function ItemRootElement({ className, variant = "default", size = "default", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		...itemRootProps({
+			variant,
+			size,
+			className
+		}),
+		...props
+	});
+}
+const itemMediaVariants = tv({
+	base: "flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none",
+	variants: { variant: {
+		default: "bg-transparent",
+		icon: "[&_svg:not([class*='size-'])]:size-4",
+		image: "outline-black/10 size-10 overflow-hidden rounded-sm outline outline-1 -outline-offset-1 group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function ItemMedia({ className, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-media",
+		"data-variant": variant,
+		className: cn(itemMediaVariants({ variant }), className),
+		...props
+	});
+}
+function ItemContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-content",
+		className: cn("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className),
+		...props
+	});
+}
+function ItemTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-title",
+		className: cn(ITEM_TITLE_CLASSES, className),
+		...props
+	});
+}
+function ItemDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "item-description",
+		className: cn("text-sm leading-normal font-normal group-data-[size=xs]/item:text-xs line-clamp-2 text-left text-pretty text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
+		...props
+	});
+}
+function ItemActions({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-actions",
+		className: cn("flex items-center gap-2", className),
+		...props
+	});
+}
+function ItemHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-header",
+		className: cn("flex basis-full items-center justify-between gap-2", className),
+		...props
+	});
+}
+const itemFooterVariants = tv({
+	base: "grid",
+	variants: { mode: {
+		default: "grid-rows-[minmax(0,1fr)] pt-3 opacity-100",
+		visible: [
+			"translate-y-0 grid-rows-[minmax(0,1fr)] pt-3 opacity-100",
+			"ease-out transition-[opacity,transform] duration-150",
+			"starting:-translate-y-1.5 starting:opacity-0"
+		],
+		hidden: ["pointer-events-none -translate-y-1.5 grid-rows-[minmax(0,0fr)] pt-0 opacity-0", "ease-out transition-[opacity,transform] duration-150"]
+	} },
+	defaultVariants: { mode: "default" }
+});
+function ItemFooter({ children, className, mode = "default", inert, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-footer",
+		"data-mode": mode,
+		className: cn(itemFooterVariants({ mode }), className),
+		...props,
+		inert: mode === "hidden" || Boolean(inert),
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "item-footer-content",
+			className: "flex min-h-0 flex-col gap-3",
+			children
+		})
+	});
+}
+ItemMedia.displayName = "Item.Media";
+ItemContent.displayName = "Item.Content";
+ItemActions.displayName = "Item.Actions";
+ItemTitle.displayName = "Item.Title";
+ItemDescription.displayName = "Item.Description";
+ItemHeader.displayName = "Item.Header";
+ItemFooter.displayName = "Item.Footer";
+//#endregion
+export { ItemActions, ItemContent, ItemDescription, ItemFooter, ItemHeader, ItemMedia, ItemRootElement, ItemTitle };
+
+//# sourceMappingURL=item-markup.js.map

package/components/item/item-markup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-markup.js","names":[],"sources":["../../../src/components/item/item-markup.tsx"],"sourcesContent":["import type { ComponentProps, ReactElement, ReactNode } from \"react\";\n\nimport { tv } from \"tailwind-variants\";\nimport type { VariantProps } from \"tailwind-variants\";\n\nimport { cn } from \"../../styles/cn\";\nimport { itemRootProps } from \"./item-root-props\";\nimport { ITEM_TITLE_CLASSES } from \"./item-title-classes\";\nimport type { itemVariants } from \"./item-variants\";\n\n/**\n * Out-of-group `Item.Root` element. No hooks and no `render` prop, so Alert can\n * render it from a server component. Public `Item.Root` stays client: it reads\n * group context and forwards `render` through `useRender`. Both take their\n * attributes and classes from `itemRootProps`.\n */\nexport function ItemRootElement({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: ComponentProps<\"div\"> & VariantProps<typeof itemVariants>): ReactElement {\n  return <div {...itemRootProps({ variant, size, className })} {...props} />;\n}\n\nconst itemMediaVariants = tv({\n  base: \"flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none\",\n  variants: {\n    variant: {\n      default: \"bg-transparent\",\n      icon: \"[&_svg:not([class*='size-'])]:size-4\",\n      image:\n        \"outline-black/10 size-10 overflow-hidden rounded-sm outline outline-1 -outline-offset-1 group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n\nexport function ItemMedia({\n  className,\n  variant = \"default\",\n  ...props\n}: ComponentProps<\"div\"> & VariantProps<typeof itemMediaVariants>): ReactElement {\n  return (\n    <div\n      data-slot=\"item-media\"\n      data-variant={variant}\n      className={cn(itemMediaVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\nexport function ItemContent({ className, ...props }: ComponentProps<\"div\">): ReactElement {\n  return (\n    <div\n      data-slot=\"item-content\"\n      className={cn(\n        \"flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport function ItemTitle({ className, ...props }: ComponentProps<\"div\">): ReactElement {\n  return <div data-slot=\"item-title\" className={cn(ITEM_TITLE_CLASSES, className)} {...props} />;\n}\n\nexport function ItemDescription({ className, ...props }: ComponentProps<\"p\">): ReactElement {\n  return (\n    <p\n      data-slot=\"item-description\"\n      className={cn(\n        \"text-sm leading-normal font-normal group-data-[size=xs]/item:text-xs line-clamp-2 text-left text-pretty text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport function ItemActions({ className, ...props }: ComponentProps<\"div\">): ReactElement {\n  return <div data-slot=\"item-actions\" className={cn(\"flex items-center gap-2\", className)} {...props} />;\n}\n\nexport function ItemHeader({ className, ...props }: ComponentProps<\"div\">): ReactElement {\n  return (\n    <div\n      data-slot=\"item-header\"\n      className={cn(\"flex basis-full items-center justify-between gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\nconst itemFooterVariants = tv({\n  base: \"grid\",\n  variants: {\n    mode: {\n      default: \"grid-rows-[minmax(0,1fr)] pt-3 opacity-100\",\n      visible: [\n        \"translate-y-0 grid-rows-[minmax(0,1fr)] pt-3 opacity-100\",\n        \"ease-out transition-[opacity,transform] duration-150\",\n        \"starting:-translate-y-1.5 starting:opacity-0\",\n      ],\n      hidden: [\n        \"pointer-events-none -translate-y-1.5 grid-rows-[minmax(0,0fr)] pt-0 opacity-0\",\n        \"ease-out transition-[opacity,transform] duration-150\",\n      ],\n    },\n  },\n  defaultVariants: {\n    mode: \"default\",\n  },\n});\n\nexport function ItemFooter({\n  children,\n  className,\n  mode = \"default\",\n  inert,\n  ...props\n}: ComponentProps<\"div\"> &\n  VariantProps<typeof itemFooterVariants> & {\n    /**\n     * Footer content, wrapped in the inner `item-footer-content` element that `mode`\n     * reveals or collapses via the grid-row animation.\n     */\n    children?: ReactNode;\n  }): ReactElement {\n  return (\n    <div\n      data-slot=\"item-footer\"\n      data-mode={mode}\n      className={cn(itemFooterVariants({ mode }), className)}\n      {...props}\n      inert={mode === \"hidden\" || Boolean(inert)}>\n      <div data-slot=\"item-footer-content\" className=\"flex min-h-0 flex-col gap-3\">\n        {children}\n      </div>\n    </div>\n  );\n}\n\nItemMedia.displayName = \"Item.Media\";\nItemContent.displayName = \"Item.Content\";\nItemActions.displayName = \"Item.Actions\";\nItemTitle.displayName = \"Item.Title\";\nItemDescription.displayName = \"Item.Description\";\nItemHeader.displayName = \"Item.Header\";\nItemFooter.displayName = \"Item.Footer\";\n"],"mappings":";;;;;;;;;;;;AAgBA,SAAgB,gBAAgB,EAC9B,WACA,UAAU,WACV,OAAO,WACP,GAAG,SACuE;CAC1E,OAAO,oBAAC,OAAD;EAAK,GAAI,cAAc;GAAE;GAAS;GAAM;EAAU,CAAC;EAAG,GAAI;CAAQ,CAAA;AAC3E;AAEA,MAAM,oBAAoB,GAAG;CAC3B,MAAM;CACN,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;EACN,OACE;CACJ,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC;AAED,SAAgB,UAAU,EACxB,WACA,UAAU,WACV,GAAG,SAC4E;CAC/E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,GAAG,kBAAkB,EAAE,QAAQ,CAAC,GAAG,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAgB,YAAY,EAAE,WAAW,GAAG,SAA8C;CACxF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAgB,UAAU,EAAE,WAAW,GAAG,SAA8C;CACtF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAa,WAAW,GAAG,oBAAoB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC/F;AAEA,SAAgB,gBAAgB,EAAE,WAAW,GAAG,SAA4C;CAC1F,OACE,oBAAC,KAAD;EACE,aAAU;EACV,WAAW,GACT,mMACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAgB,YAAY,EAAE,WAAW,GAAG,SAA8C;CACxF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,2BAA2B,SAAS;EAAG,GAAI;CAAQ,CAAA;AACxG;AAEA,SAAgB,WAAW,EAAE,WAAW,GAAG,SAA8C;CACvF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,sDAAsD,SAAS;EAC7E,GAAI;CACL,CAAA;AAEL;AAEA,MAAM,qBAAqB,GAAG;CAC5B,MAAM;CACN,UAAU,EACR,MAAM;EACJ,SAAS;EACT,SAAS;GACP;GACA;GACA;EACF;EACA,QAAQ,CACN,iFACA,sDACF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,UACR;AACF,CAAC;AAED,SAAgB,WAAW,EACzB,UACA,WACA,OAAO,WACP,OACA,GAAG,SAQc;CACjB,OACE,oBAAC,OAAD;EACE,aAAU;EACV,aAAW;EACX,WAAW,GAAG,mBAAmB,EAAE,KAAK,CAAC,GAAG,SAAS;EACrD,GAAI;EACJ,OAAO,SAAS,YAAY,QAAQ,KAAK;EACzC,UAAA,oBAAC,OAAD;GAAK,aAAU;GAAsB,WAAU;GAC5C;EACE,CAAA;CACF,CAAA;AAET;AAEA,UAAU,cAAc;AACxB,YAAY,cAAc;AAC1B,YAAY,cAAc;AAC1B,UAAU,cAAc;AACxB,gBAAgB,cAAc;AAC9B,WAAW,cAAc;AACzB,WAAW,cAAc"}

package/components/item/item-root-props.d.ts

@@ -0,0 +1,35 @@
+import { itemVariants } from "./item-variants.js";
+import { VariantProps } from "tailwind-variants";
+//#region src/components/item/item-root-props.d.ts
+type ItemRootVariants = VariantProps<typeof itemVariants>;
+/**
+ * Style inputs shared by the client `Item.Root` and the hook-free root Alert renders.
+ * Variant and size are required: each component defaults them in its own signature,
+ * where the API docs read the default.
+ */
+export type ItemRootStyle = {
+  /** Resolved `variant` axis of `itemVariants`. */
+  readonly variant: NonNullable<ItemRootVariants["variant"]>;
+  /** Resolved `size` axis of `itemVariants`. */
+  readonly size: NonNullable<ItemRootVariants["size"]>;
+  /** Consumer classes, merged after the recipe so they win Tailwind conflicts. */
+  readonly className?: string | undefined;
+};
+/** Host attributes every Item root carries. */
+export type ItemRootProps = {
+  readonly "data-slot": "item";
+  readonly "data-variant": ItemRootStyle["variant"];
+  readonly "data-size": ItemRootStyle["size"];
+  readonly className: string;
+};
+/**
+ * Build the Item root's data attributes and classes. Pure and directive-free, so the
+ * client `Item.Root` (through `useRender`) and the server-safe `ItemRootElement`
+ * emit the same markup from one owner.
+ *
+ * @param style - Variant, size and consumer classes.
+ * @returns The attributes to put on the root element.
+ */
+export declare function itemRootProps({ variant, size, className }: ItemRootStyle): ItemRootProps;
+//#endregion
+//# sourceMappingURL=item-root-props.d.ts.map

package/components/item/item-root-props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-root-props.d.ts","names":[],"sources":["../../../src/components/item/item-root-props.ts"],"mappings":";;;KAKK,mBAAmB,oBAAoB;;;;;;YAOhC;;WAED,SAAS,YAAY;;WAErB,MAAM,YAAY;;WAElB;;;YAIC;WACD;WACA,gBAAgB;WAChB,aAAa;WACb;;;;;;;;;;wBAWK,gBAAgB,SAAS,MAAM,aAAa,gBAAgB"}

package/components/item/item-root-props.js

@@ -0,0 +1,26 @@
+import { cn } from "../../styles/cn.js";
+import { itemVariants } from "./item-variants.js";
+//#region src/components/item/item-root-props.ts
+/**
+* Build the Item root's data attributes and classes. Pure and directive-free, so the
+* client `Item.Root` (through `useRender`) and the server-safe `ItemRootElement`
+* emit the same markup from one owner.
+*
+* @param style - Variant, size and consumer classes.
+* @returns The attributes to put on the root element.
+*/
+function itemRootProps({ variant, size, className }) {
+	return {
+		"data-slot": "item",
+		"data-variant": variant,
+		"data-size": size,
+		className: cn(itemVariants({
+			variant,
+			size
+		}), className)
+	};
+}
+//#endregion
+export { itemRootProps };
+
+//# sourceMappingURL=item-root-props.js.map

package/components/item/item-root-props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-root-props.js","names":[],"sources":["../../../src/components/item/item-root-props.ts"],"sourcesContent":["import type { VariantProps } from \"tailwind-variants\";\n\nimport { cn } from \"../../styles/cn\";\nimport { itemVariants } from \"./item-variants\";\n\ntype ItemRootVariants = VariantProps<typeof itemVariants>;\n\n/**\n * Style inputs shared by the client `Item.Root` and the hook-free root Alert renders.\n * Variant and size are required: each component defaults them in its own signature,\n * where the API docs read the default.\n */\nexport type ItemRootStyle = {\n  /** Resolved `variant` axis of `itemVariants`. */\n  readonly variant: NonNullable<ItemRootVariants[\"variant\"]>;\n  /** Resolved `size` axis of `itemVariants`. */\n  readonly size: NonNullable<ItemRootVariants[\"size\"]>;\n  /** Consumer classes, merged after the recipe so they win Tailwind conflicts. */\n  readonly className?: string | undefined;\n};\n\n/** Host attributes every Item root carries. */\nexport type ItemRootProps = {\n  readonly \"data-slot\": \"item\";\n  readonly \"data-variant\": ItemRootStyle[\"variant\"];\n  readonly \"data-size\": ItemRootStyle[\"size\"];\n  readonly className: string;\n};\n\n/**\n * Build the Item root's data attributes and classes. Pure and directive-free, so the\n * client `Item.Root` (through `useRender`) and the server-safe `ItemRootElement`\n * emit the same markup from one owner.\n *\n * @param style - Variant, size and consumer classes.\n * @returns The attributes to put on the root element.\n */\nexport function itemRootProps({ variant, size, className }: ItemRootStyle): ItemRootProps {\n  return {\n    \"data-slot\": \"item\",\n    \"data-variant\": variant,\n    \"data-size\": size,\n    className: cn(itemVariants({ variant, size }), className),\n  };\n}\n"],"mappings":";;;;;;;;;;;AAqCA,SAAgB,cAAc,EAAE,SAAS,MAAM,aAA2C;CACxF,OAAO;EACL,aAAa;EACb,gBAAgB;EAChB,aAAa;EACb,WAAW,GAAG,aAAa;GAAE;GAAS;EAAK,CAAC,GAAG,SAAS;CAC1D;AACF"}

package/components/item/item-title-classes.d.ts

@@ -0,0 +1,4 @@
+//#region src/components/item/item-title-classes.d.ts
+export declare const ITEM_TITLE_CLASSES: string;
+//#endregion
+//# sourceMappingURL=item-title-classes.d.ts.map

package/components/item/item-title-classes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-title-classes.d.ts","names":[],"sources":["../../../src/components/item/item-title-classes.ts"],"mappings":";qBAOa"}

package/components/item/item-title-classes.js

@@ -0,0 +1,12 @@
+import { cn } from "../../styles/cn.js";
+//#region src/components/item/item-title-classes.ts
+/**
+* Item.Title class string. Shared with Alert.Title so the alert
+* heading keeps the same type while staying an `h*`.
+* Package-private — not on the `@elmeragroup/fuse/item` facade.
+*/
+const ITEM_TITLE_CLASSES = cn("text-sm leading-snug font-medium line-clamp-1 flex w-fit items-center gap-2 underline-offset-4");
+//#endregion
+export { ITEM_TITLE_CLASSES };
+
+//# sourceMappingURL=item-title-classes.js.map

package/components/item/item-title-classes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-title-classes.js","names":[],"sources":["../../../src/components/item/item-title-classes.ts"],"sourcesContent":["/**\n * Item.Title class string. Shared with Alert.Title so the alert\n * heading keeps the same type while staying an `h*`.\n * Package-private — not on the `@elmeragroup/fuse/item` facade.\n */\nimport { cn } from \"../../styles/cn\";\n\nexport const ITEM_TITLE_CLASSES = cn(\n  \"text-sm leading-snug font-medium line-clamp-1 flex w-fit items-center gap-2 underline-offset-4\"\n);\n"],"mappings":";;;;;;;AAOA,MAAa,qBAAqB,GAChC,gGACF"}

package/components/item/item-variants.d.ts

@@ -0,0 +1,37 @@
+//#region src/components/item/item-variants.d.ts
+export declare const itemVariants: import("tailwind-variants").TVReturnType<{
+  variant: {
+    default: "border-transparent";
+    outline: "border-border";
+    muted: "border-transparent bg-muted/50";
+  };
+  size: {
+    default: "gap-3.5 px-4 py-3.5";
+    sm: "gap-2.5 px-3 py-2.5";
+    xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0";
+  };
+}, undefined, string, {
+  variant: {
+    default: "border-transparent";
+    outline: "border-border";
+    muted: "border-transparent bg-muted/50";
+  };
+  size: {
+    default: "gap-3.5 px-4 py-3.5";
+    sm: "gap-2.5 px-3 py-2.5";
+    xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0";
+  };
+}, undefined, import("tailwind-variants").TVReturnTypeLike<{
+  variant: {
+    default: "border-transparent";
+    outline: "border-border";
+    muted: "border-transparent bg-muted/50";
+  };
+  size: {
+    default: "gap-3.5 px-4 py-3.5";
+    sm: "gap-2.5 px-3 py-2.5";
+    xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0";
+  };
+}, undefined>>;
+//#endregion
+//# sourceMappingURL=item-variants.d.ts.map

package/components/item/item-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-variants.d.ts","names":[],"sources":["../../../src/components/item/item-variants.ts"],"mappings":";qBAKa,0CAAY"}

package/components/item/item-variants.js

@@ -0,0 +1,27 @@
+import { cn } from "../../styles/cn.js";
+import { selfFocusRingClass } from "../../styles/utils.js";
+import { tv } from "tailwind-variants";
+//#region src/components/item/item-variants.ts
+const itemVariants = tv({
+	base: cn("group/item text-sm flex w-full flex-wrap items-center rounded-md border transition-colors duration-100 [a]:transition-colors [a]:hover:bg-muted", selfFocusRingClass),
+	variants: {
+		variant: {
+			default: "border-transparent",
+			outline: "border-border",
+			muted: "border-transparent bg-muted/50"
+		},
+		size: {
+			default: "gap-3.5 px-4 py-3.5",
+			sm: "gap-2.5 px-3 py-2.5",
+			xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+//#endregion
+export { itemVariants };
+
+//# sourceMappingURL=item-variants.js.map

package/components/item/item-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item-variants.js","names":[],"sources":["../../../src/components/item/item-variants.ts"],"sourcesContent":["import { tv } from \"tailwind-variants\";\n\nimport { cn } from \"../../styles/cn\";\nimport { selfFocusRingClass } from \"../../styles/utils\";\n\nexport const itemVariants = tv({\n  base: cn(\n    \"group/item text-sm flex w-full flex-wrap items-center rounded-md border transition-colors duration-100 [a]:transition-colors [a]:hover:bg-muted\",\n    selfFocusRingClass\n  ),\n  variants: {\n    variant: {\n      default: \"border-transparent\",\n      outline: \"border-border\",\n      muted: \"border-transparent bg-muted/50\",\n    },\n    size: {\n      default: \"gap-3.5 px-4 py-3.5\",\n      sm: \"gap-2.5 px-3 py-2.5\",\n      xs: \"gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n    size: \"default\",\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,eAAe,GAAG;CAC7B,MAAM,GACJ,mJACA,kBACF;CACA,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,OAAO;EACT;EACA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;EACN;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC"}

package/components/item/item.d.ts

@@ -0,0 +1,20 @@
+import { Separator } from "../separator/separator.js";
+import { itemVariants } from "./item-variants.js";
+import { ComponentProps, ReactElement } from "react";
+import { VariantProps } from "tailwind-variants";
+import { useRender } from "@base-ui/react/use-render";
+//#region src/components/item/item.d.ts
+export declare function ItemGroup({ className, ...props }: ComponentProps<"div">): ReactElement;
+export declare namespace ItemGroup {
+  var displayName: string;
+}
+export declare function ItemSeparator({ className, ...props }: ComponentProps<typeof Separator>): ReactElement;
+export declare namespace ItemSeparator {
+  var displayName: string;
+}
+export declare function ItemRoot({ className, variant, size, render, ...props }: useRender.ComponentProps<"div"> & VariantProps<typeof itemVariants>): ReactElement;
+export declare namespace ItemRoot {
+  var displayName: string;
+}
+//#endregion
+//# sourceMappingURL=item.d.ts.map

package/components/item/item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.d.ts","names":[],"sources":["../../../src/components/item/item.tsx"],"mappings":";;;;;;wBAiBgB,YAAY,cAAc,SAAS,wBAAwB;yBAA3D;MAAA;;wBAgBA,gBAAgB,cAAc,SAAS,sBAAsB,aAAa;yBAA1E;MAAA;;wBAWA,WACd,WACA,SACA,MACA,WACG,SACF,UAAU,wBAAwB,oBAAoB,gBAAgB;yBANzD;MAAA"}

package/components/item/item.js

@@ -0,0 +1,49 @@
+"use client";
+import { cn } from "../../styles/cn.js";
+import { mergeClassName } from "../../styles/merge-class-name.js";
+import { itemRootProps } from "./item-root-props.js";
+import { Separator } from "../separator/separator.js";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { useRender } from "@base-ui/react/use-render";
+//#region src/components/item/item.tsx
+const ItemGroupContext = createContext(false);
+function ItemGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(ItemGroupContext.Provider, {
+		value: true,
+		children: /* @__PURE__ */ jsx("div", {
+			role: "list",
+			"data-slot": "item-group",
+			className: cn("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className),
+			...props
+		})
+	});
+}
+function ItemSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Separator, {
+		"data-slot": "item-separator",
+		orientation: "horizontal",
+		className: mergeClassName(className, "my-2"),
+		...props
+	});
+}
+function ItemRoot({ className, variant = "default", size = "default", render, ...props }) {
+	const inGroup = useContext(ItemGroupContext);
+	return useRender({
+		defaultTagName: "div",
+		props: mergeProps(itemRootProps({
+			variant,
+			size,
+			className
+		}), inGroup ? { role: "listitem" } : void 0, props),
+		render
+	});
+}
+ItemRoot.displayName = "Item.Root";
+ItemGroup.displayName = "Item.Group";
+ItemSeparator.displayName = "Item.Separator";
+//#endregion
+export { ItemGroup, ItemRoot, ItemSeparator };
+
+//# sourceMappingURL=item.js.map

package/components/item/item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","names":[],"sources":["../../../src/components/item/item.tsx"],"sourcesContent":["\"use client\";\n\nimport { createContext, useContext } from \"react\";\nimport type { ComponentProps, ReactElement } from \"react\";\n\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { VariantProps } from \"tailwind-variants\";\n\nimport { cn } from \"../../styles/cn\";\nimport { mergeClassName } from \"../../styles/merge-class-name\";\nimport { Separator } from \"../separator/separator\";\nimport { itemRootProps } from \"./item-root-props\";\nimport type { itemVariants } from \"./item-variants\";\n\nconst ItemGroupContext = createContext(false);\n\nexport function ItemGroup({ className, ...props }: ComponentProps<\"div\">): ReactElement {\n  return (\n    <ItemGroupContext.Provider value={true}>\n      <div\n        role=\"list\"\n        data-slot=\"item-group\"\n        className={cn(\n          \"group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2\",\n          className\n        )}\n        {...props}\n      />\n    </ItemGroupContext.Provider>\n  );\n}\n\nexport function ItemSeparator({ className, ...props }: ComponentProps<typeof Separator>): ReactElement {\n  return (\n    <Separator\n      data-slot=\"item-separator\"\n      orientation=\"horizontal\"\n      className={mergeClassName(className, \"my-2\")}\n      {...props}\n    />\n  );\n}\n\nexport function ItemRoot({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  render,\n  ...props\n}: useRender.ComponentProps<\"div\"> & VariantProps<typeof itemVariants>): ReactElement {\n  const inGroup = useContext(ItemGroupContext);\n  return useRender({\n    defaultTagName: \"div\",\n    props: mergeProps<\"div\">(\n      itemRootProps({ variant, size, className }),\n      inGroup ? { role: \"listitem\" } : undefined,\n      props\n    ),\n    render,\n  });\n}\n\nItemRoot.displayName = \"Item.Root\";\nItemGroup.displayName = \"Item.Group\";\nItemSeparator.displayName = \"Item.Separator\";\n"],"mappings":";;;;;;;;;;AAeA,MAAM,mBAAmB,cAAc,KAAK;AAE5C,SAAgB,UAAU,EAAE,WAAW,GAAG,SAA8C;CACtF,OACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO;EAChC,UAAA,oBAAC,OAAD;GACE,MAAK;GACL,aAAU;GACV,WAAW,GACT,mGACA,SACF;GACA,GAAI;EACL,CAAA;CACwB,CAAA;AAE/B;AAEA,SAAgB,cAAc,EAAE,WAAW,GAAG,SAAyD;CACrG,OACE,oBAAC,WAAD;EACE,aAAU;EACV,aAAY;EACZ,WAAW,eAAe,WAAW,MAAM;EAC3C,GAAI;CACL,CAAA;AAEL;AAEA,SAAgB,SAAS,EACvB,WACA,UAAU,WACV,OAAO,WACP,QACA,GAAG,SACiF;CACpF,MAAM,UAAU,WAAW,gBAAgB;CAC3C,OAAO,UAAU;EACf,gBAAgB;EAChB,OAAO,WACL,cAAc;GAAE;GAAS;GAAM;EAAU,CAAC,GAC1C,UAAU,EAAE,MAAM,WAAW,IAAI,KAAA,GACjC,KACF;EACA;CACF,CAAC;AACH;AAEA,SAAS,cAAc;AACvB,UAAU,cAAc;AACxB,cAAc,cAAc"}

package/components/loader/loader-variants.d.ts

@@ -0,0 +1,91 @@
+//#region src/components/loader/loader-variants.d.ts
+/**
+ * PUBLIC slot recipe. Consumers composing their own pending
+ * states borrow it from `@elmeragroup/fuse/loader`.
+ *
+ * - `variant` is intentionally single-valued (`default`) so future arms
+ *   (muted/inverse) are additive, not breaking.
+ * - `size` is a decorative icon-glyph axis, not a density rung:
+ * wrapper padding stays `p-4`.
+ */
+export declare const loaderVariants: import("tailwind-variants").TVReturnType<{
+  variant: {
+    default: {
+      base: string;
+    };
+  };
+  size: {
+    default: {
+      icon: string;
+    };
+    small: {
+      icon: string;
+    };
+    medium: {
+      icon: string;
+    };
+    large: {
+      icon: string;
+    };
+    xl: {
+      icon: string;
+    };
+  };
+}, {
+  base: string;
+  icon: string;
+}, undefined, {
+  variant: {
+    default: {
+      base: string;
+    };
+  };
+  size: {
+    default: {
+      icon: string;
+    };
+    small: {
+      icon: string;
+    };
+    medium: {
+      icon: string;
+    };
+    large: {
+      icon: string;
+    };
+    xl: {
+      icon: string;
+    };
+  };
+}, {
+  base: string;
+  icon: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  variant: {
+    default: {
+      base: string;
+    };
+  };
+  size: {
+    default: {
+      icon: string;
+    };
+    small: {
+      icon: string;
+    };
+    medium: {
+      icon: string;
+    };
+    large: {
+      icon: string;
+    };
+    xl: {
+      icon: string;
+    };
+  };
+}, {
+  base: string;
+  icon: string;
+}>>;
+//#endregion
+//# sourceMappingURL=loader-variants.d.ts.map

package/components/loader/loader-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loader-variants.d.ts","names":[],"sources":["../../../src/components/loader/loader-variants.ts"],"mappings":";;;;;;;;;;qBAWa,4CAAc;;IAOrB;MACE;;;;IAIF;MACE;;IAEF;MACE;;IAGF;MACE;;IAGF;MACE;;IAGF;MACE"}

package/components/loader/loader-variants.js

@@ -0,0 +1,35 @@
+import { tv } from "tailwind-variants";
+//#region src/components/loader/loader-variants.ts
+/**
+* PUBLIC slot recipe. Consumers composing their own pending
+* states borrow it from `@elmeragroup/fuse/loader`.
+*
+* - `variant` is intentionally single-valued (`default`) so future arms
+*   (muted/inverse) are additive, not breaking.
+* - `size` is a decorative icon-glyph axis, not a density rung:
+* wrapper padding stays `p-4`.
+*/
+const loaderVariants = tv({
+	slots: {
+		base: "flex items-center justify-center p-4",
+		icon: "animate-spin"
+	},
+	variants: {
+		variant: { default: { base: "text-foreground" } },
+		size: {
+			default: { icon: "size-4" },
+			small: { icon: "size-3" },
+			medium: { icon: "size-6" },
+			large: { icon: "size-8" },
+			xl: { icon: "size-10" }
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+//#endregion
+export { loaderVariants };
+
+//# sourceMappingURL=loader-variants.js.map

package/components/loader/loader-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loader-variants.js","names":[],"sources":["../../../src/components/loader/loader-variants.ts"],"sourcesContent":["import { tv } from \"tailwind-variants\";\n\n/**\n * PUBLIC slot recipe. Consumers composing their own pending\n * states borrow it from `@elmeragroup/fuse/loader`.\n *\n * - `variant` is intentionally single-valued (`default`) so future arms\n *   (muted/inverse) are additive, not breaking.\n * - `size` is a decorative icon-glyph axis, not a density rung:\n * wrapper padding stays `p-4`.\n */\nexport const loaderVariants = tv({\n  slots: {\n    base: \"flex items-center justify-center p-4\",\n    icon: \"animate-spin\",\n  },\n  variants: {\n    variant: {\n      default: {\n        base: \"text-foreground\",\n      },\n    },\n    size: {\n      default: {\n        icon: \"size-4\",\n      },\n      small: {\n        icon: \"size-3\",\n      },\n      // oxlint-disable-next-line elmera/no-hardcoded-density-metrics -- decorative icon-glyph axis, not a control-box rung\n      medium: {\n        icon: \"size-6\",\n      },\n      // oxlint-disable-next-line elmera/no-hardcoded-density-metrics -- decorative icon-glyph axis, not a control-box rung\n      large: {\n        icon: \"size-8\",\n      },\n      // oxlint-disable-next-line elmera/no-hardcoded-density-metrics -- decorative icon-glyph axis, not a control-box rung\n      xl: {\n        icon: \"size-10\",\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n    size: \"default\",\n  },\n});\n"],"mappings":";;;;;;;;;;;AAWA,MAAa,iBAAiB,GAAG;CAC/B,OAAO;EACL,MAAM;EACN,MAAM;CACR;CACA,UAAU;EACR,SAAS,EACP,SAAS,EACP,MAAM,kBACR,EACF;EACA,MAAM;GACJ,SAAS,EACP,MAAM,SACR;GACA,OAAO,EACL,MAAM,SACR;GAEA,QAAQ,EACN,MAAM,SACR;GAEA,OAAO,EACL,MAAM,SACR;GAEA,IAAI,EACF,MAAM,UACR;EACF;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC"}