@novi-ui/raster 0.1.0

package/dist/radio/radio.styles.d.mts

@@ -0,0 +1,111 @@
+import { VariantMap } from "@novi-ui/core";
+//#region src/radio/radio.styles.d.ts
+/**
+ * Radio のスタイル定義。
+ *
+ * @example
+ * const myRadio = tv({ extend: radioStyles, slots: { label: 'font-medium' } })
+ */
+declare const radioStyles: import("tailwind-variants").TVReturnType<{
+  color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
+    root: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    control: string;
+    indicator: string;
+    label: string;
+  }>;
+}, {
+  root: string;
+  control: string;
+  indicator: string;
+  label: string;
+  description: string;
+}, undefined, {
+  color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
+    root: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    control: string;
+    indicator: string;
+    label: string;
+  }>;
+}, {
+  root: string;
+  control: string;
+  indicator: string;
+  label: string;
+  description: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
+    root: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    control: string;
+    indicator: string;
+    label: string;
+  }>;
+}, {
+  root: string;
+  control: string;
+  indicator: string;
+  label: string;
+  description: string;
+}>>;
+/**
+ * RadioGroup のスタイル定義。
+ *
+ * @example
+ * const myGroup = tv({ extend: radioGroupStyles, slots: { list: 'gap-4' } })
+ */
+declare const radioGroupStyles: import("tailwind-variants").TVReturnType<{
+  orientation: {
+    vertical: {
+      list: string;
+    };
+    horizontal: {
+      list: string;
+    };
+  };
+}, {
+  root: string;
+  label: string;
+  list: string;
+  description: string;
+  errorMessage: string;
+}, undefined, {
+  orientation: {
+    vertical: {
+      list: string;
+    };
+    horizontal: {
+      list: string;
+    };
+  };
+}, {
+  root: string;
+  label: string;
+  list: string;
+  description: string;
+  errorMessage: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  orientation: {
+    vertical: {
+      list: string;
+    };
+    horizontal: {
+      list: string;
+    };
+  };
+}, {
+  root: string;
+  label: string;
+  list: string;
+  description: string;
+  errorMessage: string;
+}>>;
+type RadioStyleProps = Parameters<typeof radioStyles>[0];
+type RadioGroupStyleProps = Parameters<typeof radioGroupStyles>[0];
+//#endregion
+export { RadioGroupStyleProps, RadioStyleProps, radioGroupStyles, radioStyles };
+//# sourceMappingURL=radio.styles.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"radio.styles.d.mts","names":[],"sources":["../../src/radio/radio.styles.ts"],"mappings":";;;;;;;;cAuDa,yCAAW;;IArBmB;;;IASC;IAAmB;IAAe;;;;;;;;;;IATnC;;;IASC;IAAmB;IAAe;;;;;;;;;;IATnC;;;IASC;IAAmB;IAAe;;;;;;;;;;;;;;;cAgCjE,8CAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAWjB,kBAAkB,kBAAkB;KACpC,uBAAuB,kBAAkB"}

package/dist/radio/radio.styles.mjs

@@ -0,0 +1,88 @@
+import { disabledState, focusRing } from "../styles/focus-ring.mjs";
+import { tv } from "tailwind-variants";
+//#region src/radio/radio.styles.ts
+const slots = {
+	root: [
+		"inline-flex items-start gap-2",
+		"cursor-pointer",
+		disabledState
+	].join(" "),
+	control: [
+		"shrink-0 inline-grid place-items-center",
+		"border border-[var(--novi-color-border-strong)]",
+		"rounded-[var(--novi-radius-full)]",
+		"bg-[var(--novi-color-bg)]",
+		"transition-[border-color]",
+		"duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]",
+		"group-data-[selected]:border-[var(--c)]",
+		"group-data-[invalid]:border-[var(--novi-color-danger)]",
+		focusRing
+	].join(" "),
+	indicator: "rounded-[var(--novi-radius-full)] bg-[var(--c)]",
+	label: "text-[var(--novi-color-fg)] leading-[var(--novi-leading-body)]",
+	description: "text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)]"
+};
+/**
+* Radio のスタイル定義。
+*
+* @example
+* const myRadio = tv({ extend: radioStyles, slots: { label: 'font-medium' } })
+*/
+const radioStyles = tv({
+	slots,
+	variants: {
+		color: {
+			default: { root: "[--c:var(--novi-color-fg)]" },
+			primary: { root: "[--c:var(--novi-color-primary)]" },
+			secondary: { root: "[--c:var(--novi-color-secondary)]" },
+			success: { root: "[--c:var(--novi-color-success)]" },
+			warning: { root: "[--c:var(--novi-color-warning)]" },
+			danger: { root: "[--c:var(--novi-color-danger)]" }
+		},
+		size: {
+			sm: {
+				control: "size-4",
+				indicator: "size-1.5",
+				label: "text-[length:var(--novi-text-sm)]"
+			},
+			md: {
+				control: "size-5",
+				indicator: "size-2",
+				label: "text-[length:var(--novi-text-base)]"
+			},
+			lg: {
+				control: "size-6",
+				indicator: "size-2.5",
+				label: "text-[length:var(--novi-text-base)]"
+			}
+		}
+	},
+	defaultVariants: {
+		color: "default",
+		size: "md"
+	}
+});
+/**
+* RadioGroup のスタイル定義。
+*
+* @example
+* const myGroup = tv({ extend: radioGroupStyles, slots: { list: 'gap-4' } })
+*/
+const radioGroupStyles = tv({
+	slots: {
+		root: "flex flex-col gap-2",
+		label: "text-[length:var(--novi-text-sm)] font-medium text-[var(--novi-color-fg)]",
+		list: "flex flex-col gap-2",
+		description: "text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)]",
+		errorMessage: "text-[length:var(--novi-text-xs)] text-[var(--novi-color-danger)]"
+	},
+	variants: { orientation: {
+		vertical: { list: "flex-col gap-2" },
+		horizontal: { list: "flex-row gap-4 flex-wrap" }
+	} },
+	defaultVariants: { orientation: "vertical" }
+});
+//#endregion
+export { radioGroupStyles, radioStyles };
+
+//# sourceMappingURL=radio.styles.mjs.map

package/dist/radio/radio.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio.styles.mjs","names":[],"sources":["../../src/radio/radio.styles.ts"],"sourcesContent":["import type {\n  NoviColor,\n  NoviSize,\n  radioGroupRequiredSlots,\n  radioGroupSlots,\n  radioRequiredSlots,\n  radioSlots,\n  SlotMap,\n  VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { disabledState, focusRing } from '../styles/focus-ring'\n\nconst slots = {\n  root: ['inline-flex items-start gap-2', 'cursor-pointer', disabledState].join(' '),\n  // 円は radius-full を使う数少ない例外。Checkbox（四角）との形の差で\n  // 「1つだけ選ぶ」ことを示すため、ここは丸を守る\n  control: [\n    'shrink-0 inline-grid place-items-center',\n    'border border-[var(--novi-color-border-strong)]',\n    'rounded-[var(--novi-radius-full)]',\n    'bg-[var(--novi-color-bg)]',\n    'transition-[border-color]',\n    'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n    'group-data-[selected]:border-[var(--c)]',\n    'group-data-[invalid]:border-[var(--novi-color-danger)]',\n    focusRing,\n  ].join(' '),\n  // 内側のドットで選択を示す。塗りつぶしにしない\n  indicator: 'rounded-[var(--novi-radius-full)] bg-[var(--c)]',\n  label: 'text-[var(--novi-color-fg)] leading-[var(--novi-leading-body)]',\n  description: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)]',\n} satisfies SlotMap<typeof radioSlots, (typeof radioRequiredSlots)[number]>\n\nconst color: VariantMap<NoviColor, { root: string }> = {\n  default: { root: '[--c:var(--novi-color-fg)]' },\n  primary: { root: '[--c:var(--novi-color-primary)]' },\n  secondary: { root: '[--c:var(--novi-color-secondary)]' },\n  success: { root: '[--c:var(--novi-color-success)]' },\n  warning: { root: '[--c:var(--novi-color-warning)]' },\n  danger: { root: '[--c:var(--novi-color-danger)]' },\n}\n\nconst size: VariantMap<NoviSize, { control: string; indicator: string; label: string }> = {\n  sm: { control: 'size-4', indicator: 'size-1.5', label: 'text-[length:var(--novi-text-sm)]' },\n  md: { control: 'size-5', indicator: 'size-2', label: 'text-[length:var(--novi-text-base)]' },\n  lg: { control: 'size-6', indicator: 'size-2.5', label: 'text-[length:var(--novi-text-base)]' },\n}\n\n/**\n * Radio のスタイル定義。\n *\n * @example\n * const myRadio = tv({ extend: radioStyles, slots: { label: 'font-medium' } })\n */\nexport const radioStyles = tv({\n  slots,\n  variants: { color, size },\n  defaultVariants: { color: 'default', size: 'md' },\n})\n\nconst groupSlots = {\n  root: 'flex flex-col gap-2',\n  label: 'text-[length:var(--novi-text-sm)] font-medium text-[var(--novi-color-fg)]',\n  list: 'flex flex-col gap-2',\n  description: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)]',\n  errorMessage: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-danger)]',\n} satisfies SlotMap<typeof radioGroupSlots, (typeof radioGroupRequiredSlots)[number]>\n\n/**\n * RadioGroup のスタイル定義。\n *\n * @example\n * const myGroup = tv({ extend: radioGroupStyles, slots: { list: 'gap-4' } })\n */\nexport const radioGroupStyles = tv({\n  slots: groupSlots,\n  variants: {\n    orientation: {\n      vertical: { list: 'flex-col gap-2' },\n      horizontal: { list: 'flex-row gap-4 flex-wrap' },\n    },\n  },\n  defaultVariants: { orientation: 'vertical' },\n})\n\nexport type RadioStyleProps = Parameters<typeof radioStyles>[0]\nexport type RadioGroupStyleProps = Parameters<typeof radioGroupStyles>[0]\n"],"mappings":";;;AAaA,MAAM,QAAQ;CACZ,MAAM;EAAC;EAAiC;EAAkB;CAAa,CAAC,CAAC,KAAK,GAAG;CAGjF,SAAS;EACP;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,WAAW;CACX,OAAO;CACP,aAAa;AACf;;;;;;;AAuBA,MAAa,cAAc,GAAG;CAC5B;CACA,UAAU;EAAE;GAtBZ,SAAS,EAAE,MAAM,6BAA6B;GAC9C,SAAS,EAAE,MAAM,kCAAkC;GACnD,WAAW,EAAE,MAAM,oCAAoC;GACvD,SAAS,EAAE,MAAM,kCAAkC;GACnD,SAAS,EAAE,MAAM,kCAAkC;GACnD,QAAQ,EAAE,MAAM,iCAAiC;EAiBrC;EAAO;GAbnB,IAAI;IAAE,SAAS;IAAU,WAAW;IAAY,OAAO;GAAoC;GAC3F,IAAI;IAAE,SAAS;IAAU,WAAW;IAAU,OAAO;GAAsC;GAC3F,IAAI;IAAE,SAAS;IAAU,WAAW;IAAY,OAAO;GAAsC;EAW1E;CAAK;CACxB,iBAAiB;EAAE,OAAO;EAAW,MAAM;CAAK;AAClD,CAAC;;;;;;;AAgBD,MAAa,mBAAmB,GAAG;CACjC,OAAO;EAdP,MAAM;EACN,OAAO;EACP,MAAM;EACN,aAAa;EACb,cAAc;CAUP;CACP,UAAU,EACR,aAAa;EACX,UAAU,EAAE,MAAM,iBAAiB;EACnC,YAAY,EAAE,MAAM,2BAA2B;CACjD,EACF;CACA,iBAAiB,EAAE,aAAa,WAAW;AAC7C,CAAC"}

package/dist/raster.css

@@ -0,0 +1,92 @@
+/* 自動生成。編集しないこと。src/tokens/raster-tokens.ts を変更して再生成する。 */
+
+@layer novi.base {
+  :root {
+    --novi-radius-none: 0px;
+    --novi-radius-sm: 2px;
+    --novi-radius-md: 2px;
+    --novi-radius-lg: 2px;
+    --novi-radius-full: 9999px;
+    --novi-shadow-none: none;
+    --novi-shadow-sm: none;
+    --novi-shadow-md: none;
+    --novi-shadow-lg: none;
+    --novi-text-xs: 12px;
+    --novi-text-sm: 14px;
+    --novi-text-base: 16px;
+    --novi-text-lg: 20px;
+    --novi-text-xl: 24px;
+    --novi-text-2xl: 30px;
+    --novi-text-3xl: 36px;
+    --novi-duration-fast: 120ms;
+    --novi-duration-base: 120ms;
+    --novi-duration-slow: 120ms;
+    --novi-ease-standard: cubic-bezier(0.2, 0, 0, 1);
+    --novi-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
+    --novi-color-bg: oklch(99% 0 0);
+    --novi-color-subtle: oklch(96% 0 0);
+    --novi-color-fg: oklch(20% 0 0);
+    --novi-color-muted: oklch(48% 0 0);
+    --novi-color-border: oklch(88% 0 0);
+    --novi-color-border-strong: oklch(58% 0 0);
+    --novi-color-overlay: oklch(20% 0 0 / 0.45);
+    --novi-color-default: oklch(96% 0 0);
+    --novi-color-default-fg: oklch(20% 0 0);
+    --novi-color-primary: oklch(48% 0.18 250);
+    --novi-color-primary-fg: oklch(99% 0 0);
+    --novi-color-secondary: oklch(46% 0.16 300);
+    --novi-color-secondary-fg: oklch(99% 0 0);
+    --novi-color-success: oklch(45% 0.13 150);
+    --novi-color-success-fg: oklch(99% 0 0);
+    --novi-color-warning: oklch(45% 0.12 70);
+    --novi-color-warning-fg: oklch(99% 0 0);
+    --novi-color-danger: oklch(48% 0.19 25);
+    --novi-color-danger-fg: oklch(99% 0 0);
+  }
+
+  [data-novi-scheme='dark'] {
+    --novi-color-bg: oklch(16% 0 0);
+    --novi-color-subtle: oklch(21% 0 0);
+    --novi-color-fg: oklch(95% 0 0);
+    --novi-color-muted: oklch(72% 0 0);
+    --novi-color-border: oklch(28% 0 0);
+    --novi-color-border-strong: oklch(55% 0 0);
+    --novi-color-overlay: oklch(10% 0 0 / 0.6);
+    --novi-color-default: oklch(25% 0 0);
+    --novi-color-default-fg: oklch(95% 0 0);
+    --novi-color-primary: oklch(74% 0.14 250);
+    --novi-color-primary-fg: oklch(16% 0 0);
+    --novi-color-secondary: oklch(74% 0.13 300);
+    --novi-color-secondary-fg: oklch(16% 0 0);
+    --novi-color-success: oklch(76% 0.13 150);
+    --novi-color-success-fg: oklch(16% 0 0);
+    --novi-color-warning: oklch(82% 0.12 70);
+    --novi-color-warning-fg: oklch(16% 0 0);
+    --novi-color-danger: oklch(72% 0.16 25);
+    --novi-color-danger-fg: oklch(16% 0 0);
+  }
+
+  @media (prefers-color-scheme: dark) {
+    :root:not([data-novi-scheme='light']) {
+      --novi-color-bg: oklch(16% 0 0);
+      --novi-color-subtle: oklch(21% 0 0);
+      --novi-color-fg: oklch(95% 0 0);
+      --novi-color-muted: oklch(72% 0 0);
+      --novi-color-border: oklch(28% 0 0);
+      --novi-color-border-strong: oklch(55% 0 0);
+      --novi-color-overlay: oklch(10% 0 0 / 0.6);
+      --novi-color-default: oklch(25% 0 0);
+      --novi-color-default-fg: oklch(95% 0 0);
+      --novi-color-primary: oklch(74% 0.14 250);
+      --novi-color-primary-fg: oklch(16% 0 0);
+      --novi-color-secondary: oklch(74% 0.13 300);
+      --novi-color-secondary-fg: oklch(16% 0 0);
+      --novi-color-success: oklch(76% 0.13 150);
+      --novi-color-success-fg: oklch(16% 0 0);
+      --novi-color-warning: oklch(82% 0.12 70);
+      --novi-color-warning-fg: oklch(16% 0 0);
+      --novi-color-danger: oklch(72% 0.16 25);
+      --novi-color-danger-fg: oklch(16% 0 0);
+    }
+  }
+}

package/dist/raster.scoped.css

@@ -0,0 +1,92 @@
+/* 自動生成。編集しないこと。src/tokens/raster-tokens.ts を変更して再生成する。 */
+
+@layer novi.base {
+  [data-novi-theme='raster'] {
+    --novi-radius-none: 0px;
+    --novi-radius-sm: 2px;
+    --novi-radius-md: 2px;
+    --novi-radius-lg: 2px;
+    --novi-radius-full: 9999px;
+    --novi-shadow-none: none;
+    --novi-shadow-sm: none;
+    --novi-shadow-md: none;
+    --novi-shadow-lg: none;
+    --novi-text-xs: 12px;
+    --novi-text-sm: 14px;
+    --novi-text-base: 16px;
+    --novi-text-lg: 20px;
+    --novi-text-xl: 24px;
+    --novi-text-2xl: 30px;
+    --novi-text-3xl: 36px;
+    --novi-duration-fast: 120ms;
+    --novi-duration-base: 120ms;
+    --novi-duration-slow: 120ms;
+    --novi-ease-standard: cubic-bezier(0.2, 0, 0, 1);
+    --novi-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
+    --novi-color-bg: oklch(99% 0 0);
+    --novi-color-subtle: oklch(96% 0 0);
+    --novi-color-fg: oklch(20% 0 0);
+    --novi-color-muted: oklch(48% 0 0);
+    --novi-color-border: oklch(88% 0 0);
+    --novi-color-border-strong: oklch(58% 0 0);
+    --novi-color-overlay: oklch(20% 0 0 / 0.45);
+    --novi-color-default: oklch(96% 0 0);
+    --novi-color-default-fg: oklch(20% 0 0);
+    --novi-color-primary: oklch(48% 0.18 250);
+    --novi-color-primary-fg: oklch(99% 0 0);
+    --novi-color-secondary: oklch(46% 0.16 300);
+    --novi-color-secondary-fg: oklch(99% 0 0);
+    --novi-color-success: oklch(45% 0.13 150);
+    --novi-color-success-fg: oklch(99% 0 0);
+    --novi-color-warning: oklch(45% 0.12 70);
+    --novi-color-warning-fg: oklch(99% 0 0);
+    --novi-color-danger: oklch(48% 0.19 25);
+    --novi-color-danger-fg: oklch(99% 0 0);
+  }
+
+  [data-novi-theme='raster'][data-novi-scheme='dark'] {
+    --novi-color-bg: oklch(16% 0 0);
+    --novi-color-subtle: oklch(21% 0 0);
+    --novi-color-fg: oklch(95% 0 0);
+    --novi-color-muted: oklch(72% 0 0);
+    --novi-color-border: oklch(28% 0 0);
+    --novi-color-border-strong: oklch(55% 0 0);
+    --novi-color-overlay: oklch(10% 0 0 / 0.6);
+    --novi-color-default: oklch(25% 0 0);
+    --novi-color-default-fg: oklch(95% 0 0);
+    --novi-color-primary: oklch(74% 0.14 250);
+    --novi-color-primary-fg: oklch(16% 0 0);
+    --novi-color-secondary: oklch(74% 0.13 300);
+    --novi-color-secondary-fg: oklch(16% 0 0);
+    --novi-color-success: oklch(76% 0.13 150);
+    --novi-color-success-fg: oklch(16% 0 0);
+    --novi-color-warning: oklch(82% 0.12 70);
+    --novi-color-warning-fg: oklch(16% 0 0);
+    --novi-color-danger: oklch(72% 0.16 25);
+    --novi-color-danger-fg: oklch(16% 0 0);
+  }
+
+  @media (prefers-color-scheme: dark) {
+    [data-novi-theme='raster']:not([data-novi-scheme='light']) {
+      --novi-color-bg: oklch(16% 0 0);
+      --novi-color-subtle: oklch(21% 0 0);
+      --novi-color-fg: oklch(95% 0 0);
+      --novi-color-muted: oklch(72% 0 0);
+      --novi-color-border: oklch(28% 0 0);
+      --novi-color-border-strong: oklch(55% 0 0);
+      --novi-color-overlay: oklch(10% 0 0 / 0.6);
+      --novi-color-default: oklch(25% 0 0);
+      --novi-color-default-fg: oklch(95% 0 0);
+      --novi-color-primary: oklch(74% 0.14 250);
+      --novi-color-primary-fg: oklch(16% 0 0);
+      --novi-color-secondary: oklch(74% 0.13 300);
+      --novi-color-secondary-fg: oklch(16% 0 0);
+      --novi-color-success: oklch(76% 0.13 150);
+      --novi-color-success-fg: oklch(16% 0 0);
+      --novi-color-warning: oklch(82% 0.12 70);
+      --novi-color-warning-fg: oklch(16% 0 0);
+      --novi-color-danger: oklch(72% 0.16 25);
+      --novi-color-danger-fg: oklch(16% 0 0);
+    }
+  }
+}

package/dist/select/index.d.mts

@@ -0,0 +1,3 @@
+import { Select, SelectItem, SelectItemProps } from "./select.mjs";
+import { SelectStyleProps, selectStyles } from "./select.styles.mjs";
+export { Select, SelectItem, type SelectItemProps, type SelectStyleProps, selectStyles };

package/dist/select/select.d.mts

@@ -0,0 +1,33 @@
+import { ReactNode } from "react";
+import { SelectProps } from "@novi-ui/core";
+//#region src/select/select.d.ts
+interface SelectItemProps {
+  /** 選択値。`onSelectionChange` に渡る */
+  id: string;
+  isDisabled?: boolean;
+  children?: ReactNode;
+  className?: string;
+}
+/**
+ * Select の選択肢。`Select` の子として置く。
+ *
+ * @example
+ * <SelectItem id="tokyo">東京都</SelectItem>
+ */
+declare function SelectItem({ id, isDisabled, children, className }: SelectItemProps): import("react").JSX.Element;
+/**
+ * 一覧から1つ選ぶ。矢印キーで移動、Escape で閉じてトリガーへフォーカスが戻る。
+ *
+ * トリガーは `<button>` で編集可能要素ではないため IME の変換は発生しない。
+ * テキスト入力を伴う選択が必要な場合は ComboBox を使う（MVP の対象外）。
+ *
+ * @example
+ * <Select label="都道府県" selectedKey={pref} onSelectionChange={setPref}>
+ *   <SelectItem id="tokyo">東京都</SelectItem>
+ *   <SelectItem id="osaka">大阪府</SelectItem>
+ * </Select>
+ */
+declare function Select({ variant, size, radius, label, placeholder, description, errorMessage, name, selectedKey, defaultSelectedKey, onSelectionChange, isOpen, defaultOpen, onOpenChange, isDisabled, isRequired, isInvalid, children, className, classNames, id }: SelectProps): import("react").JSX.Element;
+//#endregion
+export { Select, SelectItem, SelectItemProps };
+//# sourceMappingURL=select.d.mts.map

package/dist/select/select.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.mts","names":[],"sources":["../../src/select/select.tsx"],"mappings":";;;UA0BiB;;EAEf;EACA;EACA,WAAW;EACX;;;;;;;;iBASc,aAAa,IAAI,YAAY,UAAU,aAAa,kCAAe,IAAA;;;;;;;;;;;;;iBA0BnE,SACd,SACA,MACA,QACA,OACA,aACA,aACA,cACA,MACA,aACA,oBACA,mBACA,QACA,aACA,cACA,YACA,YACA,WACA,UACA,WACA,YACA,MACC,8BAAW,IAAA"}

package/dist/select/select.mjs

@@ -0,0 +1,114 @@
+"use client";
+import { selectStyles } from "./select.styles.mjs";
+import { Button, FieldError, Label, ListBox, ListBoxItem, Popover, Select, SelectValue, Text } from "react-aria-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/select/select.tsx
+/** 開閉を示す記号。三角矢印を回転させず、上下の線で描く（Raster の規律）。 */
+function TriggerIcon() {
+	return /* @__PURE__ */ jsx("svg", {
+		viewBox: "0 0 16 16",
+		width: "0.75em",
+		height: "0.75em",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ jsx("path", {
+			d: "M4 6.5l4 4 4-4",
+			stroke: "currentColor",
+			strokeWidth: "1.5"
+		})
+	});
+}
+/**
+* Select の選択肢。`Select` の子として置く。
+*
+* @example
+* <SelectItem id="tokyo">東京都</SelectItem>
+*/
+function SelectItem({ id, isDisabled, children, className }) {
+	return /* @__PURE__ */ jsx(ListBoxItem, {
+		id,
+		isDisabled,
+		textValue: typeof children === "string" ? children : void 0,
+		"data-slot": "option",
+		className: className ?? selectStyles().option(),
+		children
+	});
+}
+/**
+* 一覧から1つ選ぶ。矢印キーで移動、Escape で閉じてトリガーへフォーカスが戻る。
+*
+* トリガーは `<button>` で編集可能要素ではないため IME の変換は発生しない。
+* テキスト入力を伴う選択が必要な場合は ComboBox を使う（MVP の対象外）。
+*
+* @example
+* <Select label="都道府県" selectedKey={pref} onSelectionChange={setPref}>
+*   <SelectItem id="tokyo">東京都</SelectItem>
+*   <SelectItem id="osaka">大阪府</SelectItem>
+* </Select>
+*/
+function Select$1({ variant, size, radius, label, placeholder = "選択してください", description, errorMessage, name, selectedKey, defaultSelectedKey, onSelectionChange, isOpen, defaultOpen, onOpenChange, isDisabled, isRequired, isInvalid, children, className, classNames, id }) {
+	const s = selectStyles({
+		variant,
+		size,
+		radius
+	});
+	return /* @__PURE__ */ jsxs(Select, {
+		id,
+		name,
+		selectedKey,
+		defaultSelectedKey,
+		onSelectionChange: (key) => onSelectionChange?.(key === null ? null : String(key)),
+		isOpen,
+		defaultOpen,
+		onOpenChange,
+		isDisabled,
+		isRequired,
+		isInvalid,
+		placeholder,
+		"data-slot": "root",
+		className: `group ${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(Button, {
+				"data-slot": "trigger",
+				className: s.trigger({ class: classNames?.trigger }),
+				children: [/* @__PURE__ */ jsx(SelectValue, {
+					"data-slot": "value",
+					className: s.value({ class: classNames?.value })
+				}), /* @__PURE__ */ jsx("span", {
+					"data-slot": "icon",
+					className: s.icon({ class: classNames?.icon }),
+					children: /* @__PURE__ */ jsx(TriggerIcon, {})
+				})]
+			}),
+			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
+			}),
+			/* @__PURE__ */ jsx(Popover, {
+				"data-slot": "popover",
+				className: s.popover({ class: classNames?.popover }),
+				children: /* @__PURE__ */ jsx(ListBox, {
+					"data-slot": "listbox",
+					className: s.listbox({ class: classNames?.listbox }),
+					children
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { Select$1 as Select, SelectItem };
+
+//# sourceMappingURL=select.mjs.map

package/dist/select/select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.mjs","names":["Select","RACSelect"],"sources":["../../src/select/select.tsx"],"sourcesContent":["'use client'\n\nimport type { SelectProps } from '@novi-ui/core'\nimport type { ReactNode } from 'react'\nimport {\n  Button,\n  FieldError,\n  Label,\n  ListBox,\n  ListBoxItem,\n  Popover,\n  Select as RACSelect,\n  SelectValue,\n  Text,\n} from 'react-aria-components'\nimport { selectStyles } from './select.styles'\n\n/** 開閉を示す記号。三角矢印を回転させず、上下の線で描く（Raster の規律）。 */\nfunction TriggerIcon() {\n  return (\n    <svg viewBox=\"0 0 16 16\" width=\"0.75em\" height=\"0.75em\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M4 6.5l4 4 4-4\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\n    </svg>\n  )\n}\n\nexport interface SelectItemProps {\n  /** 選択値。`onSelectionChange` に渡る */\n  id: string\n  isDisabled?: boolean\n  children?: ReactNode\n  className?: string\n}\n\n/**\n * Select の選択肢。`Select` の子として置く。\n *\n * @example\n * <SelectItem id=\"tokyo\">東京都</SelectItem>\n */\nexport function SelectItem({ id, isDisabled, children, className }: SelectItemProps) {\n  return (\n    <ListBoxItem\n      id={id}\n      isDisabled={isDisabled}\n      textValue={typeof children === 'string' ? children : undefined}\n      data-slot=\"option\"\n      className={className ?? selectStyles().option()}\n    >\n      {children}\n    </ListBoxItem>\n  )\n}\n\n/**\n * 一覧から1つ選ぶ。矢印キーで移動、Escape で閉じてトリガーへフォーカスが戻る。\n *\n * トリガーは `<button>` で編集可能要素ではないため IME の変換は発生しない。\n * テキスト入力を伴う選択が必要な場合は ComboBox を使う（MVP の対象外）。\n *\n * @example\n * <Select label=\"都道府県\" selectedKey={pref} onSelectionChange={setPref}>\n *   <SelectItem id=\"tokyo\">東京都</SelectItem>\n *   <SelectItem id=\"osaka\">大阪府</SelectItem>\n * </Select>\n */\nexport function Select({\n  variant,\n  size,\n  radius,\n  label,\n  placeholder = '選択してください',\n  description,\n  errorMessage,\n  name,\n  selectedKey,\n  defaultSelectedKey,\n  onSelectionChange,\n  isOpen,\n  defaultOpen,\n  onOpenChange,\n  isDisabled,\n  isRequired,\n  isInvalid,\n  children,\n  className,\n  classNames,\n  id,\n}: SelectProps) {\n  const s = selectStyles({ variant, size, radius })\n\n  return (\n    <RACSelect\n      id={id}\n      name={name}\n      selectedKey={selectedKey}\n      defaultSelectedKey={defaultSelectedKey}\n      onSelectionChange={(key) => onSelectionChange?.(key === null ? null : String(key))}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      isDisabled={isDisabled}\n      isRequired={isRequired}\n      isInvalid={isInvalid}\n      placeholder={placeholder}\n      data-slot=\"root\"\n      // trigger 側から invalid 状態を参照するために group を付ける\n      className={`group ${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      <Button data-slot=\"trigger\" className={s.trigger({ class: classNames?.trigger })}>\n        <SelectValue data-slot=\"value\" className={s.value({ class: classNames?.value })} />\n        <span data-slot=\"icon\" className={s.icon({ class: classNames?.icon })}>\n          <TriggerIcon />\n        </span>\n      </Button>\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\n      <Popover data-slot=\"popover\" className={s.popover({ class: classNames?.popover })}>\n        <ListBox data-slot=\"listbox\" className={s.listbox({ class: classNames?.listbox })}>\n          {children}\n        </ListBox>\n      </Popover>\n    </RACSelect>\n  )\n}\n"],"mappings":";;;;;;AAkBA,SAAS,cAAc;CACrB,OACE,oBAAC,OAAD;EAAK,SAAQ;EAAY,OAAM;EAAS,QAAO;EAAS,MAAK;EAAO,eAAY;EAC9E,UAAA,oBAAC,QAAD;GAAM,GAAE;GAAiB,QAAO;GAAe,aAAY;EAAO,CAAA;CAC/D,CAAA;AAET;;;;;;;AAgBA,SAAgB,WAAW,EAAE,IAAI,YAAY,UAAU,aAA8B;CACnF,OACE,oBAAC,aAAD;EACM;EACQ;EACZ,WAAW,OAAO,aAAa,WAAW,WAAW,KAAA;EACrD,aAAU;EACV,WAAW,aAAa,aAAa,CAAC,CAAC,OAAO;EAE7C;CACU,CAAA;AAEjB;;;;;;;;;;;;;AAcA,SAAgBA,SAAO,EACrB,SACA,MACA,QACA,OACA,cAAc,YACd,aACA,cACA,MACA,aACA,oBACA,mBACA,QACA,aACA,cACA,YACA,YACA,WACA,UACA,WACA,YACA,MACc;CACd,MAAM,IAAI,aAAa;EAAE;EAAS;EAAM;CAAO,CAAC;CAEhD,OACE,qBAACC,QAAD;EACM;EACE;EACO;EACO;EACpB,oBAAoB,QAAQ,oBAAoB,QAAQ,OAAO,OAAO,OAAO,GAAG,CAAC;EACzE;EACK;EACC;EACF;EACA;EACD;EACE;EACb,aAAU;EAEV,WAAW,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,WAAW,YAAY,IAAI,EAAE,CAAC;EAfrE,UAAA;GAiBG,UAAU,KAAA,KACT,oBAAC,OAAD;IAAO,aAAU;IAAQ,WAAW,EAAE,MAAM,EAAE,OAAO,YAAY,MAAM,CAAC;IACrE,UAAA;GACI,CAAA;GAGT,qBAAC,QAAD;IAAQ,aAAU;IAAU,WAAW,EAAE,QAAQ,EAAE,OAAO,YAAY,QAAQ,CAAC;IAA/E,UAAA,CACE,oBAAC,aAAD;KAAa,aAAU;KAAQ,WAAW,EAAE,MAAM,EAAE,OAAO,YAAY,MAAM,CAAC;IAAI,CAAA,GAClF,oBAAC,QAAD;KAAM,aAAU;KAAO,WAAW,EAAE,KAAK,EAAE,OAAO,YAAY,KAAK,CAAC;KAClE,UAAA,oBAAC,aAAD,CAAc,CAAA;IACV,CAAA,CACA;;GAEP,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;GAEZ,oBAAC,SAAD;IAAS,aAAU;IAAU,WAAW,EAAE,QAAQ,EAAE,OAAO,YAAY,QAAQ,CAAC;IAC9E,UAAA,oBAAC,SAAD;KAAS,aAAU;KAAU,WAAW,EAAE,QAAQ,EAAE,OAAO,YAAY,QAAQ,CAAC;KAC7E;IACM,CAAA;GACF,CAAA;EACA;;AAEf"}

package/dist/select/select.styles.d.mts

@@ -0,0 +1,82 @@
+import { VariantMap } from "@novi-ui/core";
+//#region src/select/select.styles.d.ts
+/**
+ * Select のスタイル定義。
+ *
+ * @example
+ * import { selectStyles } from '@novi-ui/raster'
+ * import { tv } from 'tailwind-variants'
+ *
+ * const mySelect = tv({ extend: selectStyles, slots: { popover: 'max-h-96' } })
+ */
+declare const selectStyles: import("tailwind-variants").TVReturnType<{
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    trigger: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    trigger: string;
+    option: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    trigger: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  trigger: string;
+  value: string;
+  icon: string;
+  popover: string;
+  listbox: string;
+  option: string;
+  description: string;
+  errorMessage: string;
+}, undefined, {
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    trigger: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    trigger: string;
+    option: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    trigger: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  trigger: string;
+  value: string;
+  icon: string;
+  popover: string;
+  listbox: string;
+  option: string;
+  description: string;
+  errorMessage: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+  variant: VariantMap<"solid" | "outline" | "soft" | "ghost" | "plain", {
+    trigger: string;
+  }>;
+  size: VariantMap<"sm" | "md" | "lg", {
+    trigger: string;
+    option: string;
+  }>;
+  radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
+    trigger: string;
+  }>;
+}, {
+  root: string;
+  label: string;
+  trigger: string;
+  value: string;
+  icon: string;
+  popover: string;
+  listbox: string;
+  option: string;
+  description: string;
+  errorMessage: string;
+}>>;
+type SelectStyleProps = Parameters<typeof selectStyles>[0];
+//#endregion
+export { SelectStyleProps, selectStyles };
+//# sourceMappingURL=select.styles.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select.styles.d.mts","names":[],"sources":["../../src/select/select.styles.ts"],"mappings":";;;;;;;;;;;cAsGa,0CAAY;;IA3CyB;;;IAWN;IAAgB;;;IAeZ;;;;;;;;;;;;;;;IA1BE;;;IAWN;IAAgB;;;IAeZ;;;;;;;;;;;;;;;IA1BE;;;IAWN;IAAgB;;;IAeZ;;;;;;;;;;;;;;KAuBpC,mBAAmB,kBAAkB"}