@exem-ui/react 0.1.0

package/dist/chunk-DPUTW5KD.mjs

@@ -0,0 +1,74 @@
+import { Select } from './chunk-ZWCMSHDP.mjs';
+import { useRef, useState } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function FlatSelect({
+  options,
+  placeholder,
+  onBlur,
+  onFocus,
+  onOpenChange,
+  label,
+  description,
+  required,
+  listClassName,
+  leftIcon,
+  ...props
+}) {
+  const { className, ...selectProps } = props;
+  const selectRef = useRef(null);
+  const { handleBlur, handleFocus } = useFocusWithin(selectRef, {
+    onBlur,
+    onFocus
+  });
+  const handleOpenChange = (open) => {
+    if (open) {
+      handleFocus();
+    }
+    onOpenChange?.(open);
+  };
+  return /* @__PURE__ */ jsx("div", { ref: selectRef, className, children: /* @__PURE__ */ jsxs(Select, { ...selectProps, onOpenChange: handleOpenChange, children: [
+    label && /* @__PURE__ */ jsx(Select.Label, { required, children: label }),
+    /* @__PURE__ */ jsx(Select.Trigger, { onBlur: handleBlur, onFocus: handleFocus, leftIcon, children: /* @__PURE__ */ jsx(Select.Value, { placeholder, className: "truncate" }) }),
+    description && /* @__PURE__ */ jsx(Select.Description, { children: description }),
+    /* @__PURE__ */ jsxs(Select.List, { className: listClassName, children: [
+      options.length === 0 && /* @__PURE__ */ jsx(Select.Empty, { children: placeholder }),
+      options.map((option) => /* @__PURE__ */ jsxs(
+        Select.Item,
+        {
+          value: option.value,
+          disabled: option.disabled,
+          className: "flex max-w-full items-center justify-between",
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "block flex-1 truncate", children: option.label }),
+            option.rightSlot
+          ]
+        },
+        option.value
+      ))
+    ] })
+  ] }) });
+}
+function useFocusWithin(containerRef, callbacks) {
+  const [isFocused, setIsFocused] = useState(false);
+  const handleBlur = (event) => {
+    if (containerRef.current?.contains(event.relatedTarget)) {
+      return;
+    }
+    setIsFocused(false);
+    callbacks?.onBlur?.();
+  };
+  const handleFocus = () => {
+    if (isFocused) {
+      return;
+    }
+    setIsFocused(true);
+    callbacks?.onFocus?.();
+  };
+  return { handleBlur, handleFocus, isFocused };
+}
+FlatSelect.displayName = "FlatSelect";
+
+export { FlatSelect };
+//# sourceMappingURL=chunk-DPUTW5KD.mjs.map
+//# sourceMappingURL=chunk-DPUTW5KD.mjs.map

package/dist/chunk-DPUTW5KD.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/flat/FlatSelect.tsx"],"names":[],"mappings":"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","file":"chunk-DPUTW5KD.mjs","sourcesContent":["import type { ComponentProps, RefObject } from 'react';\nimport { useRef, useState } from 'react';\nimport { Select } from '../input/Select';\n\ntype FlatSelectOption = {\n  value: string;\n  label: string | React.ReactNode;\n  /** 아이템 오른쪽에 표시할 슬롯 요소 */\n  rightSlot?: React.ReactNode;\n  disabled?: boolean;\n};\n\ninterface FlatSelectProps extends React.ComponentProps<typeof Select> {\n  /** 선택 가능한 옵션 배열 */\n  options: FlatSelectOption[];\n  /** 값이 선택되지 않았을 때 표시할 텍스트 */\n  placeholder?: string;\n  /** 드롭다운 열림/닫힘 상태 변경 핸들러 */\n  onOpenChange?: (open: boolean) => void;\n  /** 포커스 획득 핸들러 */\n  onFocus?: () => void;\n  /** 포커스 해제 핸들러 */\n  onBlur?: () => void;\n  /** 트리거 왼쪽에 표시할 아이콘 */\n  leftIcon?: ComponentProps<typeof Select.Trigger>['leftIcon'];\n  /** 라벨 텍스트 */\n  label?: ComponentProps<typeof Select.Label>['children'];\n  /** 필수 입력 여부 */\n  required?: ComponentProps<typeof Select.Label>['required'];\n  /** 설명 텍스트 */\n  description?: ComponentProps<typeof Select.Description>['children'];\n  /** 드롭다운 리스트 className */\n  listClassName?: string;\n}\n\n/**\n * Select 컴포넌트의 간소화된 Flat API입니다.\n * options 배열만 전달하면 Compound Component 없이 간편하게 사용할 수 있습니다.\n *\n * @example\n * ```tsx\n * <FlatSelect\n *   options={[\n *     { value: '1', label: '옵션 1' },\n *     { value: '2', label: '옵션 2' },\n *   ]}\n *   placeholder=\"선택하세요\"\n *   label=\"항목\"\n * />\n * ```\n *\n * @see {@link FlatSelectProps} props 상세\n */\nfunction FlatSelect({\n  options,\n  placeholder,\n  onBlur,\n  onFocus,\n  onOpenChange,\n  label,\n  description,\n  required,\n  listClassName,\n  leftIcon,\n  ...props\n}: FlatSelectProps) {\n  const { className, ...selectProps } = props;\n  const selectRef = useRef<HTMLDivElement>(null);\n  const { handleBlur, handleFocus } = useFocusWithin(selectRef, {\n    onBlur,\n    onFocus,\n  });\n\n  const handleOpenChange = (open: boolean) => {\n    if (open) {\n      handleFocus();\n    }\n    onOpenChange?.(open);\n  };\n\n  return (\n    <div ref={selectRef} className={className}>\n      <Select {...selectProps} onOpenChange={handleOpenChange}>\n        {label && <Select.Label required={required}>{label}</Select.Label>}\n        <Select.Trigger onBlur={handleBlur} onFocus={handleFocus} leftIcon={leftIcon}>\n          <Select.Value placeholder={placeholder} className=\"truncate\" />\n        </Select.Trigger>\n        {description && <Select.Description>{description}</Select.Description>}\n        <Select.List className={listClassName}>\n          {options.length === 0 && <Select.Empty>{placeholder}</Select.Empty>}\n          {options.map((option) => (\n            <Select.Item\n              key={option.value}\n              value={option.value}\n              disabled={option.disabled}\n              className=\"flex max-w-full items-center justify-between\"\n            >\n              <div className=\"block flex-1 truncate\">{option.label}</div>\n              {option.rightSlot}\n            </Select.Item>\n          ))}\n        </Select.List>\n      </Select>\n    </div>\n  );\n}\n\nfunction useFocusWithin(\n  containerRef: RefObject<HTMLElement | null>,\n  callbacks?: { onFocus?: () => void; onBlur?: () => void },\n) {\n  const [isFocused, setIsFocused] = useState(false);\n\n  const handleBlur = (event: React.FocusEvent) => {\n    if (containerRef.current?.contains(event.relatedTarget as Node)) {\n      return;\n    }\n    setIsFocused(false);\n    callbacks?.onBlur?.();\n  };\n\n  const handleFocus = () => {\n    if (isFocused) {\n      return;\n    }\n    setIsFocused(true);\n    callbacks?.onFocus?.();\n  };\n\n  return { handleBlur, handleFocus, isFocused };\n}\n\nFlatSelect.displayName = 'FlatSelect';\n\nexport { FlatSelect };\nexport type { FlatSelectProps, FlatSelectOption };\n"]}

package/dist/chunk-E53FHDVN.mjs

@@ -0,0 +1,336 @@
+import { X, Warning, Info, Error, Check } from './chunk-LZWKMQJL.mjs';
+import { cn } from '@exem-ui/core/utils';
+import * as React from 'react';
+import { toast as toast$1, Toaster as Toaster$1 } from 'sonner';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var positionFix = `
+[data-sonner-toaster][data-x-position='center'] [data-sonner-toast] {
+  left: calc(var(--width) / 2) !important;
+  transform: translateX(-50%) var(--y) !important;
+  width: fit-content !important;
+  max-width: calc(100% - var(--mobile-offset-left) * 2) !important;
+}
+@media (max-width: 600px) {
+  [data-sonner-toaster] {
+    left: 0 !important;
+    right: 0 !important;
+  }
+  [data-sonner-toaster] [data-sonner-toast] {
+    width: fit-content !important;
+    max-width: calc(100% - var(--mobile-offset-left) - var(--mobile-offset-right)) !important;
+  }
+  [data-sonner-toaster][data-x-position='center'] [data-sonner-toast] {
+    left: 50% !important;
+  }
+  [data-sonner-toaster][data-x-position='right'] [data-sonner-toast] {
+    left: auto !important;
+    right: var(--mobile-offset-right) !important;
+  }
+  [data-sonner-toaster][data-x-position='left'] [data-sonner-toast] {
+    left: var(--mobile-offset-left) !important;
+    right: auto !important;
+  }
+}
+`;
+var Toaster = ({ ...props }) => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("style", { children: positionFix }),
+    /* @__PURE__ */ jsx(
+      Toaster$1,
+      {
+        className: "toaster group [--toast-width:auto] [&_li]:!flex [&_li]:!items-center [&_li]:!justify-between [&_li]:!gap-2",
+        closeButton: false,
+        toastOptions: {
+          closeButton: false
+        },
+        ...props
+      }
+    )
+  ] });
+};
+Toaster.Container = React.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex items-center gap-3 rounded-medium border border-border-primary bg-component-toast py-[10px] pl-3 pr-4 text-mono-light shadow-strong",
+          "h-10 w-auto min-w-0 max-w-none",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Icon = React.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn("flex shrink-0 items-center justify-center", className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Title = React.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-body-2 font-medium",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Description = React.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "w-full text-body-3 font-regular text-text-static-light/80",
+          "overflow-hidden text-ellipsis",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Action = React.forwardRef(
+  ({ className, children, altText, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: cn(
+          "flex h-7 min-h-[28px] w-auto min-w-[28px] shrink-0 items-center justify-center",
+          "rounded-small bg-transparent px-0 py-0",
+          "border-0 transition-colors",
+          "hover:bg-solid-primary-hovered",
+          "whitespace-nowrap",
+          "cursor-pointer",
+          "text-body-2",
+          className
+        ),
+        "aria-label": altText,
+        ...props,
+        children: children || /* @__PURE__ */ jsx(X, { type: "regular", className: "size-4" })
+      }
+    );
+  }
+);
+Toaster.displayName = "Toaster";
+Toaster.Container.displayName = "Toaster.Container";
+Toaster.Icon.displayName = "Toaster.Icon";
+Toaster.Title.displayName = "Toaster.Title";
+Toaster.Description.displayName = "Toaster.Description";
+Toaster.Action.displayName = "Toaster.Action";
+var ToastProvider = ({
+  children,
+  expand = true,
+  richColors = false,
+  closeButton = false,
+  position = "top-center",
+  duration = 4e3,
+  visibleToasts = 10,
+  toasterProps
+}) => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    children,
+    /* @__PURE__ */ jsx(
+      Toaster,
+      {
+        position,
+        closeButton,
+        richColors,
+        expand,
+        duration,
+        visibleToasts,
+        ...toasterProps
+      }
+    )
+  ] });
+};
+function isToastOptions(input) {
+  return typeof input === "object" && input !== null && "title" in input;
+}
+function extractToastParams(input, options) {
+  if (isToastOptions(input)) {
+    return {
+      title: input.title,
+      description: input.description,
+      action: input.action,
+      close: input.close
+    };
+  }
+  return {
+    title: input,
+    description: options?.description,
+    action: options?.action,
+    close: options?.close
+  };
+}
+function getSonnerOptions(options) {
+  if (!options) {
+    return void 0;
+  }
+  const { description: _description, action: _action, close: _close, ...sonnerOptions } = options;
+  return sonnerOptions;
+}
+function ToastContent({
+  id,
+  icon,
+  title,
+  description,
+  action,
+  close
+}) {
+  const hasExtra = description || action;
+  if (hasExtra) {
+    return /* @__PURE__ */ jsxs(Toaster.Container, { className: "h-auto min-h-12 flex-col items-start gap-1 py-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center gap-2", children: [
+        icon && /* @__PURE__ */ jsx(Toaster.Icon, { children: icon }),
+        /* @__PURE__ */ jsx(Toaster.Title, { children: title }),
+        close && /* @__PURE__ */ jsx(Toaster.Action, { className: "rounded-medium", onClick: () => toast$1.dismiss(id) })
+      ] }),
+      description && /* @__PURE__ */ jsx(Toaster.Description, { children: description }),
+      action && /* @__PURE__ */ jsx(
+        Toaster.Action,
+        {
+          className: "mt-1 text-text-info hover:text-text-info-hovered",
+          onClick: () => {
+            action.onClick();
+            toast$1.dismiss(id);
+          },
+          children: action.label
+        }
+      )
+    ] });
+  }
+  if (close) {
+    return /* @__PURE__ */ jsxs(Toaster.Container, { className: "py-1.5 pr-1.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-2 overflow-hidden", children: [
+        icon && /* @__PURE__ */ jsx(Toaster.Icon, { children: icon }),
+        /* @__PURE__ */ jsx(Toaster.Title, { children: title })
+      ] }),
+      /* @__PURE__ */ jsx(Toaster.Action, { className: "rounded-medium", onClick: () => toast$1.dismiss(id) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(Toaster.Container, { children: [
+    icon && /* @__PURE__ */ jsx(Toaster.Icon, { children: icon }),
+    /* @__PURE__ */ jsx(Toaster.Title, { children: title })
+  ] });
+}
+function createToast(input, options, icon) {
+  const { title, description, action, close } = extractToastParams(input, options);
+  return toast$1.custom(
+    (id) => /* @__PURE__ */ jsx(
+      ToastContent,
+      {
+        id,
+        icon,
+        title,
+        description,
+        action,
+        close
+      }
+    ),
+    { unstyled: true, ...getSonnerOptions(options) }
+  );
+}
+var toast = Object.assign(
+  (input, options) => createToast(input, options),
+  {
+    success: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsx(Check, { type: "regular", className: "size-5 text-icon-success" })
+    ),
+    error: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsx(Error, { type: "regular", className: "size-5 text-icon-critical" })
+    ),
+    info: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsx(Info, { type: "regular", className: "size-5 text-icon-static-light" })
+    ),
+    warning: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsx(Warning, { type: "regular", className: "size-5 text-icon-warning" })
+    ),
+    loading: (input, options) => createToast(input, options),
+    dismiss: toast$1.dismiss,
+    promise: toast$1.promise,
+    custom: toast$1.custom
+  }
+);
+function toExtended(options) {
+  if (!options) {
+    return void 0;
+  }
+  const { description: _desc, action: _act, ...rest } = options;
+  const converted = { ...rest };
+  if (typeof _desc === "string") {
+    converted.description = _desc;
+  }
+  return converted;
+}
+var DEFAULT_MESSAGES = {
+  success: "\uC131\uACF5",
+  error: "\uC624\uB958",
+  info: "\uC815\uBCF4",
+  warning: "\uACBD\uACE0",
+  loading: "\uB85C\uB529"
+};
+function useToast() {
+  const show = (message, options) => toast(message, toExtended(options));
+  const dismiss = (toastId) => toast.dismiss(toastId);
+  const showTypedToast = (type, message, options) => {
+    const toastMessage = message ?? DEFAULT_MESSAGES[type];
+    return toast[type](toastMessage, toExtended(options));
+  };
+  const promiseToast = (promiseTask, options, toastOptions) => toast$1.promise(promiseTask, {
+    loading: options.loading ?? DEFAULT_MESSAGES.loading,
+    success: options.success ?? DEFAULT_MESSAGES.success,
+    error: options.error ?? DEFAULT_MESSAGES.error,
+    finally: options.finally,
+    description: options.description,
+    ...toastOptions
+  });
+  const custom = (render, options) => toast.custom(render, options);
+  return {
+    show,
+    dismiss,
+    promise: promiseToast,
+    custom,
+    success: (message, options) => showTypedToast("success", message, options),
+    error: (message, options) => showTypedToast("error", message, options),
+    info: (message, options) => showTypedToast("info", message, options),
+    warning: (message, options) => showTypedToast("warning", message, options),
+    loading: (message, options) => showTypedToast("loading", message, options)
+  };
+}
+
+export { ToastProvider, Toaster, toast, useToast };
+//# sourceMappingURL=chunk-E53FHDVN.mjs.map
+//# sourceMappingURL=chunk-E53FHDVN.mjs.map

package/dist/chunk-E53FHDVN.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toast/Toaster.tsx","../src/toast/ToastProvider.tsx","../src/toast/toast.tsx","../src/toast/useToast.tsx"],"names":["Sonner","jsxs","Fragment","jsx","sonnerToast"],"mappings":"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","file":"chunk-E53FHDVN.mjs","sourcesContent":["import { cn } from '@exem-ui/core/utils';\nimport type * as ReactTypes from 'react';\nimport * as React from 'react';\nimport { Toaster as Sonner } from 'sonner';\nimport { XIcon } from '../icon';\n\n// Props 타입 정의\ntype ToasterRootProps = ReactTypes.ComponentProps<typeof Sonner>;\n\ntype ToasterContainerProps = {\n  children: ReactTypes.ReactNode;\n} & ReactTypes.HTMLAttributes<HTMLDivElement>;\n\ntype ToasterIconProps = {\n  children: ReactTypes.ReactNode;\n} & ReactTypes.HTMLAttributes<HTMLDivElement>;\n\ntype ToasterTitleProps = {\n  children: ReactTypes.ReactNode;\n} & ReactTypes.HTMLAttributes<HTMLDivElement>;\n\ntype ToasterDescriptionProps = {\n  children: ReactTypes.ReactNode;\n} & ReactTypes.HTMLAttributes<HTMLDivElement>;\n\ntype ToasterActionProps = {\n  children?: ReactTypes.ReactNode;\n  altText?: string;\n} & ReactTypes.ButtonHTMLAttributes<HTMLButtonElement>;\n\n// Namespace 타입 정의\ntype ToasterComponent = React.FC<ToasterRootProps> & {\n  Container: React.ForwardRefExoticComponent<\n    ToasterContainerProps & React.RefAttributes<HTMLDivElement>\n  >;\n  Icon: React.ForwardRefExoticComponent<ToasterIconProps & React.RefAttributes<HTMLDivElement>>;\n  Title: React.ForwardRefExoticComponent<ToasterTitleProps & React.RefAttributes<HTMLDivElement>>;\n  Description: React.ForwardRefExoticComponent<\n    ToasterDescriptionProps & React.RefAttributes<HTMLDivElement>\n  >;\n  Action: React.ForwardRefExoticComponent<\n    ToasterActionProps & React.RefAttributes<HTMLButtonElement>\n  >;\n};\n\n/**\n * Sonner center 포지셔닝 보정\n *\n * Sonner는 toaster(`<ol>`)를 left:50% + translateX(-50%)로 중앙 정렬하지만,\n * 개별 toast는 toaster 내에서 left:0으로 왼쪽 정렬됩니다.\n * auto-width toast는 toaster(356px)보다 좁아 왼쪽으로 치우칩니다.\n *\n * 해결: 개별 toast에 left:calc(--width/2) + translateX(-50%) 적용\n * (참고: https://github.com/emilkowalski/sonner/issues/678)\n */\nconst positionFix = `\n[data-sonner-toaster][data-x-position='center'] [data-sonner-toast] {\n  left: calc(var(--width) / 2) !important;\n  transform: translateX(-50%) var(--y) !important;\n  width: fit-content !important;\n  max-width: calc(100% - var(--mobile-offset-left) * 2) !important;\n}\n@media (max-width: 600px) {\n  [data-sonner-toaster] {\n    left: 0 !important;\n    right: 0 !important;\n  }\n  [data-sonner-toaster] [data-sonner-toast] {\n    width: fit-content !important;\n    max-width: calc(100% - var(--mobile-offset-left) - var(--mobile-offset-right)) !important;\n  }\n  [data-sonner-toaster][data-x-position='center'] [data-sonner-toast] {\n    left: 50% !important;\n  }\n  [data-sonner-toaster][data-x-position='right'] [data-sonner-toast] {\n    left: auto !important;\n    right: var(--mobile-offset-right) !important;\n  }\n  [data-sonner-toaster][data-x-position='left'] [data-sonner-toast] {\n    left: var(--mobile-offset-left) !important;\n    right: auto !important;\n  }\n}\n`;\n\n// Root 컴포넌트 (Provider)\nconst Toaster: ToasterComponent = ({ ...props }: ToasterRootProps) => {\n  return (\n    <>\n      <style>{positionFix}</style>\n      <Sonner\n        // eslint-disable-next-line tailwindcss/no-custom-classname -- toaster는 shadcn의 클래스 구성임\n        className=\"toaster group [--toast-width:auto] [&_li]:!flex [&_li]:!items-center [&_li]:!justify-between [&_li]:!gap-2\"\n        closeButton={false}\n        toastOptions={{\n          closeButton: false,\n        }}\n        {...props}\n      />\n    </>\n  );\n};\n\n// Toast Container (커스텀 토스트용)\nToaster.Container = React.forwardRef<HTMLDivElement, ToasterContainerProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex items-center gap-3 rounded-medium border border-border-primary bg-component-toast py-[10px] pl-3 pr-4 text-mono-light shadow-strong',\n          'h-10 w-auto min-w-0 max-w-none',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n) as ToasterComponent['Container'];\n\n// Icon 컴포넌트\nToaster.Icon = React.forwardRef<HTMLDivElement, ToasterIconProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn('flex shrink-0 items-center justify-center', className)}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n) as ToasterComponent['Icon'];\n\n// Title 컴포넌트\nToaster.Title = React.forwardRef<HTMLDivElement, ToasterTitleProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-body-2 font-medium',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n) as ToasterComponent['Title'];\n\n// Description 컴포넌트\nToaster.Description = React.forwardRef<HTMLDivElement, ToasterDescriptionProps>(\n  ({ className, children, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'w-full text-body-3 font-regular text-text-static-light/80',\n          'overflow-hidden text-ellipsis',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  },\n) as ToasterComponent['Description'];\n\n// Action 컴포넌트 (닫기 버튼 등)\nToaster.Action = React.forwardRef<HTMLButtonElement, ToasterActionProps>(\n  ({ className, children, altText, ...props }, ref) => {\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        className={cn(\n          'flex h-7 min-h-[28px] w-auto min-w-[28px] shrink-0 items-center justify-center',\n          'rounded-small bg-transparent px-0 py-0',\n          'border-0 transition-colors',\n          'hover:bg-solid-primary-hovered',\n          'whitespace-nowrap',\n          'cursor-pointer',\n          'text-body-2',\n          className,\n        )}\n        aria-label={altText}\n        {...props}\n      >\n        {children || <XIcon type=\"regular\" className=\"size-4\" />}\n      </button>\n    );\n  },\n) as ToasterComponent['Action'];\n\n// displayName 설정\nToaster.displayName = 'Toaster';\nToaster.Container.displayName = 'Toaster.Container';\nToaster.Icon.displayName = 'Toaster.Icon';\nToaster.Title.displayName = 'Toaster.Title';\nToaster.Description.displayName = 'Toaster.Description';\nToaster.Action.displayName = 'Toaster.Action';\n\nexport { Toaster };\nexport type {\n  ToasterActionProps,\n  ToasterComponent,\n  ToasterContainerProps,\n  ToasterDescriptionProps,\n  ToasterIconProps,\n  ToasterRootProps,\n  ToasterTitleProps,\n};\n","import type React from 'react';\n\nimport type { ToasterRootProps } from './Toaster';\nimport { Toaster } from './Toaster';\n\nexport interface ToastProviderProps {\n  children?: React.ReactNode;\n  /**\n   * 호버 시 토스트 확장\n   * @default true\n   */\n  expand?: boolean;\n  /**\n   * Rich colors 스타일 적용\n   * @default false\n   */\n  richColors?: boolean;\n  /**\n   * Provider 레벨 닫기 버튼\n   * @default false\n   */\n  closeButton?: boolean;\n  /**\n   * 토스트가 표시될 위치\n   * @default 'top-center'\n   */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right';\n  /**\n   * 토스트 표시 시간 (ms)\n   * @default 4000\n   */\n  duration?: number;\n  /**\n   * 토스트 최대 개수\n   * @default 10\n   */\n  visibleToasts?: number;\n  /**\n   * 추가 Toaster props\n   */\n  toasterProps?: Omit<ToasterRootProps, 'children' | 'expand' | 'richColors' | 'closeButton'>;\n}\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n  children,\n  expand = true,\n  richColors = false,\n  closeButton = false,\n  position = 'top-center',\n  duration = 4000,\n  visibleToasts = 10,\n  toasterProps,\n}) => {\n  return (\n    <>\n      {children}\n      <Toaster\n        position={position}\n        closeButton={closeButton}\n        richColors={richColors}\n        expand={expand}\n        duration={duration}\n        visibleToasts={visibleToasts}\n        {...toasterProps}\n      />\n    </>\n  );\n};\n","import type { ExternalToast } from 'sonner';\nimport { toast as sonnerToast } from 'sonner';\n\nimport { CheckIcon, ErrorIcon, InfoIcon, WarningIcon } from '../icon';\nimport { Toaster } from './Toaster';\n\n// ── Types ──\n\ninterface ToastAction {\n  label: string;\n  onClick: () => void;\n}\n\ninterface ToastOptions {\n  title: string;\n  description?: string;\n  action?: ToastAction;\n  close?: boolean;\n}\n\ninterface ExtendedExternalToast extends ExternalToast {\n  description?: string;\n  action?: ToastAction;\n  close?: boolean;\n}\n\ntype ToastInput = string | ToastOptions;\n\n// ── Helpers ──\n\nfunction isToastOptions(input: ToastInput): input is ToastOptions {\n  return typeof input === 'object' && input !== null && 'title' in input;\n}\n\nfunction extractToastParams(\n  input: ToastInput,\n  options?: ExtendedExternalToast,\n): { title: string; description?: string; action?: ToastAction; close?: boolean } {\n  if (isToastOptions(input)) {\n    return {\n      title: input.title,\n      description: input.description,\n      action: input.action,\n      close: input.close,\n    };\n  }\n  return {\n    title: input,\n    description: options?.description,\n    action: options?.action,\n    close: options?.close,\n  };\n}\n\nfunction getSonnerOptions(options?: ExtendedExternalToast): ExternalToast | undefined {\n  if (!options) {\n    return undefined;\n  }\n  const { description: _description, action: _action, close: _close, ...sonnerOptions } = options;\n  return sonnerOptions;\n}\n\n// ── Toast Content ──\n\nfunction ToastContent({\n  id,\n  icon,\n  title,\n  description,\n  action,\n  close,\n}: {\n  id: string | number;\n  icon?: React.ReactNode;\n  title: string;\n  description?: string;\n  action?: ToastAction;\n  close?: boolean;\n}) {\n  const hasExtra = description || action;\n\n  if (hasExtra) {\n    return (\n      <Toaster.Container className=\"h-auto min-h-12 flex-col items-start gap-1 py-3\">\n        <div className=\"flex w-full items-center gap-2\">\n          {icon && <Toaster.Icon>{icon}</Toaster.Icon>}\n          <Toaster.Title>{title}</Toaster.Title>\n          {close && (\n            <Toaster.Action className=\"rounded-medium\" onClick={() => sonnerToast.dismiss(id)} />\n          )}\n        </div>\n        {description && <Toaster.Description>{description}</Toaster.Description>}\n        {action && (\n          <Toaster.Action\n            className=\"mt-1 text-text-info hover:text-text-info-hovered\"\n            onClick={() => {\n              action.onClick();\n              sonnerToast.dismiss(id);\n            }}\n          >\n            {action.label}\n          </Toaster.Action>\n        )}\n      </Toaster.Container>\n    );\n  }\n\n  // Figma: close=true → pl-12 pr-6 py-6 gap-12, Content(icon+text) gap-8\n  // Figma: close=false → pl-12 pr-16 py-10, Content(icon+text) gap-8\n  if (close) {\n    return (\n      <Toaster.Container className=\"py-1.5 pr-1.5\">\n        <div className=\"flex flex-1 items-center gap-2 overflow-hidden\">\n          {icon && <Toaster.Icon>{icon}</Toaster.Icon>}\n          <Toaster.Title>{title}</Toaster.Title>\n        </div>\n        <Toaster.Action className=\"rounded-medium\" onClick={() => sonnerToast.dismiss(id)} />\n      </Toaster.Container>\n    );\n  }\n\n  return (\n    <Toaster.Container>\n      {icon && <Toaster.Icon>{icon}</Toaster.Icon>}\n      <Toaster.Title>{title}</Toaster.Title>\n    </Toaster.Container>\n  );\n}\n\n// ── Internal creator ──\n\nfunction createToast(\n  input: ToastInput,\n  options: ExtendedExternalToast | undefined,\n  icon?: React.ReactNode,\n) {\n  const { title, description, action, close } = extractToastParams(input, options);\n\n  return sonnerToast.custom(\n    (id) => (\n      <ToastContent\n        id={id}\n        icon={icon}\n        title={title}\n        description={description}\n        action={action}\n        close={close}\n      />\n    ),\n    { unstyled: true, ...getSonnerOptions(options) },\n  );\n}\n\n// ── Public API ──\n\n/**\n * toast() — 커스텀 디자인이 적용된 toast 함수\n *\n * sonner의 toast를 래핑하여 프로젝트의 디자인 시스템을 자동으로 적용합니다.\n *\n * @example\n * ```tsx\n * import { toast } from '@exem-ui/react';\n *\n * // 간단한 메시지\n * toast('기본 메시지');\n * toast.success('성공');\n * toast.error('오류');\n * toast.info('정보');\n * toast.warning('경고');\n *\n * // title + description + action\n * toast.success({\n *   title: '저장 완료',\n *   description: '변경사항이 저장되었습니다.',\n *   action: { label: '되돌리기', onClick: () => handleUndo() },\n * });\n *\n * // 닫기 버튼\n * toast.success({ title: '저장 완료', close: true });\n *\n * // 문자열 + 옵션 (sonner 스타일)\n * toast.success('생성 완료', {\n *   description: '일요일, 12월 3일',\n *   action: { label: 'Undo', onClick: () => console.log('Undo') },\n * });\n * ```\n */\nexport const toast = Object.assign(\n  (input: ToastInput, options?: ExtendedExternalToast) => createToast(input, options),\n  {\n    success: (input: ToastInput, options?: ExtendedExternalToast) =>\n      createToast(\n        input,\n        options,\n        <CheckIcon type=\"regular\" className=\"size-5 text-icon-success\" />,\n      ),\n\n    error: (input: ToastInput, options?: ExtendedExternalToast) =>\n      createToast(\n        input,\n        options,\n        <ErrorIcon type=\"regular\" className=\"size-5 text-icon-critical\" />,\n      ),\n\n    info: (input: ToastInput, options?: ExtendedExternalToast) =>\n      createToast(\n        input,\n        options,\n        <InfoIcon type=\"regular\" className=\"size-5 text-icon-static-light\" />,\n      ),\n\n    warning: (input: ToastInput, options?: ExtendedExternalToast) =>\n      createToast(\n        input,\n        options,\n        <WarningIcon type=\"regular\" className=\"size-5 text-icon-warning\" />,\n      ),\n\n    loading: (input: ToastInput, options?: ExtendedExternalToast) => createToast(input, options),\n\n    dismiss: sonnerToast.dismiss,\n    promise: sonnerToast.promise as typeof sonnerToast.promise,\n    custom: sonnerToast.custom,\n  },\n);\n\nexport type { ExtendedExternalToast, ToastAction, ToastInput, ToastOptions };\n","import type React from 'react';\nimport { toast as sonnerToast } from 'sonner';\nimport type { ExtendedExternalToast } from './toast';\nimport { toast } from './toast';\nimport type * as Toast from './types';\n\nfunction toExtended(options?: Toast.Options): ExtendedExternalToast | undefined {\n  if (!options) {\n    return undefined;\n  }\n  const { description: _desc, action: _act, ...rest } = options;\n  const converted: Record<string, unknown> = { ...rest };\n  if (typeof _desc === 'string') {\n    converted.description = _desc;\n  }\n  return converted as ExtendedExternalToast;\n}\n\nconst DEFAULT_MESSAGES: Toast.DefaultMessage = {\n  success: '성공',\n  error: '오류',\n  info: '정보',\n  warning: '경고',\n  loading: '로딩',\n};\n\n/**\n * @deprecated `toast` 함수를 직접 사용하세요.\n *\n * 하위호환을 위해 유지되며, 내부적으로 `toast`에 위임합니다.\n *\n * @example\n * ```tsx\n * // Before (useToast)\n * const { success } = useToast();\n * success('완료');\n *\n * // After (toast 직접 사용)\n * import { toast } from '@exem-ui/react';\n * toast.success('완료');\n * ```\n */\nexport function useToast() {\n  const show = (message: string, options?: Toast.Options) => toast(message, toExtended(options));\n\n  const dismiss = (toastId: string | number) => toast.dismiss(toastId);\n\n  const showTypedToast = (type: Toast.Type, message?: string, options?: Toast.Options) => {\n    const toastMessage = message ?? DEFAULT_MESSAGES[type];\n    return toast[type](toastMessage, toExtended(options));\n  };\n\n  const promiseToast = <T,>(\n    promiseTask: Promise<T>,\n    options: Toast.PromiseOptions<T>,\n    toastOptions?: Toast.Options,\n  ) =>\n    sonnerToast.promise(promiseTask, {\n      loading: options.loading ?? DEFAULT_MESSAGES.loading,\n      success: options.success ?? DEFAULT_MESSAGES.success,\n      error: options.error ?? DEFAULT_MESSAGES.error,\n      finally: options.finally,\n      description: options.description,\n      ...toastOptions,\n    });\n\n  const custom = (render: (id: string | number) => React.ReactElement, options?: Toast.Options) =>\n    toast.custom(render, options);\n\n  return {\n    show,\n    dismiss,\n    promise: promiseToast,\n    custom,\n    success: (message?: string, options?: Toast.Options) =>\n      showTypedToast('success', message, options),\n    error: (message?: string, options?: Toast.Options) => showTypedToast('error', message, options),\n    info: (message?: string, options?: Toast.Options) => showTypedToast('info', message, options),\n    warning: (message?: string, options?: Toast.Options) =>\n      showTypedToast('warning', message, options),\n    loading: (message?: string, options?: Toast.Options) =>\n      showTypedToast('loading', message, options),\n  };\n}\n"]}

package/dist/chunk-ECRQD7UU.js

@@ -0,0 +1,82 @@
+'use strict';
+
+var chunk5M47B2XJ_js = require('./chunk-5M47B2XJ.js');
+var utils = require('@exem-ui/core/utils');
+var reactSlot = require('@radix-ui/react-slot');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+var Breadcrumb = react.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("nav", { ref, "aria-label": "breadcrumb", ...props }));
+Breadcrumb.List = react.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "ol",
+    {
+      ref,
+      className: utils.cn(
+        "flex flex-wrap items-center gap-[4px] break-words text-body-2 text-text-tertiary",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Breadcrumb.Item = react.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("li", { ref, className: utils.cn("inline-flex items-center", className), ...props }));
+Breadcrumb.Link = react.forwardRef(
+  ({ asChild, className, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "a";
+    return /* @__PURE__ */ jsxRuntime.jsx(Comp, { ref, className: utils.cn("text-text-link", className), ...props });
+  }
+);
+Breadcrumb.Page = react.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      ref,
+      role: "link",
+      "aria-disabled": "true",
+      "aria-current": "page",
+      className: utils.cn("text-text-primary", className),
+      ...props
+    }
+  )
+);
+Breadcrumb.Separator = react.forwardRef(
+  ({ children, className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "li",
+    {
+      ref,
+      role: "presentation",
+      "aria-hidden": "true",
+      className: utils.cn("[&>svg]:size-3.5", className),
+      ...props,
+      children: children ?? "/"
+    }
+  )
+);
+Breadcrumb.Ellipsis = react.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      ref,
+      role: "presentation",
+      "aria-hidden": "true",
+      className: utils.cn("flex h-9 w-9 items-center justify-center", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.MoreHorizontal, { type: "regular", className: "size-4" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "More" })
+      ]
+    }
+  )
+);
+Breadcrumb.displayName = "Breadcrumb";
+Breadcrumb.List.displayName = "Breadcrumb.List";
+Breadcrumb.Item.displayName = "Breadcrumb.Item";
+Breadcrumb.Link.displayName = "Breadcrumb.Link";
+Breadcrumb.Page.displayName = "Breadcrumb.Page";
+Breadcrumb.Separator.displayName = "Breadcrumb.Separator";
+Breadcrumb.Ellipsis.displayName = "Breadcrumb.Ellipsis";
+
+exports.Breadcrumb = Breadcrumb;
+//# sourceMappingURL=chunk-ECRQD7UU.js.map
+//# sourceMappingURL=chunk-ECRQD7UU.js.map

package/dist/chunk-ECRQD7UU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/breadcrumb/Breadcrumb.tsx"],"names":["forwardRef","jsx","cn","Slot","jsxs","MoreHorizontal"],"mappings":"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","file":"chunk-ECRQD7UU.js","sourcesContent":["import { cn } from '@exem-ui/core/utils';\nimport { Slot } from '@radix-ui/react-slot';\nimport type React from 'react';\nimport { forwardRef } from 'react';\nimport { MoreHorizontalIcon } from '../icon';\n\ntype BreadcrumbRootProps = React.ComponentPropsWithoutRef<'nav'>;\n\ntype BreadcrumbListProps = React.ComponentPropsWithoutRef<'ol'>;\n\ntype BreadcrumbItemProps = React.ComponentPropsWithoutRef<'li'>;\n\ntype BreadcrumbLinkProps = React.ComponentPropsWithoutRef<'a'> & {\n  asChild?: boolean;\n};\n\ntype BreadcrumbPageProps = React.ComponentPropsWithoutRef<'span'>;\n\ntype BreadcrumbSeparatorProps = React.ComponentProps<'li'>;\n\ntype BreadcrumbEllipsisProps = React.ComponentProps<'span'>;\n\ntype BreadcrumbComponent = React.ForwardRefExoticComponent<\n  React.PropsWithoutRef<BreadcrumbRootProps> & React.RefAttributes<HTMLElement>\n> & {\n  List: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<BreadcrumbListProps> & React.RefAttributes<HTMLOListElement>\n  >;\n  Item: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<BreadcrumbItemProps> & React.RefAttributes<HTMLLIElement>\n  >;\n  Link: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<BreadcrumbLinkProps> & React.RefAttributes<HTMLAnchorElement>\n  >;\n  Page: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<BreadcrumbPageProps> & React.RefAttributes<HTMLSpanElement>\n  >;\n  Separator: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<BreadcrumbSeparatorProps> & React.RefAttributes<HTMLLIElement>\n  >;\n  Ellipsis: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<BreadcrumbEllipsisProps> & React.RefAttributes<HTMLSpanElement>\n  >;\n};\n\n/**\n * 현재 페이지의 계층 위치를 표시하는 탐색 경로 컴포넌트입니다.\n * Compound Component 패턴으로 하위 컴포넌트와 함께 사용합니다.\n *\n * @example\n * ```tsx\n * <Breadcrumb>\n *   <Breadcrumb.List>\n *     <Breadcrumb.Item>\n *       <Breadcrumb.Link href=\"/\">홈</Breadcrumb.Link>\n *     </Breadcrumb.Item>\n *     <Breadcrumb.Separator />\n *     <Breadcrumb.Item>\n *       <Breadcrumb.Page>현재 페이지</Breadcrumb.Page>\n *     </Breadcrumb.Item>\n *   </Breadcrumb.List>\n * </Breadcrumb>\n * ```\n *\n * @see {@link BreadcrumbRootProps} props 상세\n */\nconst Breadcrumb = forwardRef<HTMLElement, BreadcrumbRootProps>(({ ...props }, ref) => (\n  <nav ref={ref} aria-label=\"breadcrumb\" {...props} />\n)) as BreadcrumbComponent;\n\nBreadcrumb.List = forwardRef<HTMLOListElement, BreadcrumbListProps>(\n  ({ className, ...props }, ref) => (\n    <ol\n      ref={ref}\n      className={cn(\n        'flex flex-wrap items-center gap-[4px] break-words text-body-2 text-text-tertiary',\n        className,\n      )}\n      {...props}\n    />\n  ),\n) as BreadcrumbComponent['List'];\n\nBreadcrumb.Item = forwardRef<HTMLLIElement, BreadcrumbItemProps>(({ className, ...props }, ref) => (\n  <li ref={ref} className={cn('inline-flex items-center', className)} {...props} />\n)) as BreadcrumbComponent['Item'];\n\nBreadcrumb.Link = forwardRef<HTMLAnchorElement, BreadcrumbLinkProps>(\n  ({ asChild, className, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'a';\n\n    return <Comp ref={ref} className={cn('text-text-link', className)} {...props} />;\n  },\n) as BreadcrumbComponent['Link'];\n\nBreadcrumb.Page = forwardRef<HTMLSpanElement, BreadcrumbPageProps>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn('text-text-primary', className)}\n      {...props}\n    />\n  ),\n) as BreadcrumbComponent['Page'];\n\nBreadcrumb.Separator = forwardRef<HTMLLIElement, BreadcrumbSeparatorProps>(\n  ({ children, className, ...props }, ref) => (\n    <li\n      ref={ref}\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn('[&>svg]:size-3.5', className)}\n      {...props}\n    >\n      {children ?? '/'}\n    </li>\n  ),\n) as BreadcrumbComponent['Separator'];\n\nBreadcrumb.Ellipsis = forwardRef<HTMLSpanElement, BreadcrumbEllipsisProps>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn('flex h-9 w-9 items-center justify-center', className)}\n      {...props}\n    >\n      <MoreHorizontalIcon type=\"regular\" className=\"size-4\" />\n      <span className=\"sr-only\">More</span>\n    </span>\n  ),\n) as BreadcrumbComponent['Ellipsis'];\n\nBreadcrumb.displayName = 'Breadcrumb';\nBreadcrumb.List.displayName = 'Breadcrumb.List';\nBreadcrumb.Item.displayName = 'Breadcrumb.Item';\nBreadcrumb.Link.displayName = 'Breadcrumb.Link';\nBreadcrumb.Page.displayName = 'Breadcrumb.Page';\nBreadcrumb.Separator.displayName = 'Breadcrumb.Separator';\nBreadcrumb.Ellipsis.displayName = 'Breadcrumb.Ellipsis';\n\nexport { Breadcrumb };\nexport type {\n  BreadcrumbComponent,\n  BreadcrumbRootProps,\n  BreadcrumbListProps,\n  BreadcrumbItemProps,\n  BreadcrumbLinkProps,\n  BreadcrumbPageProps,\n  BreadcrumbSeparatorProps,\n  BreadcrumbEllipsisProps,\n};\n"]}

package/dist/chunk-FB4ESGOX.mjs

@@ -0,0 +1,59 @@
+import { cva, cn } from '@exem-ui/core/utils';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/progress/Progress.tsx
+var trackVariants = cva("w-full overflow-hidden rounded-full bg-elevation-elevation-3", {
+  variants: {
+    size: {
+      small: "h-1",
+      medium: "h-1.5",
+      large: "h-2"
+    }
+  },
+  defaultVariants: {
+    size: "large"
+  }
+});
+var gaugeVariants = cva("h-full rounded-full bg-icon-accent transition-[width] duration-300", {
+  variants: {
+    size: {
+      small: "",
+      medium: "",
+      large: ""
+    }
+  },
+  defaultVariants: {
+    size: "medium"
+  }
+});
+var Progress = forwardRef(
+  ({ value = 0, max = 100, size = "medium", trackClassName, gaugeClassName, className, ...props }, ref) => {
+    const clampedValue = Math.min(Math.max(value, 0), max);
+    const percent = max > 0 ? clampedValue / max * 100 : 0;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "progressbar",
+        "aria-valuenow": clampedValue,
+        "aria-valuemin": 0,
+        "aria-valuemax": max,
+        className: cn(trackVariants({ size }), trackClassName, className),
+        ...props,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(gaugeVariants({ size }), gaugeClassName),
+            style: { width: `${percent}%` }
+          }
+        )
+      }
+    );
+  }
+);
+Progress.displayName = "Progress";
+
+export { Progress };
+//# sourceMappingURL=chunk-FB4ESGOX.mjs.map
+//# sourceMappingURL=chunk-FB4ESGOX.mjs.map

package/dist/chunk-FB4ESGOX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/progress/Progress.tsx"],"names":[],"mappings":";;;;;AAIA,IAAM,aAAA,GAAgB,IAAI,8DAAA,EAAgE;AAAA,EACxF,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO,KAAA;AAAA,MACP,MAAA,EAAQ,OAAA;AAAA,MACR,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;AAED,IAAM,aAAA,GAAgB,IAAI,oEAAA,EAAsE;AAAA,EAC9F,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,KAAA,EAAO,EAAA;AAAA,MACP,MAAA,EAAQ,EAAA;AAAA,MACR,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;AAkCD,IAAM,QAAA,GAAW,UAAA;AAAA,EACf,CACE,EAAE,KAAA,GAAQ,CAAA,EAAG,MAAM,GAAA,EAAK,IAAA,GAAO,QAAA,EAAU,cAAA,EAAgB,cAAA,EAAgB,SAAA,EAAW,GAAG,KAAA,IACvF,GAAA,KACG;AACH,IAAA,MAAM,YAAA,GAAe,KAAK,GAAA,CAAI,IAAA,CAAK,IAAI,KAAA,EAAO,CAAC,GAAG,GAAG,CAAA;AACrD,IAAA,MAAM,OAAA,GAAU,GAAA,GAAM,CAAA,GAAK,YAAA,GAAe,MAAO,GAAA,GAAM,CAAA;AAEvD,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAA,EAAK,aAAA;AAAA,QACL,eAAA,EAAe,YAAA;AAAA,QACf,eAAA,EAAe,CAAA;AAAA,QACf,eAAA,EAAe,GAAA;AAAA,QACf,SAAA,EAAW,GAAG,aAAA,CAAc,EAAE,MAAM,CAAA,EAAG,gBAAgB,SAAS,CAAA;AAAA,QAC/D,GAAG,KAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,WAAW,EAAA,CAAG,aAAA,CAAc,EAAE,IAAA,EAAM,GAAG,cAAc,CAAA;AAAA,YACrD,KAAA,EAAO,EAAE,KAAA,EAAO,CAAA,EAAG,OAAO,CAAA,CAAA,CAAA;AAAI;AAAA;AAChC;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-FB4ESGOX.mjs","sourcesContent":["import { cn, cva, type VariantProps } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { forwardRef } from 'react';\n\nconst trackVariants = cva('w-full overflow-hidden rounded-full bg-elevation-elevation-3', {\n  variants: {\n    size: {\n      small: 'h-1',\n      medium: 'h-1.5',\n      large: 'h-2',\n    },\n  },\n  defaultVariants: {\n    size: 'large',\n  },\n});\n\nconst gaugeVariants = cva('h-full rounded-full bg-icon-accent transition-[width] duration-300', {\n  variants: {\n    size: {\n      small: '',\n      medium: '',\n      large: '',\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\ninterface ProgressProps\n  extends VariantProps<typeof trackVariants>,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  /**\n   * 현재 진행 값\n   * @default 0\n   */\n  value?: number;\n  /**\n   * 최대 값\n   * @default 100\n   */\n  max?: number;\n  /** 트랙(배경) 추가 클래스 */\n  trackClassName?: string;\n  /** 게이지(채움) 추가 클래스 */\n  gaugeClassName?: string;\n}\n\ntype ProgressComponent = React.ForwardRefExoticComponent<\n  ProgressProps & React.RefAttributes<HTMLDivElement>\n>;\n\n/**\n * 작업 진행률을 시각적으로 표시하는 바 컴포넌트입니다.\n *\n * @example\n * ```tsx\n * <Progress value={60} />\n * <Progress value={30} max={100} size=\"large\" />\n * ```\n */\nconst Progress = forwardRef<HTMLDivElement, ProgressProps>(\n  (\n    { value = 0, max = 100, size = 'medium', trackClassName, gaugeClassName, className, ...props },\n    ref,\n  ) => {\n    const clampedValue = Math.min(Math.max(value, 0), max);\n    const percent = max > 0 ? (clampedValue / max) * 100 : 0;\n\n    return (\n      <div\n        ref={ref}\n        role=\"progressbar\"\n        aria-valuenow={clampedValue}\n        aria-valuemin={0}\n        aria-valuemax={max}\n        className={cn(trackVariants({ size }), trackClassName, className)}\n        {...props}\n      >\n        <div\n          className={cn(gaugeVariants({ size }), gaugeClassName)}\n          style={{ width: `${percent}%` }}\n        />\n      </div>\n    );\n  },\n) as ProgressComponent;\n\nProgress.displayName = 'Progress';\n\nexport { Progress };\nexport type { ProgressComponent, ProgressProps };\n"]}