@k8o/arte-odyssey 10.2.0 → 10.3.0

package/dist/components/buttons/icon-button/icon-button.d.mts

@@ -1,6 +1,6 @@
+import { Placement } from "../../../types/variables.mjs";
 import { TooltipTriggerProps } from "../../overlays/tooltip/tooltip.mjs";
 import { FC, HTMLProps, ReactNode } from "react";
-import { Placement } from "@floating-ui/react";
 
 //#region src/components/buttons/icon-button/icon-button.d.ts
 type IconButtonTriggerProps = Partial<TooltipTriggerProps>;

package/dist/components/buttons/icon-button/icon-button.mjs

@@ -1,9 +1,9 @@
 "use client";
 import { FOCUS_RING } from "../../_internal/focus-ring.mjs";
 import { cn } from "../../../helpers/cn.mjs";
-import { Tooltip } from "../../overlays/tooltip/tooltip.mjs";
 import { chain } from "../../../helpers/chain.mjs";
 import { mergeRefs } from "../../../helpers/merge-refs.mjs";
+import { Tooltip } from "../../overlays/tooltip/tooltip.mjs";
 import { useTransition } from "react";
 import { useFormStatus } from "react-dom";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/components/feedback/toast/toast.mjs

@@ -1,7 +1,7 @@
 "use client";
-import { useToast } from "./context.mjs";
-import { Alert } from "../alert/alert.mjs";
 import { useTimeout } from "../../../hooks/timeout/index.mjs";
+import { Alert } from "../alert/alert.mjs";
+import { useToast } from "./context.mjs";
 import { useCallback } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/feedback/toast/toast.tsx

package/dist/components/form/autocomplete/autocomplete.mjs

@@ -1,15 +1,15 @@
 "use client";
 import { FOCUS_RING_WITHIN } from "../../_internal/focus-ring.mjs";
 import { cn } from "../../../helpers/cn.mjs";
-import { useDisclosure } from "../../../hooks/disclosure/index.mjs";
-import { CloseIcon } from "../../icons/lucide.mjs";
-import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
 import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
 import { useDeferredDebounce } from "../../../hooks/deferred-debounce/index.mjs";
+import { useDisclosure } from "../../../hooks/disclosure/index.mjs";
+import { useWritingMode } from "../../../hooks/writing-mode/index.mjs";
+import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
+import { CloseIcon } from "../../icons/lucide.mjs";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { useFormStatus } from "react-dom";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { autoUpdate, flip, offset, size, useFloating } from "@floating-ui/react";
 //#region src/components/form/autocomplete/autocomplete.tsx
 const Autocomplete = ({ id, name, invalid = false, disabled = false, required = false, options, value, defaultValue, onChange, ...rest }) => {
 	const [currentValue, handleChange] = useControllableState({
@@ -21,25 +21,18 @@ const Autocomplete = ({ id, name, invalid = false, disabled = false, required =
 	const { isOpen, open, close } = useDisclosure();
 	const [text, setText] = useState("");
 	const [selectIndex, setSelectIndex] = useState();
-	const { refs, floatingStyles } = useFloating({
-		strategy: "fixed",
-		placement: "bottom-start",
-		open: isOpen,
-		whileElementsMounted: autoUpdate,
-		middleware: [
-			offset(4),
-			flip({
-				fallbackAxisSideDirection: "end",
-				padding: 8
-			}),
-			size({ apply: ({ rects, elements }) => {
-				const referenceEl = elements.reference instanceof HTMLElement ? elements.reference : null;
-				const isVertical = referenceEl !== null && getComputedStyle(referenceEl).writingMode.startsWith("vertical");
-				Object.assign(elements.floating.style, { inlineSize: `${isVertical ? rects.reference.height : rects.reference.width}px` });
-			} })
-		],
-		transform: false
-	});
+	const writingMode = useWritingMode(ref);
+	const anchorName = `--ao-ac-${id.replaceAll(/[^a-zA-Z0-9_-]/gu, "")}`;
+	const listboxStyle = {
+		position: "fixed",
+		inset: "auto",
+		margin: 0,
+		marginTop: "4px",
+		positionAnchor: anchorName,
+		positionArea: "bottom span-right",
+		positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline",
+		inlineSize: `anchor-size(${writingMode === "vertical" ? "height" : "width"})`
+	};
 	const [deferredText, isPending] = useDeferredDebounce(text);
 	const filteredOptions = options.filter((option) => option.label.includes(deferredText));
 	const { pending: formPending } = useFormStatus();
@@ -59,10 +52,10 @@ const Autocomplete = ({ id, name, invalid = false, disabled = false, required =
 			document.removeEventListener("click", handleClick);
 		};
 	}, [reset]);
-	const setReferenceRef = (node) => {
+	const setReferenceRef = useCallback((node) => {
 		ref.current = node;
-		refs.setReference(node);
-	};
+		if (node) node.style.setProperty("anchor-name", anchorName);
+	}, [anchorName]);
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn("relative rounded-xl border border-border-base bg-bg-base inline-full", FOCUS_RING_WITHIN, "has-aria-invalid:border-border-error", "has-disabled:cursor-not-allowed has-disabled:border-border-mute has-disabled:bg-bg-mute hover:has-disabled:has-hover:bg-bg-mute"),
 		ref: setReferenceRef,
@@ -175,9 +168,8 @@ const Autocomplete = ({ id, name, invalid = false, disabled = false, required =
 			}),
 			isOpen && /* @__PURE__ */ jsx("div", {
 				className: "bg-bg-raised z-10 rounded-xl shadow-md",
-				ref: refs.setFloating,
 				role: "presentation",
-				style: floatingStyles,
+				style: listboxStyle,
 				children: /* @__PURE__ */ jsxs("ul", {
 					"aria-busy": isPending || void 0,
 					className: cn("max-h-96 py-2 transition-opacity vertical:max-h-none vertical:max-w-96", isPending && "opacity-60"),

package/dist/components/form/checkbox/checkbox.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { FOCUS_RING_PEER } from "../../_internal/focus-ring.mjs";
 import { cn } from "../../../helpers/cn.mjs";
-import { CheckIcon } from "../../icons/lucide.mjs";
 import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
+import { CheckIcon } from "../../icons/lucide.mjs";
 import { useCheckboxGroupContext } from "../checkbox-group/checkbox-group.mjs";
 import { useFormStatus } from "react-dom";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/form/checkbox-card/checkbox-card.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../../../helpers/cn.mjs";
-import { CheckIcon } from "../../icons/lucide.mjs";
 import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
+import { CheckIcon } from "../../icons/lucide.mjs";
 import { useId } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/form/checkbox-card/checkbox-card.tsx

package/dist/components/form/checkbox-group/index.d.mts

@@ -3,7 +3,7 @@ declare const CheckboxGroup: import("react").FC<{
   invalid?: boolean;
   required?: boolean;
   name: string;
-} & Omit<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, "className" | "style" | "onChange" | "defaultValue" | "name"> & {
+} & Omit<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, "defaultValue" | "onChange" | "className" | "style" | "name"> & {
   children?: import("react").ReactNode | undefined;
 } & ({
   value: string[];
@@ -18,7 +18,7 @@ declare const CheckboxGroup: import("react").FC<{
     invalid?: boolean;
     required?: boolean;
     name: string;
-  } & Omit<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, "className" | "style" | "onChange" | "defaultValue" | "name"> & {
+  } & Omit<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, "defaultValue" | "onChange" | "className" | "style" | "name"> & {
     children?: import("react").ReactNode | undefined;
   } & ({
     value: string[];
@@ -33,7 +33,7 @@ declare const CheckboxGroup: import("react").FC<{
   Item: import("react").FC<{
     itemValue?: string;
     label: string;
-  } & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "type" | "className" | "style" | "value" | "onChange" | "children" | "checked" | "defaultChecked"> & ({
+  } & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "value" | "onChange" | "type" | "className" | "style" | "checked" | "defaultChecked" | "children"> & ({
     value: boolean;
     onChange: (checked: boolean, event: import("react").ChangeEvent<HTMLInputElement>) => void;
     defaultChecked?: never;

package/dist/components/form/file-field/file-field.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { createSafeContext } from "../../../helpers/create-safe-context.mjs";
-import { CloseIcon } from "../../icons/lucide.mjs";
 import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
+import { CloseIcon } from "../../icons/lucide.mjs";
 import { useCallback, useId, useMemo, useRef, useState } from "react";
 import { useFormStatus } from "react-dom";
 import { jsx, jsxs } from "react/jsx-runtime";

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

@@ -1,8 +1,8 @@
 "use client";
 import { FOCUS_RING_WITHIN } from "../../_internal/focus-ring.mjs";
 import { cn } from "../../../helpers/cn.mjs";
-import { ChevronIcon } from "../../icons/lucide.mjs";
 import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
+import { ChevronIcon } from "../../icons/lucide.mjs";
 import { toPrecision } from "../../../internal/to-precision.mjs";
 import { clamp } from "../../../internal/clamp.mjs";
 import { cast } from "./cast.mjs";

package/dist/components/icons/lucide-deep.d.mts

@@ -0,0 +1,9 @@
+//#region src/components/icons/lucide-deep.d.ts
+// lucide-react の個別アイコンファイル（dist/esm/icons/*.mjs）には型宣言が無いため、
+// deep import に型を与える。実体は LucideIcon（forwardRef コンポーネント）。
+// バレル import を避けて Vite dev の事前バンドル不具合（named export の undefined 化）を回避する。
+declare module 'lucide-react/dist/esm/icons/*' {
+  import type { LucideIcon } from 'lucide-react';
+  const icon: LucideIcon;
+  export default icon;
+}

package/dist/components/icons/lucide-imports.d.mts

@@ -0,0 +1,58 @@
+import Accessibility from "lucide-react/dist/esm/icons/accessibility.mjs";
+import Angry from "lucide-react/dist/esm/icons/angry.mjs";
+import Annoyed from "lucide-react/dist/esm/icons/annoyed.mjs";
+import Atom from "lucide-react/dist/esm/icons/atom.mjs";
+import Bell from "lucide-react/dist/esm/icons/bell.mjs";
+import Blend from "lucide-react/dist/esm/icons/blend.mjs";
+import BookOpenText from "lucide-react/dist/esm/icons/book-open-text.mjs";
+import BookText from "lucide-react/dist/esm/icons/book-text.mjs";
+import Bookmark from "lucide-react/dist/esm/icons/bookmark.mjs";
+import Bot from "lucide-react/dist/esm/icons/bot.mjs";
+import Calendar from "lucide-react/dist/esm/icons/calendar.mjs";
+import Check from "lucide-react/dist/esm/icons/check.mjs";
+import ChevronDown from "lucide-react/dist/esm/icons/chevron-down.mjs";
+import ChevronLeft from "lucide-react/dist/esm/icons/chevron-left.mjs";
+import ChevronRight from "lucide-react/dist/esm/icons/chevron-right.mjs";
+import ChevronUp from "lucide-react/dist/esm/icons/chevron-up.mjs";
+import CircleAlert from "lucide-react/dist/esm/icons/circle-alert.mjs";
+import CircleCheck from "lucide-react/dist/esm/icons/circle-check.mjs";
+import ClipboardPenLine from "lucide-react/dist/esm/icons/clipboard-pen-line.mjs";
+import Clock from "lucide-react/dist/esm/icons/clock.mjs";
+import Contrast from "lucide-react/dist/esm/icons/contrast.mjs";
+import Droplets from "lucide-react/dist/esm/icons/droplets.mjs";
+import ExternalLink from "lucide-react/dist/esm/icons/external-link.mjs";
+import EyeOff from "lucide-react/dist/esm/icons/eye-off.mjs";
+import Eye from "lucide-react/dist/esm/icons/eye.mjs";
+import FlaskConical from "lucide-react/dist/esm/icons/flask-conical.mjs";
+import History from "lucide-react/dist/esm/icons/history.mjs";
+import Info from "lucide-react/dist/esm/icons/info.mjs";
+import Laugh from "lucide-react/dist/esm/icons/laugh.mjs";
+import Lightbulb from "lucide-react/dist/esm/icons/lightbulb.mjs";
+import Link from "lucide-react/dist/esm/icons/link.mjs";
+import ListMinus from "lucide-react/dist/esm/icons/list-minus.mjs";
+import List from "lucide-react/dist/esm/icons/list.mjs";
+import Mail from "lucide-react/dist/esm/icons/mail.mjs";
+import MapPin from "lucide-react/dist/esm/icons/map-pin.mjs";
+import Minus from "lucide-react/dist/esm/icons/minus.mjs";
+import MoonStar from "lucide-react/dist/esm/icons/moon-star.mjs";
+import Package from "lucide-react/dist/esm/icons/package.mjs";
+import PaintBucket from "lucide-react/dist/esm/icons/paint-bucket.mjs";
+import Palette from "lucide-react/dist/esm/icons/palette.mjs";
+import Plus from "lucide-react/dist/esm/icons/plus.mjs";
+import Presentation from "lucide-react/dist/esm/icons/presentation.mjs";
+import Rocket from "lucide-react/dist/esm/icons/rocket.mjs";
+import Rss from "lucide-react/dist/esm/icons/rss.mjs";
+import Send from "lucide-react/dist/esm/icons/send.mjs";
+import ShieldCheck from "lucide-react/dist/esm/icons/shield-check.mjs";
+import Smile from "lucide-react/dist/esm/icons/smile.mjs";
+import Sparkles from "lucide-react/dist/esm/icons/sparkles.mjs";
+import Squircle from "lucide-react/dist/esm/icons/squircle.mjs";
+import Sun from "lucide-react/dist/esm/icons/sun.mjs";
+import Table2 from "lucide-react/dist/esm/icons/table-2.mjs";
+import Tag from "lucide-react/dist/esm/icons/tag.mjs";
+import AlignRight from "lucide-react/dist/esm/icons/text-align-end.mjs";
+import ThumbsDown from "lucide-react/dist/esm/icons/thumbs-down.mjs";
+import ThumbsUp from "lucide-react/dist/esm/icons/thumbs-up.mjs";
+import TriangleAlert from "lucide-react/dist/esm/icons/triangle-alert.mjs";
+import X from "lucide-react/dist/esm/icons/x.mjs";
+export { Accessibility, AlignRight, Angry, Annoyed, Atom, Bell, Blend, BookOpenText, BookText, Bookmark, Bot, Calendar, Check, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, CircleAlert, CircleCheck, ClipboardPenLine, Clock, Contrast, Droplets, ExternalLink, Eye, EyeOff, FlaskConical, History, Info, Laugh, Lightbulb, Link, List, ListMinus, Mail, MapPin, Minus, MoonStar, Package, PaintBucket, Palette, Plus, Presentation, Rocket, Rss, Send, ShieldCheck, Smile, Sparkles, Squircle, Sun, Table2, Tag, ThumbsDown, ThumbsUp, TriangleAlert, X };

package/dist/components/icons/lucide-imports.mjs

@@ -0,0 +1,58 @@
+import Accessibility from "lucide-react/dist/esm/icons/accessibility.mjs";
+import Angry from "lucide-react/dist/esm/icons/angry.mjs";
+import Annoyed from "lucide-react/dist/esm/icons/annoyed.mjs";
+import Atom from "lucide-react/dist/esm/icons/atom.mjs";
+import Bell from "lucide-react/dist/esm/icons/bell.mjs";
+import Blend from "lucide-react/dist/esm/icons/blend.mjs";
+import BookOpenText from "lucide-react/dist/esm/icons/book-open-text.mjs";
+import BookText from "lucide-react/dist/esm/icons/book-text.mjs";
+import Bookmark from "lucide-react/dist/esm/icons/bookmark.mjs";
+import Bot from "lucide-react/dist/esm/icons/bot.mjs";
+import Calendar from "lucide-react/dist/esm/icons/calendar.mjs";
+import Check from "lucide-react/dist/esm/icons/check.mjs";
+import ChevronDown from "lucide-react/dist/esm/icons/chevron-down.mjs";
+import ChevronLeft from "lucide-react/dist/esm/icons/chevron-left.mjs";
+import ChevronRight from "lucide-react/dist/esm/icons/chevron-right.mjs";
+import ChevronUp from "lucide-react/dist/esm/icons/chevron-up.mjs";
+import CircleAlert from "lucide-react/dist/esm/icons/circle-alert.mjs";
+import CircleCheck from "lucide-react/dist/esm/icons/circle-check.mjs";
+import ClipboardPenLine from "lucide-react/dist/esm/icons/clipboard-pen-line.mjs";
+import Clock from "lucide-react/dist/esm/icons/clock.mjs";
+import Contrast from "lucide-react/dist/esm/icons/contrast.mjs";
+import Droplets from "lucide-react/dist/esm/icons/droplets.mjs";
+import ExternalLink from "lucide-react/dist/esm/icons/external-link.mjs";
+import EyeOff from "lucide-react/dist/esm/icons/eye-off.mjs";
+import Eye from "lucide-react/dist/esm/icons/eye.mjs";
+import FlaskConical from "lucide-react/dist/esm/icons/flask-conical.mjs";
+import History from "lucide-react/dist/esm/icons/history.mjs";
+import Info from "lucide-react/dist/esm/icons/info.mjs";
+import Laugh from "lucide-react/dist/esm/icons/laugh.mjs";
+import Lightbulb from "lucide-react/dist/esm/icons/lightbulb.mjs";
+import Link from "lucide-react/dist/esm/icons/link.mjs";
+import ListMinus from "lucide-react/dist/esm/icons/list-minus.mjs";
+import List from "lucide-react/dist/esm/icons/list.mjs";
+import Mail from "lucide-react/dist/esm/icons/mail.mjs";
+import MapPin from "lucide-react/dist/esm/icons/map-pin.mjs";
+import Minus from "lucide-react/dist/esm/icons/minus.mjs";
+import MoonStar from "lucide-react/dist/esm/icons/moon-star.mjs";
+import Package from "lucide-react/dist/esm/icons/package.mjs";
+import PaintBucket from "lucide-react/dist/esm/icons/paint-bucket.mjs";
+import Palette from "lucide-react/dist/esm/icons/palette.mjs";
+import Plus from "lucide-react/dist/esm/icons/plus.mjs";
+import Presentation from "lucide-react/dist/esm/icons/presentation.mjs";
+import Rocket from "lucide-react/dist/esm/icons/rocket.mjs";
+import Rss from "lucide-react/dist/esm/icons/rss.mjs";
+import Send from "lucide-react/dist/esm/icons/send.mjs";
+import ShieldCheck from "lucide-react/dist/esm/icons/shield-check.mjs";
+import Smile from "lucide-react/dist/esm/icons/smile.mjs";
+import Sparkles from "lucide-react/dist/esm/icons/sparkles.mjs";
+import Squircle from "lucide-react/dist/esm/icons/squircle.mjs";
+import Sun from "lucide-react/dist/esm/icons/sun.mjs";
+import Table2 from "lucide-react/dist/esm/icons/table-2.mjs";
+import Tag from "lucide-react/dist/esm/icons/tag.mjs";
+import AlignRight from "lucide-react/dist/esm/icons/text-align-end.mjs";
+import ThumbsDown from "lucide-react/dist/esm/icons/thumbs-down.mjs";
+import ThumbsUp from "lucide-react/dist/esm/icons/thumbs-up.mjs";
+import TriangleAlert from "lucide-react/dist/esm/icons/triangle-alert.mjs";
+import X from "lucide-react/dist/esm/icons/x.mjs";
+export { Accessibility, AlignRight, Angry, Annoyed, Atom, Bell, Blend, BookOpenText, BookText, Bookmark, Bot, Calendar, Check, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, CircleAlert, CircleCheck, ClipboardPenLine, Clock, Contrast, Droplets, ExternalLink, Eye, EyeOff, FlaskConical, History, Info, Laugh, Lightbulb, Link, List, ListMinus, Mail, MapPin, Minus, MoonStar, Package, PaintBucket, Palette, Plus, Presentation, Rocket, Rss, Send, ShieldCheck, Smile, Sparkles, Squircle, Sun, Table2, Tag, ThumbsDown, ThumbsUp, TriangleAlert, X };

package/dist/components/icons/lucide.mjs

@@ -1,6 +1,6 @@
 import { BaseIcon } from "./base.mjs";
+import { Accessibility, AlignRight, Angry, Annoyed, Atom, Bell, Blend, BookOpenText, BookText, Bookmark, Bot, Calendar, Check, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, CircleAlert, CircleCheck, ClipboardPenLine, Clock, Contrast, Droplets, ExternalLink, Eye, EyeOff, FlaskConical, History, Info, Laugh, Lightbulb, Link, List, ListMinus, Mail, MapPin, Minus, MoonStar, Package, PaintBucket, Palette, Plus, Presentation, Rocket, Rss, Send, ShieldCheck, Smile, Sparkles, Squircle, Sun, Table2, Tag, ThumbsDown, ThumbsUp, TriangleAlert, X } from "./lucide-imports.mjs";
 import { jsx } from "react/jsx-runtime";
-import { Accessibility, AlignRight, Angry, Annoyed, Atom, Bell, Blend, BookOpenText, BookText, Bookmark, Bot, Calendar, Check, ChevronDown, ChevronLeft, ChevronRight, ChevronUp, CircleAlert, CircleCheck, ClipboardPenLine, Clock, Contrast, Droplets, ExternalLink, Eye, EyeOff, FlaskConical, History, Info, Laugh, Lightbulb, Link, List, ListMinus, Mail, MapPin, Minus, MoonStar, Package, PaintBucket, Palette, Plus, Presentation, Rocket, Rss, Send, ShieldCheck, Smile, Sparkles, Squircle, Sun, Table2, Tag, ThumbsDown, ThumbsUp, TriangleAlert, X } from "lucide-react";
 //#region src/components/icons/lucide.tsx
 const CHEVRON_BY_DIRECTION = {
 	up: ChevronUp,

package/dist/components/index.mjs

@@ -1,6 +1,9 @@
 import { Spinner } from "./feedback/spinner/spinner.mjs";
 import { Button } from "./buttons/button/button.mjs";
-import { useToast } from "./feedback/toast/context.mjs";
+import { useOpenContext } from "./overlays/popover/hooks.mjs";
+import { Popover } from "./overlays/popover/popover.mjs";
+import { Tooltip } from "./overlays/tooltip/tooltip.mjs";
+import { IconButton } from "./buttons/icon-button/icon-button.mjs";
 import { ArteOdyssey } from "./icons/arte-odyssey.mjs";
 import { GitHubIcon } from "./icons/github-mark.mjs";
 import { Logo, LogoIcon } from "./icons/logo.mjs";
@@ -8,14 +11,6 @@ import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, Bori
 import { QiitaIcon } from "./icons/qiita.mjs";
 import { TwitterIcon } from "./icons/twitter.mjs";
 import { VerticalWritingIcon } from "./icons/vertical-writing.mjs";
-import { Alert } from "./feedback/alert/alert.mjs";
-import { ToastProvider } from "./feedback/toast/provider.mjs";
-import { ArteOdysseyProvider } from "./providers/arte-odyssey-provider.mjs";
-import { PortalRootProvider, usePortalRoot } from "./providers/portal-root.mjs";
-import { useOpenContext } from "./overlays/popover/hooks.mjs";
-import { Popover } from "./overlays/popover/popover.mjs";
-import { Tooltip } from "./overlays/tooltip/tooltip.mjs";
-import { IconButton } from "./buttons/icon-button/icon-button.mjs";
 import { Accordion } from "./data-display/accordion/index.mjs";
 import { Avatar } from "./data-display/avatar/avatar.mjs";
 import { Badge } from "./data-display/badge/badge.mjs";
@@ -24,8 +19,11 @@ import { Card } from "./data-display/card/card.mjs";
 import { Code } from "./data-display/code/code.mjs";
 import { Heading } from "./data-display/heading/heading.mjs";
 import { Table } from "./data-display/table/table.mjs";
+import { Alert } from "./feedback/alert/alert.mjs";
 import { Progress } from "./feedback/progress/progress.mjs";
 import { Skeleton } from "./feedback/skeleton/skeleton.mjs";
+import { useToast } from "./feedback/toast/context.mjs";
+import { ToastProvider } from "./feedback/toast/provider.mjs";
 import { Autocomplete } from "./form/autocomplete/autocomplete.mjs";
 import { Checkbox } from "./form/checkbox/checkbox.mjs";
 import { CheckboxCard } from "./form/checkbox-card/checkbox-card.mjs";
@@ -51,6 +49,8 @@ import { Breadcrumb } from "./navigation/breadcrumb/breadcrumb.mjs";
 import { Pagination } from "./navigation/pagination/pagination.mjs";
 import { Tabs } from "./navigation/tabs/tabs.mjs";
 import { Dialog } from "./overlays/dialog/dialog.mjs";
+import { ArteOdysseyProvider } from "./providers/arte-odyssey-provider.mjs";
+import { PortalRootProvider, usePortalRoot } from "./providers/portal-root.mjs";
 import { Modal } from "./overlays/modal/modal.mjs";
 import { Drawer } from "./overlays/drawer/drawer.mjs";
 import { DropdownMenu } from "./overlays/dropdown-menu/dropdown-menu.mjs";

package/dist/components/navigation/tabs/tabs.mjs

@@ -1,9 +1,9 @@
 "use client";
 import { FOCUS_RING } from "../../_internal/focus-ring.mjs";
 import { cn } from "../../../helpers/cn.mjs";
-import { useWritingMode } from "../../../hooks/writing-mode/index.mjs";
 import { createSafeContext } from "../../../helpers/create-safe-context.mjs";
 import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
+import { useWritingMode } from "../../../hooks/writing-mode/index.mjs";
 import { useEffect, useId, useMemo, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as motion from "motion/react-client";

package/dist/components/overlays/_internal/use-list-navigation.d.mts

@@ -0,0 +1,40 @@
+import { Dispatch, KeyboardEvent, SetStateAction } from "react";
+
+//#region src/components/overlays/_internal/use-list-navigation.d.ts
+type ListItemProps = {
+  ref: (node: HTMLElement | null) => void;
+  tabIndex: number;
+  onFocus: () => void;
+};
+type ListNavigation = {
+  getContentProps: () => {
+    onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
+  };
+  getItemProps: (index: number) => ListItemProps;
+};
+/**
+ * 矢印キーによる roving-tabindex のリストナビゲーション。
+ * floating-ui の useListNavigation / useInteractions / FloatingList / useListItem を置換する。
+ *
+ * コンテンツの書字方向に追従してキーを割り当てる:
+ * - 横書き: ↑=前 / ↓=次
+ * - 縦書き(vertical-rl, 項目は右→左に並ぶ): ←=次 / →=前（↑/↓ も保険として有効）
+ *
+ * roving-tabindex: アクティブな項目だけ tabIndex=0、他は -1。アクティブ変更時に
+ * その項目へフォーカスを移す。開いたら先頭（選択済みがあればそれ）をアクティブにする。
+ */
+declare const useListNavigation: ({
+  open,
+  activeIndex,
+  setActiveIndex,
+  selectedIndex,
+  loop
+}: {
+  open: boolean;
+  activeIndex: number | null;
+  setActiveIndex: Dispatch<SetStateAction<number | null>>;
+  selectedIndex?: number | null;
+  loop?: boolean;
+}) => ListNavigation;
+//#endregion
+export { ListItemProps, ListNavigation, useListNavigation };

package/dist/components/overlays/_internal/use-list-navigation.mjs

@@ -0,0 +1,95 @@
+"use client";
+import { useEffect, useRef } from "react";
+//#region src/components/overlays/_internal/use-list-navigation.ts
+const isVerticalWritingMode = (el) => {
+	const wm = getComputedStyle(el).writingMode;
+	return wm.startsWith("vertical") || wm.startsWith("sideways");
+};
+/**
+* 矢印キーによる roving-tabindex のリストナビゲーション。
+* floating-ui の useListNavigation / useInteractions / FloatingList / useListItem を置換する。
+*
+* コンテンツの書字方向に追従してキーを割り当てる:
+* - 横書き: ↑=前 / ↓=次
+* - 縦書き(vertical-rl, 項目は右→左に並ぶ): ←=次 / →=前（↑/↓ も保険として有効）
+*
+* roving-tabindex: アクティブな項目だけ tabIndex=0、他は -1。アクティブ変更時に
+* その項目へフォーカスを移す。開いたら先頭（選択済みがあればそれ）をアクティブにする。
+*/
+const useListNavigation = ({ open, activeIndex, setActiveIndex, selectedIndex = null, loop = true }) => {
+	const itemElementsRef = useRef([]);
+	useEffect(() => {
+		if (!open) {
+			setActiveIndex(null);
+			return;
+		}
+		setActiveIndex((prev) => prev ?? (selectedIndex !== null && selectedIndex >= 0 ? selectedIndex : 0));
+	}, [
+		open,
+		selectedIndex,
+		setActiveIndex
+	]);
+	useEffect(() => {
+		if (open && activeIndex !== null) itemElementsRef.current[activeIndex]?.focus();
+	}, [open, activeIndex]);
+	const count = () => itemElementsRef.current.filter(Boolean).length;
+	const move = (delta) => {
+		const total = count();
+		if (total === 0) return;
+		setActiveIndex((prev) => {
+			const next = (prev ?? (delta === 1 ? -1 : total)) + delta;
+			if (loop) return (next + total) % total;
+			return Math.max(0, Math.min(total - 1, next));
+		});
+	};
+	const onKeyDown = (event) => {
+		const vertical = isVerticalWritingMode(event.currentTarget);
+		switch (event.key) {
+			case "ArrowDown":
+				event.preventDefault();
+				move(1);
+				break;
+			case "ArrowUp":
+				event.preventDefault();
+				move(-1);
+				break;
+			case "ArrowLeft":
+				if (vertical) {
+					event.preventDefault();
+					move(1);
+				}
+				break;
+			case "ArrowRight":
+				if (vertical) {
+					event.preventDefault();
+					move(-1);
+				}
+				break;
+			case "Home":
+				event.preventDefault();
+				setActiveIndex(count() > 0 ? 0 : null);
+				break;
+			case "End": {
+				const total = count();
+				event.preventDefault();
+				setActiveIndex(total > 0 ? total - 1 : null);
+				break;
+			}
+			default: break;
+		}
+	};
+	return {
+		getContentProps: () => ({ onKeyDown }),
+		getItemProps: (index) => ({
+			ref: (node) => {
+				itemElementsRef.current[index] = node;
+			},
+			tabIndex: activeIndex === index ? 0 : -1,
+			onFocus: () => {
+				setActiveIndex(index);
+			}
+		})
+	};
+};
+//#endregion
+export { useListNavigation };

package/dist/components/overlays/dialog/dialog.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { createSafeContext } from "../../../helpers/create-safe-context.mjs";
-import { CloseIcon } from "../../icons/lucide.mjs";
 import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
+import { CloseIcon } from "../../icons/lucide.mjs";
 import { Heading } from "../../data-display/heading/heading.mjs";
 import { useId, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/overlays/drawer/drawer.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../../../helpers/cn.mjs";
-import { CloseIcon } from "../../icons/lucide.mjs";
 import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
+import { CloseIcon } from "../../icons/lucide.mjs";
 import { Heading } from "../../data-display/heading/heading.mjs";
 import { Modal } from "../modal/modal.mjs";
 import { useId, useRef } from "react";

package/dist/components/overlays/dropdown-menu/dropdown-menu.d.mts

@@ -1,6 +1,6 @@
 import { Button } from "../../buttons/button/button.mjs";
+import { Placement } from "../../../types/variables.mjs";
 import { ComponentProps, FC, MouseEventHandler, PropsWithChildren, ReactNode } from "react";
-import { Placement } from "@floating-ui/react";
 
 //#region src/components/overlays/dropdown-menu/dropdown-menu.d.ts
 declare const DropdownMenu: {
@@ -13,6 +13,7 @@ declare const DropdownMenu: {
   readonly Item: FC<{
     onClick: MouseEventHandler;
     label: string;
+    index?: number;
   }>;
   readonly Trigger: FC<{
     text: string;