@memobit/libs 2.1.0 → 3.1.0

package/dist/components/FloatButton/FloatButton2.js

@@ -0,0 +1,68 @@
+import './FloatButton.css';
+import { Icon as a } from "../Icon/Icon2.js";
+import { Tooltip as s } from "../Tooltip/Tooltip2.js";
+/* empty css            */
+import { useState as u } from "react";
+import { Fragment as f, jsx as t, jsxs as i } from "react/jsx-runtime";
+var _ = ({ actions: n }) => {
+  const [e, o] = u(!1);
+  if (n.length === 1) return /* @__PURE__ */ t("div", {
+    className: "float-button-container",
+    children: /* @__PURE__ */ t(s, {
+      title: n[0].label,
+      position: "left",
+      children: /* @__PURE__ */ t("button", {
+        className: "float-button",
+        onClick: n[0].onClick,
+        children: /* @__PURE__ */ t("span", {
+          className: "float-button__icon",
+          children: /* @__PURE__ */ t(a, {
+            name: n[0].icon,
+            size: "xxl"
+          })
+        })
+      })
+    })
+  });
+  const c = () => {
+    o(!e);
+  }, r = (l) => {
+    l.onClick(), o(!1);
+  };
+  return /* @__PURE__ */ i("div", {
+    className: "float-button-container",
+    children: [e && /* @__PURE__ */ i(f, { children: [/* @__PURE__ */ t("div", {
+      className: "float-button-overlay",
+      onClick: () => o(!1)
+    }), /* @__PURE__ */ t("div", {
+      className: "float-button-menu",
+      children: n.map((l, m) => /* @__PURE__ */ i("button", {
+        className: "float-button-menu__item",
+        onClick: () => r(l),
+        children: [/* @__PURE__ */ t("span", {
+          className: "float-button-menu__icon",
+          children: /* @__PURE__ */ t(a, { name: l.icon })
+        }), /* @__PURE__ */ t("span", {
+          className: "float-button-menu__label",
+          children: l.label
+        })]
+      }, `float-button-${m}`))
+    })] }), /* @__PURE__ */ t(s, {
+      title: "Actions menu",
+      children: /* @__PURE__ */ t("button", {
+        className: `float-button ${e ? "float-button--active" : ""}`,
+        onClick: c,
+        children: /* @__PURE__ */ t("span", {
+          className: "float-button__icon",
+          children: /* @__PURE__ */ t(a, {
+            name: e ? "clear" : "plus",
+            size: "xxl"
+          })
+        })
+      })
+    })]
+  });
+};
+export {
+  _ as FloatButton
+};

package/dist/components/FloatingWindow/FloatingWindow.css

@@ -0,0 +1 @@
+.floating-window{z-index:var(--_window-z);background:var(--modal-background-color);color:var(--modal-color);border:var(--spacing-1) solid var(--modal-border-color);border-radius:var(--radius);box-shadow:var(--modal-box-shadow);flex-direction:column;min-width:0;min-height:0;display:flex;position:fixed;overflow:hidden}.floating-window--maximized{transition:none}.floating-window__header{justify-content:space-between;align-items:center;gap:var(--spacing-12);padding:var(--spacing-8) var(--spacing-12);background:var(--modal-header-background-color);border-bottom:var(--spacing-1) solid var(--modal-border-color);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;flex-shrink:0;display:flex}.floating-window__header:active{cursor:grabbing}.floating-window__title{text-overflow:ellipsis;white-space:nowrap;color:var(--modal-title-color,var(--modal-header-color));font-family:var(--modal-title-font-family,var(--font-family,sans-serif));font-size:var(--modal-title-font-size,var(--font-size-md));font-style:var(--modal-title-font-style,normal);font-weight:var(--modal-title-font-weight,var(--font-weight-semibold));letter-spacing:var(--modal-title-letter-spacing,normal);text-transform:var(--modal-title-text-transform,none);align-items:center;gap:var(--spacing-8);min-width:0;display:flex;overflow:hidden}.floating-window__actions{align-items:center;gap:var(--spacing-2);flex-shrink:0;display:flex}.floating-window__action{width:var(--spacing-24);height:var(--spacing-24);border-radius:var(--radius-sm);color:var(--body-sub-title-color);font-size:var(--font-size-xs);line-height:var(--line-height-none);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}.floating-window__action:hover{background:var(--border-color);color:var(--body-color-accent)}.floating-window__action--close:hover{background:var(--button-danger-background-color);color:var(--button-danger-color)}.floating-window__body{min-height:0;padding:var(--spacing-16);flex:1;overflow:auto}.floating-window__footer{justify-content:flex-end;align-items:center;gap:var(--spacing-8);padding:var(--spacing-12) var(--spacing-16);background:var(--modal-footer-background-color);border-top:var(--spacing-1) solid var(--modal-border-color);flex-shrink:0;display:flex}.floating-window--minimized .floating-window__header{border-bottom:none}.floating-window__handle{touch-action:none;--_handle-thickness:var(--spacing-6);--_handle-corner:var(--spacing-12);position:absolute}.floating-window__handle--n,.floating-window__handle--s{height:var(--_handle-thickness);cursor:ns-resize;left:0;right:0}.floating-window__handle--n{top:0}.floating-window__handle--s{bottom:0}.floating-window__handle--e,.floating-window__handle--w{width:var(--_handle-thickness);cursor:ew-resize;top:0;bottom:0}.floating-window__handle--e{right:0}.floating-window__handle--w{left:0}.floating-window__handle--ne,.floating-window__handle--nw,.floating-window__handle--se,.floating-window__handle--sw{width:var(--_handle-corner);height:var(--_handle-corner);z-index:1}.floating-window__handle--ne{cursor:nesw-resize;top:0;right:0}.floating-window__handle--nw{cursor:nwse-resize;top:0;left:0}.floating-window__handle--se{cursor:nwse-resize;bottom:0;right:0}.floating-window__handle--sw{cursor:nesw-resize;bottom:0;left:0}@media (width<=768px){.floating-window{border-radius:var(--radius) var(--radius) 0 0;max-height:85vh;bottom:0;width:100%!important;top:auto!important;left:0!important}.floating-window__handle{display:none}}

package/dist/components/FloatingWindow/FloatingWindow2.js

@@ -0,0 +1,203 @@
+import './FloatingWindow.css';
+import { Icon as tt } from "../Icon/Icon2.js";
+import { Tooltip as N } from "../Tooltip/Tooltip2.js";
+/* empty css               */
+import { useCallback as d, useEffect as Z, useRef as G, useState as g } from "react";
+import { Fragment as nt, jsx as o, jsxs as w } from "react/jsx-runtime";
+import { createPortal as it } from "react-dom";
+var et = [
+  "n",
+  "s",
+  "e",
+  "w",
+  "ne",
+  "nw",
+  "se",
+  "sw"
+], z = 48, x = 16, ct = ({ children: V, className: W = "", closeOnEscape: D = !1, defaultPosition: q, defaultSize: _ = {
+  height: 360,
+  width: 480
+}, footer: R, isOpen: l, minimizable: H = !0, minHeight: y = 140, minWidth: P = 260, onClose: M, onGeometryChange: b, resizable: I = !0, title: J, titleIcon: k, usePortal: K = !0, zIndex: C = 900 }) => {
+  const [e, L] = g(_), [r, h] = g(() => q ?? {
+    x: Math.max(0, (window.innerWidth - _.width) / 2),
+    y: Math.max(0, (window.innerHeight - _.height) / 3)
+  }), [s, S] = g(!1), [a, Q] = g(!1), T = G(null), m = G(null), u = d((t, n) => ({
+    x: Math.min(Math.max(t.x, z - n.width), window.innerWidth - z),
+    y: Math.min(Math.max(t.y, 0), window.innerHeight - z)
+  }), []), $ = d(() => {
+    b?.({
+      ...r,
+      ...e
+    });
+  }, [
+    b,
+    r,
+    e
+  ]), j = d((t, n) => {
+    a || (t.preventDefault(), t.stopPropagation(), t.currentTarget.setPointerCapture(t.pointerId), m.current = {
+      direction: n,
+      pointerId: t.pointerId,
+      startPointer: {
+        x: t.clientX,
+        y: t.clientY
+      },
+      startRect: {
+        ...r,
+        ...e
+      }
+    });
+  }, [
+    a,
+    r,
+    e
+  ]), F = d((t) => {
+    const n = m.current;
+    if (!n || n.pointerId !== t.pointerId) return;
+    const v = t.clientX - n.startPointer.x, E = t.clientY - n.startPointer.y, { startRect: i, direction: c } = n;
+    if (!c) {
+      h(u({
+        x: i.x + v,
+        y: i.y + E
+      }, i));
+      return;
+    }
+    let { height: f, width: p, x: B, y: Y } = i;
+    c.includes("e") && (p = Math.max(P, i.width + v)), c.includes("w") && (p = Math.max(P, i.width - v), B = i.x + (i.width - p)), c.includes("s") && (f = Math.max(y, i.height + E)), c.includes("n") && (f = Math.max(y, i.height - E), Y = i.y + (i.height - f)), L({
+      height: f,
+      width: p
+    }), h({
+      x: B,
+      y: Y
+    });
+  }, [
+    u,
+    y,
+    P
+  ]), U = d((t) => {
+    m.current && (t.currentTarget.releasePointerCapture(t.pointerId), m.current = null, $());
+  }, [$]), X = d(() => {
+    Q((t) => {
+      if (t) {
+        const n = T.current;
+        return n && (h({
+          x: n.x,
+          y: n.y
+        }), L({
+          height: n.height,
+          width: n.width
+        })), !1;
+      }
+      return T.current = {
+        ...r,
+        ...e
+      }, S(!1), !0;
+    });
+  }, [r, e]);
+  if (Z(() => {
+    if (!l || !D) return;
+    const t = (n) => {
+      n.key === "Escape" && M();
+    };
+    return document.addEventListener("keydown", t), () => document.removeEventListener("keydown", t);
+  }, [
+    D,
+    l,
+    M
+  ]), Z(() => {
+    if (!l) return;
+    const t = () => h((n) => u(n, e));
+    return window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
+  }, [
+    u,
+    l,
+    e
+  ]), !l) return null;
+  const O = a ? {
+    "--_window-z": C,
+    height: `calc(100vh - ${x * 2}px)`,
+    left: x,
+    top: x,
+    width: `calc(100vw - ${x * 2}px)`
+  } : {
+    "--_window-z": C,
+    height: s ? void 0 : e.height,
+    left: r.x,
+    top: r.y,
+    width: e.width
+  }, A = /* @__PURE__ */ w("div", {
+    className: [
+      "floating-window",
+      a ? "floating-window--maximized" : "",
+      s ? "floating-window--minimized" : "",
+      W
+    ].filter(Boolean).join(" "),
+    style: O,
+    children: [
+      /* @__PURE__ */ w("div", {
+        className: "floating-window__header",
+        onDoubleClick: I ? X : void 0,
+        onPointerDown: j,
+        onPointerMove: F,
+        onPointerUp: U,
+        children: [/* @__PURE__ */ w("span", {
+          className: "floating-window__title",
+          children: [k && /* @__PURE__ */ o(tt, {
+            name: k,
+            size: "sm"
+          }), J]
+        }), /* @__PURE__ */ w("span", {
+          className: "floating-window__actions",
+          children: [
+            H && /* @__PURE__ */ o(N, {
+              title: s ? "Expand" : "Collapse",
+              children: /* @__PURE__ */ o("button", {
+                className: "floating-window__action",
+                onClick: () => S((t) => !t),
+                onPointerDown: (t) => t.stopPropagation(),
+                type: "button",
+                children: s ? "▢" : "—"
+              })
+            }),
+            I && /* @__PURE__ */ o(N, {
+              title: a ? "Restore" : "Maximize",
+              children: /* @__PURE__ */ o("button", {
+                className: "floating-window__action",
+                onClick: X,
+                onPointerDown: (t) => t.stopPropagation(),
+                type: "button",
+                children: a ? "❐" : "□"
+              })
+            }),
+            /* @__PURE__ */ o(N, {
+              title: "Close",
+              children: /* @__PURE__ */ o("button", {
+                className: "floating-window__action floating-window__action--close",
+                onClick: M,
+                onPointerDown: (t) => t.stopPropagation(),
+                type: "button",
+                children: "✕"
+              })
+            })
+          ]
+        })]
+      }),
+      !s && /* @__PURE__ */ w(nt, { children: [/* @__PURE__ */ o("div", {
+        className: "floating-window__body",
+        children: V
+      }), R && /* @__PURE__ */ o("div", {
+        className: "floating-window__footer",
+        children: R
+      })] }),
+      I && !a && !s && et.map((t) => /* @__PURE__ */ o("span", {
+        className: `floating-window__handle floating-window__handle--${t}`,
+        onPointerDown: (n) => j(n, t),
+        onPointerMove: F,
+        onPointerUp: U
+      }, t))
+    ]
+  });
+  return K ? it(A, document.body) : A;
+};
+export {
+  ct as FloatingWindow
+};

package/dist/components/FolderBrowserModal/FolderBrowserModal.css

@@ -0,0 +1 @@
+.folder-browser__body{gap:var(--spacing-12);padding:var(--spacing-16);flex-direction:column;display:flex}.folder-browser__path-row{align-items:stretch;gap:var(--spacing-8);display:flex}.folder-browser__path{flex:1;min-width:0}.folder-browser__path .input-text-wrapper,.folder-browser__path .input-text{height:100%}.folder-browser__path .input-text{font-family:Cascadia Mono,Courier New,monospace;font-size:var(--font-size-sm)}.folder-browser__path--error .input-text{border-color:var(--rating-color-danger)}.folder-browser__error{color:var(--rating-color-danger);font-size:var(--font-size-sm);margin:0}.folder-browser__list{gap:var(--spacing-2);border:var(--spacing-1) solid var(--card-border-color);border-radius:var(--radius);max-height:48vh;padding:var(--spacing-4);flex-direction:column;display:flex;overflow-y:auto}.folder-browser__loading{padding:var(--spacing-24);justify-content:center;display:flex}.folder-browser__entry{all:unset;box-sizing:border-box;align-items:center;gap:var(--spacing-8);padding:var(--spacing-8) var(--spacing-12);border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast);display:flex}.folder-browser__entry:hover{background:color-mix(in srgb, var(--body-accent-color) 10%, transparent)}.folder-browser__entry:focus-visible{outline:var(--spacing-2) solid var(--button-info-background-color);outline-offset:calc(var(--spacing-2) * -1)}.folder-browser__entry-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--body-title-color);font-size:var(--font-size-sm);flex:1;overflow:hidden}.folder-browser__entry-chevron{color:var(--body-color-muted)}

package/dist/components/FolderBrowserModal/FolderBrowserModal2.js

@@ -0,0 +1,144 @@
+import './FolderBrowserModal.css';
+import { Icon as v } from "../Icon/Icon2.js";
+import { Button as w } from "../Button/Button2.js";
+import { Modal as x } from "../Modal/Modal2.js";
+import { InputText as z } from "../InputText/InputText2.js";
+import { EmptyState as I } from "../EmptyState/EmptyState2.js";
+import { Loading as S } from "../Loading/Loading2.js";
+/* empty css                   */
+import { useCallback as E, useEffect as g, useState as n } from "react";
+import { jsx as o, jsxs as i } from "react/jsx-runtime";
+var G = ({ isOpen: s, title: y = "Select a folder", initialPath: c, loadDirectory: d, onSelect: N, onClose: m, selectLabel: k = "Select this folder" }) => {
+  const [e, f] = n(null), [a, u] = n(!1), [p, h] = n(""), t = E(async (r) => {
+    u(!0);
+    try {
+      f(await d(r));
+    } catch {
+      f({
+        current: r ?? null,
+        parent: null,
+        drives: [],
+        directories: [],
+        error: "Unable to read directory."
+      });
+    } finally {
+      u(!1);
+    }
+  }, [d]);
+  g(() => {
+    s && t(c);
+  }, [
+    s,
+    c,
+    t
+  ]), g(() => {
+    h(e?.current ?? "");
+  }, [e]);
+  const C = () => {
+    e && t(e.parent ?? "");
+  }, b = () => {
+    const r = p.trim();
+    a || r === (e?.current ?? "") || t(r === "" ? void 0 : r);
+  }, l = e?.current === null, _ = l ? e?.drives.map((r) => ({
+    name: r,
+    path: r
+  })) ?? [] : e?.directories ?? [];
+  return /* @__PURE__ */ o(x, {
+    isOpen: s,
+    title: y,
+    onClose: m,
+    size: "medium",
+    className: "folder-browser",
+    primary: {
+      variant: "success",
+      icon: "checkmark",
+      text: k,
+      disabled: l || !e?.current,
+      onClick: () => e?.current && N(e.current)
+    },
+    secondary: {
+      variant: "default",
+      icon: "return",
+      text: "Cancel",
+      onClick: m
+    },
+    children: /* @__PURE__ */ i("div", {
+      className: "folder-browser__body",
+      children: [
+        /* @__PURE__ */ i("div", {
+          className: "folder-browser__path-row",
+          children: [
+            /* @__PURE__ */ o(w, {
+              variant: "default",
+              size: "small",
+              icon: "arrow-up",
+              disabled: a || l,
+              onClick: C,
+              children: "Up"
+            }),
+            /* @__PURE__ */ o("div", {
+              className: `folder-browser__path${e?.error ? " folder-browser__path--error" : ""}`,
+              children: /* @__PURE__ */ o(z, {
+                value: p,
+                placeholder: "Paste or type a folder path, then press Enter",
+                disabled: a,
+                onChange: h,
+                onKeyDown: (r) => r.key === "Enter" && b()
+              })
+            }),
+            /* @__PURE__ */ o(w, {
+              variant: "default",
+              size: "small",
+              icon: "arrow-right",
+              disabled: a,
+              onClick: b,
+              children: "Go"
+            })
+          ]
+        }),
+        e?.error && /* @__PURE__ */ o("p", {
+          className: "folder-browser__error",
+          children: e.error
+        }),
+        /* @__PURE__ */ o("div", {
+          className: "folder-browser__list",
+          children: a ? /* @__PURE__ */ o("div", {
+            className: "folder-browser__loading",
+            children: /* @__PURE__ */ o(S, {})
+          }) : _.length === 0 ? /* @__PURE__ */ o(I, {
+            icon: "folder",
+            title: "No subfolders",
+            description: "This folder has no subfolders. You can still select it."
+          }) : _.map((r) => /* @__PURE__ */ i("button", {
+            type: "button",
+            className: "folder-browser__entry",
+            onDoubleClick: () => {
+              t(r.path);
+            },
+            onClick: () => {
+              t(r.path);
+            },
+            children: [
+              /* @__PURE__ */ o(v, {
+                name: "folder",
+                size: "sm"
+              }),
+              /* @__PURE__ */ o("span", {
+                className: "folder-browser__entry-name",
+                children: r.name
+              }),
+              /* @__PURE__ */ o(v, {
+                className: "folder-browser__entry-chevron",
+                name: "arrow-right",
+                size: "sm"
+              })
+            ]
+          }, r.path))
+        })
+      ]
+    })
+  });
+};
+export {
+  G as FolderBrowserModal
+};

package/dist/components/Grid/Col.js

@@ -0,0 +1,17 @@
+import { jsx as i } from "react/jsx-runtime";
+var n = ({ children: l, className: e = "", span: o = 1, spanMobile: t, spanTablet: r, style: c }) => {
+  const a = {
+    "--_col-span": o,
+    "--_col-span-mobile": t ?? o,
+    "--_col-span-tablet": r ?? o,
+    ...c
+  };
+  return /* @__PURE__ */ i("div", {
+    className: ["grid__col", e].filter(Boolean).join(" "),
+    style: a,
+    children: l
+  });
+};
+export {
+  n as Col
+};

package/dist/components/Grid/Grid.css

@@ -0,0 +1 @@
+.grid{gap:var(--_grid-row-gap) var(--_grid-gap);--_cols-now:var(--_grid-cols);--_track:calc((100% - (var(--_cols-now) - 1) * var(--_grid-gap)) / var(--_cols-now));flex-wrap:wrap;display:flex}.grid--align-start{align-items:flex-start}.grid--align-center{align-items:center}.grid--align-end{align-items:flex-end}.grid--align-stretch{align-items:stretch}.grid--align-baseline{align-items:baseline}.grid--justify-start{justify-content:flex-start}.grid--justify-center{justify-content:center}.grid--justify-end{justify-content:flex-end}.grid--justify-space-between{justify-content:space-between}.grid--justify-space-around{justify-content:space-around}.grid>*{flex:0 0 var(--_track);box-sizing:border-box;min-width:0}.grid>.grid__col{--_span-now:var(--_col-span);--_span-clamped:min(var(--_span-now), var(--_cols-now));flex:0 0 calc(var(--_span-clamped) * var(--_track) + (var(--_span-clamped) - 1) * var(--_grid-gap));box-sizing:border-box;min-width:0}.grid--fluid>*,.grid--fluid>.grid__col{flex:1 1 var(--_grid-min-col)}@media (width>=769px) and (width<=1024px){.grid{--_cols-now:var(--_grid-cols-tablet)}.grid>.grid__col{--_span-now:var(--_col-span-tablet)}}@media (width<=768px){.grid{--_cols-now:var(--_grid-cols-mobile)}.grid>.grid__col{--_span-now:var(--_col-span-mobile)}}

package/dist/components/Grid/Grid2.js

@@ -0,0 +1,28 @@
+import './Grid.css';
+/* empty css     */
+import { jsx as _ } from "react/jsx-runtime";
+var x = (r) => r > 2 ? 2 : r, m = ({ align: r = "stretch", children: a, className: e = "", cols: o = 2, colsMobile: s = 1, colsTablet: l, gap: t = "16", justify: n = "start", minColWidth: i, rowGap: g, style: c }) => {
+  const d = t === "0" ? "0px" : `var(--spacing-${t})`, p = g === void 0 ? d : g === "0" ? "0px" : `var(--spacing-${g})`, v = {
+    "--_grid-cols": o,
+    "--_grid-cols-mobile": s,
+    "--_grid-cols-tablet": l ?? x(o),
+    "--_grid-gap": d,
+    "--_grid-row-gap": p,
+    ...i === void 0 ? {} : { "--_grid-min-col": `${i}px` },
+    ...c
+  };
+  return /* @__PURE__ */ _("div", {
+    className: [
+      "grid",
+      i === void 0 ? "" : "grid--fluid",
+      `grid--align-${r}`,
+      `grid--justify-${n}`,
+      e
+    ].filter(Boolean).join(" "),
+    style: v,
+    children: a
+  });
+};
+export {
+  m as Grid
+};

package/dist/components/Icon/Icon.css

@@ -0,0 +1 @@
+.icon{justify-content:center;align-items:center;display:inline-flex}.icon svg{display:block}.icon--sm{font-size:var(--font-size-sm)}.icon--md{font-size:var(--font-size-md)}.icon--lg{font-size:var(--font-size-lg)}.icon--xl{font-size:var(--font-size-xl)}.icon--xxl{font-size:var(--font-size-xxl)}.icon--xxxl{font-size:var(--font-size-xxxl)}.icon--muted{color:var(--body-color-muted)}.icon--accent{color:var(--body-accent-color)}.icon--info{color:var(--button-info-background-color)}.icon--success{color:var(--button-success-background-color)}.icon--warning{color:var(--button-warning-background-color)}.icon--danger{color:var(--body-danger-color)}.icon--spin svg{animation:1s linear infinite icon-spin}.icon--fade{animation:2s ease-in-out infinite icon-fade}.icon--pulse{animation:1.6s ease-in-out infinite icon-pulse}.icon--spin-hover:hover svg{animation:1s linear infinite icon-spin}.icon--fade-hover:hover{animation:2s ease-in-out infinite icon-fade}.icon--pulse-hover:hover{animation:1.6s ease-in-out infinite icon-pulse}@keyframes icon-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes icon-fade{0%,to{opacity:1}50%{opacity:.4}}@keyframes icon-pulse{0%,to{transform:scale(1)}45%{transform:scale(1.16)}}

package/dist/components/Icon/Icon2.js

@@ -0,0 +1,23 @@
+import './Icon.css';
+/* empty css     */
+import "react";
+import { iconMap as s } from "@memobit/icons/map";
+import { jsx as t } from "react/jsx-runtime";
+var v = ({ className: n = "", fade: c, fadeOnHover: e, name: r, pulse: p, pulseOnHover: m, size: i, spin: f, spinOnHover: l, variant: o }) => /* @__PURE__ */ t("span", {
+  className: [
+    "icon",
+    i ? `icon--${i}` : "",
+    o && o !== "default" ? `icon--${o}` : "",
+    f ? "icon--spin" : "",
+    c ? "icon--fade" : "",
+    p ? "icon--pulse" : "",
+    l ? "icon--spin-hover" : "",
+    e ? "icon--fade-hover" : "",
+    m ? "icon--pulse-hover" : "",
+    n
+  ].filter(Boolean).join(" "),
+  children: s[r]
+});
+export {
+  v as Icon
+};

package/dist/components/IconPicker/IconPicker.css

@@ -0,0 +1 @@
+.icon-picker{gap:var(--spacing-8);width:320px;padding:var(--spacing-12);background-color:var(--card-background-color);border:1px solid var(--card-border-color);border-radius:var(--radius);flex-direction:column;display:flex}.icon-picker__search{width:100%}.icon-picker__grid{gap:var(--spacing-2);max-height:var(--spacing-300);scrollbar-width:thin;flex-wrap:wrap;display:flex;overflow-y:auto}.icon-picker__icon{width:var(--spacing-40);height:var(--spacing-40);font-size:var(--font-size-lg);border-radius:var(--radius-sm);color:var(--body-color);cursor:pointer;transition:background-color var(--transition-fast);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;line-height:1;display:flex}.icon-picker__icon:hover{background-color:var(--button-default-hover-background-color)}.icon-picker__icon.is-selected{background-color:var(--button-default-hover-background-color);border-color:var(--body-accent-color)}.icon-picker__empty{width:100%;padding:var(--spacing-12) 0;text-align:center;font-size:var(--font-size-sm);color:var(--body-color-muted)}.icon-picker__count{text-align:right;font-size:var(--font-size-xxs);color:var(--body-color-muted);margin:0}

package/dist/components/IconPicker/IconPicker2.js

@@ -0,0 +1,51 @@
+import './IconPicker.css';
+import { Icon as f } from "../Icon/Icon2.js";
+import { InputSearch as g } from "../InputSearch/InputSearch2.js";
+/* empty css           */
+import { useMemo as a, useState as k } from "react";
+import { iconMap as v } from "@memobit/icons/map";
+import { jsx as c, jsxs as N } from "react/jsx-runtime";
+import { iconAliases as S } from "@memobit/icons";
+var b = Object.keys(v), w = ({ color: s, emptyLabel: p = "No icons match", icons: n, onChange: m, placeholder: h = "Search icons...", value: d }) => {
+  const [o, u] = k(""), t = a(() => n ?? b, [n]), i = a(() => {
+    const e = o.trim().toLowerCase();
+    if (!e) return t;
+    const _ = e.replace(/[\s-]+/g, ""), l = (r) => r.includes(e) || r.replace(/-/g, "").includes(_);
+    return t.filter((r) => l(r) || (S[r] ?? []).some(l));
+  }, [t, o]);
+  return /* @__PURE__ */ N("div", {
+    className: "icon-picker",
+    children: [
+      /* @__PURE__ */ c("div", {
+        className: "icon-picker__search",
+        children: /* @__PURE__ */ c(g, {
+          autoFocus: !0,
+          onChange: u,
+          placeholder: h,
+          value: o
+        })
+      }),
+      /* @__PURE__ */ c("div", {
+        className: "icon-picker__grid",
+        children: i.length === 0 ? /* @__PURE__ */ c("p", {
+          className: "icon-picker__empty",
+          children: p
+        }) : i.map((e) => /* @__PURE__ */ c("button", {
+          className: `icon-picker__icon${d === e ? " is-selected" : ""}`,
+          onClick: () => m?.(e),
+          style: s ? { color: s } : void 0,
+          title: e,
+          type: "button",
+          children: /* @__PURE__ */ c(f, { name: e })
+        }, e))
+      }),
+      /* @__PURE__ */ c("p", {
+        className: "icon-picker__count",
+        children: i.length === t.length ? `${t.length} icons` : `${i.length} of ${t.length}`
+      })
+    ]
+  });
+};
+export {
+  w as IconPicker
+};

package/dist/components/InfiniteScroll/InfiniteScroll.css

@@ -0,0 +1 @@
+.infinite-scroll{box-sizing:border-box;width:100%;position:relative;overflow:hidden auto}.infinite-scroll__sentinel{visibility:hidden;pointer-events:none;width:100%;height:1px}.infinite-scroll__loader{justify-content:center;align-items:center;gap:var(--spacing-8);padding:var(--spacing-16) var(--spacing-12);width:100%;display:flex}.infinite-scroll__spinner{width:var(--spacing-20);height:var(--spacing-20);border-radius:var(--radius-full);border:2px solid var(--loader-border-color,#0891b233);border-top-color:var(--loader-border-top-color,#0891b2);flex-shrink:0;animation:.7s linear infinite infinite-scroll-spin}.infinite-scroll__loader-text{font-size:var(--font-size-sm);color:var(--body-color-muted)}.infinite-scroll__end{padding:var(--spacing-16) var(--spacing-12);font-size:var(--font-size-sm);color:var(--body-color-muted);justify-content:center;align-items:center;width:100%;display:flex}@keyframes infinite-scroll-spin{to{transform:rotate(360deg)}}

package/dist/components/InfiniteScroll/InfiniteScroll2.js

@@ -0,0 +1,66 @@
+import './InfiniteScroll.css';
+import { Loading as j } from "../Loading/Loading2.js";
+/* empty css               */
+import { useCallback as A, useEffect as b, useRef as u } from "react";
+import { jsx as t, jsxs as R } from "react/jsx-runtime";
+var k = ({ children: E, onLoadMore: a, hasMore: f, isLoading: i = !1, threshold: d = 0, rootMargin: v = "0px", height: m, onScrollChange: p, endMessage: _, className: x }) => {
+  const c = u(null), N = u(null), l = u(null), s = A(() => {
+    const e = c.current;
+    if (!e) return;
+    const { scrollTop: n, scrollHeight: r, clientHeight: o } = e, I = {
+      scrollTop: n,
+      scrollHeight: r,
+      clientHeight: o,
+      scrollPercent: r <= o ? 100 : Math.round(n / (r - o) * 100),
+      isAtTop: n === 0,
+      isAtBottom: n + o >= r - 1
+    };
+    p?.(I);
+  }, [p]);
+  return b(() => {
+    const e = N.current, n = c.current;
+    if (!(!e || !n))
+      return l.current?.disconnect(), l.current = new IntersectionObserver(([r]) => {
+        r.isIntersecting && f && !i && a();
+      }, {
+        root: n,
+        rootMargin: v,
+        threshold: d
+      }), l.current.observe(e), () => l.current?.disconnect();
+  }, [
+    f,
+    i,
+    a,
+    v,
+    d
+  ]), b(() => {
+    const e = c.current;
+    if (e)
+      return e.addEventListener("scroll", s, { passive: !0 }), s(), () => e.removeEventListener("scroll", s);
+  }, [s]), /* @__PURE__ */ R("div", {
+    ref: c,
+    className: `infinite-scroll${x ? ` ${x}` : ""}`,
+    style: m !== void 0 ? { height: m } : void 0,
+    children: [
+      E,
+      /* @__PURE__ */ t("div", {
+        ref: N,
+        className: "infinite-scroll__sentinel"
+      }),
+      i && /* @__PURE__ */ R("div", {
+        className: "infinite-scroll__loader",
+        children: [/* @__PURE__ */ t("div", { className: "infinite-scroll__spinner" }), /* @__PURE__ */ t("span", {
+          className: "infinite-scroll__loader-text",
+          children: /* @__PURE__ */ t(j, {})
+        })]
+      }),
+      !f && !i && _ && /* @__PURE__ */ t("div", {
+        className: "infinite-scroll__end",
+        children: _
+      })
+    ]
+  });
+};
+export {
+  k as InfiniteScroll
+};

package/dist/components/InputDate/InputDate.css

@@ -0,0 +1 @@
+.input-date-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-date-wrapper .input-date-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-date-wrapper .input-date-label .input-date-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-date-wrapper .input-date{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-date-wrapper .input-date:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-date-wrapper .input-date::placeholder{color:var(--form-control-placeholder-color)}.input-date-wrapper .input-date::-webkit-calendar-picker-indicator{display:none}.input-date-wrapper .input-date{padding-right:var(--spacing-40)}.input-date-wrapper .input-date--clearable{padding-right:calc(var(--spacing-40) + var(--spacing-24))}.input-date-wrapper .input-date.input-date-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-date-wrapper .input-date.input-date-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-date-wrapper .input-date.input-date-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-date-wrapper .input-date.input-date-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-date-wrapper.input-date-highlighted .input-date{border-color:var(--form-control-focus-border-color)}.input-date-wrapper .input-date-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-date-wrapper .input-date-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}.input-date-field{width:100%;position:relative}.input-date-actions{right:var(--spacing-8);align-items:center;gap:var(--spacing-2);z-index:2;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.input-date-clear,.input-date-picker{padding:var(--spacing-4);cursor:pointer;border-radius:var(--radius-sm);color:var(--form-control-placeholder-color);transition:color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.input-date-clear:hover:not(:disabled),.input-date-picker:hover:not(:disabled){color:var(--form-control-color)}.input-date-clear:focus,.input-date-picker:focus{color:var(--form-control-focus-border-color);outline:none}.input-date-clear:disabled,.input-date-picker:disabled{cursor:not-allowed;opacity:.5}