@expressms/smartapp-ui 1.0.7 → 1.1.1

package/build/main//321/201omponents/Stories/types.d.ts

@@ -2,29 +2,44 @@ export declare enum STORY_BACKGROUND_TYPES {
     color = "color",
     image = "image"
 }
-export type TStoryItem = {
+export declare enum STORY_TYPE {
+    image = "image",
+    video = "video"
+}
+export type TBackgroundSource = {
+    type: 'color' | 'image';
+    value: string;
+};
+type TCommonStoryItem = {
     id: number;
     order: number;
     viewed?: boolean;
+};
+export interface TImageStoryItem extends TCommonStoryItem {
+    type: 'image';
     title: string | null;
     body: string | null;
-    backgroundSource: {
-        type: STORY_BACKGROUND_TYPES;
-        value: string;
-    };
+    backgroundSource: TBackgroundSource;
     button: {
         text: string;
+        textColor?: string;
+        backgroundColor?: string;
         action: () => void;
     } | null;
     image: string | null;
-};
+}
+export interface TVideoStoryItem extends TCommonStoryItem {
+    type: 'video';
+    url: string;
+}
+export type TStoryItem = TImageStoryItem | TVideoStoryItem;
 export type TGroupStories = {
     id: number;
     viewed: boolean;
     stories: TStoryItem[];
 };
 export interface IStoriesProps {
-    platform?: string;
+    platform?: 'web' | 'ios' | 'android';
     fontFamily?: string;
     groupStories: TGroupStories | null;
     allGroupsStories: TGroupStories[];
@@ -32,3 +47,4 @@ export interface IStoriesProps {
     changeGroupStoriesToViewed?: (groupStories: TGroupStories) => void;
     handleCloseGroupStories: () => void;
 }
+export {};

package/build/main//321/201omponents/Stories/types.js

@@ -3,3 +3,8 @@ export var STORY_BACKGROUND_TYPES;
     STORY_BACKGROUND_TYPES["color"] = "color";
     STORY_BACKGROUND_TYPES["image"] = "image";
 })(STORY_BACKGROUND_TYPES || (STORY_BACKGROUND_TYPES = {}));
+export var STORY_TYPE;
+(function (STORY_TYPE) {
+    STORY_TYPE["image"] = "image";
+    STORY_TYPE["video"] = "video";
+})(STORY_TYPE || (STORY_TYPE = {}));

package/build/main//321/201omponents/SyncLoader/SyncLoader.d.ts

@@ -0,0 +1,4 @@
+import { ISyncLoaderProps } from './types';
+import '../../styles/stories.module.scss';
+declare const SyncLoader: ({ isLoading, theme, color, fontFamily, }: ISyncLoaderProps) => import("react/jsx-runtime").JSX.Element | null;
+export default SyncLoader;

package/build/main//321/201omponents/SyncLoader/SyncLoader.js

@@ -0,0 +1,66 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import classNames from 'classnames';
+import Color from 'color';
+import { normal } from 'color-blend';
+import { ReactComponent as LoaderIcon } from '../../assets/icons/loader.svg';
+import { DEFAULT_BLUE_ICON_COLOR, DEFAULT_FONT_FAMILY, THEME } from '../../constants';
+import { getColor } from '../../helpers';
+import '../../styles/stories.module.scss';
+var SyncLoader = function (_a) {
+    var isLoading = _a.isLoading, _b = _a.theme, theme = _b === void 0 ? THEME.default : _b, color = _a.color, _c = _a.fontFamily, fontFamily = _c === void 0 ? DEFAULT_FONT_FAMILY : _c;
+    var isDarkTheme = theme === THEME.dark;
+    var loaderColor = getColor(color, DEFAULT_BLUE_ICON_COLOR);
+    var getBackgroundStyles = function () {
+        var _a = Color(loaderColor).rgb().object(), red = _a.r, green = _a.g, blue = _a.b;
+        var backgroundColorRGBA = { r: red, g: green, b: blue, a: 0.2 };
+        var WHITE_COLOR = { r: 255, g: 255, b: 255, a: 1 };
+        var BLACK_COLOR = { r: 61, g: 61, b: 61, a: 1 };
+        var _b = isDarkTheme
+            ? normal(BLACK_COLOR, backgroundColorRGBA)
+            : normal(WHITE_COLOR, backgroundColorRGBA), r = _b.r, g = _b.g, b = _b.b, a = _b.a;
+        return { background: "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(a, ")") };
+    };
+    useEffect(function () {
+        var timerId;
+        var dots = document.querySelectorAll('.smartapp-sync-loader__text--dots__dot');
+        var animationEndFunction = function () {
+            dots.forEach(function (dot) { return dot.style.display = 'none'; });
+            timerId = setTimeout(function () {
+                dots.forEach(function (dot) { return dot.style.display = 'unset'; });
+            }, 150);
+        };
+        if (isLoading) {
+            dots[0].addEventListener('animationend', animationEndFunction);
+        }
+        return function () {
+            clearTimeout(timerId);
+            isLoading && dots[0].removeEventListener('animationend', animationEndFunction);
+        };
+    }, [isLoading]);
+    if (!isLoading) {
+        return null;
+    }
+    return (_jsxs("div", __assign({ className: "smartapp-sync-loader", style: getBackgroundStyles() }, { children: [_jsx(LoaderIcon, { className: "smartapp-sync-loader__icon", style: { color: loaderColor } }), _jsxs("div", __assign({ style: { fontFamily: "".concat(fontFamily, ", sans-serif") }, className: classNames({ 'smartapp-sync-loader__text': true, 'smartapp-sync-loader__text--dark': isDarkTheme }) }, { children: ["\u041E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u0435", _jsx("div", __assign({ className: "smartapp-sync-loader__text--dots" }, { children: __spreadArray([], Array(3), true).map(function (_, index) { return _jsx("div", __assign({ className: "smartapp-sync-loader__text--dots__dot" }, { children: "." }), index); }) }))] }))] })));
+};
+export default SyncLoader;

package/build/main//321/201omponents/SyncLoader/index.d.ts

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

package/build/main//321/201omponents/SyncLoader/index.js

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

package/build/main//321/201omponents/SyncLoader/types.d.ts

@@ -0,0 +1,6 @@
+export interface ISyncLoaderProps {
+    isLoading: boolean;
+    theme?: 'default' | 'dark';
+    color?: string;
+    fontFamily?: string;
+}

package/build/main//321/201omponents/SyncLoader/types.js

@@ -0,0 +1 @@
+export {};

package/build/main//321/201omponents/index.d.ts

@@ -18,3 +18,4 @@ export { default as Profile } from './Profile';
 export { default as Switcher } from './Switcher';
 export { default as Toggle } from './Toggle';
 export { default as Stories } from './Stories';
+export { default as SyncLoader } from './SyncLoader';

package/build/main//321/201omponents/index.js

@@ -18,3 +18,4 @@ export { default as Profile } from './Profile';
 export { default as Switcher } from './Switcher';
 export { default as Toggle } from './Toggle';
 export { default as Stories } from './Stories';
+export { default as SyncLoader } from './SyncLoader';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expressms/smartapp-ui",
-  "version": "1.0.7",
+  "version": "1.1.1",
   "description": "SmartApp UI library",
   "license": "MIT",
   "main": "build/main/index.js",
@@ -22,6 +22,7 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
+    "@types/color": "^3.0.6",
     "@types/jest": "^27.5.2",
     "@types/node": "^16.18.11",
     "@types/react": "^18.0.27",
@@ -41,6 +42,8 @@
     "camelcase": "^6.2.1",
     "case-sensitive-paths-webpack-plugin": "^2.4.0",
     "classnames": "^2.3.2",
+    "color": "^4.2.3",
+    "color-blend": "^4.0.0",
     "copyfiles": "^2.4.1",
     "css-loader": "^6.5.1",
     "css-minimizer-webpack-plugin": "^3.2.0",