@ehfuse/mui-form-controls 1.0.0 → 1.3.0

package/README.md

@@ -19,6 +19,20 @@ MUI 기반 폼 컨트롤과 텍스트 필드 컴포넌트 모음
 | **DateTextField**             | 달력 팝업, 다양한 날짜 포맷, 공휴일 표시 지원 날짜 필드          | [API](./docs/ko/api.md#datetextfield)             |
 | **TimeTextField**             | 시간 입력 필드 (자동 포맷팅, 시간 범위 제한)                     | [API](./docs/ko/api.md#timetextfield)             |
 
+## 폼 컨트롤 (Form Controls)
+
+| 컴포넌트         | 설명                                                      | 문서                                 |
+| ---------------- | --------------------------------------------------------- | ------------------------------------ |
+| **Select**       | MUI Select 기반 선택 필드 (라벨 미포함)                   | [API](./docs/ko/api.md#select)       |
+| **LabelSelect**  | MUI Select 기반 선택 필드 (InputLabel, 포커스 기반 notch) | [API](./docs/ko/api.md#labelselect)  |
+| **Autocomplete** | 자동완성 기능이 있는 선택 필드                            | [API](./docs/ko/api.md#autocomplete) |
+| **Checkbox**     | MUI Checkbox 래퍼 (폼 통합)                               | [API](./docs/ko/api.md#checkbox)     |
+| **RadioGroup**   | MUI RadioGroup 래퍼 (폼 통합)                             | [API](./docs/ko/api.md#radiogroup)   |
+| **Switch**       | MUI Switch 래퍼 (폼 통합)                                 | [API](./docs/ko/api.md#switch)       |
+| **Slider**       | MUI Slider 래퍼 (폼 통합)                                 | [API](./docs/ko/api.md#slider)       |
+| **DateRange**    | 날짜 범위 선택 필드 (시작일, 종료일)                      | [API](./docs/ko/api.md#daterange)    |
+| **TextArea**     | 여러 줄 텍스트 입력 필드                                  | [API](./docs/ko/api.md#textarea)     |
+
 ## 훅 (Hooks)
 
 | 훅                         | 설명                                                | 문서                                           |
@@ -62,6 +76,15 @@ import {
   VerificationCodeTextField,
   DateTextField,
   TimeTextField,
+  Select,
+  LabelSelect,
+  Autocomplete,
+  Checkbox,
+  RadioGroup,
+  Switch,
+  Slider,
+  DateRange,
+  TextArea,
   useKoreanHolidays,
   useKoreanHolidaysRange,
 } from '@ehfuse/mui-form-controls';
@@ -157,6 +180,56 @@ import {
   minTime="09:00"
   maxTime="18:00"
 />
+
+// 선택 필드 (라벨 없음)
+<Select
+  name="status"
+  form={form}
+  options={[
+    { value: 'active', label: '활성' },
+    { value: 'inactive', label: '비활성' },
+  ]}
+  emptyLabel="상태 선택"
+/>
+
+// 선택 필드 (라벨 포함)
+<LabelSelect
+  name="category"
+  label="카테고리"
+  form={form}
+  options={[
+    { value: 'a', label: 'A' },
+    { value: 'b', label: 'B' },
+  ]}
+/>
+
+// 자동완성 필드
+<Autocomplete
+  name="department"
+  label="부서"
+  form={form}
+  options={[
+    { value: 'dev', label: '개발' },
+    { value: 'design', label: '디자인' },
+  ]}
+/>
+
+// 날짜 범위
+<DateRange
+  form={form}
+  startName="startDate"
+  endName="endDate"
+  startLabel="시작일"
+  endLabel="종료일"
+/>
+
+// 텍스트 에어리어
+<TextArea
+  name="memo"
+  label="메모"
+  form={form}
+  minRows={4}
+/>
 ```
 
 ## 문서 / Documentation

package/dist/ButtonGroup.d.ts

@@ -0,0 +1,9 @@
+/**
+ * ButtonGroup.tsx
+ *
+ * @license MIT
+ * @copyright 2025 a8ud10a8uc601uc9c4 (Kim Young Jin)
+ * @author a8ud10a8uc601uc9c4 (ehfuse@gmail.com)
+ */
+import type { ButtonGroupProps as MuiButtonGroupProps } from "@mui/material/ButtonGroup";
+export declare const ButtonGroup: import("react").ForwardRefExoticComponent<Omit<MuiButtonGroupProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/NumberField.d.ts

@@ -0,0 +1,9 @@
+/**
+ * NumberField.tsx
+ *
+ * @license MIT
+ * @copyright 2025 김영진 (Kim Young Jin)
+ * @author 김영진 (ehfuse@gmail.com)
+ */
+export { default as NumberField } from "./components/NumberField";
+export { default as NumberSpinner } from "./components/NumberSpinner";

package/dist/Rating.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Rating.tsx
+ *
+ * @license MIT
+ * @copyright 2025 a8ud10a8uc601uc9c4 (Kim Young Jin)
+ * @author a8ud10a8uc601uc9c4 (ehfuse@gmail.com)
+ */
+import React from "react";
+import type { RatingProps } from "./types";
+export declare const Rating: React.ForwardRefExoticComponent<Omit<RatingProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/Stepper.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Stepper.tsx
+ *
+ * @license MIT
+ * @copyright 2025 a8ud10a8uc601uc9c4 (Kim Young Jin)
+ * @author a8ud10a8uc601uc9c4 (ehfuse@gmail.com)
+ */
+import type { StepperProps } from "./types";
+export declare const Stepper: import("react").ForwardRefExoticComponent<Omit<StepperProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/TextField.d.ts

@@ -0,0 +1,10 @@
+/**
+ * TextField.tsx
+ *
+ * @license MIT
+ * @copyright 2025 a8ud10a8uc601uc9c4 (Kim Young Jin)
+ * @author a8ud10a8uc601uc9c4 (ehfuse@gmail.com)
+ */
+import React from "react";
+import type { BaseTextFieldProps } from "./types";
+export declare const TextField: React.ForwardRefExoticComponent<(Omit<import("@mui/material").FilledTextFieldProps & BaseTextFieldProps, "ref"> | Omit<import("@mui/material").OutlinedTextFieldProps & BaseTextFieldProps, "ref"> | Omit<import("@mui/material").StandardTextFieldProps & BaseTextFieldProps, "ref">) & React.RefAttributes<HTMLDivElement>>;

package/dist/ToggleButton.d.ts

@@ -0,0 +1,10 @@
+/**
+ * ToggleButton.tsx
+ *
+ * @license MIT
+ * @copyright 2025 a8ud10a8uc601uc9c4 (Kim Young Jin)
+ * @author a8ud10a8uc601uc9c4 (ehfuse@gmail.com)
+ */
+import React from "react";
+import type { ToggleButtonProps } from "./types";
+export declare const ToggleButton: React.ForwardRefExoticComponent<Omit<ToggleButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/NumberField.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+import { NumberField as BaseNumberField } from "@base-ui/react/number-field";
+export default function NumberField({ id: idProp, label, error, size, ...other }: BaseNumberField.Root.Props & {
+    label?: React.ReactNode;
+    size?: "small" | "medium";
+    error?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/NumberSpinner.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+import { NumberField as BaseNumberField } from "@base-ui/react/number-field";
+export default function NumberSpinner({ id: idProp, label, error, size, ...other }: BaseNumberField.Root.Props & {
+    label?: React.ReactNode;
+    size?: "small" | "medium";
+    error?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/index.d.ts

@@ -2,3 +2,5 @@ export { GroupedInputWrapper } from "./GroupedInputWrapper";
 export type { GroupedInputWrapperProps } from "./GroupedInputWrapper";
 export { ColonBox } from "./ColonBox";
 export type { ColonBoxProps } from "./ColonBox";
+export { default as NumberField } from "./NumberField";
+export { default as NumberSpinner } from "./NumberSpinner";

package/dist/index.d.ts

@@ -8,12 +8,18 @@
 export { SearchTextField } from "./SearchTextField";
 export { ClearTextField } from "./ClearTextField";
 export { PasswordTextField } from "./PasswordTextField";
+export { TextField } from "./TextField";
 export { TextArea } from "./TextArea";
 export { Checkbox } from "./Checkbox";
 export { RadioGroup } from "./RadioGroup";
 export { Switch } from "./Switch";
+export { Rating } from "./Rating";
+export { ToggleButton } from "./ToggleButton";
+export { ButtonGroup } from "./ButtonGroup";
 export { DateRange } from "./DateRange";
 export { Slider } from "./Slider";
+export { Stepper } from "./Stepper";
+export { NumberField, NumberSpinner } from "./NumberField";
 export { Autocomplete } from "./Autocomplete";
 export { Select } from "./Select";
 export { LabelSelect } from "./LabelSelect";
@@ -30,4 +36,4 @@ export { BizNumTextField } from "./BizNumTextField";
 export { CardNumTextField } from "./CardNumTextField";
 export { useKoreanHolidays, useKoreanHolidaysRange } from "./hooks";
 export { CardIcon, VisaIcon, MastercardIcon, AmexIcon, JcbIcon, DinersIcon, DiscoverIcon, UnionPayIcon, BcIcon, } from "./icons";
-export type { SearchTextFieldProps, ClearTextFieldProps, PasswordTextFieldProps, TextAreaProps, CheckboxProps, SwitchProps, RadioGroupProps, RadioOption, DateRangeProps, SliderProps, AutocompleteProps, AutocompleteOption, SelectProps, SelectOption, LabelSelectProps, LabelSelectOption, PasswordValidationRules, PasswordValidationResult, PhoneTextFieldProps, PhoneFormat, AddressTextFieldProps, DaumPostcodeData, NumberTextFieldProps, JuminTextFieldProps, JuminInfo, VerificationCodeTextFieldProps, VerificationCodeType, EmailTextFieldProps, CustomDomain, DateTextFieldProps, DateFormat, TimeTextFieldProps, TimeFormat, DateTimeTextFieldProps, DateTimeFormat, BizNumTextFieldProps, CardNumTextFieldProps, SelectChangeEvent, } from "./types";
+export type { SearchTextFieldProps, ClearTextFieldProps, PasswordTextFieldProps, TextFieldProps, TextAreaProps, CheckboxProps, SwitchProps, RadioGroupProps, RadioOption, DateRangeProps, SliderProps, RatingProps, ToggleButtonProps, ButtonGroupProps, StepperProps, AutocompleteProps, AutocompleteOption, SelectProps, SelectOption, LabelSelectProps, LabelSelectOption, PasswordValidationRules, PasswordValidationResult, PhoneTextFieldProps, PhoneFormat, AddressTextFieldProps, DaumPostcodeData, NumberTextFieldProps, JuminTextFieldProps, JuminInfo, VerificationCodeTextFieldProps, VerificationCodeType, EmailTextFieldProps, CustomDomain, DateTextFieldProps, DateFormat, TimeTextFieldProps, TimeFormat, DateTimeTextFieldProps, DateTimeFormat, BizNumTextFieldProps, CardNumTextFieldProps, SelectChangeEvent, } from "./types";