{"ast":null,"code":"import { jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport cn from 'classnames';\nimport Button from 'components/gui/Button';\nimport Slideshow from 'components/slideshow/Slideshow';\nimport SlideshowInline from 'components/slideshowInline/SlideshowInline';\nimport { useIsDesktop } from 'hooks/useIsDevice';\nimport { useState } from 'react';\nimport SliceIntro from 'slices/SliceIntro/SliceIntro';\nimport styles from './PicturesSlice.module.scss';\nimport CircleButton from 'components/gui/CircleButton';\nimport Matterport from 'components/matterport/Matterport';\n\nconst GridItem = ({\n  src,\n  onClick,\n  className\n}) => {\n  return /*#__PURE__*/_jsx(\"div\", {\n    className: cn(styles.gridItem, className),\n    children: /*#__PURE__*/_jsx(\"img\", {\n      onClick: onClick && (() => onClick(src)),\n      src: src\n    })\n  });\n}; // Mobile\n\n\nconst PicturesSlideshow = ({\n  pictures,\n  onClick,\n  on3D\n}) => {\n  const {\n    0: index,\n    1: setIndex\n  } = useState(0);\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [/*#__PURE__*/_jsx(SlideshowInline, {\n      items: pictures,\n      renderItem: (item, itemStyle, i) => /*#__PURE__*/_jsx(GridItem, {\n        className: itemStyle,\n        src: item,\n        onClick: onClick\n      }, item),\n      onIndexChange: index => setIndex(index)\n    }), /*#__PURE__*/_jsx(CircleButton, {\n      onClick: () => onClick(pictures[index]),\n      className: cn(styles.openButton),\n      icon: \"fullScreen\"\n    }), on3D && /*#__PURE__*/_jsx(CircleButton, {\n      onClick: () => on3D(),\n      className: cn(styles.threeDButton),\n      icon: \"3d\"\n    })]\n  });\n}; // Desktop\n\n\nconst PicturesGrid = ({\n  pictures,\n  onClick\n}) => {\n  return /*#__PURE__*/_jsx(\"div\", {\n    className: cn(styles.grid),\n    children: pictures.map((picture, i) => {\n      return /*#__PURE__*/_jsx(GridItem, {\n        src: picture,\n        onClick: onClick\n      }, i + '-' + picture);\n    })\n  });\n}; //\n\n\nconst PicturesSlice = ({\n  pictures,\n  introText,\n  matterport\n}) => {\n  const isDesktop = useIsDesktop();\n  const {\n    0: openSlideshowWithSrc,\n    1: setOpenSlideshowWithSrc\n  } = useState();\n  const {\n    0: show3D,\n    1: setShow3D\n  } = useState(false);\n\n  const openFullScreen = src => {\n    setOpenSlideshowWithSrc(src);\n  };\n\n  return /*#__PURE__*/_jsxs(\"section\", {\n    className: cn(styles.picturesSlice),\n    children: [/*#__PURE__*/_jsx(SliceIntro, {\n      text: introText\n    }), isDesktop ? /*#__PURE__*/_jsx(PicturesGrid, {\n      pictures: pictures,\n      onClick: openFullScreen\n    }) : /*#__PURE__*/_jsx(PicturesSlideshow, {\n      pictures: pictures,\n      onClick: openFullScreen,\n      on3D: matterport && (() => setShow3D(true))\n    }), show3D && /*#__PURE__*/_jsx(Matterport, {\n      src: matterport,\n      onClose: () => setShow3D(false)\n    }), openSlideshowWithSrc && /*#__PURE__*/_jsx(Slideshow // className={cn(styles.slideshow)}\n    , {\n      fullScreen: true,\n      withArrows: true,\n      images: pictures,\n      openOn: openSlideshowWithSrc,\n      onClose: () => setOpenSlideshowWithSrc(null)\n    })]\n  });\n};\n\nexport default PicturesSlice;","map":null,"metadata":{},"sourceType":"module"}