@mangtre/ui 0.1.0

package/dist/chunk-X7T2DJLU.js

@@ -0,0 +1,113 @@
+import {
+  cx,
+  useAreaStyles,
+  useScope
+} from "./chunk-3AL4SUFD.js";
+import {
+  tokens
+} from "./chunk-PPOYMKV3.js";
+
+// src/sandbox/Sandbox.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var STYLE_ID = "mang-ui-sandbox";
+var { fontSize, fontWeight, radius, font } = tokens;
+var CSS = (
+  /* css */
+  `
+.mang-sbx { display: flex; flex-direction: column; border: 1px solid var(--m-line); border-radius: ${radius.lg}; overflow: clip; background: var(--m-surface); }
+.mang-sbx-bar { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.7rem; background: var(--m-sunken); border-bottom: 1px solid var(--m-line); font-size: ${fontSize.xs}; color: var(--m-text-muted); }
+.mang-sbx-origin { font-family: ui-monospace, monospace; }
+.mang-sbx-body { min-height: 8rem; }
+.mang-sbx-error { display: grid; gap: 0.4rem; justify-items: center; text-align: center; padding: 1.5rem; color: var(--m-danger-on); }
+.mang-scan-badge { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.18rem 0.55rem; border-radius: ${radius.full}; font-family: "${font.heading}", system-ui, sans-serif; font-weight: ${fontWeight.semibold}; font-size: ${fontSize.xs}; }
+.mang-scan-badge[data-level="safe"] { background: var(--m-success-soft); color: var(--m-success-on); }
+.mang-scan-badge[data-level="review"] { background: var(--m-warning-soft); color: var(--m-warning-on); }
+.mang-scan-badge[data-level="blocked"] { background: var(--m-danger-soft); color: var(--m-danger-on); }
+.mang-scan-list { display: grid; gap: 0.4rem; margin: 0; padding: 0; list-style: none; }
+.mang-scan-item { display: flex; gap: 0.5rem; padding: 0.5rem 0.65rem; border: 1px solid var(--m-line); border-radius: ${radius.md}; font-size: ${fontSize.sm}; background: var(--m-sunken); }
+.mang-scan-item[data-sev="error"] { border-left: 3px solid var(--m-danger); }
+.mang-scan-item[data-sev="warn"] { border-left: 3px solid var(--m-warning); }
+`
+);
+function SafetyScanBadge({ level, locale = "vi", theme, className }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  const label = {
+    safe: { vi: "An to\xE0n", en: "Safe" },
+    review: { vi: "C\u1EA7n xem", en: "Review" },
+    blocked: { vi: "Ch\u1EB7n", en: "Blocked" }
+  }[level][locale];
+  const icon = { safe: "\u{1F6E1}\uFE0F", review: "\u26A0\uFE0F", blocked: "\u26D4" }[level];
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ...scope,
+      className: cx(scope.className, "mang-scan-badge", className),
+      "data-level": level,
+      children: [
+        icon,
+        " ",
+        label
+      ]
+    }
+  );
+}
+function SandboxFrame({ children, origin, source, theme, className }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsxs("div", { ...scope, className: cx(scope.className, "mang-sbx", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "mang-sbx-bar", children: [
+      /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u{1F9EA}" }),
+      source,
+      origin && /* @__PURE__ */ jsx("span", { className: "mang-sbx-origin", children: origin })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "mang-sbx-body", children })
+  ] });
+}
+function SandboxError({ message, theme, className }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsxs("div", { ...scope, className: cx(scope.className, "mang-sbx-error", className), role: "alert", children: [
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: { fontSize: "1.6rem" }, children: "\u26D4" }),
+    /* @__PURE__ */ jsx("span", { children: message ?? "Kh\xF4ng t\u1EA3i \u0111\u01B0\u1EE3c app trong h\u1ED9p c\xE1t." })
+  ] });
+}
+function StaticScanResult({
+  findings,
+  emptyLabel,
+  theme,
+  className
+}) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  if (findings.length === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...scope,
+        className: cx(scope.className, className),
+        style: { fontSize: tokens.fontSize.sm, color: "var(--m-text-muted)" },
+        children: emptyLabel ?? "Kh\xF4ng c\xF3 c\u1EA3nh b\xE1o."
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("ul", { ...scope, className: cx(scope.className, "mang-scan-list", className), children: findings.map((f, i) => /* @__PURE__ */ jsxs(
+    "li",
+    {
+      className: "mang-scan-item",
+      "data-sev": f.severity,
+      children: [
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: f.severity === "error" ? "\u26D4" : f.severity === "warn" ? "\u26A0\uFE0F" : "\u2139\uFE0F" }),
+        /* @__PURE__ */ jsx("span", { children: f.message })
+      ]
+    },
+    i
+  )) });
+}
+
+export {
+  SafetyScanBadge,
+  SandboxFrame,
+  SandboxError,
+  StaticScanResult
+};

package/dist/chunk-XPV3OOLU.js

@@ -0,0 +1,147 @@
+import {
+  cx,
+  useAreaStyles,
+  useScope
+} from "./chunk-3AL4SUFD.js";
+import {
+  tokens
+} from "./chunk-PPOYMKV3.js";
+
+// src/layout/Layout.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var STYLE_ID = "mang-ui-layout";
+var { fontSize, fontWeight, font, space } = tokens;
+var CSS = (
+  /* css */
+  `
+.mang-page { width: 100%; max-width: 68rem; margin: 0 auto; padding: clamp(1rem, 3vw, 2rem); }
+.mang-container { width: 100%; max-width: 52rem; margin: 0 auto; }
+.mang-container[data-width="reading"] { max-width: 42rem; }
+.mang-pagehead { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1rem; }
+.mang-pagehead-titles { display: grid; gap: 0.2rem; }
+.mang-pagehead-eyebrow { font-size: ${fontSize.xs}; font-weight: ${fontWeight.bold}; text-transform: uppercase; letter-spacing: 0.14em; color: var(--m-accent); }
+.mang-pagehead-title { font-family: "${font.heading}", system-ui, sans-serif; font-weight: ${fontWeight.bold}; font-size: ${fontSize["2xl"]}; color: var(--m-text-strong); margin: 0; }
+.mang-pagehead-actions { display: flex; gap: 0.5rem; align-items: center; }
+.mang-sectionhead { font-family: "${font.heading}", system-ui, sans-serif; font-weight: ${fontWeight.semibold}; font-size: ${fontSize.lg}; color: var(--m-text-strong); margin: 0 0 0.5rem; }
+.mang-bottombar { position: sticky; bottom: 0; display: flex; gap: 0.5rem; align-items: center; justify-content: flex-end; padding: 0.7rem clamp(1rem, 3vw, 2rem); background: var(--m-surface); border-top: 1px solid var(--m-line); box-shadow: 0 -8px 24px -18px rgba(0,0,0,0.3); }
+.mang-listrow { display: flex; align-items: center; gap: 0.75rem; width: 100%; box-sizing: border-box; padding: 0.7rem 0.85rem; border-radius: ${tokens.radius.md}; background: var(--m-surface); border: 1px solid var(--m-line); text-align: left; color: var(--m-text); }
+.mang-listrow-lead, .mang-listrow-trail { flex: none; display: flex; align-items: center; }
+.mang-listrow-main { flex: 1; min-width: 0; display: grid; gap: 0.1rem; }
+.mang-listrow-title { font-family: "${font.heading}", system-ui, sans-serif; font-weight: ${fontWeight.semibold}; font-size: ${fontSize.base}; color: var(--m-text-strong); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.mang-listrow-meta { font-size: ${fontSize.sm}; color: var(--m-text-muted); }
+button.mang-listrow { appearance: none; cursor: pointer; font: inherit; transition: border-color 150ms ${"cubic-bezier(0.16,1,0.3,1)"}, transform 150ms ${"cubic-bezier(0.16,1,0.3,1)"}; }
+button.mang-listrow:hover { border-color: var(--m-accent); }
+button.mang-listrow:active { transform: scale(0.995); }
+button.mang-listrow:focus-visible { outline: 3px solid color-mix(in oklab, ${tokens.color.mangGreen} 45%, transparent); outline-offset: 2px; }
+@media (prefers-reduced-motion: reduce) { button.mang-listrow { transition: none; } }
+`
+);
+function AppFrame({ className, style, children }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className,
+      style: { display: "flex", flexDirection: "column", minHeight: "100dvh", ...style },
+      children
+    }
+  );
+}
+function Page({ theme, className, children }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsx("div", { ...scope, className: cx(scope.className, "mang-page", className), children });
+}
+function Container({ width = "default", theme, className, children }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsx("div", { ...scope, className: cx(scope.className, "mang-container", className), "data-width": width, children });
+}
+function PageHeader({ eyebrow, title, actions, theme, className }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsxs("div", { ...scope, className: cx(scope.className, "mang-pagehead", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "mang-pagehead-titles", children: [
+      eyebrow != null && /* @__PURE__ */ jsx("span", { className: "mang-pagehead-eyebrow", children: eyebrow }),
+      /* @__PURE__ */ jsx("h1", { className: "mang-pagehead-title", children: title })
+    ] }),
+    actions != null && /* @__PURE__ */ jsx("div", { className: "mang-pagehead-actions", children: actions })
+  ] });
+}
+function Section({ title, theme, className, children }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      ...scope,
+      className: cx(scope.className, className),
+      style: { marginBottom: space[6] },
+      children: [
+        title != null && /* @__PURE__ */ jsx("h2", { className: "mang-sectionhead", children: title }),
+        children
+      ]
+    }
+  );
+}
+function BottomActionBar({ theme, className, children }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsx("div", { ...scope, className: cx(scope.className, "mang-bottombar", className), children });
+}
+function ListRow({
+  leading,
+  title,
+  meta,
+  trailing,
+  onClick,
+  theme,
+  className
+}) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  const inner = /* @__PURE__ */ jsxs(Fragment, { children: [
+    leading != null && /* @__PURE__ */ jsx("span", { className: "mang-listrow-lead", children: leading }),
+    /* @__PURE__ */ jsxs("span", { className: "mang-listrow-main", children: [
+      /* @__PURE__ */ jsx("span", { className: "mang-listrow-title", children: title }),
+      meta != null && /* @__PURE__ */ jsx("span", { className: "mang-listrow-meta", children: meta })
+    ] }),
+    trailing != null && /* @__PURE__ */ jsx("span", { className: "mang-listrow-trail", children: trailing })
+  ] });
+  if (onClick) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ...scope,
+        type: "button",
+        className: cx(scope.className, "mang-listrow", className),
+        onClick,
+        children: inner
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { ...scope, className: cx(scope.className, "mang-listrow", className), children: inner });
+}
+function SafeArea({
+  edges = ["top", "bottom", "left", "right"],
+  className,
+  style,
+  children
+}) {
+  const pad = {};
+  if (edges.includes("top")) pad.paddingTop = "env(safe-area-inset-top)";
+  if (edges.includes("bottom")) pad.paddingBottom = "env(safe-area-inset-bottom)";
+  if (edges.includes("left")) pad.paddingLeft = "env(safe-area-inset-left)";
+  if (edges.includes("right")) pad.paddingRight = "env(safe-area-inset-right)";
+  return /* @__PURE__ */ jsx("div", { className, style: { ...pad, ...style }, children });
+}
+
+export {
+  AppFrame,
+  Page,
+  Container,
+  PageHeader,
+  Section,
+  BottomActionBar,
+  ListRow,
+  SafeArea
+};

package/dist/chunk-YN5O6YL6.js

@@ -0,0 +1,69 @@
+import {
+  cx,
+  useKitStyles,
+  useScope
+} from "./chunk-3AL4SUFD.js";
+
+// src/actions/Button.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function Button({
+  variant = "primary",
+  size = "md",
+  block,
+  icon,
+  theme,
+  className,
+  children,
+  type,
+  ...rest
+}) {
+  useKitStyles();
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ...rest,
+      type: type ?? "button",
+      className: cx(scope.className, "mang-btn", className),
+      "data-theme": scope["data-theme"],
+      "data-density": scope["data-density"],
+      "data-variant": variant,
+      "data-size": size,
+      "data-block": block ? "true" : void 0,
+      children: [
+        icon != null && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: { display: "inline-flex" }, children: icon }),
+        children
+      ]
+    }
+  );
+}
+function IconButton({
+  label,
+  size = "md",
+  variant = "ghost",
+  className,
+  children,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      ...rest,
+      variant,
+      size,
+      "aria-label": label,
+      title: rest.title ?? label,
+      className: cx("mang-iconbtn", className),
+      children
+    }
+  );
+}
+function ButtonGroup({ className, children }) {
+  return /* @__PURE__ */ jsx("div", { className: cx("mang-btn-group", className), children });
+}
+
+export {
+  Button,
+  IconButton,
+  ButtonGroup
+};

package/dist/chunk-Z4ANGBPC.js

@@ -0,0 +1,94 @@
+import {
+  cx,
+  useAreaStyles,
+  useScope
+} from "./chunk-3AL4SUFD.js";
+import {
+  tokens
+} from "./chunk-PPOYMKV3.js";
+
+// src/editor/Editor.tsx
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var STYLE_ID = "mang-ui-editor";
+var { fontSize, fontWeight, radius, font, lineHeight } = tokens;
+var CSS = (
+  /* css */
+  `
+.mang-prose { color: var(--m-text); line-height: ${lineHeight.relaxed}; font-size: ${fontSize.base}; }
+.mang-prose :where(h1,h2,h3) { font-family: "${font.heading}", system-ui, sans-serif; color: var(--m-text-strong); line-height: ${lineHeight.tight}; margin: 1.2em 0 0.5em; }
+.mang-prose :where(p,ul,ol) { margin: 0.6em 0; }
+.mang-prose :where(a) { color: var(--m-accent); text-underline-offset: 2px; }
+.mang-prose :where(code) { font-family: ui-monospace, monospace; font-size: 0.9em; background: var(--m-sunken); padding: 0.1em 0.35em; border-radius: ${radius.sm}; }
+.mang-prose :where(blockquote) { margin: 0.8em 0; padding-left: 0.9em; border-left: 3px solid var(--m-line-strong); color: var(--m-text-muted); }
+.mang-codeblock { position: relative; }
+.mang-codeblock pre { margin: 0; overflow: auto; padding: 0.85rem 0.95rem; border-radius: ${radius.md}; background: var(--m-sunken); border: 1px solid var(--m-line); }
+.mang-codeblock code { font-family: ui-monospace, monospace; font-size: ${fontSize.sm}; color: var(--m-text); white-space: pre; }
+.mang-codeblock-copy { position: absolute; top: 0.5rem; right: 0.5rem; appearance: none; cursor: pointer; border: 1px solid var(--m-line-strong); background: var(--m-surface); color: var(--m-text); border-radius: ${radius.sm}; padding: 0.2rem 0.5rem; font-size: ${fontSize.xs}; font-weight: ${fontWeight.semibold}; }
+.mang-kbd { font-family: ui-monospace, monospace; font-size: 0.85em; padding: 0.1em 0.45em; border-radius: ${radius.sm}; border: 1px solid var(--m-line-strong); border-bottom-width: 2px; background: var(--m-surface); color: var(--m-text-strong); }
+.mang-callout { display: flex; gap: 0.6rem; padding: 0.75rem 0.9rem; border-radius: ${radius.md}; font-size: ${fontSize.sm}; border: 1px solid var(--m-line); background: var(--m-sunken); color: var(--m-text); }
+.mang-callout[data-tone="tip"] { background: var(--m-success-soft); color: var(--m-success-on); }
+.mang-callout[data-tone="warn"] { background: var(--m-warning-soft); color: var(--m-warning-on); }
+.mang-callout[data-tone="danger"] { background: var(--m-danger-soft); color: var(--m-danger-on); }
+.mang-callout-icon { flex: none; }
+`
+);
+function Prose({ children, theme, className }) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  return /* @__PURE__ */ jsx("div", { ...scope, className: cx(scope.className, "mang-prose", className), children });
+}
+function CodeBlock({
+  code,
+  copyable = true,
+  locale = "vi",
+  theme,
+  className
+}) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  const [copied, setCopied] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { ...scope, className: cx(scope.className, "mang-codeblock", className), children: [
+    /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: code }) }),
+    copyable && /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "mang-codeblock-copy",
+        onClick: () => {
+          void navigator.clipboard?.writeText(code).then(() => {
+            setCopied(true);
+            setTimeout(() => setCopied(false), 1500);
+          });
+        },
+        children: copied ? locale === "vi" ? "\u0110\xE3 ch\xE9p" : "Copied" : locale === "vi" ? "Ch\xE9p" : "Copy"
+      }
+    )
+  ] });
+}
+function Kbd({ children, className }) {
+  useAreaStyles(STYLE_ID, CSS);
+  return /* @__PURE__ */ jsx("kbd", { className: cx("mang-kbd", className), children });
+}
+function CalloutBlock({
+  tone = "note",
+  icon,
+  children,
+  theme,
+  className
+}) {
+  useAreaStyles(STYLE_ID, CSS);
+  const scope = useScope(theme);
+  const defaultIcon = { note: "\u2139\uFE0F", tip: "\u{1F4A1}", warn: "\u26A0\uFE0F", danger: "\u26D4" }[tone];
+  return /* @__PURE__ */ jsxs("div", { ...scope, className: cx(scope.className, "mang-callout", className), "data-tone": tone, children: [
+    /* @__PURE__ */ jsx("span", { className: "mang-callout-icon", "aria-hidden": "true", children: icon ?? defaultIcon }),
+    /* @__PURE__ */ jsx("span", { children })
+  ] });
+}
+
+export {
+  Prose,
+  CodeBlock,
+  Kbd,
+  CalloutBlock
+};

package/dist/creator.d.ts

@@ -0,0 +1,55 @@
+import * as react from 'react';
+import { Locale } from '@mangtre/core';
+import { ScanLevel, ScanFinding } from './sandbox.js';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+
+interface Themed {
+    theme?: ThemeMode;
+    className?: string;
+}
+interface BundleUploadDropzoneProps extends Themed {
+    onFile: (file: File) => void;
+    /** Accept attribute (default ".js,.mjs"). */
+    accept?: string;
+    /** Currently selected file (for the "selected" state). */
+    file?: {
+        name: string;
+        size: number;
+    } | null;
+    locale?: Locale;
+}
+declare function BundleUploadDropzone({ onFile, accept, file, locale, theme, className, }: BundleUploadDropzoneProps): react.JSX.Element;
+interface ManifestSummary {
+    id: string;
+    name?: string;
+    version?: string;
+    permissions?: string[];
+    surfaces?: string[];
+    commands?: string[];
+}
+interface ManifestPreviewProps extends Themed {
+    manifest: ManifestSummary;
+}
+declare function ManifestPreview({ manifest, theme, className }: ManifestPreviewProps): react.JSX.Element;
+interface StaticScanPanelProps extends Themed {
+    level: ScanLevel;
+    findings: ScanFinding[];
+    locale?: Locale;
+}
+declare function StaticScanPanel({ level, findings, locale, theme, className, }: StaticScanPanelProps): react.JSX.Element;
+type ReviewStatus = "draft" | "pending_review" | "changes" | "live" | "rejected";
+interface ReviewStatusBadgeProps extends Themed {
+    status: ReviewStatus;
+    locale?: Locale;
+}
+declare function ReviewStatusBadge({ status, locale, theme, className, }: ReviewStatusBadgeProps): react.JSX.Element;
+interface VersionBadgeProps extends Themed {
+    version: string;
+}
+declare function VersionBadge({ version, theme, className }: VersionBadgeProps): react.JSX.Element;
+interface BuildBadgeProps extends Themed {
+    sha: string;
+}
+declare function BuildBadge({ sha, theme, className }: BuildBadgeProps): react.JSX.Element;
+
+export { BuildBadge, type BuildBadgeProps, BundleUploadDropzone, type BundleUploadDropzoneProps, ManifestPreview, type ManifestPreviewProps, type ManifestSummary, type ReviewStatus, ReviewStatusBadge, type ReviewStatusBadgeProps, StaticScanPanel, type StaticScanPanelProps, VersionBadge, type VersionBadgeProps };

package/dist/creator.js

@@ -0,0 +1,20 @@
+import {
+  BuildBadge,
+  BundleUploadDropzone,
+  ManifestPreview,
+  ReviewStatusBadge,
+  StaticScanPanel,
+  VersionBadge
+} from "./chunk-JJB4PJC3.js";
+import "./chunk-X7T2DJLU.js";
+import "./chunk-FZRXVRC7.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  BuildBadge,
+  BundleUploadDropzone,
+  ManifestPreview,
+  ReviewStatusBadge,
+  StaticScanPanel,
+  VersionBadge
+};

package/dist/data-room.d.ts

@@ -0,0 +1,50 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { Locale } from '@mangtre/core';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+
+type RoomStatus = "offline" | "cloud" | "realtime";
+interface RoomStatusBadgeProps {
+    status: RoomStatus;
+    /** Connected peers (shown when realtime). */
+    peers?: number;
+    locale?: Locale;
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function RoomStatusBadge({ status, peers, locale, theme, className, }: RoomStatusBadgeProps): react.JSX.Element;
+interface RoomShareButtonProps {
+    onShare: () => void;
+    locale?: Locale;
+    theme?: ThemeMode;
+    className?: string;
+    children?: ReactNode;
+}
+declare function RoomShareButton({ onShare, locale, theme, className, children, }: RoomShareButtonProps): react.JSX.Element;
+interface RoomLinkCardProps {
+    url: string;
+    onCopy?: () => void;
+    locale?: Locale;
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function RoomLinkCard({ url, onCopy, locale, theme, className }: RoomLinkCardProps): react.JSX.Element;
+interface RoomPresenceProps {
+    /** Peer initials/labels (first letter shown). */
+    peers: string[];
+    /** Cap avatars shown; rest collapse into "+N". */
+    max?: number;
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function RoomPresence({ peers, max, theme, className }: RoomPresenceProps): react.JSX.Element;
+interface RoomConflictNoticeProps {
+    onReload: () => void;
+    locale?: Locale;
+    theme?: ThemeMode;
+    className?: string;
+}
+/** Shown when a remote change conflicts with a local edit (P2). */
+declare function RoomConflictNotice({ onReload, locale, theme, className, }: RoomConflictNoticeProps): react.JSX.Element;
+
+export { RoomConflictNotice, type RoomConflictNoticeProps, RoomLinkCard, type RoomLinkCardProps, RoomPresence, type RoomPresenceProps, RoomShareButton, type RoomShareButtonProps, type RoomStatus, RoomStatusBadge, type RoomStatusBadgeProps };

package/dist/data-room.js

@@ -0,0 +1,17 @@
+import {
+  RoomConflictNotice,
+  RoomLinkCard,
+  RoomPresence,
+  RoomShareButton,
+  RoomStatusBadge
+} from "./chunk-OJX2EIMB.js";
+import "./chunk-YN5O6YL6.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  RoomConflictNotice,
+  RoomLinkCard,
+  RoomPresence,
+  RoomShareButton,
+  RoomStatusBadge
+};

package/dist/editor.d.ts

@@ -0,0 +1,32 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+import '@mangtre/core';
+
+interface Themed {
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function Prose({ children, theme, className }: Themed & {
+    children: ReactNode;
+}): react.JSX.Element;
+interface CodeBlockProps extends Themed {
+    code: string;
+    /** Show a copy button. Default true. */
+    copyable?: boolean;
+    locale?: "vi" | "en";
+}
+declare function CodeBlock({ code, copyable, locale, theme, className, }: CodeBlockProps): react.JSX.Element;
+declare function Kbd({ children, className }: {
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+type CalloutTone = "note" | "tip" | "warn" | "danger";
+interface CalloutBlockProps extends Themed {
+    tone?: CalloutTone;
+    icon?: ReactNode;
+    children: ReactNode;
+}
+declare function CalloutBlock({ tone, icon, children, theme, className, }: CalloutBlockProps): react.JSX.Element;
+
+export { CalloutBlock, type CalloutBlockProps, type CalloutTone, CodeBlock, type CodeBlockProps, Kbd, Prose };

package/dist/editor.js

@@ -0,0 +1,14 @@
+import {
+  CalloutBlock,
+  CodeBlock,
+  Kbd,
+  Prose
+} from "./chunk-Z4ANGBPC.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  CalloutBlock,
+  CodeBlock,
+  Kbd,
+  Prose
+};

package/dist/feedback.d.ts

@@ -0,0 +1,48 @@
+import * as react from 'react';
+import { ReactNode, CSSProperties } from 'react';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+import '@mangtre/core';
+
+interface StateProps {
+    icon?: ReactNode;
+    title?: ReactNode;
+    description?: ReactNode;
+    /** Optional action (e.g. a Button). */
+    action?: ReactNode;
+    theme?: ThemeMode;
+    className?: string;
+}
+interface EmptyStateProps extends StateProps {
+}
+declare function EmptyState({ icon, title, description, action, theme, className, }: EmptyStateProps): react.JSX.Element;
+interface ErrorStateProps extends StateProps {
+}
+declare function ErrorState({ icon, title, description, action, theme, className, }: ErrorStateProps): react.JSX.Element;
+interface SkeletonProps {
+    width?: string | number;
+    height?: string | number;
+    /** Pill shape (e.g. for avatars/lines). */
+    rounded?: boolean;
+    theme?: ThemeMode;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function Skeleton({ width, height, rounded, theme, className, style, }: SkeletonProps): react.JSX.Element;
+interface SpinnerProps {
+    /** Diameter (px or CSS length). */
+    size?: string | number;
+    label?: string;
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function Spinner({ size, label, theme, className }: SpinnerProps): react.JSX.Element;
+interface ProgressProps {
+    /** 0–100. Omit for an indeterminate bar. */
+    value?: number;
+    theme?: ThemeMode;
+    className?: string;
+    label?: string;
+}
+declare function Progress({ value, theme, className, label }: ProgressProps): react.JSX.Element;
+
+export { EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, Progress, type ProgressProps, Skeleton, type SkeletonProps, Spinner, type SpinnerProps };