@tactics/toddle-styleguide 1.2.1 → 1.2.3

package/src/components/molecules/timeline/timeline.styles.d.ts

@@ -1,43 +1,61 @@
 export function Stylesheet(
   context: any,
   startingPosition: any,
-  width: any,
-  checkOut: any
-): {
-  container: {
-    width: string;
-  };
-  lineContainer: {
-    height: number;
-    borderRadius: number;
-    backgroundColor: any;
-  };
-  checkInLine: {
-    height: number;
-    borderRadius: number;
-    left: string;
-  };
-  checkInWidth: {
-    width: string;
-  };
-  checkOutWidth: {
-    width: string;
-  };
-  checkInOutTextContainer: {
-    marginTop: number;
-    marginLeft: string;
-    fontFamily: string;
-    fontSize: number;
-    lineHeight: number;
-    width: string;
-    flexDirection: 'row';
-    justifyContent: 'space-between';
-    height: number;
-  };
-  checkInTime: {
-    right: number;
-  };
-  checkOutTime: {
-    left: number;
-  };
-};
+  width: any
+):
+  | StyleSheet.NamedStyles<any>
+  | StyleSheet.NamedStyles<{
+      container: {
+        width: string;
+        marginTop: number;
+        marginBottom: number;
+      };
+      lineContainer: {
+        height: number;
+        borderRadius: number;
+        backgroundColor: any;
+        overflow: 'hidden';
+      };
+      checkInLine: {
+        height: number;
+        width: string;
+        borderRadius: number;
+        left: string;
+      };
+      checkInOutTextContainer: (
+        | {
+            width: string;
+            flexDirection: string;
+            height: number;
+            marginTop: number;
+            marginLeft?: undefined;
+            justifyContent?: undefined;
+            alignSelf?: undefined;
+          }
+        | {
+            marginLeft: string;
+            justifyContent: string;
+            width?: undefined;
+            flexDirection?: undefined;
+            height?: undefined;
+            marginTop?: undefined;
+            alignSelf?: undefined;
+          }
+        | {
+            alignSelf: string;
+            justifyContent: string;
+            width: string;
+            flexDirection?: undefined;
+            height?: undefined;
+            marginTop?: undefined;
+            marginLeft?: undefined;
+          }
+      )[];
+      checkInTime: {
+        right: number;
+      };
+      checkOutTime: {
+        left: number;
+      };
+    }>;
+import {StyleSheet} from 'react-native/Libraries/StyleSheet/StyleSheet';

package/src/components/molecules/timeline/timeline.styles.js

@@ -1,39 +1,46 @@
 import {StyleSheet} from 'react-native';
 import {Scale} from '../../../theme/scale';
 
-export const Stylesheet = (context, startingPosition, width, checkOut) =>
+export const Stylesheet = (context, startingPosition, width) =>
   StyleSheet.create({
     container: {
       width: '100%',
+      marginTop: Scale.xs,
+      marginBottom: Scale.xs,
     },
     lineContainer: {
       height: Scale.xs,
       borderRadius: 50,
       backgroundColor: context.colors.ui.lightgrey,
+      overflow: 'hidden',
     },
     checkInLine: {
       height: Scale.xs,
+      width: width.toString() + '%',
       borderRadius: 50,
       left: startingPosition.toString() + '%',
     },
-    checkInWidth: {
-      width: '35%',
-    },
-    checkOutWidth: {
-      width: width.toString() + '%',
-    },
-    checkInOutTextContainer: {
-      width: checkOut ? width.toString() + '%' : '35%',
-      flexDirection: 'row',
-      justifyContent: 'space-between',
-      height: Scale.l,
-      marginTop: Scale.xs,
-      marginLeft: startingPosition.toString() + '%',
-    },
+    checkInOutTextContainer: [
+      {
+        width: width.toString() + '%',
+        flexDirection: 'row',
+        height: Scale.l,
+        marginTop: Scale.xs,
+      },
+      startingPosition < 80 && {
+        marginLeft: startingPosition.toString() + '%',
+        justifyContent: 'space-between',
+      },
+      startingPosition >= 80 && {
+        alignSelf: 'flex-end',
+        justifyContent: 'space-between',
+        width: 'auto',
+      },
+    ],
     checkInTime: {
-      right: 20,
+      right: Scale.m,
     },
     checkOutTime: {
-      left: checkOut ? 20 : 12,
+      left: width === 25 ? Scale.s : Scale.m,
     },
   });

package/src/components/molecules/timeline/timeline.test.js

@@ -1,16 +1,16 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import {Timeline} from './timeline.component';
+import {TimeLine} from './timeline.component';
 
 describe('Timeline visual test', () => {
   it('renders a check-in time with no known check-out time', () => {
-    const tree = renderer.create(<Timeline checkIn={'07:30'} />).toJSON();
+    const tree = renderer.create(<TimeLine checkIn={'07:30'} />).toJSON();
 
     expect(tree).toMatchSnapshot();
   });
   it('renders a check-in time and check-out time', () => {
     const tree = renderer
-      .create(<Timeline checkIn={'07:30'} checkOut={'12:30'} />)
+      .create(<TimeLine checkIn={'07:30'} checkOut={'12:30'} />)
       .toJSON();
 
     expect(tree).toMatchSnapshot();

package/src/components/molecules/timestamp/timestamp.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ToddleDateTime } from '../../../utilities/toddle-datetime/toddle-datetime.class';
 type TimestampProps = {
     sent: ToddleDateTime;

package/src/components/molecules/wave-background/wave.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { WaveProps } from '../../atoms/static-wave/static-wave.component';
 export declare const WaveBackground: ({ customWavePath, customStyle, heightSvgContainer, positionTop, }: WaveProps) => JSX.Element;

package/src/components/molecules/wave-background/wave.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const WaveBackgroundPreview: ({}: {}) => JSX.Element;

package/src/components/molecules/wide-button/wide-button.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type ButtonProps = {
     text: string;
     disabled?: boolean;

package/src/components/molecules/wide-button/wide-button.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const WideButtonPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/child-list-item/child-list-item.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const ChildListItemPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/contact-item/contact-item.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type ContactItemProps = {
     name: string;
     label: string;

package/src/components/organisms/contact-item/contact-item.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const ContactItemPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/day-select/day-select.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ToddleDateTime } from '../../../utilities/toddle-datetime/toddle-datetime.class';
 type DaySelectProps = {
     onSelectDate: (date: ToddleDateTime) => void;

package/src/components/organisms/day-select/day-select.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const DaySelectPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/loading-indicator/container.component.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const LoadingDotsContainer: () => JSX.Element;

package/src/components/organisms/loading-indicator/dot.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Animated } from 'react-native';
 type DotProps = {
     dynamicSize: Animated.Value;

package/src/components/organisms/loading-indicator/loading-indicator.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { LoadingDotsProps } from '../../../types/loading-dots.type';
 export declare const LoadingIndicator: ({ animation, dots, color, size, spacing, delay, }: LoadingDotsProps) => JSX.Element;

package/src/components/organisms/loading-indicator/loading-indicator.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const LoadingIndicatorPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/my-child-list-item/my-child-list-item.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ImageSourcePropType } from 'react-native';
 import { Initials } from '../../../models/initials.model';
 type MyChildListItemProps = {

package/src/components/organisms/my-child-list-item/my-child-list-item.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const MyChildListItemPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/person-info-card/person-info-card.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ImageSourcePropType, ViewStyle } from 'react-native';
 import { Initials } from '../../../models/initials.model';
 interface IContactInfoCard {

package/src/components/organisms/person-info-card/person-info-card.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const PersonInfoCardPreview: ({}: {}) => JSX.Element;

package/src/components/organisms/text-bubble/text-bubble.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { VisualState } from '../../../types/visual-state.enum';
 import { BubbleAlignment } from '../../../types/bubble-alignment.enum';
 import { ToddleDateTime } from '../../../utilities/toddle-datetime/toddle-datetime.class';

package/src/components/organisms/text-bubble/text-bubble.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const TextBubblePreview: ({}: {}) => JSX.Element;

package/src/components/templates/modal/components/fade-panel.component.d.ts

@@ -6,6 +6,7 @@ type FadePanelProps = {
     onClose: () => void;
     maxHeight: number;
     children: React.ReactNode;
+    scrollable: boolean | undefined;
 };
-export declare const FadePanel: ({ title, subtitle, isVisible, onClose, maxHeight, children, }: FadePanelProps) => JSX.Element;
+export declare const FadePanel: ({ title, subtitle, isVisible, onClose, maxHeight, children, scrollable, }: FadePanelProps) => JSX.Element;
 export {};

package/src/components/templates/modal/components/fade-panel.component.tsx

@@ -1,5 +1,5 @@
 import React, {useContext, useEffect, useRef} from 'react';
-import {Animated, ScrollView} from 'react-native';
+import {Animated, ScrollView, View} from 'react-native';
 import {ThemeCtx} from '../../../../context/theme.context';
 import {Stylesheet} from './fade-panel.styles';
 import {Heading} from '../../popover/components/modal/heading/heading.component';
@@ -12,6 +12,7 @@ type FadePanelProps = {
   onClose: () => void;
   maxHeight: number;
   children: React.ReactNode;
+  scrollable: boolean | undefined;
 };
 
 export const FadePanel = ({
@@ -21,6 +22,7 @@ export const FadePanel = ({
   onClose,
   maxHeight,
   children,
+  scrollable = true,
 }: FadePanelProps) => {
   const fadeAnimation = useRef(new Animated.Value(0)).current;
 
@@ -47,7 +49,11 @@ export const FadePanel = ({
     <Animated.View style={styles.rootContainer}>
       <Close onPress={onClose} />
       <Heading title={title} subtitle={subtitle} />
-      <ScrollView>{children}</ScrollView>
+      {scrollable ? (
+        <ScrollView>{children}</ScrollView>
+      ) : (
+        <View>{children}</View>
+      )}
     </Animated.View>
   );
 };

package/src/components/templates/modal/modal.component.d.ts

@@ -5,6 +5,7 @@ type ModalProps = {
     isVisible: boolean;
     onClose: () => void;
     children?: React.ReactNode;
+    scrollable?: boolean;
 };
-export declare const Modal: ({ title, subtitle, isVisible, onClose, children, }: ModalProps) => JSX.Element;
+export declare const Modal: ({ title, subtitle, isVisible, onClose, children, scrollable, }: ModalProps) => JSX.Element;
 export {};

package/src/components/templates/modal/modal.component.tsx

@@ -11,6 +11,7 @@ type ModalProps = {
   isVisible: boolean;
   onClose: () => void;
   children?: React.ReactNode;
+  scrollable?: boolean;
 };
 
 const window = Dimensions.get('window');
@@ -21,21 +22,20 @@ export const Modal = ({
   isVisible,
   onClose,
   children,
+  scrollable,
 }: ModalProps) => {
   const [windowHeight, setWindowHeight] = useState(window.height);
-  const [windowWidth, setWindowWidth] = useState(window.width);
 
   useEffect(() => {
     const subscription = Dimensions.addEventListener('change', ({window}) => {
       setWindowHeight(window.height);
-      setWindowWidth(window.width);
     });
     return () => subscription?.remove();
   });
 
   const maxHeight = Math.round(windowHeight / 100) * 80;
 
-  const styles = Stylesheet(windowWidth, windowHeight);
+  const styles = Stylesheet();
 
   return (
     <View style={styles.element} pointerEvents={isVisible ? 'auto' : 'none'}>
@@ -47,6 +47,7 @@ export const Modal = ({
           onClose={onClose}
           title={title}
           subtitle={subtitle}
+          scrollable={scrollable}
         >
           {children}
         </FadePanel>

package/src/components/templates/modal/modal.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const ModalPreview: ({}: {}) => JSX.Element;

package/src/components/templates/modal/modal.styles.d.ts

@@ -1,10 +1,7 @@
-export function Stylesheet(
-  windowWidth: any,
-  windowHeight: any
-): {
+export function Stylesheet(): {
   element: {
-    width: any;
-    height: any;
+    width: string;
+    height: string;
     position: 'absolute';
     left: number;
     top: number;

package/src/components/templates/modal/modal.styles.js

@@ -2,11 +2,11 @@ import React from 'react';
 import {StyleSheet} from 'react-native';
 import {Scale} from '../../../theme/scale/index';
 
-export const Stylesheet = (windowWidth, windowHeight) =>
+export const Stylesheet = () =>
   StyleSheet.create({
     element: {
-      width: windowWidth,
-      height: windowHeight,
+      width: '100%',
+      height: '100%',
       position: 'absolute',
       left: 0,
       top: 0,

package/src/components/templates/popover/components/modal/close/close.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { GestureResponderEvent } from 'react-native';
 type ModalCloseProps = {
     onPress: (event: GestureResponderEvent) => void;

package/src/components/templates/popover/components/modal/heading/heading.component.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type ModalHeadingProps = {
     title: string;
     subtitle?: string;

package/src/components/templates/popover/components/modal/modal.component.tsx

@@ -68,8 +68,6 @@ const Modal = ({
 
   const transform = [{translateY: translateY}];
 
-  console.log(maxHeight);
-
   return (
     <Animated.View
       style={[styles.element, {maxHeight: maxHeight}, {transform: transform}]}

package/src/components/templates/popover/popover.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const PopoverPreview: ({}: {}) => JSX.Element;

package/src/gradients/main/main.gradient.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type MainGradientProps = {
     isActive?: boolean;
 };

package/src/icons/index.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconInterface } from '../interfaces/icon.interface';
 export declare const Icon: ({ style, name, size, color }: IconInterface) => JSX.Element;

package/src/icons/outline/calendar/calendar.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const CalendarIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/chat/chat.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ChatIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/chat-alt/chat-alt.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ChatAltIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/check-circle/check-circle.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const CheckCircleIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/chevron-left/chevron-left.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ChevronLeftIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/chevron-right/chevron-right.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ChevronRightIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/clock/clock.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ClockIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/cloud-download/cloud-download.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const CloudDownloadIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/currency-euro/currency-euro.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const CurrencyEuroIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/document-text/document-text.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const DocumentTextIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/exclamation/exclamation.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ExclamationIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/exclamation-circle/exclamation-circle.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const ExclamationCircleIcon: ({ color, size, }: IconSVGProps) => JSX.Element;

package/src/icons/outline/eye/eye.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const EyeIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/eye-off/eye-off.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const EyeOffIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/filter/filter.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const FilterIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/information-circle/information-circle.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const InformationCircleIcon: ({ color, size, }: IconSVGProps) => JSX.Element;

package/src/icons/outline/logout/logout.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const LogoutIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/mail/mail.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const MailIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/mail-open/mail-open.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const MailOpenIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/menu/menu.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const MenuIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/minus-sm/minus-sm.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const MinusSmallIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/office-building/office-building.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const OfficeBuildingIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/outline-default.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const IconOutlineDefaultPreview: ({}: {}) => JSX.Element;

package/src/icons/outline/outline-grey.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const IconOutlineGreyPreview: ({}: {}) => JSX.Element;

package/src/icons/outline/outline-white.preview.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const IconOutlineWhitePreview: ({}: {}) => JSX.Element;

package/src/icons/outline/outline.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconNameInterface } from '../../interfaces/icon.interface';
 export declare const Outline: ({ name, size, color, }: IconNameInterface) => JSX.Element;

package/src/icons/outline/paper-airplane/paper-airplane.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const PaperAirplaneIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/paperclip/paperclip.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const PaperClipIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/pencil/pencil.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const PencilIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/phone/phone.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const PhoneIcon: ({ color, size }: IconSVGProps) => JSX.Element;

package/src/icons/outline/plus/plus.icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { IconSVGProps } from '../../../interfaces/icon.interface';
 export declare const PlusIcon: ({ color, size }: IconSVGProps) => JSX.Element;