@rchemist/listgrid 0.2.6

package/dist/listgrid/common/type.js

@@ -0,0 +1,46 @@
+export const ColorTypes = [
+    'primary',
+    'info',
+    'success',
+    'warning',
+    'danger',
+    'secondary',
+    'dark',
+];
+export const AdditionalColorTypes = [
+    'dark',
+    'gray',
+    'red',
+    'pink',
+    'grape',
+    'violet',
+    'indigo',
+    'blue',
+    'cyan',
+    'green',
+    'lime',
+    'yellow',
+    'orange',
+    'teal',
+    'black',
+    'white',
+];
+export const AllColorTypes = [
+    ...ColorTypes,
+    ...AdditionalColorTypes,
+];
+export const VariantTypes = ['filled', 'outline', 'solid'];
+export const ShapeTypes = ['pill', 'box', 'rounded'];
+export const SizeTypes = [
+    'xs',
+    'sm',
+    'md',
+    'lg',
+    'xl',
+    '2xl',
+    '3xl',
+    '4xl',
+    '5xl',
+    '6xl',
+    'full',
+];

package/dist/listgrid/components/api/ApiSpecificationButton.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+import { ApiSpecification } from './Type';
+export declare const ApiSpecificationButton: ({ apiSpec }: {
+    apiSpec?: ApiSpecification | ReactNode;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/listgrid/components/api/ApiSpecificationButton.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { isApiSpecification } from './Type';
+import { Modal } from '../../ui';
+import { ViewApiSpecification } from './ViewApiSpecification';
+import { IconApi } from '@tabler/icons-react';
+export const ApiSpecificationButton = ({ apiSpec }) => {
+    const [open, setOpen] = useState(false);
+    if (apiSpec === undefined) {
+        return null;
+    }
+    return (_jsxs("div", { className: 'ml-2', children: [_jsx("button", { className: 'btn-outline-info rounded-full w-[24px] h-[24px]', onClick: () => setOpen(true), children: _jsx(IconApi, { className: 'w-6 h-6' }) }), open && (_jsx(_Fragment, { children: _jsx(Modal, { opened: open, title: 'API 상세 정보', position: 'top-center', closeOnClickOutside: true, closeOnEscape: true, onClose: () => {
+                        setOpen(false);
+                    }, children: isApiSpecification(apiSpec) ? (_jsx(ViewApiSpecification, { ...apiSpec })) : apiSpec }) }))] }));
+};

package/dist/listgrid/components/api/Type.d.ts

@@ -0,0 +1,23 @@
+import { SelectOption } from '../../form/Type';
+export interface ApiSpecification {
+    url: string;
+    authorized?: boolean;
+    method: 'GET' | 'POST' | 'PUT' | 'DELETE';
+    formData?: ApiFormData | string;
+    response: string;
+}
+export interface ApiFormData {
+    type: 'Request Body' | 'Query Parameters' | 'None';
+    body?: string;
+    fields?: ApiDataField[];
+}
+export interface ApiDataField {
+    name: string;
+    label: string;
+    defaultValue?: string;
+    type: string;
+    description?: string;
+    required?: boolean;
+    options?: SelectOption[];
+}
+export declare function isApiSpecification(obj: any): obj is ApiSpecification;

package/dist/listgrid/components/api/Type.js

@@ -0,0 +1,8 @@
+// 타입 가드 함수
+export function isApiSpecification(obj) {
+    return (typeof obj === 'object' &&
+        obj !== null &&
+        typeof obj.url === 'string' &&
+        typeof obj.method === 'string' &&
+        (typeof obj.response === 'string' || obj.response !== undefined));
+}

package/dist/listgrid/components/api/ViewApiSpecification.d.ts

@@ -0,0 +1,2 @@
+import { ApiSpecification } from './Type';
+export declare const ViewApiSpecification: ({ method, response, formData, ...props }: ApiSpecification) => import("react/jsx-runtime").JSX.Element;

package/dist/listgrid/components/api/ViewApiSpecification.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tooltip } from '../../ui';
+import Swal from 'sweetalert2';
+import { IconCopyCheck } from '@tabler/icons-react';
+export const ViewApiSpecification = ({ method, response, formData, ...props }) => {
+    const url = props.url;
+    return (_jsxs("div", { className: "rcm-api-spec", children: [_jsxs("div", { children: [_jsx(ShowTitle, { copyText: `${url}`, label: 'API URL' }), _jsxs("div", { className: "rcm-api-spec-url-row", children: [_jsx("div", { className: "rcm-api-spec-method", children: method }), _jsx("div", { id: "addonsRightoutline", className: "rcm-api-spec-url", children: url })] })] }), formData && (_jsxs("div", { children: [_jsx(ShowTitle, { copyText: `${formData}`, label: 'Form Data' }), _jsx("div", { className: "rcm-api-spec-block", children: _jsx("div", { children: _jsx("pre", { children: String(formData) }) }) })] })), _jsxs("div", { children: [_jsx(ShowTitle, { copyText: `${response}`, label: 'API 응답 결과' }), _jsx("div", { className: "rcm-api-spec-block", children: _jsx("div", { children: _jsx("pre", { children: response }) }) })] })] }));
+};
+const ShowTitle = ({ copyText, label }) => {
+    return (_jsxs("div", { className: 'flex items-center space-x-2', children: [_jsx("label", { children: label }), _jsx(Tooltip, { label: `버튼을 누르면 데이터를 클립보드로 복사합니다.`, zIndex: 10000, className: 'cursor-pointer', color: 'indigo', position: 'right-end', children: _jsx("button", { className: 'w-[24px] h-[24px]', onClick: () => {
+                        try {
+                            navigator.clipboard.writeText(copyText);
+                            showMessage('클립보드에 복사되었습니다.');
+                        }
+                        catch (error) {
+                            showMessage('클립보드에 복사 실패했습니다.');
+                        }
+                    }, children: _jsx(IconCopyCheck, { className: 'w-4 h-4 mb-2' }) }) })] }));
+};
+const showMessage = (message = '') => {
+    const toast = Swal.mixin({
+        toast: true,
+        position: 'top',
+        showConfirmButton: false,
+        timer: 1000,
+    });
+    toast.fire({
+        icon: 'success',
+        title: message || '클립보드에 복사 되었습니다.',
+        padding: '10px 20px',
+    });
+};

package/dist/listgrid/components/fields/ApplyFullAddressFields.d.ts

@@ -0,0 +1,45 @@
+import { EntityForm } from '../../config/EntityForm';
+import { AbstractAddFieldProps } from '../../config/EntityFormTypes';
+type AddressFieldType = 'state' | 'city' | 'address1' | 'address2' | 'postalCode' | 'longitude' | 'latitude';
+interface AddressFieldMessage {
+    address?: string;
+    state?: string;
+    city?: string;
+    address1?: string;
+    address2?: string;
+    postalCode?: string;
+    longitude?: string;
+    latitude?: string;
+}
+interface AddressListFields {
+    state?: boolean;
+    city?: boolean;
+    address1?: boolean;
+    address2?: boolean;
+    postalCode?: boolean;
+    longitude?: boolean;
+    latitude?: boolean;
+}
+interface AddressListOrder {
+    address?: number;
+    state?: number;
+    city?: number;
+    address1?: number;
+    address2?: number;
+    postalCode?: number;
+    longitude?: number;
+    latitude?: number;
+}
+interface FullAddressFieldsProps extends AbstractAddFieldProps {
+    showMap?: boolean;
+    fields?: AddressFieldType[];
+    required?: boolean;
+    helpText?: AddressFieldMessage;
+    label?: AddressFieldMessage;
+    list?: AddressListFields;
+    order?: AddressListOrder;
+    showLongitudeLatitude?: boolean;
+    prefix?: string;
+}
+export declare const applyFullAddressFields: (entityForm: EntityForm, props?: FullAddressFieldsProps) => void;
+export {};

package/dist/listgrid/components/fields/ApplyFullAddressFields.js

@@ -0,0 +1,177 @@
+import { AddressMapField, appendLastDot } from './address/AddressMapField';
+import { NumberField } from './NumberField';
+import { isTrue } from '../../utils/BooleanUtil';
+import { StringField } from './StringField';
+import { RequiredValidation } from '../../validations/RequiredValidation';
+import { isBlank } from '../../utils/StringUtil';
+const AddressFieldTypes = [
+    'state',
+    'city',
+    'address1',
+    'address2',
+    'postalCode',
+    'longitude',
+    'latitude',
+];
+function getListConfig() {
+    return {
+        support: true,
+        filterable: true,
+        sortable: true,
+    };
+}
+export const applyFullAddressFields = (entityForm, props) => {
+    const addressMapFieldName = `${appendLastDot(props?.prefix)}address`;
+    const fields = props?.fields ?? [...AddressFieldTypes];
+    const required = isTrue(props?.required);
+    const showLongitudeLatitude = isTrue(props?.showLongitudeLatitude);
+    function getRequiredValidation(field) {
+        if (required && fields.includes(field)) {
+            // required 로 체크하려면 필드가 포함되어 있어야 한다.
+            return new RequiredValidation(`${field}-required-validation`, `주소 찾기 버튼을 눌러 주소를 입력하세요`);
+        }
+        return undefined;
+    }
+    const AddressField = (fieldProps) => {
+        const type = fieldProps.type ?? 'string';
+        const order = props?.order?.[fieldProps.name] ?? fieldProps.order;
+        const name = fieldProps.prefix
+            ? `${appendLastDot(fieldProps.prefix)}${fieldProps.name}`
+            : fieldProps.name;
+        const label = props?.label?.[fieldProps.name] ?? fieldProps.label;
+        const helpText = props?.helpText?.[fieldProps.name];
+        const supportList = isTrue(props?.list?.[fieldProps.name]);
+        const validation = getRequiredValidation(fieldProps.name);
+        const hidden = !fields.includes(fieldProps.name);
+        const listConfig = supportList ? getListConfig() : undefined;
+        const isFieldRequired = required && fields.includes(fieldProps.name);
+        if (type === 'number') {
+            return new NumberField(name, order)
+                .withLabel(label)
+                .withHelpText(helpText)
+                .withReadOnly(true)
+                .withHidden(hidden)
+                .withRequired(isFieldRequired)
+                .withValidations(validation)
+                .withListConfig(listConfig);
+        }
+        else {
+            return new StringField(name, order)
+                .withLabel(label)
+                .withHelpText(helpText)
+                .withReadOnly(true)
+                .withHidden(hidden)
+                .withRequired(isFieldRequired)
+                .withValidations(validation)
+                .withListConfig(listConfig);
+        }
+    };
+    entityForm.addFields({
+        ...(props?.tab !== undefined ? { tab: props.tab } : {}),
+        ...(props?.fieldGroup !== undefined ? { fieldGroup: props.fieldGroup } : {}),
+        items: [
+            new AddressMapField(`${addressMapFieldName}`, props?.order?.address ?? 1000, props?.showMap, props?.prefix)
+                .withLabel(props?.label?.address ?? '주소')
+                .withHelpText(props?.helpText?.address)
+                .withRequired(required),
+            ...(showLongitudeLatitude
+                ? [
+                    AddressField({
+                        name: 'longitude',
+                        order: 1010,
+                        type: 'number',
+                        label: '경도',
+                        prefix: props?.prefix,
+                    }),
+                    AddressField({
+                        name: 'latitude',
+                        order: 1010,
+                        type: 'number',
+                        label: '위도',
+                        prefix: props?.prefix,
+                    }),
+                ]
+                : []),
+            AddressField({
+                name: 'state',
+                order: 1010,
+                type: 'string',
+                label: '시/도',
+                prefix: props?.prefix,
+            }),
+            AddressField({
+                name: 'city',
+                order: 1010,
+                type: 'string',
+                label: '시/군/구',
+                prefix: props?.prefix,
+            }),
+            AddressField({
+                name: 'address1',
+                order: 1010,
+                type: 'string',
+                label: '주소1',
+                prefix: props?.prefix,
+            }),
+            AddressField({
+                name: 'address2',
+                order: 1010,
+                type: 'string',
+                label: '상세 주소',
+                prefix: props?.prefix,
+            }),
+            AddressField({
+                name: 'postalCode',
+                order: 1010,
+                type: 'string',
+                label: '우편번호',
+                prefix: props?.prefix,
+            }),
+        ],
+    });
+    entityForm.withOnChanges(async (entityForm, name) => {
+        const prefix = appendLastDot(props?.prefix);
+        if (name === `${prefix}address`) {
+            const address = await entityForm.getValue(`${prefix}address`);
+            if (address) {
+                entityForm.setValue(`${prefix}state`, address.state);
+                entityForm.setValue(`${prefix}city`, address.city);
+                entityForm.setValue(`${prefix}address1`, address.address1);
+                entityForm.setValue(`${prefix}address2`, address.address2);
+                entityForm.setValue(`${prefix}postalCode`, address.postalCode);
+                if (showLongitudeLatitude) {
+                    entityForm.setValue(`${prefix}longitude`, address.longitude);
+                    entityForm.setValue(`${prefix}latitude`, address.latitude);
+                }
+                entityForm.withShouldReload(true);
+            }
+        }
+        return entityForm;
+    });
+    entityForm.withOnFetchData(async (entityForm, response) => {
+        const prefix = appendLastDot(props?.prefix);
+        // 주소 정보를 address 밑에 저장한다.
+        const addressValue = {
+            state: response[`${prefix}state`],
+            city: response[`${prefix}city`],
+            address1: response[`${prefix}address1`],
+            address2: response[`${prefix}address2`],
+            postalCode: response[`${prefix}postalCode`],
+        };
+        entityForm.setFetchedValue(addressMapFieldName, addressValue);
+        // IMPORTANT:
+        // - setFetchedValue only sets current when current is undefined.
+        // - Some forms/pages can initialize current as empty, which makes required validation fail
+        //   even though fetched data exists.
+        // Here we force current address map value when fetched address fields exist.
+        const currentAddress = (await entityForm.getValue(addressMapFieldName));
+        const shouldForceCurrent = !currentAddress ||
+            typeof currentAddress !== 'object' ||
+            (!isBlank(String(addressValue.address1 ?? '')) &&
+                isBlank(String(currentAddress.address1 ?? '')));
+        if (shouldForceCurrent) {
+            entityForm.setValue(addressMapFieldName, addressValue);
+        }
+        return entityForm;
+    });
+};

package/dist/listgrid/components/fields/BirthdayField.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import { ListableFormField, ListableFormFieldProps, ViewListProps, ViewListResult } from './abstract';
+import { FieldRenderParameters } from '../../config/EntityField';
+interface BirthdayFieldProps extends ListableFormFieldProps {
+    /** 반환값에 하이픈(-) 포함 여부 (기본값: false) */
+    includeHyphen?: boolean;
+}
+/**
+ * 생년월일 입력 필드
+ *
+ * - 숫자만 입력 가능
+ * - YYYY-MM-DD 형식으로 자동 포맷팅
+ * - 실시간 유효성 검증
+ * - includeHyphen 옵션으로 반환값 형식 설정 (기본값: false → YYYYMMDD)
+ */
+export declare class BirthdayField extends ListableFormField<BirthdayField> {
+    /** 반환값에 하이픈(-) 포함 여부 */
+    includeHyphen: boolean;
+    constructor(name: string, order: number, includeHyphen?: boolean);
+    /**
+     * BirthdayField 핵심 렌더링 로직
+     */
+    protected renderInstance(params: FieldRenderParameters): Promise<React.ReactNode | null>;
+    /**
+     * 목록에 표시될 때의 렌더링 로직
+     */
+    protected renderListItemInstance(props: ViewListProps): Promise<ViewListResult>;
+    /**
+     * BirthdayField 인스턴스 생성
+     */
+    protected createInstance(name: string, order: number): BirthdayField;
+    /**
+     * includeHyphen 설정
+     * @param includeHyphen 하이픈 포함 여부
+     */
+    withIncludeHyphen(includeHyphen: boolean): this;
+    static create(props: BirthdayFieldProps): BirthdayField;
+}
+export {};

package/dist/listgrid/components/fields/BirthdayField.js

@@ -0,0 +1,205 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useCallback } from 'react';
+import { ListableFormField, } from './abstract';
+import { getInputRendererParameters } from '../helper/FieldRendererHelper';
+import { readonlyClass } from '../../ui';
+/**
+ * 생년월일 입력 내부 컴포넌트
+ * 숫자만 입력 가능하며, YYYY-MM-DD 형식으로 자동 포맷팅
+ */
+const BirthdayInput = ({ name, value, onChange, readonly = false, hasError = false, placeholder = 'YYYY-MM-DD', includeHyphen = false, }) => {
+    const [displayValue, setDisplayValue] = useState('');
+    const [validationError, setValidationError] = useState(null);
+    // 외부 value가 변경되면 displayValue 동기화
+    useEffect(() => {
+        if (value) {
+            // 외부 값이 YYYYMMDD 형식인 경우 YYYY-MM-DD로 변환
+            if (/^\d{8}$/.test(value)) {
+                const formatted = `${value.substring(0, 4)}-${value.substring(4, 6)}-${value.substring(6, 8)}`;
+                setDisplayValue(formatted);
+                validateDate(formatted);
+            }
+            else {
+                setDisplayValue(value);
+                validateDate(value);
+            }
+        }
+        else {
+            setDisplayValue('');
+            setValidationError(null);
+        }
+    }, [value]);
+    // 날짜 유효성 검증
+    const validateDate = useCallback((dateStr) => {
+        // 빈 값은 검증하지 않음
+        if (!dateStr || dateStr.replace(/-/g, '').length === 0) {
+            setValidationError(null);
+            return true;
+        }
+        const digitsOnly = dateStr.replace(/-/g, '');
+        // 입력 중인 경우 (8자리 미만) - 부분 검증
+        if (digitsOnly.length < 8) {
+            // 년도 검증 (4자리 이상일 때)
+            if (digitsOnly.length >= 4) {
+                const year = parseInt(digitsOnly.substring(0, 4));
+                if (year < 1900 || year > new Date().getFullYear()) {
+                    setValidationError('올바른 연도를 입력해 주세요 (1900~현재)');
+                    return false;
+                }
+            }
+            // 월 검증 (6자리 이상일 때)
+            if (digitsOnly.length >= 6) {
+                const month = parseInt(digitsOnly.substring(4, 6));
+                if (month < 1 || month > 12) {
+                    setValidationError('올바른 월을 입력해 주세요 (01~12)');
+                    return false;
+                }
+            }
+            setValidationError(null);
+            return true;
+        }
+        // 완전한 날짜 검증 (8자리)
+        const year = parseInt(digitsOnly.substring(0, 4));
+        const month = parseInt(digitsOnly.substring(4, 6));
+        const day = parseInt(digitsOnly.substring(6, 8));
+        // 연도 범위 검증
+        const currentYear = new Date().getFullYear();
+        if (year < 1900 || year > currentYear) {
+            setValidationError('올바른 연도를 입력해 주세요 (1900~현재)');
+            return false;
+        }
+        // 월 범위 검증
+        if (month < 1 || month > 12) {
+            setValidationError('올바른 월을 입력해 주세요 (01~12)');
+            return false;
+        }
+        // 일 범위 검증
+        const daysInMonth = new Date(year, month, 0).getDate();
+        if (day < 1 || day > daysInMonth) {
+            setValidationError(`올바른 일을 입력해 주세요 (01~${daysInMonth})`);
+            return false;
+        }
+        // 미래 날짜 검증
+        const inputDate = new Date(year, month - 1, day);
+        if (inputDate > new Date()) {
+            setValidationError('미래 날짜는 입력할 수 없습니다');
+            return false;
+        }
+        setValidationError(null);
+        return true;
+    }, []);
+    // 숫자를 YYYY-MM-DD 형식으로 포맷팅
+    const formatToDate = (digits) => {
+        let formatted = '';
+        if (digits.length > 0) {
+            formatted = digits.substring(0, Math.min(4, digits.length));
+        }
+        if (digits.length > 4) {
+            formatted += '-' + digits.substring(4, Math.min(6, digits.length));
+        }
+        if (digits.length > 6) {
+            formatted += '-' + digits.substring(6, Math.min(8, digits.length));
+        }
+        return formatted;
+    };
+    // 반환값 형식 변환 (includeHyphen 옵션에 따라)
+    const getReturnValue = (formatted) => {
+        if (includeHyphen) {
+            return formatted;
+        }
+        return formatted.replace(/-/g, '');
+    };
+    const handleChange = (e) => {
+        const inputValue = e.target.value;
+        // 숫자와 하이픈만 허용하되, 하이픈은 자동으로 추가되므로 숫자만 추출
+        const digitsOnly = inputValue.replace(/\D/g, '');
+        // 최대 8자리 (YYYYMMDD)
+        const truncated = digitsOnly.substring(0, 8);
+        // 포맷팅된 값
+        const formatted = formatToDate(truncated);
+        setDisplayValue(formatted);
+        onChange(getReturnValue(formatted), false);
+        validateDate(formatted);
+    };
+    const handleKeyDown = (e) => {
+        // 백스페이스 처리 - 하이픈 앞에서 백스페이스 누르면 하이픈도 함께 삭제
+        if (e.key === 'Backspace') {
+            const input = e.currentTarget;
+            const cursorPos = input.selectionStart || 0;
+            // 커서가 하이픈 바로 뒤에 있으면 하이픈과 앞 숫자 함께 삭제
+            if (cursorPos > 0 && displayValue[cursorPos - 1] === '-') {
+                e.preventDefault();
+                const digitsOnly = displayValue.replace(/\D/g, '');
+                const newDigits = digitsOnly.substring(0, digitsOnly.length - 1);
+                const formatted = formatToDate(newDigits);
+                setDisplayValue(formatted);
+                onChange(getReturnValue(formatted), false);
+                validateDate(formatted);
+            }
+        }
+    };
+    const handleBlur = () => {
+        // blur 시 commit 처리
+        onChange(getReturnValue(displayValue), true);
+    };
+    return (_jsxs("div", { className: "rcm-stack", "data-gap": "xs", children: [_jsx("input", { id: name, name: name, type: "text", inputMode: "numeric", placeholder: placeholder, value: displayValue, onChange: handleChange, onKeyDown: handleKeyDown, onBlur: handleBlur, disabled: readonly, className: readonlyClass(readonly, 'rcm-input'), "data-state": hasError || validationError ? 'error' : undefined, maxLength: 10 }), validationError && _jsx("p", { className: "rcm-field-error", children: validationError })] }));
+};
+/**
+ * 생년월일 입력 필드
+ *
+ * - 숫자만 입력 가능
+ * - YYYY-MM-DD 형식으로 자동 포맷팅
+ * - 실시간 유효성 검증
+ * - includeHyphen 옵션으로 반환값 형식 설정 (기본값: false → YYYYMMDD)
+ */
+export class BirthdayField extends ListableFormField {
+    constructor(name, order, includeHyphen = false) {
+        super(name, order, 'custom');
+        this.includeHyphen = includeHyphen;
+        this.helpText = '생년월일 8자리를 입력해 주세요 (예: 19900101)';
+    }
+    /**
+     * BirthdayField 핵심 렌더링 로직
+     */
+    renderInstance(params) {
+        return (async () => {
+            const inputParams = await getInputRendererParameters(this, params);
+            return (_jsx(BirthdayInput, { name: inputParams.name, value: inputParams.value ?? '', onChange: (value, commit) => {
+                    inputParams.onChange?.(value, commit);
+                }, readonly: inputParams.readonly, placeholder: inputParams.placeHolder, includeHyphen: this.includeHyphen }));
+        })();
+    }
+    /**
+     * 목록에 표시될 때의 렌더링 로직
+     */
+    renderListItemInstance(props) {
+        const value = props.item[this.name];
+        if (!value) {
+            return Promise.resolve({ result: '' });
+        }
+        // YYYYMMDD 형식을 YYYY-MM-DD로 표시
+        if (/^\d{8}$/.test(value)) {
+            const formatted = `${value.substring(0, 4)}-${value.substring(4, 6)}-${value.substring(6, 8)}`;
+            return Promise.resolve({ result: formatted });
+        }
+        return Promise.resolve({ result: value });
+    }
+    /**
+     * BirthdayField 인스턴스 생성
+     */
+    createInstance(name, order) {
+        return new BirthdayField(name, order, this.includeHyphen);
+    }
+    /**
+     * includeHyphen 설정
+     * @param includeHyphen 하이픈 포함 여부
+     */
+    withIncludeHyphen(includeHyphen) {
+        this.includeHyphen = includeHyphen;
+        return this;
+    }
+    static create(props) {
+        return new BirthdayField(props.name, props.order, props.includeHyphen).copyFields(props, true);
+    }
+}

package/dist/listgrid/components/fields/BooleanField.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { OptionalField, OptionalFieldProps, ViewListProps, ViewListResult, ViewRenderProps, ViewRenderResult } from './abstract';
+import { FieldInfoParameters, FieldRenderParameters, FilterRenderParameters } from '../../config/EntityField';
+import { RenderType } from '../../config/Config';
+interface BooleanFieldProps extends OptionalFieldProps {
+    emptyLabel?: string | undefined;
+}
+export declare class BooleanField extends OptionalField<BooleanField> {
+    emptyLabel?: string | undefined;
+    constructor(name: string, order: number, emptyLabel?: string);
+    /**
+     * BooleanField 핵심 렌더링 로직
+     */
+    protected renderInstance(params: FieldRenderParameters): Promise<React.ReactNode | null>;
+    /**
+     * BooleanField 리스트 필터 렌더링 로직
+     * Chip 스타일의 Radio 버튼으로 "예/아니오/전체" 세 가지 옵션 제공
+     */
+    protected renderListFilterInstance(params: FilterRenderParameters): Promise<React.ReactNode | null>;
+    /**
+     * BooleanField 핵심 리스트 아이템 렌더링 로직
+     */
+    protected renderListItemInstance(props: ViewListProps): Promise<ViewListResult>;
+    /**
+     * BooleanField View 모드 렌더링 - 아이콘으로 true/false 표시
+     * cardIcon이 설정된 경우 해당 아이콘을 우선 사용
+     */
+    protected renderViewInstance(props: ViewRenderProps): Promise<ViewRenderResult>;
+    /**
+     * BooleanField 인스턴스 생성
+     */
+    protected createInstance(name: string, order: number): BooleanField;
+    static create(props: BooleanFieldProps): BooleanField;
+    getCurrentValue(renderType?: RenderType): Promise<boolean | undefined>;
+    isRequired(props: FieldInfoParameters): Promise<boolean>;
+    withEmptyLabel(emptyLabel?: string): this;
+}
+export {};