@wayke-se/components-react 3.0.0-beta.4 → 3.0.0-beta.5

package/esbuild/lib.js

@@ -9,6 +9,7 @@ const shared = {
   bundle: true,
   minify: false,
   sourcemap: true,
+  splitting: false,
   logLevel: 'info',
   external: Object.keys(dependencies).concat(Object.keys(peerDependencies || {})),
   loader: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wayke-se/components-react",
-  "version": "3.0.0-beta.4",
+  "version": "3.0.0-beta.5",
   "description": "Wayke Components React",
   "module": "dist/index.mjs",
   "main": "dist/index.js",
@@ -53,7 +53,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "rimraf": "^3.0.2",
-    "styled-components": "^5.3.3",
+    "styled-components": "^5.3.5",
     "typescript": "^4.4.4"
   },
   "dependencies": {
@@ -64,7 +64,6 @@
     "graphql": "^16.0.1",
     "libphonenumber-js": "^1.9.42",
     "marked": "^4.0.3",
-    "pannellum-react": "^1.2.4",
     "react-compound-slider": "^3.3.1",
     "react-lazy-load": "^4.0.1",
     "react-slick": "^0.29.0",

package/src/components/Gallery/index.tsx

@@ -22,7 +22,6 @@ import { ButtonSecondary, ButtonContent } from '../Button/index';
 import Lightbox from '../Lightbox/index';
 import EmbededVideo from '../Video/EmbededVideo';
 import QuickNavEmbeded from '../Video/QuickNavEmbeded';
-import Sphere from '../Sphere/Sphere';
 import { notEmpty } from '../../utils/formats';
 import ThreeSixty from '../ThreeSixty/ThreeSixty';
 import { Media } from '../../@types/codegen';
@@ -132,36 +131,30 @@ const Gallery = ({ media, placeholderImage }: GalleryProps) => {
               beforeChange={beforeChange}
             >
               {!!media?.length ? (
-                media.map((m, i) => (
-                  <Item key={m.files[0].url || i}>
-                    {m.type === 'image' && (
-                      <Image
-                        src={
-                          m.files[0].formats.filter(notEmpty).find((x) => x.format === '1170x')?.url
-                        }
-                        alt={`Bild ${i + 1}`}
-                      />
-                    )}
-                    {m.type === 'threesixty' && (
-                      <ThreeSixty
-                        urls={m.files.map((x) => x.url)}
-                        visible={i === index}
-                        onDisableNavigation={onDisableNavigation}
-                        navigationDisabled={navigationDisabled}
-                      />
-                    )}
-                    {m.type === 'embedded' && <EmbededVideo src={m.files[0].url} index={i + 1} />}
-                    {m.type === 'sphere' && (
-                      <Sphere
-                        visible={i === index}
-                        url={m.files[0].url}
-                        preview={m.files[0].url}
-                        onDisableNavigation={onDisableNavigation}
-                        navigationDisabled={navigationDisabled}
-                      />
-                    )}
-                  </Item>
-                ))
+                media
+                  .filter((x) => x.type !== 'sphere')
+                  .map((m, i) => (
+                    <Item key={m.files[0].url || i}>
+                      {m.type === 'image' && (
+                        <Image
+                          src={
+                            m.files[0].formats.filter(notEmpty).find((x) => x.format === '1170x')
+                              ?.url
+                          }
+                          alt={`Bild ${i + 1}`}
+                        />
+                      )}
+                      {m.type === 'threesixty' && (
+                        <ThreeSixty
+                          urls={m.files.map((x) => x.url)}
+                          visible={i === index}
+                          onDisableNavigation={onDisableNavigation}
+                          navigationDisabled={navigationDisabled}
+                        />
+                      )}
+                      {m.type === 'embedded' && <EmbededVideo src={m.files[0].url} index={i + 1} />}
+                    </Item>
+                  ))
               ) : (
                 <Item key={placeholder}>
                   <Image src={placeholder} alt={`Bild 1`} />

package/src/components/Lightbox/index.tsx

@@ -3,7 +3,6 @@ import React from 'react';
 import { Wrapper, UiBlock, Item, Img, CloseBtn } from './wrapper';
 import { IconCancel } from '../Icon/index';
 import EmbeddedVideoLightbox from '../Video/EmbeddedVideoLightbox';
-import SphereLightbox from '../Sphere/SphereLightbox';
 import ThreeSixtyLightbox from '../ThreeSixty/ThreeSixtLightbox';
 import { Media } from '../../@types/codegen';
 
@@ -31,16 +30,17 @@ const Lightbox = ({ index, media, onClose }: LightboxProps) => {
   return (
     <Wrapper ref={(ref) => ref?.focus()} onKeyDown={onKeyDown} tabIndex={0}>
       <UiBlock onClick={onClose} aria-hidden />
-      {media.map((m, i) => (
-        <Item key={i} ref={index === i ? onRef : undefined}>
-          {m.type === 'image' && (
-            <Img id={`lightbox-image-${i}`} src={m.files[0].url} alt={`Bild ${i + 1}`} />
-          )}
-          {m.type === 'threesixty' && <ThreeSixtyLightbox urls={m.files.map((x) => x.url)} />}
-          {m.type === 'sphere' && <SphereLightbox url={m.files[0].url} />}
-          {m.type === 'embedded' && <EmbeddedVideoLightbox url={m.files[0].url} />}
-        </Item>
-      ))}
+      {media
+        .filter((x) => x.type !== 'sphere')
+        .map((m, i) => (
+          <Item key={i} ref={index === i ? onRef : undefined}>
+            {m.type === 'image' && (
+              <Img id={`lightbox-image-${i}`} src={m.files[0].url} alt={`Bild ${i + 1}`} />
+            )}
+            {m.type === 'threesixty' && <ThreeSixtyLightbox urls={m.files.map((x) => x.url)} />}
+            {m.type === 'embedded' && <EmbeddedVideoLightbox url={m.files[0].url} />}
+          </Item>
+        ))}
       <CloseBtn onClick={onClose} title="Stäng">
         <IconCancel block />
       </CloseBtn>