@exem-ui/react 0.1.0

package/dist/chunk-XBDXTRK3.mjs

@@ -0,0 +1,102 @@
+import { cva, cn } from '@exem-ui/core/utils';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/loading/Loading.tsx
+var containerVariants = cva("inset-0 z-[49] flex items-center justify-center", {
+  variants: {
+    position: {
+      fixed: "fixed",
+      absolute: "absolute"
+    },
+    blockInteraction: {
+      true: "pointer-events-auto",
+      false: "pointer-events-none"
+    }
+  },
+  defaultVariants: {
+    position: "fixed",
+    blockInteraction: false
+  }
+});
+var overlayVariants = cva("absolute inset-0 transition-opacity duration-150", {
+  variants: {
+    visible: {
+      true: "opacity-100",
+      false: "opacity-0"
+    },
+    tone: {
+      // 대비감 높은 톤 설정 추후 디자인 시스템에서 추가 되어야함
+      auto: "bg-black/30 dark:bg-white/10",
+      dark: "bg-black/50",
+      light: "bg-white/70",
+      brand: "bg-primary/20"
+    }
+  },
+  defaultVariants: {
+    visible: true,
+    tone: "auto"
+  }
+});
+var spinnerVariants = cva(
+  "z-50 shrink-0 animate-spin rounded-full border-elevation-elevation-4 border-t-transparent",
+  {
+    variants: {
+      size: {
+        small: "size-6 border-2",
+        medium: "size-9 border-[3px]",
+        large: "size-12 border-4"
+      }
+    },
+    defaultVariants: {
+      size: "large"
+    }
+  }
+);
+var Loading = forwardRef(
+  ({
+    isLoading = true,
+    dim = true,
+    blockInteraction = false,
+    position = "fixed",
+    size = "medium",
+    containerClassName,
+    overlayClassName,
+    spinnerClassName,
+    className,
+    ...props
+  }, ref) => {
+    if (!isLoading) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "status",
+        "aria-busy": "true",
+        className: cn(
+          containerVariants({ position, blockInteraction }),
+          containerClassName,
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              "aria-hidden": "true",
+              className: cn(overlayVariants({ visible: dim }), overlayClassName)
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "relative z-50 flex size-full items-center justify-center", children: /* @__PURE__ */ jsx("div", { className: cn(spinnerVariants({ size }), spinnerClassName) }) })
+        ]
+      }
+    );
+  }
+);
+Loading.displayName = "Loading";
+
+export { Loading };
+//# sourceMappingURL=chunk-XBDXTRK3.mjs.map
+//# sourceMappingURL=chunk-XBDXTRK3.mjs.map

package/dist/chunk-XBDXTRK3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/loading/Loading.tsx"],"names":[],"mappings":";;;;;AAmCA,IAAM,iBAAA,GAAoB,IAAI,iDAAA,EAAmD;AAAA,EAC/E,QAAA,EAAU;AAAA,IACR,QAAA,EAAU;AAAA,MACR,KAAA,EAAO,OAAA;AAAA,MACP,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,gBAAA,EAAkB;AAAA,MAChB,IAAA,EAAM,qBAAA;AAAA,MACN,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,QAAA,EAAU,OAAA;AAAA,IACV,gBAAA,EAAkB;AAAA;AAEtB,CAAC,CAAA;AAED,IAAM,eAAA,GAAkB,IAAI,kDAAA,EAAoD;AAAA,EAC9E,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,IAAA,EAAM,aAAA;AAAA,MACN,KAAA,EAAO;AAAA,KACT;AAAA,IACA,IAAA,EAAM;AAAA;AAAA,MAEJ,IAAA,EAAM,8BAAA;AAAA,MACN,IAAA,EAAM,aAAA;AAAA,MACN,KAAA,EAAO,aAAA;AAAA,MACP,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS,IAAA;AAAA,IACT,IAAA,EAAM;AAAA;AAEV,CAAC,CAAA;AAED,IAAM,eAAA,GAAkB,GAAA;AAAA,EACtB,2FAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,KAAA,EAAO,iBAAA;AAAA,QACP,MAAA,EAAQ,qBAAA;AAAA,QACR,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM;AAAA;AACR;AAEJ,CAAA;AAkBA,IAAM,OAAA,GAAU,UAAA;AAAA,EACd,CACE;AAAA,IACE,SAAA,GAAY,IAAA;AAAA,IACZ,GAAA,GAAM,IAAA;AAAA,IACN,gBAAA,GAAmB,KAAA;AAAA,IACnB,QAAA,GAAW,OAAA;AAAA,IACX,IAAA,GAAO,QAAA;AAAA,IACP,kBAAA;AAAA,IACA,gBAAA;AAAA,IACA,gBAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,IAAI,CAAC,SAAA,EAAW;AACd,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAA,EAAK,QAAA;AAAA,QACL,WAAA,EAAU,MAAA;AAAA,QACV,SAAA,EAAW,EAAA;AAAA,UACT,iBAAA,CAAkB,EAAE,QAAA,EAAU,gBAAA,EAAkB,CAAA;AAAA,UAChD,kBAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAGJ,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAY,MAAA;AAAA,cACZ,SAAA,EAAW,GAAG,eAAA,CAAgB,EAAE,SAAS,GAAA,EAAK,GAAG,gBAAgB;AAAA;AAAA,WACnE;AAAA,0BAEA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0DAAA,EACb,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,eAAA,CAAgB,EAAE,IAAA,EAAM,CAAA,EAAG,gBAAgB,GAAG,CAAA,EACnE;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-XBDXTRK3.mjs","sourcesContent":["import { cn, cva, type VariantProps } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { forwardRef } from 'react';\n\ninterface LoadingProps\n  extends VariantProps<typeof containerVariants>,\n    VariantProps<typeof spinnerVariants>,\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  /**\n   * 로딩 표시 여부\n   * @default true\n   */\n  isLoading?: boolean;\n  /**\n   * 배경 딤 처리 여부\n   * @default true\n   */\n  dim?: boolean;\n  /**\n   * 로딩 중 하위 요소 인터랙션 차단 여부\n   * @default false\n   */\n  blockInteraction?: boolean;\n  /** 컨테이너 추가 클래스 */\n  containerClassName?: string;\n  /** 오버레이 추가 클래스 */\n  overlayClassName?: string;\n  /** 스피너 추가 클래스 */\n  spinnerClassName?: string;\n}\n\ntype LoadingComponent = React.ForwardRefExoticComponent<\n  LoadingProps & React.RefAttributes<HTMLDivElement>\n>;\n\nconst containerVariants = cva('inset-0 z-[49] flex items-center justify-center', {\n  variants: {\n    position: {\n      fixed: 'fixed',\n      absolute: 'absolute',\n    },\n    blockInteraction: {\n      true: 'pointer-events-auto',\n      false: 'pointer-events-none',\n    },\n  },\n  defaultVariants: {\n    position: 'fixed',\n    blockInteraction: false,\n  },\n});\n\nconst overlayVariants = cva('absolute inset-0 transition-opacity duration-150', {\n  variants: {\n    visible: {\n      true: 'opacity-100',\n      false: 'opacity-0',\n    },\n    tone: {\n      // 대비감 높은 톤 설정 추후 디자인 시스템에서 추가 되어야함\n      auto: 'bg-black/30 dark:bg-white/10',\n      dark: 'bg-black/50',\n      light: 'bg-white/70',\n      brand: 'bg-primary/20',\n    },\n  },\n  defaultVariants: {\n    visible: true,\n    tone: 'auto',\n  },\n});\n\nconst spinnerVariants = cva(\n  'z-50 shrink-0 animate-spin rounded-full border-elevation-elevation-4 border-t-transparent',\n  {\n    variants: {\n      size: {\n        small: 'size-6 border-2',\n        medium: 'size-9 border-[3px]',\n        large: 'size-12 border-4',\n      },\n    },\n    defaultVariants: {\n      size: 'large',\n    },\n  },\n);\n\n/**\n * 비동기 작업 중 로딩 상태를 표시하는 오버레이 컴포넌트입니다.\n *\n * @example\n * ```tsx\n * // 기본 사용 (전체 화면 고정)\n * <Loading isLoading />\n *\n * // 특정 영역 내 로딩 (absolute 위치)\n * <div style={{ position: 'relative' }}>\n *   <Loading isLoading position=\"absolute\" size=\"small\" />\n * </div>\n * ```\n *\n * @see {@link LoadingProps} props 상세\n */\nconst Loading = forwardRef<HTMLDivElement, LoadingProps>(\n  (\n    {\n      isLoading = true,\n      dim = true,\n      blockInteraction = false,\n      position = 'fixed',\n      size = 'medium',\n      containerClassName,\n      overlayClassName,\n      spinnerClassName,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    if (!isLoading) {\n      return null;\n    }\n\n    return (\n      <div\n        ref={ref}\n        role=\"status\"\n        aria-busy=\"true\"\n        className={cn(\n          containerVariants({ position, blockInteraction }),\n          containerClassName,\n          className,\n        )}\n        {...props}\n      >\n        {/* overlay 항상 존재 (dim 여부로만 표시) */}\n        <div\n          aria-hidden=\"true\"\n          className={cn(overlayVariants({ visible: dim }), overlayClassName)}\n        />\n        {/* 스피너 레이어 */}\n        <div className=\"relative z-50 flex size-full items-center justify-center\">\n          <div className={cn(spinnerVariants({ size }), spinnerClassName)} />\n        </div>\n      </div>\n    );\n  },\n) as LoadingComponent;\n\nLoading.displayName = 'Loading';\n\nexport { Loading };\nexport type { LoadingComponent, LoadingProps };\n"]}

package/dist/chunk-YGBEKZWU.mjs

@@ -0,0 +1,81 @@
+import { cn } from '@exem-ui/core/utils';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/star/Star.tsx
+var StarRoundedEmpty = (props) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 20 20",
+    width: "1em",
+    height: "1em",
+    "aria-hidden": "true",
+    ...props,
+    children: /* @__PURE__ */ jsx(
+      "path",
+      {
+        stroke: "#cfcfcf",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        d: "m10 14.773 4.275 2.628a.656.656 0 0 0 .978-.716l-1.162-4.905 3.804-3.282a.66.66 0 0 0-.374-1.154l-4.993-.407-1.923-4.656a.653.653 0 0 0-1.21 0L7.473 6.937l-4.993.407a.661.661 0 0 0-.374 1.158l3.805 3.281-1.163 4.902a.656.656 0 0 0 .978.716z"
+      }
+    )
+  }
+);
+var StarRoundedFilled = (props) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 20 20",
+    width: "1em",
+    height: "1em",
+    "aria-hidden": "true",
+    ...props,
+    children: /* @__PURE__ */ jsx(
+      "path",
+      {
+        fill: "#FE9A00",
+        d: "m18.304 8.973-3.516 3.033 1.071 4.537a1.281 1.281 0 0 1-1.914 1.392L10 15.507l-3.948 2.428a1.28 1.28 0 0 1-1.911-1.392l1.075-4.537L1.7 8.973a1.286 1.286 0 0 1 .728-2.254l4.61-.372 1.778-4.303a1.278 1.278 0 0 1 2.364 0l1.778 4.303 4.61.372a1.286 1.286 0 0 1 .731 2.255z"
+      }
+    )
+  }
+);
+var Star = forwardRef(
+  ({ size = "medium", selected = false, className, onClick, ...props }, ref) => {
+    const sizeConfig = {
+      small: { width: 16, height: 16 },
+      medium: { width: 20, height: 20 },
+      large: { width: 24, height: 24 }
+    };
+    const config = sizeConfig[size];
+    return selected ? /* @__PURE__ */ jsx(
+      StarRoundedFilled,
+      {
+        ref,
+        width: config.width,
+        height: config.height,
+        className: cn("cursor-pointer transition-colors", className),
+        onClick,
+        ...props
+      }
+    ) : /* @__PURE__ */ jsx(
+      StarRoundedEmpty,
+      {
+        ref,
+        width: config.width,
+        height: config.height,
+        className: cn("cursor-pointer transition-colors", className),
+        onClick,
+        ...props
+      }
+    );
+  }
+);
+Star.displayName = "Star";
+
+export { Star };
+//# sourceMappingURL=chunk-YGBEKZWU.mjs.map
+//# sourceMappingURL=chunk-YGBEKZWU.mjs.map

package/dist/chunk-YGBEKZWU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/star/Star.tsx"],"names":[],"mappings":";;;;;AAuBA,IAAM,gBAAA,GAAmB,CAAC,KAAA,qBACxB,GAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,KAAA,EAAM,4BAAA;AAAA,IACN,IAAA,EAAK,MAAA;AAAA,IACL,OAAA,EAAQ,WAAA;AAAA,IACR,KAAA,EAAM,KAAA;AAAA,IACN,MAAA,EAAO,KAAA;AAAA,IACP,aAAA,EAAY,MAAA;AAAA,IACX,GAAG,KAAA;AAAA,IAEJ,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAO,SAAA;AAAA,QACP,aAAA,EAAc,OAAA;AAAA,QACd,cAAA,EAAe,OAAA;AAAA,QACf,CAAA,EAAE;AAAA;AAAA;AACJ;AACF,CAAA;AAGF,IAAM,iBAAA,GAAoB,CAAC,KAAA,qBACzB,GAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,KAAA,EAAM,4BAAA;AAAA,IACN,IAAA,EAAK,MAAA;AAAA,IACL,OAAA,EAAQ,WAAA;AAAA,IACR,KAAA,EAAM,KAAA;AAAA,IACN,MAAA,EAAO,KAAA;AAAA,IACP,aAAA,EAAY,MAAA;AAAA,IACX,GAAG,KAAA;AAAA,IAEJ,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,SAAA;AAAA,QACL,CAAA,EAAE;AAAA;AAAA;AACJ;AACF,CAAA;AAaF,IAAM,IAAA,GAAO,UAAA;AAAA,EACX,CAAC,EAAE,IAAA,GAAO,QAAA,EAAU,QAAA,GAAW,KAAA,EAAO,SAAA,EAAW,OAAA,EAAS,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC5E,IAAA,MAAM,UAAA,GAAa;AAAA,MACjB,KAAA,EAAO,EAAE,KAAA,EAAO,EAAA,EAAI,QAAQ,EAAA,EAAG;AAAA,MAC/B,MAAA,EAAQ,EAAE,KAAA,EAAO,EAAA,EAAI,QAAQ,EAAA,EAAG;AAAA,MAChC,KAAA,EAAO,EAAE,KAAA,EAAO,EAAA,EAAI,QAAQ,EAAA;AAAG,KACjC;AACA,IAAA,MAAM,MAAA,GAAS,WAAW,IAAI,CAAA;AAE9B,IAAA,OAAO,QAAA,mBACL,GAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,OAAO,MAAA,CAAO,KAAA;AAAA,QACd,QAAQ,MAAA,CAAO,MAAA;AAAA,QACf,SAAA,EAAW,EAAA,CAAG,kCAAA,EAAoC,SAAS,CAAA;AAAA,QAC3D,OAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN,mBAEA,GAAA;AAAA,MAAC,gBAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,OAAO,MAAA,CAAO,KAAA;AAAA,QACd,QAAQ,MAAA,CAAO,MAAA;AAAA,QACf,SAAA,EAAW,EAAA,CAAG,kCAAA,EAAoC,SAAS,CAAA;AAAA,QAC3D,OAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA","file":"chunk-YGBEKZWU.mjs","sourcesContent":["import { cn } from '@exem-ui/core/utils';\nimport type React from 'react';\nimport { forwardRef, type SVGProps } from 'react';\n\ninterface StarProps extends React.SVGProps<SVGSVGElement> {\n  /**\n   * 별 아이콘 크기\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * 선택(채워짐) 상태 여부\n   * @default false\n   */\n  selected?: boolean;\n  /** 클릭 이벤트 핸들러 */\n  onClick?: (event: React.MouseEvent<SVGSVGElement>) => void;\n}\n\ntype StarComponent = React.ForwardRefExoticComponent<\n  Omit<StarProps, 'ref'> & React.RefAttributes<SVGSVGElement>\n>;\n\nconst StarRoundedEmpty = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    viewBox=\"0 0 20 20\"\n    width=\"1em\"\n    height=\"1em\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path\n      stroke=\"#cfcfcf\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      d=\"m10 14.773 4.275 2.628a.656.656 0 0 0 .978-.716l-1.162-4.905 3.804-3.282a.66.66 0 0 0-.374-1.154l-4.993-.407-1.923-4.656a.653.653 0 0 0-1.21 0L7.473 6.937l-4.993.407a.661.661 0 0 0-.374 1.158l3.805 3.281-1.163 4.902a.656.656 0 0 0 .978.716z\"\n    />\n  </svg>\n);\n\nconst StarRoundedFilled = (props: SVGProps<SVGSVGElement>) => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    viewBox=\"0 0 20 20\"\n    width=\"1em\"\n    height=\"1em\"\n    aria-hidden=\"true\"\n    {...props}\n  >\n    <path\n      fill=\"#FE9A00\"\n      d=\"m18.304 8.973-3.516 3.033 1.071 4.537a1.281 1.281 0 0 1-1.914 1.392L10 15.507l-3.948 2.428a1.28 1.28 0 0 1-1.911-1.392l1.075-4.537L1.7 8.973a1.286 1.286 0 0 1 .728-2.254l4.61-.372 1.778-4.303a1.278 1.278 0 0 1 2.364 0l1.778 4.303 4.61.372a1.286 1.286 0 0 1 .731 2.255z\"\n    />\n  </svg>\n);\n\n/**\n * 별점 평가에 사용되는 Star 아이콘 컴포넌트입니다.\n *\n * @example\n * ```tsx\n * <Star selected size=\"medium\" onClick={() => console.log('clicked')} />\n * ```\n *\n * @see {@link StarProps} props 상세\n */\nconst Star = forwardRef<SVGSVGElement, StarProps>(\n  ({ size = 'medium', selected = false, className, onClick, ...props }, ref) => {\n    const sizeConfig = {\n      small: { width: 16, height: 16 },\n      medium: { width: 20, height: 20 },\n      large: { width: 24, height: 24 },\n    };\n    const config = sizeConfig[size];\n\n    return selected ? (\n      <StarRoundedFilled\n        ref={ref}\n        width={config.width}\n        height={config.height}\n        className={cn('cursor-pointer transition-colors', className)}\n        onClick={onClick}\n        {...props}\n      />\n    ) : (\n      <StarRoundedEmpty\n        ref={ref}\n        width={config.width}\n        height={config.height}\n        className={cn('cursor-pointer transition-colors', className)}\n        onClick={onClick}\n        {...props}\n      />\n    );\n  },\n) as StarComponent;\n\nStar.displayName = 'Star';\n\nexport { Star };\nexport type { StarComponent, StarProps };\n"]}

package/dist/chunk-YVFLRPFV.mjs

@@ -0,0 +1,72 @@
+import { cva, cn } from '@exem-ui/core/utils';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/tooltip/Tooltip.tsx
+var tooltipContentVariants = cva(
+  [
+    // Base layout
+    "z-50 flex flex-col items-start overflow-hidden",
+    "rounded-medium",
+    "text-text-static-light",
+    "bg-component-tooltip border border-border-primary",
+    "shadow-medium",
+    "animate-in fade-in-0 zoom-in-95",
+    "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+    "data-[side=bottom]:slide-in-from-top-2",
+    "data-[side=left]:slide-in-from-right-2",
+    "data-[side=right]:slide-in-from-left-2",
+    "data-[side=top]:slide-in-from-bottom-2"
+  ],
+  {
+    variants: {
+      size: {
+        tiny: "px-2 py-1 text-body-3",
+        small: "w-[160px] gap-[8px] px-[12px] py-[10px]",
+        medium: "w-[240px] gap-[8px] px-[12px] py-[10px]",
+        large: "w-[320px] gap-[8px] px-[12px] py-[10px]",
+        xlarge: "w-[400px] gap-[8px] px-[12px] py-[10px]"
+      }
+    },
+    defaultVariants: { size: "small" }
+  }
+);
+var tooltipTitleVariants = cva([
+  "text-body-1 font-semibold text-text-static-light",
+  "group-data-[size=tiny]/tooltip-content:text-body-3"
+]);
+var tooltipTextVariants = cva([
+  "text-body-2 font-regular text-text-static-light",
+  "group-data-[size=tiny]/tooltip-content:text-body-3"
+]);
+var Tooltip = TooltipPrimitive.Root;
+Tooltip.Provider = TooltipPrimitive.Provider;
+Tooltip.Trigger = TooltipPrimitive.Trigger;
+Tooltip.Content = forwardRef(({ className, sideOffset = 4, size, children, portalContainer, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    "data-size": size,
+    className: cn("group/tooltip-content", tooltipContentVariants({ size }), className),
+    ...props,
+    children
+  }
+) }));
+Tooltip.Title = forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(tooltipTitleVariants(), className), ...props, children })
+);
+Tooltip.Description = forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn(tooltipTextVariants(), className), ...props, children })
+);
+Tooltip.displayName = "Tooltip";
+Tooltip.Content.displayName = "Tooltip.Content";
+Tooltip.Title.displayName = "Tooltip.Title";
+Tooltip.Description.displayName = "Tooltip.Description";
+Tooltip.Trigger.displayName = "Tooltip.Trigger";
+Tooltip.Provider.displayName = "Tooltip.Provider";
+
+export { Tooltip };
+//# sourceMappingURL=chunk-YVFLRPFV.mjs.map
+//# sourceMappingURL=chunk-YVFLRPFV.mjs.map

package/dist/chunk-YVFLRPFV.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tooltip/Tooltip.tsx"],"names":[],"mappings":";;;;;;AAgCA,IAAM,sBAAA,GAAyB,GAAA;AAAA,EAC7B;AAAA;AAAA,IAEE,gDAAA;AAAA,IACA,gBAAA;AAAA,IACA,wBAAA;AAAA,IACA,mDAAA;AAAA,IACA,eAAA;AAAA,IACA,iCAAA;AAAA,IACA,gGAAA;AAAA,IACA,wCAAA;AAAA,IACA,wCAAA;AAAA,IACA,wCAAA;AAAA,IACA;AAAA,GACF;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,IAAA,EAAM,uBAAA;AAAA,QACN,KAAA,EAAO,yCAAA;AAAA,QACP,MAAA,EAAQ,yCAAA;AAAA,QACR,KAAA,EAAO,yCAAA;AAAA,QACP,MAAA,EAAQ;AAAA;AACV,KACF;AAAA,IACA,eAAA,EAAiB,EAAE,IAAA,EAAM,OAAA;AAAQ;AAErC,CAAA;AAEA,IAAM,uBAAuB,GAAA,CAAI;AAAA,EAC/B,kDAAA;AAAA,EACA;AACF,CAAC,CAAA;AAED,IAAM,sBAAsB,GAAA,CAAI;AAAA,EAC9B,iDAAA;AAAA,EACA;AACF,CAAC,CAAA;AAED,IAAM,OAAA,GAA2B,gBAAA,CAAA;AAEjC,OAAA,CAAQ,QAAA,GAA4B,gBAAA,CAAA,QAAA;AAEpC,OAAA,CAAQ,OAAA,GAA2B,gBAAA,CAAA,OAAA;AAEnC,OAAA,CAAQ,UAAU,UAAA,CAGhB,CAAC,EAAE,SAAA,EAAW,UAAA,GAAa,GAAG,IAAA,EAAM,QAAA,EAAU,eAAA,EAAiB,GAAG,OAAM,EAAG,GAAA,yBACzD,gBAAA,CAAA,MAAA,EAAjB,EAAwB,WAAW,eAAA,EAClC,QAAA,kBAAA,GAAA;AAAA,EAAkB,gBAAA,CAAA,OAAA;AAAA,EAAjB;AAAA,IACC,GAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA,EAAW,IAAA;AAAA,IACX,SAAA,EAAW,GAAG,uBAAA,EAAyB,sBAAA,CAAuB,EAAE,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,IACjF,GAAG,KAAA;AAAA,IAEH;AAAA;AACH,CAAA,EACF,CACD,CAAA;AAED,OAAA,CAAQ,KAAA,GAAQ,UAAA;AAAA,EACd,CAAC,EAAE,SAAA,EAAW,UAAU,GAAG,KAAA,IAAS,GAAA,qBAClC,GAAA,CAAC,SAAI,GAAA,EAAU,SAAA,EAAW,GAAG,oBAAA,EAAqB,EAAG,SAAS,CAAA,EAAI,GAAG,OAClE,QAAA,EACH;AAEJ,CAAA;AAEA,OAAA,CAAQ,WAAA,GAAc,UAAA;AAAA,EACpB,CAAC,EAAE,SAAA,EAAW,UAAU,GAAG,KAAA,IAAS,GAAA,qBAClC,GAAA,CAAC,SAAI,GAAA,EAAU,SAAA,EAAW,GAAG,mBAAA,EAAoB,EAAG,SAAS,CAAA,EAAI,GAAG,OACjE,QAAA,EACH;AAEJ,CAAA;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA;AACtB,OAAA,CAAQ,QAAQ,WAAA,GAAc,iBAAA;AAC9B,OAAA,CAAQ,MAAM,WAAA,GAAc,eAAA;AAC5B,OAAA,CAAQ,YAAY,WAAA,GAAc,qBAAA;AAClC,OAAA,CAAQ,QAAQ,WAAA,GAAc,iBAAA;AAC9B,OAAA,CAAQ,SAAS,WAAA,GAAc,kBAAA","file":"chunk-YVFLRPFV.mjs","sourcesContent":["import { cn, cva, type VariantProps } from '@exem-ui/core/utils';\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip';\nimport type React from 'react';\nimport { forwardRef } from 'react';\n\ntype TooltipRootProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Root>;\n\ntype TooltipProviderProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Provider>;\n\ntype TooltipTriggerProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Trigger>;\n\ntype TooltipContentProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> &\n  VariantProps<typeof tooltipContentVariants> & {\n    portalContainer?: HTMLElement | null;\n  };\n\ntype TooltipTitleProps = React.HTMLAttributes<HTMLDivElement>;\n\ntype TooltipDescriptionProps = React.HTMLAttributes<HTMLDivElement>;\n\ntype TooltipComponent = typeof TooltipPrimitive.Root & {\n  Provider: typeof TooltipPrimitive.Provider;\n  Trigger: typeof TooltipPrimitive.Trigger;\n  Content: React.ForwardRefExoticComponent<\n    TooltipContentProps & React.RefAttributes<React.ElementRef<typeof TooltipPrimitive.Content>>\n  >;\n  Title: React.ForwardRefExoticComponent<TooltipTitleProps & React.RefAttributes<HTMLDivElement>>;\n  Description: React.ForwardRefExoticComponent<\n    TooltipDescriptionProps & React.RefAttributes<HTMLDivElement>\n  >;\n};\n\nconst tooltipContentVariants = cva(\n  [\n    // Base layout\n    'z-50 flex flex-col items-start overflow-hidden',\n    'rounded-medium',\n    'text-text-static-light',\n    'bg-component-tooltip border border-border-primary',\n    'shadow-medium',\n    'animate-in fade-in-0 zoom-in-95',\n    'data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95',\n    'data-[side=bottom]:slide-in-from-top-2',\n    'data-[side=left]:slide-in-from-right-2',\n    'data-[side=right]:slide-in-from-left-2',\n    'data-[side=top]:slide-in-from-bottom-2',\n  ],\n  {\n    variants: {\n      size: {\n        tiny: 'px-2 py-1 text-body-3',\n        small: 'w-[160px] gap-[8px] px-[12px] py-[10px]',\n        medium: 'w-[240px] gap-[8px] px-[12px] py-[10px]',\n        large: 'w-[320px] gap-[8px] px-[12px] py-[10px]',\n        xlarge: 'w-[400px] gap-[8px] px-[12px] py-[10px]',\n      },\n    },\n    defaultVariants: { size: 'small' },\n  },\n);\n\nconst tooltipTitleVariants = cva([\n  'text-body-1 font-semibold text-text-static-light',\n  'group-data-[size=tiny]/tooltip-content:text-body-3',\n]);\n\nconst tooltipTextVariants = cva([\n  'text-body-2 font-regular text-text-static-light',\n  'group-data-[size=tiny]/tooltip-content:text-body-3',\n]);\n\nconst Tooltip = TooltipPrimitive.Root as TooltipComponent;\n\nTooltip.Provider = TooltipPrimitive.Provider;\n\nTooltip.Trigger = TooltipPrimitive.Trigger;\n\nTooltip.Content = forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  TooltipContentProps\n>(({ className, sideOffset = 4, size, children, portalContainer, ...props }, ref) => (\n  <TooltipPrimitive.Portal container={portalContainer}>\n    <TooltipPrimitive.Content\n      ref={ref}\n      sideOffset={sideOffset}\n      data-size={size}\n      className={cn('group/tooltip-content', tooltipContentVariants({ size }), className)}\n      {...props}\n    >\n      {children}\n    </TooltipPrimitive.Content>\n  </TooltipPrimitive.Portal>\n)) as TooltipComponent['Content'];\n\nTooltip.Title = forwardRef<HTMLDivElement, TooltipTitleProps>(\n  ({ className, children, ...props }, ref) => (\n    <div ref={ref} className={cn(tooltipTitleVariants(), className)} {...props}>\n      {children}\n    </div>\n  ),\n) as TooltipComponent['Title'];\n\nTooltip.Description = forwardRef<HTMLDivElement, TooltipDescriptionProps>(\n  ({ className, children, ...props }, ref) => (\n    <div ref={ref} className={cn(tooltipTextVariants(), className)} {...props}>\n      {children}\n    </div>\n  ),\n) as TooltipComponent['Description'];\n\nTooltip.displayName = 'Tooltip';\nTooltip.Content.displayName = 'Tooltip.Content';\nTooltip.Title.displayName = 'Tooltip.Title';\nTooltip.Description.displayName = 'Tooltip.Description';\nTooltip.Trigger.displayName = 'Tooltip.Trigger';\nTooltip.Provider.displayName = 'Tooltip.Provider';\n\nexport { Tooltip };\nexport type {\n  TooltipComponent,\n  TooltipContentProps,\n  TooltipDescriptionProps,\n  TooltipProviderProps,\n  TooltipRootProps,\n  TooltipTitleProps,\n  TooltipTriggerProps,\n};\n"]}

package/dist/chunk-ZMVBIQ2Z.mjs

@@ -0,0 +1,253 @@
+import { ScrollArea } from './chunk-TEHHJ3CS.mjs';
+import { Button } from './chunk-DJHGCJR4.mjs';
+import { X } from './chunk-LZWKMQJL.mjs';
+import { cn } from '@exem-ui/core/utils';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { createContext, forwardRef, useContext } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var MODAL_PADDING = {
+  body: "px-4 pb-4",
+  footer: "px-4 py-3"
+};
+var ModalContext = createContext({ size: "medium" });
+var Modal = DialogPrimitive.Root;
+Modal.Trigger = DialogPrimitive.Trigger;
+Modal.Portal = DialogPrimitive.Portal;
+Modal.Close = forwardRef(({ size, ...props }, ref) => {
+  const { size: modalSize } = useContext(ModalContext);
+  return /* @__PURE__ */ jsx(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx(
+    Button,
+    {
+      ...props,
+      ref,
+      color: "assistive",
+      variant: "contained",
+      size: size ?? (modalSize === "fullsize" ? "large" : "medium")
+    }
+  ) });
+});
+Modal.Overlay = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    DialogPrimitive.Overlay,
+    {
+      ref,
+      className: cn(
+        "fixed inset-0 z-50 bg-component-dim data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Modal.Content = forwardRef(
+  ({ className, children, size = "medium", onInteractOutside, onFocusOutside, ...props }, ref) => {
+    const isFullSize = size === "fullsize";
+    const sizeWidthMap = {
+      small: "max-w-[640px]",
+      medium: "max-w-[800px]",
+      large: "max-w-[960px]",
+      xlarge: "max-w-[1120px]"
+    };
+    const shouldPreventDismissForSelect = (target) => {
+      const isSelectOpen = Boolean(
+        document.querySelector('[data-radix-select-content][data-state="open"]')
+      );
+      if (isSelectOpen) {
+        return true;
+      }
+      if (!(target instanceof Element)) {
+        return false;
+      }
+      return Boolean(
+        target.closest("[data-radix-select-content]") || target.closest("[data-radix-select-viewport]")
+      );
+    };
+    const handleInteractOutside = (event) => {
+      if (shouldPreventDismissForSelect(event.target)) {
+        event.preventDefault();
+      }
+      onInteractOutside?.(event);
+    };
+    return /* @__PURE__ */ jsx(ModalContext.Provider, { value: { size }, children: /* @__PURE__ */ jsxs(Modal.Portal, { children: [
+      /* @__PURE__ */ jsx(Modal.Overlay, {}),
+      /* @__PURE__ */ jsx(
+        DialogPrimitive.Content,
+        {
+          ref,
+          className: cn(
+            // 공통 스타일
+            "fixed z-50 flex flex-col rounded-strong border border-border-primary bg-elevation-elevation-0 duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+            // fullsize일 때
+            isFullSize ? "inset-0 m-10" : (
+              // 일반 모달일 때
+              cn(
+                "left-[50%] top-[50%] w-full max-h-[90vh] translate-x-[-50%] translate-y-[-50%] shadow-strong data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
+                sizeWidthMap[size]
+              )
+            ),
+            className
+          ),
+          ...props,
+          onInteractOutside: handleInteractOutside,
+          children
+        }
+      )
+    ] }) });
+  }
+);
+Modal.Header = forwardRef(
+  ({ className, line = false, showCloseIcon = true, children, ...props }, ref) => {
+    const { size } = useContext(ModalContext);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex shrink-0 flex-row items-center gap-2 pl-4 pr-3",
+          line && "border-b border-border-primary",
+          size === "fullsize" ? "h-16" : "h-14",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-row items-center gap-1", children }),
+          showCloseIcon && /* @__PURE__ */ jsx(
+            DialogPrimitive.Close,
+            {
+              className: cn(
+                "flex shrink-0 items-center justify-center size-8 rounded-medium text-icon-secondary transition-colors hover:bg-elevation-elevation-2 focus:outline-none disabled:pointer-events-none"
+              ),
+              children: /* @__PURE__ */ jsx(X, { type: "regular", size: 20 })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+Modal.Body = forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex-1 flex flex-col min-h-0 h-full",
+        "[&_[data-slot=scroll-area-viewport]>div]:h-full"
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full flex flex-col", children: /* @__PURE__ */ jsx("div", { className: cn(MODAL_PADDING.body, className), children }) })
+    }
+  )
+);
+Modal.Footer = forwardRef(
+  ({ className, line = true, ...props }, ref) => {
+    const { size } = useContext(ModalContext);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex flex-row items-center justify-between",
+          line && "border-t border-border-primary",
+          size === "fullsize" ? "gap-3" : "h-14 gap-3",
+          MODAL_PADDING.footer,
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Modal.FooterDescription = forwardRef(
+  ({ className, error = false, icon, children, ...props }, ref) => {
+    const { size } = useContext(ModalContext);
+    const isLargeFooter = size === "fullsize";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "flex flex-row items-center gap-1",
+          isLargeFooter ? "text-body-2" : "text-body-3",
+          error ? "text-text-critical" : "text-text-tertiary",
+          className
+        ),
+        ...props,
+        children: [
+          icon && /* @__PURE__ */ jsx("span", { className: "flex shrink-0 size-4 items-center justify-center [&>svg]:size-4", children: icon }),
+          children
+        ]
+      }
+    );
+  }
+);
+Modal.Actions = forwardRef(({ className, ...props }, ref) => {
+  const { size } = useContext(ModalContext);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "ml-auto flex flex-row items-center",
+        size === "fullsize" ? "gap-3" : "gap-2",
+        className
+      ),
+      ...props
+    }
+  );
+});
+Modal.Action = forwardRef(
+  ({ color = "primary", size, ...props }, ref) => {
+    const { size: modalSize } = useContext(ModalContext);
+    return /* @__PURE__ */ jsx(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        ...props,
+        ref,
+        color,
+        variant: "contained",
+        size: size ?? (modalSize === "fullsize" ? "large" : "medium")
+      }
+    ) });
+  }
+);
+Modal.Title = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    DialogPrimitive.Title,
+    {
+      ref,
+      className: cn(
+        "text-title-2 font-semibold leading-none tracking-tight text-text-primary",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Modal.Description = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Description,
+  {
+    ref,
+    className: cn("text-body-2 text-text-tertiary", className),
+    ...props
+  }
+));
+Modal.displayName = "Modal";
+Modal.Trigger.displayName = "Modal.Trigger";
+Modal.Portal.displayName = "Modal.Portal";
+Modal.Close.displayName = "Modal.Close";
+Modal.Overlay.displayName = "Modal.Overlay";
+Modal.Content.displayName = "Modal.Content";
+Modal.Header.displayName = "Modal.Header";
+Modal.Body.displayName = "Modal.Body";
+Modal.Footer.displayName = "Modal.Footer";
+Modal.FooterDescription.displayName = "Modal.FooterDescription";
+Modal.Actions.displayName = "Modal.Actions";
+Modal.Action.displayName = "Modal.Action";
+Modal.Title.displayName = "Modal.Title";
+Modal.Description.displayName = "Modal.Description";
+
+export { Modal };
+//# sourceMappingURL=chunk-ZMVBIQ2Z.mjs.map
+//# sourceMappingURL=chunk-ZMVBIQ2Z.mjs.map

package/dist/chunk-ZMVBIQ2Z.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/modal/Modal.tsx"],"names":[],"mappings":"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","file":"chunk-ZMVBIQ2Z.mjs","sourcesContent":["import { cn } from '@exem-ui/core/utils';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport type React from 'react';\nimport { createContext, forwardRef, useContext } from 'react';\nimport type { ButtonProps } from '../button/Button';\nimport { Button } from '../button/Button';\nimport { XIcon } from '../icon';\nimport { ScrollArea } from '../scrollArea/ScrollArea';\n\ntype ModalSize = 'small' | 'medium' | 'large' | 'xlarge' | 'fullsize';\n\ntype ModalRootProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\n\ntype ModalTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\n\ntype ModalPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\n\ntype ModalOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\n\ntype ModalContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n  /**\n   * 모달 크기\n   * @default 'medium'\n   */\n  size?: ModalSize;\n};\n\ntype DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ntype InteractOutsideEvent = Parameters<NonNullable<DialogContentProps['onInteractOutside']>>[0];\n\ntype ModalCloseProps = Omit<ButtonProps, 'color' | 'variant'>;\n\ntype ModalHeaderProps = React.HTMLAttributes<HTMLDivElement> & {\n  /**\n   * 하단 구분선 표시 여부\n   * @default false\n   */\n  line?: boolean;\n  /**\n   * 닫기 아이콘 표시 여부\n   * @default true\n   */\n  showCloseIcon?: boolean;\n};\n\ntype ModalBodyProps = React.HTMLAttributes<HTMLDivElement>;\n\ntype ModalFooterProps = React.HTMLAttributes<HTMLDivElement> & {\n  /**\n   * 상단 구분선 표시 여부\n   * @default true\n   */\n  line?: boolean;\n};\n\ntype ModalFooterDescriptionProps = React.HTMLAttributes<HTMLDivElement> & {\n  /** 에러 상태 표시 여부 */\n  error?: boolean;\n  /** 설명 앞에 표시할 아이콘 요소 */\n  icon?: React.ReactNode;\n};\n\ntype ModalActionsProps = React.HTMLAttributes<HTMLDivElement>;\n\ntype ModalActionProps = Omit<ButtonProps, 'color' | 'variant'> & {\n  /**\n   * 버튼 색상\n   * @default 'primary'\n   */\n  color?: 'primary' | 'critical';\n};\n\ntype ModalTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\n\ntype ModalDescriptionProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>;\n\ntype ModalComponent = typeof DialogPrimitive.Root & {\n  Trigger: typeof DialogPrimitive.Trigger;\n  Portal: typeof DialogPrimitive.Portal;\n  Close: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalCloseProps> & React.RefAttributes<HTMLButtonElement>\n  >;\n  Overlay: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalOverlayProps> &\n      React.RefAttributes<React.ElementRef<typeof DialogPrimitive.Overlay>>\n  >;\n  Content: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalContentProps> &\n      React.RefAttributes<React.ElementRef<typeof DialogPrimitive.Content>>\n  >;\n  Header: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalHeaderProps> & React.RefAttributes<HTMLDivElement>\n  >;\n  Body: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalBodyProps> & React.RefAttributes<HTMLDivElement>\n  >;\n  Footer: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalFooterProps> & React.RefAttributes<HTMLDivElement>\n  >;\n  FooterDescription: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalFooterDescriptionProps> & React.RefAttributes<HTMLDivElement>\n  >;\n  Actions: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalActionsProps> & React.RefAttributes<HTMLDivElement>\n  >;\n  Action: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalActionProps> & React.RefAttributes<HTMLButtonElement>\n  >;\n  Title: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalTitleProps> &\n      React.RefAttributes<React.ElementRef<typeof DialogPrimitive.Title>>\n  >;\n  Description: React.ForwardRefExoticComponent<\n    React.PropsWithoutRef<ModalDescriptionProps> &\n      React.RefAttributes<React.ElementRef<typeof DialogPrimitive.Description>>\n  >;\n};\n\nconst MODAL_PADDING = {\n  body: 'px-4 pb-4',\n  footer: 'px-4 py-3',\n};\n\nconst ModalContext = createContext<{ size: ModalSize }>({ size: 'medium' });\n\n/**\n * 사용자 인터랙션이 필요한 오버레이 다이얼로그 컴포넌트입니다.\n * Compound Component 패턴으로 하위 컴포넌트와 함께 사용합니다.\n *\n * @example\n * ```tsx\n * <Modal>\n *   <Modal.Trigger>열기</Modal.Trigger>\n *   <Modal.Content size=\"medium\">\n *     <Modal.Header>\n *       <Modal.Title>제목</Modal.Title>\n *     </Modal.Header>\n *     <Modal.Body>내용</Modal.Body>\n *     <Modal.Footer>\n *       <Modal.Actions>\n *         <Modal.Close>닫기</Modal.Close>\n *       </Modal.Actions>\n *     </Modal.Footer>\n *   </Modal.Content>\n * </Modal>\n * ```\n *\n * @see {@link ModalContentProps} Content props 상세\n */\nconst Modal = DialogPrimitive.Root as ModalComponent;\n\nModal.Trigger = DialogPrimitive.Trigger;\n\nModal.Portal = DialogPrimitive.Portal;\n\nModal.Close = forwardRef<HTMLButtonElement, ModalCloseProps>(({ size, ...props }, ref) => {\n  const { size: modalSize } = useContext(ModalContext);\n\n  return (\n    <DialogPrimitive.Close asChild>\n      <Button\n        {...props}\n        ref={ref}\n        color=\"assistive\"\n        variant=\"contained\"\n        size={size ?? (modalSize === 'fullsize' ? 'large' : 'medium')}\n      />\n    </DialogPrimitive.Close>\n  );\n}) as ModalComponent['Close'];\n\nModal.Overlay = forwardRef<React.ComponentRef<typeof DialogPrimitive.Overlay>, ModalOverlayProps>(\n  ({ className, ...props }, ref) => (\n    <DialogPrimitive.Overlay\n      ref={ref}\n      className={cn(\n        'fixed inset-0 z-50 bg-component-dim data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n        className,\n      )}\n      {...props}\n    />\n  ),\n) as ModalComponent['Overlay'];\n\nModal.Content = forwardRef<React.ComponentRef<typeof DialogPrimitive.Content>, ModalContentProps>(\n  ({ className, children, size = 'medium', onInteractOutside, onFocusOutside, ...props }, ref) => {\n    const isFullSize = size === 'fullsize';\n\n    const sizeWidthMap: Record<Exclude<ModalSize, 'fullsize'>, string> = {\n      small: 'max-w-[640px]',\n      medium: 'max-w-[800px]',\n      large: 'max-w-[960px]',\n      xlarge: 'max-w-[1120px]',\n    };\n\n    const shouldPreventDismissForSelect = (target: EventTarget | null) => {\n      const isSelectOpen = Boolean(\n        document.querySelector('[data-radix-select-content][data-state=\"open\"]'),\n      );\n      if (isSelectOpen) {\n        return true;\n      }\n\n      if (!(target instanceof Element)) {\n        return false;\n      }\n\n      return Boolean(\n        target.closest('[data-radix-select-content]') ||\n          target.closest('[data-radix-select-viewport]'),\n      );\n    };\n\n    const handleInteractOutside = (event: InteractOutsideEvent) => {\n      // Select가 열려있는 경우: Modal 닫힘 방지\n      if (shouldPreventDismissForSelect(event.target)) {\n        event.preventDefault();\n      }\n\n      onInteractOutside?.(event);\n    };\n\n    return (\n      <ModalContext.Provider value={{ size }}>\n        <Modal.Portal>\n          <Modal.Overlay />\n          <DialogPrimitive.Content\n            ref={ref}\n            className={cn(\n              // 공통 스타일\n              'fixed z-50 flex flex-col rounded-strong border border-border-primary bg-elevation-elevation-0 duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n              // fullsize일 때\n              isFullSize\n                ? 'inset-0 m-10'\n                : // 일반 모달일 때\n                  cn(\n                    'left-[50%] top-[50%] w-full max-h-[90vh] translate-x-[-50%] translate-y-[-50%] shadow-strong data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]',\n                    sizeWidthMap[size],\n                  ),\n              className,\n            )}\n            {...props}\n            onInteractOutside={handleInteractOutside}\n          >\n            {children}\n          </DialogPrimitive.Content>\n        </Modal.Portal>\n      </ModalContext.Provider>\n    );\n  },\n) as ModalComponent['Content'];\n\nModal.Header = forwardRef<HTMLDivElement, ModalHeaderProps>(\n  ({ className, line = false, showCloseIcon = true, children, ...props }, ref) => {\n    const { size } = useContext(ModalContext);\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex shrink-0 flex-row items-center gap-2 pl-4 pr-3',\n          line && 'border-b border-border-primary',\n          size === 'fullsize' ? 'h-16' : 'h-14',\n          className,\n        )}\n        {...props}\n      >\n        <div className=\"flex flex-1 flex-row items-center gap-1\">{children}</div>\n        {showCloseIcon && (\n          <DialogPrimitive.Close\n            className={cn(\n              'flex shrink-0 items-center justify-center size-8 rounded-medium text-icon-secondary transition-colors hover:bg-elevation-elevation-2 focus:outline-none disabled:pointer-events-none',\n            )}\n          >\n            <XIcon type=\"regular\" size={20} />\n          </DialogPrimitive.Close>\n        )}\n      </div>\n    );\n  },\n) as ModalComponent['Header'];\n\nModal.Body = forwardRef<HTMLDivElement, ModalBodyProps>(\n  ({ className, children, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn(\n        'flex-1 flex flex-col min-h-0 h-full',\n        '[&_[data-slot=scroll-area-viewport]>div]:h-full',\n      )}\n      {...props}\n    >\n      <ScrollArea className=\"h-full flex flex-col\">\n        <div className={cn(MODAL_PADDING.body, className)}>{children}</div>\n      </ScrollArea>\n    </div>\n  ),\n) as ModalComponent['Body'];\n\nModal.Footer = forwardRef<HTMLDivElement, ModalFooterProps>(\n  ({ className, line = true, ...props }, ref) => {\n    const { size } = useContext(ModalContext);\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex flex-row items-center justify-between',\n          line && 'border-t border-border-primary',\n          size === 'fullsize' ? 'gap-3' : 'h-14 gap-3',\n          MODAL_PADDING.footer,\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n) as ModalComponent['Footer'];\n\nModal.FooterDescription = forwardRef<HTMLDivElement, ModalFooterDescriptionProps>(\n  ({ className, error = false, icon, children, ...props }, ref) => {\n    const { size } = useContext(ModalContext);\n    const isLargeFooter = size === 'fullsize';\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'flex flex-row items-center gap-1',\n          isLargeFooter ? 'text-body-2' : 'text-body-3',\n          error ? 'text-text-critical' : 'text-text-tertiary',\n          className,\n        )}\n        {...props}\n      >\n        {icon && (\n          <span className=\"flex shrink-0 size-4 items-center justify-center [&>svg]:size-4\">\n            {icon}\n          </span>\n        )}\n        {children}\n      </div>\n    );\n  },\n) as ModalComponent['FooterDescription'];\n\nModal.Actions = forwardRef<HTMLDivElement, ModalActionsProps>(({ className, ...props }, ref) => {\n  const { size } = useContext(ModalContext);\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'ml-auto flex flex-row items-center',\n        size === 'fullsize' ? 'gap-3' : 'gap-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}) as ModalComponent['Actions'];\n\nModal.Action = forwardRef<HTMLButtonElement, ModalActionProps>(\n  ({ color = 'primary', size, ...props }, ref) => {\n    const { size: modalSize } = useContext(ModalContext);\n\n    return (\n      <DialogPrimitive.Close asChild>\n        <Button\n          {...props}\n          ref={ref}\n          color={color}\n          variant=\"contained\"\n          size={size ?? (modalSize === 'fullsize' ? 'large' : 'medium')}\n        />\n      </DialogPrimitive.Close>\n    );\n  },\n) as ModalComponent['Action'];\n\nModal.Title = forwardRef<React.ComponentRef<typeof DialogPrimitive.Title>, ModalTitleProps>(\n  ({ className, ...props }, ref) => (\n    <DialogPrimitive.Title\n      ref={ref}\n      className={cn(\n        'text-title-2 font-semibold leading-none tracking-tight text-text-primary',\n        className,\n      )}\n      {...props}\n    />\n  ),\n) as ModalComponent['Title'];\n\nModal.Description = forwardRef<\n  React.ComponentRef<typeof DialogPrimitive.Description>,\n  ModalDescriptionProps\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn('text-body-2 text-text-tertiary', className)}\n    {...props}\n  />\n)) as ModalComponent['Description'];\n\nModal.displayName = 'Modal';\nModal.Trigger.displayName = 'Modal.Trigger';\nModal.Portal.displayName = 'Modal.Portal';\nModal.Close.displayName = 'Modal.Close';\nModal.Overlay.displayName = 'Modal.Overlay';\nModal.Content.displayName = 'Modal.Content';\nModal.Header.displayName = 'Modal.Header';\nModal.Body.displayName = 'Modal.Body';\nModal.Footer.displayName = 'Modal.Footer';\nModal.FooterDescription.displayName = 'Modal.FooterDescription';\nModal.Actions.displayName = 'Modal.Actions';\nModal.Action.displayName = 'Modal.Action';\nModal.Title.displayName = 'Modal.Title';\nModal.Description.displayName = 'Modal.Description';\n\nexport { Modal };\nexport type {\n  ModalComponent,\n  ModalRootProps,\n  ModalTriggerProps,\n  ModalPortalProps,\n  ModalOverlayProps,\n  ModalContentProps,\n  ModalCloseProps,\n  ModalHeaderProps,\n  ModalBodyProps,\n  ModalFooterProps,\n  ModalFooterDescriptionProps,\n  ModalActionsProps,\n  ModalActionProps,\n  ModalTitleProps,\n  ModalDescriptionProps,\n};\n"]}