@ceed/cds 1.36.0-next.1 → 1.37.0-next.1

package/dist/index.cjs

@@ -3291,11 +3291,22 @@ function Select(props) {
     disabled,
     required,
     onChange,
+    // NOTE: id 를 FormControl 에 넘겨 htmlFor/labelId(`${id}-label`)를 결정론적으로 만든다.
+    // Joy FormControl context 가 FormLabel(id) ↔ Select button(aria-labelledby)을 자동 결선하므로,
+    // 외부에서 useId 로 라벨/버튼 ARIA 를 수동 결합할 필요가 없다.
+    id,
+    slotProps,
     // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
     sx,
     className,
     ...innerProps
   } = props;
+  const {
+    formControl: formControlProps,
+    formLabel: formLabelProps,
+    formHelperText: formHelperTextProps,
+    ...joySlotProps
+  } = slotProps ?? {};
   const options = (0, import_react23.useMemo)(
     () => props.options.map((option) => {
       if (option.hasOwnProperty("value") && option.hasOwnProperty("label")) {
@@ -3336,6 +3347,7 @@ function Select(props) {
       disabled,
       size,
       color: error ? "danger" : color,
+      slotProps: joySlotProps,
       onChange: handleChange,
       renderValue: (selected) => {
         if (!selected) return null;
@@ -3355,12 +3367,14 @@ function Select(props) {
       size,
       color,
       error,
+      id,
       sx,
-      className
+      className,
+      ...formControlProps
     },
-    label && /* @__PURE__ */ import_react23.default.createElement(FormLabel_default, null, label),
+    label && /* @__PURE__ */ import_react23.default.createElement(FormLabel_default, { ...formLabelProps }, label),
     select,
-    helperText && /* @__PURE__ */ import_react23.default.createElement(FormHelperText_default, null, helperText)
+    helperText && /* @__PURE__ */ import_react23.default.createElement(FormHelperText_default, { ...formHelperTextProps }, helperText)
   );
 }
 Select.displayName = "Select";

package/dist/index.js

@@ -3176,11 +3176,22 @@ function Select(props) {
     disabled,
     required,
     onChange,
+    // NOTE: id 를 FormControl 에 넘겨 htmlFor/labelId(`${id}-label`)를 결정론적으로 만든다.
+    // Joy FormControl context 가 FormLabel(id) ↔ Select button(aria-labelledby)을 자동 결선하므로,
+    // 외부에서 useId 로 라벨/버튼 ARIA 를 수동 결합할 필요가 없다.
+    id,
+    slotProps,
     // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
     sx,
     className,
     ...innerProps
   } = props;
+  const {
+    formControl: formControlProps,
+    formLabel: formLabelProps,
+    formHelperText: formHelperTextProps,
+    ...joySlotProps
+  } = slotProps ?? {};
   const options = useMemo8(
     () => props.options.map((option) => {
       if (option.hasOwnProperty("value") && option.hasOwnProperty("label")) {
@@ -3221,6 +3232,7 @@ function Select(props) {
       disabled,
       size,
       color: error ? "danger" : color,
+      slotProps: joySlotProps,
       onChange: handleChange,
       renderValue: (selected) => {
         if (!selected) return null;
@@ -3240,12 +3252,14 @@ function Select(props) {
       size,
       color,
       error,
+      id,
       sx,
-      className
+      className,
+      ...formControlProps
     },
-    label && /* @__PURE__ */ React21.createElement(FormLabel_default, null, label),
+    label && /* @__PURE__ */ React21.createElement(FormLabel_default, { ...formLabelProps }, label),
     select,
-    helperText && /* @__PURE__ */ React21.createElement(FormHelperText_default, null, helperText)
+    helperText && /* @__PURE__ */ React21.createElement(FormHelperText_default, { ...formHelperTextProps }, helperText)
   );
 }
 Select.displayName = "Select";