@saleor/macaw-ui 0.5.2 → 0.6.2

package/src/icons/24x24/PresetIcon.tsx

@@ -0,0 +1,35 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const PresetIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M16 6h4M4 6h4m5 6h7M4 12h1m14 6h1M4 18h7"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+        />
+        <path
+          d="M13.5 6a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Zm-3 6a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Zm6 6a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Z"
+          fill="currentColor"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/PreviousIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const PreviousIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={25}
+        viewBox="0 0 24 25"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="m14 8.002-4 4 4 4"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/PrinterIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const PrinterIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        xmlns="http://www.w3.org/2000/svg"
+        width={24}
+        height={25}
+        fill="none"
+        viewBox="0 0 24 25"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth={1.5}
+          d="M6 17.002H3a1 1 0 0 1-1-1v-8a1 1 0 0 1 1-1h2.5m.5 10v4a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1v-4m-12 0v-3.5m12 3.5h3a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1h-2.5m-.5 10v-3.5m-12.5-6.5v-4a1 1 0 0 1 1-1h11a1 1 0 0 1 1 1v4m-13 0h13M6 13.502h12m-12 0H5m13 0h1m-14-3.5h2m2 7h6"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/PrivacyIcon.tsx

@@ -0,0 +1,39 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const PrivacyIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        xmlns="http://www.w3.org/2000/svg"
+        width={24}
+        height={25}
+        fill="none"
+        viewBox="0 0 24 25"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <circle
+          cx={12}
+          cy={15}
+          r={6.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <path
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth={1.5}
+          d="M8 10V7a4 4 0 0 1 4-4v0a4 4 0 0 1 4 4v3m-4 4v3m0-3h1m-1 0h-1"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/ProcessIcon.tsx

@@ -0,0 +1,73 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const ProcessIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <circle
+          cx={12}
+          cy={4}
+          r={2.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <path
+          d="M4 4h5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+        />
+        <path
+          d="M14.5 20H21m0 0-2.5-2.5M21 20l-2.5 2.5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path d="M6 12h12" stroke="currentColor" strokeWidth={1.5} />
+        <path
+          d="M14 4h5a1 1 0 0 1 1 1v5M4 14v5a1 1 0 0 0 1 1h5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinejoin="round"
+        />
+        <circle
+          cx={20}
+          cy={12}
+          r={2.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <circle
+          cx={4}
+          cy={12}
+          r={2.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <circle
+          cx={12}
+          cy={20}
+          r={2.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/ProductIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const ProductIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="m3 8.5 1.868-4.203A.5.5 0 0 1 5.325 4h13.35a.5.5 0 0 1 .457.297L21 8.5m-18 0v11a.5.5 0 0 0 .5.5h17a.5.5 0 0 0 .5-.5v-11m-18 0h6.5m11.5 0h-6.5m-5 0v6l2.243-1.346a.5.5 0 0 1 .514 0L14.5 14.5v-6m-5 0h5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/RefreshIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const RefreshIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M21 12a9 9 0 1 1-1.8-5.4m0 0V3m0 3.6h-3.7"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/RemoveMemberIcon.tsx

@@ -0,0 +1,34 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const RemoveMemberIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M11.5 21.75a.75.75 0 0 0 0-1.5v1.5Zm1.5-7a.75.75 0 0 0 0-1.5v1.5Zm-3.17 0h1.67v-1.5H9.83v1.5Zm1.67 5.5H3.171v1.5h8.33v-1.5Zm0-5.5H13v-1.5h-1.5v1.5Zm-7.75 6.08a6.08 6.08 0 0 1 6.08-6.08v-1.5a7.58 7.58 0 0 0-7.58 7.58h1.5Zm-1.5 0c0 .508.413.92.921.92v-1.5c.32 0 .58.26.58.58h-1.5Zm19.28-4.3a.75.75 0 1 0-1.06-1.06l1.06 1.06Zm-6.06 3.94a.75.75 0 1 0 1.06 1.06l-1.06-1.06Zm5-5-5 5 1.06 1.06 5-5-1.06-1.06Z"
+          fill="currentColor"
+        />
+        <path
+          d="M20.47 21.53a.75.75 0 0 0 1.06-1.06l-1.06 1.06Zm-3.94-6.06a.75.75 0 0 0-1.06 1.06l1.06-1.06Zm5 5-5-5-1.06 1.06 5 5 1.06-1.06Z"
+          fill="currentColor"
+        />
+        <circle cx={12} cy={7} r={4} stroke="currentColor" strokeWidth={1.5} />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/ReplyIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const ReplyIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M21 21v-5a8 8 0 0 0-8-8H3.5m0 0 5-5m-5 5 5 5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/SearchIcon.tsx

@@ -0,0 +1,39 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const SearchIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <circle
+          cx={11}
+          cy={11}
+          r={7.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <path
+          d="M16.5 16.5 21 21"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/SettingsIcon.tsx

@@ -0,0 +1,34 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const SettingsIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M3.002 13.522c.307.13.74.299 1.348.525.36.134.659.417.813.791.153.37.148.789-.008 1.153a37.348 37.348 0 0 0-.562 1.37c-.176.466-.05.974.285 1.309l.496.496.53-.53-.53.53c.344.344.868.467 1.34.275.307-.125.736-.31 1.333-.582a1.404 1.404 0 0 1 1.126-.022c.359.15.648.446.797.82.25.624.433 1.062.571 1.368.204.455.654.725 1.127.725h.729c.484 0 .943-.283 1.14-.754.126-.301.291-.724.511-1.318a1.48 1.48 0 0 1 .815-.857 1.405 1.405 0 0 1 1.09.007c.649.276 1.16.482 1.533.618.204.074.417.082.614.032l-.028.151h.001l.029-.152c.182-.046.351-.14.487-.277l.58-.582c.343-.343.467-.867.273-1.34a36.464 36.464 0 0 0-.569-1.291 1.493 1.493 0 0 1-.025-1.183c.149-.365.436-.645.783-.784a36.81 36.81 0 0 0 1.397-.584c.454-.205.722-.654.722-1.126v-.691c0-.484-.283-.943-.754-1.14a35.923 35.923 0 0 0-1.346-.522 1.423 1.423 0 0 1-.818-.795c-.153-.37-.147-.79.009-1.155.263-.616.442-1.056.562-1.372.177-.465.05-.974-.285-1.309l-.495-.494a1.236 1.236 0 0 0-1.337-.275c-.308.125-.738.31-1.339.584-.355.162-.76.172-1.122.023a1.477 1.477 0 0 1-.802-.822 37.024 37.024 0 0 0-.57-1.367 1.233 1.233 0 0 0-1.127-.725H11.6c-.484 0-.942.282-1.14.753-.126.301-.292.726-.513 1.322-.145.39-.44.7-.81.854a1.4 1.4 0 0 1-1.088-.006 32.674 32.674 0 0 0-1.536-.618l-.256.705.256-.705a1.053 1.053 0 0 0-1.105.248l-.58.582a1.233 1.233 0 0 0-.272 1.338c.124.302.306.717.568 1.29.17.371.182.804.024 1.186-.15.363-.436.642-.781.78-.635.254-1.08.44-1.392.58a1.233 1.233 0 0 0-.725 1.128v.696c0 .483.282.941.752 1.139Z"
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <path
+          d="M13.5 12a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0Z"
+          fill="currentColor"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/SnapshotsIcon.tsx

@@ -0,0 +1,39 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const SnapshotsIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={25}
+        viewBox="0 0 24 25"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M7 11V8a1 1 0 0 1 1-1h11a1 1 0 0 1 1 1v3M7 11v8a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-8M7 11h13"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        <path
+          d="M4 16V5a1 1 0 0 1 1-1h11"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/SortDownIcon.tsx

@@ -0,0 +1,31 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const SortDownIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M12 4v15.5m0 0-5-5m5 5 5-5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/SortUpIcon.tsx

@@ -0,0 +1,31 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const SortUpIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M12 19.5V4m0 0L7 9m5-5 5 5"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/TasksIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const TasksIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="M3.5 17.5 5 19l3.5-3.5M3 10V6a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1Zm9-2h10m-10 9h10"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/TimeIcon.tsx

@@ -0,0 +1,39 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const TimeIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={24}
+        viewBox="0 0 24 24"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <circle
+          cx={12}
+          cy={12}
+          r={9.25}
+          stroke="currentColor"
+          strokeWidth={1.5}
+        />
+        <path
+          d="m9 7.5 3 4.5 3-1"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/ToIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const ToIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        width={24}
+        height={25}
+        viewBox="0 0 24 25"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          d="m10 16.002 4-4-4-4m5 8 4-4-4-4m-10 8 4-4-4-4"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </SvgIcon>
+    );
+  }
+);

package/src/icons/24x24/TransferIcon.tsx

@@ -0,0 +1,32 @@
+import SvgIcon from "@material-ui/core/SvgIcon";
+import * as React from "react";
+
+import { useIconStyles } from "../styles";
+import { IconProps } from "../types";
+export const TransferIcon = React.forwardRef(
+  (props: IconProps, ref: React.Ref<SVGSVGElement>) => {
+    const classes = useIconStyles();
+    return (
+      <SvgIcon
+        xmlns="http://www.w3.org/2000/svg"
+        width={24}
+        height={24}
+        fill="none"
+        viewBox="0 0 24 24"
+        classes={{
+          root: classes.root,
+        }}
+        {...props}
+        ref={ref}
+      >
+        <path
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth={1.5}
+          d="M20 7H4m0 0 4-4M4 7l4 4m-4 6h16m0 0-4-4m4 4-4 4"
+        />
+      </SvgIcon>
+    );
+  }
+);