@databiosphere/findable-ui 0.0.0

package/lib/components/common/Card/components/CardTitle/cardTitle.js

@@ -0,0 +1,25 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardTitle = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+const typography_1 = require("../../../../../theme/common/typography");
+const CardTitle = (_a) => {
+    var { children } = _a, props = __rest(_a, ["children"]) /* Spread props to allow for Mui TypographyProps specific prop overrides e.g. "variant". */;
+    return (react_1.default.createElement(material_1.Typography, Object.assign({ component: "h4", variant: typography_1.TEXT_BODY_LARGE_500 }, props), children));
+};
+exports.CardTitle = CardTitle;

package/lib/components/common/Card/components/RoundedCard/roundedCard.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from "react";
+export interface RoundedCardProps {
+    children: ReactNode;
+}
+export declare const RoundedCard: ({ children }: RoundedCardProps) => JSX.Element;

package/lib/components/common/Card/components/RoundedCard/roundedCard.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RoundedCard = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+const paper_styles_1 = require("../../../Paper/paper.styles");
+const RoundedCard = ({ children }) => {
+    return react_1.default.createElement(material_1.Card, { component: paper_styles_1.RoundedPaper }, children);
+};
+exports.RoundedCard = RoundedCard;

package/lib/components/common/Code/code.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface CodeProps {
+    className?: string;
+    code: string;
+}
+export declare const Code: ({ className, code }: CodeProps) => JSX.Element;

package/lib/components/common/Code/code.js

@@ -0,0 +1,52 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Code = void 0;
+const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
+const react_1 = __importStar(require("react"));
+const code_styles_1 = require("./code.styles");
+const Code = ({ className, code }) => {
+    const [copied, setCopied] = (0, react_1.useState)(false);
+    // Copies code to clipboard and sets copied state to true.
+    const onCopyCode = (str) => {
+        (0, copy_to_clipboard_1.default)(str);
+        setCopied(true);
+    };
+    // Copied state set to false after a specified time (2 seconds).
+    (0, react_1.useEffect)(() => {
+        if (copied) {
+            const copiedTimeout = setTimeout(() => {
+                setCopied(false);
+            }, 2000);
+            return () => clearTimeout(copiedTimeout);
+        }
+    }, [copied]);
+    return (react_1.default.createElement(code_styles_1.CodeBlock, { className: className, copied: copied, onClick: () => onCopyCode(code) },
+        react_1.default.createElement("code", null, code)));
+};
+exports.Code = Code;

package/lib/components/common/Code/code.stories.d.ts

@@ -0,0 +1,5 @@
+import { StoryObj } from "@storybook/react";
+declare const meta: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0fc72a6d").R, import("./code").CodeProps>;
+export default meta;
+declare type Story = StoryObj<typeof meta>;
+export declare const CodeStory: Story;

package/lib/components/common/Code/code.stories.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CodeStory = void 0;
+const code_1 = require("./code");
+const meta = {
+    component: code_1.Code,
+    title: "Components/Common/Code",
+};
+exports.default = meta;
+exports.CodeStory = {
+    args: {
+        code: "curl --location --fail 'https://service.azul.data.humancellatlas.org/manifest/files?catalog=dcp16&format=curl&filters=%7B%22projectId%22%3A+%7B%22is%22%3A+%5B%22f86f1ab4-1fbb-4510-ae35-3ffd752d4dfc%22%5D%7D%2C+%22fileFormat%22%3A+%7B%22is%22%3A+%5B%22fastq.gz%22%5D%7D%2C+%22genusSpecies%22%3A%7B%22is%22%3A%5B%22Homo+sapiens%22%5D%7D%7D&objectKey=manifests%2Fee705e99-35d3-5ae1-9e31-89d206e4240b.e735a6e0-9914-5b40-8fa2-c4d581644f50.curlrc' | curl --config -",
+    },
+};

package/lib/components/common/Code/code.styles.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface Props {
+    copied: boolean;
+}
+export declare const CodeBlock: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Props, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLPreElement>, HTMLPreElement>, {}>;
+export {};

package/lib/components/common/Code/code.styles.js

@@ -0,0 +1,58 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CodeBlock = void 0;
+const react_1 = require("@emotion/react");
+const styled_1 = __importDefault(require("@emotion/styled"));
+const fonts_1 = require("../../../styles/common/mixins/fonts");
+const copy = (props) => (0, react_1.css) `
+  ${(0, fonts_1.textBody500)(props)};
+  align-items: center;
+  border-radius: inherit;
+  color: ${props.theme.palette.common.white};
+  content: "";
+  display: flex;
+  font-family: ${props.theme.typography.fontFamily};
+  height: 100%;
+  justify-content: center;
+  left: 0;
+  opacity: 0;
+  position: absolute;
+  top: 0;
+  transition: opacity ${props.theme.transitions.duration.standard}ms;
+  width: 100%;
+`;
+exports.CodeBlock = (0, styled_1.default)("pre") `
+  background-color: ${({ theme }) => theme.palette.info.lightest};
+  border-radius: 4px;
+  cursor: pointer;
+  margin: 16px 0;
+  padding: 16px;
+  position: relative;
+
+  &::after {
+    ${copy};
+  }
+
+  // Copy to Clipboard!
+  ${({ copied, theme }) => !copied &&
+    (0, react_1.css) `
+      &:hover::after {
+        background-color: ${theme.palette.primary.main}e6;
+        content: "Copy to Clipboard";
+        opacity: 1;
+      }
+    `};
+
+  // Copied!
+  ${({ copied, theme }) => copied &&
+    (0, react_1.css) `
+      &::after {
+        background-color: ${theme.palette.primary.main};
+        content: "Copied!";
+        opacity: 1;
+      }
+    `};
+`;

package/lib/components/common/CopyToClipboard/copyToClipboard.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export interface CopyToClipboardProps {
+    copyStr: string;
+}
+export declare const CopyToClipboard: ({ copyStr, }: CopyToClipboardProps) => JSX.Element;

package/lib/components/common/CopyToClipboard/copyToClipboard.js

@@ -0,0 +1,57 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CopyToClipboard = void 0;
+const ContentCopyRounded_1 = __importDefault(require("@mui/icons-material/ContentCopyRounded"));
+const material_1 = require("@mui/material");
+const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
+const react_1 = __importStar(require("react"));
+const CopyToClipboard = ({ copyStr, }) => {
+    const [showTooltip, setShowTooltip] = react_1.default.useState(false);
+    /**
+     * Copies string to clipboard and sets showTooltip state to true.
+     * @param str - String to copy to clipboard.
+     */
+    const onCopyToClipboard = (str) => {
+        (0, copy_to_clipboard_1.default)(str);
+        setShowTooltip(true);
+    };
+    // Timer to auto close the tooltip - the state showTooltip is set to false after a specified time (2 seconds).
+    (0, react_1.useEffect)(() => {
+        if (showTooltip) {
+            const tooltipTimeout = setTimeout(() => {
+                setShowTooltip(false);
+            }, 2000);
+            return () => clearTimeout(tooltipTimeout);
+        }
+    }, [showTooltip]);
+    return (react_1.default.createElement(material_1.Tooltip, { arrow: true, disableHoverListener: true, open: showTooltip, placement: "top", title: "Link Copied" },
+        react_1.default.createElement(material_1.IconButton, { onClick: () => onCopyToClipboard(copyStr), size: "xxsmall" },
+            react_1.default.createElement(ContentCopyRounded_1.default, { color: "primary", fontSize: "small" }))));
+};
+exports.CopyToClipboard = CopyToClipboard;

package/lib/components/common/CopyToClipboard/copyToClipboard.stories.d.ts

@@ -0,0 +1,6 @@
+import { StoryObj } from "@storybook/react";
+import { CopyToClipboard } from "./copyToClipboard";
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0fc72a6d").R, import("./copyToClipboard").CopyToClipboardProps>;
+export default _default;
+declare type Story = StoryObj<typeof CopyToClipboard>;
+export declare const CopyToClipboardStory: Story;

package/lib/components/common/CopyToClipboard/copyToClipboard.stories.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CopyToClipboardStory = void 0;
+const copyToClipboard_1 = require("./copyToClipboard");
+exports.default = {
+    argTypes: {
+        copyStr: {
+            description: "String to be copied",
+        },
+    },
+    component: copyToClipboard_1.CopyToClipboard,
+    title: "Components/Common/CopyToClipboard",
+};
+exports.CopyToClipboardStory = {
+    args: {
+        copyStr: "Copy me",
+    },
+};

package/lib/components/common/CustomIcon/common/constants.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from "react";
+import { CustomSVGIconProps } from "./entities";
+export declare const ContentCopyIconSmall: (props: CustomSVGIconProps) => ReactElement;
+export declare const DownloadIconSmall: (props: CustomSVGIconProps) => ReactElement;
+export declare const InventoryIconSmall: (props: CustomSVGIconProps) => ReactElement;

package/lib/components/common/CustomIcon/common/constants.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InventoryIconSmall = exports.DownloadIconSmall = exports.ContentCopyIconSmall = void 0;
+const contentCopyIcon_1 = require("../components/ContentCopyIcon/contentCopyIcon");
+const downloadIcon_1 = require("../components/DownloadIcon/downloadIcon");
+const inventoryIcon_1 = require("../components/InventoryIcon/inventoryIcon");
+const ContentCopyIconSmall = (props) => (0, contentCopyIcon_1.ContentCopyIcon)(Object.assign({ fontSize: "small" }, props));
+exports.ContentCopyIconSmall = ContentCopyIconSmall;
+const DownloadIconSmall = (props) => (0, downloadIcon_1.DownloadIcon)(Object.assign({ fontSize: "small" }, props));
+exports.DownloadIconSmall = DownloadIconSmall;
+const InventoryIconSmall = (props) => (0, inventoryIcon_1.InventoryIcon)(Object.assign({ fontSize: "small" }, props));
+exports.InventoryIconSmall = InventoryIconSmall;

package/lib/components/common/CustomIcon/common/entities.d.ts

@@ -0,0 +1,5 @@
+import { SvgIconProps } from "@mui/material";
+export interface CustomSVGIconProps extends SvgIconProps {
+    fontSize?: SvgIconProps["fontSize"];
+    viewBox?: string;
+}

package/lib/components/common/CustomIcon/common/entities.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/components/common/CustomIcon/components/AddIcon/addIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom add icon.
+ */
+export declare const AddIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/AddIcon/addIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AddIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom add icon.
+ */
+const AddIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M8.9997 14.2494C8.7873 14.2494 8.6028 14.1714 8.4462 14.0154C8.2902 13.8588 8.2122 13.6743 8.2122 13.4619V9.7872H4.5375C4.3251 9.7872 4.1406 9.7092 3.984 9.5532C3.828 9.3966 3.75 9.2121 3.75 8.9997C3.75 8.7873 3.828 8.6028 3.984 8.4462C4.1406 8.2902 4.3251 8.2122 4.5375 8.2122H8.2122V4.5375C8.2122 4.3251 8.2902 4.1406 8.4462 3.984C8.6028 3.828 8.7873 3.75 8.9997 3.75C9.2121 3.75 9.3966 3.828 9.5532 3.984C9.7092 4.1406 9.7872 4.3251 9.7872 4.5375V8.2122H13.4619C13.6743 8.2122 13.8588 8.2902 14.0154 8.4462C14.1714 8.6028 14.2494 8.7873 14.2494 8.9997C14.2494 9.2121 14.1714 9.3966 14.0154 9.5532C13.8588 9.7092 13.6743 9.7872 13.4619 9.7872H9.7872V13.4619C9.7872 13.6743 9.7092 13.8588 9.5532 14.0154C9.3966 14.1714 9.2121 14.2494 8.9997 14.2494Z", fill: "currentColor" })));
+};
+exports.AddIcon = AddIcon;

package/lib/components/common/CustomIcon/components/AlertIcon/alertIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom alert icon.
+ */
+export declare const AlertIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/AlertIcon/alertIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AlertIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom alert icon.
+ */
+const AlertIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M9.01899 9.8439C9.20649 9.8439 9.35949 9.7845 9.47799 9.6657C9.59679 9.5469 9.65619 9.40005 9.65619 9.22515V6.65655C9.65619 6.48135 9.59379 6.3345 9.46899 6.216C9.34389 6.0972 9.19389 6.0378 9.01899 6.0378C8.84379 6.0378 8.69679 6.0972 8.57799 6.216C8.45949 6.3345 8.40024 6.48135 8.40024 6.65655V9.22515C8.40024 9.40005 8.45949 9.5469 8.57799 9.6657C8.69679 9.7845 8.84379 9.8439 9.01899 9.8439ZM9.00009 12.6375C9.18759 12.6375 9.35004 12.5688 9.48744 12.4314C9.62514 12.294 9.69399 12.1316 9.69399 11.9441C9.69399 11.7566 9.62514 11.5971 9.48744 11.4657C9.35004 11.3346 9.18759 11.2691 9.00009 11.2691C8.81259 11.2691 8.65014 11.3346 8.51274 11.4657C8.37504 11.5971 8.30619 11.7566 8.30619 11.9441C8.30619 12.1316 8.37504 12.294 8.51274 12.4314C8.65014 12.5688 8.81259 12.6375 9.00009 12.6375ZM4.25619 16.5003C3.91869 16.5003 3.62499 16.3752 3.37509 16.125C3.12519 15.8751 3.00024 15.5814 3.00024 15.2439V6.50625C3.00024 6.33135 3.03459 6.1689 3.10329 6.0189C3.17199 5.8689 3.26259 5.73765 3.37509 5.62515L7.12494 1.8753C7.23744 1.7628 7.36869 1.6722 7.51869 1.6035C7.66869 1.5345 7.83129 1.5 8.00649 1.5H13.744C14.0815 1.5 14.3752 1.6251 14.6251 1.8753C14.875 2.1252 14.9999 2.4189 14.9999 2.7564V15.2439C14.9999 15.5814 14.875 15.8751 14.6251 16.125C14.3752 16.3752 14.0815 16.5003 13.744 16.5003H4.25619ZM4.25619 15.2439H13.744V2.7564H8.04384L4.25619 6.54405V15.2439Z", fill: "currentColor" })));
+};
+exports.AlertIcon = AlertIcon;

package/lib/components/common/CustomIcon/components/BackArrowIcon/backArrowIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom back arrow icon.
+ */
+export declare const BackArrowIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/BackArrowIcon/backArrowIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackArrowIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom back arrow icon.
+ */
+const BackArrowIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M1.81895 9.00009C1.81895 8.89989 1.84085 8.79999 1.88465 8.70039C1.92845 8.60019 1.98785 8.51259 2.06285 8.43759L6.18756 4.31289C6.33756 4.16289 6.52206 4.08789 6.74106 4.08789C6.95946 4.08789 7.14366 4.16289 7.29366 4.31289C7.44366 4.46289 7.51866 4.64409 7.51866 4.85649C7.51866 5.06889 7.44366 5.25009 7.29366 5.40009L4.50006 8.21259L15.7123 8.21259C15.9247 8.21259 16.1092 8.29059 16.2658 8.44659C16.4218 8.60319 16.4998 8.78769 16.4998 9.00009C16.4998 9.21249 16.4218 9.39699 16.2658 9.55359C16.1092 9.70959 15.9247 9.78759 15.7123 9.78759L4.50005 9.78759L7.29366 12.6001C7.44366 12.7501 7.51866 12.9313 7.51866 13.1437C7.51866 13.3561 7.44366 13.5373 7.29365 13.6873C7.14365 13.8373 6.95945 13.9123 6.74105 13.9123C6.52205 13.9123 6.33755 13.8373 6.18755 13.6873L2.06285 9.56259C1.98785 9.48759 1.92845 9.39999 1.88465 9.29979C1.84085 9.20019 1.81895 9.10029 1.81895 9.00009Z", fill: "currentColor" })));
+};
+exports.BackArrowIcon = BackArrowIcon;

package/lib/components/common/CustomIcon/components/CheckedIcon/checkedIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom checked icon.
+ */
+export declare const CheckedIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/CheckedIcon/checkedIcon.js

@@ -0,0 +1,29 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckedIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom checked icon.
+ */
+const CheckedIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M0 4C0 1.79086 1.79086 0 4 0H14C16.2091 0 18 1.79086 18 4V14C18 16.2091 16.2091 18 14 18H4C1.79086 18 0 16.2091 0 14V4Z", fill: "currentColor" }),
+        react_1.default.createElement("path", { d: "M7.84875 12.188C7.96008 12.188 8.06775 12.167 8.17175 12.125C8.27575 12.083 8.37641 12.0137 8.47375 11.917L13.0987 7.29201C13.2654 7.12535 13.3521 6.92401 13.3587 6.68801C13.3661 6.45135 13.2794 6.24268 13.0987 6.06201C12.9321 5.89535 12.7271 5.81201 12.4837 5.81201C12.2411 5.81201 12.0364 5.89535 11.8697 6.06201L7.84875 10.083L6.09875 8.33301C5.93208 8.16635 5.73408 8.07968 5.50475 8.07301C5.27608 8.06568 5.07141 8.15235 4.89075 8.33301C4.72408 8.49968 4.64075 8.70468 4.64075 8.94801C4.64075 9.19068 4.72408 9.39535 4.89075 9.56201L7.22375 11.917C7.32108 12.0137 7.42175 12.083 7.52575 12.125C7.62975 12.167 7.73741 12.188 7.84875 12.188Z", fill: "white" })));
+};
+exports.CheckedIcon = CheckedIcon;

package/lib/components/common/CustomIcon/components/ContactSupportIcon/contactSupportIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom contact support icon.
+ */
+export declare const ContactSupportIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/ContactSupportIcon/contactSupportIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContactSupportIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom contact support icon.
+ */
+const ContactSupportIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M9 16.5L8.8125 14.25H8.625C6.85 14.25 5.34375 13.6313 4.10625 12.3938C2.86875 11.1563 2.25 9.65 2.25 7.875C2.25 6.1 2.86875 4.59375 4.10625 3.35625C5.34375 2.11875 6.85 1.5 8.625 1.5C9.5125 1.5 10.3406 1.66563 11.1094 1.99688C11.8781 2.32813 12.5531 2.78438 13.1344 3.36563C13.7156 3.94688 14.1719 4.62188 14.5031 5.39063C14.8344 6.15938 15 6.9875 15 7.875C15 9.775 14.4313 11.4781 13.2938 12.9844C12.1563 14.4906 10.725 15.6625 9 16.5ZM8.60625 11.9813C8.81875 11.9813 9 11.9063 9.15 11.7563C9.3 11.6063 9.375 11.425 9.375 11.2125C9.375 11 9.3 10.8188 9.15 10.6688C9 10.5188 8.81875 10.4438 8.60625 10.4438C8.39375 10.4438 8.2125 10.5188 8.0625 10.6688C7.9125 10.8188 7.8375 11 7.8375 11.2125C7.8375 11.425 7.9125 11.6063 8.0625 11.7563C8.2125 11.9063 8.39375 11.9813 8.60625 11.9813ZM8.625 9.6C8.7625 9.6 8.8875 9.55 9 9.45C9.1125 9.35 9.1875 9.2125 9.225 9.0375C9.25 8.875 9.31875 8.72813 9.43125 8.59688C9.54375 8.46563 9.7375 8.2625 10.0125 7.9875C10.2375 7.7625 10.425 7.51875 10.575 7.25625C10.725 6.99375 10.8 6.7125 10.8 6.4125C10.8 5.775 10.5844 5.29688 10.1531 4.97813C9.72188 4.65938 9.2125 4.5 8.625 4.5C8.1875 4.5 7.80938 4.6 7.49063 4.8C7.17188 5 6.9125 5.25 6.7125 5.55C6.625 5.6875 6.60938 5.83125 6.66563 5.98125C6.72188 6.13125 6.8375 6.2375 7.0125 6.3C7.1375 6.35 7.2625 6.35 7.3875 6.3C7.5125 6.25 7.625 6.15625 7.725 6.01875C7.825 5.88125 7.94688 5.76875 8.09063 5.68125C8.23438 5.59375 8.4125 5.55 8.625 5.55C8.9625 5.55 9.21563 5.64375 9.38438 5.83125C9.55313 6.01875 9.6375 6.225 9.6375 6.45C9.6375 6.6625 9.575 6.85313 9.45 7.02188C9.325 7.19063 9.175 7.3625 9 7.5375C8.65 7.8375 8.41563 8.08125 8.29688 8.26875C8.17813 8.45625 8.10625 8.7125 8.08125 9.0375C8.06875 9.1875 8.11563 9.31875 8.22188 9.43125C8.32813 9.54375 8.4625 9.6 8.625 9.6Z", fill: "currentColor" })));
+};
+exports.ContactSupportIcon = ContactSupportIcon;

package/lib/components/common/CustomIcon/components/ContentCopyIcon/contentCopyIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom content copy icon.
+ */
+export declare const ContentCopyIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/ContentCopyIcon/contentCopyIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContentCopyIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom content copy icon.
+ */
+const ContentCopyIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M6.975 13.3494C6.5376 13.3494 6.1656 13.1964 5.859 12.8904C5.553 12.5838 5.4 12.2118 5.4 11.7744V3.075C5.4 2.6376 5.553 2.2656 5.859 1.959C6.1656 1.653 6.5376 1.5 6.975 1.5H13.4253C13.8627 1.5 14.2344 1.653 14.5404 1.959C14.847 2.2656 15.0003 2.6376 15.0003 3.075V11.7744C15.0003 12.2118 14.847 12.5838 14.5404 12.8904C14.2344 13.1964 13.8627 13.3494 13.4253 13.3494H6.975ZM6.975 11.7744H13.4253V3.075H6.975V11.7744ZM3.825 16.4994C3.3876 16.4994 3.0156 16.3464 2.709 16.0404C2.403 15.7338 2.25 15.3618 2.25 14.9244V5.3439C2.25 5.1309 2.328 4.9464 2.484 4.7904C2.6406 4.6338 2.8251 4.5555 3.0375 4.5555C3.2499 4.5555 3.4344 4.6338 3.591 4.7904C3.747 4.9464 3.825 5.1309 3.825 5.3439V14.9244H11.1564C11.3688 14.9244 11.553 15.0027 11.709 15.1593C11.8656 15.3153 11.9439 15.4995 11.9439 15.7119C11.9439 15.9243 11.8656 16.1088 11.709 16.2654C11.553 16.4214 11.3688 16.4994 11.1564 16.4994H3.825Z", fill: "currentColor" })));
+};
+exports.ContentCopyIcon = ContentCopyIcon;

package/lib/components/common/CustomIcon/components/DiscourseIcon/discourseIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom Discourse icon (socials).
+ */
+export declare const DiscourseIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;

package/lib/components/common/CustomIcon/components/DiscourseIcon/discourseIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DiscourseIcon = void 0;
+const material_1 = require("@mui/material");
+const react_1 = __importDefault(require("react"));
+/**
+ * Custom Discourse icon (socials).
+ */
+const DiscourseIcon = (_a) => {
+    var { fontSize = "xsmall", viewBox = "0 0 18 18" } = _a, props = __rest(_a, ["fontSize", "viewBox"]) /* Spread props to allow for Mui SvgIconProps specific prop overrides e.g. "htmlColor". */;
+    return (react_1.default.createElement(material_1.SvgIcon, Object.assign({ fontSize: fontSize, viewBox: viewBox }, props),
+        react_1.default.createElement("path", { d: "M9.02808 2.7002C5.59683 2.7002 2.69995 5.48457 2.69995 8.91582C2.69995 9.0002 2.69995 15.3002 2.69995 15.3002H9.02808C12.4875 15.3002 15.3 12.4314 15.3 9.0002C15.3 5.59707 12.4875 2.7002 9.02808 2.7002ZM8.99995 12.6002C8.43745 12.6002 7.9312 12.4877 7.45308 12.2627L5.17495 12.8252L5.82183 10.7158C5.54058 10.2096 5.39995 9.64707 5.39995 9.0002C5.39995 7.03145 7.00308 5.4002 8.99995 5.4002C10.9687 5.4002 12.6 7.03145 12.6 9.0002C12.6 10.9971 10.9687 12.6002 8.99995 12.6002Z", fill: "currentColor" })));
+};
+exports.DiscourseIcon = DiscourseIcon;

package/lib/components/common/CustomIcon/components/DownloadIcon/downloadIcon.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { CustomSVGIconProps } from "../../common/entities";
+/**
+ * Custom download icon.
+ */
+export declare const DownloadIcon: ({ fontSize, viewBox, ...props }: CustomSVGIconProps) => JSX.Element;