@solibo/solibo-ui 1.0.7 → 1.0.10

package/dist/components/icon/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index46.css');const r=require("react/jsx-runtime"),l=require("../../classix-5H4IWnMA.cjs"),t=require("../../icons-Dx0NQYLH.cjs"),m="_icon_vhz6u_1",u="_small_vhz6u_10",_="_medium_vhz6u_15",g="_large_vhz6u_20",d="_danger_vhz6u_25",e={icon:m,small:u,medium:_,large:g,danger:d,"gap-right":"_gap-right_vhz6u_29","gap-left":"_gap-left_vhz6u_33"},h={large:e.large,medium:e.medium,small:e.small},v={danger:e.danger},z=({fill:o,gap:n="none",name:a,size:c="medium",variant:s})=>{const i={maskImage:t.iconSVG(a,o??!1)};return r.jsx("span",{"aria-hidden":"true",className:l.t(n!=="none"&&e[`gap-${n}`],h[c],e.icon,s&&v[s]),style:i,"data-component":"icon"})},p=()=>Object.keys(t.iconPaths);exports.Icon=z;exports.Icons=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index46.css');const m=require("react/jsx-runtime"),r=require("../../classix-5H4IWnMA.cjs"),t=require("../../icons-Dx0NQYLH.cjs"),l="_icon_ihnm9_1",_="_small_ihnm9_10",g="_medium_ihnm9_15",d="_large_ihnm9_20",u="_danger_ihnm9_25",n={icon:l,small:_,medium:g,large:d,danger:u,"gap-right":"_gap-right_ihnm9_29","gap-left":"_gap-left_ihnm9_33"},h={large:n.large,medium:n.medium,small:n.small},p={danger:n.danger},y=({fill:i,gap:e="none",name:o,size:a="medium",variant:s})=>{const c={maskImage:t.iconSVG(o,i??!1)};return m.jsx("span",{"aria-hidden":"true",className:r.t(e!=="none"&&n[`gap-${e}`],h[a],n.icon,s&&p[s]),style:c,"data-component":"icon"})},I=()=>Object.keys(t.iconPaths);exports.Icon=y;exports.Icons=I;
 //# sourceMappingURL=index.cjs.map

package/dist/components/icon/index.js

@@ -1,34 +1,34 @@
-import { jsx as r } from "react/jsx-runtime";
-import { t as c } from "../../classix-DG18itHa.js";
-import { i, a as l } from "../../icons-BFgf_lJN.js";
-import '../../assets/index46.css';const _ = "_icon_vhz6u_1", g = "_small_vhz6u_10", u = "_medium_vhz6u_15", d = "_large_vhz6u_20", h = "_danger_vhz6u_25", n = {
+import { jsx as t } from "react/jsx-runtime";
+import { t as r } from "../../classix-DG18itHa.js";
+import { i as c, a as l } from "../../icons-BFgf_lJN.js";
+import '../../assets/index46.css';const _ = "_icon_ihnm9_1", g = "_small_ihnm9_10", d = "_medium_ihnm9_15", h = "_large_ihnm9_20", p = "_danger_ihnm9_25", n = {
   icon: _,
   small: g,
-  medium: u,
-  large: d,
-  danger: h,
-  "gap-right": "_gap-right_vhz6u_29",
-  "gap-left": "_gap-left_vhz6u_33"
-}, p = {
+  medium: d,
+  large: h,
+  danger: p,
+  "gap-right": "_gap-right_ihnm9_29",
+  "gap-left": "_gap-left_ihnm9_33"
+}, u = {
   large: n.large,
   medium: n.medium,
   small: n.small
-}, z = {
+}, f = {
   danger: n.danger
-}, I = ({
-  fill: s,
+}, k = ({
+  fill: a,
   gap: e = "none",
-  name: o,
-  size: t = "medium",
-  variant: a
+  name: s,
+  size: o = "medium",
+  variant: m
 }) => {
-  const m = {
-    maskImage: i(o, s ?? !1)
+  const i = {
+    maskImage: c(s, a ?? !1)
   };
-  return /* @__PURE__ */ r("span", { "aria-hidden": "true", className: c(e !== "none" && n[`gap-${e}`], p[t], n.icon, a && z[a]), style: m, "data-component": "icon" });
-}, j = () => Object.keys(l);
+  return /* @__PURE__ */ t("span", { "aria-hidden": "true", className: r(e !== "none" && n[`gap-${e}`], u[o], n.icon, m && f[m]), style: i, "data-component": "icon" });
+}, x = () => Object.keys(l);
 export {
-  I as Icon,
-  j as Icons
+  k as Icon,
+  x as Icons
 };
 //# sourceMappingURL=index.js.map

package/dist/components/iframe/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index19.css');const o=require("react/jsx-runtime"),S=require("../../classix-5H4IWnMA.cjs"),n=require("react"),q=require("../button/index.cjs"),B=require("../dialog/index.cjs"),G="_wrapper_owo4o_1",R="_toolbar_owo4o_6",V="_iframe_owo4o_16",c={wrapper:G,toolbar:R,"fullscreen-toolbar":"_fullscreen-toolbar_owo4o_7",iframe:V,"fullscreen-dialog":"_fullscreen-dialog_owo4o_22","fullscreen-iframe":"_fullscreen-iframe_owo4o_40"},f=120,$=12e3,L=8,X=({accessibleLabel:m,autoResize:l=!1,className:H,closeFullscreenLabel:A="Close fullscreen",fullscreenLabel:C="View in fullscreen",hasFullscreenView:I=!0,loading:O="lazy",onLoad:h,referrerPolicy:x="no-referrer",sandbox:y="",srcDoc:w,style:E,...b})=>{const _=n.useRef(null),i=n.useRef(null),s=n.useRef(null),[N,M]=n.useState(f),[T,g]=n.useState(!1),p=n.useCallback(()=>{i.current!==null&&(window.cancelAnimationFrame(i.current),i.current=null),s.current!==null&&(window.clearTimeout(s.current),s.current=null)},[]),v=n.useCallback(()=>{if(!l)return;const t=_.current,e=t==null?void 0:t.contentDocument;if(!t||!e)return;const d=t.style.height;try{t.style.height=`${f}px`;const a=e.querySelector("[data-iframe-content]")??e.body,u=a.getBoundingClientRect(),{body:j,documentElement:F}=e,U=Math.min(Math.max(Math.ceil(Math.max(a.scrollHeight,a.offsetHeight,u.height,j.scrollHeight,j.offsetHeight,F.scrollHeight,F.offsetHeight)+L),f),$);M(U)}catch{}finally{t.style.height=d}},[l]),r=n.useCallback(()=>{!l||i.current!==null||(i.current=window.requestAnimationFrame(()=>{i.current=null,v(),s.current!==null&&window.clearTimeout(s.current),s.current=window.setTimeout(()=>{s.current=null,v()},250)}))},[l,v]),k=t=>{var d,a;r();const e=(d=_.current)==null?void 0:d.contentDocument;Array.from((e==null?void 0:e.images)??[]).forEach(u=>{u.complete||(u.addEventListener("load",r,{once:!0}),u.addEventListener("error",r,{once:!0}))}),(a=e==null?void 0:e.fonts)==null||a.ready.then(r).catch(()=>{}),h==null||h(t)};return n.useEffect(()=>{if(l)return p(),M(f),r(),p},[l,p,r,w]),n.useEffect(()=>{var t;if(l)return window.addEventListener("resize",r),(t=window.visualViewport)==null||t.addEventListener("resize",r),()=>{var e;window.removeEventListener("resize",r),(e=window.visualViewport)==null||e.removeEventListener("resize",r)}},[l,r]),o.jsxs("div",{className:c.wrapper,"data-component":"iframe",children:[I&&o.jsx("div",{className:c.toolbar,children:o.jsx(q.Button,{"aria-expanded":T,"aria-haspopup":"dialog",onClick:()=>g(!0),variant:"tertiary",children:C})}),o.jsx("iframe",{...b,className:S.t(c.iframe,H),loading:O,onLoad:k,ref:_,referrerPolicy:x,sandbox:y,srcDoc:w,style:l?{...E,height:N,minHeight:f}:E,title:m}),T&&o.jsxs(B.Dialog,{"aria-label":`${m} fullscreen`,className:c["fullscreen-dialog"],open:!0,setOpen:g,children:[o.jsx("div",{className:c["fullscreen-toolbar"],children:o.jsx(q.Button,{autoFocus:!0,onClick:()=>g(!1),children:A})}),o.jsx("iframe",{...b,className:S.t(c.iframe,c["fullscreen-iframe"],H),loading:"eager",referrerPolicy:x,sandbox:y,srcDoc:w,title:`${m} fullscreen`})]})]})};exports.Iframe=X;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index19.css');const r=require("react/jsx-runtime"),S=require("../../classix-5H4IWnMA.cjs"),s=require("react"),A=require("../button/index.cjs"),N=require("../controls/index.cjs"),z=require("../dialog/index.cjs"),G=require("../header/index.cjs"),R="_wrapper_29z62_1",V="_toolbar_29z62_6",$="_iframe_29z62_12",a={wrapper:R,toolbar:V,iframe:$,"fullscreen-iframe":"_fullscreen-iframe_29z62_18"},d=120,L=12e3,X=8,J=({accessibleLabel:f,autoResize:l=!1,className:v,closeFullscreenLabel:F="Close fullscreen",fullscreenLabel:I="View in fullscreen",hasFullscreenView:O=!0,loading:b="lazy",onLoad:h,referrerPolicy:H="no-referrer",sandbox:y="",srcDoc:w,style:E,...j})=>{const _=s.useRef(null),c=s.useRef(null),i=s.useRef(null),[k,M]=s.useState(d),[T,p]=s.useState(!1),g=s.useCallback(()=>{c.current!==null&&(window.cancelAnimationFrame(c.current),c.current=null),i.current!==null&&(window.clearTimeout(i.current),i.current=null)},[]),x=s.useCallback(()=>{if(!l)return;const t=_.current,e=t==null?void 0:t.contentDocument;if(!t||!e)return;const m=t.style.height;try{t.style.height=`${d}px`;const o=e.querySelector("[data-iframe-content]")??e.body,u=o.getBoundingClientRect(),{body:q,documentElement:C}=e,B=Math.min(Math.max(Math.ceil(Math.max(o.scrollHeight,o.offsetHeight,u.height,q.scrollHeight,q.offsetHeight,C.scrollHeight,C.offsetHeight)+X),d),L);M(B)}catch{}finally{t.style.height=m}},[l]),n=s.useCallback(()=>{!l||c.current!==null||(c.current=window.requestAnimationFrame(()=>{c.current=null,x(),i.current!==null&&window.clearTimeout(i.current),i.current=window.setTimeout(()=>{i.current=null,x()},250)}))},[l,x]),U=t=>{var m,o;n();const e=(m=_.current)==null?void 0:m.contentDocument;Array.from((e==null?void 0:e.images)??[]).forEach(u=>{u.complete||(u.addEventListener("load",n,{once:!0}),u.addEventListener("error",n,{once:!0}))}),(o=e==null?void 0:e.fonts)==null||o.ready.then(n).catch(()=>{}),h==null||h(t)};return s.useEffect(()=>{if(l)return g(),M(d),n(),g},[l,g,n,w]),s.useEffect(()=>{var t;if(l)return window.addEventListener("resize",n),(t=window.visualViewport)==null||t.addEventListener("resize",n),()=>{var e;window.removeEventListener("resize",n),(e=window.visualViewport)==null||e.removeEventListener("resize",n)}},[l,n]),r.jsxs("div",{className:a.wrapper,"data-component":"iframe",children:[O&&r.jsx("div",{className:a.toolbar,children:r.jsx(A.Button,{"aria-expanded":T,"aria-haspopup":"dialog",onClick:()=>p(!0),variant:"tertiary",children:I})}),r.jsx("iframe",{...j,className:S.t(a.iframe,v),loading:b,onLoad:U,ref:_,referrerPolicy:H,sandbox:y,srcDoc:w,style:l?{...E,height:k,minHeight:d}:E,title:f}),T&&r.jsx(z.Dialog,{"aria-label":`${f} fullscreen`,controls:r.jsx(N.Controls,{children:r.jsx(A.Button,{onClick:()=>p(!1),children:F})}),fullscreen:!0,header:r.jsx(G.Header,{children:r.jsx("h2",{children:f})}),open:!0,setOpen:p,children:r.jsx("iframe",{...j,className:S.t(a.iframe,a["fullscreen-iframe"],v),loading:"eager",referrerPolicy:H,sandbox:y,srcDoc:w,title:`${f} fullscreen`})})]})};exports.Iframe=J;
 //# sourceMappingURL=index.cjs.map

package/dist/components/iframe/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/iframe/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { type ComponentPropsWithoutRef, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Dialog } from '../dialog';\nimport styles from './styles.module.css';\n\nconst MIN_AUTO_HEIGHT = 120;\nconst MAX_AUTO_HEIGHT = 12000;\nconst AUTO_HEIGHT_BUFFER = 8;\n\nexport type IframeProps = Omit<ComponentPropsWithoutRef<'iframe'>, 'src' | 'srcDoc' | 'title'> & {\n  accessibleLabel: string;\n  autoResize?: boolean;\n  closeFullscreenLabel?: string;\n  fullscreenLabel?: string;\n  hasFullscreenView?: boolean;\n  srcDoc: string;\n};\n\nexport const Iframe = ({\n  accessibleLabel,\n  autoResize = false,\n  className,\n  closeFullscreenLabel = 'Close fullscreen',\n  fullscreenLabel = 'View in fullscreen',\n  hasFullscreenView = true,\n  loading = 'lazy',\n  onLoad,\n  referrerPolicy = 'no-referrer',\n  sandbox = '',\n  srcDoc,\n  style,\n  ...props\n}: IframeProps) => {\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const measurementFrameRef = useRef<number | null>(null);\n  const followUpMeasurementTimeoutRef = useRef<number | null>(null);\n  const [measuredHeight, setMeasuredHeight] = useState(MIN_AUTO_HEIGHT);\n  const [isFullscreenOpen, setIsFullscreenOpen] = useState(false);\n\n  const clearScheduledMeasurements = useCallback(() => {\n    if (measurementFrameRef.current !== null) {\n      window.cancelAnimationFrame(measurementFrameRef.current);\n      measurementFrameRef.current = null;\n    }\n\n    if (followUpMeasurementTimeoutRef.current !== null) {\n      window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      followUpMeasurementTimeoutRef.current = null;\n    }\n  }, []);\n\n  const measureSize = useCallback(() => {\n    if (!autoResize) return;\n\n    const iframe = iframeRef.current;\n    const iframeDocument = iframe?.contentDocument;\n    if (!iframe || !iframeDocument) return;\n\n    const renderedHeight = iframe.style.height;\n\n    try {\n      // measure from a stable viewport height so content sized with percentages or\n      // viewport units cannot feed the iframe's previous height back into itself\n      iframe.style.height = `${MIN_AUTO_HEIGHT}px`;\n\n      const content =\n        iframeDocument.querySelector<HTMLElement>('[data-iframe-content]') ?? iframeDocument.body;\n      const contentRect = content.getBoundingClientRect();\n      const { body, documentElement } = iframeDocument;\n      const height = Math.min(\n        Math.max(\n          Math.ceil(\n            Math.max(\n              content.scrollHeight,\n              content.offsetHeight,\n              contentRect.height,\n              body.scrollHeight,\n              body.offsetHeight,\n              documentElement.scrollHeight,\n              documentElement.offsetHeight\n            ) + AUTO_HEIGHT_BUFFER\n          ),\n          MIN_AUTO_HEIGHT\n        ),\n        MAX_AUTO_HEIGHT\n      );\n\n      setMeasuredHeight(height);\n    } catch {\n      // cross-origin iframe content cannot be measured; retain minimum height\n    } finally {\n      iframe.style.height = renderedHeight;\n    }\n  }, [autoResize]);\n\n  const scheduleSizeMeasurement = useCallback(() => {\n    if (!autoResize || measurementFrameRef.current !== null) return;\n\n    measurementFrameRef.current = window.requestAnimationFrame(() => {\n      measurementFrameRef.current = null;\n      measureSize();\n\n      if (followUpMeasurementTimeoutRef.current !== null) {\n        window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      }\n\n      followUpMeasurementTimeoutRef.current = window.setTimeout(() => {\n        followUpMeasurementTimeoutRef.current = null;\n        measureSize();\n      }, 250);\n    });\n  }, [autoResize, measureSize]);\n\n  const handleLoad: NonNullable<IframeProps['onLoad']> = (event) => {\n    scheduleSizeMeasurement();\n\n    const iframeDocument = iframeRef.current?.contentDocument;\n    Array.from(iframeDocument?.images ?? []).forEach((image) => {\n      if (image.complete) return;\n      image.addEventListener('load', scheduleSizeMeasurement, { once: true });\n      image.addEventListener('error', scheduleSizeMeasurement, { once: true });\n    });\n    iframeDocument?.fonts?.ready.then(scheduleSizeMeasurement).catch(() => undefined);\n\n    onLoad?.(event);\n  };\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    clearScheduledMeasurements();\n    setMeasuredHeight(MIN_AUTO_HEIGHT);\n    scheduleSizeMeasurement();\n\n    return clearScheduledMeasurements;\n  }, [autoResize, clearScheduledMeasurements, scheduleSizeMeasurement, srcDoc]);\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    window.addEventListener('resize', scheduleSizeMeasurement);\n    window.visualViewport?.addEventListener('resize', scheduleSizeMeasurement);\n\n    return () => {\n      window.removeEventListener('resize', scheduleSizeMeasurement);\n      window.visualViewport?.removeEventListener('resize', scheduleSizeMeasurement);\n    };\n  }, [autoResize, scheduleSizeMeasurement]);\n\n  return (\n    <div className={styles.wrapper}>\n      {hasFullscreenView && (\n        <div className={styles.toolbar}>\n          <Button\n            aria-expanded={isFullscreenOpen}\n            aria-haspopup='dialog'\n            onClick={() => setIsFullscreenOpen(true)}\n            variant='tertiary'\n          >\n            {fullscreenLabel}\n          </Button>\n        </div>\n      )}\n      <iframe\n        {...props}\n        className={cx(styles.iframe, className)}\n        loading={loading}\n        onLoad={handleLoad}\n        ref={iframeRef}\n        referrerPolicy={referrerPolicy}\n        sandbox={sandbox}\n        srcDoc={srcDoc}\n        style={\n          autoResize\n            ? {\n                ...style,\n                height: measuredHeight,\n                minHeight: MIN_AUTO_HEIGHT,\n              }\n            : style\n        }\n        title={accessibleLabel}\n      />\n      {isFullscreenOpen && (\n        <Dialog\n          aria-label={`${accessibleLabel} fullscreen`}\n          className={styles['fullscreen-dialog']}\n          open\n          setOpen={setIsFullscreenOpen}\n        >\n          <div className={styles['fullscreen-toolbar']}>\n            <Button\n              autoFocus\n              onClick={() => setIsFullscreenOpen(false)}\n            >\n              {closeFullscreenLabel}\n            </Button>\n          </div>\n          <iframe\n            {...props}\n            className={cx(styles.iframe, styles['fullscreen-iframe'], className)}\n            loading='eager'\n            referrerPolicy={referrerPolicy}\n            sandbox={sandbox}\n            srcDoc={srcDoc}\n            title={`${accessibleLabel} fullscreen`}\n          />\n        </Dialog>\n      )}\n    </div>\n  );\n};\n"],"names":["MIN_AUTO_HEIGHT","MAX_AUTO_HEIGHT","AUTO_HEIGHT_BUFFER","Iframe","accessibleLabel","autoResize","className","closeFullscreenLabel","fullscreenLabel","hasFullscreenView","loading","onLoad","referrerPolicy","sandbox","srcDoc","style","props","iframeRef","useRef","measurementFrameRef","followUpMeasurementTimeoutRef","measuredHeight","setMeasuredHeight","useState","isFullscreenOpen","setIsFullscreenOpen","clearScheduledMeasurements","useCallback","current","window","cancelAnimationFrame","clearTimeout","measureSize","iframe","iframeDocument","contentDocument","renderedHeight","height","content","querySelector","body","contentRect","getBoundingClientRect","documentElement","Math","min","max","ceil","scrollHeight","offsetHeight","scheduleSizeMeasurement","requestAnimationFrame","setTimeout","handleLoad","event","Array","from","images","forEach","image","complete","addEventListener","once","fonts","ready","then","catch","useEffect","visualViewport","removeEventListener","styles","wrapper","toolbar","jsx","Button","cx","minHeight","jsxs","Dialog"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/iframe/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { type ComponentPropsWithoutRef, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Controls } from '../controls';\nimport { Dialog } from '../dialog';\nimport { Header } from '../header';\nimport styles from './styles.module.css';\n\nconst MIN_AUTO_HEIGHT = 120;\nconst MAX_AUTO_HEIGHT = 12000;\nconst AUTO_HEIGHT_BUFFER = 8;\n\nexport type IframeProps = Omit<ComponentPropsWithoutRef<'iframe'>, 'src' | 'srcDoc' | 'title'> & {\n  accessibleLabel: string;\n  autoResize?: boolean;\n  closeFullscreenLabel?: string;\n  fullscreenLabel?: string;\n  hasFullscreenView?: boolean;\n  srcDoc: string;\n};\n\nexport const Iframe = ({\n  accessibleLabel,\n  autoResize = false,\n  className,\n  closeFullscreenLabel = 'Close fullscreen',\n  fullscreenLabel = 'View in fullscreen',\n  hasFullscreenView = true,\n  loading = 'lazy',\n  onLoad,\n  referrerPolicy = 'no-referrer',\n  sandbox = '',\n  srcDoc,\n  style,\n  ...props\n}: IframeProps) => {\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const measurementFrameRef = useRef<number | null>(null);\n  const followUpMeasurementTimeoutRef = useRef<number | null>(null);\n  const [measuredHeight, setMeasuredHeight] = useState(MIN_AUTO_HEIGHT);\n  const [isFullscreenOpen, setIsFullscreenOpen] = useState(false);\n\n  const clearScheduledMeasurements = useCallback(() => {\n    if (measurementFrameRef.current !== null) {\n      window.cancelAnimationFrame(measurementFrameRef.current);\n      measurementFrameRef.current = null;\n    }\n\n    if (followUpMeasurementTimeoutRef.current !== null) {\n      window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      followUpMeasurementTimeoutRef.current = null;\n    }\n  }, []);\n\n  const measureSize = useCallback(() => {\n    if (!autoResize) return;\n\n    const iframe = iframeRef.current;\n    const iframeDocument = iframe?.contentDocument;\n    if (!iframe || !iframeDocument) return;\n\n    const renderedHeight = iframe.style.height;\n\n    try {\n      // measure from a stable viewport height so content sized with percentages or\n      // viewport units cannot feed the iframe's previous height back into itself\n      iframe.style.height = `${MIN_AUTO_HEIGHT}px`;\n\n      const content =\n        iframeDocument.querySelector<HTMLElement>('[data-iframe-content]') ?? iframeDocument.body;\n      const contentRect = content.getBoundingClientRect();\n      const { body, documentElement } = iframeDocument;\n      const height = Math.min(\n        Math.max(\n          Math.ceil(\n            Math.max(\n              content.scrollHeight,\n              content.offsetHeight,\n              contentRect.height,\n              body.scrollHeight,\n              body.offsetHeight,\n              documentElement.scrollHeight,\n              documentElement.offsetHeight\n            ) + AUTO_HEIGHT_BUFFER\n          ),\n          MIN_AUTO_HEIGHT\n        ),\n        MAX_AUTO_HEIGHT\n      );\n\n      setMeasuredHeight(height);\n    } catch {\n      // cross-origin iframe content cannot be measured; retain minimum height\n    } finally {\n      iframe.style.height = renderedHeight;\n    }\n  }, [autoResize]);\n\n  const scheduleSizeMeasurement = useCallback(() => {\n    if (!autoResize || measurementFrameRef.current !== null) return;\n\n    measurementFrameRef.current = window.requestAnimationFrame(() => {\n      measurementFrameRef.current = null;\n      measureSize();\n\n      if (followUpMeasurementTimeoutRef.current !== null) {\n        window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      }\n\n      followUpMeasurementTimeoutRef.current = window.setTimeout(() => {\n        followUpMeasurementTimeoutRef.current = null;\n        measureSize();\n      }, 250);\n    });\n  }, [autoResize, measureSize]);\n\n  const handleLoad: NonNullable<IframeProps['onLoad']> = (event) => {\n    scheduleSizeMeasurement();\n\n    const iframeDocument = iframeRef.current?.contentDocument;\n    Array.from(iframeDocument?.images ?? []).forEach((image) => {\n      if (image.complete) return;\n      image.addEventListener('load', scheduleSizeMeasurement, { once: true });\n      image.addEventListener('error', scheduleSizeMeasurement, { once: true });\n    });\n    iframeDocument?.fonts?.ready.then(scheduleSizeMeasurement).catch(() => undefined);\n\n    onLoad?.(event);\n  };\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    clearScheduledMeasurements();\n    setMeasuredHeight(MIN_AUTO_HEIGHT);\n    scheduleSizeMeasurement();\n\n    return clearScheduledMeasurements;\n  }, [autoResize, clearScheduledMeasurements, scheduleSizeMeasurement, srcDoc]);\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    window.addEventListener('resize', scheduleSizeMeasurement);\n    window.visualViewport?.addEventListener('resize', scheduleSizeMeasurement);\n\n    return () => {\n      window.removeEventListener('resize', scheduleSizeMeasurement);\n      window.visualViewport?.removeEventListener('resize', scheduleSizeMeasurement);\n    };\n  }, [autoResize, scheduleSizeMeasurement]);\n\n  return (\n    <div className={styles.wrapper}>\n      {hasFullscreenView && (\n        <div className={styles.toolbar}>\n          <Button\n            aria-expanded={isFullscreenOpen}\n            aria-haspopup='dialog'\n            onClick={() => setIsFullscreenOpen(true)}\n            variant='tertiary'\n          >\n            {fullscreenLabel}\n          </Button>\n        </div>\n      )}\n      <iframe\n        {...props}\n        className={cx(styles.iframe, className)}\n        loading={loading}\n        onLoad={handleLoad}\n        ref={iframeRef}\n        referrerPolicy={referrerPolicy}\n        sandbox={sandbox}\n        srcDoc={srcDoc}\n        style={\n          autoResize\n            ? {\n                ...style,\n                height: measuredHeight,\n                minHeight: MIN_AUTO_HEIGHT,\n              }\n            : style\n        }\n        title={accessibleLabel}\n      />\n      {isFullscreenOpen && (\n        <Dialog\n          aria-label={`${accessibleLabel} fullscreen`}\n          controls={\n            <Controls>\n              <Button onClick={() => setIsFullscreenOpen(false)}>{closeFullscreenLabel}</Button>\n            </Controls>\n          }\n          fullscreen\n          header={\n            <Header>\n              <h2>{accessibleLabel}</h2>\n            </Header>\n          }\n          open\n          setOpen={setIsFullscreenOpen}\n        >\n          <iframe\n            {...props}\n            className={cx(styles.iframe, styles['fullscreen-iframe'], className)}\n            loading='eager'\n            referrerPolicy={referrerPolicy}\n            sandbox={sandbox}\n            srcDoc={srcDoc}\n            title={`${accessibleLabel} fullscreen`}\n          />\n        </Dialog>\n      )}\n    </div>\n  );\n};\n"],"names":["MIN_AUTO_HEIGHT","MAX_AUTO_HEIGHT","AUTO_HEIGHT_BUFFER","Iframe","accessibleLabel","autoResize","className","closeFullscreenLabel","fullscreenLabel","hasFullscreenView","loading","onLoad","referrerPolicy","sandbox","srcDoc","style","props","iframeRef","useRef","measurementFrameRef","followUpMeasurementTimeoutRef","measuredHeight","setMeasuredHeight","useState","isFullscreenOpen","setIsFullscreenOpen","clearScheduledMeasurements","useCallback","current","window","cancelAnimationFrame","clearTimeout","measureSize","iframe","iframeDocument","contentDocument","renderedHeight","height","content","querySelector","body","contentRect","getBoundingClientRect","documentElement","Math","min","max","ceil","scrollHeight","offsetHeight","scheduleSizeMeasurement","requestAnimationFrame","setTimeout","handleLoad","event","Array","from","images","forEach","image","complete","addEventListener","once","fonts","ready","then","catch","useEffect","visualViewport","removeEventListener","styles","wrapper","toolbar","jsx","Button","cx","minHeight","Dialog","Controls","Header"],"mappings":"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"}

package/dist/components/iframe/index.js

@@ -1,91 +1,88 @@
-import { jsxs as N, jsx as s } from "react/jsx-runtime";
+import { jsxs as q, jsx as l } from "react/jsx-runtime";
 import { t as O } from "../../classix-DG18itHa.js";
-import { useRef as v, useState as C, useCallback as H, useEffect as S } from "react";
-import { Button as U } from "../button/index.js";
+import { useRef as H, useState as S, useCallback as v, useEffect as U } from "react";
+import { Button as N } from "../button/index.js";
+import { Controls as b } from "../controls/index.js";
 import { Dialog as L } from "../dialog/index.js";
-import '../../assets/index19.css';const X = "_wrapper_owo4o_1", J = "_toolbar_owo4o_6", K = "_iframe_owo4o_16", l = {
-  wrapper: X,
-  toolbar: J,
-  "fullscreen-toolbar": "_fullscreen-toolbar_owo4o_7",
-  iframe: K,
-  "fullscreen-dialog": "_fullscreen-dialog_owo4o_22",
-  "fullscreen-iframe": "_fullscreen-iframe_owo4o_40"
-}, u = 120, Q = 12e3, W = 8, R = ({
-  accessibleLabel: m,
+import { Header as X } from "../header/index.js";
+import '../../assets/index19.css';const J = "_wrapper_29z62_1", K = "_toolbar_29z62_6", Q = "_iframe_29z62_12", a = {
+  wrapper: J,
+  toolbar: K,
+  iframe: Q,
+  "fullscreen-iframe": "_fullscreen-iframe_29z62_18"
+}, u = 120, W = 12e3, Y = 8, ne = ({
+  accessibleLabel: f,
   autoResize: n = !1,
   className: E,
   closeFullscreenLabel: k = "Close fullscreen",
-  fullscreenLabel: B = "View in fullscreen",
-  hasFullscreenView: G = !0,
-  loading: V = "lazy",
+  fullscreenLabel: z = "View in fullscreen",
+  hasFullscreenView: B = !0,
+  loading: G = "lazy",
   onLoad: d,
   referrerPolicy: y = "no-referrer",
   sandbox: M = "",
   srcDoc: h,
   style: T,
-  ...F
+  ...A
 }) => {
-  const w = v(null), i = v(null), o = v(null), [$, A] = C(u), [b, p] = C(!1), g = H(() => {
-    i.current !== null && (window.cancelAnimationFrame(i.current), i.current = null), o.current !== null && (window.clearTimeout(o.current), o.current = null);
-  }, []), _ = H(() => {
+  const p = H(null), o = H(null), i = H(null), [V, F] = S(u), [x, w] = S(!1), g = v(() => {
+    o.current !== null && (window.cancelAnimationFrame(o.current), o.current = null), i.current !== null && (window.clearTimeout(i.current), i.current = null);
+  }, []), _ = v(() => {
     if (!n) return;
-    const r = w.current, e = r == null ? void 0 : r.contentDocument;
+    const r = p.current, e = r == null ? void 0 : r.contentDocument;
     if (!r || !e) return;
-    const f = r.style.height;
+    const m = r.style.height;
     try {
       r.style.height = `${u}px`;
-      const c = e.querySelector("[data-iframe-content]") ?? e.body, a = c.getBoundingClientRect(), {
-        body: x,
+      const c = e.querySelector("[data-iframe-content]") ?? e.body, s = c.getBoundingClientRect(), {
+        body: C,
         documentElement: I
-      } = e, q = Math.min(Math.max(Math.ceil(Math.max(c.scrollHeight, c.offsetHeight, a.height, x.scrollHeight, x.offsetHeight, I.scrollHeight, I.offsetHeight) + W), u), Q);
-      A(q);
+      } = e, j = Math.min(Math.max(Math.ceil(Math.max(c.scrollHeight, c.offsetHeight, s.height, C.scrollHeight, C.offsetHeight, I.scrollHeight, I.offsetHeight) + Y), u), W);
+      F(j);
     } catch {
     } finally {
-      r.style.height = f;
+      r.style.height = m;
     }
-  }, [n]), t = H(() => {
-    !n || i.current !== null || (i.current = window.requestAnimationFrame(() => {
-      i.current = null, _(), o.current !== null && window.clearTimeout(o.current), o.current = window.setTimeout(() => {
-        o.current = null, _();
+  }, [n]), t = v(() => {
+    !n || o.current !== null || (o.current = window.requestAnimationFrame(() => {
+      o.current = null, _(), i.current !== null && window.clearTimeout(i.current), i.current = window.setTimeout(() => {
+        i.current = null, _();
       }, 250);
     }));
-  }, [n, _]), j = (r) => {
-    var f, c;
+  }, [n, _]), $ = (r) => {
+    var m, c;
     t();
-    const e = (f = w.current) == null ? void 0 : f.contentDocument;
-    Array.from((e == null ? void 0 : e.images) ?? []).forEach((a) => {
-      a.complete || (a.addEventListener("load", t, {
+    const e = (m = p.current) == null ? void 0 : m.contentDocument;
+    Array.from((e == null ? void 0 : e.images) ?? []).forEach((s) => {
+      s.complete || (s.addEventListener("load", t, {
         once: !0
-      }), a.addEventListener("error", t, {
+      }), s.addEventListener("error", t, {
         once: !0
       }));
     }), (c = e == null ? void 0 : e.fonts) == null || c.ready.then(t).catch(() => {
     }), d == null || d(r);
   };
-  return S(() => {
+  return U(() => {
     if (n)
-      return g(), A(u), t(), g;
-  }, [n, g, t, h]), S(() => {
+      return g(), F(u), t(), g;
+  }, [n, g, t, h]), U(() => {
     var r;
     if (n)
       return window.addEventListener("resize", t), (r = window.visualViewport) == null || r.addEventListener("resize", t), () => {
         var e;
         window.removeEventListener("resize", t), (e = window.visualViewport) == null || e.removeEventListener("resize", t);
       };
-  }, [n, t]), /* @__PURE__ */ N("div", { className: l.wrapper, "data-component": "iframe", children: [
-    G && /* @__PURE__ */ s("div", { className: l.toolbar, children: /* @__PURE__ */ s(U, { "aria-expanded": b, "aria-haspopup": "dialog", onClick: () => p(!0), variant: "tertiary", children: B }) }),
-    /* @__PURE__ */ s("iframe", { ...F, className: O(l.iframe, E), loading: V, onLoad: j, ref: w, referrerPolicy: y, sandbox: M, srcDoc: h, style: n ? {
+  }, [n, t]), /* @__PURE__ */ q("div", { className: a.wrapper, "data-component": "iframe", children: [
+    B && /* @__PURE__ */ l("div", { className: a.toolbar, children: /* @__PURE__ */ l(N, { "aria-expanded": x, "aria-haspopup": "dialog", onClick: () => w(!0), variant: "tertiary", children: z }) }),
+    /* @__PURE__ */ l("iframe", { ...A, className: O(a.iframe, E), loading: G, onLoad: $, ref: p, referrerPolicy: y, sandbox: M, srcDoc: h, style: n ? {
       ...T,
-      height: $,
+      height: V,
       minHeight: u
-    } : T, title: m }),
-    b && /* @__PURE__ */ N(L, { "aria-label": `${m} fullscreen`, className: l["fullscreen-dialog"], open: !0, setOpen: p, children: [
-      /* @__PURE__ */ s("div", { className: l["fullscreen-toolbar"], children: /* @__PURE__ */ s(U, { autoFocus: !0, onClick: () => p(!1), children: k }) }),
-      /* @__PURE__ */ s("iframe", { ...F, className: O(l.iframe, l["fullscreen-iframe"], E), loading: "eager", referrerPolicy: y, sandbox: M, srcDoc: h, title: `${m} fullscreen` })
-    ] })
+    } : T, title: f }),
+    x && /* @__PURE__ */ l(L, { "aria-label": `${f} fullscreen`, controls: /* @__PURE__ */ l(b, { children: /* @__PURE__ */ l(N, { onClick: () => w(!1), children: k }) }), fullscreen: !0, header: /* @__PURE__ */ l(X, { children: /* @__PURE__ */ l("h2", { children: f }) }), open: !0, setOpen: w, children: /* @__PURE__ */ l("iframe", { ...A, className: O(a.iframe, a["fullscreen-iframe"], E), loading: "eager", referrerPolicy: y, sandbox: M, srcDoc: h, title: `${f} fullscreen` }) })
   ] });
 };
 export {
-  R as Iframe
+  ne as Iframe
 };
 //# sourceMappingURL=index.js.map

package/dist/components/iframe/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/iframe/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { type ComponentPropsWithoutRef, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Dialog } from '../dialog';\nimport styles from './styles.module.css';\n\nconst MIN_AUTO_HEIGHT = 120;\nconst MAX_AUTO_HEIGHT = 12000;\nconst AUTO_HEIGHT_BUFFER = 8;\n\nexport type IframeProps = Omit<ComponentPropsWithoutRef<'iframe'>, 'src' | 'srcDoc' | 'title'> & {\n  accessibleLabel: string;\n  autoResize?: boolean;\n  closeFullscreenLabel?: string;\n  fullscreenLabel?: string;\n  hasFullscreenView?: boolean;\n  srcDoc: string;\n};\n\nexport const Iframe = ({\n  accessibleLabel,\n  autoResize = false,\n  className,\n  closeFullscreenLabel = 'Close fullscreen',\n  fullscreenLabel = 'View in fullscreen',\n  hasFullscreenView = true,\n  loading = 'lazy',\n  onLoad,\n  referrerPolicy = 'no-referrer',\n  sandbox = '',\n  srcDoc,\n  style,\n  ...props\n}: IframeProps) => {\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const measurementFrameRef = useRef<number | null>(null);\n  const followUpMeasurementTimeoutRef = useRef<number | null>(null);\n  const [measuredHeight, setMeasuredHeight] = useState(MIN_AUTO_HEIGHT);\n  const [isFullscreenOpen, setIsFullscreenOpen] = useState(false);\n\n  const clearScheduledMeasurements = useCallback(() => {\n    if (measurementFrameRef.current !== null) {\n      window.cancelAnimationFrame(measurementFrameRef.current);\n      measurementFrameRef.current = null;\n    }\n\n    if (followUpMeasurementTimeoutRef.current !== null) {\n      window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      followUpMeasurementTimeoutRef.current = null;\n    }\n  }, []);\n\n  const measureSize = useCallback(() => {\n    if (!autoResize) return;\n\n    const iframe = iframeRef.current;\n    const iframeDocument = iframe?.contentDocument;\n    if (!iframe || !iframeDocument) return;\n\n    const renderedHeight = iframe.style.height;\n\n    try {\n      // measure from a stable viewport height so content sized with percentages or\n      // viewport units cannot feed the iframe's previous height back into itself\n      iframe.style.height = `${MIN_AUTO_HEIGHT}px`;\n\n      const content =\n        iframeDocument.querySelector<HTMLElement>('[data-iframe-content]') ?? iframeDocument.body;\n      const contentRect = content.getBoundingClientRect();\n      const { body, documentElement } = iframeDocument;\n      const height = Math.min(\n        Math.max(\n          Math.ceil(\n            Math.max(\n              content.scrollHeight,\n              content.offsetHeight,\n              contentRect.height,\n              body.scrollHeight,\n              body.offsetHeight,\n              documentElement.scrollHeight,\n              documentElement.offsetHeight\n            ) + AUTO_HEIGHT_BUFFER\n          ),\n          MIN_AUTO_HEIGHT\n        ),\n        MAX_AUTO_HEIGHT\n      );\n\n      setMeasuredHeight(height);\n    } catch {\n      // cross-origin iframe content cannot be measured; retain minimum height\n    } finally {\n      iframe.style.height = renderedHeight;\n    }\n  }, [autoResize]);\n\n  const scheduleSizeMeasurement = useCallback(() => {\n    if (!autoResize || measurementFrameRef.current !== null) return;\n\n    measurementFrameRef.current = window.requestAnimationFrame(() => {\n      measurementFrameRef.current = null;\n      measureSize();\n\n      if (followUpMeasurementTimeoutRef.current !== null) {\n        window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      }\n\n      followUpMeasurementTimeoutRef.current = window.setTimeout(() => {\n        followUpMeasurementTimeoutRef.current = null;\n        measureSize();\n      }, 250);\n    });\n  }, [autoResize, measureSize]);\n\n  const handleLoad: NonNullable<IframeProps['onLoad']> = (event) => {\n    scheduleSizeMeasurement();\n\n    const iframeDocument = iframeRef.current?.contentDocument;\n    Array.from(iframeDocument?.images ?? []).forEach((image) => {\n      if (image.complete) return;\n      image.addEventListener('load', scheduleSizeMeasurement, { once: true });\n      image.addEventListener('error', scheduleSizeMeasurement, { once: true });\n    });\n    iframeDocument?.fonts?.ready.then(scheduleSizeMeasurement).catch(() => undefined);\n\n    onLoad?.(event);\n  };\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    clearScheduledMeasurements();\n    setMeasuredHeight(MIN_AUTO_HEIGHT);\n    scheduleSizeMeasurement();\n\n    return clearScheduledMeasurements;\n  }, [autoResize, clearScheduledMeasurements, scheduleSizeMeasurement, srcDoc]);\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    window.addEventListener('resize', scheduleSizeMeasurement);\n    window.visualViewport?.addEventListener('resize', scheduleSizeMeasurement);\n\n    return () => {\n      window.removeEventListener('resize', scheduleSizeMeasurement);\n      window.visualViewport?.removeEventListener('resize', scheduleSizeMeasurement);\n    };\n  }, [autoResize, scheduleSizeMeasurement]);\n\n  return (\n    <div className={styles.wrapper}>\n      {hasFullscreenView && (\n        <div className={styles.toolbar}>\n          <Button\n            aria-expanded={isFullscreenOpen}\n            aria-haspopup='dialog'\n            onClick={() => setIsFullscreenOpen(true)}\n            variant='tertiary'\n          >\n            {fullscreenLabel}\n          </Button>\n        </div>\n      )}\n      <iframe\n        {...props}\n        className={cx(styles.iframe, className)}\n        loading={loading}\n        onLoad={handleLoad}\n        ref={iframeRef}\n        referrerPolicy={referrerPolicy}\n        sandbox={sandbox}\n        srcDoc={srcDoc}\n        style={\n          autoResize\n            ? {\n                ...style,\n                height: measuredHeight,\n                minHeight: MIN_AUTO_HEIGHT,\n              }\n            : style\n        }\n        title={accessibleLabel}\n      />\n      {isFullscreenOpen && (\n        <Dialog\n          aria-label={`${accessibleLabel} fullscreen`}\n          className={styles['fullscreen-dialog']}\n          open\n          setOpen={setIsFullscreenOpen}\n        >\n          <div className={styles['fullscreen-toolbar']}>\n            <Button\n              autoFocus\n              onClick={() => setIsFullscreenOpen(false)}\n            >\n              {closeFullscreenLabel}\n            </Button>\n          </div>\n          <iframe\n            {...props}\n            className={cx(styles.iframe, styles['fullscreen-iframe'], className)}\n            loading='eager'\n            referrerPolicy={referrerPolicy}\n            sandbox={sandbox}\n            srcDoc={srcDoc}\n            title={`${accessibleLabel} fullscreen`}\n          />\n        </Dialog>\n      )}\n    </div>\n  );\n};\n"],"names":["MIN_AUTO_HEIGHT","MAX_AUTO_HEIGHT","AUTO_HEIGHT_BUFFER","Iframe","accessibleLabel","autoResize","className","closeFullscreenLabel","fullscreenLabel","hasFullscreenView","loading","onLoad","referrerPolicy","sandbox","srcDoc","style","props","iframeRef","useRef","measurementFrameRef","followUpMeasurementTimeoutRef","measuredHeight","setMeasuredHeight","useState","isFullscreenOpen","setIsFullscreenOpen","clearScheduledMeasurements","useCallback","current","window","cancelAnimationFrame","clearTimeout","measureSize","iframe","iframeDocument","contentDocument","renderedHeight","height","content","querySelector","body","contentRect","getBoundingClientRect","documentElement","Math","min","max","ceil","scrollHeight","offsetHeight","scheduleSizeMeasurement","requestAnimationFrame","setTimeout","handleLoad","event","Array","from","images","forEach","image","complete","addEventListener","once","fonts","ready","then","catch","useEffect","visualViewport","removeEventListener","styles","wrapper","toolbar","jsx","Button","cx","minHeight","jsxs","Dialog"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/iframe/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { type ComponentPropsWithoutRef, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '../button';\nimport { Controls } from '../controls';\nimport { Dialog } from '../dialog';\nimport { Header } from '../header';\nimport styles from './styles.module.css';\n\nconst MIN_AUTO_HEIGHT = 120;\nconst MAX_AUTO_HEIGHT = 12000;\nconst AUTO_HEIGHT_BUFFER = 8;\n\nexport type IframeProps = Omit<ComponentPropsWithoutRef<'iframe'>, 'src' | 'srcDoc' | 'title'> & {\n  accessibleLabel: string;\n  autoResize?: boolean;\n  closeFullscreenLabel?: string;\n  fullscreenLabel?: string;\n  hasFullscreenView?: boolean;\n  srcDoc: string;\n};\n\nexport const Iframe = ({\n  accessibleLabel,\n  autoResize = false,\n  className,\n  closeFullscreenLabel = 'Close fullscreen',\n  fullscreenLabel = 'View in fullscreen',\n  hasFullscreenView = true,\n  loading = 'lazy',\n  onLoad,\n  referrerPolicy = 'no-referrer',\n  sandbox = '',\n  srcDoc,\n  style,\n  ...props\n}: IframeProps) => {\n  const iframeRef = useRef<HTMLIFrameElement>(null);\n  const measurementFrameRef = useRef<number | null>(null);\n  const followUpMeasurementTimeoutRef = useRef<number | null>(null);\n  const [measuredHeight, setMeasuredHeight] = useState(MIN_AUTO_HEIGHT);\n  const [isFullscreenOpen, setIsFullscreenOpen] = useState(false);\n\n  const clearScheduledMeasurements = useCallback(() => {\n    if (measurementFrameRef.current !== null) {\n      window.cancelAnimationFrame(measurementFrameRef.current);\n      measurementFrameRef.current = null;\n    }\n\n    if (followUpMeasurementTimeoutRef.current !== null) {\n      window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      followUpMeasurementTimeoutRef.current = null;\n    }\n  }, []);\n\n  const measureSize = useCallback(() => {\n    if (!autoResize) return;\n\n    const iframe = iframeRef.current;\n    const iframeDocument = iframe?.contentDocument;\n    if (!iframe || !iframeDocument) return;\n\n    const renderedHeight = iframe.style.height;\n\n    try {\n      // measure from a stable viewport height so content sized with percentages or\n      // viewport units cannot feed the iframe's previous height back into itself\n      iframe.style.height = `${MIN_AUTO_HEIGHT}px`;\n\n      const content =\n        iframeDocument.querySelector<HTMLElement>('[data-iframe-content]') ?? iframeDocument.body;\n      const contentRect = content.getBoundingClientRect();\n      const { body, documentElement } = iframeDocument;\n      const height = Math.min(\n        Math.max(\n          Math.ceil(\n            Math.max(\n              content.scrollHeight,\n              content.offsetHeight,\n              contentRect.height,\n              body.scrollHeight,\n              body.offsetHeight,\n              documentElement.scrollHeight,\n              documentElement.offsetHeight\n            ) + AUTO_HEIGHT_BUFFER\n          ),\n          MIN_AUTO_HEIGHT\n        ),\n        MAX_AUTO_HEIGHT\n      );\n\n      setMeasuredHeight(height);\n    } catch {\n      // cross-origin iframe content cannot be measured; retain minimum height\n    } finally {\n      iframe.style.height = renderedHeight;\n    }\n  }, [autoResize]);\n\n  const scheduleSizeMeasurement = useCallback(() => {\n    if (!autoResize || measurementFrameRef.current !== null) return;\n\n    measurementFrameRef.current = window.requestAnimationFrame(() => {\n      measurementFrameRef.current = null;\n      measureSize();\n\n      if (followUpMeasurementTimeoutRef.current !== null) {\n        window.clearTimeout(followUpMeasurementTimeoutRef.current);\n      }\n\n      followUpMeasurementTimeoutRef.current = window.setTimeout(() => {\n        followUpMeasurementTimeoutRef.current = null;\n        measureSize();\n      }, 250);\n    });\n  }, [autoResize, measureSize]);\n\n  const handleLoad: NonNullable<IframeProps['onLoad']> = (event) => {\n    scheduleSizeMeasurement();\n\n    const iframeDocument = iframeRef.current?.contentDocument;\n    Array.from(iframeDocument?.images ?? []).forEach((image) => {\n      if (image.complete) return;\n      image.addEventListener('load', scheduleSizeMeasurement, { once: true });\n      image.addEventListener('error', scheduleSizeMeasurement, { once: true });\n    });\n    iframeDocument?.fonts?.ready.then(scheduleSizeMeasurement).catch(() => undefined);\n\n    onLoad?.(event);\n  };\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    clearScheduledMeasurements();\n    setMeasuredHeight(MIN_AUTO_HEIGHT);\n    scheduleSizeMeasurement();\n\n    return clearScheduledMeasurements;\n  }, [autoResize, clearScheduledMeasurements, scheduleSizeMeasurement, srcDoc]);\n\n  useEffect(() => {\n    if (!autoResize) return undefined;\n\n    window.addEventListener('resize', scheduleSizeMeasurement);\n    window.visualViewport?.addEventListener('resize', scheduleSizeMeasurement);\n\n    return () => {\n      window.removeEventListener('resize', scheduleSizeMeasurement);\n      window.visualViewport?.removeEventListener('resize', scheduleSizeMeasurement);\n    };\n  }, [autoResize, scheduleSizeMeasurement]);\n\n  return (\n    <div className={styles.wrapper}>\n      {hasFullscreenView && (\n        <div className={styles.toolbar}>\n          <Button\n            aria-expanded={isFullscreenOpen}\n            aria-haspopup='dialog'\n            onClick={() => setIsFullscreenOpen(true)}\n            variant='tertiary'\n          >\n            {fullscreenLabel}\n          </Button>\n        </div>\n      )}\n      <iframe\n        {...props}\n        className={cx(styles.iframe, className)}\n        loading={loading}\n        onLoad={handleLoad}\n        ref={iframeRef}\n        referrerPolicy={referrerPolicy}\n        sandbox={sandbox}\n        srcDoc={srcDoc}\n        style={\n          autoResize\n            ? {\n                ...style,\n                height: measuredHeight,\n                minHeight: MIN_AUTO_HEIGHT,\n              }\n            : style\n        }\n        title={accessibleLabel}\n      />\n      {isFullscreenOpen && (\n        <Dialog\n          aria-label={`${accessibleLabel} fullscreen`}\n          controls={\n            <Controls>\n              <Button onClick={() => setIsFullscreenOpen(false)}>{closeFullscreenLabel}</Button>\n            </Controls>\n          }\n          fullscreen\n          header={\n            <Header>\n              <h2>{accessibleLabel}</h2>\n            </Header>\n          }\n          open\n          setOpen={setIsFullscreenOpen}\n        >\n          <iframe\n            {...props}\n            className={cx(styles.iframe, styles['fullscreen-iframe'], className)}\n            loading='eager'\n            referrerPolicy={referrerPolicy}\n            sandbox={sandbox}\n            srcDoc={srcDoc}\n            title={`${accessibleLabel} fullscreen`}\n          />\n        </Dialog>\n      )}\n    </div>\n  );\n};\n"],"names":["MIN_AUTO_HEIGHT","MAX_AUTO_HEIGHT","AUTO_HEIGHT_BUFFER","Iframe","accessibleLabel","autoResize","className","closeFullscreenLabel","fullscreenLabel","hasFullscreenView","loading","onLoad","referrerPolicy","sandbox","srcDoc","style","props","iframeRef","useRef","measurementFrameRef","followUpMeasurementTimeoutRef","measuredHeight","setMeasuredHeight","useState","isFullscreenOpen","setIsFullscreenOpen","clearScheduledMeasurements","useCallback","current","window","cancelAnimationFrame","clearTimeout","measureSize","iframe","iframeDocument","contentDocument","renderedHeight","height","content","querySelector","body","contentRect","getBoundingClientRect","documentElement","Math","min","max","ceil","scrollHeight","offsetHeight","scheduleSizeMeasurement","requestAnimationFrame","setTimeout","handleLoad","event","Array","from","images","forEach","image","complete","addEventListener","once","fonts","ready","then","catch","useEffect","visualViewport","removeEventListener","styles","wrapper","toolbar","jsx","Button","cx","minHeight","Dialog","Controls","Header"],"mappings":";;;;;;;;;;;;GASMA,IAAkB,KAClBC,IAAkB,MAClBC,IAAqB,GAWdC,KAASA,CAAC;AAAA,EACrBC,iBAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,WAAAA;AAAAA,EACAC,sBAAAA,IAAuB;AAAA,EACvBC,iBAAAA,IAAkB;AAAA,EAClBC,mBAAAA,IAAoB;AAAA,EACpBC,SAAAA,IAAU;AAAA,EACVC,QAAAA;AAAAA,EACAC,gBAAAA,IAAiB;AAAA,EACjBC,SAAAA,IAAU;AAAA,EACVC,QAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,QAAMC,IAAYC,EAA0B,IAAI,GAC1CC,IAAsBD,EAAsB,IAAI,GAChDE,IAAgCF,EAAsB,IAAI,GAC1D,CAACG,GAAgBC,CAAiB,IAAIC,EAASvB,CAAe,GAC9D,CAACwB,GAAkBC,CAAmB,IAAIF,EAAS,EAAK,GAExDG,IAA6BC,EAAY,MAAM;AACnD,IAAIR,EAAoBS,YAAY,SAClCC,OAAOC,qBAAqBX,EAAoBS,OAAO,GACvDT,EAAoBS,UAAU,OAG5BR,EAA8BQ,YAAY,SAC5CC,OAAOE,aAAaX,EAA8BQ,OAAO,GACzDR,EAA8BQ,UAAU;AAAA,EAE5C,GAAG,CAAA,CAAE,GAECI,IAAcL,EAAY,MAAM;AACpC,QAAI,CAACtB,EAAY;AAEjB,UAAM4B,IAAShB,EAAUW,SACnBM,IAAiBD,KAAAA,gBAAAA,EAAQE;AAC/B,QAAI,CAACF,KAAU,CAACC,EAAgB;AAEhC,UAAME,IAAiBH,EAAOlB,MAAMsB;AAEpC,QAAI;AAGFJ,MAAAA,EAAOlB,MAAMsB,SAAS,GAAGrC,CAAe;AAExC,YAAMsC,IACJJ,EAAeK,cAA2B,uBAAuB,KAAKL,EAAeM,MACjFC,IAAcH,EAAQI,sBAAAA,GACtB;AAAA,QAAEF,MAAAA;AAAAA,QAAMG,iBAAAA;AAAAA,MAAAA,IAAoBT,GAC5BG,IAASO,KAAKC,IAClBD,KAAKE,IACHF,KAAKG,KACHH,KAAKE,IACHR,EAAQU,cACRV,EAAQW,cACRR,EAAYJ,QACZG,EAAKQ,cACLR,EAAKS,cACLN,EAAgBK,cAChBL,EAAgBM,YAClB,IAAI/C,CACN,GACAF,CACF,GACAC,CACF;AAEAqB,MAAAA,EAAkBe,CAAM;AAAA,IAC1B,QAAQ;AAAA,IACN,UAAA;AAEAJ,MAAAA,EAAOlB,MAAMsB,SAASD;AAAAA,IACxB;AAAA,EACF,GAAG,CAAC/B,CAAU,CAAC,GAET6C,IAA0BvB,EAAY,MAAM;AAChD,IAAI,CAACtB,KAAcc,EAAoBS,YAAY,SAEnDT,EAAoBS,UAAUC,OAAOsB,sBAAsB,MAAM;AAC/DhC,MAAAA,EAAoBS,UAAU,MAC9BI,EAAAA,GAEIZ,EAA8BQ,YAAY,QAC5CC,OAAOE,aAAaX,EAA8BQ,OAAO,GAG3DR,EAA8BQ,UAAUC,OAAOuB,WAAW,MAAM;AAC9DhC,QAAAA,EAA8BQ,UAAU,MACxCI,EAAAA;AAAAA,MACF,GAAG,GAAG;AAAA,IACR,CAAC;AAAA,EACH,GAAG,CAAC3B,GAAY2B,CAAW,CAAC,GAEtBqB,IAAkDC,CAAAA,MAAU;;AAChEJ,IAAAA,EAAAA;AAEA,UAAMhB,KAAiBjB,IAAAA,EAAUW,YAAVX,gBAAAA,EAAmBkB;AAC1CoB,UAAMC,MAAKtB,KAAAA,gBAAAA,EAAgBuB,WAAU,CAAA,CAAE,EAAEC,QAASC,CAAAA,MAAU;AAC1D,MAAIA,EAAMC,aACVD,EAAME,iBAAiB,QAAQX,GAAyB;AAAA,QAAEY,MAAM;AAAA,MAAA,CAAM,GACtEH,EAAME,iBAAiB,SAASX,GAAyB;AAAA,QAAEY,MAAM;AAAA,MAAA,CAAM;AAAA,IACzE,CAAC,IACD5B,IAAAA,KAAAA,gBAAAA,EAAgB6B,UAAhB7B,QAAAA,EAAuB8B,MAAMC,KAAKf,GAAyBgB,MAAM,MAAA;AAAA,QAEjEvD,KAAAA,QAAAA,EAAS2C;AAAAA,EACX;AAEAa,SAAAA,EAAU,MAAM;AACd,QAAK9D;AAELqB,aAAAA,EAAAA,GACAJ,EAAkBtB,CAAe,GACjCkD,EAAAA,GAEOxB;AAAAA,EACT,GAAG,CAACrB,GAAYqB,GAA4BwB,GAAyBpC,CAAM,CAAC,GAE5EqD,EAAU,MAAM;;AACd,QAAK9D;AAELwB,oBAAOgC,iBAAiB,UAAUX,CAAuB,IACzDrB,IAAAA,OAAOuC,mBAAPvC,QAAAA,EAAuBgC,iBAAiB,UAAUX,IAE3C,MAAM;;AACXrB,eAAOwC,oBAAoB,UAAUnB,CAAuB,IAC5DrB,IAAAA,OAAOuC,mBAAPvC,QAAAA,EAAuBwC,oBAAoB,UAAUnB;AAAAA,MACvD;AAAA,EACF,GAAG,CAAC7C,GAAY6C,CAAuB,CAAC,qBAGrC,OAAA,EAAI,WAAWoB,EAAOC,SAAQ,kBAAA,UAC5B9D,UAAAA;AAAAA,IAAAA,uBACE,OAAA,EAAI,WAAW6D,EAAOE,SACrB,UAAA,gBAAAC,EAACC,KACC,iBAAelD,GACf,iBAAc,UACd,SAAS,MAAMC,EAAoB,EAAI,GACvC,SAAQ,YAEPjB,aACH,EAAA,CACF;AAAA,sBAED,UAAA,EACC,GAAIQ,GACJ,WAAW2D,EAAGL,EAAOrC,QAAQ3B,CAAS,GACtC,SAAAI,GACA,QAAQ2C,GACR,KAAKpC,GACL,gBAAAL,GACA,SAAAC,GACA,QAAAC,GACA,OACET,IACI;AAAA,MACE,GAAGU;AAAAA,MACHsB,QAAQhB;AAAAA,MACRuD,WAAW5E;AAAAA,IAAAA,IAEbe,GAEN,OAAOX,GAAgB;AAAA,IAExBoB,KACC,gBAAAiD,EAACI,GAAA,EACC,cAAY,GAAGzE,CAAe,eAC9B,UACE,gBAAAqE,EAACK,GAAA,EACC,UAAA,gBAAAL,EAACC,GAAA,EAAO,SAAS,MAAMjD,EAAoB,EAAK,GAAIlB,UAAAA,EAAAA,CAAqB,EAAA,CAC3E,GAEF,YAAU,IACV,QACE,gBAAAkE,EAACM,GAAA,EACC,UAAA,gBAAAN,EAAC,MAAA,EAAIrE,UAAAA,EAAAA,CAAgB,GACvB,GAEF,MAAI,IACJ,SAASqB,GAET,UAAA,gBAAAgD,EAAC,UAAA,EACC,GAAIzD,GACJ,WAAW2D,EAAGL,EAAOrC,QAAQqC,EAAO,mBAAmB,GAAGhE,CAAS,GACnE,SAAQ,SACR,gBAAAM,GACA,SAAAC,GACA,QAAAC,GACA,OAAO,GAAGV,CAAe,cAAA,CAAc,EAAA,CAE3C;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/message/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index15.css');const e=require("react/jsx-runtime"),v=require("../../classix-5H4IWnMA.cjs"),x=require("../avatar/index.cjs"),b=require("../icon/index.cjs"),j="_message_1bnsh_1",f="_timestamp_1bnsh_91",w="_attachments_1bnsh_96",S="_preview_1bnsh_115",t={"message-group":"_message-group_1bnsh_1",message:j,timestamp:f,attachments:w,preview:S},q=({appearance:o="default",attachments:i,author:a,authorColor:r,authorImageUrl:l,authorRole:d,content:g,iconName:_="info",id:p,preview:u,timestamp:m,timestampText:h,type:s="default"})=>{const n=m?new Date(m):void 0,c=n?e.jsx("time",{className:t.timestamp,dateTime:n.toISOString(),children:h??n.toLocaleString()}):null;return e.jsxs("div",{className:t["message-group"],"data-message-type":s,"data-component":"message",children:[a&&e.jsx(x.Avatar,{accessibleLabel:a,color:r,imageUrl:l,name:a,role:d}),s==="system"&&c,e.jsxs("div",{className:v.t(t.message,u&&t.preview),"data-appearance":o,"data-id":p,"data-type":s,children:[s=="system"&&e.jsx(b.Icon,{fill:!0,gap:"right",name:_}),g]}),i&&e.jsx("div",{className:t.attachments,children:i}),s!=="system"&&c]})};exports.Message=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index15.css');const e=require("react/jsx-runtime"),x=require("../../classix-5H4IWnMA.cjs"),j=require("../avatar/index.cjs"),h=require("../icon/index.cjs"),f="_message_8sz6c_1",w="_timestamp_8sz6c_87",z="_attachments_8sz6c_92",S="_preview_8sz6c_111",t={"message-group":"_message-group_8sz6c_1",message:f,timestamp:w,attachments:z,preview:S},b=({appearance:o="default",attachments:c,author:a,authorColor:r,authorImageUrl:l,authorRole:d,content:g,iconName:_="info",id:p,preview:u,timestamp:i,timestampText:v,type:s="default"})=>{const n=i?new Date(i):void 0,m=n?e.jsx("time",{className:t.timestamp,dateTime:n.toISOString(),children:v??n.toLocaleString()}):null;return e.jsxs("div",{className:t["message-group"],"data-message-type":s,"data-component":"message",children:[a&&e.jsx(j.Avatar,{accessibleLabel:a,color:r,imageUrl:l,name:a,role:d}),s==="system"&&m,e.jsxs("div",{className:x.t(t.message,u&&t.preview),"data-appearance":o,"data-id":p,"data-type":s,children:[s=="system"&&e.jsx(h.Icon,{fill:!0,gap:"right",name:_}),g]}),c&&e.jsx("div",{className:t.attachments,children:c}),s!=="system"&&m]})};exports.Message=b;
 //# sourceMappingURL=index.cjs.map

package/dist/components/message/index.js

@@ -1,41 +1,41 @@
 import { jsx as a, jsxs as r } from "react/jsx-runtime";
-import { t as b } from "../../classix-DG18itHa.js";
-import { Avatar as u } from "../avatar/index.js";
-import { Icon as w } from "../icon/index.js";
-import '../../assets/index15.css';const N = "_message_1bnsh_1", x = "_timestamp_1bnsh_91", S = "_attachments_1bnsh_96", j = "_preview_1bnsh_115", s = {
-  "message-group": "_message-group_1bnsh_1",
+import { t as u } from "../../classix-DG18itHa.js";
+import { Avatar as w } from "../avatar/index.js";
+import { Icon as z } from "../icon/index.js";
+import '../../assets/index15.css';const N = "_message_8sz6c_1", x = "_timestamp_8sz6c_87", S = "_attachments_8sz6c_92", b = "_preview_8sz6c_111", s = {
+  "message-group": "_message-group_8sz6c_1",
   message: N,
   timestamp: x,
   attachments: S,
-  preview: j
-}, D = ({
-  appearance: c = "default",
-  attachments: n,
+  preview: b
+}, A = ({
+  appearance: n = "default",
+  attachments: c,
   author: t,
   authorColor: l,
   authorImageUrl: d,
   authorRole: g,
   content: p,
   iconName: _ = "info",
-  id: h,
-  preview: v,
+  id: v,
+  preview: f,
   timestamp: i,
-  timestampText: f,
+  timestampText: h,
   type: e = "default"
 }) => {
-  const m = i ? new Date(i) : void 0, o = m ? /* @__PURE__ */ a("time", { className: s.timestamp, dateTime: m.toISOString(), children: f ?? m.toLocaleString() }) : null;
+  const m = i ? new Date(i) : void 0, o = m ? /* @__PURE__ */ a("time", { className: s.timestamp, dateTime: m.toISOString(), children: h ?? m.toLocaleString() }) : null;
   return /* @__PURE__ */ r("div", { className: s["message-group"], "data-message-type": e, "data-component": "message", children: [
-    t && /* @__PURE__ */ a(u, { accessibleLabel: t, color: l, imageUrl: d, name: t, role: g }),
+    t && /* @__PURE__ */ a(w, { accessibleLabel: t, color: l, imageUrl: d, name: t, role: g }),
     e === "system" && o,
-    /* @__PURE__ */ r("div", { className: b(s.message, v && s.preview), "data-appearance": c, "data-id": h, "data-type": e, children: [
-      e == "system" && /* @__PURE__ */ a(w, { fill: !0, gap: "right", name: _ }),
+    /* @__PURE__ */ r("div", { className: u(s.message, f && s.preview), "data-appearance": n, "data-id": v, "data-type": e, children: [
+      e == "system" && /* @__PURE__ */ a(z, { fill: !0, gap: "right", name: _ }),
       p
     ] }),
-    n && /* @__PURE__ */ a("div", { className: s.attachments, children: n }),
+    c && /* @__PURE__ */ a("div", { className: s.attachments, children: c }),
     e !== "system" && o
   ] });
 };
 export {
-  D as Message
+  A as Message
 };
 //# sourceMappingURL=index.js.map

package/dist/components/popover/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index17.css');const w=require("react/jsx-runtime"),C=require("../../classix-5H4IWnMA.cjs"),o=require("react"),K=require("react-dom"),O=require("../button/index.cjs"),H="_popover_1szho_1",N="_inline_1szho_6",W="_below_1szho_38",M="_above_1szho_43",U="_left_1szho_53",X="_right_1szho_58",Y="_trigger_1szho_63",s={popover:H,inline:N,"popover-panel":"_popover-panel_1szho_21",below:W,above:M,"inline-panel":"_inline-panel_1szho_48",left:U,right:X,trigger:Y,"inline-trigger":"_inline-trigger_1szho_77"},G=({children:m,inline:n=!1,position:p="left",triggerAccessibleLabel:L,triggerAriaHasPopup:F,triggerButtonContent:z})=>{var T;const P=o.useRef(null),R=o.useRef(void 0),b=o.useRef(null),D=o.useId(),l=o.useRef(null),[t,x]=o.useState(!1),[d,k]=o.useState(!1),g=p==="auto"?"right":p,[v,E]=o.useState(g),h=({initialFocus:e}={})=>{R.current=e,k(!1),E(g),x(!0)},c=o.useCallback(({restoreFocus:e=!0}={})=>{var a;x(!1),e&&((a=l.current)==null||a.focus())},[]),q=e=>{t&&e.key==="Escape"&&c()},A=e=>{if(!t){if(n&&(e.key==="Enter"||e.key===" ")){e.preventDefault(),h();return}if(e.key==="ArrowDown"){e.preventDefault(),h({initialFocus:"first"});return}e.key==="ArrowUp"&&(e.preventDefault(),h({initialFocus:"last"}))}};o.useEffect(()=>{if(!t)return;const e=a=>{var r,_;const f=a.target;(r=P.current)!=null&&r.contains(f)||(_=b.current)!=null&&_.contains(f)||c({restoreFocus:!1})};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[c,t]);const i=o.useCallback(()=>{const e=b.current,a=l.current;if(!e||!a)return;const f=e.getBoundingClientRect(),r=a.getBoundingClientRect(),_=r.top,j=window.innerHeight-r.bottom;k(f.height>j&&_>j),E(p==="auto"&&f.width>window.innerWidth-r.left&&r.right>window.innerWidth-r.left?"left":g)},[p,g]);o.useLayoutEffect(()=>{if(t)return i(),window.addEventListener("resize",i),window.addEventListener("scroll",i,!0),()=>{window.removeEventListener("resize",i),window.removeEventListener("scroll",i,!0)}},[t,i]);const S=e=>{n&&e.preventDefault(),e.stopPropagation(),t?c({restoreFocus:!1}):h()},B={"aria-controls":t?D:void 0,"aria-expanded":t,"aria-haspopup":F,"aria-label":L,className:n?s["inline-trigger"]:s.trigger,onClick:S,onKeyDown:A},u=n?(T=l.current)==null?void 0:T.getBoundingClientRect():void 0,I=[v==="left"?"translateX(-100%)":"",d?"translateY(calc(-100% - var(--shape-spacing-2xs)))":""].filter(Boolean).join(" "),y=t?w.jsx("div",{className:C.t(s["popover-panel"],s[d?"above":"below"],n&&s["inline-panel"],!n&&s[v]),"data-horizontal-placement":v,"data-placement":d?"above":"below",id:D,ref:b,style:u?{left:v==="left"?u.right:u.left,position:"fixed",top:d?u.top:u.bottom,transform:I||void 0}:void 0,children:typeof m=="function"?m({close:c,initialFocus:R.current,isOpen:t}):m}):null;return w.jsxs("div",{className:C.t(s.popover,n&&s.inline),"data-open":t,onKeyDown:q,onClick:e=>{n&&e.preventDefault(),e.stopPropagation()},ref:P,"data-component":"popover",children:[n?w.jsx("span",{...B,ref:l,role:"button",tabIndex:0,children:z}):w.jsx(O.Button,{...B,ref:l,variant:"secondary",children:z}),n&&y&&typeof document<"u"?K.createPortal(y,document.body):y]})};exports.Popover=G;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index17.css');const m=require("react/jsx-runtime"),C=require("../../classix-5H4IWnMA.cjs"),o=require("react"),K=require("react-dom"),O=require("../button/index.cjs"),H="_popover_1szho_1",N="_inline_1szho_6",W="_below_1szho_38",M="_above_1szho_43",U="_left_1szho_53",X="_right_1szho_58",Y="_trigger_1szho_63",s={popover:H,inline:N,"popover-panel":"_popover-panel_1szho_21",below:W,above:M,"inline-panel":"_inline-panel_1szho_48",left:U,right:X,trigger:Y,"inline-trigger":"_inline-trigger_1szho_77"},G=({children:w,inline:n=!1,position:f="left",triggerAccessibleLabel:L,triggerAriaHasPopup:F,triggerButtonContent:y})=>{var T;const P=o.useRef(null),R=o.useRef(void 0),b=o.useRef(null),D=o.useId(),l=o.useRef(null),[t,x]=o.useState(!1),[d,k]=o.useState(!1),g=f==="auto"?"right":f,[v,E]=o.useState(g),h=({initialFocus:e}={})=>{R.current=e,k(!1),E(g),x(!0)},c=o.useCallback(({restoreFocus:e=!0}={})=>{var i;x(!1),e&&((i=l.current)==null||i.focus())},[]),q=e=>{t&&e.key==="Escape"&&c()},A=e=>{if(!t){if(n&&(e.key==="Enter"||e.key===" ")){e.preventDefault(),h();return}if(e.key==="ArrowDown"){e.preventDefault(),h({initialFocus:"first"});return}e.key==="ArrowUp"&&(e.preventDefault(),h({initialFocus:"last"}))}};o.useEffect(()=>{if(!t)return;const e=i=>{var r,_;const p=i.target;(r=P.current)!=null&&r.contains(p)||(_=b.current)!=null&&_.contains(p)||c({restoreFocus:!1})};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[c,t]);const a=o.useCallback(()=>{const e=b.current,i=l.current;if(!e||!i)return;const p=e.getBoundingClientRect(),r=i.getBoundingClientRect(),_=r.top,j=window.innerHeight-r.bottom;k(p.height>j&&_>j),E(f==="auto"&&p.width>window.innerWidth-r.left&&r.right>window.innerWidth-r.left?"left":g)},[f,g]);o.useLayoutEffect(()=>{if(t)return a(),window.addEventListener("resize",a),window.addEventListener("scroll",a,!0),()=>{window.removeEventListener("resize",a),window.removeEventListener("scroll",a,!0)}},[t,a]);const S=e=>{n&&e.preventDefault(),e.stopPropagation(),t?c({restoreFocus:!1}):h()},B={"aria-controls":t?D:void 0,"aria-expanded":t,"aria-haspopup":F,"aria-label":L,className:n?s["inline-trigger"]:s.trigger,onClick:S,onKeyDown:A},u=n?(T=l.current)==null?void 0:T.getBoundingClientRect():void 0,I=[v==="left"?"translateX(-100%)":"",d?"translateY(calc(-100% - var(--shape-spacing-2xs)))":""].filter(Boolean).join(" "),z=t?m.jsx("div",{className:C.t(s["popover-panel"],s[d?"above":"below"],n&&s["inline-panel"],!n&&s[v]),"data-horizontal-placement":v,"data-placement":d?"above":"below",id:D,ref:b,style:u?{left:v==="left"?u.right:u.left,position:"fixed",top:d?u.top:u.bottom,transform:I||void 0}:void 0,children:typeof w=="function"?w({close:c,initialFocus:R.current,isOpen:t}):w}):null;return m.jsxs("div",{className:C.t(s.popover,n&&s.inline),"data-open":t,onKeyDown:q,onClick:e=>{n&&e.preventDefault(),e.stopPropagation()},ref:P,"data-component":"popover",children:[n?m.jsx("span",{...B,ref:l,role:"button",tabIndex:0,children:y}):m.jsx(O.Button,{...B,ref:l,variant:"simple",children:y}),n&&z&&typeof document<"u"?K.createPortal(z,document.body):z]})};exports.Popover=G;
 //# sourceMappingURL=index.cjs.map

package/dist/components/popover/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/popover/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  type AriaAttributes,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { Button } from '@/components/button';\n\nimport styles from './styles.module.css';\n\nexport type PopoverCloseOptions = {\n  restoreFocus?: boolean;\n};\n\nexport type PopoverInitialFocus = 'first' | 'last';\n\nexport type PopoverRenderProps = {\n  close: (options?: PopoverCloseOptions) => void;\n  initialFocus?: PopoverInitialFocus;\n  isOpen: boolean;\n};\n\ntype PopoverOpenOptions = {\n  initialFocus?: PopoverInitialFocus;\n};\n\nexport type PopoverProps = {\n  children: ReactNode | ((props: PopoverRenderProps) => ReactNode);\n  inline?: boolean;\n  position?: 'auto' | 'left' | 'right';\n  triggerAccessibleLabel?: string;\n  triggerAriaHasPopup?: AriaAttributes['aria-haspopup'];\n  triggerButtonContent: ReactNode;\n};\n\nexport const Popover = ({\n  children,\n  inline = false,\n  position = 'left',\n  triggerAccessibleLabel,\n  triggerAriaHasPopup,\n  triggerButtonContent,\n}: PopoverProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const initialFocusRef = useRef<PopoverInitialFocus | undefined>(undefined);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const panelId = useId();\n  const triggerRef = useRef<HTMLButtonElement | HTMLSpanElement>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [opensAbove, setOpensAbove] = useState(false);\n  const preferredHorizontalPlacement = position === 'auto' ? 'right' : position;\n  const [horizontalPlacement, setHorizontalPlacement] = useState<'left' | 'right'>(\n    preferredHorizontalPlacement\n  );\n\n  const openPopover = ({ initialFocus }: PopoverOpenOptions = {}) => {\n    initialFocusRef.current = initialFocus;\n    setOpensAbove(false);\n    setHorizontalPlacement(preferredHorizontalPlacement);\n    setIsOpen(true);\n  };\n\n  const closePopover = useCallback(({ restoreFocus = true }: PopoverCloseOptions = {}) => {\n    setIsOpen(false);\n\n    if (restoreFocus) {\n      triggerRef.current?.focus();\n    }\n  }, []);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (isOpen && event.key === 'Escape') {\n      closePopover();\n    }\n  };\n\n  const handleTriggerKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (isOpen) {\n      return;\n    }\n\n    if (inline && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault();\n      openPopover();\n      return;\n    }\n\n    if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      openPopover({ initialFocus: 'first' });\n      return;\n    }\n\n    if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      openPopover({ initialFocus: 'last' });\n    }\n  };\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (containerRef.current?.contains(target) || panelRef.current?.contains(target)) return;\n\n      closePopover({ restoreFocus: false });\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [closePopover, isOpen]);\n\n  const updatePosition = useCallback(() => {\n    const panel = panelRef.current;\n    const trigger = triggerRef.current;\n    if (!panel || !trigger) return;\n\n    const panelBounds = panel.getBoundingClientRect();\n    const triggerBounds = trigger.getBoundingClientRect();\n    const spaceAbove = triggerBounds.top;\n    const spaceBelow = window.innerHeight - triggerBounds.bottom;\n\n    setOpensAbove(panelBounds.height > spaceBelow && spaceAbove > spaceBelow);\n    setHorizontalPlacement(\n      position === 'auto' &&\n        panelBounds.width > window.innerWidth - triggerBounds.left &&\n        triggerBounds.right > window.innerWidth - triggerBounds.left\n        ? 'left'\n        : preferredHorizontalPlacement\n    );\n  }, [position, preferredHorizontalPlacement]);\n\n  useLayoutEffect(() => {\n    if (!isOpen) return undefined;\n\n    updatePosition();\n    window.addEventListener('resize', updatePosition);\n    window.addEventListener('scroll', updatePosition, true);\n\n    return () => {\n      window.removeEventListener('resize', updatePosition);\n      window.removeEventListener('scroll', updatePosition, true);\n    };\n  }, [isOpen, updatePosition]);\n\n  const handleTriggerClick = (event: React.MouseEvent<HTMLElement>) => {\n    if (inline) event.preventDefault();\n    event.stopPropagation();\n    if (isOpen) {\n      closePopover({ restoreFocus: false });\n    } else {\n      openPopover();\n    }\n  };\n\n  const triggerProps = {\n    'aria-controls': isOpen ? panelId : undefined,\n    'aria-expanded': isOpen,\n    'aria-haspopup': triggerAriaHasPopup,\n    'aria-label': triggerAccessibleLabel,\n    className: inline ? styles['inline-trigger'] : styles.trigger,\n    onClick: handleTriggerClick,\n    onKeyDown: handleTriggerKeyDown,\n  };\n\n  const triggerBounds = inline ? triggerRef.current?.getBoundingClientRect() : undefined;\n  const horizontalTransform = horizontalPlacement === 'left' ? 'translateX(-100%)' : '';\n  const verticalTransform = opensAbove ? 'translateY(calc(-100% - var(--shape-spacing-2xs)))' : '';\n  const inlineTransform = [horizontalTransform, verticalTransform].filter(Boolean).join(' ');\n  const panel = isOpen ? (\n    <div\n      className={cx(\n        styles['popover-panel'],\n        styles[opensAbove ? 'above' : 'below'],\n        inline && styles['inline-panel'],\n        !inline && styles[horizontalPlacement]\n      )}\n      data-horizontal-placement={horizontalPlacement}\n      data-placement={opensAbove ? 'above' : 'below'}\n      id={panelId}\n      ref={panelRef}\n      style={\n        triggerBounds\n          ? {\n              left: horizontalPlacement === 'left' ? triggerBounds.right : triggerBounds.left,\n              position: 'fixed',\n              top: opensAbove ? triggerBounds.top : triggerBounds.bottom,\n              transform: inlineTransform || undefined,\n            }\n          : undefined\n      }\n    >\n      {typeof children === 'function'\n        ? children({ close: closePopover, initialFocus: initialFocusRef.current, isOpen })\n        : children}\n    </div>\n  ) : null;\n\n  return (\n    <div\n      className={cx(styles.popover, inline && styles.inline)}\n      data-open={isOpen}\n      onKeyDown={handleKeyDown}\n      onClick={(event) => {\n        if (inline) event.preventDefault();\n        event.stopPropagation();\n      }}\n      ref={containerRef}\n    >\n      {inline ? (\n        <span\n          {...triggerProps}\n          ref={triggerRef}\n          role='button'\n          tabIndex={0}\n        >\n          {triggerButtonContent}\n        </span>\n      ) : (\n        <Button\n          {...triggerProps}\n          ref={triggerRef as React.Ref<HTMLButtonElement>}\n          variant='secondary'\n        >\n          {triggerButtonContent}\n        </Button>\n      )}\n      {inline && panel && typeof document !== 'undefined'\n        ? createPortal(panel, document.body)\n        : panel}\n    </div>\n  );\n};\n"],"names":["Popover","children","inline","position","triggerAccessibleLabel","triggerAriaHasPopup","triggerButtonContent","containerRef","useRef","initialFocusRef","undefined","panelRef","panelId","useId","triggerRef","isOpen","setIsOpen","useState","opensAbove","setOpensAbove","preferredHorizontalPlacement","horizontalPlacement","setHorizontalPlacement","openPopover","initialFocus","current","closePopover","useCallback","restoreFocus","focus","handleKeyDown","event","key","handleTriggerKeyDown","preventDefault","useEffect","handlePointerDown","target","contains","document","addEventListener","removeEventListener","updatePosition","panel","trigger","panelBounds","getBoundingClientRect","triggerBounds","spaceAbove","top","spaceBelow","window","innerHeight","bottom","height","width","innerWidth","left","right","useLayoutEffect","handleTriggerClick","stopPropagation","triggerProps","className","styles","onClick","onKeyDown","inlineTransform","filter","Boolean","join","jsx","cx","transform","close","jsxs","popover","Button","createPortal","body"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/popover/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  type AriaAttributes,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { Button } from '@/components/button';\n\nimport styles from './styles.module.css';\n\nexport type PopoverCloseOptions = {\n  restoreFocus?: boolean;\n};\n\nexport type PopoverInitialFocus = 'first' | 'last';\n\nexport type PopoverRenderProps = {\n  close: (options?: PopoverCloseOptions) => void;\n  initialFocus?: PopoverInitialFocus;\n  isOpen: boolean;\n};\n\ntype PopoverOpenOptions = {\n  initialFocus?: PopoverInitialFocus;\n};\n\nexport type PopoverProps = {\n  children: ReactNode | ((props: PopoverRenderProps) => ReactNode);\n  inline?: boolean;\n  position?: 'auto' | 'left' | 'right';\n  triggerAccessibleLabel?: string;\n  triggerAriaHasPopup?: AriaAttributes['aria-haspopup'];\n  triggerButtonContent: ReactNode;\n};\n\nexport const Popover = ({\n  children,\n  inline = false,\n  position = 'left',\n  triggerAccessibleLabel,\n  triggerAriaHasPopup,\n  triggerButtonContent,\n}: PopoverProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const initialFocusRef = useRef<PopoverInitialFocus | undefined>(undefined);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const panelId = useId();\n  const triggerRef = useRef<HTMLButtonElement | HTMLSpanElement>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [opensAbove, setOpensAbove] = useState(false);\n  const preferredHorizontalPlacement = position === 'auto' ? 'right' : position;\n  const [horizontalPlacement, setHorizontalPlacement] = useState<'left' | 'right'>(\n    preferredHorizontalPlacement\n  );\n\n  const openPopover = ({ initialFocus }: PopoverOpenOptions = {}) => {\n    initialFocusRef.current = initialFocus;\n    setOpensAbove(false);\n    setHorizontalPlacement(preferredHorizontalPlacement);\n    setIsOpen(true);\n  };\n\n  const closePopover = useCallback(({ restoreFocus = true }: PopoverCloseOptions = {}) => {\n    setIsOpen(false);\n\n    if (restoreFocus) {\n      triggerRef.current?.focus();\n    }\n  }, []);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n    if (isOpen && event.key === 'Escape') {\n      closePopover();\n    }\n  };\n\n  const handleTriggerKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (isOpen) {\n      return;\n    }\n\n    if (inline && (event.key === 'Enter' || event.key === ' ')) {\n      event.preventDefault();\n      openPopover();\n      return;\n    }\n\n    if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      openPopover({ initialFocus: 'first' });\n      return;\n    }\n\n    if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      openPopover({ initialFocus: 'last' });\n    }\n  };\n\n  useEffect(() => {\n    if (!isOpen) {\n      return;\n    }\n\n    const handlePointerDown = (event: MouseEvent) => {\n      const target = event.target as Node;\n      if (containerRef.current?.contains(target) || panelRef.current?.contains(target)) return;\n\n      closePopover({ restoreFocus: false });\n    };\n\n    document.addEventListener('mousedown', handlePointerDown);\n\n    return () => {\n      document.removeEventListener('mousedown', handlePointerDown);\n    };\n  }, [closePopover, isOpen]);\n\n  const updatePosition = useCallback(() => {\n    const panel = panelRef.current;\n    const trigger = triggerRef.current;\n    if (!panel || !trigger) return;\n\n    const panelBounds = panel.getBoundingClientRect();\n    const triggerBounds = trigger.getBoundingClientRect();\n    const spaceAbove = triggerBounds.top;\n    const spaceBelow = window.innerHeight - triggerBounds.bottom;\n\n    setOpensAbove(panelBounds.height > spaceBelow && spaceAbove > spaceBelow);\n    setHorizontalPlacement(\n      position === 'auto' &&\n        panelBounds.width > window.innerWidth - triggerBounds.left &&\n        triggerBounds.right > window.innerWidth - triggerBounds.left\n        ? 'left'\n        : preferredHorizontalPlacement\n    );\n  }, [position, preferredHorizontalPlacement]);\n\n  useLayoutEffect(() => {\n    if (!isOpen) return undefined;\n\n    updatePosition();\n    window.addEventListener('resize', updatePosition);\n    window.addEventListener('scroll', updatePosition, true);\n\n    return () => {\n      window.removeEventListener('resize', updatePosition);\n      window.removeEventListener('scroll', updatePosition, true);\n    };\n  }, [isOpen, updatePosition]);\n\n  const handleTriggerClick = (event: React.MouseEvent<HTMLElement>) => {\n    if (inline) event.preventDefault();\n    event.stopPropagation();\n    if (isOpen) {\n      closePopover({ restoreFocus: false });\n    } else {\n      openPopover();\n    }\n  };\n\n  const triggerProps = {\n    'aria-controls': isOpen ? panelId : undefined,\n    'aria-expanded': isOpen,\n    'aria-haspopup': triggerAriaHasPopup,\n    'aria-label': triggerAccessibleLabel,\n    className: inline ? styles['inline-trigger'] : styles.trigger,\n    onClick: handleTriggerClick,\n    onKeyDown: handleTriggerKeyDown,\n  };\n\n  const triggerBounds = inline ? triggerRef.current?.getBoundingClientRect() : undefined;\n  const horizontalTransform = horizontalPlacement === 'left' ? 'translateX(-100%)' : '';\n  const verticalTransform = opensAbove ? 'translateY(calc(-100% - var(--shape-spacing-2xs)))' : '';\n  const inlineTransform = [horizontalTransform, verticalTransform].filter(Boolean).join(' ');\n  const panel = isOpen ? (\n    <div\n      className={cx(\n        styles['popover-panel'],\n        styles[opensAbove ? 'above' : 'below'],\n        inline && styles['inline-panel'],\n        !inline && styles[horizontalPlacement]\n      )}\n      data-horizontal-placement={horizontalPlacement}\n      data-placement={opensAbove ? 'above' : 'below'}\n      id={panelId}\n      ref={panelRef}\n      style={\n        triggerBounds\n          ? {\n              left: horizontalPlacement === 'left' ? triggerBounds.right : triggerBounds.left,\n              position: 'fixed',\n              top: opensAbove ? triggerBounds.top : triggerBounds.bottom,\n              transform: inlineTransform || undefined,\n            }\n          : undefined\n      }\n    >\n      {typeof children === 'function'\n        ? children({ close: closePopover, initialFocus: initialFocusRef.current, isOpen })\n        : children}\n    </div>\n  ) : null;\n\n  return (\n    <div\n      className={cx(styles.popover, inline && styles.inline)}\n      data-open={isOpen}\n      onKeyDown={handleKeyDown}\n      onClick={(event) => {\n        if (inline) event.preventDefault();\n        event.stopPropagation();\n      }}\n      ref={containerRef}\n    >\n      {inline ? (\n        <span\n          {...triggerProps}\n          ref={triggerRef}\n          role='button'\n          tabIndex={0}\n        >\n          {triggerButtonContent}\n        </span>\n      ) : (\n        <Button\n          {...triggerProps}\n          ref={triggerRef as React.Ref<HTMLButtonElement>}\n          variant='simple'\n        >\n          {triggerButtonContent}\n        </Button>\n      )}\n      {inline && panel && typeof document !== 'undefined'\n        ? createPortal(panel, document.body)\n        : panel}\n    </div>\n  );\n};\n"],"names":["Popover","children","inline","position","triggerAccessibleLabel","triggerAriaHasPopup","triggerButtonContent","containerRef","useRef","initialFocusRef","undefined","panelRef","panelId","useId","triggerRef","isOpen","setIsOpen","useState","opensAbove","setOpensAbove","preferredHorizontalPlacement","horizontalPlacement","setHorizontalPlacement","openPopover","initialFocus","current","closePopover","useCallback","restoreFocus","focus","handleKeyDown","event","key","handleTriggerKeyDown","preventDefault","useEffect","handlePointerDown","target","contains","document","addEventListener","removeEventListener","updatePosition","panel","trigger","panelBounds","getBoundingClientRect","triggerBounds","spaceAbove","top","spaceBelow","window","innerHeight","bottom","height","width","innerWidth","left","right","useLayoutEffect","handleTriggerClick","stopPropagation","triggerProps","className","styles","onClick","onKeyDown","inlineTransform","filter","Boolean","join","jsx","cx","transform","close","jsxs","popover","Button","createPortal","body"],"mappings":"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"}

package/dist/components/popover/index.js

@@ -23,7 +23,7 @@ import '../../assets/index17.css';const G = "_popover_1szho_1", J = "_inline_1sz
   triggerButtonContent: P
 }) => {
   var T;
-  const D = h(null), E = h(void 0), _ = h(null), k = S(), a = h(null), [o, B] = y(!1), [u, R] = y(!1), d = f === "auto" ? "right" : f, [g, x] = y(d), v = ({
+  const D = h(null), E = h(void 0), _ = h(null), k = S(), a = h(null), [o, B] = y(!1), [u, R] = y(!1), d = f === "auto" ? "right" : f, [g, x] = y(d), m = ({
     initialFocus: e
   } = {}) => {
     E.current = e, R(!1), x(d), B(!0);
@@ -37,16 +37,16 @@ import '../../assets/index17.css';const G = "_popover_1szho_1", J = "_inline_1sz
   }, H = (e) => {
     if (!o) {
       if (t && (e.key === "Enter" || e.key === " ")) {
-        e.preventDefault(), v();
+        e.preventDefault(), m();
         return;
       }
       if (e.key === "ArrowDown") {
-        e.preventDefault(), v({
+        e.preventDefault(), m({
           initialFocus: "first"
         });
         return;
       }
-      e.key === "ArrowUp" && (e.preventDefault(), v({
+      e.key === "ArrowUp" && (e.preventDefault(), m({
         initialFocus: "last"
       }));
     }
@@ -55,9 +55,9 @@ import '../../assets/index17.css';const G = "_popover_1szho_1", J = "_inline_1sz
     if (!o)
       return;
     const e = (s) => {
-      var n, m;
+      var n, v;
       const p = s.target;
-      (n = D.current) != null && n.contains(p) || (m = _.current) != null && m.contains(p) || l({
+      (n = D.current) != null && n.contains(p) || (v = _.current) != null && v.contains(p) || l({
         restoreFocus: !1
       });
     };
@@ -68,8 +68,8 @@ import '../../assets/index17.css';const G = "_popover_1szho_1", J = "_inline_1sz
   const i = A(() => {
     const e = _.current, s = a.current;
     if (!e || !s) return;
-    const p = e.getBoundingClientRect(), n = s.getBoundingClientRect(), m = n.top, C = window.innerHeight - n.bottom;
-    R(p.height > C && m > C), x(f === "auto" && p.width > window.innerWidth - n.left && n.right > window.innerWidth - n.left ? "left" : d);
+    const p = e.getBoundingClientRect(), n = s.getBoundingClientRect(), v = n.top, C = window.innerHeight - n.bottom;
+    R(p.height > C && v > C), x(f === "auto" && p.width > window.innerWidth - n.left && n.right > window.innerWidth - n.left ? "left" : d);
   }, [f, d]);
   X(() => {
     if (o)
@@ -80,7 +80,7 @@ import '../../assets/index17.css';const G = "_popover_1szho_1", J = "_inline_1sz
   const N = (e) => {
     t && e.preventDefault(), e.stopPropagation(), o ? l({
       restoreFocus: !1
-    }) : v();
+    }) : m();
   }, L = {
     "aria-controls": o ? k : void 0,
     "aria-expanded": o,
@@ -102,7 +102,7 @@ import '../../assets/index17.css';const G = "_popover_1szho_1", J = "_inline_1sz
   return /* @__PURE__ */ W("div", { className: F(r.popover, t && r.inline), "data-open": o, onKeyDown: j, onClick: (e) => {
     t && e.preventDefault(), e.stopPropagation();
   }, ref: D, "data-component": "popover", children: [
-    t ? /* @__PURE__ */ z("span", { ...L, ref: a, role: "button", tabIndex: 0, children: P }) : /* @__PURE__ */ z(q, { ...L, ref: a, variant: "secondary", children: P }),
+    t ? /* @__PURE__ */ z("span", { ...L, ref: a, role: "button", tabIndex: 0, children: P }) : /* @__PURE__ */ z(q, { ...L, ref: a, variant: "simple", children: P }),
     t && b && typeof document < "u" ? Y(b, document.body) : b
   ] });
 };