@saleor/macaw-ui 0.3.1 → 0.3.2

package/dist/theme/createSaleorTheme/overrides/buttons.d.ts

@@ -1,3 +1,3 @@
-import type { Overrides } from "@material-ui/core/styles/overrides";
+import type { ThemeOptions } from "@material-ui/core/styles";
 import { SaleorThemeColors } from "../types";
-export declare const buttonOverrides: (colors: SaleorThemeColors) => Overrides;
+export declare const buttonOverrides: (colors: SaleorThemeColors) => ThemeOptions["overrides"];

package/dist/theme/createSaleorTheme/overrides/index.d.ts

@@ -1,3 +1,3 @@
-import type { Overrides } from "@material-ui/core/styles/overrides";
+import type { ThemeOptions } from "@material-ui/core/styles";
 import { SaleorThemeColors } from "../types";
-export declare const overrides: (colors: SaleorThemeColors, fontFamily: string) => Overrides;
+export declare const overrides: (colors: SaleorThemeColors, fontFamily: string) => ThemeOptions["overrides"];

package/dist/theme/createSaleorTheme/overrides/inputs.d.ts

@@ -1,3 +1,3 @@
-import type { Overrides } from "@material-ui/core/styles/overrides";
+import { ThemeOptions } from "@material-ui/core/styles";
 import { SaleorThemeColors } from "../types";
-export declare const inputOverrides: (colors: SaleorThemeColors) => Overrides;
+export declare const inputOverrides: (colors: SaleorThemeColors) => ThemeOptions["overrides"];

package/dist/theme/createSaleorTheme/overrides/tables.d.ts

@@ -1,3 +1,3 @@
-import type { Overrides } from "@material-ui/core/styles/overrides";
+import { ThemeOptions } from "@material-ui/core/styles";
 import { SaleorThemeColors } from "../types";
-export declare const tableOverrides: (colors: SaleorThemeColors, fontFamily: string) => Overrides;
+export declare const tableOverrides: (colors: SaleorThemeColors, fontFamily: string) => ThemeOptions["overrides"];

package/dist/theme/createSaleorTheme/shadows.d.ts

@@ -1,2 +1,2 @@
-import type { Shadows } from "@material-ui/core/styles/shadows";
-export declare const shadows: Shadows;
+import type { ThemeOptions } from "@material-ui/core/styles";
+export declare const shadows: ThemeOptions["shadows"];

package/dist/theme/createSaleorTheme/types.d.ts

@@ -1,6 +1,4 @@
-import type { Theme } from "@material-ui/core/styles";
-import type { ThemeOptions } from "@material-ui/core/styles/createMuiTheme";
-import type { Palette, PaletteOptions } from "@material-ui/core/styles/createPalette";
+import type { Theme, ThemeOptions } from "@material-ui/core/styles";
 export declare type ThemeType = "light" | "dark";
 export declare type SaleorThemeColors = Record<"primary" | "secondary" | "error" | "paperBorder" | "autofill" | "success" | "disabled", string> & {
     highlightInactive: Record<"default", string>;
@@ -18,7 +16,7 @@ export declare type SaleorThemeColors = Record<"primary" | "secondary" | "error"
     alert: AlertColors;
     theme: ThemeType;
     fail: Record<"dark" | "mid" | "light", string>;
-    main: Record<1 | 2 | 3 | 4 | 5, string>;
+    main: Record<1 | 2 | 3 | 4, string>;
     active: Record<1 | 2 | 3 | 4 | 5, string>;
     errorAction: Record<1 | 2 | 3 | 4 | 5, string>;
 };
@@ -33,10 +31,8 @@ interface ExtraPalette {
     };
 }
 declare type ExtraPaletteOptions = Partial<ExtraPalette>;
-export interface SaleorPalette extends Palette, ExtraPalette {
-}
-export interface SaleorPaletteOptions extends PaletteOptions, ExtraPaletteOptions {
-}
+export declare type SaleorPalette = Theme["palette"] & ExtraPalette;
+export declare type SaleorPaletteOptions = ThemeOptions["palette"] & ExtraPaletteOptions;
 export interface SaleorSpacing {
     (): string;
     (value: number): string;

package/dist/types/CircleIndicator/CircleIndicator.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { PillColor } from "../Pill";
+export declare type CircleIndicatorColor = PillColor;
+export interface CircleIndicatorProps {
+    color: CircleIndicatorColor;
+}
+export declare const CircleIndicator: React.FC<CircleIndicatorProps>;

package/dist/types/CircleIndicator/CircleIndicator.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, Story } from "@storybook/react";
+export declare const Default: Story;
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;

package/dist/types/CircleIndicator/index.d.ts

@@ -0,0 +1 @@
+export * from './CircleIndicator';

package/dist/types/CircleIndicator/styles.d.ts

@@ -0,0 +1,2 @@
+declare const useStyles: (props?: any) => import("@material-ui/styles").ClassNameMap<"dark" | "error" | "success" | "warning" | "info">;
+export default useStyles;

package/dist/types/ConfirmButton/ConfirmButton.d.ts

@@ -1,5 +1,5 @@
-import { ButtonProps } from "../Button";
 import React from "react";
+import { ButtonProps } from "../Button";
 export declare type ConfirmButtonTransitionState = "loading" | "success" | "error" | "default";
 export declare type ConfirmButtonLabels = Record<"confirm" | "error", string>;
 export interface ConfirmButtonProps extends Omit<ButtonProps, "classes"> {

package/dist/types/Pill/Pill.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
 import { ChipProps } from "@material-ui/core/Chip";
+import React from "react";
 export declare type PillColor = "error" | "warning" | "success" | "info";
 export interface PillProps extends Omit<ChipProps, "onDelete" | "avatar" | "icon" | "disabled" | "deleteIcon" | "color" | "disabled" | "classes" | "clickable"> {
     active?: boolean;

package/dist/types/StatusChip/styles.d.ts

@@ -0,0 +1,3 @@
+import { StatusChipProps } from "./types";
+declare const useStyles: (props: StatusChipProps) => import("@material-ui/styles").ClassNameMap<"label" | "root">;
+export default useStyles;

package/dist/types/icons/CircleIndicatorIcon.d.ts

@@ -0,0 +1 @@
+export declare const CircleIndicatorIcon: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core").SvgIconTypeMap<{}, "svg">>;

package/dist/types/icons/SuccessCircleIndicatorIcon.d.ts

@@ -0,0 +1 @@
+export declare const SuccessCircleIndicatorIcon: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core").SvgIconTypeMap<{}, "svg">>;

package/dist/types/icons/index.d.ts

@@ -10,6 +10,7 @@ export * from "./CheckboxCheckedIcon";
 export * from "./CheckboxIcon";
 export * from "./CheckboxIndeterminateIcon";
 export * from "./ChevronIcon";
+export * from "./CircleIndicatorIcon";
 export * from "./Close2Icon";
 export * from "./CloseIcon";
 export * from "./ColumnsIcon";
@@ -74,6 +75,7 @@ export * from "./SettingsIcon";
 export * from "./SettingsLargeIcon";
 export * from "./SnapshotsIcon";
 export * from "./StaffMembersLargeIcon";
+export * from "./SuccessCircleIndicatorIcon";
 export * from "./TaxesLargeIcon";
 export * from "./TimeIcon";
 export * from "./TokenLargeIcon";

package/dist/types/index.d.ts

@@ -32,3 +32,4 @@ export * from "./OffsettedList";
 export * from "./List";
 export * from "./NavigationCard";
 export * from "./Pill";
+export * from "./CircleIndicator";

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.3.1",
+  "version": "0.3.2",
   "license": "CC-BY-4.0",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -104,6 +104,8 @@
     "@types/react-dom": "^17.0.4",
     "@types/react-helmet": "^6.1.1",
     "@types/react-inlinesvg": "^1.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.12.0",
+    "@typescript-eslint/parser": "^5.12.0",
     "chromatic": "^6.0.4",
     "concurrently": "^6.3.0",
     "esbuild": "^0.13.4",

package/src/ActionBar/styles.ts

@@ -22,7 +22,7 @@ const useStyles = makeStyles(
       height: 72,
     },
     shadow: {
-      boxShadow: `0 -24px 20px -20px rgba(0, 0, 0, 0.15)`,
+      boxShadow: "0 -24px 20px -20px rgba(0, 0, 0, 0.15)",
     },
   }),
   { name: "Savebar" }

package/src/Alert/Alert.tsx

@@ -1,9 +1,9 @@
 import Typography from "@material-ui/core/Typography";
-import { CloseIcon } from "../icons";
 import clsx from "clsx";
 import React from "react";
-import { IconButton } from "../IconButton";
 
+import { IconButton } from "../IconButton";
+import { CloseIcon } from "../icons";
 import { CompleteIcon, InfoIcon, NotAllowedIcon, WarningIcon } from "../icons";
 import { AlertBase, AlertBaseProps, AlertVariant } from "./AlertBase";
 import useStyles from "./styles";

package/src/Backlink/Backlink.stories.tsx

@@ -21,7 +21,6 @@ const Wrapper: React.FC = ({ children }) => {
     }, 50) as any;
 
     return () => clearInterval(timer.current);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   return (

package/src/Backlink/Backlink.tsx

@@ -2,10 +2,10 @@ import Portal from "@material-ui/core/Portal";
 import Skeleton from "@material-ui/lab/Skeleton";
 import React from "react";
 
+import { ArrowRightIcon } from "../icons";
 import { LayoutButton, LayoutButtonProps } from "../LayoutButton";
 import { useBacklink } from "./context";
 import useStyles from "./styles";
-import { ArrowRightIcon } from "../icons";
 
 export interface AppHeaderProps extends LayoutButtonProps {
   children: React.ReactNode;

package/src/BaseList/BaseList.tsx

@@ -1,5 +1,6 @@
 import clsx from "clsx";
 import React from "react";
+
 import {
   ListContext,
   ListGridContext,

package/src/BaseList/context.ts

@@ -1,4 +1,5 @@
 import { createContext, useContext, useMemo } from "react";
+
 import { ListGridTemplate, useGridTemplateStyles } from "./styles";
 
 export const ListContext = createContext<"body" | "head" | "foot">("body");

package/src/BaseList/styles.ts

@@ -1,4 +1,5 @@
 import { merge } from "lodash";
+
 import { makeStyles } from "..";
 
 export type ListGridTemplate = string[] | Record<string, string[]>;

package/src/CircleIndicator/CircleIndicator.stories.tsx

@@ -0,0 +1,48 @@
+import { Typography } from "@material-ui/core";
+import { Meta, Story } from "@storybook/react";
+import clsx from "clsx";
+import React from "react";
+import { Decorator, GuideDecorator } from "../utils/Decorator";
+import useGuideStyles from "../utils/guideStyles";
+
+import { CircleIndicator } from "./CircleIndicator";
+
+const StoryWrapper: React.FC = () => {
+  const guideClasses = useGuideStyles();
+
+  return (
+    <div>
+      <Typography className={guideClasses.headline} variant="h1">
+        Circle Indicators
+      </Typography>
+      <Typography className={guideClasses.paragraph} component="p">
+        Circle Indicators represent status of a certain element. 
+      </Typography>
+      <div style={{ display: "flex", gap: "24px" }}>
+        <div
+          className={clsx(guideClasses.border)}
+          style={{
+            display: "grid",
+            gridTemplateColumns: "repeat(2, 1fr)",
+            placeItems: "center",
+            gap: 24,
+            margin: "auto",
+            padding: 24,
+          }}
+        >
+        Error <CircleIndicator color="error" />
+        Warning <CircleIndicator color="warning" />
+        Success <CircleIndicator color="success" />
+        Info <CircleIndicator color="info" />
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export const Default: Story = () => <StoryWrapper />;
+
+export default {
+  decorators: [Decorator, GuideDecorator],
+  title: "Circle Indicator",
+} as Meta;

package/src/CircleIndicator/CircleIndicator.tsx

@@ -0,0 +1,34 @@
+import clsx from "clsx";
+import React from "react";
+
+import { CircleIndicatorIcon, SuccessCircleIndicatorIcon, useTheme } from "..";
+import { PillColor } from "../Pill";
+import useStyles from "./styles";
+
+export type CircleIndicatorColor = PillColor;
+
+export interface CircleIndicatorProps {
+  color: CircleIndicatorColor;
+}
+
+export const CircleIndicator: React.FC<CircleIndicatorProps> = ({ color }) => {
+  const { themeType } = useTheme();
+  const classes = useStyles();
+
+  return color === "success" ? (
+    <SuccessCircleIndicatorIcon
+      className={clsx(classes.success, themeType === "dark" && classes.dark)}
+    />
+  ) : (
+    <CircleIndicatorIcon
+      className={clsx({
+        [classes.error]: color === "error",
+        [classes.warning]: color === "warning",
+        [classes.info]: color === "info",
+        [classes.dark]: themeType === "dark",
+      })}
+    />
+  );
+};
+
+CircleIndicator.displayName = "CircleIndicator";

package/src/CircleIndicator/index.ts

@@ -0,0 +1 @@
+export * from './CircleIndicator';

package/src/CircleIndicator/styles.ts

@@ -0,0 +1,31 @@
+import { makeStyles } from "../theme";
+
+const useStyles = makeStyles(
+  (theme) => ({
+    dark: {},
+    success: {
+      color: theme.palette.saleor.success.mid,
+      "&$dark": {
+        color: theme.palette.saleor.success.dark,
+      },
+    },
+    error: {
+      color: theme.palette.saleor.fail.mid,
+      "&$dark": {
+        color: theme.palette.saleor.fail.dark,
+      },
+    },
+    warning: {
+      color: theme.palette.saleor.warning.mid,
+      "&$dark": {
+        color: theme.palette.saleor.warning.dark,
+      },
+    },
+    info: {
+      color: theme.palette.saleor.main[1],
+    },
+  }),
+  { name: "CircleIndicator" }
+);
+
+export default useStyles;

package/src/ConfirmButton/ConfirmButton.tsx

@@ -1,9 +1,9 @@
-import { Button, ButtonProps } from "../Button";
 import CircularProgress from "@material-ui/core/CircularProgress";
 import CheckIcon from "@material-ui/icons/Check";
 import clsx from "clsx";
 import React from "react";
 
+import { Button, ButtonProps } from "../Button";
 import useStyles from "./styles";
 
 const DEFAULT_NOTIFICATION_SHOW_TIME = 3000;

package/src/Filter/Filter.tsx

@@ -2,10 +2,10 @@ import IconButton from "@material-ui/core/IconButton";
 import MenuItem from "@material-ui/core/MenuItem";
 import Select from "@material-ui/core/Select";
 import Typography from "@material-ui/core/Typography";
-import { DeleteIcon } from "../icons";
 import { difference } from "lodash";
 import React from "react";
 
+import { DeleteIcon } from "../icons";
 import { useFilters } from "./context";
 import { FilterContent } from "./FilterContent";
 import useStyles from "./styles";
@@ -27,7 +27,6 @@ export const Filter: React.FC<FilterProps> = ({ name, label, ...options }) => {
     registered.current = true;
 
     return () => unregister(name);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   React.useEffect(() => {
@@ -43,7 +42,6 @@ export const Filter: React.FC<FilterProps> = ({ name, label, ...options }) => {
         },
       });
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [options.choices]);
 
   return null;

package/src/Filter/FilterBar.tsx

@@ -63,7 +63,6 @@ export const FilterBar: React.FC<FilterBarProps> = React.forwardRef(
 
     React.useEffect(
       () => changeCb(utils.getActiveFilters(filterData)),
-      // eslint-disable-next-line react-hooks/exhaustive-deps
       [filterData]
     );
 

package/src/LayoutButton/LayoutButton.tsx

@@ -1,10 +1,9 @@
 import type { ButtonBaseProps } from "@material-ui/core/ButtonBase";
-
 import ButtonBase from "@material-ui/core/ButtonBase";
 import clsx from "clsx";
 import React from "react";
-import { UserInteraction } from "../../types/utils";
 
+import { UserInteraction } from "../../types/utils";
 import useStyles from "./styles";
 
 export type LayoutButtonProps<T extends React.ElementType = "button"> =

package/src/List/List.stories.tsx

@@ -1,9 +1,11 @@
-import { Card, CardHeader, Checkbox } from "@material-ui/core";
+import Card from "@material-ui/core/Card";
+import CardHeader from "@material-ui/core/CardHeader";
+import Checkbox from "@material-ui/core/Checkbox";
 import { Meta, Story } from "@storybook/react";
 import React from "react";
+
 import { DeleteIcon, IconButton, Pagination } from "..";
 import { useListStory } from "../utils/useListStory";
-
 import {
   List,
   ListBody,

package/src/List/List.tsx

@@ -1,4 +1,5 @@
 import React, { useState } from "react";
+
 import { useTheme } from "..";
 import {
   BaseList,

package/src/List/styles.ts

@@ -1,4 +1,5 @@
 import { CSSProperties } from "react";
+
 import { makeStyles } from "..";
 
 export const useStyles = makeStyles(

package/src/NavigationCard/NavigationCard.stories.tsx

@@ -1,8 +1,8 @@
+import Grid from "@material-ui/core/Grid";
 import { Meta, Story } from "@storybook/react";
 import React from "react";
-import { Grid } from "@material-ui/core";
-import { DeleteIcon } from "..";
 
+import { DeleteIcon } from "..";
 import { NavigationCard } from "./NavigationCard";
 import { NavigationCardBase } from "./NavigationCardBase";
 

package/src/NavigationCard/NavigationCard.tsx

@@ -1,10 +1,10 @@
 import Typography from "@material-ui/core/Typography";
 import React from "react";
+
 import {
   NavigationCardBase,
   NavigationCardBaseProps,
 } from "./NavigationCardBase";
-
 import useStyles from "./styles";
 
 export interface NavigationCardProps extends NavigationCardBaseProps {

package/src/Notification/Notification.tsx

@@ -1,14 +1,14 @@
 import SnackbarContent from "@material-ui/core/SnackbarContent";
 import Typography from "@material-ui/core/Typography";
-import { CloseIcon, ExpandIcon } from "../icons";
 import clsx from "clsx";
 import React, { useState } from "react";
 
+import { Button } from "../Button";
+import { IconButton } from "../IconButton";
+import { CloseIcon, ExpandIcon } from "../icons";
 import { CompleteIcon, InfoIcon, NotAllowedIcon, WarningIcon } from "../icons";
 import useStyles from "./styles";
 import type { NotificationProps, NotificationType } from "./types";
-import { Button } from "../Button";
-import { IconButton } from "../IconButton";
 
 interface IconProps extends React.SVGProps<SVGSVGElement> {
   type: NotificationType;

package/src/OffsettedList/OffsettedList.stories.tsx

@@ -1,6 +1,7 @@
-import { Checkbox } from "@material-ui/core";
+import Checkbox from "@material-ui/core/Checkbox";
 import { Meta, Story } from "@storybook/react";
 import React from "react";
+
 import {
   DeleteIcon,
   EditIcon,
@@ -9,7 +10,6 @@ import {
   useOffsettedListWidths,
 } from "..";
 import { useListStory } from "../utils/useListStory";
-
 import {
   OffsettedList,
   OffsettedListBody,

package/src/OffsettedList/OffsettedList.tsx

@@ -1,4 +1,5 @@
 import React from "react";
+
 import { useTheme } from "..";
 import {
   BaseList,

package/src/Pill/Pill.stories.tsx

@@ -1,11 +1,11 @@
+import Typography from "@material-ui/core/Typography";
 import { Meta, Story } from "@storybook/react";
+import clsx from "clsx";
 import React from "react";
+
 import { Decorator, GuideDecorator } from "../utils/Decorator";
 import useGuideStyles from "../utils/guideStyles";
-
 import { Pill, PillProps } from "./Pill";
-import { Typography } from "@material-ui/core";
-import clsx from "clsx";
 
 const labels = {
   error: "Error",

package/src/Pill/Pill.tsx

@@ -1,8 +1,9 @@
-import React from "react";
 import Chip, { ChipProps } from "@material-ui/core/Chip";
-import useStyles from "./styles";
 import clsx from "clsx";
+import React from "react";
+
 import { useTheme } from "..";
+import useStyles from "./styles";
 
 export type PillColor = "error" | "warning" | "success" | "info";
 

package/src/PillLink/PillLink.tsx

@@ -4,6 +4,7 @@ import {
 } from "@material-ui/core/OverridableComponent";
 import clsx from "clsx";
 import React from "react";
+
 import { UserInteraction } from "../../types/utils";
 import useStyles from "./styles";
 

package/src/Savebar/Savebar.tsx

@@ -1,6 +1,6 @@
 import React from "react";
-import { Button } from "..";
 
+import { Button } from "..";
 import { useActionBar } from "../ActionBar";
 import { ActionBar } from "../ActionBar/ActionBar";
 import {

package/src/Sidebar/ExpandButton.tsx

@@ -1,8 +1,8 @@
 import { ButtonProps } from "@material-ui/core/Button";
 import clsx from "clsx";
 import React from "react";
-import { ChevronIcon } from "../icons";
 
+import { ChevronIcon } from "../icons";
 import { SquareButton } from "../SquareButton";
 import { makeStyles } from "../theme";
 

package/src/StatusChip/StatusChip.tsx

@@ -1,6 +1,6 @@
 import React from "react";
-import { Pill, PillColor } from "../Pill/Pill";
 
+import { Pill, PillColor } from "../Pill/Pill";
 import { StatusChipProps } from "./types";
 
 const colors: Record<StatusChipProps["variant"], PillColor> = {

package/src/UserChipMenu/UserChipMenu.tsx

@@ -7,8 +7,8 @@ import Paper from "@material-ui/core/Paper";
 import Popper from "@material-ui/core/Popper";
 import Typography from "@material-ui/core/Typography";
 import React from "react";
-import { LayoutButton } from "..";
 
+import { LayoutButton } from "..";
 import { UserChipMenuContext } from "./context";
 import useStyles from "./styles";
 

package/src/consts.ts

@@ -0,0 +1 @@
+export const isWindowDefined = typeof window !== "undefined";

package/src/icons/CircleIndicatorIcon.tsx

@@ -0,0 +1,10 @@
+import { createSvgIcon } from "@material-ui/core/utils";
+import React from "react";
+
+export const CircleIndicatorIcon = createSvgIcon(
+  <>
+    <circle cx="12" cy="12" r="12" fill="currentColor" />
+    <circle cx="12" cy="12" r="9" fill="var(--background-paper)" />
+  </>,
+  "CircleIndicatorIcon"
+);

package/src/icons/SuccessCircleIndicatorIcon.tsx

@@ -0,0 +1,16 @@
+import { createSvgIcon } from "@material-ui/core/utils";
+import React from "react";
+
+export const SuccessCircleIndicatorIcon = createSvgIcon(
+  <>
+    <circle cx="12" cy="12" r="12" fill="currentColor" />
+    <circle cx="12" cy="12" r="9" fill="var(--background-paper)" />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M10.7071 13.5858L16 8.29291L17.4142 9.70712L10.7071 16.4142L7 12.7071L8.41421 11.2929L10.7071 13.5858Z"
+      fill="currentColor"
+    />
+  </>,
+  "SuccessCircleIndicatorIcon"
+);

package/src/icons/index.ts

@@ -10,6 +10,7 @@ export * from "./CheckboxCheckedIcon";
 export * from "./CheckboxIcon";
 export * from "./CheckboxIndeterminateIcon";
 export * from "./ChevronIcon";
+export * from "./CircleIndicatorIcon";
 export * from "./Close2Icon";
 export * from "./CloseIcon";
 export * from "./ColumnsIcon";
@@ -74,6 +75,7 @@ export * from "./SettingsIcon";
 export * from "./SettingsLargeIcon";
 export * from "./SnapshotsIcon";
 export * from "./StaffMembersLargeIcon";
+export * from "./SuccessCircleIndicatorIcon";
 export * from "./TaxesLargeIcon";
 export * from "./TimeIcon";
 export * from "./TokenLargeIcon";

package/src/index.tsx

@@ -32,3 +32,4 @@ export * from "./OffsettedList";
 export * from "./List";
 export * from "./NavigationCard";
 export * from "./Pill";
+export * from "./CircleIndicator"