@k8o/arte-odyssey 10.1.2 → 10.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/dist/components/buttons/icon-button/icon-button.d.mts +1 -1
  2. package/dist/components/buttons/icon-button/icon-button.mjs +1 -1
  3. package/dist/components/feedback/toast/toast.mjs +2 -2
  4. package/dist/components/form/autocomplete/autocomplete.mjs +20 -28
  5. package/dist/components/form/checkbox/checkbox.mjs +1 -1
  6. package/dist/components/form/checkbox-card/checkbox-card.mjs +1 -1
  7. package/dist/components/form/checkbox-group/index.d.mts +1 -1
  8. package/dist/components/form/file-field/file-field.mjs +1 -1
  9. package/dist/components/form/number-field/number-field.mjs +1 -1
  10. package/dist/components/icons/index.d.mts +2 -2
  11. package/dist/components/icons/index.mjs +2 -2
  12. package/dist/components/icons/lucide-deep.d.mts +9 -0
  13. package/dist/components/icons/lucide-imports.d.mts +58 -0
  14. package/dist/components/icons/lucide-imports.mjs +58 -0
  15. package/dist/components/icons/lucide.d.mts +4 -1
  16. package/dist/components/icons/lucide.mjs +14 -2
  17. package/dist/components/index.d.mts +2 -2
  18. package/dist/components/index.mjs +11 -11
  19. package/dist/components/navigation/tabs/tabs.mjs +1 -1
  20. package/dist/components/overlays/_internal/use-list-navigation.d.mts +40 -0
  21. package/dist/components/overlays/_internal/use-list-navigation.mjs +95 -0
  22. package/dist/components/overlays/dialog/dialog.mjs +1 -1
  23. package/dist/components/overlays/drawer/drawer.mjs +1 -1
  24. package/dist/components/overlays/dropdown-menu/dropdown-menu.d.mts +2 -1
  25. package/dist/components/overlays/dropdown-menu/dropdown-menu.mjs +39 -52
  26. package/dist/components/overlays/dropdown-menu/hooks.d.mts +14 -294
  27. package/dist/components/overlays/dropdown-menu/hooks.mjs +7 -18
  28. package/dist/components/overlays/list-box/hooks.d.mts +12 -292
  29. package/dist/components/overlays/list-box/hooks.mjs +7 -16
  30. package/dist/components/overlays/list-box/list-box.d.mts +1 -1
  31. package/dist/components/overlays/list-box/list-box.mjs +25 -32
  32. package/dist/components/overlays/popover/anchor-positioning.d.mts +26 -0
  33. package/dist/components/overlays/popover/anchor-positioning.mjs +44 -0
  34. package/dist/components/overlays/popover/hooks.d.mts +10 -13
  35. package/dist/components/overlays/popover/hooks.mjs +7 -14
  36. package/dist/components/overlays/popover/popover.d.mts +2 -3
  37. package/dist/components/overlays/popover/popover.mjs +31 -59
  38. package/dist/components/overlays/tooltip/tooltip.d.mts +1 -1
  39. package/dist/components/overlays/tooltip/tooltip.mjs +2 -23
  40. package/dist/helpers/index.mjs +2 -2
  41. package/dist/hooks/focus-trap/index.d.mts +19 -0
  42. package/dist/hooks/focus-trap/index.mjs +51 -0
  43. package/dist/hooks/index.mjs +4 -4
  44. package/dist/index.d.mts +3 -3
  45. package/dist/index.mjs +34 -34
  46. package/dist/integrations/_shared/renderers.mjs +6 -6
  47. package/dist/integrations/_shared/schemas.d.mts +11 -11
  48. package/dist/integrations/json-render/catalog.d.mts +10 -15
  49. package/dist/integrations/openui/form-views.d.mts +0 -9
  50. package/dist/integrations/openui/form-views.mjs +0 -9
  51. package/dist/styles/base.css +39 -1
  52. package/dist/styles/tokens.css +0 -1
  53. package/dist/types/variables.d.mts +6 -1
  54. package/package.json +4 -4
@@ -1,6 +1,6 @@
1
+ import { Placement } from "../../../types/variables.mjs";
1
2
  import { TooltipTriggerProps } from "../../overlays/tooltip/tooltip.mjs";
2
3
  import { FC, HTMLProps, ReactNode } from "react";
3
- import { Placement } from "@floating-ui/react";
4
4
 
5
5
  //#region src/components/buttons/icon-button/icon-button.d.ts
6
6
  type IconButtonTriggerProps = Partial<TooltipTriggerProps>;
@@ -1,9 +1,9 @@
1
1
  "use client";
2
2
  import { FOCUS_RING } from "../../_internal/focus-ring.mjs";
3
3
  import { cn } from "../../../helpers/cn.mjs";
4
- import { Tooltip } from "../../overlays/tooltip/tooltip.mjs";
5
4
  import { chain } from "../../../helpers/chain.mjs";
6
5
  import { mergeRefs } from "../../../helpers/merge-refs.mjs";
6
+ import { Tooltip } from "../../overlays/tooltip/tooltip.mjs";
7
7
  import { useTransition } from "react";
8
8
  import { useFormStatus } from "react-dom";
9
9
  import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -1,7 +1,7 @@
1
1
  "use client";
2
- import { useToast } from "./context.mjs";
3
- import { Alert } from "../alert/alert.mjs";
4
2
  import { useTimeout } from "../../../hooks/timeout/index.mjs";
3
+ import { Alert } from "../alert/alert.mjs";
4
+ import { useToast } from "./context.mjs";
5
5
  import { useCallback } from "react";
6
6
  import { jsx } from "react/jsx-runtime";
7
7
  //#region src/components/feedback/toast/toast.tsx
@@ -1,15 +1,15 @@
1
1
  "use client";
2
2
  import { FOCUS_RING_WITHIN } from "../../_internal/focus-ring.mjs";
3
3
  import { cn } from "../../../helpers/cn.mjs";
4
- import { useDisclosure } from "../../../hooks/disclosure/index.mjs";
5
- import { CloseIcon } from "../../icons/lucide.mjs";
6
- import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
7
4
  import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
8
5
  import { useDeferredDebounce } from "../../../hooks/deferred-debounce/index.mjs";
6
+ import { useDisclosure } from "../../../hooks/disclosure/index.mjs";
7
+ import { useWritingMode } from "../../../hooks/writing-mode/index.mjs";
8
+ import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
9
+ import { CloseIcon } from "../../icons/lucide.mjs";
9
10
  import { useCallback, useEffect, useRef, useState } from "react";
10
11
  import { useFormStatus } from "react-dom";
11
12
  import { jsx, jsxs } from "react/jsx-runtime";
12
- import { autoUpdate, flip, offset, size, useFloating } from "@floating-ui/react";
13
13
  //#region src/components/form/autocomplete/autocomplete.tsx
14
14
  const Autocomplete = ({ id, name, invalid = false, disabled = false, required = false, options, value, defaultValue, onChange, ...rest }) => {
15
15
  const [currentValue, handleChange] = useControllableState({
@@ -21,25 +21,18 @@ const Autocomplete = ({ id, name, invalid = false, disabled = false, required =
21
21
  const { isOpen, open, close } = useDisclosure();
22
22
  const [text, setText] = useState("");
23
23
  const [selectIndex, setSelectIndex] = useState();
24
- const { refs, floatingStyles } = useFloating({
25
- strategy: "fixed",
26
- placement: "bottom-start",
27
- open: isOpen,
28
- whileElementsMounted: autoUpdate,
29
- middleware: [
30
- offset(4),
31
- flip({
32
- fallbackAxisSideDirection: "end",
33
- padding: 8
34
- }),
35
- size({ apply: ({ rects, elements }) => {
36
- const referenceEl = elements.reference instanceof HTMLElement ? elements.reference : null;
37
- const isVertical = referenceEl !== null && getComputedStyle(referenceEl).writingMode.startsWith("vertical");
38
- Object.assign(elements.floating.style, { inlineSize: `${isVertical ? rects.reference.height : rects.reference.width}px` });
39
- } })
40
- ],
41
- transform: false
42
- });
24
+ const writingMode = useWritingMode(ref);
25
+ const anchorName = `--ao-ac-${id.replaceAll(/[^a-zA-Z0-9_-]/gu, "")}`;
26
+ const listboxStyle = {
27
+ position: "fixed",
28
+ inset: "auto",
29
+ margin: 0,
30
+ marginTop: "4px",
31
+ positionAnchor: anchorName,
32
+ positionArea: "bottom span-right",
33
+ positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline",
34
+ inlineSize: `anchor-size(${writingMode === "vertical" ? "height" : "width"})`
35
+ };
43
36
  const [deferredText, isPending] = useDeferredDebounce(text);
44
37
  const filteredOptions = options.filter((option) => option.label.includes(deferredText));
45
38
  const { pending: formPending } = useFormStatus();
@@ -59,10 +52,10 @@ const Autocomplete = ({ id, name, invalid = false, disabled = false, required =
59
52
  document.removeEventListener("click", handleClick);
60
53
  };
61
54
  }, [reset]);
62
- const setReferenceRef = (node) => {
55
+ const setReferenceRef = useCallback((node) => {
63
56
  ref.current = node;
64
- refs.setReference(node);
65
- };
57
+ if (node) node.style.setProperty("anchor-name", anchorName);
58
+ }, [anchorName]);
66
59
  return /* @__PURE__ */ jsxs("div", {
67
60
  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"),
68
61
  ref: setReferenceRef,
@@ -175,9 +168,8 @@ const Autocomplete = ({ id, name, invalid = false, disabled = false, required =
175
168
  }),
176
169
  isOpen && /* @__PURE__ */ jsx("div", {
177
170
  className: "bg-bg-raised z-10 rounded-xl shadow-md",
178
- ref: refs.setFloating,
179
171
  role: "presentation",
180
- style: floatingStyles,
172
+ style: listboxStyle,
181
173
  children: /* @__PURE__ */ jsxs("ul", {
182
174
  "aria-busy": isPending || void 0,
183
175
  className: cn("max-h-96 py-2 transition-opacity vertical:max-h-none vertical:max-w-96", isPending && "opacity-60"),
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { FOCUS_RING_PEER } from "../../_internal/focus-ring.mjs";
3
3
  import { cn } from "../../../helpers/cn.mjs";
4
- import { CheckIcon } from "../../icons/lucide.mjs";
5
4
  import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
5
+ import { CheckIcon } from "../../icons/lucide.mjs";
6
6
  import { useCheckboxGroupContext } from "../checkbox-group/checkbox-group.mjs";
7
7
  import { useFormStatus } from "react-dom";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { cn } from "../../../helpers/cn.mjs";
3
- import { CheckIcon } from "../../icons/lucide.mjs";
4
3
  import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
4
+ import { CheckIcon } from "../../icons/lucide.mjs";
5
5
  import { useId } from "react";
6
6
  import { jsx, jsxs } from "react/jsx-runtime";
7
7
  //#region src/components/form/checkbox-card/checkbox-card.tsx
@@ -33,7 +33,7 @@ declare const CheckboxGroup: import("react").FC<{
33
33
  Item: import("react").FC<{
34
34
  itemValue?: string;
35
35
  label: string;
36
- } & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "value" | "onChange" | "className" | "style" | "defaultChecked" | "children" | "type" | "checked"> & ({
36
+ } & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "value" | "onChange" | "type" | "className" | "style" | "checked" | "defaultChecked" | "children"> & ({
37
37
  value: boolean;
38
38
  onChange: (checked: boolean, event: import("react").ChangeEvent<HTMLInputElement>) => void;
39
39
  defaultChecked?: never;
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { createSafeContext } from "../../../helpers/create-safe-context.mjs";
3
- import { CloseIcon } from "../../icons/lucide.mjs";
4
3
  import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
4
+ import { CloseIcon } from "../../icons/lucide.mjs";
5
5
  import { useCallback, useId, useMemo, useRef, useState } from "react";
6
6
  import { useFormStatus } from "react-dom";
7
7
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { FOCUS_RING_WITHIN } from "../../_internal/focus-ring.mjs";
3
3
  import { cn } from "../../../helpers/cn.mjs";
4
- import { ChevronIcon } from "../../icons/lucide.mjs";
5
4
  import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
5
+ import { ChevronIcon } from "../../icons/lucide.mjs";
6
6
  import { toPrecision } from "../../../internal/to-precision.mjs";
7
7
  import { clamp } from "../../../internal/clamp.mjs";
8
8
  import { cast } from "./cast.mjs";
@@ -1,8 +1,8 @@
1
1
  import { ArteOdyssey } from "./arte-odyssey.mjs";
2
2
  import { GitHubIcon } from "./github-mark.mjs";
3
3
  import { Logo, LogoIcon } from "./logo.mjs";
4
- import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./lucide.mjs";
4
+ import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./lucide.mjs";
5
5
  import { QiitaIcon } from "./qiita.mjs";
6
6
  import { TwitterIcon } from "./twitter.mjs";
7
7
  import { VerticalWritingIcon } from "./vertical-writing.mjs";
8
- export { AIIcon, AccessibilityIcon, AlertIcon, ArteOdyssey, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GitHubIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, QiitaIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon };
8
+ export { AIIcon, AccessibilityIcon, AlertIcon, ArteOdyssey, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GitHubIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, QiitaIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon };
@@ -1,8 +1,8 @@
1
1
  import { ArteOdyssey } from "./arte-odyssey.mjs";
2
2
  import { GitHubIcon } from "./github-mark.mjs";
3
3
  import { Logo, LogoIcon } from "./logo.mjs";
4
- import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./lucide.mjs";
4
+ import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./lucide.mjs";
5
5
  import { QiitaIcon } from "./qiita.mjs";
6
6
  import { TwitterIcon } from "./twitter.mjs";
7
7
  import { VerticalWritingIcon } from "./vertical-writing.mjs";
8
- export { AIIcon, AccessibilityIcon, AlertIcon, ArteOdyssey, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GitHubIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, QiitaIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon };
8
+ export { AIIcon, AccessibilityIcon, AlertIcon, ArteOdyssey, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GitHubIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, QiitaIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon };
@@ -0,0 +1,9 @@
1
+ //#region src/components/icons/lucide-deep.d.ts
2
+ // lucide-react の個別アイコンファイル(dist/esm/icons/*.mjs)には型宣言が無いため、
3
+ // deep import に型を与える。実体は LucideIcon(forwardRef コンポーネント)。
4
+ // バレル import を避けて Vite dev の事前バンドル不具合(named export の undefined 化)を回避する。
5
+ declare module 'lucide-react/dist/esm/icons/*' {
6
+ import type { LucideIcon } from 'lucide-react';
7
+ const icon: LucideIcon;
8
+ export default icon;
9
+ }
@@ -0,0 +1,58 @@
1
+ import Accessibility from "lucide-react/dist/esm/icons/accessibility.mjs";
2
+ import Angry from "lucide-react/dist/esm/icons/angry.mjs";
3
+ import Annoyed from "lucide-react/dist/esm/icons/annoyed.mjs";
4
+ import Atom from "lucide-react/dist/esm/icons/atom.mjs";
5
+ import Bell from "lucide-react/dist/esm/icons/bell.mjs";
6
+ import Blend from "lucide-react/dist/esm/icons/blend.mjs";
7
+ import BookOpenText from "lucide-react/dist/esm/icons/book-open-text.mjs";
8
+ import BookText from "lucide-react/dist/esm/icons/book-text.mjs";
9
+ import Bookmark from "lucide-react/dist/esm/icons/bookmark.mjs";
10
+ import Bot from "lucide-react/dist/esm/icons/bot.mjs";
11
+ import Calendar from "lucide-react/dist/esm/icons/calendar.mjs";
12
+ import Check from "lucide-react/dist/esm/icons/check.mjs";
13
+ import ChevronDown from "lucide-react/dist/esm/icons/chevron-down.mjs";
14
+ import ChevronLeft from "lucide-react/dist/esm/icons/chevron-left.mjs";
15
+ import ChevronRight from "lucide-react/dist/esm/icons/chevron-right.mjs";
16
+ import ChevronUp from "lucide-react/dist/esm/icons/chevron-up.mjs";
17
+ import CircleAlert from "lucide-react/dist/esm/icons/circle-alert.mjs";
18
+ import CircleCheck from "lucide-react/dist/esm/icons/circle-check.mjs";
19
+ import ClipboardPenLine from "lucide-react/dist/esm/icons/clipboard-pen-line.mjs";
20
+ import Clock from "lucide-react/dist/esm/icons/clock.mjs";
21
+ import Contrast from "lucide-react/dist/esm/icons/contrast.mjs";
22
+ import Droplets from "lucide-react/dist/esm/icons/droplets.mjs";
23
+ import ExternalLink from "lucide-react/dist/esm/icons/external-link.mjs";
24
+ import EyeOff from "lucide-react/dist/esm/icons/eye-off.mjs";
25
+ import Eye from "lucide-react/dist/esm/icons/eye.mjs";
26
+ import FlaskConical from "lucide-react/dist/esm/icons/flask-conical.mjs";
27
+ import History from "lucide-react/dist/esm/icons/history.mjs";
28
+ import Info from "lucide-react/dist/esm/icons/info.mjs";
29
+ import Laugh from "lucide-react/dist/esm/icons/laugh.mjs";
30
+ import Lightbulb from "lucide-react/dist/esm/icons/lightbulb.mjs";
31
+ import Link from "lucide-react/dist/esm/icons/link.mjs";
32
+ import ListMinus from "lucide-react/dist/esm/icons/list-minus.mjs";
33
+ import List from "lucide-react/dist/esm/icons/list.mjs";
34
+ import Mail from "lucide-react/dist/esm/icons/mail.mjs";
35
+ import MapPin from "lucide-react/dist/esm/icons/map-pin.mjs";
36
+ import Minus from "lucide-react/dist/esm/icons/minus.mjs";
37
+ import MoonStar from "lucide-react/dist/esm/icons/moon-star.mjs";
38
+ import Package from "lucide-react/dist/esm/icons/package.mjs";
39
+ import PaintBucket from "lucide-react/dist/esm/icons/paint-bucket.mjs";
40
+ import Palette from "lucide-react/dist/esm/icons/palette.mjs";
41
+ import Plus from "lucide-react/dist/esm/icons/plus.mjs";
42
+ import Presentation from "lucide-react/dist/esm/icons/presentation.mjs";
43
+ import Rocket from "lucide-react/dist/esm/icons/rocket.mjs";
44
+ import Rss from "lucide-react/dist/esm/icons/rss.mjs";
45
+ import Send from "lucide-react/dist/esm/icons/send.mjs";
46
+ import ShieldCheck from "lucide-react/dist/esm/icons/shield-check.mjs";
47
+ import Smile from "lucide-react/dist/esm/icons/smile.mjs";
48
+ import Sparkles from "lucide-react/dist/esm/icons/sparkles.mjs";
49
+ import Squircle from "lucide-react/dist/esm/icons/squircle.mjs";
50
+ import Sun from "lucide-react/dist/esm/icons/sun.mjs";
51
+ import Table2 from "lucide-react/dist/esm/icons/table-2.mjs";
52
+ import Tag from "lucide-react/dist/esm/icons/tag.mjs";
53
+ import AlignRight from "lucide-react/dist/esm/icons/text-align-end.mjs";
54
+ import ThumbsDown from "lucide-react/dist/esm/icons/thumbs-down.mjs";
55
+ import ThumbsUp from "lucide-react/dist/esm/icons/thumbs-up.mjs";
56
+ import TriangleAlert from "lucide-react/dist/esm/icons/triangle-alert.mjs";
57
+ import X from "lucide-react/dist/esm/icons/x.mjs";
58
+ 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 };
@@ -0,0 +1,58 @@
1
+ import Accessibility from "lucide-react/dist/esm/icons/accessibility.mjs";
2
+ import Angry from "lucide-react/dist/esm/icons/angry.mjs";
3
+ import Annoyed from "lucide-react/dist/esm/icons/annoyed.mjs";
4
+ import Atom from "lucide-react/dist/esm/icons/atom.mjs";
5
+ import Bell from "lucide-react/dist/esm/icons/bell.mjs";
6
+ import Blend from "lucide-react/dist/esm/icons/blend.mjs";
7
+ import BookOpenText from "lucide-react/dist/esm/icons/book-open-text.mjs";
8
+ import BookText from "lucide-react/dist/esm/icons/book-text.mjs";
9
+ import Bookmark from "lucide-react/dist/esm/icons/bookmark.mjs";
10
+ import Bot from "lucide-react/dist/esm/icons/bot.mjs";
11
+ import Calendar from "lucide-react/dist/esm/icons/calendar.mjs";
12
+ import Check from "lucide-react/dist/esm/icons/check.mjs";
13
+ import ChevronDown from "lucide-react/dist/esm/icons/chevron-down.mjs";
14
+ import ChevronLeft from "lucide-react/dist/esm/icons/chevron-left.mjs";
15
+ import ChevronRight from "lucide-react/dist/esm/icons/chevron-right.mjs";
16
+ import ChevronUp from "lucide-react/dist/esm/icons/chevron-up.mjs";
17
+ import CircleAlert from "lucide-react/dist/esm/icons/circle-alert.mjs";
18
+ import CircleCheck from "lucide-react/dist/esm/icons/circle-check.mjs";
19
+ import ClipboardPenLine from "lucide-react/dist/esm/icons/clipboard-pen-line.mjs";
20
+ import Clock from "lucide-react/dist/esm/icons/clock.mjs";
21
+ import Contrast from "lucide-react/dist/esm/icons/contrast.mjs";
22
+ import Droplets from "lucide-react/dist/esm/icons/droplets.mjs";
23
+ import ExternalLink from "lucide-react/dist/esm/icons/external-link.mjs";
24
+ import EyeOff from "lucide-react/dist/esm/icons/eye-off.mjs";
25
+ import Eye from "lucide-react/dist/esm/icons/eye.mjs";
26
+ import FlaskConical from "lucide-react/dist/esm/icons/flask-conical.mjs";
27
+ import History from "lucide-react/dist/esm/icons/history.mjs";
28
+ import Info from "lucide-react/dist/esm/icons/info.mjs";
29
+ import Laugh from "lucide-react/dist/esm/icons/laugh.mjs";
30
+ import Lightbulb from "lucide-react/dist/esm/icons/lightbulb.mjs";
31
+ import Link from "lucide-react/dist/esm/icons/link.mjs";
32
+ import ListMinus from "lucide-react/dist/esm/icons/list-minus.mjs";
33
+ import List from "lucide-react/dist/esm/icons/list.mjs";
34
+ import Mail from "lucide-react/dist/esm/icons/mail.mjs";
35
+ import MapPin from "lucide-react/dist/esm/icons/map-pin.mjs";
36
+ import Minus from "lucide-react/dist/esm/icons/minus.mjs";
37
+ import MoonStar from "lucide-react/dist/esm/icons/moon-star.mjs";
38
+ import Package from "lucide-react/dist/esm/icons/package.mjs";
39
+ import PaintBucket from "lucide-react/dist/esm/icons/paint-bucket.mjs";
40
+ import Palette from "lucide-react/dist/esm/icons/palette.mjs";
41
+ import Plus from "lucide-react/dist/esm/icons/plus.mjs";
42
+ import Presentation from "lucide-react/dist/esm/icons/presentation.mjs";
43
+ import Rocket from "lucide-react/dist/esm/icons/rocket.mjs";
44
+ import Rss from "lucide-react/dist/esm/icons/rss.mjs";
45
+ import Send from "lucide-react/dist/esm/icons/send.mjs";
46
+ import ShieldCheck from "lucide-react/dist/esm/icons/shield-check.mjs";
47
+ import Smile from "lucide-react/dist/esm/icons/smile.mjs";
48
+ import Sparkles from "lucide-react/dist/esm/icons/sparkles.mjs";
49
+ import Squircle from "lucide-react/dist/esm/icons/squircle.mjs";
50
+ import Sun from "lucide-react/dist/esm/icons/sun.mjs";
51
+ import Table2 from "lucide-react/dist/esm/icons/table-2.mjs";
52
+ import Tag from "lucide-react/dist/esm/icons/tag.mjs";
53
+ import AlignRight from "lucide-react/dist/esm/icons/text-align-end.mjs";
54
+ import ThumbsDown from "lucide-react/dist/esm/icons/thumbs-down.mjs";
55
+ import ThumbsUp from "lucide-react/dist/esm/icons/thumbs-up.mjs";
56
+ import TriangleAlert from "lucide-react/dist/esm/icons/triangle-alert.mjs";
57
+ import X from "lucide-react/dist/esm/icons/x.mjs";
58
+ 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 };
@@ -56,5 +56,8 @@ declare const ShieldCheckIcon: FC<IconProps>;
56
56
  declare const AccessibilityIcon: FC<IconProps>;
57
57
  declare const SparklesIcon: FC<IconProps>;
58
58
  declare const HorizontalWritingIcon: FC<IconProps>;
59
+ declare const SquircleIcon: FC<IconProps>;
60
+ declare const FlaskIcon: FC<IconProps>;
61
+ declare const PackageIcon: FC<IconProps>;
59
62
  //#endregion
60
- export { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon };
63
+ export { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon };
@@ -1,6 +1,6 @@
1
1
  import { BaseIcon } from "./base.mjs";
2
+ 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";
2
3
  import { jsx } from "react/jsx-runtime";
3
- 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, History, Info, Laugh, Lightbulb, Link, List, ListMinus, Mail, MapPin, Minus, MoonStar, PaintBucket, Palette, Plus, Presentation, Rocket, Rss, Send, ShieldCheck, Smile, Sparkles, Sun, Table2, Tag, ThumbsDown, ThumbsUp, TriangleAlert, X } from "lucide-react";
4
4
  //#region src/components/icons/lucide.tsx
5
5
  const CHEVRON_BY_DIRECTION = {
6
6
  up: ChevronUp,
@@ -212,5 +212,17 @@ const HorizontalWritingIcon = ({ size = "md" }) => /* @__PURE__ */ jsx(BaseIcon,
212
212
  renderItem: (props) => /* @__PURE__ */ jsx(BookOpenText, { ...props }),
213
213
  size
214
214
  });
215
+ const SquircleIcon = ({ size = "md" }) => /* @__PURE__ */ jsx(BaseIcon, {
216
+ renderItem: (props) => /* @__PURE__ */ jsx(Squircle, { ...props }),
217
+ size
218
+ });
219
+ const FlaskIcon = ({ size = "md" }) => /* @__PURE__ */ jsx(BaseIcon, {
220
+ renderItem: (props) => /* @__PURE__ */ jsx(FlaskConical, { ...props }),
221
+ size
222
+ });
223
+ const PackageIcon = ({ size = "md" }) => /* @__PURE__ */ jsx(BaseIcon, {
224
+ renderItem: (props) => /* @__PURE__ */ jsx(Package, { ...props }),
225
+ size
226
+ });
215
227
  //#endregion
216
- export { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon };
228
+ export { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon };
@@ -34,7 +34,7 @@ import { Textarea } from "./form/textarea/textarea.mjs";
34
34
  import { ArteOdyssey } from "./icons/arte-odyssey.mjs";
35
35
  import { GitHubIcon } from "./icons/github-mark.mjs";
36
36
  import { Logo, LogoIcon } from "./icons/logo.mjs";
37
- import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./icons/lucide.mjs";
37
+ import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./icons/lucide.mjs";
38
38
  import { QiitaIcon } from "./icons/qiita.mjs";
39
39
  import { TwitterIcon } from "./icons/twitter.mjs";
40
40
  import { VerticalWritingIcon } from "./icons/vertical-writing.mjs";
@@ -55,4 +55,4 @@ import { useOpenContext } from "./overlays/popover/hooks.mjs";
55
55
  import { Popover } from "./overlays/popover/popover.mjs";
56
56
  import { ArteOdysseyProvider } from "./providers/arte-odyssey-provider.mjs";
57
57
  import { PortalRootProvider, usePortalRoot } from "./providers/portal-root.mjs";
58
- export { AIIcon, AccessibilityIcon, Accordion, Alert, AlertIcon, Anchor, ArteOdyssey, ArteOdysseyProvider, AtomIcon, Autocomplete, Avatar, BadIcon, Badge, BaselineStatus, BlogIcon, BoringIcon, Breadcrumb, Button, Card, CheckIcon, Checkbox, CheckboxCard, CheckboxGroup, ChevronIcon, CloseIcon, Code, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, Dialog, DifficultIcon, Drawer, DropdownMenu, EasyIcon, ExternalLinkIcon, FileField, Form, FormControl, FormIcon, GitHubIcon, GoodIcon, Grid, type GridProps, Heading, HistoryIcon, HorizontalWritingIcon, IconButton, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListBox, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, Modal, NavigationMenuIcon, NewsIcon, NumberField, Pagination, PaletteIcon, PasswordInput, PlusIcon, Popover, PortalRootProvider, PrepareIcon, Progress, PublishDateIcon, QiitaIcon, RSSIcon, Radio, RadioCard, ScrollLinked, Select, SendIcon, Separator, ShallowIcon, ShieldCheckIcon, Skeleton, SlideIcon, Slider, SparklesIcon, Spinner, Stack, type StackProps, SubscribeIcon, Switch, Table, TableIcon, Tabs, TagIcon, TextField, Textarea, ToastProvider, Tooltip, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon, useOpenContext, usePortalRoot, useToast };
58
+ export { AIIcon, AccessibilityIcon, Accordion, Alert, AlertIcon, Anchor, ArteOdyssey, ArteOdysseyProvider, AtomIcon, Autocomplete, Avatar, BadIcon, Badge, BaselineStatus, BlogIcon, BoringIcon, Breadcrumb, Button, Card, CheckIcon, Checkbox, CheckboxCard, CheckboxGroup, ChevronIcon, CloseIcon, Code, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, Dialog, DifficultIcon, Drawer, DropdownMenu, EasyIcon, ExternalLinkIcon, FileField, FlaskIcon, Form, FormControl, FormIcon, GitHubIcon, GoodIcon, Grid, type GridProps, Heading, HistoryIcon, HorizontalWritingIcon, IconButton, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListBox, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, Modal, NavigationMenuIcon, NewsIcon, NumberField, PackageIcon, Pagination, PaletteIcon, PasswordInput, PlusIcon, Popover, PortalRootProvider, PrepareIcon, Progress, PublishDateIcon, QiitaIcon, RSSIcon, Radio, RadioCard, ScrollLinked, Select, SendIcon, Separator, ShallowIcon, ShieldCheckIcon, Skeleton, SlideIcon, Slider, SparklesIcon, Spinner, SquircleIcon, Stack, type StackProps, SubscribeIcon, Switch, Table, TableIcon, Tabs, TagIcon, TextField, Textarea, ToastProvider, Tooltip, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon, useOpenContext, usePortalRoot, useToast };
@@ -1,21 +1,16 @@
1
1
  import { Spinner } from "./feedback/spinner/spinner.mjs";
2
2
  import { Button } from "./buttons/button/button.mjs";
3
- import { useToast } from "./feedback/toast/context.mjs";
3
+ import { useOpenContext } from "./overlays/popover/hooks.mjs";
4
+ import { Popover } from "./overlays/popover/popover.mjs";
5
+ import { Tooltip } from "./overlays/tooltip/tooltip.mjs";
6
+ import { IconButton } from "./buttons/icon-button/icon-button.mjs";
4
7
  import { ArteOdyssey } from "./icons/arte-odyssey.mjs";
5
8
  import { GitHubIcon } from "./icons/github-mark.mjs";
6
9
  import { Logo, LogoIcon } from "./icons/logo.mjs";
7
- import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./icons/lucide.mjs";
10
+ import { AIIcon, AccessibilityIcon, AlertIcon, AtomIcon, BadIcon, BlogIcon, BoringIcon, CheckIcon, ChevronIcon, CloseIcon, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, DifficultIcon, EasyIcon, ExternalLinkIcon, FlaskIcon, FormIcon, GoodIcon, HistoryIcon, HorizontalWritingIcon, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListIcon, LocationIcon, MailIcon, MinusIcon, MixedColorIcon, NavigationMenuIcon, NewsIcon, PackageIcon, PaletteIcon, PlusIcon, PrepareIcon, PublishDateIcon, RSSIcon, SendIcon, ShallowIcon, ShieldCheckIcon, SlideIcon, SparklesIcon, SquircleIcon, SubscribeIcon, TableIcon, TagIcon, UpdateDateIcon, ViewIcon, ViewOffIcon } from "./icons/lucide.mjs";
8
11
  import { QiitaIcon } from "./icons/qiita.mjs";
9
12
  import { TwitterIcon } from "./icons/twitter.mjs";
10
13
  import { VerticalWritingIcon } from "./icons/vertical-writing.mjs";
11
- import { Alert } from "./feedback/alert/alert.mjs";
12
- import { ToastProvider } from "./feedback/toast/provider.mjs";
13
- import { ArteOdysseyProvider } from "./providers/arte-odyssey-provider.mjs";
14
- import { PortalRootProvider, usePortalRoot } from "./providers/portal-root.mjs";
15
- import { useOpenContext } from "./overlays/popover/hooks.mjs";
16
- import { Popover } from "./overlays/popover/popover.mjs";
17
- import { Tooltip } from "./overlays/tooltip/tooltip.mjs";
18
- import { IconButton } from "./buttons/icon-button/icon-button.mjs";
19
14
  import { Accordion } from "./data-display/accordion/index.mjs";
20
15
  import { Avatar } from "./data-display/avatar/avatar.mjs";
21
16
  import { Badge } from "./data-display/badge/badge.mjs";
@@ -24,8 +19,11 @@ import { Card } from "./data-display/card/card.mjs";
24
19
  import { Code } from "./data-display/code/code.mjs";
25
20
  import { Heading } from "./data-display/heading/heading.mjs";
26
21
  import { Table } from "./data-display/table/table.mjs";
22
+ import { Alert } from "./feedback/alert/alert.mjs";
27
23
  import { Progress } from "./feedback/progress/progress.mjs";
28
24
  import { Skeleton } from "./feedback/skeleton/skeleton.mjs";
25
+ import { useToast } from "./feedback/toast/context.mjs";
26
+ import { ToastProvider } from "./feedback/toast/provider.mjs";
29
27
  import { Autocomplete } from "./form/autocomplete/autocomplete.mjs";
30
28
  import { Checkbox } from "./form/checkbox/checkbox.mjs";
31
29
  import { CheckboxCard } from "./form/checkbox-card/checkbox-card.mjs";
@@ -51,8 +49,10 @@ import { Breadcrumb } from "./navigation/breadcrumb/breadcrumb.mjs";
51
49
  import { Pagination } from "./navigation/pagination/pagination.mjs";
52
50
  import { Tabs } from "./navigation/tabs/tabs.mjs";
53
51
  import { Dialog } from "./overlays/dialog/dialog.mjs";
52
+ import { ArteOdysseyProvider } from "./providers/arte-odyssey-provider.mjs";
53
+ import { PortalRootProvider, usePortalRoot } from "./providers/portal-root.mjs";
54
54
  import { Modal } from "./overlays/modal/modal.mjs";
55
55
  import { Drawer } from "./overlays/drawer/drawer.mjs";
56
56
  import { DropdownMenu } from "./overlays/dropdown-menu/dropdown-menu.mjs";
57
57
  import { ListBox } from "./overlays/list-box/list-box.mjs";
58
- export { AIIcon, AccessibilityIcon, Accordion, Alert, AlertIcon, Anchor, ArteOdyssey, ArteOdysseyProvider, AtomIcon, Autocomplete, Avatar, BadIcon, Badge, BaselineStatus, BlogIcon, BoringIcon, Breadcrumb, Button, Card, CheckIcon, Checkbox, CheckboxCard, CheckboxGroup, ChevronIcon, CloseIcon, Code, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, Dialog, DifficultIcon, Drawer, DropdownMenu, EasyIcon, ExternalLinkIcon, FileField, Form, FormControl, FormIcon, GitHubIcon, GoodIcon, Grid, Heading, HistoryIcon, HorizontalWritingIcon, IconButton, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListBox, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, Modal, NavigationMenuIcon, NewsIcon, NumberField, Pagination, PaletteIcon, PasswordInput, PlusIcon, Popover, PortalRootProvider, PrepareIcon, Progress, PublishDateIcon, QiitaIcon, RSSIcon, Radio, RadioCard, ScrollLinked, Select, SendIcon, Separator, ShallowIcon, ShieldCheckIcon, Skeleton, SlideIcon, Slider, SparklesIcon, Spinner, Stack, SubscribeIcon, Switch, Table, TableIcon, Tabs, TagIcon, TextField, Textarea, ToastProvider, Tooltip, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon, useOpenContext, usePortalRoot, useToast };
58
+ export { AIIcon, AccessibilityIcon, Accordion, Alert, AlertIcon, Anchor, ArteOdyssey, ArteOdysseyProvider, AtomIcon, Autocomplete, Avatar, BadIcon, Badge, BaselineStatus, BlogIcon, BoringIcon, Breadcrumb, Button, Card, CheckIcon, Checkbox, CheckboxCard, CheckboxGroup, ChevronIcon, CloseIcon, Code, ColorContrastIcon, ColorInfoIcon, CopyIcon, DarkModeIcon, Dialog, DifficultIcon, Drawer, DropdownMenu, EasyIcon, ExternalLinkIcon, FileField, FlaskIcon, Form, FormControl, FormIcon, GitHubIcon, GoodIcon, Grid, Heading, HistoryIcon, HorizontalWritingIcon, IconButton, InformativeIcon, InterestingIcon, LightModeIcon, LinkIcon, ListBox, ListIcon, LocationIcon, Logo, LogoIcon, MailIcon, MinusIcon, MixedColorIcon, Modal, NavigationMenuIcon, NewsIcon, NumberField, PackageIcon, Pagination, PaletteIcon, PasswordInput, PlusIcon, Popover, PortalRootProvider, PrepareIcon, Progress, PublishDateIcon, QiitaIcon, RSSIcon, Radio, RadioCard, ScrollLinked, Select, SendIcon, Separator, ShallowIcon, ShieldCheckIcon, Skeleton, SlideIcon, Slider, SparklesIcon, Spinner, SquircleIcon, Stack, SubscribeIcon, Switch, Table, TableIcon, Tabs, TagIcon, TextField, Textarea, ToastProvider, Tooltip, TwitterIcon, UpdateDateIcon, VerticalWritingIcon, ViewIcon, ViewOffIcon, useOpenContext, usePortalRoot, useToast };
@@ -1,9 +1,9 @@
1
1
  "use client";
2
2
  import { FOCUS_RING } from "../../_internal/focus-ring.mjs";
3
3
  import { cn } from "../../../helpers/cn.mjs";
4
- import { useWritingMode } from "../../../hooks/writing-mode/index.mjs";
5
4
  import { createSafeContext } from "../../../helpers/create-safe-context.mjs";
6
5
  import { useControllableState } from "../../../hooks/controllable-state/index.mjs";
6
+ import { useWritingMode } from "../../../hooks/writing-mode/index.mjs";
7
7
  import { useEffect, useId, useMemo, useRef } from "react";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
9
9
  import * as motion from "motion/react-client";
@@ -0,0 +1,40 @@
1
+ import { Dispatch, KeyboardEvent, SetStateAction } from "react";
2
+
3
+ //#region src/components/overlays/_internal/use-list-navigation.d.ts
4
+ type ListItemProps = {
5
+ ref: (node: HTMLElement | null) => void;
6
+ tabIndex: number;
7
+ onFocus: () => void;
8
+ };
9
+ type ListNavigation = {
10
+ getContentProps: () => {
11
+ onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
12
+ };
13
+ getItemProps: (index: number) => ListItemProps;
14
+ };
15
+ /**
16
+ * 矢印キーによる roving-tabindex のリストナビゲーション。
17
+ * floating-ui の useListNavigation / useInteractions / FloatingList / useListItem を置換する。
18
+ *
19
+ * コンテンツの書字方向に追従してキーを割り当てる:
20
+ * - 横書き: ↑=前 / ↓=次
21
+ * - 縦書き(vertical-rl, 項目は右→左に並ぶ): ←=次 / →=前(↑/↓ も保険として有効)
22
+ *
23
+ * roving-tabindex: アクティブな項目だけ tabIndex=0、他は -1。アクティブ変更時に
24
+ * その項目へフォーカスを移す。開いたら先頭(選択済みがあればそれ)をアクティブにする。
25
+ */
26
+ declare const useListNavigation: ({
27
+ open,
28
+ activeIndex,
29
+ setActiveIndex,
30
+ selectedIndex,
31
+ loop
32
+ }: {
33
+ open: boolean;
34
+ activeIndex: number | null;
35
+ setActiveIndex: Dispatch<SetStateAction<number | null>>;
36
+ selectedIndex?: number | null;
37
+ loop?: boolean;
38
+ }) => ListNavigation;
39
+ //#endregion
40
+ export { ListItemProps, ListNavigation, useListNavigation };
@@ -0,0 +1,95 @@
1
+ "use client";
2
+ import { useEffect, useRef } from "react";
3
+ //#region src/components/overlays/_internal/use-list-navigation.ts
4
+ const isVerticalWritingMode = (el) => {
5
+ const wm = getComputedStyle(el).writingMode;
6
+ return wm.startsWith("vertical") || wm.startsWith("sideways");
7
+ };
8
+ /**
9
+ * 矢印キーによる roving-tabindex のリストナビゲーション。
10
+ * floating-ui の useListNavigation / useInteractions / FloatingList / useListItem を置換する。
11
+ *
12
+ * コンテンツの書字方向に追従してキーを割り当てる:
13
+ * - 横書き: ↑=前 / ↓=次
14
+ * - 縦書き(vertical-rl, 項目は右→左に並ぶ): ←=次 / →=前(↑/↓ も保険として有効)
15
+ *
16
+ * roving-tabindex: アクティブな項目だけ tabIndex=0、他は -1。アクティブ変更時に
17
+ * その項目へフォーカスを移す。開いたら先頭(選択済みがあればそれ)をアクティブにする。
18
+ */
19
+ const useListNavigation = ({ open, activeIndex, setActiveIndex, selectedIndex = null, loop = true }) => {
20
+ const itemElementsRef = useRef([]);
21
+ useEffect(() => {
22
+ if (!open) {
23
+ setActiveIndex(null);
24
+ return;
25
+ }
26
+ setActiveIndex((prev) => prev ?? (selectedIndex !== null && selectedIndex >= 0 ? selectedIndex : 0));
27
+ }, [
28
+ open,
29
+ selectedIndex,
30
+ setActiveIndex
31
+ ]);
32
+ useEffect(() => {
33
+ if (open && activeIndex !== null) itemElementsRef.current[activeIndex]?.focus();
34
+ }, [open, activeIndex]);
35
+ const count = () => itemElementsRef.current.filter(Boolean).length;
36
+ const move = (delta) => {
37
+ const total = count();
38
+ if (total === 0) return;
39
+ setActiveIndex((prev) => {
40
+ const next = (prev ?? (delta === 1 ? -1 : total)) + delta;
41
+ if (loop) return (next + total) % total;
42
+ return Math.max(0, Math.min(total - 1, next));
43
+ });
44
+ };
45
+ const onKeyDown = (event) => {
46
+ const vertical = isVerticalWritingMode(event.currentTarget);
47
+ switch (event.key) {
48
+ case "ArrowDown":
49
+ event.preventDefault();
50
+ move(1);
51
+ break;
52
+ case "ArrowUp":
53
+ event.preventDefault();
54
+ move(-1);
55
+ break;
56
+ case "ArrowLeft":
57
+ if (vertical) {
58
+ event.preventDefault();
59
+ move(1);
60
+ }
61
+ break;
62
+ case "ArrowRight":
63
+ if (vertical) {
64
+ event.preventDefault();
65
+ move(-1);
66
+ }
67
+ break;
68
+ case "Home":
69
+ event.preventDefault();
70
+ setActiveIndex(count() > 0 ? 0 : null);
71
+ break;
72
+ case "End": {
73
+ const total = count();
74
+ event.preventDefault();
75
+ setActiveIndex(total > 0 ? total - 1 : null);
76
+ break;
77
+ }
78
+ default: break;
79
+ }
80
+ };
81
+ return {
82
+ getContentProps: () => ({ onKeyDown }),
83
+ getItemProps: (index) => ({
84
+ ref: (node) => {
85
+ itemElementsRef.current[index] = node;
86
+ },
87
+ tabIndex: activeIndex === index ? 0 : -1,
88
+ onFocus: () => {
89
+ setActiveIndex(index);
90
+ }
91
+ })
92
+ };
93
+ };
94
+ //#endregion
95
+ export { useListNavigation };
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { createSafeContext } from "../../../helpers/create-safe-context.mjs";
3
- import { CloseIcon } from "../../icons/lucide.mjs";
4
3
  import { IconButton } from "../../buttons/icon-button/icon-button.mjs";
4
+ import { CloseIcon } from "../../icons/lucide.mjs";
5
5
  import { Heading } from "../../data-display/heading/heading.mjs";
6
6
  import { useId, useMemo } from "react";
7
7
  import { jsx, jsxs } from "react/jsx-runtime";