@jbpark/ui-kit 10.2.0 → 10.4.0

package/dist/FloatButton.mjs

@@ -0,0 +1,9 @@
+import FloatButton$1 from "./components/atoms/float-button/float-button.mjs";
+import BackTop from "./components/atoms/float-button/back-top.mjs";
+//#region src/components/atoms/float-button/index.ts
+const FloatButton = FloatButton$1;
+FloatButton.BackTop = BackTop;
+//#endregion
+export { FloatButton as default };
+
+//# sourceMappingURL=FloatButton.mjs.map

package/dist/FloatButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatButton.mjs","names":["FloatButtonImpl"],"sources":["../src/components/atoms/float-button/index.ts"],"sourcesContent":["import BackTop from './back-top';\nimport FloatButtonImpl, { type Props } from './float-button';\n\ntype FloatButtonComponent = typeof FloatButtonImpl & {\n  BackTop: typeof BackTop;\n};\n\nconst FloatButton = FloatButtonImpl as FloatButtonComponent;\n\nFloatButton.BackTop = BackTop;\n\nexport default FloatButton;\nexport type { Props };\n"],"mappings":";;;AAOA,MAAM,cAAcA;AAEpB,YAAY,UAAU"}

package/dist/Form.d.mts

@@ -0,0 +1,12 @@
+import Control, { Props } from "./components/organisms/form/control.mjs";
+import Field, { Props as Props$1 } from "./components/organisms/form/field.mjs";
+import Form$1, { Props as Props$2 } from "./components/organisms/form/form.mjs";
+//#region src/components/organisms/form/index.d.ts
+type FormComponent = typeof Form$1 & {
+  Field: typeof Field;
+  Control: typeof Control;
+};
+declare const Form: FormComponent;
+//#endregion
+export { type Props as ControlProps, type Props$1 as FieldProps, type Props$2 as Props, Form as default };
+//# sourceMappingURL=Form.d.mts.map

package/dist/Form.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.d.mts","names":["FormImpl"],"sources":["../src/components/organisms/form/index.ts"],"mappings":";;;;KAIK,uBAAuBA;EAC1B,cAAc;EACd,gBAAgB;;cAGZ,MAAmB"}

package/dist/Form.mjs

@@ -0,0 +1,11 @@
+import Control from "./components/organisms/form/control.mjs";
+import Field from "./components/organisms/form/field.mjs";
+import Form$1 from "./components/organisms/form/form.mjs";
+//#region src/components/organisms/form/index.ts
+const Form = Form$1;
+Form.Field = Field;
+Form.Control = Control;
+//#endregion
+export { Form as default };
+
+//# sourceMappingURL=Form.mjs.map

package/dist/Form.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.mjs","names":["FormImpl"],"sources":["../src/components/organisms/form/index.ts"],"sourcesContent":["import Control from './control';\nimport Field from './field';\nimport FormImpl, { type Props } from './form';\n\ntype FormComponent = typeof FormImpl & {\n  Field: typeof Field;\n  Control: typeof Control;\n};\n\nconst Form = FormImpl as FormComponent;\n\nForm.Field = Field;\nForm.Control = Control;\n\nexport default Form;\nexport type { Props };\nexport type { Props as FieldProps } from './field';\nexport type { Props as ControlProps } from './control';\n"],"mappings":";;;;AASA,MAAM,OAAOA;AAEb,KAAK,QAAQ;AACb,KAAK,UAAU"}

package/dist/Input.d.mts

@@ -0,0 +1,16 @@
+import Input$1, { Props as Props$2 } from "./components/atoms/input/input.mjs";
+import Number, { Props } from "./components/atoms/input/number.mjs";
+import OTP, { Props as Props$1 } from "./components/atoms/input/otp.mjs";
+import Search from "./components/atoms/input/search.mjs";
+import TextArea from "./components/atoms/input/text-area.mjs";
+//#region src/components/atoms/input/index.d.ts
+type InputComponent = typeof Input$1 & {
+  Search: typeof Search;
+  Number: typeof Number;
+  OTP: typeof OTP;
+  TextArea: typeof TextArea;
+};
+declare const Input: InputComponent;
+//#endregion
+export { Number, type Props as NumberProps, OTP, type Props$1 as OTPProps, type Props$2 as Props, Search, TextArea, Input as default };
+//# sourceMappingURL=Input.d.mts.map

package/dist/Input.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.mts","names":["InputImpl"],"sources":["../src/components/atoms/input/index.ts"],"mappings":";;;;;;KAMK,wBAAwBA;EAC3B,eAAe;EACf,eAAe;EACf,YAAY;EACZ,iBAAiB;;cAGb,OAAqB"}

package/dist/Input.mjs

@@ -0,0 +1,15 @@
+import Input$1 from "./components/atoms/input/input.mjs";
+import Number from "./components/atoms/input/number.mjs";
+import OTP from "./components/atoms/input/otp.mjs";
+import Search from "./components/atoms/input/search.mjs";
+import TextArea from "./components/atoms/input/text-area.mjs";
+//#region src/components/atoms/input/index.ts
+const Input = Input$1;
+Input.Search = Search;
+Input.Number = Number;
+Input.OTP = OTP;
+Input.TextArea = TextArea;
+//#endregion
+export { Number, OTP, Search, TextArea, Input as default };
+
+//# sourceMappingURL=Input.mjs.map

package/dist/Input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.mjs","names":["InputImpl"],"sources":["../src/components/atoms/input/index.ts"],"sourcesContent":["import InputImpl, { type Props } from './input';\nimport Number from './number';\nimport OTP from './otp';\nimport Search from './search';\nimport TextArea from './text-area';\n\ntype InputComponent = typeof InputImpl & {\n  Search: typeof Search;\n  Number: typeof Number;\n  OTP: typeof OTP;\n  TextArea: typeof TextArea;\n};\n\nconst Input = InputImpl as InputComponent;\n\nInput.Search = Search;\nInput.Number = Number;\nInput.OTP = OTP;\nInput.TextArea = TextArea;\n\nexport { Number, OTP, Search, TextArea };\nexport type { Props as OTPProps } from './otp';\nexport type { Props as NumberProps } from './number';\nexport default Input;\nexport type { Props };\n"],"mappings":";;;;;;AAaA,MAAM,QAAQA;AAEd,MAAM,SAAS;AACf,MAAM,SAAS;AACf,MAAM,MAAM;AACZ,MAAM,WAAW"}

package/dist/Layout.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.d.mts","names":[],"sources":["../src/components/templates/layout/index.ts"],"mappings":";;;;;;KAMK,yBAAyB;EAC5B,gBAAgB;EAChB,eAAe;EACf,eAAe;EACf,cAAc;;cAGV,QAAuB"}
+{"version":3,"file":"Layout.d.mts","names":["LayoutImpl"],"sources":["../src/components/templates/layout/index.ts"],"mappings":";;;;;;KAMK,yBAAyBA;EAC5B,gBAAgB;EAChB,eAAe;EACf,eAAe;EACf,cAAc;;cAGV,QAAuB"}

package/dist/{components/organisms/list/index.d.mts → List.d.mts}

@@ -1,5 +1,5 @@
-import Item from "./item.mjs";
-import List$1, { Props } from "./list.mjs";
+import Item from "./components/organisms/list/item.mjs";
+import List$1, { Props } from "./components/organisms/list/list.mjs";
 //#region src/components/organisms/list/index.d.ts
 type ListComponent = typeof List$1 & {
   Item: typeof Item;
@@ -7,4 +7,4 @@ type ListComponent = typeof List$1 & {
 declare const List: ListComponent;
 //#endregion
 export { type Props as ListProps, List as default };
-//# sourceMappingURL=index.d.mts.map
+//# sourceMappingURL=List.d.mts.map

package/dist/List.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.mts","names":["ListImpl"],"sources":["../src/components/organisms/list/index.ts"],"mappings":";;;KAGK,uBAAuBA;EAAa,aAAa;;cAEhD,MAAmB"}

package/dist/List.mjs

@@ -0,0 +1,9 @@
+import Item from "./components/organisms/list/item.mjs";
+import List$1 from "./components/organisms/list/list.mjs";
+//#region src/components/organisms/list/index.ts
+const List = List$1;
+List.Item = Item;
+//#endregion
+export { List as default };
+
+//# sourceMappingURL=List.mjs.map

package/dist/List.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.mjs","names":["ListImpl"],"sources":["../src/components/organisms/list/index.ts"],"sourcesContent":["import Item from './item';\nimport ListImpl from './list';\n\ntype ListComponent = typeof ListImpl & { Item: typeof Item };\n\nconst List = ListImpl as ListComponent;\n\nList.Item = Item;\n\nexport default List;\nexport type { Props as ListProps } from './list';\n"],"mappings":";;;AAKA,MAAM,OAAOA;AAEb,KAAK,OAAO"}

package/dist/Marquees.d.mts

@@ -0,0 +1,10 @@
+import Item, { ItemProps } from "./components/molecules/marquees/item.mjs";
+import Marquees$1, { Props } from "./components/molecules/marquees/marquees.mjs";
+//#region src/components/molecules/marquees/index.d.ts
+type MarqueesComponent = typeof Marquees$1 & {
+  Item: typeof Item;
+};
+declare const Marquees: MarqueesComponent;
+//#endregion
+export { Item, type ItemProps, type Props as MarqueesProps, type Props, Marquees as default };
+//# sourceMappingURL=Marquees.d.mts.map

package/dist/Marquees.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Marquees.d.mts","names":["MarqueesImpl"],"sources":["../src/components/molecules/marquees/index.ts"],"mappings":";;;KAGK,2BAA2BA;EAAiB,aAAa;;cAExD,UAA2B"}

package/dist/Marquees.mjs

@@ -0,0 +1,9 @@
+import Item from "./components/molecules/marquees/item.mjs";
+import Marquees$1 from "./components/molecules/marquees/marquees.mjs";
+//#region src/components/molecules/marquees/index.ts
+const Marquees = Marquees$1;
+Marquees.Item = Item;
+//#endregion
+export { Item, Marquees as default };
+
+//# sourceMappingURL=Marquees.mjs.map

package/dist/Marquees.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Marquees.mjs","names":["MarqueesImpl"],"sources":["../src/components/molecules/marquees/index.ts"],"sourcesContent":["import Item from './item';\nimport MarqueesImpl, { type Props } from './marquees';\n\ntype MarqueesComponent = typeof MarqueesImpl & { Item: typeof Item };\n\nconst Marquees = MarqueesImpl as MarqueesComponent;\n\nMarquees.Item = Item;\n\nexport default Marquees;\nexport { Item };\nexport type { ItemProps } from './item';\nexport type { Props, Props as MarqueesProps };\n"],"mappings":";;;AAKA,MAAM,WAAWA;AAEjB,SAAS,OAAO"}

package/dist/Mentions.d.mts

@@ -0,0 +1,34 @@
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/components/atoms/mentions.d.ts
+export interface Option {
+  /** Unique, non-empty token text without whitespace or the prefix. */
+  value: string;
+  label?: string;
+  prefix?: string;
+  disabled?: boolean;
+}
+export interface Props extends Omit<ComponentPropsWithRef<'textarea'>, 'children' | 'value' | 'defaultValue' | 'onChange' | 'onSelect'> {
+  options: readonly Option[];
+  value?: string;
+  defaultValue?: string;
+  onChange?: (value: string) => void;
+  onSelect?: (option: Option, prefix: string) => void;
+  onSearch?: (query: string, prefix: string) => void;
+  prefixes?: readonly string[];
+  filterOption?: false | ((query: string, option: Option) => boolean);
+  loading?: boolean;
+  loadingText?: ReactNode;
+  emptyText?: ReactNode;
+  container?: HTMLElement;
+  classNames?: {
+    root?: string;
+    content?: string;
+    list?: string;
+    option?: string;
+    empty?: string;
+  };
+}
+declare const Mentions: ({ options, value, defaultValue, onChange, onSelect, onSearch, prefixes, filterOption, loading, loadingText, emptyText, container, disabled, readOnly, name, form, className, classNames, dir, ref, onFocus, onBlur, onClick, onKeyDown, onKeyUp, onCompositionStart, onCompositionEnd, ...props }: Props) => import("react").JSX.Element;
+//#endregion
+export { Mentions as default };
+//# sourceMappingURL=Mentions.d.mts.map

package/dist/Mentions.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Mentions.d.mts","names":[],"sources":["../src/components/atoms/mentions.tsx"],"mappings":";;iBAwBiB;;EAEf;EACA;EACA;EACA;;iBAGe,cAAc,KAC7B;EAGA,kBAAkB;EAClB;EACA;EACA,YAAY;EACZ,YAAY,QAAQ,QAAQ;EAC5B,YAAY,eAAe;EAC3B;EACA,yBAAyB,eAAe,QAAQ;EAChD;EACA,cAAc;EACd,YAAY;EACZ,YAAY;EACZ;IACE;IACA;IACA;IACA;IACA;;;cAkBE,aAAY,SAAA,OAAA,cAAA,UAAA,UAAA,UAAA,UAAA,cAAA,SAAA,aAAA,WAAA,WAAA,UAAA,UAAA,MAAA,MAAA,WAAA,YAAA,KAAA,KAAA,SAAA,QAAA,SAAA,WAAA,SAAA,oBAAA,qBAAA,SA6Bf,0BAAK,IAAA"}

package/dist/Mentions.mjs

@@ -0,0 +1,208 @@
+"use client";
+import { cn } from "./utils.mjs";
+import { useConfig } from "./providers/config/context.mjs";
+import { autocomplete_exports } from "./core/autocomplete.mjs";
+import Input from "./Input.mjs";
+import { findToken, insertToken } from "./components/atoms/mentions-token.mjs";
+import { useEffect, useRef, useState } from "react";
+import { useControllableState, useLatest, useMergedRef } from "@jbpark/use-hooks";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/atoms/mentions.tsx
+const DEFAULT_PREFIXES = ["@"];
+function TextareaBridge({ primitiveRef, ref, ...props }) {
+	const mergedRef = useMergedRef(primitiveRef, ref);
+	return /* @__PURE__ */ jsx(Input.TextArea, {
+		...props,
+		ref: mergedRef
+	});
+}
+const Mentions = ({ options, value, defaultValue = "", onChange, onSelect, onSearch, prefixes = DEFAULT_PREFIXES, filterOption, loading = false, loadingText = "Loading suggestions…", emptyText = "No suggestions", container, disabled, readOnly, name, form, className, classNames, dir, ref, onFocus, onBlur, onClick, onKeyDown, onKeyUp, onCompositionStart, onCompositionEnd, ...props }) => {
+	const { direction } = useConfig();
+	const textareaRef = useRef(null);
+	const mergedRef = useMergedRef(ref, textareaRef);
+	const composingRef = useRef(false);
+	const pendingCaret = useRef(null);
+	const [text, setText] = useControllableState({
+		value,
+		defaultValue,
+		onChange
+	});
+	const [focused, setFocused] = useState(false);
+	const [composing, setComposing] = useState(false);
+	const [selection, setSelection] = useState({
+		text: "",
+		start: 0,
+		end: 0
+	});
+	const [dismissed, setDismissed] = useState([]);
+	const token = focused && !composing && !disabled && !readOnly && selection.text === text ? findToken(text, selection.start, selection.end, prefixes) : null;
+	const signature = token ? JSON.stringify([
+		text,
+		selection.start,
+		selection.end,
+		token.prefix
+	]) : null;
+	const open = token !== null && !dismissed.includes(signature);
+	const query = token?.query;
+	const prefix = token?.prefix;
+	const searchRef = useLatest(onSearch);
+	useEffect(() => {
+		if (query !== void 0 && prefix !== void 0) searchRef.current?.(query, prefix);
+	}, [
+		query,
+		prefix,
+		searchRef
+	]);
+	useEffect(() => {
+		const pending = pendingCaret.current;
+		const textarea = textareaRef.current;
+		if (pending && textarea && text === pending.value) {
+			pendingCaret.current = null;
+			if (textarea.ownerDocument.activeElement === textarea) textarea.setSelectionRange(pending.caret, pending.caret);
+		}
+	});
+	const syncSelection = (textarea) => {
+		setSelection((previous) => {
+			const next = {
+				text: textarea.value,
+				start: textarea.selectionStart,
+				end: textarea.selectionEnd
+			};
+			return previous.text === next.text && previous.start === next.start && previous.end === next.end ? previous : next;
+		});
+	};
+	const filtered = options.filter((option) => {
+		if (!option.value || /\s/u.test(option.value) || prefixes.some((prefix) => prefix.length > 0 && option.value.startsWith(prefix)) || option.prefix !== void 0 && option.prefix !== prefix) return false;
+		if (filterOption === false) return true;
+		return filterOption ? filterOption(query ?? "", option) : [option.value, option.label ?? ""].some((label) => label.toLowerCase().includes((query ?? "").toLowerCase()));
+	});
+	const select = (option) => {
+		const textarea = textareaRef.current;
+		if (!open || !textarea || composingRef.current || option.disabled || disabled || readOnly || textarea.value !== text) return;
+		const currentToken = findToken(text, textarea.selectionStart, textarea.selectionEnd, prefixes);
+		if (!currentToken || currentToken.start !== token?.start || currentToken.query !== token.query || currentToken.prefix !== option.prefix && option.prefix !== void 0) return;
+		const next = insertToken(text, currentToken, option.value);
+		pendingCaret.current = next;
+		setDismissed([signature, JSON.stringify([
+			next.value,
+			next.caret,
+			next.caret,
+			currentToken.prefix
+		])]);
+		setText(next.value);
+		onSelect?.(option, currentToken.prefix);
+	};
+	const { Autocomplete: Root, AutocompleteInput, AutocompleteContent, AutocompleteList, AutocompleteItem } = autocomplete_exports;
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "mentions",
+		dir: dir ?? direction,
+		className: cn("relative min-w-0", classNames?.root),
+		children: /* @__PURE__ */ jsxs(Root, {
+			items: loading ? [] : filtered,
+			filter: null,
+			value: text,
+			defaultValue,
+			onValueChange: (next, details) => {
+				if (details.reason === "item-press" || details.reason === "escape-key") {
+					details.cancel();
+					return;
+				}
+				pendingCaret.current = null;
+				setText(next);
+				if (textareaRef.current) syncSelection(textareaRef.current);
+			},
+			disabled,
+			readOnly,
+			name,
+			form,
+			open,
+			onOpenChange: (next) => {
+				if (!next) setDismissed([signature]);
+			},
+			itemToStringValue: (option) => option.value,
+			children: [/* @__PURE__ */ jsx(AutocompleteInput, { render: (inputProps) => {
+				const native = inputProps;
+				return /* @__PURE__ */ jsx(TextareaBridge, {
+					...native,
+					...props,
+					ref: mergedRef,
+					primitiveRef: native.ref,
+					dir: dir ?? direction,
+					"data-slot": "mentions-input",
+					className: cn(native.className, className),
+					onFocus: (event) => {
+						onFocus?.(event);
+						native.onFocus?.(event);
+						setFocused(true);
+						setDismissed([]);
+						syncSelection(event.currentTarget);
+					},
+					onBlur: (event) => {
+						onBlur?.(event);
+						native.onBlur?.(event);
+						setFocused(false);
+					},
+					onSelect: (event) => syncSelection(event.currentTarget),
+					onClick: (event) => {
+						onClick?.(event);
+						native.onClick?.(event);
+						syncSelection(event.currentTarget);
+					},
+					onKeyDown: (event) => {
+						onKeyDown?.(event);
+						if (event.defaultPrevented) return;
+						if (!open || composingRef.current || event.nativeEvent.isComposing || event.keyCode === 229 || event.key === "Home" || event.key === "End") return;
+						native.onKeyDown?.(event);
+					},
+					onKeyUp: (event) => {
+						onKeyUp?.(event);
+						native.onKeyUp?.(event);
+						syncSelection(event.currentTarget);
+					},
+					onCompositionStart: (event) => {
+						composingRef.current = true;
+						setComposing(true);
+						onCompositionStart?.(event);
+						native.onCompositionStart?.(event);
+					},
+					onCompositionEnd: (event) => {
+						composingRef.current = false;
+						setComposing(false);
+						onCompositionEnd?.(event);
+						native.onCompositionEnd?.(event);
+						syncSelection(event.currentTarget);
+					}
+				});
+			} }), /* @__PURE__ */ jsxs(AutocompleteContent, {
+				container,
+				dir: dir ?? direction,
+				className: classNames?.content,
+				children: [(loading || filtered.length === 0) && /* @__PURE__ */ jsx("div", {
+					role: "status",
+					className: cn("text-muted-foreground px-3 py-2 text-sm", classNames?.empty),
+					children: loading ? loadingText : emptyText
+				}), /* @__PURE__ */ jsx(AutocompleteList, {
+					className: cn("max-h-60 overflow-y-auto p-1", classNames?.list),
+					children: (option) => /* @__PURE__ */ jsx(AutocompleteItem, {
+						value: option,
+						disabled: option.disabled,
+						onMouseUp: (event) => event.preventBaseUIHandler(),
+						onClick: (event) => {
+							event.preventBaseUIHandler();
+							select(option);
+						},
+						className: cn(`data-highlighted:bg-accent
+                  data-highlighted:text-accent-foreground cursor-default
+                  rounded-sm px-2 py-1.5 text-sm [overflow-wrap:anywhere]
+                  outline-none data-disabled:opacity-50`, classNames?.option),
+						children: option.label ?? option.value
+					}, option.value)
+				})]
+			})]
+		})
+	});
+};
+//#endregion
+export { Mentions as default };
+
+//# sourceMappingURL=Mentions.mjs.map

package/dist/Mentions.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Mentions.mjs","names":["autocomplete"],"sources":["../src/components/atoms/mentions.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ComponentPropsWithRef,\n  type ReactNode,\n  type Ref,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport {\n  useControllableState,\n  useLatest,\n  useMergedRef,\n} from '@jbpark/use-hooks';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { autocomplete } from '../../core';\nimport Input from './input';\nimport { findToken, insertToken } from './mentions-token';\n\nexport interface Option {\n  /** Unique, non-empty token text without whitespace or the prefix. */\n  value: string;\n  label?: string;\n  prefix?: string;\n  disabled?: boolean;\n}\n\nexport interface Props extends Omit<\n  ComponentPropsWithRef<'textarea'>,\n  'children' | 'value' | 'defaultValue' | 'onChange' | 'onSelect'\n> {\n  options: readonly Option[];\n  value?: string;\n  defaultValue?: string;\n  onChange?: (value: string) => void;\n  onSelect?: (option: Option, prefix: string) => void;\n  onSearch?: (query: string, prefix: string) => void;\n  prefixes?: readonly string[];\n  filterOption?: false | ((query: string, option: Option) => boolean);\n  loading?: boolean;\n  loadingText?: ReactNode;\n  emptyText?: ReactNode;\n  container?: HTMLElement;\n  classNames?: {\n    root?: string;\n    content?: string;\n    list?: string;\n    option?: string;\n    empty?: string;\n  };\n}\n\nconst DEFAULT_PREFIXES = ['@'];\n\nfunction TextareaBridge({\n  primitiveRef,\n  ref,\n  ...props\n}: ComponentPropsWithRef<'textarea'> & {\n  primitiveRef?: Ref<HTMLTextAreaElement>;\n}) {\n  const mergedRef = useMergedRef(primitiveRef, ref);\n\n  return <Input.TextArea {...props} ref={mergedRef} />;\n}\n\nconst Mentions = ({\n  options,\n  value,\n  defaultValue = '',\n  onChange,\n  onSelect,\n  onSearch,\n  prefixes = DEFAULT_PREFIXES,\n  filterOption,\n  loading = false,\n  loadingText = 'Loading suggestions…',\n  emptyText = 'No suggestions',\n  container,\n  disabled,\n  readOnly,\n  name,\n  form,\n  className,\n  classNames,\n  dir,\n  ref,\n  onFocus,\n  onBlur,\n  onClick,\n  onKeyDown,\n  onKeyUp,\n  onCompositionStart,\n  onCompositionEnd,\n  ...props\n}: Props) => {\n  const { direction } = useConfig();\n  const textareaRef = useRef<HTMLTextAreaElement | null>(null);\n  const mergedRef = useMergedRef(ref, textareaRef);\n  const composingRef = useRef(false);\n  const pendingCaret = useRef<{ value: string; caret: number } | null>(null);\n  const [text, setText] = useControllableState<string>({\n    value,\n    defaultValue,\n    onChange,\n  });\n  const [focused, setFocused] = useState(false);\n  const [composing, setComposing] = useState(false);\n  const [selection, setSelection] = useState({ text: '', start: 0, end: 0 });\n  const [dismissed, setDismissed] = useState<readonly (string | null)[]>([]);\n  const token =\n    focused && !composing && !disabled && !readOnly && selection.text === text\n      ? findToken(text, selection.start, selection.end, prefixes)\n      : null;\n  const signature = token\n    ? JSON.stringify([text, selection.start, selection.end, token.prefix])\n    : null;\n  const open = token !== null && !dismissed.includes(signature);\n  const query = token?.query;\n  const prefix = token?.prefix;\n  const searchRef = useLatest(onSearch);\n\n  useEffect(() => {\n    if (query !== undefined && prefix !== undefined) {\n      searchRef.current?.(query, prefix);\n    }\n  }, [query, prefix, searchRef]);\n\n  useEffect(() => {\n    const pending = pendingCaret.current;\n    const textarea = textareaRef.current;\n\n    if (pending && textarea && text === pending.value) {\n      pendingCaret.current = null;\n\n      if (textarea.ownerDocument.activeElement === textarea) {\n        textarea.setSelectionRange(pending.caret, pending.caret);\n      }\n    }\n  });\n\n  const syncSelection = (textarea: HTMLTextAreaElement) => {\n    setSelection(previous => {\n      const next = {\n        text: textarea.value,\n        start: textarea.selectionStart,\n        end: textarea.selectionEnd,\n      };\n\n      return previous.text === next.text &&\n        previous.start === next.start &&\n        previous.end === next.end\n        ? previous\n        : next;\n    });\n  };\n  const filtered = options.filter(option => {\n    if (\n      !option.value ||\n      /\\s/u.test(option.value) ||\n      prefixes.some(\n        prefix => prefix.length > 0 && option.value.startsWith(prefix),\n      ) ||\n      (option.prefix !== undefined && option.prefix !== prefix)\n    ) {\n      return false;\n    }\n\n    if (filterOption === false) {\n      return true;\n    }\n\n    return filterOption\n      ? filterOption(query ?? '', option)\n      : [option.value, option.label ?? ''].some(label =>\n          label.toLowerCase().includes((query ?? '').toLowerCase()),\n        );\n  });\n  const select = (option: Option) => {\n    const textarea = textareaRef.current;\n\n    if (\n      !open ||\n      !textarea ||\n      composingRef.current ||\n      option.disabled ||\n      disabled ||\n      readOnly ||\n      textarea.value !== text\n    ) {\n      return;\n    }\n\n    const currentToken = findToken(\n      text,\n      textarea.selectionStart,\n      textarea.selectionEnd,\n      prefixes,\n    );\n\n    if (\n      !currentToken ||\n      currentToken.start !== token?.start ||\n      currentToken.query !== token.query ||\n      (currentToken.prefix !== option.prefix && option.prefix !== undefined)\n    ) {\n      return;\n    }\n\n    const next = insertToken(text, currentToken, option.value);\n\n    pendingCaret.current = next;\n    setDismissed([\n      signature,\n      JSON.stringify([next.value, next.caret, next.caret, currentToken.prefix]),\n    ]);\n    setText(next.value);\n    onSelect?.(option, currentToken.prefix);\n  };\n  const {\n    Autocomplete: Root,\n    AutocompleteInput,\n    AutocompleteContent,\n    AutocompleteList,\n    AutocompleteItem,\n  } = autocomplete;\n\n  return (\n    <div\n      data-slot=\"mentions\"\n      dir={dir ?? direction}\n      className={cn(\n        'relative min-w-0',\n        classNames?.root, //\n      )}\n    >\n      <Root\n        items={loading ? [] : filtered}\n        filter={null}\n        value={text}\n        defaultValue={defaultValue}\n        onValueChange={(next, details) => {\n          if (\n            details.reason === 'item-press' ||\n            details.reason === 'escape-key'\n          ) {\n            details.cancel();\n\n            return;\n          }\n\n          pendingCaret.current = null;\n          setText(next);\n\n          if (textareaRef.current) {\n            syncSelection(textareaRef.current);\n          }\n        }}\n        disabled={disabled}\n        readOnly={readOnly}\n        name={name}\n        form={form}\n        open={open}\n        onOpenChange={next => {\n          if (!next) {\n            setDismissed([signature]);\n          }\n        }}\n        itemToStringValue={option => option.value}\n      >\n        <AutocompleteInput\n          render={inputProps => {\n            // Base UI's input handlers use the shared text-control DOM contract.\n            // Adapt their input-only types while preserving the textarea atom.\n            const native =\n              inputProps as unknown as ComponentPropsWithRef<'textarea'>;\n\n            return (\n              <TextareaBridge\n                {...native}\n                {...props}\n                ref={mergedRef}\n                primitiveRef={native.ref}\n                dir={dir ?? direction}\n                data-slot=\"mentions-input\"\n                className={cn(\n                  native.className,\n                  className, //\n                )}\n                onFocus={event => {\n                  onFocus?.(event);\n                  native.onFocus?.(event);\n                  setFocused(true);\n                  setDismissed([]);\n                  syncSelection(event.currentTarget);\n                }}\n                onBlur={event => {\n                  onBlur?.(event);\n                  native.onBlur?.(event);\n                  setFocused(false);\n                }}\n                onSelect={event => syncSelection(event.currentTarget)}\n                onClick={event => {\n                  onClick?.(event);\n                  native.onClick?.(event);\n                  syncSelection(event.currentTarget);\n                }}\n                onKeyDown={event => {\n                  onKeyDown?.(event);\n\n                  if (event.defaultPrevented) {\n                    return;\n                  }\n\n                  if (\n                    !open ||\n                    composingRef.current ||\n                    event.nativeEvent.isComposing ||\n                    event.keyCode === 229 ||\n                    event.key === 'Home' ||\n                    event.key === 'End'\n                  ) {\n                    return;\n                  }\n\n                  native.onKeyDown?.(event);\n                }}\n                onKeyUp={event => {\n                  onKeyUp?.(event);\n                  native.onKeyUp?.(event);\n                  syncSelection(event.currentTarget);\n                }}\n                onCompositionStart={event => {\n                  composingRef.current = true;\n                  setComposing(true);\n                  onCompositionStart?.(event);\n                  native.onCompositionStart?.(event);\n                }}\n                onCompositionEnd={event => {\n                  composingRef.current = false;\n                  setComposing(false);\n                  onCompositionEnd?.(event);\n                  native.onCompositionEnd?.(event);\n                  syncSelection(event.currentTarget);\n                }}\n              />\n            );\n          }}\n        />\n        <AutocompleteContent\n          container={container}\n          dir={dir ?? direction}\n          className={classNames?.content}\n        >\n          {(loading || filtered.length === 0) && (\n            <div\n              role=\"status\"\n              className={cn(\n                'text-muted-foreground px-3 py-2 text-sm',\n                classNames?.empty, //\n              )}\n            >\n              {loading ? loadingText : emptyText}\n            </div>\n          )}\n          <AutocompleteList\n            className={cn(\n              'max-h-60 overflow-y-auto p-1',\n              classNames?.list, //\n            )}\n          >\n            {(option: Option) => (\n              <AutocompleteItem\n                key={option.value}\n                value={option}\n                disabled={option.disabled}\n                onMouseUp={event => event.preventBaseUIHandler()}\n                onClick={event => {\n                  event.preventBaseUIHandler();\n                  select(option);\n                }}\n                className={cn(\n                  `data-highlighted:bg-accent\n                  data-highlighted:text-accent-foreground cursor-default\n                  rounded-sm px-2 py-1.5 text-sm [overflow-wrap:anywhere]\n                  outline-none data-disabled:opacity-50`,\n                  classNames?.option, //\n                )}\n              >\n                {option.label ?? option.value}\n              </AutocompleteItem>\n            )}\n          </AutocompleteList>\n        </AutocompleteContent>\n      </Root>\n    </div>\n  );\n};\n\nexport default Mentions;\n"],"mappings":"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"}

package/dist/Menu.mjs

@@ -1,2 +1 @@
-import Menu, { MENU_CLASSNAMES, buildSelectionMap, findKey } from "./components/molecules/menu/menu.mjs";
-export { MENU_CLASSNAMES, buildSelectionMap, Menu as default, findKey };
+export { MENU_CLASSNAMES, buildSelectionMap, default, findKey } from "./components/molecules/menu/menu.mjs";

package/dist/{components/organisms/modal.d.mts → Modal.d.mts}

@@ -1,6 +1,6 @@
 import React from "react";
 //#region src/components/organisms/modal.d.ts
-interface Props {
+export interface Props {
   open?: boolean;
   maskClosable?: boolean;
   closable?: boolean | {
@@ -25,6 +25,8 @@ interface Props {
   children?: React.ReactNode;
   onOk?: () => void;
   onCancel?: () => void;
+  /** Called after the opening or closing animations finish. */
+  onOpenChangeComplete?: (open: boolean) => void;
 }
 type ModalStatus = 'info' | 'success' | 'error' | 'warning';
 interface StaticProps extends Props {
@@ -40,7 +42,8 @@ interface StaticProps extends Props {
   container?: HTMLElement;
 }
 declare const Modal: {
-  ({ open, maskClosable, closable, closeIcon, className, classNames, style, title, content, footer, container, children, okText, cancelText, onOk, onCancel, ...props }: Props): React.JSX.Element | null;
+  ({ open, maskClosable, closable, closeIcon, className, classNames, style, title, content, footer, container, children, okText, cancelText, onOk, onCancel, onOpenChangeComplete, ...props }: Props): React.JSX.Element | null;
+  /** Immediately removes a modal without waiting for its closing animation. */
   destroy: (id?: string) => void;
   destroyAll(): void;
   info(props: StaticProps): string | undefined;
@@ -50,5 +53,5 @@ declare const Modal: {
   confirm(props: StaticProps): string | undefined;
 };
 //#endregion
-export { Props, Modal as default };
-//# sourceMappingURL=modal.d.mts.map
+export { Modal as default };
+//# sourceMappingURL=Modal.d.mts.map

package/dist/Modal.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.mts","names":[],"sources":["../src/components/organisms/modal.tsx"],"mappings":";;iBAiCiB;EACf;EACA;EACA;IAGM,YAAY,MAAM;IAClB;;EAEN,YAAY,MAAM;EAClB,QAAQ,MAAM;EACd,UAAU,MAAM;EAChB,SAAS,MAAM;EACf;EACA;IACE;IACA;IACA;IACA;;EAEF,QAAQ,MAAM;EACd;EACA;EACA,YAAY;EACZ,WAAW,MAAM;EACjB;EACA;;EAEA,wBAAwB;;KAGrB;UAEK,oBAAoB;EAC5B,SAAS;;;;;;EAMT;EACA;EACA,OAAO,MAAM;EACb,YAAY;;cAGR;KAmBH,MAAA,cAAA,UAAA,WAAA,WAAA,YAAA,OAAA,OAAA,SAAA,QAAA,WAAA,UAAA,QAAA,YAAA,MAAA,UAAA,yBAAA,SAAA,QAAK,MAAA,IAAA;;;;EA2Oa,KAAA,OAAA;EAEG,QAAA,OAAA;EAEF,MAAA,OAAA;EAEE,QAAA,OAAA;EAIA,QAAA,OAAA"}

package/dist/{components/organisms/modal.mjs → Modal.mjs}

@@ -1,22 +1,23 @@
 "use client";
-import { cn } from "../../utils.mjs";
-import { DEFAULT_LOCALE, useConfig } from "../../providers/config/context.mjs";
-import { dialog_exports } from "../../core/dialog.mjs";
-import Button from "../../Button.mjs";
-import { createImperativeStack, isBrowser } from "./imperative-stack.mjs";
-import { Check, CircleQuestionMark, Info, OctagonAlert, OctagonX } from "lucide-react";
-import { useState } from "react";
+import { cn } from "./utils.mjs";
+import { DEFAULT_LOCALE, useConfig } from "./providers/config/context.mjs";
+import Button from "./Button.mjs";
+import { dialog_exports } from "./core/dialog.mjs";
+import { createImperativeStack, isBrowser } from "./components/organisms/imperative-stack.mjs";
+import { useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Check, CircleQuestionMark, Info, OctagonAlert, OctagonX } from "lucide-react";
 import { createPortal } from "react-dom";
 //#region src/components/organisms/modal.tsx
 const { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } = dialog_exports;
-const Modal = ({ open = false, maskClosable, closable = false, closeIcon, className, classNames, style, title, content, footer, container, children, okText, cancelText, onOk, onCancel, ...props }) => {
+const Modal = ({ open = false, maskClosable, closable = false, closeIcon, className, classNames, style, title, content, footer, container, children, okText, cancelText, onOk, onCancel, onOpenChangeComplete, ...props }) => {
 	const { locale, defaultProps } = useConfig();
 	const modalDefaults = defaultProps?.modal;
 	const resolvedMaskClosable = maskClosable ?? modalDefaults?.maskClosable ?? false;
 	if (typeof window === "undefined") return null;
 	return /* @__PURE__ */ jsx(Dialog, {
 		open,
+		onOpenChangeComplete,
 		onOpenChange: (open) => {
 			if (!open) onCancel?.();
 		},
@@ -44,13 +45,13 @@ const Modal = ({ open = false, maskClosable, closable = false, closeIcon, classN
 				footer !== null && /* @__PURE__ */ jsx(DialogFooter, {
 					className: cn("flex-row justify-end gap-x-2", classNames?.footer),
 					children: footer || /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
-						type: "primary",
-						onClick: onOk,
-						children: okText ?? locale.ok ?? DEFAULT_LOCALE.ok
-					}), /* @__PURE__ */ jsx(Button, {
 						variant: "outlined",
 						onClick: onCancel,
 						children: cancelText ?? locale.cancel ?? DEFAULT_LOCALE.cancel
+					}), /* @__PURE__ */ jsx(Button, {
+						type: "primary",
+						onClick: onOk,
+						children: okText ?? locale.ok ?? DEFAULT_LOCALE.ok
 					})] })
 				})
 			]
@@ -64,31 +65,31 @@ const STATIC_ICONS = {
 	warning: /* @__PURE__ */ jsx(OctagonAlert, { className: "text-yellow-400" }),
 	confirm: /* @__PURE__ */ jsx(CircleQuestionMark, {})
 };
-const StaticModal = ({ id, status, mode, title, content, okText, cancelText, container, icon, onOk, onCancel, ...props }) => {
+const StaticModal = ({ id, status, mode, title, content, okText, cancelText, container, icon, onOk, onCancel, onOpenChangeComplete, ...props }) => {
 	const { locale } = useConfig();
 	const [open, setOpen] = useState(true);
+	const closing = useRef(false);
 	const resolvedOkText = okText ?? locale.ok ?? DEFAULT_LOCALE.ok;
 	const resolvedCancelText = cancelText ?? locale.cancel ?? DEFAULT_LOCALE.cancel;
 	const isConfirm = mode === "confirm";
 	const closeModal = (callback) => {
-		callback?.();
+		if (closing.current) return;
+		closing.current = true;
 		setOpen(false);
-		setTimeout(() => {
-			modalStack.destroy(id);
-		}, 200);
+		callback?.();
 	};
 	const footer = isConfirm ? /* @__PURE__ */ jsxs("div", {
 		className: "grid w-full grid-cols-5 gap-x-2",
 		children: [/* @__PURE__ */ jsx(Button, {
-			type: "primary",
-			className: "col-span-3",
-			onClick: () => closeModal(onOk),
-			children: resolvedOkText
-		}), /* @__PURE__ */ jsx(Button, {
 			variant: "outlined",
 			className: "col-span-2",
 			onClick: () => closeModal(onCancel),
 			children: resolvedCancelText
+		}), /* @__PURE__ */ jsx(Button, {
+			type: "primary",
+			className: "col-span-3",
+			onClick: () => closeModal(onOk),
+			children: resolvedOkText
 		})]
 	}) : /* @__PURE__ */ jsx(Button, {
 		type: "primary",
@@ -113,6 +114,10 @@ const StaticModal = ({ id, status, mode, title, content, okText, cancelText, con
 		container,
 		onCancel: () => closeModal(onCancel),
 		...props,
+		onOpenChangeComplete: (open) => {
+			if (!open) modalStack.destroy(id);
+			onOpenChangeComplete?.(open);
+		},
 		children: content
 	}), modalStack.getRootElement(container));
 };
@@ -125,7 +130,9 @@ const modalStack = createImperativeStack({
 	},
 	StackItem: StaticModal
 });
+/** Immediately removes a modal without waiting for its closing animation. */
 Modal.destroy = modalStack.destroy;
+/** Immediately removes all modals, including those currently closing. */
 Modal.destroyAll = () => {
 	modalStack.destroy();
 };
@@ -152,4 +159,4 @@ Modal.confirm = (props) => modalStack.render({
 //#endregion
 export { Modal as default };
 
-//# sourceMappingURL=modal.mjs.map
+//# sourceMappingURL=Modal.mjs.map