@waveso/ui 0.0.10 → 0.1.0

package/dist/infinite-scroll.js

@@ -1,102 +1,72 @@
-import { Spinner } from './chunk-6Y7LPQMO.js';
-import './chunk-DIGOLJIR.js';
-import { cn } from './chunk-76UQO56T.js';
-import * as React from 'react';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-
-function InfiniteScroll({
-  onLoadMore,
-  hasMore,
-  isLoading = false,
-  direction = "down",
-  root,
-  rootMargin = "200px",
-  threshold = 0,
-  loader,
-  endMessage,
-  className,
-  children
-}) {
-  const sentinelRef = React.useRef(null);
-  const loadingRef = React.useRef(false);
-  const onLoadMoreRef = React.useRef(onLoadMore);
-  React.useEffect(() => {
-    onLoadMoreRef.current = onLoadMore;
-  }, [onLoadMore]);
-  React.useEffect(() => {
-    if (!isLoading) {
-      loadingRef.current = false;
-    }
-  }, [isLoading]);
-  React.useEffect(() => {
-    const sentinel2 = sentinelRef.current;
-    if (!sentinel2 || !hasMore) return;
-    const observer = new IntersectionObserver(
-      (entries) => {
-        const [entry] = entries;
-        if (entry?.isIntersecting && !loadingRef.current) {
-          loadingRef.current = true;
-          onLoadMoreRef.current();
-        }
-      },
-      {
-        root: root?.current ?? null,
-        rootMargin,
-        threshold
-      }
-    );
-    observer.observe(sentinel2);
-    return () => {
-      observer.disconnect();
-    };
-  }, [hasMore, root, rootMargin, threshold]);
-  const loaderContent = isLoading && /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "infinite-scroll-loader",
-      className: "flex items-center justify-center py-6",
-      children: loader ?? /* @__PURE__ */ jsx(Spinner, { className: "size-6 text-muted-foreground" })
-    }
-  );
-  const endContent = !hasMore && !isLoading && endMessage && /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "infinite-scroll-end",
-      className: "flex items-center justify-center py-6 text-sm text-muted-foreground",
-      children: endMessage
-    }
-  );
-  const sentinel = /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: sentinelRef,
-      "data-slot": "infinite-scroll-sentinel",
-      "aria-hidden": "true",
-      className: "h-px"
-    }
-  );
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-slot": "infinite-scroll",
-      "aria-busy": isLoading,
-      className: cn("flex flex-col", className),
-      children: [
-        direction === "up" && /* @__PURE__ */ jsxs(Fragment, { children: [
-          sentinel,
-          loaderContent
-        ] }),
-        children,
-        direction === "down" && /* @__PURE__ */ jsxs(Fragment, { children: [
-          sentinel,
-          loaderContent
-        ] }),
-        endContent
-      ]
-    }
-  );
+"use client";
+import { cn } from "./lib/utils.js";
+import { Spinner } from "./spinner.js";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/infinite-scroll.tsx
+function InfiniteScroll({ onLoadMore, hasMore, isLoading = false, direction = "down", root, rootMargin = "200px", threshold = 0, loader, endMessage, className, children }) {
+	const sentinelRef = React.useRef(null);
+	const loadingRef = React.useRef(false);
+	const onLoadMoreRef = React.useRef(onLoadMore);
+	React.useEffect(() => {
+		onLoadMoreRef.current = onLoadMore;
+	}, [onLoadMore]);
+	React.useEffect(() => {
+		if (!isLoading) loadingRef.current = false;
+	}, [isLoading]);
+	React.useEffect(() => {
+		const sentinel = sentinelRef.current;
+		if (!sentinel || !hasMore) return;
+		const observer = new IntersectionObserver((entries) => {
+			const [entry] = entries;
+			if (entry?.isIntersecting && !loadingRef.current) {
+				loadingRef.current = true;
+				onLoadMoreRef.current();
+			}
+		}, {
+			root: root?.current ?? null,
+			rootMargin,
+			threshold
+		});
+		observer.observe(sentinel);
+		return () => {
+			observer.disconnect();
+		};
+	}, [
+		hasMore,
+		root,
+		rootMargin,
+		threshold
+	]);
+	const loaderContent = isLoading && /* @__PURE__ */ jsx("div", {
+		"data-slot": "infinite-scroll-loader",
+		className: "flex items-center justify-center py-6",
+		children: loader ?? /* @__PURE__ */ jsx(Spinner, { className: "size-6 text-muted-foreground" })
+	});
+	const endContent = !hasMore && !isLoading && endMessage && /* @__PURE__ */ jsx("div", {
+		"data-slot": "infinite-scroll-end",
+		className: "flex items-center justify-center py-6 text-sm text-muted-foreground",
+		children: endMessage
+	});
+	const sentinel = /* @__PURE__ */ jsx("div", {
+		ref: sentinelRef,
+		"data-slot": "infinite-scroll-sentinel",
+		"aria-hidden": "true",
+		className: "h-px"
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "infinite-scroll",
+		"aria-busy": isLoading,
+		className: cn("flex flex-col", className),
+		children: [
+			direction === "up" && /* @__PURE__ */ jsxs(Fragment, { children: [sentinel, loaderContent] }),
+			children,
+			direction === "down" && /* @__PURE__ */ jsxs(Fragment, { children: [sentinel, loaderContent] }),
+			endContent
+		]
+	});
 }
-
+//#endregion
 export { InfiniteScroll };
-//# sourceMappingURL=infinite-scroll.js.map
+
 //# sourceMappingURL=infinite-scroll.js.map

package/dist/infinite-scroll.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/infinite-scroll.tsx"],"names":["sentinel"],"mappings":";;;;;;AAqBA,SAAS,cAAA,CAAe;AAAA,EACtB,UAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,SAAA,GAAY,MAAA;AAAA,EACZ,IAAA;AAAA,EACA,UAAA,GAAa,OAAA;AAAA,EACb,SAAA,GAAY,CAAA;AAAA,EACZ,MAAA;AAAA,EACA,UAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAAwB;AACtB,EAAA,MAAM,WAAA,GAAoB,aAAuB,IAAI,CAAA;AACrD,EAAA,MAAM,UAAA,GAAmB,aAAO,KAAK,CAAA;AAErC,EAAA,MAAM,aAAA,GAAsB,aAAO,UAAU,CAAA;AAC7C,EAAM,gBAAU,MAAM;AACpB,IAAA,aAAA,CAAc,OAAA,GAAU,UAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAM,gBAAU,MAAM;AACpB,IAAA,IAAI,CAAC,SAAA,EAAW;AACd,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB;AAAA,EACF,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAM,gBAAU,MAAM;AACpB,IAAA,MAAMA,YAAW,WAAA,CAAY,OAAA;AAC7B,IAAA,IAAI,CAACA,SAAAA,IAAY,CAAC,OAAA,EAAS;AAE3B,IAAA,MAAM,WAAW,IAAI,oBAAA;AAAA,MACnB,CAAC,OAAA,KAAY;AACX,QAAA,MAAM,CAAC,KAAK,CAAA,GAAI,OAAA;AAChB,QAAA,IAAI,KAAA,EAAO,cAAA,IAAkB,CAAC,UAAA,CAAW,OAAA,EAAS;AAChD,UAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,UAAA,aAAA,CAAc,OAAA,EAAQ;AAAA,QACxB;AAAA,MACF,CAAA;AAAA,MACA;AAAA,QACE,IAAA,EAAM,MAAM,OAAA,IAAW,IAAA;AAAA,QACvB,UAAA;AAAA,QACA;AAAA;AACF,KACF;AAEA,IAAA,QAAA,CAAS,QAAQA,SAAQ,CAAA;AAEzB,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,UAAA,EAAW;AAAA,IACtB,CAAA;AAAA,EACF,GAAG,CAAC,OAAA,EAAS,IAAA,EAAM,UAAA,EAAY,SAAS,CAAC,CAAA;AAEzC,EAAA,MAAM,gBAAgB,SAAA,oBACpB,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,wBAAA;AAAA,MACV,SAAA,EAAU,uCAAA;AAAA,MAET,QAAA,EAAA,MAAA,oBAAU,GAAA,CAAC,OAAA,EAAA,EAAQ,SAAA,EAAU,8BAAA,EAA+B;AAAA;AAAA,GAC/D;AAGF,EAAA,MAAM,UAAA,GAAa,CAAC,OAAA,IAAW,CAAC,aAAa,UAAA,oBAC3C,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,qBAAA;AAAA,MACV,SAAA,EAAU,qEAAA;AAAA,MAET,QAAA,EAAA;AAAA;AAAA,GACH;AAGF,EAAA,MAAM,QAAA,mBACJ,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,WAAA;AAAA,MACL,WAAA,EAAU,0BAAA;AAAA,MACV,aAAA,EAAY,MAAA;AAAA,MACZ,SAAA,EAAU;AAAA;AAAA,GACZ;AAGF,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,iBAAA;AAAA,MACV,WAAA,EAAW,SAAA;AAAA,MACX,SAAA,EAAW,EAAA,CAAG,eAAA,EAAiB,SAAS,CAAA;AAAA,MAEvC,QAAA,EAAA;AAAA,QAAA,SAAA,KAAc,wBACb,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,UACA;AAAA,SAAA,EACH,CAAA;AAAA,QAGD,QAAA;AAAA,QAEA,SAAA,KAAc,0BACb,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,UACA;AAAA,SAAA,EACH,CAAA;AAAA,QAGD;AAAA;AAAA;AAAA,GACH;AAEJ","file":"infinite-scroll.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\nimport { Spinner } from \"./spinner\"\n\ntype InfiniteScrollProps = {\n  onLoadMore: () => void\n  hasMore: boolean\n  isLoading?: boolean\n  direction?: \"down\" | \"up\"\n  root?: React.RefObject<Element | null>\n  rootMargin?: string\n  threshold?: number\n  loader?: React.ReactNode\n  endMessage?: React.ReactNode\n  className?: string\n  children?: React.ReactNode\n}\n\nfunction InfiniteScroll({\n  onLoadMore,\n  hasMore,\n  isLoading = false,\n  direction = \"down\",\n  root,\n  rootMargin = \"200px\",\n  threshold = 0,\n  loader,\n  endMessage,\n  className,\n  children,\n}: InfiniteScrollProps) {\n  const sentinelRef = React.useRef<HTMLDivElement>(null)\n  const loadingRef = React.useRef(false)\n\n  const onLoadMoreRef = React.useRef(onLoadMore)\n  React.useEffect(() => {\n    onLoadMoreRef.current = onLoadMore\n  }, [onLoadMore])\n\n  React.useEffect(() => {\n    if (!isLoading) {\n      loadingRef.current = false\n    }\n  }, [isLoading])\n\n  React.useEffect(() => {\n    const sentinel = sentinelRef.current\n    if (!sentinel || !hasMore) return\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        const [entry] = entries\n        if (entry?.isIntersecting && !loadingRef.current) {\n          loadingRef.current = true\n          onLoadMoreRef.current()\n        }\n      },\n      {\n        root: root?.current ?? null,\n        rootMargin,\n        threshold,\n      }\n    )\n\n    observer.observe(sentinel)\n\n    return () => {\n      observer.disconnect()\n    }\n  }, [hasMore, root, rootMargin, threshold])\n\n  const loaderContent = isLoading && (\n    <div\n      data-slot=\"infinite-scroll-loader\"\n      className=\"flex items-center justify-center py-6\"\n    >\n      {loader ?? <Spinner className=\"size-6 text-muted-foreground\" />}\n    </div>\n  )\n\n  const endContent = !hasMore && !isLoading && endMessage && (\n    <div\n      data-slot=\"infinite-scroll-end\"\n      className=\"flex items-center justify-center py-6 text-sm text-muted-foreground\"\n    >\n      {endMessage}\n    </div>\n  )\n\n  const sentinel = (\n    <div\n      ref={sentinelRef}\n      data-slot=\"infinite-scroll-sentinel\"\n      aria-hidden=\"true\"\n      className=\"h-px\"\n    />\n  )\n\n  return (\n    <div\n      data-slot=\"infinite-scroll\"\n      aria-busy={isLoading}\n      className={cn(\"flex flex-col\", className)}\n    >\n      {direction === \"up\" && (\n        <>\n          {sentinel}\n          {loaderContent}\n        </>\n      )}\n\n      {children}\n\n      {direction === \"down\" && (\n        <>\n          {sentinel}\n          {loaderContent}\n        </>\n      )}\n\n      {endContent}\n    </div>\n  )\n}\n\nexport { InfiniteScroll, type InfiniteScrollProps }\n"]}
+{"version":3,"file":"infinite-scroll.js","names":[],"sources":["../src/infinite-scroll.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\nimport { Spinner } from \"./spinner\"\n\ntype InfiniteScrollProps = {\n  onLoadMore: () => void\n  hasMore: boolean\n  isLoading?: boolean\n  direction?: \"down\" | \"up\"\n  root?: React.RefObject<Element | null>\n  rootMargin?: string\n  threshold?: number\n  loader?: React.ReactNode\n  endMessage?: React.ReactNode\n  className?: string\n  children?: React.ReactNode\n}\n\nfunction InfiniteScroll({\n  onLoadMore,\n  hasMore,\n  isLoading = false,\n  direction = \"down\",\n  root,\n  rootMargin = \"200px\",\n  threshold = 0,\n  loader,\n  endMessage,\n  className,\n  children,\n}: InfiniteScrollProps) {\n  const sentinelRef = React.useRef<HTMLDivElement>(null)\n  const loadingRef = React.useRef(false)\n\n  const onLoadMoreRef = React.useRef(onLoadMore)\n  React.useEffect(() => {\n    onLoadMoreRef.current = onLoadMore\n  }, [onLoadMore])\n\n  React.useEffect(() => {\n    if (!isLoading) {\n      loadingRef.current = false\n    }\n  }, [isLoading])\n\n  React.useEffect(() => {\n    const sentinel = sentinelRef.current\n    if (!sentinel || !hasMore) return\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        const [entry] = entries\n        if (entry?.isIntersecting && !loadingRef.current) {\n          loadingRef.current = true\n          onLoadMoreRef.current()\n        }\n      },\n      {\n        root: root?.current ?? null,\n        rootMargin,\n        threshold,\n      }\n    )\n\n    observer.observe(sentinel)\n\n    return () => {\n      observer.disconnect()\n    }\n  }, [hasMore, root, rootMargin, threshold])\n\n  const loaderContent = isLoading && (\n    <div\n      data-slot=\"infinite-scroll-loader\"\n      className=\"flex items-center justify-center py-6\"\n    >\n      {loader ?? <Spinner className=\"size-6 text-muted-foreground\" />}\n    </div>\n  )\n\n  const endContent = !hasMore && !isLoading && endMessage && (\n    <div\n      data-slot=\"infinite-scroll-end\"\n      className=\"flex items-center justify-center py-6 text-sm text-muted-foreground\"\n    >\n      {endMessage}\n    </div>\n  )\n\n  const sentinel = (\n    <div\n      ref={sentinelRef}\n      data-slot=\"infinite-scroll-sentinel\"\n      aria-hidden=\"true\"\n      className=\"h-px\"\n    />\n  )\n\n  return (\n    <div\n      data-slot=\"infinite-scroll\"\n      aria-busy={isLoading}\n      className={cn(\"flex flex-col\", className)}\n    >\n      {direction === \"up\" && (\n        <>\n          {sentinel}\n          {loaderContent}\n        </>\n      )}\n\n      {children}\n\n      {direction === \"down\" && (\n        <>\n          {sentinel}\n          {loaderContent}\n        </>\n      )}\n\n      {endContent}\n    </div>\n  )\n}\n\nexport { InfiniteScroll, type InfiniteScrollProps }\n"],"mappings":";;;;;;AAqBA,SAAS,eAAe,EACtB,YACA,SACA,YAAY,OACZ,YAAY,QACZ,MACA,aAAa,SACb,YAAY,GACZ,QACA,YACA,WACA,YACsB;CACtB,MAAM,cAAc,MAAM,OAAuB,KAAK;CACtD,MAAM,aAAa,MAAM,OAAO,MAAM;CAEtC,MAAM,gBAAgB,MAAM,OAAO,WAAW;AAC9C,OAAM,gBAAgB;AACpB,gBAAc,UAAU;IACvB,CAAC,WAAW,CAAC;AAEhB,OAAM,gBAAgB;AACpB,MAAI,CAAC,UACH,YAAW,UAAU;IAEtB,CAAC,UAAU,CAAC;AAEf,OAAM,gBAAgB;EACpB,MAAM,WAAW,YAAY;AAC7B,MAAI,CAAC,YAAY,CAAC,QAAS;EAE3B,MAAM,WAAW,IAAI,sBAClB,YAAY;GACX,MAAM,CAAC,SAAS;AAChB,OAAI,OAAO,kBAAkB,CAAC,WAAW,SAAS;AAChD,eAAW,UAAU;AACrB,kBAAc,SAAS;;KAG3B;GACE,MAAM,MAAM,WAAW;GACvB;GACA;GACD,CACF;AAED,WAAS,QAAQ,SAAS;AAE1B,eAAa;AACX,YAAS,YAAY;;IAEtB;EAAC;EAAS;EAAM;EAAY;EAAU,CAAC;CAE1C,MAAM,gBAAgB,aACpB,oBAAC,OAAD;EACE,aAAU;EACV,WAAU;YAET,UAAU,oBAAC,SAAD,EAAS,WAAU,gCAAiC,CAAA;EAC3D,CAAA;CAGR,MAAM,aAAa,CAAC,WAAW,CAAC,aAAa,cAC3C,oBAAC,OAAD;EACE,aAAU;EACV,WAAU;YAET;EACG,CAAA;CAGR,MAAM,WACJ,oBAAC,OAAD;EACE,KAAK;EACL,aAAU;EACV,eAAY;EACZ,WAAU;EACV,CAAA;AAGJ,QACE,qBAAC,OAAD;EACE,aAAU;EACV,aAAW;EACX,WAAW,GAAG,iBAAiB,UAAU;YAH3C;GAKG,cAAc,QACb,qBAAA,UAAA,EAAA,UAAA,CACG,UACA,cACA,EAAA,CAAA;GAGJ;GAEA,cAAc,UACb,qBAAA,UAAA,EAAA,UAAA,CACG,UACA,cACA,EAAA,CAAA;GAGJ;GACG"}

package/dist/input-group.d.ts

@@ -1,29 +1,52 @@
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import { VariantProps } from 'class-variance-authority';
-import { Button } from './button.js';
-import '@base-ui/react/button';
+import { Button } from "./button.js";
+import * as React from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
 
+//#region src/input-group.d.ts
 type InputGroupProps = React.ComponentProps<"div">;
 type InputGroupAddonProps = React.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>;
 type InputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, "size" | "type"> & VariantProps<typeof inputGroupButtonVariants> & {
-    type?: "button" | "submit" | "reset";
+  type?: "button" | "submit" | "reset";
 };
 type InputGroupTextProps = React.ComponentProps<"span">;
 type InputGroupInputProps = React.ComponentProps<"input">;
 type InputGroupTextareaProps = React.ComponentProps<"textarea">;
-declare function InputGroup({ className, ...props }: InputGroupProps): react_jsx_runtime.JSX.Element;
+declare function InputGroup({
+  className,
+  ...props
+}: InputGroupProps): _$react_jsx_runtime0.JSX.Element;
 declare const inputGroupAddonVariants: (props?: ({
-    align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function InputGroupAddon({ className, align, ...props }: InputGroupAddonProps): react_jsx_runtime.JSX.Element;
+  align?: "inline-end" | "inline-start" | "block-end" | "block-start" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function InputGroupAddon({
+  className,
+  align,
+  ...props
+}: InputGroupAddonProps): _$react_jsx_runtime0.JSX.Element;
 declare const inputGroupButtonVariants: (props?: ({
-    size?: "xs" | "sm" | "icon-xs" | "icon-sm" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function InputGroupButton({ className, type, variant, size, ...props }: InputGroupButtonProps): react_jsx_runtime.JSX.Element;
-declare function InputGroupText({ className, ...props }: InputGroupTextProps): react_jsx_runtime.JSX.Element;
-declare function InputGroupInput({ className, ...props }: InputGroupInputProps): react_jsx_runtime.JSX.Element;
-declare function InputGroupTextarea({ className, ...props }: InputGroupTextareaProps): react_jsx_runtime.JSX.Element;
-
+  size?: "xs" | "sm" | "icon-xs" | "icon-sm" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function InputGroupButton({
+  className,
+  type,
+  variant,
+  size,
+  ...props
+}: InputGroupButtonProps): _$react_jsx_runtime0.JSX.Element;
+declare function InputGroupText({
+  className,
+  ...props
+}: InputGroupTextProps): _$react_jsx_runtime0.JSX.Element;
+declare function InputGroupInput({
+  className,
+  ...props
+}: InputGroupInputProps): _$react_jsx_runtime0.JSX.Element;
+declare function InputGroupTextarea({
+  className,
+  ...props
+}: InputGroupTextareaProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
+//# sourceMappingURL=input-group.d.ts.map

package/dist/input-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group.d.ts","names":[],"sources":["../src/input-group.tsx"],"mappings":";;;;;;;KAUK,eAAA,GAAkB,KAAA,CAAM,cAAA;AAAA,KAExB,oBAAA,GAAuB,KAAA,CAAM,cAAA,UAChC,YAAA,QAAoB,uBAAA;AAAA,KAEjB,qBAAA,GAAwB,IAAA,CAAK,KAAA,CAAM,cAAA,QAAsB,MAAA,sBAC5D,YAAA,QAAoB,wBAAA;EAClB,IAAA;AAAA;AAAA,KAGC,mBAAA,GAAsB,KAAA,CAAM,cAAA;AAAA,KAE5B,oBAAA,GAAuB,KAAA,CAAM,cAAA;AAAA,KAE7B,uBAAA,GAA0B,KAAA,CAAM,cAAA;AAAA,iBAE5B,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,eAAA,GAAe,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cActD,uBAAA,GAAuB,KAAA;;IAmB5B,iCAAA,CAAA,SAAA;AAAA,iBAEQ,eAAA,CAAA;EACP,SAAA;EACA,KAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAkBjB,wBAAA,GAAwB,KAAA;;IAgB7B,iCAAA,CAAA,SAAA;AAAA,iBAEQ,gBAAA,CAAA;EACP,SAAA;EACA,IAAA;EACA,OAAA;EACA,IAAA;EAAA,GACG;AAAA,GACF,qBAAA,GAAqB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAYf,cAAA,CAAA;EAAiB,SAAA;EAAA,GAAc;AAAA,GAAS,mBAAA,GAAmB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAY3D,eAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAad,kBAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,uBAAA,GAAuB,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/input-group.js

@@ -1,7 +1,81 @@
-export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea } from './chunk-IQ7YQ5XA.js';
-import './chunk-QRW37LRP.js';
-import './chunk-QFSEK4M6.js';
-import './chunk-OUFYQLVN.js';
-import './chunk-76UQO56T.js';
-//# sourceMappingURL=input-group.js.map
+"use client";
+import { cn } from "./lib/utils.js";
+import { Button } from "./button.js";
+import { Input } from "./input.js";
+import { Textarea } from "./textarea.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+//#region src/input-group.tsx
+function InputGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-group",
+		role: "group",
+		className: cn("border-input dark:bg-input/30 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-input/50 dark:has-disabled:bg-input/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className),
+		...props
+	});
+}
+const inputGroupAddonVariants = cva("text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none", {
+	variants: { align: {
+		"inline-start": "pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first",
+		"inline-end": "pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last",
+		"block-start": "px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start",
+		"block-end": "px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start"
+	} },
+	defaultVariants: { align: "inline-start" }
+});
+function InputGroupAddon({ className, align = "inline-start", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		role: "group",
+		"data-slot": "input-group-addon",
+		"data-align": align,
+		className: cn(inputGroupAddonVariants({ align }), className),
+		onClick: (e) => {
+			if (e.target.closest("button")) return;
+			e.currentTarget.parentElement?.querySelector("input")?.focus();
+		},
+		...props
+	});
+}
+const inputGroupButtonVariants = cva("gap-2 text-sm shadow-none flex items-center", {
+	variants: { size: {
+		xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
+		sm: "",
+		"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
+		"icon-sm": "size-8 p-0 has-[>svg]:p-0"
+	} },
+	defaultVariants: { size: "xs" }
+});
+function InputGroupButton({ className, type = "button", variant = "ghost", size = "xs", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		type,
+		"data-size": size,
+		variant,
+		className: cn(inputGroupButtonVariants({ size }), className),
+		...props
+	});
+}
+function InputGroupText({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className),
+		...props
+	});
+}
+function InputGroupInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Input, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+function InputGroupTextarea({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Textarea, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+//#endregion
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea };
+
 //# sourceMappingURL=input-group.js.map

package/dist/input-group.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"input-group.js"}
+{"version":3,"file":"input-group.js","names":[],"sources":["../src/input-group.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"./lib/utils\"\nimport { Button } from \"./button\"\nimport { Input } from \"./input\"\nimport { Textarea } from \"./textarea\"\n\ntype InputGroupProps = React.ComponentProps<\"div\">\n\ntype InputGroupAddonProps = React.ComponentProps<\"div\"> &\n  VariantProps<typeof inputGroupAddonVariants>\n\ntype InputGroupButtonProps = Omit<React.ComponentProps<typeof Button>, \"size\" | \"type\"> &\n  VariantProps<typeof inputGroupButtonVariants> & {\n    type?: \"button\" | \"submit\" | \"reset\"\n  }\n\ntype InputGroupTextProps = React.ComponentProps<\"span\">\n\ntype InputGroupInputProps = React.ComponentProps<\"input\">\n\ntype InputGroupTextareaProps = React.ComponentProps<\"textarea\">\n\nfunction InputGroup({ className, ...props }: InputGroupProps) {\n  return (\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      className={cn(\n        \"border-input dark:bg-input/30 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-disabled:bg-input/50 dark:has-disabled:bg-input/80 group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 not-has-disabled:has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupAddonVariants = cva(\n  \"text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none\",\n  {\n    variants: {\n      align: {\n        \"inline-start\":\n          \"pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first\",\n        \"inline-end\":\n          \"pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last\",\n        \"block-start\":\n          \"px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start\",\n        \"block-end\":\n          \"px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  }\n)\n\nfunction InputGroupAddon({\n  className,\n  align = \"inline-start\",\n  ...props\n}: InputGroupAddonProps) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={align}\n      className={cn(inputGroupAddonVariants({ align }), className)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n      }}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupButtonVariants = cva(\n  \"gap-2 text-sm shadow-none flex items-center\",\n  {\n    variants: {\n      size: {\n        xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n        sm: \"\",\n        \"icon-xs\":\n          \"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0\",\n        \"icon-sm\": \"size-8 p-0 has-[>svg]:p-0\",\n      },\n    },\n    defaultVariants: {\n      size: \"xs\",\n    },\n  }\n)\n\nfunction InputGroupButton({\n  className,\n  type = \"button\",\n  variant = \"ghost\",\n  size = \"xs\",\n  ...props\n}: InputGroupButtonProps) {\n  return (\n    <Button\n      type={type}\n      data-size={size}\n      variant={variant}\n      className={cn(inputGroupButtonVariants({ size }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupText({ className, ...props }: InputGroupTextProps) {\n  return (\n    <span\n      className={cn(\n        \"text-muted-foreground flex items-center gap-2 text-sm [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupInput({\n  className,\n  ...props\n}: InputGroupInputProps) {\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupTextarea({\n  className,\n  ...props\n}: InputGroupTextareaProps) {\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  InputGroup,\n  InputGroupAddon,\n  InputGroupButton,\n  InputGroupText,\n  InputGroupInput,\n  InputGroupTextarea,\n}\n"],"mappings":";;;;;;;;;AA0BA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,QACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,WAAW,GACT,2qCACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,MAAM,0BAA0B,IAC9B,2PACA;CACE,UAAU,EACR,OAAO;EACL,gBACE;EACF,cACE;EACF,eACE;EACF,aACE;EACH,EACF;CACD,iBAAiB,EACf,OAAO,gBACR;CACF,CACF;AAED,SAAS,gBAAgB,EACvB,WACA,QAAQ,gBACR,GAAG,SACoB;AACvB,QACE,oBAAC,OAAD;EACE,MAAK;EACL,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,wBAAwB,EAAE,OAAO,CAAC,EAAE,UAAU;EAC5D,UAAU,MAAM;AACd,OAAK,EAAE,OAAuB,QAAQ,SAAS,CAC7C;AAEF,KAAE,cAAc,eAAe,cAAc,QAAQ,EAAE,OAAO;;EAEhE,GAAI;EACJ,CAAA;;AAIN,MAAM,2BAA2B,IAC/B,+CACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WACE;EACF,WAAW;EACZ,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CACF;AAED,SAAS,iBAAiB,EACxB,WACA,OAAO,UACP,UAAU,SACV,OAAO,MACP,GAAG,SACqB;AACxB,QACE,oBAAC,QAAD;EACQ;EACN,aAAW;EACF;EACT,WAAW,GAAG,yBAAyB,EAAE,MAAM,CAAC,EAAE,UAAU;EAC5D,GAAI;EACJ,CAAA;;AAIN,SAAS,eAAe,EAAE,WAAW,GAAG,SAA8B;AACpE,QACE,oBAAC,QAAD;EACE,WAAW,GACT,0HACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,gBAAgB,EACvB,WACA,GAAG,SACoB;AACvB,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACuB;AAC1B,QACE,oBAAC,UAAD;EACE,aAAU;EACV,WAAW,GACT,qMACA,UACD;EACD,GAAI;EACJ,CAAA"}

package/dist/input-otp.d.ts

@@ -1,18 +1,34 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import { OTPInput } from 'input-otp';
+import * as React from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { OTPInput } from "input-otp";
 
+//#region src/input-otp.d.ts
 type InputOTPProps = React.ComponentProps<typeof OTPInput> & {
-    containerClassName?: string;
+  containerClassName?: string;
 };
-declare function InputOTP({ className, containerClassName, ...props }: InputOTPProps): react_jsx_runtime.JSX.Element;
+declare function InputOTP({
+  className,
+  containerClassName,
+  ...props
+}: InputOTPProps): _$react_jsx_runtime0.JSX.Element;
 type InputOTPGroupProps = React.ComponentProps<"div">;
-declare function InputOTPGroup({ className, ...props }: InputOTPGroupProps): react_jsx_runtime.JSX.Element;
+declare function InputOTPGroup({
+  className,
+  ...props
+}: InputOTPGroupProps): _$react_jsx_runtime0.JSX.Element;
 type InputOTPSlotProps = React.ComponentProps<"div"> & {
-    index: number;
+  index: number;
 };
-declare function InputOTPSlot({ index, className, ...props }: InputOTPSlotProps): react_jsx_runtime.JSX.Element;
+declare function InputOTPSlot({
+  index,
+  className,
+  ...props
+}: InputOTPSlotProps): _$react_jsx_runtime0.JSX.Element;
 type InputOTPSeparatorProps = React.ComponentProps<"div">;
-declare function InputOTPSeparator({ className, ...props }: InputOTPSeparatorProps): react_jsx_runtime.JSX.Element;
-
+declare function InputOTPSeparator({
+  className,
+  ...props
+}: InputOTPSeparatorProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
+//# sourceMappingURL=input-otp.d.ts.map

package/dist/input-otp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-otp.d.ts","names":[],"sources":["../src/input-otp.tsx"],"mappings":";;;;;KAQK,aAAA,GAAgB,KAAA,CAAM,cAAA,QAAsB,QAAA;EAC/C,kBAAA;AAAA;AAAA,iBAGO,QAAA,CAAA;EACP,SAAA;EACA,kBAAA;EAAA,GACG;AAAA,GACF,aAAA,GAAa,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAeX,kBAAA,GAAqB,KAAA,CAAM,cAAA;AAAA,iBAEvB,aAAA,CAAA;EAAgB,SAAA;EAAA,GAAc;AAAA,GAAS,kBAAA,GAAkB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAa7D,iBAAA,GAAoB,KAAA,CAAM,cAAA;EAC7B,KAAA;AAAA;AAAA,iBAGO,YAAA,CAAA;EAAe,KAAA;EAAO,SAAA;EAAA,GAAc;AAAA,GAAS,iBAAA,GAAiB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KA0BlE,sBAAA,GAAyB,KAAA,CAAM,cAAA;AAAA,iBAE3B,iBAAA,CAAA;EAAoB,SAAA;EAAA,GAAc;AAAA,GAAS,sBAAA,GAAsB,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/input-otp.js

@@ -1,79 +1,49 @@
-import { MinusIcon } from './chunk-DIGOLJIR.js';
-import { cn } from './chunk-76UQO56T.js';
-import * as React from 'react';
-import { OTPInput, OTPInputContext } from 'input-otp';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-function InputOTP({
-  className,
-  containerClassName,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    OTPInput,
-    {
-      "data-slot": "input-otp",
-      containerClassName: cn(
-        "flex items-center has-disabled:opacity-50",
-        containerClassName
-      ),
-      spellCheck: false,
-      className: cn("disabled:cursor-not-allowed", className),
-      ...props
-    }
-  );
+"use client";
+import { cn } from "./lib/utils.js";
+import { MinusIcon } from "./lib/internal-icons.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { OTPInput, OTPInputContext } from "input-otp";
+//#region src/input-otp.tsx
+function InputOTP({ className, containerClassName, ...props }) {
+	return /* @__PURE__ */ jsx(OTPInput, {
+		"data-slot": "input-otp",
+		containerClassName: cn("flex items-center has-disabled:opacity-50", containerClassName),
+		spellCheck: false,
+		className: cn("disabled:cursor-not-allowed", className),
+		...props
+	});
 }
 function InputOTPGroup({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "input-otp-group",
-      className: cn(
-        "flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40",
-        className
-      ),
-      ...props
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-otp-group",
+		className: cn("flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40", className),
+		...props
+	});
 }
 function InputOTPSlot({ index, className, ...props }) {
-  const inputOTPContext = React.useContext(OTPInputContext);
-  const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-slot": "input-otp-slot",
-      "data-active": isActive || void 0,
-      className: cn(
-        "border-input dark:bg-input/30 relative flex size-9 items-center justify-center border-y border-r text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg",
-        "data-active:border-ring data-active:ring-3 data-active:ring-ring/50 data-active:z-10",
-        "aria-invalid:border-destructive data-active:aria-invalid:border-destructive data-active:aria-invalid:ring-destructive/20 dark:data-active:aria-invalid:ring-destructive/40",
-        className
-      ),
-      ...props,
-      children: [
-        char,
-        hasFakeCaret && /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: "animate-caret-blink bg-foreground h-4 w-px duration-1000" }) })
-      ]
-    }
-  );
+	const { char, hasFakeCaret, isActive } = React.useContext(OTPInputContext)?.slots[index] ?? {};
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "input-otp-slot",
+		"data-active": isActive || void 0,
+		className: cn("border-input dark:bg-input/30 relative flex size-9 items-center justify-center border-y border-r text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg", "data-active:border-ring data-active:ring-3 data-active:ring-ring/50 data-active:z-10", "aria-invalid:border-destructive data-active:aria-invalid:border-destructive data-active:aria-invalid:ring-destructive/20 dark:data-active:aria-invalid:ring-destructive/40", className),
+		...props,
+		children: [char, hasFakeCaret && /* @__PURE__ */ jsx("div", {
+			className: "pointer-events-none absolute inset-0 flex items-center justify-center",
+			children: /* @__PURE__ */ jsx("div", { className: "animate-caret-blink bg-foreground h-4 w-px duration-1000" })
+		})]
+	});
 }
 function InputOTPSeparator({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "input-otp-separator",
-      className: cn(
-        "flex items-center [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      role: "separator",
-      ...props,
-      children: /* @__PURE__ */ jsx(MinusIcon, {})
-    }
-  );
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-otp-separator",
+		className: cn("flex items-center [&_svg:not([class*='size-'])]:size-4", className),
+		role: "separator",
+		...props,
+		children: /* @__PURE__ */ jsx(MinusIcon, {})
+	});
 }
-
+//#endregion
 export { InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot };
-//# sourceMappingURL=input-otp.js.map
+
 //# sourceMappingURL=input-otp.js.map

package/dist/input-otp.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/input-otp.tsx"],"names":[],"mappings":";;;;;;AAYA,SAAS,QAAA,CAAS;AAAA,EAChB,SAAA;AAAA,EACA,kBAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAkB;AAChB,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,kBAAA,EAAoB,EAAA;AAAA,QAClB,2CAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,UAAA,EAAY,KAAA;AAAA,MACZ,SAAA,EAAW,EAAA,CAAG,6BAAA,EAA+B,SAAS,CAAA;AAAA,MACrD,GAAG;AAAA;AAAA,GACN;AAEJ;AAIA,SAAS,aAAA,CAAc,EAAE,SAAA,EAAW,GAAG,OAAM,EAAuB;AAClE,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,iBAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,yKAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ;AAMA,SAAS,aAAa,EAAE,KAAA,EAAO,SAAA,EAAW,GAAG,OAAM,EAAsB;AACvE,EAAA,MAAM,eAAA,GAAwB,iBAAW,eAAe,CAAA;AACxD,EAAA,MAAM,EAAE,MAAM,YAAA,EAAc,QAAA,KAAa,eAAA,EAAiB,KAAA,CAAM,KAAK,CAAA,IAAK,EAAC;AAE3E,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,gBAAA;AAAA,MACV,eAAa,QAAA,IAAY,MAAA;AAAA,MACzB,SAAA,EAAW,EAAA;AAAA,QACT,0LAAA;AAAA,QACA,sFAAA;AAAA,QACA,4KAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,IAAA;AAAA,QACA,YAAA,wBACE,KAAA,EAAA,EAAI,SAAA,EAAU,yEACb,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0DAAA,EAA2D,CAAA,EAC5E;AAAA;AAAA;AAAA,GAEJ;AAEJ;AAIA,SAAS,iBAAA,CAAkB,EAAE,SAAA,EAAW,GAAG,OAAM,EAA2B;AAC1E,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,qBAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,wDAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,IAAA,EAAK,WAAA;AAAA,MACJ,GAAG,KAAA;AAAA,MAEJ,8BAAC,SAAA,EAAA,EAAU;AAAA;AAAA,GACb;AAEJ","file":"input-otp.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { OTPInput, OTPInputContext } from \"input-otp\"\n\nimport { cn } from \"./lib/utils\"\nimport { MinusIcon } from \"./lib/internal-icons\"\n\ntype InputOTPProps = React.ComponentProps<typeof OTPInput> & {\n  containerClassName?: string\n}\n\nfunction InputOTP({\n  className,\n  containerClassName,\n  ...props\n}: InputOTPProps) {\n  return (\n    <OTPInput\n      data-slot=\"input-otp\"\n      containerClassName={cn(\n        \"flex items-center has-disabled:opacity-50\",\n        containerClassName,\n      )}\n      spellCheck={false}\n      className={cn(\"disabled:cursor-not-allowed\", className)}\n      {...props}\n    />\n  )\n}\n\ntype InputOTPGroupProps = React.ComponentProps<\"div\">\n\nfunction InputOTPGroup({ className, ...props }: InputOTPGroupProps) {\n  return (\n    <div\n      data-slot=\"input-otp-group\"\n      className={cn(\n        \"flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\ntype InputOTPSlotProps = React.ComponentProps<\"div\"> & {\n  index: number\n}\n\nfunction InputOTPSlot({ index, className, ...props }: InputOTPSlotProps) {\n  const inputOTPContext = React.useContext(OTPInputContext)\n  const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {}\n\n  return (\n    <div\n      data-slot=\"input-otp-slot\"\n      data-active={isActive || undefined}\n      className={cn(\n        \"border-input dark:bg-input/30 relative flex size-9 items-center justify-center border-y border-r text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg\",\n        \"data-active:border-ring data-active:ring-3 data-active:ring-ring/50 data-active:z-10\",\n        \"aria-invalid:border-destructive data-active:aria-invalid:border-destructive data-active:aria-invalid:ring-destructive/20 dark:data-active:aria-invalid:ring-destructive/40\",\n        className,\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"animate-caret-blink bg-foreground h-4 w-px duration-1000\" />\n        </div>\n      )}\n    </div>\n  )\n}\n\ntype InputOTPSeparatorProps = React.ComponentProps<\"div\">\n\nfunction InputOTPSeparator({ className, ...props }: InputOTPSeparatorProps) {\n  return (\n    <div\n      data-slot=\"input-otp-separator\"\n      className={cn(\n        \"flex items-center [&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      role=\"separator\"\n      {...props}\n    >\n      <MinusIcon />\n    </div>\n  )\n}\n\nexport {\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  InputOTPSeparator\n}\n"]}
+{"version":3,"file":"input-otp.js","names":[],"sources":["../src/input-otp.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { OTPInput, OTPInputContext } from \"input-otp\"\n\nimport { cn } from \"./lib/utils\"\nimport { MinusIcon } from \"./lib/internal-icons\"\n\ntype InputOTPProps = React.ComponentProps<typeof OTPInput> & {\n  containerClassName?: string\n}\n\nfunction InputOTP({\n  className,\n  containerClassName,\n  ...props\n}: InputOTPProps) {\n  return (\n    <OTPInput\n      data-slot=\"input-otp\"\n      containerClassName={cn(\n        \"flex items-center has-disabled:opacity-50\",\n        containerClassName,\n      )}\n      spellCheck={false}\n      className={cn(\"disabled:cursor-not-allowed\", className)}\n      {...props}\n    />\n  )\n}\n\ntype InputOTPGroupProps = React.ComponentProps<\"div\">\n\nfunction InputOTPGroup({ className, ...props }: InputOTPGroupProps) {\n  return (\n    <div\n      data-slot=\"input-otp-group\"\n      className={cn(\n        \"flex items-center rounded-lg has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\ntype InputOTPSlotProps = React.ComponentProps<\"div\"> & {\n  index: number\n}\n\nfunction InputOTPSlot({ index, className, ...props }: InputOTPSlotProps) {\n  const inputOTPContext = React.useContext(OTPInputContext)\n  const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {}\n\n  return (\n    <div\n      data-slot=\"input-otp-slot\"\n      data-active={isActive || undefined}\n      className={cn(\n        \"border-input dark:bg-input/30 relative flex size-9 items-center justify-center border-y border-r text-sm transition-all outline-none first:rounded-l-lg first:border-l last:rounded-r-lg\",\n        \"data-active:border-ring data-active:ring-3 data-active:ring-ring/50 data-active:z-10\",\n        \"aria-invalid:border-destructive data-active:aria-invalid:border-destructive data-active:aria-invalid:ring-destructive/20 dark:data-active:aria-invalid:ring-destructive/40\",\n        className,\n      )}\n      {...props}\n    >\n      {char}\n      {hasFakeCaret && (\n        <div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n          <div className=\"animate-caret-blink bg-foreground h-4 w-px duration-1000\" />\n        </div>\n      )}\n    </div>\n  )\n}\n\ntype InputOTPSeparatorProps = React.ComponentProps<\"div\">\n\nfunction InputOTPSeparator({ className, ...props }: InputOTPSeparatorProps) {\n  return (\n    <div\n      data-slot=\"input-otp-separator\"\n      className={cn(\n        \"flex items-center [&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      role=\"separator\"\n      {...props}\n    >\n      <MinusIcon />\n    </div>\n  )\n}\n\nexport {\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  InputOTPSeparator\n}\n"],"mappings":";;;;;;;AAYA,SAAS,SAAS,EAChB,WACA,oBACA,GAAG,SACa;AAChB,QACE,oBAAC,UAAD;EACE,aAAU;EACV,oBAAoB,GAClB,6CACA,mBACD;EACD,YAAY;EACZ,WAAW,GAAG,+BAA+B,UAAU;EACvD,GAAI;EACJ,CAAA;;AAMN,SAAS,cAAc,EAAE,WAAW,GAAG,SAA6B;AAClE,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,2KACA,UACD;EACD,GAAI;EACJ,CAAA;;AAQN,SAAS,aAAa,EAAE,OAAO,WAAW,GAAG,SAA4B;CAEvE,MAAM,EAAE,MAAM,cAAc,aADJ,MAAM,WAAW,gBACe,EAAE,MAAM,UAAU,EAAE;AAE5E,QACE,qBAAC,OAAD;EACE,aAAU;EACV,eAAa,YAAY,KAAA;EACzB,WAAW,GACT,4LACA,wFACA,8KACA,UACD;EACD,GAAI;YATN,CAWG,MACA,gBACC,oBAAC,OAAD;GAAK,WAAU;aACb,oBAAC,OAAD,EAAK,WAAU,4DAA6D,CAAA;GACxE,CAAA,CAEJ;;;AAMV,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAiC;AAC1E,QACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,0DACA,UACD;EACD,MAAK;EACL,GAAI;YAEJ,oBAAC,WAAD,EAAa,CAAA;EACT,CAAA"}

package/dist/input.d.ts

@@ -1,7 +1,13 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
+import * as React from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
+//#region src/input.d.ts
 type InputProps = React.ComponentProps<"input">;
-declare function Input({ className, type, ...props }: InputProps): react_jsx_runtime.JSX.Element;
-
+declare function Input({
+  className,
+  type,
+  ...props
+}: InputProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
 export { Input };
+//# sourceMappingURL=input.d.ts.map

package/dist/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","names":[],"sources":["../src/input.tsx"],"mappings":";;;;KAKK,UAAA,GAAa,KAAA,CAAM,cAAA;AAAA,iBAEf,KAAA,CAAA;EAAQ,SAAA;EAAW,IAAA;EAAA,GAAS;AAAA,GAAS,UAAA,GAAU,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/input.js

@@ -1,4 +1,17 @@
-export { Input } from './chunk-QFSEK4M6.js';
-import './chunk-76UQO56T.js';
-//# sourceMappingURL=input.js.map
+import { cn } from "./lib/utils.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { Input as Input$1 } from "@base-ui/react/input";
+//#region src/input.tsx
+function Input({ className, type, ...props }) {
+	return /* @__PURE__ */ jsx(Input$1, {
+		type,
+		"data-slot": "input",
+		className: cn("dark:bg-input/30 border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-input/50 dark:disabled:bg-input/80 file:text-foreground placeholder:text-muted-foreground h-8 w-full min-w-0 rounded-lg border bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm", className),
+		...props
+	});
+}
+//#endregion
+export { Input };
+
 //# sourceMappingURL=input.js.map