@loopr-ai/craft 0.1.0 → 0.2.0

package/dist/components/cell/ProgressBar/index.d.ts

@@ -0,0 +1,27 @@
+import { LinearProgressProps as MuiLinearProgressProps } from "@mui/material/LinearProgress";
+import { CraftFC } from "../../../global/interfaces";
+/**
+ * This ProgressBar Component is a wrapper of MuiLinearProgress Component with some custom styles for the look props
+ * @param value The value of the progress indicator should be between 0 and 100 (inclusive)
+ * @param extrapolateColor A function that returns a color string based on the value of the progress indicator
+ * @param trackColor The color of the track
+ */
+export interface ProgressBarProps extends MuiLinearProgressProps {
+    /**
+     * The function that returns a color string based on the value of the progress indicator
+     * example:
+     * ```tsx
+     * function extrapolateColor(value: number) {
+     *return value >= 55 ? "red" : "green";
+     *}
+     *<ProgressBar value={55} extrapolateColor={extrapolateColor} trackColor="purple"></ProgressBar>
+      * ```
+     */
+    extrapolateColor?: (value: number) => string;
+    trackColor?: string;
+}
+/**
+ * This ProgressBar Component is a wrapper of MuiLinearProgress Component with some custom styles for the look props
+ */
+declare const ProgressBar: CraftFC<ProgressBarProps>;
+export default ProgressBar;

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

@@ -0,0 +1,325 @@
+import { jsxs as j, jsx as v } from "react/jsx-runtime";
+import { getColorToHex as $ } from "../../../global/colors.js";
+import { g as D, c as n, _ as l, a as q, P as o, l as E, d as U } from "../../../createTheme-eb26b87a.js";
+import * as z from "react";
+import { g as w, s as h, a as A, c as F, b as K } from "../../../styled-b8bfdd6b.js";
+import { u as V } from "../../../useTheme-a9e2b32c.js";
+import { k as P, c as x } from "../../../emotion-react.browser.esm-ff33c213.js";
+function S(r) {
+  return D("MuiLinearProgress", r);
+}
+w("MuiLinearProgress", ["root", "colorPrimary", "colorSecondary", "determinate", "indeterminate", "buffer", "query", "dashed", "dashedColorPrimary", "dashedColorSecondary", "bar", "barColorPrimary", "barColorSecondary", "bar1Indeterminate", "bar1Determinate", "bar1Buffer", "bar2Indeterminate", "bar2Buffer"]);
+const X = ["className", "color", "value", "valueBuffer", "variant"];
+let c = (r) => r, B, N, O, _, I, M;
+const C = 4, Y = P(B || (B = c`
+  0% {
+    left: -35%;
+    right: 100%;
+  }
+
+  60% {
+    left: 100%;
+    right: -90%;
+  }
+
+  100% {
+    left: 100%;
+    right: -90%;
+  }
+`)), H = P(N || (N = c`
+  0% {
+    left: -200%;
+    right: 100%;
+  }
+
+  60% {
+    left: 107%;
+    right: -8%;
+  }
+
+  100% {
+    left: 107%;
+    right: -8%;
+  }
+`)), W = P(O || (O = c`
+  0% {
+    opacity: 1;
+    background-position: 0 -23px;
+  }
+
+  60% {
+    opacity: 0;
+    background-position: 0 -23px;
+  }
+
+  100% {
+    opacity: 1;
+    background-position: -200px -23px;
+  }
+`)), G = (r) => {
+  const {
+    classes: e,
+    variant: a,
+    color: t
+  } = r, f = {
+    root: ["root", `color${n(t)}`, a],
+    dashed: ["dashed", `dashedColor${n(t)}`],
+    bar1: ["bar", `barColor${n(t)}`, (a === "indeterminate" || a === "query") && "bar1Indeterminate", a === "determinate" && "bar1Determinate", a === "buffer" && "bar1Buffer"],
+    bar2: ["bar", a !== "buffer" && `barColor${n(t)}`, a === "buffer" && `color${n(t)}`, (a === "indeterminate" || a === "query") && "bar2Indeterminate", a === "buffer" && "bar2Buffer"]
+  };
+  return K(f, S, e);
+}, k = (r, e) => e === "inherit" ? "currentColor" : r.vars ? r.vars.palette.LinearProgress[`${e}Bg`] : r.palette.mode === "light" ? E(r.palette[e].main, 0.62) : U(r.palette[e].main, 0.5), J = h("span", {
+  name: "MuiLinearProgress",
+  slot: "Root",
+  overridesResolver: (r, e) => {
+    const {
+      ownerState: a
+    } = r;
+    return [e.root, e[`color${n(a.color)}`], e[a.variant]];
+  }
+})(({
+  ownerState: r,
+  theme: e
+}) => l({
+  position: "relative",
+  overflow: "hidden",
+  display: "block",
+  height: 4,
+  zIndex: 0,
+  // Fix Safari's bug during composition of different paint.
+  "@media print": {
+    colorAdjust: "exact"
+  },
+  backgroundColor: k(e, r.color)
+}, r.color === "inherit" && r.variant !== "buffer" && {
+  backgroundColor: "none",
+  "&::before": {
+    content: '""',
+    position: "absolute",
+    left: 0,
+    top: 0,
+    right: 0,
+    bottom: 0,
+    backgroundColor: "currentColor",
+    opacity: 0.3
+  }
+}, r.variant === "buffer" && {
+  backgroundColor: "transparent"
+}, r.variant === "query" && {
+  transform: "rotate(180deg)"
+})), Q = h("span", {
+  name: "MuiLinearProgress",
+  slot: "Dashed",
+  overridesResolver: (r, e) => {
+    const {
+      ownerState: a
+    } = r;
+    return [e.dashed, e[`dashedColor${n(a.color)}`]];
+  }
+})(({
+  ownerState: r,
+  theme: e
+}) => {
+  const a = k(e, r.color);
+  return l({
+    position: "absolute",
+    marginTop: 0,
+    height: "100%",
+    width: "100%"
+  }, r.color === "inherit" && {
+    opacity: 0.3
+  }, {
+    backgroundImage: `radial-gradient(${a} 0%, ${a} 16%, transparent 42%)`,
+    backgroundSize: "10px 10px",
+    backgroundPosition: "0 -23px"
+  });
+}, x(_ || (_ = c`
+    animation: ${0} 3s infinite linear;
+  `), W)), Z = h("span", {
+  name: "MuiLinearProgress",
+  slot: "Bar1",
+  overridesResolver: (r, e) => {
+    const {
+      ownerState: a
+    } = r;
+    return [e.bar, e[`barColor${n(a.color)}`], (a.variant === "indeterminate" || a.variant === "query") && e.bar1Indeterminate, a.variant === "determinate" && e.bar1Determinate, a.variant === "buffer" && e.bar1Buffer];
+  }
+})(({
+  ownerState: r,
+  theme: e
+}) => l({
+  width: "100%",
+  position: "absolute",
+  left: 0,
+  bottom: 0,
+  top: 0,
+  transition: "transform 0.2s linear",
+  transformOrigin: "left",
+  backgroundColor: r.color === "inherit" ? "currentColor" : (e.vars || e).palette[r.color].main
+}, r.variant === "determinate" && {
+  transition: `transform .${C}s linear`
+}, r.variant === "buffer" && {
+  zIndex: 1,
+  transition: `transform .${C}s linear`
+}), ({
+  ownerState: r
+}) => (r.variant === "indeterminate" || r.variant === "query") && x(I || (I = c`
+      width: auto;
+      animation: ${0} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
+    `), Y)), rr = h("span", {
+  name: "MuiLinearProgress",
+  slot: "Bar2",
+  overridesResolver: (r, e) => {
+    const {
+      ownerState: a
+    } = r;
+    return [e.bar, e[`barColor${n(a.color)}`], (a.variant === "indeterminate" || a.variant === "query") && e.bar2Indeterminate, a.variant === "buffer" && e.bar2Buffer];
+  }
+})(({
+  ownerState: r,
+  theme: e
+}) => l({
+  width: "100%",
+  position: "absolute",
+  left: 0,
+  bottom: 0,
+  top: 0,
+  transition: "transform 0.2s linear",
+  transformOrigin: "left"
+}, r.variant !== "buffer" && {
+  backgroundColor: r.color === "inherit" ? "currentColor" : (e.vars || e).palette[r.color].main
+}, r.color === "inherit" && {
+  opacity: 0.3
+}, r.variant === "buffer" && {
+  backgroundColor: k(e, r.color),
+  transition: `transform .${C}s linear`
+}), ({
+  ownerState: r
+}) => (r.variant === "indeterminate" || r.variant === "query") && x(M || (M = c`
+      width: auto;
+      animation: ${0} 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite;
+    `), H)), T = /* @__PURE__ */ z.forwardRef(function(e, a) {
+  const t = A({
+    props: e,
+    name: "MuiLinearProgress"
+  }), {
+    className: f,
+    color: y = "primary",
+    value: d,
+    valueBuffer: b,
+    variant: s = "indeterminate"
+  } = t, R = q(t, X), u = l({}, t, {
+    color: y,
+    variant: s
+  }), m = G(u), L = V(), p = {}, g = {
+    bar1: {},
+    bar2: {}
+  };
+  if (s === "determinate" || s === "buffer")
+    if (d !== void 0) {
+      p["aria-valuenow"] = Math.round(d), p["aria-valuemin"] = 0, p["aria-valuemax"] = 100;
+      let i = d - 100;
+      L.direction === "rtl" && (i = -i), g.bar1.transform = `translateX(${i}%)`;
+    } else
+      process.env.NODE_ENV !== "production" && console.error("MUI: You need to provide a value prop when using the determinate or buffer variant of LinearProgress .");
+  if (s === "buffer")
+    if (b !== void 0) {
+      let i = (b || 0) - 100;
+      L.direction === "rtl" && (i = -i), g.bar2.transform = `translateX(${i}%)`;
+    } else
+      process.env.NODE_ENV !== "production" && console.error("MUI: You need to provide a valueBuffer prop when using the buffer variant of LinearProgress.");
+  return /* @__PURE__ */ j(J, l({
+    className: F(m.root, f),
+    ownerState: u,
+    role: "progressbar"
+  }, p, {
+    ref: a
+  }, R, {
+    children: [s === "buffer" ? /* @__PURE__ */ v(Q, {
+      className: m.dashed,
+      ownerState: u
+    }) : null, /* @__PURE__ */ v(Z, {
+      className: m.bar1,
+      ownerState: u,
+      style: g.bar1
+    }), s === "determinate" ? null : /* @__PURE__ */ v(rr, {
+      className: m.bar2,
+      ownerState: u,
+      style: g.bar2
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" && (T.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * 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).
+   * @default 'primary'
+   */
+  color: o.oneOfType([o.oneOf(["inherit", "primary", "secondary"]), 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]),
+  /**
+   * The value of the progress indicator for the determinate and buffer variants.
+   * Value between 0 and 100.
+   */
+  value: o.number,
+  /**
+   * The value for the buffer variant.
+   * Value between 0 and 100.
+   */
+  valueBuffer: o.number,
+  /**
+   * The variant to use.
+   * Use indeterminate or query when there is no progress value.
+   * @default 'indeterminate'
+   */
+  variant: o.oneOf(["buffer", "determinate", "indeterminate", "query"])
+});
+const er = T;
+function ar(r) {
+  return r >= 100 ? $("success") : $("primary");
+}
+const cr = ({
+  value: r = 0,
+  color: e = "primary",
+  extrapolateColor: a = ar,
+  trackColor: t,
+  sx: f,
+  ...y
+}) => {
+  const b = { ...{
+    borderRadius: "0.625rem",
+    backgroundColor: t ?? "#F3F3F3",
+    "& .MuiLinearProgress-bar": {
+      backgroundColor: a(r)
+    }
+  }, ...f };
+  return /* @__PURE__ */ v(
+    er,
+    {
+      variant: "determinate",
+      value: r,
+      color: e,
+      sx: b,
+      ...y
+    }
+  );
+};
+export {
+  cr as default
+};

package/dist/components/cell/Search/index.d.ts

@@ -0,0 +1,25 @@
+/** @jsxImportSource react */
+import { SxProps } from "@mui/material";
+import { BaseTextFieldProps as MuiBaseTextFieldProps } from "@mui/material/TextField";
+import { CraftFC } from "../../../global/interfaces";
+/**
+ * The props of the Search component extend the MuiBaseTextFieldProps interface.
+ * @see https://mui.com/api/text-field/#props
+ */
+interface SearchProps extends MuiBaseTextFieldProps {
+    sx?: SxProps;
+    borderColor?: string;
+    borderColorHover?: string;
+    borderColorFocus?: string;
+    backgroundColor?: string;
+    iconColor?: string;
+}
+/**
+ * The Search component is a custom TextField component that has a search icon
+ * as a start adornment.
+ *
+ * @param {SearchProps} props The props of the Search component.
+ * @returns {JSX.Element} The Search component.
+ */
+declare const Search: CraftFC<SearchProps>;
+export default Search;