@mindly/ui-components 8.0.0-alpha.31 → 8.0.0-alpha.38

package/dist/esm/lib2/shared/utils/mock.d.ts

@@ -3,7 +3,7 @@ import { ClientSpecialistContractStatusEnum } from '../types/contract';
 import { UserType } from '../types/user';
 import { Specialist } from '../types/specialistTypes';
 import { Schedule, Session, SpecialistReview } from '../types';
-export declare const mockT: (translate?: Record<string, string>) => WithTranslation['t'];
+export declare const mockT: (translate?: Record<string, string>) => WithTranslation["t"];
 export declare const specialist: Specialist;
 export declare const currentUser: UserType;
 export declare const listReviews: SpecialistReview[];
@@ -11,14 +11,14 @@ export declare const mockSession: Session;
 export declare const mockSessions: {
     consultation_time: any;
     id: string;
-    consultation_booking_date?: import("../types").SessionTime | undefined;
-    consultation_id?: string | undefined;
+    consultation_booking_date?: import("../types").SessionTime;
+    consultation_id?: string;
     consultation_with: string;
     duration: number;
     exchange_rate: string;
-    payment_date?: import("../types").SessionTime | undefined;
-    payment_type?: string | undefined;
-    price: string | number;
+    payment_date?: import("../types").SessionTime;
+    payment_type?: string;
+    price: number | string;
     price_uah: number;
     psychologist_avatar: string;
     psychologist_id: string;
@@ -30,21 +30,21 @@ export declare const mockSessions: {
     user_timezone: string;
     videochat_url: string;
     was_rescheduled: boolean;
-    session_status?: "client_showed" | "client_not_showed" | undefined;
-    consultation_time_before_rescheduling?: import("../types").SessionTime | undefined;
-    therapist?: Specialist | undefined;
-    user?: UserType | undefined;
+    session_status?: "client_showed" | "client_not_showed";
+    consultation_time_before_rescheduling?: import("../types").SessionTime;
+    therapist?: Specialist;
+    user?: UserType;
     client?: {
-        specialist_client_contract_id?: string | null | undefined;
-        specialist_client_contract_status?: ClientSpecialistContractStatusEnum | null | undefined;
-    } | undefined;
-    applied_promotional_code?: string | null | undefined;
-    auto_booking_status?: "enable" | "disable" | undefined;
-    subscription_id?: string | null | undefined;
-    price_type?: string | undefined;
-    price_default?: number | undefined;
-    payment_intent_id?: string | undefined;
-    subscription?: import("../types").Subscription | undefined;
-    session_review?: import("../types").SessionReview | undefined;
+        specialist_client_contract_id?: string | null;
+        specialist_client_contract_status?: ClientSpecialistContractStatusEnum | null;
+    };
+    applied_promotional_code?: string | null;
+    auto_booking_status?: "enable" | "disable";
+    subscription_id?: string | null;
+    price_type?: string;
+    price_default?: number;
+    payment_intent_id?: string;
+    subscription?: import("../types").Subscription;
+    session_review?: import("../types").SessionReview;
 }[];
 export declare const getMockSchedule: (dayCount: number, hoursStart?: number, hoursEnd?: number) => Schedule;

package/dist/esm/lib2/shared/utils/session.d.ts

@@ -10,5 +10,5 @@ export declare const getSessionsByYear: (sessions: Session[]) => Map<number, Ses
 export declare const getSessionsByMonth: (sessions: Session[]) => Map<number, Session[]>;
 export declare const getSessionsByDay: (sessions: Session[]) => Map<number, Session[]>;
 export declare const splitSessions: (sessions: Session[]) => Map<string, Session[]>;
-export declare const getSessionTimeLabel: (variant: SessionVariant, startSessionDate: Date, t: WithTranslation['t'], locale: SupportedLocales) => string;
+export declare const getSessionTimeLabel: (variant: SessionVariant, startSessionDate: Date, t: WithTranslation["t"], locale: SupportedLocales) => string;
 export declare const canManageSession: (sessionDate?: Date) => boolean;

package/dist/esm/lib2/widgets/FiltersWidget/FiltersWidget.styles.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
-export declare const StyledToolbar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@ionic/core/dist/types/components").JSX.IonToolbar & Omit<import("react").HTMLAttributes<HTMLIonToolbarElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonToolbarElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("@ionic/core/dist/types/components").JSX.IonToolbar & Omit<import("react").HTMLAttributes<HTMLIonToolbarElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonToolbarElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const StyledFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@ionic/core/dist/types/components").JSX.IonFooter & Omit<import("react").HTMLAttributes<HTMLIonFooterElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonFooterElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("@ionic/core/dist/types/components").JSX.IonFooter & Omit<import("react").HTMLAttributes<HTMLIonFooterElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonFooterElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledToolbar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@ionic/core").JSX.IonToolbar & Omit<import("react").HTMLAttributes<HTMLIonToolbarElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonToolbarElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("@ionic/core").JSX.IonToolbar & Omit<import("react").HTMLAttributes<HTMLIonToolbarElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonToolbarElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@ionic/core").JSX.IonFooter & Omit<import("react").HTMLAttributes<HTMLIonFooterElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonFooterElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("@ionic/core").JSX.IonFooter & Omit<import("react").HTMLAttributes<HTMLIonFooterElement>, "style"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonFooterElement>>, keyof import("react").Component<any, {}, any>>;

package/dist/esm/lib2/widgets/SpecialistCardWIthScheduleWidget/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { WithTranslation } from 'react-i18next';
 import { ScheduleDate, ScheduleSlot, Specialist, UserType } from '../../shared/types';
 export type SpecialistCardWithScheduleWidgetProps = {

package/dist/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import * as React$1 from 'react';
 import React__default, { CSSProperties, FC, HTMLAttributes, SVGAttributes, PropsWithChildren, KeyboardEvent, InputHTMLAttributes, RefObject, EffectCallback, DependencyList, SVGProps, ReactNode, ReactElement, ChangeEvent } from 'react';
 import * as _ionic_core from '@ionic/core';
@@ -10,7 +9,6 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { RatingComponentProps } from 'react-rating';
 import * as _ionic_react from '@ionic/react';
 import { ScrollDetail, ScrollBaseDetail, RefresherEventDetail } from '@ionic/react';
-import * as _ionic_core_dist_types_components from '@ionic/core/dist/types/components';
 import { IonContentCustomEvent, IonSearchbarCustomEvent as IonSearchbarCustomEvent$1 } from '@ionic/core/dist/types/components';
 import { Node, ListState, ItemProps as ItemProps$1, SelectionBehavior, SelectionMode, Selection } from 'react-stately';
 export { Selection } from 'react-stately';
@@ -179,7 +177,8 @@ type MediaPlayerProps<TCameraTrack extends Playable | undefined, TAudioTrack ext
     showControls: boolean;
     isScreenSharing?: boolean;
 } & HTMLAttributes<HTMLDivElement>;
-declare const _default$1j: <TCameraTrack extends Playable | undefined, TAudioTrack extends Playable | undefined>({ fullwidth, cameraTrack, audioTrack, isVideoTrackMuted, isAudioTrackMuted, networkQuality, fallbackAvatar, fallbackAvatarDimensions, fallbackName, showControls, isScreenSharing, ...props }: MediaPlayerProps<TCameraTrack, TAudioTrack>) => JSX.Element;
+declare const AgoraMediaPlayer: <TCameraTrack extends Playable | undefined, TAudioTrack extends Playable | undefined>({ fullwidth, cameraTrack, audioTrack, isVideoTrackMuted, isAudioTrackMuted, networkQuality, fallbackAvatar, fallbackAvatarDimensions, fallbackName, showControls, isScreenSharing, ...props }: MediaPlayerProps<TCameraTrack, TAudioTrack>) => JSX.Element;
+declare const _default$1j: typeof AgoraMediaPlayer;
 
 type RoundButtonPropsType = {
     disabled?: boolean;
@@ -1489,7 +1488,7 @@ type ListBoxItemProps = {
 };
 
 declare const ListOption: React$1.ForwardRefExoticComponent<ListOptionsProps & {
-    maxSelectionCount?: number | undefined;
+    maxSelectionCount?: number;
 } & React$1.RefAttributes<HTMLIonItemElement>>;
 declare const ListBoxItem: (props: ItemProps$1<unknown> & ListBoxItemProps) => JSX.Element;
 
@@ -1593,12 +1592,12 @@ type SpinnerProps = {
 };
 declare const Spinner_v2: FC<SpinnerProps>;
 
-declare const ModalSheet: React$1.ForwardRefExoticComponent<_ionic_core_dist_types_components.JSX.IonModal & {
-    children?: React$1.ReactNode;
+declare const ModalSheet: React$1.ForwardRefExoticComponent<_ionic_core.JSX.IonModal & {
+    children?: React$1.ReactNode | undefined;
 } & {
-    heightInPx?: number | undefined;
-    className?: string | undefined;
-    withCloseButton?: boolean | undefined;
+    heightInPx?: number;
+    className?: string;
+    withCloseButton?: boolean;
 } & React$1.RefAttributes<HTMLIonModalElement>>;
 
 type ProgressBar_v2Props = {
@@ -1843,20 +1842,20 @@ type NewSpecialistProps = {
 declare const NewSpecialist: React__default.FC<NewSpecialistProps>;
 
 declare const SolidInput: React__default.ForwardRefExoticComponent<Partial<_ionic_core.Components.IonInput> & {
-    name?: string | undefined;
-    type?: TextFieldTypes | undefined;
-    itemClassName?: string | undefined;
-    inputClassName?: string | undefined;
-    labelClassName?: string | undefined;
-    errorText?: string | undefined;
-    isInvalid?: boolean | undefined;
-    showTogglePassword?: boolean | undefined;
-    showButton?: boolean | undefined;
-    onButtonClick?: (() => void) | undefined;
-    onChange?: ((event: _ionic_core.IonInputCustomEvent<_ionic_react.InputChangeEventDetail>) => void) | undefined;
-    onKeyDown?: React__default.KeyboardEventHandler<Element> | undefined;
-    readonly?: boolean | undefined;
-    onClick?: (() => void) | undefined;
+    name?: string;
+    type?: TextFieldTypes;
+    itemClassName?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    errorText?: string;
+    isInvalid?: boolean;
+    showTogglePassword?: boolean;
+    showButton?: boolean;
+    onButtonClick?: () => void;
+    onChange?: (event: _ionic_core.IonInputCustomEvent<_ionic_react.InputChangeEventDetail>) => void;
+    onKeyDown?: React__default.KeyboardEventHandler;
+    readonly?: boolean;
+    onClick?: () => void;
 } & React__default.RefAttributes<HTMLIonInputElement>>;
 
 type CounterProps = PropsWithChildren<{
@@ -1921,7 +1920,7 @@ declare const CircleRatingContext: React__default.Context<CircleRatingContextDat
 declare const CircleRatingProvider: ({ children, data, t, }: {
     children: JSX.Element;
     data: CircleRatingContextProps;
-    t: WithTranslation['t'];
+    t: WithTranslation["t"];
 }) => JSX.Element | null;
 
 type VideoContextValue = {
@@ -2539,7 +2538,7 @@ declare const getGMTOffset: (timeZone: string) => string;
 declare const getMonthNameInGenitive: (date: Date, locale: SupportedLocales) => string;
 
 type AnyRef = React__default.Ref<any>;
-declare const mergeRefs: <T extends unknown>(...refs: AnyRef[]) => React__default.Ref<T>;
+declare const mergeRefs: <T extends any>(...refs: AnyRef[]) => React__default.Ref<T>;
 
 type PayoutPriceNormilizeProps = {
     price: number;
@@ -2614,7 +2613,7 @@ type CardModalProps = {
     onDidPresent?: () => void;
 };
 declare const CardModal: React__default.ForwardRefExoticComponent<CardModalProps & {
-    children?: React__default.ReactNode;
+    children?: React__default.ReactNode | undefined;
 } & React__default.RefAttributes<HTMLIonModalElement>>;
 
 type SlotsGridProps = {
@@ -2800,21 +2799,21 @@ declare function GoogleCalendarModalFeature({ status, isOpen, onSync, isLoading,
 
 type ReviewCardFeatureVariantType = 'default' | 'outlined' | 'full' | 'store' | 'starFirst';
 declare const _default$O: React__default.NamedExoticComponent<{
-    id?: string | undefined;
-    avatarSrc?: string | undefined;
+    id?: string;
+    avatarSrc?: string;
     name: string;
     date: number;
     rating: number;
     review: string;
-    size?: "default" | "large" | "small" | undefined;
-    variant?: ReviewCardFeatureVariantType | undefined;
-    reviewTextClamp?: number | undefined;
+    size?: "default" | "small" | "large";
+    variant?: ReviewCardFeatureVariantType;
+    reviewTextClamp?: number;
     onExpandReview?(): void;
-    className?: string | undefined;
-    useDate?: boolean | undefined;
-    locale?: SupportedLocales | undefined;
-    isEditable?: boolean | undefined;
-    onEditReview?: ((review: Pick<SpecialistReview$1, "id" | "review_rating" | "text_of_review">) => void) | undefined;
+    className?: string;
+    useDate?: boolean;
+    locale?: SupportedLocales;
+    isEditable?: boolean;
+    onEditReview?: (review: Pick<SpecialistReview$1, "id" | "review_rating" | "text_of_review">) => void;
 } & TranslationType & React__default.RefAttributes<HTMLDivElement>>;
 
 declare const ReviewsCardFeatureSkeleton: React__default.MemoExoticComponent<() => react_jsx_runtime.JSX.Element>;
@@ -3636,10 +3635,10 @@ declare const getSessionsByYear: (sessions: Session[]) => Map<number, Session[]>
 declare const getSessionsByMonth: (sessions: Session[]) => Map<number, Session[]>;
 declare const getSessionsByDay: (sessions: Session[]) => Map<number, Session[]>;
 declare const splitSessions: (sessions: Session[]) => Map<string, Session[]>;
-declare const getSessionTimeLabel: (variant: SessionVariant, startSessionDate: Date, t: WithTranslation['t'], locale: SupportedLocales) => string;
+declare const getSessionTimeLabel: (variant: SessionVariant, startSessionDate: Date, t: WithTranslation["t"], locale: SupportedLocales) => string;
 declare const canManageSession: (sessionDate?: Date) => boolean;
 
-declare const mockT: (translate?: Record<string, string>) => WithTranslation['t'];
+declare const mockT: (translate?: Record<string, string>) => WithTranslation["t"];
 declare const specialist: Specialist;
 declare const currentUser: UserType;
 declare const listReviews: SpecialistReview$1[];
@@ -3647,14 +3646,14 @@ declare const mockSession: Session;
 declare const mockSessions: {
     consultation_time: any;
     id: string;
-    consultation_booking_date?: SessionTime | undefined;
-    consultation_id?: string | undefined;
+    consultation_booking_date?: SessionTime;
+    consultation_id?: string;
     consultation_with: string;
     duration: number;
     exchange_rate: string;
-    payment_date?: SessionTime | undefined;
-    payment_type?: string | undefined;
-    price: string | number;
+    payment_date?: SessionTime;
+    payment_type?: string;
+    price: number | string;
     price_uah: number;
     psychologist_avatar: string;
     psychologist_id: string;
@@ -3666,22 +3665,22 @@ declare const mockSessions: {
     user_timezone: string;
     videochat_url: string;
     was_rescheduled: boolean;
-    session_status?: "client_showed" | "client_not_showed" | undefined;
-    consultation_time_before_rescheduling?: SessionTime | undefined;
-    therapist?: Specialist | undefined;
-    user?: UserType | undefined;
+    session_status?: "client_showed" | "client_not_showed";
+    consultation_time_before_rescheduling?: SessionTime;
+    therapist?: Specialist;
+    user?: UserType;
     client?: {
-        specialist_client_contract_id?: string | null | undefined;
-        specialist_client_contract_status?: ClientSpecialistContractStatusEnum | null | undefined;
-    } | undefined;
-    applied_promotional_code?: string | null | undefined;
-    auto_booking_status?: "enable" | "disable" | undefined;
-    subscription_id?: string | null | undefined;
-    price_type?: string | undefined;
-    price_default?: number | undefined;
-    payment_intent_id?: string | undefined;
-    subscription?: Subscription | undefined;
-    session_review?: SessionReview$1 | undefined;
+        specialist_client_contract_id?: string | null;
+        specialist_client_contract_status?: ClientSpecialistContractStatusEnum | null;
+    };
+    applied_promotional_code?: string | null;
+    auto_booking_status?: "enable" | "disable";
+    subscription_id?: string | null;
+    price_type?: string;
+    price_default?: number;
+    payment_intent_id?: string;
+    subscription?: Subscription;
+    session_review?: SessionReview$1;
 }[];
 declare const getMockSchedule: (dayCount: number, hoursStart?: number, hoursEnd?: number) => Schedule;
 
@@ -4274,13 +4273,13 @@ type TooltipComponentProps = {
 declare const TooltipComponent: FC<TooltipComponentProps>;
 
 declare const _default$h: React__default.NamedExoticComponent<SwiperProps & React__default.HTMLAttributes<HTMLDivElement> & {
-    slides: string[] | number[];
-    onDayClick?: ((i: number, item: string | number) => void) | undefined;
+    slides: number[] | string[];
+    onDayClick?: (i: number, item: number | string) => void;
     locale: SupportedLocales;
     translations?: {
-        today?: string | undefined;
-        tomorrow?: string | undefined;
-    } | undefined;
+        today?: string;
+        tomorrow?: string;
+    };
 } & React__default.RefAttributes<SwiperRef>>;
 
 type SpecialistWorkDirectionsPropsType = {
@@ -4427,31 +4426,31 @@ type SpecialistCardProps = {
 declare const SpecialistCard: React__default.FC<SpecialistCardProps>;
 
 declare const _default$a: React__default.NamedExoticComponent<{
-    isError?: boolean | undefined;
-    errorStyle?: "filled" | "unfilled" | undefined;
-    type?: "number" | "text" | "email" | undefined;
+    isError?: boolean;
+    errorStyle?: "filled" | "unfilled";
+    type?: "text" | "email" | "number";
 } & React__default.InputHTMLAttributes<HTMLInputElement> & React__default.RefAttributes<HTMLInputElement>>;
 
 declare const ImageInput: React__default.ForwardRefExoticComponent<{
-    dimension?: number | undefined;
-    buttonLabel?: string | undefined;
-    isRoundedImage?: boolean | undefined;
-    isCloseButton?: boolean | undefined;
-    onCloseClick?: (() => void) | undefined;
-    isVideoContent?: boolean | undefined;
-    isError?: boolean | undefined;
-    errorMessage?: string | undefined;
-    loadedFileValue?: string | undefined;
-    renderMediaAfterLoad?: boolean | undefined;
-    isFilledButton?: boolean | undefined;
+    dimension?: number;
+    buttonLabel?: string;
+    isRoundedImage?: boolean;
+    isCloseButton?: boolean;
+    onCloseClick?: () => void;
+    isVideoContent?: boolean;
+    isError?: boolean;
+    errorMessage?: string;
+    loadedFileValue?: string;
+    renderMediaAfterLoad?: boolean;
+    isFilledButton?: boolean;
 } & Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "type"> & React__default.RefAttributes<HTMLInputElement>>;
 
 declare const PasswordInput: React__default.ForwardRefExoticComponent<{
-    error?: string | null | undefined;
+    error?: string | null;
 } & Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "type"> & React__default.RefAttributes<HTMLInputElement>>;
 
 declare const _default$9: React__default.NamedExoticComponent<{
-    isError?: boolean | undefined;
+    isError?: boolean;
 } & React__default.TextareaHTMLAttributes<HTMLTextAreaElement> & React__default.RefAttributes<HTMLTextAreaElement>>;
 
 declare const _default$8: React__default.NamedExoticComponent<{
@@ -4459,9 +4458,9 @@ declare const _default$8: React__default.NamedExoticComponent<{
         id: string | number;
         label: string | number;
     }[];
-    isError?: boolean | undefined;
-    selectedBy?: "id" | "label" | undefined;
-    placeholder?: string | undefined;
+    isError?: boolean;
+    selectedBy?: "id" | "label";
+    placeholder?: string;
 } & React__default.SelectHTMLAttributes<HTMLSelectElement> & React__default.RefAttributes<HTMLSelectElement>>;
 
 type PossibleButtonTypes = 'primary' | 'secondary' | 'accent' | 'accent-dark-green' | 'accent-light-grey' | 'transparent' | 'border' | 'border-white' | 'white' | 'outline';
@@ -4537,12 +4536,12 @@ declare const _default$5: React__default.NamedExoticComponent<ProgressBarProps>;
 
 declare const _default$4: React__default.NamedExoticComponent<{
     title: string;
-    subTitle?: string | undefined;
-    isError?: boolean | undefined;
-    loadedFileValue?: string | undefined;
-    onCloseClick?: (() => void) | undefined;
-    buttonLabel?: string | undefined;
-    renderMediaAfterLoad?: boolean | undefined;
+    subTitle?: string;
+    isError?: boolean;
+    loadedFileValue?: string;
+    onCloseClick?: () => void;
+    buttonLabel?: string;
+    renderMediaAfterLoad?: boolean;
 } & Omit<React__default.InputHTMLAttributes<HTMLInputElement>, "type"> & React__default.RefAttributes<HTMLInputElement>>;
 
 type SuccessScreenProps = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindly/ui-components",
-  "version": "8.0.0-alpha.31",
+  "version": "8.0.0-alpha.38",
   "private": false,
   "scripts": {
     "clean": "rimraf dist",
@@ -51,8 +51,7 @@
     "styled-components": "^6.1.19",
     "swiper": "8.4.7",
     "tailwind-variants": "^3.1.1",
-    "usehooks-ts": "^3.1.0",
-    "vite": "^7.2.2"
+    "usehooks-ts": "^3.1.0"
   },
   "peerDependencies": {
     "@babel/polyfill": "7.12.1",
@@ -163,7 +162,8 @@
     "style-loader": "^4.0.0",
     "tailwindcss": "3.3.3",
     "tslib": "2.6.2",
-    "typescript": "4.9.5",
+    "typescript": "^5.9.3",
+    "vite": "^7.2.2",
     "webpack": "5.88.2"
   },
   "description": "This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).",