@mindly/ui-components 7.5.2 → 8.0.0-alpha.32

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

@@ -0,0 +1,128 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const react_2 = require("@ionic/react");
+const icons_1 = require("ionicons/icons");
+const Textarea_style_1 = require("./Textarea.style");
+const shape_svg_1 = require("./shape.svg");
+const utils_1 = require("./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 = (0, react_1.forwardRef)(({ onSend, defaultValue = '', onFocus, onBlur, isOpen, maxLength, onError, onFileSelect, t, }, ref) => {
+    const [value, setValue] = (0, react_1.useState)(defaultValue);
+    const textareaRef = (0, react_1.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 = (0, react_1.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 (0, utils_1.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 (0, utils_1.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 ((0, jsx_runtime_1.jsx)(Textarea_style_1.StyledFooter, Object.assign({ ref: ref }, { children: (0, jsx_runtime_1.jsx)(Textarea_style_1.StyledToolbar, Object.assign({ isOpen: isOpen }, { children: (0, jsx_runtime_1.jsxs)(Textarea_style_1.TextareaWrapper, { children: [(0, jsx_runtime_1.jsxs)(Textarea_style_1.AttachButton, Object.assign({ onClick: (e) => {
+                            e.stopPropagation();
+                        } }, { children: [(0, jsx_runtime_1.jsx)(shape_svg_1.ReactComponent, {}), (0, jsx_runtime_1.jsx)("input", { type: "file", onChange: handleFileChange })] })), (0, jsx_runtime_1.jsx)(Textarea_style_1.TextareaStyled, { ref: textareaRef, onFocus: onFocus, onBlur: onBlur, onChange: handleChange, value: value, placeholder: t === null || t === void 0 ? void 0 : t('chat.new_message_hint') }), (0, jsx_runtime_1.jsx)(Textarea_style_1.SendButton, Object.assign({ onClick: handleSend, onTouchEnd: handleSend }, { children: (0, jsx_runtime_1.jsx)(react_2.IonIcon, { icon: icons_1.arrowUpOutline }) }))] }) })) })));
+});
+Textarea.displayName = 'Textarea';
+exports.default = react_1.default.memo(Textarea);

package/dist/cjs/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/cjs/lib/Chat/Textarea/Textarea.style.js

@@ -0,0 +1,101 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AttachButton = exports.StyledToolbar = exports.StyledFooter = exports.SendButton = exports.TextareaStyled = exports.TextareaWrapper = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const react_1 = require("@ionic/react");
+const mindly_constants_1 = require("../../Theme/mindly_constants");
+exports.TextareaWrapper = styled_components_1.default.div `
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  column-gap: 6px;
+  background: #f2f4f7;
+  padding: 6px;
+`;
+exports.TextareaStyled = styled_components_1.default.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;
+  }
+`;
+exports.SendButton = styled_components_1.default.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;
+`;
+exports.StyledFooter = (0, styled_components_1.default)(react_1.IonFooter) `
+  background: #f2f4f7;
+
+  &::before {
+    display: none;
+  }
+`;
+exports.StyledToolbar = (0, styled_components_1.default)(react_1.IonToolbar) `
+  max-width: ${() => ((0, react_1.isPlatform)('desktop') ? mindly_constants_1.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;
+`;
+exports.AttachButton = styled_components_1.default.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/cjs/lib/Chat/Textarea/index.d.ts

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

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

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Textarea_1 = require("./Textarea");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Textarea_1).default; } });

package/dist/cjs/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/cjs/lib/Chat/Textarea/utils.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadVideo = exports.loadImage = void 0;
+const loadImage = (path) => {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.src = path;
+        img.onload = () => {
+            resolve(img);
+        };
+        img.onerror = (e) => {
+            reject(e);
+        };
+    });
+};
+exports.loadImage = loadImage;
+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);
+        };
+    });
+};
+exports.loadVideo = loadVideo;

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

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

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

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.timeNormalize = void 0;
+const luxon_1 = require("luxon");
+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 = luxon_1.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(luxon_1.DateTime.TIME_SIMPLE)}`);
+        });
+    }
+    return newMessage;
+};
+exports.timeNormalize = timeNormalize;

package/dist/cjs/lib/ChevronHeader/ChevronHeader.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@ionic/react");
+const AppHeader_1 = __importDefault(require("../AppHeader"));
+const Skeleton_1 = __importDefault(require("../Skeleton"));
+const ChevronHeader_styled_1 = require("./ChevronHeader.styled");
+const icons_1 = require("ionicons/icons");
+const ChevronHeader = ({ title, subTitle, isLoading, onClick, }) => {
+    return !isLoading ? ((0, jsx_runtime_1.jsxs)(AppHeader_1.default, { children: [(0, jsx_runtime_1.jsx)(react_1.IonButtons, Object.assign({ slot: "start" }, { children: (0, jsx_runtime_1.jsx)(ChevronHeader_styled_1.BackButton, Object.assign({ onClick: onClick }, { children: (0, jsx_runtime_1.jsx)(react_1.IonIcon, { icon: icons_1.chevronBackOutline }) })) })), (0, jsx_runtime_1.jsxs)(ChevronHeader_styled_1.ChevronHeaderTitle, { children: [title && (0, jsx_runtime_1.jsx)(ChevronHeader_styled_1.BookingTitle, { children: title }), subTitle && (0, jsx_runtime_1.jsx)(ChevronHeader_styled_1.BookingSteps, { children: subTitle })] })] })) : ((0, jsx_runtime_1.jsxs)(AppHeader_1.default, { children: [(0, jsx_runtime_1.jsx)(react_1.IonButtons, Object.assign({ slot: "start" }, { children: (0, jsx_runtime_1.jsx)(ChevronHeader_styled_1.BackButton, Object.assign({ onClick: onClick }, { children: (0, jsx_runtime_1.jsx)(react_1.IonIcon, { icon: icons_1.chevronBackOutline }) })) })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    flexDirection: 'column',
+                } }, { children: [(0, jsx_runtime_1.jsx)(Skeleton_1.default, { widthPx: 60, heightPx: 16 }), (0, jsx_runtime_1.jsx)(Skeleton_1.default, { widthPx: 92, heightPx: 14 })] }))] }));
+};
+exports.default = ChevronHeader;

package/dist/cjs/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/cjs/lib/ChevronHeader/ChevronHeader.styled.js

@@ -0,0 +1,52 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChevronHeaderTitle = exports.BookingTitle = exports.BookingSteps = exports.BackButton = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+exports.BackButton = styled_components_1.default.button `
+  outline: none;
+  background: transparent;
+  color: #000000;
+  font-size: 20px;
+  padding: 0;
+  margin-left: -8px;
+  border: none;
+`;
+exports.BookingSteps = styled_components_1.default.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;
+`;
+exports.BookingTitle = styled_components_1.default.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;
+`;
+exports.ChevronHeaderTitle = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+`;

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

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var ChevronHeader_1 = require("./ChevronHeader");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChevronHeader_1).default; } });

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

@@ -0,0 +1,47 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_2 = require("@ionic/react");
+const icons_1 = require("ionicons/icons");
+const bucket_svg_1 = require("./bucket.svg");
+const message_svg_1 = require("./message.svg");
+const ConsultationCard_1 = __importStar(require("../ConsultationCard"));
+const CancelSession_style_1 = require("./CancelSession.style");
+const CancelSession = ({ name, avatar, time, timeZone = 'Europe/Kiev', onSubmit, onReschedule, isLoading = false, emptyReasonErrorMessage, locale, translations, }) => {
+    const [isConfirm, setIsConfirm] = (0, react_1.useState)(false);
+    const [message, setMessage] = (0, react_1.useState)('');
+    const [error, setError] = (0, react_1.useState)(false);
+    const handleMessageChange = (0, react_1.useCallback)((e) => {
+        setError(false);
+        setMessage(e.target.value);
+    }, []);
+    if (isConfirm) {
+        return ((0, jsx_runtime_1.jsxs)(CancelSession_style_1.CancelConfirmWrapper, { children: [(0, jsx_runtime_1.jsx)(message_svg_1.ReactComponent, {}), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "confirm-title" }, { children: translations.title })), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("textarea", { className: `confirm-textarea ${error ? 'error' : ''}`, placeholder: translations.placeholder, value: message, onChange: handleMessageChange }), error && emptyReasonErrorMessage && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "error-message" }, { children: emptyReasonErrorMessage })))] }), (0, jsx_runtime_1.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 && (0, jsx_runtime_1.jsx)(react_2.IonSpinner, { name: "crescent" }), translations.cancelBtnLabel] }))] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)(CancelSession_style_1.CancelSessionConfirmWrapper, { children: [(0, jsx_runtime_1.jsx)(bucket_svg_1.ReactComponent, {}), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "cancel-title" }, { children: translations.question })), (0, jsx_runtime_1.jsx)(ConsultationCard_1.default, { type: ConsultationCard_1.ConsultationCardType.FEATURE, name: name, avatar: avatar, time: time, timeZone: timeZone, locale: locale, sessionId: "" }), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "cancel-desc" }, { children: translations.description })), (0, jsx_runtime_1.jsxs)("button", Object.assign({ className: "reschedule-btn", onClick: onReschedule }, { children: [(0, jsx_runtime_1.jsx)(react_2.IonIcon, { icon: icons_1.calendarNumberOutline }), ' ', translations.rescheduleBtnLabel] })), (0, jsx_runtime_1.jsx)("button", Object.assign({ className: "confirm-btn", onClick: () => setIsConfirm(true) }, { children: translations.cancelBtnLabel }))] }));
+};
+exports.default = CancelSession;

package/dist/cjs/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;

package/dist/cjs/lib/Consultations/CancelSession/CancelSession.style.js

@@ -0,0 +1,136 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CancelConfirmWrapper = exports.CancelSessionConfirmWrapper = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+exports.CancelSessionConfirmWrapper = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  row-gap: 24px;
+
+  & .cancel-title {
+    font-weight: 600;
+    font-size: 20px;
+    color: #1d201f;
+  }
+
+  & .cancel-desc {
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 16px;
+    color: #5b5b5b;
+    margin-bottom: 6px;
+  }
+
+  & .reschedule-btn {
+    position: relative;
+    outline: none;
+    margin: 0 0 6px 0;
+    padding: 16px;
+    background: #d6f2f9;
+    border-radius: 10px;
+    font-weight: 600;
+    font-size: 14px;
+    color: #177590;
+
+    & ion-icon {
+      position: absolute;
+      left: 16px;
+      top: 50%;
+      transform: translateY(-50%);
+      font-size: 18px;
+    }
+  }
+
+  & .confirm-btn {
+    outline: none;
+    margin: 0;
+    background: none;
+    width: fit-content;
+    font-weight: 600;
+    font-size: 12px;
+    color: #5b5b5b;
+  }
+`;
+exports.CancelConfirmWrapper = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  row-gap: 24px;
+
+  & .confirm-title {
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 24px;
+    color: #1d201f;
+    margin-top: -8px;
+  }
+
+  & .confirm-textarea {
+    outline: none;
+    background: #ffffff;
+    border: 1px solid #e5e5e5;
+    border-radius: 10px;
+    resize: none;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 16px;
+    color: #1d201f;
+    height: 72px;
+    width: 100%;
+    margin: 0;
+    padding: 10px 12px;
+
+    &::placeholder {
+      color: #c1c1c1;
+    }
+
+    &.error {
+      margin-bottom: 5px;
+      border: 1px solid #c13e18;
+      border-radius: 10px;
+    }
+  }
+
+  & .error-message {
+    font-style: normal;
+    font-weight: 400;
+    font-size: 12px;
+    line-height: 14px;
+
+    color: #c13e18;
+  }
+
+  & .cancel-btn {
+    position: relative;
+    outline: none;
+    border-radius: 10px;
+    font-weight: 600;
+    font-size: 14px;
+    color: #ffffff;
+    margin: 0;
+    padding: 17px;
+
+    &.blue {
+      background-color: #177590;
+    }
+
+    &.red {
+      background-color: #b12631;
+    }
+
+    &:disabled {
+      background: #c1c1c1;
+    }
+
+    & ion-spinner {
+      position: absolute;
+      left: 16px;
+      top: 50%;
+      transform: translateY(-50%);
+      color: #fff;
+      font-size: 24px;
+    }
+  }
+`;

package/dist/cjs/lib/Consultations/CancelSession/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var CancelSession_1 = require("./CancelSession");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(CancelSession_1).default; } });