@novi-ui/flatlay 0.2.0 → 0.4.0

package/dist/number-field/number-field.mjs

@@ -0,0 +1,93 @@
+"use client";
+import { numberFieldStyles } from "./number-field.styles.mjs";
+import { Button, FieldError, Group, Input, Label, NumberField, Text } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useImeSafeKeys } from "@novi-ui/core/client";
+//#region src/number-field/number-field.tsx
+/**
+* 数値の入力。矢印キーと増減ボタンで `step` ずつ刻む。
+*
+* 数値は右詰めの等幅で、**増減は右端の罫線セルに `−` `+` の活字**で置く。
+* 帳票の金額欄と同じ読み方になる（Raster は細い線、Tactile は左右の面）。
+* 空欄は `NaN` ではなく `null` で `onChange` に渡す（ADR-B2）。
+*
+* @example
+* <NumberField label="数量" defaultValue={1} minValue={0} step={1} />
+*/
+function NumberField$1({ variant, size, radius, label, placeholder, description, errorMessage, name, value, defaultValue, onChange, minValue, maxValue, step, formatOptions, onKeyDown, isDisabled, isReadOnly, isRequired, isInvalid, className, classNames, id }) {
+	const s = numberFieldStyles({
+		variant,
+		size,
+		radius
+	});
+	const keyProps = useImeSafeKeys(onKeyDown);
+	return /* @__PURE__ */ jsxs(NumberField, {
+		id,
+		name,
+		value: value === null ? NaN : value,
+		defaultValue,
+		onChange: (next) => onChange?.(Number.isNaN(next) ? null : next),
+		minValue,
+		maxValue,
+		step,
+		formatOptions,
+		isDisabled,
+		isReadOnly,
+		isRequired,
+		isInvalid,
+		"data-slot": "root",
+		className: s.root({ class: [className, classNames?.root] }),
+		children: [
+			label !== void 0 && /* @__PURE__ */ jsx(Label, {
+				"data-slot": "label",
+				className: s.label({ class: classNames?.label }),
+				children: label
+			}),
+			/* @__PURE__ */ jsxs(Group, {
+				"data-slot": "inputWrapper",
+				className: s.inputWrapper({ class: classNames?.inputWrapper }),
+				children: [
+					/* @__PURE__ */ jsx(Input, {
+						"data-slot": "input",
+						placeholder,
+						className: s.input({ class: classNames?.input }),
+						...keyProps
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						slot: "decrement",
+						"data-slot": "decrement",
+						className: s.decrement({ class: classNames?.decrement }),
+						children: /* @__PURE__ */ jsx("span", {
+							"aria-hidden": "true",
+							children: "−"
+						})
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						slot: "increment",
+						"data-slot": "increment",
+						className: s.increment({ class: classNames?.increment }),
+						children: /* @__PURE__ */ jsx("span", {
+							"aria-hidden": "true",
+							children: "+"
+						})
+					})
+				]
+			}),
+			description !== void 0 && /* @__PURE__ */ jsx(Text, {
+				slot: "description",
+				"data-slot": "description",
+				className: s.description({ class: classNames?.description }),
+				children: description
+			}),
+			/* @__PURE__ */ jsx(FieldError, {
+				"data-slot": "errorMessage",
+				className: s.errorMessage({ class: classNames?.errorMessage }),
+				children: errorMessage
+			})
+		]
+	});
+}
+//#endregion
+export { NumberField$1 as NumberField };
+
+//# sourceMappingURL=number-field.mjs.map

package/dist/number-field/number-field.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-field.mjs","names":["NumberField","RACNumberField"],"sources":["../../src/number-field/number-field.tsx"],"sourcesContent":["'use client'\n\nimport type { NumberFieldProps } from '@novi-ui/core'\nimport { useImeSafeKeys } from '@novi-ui/core/client'\nimport {\n  Button,\n  FieldError,\n  Group,\n  Input,\n  Label,\n  NumberField as RACNumberField,\n  Text,\n} from 'react-aria-components'\nimport { numberFieldStyles } from './number-field.styles'\n\n/**\n * 数値の入力。矢印キーと増減ボタンで `step` ずつ刻む。\n *\n * 数値は右詰めの等幅で、**増減は右端の罫線セルに `−` `+` の活字**で置く。\n * 帳票の金額欄と同じ読み方になる（Raster は細い線、Tactile は左右の面）。\n * 空欄は `NaN` ではなく `null` で `onChange` に渡す（ADR-B2）。\n *\n * @example\n * <NumberField label=\"数量\" defaultValue={1} minValue={0} step={1} />\n */\nexport function NumberField({\n  variant,\n  size,\n  radius,\n  label,\n  placeholder,\n  description,\n  errorMessage,\n  name,\n  value,\n  defaultValue,\n  onChange,\n  minValue,\n  maxValue,\n  step,\n  formatOptions,\n  onKeyDown,\n  isDisabled,\n  isReadOnly,\n  isRequired,\n  isInvalid,\n  className,\n  classNames,\n  id,\n}: NumberFieldProps) {\n  const s = numberFieldStyles({ variant, size, radius })\n  const keyProps = useImeSafeKeys<HTMLInputElement>(onKeyDown)\n\n  return (\n    <RACNumberField\n      id={id}\n      name={name}\n      // RAC は空欄を NaN で表す。外には出さない（ADR-B2）\n      value={value === null ? Number.NaN : value}\n      defaultValue={defaultValue}\n      onChange={(next) => onChange?.(Number.isNaN(next) ? null : next)}\n      minValue={minValue}\n      maxValue={maxValue}\n      step={step}\n      formatOptions={formatOptions}\n      isDisabled={isDisabled}\n      isReadOnly={isReadOnly}\n      isRequired={isRequired}\n      isInvalid={isInvalid}\n      data-slot=\"root\"\n      className={s.root({ class: [className, classNames?.root] })}\n    >\n      {label !== undefined && (\n        <Label data-slot=\"label\" className={s.label({ class: classNames?.label })}>\n          {label}\n        </Label>\n      )}\n\n      <Group\n        data-slot=\"inputWrapper\"\n        className={s.inputWrapper({ class: classNames?.inputWrapper })}\n      >\n        <Input\n          data-slot=\"input\"\n          placeholder={placeholder}\n          className={s.input({ class: classNames?.input })}\n          {...keyProps}\n        />\n        <Button\n          slot=\"decrement\"\n          data-slot=\"decrement\"\n          className={s.decrement({ class: classNames?.decrement })}\n        >\n          <span aria-hidden=\"true\">−</span>\n        </Button>\n        <Button\n          slot=\"increment\"\n          data-slot=\"increment\"\n          className={s.increment({ class: classNames?.increment })}\n        >\n          <span aria-hidden=\"true\">+</span>\n        </Button>\n      </Group>\n\n      {description !== undefined && (\n        <Text\n          slot=\"description\"\n          data-slot=\"description\"\n          className={s.description({ class: classNames?.description })}\n        >\n          {description}\n        </Text>\n      )}\n\n      <FieldError\n        data-slot=\"errorMessage\"\n        className={s.errorMessage({ class: classNames?.errorMessage })}\n      >\n        {errorMessage}\n      </FieldError>\n    </RACNumberField>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAyBA,SAAgBA,cAAY,EAC1B,SACA,MACA,QACA,OACA,aACA,aACA,cACA,MACA,OACA,cACA,UACA,UACA,UACA,MACA,eACA,WACA,YACA,YACA,YACA,WACA,WACA,YACA,MACmB;CACnB,MAAM,IAAI,kBAAkB;EAAE;EAAS;EAAM;CAAO,CAAC;CACrD,MAAM,WAAW,eAAiC,SAAS;CAE3D,OACE,qBAACC,aAAD;EACM;EACE;EAEN,OAAO,UAAU,OAAO,MAAa;EACvB;EACd,WAAW,SAAS,WAAW,OAAO,MAAM,IAAI,IAAI,OAAO,IAAI;EACrD;EACA;EACJ;EACS;EACH;EACA;EACA;EACD;EACX,aAAU;EACV,WAAW,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,YAAY,IAAI,EAAE,CAAC;EAhB5D,UAAA;GAkBG,UAAU,KAAA,KACT,oBAAC,OAAD;IAAO,aAAU;IAAQ,WAAW,EAAE,MAAM,EAAE,OAAO,YAAY,MAAM,CAAC;IACrE,UAAA;GACI,CAAA;GAGT,qBAAC,OAAD;IACE,aAAU;IACV,WAAW,EAAE,aAAa,EAAE,OAAO,YAAY,aAAa,CAAC;IAF/D,UAAA;KAIE,oBAAC,OAAD;MACE,aAAU;MACG;MACb,WAAW,EAAE,MAAM,EAAE,OAAO,YAAY,MAAM,CAAC;MAC/C,GAAI;KACL,CAAA;KACD,oBAAC,QAAD;MACE,MAAK;MACL,aAAU;MACV,WAAW,EAAE,UAAU,EAAE,OAAO,YAAY,UAAU,CAAC;MAEvD,UAAA,oBAAC,QAAD;OAAM,eAAY;OAAO,UAAA;MAAO,CAAA;KAC1B,CAAA;KACR,oBAAC,QAAD;MACE,MAAK;MACL,aAAU;MACV,WAAW,EAAE,UAAU,EAAE,OAAO,YAAY,UAAU,CAAC;MAEvD,UAAA,oBAAC,QAAD;OAAM,eAAY;OAAO,UAAA;MAAO,CAAA;KAC1B,CAAA;IACH;;GAEN,gBAAgB,KAAA,KACf,oBAAC,MAAD;IACE,MAAK;IACL,aAAU;IACV,WAAW,EAAE,YAAY,EAAE,OAAO,YAAY,YAAY,CAAC;IAE1D,UAAA;GACG,CAAA;GAGR,oBAAC,YAAD;IACE,aAAU;IACV,WAAW,EAAE,aAAa,EAAE,OAAO,YAAY,aAAa,CAAC;IAE5D,UAAA;GACS,CAAA;EACE;;AAEpB"}

package/dist/number-field/number-field.styles.d.mts

@@ -0,0 +1,88 @@
+import { VariantMap } from "@novi-ui/core";
+//#region src/number-field/number-field.styles.d.ts
+/**
+ * NumberField のスタイル定義。
+ *
+ * @example
+ * import { numberFieldStyles } from '@novi-ui/flatlay'
+ * import { tv } from 'tailwind-variants'
+ *
+ * const myField = tv({ extend: numberFieldStyles, slots: { input: 'text-left' } })
+ */
+declare const numberFieldStyles: import("tailwind-variants").TVReturnType<{
+  size: VariantMap<"sm" | "md" | "lg", {
+    inputWrapper: string;
+    input: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    inputWrapper: string;
+  }>;
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    inputWrapper: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  /**
+   * 記入欄の枠。罫線の幅は全 variant が持ち、色だけを variant が決める（Flatlay の型）。
+   * 増減セルの縦罫線も同じ色を継ぐので、`border-color` は枠にだけ書く。
+   */
+  inputWrapper: string;
+  input: string;
+  decrement: string;
+  increment: string;
+  description: string;
+  errorMessage: string;
+}, undefined, {
+  size: VariantMap<"sm" | "md" | "lg", {
+    inputWrapper: string;
+    input: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    inputWrapper: string;
+  }>;
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    inputWrapper: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  /**
+   * 記入欄の枠。罫線の幅は全 variant が持ち、色だけを variant が決める（Flatlay の型）。
+   * 増減セルの縦罫線も同じ色を継ぐので、`border-color` は枠にだけ書く。
+   */
+  inputWrapper: string;
+  input: string;
+  decrement: string;
+  increment: string;
+  description: string;
+  errorMessage: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  size: VariantMap<"sm" | "md" | "lg", {
+    inputWrapper: string;
+    input: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    inputWrapper: string;
+  }>;
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    inputWrapper: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  /**
+   * 記入欄の枠。罫線の幅は全 variant が持ち、色だけを variant が決める（Flatlay の型）。
+   * 増減セルの縦罫線も同じ色を継ぐので、`border-color` は枠にだけ書く。
+   */
+  inputWrapper: string;
+  input: string;
+  decrement: string;
+  increment: string;
+  description: string;
+  errorMessage: string;
+}>>;
+type NumberFieldStyleProps = Parameters<typeof numberFieldStyles>[0];
+//#endregion
+export { NumberFieldStyleProps, numberFieldStyles };
+//# sourceMappingURL=number-field.styles.d.mts.map

package/dist/number-field/number-field.styles.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-field.styles.d.mts","names":[],"sources":["../../src/number-field/number-field.styles.ts"],"mappings":";;;;;;;;;;;cA6Ga,+CAAiB;;IAhCmB;IAAe;;;IAeX;;;IA5BE;;;;;;;;;;;;;;;;;IAaN;IAAe;;;IAeX;;;IA5BE;;;;;;;;;;;;;;;;;IAaN;IAAe;;;IAeX;;;IA5BE;;;;;;;;;;;;;;;;KAoD3C,wBAAwB,kBAAkB"}

package/dist/number-field/number-field.styles.mjs

@@ -0,0 +1,102 @@
+import { disabledState, focusRing } from "../styles/focus-ring.mjs";
+import { mono, monoNumeric } from "../styles/mono.mjs";
+import { tv } from "tailwind-variants";
+//#region src/number-field/number-field.styles.ts
+/**
+* 増減ボタン。**罫線で区切ったセル**に等幅の `−` `+` を置く（ADR-F7）。
+* 面も影も持たず、押した瞬間だけ反転する（スタンプ。ADR-F3）。
+* 記号は文字で描く。帳票の語彙は活字であって図形ではない。
+*/
+const stepper = [
+	"shrink-0 self-stretch inline-flex items-center justify-center",
+	"px-[var(--novi-pad-control-x-sm)]",
+	"text-[var(--novi-color-muted)]",
+	"border-l",
+	"outline-none",
+	monoNumeric,
+	"hover:text-[var(--novi-color-fg)] hover:bg-[var(--novi-color-subtle)]",
+	"data-[focus-visible]:text-[var(--novi-color-fg)]",
+	"data-[pressed]:bg-[var(--novi-color-fg)] data-[pressed]:text-[var(--novi-color-bg)]",
+	"data-[disabled]:opacity-40 data-[disabled]:cursor-default",
+	"transition-[background-color,color]",
+	"duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]"
+].join(" ");
+const slots = {
+	root: "flex flex-col gap-1.5",
+	label: `text-[length:var(--novi-text-sm)] text-[var(--novi-color-fg)] ${mono}`,
+	/**
+	* 記入欄の枠。罫線の幅は全 variant が持ち、色だけを variant が決める（Flatlay の型）。
+	* 増減セルの縦罫線も同じ色を継ぐので、`border-color` は枠にだけ書く。
+	*/
+	inputWrapper: [
+		"flex items-center w-full overflow-hidden",
+		"text-[var(--novi-color-fg)]",
+		"border",
+		"rounded-[var(--novi-radius-sm)]",
+		"data-[invalid]:border-[var(--novi-color-danger)]",
+		"transition-[border-color,opacity]",
+		"duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]",
+		focusRing,
+		disabledState
+	].join(" "),
+	input: [
+		"w-full min-w-0 bg-transparent outline-none text-right",
+		`text-[var(--novi-color-fg)] ${monoNumeric}`,
+		"placeholder:text-[var(--novi-color-muted)]"
+	].join(" "),
+	decrement: stepper,
+	increment: stepper,
+	description: `text-[length:var(--novi-text-sm)] text-[var(--novi-color-muted)] ${mono}`,
+	errorMessage: `text-[length:var(--novi-text-sm)] text-[var(--novi-color-danger)] ${mono}`
+};
+/**
+* NumberField のスタイル定義。
+*
+* @example
+* import { numberFieldStyles } from '@novi-ui/flatlay'
+* import { tv } from 'tailwind-variants'
+*
+* const myField = tv({ extend: numberFieldStyles, slots: { input: 'text-left' } })
+*/
+const numberFieldStyles = tv({
+	slots,
+	variants: {
+		size: {
+			sm: {
+				inputWrapper: "h-7",
+				input: "px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-sm)]"
+			},
+			md: {
+				inputWrapper: "h-8",
+				input: "px-[var(--novi-pad-control-x-md)] text-[length:var(--novi-text-base)]"
+			},
+			lg: {
+				inputWrapper: "h-10",
+				input: "px-[var(--novi-pad-control-x-lg)] text-[length:var(--novi-text-base)]"
+			}
+		},
+		radius: {
+			none: { inputWrapper: "rounded-[var(--novi-radius-none)]" },
+			sm: { inputWrapper: "rounded-[var(--novi-radius-sm)]" },
+			md: { inputWrapper: "rounded-[var(--novi-radius-md)]" },
+			lg: { inputWrapper: "rounded-[var(--novi-radius-lg)]" },
+			full: { inputWrapper: "rounded-[var(--novi-radius-full)]" }
+		},
+		variant: {
+			solid: { inputWrapper: "bg-[var(--novi-color-surface)] border-[var(--novi-color-border-strong)]" },
+			outline: { inputWrapper: "bg-transparent border-[var(--novi-color-border-strong)]" },
+			soft: { inputWrapper: "bg-[var(--novi-color-subtle)] border-[var(--novi-color-border)]" },
+			ghost: { inputWrapper: "bg-transparent border-transparent border-b-[var(--novi-color-border-strong)]" },
+			plain: { inputWrapper: "bg-transparent border-transparent" }
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		radius: "sm",
+		variant: "outline"
+	}
+});
+//#endregion
+export { numberFieldStyles };
+
+//# sourceMappingURL=number-field.styles.mjs.map

package/dist/number-field/number-field.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-field.styles.mjs","names":[],"sources":["../../src/number-field/number-field.styles.ts"],"sourcesContent":["import type {\n  NoviRadius,\n  NoviSize,\n  NoviVariant,\n  numberFieldRequiredSlots,\n  numberFieldSlots,\n  SlotMap,\n  VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { disabledState, focusRing } from '../styles/focus-ring'\nimport { mono, monoNumeric } from '../styles/mono'\n\n/**\n * 増減ボタン。**罫線で区切ったセル**に等幅の `−` `+` を置く（ADR-F7）。\n * 面も影も持たず、押した瞬間だけ反転する（スタンプ。ADR-F3）。\n * 記号は文字で描く。帳票の語彙は活字であって図形ではない。\n */\nconst stepper = [\n  'shrink-0 self-stretch inline-flex items-center justify-center',\n  'px-[var(--novi-pad-control-x-sm)]',\n  'text-[var(--novi-color-muted)]',\n  'border-l',\n  'outline-none',\n  monoNumeric,\n  'hover:text-[var(--novi-color-fg)] hover:bg-[var(--novi-color-subtle)]',\n  'data-[focus-visible]:text-[var(--novi-color-fg)]',\n  'data-[pressed]:bg-[var(--novi-color-fg)] data-[pressed]:text-[var(--novi-color-bg)]',\n  'data-[disabled]:opacity-40 data-[disabled]:cursor-default',\n  'transition-[background-color,color]',\n  'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n].join(' ')\n\nconst slots = {\n  root: 'flex flex-col gap-1.5',\n  label: `text-[length:var(--novi-text-sm)] text-[var(--novi-color-fg)] ${mono}`,\n  /**\n   * 記入欄の枠。罫線の幅は全 variant が持ち、色だけを variant が決める（Flatlay の型）。\n   * 増減セルの縦罫線も同じ色を継ぐので、`border-color` は枠にだけ書く。\n   */\n  inputWrapper: [\n    'flex items-center w-full overflow-hidden',\n    'text-[var(--novi-color-fg)]',\n    'border',\n    'rounded-[var(--novi-radius-sm)]',\n    'data-[invalid]:border-[var(--novi-color-danger)]',\n    'transition-[border-color,opacity]',\n    'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n    focusRing,\n    disabledState,\n  ].join(' '),\n  // 数値は右詰めの等幅。帳票の金額欄と同じ\n  input: [\n    'w-full min-w-0 bg-transparent outline-none text-right',\n    `text-[var(--novi-color-fg)] ${monoNumeric}`,\n    'placeholder:text-[var(--novi-color-muted)]',\n  ].join(' '),\n  decrement: stepper,\n  increment: stepper,\n  description: `text-[length:var(--novi-text-sm)] text-[var(--novi-color-muted)] ${mono}`,\n  // 色だけに頼らずテキストを必ず伴う（WCAG 1.4.1）\n  errorMessage: `text-[length:var(--novi-text-sm)] text-[var(--novi-color-danger)] ${mono}`,\n} satisfies SlotMap<typeof numberFieldSlots, (typeof numberFieldRequiredSlots)[number]>\n\nconst variant: VariantMap<NoviVariant, { inputWrapper: string }> = {\n  solid: {\n    inputWrapper: 'bg-[var(--novi-color-surface)] border-[var(--novi-color-border-strong)]',\n  },\n  outline: { inputWrapper: 'bg-transparent border-[var(--novi-color-border-strong)]' },\n  soft: { inputWrapper: 'bg-[var(--novi-color-subtle)] border-[var(--novi-color-border)]' },\n  ghost: {\n    inputWrapper: 'bg-transparent border-transparent border-b-[var(--novi-color-border-strong)]',\n  },\n  plain: { inputWrapper: 'bg-transparent border-transparent' },\n}\n\n/** 高さは Button / Input と揃える。28 / 32 / 40px。 */\nconst size: VariantMap<NoviSize, { inputWrapper: string; input: string }> = {\n  sm: {\n    inputWrapper: 'h-7',\n    input: 'px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-sm)]',\n  },\n  md: {\n    inputWrapper: 'h-8',\n    input: 'px-[var(--novi-pad-control-x-md)] text-[length:var(--novi-text-base)]',\n  },\n  lg: {\n    inputWrapper: 'h-10',\n    input: 'px-[var(--novi-pad-control-x-lg)] text-[length:var(--novi-text-base)]',\n  },\n}\n\nconst radius: VariantMap<NoviRadius, { inputWrapper: string }> = {\n  none: { inputWrapper: 'rounded-[var(--novi-radius-none)]' },\n  sm: { inputWrapper: 'rounded-[var(--novi-radius-sm)]' },\n  md: { inputWrapper: 'rounded-[var(--novi-radius-md)]' },\n  lg: { inputWrapper: 'rounded-[var(--novi-radius-lg)]' },\n  full: { inputWrapper: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * NumberField のスタイル定義。\n *\n * @example\n * import { numberFieldStyles } from '@novi-ui/flatlay'\n * import { tv } from 'tailwind-variants'\n *\n * const myField = tv({ extend: numberFieldStyles, slots: { input: 'text-left' } })\n */\nexport const numberFieldStyles = tv({\n  slots,\n  // `variant` は最後に宣言する。先に書くと size のクラスに負ける\n  variants: { size, radius, variant },\n  defaultVariants: { size: 'md', radius: 'sm', variant: 'outline' },\n})\n\nexport type NumberFieldStyleProps = Parameters<typeof numberFieldStyles>[0]\n"],"mappings":";;;;;;;;;AAkBA,MAAM,UAAU;CACd;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;AAEV,MAAM,QAAQ;CACZ,MAAM;CACN,OAAO,iEAAiE;;;;;CAKxE,cAAc;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,OAAO;EACL;EACA,+BAA+B;EAC/B;CACF,CAAC,CAAC,KAAK,GAAG;CACV,WAAW;CACX,WAAW;CACX,aAAa,oEAAoE;CAEjF,cAAc,qEAAqE;AACrF;;;;;;;;;;AA+CA,MAAa,oBAAoB,GAAG;CAClC;CAEA,UAAU;EAAE;GAlCZ,IAAI;IACF,cAAc;IACd,OAAO;GACT;GACA,IAAI;IACF,cAAc;IACd,OAAO;GACT;GACA,IAAI;IACF,cAAc;IACd,OAAO;GACT;EAuBY;EAAM;GAnBlB,MAAM,EAAE,cAAc,oCAAoC;GAC1D,IAAI,EAAE,cAAc,kCAAkC;GACtD,IAAI,EAAE,cAAc,kCAAkC;GACtD,IAAI,EAAE,cAAc,kCAAkC;GACtD,MAAM,EAAE,cAAc,oCAAoC;EAexC;EAAQ;GA/C1B,OAAO,EACL,cAAc,0EAChB;GACA,SAAS,EAAE,cAAc,0DAA0D;GACnF,MAAM,EAAE,cAAc,kEAAkE;GACxF,OAAO,EACL,cAAc,+EAChB;GACA,OAAO,EAAE,cAAc,oCAAoC;EAuCjC;CAAQ;CAClC,iBAAiB;EAAE,MAAM;EAAM,QAAQ;EAAM,SAAS;CAAU;AAClE,CAAC"}

package/dist/pagination/index.d.mts

@@ -0,0 +1,3 @@
+import { Pagination } from "./pagination.mjs";
+import { PaginationStyleProps, paginationStyles } from "./pagination.styles.mjs";
+export { Pagination, type PaginationStyleProps, paginationStyles };

package/dist/pagination/pagination.d.mts

@@ -0,0 +1,13 @@
+import { PaginationProps } from "@novi-ui/core";
+//#region src/pagination/pagination.d.ts
+/**
+ * 一覧のページを移動する。**罫線で区切った 1 本の帯**に数字を並べ、現在地は反転させる
+ * （Raster は数字だけを並べ、Tactile は面を塗る）。前後は `‹` `›` の活字。
+ *
+ * @example
+ * <Pagination total={10} page={page} onChange={setPage} />
+ */
+declare function Pagination({ size, radius, total, page, defaultPage, onChange, siblingCount, boundaryCount, isDisabled, 'aria-label': ariaLabel, className, classNames, id }: PaginationProps): import("react").JSX.Element;
+//#endregion
+export { Pagination };
+//# sourceMappingURL=pagination.d.mts.map

package/dist/pagination/pagination.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.d.mts","names":[],"sources":["../../src/pagination/pagination.tsx"],"mappings":";;;;;;;;;iBAegB,aACd,MACA,QACA,OACA,MACA,aACA,UACA,cACA,eACA,0BACc,WACd,WACA,YACA,MACC,kCAAe,IAAA"}

package/dist/pagination/pagination.mjs

@@ -0,0 +1,98 @@
+"use client";
+import { paginationStyles } from "./pagination.styles.mjs";
+import { Button } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { paginationRange } from "@novi-ui/core/client";
+//#region src/pagination/pagination.tsx
+/**
+* 一覧のページを移動する。**罫線で区切った 1 本の帯**に数字を並べ、現在地は反転させる
+* （Raster は数字だけを並べ、Tactile は面を塗る）。前後は `‹` `›` の活字。
+*
+* @example
+* <Pagination total={10} page={page} onChange={setPage} />
+*/
+function Pagination({ size, radius, total, page, defaultPage = 1, onChange, siblingCount, boundaryCount, isDisabled, "aria-label": ariaLabel = "ページ送り", className, classNames, id }) {
+	const s = paginationStyles({
+		size,
+		radius
+	});
+	const [internal, setInternal] = useState(defaultPage);
+	const clamp = (n) => Math.min(Math.max(n, 1), Math.max(total, 1));
+	const current = clamp(page ?? internal);
+	const go = (n) => {
+		const next = clamp(n);
+		if (next === current) return;
+		if (page === void 0) setInternal(next);
+		onChange?.(next);
+	};
+	const slots = paginationRange(current, total, {
+		siblingCount,
+		boundaryCount
+	});
+	const entries = slots.map((slot, i) => ({
+		slot,
+		key: slot === "ellipsis" ? `ellipsis-after-${slots[i - 1]}` : `page-${slot}`
+	}));
+	return /* @__PURE__ */ jsx("nav", {
+		id,
+		"aria-label": ariaLabel,
+		"data-slot": "root",
+		className: s.root({ class: [className, classNames?.root] }),
+		children: /* @__PURE__ */ jsxs("ul", {
+			"data-slot": "list",
+			className: s.list({ class: classNames?.list }),
+			children: [
+				/* @__PURE__ */ jsx("li", {
+					className: "flex",
+					children: /* @__PURE__ */ jsx(Button, {
+						"data-slot": "prev",
+						"aria-label": "前のページ",
+						isDisabled: isDisabled || current <= 1,
+						onPress: () => go(current - 1),
+						className: s.prev({ class: classNames?.prev }),
+						children: /* @__PURE__ */ jsx("span", {
+							"aria-hidden": "true",
+							children: "‹"
+						})
+					})
+				}),
+				entries.map(({ slot, key }) => slot === "ellipsis" ? /* @__PURE__ */ jsx("li", {
+					"data-slot": "ellipsis",
+					"aria-hidden": "true",
+					className: s.ellipsis({ class: classNames?.ellipsis }),
+					children: "…"
+				}, key) : /* @__PURE__ */ jsx("li", {
+					className: "flex",
+					children: /* @__PURE__ */ jsx(Button, {
+						"data-slot": "item",
+						"aria-label": `${slot}ページ`,
+						"aria-current": slot === current ? "page" : void 0,
+						isDisabled,
+						onPress: () => go(slot),
+						className: s.item({ class: classNames?.item }),
+						children: slot
+					})
+				}, key)),
+				/* @__PURE__ */ jsx("li", {
+					className: "flex",
+					children: /* @__PURE__ */ jsx(Button, {
+						"data-slot": "next",
+						"aria-label": "次のページ",
+						isDisabled: isDisabled || current >= total,
+						onPress: () => go(current + 1),
+						className: s.next({ class: classNames?.next }),
+						children: /* @__PURE__ */ jsx("span", {
+							"aria-hidden": "true",
+							children: "›"
+						})
+					})
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { Pagination };
+
+//# sourceMappingURL=pagination.mjs.map

package/dist/pagination/pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.mjs","names":[],"sources":["../../src/pagination/pagination.tsx"],"sourcesContent":["'use client'\n\nimport type { PaginationProps } from '@novi-ui/core'\nimport { paginationRange } from '@novi-ui/core/client'\nimport { useState } from 'react'\nimport { Button } from 'react-aria-components'\nimport { paginationStyles } from './pagination.styles'\n\n/**\n * 一覧のページを移動する。**罫線で区切った 1 本の帯**に数字を並べ、現在地は反転させる\n * （Raster は数字だけを並べ、Tactile は面を塗る）。前後は `‹` `›` の活字。\n *\n * @example\n * <Pagination total={10} page={page} onChange={setPage} />\n */\nexport function Pagination({\n  size,\n  radius,\n  total,\n  page,\n  defaultPage = 1,\n  onChange,\n  siblingCount,\n  boundaryCount,\n  isDisabled,\n  'aria-label': ariaLabel = 'ページ送り',\n  className,\n  classNames,\n  id,\n}: PaginationProps) {\n  const s = paginationStyles({ size, radius })\n  const [internal, setInternal] = useState(defaultPage)\n  const clamp = (n: number) => Math.min(Math.max(n, 1), Math.max(total, 1))\n  const current = clamp(page ?? internal)\n\n  const go = (n: number) => {\n    const next = clamp(n)\n    if (next === current) return\n    if (page === undefined) setInternal(next)\n    onChange?.(next)\n  }\n\n  // 省略記号は最大 2 つ出る。配列の添字ではなく「どの数字の直後か」で区別する\n  const slots = paginationRange(current, total, { siblingCount, boundaryCount })\n  const entries = slots.map((slot, i) => ({\n    slot,\n    key: slot === 'ellipsis' ? `ellipsis-after-${slots[i - 1]}` : `page-${slot}`,\n  }))\n\n  return (\n    <nav\n      id={id}\n      aria-label={ariaLabel}\n      data-slot=\"root\"\n      className={s.root({ class: [className, classNames?.root] })}\n    >\n      <ul data-slot=\"list\" className={s.list({ class: classNames?.list })}>\n        <li className=\"flex\">\n          <Button\n            data-slot=\"prev\"\n            aria-label=\"前のページ\"\n            isDisabled={isDisabled || current <= 1}\n            onPress={() => go(current - 1)}\n            className={s.prev({ class: classNames?.prev })}\n          >\n            <span aria-hidden=\"true\">‹</span>\n          </Button>\n        </li>\n\n        {entries.map(({ slot, key }) =>\n          slot === 'ellipsis' ? (\n            <li\n              key={key}\n              data-slot=\"ellipsis\"\n              aria-hidden=\"true\"\n              className={s.ellipsis({ class: classNames?.ellipsis })}\n            >\n              …\n            </li>\n          ) : (\n            <li key={key} className=\"flex\">\n              <Button\n                data-slot=\"item\"\n                aria-label={`${slot}ページ`}\n                aria-current={slot === current ? 'page' : undefined}\n                isDisabled={isDisabled}\n                onPress={() => go(slot)}\n                className={s.item({ class: classNames?.item })}\n              >\n                {slot}\n              </Button>\n            </li>\n          ),\n        )}\n\n        <li className=\"flex\">\n          <Button\n            data-slot=\"next\"\n            aria-label=\"次のページ\"\n            isDisabled={isDisabled || current >= total}\n            onPress={() => go(current + 1)}\n            className={s.next({ class: classNames?.next })}\n          >\n            <span aria-hidden=\"true\">›</span>\n          </Button>\n        </li>\n      </ul>\n    </nav>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAeA,SAAgB,WAAW,EACzB,MACA,QACA,OACA,MACA,cAAc,GACd,UACA,cACA,eACA,YACA,cAAc,YAAY,SAC1B,WACA,YACA,MACkB;CAClB,MAAM,IAAI,iBAAiB;EAAE;EAAM;CAAO,CAAC;CAC3C,MAAM,CAAC,UAAU,eAAe,SAAS,WAAW;CACpD,MAAM,SAAS,MAAc,KAAK,IAAI,KAAK,IAAI,GAAG,CAAC,GAAG,KAAK,IAAI,OAAO,CAAC,CAAC;CACxE,MAAM,UAAU,MAAM,QAAQ,QAAQ;CAEtC,MAAM,MAAM,MAAc;EACxB,MAAM,OAAO,MAAM,CAAC;EACpB,IAAI,SAAS,SAAS;EACtB,IAAI,SAAS,KAAA,GAAW,YAAY,IAAI;EACxC,WAAW,IAAI;CACjB;CAGA,MAAM,QAAQ,gBAAgB,SAAS,OAAO;EAAE;EAAc;CAAc,CAAC;CAC7E,MAAM,UAAU,MAAM,KAAK,MAAM,OAAO;EACtC;EACA,KAAK,SAAS,aAAa,kBAAkB,MAAM,IAAI,OAAO,QAAQ;CACxE,EAAE;CAEF,OACE,oBAAC,OAAD;EACM;EACJ,cAAY;EACZ,aAAU;EACV,WAAW,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,YAAY,IAAI,EAAE,CAAC;EAE1D,UAAA,qBAAC,MAAD;GAAI,aAAU;GAAO,WAAW,EAAE,KAAK,EAAE,OAAO,YAAY,KAAK,CAAC;GAAlE,UAAA;IACE,oBAAC,MAAD;KAAI,WAAU;KACZ,UAAA,oBAAC,QAAD;MACE,aAAU;MACV,cAAW;MACX,YAAY,cAAc,WAAW;MACrC,eAAe,GAAG,UAAU,CAAC;MAC7B,WAAW,EAAE,KAAK,EAAE,OAAO,YAAY,KAAK,CAAC;MAE7C,UAAA,oBAAC,QAAD;OAAM,eAAY;OAAO,UAAA;MAAO,CAAA;KAC1B,CAAA;IACN,CAAA;IAEH,QAAQ,KAAK,EAAE,MAAM,UACpB,SAAS,aACP,oBAAC,MAAD;KAEE,aAAU;KACV,eAAY;KACZ,WAAW,EAAE,SAAS,EAAE,OAAO,YAAY,SAAS,CAAC;KACtD,UAAA;IAEG,GANG,GAMH,IAEJ,oBAAC,MAAD;KAAc,WAAU;KACtB,UAAA,oBAAC,QAAD;MACE,aAAU;MACV,cAAY,GAAG,KAAK;MACpB,gBAAc,SAAS,UAAU,SAAS,KAAA;MAC9B;MACZ,eAAe,GAAG,IAAI;MACtB,WAAW,EAAE,KAAK,EAAE,OAAO,YAAY,KAAK,CAAC;MAE5C,UAAA;KACK,CAAA;IACN,GAXK,GAWL,CAER;IAEA,oBAAC,MAAD;KAAI,WAAU;KACZ,UAAA,oBAAC,QAAD;MACE,aAAU;MACV,cAAW;MACX,YAAY,cAAc,WAAW;MACrC,eAAe,GAAG,UAAU,CAAC;MAC7B,WAAW,EAAE,KAAK,EAAE,OAAO,YAAY,KAAK,CAAC;MAE7C,UAAA,oBAAC,QAAD;OAAM,eAAY;OAAO,UAAA;MAAO,CAAA;KAC1B,CAAA;IACN,CAAA;GACF;;CACD,CAAA;AAET"}

package/dist/pagination/pagination.styles.d.mts

@@ -0,0 +1,67 @@
+import { VariantMap } from "@novi-ui/core";
+//#region src/pagination/pagination.styles.d.ts
+/**
+ * Pagination のスタイル定義。
+ *
+ * @example
+ * import { paginationStyles } from '@novi-ui/flatlay'
+ * import { tv } from 'tailwind-variants'
+ *
+ * const myPagination = tv({ extend: paginationStyles, slots: { item: 'min-w-10' } })
+ */
+declare const paginationStyles: import("tailwind-variants").TVReturnType<{
+  size: VariantMap<"sm" | "md" | "lg", {
+    item: string;
+    prev: string;
+    next: string;
+    ellipsis: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    list: string;
+  }>;
+}, {
+  root: string;
+  list: string;
+  item: string;
+  prev: string;
+  next: string;
+  ellipsis: string;
+}, undefined, {
+  size: VariantMap<"sm" | "md" | "lg", {
+    item: string;
+    prev: string;
+    next: string;
+    ellipsis: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    list: string;
+  }>;
+}, {
+  root: string;
+  list: string;
+  item: string;
+  prev: string;
+  next: string;
+  ellipsis: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  size: VariantMap<"sm" | "md" | "lg", {
+    item: string;
+    prev: string;
+    next: string;
+    ellipsis: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    list: string;
+  }>;
+}, {
+  root: string;
+  list: string;
+  item: string;
+  prev: string;
+  next: string;
+  ellipsis: string;
+}>>;
+type PaginationStyleProps = Parameters<typeof paginationStyles>[0];
+//#endregion
+export { PaginationStyleProps, paginationStyles };
+//# sourceMappingURL=pagination.styles.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.styles.d.mts","names":[],"sources":["../../src/pagination/pagination.styles.ts"],"mappings":";;;;;;;;;;;cAqFa,8CAAgB;;IAvCY;IAAc;IAAc;IAAkB;;;IAsB1C;;;;;;;;;;;IAtBJ;IAAc;IAAc;IAAkB;;;IAsB1C;;;;;;;;;;;IAtBJ;IAAc;IAAc;IAAkB;;;IAsB1C;;;;;;;;;;KAuBjC,uBAAuB,kBAAkB"}

package/dist/pagination/pagination.styles.mjs

@@ -0,0 +1,83 @@
+import { disabledState, focusRing } from "../styles/focus-ring.mjs";
+import { monoNumeric } from "../styles/mono.mjs";
+import { tv } from "tailwind-variants";
+//#region src/pagination/pagination.styles.ts
+/**
+* ページ番号と前後のボタンに共通のセル。**罫線で区切った 1 本の帯**に並び、
+* 現在地は反転（スタンプ）。押した瞬間も反転する（ADR-F3）。
+* 数字は等幅で、帳票のページ番号と同じ字形（ADR-F7）。
+*/
+const cell = [
+	"inline-flex items-center justify-center",
+	`text-[var(--novi-color-fg)] ${monoNumeric}`,
+	"outline-none",
+	"hover:bg-[var(--novi-color-subtle)]",
+	"data-[pressed]:bg-[var(--novi-color-fg)] data-[pressed]:text-[var(--novi-color-bg)]",
+	"aria-[current=page]:bg-[var(--novi-color-fg)] aria-[current=page]:text-[var(--novi-color-bg)]",
+	"transition-[background-color,color]",
+	"duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]",
+	focusRing,
+	disabledState
+].join(" ");
+const slots = {
+	root: "inline-flex",
+	list: [
+		"flex items-stretch list-none m-0 p-0",
+		"border border-[var(--novi-color-border-strong)]",
+		"divide-x divide-[var(--novi-color-border)]",
+		"overflow-hidden"
+	].join(" "),
+	item: cell,
+	prev: cell,
+	next: cell,
+	ellipsis: `inline-flex items-center justify-center text-[var(--novi-color-muted)] select-none ${monoNumeric}`
+};
+/**
+* Pagination のスタイル定義。
+*
+* @example
+* import { paginationStyles } from '@novi-ui/flatlay'
+* import { tv } from 'tailwind-variants'
+*
+* const myPagination = tv({ extend: paginationStyles, slots: { item: 'min-w-10' } })
+*/
+const paginationStyles = tv({
+	slots,
+	variants: {
+		size: {
+			sm: {
+				item: "h-7 min-w-7 px-1.5 text-[length:var(--novi-text-sm)]",
+				prev: "h-7 min-w-7 px-1.5 text-[length:var(--novi-text-sm)]",
+				next: "h-7 min-w-7 px-1.5 text-[length:var(--novi-text-sm)]",
+				ellipsis: "h-7 min-w-7 text-[length:var(--novi-text-sm)]"
+			},
+			md: {
+				item: "h-8 min-w-8 px-1.5 text-[length:var(--novi-text-base)]",
+				prev: "h-8 min-w-8 px-1.5 text-[length:var(--novi-text-base)]",
+				next: "h-8 min-w-8 px-1.5 text-[length:var(--novi-text-base)]",
+				ellipsis: "h-8 min-w-8 text-[length:var(--novi-text-base)]"
+			},
+			lg: {
+				item: "h-10 min-w-10 px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-base)]",
+				prev: "h-10 min-w-10 px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-base)]",
+				next: "h-10 min-w-10 px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-base)]",
+				ellipsis: "h-10 min-w-10 text-[length:var(--novi-text-base)]"
+			}
+		},
+		radius: {
+			none: { list: "rounded-[var(--novi-radius-none)]" },
+			sm: { list: "rounded-[var(--novi-radius-sm)]" },
+			md: { list: "rounded-[var(--novi-radius-md)]" },
+			lg: { list: "rounded-[var(--novi-radius-lg)]" },
+			full: { list: "rounded-[var(--novi-radius-full)]" }
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		radius: "sm"
+	}
+});
+//#endregion
+export { paginationStyles };
+
+//# sourceMappingURL=pagination.styles.mjs.map

package/dist/pagination/pagination.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"pagination.styles.mjs","names":[],"sources":["../../src/pagination/pagination.styles.ts"],"sourcesContent":["import type {\n  NoviRadius,\n  NoviSize,\n  paginationRequiredSlots,\n  paginationSlots,\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/**\n * ページ番号と前後のボタンに共通のセル。**罫線で区切った 1 本の帯**に並び、\n * 現在地は反転（スタンプ）。押した瞬間も反転する（ADR-F3）。\n * 数字は等幅で、帳票のページ番号と同じ字形（ADR-F7）。\n */\nconst cell = [\n  'inline-flex items-center justify-center',\n  `text-[var(--novi-color-fg)] ${monoNumeric}`,\n  'outline-none',\n  'hover:bg-[var(--novi-color-subtle)]',\n  'data-[pressed]:bg-[var(--novi-color-fg)] data-[pressed]:text-[var(--novi-color-bg)]',\n  'aria-[current=page]:bg-[var(--novi-color-fg)] aria-[current=page]:text-[var(--novi-color-bg)]',\n  'transition-[background-color,color]',\n  'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n  focusRing,\n  disabledState,\n].join(' ')\n\nconst slots = {\n  root: 'inline-flex',\n  // 帯そのものが枠。行の切れ目は縦の罫線\n  list: [\n    'flex items-stretch list-none m-0 p-0',\n    'border border-[var(--novi-color-border-strong)]',\n    'divide-x divide-[var(--novi-color-border)]',\n    'overflow-hidden',\n  ].join(' '),\n  item: cell,\n  prev: cell,\n  next: cell,\n  ellipsis: `inline-flex items-center justify-center text-[var(--novi-color-muted)] select-none ${monoNumeric}`,\n} satisfies SlotMap<typeof paginationSlots, (typeof paginationRequiredSlots)[number]>\n\n/** 高さは行の階級に載せる。28 / 32 / 40px */\nconst size: VariantMap<NoviSize, { item: string; prev: string; next: string; ellipsis: string }> = {\n  sm: {\n    item: 'h-7 min-w-7 px-1.5 text-[length:var(--novi-text-sm)]',\n    prev: 'h-7 min-w-7 px-1.5 text-[length:var(--novi-text-sm)]',\n    next: 'h-7 min-w-7 px-1.5 text-[length:var(--novi-text-sm)]',\n    ellipsis: 'h-7 min-w-7 text-[length:var(--novi-text-sm)]',\n  },\n  md: {\n    item: 'h-8 min-w-8 px-1.5 text-[length:var(--novi-text-base)]',\n    prev: 'h-8 min-w-8 px-1.5 text-[length:var(--novi-text-base)]',\n    next: 'h-8 min-w-8 px-1.5 text-[length:var(--novi-text-base)]',\n    ellipsis: 'h-8 min-w-8 text-[length:var(--novi-text-base)]',\n  },\n  lg: {\n    item: 'h-10 min-w-10 px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-base)]',\n    prev: 'h-10 min-w-10 px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-base)]',\n    next: 'h-10 min-w-10 px-[var(--novi-pad-control-x-sm)] text-[length:var(--novi-text-base)]',\n    ellipsis: 'h-10 min-w-10 text-[length:var(--novi-text-base)]',\n  },\n}\n\n// 角丸は帯（list）だけが持つ。セルは隣と罫線で接しているので角を持たない\nconst radius: VariantMap<NoviRadius, { list: string }> = {\n  none: { list: 'rounded-[var(--novi-radius-none)]' },\n  sm: { list: 'rounded-[var(--novi-radius-sm)]' },\n  md: { list: 'rounded-[var(--novi-radius-md)]' },\n  lg: { list: 'rounded-[var(--novi-radius-lg)]' },\n  full: { list: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * Pagination のスタイル定義。\n *\n * @example\n * import { paginationStyles } from '@novi-ui/flatlay'\n * import { tv } from 'tailwind-variants'\n *\n * const myPagination = tv({ extend: paginationStyles, slots: { item: 'min-w-10' } })\n */\nexport const paginationStyles = tv({\n  slots,\n  variants: { size, radius },\n  defaultVariants: { size: 'md', radius: 'sm' },\n})\n\nexport type PaginationStyleProps = Parameters<typeof paginationStyles>[0]\n"],"mappings":";;;;;;;;;AAiBA,MAAM,OAAO;CACX;CACA,+BAA+B;CAC/B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;AAEV,MAAM,QAAQ;CACZ,MAAM;CAEN,MAAM;EACJ;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,MAAM;CACN,MAAM;CACN,MAAM;CACN,UAAU,sFAAsF;AAClG;;;;;;;;;;AA0CA,MAAa,mBAAmB,GAAG;CACjC;CACA,UAAU;EAAE;GAxCZ,IAAI;IACF,MAAM;IACN,MAAM;IACN,MAAM;IACN,UAAU;GACZ;GACA,IAAI;IACF,MAAM;IACN,MAAM;IACN,MAAM;IACN,UAAU;GACZ;GACA,IAAI;IACF,MAAM;IACN,MAAM;IACN,MAAM;IACN,UAAU;GACZ;EAuBY;EAAM;GAlBlB,MAAM,EAAE,MAAM,oCAAoC;GAClD,IAAI,EAAE,MAAM,kCAAkC;GAC9C,IAAI,EAAE,MAAM,kCAAkC;GAC9C,IAAI,EAAE,MAAM,kCAAkC;GAC9C,MAAM,EAAE,MAAM,oCAAoC;EAchC;CAAO;CACzB,iBAAiB;EAAE,MAAM;EAAM,QAAQ;CAAK;AAC9C,CAAC"}

package/dist/popover/popover.styles.d.mts

@@ -10,7 +10,7 @@ import { VariantMap } from "@novi-ui/core";
  * const myPopover = tv({ extend: popoverStyles, slots: { content: 'px-4' } })
  */
 declare const popoverStyles: import("tailwind-variants").TVReturnType<{
-  radius: VariantMap<"none" | "sm" | "md" | "lg" | "full", {
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
     root: string;
   }>;
 }, {
@@ -18,7 +18,7 @@ declare const popoverStyles: import("tailwind-variants").TVReturnType<{
   arrow: string;
   content: string;
 }, undefined, {
-  radius: VariantMap<"none" | "sm" | "md" | "lg" | "full", {
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
     root: string;
   }>;
 }, {
@@ -26,7 +26,7 @@ declare const popoverStyles: import("tailwind-variants").TVReturnType<{
   arrow: string;
   content: string;
 }, import("tailwind-variants").TVReturnTypeLike<{
-  radius: VariantMap<"none" | "sm" | "md" | "lg" | "full", {
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
     root: string;
   }>;
 }, {

package/dist/select/select.d.mts

@@ -26,7 +26,7 @@ declare function SelectItem({ id, isDisabled, children, className }: SelectItemP
  * 矢印キーで移動、Escape で閉じてトリガーへフォーカスが戻る。
  *
  * トリガーは `<button>` で編集可能要素ではないため IME の変換は発生しない。
- * テキスト入力を伴う選択が必要な場合は ComboBox を使う（MVP の対象外）。
+ * テキスト入力を伴う選択が必要な場合は ComboBox を使う。
  *
  * @example
  * <Select label="都道府県" selectedKey={pref} onSelectionChange={setPref}>