@jbpark/ui-kit 10.3.0 → 10.4.0

package/dist/ToggleGroup.mjs

@@ -0,0 +1,58 @@
+"use client";
+import { cn } from "./utils.mjs";
+import { useConfig } from "./providers/config/context.mjs";
+import Button from "./Button.mjs";
+import { useControllableState } from "@jbpark/use-hooks";
+import { DirectionProvider } from "@base-ui/react/direction-provider";
+import { jsx } from "react/jsx-runtime";
+import { Toggle } from "@base-ui/react/toggle";
+import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
+//#region src/components/atoms/toggle-group.tsx
+const ToggleGroup = ({ options, value, defaultValue = [], onChange, size, disabled, orientation = "horizontal", dir, className, classNames, ...props }) => {
+	const { componentSize, direction } = useConfig();
+	const [pressed, setPressed] = useControllableState({
+		value,
+		defaultValue,
+		onChange: (values) => onChange?.([...values])
+	});
+	const resolvedSize = size ?? componentSize ?? "middle";
+	const resolvedDirection = dir ?? direction;
+	const pressedSet = new Set(pressed);
+	const optionValues = new Set(options.map((option) => option.value));
+	const handleValueChange = (values) => {
+		const next = new Set(values);
+		setPressed([...options.filter((option) => next.has(option.value)).map((option) => option.value), ...[...new Set(pressed)].filter((item) => !optionValues.has(item))]);
+	};
+	return /* @__PURE__ */ jsx(DirectionProvider, {
+		direction: resolvedDirection,
+		children: /* @__PURE__ */ jsx(ToggleGroup$1, {
+			...props,
+			"data-slot": "toggle-group",
+			dir: resolvedDirection,
+			multiple: true,
+			disabled,
+			orientation,
+			value: [...pressedSet],
+			onValueChange: handleValueChange,
+			className: cn("inline-flex w-fit gap-1 data-[orientation=vertical]:flex-col", className),
+			children: options.map((option) => /* @__PURE__ */ jsx(Toggle, {
+				value: option.value,
+				disabled: option.disabled,
+				"aria-label": option.iconOnly ? option.label : void 0,
+				render: /* @__PURE__ */ jsx(Button, {
+					variant: "text",
+					size: resolvedSize,
+					shape: option.iconOnly ? "circle" : "default",
+					icon: option.icon
+				}),
+				className: cn(`data-pressed:bg-accent data-pressed:text-accent-foreground
+              aria-disabled:cursor-not-allowed`, classNames?.item, pressedSet.has(option.value) && classNames?.pressedItem),
+				children: option.iconOnly ? null : option.label
+			}, option.value))
+		})
+	});
+};
+//#endregion
+export { ToggleGroup as default };
+
+//# sourceMappingURL=ToggleGroup.mjs.map

package/dist/ToggleGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleGroup.mjs","names":["ToggleGroupPrimitive"],"sources":["../src/components/atoms/toggle-group.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\n\nimport { DirectionProvider } from '@base-ui/react/direction-provider';\nimport { Toggle } from '@base-ui/react/toggle';\nimport { ToggleGroup as ToggleGroupPrimitive } from '@base-ui/react/toggle-group';\nimport { useControllableState } from '@jbpark/use-hooks';\n\nimport { type ComponentSize, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from './button';\n\nexport interface Option {\n  value: string;\n  label: string;\n  icon?: ReactNode;\n  disabled?: boolean;\n  // Shows only the icon; the label stays the button's accessible name.\n  iconOnly?: boolean;\n}\n\nexport interface Props extends Omit<\n  ToggleGroupPrimitive.Props,\n  | 'children'\n  | 'value'\n  | 'defaultValue'\n  | 'onValueChange'\n  | 'multiple'\n  | 'className'\n  | 'onChange'\n  | 'dir'\n> {\n  options: readonly Option[];\n  value?: readonly string[];\n  defaultValue?: readonly string[];\n  // Receives pressed values in option order, followed by supplied values that\n  // match no option.\n  onChange?: (values: string[]) => void;\n  size?: ComponentSize;\n  dir?: 'ltr' | 'rtl';\n  className?: string;\n  classNames?: {\n    item?: string;\n    pressedItem?: string;\n  };\n}\n\nconst ToggleGroup = ({\n  options,\n  value,\n  defaultValue = [],\n  onChange,\n  size,\n  disabled,\n  orientation = 'horizontal',\n  dir,\n  className,\n  classNames,\n  ...props\n}: Props) => {\n  const { componentSize, direction } = useConfig();\n  const [pressed, setPressed] = useControllableState<readonly string[]>({\n    value,\n    defaultValue,\n    onChange: values => onChange?.([...values]),\n  });\n\n  const resolvedSize = size ?? componentSize ?? 'middle';\n  const resolvedDirection = dir ?? direction;\n  const pressedSet = new Set(pressed);\n  const optionValues = new Set(options.map(option => option.value));\n\n  const handleValueChange = (values: string[]) => {\n    const next = new Set(values);\n\n    setPressed([\n      ...options\n        .filter(option => next.has(option.value))\n        .map(option => option.value),\n      ...[...new Set(pressed)].filter(item => !optionValues.has(item)),\n    ]);\n  };\n\n  return (\n    <DirectionProvider direction={resolvedDirection}>\n      <ToggleGroupPrimitive\n        {...props}\n        data-slot=\"toggle-group\"\n        dir={resolvedDirection}\n        multiple\n        disabled={disabled}\n        orientation={orientation}\n        value={[...pressedSet]}\n        onValueChange={handleValueChange}\n        className={cn(\n          'inline-flex w-fit gap-1 data-[orientation=vertical]:flex-col',\n          className, //\n        )}\n      >\n        {options.map(option => (\n          <Toggle\n            key={option.value}\n            value={option.value}\n            disabled={option.disabled}\n            aria-label={option.iconOnly ? option.label : undefined}\n            render={\n              <Button\n                variant=\"text\"\n                size={resolvedSize}\n                shape={option.iconOnly ? 'circle' : 'default'}\n                icon={option.icon}\n              />\n            }\n            className={cn(\n              `data-pressed:bg-accent data-pressed:text-accent-foreground\n              aria-disabled:cursor-not-allowed`,\n              classNames?.item,\n              pressedSet.has(option.value) && classNames?.pressedItem,\n              //\n            )}\n          >\n            {option.iconOnly ? null : option.label}\n          </Toggle>\n        ))}\n      </ToggleGroupPrimitive>\n    </DirectionProvider>\n  );\n};\n\nexport default ToggleGroup;\n"],"mappings":";;;;;;;;;;AAiDA,MAAM,eAAe,EACnB,SACA,OACA,eAAe,CAAC,GAChB,UACA,MACA,UACA,cAAc,cACd,KACA,WACA,YACA,GAAG,YACQ;CACX,MAAM,EAAE,eAAe,cAAc,UAAU;CAC/C,MAAM,CAAC,SAAS,cAAc,qBAAwC;EACpE;EACA;EACA,WAAU,WAAU,WAAW,CAAC,GAAG,MAAM,CAAC;CAC5C,CAAC;CAED,MAAM,eAAe,QAAQ,iBAAiB;CAC9C,MAAM,oBAAoB,OAAO;CACjC,MAAM,aAAa,IAAI,IAAI,OAAO;CAClC,MAAM,eAAe,IAAI,IAAI,QAAQ,KAAI,WAAU,OAAO,KAAK,CAAC;CAEhE,MAAM,qBAAqB,WAAqB;EAC9C,MAAM,OAAO,IAAI,IAAI,MAAM;EAE3B,WAAW,CACT,GAAG,QACA,QAAO,WAAU,KAAK,IAAI,OAAO,KAAK,CAAC,CAAC,CACxC,KAAI,WAAU,OAAO,KAAK,GAC7B,GAAG,CAAC,GAAG,IAAI,IAAI,OAAO,CAAC,CAAC,CAAC,QAAO,SAAQ,CAAC,aAAa,IAAI,IAAI,CAAC,CACjE,CAAC;CACH;CAEA,OACE,oBAAC,mBAAD;EAAmB,WAAW;EAC5B,UAAA,oBAACA,eAAD;GACE,GAAI;GACJ,aAAU;GACV,KAAK;GACL,UAAA;GACU;GACG;GACb,OAAO,CAAC,GAAG,UAAU;GACrB,eAAe;GACf,WAAW,GACT,gEACA,SACF;GAEC,UAAA,QAAQ,KAAI,WACX,oBAAC,QAAD;IAEE,OAAO,OAAO;IACd,UAAU,OAAO;IACjB,cAAY,OAAO,WAAW,OAAO,QAAQ,KAAA;IAC7C,QACE,oBAAC,QAAD;KACE,SAAQ;KACR,MAAM;KACN,OAAO,OAAO,WAAW,WAAW;KACpC,MAAM,OAAO;IACd,CAAA;IAEH,WAAW,GACT;iDAEA,YAAY,MACZ,WAAW,IAAI,OAAO,KAAK,KAAK,YAAY,WAE9C;IAEC,UAAA,OAAO,WAAW,OAAO,OAAO;GAC3B,GArBD,OAAO,KAqBN,CACT;EACmB,CAAA;CACL,CAAA;AAEvB"}

package/dist/{components/atoms/tooltip.d.mts → Tooltip.d.mts}

@@ -18,4 +18,4 @@ export interface Props extends Omit<React.ComponentProps<typeof Core>, 'children
 declare const Tooltip: ({ children, content, className, placement, offset, delay, closeDelay, ...props }: Props) => import("react").JSX.Element;
 //#endregion
 export { Tooltip as default };
-//# sourceMappingURL=tooltip.d.mts.map
+//# sourceMappingURL=Tooltip.d.mts.map

package/dist/Tooltip.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.d.mts","names":[],"sources":["../src/components/atoms/tooltip.tsx"],"mappings":";;cAMiB,OAAI,SAAA,gCAAA,YAAA,MAAA,aAAA,MAAA,IAAA;KAEhB;iBAgCY,cAAc,KAC7B,MAAM,sBAAsB;EAG5B,UAAU;;EAEV,SAAS;;EAET;EACA,YAAY;;EAEZ;;EAEA;EACA;;cAGI,YAAW,UAAA,SAAA,WAAA,WAAA,QAAA,OAAA,eAAA,SASd,0BAAK,IAAA"}

package/dist/{components/atoms/tooltip.mjs → Tooltip.mjs}

@@ -1,5 +1,5 @@
 "use client";
-import { tooltip_exports } from "../../core/tooltip.mjs";
+import { tooltip_exports } from "./core/tooltip.mjs";
 import { Children } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/atoms/tooltip.tsx
@@ -75,4 +75,4 @@ const Tooltip = ({ children, content, className, placement = "top", offset = 8,
 //#endregion
 export { Tooltip as default };
 
-//# sourceMappingURL=tooltip.mjs.map
+//# sourceMappingURL=Tooltip.mjs.map

package/dist/Tooltip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.mjs","names":["tooltip"],"sources":["../src/components/atoms/tooltip.tsx"],"sourcesContent":["'use client';\n\nimport { Children, type ReactElement, type ReactNode } from 'react';\n\nimport { tooltip } from '../../core';\n\nconst { Tooltip: Core, TooltipContent, TooltipTrigger } = tooltip;\n\ntype Placement =\n  | 'top'\n  | 'left'\n  | 'right'\n  | 'bottom'\n  | 'topLeft'\n  | 'topRight'\n  | 'bottomLeft'\n  | 'bottomRight'\n  | 'leftTop'\n  | 'leftBottom'\n  | 'rightTop'\n  | 'rightBottom';\n\ntype Side = NonNullable<React.ComponentProps<typeof TooltipContent>['side']>;\ntype Align = NonNullable<React.ComponentProps<typeof TooltipContent>['align']>;\n\nconst placementMap: Record<Placement, { side: Side; align: Align }> = {\n  top: { side: 'top', align: 'center' },\n  left: { side: 'left', align: 'center' },\n  right: { side: 'right', align: 'center' },\n  bottom: { side: 'bottom', align: 'center' },\n  topLeft: { side: 'top', align: 'start' },\n  topRight: { side: 'top', align: 'end' },\n  bottomLeft: { side: 'bottom', align: 'start' },\n  bottomRight: { side: 'bottom', align: 'end' },\n  leftTop: { side: 'left', align: 'start' },\n  leftBottom: { side: 'left', align: 'end' },\n  rightTop: { side: 'right', align: 'start' },\n  rightBottom: { side: 'right', align: 'end' },\n};\n\nexport interface Props extends Omit<\n  React.ComponentProps<typeof Core>,\n  'children' | 'handle' | 'triggerId' | 'defaultTriggerId'\n> {\n  children: ReactElement;\n  /** Supplementary visual hint; keep essential information visible elsewhere. */\n  content: ReactNode;\n  /** Popup class; the child retains its own className. */\n  className?: string;\n  placement?: Placement;\n  /** Distance between the trigger and popup in pixels. */\n  offset?: number;\n  /** Hover delay in milliseconds. Keyboard focus opens without this delay. */\n  delay?: number;\n  closeDelay?: number;\n}\n\nconst Tooltip = ({\n  children,\n  content,\n  className,\n  placement = 'top',\n  offset = 8,\n  delay,\n  closeDelay,\n  ...props\n}: Props) => {\n  const trigger = Children.only(children);\n  const { side, align } = placementMap[placement];\n\n  return (\n    <Core {...props}>\n      <TooltipTrigger render={trigger} delay={delay} closeDelay={closeDelay} />\n      <TooltipContent\n        side={side}\n        align={align}\n        sideOffset={offset}\n        className={className}\n      >\n        {content}\n      </TooltipContent>\n    </Core>\n  );\n};\n\nexport default Tooltip;\n"],"mappings":";;;;;AAMA,MAAM,EAAE,SAAS,MAAM,gBAAgB,mBAAmBA;AAmB1D,MAAM,eAAgE;CACpE,KAAK;EAAE,MAAM;EAAO,OAAO;CAAS;CACpC,MAAM;EAAE,MAAM;EAAQ,OAAO;CAAS;CACtC,OAAO;EAAE,MAAM;EAAS,OAAO;CAAS;CACxC,QAAQ;EAAE,MAAM;EAAU,OAAO;CAAS;CAC1C,SAAS;EAAE,MAAM;EAAO,OAAO;CAAQ;CACvC,UAAU;EAAE,MAAM;EAAO,OAAO;CAAM;CACtC,YAAY;EAAE,MAAM;EAAU,OAAO;CAAQ;CAC7C,aAAa;EAAE,MAAM;EAAU,OAAO;CAAM;CAC5C,SAAS;EAAE,MAAM;EAAQ,OAAO;CAAQ;CACxC,YAAY;EAAE,MAAM;EAAQ,OAAO;CAAM;CACzC,UAAU;EAAE,MAAM;EAAS,OAAO;CAAQ;CAC1C,aAAa;EAAE,MAAM;EAAS,OAAO;CAAM;AAC7C;AAmBA,MAAM,WAAW,EACf,UACA,SACA,WACA,YAAY,OACZ,SAAS,GACT,OACA,YACA,GAAG,YACQ;CACX,MAAM,UAAU,SAAS,KAAK,QAAQ;CACtC,MAAM,EAAE,MAAM,UAAU,aAAa;CAErC,OACE,qBAAC,MAAD;EAAM,GAAI;EAAV,UAAA,CACE,oBAAC,gBAAD;GAAgB,QAAQ;GAAgB;GAAmB;EAAa,CAAA,GACxE,oBAAC,gBAAD;GACQ;GACC;GACP,YAAY;GACD;GAEV,UAAA;EACa,CAAA,CACZ;;AAEV"}

package/dist/Tour.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Tour.d.mts","names":[],"sources":["../src/components/organisms/tour.tsx"],"mappings":";;iBAmBiB;EACf;EACA,OAAO;EACP,cAAc;;EAEd,eAAe;EACf;;iBAGe,cAAc,KAC7B;EAGA,gBAAgB;EAChB;EACA;EACA,gBAAgB;EAChB;EACA;EACA,YAAY;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBAAkB,iBAAiB;EACnC;IACE;IACA;IACA;IACA;;;cAOE,SAAQ,OAAA,MAAA,UAAA,aAAA,cAAA,SAAA,aAAA,gBAAA,UAAA,SAAA,UAAA,gBAAA,eAAA,WAAA,aAAA,YAAA,gBAAA,WAAA,eAAA,SAmBX,0BAAK,IAAA"}
+{"version":3,"file":"Tour.d.mts","names":[],"sources":["../src/components/organisms/tour.tsx"],"mappings":";;iBAmBiB;EACf;EACA,OAAO;EACP,cAAc;;EAEd,eAAe;EACf;;iBAGe,cAAc,KAC7B;EAGA,gBAAgB;EAChB;EACA;EACA,gBAAgB;EAChB;EACA;EACA,YAAY;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBAAkB,iBAAiB;EACnC;IACE;IACA;IACA;IACA;;;cA6DE,SAAQ,OAAA,MAAA,UAAA,aAAA,cAAA,SAAA,aAAA,gBAAA,UAAA,SAAA,UAAA,gBAAA,eAAA,WAAA,aAAA,YAAA,gBAAA,WAAA,eAAA,SAmBX,0BAAK,IAAA"}

package/dist/Tour.mjs

@@ -5,9 +5,45 @@ import { OVERLAY_LAYER } from "./lib/z-layers.mjs";
 import Button from "./Button.mjs";
 import { Popover, PopoverArrow, PopoverBackdrop, PopoverClose, PopoverContent, PopoverDescription, PopoverPortal, PopoverTitle } from "./core/popover.mjs";
 import { useEffect, useMemo, useState } from "react";
-import { useControllableState } from "@jbpark/use-hooks";
+import { useControllableState, useElementPosition } from "@jbpark/use-hooks";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/organisms/tour.tsx
+const TARGET_MUTATION = {
+	attributes: true,
+	attributeFilter: [
+		"hidden",
+		"style",
+		"class"
+	]
+};
+const measureVisible = (element) => element.isConnected && element.getClientRects().length > 0 && getComputedStyle(element).visibility !== "hidden" ? element.getBoundingClientRect() : null;
+const StepTarget = ({ index, step, scrollIntoView, onMeasure }) => {
+	const { rect, element } = useElementPosition(() => step.target?.() ?? null, {
+		withElement: true,
+		measure: measureVisible,
+		mutation: TARGET_MUTATION
+	});
+	useEffect(() => {
+		if (element && scrollIntoView) element.scrollIntoView({
+			block: "center",
+			inline: "nearest",
+			behavior: "instant"
+		});
+	}, [element, scrollIntoView]);
+	useEffect(() => {
+		onMeasure({
+			index,
+			target: element,
+			rect
+		});
+	}, [
+		onMeasure,
+		index,
+		element,
+		rect
+	]);
+	return null;
+};
 const defaultFormatProgress = (current, total) => `Step ${current} of ${total}`;
 const Tour = ({ steps, open: openProp, defaultOpen = false, onOpenChange, current: currentProp, defaultCurrent = 0, onChange, onClose, onFinish, scrollIntoView = true, previousLabel = "Previous", nextLabel = "Next", finishLabel = "Finish", closeLabel = "Close tour", formatProgress = defaultFormatProgress, className, classNames, ...props }) => {
 	const { getContainer, direction } = useConfig();
@@ -24,76 +60,23 @@ const Tour = ({ steps, open: openProp, defaultOpen = false, onOpenChange, curren
 	const index = Number.isFinite(current) ? Math.max(0, Math.min(steps.length - 1, Math.floor(current))) : 0;
 	const step = steps[index];
 	const [measurement, setMeasurement] = useState(null);
-	const target = open && measurement && measurement.step === step ? measurement.target : null;
-	const rect = open && measurement && measurement.step === step ? measurement.rect : null;
+	const target = open && measurement && measurement.index === index ? measurement.target : null;
+	const rect = open && measurement && measurement.index === index ? measurement.rect : null;
 	const fallback = useMemo(() => ({ getBoundingClientRect: () => new DOMRect(window.innerWidth / 2, window.innerHeight / 2, 0, 0) }), []);
-	useEffect(() => {
-		if (!open || !step) return;
-		let previous = null;
-		const update = () => {
-			const element = step.target?.() ?? null;
-			const resolved = !!element?.isConnected && element.getClientRects().length > 0 && getComputedStyle(element).visibility !== "hidden" ? element : null;
-			if (resolved !== previous) {
-				if (previous) resizeObserver.unobserve(previous);
-				if (resolved) {
-					resizeObserver.observe(resolved);
-					if (scrollIntoView) resolved.scrollIntoView({
-						block: "center",
-						inline: "nearest",
-						behavior: "instant"
-					});
-				}
-			}
-			previous = resolved;
-			const bounds = resolved?.getBoundingClientRect();
-			const next = bounds ? {
-				top: bounds.top,
-				left: bounds.left,
-				width: bounds.width,
-				height: bounds.height
-			} : null;
-			setMeasurement((existing) => existing?.step === step && existing.target === resolved && existing.rect?.top === next?.top && existing.rect?.left === next?.left && existing.rect?.width === next?.width && existing.rect?.height === next?.height ? existing : {
-				step,
-				target: resolved,
-				rect: next
-			});
-		};
-		const frame = requestAnimationFrame(update);
-		const observer = new MutationObserver(update);
-		observer.observe(document.body, {
-			childList: true,
-			subtree: true,
-			attributes: true,
-			attributeFilter: [
-				"hidden",
-				"style",
-				"class"
-			]
-		});
-		const resizeObserver = new ResizeObserver(update);
-		window.addEventListener("resize", update);
-		window.addEventListener("scroll", update, true);
-		return () => {
-			cancelAnimationFrame(frame);
-			observer.disconnect();
-			resizeObserver.disconnect();
-			window.removeEventListener("resize", update);
-			window.removeEventListener("scroll", update, true);
-		};
-	}, [
-		open,
-		step,
-		scrollIntoView
-	]);
 	const close = () => {
 		onClose?.();
 		setOpen(false);
 	};
-	return /* @__PURE__ */ jsx("div", {
+	return /* @__PURE__ */ jsxs("div", {
 		...props,
 		"data-slot": "tour",
 		className: cn("contents", className),
-		children: /* @__PURE__ */ jsxs(Popover, {
+		children: [open && step && /* @__PURE__ */ jsx(StepTarget, {
+			index,
+			step,
+			scrollIntoView,
+			onMeasure: setMeasurement
+		}, index), /* @__PURE__ */ jsxs(Popover, {
 			open: open && !!step,
 			modal: true,
 			onOpenChange: (next, details) => {
@@ -183,7 +166,7 @@ const Tour = ({ steps, open: openProp, defaultOpen = false, onOpenChange, curren
 					target && /* @__PURE__ */ jsx(PopoverArrow, {})
 				]
 			})]
-		})
+		})]
 	});
 };
 //#endregion

package/dist/Tour.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tour.mjs","names":["popover.Popover","popover.PopoverPortal","popover.PopoverBackdrop","popover.PopoverContent","popover.PopoverTitle","popover.PopoverDescription","popover.PopoverClose","popover.PopoverArrow"],"sources":["../src/components/organisms/tour.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ComponentPropsWithRef,\n  type ReactNode,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { useControllableState } from '@jbpark/use-hooks';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { popover } from '../../core';\nimport { OVERLAY_LAYER } from '../../lib/z-layers';\nimport Button from '../atoms/button';\n\nexport interface Step {\n  key: string;\n  title: ReactNode;\n  description?: ReactNode;\n  /** Resolved after hydration. Missing/hidden targets use a centered popup. */\n  target?: () => HTMLElement | null;\n  placement?: 'top' | 'bottom' | 'left' | 'right';\n}\n\nexport interface Props extends Omit<\n  ComponentPropsWithRef<'div'>,\n  'children' | 'onChange'\n> {\n  steps: readonly Step[];\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  current?: number;\n  defaultCurrent?: number;\n  onChange?: (current: number) => void;\n  onClose?: () => void;\n  onFinish?: () => void;\n  scrollIntoView?: boolean;\n  previousLabel?: string;\n  nextLabel?: string;\n  finishLabel?: string;\n  closeLabel?: string;\n  formatProgress?: (current: number, total: number) => string;\n  classNames?: {\n    popup?: string;\n    mask?: string;\n    highlight?: string;\n    actions?: string;\n  };\n}\n\nconst defaultFormatProgress = (current: number, total: number) =>\n  `Step ${current} of ${total}`;\n\nconst Tour = ({\n  steps,\n  open: openProp,\n  defaultOpen = false,\n  onOpenChange,\n  current: currentProp,\n  defaultCurrent = 0,\n  onChange,\n  onClose,\n  onFinish,\n  scrollIntoView = true,\n  previousLabel = 'Previous',\n  nextLabel = 'Next',\n  finishLabel = 'Finish',\n  closeLabel = 'Close tour',\n  formatProgress = defaultFormatProgress,\n  className,\n  classNames,\n  ...props\n}: Props) => {\n  const { getContainer, direction } = useConfig();\n  const [open, setOpen] = useControllableState({\n    value: openProp,\n    defaultValue: defaultOpen,\n    onChange: onOpenChange,\n  });\n  const [current, setCurrent] = useControllableState({\n    value: currentProp,\n    defaultValue: defaultCurrent,\n    onChange,\n  });\n  const index = Number.isFinite(current)\n    ? Math.max(0, Math.min(steps.length - 1, Math.floor(current)))\n    : 0;\n  const step = steps[index];\n  const [measurement, setMeasurement] = useState<{\n    step: Step;\n    target: HTMLElement | null;\n    rect: { top: number; left: number; width: number; height: number } | null;\n  } | null>(null);\n  const target =\n    open && measurement && measurement.step === step\n      ? measurement.target\n      : null;\n  const rect =\n    open && measurement && measurement.step === step ? measurement.rect : null;\n  const fallback = useMemo(\n    () => ({\n      getBoundingClientRect: () =>\n        new DOMRect(window.innerWidth / 2, window.innerHeight / 2, 0, 0),\n    }),\n    [],\n  );\n\n  useEffect(() => {\n    if (!open || !step) return;\n\n    let previous: HTMLElement | null = null;\n    const update = () => {\n      const element = step.target?.() ?? null;\n      const isVisible =\n        !!element?.isConnected &&\n        element.getClientRects().length > 0 &&\n        getComputedStyle(element).visibility !== 'hidden';\n      const resolved = isVisible ? element : null;\n\n      if (resolved !== previous) {\n        if (previous) resizeObserver.unobserve(previous);\n\n        if (resolved) {\n          resizeObserver.observe(resolved);\n\n          if (scrollIntoView) {\n            resolved.scrollIntoView({\n              block: 'center',\n              inline: 'nearest',\n              behavior: 'instant',\n            });\n          }\n        }\n      }\n\n      previous = resolved;\n      const bounds = resolved?.getBoundingClientRect();\n      const next = bounds\n        ? {\n            top: bounds.top,\n            left: bounds.left,\n            width: bounds.width,\n            height: bounds.height,\n          }\n        : null;\n\n      setMeasurement(existing =>\n        existing?.step === step &&\n        existing.target === resolved &&\n        existing.rect?.top === next?.top &&\n        existing.rect?.left === next?.left &&\n        existing.rect?.width === next?.width &&\n        existing.rect?.height === next?.height\n          ? existing\n          : { step, target: resolved, rect: next },\n      );\n    };\n\n    const frame = requestAnimationFrame(update);\n    const observer = new MutationObserver(update);\n    observer.observe(document.body, {\n      childList: true,\n      subtree: true,\n      attributes: true,\n      attributeFilter: ['hidden', 'style', 'class'],\n    });\n    const resizeObserver = new ResizeObserver(update);\n\n    window.addEventListener('resize', update);\n    window.addEventListener('scroll', update, true);\n\n    return () => {\n      cancelAnimationFrame(frame);\n      observer.disconnect();\n      resizeObserver.disconnect();\n      window.removeEventListener('resize', update);\n      window.removeEventListener('scroll', update, true);\n    };\n  }, [open, step, scrollIntoView]);\n\n  const close = () => {\n    onClose?.();\n    setOpen(false);\n  };\n\n  return (\n    <div\n      {...props}\n      data-slot=\"tour\"\n      className={cn(\n        'contents',\n        className, //\n      )}\n    >\n      <popover.Popover\n        open={open && !!step}\n        modal\n        onOpenChange={(next, details) => {\n          if (details.reason === 'outside-press') {\n            details.cancel();\n\n            return;\n          }\n\n          if (!next) close();\n        }}\n      >\n        <popover.PopoverPortal container={getContainer()}>\n          <popover.PopoverBackdrop\n            data-slot=\"tour-mask\"\n            className={cn(\n              'fixed inset-0 bg-black/40',\n              OVERLAY_LAYER,\n              classNames?.mask, //\n            )}\n          />\n          {open && rect && (\n            <div\n              data-slot=\"tour-highlight\"\n              aria-hidden=\"true\"\n              style={{\n                position: 'fixed',\n                top: rect.top - 4,\n                left: rect.left - 4,\n                width: rect.width + 8,\n                height: rect.height + 8,\n              }}\n              className={cn(\n                'border-primary pointer-events-none rounded-md border-2',\n                OVERLAY_LAYER,\n                classNames?.highlight, //\n              )}\n            />\n          )}\n        </popover.PopoverPortal>\n        <popover.PopoverContent\n          data-slot=\"tour-popup\"\n          dir={props.dir ?? direction}\n          anchor={target ?? fallback}\n          side={step?.placement ?? 'bottom'}\n          sideOffset={12}\n          positionerStyle={\n            target\n              ? undefined\n              : {\n                  position: 'fixed',\n                  left: '50%',\n                  top: '50%',\n                  transform: 'translate(-50%, -50%)',\n                }\n          }\n          className={cn(\n            `max-h-[calc(100dvh-2rem)] w-80 max-w-[calc(100vw-2rem)]\n            overflow-y-auto`,\n            classNames?.popup, //\n          )}\n        >\n          <popover.PopoverTitle>{step?.title}</popover.PopoverTitle>\n          {step?.description != null && (\n            <popover.PopoverDescription className=\"mt-2 text-sm\">\n              {step.description}\n            </popover.PopoverDescription>\n          )}\n          <p\n            data-slot=\"tour-progress\"\n            role=\"status\"\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n            className=\"text-muted-foreground mt-3 text-xs\"\n          >\n            {formatProgress(index + 1, steps.length)}\n          </p>\n          <div\n            className={cn(\n              'mt-4 flex flex-wrap gap-2',\n              classNames?.actions, //\n            )}\n          >\n            <popover.PopoverClose\n              render={<Button variant=\"text\" size=\"small\" />}\n            >\n              {closeLabel}\n            </popover.PopoverClose>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={index === 0}\n              focusableWhenDisabled\n              className=\"aria-disabled:pointer-events-none\n                aria-disabled:opacity-50\"\n              onClick={() => setCurrent(index - 1)}\n            >\n              {previousLabel}\n            </Button>\n            <Button\n              size=\"small\"\n              onClick={() => {\n                if (index < steps.length - 1) {\n                  setCurrent(index + 1);\n                } else {\n                  onFinish?.();\n                  setOpen(false);\n                }\n              }}\n            >\n              {index === steps.length - 1 ? finishLabel : nextLabel}\n            </Button>\n          </div>\n          {target && <popover.PopoverArrow />}\n        </popover.PopoverContent>\n      </popover.Popover>\n    </div>\n  );\n};\n\nexport default Tour;\n"],"mappings":"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"}
+{"version":3,"file":"Tour.mjs","names":["popover.Popover","popover.PopoverPortal","popover.PopoverBackdrop","popover.PopoverContent","popover.PopoverTitle","popover.PopoverDescription","popover.PopoverClose","popover.PopoverArrow"],"sources":["../src/components/organisms/tour.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type ComponentPropsWithRef,\n  type ReactNode,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { useControllableState, useElementPosition } from '@jbpark/use-hooks';\n\nimport { useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { popover } from '../../core';\nimport { OVERLAY_LAYER } from '../../lib/z-layers';\nimport Button from '../atoms/button';\n\nexport interface Step {\n  key: string;\n  title: ReactNode;\n  description?: ReactNode;\n  /** Resolved after hydration. Missing/hidden targets use a centered popup. */\n  target?: () => HTMLElement | null;\n  placement?: 'top' | 'bottom' | 'left' | 'right';\n}\n\nexport interface Props extends Omit<\n  ComponentPropsWithRef<'div'>,\n  'children' | 'onChange'\n> {\n  steps: readonly Step[];\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  current?: number;\n  defaultCurrent?: number;\n  onChange?: (current: number) => void;\n  onClose?: () => void;\n  onFinish?: () => void;\n  scrollIntoView?: boolean;\n  previousLabel?: string;\n  nextLabel?: string;\n  finishLabel?: string;\n  closeLabel?: string;\n  formatProgress?: (current: number, total: number) => string;\n  classNames?: {\n    popup?: string;\n    mask?: string;\n    highlight?: string;\n    actions?: string;\n  };\n}\n\ninterface Measurement {\n  index: number;\n  target: HTMLElement | null;\n  rect: DOMRect | null;\n}\n\nconst TARGET_MUTATION = {\n  attributes: true,\n  attributeFilter: ['hidden', 'style', 'class'],\n};\n\nconst measureVisible = (element: HTMLElement) =>\n  element.isConnected &&\n  element.getClientRects().length > 0 &&\n  getComputedStyle(element).visibility !== 'hidden'\n    ? element.getBoundingClientRect()\n    : null;\n\n// Tracks one open step's target. Tour mounts it only while open and keys it by\n// step, so no listener stays attached while closed and a new step never\n// reports the previous step's element.\nconst StepTarget = ({\n  index,\n  step,\n  scrollIntoView,\n  onMeasure,\n}: {\n  index: number;\n  step: Step;\n  scrollIntoView: boolean;\n  onMeasure: (measurement: Measurement) => void;\n}) => {\n  const { rect, element } = useElementPosition<HTMLElement>(\n    () => step.target?.() ?? null,\n    { withElement: true, measure: measureVisible, mutation: TARGET_MUTATION },\n  );\n\n  useEffect(() => {\n    if (element && scrollIntoView) {\n      element.scrollIntoView({\n        block: 'center',\n        inline: 'nearest',\n        behavior: 'instant',\n      });\n    }\n  }, [element, scrollIntoView]);\n\n  useEffect(() => {\n    onMeasure({ index, target: element, rect });\n  }, [onMeasure, index, element, rect]);\n\n  return null;\n};\n\nconst defaultFormatProgress = (current: number, total: number) =>\n  `Step ${current} of ${total}`;\n\nconst Tour = ({\n  steps,\n  open: openProp,\n  defaultOpen = false,\n  onOpenChange,\n  current: currentProp,\n  defaultCurrent = 0,\n  onChange,\n  onClose,\n  onFinish,\n  scrollIntoView = true,\n  previousLabel = 'Previous',\n  nextLabel = 'Next',\n  finishLabel = 'Finish',\n  closeLabel = 'Close tour',\n  formatProgress = defaultFormatProgress,\n  className,\n  classNames,\n  ...props\n}: Props) => {\n  const { getContainer, direction } = useConfig();\n  const [open, setOpen] = useControllableState({\n    value: openProp,\n    defaultValue: defaultOpen,\n    onChange: onOpenChange,\n  });\n  const [current, setCurrent] = useControllableState({\n    value: currentProp,\n    defaultValue: defaultCurrent,\n    onChange,\n  });\n  const index = Number.isFinite(current)\n    ? Math.max(0, Math.min(steps.length - 1, Math.floor(current)))\n    : 0;\n  const step = steps[index];\n  const [measurement, setMeasurement] = useState<Measurement | null>(null);\n  const target =\n    open && measurement && measurement.index === index\n      ? measurement.target\n      : null;\n  const rect =\n    open && measurement && measurement.index === index\n      ? measurement.rect\n      : null;\n  const fallback = useMemo(\n    () => ({\n      getBoundingClientRect: () =>\n        new DOMRect(window.innerWidth / 2, window.innerHeight / 2, 0, 0),\n    }),\n    [],\n  );\n\n  const close = () => {\n    onClose?.();\n    setOpen(false);\n  };\n\n  return (\n    <div\n      {...props}\n      data-slot=\"tour\"\n      className={cn(\n        'contents',\n        className, //\n      )}\n    >\n      {open && step && (\n        <StepTarget\n          key={index}\n          index={index}\n          step={step}\n          scrollIntoView={scrollIntoView}\n          onMeasure={setMeasurement}\n        />\n      )}\n      <popover.Popover\n        open={open && !!step}\n        modal\n        onOpenChange={(next, details) => {\n          if (details.reason === 'outside-press') {\n            details.cancel();\n\n            return;\n          }\n\n          if (!next) close();\n        }}\n      >\n        <popover.PopoverPortal container={getContainer()}>\n          <popover.PopoverBackdrop\n            data-slot=\"tour-mask\"\n            className={cn(\n              'fixed inset-0 bg-black/40',\n              OVERLAY_LAYER,\n              classNames?.mask, //\n            )}\n          />\n          {open && rect && (\n            <div\n              data-slot=\"tour-highlight\"\n              aria-hidden=\"true\"\n              style={{\n                position: 'fixed',\n                top: rect.top - 4,\n                left: rect.left - 4,\n                width: rect.width + 8,\n                height: rect.height + 8,\n              }}\n              className={cn(\n                'border-primary pointer-events-none rounded-md border-2',\n                OVERLAY_LAYER,\n                classNames?.highlight, //\n              )}\n            />\n          )}\n        </popover.PopoverPortal>\n        <popover.PopoverContent\n          data-slot=\"tour-popup\"\n          dir={props.dir ?? direction}\n          anchor={target ?? fallback}\n          side={step?.placement ?? 'bottom'}\n          sideOffset={12}\n          positionerStyle={\n            target\n              ? undefined\n              : {\n                  position: 'fixed',\n                  left: '50%',\n                  top: '50%',\n                  transform: 'translate(-50%, -50%)',\n                }\n          }\n          className={cn(\n            `max-h-[calc(100dvh-2rem)] w-80 max-w-[calc(100vw-2rem)]\n            overflow-y-auto`,\n            classNames?.popup, //\n          )}\n        >\n          <popover.PopoverTitle>{step?.title}</popover.PopoverTitle>\n          {step?.description != null && (\n            <popover.PopoverDescription className=\"mt-2 text-sm\">\n              {step.description}\n            </popover.PopoverDescription>\n          )}\n          <p\n            data-slot=\"tour-progress\"\n            role=\"status\"\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n            className=\"text-muted-foreground mt-3 text-xs\"\n          >\n            {formatProgress(index + 1, steps.length)}\n          </p>\n          <div\n            className={cn(\n              'mt-4 flex flex-wrap gap-2',\n              classNames?.actions, //\n            )}\n          >\n            <popover.PopoverClose\n              render={<Button variant=\"text\" size=\"small\" />}\n            >\n              {closeLabel}\n            </popover.PopoverClose>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={index === 0}\n              focusableWhenDisabled\n              className=\"aria-disabled:pointer-events-none\n                aria-disabled:opacity-50\"\n              onClick={() => setCurrent(index - 1)}\n            >\n              {previousLabel}\n            </Button>\n            <Button\n              size=\"small\"\n              onClick={() => {\n                if (index < steps.length - 1) {\n                  setCurrent(index + 1);\n                } else {\n                  onFinish?.();\n                  setOpen(false);\n                }\n              }}\n            >\n              {index === steps.length - 1 ? finishLabel : nextLabel}\n            </Button>\n          </div>\n          {target && <popover.PopoverArrow />}\n        </popover.PopoverContent>\n      </popover.Popover>\n    </div>\n  );\n};\n\nexport default Tour;\n"],"mappings":"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"}

package/dist/Transfer.mjs

@@ -1,8 +1,8 @@
 "use client";
 import { cn } from "./utils.mjs";
 import Button from "./Button.mjs";
-import Input from "./components/atoms/input/index.mjs";
-import Checkbox from "./components/atoms/checkbox/index.mjs";
+import Input from "./Input.mjs";
+import Checkbox from "./Checkbox.mjs";
 import { useId, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/molecules/transfer.tsx

package/dist/Tree.mjs

@@ -2,7 +2,7 @@
 import { cn } from "./utils.mjs";
 import { DEFAULT_LOCALE, useConfig } from "./providers/config/context.mjs";
 import Button from "./Button.mjs";
-import Checkbox from "./components/atoms/checkbox/index.mjs";
+import Checkbox from "./Checkbox.mjs";
 import { useCallback, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { useControllableState, useLatest, useResizeObserver } from "@jbpark/use-hooks";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/{components/molecules/upload.d.mts → Upload.d.mts}

@@ -30,4 +30,4 @@ export interface Props {
 declare const Upload: ({ defaultValue, value: _value, multiple, accept, maxCount, disabled, className, classNames, onChange: _onChange, onReject }: Props) => import("react").JSX.Element;
 //#endregion
 export { Upload as default };
-//# sourceMappingURL=upload.d.mts.map
+//# sourceMappingURL=Upload.d.mts.map

package/dist/Upload.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Upload.d.mts","names":[],"sources":["../src/components/molecules/upload.tsx"],"mappings":";iBAuBiB;EACf;EACA;EACA;;iBAGe;EACf,eAAe;EACf,QAAQ;EACR;EACA;EACA;EACA;EACA;EACA;IACE;IACA;IACA;;EAEF,YAAY,OAAO;;;;;EAKnB,YAAY;IAAQ,MAAM;IAAM;;;cAO5B,WAAU,cAAA,OAAA,QAAA,UAAA,QAAA,UAAA,UAAA,WAAA,YAAA,UAAA,WAAA,YAWb,0BAAK,IAAA"}

package/dist/{components/molecules/upload.mjs → Upload.mjs}

@@ -1,15 +1,15 @@
 "use client";
-import { cn } from "../../utils.mjs";
-import Button from "../../Button.mjs";
+import { cn } from "./utils.mjs";
+import Button from "./Button.mjs";
 import { useId } from "react";
 import { useControllableState, useFileDrop, useFileToDataUrl } from "@jbpark/use-hooks";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Upload, X } from "lucide-react";
+import { Upload as Upload$1, X } from "lucide-react";
 //#region src/components/molecules/upload.tsx
 let uidCounter = 0;
 const nextUid = () => uidCounter += 1;
 const isImage = (file) => /^data:image\//.test(file.url) || /\.(png|jpe?g|gif|webp|svg)$/i.test(file.name);
-const Upload$1 = ({ defaultValue = [], value: _value, multiple = true, accept = "image/*", maxCount, disabled, className, classNames, onChange: _onChange = () => {}, onReject }) => {
+const Upload = ({ defaultValue = [], value: _value, multiple = true, accept = "image/*", maxCount, disabled, className, classNames, onChange: _onChange = () => {}, onReject }) => {
 	const inputId = useId();
 	const readAsDataUrl = useFileToDataUrl();
 	const [files, setFiles] = useControllableState({
@@ -60,7 +60,7 @@ const Upload$1 = ({ defaultValue = [], value: _value, multiple = true, accept =
 			htmlFor: inputId,
 			className: cn("flex cursor-pointer flex-col items-center justify-center gap-2", "rounded-md border border-dashed p-6 text-center", "text-muted-foreground text-sm", "transition-colors", isDragging && "border-primary bg-accent", disabled && "pointer-events-none cursor-not-allowed opacity-50", classNames?.dropzone),
 			children: [
-				/* @__PURE__ */ jsx(Upload, { className: "size-6" }),
+				/* @__PURE__ */ jsx(Upload$1, { className: "size-6" }),
 				/* @__PURE__ */ jsxs("span", { children: [
 					"Click or drag file",
 					multiple ? "s" : "",
@@ -108,6 +108,6 @@ const Upload$1 = ({ defaultValue = [], value: _value, multiple = true, accept =
 	});
 };
 //#endregion
-export { Upload$1 as default };
+export { Upload as default };
 
-//# sourceMappingURL=upload.mjs.map
+//# sourceMappingURL=Upload.mjs.map

package/dist/Upload.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Upload.mjs","names":["UploadIcon"],"sources":["../src/components/molecules/upload.tsx"],"sourcesContent":["'use client';\n\nimport { useId } from 'react';\n\nimport {\n  useControllableState,\n  useFileDrop,\n  useFileToDataUrl,\n} from '@jbpark/use-hooks';\nimport { Upload as UploadIcon, X } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../atoms/button';\n\n// Monotonic per-session counter used as a uniqueness tiebreaker for file\n// uids. Guarantees a unique suffix even for the same file (identical\n// name/lastModified/size) added twice, which name+lastModified+size alone\n// can't. These uids are internal React keys, not cryptographic, so a plain\n// counter is enough — and it avoids a runtime `uuid` dependency.\nlet uidCounter = 0;\nconst nextUid = () => (uidCounter += 1);\n\nexport interface UploadFile {\n  uid: string;\n  name: string;\n  url: string;\n}\n\nexport interface Props {\n  defaultValue?: UploadFile[];\n  value?: UploadFile[];\n  multiple?: boolean;\n  accept?: string;\n  maxCount?: number;\n  disabled?: boolean;\n  className?: string;\n  classNames?: {\n    dropzone?: string;\n    list?: string;\n    item?: string;\n  };\n  onChange?: (files: UploadFile[]) => void;\n  /**\n   * Called once per file that didn't make it in — either bumped by\n   * `maxCount` or failed to read.\n   */\n  onReject?: (info: { file: File; reason: 'max-count' | 'read-error' }) => void;\n}\n\nconst isImage = (file: UploadFile) =>\n  /^data:image\\//.test(file.url) ||\n  /\\.(png|jpe?g|gif|webp|svg)$/i.test(file.name);\n\nconst Upload = ({\n  defaultValue = [],\n  value: _value,\n  multiple = true,\n  accept = 'image/*',\n  maxCount,\n  disabled,\n  className,\n  classNames,\n  onChange: _onChange = () => {},\n  onReject,\n}: Props) => {\n  const inputId = useId();\n  const readAsDataUrl = useFileToDataUrl();\n  const [files, setFiles] = useControllableState<UploadFile[]>({\n    value: _value,\n    defaultValue,\n    onChange: _onChange,\n  });\n\n  const addFiles = async (incoming: File[]) => {\n    const remaining =\n      typeof maxCount === 'number'\n        ? Math.max(0, maxCount - files.length)\n        : incoming.length;\n\n    const accepted = incoming.slice(0, remaining);\n    const rejected = incoming.slice(remaining);\n\n    rejected.forEach(file => onReject?.({ file, reason: 'max-count' }));\n\n    if (accepted.length === 0) {\n      return;\n    }\n\n    const uploaded = (\n      await Promise.all(\n        accepted.map(async file => {\n          try {\n            return {\n              // `nextUid()` guarantees uniqueness even for the same file\n              // added twice (identical name/lastModified/size), which\n              // name+lastModified+size alone can't — a collision there\n              // corrupted React's item keys and made removeFile's\n              // uid-based filter delete both copies at once.\n              uid: `${file.name}-${file.lastModified}-${file.size}-${nextUid()}`,\n              name: file.name,\n              url: await readAsDataUrl(file),\n            };\n          } catch {\n            onReject?.({ file, reason: 'read-error' });\n            return null;\n          }\n        }),\n      )\n    ).filter((file): file is UploadFile => file !== null);\n\n    if (uploaded.length === 0) {\n      return;\n    }\n\n    setFiles([...files, ...uploaded]);\n  };\n\n  const removeFile = (uid: string) => {\n    setFiles(files.filter(file => file.uid !== uid));\n  };\n\n  const { dropRef, isDragging } = useFileDrop<HTMLLabelElement>({\n    accept,\n    multiple,\n    disabled,\n    onDrop: addFiles,\n  });\n\n  return (\n    <div\n      data-slot=\"upload\"\n      className={cn(\n        'flex flex-col gap-3',\n        className,\n        //\n      )}\n    >\n      <label\n        ref={dropRef}\n        htmlFor={inputId}\n        className={cn(\n          'flex cursor-pointer flex-col items-center justify-center gap-2',\n          'rounded-md border border-dashed p-6 text-center',\n          'text-muted-foreground text-sm',\n          'transition-colors',\n          isDragging && 'border-primary bg-accent',\n          disabled && 'pointer-events-none cursor-not-allowed opacity-50',\n          classNames?.dropzone,\n          //\n        )}\n      >\n        <UploadIcon className=\"size-6\" />\n        <span>Click or drag file{multiple ? 's' : ''} to upload</span>\n        <input\n          id={inputId}\n          type=\"file\"\n          accept={accept}\n          multiple={multiple}\n          disabled={disabled}\n          className=\"hidden\"\n          onChange={e => {\n            if (e.target.files?.length) {\n              addFiles(Array.from(e.target.files));\n            }\n            e.target.value = '';\n          }}\n        />\n      </label>\n\n      {files.length > 0 && (\n        <ul\n          className={cn(\n            'm-0 flex list-none flex-col gap-2 p-0',\n            classNames?.list,\n            //\n          )}\n        >\n          {files.map(file => (\n            <li\n              key={file.uid}\n              className={cn(\n                // `m-0` completes the list reset the `ul` above starts — see\n                // Radio.Group for the host rule this guards against.\n                'm-0 flex items-center gap-2 rounded-md border p-2',\n                classNames?.item,\n                //\n              )}\n            >\n              {isImage(file) && (\n                <img\n                  src={file.url}\n                  alt=\"\"\n                  className=\"size-10 shrink-0 rounded object-cover\"\n                />\n              )}\n              <span className=\"flex-1 truncate text-sm\">{file.name}</span>\n              <Button\n                variant=\"text\"\n                shape=\"circle\"\n                size=\"small\"\n                icon={<X className=\"size-4\" />}\n                onClick={() => removeFile(file.uid)}\n                className=\"text-muted-foreground hover:text-foreground shrink-0\"\n                aria-label={`Remove ${file.name}`}\n              />\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n};\n\nexport default Upload;\n"],"mappings":"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"}

package/dist/components/atoms/index.d.mts

@@ -1,31 +1,38 @@
 import AutoComplete, { Option, Props } from "../../AutoComplete.mjs";
 import Avatar, { Props as Props$1 } from "../../Avatar.mjs";
 import Badge, { Props as Props$2 } from "../../Badge.mjs";
-import Button from "../../Button.mjs";
-import Cascader, { Option as Option$1, Props as Props$3 } from "../../Cascader.mjs";
-import Divider, { Props as Props$4 } from "../../Divider.mjs";
-import Mentions, { Option as Option$2, Props as Props$5 } from "../../Mentions.mjs";
-import Rate, { Props as Props$6 } from "../../Rate.mjs";
-import Segmented, { Props as Props$7 } from "../../Segmented.mjs";
-import Tag from "../../Tag.mjs";
-import TimePicker, { Props as Props$8 } from "../../TimePicker.mjs";
+import Button, { Props as Props$3 } from "../../Button.mjs";
+import Cascader, { Option as Option$1, Props as Props$4 } from "../../Cascader.mjs";
+import { Props as Props$5 } from "./checkbox/checkbox.mjs";
+import Checkbox from "../../Checkbox.mjs";
+import ColorPicker, { Props as Props$6 } from "../../ColorPicker.mjs";
+import DatePicker, { Props as Props$7 } from "../../DatePicker.mjs";
+import Divider, { Props as Props$8 } from "../../Divider.mjs";
+import { Props as Props$9 } from "./float-button/float-button.mjs";
+import FloatButton from "../../FloatButton.mjs";
+import { Props as Props$10 } from "./input/input.mjs";
+import { Props as Props$11 } from "./input/number.mjs";
+import { Props as Props$12 } from "./input/otp.mjs";
+import Input from "../../Input.mjs";
+import Mentions, { Option as Option$2, Props as Props$13 } from "../../Mentions.mjs";
+import Popover, { Props as Props$14 } from "../../Popover.mjs";
+import Progress, { Props as Props$15 } from "../../Progress.mjs";
+import { Props as Props$16 } from "./radio/radio.mjs";
+import Radio from "../../Radio.mjs";
+import Rate, { Props as Props$17 } from "../../Rate.mjs";
+import RichTextEditor, { Props as Props$18 } from "./rich-text-editor/rich-text-editor.mjs";
+import "../../RichTextEditor.mjs";
+import Segmented, { Props as Props$19 } from "../../Segmented.mjs";
+import Select, { Props as Props$20 } from "../../Select.mjs";
+import { Props as Props$21 } from "./skeleton/skeleton.mjs";
+import Skeleton from "../../Skeleton.mjs";
+import Slider, { Props as Props$22 } from "./slider/slider.mjs";
+import Spin, { Props as Props$23 } from "../../Spin.mjs";
+import Switch, { Props as Props$24 } from "../../Switch.mjs";
+import Tag, { Props as Props$25 } from "../../Tag.mjs";
+import TimePicker, { Props as Props$26 } from "../../TimePicker.mjs";
+import ToggleGroup, { Option as Option$3, Props as Props$27 } from "../../ToggleGroup.mjs";
+import Tooltip, { Props as Props$28 } from "../../Tooltip.mjs";
+import { Props as Props$29 } from "./typography/typography.mjs";
 import Typography from "../../Typography.mjs";
-import Popover from "./popover.mjs";
-import Checkbox from "./checkbox/index.mjs";
-import ColorPicker from "./color-picker.mjs";
-import DatePicker from "./date-picker.mjs";
-import FloatButton from "./float-button/index.mjs";
-import { Props as Props$9 } from "./input/number.mjs";
-import { Props as Props$10 } from "./input/otp.mjs";
-import Input from "./input/index.mjs";
-import Progress from "./progress.mjs";
-import Radio from "./radio/index.mjs";
-import RichTextEditor from "./rich-text-editor/rich-text-editor.mjs";
-import "./rich-text-editor/index.mjs";
-import Select from "./select.mjs";
-import Skeleton from "./skeleton/index.mjs";
-import Slider from "./slider/slider.mjs";
-import Spin from "./spin.mjs";
-import Switch from "./switch.mjs";
-import Tooltip from "./tooltip.mjs";
-export { AutoComplete, type Option as AutoCompleteOption, type Props as AutoCompleteProps, Avatar, type Props$1 as AvatarProps, Badge, type Props$2 as BadgeProps, Button, Cascader, type Option$1 as CascaderOption, type Props$3 as CascaderProps, Checkbox, ColorPicker, DatePicker, Divider, type Props$4 as DividerProps, FloatButton, Input, type Props$9 as InputNumberProps, type Props$10 as InputOTPProps, Mentions, type Option$2 as MentionsOption, type Props$5 as MentionsProps, Popover, Progress, Radio, Rate, type Props$6 as RateProps, RichTextEditor, Segmented, type Props$7 as SegmentedProps, Select, Skeleton, Slider, Spin, Switch, Tag, TimePicker, type Props$8 as TimePickerProps, Tooltip, Typography };
+export { AutoComplete, type Option as AutoCompleteOption, type Props as AutoCompleteProps, Avatar, type Props$1 as AvatarProps, Badge, type Props$2 as BadgeProps, Button, type Props$3 as ButtonProps, Cascader, type Option$1 as CascaderOption, type Props$4 as CascaderProps, Checkbox, type Props$5 as CheckboxProps, ColorPicker, type Props$6 as ColorPickerProps, DatePicker, type Props$7 as DatePickerProps, Divider, type Props$8 as DividerProps, FloatButton, type Props$9 as FloatButtonProps, Input, type Props$11 as InputNumberProps, type Props$12 as InputOTPProps, type Props$10 as InputProps, Mentions, type Option$2 as MentionsOption, type Props$13 as MentionsProps, Popover, type Props$14 as PopoverProps, Progress, type Props$15 as ProgressProps, Radio, type Props$16 as RadioProps, Rate, type Props$17 as RateProps, RichTextEditor, type Props$18 as RichTextEditorProps, Segmented, type Props$19 as SegmentedProps, Select, type Props$20 as SelectProps, Skeleton, type Props$21 as SkeletonProps, Slider, type Props$22 as SliderProps, Spin, type Props$23 as SpinProps, Switch, type Props$24 as SwitchProps, Tag, type Props$25 as TagProps, TimePicker, type Props$26 as TimePickerProps, ToggleGroup, type Option$3 as ToggleGroupOption, type Props$27 as ToggleGroupProps, Tooltip, type Props$28 as TooltipProps, Typography, type Props$29 as TypographyProps };

package/dist/components/atoms/input/input.d.mts

@@ -1,5 +1,6 @@
 //#region src/components/atoms/input/input.d.ts
-declare const Input: ({ ref, ...props }: React.ComponentPropsWithRef<"input">) => import("react").JSX.Element;
+export type Props = React.ComponentPropsWithRef<'input'>;
+declare const Input: ({ ref, ...props }: Props) => import("react").JSX.Element;
 //#endregion
 export { Input as default };
 //# sourceMappingURL=input.d.mts.map

package/dist/components/atoms/input/input.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.mts","names":[],"sources":["../../../../src/components/atoms/input/input.tsx"],"mappings":";cAIM,UAAS,QAAA,SAAmB,MAAM,mDAA8B,IAAA"}
+{"version":3,"file":"input.d.mts","names":[],"sources":["../../../../src/components/atoms/input/input.tsx"],"mappings":";YAIY,QAAQ,MAAM;cAEpB,UAAS,QAAA,SAAmB,0BAAK,IAAA"}

package/dist/components/atoms/input/input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input.mjs","names":["input"],"sources":["../../../../src/components/atoms/input/input.tsx"],"sourcesContent":["import { input } from '../../../core';\n\nconst { Input: Core } = input;\n\nconst Input = ({ ref, ...props }: React.ComponentPropsWithRef<'input'>) => {\n  return <Core ref={ref} {...props} />;\n};\n\nexport default Input;\n"],"mappings":";;;AAEA,MAAM,EAAE,OAAO,SAASA;AAExB,MAAM,SAAS,EAAE,KAAK,GAAG,YAAkD;CACzE,OAAO,oBAAC,MAAD;EAAW;EAAK,GAAI;CAAQ,CAAA;AACrC"}
+{"version":3,"file":"input.mjs","names":["input"],"sources":["../../../../src/components/atoms/input/input.tsx"],"sourcesContent":["import { input } from '../../../core';\n\nconst { Input: Core } = input;\n\nexport type Props = React.ComponentPropsWithRef<'input'>;\n\nconst Input = ({ ref, ...props }: Props) => {\n  return <Core ref={ref} {...props} />;\n};\n\nexport default Input;\n"],"mappings":";;;AAEA,MAAM,EAAE,OAAO,SAASA;AAIxB,MAAM,SAAS,EAAE,KAAK,GAAG,YAAmB;CAC1C,OAAO,oBAAC,MAAD;EAAW;EAAK,GAAI;CAAQ,CAAA;AACrC"}

package/dist/components/atoms/rich-text-editor/toolbar-presets.mjs

@@ -1,10 +1,10 @@
 "use client";
 import Button from "../../../Button.mjs";
-import Input from "../input/index.mjs";
-import Popover from "../popover.mjs";
-import ColorPicker from "../color-picker.mjs";
+import Input from "../../../Input.mjs";
+import Popover from "../../../Popover.mjs";
+import ColorPicker from "../../../ColorPicker.mjs";
 import ToolbarButton from "./toolbar-button.mjs";
-import Select from "../select.mjs";
+import Select from "../../../Select.mjs";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Bold, Code, Code2, Italic, Link, List, ListOrdered, Minus, Quote, Redo2, Strikethrough, Underline, Undo2 } from "lucide-react";

package/dist/components/atoms/select-multiple.mjs

@@ -4,7 +4,7 @@ import { DEFAULT_LOCALE, useConfig } from "../../providers/config/context.mjs";
 import { combobox_exports } from "../../core/combobox.mjs";
 import Button from "../../Button.mjs";
 import { selectTriggerStyles } from "../../core/select.mjs";
-import Input from "./input/index.mjs";
+import Input from "../../Input.mjs";
 import SearchableOptions, { useSelectItems } from "./select-searchable-options.mjs";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/atoms/select-searchable.mjs

@@ -4,7 +4,7 @@ import { DEFAULT_LOCALE, useConfig } from "../../providers/config/context.mjs";
 import { combobox_exports } from "../../core/combobox.mjs";
 import Button from "../../Button.mjs";
 import { selectTriggerStyles } from "../../core/select.mjs";
-import Input from "./input/index.mjs";
+import Input from "../../Input.mjs";
 import SearchableOptions, { useSelectItems } from "./select-searchable-options.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDownIcon, XIcon } from "lucide-react";

package/dist/components/molecules/index.d.mts

@@ -2,25 +2,26 @@ import Alert, { Props } from "../../Alert.mjs";
 import Anchor, { Item, Props as Props$1 } from "../../Anchor.mjs";
 import Breadcrumb, { Props as Props$2 } from "../../Breadcrumb.mjs";
 import Card, { Props as Props$3 } from "../../Card.mjs";
-import ContextMenu, { Item as Item$1, Props as Props$4 } from "../../ContextMenu.mjs";
-import Descriptions, { Columns, Item as Item$2, Props as Props$5 } from "../../Descriptions.mjs";
-import Menu, { Props as Props$6 } from "./menu/menu.mjs";
-import Pagination, { Props as Props$7 } from "../../Pagination.mjs";
-import Popconfirm, { Props as Props$8 } from "../../Popconfirm.mjs";
-import { Props as Props$9 } from "./reveals/reveals.mjs";
+import Collapse, { Props as Props$4 } from "../../Collapse.mjs";
+import ContextMenu, { Item as Item$1, Props as Props$5 } from "../../ContextMenu.mjs";
+import Descriptions, { Columns, Item as Item$2, Props as Props$6 } from "../../Descriptions.mjs";
+import Menu, { Props as Props$7 } from "./menu/menu.mjs";
+import Dropdown, { Props as Props$8 } from "../../Dropdown.mjs";
+import Empty, { Props as Props$9 } from "../../Empty.mjs";
+import { Props as Props$10 } from "./marquees/marquees.mjs";
+import Marquees from "../../Marquees.mjs";
+import Pagination, { Props as Props$11 } from "../../Pagination.mjs";
+import Popconfirm, { Props as Props$12 } from "../../Popconfirm.mjs";
+import { Props as Props$13 } from "./reveals/reveals.mjs";
 import Reveals from "../../Reveals.mjs";
-import ScrollArea, { Props as Props$10 } from "../../ScrollArea.mjs";
-import Space, { Props as Props$11 } from "../../Space.mjs";
-import Statistic, { Props as Props$12 } from "../../Statistic.mjs";
-import Steps, { Item as Item$3, Props as Props$13 } from "../../Steps.mjs";
-import Timeline, { Item as Item$4, Props as Props$14, Timestamp } from "../../Timeline.mjs";
-import Transfer, { Item as Item$5, Props as Props$15 } from "../../Transfer.mjs";
-import Collapse, { Props as Props$16 } from "./collapse.mjs";
-import Dropdown, { Props as Props$17 } from "./dropdown.mjs";
-import { Props as Props$18 } from "./marquees/marquees.mjs";
-import Marquees from "./marquees/index.mjs";
-import { Props as Props$19 } from "./splitter/splitter.mjs";
-import Splitter from "./splitter/index.mjs";
-import Tabs, { Props as Props$20 } from "./tabs.mjs";
-import Upload, { Props as Props$21, UploadFile } from "./upload.mjs";
-export { Alert, type Props as AlertProps, Anchor, type Item as AnchorItem, type Props$1 as AnchorProps, Breadcrumb, type Props$2 as BreadcrumbProps, Card, type Props$3 as CardProps, Collapse, type Props$16 as CollapseProps, ContextMenu, type Item$1 as ContextMenuItem, type Props$4 as ContextMenuProps, type Item$2 as DescriptionItem, Descriptions, type Columns as DescriptionsColumns, type Props$5 as DescriptionsProps, Dropdown, type Props$17 as DropdownProps, Marquees, type Props$18 as MarqueesProps, Menu, type Props$6 as MenuProps, Pagination, type Props$7 as PaginationProps, Popconfirm, type Props$8 as PopconfirmProps, Reveals, type Props$9 as RevealsProps, ScrollArea, type Props$10 as ScrollAreaProps, Space, type Props$11 as SpaceProps, Splitter, type Props$19 as SplitterProps, Statistic, type Props$12 as StatisticProps, type Item$3 as StepItem, Steps, type Props$13 as StepsProps, Tabs, type Props$20 as TabsProps, Timeline, type Item$4 as TimelineItem, type Props$14 as TimelineProps, type Timestamp as TimelineTimestamp, Transfer, type Item$5 as TransferItem, type Props$15 as TransferProps, Upload, type UploadFile, type Props$21 as UploadProps };
+import ScrollArea, { Props as Props$14 } from "../../ScrollArea.mjs";
+import Space, { Props as Props$15 } from "../../Space.mjs";
+import { Props as Props$16 } from "./splitter/splitter.mjs";
+import Splitter from "../../Splitter.mjs";
+import Statistic, { Props as Props$17 } from "../../Statistic.mjs";
+import Steps, { Item as Item$3, Props as Props$18 } from "../../Steps.mjs";
+import Tabs, { Props as Props$19 } from "../../Tabs.mjs";
+import Timeline, { Item as Item$4, Props as Props$20, Timestamp } from "../../Timeline.mjs";
+import Transfer, { Item as Item$5, Props as Props$21 } from "../../Transfer.mjs";
+import Upload, { Props as Props$22, UploadFile } from "../../Upload.mjs";
+export { Alert, type Props as AlertProps, Anchor, type Item as AnchorItem, type Props$1 as AnchorProps, Breadcrumb, type Props$2 as BreadcrumbProps, Card, type Props$3 as CardProps, Collapse, type Props$4 as CollapseProps, ContextMenu, type Item$1 as ContextMenuItem, type Props$5 as ContextMenuProps, type Item$2 as DescriptionItem, Descriptions, type Columns as DescriptionsColumns, type Props$6 as DescriptionsProps, Dropdown, type Props$8 as DropdownProps, Empty, type Props$9 as EmptyProps, Marquees, type Props$10 as MarqueesProps, Menu, type Props$7 as MenuProps, Pagination, type Props$11 as PaginationProps, Popconfirm, type Props$12 as PopconfirmProps, Reveals, type Props$13 as RevealsProps, ScrollArea, type Props$14 as ScrollAreaProps, Space, type Props$15 as SpaceProps, Splitter, type Props$16 as SplitterProps, Statistic, type Props$17 as StatisticProps, type Item$3 as StepItem, Steps, type Props$18 as StepsProps, Tabs, type Props$19 as TabsProps, Timeline, type Item$4 as TimelineItem, type Props$20 as TimelineProps, type Timestamp as TimelineTimestamp, Transfer, type Item$5 as TransferItem, type Props$21 as TransferProps, Upload, type UploadFile, type Props$22 as UploadProps };

package/dist/components/organisms/form/control.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { Field } from "../../../core/form.mjs";
-import Input from "../../atoms/input/index.mjs";
+import Input from "../../../Input.mjs";
 import { RequiredContext } from "./context.mjs";
 import { useContext } from "react";
 import { jsx } from "react/jsx-runtime";