@lightsparkdev/ui 1.0.14 → 1.0.16

package/dist/{chunk-3RNPU5L4.cjs → chunk-E7KJQVHI.cjs}

@@ -1,46 +1,52 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkX6FYQTZ6cjs = require('./chunk-X6FYQTZ6.cjs');
+var _chunkGX5KB4DNcjs = require('./chunk-GX5KB4DN.cjs');
 
 
-var _chunkNAFB5UYYcjs = require('./chunk-NAFB5UYY.cjs');
+var _chunkKF2ZLWG4cjs = require('./chunk-KF2ZLWG4.cjs');
 
 
-var _chunkYWBNVZS7cjs = require('./chunk-YWBNVZS7.cjs');
 
+var _chunk7QQBTG3Ocjs = require('./chunk-7QQBTG3O.cjs');
 
-var _chunkEZNRFABOcjs = require('./chunk-EZNRFABO.cjs');
 
+var _chunkBT2NS24Ucjs = require('./chunk-BT2NS24U.cjs');
 
 
+var _chunkAPCRRZMTcjs = require('./chunk-APCRRZMT.cjs');
 
-var _chunkWIIDMFXRcjs = require('./chunk-WIIDMFXR.cjs');
 
+var _chunk2KKFVDUDcjs = require('./chunk-2KKFVDUD.cjs');
 
-var _chunkZFJVBBROcjs = require('./chunk-ZFJVBBRO.cjs');
 
 
 
-var _chunkRUDXRW4Rcjs = require('./chunk-RUDXRW4R.cjs');
+var _chunkRLTFMTRWcjs = require('./chunk-RLTFMTRW.cjs');
 
 
+var _chunkEUDYMZXOcjs = require('./chunk-EUDYMZXO.cjs');
 
 
-var _chunk5YGED5IJcjs = require('./chunk-5YGED5IJ.cjs');
+var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
 
 
-var _chunkKW3JYLRIcjs = require('./chunk-KW3JYLRI.cjs');
+var _chunkJZ3TGO3Dcjs = require('./chunk-JZ3TGO3D.cjs');
 
 
 
-var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
 
 // src/components/Table/Table.tsx
 var _react = require('@emotion/react');
 var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
+
+
+
+
+
+var _reacttable = require('@tanstack/react-table');
 var _lodashes = require('lodash-es');
 var _react3 = require('react');
-var _reacttable = require('react-table');
 var _jsxruntime = require('@emotion/react/jsx-runtime');
 var isObjectCell = (value) => {
   return _lodashes.isObject.call(void 0, value) && "text" in value && typeof value.text === "string";
@@ -63,10 +69,12 @@ function Table({
   loading,
   onClickRow,
   emptyState,
-  clipboardCallbacks
+  clipboardCallbacks,
+  rowHoverEffect = "border"
 }) {
-  const navigate = _chunk5YGED5IJcjs.useNavigate.call(void 0, );
-  const { canWriteToClipboard, writeTextToClipboard } = _chunkEZNRFABOcjs.useClipboard.call(void 0, clipboardCallbacks);
+  const navigate = _chunkRLTFMTRWcjs.useNavigate.call(void 0, );
+  const [sorting, setSorting] = _react3.useState.call(void 0, []);
+  const { canWriteToClipboard, writeTextToClipboard } = _chunkJZ3TGO3Dcjs.useClipboard.call(void 0, clipboardCallbacks);
   const onClickCopy = _react3.useCallback.call(void 0, 
     (value) => (event) => {
       event.stopPropagation();
@@ -75,35 +83,39 @@ function Table({
     [writeTextToClipboard]
   );
   const mappedColumns = _react3.useMemo.call(void 0, 
-    () => columns.map((column) => _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, column), {
-      Header: typeof column.Header === "string" ? column.Header : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
-        column.Header.name,
+    () => columns.map((column) => _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, column), {
+      header: (context) => typeof column.header === "string" ? column.header : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+        column.header.name,
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunkX6FYQTZ6cjs.InfoIconTooltip,
+          _chunkGX5KB4DNcjs.InfoIconTooltip,
           {
-            id: `tooltip-${column.Header.name}`,
-            content: column.Header.tooltip || "",
+            id: `tooltip-${column.header.name}`,
+            content: column.header.tooltip || "",
             verticalAlign: -2
           }
         )
       ] }),
-      accessor: column.accessor.toString(),
-      Cell: ({ value }) => {
-        let content = value;
+      accessorKey: column.accessorKey.toString(),
+      cell: (context) => {
+        const value = context.getValue();
+        let content = null;
         let icon = null;
         if (isObjectCell(value)) {
-          icon = value.icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZFJVBBROcjs.Icon, { name: value.icon, width: 14, mr: 4, color: "c4Neutral" }) : null;
+          const base64icon = value.base64icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Base64Icon, { src: value.base64icon, alt: "Icon" }) : null;
+          icon = value.icon ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: value.icon, width: 14, mr: 4, color: "c4Neutral" }) : null;
           if (isMultilineCell(value)) {
             content = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, LineClampSpan, { children: [
-              icon,
+              base64icon ? base64icon : icon,
               value.text
             ] });
           } else {
             content = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react3.Fragment, { children: [
-              icon,
+              base64icon ? base64icon : icon,
               value.text
             ] });
           }
+        } else {
+          content = value;
         }
         if (isLinkAndClipboardCell(value)) {
           const copyButton = canWriteToClipboard && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -112,7 +124,7 @@ function Table({
               onClick: onClickCopy(value.text),
               role: "button",
               tabIndex: 0,
-              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZFJVBBROcjs.Icon, { name: "Copy", width: 16, mr: 12 })
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: "Copy", width: 16, mr: 12 })
             }
           );
           return value.link ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, LinkClipboardCell, { children: [
@@ -126,7 +138,7 @@ function Table({
                   e.stopPropagation();
                 },
                 children: [
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZFJVBBROcjs.Icon, { name: "LinkIcon", width: 12 }),
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: "LinkIcon", width: 12 }),
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LinkCellContent, { children: content })
                 ]
               }
@@ -134,7 +146,7 @@ function Table({
             copyButton
           ] }) : value.to ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, HoverableCellWrapper, { children: [
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-              _chunk5YGED5IJcjs.Link,
+              _chunkRLTFMTRWcjs.Link,
               {
                 to: value.to,
                 params: value.toParams,
@@ -160,12 +172,12 @@ function Table({
                 e.stopPropagation();
               },
               children: [
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZFJVBBROcjs.Icon, { name: "LinkIcon", width: 12 }),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAPCRRZMTcjs.Icon, { name: "LinkIcon", width: 12 }),
                 /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LinkCellContent, { children: content })
               ]
             }
           ) : value.to ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, HoverableCellWrapper, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            _chunk5YGED5IJcjs.Link,
+            _chunkRLTFMTRWcjs.Link,
             {
               to: value.to,
               params: value.toParams,
@@ -190,7 +202,7 @@ function Table({
           return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, HoverableCellWrapper, { children: [
             icon,
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkYWBNVZS7cjs.ClipboardTextField,
+              _chunkKF2ZLWG4cjs.ClipboardTextField,
               {
                 value: value.text,
                 elide: maxChars ? {
@@ -211,8 +223,17 @@ function Table({
     })),
     [columns, canWriteToClipboard, onClickCopy, clipboardCallbacks]
   );
-  const tableInstance = _reacttable.useTable.call(void 0, { columns: mappedColumns, data });
-  const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } = tableInstance;
+  const tableInstance = _reacttable.useReactTable.call(void 0, {
+    columns: mappedColumns,
+    data,
+    state: {
+      sorting
+    },
+    onSortingChange: setSorting,
+    getCoreRowModel: _reacttable.getCoreRowModel.call(void 0, ),
+    getSortedRowModel: _reacttable.getSortedRowModel.call(void 0, )
+    // debugTable: true
+  });
   function onClickDataRow(event, row) {
     const onClickRowResult = onClickRow ? onClickRow(row) : null;
     if (onClickRowResult) {
@@ -220,7 +241,7 @@ function Table({
       if ((onClickRowResult == null ? void 0 : onClickRowResult.link) || (onClickRowResult == null ? void 0 : onClickRowResult.to) && newTabKey) {
         let link = onClickRowResult == null ? void 0 : onClickRowResult.link;
         if (!link) {
-          link = _chunk5YGED5IJcjs.replaceParams.call(void 0, onClickRowResult.to, onClickRowResult.params);
+          link = _chunkRLTFMTRWcjs.replaceParams.call(void 0, onClickRowResult.to, onClickRowResult.params);
         }
         const target = newTabKey ? "_blank" : void 0;
         window.open(link, target);
@@ -230,60 +251,54 @@ function Table({
     }
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, TableWrapper, { children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledTable, _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, getTableProps()), { clickable: Boolean(onClickRow), children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "thead", {
-        // Loop over the header rows
-        children: headerGroups.map((headerGroup) => (
-          // Apply the header row props
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, headerGroup.getHeaderGroupProps()), {
-            // Loop over the headers in each row
-            children: headerGroup.headers.map((column) => (
-              // Apply the header cell props
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, column.getHeaderProps()), {
-                // Render the header
-                children: column.render("Header")
-              }))
-            ))
-          }))
-        ))
-      }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tbody", _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, getTableBodyProps()), {
-        // Loop over the table rows
-        children: rows.map((row) => {
-          prepareRow(row);
-          return (
-            // Apply the row props
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              "tr",
-              _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, row.getRowProps()), {
-                onClick: (event) => onClickDataRow(event, row),
-                onKeyDown: (event) => {
-                  if (event.key === "Enter") {
-                    onClickDataRow(event, row);
-                  }
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      StyledTable,
+      {
+        clickable: Boolean(onClickRow),
+        rowHoverEffect,
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "thead", {
+            // Loop over the header rows
+            children: tableInstance.getHeaderGroups().map((headerGroup) => {
+              return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "th", { children: header.isPlaceholder ? null : _reacttable.flexRender.call(void 0, 
+                header.column.columnDef.header,
+                header.getContext()
+              ) }, header.id)) }, headerGroup.id);
+            })
+          }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tbody", {
+            // Loop over the table rows
+            children: tableInstance.getRowModel().rows.map((row) => {
+              return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "tr",
+                {
+                  onClick: (event) => onClickDataRow(event, row),
+                  onKeyDown: (event) => {
+                    if (event.key === "Enter") {
+                      onClickDataRow(event, row);
+                    }
+                  },
+                  tabIndex: 0,
+                  children: row.getVisibleCells().map((cell) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { children: _reacttable.flexRender.call(void 0, 
+                    cell.column.columnDef.cell,
+                    cell.getContext()
+                  ) }, cell.id))
                 },
-                tabIndex: 0,
-                // Loop over the rows cells
-                children: row.cells.map((cell) => {
-                  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, cell.getCellProps()), {
-                    // Render the cell contents
-                    children: cell.render("Cell")
-                  }));
-                })
-              })
-            )
-          );
-        })
-      }))
-    ] })),
+                row.id
+              );
+            })
+          })
+        ]
+      }
+    ),
     emptyState,
-    loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkNAFB5UYYcjs.Loading, {})
+    loading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBT2NS24Ucjs.Loading, {})
   ] });
 }
 var TableWrapper = _styled2.default.div`
   position: relative;
   min-height: 300px;
-  ${_chunkWIIDMFXRcjs.overflowAutoWithoutScrollbars}
+  ${_chunk7QQBTG3Ocjs.overflowAutoWithoutScrollbars}
 `;
 var hoverCellStyles = _react.css`
   cursor: pointer;
@@ -323,7 +338,14 @@ var CopyButton = _styled2.default.span`
   display: inline-table;
 `;
 var LineClampSpan = _styled2.default.span`
-  ${_chunkWIIDMFXRcjs.lineClamp.call(void 0, 2)}
+  ${_chunk7QQBTG3Ocjs.lineClamp.call(void 0, 2)}
+`;
+var Base64Icon = _styled2.default.img`
+  width: 32px;
+  height: 32px;
+  object-fit: contain;
+  border-radius: 4px;
+  margin-right: 12px;
 `;
 var cellPaddingPx = 15;
 var StyledTable = _styled2.default.table`
@@ -332,23 +354,24 @@ var StyledTable = _styled2.default.table`
   width: 100%;
 
   ${_chunkKW3JYLRIcjs.bp.lg(`
-    padding-left: ${_chunkRUDXRW4Rcjs.standardContentInset.lgPx}px;
-    padding-right: ${_chunkRUDXRW4Rcjs.standardContentInset.lgPx}px;
+    padding-left: ${_chunk2KKFVDUDcjs.standardContentInset.lgPx}px;
+    padding-right: ${_chunk2KKFVDUDcjs.standardContentInset.lgPx}px;
   `)}
   ${_chunkKW3JYLRIcjs.bp.sm(`
-    padding-left: ${_chunkRUDXRW4Rcjs.standardContentInset.smPx}px;
-    padding-right: ${_chunkRUDXRW4Rcjs.standardContentInset.smPx}px;
+    padding-left: ${_chunk2KKFVDUDcjs.standardContentInset.smPx}px;
+    padding-right: ${_chunk2KKFVDUDcjs.standardContentInset.smPx}px;
   `)}
   ${_chunkKW3JYLRIcjs.bp.minSmMaxLg(`
-    padding-left: ${_chunkRUDXRW4Rcjs.standardContentInset.minSmMaxLgPx}px;
-    padding-right: ${_chunkRUDXRW4Rcjs.standardContentInset.minSmMaxLgPx}px;
+    padding-left: ${_chunk2KKFVDUDcjs.standardContentInset.minSmMaxLgPx}px;
+    padding-right: ${_chunk2KKFVDUDcjs.standardContentInset.minSmMaxLgPx}px;
   `)}
 
   th {
     max-width: 200px;
     text-align: left;
     padding: ${cellPaddingPx}px 0px;
-    border-bottom: 1px solid ${({ theme }) => theme.c1Neutral};
+    border-bottom: 1px solid
+      ${({ theme }) => _chunkEUDYMZXOcjs.themeOrWithKey.call(void 0, "c1Neutral", "c2Neutral")({ theme })};
     padding: ${cellPaddingPx}px;
     &:first-of-type {
       padding-left: 0px;
@@ -361,32 +384,13 @@ var StyledTable = _styled2.default.table`
     }
   }
 
-  tr {
-    cursor: ${({ clickable }) => clickable ? "pointer" : "default"};
-    position: relative;
-
-    &:hover td:first-child:before ${_chunkWIIDMFXRcjs.ignoreSSRWarning} {
-      ${_chunkRUDXRW4Rcjs.standardBorderRadius.call(void 0, 16)}
-      content: "";
-      position: absolute;
-      /* Position offsets inside trs do not properly follow relatively positioned
-         parents in Safari (see bug https://bit.ly/49dViWy), use margin instead: */
-      margin-top: 5px;
-      left: -12px;
-      width: calc(100% + 24px);
-      height: 32px;
-      border: 1px solid ${({ theme }) => theme.c1Neutral};
-      pointer-events: none;
-    }
-  }
-
   td {
     max-width: 200px;
     text-overflow: ellipsis;
     overflow: hidden;
     padding: 0 ${cellPaddingPx}px;
     white-space: nowrap;
-    & > * {
+    & > span {
       overflow: hidden;
       text-overflow: ellipsis;
       display: block;
@@ -409,6 +413,61 @@ var StyledTable = _styled2.default.table`
       white-space: normal;
     }
   }
+
+  tr {
+    cursor: ${({ clickable }) => clickable ? "pointer" : "default"};
+    position: relative;
+
+    ${({ rowHoverEffect, theme }) => `
+        &:hover {
+          td {
+            position: relative;
+            &:before {
+              content: "";
+              display: block;
+              position: absolute;
+              pointer-events: none;
+              height: 80%;
+              top: 10%;
+              bottom: 10%;
+              ${rowHoverEffect === "background" ? `background: ${theme.c1Neutral};` : `
+                    border: 1px solid ${_chunkEUDYMZXOcjs.themeOrWithKey.call(void 0, 
+  "c1Neutral",
+  "c2Neutral"
+)({ theme })};
+                    border-left-width: 0;
+                    border-right-width: 0;
+                  `}
+              left: 0;
+              right: 0;
+              width: 100%;
+              z-index: -1;
+            }
+            &:first-of-type {
+              overflow: visible;
+              &:before {
+                border-top-left-radius: 32px;
+                border-bottom-left-radius: 32px;
+                transform: translateX(-12px);
+                width: calc(100% + 12px);
+                ${rowHoverEffect === "border" ? "border-left-width: 1px;" : ""}
+              }
+            }
+            &:last-of-type {
+              overflow: visible;
+              &:before {
+                border-top-right-radius: 32px;
+                border-bottom-right-radius: 32px;
+                transform: translateX(12px);
+                width: calc(100% + 12px);
+                left: auto;
+                ${rowHoverEffect === "border" ? "border-right-width: 1px;" : ""}
+              }
+            }
+          }
+        }
+        `}
+  }
 `;
 
 

package/dist/{chunk-ILYMHUCA.cjs → chunk-EKTQBFNO.cjs}

@@ -5,6 +5,7 @@ var FilterType = /* @__PURE__ */ ((FilterType2) => {
   FilterType2["STRING"] = "string";
   FilterType2["ID"] = "id";
   FilterType2["NUMBER"] = "number";
+  FilterType2["CURRENCY"] = "currency";
   FilterType2["BOOLEAN"] = "boolean";
   return FilterType2;
 })(FilterType || {});

package/dist/{chunk-Q4RAJLKP.cjs → chunk-ELEYS3GZ.cjs}

@@ -3,11 +3,11 @@
 var _chunkZU72XWNEcjs = require('./chunk-ZU72XWNE.cjs');
 
 
-var _chunkRUDXRW4Rcjs = require('./chunk-RUDXRW4R.cjs');
+var _chunk2KKFVDUDcjs = require('./chunk-2KKFVDUD.cjs');
 
 
 
-var _chunkYM5JDZDQcjs = require('./chunk-YM5JDZDQ.cjs');
+var _chunkZ6EUSUADcjs = require('./chunk-Z6EUSUAD.cjs');
 
 // src/components/Tooltip.tsx
 var _css = require('@emotion/css');
@@ -36,13 +36,14 @@ function Tooltip(props) {
   return nodeReady && nodeRef.current ? _reactdom2.default.createPortal(
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       _reacttooltip.Tooltip,
-      _chunkYM5JDZDQcjs.__spreadProps.call(void 0, _chunkYM5JDZDQcjs.__spreadValues.call(void 0, {}, props), {
+      _chunkZ6EUSUADcjs.__spreadProps.call(void 0, _chunkZ6EUSUADcjs.__spreadValues.call(void 0, {}, props), {
         id: props.id || "",
         content: props.content || "",
         noArrow: true,
         border: "0.05rem solid rgba(0, 0, 0, 0.1)",
         className: styles({ theme }),
-        variant: "light"
+        variant: "light",
+        clickable: Boolean(props.interactive)
       })
     ),
     nodeRef.current
@@ -54,7 +55,7 @@ var styles = ({ theme }) => _css.css`
   border-radius: 8px !important;
   padding: 16px !important;
   z-index: ${_chunkZU72XWNEcjs.z.tooltip};
-  ${_chunkRUDXRW4Rcjs.overlaySurface.call(void 0, { theme, important: true })};
+  ${_chunk2KKFVDUDcjs.overlaySurface.call(void 0, { theme, important: true })};
 
   max-width: 260px;
   box-shadow:

package/dist/chunk-ELIZ2TPX.js

@@ -0,0 +1,89 @@
+// src/icons/Messenger.tsx
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+function Messenger({
+  strokeWidth = "1.5",
+  strokeLinecap = "round",
+  strokeLinejoin = "round"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "25",
+      height: "26",
+      viewBox: "0 0 25 26",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsxs("g", { clipPath: "url(#clip0_450_127598)", children: [
+          /* @__PURE__ */ jsx("rect", { y: "0.5", width: "25", height: "25", rx: "6", fill: "white" }),
+          /* @__PURE__ */ jsxs("g", { clipPath: "url(#clip1_450_127598)", children: [
+            /* @__PURE__ */ jsx(
+              "path",
+              {
+                fillRule: "evenodd",
+                clipRule: "evenodd",
+                d: "M12 3.35938C6.71878 3.35938 2.625 7.22787 2.625 12.4531C2.625 15.1863 3.74513 17.548 5.56928 19.1793C5.72241 19.3164 5.81484 19.5084 5.82112 19.7139L5.87218 21.3815C5.88849 21.9134 6.43794 22.2596 6.92469 22.0447L8.7855 21.2233C8.94324 21.1537 9.12 21.1408 9.28622 21.1865C10.1413 21.4216 11.0514 21.5469 12 21.5469C17.2812 21.5469 21.375 17.6784 21.375 12.4531C21.375 7.22787 17.2812 3.35938 12 3.35938Z",
+                fill: "url(#paint0_radial_450_127598)"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "path",
+              {
+                fillRule: "evenodd",
+                clipRule: "evenodd",
+                d: "M6.37047 15.1125L9.12438 10.7434C9.56243 10.0483 10.5005 9.87523 11.1578 10.3682L13.3481 12.0109C13.5491 12.1617 13.8256 12.1609 14.0257 12.009L16.9838 9.76395C17.3787 9.46433 17.894 9.93683 17.6298 10.3561L14.8759 14.7253C14.4378 15.4203 13.4997 15.5934 12.8425 15.1004L10.6521 13.4577C10.4512 13.307 10.1747 13.3078 9.97456 13.4596L7.01641 15.7047C6.62159 16.0043 6.10619 15.5318 6.37047 15.1125Z",
+                fill: "white"
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: "0.25",
+            y: "0.75",
+            width: "24.5",
+            height: "24.5",
+            rx: "5.75",
+            stroke: "black",
+            strokeOpacity: "0.1",
+            strokeWidth: "0.5"
+          }
+        ),
+        /* @__PURE__ */ jsxs("defs", { children: [
+          /* @__PURE__ */ jsxs(
+            "radialGradient",
+            {
+              id: "paint0_radial_450_127598",
+              cx: "0",
+              cy: "0",
+              r: "1",
+              gradientUnits: "userSpaceOnUse",
+              gradientTransform: "translate(6.24 22.1) rotate(-59.4208) scale(20.4431 20.4431)",
+              children: [
+                /* @__PURE__ */ jsx("stop", { stopColor: "#0099FF" }),
+                /* @__PURE__ */ jsx("stop", { offset: "0.609754", stopColor: "#A033FF" }),
+                /* @__PURE__ */ jsx("stop", { offset: "0.934823", stopColor: "#FF5280" }),
+                /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#FF7061" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("clipPath", { id: "clip0_450_127598", children: /* @__PURE__ */ jsx("rect", { y: "0.5", width: "25", height: "25", rx: "6", fill: "white" }) }),
+          /* @__PURE__ */ jsx("clipPath", { id: "clip1_450_127598", children: /* @__PURE__ */ jsx(
+            "rect",
+            {
+              width: "24",
+              height: "24",
+              fill: "white",
+              transform: "translate(0 0.5)"
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+
+export {
+  Messenger
+};