@uniai-fe/uds-primitives 0.3.39 → 0.3.41

package/dist/styles.css

@@ -586,10 +586,10 @@
   --select-text-large-line-height: var(--input-text-large-line-height);
   --select-text-large-letter-spacing: var(--input-text-large-letter-spacing);
   --select-text-large-weight: var(--input-text-large-weight);
-  --select-icon-size-xsmall: 1.4rem;
-  --select-icon-size-small: 1.6rem;
-  --select-icon-size-medium: 2rem;
-  --select-icon-size-large: 2rem;
+  --select-icon-size-xsmall: 14px;
+  --select-icon-size-small: 16px;
+  --select-icon-size-medium: 20px;
+  --select-icon-size-large: 20px;
   --select-primary-color-placeholder: var(--input-placeholder-color);
   /* 변경: placeholder disabled/readonly 토큰을 분리해 상태별 제어 지점을 고정한다. */
   --select-primary-color-placeholder-disabled: var(--color-label-disabled);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-primitives",
-  "version": "0.3.39",
+  "version": "0.3.41",
   "description": "UNIAI Design System; Primitives Components Package",
   "type": "module",
   "private": false,

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

@@ -0,0 +1,16 @@
+import clsx from "clsx";
+import { Slot } from "../../../slot";
+
+export default function DropdownMenuItemLabel({
+  className,
+  children,
+}: {
+  className?: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <Slot.Text className={clsx("dropdown-menu-item-label", className)}>
+      {children}
+    </Slot.Text>
+  );
+}

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

@@ -6,7 +6,7 @@ import { forwardRef } from "react";
 
 import type { DropdownMenuItemProps } from "../../types/props";
 import { Checkbox } from "../../../checkbox/markup/Checkbox";
-import { Slot } from "../../../slot";
+import DropdownMenuItemLabel from "./Label";
 
 /**
  * Dropdown Foundation; Menu Item 옵션 렌더링 컴포넌트
@@ -94,17 +94,13 @@ const DropdownMenuItem = forwardRef<HTMLDivElement, DropdownMenuItemProps>(
           {/* 변경: description이 있을 때만 body wrapper를 렌더링해 불필요한 중첩 span을 줄인다. */}
           {description ? (
             <span className="dropdown-menu-item-body">
-              <Slot.Text className="dropdown-menu-item-label">
-                {label ?? children}
-              </Slot.Text>
+              <DropdownMenuItemLabel>{label ?? children}</DropdownMenuItemLabel>
               <span className="dropdown-menu-item-description">
                 {description}
               </span>
             </span>
           ) : (
-            <Slot.Text className="dropdown-menu-item-label">
-              {label ?? children}
-            </Slot.Text>
+            <DropdownMenuItemLabel>{label ?? children}</DropdownMenuItemLabel>
           )}
           {right ? (
             <span className="dropdown-menu-item-right">{right}</span>

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

@@ -4,6 +4,7 @@ import DropdownMenuList from "./MenuList";
 import DropdownRoot from "./Root";
 import { DropdownProvider } from "./Provider";
 import DropdownTrigger from "./Trigger";
+import DropdownMenuItemLabel from "./Label";
 
 /**
  * Dropdown; 기초 컴포넌트
@@ -13,6 +14,7 @@ import DropdownTrigger from "./Trigger";
  * - Menu
  *     - Item
  *     - List
+ *     - Label
  * - Panel
  * - Trigger
  */
@@ -20,6 +22,10 @@ export const DropdownFoundation = {
   Provider: DropdownProvider,
   Root: DropdownRoot,
   Container: DropdownContainer,
-  Menu: { Item: DropdownMenuItem, List: DropdownMenuList },
+  Menu: {
+    Item: DropdownMenuItem,
+    List: DropdownMenuList,
+    Label: DropdownMenuItemLabel,
+  },
   Trigger: DropdownTrigger,
 };

package/src/components/select/styles/variables.scss

@@ -90,10 +90,10 @@
   --select-text-large-letter-spacing: var(--input-text-large-letter-spacing);
   --select-text-large-weight: var(--input-text-large-weight);
 
-  --select-icon-size-xsmall: 1.4rem;
-  --select-icon-size-small: 1.6rem;
-  --select-icon-size-medium: 2rem;
-  --select-icon-size-large: 2rem;
+  --select-icon-size-xsmall: 14px;
+  --select-icon-size-small: 16px;
+  --select-icon-size-medium: 20px;
+  --select-icon-size-large: 20px;
 
   --select-primary-color-placeholder: var(--input-placeholder-color);
   /* 변경: placeholder disabled/readonly 토큰을 분리해 상태별 제어 지점을 고정한다. */