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

package/dist/cjs/lib2/shared/types/index.js

@@ -0,0 +1,27 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ratingCircleTypes"), exports);
+__exportStar(require("./specialistPaymentTypes"), exports);
+__exportStar(require("./iconProps"), exports);
+__exportStar(require("./common"), exports);
+__exportStar(require("./getCountryKeyByName"), exports);
+__exportStar(require("./responseFileType"), exports);
+__exportStar(require("./onBoardingFlow.type"), exports);
+__exportStar(require("./specialistTypes"), exports);
+__exportStar(require("./review"), exports);
+__exportStar(require("./contract"), exports);
+__exportStar(require("./user"), exports);

package/dist/cjs/lib2/shared/types/onBoardingFlow.type.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OnBoardingScreenOptions = exports.OnBoardingScreenStyleOptions = exports.ConditionRulesType = void 0;
+var ConditionRulesType;
+(function (ConditionRulesType) {
+    ConditionRulesType["IS"] = "is";
+})(ConditionRulesType = exports.ConditionRulesType || (exports.ConditionRulesType = {}));
+var OnBoardingScreenStyleOptions;
+(function (OnBoardingScreenStyleOptions) {
+    OnBoardingScreenStyleOptions["DARK"] = "DARK";
+    OnBoardingScreenStyleOptions["LIGHT"] = "LIGHT";
+})(OnBoardingScreenStyleOptions = exports.OnBoardingScreenStyleOptions || (exports.OnBoardingScreenStyleOptions = {}));
+var OnBoardingScreenOptions;
+(function (OnBoardingScreenOptions) {
+    OnBoardingScreenOptions["START"] = "START";
+    OnBoardingScreenOptions["MULTI_SELECT"] = "MULTI_SELECT";
+    OnBoardingScreenOptions["SINGLE_SELECT"] = "SINGLE_SELECT";
+    OnBoardingScreenOptions["INFO"] = "INFO";
+    OnBoardingScreenOptions["LOADER"] = "LOADER";
+    OnBoardingScreenOptions["REVIEWS"] = "REVIEWS";
+})(OnBoardingScreenOptions = exports.OnBoardingScreenOptions || (exports.OnBoardingScreenOptions = {}));

package/dist/cjs/lib2/shared/types/ratingCircleTypes.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CircleRatingSize = void 0;
+var CircleRatingSize;
+(function (CircleRatingSize) {
+    CircleRatingSize["S"] = "S";
+    CircleRatingSize["M"] = "M";
+    CircleRatingSize["L"] = "L";
+})(CircleRatingSize = exports.CircleRatingSize || (exports.CircleRatingSize = {}));

package/dist/cjs/lib2/shared/types/responseFileType.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib2/shared/types/review.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib2/shared/types/specialistPaymentTypes.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib2/shared/types/specialistTypes.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib2/shared/types/user.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib2/shared/ui/AlertCard/AlertCard.js

@@ -0,0 +1,49 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const styles_1 = require("./styles");
+const Typography_1 = require("../Typography");
+const Button_v2_1 = require("../Button_v2");
+const AlertCard = React.forwardRef(function AlertCard(props, ref) {
+    const { variant, size = 'XY4', title, text, icon: IconComponent, button, children, className } = props, restProps = __rest(props, ["variant", "size", "title", "text", "icon", "button", "children", "className"]);
+    const cardStyles = React.useMemo(() => {
+        return (0, styles_1.alertCardStyles)({ size, className, variant });
+    }, [variant, size, className]);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: `${cardStyles} flex flex-row items-center justify-start` }, restProps, { children: [IconComponent && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "flex-shrink-0 text-2xl mr-4 items-center" }, { children: IconComponent }))), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-col flex-grow" }, { children: [!!title && ((0, jsx_runtime_1.jsx)(Typography_1.Typography, Object.assign({ variant: Typography_1.TypographyVariantsEnum.Text15Semi }, { children: title }))), !!text && ((0, jsx_runtime_1.jsx)(Typography_1.Typography, Object.assign({ className: title ? 'mt-1' : '', variant: Typography_1.TypographyVariantsEnum.Text13Regular150 }, { children: text }))), button && ((0, jsx_runtime_1.jsx)(Button_v2_1.Button_v2, Object.assign({ fill: "outline", className: `flex fit-w justify-center items-center border-color-black rounded-[40px] w-fit !mt-3 ${button.className || ''}`, onClick: button.onClick }, { children: button.text })))] })), children] })));
+});
+exports.default = React.memo(AlertCard);

package/dist/cjs/lib2/shared/ui/AlertCard/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.AlertCard = void 0;
+var AlertCard_1 = require("./AlertCard");
+Object.defineProperty(exports, "AlertCard", { enumerable: true, get: function () { return __importDefault(AlertCard_1).default; } });

package/dist/cjs/lib2/shared/ui/AlertCard/styles.d.ts

@@ -1,78 +1 @@
-export declare const alertCardStyles: import("tailwind-variants").TVReturnType<{
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}, undefined, "rounded-[30px]", import("tailwind-variants/dist/config").TVConfig<{
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}, {
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}>, {
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}, undefined, "rounded-[30px]", import("tailwind-variants/dist/config").TVConfig<{
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}, {
-    variant: {
-        yellow: "bg-color-info-light-orange";
-        blue: "bg-color-info-light-blue";
-        transparent: "bg-transparent border border-color-black !border-opacity-35";
-    };
-    size: {
-        XY4: "p-4";
-        X5Y4: "px-5 py-4";
-        XY5: "p-5";
-    };
-}>, unknown, unknown, undefined>>;
+export declare const alertCardStyles: any;

package/dist/cjs/lib2/shared/ui/AlertCard/styles.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.alertCardStyles = void 0;
+const tailwind_variants_1 = require("tailwind-variants");
+exports.alertCardStyles = (0, tailwind_variants_1.tv)({
+    base: 'rounded-[30px]',
+    variants: {
+        variant: {
+            yellow: 'bg-color-info-light-orange',
+            blue: 'bg-color-info-light-blue',
+            transparent: 'bg-transparent border border-color-black !border-opacity-35',
+        },
+        size: {
+            XY4: 'p-4',
+            X5Y4: 'px-5 py-4',
+            XY5: 'p-5',
+        },
+    },
+});

package/dist/cjs/lib2/shared/ui/AlertCard/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib2/shared/ui/AppFooter_v2/AppFooter_v2.js

@@ -0,0 +1,14 @@
+"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 = __importDefault(require("react"));
+const AppFooter_v2_style_1 = require("./AppFooter_v2.style");
+const react_2 = require("@ionic/react");
+const classnames_1 = __importDefault(require("classnames"));
+const AppFooter_v2 = ({ children, transparent, bottomSaveArea = true, borderTop = false, style, toolbarStyle, className = '', }) => {
+    return ((0, jsx_runtime_1.jsx)(AppFooter_v2_style_1.AppFooterStyled, Object.assign({ mode: 'ios', className: (0, classnames_1.default)('ion-no-border', { 'border-t-[1px] border-t-solid border-t-skeleton-color': borderTop }, { transparent: transparent }, { bottomSaveArea: bottomSaveArea }, className), style: style }, { children: (0, jsx_runtime_1.jsx)(react_2.IonToolbar, Object.assign({ mode: "ios", style: toolbarStyle }, { children: children })) })));
+};
+exports.default = react_1.default.memo(AppFooter_v2);

package/dist/cjs/lib2/shared/ui/AppFooter_v2/AppFooter_v2.style.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export declare const AppFooterStyled: 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>;
+export declare const AppFooterStyled: 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>>;

package/dist/cjs/lib2/shared/ui/AppFooter_v2/AppFooter_v2.style.js

@@ -0,0 +1,47 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppFooterStyled = void 0;
+const react_1 = require("@ionic/react");
+const styled_components_1 = __importDefault(require("styled-components"));
+exports.AppFooterStyled = (0, styled_components_1.default)(react_1.IonFooter) `
+  background: #ffffff !important;
+  display: flex;
+  justify-content: center;
+
+  ion-toolbar {
+    --background: #ffffff !important;
+    --padding-bottom: 10px;
+    --padding-top: 10px;
+    --padding-start: 20px;
+    --padding-end: 20px;
+    --border-width: 0;
+    max-width: ${(0, react_1.isPlatform)('desktop') || (0, react_1.isPlatform)('tablet')
+    ? '410px'
+    : '100%'};
+    padding: 0 !important;
+  }
+
+  &.bottomSaveArea {
+    ion-toolbar {
+      --padding-bottom: calc(10px + var(--ion-safe-area-bottom));
+    }
+  }
+
+  .controls {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 20px;
+  }
+
+  &.transparent {
+    background: transparent;
+
+    ion-toolbar {
+      --background: transparent;
+    }
+  }
+`;

package/dist/cjs/lib2/shared/ui/AppFooter_v2/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.AppFooter_v2 = void 0;
+var AppFooter_v2_1 = require("./AppFooter_v2");
+Object.defineProperty(exports, "AppFooter_v2", { enumerable: true, get: function () { return __importDefault(AppFooter_v2_1).default; } });

package/dist/cjs/lib2/shared/ui/AppHeader_v2/AppHeader_v2.d.ts

@@ -1,10 +1,10 @@
-import { CSSProperties, FC } from 'react';
-type AppHeaderProps = {
+import React, { CSSProperties, FC } from 'react';
+type AppHeaderProps = React.PropsWithChildren<{
     fullwidth?: boolean;
     className?: string;
     style?: CSSProperties;
     toolbarClassName?: string;
     toolbarStyle?: CSSProperties;
-};
+}>;
 declare const AppHeader_v2: FC<AppHeaderProps>;
 export default AppHeader_v2;

package/dist/cjs/lib2/shared/ui/AppHeader_v2/AppHeader_v2.js

@@ -0,0 +1,14 @@
+"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_v2_module_css_1 = __importDefault(require("./AppHeader_v2.module.css"));
+const classnames_1 = __importDefault(require("classnames"));
+const AppHeader_v2 = ({ fullwidth = false, className, style, toolbarClassName, toolbarStyle, children, }) => {
+    const isNotMobile = !fullwidth && ((0, react_1.isPlatform)('desktop') || (0, react_1.isPlatform)('tablet'));
+    return ((0, jsx_runtime_1.jsx)(react_1.IonHeader, Object.assign({ className: (0, classnames_1.default)(`bg-white shadow-none flex justify-center`, className, AppHeader_v2_module_css_1.default.appHeaderContainer), style: style }, { children: (0, jsx_runtime_1.jsx)(react_1.IonToolbar, Object.assign({ className: (0, classnames_1.default)(`${isNotMobile ? 'max-w-container' : 'max-w-full'} ${AppHeader_v2_module_css_1.default.appHeaderToolbar}`, toolbarClassName), style: toolbarStyle }, { children: children })) })));
+};
+exports.default = AppHeader_v2;

package/dist/cjs/lib2/shared/ui/AppHeader_v2/AppHeader_v2.stories.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+const index_1 = require("./index");
+const meta = {
+    title: 'v2/Shared/AppHeader',
+    component: index_1.AppHeader_v2,
+    argTypes: {
+        fullwidth: {
+            control: 'boolean',
+            description: 'Flag to indicate if the header should take up the full width.',
+        },
+        className: {
+            control: 'text',
+            description: 'Additional class names for styling.',
+        },
+    },
+};
+exports.default = meta;
+exports.Default = {
+    args: {
+        children: 'App Header',
+    },
+};

package/dist/cjs/lib2/shared/ui/AppHeader_v2/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.AppHeader_v2 = void 0;
+var AppHeader_v2_1 = require("./AppHeader_v2");
+Object.defineProperty(exports, "AppHeader_v2", { enumerable: true, get: function () { return __importDefault(AppHeader_v2_1).default; } });

package/dist/cjs/lib2/shared/ui/Avatar_v2/Avatar_v2.js

@@ -0,0 +1,55 @@
+"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 = __importStar(require("react"));
+const react_2 = require("@ionic/react");
+const Avatar_v2_style_1 = require("./Avatar_v2.style");
+const user_svg_1 = require("./user.svg");
+const Skeleton_v2_1 = require("../Skeleton_v2");
+const Avatar_v2 = ({ variant = 'small', round = 'circle', className, src, alt, showSkeleton, onClick, }) => {
+    const [isLoading, setIsLoading] = react_1.default.useState(true);
+    const [isError, setIsError] = react_1.default.useState(false);
+    (0, react_1.useEffect)(() => {
+        if (!src && !showSkeleton) {
+            setIsError(true);
+        }
+        else {
+            setIsError(false);
+        }
+    }, [src, showSkeleton]);
+    const handleAvatarError = (0, react_1.useCallback)(() => {
+        setIsError(true);
+        setIsLoading(false);
+    }, []);
+    return ((0, jsx_runtime_1.jsxs)(Avatar_v2_style_1.AvatarWrapper, Object.assign({ className: `${variant} ${isError && 'error'}`, round: round, isLoading: isLoading, onClick: onClick }, { children: [(isLoading || showSkeleton) && !isError && ((0, jsx_runtime_1.jsx)(Skeleton_v2_1.Skeleton_v2, { className: `avatar-loader` })), isError && (0, jsx_runtime_1.jsx)(user_svg_1.ReactComponent, { className: 'empty-icon' }), !isError && ((0, jsx_runtime_1.jsx)(react_2.IonImg, { className: `avatar-img ${className}`, src: src, alt: alt, onIonImgDidLoad: () => {
+                    setIsError(false);
+                    setIsLoading(false);
+                }, onIonError: handleAvatarError, onIonImgWillLoad: () => {
+                    setIsError(false);
+                    setIsLoading(true);
+                } }))] })));
+};
+exports.default = react_1.default.memo(Avatar_v2);

package/dist/cjs/lib2/shared/ui/Avatar_v2/Avatar_v2.style.d.ts

@@ -1,9 +1,10 @@
+/// <reference types="react" />
 export type AvatarRoundVariants = 'circle' | 'drop' | 'small';
 export declare function getBorderRadius(props: {
     round: AvatarRoundVariants;
 }): string;
-export declare const AvatarWrapper: import("styled-components").StyledComponent<"div", any, {
+export declare const AvatarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     round: AvatarRoundVariants;
     isLoading: boolean;
     border: string | boolean;
-}, never>;
+}>> & string;

package/dist/cjs/lib2/shared/ui/Avatar_v2/Avatar_v2.style.js

@@ -0,0 +1,98 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AvatarWrapper = exports.getBorderRadius = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+function getBorderRadius(props) {
+    switch (props === null || props === void 0 ? void 0 : props.round) {
+        case 'circle':
+            return '50%';
+        case 'drop':
+            return '00% 50% 50% 50%;';
+        default:
+            return '50%';
+    }
+}
+exports.getBorderRadius = getBorderRadius;
+function getBackground(props) {
+    return props.round === 'drop' && !props.isLoading ? '#212121' : undefined;
+}
+exports.AvatarWrapper = styled_components_1.default.div `
+  border-radius: ${getBorderRadius};
+  background-color: ${getBackground};
+  flex-grow: 0;
+  flex-shrink: 0;
+  overflow: hidden;
+  position: relative;
+  border: 1px solid rgb(var(--borders-divider) / 0.1);
+  background-clip: padding-box;
+
+  &.small {
+    width: 40px;
+    height: 40px;
+  }
+
+  &.error {
+    background-color: #28bfa1;
+  }
+
+  .avatar-loader {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  .empty-icon {
+    color: #fff;
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+  }
+
+  .avatar-img {
+    width: 100%;
+    height: 100%;
+
+    &::part(image) {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+  }
+
+  &.medium {
+    width: 72px;
+    height: 72px;
+
+    .empty-icon {
+      width: 43px;
+      height: 43px;
+    }
+  }
+
+  &.smaller {
+    width: 20px;
+    height: 20px;
+
+    .empty-icon {
+      width: 10px;
+      height: 10px;
+    }
+  }
+
+  &.large {
+    width: 80px;
+    height: 80px;
+
+    .empty-icon {
+      width: 48px;
+      height: 48px;
+    }
+  }
+`;

package/dist/cjs/lib2/shared/ui/Avatar_v2/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.Avatar_v2 = void 0;
+var Avatar_v2_1 = require("./Avatar_v2");
+Object.defineProperty(exports, "Avatar_v2", { enumerable: true, get: function () { return __importDefault(Avatar_v2_1).default; } });

package/dist/cjs/lib2/shared/ui/Badge/Badge.js

@@ -0,0 +1,57 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const styles_1 = require("./styles");
+const icons_1 = require("../../assets/icons");
+const react_1 = require("react");
+const Badge = React.forwardRef(function Badge(props, ref) {
+    const { variant, size = 'S', type = 'default', children, className, iconType } = props, restProps = __rest(props, ["variant", "size", "type", "children", "className", "iconType"]);
+    const badgeStyles = React.useMemo(() => {
+        return (0, styles_1.badge)({ type, size, className, variant });
+    }, [variant, size, type, className]);
+    const icon = (0, react_1.useMemo)(() => {
+        switch (iconType) {
+            case 'check':
+                return (0, jsx_runtime_1.jsx)(icons_1.IconCheck, { className: "w-4 h-4" });
+            default:
+                return null;
+        }
+    }, [iconType]);
+    return ((0, jsx_runtime_1.jsxs)("span", Object.assign({ ref: ref, className: badgeStyles }, restProps, { children: [icon, children] })));
+});
+exports.default = React.memo(Badge);