react-panel-layout 0.5.1 → 0.6.0

package/dist/{FloatingPanelFrame-D9Cp2al1.cjs → FloatingPanelFrame-CEmXDvUA.cjs}

@@ -1,2 +1,2 @@
-"use strict";const s=require("react/jsx-runtime"),E=require("react"),o=require("./styles-PsqGOEJP.cjs");function f(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,l.get?l:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const a=f(E),h={borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,boxShadow:o.FLOATING_PANEL_SHADOW},u={borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,overflow:"hidden"},_={display:"flex",flexDirection:"column",borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,border:`1px solid ${o.FLOATING_PANEL_BORDER_COLOR}`,background:o.FLOATING_PANEL_SURFACE_COLOR},T={display:"flex",alignItems:"center",gap:o.FLOATING_PANEL_GAP,padding:`${o.FLOATING_PANEL_HEADER_PADDING_Y} ${o.FLOATING_PANEL_HEADER_PADDING_X}`,borderBottom:`1px solid ${o.FLOATING_PANEL_BORDER_COLOR}`,background:o.FLOATING_PANEL_SURFACE_2_COLOR},y={fontWeight:600},I={marginLeft:"auto",color:o.FLOATING_PANEL_MUTED_FG_COLOR,fontSize:o.FLOATING_PANEL_META_FONT_SIZE},G={display:"flex",alignItems:"center",gap:o.FLOATING_PANEL_CONTROLS_GAP},C={border:"none",background:"transparent",cursor:"pointer",fontSize:o.FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE,padding:o.FLOATING_PANEL_CLOSE_BUTTON_PADDING,lineHeight:1},D={padding:o.FLOATING_PANEL_CONTENT_PADDING,overflow:"auto"},N=a.forwardRef(function({style:e,children:n,...l},c){const m=a.useMemo(()=>({...h,...e}),[e]),R=a.useMemo(()=>{const r=e?.borderRadius!==void 0,d=e?.height!==void 0;if(!r&&!d)return u;const i={...u};return r&&(i.borderRadius=e.borderRadius),d&&(i.height=e.height),i},[e?.borderRadius,e?.height]),b=a.useMemo(()=>{const r=e?.borderRadius!==void 0,d=e?.height!==void 0;if(!r&&!d)return _;const i={..._};return r&&(i.borderRadius=e.borderRadius),d&&(i.height=e.height),i},[e?.borderRadius,e?.height]);return s.jsx("div",{ref:c,style:m,...l,children:s.jsx("div",{style:R,children:s.jsx("div",{style:b,children:n})})})}),g=({style:t,...e})=>{const n=a.useMemo(()=>({...T,...t}),[t]);return s.jsx("div",{style:n,...e})},A=({style:t,...e})=>{const n=a.useMemo(()=>({...y,...t}),[t]);return s.jsx("span",{style:n,...e})},F=({style:t,...e})=>{const n=a.useMemo(()=>({...I,...t}),[t]);return s.jsx("span",{style:n,...e})},O=({style:t,...e})=>{const n=a.useMemo(()=>({...G,...t}),[t]);return s.jsx("div",{style:n,...e})},P=a.forwardRef(function({style:e,...n},l){const c=a.useMemo(()=>({...D,...e}),[e]);return s.jsx("div",{ref:l,style:c,...n})}),L=({style:t,...e})=>{const n=a.useMemo(()=>({...C,...t}),[t]);return s.jsx("button",{type:"button",style:n,...e,children:"×"})};N.displayName="FloatingPanelFrame";g.displayName="FloatingPanelHeader";A.displayName="FloatingPanelTitle";F.displayName="FloatingPanelMeta";O.displayName="FloatingPanelControls";P.displayName="FloatingPanelContent";L.displayName="FloatingPanelCloseButton";exports.FloatingPanelCloseButton=L;exports.FloatingPanelContent=P;exports.FloatingPanelControls=O;exports.FloatingPanelFrame=N;exports.FloatingPanelHeader=g;exports.FloatingPanelMeta=F;exports.FloatingPanelTitle=A;
-//# sourceMappingURL=FloatingPanelFrame-D9Cp2al1.cjs.map
+"use strict";const s=require("react/jsx-runtime"),E=require("react"),o=require("./styles-qf6ptVLD.cjs");function f(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,l.get?l:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const a=f(E),h={borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,boxShadow:o.FLOATING_PANEL_SHADOW},u={borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,overflow:"hidden"},_={display:"flex",flexDirection:"column",borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,border:`1px solid ${o.FLOATING_PANEL_BORDER_COLOR}`,background:o.FLOATING_PANEL_SURFACE_COLOR},T={display:"flex",alignItems:"center",gap:o.FLOATING_PANEL_GAP,padding:`${o.FLOATING_PANEL_HEADER_PADDING_Y} ${o.FLOATING_PANEL_HEADER_PADDING_X}`,borderBottom:`1px solid ${o.FLOATING_PANEL_BORDER_COLOR}`,background:o.FLOATING_PANEL_SURFACE_2_COLOR},y={fontWeight:600},I={marginLeft:"auto",color:o.FLOATING_PANEL_MUTED_FG_COLOR,fontSize:o.FLOATING_PANEL_META_FONT_SIZE},G={display:"flex",alignItems:"center",gap:o.FLOATING_PANEL_CONTROLS_GAP},C={border:"none",background:"transparent",cursor:"pointer",fontSize:o.FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE,padding:o.FLOATING_PANEL_CLOSE_BUTTON_PADDING,lineHeight:1},D={padding:o.FLOATING_PANEL_CONTENT_PADDING,overflow:"auto"},N=a.forwardRef(function({style:e,children:n,...l},c){const m=a.useMemo(()=>({...h,...e}),[e]),R=a.useMemo(()=>{const r=e?.borderRadius!==void 0,d=e?.height!==void 0;if(!r&&!d)return u;const i={...u};return r&&(i.borderRadius=e.borderRadius),d&&(i.height=e.height),i},[e?.borderRadius,e?.height]),b=a.useMemo(()=>{const r=e?.borderRadius!==void 0,d=e?.height!==void 0;if(!r&&!d)return _;const i={..._};return r&&(i.borderRadius=e.borderRadius),d&&(i.height=e.height),i},[e?.borderRadius,e?.height]);return s.jsx("div",{ref:c,style:m,...l,children:s.jsx("div",{style:R,children:s.jsx("div",{style:b,children:n})})})}),g=({style:t,...e})=>{const n=a.useMemo(()=>({...T,...t}),[t]);return s.jsx("div",{style:n,...e})},A=({style:t,...e})=>{const n=a.useMemo(()=>({...y,...t}),[t]);return s.jsx("span",{style:n,...e})},F=({style:t,...e})=>{const n=a.useMemo(()=>({...I,...t}),[t]);return s.jsx("span",{style:n,...e})},O=({style:t,...e})=>{const n=a.useMemo(()=>({...G,...t}),[t]);return s.jsx("div",{style:n,...e})},P=a.forwardRef(function({style:e,...n},l){const c=a.useMemo(()=>({...D,...e}),[e]);return s.jsx("div",{ref:l,style:c,...n})}),L=({style:t,...e})=>{const n=a.useMemo(()=>({...C,...t}),[t]);return s.jsx("button",{type:"button",style:n,...e,children:"×"})};N.displayName="FloatingPanelFrame";g.displayName="FloatingPanelHeader";A.displayName="FloatingPanelTitle";F.displayName="FloatingPanelMeta";O.displayName="FloatingPanelControls";P.displayName="FloatingPanelContent";L.displayName="FloatingPanelCloseButton";exports.FloatingPanelCloseButton=L;exports.FloatingPanelContent=P;exports.FloatingPanelControls=O;exports.FloatingPanelFrame=N;exports.FloatingPanelHeader=g;exports.FloatingPanelMeta=F;exports.FloatingPanelTitle=A;
+//# sourceMappingURL=FloatingPanelFrame-CEmXDvUA.cjs.map

package/dist/FloatingPanelFrame-CEmXDvUA.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPanelFrame-CEmXDvUA.cjs","sources":["../src/components/paneling/FloatingPanelFrame.tsx"],"sourcesContent":["/**\n * @file Shared floating panel frame components for reusable overlay styling\n */\nimport * as React from \"react\";\nimport {\n  FLOATING_PANEL_BORDER_RADIUS,\n  FLOATING_PANEL_GAP,\n  FLOATING_PANEL_HEADER_PADDING_Y,\n  FLOATING_PANEL_HEADER_PADDING_X,\n  FLOATING_PANEL_CONTENT_PADDING,\n  FLOATING_PANEL_META_FONT_SIZE,\n  FLOATING_PANEL_CONTROLS_GAP,\n  FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE,\n  FLOATING_PANEL_CLOSE_BUTTON_PADDING,\n  FLOATING_PANEL_SURFACE_COLOR,\n  FLOATING_PANEL_SURFACE_2_COLOR,\n  FLOATING_PANEL_BORDER_COLOR,\n  FLOATING_PANEL_MUTED_FG_COLOR,\n  FLOATING_PANEL_SHADOW,\n} from \"../../constants/styles\";\n\nconst shadowWrapperStyle: React.CSSProperties = {\n  borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n  boxShadow: FLOATING_PANEL_SHADOW,\n};\n\nconst overflowWrapperStyle: React.CSSProperties = {\n  borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n  overflow: \"hidden\",\n};\n\nconst innerStyle: React.CSSProperties = {\n  display: \"flex\",\n  flexDirection: \"column\",\n  borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n  border: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n  background: FLOATING_PANEL_SURFACE_COLOR,\n};\n\nconst headerStyle: React.CSSProperties = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: FLOATING_PANEL_GAP,\n  padding: `${FLOATING_PANEL_HEADER_PADDING_Y} ${FLOATING_PANEL_HEADER_PADDING_X}`,\n  borderBottom: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n  background: FLOATING_PANEL_SURFACE_2_COLOR,\n};\n\nconst titleStyle: React.CSSProperties = {\n  fontWeight: 600,\n};\n\nconst metaStyle: React.CSSProperties = {\n  marginLeft: \"auto\",\n  color: FLOATING_PANEL_MUTED_FG_COLOR,\n  fontSize: FLOATING_PANEL_META_FONT_SIZE,\n};\n\nconst controlsStyle: React.CSSProperties = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: FLOATING_PANEL_CONTROLS_GAP,\n};\n\nconst closeButtonStyle: React.CSSProperties = {\n  border: \"none\",\n  background: \"transparent\",\n  cursor: \"pointer\",\n  fontSize: FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE,\n  padding: FLOATING_PANEL_CLOSE_BUTTON_PADDING,\n  lineHeight: 1,\n};\n\nconst contentStyle: React.CSSProperties = {\n  padding: FLOATING_PANEL_CONTENT_PADDING,\n  overflow: \"auto\",\n};\n\nexport type FloatingPanelFrameProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelFrame = React.forwardRef<HTMLDivElement, FloatingPanelFrameProps>(function FloatingPanelFrame(\n  { style: propStyle, children, ...props },\n  ref,\n) {\n  const combinedShadowStyle = React.useMemo(() => ({ ...shadowWrapperStyle, ...propStyle }), [propStyle]);\n\n  const combinedOverflowStyle = React.useMemo(() => {\n    const hasCustomBorderRadius = propStyle?.borderRadius !== undefined;\n    const hasHeight = propStyle?.height !== undefined;\n\n    if (!hasCustomBorderRadius && !hasHeight) {\n      return overflowWrapperStyle;\n    }\n\n    const result: React.CSSProperties = { ...overflowWrapperStyle };\n    if (hasCustomBorderRadius) {\n      result.borderRadius = propStyle.borderRadius;\n    }\n    if (hasHeight) {\n      result.height = propStyle.height;\n    }\n    return result;\n  }, [propStyle?.borderRadius, propStyle?.height]);\n\n  const combinedInnerStyle = React.useMemo(() => {\n    const hasCustomBorderRadius = propStyle?.borderRadius !== undefined;\n    const hasHeight = propStyle?.height !== undefined;\n\n    if (!hasCustomBorderRadius && !hasHeight) {\n      return innerStyle;\n    }\n\n    const result: React.CSSProperties = { ...innerStyle };\n    if (hasCustomBorderRadius) {\n      result.borderRadius = propStyle.borderRadius;\n    }\n    if (hasHeight) {\n      result.height = propStyle.height;\n    }\n    return result;\n  }, [propStyle?.borderRadius, propStyle?.height]);\n\n  return (\n    <div ref={ref} style={combinedShadowStyle} {...props}>\n      <div style={combinedOverflowStyle}>\n        <div style={combinedInnerStyle}>{children}</div>\n      </div>\n    </div>\n  );\n});\n\nexport type FloatingPanelHeaderProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelHeader: React.FC<FloatingPanelHeaderProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...headerStyle, ...propStyle }), [propStyle]);\n  return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelTitleProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelTitle: React.FC<FloatingPanelTitleProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...titleStyle, ...propStyle }), [propStyle]);\n  return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelMetaProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelMeta: React.FC<FloatingPanelMetaProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...metaStyle, ...propStyle }), [propStyle]);\n  return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelControlsProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelControls: React.FC<FloatingPanelControlsProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...controlsStyle, ...propStyle }), [propStyle]);\n  return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelContent = React.forwardRef<HTMLDivElement, FloatingPanelContentProps>(\n  function FloatingPanelContent({ style: propStyle, ...props }, ref) {\n    const combinedStyle = React.useMemo(() => ({ ...contentStyle, ...propStyle }), [propStyle]);\n    return <div ref={ref} style={combinedStyle} {...props} />;\n  },\n);\n\nexport type FloatingPanelCloseButtonProps = Omit<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  \"className\" | \"style\" | \"children\"\n> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelCloseButton: React.FC<FloatingPanelCloseButtonProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...closeButtonStyle, ...propStyle }), [propStyle]);\n  return (\n    <button type=\"button\" style={combinedStyle} {...props}>\n      ×\n    </button>\n  );\n};\n\nFloatingPanelFrame.displayName = \"FloatingPanelFrame\";\nFloatingPanelHeader.displayName = \"FloatingPanelHeader\";\nFloatingPanelTitle.displayName = \"FloatingPanelTitle\";\nFloatingPanelMeta.displayName = \"FloatingPanelMeta\";\nFloatingPanelControls.displayName = \"FloatingPanelControls\";\nFloatingPanelContent.displayName = \"FloatingPanelContent\";\nFloatingPanelCloseButton.displayName = \"FloatingPanelCloseButton\";\n"],"names":["shadowWrapperStyle","FLOATING_PANEL_BORDER_RADIUS","FLOATING_PANEL_SHADOW","overflowWrapperStyle","innerStyle","FLOATING_PANEL_BORDER_COLOR","FLOATING_PANEL_SURFACE_COLOR","headerStyle","FLOATING_PANEL_GAP","FLOATING_PANEL_HEADER_PADDING_Y","FLOATING_PANEL_HEADER_PADDING_X","FLOATING_PANEL_SURFACE_2_COLOR","titleStyle","metaStyle","FLOATING_PANEL_MUTED_FG_COLOR","FLOATING_PANEL_META_FONT_SIZE","controlsStyle","FLOATING_PANEL_CONTROLS_GAP","closeButtonStyle","FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE","FLOATING_PANEL_CLOSE_BUTTON_PADDING","contentStyle","FLOATING_PANEL_CONTENT_PADDING","FloatingPanelFrame","React","propStyle","children","props","ref","combinedShadowStyle","combinedOverflowStyle","hasCustomBorderRadius","hasHeight","result","combinedInnerStyle","jsx","FloatingPanelHeader","combinedStyle","FloatingPanelTitle","FloatingPanelMeta","FloatingPanelControls","FloatingPanelContent","FloatingPanelCloseButton"],"mappings":"kYAqBMA,EAA0C,CAC9C,aAAcC,EAAAA,6BACd,UAAWC,EAAAA,qBACb,EAEMC,EAA4C,CAChD,aAAcF,EAAAA,6BACd,SAAU,QACZ,EAEMG,EAAkC,CACtC,QAAS,OACT,cAAe,SACf,aAAcH,EAAAA,6BACd,OAAQ,aAAaI,EAAAA,2BAA2B,GAChD,WAAYC,EAAAA,4BACd,EAEMC,EAAmC,CACvC,QAAS,OACT,WAAY,SACZ,IAAKC,EAAAA,mBACL,QAAS,GAAGC,EAAAA,+BAA+B,IAAIC,EAAAA,+BAA+B,GAC9E,aAAc,aAAaL,EAAAA,2BAA2B,GACtD,WAAYM,EAAAA,8BACd,EAEMC,EAAkC,CACtC,WAAY,GACd,EAEMC,EAAiC,CACrC,WAAY,OACZ,MAAOC,EAAAA,8BACP,SAAUC,EAAAA,6BACZ,EAEMC,EAAqC,CACzC,QAAS,OACT,WAAY,SACZ,IAAKC,EAAAA,2BACP,EAEMC,EAAwC,CAC5C,OAAQ,OACR,WAAY,cACZ,OAAQ,UACR,SAAUC,EAAAA,sCACV,QAASC,EAAAA,oCACT,WAAY,CACd,EAEMC,EAAoC,CACxC,QAASC,EAAAA,+BACT,SAAU,MACZ,EAMaC,EAAqBC,EAAM,WAAoD,SAC1F,CAAE,MAAOC,EAAW,SAAAC,EAAU,GAAGC,CAAA,EACjCC,EACA,CACA,MAAMC,EAAsBL,EAAM,QAAQ,KAAO,CAAE,GAAGxB,EAAoB,GAAGyB,CAAA,GAAc,CAACA,CAAS,CAAC,EAEhGK,EAAwBN,EAAM,QAAQ,IAAM,CAChD,MAAMO,EAAwBN,GAAW,eAAiB,OACpDO,EAAYP,GAAW,SAAW,OAExC,GAAI,CAACM,GAAyB,CAACC,EAC7B,OAAO7B,EAGT,MAAM8B,EAA8B,CAAE,GAAG9B,CAAA,EACzC,OAAI4B,IACFE,EAAO,aAAeR,EAAU,cAE9BO,IACFC,EAAO,OAASR,EAAU,QAErBQ,CACT,EAAG,CAACR,GAAW,aAAcA,GAAW,MAAM,CAAC,EAEzCS,EAAqBV,EAAM,QAAQ,IAAM,CAC7C,MAAMO,EAAwBN,GAAW,eAAiB,OACpDO,EAAYP,GAAW,SAAW,OAExC,GAAI,CAACM,GAAyB,CAACC,EAC7B,OAAO5B,EAGT,MAAM6B,EAA8B,CAAE,GAAG7B,CAAA,EACzC,OAAI2B,IACFE,EAAO,aAAeR,EAAU,cAE9BO,IACFC,EAAO,OAASR,EAAU,QAErBQ,CACT,EAAG,CAACR,GAAW,aAAcA,GAAW,MAAM,CAAC,EAE/C,aACG,MAAA,CAAI,IAAAG,EAAU,MAAOC,EAAsB,GAAGF,EAC7C,SAAAQ,EAAAA,IAAC,MAAA,CAAI,MAAOL,EACV,SAAAK,EAAAA,IAAC,MAAA,CAAI,MAAOD,EAAqB,SAAAR,CAAA,CAAS,EAC5C,EACF,CAEJ,CAAC,EAMYU,EAA0D,CAAC,CAAE,MAAOX,EAAW,GAAGE,KAAY,CACzG,MAAMU,EAAgBb,EAAM,QAAQ,KAAO,CAAE,GAAGjB,EAAa,GAAGkB,CAAA,GAAc,CAACA,CAAS,CAAC,EACzF,OAAOU,EAAAA,IAAC,MAAA,CAAI,MAAOE,EAAgB,GAAGV,EAAO,CAC/C,EAMaW,EAAwD,CAAC,CAAE,MAAOb,EAAW,GAAGE,KAAY,CACvG,MAAMU,EAAgBb,EAAM,QAAQ,KAAO,CAAE,GAAGZ,EAAY,GAAGa,CAAA,GAAc,CAACA,CAAS,CAAC,EACxF,OAAOU,EAAAA,IAAC,OAAA,CAAK,MAAOE,EAAgB,GAAGV,EAAO,CAChD,EAMaY,EAAsD,CAAC,CAAE,MAAOd,EAAW,GAAGE,KAAY,CACrG,MAAMU,EAAgBb,EAAM,QAAQ,KAAO,CAAE,GAAGX,EAAW,GAAGY,CAAA,GAAc,CAACA,CAAS,CAAC,EACvF,OAAOU,EAAAA,IAAC,OAAA,CAAK,MAAOE,EAAgB,GAAGV,EAAO,CAChD,EAMaa,EAA8D,CAAC,CAAE,MAAOf,EAAW,GAAGE,KAAY,CAC7G,MAAMU,EAAgBb,EAAM,QAAQ,KAAO,CAAE,GAAGR,EAAe,GAAGS,CAAA,GAAc,CAACA,CAAS,CAAC,EAC3F,OAAOU,EAAAA,IAAC,MAAA,CAAI,MAAOE,EAAgB,GAAGV,EAAO,CAC/C,EAMac,EAAuBjB,EAAM,WACxC,SAA8B,CAAE,MAAOC,EAAW,GAAGE,CAAA,EAASC,EAAK,CACjE,MAAMS,EAAgBb,EAAM,QAAQ,KAAO,CAAE,GAAGH,EAAc,GAAGI,CAAA,GAAc,CAACA,CAAS,CAAC,EAC1F,aAAQ,MAAA,CAAI,IAAAG,EAAU,MAAOS,EAAgB,GAAGV,EAAO,CACzD,CACF,EASae,EAAoE,CAAC,CAAE,MAAOjB,EAAW,GAAGE,KAAY,CACnH,MAAMU,EAAgBb,EAAM,QAAQ,KAAO,CAAE,GAAGN,EAAkB,GAAGO,CAAA,GAAc,CAACA,CAAS,CAAC,EAC9F,OACEU,MAAC,UAAO,KAAK,SAAS,MAAOE,EAAgB,GAAGV,EAAO,SAAA,GAAA,CAEvD,CAEJ,EAEAJ,EAAmB,YAAc,qBACjCa,EAAoB,YAAc,sBAClCE,EAAmB,YAAc,qBACjCC,EAAkB,YAAc,oBAChCC,EAAsB,YAAc,wBACpCC,EAAqB,YAAc,uBACnCC,EAAyB,YAAc"}

package/dist/{FloatingPanelFrame-6W5OexYe.js → FloatingPanelFrame-SgYLc6Ud.js}

@@ -1,6 +1,6 @@
 import { jsx as s } from "react/jsx-runtime";
 import * as o from "react";
-import { F, a as c, b as L, c as N, d as P, e as O, f as h, g as b, h as R, i as f, j as E, k as T, l as y, m as I } from "./styles-CA2_zLZt.js";
+import { F, d as c, e as L, f as N, g as P, h as O, i as h, j as b, k as R, l as f, m as E, n as T, o as y, p as I } from "./styles-DPPuJ0sf.js";
 const G = {
   borderRadius: c,
   boxShadow: F
@@ -16,35 +16,32 @@ const G = {
 }, C = {
   display: "flex",
   alignItems: "center",
-  gap: b,
-  padding: `${O} ${h}`,
+  gap: R,
+  padding: `${h} ${b}`,
   borderBottom: `1px solid ${N}`,
-  background: P
+  background: O
 }, D = {
   fontWeight: 600
 }, v = {
   marginLeft: "auto",
-  color: f,
-  fontSize: R
+  color: I,
+  fontSize: y
 }, M = {
   display: "flex",
   alignItems: "center",
-  gap: E
+  gap: f
 }, S = {
   border: "none",
   background: "transparent",
   cursor: "pointer",
-  fontSize: I,
-  padding: y,
+  fontSize: T,
+  padding: E,
   lineHeight: 1
 }, B = {
-  padding: T,
+  padding: P,
   overflow: "auto"
 }, w = o.forwardRef(function({ style: e, children: n, ...d }, r) {
-  const m = o.useMemo(
-    () => ({ ...G, ...e }),
-    [e]
-  ), A = o.useMemo(() => {
+  const m = o.useMemo(() => ({ ...G, ...e }), [e]), A = o.useMemo(() => {
     const i = e?.borderRadius !== void 0, l = e?.height !== void 0;
     if (!i && !l)
       return u;
@@ -95,4 +92,4 @@ export {
   W as e,
   $ as f
 };
-//# sourceMappingURL=FloatingPanelFrame-6W5OexYe.js.map
+//# sourceMappingURL=FloatingPanelFrame-SgYLc6Ud.js.map

package/dist/FloatingPanelFrame-SgYLc6Ud.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPanelFrame-SgYLc6Ud.js","sources":["../src/components/paneling/FloatingPanelFrame.tsx"],"sourcesContent":["/**\n * @file Shared floating panel frame components for reusable overlay styling\n */\nimport * as React from \"react\";\nimport {\n  FLOATING_PANEL_BORDER_RADIUS,\n  FLOATING_PANEL_GAP,\n  FLOATING_PANEL_HEADER_PADDING_Y,\n  FLOATING_PANEL_HEADER_PADDING_X,\n  FLOATING_PANEL_CONTENT_PADDING,\n  FLOATING_PANEL_META_FONT_SIZE,\n  FLOATING_PANEL_CONTROLS_GAP,\n  FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE,\n  FLOATING_PANEL_CLOSE_BUTTON_PADDING,\n  FLOATING_PANEL_SURFACE_COLOR,\n  FLOATING_PANEL_SURFACE_2_COLOR,\n  FLOATING_PANEL_BORDER_COLOR,\n  FLOATING_PANEL_MUTED_FG_COLOR,\n  FLOATING_PANEL_SHADOW,\n} from \"../../constants/styles\";\n\nconst shadowWrapperStyle: React.CSSProperties = {\n  borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n  boxShadow: FLOATING_PANEL_SHADOW,\n};\n\nconst overflowWrapperStyle: React.CSSProperties = {\n  borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n  overflow: \"hidden\",\n};\n\nconst innerStyle: React.CSSProperties = {\n  display: \"flex\",\n  flexDirection: \"column\",\n  borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n  border: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n  background: FLOATING_PANEL_SURFACE_COLOR,\n};\n\nconst headerStyle: React.CSSProperties = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: FLOATING_PANEL_GAP,\n  padding: `${FLOATING_PANEL_HEADER_PADDING_Y} ${FLOATING_PANEL_HEADER_PADDING_X}`,\n  borderBottom: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n  background: FLOATING_PANEL_SURFACE_2_COLOR,\n};\n\nconst titleStyle: React.CSSProperties = {\n  fontWeight: 600,\n};\n\nconst metaStyle: React.CSSProperties = {\n  marginLeft: \"auto\",\n  color: FLOATING_PANEL_MUTED_FG_COLOR,\n  fontSize: FLOATING_PANEL_META_FONT_SIZE,\n};\n\nconst controlsStyle: React.CSSProperties = {\n  display: \"flex\",\n  alignItems: \"center\",\n  gap: FLOATING_PANEL_CONTROLS_GAP,\n};\n\nconst closeButtonStyle: React.CSSProperties = {\n  border: \"none\",\n  background: \"transparent\",\n  cursor: \"pointer\",\n  fontSize: FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE,\n  padding: FLOATING_PANEL_CLOSE_BUTTON_PADDING,\n  lineHeight: 1,\n};\n\nconst contentStyle: React.CSSProperties = {\n  padding: FLOATING_PANEL_CONTENT_PADDING,\n  overflow: \"auto\",\n};\n\nexport type FloatingPanelFrameProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelFrame = React.forwardRef<HTMLDivElement, FloatingPanelFrameProps>(function FloatingPanelFrame(\n  { style: propStyle, children, ...props },\n  ref,\n) {\n  const combinedShadowStyle = React.useMemo(() => ({ ...shadowWrapperStyle, ...propStyle }), [propStyle]);\n\n  const combinedOverflowStyle = React.useMemo(() => {\n    const hasCustomBorderRadius = propStyle?.borderRadius !== undefined;\n    const hasHeight = propStyle?.height !== undefined;\n\n    if (!hasCustomBorderRadius && !hasHeight) {\n      return overflowWrapperStyle;\n    }\n\n    const result: React.CSSProperties = { ...overflowWrapperStyle };\n    if (hasCustomBorderRadius) {\n      result.borderRadius = propStyle.borderRadius;\n    }\n    if (hasHeight) {\n      result.height = propStyle.height;\n    }\n    return result;\n  }, [propStyle?.borderRadius, propStyle?.height]);\n\n  const combinedInnerStyle = React.useMemo(() => {\n    const hasCustomBorderRadius = propStyle?.borderRadius !== undefined;\n    const hasHeight = propStyle?.height !== undefined;\n\n    if (!hasCustomBorderRadius && !hasHeight) {\n      return innerStyle;\n    }\n\n    const result: React.CSSProperties = { ...innerStyle };\n    if (hasCustomBorderRadius) {\n      result.borderRadius = propStyle.borderRadius;\n    }\n    if (hasHeight) {\n      result.height = propStyle.height;\n    }\n    return result;\n  }, [propStyle?.borderRadius, propStyle?.height]);\n\n  return (\n    <div ref={ref} style={combinedShadowStyle} {...props}>\n      <div style={combinedOverflowStyle}>\n        <div style={combinedInnerStyle}>{children}</div>\n      </div>\n    </div>\n  );\n});\n\nexport type FloatingPanelHeaderProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelHeader: React.FC<FloatingPanelHeaderProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...headerStyle, ...propStyle }), [propStyle]);\n  return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelTitleProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelTitle: React.FC<FloatingPanelTitleProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...titleStyle, ...propStyle }), [propStyle]);\n  return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelMetaProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelMeta: React.FC<FloatingPanelMetaProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...metaStyle, ...propStyle }), [propStyle]);\n  return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelControlsProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelControls: React.FC<FloatingPanelControlsProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...controlsStyle, ...propStyle }), [propStyle]);\n  return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelContent = React.forwardRef<HTMLDivElement, FloatingPanelContentProps>(\n  function FloatingPanelContent({ style: propStyle, ...props }, ref) {\n    const combinedStyle = React.useMemo(() => ({ ...contentStyle, ...propStyle }), [propStyle]);\n    return <div ref={ref} style={combinedStyle} {...props} />;\n  },\n);\n\nexport type FloatingPanelCloseButtonProps = Omit<\n  React.ButtonHTMLAttributes<HTMLButtonElement>,\n  \"className\" | \"style\" | \"children\"\n> & {\n  style?: React.CSSProperties;\n};\n\nexport const FloatingPanelCloseButton: React.FC<FloatingPanelCloseButtonProps> = ({ style: propStyle, ...props }) => {\n  const combinedStyle = React.useMemo(() => ({ ...closeButtonStyle, ...propStyle }), [propStyle]);\n  return (\n    <button type=\"button\" style={combinedStyle} {...props}>\n      ×\n    </button>\n  );\n};\n\nFloatingPanelFrame.displayName = \"FloatingPanelFrame\";\nFloatingPanelHeader.displayName = \"FloatingPanelHeader\";\nFloatingPanelTitle.displayName = \"FloatingPanelTitle\";\nFloatingPanelMeta.displayName = \"FloatingPanelMeta\";\nFloatingPanelControls.displayName = \"FloatingPanelControls\";\nFloatingPanelContent.displayName = \"FloatingPanelContent\";\nFloatingPanelCloseButton.displayName = \"FloatingPanelCloseButton\";\n"],"names":["shadowWrapperStyle","FLOATING_PANEL_BORDER_RADIUS","FLOATING_PANEL_SHADOW","overflowWrapperStyle","innerStyle","FLOATING_PANEL_BORDER_COLOR","FLOATING_PANEL_SURFACE_COLOR","headerStyle","FLOATING_PANEL_GAP","FLOATING_PANEL_HEADER_PADDING_Y","FLOATING_PANEL_HEADER_PADDING_X","FLOATING_PANEL_SURFACE_2_COLOR","titleStyle","metaStyle","FLOATING_PANEL_MUTED_FG_COLOR","FLOATING_PANEL_META_FONT_SIZE","controlsStyle","FLOATING_PANEL_CONTROLS_GAP","closeButtonStyle","FLOATING_PANEL_CLOSE_BUTTON_FONT_SIZE","FLOATING_PANEL_CLOSE_BUTTON_PADDING","contentStyle","FLOATING_PANEL_CONTENT_PADDING","FloatingPanelFrame","React","propStyle","children","props","ref","combinedShadowStyle","combinedOverflowStyle","hasCustomBorderRadius","hasHeight","result","combinedInnerStyle","jsx","FloatingPanelHeader","combinedStyle","FloatingPanelTitle","FloatingPanelMeta","FloatingPanelControls","FloatingPanelContent","FloatingPanelCloseButton"],"mappings":"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"}

package/dist/FloatingWindow-BpdOpg_L.js

@@ -0,0 +1,400 @@
+import { jsxs as S, Fragment as R, jsx as l } from "react/jsx-runtime";
+import * as u from "react";
+import { F as A, e as F, a as T, b as W, f as $, d as Y } from "./FloatingPanelFrame-SgYLc6Ud.js";
+import { s as j, t as q, u as O, v as U, w as K, x as J, y as Q } from "./styles-DPPuJ0sf.js";
+import { createPortal as Z } from "react-dom";
+import { u as tt } from "./useContentCache-CO3LYNmz.js";
+const L = {
+  position: "fixed",
+  inset: 0,
+  background: j
+}, et = {
+  willChange: "transform"
+}, x = {
+  left: {
+    top: 0,
+    bottom: 0,
+    left: 0,
+    transform: "translateX(-100%)"
+  },
+  right: {
+    top: 0,
+    bottom: 0,
+    right: 0,
+    transform: "translateX(100%)"
+  },
+  top: {
+    top: 0,
+    left: 0,
+    right: 0,
+    transform: "translateY(-100%)"
+  },
+  bottom: {
+    bottom: 0,
+    left: 0,
+    right: 0,
+    transform: "translateY(100%)"
+  }
+}, ot = (t, e, n) => t === "none" ? void 0 : `transform ${e ?? q} ${n ?? O}`, nt = (t, e) => t ? e : !1, rt = ({ chrome: t, frameStyle: e, header: n, dismissible: s, onClose: o, children: i }) => t ? /* @__PURE__ */ S(A, { style: e, children: [
+  /* @__PURE__ */ l(st, { header: n, dismissible: s, onClose: o }),
+  /* @__PURE__ */ l(
+    F,
+    {
+      style: { padding: U, flex: 1, display: "flex", flexDirection: "column" },
+      children: i
+    }
+  )
+] }) : /* @__PURE__ */ l(R, { children: i }), st = ({ header: t, dismissible: e, onClose: n }) => {
+  if (!t)
+    return null;
+  const s = t.showCloseButton ?? !0, o = nt(e, s);
+  return /* @__PURE__ */ l(u.Activity, { mode: t ? "visible" : "hidden", children: /* @__PURE__ */ S(
+    T,
+    {
+      style: { padding: `${J} ${Q}`, gap: K },
+      children: [
+        /* @__PURE__ */ l(u.Activity, { mode: t ? "visible" : "hidden", children: /* @__PURE__ */ l(W, { children: t.title }) }),
+        /* @__PURE__ */ l(u.Activity, { mode: o ? "visible" : "hidden", children: /* @__PURE__ */ l(
+          $,
+          {
+            onClick: n,
+            "aria-label": "Close drawer",
+            style: { marginLeft: "auto" }
+          }
+        ) })
+      ]
+    }
+  ) });
+}, it = ({
+  id: t,
+  config: e,
+  isOpen: n,
+  onClose: s,
+  children: o,
+  zIndex: i,
+  width: d,
+  height: f,
+  position: a
+}) => {
+  const {
+    dismissible: r = !0,
+    header: c,
+    chrome: p = !0,
+    inline: h = !1,
+    transitionMode: w = "css",
+    transitionDuration: C,
+    transitionEasing: P
+  } = e, g = u.useCallback(
+    (v, m) => v || (m ? m.left !== void 0 ? "left" : m.right !== void 0 ? "right" : m.top !== void 0 ? "top" : m.bottom !== void 0 ? "bottom" : "right" : "right"),
+    []
+  )(e.anchor, a), I = {
+    left: "translateX(0)",
+    right: "translateX(0)",
+    top: "translateY(0)",
+    bottom: "translateY(0)"
+  }, H = u.useMemo(() => {
+    const v = ot(w, C, P), m = {
+      ...et,
+      ...h ? { position: "absolute" } : { position: "fixed" },
+      ...x[g],
+      transform: n ? I[g] : x[g].transform,
+      transition: v
+    };
+    return i !== void 0 && (m.zIndex = i), d !== void 0 && (m.width = typeof d == "number" ? `${d}px` : d), f !== void 0 && (m.height = typeof f == "number" ? `${f}px` : f), m;
+  }, [f, h, n, g, C, P, w, d, i]), V = c?.title ?? e.ariaLabel ?? "Drawer", z = u.useMemo(() => {
+    const v = h ? { ...L, position: "absolute" } : L, m = w === "none" ? void 0 : `opacity ${C ?? "220ms"} ease`;
+    return {
+      ...v,
+      opacity: n ? 1 : 0,
+      pointerEvents: n ? "auto" : "none",
+      transition: m,
+      zIndex: i !== void 0 ? i - 1 : void 0
+    };
+  }, [h, n, C, w, i]), X = u.useMemo(() => {
+    const v = g === "left" || g === "right", m = { borderRadius: 0 };
+    return v && (m.height = "100%"), m;
+  }, [g]);
+  return /* @__PURE__ */ S(R, { children: [
+    /* @__PURE__ */ l("div", { style: z, onClick: r ? s : void 0 }),
+    /* @__PURE__ */ l(
+      "div",
+      {
+        "data-layer-id": t,
+        "data-placement": g,
+        style: H,
+        role: "dialog",
+        "aria-modal": r ? !0 : void 0,
+        "aria-hidden": n ? void 0 : !0,
+        "aria-label": V,
+        children: /* @__PURE__ */ l(
+          rt,
+          {
+            chrome: p,
+            frameStyle: X,
+            header: c,
+            dismissible: r,
+            onClose: s,
+            children: o
+          }
+        )
+      }
+    )
+  ] });
+}, at = (t, e) => new Promise((n) => {
+  let s = !1;
+  const o = () => {
+    s || (s = !0, t.removeEventListener("transitionend", i), n());
+  }, i = (d) => {
+    d.target === t && o();
+  };
+  t.addEventListener("transitionend", i), setTimeout(o, e + 50);
+}), k = async (t, e, n, s) => {
+  switch (e) {
+    case "none":
+      t();
+      return;
+    case "css":
+      t(), n && await at(n, s);
+      return;
+  }
+}, Et = (t) => {
+  const [e, n] = u.useState({}), s = u.useRef(t);
+  s.current = t;
+  const o = u.useCallback(
+    async (a, r, c) => {
+      const { mode: p = "none", element: h, duration: w = 300 } = c ?? {};
+      await k(() => {
+        n((b) => b[a] === r ? b : { ...b, [a]: r });
+      }, p, h?.current, w);
+      const P = s.current;
+      r ? P?.onOpen?.(a) : P?.onClose?.(a), P?.onTransitionEnd?.(a, r);
+    },
+    []
+  ), i = u.useCallback((a) => e[a] ?? !1, [e]), d = u.useCallback(
+    (a, r) => o(a, !0, r),
+    [o]
+  ), f = u.useCallback(
+    (a, r) => o(a, !1, r),
+    [o]
+  );
+  return { state: i, open: d, close: f };
+}, ut = (t) => {
+  if (!t)
+    return 300;
+  const e = t.match(/(\d+)/);
+  return e ? parseInt(e[1], 10) : 300;
+}, ct = (t) => {
+  const [e, n] = u.useState(() => {
+    const a = {};
+    return t.forEach((r) => {
+      r.drawer && (a[r.id] = r.drawer.defaultOpen ?? !1);
+    }), a;
+  }), s = u.useMemo(() => {
+    const a = /* @__PURE__ */ new Map();
+    return t.forEach((r) => a.set(r.id, r)), a;
+  }, [t]), o = u.useCallback(
+    async (a, r, c) => {
+      const p = s.get(a);
+      if (!p?.drawer)
+        return;
+      const h = c?.mode ?? p.drawer.transitionMode ?? "css", w = c?.duration ?? ut(p.drawer.transitionDuration), C = c?.element?.current;
+      await k(() => {
+        p.drawer?.open === void 0 && n((b) => b[a] === r ? b : { ...b, [a]: r }), p.drawer?.onStateChange?.(r);
+      }, h, C, w);
+    },
+    [s]
+  ), i = u.useCallback(
+    (a) => {
+      const r = s.get(a);
+      return r?.drawer?.open !== void 0 ? r.drawer.open : e[a] ?? !1;
+    },
+    [s, e]
+  ), d = u.useCallback(
+    (a, r) => o(a, !0, r),
+    [o]
+  ), f = u.useCallback(
+    (a, r) => o(a, !1, r),
+    [o]
+  );
+  return { state: i, open: d, close: f };
+}, St = ({ layers: t }) => {
+  const e = ct(t), n = u.useMemo(() => t.filter((o) => o.drawer), [t]), s = u.useMemo(() => {
+    const o = /* @__PURE__ */ new Map();
+    return n.forEach((i) => {
+      o.set(i.id, () => e.close(i.id));
+    }), o;
+  }, [n, e.close]);
+  return /* @__PURE__ */ l(R, { children: n.map((o) => {
+    if (!o.drawer)
+      return null;
+    const i = e.state(o.id), d = s.get(o.id);
+    return d ? /* @__PURE__ */ l(
+      it,
+      {
+        id: o.id,
+        config: o.drawer,
+        isOpen: i,
+        onClose: d,
+        zIndex: o.zIndex,
+        width: o.width,
+        height: o.height,
+        position: o.position,
+        children: o.component
+      },
+      o.id
+    ) : null;
+  }) });
+}, _ = u.createContext(null), Dt = ({ value: t, children: e }) => /* @__PURE__ */ l(_.Provider, { value: t, children: e }), Rt = () => {
+  const t = u.useContext(_);
+  if (!t)
+    throw new Error("useGridLayoutContext must be used within a GridLayoutProvider.");
+  return t;
+}, N = u.createContext(null), Lt = () => {
+  const t = u.useContext(N);
+  if (!t)
+    throw new Error("usePanelSystem must be used within a PanelSystemProvider.");
+  return t;
+}, xt = ({ config: t, layers: e, style: n, children: s }) => {
+  const o = u.useMemo(() => {
+    const r = /* @__PURE__ */ new Map();
+    return e.forEach((c) => {
+      r.set(c.id, c);
+    }), r;
+  }, [e]), i = u.useCallback(
+    (r) => o.get(r)?.component ?? null,
+    [o]
+  ), d = u.useMemo(() => e.map((r) => r.id), [e]), { getCachedContent: f } = tt({
+    resolveContent: i,
+    validIds: d
+  }), a = u.useMemo(
+    () => ({
+      config: t,
+      style: n,
+      layers: {
+        defs: e,
+        layerById: o
+      },
+      getCachedContent: f
+    }),
+    [t, n, e, o, f]
+  );
+  return /* @__PURE__ */ l(N.Provider, { value: a, children: s });
+}, B = u.createContext(null), lt = ({ layerId: t, children: e }) => {
+  const n = u.useMemo(() => ({ layerId: t }), [t]);
+  return /* @__PURE__ */ l(B.Provider, { value: n, children: e });
+}, yt = () => {
+  const t = u.useContext(B);
+  if (!t)
+    throw new Error("useLayerInstance must be used within a LayerInstanceProvider.");
+  return t;
+}, y = (t, e, n) => {
+  if (typeof t == "number" && Number.isFinite(t))
+    return t;
+  throw new Error(`Popup layer "${n}" requires a numeric "${e}" value.`);
+}, G = (t, e) => {
+  if (!t)
+    throw new Error(`Popup layer "${e}" must define position (left/top).`);
+  return {
+    left: y(t.left, "left", e),
+    top: y(t.top, "top", e)
+  };
+}, D = (t) => `${Math.round(t)}`, E = (t) => {
+  if (t !== void 0)
+    return t ? "yes" : "no";
+}, dt = (t, e, n, s, o) => {
+  const i = {}, d = G(e, t);
+  if (typeof n != "number" || typeof s != "number")
+    throw new Error(`Popup layer "${t}" requires numeric width/height.`);
+  i.width = D(n), i.height = D(s), i.left = D(d.left), i.top = D(d.top);
+  const f = o?.features;
+  if (f) {
+    const a = E(f.toolbar), r = E(f.menubar), c = E(f.location), p = E(f.status), h = E(f.resizable), w = E(f.scrollbars);
+    a !== void 0 && (i.toolbar = a), r !== void 0 && (i.menubar = r), c !== void 0 && (i.location = c), p !== void 0 && (i.status = p), h !== void 0 && (i.resizable = h), w !== void 0 && (i.scrollbars = w);
+  }
+  return Object.entries(i).map(([a, r]) => `${a}=${r}`).join(",");
+}, M = (t, e, n, s, o) => {
+  const i = G(n, e);
+  if (typeof s != "number" || typeof o != "number")
+    throw new Error(`Popup layer "${e}" requires numeric width/height.`);
+  t.moveTo(Math.round(i.left), Math.round(i.top)), t.resizeTo(Math.round(s), Math.round(o));
+}, Mt = ({ layer: t }) => {
+  const e = t.floating;
+  if (!e)
+    throw new Error(`Layer "${t.id}" is missing floating configuration required for popup mode.`);
+  if ((e.mode ?? "embedded") !== "popup")
+    throw new Error(`PopupLayerPortal received layer "${t.id}" that is not configured for popup mode.`);
+  const s = u.useRef(null), o = u.useRef(null), [i, d] = u.useState(!1);
+  return u.useEffect(() => {
+    if (typeof window > "u")
+      return;
+    const f = dt(t.id, t.position, t.width, t.height, e.popup), a = e.popup?.name ?? t.id, r = ft(
+      a,
+      f,
+      {
+        position: t.position,
+        size: { width: t.width, height: t.height }
+      },
+      e.popup
+    );
+    if (!r)
+      throw new Error(`Failed to open popup window for layer "${t.id}".`);
+    const c = r;
+    o.current = c, e.popup?.focus !== !1 && c.focus(), c.document.title || (c.document.title = t.id), c.document.body.innerHTML = "";
+    const p = c.document.createElement("div");
+    p.dataset.layerId = t.id, c.document.body.appendChild(p), s.current = p, d(!0), M(c, t.id, t.position, t.width, t.height);
+    const h = () => {
+      o.current = null, s.current = null, d(!1);
+    };
+    return c.addEventListener("beforeunload", h), () => {
+      c.removeEventListener("beforeunload", h), e.popup?.closeOnUnmount !== !1 && c.close(), o.current = null, s.current = null, d(!1);
+    };
+  }, [
+    e.popup?.closeOnUnmount,
+    e.popup?.features?.location,
+    e.popup?.features?.menubar,
+    e.popup?.features?.resizable,
+    e.popup?.features?.scrollbars,
+    e.popup?.features?.status,
+    e.popup?.features?.toolbar,
+    e.popup?.focus,
+    e.popup?.name,
+    t.id
+  ]), u.useEffect(() => {
+    const f = o.current;
+    f && M(f, t.id, t.position, t.width, t.height);
+  }, [t.position?.left, t.position?.top, t.height, t.width, t.id]), !i || !s.current ? null : Z(/* @__PURE__ */ l(lt, { layerId: t.id, children: t.component }), s.current);
+}, ft = (t, e, n, s) => {
+  const o = s?.createWindow;
+  return o ? o({ name: t, features: e, bounds: n }) : window.open("", t, e);
+}, pt = ({ onClick: t }) => /* @__PURE__ */ l(Y, { children: /* @__PURE__ */ l($, { onClick: t, "aria-label": "Close window", "data-drag-ignore": "true" }) }), mt = ({ header: t, draggable: e, onClose: n }) => {
+  if (!t)
+    return null;
+  const s = t.showCloseButton ?? !1;
+  return /* @__PURE__ */ S(T, { ...e ? { "data-drag-handle": "true" } : {}, style: { cursor: e ? "grab" : void 0 }, children: [
+    t.title ? /* @__PURE__ */ l(W, { children: t.title }) : null,
+    s ? /* @__PURE__ */ l(pt, { onClick: n }) : null
+  ] });
+}, ht = ({ header: t, draggable: e, chrome: n, onClose: s, children: o }) => n ? /* @__PURE__ */ S(A, { style: { height: "100%", width: "100%" }, children: [
+  /* @__PURE__ */ l(mt, { header: t, draggable: e, onClose: s }),
+  /* @__PURE__ */ l(F, { style: { flex: 1, display: "flex", flexDirection: "column" }, children: o })
+] }) : /* @__PURE__ */ l(R, { children: o }), wt = ({ id: t, config: e, onClose: n, children: s }) => {
+  const o = e.chrome ?? !1, i = e.draggable ?? !1, d = e.header?.title ?? e.ariaLabel ?? "Floating window";
+  return /* @__PURE__ */ l("div", { "data-floating-window": t, role: "dialog", "aria-label": d, style: { height: "100%", width: "100%" }, children: /* @__PURE__ */ l(ht, { header: e.header, draggable: i, chrome: o, onClose: n, children: s }) });
+};
+wt.displayName = "FloatingWindow";
+export {
+  it as D,
+  wt as F,
+  Dt as G,
+  lt as L,
+  Mt as P,
+  yt as a,
+  St as b,
+  Et as c,
+  ct as d,
+  Lt as e,
+  xt as f,
+  k as r,
+  Rt as u
+};
+//# sourceMappingURL=FloatingWindow-BpdOpg_L.js.map