@loopr-ai/craft 0.2.0 → 0.3.0

package/dist/components/cell/Typography/index.js

@@ -1,9 +1,9 @@
 import { jsx as f } from "react/jsx-runtime";
 import { getColorToHex as O } from "../../../global/colors.js";
 import { fontCustomizations as j } from "../../../global/theme.js";
-import { a as b, _ as p, b as W, i as M, g as _, c as d, P as r } from "../../../createTheme-eb26b87a.js";
+import { a as b, _ as p, b as W, i as M, g as _, c as d, P as r } from "../../../createTheme-95c30431.js";
 import * as $ from "react";
-import { g as N, s as R, a as U, c as A, b as E } from "../../../styled-b8bfdd6b.js";
+import { g as N, s as R, a as U, c as A, b as E } from "../../../styled-05df7dc6.js";
 const k = ["sx"], z = (o) => {
   var t, a;
   const n = {

package/dist/createSvgIcon-5dcb7caa.js

@@ -0,0 +1,184 @@
+import { g as b, c as h, a as w, _ as y, P as o } from "./createTheme-95c30431.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-05df7dc6.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-95c30431.js}

@@ -2207,8 +2207,8 @@ 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,

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

@@ -1,4 +1,4 @@
-import { _ as n } from "./createTheme-eb26b87a.js";
+import { _ as n } from "./createTheme-95c30431.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-95c30431.js";
 const f = {
   50: "#fffde7",
   100: "#fff9c4",

package/dist/main.d.ts

@@ -1,7 +1,9 @@
+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";
+export { Button, ProgressBar, Search, Chip, Typography, AvatarGroup, };
 export * from "./global/interfaces";
 export * from "./providers";

package/dist/main.js

@@ -1,12 +1,16 @@
-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 d } from "./components/cell/Typography/index.js";
-import { default as u } from "./providers/CraftThemeProvider.js";
+import { default as e } from "./components/cell/Chip/index.js";
+import { default as t } from "./components/cell/Button/index.js";
+import { default as p } from "./components/cell/ProgressBar/index.js";
+import { default as u } from "./components/cell/Search/index.js";
+import { default as m } from "./components/cell/Typography/index.js";
+import { default as x } from "./components/cell/AvatarGroup/index.js";
+import { default as g } from "./providers/CraftThemeProvider.js";
 export {
-  a as Button,
-  u as CraftThemeProvider,
-  t as ProgressBar,
-  p as Search,
-  d as Typography
+  x as AvatarGroup,
+  t as Button,
+  e as Chip,
+  g as CraftThemeProvider,
+  p as ProgressBar,
+  u as Search,
+  m as Typography
 };

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, m as V } from "../createTheme-95c30431.js";
+import { c as b, a as g, T as f } from "../useThemeWithoutDefault-188598a8.js";
+import { e as v } from "../exactProp-a28c53c1.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
 };

package/dist/{styled-b8bfdd6b.js → styled-05df7dc6.js}

@@ -1,4 +1,4 @@
-import { _ as E, g as we, h as re, a as ne, c as z, s as Ce, e as xe } from "./createTheme-eb26b87a.js";
+import { _ as E, g as we, h as re, a as ne, c as z, s as Ce, f as xe } from "./createTheme-95c30431.js";
 import { m as ke, w as Oe, a as $e, g as Ae, s as Fe, r as Me, b as Ie, i as Le, c as Ne, T as oe } from "./useThemeWithoutDefault-188598a8.js";
 import * as F from "react";
 var j = { exports: {} }, f = {};

package/dist/unsupportedProp-3dbf01f6.js

@@ -0,0 +1,9 @@
+function p(n, e, t, u, o) {
+  if (process.env.NODE_ENV === "production")
+    return null;
+  const r = o || e;
+  return typeof n[e] < "u" ? new Error(`The prop \`${r}\` is not supported. Please remove it.`) : null;
+}
+export {
+  p as u
+};

package/dist/{useTheme-a9e2b32c.js → useTheme-462e5dc6.js}

@@ -1,5 +1,5 @@
 import * as o from "react";
-import { u as r, d as s } from "./styled-b8bfdd6b.js";
+import { u as r, d as s } from "./styled-05df7dc6.js";
 import { T as t } from "./useThemeWithoutDefault-188598a8.js";
 function a() {
   const e = r(s);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loopr-ai/craft",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Component library based out of Material UI customized to support Loopr AI products",
   "homepage": "https://loopr.ai",
   "author": {