@mindly/ui-components 3.1.6 → 3.1.7

package/dist/lib/Theme/global.css

@@ -1,251 +0,0 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
-
-* {
-  box-sizing: border-box;
-}
-
-body {
-  margin: 0;
-  padding: 0;
-}
-
-span,
-p {
-  font-family: 'Inter', sans-serif;
-  font-size: 10px;
-  line-height: 14px;
-  margin: 0;
-  font-weight: 400;
-  padding: 0;
-}
-
-h5 {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 16px;
-}
-
-h4 {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 24px;
-}
-
-h3 {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 18px;
-  font-weight: 400;
-  line-height: 24px;
-}
-
-h2 {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 20px;
-  font-weight: 400;
-  line-height: 24px;
-}
-
-h1 {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-weight: 400;
-  font-size: 24px;
-  line-height: 32px;
-}
-
-span.semiBold,
-p.semiBold {
-  font-family: 'Inter', sans-serif;
-  font-size: 10px;
-  line-height: 14px;
-  margin: 0;
-  padding: 0;
-  font-weight: 600;
-}
-
-h5.semiBold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 14px;
-  line-height: 16px;
-  font-weight: 600;
-}
-
-h4.semiBold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 16px;
-  line-height: 24px;
-  font-weight: 600;
-}
-
-h3.semiBold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 18px;
-  line-height: 24px;
-  font-weight: 600;
-}
-
-h2.semiBold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 20px;
-  line-height: 24px;
-  font-weight: 600;
-}
-
-h1.semiBold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 24px;
-  line-height: 32px;
-  font-weight: 600;
-}
-
-span.bold,
-p.bold {
-  font-family: 'Inter', sans-serif;
-  font-size: 10px;
-  line-height: 14px;
-  margin: 0;
-  padding: 0;
-  font-weight: 700;
-}
-
-h5.bold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 14px;
-  line-height: 16px;
-  font-weight: 700;
-}
-
-h4.bold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 16px;
-  line-height: 24px;
-  font-weight: 700;
-}
-
-h3.bold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 18px;
-  line-height: 24px;
-  font-weight: 700;
-}
-
-h2.bold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 20px;
-  line-height: 24px;
-  font-weight: 700;
-}
-
-h1.bold {
-  font-family: 'Inter', sans-serif;
-  margin: 0;
-  padding: 0;
-  font-size: 24px;
-  line-height: 32px;
-  font-weight: 700;
-}
-
-:root {
-  /** primary **/
-  --ion-color-primary: #21abd2;
-  --ion-color-primary-rgb: 33, 171, 210;
-  --ion-color-primary-contrast: #000000;
-  --ion-color-primary-contrast-rgb: 0, 0, 0;
-  --ion-color-primary-shade: #1d96b9;
-  --ion-color-primary-tint: #37b3d7;
-
-  /** secondary **/
-  --ion-color-secondary: #1d201f;
-  --ion-color-secondary-rgb: 29, 32, 31;
-  --ion-color-secondary-contrast: #ffffff;
-  --ion-color-secondary-contrast-rgb: 255, 255, 255;
-  --ion-color-secondary-shade: #1a1c1b;
-  --ion-color-secondary-tint: #343635;
-
-  /** tertiary **/
-  --ion-color-tertiary: #d6f2f9;
-  --ion-color-tertiary-rgb: 214, 242, 249;
-  --ion-color-tertiary-contrast: #000000;
-  --ion-color-tertiary-contrast-rgb: 0, 0, 0;
-  --ion-color-tertiary-shade: #bcd5db;
-  --ion-color-tertiary-tint: #daf3fa;
-
-  /** success **/
-  --ion-color-success: #478862;
-  --ion-color-success-rgb: 71, 136, 98;
-  --ion-color-success-contrast: #ffffff;
-  --ion-color-success-contrast-rgb: 255, 255, 255;
-  --ion-color-success-shade: #3e7856;
-  --ion-color-success-tint: #599472;
-
-  /** warning **/
-  --ion-color-warning: #ffc409;
-  --ion-color-warning-rgb: 255, 196, 9;
-  --ion-color-warning-contrast: #000000;
-  --ion-color-warning-contrast-rgb: 0, 0, 0;
-  --ion-color-warning-shade: #e0ac08;
-  --ion-color-warning-tint: #ffca22;
-
-  /** danger **/
-  --ion-color-danger: #f1646f;
-  --ion-color-danger-rgb: 241, 100, 111;
-  --ion-color-danger-contrast: #000000;
-  --ion-color-danger-contrast-rgb: 0, 0, 0;
-  --ion-color-danger-shade: #d45862;
-  --ion-color-danger-tint: #f2747d;
-
-  /** dark **/
-  --ion-color-dark: #222428;
-  --ion-color-dark-rgb: 34, 36, 40;
-  --ion-color-dark-contrast: #ffffff;
-  --ion-color-dark-contrast-rgb: 255, 255, 255;
-  --ion-color-dark-shade: #1e2023;
-  --ion-color-dark-tint: #383a3e;
-
-  /** medium **/
-  --ion-color-medium: #5b5b5b;
-  --ion-color-medium-rgb: 91, 91, 91;
-  --ion-color-medium-contrast: #ffffff;
-  --ion-color-medium-contrast-rgb: 255, 255, 255;
-  --ion-color-medium-shade: #505050;
-  --ion-color-medium-tint: #6b6b6b;
-
-  /** light **/
-  --ion-color-light: #ffffff;
-  --ion-color-light-rgb: 255, 255, 255;
-  --ion-color-light-contrast: #000000;
-  --ion-color-light-contrast-rgb: 0, 0, 0;
-  --ion-color-light-shade: #e0e0e0;
-  --ion-color-light-tint: #ffffff;
-
-  --ion-font-family: 'Inter', sans-serif;
-}

package/dist/lib/Theme/mindly_constants.ts

@@ -1,23 +0,0 @@
-export const colorConstants = {
-  primaryColor: '#21ABD2',
-  secondaryColor: '#F0FBFF',
-  primaryTextColor: '#1D201F',
-  secondaryTextColor: '#5B5B5B',
-  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',
-  AccentGrayBlue: '#E8ECF2',
-};
-
-export const maxContainerWidth = '410px';

package/dist/lib/UsersPsychologistScrollList/UserPsychologistScrollList.styled.ts

@@ -1,61 +0,0 @@
-import styled from 'styled-components';
-
-export const StyledScrollListSectionWrapper = styled.div`
-  @media (min-width: 1024px) {
-    grid-column: 1 / 3;
-  }
-
-  @media (max-width: 1024px) and (min-width: 600px) {
-    max-width: 452px;
-  }
-`;
-
-export const StyledSectionTitle = styled.div`
-  font-weight: 700;
-  font-size: 24px;
-  line-height: 32px;
-`;
-
-export const StyledScrollListWrapper = styled.div`
-  display: flex;
-  overflow-x: auto;
-  scrollbar-width: none;
-  &::-webkit-scrollbar {
-    display: none;
-  }
-`;
-
-export const StyledScrollListPsychologist = styled.div`
-  min-width: max-content;
-  margin-right: 12px;
-  cursor: pointer;
-`;
-
-export const StyledScrollListPsychologistAvatar = styled.section`
-  border: 1px solid #f2f4f7;
-  border-radius: 999px;
-  height: 72px;
-  width: 72px;
-  padding: 5px;
-  overflow: hidden !important;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  .img {
-    border-radius: 99px;
-    max-width: max-content;
-    min-width: 62px;
-    width: 62px;
-    height: 62px;
-    user-select: none;
-  }
-`;
-
-export const StyledScrollListPsychologistName = styled.div`
-  color: #1d201f;
-  font-style: normal;
-  font-weight: 600;
-  font-size: 12px;
-  line-height: 16px;
-  text-align: center;
-`;

package/dist/lib/UsersPsychologistScrollList/UsersPsychologistScrollList.tsx

@@ -1,68 +0,0 @@
-import React, { useState } from 'react';
-import { IonSkeletonText } from '@ionic/react';
-import {
-  StyledScrollListSectionWrapper,
-  StyledScrollListWrapper,
-  StyledScrollListPsychologist,
-  StyledScrollListPsychologistAvatar,
-  StyledScrollListPsychologistName,
-} from './UserPsychologistScrollList.styled';
-import { PsychologistType } from '../userAppTypes';
-
-export type UsersPsychologistScrollListPropsType = {
-  psychologistClickHandler: React.Dispatch<
-    React.SetStateAction<{
-      isShow: boolean;
-      psychologist_id: string;
-    }>
-  >;
-  usersPsychologists: Array<PsychologistType> | null;
-};
-
-// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-export const UsersPsychologistScrollList = ({
-  psychologistClickHandler,
-  usersPsychologists,
-}: UsersPsychologistScrollListPropsType) => {
-  const [imageLoaded, setImageLoaded] = useState(false);
-
-
-  if (usersPsychologists && usersPsychologists.length) {
-    return (
-      <StyledScrollListSectionWrapper>
-        <StyledScrollListWrapper>
-          {usersPsychologists.map((psychologist) => (
-            <StyledScrollListPsychologist
-              key={`${psychologist.id}-scroll`}
-              onClick={() =>
-                psychologistClickHandler({
-                  isShow: true,
-                  psychologist_id: psychologist.id,
-                })
-              }
-            >
-              <StyledScrollListPsychologistAvatar>
-                <img
-                  className="img"
-                  src={psychologist.avatar}
-                  alt={psychologist.first_name}
-                  onLoad={() => setImageLoaded(true)}
-                  style={{ display: imageLoaded ? 'block' : 'none' }}
-                />
-                <IonSkeletonText
-                  animated
-                  className="img"
-                  style={{ display: imageLoaded ? 'none' : 'block' }}
-                />
-              </StyledScrollListPsychologistAvatar>
-              <StyledScrollListPsychologistName>
-                {psychologist.first_name}
-              </StyledScrollListPsychologistName>
-            </StyledScrollListPsychologist>
-          ))}
-        </StyledScrollListWrapper>
-      </StyledScrollListSectionWrapper>
-    );
-  }
-  return null;
-};

package/dist/lib/archived-consultation-card/ArchivedConsultation.test.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { ArchivedConsultationCard } from './ArchivedConsultationCard';
-
-describe('Test archived consultation', () => {
-  test('Smoke test', () => {
-    render(<ArchivedConsultationCard date="" img="" name="" />);
-  });
-});

package/dist/lib/archived-consultation-card/ArchivedConsultationCard.style.ts

@@ -1,72 +0,0 @@
-import styled from 'styled-components';
-import { colorConstants } from '../Theme/mindly_constants';
-
-export const Container = styled.div`
-  overflow: hidden;
-  display: flex;
-  justify-content: space-between;
-  background: ${colorConstants.AccentGrayBlue};
-  padding: 8px;
-  width: 100%;
-  border-radius: 4px;
-`;
-
-export const TextContainer = styled.div`
-  h3 {
-    padding-top: 5px;
-    font-weight: 700;
-    font-size: 18px;
-    line-height: 24px;
-    color: ${colorConstants.primaryTextColor};
-  }
-
-  h5 {
-    color: ${colorConstants.secondaryTextColor};
-    font-weight: 400;
-    font-size: 16px;
-    line-height: 24px;
-  }
-
-  h5.isFreeStatus {
-    font-weight: 700;
-    font-size: 12px;
-    line-height: 16px;
-    text-align: center;
-    padding: 2px 8px;
-    color: ${colorConstants.primaryTextColor};
-  }
-
-  .greeny-bg {
-    max-width: max-content;
-    background: #cfe2d7;
-    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-    border-radius: 12px;
-  }
-
-  .reddy-bg {
-    max-width: max-content;
-    background: #f6dfdf;
-    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-    border-radius: 12px;
-  }
-
-  h5.check {
-    margin-top: 5px;
-    display: flex;
-    align-items: center;
-    color: ${colorConstants.AccentTickColor};
-    font-weight: 400;
-    font-size: 14px;
-    line-height: 16px;
-  }
-
-  svg {
-    margin-right: 4px;
-  }
-`;
-
-export const Avatar = styled.img`
-  max-width: 94px;
-  max-height: 94px;
-  border-radius: 8px;
-`;

package/dist/lib/archived-consultation-card/ArchivedConsultationCard.svg

@@ -1,3 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M12.6237 3.67075C12.8056 3.46294 13.1214 3.44188 13.3293 3.62372C13.5342 3.80307 13.5575 4.11281 13.3836 4.32066L13.3763 4.32926L6.37629 12.3293C6.18827 12.5441 5.85953 12.5578 5.65438 12.3613L5.64645 12.3536L2.64645 9.35356C2.45118 9.1583 2.45118 8.84171 2.64645 8.64645C2.839 8.4539 3.14952 8.45123 3.34535 8.63843L3.35355 8.64645L5.97563 11.2685L12.6237 3.67075Z" fill="#478862"/>
-</svg>

package/dist/lib/archived-consultation-card/ArchivedConsultationCard.tsx

@@ -1,61 +0,0 @@
-import React from 'react';
-import {
-  Avatar,
-  Container,
-  TextContainer,
-} from './ArchivedConsultationCard.style';
-import { ReactComponent as Icon } from './ArchivedConsultationCard.svg';
-import '../Theme/global.css';
-
-export interface ArchivedConsultationCardProps {
-  /*
-   * Psychologist name and surname
-   */
-  nameAndSurname: string;
-
-  /*
-   * Start date of the last consultation ( in format day, month, time)
-   */
-  date: string;
-
-  /*
-   * Psychologist avatar link
-   */
-  avatar: string;
-  /*
-   * If that's a free consultation
-   */
-  isFree?: boolean;
-  /**
-   * Consultation price
-   */
-  price: string;
-  ['data-testid']?: string;
-}
-
-export const ArchivedConsultationCard: React.FC<ArchivedConsultationCardProps> =
-  (props) => {
-    return (
-      <Container data-testid={props['data-testid']}>
-        <TextContainer>
-          {typeof props.isFree === 'boolean' &&
-            (props.isFree ? (
-              <div className="reddy-bg">
-                <h5 className="isFreeStatus">Безкоштовна</h5>
-              </div>
-            ) : (
-              <div className="greeny-bg">
-                <h5 className="isFreeStatus">{`Платна - ${props.price} грн`}</h5>
-              </div>
-            ))}
-          <h3>{props.nameAndSurname}</h3>
-          <h5 className="semiBold">{props.date}</h5>
-          <h5 className="check">
-            <Icon />
-            Завершена
-          </h5>
-        </TextContainer>
-        <Avatar src={props.avatar} alt="user-avatar" />
-      </Container>
-    );
-  };