@ludo.ninja/components 0.5.0 → 1.0.0

package/dist/modules/user/store.jsx

@@ -0,0 +1,75 @@
+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);
+};
+import { createProvider } from 'next-zustand';
+import { shallow } from 'zustand/shallow';
+import { ProfileEntity } from '@ludo.ninja/core';
+var initialUserExp = {
+    xps: 0,
+    level: 1,
+    levelMaxXps: 0,
+    levelMinXps: 0,
+};
+var creators = createProvider()(function (setState) { return ({
+    user: null,
+    isSignedIn: false,
+    setUser: function (user) {
+        setState({ user: user, isSignedIn: !!user });
+    },
+    userExp: initialUserExp,
+    setUserExp: function (userExp) {
+        setState({ userExp: userExp });
+    },
+    resetUserExp: function () {
+        setState({ userExp: initialUserExp });
+    },
+    isLoadingExp: false,
+    setIsLoadingExp: function (isLoadingExp) {
+        setState({ isLoadingExp: isLoadingExp });
+    },
+    errorExp: undefined,
+    setErrorExp: function (errorExp) {
+        setState({ errorExp: errorExp });
+    },
+    profileObject: null,
+    updateProfileData: function (profile) {
+        setState(function (prev) {
+            var _a;
+            var newProfileObject = __assign(__assign(__assign({}, prev.profileObject), profile), { social: __assign(__assign({}, (_a = prev.profileObject) === null || _a === void 0 ? void 0 : _a.social), profile.social) });
+            return {
+                profileObject: newProfileObject,
+                profileData: new ProfileEntity(newProfileObject),
+            };
+        });
+    },
+    profileData: null,
+    setProfileData: function (profileObject) {
+        if (profileObject) {
+            setState({
+                profileData: new ProfileEntity(profileObject),
+                profileObject: profileObject,
+            });
+        }
+        else {
+            setState({ profileData: null, profileObject: null });
+        }
+    },
+    isLoadingProfileData: true,
+    setIsLoadingProfileData: function (isLoadingProfileData) {
+        setState({ isLoadingProfileData: isLoadingProfileData });
+    },
+    inviteCodes: [],
+    setInviteCodes: function (inviteCodes) {
+        setState({ inviteCodes: inviteCodes });
+    },
+}); }, shallow);
+export var UserProvider = creators.Provider;
+export var useUserStore = creators.getUseStore();

package/dist/modules/virtuoso/VirtuosoPageBuilder.jsx

@@ -0,0 +1,127 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import React, { useRef } from 'react';
+import { Virtuoso } from 'react-virtuoso';
+import styled from 'styled-components';
+import { adaptiveValueCalc, getAdaptiveValue, } from '@ludo.ninja/ui/build/utils/4k';
+import { useVirtuosoInitialScroll } from '@/modules/sessionScroll/useVirtuosoInitialScroll';
+import { VirtuosoToTopBtn, useVirtuosoToTopBtnInitialize, } from '@/modules/virtuoso/VirtuosoToTopBtn';
+import { useSubscribeVirtuosoScrollToHeader } from '@/modules/virtuoso/useSubscribeVirtuosoScrollToHeader';
+import { useVirtuosoData } from '@/modules/virtuoso/useVirtuosoData';
+import { ScreenWidth, mediaQuery } from '@/styles/ScreenWidth';
+import { ProfileSkeleton } from '@/components/profile/profileSkeleton';
+import CardsError from '@/system/CardsHolderWithSkeleton/CardsHolder/CardsError';
+import CardsNoResults from '@/system/CardsHolderWithSkeleton/CardsHolder/CardsNoResults';
+import { CardSkeleton } from '@/system/CardsHolderWithSkeleton/CardsHolder/CardsSkeleton';
+import CardsHolderLoader from '@/system/CardsHolderWithSkeleton/CardsHolderLoader';
+var SCardsRow = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  width: 1080px;\n  margin: 0 auto;\n\n  ", " {\n    width: 704px;\n  }\n\n  ", " {\n    width: 320px;\n  }\n  ", " {\n    width: ", ";\n  }\n"], ["\n  display: flex;\n  width: 1080px;\n  margin: 0 auto;\n\n  ", " {\n    width: 704px;\n  }\n\n  ", " {\n    width: 320px;\n  }\n  ", " {\n    width: ", ";\n  }\n"])), mediaQuery.maxWidthTablet, mediaQuery.mobile, mediaQuery.minWidthFourK, adaptiveValueCalc(1080));
+export var VirtuosoPageBuilder = function (_a) {
+    var activeTab = _a.activeTab, isMobile = _a.isMobile, creations = _a.creations, windowDimensions = _a.windowDimensions, isLoading = _a.isLoading, error = _a.error, refetchQuery = _a.refetchQuery, loadMore = _a.loadMore, renderCreation = _a.renderCreation, notFoundText = _a.notFoundText, isNextLoading = _a.isNextLoading, headerSlot = _a.headerSlot, isProfileCards = _a.isProfileCards;
+    var onScroll = useSubscribeVirtuosoScrollToHeader().onScroll;
+    var virtuoso = useRef(null);
+    var virtuosoToTopBtnInitialize = useVirtuosoToTopBtnInitialize();
+    var _b = useVirtuosoData({
+        activeTab: activeTab,
+        isMobile: isMobile,
+        creations: creations,
+        isProfileCards: !!windowDimensions &&
+            windowDimensions.windowWidth < 1200 &&
+            isProfileCards,
+    }), virtuosoData = _b.virtuosoData, placeholderData = _b.placeholderData;
+    var _c = useVirtuosoInitialScroll({
+        virtuoso: virtuoso,
+        virtuosoData: virtuosoData,
+        activeTab: activeTab,
+    }), updateScroll = _c.updateScroll, setScrollTop = _c.setScrollTop;
+    var virtuosoBody = (function () {
+        var getGapCards = function () {
+            var width = windowDimensions === null || windowDimensions === void 0 ? void 0 : windowDimensions.windowWidth;
+            if (width && width < 768)
+                return 12;
+            if (width && width < 1200)
+                return 16;
+            if (width && width >= ScreenWidth.FOUR_K_MIN) {
+                return getAdaptiveValue({
+                    windowWidth: width,
+                    currentSize: 24,
+                });
+            }
+            return 24;
+        };
+        if (isLoading) {
+            return {
+                totalCount: placeholderData.length,
+                itemContent: function (index) {
+                    return (<SCardsRow style={{
+                            paddingBottom: (function () {
+                                if (index === virtuosoData.creationPacks.length - 1) {
+                                    var width = windowDimensions === null || windowDimensions === void 0 ? void 0 : windowDimensions.windowWidth;
+                                    if (width && width < 768)
+                                        return 20;
+                                    if (width && width < 1200)
+                                        return 32;
+                                }
+                                return getGapCards();
+                            })(),
+                            gap: getGapCards(),
+                        }}>
+              {placeholderData[index].map(function (_, ind) {
+                            return isProfileCards ? (<ProfileSkeleton key={ind}/>) : (<CardSkeleton key={ind}/>);
+                        })}
+            </SCardsRow>);
+                },
+            };
+        }
+        if (error) {
+            return {
+                totalCount: 1,
+                itemContent: function () {
+                    return <CardsError refetch={refetchQuery}/>;
+                },
+            };
+        }
+        if (notFoundText && virtuosoData.creations.length === 0) {
+            return {
+                totalCount: 1,
+                itemContent: function () {
+                    return <CardsNoResults noFoundText={notFoundText}/>;
+                },
+            };
+        }
+        return {
+            totalCount: virtuosoData.creationPacks.length,
+            itemContent: function (index) {
+                var data = virtuosoData.creationPacks[index];
+                return (<SCardsRow style={{
+                        paddingBottom: (function () {
+                            if (index === virtuosoData.creationPacks.length - 1) {
+                                var width = windowDimensions === null || windowDimensions === void 0 ? void 0 : windowDimensions.windowWidth;
+                                if (width && width < 768)
+                                    return 20;
+                                if (width && width < 1200)
+                                    return 32;
+                            }
+                            return getGapCards();
+                        })(),
+                        gap: getGapCards(),
+                    }} onClick={function () { return updateScroll(index); }}>
+            {data.map(renderCreation)}
+          </SCardsRow>);
+            },
+        };
+    })();
+    return (<>
+      <Virtuoso ref={virtuoso} style={{ height: 'var(--app-height)' }} onScroll={function (e) {
+            setScrollTop(e.currentTarget.scrollTop);
+            onScroll(e.currentTarget.scrollTop);
+            virtuosoToTopBtnInitialize.onScroll(e.currentTarget.scrollTop);
+        }} totalCount={virtuosoBody.totalCount} endReached={loadMore} overscan={200} itemContent={virtuosoBody.itemContent} components={{
+            Header: function () { return headerSlot; },
+            Footer: function () { return (isNextLoading ? <CardsHolderLoader /> : null); },
+        }}/>
+      {virtuosoToTopBtnInitialize.isShowBtn && (<VirtuosoToTopBtn virtuoso={virtuoso}/>)}
+    </>);
+};
+var templateObject_1;

package/dist/modules/virtuoso/VirtuosoToTopBtn.jsx

@@ -0,0 +1,34 @@
+import { useRef, useState } from 'react';
+import { ToTopBtnWithCustomHandler } from '@/components/toTopBtn';
+export var useVirtuosoToTopBtnInitialize = function () {
+    var _a = useState(false), isShowBtn = _a[0], setIsShowBtn = _a[1];
+    var oldScrollY = useRef(0);
+    var offsetPixels = 600;
+    return {
+        isShowBtn: isShowBtn,
+        onScroll: function (scrollY) {
+            if (scrollY > offsetPixels) {
+                if (oldScrollY.current > scrollY) {
+                    setIsShowBtn(true);
+                }
+                oldScrollY.current = scrollY;
+            }
+            else {
+                setIsShowBtn(false);
+                oldScrollY.current = offsetPixels;
+            }
+        },
+    };
+};
+export var VirtuosoToTopBtn = function (_a) {
+    var virtuoso = _a.virtuoso;
+    var handleClickFunction = function () {
+        var _a;
+        (_a = virtuoso.current) === null || _a === void 0 ? void 0 : _a.scrollToIndex({
+            index: 0,
+            behavior: 'smooth',
+            align: 'end',
+        });
+    };
+    return (<ToTopBtnWithCustomHandler handleClickFunction={handleClickFunction}/>);
+};

package/dist/modules/virtuoso/index.js

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

package/dist/modules/virtuoso/types.js

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

package/dist/modules/virtuoso/useSubscribeVirtuosoScrollToHeader.js

@@ -0,0 +1,23 @@
+import { useRef } from 'react';
+export var useSubscribeVirtuosoScrollToHeader = function () {
+    var lastScrollY = useRef(0);
+    var scrollDirection = useRef('up');
+    return {
+        onScroll: function (scrollY) {
+            var direction = scrollY > lastScrollY.current ? 'down' : 'up';
+            if (direction !== scrollDirection.current &&
+                (scrollY - lastScrollY.current > 5 ||
+                    scrollY - lastScrollY.current < -5)) {
+                scrollDirection.current = direction;
+                var header = document.body.querySelector('header');
+                if (header) {
+                    if (!header.classList.contains(direction)) {
+                        header.classList.remove(direction === 'up' ? 'down' : 'up');
+                        header.classList.add(direction);
+                    }
+                }
+            }
+            lastScrollY.current = scrollY > 0 ? scrollY : 0;
+        },
+    };
+};

package/dist/modules/virtuoso/useVirtuosoData.js

@@ -0,0 +1,46 @@
+import { useMemo } from 'react';
+import { getPageSize } from '@/utils/getPageSizeAssets';
+export var useVirtuosoData = function (_a) {
+    var activeTab = _a.activeTab, creations = _a.creations, isMobile = _a.isMobile, isThreeColumn = _a.isThreeColumn, isProfileCards = _a.isProfileCards;
+    var virtuosoData = useMemo(function () {
+        var columnCount = isMobile ? 2 : isThreeColumn ? 3 : 4;
+        if (isProfileCards) {
+            columnCount = isMobile ? 1 : 2;
+        }
+        var creationPacks = [];
+        var indexPack = 0;
+        creations.forEach(function (creation) {
+            if (!creationPacks[indexPack]) {
+                creationPacks[indexPack] = [];
+            }
+            creationPacks[indexPack].push(creation);
+            if (creationPacks[indexPack].length >= columnCount) {
+                indexPack++;
+            }
+        });
+        return { creationPacks: creationPacks, creations: creations };
+    }, [isMobile, creations, isProfileCards]);
+    var placeholderData = useMemo(function () {
+        var columnCount = isMobile ? 2 : isThreeColumn ? 3 : 4;
+        var creationPacks = [[]];
+        var indexPack = 0;
+        Array.from({
+            length: getPageSize({
+                scrollTab: activeTab === null || activeTab === void 0 ? void 0 : activeTab.value,
+            }),
+        }).forEach(function (_, index) {
+            if (!creationPacks[indexPack]) {
+                creationPacks[indexPack] = [];
+            }
+            creationPacks[indexPack].push(index);
+            if (creationPacks[indexPack].length >= columnCount) {
+                indexPack++;
+            }
+        });
+        return creationPacks;
+    }, [isMobile]);
+    return {
+        virtuosoData: virtuosoData,
+        placeholderData: placeholderData,
+    };
+};

package/dist/pages/index.jsx

@@ -0,0 +1,12 @@
+import Head from 'next/head';
+export default function Home() {
+    return (<>
+      <Head>
+        <title>Create Next App</title>
+        <meta name="description" content="Generated by create next app"/>
+        <meta name="viewport" content="width=device-width, initial-scale=1"/>
+        <link rel="icon" href="/favicon.ico"/>
+      </Head>
+      <div>Hello</div>
+    </>);
+}

package/dist/store/index.js

@@ -0,0 +1,9 @@
+import { createProvider } from 'next-zustand';
+var creators = createProvider()(function ( /*setState*/) { return ({
+    isMobile: false,
+    // setIsMobile: (isMobile) => {
+    //   setState({ isMobile });
+    // },
+}); });
+export var useSSRStore = creators.getUseStore();
+export var SSRProvider = creators.Provider;

package/dist/store/media/index.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 { shallow } from 'zustand/shallow';
+import { createWithEqualityFn } from 'zustand/traditional';
+export var useMediaStore = createWithEqualityFn()(function (setState) { return ({
+    audioTracks: [],
+    setAudioTracks: function (audioTracks) {
+        setState({ audioTracks: audioTracks });
+    },
+    playAudioTrack: function (audioSrc) {
+        setState(function (prevStore) {
+            var tracks = prevStore.audioTracks;
+            var ifExist = tracks.some(function (track) {
+                return track.audioSrc === audioSrc;
+            });
+            if (!ifExist) {
+                var newTracks = __spreadArray([], tracks, true).map(function (track) {
+                    track.playing = false;
+                    track.audio.currentTime = 0;
+                    return track;
+                });
+                return __assign(__assign({}, prevStore), { audioTracks: __spreadArray(__spreadArray([], newTracks, true), [
+                        {
+                            audioSrc: audioSrc,
+                            audio: new Audio(audioSrc),
+                            playing: true,
+                        },
+                    ], false) });
+            }
+            else {
+                return __assign(__assign({}, prevStore), { audioTracks: __spreadArray([], tracks, true).map(function (track) {
+                        track.playing = track.audioSrc === audioSrc;
+                        track.audio.currentTime = 0;
+                        return track;
+                    }) });
+            }
+        });
+    },
+    pauseAudioTrack: function (audioSrc) {
+        setState(function (prevStore) { return (__assign(__assign({}, prevStore), { audioTracks: __spreadArray([], prevStore.audioTracks, true).map(function (track) {
+                if (track.audioSrc === audioSrc) {
+                    track.playing = false;
+                    track.audio.currentTime = 0;
+                }
+                return track;
+            }) })); });
+    },
+}); }, shallow);

package/dist/store/media/types.js

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

package/dist/store/ui/index.js

@@ -0,0 +1,164 @@
+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 __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());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+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 { shallow } from 'zustand/shallow';
+import { createWithEqualityFn } from 'zustand/traditional';
+import { ThemeEnum } from '@ludo.ninja/core';
+import { createNotificationWithId } from '@ludo.ninja/ui/build/modules/notifications/createNotificationWithId';
+import { eventsTypes, sendEventToExtension } from '@ludo.ninja/utils';
+import { rootAddOverflow, rootRemoveOverflow } from '@ludo.ninja/utils';
+import { lightTheme } from '@/system/theme';
+import { builderModal } from './utils';
+export var useUiStore = createWithEqualityFn()(function (setState) { return (__assign(__assign(__assign({ 
+    //theme
+    theme: lightTheme, toggleTheme: function (theme, themeName) {
+        setState({ theme: theme });
+        window.localStorage.setItem('theme', themeName);
+        if (themeName === ThemeEnum.dark) {
+            document.body.classList.add('dark-theme');
+        }
+        else {
+            document.body.classList.remove('dark-theme');
+        }
+    }, 
+    //notifications
+    notifications: [], addNotification: function (content) { return __awaiter(void 0, void 0, void 0, function () {
+        var isOpenNotification, response, e_1;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (process.env.NODE_ENV === 'development') {
+                        return [2 /*return*/];
+                    }
+                    _a.label = 1;
+                case 1:
+                    _a.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, sendEventToExtension(eventsTypes.pingVersion)];
+                case 2:
+                    response = (_a.sent());
+                    isOpenNotification = !(response === null || response === void 0 ? void 0 : response.version);
+                    return [3 /*break*/, 4];
+                case 3:
+                    e_1 = _a.sent();
+                    isOpenNotification = true;
+                    return [3 /*break*/, 4];
+                case 4:
+                    if (!isOpenNotification) return [3 /*break*/, 6];
+                    return [4 /*yield*/, createNotificationWithId(function (data) { return __awaiter(void 0, void 0, void 0, function () {
+                            return __generator(this, function (_a) {
+                                setState(function (prev) { return (__assign(__assign({}, prev), { notifications: __spreadArray([data], prev.notifications, true) })); });
+                                return [2 /*return*/];
+                            });
+                        }); })(content)];
+                case 5:
+                    _a.sent();
+                    _a.label = 6;
+                case 6: return [2 /*return*/];
+            }
+        });
+    }); }, removeNotification: function (id) {
+        setState(function (prev) { return (__assign(__assign({}, prev), { notifications: prev.notifications.filter(function (el) { return el.id !== id; }) })); });
+    }, 
+    //overlay
+    isOverlayActive: false, openOverLay: function () {
+        rootAddOverflow();
+        setState({ isOverlayActive: true });
+    }, closeOverlay: function () {
+        rootRemoveOverflow();
+        setState({
+            isOverlayActive: false,
+            isModalOpen: false,
+            isSidebarOpen: false,
+            isModalSidebarOpen: false,
+            isOpenModalSidebarPortal: false,
+        });
+    }, 
+    //sidebar
+    isSidebarOpen: false, openSidebar: function () {
+        rootAddOverflow();
+        setState({ isOverlayActive: true, isSidebarOpen: true });
+    }, closeSidebar: function () {
+        rootRemoveOverflow();
+        setState({ isOverlayActive: false, isSidebarOpen: false });
+    }, 
+    //alert
+    isAlertOpen: false, alertType: null, openAlert: function (alertType) {
+        setState({
+            isAlertOpen: true,
+            alertType: alertType,
+        });
+    }, closeAlert: function () {
+        setState({
+            isAlertOpen: false,
+            alertType: null,
+        });
+    }, 
+    //modals
+    contentModals: null, stylesModals: null, addStylesModals: function (styles) {
+        setState({ stylesModals: styles });
+    } }, builderModal({
+    trigger: 'isModalOpen',
+    opener: 'openModal',
+    closer: 'closeModal',
+}, setState)), builderModal({
+    trigger: 'isModalSidebarOpen',
+    opener: 'openModalSidebar',
+    closer: 'closeModalSidebar',
+}, setState)), builderModal({
+    trigger: 'isOpenModalSidebarPortal',
+    opener: 'openModalSidebarPortal',
+    closer: 'closeModalSidebarPortal',
+}, setState))); }, shallow);

package/dist/store/ui/types.js

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

package/dist/store/ui/utils.js

@@ -0,0 +1,28 @@
+import { rootAddOverflow, rootRemoveOverflow } from '@ludo.ninja/utils';
+export var builderModal = function (fields, setState) {
+    var _a;
+    return (_a = {},
+        _a[fields.trigger] = false,
+        _a[fields.opener] = function (component) {
+            var _a;
+            rootAddOverflow();
+            setState((_a = {
+                    contentModals: component,
+                    isOverlayActive: true
+                },
+                _a[fields.trigger] = true,
+                _a));
+        },
+        _a[fields.closer] = function () {
+            var _a;
+            rootRemoveOverflow();
+            setState((_a = {
+                    contentModals: null,
+                    stylesModals: null,
+                    isOverlayActive: false
+                },
+                _a[fields.trigger] = false,
+                _a));
+        },
+        _a);
+};

package/dist/styles/ScreenWidth.js

@@ -0,0 +1,23 @@
+export var ScreenWidth;
+(function (ScreenWidth) {
+    ScreenWidth[ScreenWidth["MOBILE"] = 767] = "MOBILE";
+    ScreenWidth[ScreenWidth["PHONE"] = 360] = "PHONE";
+    ScreenWidth[ScreenWidth["BIG_PHONE"] = 500] = "BIG_PHONE";
+    ScreenWidth[ScreenWidth["TABLET"] = 768] = "TABLET";
+    ScreenWidth[ScreenWidth["DESKTOP"] = 1200] = "DESKTOP";
+    ScreenWidth[ScreenWidth["MAX_WIDTH_TABLET"] = 1199] = "MAX_WIDTH_TABLET";
+    ScreenWidth[ScreenWidth["FOUR_K_MIN"] = 2032] = "FOUR_K_MIN";
+    ScreenWidth[ScreenWidth["FOUR_K_MAX"] = 4064] = "FOUR_K_MAX";
+})(ScreenWidth || (ScreenWidth = {}));
+export var mediaQuery = {
+    mobile: "@media (max-width: ".concat(ScreenWidth.MOBILE, "px)"),
+    tablets: "@media (min-width: ".concat(ScreenWidth.TABLET, "px) and (max-width: ").concat(ScreenWidth.DESKTOP, "px)"),
+    phone: "@media (max-width: ".concat(ScreenWidth.PHONE, "px)"),
+    bigPhone: "@media (max-width: ".concat(ScreenWidth.BIG_PHONE, "px)"),
+    tablet: "@media (max-width: ".concat(ScreenWidth.TABLET, "px)"),
+    desktop: "@media (max-width: ".concat(ScreenWidth.DESKTOP, "px)"),
+    maxWidthTablet: "@media (max-width: ".concat(ScreenWidth.MAX_WIDTH_TABLET, "px)"),
+    minWidthTablet: "@media (min-width: ".concat(ScreenWidth.TABLET, "px)"),
+    minWidthDesktop: "@media (min-width: ".concat(ScreenWidth.DESKTOP, "px)"),
+    minWidthFourK: "@media (min-width: ".concat(ScreenWidth.FOUR_K_MIN, "px)"),
+};

package/dist/styles/animations/index.jsx

@@ -0,0 +1,8 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { keyframes } from 'styled-components';
+export var rotateReverse = keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    transform: rotate(360deg);\n  }\n  to {\n    transform: rotate(0deg);\n  }\n"], ["\n  from {\n    transform: rotate(360deg);\n  }\n  to {\n    transform: rotate(0deg);\n  }\n"])));
+export var rotate = keyframes(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"], ["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
+var templateObject_1, templateObject_2;

package/dist/styles/colors/index.jsx

@@ -0,0 +1 @@
+export { AccentColor, BlackColor, TextGrayColor, TextGray2Color, TextDarkGrayColor, BorderColorLight, BorderColorDark, InactiveButtonColor, BackgroundColorLight, BackgroundColorDark, WhiteColor, ProgressColor, ProgressColorMedium, ProgressColorMinimum, DangerColorLight, DangerColorDark, DarkBlueColor, DisabledGrayColor, BlueShadowColor, DisabledLightGrayColor, GrayBackgroundColor, DisabledDangerColor, ErrorColor, TableExperienceColorDark, ExpProgressBlankDark, ExpUserProgressFill, ExpTaskProgressFill, HeaderBackgroundDark, SearchInputBg, ExperienceGradientLabelLight, ExperienceGradientLabelDark, InviteGradientLabelLight, InviteGradientLabelDark, CategoryHoverBg, } from '@ludo.ninja/ui/build/styles/colors';

package/dist/styles/mixins/boxShadow.jsx

@@ -0,0 +1,8 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { css } from 'styled-components';
+var BoxShadow = function () { return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  transition: box-shadow 0.25s ease-in-out 0s, transform 0.25s ease 0s;\n  box-shadow: none;\n\n  &:hover {\n    box-shadow: 0 10px 32px -16px rgba(33, 21, 95, 0.15);\n    transition: box-shadow 0.25s ease-in-out 0s, transform 0.25s ease 0s;\n  }\n"], ["\n  transition: box-shadow 0.25s ease-in-out 0s, transform 0.25s ease 0s;\n  box-shadow: none;\n\n  &:hover {\n    box-shadow: 0 10px 32px -16px rgba(33, 21, 95, 0.15);\n    transition: box-shadow 0.25s ease-in-out 0s, transform 0.25s ease 0s;\n  }\n"]))); };
+export default BoxShadow;
+var templateObject_1;

package/dist/styles/mixins/boxTransform.jsx

@@ -0,0 +1,8 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { css } from 'styled-components';
+var BoxTransform = function () { return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  transition: 0.2s transform ease-in-out;\n\n  &:hover {\n    transition: 0.2s transform ease-in;\n    transform: translate(0px, -4px);\n  }\n"], ["\n  transition: 0.2s transform ease-in-out;\n\n  &:hover {\n    transition: 0.2s transform ease-in;\n    transform: translate(0px, -4px);\n  }\n"]))); };
+export default BoxTransform;
+var templateObject_1;