@cyber-harbour/ui 1.0.74 → 1.0.76

package/src/Core/Drawer/Drawer.tsx

@@ -1,118 +0,0 @@
-import { createPortal } from 'react-dom';
-import { styled } from 'styled-components';
-import {
-  createComponent,
-  createStyledComponent,
-  FabricComponent,
-  generatePropertySpaceStyle,
-  propToRem,
-  pxToRem,
-  StyledFabricComponent,
-} from '../../Theme';
-import { useBodyScrollLock } from '../../utils';
-import { useEffect, useRef } from 'react';
-
-type DrawerProps = {
-  isOpen: boolean;
-  onClose: () => void;
-  children?: any;
-  header?: number; //TODO: remove deps;
-  width?: string | number;
-};
-
-export const Drawer = createComponent<DrawerProps>((props) => {
-  useBodyScrollLock(props.isOpen);
-
-  if (!props.isOpen) return null;
-  return createPortal(<DrawerWithOutclick {...props} />, document.body);
-});
-
-const DrawerWithOutclick = ({ onClose, children, width, header }: DrawerProps) => {
-  const drawerRef = useRef<HTMLDivElement>(null);
-
-  useEffect(() => {
-    const handleClick = (e: MouseEvent) => {
-      const target = e.target as Element;
-      if (
-        drawerRef.current &&
-        !drawerRef.current.contains(target) &&
-        !target.closest('.cb-ui-context-menu') &&
-        !target.closest('.cb-ui-backdrop')
-      ) {
-        onClose();
-      }
-    };
-    document.addEventListener('mousedown', handleClick);
-    return () => {
-      document.removeEventListener('mousedown', handleClick);
-    };
-  }, [onClose]);
-
-  return (
-    <StyledDrawer $header={header} $width={width} ref={drawerRef}>
-      {children}
-    </StyledDrawer>
-  );
-};
-
-type DrawerHeaderProps = FabricComponent<{
-  children?: any;
-}>;
-
-export const DrawerHeader: any = createStyledComponent<DrawerHeaderProps>(
-  styled.div(
-    ({ theme, p = theme.drawer.padding }) => `
-    grid-area: drawer-header;
-    ${generatePropertySpaceStyle(theme, 'padding', p)};
-  `
-  ),
-  {
-    ignoreStyles: ['padding-inline'],
-  }
-);
-
-type DrawerBodyProps = StyledFabricComponent<{
-  children?: any;
-}>;
-
-export const DrawerBody: any = createComponent<DrawerBodyProps>(
-  createStyledComponent<DrawerBodyProps>(
-    styled.div(
-      ({ theme, px = theme.drawer.padding, pb = theme.drawer.padding }) => `
-  grid-area: drawer-body;
-  max-height: 100%;
-  overflow-y: auto;
-  ${generatePropertySpaceStyle(theme, 'padding-inline', px)};
-  ${generatePropertySpaceStyle(theme, 'padding-bottom', pb)};
-`
-    ),
-    {
-      ignoreStyles: ['padding', 'padding-bottom'],
-    }
-  )
-);
-
-type StyledDrawerProps = {
-  $header?: number;
-  $width?: string | number;
-};
-
-const StyledDrawer = styled.div<StyledDrawerProps>(
-  ({ theme, $header, $width }) => `
-  position: fixed;
-  display: grid;
-  grid-template-areas:
-    "drawer-header"
-    "drawer-body";
-  grid-template-rows: auto 1fr;
-  z-index: ${theme.zIndex.sticky};
-  top: ${pxToRem($header || 0, theme.baseSize)};
-  bottom: 0;
-  right: 0;
-  width: ${$width ? propToRem($width, theme.baseSize) : theme.drawer.width};
-  max-width: 100%;
-  background-color: ${theme.colors.background};
-  box-shadow: ${theme.drawer.shadow};
-  border-left: 1px solid ${theme.colors.stroke.lighter};
-`
-);

package/src/Core/Drawer/index.ts

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

package/src/Core/EmptyData/EmptyData.tsx

@@ -1,44 +0,0 @@
-import styled from 'styled-components';
-
-export interface EmptyDataProps {
-  children?: any;
-  title?: string;
-  note?: string;
-  className?: string;
-}
-
-export const EmptyData = ({ children, title, note, className }: EmptyDataProps) => {
-  return (
-    <Container className={className}>
-      {!!title && <h2>{title}</h2>}
-      {!!note && <p>{note}</p>}
-      {!!children && children}
-    </Container>
-  );
-};
-
-const Container = styled.div(
-  ({ theme }) => `
-  display: flex;
-  width: 100%;
-  min-width: 0;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  gap: 10px;
-  h2,
-  p {
-    padding: 0;
-    margin: 0;
-    text-align: center;
-    color: ${theme.colors.text.light};
-  }
-  h2 {
-    font-size: ${theme.typography.variants.h2.fontSize};
-    font-weight: 600;
-  }
-  p {
-   font-size: ${theme.typography.variants.h3.fontSize};
-  }
-`
-);

package/src/Core/EmptyData/index.ts

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

package/src/Core/Flex/FlexContainer.tsx

@@ -1,94 +0,0 @@
-import { CSSProperties, forwardRef } from 'react';
-import { createComponent, createStyledComponent, FabricComponent, StyledFabricComponent } from '../../Theme';
-import styled from 'styled-components';
-
-export type FlexDirection = 'row' | 'column' | 'row-reverse' | 'column-reverse';
-export type FlexWrap = 'nowrap' | 'wrap' | 'wrap-reverse';
-export type FlexJustify = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
-export type FlexAlign = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
-export type FlexGap = string | number;
-
-export interface FlexContainerProps extends FabricComponent<Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>> {
-  children: any;
-  direction?: FlexDirection;
-  wrap?: FlexWrap;
-  justify?: FlexJustify;
-  align?: FlexAlign;
-  alignContent?: FlexAlign;
-  gap?: FlexGap;
-  rowGap?: FlexGap;
-  columnGap?: FlexGap;
-  className?: string;
-  style?: CSSProperties;
-  as?: any; // TODO: fix type to styled component or intrinsic element
-}
-
-export const FlexContainer = createComponent<FlexContainerProps, HTMLDivElement>(
-  forwardRef<HTMLDivElement, FlexContainerProps>(
-    (
-      {
-        children,
-        direction = 'row',
-        wrap = 'nowrap',
-        justify = 'flex-start',
-        align = 'stretch',
-        alignContent,
-        gap,
-        rowGap,
-        columnGap,
-        className,
-        style,
-        as = 'div',
-        ...props
-      },
-      ref
-    ) => {
-      return (
-        <StyledContainer
-          as={as}
-          $direction={direction}
-          $wrap={wrap}
-          $justify={justify}
-          $align={align}
-          $alignContent={alignContent}
-          $gap={gap}
-          $rowGap={rowGap}
-          $columnGap={columnGap}
-          className={className}
-          style={style}
-          ref={ref}
-          {...props}
-        >
-          {children}
-        </StyledContainer>
-      );
-    }
-  )
-);
-
-type StyledFlexContainerProps = StyledFabricComponent<{
-  $direction: FlexDirection;
-  $wrap: FlexWrap;
-  $justify: FlexJustify;
-  $align: FlexAlign;
-  $alignContent?: FlexAlign;
-  $gap?: FlexGap;
-  $rowGap?: FlexGap;
-  $columnGap?: FlexGap;
-}>;
-
-const StyledContainer = createStyledComponent<StyledFlexContainerProps>(styled.div`
-  ${({ $direction, $wrap, $justify, $align, $alignContent, $gap, $rowGap, $columnGap }) => `
-    display: flex;
-    width: 100%;
-    min-width: 0;
-    flex-direction: ${$direction};
-    flex-wrap: ${$wrap};
-    justify-content: ${$justify};
-    align-items: ${$align};
-    ${$alignContent ? `align-content: ${$alignContent};` : ''}
-    ${$gap !== undefined ? `gap: ${typeof $gap === 'number' ? `${$gap}px` : $gap};` : ''}
-    ${$rowGap !== undefined ? `row-gap: ${typeof $rowGap === 'number' ? `${$rowGap}px` : $rowGap};` : ''}
-    ${$columnGap !== undefined ? `column-gap: ${typeof $columnGap === 'number' ? `${$columnGap}px` : $columnGap};` : ''}
-  `}
-`);

package/src/Core/Flex/FlexItem.tsx

@@ -1,58 +0,0 @@
-import { CSSProperties, ReactNode } from 'react';
-import { styled } from 'styled-components';
-import { createComponent } from '../../Theme';
-
-export type FlexItemGrow = number;
-export type FlexItemShrink = number;
-export type FlexItemBasis = string | number;
-export type FlexItemAlign = 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
-
-export interface FlexItemProps {
-  children?: any;
-  grow?: FlexItemGrow;
-  shrink?: FlexItemShrink;
-  basis?: FlexItemBasis;
-  align?: FlexItemAlign;
-  order?: number;
-  className?: string;
-  style?: CSSProperties;
-  as?: any; //TODO: fix type to styled component or intrinsic element
-}
-
-export const FlexItem = createComponent<FlexItemProps>(
-  ({ children, grow, shrink, basis, align, order, className, style, as = 'div' }) => {
-    return (
-      <StyledFlexItem
-        as={as}
-        $grow={grow}
-        $shrink={shrink}
-        $basis={basis}
-        $align={align}
-        $order={order}
-        className={className}
-        style={style}
-      >
-        {children}
-      </StyledFlexItem>
-    );
-  }
-);
-
-interface StyledFlexItemProps {
-  $grow?: FlexItemGrow;
-  $shrink?: FlexItemShrink;
-  $basis?: FlexItemBasis;
-  $align?: FlexItemAlign;
-  $order?: number;
-}
-
-const StyledFlexItem = styled.div<StyledFlexItemProps>`
-  ${({ $grow, $shrink, $basis, $align, $order }) => `
-    min-width: 0;
-    ${$grow !== undefined ? `flex-grow: ${$grow};` : ''}
-    ${$shrink !== undefined ? `flex-shrink: ${$shrink};` : ''}
-    ${$basis !== undefined ? `flex-basis: ${typeof $basis === 'number' ? `${$basis}px` : $basis};` : ''}
-    ${$align ? `align-self: ${$align};` : ''}
-    ${$order !== undefined ? `order: ${$order};` : ''}
-  `}
-`;

package/src/Core/Flex/index.ts

@@ -1,4 +0,0 @@
-import { FlexContainer } from './FlexContainer';
-import { FlexItem } from './FlexItem';
-
-export { FlexContainer, FlexItem };

package/src/Core/Header/Header.tsx

@@ -1,37 +0,0 @@
-import { styled } from 'styled-components';
-
-interface HeaderProps {
-  children?: any;
-}
-
-export const Header = ({ children }: HeaderProps) => {
-  return <StyledContainer>{children}</StyledContainer>;
-};
-
-const StyledContainer = styled.header(
-  ({ theme }) => `
-    display: flex;
-    position: sticky;
-    top: 0;
-    z-index: 1000;
-    align-items: center;
-    justify-content: space-between;
-    padding-left: 12px;
-    padding-right: 20px;
-    height: 56px;
-    background-color: ${theme.colors.background};
-    border-bottom: 1px solid ${theme.colors.stroke.light};
-
-    &:before {
-      content: '';
-      display: block;
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 25dvh;
-      transform: translateY(-100%);
-      background: ${theme.colors.background};
-    }
-`
-);

package/src/Core/Header/HeaderDelimeter.tsx

@@ -1,12 +0,0 @@
-import { styled } from 'styled-components';
-
-export const HeaderDelimeter = () => {
-  return <StyledDelimeter />;
-};
-
-const StyledDelimeter = styled.div(
-  ({ theme }) => `
-    height: 32px;
-    border-right: 1px dashed ${theme.colors.stroke.main};
-`
-);

package/src/Core/Header/HeaderSection.tsx

@@ -1,37 +0,0 @@
-import { CSSProperties } from 'react';
-import { styled } from 'styled-components';
-
-interface HeaderSectionProps {
-  grow?: CSSProperties['flexGrow'];
-  shrink?: CSSProperties['flexShrink'];
-  basis?: CSSProperties['flexBasis'];
-  justify?: CSSProperties['justifyContent'];
-  children?: React.ReactNode;
-}
-
-interface StyledProps {
-  $grow?: CSSProperties['flexGrow'];
-  $shrink?: CSSProperties['flexShrink'];
-  $basis?: CSSProperties['flexBasis'];
-  $justify?: CSSProperties['justifyContent'];
-}
-
-export const HeaderSection = ({ grow, shrink, basis, justify, children }: HeaderSectionProps) => {
-  return (
-    <StyledSection $grow={grow} $shrink={shrink} $basis={basis} $justify={justify}>
-      {children}
-    </StyledSection>
-  );
-};
-
-const StyledSection = styled.section<StyledProps>(
-  ({ $grow = 1, $shrink = 1, $basis = '100%', $justify = 'space-between' }) => `
-    display: flex;
-    align-items: center;
-    justify-content: ${$justify};
-    gap: 20px;
-    flex-grow: ${$grow};
-    flex-shrink: ${$shrink};
-    flex-basis: ${$basis};
-`
-);

package/src/Core/Header/index.ts

@@ -1,3 +0,0 @@
-export * from './Header';
-export * from './HeaderDelimeter';
-export * from './HeaderSection';

package/src/Core/IconComponents/AlertIcon.tsx

@@ -1,18 +0,0 @@
-import { SVGProps } from 'react';
-
-interface AlertIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const AlertIcon = ({ fill = 'currentColor', ...props }: AlertIconProps) => {
-  return (
-    <svg viewBox="0 0 17 15" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M6.8676 1.3524C7.53792 0.215866 9.21522 0.215866 9.88554 1.3524L16.1406 11.9435C16.8109 13.0801 15.9712 14.5 14.6306 14.5H2.12155C0.779912 14.5 -0.0587385 13.0801 0.61258 11.9435L6.8676 1.3524ZM8.37657 3.79201C8.57469 3.79201 8.7647 3.86897 8.90479 4.00595C9.04488 4.14293 9.12358 4.32871 9.12358 4.52243V7.93107C9.12358 8.12479 9.04488 8.31058 8.90479 8.44756C8.7647 8.58454 8.57469 8.66149 8.37657 8.66149C8.17845 8.66149 7.98844 8.58454 7.84835 8.44756C7.70826 8.31058 7.62955 8.12479 7.62955 7.93107V4.52243C7.62955 4.32871 7.70826 4.14293 7.84835 4.00595C7.98844 3.86897 8.17845 3.79201 8.37657 3.79201ZM8.37657 12.5571C8.64073 12.5571 8.89407 12.4545 9.08086 12.2718C9.26765 12.0892 9.37259 11.8415 9.37259 11.5832C9.37259 11.3249 9.26765 11.0772 9.08086 10.8945C8.89407 10.7119 8.64073 10.6093 8.37657 10.6093C8.11241 10.6093 7.85907 10.7119 7.67227 10.8945C7.48548 11.0772 7.38055 11.3249 7.38055 11.5832C7.38055 11.8415 7.48548 12.0892 7.67227 12.2718C7.85907 12.4545 8.11241 12.5571 8.37657 12.5571Z"
-        fill={fill}
-      />
-    </svg>
-  );
-};

package/src/Core/IconComponents/AndroidIcon.tsx

@@ -1,28 +0,0 @@
-import { SVGProps } from 'react';
-
-interface AndroidIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const AndroidIcon = ({ fill = 'currentColor', ...props }: AndroidIconProps) => {
-  return (
-    <svg viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <path
-        d="M13.0054 7.9201C12.9254 7.0301 12.1654 6.2901 11.2454 6.1901C10.7254 6.1301 9.84544 6.1001 8.87544 6.1001C7.95544 6.1001 7.12544 6.1301 6.62544 6.1801C5.60544 6.2801 4.88544 7.0501 4.80544 8.1201C4.73544 9.0901 4.70544 11.0701 4.82544 11.9701C4.93544 12.7301 5.47544 13.3501 6.23544 13.6001C6.24544 13.7801 6.23544 13.9801 6.22544 14.1901C6.19544 15.0901 6.13544 16.4401 7.40544 16.5001H7.49544C7.86544 16.5001 8.15544 16.3901 8.36544 16.1701C8.78544 15.7401 8.76544 14.9901 8.74544 14.3301C8.73544 14.0201 8.72544 13.7301 8.81544 13.6501H9.07544V15.4301C9.07544 15.6001 9.35544 16.0501 9.38544 16.1001C9.60544 16.3601 9.93544 16.5001 10.3054 16.5001C10.8554 16.5001 11.4654 16.1701 11.5754 15.5401C11.6054 15.3601 11.5854 14.8901 11.5754 14.4301C11.5654 14.1401 11.5554 13.7601 11.5454 13.6101C12.3654 13.3401 12.9254 12.6901 13.0054 11.9101C13.0954 10.9101 13.0954 8.9401 13.0054 7.9201ZM7.65544 15.3401C7.65544 15.3401 7.57544 15.4001 7.49544 15.4001C7.42544 15.4001 7.37544 15.3701 7.35544 15.3101C7.30544 15.1201 7.28544 13.7401 7.23544 13.6601C7.24544 13.6601 7.27544 13.6501 7.39544 13.6501H7.65544V15.3401ZM10.0854 13.6601C10.0854 13.6601 10.1154 13.6501 10.2354 13.6501H10.4954V15.3401C10.4954 15.3401 10.4154 15.4001 10.3354 15.4001C10.2654 15.4001 10.2154 15.3701 10.1954 15.3101C10.1454 15.1201 10.1254 13.7401 10.0854 13.6601ZM11.9154 11.7301C11.8654 12.2101 11.5554 12.5301 11.0854 12.5701C10.7554 12.6001 10.5154 12.6301 10.0954 12.6101C9.65544 12.5901 9.42544 12.5801 9.25544 12.5801C8.46544 12.5701 8.27544 12.6601 7.56544 12.6401C7.35544 12.6401 7.05544 12.6201 6.69544 12.5801C6.20544 12.4801 5.94544 12.1801 5.89544 11.6701C5.81544 10.8601 5.80544 8.8501 5.90544 8.1201C5.95544 7.6801 6.23544 7.3701 6.57544 7.2801C6.73544 7.2601 6.96544 7.2401 7.23544 7.2301C7.36544 7.2301 7.76544 7.2001 8.59544 7.1801C9.55544 7.1701 9.25544 7.2001 10.1054 7.1801C10.2354 7.1801 10.6054 7.1801 11.0754 7.2501C11.4554 7.3201 11.6354 7.3901 11.7554 7.5301C11.9054 7.7101 11.9154 7.9201 11.9154 8.0301C11.9654 9.1101 12.0754 10.2301 11.9154 11.7201V11.7301Z"
-        fill={fill}
-      />
-      <path
-        d="M11.3952 1.66C10.7352 0.92 9.82522 0.5 8.90522 0.5C8.79522 0.5 8.68522 0.51 8.57522 0.52C6.96522 0.7 5.62522 2.14 5.52522 3.8C5.46522 4.69 5.92522 5.7 6.87522 5.84C7.35522 5.9 8.22522 5.91 8.70522 5.91C9.51522 5.91 10.3452 5.89 10.8052 5.85C11.5552 5.78 12.1952 5.14 12.2852 4.36C12.3952 3.41 12.0752 2.42 11.3952 1.66ZM8.98522 4.82C8.28522 4.82 7.56522 4.8 7.19522 4.76C6.94522 4.73 6.78522 4.63 6.70522 4.45C6.47522 3.97 6.76522 3.09 7.05522 2.64C7.42522 2.06 8.13522 1.64 8.81522 1.6H8.91522C9.81522 1.6 10.7352 2.27 11.0452 3.17C11.1852 3.6 11.2852 4.21 11.0852 4.53C11.0052 4.66 10.8752 4.74 10.6852 4.76C10.3252 4.8 9.66522 4.82 8.98522 4.82Z"
-        fill={fill}
-      />
-      <path
-        d="M4.45531 7.78014C4.34531 7.26014 3.84531 6.89014 3.23531 6.89014C2.87531 6.89014 2.54531 7.02014 2.32531 7.24014C2.13531 7.43014 1.99531 7.80014 1.97531 8.05014C1.90531 8.62014 1.88531 10.6801 1.98531 11.2701C2.11531 11.9401 2.70531 12.2401 3.23531 12.2401C3.87531 12.2401 4.38531 11.8401 4.46531 11.2701C4.54531 10.7801 4.55531 8.25014 4.45531 7.78014ZM3.24531 7.98014C3.24531 7.98014 3.37531 7.98014 3.39531 8.17014C3.45531 8.71014 3.46531 10.5401 3.38531 11.0001C3.37531 11.1101 3.31531 11.1701 3.25531 11.1701C3.16531 11.1701 3.07531 11.0701 3.05531 10.8301C3.00531 10.2601 2.97531 8.71014 3.05531 8.18014C3.07531 8.09014 3.15531 7.99014 3.20531 7.98014H3.24531Z"
-        fill={fill}
-      />
-      <path
-        d="M15.8355 7.99014C15.7655 7.34014 15.2555 6.89014 14.5955 6.89014C14.5255 6.89014 14.4455 6.89014 14.3655 6.91014C13.8555 6.99014 13.4355 7.38014 13.3555 7.85014C13.2455 8.46014 13.2755 10.5401 13.3355 11.1401C13.4155 11.9001 14.0255 12.2401 14.5955 12.2401C15.2055 12.2401 15.7155 11.8701 15.8155 11.3401C15.9255 10.8001 15.9055 8.57014 15.8355 7.99014ZM14.6055 7.99014C14.6755 7.99014 14.7355 7.99014 14.7555 8.17014C14.8155 8.71014 14.8255 10.5501 14.7555 11.0001C14.7355 11.1101 14.6855 11.1601 14.6055 11.1601C14.5255 11.1601 14.4355 11.1101 14.4155 10.9501C14.3455 10.3601 14.3555 8.73014 14.4255 8.18014C14.4455 8.00014 14.4655 8.00014 14.5555 7.99014H14.6055Z"
-        fill={fill}
-      />
-    </svg>
-  );
-};

package/src/Core/IconComponents/ApiIcon.tsx

@@ -1,26 +0,0 @@
-import { SVGProps } from 'react';
-
-interface ApiIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const ApiIcon = ({ fill = 'currentColor', ...props }: ApiIconProps) => {
-  return (
-    <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <g>
-        <path
-          d="M10.2,2.41l-3.38,11.52c-.12.32-.37.5-.68.5-.22,0-.41-.09-.55-.24-.14-.17-.19-.39-.15-.6l3.33-11.34c.08-.37.35-.64.69-.67.26,0,.46.1.6.27.13.15.18.36.14.57Z"
-          fill={fill}
-        />
-        <path
-          d="M16,7.96c-.01.27-.22.46-.44.68l-.09.09c-.98.94-1.97,1.86-2.96,2.8l-1.16,1.09c-.17.09-.28.13-.41.13-.27,0-.53-.17-.66-.42-.12-.24-.08-.54.12-.77l3.82-3.61-3.76-3.45c-.23-.26-.3-.57-.18-.84.12-.27.37-.44.66-.44.15,0,.31.05.44.15l3,2.75s.03.03.03.05c.17.14.33.28.49.44.28.24.55.49.8.73.22.22.31.4.31.6Z"
-          fill={fill}
-        />
-        <path
-          d="M5.22,11.6c.18.28.18.55.05.78s-.36.37-.62.37c-.19,0-.36-.08-.51-.21L.22,8.48c-.27-.28-.3-.68-.05-.98.62-.59,1.21-1.18,1.8-1.76.6-.59,1.2-1.17,1.8-1.75l.12-.12c.22-.21.39-.37.55-.42.08-.01.14-.03.22-.03.27,0,.53.17.64.42.13.26.08.55-.1.77l-1.22,1.2-.93.89c-.45.42-.89.85-1.32,1.27l3.5,3.63Z"
-          fill={fill}
-        />
-      </g>
-    </svg>
-  );
-};

package/src/Core/IconComponents/ArrowCircleTopRightIcon.tsx

@@ -1,27 +0,0 @@
-import { SVGProps } from 'react';
-
-interface ArrowCircleTopRightIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const ArrowCircleTopRightIcon = ({ fill = 'currentColor', ...props }: ArrowCircleTopRightIconProps) => {
-  return (
-    <svg viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <g clipPath="url(#clip0_4867_31686)">
-        <path
-          d="M3.30042 2.23687C7.62196 -1.93984 14.8631 0.000721882 16.548 5.73245C18.3872 12.0039 12.2779 17.7357 6.13 15.4995C0.599454 13.4947 -0.943954 6.33646 3.30042 2.23687ZM8.53515 1.13165C3.14608 1.40152 0.110708 7.53165 3.24897 11.9525C6.38724 16.3734 12.9339 15.6409 15.1332 10.8345C17.3326 6.02803 13.6413 0.874617 8.53515 1.13165Z"
-          fill={fill}
-        />
-        <path
-          d="M11.5576 4.71729C11.7376 4.71729 11.8791 4.8715 11.8534 5.05142L10.7602 10.706C10.7344 10.9117 10.5029 10.9888 10.3229 10.8988L8.47077 9.04821H8.43218L6.33572 11.1173C5.82125 11.5799 5.10099 10.9888 5.47398 10.3976L7.64762 8.22572L5.69263 6.27231C5.57688 6.14379 5.62832 5.91247 5.79553 5.84821L11.5704 4.71729H11.5576Z"
-          fill={fill}
-        />
-      </g>
-      <defs>
-        <clipPath id="clip0_4867_31686">
-          <rect width="16" height="16" fill="white" transform="translate(0.869629 0.000976562)" />
-        </clipPath>
-      </defs>
-    </svg>
-  );
-};

package/src/Core/IconComponents/ArrowRightIcon.tsx

@@ -1,23 +0,0 @@
-import { SVGProps } from 'react';
-
-interface ArrowRightIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const ArrowRightIcon = ({ fill = 'currentColor', ...props }: ArrowRightIconProps) => {
-  return (
-    <svg viewBox="0 0 16 12" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <g clipPath="url(#clip0_4867_31659)">
-        <path
-          d="M12.4162 5.09031L8.51793 1.18745L9.70437 0.0217918L9.78912 0.000976562L15.8696 6.00618L9.78912 12.001L9.70437 11.9802L8.50734 10.7937L12.448 6.87001H0.869629V5.09031H12.4162Z"
-          fill={fill}
-        />
-      </g>
-      <defs>
-        <clipPath id="clip0_4867_31659">
-          <rect width="15" height="12" fill="white" transform="translate(0.869629 0.000976562)" />
-        </clipPath>
-      </defs>
-    </svg>
-  );
-};

package/src/Core/IconComponents/BallsMenu.tsx

@@ -1,15 +0,0 @@
-import { SVGProps } from 'react';
-
-interface InfoCircleIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const BallsMenu = ({ fill = 'currentColor', ...props }: InfoCircleIconProps) => {
-  return (
-    <svg viewBox="0 0 16 3" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <ellipse cx="1.56746" cy="1.5" rx="1.53633" ry="1.5" fill={fill} />
-      <ellipse cx="7.71278" cy="1.5" rx="1.53633" ry="1.5" fill={fill} />
-      <ellipse cx="13.8581" cy="1.5" rx="1.53633" ry="1.5" fill={fill} />
-    </svg>
-  );
-};

package/src/Core/IconComponents/BugReportIcon.tsx

@@ -1,16 +0,0 @@
-import { SVGProps } from 'react';
-
-interface BugReportIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const BugReportIcon = ({ fill = 'currentColor', ...props }: BugReportIconProps) => {
-  return (
-    <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <path
-        d="M15.3.98c-.06-.1-.19-.28-.32-.4-.33-.34-.76-.52-1.2-.52-.13,0-.26.02-.39.05-.58.14-1.18.73-1.31,1.33-.07.03-1.73.56-3.85,1.23,0,0-4.3,1.35-4.82,1.51-.51.17-1.13.38-1.27.44-.52.25-1.02.76-1.32,1.34-.39.75-.43,1.58-.11,2.34.23.55.76,1.18,1.23,1.47.14.08.58.24.94.36l.66.21v2.01q0,2.29.21,2.7c.21.38.69.76,1.11.86.1.02.2.03.31.03.26,0,.54-.07.78-.2.23-.12.6-.49.72-.72.2-.36.2-.44.2-2.17,0-.74.01-1.23.01-1.45.73.23,4.55,1.43,5.03,1.59.08.02.18.05.21.12.01.08.06.21.11.31.3.62.92,1.02,1.57,1.02.17,0,.34-.03.5-.09.41-.13.84-.52,1.05-.94q.15-.31.15-5.56v-1.43q0-5.08-.2-5.44ZM5.69,12.71c0,1.52,0,1.76-.05,1.84-.07.16-.13.2-.44.2s-.36-.04-.44-.2c-.04-.08-.04-.35-.04-2.02,0-1.08,0-1.62.01-1.81,0,0,.92.29.96.3v1.69ZM12.04,11.79c-1.06-.32-9.07-2.85-9.31-2.94-.47-.17-.87-.62-1.01-1.12-.06-.23-.06-.76,0-.96.11-.43.44-.85.81-1.04.13-.07,1.12-.4,2.66-.88,0,0,6.66-2.11,6.86-2.17.01.45.02,2.11.02,4.55,0,2.69-.02,4.16-.03,4.56ZM14.26,13.05c-.05.11-.14.21-.48.21s-.43-.1-.48-.21c-.05-.12-.05-.5-.05-5.82,0-4.97,0-5.7.04-5.78.03-.06.09-.11.17-.15.08-.05.12-.06.24-.06h.13c.23.01.28.03.32.06.04.03.1.1.12.15.05.08.05.88.05,5.78,0,5.32,0,5.7-.06,5.82Z"
-        fill={fill}
-      />
-    </svg>
-  );
-};

package/src/Core/IconComponents/BusIcon.tsx

@@ -1,24 +0,0 @@
-import { SVGProps } from 'react';
-
-interface BusIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const BusIcon = ({ fill = 'currentColor', ...props }: BusIconProps) => {
-  return (
-    <svg viewBox="0 0 35 17" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <path
-        d="M29.3581 14.8888C29.5904 13.4588 28.947 11.9753 27.6422 11.3139C25.1934 10.0806 22.4765 12.2613 22.9949 14.8888H11.2157C11.2157 14.8888 11.1442 14.8351 11.1442 14.7994C11.6983 11.9038 8.33797 9.81248 5.97857 11.6535C4.94187 12.4579 4.74525 13.441 4.81675 14.6921C4.81675 14.996 4.35202 14.8173 4.17327 14.7279C3.92303 14.6028 3.5298 14.1917 3.47618 13.9236L3.44043 1.73332C3.51193 0.982605 4.13753 0.535748 4.87037 0.5H28.5001C29.9479 0.589371 30.8774 1.37584 31.1813 2.7879C31.4851 4.19997 31.7354 5.95164 31.9141 7.38158C32.1822 9.49074 31.9856 11.6535 32.0392 13.7806C31.9677 14.3525 31.3242 14.9066 30.7344 14.9066H29.376L29.3581 14.8888ZM9.92878 1.89419H5.22785C5.22785 1.89419 4.781 2.26955 4.781 2.34105V7.0241H9.92878V1.89419ZM16.3993 1.89419H11.2515V7.04197H16.3993V1.89419ZM22.8876 1.89419H17.7398V7.04197H22.8876V1.89419ZM30.6987 8.97239C30.502 6.89898 30.0909 4.86132 29.7692 2.80578C29.7692 2.44829 29.09 1.89419 28.804 1.89419H24.2997V7.05985L26.2122 8.97239H30.7165H30.6987Z"
-        fill={fill}
-      />
-      <path
-        d="M7.55085 11.9569C11.1972 11.4386 11.1078 17.0153 7.55085 16.4612C5.11995 16.0859 5.13783 12.2965 7.55085 11.9569Z"
-        fill={fill}
-      />
-      <path
-        d="M25.7119 11.9409C29.3046 11.3868 29.3583 16.9278 25.7655 16.4452C23.2989 16.1056 23.3168 12.3162 25.7119 11.9409Z"
-        fill={fill}
-      />
-    </svg>
-  );
-};

package/src/Core/IconComponents/CalendarIcon.tsx

@@ -1,26 +0,0 @@
-import { SVGProps } from 'react';
-
-interface CalendarIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const CalendarIcon = ({ fill = 'currentColor', ...props }: CalendarIconProps) => {
-  return (
-    <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <g>
-        <path
-          d="M11.87,1.16v-.44c0-.4-.34-.72-.76-.72s-.76.33-.76.72v.37h-4.7v-.37c0-.4-.34-.72-.76-.72s-.76.33-.76.72v.44C1.39,1.51.26,3.04.26,6.29v4.49c0,3.13.92,5.22,5.41,5.22h4.66c4.49,0,5.41-2.08,5.41-5.22v-4.49c0-3.24-1.12-4.76-3.88-5.12ZM14.23,10.78c0,2.78-.59,3.77-3.9,3.77h-4.66c-3.31,0-3.9-.99-3.9-3.77v-4.49c0-2.65.77-3.45,2.36-3.68v.29c0,.41.35.72.76.72s.76-.31.76-.72v-.36h4.7v.36c0,.41.34.72.76.72s.76-.31.76-.72v-.28c1.6.22,2.36,1.01,2.36,3.67v4.49Z"
-          fill={fill}
-        />
-        <path
-          d="M11.09,8.72c0,.41-.34.72-.76.72h-6.21c-.42,0-.76-.31-.76-.72s.34-.71.76-.71h6.21c.42,0,.76.31.76.71Z"
-          fill={fill}
-        />
-        <path
-          d="M8.76,11.63c0,.41-.34.72-.76.72h-3.88c-.42,0-.76-.31-.76-.72s.34-.71.76-.71h3.88c.42,0,.76.31.76.71Z"
-          fill={fill}
-        />
-      </g>
-    </svg>
-  );
-};

package/src/Core/IconComponents/CarIcon.tsx

@@ -1,16 +0,0 @@
-import { SVGProps } from 'react';
-
-interface CarIconProps extends SVGProps<SVGSVGElement> {
-  fill?: string;
-}
-
-export const CarIcon = ({ fill = 'currentColor', ...props }: CarIconProps) => {
-  return (
-    <svg viewBox="0 0 34 17" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
-      <path
-        d="M31.155 8.75382H28.3861C29.1013 10.6804 29.5597 10.5703 31.4484 10.2217C31.6318 11.0657 31.8702 12.6987 31.155 13.3409C30.6783 13.7812 29.6331 13.7262 29.2663 14.0748C29.0829 14.2583 28.9179 14.9372 28.6062 15.3225C27.0659 17.3041 23.8569 16.6619 23.105 14.3133L11.8277 14.2766C11.0942 16.5885 7.84854 17.3041 6.32656 15.3775C6.12485 15.1207 5.77645 14.2032 5.72144 14.1666C5.51973 14.0381 4.10777 14.0381 3.55765 13.7812C2.76916 13.4326 2.45743 12.6987 2.38408 11.8914C2.31073 11.0107 2.23738 7.37771 2.42075 6.66213C2.73248 5.45114 5.22633 4.58878 6.0515 3.85485C6.47326 3.46953 6.93169 2.68056 7.35344 2.2402C9.35219 0.166852 10.6908 0.497121 13.423 0.552165C16.3753 0.625558 19.7677 0.442076 22.0415 2.46038C22.6466 2.99248 23.5085 4.35025 23.9485 4.64382C24.8104 5.19427 27.5793 5.68967 28.7529 6.11168C30.2198 6.66213 30.7883 7.12083 31.155 8.73548V8.75382ZM14.1932 2.47873C13.1846 2.62552 12.1761 2.2402 11.1859 2.33194C9.68226 2.46038 8.74706 4.16677 8.34364 5.46949L14.1932 5.68967V2.47873ZM18.5024 2.62551C17.7506 2.53377 16.8521 2.69891 16.0819 2.62551V5.83646L22.6649 5.98324C21.6564 4.47869 20.4462 2.86404 18.5024 2.62551ZM8.30697 12.0015C6.82166 12.3868 7.20674 14.9005 8.93043 14.6803C10.8192 14.4234 10.269 11.4877 8.30697 12.0015ZM25.6906 12.0015C23.8385 12.4235 24.9754 15.5243 26.7358 14.5152C28.1477 13.7078 27.3593 11.6345 25.6906 12.0015Z"
-        fill={fill}
-      />
-    </svg>
-  );
-};