@exem-ui/react 0.1.0-next.bf3c711

package/dist/chunk-AU5NTBK3.js

@@ -0,0 +1,361 @@
+'use strict';
+
+var chunk5M47B2XJ_js = require('./chunk-5M47B2XJ.js');
+var utils = require('@exem-ui/core/utils');
+var React = require('react');
+var sonner = require('sonner');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+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__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: positionFix }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      sonner.Toaster,
+      {
+        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__namespace.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: utils.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__namespace.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: utils.cn("flex shrink-0 items-center justify-center", className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Title = React__namespace.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: utils.cn(
+          "flex-1 overflow-hidden text-ellipsis whitespace-nowrap text-body-2 font-medium",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Description = React__namespace.forwardRef(
+  ({ className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: utils.cn(
+          "w-full text-body-3 font-regular text-text-static-light/80",
+          "overflow-hidden text-ellipsis",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Toaster.Action = React__namespace.forwardRef(
+  ({ className, children, altText, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: utils.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__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.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__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    children,
+    /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsxs(Toaster.Container, { className: "h-auto min-h-12 flex-col items-start gap-1 py-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2", children: [
+        icon && /* @__PURE__ */ jsxRuntime.jsx(Toaster.Icon, { children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsx(Toaster.Title, { children: title }),
+        close && /* @__PURE__ */ jsxRuntime.jsx(Toaster.Action, { className: "rounded-medium", onClick: () => sonner.toast.dismiss(id) })
+      ] }),
+      description && /* @__PURE__ */ jsxRuntime.jsx(Toaster.Description, { children: description }),
+      action && /* @__PURE__ */ jsxRuntime.jsx(
+        Toaster.Action,
+        {
+          className: "mt-1 text-text-info hover:text-text-info-hovered",
+          onClick: () => {
+            action.onClick();
+            sonner.toast.dismiss(id);
+          },
+          children: action.label
+        }
+      )
+    ] });
+  }
+  if (close) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(Toaster.Container, { className: "py-1.5 pr-1.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 items-center gap-2 overflow-hidden", children: [
+        icon && /* @__PURE__ */ jsxRuntime.jsx(Toaster.Icon, { children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsx(Toaster.Title, { children: title })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Toaster.Action, { className: "rounded-medium", onClick: () => sonner.toast.dismiss(id) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(Toaster.Container, { children: [
+    icon && /* @__PURE__ */ jsxRuntime.jsx(Toaster.Icon, { children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsx(Toaster.Title, { children: title })
+  ] });
+}
+function createToast(input, options, icon) {
+  const { title, description, action, close } = extractToastParams(input, options);
+  return sonner.toast.custom(
+    (id) => /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.Check, { type: "regular", className: "size-5 text-icon-success" })
+    ),
+    error: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.Error, { type: "regular", className: "size-5 text-icon-critical" })
+    ),
+    info: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.Info, { type: "regular", className: "size-5 text-icon-static-light" })
+    ),
+    warning: (input, options) => createToast(
+      input,
+      options,
+      /* @__PURE__ */ jsxRuntime.jsx(chunk5M47B2XJ_js.Warning, { type: "regular", className: "size-5 text-icon-warning" })
+    ),
+    loading: (input, options) => createToast(input, options),
+    dismiss: sonner.toast.dismiss,
+    promise: sonner.toast.promise,
+    custom: sonner.toast.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) => sonner.toast.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)
+  };
+}
+
+exports.ToastProvider = ToastProvider;
+exports.Toaster = Toaster;
+exports.toast = toast;
+exports.useToast = useToast;
+//# sourceMappingURL=chunk-AU5NTBK3.js.map
+//# sourceMappingURL=chunk-AU5NTBK3.js.map

package/dist/chunk-AU5NTBK3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toast/Toaster.tsx","../src/toast/ToastProvider.tsx","../src/toast/toast.tsx","../src/toast/useToast.tsx"],"names":["jsxs","Fragment","jsx","Sonner","React","cn","X","sonnerToast","Check","Error","Info","Warning"],"mappings":"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","file":"chunk-AU5NTBK3.js","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-DJHGCJR4.mjs

@@ -0,0 +1,224 @@
+import { cva, cn } from '@exem-ui/core/utils';
+import { forwardRef, cloneElement } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+// src/button/Button.tsx
+var colorStyles = {
+  accent: {
+    contained: {
+      button: "bg-solid-accent-default hover:bg-solid-accent-hovered disabled:bg-solid-accent-disabled",
+      icon: "text-icon-static-light group-disabled/button:text-icon-inverse-disabled",
+      text: "text-text-static-light group-disabled/button:text-text-inverse-disabled"
+    },
+    outlined: {
+      button: "border border-border-accent hover:bg-elevation-accent disabled:border-border-accent-disabled",
+      icon: "text-text-accent group-disabled/button:text-text-accent-disabled",
+      text: "text-text-accent group-disabled/button:text-text-accent-disabled"
+    },
+    invisible: {
+      button: "hover:bg-elevation-accent",
+      icon: "text-text-accent group-disabled/button:text-text-accent-disabled",
+      text: "text-text-accent group-disabled/button:text-text-accent-disabled"
+    }
+  },
+  assistive: {
+    contained: {
+      button: "bg-elevation-elevation-2 hover:bg-elevation-elevation-3 disabled:bg-elevation-elevation-2",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    }
+  },
+  critical: {
+    contained: {
+      button: "bg-solid-critical-default hover:bg-solid-critical-hovered disabled:bg-solid-critical-disabled",
+      icon: "text-icon-static-light group-disabled/button:text-icon-inverse-disabled",
+      text: "text-text-static-light group-disabled/button:text-text-inverse-disabled"
+    },
+    outlined: {
+      button: "border border-border-critical hover:bg-elevation-critical disabled:border-border-critical-disabled",
+      icon: "text-text-critical group-disabled/button:text-text-critical-disabled",
+      text: "text-text-critical group-disabled/button:text-text-critical-disabled"
+    },
+    invisible: {
+      button: "hover:bg-elevation-critical",
+      icon: "text-text-critical group-disabled/button:text-text-critical-disabled",
+      text: "text-text-critical group-disabled/button:text-text-critical-disabled"
+    }
+  },
+  inverse: {
+    contained: {
+      button: "bg-elevation-elevation-0 hover:bg-elevation-elevation-2 disabled:bg-elevation-elevation-2",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    }
+  },
+  primary: {
+    contained: {
+      button: "bg-solid-primary-default hover:bg-solid-primary-hovered disabled:bg-solid-primary-disabled",
+      icon: "text-icon-inverse group-disabled/button:text-icon-inverse",
+      text: "text-text-inverse group-disabled/button:text-text-inverse"
+    },
+    outlined: {
+      button: "border border-border-secondary hover:bg-elevation-elevation-2 disabled:border-border-secondary",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    },
+    invisible: {
+      button: "hover:bg-elevation-elevation-2",
+      icon: "text-icon-secondary group-disabled/button:text-icon-disabled",
+      text: "text-text-secondary group-disabled/button:text-text-disabled"
+    }
+  }
+};
+var buttonVariants = cva(
+  "inline-flex w-fit shrink-0 cursor-pointer flex-row items-center justify-center rounded-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:cursor-not-allowed",
+  {
+    compoundVariants: [
+      // Primary 색상 조합
+      {
+        className: colorStyles.primary.contained.button,
+        color: "primary",
+        variant: "contained"
+      },
+      {
+        className: colorStyles.primary.outlined.button,
+        color: "primary",
+        variant: "outlined"
+      },
+      {
+        className: colorStyles.primary.invisible.button,
+        color: "primary",
+        variant: "invisible"
+      },
+      // Accent 색상 조합
+      {
+        className: colorStyles.accent.contained.button,
+        color: "accent",
+        variant: "contained"
+      },
+      {
+        className: colorStyles.accent.outlined.button,
+        color: "accent",
+        variant: "outlined"
+      },
+      {
+        className: colorStyles.accent.invisible.button,
+        color: "accent",
+        variant: "invisible"
+      },
+      // Critical 색상 조합
+      {
+        className: colorStyles.critical.contained.button,
+        color: "critical",
+        variant: "contained"
+      },
+      {
+        className: colorStyles.critical.outlined.button,
+        color: "critical",
+        variant: "outlined"
+      },
+      {
+        className: colorStyles.critical.invisible.button,
+        color: "critical",
+        variant: "invisible"
+      },
+      // Assistive 색상 조합 (contained만 지원)
+      {
+        className: colorStyles.assistive.contained.button,
+        color: "assistive",
+        variant: "contained"
+      },
+      // Inverse 색상 조합 (contained만 지원)
+      {
+        className: colorStyles.inverse.contained.button,
+        color: "inverse",
+        variant: "contained"
+      }
+    ],
+    defaultVariants: {
+      color: "primary",
+      size: "medium",
+      variant: "contained"
+    },
+    variants: {
+      color: {
+        accent: "",
+        assistive: "",
+        critical: "",
+        inverse: "",
+        primary: ""
+      },
+      size: {
+        xsmall: "h-6 gap-0 px-1 text-body-3 font-medium",
+        small: "h-7 gap-0.5 px-1.5 text-body-2 font-medium",
+        medium: "h-8 gap-0.5 px-2 text-body-2 font-medium",
+        large: "h-10 gap-1 px-2.5 text-body-1 font-medium",
+        xlarge: "h-12 gap-1 px-3 text-title-2 font-medium"
+      },
+      variant: {
+        contained: "",
+        outlined: "bg-transparent",
+        invisible: "bg-transparent"
+      }
+    }
+  }
+);
+var IconSize = {
+  xsmall: "h-4 w-4",
+  small: "h-4 w-4",
+  medium: "h-4 w-4",
+  large: "h-5 w-5",
+  xlarge: "h-6 w-6"
+};
+var Button = forwardRef(
+  ({
+    className,
+    variant = "contained",
+    color = "primary",
+    size = "medium",
+    icon,
+    children,
+    ...props
+  }, ref) => {
+    const validColorStyle = color === "assistive" || color === "inverse" ? colorStyles[color].contained : colorStyles[color][variant];
+    const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+      icon && cloneElement(icon, {
+        className: cn(
+          "shrink-0 [&>path]:fill-current",
+          validColorStyle.icon,
+          icon.props.className,
+          IconSize[size ?? "medium"]
+        )
+      }),
+      typeof children === "string" ? /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn("truncate", size === "xlarge" ? "px-1" : "px-0.5", validColorStyle.text),
+          children
+        }
+      ) : children
+    ] });
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: cn(
+          buttonVariants({
+            className,
+            color,
+            size,
+            variant
+          }),
+          "group/button"
+        ),
+        ref,
+        ...props,
+        children: content
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+export { Button };
+//# sourceMappingURL=chunk-DJHGCJR4.mjs.map
+//# sourceMappingURL=chunk-DJHGCJR4.mjs.map

package/dist/chunk-DJHGCJR4.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/button/Button.tsx"],"names":[],"mappings":"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","file":"chunk-DJHGCJR4.mjs","sourcesContent":["import { cn, cva, type VariantProps } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { cloneElement, forwardRef } from 'react';\n\ntype ButtonColorVariantCombination =\n  | { color?: 'primary'; variant?: 'contained' | 'outlined' | 'invisible' }\n  | { color?: 'accent'; variant?: 'contained' | 'outlined' | 'invisible' }\n  | { color?: 'critical'; variant?: 'contained' | 'outlined' | 'invisible' }\n  | { color?: 'assistive'; variant?: 'contained' }\n  | { color?: 'inverse'; variant?: 'contained' };\n\ntype ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> &\n  Omit<VariantProps<typeof buttonVariants>, 'variant' | 'color'> &\n  ButtonColorVariantCombination & {\n    size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';\n    icon?: React.ReactElement<{ className?: string }>;\n  };\n\ntype ButtonComponent = React.ForwardRefExoticComponent<\n  ButtonProps & React.RefAttributes<HTMLButtonElement>\n>;\n\nconst colorStyles = {\n  accent: {\n    contained: {\n      button:\n        'bg-solid-accent-default hover:bg-solid-accent-hovered disabled:bg-solid-accent-disabled',\n      icon: 'text-icon-static-light group-disabled/button:text-icon-inverse-disabled',\n      text: 'text-text-static-light group-disabled/button:text-text-inverse-disabled',\n    },\n    outlined: {\n      button:\n        'border border-border-accent hover:bg-elevation-accent disabled:border-border-accent-disabled',\n      icon: 'text-text-accent group-disabled/button:text-text-accent-disabled',\n      text: 'text-text-accent group-disabled/button:text-text-accent-disabled',\n    },\n    invisible: {\n      button: 'hover:bg-elevation-accent',\n      icon: 'text-text-accent group-disabled/button:text-text-accent-disabled',\n      text: 'text-text-accent group-disabled/button:text-text-accent-disabled',\n    },\n  },\n  assistive: {\n    contained: {\n      button:\n        'bg-elevation-elevation-2 hover:bg-elevation-elevation-3 disabled:bg-elevation-elevation-2',\n      icon: 'text-icon-secondary group-disabled/button:text-icon-disabled',\n      text: 'text-text-secondary group-disabled/button:text-text-disabled',\n    },\n  },\n  critical: {\n    contained: {\n      button:\n        'bg-solid-critical-default hover:bg-solid-critical-hovered disabled:bg-solid-critical-disabled',\n      icon: 'text-icon-static-light group-disabled/button:text-icon-inverse-disabled',\n      text: 'text-text-static-light group-disabled/button:text-text-inverse-disabled',\n    },\n    outlined: {\n      button:\n        'border border-border-critical hover:bg-elevation-critical disabled:border-border-critical-disabled',\n      icon: 'text-text-critical group-disabled/button:text-text-critical-disabled',\n      text: 'text-text-critical group-disabled/button:text-text-critical-disabled',\n    },\n    invisible: {\n      button: 'hover:bg-elevation-critical',\n      icon: 'text-text-critical group-disabled/button:text-text-critical-disabled',\n      text: 'text-text-critical group-disabled/button:text-text-critical-disabled',\n    },\n  },\n  inverse: {\n    contained: {\n      button:\n        'bg-elevation-elevation-0 hover:bg-elevation-elevation-2 disabled:bg-elevation-elevation-2',\n      icon: 'text-icon-secondary group-disabled/button:text-icon-disabled',\n      text: 'text-text-secondary group-disabled/button:text-text-disabled',\n    },\n  },\n  primary: {\n    contained: {\n      button:\n        'bg-solid-primary-default hover:bg-solid-primary-hovered disabled:bg-solid-primary-disabled',\n      icon: 'text-icon-inverse group-disabled/button:text-icon-inverse',\n      text: 'text-text-inverse group-disabled/button:text-text-inverse',\n    },\n    outlined: {\n      button:\n        'border border-border-secondary hover:bg-elevation-elevation-2 disabled:border-border-secondary',\n      icon: 'text-icon-secondary group-disabled/button:text-icon-disabled',\n      text: 'text-text-secondary group-disabled/button:text-text-disabled',\n    },\n    invisible: {\n      button: 'hover:bg-elevation-elevation-2',\n      icon: 'text-icon-secondary group-disabled/button:text-icon-disabled',\n      text: 'text-text-secondary group-disabled/button:text-text-disabled',\n    },\n  },\n};\n\nconst buttonVariants = cva(\n  'inline-flex w-fit shrink-0 cursor-pointer flex-row items-center justify-center rounded-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:cursor-not-allowed',\n  {\n    compoundVariants: [\n      // Primary 색상 조합\n      {\n        className: colorStyles.primary.contained.button,\n        color: 'primary',\n        variant: 'contained',\n      },\n      {\n        className: colorStyles.primary.outlined.button,\n        color: 'primary',\n        variant: 'outlined',\n      },\n      {\n        className: colorStyles.primary.invisible.button,\n        color: 'primary',\n        variant: 'invisible',\n      },\n      // Accent 색상 조합\n      {\n        className: colorStyles.accent.contained.button,\n        color: 'accent',\n        variant: 'contained',\n      },\n      {\n        className: colorStyles.accent.outlined.button,\n        color: 'accent',\n        variant: 'outlined',\n      },\n      {\n        className: colorStyles.accent.invisible.button,\n        color: 'accent',\n        variant: 'invisible',\n      },\n      // Critical 색상 조합\n      {\n        className: colorStyles.critical.contained.button,\n        color: 'critical',\n        variant: 'contained',\n      },\n      {\n        className: colorStyles.critical.outlined.button,\n        color: 'critical',\n        variant: 'outlined',\n      },\n      {\n        className: colorStyles.critical.invisible.button,\n        color: 'critical',\n        variant: 'invisible',\n      },\n      // Assistive 색상 조합 (contained만 지원)\n      {\n        className: colorStyles.assistive.contained.button,\n        color: 'assistive',\n        variant: 'contained',\n      },\n      // Inverse 색상 조합 (contained만 지원)\n      {\n        className: colorStyles.inverse.contained.button,\n        color: 'inverse',\n        variant: 'contained',\n      },\n    ],\n    defaultVariants: {\n      color: 'primary',\n      size: 'medium',\n      variant: 'contained',\n    },\n    variants: {\n      color: {\n        accent: '',\n        assistive: '',\n        critical: '',\n        inverse: '',\n        primary: '',\n      },\n      size: {\n        xsmall: 'h-6 gap-0 px-1 text-body-3 font-medium',\n        small: 'h-7 gap-0.5 px-1.5 text-body-2 font-medium',\n        medium: 'h-8 gap-0.5 px-2 text-body-2 font-medium',\n        large: 'h-10 gap-1 px-2.5 text-body-1 font-medium',\n        xlarge: 'h-12 gap-1 px-3 text-title-2 font-medium',\n      },\n      variant: {\n        contained: '',\n        outlined: 'bg-transparent',\n        invisible: 'bg-transparent',\n      },\n    },\n  },\n);\n\nconst IconSize = {\n  xsmall: 'h-4 w-4',\n  small: 'h-4 w-4',\n  medium: 'h-4 w-4',\n  large: 'h-5 w-5',\n  xlarge: 'h-6 w-6',\n};\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      variant = 'contained',\n      color = 'primary',\n      size = 'medium',\n      icon,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    // 현재 조합의 색상 스타일 가져오기 -> assistive/inverse는 contained만 지원\n    const validColorStyle =\n      color === 'assistive' || color === 'inverse'\n        ? colorStyles[color].contained\n        : colorStyles[color][variant];\n\n    const content = (\n      <>\n        {icon &&\n          cloneElement(icon, {\n            className: cn(\n              'shrink-0 [&>path]:fill-current',\n              validColorStyle.icon,\n              icon.props.className,\n              IconSize[size ?? 'medium'],\n            ),\n          })}\n        {typeof children === 'string' ? (\n          <span\n            className={cn('truncate', size === 'xlarge' ? 'px-1' : 'px-0.5', validColorStyle.text)}\n          >\n            {children}\n          </span>\n        ) : (\n          children\n        )}\n      </>\n    );\n\n    return (\n      <button\n        className={cn(\n          buttonVariants({\n            className,\n            color,\n            size,\n            variant,\n          }),\n          'group/button',\n        )}\n        ref={ref}\n        {...props}\n      >\n        {content}\n      </button>\n    );\n  },\n) as ButtonComponent;\n\nButton.displayName = 'Button';\n\nexport { Button };\nexport type { ButtonComponent, ButtonProps };\n"]}