@uniai-fe/uds-primitives 0.1.7 → 0.1.8

package/README.md

@@ -102,6 +102,11 @@ function Templates() {
 - 템플릿별 클래스를 추가로 노출한다: `.button-template-text`, `.button-template-text-size-*`, `.button-template-round`, `.button-template-round-size-*`.
 - 스토리북 `primitives/Button` Story에서 solid/outlined/텍스트/라운드 4가지 카테고리를 한 번에 확인할 수 있다.
 
+### 최근 업데이트
+
+- TextInput Base 컴포넌트의 `clear` 버튼 로직을 pointer 이벤트 기반으로 재작성해 모바일 터치 환경에서도 안정적으로 입력값이 초기화되도록 했다.
+- react-hook-form `register`와 연계된 값도 동일하게 초기화되며, focus가 빠지면 clear 버튼이 자동으로 숨겨진다.
+
 ## 스타일 내보내기
 
 foundation CSS는 앱 루트에서 한 번만 직접 import해야 한다. primitives `styles/css` 엔트리는 **컴포넌트 SCSS만** 포함하며 foundation 토큰을 다시 로드하지 않는다.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-primitives",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "UNIAI Design System; Primitives Components Package",
   "type": "module",
   "private": false,
@@ -53,12 +53,12 @@
     "design-primitives:dev": "pnpm run dev"
   },
   "peerDependencies": {
-    "@uniai-fe/uds-foundation": "^0.0.1",
+    "@uniai-fe/uds-foundation": "^0.1.0",
     "@uniai-fe/util-functions": "^0.2.3",
     "@radix-ui/react-visually-hidden": "^1.2.4",
-    "react": ">= 19",
-    "react-dom": ">= 19",
-    "react-hook-form": ">= 7"
+    "react": "^19",
+    "react-dom": "^19",
+    "react-hook-form": "^7"
   },
   "dependencies": {
     "@mantine/core": "^8.3.11",

package/src/components/form/Provider.tsx

@@ -0,0 +1,37 @@
+"use client";
+
+import { useEffect } from "react";
+// import { useEffect } from "react";
+import {
+  FormProvider as ReactHookFormProvider,
+  useForm,
+  type FieldValues,
+  type UseFormProps,
+  type UseFormReturn,
+} from "react-hook-form";
+
+/**
+ * react-hook-form; context provider
+ */
+export default function FormProvider<FormDataType extends FieldValues>({
+  children,
+  options,
+  callback,
+}: {
+  children: React.ReactNode;
+} & Partial<{
+  options: UseFormProps<FormDataType>;
+  callback: (params: UseFormReturn<FormDataType>) => void | undefined;
+}>) {
+  const formMethods = useForm<FormDataType>({ mode: "all", ...options });
+
+  useEffect(() => {
+    if (typeof callback === "undefined") return;
+    // if (typeof callback !== "undefined")
+    callback(formMethods);
+  }, [callback, formMethods]);
+
+  return (
+    <ReactHookFormProvider {...formMethods}>{children}</ReactHookFormProvider>
+  );
+}

package/src/components/form/index.tsx

@@ -0,0 +1,3 @@
+import FormProvider from "./Provider";
+
+export const Form = { Provider: FormProvider };

package/src/index.tsx

@@ -24,3 +24,6 @@ export * from "./components/alternate";
 export * from "./components/segmented-control";
 export * from "./components/divider";
 export * from "./types";
+
+// 기타 도구
+export * from "./components/form";