@solibo/solibo-ui 1.1.2 → 1.1.4

package/dist/components/file/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index43.css');const e=require("react/jsx-runtime"),j=require("../figure/index.cjs"),_=require("../icon/index.cjs"),f=require("../button/index.cjs"),N="_file_1427u_1",F="_action_1427u_14",b="_details_1427u_62",g="_name_1427u_69",I="_extension_1427u_81",P="_subtitle_1427u_91",t={file:N,action:F,delete:"_delete_1427u_15",details:b,"name-line":"_name-line_1427u_69",name:g,extension:I,subtitle:P},q={".doc":"FileDoc",".docx":"FileDoc",".pdf":"FilePdf",".ppt":"FilePpt",".pptx":"FilePpt",".xls":"FileXls",".xlsx":"FileXls"},v=({deleteAccessibleLabel:u,name:s,onClick:n,onDelete:a,ref:m,subtitle:r,url:d})=>{const i=s.lastIndexOf("."),x=i>0&&i<s.length-1,p=x?s.slice(0,i):s,c=x?s.slice(i):"",h=q[c.toLowerCase()]??"FileText",o=e.jsxs(e.Fragment,{children:[e.jsx(j.Figure,{children:e.jsx(_.Icon,{name:h})}),e.jsxs("span",{className:t.details,children:[e.jsxs("span",{className:t["name-line"],children:[e.jsx("span",{className:t.name,children:p}),c&&e.jsx("span",{className:t.extension,children:c})]}),r&&e.jsx("span",{className:t.subtitle,children:r})]})]});return e.jsxs("div",{className:t.file,ref:m,"data-component":"file",children:[d?e.jsx("a",{className:t.action,href:d,onClick:l=>{l.stopPropagation(),n&&(l.preventDefault(),n())},title:s,children:o}):n?e.jsx("button",{"aria-label":s,className:t.action,"data-actionable":"true",onClick:l=>{l.stopPropagation(),n()},title:s,type:"button",children:o}):e.jsx("div",{className:t.action,title:s,children:o}),a&&e.jsx(f.Button,{"aria-label":u??`Delete ${s}`,className:t.delete,onClick:()=>a(),variant:"simple",children:e.jsx(_.Icon,{name:"Trash",size:"small"})})]})};exports.File=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index43.css');const e=require("react/jsx-runtime"),j=require("../figure/index.cjs"),_=require("../icon/index.cjs"),f=require("../button/index.cjs"),N="_file_1427u_1",F="_action_1427u_14",b="_details_1427u_62",g="_name_1427u_69",I="_extension_1427u_81",P="_subtitle_1427u_91",t={file:N,action:F,delete:"_delete_1427u_15",details:b,"name-line":"_name-line_1427u_69",name:g,extension:I,subtitle:P},y={".doc":"FileDoc",".docx":"FileDoc",".pdf":"FilePdf",".ppt":"FilePpt",".pptx":"FilePpt",".xls":"FileXls",".xlsx":"FileXls"},q=({deleteAccessibleLabel:u,name:s,onClick:n,onDelete:a,ref:m,subtitle:r,url:d})=>{const i=s.lastIndexOf("."),x=i>0&&i<s.length-1,p=x?s.slice(0,i):s,c=x?s.slice(i):"",h=y[c.toLowerCase()]??"FileText",o=e.jsxs(e.Fragment,{children:[e.jsx(j.Figure,{children:e.jsx(_.Icon,{name:h})}),e.jsxs("span",{className:t.details,children:[e.jsxs("span",{className:t["name-line"],children:[e.jsx("span",{className:t.name,children:p}),c&&e.jsx("span",{className:t.extension,children:c})]}),r&&e.jsx("span",{className:t.subtitle,children:r})]})]});return e.jsxs("div",{className:t.file,ref:m,"data-component":"file",children:[d?e.jsx("a",{className:t.action,href:d,onClick:l=>{l.stopPropagation(),n&&(l.preventDefault(),n())},title:s,children:o}):n?e.jsx("button",{"aria-label":s,className:t.action,"data-actionable":"true",onClick:l=>{l.stopPropagation(),n()},title:s,type:"button",children:o}):e.jsx("div",{className:t.action,title:s,children:o}),a&&e.jsx(f.Button,{"aria-label":u??`Delete ${s}`,className:t.delete,onClick:()=>a(),variant:"tertiary",children:e.jsx(_.Icon,{name:"Trash",size:"small"})})]})};exports.File=q;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/file/index.tsx"],"sourcesContent":["import { Figure } from '@/components/figure';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { Button } from '../button';\nimport styles from './styles.module.css';\n\nconst documentIconNames: Record<string, IconName> = {\n  '.doc': 'FileDoc',\n  '.docx': 'FileDoc',\n  '.pdf': 'FilePdf',\n  '.ppt': 'FilePpt',\n  '.pptx': 'FilePpt',\n  '.xls': 'FileXls',\n  '.xlsx': 'FileXls',\n};\n\nexport type FileProps = React.ComponentPropsWithRef<'div'> & {\n  deleteAccessibleLabel?: string;\n  name: string;\n  onClick?: () => void;\n  onDelete?: () => void;\n  subtitle?: string;\n  url?: string;\n};\n\nexport const File = ({\n  deleteAccessibleLabel,\n  name,\n  onClick,\n  onDelete,\n  ref,\n  subtitle,\n  url,\n}: FileProps) => {\n  const extensionIndex = name.lastIndexOf('.');\n  const hasExtension = extensionIndex > 0 && extensionIndex < name.length - 1;\n  const fileName = hasExtension ? name.slice(0, extensionIndex) : name;\n  const extension = hasExtension ? name.slice(extensionIndex) : '';\n  const documentIconName = documentIconNames[extension.toLowerCase()] ?? 'FileText';\n  const content = (\n    <>\n      <Figure>\n        <Icon\n          name={documentIconName}\n        />\n      </Figure>\n      <span className={styles.details}>\n        <span className={styles['name-line']}>\n          <span className={styles.name}>{fileName}</span>\n          {extension && <span className={styles.extension}>{extension}</span>}\n        </span>\n        {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n      </span>\n    </>\n  );\n\n  return (\n    <div\n      className={styles.file}\n      ref={ref}\n    >\n      {url ? (\n        <a\n          className={styles.action}\n          href={url}\n          onClick={(event) => {\n            event.stopPropagation();\n\n            if (onClick) {\n              event.preventDefault();\n              onClick();\n            }\n          }}\n          title={name}\n        >\n          {content}\n        </a>\n      ) : onClick ? (\n        <button\n          aria-label={name}\n          className={styles.action}\n          data-actionable='true'\n          onClick={(event) => {\n            event.stopPropagation();\n            onClick();\n          }}\n          title={name}\n          type='button'\n        >\n          {content}\n        </button>\n      ) : (\n        <div\n          className={styles.action}\n          title={name}\n        >\n          {content}\n        </div>\n      )}\n      {onDelete && (\n        <Button\n          aria-label={deleteAccessibleLabel ?? `Delete ${name}`}\n          className={styles.delete}\n          onClick={() => onDelete()}\n          variant='simple'\n        >\n          <Icon\n            name='Trash'\n            size='small'\n          />\n        </Button>\n      )}\n    </div>\n  );\n};\n"],"names":["documentIconNames","File","deleteAccessibleLabel","name","onClick","onDelete","ref","subtitle","url","extensionIndex","lastIndexOf","hasExtension","length","fileName","slice","extension","documentIconName","toLowerCase","content","jsxs","Fragment","jsx","Figure","Icon","styles","details","file","action","event","stopPropagation","preventDefault","Button","delete"],"mappings":"6cAMMA,EAA8C,CAClD,OAAQ,UACR,QAAS,UACT,OAAQ,UACR,OAAQ,UACR,QAAS,UACT,OAAQ,UACR,QAAS,SACX,EAWaC,EAAOA,CAAC,CACnBC,sBAAAA,EACAC,KAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,IAAAA,EACAC,SAAAA,EACAC,IAAAA,CACS,IAAM,CACf,MAAMC,EAAiBN,EAAKO,YAAY,GAAG,EACrCC,EAAeF,EAAiB,GAAKA,EAAiBN,EAAKS,OAAS,EACpEC,EAAWF,EAAeR,EAAKW,MAAM,EAAGL,CAAc,EAAIN,EAC1DY,EAAYJ,EAAeR,EAAKW,MAAML,CAAc,EAAI,GACxDO,EAAmBhB,EAAkBe,EAAUE,YAAAA,CAAa,GAAK,WACjEC,EACJC,EAAAA,KAAAC,EAAAA,SAAA,CACE,SAAA,CAAAC,MAACC,EAAAA,OAAA,CACC,SAAAD,EAAAA,IAACE,EAAAA,KAAA,CACC,KAAMP,EAAiB,EAE3B,EACAG,EAAAA,KAAC,OAAA,CAAK,UAAWK,EAAOC,QACtB,SAAA,CAAAN,EAAAA,KAAC,OAAA,CAAK,UAAWK,EAAO,WAAW,EACjC,SAAA,CAAAH,EAAAA,IAAC,OAAA,CAAK,UAAWG,EAAOrB,KAAOU,SAAAA,EAAS,EACvCE,GAAaM,EAAAA,IAAC,OAAA,CAAK,UAAWG,EAAOT,UAAYA,SAAAA,CAAAA,CAAU,CAAA,EAC9D,EACCR,GAAYc,EAAAA,IAAC,OAAA,CAAK,UAAWG,EAAOjB,SAAWA,SAAAA,CAAAA,CAAS,CAAA,CAAA,CAC3D,CAAA,EACF,EAGF,cACG,MAAA,CACC,UAAWiB,EAAOE,KAClB,IAAApB,EAAS,iBAAA,OAERE,SAAAA,CAAAA,EACCa,EAAAA,IAAC,KACC,UAAWG,EAAOG,OAClB,KAAMnB,EACN,QAAUoB,GAAU,CAClBA,EAAMC,gBAAAA,EAEFzB,IACFwB,EAAME,eAAAA,EACN1B,EAAAA,EAEJ,EACA,MAAOD,EAENe,SAAAA,CAAAA,CACH,EACEd,EACFiB,EAAAA,IAAC,SAAA,CACC,aAAYlB,EACZ,UAAWqB,EAAOG,OAClB,kBAAgB,OAChB,QAAUC,GAAU,CAClBA,EAAMC,gBAAAA,EACNzB,EAAAA,CACF,EACA,MAAOD,EACP,KAAK,SAEJe,SAAAA,CAAAA,CACH,EAEAG,EAAAA,IAAC,MAAA,CACC,UAAWG,EAAOG,OAClB,MAAOxB,EAENe,SAAAA,EACH,EAEDb,SACE0B,SAAA,CACC,aAAY7B,GAAyB,UAAUC,CAAI,GACnD,UAAWqB,EAAOQ,OAClB,QAAS,IAAM3B,IACf,QAAQ,SAER,SAAAgB,EAAAA,IAACE,QACC,KAAK,QACL,KAAK,OAAA,CAAO,CAAA,CAEhB,CAAA,EAEJ,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/file/index.tsx"],"sourcesContent":["import { Figure } from '@/components/figure';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { Button } from '../button';\nimport styles from './styles.module.css';\n\nconst documentIconNames: Record<string, IconName> = {\n  '.doc': 'FileDoc',\n  '.docx': 'FileDoc',\n  '.pdf': 'FilePdf',\n  '.ppt': 'FilePpt',\n  '.pptx': 'FilePpt',\n  '.xls': 'FileXls',\n  '.xlsx': 'FileXls',\n};\n\nexport type FileProps = React.ComponentPropsWithRef<'div'> & {\n  deleteAccessibleLabel?: string;\n  name: string;\n  onClick?: () => void;\n  onDelete?: () => void;\n  subtitle?: string;\n  url?: string;\n};\n\nexport const File = ({\n  deleteAccessibleLabel,\n  name,\n  onClick,\n  onDelete,\n  ref,\n  subtitle,\n  url,\n}: FileProps) => {\n  const extensionIndex = name.lastIndexOf('.');\n  const hasExtension = extensionIndex > 0 && extensionIndex < name.length - 1;\n  const fileName = hasExtension ? name.slice(0, extensionIndex) : name;\n  const extension = hasExtension ? name.slice(extensionIndex) : '';\n  const documentIconName = documentIconNames[extension.toLowerCase()] ?? 'FileText';\n  const content = (\n    <>\n      <Figure>\n        <Icon name={documentIconName} />\n      </Figure>\n      <span className={styles.details}>\n        <span className={styles['name-line']}>\n          <span className={styles.name}>{fileName}</span>\n          {extension && <span className={styles.extension}>{extension}</span>}\n        </span>\n        {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n      </span>\n    </>\n  );\n\n  return (\n    <div\n      className={styles.file}\n      ref={ref}\n    >\n      {url ? (\n        <a\n          className={styles.action}\n          href={url}\n          onClick={(event) => {\n            event.stopPropagation();\n\n            if (onClick) {\n              event.preventDefault();\n              onClick();\n            }\n          }}\n          title={name}\n        >\n          {content}\n        </a>\n      ) : onClick ? (\n        <button\n          aria-label={name}\n          className={styles.action}\n          data-actionable='true'\n          onClick={(event) => {\n            event.stopPropagation();\n            onClick();\n          }}\n          title={name}\n          type='button'\n        >\n          {content}\n        </button>\n      ) : (\n        <div\n          className={styles.action}\n          title={name}\n        >\n          {content}\n        </div>\n      )}\n      {onDelete && (\n        <Button\n          aria-label={deleteAccessibleLabel ?? `Delete ${name}`}\n          className={styles.delete}\n          onClick={() => onDelete()}\n          variant='tertiary'\n        >\n          <Icon\n            name='Trash'\n            size='small'\n          />\n        </Button>\n      )}\n    </div>\n  );\n};\n"],"names":["documentIconNames","File","deleteAccessibleLabel","name","onClick","onDelete","ref","subtitle","url","extensionIndex","lastIndexOf","hasExtension","length","fileName","slice","extension","documentIconName","toLowerCase","content","jsxs","Fragment","jsx","Figure","Icon","styles","details","file","action","event","stopPropagation","preventDefault","Button","delete"],"mappings":"6cAMMA,EAA8C,CAClD,OAAQ,UACR,QAAS,UACT,OAAQ,UACR,OAAQ,UACR,QAAS,UACT,OAAQ,UACR,QAAS,SACX,EAWaC,EAAOA,CAAC,CACnBC,sBAAAA,EACAC,KAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,IAAAA,EACAC,SAAAA,EACAC,IAAAA,CACS,IAAM,CACf,MAAMC,EAAiBN,EAAKO,YAAY,GAAG,EACrCC,EAAeF,EAAiB,GAAKA,EAAiBN,EAAKS,OAAS,EACpEC,EAAWF,EAAeR,EAAKW,MAAM,EAAGL,CAAc,EAAIN,EAC1DY,EAAYJ,EAAeR,EAAKW,MAAML,CAAc,EAAI,GACxDO,EAAmBhB,EAAkBe,EAAUE,YAAAA,CAAa,GAAK,WACjEC,EACJC,EAAAA,KAAAC,EAAAA,SAAA,CACE,SAAA,CAAAC,MAACC,EAAAA,OAAA,CACC,SAAAD,EAAAA,IAACE,EAAAA,KAAA,CAAK,KAAMP,EAAiB,EAC/B,EACAG,EAAAA,KAAC,OAAA,CAAK,UAAWK,EAAOC,QACtB,SAAA,CAAAN,EAAAA,KAAC,OAAA,CAAK,UAAWK,EAAO,WAAW,EACjC,SAAA,CAAAH,EAAAA,IAAC,OAAA,CAAK,UAAWG,EAAOrB,KAAOU,SAAAA,EAAS,EACvCE,GAAaM,EAAAA,IAAC,OAAA,CAAK,UAAWG,EAAOT,UAAYA,SAAAA,CAAAA,CAAU,CAAA,EAC9D,EACCR,GAAYc,EAAAA,IAAC,OAAA,CAAK,UAAWG,EAAOjB,SAAWA,SAAAA,CAAAA,CAAS,CAAA,CAAA,CAC3D,CAAA,EACF,EAGF,cACG,MAAA,CACC,UAAWiB,EAAOE,KAClB,IAAApB,EAAS,iBAAA,OAERE,SAAAA,CAAAA,EACCa,EAAAA,IAAC,KACC,UAAWG,EAAOG,OAClB,KAAMnB,EACN,QAAUoB,GAAU,CAClBA,EAAMC,gBAAAA,EAEFzB,IACFwB,EAAME,eAAAA,EACN1B,EAAAA,EAEJ,EACA,MAAOD,EAENe,SAAAA,CAAAA,CACH,EACEd,EACFiB,EAAAA,IAAC,SAAA,CACC,aAAYlB,EACZ,UAAWqB,EAAOG,OAClB,kBAAgB,OAChB,QAAUC,GAAU,CAClBA,EAAMC,gBAAAA,EACNzB,EAAAA,CACF,EACA,MAAOD,EACP,KAAK,SAEJe,SAAAA,CAAAA,CACH,EAEAG,EAAAA,IAAC,MAAA,CACC,UAAWG,EAAOG,OAClB,MAAOxB,EAENe,SAAAA,EACH,EAEDb,SACE0B,SAAA,CACC,aAAY7B,GAAyB,UAAUC,CAAI,GACnD,UAAWqB,EAAOQ,OAClB,QAAS,IAAM3B,IACf,QAAQ,WAER,SAAAgB,EAAAA,IAACE,QACC,KAAK,QACL,KAAK,OAAA,CAAO,CAAA,CAEhB,CAAA,EAEJ,CAEJ"}

package/dist/components/file/index.js

@@ -2,16 +2,16 @@ import { jsxs as a, jsx as t, Fragment as N } from "react/jsx-runtime";
 import { Figure as F } from "../figure/index.js";
 import { Icon as _ } from "../icon/index.js";
 import { Button as b } from "../button/index.js";
-import '../../assets/index43.css';const g = "_file_1427u_1", I = "_action_1427u_14", P = "_details_1427u_62", v = "_name_1427u_69", D = "_extension_1427u_81", j = "_subtitle_1427u_91", n = {
+import '../../assets/index43.css';const g = "_file_1427u_1", I = "_action_1427u_14", P = "_details_1427u_62", v = "_name_1427u_69", y = "_extension_1427u_81", D = "_subtitle_1427u_91", n = {
   file: g,
   action: I,
   delete: "_delete_1427u_15",
   details: P,
   "name-line": "_name-line_1427u_69",
   name: v,
-  extension: D,
-  subtitle: j
-}, y = {
+  extension: y,
+  subtitle: D
+}, j = {
   ".doc": "FileDoc",
   ".docx": "FileDoc",
   ".pdf": "FilePdf",
@@ -28,7 +28,7 @@ import '../../assets/index43.css';const g = "_file_1427u_1", I = "_action_1427u_
   subtitle: d,
   url: m
 }) => {
-  const i = e.lastIndexOf("."), p = i > 0 && i < e.length - 1, f = p ? e.slice(0, i) : e, o = p ? e.slice(i) : "", h = y[o.toLowerCase()] ?? "FileText", c = /* @__PURE__ */ a(N, { children: [
+  const i = e.lastIndexOf("."), p = i > 0 && i < e.length - 1, f = p ? e.slice(0, i) : e, o = p ? e.slice(i) : "", h = j[o.toLowerCase()] ?? "FileText", c = /* @__PURE__ */ a(N, { children: [
     /* @__PURE__ */ t(F, { children: /* @__PURE__ */ t(_, { name: h }) }),
     /* @__PURE__ */ a("span", { className: n.details, children: [
       /* @__PURE__ */ a("span", { className: n["name-line"], children: [
@@ -44,7 +44,7 @@ import '../../assets/index43.css';const g = "_file_1427u_1", I = "_action_1427u_
     }, title: e, children: c }) : s ? /* @__PURE__ */ t("button", { "aria-label": e, className: n.action, "data-actionable": "true", onClick: (l) => {
       l.stopPropagation(), s();
     }, title: e, type: "button", children: c }) : /* @__PURE__ */ t("div", { className: n.action, title: e, children: c }),
-    r && /* @__PURE__ */ t(b, { "aria-label": u ?? `Delete ${e}`, className: n.delete, onClick: () => r(), variant: "simple", children: /* @__PURE__ */ t(_, { name: "Trash", size: "small" }) })
+    r && /* @__PURE__ */ t(b, { "aria-label": u ?? `Delete ${e}`, className: n.delete, onClick: () => r(), variant: "tertiary", children: /* @__PURE__ */ t(_, { name: "Trash", size: "small" }) })
   ] });
 };
 export {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/file/index.tsx"],"sourcesContent":["import { Figure } from '@/components/figure';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { Button } from '../button';\nimport styles from './styles.module.css';\n\nconst documentIconNames: Record<string, IconName> = {\n  '.doc': 'FileDoc',\n  '.docx': 'FileDoc',\n  '.pdf': 'FilePdf',\n  '.ppt': 'FilePpt',\n  '.pptx': 'FilePpt',\n  '.xls': 'FileXls',\n  '.xlsx': 'FileXls',\n};\n\nexport type FileProps = React.ComponentPropsWithRef<'div'> & {\n  deleteAccessibleLabel?: string;\n  name: string;\n  onClick?: () => void;\n  onDelete?: () => void;\n  subtitle?: string;\n  url?: string;\n};\n\nexport const File = ({\n  deleteAccessibleLabel,\n  name,\n  onClick,\n  onDelete,\n  ref,\n  subtitle,\n  url,\n}: FileProps) => {\n  const extensionIndex = name.lastIndexOf('.');\n  const hasExtension = extensionIndex > 0 && extensionIndex < name.length - 1;\n  const fileName = hasExtension ? name.slice(0, extensionIndex) : name;\n  const extension = hasExtension ? name.slice(extensionIndex) : '';\n  const documentIconName = documentIconNames[extension.toLowerCase()] ?? 'FileText';\n  const content = (\n    <>\n      <Figure>\n        <Icon\n          name={documentIconName}\n        />\n      </Figure>\n      <span className={styles.details}>\n        <span className={styles['name-line']}>\n          <span className={styles.name}>{fileName}</span>\n          {extension && <span className={styles.extension}>{extension}</span>}\n        </span>\n        {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n      </span>\n    </>\n  );\n\n  return (\n    <div\n      className={styles.file}\n      ref={ref}\n    >\n      {url ? (\n        <a\n          className={styles.action}\n          href={url}\n          onClick={(event) => {\n            event.stopPropagation();\n\n            if (onClick) {\n              event.preventDefault();\n              onClick();\n            }\n          }}\n          title={name}\n        >\n          {content}\n        </a>\n      ) : onClick ? (\n        <button\n          aria-label={name}\n          className={styles.action}\n          data-actionable='true'\n          onClick={(event) => {\n            event.stopPropagation();\n            onClick();\n          }}\n          title={name}\n          type='button'\n        >\n          {content}\n        </button>\n      ) : (\n        <div\n          className={styles.action}\n          title={name}\n        >\n          {content}\n        </div>\n      )}\n      {onDelete && (\n        <Button\n          aria-label={deleteAccessibleLabel ?? `Delete ${name}`}\n          className={styles.delete}\n          onClick={() => onDelete()}\n          variant='simple'\n        >\n          <Icon\n            name='Trash'\n            size='small'\n          />\n        </Button>\n      )}\n    </div>\n  );\n};\n"],"names":["documentIconNames","File","deleteAccessibleLabel","name","onClick","onDelete","ref","subtitle","url","extensionIndex","lastIndexOf","hasExtension","length","fileName","slice","extension","documentIconName","toLowerCase","content","jsxs","Fragment","jsx","Figure","Icon","styles","details","file","action","event","stopPropagation","preventDefault","Button","delete"],"mappings":";;;;;;;;;;;;;GAMMA,IAA8C;AAAA,EAClD,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SAAS;AACX,GAWaC,IAAOA,CAAC;AAAA,EACnBC,uBAAAA;AAAAA,EACAC,MAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,KAAAA;AACS,MAAM;AACf,QAAMC,IAAiBN,EAAKO,YAAY,GAAG,GACrCC,IAAeF,IAAiB,KAAKA,IAAiBN,EAAKS,SAAS,GACpEC,IAAWF,IAAeR,EAAKW,MAAM,GAAGL,CAAc,IAAIN,GAC1DY,IAAYJ,IAAeR,EAAKW,MAAML,CAAc,IAAI,IACxDO,IAAmBhB,EAAkBe,EAAUE,YAAAA,CAAa,KAAK,YACjEC,IACJ,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EACC,MAAMP,GAAiB,GAE3B;AAAA,IACA,gBAAAG,EAAC,QAAA,EAAK,WAAWK,EAAOC,SACtB,UAAA;AAAA,MAAA,gBAAAN,EAAC,QAAA,EAAK,WAAWK,EAAO,WAAW,GACjC,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAA,EAAK,WAAWG,EAAOrB,MAAOU,UAAAA,GAAS;AAAA,QACvCE,KAAa,gBAAAM,EAAC,QAAA,EAAK,WAAWG,EAAOT,WAAYA,UAAAA,EAAAA,CAAU;AAAA,MAAA,GAC9D;AAAA,MACCR,KAAY,gBAAAc,EAAC,QAAA,EAAK,WAAWG,EAAOjB,UAAWA,UAAAA,EAAAA,CAAS;AAAA,IAAA,EAAA,CAC3D;AAAA,EAAA,GACF;AAGF,2BACG,OAAA,EACC,WAAWiB,EAAOE,MAClB,KAAApB,GAAS,kBAAA,QAERE,UAAAA;AAAAA,IAAAA,IACC,gBAAAa,EAAC,OACC,WAAWG,EAAOG,QAClB,MAAMnB,GACN,SAAUoB,CAAAA,MAAU;AAClBA,MAAAA,EAAMC,gBAAAA,GAEFzB,MACFwB,EAAME,eAAAA,GACN1B,EAAAA;AAAAA,IAEJ,GACA,OAAOD,GAENe,UAAAA,EAAAA,CACH,IACEd,IACF,gBAAAiB,EAAC,UAAA,EACC,cAAYlB,GACZ,WAAWqB,EAAOG,QAClB,mBAAgB,QAChB,SAAUC,CAAAA,MAAU;AAClBA,MAAAA,EAAMC,gBAAAA,GACNzB,EAAAA;AAAAA,IACF,GACA,OAAOD,GACP,MAAK,UAEJe,UAAAA,EAAAA,CACH,IAEA,gBAAAG,EAAC,OAAA,EACC,WAAWG,EAAOG,QAClB,OAAOxB,GAENe,UAAAA,GACH;AAAA,IAEDb,uBACE0B,GAAA,EACC,cAAY7B,KAAyB,UAAUC,CAAI,IACnD,WAAWqB,EAAOQ,QAClB,SAAS,MAAM3B,KACf,SAAQ,UAER,UAAA,gBAAAgB,EAACE,KACC,MAAK,SACL,MAAK,QAAA,CAAO,EAAA,CAEhB;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/file/index.tsx"],"sourcesContent":["import { Figure } from '@/components/figure';\nimport { Icon, type IconName } from '@/components/icon';\n\nimport { Button } from '../button';\nimport styles from './styles.module.css';\n\nconst documentIconNames: Record<string, IconName> = {\n  '.doc': 'FileDoc',\n  '.docx': 'FileDoc',\n  '.pdf': 'FilePdf',\n  '.ppt': 'FilePpt',\n  '.pptx': 'FilePpt',\n  '.xls': 'FileXls',\n  '.xlsx': 'FileXls',\n};\n\nexport type FileProps = React.ComponentPropsWithRef<'div'> & {\n  deleteAccessibleLabel?: string;\n  name: string;\n  onClick?: () => void;\n  onDelete?: () => void;\n  subtitle?: string;\n  url?: string;\n};\n\nexport const File = ({\n  deleteAccessibleLabel,\n  name,\n  onClick,\n  onDelete,\n  ref,\n  subtitle,\n  url,\n}: FileProps) => {\n  const extensionIndex = name.lastIndexOf('.');\n  const hasExtension = extensionIndex > 0 && extensionIndex < name.length - 1;\n  const fileName = hasExtension ? name.slice(0, extensionIndex) : name;\n  const extension = hasExtension ? name.slice(extensionIndex) : '';\n  const documentIconName = documentIconNames[extension.toLowerCase()] ?? 'FileText';\n  const content = (\n    <>\n      <Figure>\n        <Icon name={documentIconName} />\n      </Figure>\n      <span className={styles.details}>\n        <span className={styles['name-line']}>\n          <span className={styles.name}>{fileName}</span>\n          {extension && <span className={styles.extension}>{extension}</span>}\n        </span>\n        {subtitle && <span className={styles.subtitle}>{subtitle}</span>}\n      </span>\n    </>\n  );\n\n  return (\n    <div\n      className={styles.file}\n      ref={ref}\n    >\n      {url ? (\n        <a\n          className={styles.action}\n          href={url}\n          onClick={(event) => {\n            event.stopPropagation();\n\n            if (onClick) {\n              event.preventDefault();\n              onClick();\n            }\n          }}\n          title={name}\n        >\n          {content}\n        </a>\n      ) : onClick ? (\n        <button\n          aria-label={name}\n          className={styles.action}\n          data-actionable='true'\n          onClick={(event) => {\n            event.stopPropagation();\n            onClick();\n          }}\n          title={name}\n          type='button'\n        >\n          {content}\n        </button>\n      ) : (\n        <div\n          className={styles.action}\n          title={name}\n        >\n          {content}\n        </div>\n      )}\n      {onDelete && (\n        <Button\n          aria-label={deleteAccessibleLabel ?? `Delete ${name}`}\n          className={styles.delete}\n          onClick={() => onDelete()}\n          variant='tertiary'\n        >\n          <Icon\n            name='Trash'\n            size='small'\n          />\n        </Button>\n      )}\n    </div>\n  );\n};\n"],"names":["documentIconNames","File","deleteAccessibleLabel","name","onClick","onDelete","ref","subtitle","url","extensionIndex","lastIndexOf","hasExtension","length","fileName","slice","extension","documentIconName","toLowerCase","content","jsxs","Fragment","jsx","Figure","Icon","styles","details","file","action","event","stopPropagation","preventDefault","Button","delete"],"mappings":";;;;;;;;;;;;;GAMMA,IAA8C;AAAA,EAClD,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SAAS;AACX,GAWaC,IAAOA,CAAC;AAAA,EACnBC,uBAAAA;AAAAA,EACAC,MAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,KAAAA;AACS,MAAM;AACf,QAAMC,IAAiBN,EAAKO,YAAY,GAAG,GACrCC,IAAeF,IAAiB,KAAKA,IAAiBN,EAAKS,SAAS,GACpEC,IAAWF,IAAeR,EAAKW,MAAM,GAAGL,CAAc,IAAIN,GAC1DY,IAAYJ,IAAeR,EAAKW,MAAML,CAAc,IAAI,IACxDO,IAAmBhB,EAAkBe,EAAUE,YAAAA,CAAa,KAAK,YACjEC,IACJ,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAK,MAAMP,GAAiB,GAC/B;AAAA,IACA,gBAAAG,EAAC,QAAA,EAAK,WAAWK,EAAOC,SACtB,UAAA;AAAA,MAAA,gBAAAN,EAAC,QAAA,EAAK,WAAWK,EAAO,WAAW,GACjC,UAAA;AAAA,QAAA,gBAAAH,EAAC,QAAA,EAAK,WAAWG,EAAOrB,MAAOU,UAAAA,GAAS;AAAA,QACvCE,KAAa,gBAAAM,EAAC,QAAA,EAAK,WAAWG,EAAOT,WAAYA,UAAAA,EAAAA,CAAU;AAAA,MAAA,GAC9D;AAAA,MACCR,KAAY,gBAAAc,EAAC,QAAA,EAAK,WAAWG,EAAOjB,UAAWA,UAAAA,EAAAA,CAAS;AAAA,IAAA,EAAA,CAC3D;AAAA,EAAA,GACF;AAGF,2BACG,OAAA,EACC,WAAWiB,EAAOE,MAClB,KAAApB,GAAS,kBAAA,QAERE,UAAAA;AAAAA,IAAAA,IACC,gBAAAa,EAAC,OACC,WAAWG,EAAOG,QAClB,MAAMnB,GACN,SAAUoB,CAAAA,MAAU;AAClBA,MAAAA,EAAMC,gBAAAA,GAEFzB,MACFwB,EAAME,eAAAA,GACN1B,EAAAA;AAAAA,IAEJ,GACA,OAAOD,GAENe,UAAAA,EAAAA,CACH,IACEd,IACF,gBAAAiB,EAAC,UAAA,EACC,cAAYlB,GACZ,WAAWqB,EAAOG,QAClB,mBAAgB,QAChB,SAAUC,CAAAA,MAAU;AAClBA,MAAAA,EAAMC,gBAAAA,GACNzB,EAAAA;AAAAA,IACF,GACA,OAAOD,GACP,MAAK,UAEJe,UAAAA,EAAAA,CACH,IAEA,gBAAAG,EAAC,OAAA,EACC,WAAWG,EAAOG,QAClB,OAAOxB,GAENe,UAAAA,GACH;AAAA,IAEDb,uBACE0B,GAAA,EACC,cAAY7B,KAAyB,UAAUC,CAAI,IACnD,WAAWqB,EAAOQ,QAClB,SAAS,MAAM3B,KACf,SAAQ,YAER,UAAA,gBAAAgB,EAACE,KACC,MAAK,SACL,MAAK,QAAA,CAAO,EAAA,CAEhB;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/icon/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index44.css');const i=require("react/jsx-runtime"),g=require("../../classix-5H4IWnMA.cjs"),r=require("../../icons-DPSOZZAy.cjs"),l="_icon_1dkgk_1",d="_small_1dkgk_10",m="_medium_1dkgk_15",_="_large_1dkgk_20",k="_danger_1dkgk_25",e={icon:l,small:d,medium:m,large:_,danger:k,"gap-right":"_gap-right_1dkgk_29","gap-left":"_gap-left_1dkgk_33"},u={large:e.large,medium:e.medium,small:e.small},p={danger:e.danger},y=({gap:n="none",name:o,size:t="medium",variant:s,weight:a})=>{const c={maskImage:r.iconSVG(o,void 0,a)};return i.jsx("span",{"aria-hidden":"true",className:g.t(n!=="none"&&e[`gap-${n}`],u[t],e.icon,s&&p[s]),style:c,"data-component":"icon"})};exports.Icon=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index44.css');const i=require("react/jsx-runtime"),g=require("../../classix-5H4IWnMA.cjs"),r=require("../../icons-DTP9D75O.cjs"),l="_icon_1dkgk_1",d="_small_1dkgk_10",m="_medium_1dkgk_15",_="_large_1dkgk_20",k="_danger_1dkgk_25",e={icon:l,small:d,medium:m,large:_,danger:k,"gap-right":"_gap-right_1dkgk_29","gap-left":"_gap-left_1dkgk_33"},u={large:e.large,medium:e.medium,small:e.small},p={danger:e.danger},y=({gap:n="none",name:o,size:t="medium",variant:s,weight:a})=>{const c={maskImage:r.iconSVG(o,void 0,a)};return i.jsx("span",{"aria-hidden":"true",className:g.t(n!=="none"&&e[`gap-${n}`],u[t],e.icon,s&&p[s]),style:c,"data-component":"icon"})};exports.Icon=y;
 //# sourceMappingURL=index.cjs.map

package/dist/components/icon/index.js

@@ -1,6 +1,6 @@
 import { jsx as g } from "react/jsx-runtime";
 import { t as i } from "../../classix-DG18itHa.js";
-import { i as r } from "../../icons-D5KQxBn7.js";
+import { i as r } from "../../icons-BpYV3Qdj.js";
 import '../../assets/index44.css';const d = "_icon_1dkgk_1", l = "_small_1dkgk_10", _ = "_medium_1dkgk_15", c = "_large_1dkgk_20", k = "_danger_1dkgk_25", n = {
   icon: d,
   small: l,

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-DPSOZZAy.cjs");require("../../use-touched-Bq5Gjbpz.cjs");const e=require("../../index-CoUj6S0o.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-DTP9D75O.cjs");require("../../use-touched-Bq5Gjbpz.cjs");const e=require("../../index-CfdjkXVw.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-D5KQxBn7.js";
+import "../../icons-BpYV3Qdj.js";
 import "../../use-touched-B999bBr8.js";
-import { I as a } from "../../index-KbL6DkMp.js";
+import { I as a } from "../../index-C9_dM53L.js";
 export {
   a as Input
 };

package/dist/components/list/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index47.css');const r=require("react/jsx-runtime"),N=require("../../classix-5H4IWnMA.cjs"),l=require("react");function g(t){return l.isValidElement(t)&&t.type===l.Fragment}function w(t,e=[]){return l.Children.forEach(t,n=>{g(n)?w(n.props.children,e):e.push(n)}),e}function x(t,{wrapper:e="li"}={}){return w(t).filter(s=>s!==null).map((s,i)=>{if(l.isValidElement(s)&&s.type===e)return s;const c=l.isValidElement(s)&&s.key!=null?s.key:i;return l.createElement(e,{key:c},s)})}const d="_controls_1ywr2_1",z="_horizontal_1ywr2_6",F="_list_1ywr2_17",V="_columns_1ywr2_53",b="_compact_1ywr2_70",o={controls:d,horizontal:z,list:F,columns:V,compact:b},j=(t,e)=>{typeof t=="function"?t(e):t&&(t.current=e)};function k({children:t,className:e,columns:n=1,compact:u=!1,controls:s,horizontal:i,ordered:c,ref:m,style:E,...f}){const y=Number.isFinite(n)?Math.max(1,Math.floor(n)):1,_=N.t(e,o.list,y>1&&o.columns,i&&o.horizontal,u&&o.compact),p={...E,"--list-columns":y},h=c?r.jsx("ol",{className:_,ref:a=>j(m,a),style:p,...f,children:x(t)}):r.jsx("ul",{className:_,ref:a=>j(m,a),style:p,...f,children:x(t)});return s==null?h:r.jsxs(r.Fragment,{children:[r.jsx("div",{className:o.controls,children:s}),h]})}exports.List=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index47.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;
 //# sourceMappingURL=index.cjs.map

package/dist/components/list/index.js

@@ -1,57 +1,57 @@
-import { jsx as a, jsxs as z, Fragment as F } from "react/jsx-runtime";
-import { t as V } from "../../classix-DG18itHa.js";
+import { jsx as a, jsxs as F, Fragment as V } from "react/jsx-runtime";
+import { t as d } from "../../classix-DG18itHa.js";
 import e from "react";
-import '../../assets/index47.css';function d(t) {
+import '../../assets/index47.css';function g(t) {
   return e.isValidElement(t) && t.type === e.Fragment;
 }
-function N(t, s = []) {
-  return e.Children.forEach(t, (l) => {
-    d(l) ? N(l.props.children, s) : s.push(l);
-  }), s;
+function x(t, n = []) {
+  return e.Children.forEach(t, (s) => {
+    g(s) ? x(s.props.children, n) : n.push(s);
+  }), n;
 }
-function w(t, {
-  wrapper: s = "li"
+function E(t, {
+  wrapper: n = "li"
 } = {}) {
-  return N(t).filter((n) => n !== null).map((n, r) => {
-    if (e.isValidElement(n) && n.type === s)
-      return n;
-    const i = e.isValidElement(n) && n.key != null ? n.key : r;
-    return e.createElement(s, {
-      key: i
-    }, n);
+  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);
   });
 }
-const g = "_controls_1ywr2_1", k = "_horizontal_1ywr2_6", C = "_list_1ywr2_17", j = "_columns_1ywr2_53", v = "_compact_1ywr2_70", o = {
-  controls: g,
-  horizontal: k,
-  list: C,
-  columns: j,
-  compact: v
-}, E = (t, s) => {
-  typeof t == "function" ? t(s) : t && (t.current = s);
+const k = "_controls_1i7ll_1", C = "_horizontal_1i7ll_6", j = "_list_1i7ll_17", v = "_columns_1i7ll_57", L = "_compact_1i7ll_74", o = {
+  controls: k,
+  horizontal: C,
+  list: j,
+  columns: v,
+  compact: L
+}, N = (t, n) => {
+  typeof t == "function" ? t(n) : t && (t.current = n);
 };
-function b({
+function w({
   children: t,
-  className: s,
-  columns: l = 1,
+  className: n,
+  columns: s = 1,
   compact: m = !1,
-  controls: n,
-  horizontal: r,
-  ordered: i,
+  controls: l,
+  horizontal: i,
+  ordered: r,
   ref: u,
-  style: x,
+  style: z,
   ...f
 }) {
-  const _ = Number.isFinite(l) ? Math.max(1, Math.floor(l)) : 1, y = V(s, o.list, _ > 1 && o.columns, r && o.horizontal, m && o.compact), p = {
-    ...x,
+  const _ = Number.isFinite(s) ? Math.max(1, Math.floor(s)) : 1, p = d(n, o.list, _ > 1 && o.columns, i && o.horizontal, m && o.compact), y = {
+    ...z,
     "--list-columns": _
-  }, h = i ? /* @__PURE__ */ a("ol", { className: y, ref: (c) => E(u, c), style: p, ...f, children: w(t) }) : /* @__PURE__ */ a("ul", { className: y, ref: (c) => E(u, c), style: p, ...f, children: w(t) });
-  return n == null ? h : /* @__PURE__ */ z(F, { children: [
-    /* @__PURE__ */ a("div", { className: o.controls, children: n }),
+  }, 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
   ] });
 }
 export {
-  b as List
+  w as List
 };
 //# sourceMappingURL=index.js.map

package/dist/components/loading/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index48.css');const t=require("react/jsx-runtime"),i=require("../../classix-5H4IWnMA.cjs"),e="_loading_1csd4_23",l="_spin_1csd4_1",_="_ping_1csd4_39",r="_sticky_1csd4_65",n={loading:e,default:"_default_1csd4_28",spin:l,ping:_,sticky:r},g=({variant:o="default",size:s,sticky:c=!1,...d})=>{const a={"--border-size":s?s/8+"px":void 0,"--size":s?s+"px":void 0};return t.jsx("div",{className:i.t(n.loading,c&&n.sticky),"data-component":"loading",children:t.jsx("span",{className:i.t(n.loading,n[o]),style:a,...d})})};exports.Loading=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index48.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.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/loading/index.tsx"],"sourcesContent":["import { cx } from 'classix';\n\nimport styles from './styles.module.css';\n\nexport type LoadingProps = {\n  size?: number;\n  sticky?: boolean;\n  variant?: 'default' | 'ping';\n};\n\nexport const Loading = ({ variant = 'default', size, sticky = false, ...props }: LoadingProps) => {\n  type withVars = React.CSSProperties & {\n    '--border-size'?: string;\n    '--size'?: string;\n  };\n\n  const withVars: withVars = {\n    '--border-size': size ? size / 8 + 'px' : undefined,\n    '--size': size ? size + 'px' : undefined,\n  };\n\n  return (\n    <div className={cx(styles.loading, sticky && styles.sticky)}>\n      <span\n        className={cx(styles.loading, styles[variant])}\n        style={withVars}\n        {...props}\n      />\n    </div>\n  );\n};\n"],"names":["Loading","variant","size","sticky","props","withVars","undefined","jsx","cx","styles","loading"],"mappings":"8SAUaA,EAAUA,CAAC,CAAEC,QAAAA,EAAU,UAAWC,KAAAA,EAAMC,OAAAA,EAAS,GAAO,GAAGC,CAAoB,IAAM,CAMhG,MAAMC,EAAqB,CACzB,gBAAiBH,EAAOA,EAAO,EAAI,KAAOI,OAC1C,SAAUJ,EAAOA,EAAO,KAAOI,MAAAA,EAGjC,OACEC,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAAA,EAAGC,EAAOC,QAASP,GAAUM,EAAON,MAAM,EAAE,iBAAA,UAC1D,SAAAI,MAAC,QACC,UAAWC,EAAAA,EAAGC,EAAOC,QAASD,EAAOR,CAAO,CAAC,EAC7C,MAAOI,EACP,GAAID,CAAAA,CAAM,CAAA,CAEd,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/loading/index.tsx"],"sourcesContent":["import { cx } from 'classix';\n\nimport styles from './styles.module.css';\n\nconst sizes = {\n  large: styles.large,\n  medium: styles.medium,\n  small: styles.small,\n};\n\nexport type LoadingProps = {\n  size?: keyof typeof sizes;\n  sticky?: boolean;\n  variant?: 'default' | 'ping';\n};\n\nexport const Loading = ({\n  variant = 'default',\n  size = 'medium',\n  sticky = false,\n  ...props\n}: LoadingProps) => {\n  return (\n    <div className={cx(styles.loading, sticky && styles.sticky)}>\n      <span\n        className={cx(styles.loading, styles[variant], sizes[size])}\n        {...props}\n      />\n    </div>\n  );\n};\n"],"names":["sizes","large","styles","medium","small","Loading","variant","size","sticky","props","jsx","cx","loading"],"mappings":"sWAIMA,EAAQ,CACZC,MAAOC,EAAOD,MACdE,OAAQD,EAAOC,OACfC,MAAOF,EAAOE,KAChB,EAQaC,EAAUA,CAAC,CACtBC,QAAAA,EAAU,UACVC,KAAAA,EAAO,SACPC,OAAAA,EAAS,GACT,GAAGC,CACS,IAEVC,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAAA,EAAGT,EAAOU,QAASJ,GAAUN,EAAOM,MAAM,EAAE,iBAAA,UAC1D,SAAAE,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAAA,EAAGT,EAAOU,QAASV,EAAOI,CAAO,EAAGN,EAAMO,CAAI,CAAC,EAC1D,GAAIE,CAAAA,CAAM,CAAA,CAEd"}

package/dist/components/loading/index.js

@@ -1,24 +1,24 @@
-import { jsx as o } from "react/jsx-runtime";
-import { t } from "../../classix-DG18itHa.js";
-import '../../assets/index48.css';const l = "_loading_1csd4_23", _ = "_spin_1csd4_1", p = "_ping_1csd4_39", e = "_sticky_1csd4_65", n = {
-  loading: l,
-  default: "_default_1csd4_28",
+import { jsx as l } from "react/jsx-runtime";
+import { t as a } from "../../classix-DG18itHa.js";
+import '../../assets/index48.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: _,
-  ping: p,
-  sticky: e
-}, m = ({
-  variant: i = "default",
-  size: s,
-  sticky: d = !1,
-  ...c
-}) => {
-  const a = {
-    "--border-size": s ? s / 8 + "px" : void 0,
-    "--size": s ? s + "px" : void 0
-  };
-  return /* @__PURE__ */ o("div", { className: t(n.loading, d && n.sticky), "data-component": "loading", children: /* @__PURE__ */ o("span", { className: t(n.loading, n[i]), style: a, ...c }) });
-};
+  small: e,
+  large: r,
+  ping: c,
+  sticky: d
+}, g = {
+  large: s.large,
+  medium: s.medium,
+  small: s.small
+}, f = ({
+  variant: n = "default",
+  size: i = "medium",
+  sticky: m = !1,
+  ...t
+}) => /* @__PURE__ */ l("div", { className: a(s.loading, m && s.sticky), "data-component": "loading", children: /* @__PURE__ */ l("span", { className: a(s.loading, s[n], g[i]), ...t }) });
 export {
-  m as Loading
+  f as Loading
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/loading/index.tsx"],"sourcesContent":["import { cx } from 'classix';\n\nimport styles from './styles.module.css';\n\nexport type LoadingProps = {\n  size?: number;\n  sticky?: boolean;\n  variant?: 'default' | 'ping';\n};\n\nexport const Loading = ({ variant = 'default', size, sticky = false, ...props }: LoadingProps) => {\n  type withVars = React.CSSProperties & {\n    '--border-size'?: string;\n    '--size'?: string;\n  };\n\n  const withVars: withVars = {\n    '--border-size': size ? size / 8 + 'px' : undefined,\n    '--size': size ? size + 'px' : undefined,\n  };\n\n  return (\n    <div className={cx(styles.loading, sticky && styles.sticky)}>\n      <span\n        className={cx(styles.loading, styles[variant])}\n        style={withVars}\n        {...props}\n      />\n    </div>\n  );\n};\n"],"names":["Loading","variant","size","sticky","props","withVars","undefined","jsx","cx","styles","loading"],"mappings":";;;;;;;;GAUaA,IAAUA,CAAC;AAAA,EAAEC,SAAAA,IAAU;AAAA,EAAWC,MAAAA;AAAAA,EAAMC,QAAAA,IAAS;AAAA,EAAO,GAAGC;AAAoB,MAAM;AAMhG,QAAMC,IAAqB;AAAA,IACzB,iBAAiBH,IAAOA,IAAO,IAAI,OAAOI;AAAAA,IAC1C,UAAUJ,IAAOA,IAAO,OAAOI;AAAAA,EAAAA;AAGjC,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAGC,EAAOC,SAASP,KAAUM,EAAON,MAAM,GAAE,kBAAA,WAC1D,UAAA,gBAAAI,EAAC,UACC,WAAWC,EAAGC,EAAOC,SAASD,EAAOR,CAAO,CAAC,GAC7C,OAAOI,GACP,GAAID,EAAAA,CAAM,EAAA,CAEd;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/loading/index.tsx"],"sourcesContent":["import { cx } from 'classix';\n\nimport styles from './styles.module.css';\n\nconst sizes = {\n  large: styles.large,\n  medium: styles.medium,\n  small: styles.small,\n};\n\nexport type LoadingProps = {\n  size?: keyof typeof sizes;\n  sticky?: boolean;\n  variant?: 'default' | 'ping';\n};\n\nexport const Loading = ({\n  variant = 'default',\n  size = 'medium',\n  sticky = false,\n  ...props\n}: LoadingProps) => {\n  return (\n    <div className={cx(styles.loading, sticky && styles.sticky)}>\n      <span\n        className={cx(styles.loading, styles[variant], sizes[size])}\n        {...props}\n      />\n    </div>\n  );\n};\n"],"names":["sizes","large","styles","medium","small","Loading","variant","size","sticky","props","jsx","cx","loading"],"mappings":";;;;;;;;;;GAIMA,IAAQ;AAAA,EACZC,OAAOC,EAAOD;AAAAA,EACdE,QAAQD,EAAOC;AAAAA,EACfC,OAAOF,EAAOE;AAChB,GAQaC,IAAUA,CAAC;AAAA,EACtBC,SAAAA,IAAU;AAAA,EACVC,MAAAA,IAAO;AAAA,EACPC,QAAAA,IAAS;AAAA,EACT,GAAGC;AACS,MAEV,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAGT,EAAOU,SAASJ,KAAUN,EAAOM,MAAM,GAAE,kBAAA,WAC1D,UAAA,gBAAAE,EAAC,QAAA,EACC,WAAWC,EAAGT,EAAOU,SAASV,EAAOI,CAAO,GAAGN,EAAMO,CAAI,CAAC,GAC1D,GAAIE,EAAAA,CAAM,EAAA,CAEd;"}

package/dist/components/messages/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index13.css');const r=require("react/jsx-runtime"),A=require("../../classix-5H4IWnMA.cjs"),n=require("react"),D=require("../editor/index.cjs"),G=require("../list/index.cjs"),I=require("../tooltip/index.cjs"),J=require("../message/index.cjs"),K="_messages_pqp89_1",Q="_fill_pqp89_20",j={messages:K,fill:Q},V=({fill:M=!1,files:u,handleUpload:S,inlineImages:c,maxEditorRows:y=5,message:d="",messages:l,minEditorRows:b=1,onChange:Y,onFilesChange:a,onInlineImagesChange:H,onSubmit:B,placeholder:N,sending:O,tooltipLabel:m})=>{var g;const f=n.useRef(null),o=n.useRef(!0),v=n.useRef(!1),[P,U]=n.useState([]),h=u??P,p=(g=l[l.length-1])==null?void 0:g.id,W=d.replace(/<[^>]*>/g,"").replace(/&nbsp;/g," ").trim()==="";return n.useLayoutEffect(()=>{var w;const e=(w=f.current)==null?void 0:w.querySelector("[data-message-list]");if(!e||p===void 0)return;const k=e.scrollHeight-e.scrollTop-e.clientHeight<450,L=!v.current||k;o.current=L,v.current=!0;const z=window.setTimeout(()=>{o.current=!1},5e3),_=()=>{e.scrollTop=e.scrollHeight};L&&_();const E=t=>{o.current&&t.target instanceof HTMLImageElement&&_()},T=t=>{t.deltaY<0&&(o.current=!1)};let i;const q=t=>{var s;i=(s=t.touches[0])==null?void 0:s.clientY},x=t=>{var R;const s=(R=t.touches[0])==null?void 0:R.clientY;s!==void 0&&i!==void 0&&s>i&&(o.current=!1),i=s};return e.addEventListener("load",E,!0),e.addEventListener("wheel",T,{passive:!0}),e.addEventListener("touchstart",q,{passive:!0}),e.addEventListener("touchmove",x,{passive:!0}),()=>{window.clearTimeout(z),e.removeEventListener("load",E,!0),e.removeEventListener("wheel",T),e.removeEventListener("touchstart",q),e.removeEventListener("touchmove",x)}},[p]),r.jsxs("div",{className:A.t(j.messages,M&&j.fill),"data-component":"messages",ref:f,children:[r.jsx(G.List,{"data-message-list":!0,children:l.map(e=>r.jsx(J.Message,{...e},e.id))}),m&&r.jsx(I.Tooltip,{variant:"static",children:m}),r.jsx(D.Editor,{autofocus:!0,content:d,disabled:O||W&&h.length===0&&!(c!=null&&c.length),files:h,inlineImages:c,maxRows:y,minRows:b,onChange:Y,onFilesChange:e=>{u===void 0&&U(e),a==null||a(e)},onInlineImagesChange:H,onSubmit:B,onUpload:S,placeholder:N,submitLabel:"Send message"})]})};exports.Messages=V;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index13.css');const r=require("react/jsx-runtime"),D=require("../../classix-5H4IWnMA.cjs"),n=require("react"),G=require("../editor/index.cjs"),I=require("../list/index.cjs"),J=require("../tooltip/index.cjs"),K=require("../message/index.cjs"),Q="_messages_pqp89_1",V="_fill_pqp89_20",j={messages:Q,fill:V},X=({fill:M=!1,files:u,handleUpload:y,inlineImages:c,maxEditorRows:Y=5,message:d="",messages:l,minEditorRows:b=1,onChange:H,onFilesChange:a,onInlineImagesChange:B,onSubmit:N,placeholder:O,sending:m,submitLabel:P="Send message",tooltipLabel:f})=>{var L;const v=n.useRef(null),o=n.useRef(!0),h=n.useRef(!1),[U,W]=n.useState([]),p=u??U,g=(L=l[l.length-1])==null?void 0:L.id,k=d.replace(/<[^>]*>/g,"").replace(/&nbsp;/g," ").trim()==="";return n.useLayoutEffect(()=>{var R;const e=(R=v.current)==null?void 0:R.querySelector("[data-message-list]");if(!e||g===void 0)return;const z=e.scrollHeight-e.scrollTop-e.clientHeight<450,_=!h.current||z;o.current=_,h.current=!0;const A=window.setTimeout(()=>{o.current=!1},5e3),E=()=>{e.scrollTop=e.scrollHeight};_&&E();const T=t=>{o.current&&t.target instanceof HTMLImageElement&&E()},q=t=>{t.deltaY<0&&(o.current=!1)};let i;const x=t=>{var s;i=(s=t.touches[0])==null?void 0:s.clientY},w=t=>{var S;const s=(S=t.touches[0])==null?void 0:S.clientY;s!==void 0&&i!==void 0&&s>i&&(o.current=!1),i=s};return e.addEventListener("load",T,!0),e.addEventListener("wheel",q,{passive:!0}),e.addEventListener("touchstart",x,{passive:!0}),e.addEventListener("touchmove",w,{passive:!0}),()=>{window.clearTimeout(A),e.removeEventListener("load",T,!0),e.removeEventListener("wheel",q),e.removeEventListener("touchstart",x),e.removeEventListener("touchmove",w)}},[g]),r.jsxs("div",{className:D.t(j.messages,M&&j.fill),"data-component":"messages",ref:v,children:[r.jsx(I.List,{"data-message-list":!0,children:l.map(e=>r.jsx(K.Message,{...e},e.id))}),f&&r.jsx(J.Tooltip,{variant:"static",children:f}),r.jsx(G.Editor,{autofocus:!0,content:d,disabled:m||k&&p.length===0&&!(c!=null&&c.length),files:p,inlineImages:c,isSubmitting:m,maxRows:Y,minRows:b,onChange:H,onFilesChange:e=>{u===void 0&&W(e),a==null||a(e)},onInlineImagesChange:B,onSubmit:N,onUpload:y,placeholder:O,submitLabel:P})]})};exports.Messages=X;
 //# sourceMappingURL=index.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/messages/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useLayoutEffect, useRef, useState } from 'react';\n\nimport { Editor, type PendingInlineImage } from '@/components/editor';\nimport { List } from '@/components/list';\nimport { Tooltip } from '@/components/tooltip';\n\nimport { Message, type MessageOptions } from '../message';\nimport styles from './styles.module.css';\n\nexport type MessageItem = MessageOptions;\n\nexport type MessagesProps = {\n  fill?: boolean;\n  files?: readonly File[];\n  handleUpload: (files: FileList) => Promise<void> | void;\n  inlineImages?: readonly PendingInlineImage[];\n  maxEditorRows?: number;\n  message: string;\n  messages: MessageItem[];\n  minEditorRows?: number;\n  onChange: (content: string) => void;\n  onFilesChange?: (files: File[]) => void;\n  onInlineImagesChange?: (images: PendingInlineImage[]) => void;\n  onSubmit: () => Promise<void> | void;\n  placeholder?: string;\n  sending: boolean;\n  tooltipLabel?: string;\n};\n\nexport const Messages = ({\n  fill = false,\n  files,\n  handleUpload,\n  inlineImages,\n  maxEditorRows = 5,\n  message = '',\n  messages,\n  minEditorRows = 1,\n  onChange,\n  onFilesChange,\n  onInlineImagesChange,\n  onSubmit,\n  placeholder,\n  sending,\n  tooltipLabel,\n}: MessagesProps) => {\n  const messagesRef = useRef<HTMLDivElement>(null);\n  const followImageLoadsRef = useRef(true);\n  const hasLoadedRef = useRef(false);\n  const [internalFiles, setInternalFiles] = useState<File[]>([]);\n  const queuedFiles = files ?? internalFiles;\n  const newestMessageId = messages[messages.length - 1]?.id;\n  const messageIsEmpty =\n    message\n      .replace(/<[^>]*>/g, '')\n      .replace(/&nbsp;/g, ' ')\n      .trim() === '';\n\n  useLayoutEffect(() => {\n    const messageList = messagesRef.current?.querySelector<HTMLElement>('[data-message-list]');\n    if (!messageList || newestMessageId === undefined) return;\n\n    const isNearBottom =\n      messageList.scrollHeight - messageList.scrollTop - messageList.clientHeight <\n      450; /* 🌝 preview image max height plus allowance */\n    const shouldScrollToBottom = !hasLoadedRef.current || isNearBottom;\n\n    followImageLoadsRef.current = shouldScrollToBottom;\n    hasLoadedRef.current = true;\n\n    const timeout = window.setTimeout(() => {\n      followImageLoadsRef.current = false;\n    }, 5000);\n\n    const scrollToBottom = () => {\n      messageList.scrollTop = messageList.scrollHeight;\n    };\n\n    if (shouldScrollToBottom) scrollToBottom();\n\n    const handleLoad = (event: Event) => {\n      if (followImageLoadsRef.current && event.target instanceof HTMLImageElement) {\n        scrollToBottom();\n      }\n    };\n\n    const handleWheel = (event: WheelEvent) => {\n      if (event.deltaY < 0) {\n        followImageLoadsRef.current = false;\n      }\n    };\n\n    let previousTouchY: number | undefined;\n\n    const handleTouchStart = (event: TouchEvent) => {\n      previousTouchY = event.touches[0]?.clientY;\n    };\n\n    const handleTouchMove = (event: TouchEvent) => {\n      const touchY = event.touches[0]?.clientY;\n      if (touchY !== undefined && previousTouchY !== undefined && touchY > previousTouchY) {\n        followImageLoadsRef.current = false;\n      }\n      previousTouchY = touchY;\n    };\n\n    messageList.addEventListener('load', handleLoad, true);\n    messageList.addEventListener('wheel', handleWheel, { passive: true });\n    messageList.addEventListener('touchstart', handleTouchStart, { passive: true });\n    messageList.addEventListener('touchmove', handleTouchMove, { passive: true });\n\n    return () => {\n      window.clearTimeout(timeout);\n      messageList.removeEventListener('load', handleLoad, true);\n      messageList.removeEventListener('wheel', handleWheel);\n      messageList.removeEventListener('touchstart', handleTouchStart);\n      messageList.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [newestMessageId]);\n\n  return (\n    <div\n      className={cx(styles.messages, fill && styles.fill)}\n      data-component='messages'\n      ref={messagesRef}\n    >\n      <List data-message-list>\n        {messages.map((message) => (\n          <Message\n            key={message.id}\n            {...message}\n          />\n        ))}\n      </List>\n      {tooltipLabel && <Tooltip variant='static'>{tooltipLabel}</Tooltip>}\n      <Editor\n        autofocus\n        content={message}\n        disabled={sending || (messageIsEmpty && queuedFiles.length === 0 && !inlineImages?.length)}\n        files={queuedFiles}\n        inlineImages={inlineImages}\n        maxRows={maxEditorRows}\n        minRows={minEditorRows}\n        onChange={onChange}\n        onFilesChange={(nextFiles) => {\n          if (files === undefined) setInternalFiles(nextFiles);\n          onFilesChange?.(nextFiles);\n        }}\n        onInlineImagesChange={onInlineImagesChange}\n        onSubmit={onSubmit}\n        onUpload={handleUpload}\n        placeholder={placeholder}\n        submitLabel='Send message'\n      />\n    </div>\n  );\n};\n"],"names":["Messages","fill","files","handleUpload","inlineImages","maxEditorRows","message","messages","minEditorRows","onChange","onFilesChange","onInlineImagesChange","onSubmit","placeholder","sending","tooltipLabel","messagesRef","useRef","followImageLoadsRef","hasLoadedRef","internalFiles","setInternalFiles","useState","queuedFiles","newestMessageId","length","id","messageIsEmpty","replace","trim","useLayoutEffect","messageList","current","querySelector","undefined","isNearBottom","scrollHeight","scrollTop","clientHeight","shouldScrollToBottom","timeout","window","setTimeout","scrollToBottom","handleLoad","event","target","HTMLImageElement","handleWheel","deltaY","previousTouchY","handleTouchStart","touches","clientY","handleTouchMove","touchY","addEventListener","passive","clearTimeout","removeEventListener","jsxs","cx","styles","jsx","List","map","Message","Tooltip","Editor","nextFiles"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/messages/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useLayoutEffect, useRef, useState } from 'react';\n\nimport { Editor, type PendingInlineImage } from '@/components/editor';\nimport { List } from '@/components/list';\nimport { Tooltip } from '@/components/tooltip';\n\nimport { Message, type MessageOptions } from '../message';\nimport styles from './styles.module.css';\n\nexport type MessageItem = MessageOptions;\n\nexport type MessagesProps = {\n  fill?: boolean;\n  files?: readonly File[];\n  handleUpload: (files: FileList) => Promise<void> | void;\n  inlineImages?: readonly PendingInlineImage[];\n  maxEditorRows?: number;\n  message: string;\n  messages: MessageItem[];\n  minEditorRows?: number;\n  onChange: (content: string) => void;\n  onFilesChange?: (files: File[]) => void;\n  onInlineImagesChange?: (images: PendingInlineImage[]) => void;\n  onSubmit: () => Promise<void> | void;\n  placeholder?: string;\n  sending: boolean;\n  submitLabel?: string;\n  tooltipLabel?: string;\n};\n\nexport const Messages = ({\n  fill = false,\n  files,\n  handleUpload,\n  inlineImages,\n  maxEditorRows = 5,\n  message = '',\n  messages,\n  minEditorRows = 1,\n  onChange,\n  onFilesChange,\n  onInlineImagesChange,\n  onSubmit,\n  placeholder,\n  sending,\n  submitLabel = 'Send message',\n  tooltipLabel,\n}: MessagesProps) => {\n  const messagesRef = useRef<HTMLDivElement>(null);\n  const followImageLoadsRef = useRef(true);\n  const hasLoadedRef = useRef(false);\n  const [internalFiles, setInternalFiles] = useState<File[]>([]);\n  const queuedFiles = files ?? internalFiles;\n  const newestMessageId = messages[messages.length - 1]?.id;\n  const messageIsEmpty =\n    message\n      .replace(/<[^>]*>/g, '')\n      .replace(/&nbsp;/g, ' ')\n      .trim() === '';\n\n  useLayoutEffect(() => {\n    const messageList = messagesRef.current?.querySelector<HTMLElement>('[data-message-list]');\n    if (!messageList || newestMessageId === undefined) return;\n\n    const isNearBottom =\n      messageList.scrollHeight - messageList.scrollTop - messageList.clientHeight <\n      450; /* 🌝 preview image max height plus allowance */\n    const shouldScrollToBottom = !hasLoadedRef.current || isNearBottom;\n\n    followImageLoadsRef.current = shouldScrollToBottom;\n    hasLoadedRef.current = true;\n\n    const timeout = window.setTimeout(() => {\n      followImageLoadsRef.current = false;\n    }, 5000);\n\n    const scrollToBottom = () => {\n      messageList.scrollTop = messageList.scrollHeight;\n    };\n\n    if (shouldScrollToBottom) scrollToBottom();\n\n    const handleLoad = (event: Event) => {\n      if (followImageLoadsRef.current && event.target instanceof HTMLImageElement) {\n        scrollToBottom();\n      }\n    };\n\n    const handleWheel = (event: WheelEvent) => {\n      if (event.deltaY < 0) {\n        followImageLoadsRef.current = false;\n      }\n    };\n\n    let previousTouchY: number | undefined;\n\n    const handleTouchStart = (event: TouchEvent) => {\n      previousTouchY = event.touches[0]?.clientY;\n    };\n\n    const handleTouchMove = (event: TouchEvent) => {\n      const touchY = event.touches[0]?.clientY;\n      if (touchY !== undefined && previousTouchY !== undefined && touchY > previousTouchY) {\n        followImageLoadsRef.current = false;\n      }\n      previousTouchY = touchY;\n    };\n\n    messageList.addEventListener('load', handleLoad, true);\n    messageList.addEventListener('wheel', handleWheel, { passive: true });\n    messageList.addEventListener('touchstart', handleTouchStart, { passive: true });\n    messageList.addEventListener('touchmove', handleTouchMove, { passive: true });\n\n    return () => {\n      window.clearTimeout(timeout);\n      messageList.removeEventListener('load', handleLoad, true);\n      messageList.removeEventListener('wheel', handleWheel);\n      messageList.removeEventListener('touchstart', handleTouchStart);\n      messageList.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [newestMessageId]);\n\n  return (\n    <div\n      className={cx(styles.messages, fill && styles.fill)}\n      data-component='messages'\n      ref={messagesRef}\n    >\n      <List data-message-list>\n        {messages.map((message) => (\n          <Message\n            key={message.id}\n            {...message}\n          />\n        ))}\n      </List>\n      {tooltipLabel && <Tooltip variant='static'>{tooltipLabel}</Tooltip>}\n      <Editor\n        autofocus\n        content={message}\n        disabled={sending || (messageIsEmpty && queuedFiles.length === 0 && !inlineImages?.length)}\n        files={queuedFiles}\n        inlineImages={inlineImages}\n        isSubmitting={sending}\n        maxRows={maxEditorRows}\n        minRows={minEditorRows}\n        onChange={onChange}\n        onFilesChange={(nextFiles) => {\n          if (files === undefined) setInternalFiles(nextFiles);\n          onFilesChange?.(nextFiles);\n        }}\n        onInlineImagesChange={onInlineImagesChange}\n        onSubmit={onSubmit}\n        onUpload={handleUpload}\n        placeholder={placeholder}\n        submitLabel={submitLabel}\n      />\n    </div>\n  );\n};\n"],"names":["Messages","fill","files","handleUpload","inlineImages","maxEditorRows","message","messages","minEditorRows","onChange","onFilesChange","onInlineImagesChange","onSubmit","placeholder","sending","submitLabel","tooltipLabel","messagesRef","useRef","followImageLoadsRef","hasLoadedRef","internalFiles","setInternalFiles","useState","queuedFiles","newestMessageId","length","id","messageIsEmpty","replace","trim","useLayoutEffect","messageList","current","querySelector","undefined","isNearBottom","scrollHeight","scrollTop","clientHeight","shouldScrollToBottom","timeout","window","setTimeout","scrollToBottom","handleLoad","event","target","HTMLImageElement","handleWheel","deltaY","previousTouchY","handleTouchStart","touches","clientY","handleTouchMove","touchY","addEventListener","passive","clearTimeout","removeEventListener","jsxs","cx","styles","jsx","List","map","Message","Tooltip","Editor","nextFiles"],"mappings":"mXA+BaA,EAAWA,CAAC,CACvBC,KAAAA,EAAO,GACPC,MAAAA,EACAC,aAAAA,EACAC,aAAAA,EACAC,cAAAA,EAAgB,EAChBC,QAAAA,EAAU,GACVC,SAAAA,EACAC,cAAAA,EAAgB,EAChBC,SAAAA,EACAC,cAAAA,EACAC,qBAAAA,EACAC,SAAAA,EACAC,YAAAA,EACAC,QAAAA,EACAC,YAAAA,EAAc,eACdC,aAAAA,CACa,IAAM,OACnB,MAAMC,EAAcC,EAAAA,OAAuB,IAAI,EACzCC,EAAsBD,EAAAA,OAAO,EAAI,EACjCE,EAAeF,EAAAA,OAAO,EAAK,EAC3B,CAACG,EAAeC,CAAgB,EAAIC,EAAAA,SAAiB,CAAA,CAAE,EACvDC,EAActB,GAASmB,EACvBI,GAAkBlB,EAAAA,EAASA,EAASmB,OAAS,CAAC,IAA5BnB,YAAAA,EAA+BoB,GACjDC,EACJtB,EACGuB,QAAQ,WAAY,EAAE,EACtBA,QAAQ,UAAW,GAAG,EACtBC,KAAAA,IAAW,GAEhBC,OAAAA,EAAAA,gBAAgB,IAAM,OACpB,MAAMC,GAAcf,EAAAA,EAAYgB,UAAZhB,YAAAA,EAAqBiB,cAA2B,uBACpE,GAAI,CAACF,GAAeP,IAAoBU,OAAW,OAEnD,MAAMC,EACJJ,EAAYK,aAAeL,EAAYM,UAAYN,EAAYO,aAC/D,IACIC,EAAuB,CAACpB,EAAaa,SAAWG,EAEtDjB,EAAoBc,QAAUO,EAC9BpB,EAAaa,QAAU,GAEvB,MAAMQ,EAAUC,OAAOC,WAAW,IAAM,CACtCxB,EAAoBc,QAAU,EAChC,EAAG,GAAI,EAEDW,EAAiBA,IAAM,CAC3BZ,EAAYM,UAAYN,EAAYK,YACtC,EAEIG,GAAsBI,EAAAA,EAE1B,MAAMC,EAAcC,GAAiB,CAC/B3B,EAAoBc,SAAWa,EAAMC,kBAAkBC,kBACzDJ,EAAAA,CAEJ,EAEMK,EAAeH,GAAsB,CACrCA,EAAMI,OAAS,IACjB/B,EAAoBc,QAAU,GAElC,EAEA,IAAIkB,EAEJ,MAAMC,EAAoBN,GAAsB,OAC9CK,GAAiBL,EAAAA,EAAMO,QAAQ,CAAC,IAAfP,YAAAA,EAAkBQ,OACrC,EAEMC,EAAmBT,GAAsB,OAC7C,MAAMU,GAASV,EAAAA,EAAMO,QAAQ,CAAC,IAAfP,YAAAA,EAAkBQ,QAC7BE,IAAWrB,QAAagB,IAAmBhB,QAAaqB,EAASL,IACnEhC,EAAoBc,QAAU,IAEhCkB,EAAiBK,CACnB,EAEAxB,OAAAA,EAAYyB,iBAAiB,OAAQZ,EAAY,EAAI,EACrDb,EAAYyB,iBAAiB,QAASR,EAAa,CAAES,QAAS,EAAA,CAAM,EACpE1B,EAAYyB,iBAAiB,aAAcL,EAAkB,CAAEM,QAAS,EAAA,CAAM,EAC9E1B,EAAYyB,iBAAiB,YAAaF,EAAiB,CAAEG,QAAS,EAAA,CAAM,EAErE,IAAM,CACXhB,OAAOiB,aAAalB,CAAO,EAC3BT,EAAY4B,oBAAoB,OAAQf,EAAY,EAAI,EACxDb,EAAY4B,oBAAoB,QAASX,CAAW,EACpDjB,EAAY4B,oBAAoB,aAAcR,CAAgB,EAC9DpB,EAAY4B,oBAAoB,YAAaL,CAAe,CAC9D,CACF,EAAG,CAAC9B,CAAe,CAAC,EAGlBoC,EAAAA,KAAC,MAAA,CACC,UAAWC,EAAAA,EAAGC,EAAOxD,SAAUN,GAAQ8D,EAAO9D,IAAI,EAClD,iBAAe,WACf,IAAKgB,EAEL,SAAA,CAAA+C,EAAAA,IAACC,EAAAA,KAAA,CAAK,oBAAiB,GACpB1D,SAAAA,EAAS2D,IAAK5D,GACb0D,EAAAA,IAACG,EAAAA,QAAA,CAEC,GAAI7D,CAAAA,EADCA,EAAQqB,EACD,CAEf,EACH,EACCX,GAAgBgD,EAAAA,IAACI,UAAA,CAAQ,QAAQ,SAAUpD,SAAAA,EAAa,EACzDgD,EAAAA,IAACK,EAAAA,OAAA,CACC,UAAS,GACT,QAAS/D,EACT,SAAUQ,GAAYc,GAAkBJ,EAAYE,SAAW,GAAK,EAACtB,GAAAA,MAAAA,EAAcsB,QACnF,MAAOF,EACP,aAAApB,EACA,aAAcU,EACd,QAAST,EACT,QAASG,EACT,SAAAC,EACA,cAAgB6D,GAAc,CACxBpE,IAAUiC,QAAWb,EAAiBgD,CAAS,EACnD5D,GAAAA,MAAAA,EAAgB4D,EAClB,EACA,qBAAA3D,EACA,SAAAC,EACA,SAAUT,EACV,YAAAU,EACA,YAAAE,CAAA,CAAyB,CAAA,EAE7B,CAEJ"}

package/dist/components/messages/index.js

@@ -1,76 +1,77 @@
-import { jsxs as G, jsx as c } from "react/jsx-runtime";
-import { t as I } from "../../classix-DG18itHa.js";
-import { useRef as i, useState as J, useLayoutEffect as K } from "react";
-import { Editor as O } from "../editor/index.js";
-import { List as P } from "../list/index.js";
-import { Tooltip as Q } from "../tooltip/index.js";
-import { Message as V } from "../message/index.js";
-import '../../assets/index13.css';const X = "_messages_pqp89_1", Z = "_fill_pqp89_20", Y = {
-  messages: X,
-  fill: Z
-}, re = ({
-  fill: q = !1,
+import { jsxs as I, jsx as c } from "react/jsx-runtime";
+import { t as J } from "../../classix-DG18itHa.js";
+import { useRef as i, useState as K, useLayoutEffect as O } from "react";
+import { Editor as P } from "../editor/index.js";
+import { List as Q } from "../list/index.js";
+import { Tooltip as V } from "../tooltip/index.js";
+import { Message as X } from "../message/index.js";
+import '../../assets/index13.css';const Z = "_messages_pqp89_1", $ = "_fill_pqp89_20", q = {
+  messages: Z,
+  fill: $
+}, ne = ({
+  fill: y = !1,
   files: u,
-  handleUpload: y,
+  handleUpload: H,
   inlineImages: r,
-  maxEditorRows: H = 5,
+  maxEditorRows: x = 5,
   message: d = "",
   messages: l,
-  minEditorRows: b = 1,
-  onChange: x,
+  minEditorRows: B = 1,
+  onChange: b,
   onFilesChange: a,
-  onInlineImagesChange: B,
-  onSubmit: j,
-  placeholder: N,
-  sending: U,
-  tooltipLabel: m
+  onInlineImagesChange: j,
+  onSubmit: N,
+  placeholder: U,
+  sending: m,
+  submitLabel: W = "Send message",
+  tooltipLabel: f
 }) => {
-  var L;
-  const f = i(null), o = i(!0), h = i(!1), [W, k] = J([]), p = u ?? W, v = (L = l[l.length - 1]) == null ? void 0 : L.id, z = d.replace(/<[^>]*>/g, "").replace(/&nbsp;/g, " ").trim() === "";
-  return K(() => {
+  var g;
+  const h = i(null), o = i(!0), p = i(!1), [k, z] = K([]), v = u ?? k, L = (g = l[l.length - 1]) == null ? void 0 : g.id, A = d.replace(/<[^>]*>/g, "").replace(/&nbsp;/g, " ").trim() === "";
+  return O(() => {
     var M;
-    const e = (M = f.current) == null ? void 0 : M.querySelector("[data-message-list]");
-    if (!e || v === void 0) return;
-    const A = e.scrollHeight - e.scrollTop - e.clientHeight < 450, g = !h.current || A;
-    o.current = g, h.current = !0;
-    const D = window.setTimeout(() => {
+    const e = (M = h.current) == null ? void 0 : M.querySelector("[data-message-list]");
+    if (!e || L === void 0) return;
+    const D = e.scrollHeight - e.scrollTop - e.clientHeight < 450, E = !p.current || D;
+    o.current = E, p.current = !0;
+    const G = window.setTimeout(() => {
       o.current = !1;
-    }, 5e3), E = () => {
+    }, 5e3), T = () => {
       e.scrollTop = e.scrollHeight;
     };
-    g && E();
-    const T = (t) => {
-      o.current && t.target instanceof HTMLImageElement && E();
-    }, w = (t) => {
+    E && T();
+    const w = (t) => {
+      o.current && t.target instanceof HTMLImageElement && T();
+    }, R = (t) => {
       t.deltaY < 0 && (o.current = !1);
     };
     let n;
-    const R = (t) => {
+    const S = (t) => {
       var s;
       n = (s = t.touches[0]) == null ? void 0 : s.clientY;
     }, _ = (t) => {
-      var S;
-      const s = (S = t.touches[0]) == null ? void 0 : S.clientY;
+      var Y;
+      const s = (Y = t.touches[0]) == null ? void 0 : Y.clientY;
       s !== void 0 && n !== void 0 && s > n && (o.current = !1), n = s;
     };
-    return e.addEventListener("load", T, !0), e.addEventListener("wheel", w, {
+    return e.addEventListener("load", w, !0), e.addEventListener("wheel", R, {
       passive: !0
-    }), e.addEventListener("touchstart", R, {
+    }), e.addEventListener("touchstart", S, {
       passive: !0
     }), e.addEventListener("touchmove", _, {
       passive: !0
     }), () => {
-      window.clearTimeout(D), e.removeEventListener("load", T, !0), e.removeEventListener("wheel", w), e.removeEventListener("touchstart", R), e.removeEventListener("touchmove", _);
+      window.clearTimeout(G), e.removeEventListener("load", w, !0), e.removeEventListener("wheel", R), e.removeEventListener("touchstart", S), e.removeEventListener("touchmove", _);
     };
-  }, [v]), /* @__PURE__ */ G("div", { className: I(Y.messages, q && Y.fill), "data-component": "messages", ref: f, children: [
-    /* @__PURE__ */ c(P, { "data-message-list": !0, children: l.map((e) => /* @__PURE__ */ c(V, { ...e }, e.id)) }),
-    m && /* @__PURE__ */ c(Q, { variant: "static", children: m }),
-    /* @__PURE__ */ c(O, { autofocus: !0, content: d, disabled: U || z && p.length === 0 && !(r != null && r.length), files: p, inlineImages: r, maxRows: H, minRows: b, onChange: x, onFilesChange: (e) => {
-      u === void 0 && k(e), a == null || a(e);
-    }, onInlineImagesChange: B, onSubmit: j, onUpload: y, placeholder: N, submitLabel: "Send message" })
+  }, [L]), /* @__PURE__ */ I("div", { className: J(q.messages, y && q.fill), "data-component": "messages", ref: h, children: [
+    /* @__PURE__ */ c(Q, { "data-message-list": !0, children: l.map((e) => /* @__PURE__ */ c(X, { ...e }, e.id)) }),
+    f && /* @__PURE__ */ c(V, { variant: "static", children: f }),
+    /* @__PURE__ */ c(P, { autofocus: !0, content: d, disabled: m || A && v.length === 0 && !(r != null && r.length), files: v, inlineImages: r, isSubmitting: m, maxRows: x, minRows: B, onChange: b, onFilesChange: (e) => {
+      u === void 0 && z(e), a == null || a(e);
+    }, onInlineImagesChange: j, onSubmit: N, onUpload: H, placeholder: U, submitLabel: W })
   ] });
 };
 export {
-  re as Messages
+  ne as Messages
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/messages/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useLayoutEffect, useRef, useState } from 'react';\n\nimport { Editor, type PendingInlineImage } from '@/components/editor';\nimport { List } from '@/components/list';\nimport { Tooltip } from '@/components/tooltip';\n\nimport { Message, type MessageOptions } from '../message';\nimport styles from './styles.module.css';\n\nexport type MessageItem = MessageOptions;\n\nexport type MessagesProps = {\n  fill?: boolean;\n  files?: readonly File[];\n  handleUpload: (files: FileList) => Promise<void> | void;\n  inlineImages?: readonly PendingInlineImage[];\n  maxEditorRows?: number;\n  message: string;\n  messages: MessageItem[];\n  minEditorRows?: number;\n  onChange: (content: string) => void;\n  onFilesChange?: (files: File[]) => void;\n  onInlineImagesChange?: (images: PendingInlineImage[]) => void;\n  onSubmit: () => Promise<void> | void;\n  placeholder?: string;\n  sending: boolean;\n  tooltipLabel?: string;\n};\n\nexport const Messages = ({\n  fill = false,\n  files,\n  handleUpload,\n  inlineImages,\n  maxEditorRows = 5,\n  message = '',\n  messages,\n  minEditorRows = 1,\n  onChange,\n  onFilesChange,\n  onInlineImagesChange,\n  onSubmit,\n  placeholder,\n  sending,\n  tooltipLabel,\n}: MessagesProps) => {\n  const messagesRef = useRef<HTMLDivElement>(null);\n  const followImageLoadsRef = useRef(true);\n  const hasLoadedRef = useRef(false);\n  const [internalFiles, setInternalFiles] = useState<File[]>([]);\n  const queuedFiles = files ?? internalFiles;\n  const newestMessageId = messages[messages.length - 1]?.id;\n  const messageIsEmpty =\n    message\n      .replace(/<[^>]*>/g, '')\n      .replace(/&nbsp;/g, ' ')\n      .trim() === '';\n\n  useLayoutEffect(() => {\n    const messageList = messagesRef.current?.querySelector<HTMLElement>('[data-message-list]');\n    if (!messageList || newestMessageId === undefined) return;\n\n    const isNearBottom =\n      messageList.scrollHeight - messageList.scrollTop - messageList.clientHeight <\n      450; /* 🌝 preview image max height plus allowance */\n    const shouldScrollToBottom = !hasLoadedRef.current || isNearBottom;\n\n    followImageLoadsRef.current = shouldScrollToBottom;\n    hasLoadedRef.current = true;\n\n    const timeout = window.setTimeout(() => {\n      followImageLoadsRef.current = false;\n    }, 5000);\n\n    const scrollToBottom = () => {\n      messageList.scrollTop = messageList.scrollHeight;\n    };\n\n    if (shouldScrollToBottom) scrollToBottom();\n\n    const handleLoad = (event: Event) => {\n      if (followImageLoadsRef.current && event.target instanceof HTMLImageElement) {\n        scrollToBottom();\n      }\n    };\n\n    const handleWheel = (event: WheelEvent) => {\n      if (event.deltaY < 0) {\n        followImageLoadsRef.current = false;\n      }\n    };\n\n    let previousTouchY: number | undefined;\n\n    const handleTouchStart = (event: TouchEvent) => {\n      previousTouchY = event.touches[0]?.clientY;\n    };\n\n    const handleTouchMove = (event: TouchEvent) => {\n      const touchY = event.touches[0]?.clientY;\n      if (touchY !== undefined && previousTouchY !== undefined && touchY > previousTouchY) {\n        followImageLoadsRef.current = false;\n      }\n      previousTouchY = touchY;\n    };\n\n    messageList.addEventListener('load', handleLoad, true);\n    messageList.addEventListener('wheel', handleWheel, { passive: true });\n    messageList.addEventListener('touchstart', handleTouchStart, { passive: true });\n    messageList.addEventListener('touchmove', handleTouchMove, { passive: true });\n\n    return () => {\n      window.clearTimeout(timeout);\n      messageList.removeEventListener('load', handleLoad, true);\n      messageList.removeEventListener('wheel', handleWheel);\n      messageList.removeEventListener('touchstart', handleTouchStart);\n      messageList.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [newestMessageId]);\n\n  return (\n    <div\n      className={cx(styles.messages, fill && styles.fill)}\n      data-component='messages'\n      ref={messagesRef}\n    >\n      <List data-message-list>\n        {messages.map((message) => (\n          <Message\n            key={message.id}\n            {...message}\n          />\n        ))}\n      </List>\n      {tooltipLabel && <Tooltip variant='static'>{tooltipLabel}</Tooltip>}\n      <Editor\n        autofocus\n        content={message}\n        disabled={sending || (messageIsEmpty && queuedFiles.length === 0 && !inlineImages?.length)}\n        files={queuedFiles}\n        inlineImages={inlineImages}\n        maxRows={maxEditorRows}\n        minRows={minEditorRows}\n        onChange={onChange}\n        onFilesChange={(nextFiles) => {\n          if (files === undefined) setInternalFiles(nextFiles);\n          onFilesChange?.(nextFiles);\n        }}\n        onInlineImagesChange={onInlineImagesChange}\n        onSubmit={onSubmit}\n        onUpload={handleUpload}\n        placeholder={placeholder}\n        submitLabel='Send message'\n      />\n    </div>\n  );\n};\n"],"names":["Messages","fill","files","handleUpload","inlineImages","maxEditorRows","message","messages","minEditorRows","onChange","onFilesChange","onInlineImagesChange","onSubmit","placeholder","sending","tooltipLabel","messagesRef","useRef","followImageLoadsRef","hasLoadedRef","internalFiles","setInternalFiles","useState","queuedFiles","newestMessageId","length","id","messageIsEmpty","replace","trim","useLayoutEffect","messageList","current","querySelector","undefined","isNearBottom","scrollHeight","scrollTop","clientHeight","shouldScrollToBottom","timeout","window","setTimeout","scrollToBottom","handleLoad","event","target","HTMLImageElement","handleWheel","deltaY","previousTouchY","handleTouchStart","touches","clientY","handleTouchMove","touchY","addEventListener","passive","clearTimeout","removeEventListener","jsxs","cx","styles","jsx","List","map","Message","Tooltip","Editor","nextFiles"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/messages/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useLayoutEffect, useRef, useState } from 'react';\n\nimport { Editor, type PendingInlineImage } from '@/components/editor';\nimport { List } from '@/components/list';\nimport { Tooltip } from '@/components/tooltip';\n\nimport { Message, type MessageOptions } from '../message';\nimport styles from './styles.module.css';\n\nexport type MessageItem = MessageOptions;\n\nexport type MessagesProps = {\n  fill?: boolean;\n  files?: readonly File[];\n  handleUpload: (files: FileList) => Promise<void> | void;\n  inlineImages?: readonly PendingInlineImage[];\n  maxEditorRows?: number;\n  message: string;\n  messages: MessageItem[];\n  minEditorRows?: number;\n  onChange: (content: string) => void;\n  onFilesChange?: (files: File[]) => void;\n  onInlineImagesChange?: (images: PendingInlineImage[]) => void;\n  onSubmit: () => Promise<void> | void;\n  placeholder?: string;\n  sending: boolean;\n  submitLabel?: string;\n  tooltipLabel?: string;\n};\n\nexport const Messages = ({\n  fill = false,\n  files,\n  handleUpload,\n  inlineImages,\n  maxEditorRows = 5,\n  message = '',\n  messages,\n  minEditorRows = 1,\n  onChange,\n  onFilesChange,\n  onInlineImagesChange,\n  onSubmit,\n  placeholder,\n  sending,\n  submitLabel = 'Send message',\n  tooltipLabel,\n}: MessagesProps) => {\n  const messagesRef = useRef<HTMLDivElement>(null);\n  const followImageLoadsRef = useRef(true);\n  const hasLoadedRef = useRef(false);\n  const [internalFiles, setInternalFiles] = useState<File[]>([]);\n  const queuedFiles = files ?? internalFiles;\n  const newestMessageId = messages[messages.length - 1]?.id;\n  const messageIsEmpty =\n    message\n      .replace(/<[^>]*>/g, '')\n      .replace(/&nbsp;/g, ' ')\n      .trim() === '';\n\n  useLayoutEffect(() => {\n    const messageList = messagesRef.current?.querySelector<HTMLElement>('[data-message-list]');\n    if (!messageList || newestMessageId === undefined) return;\n\n    const isNearBottom =\n      messageList.scrollHeight - messageList.scrollTop - messageList.clientHeight <\n      450; /* 🌝 preview image max height plus allowance */\n    const shouldScrollToBottom = !hasLoadedRef.current || isNearBottom;\n\n    followImageLoadsRef.current = shouldScrollToBottom;\n    hasLoadedRef.current = true;\n\n    const timeout = window.setTimeout(() => {\n      followImageLoadsRef.current = false;\n    }, 5000);\n\n    const scrollToBottom = () => {\n      messageList.scrollTop = messageList.scrollHeight;\n    };\n\n    if (shouldScrollToBottom) scrollToBottom();\n\n    const handleLoad = (event: Event) => {\n      if (followImageLoadsRef.current && event.target instanceof HTMLImageElement) {\n        scrollToBottom();\n      }\n    };\n\n    const handleWheel = (event: WheelEvent) => {\n      if (event.deltaY < 0) {\n        followImageLoadsRef.current = false;\n      }\n    };\n\n    let previousTouchY: number | undefined;\n\n    const handleTouchStart = (event: TouchEvent) => {\n      previousTouchY = event.touches[0]?.clientY;\n    };\n\n    const handleTouchMove = (event: TouchEvent) => {\n      const touchY = event.touches[0]?.clientY;\n      if (touchY !== undefined && previousTouchY !== undefined && touchY > previousTouchY) {\n        followImageLoadsRef.current = false;\n      }\n      previousTouchY = touchY;\n    };\n\n    messageList.addEventListener('load', handleLoad, true);\n    messageList.addEventListener('wheel', handleWheel, { passive: true });\n    messageList.addEventListener('touchstart', handleTouchStart, { passive: true });\n    messageList.addEventListener('touchmove', handleTouchMove, { passive: true });\n\n    return () => {\n      window.clearTimeout(timeout);\n      messageList.removeEventListener('load', handleLoad, true);\n      messageList.removeEventListener('wheel', handleWheel);\n      messageList.removeEventListener('touchstart', handleTouchStart);\n      messageList.removeEventListener('touchmove', handleTouchMove);\n    };\n  }, [newestMessageId]);\n\n  return (\n    <div\n      className={cx(styles.messages, fill && styles.fill)}\n      data-component='messages'\n      ref={messagesRef}\n    >\n      <List data-message-list>\n        {messages.map((message) => (\n          <Message\n            key={message.id}\n            {...message}\n          />\n        ))}\n      </List>\n      {tooltipLabel && <Tooltip variant='static'>{tooltipLabel}</Tooltip>}\n      <Editor\n        autofocus\n        content={message}\n        disabled={sending || (messageIsEmpty && queuedFiles.length === 0 && !inlineImages?.length)}\n        files={queuedFiles}\n        inlineImages={inlineImages}\n        isSubmitting={sending}\n        maxRows={maxEditorRows}\n        minRows={minEditorRows}\n        onChange={onChange}\n        onFilesChange={(nextFiles) => {\n          if (files === undefined) setInternalFiles(nextFiles);\n          onFilesChange?.(nextFiles);\n        }}\n        onInlineImagesChange={onInlineImagesChange}\n        onSubmit={onSubmit}\n        onUpload={handleUpload}\n        placeholder={placeholder}\n        submitLabel={submitLabel}\n      />\n    </div>\n  );\n};\n"],"names":["Messages","fill","files","handleUpload","inlineImages","maxEditorRows","message","messages","minEditorRows","onChange","onFilesChange","onInlineImagesChange","onSubmit","placeholder","sending","submitLabel","tooltipLabel","messagesRef","useRef","followImageLoadsRef","hasLoadedRef","internalFiles","setInternalFiles","useState","queuedFiles","newestMessageId","length","id","messageIsEmpty","replace","trim","useLayoutEffect","messageList","current","querySelector","undefined","isNearBottom","scrollHeight","scrollTop","clientHeight","shouldScrollToBottom","timeout","window","setTimeout","scrollToBottom","handleLoad","event","target","HTMLImageElement","handleWheel","deltaY","previousTouchY","handleTouchStart","touches","clientY","handleTouchMove","touchY","addEventListener","passive","clearTimeout","removeEventListener","jsxs","cx","styles","jsx","List","map","Message","Tooltip","Editor","nextFiles"],"mappings":"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"}