@loword/loword-design-system 0.0.3 → 0.0.5

package/dist/components/Radio/RadioBase.js

@@ -1,46 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState, } from 'react';
-import LucideIcon from '../Icon/LucideIcon.js';
-import cn from '../../utils/cn.js';
-const RadioContext = createContext(null);
-export const useRadioContext = () => {
-    const ctx = useContext(RadioContext);
-    if (!ctx)
-        throw new Error('RadioBase 하위 컴포넌트는 Root 내부에서 사용해야 합니다.');
-    return ctx;
-};
-const Root = ({ checked, defaultChecked = false, onCheckedChange, disabled = false, className, style, children, }) => {
-    const [internal, setInternal] = useState(defaultChecked);
-    const isControlled = checked !== undefined;
-    const resolved = isControlled ? checked : internal;
-    const handleChange = (val) => {
-        if (!isControlled)
-            setInternal(val);
-        onCheckedChange?.(val);
-    };
-    const resolvedClassName = typeof className === 'function' ? className(resolved) : className;
-    return (_jsx(RadioContext, { value: { checked: resolved, onCheckedChange: handleChange, disabled }, children: _jsx("label", { style: style, className: cn('flex flex-row w-fit gap-2.5 shrink-0', disabled
-                ? 'cursor-not-allowed pointer-events-none'
-                : 'cursor-pointer', resolvedClassName), children: children }) }));
-};
-const HiddenInput = ({ ref, onChange, ...props }) => {
-    const { checked, onCheckedChange, disabled } = useRadioContext();
-    return (_jsx("input", { type: "radio", ref: ref, className: "sr-only", checked: checked, disabled: disabled, onChange: (e) => {
-            e.stopPropagation();
-            onCheckedChange(e.target.checked);
-            onChange?.(e);
-        }, ...props }));
-};
-const Indicator = ({ icon = 'check', iconSize = 24, className, iconClassName, }) => {
-    return (_jsx("div", { className: className, children: _jsx(LucideIcon, { name: icon, size: iconSize, className: iconClassName }) }));
-};
-const Label = ({ className, children }) => {
-    return _jsx("span", { className: className, children: children });
-};
-export const RadioBase = {
-    Root,
-    HiddenInput,
-    Indicator,
-    Label,
-};
-export default RadioBase;

package/dist/components/Radio/RadioGroup.d.ts

@@ -1,22 +0,0 @@
-import type React from 'react';
-export interface RadioGroupOption {
-    label: string;
-    value: string;
-    disabled?: boolean;
-}
-export interface RadioGroupProps {
-    items: RadioGroupOption[];
-    value?: string;
-    onChange?: (value: string) => void;
-    disabled?: boolean;
-    type?: 'default' | 'pill';
-    size?: 'sm' | 'md';
-    name?: string;
-    'aria-invalid'?: boolean | 'true' | 'false';
-    'aria-describedby'?: string;
-    className?: string;
-    style?: React.CSSProperties;
-}
-declare const RadioGroup: ({ items, value, onChange, disabled, type, size, name, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, className, style, }: RadioGroupProps) => import("react/jsx-runtime").JSX.Element;
-export default RadioGroup;
-//# sourceMappingURL=RadioGroup.d.ts.map

package/dist/components/Radio/RadioGroup.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAGD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,QAAA,MAAM,UAAU,GAAI,6IAYjB,eAAe,4CAuBjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/Radio/RadioGroup.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import Radio from './Radio.js';
-import cn from '../../utils/cn.js';
-const RadioGroup = ({ items, value, onChange, disabled = false, type = 'pill', size = 'sm', name, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedby, className, style, }) => {
-    return (_jsx("div", { role: "radiogroup", "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, className: cn('flex flex-row gap-2.5', className), style: style, children: items.map((option) => (_jsx(Radio, { name: name, type: type, size: size, checked: value === option.value, onCheckedChange: () => onChange?.(option.value), label: option.label, disabled: disabled || option.disabled }, option.value))) }));
-};
-export default RadioGroup;

package/dist/components/ScrollArea/ScrollArea.d.ts

@@ -1,15 +0,0 @@
-import type { ReactNode } from 'react';
-type ScrollDirection = 'x' | 'y' | 'both';
-export interface ScrollAreaProps {
-    direction?: ScrollDirection;
-    /** true이면 스크롤바를 숨깁니다 */
-    hideScrollbar?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-    children?: ReactNode;
-    /** 스크린리더에 전달할 영역 설명 */
-    ariaLabel?: string;
-}
-declare const ScrollArea: ({ direction, hideScrollbar, className, style, children, ariaLabel, }: ScrollAreaProps) => import("react/jsx-runtime").JSX.Element;
-export default ScrollArea;
-//# sourceMappingURL=ScrollArea.d.ts.map

package/dist/components/ScrollArea/ScrollArea.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ScrollArea.d.ts","sourceRoot":"","sources":["../../../src/components/ScrollArea/ScrollArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,eAAe,GAAG,GAAG,GAAG,GAAG,GAAG,MAAM,CAAC;AAE1C,MAAM,WAAW,eAAe;IAC9B,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,wBAAwB;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAQD,QAAA,MAAM,UAAU,GAAI,sEAOjB,eAAe,4CAmBjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/ScrollArea/ScrollArea.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import cn from '../../utils/cn.js';
-const DIRECTION_MAP = {
-    x: 'overflow-x-auto overflow-y-hidden',
-    y: 'overflow-y-auto overflow-x-hidden',
-    both: 'overflow-auto',
-};
-const ScrollArea = ({ direction = 'y', hideScrollbar = false, className, style, children, ariaLabel = '스크롤 가능한 영역', }) => (_jsx("div", { role: "region", "aria-label": ariaLabel, tabIndex: 0, className: cn('overflow-hidden outline-none', className), style: style, children: _jsx("div", { className: cn('h-full w-full', DIRECTION_MAP[direction], hideScrollbar &&
-            '[&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]'), children: children }) }));
-export default ScrollArea;

package/dist/components/Select/FormMultiSelect.d.ts

@@ -1,13 +0,0 @@
-import { type RegisterOptions } from 'react-hook-form';
-import { type MultiSelectProps } from './MultiSelect.js';
-interface FormMultiSelectProps extends Omit<MultiSelectProps, 'value' | 'onChange' | 'color' | 'name'> {
-    block?: boolean;
-    name: string;
-    options?: RegisterOptions;
-    customErrorMessage?: string;
-    isHiddenErrorMessage?: boolean;
-    errorClassName?: string;
-}
-declare const FormMultiSelect: ({ name, options, variant, size, block, disabled, customErrorMessage, isHiddenErrorMessage, errorClassName, ...props }: FormMultiSelectProps) => import("react/jsx-runtime").JSX.Element;
-export default FormMultiSelect;
-//# sourceMappingURL=FormMultiSelect.d.ts.map

package/dist/components/Select/FormMultiSelect.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormMultiSelect.d.ts","sourceRoot":"","sources":["../../../src/components/Select/FormMultiSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAoB,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAKnE,UAAU,oBAAqB,SAAQ,IAAI,CACzC,gBAAgB,EAChB,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CACxC;IACC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,eAAe,GAAI,uHAWtB,oBAAoB,4CAuCtB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/Select/FormMultiSelect.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import MultiSelect from './MultiSelect.js';
-import FormField from '../Form/FormField.js';
-import FormErrorMessage from '../Form/FormErrorMessage.js';
-import cn from '../../utils/cn.js';
-const FormMultiSelect = ({ name, options, variant = 'filled', size = 'sm', block = false, disabled = false, customErrorMessage = '', isHiddenErrorMessage = false, errorClassName, ...props }) => {
-    return (_jsx(FormField, { name: name, options: options, customErrorMessage: customErrorMessage, disabled: disabled, children: ({ field, fieldState }) => (_jsxs("div", { className: cn('relative', block && 'flex flex-1'), children: [_jsx(MultiSelect, { ...props, name: name, value: Array.isArray(field.value)
-                        ? field.value
-                        : field.value
-                            ? [field.value]
-                            : [], onChange: field.onChange, "aria-invalid": field['aria-invalid'], "aria-describedby": field['aria-describedby'], variant: variant, color: fieldState.hasError ? 'danger' : 'neutral', size: size, disabled: disabled }), !isHiddenErrorMessage && (_jsx(FormErrorMessage, { error: fieldState.error, disabled: disabled, className: errorClassName }))] })) }));
-};
-export default FormMultiSelect;

package/dist/components/Select/FormSelect.d.ts

@@ -1,13 +0,0 @@
-import { type RegisterOptions } from 'react-hook-form';
-import { type SelectProps } from './Select.js';
-interface FormSelectProps extends Omit<SelectProps, 'value' | 'onChange' | 'color' | 'name'> {
-    block?: boolean;
-    name: string;
-    options?: RegisterOptions;
-    customErrorMessage?: string;
-    isHiddenErrorMessage?: boolean;
-    errorClassName?: string;
-}
-declare const FormSelect: ({ name, options, variant, size, block, disabled, customErrorMessage, isHiddenErrorMessage, errorClassName, ...props }: FormSelectProps) => import("react/jsx-runtime").JSX.Element;
-export default FormSelect;
-//# sourceMappingURL=FormSelect.d.ts.map

package/dist/components/Select/FormSelect.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormSelect.d.ts","sourceRoot":"","sources":["../../../src/components/Select/FormSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAe,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAKpD,UAAU,eAAgB,SAAQ,IAAI,CACpC,WAAW,EACX,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CACxC;IACC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,QAAA,MAAM,UAAU,GAAI,uHAWjB,eAAe,4CAiCjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/Select/FormSelect.js

@@ -1,10 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Select from './Select.js';
-import FormField from '../Form/FormField.js';
-import FormErrorMessage from '../Form/FormErrorMessage.js';
-import cn from '../../utils/cn.js';
-const FormSelect = ({ name, options, variant = 'filled', size = 'sm', block = false, disabled = false, customErrorMessage = '', isHiddenErrorMessage = false, errorClassName, ...props }) => {
-    return (_jsx(FormField, { name: name, options: options, customErrorMessage: customErrorMessage, disabled: disabled, children: ({ field, fieldState }) => (_jsxs("div", { className: cn('relative', block && 'flex flex-1'), children: [_jsx(Select, { ...props, name: name, value: field.value ?? '', onChange: field.onChange, "aria-invalid": field['aria-invalid'], "aria-describedby": field['aria-describedby'], variant: variant, color: fieldState.hasError ? 'danger' : 'neutral', size: size, disabled: disabled }), !isHiddenErrorMessage && (_jsx(FormErrorMessage, { error: fieldState.error, disabled: disabled, className: errorClassName }))] })) }));
-};
-export default FormSelect;

package/dist/components/Select/MultiSelect.d.ts

@@ -1,31 +0,0 @@
-import type React from 'react';
-import { type SelectOption } from './SelectBase.js';
-type MultiSelectVariant = 'filled' | 'outline' | 'ghost';
-type MultiSelectColor = 'neutral' | 'point' | 'danger';
-type MultiSelectSize = 'xs' | 'sm' | 'md' | 'lg';
-export interface MultiSelectProps {
-    items: SelectOption[];
-    placeholder?: string;
-    value?: string[];
-    onChange?: (value: string[]) => void;
-    disabled?: boolean;
-    name?: string;
-    variant?: MultiSelectVariant;
-    color?: MultiSelectColor;
-    size?: MultiSelectSize;
-    maxDisplay?: number;
-    /**
-     * true(기본): "A, B 외 N개" 요약 텍스트로 표시 (X 삭제 없음).
-     * false: X 삭제 버튼이 달린 칩을 전체 나열.
-     */
-    truncate?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-    contentClassName?: string;
-    'aria-invalid'?: boolean | 'true' | 'false';
-    'aria-describedby'?: string;
-}
-export type { SelectOption as MultiSelectOption };
-declare const MultiSelect: ({ items, placeholder, value, onChange, disabled, name, variant, color, size, maxDisplay, truncate, className, style, contentClassName, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: MultiSelectProps) => import("react/jsx-runtime").JSX.Element;
-export default MultiSelect;
-//# sourceMappingURL=MultiSelect.d.ts.map

package/dist/components/Select/MultiSelect.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MultiSelect.d.ts","sourceRoot":"","sources":["../../../src/components/Select/MultiSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAmB,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAK7D,KAAK,kBAAkB,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AACzD,KAAK,gBAAgB,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AACvD,KAAK,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAsDjD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,YAAY,EAAE,YAAY,IAAI,iBAAiB,EAAE,CAAC;AAElD,QAAA,MAAM,WAAW,GAAI,4MAiBlB,gBAAgB,4CA0HlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/Select/MultiSelect.js

@@ -1,59 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import SelectBase from './SelectBase.js';
-import LucideIcon from '../Icon/LucideIcon.js';
-import cn from '../../utils/cn.js';
-// ── variant × color 조합 ──
-const variantColorClasses = {
-    filled: {
-        neutral: 'bg-neutral5 text-neutral100 border-[0.5px] border-mono200 data-[state=open]:border-lb500',
-        point: 'bg-neutral5 text-neutral100 border-[0.5px] border-mono200 data-[state=open]:border-lb500',
-        danger: 'bg-tintRed text-neutral100 border-[0.5px] border-transparent data-[state=open]:border-red500',
-    },
-    outline: {
-        neutral: 'bg-transparent text-neutral100 border border-neutral10 data-[state=open]:border-lb500',
-        point: 'bg-transparent text-neutral100 border border-neutral10 data-[state=open]:border-lb500',
-        danger: 'bg-transparent text-neutral100 border border-danger100 data-[state=open]:border-red500',
-    },
-    ghost: {
-        neutral: 'bg-transparent text-neutral100 border-[0.5px] border-transparent data-[state=open]:border-lb500 hover:bg-neutral5',
-        point: 'bg-transparent text-neutral100 border-[0.5px] border-transparent data-[state=open]:border-lb500 hover:bg-neutral5',
-        danger: 'bg-transparent text-danger500 border-[0.5px] border-transparent data-[state=open]:border-red500 hover:bg-tintRed',
-    },
-};
-const disabledVariantClasses = {
-    filled: 'bg-mono20 text-neutral20',
-    outline: 'bg-transparent text-neutral20 border border-mono20',
-    ghost: 'bg-transparent text-neutral20',
-};
-const sizeClasses = {
-    xs: 'min-h-[38px] display14',
-    sm: 'min-h-10 display14',
-    md: 'min-h-[56px] display16',
-    lg: 'min-h-[62px] display18',
-};
-const iconSizes = {
-    xs: 15,
-    sm: 15,
-    md: 16,
-    lg: 16,
-};
-const MultiSelect = ({ items, placeholder = '선택하세요', value = [], onChange, disabled = false, name, variant, color = 'neutral', size, maxDisplay = 2, truncate = true, className, style, contentClassName, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedby, }) => {
-    const iconSize = iconSizes[size ?? 'sm'];
-    return (_jsxs(SelectBase.Root, { multiple: true, values: value, onMultiChange: onChange, disabled: disabled, name: name, items: items, maxDisplay: maxDisplay, children: [_jsx(SelectBase.Trigger, { style: style, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, className: cn('group rounded-[5px] ld-transition outline-none cursor-pointer', variant &&
-                    (disabled
-                        ? disabledVariantClasses[variant]
-                        : variantColorClasses[variant][color]), size && sizeClasses[size], disabled && 'cursor-not-allowed disabled:cursor-not-allowed', className), children: truncate ? (_jsxs("div", { className: "flex gap-sm items-center w-full justify-center px-3 py-1.5", children: [_jsx(SelectBase.Value, { placeholder: placeholder, className: "flex flex-1 bold display14 justify-center text-neutral900", placeholderClassName: "text-neutral200" }), _jsx(LucideIcon, { name: "chevronDown", size: iconSize, className: "text-neutral500 shrink-0" })] })) : (_jsxs("div", { className: "flex gap-sm items-center w-full justify-between px-3 py-1.5", children: [_jsx("div", { className: "flex flex-1 flex-wrap gap-1.5 items-center justify-start text-left", children: value.length === 0 ? (_jsx("span", { className: "text-neutral900", children: placeholder })) : (value.map((v) => {
-                                const label = items.find((i) => i.value === v)?.label || v;
-                                return (_jsxs("span", { className: "flex items-center justify-between px-2 py-1 bg-white rounded-[4px] display12 text-neutral900 shadow-sm", children: [label, _jsx("div", { role: "button", "aria-label": `${label} 삭제`, onClick: (e) => {
-                                                e.stopPropagation();
-                                                e.preventDefault();
-                                                if (!disabled) {
-                                                    onChange?.(value.filter((val) => val !== v));
-                                                }
-                                            }, className: "ml-1 text-neutral900 hover:text-neutral800 cursor-pointer flex items-center justify-center", children: _jsx(LucideIcon, { name: "x", size: 14 }) })] }, v));
-                            })) }), _jsx(LucideIcon, { name: "chevronDown", size: iconSize, className: "text-neutral40 shrink-0" })] })) }), _jsx(SelectBase.Content, { className: cn('rounded-[5px] bg-mono5 border border-mono200 p-2 flex flex-col gap-[2px]', 'origin-top overflow-hidden ld-transition', contentClassName), openClassName: "max-h-[230px] opacity-100 translate-y-0 overflow-y-auto scrollbar-none", closedClassName: "max-h-0 opacity-0 -translate-y-1 pointer-events-none", children: items.map((opt) => {
-                    const isSelected = value.includes(opt.value);
-                    return (_jsxs(SelectBase.Item, { value: opt.value, className: cn('cursor-pointer hover:bg-neutral5 py-xs px-sm rounded-[5px] display14 regular transition-all duration-200 outline-none', 'focus:bg-neutral5 focus:ring-1 focus:ring-inset focus:ring-lb500', 'flex items-center gap-2', isSelected && 'bg-neutral5'), children: [_jsx("div", { className: cn('w-4 h-4 rounded border flex items-center justify-center transition-all', isSelected ? 'bg-lb500 border-lb500' : 'border-neutral20'), children: isSelected && (_jsx(LucideIcon, { name: "check", size: 12, className: "text-white" })) }), _jsx(SelectBase.ItemText, { children: opt.label })] }, opt.value));
-                }) })] }));
-};
-export default MultiSelect;

package/dist/components/Select/Select.d.ts

@@ -1,41 +0,0 @@
-import type { CSSProperties } from 'react';
-import { type SelectOption } from './SelectBase.js';
-type SelectVariant = 'filled' | 'outline' | 'ghost';
-type SelectColor = 'neutral' | 'point' | 'danger';
-type SelectSize = 'xs' | 'sm' | 'md' | 'lg';
-export interface SelectProps {
-    /** 선택 옵션 목록 ({ value, label }) */
-    items: SelectOption[];
-    /** 미선택 시 표시할 텍스트 */
-    placeholder?: string;
-    /** 현재 선택된 값 (controlled) */
-    value?: string;
-    /** 초기 선택 값 (uncontrolled) */
-    defaultValue?: string;
-    /** 값 변경 시 호출되는 콜백 */
-    onChange?: (value: string) => void;
-    /** 비활성화 여부 */
-    disabled?: boolean;
-    /** 폼 필드 이름 */
-    name?: string;
-    /** 드롭다운 스타일 유형 */
-    variant?: SelectVariant;
-    /** 색상 테마 */
-    color?: SelectColor;
-    /** 드롭다운 높이 및 폰트 크기 프리셋 */
-    size?: SelectSize;
-    /** 추가 CSS 클래스 */
-    className?: string;
-    /** 인라인 스타일 */
-    style?: CSSProperties;
-    /** 드롭다운 콘텐츠 영역 className */
-    contentClassName?: string;
-    /** 에러 상태 속성 */
-    'aria-invalid'?: boolean | 'true' | 'false';
-    /** 설명 요소 ID 연결 */
-    'aria-describedby'?: string;
-}
-export type { SelectOption };
-declare const Select: ({ items, placeholder, value, defaultValue, onChange, disabled, name, variant, color, size, className, style, contentClassName, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: SelectProps) => import("react/jsx-runtime").JSX.Element;
-export default Select;
-//# sourceMappingURL=Select.d.ts.map

package/dist/components/Select/Select.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAmB,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAK7D,KAAK,aAAa,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AACpD,KAAK,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;AAClD,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAwD5C,MAAM,WAAW,WAAW;IAC1B,kCAAkC;IAClC,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,oBAAoB;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6BAA6B;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,cAAc;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,YAAY;IACZ,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,0BAA0B;IAC1B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,iBAAiB;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc;IACd,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,4BAA4B;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe;IACf,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC5C,kBAAkB;IAClB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,YAAY,EAAE,YAAY,EAAE,CAAC;AAE7B,QAAA,MAAM,MAAM,GAAI,oMAgBb,WAAW,4CAyEb,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/Select/Select.js

@@ -1,55 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import SelectBase from './SelectBase.js';
-import LucideIcon from '../Icon/LucideIcon.js';
-import cn from '../../utils/cn.js';
-// ── variant × color 조합 (LDDropdown 기준) ──
-const variantColorClasses = {
-    filled: {
-        neutral: 'bg-neutral50 text-neutral900 border-[0.5px] border-transparent data-[state=open]:border-lb500',
-        point: 'bg-neutral50 text-neutral900 border-[0.5px] border-transparent data-[state=open]:border-lb500',
-        danger: 'bg-tintRed text-neutral900 border-[0.5px] border-transparent data-[state=open]:border-red500',
-    },
-    outline: {
-        neutral: 'bg-transparent text-neutral900 border border-neutral100 data-[state=open]:border-lb500',
-        point: 'bg-transparent text-neutral900 border border-neutral100 data-[state=open]:border-lb500',
-        danger: 'bg-transparent text-neutral900 border border-danger100 data-[state=open]:border-red500',
-    },
-    ghost: {
-        neutral: 'bg-transparent text-neutral900 border-[0.5px] border-transparent data-[state=open]:border-lb500 hover:bg-neutral50',
-        point: 'bg-transparent text-neutral900 border-[0.5px] border-transparent data-[state=open]:border-lb500 hover:bg-neutral50',
-        danger: 'bg-transparent text-danger500 border-[0.5px] border-transparent data-[state=open]:border-red500 hover:bg-tintRed',
-    },
-};
-// ── disabled 시 variant별 스타일 ──
-const disabledVariantClasses = {
-    filled: 'bg-mono300 text-neutral300',
-    outline: 'bg-transparent text-neutral300 border border-mono300',
-    ghost: 'bg-transparent text-neutral300',
-};
-// ── size (LDDropdown: display14, h-[38px] 기준) ──
-const sizeClasses = {
-    xs: 'h-[38px] display14',
-    sm: 'h-10 display14',
-    md: 'h-[56px] display16',
-    lg: 'h-[62px] display18',
-};
-const iconSizes = {
-    xs: 15,
-    sm: 15,
-    md: 16,
-    lg: 16,
-};
-const Select = ({ items, placeholder = '선택하세요', value, defaultValue, onChange, disabled = false, name, variant, color = 'neutral', size, className, style, contentClassName, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedby, }) => {
-    const iconSize = iconSizes[size ?? 'sm'];
-    // value가 items에 매칭되지 않으면 undefined (Value가 placeholder 표시)
-    const resolvedValue = items.some((item) => item.value === value)
-        ? value
-        : undefined;
-    return (_jsxs(SelectBase.Root, { value: resolvedValue, defaultValue: defaultValue, onChange: onChange, disabled: disabled, name: name, items: items, children: [_jsx(SelectBase.Trigger, { style: style, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, className: cn('group rounded-[5px] ld-transition outline-none cursor-pointer', variant &&
-                    (disabled
-                        ? disabledVariantClasses[variant]
-                        : variantColorClasses[variant][color]), size && sizeClasses[size], disabled && 'cursor-not-allowed disabled:cursor-not-allowed', className), children: _jsxs("div", { className: "flex gap-sm items-center w-full justify-center px-3", children: [_jsx(SelectBase.Value, { placeholder: placeholder, className: "flex flex-1 bold justify-center" }), _jsx(LucideIcon, { name: "chevronDown", size: iconSize, className: "text-neutral500" })] }) }), _jsx(SelectBase.Content, { className: cn('rounded-[5px] bg-white border border-mono100 p-2 flex flex-col gap-3xs', 'origin-top overflow-hidden ld-transition', contentClassName), openClassName: "max-h-[230px] opacity-100 translate-y-0 overflow-y-auto scrollbar-none", closedClassName: "max-h-0 opacity-0 -translate-y-1 pointer-events-none", children: items.map((opt) => (_jsx(SelectBase.Item, { value: opt.value, className: cn('w-full text-left px-3 py-2 rounded-[5px] display14 transition-all cursor-pointer outline-none', 'hover:bg-lb50 hover:text-lb500', 'focus:bg-lb50 focus:text-lb500 focus:ring-1 focus:ring-inset focus:ring-lb500', resolvedValue === opt.value
-                        ? 'bg-neutral10 font-bold text-neutral900'
-                        : 'text-neutral800'), children: _jsx(SelectBase.ItemText, { children: opt.label }) }, opt.value))) })] }));
-};
-export default Select;

package/dist/components/Select/SelectBase.d.ts

@@ -1,59 +0,0 @@
-import { type CSSProperties, type ReactNode } from 'react';
-interface RootProps {
-    multiple?: boolean;
-    value?: string;
-    defaultValue?: string;
-    values?: string[];
-    defaultValues?: string[];
-    onChange?: (value: string) => void;
-    onMultiChange?: (value: string[]) => void;
-    disabled?: boolean;
-    name?: string;
-    items?: SelectOption[];
-    maxDisplay?: number;
-    children?: ReactNode;
-}
-interface TriggerProps {
-    className?: string;
-    style?: CSSProperties;
-    children?: ReactNode;
-    'aria-invalid'?: boolean | 'true' | 'false';
-    'aria-describedby'?: string;
-}
-interface ValueProps {
-    placeholder?: string;
-    className?: string;
-    placeholderClassName?: string;
-}
-interface ContentProps {
-    className?: string;
-    openClassName?: string;
-    closedClassName?: string;
-    children?: ReactNode;
-}
-interface ItemProps {
-    value: string;
-    className?: string;
-    children?: ReactNode;
-}
-interface ItemIndicatorProps {
-    className?: string;
-    children?: ReactNode;
-}
-export interface SelectOption {
-    label: string;
-    value: string;
-}
-export declare const SelectBase: {
-    Root: ({ multiple, value, defaultValue, values, defaultValues, onChange, onMultiChange, disabled, name, items, maxDisplay, children, }: RootProps) => import("react/jsx-runtime").JSX.Element;
-    Trigger: ({ className, style, children, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: TriggerProps) => import("react/jsx-runtime").JSX.Element;
-    Value: ({ placeholder, className, placeholderClassName, }: ValueProps) => import("react/jsx-runtime").JSX.Element;
-    Content: ({ className, openClassName, closedClassName, children, }: ContentProps) => import("react/jsx-runtime").JSX.Element;
-    Item: ({ value: itemValue, className, children }: ItemProps) => import("react/jsx-runtime").JSX.Element;
-    ItemText: ({ children }: {
-        children?: ReactNode;
-    }) => import("react/jsx-runtime").JSX.Element;
-    ItemIndicator: ({ className, children }: ItemIndicatorProps) => import("react/jsx-runtime").JSX.Element | null;
-};
-export default SelectBase;
-//# sourceMappingURL=SelectBase.d.ts.map

package/dist/components/Select/SelectBase.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectBase.d.ts","sourceRoot":"","sources":["../../../src/components/Select/SelectBase.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,SAAS,EAQf,MAAM,OAAO,CAAC;AAsCf,UAAU,SAAS;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAsGD,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAyDD,UAAU,UAAU;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AA8CD,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4DD,UAAU,SAAS;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4FD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAeD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,UAAU;4IAhYpB,SAAS;iHAqGT,YAAY;+DA2DZ,UAAU;wEAoDV,YAAY;sDA2D0C,SAAS;6BAqFlC;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE;6CAUR,kBAAkB;CA0BjE,CAAC;AAEF,eAAe,UAAU,CAAC"}