@solibo/solibo-ui 2.0.2 → 2.1.0

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 { 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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"}
+{"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      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      /* 🌝 */\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, !autoResize && styles.scrollable, 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'], styles.scrollable, 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","scrollable","minHeight","Dialog","Controls","Header"],"mappings":"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"}

package/dist/components/input/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("../../classix-5H4IWnMA.cjs");require("react");require("../../icons-Dv_p0bUF.cjs");require("../../use-touched-Bq5Gjbpz.cjs");const e=require("../../index-CQlMdqOp.cjs");exports.Input=e.Input;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("../../classix-5H4IWnMA.cjs");require("react");require("../../icons-BTif0nDb.cjs");require("../../use-touched-Bq5Gjbpz.cjs");const e=require("../../index-CeHwRKAg.cjs");exports.Input=e.Input;
 //# sourceMappingURL=index.cjs.map

package/dist/components/input/index.js

@@ -1,9 +1,9 @@
 import "react/jsx-runtime";
 import "../../classix-DG18itHa.js";
 import "react";
-import "../../icons-dUP7sKyt.js";
+import "../../icons-CBbpxsJF.js";
 import "../../use-touched-B999bBr8.js";
-import { I as a } from "../../index-CbJ2-IPc.js";
+import { I as a } from "../../index-DBWgRXp9.js";
 export {
   a as Input
 };

package/dist/components/link/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index49.css');const a=require("react/jsx-runtime"),l=require("../../classix-5H4IWnMA.cjs"),m="_link_fsphh_1",o="_primary_fsphh_19",c="_danger_fsphh_25",_="_minimal_fsphh_33",n={link:m,primary:o,danger:c,minimal:_},p=({children:i,className:r,to:s="#",variant:e="primary",...t})=>a.jsx("a",{className:l.t(r,n.link,n[e]),href:s,...t,"data-component":"link",children:i});exports.Link=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index50.css');const a=require("react/jsx-runtime"),l=require("../../classix-5H4IWnMA.cjs"),m="_link_fsphh_1",o="_primary_fsphh_19",c="_danger_fsphh_25",_="_minimal_fsphh_33",n={link:m,primary:o,danger:c,minimal:_},p=({children:i,className:r,to:s="#",variant:e="primary",...t})=>a.jsx("a",{className:l.t(r,n.link,n[e]),href:s,...t,"data-component":"link",children:i});exports.Link=p;
 //# sourceMappingURL=index.cjs.map

package/dist/components/link/index.js

@@ -1,6 +1,6 @@
 import { jsx as t } from "react/jsx-runtime";
 import { t as o } from "../../classix-DG18itHa.js";
-import '../../assets/index49.css';const p = "_link_fsphh_1", _ = "_primary_fsphh_19", l = "_danger_fsphh_25", e = "_minimal_fsphh_33", n = {
+import '../../assets/index50.css';const p = "_link_fsphh_1", _ = "_primary_fsphh_19", l = "_danger_fsphh_25", e = "_minimal_fsphh_33", n = {
   link: p,
   primary: _,
   danger: l,

package/dist/components/list/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index50.css');const i=require("react/jsx-runtime"),g=require("../../classix-5H4IWnMA.cjs"),n=require("react");function d(t){return n.isValidElement(t)&&t.type===n.Fragment}function E(t,s=[]){return n.Children.forEach(t,e=>{d(e)?E(e.props.children,s):s.push(e)}),s}function x(t,{wrapper:s="li"}={}){return E(t).filter(l=>l!==null).map((l,r)=>{if(n.isValidElement(l)&&l.type===s)return l;const c=n.isValidElement(l)&&l.key!=null?l.key:r;return n.createElement(s,{key:c},l)})}const z="_controls_1i7ll_1",F="_horizontal_1i7ll_6",V="_list_1i7ll_17",b="_columns_1i7ll_57",k="_compact_1i7ll_74",o={controls:z,horizontal:F,list:V,columns:b,compact:k},j=(t,s)=>{typeof t=="function"?t(s):t&&(t.current=s)};function q({children:t,className:s,columns:e=1,compact:u=!1,controls:l,horizontal:r,ordered:c,ref:m,style:N,...f}){const _=Number.isFinite(e)?Math.max(1,Math.floor(e)):1,y=g.t(s,o.list,_>1&&o.columns,r&&o.horizontal,u&&o.compact),p={...N,"--list-columns":_},h=c?i.jsx("ol",{className:y,ref:a=>j(m,a),style:p,...f,children:x(t)}):i.jsx("ul",{className:y,ref:a=>j(m,a),style:p,...f,children:x(t)});return l==null?h:i.jsxs(i.Fragment,{children:[i.jsx("div",{className:o.controls,children:l}),h]})}exports.List=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index51.css');const a=require("react/jsx-runtime"),q=require("../../classix-5H4IWnMA.cjs"),l=require("react");function H(t){return l.isValidElement(t)&&t.type===l.Fragment}function O(t,s=[]){return l.Children.forEach(t,i=>{H(i)?O(i.props.children,s):s.push(i)}),s}function F(t,{wrapper:s="li"}={}){return O(t).filter(n=>n!==null).map((n,u)=>{if(l.isValidElement(n)&&n.type===s)return n;const f=l.isValidElement(n)&&n.key!=null?n.key:u;return l.createElement(s,{key:f},n)})}const T="_controls_bp7if_3",V="_horizontal_bp7if_8",A="_list_bp7if_19",I="_columns_bp7if_59",D="_masonry_bp7if_69",P="_scrollable_bp7if_79",$="_overflowing_bp7if_86",G="_compact_bp7if_111",r={controls:T,horizontal:V,list:A,columns:I,masonry:D,scrollable:P,overflowing:$,compact:G},M=(t,s)=>{typeof t=="function"?t(s):t&&(t.current=s)};function J({children:t,className:s,columns:i=1,compact:p=!1,controls:n,horizontal:u,layout:f="grid",maxVisibleItems:m,ordered:z,ref:y,style:B,...b}){const _=Number.isFinite(i)?Math.max(1,Math.floor(i)):1,v=l.useRef(null),[c,S]=l.useState(),o=f==="grid"&&_===1&&!u&&m!=null&&Number.isFinite(m)&&m>=1?Math.floor(m):void 0,h=!!o&&c!=null;l.useLayoutEffect(()=>{const e=v.current;if(!e||!o)return;const R=()=>{const g=Array.from(e.children).filter(j=>j instanceof HTMLElement&&getComputedStyle(j).display!=="none"),N=g[o-1],k=g.length>o&&N?N.getBoundingClientRect().bottom-e.getBoundingClientRect().top+e.scrollTop+(parseFloat(getComputedStyle(e).paddingBottom)||0):void 0;S(k)},d=new ResizeObserver(R),C=()=>{d.disconnect(),d.observe(e),Array.from(e.children).forEach(g=>d.observe(g)),R()},L=new MutationObserver(C);return L.observe(e,{childList:!0,subtree:!0,characterData:!0}),C(),()=>{d.disconnect(),L.disconnect()}},[t,o,h]);const x=q.t(s,r.list,f==="masonry"?r.masonry:_>1&&r.columns,!!o&&r.scrollable,h&&r.overflowing,u&&r.horizontal,p&&r.compact),E={...B,"--list-columns":_,"--list-max-height":o&&c!=null?`${c}px`:void 0},w=z?a.jsx("ol",{className:x,ref:e=>{v.current=e,M(y,e)},style:E,...b,tabIndex:b.tabIndex??(o&&c!=null?0:void 0),children:F(t)}):a.jsx("ul",{className:x,ref:e=>{v.current=e,M(y,e)},style:E,...b,tabIndex:b.tabIndex??(o&&c!=null?0:void 0),children:F(t)});return n==null?w:a.jsxs(a.Fragment,{children:[a.jsx("div",{className:r.controls,children:n}),w]})}exports.List=J;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/utils/wrap-children.tsx","../../../src/components/list/index.tsx"],"sourcesContent":["import React, { JSX } from 'react';\n\ntype WrapOptions<T extends keyof JSX.IntrinsicElements = 'li'> = {\n  wrapper?: T;\n};\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }> {\n  return React.isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction flattenChildren(children: React.ReactNode, out: React.ReactNode[] = []) {\n  React.Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      flattenChildren(child.props.children, out);\n    } else {\n      out.push(child);\n    }\n  });\n  return out;\n}\n\nexport function wrapChildren<T extends keyof JSX.IntrinsicElements = 'li'>(\n  children: React.ReactNode,\n  { wrapper = 'li' as T }: WrapOptions<T> = {}\n) {\n  const flat = flattenChildren(children);\n\n  const filterNull = flat.filter((child) => child !== null);\n\n  return filterNull.map((child, i) => {\n    if (React.isValidElement(child) && child.type === wrapper) {\n      return child;\n    }\n\n    const key = React.isValidElement(child) && child.key != null ? child.key : i;\n\n    return React.createElement(wrapper, { key }, child);\n  });\n}\n","import cx from 'classix';\n\nimport { wrapChildren } from '@/utils/wrap-children';\n\nimport styles from './styles.module.css';\n\ntype ListElement = HTMLUListElement | HTMLOListElement;\n\nconst setListRef = (ref: React.Ref<ListElement> | undefined, node: ListElement | null) => {\n  if (typeof ref === 'function') ref(node);\n  else if (ref) ref.current = node;\n};\n\nexport type ListProps = React.ComponentPropsWithoutRef<'ul'> & {\n  columns?: number;\n  compact?: boolean;\n  controls?: React.ReactNode;\n  horizontal?: boolean;\n  ordered?: boolean;\n  ref?: React.Ref<ListElement>;\n};\n\nexport function List({\n  children,\n  className,\n  columns = 1,\n  compact = false,\n  controls,\n  horizontal,\n  ordered,\n  ref,\n  style,\n  ...props\n}: ListProps) {\n  const cols = Number.isFinite(columns) ? Math.max(1, Math.floor(columns)) : 1;\n\n  const classes = cx(\n    className,\n    styles.list,\n    cols > 1 && styles.columns,\n    horizontal && styles.horizontal,\n    compact && styles.compact\n  );\n\n  type withVars = React.CSSProperties & {\n    '--list-columns'?: number;\n  };\n\n  const withVars: withVars = {\n    ...style,\n    '--list-columns': cols,\n  };\n\n  const list = ordered ? (\n    <ol\n      className={classes}\n      ref={(node) => setListRef(ref, node)}\n      style={withVars}\n      {...props}\n    >\n      {wrapChildren(children)}\n    </ol>\n  ) : (\n    <ul\n      className={classes}\n      ref={(node) => setListRef(ref, node)}\n      style={withVars}\n      {...props}\n    >\n      {wrapChildren(children)}\n    </ul>\n  );\n\n  if (controls === undefined || controls === null) return list;\n\n  return (\n    <>\n      <div className={styles.controls}>{controls}</div>\n      {list}\n    </>\n  );\n}\n"],"names":["isFragmentElement","node","React","isValidElement","type","Fragment","flattenChildren","children","out","Children","forEach","child","props","push","wrapChildren","wrapper","filter","map","i","key","createElement","setListRef","ref","current","List","className","columns","compact","controls","horizontal","ordered","style","cols","Number","isFinite","Math","max","floor","classes","cx","styles","list","withVars","jsx","jsxs"],"mappings":"gLAMA,SAASA,EACPC,EAC4D,CAC5D,OAAOC,EAAMC,eAAeF,CAAI,GAAKA,EAAKG,OAASF,EAAMG,QAC3D,CAEA,SAASC,EAAgBC,EAA2BC,EAAyB,GAAI,CAC/EN,OAAAA,EAAMO,SAASC,QAAQH,EAAWI,GAAU,CACtCX,EAAkBW,CAAK,EACzBL,EAAgBK,EAAMC,MAAML,SAAUC,CAAG,EAEzCA,EAAIK,KAAKF,CAAK,CAElB,CAAC,EACMH,CACT,CAEO,SAASM,EACdP,EACA,CAAEQ,QAAAA,EAAU,IAA0B,EAAI,GAC1C,CAKA,OAJaT,EAAgBC,CAAQ,EAEbS,OAAQL,GAAUA,IAAU,IAAI,EAEtCM,IAAI,CAACN,EAAOO,IAAM,CAClC,GAAIhB,EAAMC,eAAeQ,CAAK,GAAKA,EAAMP,OAASW,EAChD,OAAOJ,EAGT,MAAMQ,EAAMjB,EAAMC,eAAeQ,CAAK,GAAKA,EAAMQ,KAAO,KAAOR,EAAMQ,IAAMD,EAE3E,OAAOhB,EAAMkB,cAAcL,EAAS,CAAEI,IAAAA,CAAAA,EAAOR,CAAK,CACpD,CAAC,CACH,2KChCMU,EAAaA,CAACC,EAAyCrB,IAA6B,CACpF,OAAOqB,GAAQ,WAAYA,EAAIrB,CAAI,EAC9BqB,MAASC,QAAUtB,EAC9B,EAWO,SAASuB,EAAK,CACnBjB,SAAAA,EACAkB,UAAAA,EACAC,QAAAA,EAAU,EACVC,QAAAA,EAAU,GACVC,SAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAR,IAAAA,EACAS,MAAAA,EACA,GAAGnB,CACM,EAAG,CACZ,MAAMoB,EAAOC,OAAOC,SAASR,CAAO,EAAIS,KAAKC,IAAI,EAAGD,KAAKE,MAAMX,CAAO,CAAC,EAAI,EAErEY,EAAUC,EAAAA,EACdd,EACAe,EAAOC,KACPT,EAAO,GAAKQ,EAAOd,QACnBG,GAAcW,EAAOX,WACrBF,GAAWa,EAAOb,OACpB,EAMMe,EAAqB,CACzB,GAAGX,EACH,iBAAkBC,CAAAA,EAGdS,EAAOX,EACXa,MAAC,KAAA,CACC,UAAWL,EACX,IAAMrC,GAASoB,EAAWC,EAAKrB,CAAI,EACnC,MAAOyC,EACP,GAAI9B,EAEHE,SAAAA,EAAaP,CAAQ,CAAA,CACxB,QAEC,KAAA,CACC,UAAW+B,EACX,OAAejB,EAAWC,EAAKrB,CAAI,EACnC,MAAOyC,EACP,GAAI9B,EAEHE,SAAAA,EAAaP,CAAQ,EACxB,EAGF,OAA8BqB,GAAa,KAAaa,EAGtDG,EAAAA,KAAAvC,WAAA,CACE,SAAA,CAAAsC,EAAAA,IAAC,MAAA,CAAI,UAAWH,EAAOZ,SAAWA,SAAAA,EAAS,EAC1Ca,CAAAA,EACH,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/utils/wrap-children.tsx","../../../src/components/list/index.tsx"],"sourcesContent":["import React, { JSX } from 'react';\n\ntype WrapOptions<T extends keyof JSX.IntrinsicElements = 'li'> = {\n  wrapper?: T;\n};\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }> {\n  return React.isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction flattenChildren(children: React.ReactNode, out: React.ReactNode[] = []) {\n  React.Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      flattenChildren(child.props.children, out);\n    } else {\n      out.push(child);\n    }\n  });\n  return out;\n}\n\nexport function wrapChildren<T extends keyof JSX.IntrinsicElements = 'li'>(\n  children: React.ReactNode,\n  { wrapper = 'li' as T }: WrapOptions<T> = {}\n) {\n  const flat = flattenChildren(children);\n\n  const filterNull = flat.filter((child) => child !== null);\n\n  return filterNull.map((child, i) => {\n    if (React.isValidElement(child) && child.type === wrapper) {\n      return child;\n    }\n\n    const key = React.isValidElement(child) && child.key != null ? child.key : i;\n\n    return React.createElement(wrapper, { key }, child);\n  });\n}\n","import cx from 'classix';\nimport { useLayoutEffect, useRef, useState } from 'react';\n\nimport { wrapChildren } from '@/utils/wrap-children';\n\nimport styles from './styles.module.css';\n\ntype ListElement = HTMLUListElement | HTMLOListElement;\n\nconst setListRef = (ref: React.Ref<ListElement> | undefined, node: ListElement | null) => {\n  if (typeof ref === 'function') ref(node);\n  else if (ref) ref.current = node;\n};\n\nexport type ListProps = React.ComponentPropsWithoutRef<'ul'> & {\n  columns?: number;\n  compact?: boolean;\n  controls?: React.ReactNode;\n  horizontal?: boolean;\n  layout?: 'grid' | 'masonry';\n  maxVisibleItems?: number;\n  ordered?: boolean;\n  ref?: React.Ref<ListElement>;\n};\n\nexport function List({\n  children,\n  className,\n  columns = 1,\n  compact = false,\n  controls,\n  horizontal,\n  layout = 'grid',\n  maxVisibleItems,\n  ordered,\n  ref,\n  style,\n  ...props\n}: ListProps) {\n  const cols = Number.isFinite(columns) ? Math.max(1, Math.floor(columns)) : 1;\n\n  const listRef = useRef<ListElement | null>(null);\n  const [visibleHeight, setVisibleHeight] = useState<number>();\n  const itemLimit =\n    layout === 'grid' &&\n    cols === 1 &&\n    !horizontal &&\n    maxVisibleItems != null &&\n    Number.isFinite(maxVisibleItems) &&\n    maxVisibleItems >= 1\n      ? Math.floor(maxVisibleItems)\n      : undefined;\n  const isOverflowing = Boolean(itemLimit) && visibleHeight != null;\n\n  useLayoutEffect(() => {\n    const node = listRef.current;\n    if (!node || !itemLimit) return;\n\n    const measure = () => {\n      const items = Array.from(node.children).filter(\n        (item): item is HTMLElement =>\n          item instanceof HTMLElement && getComputedStyle(item).display !== 'none'\n      );\n      const lastVisible = items[itemLimit - 1];\n      const height =\n        items.length > itemLimit && lastVisible\n          ? lastVisible.getBoundingClientRect().bottom -\n            node.getBoundingClientRect().top +\n            node.scrollTop +\n            (parseFloat(getComputedStyle(node).paddingBottom) || 0)\n          : undefined;\n      setVisibleHeight(height);\n    };\n    const resizeObserver = new ResizeObserver(measure);\n    const observeItems = () => {\n      resizeObserver.disconnect();\n      resizeObserver.observe(node);\n      Array.from(node.children).forEach((item) => resizeObserver.observe(item));\n      measure();\n    };\n    const mutationObserver = new MutationObserver(observeItems);\n    mutationObserver.observe(node, { childList: true, subtree: true, characterData: true });\n    observeItems();\n    return () => {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n    };\n  }, [children, itemLimit, isOverflowing]);\n\n  const classes = cx(\n    className,\n    styles.list,\n    layout === 'masonry' ? styles.masonry : cols > 1 && styles.columns,\n    Boolean(itemLimit) && styles.scrollable,\n    isOverflowing && styles.overflowing,\n    horizontal && styles.horizontal,\n    compact && styles.compact\n  );\n\n  type withVars = React.CSSProperties & {\n    '--list-columns'?: number;\n    '--list-max-height'?: string;\n  };\n\n  const withVars: withVars = {\n    ...style,\n    '--list-columns': cols,\n    '--list-max-height': itemLimit && visibleHeight != null ? `${visibleHeight}px` : undefined,\n  };\n\n  const list = ordered ? (\n    <ol\n      className={classes}\n      ref={(node) => {\n        listRef.current = node;\n        setListRef(ref, node);\n      }}\n      style={withVars}\n      {...props}\n      tabIndex={props.tabIndex ?? (itemLimit && visibleHeight != null ? 0 : undefined)}\n    >\n      {wrapChildren(children)}\n    </ol>\n  ) : (\n    <ul\n      className={classes}\n      ref={(node) => {\n        listRef.current = node;\n        setListRef(ref, node);\n      }}\n      style={withVars}\n      {...props}\n      tabIndex={props.tabIndex ?? (itemLimit && visibleHeight != null ? 0 : undefined)}\n    >\n      {wrapChildren(children)}\n    </ul>\n  );\n\n  if (controls === undefined || controls === null) return list;\n\n  return (\n    <>\n      <div className={styles.controls}>{controls}</div>\n      {list}\n    </>\n  );\n}\n"],"names":["isFragmentElement","node","React","isValidElement","type","Fragment","flattenChildren","children","out","Children","forEach","child","props","push","wrapChildren","wrapper","filter","map","i","key","createElement","setListRef","ref","current","List","className","columns","compact","controls","horizontal","layout","maxVisibleItems","ordered","style","cols","Number","isFinite","Math","max","floor","listRef","useRef","visibleHeight","setVisibleHeight","useState","itemLimit","undefined","isOverflowing","Boolean","useLayoutEffect","measure","items","Array","from","item","HTMLElement","getComputedStyle","display","lastVisible","height","length","getBoundingClientRect","bottom","top","scrollTop","parseFloat","paddingBottom","resizeObserver","ResizeObserver","observeItems","disconnect","observe","mutationObserver","MutationObserver","childList","subtree","characterData","classes","cx","styles","list","masonry","scrollable","overflowing","withVars","jsx","tabIndex","jsxs"],"mappings":"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"}

package/dist/components/list/index.js

@@ -1,57 +1,85 @@
-import { jsx as a, jsxs as F, Fragment as V } from "react/jsx-runtime";
-import { t as g } from "../../classix-DG18itHa.js";
-import e from "react";
-import '../../assets/index50.css';function k(t) {
-  return e.isValidElement(t) && t.type === e.Fragment;
+import { jsx as g, jsxs as V, Fragment as j } from "react/jsx-runtime";
+import { t as A } from "../../classix-DG18itHa.js";
+import i, { useRef as I, useState as T, useLayoutEffect as D } from "react";
+import '../../assets/index51.css';function $(t) {
+  return i.isValidElement(t) && t.type === i.Fragment;
 }
-function x(t, n = []) {
-  return e.Children.forEach(t, (s) => {
-    k(s) ? x(s.props.children, n) : n.push(s);
-  }), n;
+function M(t, o = []) {
+  return i.Children.forEach(t, (r) => {
+    $(r) ? M(r.props.children, o) : o.push(r);
+  }), o;
 }
-function E(t, {
-  wrapper: n = "li"
+function z(t, {
+  wrapper: o = "li"
 } = {}) {
-  return x(t).filter((l) => l !== null).map((l, i) => {
-    if (e.isValidElement(l) && l.type === n)
-      return l;
-    const r = e.isValidElement(l) && l.key != null ? l.key : i;
-    return e.createElement(n, {
-      key: r
-    }, l);
+  return M(t).filter((n) => n !== null).map((n, a) => {
+    if (i.isValidElement(n) && n.type === o)
+      return n;
+    const u = i.isValidElement(n) && n.key != null ? n.key : a;
+    return i.createElement(o, {
+      key: u
+    }, n);
   });
 }
-const C = "_controls_1i7ll_1", d = "_horizontal_1i7ll_6", j = "_list_1i7ll_17", v = "_columns_1i7ll_57", L = "_compact_1i7ll_74", o = {
-  controls: C,
-  horizontal: d,
-  list: j,
-  columns: v,
-  compact: L
-}, N = (t, n) => {
-  typeof t == "function" ? t(n) : t && (t.current = n);
+const q = "_controls_bp7if_3", G = "_horizontal_bp7if_8", J = "_list_bp7if_19", K = "_columns_bp7if_59", P = "_masonry_bp7if_69", Q = "_scrollable_bp7if_79", U = "_overflowing_bp7if_86", W = "_compact_bp7if_111", l = {
+  controls: q,
+  horizontal: G,
+  list: J,
+  columns: K,
+  masonry: P,
+  scrollable: Q,
+  overflowing: U,
+  compact: W
+}, B = (t, o) => {
+  typeof t == "function" ? t(o) : t && (t.current = o);
 };
-function w({
+function tt({
   children: t,
-  className: n,
-  columns: s = 1,
-  compact: m = !1,
-  controls: l,
-  horizontal: i,
-  ordered: r,
-  ref: u,
-  style: z,
-  ...f
+  className: o,
+  columns: r = 1,
+  compact: v = !1,
+  controls: n,
+  horizontal: a,
+  layout: u = "grid",
+  maxVisibleItems: f,
+  ordered: O,
+  ref: h,
+  style: k,
+  ...m
 }) {
-  const _ = Number.isFinite(s) ? Math.max(1, Math.floor(s)) : 1, p = g(n, o.list, _ > 1 && o.columns, i && o.horizontal, m && o.compact), y = {
-    ...z,
-    "--list-columns": _
-  }, h = r ? /* @__PURE__ */ a("ol", { className: p, ref: (c) => N(u, c), style: y, ...f, children: E(t) }) : /* @__PURE__ */ a("ul", { className: p, ref: (c) => N(u, c), style: y, ...f, children: E(t) });
-  return l == null ? h : /* @__PURE__ */ F(V, { children: [
-    /* @__PURE__ */ a("div", { className: o.controls, children: l }),
-    h
+  const p = Number.isFinite(r) ? Math.max(1, Math.floor(r)) : 1, _ = I(null), [c, H] = T(), s = u === "grid" && p === 1 && !a && f != null && Number.isFinite(f) && f >= 1 ? Math.floor(f) : void 0, y = !!s && c != null;
+  D(() => {
+    const e = _.current;
+    if (!e || !s) return;
+    const C = () => {
+      const d = Array.from(e.children).filter((L) => L instanceof HTMLElement && getComputedStyle(L).display !== "none"), F = d[s - 1], S = d.length > s && F ? F.getBoundingClientRect().bottom - e.getBoundingClientRect().top + e.scrollTop + (parseFloat(getComputedStyle(e).paddingBottom) || 0) : void 0;
+      H(S);
+    }, b = new ResizeObserver(C), N = () => {
+      b.disconnect(), b.observe(e), Array.from(e.children).forEach((d) => b.observe(d)), C();
+    }, R = new MutationObserver(N);
+    return R.observe(e, {
+      childList: !0,
+      subtree: !0,
+      characterData: !0
+    }), N(), () => {
+      b.disconnect(), R.disconnect();
+    };
+  }, [t, s, y]);
+  const E = A(o, l.list, u === "masonry" ? l.masonry : p > 1 && l.columns, !!s && l.scrollable, y && l.overflowing, a && l.horizontal, v && l.compact), w = {
+    ...k,
+    "--list-columns": p,
+    "--list-max-height": s && c != null ? `${c}px` : void 0
+  }, x = O ? /* @__PURE__ */ g("ol", { className: E, ref: (e) => {
+    _.current = e, B(h, e);
+  }, style: w, ...m, tabIndex: m.tabIndex ?? (s && c != null ? 0 : void 0), children: z(t) }) : /* @__PURE__ */ g("ul", { className: E, ref: (e) => {
+    _.current = e, B(h, e);
+  }, style: w, ...m, tabIndex: m.tabIndex ?? (s && c != null ? 0 : void 0), children: z(t) });
+  return n == null ? x : /* @__PURE__ */ V(j, { children: [
+    /* @__PURE__ */ g("div", { className: l.controls, children: n }),
+    x
   ] });
 }
 export {
-  w as List
+  tt as List
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/utils/wrap-children.tsx","../../../src/components/list/index.tsx"],"sourcesContent":["import React, { JSX } from 'react';\n\ntype WrapOptions<T extends keyof JSX.IntrinsicElements = 'li'> = {\n  wrapper?: T;\n};\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }> {\n  return React.isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction flattenChildren(children: React.ReactNode, out: React.ReactNode[] = []) {\n  React.Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      flattenChildren(child.props.children, out);\n    } else {\n      out.push(child);\n    }\n  });\n  return out;\n}\n\nexport function wrapChildren<T extends keyof JSX.IntrinsicElements = 'li'>(\n  children: React.ReactNode,\n  { wrapper = 'li' as T }: WrapOptions<T> = {}\n) {\n  const flat = flattenChildren(children);\n\n  const filterNull = flat.filter((child) => child !== null);\n\n  return filterNull.map((child, i) => {\n    if (React.isValidElement(child) && child.type === wrapper) {\n      return child;\n    }\n\n    const key = React.isValidElement(child) && child.key != null ? child.key : i;\n\n    return React.createElement(wrapper, { key }, child);\n  });\n}\n","import cx from 'classix';\n\nimport { wrapChildren } from '@/utils/wrap-children';\n\nimport styles from './styles.module.css';\n\ntype ListElement = HTMLUListElement | HTMLOListElement;\n\nconst setListRef = (ref: React.Ref<ListElement> | undefined, node: ListElement | null) => {\n  if (typeof ref === 'function') ref(node);\n  else if (ref) ref.current = node;\n};\n\nexport type ListProps = React.ComponentPropsWithoutRef<'ul'> & {\n  columns?: number;\n  compact?: boolean;\n  controls?: React.ReactNode;\n  horizontal?: boolean;\n  ordered?: boolean;\n  ref?: React.Ref<ListElement>;\n};\n\nexport function List({\n  children,\n  className,\n  columns = 1,\n  compact = false,\n  controls,\n  horizontal,\n  ordered,\n  ref,\n  style,\n  ...props\n}: ListProps) {\n  const cols = Number.isFinite(columns) ? Math.max(1, Math.floor(columns)) : 1;\n\n  const classes = cx(\n    className,\n    styles.list,\n    cols > 1 && styles.columns,\n    horizontal && styles.horizontal,\n    compact && styles.compact\n  );\n\n  type withVars = React.CSSProperties & {\n    '--list-columns'?: number;\n  };\n\n  const withVars: withVars = {\n    ...style,\n    '--list-columns': cols,\n  };\n\n  const list = ordered ? (\n    <ol\n      className={classes}\n      ref={(node) => setListRef(ref, node)}\n      style={withVars}\n      {...props}\n    >\n      {wrapChildren(children)}\n    </ol>\n  ) : (\n    <ul\n      className={classes}\n      ref={(node) => setListRef(ref, node)}\n      style={withVars}\n      {...props}\n    >\n      {wrapChildren(children)}\n    </ul>\n  );\n\n  if (controls === undefined || controls === null) return list;\n\n  return (\n    <>\n      <div className={styles.controls}>{controls}</div>\n      {list}\n    </>\n  );\n}\n"],"names":["isFragmentElement","node","React","isValidElement","type","Fragment","flattenChildren","children","out","Children","forEach","child","props","push","wrapChildren","wrapper","filter","map","i","key","createElement","setListRef","ref","current","List","className","columns","compact","controls","horizontal","ordered","style","cols","Number","isFinite","Math","max","floor","classes","cx","styles","list","withVars","jsx","jsxs"],"mappings":";;;AAMA,SAASA,EACPC,GAC4D;AAC5D,SAAOC,EAAMC,eAAeF,CAAI,KAAKA,EAAKG,SAASF,EAAMG;AAC3D;AAEA,SAASC,EAAgBC,GAA2BC,IAAyB,IAAI;AAC/EN,SAAAA,EAAMO,SAASC,QAAQH,GAAWI,CAAAA,MAAU;AAC1C,IAAIX,EAAkBW,CAAK,IACzBL,EAAgBK,EAAMC,MAAML,UAAUC,CAAG,IAEzCA,EAAIK,KAAKF,CAAK;AAAA,EAElB,CAAC,GACMH;AACT;AAEO,SAASM,EACdP,GACA;AAAA,EAAEQ,SAAAA,IAAU;AAA0B,IAAI,IAC1C;AAKA,SAJaT,EAAgBC,CAAQ,EAEbS,OAAQL,CAAAA,MAAUA,MAAU,IAAI,EAEtCM,IAAI,CAACN,GAAOO,MAAM;AAClC,QAAIhB,EAAMC,eAAeQ,CAAK,KAAKA,EAAMP,SAASW;AAChD,aAAOJ;AAGT,UAAMQ,IAAMjB,EAAMC,eAAeQ,CAAK,KAAKA,EAAMQ,OAAO,OAAOR,EAAMQ,MAAMD;AAE3E,WAAOhB,EAAMkB,cAAcL,GAAS;AAAA,MAAEI,KAAAA;AAAAA,IAAAA,GAAOR,CAAK;AAAA,EACpD,CAAC;AACH;;;;;;;GChCMU,IAAaA,CAACC,GAAyCrB,MAA6B;AACxF,EAAI,OAAOqB,KAAQ,aAAYA,EAAIrB,CAAI,IAC9BqB,QAASC,UAAUtB;AAC9B;AAWO,SAASuB,EAAK;AAAA,EACnBjB,UAAAA;AAAAA,EACAkB,WAAAA;AAAAA,EACAC,SAAAA,IAAU;AAAA,EACVC,SAAAA,IAAU;AAAA,EACVC,UAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAR,KAAAA;AAAAA,EACAS,OAAAA;AAAAA,EACA,GAAGnB;AACM,GAAG;AACZ,QAAMoB,IAAOC,OAAOC,SAASR,CAAO,IAAIS,KAAKC,IAAI,GAAGD,KAAKE,MAAMX,CAAO,CAAC,IAAI,GAErEY,IAAUC,EACdd,GACAe,EAAOC,MACPT,IAAO,KAAKQ,EAAOd,SACnBG,KAAcW,EAAOX,YACrBF,KAAWa,EAAOb,OACpB,GAMMe,IAAqB;AAAA,IACzB,GAAGX;AAAAA,IACH,kBAAkBC;AAAAA,EAAAA,GAGdS,IAAOX,IACX,gBAAAa,EAAC,MAAA,EACC,WAAWL,GACX,KAAMrC,CAAAA,MAASoB,EAAWC,GAAKrB,CAAI,GACnC,OAAOyC,GACP,GAAI9B,GAEHE,UAAAA,EAAaP,CAAQ,EAAA,CACxB,sBAEC,MAAA,EACC,WAAW+B,GACX,KAAMrC,OAASoB,EAAWC,GAAKrB,CAAI,GACnC,OAAOyC,GACP,GAAI9B,GAEHE,UAAAA,EAAaP,CAAQ,GACxB;AAGF,SAA8BqB,KAAa,OAAaa,IAGtD,gBAAAG,EAAAvC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAsC,EAAC,OAAA,EAAI,WAAWH,EAAOZ,UAAWA,UAAAA,GAAS;AAAA,IAC1Ca;AAAAA,EAAAA,GACH;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../../src/utils/wrap-children.tsx","../../../src/components/list/index.tsx"],"sourcesContent":["import React, { JSX } from 'react';\n\ntype WrapOptions<T extends keyof JSX.IntrinsicElements = 'li'> = {\n  wrapper?: T;\n};\n\nfunction isFragmentElement(\n  node: React.ReactNode\n): node is React.ReactElement<{ children?: React.ReactNode }> {\n  return React.isValidElement(node) && node.type === React.Fragment;\n}\n\nfunction flattenChildren(children: React.ReactNode, out: React.ReactNode[] = []) {\n  React.Children.forEach(children, (child) => {\n    if (isFragmentElement(child)) {\n      flattenChildren(child.props.children, out);\n    } else {\n      out.push(child);\n    }\n  });\n  return out;\n}\n\nexport function wrapChildren<T extends keyof JSX.IntrinsicElements = 'li'>(\n  children: React.ReactNode,\n  { wrapper = 'li' as T }: WrapOptions<T> = {}\n) {\n  const flat = flattenChildren(children);\n\n  const filterNull = flat.filter((child) => child !== null);\n\n  return filterNull.map((child, i) => {\n    if (React.isValidElement(child) && child.type === wrapper) {\n      return child;\n    }\n\n    const key = React.isValidElement(child) && child.key != null ? child.key : i;\n\n    return React.createElement(wrapper, { key }, child);\n  });\n}\n","import cx from 'classix';\nimport { useLayoutEffect, useRef, useState } from 'react';\n\nimport { wrapChildren } from '@/utils/wrap-children';\n\nimport styles from './styles.module.css';\n\ntype ListElement = HTMLUListElement | HTMLOListElement;\n\nconst setListRef = (ref: React.Ref<ListElement> | undefined, node: ListElement | null) => {\n  if (typeof ref === 'function') ref(node);\n  else if (ref) ref.current = node;\n};\n\nexport type ListProps = React.ComponentPropsWithoutRef<'ul'> & {\n  columns?: number;\n  compact?: boolean;\n  controls?: React.ReactNode;\n  horizontal?: boolean;\n  layout?: 'grid' | 'masonry';\n  maxVisibleItems?: number;\n  ordered?: boolean;\n  ref?: React.Ref<ListElement>;\n};\n\nexport function List({\n  children,\n  className,\n  columns = 1,\n  compact = false,\n  controls,\n  horizontal,\n  layout = 'grid',\n  maxVisibleItems,\n  ordered,\n  ref,\n  style,\n  ...props\n}: ListProps) {\n  const cols = Number.isFinite(columns) ? Math.max(1, Math.floor(columns)) : 1;\n\n  const listRef = useRef<ListElement | null>(null);\n  const [visibleHeight, setVisibleHeight] = useState<number>();\n  const itemLimit =\n    layout === 'grid' &&\n    cols === 1 &&\n    !horizontal &&\n    maxVisibleItems != null &&\n    Number.isFinite(maxVisibleItems) &&\n    maxVisibleItems >= 1\n      ? Math.floor(maxVisibleItems)\n      : undefined;\n  const isOverflowing = Boolean(itemLimit) && visibleHeight != null;\n\n  useLayoutEffect(() => {\n    const node = listRef.current;\n    if (!node || !itemLimit) return;\n\n    const measure = () => {\n      const items = Array.from(node.children).filter(\n        (item): item is HTMLElement =>\n          item instanceof HTMLElement && getComputedStyle(item).display !== 'none'\n      );\n      const lastVisible = items[itemLimit - 1];\n      const height =\n        items.length > itemLimit && lastVisible\n          ? lastVisible.getBoundingClientRect().bottom -\n            node.getBoundingClientRect().top +\n            node.scrollTop +\n            (parseFloat(getComputedStyle(node).paddingBottom) || 0)\n          : undefined;\n      setVisibleHeight(height);\n    };\n    const resizeObserver = new ResizeObserver(measure);\n    const observeItems = () => {\n      resizeObserver.disconnect();\n      resizeObserver.observe(node);\n      Array.from(node.children).forEach((item) => resizeObserver.observe(item));\n      measure();\n    };\n    const mutationObserver = new MutationObserver(observeItems);\n    mutationObserver.observe(node, { childList: true, subtree: true, characterData: true });\n    observeItems();\n    return () => {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n    };\n  }, [children, itemLimit, isOverflowing]);\n\n  const classes = cx(\n    className,\n    styles.list,\n    layout === 'masonry' ? styles.masonry : cols > 1 && styles.columns,\n    Boolean(itemLimit) && styles.scrollable,\n    isOverflowing && styles.overflowing,\n    horizontal && styles.horizontal,\n    compact && styles.compact\n  );\n\n  type withVars = React.CSSProperties & {\n    '--list-columns'?: number;\n    '--list-max-height'?: string;\n  };\n\n  const withVars: withVars = {\n    ...style,\n    '--list-columns': cols,\n    '--list-max-height': itemLimit && visibleHeight != null ? `${visibleHeight}px` : undefined,\n  };\n\n  const list = ordered ? (\n    <ol\n      className={classes}\n      ref={(node) => {\n        listRef.current = node;\n        setListRef(ref, node);\n      }}\n      style={withVars}\n      {...props}\n      tabIndex={props.tabIndex ?? (itemLimit && visibleHeight != null ? 0 : undefined)}\n    >\n      {wrapChildren(children)}\n    </ol>\n  ) : (\n    <ul\n      className={classes}\n      ref={(node) => {\n        listRef.current = node;\n        setListRef(ref, node);\n      }}\n      style={withVars}\n      {...props}\n      tabIndex={props.tabIndex ?? (itemLimit && visibleHeight != null ? 0 : undefined)}\n    >\n      {wrapChildren(children)}\n    </ul>\n  );\n\n  if (controls === undefined || controls === null) return list;\n\n  return (\n    <>\n      <div className={styles.controls}>{controls}</div>\n      {list}\n    </>\n  );\n}\n"],"names":["isFragmentElement","node","React","isValidElement","type","Fragment","flattenChildren","children","out","Children","forEach","child","props","push","wrapChildren","wrapper","filter","map","i","key","createElement","setListRef","ref","current","List","className","columns","compact","controls","horizontal","layout","maxVisibleItems","ordered","style","cols","Number","isFinite","Math","max","floor","listRef","useRef","visibleHeight","setVisibleHeight","useState","itemLimit","undefined","isOverflowing","Boolean","useLayoutEffect","measure","items","Array","from","item","HTMLElement","getComputedStyle","display","lastVisible","height","length","getBoundingClientRect","bottom","top","scrollTop","parseFloat","paddingBottom","resizeObserver","ResizeObserver","observeItems","disconnect","observe","mutationObserver","MutationObserver","childList","subtree","characterData","classes","cx","styles","list","masonry","scrollable","overflowing","withVars","jsx","tabIndex","jsxs"],"mappings":"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"}

package/dist/components/loading/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index51.css');const l=require("react/jsx-runtime"),n=require("../../classix-5H4IWnMA.cjs"),o="_loading_107mr_23",m="_spin_107mr_1",r="_small_107mr_40",c="_large_107mr_46",_="_ping_107mr_52",d="_sticky_107mr_78",s={loading:o,default:"_default_107mr_29",spin:m,small:r,large:c,ping:_,sticky:d},g={large:s.large,medium:s.medium,small:s.small},u=({variant:a="default",size:e="medium",sticky:i=!1,...t})=>l.jsx("div",{className:n.t(s.loading,i&&s.sticky),"data-component":"loading",children:l.jsx("span",{className:n.t(s.loading,s[a],g[e]),...t})});exports.Loading=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index52.css');const l=require("react/jsx-runtime"),n=require("../../classix-5H4IWnMA.cjs"),o="_loading_107mr_23",m="_spin_107mr_1",r="_small_107mr_40",c="_large_107mr_46",_="_ping_107mr_52",d="_sticky_107mr_78",s={loading:o,default:"_default_107mr_29",spin:m,small:r,large:c,ping:_,sticky:d},g={large:s.large,medium:s.medium,small:s.small},u=({variant:a="default",size:e="medium",sticky:i=!1,...t})=>l.jsx("div",{className:n.t(s.loading,i&&s.sticky),"data-component":"loading",children:l.jsx("span",{className:n.t(s.loading,s[a],g[e]),...t})});exports.Loading=u;
 //# sourceMappingURL=index.cjs.map

package/dist/components/loading/index.js

@@ -1,6 +1,6 @@
 import { jsx as l } from "react/jsx-runtime";
 import { t as a } from "../../classix-DG18itHa.js";
-import '../../assets/index51.css';const o = "_loading_107mr_23", _ = "_spin_107mr_1", e = "_small_107mr_40", r = "_large_107mr_46", c = "_ping_107mr_52", d = "_sticky_107mr_78", s = {
+import '../../assets/index52.css';const o = "_loading_107mr_23", _ = "_spin_107mr_1", e = "_small_107mr_40", r = "_large_107mr_46", c = "_ping_107mr_52", d = "_sticky_107mr_78", s = {
   loading: o,
   default: "_default_107mr_29",
   spin: _,

package/dist/components/menu/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),x=require("../button/index.cjs"),j=require("../icon/index.cjs"),i=require("../../menu-popover-CM3v5s-5.cjs");function M(e){return[...e].sort((n,a)=>+!!n.isDanger-+!!a.isDanger)}const v=e=>M(e).map(n=>({button:r.jsxs(x.Button,{"aria-label":n.accessibleLabel,disabled:n.disabled,children:[n.icon&&r.jsx(j.Icon,{gap:"right",name:n.icon,size:"small"}),r.jsx("span",{children:n.label})]}),id:n.id,isActive:n.isActive,isDanger:n.isDanger,value:n})),D=({inline:e=!1,items:n,menuAccessibleLabel:a="Menu",onItemSelect:s,triggerAccessibleLabel:l="Open menu",triggerIcon:p="DotsThreeVertical",triggerLabel:b,variant:g="popover"})=>{const t=v(n);return g==="simple"?r.jsx(i.MenuActionList,{actions:t,menuAccessibleLabel:a,onSelect:o=>{var u;(u=o.onSelect)==null||u.call(o),s==null||s(o)},"data-component":"menu"}):r.jsx(i.MenuPopover,{inline:e,triggerAccessibleLabel:l,triggerIcon:p,triggerLabel:b,"data-component":"menu",children:({close:o,initialFocus:u})=>r.jsx(i.MenuActionList,{actions:t,initialFocus:u,menuAccessibleLabel:a,onSelect:c=>{var d;(d=c.onSelect)==null||d.call(c),s==null||s(c),o()},usesMenuSemantics:!0})})};exports.Menu=D;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),j=require("../button/index.cjs"),M=require("../icon/index.cjs"),i=require("../../menu-popover-CdhAgSQb.cjs");function v(e){return[...e].sort((n,a)=>+!!n.isDanger-+!!a.isDanger)}const D=e=>v(e).map(n=>({button:r.jsxs(j.Button,{"aria-label":n.accessibleLabel,disabled:n.disabled,children:[n.icon&&r.jsx(M.Icon,{gap:"right",name:n.icon,size:"small"}),r.jsx("span",{children:n.label})]}),id:n.id,isActive:n.isActive,isDanger:n.isDanger,value:n})),h=({inline:e=!1,items:n,menuAccessibleLabel:a="Menu",onItemSelect:s,triggerAccessibleLabel:l="Open menu",triggerIcon:p="DotsThreeVertical",triggerLabel:b,variant:g="popover"})=>{const d=D(n);return g==="simple"?r.jsx(i.MenuActionList,{actions:d,menuAccessibleLabel:a,onSelect:o=>{var u;(u=o.onSelect)==null||u.call(o),s==null||s(o)},"data-component":"menu"}):r.jsx(i.MenuPopover,{inline:e,triggerAccessibleLabel:l,triggerIcon:p,triggerLabel:b,"data-component":"menu",children:({close:o,initialFocus:u,isPositioned:x})=>r.jsx(i.MenuActionList,{actions:d,initialFocus:u,readyToFocus:x,menuAccessibleLabel:a,onSelect:c=>{var t;(t=c.onSelect)==null||t.call(c),s==null||s(c),o()},usesMenuSemantics:!0})})};exports.Menu=h;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/menu/index.tsx"],"sourcesContent":["import { Button } from '@/components/button';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { type MenuAction, MenuActionList } from './action-list';\nimport { MenuPopover } from './menu-popover';\n\nexport type MenuItem = {\n  accessibleLabel?: string;\n  disabled?: boolean;\n  icon?: IconName;\n  id?: string;\n  isActive?: boolean;\n  isDanger?: boolean;\n  label: React.ReactNode;\n  onSelect?: () => void;\n};\n\ntype MenuSharedProps = {\n  items: MenuItem[];\n  menuAccessibleLabel?: string;\n  onItemSelect?: (item: MenuItem) => void;\n};\n\ntype PopoverMenuProps = {\n  inline?: boolean;\n  triggerAccessibleLabel?: string;\n  triggerIcon?: IconName;\n  triggerLabel?: React.ReactNode;\n  variant?: 'popover';\n};\n\ntype SimpleMenuProps = {\n  inline?: never;\n  triggerAccessibleLabel?: never;\n  triggerIcon?: never;\n  triggerLabel?: never;\n  variant: 'simple';\n};\n\nexport type MenuProps = MenuSharedProps & (PopoverMenuProps | SimpleMenuProps);\n\nfunction sortDangerItemsLast(items: MenuItem[]) {\n  return [...items].sort(\n    (left, right) => Number(Boolean(left.isDanger)) - Number(Boolean(right.isDanger))\n  );\n}\n\nconst getActions = (items: MenuItem[]): MenuAction<MenuItem>[] =>\n  sortDangerItemsLast(items).map((item) => ({\n    button: (\n      <Button\n        aria-label={item.accessibleLabel}\n        disabled={item.disabled}\n      >\n        {item.icon && (\n          <Icon\n            gap='right'\n            name={item.icon}\n            size='small'\n          />\n        )}\n        <span>{item.label}</span>\n      </Button>\n    ),\n    id: item.id,\n    isActive: item.isActive,\n    isDanger: item.isDanger,\n    value: item,\n  }));\n\nexport const Menu = ({\n  inline = false,\n  items,\n  menuAccessibleLabel = 'Menu',\n  onItemSelect,\n  triggerAccessibleLabel = 'Open menu',\n  triggerIcon = 'DotsThreeVertical',\n  triggerLabel,\n  variant = 'popover',\n}: MenuProps) => {\n  const actions = getActions(items);\n\n  if (variant === 'simple') {\n    return (\n      <MenuActionList\n        actions={actions}\n        menuAccessibleLabel={menuAccessibleLabel}\n        onSelect={(item) => {\n          item.onSelect?.();\n          onItemSelect?.(item);\n        }}\n      />\n    );\n  }\n\n  return (\n    <MenuPopover\n      inline={inline}\n      triggerAccessibleLabel={triggerAccessibleLabel}\n      triggerIcon={triggerIcon}\n      triggerLabel={triggerLabel}\n    >\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={(item) => {\n            item.onSelect?.();\n            onItemSelect?.(item);\n            close();\n          }}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n};\n"],"names":["sortDangerItemsLast","items","sort","left","right","Number","Boolean","isDanger","getActions","map","item","button","Button","accessibleLabel","disabled","icon","Icon","jsx","label","id","isActive","value","Menu","inline","menuAccessibleLabel","onItemSelect","triggerAccessibleLabel","triggerIcon","triggerLabel","variant","actions","MenuActionList","onSelect","MenuPopover","close","initialFocus"],"mappings":"kOAyCA,SAASA,EAAoBC,EAAmB,CAC9C,MAAO,CAAC,GAAGA,CAAK,EAAEC,KAChB,CAACC,EAAMC,IAAUC,CAAOC,EAAQH,EAAKI,SAAaF,CAAOC,EAAQF,EAAMG,QACzE,CACF,CAEA,MAAMC,EAAcP,GAClBD,EAAoBC,CAAK,EAAEQ,IAAKC,IAAU,CACxCC,cACGC,SAAA,CACC,aAAYF,EAAKG,gBACjB,SAAUH,EAAKI,SAEdJ,SAAAA,CAAAA,EAAKK,YACHC,EAAAA,KAAA,CACC,IAAI,QACJ,KAAMN,EAAKK,KACX,KAAK,OAAA,CAAO,EAGhBE,EAAAA,IAAC,OAAA,CAAMP,SAAAA,EAAKQ,KAAAA,CAAM,CAAA,EACpB,EAEFC,GAAIT,EAAKS,GACTC,SAAUV,EAAKU,SACfb,SAAUG,EAAKH,SACfc,MAAOX,CACT,EAAE,EAESY,EAAOA,CAAC,CACnBC,OAAAA,EAAS,GACTtB,MAAAA,EACAuB,oBAAAA,EAAsB,OACtBC,aAAAA,EACAC,uBAAAA,EAAyB,YACzBC,YAAAA,EAAc,oBACdC,aAAAA,EACAC,QAAAA,EAAU,SACD,IAAM,CACf,MAAMC,EAAUtB,EAAWP,CAAK,EAEhC,OAAI4B,IAAY,SAEZZ,EAAAA,IAACc,EAAAA,eAAA,CACC,QAAAD,EACA,oBAAAN,EACA,SAAWd,GAAS,QAClBA,EAAAA,EAAKsB,WAALtB,MAAAA,EAAAA,KAAAA,GACAe,GAAAA,MAAAA,EAAef,EACjB,EAAE,iBAAA,OAAA,EAMNO,MAACgB,EAAAA,aACC,OAAAV,EACA,uBAAAG,EACA,YAAAC,EACA,aAAAC,EAA2B,iBAAA,OAE1B,SAAA,CAAC,CAAEM,MAAAA,EAAOC,aAAAA,CAAAA,IACTlB,EAAAA,IAACc,EAAAA,eAAA,CACC,QAAAD,EACA,aAAAK,EACA,oBAAAX,EACA,SAAWd,GAAS,QAClBA,EAAAA,EAAKsB,WAALtB,MAAAA,EAAAA,KAAAA,GACAe,GAAAA,MAAAA,EAAef,GACfwB,EAAAA,CACF,EACA,kBAAiB,EAAA,CAAA,EAGvB,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/menu/index.tsx"],"sourcesContent":["import { Button } from '@/components/button';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { type MenuAction, MenuActionList } from './action-list';\nimport { MenuPopover } from './menu-popover';\n\nexport type MenuItem = {\n  accessibleLabel?: string;\n  disabled?: boolean;\n  icon?: IconName;\n  id?: string;\n  isActive?: boolean;\n  isDanger?: boolean;\n  label: React.ReactNode;\n  onSelect?: () => void;\n};\n\ntype MenuSharedProps = {\n  items: MenuItem[];\n  menuAccessibleLabel?: string;\n  onItemSelect?: (item: MenuItem) => void;\n};\n\ntype PopoverMenuProps = {\n  inline?: boolean;\n  triggerAccessibleLabel?: string;\n  triggerIcon?: IconName;\n  triggerLabel?: React.ReactNode;\n  variant?: 'popover';\n};\n\ntype SimpleMenuProps = {\n  inline?: never;\n  triggerAccessibleLabel?: never;\n  triggerIcon?: never;\n  triggerLabel?: never;\n  variant: 'simple';\n};\n\nexport type MenuProps = MenuSharedProps & (PopoverMenuProps | SimpleMenuProps);\n\nfunction sortDangerItemsLast(items: MenuItem[]) {\n  return [...items].sort(\n    (left, right) => Number(Boolean(left.isDanger)) - Number(Boolean(right.isDanger))\n  );\n}\n\nconst getActions = (items: MenuItem[]): MenuAction<MenuItem>[] =>\n  sortDangerItemsLast(items).map((item) => ({\n    button: (\n      <Button\n        aria-label={item.accessibleLabel}\n        disabled={item.disabled}\n      >\n        {item.icon && (\n          <Icon\n            gap='right'\n            name={item.icon}\n            size='small'\n          />\n        )}\n        <span>{item.label}</span>\n      </Button>\n    ),\n    id: item.id,\n    isActive: item.isActive,\n    isDanger: item.isDanger,\n    value: item,\n  }));\n\nexport const Menu = ({\n  inline = false,\n  items,\n  menuAccessibleLabel = 'Menu',\n  onItemSelect,\n  triggerAccessibleLabel = 'Open menu',\n  triggerIcon = 'DotsThreeVertical',\n  triggerLabel,\n  variant = 'popover',\n}: MenuProps) => {\n  const actions = getActions(items);\n\n  if (variant === 'simple') {\n    return (\n      <MenuActionList\n        actions={actions}\n        menuAccessibleLabel={menuAccessibleLabel}\n        onSelect={(item) => {\n          item.onSelect?.();\n          onItemSelect?.(item);\n        }}\n      />\n    );\n  }\n\n  return (\n    <MenuPopover\n      inline={inline}\n      triggerAccessibleLabel={triggerAccessibleLabel}\n      triggerIcon={triggerIcon}\n      triggerLabel={triggerLabel}\n    >\n      {({ close, initialFocus, isPositioned }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          readyToFocus={isPositioned}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={(item) => {\n            item.onSelect?.();\n            onItemSelect?.(item);\n            close();\n          }}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n};\n"],"names":["sortDangerItemsLast","items","sort","left","right","Number","Boolean","isDanger","getActions","map","item","button","Button","accessibleLabel","disabled","icon","Icon","jsx","label","id","isActive","value","Menu","inline","menuAccessibleLabel","onItemSelect","triggerAccessibleLabel","triggerIcon","triggerLabel","variant","actions","MenuActionList","onSelect","MenuPopover","close","initialFocus","isPositioned"],"mappings":"kOAyCA,SAASA,EAAoBC,EAAmB,CAC9C,MAAO,CAAC,GAAGA,CAAK,EAAEC,KAChB,CAACC,EAAMC,IAAUC,CAAOC,EAAQH,EAAKI,SAAaF,CAAOC,EAAQF,EAAMG,QACzE,CACF,CAEA,MAAMC,EAAcP,GAClBD,EAAoBC,CAAK,EAAEQ,IAAKC,IAAU,CACxCC,cACGC,SAAA,CACC,aAAYF,EAAKG,gBACjB,SAAUH,EAAKI,SAEdJ,SAAAA,CAAAA,EAAKK,YACHC,EAAAA,KAAA,CACC,IAAI,QACJ,KAAMN,EAAKK,KACX,KAAK,OAAA,CAAO,EAGhBE,EAAAA,IAAC,OAAA,CAAMP,SAAAA,EAAKQ,KAAAA,CAAM,CAAA,EACpB,EAEFC,GAAIT,EAAKS,GACTC,SAAUV,EAAKU,SACfb,SAAUG,EAAKH,SACfc,MAAOX,CACT,EAAE,EAESY,EAAOA,CAAC,CACnBC,OAAAA,EAAS,GACTtB,MAAAA,EACAuB,oBAAAA,EAAsB,OACtBC,aAAAA,EACAC,uBAAAA,EAAyB,YACzBC,YAAAA,EAAc,oBACdC,aAAAA,EACAC,QAAAA,EAAU,SACD,IAAM,CACf,MAAMC,EAAUtB,EAAWP,CAAK,EAEhC,OAAI4B,IAAY,SAEZZ,EAAAA,IAACc,EAAAA,eAAA,CACC,QAAAD,EACA,oBAAAN,EACA,SAAWd,GAAS,QAClBA,EAAAA,EAAKsB,WAALtB,MAAAA,EAAAA,KAAAA,GACAe,GAAAA,MAAAA,EAAef,EACjB,EAAE,iBAAA,OAAA,EAMNO,MAACgB,EAAAA,aACC,OAAAV,EACA,uBAAAG,EACA,YAAAC,EACA,aAAAC,EAA2B,iBAAA,OAE1B,SAAA,CAAC,CAAEM,MAAAA,EAAOC,aAAAA,EAAcC,aAAAA,CAAAA,UACtBL,EAAAA,eAAA,CACC,QAAAD,EACA,aAAAK,EACA,aAAcC,EACd,oBAAAZ,EACA,SAAWd,GAAS,QAClBA,EAAAA,EAAKsB,WAALtB,MAAAA,EAAAA,KAAAA,GACAe,GAAAA,MAAAA,EAAef,GACfwB,EAAAA,CACF,EACA,kBAAiB,EAAA,CAAA,EAGvB,CAEJ"}

package/dist/components/menu/index.js

@@ -1,21 +1,21 @@
-import { jsx as o, jsxs as D } from "react/jsx-runtime";
-import { Button as M } from "../button/index.js";
-import { Icon as h } from "../icon/index.js";
-import { M as d, a as v } from "../../menu-popover-DOkciab5.js";
-function t(s) {
-  return [...s].sort((n, u) => +!!n.isDanger - +!!u.isDanger);
+import { jsx as s, jsxs as M } from "react/jsx-runtime";
+import { Button as h } from "../button/index.js";
+import { Icon as v } from "../icon/index.js";
+import { M as l, a as t } from "../../menu-popover-D-Ax5zzy.js";
+function x(o) {
+  return [...o].sort((n, u) => +!!n.isDanger - +!!u.isDanger);
 }
-const x = (s) => t(s).map((n) => ({
-  button: /* @__PURE__ */ D(M, { "aria-label": n.accessibleLabel, disabled: n.disabled, children: [
-    n.icon && /* @__PURE__ */ o(h, { gap: "right", name: n.icon, size: "small" }),
-    /* @__PURE__ */ o("span", { children: n.label })
+const A = (o) => x(o).map((n) => ({
+  button: /* @__PURE__ */ M(h, { "aria-label": n.accessibleLabel, disabled: n.disabled, children: [
+    n.icon && /* @__PURE__ */ s(v, { gap: "right", name: n.icon, size: "small" }),
+    /* @__PURE__ */ s("span", { children: n.label })
   ] }),
   id: n.id,
   isActive: n.isActive,
   isDanger: n.isDanger,
   value: n
-})), N = ({
-  inline: s = !1,
+})), T = ({
+  inline: o = !1,
   items: n,
   menuAccessibleLabel: u = "Menu",
   onItemSelect: r,
@@ -24,19 +24,20 @@ const x = (s) => t(s).map((n) => ({
   triggerLabel: b,
   variant: f = "popover"
 }) => {
-  const c = x(n);
-  return f === "simple" ? /* @__PURE__ */ o(d, { actions: c, menuAccessibleLabel: u, onSelect: (a) => {
-    var i;
-    (i = a.onSelect) == null || i.call(a), r == null || r(a);
-  }, "data-component": "menu" }) : /* @__PURE__ */ o(v, { inline: s, triggerAccessibleLabel: e, triggerIcon: g, triggerLabel: b, "data-component": "menu", children: ({
+  const p = A(n);
+  return f === "simple" ? /* @__PURE__ */ s(l, { actions: p, menuAccessibleLabel: u, onSelect: (a) => {
+    var c;
+    (c = a.onSelect) == null || c.call(a), r == null || r(a);
+  }, "data-component": "menu" }) : /* @__PURE__ */ s(t, { inline: o, triggerAccessibleLabel: e, triggerIcon: g, triggerLabel: b, "data-component": "menu", children: ({
     close: a,
-    initialFocus: i
-  }) => /* @__PURE__ */ o(d, { actions: c, initialFocus: i, menuAccessibleLabel: u, onSelect: (p) => {
-    var l;
-    (l = p.onSelect) == null || l.call(p), r == null || r(p), a();
+    initialFocus: c,
+    isPositioned: D
+  }) => /* @__PURE__ */ s(l, { actions: p, initialFocus: c, readyToFocus: D, menuAccessibleLabel: u, onSelect: (i) => {
+    var d;
+    (d = i.onSelect) == null || d.call(i), r == null || r(i), a();
   }, usesMenuSemantics: !0 }) });
 };
 export {
-  N as Menu
+  T as Menu
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/menu/index.tsx"],"sourcesContent":["import { Button } from '@/components/button';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { type MenuAction, MenuActionList } from './action-list';\nimport { MenuPopover } from './menu-popover';\n\nexport type MenuItem = {\n  accessibleLabel?: string;\n  disabled?: boolean;\n  icon?: IconName;\n  id?: string;\n  isActive?: boolean;\n  isDanger?: boolean;\n  label: React.ReactNode;\n  onSelect?: () => void;\n};\n\ntype MenuSharedProps = {\n  items: MenuItem[];\n  menuAccessibleLabel?: string;\n  onItemSelect?: (item: MenuItem) => void;\n};\n\ntype PopoverMenuProps = {\n  inline?: boolean;\n  triggerAccessibleLabel?: string;\n  triggerIcon?: IconName;\n  triggerLabel?: React.ReactNode;\n  variant?: 'popover';\n};\n\ntype SimpleMenuProps = {\n  inline?: never;\n  triggerAccessibleLabel?: never;\n  triggerIcon?: never;\n  triggerLabel?: never;\n  variant: 'simple';\n};\n\nexport type MenuProps = MenuSharedProps & (PopoverMenuProps | SimpleMenuProps);\n\nfunction sortDangerItemsLast(items: MenuItem[]) {\n  return [...items].sort(\n    (left, right) => Number(Boolean(left.isDanger)) - Number(Boolean(right.isDanger))\n  );\n}\n\nconst getActions = (items: MenuItem[]): MenuAction<MenuItem>[] =>\n  sortDangerItemsLast(items).map((item) => ({\n    button: (\n      <Button\n        aria-label={item.accessibleLabel}\n        disabled={item.disabled}\n      >\n        {item.icon && (\n          <Icon\n            gap='right'\n            name={item.icon}\n            size='small'\n          />\n        )}\n        <span>{item.label}</span>\n      </Button>\n    ),\n    id: item.id,\n    isActive: item.isActive,\n    isDanger: item.isDanger,\n    value: item,\n  }));\n\nexport const Menu = ({\n  inline = false,\n  items,\n  menuAccessibleLabel = 'Menu',\n  onItemSelect,\n  triggerAccessibleLabel = 'Open menu',\n  triggerIcon = 'DotsThreeVertical',\n  triggerLabel,\n  variant = 'popover',\n}: MenuProps) => {\n  const actions = getActions(items);\n\n  if (variant === 'simple') {\n    return (\n      <MenuActionList\n        actions={actions}\n        menuAccessibleLabel={menuAccessibleLabel}\n        onSelect={(item) => {\n          item.onSelect?.();\n          onItemSelect?.(item);\n        }}\n      />\n    );\n  }\n\n  return (\n    <MenuPopover\n      inline={inline}\n      triggerAccessibleLabel={triggerAccessibleLabel}\n      triggerIcon={triggerIcon}\n      triggerLabel={triggerLabel}\n    >\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={(item) => {\n            item.onSelect?.();\n            onItemSelect?.(item);\n            close();\n          }}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n};\n"],"names":["sortDangerItemsLast","items","sort","left","right","Number","Boolean","isDanger","getActions","map","item","button","Button","accessibleLabel","disabled","icon","Icon","jsx","label","id","isActive","value","Menu","inline","menuAccessibleLabel","onItemSelect","triggerAccessibleLabel","triggerIcon","triggerLabel","variant","actions","MenuActionList","onSelect","MenuPopover","close","initialFocus"],"mappings":";;;;AAyCA,SAASA,EAAoBC,GAAmB;AAC9C,SAAO,CAAC,GAAGA,CAAK,EAAEC,KAChB,CAACC,GAAMC,MAAUC,CAAOC,EAAQH,EAAKI,WAAaF,CAAOC,EAAQF,EAAMG,QACzE;AACF;AAEA,MAAMC,IAAaA,CAACP,MAClBD,EAAoBC,CAAK,EAAEQ,IAAKC,CAAAA,OAAU;AAAA,EACxCC,0BACGC,GAAA,EACC,cAAYF,EAAKG,iBACjB,UAAUH,EAAKI,UAEdJ,UAAAA;AAAAA,IAAAA,EAAKK,0BACHC,GAAA,EACC,KAAI,SACJ,MAAMN,EAAKK,MACX,MAAK,QAAA,CAAO;AAAA,IAGhB,gBAAAE,EAAC,QAAA,EAAMP,UAAAA,EAAKQ,MAAAA,CAAM;AAAA,EAAA,GACpB;AAAA,EAEFC,IAAIT,EAAKS;AAAAA,EACTC,UAAUV,EAAKU;AAAAA,EACfb,UAAUG,EAAKH;AAAAA,EACfc,OAAOX;AACT,EAAE,GAESY,IAAOA,CAAC;AAAA,EACnBC,QAAAA,IAAS;AAAA,EACTtB,OAAAA;AAAAA,EACAuB,qBAAAA,IAAsB;AAAA,EACtBC,cAAAA;AAAAA,EACAC,wBAAAA,IAAyB;AAAA,EACzBC,aAAAA,IAAc;AAAA,EACdC,cAAAA;AAAAA,EACAC,SAAAA,IAAU;AACD,MAAM;AACf,QAAMC,IAAUtB,EAAWP,CAAK;AAEhC,SAAI4B,MAAY,WAEZ,gBAAAZ,EAACc,GAAA,EACC,SAAAD,GACA,qBAAAN,GACA,UAAWd,CAAAA,MAAS;;AAClBA,KAAAA,IAAAA,EAAKsB,aAALtB,QAAAA,EAAAA,KAAAA,IACAe,KAAAA,QAAAA,EAAef;AAAAA,EACjB,GAAE,kBAAA,QAAA,IAMN,gBAAAO,EAACgB,KACC,QAAAV,GACA,wBAAAG,GACA,aAAAC,GACA,cAAAC,GAA2B,kBAAA,QAE1B,UAAA,CAAC;AAAA,IAAEM,OAAAA;AAAAA,IAAOC,cAAAA;AAAAA,EAAAA,MACT,gBAAAlB,EAACc,GAAA,EACC,SAAAD,GACA,cAAAK,GACA,qBAAAX,GACA,UAAWd,CAAAA,MAAS;;AAClBA,KAAAA,IAAAA,EAAKsB,aAALtB,QAAAA,EAAAA,KAAAA,IACAe,KAAAA,QAAAA,EAAef,IACfwB,EAAAA;AAAAA,EACF,GACA,mBAAiB,GAAA,CAAA,GAGvB;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/menu/index.tsx"],"sourcesContent":["import { Button } from '@/components/button';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { type MenuAction, MenuActionList } from './action-list';\nimport { MenuPopover } from './menu-popover';\n\nexport type MenuItem = {\n  accessibleLabel?: string;\n  disabled?: boolean;\n  icon?: IconName;\n  id?: string;\n  isActive?: boolean;\n  isDanger?: boolean;\n  label: React.ReactNode;\n  onSelect?: () => void;\n};\n\ntype MenuSharedProps = {\n  items: MenuItem[];\n  menuAccessibleLabel?: string;\n  onItemSelect?: (item: MenuItem) => void;\n};\n\ntype PopoverMenuProps = {\n  inline?: boolean;\n  triggerAccessibleLabel?: string;\n  triggerIcon?: IconName;\n  triggerLabel?: React.ReactNode;\n  variant?: 'popover';\n};\n\ntype SimpleMenuProps = {\n  inline?: never;\n  triggerAccessibleLabel?: never;\n  triggerIcon?: never;\n  triggerLabel?: never;\n  variant: 'simple';\n};\n\nexport type MenuProps = MenuSharedProps & (PopoverMenuProps | SimpleMenuProps);\n\nfunction sortDangerItemsLast(items: MenuItem[]) {\n  return [...items].sort(\n    (left, right) => Number(Boolean(left.isDanger)) - Number(Boolean(right.isDanger))\n  );\n}\n\nconst getActions = (items: MenuItem[]): MenuAction<MenuItem>[] =>\n  sortDangerItemsLast(items).map((item) => ({\n    button: (\n      <Button\n        aria-label={item.accessibleLabel}\n        disabled={item.disabled}\n      >\n        {item.icon && (\n          <Icon\n            gap='right'\n            name={item.icon}\n            size='small'\n          />\n        )}\n        <span>{item.label}</span>\n      </Button>\n    ),\n    id: item.id,\n    isActive: item.isActive,\n    isDanger: item.isDanger,\n    value: item,\n  }));\n\nexport const Menu = ({\n  inline = false,\n  items,\n  menuAccessibleLabel = 'Menu',\n  onItemSelect,\n  triggerAccessibleLabel = 'Open menu',\n  triggerIcon = 'DotsThreeVertical',\n  triggerLabel,\n  variant = 'popover',\n}: MenuProps) => {\n  const actions = getActions(items);\n\n  if (variant === 'simple') {\n    return (\n      <MenuActionList\n        actions={actions}\n        menuAccessibleLabel={menuAccessibleLabel}\n        onSelect={(item) => {\n          item.onSelect?.();\n          onItemSelect?.(item);\n        }}\n      />\n    );\n  }\n\n  return (\n    <MenuPopover\n      inline={inline}\n      triggerAccessibleLabel={triggerAccessibleLabel}\n      triggerIcon={triggerIcon}\n      triggerLabel={triggerLabel}\n    >\n      {({ close, initialFocus, isPositioned }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          readyToFocus={isPositioned}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={(item) => {\n            item.onSelect?.();\n            onItemSelect?.(item);\n            close();\n          }}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n};\n"],"names":["sortDangerItemsLast","items","sort","left","right","Number","Boolean","isDanger","getActions","map","item","button","Button","accessibleLabel","disabled","icon","Icon","jsx","label","id","isActive","value","Menu","inline","menuAccessibleLabel","onItemSelect","triggerAccessibleLabel","triggerIcon","triggerLabel","variant","actions","MenuActionList","onSelect","MenuPopover","close","initialFocus","isPositioned"],"mappings":";;;;AAyCA,SAASA,EAAoBC,GAAmB;AAC9C,SAAO,CAAC,GAAGA,CAAK,EAAEC,KAChB,CAACC,GAAMC,MAAUC,CAAOC,EAAQH,EAAKI,WAAaF,CAAOC,EAAQF,EAAMG,QACzE;AACF;AAEA,MAAMC,IAAaA,CAACP,MAClBD,EAAoBC,CAAK,EAAEQ,IAAKC,CAAAA,OAAU;AAAA,EACxCC,0BACGC,GAAA,EACC,cAAYF,EAAKG,iBACjB,UAAUH,EAAKI,UAEdJ,UAAAA;AAAAA,IAAAA,EAAKK,0BACHC,GAAA,EACC,KAAI,SACJ,MAAMN,EAAKK,MACX,MAAK,QAAA,CAAO;AAAA,IAGhB,gBAAAE,EAAC,QAAA,EAAMP,UAAAA,EAAKQ,MAAAA,CAAM;AAAA,EAAA,GACpB;AAAA,EAEFC,IAAIT,EAAKS;AAAAA,EACTC,UAAUV,EAAKU;AAAAA,EACfb,UAAUG,EAAKH;AAAAA,EACfc,OAAOX;AACT,EAAE,GAESY,IAAOA,CAAC;AAAA,EACnBC,QAAAA,IAAS;AAAA,EACTtB,OAAAA;AAAAA,EACAuB,qBAAAA,IAAsB;AAAA,EACtBC,cAAAA;AAAAA,EACAC,wBAAAA,IAAyB;AAAA,EACzBC,aAAAA,IAAc;AAAA,EACdC,cAAAA;AAAAA,EACAC,SAAAA,IAAU;AACD,MAAM;AACf,QAAMC,IAAUtB,EAAWP,CAAK;AAEhC,SAAI4B,MAAY,WAEZ,gBAAAZ,EAACc,GAAA,EACC,SAAAD,GACA,qBAAAN,GACA,UAAWd,CAAAA,MAAS;;AAClBA,KAAAA,IAAAA,EAAKsB,aAALtB,QAAAA,EAAAA,KAAAA,IACAe,KAAAA,QAAAA,EAAef;AAAAA,EACjB,GAAE,kBAAA,QAAA,IAMN,gBAAAO,EAACgB,KACC,QAAAV,GACA,wBAAAG,GACA,aAAAC,GACA,cAAAC,GAA2B,kBAAA,QAE1B,UAAA,CAAC;AAAA,IAAEM,OAAAA;AAAAA,IAAOC,cAAAA;AAAAA,IAAcC,cAAAA;AAAAA,EAAAA,wBACtBL,GAAA,EACC,SAAAD,GACA,cAAAK,GACA,cAAcC,GACd,qBAAAZ,GACA,UAAWd,CAAAA,MAAS;;AAClBA,KAAAA,IAAAA,EAAKsB,aAALtB,QAAAA,EAAAA,KAAAA,IACAe,KAAAA,QAAAA,EAAef,IACfwB,EAAAA;AAAAA,EACF,GACA,mBAAiB,GAAA,CAAA,GAGvB;AAEJ;"}

package/dist/components/message/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index16.css');const e=require("react/jsx-runtime"),f=require("../../classix-5H4IWnMA.cjs"),h=require("../avatar/index.cjs"),k=require("../icon/index.cjs"),N="_attachments_77ukg_1",w="_footer_77ukg_27",S="_message_77ukg_11",b="_timestamp_77ukg_152",q="_actions_77ukg_157",y="_preview_77ukg_169",s={attachments:N,"message-group":"_message-group_77ukg_11",footer:w,message:S,timestamp:b,actions:q,preview:y},I=({actions:c,appearance:r="default",attachments:i,author:a,authorColor:g,authorImageUrl:l,authorLink:d,authorRole:_,content:u,iconName:p="Info",id:v,preview:x,timestamp:m,timestampText:j,type:t="default"})=>{const n=m?new Date(m):void 0,o=n?e.jsx("time",{className:s.timestamp,dateTime:n.toISOString(),children:j??n.toLocaleString()}):null;return e.jsxs("div",{className:s["message-group"],"data-message-type":t,"data-component":"message",children:[a&&e.jsx(h.Avatar,{accessibleLabel:a,color:g,imageUrl:l,link:d,name:a,role:_}),t==="system"&&o,e.jsxs("div",{className:f.t(s.message,x&&s.preview),"data-appearance":r,"data-id":v,"data-type":t,children:[t=="system"&&e.jsx(k.Icon,{gap:"right",name:p}),u]}),i&&e.jsx("div",{className:s.attachments,children:i}),t!=="system"&&(c?e.jsxs("div",{className:s.footer,children:[o,e.jsx("div",{className:s.actions,"data-message-actions":!0,children:c})]}):o)]})};exports.Message=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index16.css');const e=require("react/jsx-runtime"),j=require("../../classix-5H4IWnMA.cjs"),h=require("../avatar/index.cjs"),N=require("../icon/index.cjs"),w="_attachments_1crfp_1",y="_footer_1crfp_27",S="_message_1crfp_11",b="_timestamp_1crfp_147",q="_actions_1crfp_152",I="_preview_1crfp_164",s={attachments:w,"message-group":"_message-group_1crfp_11",footer:y,message:S,timestamp:b,actions:q,preview:I},M=({actions:i,appearance:m="default",attachments:o,author:a,authorColor:l,authorImageUrl:d,authorLink:_,authorRole:p,content:g,iconName:f="Info",id:u,preview:v,timestamp:r,timestampText:x,type:t="default"})=>{const c=r?new Date(r):void 0,n=c?e.jsx("time",{className:s.timestamp,dateTime:c.toISOString(),children:x??c.toLocaleString()}):null;return e.jsxs("div",{className:s["message-group"],"data-message-type":t,"data-component":"message",children:[a&&e.jsx(h.Avatar,{accessibleLabel:a,color:l,imageUrl:d,link:_,name:a,role:p}),t==="system"&&n,e.jsxs("div",{className:j.t(s.message,v&&s.preview),"data-appearance":m,"data-id":u,"data-type":t,children:[t=="system"&&e.jsx(N.Icon,{gap:"right",name:f,size:"tiny"}),g]}),o&&e.jsx("div",{className:s.attachments,children:o}),t!=="system"&&(i?e.jsxs("div",{className:s.footer,children:[n,e.jsx("div",{className:s.actions,"data-message-actions":!0,children:i})]}):n)]})};exports.Message=M;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/message/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport type { IconName } from '@/components/icon';\n\nimport { Avatar, type AvatarColor } from '../avatar';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type MessageOptions = {\n  /** Controls shown under the message, e.g. a delete button for the author's own message. */\n  actions?: React.ReactNode;\n  appearance?: 'default' | 'document' | 'file';\n  attachments?: React.ReactNode;\n  author?: string;\n  authorColor?: AvatarColor;\n  authorImageUrl?: string;\n  authorLink?: string;\n  authorRole?: string;\n  content: React.ReactNode;\n  iconName?: IconName;\n  id: string;\n  preview?: boolean;\n  timestamp?: Date | string;\n  timestampText?: React.ReactNode;\n  type?: 'default' | 'minimal' | 'system' | 'user';\n};\n\nexport const Message = ({\n  actions,\n  appearance = 'default',\n  attachments,\n  author,\n  authorColor,\n  authorImageUrl,\n  authorLink,\n  authorRole,\n  content,\n  iconName = 'Info',\n  id,\n  preview,\n  timestamp,\n  timestampText,\n  type = 'default',\n}: MessageOptions) => {\n  const date = timestamp ? new Date(timestamp) : undefined;\n  const timestampElement = date ? (\n    <time\n      className={styles.timestamp}\n      dateTime={date.toISOString()}\n    >\n      {timestampText ?? date.toLocaleString()}\n    </time>\n  ) : null;\n\n  return (\n    <div\n      className={styles['message-group']}\n      data-message-type={type}\n    >\n      {author && (\n        <Avatar\n          accessibleLabel={author}\n          color={authorColor}\n          imageUrl={authorImageUrl}\n          link={authorLink}\n          name={author}\n          role={authorRole}\n        />\n      )}\n      {type === 'system' && timestampElement}\n      <div\n        className={cx(styles.message, preview && styles.preview)}\n        data-appearance={appearance}\n        data-id={id}\n        data-type={type}\n      >\n        {type == 'system' && (\n          <Icon\n            gap='right'\n            name={iconName}\n          />\n        )}\n        {content}\n      </div>\n      {attachments && <div className={styles.attachments}>{attachments}</div>}\n      {type !== 'system' &&\n        (actions ? (\n          <div className={styles.footer}>\n            {timestampElement}\n            <div\n              className={styles.actions}\n              data-message-actions\n            >\n              {actions}\n            </div>\n          </div>\n        ) : (\n          timestampElement\n        ))}\n    </div>\n  );\n};\n"],"names":["Message","actions","appearance","attachments","author","authorColor","authorImageUrl","authorLink","authorRole","content","iconName","id","preview","timestamp","timestampText","type","date","Date","undefined","timestampElement","jsx","styles","toISOString","toLocaleString","jsxs","Avatar","cx","message","Icon","footer"],"mappings":"udA2BaA,EAAUA,CAAC,CACtBC,QAAAA,EACAC,WAAAA,EAAa,UACbC,YAAAA,EACAC,OAAAA,EACAC,YAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,SAAAA,EAAW,OACXC,GAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,cAAAA,EACAC,KAAAA,EAAO,SACO,IAAM,CACpB,MAAMC,EAAOH,EAAY,IAAII,KAAKJ,CAAS,EAAIK,OACzCC,EAAmBH,EACvBI,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAOR,UAClB,SAAUG,EAAKM,cAEdR,SAAAA,GAAiBE,EAAKO,eAAAA,EACzB,EACE,KAEJ,OACEC,OAAC,OACC,UAAWH,EAAO,eAAe,EACjC,oBAAmBN,EAAK,iBAAA,UAEvBX,SAAAA,CAAAA,GACCgB,EAAAA,IAACK,EAAAA,OAAA,CACC,gBAAiBrB,EACjB,MAAOC,EACP,SAAUC,EACV,KAAMC,EACN,KAAMH,EACN,KAAMI,EAAW,EAGpBO,IAAS,UAAYI,EACtBK,EAAAA,KAAC,MAAA,CACC,UAAWE,EAAAA,EAAGL,EAAOM,QAASf,GAAWS,EAAOT,OAAO,EACvD,kBAAiBV,EACjB,UAASS,EACT,YAAWI,EAEVA,SAAAA,CAAAA,GAAQ,UACPK,EAAAA,IAACQ,EAAAA,KAAA,CACC,IAAI,QACJ,KAAMlB,EAAS,EAGlBD,CAAAA,EACH,EACCN,GAAeiB,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAOlB,YAAcA,SAAAA,EAAY,EAChEY,IAAS,WACPd,SACE,MAAA,CAAI,UAAWoB,EAAOQ,OACpBV,SAAAA,CAAAA,QACA,MAAA,CACC,UAAWE,EAAOpB,QAClB,uBAAoB,GAEnBA,SAAAA,CAAAA,CACH,CAAA,CAAA,CACF,EAEAkB,EAAAA,EAEN,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/message/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport type { IconName } from '@/components/icon';\n\nimport { Avatar, type AvatarColor } from '../avatar';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type MessageOptions = {\n  actions?: React.ReactNode;\n  appearance?: 'default' | 'document' | 'file';\n  attachments?: React.ReactNode;\n  author?: string;\n  authorColor?: AvatarColor;\n  authorImageUrl?: string;\n  authorLink?: string;\n  authorRole?: string;\n  content: React.ReactNode;\n  iconName?: IconName;\n  id: string;\n  preview?: boolean;\n  timestamp?: Date | string;\n  timestampText?: React.ReactNode;\n  type?: 'default' | 'minimal' | 'system' | 'user';\n};\n\nexport const Message = ({\n  actions,\n  appearance = 'default',\n  attachments,\n  author,\n  authorColor,\n  authorImageUrl,\n  authorLink,\n  authorRole,\n  content,\n  iconName = 'Info',\n  id,\n  preview,\n  timestamp,\n  timestampText,\n  type = 'default',\n}: MessageOptions) => {\n  const date = timestamp ? new Date(timestamp) : undefined;\n  const timestampElement = date ? (\n    <time\n      className={styles.timestamp}\n      dateTime={date.toISOString()}\n    >\n      {timestampText ?? date.toLocaleString()}\n    </time>\n  ) : null;\n\n  return (\n    <div\n      className={styles['message-group']}\n      data-message-type={type}\n    >\n      {author && (\n        <Avatar\n          accessibleLabel={author}\n          color={authorColor}\n          imageUrl={authorImageUrl}\n          link={authorLink}\n          name={author}\n          role={authorRole}\n        />\n      )}\n      {type === 'system' && timestampElement}\n      <div\n        className={cx(styles.message, preview && styles.preview)}\n        data-appearance={appearance}\n        data-id={id}\n        data-type={type}\n      >\n        {type == 'system' && (\n          <Icon\n            gap='right'\n            name={iconName}\n            size='tiny'\n          />\n        )}\n        {content}\n      </div>\n      {attachments && <div className={styles.attachments}>{attachments}</div>}\n      {type !== 'system' &&\n        (actions ? (\n          <div className={styles.footer}>\n            {timestampElement}\n            <div\n              className={styles.actions}\n              data-message-actions\n            >\n              {actions}\n            </div>\n          </div>\n        ) : (\n          timestampElement\n        ))}\n    </div>\n  );\n};\n"],"names":["Message","actions","appearance","attachments","author","authorColor","authorImageUrl","authorLink","authorRole","content","iconName","id","preview","timestamp","timestampText","type","date","Date","undefined","timestampElement","jsx","styles","toISOString","toLocaleString","jsxs","Avatar","cx","message","Icon","footer"],"mappings":"udA0BaA,EAAUA,CAAC,CACtBC,QAAAA,EACAC,WAAAA,EAAa,UACbC,YAAAA,EACAC,OAAAA,EACAC,YAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,SAAAA,EAAW,OACXC,GAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,cAAAA,EACAC,KAAAA,EAAO,SACO,IAAM,CACpB,MAAMC,EAAOH,EAAY,IAAII,KAAKJ,CAAS,EAAIK,OACzCC,EAAmBH,EACvBI,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAOR,UAClB,SAAUG,EAAKM,cAEdR,SAAAA,GAAiBE,EAAKO,eAAAA,EACzB,EACE,KAEJ,OACEC,OAAC,OACC,UAAWH,EAAO,eAAe,EACjC,oBAAmBN,EAAK,iBAAA,UAEvBX,SAAAA,CAAAA,GACCgB,EAAAA,IAACK,EAAAA,OAAA,CACC,gBAAiBrB,EACjB,MAAOC,EACP,SAAUC,EACV,KAAMC,EACN,KAAMH,EACN,KAAMI,EAAW,EAGpBO,IAAS,UAAYI,EACtBK,EAAAA,KAAC,MAAA,CACC,UAAWE,EAAAA,EAAGL,EAAOM,QAASf,GAAWS,EAAOT,OAAO,EACvD,kBAAiBV,EACjB,UAASS,EACT,YAAWI,EAEVA,SAAAA,CAAAA,GAAQ,gBACNa,EAAAA,KAAA,CACC,IAAI,QACJ,KAAMlB,EACN,KAAK,MAAA,CAAM,EAGdD,CAAAA,EACH,EACCN,GAAeiB,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAOlB,YAAcA,SAAAA,EAAY,EAChEY,IAAS,WACPd,SACE,MAAA,CAAI,UAAWoB,EAAOQ,OACpBV,SAAAA,CAAAA,QACA,MAAA,CACC,UAAWE,EAAOpB,QAClB,uBAAoB,GAEnBA,SAAAA,CAAAA,CACH,CAAA,CAAA,CACF,EAEAkB,EAAAA,EAEN,CAEJ"}