@mindly/ui-components 0.1.2 → 0.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindly/ui-components",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "private": false,
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
@@ -30,6 +30,8 @@
   "babel": {
     "presets": [
       [
+        "@babel/preset-react",
+        "@babel/env",
         "react-app",
         {
           "absoluteRuntime": false
@@ -69,6 +71,7 @@
     "@babel/cli": "^7.15.7",
     "@babel/core": "^7.15.5",
     "@babel/preset-env": "^7.15.6",
+    "@babel/preset-react": "^7.14.5",
     "@ionic/lab": "3.2.10",
     "@storybook/addon-actions": "^6.3.7",
     "@storybook/addon-essentials": "^6.3.7",
@@ -85,6 +88,10 @@
   },
   "description": "This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).",
   "main": "dist/index.js",
+  "files": [
+    "dist",
+    "README.md"
+  ],
   "module": "dist/index.js",
   "repository": {
     "type": "git",

package/.eslintrc.json

@@ -1,47 +0,0 @@
-{
-  "env": {
-    "browser": true,
-    "es2021": true
-  },
-  "extends": [
-    "plugin:react/recommended",
-    "plugin:react-hooks/recommended",
-    "plugin:@typescript-eslint/recommended",
-    "google"
-  ],
-  "parser": "@typescript-eslint/parser",
-  "parserOptions": {
-    "ecmaFeatures": {
-      "jsx": true
-    },
-    "ecmaVersion": 12,
-    "sourceType": "module"
-  },
-  "plugins": [
-    "react",
-    "@typescript-eslint"
-  ],
-  "rules": {
-    "indent": "off",
-    "@typescript-eslint/indent": ["error"],
-    "quotes": [
-      "error",
-      "single"
-    ],
-    "no-multi-spaces": "error",
-    "valid-jsdoc": "off",
-    "new-cap": "error",
-    "@typescript-eslint/no-unused-vars": [
-      "error"
-    ],
-    "max-len": [
-      "error",
-      {
-        "code": 120
-      }
-    ],
-    "no-console": "off",
-    "linebreak-style": 0,
-    "no-duplicate-imports": "error"
-  }
-}

package/.idea/codeStyles/Project.xml

@@ -1,45 +0,0 @@
-<component name="ProjectCodeStyleConfiguration">
-  <code_scheme name="Project" version="173">
-    <JSCodeStyleSettings version="0">
-      <option name="FORCE_SEMICOLON_STYLE" value="true" />
-      <option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
-      <option name="USE_DOUBLE_QUOTES" value="false" />
-      <option name="FORCE_QUOTE_STYlE" value="true" />
-      <option name="ENFORCE_TRAILING_COMMA" value="WhenMultiline" />
-    </JSCodeStyleSettings>
-    <TypeScriptCodeStyleSettings version="0">
-      <option name="FORCE_SEMICOLON_STYLE" value="true" />
-      <option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
-      <option name="USE_DOUBLE_QUOTES" value="false" />
-      <option name="FORCE_QUOTE_STYlE" value="true" />
-      <option name="ENFORCE_TRAILING_COMMA" value="WhenMultiline" />
-    </TypeScriptCodeStyleSettings>
-    <codeStyleSettings language="JavaScript">
-      <option name="RIGHT_MARGIN" value="120" />
-      <option name="ALIGN_MULTILINE_PARAMETERS" value="false" />
-      <option name="ALIGN_MULTILINE_FOR" value="false" />
-      <option name="IF_BRACE_FORCE" value="1" />
-      <option name="DOWHILE_BRACE_FORCE" value="1" />
-      <option name="WHILE_BRACE_FORCE" value="1" />
-      <option name="FOR_BRACE_FORCE" value="1" />
-      <indentOptions>
-        <option name="INDENT_SIZE" value="2" />
-        <option name="CONTINUATION_INDENT_SIZE" value="2" />
-      </indentOptions>
-    </codeStyleSettings>
-    <codeStyleSettings language="TypeScript">
-      <option name="RIGHT_MARGIN" value="120" />
-      <option name="ALIGN_MULTILINE_PARAMETERS" value="false" />
-      <option name="ALIGN_MULTILINE_FOR" value="false" />
-      <option name="IF_BRACE_FORCE" value="1" />
-      <option name="DOWHILE_BRACE_FORCE" value="1" />
-      <option name="WHILE_BRACE_FORCE" value="1" />
-      <option name="FOR_BRACE_FORCE" value="1" />
-      <indentOptions>
-        <option name="INDENT_SIZE" value="2" />
-        <option name="CONTINUATION_INDENT_SIZE" value="2" />
-        <option name="SMART_TABS" value="true" />
-      </indentOptions>
-    </codeStyleSettings>
-  </code_scheme>
-</component>

package/.idea/codeStyles/codeStyleConfig.xml

@@ -1,5 +0,0 @@
-<component name="ProjectCodeStyleConfiguration">
-  <state>
-    <option name="USE_PER_PROJECT_SETTINGS" value="true" />
-  </state>
-</component>

package/.idea/inspectionProfiles/Project_Default.xml

@@ -1,6 +0,0 @@
-<component name="InspectionProjectProfileManager">
-  <profile version="1.0">
-    <option name="myName" value="Project Default" />
-    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
-  </profile>
-</component>

package/.idea/jsLinters/eslint.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="EslintConfiguration">
-    <option name="fix-on-save" value="true" />
-  </component>
-</project>

package/.idea/mindly-components.iml

@@ -1,13 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/dist" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

package/.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/mindly-components.iml" filepath="$PROJECT_DIR$/.idea/mindly-components.iml" />
-    </modules>
-  </component>
-</project>

package/.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="$PROJECT_DIR$" vcs="Git" />
-  </component>
-</project>

package/.storybook/main.js

@@ -1,11 +0,0 @@
-module.exports = {
-  "stories": [
-    "../src/**/*.stories.mdx",
-    "../src/**/*.stories.@(js|jsx|ts|tsx)"
-  ],
-  "addons": [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/preset-create-react-app"
-  ]
-}

package/.storybook/preview.js

@@ -1,9 +0,0 @@
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-  controls: {
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/,
-    },
-  },
-}

package/babel.config.json

@@ -1,18 +0,0 @@
-{
-  "presets": [
-    [
-      "@babel/env",
-      {
-        "targets": {
-          "edge": "46",
-          "firefox": "78",
-          "chrome": "93",
-          "safari": "14.1"
-        },
-        "useBuiltIns": "usage",
-        "corejs": "3.6.5"
-      }
-    ],
-    "@babel/preset-react"
-  ]
-}

package/ionic.config.json

@@ -1,5 +0,0 @@
-{
-  "name": "mindly-component",
-  "integrations": {},
-  "type": "react"
-}

package/public/index.html

@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <title>React App</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
-</html>

package/public/manifest.json

@@ -1,25 +0,0 @@
-{
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}

package/public/robots.txt

@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow:

package/src/lib/Theme/global.css

@@ -1,191 +0,0 @@
-@font-face {
-    font-family: 'Lato Regular';
-    src: url('../../fonts/Lato-Regular.ttf');
-    font-weight: normal;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: 'Lato SemiBold';
-    src: url('../../fonts/Lato-Semibold.ttf');
-    font-weight: 600;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: 'Lato Bold';
-    src: url('../../fonts/Lato-Bold.ttf');
-    font-weight: bold;
-    font-style: normal;
-}
-
-* {
-    box-sizing: border-box;
-}
-
-body{
-    margin: 0;
-    padding: 0;
-}
-
-span, p {
-    font-family: "Lato Regular", sans-serif;
-    font-size: 10px;
-    line-height: 14px;
-    margin: 0;
-    font-weight: 400;
-    padding: 0;
-}
-
-h5 {
-    font-family: "Lato Regular", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 14px;
-    font-weight: 400;
-    line-height: 16px;
-}
-
-h4 {
-    font-family: "Lato Regular", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 16px;
-    font-weight: 400;
-    line-height: 24px;
-}
-
-h3 {
-    font-family: "Lato Regular", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 18px;
-    font-weight: 400;
-    line-height: 24px;
-}
-
-h2 {
-    font-family: "Lato Regular", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 20px;
-    font-weight: 400;
-    line-height: 24px;
-}
-
-h1 {
-    font-family: "Lato Regular", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-weight: 400;
-    font-size: 24px;
-    line-height: 32px;
-}
-
-span.semiBold, p.semiBold {
-    font-family: "Lato SemiBold", sans-serif;
-    font-size: 10px;
-    line-height: 14px;
-    margin: 0;
-    padding: 0;
-    font-weight: 600;
-}
-
-h5.semiBold {
-    font-family: "Lato SemiBold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 14px;
-    line-height: 16px;
-    font-weight: 600;
-}
-
-h4.semiBold {
-    font-family: "Lato SemiBold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 16px;
-    line-height: 24px;
-    font-weight: 600;
-}
-
-h3.semiBold {
-    font-family: "Lato SemiBold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 18px;
-    line-height: 24px;
-    font-weight: 600;
-}
-
-h2.semiBold {
-    font-family: "Lato SemiBold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 20px;
-    line-height: 24px;
-    font-weight: 600;
-}
-
-h1.semiBold {
-    font-family: "Lato SemiBold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 24px;
-    line-height: 32px;
-    font-weight: 600;
-}
-
-span.bold, p.bold {
-    font-family: "Lato Bold", sans-serif;
-    font-size: 10px;
-    line-height: 14px;
-    margin: 0;
-    padding: 0;
-    font-weight: 700;
-}
-
-h5.bold {
-    font-family: "Lato Bold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 14px;
-    line-height: 16px;
-    font-weight: 700;
-}
-
-h4.bold {
-    font-family: "Lato Bold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 16px;
-    line-height: 24px;
-    font-weight: 700;
-}
-
-h3.bold {
-    font-family: "Lato Bold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 18px;
-    line-height: 24px;
-    font-weight: 700;
-}
-
-h2.bold {
-    font-family: "Lato Bold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 20px;
-    line-height: 24px;
-    font-weight: 700;
-}
-
-h1.bold {
-    font-family: "Lato Bold", sans-serif;
-    margin: 0;
-    padding: 0;
-    font-size: 24px;
-    line-height: 32px;
-    font-weight: 700;
-}

package/src/lib/Theme/mindly_constants.ts

@@ -1,20 +0,0 @@
-export const colorConstants = {
-    primaryColor: '#21ABD2',
-    secondaryColor: '#F0FBFF',
-    primaryTextColor: '#5B5B5B',
-    secondaryTextColor: '#1D201F',
-    AccentStrokeColor: '#EDEFF2',
-    AccentDisabledColor: '#C1C1C1',
-    AccentCrossColor: '#A31621',
-    AccentTickColor: '#478862',
-    AccentInputBgColor: '#F5F9FF',
-    AccentTabsBgColor: '#D6F2F9',
-    AccentCross: '#f1646f',
-    White: '#FFFFFF',
-    AccentAchieveBgNew: '#E7E7E7',
-    StrokeGray: '#F2F4F7',
-    AccentSurveyButton: '#E9F7FB',
-    AccentCancelActive: '#F5939A',
-    AccentActiveButtonBG: '#90D5E8',
-    AccentDivider: '#E5E5E5',
-};

package/src/lib/button/Button.style.ts

@@ -1,83 +0,0 @@
-import styled, {css} from 'styled-components';
-import {colorConstants} from '../Theme/mindly_constants';
-
-interface ContainerProps{
-    buttonType: 'primary' | 'secondary' | 'survey' | 'secondaryWithStroke' | 'secondaryCancel',
-    isDisabled: boolean
-}
-
-export const Container = styled.button<ContainerProps>`
-  padding: 8px 0;
-  width: 100%;
-  border-radius: 4px;
-  border: 0;
-  background: ${colorConstants.primaryColor};
-  color: ${colorConstants.White};
-
-  &:hover, &:active {
-    box-shadow: inset 0 4px 15px rgba(0, 0, 0, 0.2), inset 0 -4px 15px rgba(0, 0, 0, 0.2);
-  }
-
-  ${(props: ContainerProps) => props.buttonType === 'secondary' && css`
-    background: inherit;
-    color: ${colorConstants.primaryColor};
-
-    &:hover, &:active {
-      box-shadow: none;
-      color: ${colorConstants.AccentActiveButtonBG};
-    }
-  `}
-
-  ${(props: ContainerProps) => props.buttonType === 'secondaryWithStroke' && css`
-    color: ${colorConstants.primaryColor};
-    background: inherit;
-    box-shadow: none;
-    border: 1px solid ${colorConstants.primaryColor};
-
-    &:hover, &:active {
-      box-shadow: none;
-      color: ${colorConstants.AccentActiveButtonBG};
-      background: inherit;
-      border: 1px solid ${colorConstants.AccentActiveButtonBG};
-    }
-  `}
-
-  ${(props: ContainerProps) => props.buttonType === 'secondaryCancel' && css`
-    color: ${colorConstants.AccentCross};
-    background: inherit;
-    box-shadow: none;
-    border: 0;
-
-    &:hover, &:active {
-      box-shadow: none;
-      color: ${colorConstants.AccentCancelActive};
-      background: inherit;
-      border: 0;
-    }
-  `}
-
-  ${(props: ContainerProps) => props.buttonType === 'survey' && css`
-    color: ${colorConstants.primaryTextColor};
-    background: inherit;
-    box-shadow: none;
-    border: 1px solid ${colorConstants.primaryTextColor};
-
-    &:hover, &:active {
-      box-shadow: none;
-      color: ${colorConstants.primaryColor};
-      background: ${colorConstants.AccentSurveyButton};
-      border: 1px solid ${colorConstants.AccentDisabledColor};
-    }
-  `}
-
-  ${(props: ContainerProps) => props.isDisabled && css`
-    background: ${colorConstants.AccentActiveButtonBG};
-    color: ${colorConstants.White};
-    box-shadow: none;
-
-
-    &:hover, &:active {
-      box-shadow: none;
-    }
-  `}
-`;

package/src/lib/button/Button.tsx

@@ -1,29 +0,0 @@
-import React from 'react';
-import {Container} from './Button.style';
-import '../Theme/global.css';
-
-
-interface ButtonProps {
-    buttonType: 'primary' | 'secondary' | 'survey' | 'secondaryWithStroke' | 'secondaryCancel',
-    isDisabled: boolean,
-    children: React.ReactNode,
-    onClick: (atr: any) => void
-}
-
-
-const Button: React.FC<ButtonProps> = (props) => {
-    return (
-        <Container
-            onClick={props.onClick}
-            disabled={props.isDisabled}
-            isDisabled={props.isDisabled}
-            buttonType={props.buttonType}
-        >
-            <h4>
-                {props.children}
-            </h4>
-        </Container>
-    );
-};
-
-export default Button;

package/src/lib/consultation-card/consultationCard.tsx

@@ -1,18 +0,0 @@
-import React from 'react';
-import Button from '../button/Button';
-import {timeOutline, cardOutline} from 'ionicons/icons';
-
-interface ConsultationCardProps {
-    eventHandler: () => void,
-    time: string,
-    price: string,
-}
-
-const ConsultationCard: React.FC<ConsultationCardProps> = (props)=> {
-    return (
-        <Container>
-        </Container>
-    );
-};
-
-export default ConsultationCard;

package/src/lib/floating-button/floating button.svg

@@ -1,6 +0,0 @@
-<svg width="54" height="54" viewBox="0 0 54 54" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="54" height="54" fill="#21ABD2"/>
-<path d="M27.0002 15C21.9405 15 17.8237 19.1168 17.8237 24.1765V32.647C17.8237 33.8148 18.7737 34.7648 19.9413 34.7648C21.1092 34.7648 22.0591 33.8148 22.0591 32.647V25.5883C22.0591 24.4206 21.1092 23.4706 19.9413 23.4706C19.7037 23.4706 19.4788 23.5188 19.2651 23.5913C19.5663 19.5829 22.9168 16.4117 27.0002 16.4117C31.0815 16.4117 34.431 19.58 34.735 23.5856C34.5226 23.5129 34.2964 23.4706 34.0591 23.4706C32.8913 23.4706 31.9413 24.4206 31.9413 25.5883V32.647C31.9413 33.8148 32.8913 34.7648 34.0591 34.7648C34.3078 34.7648 34.5431 34.7139 34.765 34.6348V35.4706C34.765 35.8601 34.4479 36.1765 34.0591 36.1765H28.9879C28.6954 35.3566 27.9192 34.7648 27.0002 34.7648C25.8326 34.7648 24.8826 35.7147 24.8826 36.8824C24.8826 38.05 25.8326 39 27.0002 39C27.9192 39 28.6954 38.408 28.9879 37.5883H34.0591C35.2268 37.5883 36.1768 36.6383 36.1768 35.4706C36.1768 31.2248 36.1768 28.4269 36.1768 24.1765C36.1768 19.1168 32.06 15 27.0002 15V15Z" fill="white"/>
-<path d="M37.5884 25.0122V33.2227C38.4081 32.9304 39.0001 32.1542 39.0001 31.235V26.9998C39.0001 26.0808 38.4081 25.3046 37.5884 25.0122Z" fill="white"/>
-<path d="M15 26.9998V31.235C15 32.1542 15.592 32.9304 16.4117 33.2227V25.0122C15.592 25.3046 15 26.0808 15 26.9998Z" fill="white"/>
-</svg>