@ornikar/kitt-universal 1.0.0 → 1.0.1

package/src/Overlay/Overlay.tsx

@@ -1,22 +0,0 @@
-import type { ReactElement } from 'react';
-import React from 'react';
-import type { GestureResponderEvent } from 'react-native';
-import { StyleSheet, View } from 'react-native';
-import styled from 'styled-components/native';
-
-interface OverlayProps {
-  onPress?: (event: GestureResponderEvent) => void;
-}
-
-const OverlayPressable = styled.Pressable(({ theme }) => ({
-  ...StyleSheet.absoluteFillObject,
-  backgroundColor: theme.kitt.colors.overlay.dark,
-}));
-
-export function Overlay({ onPress }: OverlayProps): ReactElement {
-  return (
-    <OverlayPressable onPress={onPress}>
-      <View />
-    </OverlayPressable>
-  );
-}

package/src/Tag/Tag.stories.tsx

@@ -1,18 +0,0 @@
-import { storiesOf } from '@storybook/react-native';
-import { Section, Story } from '@ornikar/kitt-universal';
-import React from 'react';
-import { Tag } from './Tag';
-
-storiesOf('kitt-universal/Data Display', module).add('Tag', () => (
-  <Story title="Tag">
-    <Section title="Default">
-      <Tag label="Examen" />
-    </Section>
-    <Section title="Primary">
-      <Tag type="primary" label="Examen" />
-    </Section>
-    <Section title="Danger">
-      <Tag type="danger" label="Examen" />
-    </Section>
-  </Story>
-));

package/src/Tag/Tag.tsx

@@ -1,31 +0,0 @@
-import type { ReactElement, ReactNode } from 'react';
-import React from 'react';
-import styled from 'styled-components/native';
-import { Typography } from '../typography/Typography';
-
-type TagType = 'primary' | 'default' | 'danger';
-
-export interface TagProps {
-  label: ReactNode;
-  type?: TagType;
-}
-interface ContainerProps {
-  type: TagType;
-}
-
-const Container = styled.View<ContainerProps>`
-  background-color: ${({ theme, type }) => theme.kitt.tag[type].backgroundColor};
-  padding: ${({ theme }) => theme.kitt.tag.padding};
-  border-radius: ${({ theme }) => theme.kitt.tag.borderRadius};
-  align-self: flex-start;
-`;
-
-export function Tag({ label, type = 'default' }: TagProps): ReactElement {
-  return (
-    <Container type={type}>
-      <Typography.Text base="body-xsmall" color={type === 'primary' ? 'primary-light' : undefined}>
-        {label}
-      </Typography.Text>
-    </Container>
-  );
-}

package/src/Tag/__snapshots__/Tag.stories.tsx.snap

@@ -1,303 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`kitt-universal/Data Display Tag 1`] = `
-<RNCSafeAreaProvider
-  onInsetsChange={[Function]}
-  style={
-    Array [
-      Object {
-        "flex": 1,
-      },
-      undefined,
-    ]
-  }
->
-  <RCTScrollView
-    style={
-      Array [
-        Object {
-          "paddingBottom": 10,
-          "paddingLeft": 10,
-          "paddingRight": 10,
-          "paddingTop": 10,
-        },
-      ]
-    }
-  >
-    <View>
-      <View
-        style={
-          Array [
-            Object {
-              "marginBottom": 30,
-            },
-          ]
-        }
-      >
-        <Text
-          aria-level="1"
-          color="black"
-          isHeader={true}
-          style={
-            Array [
-              Object {
-                "color": "#000000",
-                "fontFamily": "Moderat-Extended-Bold",
-                "fontSize": 38,
-                "fontStyle": "normal",
-                "fontWeight": "400",
-                "lineHeight": 49,
-                "textDecorationColor": "#000000",
-              },
-            ]
-          }
-          type="header1"
-          variant="bold"
-        >
-          Tag
-        </Text>
-      </View>
-      <View
-        style={
-          Array [
-            Object {
-              "marginBottom": 30,
-            },
-          ]
-        }
-      >
-        <View
-          style={
-            Array [
-              Object {
-                "marginBottom": 30,
-              },
-            ]
-          }
-        >
-          <Text
-            aria-level="2"
-            color="black"
-            isHeader={true}
-            style={
-              Array [
-                Object {
-                  "color": "#000000",
-                  "fontFamily": "Moderat-Extended-Bold",
-                  "fontSize": 32,
-                  "fontStyle": "normal",
-                  "fontWeight": "400",
-                  "lineHeight": 42,
-                  "textDecorationColor": "#000000",
-                },
-              ]
-            }
-            type="header2"
-            variant="bold"
-          >
-            Default
-          </Text>
-        </View>
-        <View
-          style={
-            Array [
-              Object {
-                "alignSelf": "flex-start",
-                "backgroundColor": "#F2F2F2",
-                "borderRadius": 10,
-                "paddingBottom": 2,
-                "paddingLeft": 12,
-                "paddingRight": 12,
-                "paddingTop": 2,
-              },
-            ]
-          }
-          type="default"
-        >
-          <Text
-            color="black"
-            isHeader={false}
-            style={
-              Array [
-                Object {
-                  "color": "#000000",
-                  "fontFamily": "NotoSans",
-                  "fontSize": 12,
-                  "fontStyle": "normal",
-                  "fontWeight": "400",
-                  "lineHeight": 19,
-                  "textDecorationColor": "#000000",
-                },
-              ]
-            }
-            type="body-xsmall"
-            variant="regular"
-          >
-            Examen
-          </Text>
-        </View>
-      </View>
-      <View
-        style={
-          Array [
-            Object {
-              "marginBottom": 30,
-            },
-          ]
-        }
-      >
-        <View
-          style={
-            Array [
-              Object {
-                "marginBottom": 30,
-              },
-            ]
-          }
-        >
-          <Text
-            aria-level="2"
-            color="black"
-            isHeader={true}
-            style={
-              Array [
-                Object {
-                  "color": "#000000",
-                  "fontFamily": "Moderat-Extended-Bold",
-                  "fontSize": 32,
-                  "fontStyle": "normal",
-                  "fontWeight": "400",
-                  "lineHeight": 42,
-                  "textDecorationColor": "#000000",
-                },
-              ]
-            }
-            type="header2"
-            variant="bold"
-          >
-            Primary
-          </Text>
-        </View>
-        <View
-          style={
-            Array [
-              Object {
-                "alignSelf": "flex-start",
-                "backgroundColor": "#EDEBFC",
-                "borderRadius": 10,
-                "paddingBottom": 2,
-                "paddingLeft": 12,
-                "paddingRight": 12,
-                "paddingTop": 2,
-              },
-            ]
-          }
-          type="primary"
-        >
-          <Text
-            color="primary-light"
-            isHeader={false}
-            style={
-              Array [
-                Object {
-                  "color": "#705DE6",
-                  "fontFamily": "NotoSans",
-                  "fontSize": 12,
-                  "fontStyle": "normal",
-                  "fontWeight": "400",
-                  "lineHeight": 19,
-                  "textDecorationColor": "#705DE6",
-                },
-              ]
-            }
-            type="body-xsmall"
-            variant="regular"
-          >
-            Examen
-          </Text>
-        </View>
-      </View>
-      <View
-        style={
-          Array [
-            Object {
-              "marginBottom": 30,
-            },
-          ]
-        }
-      >
-        <View
-          style={
-            Array [
-              Object {
-                "marginBottom": 30,
-              },
-            ]
-          }
-        >
-          <Text
-            aria-level="2"
-            color="black"
-            isHeader={true}
-            style={
-              Array [
-                Object {
-                  "color": "#000000",
-                  "fontFamily": "Moderat-Extended-Bold",
-                  "fontSize": 32,
-                  "fontStyle": "normal",
-                  "fontWeight": "400",
-                  "lineHeight": 42,
-                  "textDecorationColor": "#000000",
-                },
-              ]
-            }
-            type="header2"
-            variant="bold"
-          >
-            Danger
-          </Text>
-        </View>
-        <View
-          style={
-            Array [
-              Object {
-                "alignSelf": "flex-start",
-                "backgroundColor": "#F4D3CE",
-                "borderRadius": 10,
-                "paddingBottom": 2,
-                "paddingLeft": 12,
-                "paddingRight": 12,
-                "paddingTop": 2,
-              },
-            ]
-          }
-          type="danger"
-        >
-          <Text
-            color="black"
-            isHeader={false}
-            style={
-              Array [
-                Object {
-                  "color": "#000000",
-                  "fontFamily": "NotoSans",
-                  "fontSize": 12,
-                  "fontStyle": "normal",
-                  "fontWeight": "400",
-                  "lineHeight": 19,
-                  "textDecorationColor": "#000000",
-                },
-              ]
-            }
-            type="body-xsmall"
-            variant="regular"
-          >
-            Examen
-          </Text>
-        </View>
-      </View>
-    </View>
-  </RCTScrollView>
-</RNCSafeAreaProvider>
-`;

package/src/Tooltip/Tooltip.tsx

@@ -1,17 +0,0 @@
-import type { ReactElement, ReactNode } from 'react';
-import React from 'react';
-import { View } from 'react-native';
-
-export type TooltipPosition = 'bottom' | 'top' | 'left' | 'right';
-
-export interface TooltipProps {
-  children: NonNullable<ReactNode>;
-  content: NonNullable<ReactNode>;
-  defaultVisible?: boolean;
-  fullWidth?: boolean;
-  position: TooltipPosition;
-}
-
-export function Tooltip({ children }: TooltipProps): ReactElement {
-  return <View>{children}</View>;
-}

package/src/__mocks__/react-native-safe-area-context.tsx

@@ -1,26 +0,0 @@
-import type { ReactElement } from 'react';
-import React from 'react';
-import type { SafeAreaViewProps } from 'react-native-safe-area-context';
-import { SafeAreaProvider as RNSafeAreaProvider } from 'react-native-safe-area-context';
-
-export * from 'react-native-safe-area-context';
-
-export const useSafeAreaInsets = (): { bottom: number; top: number; left: number; right: number } => ({
-  top: 0,
-  bottom: 0,
-  right: 0,
-  left: 0,
-});
-
-export function SafeAreaProvider({ children }: SafeAreaViewProps): ReactElement {
-  return (
-    <RNSafeAreaProvider
-      initialMetrics={{
-        frame: { x: 0, y: 0, width: 0, height: 0 },
-        insets: { top: 0, left: 0, right: 0, bottom: 0 },
-      }}
-    >
-      {children}
-    </RNSafeAreaProvider>
-  );
-}

package/src/forms/InputFeedback/InputFeedback.stories.tsx

@@ -1,17 +0,0 @@
-import { storiesOf } from '@storybook/react-native';
-import { InputFeedback, Section, Story } from '@ornikar/kitt-universal';
-import React from 'react';
-
-storiesOf('kitt-universal/Forms', module).add('Input Feedback', () => (
-  <Story title="Input Feedback">
-    <Section title="Demo">
-      <InputFeedback>Le numéro NEPH est composé de 12 chiffres</InputFeedback>
-    </Section>
-    <Section title="Valid">
-      <InputFeedback state="valid">{'Le numéro NEPH renseigné est valide\u00A0!'}</InputFeedback>
-    </Section>
-    <Section title="Invalid">
-      <InputFeedback state="invalid">{'Le numéro NEPH comporte 12 caractères\u00A0!'}</InputFeedback>
-    </Section>
-  </Story>
-));

package/src/forms/InputFeedback/InputFeedback.tsx

@@ -1,28 +0,0 @@
-import type { ReactElement, ReactNode } from 'react';
-import React from 'react';
-import type { TypographyColor, TypographyProps } from '../../typography/Typography';
-import { Typography } from '../../typography/Typography';
-import type { InputFormState } from '../InputFormState';
-
-export interface InputFeedbackProps {
-  state?: InputFormState;
-  testID?: TypographyProps['testID'];
-  children: NonNullable<ReactNode>;
-}
-
-const getColorFromState = (state?: InputFormState): TypographyColor => {
-  switch (state) {
-    case 'invalid':
-      return 'danger';
-    default:
-      return 'grey';
-  }
-};
-
-export function InputFeedback({ state, testID, children }: InputFeedbackProps): ReactElement {
-  return (
-    <Typography.Text base="body-small" color={getColorFromState(state)} testID={testID}>
-      {children}
-    </Typography.Text>
-  );
-}