@jbpark/ui-kit 10.1.0 → 10.3.0

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

@@ -0,0 +1,23 @@
+import { ComponentSize } from "../../../providers/config/types.mjs";
+import * as React$1 from "react";
+import { NumberField, NumberFieldRoot } from "@base-ui/react/number-field";
+//#region src/components/atoms/input/number.d.ts
+export interface Props extends Omit<React$1.ComponentProps<typeof NumberField.Root>, 'children' | 'onValueChange'> {
+  /** Visible input label. Alternatively, pair `id` with an external label. */
+  label?: string;
+  /** Called with the numeric value (or null when cleared). */
+  onChange?: (value: number | null, eventDetails: NumberFieldRoot.ChangeEventDetails) => void;
+  placeholder?: string;
+  size?: ComponentSize;
+  classNames?: {
+    label?: string;
+    group?: string;
+    input?: string;
+    decrement?: string;
+    increment?: string;
+  };
+}
+declare const Number: ({ ref, id, label, onChange, placeholder, size, className, classNames, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...props }: Props) => React$1.JSX.Element;
+//#endregion
+export { Number as default };
+//# sourceMappingURL=number.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"number.d.mts","names":["React"],"sources":["../../../../src/components/atoms/input/number.tsx"],"mappings":";;;;iBAmBiB,cAAc,KAC7BA,QAAM,sBAAsB,YAAY;;EAIxC;;EAEA,YACE,sBACA,cAAc,gBAAgB;EAEhC;EACA,OAAO;EACP;IACE;IACA;IACA;IACA;IACA;;;cAIE,WAAU,KAAA,IAAA,OAAA,UAAA,aAAA,MAAA,WAAA,0BAAA,8BAAA,oCAAA,oBAAA,SAab,UAAKA,QAAA,IAAA"}

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

@@ -0,0 +1,71 @@
+"use client";
+import { cn } from "../../../utils.mjs";
+import { useConfig } from "../../../providers/config/context.mjs";
+import Button from "../../../Button.mjs";
+import Input from "./input.mjs";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Minus, Plus } from "lucide-react";
+import { NumberField } from "@base-ui/react/number-field";
+//#region src/components/atoms/input/number.tsx
+const sizes = {
+	small: "h-8",
+	middle: "h-9",
+	large: "h-10"
+};
+const Number = ({ ref, id, label, onChange, placeholder, size, className, classNames, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, ...props }) => {
+	const generatedId = React$1.useId();
+	const inputId = id ?? generatedId;
+	const { componentSize } = useConfig();
+	const resolvedSize = size ?? componentSize ?? "middle";
+	return /* @__PURE__ */ jsxs(NumberField.Root, {
+		...props,
+		ref,
+		id: inputId,
+		onValueChange: onChange,
+		"data-slot": "input-number",
+		className: cn("w-full", className),
+		children: [label && /* @__PURE__ */ jsx("label", {
+			htmlFor: inputId,
+			className: cn("mb-1.5 block text-sm font-medium", classNames?.label),
+			children: label
+		}), /* @__PURE__ */ jsxs(NumberField.Group, {
+			className: cn(`border-input focus-within:border-ring focus-within:ring-ring/50 flex
+          w-full items-stretch overflow-hidden rounded-md border shadow-xs
+          focus-within:ring-[3px]`, sizes[resolvedSize], classNames?.group),
+			children: [
+				/* @__PURE__ */ jsx(NumberField.Decrement, {
+					"aria-label": "Decrease value",
+					render: /* @__PURE__ */ jsx(Button, {
+						variant: "text",
+						size: "small",
+						icon: /* @__PURE__ */ jsx(Minus, {}),
+						className: cn("h-full! rounded-none px-2!", classNames?.decrement)
+					})
+				}),
+				/* @__PURE__ */ jsx(NumberField.Input, {
+					render: /* @__PURE__ */ jsx(Input, {}),
+					placeholder,
+					"aria-label": ariaLabel,
+					"aria-labelledby": ariaLabelledBy,
+					"aria-describedby": ariaDescribedBy,
+					className: cn(`h-full min-w-0 flex-1 rounded-none border-0 text-center shadow-none
+            focus-visible:ring-0`, classNames?.input)
+				}),
+				/* @__PURE__ */ jsx(NumberField.Increment, {
+					"aria-label": "Increase value",
+					render: /* @__PURE__ */ jsx(Button, {
+						variant: "text",
+						size: "small",
+						icon: /* @__PURE__ */ jsx(Plus, {}),
+						className: cn("h-full! rounded-none px-2!", classNames?.increment)
+					})
+				})
+			]
+		})]
+	});
+};
+//#endregion
+export { Number as default };
+
+//# sourceMappingURL=number.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"number.mjs","names":["React"],"sources":["../../../../src/components/atoms/input/number.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { NumberField, type NumberFieldRoot } from '@base-ui/react/number-field';\nimport { Minus, Plus } from 'lucide-react';\n\nimport { type ComponentSize, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../button';\nimport Input from './input';\n\nconst sizes: Record<ComponentSize, string> = {\n  small: 'h-8',\n  middle: 'h-9',\n  large: 'h-10',\n};\n\nexport interface Props extends Omit<\n  React.ComponentProps<typeof NumberField.Root>,\n  'children' | 'onValueChange'\n> {\n  /** Visible input label. Alternatively, pair `id` with an external label. */\n  label?: string;\n  /** Called with the numeric value (or null when cleared). */\n  onChange?: (\n    value: number | null,\n    eventDetails: NumberFieldRoot.ChangeEventDetails,\n  ) => void;\n  placeholder?: string;\n  size?: ComponentSize;\n  classNames?: {\n    label?: string;\n    group?: string;\n    input?: string;\n    decrement?: string;\n    increment?: string;\n  };\n}\n\nconst Number = ({\n  ref,\n  id,\n  label,\n  onChange,\n  placeholder,\n  size,\n  className,\n  classNames,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  'aria-describedby': ariaDescribedBy,\n  ...props\n}: Props) => {\n  const generatedId = React.useId();\n  const inputId = id ?? generatedId;\n  const { componentSize } = useConfig();\n  const resolvedSize = size ?? componentSize ?? 'middle';\n\n  return (\n    <NumberField.Root\n      {...props}\n      ref={ref}\n      id={inputId}\n      onValueChange={onChange}\n      data-slot=\"input-number\"\n      className={cn('w-full', className)}\n    >\n      {label && (\n        <label\n          htmlFor={inputId}\n          className={cn('mb-1.5 block text-sm font-medium', classNames?.label)}\n        >\n          {label}\n        </label>\n      )}\n      <NumberField.Group\n        className={cn(\n          `border-input focus-within:border-ring focus-within:ring-ring/50 flex\n          w-full items-stretch overflow-hidden rounded-md border shadow-xs\n          focus-within:ring-[3px]`,\n          sizes[resolvedSize],\n          classNames?.group,\n          //\n        )}\n      >\n        <NumberField.Decrement\n          aria-label=\"Decrease value\"\n          render={\n            <Button\n              variant=\"text\"\n              size=\"small\"\n              icon={<Minus />}\n              className={cn(\n                'h-full! rounded-none px-2!',\n                classNames?.decrement,\n              )}\n            />\n          }\n        />\n        <NumberField.Input\n          render={<Input />}\n          placeholder={placeholder}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-describedby={ariaDescribedBy}\n          className={cn(\n            `h-full min-w-0 flex-1 rounded-none border-0 text-center shadow-none\n            focus-visible:ring-0`,\n            classNames?.input,\n            //\n          )}\n        />\n        <NumberField.Increment\n          aria-label=\"Increase value\"\n          render={\n            <Button\n              variant=\"text\"\n              size=\"small\"\n              icon={<Plus />}\n              className={cn(\n                'h-full! rounded-none px-2!',\n                classNames?.increment,\n              )}\n            />\n          }\n        />\n      </NumberField.Group>\n    </NumberField.Root>\n  );\n};\n\nexport default Number;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,QAAuC;CAC3C,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAwBA,MAAM,UAAU,EACd,KACA,IACA,OACA,UACA,aACA,MACA,WACA,YACA,cAAc,WACd,mBAAmB,gBACnB,oBAAoB,iBACpB,GAAG,YACQ;CACX,MAAM,cAAcA,QAAM,MAAM;CAChC,MAAM,UAAU,MAAM;CACtB,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,eAAe,QAAQ,iBAAiB;CAE9C,OACE,qBAAC,YAAY,MAAb;EACE,GAAI;EACC;EACL,IAAI;EACJ,eAAe;EACf,aAAU;EACV,WAAW,GAAG,UAAU,SAAS;EANnC,UAAA,CAQG,SACC,oBAAC,SAAD;GACE,SAAS;GACT,WAAW,GAAG,oCAAoC,YAAY,KAAK;GAElE,UAAA;EACI,CAAA,GAET,qBAAC,YAAY,OAAb;GACE,WAAW,GACT;;oCAGA,MAAM,eACN,YAAY,KAEd;GARF,UAAA;IAUE,oBAAC,YAAY,WAAb;KACE,cAAW;KACX,QACE,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,MAAM,oBAAC,OAAD,CAAQ,CAAA;MACd,WAAW,GACT,8BACA,YAAY,SACd;KACD,CAAA;IAEJ,CAAA;IACD,oBAAC,YAAY,OAAb;KACE,QAAQ,oBAAC,OAAD,CAAQ,CAAA;KACH;KACb,cAAY;KACZ,mBAAiB;KACjB,oBAAkB;KAClB,WAAW,GACT;mCAEA,YAAY,KAEd;IACD,CAAA;IACD,oBAAC,YAAY,WAAb;KACE,cAAW;KACX,QACE,oBAAC,QAAD;MACE,SAAQ;MACR,MAAK;MACL,MAAM,oBAAC,MAAD,CAAO,CAAA;MACb,WAAW,GACT,8BACA,YAAY,SACd;KACD,CAAA;IAEJ,CAAA;GACgB;EACH,CAAA,CAAA;;AAEtB"}

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

@@ -0,0 +1,26 @@
+import { ComponentSize } from "../../../providers/config/types.mjs";
+import * as React$1 from "react";
+import { OTPField, OTPFieldRoot } from "@base-ui/react/otp-field";
+//#region src/components/atoms/input/otp.d.ts
+export interface Props extends Omit<React$1.ComponentProps<typeof OTPField.Root>, 'children' | 'onValueChange' | 'onValueComplete' | 'autoSubmit' | 'render' | 'className' | 'length'> {
+  /** Positive safe integer slot count. Invalid or omitted values use six. */
+  length?: number;
+  className?: string;
+  label?: string;
+  onChange?: (value: string, details: OTPFieldRoot.ChangeEventDetails) => void;
+  onComplete?: (value: string, details: OTPFieldRoot.CompleteEventDetails) => void;
+  size?: ComponentSize;
+  inputRef?: React$1.Ref<HTMLInputElement>;
+  placeholder?: string;
+  /** Localize the accessible name of each slot after the first. */
+  getSlotLabel?: (index: number, length: number) => string;
+  classNames?: {
+    label?: string;
+    group?: string;
+    input?: string;
+  };
+}
+declare const OTP: ({ label, id, length, size, onChange, onComplete, inputRef, placeholder, getSlotLabel, className, classNames, "aria-label": ariaLabel, "aria-labelledby": labelledBy, "aria-describedby": describedBy, ...props }: Props) => React$1.JSX.Element;
+//#endregion
+export { OTP as default };
+//# sourceMappingURL=otp.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"otp.d.mts","names":["React"],"sources":["../../../../src/components/atoms/input/otp.tsx"],"mappings":";;;;iBAmBiB,cAAc,KAC7BA,QAAM,sBAAsB,SAAS;;EAUrC;EACA;EACA;EACA,YAAY,eAAe,SAAS,aAAa;EACjD,cACE,eACA,SAAS,aAAa;EAExB,OAAO;EACP,WAAWA,QAAM,IAAI;EACrB;;EAEA,gBAAgB,eAAe;EAC/B;IAAe;IAAgB;IAAgB;;;cAG3C,QAAO,OAAA,IAAA,QAAA,MAAA,UAAA,YAAA,UAAA,aAAA,cAAA,WAAA,0BAAA,8BAAA,gCAAA,gBAAA,SAgBV,UAAKA,QAAA,IAAA"}

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

@@ -0,0 +1,52 @@
+"use client";
+import { cn } from "../../../utils.mjs";
+import { useConfig } from "../../../providers/config/context.mjs";
+import Input from "./input.mjs";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { OTPField } from "@base-ui/react/otp-field";
+//#region src/components/atoms/input/otp.tsx
+const sizes = {
+	small: "h-8 w-8",
+	middle: "h-9 w-9",
+	large: "h-10 w-10"
+};
+const OTP = ({ label, id, length = 6, size, onChange, onComplete, inputRef, placeholder, getSlotLabel = (index, count) => `Character ${index + 1} of ${count}`, className, classNames, "aria-label": ariaLabel, "aria-labelledby": labelledBy, "aria-describedby": describedBy, ...props }) => {
+	const generatedId = React$1.useId();
+	const inputId = id ?? generatedId;
+	const { componentSize } = useConfig();
+	const isValidLength = Number.isSafeInteger(length) && length > 0;
+	const count = isValidLength ? length : 6;
+	React$1.useEffect(() => {
+		if (process.env.NODE_ENV !== "production" && !isValidLength) console.warn("Input.OTP length must be a positive safe integer; using six.");
+	}, [isValidLength, length]);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "input-otp",
+		children: [label && /* @__PURE__ */ jsx("label", {
+			htmlFor: inputId,
+			className: cn("mb-1.5 block text-sm font-medium", classNames?.label),
+			children: label
+		}), /* @__PURE__ */ jsx(OTPField.Root, {
+			...props,
+			id: inputId,
+			length: count,
+			autoSubmit: false,
+			onValueChange: onChange,
+			onValueComplete: onComplete,
+			"aria-describedby": describedBy,
+			className: cn("flex flex-wrap gap-2", classNames?.group, className),
+			children: Array.from({ length: count }, (_, index) => /* @__PURE__ */ jsx(OTPField.Input, {
+				ref: index === 0 ? inputRef : void 0,
+				render: /* @__PURE__ */ jsx(Input, {}),
+				placeholder,
+				"aria-label": index === 0 ? ariaLabel : getSlotLabel(index, count),
+				"aria-labelledby": index === 0 ? labelledBy : void 0,
+				className: cn("shrink-0 px-0 text-center tabular-nums", sizes[size ?? componentSize ?? "middle"], classNames?.input)
+			}, index))
+		})]
+	});
+};
+//#endregion
+export { OTP as default };
+
+//# sourceMappingURL=otp.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"otp.mjs","names":["React"],"sources":["../../../../src/components/atoms/input/otp.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport { OTPField, type OTPFieldRoot } from '@base-ui/react/otp-field';\n\nimport { type ComponentSize, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport Input from './input';\n\ndeclare const process: { env: { NODE_ENV?: string } };\n\nconst sizes: Record<ComponentSize, string> = {\n  small: 'h-8 w-8',\n  middle: 'h-9 w-9',\n  large: 'h-10 w-10',\n};\n\nexport interface Props extends Omit<\n  React.ComponentProps<typeof OTPField.Root>,\n  | 'children'\n  | 'onValueChange'\n  | 'onValueComplete'\n  | 'autoSubmit'\n  | 'render'\n  | 'className'\n  | 'length'\n> {\n  /** Positive safe integer slot count. Invalid or omitted values use six. */\n  length?: number;\n  className?: string;\n  label?: string;\n  onChange?: (value: string, details: OTPFieldRoot.ChangeEventDetails) => void;\n  onComplete?: (\n    value: string,\n    details: OTPFieldRoot.CompleteEventDetails,\n  ) => void;\n  size?: ComponentSize;\n  inputRef?: React.Ref<HTMLInputElement>;\n  placeholder?: string;\n  /** Localize the accessible name of each slot after the first. */\n  getSlotLabel?: (index: number, length: number) => string;\n  classNames?: { label?: string; group?: string; input?: string };\n}\n\nconst OTP = ({\n  label,\n  id,\n  length = 6,\n  size,\n  onChange,\n  onComplete,\n  inputRef,\n  placeholder,\n  getSlotLabel = (index, count) => `Character ${index + 1} of ${count}`,\n  className,\n  classNames,\n  'aria-label': ariaLabel,\n  'aria-labelledby': labelledBy,\n  'aria-describedby': describedBy,\n  ...props\n}: Props) => {\n  const generatedId = React.useId();\n  const inputId = id ?? generatedId;\n  const { componentSize } = useConfig();\n  const isValidLength = Number.isSafeInteger(length) && length > 0;\n  const count = isValidLength ? length : 6;\n\n  React.useEffect(() => {\n    if (process.env.NODE_ENV !== 'production' && !isValidLength) {\n      console.warn(\n        'Input.OTP length must be a positive safe integer; using six.',\n      );\n    }\n  }, [isValidLength, length]);\n\n  return (\n    <div data-slot=\"input-otp\">\n      {label && (\n        <label\n          htmlFor={inputId}\n          className={cn(\n            'mb-1.5 block text-sm font-medium',\n            classNames?.label,\n            //\n          )}\n        >\n          {label}\n        </label>\n      )}\n      <OTPField.Root\n        {...props}\n        id={inputId}\n        length={count}\n        autoSubmit={false}\n        onValueChange={onChange}\n        onValueComplete={onComplete}\n        aria-describedby={describedBy}\n        className={cn(\n          'flex flex-wrap gap-2',\n          classNames?.group,\n          className,\n          //\n        )}\n      >\n        {Array.from({ length: count }, (_, index) => (\n          <OTPField.Input\n            key={index}\n            ref={index === 0 ? inputRef : undefined}\n            render={<Input />}\n            placeholder={placeholder}\n            aria-label={index === 0 ? ariaLabel : getSlotLabel(index, count)}\n            aria-labelledby={index === 0 ? labelledBy : undefined}\n            className={cn(\n              'shrink-0 px-0 text-center tabular-nums',\n              sizes[size ?? componentSize ?? 'middle'],\n              classNames?.input,\n              //\n            )}\n          />\n        ))}\n      </OTPField.Root>\n    </div>\n  );\n};\nexport default OTP;\n"],"mappings":";;;;;;;;AAaA,MAAM,QAAuC;CAC3C,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AA6BA,MAAM,OAAO,EACX,OACA,IACA,SAAS,GACT,MACA,UACA,YACA,UACA,aACA,gBAAgB,OAAO,UAAU,aAAa,QAAQ,EAAE,MAAM,SAC9D,WACA,YACA,cAAc,WACd,mBAAmB,YACnB,oBAAoB,aACpB,GAAG,YACQ;CACX,MAAM,cAAcA,QAAM,MAAM;CAChC,MAAM,UAAU,MAAM;CACtB,MAAM,EAAE,kBAAkB,UAAU;CACpC,MAAM,gBAAgB,OAAO,cAAc,MAAM,KAAK,SAAS;CAC/D,MAAM,QAAQ,gBAAgB,SAAS;CAEvC,QAAM,gBAAgB;EACpB,IAAI,QAAQ,IAAI,aAAa,gBAAgB,CAAC,eAC5C,QAAQ,KACN,8DACF;CAEJ,GAAG,CAAC,eAAe,MAAM,CAAC;CAE1B,OACE,qBAAC,OAAD;EAAK,aAAU;EAAf,UAAA,CACG,SACC,oBAAC,SAAD;GACE,SAAS;GACT,WAAW,GACT,oCACA,YAAY,KAEd;GAEC,UAAA;EACI,CAAA,GAET,oBAAC,SAAS,MAAV;GACE,GAAI;GACJ,IAAI;GACJ,QAAQ;GACR,YAAY;GACZ,eAAe;GACf,iBAAiB;GACjB,oBAAkB;GAClB,WAAW,GACT,wBACA,YAAY,OACZ,SAEF;GAEC,UAAA,MAAM,KAAK,EAAE,QAAQ,MAAM,IAAI,GAAG,UACjC,oBAAC,SAAS,OAAV;IAEE,KAAK,UAAU,IAAI,WAAW,KAAA;IAC9B,QAAQ,oBAAC,OAAD,CAAQ,CAAA;IACH;IACb,cAAY,UAAU,IAAI,YAAY,aAAa,OAAO,KAAK;IAC/D,mBAAiB,UAAU,IAAI,aAAa,KAAA;IAC5C,WAAW,GACT,0CACA,MAAM,QAAQ,iBAAiB,WAC/B,YAAY,KAEd;GACD,GAZM,KAYN,CACF;EACY,CAAA,CACZ;;AAET"}

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

@@ -1,11 +1,6 @@
 //#region src/components/atoms/input/search.d.ts
-interface Props extends React.ComponentPropsWithRef<'input'> {
+export interface Props extends React.ComponentPropsWithRef<'input'> {
   allowClear?: boolean;
-  onChange?: (e: React.ChangeEvent<HTMLInputElement> | {
-    target: {
-      value: string;
-    };
-  }) => void;
   onSearch?: (value: string) => void;
 }
 declare const Search: {
@@ -13,5 +8,5 @@ declare const Search: {
   displayName: string;
 };
 //#endregion
-export { Props, Search as default };
+export { Search as default };
 //# sourceMappingURL=search.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"search.d.mts","names":[],"sources":["../../../../src/components/atoms/input/search.tsx"],"mappings":";UAeiB,cAAc,MAAM;EACnC;EACA,YACE,GAAG,MAAM,YAAY;IAAsB;MAAU;;;EAEvD,YAAY;;cAGR;KAWH,KAAA,WAAA,cAAA,OAAA,UAAA,YAAA,UAAA,WAAA,YAAA,UAAA,cAAA,SAAA,wBAAK,IAAA"}
+{"version":3,"file":"search.d.mts","names":[],"sources":["../../../../src/components/atoms/input/search.tsx"],"mappings":";iBAeiB,cAAc,MAAM;EACnC;EACA,YAAY;;cAGR;KAWH,KAAA,WAAA,cAAA,OAAA,UAAA,YAAA,UAAA,WAAA,YAAA,UAAA,cAAA,SAAA,wBAAK,IAAA"}

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

@@ -1,12 +1,12 @@
 "use client";
 import { cn } from "../../../utils.mjs";
 import { DEFAULT_LOCALE, useConfig } from "../../../providers/config/context.mjs";
-import { input_exports } from "../../../core/input.mjs";
 import Button from "../../../Button.mjs";
+import { input_exports } from "../../../core/input.mjs";
 import { useRef, useState } from "react";
-import { CircleX, Search } from "lucide-react";
 import { useMergedRef } from "@jbpark/use-hooks";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { CircleX, Search } from "lucide-react";
 //#region src/components/atoms/input/search.tsx
 const { Input: Core } = input_exports;
 const Search$1 = ({ ref, className, defaultValue, value, disabled, allowClear = true, onChange, onKeyDown: _onKeyDown, onSearch: _onSearch, ...props }) => {
@@ -16,12 +16,10 @@ const Search$1 = ({ ref, className, defaultValue, value, disabled, allowClear =
 	const [uncontrolledHasValue, setUncontrolledHasValue] = useState(!!defaultValue);
 	const hasValue = value !== void 0 ? !!value : uncontrolledHasValue;
 	const onClear = () => {
-		if (!inputRef.current) return;
-		if (value === void 0) {
-			inputRef.current.value = "";
-			setUncontrolledHasValue(false);
-		}
-		onChange?.({ target: { value: "" } });
+		const input = inputRef.current;
+		if (!input) return;
+		(Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), "value")?.set)?.call(input, "");
+		input.dispatchEvent(new Event("input", { bubbles: true }));
 	};
 	const onSearch = () => {
 		if (disabled) return;

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

@@ -1 +1 @@
-{"version":3,"file":"search.mjs","names":["input","Search","SearchOutlined"],"sources":["../../../../src/components/atoms/input/search.tsx"],"sourcesContent":["'use client';\n\nimport { useRef, useState } from 'react';\n\nimport { useMergedRef } from '@jbpark/use-hooks';\nimport { CircleX, Search as SearchOutlined } from 'lucide-react';\n\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { input } from '../../../core';\nimport Button from '../button';\n\nconst { Input: Core } = input;\n\nexport interface Props extends React.ComponentPropsWithRef<'input'> {\n  allowClear?: boolean;\n  onChange?: (\n    e: React.ChangeEvent<HTMLInputElement> | { target: { value: string } },\n  ) => void;\n  onSearch?: (value: string) => void;\n}\n\nconst Search = ({\n  ref,\n  className,\n  defaultValue,\n  value,\n  disabled,\n  allowClear = true,\n  onChange,\n  onKeyDown: _onKeyDown,\n  onSearch: _onSearch,\n  ...props\n}: Props) => {\n  const { locale } = useConfig();\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const mergedRef = useMergedRef(inputRef, ref);\n\n  const [uncontrolledHasValue, setUncontrolledHasValue] =\n    useState(!!defaultValue);\n  const hasValue = value !== undefined ? !!value : uncontrolledHasValue;\n\n  const onClear = () => {\n    if (!inputRef.current) {\n      return;\n    }\n\n    if (value === undefined) {\n      inputRef.current.value = '';\n      setUncontrolledHasValue(false);\n    }\n\n    onChange?.({ target: { value: '' } });\n  };\n\n  const onSearch = () => {\n    if (disabled) {\n      return;\n    }\n    if (inputRef.current) {\n      _onSearch?.(inputRef.current.value);\n    }\n  };\n\n  return (\n    <div\n      data-slot=\"input-search\"\n      className={cn(\n        'flex items-center',\n        'rounded-md',\n        className,\n        //\n      )}\n    >\n      <div\n        className={cn(\n          'relative grow',\n          'inline-flex items-center',\n          //\n        )}\n      >\n        <Core\n          {...props}\n          ref={mergedRef}\n          inputMode=\"search\"\n          type=\"search\"\n          enterKeyHint=\"search\"\n          disabled={disabled}\n          className={cn(\n            'rounded-r-none',\n            '[&::-webkit-search-cancel-button]:hidden',\n            '[&::-webkit-search-decoration]:hidden',\n            //\n          )}\n          value={value}\n          defaultValue={defaultValue}\n          onChange={e => {\n            if (value === undefined) {\n              setUncontrolledHasValue(!!e.target.value);\n            }\n            onChange?.(e);\n          }}\n          onKeyDown={e => {\n            _onKeyDown?.(e);\n            if (e.key === 'Enter') {\n              onSearch();\n            }\n          }}\n        />\n        <button\n          type=\"button\"\n          data-slot=\"input-search-clear\"\n          aria-label={locale.clear ?? DEFAULT_LOCALE.clear}\n          disabled={disabled}\n          className={cn(\n            'absolute right-2',\n            'shrink-0 cursor-pointer',\n            'disabled:cursor-not-allowed disabled:opacity-50',\n            (!allowClear || !hasValue) && 'hidden',\n          )}\n          onClick={onClear}\n        >\n          <CircleX className=\"size-4\" />\n        </button>\n      </div>\n      <Button\n        icon={<SearchOutlined />}\n        disabled={disabled}\n        className={cn(\n          'rounded-l-none',\n          'size-9',\n          //\n        )}\n        onClick={onSearch}\n      />\n    </div>\n  );\n};\n\nSearch.displayName = 'Search';\n\nexport default Search;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,EAAE,OAAO,SAASA;AAUxB,MAAMC,YAAU,EACd,KACA,WACA,cACA,OACA,UACA,aAAa,MACb,UACA,WAAW,YACX,UAAU,WACV,GAAG,YACQ;CACX,MAAM,EAAE,WAAW,UAAU;CAC7B,MAAM,WAAW,OAAyB,IAAI;CAE9C,MAAM,YAAY,aAAa,UAAU,GAAG;CAE5C,MAAM,CAAC,sBAAsB,2BAC3B,SAAS,CAAC,CAAC,YAAY;CACzB,MAAM,WAAW,UAAU,KAAA,IAAY,CAAC,CAAC,QAAQ;CAEjD,MAAM,gBAAgB;EACpB,IAAI,CAAC,SAAS,SACZ;EAGF,IAAI,UAAU,KAAA,GAAW;GACvB,SAAS,QAAQ,QAAQ;GACzB,wBAAwB,KAAK;EAC/B;EAEA,WAAW,EAAE,QAAQ,EAAE,OAAO,GAAG,EAAE,CAAC;CACtC;CAEA,MAAM,iBAAiB;EACrB,IAAI,UACF;EAEF,IAAI,SAAS,SACX,YAAY,SAAS,QAAQ,KAAK;CAEtC;CAEA,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qBACA,cACA,SAEF;EAPF,UAAA,CASE,qBAAC,OAAD;GACE,WAAW,GACT,iBACA,0BAEF;GALF,UAAA,CAOE,oBAAC,MAAD;IACE,GAAI;IACJ,KAAK;IACL,WAAU;IACV,MAAK;IACL,cAAa;IACH;IACV,WAAW,GACT,kBACA,4CACA,uCAEF;IACO;IACO;IACd,WAAU,MAAK;KACb,IAAI,UAAU,KAAA,GACZ,wBAAwB,CAAC,CAAC,EAAE,OAAO,KAAK;KAE1C,WAAW,CAAC;IACd;IACA,YAAW,MAAK;KACd,aAAa,CAAC;KACd,IAAI,EAAE,QAAQ,SACZ,SAAS;IAEb;GACD,CAAA,GACD,oBAAC,UAAD;IACE,MAAK;IACL,aAAU;IACV,cAAY,OAAO,SAAS,eAAe;IACjC;IACV,WAAW,GACT,oBACA,2BACA,oDACC,CAAC,cAAc,CAAC,aAAa,QAChC;IACA,SAAS;IAET,UAAA,oBAAC,SAAD,EAAS,WAAU,SAAU,CAAA;GACvB,CAAA,CACL;EACL,CAAA,GAAA,oBAAC,QAAD;GACE,MAAM,oBAACC,QAAD,CAAiB,CAAA;GACb;GACV,WAAW,GACT,kBACA,QAEF;GACA,SAAS;EACV,CAAA,CACE;;AAET;AAEA,SAAO,cAAc"}
+{"version":3,"file":"search.mjs","names":["input","Search","SearchOutlined"],"sources":["../../../../src/components/atoms/input/search.tsx"],"sourcesContent":["'use client';\n\nimport { useRef, useState } from 'react';\n\nimport { useMergedRef } from '@jbpark/use-hooks';\nimport { CircleX, Search as SearchOutlined } from 'lucide-react';\n\nimport { DEFAULT_LOCALE, useConfig } from '@repo/ui/providers';\nimport { cn } from '@repo/ui/utils';\n\nimport { input } from '../../../core';\nimport Button from '../button';\n\nconst { Input: Core } = input;\n\nexport interface Props extends React.ComponentPropsWithRef<'input'> {\n  allowClear?: boolean;\n  onSearch?: (value: string) => void;\n}\n\nconst Search = ({\n  ref,\n  className,\n  defaultValue,\n  value,\n  disabled,\n  allowClear = true,\n  onChange,\n  onKeyDown: _onKeyDown,\n  onSearch: _onSearch,\n  ...props\n}: Props) => {\n  const { locale } = useConfig();\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const mergedRef = useMergedRef(inputRef, ref);\n\n  const [uncontrolledHasValue, setUncontrolledHasValue] =\n    useState(!!defaultValue);\n  const hasValue = value !== undefined ? !!value : uncontrolledHasValue;\n\n  const onClear = () => {\n    const input = inputRef.current;\n\n    if (!input) {\n      return;\n    }\n\n    // Use the native setter so React detects the value change and emits the\n    // same ChangeEvent as typing, including for controlled inputs.\n    const setter = Object.getOwnPropertyDescriptor(\n      Object.getPrototypeOf(input),\n      'value',\n    )?.set;\n\n    setter?.call(input, '');\n    input.dispatchEvent(new Event('input', { bubbles: true }));\n  };\n\n  const onSearch = () => {\n    if (disabled) {\n      return;\n    }\n    if (inputRef.current) {\n      _onSearch?.(inputRef.current.value);\n    }\n  };\n\n  return (\n    <div\n      data-slot=\"input-search\"\n      className={cn(\n        'flex items-center',\n        'rounded-md',\n        className,\n        //\n      )}\n    >\n      <div\n        className={cn(\n          'relative grow',\n          'inline-flex items-center',\n          //\n        )}\n      >\n        <Core\n          {...props}\n          ref={mergedRef}\n          inputMode=\"search\"\n          type=\"search\"\n          enterKeyHint=\"search\"\n          disabled={disabled}\n          className={cn(\n            'rounded-r-none',\n            '[&::-webkit-search-cancel-button]:hidden',\n            '[&::-webkit-search-decoration]:hidden',\n            //\n          )}\n          value={value}\n          defaultValue={defaultValue}\n          onChange={e => {\n            if (value === undefined) {\n              setUncontrolledHasValue(!!e.target.value);\n            }\n            onChange?.(e);\n          }}\n          onKeyDown={e => {\n            _onKeyDown?.(e);\n            if (e.key === 'Enter') {\n              onSearch();\n            }\n          }}\n        />\n        <button\n          type=\"button\"\n          data-slot=\"input-search-clear\"\n          aria-label={locale.clear ?? DEFAULT_LOCALE.clear}\n          disabled={disabled}\n          className={cn(\n            'absolute right-2',\n            'shrink-0 cursor-pointer',\n            'disabled:cursor-not-allowed disabled:opacity-50',\n            (!allowClear || !hasValue) && 'hidden',\n          )}\n          onClick={onClear}\n        >\n          <CircleX className=\"size-4\" />\n        </button>\n      </div>\n      <Button\n        icon={<SearchOutlined />}\n        disabled={disabled}\n        className={cn(\n          'rounded-l-none',\n          'size-9',\n          //\n        )}\n        onClick={onSearch}\n      />\n    </div>\n  );\n};\n\nSearch.displayName = 'Search';\n\nexport default Search;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,EAAE,OAAO,SAASA;AAOxB,MAAMC,YAAU,EACd,KACA,WACA,cACA,OACA,UACA,aAAa,MACb,UACA,WAAW,YACX,UAAU,WACV,GAAG,YACQ;CACX,MAAM,EAAE,WAAW,UAAU;CAC7B,MAAM,WAAW,OAAyB,IAAI;CAE9C,MAAM,YAAY,aAAa,UAAU,GAAG;CAE5C,MAAM,CAAC,sBAAsB,2BAC3B,SAAS,CAAC,CAAC,YAAY;CACzB,MAAM,WAAW,UAAU,KAAA,IAAY,CAAC,CAAC,QAAQ;CAEjD,MAAM,gBAAgB;EACpB,MAAM,QAAQ,SAAS;EAEvB,IAAI,CAAC,OACH;EAUF,CALe,OAAO,yBACpB,OAAO,eAAe,KAAK,GAC3B,OACF,CAAC,EAAE,IAAA,EAEK,KAAK,OAAO,EAAE;EACtB,MAAM,cAAc,IAAI,MAAM,SAAS,EAAE,SAAS,KAAK,CAAC,CAAC;CAC3D;CAEA,MAAM,iBAAiB;EACrB,IAAI,UACF;EAEF,IAAI,SAAS,SACX,YAAY,SAAS,QAAQ,KAAK;CAEtC;CAEA,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qBACA,cACA,SAEF;EAPF,UAAA,CASE,qBAAC,OAAD;GACE,WAAW,GACT,iBACA,0BAEF;GALF,UAAA,CAOE,oBAAC,MAAD;IACE,GAAI;IACJ,KAAK;IACL,WAAU;IACV,MAAK;IACL,cAAa;IACH;IACV,WAAW,GACT,kBACA,4CACA,uCAEF;IACO;IACO;IACd,WAAU,MAAK;KACb,IAAI,UAAU,KAAA,GACZ,wBAAwB,CAAC,CAAC,EAAE,OAAO,KAAK;KAE1C,WAAW,CAAC;IACd;IACA,YAAW,MAAK;KACd,aAAa,CAAC;KACd,IAAI,EAAE,QAAQ,SACZ,SAAS;IAEb;GACD,CAAA,GACD,oBAAC,UAAD;IACE,MAAK;IACL,aAAU;IACV,cAAY,OAAO,SAAS,eAAe;IACjC;IACV,WAAW,GACT,oBACA,2BACA,oDACC,CAAC,cAAc,CAAC,aAAa,QAChC;IACA,SAAS;IAET,UAAA,oBAAC,SAAD,EAAS,WAAU,SAAU,CAAA;GACvB,CAAA,CACL;EACL,CAAA,GAAA,oBAAC,QAAD;GACE,MAAM,oBAACC,QAAD,CAAiB,CAAA;GACb;GACV,WAAW,GACT,kBACA,QAEF;GACA,SAAS;EACV,CAAA,CACE;;AAET;AAEA,SAAO,cAAc"}

package/dist/components/atoms/mentions-token.mjs

@@ -0,0 +1,31 @@
+//#region src/components/atoms/mentions-token.ts
+function findToken(text, start, end, prefixes) {
+	if (start < 0 || end < start || end > text.length) return null;
+	let boundary = start;
+	while (boundary > 0 && !/\s/u.test(text[boundary - 1])) boundary -= 1;
+	const beforeCaret = text.slice(boundary, start);
+	const prefix = prefixes.filter((candidate) => candidate.length > 0 && !/\s/u.test(candidate)).sort((a, b) => b.length - a.length).find((candidate) => beforeCaret.startsWith(candidate));
+	if (!prefix) return null;
+	let tokenEnd = start;
+	while (tokenEnd < text.length && !/\s/u.test(text[tokenEnd])) tokenEnd += 1;
+	if (end > tokenEnd) return null;
+	return {
+		start: boundary,
+		end: tokenEnd,
+		prefix,
+		query: beforeCaret.slice(prefix.length)
+	};
+}
+function insertToken(text, token, value) {
+	const mention = token.prefix + value;
+	const tail = text.slice(token.end);
+	const separator = tail.length === 0 || !/^\s/u.test(tail) ? " " : "";
+	return {
+		value: text.slice(0, token.start) + mention + separator + tail,
+		caret: token.start + mention.length + separator.length
+	};
+}
+//#endregion
+export { findToken, insertToken };
+
+//# sourceMappingURL=mentions-token.mjs.map

package/dist/components/atoms/mentions-token.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"mentions-token.mjs","names":[],"sources":["../../../src/components/atoms/mentions-token.ts"],"sourcesContent":["export interface Token {\n  start: number;\n  end: number;\n  prefix: string;\n  query: string;\n}\n\nexport function findToken(\n  text: string,\n  start: number,\n  end: number,\n  prefixes: readonly string[],\n): Token | null {\n  if (start < 0 || end < start || end > text.length) {\n    return null;\n  }\n\n  let boundary = start;\n\n  while (boundary > 0 && !/\\s/u.test(text[boundary - 1]!)) {\n    boundary -= 1;\n  }\n\n  const beforeCaret = text.slice(boundary, start);\n  const prefix = prefixes\n    .filter(candidate => candidate.length > 0 && !/\\s/u.test(candidate))\n    .sort((a, b) => b.length - a.length)\n    .find(candidate => beforeCaret.startsWith(candidate));\n\n  if (!prefix) {\n    return null;\n  }\n\n  let tokenEnd = start;\n\n  while (tokenEnd < text.length && !/\\s/u.test(text[tokenEnd]!)) {\n    tokenEnd += 1;\n  }\n\n  if (end > tokenEnd) {\n    return null;\n  }\n\n  return {\n    start: boundary,\n    end: tokenEnd,\n    prefix,\n    query: beforeCaret.slice(prefix.length),\n  };\n}\n\nexport function insertToken(text: string, token: Token, value: string) {\n  const mention = token.prefix + value;\n  const tail = text.slice(token.end);\n  const separator = tail.length === 0 || !/^\\s/u.test(tail) ? ' ' : '';\n\n  return {\n    value: text.slice(0, token.start) + mention + separator + tail,\n    caret: token.start + mention.length + separator.length,\n  };\n}\n"],"mappings":";AAOA,SAAgB,UACd,MACA,OACA,KACA,UACc;CACd,IAAI,QAAQ,KAAK,MAAM,SAAS,MAAM,KAAK,QACzC,OAAO;CAGT,IAAI,WAAW;CAEf,OAAO,WAAW,KAAK,CAAC,MAAM,KAAK,KAAK,WAAW,EAAG,GACpD,YAAY;CAGd,MAAM,cAAc,KAAK,MAAM,UAAU,KAAK;CAC9C,MAAM,SAAS,SACZ,QAAO,cAAa,UAAU,SAAS,KAAK,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CACnE,MAAM,GAAG,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC,CACnC,MAAK,cAAa,YAAY,WAAW,SAAS,CAAC;CAEtD,IAAI,CAAC,QACH,OAAO;CAGT,IAAI,WAAW;CAEf,OAAO,WAAW,KAAK,UAAU,CAAC,MAAM,KAAK,KAAK,SAAU,GAC1D,YAAY;CAGd,IAAI,MAAM,UACR,OAAO;CAGT,OAAO;EACL,OAAO;EACP,KAAK;EACL;EACA,OAAO,YAAY,MAAM,OAAO,MAAM;CACxC;AACF;AAEA,SAAgB,YAAY,MAAc,OAAc,OAAe;CACrE,MAAM,UAAU,MAAM,SAAS;CAC/B,MAAM,OAAO,KAAK,MAAM,MAAM,GAAG;CACjC,MAAM,YAAY,KAAK,WAAW,KAAK,CAAC,OAAO,KAAK,IAAI,IAAI,MAAM;CAElE,OAAO;EACL,OAAO,KAAK,MAAM,GAAG,MAAM,KAAK,IAAI,UAAU,YAAY;EAC1D,OAAO,MAAM,QAAQ,QAAQ,SAAS,UAAU;CAClD;AACF"}

package/dist/components/atoms/option-group.d.mts

@@ -1,15 +1,14 @@
 //#region src/components/atoms/option-group.d.ts
-type OptionValue = string | number | boolean;
-interface Option {
+export type OptionValue = string | number | boolean;
+export interface Option {
   label: string;
   value: OptionValue;
   disabled?: boolean;
 }
-type Options = string[] | number[] | boolean[] | Option[];
-interface OptionGroupClassNames {
+export type Options = string[] | number[] | boolean[] | Option[];
+export interface OptionGroupClassNames {
   wrapper?: string;
   item?: string;
 }
 //#endregion
-export { Option, OptionGroupClassNames, OptionValue, Options };
 //# sourceMappingURL=option-group.d.mts.map

package/dist/components/atoms/option-group.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"option-group.d.mts","names":[],"sources":["../../../src/components/atoms/option-group.ts"],"mappings":";KAAY;UAEK;EACf;EACA,OAAO;EACP;;KAGU,4CAA4C;UAEvC;EACf;EACA"}
+{"version":3,"file":"option-group.d.mts","names":[],"sources":["../../../src/components/atoms/option-group.ts"],"mappings":";YAAY;iBAEK;EACf;EACA,OAAO;EACP;;YAGU,4CAA4C;iBAEvC;EACf;EACA"}

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

@@ -1,6 +1,6 @@
 //#region src/components/atoms/popover.d.ts
 type Placement = 'top' | 'left' | 'right' | 'bottom' | 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom';
-interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'title' | 'content'> {
+export interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'title' | 'content'> {
   title?: React.ReactNode;
   /** Set to false when a custom trigger component renders a non-button element. */
   nativeButton?: boolean;
@@ -12,5 +12,5 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'title' | 'c
 }
 declare const Popover: ({ title, nativeButton, placement, className, content, children, open: _open, defaultOpen, onOpenChange, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Props, Popover as default };
+export { Popover as default };
 //# sourceMappingURL=popover.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"popover.d.mts","names":[],"sources":["../../../src/components/atoms/popover.tsx"],"mappings":";KAmBK;UAcY,cAAc,KAC7B,MAAM;EAGN,QAAQ,MAAM;;EAEd;EACA,YAAY;EACZ,SAAS,MAAM;EACf;EACA;EACA,gBAAgB;;cAqBZ,YAAW,OAAA,cAAA,WAAA,WAAA,SAAA,UAAA,MAAA,OAAA,aAAA,iBAAA,SAWd,0BAAK,IAAA"}
+{"version":3,"file":"popover.d.mts","names":[],"sources":["../../../src/components/atoms/popover.tsx"],"mappings":";KAmBK;iBAcY,cAAc,KAC7B,MAAM;EAGN,QAAQ,MAAM;;EAEd;EACA,YAAY;EACZ,SAAS,MAAM;EACf;EACA;EACA,gBAAgB;;cAqBZ,YAAW,OAAA,cAAA,WAAA,WAAA,SAAA,UAAA,MAAA,OAAA,aAAA,iBAAA,SAWd,0BAAK,IAAA"}

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

@@ -1,13 +1,15 @@
 //#region src/components/atoms/progress.d.ts
-interface Props extends React.ComponentPropsWithoutRef<'div'> {
+export interface Props extends React.ComponentPropsWithoutRef<'div'> {
   value: number;
+  orientation?: 'horizontal' | 'vertical';
+  /** @deprecated Use `orientation`. */
   direction?: 'horizontal' | 'vertical';
   classNames?: {
     background?: string;
     bar?: string;
   };
 }
-declare const Progress: ({ value, className, direction, classNames, ...props }: Props) => import("react").JSX.Element;
+declare const Progress: ({ value, className, orientation, direction, classNames, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Props, Progress as default };
+export { Progress as default };
 //# sourceMappingURL=progress.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"progress.d.mts","names":[],"sources":["../../../src/components/atoms/progress.tsx"],"mappings":";UAMiB,cAAc,MAAM;EACnC;EACA;EACA;IACE;IACA;;;cAIE,aAAY,OAAA,WAAA,WAAA,eAAA,SAMf,0BAAK,IAAA"}
+{"version":3,"file":"progress.d.mts","names":[],"sources":["../../../src/components/atoms/progress.tsx"],"mappings":";iBAMiB,cAAc,MAAM;EACnC;EACA;;EAEA;EACA;IACE;IACA;;;cAIE,aAAY,OAAA,WAAA,aAAA,WAAA,eAAA,SAOf,0BAAK,IAAA"}

package/dist/components/atoms/progress.mjs

@@ -3,8 +3,8 @@ import { progress_exports } from "../../core/progress.mjs";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/atoms/progress.tsx
 const { Progress: Core } = progress_exports;
-const Progress = ({ value, className, direction = "horizontal", classNames, ...props }) => {
-	const isHorizontal = direction === "horizontal";
+const Progress = ({ value, className, orientation, direction = "horizontal", classNames, ...props }) => {
+	const isHorizontal = (orientation ?? direction) === "horizontal";
 	const normalizedValue = Number.isFinite(value) ? Math.min(100, Math.max(0, value)) : 0;
 	return /* @__PURE__ */ jsx(Core, {
 		...props,

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

@@ -1 +1 @@
-{"version":3,"file":"progress.mjs","names":["progress"],"sources":["../../../src/components/atoms/progress.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport { progress } from '../../core';\n\nconst { Progress: Core } = progress;\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  value: number;\n  direction?: 'horizontal' | 'vertical';\n  classNames?: {\n    background?: string;\n    bar?: string;\n  };\n}\n\nconst Progress = ({\n  value,\n  className,\n  direction = 'horizontal',\n  classNames,\n  ...props\n}: Props) => {\n  const isHorizontal = direction === 'horizontal';\n  const normalizedValue = Number.isFinite(value)\n    ? Math.min(100, Math.max(0, value))\n    : 0;\n\n  return (\n    <Core\n      {...props}\n      value={normalizedValue}\n      className={cn(\n        isHorizontal ? 'h-4 w-full' : 'flex h-full w-4 flex-col justify-end',\n        className,\n        classNames?.background,\n        //\n      )}\n      barClassName={cn('flex-none', classNames?.bar)}\n      barStyle={\n        isHorizontal\n          ? { width: `${normalizedValue}%` }\n          : { width: '100%', height: `${normalizedValue}%` }\n      }\n    />\n  );\n};\n\nexport default Progress;\n"],"mappings":";;;;AAIA,MAAM,EAAE,UAAU,SAASA;AAW3B,MAAM,YAAY,EAChB,OACA,WACA,YAAY,cACZ,YACA,GAAG,YACQ;CACX,MAAM,eAAe,cAAc;CACnC,MAAM,kBAAkB,OAAO,SAAS,KAAK,IACzC,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,IAChC;CAEJ,OACE,oBAAC,MAAD;EACE,GAAI;EACJ,OAAO;EACP,WAAW,GACT,eAAe,eAAe,wCAC9B,WACA,YAAY,UAEd;EACA,cAAc,GAAG,aAAa,YAAY,GAAG;EAC7C,UACE,eACI,EAAE,OAAO,GAAG,gBAAgB,GAAG,IAC/B;GAAE,OAAO;GAAQ,QAAQ,GAAG,gBAAgB;EAAG;CAEtD,CAAA;AAEL"}
+{"version":3,"file":"progress.mjs","names":["progress"],"sources":["../../../src/components/atoms/progress.tsx"],"sourcesContent":["import { cn } from '@repo/ui/utils';\n\nimport { progress } from '../../core';\n\nconst { Progress: Core } = progress;\n\nexport interface Props extends React.ComponentPropsWithoutRef<'div'> {\n  value: number;\n  orientation?: 'horizontal' | 'vertical';\n  /** @deprecated Use `orientation`. */\n  direction?: 'horizontal' | 'vertical';\n  classNames?: {\n    background?: string;\n    bar?: string;\n  };\n}\n\nconst Progress = ({\n  value,\n  className,\n  orientation,\n  direction = 'horizontal',\n  classNames,\n  ...props\n}: Props) => {\n  const isHorizontal = (orientation ?? direction) === 'horizontal';\n  const normalizedValue = Number.isFinite(value)\n    ? Math.min(100, Math.max(0, value))\n    : 0;\n\n  return (\n    <Core\n      {...props}\n      value={normalizedValue}\n      className={cn(\n        isHorizontal ? 'h-4 w-full' : 'flex h-full w-4 flex-col justify-end',\n        className,\n        classNames?.background,\n        //\n      )}\n      barClassName={cn('flex-none', classNames?.bar)}\n      barStyle={\n        isHorizontal\n          ? { width: `${normalizedValue}%` }\n          : { width: '100%', height: `${normalizedValue}%` }\n      }\n    />\n  );\n};\n\nexport default Progress;\n"],"mappings":";;;;AAIA,MAAM,EAAE,UAAU,SAASA;AAa3B,MAAM,YAAY,EAChB,OACA,WACA,aACA,YAAY,cACZ,YACA,GAAG,YACQ;CACX,MAAM,gBAAgB,eAAe,eAAe;CACpD,MAAM,kBAAkB,OAAO,SAAS,KAAK,IACzC,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,IAChC;CAEJ,OACE,oBAAC,MAAD;EACE,GAAI;EACJ,OAAO;EACP,WAAW,GACT,eAAe,eAAe,wCAC9B,WACA,YAAY,UAEd;EACA,cAAc,GAAG,aAAa,YAAY,GAAG;EAC7C,UACE,eACI,EAAE,OAAO,GAAG,gBAAgB,GAAG,IAC/B;GAAE,OAAO;GAAQ,QAAQ,GAAG,gBAAgB;EAAG;CAEtD,CAAA;AAEL"}

package/dist/components/atoms/radio/group.d.mts

@@ -1,6 +1,6 @@
 import { OptionGroupClassNames, OptionValue, Options } from "../option-group.mjs";
 //#region src/components/atoms/radio/group.d.ts
-interface Props extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onChange' | 'defaultValue' | 'value'> {
+export interface Props extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onChange' | 'defaultValue' | 'value'> {
   options?: Options;
   orientation?: 'vertical' | 'horizontal';
   placement?: 'left' | 'right';
@@ -17,5 +17,5 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'ul'>, 'onChange' |
 }
 declare const RadioGroup: ({ orientation, placement, className, classNames, options: _options, name, optionType, buttonStyle, size, disabled, defaultValue, value: _value, onChange: _onChange, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { type OptionValue, Props, RadioGroup as default };
+export { type OptionValue, RadioGroup as default };
 //# sourceMappingURL=group.d.mts.map

package/dist/components/atoms/radio/group.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"group.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/group.tsx"],"mappings":";;UA0BiB,cAAc,KAC7B,MAAM;EAGN,UAAU;EACV;EACA;EACA,aAAa;EACb,eAAe;EACf,QAAQ;;EAER;EACA;EACA;EACA;EACA;EACA,YAAY,OAAO;;cAGf,eAAc,aAAA,WAAA,WAAA,YAAA,SAAA,UAAA,MAAA,YAAA,aAAA,MAAA,UAAA,cAAA,OAAA,QAAA,UAAA,cAAA,SAejB,0BAAK,IAAA"}
+{"version":3,"file":"group.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/group.tsx"],"mappings":";;iBA0BiB,cAAc,KAC7B,MAAM;EAGN,UAAU;EACV;EACA;EACA,aAAa;EACb,eAAe;EACf,QAAQ;;EAER;EACA;EACA;EACA;EACA;EACA,YAAY,OAAO;;cAGf,eAAc,aAAA,WAAA,WAAA,YAAA,SAAA,UAAA,MAAA,YAAA,aAAA,MAAA,UAAA,cAAA,OAAA,QAAA,UAAA,cAAA,SAejB,0BAAK,IAAA"}

package/dist/components/atoms/radio/group.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../../../utils.mjs";
-import { radio_group_exports } from "../../../core/radio-group.mjs";
 import Button from "../../../Button.mjs";
+import { radio_group_exports } from "../../../core/radio-group.mjs";
 import { normalizeOptions, warnOnDuplicateOptionValues } from "../option-group.mjs";
 import { RadioGroupContext } from "./context.mjs";
 import Radio$1 from "./radio.mjs";

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/index.ts"],"mappings":";;;KAGK,wBAAwB;EAAc,cAAc;;cAEnD,OAAqB"}
+{"version":3,"file":"index.d.mts","names":["RadioImpl","Group"],"sources":["../../../../src/components/atoms/radio/index.ts"],"mappings":";;;KAGK,wBAAwBA;EAAc,cAAcC;;cAEnD,OAAqB"}

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

@@ -1,6 +1,6 @@
 import { OptionValue } from "../option-group.mjs";
 //#region src/components/atoms/radio/radio.d.ts
-interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {
+export interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'> {
   placement?: 'left' | 'right';
   defaultChecked?: boolean;
   checked?: boolean;
@@ -22,5 +22,5 @@ interface Props extends Omit<React.ComponentPropsWithoutRef<'div'>, 'onChange'>
 }
 declare const Radio: ({ placement, value: _value, children, className, icons, disabled, defaultChecked, checked: _checked, id: _id, name, onChange: _onChange, ...props }: Props) => import("react").JSX.Element;
 //#endregion
-export { Props, Radio as default };
+export { Radio as default };
 //# sourceMappingURL=radio.d.mts.map

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

@@ -1 +1 @@
-{"version":3,"file":"radio.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/radio.tsx"],"mappings":";;UAoBiB,cAAc,KAC7B,MAAM;EAGN;EACA;EACA;EACA,QAAQ;;EAER;EACA;;;;;;EAMA;EACA,QAAQ;IAAU,SAAS,MAAM;IAAW,WAAW,MAAM;;EAC7D,YAAY;;cAGR,UAAS,WAAA,OAAA,QAAA,UAAA,WAAA,OAAA,UAAA,gBAAA,SAAA,UAAA,IAAA,KAAA,MAAA,UAAA,cAAA,SAaZ,0BAAK,IAAA"}
+{"version":3,"file":"radio.d.mts","names":[],"sources":["../../../../src/components/atoms/radio/radio.tsx"],"mappings":";;iBAoBiB,cAAc,KAC7B,MAAM;EAGN;EACA;EACA;EACA,QAAQ;;EAER;EACA;;;;;;EAMA;EACA,QAAQ;IAAU,SAAS,MAAM;IAAW,WAAW,MAAM;;EAC7D,YAAY;;cAGR,UAAS,WAAA,OAAA,QAAA,UAAA,WAAA,OAAA,UAAA,gBAAA,SAAA,UAAA,IAAA,KAAA,MAAA,UAAA,cAAA,SAaZ,0BAAK,IAAA"}

package/dist/components/atoms/radio/radio.mjs

@@ -4,9 +4,9 @@ import { field_exports } from "../../../core/field.mjs";
 import { radio_group_exports } from "../../../core/radio-group.mjs";
 import { RadioGroupContext } from "./context.mjs";
 import { useContext, useId, useRef } from "react";
-import { Circle, CircleCheck } from "lucide-react";
 import { useControllableState, useKeyPress } from "@jbpark/use-hooks";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Circle, CircleCheck } from "lucide-react";
 //#region src/components/atoms/radio/radio.tsx
 const { RadioGroup: Core, RadioGroupItem: Item } = radio_group_exports;
 const { Field, FieldLabel } = field_exports;

package/dist/components/atoms/rich-text-editor/rich-text-editor.d.mts

@@ -1,6 +1,6 @@
 import { ToolbarItem, ToolbarPreset } from "./types.mjs";
 //#region src/components/atoms/rich-text-editor/rich-text-editor.d.ts
-interface Props {
+export interface Props {
   value?: string;
   placeholder?: string;
   className?: string;
@@ -16,9 +16,14 @@ interface Props {
   toolbar?: boolean | ToolbarPreset[];
   /** Extra buttons appended after the built-in presets. */
   toolbarItems?: ToolbarItem[];
+  /** Called after each document edit with the current HTML. */
+  onUpdate?: (value: string) => void;
+  /** Called when the editor loses focus with the current HTML. */
+  onCommit?: (value: string) => void;
+  /** @deprecated Use `onCommit` for the existing blur-only behavior. */
   onChange?: (value: string) => void;
 }
-declare const RichTextEditor: ({ value, placeholder, className, classNames, toolbar, toolbarItems, onChange }: Props) => import("react").JSX.Element;
+declare const RichTextEditor: ({ value, placeholder, className, classNames, toolbar, toolbarItems, onUpdate, onCommit, onChange }: Props) => import("react").JSX.Element;
 //#endregion
-export { Props, RichTextEditor as default };
+export { RichTextEditor as default };
 //# sourceMappingURL=rich-text-editor.d.mts.map

package/dist/components/atoms/rich-text-editor/rich-text-editor.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"rich-text-editor.d.mts","names":[],"sources":["../../../../src/components/atoms/rich-text-editor/rich-text-editor.tsx"],"mappings":";;UAgBiB;EACf;EACA;EACA;EACA;IACE;IACA;;;;;;;EAOF,oBAAoB;;EAEpB,eAAe;EACf,YAAY;;cAGR,mBAAkB,OAAA,aAAA,WAAA,YAAA,SAAA,cAAA,YAQrB,0BAAK,IAAA"}
+{"version":3,"file":"rich-text-editor.d.mts","names":[],"sources":["../../../../src/components/atoms/rich-text-editor/rich-text-editor.tsx"],"mappings":";;iBAgBiB;EACf;EACA;EACA;EACA;IACE;IACA;;;;;;;EAOF,oBAAoB;;EAEpB,eAAe;;EAEf,YAAY;;EAEZ,YAAY;;EAEZ,YAAY;;cAGR,mBAAkB,OAAA,aAAA,WAAA,YAAA,SAAA,cAAA,UAAA,UAAA,YAUrB,0BAAK,IAAA"}

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

@@ -10,7 +10,7 @@ import { TextStyleKit } from "@tiptap/extension-text-style";
 import { EditorContent, useEditor } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
 //#region src/components/atoms/rich-text-editor/rich-text-editor.tsx
-const RichTextEditor = ({ value = "", placeholder = "Enter text...", className, classNames, toolbar = false, toolbarItems, onChange }) => {
+const RichTextEditor = ({ value = "", placeholder = "Enter text...", className, classNames, toolbar = false, toolbarItems, onUpdate, onCommit, onChange }) => {
 	const presets = toolbar === true ? DEFAULT_TOOLBAR_PRESETS : toolbar || [];
 	const showToolbar = presets.length > 0 || (toolbarItems?.length ?? 0) > 0;
 	const editor = useEditor({
@@ -25,8 +25,13 @@ const RichTextEditor = ({ value = "", placeholder = "Enter text...", className,
 			})
 		],
 		content: value,
+		onUpdate: ({ editor: e }) => {
+			onUpdate?.(e.getHTML());
+		},
 		onBlur: ({ editor: e }) => {
-			onChange?.(e.getHTML());
+			const html = e.getHTML();
+			onCommit?.(html);
+			onChange?.(html);
 		},
 		shouldRerenderOnTransaction: showToolbar
 	});

package/dist/components/atoms/rich-text-editor/rich-text-editor.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"rich-text-editor.mjs","names":[],"sources":["../../../../src/components/atoms/rich-text-editor/rich-text-editor.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect } from 'react';\n\nimport Placeholder from '@tiptap/extension-placeholder';\nimport { TextStyleKit } from '@tiptap/extension-text-style';\nimport { EditorContent, useEditor } from '@tiptap/react';\nimport StarterKit from '@tiptap/starter-kit';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { RICH_TEXT_CONTENT_CLASSES } from './content-classes';\nimport Toolbar from './toolbar';\nimport { DEFAULT_TOOLBAR_PRESETS } from './toolbar-presets';\nimport type { ToolbarItem, ToolbarPreset } from './types';\n\nexport interface Props {\n  value?: string;\n  placeholder?: string;\n  className?: string;\n  classNames?: {\n    toolbar?: string;\n    content?: string;\n  };\n  /**\n   * `true` shows every built-in preset; an array shows only the listed\n   * presets, in the given order. Omitted or `false` renders no toolbar,\n   * matching the original (toolbar-less) output.\n   */\n  toolbar?: boolean | ToolbarPreset[];\n  /** Extra buttons appended after the built-in presets. */\n  toolbarItems?: ToolbarItem[];\n  onChange?: (value: string) => void;\n}\n\nconst RichTextEditor = ({\n  value = '',\n  placeholder = 'Enter text...',\n  className,\n  classNames,\n  toolbar = false,\n  toolbarItems,\n  onChange,\n}: Props) => {\n  const presets = toolbar === true ? DEFAULT_TOOLBAR_PRESETS : toolbar || [];\n  const showToolbar = presets.length > 0 || (toolbarItems?.length ?? 0) > 0;\n\n  const editor = useEditor({\n    // SSR renders every exported component without effects running, so the\n    // editor must not touch the DOM during that first pass — deferring\n    // creation to mount keeps `renderToStaticMarkup` from throwing.\n    immediatelyRender: false,\n    extensions: [\n      StarterKit,\n      Placeholder.configure({ placeholder }),\n      TextStyleKit.configure({\n        fontFamily: false,\n        lineHeight: false,\n        backgroundColor: false,\n      }),\n    ],\n    content: value,\n    onBlur: ({ editor: e }) => {\n      onChange?.(e.getHTML());\n    },\n    // @tiptap/react v3 only re-renders on selection/transaction changes when\n    // explicitly opted in — the toolbar's isActive()/getAttributes() reads\n    // need that to reflect the caret position live.\n    shouldRerenderOnTransaction: showToolbar,\n  });\n\n  useEffect(() => {\n    if (!editor) {\n      return;\n    }\n\n    const current = editor.getHTML();\n\n    if (current !== value) {\n      editor.commands.setContent(value, { emitUpdate: false });\n    }\n  }, [value, editor]);\n\n  return (\n    <div\n      data-slot=\"rich-text-editor\"\n      className={cn(\n        'border-input bg-background text-foreground rounded border text-sm',\n        className,\n        //\n      )}\n    >\n      {showToolbar && editor && (\n        <Toolbar\n          editor={editor}\n          presets={presets}\n          items={toolbarItems}\n          className={classNames?.toolbar}\n        />\n      )}\n      <div\n        data-slot=\"rich-text-editor-content\"\n        className={cn(\n          'min-h-20 px-3 py-2',\n          RICH_TEXT_CONTENT_CLASSES,\n          classNames?.content,\n          //\n        )}\n      >\n        <EditorContent editor={editor} />\n      </div>\n    </div>\n  );\n};\n\nexport default RichTextEditor;\n"],"mappings":";;;;;;;;;;;;AAmCA,MAAM,kBAAkB,EACtB,QAAQ,IACR,cAAc,iBACd,WACA,YACA,UAAU,OACV,cACA,eACW;CACX,MAAM,UAAU,YAAY,OAAO,0BAA0B,WAAW,CAAC;CACzE,MAAM,cAAc,QAAQ,SAAS,MAAM,cAAc,UAAU,KAAK;CAExE,MAAM,SAAS,UAAU;EAIvB,mBAAmB;EACnB,YAAY;GACV;GACA,YAAY,UAAU,EAAE,YAAY,CAAC;GACrC,aAAa,UAAU;IACrB,YAAY;IACZ,YAAY;IACZ,iBAAiB;GACnB,CAAC;EACH;EACA,SAAS;EACT,SAAS,EAAE,QAAQ,QAAQ;GACzB,WAAW,EAAE,QAAQ,CAAC;EACxB;EAIA,6BAA6B;CAC/B,CAAC;CAED,gBAAgB;EACd,IAAI,CAAC,QACH;EAKF,IAFgB,OAAO,QAEb,MAAM,OACd,OAAO,SAAS,WAAW,OAAO,EAAE,YAAY,MAAM,CAAC;CAE3D,GAAG,CAAC,OAAO,MAAM,CAAC;CAElB,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qEACA,SAEF;EANF,UAAA,CAQG,eAAe,UACd,oBAAC,SAAD;GACU;GACC;GACT,OAAO;GACP,WAAW,YAAY;EACxB,CAAA,GAEH,oBAAC,OAAD;GACE,aAAU;GACV,WAAW,GACT,sBACA,2BACA,YAAY,OAEd;GAEA,UAAA,oBAAC,eAAD,EAAuB,OAAS,CAAA;EAC7B,CAAA,CACF;;AAET"}
+{"version":3,"file":"rich-text-editor.mjs","names":[],"sources":["../../../../src/components/atoms/rich-text-editor/rich-text-editor.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect } from 'react';\n\nimport Placeholder from '@tiptap/extension-placeholder';\nimport { TextStyleKit } from '@tiptap/extension-text-style';\nimport { EditorContent, useEditor } from '@tiptap/react';\nimport StarterKit from '@tiptap/starter-kit';\n\nimport { cn } from '@repo/ui/utils';\n\nimport { RICH_TEXT_CONTENT_CLASSES } from './content-classes';\nimport Toolbar from './toolbar';\nimport { DEFAULT_TOOLBAR_PRESETS } from './toolbar-presets';\nimport type { ToolbarItem, ToolbarPreset } from './types';\n\nexport interface Props {\n  value?: string;\n  placeholder?: string;\n  className?: string;\n  classNames?: {\n    toolbar?: string;\n    content?: string;\n  };\n  /**\n   * `true` shows every built-in preset; an array shows only the listed\n   * presets, in the given order. Omitted or `false` renders no toolbar,\n   * matching the original (toolbar-less) output.\n   */\n  toolbar?: boolean | ToolbarPreset[];\n  /** Extra buttons appended after the built-in presets. */\n  toolbarItems?: ToolbarItem[];\n  /** Called after each document edit with the current HTML. */\n  onUpdate?: (value: string) => void;\n  /** Called when the editor loses focus with the current HTML. */\n  onCommit?: (value: string) => void;\n  /** @deprecated Use `onCommit` for the existing blur-only behavior. */\n  onChange?: (value: string) => void;\n}\n\nconst RichTextEditor = ({\n  value = '',\n  placeholder = 'Enter text...',\n  className,\n  classNames,\n  toolbar = false,\n  toolbarItems,\n  onUpdate,\n  onCommit,\n  onChange,\n}: Props) => {\n  const presets = toolbar === true ? DEFAULT_TOOLBAR_PRESETS : toolbar || [];\n  const showToolbar = presets.length > 0 || (toolbarItems?.length ?? 0) > 0;\n\n  const editor = useEditor({\n    // SSR renders every exported component without effects running, so the\n    // editor must not touch the DOM during that first pass — deferring\n    // creation to mount keeps `renderToStaticMarkup` from throwing.\n    immediatelyRender: false,\n    extensions: [\n      StarterKit,\n      Placeholder.configure({ placeholder }),\n      TextStyleKit.configure({\n        fontFamily: false,\n        lineHeight: false,\n        backgroundColor: false,\n      }),\n    ],\n    content: value,\n    onUpdate: ({ editor: e }) => {\n      onUpdate?.(e.getHTML());\n    },\n    onBlur: ({ editor: e }) => {\n      const html = e.getHTML();\n\n      onCommit?.(html);\n      onChange?.(html);\n    },\n    // @tiptap/react v3 only re-renders on selection/transaction changes when\n    // explicitly opted in — the toolbar's isActive()/getAttributes() reads\n    // need that to reflect the caret position live.\n    shouldRerenderOnTransaction: showToolbar,\n  });\n\n  useEffect(() => {\n    if (!editor) {\n      return;\n    }\n\n    const current = editor.getHTML();\n\n    if (current !== value) {\n      editor.commands.setContent(value, { emitUpdate: false });\n    }\n  }, [value, editor]);\n\n  return (\n    <div\n      data-slot=\"rich-text-editor\"\n      className={cn(\n        'border-input bg-background text-foreground rounded border text-sm',\n        className,\n        //\n      )}\n    >\n      {showToolbar && editor && (\n        <Toolbar\n          editor={editor}\n          presets={presets}\n          items={toolbarItems}\n          className={classNames?.toolbar}\n        />\n      )}\n      <div\n        data-slot=\"rich-text-editor-content\"\n        className={cn(\n          'min-h-20 px-3 py-2',\n          RICH_TEXT_CONTENT_CLASSES,\n          classNames?.content,\n          //\n        )}\n      >\n        <EditorContent editor={editor} />\n      </div>\n    </div>\n  );\n};\n\nexport default RichTextEditor;\n"],"mappings":";;;;;;;;;;;;AAwCA,MAAM,kBAAkB,EACtB,QAAQ,IACR,cAAc,iBACd,WACA,YACA,UAAU,OACV,cACA,UACA,UACA,eACW;CACX,MAAM,UAAU,YAAY,OAAO,0BAA0B,WAAW,CAAC;CACzE,MAAM,cAAc,QAAQ,SAAS,MAAM,cAAc,UAAU,KAAK;CAExE,MAAM,SAAS,UAAU;EAIvB,mBAAmB;EACnB,YAAY;GACV;GACA,YAAY,UAAU,EAAE,YAAY,CAAC;GACrC,aAAa,UAAU;IACrB,YAAY;IACZ,YAAY;IACZ,iBAAiB;GACnB,CAAC;EACH;EACA,SAAS;EACT,WAAW,EAAE,QAAQ,QAAQ;GAC3B,WAAW,EAAE,QAAQ,CAAC;EACxB;EACA,SAAS,EAAE,QAAQ,QAAQ;GACzB,MAAM,OAAO,EAAE,QAAQ;GAEvB,WAAW,IAAI;GACf,WAAW,IAAI;EACjB;EAIA,6BAA6B;CAC/B,CAAC;CAED,gBAAgB;EACd,IAAI,CAAC,QACH;EAKF,IAFgB,OAAO,QAEb,MAAM,OACd,OAAO,SAAS,WAAW,OAAO,EAAE,YAAY,MAAM,CAAC;CAE3D,GAAG,CAAC,OAAO,MAAM,CAAC;CAElB,OACE,qBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,qEACA,SAEF;EANF,UAAA,CAQG,eAAe,UACd,oBAAC,SAAD;GACU;GACC;GACT,OAAO;GACP,WAAW,YAAY;EACxB,CAAA,GAEH,oBAAC,OAAD;GACE,aAAU;GACV,WAAW,GACT,sBACA,2BACA,YAAY,OAEd;GAEA,UAAA,oBAAC,eAAD,EAAuB,OAAS,CAAA;EAC7B,CAAA,CACF;;AAET"}

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

@@ -1,13 +1,13 @@
 "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/index.mjs";
 import ToolbarButton from "./toolbar-button.mjs";
 import Select from "../select.mjs";
 import { useState } from "react";
-import { Bold, Code, Code2, Italic, Link, List, ListOrdered, Minus, Quote, Redo2, Strikethrough, Underline, Undo2 } from "lucide-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";
 //#region src/components/atoms/rich-text-editor/toolbar-presets.tsx
 const FONT_SIZE_OPTIONS = [
 	{