@uniai-fe/uds-primitives 0.8.0 → 0.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-primitives",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "UNIAI Design System; Primitives Components Package",
   "type": "module",
   "private": false,
@@ -16,10 +16,9 @@
   "publishConfig": {
     "access": "public"
   },
-  "packageManager": "pnpm@10.33.3",
   "engines": {
     "node": ">=24",
-    "pnpm": ">=10"
+    "pnpm": ">=11"
   },
   "author": {
     "name": "GraffitoRyu",
@@ -43,31 +42,16 @@
     "./mantine-style": "./src/init/mantine.css",
     "./*": "./src/*"
   },
-  "scripts": {
-    "format": "prettier --write .",
-    "format:check": "prettier --check .",
-    "lint": "eslint . --max-warnings=0",
-    "typecheck": "tsc --project tsconfig.build.json --noEmit",
-    "build": "pnpm format && pnpm typecheck && pnpm css:build",
-    "css:build": "sass --load-path=node_modules src/index.scss dist/styles.css --style=expanded --no-source-map && node ./scripts/merge-theme-root.mjs dist/styles.css --selector=:root",
-    "dev": "tsc --project tsconfig.build.json --watch --noEmit",
-    "module:lint": "pnpm lint",
-    "module:typecheck": "pnpm typecheck",
-    "module:build": "pnpm build",
-    "design-primitives:build": "pnpm run build",
-    "design-primitives:dev": "pnpm run dev",
-    "publish:public": "bash ../../../scripts/npm-publish.sh"
-  },
   "peerDependencies": {
-    "@mantine/core": "^8",
-    "@mantine/dates": "^8",
-    "@mantine/hooks": "^8",
-    "@uniai-fe/uds-foundation": "^0.4.2",
-    "@uniai-fe/util-functions": "^0.2.3",
-    "react": "^19",
+    "@mantine/core": ">=8 <9",
+    "@mantine/dates": ">=8 <9",
+    "@mantine/hooks": ">=8 <9",
+    "@uniai-fe/uds-foundation": "^0.4.8",
+    "@uniai-fe/util-functions": "^0.3.0",
+    "react": ">=19 <20",
     "react-daum-postcode": "^4.0.0",
-    "react-dom": "^19",
-    "react-hook-form": "^7",
+    "react-dom": ">=19 <20",
+    "react-hook-form": ">=7 <8",
     "@radix-ui/react-checkbox": "^1.3.3",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-popover": "^1.1.15",
@@ -98,15 +82,34 @@
     "@types/node": "^24.12.3",
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
-    "@uniai-fe/eslint-config": "workspace:*",
-    "@uniai-fe/next-devkit": "workspace:*",
-    "@uniai-fe/tsconfig": "workspace:*",
-    "@uniai-fe/uds-foundation": "workspace:*",
-    "@uniai-fe/util-functions": "workspace:*",
     "eslint": "^9.39.2",
     "prettier": "^3.8.4",
     "react-hook-form": "^7.80.0",
     "sass": "^1.101.0",
-    "typescript": "5.9.3"
+    "typescript": "6.0.3",
+    "@uniai-fe/eslint-config": "0.2.0",
+    "@uniai-fe/util-functions": "0.4.0",
+    "@uniai-fe/tsconfig": "0.2.0",
+    "@uniai-fe/next-devkit": "0.3.0",
+    "@uniai-fe/uds-foundation": "0.5.0"
+  },
+  "scripts": {
+    "check:pre-commit": "pnpm --dir ../../.. run check:pre-commit",
+    "check:pre-push": "pnpm --dir ../../.. run check:pre-push",
+    "check:pre-push:dry-run": "pnpm --dir ../../.. run check:pre-push:dry-run",
+    "format": "prettier --write .",
+    "format:fix": "pnpm format",
+    "format:check": "prettier --check .",
+    "lint": "eslint . --max-warnings=0",
+    "typecheck": "tsc --project tsconfig.build.json --noEmit",
+    "build": "pnpm format && pnpm typecheck && pnpm css:build && pnpm format",
+    "css:build": "sass --load-path=node_modules src/index.scss dist/styles.css --style=expanded --no-source-map && node ./scripts/merge-theme-root.mjs dist/styles.css --selector=:root",
+    "dev": "tsc --project tsconfig.build.json --watch --noEmit",
+    "module:lint": "pnpm lint",
+    "module:typecheck": "pnpm typecheck",
+    "module:build": "pnpm build",
+    "design-primitives:build": "pnpm run build",
+    "design-primitives:dev": "pnpm run dev",
+    "publish:public": "bash ../../../scripts/npm-publish.sh"
   }
-}
+}

package/src/components/dropdown/markup/foundation/Container.tsx

@@ -2,7 +2,7 @@
 
 import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
 import clsx from "clsx";
-import { forwardRef, useEffect, useMemo, useState } from "react";
+import { forwardRef, useCallback, useEffect, useMemo, useState } from "react";
 
 import type { DropdownContainerProps } from "../../types/props";
 import { useDropdownContext } from "./Provider";
@@ -49,46 +49,49 @@ const DropdownContainer = forwardRef<HTMLDivElement, DropdownContainerProps>(
     const [panelWidth, setPanelWidth] = useState<number>();
     const shouldMatchTriggerWidth = width === "match";
 
-    const resolvePanelSizeValue = (
-      value?: string | number,
-      fallbackToMatch?: boolean,
-    ): string | undefined => {
-      if (value === undefined) {
-        return undefined;
-      }
-
-      if (typeof value === "number") {
-        return `${value}px`;
-      }
-
-      if (typeof value === "string") {
-        if (value === "fit-content") {
-          return "fit-content";
-        }
-        if (value === "max-content") {
-          return "max-content";
+    const resolvePanelSizeValue = useCallback(
+      (
+        value?: string | number,
+        fallbackToMatch?: boolean,
+      ): string | undefined => {
+        if (value === undefined) {
+          return undefined;
         }
-        if (fallbackToMatch && value === "match" && panelWidth) {
-          return `${panelWidth}px`;
+
+        if (typeof value === "number") {
+          return `${value}px`;
         }
-        if (value.trim().length > 0 && value !== "match") {
-          return value;
+
+        if (typeof value === "string") {
+          if (value === "fit-content") {
+            return "fit-content";
+          }
+          if (value === "max-content") {
+            return "max-content";
+          }
+          if (fallbackToMatch && value === "match" && panelWidth) {
+            return `${panelWidth}px`;
+          }
+          if (value.trim().length > 0 && value !== "match") {
+            return value;
+          }
         }
-      }
 
-      return undefined;
-    };
+        return undefined;
+      },
+      [panelWidth],
+    );
     const resolvedWidth = useMemo(() => {
       if (shouldMatchTriggerWidth) {
         return panelWidth ? `${panelWidth}px` : undefined;
       }
 
       return resolvePanelSizeValue(width);
-    }, [panelWidth, shouldMatchTriggerWidth, width]);
+    }, [panelWidth, resolvePanelSizeValue, shouldMatchTriggerWidth, width]);
     const resolvedMinWidth = useMemo(() => {
       // 변경 설명: width 계약은 기준 폭, minWidth 계약은 최소 보장 폭으로 분리한다.
       return resolvePanelSizeValue(minWidth, true);
-    }, [minWidth, panelWidth]);
+    }, [minWidth, resolvePanelSizeValue]);
 
     useEffect(() => {
       if (!shouldMatchTriggerWidth) {

package/src/components/dropdown/types/base.ts

@@ -11,11 +11,7 @@ export type DropdownSize = "xsmall" | "small" | "medium" | "large";
  * - string/number: min-width 커스텀 값
  */
 export type DropdownPanelWidth =
-  | "match"
-  | "fit-content"
-  | "max-content"
-  | string
-  | number;
+  "match" | "fit-content" | "max-content" | string | number;
 
 /**
  * Dropdown panel min-width 옵션
@@ -24,8 +20,4 @@ export type DropdownPanelWidth =
  * - string/number: 커스텀 최소 폭
  */
 export type DropdownPanelMinWidth =
-  | "match"
-  | "fit-content"
-  | "max-content"
-  | string
-  | number;
+  "match" | "fit-content" | "max-content" | string | number;

package/src/components/input/markup/foundation/Input.tsx

@@ -179,8 +179,7 @@ const InputBase = forwardRef<HTMLInputElement, InputProps>(
 
     const handleClear = (
       event:
-        | MouseEvent<HTMLButtonElement>
-        | ReactPointerEvent<HTMLButtonElement>,
+        MouseEvent<HTMLButtonElement> | ReactPointerEvent<HTMLButtonElement>,
     ) => {
       event.preventDefault();
       dispatchNativeInputEvent();

package/src/components/input/types/file.ts

@@ -21,8 +21,7 @@ export type InputFileSource = "input" | "drop";
  * Input Types; File Upload 이벤트 타입
  */
 export type InputFileEvent =
-  | ChangeEvent<HTMLInputElement>
-  | DragEvent<HTMLElement>;
+  ChangeEvent<HTMLInputElement> | DragEvent<HTMLElement>;
 
 /**
  * Input Types; File Upload 변경 핸들러

package/src/components/pop-over/types/pop-over.ts

@@ -14,11 +14,7 @@ import type { ReactNode } from "react";
  * @property {string} width CSS width 문자열
  */
 export type PopOverContentWidth =
-  | "match"
-  | "fit-content"
-  | "max-content"
-  | number
-  | string;
+  "match" | "fit-content" | "max-content" | number | string;
 
 /**
  * PopOver Root props.