@novi-ui/flatlay 0.1.0

package/dist/breadcrumbs/breadcrumbs.mjs

@@ -0,0 +1,82 @@
+"use client";
+import { breadcrumbsStyles } from "./breadcrumbs.styles.mjs";
+import { Breadcrumb, Breadcrumbs, Link } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+//#region src/breadcrumbs/breadcrumbs.tsx
+/**
+* 区切り文字を子へ渡す。
+*
+* 各項目が自分の前に区切りを描画し、先頭だけ CSS で隠す。
+* 親側で children を加工して区切りを差し込むと、
+* RAC が期待する `<ol> > <li>` の構造が壊れる。
+*/
+const SeparatorContext = createContext("/");
+/**
+* 階層の1段。`href` を省略した項目が現在地になる。
+*
+* @example
+* <Breadcrumb href="/docs">ドキュメント</Breadcrumb>
+*/
+function Breadcrumb$1({ href, children, className }) {
+	const s = breadcrumbsStyles();
+	const separator = useContext(SeparatorContext);
+	return /* @__PURE__ */ jsxs(Breadcrumb, {
+		"data-slot": "item",
+		className: s.item({ class: className }),
+		children: [/* @__PURE__ */ jsx("span", {
+			"data-slot": "separator",
+			className: s.separator(),
+			"aria-hidden": "true",
+			children: separator
+		}), href === void 0 ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "current",
+			"aria-current": "page",
+			className: s.current(),
+			children
+		}) : /* @__PURE__ */ jsx(Link, {
+			href,
+			"data-slot": "link",
+			className: s.link(),
+			children
+		})]
+	});
+}
+/**
+* 階層の中で現在どこにいるかを示す。
+*
+* 区切りの `/` は等幅で出ます。階層の列を「文」ではなく「番地」として
+* 読ませるためで、段の深さが目で数えられます。
+*
+* リンクは既定で下線を持ちます。色だけで押せることを示さないためです。
+* 現在地はリンクにならず、太さだけで示します。
+*
+* @example
+* <Breadcrumbs>
+*   <Breadcrumb href="/">ホーム</Breadcrumb>
+*   <Breadcrumb href="/docs">ドキュメント</Breadcrumb>
+*   <Breadcrumb>Button</Breadcrumb>
+* </Breadcrumbs>
+*/
+function Breadcrumbs$1({ size, separator = "/", isDisabled, children, className, classNames, id }) {
+	const s = breadcrumbsStyles({ size });
+	return /* @__PURE__ */ jsx(SeparatorContext.Provider, {
+		value: separator,
+		children: /* @__PURE__ */ jsx("nav", {
+			id,
+			"aria-label": "パンくずリスト",
+			"data-slot": "root",
+			className: s.root({ class: [className, classNames?.root] }),
+			children: /* @__PURE__ */ jsx(Breadcrumbs, {
+				isDisabled,
+				"data-slot": "list",
+				className: s.list({ class: classNames?.list }),
+				children
+			})
+		})
+	});
+}
+//#endregion
+export { Breadcrumb$1 as Breadcrumb, Breadcrumbs$1 as Breadcrumbs };
+
+//# sourceMappingURL=breadcrumbs.mjs.map

package/dist/breadcrumbs/breadcrumbs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.mjs","names":["Breadcrumb","RACBreadcrumb","Breadcrumbs","RACBreadcrumbs"],"sources":["../../src/breadcrumbs/breadcrumbs.tsx"],"sourcesContent":["'use client'\n\nimport type { BreadcrumbsProps } from '@novi-ui/core'\nimport { createContext, type ReactNode, useContext } from 'react'\nimport {\n  Link,\n  Breadcrumb as RACBreadcrumb,\n  Breadcrumbs as RACBreadcrumbs,\n} from 'react-aria-components'\nimport { breadcrumbsStyles } from './breadcrumbs.styles'\n\n/**\n * 区切り文字を子へ渡す。\n *\n * 各項目が自分の前に区切りを描画し、先頭だけ CSS で隠す。\n * 親側で children を加工して区切りを差し込むと、\n * RAC が期待する `<ol> > <li>` の構造が壊れる。\n */\nconst SeparatorContext = createContext<ReactNode>('/')\n\nexport interface BreadcrumbProps {\n  /** 省略すると現在地として扱い、リンクにしない */\n  href?: string\n  children?: ReactNode\n  className?: string\n}\n\n/**\n * 階層の1段。`href` を省略した項目が現在地になる。\n *\n * @example\n * <Breadcrumb href=\"/docs\">ドキュメント</Breadcrumb>\n */\nexport function Breadcrumb({ href, children, className }: BreadcrumbProps) {\n  const s = breadcrumbsStyles()\n  const separator = useContext(SeparatorContext)\n\n  return (\n    <RACBreadcrumb data-slot=\"item\" className={s.item({ class: className })}>\n      <span data-slot=\"separator\" className={s.separator()} aria-hidden=\"true\">\n        {separator}\n      </span>\n\n      {href === undefined ? (\n        // 現在地はリンクにしない。RAC は Link にしか aria-current を付けないので、\n        // ここでは自分で付ける必要がある\n        <span data-slot=\"current\" aria-current=\"page\" className={s.current()}>\n          {children}\n        </span>\n      ) : (\n        <Link href={href} data-slot=\"link\" className={s.link()}>\n          {children}\n        </Link>\n      )}\n    </RACBreadcrumb>\n  )\n}\n\n/**\n * 階層の中で現在どこにいるかを示す。\n *\n * 区切りの `/` は等幅で出ます。階層の列を「文」ではなく「番地」として\n * 読ませるためで、段の深さが目で数えられます。\n *\n * リンクは既定で下線を持ちます。色だけで押せることを示さないためです。\n * 現在地はリンクにならず、太さだけで示します。\n *\n * @example\n * <Breadcrumbs>\n *   <Breadcrumb href=\"/\">ホーム</Breadcrumb>\n *   <Breadcrumb href=\"/docs\">ドキュメント</Breadcrumb>\n *   <Breadcrumb>Button</Breadcrumb>\n * </Breadcrumbs>\n */\nexport function Breadcrumbs({\n  size,\n  separator = '/',\n  isDisabled,\n  children,\n  className,\n  classNames,\n  id,\n}: BreadcrumbsProps) {\n  const s = breadcrumbsStyles({ size })\n\n  return (\n    <SeparatorContext.Provider value={separator}>\n      {/* nav でラップして現在地の階層であることを伝える */}\n      <nav\n        id={id}\n        aria-label=\"パンくずリスト\"\n        data-slot=\"root\"\n        className={s.root({ class: [className, classNames?.root] })}\n      >\n        <RACBreadcrumbs\n          isDisabled={isDisabled}\n          data-slot=\"list\"\n          className={s.list({ class: classNames?.list })}\n        >\n          {children}\n        </RACBreadcrumbs>\n      </nav>\n    </SeparatorContext.Provider>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;AAkBA,MAAM,mBAAmB,cAAyB,GAAG;;;;;;;AAerD,SAAgBA,aAAW,EAAE,MAAM,UAAU,aAA8B;CACzE,MAAM,IAAI,kBAAkB;CAC5B,MAAM,YAAY,WAAW,gBAAgB;CAE7C,OACE,qBAACC,YAAD;EAAe,aAAU;EAAO,WAAW,EAAE,KAAK,EAAE,OAAO,UAAU,CAAC;EAAtE,UAAA,CACE,oBAAC,QAAD;GAAM,aAAU;GAAY,WAAW,EAAE,UAAU;GAAG,eAAY;GAC/D,UAAA;EACG,CAAA,GAEL,SAAS,KAAA,IAGR,oBAAC,QAAD;GAAM,aAAU;GAAU,gBAAa;GAAO,WAAW,EAAE,QAAQ;GAChE;EACG,CAAA,IAEN,oBAAC,MAAD;GAAY;GAAM,aAAU;GAAO,WAAW,EAAE,KAAK;GAClD;EACG,CAAA,CAEK;;AAEnB;;;;;;;;;;;;;;;;;AAkBA,SAAgBC,cAAY,EAC1B,MACA,YAAY,KACZ,YACA,UACA,WACA,YACA,MACmB;CACnB,MAAM,IAAI,kBAAkB,EAAE,KAAK,CAAC;CAEpC,OACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO;EAEhC,UAAA,oBAAC,OAAD;GACM;GACJ,cAAW;GACX,aAAU;GACV,WAAW,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,YAAY,IAAI,EAAE,CAAC;GAE1D,UAAA,oBAACC,aAAD;IACc;IACZ,aAAU;IACV,WAAW,EAAE,KAAK,EAAE,OAAO,YAAY,KAAK,CAAC;IAE5C;GACa,CAAA;EACb,CAAA;CACoB,CAAA;AAE/B"}

package/dist/breadcrumbs/breadcrumbs.styles.d.mts

@@ -0,0 +1,46 @@
+import { VariantMap } from "@novi-ui/core";
+//#region src/breadcrumbs/breadcrumbs.styles.d.ts
+/**
+ * Breadcrumbs のスタイル定義。
+ *
+ * @example
+ * const myCrumbs = tv({ extend: breadcrumbsStyles, slots: { separator: 'mx-2' } })
+ */
+declare const breadcrumbsStyles: import("tailwind-variants").TVReturnType<{
+  size: VariantMap<"sm" | "md" | "lg", {
+    list: string;
+  }>;
+}, {
+  root: string;
+  list: string;
+  item: string;
+  link: string;
+  separator: string;
+  current: string;
+}, undefined, {
+  size: VariantMap<"sm" | "md" | "lg", {
+    list: string;
+  }>;
+}, {
+  root: string;
+  list: string;
+  item: string;
+  link: string;
+  separator: string;
+  current: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  size: VariantMap<"sm" | "md" | "lg", {
+    list: string;
+  }>;
+}, {
+  root: string;
+  list: string;
+  item: string;
+  link: string;
+  separator: string;
+  current: string;
+}>>;
+type BreadcrumbsStyleProps = Parameters<typeof breadcrumbsStyles>[0];
+//#endregion
+export { BreadcrumbsStyleProps, breadcrumbsStyles };
+//# sourceMappingURL=breadcrumbs.styles.d.mts.map

package/dist/breadcrumbs/breadcrumbs.styles.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.styles.d.mts","names":[],"sources":["../../src/breadcrumbs/breadcrumbs.styles.ts"],"mappings":";;;;;;;;cAqDa,+CAAiB;;IAZW;;;;;;;;;;;IAAA;;;;;;;;;;;IAAA;;;;;;;;;;KAkB7B,wBAAwB,kBAAkB"}

package/dist/breadcrumbs/breadcrumbs.styles.mjs

@@ -0,0 +1,45 @@
+import { focusRing } from "../styles/focus-ring.mjs";
+import { mono } from "../styles/mono.mjs";
+import { tv } from "tailwind-variants";
+//#region src/breadcrumbs/breadcrumbs.styles.ts
+/**
+* Flatlay の Breadcrumbs は**書類の参照番号**。
+*
+* 区切りの `/` を等幅で出すのは、階層の列が「文」ではなく「番地」だから（ADR-F7）。
+* 等幅にすると段の深さが目で数えられ、折り返しても列がずれない。
+*
+* 現在地は色を変えず太さだけで示す。色で示すと「リンクの色違い」に見え、
+* 押せるのか押せないのかが読めなくなる。
+*/
+const slots = {
+	root: "flex",
+	list: ["flex flex-wrap items-center gap-1.5", "[&>li:first-child>[data-slot=separator]]:hidden"].join(" "),
+	item: "flex items-center gap-1.5",
+	link: [
+		"text-[var(--novi-color-muted)] underline underline-offset-4",
+		"transition-colors duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]",
+		"hover:text-[var(--novi-color-fg)]",
+		focusRing
+	].join(" "),
+	separator: `text-[var(--novi-color-border-strong)] select-none ${mono}`,
+	current: "text-[var(--novi-color-fg)] font-medium"
+};
+/**
+* Breadcrumbs のスタイル定義。
+*
+* @example
+* const myCrumbs = tv({ extend: breadcrumbsStyles, slots: { separator: 'mx-2' } })
+*/
+const breadcrumbsStyles = tv({
+	slots,
+	variants: { size: {
+		sm: { list: "text-[length:var(--novi-text-xs)]" },
+		md: { list: "text-[length:var(--novi-text-sm)]" },
+		lg: { list: "text-[length:var(--novi-text-base)]" }
+	} },
+	defaultVariants: { size: "md" }
+});
+//#endregion
+export { breadcrumbsStyles };
+
+//# sourceMappingURL=breadcrumbs.styles.mjs.map

package/dist/breadcrumbs/breadcrumbs.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.styles.mjs","names":[],"sources":["../../src/breadcrumbs/breadcrumbs.styles.ts"],"sourcesContent":["import type {\n  breadcrumbsRequiredSlots,\n  breadcrumbsSlots,\n  NoviSize,\n  SlotMap,\n  VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { focusRing } from '../styles/focus-ring'\nimport { mono } from '../styles/mono'\n\n/**\n * Flatlay の Breadcrumbs は**書類の参照番号**。\n *\n * 区切りの `/` を等幅で出すのは、階層の列が「文」ではなく「番地」だから（ADR-F7）。\n * 等幅にすると段の深さが目で数えられ、折り返しても列がずれない。\n *\n * 現在地は色を変えず太さだけで示す。色で示すと「リンクの色違い」に見え、\n * 押せるのか押せないのかが読めなくなる。\n */\nconst slots = {\n  // root は <nav>、list は RAC が描画する <ol>。nav > ol が意味的に正しい構造\n  root: 'flex',\n  list: [\n    'flex flex-wrap items-center gap-1.5',\n    // 先頭の項目だけ区切り文字を隠す。各項目が自分の前に区切りを持つ構造\n    '[&>li:first-child>[data-slot=separator]]:hidden',\n  ].join(' '),\n  item: 'flex items-center gap-1.5',\n  link: [\n    'text-[var(--novi-color-muted)] underline underline-offset-4',\n    'transition-colors duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n    'hover:text-[var(--novi-color-fg)]',\n    focusRing,\n  ].join(' '),\n  // 装飾なので支援技術には読ませない\n  separator: `text-[var(--novi-color-border-strong)] select-none ${mono}`,\n  // 現在地はリンクにしない。色ではなく太さで示す\n  current: 'text-[var(--novi-color-fg)] font-medium',\n} satisfies SlotMap<typeof breadcrumbsSlots, (typeof breadcrumbsRequiredSlots)[number]>\n\nconst size: VariantMap<NoviSize, { list: string }> = {\n  sm: { list: 'text-[length:var(--novi-text-xs)]' },\n  md: { list: 'text-[length:var(--novi-text-sm)]' },\n  lg: { list: 'text-[length:var(--novi-text-base)]' },\n}\n\n/**\n * Breadcrumbs のスタイル定義。\n *\n * @example\n * const myCrumbs = tv({ extend: breadcrumbsStyles, slots: { separator: 'mx-2' } })\n */\nexport const breadcrumbsStyles = tv({\n  slots,\n  variants: { size },\n  defaultVariants: { size: 'md' },\n})\n\nexport type BreadcrumbsStyleProps = Parameters<typeof breadcrumbsStyles>[0]\n"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,QAAQ;CAEZ,MAAM;CACN,MAAM,CACJ,uCAEA,iDACF,CAAC,CAAC,KAAK,GAAG;CACV,MAAM;CACN,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,WAAW,sDAAsD;CAEjE,SAAS;AACX;;;;;;;AAcA,MAAa,oBAAoB,GAAG;CAClC;CACA,UAAU,EAAE;EAbZ,IAAI,EAAE,MAAM,oCAAoC;EAChD,IAAI,EAAE,MAAM,oCAAoC;EAChD,IAAI,EAAE,MAAM,sCAAsC;CAWtC,EAAK;CACjB,iBAAiB,EAAE,MAAM,KAAK;AAChC,CAAC"}

package/dist/breadcrumbs/index.d.mts

@@ -0,0 +1,3 @@
+import { Breadcrumb, BreadcrumbProps, Breadcrumbs } from "./breadcrumbs.mjs";
+import { BreadcrumbsStyleProps, breadcrumbsStyles } from "./breadcrumbs.styles.mjs";
+export { Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsStyleProps, breadcrumbsStyles };

package/dist/button/button.d.mts

@@ -0,0 +1,18 @@
+import { ButtonProps } from "@novi-ui/core";
+//#region src/button/button.d.ts
+/**
+ * ボタン。
+ *
+ * 押すと面と文字が入れ替わる。**スタンプを押した跡**の見え方で、
+ * 沈む・浮くといった奥行きの表現を使わずに押した瞬間を返す。
+ * 既定で罫線を持つのは、影の無い紙面で輪郭を示せるのが線だけだから。
+ *
+ * @example
+ * <Button variant="solid" color="primary" onPress={() => save()}>
+ *   保存
+ * </Button>
+ */
+declare function Button({ variant, size, color, radius, isDisabled, isLoading, type, onPress, startContent, endContent, children, className, classNames, id }: ButtonProps): import("react").JSX.Element;
+//#endregion
+export { Button };
+//# sourceMappingURL=button.d.mts.map

package/dist/button/button.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.mts","names":[],"sources":["../../src/button/button.tsx"],"mappings":";;;;;;;;;;;;;;iBAkBgB,SACd,SACA,MACA,OACA,QACA,YACA,WACA,MACA,SACA,cACA,YACA,UACA,WACA,YACA,MACC,8BAAW,IAAA"}

package/dist/button/button.mjs

@@ -0,0 +1,79 @@
+"use client";
+import { buttonStyles } from "./button.styles.mjs";
+import { Button } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/button/button.tsx
+/**
+* ボタン。
+*
+* 押すと面と文字が入れ替わる。**スタンプを押した跡**の見え方で、
+* 沈む・浮くといった奥行きの表現を使わずに押した瞬間を返す。
+* 既定で罫線を持つのは、影の無い紙面で輪郭を示せるのが線だけだから。
+*
+* @example
+* <Button variant="solid" color="primary" onPress={() => save()}>
+*   保存
+* </Button>
+*/
+function Button$1({ variant, size, color, radius, isDisabled, isLoading, type = "button", onPress, startContent, endContent, children, className, classNames, id }) {
+	const s = buttonStyles({
+		variant,
+		size,
+		color,
+		radius
+	});
+	return /* @__PURE__ */ jsxs(Button, {
+		id,
+		type,
+		isDisabled: isDisabled === true || isLoading === true,
+		onPress,
+		"data-slot": "root",
+		"data-loading": isLoading === true ? true : void 0,
+		className: s.root({ class: [className, classNames?.root] }),
+		children: [
+			isLoading === true && /* @__PURE__ */ jsx("span", {
+				"data-slot": "spinner",
+				className: s.spinner({ class: classNames?.spinner }),
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ jsxs("svg", {
+					viewBox: "0 0 16 16",
+					width: "1em",
+					height: "1em",
+					fill: "none",
+					"aria-hidden": "true",
+					children: [/* @__PURE__ */ jsx("circle", {
+						cx: "8",
+						cy: "8",
+						r: "6",
+						stroke: "currentColor",
+						strokeWidth: "2",
+						opacity: "0.25"
+					}), /* @__PURE__ */ jsx("path", {
+						d: "M14 8a6 6 0 0 0-6-6",
+						stroke: "currentColor",
+						strokeWidth: "2"
+					})]
+				})
+			}),
+			startContent !== void 0 && /* @__PURE__ */ jsx("span", {
+				"data-slot": "startContent",
+				className: s.startContent({ class: classNames?.startContent }),
+				children: startContent
+			}),
+			/* @__PURE__ */ jsx("span", {
+				"data-slot": "label",
+				className: s.label({ class: classNames?.label }),
+				children
+			}),
+			endContent !== void 0 && /* @__PURE__ */ jsx("span", {
+				"data-slot": "endContent",
+				className: s.endContent({ class: classNames?.endContent }),
+				children: endContent
+			})
+		]
+	});
+}
+//#endregion
+export { Button$1 as Button };
+
+//# sourceMappingURL=button.mjs.map

package/dist/button/button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.mjs","names":["Button","RACButton"],"sources":["../../src/button/button.tsx"],"sourcesContent":["'use client'\n\nimport type { ButtonProps } from '@novi-ui/core'\nimport { Button as RACButton } from 'react-aria-components'\nimport { buttonStyles } from './button.styles'\n\n/**\n * ボタン。\n *\n * 押すと面と文字が入れ替わる。**スタンプを押した跡**の見え方で、\n * 沈む・浮くといった奥行きの表現を使わずに押した瞬間を返す。\n * 既定で罫線を持つのは、影の無い紙面で輪郭を示せるのが線だけだから。\n *\n * @example\n * <Button variant=\"solid\" color=\"primary\" onPress={() => save()}>\n *   保存\n * </Button>\n */\nexport function Button({\n  variant,\n  size,\n  color,\n  radius,\n  isDisabled,\n  isLoading,\n  type = 'button',\n  onPress,\n  startContent,\n  endContent,\n  children,\n  className,\n  classNames,\n  id,\n}: ButtonProps) {\n  const s = buttonStyles({ variant, size, color, radius })\n\n  return (\n    <RACButton\n      id={id}\n      type={type}\n      // 読み込み中は押せないようにする。見た目だけ変えて押せる状態にしない\n      isDisabled={isDisabled === true || isLoading === true}\n      onPress={onPress}\n      data-slot=\"root\"\n      data-loading={isLoading === true ? true : undefined}\n      className={s.root({ class: [className, classNames?.root] })}\n    >\n      {isLoading === true && (\n        <span\n          data-slot=\"spinner\"\n          className={s.spinner({ class: classNames?.spinner })}\n          aria-hidden=\"true\"\n        >\n          <svg viewBox=\"0 0 16 16\" width=\"1em\" height=\"1em\" fill=\"none\" aria-hidden=\"true\">\n            <circle cx=\"8\" cy=\"8\" r=\"6\" stroke=\"currentColor\" strokeWidth=\"2\" opacity=\"0.25\" />\n            <path d=\"M14 8a6 6 0 0 0-6-6\" stroke=\"currentColor\" strokeWidth=\"2\" />\n          </svg>\n        </span>\n      )}\n\n      {startContent !== undefined && (\n        <span\n          data-slot=\"startContent\"\n          className={s.startContent({ class: classNames?.startContent })}\n        >\n          {startContent}\n        </span>\n      )}\n\n      <span data-slot=\"label\" className={s.label({ class: classNames?.label })}>\n        {children}\n      </span>\n\n      {endContent !== undefined && (\n        <span data-slot=\"endContent\" className={s.endContent({ class: classNames?.endContent })}>\n          {endContent}\n        </span>\n      )}\n    </RACButton>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAkBA,SAAgBA,SAAO,EACrB,SACA,MACA,OACA,QACA,YACA,WACA,OAAO,UACP,SACA,cACA,YACA,UACA,WACA,YACA,MACc;CACd,MAAM,IAAI,aAAa;EAAE;EAAS;EAAM;EAAO;CAAO,CAAC;CAEvD,OACE,qBAACC,QAAD;EACM;EACE;EAEN,YAAY,eAAe,QAAQ,cAAc;EACxC;EACT,aAAU;EACV,gBAAc,cAAc,OAAO,OAAO,KAAA;EAC1C,WAAW,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,YAAY,IAAI,EAAE,CAAC;EAR5D,UAAA;GAUG,cAAc,QACb,oBAAC,QAAD;IACE,aAAU;IACV,WAAW,EAAE,QAAQ,EAAE,OAAO,YAAY,QAAQ,CAAC;IACnD,eAAY;IAEZ,UAAA,qBAAC,OAAD;KAAK,SAAQ;KAAY,OAAM;KAAM,QAAO;KAAM,MAAK;KAAO,eAAY;KAA1E,UAAA,CACE,oBAAC,UAAD;MAAQ,IAAG;MAAI,IAAG;MAAI,GAAE;MAAI,QAAO;MAAe,aAAY;MAAI,SAAQ;KAAQ,CAAA,GAClF,oBAAC,QAAD;MAAM,GAAE;MAAsB,QAAO;MAAe,aAAY;KAAK,CAAA,CAClE;;GACD,CAAA;GAGP,iBAAiB,KAAA,KAChB,oBAAC,QAAD;IACE,aAAU;IACV,WAAW,EAAE,aAAa,EAAE,OAAO,YAAY,aAAa,CAAC;IAE5D,UAAA;GACG,CAAA;GAGR,oBAAC,QAAD;IAAM,aAAU;IAAQ,WAAW,EAAE,MAAM,EAAE,OAAO,YAAY,MAAM,CAAC;IACpE;GACG,CAAA;GAEL,eAAe,KAAA,KACd,oBAAC,QAAD;IAAM,aAAU;IAAa,WAAW,EAAE,WAAW,EAAE,OAAO,YAAY,WAAW,CAAC;IACnF,UAAA;GACG,CAAA;EAEC;;AAEf"}

package/dist/button/button.styles.d.mts

@@ -0,0 +1,82 @@
+import { VariantMap } from "@novi-ui/core";
+//#region src/button/button.styles.d.ts
+/**
+ * Button のスタイル定義。
+ *
+ * `tv({ extend: buttonStyles })` で拡張できるよう named export する。
+ * npm 配布の「コードを所有できない」という不満への回答（FR-04）。
+ *
+ * slot ベースの定義なので、拡張は `base` ではなく `slots` で行う。
+ * `base` は黙って無視される。
+ *
+ * @example
+ * import { buttonStyles } from '@novi-ui/flatlay'
+ * import { tv } from 'tailwind-variants'
+ *
+ * const myButton = tv({
+ *   extend: buttonStyles,
+ *   slots: { root: 'uppercase tracking-widest' },
+ * })
+ */
+declare const buttonStyles: import("tailwind-variants").TVReturnType<{
+  color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
+    root: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    root: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    root: string;
+  }>;
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    root: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  startContent: string;
+  endContent: string;
+  spinner: string;
+}, undefined, {
+  color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
+    root: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    root: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    root: string;
+  }>;
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    root: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  startContent: string;
+  endContent: string;
+  spinner: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
+    root: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    root: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    root: string;
+  }>;
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    root: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  startContent: string;
+  endContent: string;
+  spinner: string;
+}>>;
+type ButtonStyleProps = Parameters<typeof buttonStyles>[0];
+//#endregion
+export { ButtonStyleProps, buttonStyles };
+//# sourceMappingURL=button.styles.d.mts.map

package/dist/button/button.styles.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.d.mts","names":[],"sources":["../../src/button/button.styles.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;cAkLa,0CAAY;;IAlIkB;;;IAyDF;;;IAMI;;;IAgBE;;;;;;;;;;IA/EJ;;;IAyDF;;;IAMI;;;IAgBE;;;;;;;;;;IA/EJ;;;IAyDF;;;IAMI;;;IAgBE;;;;;;;;;KA0DnC,mBAAmB,kBAAkB"}

package/dist/button/button.styles.mjs

@@ -0,0 +1,137 @@
+import { disabledState, focusRing } from "../styles/focus-ring.mjs";
+import { monoNumeric } from "../styles/mono.mjs";
+import { tv } from "tailwind-variants";
+//#region src/button/button.styles.ts
+const slots = {
+	root: [
+		"inline-flex items-center justify-center gap-2",
+		"font-medium whitespace-nowrap select-none",
+		"border",
+		"rounded-[var(--novi-radius-sm)]",
+		"transition-[background-color,border-color,color]",
+		"duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]",
+		focusRing,
+		disabledState
+	].join(" "),
+	label: "truncate",
+	startContent: `shrink-0 inline-flex ${monoNumeric}`,
+	endContent: `shrink-0 inline-flex ${monoNumeric}`,
+	spinner: "shrink-0 inline-flex"
+};
+/**
+* 色は「役割ごとのローカル変数」に落としてから variant が参照する。
+* こうしないと variant 5 × color 6 = 30 通りの組み合わせを書くことになる。
+*
+* - `--c`      面の色（solid の背景）
+* - `--c-fg`   その面に乗る文字色
+* - `--c-text` 面を持たない variant での文字色
+* - `--c-line` 境界線の色
+*/
+const color = {
+	default: { root: [
+		"[--c:var(--novi-color-default)]",
+		"[--c-fg:var(--novi-color-default-fg)]",
+		"[--c-text:var(--novi-color-fg)]",
+		"[--c-line:var(--novi-color-border-strong)]"
+	].join(" ") },
+	primary: { root: [
+		"[--c:var(--novi-color-primary)]",
+		"[--c-fg:var(--novi-color-primary-fg)]",
+		"[--c-text:var(--novi-color-primary)]",
+		"[--c-line:var(--novi-color-primary)]"
+	].join(" ") },
+	secondary: { root: [
+		"[--c:var(--novi-color-secondary)]",
+		"[--c-fg:var(--novi-color-secondary-fg)]",
+		"[--c-text:var(--novi-color-secondary)]",
+		"[--c-line:var(--novi-color-secondary)]"
+	].join(" ") },
+	success: { root: [
+		"[--c:var(--novi-color-success)]",
+		"[--c-fg:var(--novi-color-success-fg)]",
+		"[--c-text:var(--novi-color-success)]",
+		"[--c-line:var(--novi-color-success)]"
+	].join(" ") },
+	warning: { root: [
+		"[--c:var(--novi-color-warning)]",
+		"[--c-fg:var(--novi-color-warning-fg)]",
+		"[--c-text:var(--novi-color-warning)]",
+		"[--c-line:var(--novi-color-warning)]"
+	].join(" ") },
+	danger: { root: [
+		"[--c:var(--novi-color-danger)]",
+		"[--c-fg:var(--novi-color-danger-fg)]",
+		"[--c-text:var(--novi-color-danger)]",
+		"[--c-line:var(--novi-color-danger)]"
+	].join(" ") }
+};
+/**
+* 高さは 28 / 32 / 40px（Raster は 32/40/48、Tactile は 40/48/56）。
+*
+* **帳票の行の高さ**にあたる。前提はポインタとキーボードで、指の当たり判定を
+* 広げる細工はしない（それは Tactile の領分で、そこが3本目の密度の identity）。
+*/
+const size = {
+	sm: { root: "h-7 px-2.5 text-[length:var(--novi-text-sm)]" },
+	md: { root: "h-8 px-3 text-[length:var(--novi-text-base)]" },
+	lg: { root: "h-10 px-4 text-[length:var(--novi-text-base)]" }
+};
+const radius = {
+	none: { root: "rounded-[var(--novi-radius-none)]" },
+	sm: { root: "rounded-[var(--novi-radius-sm)]" },
+	md: { root: "rounded-[var(--novi-radius-md)]" },
+	lg: { root: "rounded-[var(--novi-radius-lg)]" },
+	full: { root: "rounded-[var(--novi-radius-full)]" }
+};
+/**
+* 語彙の実装漏れ・語彙外の追加はここでコンパイルエラーになる（AC-04-2）。
+*
+* **押下は反転**（FR-11 / ADR-F3）。面と文字が入れ替わる、スタンプを押した跡の見え方。
+* 沈む・縮む・影が消えるといった表現はすべて z 軸の語彙なので使えない。
+* 反転は面積のある変化なので、動かさなくても押した瞬間が確実に伝わる。
+* 前後どちらの状態も 4.5:1 を満たすことは `flatlay-tokens.test.ts` が固定している。
+*/
+const variant = {
+	solid: { root: ["bg-[var(--c)] text-[var(--c-fg)] border-[var(--c)]", "data-[pressed]:bg-[var(--c-fg)] data-[pressed]:text-[var(--c)]"].join(" ") },
+	outline: { root: ["border-[var(--c-line)] text-[var(--c-text)] hover:bg-[var(--novi-color-subtle)]", "data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]"].join(" ") },
+	soft: { root: ["bg-[var(--novi-color-subtle)] border-[var(--novi-color-border)] text-[var(--c-text)]", "data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]"].join(" ") },
+	ghost: { root: ["border-transparent text-[var(--c-text)] hover:bg-[var(--novi-color-subtle)]", "data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]"].join(" ") },
+	plain: { root: ["border-transparent text-[var(--c-text)] underline-offset-4 hover:underline", "data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]"].join(" ") }
+};
+/**
+* Button のスタイル定義。
+*
+* `tv({ extend: buttonStyles })` で拡張できるよう named export する。
+* npm 配布の「コードを所有できない」という不満への回答（FR-04）。
+*
+* slot ベースの定義なので、拡張は `base` ではなく `slots` で行う。
+* `base` は黙って無視される。
+*
+* @example
+* import { buttonStyles } from '@novi-ui/flatlay'
+* import { tv } from 'tailwind-variants'
+*
+* const myButton = tv({
+*   extend: buttonStyles,
+*   slots: { root: 'uppercase tracking-widest' },
+* })
+*/
+const buttonStyles = tv({
+	slots,
+	variants: {
+		color,
+		size,
+		radius,
+		variant
+	},
+	defaultVariants: {
+		color: "default",
+		variant: "solid",
+		size: "md",
+		radius: "sm"
+	}
+});
+//#endregion
+export { buttonStyles };
+
+//# sourceMappingURL=button.styles.mjs.map

package/dist/button/button.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.mjs","names":[],"sources":["../../src/button/button.styles.ts"],"sourcesContent":["import type {\n  buttonRequiredSlots,\n  buttonSlots,\n  NoviColor,\n  NoviRadius,\n  NoviSize,\n  NoviVariant,\n  SlotMap,\n  VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { disabledState, focusRing } from '../styles/focus-ring'\nimport { monoNumeric } from '../styles/mono'\n\n// 型注釈ではなく `satisfies` を使う。\n// 型注釈だと「任意 slot は無いかもしれない」まで型が広がり、\n// tv() の戻り値で `s.startContent` が undefined 扱いになって呼べなくなる（ADR-R5）。\nconst slots = {\n  root: [\n    'inline-flex items-center justify-center gap-2',\n    'font-medium whitespace-nowrap select-none',\n    // 罫線の幅は全 variant が持つ。影が無い以上、輪郭を示せるのは線だけ。\n    // 色は variant が決める（ghost / plain だけが transparent を選ぶ）\n    'border',\n    'rounded-[var(--novi-radius-sm)]',\n    // 動かすのは色だけ。位置も大きさも変えない（FR-11）\n    'transition-[background-color,border-color,color]',\n    'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n    focusRing,\n    disabledState,\n  ].join(' '),\n  label: 'truncate',\n  // 差し込まれるのは記号・数値・ショートカットであることが多い。\n  // 等幅と tabular-nums を既定にすると、ボタンが並んだときに幅が暴れない（ADR-F7）\n  startContent: `shrink-0 inline-flex ${monoNumeric}`,\n  endContent: `shrink-0 inline-flex ${monoNumeric}`,\n  spinner: 'shrink-0 inline-flex',\n} satisfies SlotMap<typeof buttonSlots, (typeof buttonRequiredSlots)[number]>\n\n/**\n * 色は「役割ごとのローカル変数」に落としてから variant が参照する。\n * こうしないと variant 5 × color 6 = 30 通りの組み合わせを書くことになる。\n *\n * - `--c`      面の色（solid の背景）\n * - `--c-fg`   その面に乗る文字色\n * - `--c-text` 面を持たない variant での文字色\n * - `--c-line` 境界線の色\n */\nconst color: VariantMap<NoviColor, { root: string }> = {\n  default: {\n    root: [\n      '[--c:var(--novi-color-default)]',\n      '[--c-fg:var(--novi-color-default-fg)]',\n      '[--c-text:var(--novi-color-fg)]',\n      '[--c-line:var(--novi-color-border-strong)]',\n    ].join(' '),\n  },\n  primary: {\n    root: [\n      '[--c:var(--novi-color-primary)]',\n      '[--c-fg:var(--novi-color-primary-fg)]',\n      '[--c-text:var(--novi-color-primary)]',\n      '[--c-line:var(--novi-color-primary)]',\n    ].join(' '),\n  },\n  secondary: {\n    root: [\n      '[--c:var(--novi-color-secondary)]',\n      '[--c-fg:var(--novi-color-secondary-fg)]',\n      '[--c-text:var(--novi-color-secondary)]',\n      '[--c-line:var(--novi-color-secondary)]',\n    ].join(' '),\n  },\n  success: {\n    root: [\n      '[--c:var(--novi-color-success)]',\n      '[--c-fg:var(--novi-color-success-fg)]',\n      '[--c-text:var(--novi-color-success)]',\n      '[--c-line:var(--novi-color-success)]',\n    ].join(' '),\n  },\n  warning: {\n    root: [\n      '[--c:var(--novi-color-warning)]',\n      '[--c-fg:var(--novi-color-warning-fg)]',\n      '[--c-text:var(--novi-color-warning)]',\n      '[--c-line:var(--novi-color-warning)]',\n    ].join(' '),\n  },\n  danger: {\n    root: [\n      '[--c:var(--novi-color-danger)]',\n      '[--c-fg:var(--novi-color-danger-fg)]',\n      '[--c-text:var(--novi-color-danger)]',\n      '[--c-line:var(--novi-color-danger)]',\n    ].join(' '),\n  },\n}\n\n/**\n * 高さは 28 / 32 / 40px（Raster は 32/40/48、Tactile は 40/48/56）。\n *\n * **帳票の行の高さ**にあたる。前提はポインタとキーボードで、指の当たり判定を\n * 広げる細工はしない（それは Tactile の領分で、そこが3本目の密度の identity）。\n */\nconst size: VariantMap<NoviSize, { root: string }> = {\n  sm: { root: 'h-7 px-2.5 text-[length:var(--novi-text-sm)]' },\n  md: { root: 'h-8 px-3 text-[length:var(--novi-text-base)]' },\n  lg: { root: 'h-10 px-4 text-[length:var(--novi-text-base)]' },\n}\n\nconst radius: VariantMap<NoviRadius, { root: string }> = {\n  none: { root: 'rounded-[var(--novi-radius-none)]' },\n  sm: { root: 'rounded-[var(--novi-radius-sm)]' },\n  md: { root: 'rounded-[var(--novi-radius-md)]' },\n  lg: { root: 'rounded-[var(--novi-radius-lg)]' },\n  full: { root: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * 語彙の実装漏れ・語彙外の追加はここでコンパイルエラーになる（AC-04-2）。\n *\n * **押下は反転**（FR-11 / ADR-F3）。面と文字が入れ替わる、スタンプを押した跡の見え方。\n * 沈む・縮む・影が消えるといった表現はすべて z 軸の語彙なので使えない。\n * 反転は面積のある変化なので、動かさなくても押した瞬間が確実に伝わる。\n * 前後どちらの状態も 4.5:1 を満たすことは `flatlay-tokens.test.ts` が固定している。\n */\nconst variant: VariantMap<NoviVariant, { root: string }> = {\n  solid: {\n    root: [\n      'bg-[var(--c)] text-[var(--c-fg)] border-[var(--c)]',\n      'data-[pressed]:bg-[var(--c-fg)] data-[pressed]:text-[var(--c)]',\n    ].join(' '),\n  },\n  outline: {\n    root: [\n      'border-[var(--c-line)] text-[var(--c-text)] hover:bg-[var(--novi-color-subtle)]',\n      'data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]',\n    ].join(' '),\n  },\n  soft: {\n    root: [\n      'bg-[var(--novi-color-subtle)] border-[var(--novi-color-border)] text-[var(--c-text)]',\n      'data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]',\n    ].join(' '),\n  },\n  ghost: {\n    root: [\n      'border-transparent text-[var(--c-text)] hover:bg-[var(--novi-color-subtle)]',\n      'data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]',\n    ].join(' '),\n  },\n  plain: {\n    root: [\n      'border-transparent text-[var(--c-text)] underline-offset-4 hover:underline',\n      'data-[pressed]:bg-[var(--c)] data-[pressed]:text-[var(--c-fg)]',\n    ].join(' '),\n  },\n}\n\n/**\n * Button のスタイル定義。\n *\n * `tv({ extend: buttonStyles })` で拡張できるよう named export する。\n * npm 配布の「コードを所有できない」という不満への回答（FR-04）。\n *\n * slot ベースの定義なので、拡張は `base` ではなく `slots` で行う。\n * `base` は黙って無視される。\n *\n * @example\n * import { buttonStyles } from '@novi-ui/flatlay'\n * import { tv } from 'tailwind-variants'\n *\n * const myButton = tv({\n *   extend: buttonStyles,\n *   slots: { root: 'uppercase tracking-widest' },\n * })\n */\nexport const buttonStyles = tv({\n  slots,\n  // `variant` は最後に宣言する。先に書くと size のクラスに負ける（申し送り6）\n  variants: { color, size, radius, variant },\n  defaultVariants: { color: 'default', variant: 'solid', size: 'md', radius: 'sm' },\n})\n\nexport type ButtonStyleProps = Parameters<typeof buttonStyles>[0]\n"],"mappings":";;;;AAiBA,MAAM,QAAQ;CACZ,MAAM;EACJ;EACA;EAGA;EACA;EAEA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,OAAO;CAGP,cAAc,wBAAwB;CACtC,YAAY,wBAAwB;CACpC,SAAS;AACX;;;;;;;;;;AAWA,MAAM,QAAiD;CACrD,SAAS,EACP,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,SAAS,EACP,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,WAAW,EACT,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,SAAS,EACP,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,SAAS,EACP,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,QAAQ,EACN,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG,EACZ;AACF;;;;;;;AAQA,MAAM,OAA+C;CACnD,IAAI,EAAE,MAAM,+CAA+C;CAC3D,IAAI,EAAE,MAAM,+CAA+C;CAC3D,IAAI,EAAE,MAAM,gDAAgD;AAC9D;AAEA,MAAM,SAAmD;CACvD,MAAM,EAAE,MAAM,oCAAoC;CAClD,IAAI,EAAE,MAAM,kCAAkC;CAC9C,IAAI,EAAE,MAAM,kCAAkC;CAC9C,IAAI,EAAE,MAAM,kCAAkC;CAC9C,MAAM,EAAE,MAAM,oCAAoC;AACpD;;;;;;;;;AAUA,MAAM,UAAqD;CACzD,OAAO,EACL,MAAM,CACJ,sDACA,gEACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,SAAS,EACP,MAAM,CACJ,mFACA,gEACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,MAAM,EACJ,MAAM,CACJ,wFACA,gEACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,OAAO,EACL,MAAM,CACJ,+EACA,gEACF,CAAC,CAAC,KAAK,GAAG,EACZ;CACA,OAAO,EACL,MAAM,CACJ,8EACA,gEACF,CAAC,CAAC,KAAK,GAAG,EACZ;AACF;;;;;;;;;;;;;;;;;;;AAoBA,MAAa,eAAe,GAAG;CAC7B;CAEA,UAAU;EAAE;EAAO;EAAM;EAAQ;CAAQ;CACzC,iBAAiB;EAAE,OAAO;EAAW,SAAS;EAAS,MAAM;EAAM,QAAQ;CAAK;AAClF,CAAC"}

package/dist/button/index.d.mts

@@ -0,0 +1,3 @@
+import { Button } from "./button.mjs";
+import { ButtonStyleProps, buttonStyles } from "./button.styles.mjs";
+export { Button, type ButtonStyleProps, buttonStyles };

package/dist/card/card.d.mts

@@ -0,0 +1,51 @@
+import { ImgHTMLAttributes, ReactNode } from "react";
+import { CardProps } from "@novi-ui/core";
+//#region src/card/card.d.ts
+interface PartProps {
+  children?: ReactNode;
+  className?: string;
+}
+/**
+ * Card の見出し部分。下端が罫線で仕切られる。
+ *
+ * @example
+ * <CardHeader>売上</CardHeader>
+ */
+declare function CardHeader({ children, className }: PartProps): import("react").JSX.Element;
+/**
+ * Card の本体。
+ *
+ * @example
+ * <CardBody>¥1,240,000</CardBody>
+ */
+declare function CardBody({ children, className }: PartProps): import("react").JSX.Element;
+/**
+ * Card の脚部。上端が罫線で仕切られる。
+ *
+ * @example
+ * <CardFooter>前月比 +12%</CardFooter>
+ */
+declare function CardFooter({ children, className }: PartProps): import("react").JSX.Element;
+/**
+ * Card の上部に置く画像。
+ *
+ * @example
+ * <CardImage src="/thumb.jpg" alt="" />
+ */
+declare function CardImage({ className, alt, ...props }: ImgHTMLAttributes<HTMLImageElement>): import("react").JSX.Element;
+/**
+ * 情報のまとまりを囲む器。
+ *
+ * Flatlay では**書類の枠**。影が存在しないので、枠の罫線と区切りの罫線だけで
+ * まとまりを作る。`onPress` を渡すと押せるカードになり、押下で全面が反転する。
+ *
+ * @example
+ * <Card>
+ *   <CardHeader>売上</CardHeader>
+ *   <CardBody>¥1,240,000</CardBody>
+ * </Card>
+ */
+declare function Card({ variant, radius, onPress, isDisabled, children, className, classNames, id }: CardProps): import("react").JSX.Element;
+//#endregion
+export { Card, CardBody, CardFooter, CardHeader, CardImage };
+//# sourceMappingURL=card.d.mts.map

package/dist/card/card.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.mts","names":[],"sources":["../../src/card/card.tsx"],"mappings":";;;UAOU;EACR,WAAW;EACX;;;;;;;;iBASc,aAAa,UAAU,aAAa,4BAAS,IAAA;;;;;;;iBAc7C,WAAW,UAAU,aAAa,4BAAS,IAAA;;;;;;;iBAc3C,aAAa,UAAU,aAAa,4BAAS,IAAA;;;;;;;iBAc7C,YAAY,WAAW,QAAa,SAAS,kBAAkB,oCAAiB,IAAA;;;;;;;;;;;;;iBAuBhF,OACd,SACA,QACA,SACA,YACA,UACA,WACA,YACA,MACC,4BAAS,IAAA"}