@ktnpm_devops/react-component 0.2.1 → 0.4.0

package/dist/index13.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index13.cjs","sources":["../src/composites/ChartExpandModal/ChartExpandModal.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { CHART_MODAL, VIEWPORT_MARGIN, ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport clsx from 'clsx';\nimport styles from './ChartExpandModal.module.css';\n\nexport interface ChartExpandModalProps {\n  /** Title displayed in the modal header. */\n  title: string;\n  /** Content to render inside the modal body. */\n  children: ReactNode;\n  /** Called when the modal should close. */\n  onClose: () => void;\n  /** Enable resize handles on the modal. */\n  resizable?: boolean;\n  /** Default modal dimensions in pixels. */\n  defaultSize?: { width?: number; height?: number };\n  /** Additional actions rendered in the header. */\n  actions?: ReactNode;\n}\n\nconst getInitialSize = (override?: { width?: number; height?: number }) => {\n  if (typeof window === 'undefined') {\n    return {\n      width: override?.width ?? CHART_MODAL.FALLBACK_WIDTH,\n      height: override?.height ?? CHART_MODAL.FALLBACK_HEIGHT,\n    };\n  }\n  const w = Math.min(override?.width ?? CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - VIEWPORT_MARGIN);\n  const h = Math.min(override?.height ?? CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - VIEWPORT_MARGIN);\n  return { width: Math.max(w, CHART_MODAL.MIN_WIDTH), height: Math.max(h, CHART_MODAL.MIN_HEIGHT) };\n};\n\nexport const ChartExpandModal = ({\n  title,\n  children,\n  onClose,\n  resizable = false,\n  defaultSize,\n  actions,\n}: ChartExpandModalProps) => {\n  const [size, setSize] = useState(() => getInitialSize(defaultSize));\n  const [isReady, setIsReady] = useState(false);\n  const bodyRef = useRef<HTMLDivElement>(null);\n\n  useEscapeKey(onClose);\n\n  useEffect(() => {\n    if (!resizable) return;\n    const handleResize = () => setSize(getInitialSize(defaultSize));\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [resizable, defaultSize]);\n\n  useEffect(() => {\n    const check = () => {\n      const body = bodyRef.current;\n      if (body && body.clientWidth > 0 && body.clientHeight > 0) {\n        setIsReady(true);\n      } else {\n        requestAnimationFrame(check);\n      }\n    };\n    requestAnimationFrame(check);\n  }, []);\n\n  const handleResizeStart = useCallback(\n    (e: React.MouseEvent | React.TouchEvent) => {\n      if (!resizable || typeof window === 'undefined') return;\n      e.preventDefault();\n      const startX = 'touches' in e ? e.touches[0]?.clientX ?? 0 : e.clientX;\n      const startY = 'touches' in e ? e.touches[0]?.clientY ?? 0 : e.clientY;\n      const startW = size.width;\n      const startH = size.height;\n\n      const handleMove = (ev: MouseEvent | TouchEvent) => {\n        const cx = ev instanceof TouchEvent ? ev.touches[0]?.clientX ?? 0 : (ev as MouseEvent).clientX;\n        const cy = ev instanceof TouchEvent ? ev.touches[0]?.clientY ?? 0 : (ev as MouseEvent).clientY;\n        const maxW = Math.min(window.innerWidth - VIEWPORT_MARGIN, CHART_MODAL.MAX_WIDTH);\n        const maxH = Math.min(window.innerHeight - VIEWPORT_MARGIN, CHART_MODAL.MAX_HEIGHT);\n        setSize({\n          width: Math.min(Math.max(startW + (cx - startX), CHART_MODAL.MIN_WIDTH), maxW),\n          height: Math.min(Math.max(startH + (cy - startY), CHART_MODAL.MIN_HEIGHT), maxH),\n        });\n      };\n\n      const handleUp = () => {\n        window.removeEventListener('mousemove', handleMove);\n        window.removeEventListener('mouseup', handleUp);\n        window.removeEventListener('touchmove', handleMove as EventListener);\n        window.removeEventListener('touchend', handleUp);\n      };\n\n      window.addEventListener('mousemove', handleMove);\n      window.addEventListener('mouseup', handleUp);\n      window.addEventListener('touchmove', handleMove as EventListener, { passive: false });\n      window.addEventListener('touchend', handleUp);\n    },\n    [resizable, size],\n  );\n\n  if (typeof document === 'undefined') return null;\n\n  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : undefined;\n\n  return createPortal(\n    <div className={styles.overlay} role=\"dialog\" aria-modal=\"true\">\n      <div className={clsx(styles.modal, { [styles.resizable]: resizable })} style={modalStyle}>\n        <header className={styles.header}>\n          <h2 className={styles.title}>{title}</h2>\n          <div className={styles.headerActions}>\n            {actions}\n            <button type=\"button\" className={styles.close} onClick={onClose} aria-label=\"Close expanded chart\">\n              <svg width={ICON_SIZE.LG} height={ICON_SIZE.LG} viewBox={SVG_VIEWBOX} fill=\"none\" stroke=\"currentColor\" strokeWidth={SVG_STROKE_WIDTH} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n                <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n              </svg>\n            </button>\n          </div>\n        </header>\n        <div className={styles.body} ref={bodyRef}>\n          {isReady ? children : <div className={styles.loading}>Loading chart...</div>}\n        </div>\n        {resizable && (\n          <div className={styles.resizeHandle} onMouseDown={handleResizeStart} onTouchStart={handleResizeStart}>\n            <span />\n          </div>\n        )}\n      </div>\n    </div>,\n    document.body,\n  );\n};\n"],"names":["CHART_MODAL","VIEWPORT_MARGIN","useState","useRef","useEscapeKey","useEffect","useCallback","_a","_b","createPortal","jsx","styles","jsxs","clsx","ICON_SIZE","SVG_VIEWBOX","SVG_STROKE_WIDTH"],"mappings":"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"}
+{"version":3,"file":"index13.cjs","sources":["../src/primitives/Card/Card.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport styles from './Card.module.css';\n\nexport interface CardProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const Card = ({ className, ...props }: CardProps) => (\n  <div className={clsx(styles.root, className)} {...props} />\n);\n\nexport const CardHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={clsx(styles.header, className)} {...props} />\n);\n\nexport const CardContent = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={clsx(styles.content, className)} {...props} />\n);\n\nexport const CardFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={clsx(styles.footer, className)} {...props} />\n);\n"],"names":["jsx","clsx","styles"],"mappings":";;;;;AAKO,MAAM,OAAO,CAAC,EAAE,WAAW,GAAG,YACnCA,2BAAAA,IAAC,OAAA,EAAI,WAAWC,KAAAA,KAAKC,YAAAA,QAAO,MAAM,SAAS,GAAI,GAAG,MAAA,CAAO;AAGpD,MAAM,aAAa,CAAC,EAAE,WAAW,GAAG,YACzCF,2BAAAA,IAAC,OAAA,EAAI,WAAWC,KAAAA,KAAKC,YAAAA,QAAO,QAAQ,SAAS,GAAI,GAAG,MAAA,CAAO;AAGtD,MAAM,cAAc,CAAC,EAAE,WAAW,GAAG,YAC1CF,2BAAAA,IAAC,OAAA,EAAI,WAAWC,KAAAA,KAAKC,YAAAA,QAAO,SAAS,SAAS,GAAI,GAAG,MAAA,CAAO;AAGvD,MAAM,aAAa,CAAC,EAAE,WAAW,GAAG,YACzCF,2BAAAA,IAAC,OAAA,EAAI,WAAWC,KAAAA,KAAKC,YAAAA,QAAO,QAAQ,SAAS,GAAI,GAAG,MAAA,CAAO;;;;;"}

package/dist/index13.js

@@ -1,104 +1,14 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useState, useRef, useEffect, useCallback } from "react";
-import { createPortal } from "react-dom";
-import { useEscapeKey } from "./index4.js";
-import { SVG_STROKE_WIDTH, SVG_VIEWBOX, ICON_SIZE, CHART_MODAL, VIEWPORT_MARGIN } from "./index40.js";
-import { clsx } from "./index35.js";
-import styles from "./index49.js";
-const getInitialSize = (override) => {
-  if (typeof window === "undefined") {
-    return {
-      width: (override == null ? void 0 : override.width) ?? CHART_MODAL.FALLBACK_WIDTH,
-      height: (override == null ? void 0 : override.height) ?? CHART_MODAL.FALLBACK_HEIGHT
-    };
-  }
-  const w = Math.min((override == null ? void 0 : override.width) ?? CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - VIEWPORT_MARGIN);
-  const h = Math.min((override == null ? void 0 : override.height) ?? CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - VIEWPORT_MARGIN);
-  return { width: Math.max(w, CHART_MODAL.MIN_WIDTH), height: Math.max(h, CHART_MODAL.MIN_HEIGHT) };
-};
-const ChartExpandModal = ({
-  title,
-  children,
-  onClose,
-  resizable = false,
-  defaultSize,
-  actions
-}) => {
-  const [size, setSize] = useState(() => getInitialSize(defaultSize));
-  const [isReady, setIsReady] = useState(false);
-  const bodyRef = useRef(null);
-  useEscapeKey(onClose);
-  useEffect(() => {
-    if (!resizable) return;
-    const handleResize = () => setSize(getInitialSize(defaultSize));
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, [resizable, defaultSize]);
-  useEffect(() => {
-    const check = () => {
-      const body = bodyRef.current;
-      if (body && body.clientWidth > 0 && body.clientHeight > 0) {
-        setIsReady(true);
-      } else {
-        requestAnimationFrame(check);
-      }
-    };
-    requestAnimationFrame(check);
-  }, []);
-  const handleResizeStart = useCallback(
-    (e) => {
-      var _a, _b;
-      if (!resizable || typeof window === "undefined") return;
-      e.preventDefault();
-      const startX = "touches" in e ? ((_a = e.touches[0]) == null ? void 0 : _a.clientX) ?? 0 : e.clientX;
-      const startY = "touches" in e ? ((_b = e.touches[0]) == null ? void 0 : _b.clientY) ?? 0 : e.clientY;
-      const startW = size.width;
-      const startH = size.height;
-      const handleMove = (ev) => {
-        var _a2, _b2;
-        const cx = ev instanceof TouchEvent ? ((_a2 = ev.touches[0]) == null ? void 0 : _a2.clientX) ?? 0 : ev.clientX;
-        const cy = ev instanceof TouchEvent ? ((_b2 = ev.touches[0]) == null ? void 0 : _b2.clientY) ?? 0 : ev.clientY;
-        const maxW = Math.min(window.innerWidth - VIEWPORT_MARGIN, CHART_MODAL.MAX_WIDTH);
-        const maxH = Math.min(window.innerHeight - VIEWPORT_MARGIN, CHART_MODAL.MAX_HEIGHT);
-        setSize({
-          width: Math.min(Math.max(startW + (cx - startX), CHART_MODAL.MIN_WIDTH), maxW),
-          height: Math.min(Math.max(startH + (cy - startY), CHART_MODAL.MIN_HEIGHT), maxH)
-        });
-      };
-      const handleUp = () => {
-        window.removeEventListener("mousemove", handleMove);
-        window.removeEventListener("mouseup", handleUp);
-        window.removeEventListener("touchmove", handleMove);
-        window.removeEventListener("touchend", handleUp);
-      };
-      window.addEventListener("mousemove", handleMove);
-      window.addEventListener("mouseup", handleUp);
-      window.addEventListener("touchmove", handleMove, { passive: false });
-      window.addEventListener("touchend", handleUp);
-    },
-    [resizable, size]
-  );
-  if (typeof document === "undefined") return null;
-  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : void 0;
-  return createPortal(
-    /* @__PURE__ */ jsx("div", { className: styles.overlay, role: "dialog", "aria-modal": "true", children: /* @__PURE__ */ jsxs("div", { className: clsx(styles.modal, { [styles.resizable]: resizable }), style: modalStyle, children: [
-      /* @__PURE__ */ jsxs("header", { className: styles.header, children: [
-        /* @__PURE__ */ jsx("h2", { className: styles.title, children: title }),
-        /* @__PURE__ */ jsxs("div", { className: styles.headerActions, children: [
-          actions,
-          /* @__PURE__ */ jsx("button", { type: "button", className: styles.close, onClick: onClose, "aria-label": "Close expanded chart", children: /* @__PURE__ */ jsxs("svg", { width: ICON_SIZE.LG, height: ICON_SIZE.LG, viewBox: SVG_VIEWBOX, fill: "none", stroke: "currentColor", strokeWidth: SVG_STROKE_WIDTH, strokeLinecap: "round", strokeLinejoin: "round", children: [
-            /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-            /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-          ] }) })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: styles.body, ref: bodyRef, children: isReady ? children : /* @__PURE__ */ jsx("div", { className: styles.loading, children: "Loading chart..." }) }),
-      resizable && /* @__PURE__ */ jsx("div", { className: styles.resizeHandle, onMouseDown: handleResizeStart, onTouchStart: handleResizeStart, children: /* @__PURE__ */ jsx("span", {}) })
-    ] }) }),
-    document.body
-  );
-};
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "./index38.js";
+import styles from "./index39.js";
+const Card = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: clsx(styles.root, className), ...props });
+const CardHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: clsx(styles.header, className), ...props });
+const CardContent = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: clsx(styles.content, className), ...props });
+const CardFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: clsx(styles.footer, className), ...props });
 export {
-  ChartExpandModal
+  Card,
+  CardContent,
+  CardFooter,
+  CardHeader
 };
 //# sourceMappingURL=index13.js.map

package/dist/index13.js.map

@@ -1 +1 @@
-{"version":3,"file":"index13.js","sources":["../src/composites/ChartExpandModal/ChartExpandModal.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { CHART_MODAL, VIEWPORT_MARGIN, ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport clsx from 'clsx';\nimport styles from './ChartExpandModal.module.css';\n\nexport interface ChartExpandModalProps {\n  /** Title displayed in the modal header. */\n  title: string;\n  /** Content to render inside the modal body. */\n  children: ReactNode;\n  /** Called when the modal should close. */\n  onClose: () => void;\n  /** Enable resize handles on the modal. */\n  resizable?: boolean;\n  /** Default modal dimensions in pixels. */\n  defaultSize?: { width?: number; height?: number };\n  /** Additional actions rendered in the header. */\n  actions?: ReactNode;\n}\n\nconst getInitialSize = (override?: { width?: number; height?: number }) => {\n  if (typeof window === 'undefined') {\n    return {\n      width: override?.width ?? CHART_MODAL.FALLBACK_WIDTH,\n      height: override?.height ?? CHART_MODAL.FALLBACK_HEIGHT,\n    };\n  }\n  const w = Math.min(override?.width ?? CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - VIEWPORT_MARGIN);\n  const h = Math.min(override?.height ?? CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - VIEWPORT_MARGIN);\n  return { width: Math.max(w, CHART_MODAL.MIN_WIDTH), height: Math.max(h, CHART_MODAL.MIN_HEIGHT) };\n};\n\nexport const ChartExpandModal = ({\n  title,\n  children,\n  onClose,\n  resizable = false,\n  defaultSize,\n  actions,\n}: ChartExpandModalProps) => {\n  const [size, setSize] = useState(() => getInitialSize(defaultSize));\n  const [isReady, setIsReady] = useState(false);\n  const bodyRef = useRef<HTMLDivElement>(null);\n\n  useEscapeKey(onClose);\n\n  useEffect(() => {\n    if (!resizable) return;\n    const handleResize = () => setSize(getInitialSize(defaultSize));\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [resizable, defaultSize]);\n\n  useEffect(() => {\n    const check = () => {\n      const body = bodyRef.current;\n      if (body && body.clientWidth > 0 && body.clientHeight > 0) {\n        setIsReady(true);\n      } else {\n        requestAnimationFrame(check);\n      }\n    };\n    requestAnimationFrame(check);\n  }, []);\n\n  const handleResizeStart = useCallback(\n    (e: React.MouseEvent | React.TouchEvent) => {\n      if (!resizable || typeof window === 'undefined') return;\n      e.preventDefault();\n      const startX = 'touches' in e ? e.touches[0]?.clientX ?? 0 : e.clientX;\n      const startY = 'touches' in e ? e.touches[0]?.clientY ?? 0 : e.clientY;\n      const startW = size.width;\n      const startH = size.height;\n\n      const handleMove = (ev: MouseEvent | TouchEvent) => {\n        const cx = ev instanceof TouchEvent ? ev.touches[0]?.clientX ?? 0 : (ev as MouseEvent).clientX;\n        const cy = ev instanceof TouchEvent ? ev.touches[0]?.clientY ?? 0 : (ev as MouseEvent).clientY;\n        const maxW = Math.min(window.innerWidth - VIEWPORT_MARGIN, CHART_MODAL.MAX_WIDTH);\n        const maxH = Math.min(window.innerHeight - VIEWPORT_MARGIN, CHART_MODAL.MAX_HEIGHT);\n        setSize({\n          width: Math.min(Math.max(startW + (cx - startX), CHART_MODAL.MIN_WIDTH), maxW),\n          height: Math.min(Math.max(startH + (cy - startY), CHART_MODAL.MIN_HEIGHT), maxH),\n        });\n      };\n\n      const handleUp = () => {\n        window.removeEventListener('mousemove', handleMove);\n        window.removeEventListener('mouseup', handleUp);\n        window.removeEventListener('touchmove', handleMove as EventListener);\n        window.removeEventListener('touchend', handleUp);\n      };\n\n      window.addEventListener('mousemove', handleMove);\n      window.addEventListener('mouseup', handleUp);\n      window.addEventListener('touchmove', handleMove as EventListener, { passive: false });\n      window.addEventListener('touchend', handleUp);\n    },\n    [resizable, size],\n  );\n\n  if (typeof document === 'undefined') return null;\n\n  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : undefined;\n\n  return createPortal(\n    <div className={styles.overlay} role=\"dialog\" aria-modal=\"true\">\n      <div className={clsx(styles.modal, { [styles.resizable]: resizable })} style={modalStyle}>\n        <header className={styles.header}>\n          <h2 className={styles.title}>{title}</h2>\n          <div className={styles.headerActions}>\n            {actions}\n            <button type=\"button\" className={styles.close} onClick={onClose} aria-label=\"Close expanded chart\">\n              <svg width={ICON_SIZE.LG} height={ICON_SIZE.LG} viewBox={SVG_VIEWBOX} fill=\"none\" stroke=\"currentColor\" strokeWidth={SVG_STROKE_WIDTH} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n                <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n              </svg>\n            </button>\n          </div>\n        </header>\n        <div className={styles.body} ref={bodyRef}>\n          {isReady ? children : <div className={styles.loading}>Loading chart...</div>}\n        </div>\n        {resizable && (\n          <div className={styles.resizeHandle} onMouseDown={handleResizeStart} onTouchStart={handleResizeStart}>\n            <span />\n          </div>\n        )}\n      </div>\n    </div>,\n    document.body,\n  );\n};\n"],"names":["_a","_b"],"mappings":"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"}
+{"version":3,"file":"index13.js","sources":["../src/primitives/Card/Card.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport styles from './Card.module.css';\n\nexport interface CardProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const Card = ({ className, ...props }: CardProps) => (\n  <div className={clsx(styles.root, className)} {...props} />\n);\n\nexport const CardHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={clsx(styles.header, className)} {...props} />\n);\n\nexport const CardContent = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={clsx(styles.content, className)} {...props} />\n);\n\nexport const CardFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={clsx(styles.footer, className)} {...props} />\n);\n"],"names":[],"mappings":";;;AAKO,MAAM,OAAO,CAAC,EAAE,WAAW,GAAG,YACnC,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GAAI,GAAG,MAAA,CAAO;AAGpD,MAAM,aAAa,CAAC,EAAE,WAAW,GAAG,YACzC,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,QAAQ,SAAS,GAAI,GAAG,MAAA,CAAO;AAGtD,MAAM,cAAc,CAAC,EAAE,WAAW,GAAG,YAC1C,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,SAAS,SAAS,GAAI,GAAG,MAAA,CAAO;AAGvD,MAAM,aAAa,CAAC,EAAE,WAAW,GAAG,YACzC,oBAAC,OAAA,EAAI,WAAW,KAAK,OAAO,QAAQ,SAAS,GAAI,GAAG,MAAA,CAAO;"}

package/dist/index14.cjs

@@ -1,24 +1,104 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const clsx = require("./index35.cjs");
-const ChatLayout_module = require("./index42.cjs");
-const ChatLayout = ({
-  sidebar,
-  conversationList,
-  messageArea,
-  inputArea,
-  sidebarCollapsed = false,
-  showConversationList = true,
-  className
-}) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(ChatLayout_module.default.root, className), children: [
-  sidebar && !sidebarCollapsed && /* @__PURE__ */ jsxRuntime.jsx("aside", { className: ChatLayout_module.default.sidebar, children: sidebar }),
-  conversationList && showConversationList && /* @__PURE__ */ jsxRuntime.jsx("aside", { className: ChatLayout_module.default.conversationList, children: conversationList }),
-  /* @__PURE__ */ jsxRuntime.jsxs("main", { className: ChatLayout_module.default.mainArea, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ChatLayout_module.default.messages, children: messageArea }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ChatLayout_module.default.input, children: inputArea })
-  ] })
-] });
-ChatLayout.displayName = "ChatLayout";
-exports.ChatLayout = ChatLayout;
+const react = require("react");
+const reactDom = require("react-dom");
+const useEscapeKey = require("./index5.cjs");
+const constants = require("./index48.cjs");
+const clsx = require("./index38.cjs");
+const ChartExpandModal_module = require("./index51.cjs");
+const getInitialSize = (override) => {
+  if (typeof window === "undefined") {
+    return {
+      width: (override == null ? void 0 : override.width) ?? constants.CHART_MODAL.FALLBACK_WIDTH,
+      height: (override == null ? void 0 : override.height) ?? constants.CHART_MODAL.FALLBACK_HEIGHT
+    };
+  }
+  const w = Math.min((override == null ? void 0 : override.width) ?? constants.CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - constants.VIEWPORT_MARGIN);
+  const h = Math.min((override == null ? void 0 : override.height) ?? constants.CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - constants.VIEWPORT_MARGIN);
+  return { width: Math.max(w, constants.CHART_MODAL.MIN_WIDTH), height: Math.max(h, constants.CHART_MODAL.MIN_HEIGHT) };
+};
+const ChartExpandModal = ({
+  title,
+  children,
+  onClose,
+  resizable = false,
+  defaultSize,
+  actions
+}) => {
+  const [size, setSize] = react.useState(() => getInitialSize(defaultSize));
+  const [isReady, setIsReady] = react.useState(false);
+  const bodyRef = react.useRef(null);
+  useEscapeKey.useEscapeKey(onClose);
+  react.useEffect(() => {
+    if (!resizable) return;
+    const handleResize = () => setSize(getInitialSize(defaultSize));
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [resizable, defaultSize]);
+  react.useEffect(() => {
+    const check = () => {
+      const body = bodyRef.current;
+      if (body && body.clientWidth > 0 && body.clientHeight > 0) {
+        setIsReady(true);
+      } else {
+        requestAnimationFrame(check);
+      }
+    };
+    requestAnimationFrame(check);
+  }, []);
+  const handleResizeStart = react.useCallback(
+    (e) => {
+      var _a, _b;
+      if (!resizable || typeof window === "undefined") return;
+      e.preventDefault();
+      const startX = "touches" in e ? ((_a = e.touches[0]) == null ? void 0 : _a.clientX) ?? 0 : e.clientX;
+      const startY = "touches" in e ? ((_b = e.touches[0]) == null ? void 0 : _b.clientY) ?? 0 : e.clientY;
+      const startW = size.width;
+      const startH = size.height;
+      const handleMove = (ev) => {
+        var _a2, _b2;
+        const cx = ev instanceof TouchEvent ? ((_a2 = ev.touches[0]) == null ? void 0 : _a2.clientX) ?? 0 : ev.clientX;
+        const cy = ev instanceof TouchEvent ? ((_b2 = ev.touches[0]) == null ? void 0 : _b2.clientY) ?? 0 : ev.clientY;
+        const maxW = Math.min(window.innerWidth - constants.VIEWPORT_MARGIN, constants.CHART_MODAL.MAX_WIDTH);
+        const maxH = Math.min(window.innerHeight - constants.VIEWPORT_MARGIN, constants.CHART_MODAL.MAX_HEIGHT);
+        setSize({
+          width: Math.min(Math.max(startW + (cx - startX), constants.CHART_MODAL.MIN_WIDTH), maxW),
+          height: Math.min(Math.max(startH + (cy - startY), constants.CHART_MODAL.MIN_HEIGHT), maxH)
+        });
+      };
+      const handleUp = () => {
+        window.removeEventListener("mousemove", handleMove);
+        window.removeEventListener("mouseup", handleUp);
+        window.removeEventListener("touchmove", handleMove);
+        window.removeEventListener("touchend", handleUp);
+      };
+      window.addEventListener("mousemove", handleMove);
+      window.addEventListener("mouseup", handleUp);
+      window.addEventListener("touchmove", handleMove, { passive: false });
+      window.addEventListener("touchend", handleUp);
+    },
+    [resizable, size]
+  );
+  if (typeof document === "undefined") return null;
+  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : void 0;
+  return reactDom.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: ChartExpandModal_module.default.overlay, role: "dialog", "aria-modal": "true", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(ChartExpandModal_module.default.modal, { [ChartExpandModal_module.default.resizable]: resizable }), style: modalStyle, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("header", { className: ChartExpandModal_module.default.header, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: ChartExpandModal_module.default.title, children: title }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ChartExpandModal_module.default.headerActions, children: [
+          actions,
+          /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: ChartExpandModal_module.default.close, onClick: onClose, "aria-label": "Close expanded chart", children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: constants.ICON_SIZE.LG, height: constants.ICON_SIZE.LG, viewBox: constants.SVG_VIEWBOX, fill: "none", stroke: "currentColor", strokeWidth: constants.SVG_STROKE_WIDTH, strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+            /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+          ] }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: ChartExpandModal_module.default.body, ref: bodyRef, children: isReady ? children : /* @__PURE__ */ jsxRuntime.jsx("div", { className: ChartExpandModal_module.default.loading, children: "Loading chart..." }) }),
+      resizable && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ChartExpandModal_module.default.resizeHandle, onMouseDown: handleResizeStart, onTouchStart: handleResizeStart, children: /* @__PURE__ */ jsxRuntime.jsx("span", {}) })
+    ] }) }),
+    document.body
+  );
+};
+exports.ChartExpandModal = ChartExpandModal;
 //# sourceMappingURL=index14.cjs.map

package/dist/index14.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index14.cjs","sources":["../src/layouts/ChatLayout/ChatLayout.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ChatLayoutProps } from './ChatLayout.types';\nimport styles from './ChatLayout.module.css';\n\nexport const ChatLayout = ({\n  sidebar,\n  conversationList,\n  messageArea,\n  inputArea,\n  sidebarCollapsed = false,\n  showConversationList = true,\n  className,\n}: ChatLayoutProps) => (\n  <div className={clsx(styles.root, className)}>\n    {sidebar && !sidebarCollapsed && (\n      <aside className={styles.sidebar}>{sidebar}</aside>\n    )}\n\n    {conversationList && showConversationList && (\n      <aside className={styles.conversationList}>{conversationList}</aside>\n    )}\n\n    <main className={styles.mainArea}>\n      <div className={styles.messages}>{messageArea}</div>\n      <div className={styles.input}>{inputArea}</div>\n    </main>\n  </div>\n);\n\nChatLayout.displayName = 'ChatLayout';\n"],"names":["clsx","styles","jsx","jsxs"],"mappings":";;;;;AAIO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB;AACF,sCACG,OAAA,EAAI,WAAWA,KAAAA,KAAKC,kBAAAA,QAAO,MAAM,SAAS,GACxC,UAAA;AAAA,EAAA,WAAW,CAAC,oBACXC,2BAAAA,IAAC,WAAM,WAAWD,kBAAAA,QAAO,SAAU,UAAA,SAAQ;AAAA,EAG5C,oBAAoB,wBACnBC,2BAAAA,IAAC,WAAM,WAAWD,kBAAAA,QAAO,kBAAmB,UAAA,kBAAiB;AAAA,EAG/DE,2BAAAA,KAAC,QAAA,EAAK,WAAWF,kBAAAA,QAAO,UACtB,UAAA;AAAA,IAAAC,2BAAAA,IAAC,OAAA,EAAI,WAAWD,kBAAAA,QAAO,UAAW,UAAA,aAAY;AAAA,IAC9CC,2BAAAA,IAAC,OAAA,EAAI,WAAWD,kBAAAA,QAAO,OAAQ,UAAA,UAAA,CAAU;AAAA,EAAA,EAAA,CAC3C;AAAA,EAAA,CACF;AAGF,WAAW,cAAc;;"}
+{"version":3,"file":"index14.cjs","sources":["../src/composites/ChartExpandModal/ChartExpandModal.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { CHART_MODAL, VIEWPORT_MARGIN, ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport clsx from 'clsx';\nimport styles from './ChartExpandModal.module.css';\n\nexport interface ChartExpandModalProps {\n  /** Title displayed in the modal header. */\n  title: string;\n  /** Content to render inside the modal body. */\n  children: ReactNode;\n  /** Called when the modal should close. */\n  onClose: () => void;\n  /** Enable resize handles on the modal. */\n  resizable?: boolean;\n  /** Default modal dimensions in pixels. */\n  defaultSize?: { width?: number; height?: number };\n  /** Additional actions rendered in the header. */\n  actions?: ReactNode;\n}\n\nconst getInitialSize = (override?: { width?: number; height?: number }) => {\n  if (typeof window === 'undefined') {\n    return {\n      width: override?.width ?? CHART_MODAL.FALLBACK_WIDTH,\n      height: override?.height ?? CHART_MODAL.FALLBACK_HEIGHT,\n    };\n  }\n  const w = Math.min(override?.width ?? CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - VIEWPORT_MARGIN);\n  const h = Math.min(override?.height ?? CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - VIEWPORT_MARGIN);\n  return { width: Math.max(w, CHART_MODAL.MIN_WIDTH), height: Math.max(h, CHART_MODAL.MIN_HEIGHT) };\n};\n\nexport const ChartExpandModal = ({\n  title,\n  children,\n  onClose,\n  resizable = false,\n  defaultSize,\n  actions,\n}: ChartExpandModalProps) => {\n  const [size, setSize] = useState(() => getInitialSize(defaultSize));\n  const [isReady, setIsReady] = useState(false);\n  const bodyRef = useRef<HTMLDivElement>(null);\n\n  useEscapeKey(onClose);\n\n  useEffect(() => {\n    if (!resizable) return;\n    const handleResize = () => setSize(getInitialSize(defaultSize));\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [resizable, defaultSize]);\n\n  useEffect(() => {\n    const check = () => {\n      const body = bodyRef.current;\n      if (body && body.clientWidth > 0 && body.clientHeight > 0) {\n        setIsReady(true);\n      } else {\n        requestAnimationFrame(check);\n      }\n    };\n    requestAnimationFrame(check);\n  }, []);\n\n  const handleResizeStart = useCallback(\n    (e: React.MouseEvent | React.TouchEvent) => {\n      if (!resizable || typeof window === 'undefined') return;\n      e.preventDefault();\n      const startX = 'touches' in e ? e.touches[0]?.clientX ?? 0 : e.clientX;\n      const startY = 'touches' in e ? e.touches[0]?.clientY ?? 0 : e.clientY;\n      const startW = size.width;\n      const startH = size.height;\n\n      const handleMove = (ev: MouseEvent | TouchEvent) => {\n        const cx = ev instanceof TouchEvent ? ev.touches[0]?.clientX ?? 0 : (ev as MouseEvent).clientX;\n        const cy = ev instanceof TouchEvent ? ev.touches[0]?.clientY ?? 0 : (ev as MouseEvent).clientY;\n        const maxW = Math.min(window.innerWidth - VIEWPORT_MARGIN, CHART_MODAL.MAX_WIDTH);\n        const maxH = Math.min(window.innerHeight - VIEWPORT_MARGIN, CHART_MODAL.MAX_HEIGHT);\n        setSize({\n          width: Math.min(Math.max(startW + (cx - startX), CHART_MODAL.MIN_WIDTH), maxW),\n          height: Math.min(Math.max(startH + (cy - startY), CHART_MODAL.MIN_HEIGHT), maxH),\n        });\n      };\n\n      const handleUp = () => {\n        window.removeEventListener('mousemove', handleMove);\n        window.removeEventListener('mouseup', handleUp);\n        window.removeEventListener('touchmove', handleMove as EventListener);\n        window.removeEventListener('touchend', handleUp);\n      };\n\n      window.addEventListener('mousemove', handleMove);\n      window.addEventListener('mouseup', handleUp);\n      window.addEventListener('touchmove', handleMove as EventListener, { passive: false });\n      window.addEventListener('touchend', handleUp);\n    },\n    [resizable, size],\n  );\n\n  if (typeof document === 'undefined') return null;\n\n  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : undefined;\n\n  return createPortal(\n    <div className={styles.overlay} role=\"dialog\" aria-modal=\"true\">\n      <div className={clsx(styles.modal, { [styles.resizable]: resizable })} style={modalStyle}>\n        <header className={styles.header}>\n          <h2 className={styles.title}>{title}</h2>\n          <div className={styles.headerActions}>\n            {actions}\n            <button type=\"button\" className={styles.close} onClick={onClose} aria-label=\"Close expanded chart\">\n              <svg width={ICON_SIZE.LG} height={ICON_SIZE.LG} viewBox={SVG_VIEWBOX} fill=\"none\" stroke=\"currentColor\" strokeWidth={SVG_STROKE_WIDTH} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n                <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n              </svg>\n            </button>\n          </div>\n        </header>\n        <div className={styles.body} ref={bodyRef}>\n          {isReady ? children : <div className={styles.loading}>Loading chart...</div>}\n        </div>\n        {resizable && (\n          <div className={styles.resizeHandle} onMouseDown={handleResizeStart} onTouchStart={handleResizeStart}>\n            <span />\n          </div>\n        )}\n      </div>\n    </div>,\n    document.body,\n  );\n};\n"],"names":["CHART_MODAL","VIEWPORT_MARGIN","useState","useRef","useEscapeKey","useEffect","useCallback","_a","_b","createPortal","jsx","styles","jsxs","clsx","ICON_SIZE","SVG_VIEWBOX","SVG_STROKE_WIDTH"],"mappings":"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"}

package/dist/index14.js

@@ -1,24 +1,104 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { clsx } from "./index35.js";
-import styles from "./index42.js";
-const ChatLayout = ({
-  sidebar,
-  conversationList,
-  messageArea,
-  inputArea,
-  sidebarCollapsed = false,
-  showConversationList = true,
-  className
-}) => /* @__PURE__ */ jsxs("div", { className: clsx(styles.root, className), children: [
-  sidebar && !sidebarCollapsed && /* @__PURE__ */ jsx("aside", { className: styles.sidebar, children: sidebar }),
-  conversationList && showConversationList && /* @__PURE__ */ jsx("aside", { className: styles.conversationList, children: conversationList }),
-  /* @__PURE__ */ jsxs("main", { className: styles.mainArea, children: [
-    /* @__PURE__ */ jsx("div", { className: styles.messages, children: messageArea }),
-    /* @__PURE__ */ jsx("div", { className: styles.input, children: inputArea })
-  ] })
-] });
-ChatLayout.displayName = "ChatLayout";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect, useCallback } from "react";
+import { createPortal } from "react-dom";
+import { useEscapeKey } from "./index5.js";
+import { SVG_STROKE_WIDTH, SVG_VIEWBOX, ICON_SIZE, CHART_MODAL, VIEWPORT_MARGIN } from "./index48.js";
+import { clsx } from "./index38.js";
+import styles from "./index51.js";
+const getInitialSize = (override) => {
+  if (typeof window === "undefined") {
+    return {
+      width: (override == null ? void 0 : override.width) ?? CHART_MODAL.FALLBACK_WIDTH,
+      height: (override == null ? void 0 : override.height) ?? CHART_MODAL.FALLBACK_HEIGHT
+    };
+  }
+  const w = Math.min((override == null ? void 0 : override.width) ?? CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - VIEWPORT_MARGIN);
+  const h = Math.min((override == null ? void 0 : override.height) ?? CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - VIEWPORT_MARGIN);
+  return { width: Math.max(w, CHART_MODAL.MIN_WIDTH), height: Math.max(h, CHART_MODAL.MIN_HEIGHT) };
+};
+const ChartExpandModal = ({
+  title,
+  children,
+  onClose,
+  resizable = false,
+  defaultSize,
+  actions
+}) => {
+  const [size, setSize] = useState(() => getInitialSize(defaultSize));
+  const [isReady, setIsReady] = useState(false);
+  const bodyRef = useRef(null);
+  useEscapeKey(onClose);
+  useEffect(() => {
+    if (!resizable) return;
+    const handleResize = () => setSize(getInitialSize(defaultSize));
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [resizable, defaultSize]);
+  useEffect(() => {
+    const check = () => {
+      const body = bodyRef.current;
+      if (body && body.clientWidth > 0 && body.clientHeight > 0) {
+        setIsReady(true);
+      } else {
+        requestAnimationFrame(check);
+      }
+    };
+    requestAnimationFrame(check);
+  }, []);
+  const handleResizeStart = useCallback(
+    (e) => {
+      var _a, _b;
+      if (!resizable || typeof window === "undefined") return;
+      e.preventDefault();
+      const startX = "touches" in e ? ((_a = e.touches[0]) == null ? void 0 : _a.clientX) ?? 0 : e.clientX;
+      const startY = "touches" in e ? ((_b = e.touches[0]) == null ? void 0 : _b.clientY) ?? 0 : e.clientY;
+      const startW = size.width;
+      const startH = size.height;
+      const handleMove = (ev) => {
+        var _a2, _b2;
+        const cx = ev instanceof TouchEvent ? ((_a2 = ev.touches[0]) == null ? void 0 : _a2.clientX) ?? 0 : ev.clientX;
+        const cy = ev instanceof TouchEvent ? ((_b2 = ev.touches[0]) == null ? void 0 : _b2.clientY) ?? 0 : ev.clientY;
+        const maxW = Math.min(window.innerWidth - VIEWPORT_MARGIN, CHART_MODAL.MAX_WIDTH);
+        const maxH = Math.min(window.innerHeight - VIEWPORT_MARGIN, CHART_MODAL.MAX_HEIGHT);
+        setSize({
+          width: Math.min(Math.max(startW + (cx - startX), CHART_MODAL.MIN_WIDTH), maxW),
+          height: Math.min(Math.max(startH + (cy - startY), CHART_MODAL.MIN_HEIGHT), maxH)
+        });
+      };
+      const handleUp = () => {
+        window.removeEventListener("mousemove", handleMove);
+        window.removeEventListener("mouseup", handleUp);
+        window.removeEventListener("touchmove", handleMove);
+        window.removeEventListener("touchend", handleUp);
+      };
+      window.addEventListener("mousemove", handleMove);
+      window.addEventListener("mouseup", handleUp);
+      window.addEventListener("touchmove", handleMove, { passive: false });
+      window.addEventListener("touchend", handleUp);
+    },
+    [resizable, size]
+  );
+  if (typeof document === "undefined") return null;
+  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : void 0;
+  return createPortal(
+    /* @__PURE__ */ jsx("div", { className: styles.overlay, role: "dialog", "aria-modal": "true", children: /* @__PURE__ */ jsxs("div", { className: clsx(styles.modal, { [styles.resizable]: resizable }), style: modalStyle, children: [
+      /* @__PURE__ */ jsxs("header", { className: styles.header, children: [
+        /* @__PURE__ */ jsx("h2", { className: styles.title, children: title }),
+        /* @__PURE__ */ jsxs("div", { className: styles.headerActions, children: [
+          actions,
+          /* @__PURE__ */ jsx("button", { type: "button", className: styles.close, onClick: onClose, "aria-label": "Close expanded chart", children: /* @__PURE__ */ jsxs("svg", { width: ICON_SIZE.LG, height: ICON_SIZE.LG, viewBox: SVG_VIEWBOX, fill: "none", stroke: "currentColor", strokeWidth: SVG_STROKE_WIDTH, strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+            /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+          ] }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: styles.body, ref: bodyRef, children: isReady ? children : /* @__PURE__ */ jsx("div", { className: styles.loading, children: "Loading chart..." }) }),
+      resizable && /* @__PURE__ */ jsx("div", { className: styles.resizeHandle, onMouseDown: handleResizeStart, onTouchStart: handleResizeStart, children: /* @__PURE__ */ jsx("span", {}) })
+    ] }) }),
+    document.body
+  );
+};
 export {
-  ChatLayout
+  ChartExpandModal
 };
 //# sourceMappingURL=index14.js.map

package/dist/index14.js.map

@@ -1 +1 @@
-{"version":3,"file":"index14.js","sources":["../src/layouts/ChatLayout/ChatLayout.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ChatLayoutProps } from './ChatLayout.types';\nimport styles from './ChatLayout.module.css';\n\nexport const ChatLayout = ({\n  sidebar,\n  conversationList,\n  messageArea,\n  inputArea,\n  sidebarCollapsed = false,\n  showConversationList = true,\n  className,\n}: ChatLayoutProps) => (\n  <div className={clsx(styles.root, className)}>\n    {sidebar && !sidebarCollapsed && (\n      <aside className={styles.sidebar}>{sidebar}</aside>\n    )}\n\n    {conversationList && showConversationList && (\n      <aside className={styles.conversationList}>{conversationList}</aside>\n    )}\n\n    <main className={styles.mainArea}>\n      <div className={styles.messages}>{messageArea}</div>\n      <div className={styles.input}>{inputArea}</div>\n    </main>\n  </div>\n);\n\nChatLayout.displayName = 'ChatLayout';\n"],"names":[],"mappings":";;;AAIO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB,uBAAuB;AAAA,EACvB;AACF,2BACG,OAAA,EAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GACxC,UAAA;AAAA,EAAA,WAAW,CAAC,oBACX,oBAAC,WAAM,WAAW,OAAO,SAAU,UAAA,SAAQ;AAAA,EAG5C,oBAAoB,wBACnB,oBAAC,WAAM,WAAW,OAAO,kBAAmB,UAAA,kBAAiB;AAAA,EAG/D,qBAAC,QAAA,EAAK,WAAW,OAAO,UACtB,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAI,WAAW,OAAO,UAAW,UAAA,aAAY;AAAA,IAC9C,oBAAC,OAAA,EAAI,WAAW,OAAO,OAAQ,UAAA,UAAA,CAAU;AAAA,EAAA,EAAA,CAC3C;AAAA,EAAA,CACF;AAGF,WAAW,cAAc;"}
+{"version":3,"file":"index14.js","sources":["../src/composites/ChartExpandModal/ChartExpandModal.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { CHART_MODAL, VIEWPORT_MARGIN, ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport clsx from 'clsx';\nimport styles from './ChartExpandModal.module.css';\n\nexport interface ChartExpandModalProps {\n  /** Title displayed in the modal header. */\n  title: string;\n  /** Content to render inside the modal body. */\n  children: ReactNode;\n  /** Called when the modal should close. */\n  onClose: () => void;\n  /** Enable resize handles on the modal. */\n  resizable?: boolean;\n  /** Default modal dimensions in pixels. */\n  defaultSize?: { width?: number; height?: number };\n  /** Additional actions rendered in the header. */\n  actions?: ReactNode;\n}\n\nconst getInitialSize = (override?: { width?: number; height?: number }) => {\n  if (typeof window === 'undefined') {\n    return {\n      width: override?.width ?? CHART_MODAL.FALLBACK_WIDTH,\n      height: override?.height ?? CHART_MODAL.FALLBACK_HEIGHT,\n    };\n  }\n  const w = Math.min(override?.width ?? CHART_MODAL.DEFAULT_WIDTH, window.innerWidth - VIEWPORT_MARGIN);\n  const h = Math.min(override?.height ?? CHART_MODAL.DEFAULT_HEIGHT, window.innerHeight - VIEWPORT_MARGIN);\n  return { width: Math.max(w, CHART_MODAL.MIN_WIDTH), height: Math.max(h, CHART_MODAL.MIN_HEIGHT) };\n};\n\nexport const ChartExpandModal = ({\n  title,\n  children,\n  onClose,\n  resizable = false,\n  defaultSize,\n  actions,\n}: ChartExpandModalProps) => {\n  const [size, setSize] = useState(() => getInitialSize(defaultSize));\n  const [isReady, setIsReady] = useState(false);\n  const bodyRef = useRef<HTMLDivElement>(null);\n\n  useEscapeKey(onClose);\n\n  useEffect(() => {\n    if (!resizable) return;\n    const handleResize = () => setSize(getInitialSize(defaultSize));\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, [resizable, defaultSize]);\n\n  useEffect(() => {\n    const check = () => {\n      const body = bodyRef.current;\n      if (body && body.clientWidth > 0 && body.clientHeight > 0) {\n        setIsReady(true);\n      } else {\n        requestAnimationFrame(check);\n      }\n    };\n    requestAnimationFrame(check);\n  }, []);\n\n  const handleResizeStart = useCallback(\n    (e: React.MouseEvent | React.TouchEvent) => {\n      if (!resizable || typeof window === 'undefined') return;\n      e.preventDefault();\n      const startX = 'touches' in e ? e.touches[0]?.clientX ?? 0 : e.clientX;\n      const startY = 'touches' in e ? e.touches[0]?.clientY ?? 0 : e.clientY;\n      const startW = size.width;\n      const startH = size.height;\n\n      const handleMove = (ev: MouseEvent | TouchEvent) => {\n        const cx = ev instanceof TouchEvent ? ev.touches[0]?.clientX ?? 0 : (ev as MouseEvent).clientX;\n        const cy = ev instanceof TouchEvent ? ev.touches[0]?.clientY ?? 0 : (ev as MouseEvent).clientY;\n        const maxW = Math.min(window.innerWidth - VIEWPORT_MARGIN, CHART_MODAL.MAX_WIDTH);\n        const maxH = Math.min(window.innerHeight - VIEWPORT_MARGIN, CHART_MODAL.MAX_HEIGHT);\n        setSize({\n          width: Math.min(Math.max(startW + (cx - startX), CHART_MODAL.MIN_WIDTH), maxW),\n          height: Math.min(Math.max(startH + (cy - startY), CHART_MODAL.MIN_HEIGHT), maxH),\n        });\n      };\n\n      const handleUp = () => {\n        window.removeEventListener('mousemove', handleMove);\n        window.removeEventListener('mouseup', handleUp);\n        window.removeEventListener('touchmove', handleMove as EventListener);\n        window.removeEventListener('touchend', handleUp);\n      };\n\n      window.addEventListener('mousemove', handleMove);\n      window.addEventListener('mouseup', handleUp);\n      window.addEventListener('touchmove', handleMove as EventListener, { passive: false });\n      window.addEventListener('touchend', handleUp);\n    },\n    [resizable, size],\n  );\n\n  if (typeof document === 'undefined') return null;\n\n  const modalStyle = resizable ? { width: `${size.width}px`, height: `${size.height}px` } : undefined;\n\n  return createPortal(\n    <div className={styles.overlay} role=\"dialog\" aria-modal=\"true\">\n      <div className={clsx(styles.modal, { [styles.resizable]: resizable })} style={modalStyle}>\n        <header className={styles.header}>\n          <h2 className={styles.title}>{title}</h2>\n          <div className={styles.headerActions}>\n            {actions}\n            <button type=\"button\" className={styles.close} onClick={onClose} aria-label=\"Close expanded chart\">\n              <svg width={ICON_SIZE.LG} height={ICON_SIZE.LG} viewBox={SVG_VIEWBOX} fill=\"none\" stroke=\"currentColor\" strokeWidth={SVG_STROKE_WIDTH} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n                <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n              </svg>\n            </button>\n          </div>\n        </header>\n        <div className={styles.body} ref={bodyRef}>\n          {isReady ? children : <div className={styles.loading}>Loading chart...</div>}\n        </div>\n        {resizable && (\n          <div className={styles.resizeHandle} onMouseDown={handleResizeStart} onTouchStart={handleResizeStart}>\n            <span />\n          </div>\n        )}\n      </div>\n    </div>,\n    document.body,\n  );\n};\n"],"names":["_a","_b"],"mappings":"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"}