@causw/core 0.0.15 → 0.0.16

package/dist/components/Modal/Modal.styles.mjs

@@ -4,33 +4,25 @@ import { tv } from "tailwind-variants";
 const modal = tv({
 	slots: {
 		overlay: "fixed inset-0 z-modal bg-black/50 backdrop-blur-sm data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out",
-		content: "fixed left-[50%] top-[50%] z-modal flex w-[19.5rem] md:w-[26.25rem] translate-x-[-50%] translate-y-[-50%] flex-col items-center justify-center rounded-[1rem] bg-white pb-[0.75rem] pt-[1.875rem] shadow-lg data-[state=open]:animate-zoom-in data-[state=closed]:animate-zoom-out focus:outline-none",
+		content: "fixed left-[50%] top-[50%] z-modal flex w-[19.5rem] md:w-[26.25rem] translate-x-[-50%] translate-y-[-50%] flex-col items-center justify-center rounded-[1rem] bg-white pb-4 pt-8 shadow-lg data-[state=open]:animate-zoom-in data-[state=closed]:animate-zoom-out focus:outline-none",
 		title: "w-full typo-subtitle-18-bold text-gray-800",
 		description: "w-full mt-2 typo-body-16-regular text-gray-500",
-		footer: "mt-6 flex w-full items-start px-10",
-		actionButton: "flex flex-1 items-center justify-center py-3 px-10 rounded-md typo-subtitle-16-semibold transition-colors focus:outline-none"
+		footer: "mt-8 gap-2 flex w-full items-start px-4"
 	},
-	variants: {
-		variant: {
-			primary: { actionButton: "text-blue-700 hover:bg-blue-50 active:bg-blue-100 data-[active]:bg-blue-100" },
-			destructive: { actionButton: "text-red-400 hover:bg-red-50 active:bg-red-100 data-[active]:bg-red-100" },
-			cancel: { actionButton: "text-gray-400 hover:bg-gray-50 active:bg-gray-100 data-[active]:bg-gray-100" }
+	variants: { textAlign: {
+		center: {
+			title: "text-center px-10",
+			description: "text-center px-10"
 		},
-		textAlign: {
-			center: {
-				title: "text-center px-10",
-				description: "text-center px-10"
-			},
-			left: {
-				title: "text-left px-8",
-				description: "text-left px-8"
-			},
-			right: {
-				title: "text-right",
-				description: "text-right"
-			}
+		left: {
+			title: "text-left px-8",
+			description: "text-left px-8"
+		},
+		right: {
+			title: "text-right",
+			description: "text-right"
 		}
-	},
+	} },
 	compoundVariants: [{
 		textAlign: "left",
 		title: "flex"
@@ -38,10 +30,7 @@ const modal = tv({
 		textAlign: "right",
 		title: "flex"
 	}],
-	defaultVariants: {
-		variant: "primary",
-		textAlign: "center"
-	}
+	defaultVariants: { textAlign: "center" }
 });
 
 //#endregion

package/dist/components/Modal/Modal.styles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.styles.mjs","names":[],"sources":["../../../src/components/Modal/Modal.styles.ts"],"sourcesContent":["import { tv, VariantProps } from 'tailwind-variants';\n\nexport const modal = tv({\n  slots: {\n    overlay:\n      'fixed inset-0 z-modal bg-black/50 backdrop-blur-sm data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out',\n    content:\n      'fixed left-[50%] top-[50%] z-modal flex w-[19.5rem] md:w-[26.25rem] translate-x-[-50%] translate-y-[-50%] flex-col items-center justify-center rounded-[1rem] bg-white pb-[0.75rem] pt-[1.875rem] shadow-lg data-[state=open]:animate-zoom-in data-[state=closed]:animate-zoom-out focus:outline-none',\n    title: 'w-full typo-subtitle-18-bold text-gray-800',\n    description: 'w-full mt-2 typo-body-16-regular text-gray-500',\n    footer: 'mt-6 flex w-full items-start px-10',\n    actionButton:\n      'flex flex-1 items-center justify-center py-3 px-10 rounded-md typo-subtitle-16-semibold transition-colors focus:outline-none',\n  },\n  variants: {\n    variant: {\n      primary: {\n        actionButton:\n          'text-blue-700 hover:bg-blue-50 active:bg-blue-100 data-[active]:bg-blue-100',\n      },\n      destructive: {\n        actionButton:\n          'text-red-400 hover:bg-red-50 active:bg-red-100 data-[active]:bg-red-100',\n      },\n      cancel: {\n        actionButton:\n          'text-gray-400 hover:bg-gray-50 active:bg-gray-100 data-[active]:bg-gray-100',\n      },\n    },\n    textAlign: {\n      center: {\n        title: 'text-center px-10',\n        description: 'text-center px-10',\n      },\n      left: {\n        title: 'text-left px-8',\n        description: 'text-left px-8',\n      },\n      right: {\n        title: 'text-right',\n        description: 'text-right',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      textAlign: 'left',\n      title: 'flex',\n    },\n    {\n      textAlign: 'right',\n      title: 'flex',\n    },\n  ],\n  defaultVariants: {\n    variant: 'primary',\n    textAlign: 'center',\n  },\n});\n\nexport type ModalVariants = VariantProps<typeof modal>;\n"],"mappings":";;;AAEA,MAAa,QAAQ,GAAG;CACtB,OAAO;EACL,SACE;EACF,SACE;EACF,OAAO;EACP,aAAa;EACb,QAAQ;EACR,cACE;EACH;CACD,UAAU;EACR,SAAS;GACP,SAAS,EACP,cACE,+EACH;GACD,aAAa,EACX,cACE,2EACH;GACD,QAAQ,EACN,cACE,+EACH;GACF;EACD,WAAW;GACT,QAAQ;IACN,OAAO;IACP,aAAa;IACd;GACD,MAAM;IACJ,OAAO;IACP,aAAa;IACd;GACD,OAAO;IACL,OAAO;IACP,aAAa;IACd;GACF;EACF;CACD,kBAAkB,CAChB;EACE,WAAW;EACX,OAAO;EACR,EACD;EACE,WAAW;EACX,OAAO;EACR,CACF;CACD,iBAAiB;EACf,SAAS;EACT,WAAW;EACZ;CACF,CAAC"}
+{"version":3,"file":"Modal.styles.mjs","names":[],"sources":["../../../src/components/Modal/Modal.styles.ts"],"sourcesContent":["import { tv, VariantProps } from 'tailwind-variants';\n\nexport const modal = tv({\n  slots: {\n    overlay:\n      'fixed inset-0 z-modal bg-black/50 backdrop-blur-sm data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out',\n    content:\n      'fixed left-[50%] top-[50%] z-modal flex w-[19.5rem] md:w-[26.25rem] translate-x-[-50%] translate-y-[-50%] flex-col items-center justify-center rounded-[1rem] bg-white pb-4 pt-8 shadow-lg data-[state=open]:animate-zoom-in data-[state=closed]:animate-zoom-out focus:outline-none',\n    title: 'w-full typo-subtitle-18-bold text-gray-800',\n    description: 'w-full mt-2 typo-body-16-regular text-gray-500',\n    footer: 'mt-8 gap-2 flex w-full items-start px-4',\n  },\n  variants: {\n    textAlign: {\n      center: {\n        title: 'text-center px-10',\n        description: 'text-center px-10',\n      },\n      left: {\n        title: 'text-left px-8',\n        description: 'text-left px-8',\n      },\n      right: {\n        title: 'text-right',\n        description: 'text-right',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      textAlign: 'left',\n      title: 'flex',\n    },\n    {\n      textAlign: 'right',\n      title: 'flex',\n    },\n  ],\n  defaultVariants: {\n    textAlign: 'center',\n  },\n});\n\nexport type ModalVariants = VariantProps<typeof modal>;\n"],"mappings":";;;AAEA,MAAa,QAAQ,GAAG;CACtB,OAAO;EACL,SACE;EACF,SACE;EACF,OAAO;EACP,aAAa;EACb,QAAQ;EACT;CACD,UAAU,EACR,WAAW;EACT,QAAQ;GACN,OAAO;GACP,aAAa;GACd;EACD,MAAM;GACJ,OAAO;GACP,aAAa;GACd;EACD,OAAO;GACL,OAAO;GACP,aAAa;GACd;EACF,EACF;CACD,kBAAkB,CAChB;EACE,WAAW;EACX,OAAO;EACR,EACD;EACE,WAAW;EACX,OAAO;EACR,CACF;CACD,iBAAiB,EACf,WAAW,UACZ;CACF,CAAC"}

package/dist/components/Modal/index.d.cts

@@ -0,0 +1,2 @@
+import { ModalVariants } from "./Modal.styles.cjs";
+import { Modal, ModalActionProps, ModalContentProps, ModalDescriptionProps, ModalFooterProps, ModalOverlayProps, ModalTitleProps } from "./Modal.cjs";

package/dist/components/Primitive/Primitive.d.cts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime52 from "react/jsx-runtime";
+import * as react_jsx_runtime44 from "react/jsx-runtime";
 
 //#region src/components/Primitive/Primitive.d.ts
 interface PrimitiveProps {
@@ -12,63 +12,63 @@ interface PrimitiveProps {
 type PrimitivePropsWithRef<E extends React$1.ElementType> = React$1.ComponentProps<E> & PrimitiveProps;
 declare const Primitive: {
   div: {
-    (props: PrimitivePropsWithRef<"div">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"div">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   span: {
-    (props: PrimitivePropsWithRef<"span">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"span">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   img: {
-    (props: PrimitivePropsWithRef<"img">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"img">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   button: {
-    (props: PrimitivePropsWithRef<"button">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"button">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   label: {
-    (props: PrimitivePropsWithRef<"label">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"label">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   input: {
-    (props: PrimitivePropsWithRef<"input">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"input">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   textarea: {
-    (props: PrimitivePropsWithRef<"textarea">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"textarea">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   a: {
-    (props: PrimitivePropsWithRef<"a">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"a">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   p: {
-    (props: PrimitivePropsWithRef<"p">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"p">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   h2: {
-    (props: PrimitivePropsWithRef<"h2">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"h2">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   ul: {
-    (props: PrimitivePropsWithRef<"ul">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"ul">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   li: {
-    (props: PrimitivePropsWithRef<"li">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"li">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   svg: {
-    (props: PrimitivePropsWithRef<"svg">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"svg">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   circle: {
-    (props: PrimitivePropsWithRef<"circle">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"circle">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
   nav: {
-    (props: PrimitivePropsWithRef<"nav">): react_jsx_runtime52.JSX.Element;
+    (props: PrimitivePropsWithRef<"nav">): react_jsx_runtime44.JSX.Element;
     displayName: string;
   };
 };

package/dist/components/Primitive/Primitive.d.mts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime57 from "react/jsx-runtime";
+import * as react_jsx_runtime50 from "react/jsx-runtime";
 
 //#region src/components/Primitive/Primitive.d.ts
 interface PrimitiveProps {
@@ -12,63 +12,63 @@ interface PrimitiveProps {
 type PrimitivePropsWithRef<E extends React$1.ElementType> = React$1.ComponentProps<E> & PrimitiveProps;
 declare const Primitive: {
   div: {
-    (props: PrimitivePropsWithRef<"div">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"div">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   span: {
-    (props: PrimitivePropsWithRef<"span">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"span">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   img: {
-    (props: PrimitivePropsWithRef<"img">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"img">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   button: {
-    (props: PrimitivePropsWithRef<"button">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"button">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   label: {
-    (props: PrimitivePropsWithRef<"label">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"label">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   input: {
-    (props: PrimitivePropsWithRef<"input">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"input">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   textarea: {
-    (props: PrimitivePropsWithRef<"textarea">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"textarea">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   a: {
-    (props: PrimitivePropsWithRef<"a">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"a">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   p: {
-    (props: PrimitivePropsWithRef<"p">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"p">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   h2: {
-    (props: PrimitivePropsWithRef<"h2">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"h2">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   ul: {
-    (props: PrimitivePropsWithRef<"ul">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"ul">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   li: {
-    (props: PrimitivePropsWithRef<"li">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"li">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   svg: {
-    (props: PrimitivePropsWithRef<"svg">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"svg">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   circle: {
-    (props: PrimitivePropsWithRef<"circle">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"circle">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
   nav: {
-    (props: PrimitivePropsWithRef<"nav">): react_jsx_runtime57.JSX.Element;
+    (props: PrimitivePropsWithRef<"nav">): react_jsx_runtime50.JSX.Element;
     displayName: string;
   };
 };

package/dist/components/Primitive/index.d.cts

@@ -0,0 +1 @@
+import { Primitive, PrimitiveProps } from "./Primitive.cjs";

package/dist/components/PullToRefresh/PullToRefresh.cjs

@@ -0,0 +1,79 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_Spinner = require('../Spinner/Spinner.cjs');
+const require_PullToRefresh_styles = require('./PullToRefresh.styles.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/PullToRefresh/PullToRefresh.tsx
+const PullToRefresh = ({ children, onRefresh, threshold = 60, className }) => {
+	const { wrapper, loaderContainer, content } = require_PullToRefresh_styles.pullToRefresh();
+	const containerRef = (0, react.useRef)(null);
+	const [pullDistance, setPullDistance] = (0, react.useState)(0);
+	const [isRefreshing, setIsRefreshing] = (0, react.useState)(false);
+	const [isDragging, setIsDragging] = (0, react.useState)(false);
+	const startY = (0, react.useRef)(0);
+	const isTopReached = (0, react.useRef)(false);
+	const handleTouchStart = (e) => {
+		if (isRefreshing) return;
+		if (containerRef.current && containerRef.current.scrollTop === 0) {
+			isTopReached.current = true;
+			startY.current = e.touches[0].clientY;
+			setIsDragging(true);
+		} else isTopReached.current = false;
+	};
+	const handleTouchMove = (e) => {
+		if (!isTopReached.current || isRefreshing) return;
+		const diff = e.touches[0].clientY - startY.current;
+		if (diff > 0) {
+			setPullDistance(Math.min(diff * .5, threshold * 2.5));
+			if (e.cancelable) e.preventDefault();
+		}
+	};
+	const handleTouchEnd = async () => {
+		setIsDragging(false);
+		if (!isTopReached.current || isRefreshing) return;
+		if (pullDistance >= threshold) {
+			setIsRefreshing(true);
+			setPullDistance(threshold);
+			try {
+				await onRefresh();
+			} finally {
+				setIsRefreshing(false);
+				setPullDistance(0);
+			}
+		} else setPullDistance(0);
+	};
+	const transitionStyle = isDragging ? "none" : "all 0.45s cubic-bezier(0, 0, 0.2, 1)";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: containerRef,
+		className: wrapper({ className }),
+		onTouchStart: handleTouchStart,
+		onTouchMove: handleTouchMove,
+		onTouchEnd: handleTouchEnd,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: loaderContainer(),
+			style: {
+				height: "auto",
+				top: pullDistance > 0 ? `${pullDistance / 2}px` : `-${threshold}px`,
+				transform: "translateY(-50%)",
+				opacity: pullDistance > 0 ? Math.min(pullDistance / threshold, 1) : 0,
+				transition: transitionStyle
+			},
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Spinner.Spinner, {
+				size: "md",
+				speed: "fast"
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: content(),
+			style: {
+				transform: `translateY(${pullDistance}px)`,
+				transition: transitionStyle
+			},
+			children
+		})]
+	});
+};
+
+//#endregion
+exports.PullToRefresh = PullToRefresh;

package/dist/components/PullToRefresh/PullToRefresh.d.cts

@@ -0,0 +1,20 @@
+import { PullToRefreshVariants } from "./PullToRefresh.styles.cjs";
+import React from "react";
+import * as react_jsx_runtime77 from "react/jsx-runtime";
+
+//#region src/components/PullToRefresh/PullToRefresh.d.ts
+interface PullToRefreshProps extends PullToRefreshVariants {
+  children: React.ReactNode;
+  onRefresh: () => Promise<void>;
+  threshold?: number;
+  className?: string;
+}
+declare const PullToRefresh: ({
+  children,
+  onRefresh,
+  threshold,
+  className
+}: PullToRefreshProps) => react_jsx_runtime77.JSX.Element;
+//#endregion
+export { PullToRefresh, PullToRefreshProps };
+//# sourceMappingURL=PullToRefresh.d.cts.map

package/dist/components/PullToRefresh/PullToRefresh.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullToRefresh.d.cts","names":[],"sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"mappings":";;;;;UAOiB,kBAAA,SAA2B,qBAAA;EAC1C,QAAA,EAAU,KAAA,CAAM,SAAA;EAChB,SAAA,QAAiB,OAAA;EACjB,SAAA;EACA,SAAA;AAAA;AAAA,cAGW,aAAA;EAAiB,QAAA;EAAA,SAAA;EAAA,SAAA;EAAA;AAAA,GAK3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/PullToRefresh/PullToRefresh.d.mts

@@ -0,0 +1,20 @@
+import { PullToRefreshVariants } from "./PullToRefresh.styles.mjs";
+import React from "react";
+import * as react_jsx_runtime77 from "react/jsx-runtime";
+
+//#region src/components/PullToRefresh/PullToRefresh.d.ts
+interface PullToRefreshProps extends PullToRefreshVariants {
+  children: React.ReactNode;
+  onRefresh: () => Promise<void>;
+  threshold?: number;
+  className?: string;
+}
+declare const PullToRefresh: ({
+  children,
+  onRefresh,
+  threshold,
+  className
+}: PullToRefreshProps) => react_jsx_runtime77.JSX.Element;
+//#endregion
+export { PullToRefresh, PullToRefreshProps };
+//# sourceMappingURL=PullToRefresh.d.mts.map

package/dist/components/PullToRefresh/PullToRefresh.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullToRefresh.d.mts","names":[],"sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"mappings":";;;;;UAOiB,kBAAA,SAA2B,qBAAA;EAC1C,QAAA,EAAU,KAAA,CAAM,SAAA;EAChB,SAAA,QAAiB,OAAA;EACjB,SAAA;EACA,SAAA;AAAA;AAAA,cAGW,aAAA;EAAiB,QAAA;EAAA,SAAA;EAAA,SAAA;EAAA;AAAA,GAK3B,kBAAA,KAAkB,mBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/PullToRefresh/PullToRefresh.mjs

@@ -0,0 +1,78 @@
+import { Spinner } from "../Spinner/Spinner.mjs";
+import { pullToRefresh } from "./PullToRefresh.styles.mjs";
+import React, { useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/PullToRefresh/PullToRefresh.tsx
+const PullToRefresh = ({ children, onRefresh, threshold = 60, className }) => {
+	const { wrapper, loaderContainer, content } = pullToRefresh();
+	const containerRef = useRef(null);
+	const [pullDistance, setPullDistance] = useState(0);
+	const [isRefreshing, setIsRefreshing] = useState(false);
+	const [isDragging, setIsDragging] = useState(false);
+	const startY = useRef(0);
+	const isTopReached = useRef(false);
+	const handleTouchStart = (e) => {
+		if (isRefreshing) return;
+		if (containerRef.current && containerRef.current.scrollTop === 0) {
+			isTopReached.current = true;
+			startY.current = e.touches[0].clientY;
+			setIsDragging(true);
+		} else isTopReached.current = false;
+	};
+	const handleTouchMove = (e) => {
+		if (!isTopReached.current || isRefreshing) return;
+		const diff = e.touches[0].clientY - startY.current;
+		if (diff > 0) {
+			setPullDistance(Math.min(diff * .5, threshold * 2.5));
+			if (e.cancelable) e.preventDefault();
+		}
+	};
+	const handleTouchEnd = async () => {
+		setIsDragging(false);
+		if (!isTopReached.current || isRefreshing) return;
+		if (pullDistance >= threshold) {
+			setIsRefreshing(true);
+			setPullDistance(threshold);
+			try {
+				await onRefresh();
+			} finally {
+				setIsRefreshing(false);
+				setPullDistance(0);
+			}
+		} else setPullDistance(0);
+	};
+	const transitionStyle = isDragging ? "none" : "all 0.45s cubic-bezier(0, 0, 0.2, 1)";
+	return /* @__PURE__ */ jsxs("div", {
+		ref: containerRef,
+		className: wrapper({ className }),
+		onTouchStart: handleTouchStart,
+		onTouchMove: handleTouchMove,
+		onTouchEnd: handleTouchEnd,
+		children: [/* @__PURE__ */ jsx("div", {
+			className: loaderContainer(),
+			style: {
+				height: "auto",
+				top: pullDistance > 0 ? `${pullDistance / 2}px` : `-${threshold}px`,
+				transform: "translateY(-50%)",
+				opacity: pullDistance > 0 ? Math.min(pullDistance / threshold, 1) : 0,
+				transition: transitionStyle
+			},
+			children: /* @__PURE__ */ jsx(Spinner, {
+				size: "md",
+				speed: "fast"
+			})
+		}), /* @__PURE__ */ jsx("div", {
+			className: content(),
+			style: {
+				transform: `translateY(${pullDistance}px)`,
+				transition: transitionStyle
+			},
+			children
+		})]
+	});
+};
+
+//#endregion
+export { PullToRefresh };
+//# sourceMappingURL=PullToRefresh.mjs.map

package/dist/components/PullToRefresh/PullToRefresh.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullToRefresh.mjs","names":[],"sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { Spinner } from '../Spinner';\nimport {\n  pullToRefresh,\n  type PullToRefreshVariants,\n} from './PullToRefresh.styles';\n\nexport interface PullToRefreshProps extends PullToRefreshVariants {\n  children: React.ReactNode;\n  onRefresh: () => Promise<void>;\n  threshold?: number;\n  className?: string;\n}\n\nexport const PullToRefresh = ({\n  children,\n  onRefresh,\n  threshold = 60,\n  className,\n}: PullToRefreshProps) => {\n  const { wrapper, loaderContainer, content } = pullToRefresh();\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [pullDistance, setPullDistance] = useState(0);\n  const [isRefreshing, setIsRefreshing] = useState(false);\n  const [isDragging, setIsDragging] = useState(false); // [추가] 드래그 상태 감지\n\n  const startY = useRef(0);\n  const isTopReached = useRef(false);\n\n  const handleTouchStart = (e: React.TouchEvent) => {\n    if (isRefreshing) return;\n\n    if (containerRef.current && containerRef.current.scrollTop === 0) {\n      isTopReached.current = true;\n      startY.current = e.touches[0].clientY;\n      setIsDragging(true);\n    } else {\n      isTopReached.current = false;\n    }\n  };\n\n  const handleTouchMove = (e: React.TouchEvent) => {\n    if (!isTopReached.current || isRefreshing) return;\n\n    const currentY = e.touches[0].clientY;\n    const diff = currentY - startY.current;\n\n    if (diff > 0) {\n      const resistance = 0.5;\n      const newDistance = Math.min(diff * resistance, threshold * 2.5);\n\n      setPullDistance(newDistance);\n\n      if (e.cancelable) e.preventDefault();\n    }\n  };\n\n  const handleTouchEnd = async () => {\n    setIsDragging(false);\n\n    if (!isTopReached.current || isRefreshing) return;\n\n    if (pullDistance >= threshold) {\n      setIsRefreshing(true);\n      setPullDistance(threshold);\n\n      try {\n        await onRefresh();\n      } finally {\n        setIsRefreshing(false);\n        setPullDistance(0);\n      }\n    } else {\n      // 임계값 못 넘음 -> 0으로 복귀\n      setPullDistance(0);\n    }\n  };\n\n  const transitionStyle = isDragging\n    ? 'none'\n    : 'all 0.45s cubic-bezier(0, 0, 0.2, 1)';\n\n  return (\n    <div\n      ref={containerRef}\n      className={wrapper({ className })}\n      onTouchStart={handleTouchStart}\n      onTouchMove={handleTouchMove}\n      onTouchEnd={handleTouchEnd}\n    >\n      <div\n        className={loaderContainer()}\n        style={{\n          height: 'auto',\n          top: pullDistance > 0 ? `${pullDistance / 2}px` : `-${threshold}px`,\n          transform: 'translateY(-50%)',\n          opacity: pullDistance > 0 ? Math.min(pullDistance / threshold, 1) : 0,\n          transition: transitionStyle,\n        }}\n      >\n        <Spinner size=\"md\" speed=\"fast\" />\n      </div>\n      <div\n        className={content()}\n        style={{\n          transform: `translateY(${pullDistance}px)`,\n          transition: transitionStyle,\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAcA,MAAa,iBAAiB,EAC5B,UACA,WACA,YAAY,IACZ,gBACwB;CACxB,MAAM,EAAE,SAAS,iBAAiB,YAAY,eAAe;CAE7D,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,CAAC,cAAc,mBAAmB,SAAS,EAAE;CACnD,MAAM,CAAC,cAAc,mBAAmB,SAAS,MAAM;CACvD,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CAEnD,MAAM,SAAS,OAAO,EAAE;CACxB,MAAM,eAAe,OAAO,MAAM;CAElC,MAAM,oBAAoB,MAAwB;AAChD,MAAI,aAAc;AAElB,MAAI,aAAa,WAAW,aAAa,QAAQ,cAAc,GAAG;AAChE,gBAAa,UAAU;AACvB,UAAO,UAAU,EAAE,QAAQ,GAAG;AAC9B,iBAAc,KAAK;QAEnB,cAAa,UAAU;;CAI3B,MAAM,mBAAmB,MAAwB;AAC/C,MAAI,CAAC,aAAa,WAAW,aAAc;EAG3C,MAAM,OADW,EAAE,QAAQ,GAAG,UACN,OAAO;AAE/B,MAAI,OAAO,GAAG;AAIZ,mBAFoB,KAAK,IAAI,OADV,IAC6B,YAAY,IAAI,CAEpC;AAE5B,OAAI,EAAE,WAAY,GAAE,gBAAgB;;;CAIxC,MAAM,iBAAiB,YAAY;AACjC,gBAAc,MAAM;AAEpB,MAAI,CAAC,aAAa,WAAW,aAAc;AAE3C,MAAI,gBAAgB,WAAW;AAC7B,mBAAgB,KAAK;AACrB,mBAAgB,UAAU;AAE1B,OAAI;AACF,UAAM,WAAW;aACT;AACR,oBAAgB,MAAM;AACtB,oBAAgB,EAAE;;QAIpB,iBAAgB,EAAE;;CAItB,MAAM,kBAAkB,aACpB,SACA;AAEJ,QACE,qBAAC;EACC,KAAK;EACL,WAAW,QAAQ,EAAE,WAAW,CAAC;EACjC,cAAc;EACd,aAAa;EACb,YAAY;aAEZ,oBAAC;GACC,WAAW,iBAAiB;GAC5B,OAAO;IACL,QAAQ;IACR,KAAK,eAAe,IAAI,GAAG,eAAe,EAAE,MAAM,IAAI,UAAU;IAChE,WAAW;IACX,SAAS,eAAe,IAAI,KAAK,IAAI,eAAe,WAAW,EAAE,GAAG;IACpE,YAAY;IACb;aAED,oBAAC;IAAQ,MAAK;IAAK,OAAM;KAAS;IAC9B,EACN,oBAAC;GACC,WAAW,SAAS;GACpB,OAAO;IACL,WAAW,cAAc,aAAa;IACtC,YAAY;IACb;GAEA;IACG;GACF"}

package/dist/components/PullToRefresh/PullToRefresh.styles.cjs

@@ -0,0 +1,12 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let tailwind_variants = require("tailwind-variants");
+
+//#region src/components/PullToRefresh/PullToRefresh.styles.ts
+const pullToRefresh = (0, tailwind_variants.tv)({ slots: {
+	wrapper: "relative w-full h-full overflow-y-auto overscroll-y-none touch-pan-y",
+	loaderContainer: "absolute top-0 left-0 w-full flex justify-center items-center pointer-events-none z-10",
+	content: "relative w-full transition-transform duration-200 ease-out will-change-transform"
+} });
+
+//#endregion
+exports.pullToRefresh = pullToRefresh;

package/dist/components/PullToRefresh/PullToRefresh.styles.d.cts

@@ -0,0 +1,46 @@
+import * as tailwind_variants53 from "tailwind-variants";
+import { VariantProps } from "tailwind-variants";
+import * as tailwind_merge0 from "tailwind-merge";
+
+//#region src/components/PullToRefresh/PullToRefresh.styles.d.ts
+declare const pullToRefresh: tailwind_variants53.TVReturnType<{
+  [key: string]: {
+    [key: string]: tailwind_merge0.ClassNameValue | {
+      content?: tailwind_merge0.ClassNameValue;
+      wrapper?: tailwind_merge0.ClassNameValue;
+      loaderContainer?: tailwind_merge0.ClassNameValue;
+    };
+  };
+} | {
+  [x: string]: {
+    [x: string]: tailwind_merge0.ClassNameValue | {
+      content?: tailwind_merge0.ClassNameValue;
+      wrapper?: tailwind_merge0.ClassNameValue;
+      loaderContainer?: tailwind_merge0.ClassNameValue;
+    };
+  };
+} | {}, {
+  wrapper: string;
+  loaderContainer: string;
+  content: string;
+}, undefined, {
+  [key: string]: {
+    [key: string]: tailwind_merge0.ClassNameValue | {
+      content?: tailwind_merge0.ClassNameValue;
+      wrapper?: tailwind_merge0.ClassNameValue;
+      loaderContainer?: tailwind_merge0.ClassNameValue;
+    };
+  };
+} | {}, {
+  wrapper: string;
+  loaderContainer: string;
+  content: string;
+}, tailwind_variants53.TVReturnType<unknown, {
+  wrapper: string;
+  loaderContainer: string;
+  content: string;
+}, undefined, unknown, unknown, undefined>>;
+type PullToRefreshVariants = VariantProps<typeof pullToRefresh>;
+//#endregion
+export { PullToRefreshVariants };
+//# sourceMappingURL=PullToRefresh.styles.d.cts.map

package/dist/components/PullToRefresh/PullToRefresh.styles.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullToRefresh.styles.d.cts","names":[],"sources":["../../../src/components/PullToRefresh/PullToRefresh.styles.ts"],"mappings":";;;;;cAEa,aAAA,sBAAa,YAAA;EAAA;mBASxB,eAAA,CAAA,cAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAEU,qBAAA,GAAwB,YAAA,QAAoB,aAAA"}

package/dist/components/PullToRefresh/PullToRefresh.styles.d.mts

@@ -0,0 +1,46 @@
+import * as tailwind_variants47 from "tailwind-variants";
+import { VariantProps } from "tailwind-variants";
+import * as tailwind_merge0 from "tailwind-merge";
+
+//#region src/components/PullToRefresh/PullToRefresh.styles.d.ts
+declare const pullToRefresh: tailwind_variants47.TVReturnType<{
+  [key: string]: {
+    [key: string]: tailwind_merge0.ClassNameValue | {
+      content?: tailwind_merge0.ClassNameValue;
+      wrapper?: tailwind_merge0.ClassNameValue;
+      loaderContainer?: tailwind_merge0.ClassNameValue;
+    };
+  };
+} | {
+  [x: string]: {
+    [x: string]: tailwind_merge0.ClassNameValue | {
+      content?: tailwind_merge0.ClassNameValue;
+      wrapper?: tailwind_merge0.ClassNameValue;
+      loaderContainer?: tailwind_merge0.ClassNameValue;
+    };
+  };
+} | {}, {
+  wrapper: string;
+  loaderContainer: string;
+  content: string;
+}, undefined, {
+  [key: string]: {
+    [key: string]: tailwind_merge0.ClassNameValue | {
+      content?: tailwind_merge0.ClassNameValue;
+      wrapper?: tailwind_merge0.ClassNameValue;
+      loaderContainer?: tailwind_merge0.ClassNameValue;
+    };
+  };
+} | {}, {
+  wrapper: string;
+  loaderContainer: string;
+  content: string;
+}, tailwind_variants47.TVReturnType<unknown, {
+  wrapper: string;
+  loaderContainer: string;
+  content: string;
+}, undefined, unknown, unknown, undefined>>;
+type PullToRefreshVariants = VariantProps<typeof pullToRefresh>;
+//#endregion
+export { PullToRefreshVariants };
+//# sourceMappingURL=PullToRefresh.styles.d.mts.map

package/dist/components/PullToRefresh/PullToRefresh.styles.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullToRefresh.styles.d.mts","names":[],"sources":["../../../src/components/PullToRefresh/PullToRefresh.styles.ts"],"mappings":";;;;;cAEa,aAAA,sBAAa,YAAA;EAAA;mBASxB,eAAA,CAAA,cAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAEU,qBAAA,GAAwB,YAAA,QAAoB,aAAA"}

package/dist/components/PullToRefresh/PullToRefresh.styles.mjs

@@ -0,0 +1,12 @@
+import { tv } from "tailwind-variants";
+
+//#region src/components/PullToRefresh/PullToRefresh.styles.ts
+const pullToRefresh = tv({ slots: {
+	wrapper: "relative w-full h-full overflow-y-auto overscroll-y-none touch-pan-y",
+	loaderContainer: "absolute top-0 left-0 w-full flex justify-center items-center pointer-events-none z-10",
+	content: "relative w-full transition-transform duration-200 ease-out will-change-transform"
+} });
+
+//#endregion
+export { pullToRefresh };
+//# sourceMappingURL=PullToRefresh.styles.mjs.map

package/dist/components/PullToRefresh/PullToRefresh.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PullToRefresh.styles.mjs","names":[],"sources":["../../../src/components/PullToRefresh/PullToRefresh.styles.ts"],"sourcesContent":["import { tv, type VariantProps } from 'tailwind-variants';\n\nexport const pullToRefresh = tv({\n  slots: {\n    wrapper:\n      'relative w-full h-full overflow-y-auto overscroll-y-none touch-pan-y',\n    loaderContainer:\n      'absolute top-0 left-0 w-full flex justify-center items-center pointer-events-none z-10',\n    content:\n      'relative w-full transition-transform duration-200 ease-out will-change-transform',\n  },\n});\n\nexport type PullToRefreshVariants = VariantProps<typeof pullToRefresh>;\n"],"mappings":";;;AAEA,MAAa,gBAAgB,GAAG,EAC9B,OAAO;CACL,SACE;CACF,iBACE;CACF,SACE;CACH,EACF,CAAC"}

package/dist/components/PullToRefresh/index.d.cts

@@ -0,0 +1 @@
+import { PullToRefresh, PullToRefreshProps } from "./PullToRefresh.cjs";

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

@@ -0,0 +1 @@
+import { PullToRefresh, PullToRefreshProps } from "./PullToRefresh.mjs";

package/dist/components/Radio/Radio.d.cts

@@ -1,6 +1,7 @@
 import { PrimitiveProps } from "../Primitive/Primitive.cjs";
+import "../Primitive/index.cjs";
 import React from "react";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/Radio/Radio.d.ts
 interface RadioGroupContextValue {
@@ -25,7 +26,7 @@ declare const RadioGroup: {
     className,
     children,
     ...props
-  }: RadioGroupProps): react_jsx_runtime6.JSX.Element;
+  }: RadioGroupProps): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 interface RadioProps extends Omit<React.ComponentProps<'input'>, 'type'> {
@@ -40,7 +41,7 @@ declare const Radio: {
     checked: checkedProp,
     onChange,
     ...props
-  }: RadioProps): react_jsx_runtime6.JSX.Element;
+  }: RadioProps): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/components/Radio/Radio.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.cts","names":[],"sources":["../../../src/components/Radio/Radio.tsx"],"mappings":";;;;;UAMU,sBAAA;EACR,IAAA;EACA,KAAA;EACA,QAAA,IAAY,KAAA;AAAA;AAAA,cAKR,oBAAA,QAAoB,sBAAA;AAAA,UAKT,eAAA,SACP,KAAA,CAAM,cAAA,CAAe,cAAA,GAAiB,cAAA;EAC9C,IAAA;EACA,KAAA;EACA,YAAA;EACA,aAAA,IAAiB,KAAA;EACjB,QAAA,EAAU,KAAA,CAAM,SAAA;AAAA;AAAA,cAGL,UAAA;EAAA;;;;;;;;KAQV,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA;;;UAuDD,UAAA,SAAmB,IAAA,CAClC,KAAA,CAAM,cAAA;EAGN,KAAA;EACA,QAAA,EAAU,KAAA,CAAM,SAAA;AAAA;AAAA,cAGL,KAAA;EAAA;;;;;;;KAOV,UAAA,GAAU,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Radio.d.cts","names":[],"sources":["../../../src/components/Radio/Radio.tsx"],"mappings":";;;;;;UAMU,sBAAA;EACR,IAAA;EACA,KAAA;EACA,QAAA,IAAY,KAAA;AAAA;AAAA,cAKR,oBAAA,QAAoB,sBAAA;AAAA,UAKT,eAAA,SACP,KAAA,CAAM,cAAA,CAAe,cAAA,GAAiB,cAAA;EAC9C,IAAA;EACA,KAAA;EACA,YAAA;EACA,aAAA,IAAiB,KAAA;EACjB,QAAA,EAAU,KAAA,CAAM,SAAA;AAAA;AAAA,cAGL,UAAA;EAAA;;;;;;;;KAQV,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA;;;UAuDD,UAAA,SAAmB,IAAA,CAClC,KAAA,CAAM,cAAA;EAGN,KAAA;EACA,QAAA,EAAU,KAAA,CAAM,SAAA;AAAA;AAAA,cAGL,KAAA;EAAA;;;;;;;KAOV,UAAA,GAAU,kBAAA,CAAA,GAAA,CAAA,OAAA"}