@ecsplico/editor 0.0.0-stage → 1.0.0

package/dist/react/simple.d.ts

@@ -0,0 +1,2 @@
+import { SimpleEditor, SimpleEditorProps } from "./SimpleEditor.js";
+export { SimpleEditor, type SimpleEditorProps };

package/dist/react/simple.js

@@ -0,0 +1 @@
+export { SimpleEditor } from "./SimpleEditor.js";

package/dist/react/styles/advanced.css

@@ -0,0 +1,18 @@
+/*
+ * Everything a React host needs to style the advanced editor, in the order the Nuxt module registers the feature
+ * sheets (`nuxt/module.ts`): the shadcn token mapping first, `themes.css` last so a theme overrides the rest.
+ * Import it once after Tailwind: `@import "@ecsplico/editor/react/styles/advanced.css";`
+ */
+@import "./ui-vars.css";
+@import "../../styles/core.css";
+@import "../../styles/media.css";
+@import "../../styles/mentions.css";
+@import "../../styles/authors.css";
+@import "../../styles/comments.css";
+@import "../../styles/transcript.css";
+@import "../../styles/composites.css";
+@import "../../styles/ai.css";
+@import "../../styles/collab.css";
+@import "../../styles/block-ui.css";
+@import "../../styles/themes.css";
+@import "./themes-bridge.css";

package/dist/react/styles/themes-bridge.css

@@ -0,0 +1,26 @@
+/*
+ * Obsidian themes on the React surface: `themes.css` maps Obsidian's variables onto the `--sk-*` tokens the feature
+ * sheets read; shadcn/ui components and the host page read the shadcn tokens instead, so they follow the theme here.
+ * `html.obsidian-theme` outranks the host's own `:root`/`.dark` token blocks wherever they are declared.
+ */
+html.obsidian-theme {
+  --background: var(--background-primary);
+  --foreground: var(--text-normal);
+  --card: var(--background-primary);
+  --card-foreground: var(--text-normal);
+  --popover: var(--background-primary);
+  --popover-foreground: var(--text-normal);
+  --primary: var(--interactive-accent);
+  --primary-foreground: var(--text-on-accent);
+  --secondary: var(--background-secondary);
+  --secondary-foreground: var(--text-normal);
+  --muted: var(--background-secondary);
+  --muted-foreground: var(--text-muted);
+  --accent: var(--background-modifier-hover);
+  --accent-foreground: var(--text-normal);
+  --destructive: var(--color-red);
+  --border: var(--background-modifier-border);
+  /* Form control borders and the unchecked switch track: the plain border colour vanishes against the panel. */
+  --input: var(--background-modifier-border-hover);
+  --ring: var(--interactive-accent);
+}

package/dist/react/styles/ui-vars.css

@@ -0,0 +1,20 @@
+/* The React surface's token map: the `--sk-*` variables the feature stylesheets (`styles/*.css`) read resolve to the
+   shadcn/ui theme tokens (the counterpart of `vue/kit/nuxt-ui.css` and `vue/kit/primevue.css`). */
+:root,
+.dark {
+  --sk-bg: var(--background);
+  --sk-fg: var(--foreground);
+  --sk-fg-highlighted: var(--foreground);
+  --sk-fg-toned: var(--foreground);
+  --sk-fg-dimmed: var(--muted-foreground);
+  --sk-muted: var(--muted-foreground);
+  --sk-border: var(--border);
+  --sk-border-accented: var(--border);
+  --sk-primary: var(--primary);
+  --sk-primary-fg: var(--primary-foreground);
+  --sk-success: oklch(0.72 0.19 150);
+  --sk-danger: var(--destructive);
+  --sk-radius: var(--radius);
+  --sk-bg-elevated: var(--card);
+  --sk-bg-accented: var(--accent);
+}

package/dist/react/suggestion-renderer.d.ts

@@ -0,0 +1,12 @@
+import { SuggestionListProps, SuggestionPopupRenderer } from "../core/suggestion-popup.js";
+//#region src/react/suggestion-renderer.d.ts
+export interface SuggestionListHandle {
+  /** Called from the suggestion plugin's `onKeyDown`; `true` = handled (the editor ignores the key). */
+  onKeyDown(event: KeyboardEvent): boolean;
+}
+/** Rendered by `createSuggestionRender()` through `reactSuggestionRenderer`; items stay opaque here, `display` describes them. */
+export declare const SuggestionList: import("react").ForwardRefExoticComponent<SuggestionListProps & import("react").RefAttributes<SuggestionListHandle>>;
+/** Mounts `SuggestionList` as the popup of every `@tiptap/suggestion` trigger; the React surface registers it through `SuggestionPopup`. */
+export declare const reactSuggestionRenderer: SuggestionPopupRenderer;
+//#endregion
+//# sourceMappingURL=suggestion-renderer.d.ts.map

package/dist/react/suggestion-renderer.js

@@ -0,0 +1,90 @@
+import { cn } from "./ui/utils.js";
+import { Icon } from "./Icon.js";
+import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ReactRenderer } from "@tiptap/react";
+//#region src/react/suggestion-renderer.tsx
+/** Rendered by `createSuggestionRender()` through `reactSuggestionRenderer`; items stay opaque here, `display` describes them. */
+const SuggestionList = forwardRef(function SuggestionList({ items, display, command, loading, loadingText, emptyText }, ref) {
+	const rows = useMemo(() => items.map((item) => display(item)), [items, display]);
+	const [selected, setSelected] = useState(0);
+	const selectedRef = useRef(0);
+	const list = useRef(null);
+	const select = (index) => {
+		selectedRef.current = index;
+		setSelected(index);
+	};
+	useEffect(() => {
+		selectedRef.current = 0;
+		setSelected(0);
+	}, [items]);
+	useEffect(() => {
+		list.current?.children[selected]?.scrollIntoView({ block: "nearest" });
+	}, [selected]);
+	const pick = (index) => {
+		const item = items[index];
+		if (item !== void 0) command(item);
+	};
+	useImperativeHandle(ref, () => ({ onKeyDown(event) {
+		const count = items.length;
+		if (!count) return false;
+		if (event.key === "ArrowDown") select((selectedRef.current + 1) % count);
+		else if (event.key === "ArrowUp") select((selectedRef.current - 1 + count) % count);
+		else if (event.key === "Enter" || event.key === "Tab") pick(selectedRef.current);
+		else return false;
+		return true;
+	} }));
+	return /* @__PURE__ */ jsx("div", {
+		className: "max-h-64 min-w-48 overflow-y-auto rounded-md border bg-popover p-1 text-sm text-popover-foreground shadow-lg",
+		children: rows.length ? /* @__PURE__ */ jsx("ul", {
+			ref: list,
+			role: "listbox",
+			className: "m-0 list-none p-0",
+			children: rows.map((row, index) => /* @__PURE__ */ jsxs("li", {
+				role: "option",
+				"aria-selected": index === selected,
+				className: cn("flex cursor-pointer items-center gap-2 rounded px-2 py-1.5", index === selected && "bg-accent text-accent-foreground"),
+				onMouseEnter: () => select(index),
+				onMouseDown: (event) => {
+					event.preventDefault();
+					pick(index);
+				},
+				children: [
+					row.icon && /* @__PURE__ */ jsx(Icon, {
+						name: row.icon,
+						style: { color: row.color }
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "truncate",
+						style: { color: row.color },
+						children: row.label
+					}),
+					row.description && /* @__PURE__ */ jsx("span", {
+						className: "ml-auto truncate text-xs text-muted-foreground",
+						children: row.description
+					})
+				]
+			}, index))
+		}) : /* @__PURE__ */ jsx("p", {
+			className: "px-2 py-1.5 text-muted-foreground",
+			children: loading ? loadingText : emptyText
+		})
+	});
+});
+/** Mounts `SuggestionList` as the popup of every `@tiptap/suggestion` trigger; the React surface registers it through `SuggestionPopup`. */
+const reactSuggestionRenderer = (props, editor) => {
+	const renderer = new ReactRenderer(SuggestionList, {
+		props,
+		editor
+	});
+	return {
+		element: renderer.element,
+		update: (p) => renderer.updateProps(p),
+		onKeyDown: (e) => renderer.ref?.onKeyDown(e) ?? false,
+		destroy: () => renderer.destroy()
+	};
+};
+//#endregion
+export { SuggestionList, reactSuggestionRenderer };
+
+//# sourceMappingURL=suggestion-renderer.js.map

package/dist/react/suggestion-renderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"suggestion-renderer.js","names":[],"sources":["../../src/react/suggestion-renderer.tsx"],"sourcesContent":["import { ReactRenderer } from '@tiptap/react'\nimport { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport type { SuggestionListProps, SuggestionPopupRenderer } from '../core/suggestion-popup'\nimport { Icon } from './Icon'\nimport { cn } from './ui/utils'\n\nexport interface SuggestionListHandle {\n  /** Called from the suggestion plugin's `onKeyDown`; `true` = handled (the editor ignores the key). */\n  onKeyDown(event: KeyboardEvent): boolean\n}\n\n/** Rendered by `createSuggestionRender()` through `reactSuggestionRenderer`; items stay opaque here, `display` describes them. */\nexport const SuggestionList = forwardRef<SuggestionListHandle, SuggestionListProps>(function SuggestionList({ items, display, command, loading, loadingText, emptyText }, ref) {\n  const rows = useMemo(() => items.map(item => display(item)), [items, display])\n  const [selected, setSelected] = useState(0)\n  const selectedRef = useRef(0)\n  const list = useRef<HTMLUListElement>(null)\n\n  const select = (index: number) => {\n    selectedRef.current = index\n    setSelected(index)\n  }\n\n  useEffect(() => {\n    selectedRef.current = 0\n    setSelected(0)\n  }, [items])\n\n  useEffect(() => {\n    list.current?.children[selected]?.scrollIntoView({ block: 'nearest' })\n  }, [selected])\n\n  const pick = (index: number) => {\n    const item = items[index]\n    if (item !== undefined) command(item)\n  }\n\n  useImperativeHandle(ref, () => ({\n    onKeyDown(event) {\n      const count = items.length\n      if (!count) return false\n      if (event.key === 'ArrowDown') select((selectedRef.current + 1) % count)\n      else if (event.key === 'ArrowUp') select((selectedRef.current - 1 + count) % count)\n      else if (event.key === 'Enter' || event.key === 'Tab') pick(selectedRef.current)\n      else return false\n      return true\n    },\n  }))\n\n  return (\n    <div className=\"max-h-64 min-w-48 overflow-y-auto rounded-md border bg-popover p-1 text-sm text-popover-foreground shadow-lg\">\n      {rows.length\n        ? (\n            // Utilities beat the `.tiptap ul` typography (components layer) when the list is rendered inside the editor (speaker field).\n            <ul ref={list} role=\"listbox\" className=\"m-0 list-none p-0\">\n              {rows.map((row, index) => (\n                <li\n                  key={index}\n                  role=\"option\"\n                  aria-selected={index === selected}\n                  className={cn('flex cursor-pointer items-center gap-2 rounded px-2 py-1.5', index === selected && 'bg-accent text-accent-foreground')}\n                  onMouseEnter={() => select(index)}\n                  onMouseDown={(event) => {\n                    event.preventDefault()\n                    pick(index)\n                  }}\n                >\n                  {row.icon && <Icon name={row.icon} style={{ color: row.color }} />}\n                  <span className=\"truncate\" style={{ color: row.color }}>{row.label}</span>\n                  {row.description && <span className=\"ml-auto truncate text-xs text-muted-foreground\">{row.description}</span>}\n                </li>\n              ))}\n            </ul>\n          )\n        : <p className=\"px-2 py-1.5 text-muted-foreground\">{loading ? loadingText : emptyText}</p>}\n    </div>\n  )\n})\n\n/** Mounts `SuggestionList` as the popup of every `@tiptap/suggestion` trigger; the React surface registers it through `SuggestionPopup`. */\nexport const reactSuggestionRenderer: SuggestionPopupRenderer = (props, editor) => {\n  const renderer = new ReactRenderer<SuggestionListHandle, SuggestionListProps>(SuggestionList, { props, editor })\n  return {\n    element: renderer.element,\n    update: p => renderer.updateProps(p),\n    onKeyDown: e => renderer.ref?.onKeyDown(e) ?? false,\n    destroy: () => renderer.destroy(),\n  }\n}\n"],"mappings":";;;;;;;AAYA,MAAa,iBAAiB,WAAsD,SAAS,eAAe,EAAE,OAAO,SAAS,SAAS,SAAS,aAAa,aAAa,KAAK;CAC7K,MAAM,OAAO,cAAc,MAAM,KAAI,SAAQ,QAAQ,IAAI,CAAC,GAAG,CAAC,OAAO,OAAO,CAAC;CAC7E,MAAM,CAAC,UAAU,eAAe,SAAS,CAAC;CAC1C,MAAM,cAAc,OAAO,CAAC;CAC5B,MAAM,OAAO,OAAyB,IAAI;CAE1C,MAAM,UAAU,UAAkB;EAChC,YAAY,UAAU;EACtB,YAAY,KAAK;CACnB;CAEA,gBAAgB;EACd,YAAY,UAAU;EACtB,YAAY,CAAC;CACf,GAAG,CAAC,KAAK,CAAC;CAEV,gBAAgB;EACd,KAAK,SAAS,SAAS,SAAS,EAAE,eAAe,EAAE,OAAO,UAAU,CAAC;CACvE,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,QAAQ,UAAkB;EAC9B,MAAM,OAAO,MAAM;EACnB,IAAI,SAAS,KAAA,GAAW,QAAQ,IAAI;CACtC;CAEA,oBAAoB,YAAY,EAC9B,UAAU,OAAO;EACf,MAAM,QAAQ,MAAM;EACpB,IAAI,CAAC,OAAO,OAAO;EACnB,IAAI,MAAM,QAAQ,aAAa,QAAQ,YAAY,UAAU,KAAK,KAAK;OAClE,IAAI,MAAM,QAAQ,WAAW,QAAQ,YAAY,UAAU,IAAI,SAAS,KAAK;OAC7E,IAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,OAAO,KAAK,YAAY,OAAO;OAC1E,OAAO;EACZ,OAAO;CACT,EACF,EAAE;CAEF,OACE,oBAAC,OAAD;EAAK,WAAU;EACZ,UAAA,KAAK,SAGA,oBAAC,MAAD;GAAI,KAAK;GAAM,MAAK;GAAU,WAAU;GACrC,UAAA,KAAK,KAAK,KAAK,UACd,qBAAC,MAAD;IAEE,MAAK;IACL,iBAAe,UAAU;IACzB,WAAW,GAAG,8DAA8D,UAAU,YAAY,kCAAkC;IACpI,oBAAoB,OAAO,KAAK;IAChC,cAAc,UAAU;KACtB,MAAM,eAAe;KACrB,KAAK,KAAK;IACZ;IATF,UAAA;KAWG,IAAI,QAAQ,oBAAC,MAAD;MAAM,MAAM,IAAI;MAAM,OAAO,EAAE,OAAO,IAAI,MAAM;KAAI,CAAA;KACjE,oBAAC,QAAD;MAAM,WAAU;MAAW,OAAO,EAAE,OAAO,IAAI,MAAM;MAAI,UAAA,IAAI;KAAY,CAAA;KACxE,IAAI,eAAe,oBAAC,QAAD;MAAM,WAAU;MAAkD,UAAA,IAAI;KAAkB,CAAA;IAC1G;GAbG,GAAA,KAaH,CACL;EACC,CAAA,IAEN,oBAAC,KAAD;GAAG,WAAU;GAAqC,UAAA,UAAU,cAAc;EAAa,CAAA;CACxF,CAAA;AAET,CAAC;;AAGD,MAAa,2BAAoD,OAAO,WAAW;CACjF,MAAM,WAAW,IAAI,cAAyD,gBAAgB;EAAE;EAAO;CAAO,CAAC;CAC/G,OAAO;EACL,SAAS,SAAS;EAClB,SAAQ,MAAK,SAAS,YAAY,CAAC;EACnC,YAAW,MAAK,SAAS,KAAK,UAAU,CAAC,KAAK;EAC9C,eAAe,SAAS,QAAQ;CAClC;AACF"}

package/dist/react/ui/alert.js

@@ -0,0 +1,38 @@
+import { cn } from "./utils.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+//#region src/react/ui/alert.tsx
+const alertVariants = cva("group/alert relative grid w-full gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4", {
+	variants: { variant: {
+		default: "bg-card text-card-foreground",
+		destructive: "bg-card text-destructive *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function Alert({ className, variant, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert",
+		role: "alert",
+		className: cn(alertVariants({ variant }), className),
+		...props
+	});
+}
+function AlertTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-title",
+		className: cn("font-medium group-has-[>svg]/alert:col-start-2 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground", className),
+		...props
+	});
+}
+function AlertDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "alert-description",
+		className: cn("text-sm text-balance text-muted-foreground md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4", className),
+		...props
+	});
+}
+//#endregion
+export { Alert, AlertDescription, AlertTitle };
+
+//# sourceMappingURL=alert.js.map

package/dist/react/ui/alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert.js","names":[],"sources":["../../../src/react/ui/alert.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"./utils\"\n\nconst alertVariants = cva(\n  \"group/alert relative grid w-full gap-0.5 rounded-lg border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-card text-card-foreground\",\n        destructive:\n          \"bg-card text-destructive *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Alert({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(\n        \"font-medium group-has-[>svg]/alert:col-start-2 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\n        \"text-sm text-balance text-muted-foreground md:text-pretty [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-action\"\n      className={cn(\"absolute top-2 right-2\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Alert, AlertTitle, AlertDescription, AlertAction }\n"],"mappings":";;;;;AAIA,MAAM,gBAAgB,IACpB,6TACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,aACE;CACJ,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAEA,SAAS,MAAM,EACb,WACA,SACA,GAAG,SACgE;CACnE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,uHACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SAC2B;CAC9B,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,8JACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/react/ui/avatar.js

@@ -0,0 +1,24 @@
+import { cn } from "./utils.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { Avatar } from "radix-ui";
+//#region src/react/ui/avatar.tsx
+function Avatar$1({ className, size = "default", ...props }) {
+	return /* @__PURE__ */ jsx(Avatar.Root, {
+		"data-slot": "avatar",
+		"data-size": size,
+		className: cn("group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten", className),
+		...props
+	});
+}
+function AvatarFallback({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Avatar.Fallback, {
+		"data-slot": "avatar-fallback",
+		className: cn("flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs", className),
+		...props
+	});
+}
+//#endregion
+export { Avatar$1 as Avatar, AvatarFallback };
+
+//# sourceMappingURL=avatar.js.map

package/dist/react/ui/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.js","names":["Avatar","AvatarPrimitive"],"sources":["../../../src/react/ui/avatar.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cn } from \"./utils\"\nimport { Avatar as AvatarPrimitive } from \"radix-ui\"\n\nfunction Avatar({\n  className,\n  size = \"default\",\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root> & {\n  size?: \"default\" | \"sm\" | \"lg\"\n}) {\n  return (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      data-size={size}\n      className={cn(\n        \"group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarImage({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n  return (\n    <AvatarPrimitive.Image\n      data-slot=\"avatar-image\"\n      className={cn(\n        \"aspect-square size-full rounded-full object-cover\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarFallback({\n  className,\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n  return (\n    <AvatarPrimitive.Fallback\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        \"flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"avatar-badge\"\n      className={cn(\n        \"absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground bg-blend-color ring-2 ring-background select-none\",\n        \"group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden\",\n        \"group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2\",\n        \"group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"avatar-group\"\n      className={cn(\n        \"group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AvatarGroupCount({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"avatar-group-count\"\n      className={cn(\n        \"relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Avatar,\n  AvatarImage,\n  AvatarFallback,\n  AvatarGroup,\n  AvatarGroupCount,\n  AvatarBadge,\n}\n"],"mappings":";;;;;AAIA,SAASA,SAAO,EACd,WACA,OAAO,WACP,GAAG,SAGF;CACD,OACE,oBAACC,OAAgB,MAAjB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,yPACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAkBA,SAAS,eAAe,EACtB,WACA,GAAG,SACqD;CACxD,OACE,oBAACA,OAAgB,UAAjB;EACE,aAAU;EACV,WAAW,GACT,sIACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/react/ui/badge.js

@@ -0,0 +1,30 @@
+import { cn } from "./utils.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Slot } from "radix-ui";
+//#region src/react/ui/badge.tsx
+const badgeVariants = cva("group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!", {
+	variants: { variant: {
+		default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
+		secondary: "bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80",
+		destructive: "bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20",
+		outline: "border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground",
+		ghost: "hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50",
+		link: "text-primary underline-offset-4 hover:underline"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function Badge({ className, variant = "default", asChild = false, ...props }) {
+	const Comp = asChild ? Slot.Root : "span";
+	return /* @__PURE__ */ jsx(Comp, {
+		"data-slot": "badge",
+		"data-variant": variant,
+		className: cn(badgeVariants({ variant }), className),
+		...props
+	});
+}
+//#endregion
+export { Badge, badgeVariants };
+
+//# sourceMappingURL=badge.js.map

package/dist/react/ui/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.js","names":[],"sources":["../../../src/react/ui/badge.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"./utils\"\nimport { Slot } from \"radix-ui\"\n\nconst badgeVariants = cva(\n  \"group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a]:hover:bg-primary/80\",\n        secondary:\n          \"bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80\",\n        destructive:\n          \"bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20\",\n        outline:\n          \"border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Badge({\n  className,\n  variant = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"span\"> &\n  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot.Root : \"span\"\n\n  return (\n    <Comp\n      data-slot=\"badge\"\n      data-variant={variant}\n      className={cn(badgeVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Badge, badgeVariants }\n"],"mappings":";;;;;;AAKA,MAAM,gBAAgB,IACpB,8eACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,WACE;EACF,aACE;EACF,SACE;EACF,OACE;EACF,MAAM;CACR,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAEA,SAAS,MAAM,EACb,WACA,UAAU,WACV,UAAU,OACV,GAAG,SAEyD;CAC5D,MAAM,OAAO,UAAU,KAAK,OAAO;CAEnC,OACE,oBAAC,MAAD;EACE,aAAU;EACV,gBAAc;EACd,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL"}

package/dist/react/ui/button.js

@@ -0,0 +1,50 @@
+import { cn } from "./utils.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Slot } from "radix-ui";
+//#region src/react/ui/button.tsx
+const buttonVariants = cva("group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 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/80",
+			outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+			secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+			ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+			destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+			link: "text-primary underline-offset-4 hover:underline"
+		},
+		size: {
+			default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+			xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+			sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+			lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+			icon: "size-8",
+			"icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+			"icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+			"icon-lg": "size-9"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function Button({ className, variant = "default", size = "default", asChild = false, ...props }) {
+	const Comp = asChild ? Slot.Root : "button";
+	return /* @__PURE__ */ jsx(Comp, {
+		"data-slot": "button",
+		"data-variant": variant,
+		"data-size": size,
+		className: cn(buttonVariants({
+			variant,
+			size,
+			className
+		})),
+		...props
+	});
+}
+//#endregion
+export { Button, buttonVariants };
+
+//# sourceMappingURL=button.js.map

package/dist/react/ui/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","names":[],"sources":["../../../src/react/ui/button.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"./utils\"\nimport { Slot } from \"radix-ui\"\n\nconst buttonVariants = cva(\n  \"group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/80\",\n        outline:\n          \"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n        ghost:\n          \"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50\",\n        destructive:\n          \"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default:\n          \"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        xs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: \"h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n        icon: \"size-8\",\n        \"icon-xs\":\n          \"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\":\n          \"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg\",\n        \"icon-lg\": \"size-9\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"button\"> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean\n  }) {\n  const Comp = asChild ? Slot.Root : \"button\"\n\n  return (\n    <Comp\n      data-slot=\"button\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n"],"mappings":";;;;;;AAKA,MAAM,iBAAiB,IACrB,8lBACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SACE;GACF,WACE;GACF,OACE;GACF,aACE;GACF,MAAM;EACR;EACA,MAAM;GACJ,SACE;GACF,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GACN,WACE;GACF,WACE;GACF,WAAW;EACb;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;AAEA,SAAS,OAAO,EACd,WACA,UAAU,WACV,OAAO,WACP,UAAU,OACV,GAAG,SAIA;CACH,MAAM,OAAO,UAAU,KAAK,OAAO;CAEnC,OACE,oBAAC,MAAD;EACE,aAAU;EACV,gBAAc;EACd,aAAW;EACX,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAAC;EAC1D,GAAI;CACL,CAAA;AAEL"}

package/dist/react/ui/collapsible.js

@@ -0,0 +1,19 @@
+import { jsx } from "react/jsx-runtime";
+import { Collapsible } from "radix-ui";
+//#region src/react/ui/collapsible.tsx
+function Collapsible$1({ ...props }) {
+	return /* @__PURE__ */ jsx(Collapsible.Root, {
+		"data-slot": "collapsible",
+		...props
+	});
+}
+function CollapsibleContent({ ...props }) {
+	return /* @__PURE__ */ jsx(Collapsible.CollapsibleContent, {
+		"data-slot": "collapsible-content",
+		...props
+	});
+}
+//#endregion
+export { Collapsible$1 as Collapsible, CollapsibleContent };
+
+//# sourceMappingURL=collapsible.js.map

package/dist/react/ui/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible.js","names":["Collapsible","CollapsiblePrimitive"],"sources":["../../../src/react/ui/collapsible.tsx"],"sourcesContent":["import { Collapsible as CollapsiblePrimitive } from \"radix-ui\"\n\nfunction Collapsible({\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Root>) {\n  return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />\n}\n\nfunction CollapsibleTrigger({\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>) {\n  return (\n    <CollapsiblePrimitive.CollapsibleTrigger\n      data-slot=\"collapsible-trigger\"\n      {...props}\n    />\n  )\n}\n\nfunction CollapsibleContent({\n  ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>) {\n  return (\n    <CollapsiblePrimitive.CollapsibleContent\n      data-slot=\"collapsible-content\"\n      {...props}\n    />\n  )\n}\n\nexport { Collapsible, CollapsibleTrigger, CollapsibleContent }\n"],"mappings":";;;AAEA,SAASA,cAAY,EACnB,GAAG,SACsD;CACzD,OAAO,oBAACC,YAAqB,MAAtB;EAA2B,aAAU;EAAc,GAAI;CAAQ,CAAA;AACxE;AAaA,SAAS,mBAAmB,EAC1B,GAAG,SACoE;CACvE,OACE,oBAACA,YAAqB,oBAAtB;EACE,aAAU;EACV,GAAI;CACL,CAAA;AAEL"}

package/dist/react/ui/command.js

@@ -0,0 +1,47 @@
+import { cn } from "./utils.js";
+import { InputGroup, InputGroupAddon } from "./input-group.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CheckIcon, SearchIcon } from "lucide-react";
+import { Command } from "cmdk";
+//#region src/react/ui/command.tsx
+function Command$1({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command, {
+		"data-slot": "command",
+		className: cn("flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground", className),
+		...props
+	});
+}
+function CommandInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "command-input-wrapper",
+		className: "p-1 pb-0",
+		children: /* @__PURE__ */ jsxs(InputGroup, {
+			className: "h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!",
+			children: [/* @__PURE__ */ jsx(Command.Input, {
+				"data-slot": "command-input",
+				className: cn("w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className),
+				...props
+			}), /* @__PURE__ */ jsx(InputGroupAddon, { children: /* @__PURE__ */ jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }) })]
+		})
+	});
+}
+function CommandList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Command.List, {
+		"data-slot": "command-list",
+		className: cn("no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none", className),
+		...props
+	});
+}
+function CommandItem({ className, children, ...props }) {
+	return /* @__PURE__ */ jsxs(Command.Item, {
+		"data-slot": "command-item",
+		className: cn("group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-selected:bg-muted data-selected:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-selected:*:[svg]:text-foreground", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(CheckIcon, { className: "ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" })]
+	});
+}
+//#endregion
+export { Command$1 as Command, CommandInput, CommandItem, CommandList };
+
+//# sourceMappingURL=command.js.map

package/dist/react/ui/command.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command.js","names":["Command","CommandPrimitive"],"sources":["../../../src/react/ui/command.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Command as CommandPrimitive } from \"cmdk\"\nimport { cn } from \"./utils\"\n\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogHeader,\n  DialogTitle,\n} from \"./dialog\"\nimport {\n  InputGroup,\n  InputGroupAddon,\n} from \"./input-group\"\nimport { SearchIcon, CheckIcon } from \"lucide-react\"\n\nfunction Command({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive>) {\n  return (\n    <CommandPrimitive\n      data-slot=\"command\"\n      className={cn(\n        \"flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CommandDialog({\n  title = \"Command Palette\",\n  description = \"Search for a command to run...\",\n  children,\n  className,\n  showCloseButton = false,\n  ...props\n}: React.ComponentProps<typeof Dialog> & {\n  title?: string\n  description?: string\n  className?: string\n  showCloseButton?: boolean\n}) {\n  return (\n    <Dialog {...props}>\n      <DialogHeader className=\"sr-only\">\n        <DialogTitle>{title}</DialogTitle>\n        <DialogDescription>{description}</DialogDescription>\n      </DialogHeader>\n      <DialogContent\n        className={cn(\n          \"top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0\",\n          className\n        )}\n        showCloseButton={showCloseButton}\n      >\n        {children}\n      </DialogContent>\n    </Dialog>\n  )\n}\n\nfunction CommandInput({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Input>) {\n  return (\n    <div data-slot=\"command-input-wrapper\" className=\"p-1 pb-0\">\n      <InputGroup className=\"h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!\">\n        <CommandPrimitive.Input\n          data-slot=\"command-input\"\n          className={cn(\n            \"w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50\",\n            className\n          )}\n          {...props}\n        />\n        <InputGroupAddon>\n          <SearchIcon className=\"size-4 shrink-0 opacity-50\" />\n        </InputGroupAddon>\n      </InputGroup>\n    </div>\n  )\n}\n\nfunction CommandList({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.List>) {\n  return (\n    <CommandPrimitive.List\n      data-slot=\"command-list\"\n      className={cn(\n        \"no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CommandEmpty({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Empty>) {\n  return (\n    <CommandPrimitive.Empty\n      data-slot=\"command-empty\"\n      className={cn(\"py-6 text-center text-sm\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CommandGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Group>) {\n  return (\n    <CommandPrimitive.Group\n      data-slot=\"command-group\"\n      className={cn(\n        \"overflow-hidden p-1 text-foreground **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:text-muted-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CommandSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Separator>) {\n  return (\n    <CommandPrimitive.Separator\n      data-slot=\"command-separator\"\n      className={cn(\"-mx-1 h-px bg-border\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CommandItem({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof CommandPrimitive.Item>) {\n  return (\n    <CommandPrimitive.Item\n      data-slot=\"command-item\"\n      className={cn(\n        \"group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-selected:bg-muted data-selected:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-selected:*:[svg]:text-foreground\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <CheckIcon className=\"ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100\" />\n    </CommandPrimitive.Item>\n  )\n}\n\nfunction CommandShortcut({\n  className,\n  ...props\n}: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"command-shortcut\"\n      className={cn(\n        \"ml-auto text-xs tracking-widest text-muted-foreground group-data-selected/command-item:text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandShortcut,\n  CommandSeparator,\n}\n"],"mappings":";;;;;;;AAiBA,SAASA,UAAQ,EACf,WACA,GAAG,SAC6C;CAChD,OACE,oBAACC,SAAD;EACE,aAAU;EACV,WAAW,GACT,8FACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAkCA,SAAS,aAAa,EACpB,WACA,GAAG,SACmD;CACtD,OACE,oBAAC,OAAD;EAAK,aAAU;EAAwB,WAAU;EAC/C,UAAA,qBAAC,YAAD;GAAY,WAAU;GAAtB,UAAA,CACE,oBAACA,QAAiB,OAAlB;IACE,aAAU;IACV,WAAW,GACT,iFACA,SACF;IACA,GAAI;GACL,CAAA,GACD,oBAAC,iBAAD,EAAA,UACE,oBAAC,YAAD,EAAY,WAAU,6BAA8B,CAAA,EACrC,CAAA,CACP;;CACT,CAAA;AAET;AAEA,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;CACrD,OACE,oBAACA,QAAiB,MAAlB;EACE,aAAU;EACV,WAAW,GACT,oFACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AA4CA,SAAS,YAAY,EACnB,WACA,UACA,GAAG,SACkD;CACrD,OACE,qBAACA,QAAiB,MAAlB;EACE,aAAU;EACV,WAAW,GACT,gaACA,SACF;EACA,GAAI;EANN,UAAA,CAQG,UACD,oBAAC,WAAD,EAAW,WAAU,kIAAmI,CAAA,CACnI;;AAE3B"}

package/dist/react/ui/dialog.js

@@ -0,0 +1,88 @@
+import { useEditorI18n } from "../use-editor-i18n.js";
+import { cn } from "./utils.js";
+import { Button } from "./button.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Dialog } from "radix-ui";
+import { XIcon } from "lucide-react";
+//#region src/react/ui/dialog.tsx
+function Dialog$1({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Root, {
+		"data-slot": "dialog",
+		...props
+	});
+}
+function DialogPortal({ ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Portal, {
+		"data-slot": "dialog-portal",
+		...props
+	});
+}
+function DialogOverlay({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Overlay, {
+		"data-slot": "dialog-overlay",
+		className: cn("fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0", className),
+		...props
+	});
+}
+function DialogContent({ className, children, showCloseButton = true, ...props }) {
+	const { t } = useEditorI18n();
+	return /* @__PURE__ */ jsxs(DialogPortal, { children: [/* @__PURE__ */ jsx(DialogOverlay, {}), /* @__PURE__ */ jsxs(Dialog.Content, {
+		"data-slot": "dialog-content",
+		className: cn("fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
+		...props,
+		children: [children, showCloseButton && /* @__PURE__ */ jsx(Dialog.Close, {
+			"data-slot": "dialog-close",
+			asChild: true,
+			children: /* @__PURE__ */ jsxs(Button, {
+				variant: "ghost",
+				className: "absolute top-2 right-2",
+				size: "icon-sm",
+				children: [/* @__PURE__ */ jsx(XIcon, {}), /* @__PURE__ */ jsx("span", {
+					className: "sr-only",
+					children: t("common.close")
+				})]
+			})
+		})]
+	})] });
+}
+function DialogHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "dialog-header",
+		className: cn("flex flex-col gap-2", className),
+		...props
+	});
+}
+function DialogFooter({ className, showCloseButton = false, children, ...props }) {
+	const { t } = useEditorI18n();
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "dialog-footer",
+		className: cn("-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end", className),
+		...props,
+		children: [children, showCloseButton && /* @__PURE__ */ jsx(Dialog.Close, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				variant: "outline",
+				children: t("common.close")
+			})
+		})]
+	});
+}
+function DialogTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Title, {
+		"data-slot": "dialog-title",
+		className: cn("font-heading text-base leading-none font-medium", className),
+		...props
+	});
+}
+function DialogDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Dialog.Description, {
+		"data-slot": "dialog-description",
+		className: cn("text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", className),
+		...props
+	});
+}
+//#endregion
+export { Dialog$1 as Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle };
+
+//# sourceMappingURL=dialog.js.map

package/dist/react/ui/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.js","names":["Dialog","DialogPrimitive"],"sources":["../../../src/react/ui/dialog.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cn } from \"./utils\"\nimport { Dialog as DialogPrimitive } from \"radix-ui\"\n\nimport { Button } from \"./button\"\nimport { XIcon } from \"lucide-react\"\nimport { useEditorI18n } from \"../use-editor-i18n\"\n\nfunction Dialog({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n  return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\n}\n\nfunction DialogTrigger({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n  return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n  return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n  return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n  return (\n    <DialogPrimitive.Overlay\n      data-slot=\"dialog-overlay\"\n      className={cn(\n        \"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DialogContent({\n  className,\n  children,\n  showCloseButton = true,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & {\n  showCloseButton?: boolean\n}) {\n  const { t } = useEditorI18n()\n  return (\n    <DialogPortal>\n      <DialogOverlay />\n      <DialogPrimitive.Content\n        data-slot=\"dialog-content\"\n        className={cn(\n          \"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <DialogPrimitive.Close data-slot=\"dialog-close\" asChild>\n            <Button\n              variant=\"ghost\"\n              className=\"absolute top-2 right-2\"\n              size=\"icon-sm\"\n            >\n              <XIcon\n              />\n              <span className=\"sr-only\">{t('common.close')}</span>\n            </Button>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Content>\n    </DialogPortal>\n  )\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"dialog-header\"\n      className={cn(\"flex flex-col gap-2\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction DialogFooter({\n  className,\n  showCloseButton = false,\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  showCloseButton?: boolean\n}) {\n  const { t } = useEditorI18n()\n  return (\n    <div\n      data-slot=\"dialog-footer\"\n      className={cn(\n        \"-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {showCloseButton && (\n        <DialogPrimitive.Close asChild>\n          <Button variant=\"outline\">{t('common.close')}</Button>\n        </DialogPrimitive.Close>\n      )}\n    </div>\n  )\n}\n\nfunction DialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Title>) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"dialog-title\"\n      className={cn(\n        \"font-heading text-base leading-none font-medium\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction DialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Description>) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"dialog-description\"\n      className={cn(\n        \"text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n}\n"],"mappings":";;;;;;;;AAQA,SAASA,SAAO,EACd,GAAG,SACiD;CACpD,OAAO,oBAACC,OAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;CAAQ,CAAA;AAC9D;AAQA,SAAS,aAAa,EACpB,GAAG,SACmD;CACtD,OAAO,oBAACA,OAAgB,QAAjB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAQA,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,OAAgB,SAAjB;EACE,aAAU;EACV,WAAW,GACT,yLACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EACrB,WACA,UACA,kBAAkB,MAClB,GAAG,SAGF;CACD,MAAM,EAAE,MAAM,cAAc;CAC5B,OACE,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,eAAD,CAAgB,CAAA,GAChB,qBAACA,OAAgB,SAAjB;EACE,aAAU;EACV,WAAW,GACT,0WACA,SACF;EACA,GAAI;EANN,UAAA,CAQG,UACA,mBACC,oBAACA,OAAgB,OAAjB;GAAuB,aAAU;GAAe,SAAA;GAC9C,UAAA,qBAAC,QAAD;IACE,SAAQ;IACR,WAAU;IACV,MAAK;IAHP,UAAA,CAKE,oBAAC,OAAD,CACC,CAAA,GACD,oBAAC,QAAD;KAAM,WAAU;KAAW,UAAA,EAAE,cAAc;IAAQ,CAAA,CAC7C;;EACa,CAAA,CAEF;CACb,CAAA,CAAA,EAAA,CAAA;AAElB;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,uBAAuB,SAAS;EAC9C,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,aAAa,EACpB,WACA,kBAAkB,OAClB,UACA,GAAG,SAGF;CACD,MAAM,EAAE,MAAM,cAAc;CAC5B,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,4GACA,SACF;EACA,GAAI;EANN,UAAA,CAQG,UACA,mBACC,oBAACA,OAAgB,OAAjB;GAAuB,SAAA;GACrB,UAAA,oBAAC,QAAD;IAAQ,SAAQ;IAAW,UAAA,EAAE,cAAc;GAAU,CAAA;EAChC,CAAA,CAEtB;;AAET;AAEA,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;CACrD,OACE,oBAACA,OAAgB,OAAjB;EACE,aAAU;EACV,WAAW,GACT,mDACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAACA,OAAgB,aAAjB;EACE,aAAU;EACV,WAAW,GACT,sGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}