@ludo.ninja/components 1.1.6 → 1.1.8

package/dist/modules/virtuoso/VirtuosoPageBuilder.js

@@ -1,121 +0,0 @@
-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, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { 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 (_jsx(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(),
-                        }, children: placeholderData[index].map(function (_, ind) {
-                            return isProfileCards ? (_jsx(ProfileSkeleton, {}, ind)) : (_jsx(CardSkeleton, {}, ind));
-                        }) }));
-                },
-            };
-        }
-        if (error) {
-            return {
-                totalCount: 1,
-                itemContent: function () {
-                    return _jsx(CardsError, { refetch: refetchQuery });
-                },
-            };
-        }
-        if (notFoundText && virtuosoData.creations.length === 0) {
-            return {
-                totalCount: 1,
-                itemContent: function () {
-                    return _jsx(CardsNoResults, { noFoundText: notFoundText });
-                },
-            };
-        }
-        return {
-            totalCount: virtuosoData.creationPacks.length,
-            itemContent: function (index) {
-                var data = virtuosoData.creationPacks[index];
-                return (_jsx(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); }, children: data.map(renderCreation) }));
-            },
-        };
-    })();
-    return (_jsxs(_Fragment, { children: [_jsx(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 ? _jsx(CardsHolderLoader, {}) : null); },
-                } }), virtuosoToTopBtnInitialize.isShowBtn && (_jsx(VirtuosoToTopBtn, { virtuoso: virtuoso }))] }));
-};
-var templateObject_1;

package/dist/modules/virtuoso/VirtuosoPageBuilder.jsx

@@ -1,127 +0,0 @@
-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.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-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 (_jsx(ToTopBtnWithCustomHandler, { handleClickFunction: handleClickFunction }));
-};

package/dist/modules/virtuoso/VirtuosoToTopBtn.jsx

@@ -1,34 +0,0 @@
-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

@@ -1,4 +0,0 @@
-export * from './VirtuosoPageBuilder';
-export * from './VirtuosoToTopBtn';
-export * from './useVirtuosoData';
-export * from './useSubscribeVirtuosoScrollToHeader';

package/dist/modules/virtuoso/types.js

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

package/dist/modules/virtuoso/useSubscribeVirtuosoScrollToHeader.js

@@ -1,23 +0,0 @@
-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

@@ -1,46 +0,0 @@
-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.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import Head from 'next/head';
-export default function Home() {
-    return (_jsxs(_Fragment, { children: [_jsxs(Head, { children: [_jsx("title", { children: "Create Next App" }), _jsx("meta", { name: "description", content: "Generated by create next app" }), _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }), _jsx("link", { rel: "icon", href: "/favicon.ico" })] }), _jsx("div", { children: "Hello" })] }));
-}

package/dist/pages/index.jsx

@@ -1,12 +0,0 @@
-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

@@ -1,11 +0,0 @@
-import { createProvider } from 'next-zustand';
-export * from './ui';
-export * from './media';
-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

@@ -1,66 +0,0 @@
-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

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