@vnejs/plugins.views.screens.gallery 0.1.5 → 0.1.6

package/view/components/GalleryItems.jsx

@@ -1,37 +0,0 @@
-import { useCallback } from "react";
-
-import { Flex, PositionBox, WrapWithContent } from "@vnejs/uis.react";
-
-export const GalleryItems = ({ currentItems = [], selectedIndex = -1, ...props } = {}) => {
-  const onSlotClick = useCallback((index) => props.emit(props.EVENTS.GALLERY.CHOOSE, { index }), []);
-
-  const renderSlot = useCallback(
-    (item, i) => {
-      if (item.isStub)
-        return (
-          <div
-            {...props.PARAMS.GALLERY.VIEW_PROPS.items.stub}
-            key={i}
-          />
-        );
-
-      return (
-        <WrapWithContent
-          {...props.PARAMS.GALLERY.VIEW_PROPS.items.item}
-          key={item.isOpened ? item.src : i}
-          value={i}
-          imageSrc={item.isOpened && item.src}
-          isSelected={selectedIndex === i}
-          onClick={item.isOpened ? onSlotClick : undefined}
-        />
-      );
-    },
-    [selectedIndex],
-  );
-
-  return (
-    <PositionBox {...props.PARAMS.GALLERY.VIEW_PROPS.items.position}>
-      <Flex {...props.PARAMS.GALLERY.VIEW_PROPS.items.flex}>{currentItems.map(renderSlot)}</Flex>
-    </PositionBox>
-  );
-};

package/view/components/GalleryPages.jsx

@@ -1,16 +0,0 @@
-import { useCallback, useMemo } from "react";
-
-import { PageSelector, PositionBox } from "@vnejs/uis.react";
-
-export const GalleryPages = ({ pagesCount, currentPage, ...props } = {}) => {
-  const onPrevPage = useCallback(() => props.emit(props.EVENTS.GALLERY.PAGE_SET, { page: currentPage - 1 }), []);
-  const onNextPage = useCallback(() => props.emit(props.EVENTS.GALLERY.PAGE_SET, { page: currentPage + 1 }), []);
-
-  const propsSelector = useMemo(() => ({ onPrevPage, onNextPage, pagesCount, page: currentPage + 1, pagesMinCount: 1 }), [currentPage, pagesCount]);
-
-  return (
-    <PositionBox {...props.PARAMS.GALLERY.VIEW_PROPS.pages.position}>
-      <PageSelector {...propsSelector} />
-    </PositionBox>
-  );
-};

package/view/components/index.js

@@ -1,4 +0,0 @@
-export * from "./GalleryClose";
-export * from "./GalleryControls";
-export * from "./GalleryItems";
-export * from "./GalleryPages";

package/view/index.jsx

@@ -1,33 +0,0 @@
-import { useEffect, useMemo, useState } from "react";
-import { createRoot } from "react-dom/client";
-
-import { Screen } from "@vnejs/uis.react";
-
-import { GalleryClose, GalleryControls, GalleryItems, GalleryPages } from "./components";
-
-const Gallery = ({ store, onMount, ...props } = {}) => {
-  const [state, setState] = useState({});
-
-  const { isShow = false, isForce = false, locs = {}, bgSrc = "" } = state;
-  const { currentType = "", currentItems = [], pages, currentColumn = null, currentRow = null, currentPage } = state;
-  const selectedIndex = currentColumn !== null && currentRow !== null ? currentColumn + currentRow * 3 : -1;
-
-  useEffect(() => store.subscribe(setState), []);
-  useEffect(() => void onMount(), []);
-
-  const propsScreen = useMemo(() => ({ ...props.PARAMS.GALLERY.VIEW_PROPS.screen, isShow, isForce, bgSrc }), [isShow, isForce, bgSrc]);
-  const propsControls = useMemo(() => ({ ...props, currentType, locs }), [currentType, locs]);
-  const propsPages = useMemo(() => ({ ...props, pagesCount: pages, currentPage }), [pages, currentPage]);
-  const propsItems = useMemo(() => ({ ...props, currentItems, currentType, selectedIndex, locs }), [currentItems, currentType, selectedIndex, locs]);
-
-  return (
-    <Screen {...propsScreen}>
-      <GalleryControls {...propsControls} />
-      <GalleryPages {...propsPages} />
-      <GalleryItems {...propsItems} />
-      <GalleryClose {...props} />
-    </Screen>
-  );
-};
-
-export const render = (props, root) => createRoot(root).render(<Gallery {...props} />);