dishui 0.0.83 → 0.0.84

package/dist/components/Demo/index.js

@@ -16,7 +16,7 @@ var f = ({ children: r, language: i = "jsx" }) => {
 			children: [/* @__PURE__ */ c(t, {
 				size: "xs",
 				mono: !0,
-				color: "secondary",
+				color: "muted",
 				children: i
 			}), /* @__PURE__ */ l("div", {
 				className: "flex items-center gap-2",
@@ -96,7 +96,7 @@ var f = ({ children: r, language: i = "jsx" }) => {
 				}), u && /* @__PURE__ */ c(t, {
 					as: "p",
 					size: "sm",
-					color: "secondary",
+					color: "muted",
 					className: "mt-1 leading-relaxed",
 					children: u
 				})]

package/dist/components/Demo/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Demo/index.tsx"],"sourcesContent":["import React, { useEffect, useId, useRef, useState } from 'react';\nimport { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';\nimport { coldarkDark } from 'react-syntax-highlighter/dist/esm/styles/prism';\nimport { useCopyToClipboard } from '../../hooks/useCopyToClipboard';\nimport { formatDemoSource, type DemoSource } from './source';\nimport Button from '../Button';\nimport Text from '../Text';\n\nexport type { DemoSource } from './source';\n\nexport interface CodeBlockProps {\n  children: string;\n  language?: string;\n}\n\nconst CodeBlock: React.FC<CodeBlockProps> = ({ children, language = 'jsx' }) => {\n  const { copied, error, copy } = useCopyToClipboard();\n\n  return (\n    <div className=\"min-w-0 overflow-hidden rounded-lg border border-base-300\">\n      <div className=\"flex items-center justify-between gap-3 bg-base-200 px-4 py-2\">\n        <Text size=\"xs\" mono color=\"secondary\">{language}</Text>\n        <div className=\"flex items-center gap-2\">\n          <Text role=\"status\" size=\"xs\">\n            {error ? 'Copy failed / 复制失败，请手动复制' : copied ? 'Copied / 已复制' : ''}\n          </Text>\n          <Button\n            type=\"button\"\n            variant=\"ghost\" size=\"xs\"\n            onClick={() => void copy(children)}\n            aria-label=\"Copy source code / 复制源代码\"\n          >\n            Copy / 复制\n          </Button>\n        </div>\n      </div>\n      <SyntaxHighlighter\n        language={language}\n        style={coldarkDark}\n        tabIndex={0}\n        aria-label=\"Source code / 源代码\"\n        customStyle={{\n          margin: 0,\n          borderRadius: 0,\n          fontSize: '0.8125rem',\n          lineHeight: 1.7,\n          padding: '1rem',\n          maxHeight: '32rem',\n          overflow: 'auto',\n        }}\n      >\n        {children}\n      </SyntaxHighlighter>\n    </div>\n  );\n};\n\ntype DemoSourceLoader = () => Promise<DemoSource>;\n\ntype SourceLoadResult = {\n  loader: DemoSourceLoader;\n  attempt: number;\n} & ({ status: 'success'; data: DemoSource } | { status: 'error' });\n\nexport interface DemoProps {\n  title: string;\n  description?: string;\n  children: React.ReactNode;\n  code: string;\n  language?: string;\n  source?: DemoSource | DemoSourceLoader;\n  sourceContext?: Record<string, unknown>;\n}\n\nconst Demo: React.FC<DemoProps> = ({\n  title,\n  description,\n  children,\n  code,\n  language = 'jsx',\n  source,\n  sourceContext,\n}) => {\n  const [showCode, setShowCode] = useState(false);\n  const [attempt, setAttempt] = useState(0);\n  const [loadResult, setLoadResult] = useState<SourceLoadResult | null>(null);\n  const request = useRef<{\n    loader: DemoSourceLoader;\n    attempt: number;\n    promise: Promise<DemoSource>;\n  } | null>(null);\n\n  useEffect(() => {\n    if (!showCode || typeof source !== 'function') return;\n\n    let active = true;\n    // Reuse the request across collapse/reopen and StrictMode effect replays.\n    if (request.current?.loader !== source || request.current.attempt !== attempt) {\n      request.current = {\n        loader: source,\n        attempt,\n        promise: Promise.resolve().then(() => source()),\n      };\n    }\n    void request.current.promise.then(\n      data => {\n        if (active) setLoadResult({ loader: source, attempt, status: 'success', data });\n      },\n      () => {\n        if (active) setLoadResult({ loader: source, attempt, status: 'error' });\n      },\n    );\n    return () => { active = false; };\n  }, [source, showCode, attempt]);\n\n  // Match the loader before rendering so switching props cannot flash stale source.\n  const currentResult = typeof source === 'function'\n    && loadResult?.loader === source && loadResult.attempt === attempt\n    ? loadResult : null;\n  const resolvedSource = typeof source === 'function'\n    ? currentResult?.status === 'success' ? currentResult.data : undefined\n    : source;\n  const loading = typeof source === 'function' && !currentResult;\n  const id = useId();\n  const titleId = `${id}-title`;\n  const codeId = `${id}-code`;\n\n  return (\n    <section aria-labelledby={titleId} className=\"dishui-demo mb-4 min-w-0 rounded-lg border border-hairline bg-page\">\n      <div className=\"border-b border-hairline bg-subtle px-4 py-3 rounded-t-lg\">\n        <Text as=\"h3\" id={titleId} size=\"sm\" weight=\"semibold\">{title}</Text>\n        {description && <Text as=\"p\" size=\"sm\" color=\"secondary\" className=\"mt-1 leading-relaxed\">{description}</Text>}\n      </div>\n\n      <div className=\"flex min-w-0 flex-wrap items-center gap-4 p-4\">\n        {children}\n      </div>\n\n      <div className=\"border-t border-base-300\">\n        <Button\n          type=\"button\" variant=\"ghost\"\n          className=\"flex w-full items-center justify-between rounded-none rounded-b-lg px-4 text-xs font-medium\"\n          aria-expanded={showCode}\n          aria-controls={codeId}\n          onClick={() => setShowCode(value => !value)}\n        >\n          <Text size=\"xs\" weight=\"medium\" color=\"inherit\">Source Code / 源代码</Text>\n          <svg\n            aria-hidden=\"true\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            className={`h-4 w-4 transition-transform motion-reduce:transition-none ${showCode ? 'rotate-180' : ''}`}\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M19 9l-7 7-7-7\" />\n          </svg>\n        </Button>\n        <div id={codeId} hidden={!showCode} className=\"min-w-0 border-t border-base-300 p-4\">\n          {showCode && (\n            <div className=\"min-w-0 space-y-3\">\n              <div className=\"min-w-0\" aria-busy={loading}>\n                {loading ? (\n                  <Text as=\"p\" role=\"status\" size=\"sm\">Loading source code… / 正在加载源码…</Text>\n                ) : currentResult?.status === 'error' ? (\n                  <div className=\"space-y-2\">\n                    <Text as=\"p\" role=\"alert\" size=\"sm\">\n                      Could not load source code. Please retry. / 源码加载失败，请重试。\n                    </Text>\n                    <Button\n                      type=\"button\" variant=\"ghost\" size=\"sm\"\n                      onClick={() => setAttempt(value => value + 1)}\n                    >\n                      Retry loading source / 重新加载源码\n                    </Button>\n                  </div>\n                ) : resolvedSource ? (\n                  <CodeBlock language=\"tsx\">\n                    {formatDemoSource(resolvedSource, sourceContext)}\n                  </CodeBlock>\n                ) : !source ? (\n                  <CodeBlock language={language}>{code}</CodeBlock>\n                ) : null}\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n    </section>\n  );\n};\n\nexport default Demo;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Demo/index.tsx"],"sourcesContent":["import React, { useEffect, useId, useRef, useState } from 'react';\nimport { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';\nimport { coldarkDark } from 'react-syntax-highlighter/dist/esm/styles/prism';\nimport { useCopyToClipboard } from '../../hooks/useCopyToClipboard';\nimport { formatDemoSource, type DemoSource } from './source';\nimport Button from '../Button';\nimport Text from '../Text';\n\nexport type { DemoSource } from './source';\n\nexport interface CodeBlockProps {\n  children: string;\n  language?: string;\n}\n\nconst CodeBlock: React.FC<CodeBlockProps> = ({ children, language = 'jsx' }) => {\n  const { copied, error, copy } = useCopyToClipboard();\n\n  return (\n    <div className=\"min-w-0 overflow-hidden rounded-lg border border-base-300\">\n      <div className=\"flex items-center justify-between gap-3 bg-base-200 px-4 py-2\">\n        <Text size=\"xs\" mono color=\"muted\">{language}</Text>\n        <div className=\"flex items-center gap-2\">\n          <Text role=\"status\" size=\"xs\">\n            {error ? 'Copy failed / 复制失败，请手动复制' : copied ? 'Copied / 已复制' : ''}\n          </Text>\n          <Button\n            type=\"button\"\n            variant=\"ghost\" size=\"xs\"\n            onClick={() => void copy(children)}\n            aria-label=\"Copy source code / 复制源代码\"\n          >\n            Copy / 复制\n          </Button>\n        </div>\n      </div>\n      <SyntaxHighlighter\n        language={language}\n        style={coldarkDark}\n        tabIndex={0}\n        aria-label=\"Source code / 源代码\"\n        customStyle={{\n          margin: 0,\n          borderRadius: 0,\n          fontSize: '0.8125rem',\n          lineHeight: 1.7,\n          padding: '1rem',\n          maxHeight: '32rem',\n          overflow: 'auto',\n        }}\n      >\n        {children}\n      </SyntaxHighlighter>\n    </div>\n  );\n};\n\ntype DemoSourceLoader = () => Promise<DemoSource>;\n\ntype SourceLoadResult = {\n  loader: DemoSourceLoader;\n  attempt: number;\n} & ({ status: 'success'; data: DemoSource } | { status: 'error' });\n\nexport interface DemoProps {\n  title: string;\n  description?: string;\n  children: React.ReactNode;\n  code: string;\n  language?: string;\n  source?: DemoSource | DemoSourceLoader;\n  sourceContext?: Record<string, unknown>;\n}\n\nconst Demo: React.FC<DemoProps> = ({\n  title,\n  description,\n  children,\n  code,\n  language = 'jsx',\n  source,\n  sourceContext,\n}) => {\n  const [showCode, setShowCode] = useState(false);\n  const [attempt, setAttempt] = useState(0);\n  const [loadResult, setLoadResult] = useState<SourceLoadResult | null>(null);\n  const request = useRef<{\n    loader: DemoSourceLoader;\n    attempt: number;\n    promise: Promise<DemoSource>;\n  } | null>(null);\n\n  useEffect(() => {\n    if (!showCode || typeof source !== 'function') return;\n\n    let active = true;\n    // Reuse the request across collapse/reopen and StrictMode effect replays.\n    if (request.current?.loader !== source || request.current.attempt !== attempt) {\n      request.current = {\n        loader: source,\n        attempt,\n        promise: Promise.resolve().then(() => source()),\n      };\n    }\n    void request.current.promise.then(\n      data => {\n        if (active) setLoadResult({ loader: source, attempt, status: 'success', data });\n      },\n      () => {\n        if (active) setLoadResult({ loader: source, attempt, status: 'error' });\n      },\n    );\n    return () => { active = false; };\n  }, [source, showCode, attempt]);\n\n  // Match the loader before rendering so switching props cannot flash stale source.\n  const currentResult = typeof source === 'function'\n    && loadResult?.loader === source && loadResult.attempt === attempt\n    ? loadResult : null;\n  const resolvedSource = typeof source === 'function'\n    ? currentResult?.status === 'success' ? currentResult.data : undefined\n    : source;\n  const loading = typeof source === 'function' && !currentResult;\n  const id = useId();\n  const titleId = `${id}-title`;\n  const codeId = `${id}-code`;\n\n  return (\n    <section aria-labelledby={titleId} className=\"dishui-demo mb-4 min-w-0 rounded-lg border border-hairline bg-page\">\n      <div className=\"border-b border-hairline bg-subtle px-4 py-3 rounded-t-lg\">\n        <Text as=\"h3\" id={titleId} size=\"sm\" weight=\"semibold\">{title}</Text>\n        {description && <Text as=\"p\" size=\"sm\" color=\"muted\" className=\"mt-1 leading-relaxed\">{description}</Text>}\n      </div>\n\n      <div className=\"flex min-w-0 flex-wrap items-center gap-4 p-4\">\n        {children}\n      </div>\n\n      <div className=\"border-t border-base-300\">\n        <Button\n          type=\"button\" variant=\"ghost\"\n          className=\"flex w-full items-center justify-between rounded-none rounded-b-lg px-4 text-xs font-medium\"\n          aria-expanded={showCode}\n          aria-controls={codeId}\n          onClick={() => setShowCode(value => !value)}\n        >\n          <Text size=\"xs\" weight=\"medium\" color=\"inherit\">Source Code / 源代码</Text>\n          <svg\n            aria-hidden=\"true\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            className={`h-4 w-4 transition-transform motion-reduce:transition-none ${showCode ? 'rotate-180' : ''}`}\n            fill=\"none\"\n            viewBox=\"0 0 24 24\"\n            stroke=\"currentColor\"\n          >\n            <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M19 9l-7 7-7-7\" />\n          </svg>\n        </Button>\n        <div id={codeId} hidden={!showCode} className=\"min-w-0 border-t border-base-300 p-4\">\n          {showCode && (\n            <div className=\"min-w-0 space-y-3\">\n              <div className=\"min-w-0\" aria-busy={loading}>\n                {loading ? (\n                  <Text as=\"p\" role=\"status\" size=\"sm\">Loading source code… / 正在加载源码…</Text>\n                ) : currentResult?.status === 'error' ? (\n                  <div className=\"space-y-2\">\n                    <Text as=\"p\" role=\"alert\" size=\"sm\">\n                      Could not load source code. Please retry. / 源码加载失败，请重试。\n                    </Text>\n                    <Button\n                      type=\"button\" variant=\"ghost\" size=\"sm\"\n                      onClick={() => setAttempt(value => value + 1)}\n                    >\n                      Retry loading source / 重新加载源码\n                    </Button>\n                  </div>\n                ) : resolvedSource ? (\n                  <CodeBlock language=\"tsx\">\n                    {formatDemoSource(resolvedSource, sourceContext)}\n                  </CodeBlock>\n                ) : !source ? (\n                  <CodeBlock language={language}>{code}</CodeBlock>\n                ) : null}\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n    </section>\n  );\n};\n\nexport default Demo;\n"],"mappings":"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"}

package/dist/components/Page/index.d.ts

@@ -31,6 +31,20 @@ export type PageBodyProps = React.HTMLAttributes<HTMLDivElement> & {
     /** 是否让主体区在剩余空间内滚动（配合 Page fullHeight 使用） */
     scroll?: boolean;
 };
+export type PageHeaderLevel = PageHeaderProps & {
+    key: React.Key;
+};
+export type PageHeaderSlotProps = PageHeaderProps & {
+    /** 按顺序从上到下渲染；每级覆盖公共属性。空数组不渲染页头。 */
+    levels?: readonly PageHeaderLevel[];
+};
+export type PageAsideLevel = PageAsideProps & {
+    key: React.Key;
+};
+export type PageAsideSlotProps = PageAsideProps & {
+    /** 按 DOM 顺序从左到右渲染（小屏纵向堆叠）；每级覆盖公共属性。 */
+    levels?: readonly PageAsideLevel[];
+};
 export type PageAsideProps = React.HTMLAttributes<HTMLDivElement> & PagePanelProps & PageResizeProps & {
     /** 侧栏宽度，数字按 px 处理；Left 默认 260，Right 默认 320。外部变化会同步到拖动宽度。 */
     width?: number | string;
@@ -45,11 +59,11 @@ export type PageMainProps = React.HTMLAttributes<HTMLDivElement> & {
     /** 主内容区是否在剩余空间内纵向滚动 */
     scroll?: boolean;
 };
-/** 页头：直接复用 PageHeader，作为 Page.Header 使用 */
-declare const PageHeaderSlot: (props: PageHeaderProps) => React.JSX.Element;
+/** 不增加包装节点，保持 Page / Body 的布局、间距及面板开关语义。 */
+declare const PageHeaderSlot: ({ levels, ...props }: PageHeaderSlotProps) => React.JSX.Element;
 declare const PageBody: ({ gap, scroll, className, style, children, ...rest }: PageBodyProps) => React.JSX.Element;
-declare const PageLeft: ({ resizeVariant, resizable, minWidth, maxWidth, onWidthChange, open, mode, animated, duration, width, bordered, scroll, hideOnMobile, className, style, children, ...rest }: PageAsideProps) => React.JSX.Element;
-declare const PageRight: ({ resizeVariant, resizable, minWidth, maxWidth, onWidthChange, open, mode, animated, duration, width, bordered, scroll, hideOnMobile, className, style, children, ...rest }: PageAsideProps) => React.JSX.Element;
+declare const PageLeft: ({ levels, ...props }: PageAsideSlotProps) => React.ReactElement;
+declare const PageRight: ({ levels, ...props }: PageAsideSlotProps) => React.ReactElement;
 export type PageFooterProps = React.HTMLAttributes<HTMLElement> & PagePanelProps & PageAutoHideProps & {
     left?: React.ReactNode;
     center?: React.ReactNode;

package/dist/components/Page/index.js

@@ -3,24 +3,32 @@ import t from "../PagePanel/index.js";
 import n from "../PageHeader/index.js";
 import r from "./Float2.js";
 import i from "./resize2.js";
-import "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { createElement as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/Page/index.tsx
-var s = (e) => typeof e == "number" ? `${e}px` : e, c = ({ fullHeight: t = !1, className: n = "", children: r, ...i }) => /* @__PURE__ */ a("div", {
+var l = (e) => typeof e == "number" ? `${e}px` : e, u = ({ fullHeight: t = !1, className: n = "", children: r, ...i }) => /* @__PURE__ */ s("div", {
 	className: e("dishui-page flex w-full min-w-0 flex-col text-body leading-5 text-base-content", t && "h-full min-h-0", n),
 	...i,
 	children: r
-}), l = (e) => /* @__PURE__ */ a(n, { ...e }), u = ({ gap: t = 16, scroll: n = !1, className: r = "", style: i, children: o, ...c }) => /* @__PURE__ */ a("div", {
+}), d = ({ levels: e, ...t }) => e === void 0 ? /* @__PURE__ */ s(n, { ...t }) : /* @__PURE__ */ s(o, { children: e.map(({ key: e, ...r }) => /* @__PURE__ */ a(n, {
+	...t,
+	...r,
+	key: e
+})) }), f = ({ gap: t = 16, scroll: n = !1, className: r = "", style: i, children: a, ...o }) => /* @__PURE__ */ s("div", {
 	className: e("dishui-page-body flex w-full flex-col md:flex-row", n && "min-h-0 flex-1", r),
 	style: {
 		...i,
 		gap: 0,
-		"--dishui-page-gap": s(i?.gap ?? t)
+		"--dishui-page-gap": l(i?.gap ?? t)
 	},
-	...c,
-	children: o
-}), d = ({ resizeVariant: n = "pill", resizable: r = !1, minWidth: o = 160, maxWidth: c = 600, onWidthChange: l, open: u, mode: d, animated: f, duration: p, width: m = 260, bordered: h = !0, scroll: g = !0, hideOnMobile: _ = !1, className: v = "", style: y, children: b, ...x }) => {
-	let S = /* @__PURE__ */ a(t, {
+	...o,
+	children: a
+}), p = ({ levels: e, ...t }) => e === void 0 ? m(t) : /* @__PURE__ */ s(o, { children: e.map(({ key: e, ...n }) => /* @__PURE__ */ a(m, {
+	...t,
+	...n,
+	key: e
+})) }), m = ({ resizeVariant: n = "pill", resizable: r = !1, minWidth: a = 160, maxWidth: o = 600, onWidthChange: c, open: u, mode: d, animated: f, duration: p, width: m = 260, bordered: h = !0, scroll: g = !0, hideOnMobile: _ = !1, className: v = "", style: y, children: b, ...x }) => {
+	let S = /* @__PURE__ */ s(t, {
 		edge: "left",
 		width: y?.width ?? m,
 		hideOnMobile: _,
@@ -28,25 +36,29 @@ var s = (e) => typeof e == "number" ? `${e}px` : e, c = ({ fullHeight: t = !1, c
 		mode: d,
 		animated: f,
 		duration: p,
-		children: /* @__PURE__ */ a("aside", {
+		children: /* @__PURE__ */ s("aside", {
 			className: e("dishui-page-left w-full shrink-0 md:w-(--dishui-aside-w)", h && "md:border-r md:border-base-300 md:pr-4", g && "md:min-h-0 md:overflow-y-auto", _ && "hidden md:block", v),
 			style: {
-				"--dishui-aside-w": s(m),
+				"--dishui-aside-w": l(m),
 				...y
 			},
 			...x,
 			children: b
 		})
 	});
-	return r ? /* @__PURE__ */ a(i, {
+	return r ? /* @__PURE__ */ s(i, {
 		panel: S,
 		resizeVariant: n,
-		minWidth: o,
-		maxWidth: c,
-		onWidthChange: l
+		minWidth: a,
+		maxWidth: o,
+		onWidthChange: c
 	}) : S;
-}, f = ({ resizeVariant: n = "pill", resizable: r = !1, minWidth: o = 160, maxWidth: c = 600, onWidthChange: l, open: u, mode: d, animated: f, duration: p, width: m = 320, bordered: h = !0, scroll: g = !0, hideOnMobile: _ = !1, className: v = "", style: y, children: b, ...x }) => {
-	let S = /* @__PURE__ */ a(t, {
+}, h = ({ levels: e, ...t }) => e === void 0 ? g(t) : /* @__PURE__ */ s(o, { children: e.map(({ key: e, ...n }) => /* @__PURE__ */ a(g, {
+	...t,
+	...n,
+	key: e
+})) }), g = ({ resizeVariant: n = "pill", resizable: r = !1, minWidth: a = 160, maxWidth: o = 600, onWidthChange: c, open: u, mode: d, animated: f, duration: p, width: m = 320, bordered: h = !0, scroll: g = !0, hideOnMobile: _ = !1, className: v = "", style: y, children: b, ...x }) => {
+	let S = /* @__PURE__ */ s(t, {
 		edge: "right",
 		width: y?.width ?? m,
 		hideOnMobile: _,
@@ -54,59 +66,59 @@ var s = (e) => typeof e == "number" ? `${e}px` : e, c = ({ fullHeight: t = !1, c
 		mode: d,
 		animated: f,
 		duration: p,
-		children: /* @__PURE__ */ a("aside", {
+		children: /* @__PURE__ */ s("aside", {
 			className: e("dishui-page-right w-full shrink-0 md:w-(--dishui-aside-w)", h && "md:border-l md:border-base-300 md:pl-4", g && "md:min-h-0 md:overflow-y-auto", _ && "hidden md:block", v),
 			style: {
-				"--dishui-aside-w": s(m),
+				"--dishui-aside-w": l(m),
 				...y
 			},
 			...x,
 			children: b
 		})
 	});
-	return r ? /* @__PURE__ */ a(i, {
+	return r ? /* @__PURE__ */ s(i, {
 		panel: S,
 		resizeVariant: n,
-		minWidth: o,
-		maxWidth: c,
-		onWidthChange: l
+		minWidth: a,
+		maxWidth: o,
+		onWidthChange: c
 	}) : S;
-}, p = ({ open: n, mode: r, animated: i, duration: s, autoHide: c, className: l, children: u, left: d, center: f, right: p, ...m }) => /* @__PURE__ */ a(t, {
+}, _ = ({ open: n, mode: r, animated: i, duration: a, autoHide: o, className: l, children: u, left: d, center: f, right: p, ...m }) => /* @__PURE__ */ s(t, {
 	edge: "footer",
-	autoHide: c,
+	autoHide: o,
 	open: n,
 	mode: r,
 	animated: i,
-	duration: s,
-	children: /* @__PURE__ */ a("footer", {
+	duration: a,
+	children: /* @__PURE__ */ s("footer", {
 		className: e("dishui-page-footer", l),
 		...m,
-		children: u === void 0 ? /* @__PURE__ */ o("div", {
+		children: u === void 0 ? /* @__PURE__ */ c("div", {
 			className: "dishui-page-header-layout",
 			"data-centered": f != null && f !== !1 || void 0,
 			children: [
-				d != null && /* @__PURE__ */ a("div", {
+				d != null && /* @__PURE__ */ s("div", {
 					className: "dishui-page-header-left",
 					children: d
 				}),
-				f != null && /* @__PURE__ */ a("div", {
+				f != null && /* @__PURE__ */ s("div", {
 					className: "dishui-page-header-center",
 					children: f
 				}),
-				p != null && /* @__PURE__ */ a("div", {
+				p != null && /* @__PURE__ */ s("div", {
 					className: "dishui-page-header-right",
 					children: p
 				})
 			]
 		}) : u
 	})
-}), m = ({ scroll: t = !1, className: n = "", children: r, ...i }) => /* @__PURE__ */ a("main", {
+}), v = ({ scroll: t = !1, className: n = "", children: r, ...i }) => /* @__PURE__ */ s("main", {
 	className: e("dishui-page-main min-w-0 flex-1", t && "min-h-0 overflow-y-auto", n),
 	...i,
 	children: r
-}), h = c;
-h.Header = l, h.Footer = p, h.Float = r, h.Body = u, h.Left = d, h.Right = f, h.Main = m;
+}), y = u;
+y.Header = d, y.Footer = _, y.Float = r, y.Body = f, y.Left = p, y.Right = h, y.Main = v;
 //#endregion
-export { u as PageBody, r as PageFloat, p as PageFooter, d as PageLeft, m as PageMain, f as PageRight, h as default };
+export { f as PageBody, r as PageFloat, _ as PageFooter, p as PageLeft, v as PageMain, h as PageRight, y as default };
 
 //# sourceMappingURL=index.js.map

package/dist/components/Page/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Page/index.tsx"],"sourcesContent":["import React from 'react';\nimport PageFloat from './Float';\nimport ResizableAside, { type PageResizeProps } from './resize';\nexport type { PageFloatProps } from './Float';\nimport PageHeader, { PageHeaderProps } from '../PageHeader';\nimport { cn } from '../../utils/cn';\nimport PagePanel, { type PagePanelProps, type PageAutoHideProps } from '../PagePanel';\n\nexport type { PagePanelProps } from '../PagePanel';\n\n/**\n * Page 布局脚手架\n * ----------------------------------------------------------------------------\n * 为管理后台等页面提供统一的「页头 + 主体 + 左右侧栏」骨架，配合 PageHeader、\n * Card.Info 等组件使用。所有区域都是可选的，可按需组合。\n *\n * 典型结构：\n *   <Page fullHeight>\n *     <Page.Header title=\"用户管理\" actions={<Button>新建</Button>} />\n *     <Page.Body scroll>\n *       <Page.Left width={240}>筛选器</Page.Left>\n *       <Page.Main scroll>主内容</Page.Main>\n *       <Page.Right width={320}>详情</Page.Right>\n *     </Page.Body>\n *   </Page>\n */\n\nexport type PageProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** 是否占满父容器高度并启用内部滚动（主体区滚动，页头固定） */\n    fullHeight?: boolean;\n};\n\nexport type PageBodyProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** 主体内的间距（left/main/right 之间），数字按 px 处理，默认 16 */\n    gap?: number | string;\n    /** 是否让主体区在剩余空间内滚动（配合 Page fullHeight 使用） */\n    scroll?: boolean;\n};\n\nexport type PageAsideProps = React.HTMLAttributes<HTMLDivElement> & PagePanelProps & PageResizeProps & {\n    /** 侧栏宽度，数字按 px 处理；Left 默认 260，Right 默认 320。外部变化会同步到拖动宽度。 */\n    width?: number | string;\n    /** 是否显示分隔边框 */\n    bordered?: boolean;\n    /** 侧栏内部纵向滚动自适应 */\n    scroll?: boolean;\n    /** 小屏（<768px）下是否隐藏（侧栏通常在移动端折叠） */\n    hideOnMobile?: boolean;\n};\n\nexport type PageMainProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** 主内容区是否在剩余空间内纵向滚动 */\n    scroll?: boolean;\n};\n\nconst toCssSize = (value: number | string | undefined): string | undefined =>\n    typeof value === 'number' ? `${value}px` : value;\n\nconst Page = ({ fullHeight = false, className = '', children, ...rest }: PageProps) => (\n    <div\n        className={cn(\n            'dishui-page flex w-full min-w-0 flex-col text-body leading-5 text-base-content',\n            fullHeight && 'h-full min-h-0',\n            className,\n        )}\n        {...rest}\n    >\n        {children}\n    </div>\n);\n\n/** 页头：直接复用 PageHeader，作为 Page.Header 使用 */\nconst PageHeaderSlot = (props: PageHeaderProps) => <PageHeader {...props} />;\n\nconst PageBody = ({ gap = 16, scroll = false, className = '', style, children, ...rest }: PageBodyProps) => (\n    <div\n        className={cn(\n            'dishui-page-body flex w-full flex-col md:flex-row',\n            scroll && 'min-h-0 flex-1',\n            className,\n        )}\n        style={{ ...style, gap: 0, ['--dishui-page-gap' as string]: toCssSize(style?.gap ?? gap) }}\n        {...rest}\n    >\n        {children}\n    </div>\n);\n\nconst PageLeft = ({\n    resizeVariant = 'pill', resizable = false, minWidth = 160, maxWidth = 600, onWidthChange,\n    open, mode, animated, duration,\n    width = 260,\n    bordered = true,\n    scroll = true,\n    hideOnMobile = false,\n    className = '',\n    style,\n    children,\n    ...rest\n}: PageAsideProps) => {\n    const panel = <PagePanel edge=\"left\" width={style?.width ?? width} hideOnMobile={hideOnMobile} open={open} mode={mode} animated={animated} duration={duration}>\n    <aside\n        className={cn(\n            'dishui-page-left w-full shrink-0 md:w-(--dishui-aside-w)',\n            bordered && 'md:border-r md:border-base-300 md:pr-4',\n            scroll && 'md:min-h-0 md:overflow-y-auto',\n            hideOnMobile && 'hidden md:block',\n            className,\n        )}\n        style={{ ['--dishui-aside-w' as string]: toCssSize(width), ...style }}\n        {...rest}\n    >\n        {children}\n    </aside>\n    </PagePanel>;\n    return resizable ? <ResizableAside panel={panel} resizeVariant={resizeVariant} minWidth={minWidth} maxWidth={maxWidth} onWidthChange={onWidthChange} /> : panel;\n};\n\nconst PageRight = ({\n    resizeVariant = 'pill', resizable = false, minWidth = 160, maxWidth = 600, onWidthChange,\n    open, mode, animated, duration,\n    width = 320,\n    bordered = true,\n    scroll = true,\n    hideOnMobile = false,\n    className = '',\n    style,\n    children,\n    ...rest\n}: PageAsideProps) => {\n    const panel = <PagePanel edge=\"right\" width={style?.width ?? width} hideOnMobile={hideOnMobile} open={open} mode={mode} animated={animated} duration={duration}>\n    <aside\n        className={cn(\n            'dishui-page-right w-full shrink-0 md:w-(--dishui-aside-w)',\n            bordered && 'md:border-l md:border-base-300 md:pl-4',\n            scroll && 'md:min-h-0 md:overflow-y-auto',\n            hideOnMobile && 'hidden md:block',\n            className,\n        )}\n        style={{ ['--dishui-aside-w' as string]: toCssSize(width), ...style }}\n        {...rest}\n    >\n        {children}\n    </aside>\n    </PagePanel>;\n    return resizable ? <ResizableAside panel={panel} resizeVariant={resizeVariant} minWidth={minWidth} maxWidth={maxWidth} onWidthChange={onWidthChange} /> : panel;\n};\n\nexport type PageFooterProps = React.HTMLAttributes<HTMLElement> & PagePanelProps & PageAutoHideProps & {\n    left?: React.ReactNode;\n    center?: React.ReactNode;\n    right?: React.ReactNode;\n};\n\nconst PageFooter = ({\n    open, mode, animated, duration, autoHide, className, children, left, center, right, ...rest\n}: PageFooterProps) => (\n    <PagePanel edge=\"footer\" autoHide={autoHide} open={open} mode={mode} animated={animated} duration={duration}>\n        <footer className={cn('dishui-page-footer', className)} {...rest}>\n            {children !== undefined ? children : (\n                <div className=\"dishui-page-header-layout\" data-centered={center != null && center !== false || undefined}>\n                    {left != null && <div className=\"dishui-page-header-left\">{left}</div>}\n                    {center != null && <div className=\"dishui-page-header-center\">{center}</div>}\n                    {right != null && <div className=\"dishui-page-header-right\">{right}</div>}\n                </div>\n            )}\n        </footer>\n    </PagePanel>\n);\n\nconst PageMain = ({ scroll = false, className = '', children, ...rest }: PageMainProps) => (\n    <main\n        className={cn(\n            'dishui-page-main min-w-0 flex-1',\n            scroll && 'min-h-0 overflow-y-auto',\n            className,\n        )}\n        {...rest}\n    >\n        {children}\n    </main>\n);\n\ninterface PageCompound extends React.FC<PageProps> {\n    Header: typeof PageHeaderSlot;\n    Footer: typeof PageFooter;\n        Float: typeof PageFloat;\n    Body: typeof PageBody;\n    Left: typeof PageLeft;\n    Right: typeof PageRight;\n    Main: typeof PageMain;\n}\n\nconst PageWithCompounds = Page as PageCompound;\nPageWithCompounds.Header = PageHeaderSlot;\nPageWithCompounds.Footer = PageFooter;\nPageWithCompounds.Float = PageFloat;\nPageWithCompounds.Body = PageBody;\nPageWithCompounds.Left = PageLeft;\nPageWithCompounds.Right = PageRight;\nPageWithCompounds.Main = PageMain;\n\nexport { PageBody, PageLeft, PageRight, PageMain, PageFooter, PageFloat };\nexport default PageWithCompounds;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Page/index.tsx"],"sourcesContent":["import React from 'react';\nimport PageFloat from './Float';\nimport ResizableAside, { type PageResizeProps } from './resize';\nexport type { PageFloatProps } from './Float';\nimport PageHeader, { PageHeaderProps } from '../PageHeader';\nimport { cn } from '../../utils/cn';\nimport PagePanel, { type PagePanelProps, type PageAutoHideProps } from '../PagePanel';\n\nexport type { PagePanelProps } from '../PagePanel';\n\n/**\n * Page 布局脚手架\n * ----------------------------------------------------------------------------\n * 为管理后台等页面提供统一的「页头 + 主体 + 左右侧栏」骨架，配合 PageHeader、\n * Card.Info 等组件使用。所有区域都是可选的，可按需组合。\n *\n * 典型结构：\n *   <Page fullHeight>\n *     <Page.Header title=\"用户管理\" actions={<Button>新建</Button>} />\n *     <Page.Body scroll>\n *       <Page.Left width={240}>筛选器</Page.Left>\n *       <Page.Main scroll>主内容</Page.Main>\n *       <Page.Right width={320}>详情</Page.Right>\n *     </Page.Body>\n *   </Page>\n */\n\nexport type PageProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** 是否占满父容器高度并启用内部滚动（主体区滚动，页头固定） */\n    fullHeight?: boolean;\n};\n\nexport type PageBodyProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** 主体内的间距（left/main/right 之间），数字按 px 处理，默认 16 */\n    gap?: number | string;\n    /** 是否让主体区在剩余空间内滚动（配合 Page fullHeight 使用） */\n    scroll?: boolean;\n};\n\nexport type PageHeaderLevel = PageHeaderProps & { key: React.Key };\nexport type PageHeaderSlotProps = PageHeaderProps & {\n    /** 按顺序从上到下渲染；每级覆盖公共属性。空数组不渲染页头。 */\n    levels?: readonly PageHeaderLevel[];\n};\n\nexport type PageAsideLevel = PageAsideProps & { key: React.Key };\nexport type PageAsideSlotProps = PageAsideProps & {\n    /** 按 DOM 顺序从左到右渲染（小屏纵向堆叠）；每级覆盖公共属性。 */\n    levels?: readonly PageAsideLevel[];\n};\n\nexport type PageAsideProps = React.HTMLAttributes<HTMLDivElement> & PagePanelProps & PageResizeProps & {\n    /** 侧栏宽度，数字按 px 处理；Left 默认 260，Right 默认 320。外部变化会同步到拖动宽度。 */\n    width?: number | string;\n    /** 是否显示分隔边框 */\n    bordered?: boolean;\n    /** 侧栏内部纵向滚动自适应 */\n    scroll?: boolean;\n    /** 小屏（<768px）下是否隐藏（侧栏通常在移动端折叠） */\n    hideOnMobile?: boolean;\n};\n\nexport type PageMainProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** 主内容区是否在剩余空间内纵向滚动 */\n    scroll?: boolean;\n};\n\nconst toCssSize = (value: number | string | undefined): string | undefined =>\n    typeof value === 'number' ? `${value}px` : value;\n\nconst Page = ({ fullHeight = false, className = '', children, ...rest }: PageProps) => (\n    <div\n        className={cn(\n            'dishui-page flex w-full min-w-0 flex-col text-body leading-5 text-base-content',\n            fullHeight && 'h-full min-h-0',\n            className,\n        )}\n        {...rest}\n    >\n        {children}\n    </div>\n);\n\n/** 不增加包装节点，保持 Page / Body 的布局、间距及面板开关语义。 */\nconst PageHeaderSlot = ({ levels, ...props }: PageHeaderSlotProps) => levels === undefined\n    ? <PageHeader {...props} />\n    : <>{levels.map(({ key, ...level }) => <PageHeader {...props} {...level} key={key} />)}</>;\n\nconst PageBody = ({ gap = 16, scroll = false, className = '', style, children, ...rest }: PageBodyProps) => (\n    <div\n        className={cn(\n            'dishui-page-body flex w-full flex-col md:flex-row',\n            scroll && 'min-h-0 flex-1',\n            className,\n        )}\n        style={{ ...style, gap: 0, ['--dishui-page-gap' as string]: toCssSize(style?.gap ?? gap) }}\n        {...rest}\n    >\n        {children}\n    </div>\n);\n\nconst PageLeft = ({ levels, ...props }: PageAsideSlotProps): React.ReactElement => levels === undefined\n    ? PageLeftPanel(props)\n    : <>{levels.map(({ key, ...level }) => <PageLeftPanel {...props} {...level} key={key} />)}</>;\n\nconst PageLeftPanel = ({\n    resizeVariant = 'pill', resizable = false, minWidth = 160, maxWidth = 600, onWidthChange,\n    open, mode, animated, duration,\n    width = 260,\n    bordered = true,\n    scroll = true,\n    hideOnMobile = false,\n    className = '',\n    style,\n    children,\n    ...rest\n}: PageAsideProps) => {\n    const panel = <PagePanel edge=\"left\" width={style?.width ?? width} hideOnMobile={hideOnMobile} open={open} mode={mode} animated={animated} duration={duration}>\n    <aside\n        className={cn(\n            'dishui-page-left w-full shrink-0 md:w-(--dishui-aside-w)',\n            bordered && 'md:border-r md:border-base-300 md:pr-4',\n            scroll && 'md:min-h-0 md:overflow-y-auto',\n            hideOnMobile && 'hidden md:block',\n            className,\n        )}\n        style={{ ['--dishui-aside-w' as string]: toCssSize(width), ...style }}\n        {...rest}\n    >\n        {children}\n    </aside>\n    </PagePanel>;\n    return resizable ? <ResizableAside panel={panel} resizeVariant={resizeVariant} minWidth={minWidth} maxWidth={maxWidth} onWidthChange={onWidthChange} /> : panel;\n};\n\nconst PageRight = ({ levels, ...props }: PageAsideSlotProps): React.ReactElement => levels === undefined\n    ? PageRightPanel(props)\n    : <>{levels.map(({ key, ...level }) => <PageRightPanel {...props} {...level} key={key} />)}</>;\n\nconst PageRightPanel = ({\n    resizeVariant = 'pill', resizable = false, minWidth = 160, maxWidth = 600, onWidthChange,\n    open, mode, animated, duration,\n    width = 320,\n    bordered = true,\n    scroll = true,\n    hideOnMobile = false,\n    className = '',\n    style,\n    children,\n    ...rest\n}: PageAsideProps) => {\n    const panel = <PagePanel edge=\"right\" width={style?.width ?? width} hideOnMobile={hideOnMobile} open={open} mode={mode} animated={animated} duration={duration}>\n    <aside\n        className={cn(\n            'dishui-page-right w-full shrink-0 md:w-(--dishui-aside-w)',\n            bordered && 'md:border-l md:border-base-300 md:pl-4',\n            scroll && 'md:min-h-0 md:overflow-y-auto',\n            hideOnMobile && 'hidden md:block',\n            className,\n        )}\n        style={{ ['--dishui-aside-w' as string]: toCssSize(width), ...style }}\n        {...rest}\n    >\n        {children}\n    </aside>\n    </PagePanel>;\n    return resizable ? <ResizableAside panel={panel} resizeVariant={resizeVariant} minWidth={minWidth} maxWidth={maxWidth} onWidthChange={onWidthChange} /> : panel;\n};\n\nexport type PageFooterProps = React.HTMLAttributes<HTMLElement> & PagePanelProps & PageAutoHideProps & {\n    left?: React.ReactNode;\n    center?: React.ReactNode;\n    right?: React.ReactNode;\n};\n\nconst PageFooter = ({\n    open, mode, animated, duration, autoHide, className, children, left, center, right, ...rest\n}: PageFooterProps) => (\n    <PagePanel edge=\"footer\" autoHide={autoHide} open={open} mode={mode} animated={animated} duration={duration}>\n        <footer className={cn('dishui-page-footer', className)} {...rest}>\n            {children !== undefined ? children : (\n                <div className=\"dishui-page-header-layout\" data-centered={center != null && center !== false || undefined}>\n                    {left != null && <div className=\"dishui-page-header-left\">{left}</div>}\n                    {center != null && <div className=\"dishui-page-header-center\">{center}</div>}\n                    {right != null && <div className=\"dishui-page-header-right\">{right}</div>}\n                </div>\n            )}\n        </footer>\n    </PagePanel>\n);\n\nconst PageMain = ({ scroll = false, className = '', children, ...rest }: PageMainProps) => (\n    <main\n        className={cn(\n            'dishui-page-main min-w-0 flex-1',\n            scroll && 'min-h-0 overflow-y-auto',\n            className,\n        )}\n        {...rest}\n    >\n        {children}\n    </main>\n);\n\ninterface PageCompound extends React.FC<PageProps> {\n    Header: typeof PageHeaderSlot;\n    Footer: typeof PageFooter;\n        Float: typeof PageFloat;\n    Body: typeof PageBody;\n    Left: typeof PageLeft;\n    Right: typeof PageRight;\n    Main: typeof PageMain;\n}\n\nconst PageWithCompounds = Page as PageCompound;\nPageWithCompounds.Header = PageHeaderSlot;\nPageWithCompounds.Footer = PageFooter;\nPageWithCompounds.Float = PageFloat;\nPageWithCompounds.Body = PageBody;\nPageWithCompounds.Left = PageLeft;\nPageWithCompounds.Right = PageRight;\nPageWithCompounds.Main = PageMain;\n\nexport { PageBody, PageLeft, PageRight, PageMain, PageFooter, PageFloat };\nexport default PageWithCompounds;\n"],"mappings":"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"}

package/dist/components/Text/index.d.ts

@@ -12,7 +12,7 @@ export type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'color'> & {
     size?: TextSize;
     /** Font weight. */
     weight?: TextWeight;
-    /** Semantic color. */
+    /** `muted` is neutral supporting text; `secondary` is the explicit theme brand color. */
     color?: TextColor;
     /** Text alignment. */
     align?: TextAlign;

package/dist/components/Text/index.js

@@ -18,9 +18,9 @@ var n = {
 	bold: "font-bold"
 }, i = {
 	default: "text-base-content",
-	muted: "text-base-content/60",
+	muted: "text-[color:var(--dishui-text-secondary)]",
 	primary: "text-primary",
-	secondary: "text-secondary",
+	secondary: "text-[color:var(--color-secondary)]",
 	accent: "text-accent",
 	info: "text-info",
 	success: "text-success",

package/dist/components/Text/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Text/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type TextElement =\n  | 'span'\n  | 'p'\n  | 'div'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6'\n  | 'strong'\n  | 'em'\n  | 'small'\n  | 'code';\n\nexport type TextSize =\n  | 'xs'\n  | 'sm'\n  | 'base'\n  | 'lg'\n  | 'xl'\n  | '2xl'\n  | '3xl'\n  | '4xl';\n\nexport type TextWeight = 'normal' | 'medium' | 'semibold' | 'bold';\n\nexport type TextColor =\n  | 'default'\n  | 'muted'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'inherit';\n\nexport type TextAlign = 'left' | 'center' | 'right' | 'justify';\n\nexport type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'color'> & {\n  children?: React.ReactNode;\n  /** Rendered HTML element. */\n  as?: TextElement;\n  /** Font size preset. */\n  size?: TextSize;\n  /** Font weight. */\n  weight?: TextWeight;\n  /** Semantic color. */\n  color?: TextColor;\n  /** Text alignment. */\n  align?: TextAlign;\n  /** Single-line ellipsis. */\n  truncate?: boolean;\n  /** Multi-line clamp (number of lines). */\n  clamp?: number;\n  /** Italic style. */\n  italic?: boolean;\n  /** Underline decoration. */\n  underline?: boolean;\n  /** Uppercase + letter-spacing (overline style). */\n  uppercase?: boolean;\n  /** Monospace font. */\n  mono?: boolean;\n  /** Extra class names. */\n  className?: string;\n  /** Inline styles. */\n  style?: React.CSSProperties;\n  /** Click handler. */\n  onClick?: (e: React.MouseEvent<HTMLElement>) => void;\n};\n\nconst SIZE_CLASS: Record<TextSize, string> = {\n  xs: 'text-xs',\n  sm: 'text-sm',\n  base: 'text-base',\n  lg: 'text-lg',\n  xl: 'text-xl',\n  '2xl': 'text-2xl',\n  '3xl': 'text-3xl',\n  '4xl': 'text-4xl',\n};\n\nconst WEIGHT_CLASS: Record<TextWeight, string> = {\n  normal: 'font-normal',\n  medium: 'font-medium',\n  semibold: 'font-semibold',\n  bold: 'font-bold',\n};\n\nconst COLOR_CLASS: Record<TextColor, string> = {\n  default: 'text-base-content',\n  muted: 'text-base-content/60',\n  primary: 'text-primary',\n  secondary: 'text-secondary',\n  accent: 'text-accent',\n  info: 'text-info',\n  success: 'text-success',\n  warning: 'text-warning',\n  error: 'text-error',\n  inherit: '',\n};\n\nconst ALIGN_CLASS: Record<TextAlign, string> = {\n  left: 'text-left',\n  center: 'text-center',\n  right: 'text-right',\n  justify: 'text-justify',\n};\n\n/**\n * Text —— A2UI 展示组件：文本排版原语。\n * 统一字号 / 字重 / 语义色 / 对齐与截断，替代散落各处的裸 `text-*` 组合。\n */\nconst Text: React.FC<TextProps> = ({\n  children,\n  as = 'span',\n  size = 'base',\n  weight = 'normal',\n  color = 'default',\n  align,\n  truncate = false,\n  clamp,\n  italic = false,\n  underline = false,\n  uppercase = false,\n  mono = false,\n  className = '',\n  style,\n  onClick,\n  ...attributes\n}) => {\n  const Tag = as as React.ElementType;\n\n  const classes = cn(\n    SIZE_CLASS[size],\n    WEIGHT_CLASS[weight],\n    COLOR_CLASS[color],\n    align && ALIGN_CLASS[align],\n    truncate && 'truncate',\n    italic && 'italic',\n    underline && 'underline',\n    uppercase && 'uppercase tracking-wider',\n    mono && 'font-mono',\n    !truncate && clamp && clamp > 0 && 'overflow-hidden',\n    className,\n  );\n\n  const clampStyle: React.CSSProperties =\n    !truncate && clamp && clamp > 0\n      ? {\n          display: '-webkit-box',\n          WebkitLineClamp: clamp,\n          WebkitBoxOrient: 'vertical',\n          overflow: 'hidden',\n        }\n      : {};\n\n  return (\n    <Tag {...attributes} className={classes} style={{ ...clampStyle, ...style }} onClick={onClick}>\n      {children}\n    </Tag>\n  );\n};\n\nexport default Text;\n"],"mappings":";;;;AA4EA,IAAM,IAAuC;CAC3C,IAAI;CACJ,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,OAAO;CACP,OAAO;CACP,OAAO;AACT,GAEM,IAA2C;CAC/C,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,MAAM;AACR,GAEM,IAAyC;CAC7C,SAAS;CACT,OAAO;CACP,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;AACX,GAEM,IAAyC;CAC7C,MAAM;CACN,QAAQ;CACR,OAAO;CACP,SAAS;AACX,GAMM,KAA6B,EACjC,aACA,QAAK,QACL,UAAO,QACP,YAAS,UACT,WAAQ,WACR,UACA,cAAW,IACX,UACA,YAAS,IACT,eAAY,IACZ,eAAY,IACZ,UAAO,IACP,eAAY,IACZ,UACA,YACA,GAAG,QACC;CACJ,IAAM,IAAM,GAEN,IAAU,EACd,EAAW,IACX,EAAa,IACb,EAAY,IACZ,KAAS,EAAY,IACrB,KAAY,YACZ,KAAU,UACV,KAAa,aACb,KAAa,4BACb,KAAQ,aACR,CAAC,KAAY,KAAS,IAAQ,KAAK,mBACnC,CACF,GAEM,IACJ,CAAC,KAAY,KAAS,IAAQ,IAC1B;EACE,SAAS;EACT,iBAAiB;EACjB,iBAAiB;EACjB,UAAU;CACZ,IACA,CAAC;CAEP,OACE,kBAAC,GAAD;EAAK,GAAI;EAAY,WAAW;EAAS,OAAO;GAAE,GAAG;GAAY,GAAG;EAAM;EAAY;EACnF;CACE,CAAA;AAET"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Text/index.tsx"],"sourcesContent":["import React from 'react';\nimport { cn } from '../../utils/cn';\n\nexport type TextElement =\n  | 'span'\n  | 'p'\n  | 'div'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6'\n  | 'strong'\n  | 'em'\n  | 'small'\n  | 'code';\n\nexport type TextSize =\n  | 'xs'\n  | 'sm'\n  | 'base'\n  | 'lg'\n  | 'xl'\n  | '2xl'\n  | '3xl'\n  | '4xl';\n\nexport type TextWeight = 'normal' | 'medium' | 'semibold' | 'bold';\n\nexport type TextColor =\n  | 'default'\n  | 'muted'\n  | 'primary'\n  | 'secondary'\n  | 'accent'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'inherit';\n\nexport type TextAlign = 'left' | 'center' | 'right' | 'justify';\n\nexport type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'color'> & {\n  children?: React.ReactNode;\n  /** Rendered HTML element. */\n  as?: TextElement;\n  /** Font size preset. */\n  size?: TextSize;\n  /** Font weight. */\n  weight?: TextWeight;\n  /** `muted` is neutral supporting text; `secondary` is the explicit theme brand color. */\n  color?: TextColor;\n  /** Text alignment. */\n  align?: TextAlign;\n  /** Single-line ellipsis. */\n  truncate?: boolean;\n  /** Multi-line clamp (number of lines). */\n  clamp?: number;\n  /** Italic style. */\n  italic?: boolean;\n  /** Underline decoration. */\n  underline?: boolean;\n  /** Uppercase + letter-spacing (overline style). */\n  uppercase?: boolean;\n  /** Monospace font. */\n  mono?: boolean;\n  /** Extra class names. */\n  className?: string;\n  /** Inline styles. */\n  style?: React.CSSProperties;\n  /** Click handler. */\n  onClick?: (e: React.MouseEvent<HTMLElement>) => void;\n};\n\nconst SIZE_CLASS: Record<TextSize, string> = {\n  xs: 'text-xs',\n  sm: 'text-sm',\n  base: 'text-base',\n  lg: 'text-lg',\n  xl: 'text-xl',\n  '2xl': 'text-2xl',\n  '3xl': 'text-3xl',\n  '4xl': 'text-4xl',\n};\n\nconst WEIGHT_CLASS: Record<TextWeight, string> = {\n  normal: 'font-normal',\n  medium: 'font-medium',\n  semibold: 'font-semibold',\n  bold: 'font-bold',\n};\n\nconst COLOR_CLASS: Record<TextColor, string> = {\n  default: 'text-base-content',\n  muted: 'text-[color:var(--dishui-text-secondary)]',\n  primary: 'text-primary',\n  secondary: 'text-[color:var(--color-secondary)]',\n  accent: 'text-accent',\n  info: 'text-info',\n  success: 'text-success',\n  warning: 'text-warning',\n  error: 'text-error',\n  inherit: '',\n};\n\nconst ALIGN_CLASS: Record<TextAlign, string> = {\n  left: 'text-left',\n  center: 'text-center',\n  right: 'text-right',\n  justify: 'text-justify',\n};\n\n/**\n * Text —— A2UI 展示组件：文本排版原语。\n * 统一字号 / 字重 / 语义色 / 对齐与截断，替代散落各处的裸 `text-*` 组合。\n */\nconst Text: React.FC<TextProps> = ({\n  children,\n  as = 'span',\n  size = 'base',\n  weight = 'normal',\n  color = 'default',\n  align,\n  truncate = false,\n  clamp,\n  italic = false,\n  underline = false,\n  uppercase = false,\n  mono = false,\n  className = '',\n  style,\n  onClick,\n  ...attributes\n}) => {\n  const Tag = as as React.ElementType;\n\n  const classes = cn(\n    SIZE_CLASS[size],\n    WEIGHT_CLASS[weight],\n    COLOR_CLASS[color],\n    align && ALIGN_CLASS[align],\n    truncate && 'truncate',\n    italic && 'italic',\n    underline && 'underline',\n    uppercase && 'uppercase tracking-wider',\n    mono && 'font-mono',\n    !truncate && clamp && clamp > 0 && 'overflow-hidden',\n    className,\n  );\n\n  const clampStyle: React.CSSProperties =\n    !truncate && clamp && clamp > 0\n      ? {\n          display: '-webkit-box',\n          WebkitLineClamp: clamp,\n          WebkitBoxOrient: 'vertical',\n          overflow: 'hidden',\n        }\n      : {};\n\n  return (\n    <Tag {...attributes} className={classes} style={{ ...clampStyle, ...style }} onClick={onClick}>\n      {children}\n    </Tag>\n  );\n};\n\nexport default Text;\n"],"mappings":";;;;AA4EA,IAAM,IAAuC;CAC3C,IAAI;CACJ,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,OAAO;CACP,OAAO;CACP,OAAO;AACT,GAEM,IAA2C;CAC/C,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,MAAM;AACR,GAEM,IAAyC;CAC7C,SAAS;CACT,OAAO;CACP,SAAS;CACT,WAAW;CACX,QAAQ;CACR,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;AACX,GAEM,IAAyC;CAC7C,MAAM;CACN,QAAQ;CACR,OAAO;CACP,SAAS;AACX,GAMM,KAA6B,EACjC,aACA,QAAK,QACL,UAAO,QACP,YAAS,UACT,WAAQ,WACR,UACA,cAAW,IACX,UACA,YAAS,IACT,eAAY,IACZ,eAAY,IACZ,UAAO,IACP,eAAY,IACZ,UACA,YACA,GAAG,QACC;CACJ,IAAM,IAAM,GAEN,IAAU,EACd,EAAW,IACX,EAAa,IACb,EAAY,IACZ,KAAS,EAAY,IACrB,KAAY,YACZ,KAAU,UACV,KAAa,aACb,KAAa,4BACb,KAAQ,aACR,CAAC,KAAY,KAAS,IAAQ,KAAK,mBACnC,CACF,GAEM,IACJ,CAAC,KAAY,KAAS,IAAQ,IAC1B;EACE,SAAS;EACT,iBAAiB;EACjB,iBAAiB;EACjB,UAAU;CACZ,IACA,CAAC;CAEP,OACE,kBAAC,GAAD;EAAK,GAAI;EAAY,WAAW;EAAS,OAAO;GAAE,GAAG;GAAY,GAAG;EAAM;EAAY;EACnF;CACE,CAAA;AAET"}