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

package/dist/esm/lib/Chat/EmptyChatMessages/EmptyChatMessages.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+type EmptyChatMessagesProps = {
+    title?: string;
+    text: string;
+};
+declare const EmptyChatMessages: FC<EmptyChatMessagesProps>;
+export default EmptyChatMessages;

package/dist/esm/lib/Chat/EmptyChatMessages/EmptyChatMessages.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ReactComponent as Chat } from './chat.svg';
+import { EmptyMessage, EmptyTitle, EmptyWrapper, } from './EmptyChatMessages.style';
+const EmptyChatMessages = ({ title = 'Почніть розмову', text, }) => {
+    return (_jsxs(EmptyWrapper, { children: [_jsx(Chat, {}), _jsx(EmptyTitle, { children: title }), _jsx(EmptyMessage, { children: text })] }));
+};
+export default EmptyChatMessages;

package/dist/esm/lib/Chat/EmptyChatMessages/EmptyChatMessages.style.d.ts

@@ -0,0 +1,3 @@
+export declare const EmptyWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const EmptyTitle: import("styled-components").StyledComponent<"h3", any, {}, never>;
+export declare const EmptyMessage: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/esm/lib/Chat/EmptyChatMessages/EmptyChatMessages.style.js

@@ -0,0 +1,29 @@
+import styled from 'styled-components';
+export const EmptyWrapper = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  max-width: 288px;
+  width: 100%;
+  background: rgba(29, 32, 31, 0.2);
+  mix-blend-mode: normal;
+  backdrop-filter: blur(12.5px);
+  border-radius: 10px;
+  padding: 24px 16px;
+`;
+export const EmptyTitle = styled.h3 `
+  font-weight: 600;
+  font-size: 18px;
+  line-height: 24px;
+  text-align: center;
+  color: #ffffff;
+  margin-top: 18px;
+  margin-bottom: 8px;
+`;
+export const EmptyMessage = styled.div `
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 16px;
+  text-align: center;
+  color: #ffffff;
+`;

package/dist/esm/lib/Chat/EmptyChatMessages/index.d.ts

@@ -0,0 +1 @@
+export { default } from './EmptyChatMessages';

package/dist/esm/lib/Chat/EmptyChatMessages/index.js

@@ -0,0 +1 @@
+export { default } from './EmptyChatMessages';

package/dist/esm/lib/Chat/LouseConnect/LouseConnect.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+type LouseConnectProps = {
+    onClick?: () => void;
+};
+declare const LouseConnect: FC<LouseConnectProps>;
+export default LouseConnect;

package/dist/esm/lib/Chat/LouseConnect/LouseConnect.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ButtonWrapper, LouseConnectWrapper, WarningMessage, } from './LouseConnect.style';
+import { IonIcon } from '@ionic/react';
+import { alertCircleOutline } from 'ionicons/icons';
+import { Button } from '../../../deprecated/button/Button';
+const LouseConnect = ({ onClick }) => {
+    return (_jsxs(LouseConnectWrapper, { children: [_jsxs(WarningMessage, { children: [_jsx(IonIcon, { icon: alertCircleOutline }), _jsxs("div", { children: ["\u0417'\u0454\u0434\u043D\u0430\u043D\u043D\u044F", _jsx("br", {}), " \u043F\u0435\u0440\u0435\u0440\u0432\u0430\u043D\u043E"] })] }), _jsx(ButtonWrapper, { children: _jsx(Button, Object.assign({ buttonType: "secondaryWithStroke", isDisabled: false, onClick: onClick }, { children: "\u0412\u0456\u0434\u043D\u043E\u0432\u0438\u0442\u0438" })) })] }));
+};
+export default LouseConnect;

package/dist/esm/lib/Chat/LouseConnect/LouseConnect.style.d.ts

@@ -0,0 +1,3 @@
+export declare const LouseConnectWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WarningMessage: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ButtonWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/esm/lib/Chat/LouseConnect/LouseConnect.style.js

@@ -0,0 +1,33 @@
+import styled from 'styled-components';
+export const LouseConnectWrapper = styled.div `
+  background: #ffffff;
+  border: 1px solid #c13e18;
+  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.1);
+  border-radius: 8px;
+  width: 100%;
+  padding: 16px 16px 16px 19px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+`;
+export const WarningMessage = styled.div `
+  display: flex;
+  align-items: center;
+  font-weight: 600;
+  font-size: 14px;
+  line-height: 16px;
+  color: #c13e18;
+  flex: 0 0 50%;
+
+  & div {
+    margin-left: 13px;
+  }
+
+  & ion-icon {
+    font-size: 18px;
+  }
+`;
+export const ButtonWrapper = styled.div `
+  max-width: 122px;
+  width: 100%;
+`;

package/dist/esm/lib/Chat/LouseConnect/index.d.ts

@@ -0,0 +1 @@
+export { default } from './LouseConnect';

package/dist/esm/lib/Chat/LouseConnect/index.js

@@ -0,0 +1 @@
+export { default } from './LouseConnect';

package/dist/esm/lib/Chat/Textarea/Textarea.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { WithTranslation } from 'react-i18next';
+type FileInfoType = {
+    originalName: string;
+    size: number;
+    width?: number;
+    height?: number;
+};
+type TextareaProps = {
+    onSend: (value: string) => void;
+    defaultValue?: string;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    isOpen: boolean;
+    maxLength: number;
+    onError?: (message: string) => void;
+    onFileSelect?: (file: File | null, type: 'file' | 'image' | 'video', fileInfo: FileInfoType) => void;
+    t?: WithTranslation['t'];
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLIonFooterElement>>>;
+export default _default;

package/dist/esm/lib/Chat/Textarea/Textarea.js

@@ -0,0 +1,103 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { forwardRef, useCallback, useRef, useState, } from 'react';
+import { IonIcon } from '@ionic/react';
+import { arrowUpOutline } from 'ionicons/icons';
+import { AttachButton, SendButton, StyledFooter, StyledToolbar, TextareaStyled, TextareaWrapper, } from './Textarea.style';
+import { ReactComponent as AttachIcon } from './shape.svg';
+import { loadImage, loadVideo } from './utils';
+const acceptedImageTypes = [
+    'image/gif',
+    'image/jpeg',
+    'image/jpg',
+    'image/png',
+];
+const acceptedVideoTypes = [
+    'video/mp4',
+    'video/ogg',
+    'video/webm',
+    'video/webm',
+    'video/mov',
+    'video/quicktime',
+];
+const Textarea = forwardRef(({ onSend, defaultValue = '', onFocus, onBlur, isOpen, maxLength, onError, onFileSelect, t, }, ref) => {
+    const [value, setValue] = useState(defaultValue);
+    const textareaRef = useRef(null);
+    const handleSend = (e) => {
+        e.preventDefault();
+        const sendMessage = value === null || value === void 0 ? void 0 : value.trim();
+        if (sendMessage.length > maxLength) {
+            onError === null || onError === void 0 ? void 0 : onError(sendMessage);
+            return;
+        }
+        sendMessage.length && onSend(sendMessage);
+        setValue('');
+        if (textareaRef.current) {
+            textareaRef.current.style.height = '33px';
+        }
+    };
+    const handleChange = useCallback((e) => {
+        var _a;
+        const val = e.target.value;
+        if (textareaRef.current) {
+            textareaRef.current.style.height =
+                ((_a = textareaRef.current) === null || _a === void 0 ? void 0 : _a.scrollHeight) + 'px';
+        }
+        setValue(val);
+    }, [textareaRef]);
+    const handleFileChange = (e) => __awaiter(void 0, void 0, void 0, function* () {
+        var _a, _b;
+        if (!((_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0]))
+            return;
+        const _URL = window.URL || window.webkitURL;
+        const file = (_b = e.target.files) === null || _b === void 0 ? void 0 : _b[0];
+        const objUrl = _URL.createObjectURL(file);
+        if (acceptedImageTypes.includes(file.type)) {
+            try {
+                const img = yield loadImage(objUrl);
+                onFileSelect === null || onFileSelect === void 0 ? void 0 : onFileSelect(file, 'image', {
+                    originalName: file.name,
+                    size: file.size,
+                    width: img.width,
+                    height: img.height,
+                });
+            }
+            catch (err) {
+                console.error(err);
+            }
+        }
+        else if (acceptedVideoTypes.includes(file.type)) {
+            try {
+                const video = yield loadVideo(objUrl);
+                onFileSelect === null || onFileSelect === void 0 ? void 0 : onFileSelect(file, 'video', {
+                    originalName: file.name,
+                    size: file.size,
+                    width: video.videoWidth,
+                    height: video.videoHeight,
+                });
+            }
+            catch (err) {
+                console.error(err);
+            }
+        }
+        else {
+            onFileSelect === null || onFileSelect === void 0 ? void 0 : onFileSelect(file, 'file', {
+                originalName: file.name,
+                size: file.size,
+            });
+        }
+    });
+    return (_jsx(StyledFooter, Object.assign({ ref: ref }, { children: _jsx(StyledToolbar, Object.assign({ isOpen: isOpen }, { children: _jsxs(TextareaWrapper, { children: [_jsxs(AttachButton, Object.assign({ onClick: (e) => {
+                            e.stopPropagation();
+                        } }, { children: [_jsx(AttachIcon, {}), _jsx("input", { type: "file", onChange: handleFileChange })] })), _jsx(TextareaStyled, { ref: textareaRef, onFocus: onFocus, onBlur: onBlur, onChange: handleChange, value: value, placeholder: t === null || t === void 0 ? void 0 : t('chat.new_message_hint') }), _jsx(SendButton, Object.assign({ onClick: handleSend, onTouchEnd: handleSend }, { children: _jsx(IonIcon, { icon: arrowUpOutline }) }))] }) })) })));
+});
+Textarea.displayName = 'Textarea';
+export default React.memo(Textarea);

package/dist/esm/lib/Chat/Textarea/Textarea.style.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const TextareaWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TextareaStyled: import("styled-components").StyledComponent<"textarea", any, {}, never>;
+export declare const SendButton: import("styled-components").StyledComponent<"button", any, {}, never>;
+export declare const StyledFooter: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@ionic/core/dist/types/components").JSX.IonFooter & Pick<import("react").HTMLAttributes<HTMLIonFooterElement>, "slot" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "children" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonFooterElement>>, any, {}, never>;
+type StyledToolbarProps = {
+    isOpen: boolean;
+};
+export declare const StyledToolbar: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@ionic/core/dist/types/components").JSX.IonToolbar & Pick<import("react").HTMLAttributes<HTMLIonToolbarElement>, "slot" | "title" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "children" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("@ionic/react/dist/types/components/react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLIonToolbarElement>>, any, StyledToolbarProps, never>;
+export declare const AttachButton: import("styled-components").StyledComponent<"button", any, {}, never>;
+export {};

package/dist/esm/lib/Chat/Textarea/Textarea.style.js

@@ -0,0 +1,95 @@
+import styled from 'styled-components';
+import { IonFooter, IonToolbar, isPlatform } from '@ionic/react';
+import { maxContainerWidth } from '../../Theme/mindly_constants';
+export const TextareaWrapper = styled.div `
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  column-gap: 6px;
+  background: #f2f4f7;
+  padding: 6px;
+`;
+export const TextareaStyled = styled.textarea `
+  flex: 1;
+  border: none;
+  resize: none;
+  outline: none;
+  background: #ffffff;
+  border-radius: 16px;
+  padding: 6px 12px;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 19px;
+  color: #1d201f;
+  max-height: 270px;
+  height: 33px;
+
+  &::placeholder {
+    color: #c1c1c1;
+  }
+`;
+export const SendButton = styled.button `
+  width: 31px;
+  height: 31px;
+  border-radius: 50%;
+  background: #177590;
+  outline: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #ffffff;
+  font-size: 20px;
+`;
+export const StyledFooter = styled(IonFooter) `
+  background: #f2f4f7;
+
+  &::before {
+    display: none;
+  }
+`;
+export const StyledToolbar = styled(IonToolbar) `
+  max-width: ${() => (isPlatform('desktop') ? maxContainerWidth : '100%')};
+  --background: #f2f4f7;
+  --border-width: 0;
+  --padding-start: 0;
+  --padding-top: 0;
+  --padding-end: 0;
+  --padding-bottom: 0;
+  padding-bottom: ${({ isOpen }) => {
+    return isOpen
+        ? 'calc(var(--ion-safe-area-bottom)-var(--ion-safe-area-bottom)) !important'
+        : 'var(--ion-safe-area-bottom, 0) !important';
+}};
+
+  margin: 0 auto;
+  --min-height: 44px;
+`;
+export const AttachButton = styled.button `
+  position: relative;
+  width: 25px;
+  height: 25px;
+  color: #5b5b5b;
+  background: transparent;
+  overflow: hidden;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+
+  & svg {
+    width: 20px;
+  }
+
+  & input[type='file'] {
+    position: absolute;
+    left: 0;
+    top: 0;
+    opacity: 0;
+    transform: scale(3);
+    cursor: pointer;
+  }
+`;

package/dist/esm/lib/Chat/Textarea/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Textarea';

package/dist/esm/lib/Chat/Textarea/index.js

@@ -0,0 +1 @@
+export { default } from './Textarea';

package/dist/esm/lib/Chat/Textarea/utils.d.ts

@@ -0,0 +1,2 @@
+export declare const loadImage: (path: string) => Promise<HTMLImageElement>;
+export declare const loadVideo: (path: string) => Promise<HTMLVideoElement>;

package/dist/esm/lib/Chat/Textarea/utils.js

@@ -0,0 +1,24 @@
+export const loadImage = (path) => {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.src = path;
+        img.onload = () => {
+            resolve(img);
+        };
+        img.onerror = (e) => {
+            reject(e);
+        };
+    });
+};
+export const loadVideo = (path) => {
+    return new Promise((resolve, reject) => {
+        const video = document.createElement('video');
+        video.src = path;
+        video.onloadedmetadata = () => {
+            resolve(video);
+        };
+        video.onerror = (e) => {
+            reject(e);
+        };
+    });
+};

package/dist/esm/lib/Chat/utils.d.ts

@@ -0,0 +1 @@
+export declare const timeNormalize: (message: string, timeZone: string, locale: string) => string;

package/dist/esm/lib/Chat/utils.js

@@ -0,0 +1,19 @@
+import { DateTime } from 'luxon';
+export const timeNormalize = (message, timeZone, locale) => {
+    var _a;
+    const result = (_a = message === null || message === void 0 ? void 0 : message.match(/<time>(.*?)<\/time>/g)) === null || _a === void 0 ? void 0 : _a.map(function (val) {
+        return val;
+    });
+    let newMessage = message;
+    if (result === null || result === void 0 ? void 0 : result.length) {
+        result.forEach((r) => {
+            const time = DateTime.fromSeconds(Number(r.replace('<time>', '').replace('</time>', '')))
+                .setLocale(locale)
+                .setZone(timeZone);
+            newMessage = newMessage.replace(r, `${time.toFormat('EEEE, d MMMM').charAt(0).toUpperCase()}${time
+                .toFormat('EEEE, d MMMM')
+                .slice(1)}, ${time.toLocaleString(DateTime.TIME_SIMPLE)}`);
+        });
+    }
+    return newMessage;
+};

package/dist/esm/lib/ChevronHeader/ChevronHeader.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { IonButtons, IonIcon } from '@ionic/react';
+import AppHeader from '../AppHeader';
+import Skeleton from '../Skeleton';
+import { BackButton, BookingSteps, BookingTitle, ChevronHeaderTitle } from './ChevronHeader.styled';
+import { chevronBackOutline } from 'ionicons/icons';
+const ChevronHeader = ({ title, subTitle, isLoading, onClick, }) => {
+    return !isLoading ? (_jsxs(AppHeader, { children: [_jsx(IonButtons, Object.assign({ slot: "start" }, { children: _jsx(BackButton, Object.assign({ onClick: onClick }, { children: _jsx(IonIcon, { icon: chevronBackOutline }) })) })), _jsxs(ChevronHeaderTitle, { children: [title && _jsx(BookingTitle, { children: title }), subTitle && _jsx(BookingSteps, { children: subTitle })] })] })) : (_jsxs(AppHeader, { children: [_jsx(IonButtons, Object.assign({ slot: "start" }, { children: _jsx(BackButton, Object.assign({ onClick: onClick }, { children: _jsx(IonIcon, { icon: chevronBackOutline }) })) })), _jsxs("div", Object.assign({ style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    flexDirection: 'column',
+                } }, { children: [_jsx(Skeleton, { widthPx: 60, heightPx: 16 }), _jsx(Skeleton, { widthPx: 92, heightPx: 14 })] }))] }));
+};
+export default ChevronHeader;

package/dist/esm/lib/ChevronHeader/ChevronHeader.styled.d.ts

@@ -1,4 +1,5 @@
-export declare const BackButton: import("styled-components").StyledComponent<"button", any, {}, never>;
-export declare const BookingSteps: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BookingTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ChevronHeaderTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+/// <reference types="react" />
+export declare const BackButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+export declare const BookingSteps: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const BookingTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ChevronHeaderTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/esm/lib/ChevronHeader/ChevronHeader.styled.js

@@ -0,0 +1,46 @@
+import styled from 'styled-components';
+export const BackButton = styled.button `
+  outline: none;
+  background: transparent;
+  color: #000000;
+  font-size: 20px;
+  padding: 0;
+  margin-left: -8px;
+  border: none;
+`;
+export const BookingSteps = styled.div `
+  font-size: 12px;
+  color: #1d201f;
+  text-align: center;
+  font-weight: 400;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  line-clamp: 1;
+  -webkit-box-orient: vertical;
+  word-break: break-word;
+`;
+export const BookingTitle = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  column-gap: 8px;
+  width: 100%;
+  text-align: center;
+  font-size: 14px;
+  font-weight: 600;
+  color: #1d201f;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 1;
+  line-clamp: 1;
+  -webkit-box-orient: vertical;
+  word-break: break-word;
+`;
+export const ChevronHeaderTitle = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+`;

package/dist/esm/lib/ChevronHeader/index.js

@@ -0,0 +1 @@
+export { default } from './ChevronHeader';

package/dist/esm/lib/Consultations/CancelSession/CancelSession.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useState } from 'react';
+import { IonIcon, IonSpinner } from '@ionic/react';
+import { calendarNumberOutline } from 'ionicons/icons';
+import { ReactComponent as BucketIcon } from './bucket.svg';
+import { ReactComponent as MessageIcon } from './message.svg';
+import ConsultationCard, { ConsultationCardType } from '../ConsultationCard';
+import { CancelConfirmWrapper, CancelSessionConfirmWrapper, } from './CancelSession.style';
+const CancelSession = ({ name, avatar, time, timeZone = 'Europe/Kiev', onSubmit, onReschedule, isLoading = false, emptyReasonErrorMessage, locale, translations, }) => {
+    const [isConfirm, setIsConfirm] = useState(false);
+    const [message, setMessage] = useState('');
+    const [error, setError] = useState(false);
+    const handleMessageChange = useCallback((e) => {
+        setError(false);
+        setMessage(e.target.value);
+    }, []);
+    if (isConfirm) {
+        return (_jsxs(CancelConfirmWrapper, { children: [_jsx(MessageIcon, {}), _jsx("div", Object.assign({ className: "confirm-title" }, { children: translations.title })), _jsxs("div", { children: [_jsx("textarea", { className: `confirm-textarea ${error ? 'error' : ''}`, placeholder: translations.placeholder, value: message, onChange: handleMessageChange }), error && emptyReasonErrorMessage && (_jsx("span", Object.assign({ className: "error-message" }, { children: emptyReasonErrorMessage })))] }), _jsxs("button", Object.assign({ disabled: isLoading, className: `cancel-btn ${message.length ? 'red' : 'blue'}`, onClick: () => (message === null || message === void 0 ? void 0 : message.length) ? onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(message) : setError(true) }, { children: [isLoading && _jsx(IonSpinner, { name: "crescent" }), translations.cancelBtnLabel] }))] }));
+    }
+    return (_jsxs(CancelSessionConfirmWrapper, { children: [_jsx(BucketIcon, {}), _jsx("div", Object.assign({ className: "cancel-title" }, { children: translations.question })), _jsx(ConsultationCard, { type: ConsultationCardType.FEATURE, name: name, avatar: avatar, time: time, timeZone: timeZone, locale: locale, sessionId: "" }), _jsx("div", Object.assign({ className: "cancel-desc" }, { children: translations.description })), _jsxs("button", Object.assign({ className: "reschedule-btn", onClick: onReschedule }, { children: [_jsx(IonIcon, { icon: calendarNumberOutline }), ' ', translations.rescheduleBtnLabel] })), _jsx("button", Object.assign({ className: "confirm-btn", onClick: () => setIsConfirm(true) }, { children: translations.cancelBtnLabel }))] }));
+};
+export default CancelSession;

package/dist/esm/lib/Consultations/CancelSession/CancelSession.style.d.ts

@@ -1,2 +1,3 @@
-export declare const CancelSessionConfirmWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CancelConfirmWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+/// <reference types="react" />
+export declare const CancelSessionConfirmWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const CancelConfirmWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;