@ludo.ninja/components 2.3.6 → 2.3.7

package/build/modules/gallery/store.d.ts

@@ -0,0 +1,26 @@
+import { TGallery } from '../../entities/gallery/types';
+import { galleriesSchema as schema } from "@ludo.ninja/api";
+type UserFields = {
+    galleryName: string;
+    galleryDescription: string;
+};
+export interface HTMLInputEvent extends Event {
+    target: HTMLInputElement & EventTarget;
+}
+interface IFavoriteStore {
+    fetchGalleryV2: schema.IGalleryV2 | null;
+    gallery: TGallery | null;
+    setGallery: (gallery: schema.IGalleryV2 | null) => void;
+    updateGalleryInfo: (data: UserFields) => void;
+    updateGalleryBanner: (banner: string | null) => void;
+    fileGallery: string;
+    isErrorFileGallery: boolean;
+    addFileGalleryWithValidation: (e: HTMLInputEvent) => Promise<void>;
+    removeFileGallery: () => void;
+    allResults: number;
+    setAllResults: (allResults: number) => void;
+    decrementAllResults: () => void;
+    reinitStore: () => void;
+}
+export declare const useGalleryStore: import("zustand/traditional").UseBoundStoreWithEqualityFn<import("zustand").StoreApi<IFavoriteStore>>;
+export {};

package/build/modules/gallery/store.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGalleryStore = void 0;
+const builder_1 = require("../../entities/gallery/builder");
+const getDimensionsImage_1 = require("../../utils/getDimensionsImage");
+const shallow_1 = require("zustand/shallow");
+const traditional_1 = require("zustand/traditional");
+const initialState = {
+    gallery: null,
+    fetchGalleryV2: null,
+    allResults: 0,
+    isErrorFileGallery: false,
+};
+exports.useGalleryStore = (0, traditional_1.createWithEqualityFn)()((setState, getState) => ({
+    fetchGalleryV2: initialState.fetchGalleryV2,
+    gallery: initialState.gallery,
+    setGallery: (gallery) => {
+        if (gallery) {
+            setState({
+                gallery: (0, builder_1.buildGallery)(gallery),
+                fetchGalleryV2: gallery,
+            });
+        }
+        else {
+            setState({ gallery: null, fetchGalleryV2: null });
+        }
+    },
+    updateGalleryInfo: ({ galleryName, galleryDescription }) => {
+        setState((prev) => {
+            const newGallery = {
+                ...prev.fetchGalleryV2,
+                name: galleryName,
+                description: galleryDescription,
+            };
+            return {
+                fetchGalleryV2: newGallery,
+                gallery: (0, builder_1.buildGallery)(newGallery),
+            };
+        });
+    },
+    updateGalleryBanner: (banner) => {
+        setState((prev) => {
+            const newGallery = {
+                ...prev.fetchGalleryV2,
+                banner,
+            };
+            return {
+                fetchGalleryV2: newGallery,
+                gallery: (0, builder_1.buildGallery)(newGallery),
+            };
+        });
+    },
+    fileGallery: "",
+    isErrorFileGallery: initialState.isErrorFileGallery,
+    addFileGalleryWithValidation: async (e) => {
+        const fileTarget = e.target.files?.[0];
+        if (!fileTarget)
+            return;
+        // console.log('fileTarget', fileTarget);
+        // ======validation image
+        if (fileTarget.size > 1048576) {
+            setState({ isErrorFileGallery: true });
+            return;
+            // return alert('File is too big, max size 1mb!');
+        }
+        else {
+            const dimensions = await (0, getDimensionsImage_1.getDimensionsImage)(fileTarget);
+            const isErrorNew = !!(dimensions && (dimensions.width > 1200 || dimensions.height > 1200));
+            setState({ isErrorFileGallery: isErrorNew });
+            if (isErrorNew) {
+                return;
+            }
+        }
+        //add file to cropper and banner
+        const url = URL.createObjectURL(fileTarget);
+        // console.log('url', url);
+        setState({ fileGallery: url });
+    },
+    removeFileGallery: () => {
+        const fileGallery = getState().fileGallery;
+        if (fileGallery) {
+            URL.revokeObjectURL(fileGallery);
+            setState({ fileGallery: "" });
+        }
+    },
+    allResults: initialState.allResults,
+    setAllResults: (allResults) => {
+        setState({ allResults });
+    },
+    decrementAllResults: () => {
+        setState((prev) => ({ allResults: prev.allResults - 1 }));
+    },
+    reinitStore: () => {
+        setState(initialState);
+        getState().removeFileGallery();
+    },
+}), shallow_1.shallow);

package/build/modules/gallery/ui/AllResults.d.ts

@@ -0,0 +1,3 @@
+export declare const AllResultsGallery: ({ isShowCounts, }: {
+    isShowCounts: boolean;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/build/modules/gallery/ui/AllResults.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AllResultsGallery = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const store_1 = require("../store");
+const colors_1 = require("../../../styles/colors");
+const index_1 = require("../../../system/index");
+const AllResultsGallery = ({ isShowCounts, }) => {
+    const allResults = (0, store_1.useGalleryStore)((state) => state.allResults);
+    return isShowCounts ? ((0, jsx_runtime_1.jsxs)(index_1.H5, { mt: 10, fontSize: 13, color: colors_1.TextDarkGrayColor, children: [allResults, " ", allResults !== 1 ? 'items' : 'item'] })) : null;
+};
+exports.AllResultsGallery = AllResultsGallery;

package/build/modules/gallery/ui/Description.d.ts

@@ -0,0 +1,4 @@
+export declare const Description: ({ description, lineClamp, }: {
+    description: string;
+    lineClamp?: number;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/build/modules/gallery/ui/Description.js

@@ -0,0 +1,101 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Description = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const react_hyphen_1 = __importDefault(require("react-hyphen"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const colors_1 = require("@ludo.ninja/ui/build/styles/colors");
+const ScreenWidth_1 = require("../../../styles/ScreenWidth");
+const typography_1 = require("../../../styles/typography");
+const vars_1 = require("../../../fonts/vars");
+const SDescription = styled_components_1.default.div `
+  margin-top: 16px;
+  position: relative;
+  overflow: hidden;
+
+  .content {
+    display: -webkit-box;
+    word-break: break-word;
+    -webkit-box-orient: vertical;
+    white-space: normal;
+    overflow: hidden;
+  }
+
+  .calculate {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: -1;
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  //=======================
+  .descr {
+    font-family: ${vars_1.dmsansFontVarCss.css};
+    word-wrap: break-word;
+    ${typography_1.MainText};
+    color: ${colors_1.TextGrayColor};
+    white-space: normal;
+    overflow: visible;
+    text-overflow: unset;
+
+    ${ScreenWidth_1.mediaQuery.mobile} {
+      .descr {
+        font-size: 1.4em;
+      }
+    }
+  }
+
+  .readMoreContainer {
+    padding-top: 0;
+    display: grid;
+    grid-template-rows: 0fr;
+    opacity: 0;
+    pointer-events: none;
+    overflow: hidden;
+
+    &.show {
+      transition: grid-template-rows 300ms ease-in-out,
+        padding-top 300ms ease-in-out, opacity 300ms ease-in-out;
+      padding-top: 4px;
+      grid-template-rows: 1fr;
+      opacity: 1;
+      pointer-events: unset;
+    }
+  }
+
+  .readMore {
+    ${typography_1.FH6};
+    color: ${colors_1.AccentColor};
+
+    user-select: none;
+    cursor: pointer;
+    min-height: 0;
+  }
+`;
+const Description = ({ description, lineClamp = 2, }) => {
+    const container = (0, react_1.useRef)(null);
+    const position = (0, react_1.useRef)(null);
+    const [isShowFullDescription, setIsShowFullDescription] = (0, react_1.useState)(false);
+    const [isNeedReadMore, setIsNeedReadMore] = (0, react_1.useState)(false);
+    const handleReadMore = () => {
+        setIsNeedReadMore(false);
+        setIsShowFullDescription(true);
+    };
+    (0, react_1.useEffect)(() => {
+        setIsNeedReadMore(container.current?.clientHeight > position.current?.clientHeight);
+    }, [description]);
+    if (description) {
+        const content = ((0, jsx_runtime_1.jsx)(react_hyphen_1.default, { children: (0, jsx_runtime_1.jsx)("p", { className: `descr`, children: description }) }));
+        return ((0, jsx_runtime_1.jsxs)(SDescription, { children: [(0, jsx_runtime_1.jsx)("div", { className: `content`, style: {
+                        WebkitLineClamp: isShowFullDescription ? 'unset' : lineClamp,
+                    }, ref: position, children: content }), (0, jsx_runtime_1.jsx)("div", { className: `readMoreContainer ${isNeedReadMore ? 'show' : ''}`, children: (0, jsx_runtime_1.jsx)("span", { className: `readMore `, onClick: handleReadMore, children: "Read more" }) }), (0, jsx_runtime_1.jsx)("div", { className: `calculate`, ref: container, children: content })] }));
+    }
+    return null;
+};
+exports.Description = Description;

package/build/modules/gallery/ui/EditGallery.d.ts

@@ -0,0 +1,9 @@
+import { TGallery } from '../../../entities/gallery/types';
+export declare const EditGallery: ({ galleryId, handleRemoveAsset, gallery, titleAssets, titleForm, inputPlaceHolderText, }: {
+    gallery: TGallery;
+    galleryId: string;
+    handleRemoveAsset: (creationIdToRemove: string) => (itemType: "asset" | "collection") => void;
+    titleAssets: string;
+    titleForm: string;
+    inputPlaceHolderText: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/build/modules/gallery/ui/EditGallery.js

@@ -0,0 +1,51 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EditGallery = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const editGalleryForm_1 = __importDefault(require("./editGalleryForm"));
+const useRemoveAssetFromGallery_1 = require("../../../api/server-galleries/mutations/useRemoveAssetFromGallery");
+const useRemoveCollectionFromGallery_1 = require("../../../api/server-galleries/mutations/useRemoveCollectionFromGallery");
+const useGetAssetsAndCollectionForFavorite_1 = require("../api/useGetAssetsAndCollectionForFavorite");
+const store_1 = require("../store");
+const itemsPreview_1 = __importDefault(require("./itemsPreview"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const StyledAddFavlist = styled_components_1.default.div `
+  display: flex;
+
+  @media (max-width: 767px) {
+    flex-direction: column;
+  }
+`;
+const EditGallery = ({ galleryId, handleRemoveAsset, gallery, titleAssets, titleForm, inputPlaceHolderText, }) => {
+    const { creations: creationsList, removeCreation, isLoading, loadMore, isNextLoading, } = (0, useGetAssetsAndCollectionForFavorite_1.useGetAssetsAndCollectionForFavorite)({
+        gallery,
+        activeTab: null,
+    });
+    const { removeAssetFromGallery } = (0, useRemoveAssetFromGallery_1.useRemoveAssetFromGalleryV2)();
+    const { removeCollectionFromGallery } = (0, useRemoveCollectionFromGallery_1.useRemoveCollectionFromGalleryV2)();
+    const handleDeleteCreation = async (itemId) => {
+        const id = itemId.split(".").splice(1).join(".");
+        if (itemId.split(".")[0] === "collection") {
+            await removeCollectionFromGallery({
+                galleryId,
+                collectionId: id,
+            });
+            handleRemoveAsset(id)("collection");
+            removeCreation(id, "collection");
+        }
+        else {
+            await removeAssetFromGallery({
+                galleryId,
+                assetId: id,
+            });
+            handleRemoveAsset(id)("asset");
+            removeCreation(id, "asset");
+        }
+    };
+    const allResults = (0, store_1.useGalleryStore)((state) => state.allResults);
+    return ((0, jsx_runtime_1.jsxs)(StyledAddFavlist, { children: [(0, jsx_runtime_1.jsx)(itemsPreview_1.default, { creations: creationsList, title: titleAssets, deleteMethod: handleDeleteCreation, isLoading: isLoading, loadMore: loadMore, isNextLoading: isNextLoading, allCount: allResults }), (0, jsx_runtime_1.jsx)(editGalleryForm_1.default, { name: gallery.name, description: gallery.description, title: titleForm, inputPlaceHolderText: inputPlaceHolderText, galleryId: galleryId })] }));
+};
+exports.EditGallery = EditGallery;

package/build/modules/gallery/ui/GalleryDeleteIcon.d.ts

@@ -0,0 +1,4 @@
+export declare const GalleryDeleteIcon: ({ onClick, className }: {
+    onClick: () => void;
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/build/modules/gallery/ui/GalleryDeleteIcon.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GalleryDeleteIcon = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ScreenWidth_1 = require("../../../styles/ScreenWidth");
+const IconButton_1 = __importDefault(require("../../../system/Buttons/IconButton"));
+const constants_1 = require("@ludo.ninja/core/build/constants");
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const react_1 = require("react");
+const styled_components_1 = __importDefault(require("styled-components"));
+const SImg = styled_components_1.default.img `
+  width: 18px;
+  height: 18px;
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    width: ${(0, _4k_1.adaptiveValueCalc)(18)};
+    height: ${(0, _4k_1.adaptiveValueCalc)(18)};
+  }
+`;
+const GalleryDeleteIcon = ({ onClick, className }) => {
+    const [isHovered, setIsHovered] = (0, react_1.useState)(false);
+    const handleHover = (e) => {
+        setIsHovered(e.type === "mouseenter");
+    };
+    return ((0, jsx_runtime_1.jsx)(IconButton_1.default, { handleHoverFn: handleHover, onClick: onClick, className: `trash${className ? ` ${className}` : ""}`, icon: isHovered ? ((0, jsx_runtime_1.jsx)(SImg, { src: `${constants_1.staticLink}/public/iconButton/trash_open.svg`, alt: "trash_open" })) : ((0, jsx_runtime_1.jsx)(SImg, { src: `${constants_1.staticLink}/public/iconButton/trash.svg`, alt: "trash" })) }));
+};
+exports.GalleryDeleteIcon = GalleryDeleteIcon;

package/build/modules/gallery/ui/PlaceholderItemsGallery.d.ts

@@ -0,0 +1 @@
+export declare const PlaceholderItemsGallery: () => import("react/jsx-runtime").JSX.Element;

package/build/modules/gallery/ui/PlaceholderItemsGallery.js

@@ -0,0 +1,71 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PlaceholderItemsGallery = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_loading_skeleton_1 = __importDefault(require("react-loading-skeleton"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("../../../styles/ScreenWidth");
+const SWrapper = styled_components_1.default.div `
+  padding: 8px;
+  display: flex;
+  gap: 16px;
+
+  & > :last-child {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .first {
+    border-radius: 6px;
+    height: 32px;
+    width: 32px;
+  }
+
+  .second {
+    border-radius: 3px;
+    height: 14px;
+    width: 110px;
+  }
+
+  .third {
+    border-radius: 3px;
+    height: 12px;
+    width: 67px;
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    padding: ${(0, _4k_1.adaptiveValueCalc)(8)};
+    gap: ${(0, _4k_1.adaptiveValueCalc)(16)};
+
+    & > :last-child {
+      gap: ${(0, _4k_1.adaptiveValueCalc)(6)};
+    }
+
+    .first {
+      border-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+      height: ${(0, _4k_1.adaptiveValueCalc)(32)};
+      width: ${(0, _4k_1.adaptiveValueCalc)(32)};
+    }
+
+    .second {
+      border-radius: ${(0, _4k_1.adaptiveValueCalc)(3)};
+      height: ${(0, _4k_1.adaptiveValueCalc)(14)};
+      width: ${(0, _4k_1.adaptiveValueCalc)(110)};
+    }
+
+    .third {
+      border-radius: ${(0, _4k_1.adaptiveValueCalc)(3)};
+      height: ${(0, _4k_1.adaptiveValueCalc)(12)};
+      width: ${(0, _4k_1.adaptiveValueCalc)(67)};
+    }
+  }
+`;
+const PlaceholderItemsGallery = () => {
+    return ((0, jsx_runtime_1.jsxs)(SWrapper, { children: [(0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { baseColor: "#CFD5EA", className: "first" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { baseColor: "#CFD5EA", className: "second" }), (0, jsx_runtime_1.jsx)(react_loading_skeleton_1.default, { baseColor: "#CFD5EA", className: "third" })] })] }));
+};
+exports.PlaceholderItemsGallery = PlaceholderItemsGallery;

package/build/modules/gallery/ui/STopSections.d.ts

@@ -0,0 +1 @@
+export declare const STopSections: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/build/modules/gallery/ui/STopSections.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.STopSections = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("../../../styles/ScreenWidth");
+exports.STopSections = styled_components_1.default.div `
+  position: relative;
+  width: 1080px;
+  margin: 0 auto;
+  padding-top: 124px;
+  padding-bottom: 24px;
+
+  ${ScreenWidth_1.mediaQuery.maxWidthTablet} {
+    width: 704px;
+  }
+
+  ${ScreenWidth_1.mediaQuery.mobile} {
+    width: 320px;
+    padding-top: 80px;
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    width: ${(0, _4k_1.adaptiveValueCalc)(1080)};
+    padding-top: ${(0, _4k_1.adaptiveValueCalc)(124)};
+    padding-bottom: ${(0, _4k_1.adaptiveValueCalc)(24)};
+  }
+`;

package/build/modules/gallery/ui/chooseGalleryItems/chooseGalleryItem/index.d.ts

@@ -0,0 +1,7 @@
+import { TGallery } from '../../../../../entities/gallery/types';
+declare const ChooseItem: ({ galleryItem, handleIsSelected, isSelected, }: {
+    galleryItem: TGallery;
+    handleIsSelected: (arg: TGallery) => void;
+    isSelected: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export default ChooseItem;

package/build/modules/gallery/ui/chooseGalleryItems/chooseGalleryItem/index.js

@@ -0,0 +1,97 @@
+"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 vars_1 = require("../../../../../fonts/vars");
+const ScreenWidth_1 = require("../../../../../styles/ScreenWidth");
+const colors_1 = require("../../../../../styles/colors");
+const typography_1 = require("../../../../../styles/typography");
+const constants_1 = require("@ludo.ninja/core/build/constants");
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const styled_components_1 = __importDefault(require("styled-components"));
+// Styles
+const StyledChooseItem = styled_components_1.default.div `
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 6px 8px;
+  border-radius: 8px;
+  background-color: ${(props) => (props.isSelected ? colors_1.InactiveButtonColor : "none")};
+
+  .content-item-gallery-pic-default {
+    .image {
+      background-image: url("${(props) => props.isSelected
+    ? `${constants_1.staticLink}/public/gallery/defaultImageSelected.svg`
+    : `${constants_1.staticLink}/public/gallery/defaultImage.svg`}");
+      background-repeat: no-repeat;
+      background-position: center;
+      background-size: cover;
+    }
+  }
+
+  &:hover {
+    background-color: ${(props) => (props.isSelected ? "none" : colors_1.InactiveButtonColor)};
+
+    .content-item-gallery-pic-default {
+      .image {
+        background-image: url("${constants_1.staticLink}/gallery/defaultImageSelected.svg");
+      }
+    }
+  }
+
+  .content-item-wrapper {
+    display: flex;
+    align-items: center;
+  }
+
+  .content-item-gallery-pic,
+  .content-item-gallery-pic-default {
+    img,
+    svg {
+      border-radius: 6px;
+      width: 32px;
+      height: 32px;
+    }
+  }
+
+  .content-item-gallery-name {
+    margin-left: 16px;
+
+    .name {
+      ${typography_1.FH6};
+      color: ${colors_1.BlackColor};
+    }
+
+    .items-count {
+      font-family: ${vars_1.dmsansFontVarCss.css};
+      ${typography_1.FH7};
+      color: ${colors_1.TextGrayColor};
+    }
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    padding: ${(0, _4k_1.adaptiveValueCalc)(6)} ${(0, _4k_1.adaptiveValueCalc)(8)};
+    border-radius: ${(0, _4k_1.adaptiveValueCalc)(8)};
+
+    .content-item-gallery-pic,
+    .content-item-gallery-pic-default {
+      img,
+      svg {
+        border-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+        width: ${(0, _4k_1.adaptiveValueCalc)(32)};
+        height: ${(0, _4k_1.adaptiveValueCalc)(32)};
+      }
+    }
+
+    .content-item-gallery-name {
+      margin-left: ${(0, _4k_1.adaptiveValueCalc)(16)};
+    }
+  }
+`;
+// Component
+const ChooseItem = ({ galleryItem, handleIsSelected, isSelected, }) => ((0, jsx_runtime_1.jsx)(StyledChooseItem, { isSelected: isSelected, onClick: () => handleIsSelected(galleryItem), children: (0, jsx_runtime_1.jsxs)("div", { className: "content-item-wrapper", children: [(0, jsx_runtime_1.jsx)("div", { className: "content-item-gallery-pic-default", children: (0, jsx_runtime_1.jsx)("div", { className: "image" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "content-item-gallery-name", children: [(0, jsx_runtime_1.jsx)("p", { className: "name", children: galleryItem.name }), (0, jsx_runtime_1.jsx)("span", { className: `items-count`, children: galleryItem.itemsCount })] })] }) }));
+// Export
+exports.default = ChooseItem;

package/build/modules/gallery/ui/chooseGalleryItems/index.d.ts

@@ -0,0 +1,15 @@
+import { ApolloError } from "@apollo/client";
+interface IGalleryItems {
+    setAddGallery: (value: boolean) => void;
+    addMethod: (galleryId: string, ids: string[]) => void;
+    title: string;
+    titleBtn: string;
+    ids: string[];
+    isAdded: boolean;
+    error: ApolloError | undefined;
+    currentMyGalleryId?: false | string | undefined;
+}
+declare const ChooseGalleryItems: ({ isGetMyGalleries, ...props }: IGalleryItems & {
+    isGetMyGalleries?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export default ChooseGalleryItems;