@loopr-ai/craft 0.2.0 → 0.4.0

package/dist/createSvgIcon-3bff5571.js

@@ -0,0 +1,157 @@
+import { _ as I, C as y, c as $, j as S } from "./createTheme-f511f0cd.js";
+import { c as N } from "./createSvgIcon-bd01dddd.js";
+import { s as w, c as T, b as C, u as D, a as R } from "./TransitionGroupContext-adf68f00.js";
+import * as u from "react";
+import { u as x } from "./unsupportedProp-3dbf01f6.js";
+function V(...e) {
+  return e.reduce((t, n) => n == null ? t : function(...o) {
+    t.apply(this, o), n.apply(this, o);
+  }, () => {
+  });
+}
+function M(e, t = 166) {
+  let n;
+  function r(...o) {
+    const s = () => {
+      e.apply(this, o);
+    };
+    clearTimeout(n), n = setTimeout(s, t);
+  }
+  return r.clear = () => {
+    clearTimeout(n);
+  }, r;
+}
+function q(e, t) {
+  return process.env.NODE_ENV === "production" ? () => null : (n, r, o, s, i) => {
+    const c = o || "<<anonymous>>", l = i || r;
+    return typeof n[r] < "u" ? new Error(`The ${s} \`${l}\` of \`${c}\` is deprecated. ${t}`) : null;
+  };
+}
+function O(e, t) {
+  return /* @__PURE__ */ u.isValidElement(e) && t.indexOf(e.type.muiName) !== -1;
+}
+function b(e) {
+  return e && e.ownerDocument || document;
+}
+function F(e) {
+  return b(e).defaultView || window;
+}
+function j(e, t) {
+  if (process.env.NODE_ENV === "production")
+    return () => null;
+  const n = t ? I({}, t.propTypes) : null;
+  return (o) => (s, i, c, l, a, ..._) => {
+    const d = a || i, p = n == null ? void 0 : n[d];
+    if (p) {
+      const m = p(s, i, c, l, a, ..._);
+      if (m)
+        return m;
+    }
+    return typeof s[i] < "u" && !s[o] ? new Error(`The prop \`${d}\` of \`${e}\` can only be used together with the \`${o}\` prop.`) : null;
+  };
+}
+let h = 0;
+function k(e) {
+  const [t, n] = u.useState(e), r = e || t;
+  return u.useEffect(() => {
+    t == null && (h += 1, n(`mui-${h}`));
+  }, [t]), r;
+}
+const g = u["useId".toString()];
+function G(e) {
+  if (g !== void 0) {
+    const t = g();
+    return e ?? t;
+  }
+  return k(e);
+}
+function P({
+  controlled: e,
+  default: t,
+  name: n,
+  state: r = "value"
+}) {
+  const {
+    current: o
+  } = u.useRef(e !== void 0), [s, i] = u.useState(t), c = o ? e : s;
+  if (process.env.NODE_ENV !== "production") {
+    u.useEffect(() => {
+      o !== (e !== void 0) && console.error([`MUI: A component is changing the ${o ? "" : "un"}controlled ${r} state of ${n} to be ${o ? "un" : ""}controlled.`, "Elements should not switch from uncontrolled to controlled (or vice versa).", `Decide between using a controlled or uncontrolled ${n} element for the lifetime of the component.`, "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.", "More info: https://fb.me/react-controlled-components"].join(`
+`));
+    }, [r, n, e]);
+    const {
+      current: a
+    } = u.useRef(t);
+    u.useEffect(() => {
+      !o && a !== t && console.error([`MUI: A component is changing the default ${r} state of an uncontrolled ${n} after being initialized. To suppress this warning opt to use a controlled ${n}.`].join(`
+`));
+    }, [JSON.stringify(t)]);
+  }
+  const l = u.useCallback((a) => {
+    o || i(a);
+  }, []);
+  return [c, l];
+}
+const U = {
+  configure: (e) => {
+    process.env.NODE_ENV !== "production" && console.warn(["MUI: `ClassNameGenerator` import from `@mui/material/utils` is outdated and might cause unexpected issues.", "", "You should use `import { unstable_ClassNameGenerator } from '@mui/material/className'` instead", "", "The detail of the issue: https://github.com/mui/material-ui/issues/30011#issuecomment-1024993401", "", "The updated documentation: https://mui.com/guides/classname-generator/"].join(`
+`)), y.configure(e);
+  }
+}, z = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  capitalize: $,
+  createChainedFunction: V,
+  createSvgIcon: N,
+  debounce: M,
+  deprecatedPropType: q,
+  isMuiElement: O,
+  ownerDocument: b,
+  ownerWindow: F,
+  requirePropFactory: j,
+  setRef: w,
+  unstable_ClassNameGenerator: U,
+  unstable_useEnhancedEffect: T,
+  unstable_useId: G,
+  unsupportedProp: x,
+  useControlled: P,
+  useEventCallback: C,
+  useForkRef: D,
+  useIsFocusVisible: R
+}, Symbol.toStringTag, { value: "Module" }));
+var E = { exports: {} };
+(function(e) {
+  function t(n) {
+    return n && n.__esModule ? n : {
+      default: n
+    };
+  }
+  e.exports = t, e.exports.__esModule = !0, e.exports.default = e.exports;
+})(E);
+var H = E.exports, f = {};
+const A = /* @__PURE__ */ S(z);
+var v;
+function K() {
+  return v || (v = 1, function(e) {
+    "use client";
+    Object.defineProperty(e, "__esModule", {
+      value: !0
+    }), Object.defineProperty(e, "default", {
+      enumerable: !0,
+      get: function() {
+        return t.createSvgIcon;
+      }
+    });
+    var t = A;
+  }(f)), f;
+}
+export {
+  F as a,
+  O as b,
+  V as c,
+  M as d,
+  G as e,
+  H as i,
+  b as o,
+  K as r,
+  P as u
+};

package/dist/createSvgIcon-bd01dddd.js

@@ -0,0 +1,184 @@
+import { g as b, c as h, a as w, _ as y, P as o } from "./createTheme-f511f0cd.js";
+import * as v from "react";
+import { jsxs as C, jsx as z } from "react/jsx-runtime";
+import { g as T, s as N, a as R, c as O, b as B } from "./styled-9f5c49f8.js";
+function j(e) {
+  return b("MuiSvgIcon", e);
+}
+T("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
+const A = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"], E = (e) => {
+  const {
+    color: n,
+    fontSize: t,
+    classes: r
+  } = e, i = {
+    root: ["root", n !== "inherit" && `color${h(n)}`, `fontSize${h(t)}`]
+  };
+  return B(i, j, r);
+}, V = N("svg", {
+  name: "MuiSvgIcon",
+  slot: "Root",
+  overridesResolver: (e, n) => {
+    const {
+      ownerState: t
+    } = e;
+    return [n.root, t.color !== "inherit" && n[`color${h(t.color)}`], n[`fontSize${h(t.fontSize)}`]];
+  }
+})(({
+  theme: e,
+  ownerState: n
+}) => {
+  var t, r, i, d, f, c, g, u, m, s, a, p, l;
+  return {
+    userSelect: "none",
+    width: "1em",
+    height: "1em",
+    display: "inline-block",
+    // the <svg> will define the property that has `currentColor`
+    // e.g. heroicons uses fill="none" and stroke="currentColor"
+    fill: n.hasSvgAsChild ? void 0 : "currentColor",
+    flexShrink: 0,
+    transition: (t = e.transitions) == null || (r = t.create) == null ? void 0 : r.call(t, "fill", {
+      duration: (i = e.transitions) == null || (i = i.duration) == null ? void 0 : i.shorter
+    }),
+    fontSize: {
+      inherit: "inherit",
+      small: ((d = e.typography) == null || (f = d.pxToRem) == null ? void 0 : f.call(d, 20)) || "1.25rem",
+      medium: ((c = e.typography) == null || (g = c.pxToRem) == null ? void 0 : g.call(c, 24)) || "1.5rem",
+      large: ((u = e.typography) == null || (m = u.pxToRem) == null ? void 0 : m.call(u, 35)) || "2.1875rem"
+    }[n.fontSize],
+    // TODO v5 deprecate, v6 remove for sx
+    color: (s = (a = (e.vars || e).palette) == null || (a = a[n.color]) == null ? void 0 : a.main) != null ? s : {
+      action: (p = (e.vars || e).palette) == null || (p = p.action) == null ? void 0 : p.active,
+      disabled: (l = (e.vars || e).palette) == null || (l = l.action) == null ? void 0 : l.disabled,
+      inherit: void 0
+    }[n.color]
+  };
+}), S = /* @__PURE__ */ v.forwardRef(function(n, t) {
+  const r = R({
+    props: n,
+    name: "MuiSvgIcon"
+  }), {
+    children: i,
+    className: d,
+    color: f = "inherit",
+    component: c = "svg",
+    fontSize: g = "medium",
+    htmlColor: u,
+    inheritViewBox: m = !1,
+    titleAccess: s,
+    viewBox: a = "0 0 24 24"
+  } = r, p = w(r, A), l = /* @__PURE__ */ v.isValidElement(i) && i.type === "svg", $ = y({}, r, {
+    color: f,
+    component: c,
+    fontSize: g,
+    instanceFontSize: n.fontSize,
+    inheritViewBox: m,
+    viewBox: a,
+    hasSvgAsChild: l
+  }), x = {};
+  m || (x.viewBox = a);
+  const I = E($);
+  return /* @__PURE__ */ C(V, y({
+    as: c,
+    className: O(I.root, d),
+    focusable: "false",
+    color: u,
+    "aria-hidden": s ? void 0 : !0,
+    role: s ? "img" : void 0,
+    ref: t
+  }, x, p, l && i.props, {
+    ownerState: $,
+    children: [l ? i.props.children : i, s ? /* @__PURE__ */ z("title", {
+      children: s
+    }) : null]
+  }));
+});
+process.env.NODE_ENV !== "production" && (S.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * Node passed into the SVG element.
+   */
+  children: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
+   * You can use the `htmlColor` prop to apply a color attribute to the SVG element.
+   * @default 'inherit'
+   */
+  color: o.oneOfType([o.oneOf(["inherit", "action", "disabled", "primary", "secondary", "error", "info", "success", "warning"]), o.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: o.elementType,
+  /**
+   * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
+   * @default 'medium'
+   */
+  fontSize: o.oneOfType([o.oneOf(["inherit", "large", "medium", "small"]), o.string]),
+  /**
+   * Applies a color attribute to the SVG element.
+   */
+  htmlColor: o.string,
+  /**
+   * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`
+   * prop will be ignored.
+   * Useful when you want to reference a custom `component` and have `SvgIcon` pass that
+   * `component`'s viewBox to the root node.
+   * @default false
+   */
+  inheritViewBox: o.bool,
+  /**
+   * The shape-rendering attribute. The behavior of the different options is described on the
+   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).
+   * If you are having issues with blurry icons you should investigate this prop.
+   */
+  shapeRendering: o.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
+  /**
+   * Provides a human-readable title for the element that contains it.
+   * https://www.w3.org/TR/SVG-access/#Equivalent
+   */
+  titleAccess: o.string,
+  /**
+   * Allows you to redefine what the coordinates without units mean inside an SVG element.
+   * For example, if the SVG element is 500 (width) by 200 (height),
+   * and you pass viewBox="0 0 50 20",
+   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
+   * to bottom right (50,20) and each unit will be worth 10px.
+   * @default '0 0 24 24'
+   */
+  viewBox: o.string
+});
+S.muiName = "SvgIcon";
+const _ = S;
+function D(e, n) {
+  function t(r, i) {
+    return /* @__PURE__ */ z(_, y({
+      "data-testid": `${n}Icon`,
+      ref: i
+    }, r, {
+      children: e
+    }));
+  }
+  return process.env.NODE_ENV !== "production" && (t.displayName = `${n}Icon`), t.muiName = _.muiName, /* @__PURE__ */ v.memo(/* @__PURE__ */ v.forwardRef(t));
+}
+export {
+  D as c
+};

package/dist/{createTheme-eb26b87a.js → createTheme-f511f0cd.js}

@@ -2207,15 +2207,15 @@ export {
   Ge as b,
   bt as c,
   qr as d,
-  En as e,
-  On as f,
+  On as e,
+  En as f,
   Ft as g,
   zr as h,
   oe as i,
-  It as j,
-  ae as k,
+  vn as j,
+  It as k,
   Fr as l,
-  F as m,
-  vn as n,
+  ae as m,
+  F as n,
   xt as s
 };

package/dist/{exactProp-0925aa6f.js → exactProp-ed2da606.js}

@@ -1,4 +1,4 @@
-import { _ as n } from "./createTheme-eb26b87a.js";
+import { _ as n } from "./createTheme-f511f0cd.js";
 const s = "exact-prop: ​";
 function u(e) {
   return process.env.NODE_ENV === "production" ? e : n({}, e, {

package/dist/global/theme.js

@@ -1,5 +1,5 @@
 import "../assets/theme.css";
-import { e } from "../createTheme-eb26b87a.js";
+import { f as e } from "../createTheme-f511f0cd.js";
 const f = {
   50: "#fffde7",
   100: "#fff9c4",

package/dist/main.d.ts

@@ -1,7 +1,10 @@
+import Chip from "./components/cell/Chip";
 import Button from "./components/cell/Button";
 import ProgressBar from "./components/cell/ProgressBar";
 import Search from "./components/cell/Search";
 import Typography from "./components/cell/Typography";
-export { Button, ProgressBar, Search, Typography };
+import AvatarGroup from "./components/cell/AvatarGroup";
+import ZoomControlWithDrag from "./components/organ/ZoomControlWithDrag";
+export { Button, ProgressBar, Search, Chip, Typography, AvatarGroup, ZoomControlWithDrag, };
 export * from "./global/interfaces";
 export * from "./providers";

package/dist/main.js

@@ -1,12 +1,18 @@
-import { default as a } from "./components/cell/Button/index.js";
-import { default as t } from "./components/cell/ProgressBar/index.js";
-import { default as p } from "./components/cell/Search/index.js";
+import { default as a } from "./components/cell/Chip/index.js";
+import { default as e } from "./components/cell/Button/index.js";
+import { default as p } from "./components/cell/ProgressBar/index.js";
+import { default as s } from "./components/cell/Search/index.js";
 import { default as d } from "./components/cell/Typography/index.js";
-import { default as u } from "./providers/CraftThemeProvider.js";
+import { default as x } from "./components/cell/AvatarGroup/index.js";
+import { default as g } from "./components/organ/ZoomControlWithDrag/index.js";
+import { default as C } from "./providers/CraftThemeProvider.js";
 export {
-  a as Button,
-  u as CraftThemeProvider,
-  t as ProgressBar,
-  p as Search,
-  d as Typography
+  x as AvatarGroup,
+  e as Button,
+  a as Chip,
+  C as CraftThemeProvider,
+  p as ProgressBar,
+  s as Search,
+  d as Typography,
+  g as ZoomControlWithDrag
 };

package/dist/providers/CraftThemeProvider.d.ts

@@ -1,6 +1,6 @@
-import { Theme } from '@mui/material/styles';
-import React from 'react';
-import { CraftFC } from '../global/interfaces';
+import { Theme } from "@mui/material/styles";
+import React from "react";
+import { CraftFC } from "../global/interfaces";
 interface CraftThemeProviderProps {
     children: React.ReactNode;
     theme?: Theme;

package/dist/providers/CraftThemeProvider.js

@@ -1,37 +1,38 @@
 import { jsx as u } from "react/jsx-runtime";
-import { defaultTheme as f } from "../global/theme.js";
-import { P as n, _ as c, a as D, e as a, m as j } from "../createTheme-eb26b87a.js";
 import * as p from "react";
-import { c as V, a as b, T } from "../useThemeWithoutDefault-188598a8.js";
-import { e as E } from "../exactProp-0925aa6f.js";
-const N = /* @__PURE__ */ p.createContext(null);
-process.env.NODE_ENV !== "production" && (N.displayName = "ThemeContext");
-const y = N;
-function _() {
-  const o = p.useContext(y);
-  return process.env.NODE_ENV !== "production" && p.useDebugValue(o), o;
+import { useMemo as O } from "react";
+import { defaultTheme as P } from "../global/theme.js";
+import { P as n, _ as c, a as D, f as j, n as V } from "../createTheme-f511f0cd.js";
+import { c as b, a as g, T as f } from "../useThemeWithoutDefault-188598a8.js";
+import { e as v } from "../exactProp-ed2da606.js";
+const l = /* @__PURE__ */ p.createContext(null);
+process.env.NODE_ENV !== "production" && (l.displayName = "ThemeContext");
+const E = l;
+function N() {
+  const e = p.useContext(E);
+  return process.env.NODE_ENV !== "production" && p.useDebugValue(e), e;
 }
-const g = typeof Symbol == "function" && Symbol.for, x = g ? Symbol.for("mui.nested") : "__THEME_NESTED__";
-function M(o, t) {
+const M = typeof Symbol == "function" && Symbol.for, x = M ? Symbol.for("mui.nested") : "__THEME_NESTED__";
+function C(e, t) {
   if (typeof t == "function") {
-    const e = t(o);
-    return process.env.NODE_ENV !== "production" && (e || console.error(["MUI: You should return an object from your theme function, i.e.", "<ThemeProvider theme={() => ({})} />"].join(`
-`))), e;
+    const o = t(e);
+    return process.env.NODE_ENV !== "production" && (o || console.error(["MUI: You should return an object from your theme function, i.e.", "<ThemeProvider theme={() => ({})} />"].join(`
+`))), o;
   }
-  return c({}, o, t);
+  return c({}, e, t);
 }
-function d(o) {
+function d(e) {
   const {
     children: t,
-    theme: e
-  } = o, r = _();
-  process.env.NODE_ENV !== "production" && r === null && typeof e == "function" && console.error(["MUI: You are providing a theme function prop to the ThemeProvider component:", "<ThemeProvider theme={outerTheme => outerTheme} />", "", "However, no outer theme is present.", "Make sure a theme is already injected higher in the React tree or provide a theme object."].join(`
+    theme: o
+  } = e, r = N();
+  process.env.NODE_ENV !== "production" && r === null && typeof o == "function" && console.error(["MUI: You are providing a theme function prop to the ThemeProvider component:", "<ThemeProvider theme={outerTheme => outerTheme} />", "", "However, no outer theme is present.", "Make sure a theme is already injected higher in the React tree or provide a theme object."].join(`
 `));
   const i = p.useMemo(() => {
-    const s = r === null ? e : M(r, e);
+    const s = r === null ? o : C(r, o);
     return s != null && (s[x] = r !== null), s;
-  }, [e, r]);
-  return /* @__PURE__ */ u(y.Provider, {
+  }, [o, r]);
+  return /* @__PURE__ */ u(E.Provider, {
     value: i,
     children: t
   });
@@ -46,34 +47,34 @@ process.env.NODE_ENV !== "production" && (d.propTypes = {
    */
   theme: n.oneOfType([n.object, n.func]).isRequired
 });
-process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "production" && (d.propTypes = E(d.propTypes));
-const v = {};
-function l(o, t, e, r = !1) {
+process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "production" && (d.propTypes = v(d.propTypes));
+const a = {};
+function T(e, t, o, r = !1) {
   return p.useMemo(() => {
-    const i = o && t[o] || t;
-    if (typeof e == "function") {
-      const s = e(i), m = o ? c({}, t, {
-        [o]: s
+    const i = e && t[e] || t;
+    if (typeof o == "function") {
+      const s = o(i), m = e ? c({}, t, {
+        [e]: s
       }) : s;
       return r ? () => m : m;
     }
-    return o ? c({}, t, {
-      [o]: e
-    }) : c({}, t, e);
-  }, [o, t, e, r]);
+    return e ? c({}, t, {
+      [e]: o
+    }) : c({}, t, o);
+  }, [e, t, o, r]);
 }
-function h(o) {
+function h(e) {
   const {
     children: t,
-    theme: e,
+    theme: o,
     themeId: r
-  } = o, i = V(v), s = _() || v;
-  process.env.NODE_ENV !== "production" && (i === null && typeof e == "function" || r && i && !i[r] && typeof e == "function") && console.error(["MUI: You are providing a theme function prop to the ThemeProvider component:", "<ThemeProvider theme={outerTheme => outerTheme} />", "", "However, no outer theme is present.", "Make sure a theme is already injected higher in the React tree or provide a theme object."].join(`
+  } = e, i = b(a), s = N() || a;
+  process.env.NODE_ENV !== "production" && (i === null && typeof o == "function" || r && i && !i[r] && typeof o == "function") && console.error(["MUI: You are providing a theme function prop to the ThemeProvider component:", "<ThemeProvider theme={outerTheme => outerTheme} />", "", "However, no outer theme is present.", "Make sure a theme is already injected higher in the React tree or provide a theme object."].join(`
 `));
-  const m = l(r, i, e), P = l(r, s, e, !0);
+  const m = T(r, i, o), _ = T(r, s, o, !0);
   return /* @__PURE__ */ u(d, {
-    theme: P,
-    children: /* @__PURE__ */ u(b.Provider, {
+    theme: _,
+    children: /* @__PURE__ */ u(g.Provider, {
       value: m,
       children: t
     })
@@ -97,19 +98,19 @@ process.env.NODE_ENV !== "production" && (h.propTypes = {
    */
   themeId: n.string
 });
-process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "production" && (h.propTypes = E(h.propTypes));
-const C = ["theme"];
-function O(o) {
+process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "production" && (h.propTypes = v(h.propTypes));
+const R = ["theme"];
+function y(e) {
   let {
     theme: t
-  } = o, e = D(o, C);
-  const r = t[T];
-  return /* @__PURE__ */ u(h, c({}, e, {
-    themeId: r ? T : void 0,
+  } = e, o = D(e, R);
+  const r = t[f];
+  return /* @__PURE__ */ u(h, c({}, o, {
+    themeId: r ? f : void 0,
     theme: r || t
   }));
 }
-process.env.NODE_ENV !== "production" && (O.propTypes = {
+process.env.NODE_ENV !== "production" && (y.propTypes = {
   /**
    * Your component tree.
    */
@@ -119,10 +120,16 @@ process.env.NODE_ENV !== "production" && (O.propTypes = {
    */
   theme: n.oneOfType([n.object, n.func]).isRequired
 });
-const q = ({ children: o, theme: t }) => {
-  let e;
-  return t ? e = a(j(f, t)) : e = a(f), /* @__PURE__ */ u(O, { theme: e, children: o });
+const k = ({
+  children: e,
+  theme: t = {}
+}) => {
+  const o = O(
+    () => j(V(P, t)),
+    [t]
+  );
+  return /* @__PURE__ */ u(y, { theme: o, children: e });
 };
 export {
-  q as default
+  k as default
 };