@ludo.ninja/components 1.1.4 → 1.1.6

package/dist/hooks/useToGalleryAsset/index.js

@@ -0,0 +1,96 @@
+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 } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { shallow } from 'zustand/shallow';
+import { createWithEqualityFn } from 'zustand/traditional';
+import { useUiStore } from '@/store/ui';
+import AddCreationToGallery from '@/components/gallery/add/addCreationToGallery';
+export var getIsActiveCreation = function (creations, creation) {
+    return !!creations.find(function (gCreation) { return gCreation.getCreationId() === creation.getCreationId(); });
+};
+export var useToGalleryStore = createWithEqualityFn()(function (setState, getState) { return ({
+    isActiveGalleryMode: false,
+    activateGalleryMode: function () {
+        setState({
+            isActiveGalleryMode: true,
+        });
+    },
+    disableGalleryMode: function () {
+        setState({
+            isActiveGalleryMode: false,
+        });
+    },
+    creationsToGallery: [],
+    addCreationToGallery: function (creation) {
+        setState(function (prev) { return (__assign(__assign({}, prev), { creationsToGallery: __spreadArray(__spreadArray([], prev.creationsToGallery, true), [creation], false) })); });
+    },
+    removeCreationFromGallery: function (itemId) {
+        setState(function (prev) { return (__assign(__assign({}, prev), { creationsToGallery: prev.creationsToGallery.filter(function (pCreation) { return pCreation.getCreationId() !== itemId; }) })); });
+    },
+    removeCreationFromGalleryWithCallback: function (itemId, closeCallback) {
+        setState(function (prev) {
+            var newCreations = prev.creationsToGallery.filter(function (pCreation) { return pCreation.getCreationId() !== itemId; });
+            if (!newCreations.length) {
+                closeCallback();
+                return {
+                    creationsToGallery: newCreations,
+                    isActiveGalleryMode: false,
+                };
+            }
+            return {
+                creationsToGallery: newCreations,
+            };
+        });
+    },
+    toggleCreationToGallery: function (creation) {
+        var _a = getState(), removeCreationFromGallery = _a.removeCreationFromGallery, addCreationToGallery = _a.addCreationToGallery, creationsToGallery = _a.creationsToGallery;
+        if (getIsActiveCreation(creationsToGallery, creation)) {
+            removeCreationFromGallery(creation.getCreationId());
+        }
+        else {
+            addCreationToGallery(creation);
+        }
+    },
+    resetCreationsInGallery: function () {
+        setState({
+            creationsToGallery: [],
+            isActiveGalleryMode: false,
+        });
+    },
+}); }, shallow);
+export var useInitializeToGalleryAsset = function () {
+    var openModalSidebarPortal = useUiStore(function (state) { return state.openModalSidebarPortal; });
+    var resetCreationsInGallery = useToGalleryStore(function (state) { return ({
+        resetCreationsInGallery: state.resetCreationsInGallery,
+    }); }).resetCreationsInGallery;
+    useEffect(function () {
+        return function () {
+            resetCreationsInGallery();
+        };
+    }, []);
+    var handleAddToGallery = function () {
+        openModalSidebarPortal(_jsx(AddCreationToGallery, {}));
+    };
+    return {
+        handleAddToGallery: handleAddToGallery,
+    };
+};

package/dist/layouts/GlobalLayout.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import process from 'process';
+import EnvLine from '@ludo.ninja/ui/build/components/envLine';
+import useMultiAudio from '@/hooks/audio/useMultiAudio';
+import { CreatorNotifications } from '@/modules/notifications/CreatorNotifications';
+import { DeleteScrollStateInterceptor } from '@/modules/sessionScroll';
+import { useAuthVerification } from '@/modules/user/auth/useAuthVerification';
+import { ProfileDataInitialization } from '@/modules/user/profileData/profileDataInitialization';
+import useFetchMyExperienceWithLevel from '@/api/server-experiences/queries/useFetchMyExperienceWithLevel';
+import { SubscriberInviteNotification } from '@/api/subscriptions/SubscriberInviteNotification';
+import GlobalStyle from '@/styles/globalStyles';
+import { SidebarInitializer } from '@/components/sidebar/initializer';
+import Alert from '@/system/Alert';
+import Modal from '@/system/Modals/Modal';
+import ModalSidebar from '@/system/Modals/ModalSidebar';
+import { CreatorModalSidebarPortal } from '@/system/Modals/ModalSidebar/CreatorModalSidebarPortal';
+import Overlay from '@/system/Overlay';
+import { InitializeAppHeight } from '@/utils/screen';
+export var GlobalLayout = function (_a) {
+    var children = _a.children;
+    useFetchMyExperienceWithLevel();
+    useMultiAudio();
+    useAuthVerification();
+    var envValue = process.env.NEXT_PUBLIC_ENV_VALUE !== 'prod'
+        ? process.env.NEXT_PUBLIC_ENV_VALUE
+        : null;
+    return (_jsxs(_Fragment, { children: [_jsx(ProfileDataInitialization, {}), _jsx(EnvLine, { isNeedToShow: envValue }), _jsx(GlobalStyle, {}), children, _jsx(CreatorNotifications, {}), _jsx(InitializeAppHeight, {}), _jsx(SubscriberInviteNotification, {}), _jsx(Overlay, {}), _jsx(SidebarInitializer, {}), _jsx(Alert, {}), _jsx(Modal, {}), _jsx(ModalSidebar, {}), _jsx(CreatorModalSidebarPortal, {}), _jsx(DeleteScrollStateInterceptor, {})] }));
+};

package/dist/layouts/base/LWithRegularHeader/index.js

@@ -0,0 +1,17 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from 'styled-components';
+import Meta from '@/components/base/Meta';
+import Header from '@/components/headers/header';
+// Component
+var SWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  min-height: var(--app-height);\n"], ["\n  min-height: var(--app-height);\n"])));
+var LWithRegularHeader = function (_a) {
+    var children = _a.children;
+    return (_jsxs(SWrapper, { children: [_jsx(Meta, {}), _jsx(Header, {}), children] }));
+};
+// Export
+export default LWithRegularHeader;
+var templateObject_1;

package/dist/layouts/base/LWithSearchHeader/index.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Meta from '@/components/base/Meta';
+import HeaderSearch from '@/components/headers/headerSearch';
+// Component
+var LWithSearchHeader = function (_a) {
+    var children = _a.children;
+    return (_jsxs("div", { style: { minHeight: 'var(--app-height)' }, children: [_jsx(Meta, {}), _jsx(HeaderSearch, {}), children] }));
+};
+// Export
+export default LWithSearchHeader;

package/dist/layouts/base/LWithSimpleHeader/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Meta from '@/components/base/Meta';
+import HeaderSimple from '@/components/headers/headerSimple';
+// Component
+var LWithSimpleHeader = function (_a) {
+    var children = _a.children;
+    var renderPageData = function () {
+        return (_jsxs("div", { style: { minHeight: 'var(--app-height)' }, children: [_jsx(Meta, {}), _jsx(HeaderSimple, {}), children] }));
+    };
+    return renderPageData();
+};
+// Export
+export default LWithSimpleHeader;

package/dist/layouts/base/LWithoutHeader/index.js

@@ -0,0 +1,16 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from 'styled-components';
+import Meta from '@/components/base/Meta';
+// Component
+var SWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  min-height: var(--app-height);\n  height: 100vh;\n  background-image: url('/formsBg/get_early_access_bg.jpg');\n  background-repeat: no-repeat;\n  background-size: cover;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n"], ["\n  min-height: var(--app-height);\n  height: 100vh;\n  background-image: url('/formsBg/get_early_access_bg.jpg');\n  background-repeat: no-repeat;\n  background-size: cover;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n"])));
+var LWithoutHeader = function (_a) {
+    var children = _a.children;
+    return (_jsxs(SWrapper, { children: [_jsx(Meta, {}), children] }));
+};
+// Export
+export default LWithoutHeader;
+var templateObject_1;

package/dist/layouts/custom/accountLayout/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import LWithSearchHeader from '@/layouts/base/LWithSearchHeader';
+import { StyledMain } from '@/layouts/custom/styles';
+import PageTransitionLayout from '@/layouts/pageTransitionLayout';
+import NoSSR from '@/components/base/NoSSR';
+import ToTopBtn from '@/components/toTopBtn';
+// Components
+var AccountLayout = function (_a) {
+    var children = _a.children;
+    return (_jsx(NoSSR, { children: _jsx(PageTransitionLayout, { children: _jsx(LWithSearchHeader, { children: _jsxs(StyledMain, { role: "main", children: [children, _jsx(ToTopBtn, {})] }) }) }) }));
+};
+// Export
+export default AccountLayout;

package/dist/layouts/custom/formsLayout/index.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import LWithoutHeader from '@/layouts/base/LWithoutHeader';
+import { StyledMainForms } from '@/layouts/custom/styles';
+import PageTransitionLayout from '@/layouts/pageTransitionLayout';
+// Component
+var FormsLayout = function (_a) {
+    var children = _a.children;
+    return (_jsx(PageTransitionLayout, { children: _jsx(LWithoutHeader, { children: _jsx(StyledMainForms, { children: children }) }) }));
+};
+// Export
+export default FormsLayout;

package/dist/layouts/custom/mainLayout/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isServer } from '@ludo.ninja/utils';
+import LWithRegularHeader from '@/layouts/base/LWithRegularHeader';
+import { StyledMain } from '@/layouts/custom/styles';
+import PageTransitionLayout from '@/layouts/pageTransitionLayout';
+import ToTopBtn from '@/components/toTopBtn';
+// Component
+var MainLayout = function (_a) {
+    var children = _a.children;
+    return (_jsx(PageTransitionLayout, { children: _jsx(LWithRegularHeader, { children: _jsxs(StyledMain, { children: [children, !isServer && _jsx(ToTopBtn, {})] }) }) }));
+};
+// Export
+export default MainLayout;

package/dist/layouts/custom/searchLayout/index.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { isServer } from '@ludo.ninja/utils';
+import LWithSearchHeader from '@/layouts/base/LWithSearchHeader';
+import { StyledMain } from '@/layouts/custom/styles';
+import ToTopBtn from '@/components/toTopBtn';
+// import PageTransitionLayout from '@/layouts/pageTransitionLayout';
+// Component
+var SearchLayout = function (_a) {
+    var children = _a.children;
+    return (
+    // <PageTransitionLayout>
+    _jsx(_Fragment, { children: _jsx(LWithSearchHeader, { children: _jsxs(StyledMain, { role: "main", children: [children, !isServer && _jsx(ToTopBtn, {})] }) }) })
+    // </PageTransitionLayout>
+    );
+};
+// Export
+export default SearchLayout;

package/dist/layouts/custom/simpleLayout/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isServer } from '@ludo.ninja/utils';
+import LWithSimpleHeader from '@/layouts/base/LWithSimpleHeader';
+import { StyledMain } from '@/layouts/custom/styles';
+import PageTransitionLayout from '@/layouts/pageTransitionLayout';
+import ToTopBtn from '@/components/toTopBtn';
+// Component
+var SimpleLayout = function (_a) {
+    var children = _a.children;
+    return (_jsx(PageTransitionLayout, { children: _jsx(LWithSimpleHeader, { children: _jsxs(StyledMain, { role: 'main', children: [children, !isServer && _jsx(ToTopBtn, {})] }) }) }));
+};
+// Export
+export default SimpleLayout;

package/dist/layouts/custom/styles.js

@@ -1,70 +1,10 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
 import styled from 'styled-components';
-
 import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-
 import { mediaQuery } from '@/styles/ScreenWidth';
-
-var __makeTemplateObject =
-  (this && this.__makeTemplateObject) ||
-  function (cooked, raw) {
-    if (Object.defineProperty) {
-      Object.defineProperty(cooked, 'raw', { value: raw });
-    } else {
-      cooked.raw = raw;
-    }
-    return cooked;
-  };
-
-export var StyledMain = styled.main(
-  templateObject_1 ||
-    (templateObject_1 = __makeTemplateObject(
-      [
-        '\n  width: 1080px;\n  margin: 0 auto;\n  padding-top: 124px;\n  padding-bottom: 60px;\n\n  ',
-        ' {\n    width: 768px;\n    padding-bottom: 32px;\n  }\n\n  ',
-        ' {\n    width: 320px;\n    padding-top: 80px;\n    padding-bottom: 20px;\n  }\n  ',
-        ' {\n    width: ',
-        ';\n    padding-top: ',
-        ';\n    padding-bottom: ',
-        ';\n  }\n',
-      ],
-      [
-        '\n  width: 1080px;\n  margin: 0 auto;\n  padding-top: 124px;\n  padding-bottom: 60px;\n\n  ',
-        ' {\n    width: 768px;\n    padding-bottom: 32px;\n  }\n\n  ',
-        ' {\n    width: 320px;\n    padding-top: 80px;\n    padding-bottom: 20px;\n  }\n  ',
-        ' {\n    width: ',
-        ';\n    padding-top: ',
-        ';\n    padding-bottom: ',
-        ';\n  }\n',
-      ]
-    )),
-  mediaQuery.maxWidthTablet,
-  mediaQuery.mobile,
-  mediaQuery.minWidthFourK,
-  adaptiveValueCalc(1080),
-  adaptiveValueCalc(124),
-  adaptiveValueCalc(60)
-);
-export var StyledMainForms = styled.main(
-  templateObject_2 ||
-    (templateObject_2 = __makeTemplateObject(
-      [
-        '\n  width: 1080px;\n  margin: 0 auto;\n\n  ',
-        ' {\n    width: 768px;\n  }\n\n  ',
-        ' {\n    width: 400px;\n  }\n  ',
-        ' {\n    width: ',
-        ';\n  }\n',
-      ],
-      [
-        '\n  width: 1080px;\n  margin: 0 auto;\n\n  ',
-        ' {\n    width: 768px;\n  }\n\n  ',
-        ' {\n    width: 400px;\n  }\n  ',
-        ' {\n    width: ',
-        ';\n  }\n',
-      ]
-    )),
-  mediaQuery.maxWidthTablet,
-  mediaQuery.mobile,
-  mediaQuery.minWidthFourK,
-  adaptiveValueCalc(1080)
-);
+export var StyledMain = styled.main(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 1080px;\n  margin: 0 auto;\n  padding-top: 124px;\n  padding-bottom: 60px;\n\n  ", " {\n    width: 768px;\n    padding-bottom: 32px;\n  }\n\n  ", " {\n    width: 320px;\n    padding-top: 80px;\n    padding-bottom: 20px;\n  }\n  ", " {\n    width: ", ";\n    padding-top: ", ";\n    padding-bottom: ", ";\n  }\n"], ["\n  width: 1080px;\n  margin: 0 auto;\n  padding-top: 124px;\n  padding-bottom: 60px;\n\n  ", " {\n    width: 768px;\n    padding-bottom: 32px;\n  }\n\n  ", " {\n    width: 320px;\n    padding-top: 80px;\n    padding-bottom: 20px;\n  }\n  ", " {\n    width: ", ";\n    padding-top: ", ";\n    padding-bottom: ", ";\n  }\n"])), mediaQuery.maxWidthTablet, mediaQuery.mobile, mediaQuery.minWidthFourK, adaptiveValueCalc(1080), adaptiveValueCalc(124), adaptiveValueCalc(60));
+export var StyledMainForms = styled.main(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 1080px;\n  margin: 0 auto;\n\n  ", " {\n    width: 768px;\n  }\n\n  ", " {\n    width: 400px;\n  }\n  ", " {\n    width: ", ";\n  }\n"], ["\n  width: 1080px;\n  margin: 0 auto;\n\n  ", " {\n    width: 768px;\n  }\n\n  ", " {\n    width: 400px;\n  }\n  ", " {\n    width: ", ";\n  }\n"])), mediaQuery.maxWidthTablet, mediaQuery.mobile, mediaQuery.minWidthFourK, adaptiveValueCalc(1080));
 var templateObject_1, templateObject_2;

package/dist/layouts/pageTransitionLayout.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useRouter } from 'next/router';
+import { AnimatePresence, motion } from 'framer-motion';
+var PageTransitionLayout = function (_a) {
+    var children = _a.children;
+    var router = useRouter();
+    return (_jsx(AnimatePresence, { mode: 'wait', children: _jsx(motion.div, { initial: "initialState", animate: "animateState", exit: "exitState", transition: {
+                type: 'tween',
+                duration: 0.5,
+            }, variants: {
+                initialState: {
+                    opacity: 0,
+                },
+                animateState: {
+                    opacity: 1,
+                },
+                exitState: {
+                    opacity: 0,
+                },
+            }, children: children }, router.route) }));
+};
+export default PageTransitionLayout;

package/dist/modules/gallery/api/useGetFavoriteGallery.js

@@ -1,58 +1,39 @@
 import { useQuery } from '@apollo/client';
-
 import { hosts, galleriesSchema as schema } from '@ludo.ninja/api';
 import { alertVariants } from '@ludo.ninja/ui/build/system/Alert/type';
-
 import { useGalleryStore } from '@/modules/gallery/store';
-
 import { useUiStore } from '@/store/ui';
-
 export var useGetFavoriteGallery = function (_a) {
-  var galleryId = _a.galleryId;
-  var _b = useGalleryStore(function (state) {
-      return {
+    var galleryId = _a.galleryId;
+    var _b = useGalleryStore(function (state) { return ({
         setGallery: state.setGallery,
         setAllResults: state.setAllResults,
-      };
-    }),
-    setGallery = _b.setGallery,
-    setAllResults = _b.setAllResults;
-  var openAlert = useUiStore(function (state) {
-    return state.openAlert;
-  });
-  var _c = useQuery(schema.FetchGalleryV2Document, {
-      variables: { galleryId: galleryId },
-      context: {
-        uri: hosts.galleriesHost,
-      },
-      notifyOnNetworkStatusChange: true,
-      fetchPolicy: 'no-cache',
-      onCompleted: function (_a) {
-        var _b;
-        var fetchGalleryV2 = _a.fetchGalleryV2;
-        setGallery(fetchGalleryV2);
-        setAllResults(
-          ((_b =
-            fetchGalleryV2 === null || fetchGalleryV2 === void 0
-              ? void 0
-              : fetchGalleryV2.creationIds) === null || _b === void 0
-            ? void 0
-            : _b.length) || 0
-        );
-      },
-      onError: function () {
-        openAlert({
-          type: alertVariants.error,
-          caption: 'Oops, something went wrong.',
-        });
-        setGallery(null);
-        setAllResults(0);
-      },
-    }),
-    galleryError = _c.error,
-    isLoadingGallery = _c.loading;
-  return {
-    isLoadingGallery: isLoadingGallery,
-    galleryError: galleryError,
-  };
+    }); }), setGallery = _b.setGallery, setAllResults = _b.setAllResults;
+    var openAlert = useUiStore(function (state) { return state.openAlert; });
+    var _c = useQuery(schema.FetchGalleryV2Document, {
+        variables: { galleryId: galleryId },
+        context: {
+            uri: hosts.galleriesHost,
+        },
+        notifyOnNetworkStatusChange: true,
+        fetchPolicy: 'no-cache',
+        onCompleted: function (_a) {
+            var _b;
+            var fetchGalleryV2 = _a.fetchGalleryV2;
+            setGallery(fetchGalleryV2);
+            setAllResults(((_b = fetchGalleryV2 === null || fetchGalleryV2 === void 0 ? void 0 : fetchGalleryV2.creationIds) === null || _b === void 0 ? void 0 : _b.length) || 0);
+        },
+        onError: function () {
+            openAlert({
+                type: alertVariants.error,
+                caption: 'Oops, something went wrong.',
+            });
+            setGallery(null);
+            setAllResults(0);
+        },
+    }), galleryError = _c.error, isLoadingGallery = _c.loading;
+    return {
+        isLoadingGallery: isLoadingGallery,
+        galleryError: galleryError,
+    };
 };