@wayke-se/components-react 3.0.0-beta.5 → 3.0.0-beta.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +841 -1871
- package/dist/index.js.map +4 -4
- package/dist/index.mjs +822 -1852
- package/dist/index.mjs.map +4 -4
- package/package.json +1 -1
- package/src/components/Gallery/index.tsx +6 -1
package/dist/index.mjs
CHANGED
|
@@ -2310,12 +2310,6 @@ var IconChevronLeft = ({ block }) => /* @__PURE__ */ React4.createElement(Icon2,
|
|
|
2310
2310
|
}, /* @__PURE__ */ React4.createElement("path", {
|
|
2311
2311
|
d: "M13 17.7L4.3 9 13 .3l.7.7-8 8 8 8-.7.7z"
|
|
2312
2312
|
}));
|
|
2313
|
-
var IconChevronRight = ({ block }) => /* @__PURE__ */ React4.createElement(Icon2, {
|
|
2314
|
-
viewBox: "0 0 18 18",
|
|
2315
|
-
block
|
|
2316
|
-
}, /* @__PURE__ */ React4.createElement("path", {
|
|
2317
|
-
d: "M5 .3L13.7 9 5 17.7l-.7-.7 8-8-8-8L5 .3z"
|
|
2318
|
-
}));
|
|
2319
2313
|
var IconCheck = ({ block }) => /* @__PURE__ */ React4.createElement(Icon2, {
|
|
2320
2314
|
viewBox: "0 0 16 16",
|
|
2321
2315
|
block
|
|
@@ -4522,7 +4516,7 @@ var WaykeSearch = ({
|
|
|
4522
4516
|
var search_default = WaykeSearch;
|
|
4523
4517
|
|
|
4524
4518
|
// src/layouts/searchItem/index.tsx
|
|
4525
|
-
import
|
|
4519
|
+
import React83, { useMemo as useMemo6, useRef as useRef3, useCallback as useCallback34, useEffect as useEffect14 } from "react";
|
|
4526
4520
|
import WaykeEcomWeb from "@wayke-se/ecom-web";
|
|
4527
4521
|
|
|
4528
4522
|
// src/components/PriceTable/index.tsx
|
|
@@ -4801,1397 +4795,175 @@ var ExtendContent = ({ children, actionTitle, onClick }) => {
|
|
|
4801
4795
|
var ExtendContent_default = ExtendContent;
|
|
4802
4796
|
|
|
4803
4797
|
// src/components/Gallery/index.tsx
|
|
4804
|
-
import
|
|
4805
|
-
import Slider3 from "react-slick";
|
|
4798
|
+
import React38, { useState as useState9, useCallback as useCallback14, useRef as useRef2, useMemo as useMemo3 } from "react";
|
|
4806
4799
|
import scrollIntoView from "scroll-into-view-if-needed";
|
|
4807
|
-
|
|
4808
|
-
|
|
4809
|
-
|
|
4810
|
-
|
|
4811
|
-
|
|
4812
|
-
|
|
4813
|
-
|
|
4814
|
-
|
|
4815
|
-
|
|
4800
|
+
var Gallery = ({ media, placeholderImage }) => {
|
|
4801
|
+
const slider = useRef2(null);
|
|
4802
|
+
const quickNavRef = useRef2(null);
|
|
4803
|
+
const isDragging = useRef2(false);
|
|
4804
|
+
const [index2, setIndex] = useState9(0);
|
|
4805
|
+
const [lightbox, setLightbox] = useState9(false);
|
|
4806
|
+
const [navigationDisabled, setNavigationDisabled] = useState9(false);
|
|
4807
|
+
const beforeChange = useCallback14((_, newIndex) => {
|
|
4808
|
+
const element = quickNavRef.current?.querySelectorAll("li")?.[newIndex];
|
|
4809
|
+
if (element) {
|
|
4810
|
+
scrollIntoView(element, { scrollMode: "if-needed", block: "nearest", inline: "nearest" });
|
|
4816
4811
|
}
|
|
4817
|
-
|
|
4818
|
-
|
|
4819
|
-
|
|
4820
|
-
|
|
4821
|
-
|
|
4822
|
-
margin-right: ${size(-2)};
|
|
4812
|
+
setIndex(newIndex);
|
|
4813
|
+
}, []);
|
|
4814
|
+
const onMouseDown = useCallback14(() => {
|
|
4815
|
+
if (isDragging.current) {
|
|
4816
|
+
isDragging.current = false;
|
|
4823
4817
|
}
|
|
4824
|
-
}
|
|
4818
|
+
}, []);
|
|
4819
|
+
const onMouseMove = useCallback14(() => {
|
|
4820
|
+
if (!isDragging.current) {
|
|
4821
|
+
isDragging.current = true;
|
|
4822
|
+
}
|
|
4823
|
+
}, []);
|
|
4824
|
+
const onClick = useCallback14(() => {
|
|
4825
|
+
pubsub_default.publish("ImagesClick");
|
|
4826
|
+
if (!isDragging.current && !lightbox && !!media?.length) {
|
|
4827
|
+
setLightbox(true);
|
|
4828
|
+
}
|
|
4829
|
+
}, [lightbox, media]);
|
|
4830
|
+
const nextImage = useCallback14(() => {
|
|
4831
|
+
if (!slider || !slider.current) {
|
|
4832
|
+
return;
|
|
4833
|
+
}
|
|
4834
|
+
slider.current.slickNext();
|
|
4835
|
+
}, [slider]);
|
|
4836
|
+
const prevImage = useCallback14(() => {
|
|
4837
|
+
if (!slider || !slider.current) {
|
|
4838
|
+
return;
|
|
4839
|
+
}
|
|
4840
|
+
slider.current.slickPrev();
|
|
4841
|
+
}, [slider]);
|
|
4842
|
+
const goTo = (target) => {
|
|
4843
|
+
if (!slider || !slider.current) {
|
|
4844
|
+
return;
|
|
4845
|
+
}
|
|
4846
|
+
if (slider.current) {
|
|
4847
|
+
setIndex(target);
|
|
4848
|
+
slider.current.slickGoTo(target);
|
|
4849
|
+
}
|
|
4850
|
+
};
|
|
4851
|
+
const onDisableNavigation = () => {
|
|
4852
|
+
if (!isDragging.current)
|
|
4853
|
+
setNavigationDisabled(true);
|
|
4854
|
+
};
|
|
4855
|
+
const onEnableNavigation = (e) => {
|
|
4856
|
+
e.stopPropagation();
|
|
4857
|
+
isDragging.current = false;
|
|
4858
|
+
setNavigationDisabled(false);
|
|
4859
|
+
};
|
|
4860
|
+
const onToggleLightbox = useCallback14(() => setLightbox(!lightbox), [lightbox]);
|
|
4861
|
+
const mediaLength = media?.length || 0;
|
|
4862
|
+
const placeholder = useMemo3(
|
|
4863
|
+
() => placeholderImage || DEFAULT_PLACEHOLDER_IMAGE,
|
|
4864
|
+
[placeholderImage]
|
|
4865
|
+
);
|
|
4866
|
+
return /* @__PURE__ */ React38.createElement("p", null, "heheh");
|
|
4867
|
+
};
|
|
4868
|
+
var Gallery_default = Gallery;
|
|
4825
4869
|
|
|
4826
|
-
|
|
4827
|
-
|
|
4828
|
-
|
|
4829
|
-
|
|
4830
|
-
|
|
4831
|
-
var Main = styled33.div`
|
|
4832
|
-
position: relative;
|
|
4833
|
-
height: 0;
|
|
4834
|
-
padding-bottom: 66.66666667%;
|
|
4870
|
+
// src/components/ProductPage/index.tsx
|
|
4871
|
+
import styled33 from "styled-components";
|
|
4872
|
+
var ProductPage = styled33.div`
|
|
4873
|
+
display: flex;
|
|
4874
|
+
flex-direction: column;
|
|
4835
4875
|
|
|
4836
4876
|
${(props) => props.theme.breakpoint.Md} {
|
|
4837
|
-
|
|
4838
|
-
}
|
|
4839
|
-
|
|
4840
|
-
.slick-slider,
|
|
4841
|
-
.slick-list,
|
|
4842
|
-
.slick-track,
|
|
4843
|
-
.slick-slide,
|
|
4844
|
-
.slick-slide > * {
|
|
4845
|
-
height: 100%;
|
|
4846
|
-
}
|
|
4847
|
-
|
|
4848
|
-
.slick-slide > * {
|
|
4849
|
-
font-size: 0;
|
|
4850
|
-
|
|
4851
|
-
> * {
|
|
4852
|
-
font-size: 1rem;
|
|
4853
|
-
}
|
|
4877
|
+
flex-direction: row;
|
|
4854
4878
|
}
|
|
4855
4879
|
`;
|
|
4856
|
-
var
|
|
4857
|
-
position: absolute;
|
|
4858
|
-
top: 0;
|
|
4859
|
-
bottom: 0;
|
|
4860
|
-
right: 0;
|
|
4861
|
-
width: ${quickNavWidth}px;
|
|
4862
|
-
padding-left: ${size(1)};
|
|
4863
|
-
|
|
4880
|
+
var ProductPageAside = styled33.div`
|
|
4864
4881
|
${(props) => props.theme.breakpoint.LtMd} {
|
|
4865
|
-
display:
|
|
4882
|
+
display: contents;
|
|
4866
4883
|
}
|
|
4867
4884
|
|
|
4868
|
-
|
|
4869
|
-
|
|
4870
|
-
|
|
4871
|
-
|
|
4872
|
-
left: 0;
|
|
4873
|
-
right: 0;
|
|
4874
|
-
height: ${size(2.5)};
|
|
4875
|
-
background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
|
|
4876
|
-
pointer-events: none;
|
|
4885
|
+
${(props) => props.theme.breakpoint.Md} {
|
|
4886
|
+
flex-shrink: 0;
|
|
4887
|
+
width: calc(375px + ${size(2)});
|
|
4888
|
+
padding-right: ${size(2)};
|
|
4877
4889
|
}
|
|
4878
4890
|
`;
|
|
4879
|
-
var
|
|
4880
|
-
position: relative;
|
|
4881
|
-
width: 100%;
|
|
4882
|
-
height: 100%;
|
|
4883
|
-
overflow: hidden;
|
|
4884
|
-
|
|
4885
|
-
:focus {
|
|
4886
|
-
outline: none;
|
|
4887
|
-
}
|
|
4888
|
-
|
|
4891
|
+
var ProductPageMain = styled33.div`
|
|
4889
4892
|
${(props) => props.theme.breakpoint.LtMd} {
|
|
4890
|
-
|
|
4891
|
-
transition: border-radius 150ms ease;
|
|
4893
|
+
display: contents;
|
|
4892
4894
|
}
|
|
4893
|
-
`;
|
|
4894
|
-
var SliderWrapper = styled33.div`
|
|
4895
|
-
position: absolute;
|
|
4896
|
-
top: 0;
|
|
4897
|
-
bottom: 0;
|
|
4898
|
-
left: 0;
|
|
4899
|
-
right: 0;
|
|
4900
|
-
|
|
4901
|
-
.slick-slider {
|
|
4902
|
-
position: absolute;
|
|
4903
|
-
top: 0;
|
|
4904
|
-
bottom: 0;
|
|
4905
|
-
left: 0;
|
|
4906
|
-
right: 0;
|
|
4907
|
-
user-select: none;
|
|
4908
|
-
touch-action: pan-y;
|
|
4909
|
-
-webkit-tap-highlight-color: transparent;
|
|
4910
4895
|
|
|
4911
|
-
|
|
4912
|
-
|
|
4913
|
-
|
|
4914
|
-
}
|
|
4896
|
+
${(props) => props.theme.breakpoint.Md} {
|
|
4897
|
+
flex: 1 1 100%;
|
|
4898
|
+
min-width: 0;
|
|
4899
|
+
padding-left: ${size(2)};
|
|
4915
4900
|
}
|
|
4901
|
+
`;
|
|
4902
|
+
var ProductPageAsideSection = styled33.div`
|
|
4903
|
+
${(props) => props.theme.breakpoint.LtMd} {
|
|
4904
|
+
order: ${(props) => props.mobileOrder};
|
|
4916
4905
|
|
|
4917
|
-
|
|
4918
|
-
|
|
4919
|
-
display: block;
|
|
4920
|
-
margin: 0;
|
|
4921
|
-
padding: 0;
|
|
4922
|
-
overflow: hidden;
|
|
4923
|
-
|
|
4924
|
-
&:focus {
|
|
4925
|
-
outline: none;
|
|
4926
|
-
}
|
|
4927
|
-
|
|
4928
|
-
&.dragging {
|
|
4929
|
-
cursor: pointer;
|
|
4930
|
-
cursor: hand;
|
|
4906
|
+
& + & {
|
|
4907
|
+
margin-top: ${size(2)};
|
|
4931
4908
|
}
|
|
4932
|
-
}
|
|
4933
4909
|
|
|
4934
|
-
|
|
4935
|
-
|
|
4936
|
-
top: 0;
|
|
4937
|
-
left: 0;
|
|
4938
|
-
display: block;
|
|
4939
|
-
margin-left: auto;
|
|
4940
|
-
margin-right: auto;
|
|
4941
|
-
|
|
4942
|
-
&::before,
|
|
4943
|
-
&::after {
|
|
4944
|
-
content: '';
|
|
4945
|
-
display: table;
|
|
4910
|
+
:last-child {
|
|
4911
|
+
margin-bottom: ${size(4)};
|
|
4946
4912
|
}
|
|
4947
4913
|
|
|
4948
|
-
|
|
4949
|
-
|
|
4914
|
+
${ProductPageMain} & {
|
|
4915
|
+
margin-top: ${size(2)};
|
|
4950
4916
|
}
|
|
4951
4917
|
}
|
|
4952
4918
|
|
|
4953
|
-
.
|
|
4954
|
-
|
|
4955
|
-
|
|
4956
|
-
min-height: 1px;
|
|
4957
|
-
}
|
|
4958
|
-
|
|
4959
|
-
.slick-loading {
|
|
4960
|
-
.slick-track {
|
|
4961
|
-
visibility: hidden;
|
|
4962
|
-
}
|
|
4963
|
-
|
|
4964
|
-
img {
|
|
4965
|
-
display: none;
|
|
4919
|
+
${(props) => props.theme.breakpoint.Md} {
|
|
4920
|
+
& + & {
|
|
4921
|
+
margin-top: ${size(4)};
|
|
4966
4922
|
}
|
|
4967
|
-
}
|
|
4968
4923
|
|
|
4969
|
-
|
|
4970
|
-
|
|
4971
|
-
display: block;
|
|
4924
|
+
${ProductPageMain} & {
|
|
4925
|
+
margin-bottom: ${size(8)};
|
|
4972
4926
|
}
|
|
4973
4927
|
}
|
|
4974
|
-
|
|
4975
|
-
|
|
4976
|
-
pointer-events: none;
|
|
4977
|
-
}
|
|
4978
|
-
|
|
4928
|
+
`;
|
|
4929
|
+
var ProductPageMainSection = styled33.div`
|
|
4979
4930
|
${(props) => props.theme.breakpoint.LtMd} {
|
|
4980
|
-
|
|
4981
|
-
|
|
4982
|
-
|
|
4983
|
-
overflow: visible;
|
|
4984
|
-
width: 95%;
|
|
4985
|
-
}
|
|
4931
|
+
order: 99;
|
|
4932
|
+
padding: ${size(4)} 0;
|
|
4933
|
+
border-top: ${size(1)} solid ${(props) => props.theme.color.accent};
|
|
4986
4934
|
|
|
4987
|
-
|
|
4988
|
-
|
|
4989
|
-
|
|
4990
|
-
|
|
4991
|
-
|
|
4935
|
+
${Wrapper} & {
|
|
4936
|
+
margin-left: ${size(-2)};
|
|
4937
|
+
margin-right: ${size(-2)};
|
|
4938
|
+
padding-left: ${size(2)};
|
|
4939
|
+
padding-right: ${size(2)};
|
|
4992
4940
|
}
|
|
4941
|
+
}
|
|
4993
4942
|
|
|
4994
|
-
|
|
4995
|
-
|
|
4996
|
-
|
|
4997
|
-
${
|
|
4998
|
-
|
|
4999
|
-
border-bottom-left-radius: 0;
|
|
5000
|
-
}
|
|
4943
|
+
${(props) => props.theme.breakpoint.Md} {
|
|
4944
|
+
& + & {
|
|
4945
|
+
margin-top: ${size(8)};
|
|
4946
|
+
padding-top: ${size(8)};
|
|
4947
|
+
border-top: 1px solid ${(props) => props.theme.color.border};
|
|
5001
4948
|
}
|
|
5002
4949
|
}
|
|
5003
4950
|
`;
|
|
5004
|
-
var
|
|
5005
|
-
|
|
5006
|
-
position: absolute;
|
|
5007
|
-
left: 0;
|
|
5008
|
-
top: 0;
|
|
5009
|
-
right: 0;
|
|
5010
|
-
bottom: 0;
|
|
5011
|
-
margin: auto;
|
|
5012
|
-
max-width: 100%;
|
|
5013
|
-
max-height: 100%;
|
|
5014
|
-
object-fit: cover;
|
|
5015
|
-
cursor: pointer;
|
|
5016
|
-
`;
|
|
5017
|
-
var ImageFull = styled33.img`
|
|
5018
|
-
display: block;
|
|
5019
|
-
position: absolute;
|
|
5020
|
-
top: 0;
|
|
5021
|
-
left: 0;
|
|
5022
|
-
width: 100%;
|
|
5023
|
-
height: 100%;
|
|
5024
|
-
object-fit: cover;
|
|
4951
|
+
var ProductPageContentLimit = styled33.div`
|
|
4952
|
+
max-width: 420px;
|
|
5025
4953
|
`;
|
|
5026
|
-
var Arrow = styled33(ButtonReset)`
|
|
5027
|
-
position: absolute;
|
|
5028
|
-
top: 50%;
|
|
5029
|
-
transform: translateY(-50%);
|
|
5030
|
-
display: flex;
|
|
5031
|
-
align-items: center;
|
|
5032
|
-
justify-content: center;
|
|
5033
|
-
width: ${size(4)};
|
|
5034
|
-
height: ${size(4)};
|
|
5035
|
-
border-radius: 50%;
|
|
5036
|
-
font-size: 1rem;
|
|
5037
|
-
line-height: 1;
|
|
5038
|
-
background-color: rgba(255, 255, 255, 0.4);
|
|
5039
|
-
backdrop-filter: blur(5px);
|
|
5040
|
-
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
5041
|
-
color: ${(props) => props.theme.color.textDark};
|
|
5042
|
-
transform-origin: 50% 50%;
|
|
5043
|
-
transition: transform 200ms ease;
|
|
5044
|
-
|
|
5045
|
-
:before {
|
|
5046
|
-
content: '';
|
|
5047
|
-
position: absolute;
|
|
5048
|
-
top: 0;
|
|
5049
|
-
bottom: 0;
|
|
5050
|
-
left: 0;
|
|
5051
|
-
right: 0;
|
|
5052
|
-
border-radius: 50%;
|
|
5053
|
-
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
|
|
5054
|
-
opacity: 0;
|
|
5055
|
-
transition: opacity 200ms ease;
|
|
5056
|
-
}
|
|
5057
|
-
|
|
5058
|
-
:hover {
|
|
5059
|
-
:before {
|
|
5060
|
-
opacity: 1;
|
|
5061
|
-
}
|
|
5062
|
-
}
|
|
5063
4954
|
|
|
5064
|
-
|
|
5065
|
-
|
|
5066
|
-
}
|
|
4955
|
+
// src/hooks/useSearchItem.ts
|
|
4956
|
+
import { useQuery } from "@apollo/client";
|
|
5067
4957
|
|
|
5068
|
-
|
|
5069
|
-
|
|
5070
|
-
|
|
5071
|
-
|
|
5072
|
-
|
|
5073
|
-
|
|
5074
|
-
|
|
5075
|
-
|
|
5076
|
-
|
|
5077
|
-
`;
|
|
5078
|
-
var QuickNav = styled33.ul`
|
|
5079
|
-
position: relative;
|
|
5080
|
-
max-height: 100%;
|
|
5081
|
-
list-style: none;
|
|
5082
|
-
padding: 0;
|
|
5083
|
-
margin: 0;
|
|
5084
|
-
overflow: auto;
|
|
5085
|
-
-webkit-overflow-scrolling: touch;
|
|
5086
|
-
`;
|
|
5087
|
-
var QuickNavItem = styled33.li.attrs(() => ({
|
|
5088
|
-
className: "wayke__theme wayke__color--primary-text"
|
|
5089
|
-
}))`
|
|
5090
|
-
position: relative;
|
|
5091
|
-
|
|
5092
|
-
& + & {
|
|
5093
|
-
margin-top: ${size(1)};
|
|
5094
|
-
}
|
|
5095
|
-
|
|
5096
|
-
${({ active }) => active && css12`
|
|
5097
|
-
:before {
|
|
5098
|
-
content: '';
|
|
5099
|
-
position: absolute;
|
|
5100
|
-
top: 0;
|
|
5101
|
-
left: 0;
|
|
5102
|
-
width: 100%;
|
|
5103
|
-
height: 100%;
|
|
5104
|
-
border: 3px solid currentColor;
|
|
5105
|
-
z-index: 2;
|
|
5106
|
-
}
|
|
5107
|
-
`}
|
|
5108
|
-
`;
|
|
5109
|
-
var QuickNavBtn = styled33(ButtonReset)`
|
|
5110
|
-
position: relative;
|
|
5111
|
-
display: block;
|
|
5112
|
-
width: 100%;
|
|
5113
|
-
height: 0;
|
|
5114
|
-
padding-bottom: 66.66666667%; // 3:2
|
|
5115
|
-
transform-origin: 50% 50%;
|
|
5116
|
-
transition: transform 300ms cubic-bezier(0.47, 1.64, 0.41, 0.8);
|
|
5117
|
-
|
|
5118
|
-
:before {
|
|
5119
|
-
content: '';
|
|
5120
|
-
position: absolute;
|
|
5121
|
-
top: 0;
|
|
5122
|
-
left: 0;
|
|
5123
|
-
width: 100%;
|
|
5124
|
-
height: 100%;
|
|
5125
|
-
background-color: rgba(0, 0, 0, 0.15);
|
|
5126
|
-
opacity: 0;
|
|
5127
|
-
z-index: 1;
|
|
5128
|
-
transition: opacity 150ms ease;
|
|
5129
|
-
}
|
|
5130
|
-
|
|
5131
|
-
:hover {
|
|
5132
|
-
:before {
|
|
5133
|
-
opacity: 1;
|
|
5134
|
-
}
|
|
5135
|
-
}
|
|
5136
|
-
|
|
5137
|
-
:active {
|
|
5138
|
-
transform: scale(0.95);
|
|
5139
|
-
}
|
|
5140
|
-
`;
|
|
5141
|
-
var QuickNavImg = styled33.img`
|
|
5142
|
-
display: block;
|
|
5143
|
-
position: absolute;
|
|
5144
|
-
top: 0;
|
|
5145
|
-
left: 0;
|
|
5146
|
-
width: 100%;
|
|
5147
|
-
height: 100%;
|
|
5148
|
-
object-fit: cover;
|
|
5149
|
-
`;
|
|
5150
|
-
var MediaButtonWrapper = styled33.div`
|
|
5151
|
-
position: absolute;
|
|
5152
|
-
bottom: ${size(2)};
|
|
5153
|
-
left: 50%;
|
|
5154
|
-
transform: translateX(-50%);
|
|
5155
|
-
z-index: 1;
|
|
5156
|
-
`;
|
|
5157
|
-
var EnableNavigationButton = styled33.div`
|
|
5158
|
-
position: absolute;
|
|
5159
|
-
bottom: ${size(2)};
|
|
5160
|
-
left: 50%;
|
|
5161
|
-
transform: translateX(-50%);
|
|
5162
|
-
z-index: 1;
|
|
5163
|
-
`;
|
|
5164
|
-
|
|
5165
|
-
// src/components/Lightbox/index.tsx
|
|
5166
|
-
import React45 from "react";
|
|
5167
|
-
|
|
5168
|
-
// src/components/Lightbox/wrapper.tsx
|
|
5169
|
-
import styled34 from "styled-components";
|
|
5170
|
-
var Wrapper18 = styled34.div`
|
|
5171
|
-
position: fixed;
|
|
5172
|
-
top: 0;
|
|
5173
|
-
bottom: 0;
|
|
5174
|
-
left: 0;
|
|
5175
|
-
right: 0;
|
|
5176
|
-
padding: ${size(3)};
|
|
5177
|
-
z-index: 90;
|
|
5178
|
-
overflow: auto;
|
|
5179
|
-
|
|
5180
|
-
${(props) => props.theme.breakpoint.LtSm} {
|
|
5181
|
-
padding: ${size(2)};
|
|
5182
|
-
}
|
|
5183
|
-
`;
|
|
5184
|
-
var UiBlock2 = styled34.div.attrs(() => ({
|
|
5185
|
-
role: "button"
|
|
5186
|
-
}))`
|
|
5187
|
-
position: fixed;
|
|
5188
|
-
top: 0;
|
|
5189
|
-
bottom: 0;
|
|
5190
|
-
left: 0;
|
|
5191
|
-
right: 0;
|
|
5192
|
-
background-color: rgba(0, 0, 0, 0.3);
|
|
5193
|
-
z-index: -1;
|
|
5194
|
-
`;
|
|
5195
|
-
var Item9 = styled34.div`
|
|
5196
|
-
position: relative;
|
|
5197
|
-
|
|
5198
|
-
& + & {
|
|
5199
|
-
margin-top: ${size(1)};
|
|
5200
|
-
}
|
|
5201
|
-
`;
|
|
5202
|
-
var Img2 = styled34.img`
|
|
5203
|
-
position: relative;
|
|
5204
|
-
display: block;
|
|
5205
|
-
max-width: 100%;
|
|
5206
|
-
max-height: calc(100vh - ${size(6)});
|
|
5207
|
-
margin: 0 auto;
|
|
5208
|
-
z-index: 1;
|
|
5209
|
-
|
|
5210
|
-
${(props) => props.theme.breakpoint.LtSm} {
|
|
5211
|
-
max-height: calc(100vh - ${size(4)});
|
|
5212
|
-
}
|
|
5213
|
-
`;
|
|
5214
|
-
var CloseBtn2 = styled34(ButtonReset)`
|
|
5215
|
-
display: flex;
|
|
5216
|
-
align-items: center;
|
|
5217
|
-
justify-content: center;
|
|
5218
|
-
position: fixed;
|
|
5219
|
-
top: ${size(2)};
|
|
5220
|
-
right: ${size(2)};
|
|
5221
|
-
width: ${size(5)};
|
|
5222
|
-
height: ${size(5)};
|
|
5223
|
-
border-radius: 50%;
|
|
5224
|
-
background-color: ${(props) => props.theme.color.bg};
|
|
5225
|
-
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
5226
|
-
transform-origin: 50% 50%;
|
|
5227
|
-
transition: 200ms ease, transform 300ms cubic-bezier(0.47, 1.64, 0.41, 0.8);
|
|
5228
|
-
z-index: 1;
|
|
5229
|
-
|
|
5230
|
-
:before {
|
|
5231
|
-
content: '';
|
|
5232
|
-
position: absolute;
|
|
5233
|
-
top: 0;
|
|
5234
|
-
left: 0;
|
|
5235
|
-
width: 100%;
|
|
5236
|
-
height: 100%;
|
|
5237
|
-
background-color: ${(props) => props.theme.color.hoverOverlay};
|
|
5238
|
-
border-radius: 50%;
|
|
5239
|
-
opacity: 0;
|
|
5240
|
-
transition: opacity 150ms ease;
|
|
5241
|
-
}
|
|
5242
|
-
|
|
5243
|
-
:hover {
|
|
5244
|
-
:before {
|
|
5245
|
-
opacity: 1;
|
|
5246
|
-
}
|
|
5247
|
-
}
|
|
5248
|
-
|
|
5249
|
-
:active {
|
|
5250
|
-
transform: scale(0.97);
|
|
5251
|
-
}
|
|
5252
|
-
|
|
5253
|
-
${(props) => props.theme.breakpoint.LtSm} {
|
|
5254
|
-
top: ${size(1)};
|
|
5255
|
-
right: ${size(1)};
|
|
5256
|
-
}
|
|
5257
|
-
`;
|
|
5258
|
-
|
|
5259
|
-
// src/components/Video/EmbeddedVideoLightbox.tsx
|
|
5260
|
-
import React41 from "react";
|
|
5261
|
-
|
|
5262
|
-
// src/components/Video/YoutubePlayer.tsx
|
|
5263
|
-
import React38 from "react";
|
|
5264
|
-
|
|
5265
|
-
// src/components/Video/utils.ts
|
|
5266
|
-
var getVimeoId = (url) => {
|
|
5267
|
-
const regExp = /\/(\d+)/;
|
|
5268
|
-
const match = url.match(regExp);
|
|
5269
|
-
return match && match[1].length > 3 ? match[1] : "";
|
|
5270
|
-
};
|
|
5271
|
-
var getYouTubeId = (url) => {
|
|
5272
|
-
const regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
|
|
5273
|
-
const match = url.match(regExp);
|
|
5274
|
-
return match && match[7].length === 11 ? match[7] : "";
|
|
5275
|
-
};
|
|
5276
|
-
var youtubeBase = "https://img.youtube.com/vi/";
|
|
5277
|
-
var getYoutubeThumbnail = (url) => {
|
|
5278
|
-
const id = getYouTubeId(url);
|
|
5279
|
-
if (!id) {
|
|
5280
|
-
return void 0;
|
|
5281
|
-
}
|
|
5282
|
-
return {
|
|
5283
|
-
maxresdefault: `${youtubeBase}${id}/maxresdefault.jpg`,
|
|
5284
|
-
hqdefault: `${youtubeBase}${id}/hqdefault.jpg`,
|
|
5285
|
-
mqdefault: `${youtubeBase}${id}/mqdefault.jpg`
|
|
5286
|
-
};
|
|
5287
|
-
};
|
|
5288
|
-
var onImageLoad = (e, thumbnail) => {
|
|
5289
|
-
if (thumbnail?.length === 2 && e.currentTarget.src === thumbnail[0] && e.currentTarget.naturalWidth === 120 && e.currentTarget.naturalHeight === 90) {
|
|
5290
|
-
e.currentTarget.src = thumbnail[1];
|
|
5291
|
-
}
|
|
5292
|
-
};
|
|
5293
|
-
var onImageError = (e, thumbnail) => {
|
|
5294
|
-
if (thumbnail?.length === 2) {
|
|
5295
|
-
e.currentTarget.src = thumbnail[1];
|
|
5296
|
-
}
|
|
5297
|
-
};
|
|
5298
|
-
|
|
5299
|
-
// src/components/Video/wrapper.tsx
|
|
5300
|
-
import styled35 from "styled-components";
|
|
5301
|
-
var Wrapper19 = styled35.div`
|
|
5302
|
-
position: relative;
|
|
5303
|
-
width: 100%;
|
|
5304
|
-
height: ${(props) => props.isPreview ? "100%" : 0};
|
|
5305
|
-
padding-bottom: ${(props) => props.ratio ? props.ratio : "56.25%"};
|
|
5306
|
-
`;
|
|
5307
|
-
var Iframe = styled35.iframe.attrs(() => ({
|
|
5308
|
-
width: "100%",
|
|
5309
|
-
height: "100%",
|
|
5310
|
-
allowFullScreen: true,
|
|
5311
|
-
frameBorder: "0"
|
|
5312
|
-
}))`
|
|
5313
|
-
position: absolute;
|
|
5314
|
-
top: 0;
|
|
5315
|
-
left: 0;
|
|
5316
|
-
width: 100%;
|
|
5317
|
-
height: 100%;
|
|
5318
|
-
`;
|
|
5319
|
-
|
|
5320
|
-
// src/components/Video/YoutubePlayer.tsx
|
|
5321
|
-
var YouTubePlayer = ({ url, autoplay }) => /* @__PURE__ */ React38.createElement(Wrapper19, null, /* @__PURE__ */ React38.createElement(Iframe, {
|
|
5322
|
-
src: `https://www.youtube.com/embed/${getYouTubeId(url)}?&enablejsapi=1&?rel=0${autoplay ? "&autoplay=1" : ""}`
|
|
5323
|
-
}));
|
|
5324
|
-
var YoutubePlayer_default = YouTubePlayer;
|
|
5325
|
-
|
|
5326
|
-
// src/components/Video/VimeoPlayer.tsx
|
|
5327
|
-
import React39 from "react";
|
|
5328
|
-
var VimeoPlayer = ({ url, autoplay }) => /* @__PURE__ */ React39.createElement(Wrapper19, null, /* @__PURE__ */ React39.createElement(Iframe, {
|
|
5329
|
-
src: `https://player.vimeo.com/video/${getVimeoId(url)}?${autoplay ? "&autoplay=1" : ""}&loop=0&autopause=0`
|
|
5330
|
-
}));
|
|
5331
|
-
var VimeoPlayer_default = VimeoPlayer;
|
|
5332
|
-
|
|
5333
|
-
// src/components/Video/CustomPlayer.tsx
|
|
5334
|
-
import React40 from "react";
|
|
5335
|
-
|
|
5336
|
-
// src/components/Video/Video.tsx
|
|
5337
|
-
import styled36 from "styled-components";
|
|
5338
|
-
var Video = styled36.video`
|
|
5339
|
-
position: absolute;
|
|
5340
|
-
top: 0;
|
|
5341
|
-
left: 0;
|
|
5342
|
-
object-fit: ${({ modal }) => modal ? "contain" : "cover"};
|
|
5343
|
-
`;
|
|
5344
|
-
var Video_default = Video;
|
|
5345
|
-
|
|
5346
|
-
// src/components/Video/CustomPlayer.tsx
|
|
5347
|
-
var CustomPlayer = ({ url, controls, modal, ratio = "56.25%", isPreview }) => {
|
|
5348
|
-
return /* @__PURE__ */ React40.createElement(Wrapper19, {
|
|
5349
|
-
ratio,
|
|
5350
|
-
isPreview
|
|
5351
|
-
}, /* @__PURE__ */ React40.createElement(Video_default, {
|
|
5352
|
-
key: url,
|
|
5353
|
-
modal,
|
|
5354
|
-
preload: "metadata",
|
|
5355
|
-
controls,
|
|
5356
|
-
width: "100%",
|
|
5357
|
-
height: "100%",
|
|
5358
|
-
src: url
|
|
5359
|
-
}));
|
|
5360
|
-
};
|
|
5361
|
-
var CustomPlayer_default = CustomPlayer;
|
|
5362
|
-
|
|
5363
|
-
// src/components/Video/EmbeddedVideoLightbox.tsx
|
|
5364
|
-
var ytNames = ["youtube.com", "youtu.be"];
|
|
5365
|
-
var isYouTubeVideo = (url) => ytNames.some((host) => url.indexOf(host) >= 0);
|
|
5366
|
-
var vNames = ["vimeo.com"];
|
|
5367
|
-
var isVimeoVideo = (url) => vNames.some((host) => url.indexOf(host) >= 0);
|
|
5368
|
-
var VideoPlayer = ({ url, autoplay = false, controls = true }) => {
|
|
5369
|
-
if (!url)
|
|
5370
|
-
return null;
|
|
5371
|
-
if (isYouTubeVideo(url))
|
|
5372
|
-
return /* @__PURE__ */ React41.createElement(YoutubePlayer_default, {
|
|
5373
|
-
url,
|
|
5374
|
-
autoplay
|
|
5375
|
-
});
|
|
5376
|
-
if (isVimeoVideo(url))
|
|
5377
|
-
return /* @__PURE__ */ React41.createElement(VimeoPlayer_default, {
|
|
5378
|
-
url,
|
|
5379
|
-
autoplay
|
|
5380
|
-
});
|
|
5381
|
-
return /* @__PURE__ */ React41.createElement(CustomPlayer_default, {
|
|
5382
|
-
ratio: "56.25%",
|
|
5383
|
-
controls,
|
|
5384
|
-
url
|
|
5385
|
-
});
|
|
5386
|
-
};
|
|
5387
|
-
var EmbeddedVideoLightbox_default = VideoPlayer;
|
|
5388
|
-
|
|
5389
|
-
// src/components/ThreeSixty/ThreeSixtLightbox.tsx
|
|
5390
|
-
import React44, { useState as useState10, useCallback as useCallback14 } from "react";
|
|
5391
|
-
|
|
5392
|
-
// src/components/Gallery/MediaButton.tsx
|
|
5393
|
-
import React42 from "react";
|
|
5394
|
-
var MediaButton = ({ text, onClick }) => /* @__PURE__ */ React42.createElement(MediaButtonWrapper, null, /* @__PURE__ */ React42.createElement(ButtonSecondary, {
|
|
5395
|
-
onClick,
|
|
5396
|
-
title: text
|
|
5397
|
-
}, /* @__PURE__ */ React42.createElement(ButtonContent, null, text)));
|
|
5398
|
-
var MediaButton_default = MediaButton;
|
|
5399
|
-
|
|
5400
|
-
// src/components/ThreeSixty/Rotation.tsx
|
|
5401
|
-
import React43, { useState as useState9, useEffect as useEffect7, useRef as useRef2, cloneElement, Children } from "react";
|
|
5402
|
-
var calculateCurrentFrame = (startFrame, delta, length) => {
|
|
5403
|
-
const frame = (startFrame + delta) % length;
|
|
5404
|
-
if (frame < 0) {
|
|
5405
|
-
return frame + length;
|
|
5406
|
-
}
|
|
5407
|
-
return frame;
|
|
5408
|
-
};
|
|
5409
|
-
var Rotation = ({ children }) => {
|
|
5410
|
-
const startFrame = useRef2(0);
|
|
5411
|
-
const pointerPosition = useRef2();
|
|
5412
|
-
const max = useRef2(0);
|
|
5413
|
-
const [state, setState] = useState9({
|
|
5414
|
-
current: 0,
|
|
5415
|
-
outsideMouseMove: false
|
|
5416
|
-
});
|
|
5417
|
-
useEffect7(() => {
|
|
5418
|
-
document.addEventListener("mouseup", touchEnd);
|
|
5419
|
-
return () => {
|
|
5420
|
-
window.document.removeEventListener("mouseup", touchEnd);
|
|
5421
|
-
window.document.body.removeEventListener("mousemove", mouseMove);
|
|
5422
|
-
window.document.body.removeEventListener("mouseup", mouseUp);
|
|
5423
|
-
};
|
|
5424
|
-
}, []);
|
|
5425
|
-
const touchMove = (event) => {
|
|
5426
|
-
const notTouched = typeof pointerPosition.current !== "number";
|
|
5427
|
-
event.preventDefault();
|
|
5428
|
-
if (notTouched) {
|
|
5429
|
-
return;
|
|
5430
|
-
}
|
|
5431
|
-
const childCount = Children.count(children);
|
|
5432
|
-
const { offsetWidth } = event.currentTarget;
|
|
5433
|
-
const pointer = calculatePointerPosition(event);
|
|
5434
|
-
const max2 = offsetWidth;
|
|
5435
|
-
const offset = pointer - (pointerPosition.current || 0);
|
|
5436
|
-
const delta = Math.floor(offset / max2 * childCount);
|
|
5437
|
-
setCurrentFrame(calculateCurrentFrame(startFrame.current, delta, childCount));
|
|
5438
|
-
};
|
|
5439
|
-
const mouseMove = (event) => {
|
|
5440
|
-
const notTouched = typeof pointerPosition.current !== "number";
|
|
5441
|
-
event.preventDefault();
|
|
5442
|
-
if (notTouched || !state.outsideMouseMove)
|
|
5443
|
-
return;
|
|
5444
|
-
const childCount = Children.count(children);
|
|
5445
|
-
const pointer = calculatePointerPosition(event);
|
|
5446
|
-
const offset = pointer - (pointerPosition.current || 0);
|
|
5447
|
-
const delta = Math.floor(offset / max.current * childCount);
|
|
5448
|
-
setCurrentFrame(calculateCurrentFrame(startFrame.current, delta, childCount));
|
|
5449
|
-
};
|
|
5450
|
-
const mouseUp = () => {
|
|
5451
|
-
window.document.body.removeEventListener("mousemove", mouseMove);
|
|
5452
|
-
window.document.body.removeEventListener("mouseup", mouseUp);
|
|
5453
|
-
pointerPosition.current = void 0;
|
|
5454
|
-
startFrame.current = 0;
|
|
5455
|
-
};
|
|
5456
|
-
const touchStart = (event) => {
|
|
5457
|
-
event.preventDefault();
|
|
5458
|
-
pointerPosition.current = calculatePointerPosition(event);
|
|
5459
|
-
startFrame.current = state.current;
|
|
5460
|
-
const { offsetWidth } = event.currentTarget;
|
|
5461
|
-
max.current = offsetWidth;
|
|
5462
|
-
window.document.body.addEventListener("mousemove", mouseMove);
|
|
5463
|
-
window.document.body.addEventListener("mouseup", mouseUp);
|
|
5464
|
-
};
|
|
5465
|
-
const touchEnd = (event) => {
|
|
5466
|
-
event.preventDefault();
|
|
5467
|
-
pointerPosition.current = void 0;
|
|
5468
|
-
startFrame.current = 0;
|
|
5469
|
-
};
|
|
5470
|
-
const onMouseEnter = () => {
|
|
5471
|
-
if (state.outsideMouseMove)
|
|
5472
|
-
setState({ ...state, outsideMouseMove: false });
|
|
5473
|
-
};
|
|
5474
|
-
const onMouseLeave = () => {
|
|
5475
|
-
if (!state.outsideMouseMove)
|
|
5476
|
-
setState({ ...state, outsideMouseMove: true });
|
|
5477
|
-
};
|
|
5478
|
-
const setCurrentFrame = (current) => {
|
|
5479
|
-
if (current !== state.current) {
|
|
5480
|
-
setState({ ...state, current });
|
|
5481
|
-
}
|
|
5482
|
-
};
|
|
5483
|
-
const calculatePointerPosition = (event) => {
|
|
5484
|
-
const { clientX } = event.type.indexOf("touch") === 0 ? event.changedTouches[0] : event;
|
|
5485
|
-
const { offsetLeft } = event.currentTarget;
|
|
5486
|
-
return clientX - offsetLeft;
|
|
5487
|
-
};
|
|
5488
|
-
return /* @__PURE__ */ React43.createElement("div", {
|
|
5489
|
-
onTouchStart: touchStart,
|
|
5490
|
-
onTouchMove: touchMove,
|
|
5491
|
-
onTouchEnd: touchEnd,
|
|
5492
|
-
onMouseDown: touchStart,
|
|
5493
|
-
onMouseMove: touchMove,
|
|
5494
|
-
onMouseEnter,
|
|
5495
|
-
onMouseLeave
|
|
5496
|
-
}, Children.map(
|
|
5497
|
-
children,
|
|
5498
|
-
(child, i) => cloneElement(child, {
|
|
5499
|
-
style: {
|
|
5500
|
-
width: "100%",
|
|
5501
|
-
display: state.current === i ? "block" : "none"
|
|
5502
|
-
}
|
|
5503
|
-
})
|
|
5504
|
-
));
|
|
5505
|
-
};
|
|
5506
|
-
var Rotation_default = Rotation;
|
|
5507
|
-
|
|
5508
|
-
// src/components/ThreeSixty/ThreeSixtLightbox.tsx
|
|
5509
|
-
var ThreeSixtyLightbox = ({ urls }) => {
|
|
5510
|
-
const [started2, setStarted] = useState10(false);
|
|
5511
|
-
const onStart = useCallback14(() => setStarted(true), []);
|
|
5512
|
-
if (!started2) {
|
|
5513
|
-
return /* @__PURE__ */ React44.createElement(Item9, null, /* @__PURE__ */ React44.createElement(Img2, {
|
|
5514
|
-
src: urls[0],
|
|
5515
|
-
alt: "alt"
|
|
5516
|
-
}), /* @__PURE__ */ React44.createElement(MediaButton_default, {
|
|
5517
|
-
text: "Starta 360\xB0 exteri\xF6rt",
|
|
5518
|
-
onClick: onStart
|
|
5519
|
-
}));
|
|
5520
|
-
}
|
|
5521
|
-
return /* @__PURE__ */ React44.createElement(Rotation_default, null, urls.map((image, i) => /* @__PURE__ */ React44.createElement(Img2, {
|
|
5522
|
-
key: image,
|
|
5523
|
-
src: image,
|
|
5524
|
-
alt: `Bild ${i + 1}`
|
|
5525
|
-
})));
|
|
5526
|
-
};
|
|
5527
|
-
var ThreeSixtLightbox_default = ThreeSixtyLightbox;
|
|
5528
|
-
|
|
5529
|
-
// src/components/Lightbox/index.tsx
|
|
5530
|
-
var Lightbox = ({ index: index2, media, onClose }) => {
|
|
5531
|
-
const onRef = (ref) => {
|
|
5532
|
-
if (ref) {
|
|
5533
|
-
setTimeout(() => {
|
|
5534
|
-
ref.scrollIntoView();
|
|
5535
|
-
}, 300);
|
|
5536
|
-
}
|
|
5537
|
-
};
|
|
5538
|
-
const onKeyDown = (e) => {
|
|
5539
|
-
if (e.keyCode === 27) {
|
|
5540
|
-
onClose();
|
|
5541
|
-
}
|
|
5542
|
-
};
|
|
5543
|
-
return /* @__PURE__ */ React45.createElement(Wrapper18, {
|
|
5544
|
-
ref: (ref) => ref?.focus(),
|
|
5545
|
-
onKeyDown,
|
|
5546
|
-
tabIndex: 0
|
|
5547
|
-
}, /* @__PURE__ */ React45.createElement(UiBlock2, {
|
|
5548
|
-
onClick: onClose,
|
|
5549
|
-
"aria-hidden": true
|
|
5550
|
-
}), media.filter((x) => x.type !== "sphere").map((m, i) => /* @__PURE__ */ React45.createElement(Item9, {
|
|
5551
|
-
key: i,
|
|
5552
|
-
ref: index2 === i ? onRef : void 0
|
|
5553
|
-
}, m.type === "image" && /* @__PURE__ */ React45.createElement(Img2, {
|
|
5554
|
-
id: `lightbox-image-${i}`,
|
|
5555
|
-
src: m.files[0].url,
|
|
5556
|
-
alt: `Bild ${i + 1}`
|
|
5557
|
-
}), m.type === "threesixty" && /* @__PURE__ */ React45.createElement(ThreeSixtLightbox_default, {
|
|
5558
|
-
urls: m.files.map((x) => x.url)
|
|
5559
|
-
}), m.type === "embedded" && /* @__PURE__ */ React45.createElement(EmbeddedVideoLightbox_default, {
|
|
5560
|
-
url: m.files[0].url
|
|
5561
|
-
}))), /* @__PURE__ */ React45.createElement(CloseBtn2, {
|
|
5562
|
-
onClick: onClose,
|
|
5563
|
-
title: "St\xE4ng"
|
|
5564
|
-
}, /* @__PURE__ */ React45.createElement(IconCancel, {
|
|
5565
|
-
block: true
|
|
5566
|
-
})));
|
|
5567
|
-
};
|
|
5568
|
-
var Lightbox_default = Lightbox;
|
|
5569
|
-
|
|
5570
|
-
// src/components/Video/EmbededVideo.tsx
|
|
5571
|
-
import React47, { useState as useState14, useCallback as useCallback16 } from "react";
|
|
5572
|
-
|
|
5573
|
-
// src/components/Video/useThumbnail.ts
|
|
5574
|
-
import { useEffect as useEffect10, useState as useState13 } from "react";
|
|
5575
|
-
|
|
5576
|
-
// src/hooks/useVimeoThumbnail.ts
|
|
5577
|
-
import { useEffect as useEffect9, useState as useState12 } from "react";
|
|
5578
|
-
|
|
5579
|
-
// src/hooks/useFetch.ts
|
|
5580
|
-
import { useEffect as useEffect8, useState as useState11, useCallback as useCallback15 } from "react";
|
|
5581
|
-
var cache = {};
|
|
5582
|
-
var getCachedResult = (key) => cache?.[key] || void 0;
|
|
5583
|
-
var setCachedResult = (key, value) => {
|
|
5584
|
-
cache[key] = value;
|
|
5585
|
-
};
|
|
5586
|
-
var pendingPromise = {};
|
|
5587
|
-
var isPendingPromise = (url) => !!pendingPromise[url];
|
|
5588
|
-
var setPendingPromise = (url, promise) => {
|
|
5589
|
-
pendingPromise = {
|
|
5590
|
-
...pendingPromise,
|
|
5591
|
-
[url]: promise
|
|
5592
|
-
};
|
|
5593
|
-
};
|
|
5594
|
-
var clearPendingPromise = (url) => {
|
|
5595
|
-
delete pendingPromise[url];
|
|
5596
|
-
};
|
|
5597
|
-
var useFetch = (path, options, skip, promiseCache) => {
|
|
5598
|
-
const [data, setData] = useState11();
|
|
5599
|
-
const [loading, setLoading] = useState11(false);
|
|
5600
|
-
const [error, setError] = useState11(false);
|
|
5601
|
-
const doFetch = useCallback15(async () => {
|
|
5602
|
-
const key = path.toString();
|
|
5603
|
-
const cached = getCachedResult(key);
|
|
5604
|
-
setError(false);
|
|
5605
|
-
if (cached) {
|
|
5606
|
-
setData(cached);
|
|
5607
|
-
return;
|
|
5608
|
-
}
|
|
5609
|
-
setLoading(true);
|
|
5610
|
-
try {
|
|
5611
|
-
const reusePromise = promiseCache && isPendingPromise(key);
|
|
5612
|
-
const request = reusePromise ? pendingPromise[key] : fetch(path, options);
|
|
5613
|
-
if (promiseCache) {
|
|
5614
|
-
setPendingPromise(key, request);
|
|
5615
|
-
}
|
|
5616
|
-
const result = await request;
|
|
5617
|
-
if (result.ok) {
|
|
5618
|
-
const json2 = await result.clone().json();
|
|
5619
|
-
setCachedResult(key, json2);
|
|
5620
|
-
setData(json2);
|
|
5621
|
-
}
|
|
5622
|
-
} catch (e) {
|
|
5623
|
-
setError(true);
|
|
5624
|
-
} finally {
|
|
5625
|
-
setLoading(false);
|
|
5626
|
-
clearPendingPromise(key);
|
|
5627
|
-
}
|
|
5628
|
-
return;
|
|
5629
|
-
}, [path, options]);
|
|
5630
|
-
useEffect8(() => {
|
|
5631
|
-
if (!skip) {
|
|
5632
|
-
doFetch();
|
|
5633
|
-
}
|
|
5634
|
-
}, [path, skip]);
|
|
5635
|
-
return {
|
|
5636
|
-
loading,
|
|
5637
|
-
data,
|
|
5638
|
-
error
|
|
5639
|
-
};
|
|
5640
|
-
};
|
|
5641
|
-
var useFetch_default = useFetch;
|
|
5642
|
-
|
|
5643
|
-
// src/hooks/useVimeoThumbnail.ts
|
|
5644
|
-
var useVimeoThumbnail = (id, small) => {
|
|
5645
|
-
const [thumbnail, setThumbnail] = useState12();
|
|
5646
|
-
const { data } = useFetch_default(
|
|
5647
|
-
`http://vimeo.com/api/v2/video/${id}.json`,
|
|
5648
|
-
{},
|
|
5649
|
-
!id || !!thumbnail,
|
|
5650
|
-
true
|
|
5651
|
-
);
|
|
5652
|
-
useEffect9(() => {
|
|
5653
|
-
if (data?.[0]) {
|
|
5654
|
-
if (small && data[0].thumbnail_small) {
|
|
5655
|
-
setThumbnail(data[0].thumbnail_small);
|
|
5656
|
-
} else if (data[0].thumbnail_large) {
|
|
5657
|
-
setThumbnail(data[0].thumbnail_large);
|
|
5658
|
-
}
|
|
5659
|
-
}
|
|
5660
|
-
}, [data]);
|
|
5661
|
-
return thumbnail;
|
|
5662
|
-
};
|
|
5663
|
-
var useVimeoThumbnail_default = useVimeoThumbnail;
|
|
5664
|
-
|
|
5665
|
-
// src/components/Video/useThumbnail.ts
|
|
5666
|
-
var useThumbnail = (url, small) => {
|
|
5667
|
-
if (url?.toLowerCase().endsWith(".mp4"))
|
|
5668
|
-
return;
|
|
5669
|
-
const [thumbnail, setThumbnail] = useState13();
|
|
5670
|
-
const vimeoId = url ? getVimeoId(url) : void 0;
|
|
5671
|
-
const vimeoThumbnail = useVimeoThumbnail_default(vimeoId, small);
|
|
5672
|
-
useEffect10(() => {
|
|
5673
|
-
if (url) {
|
|
5674
|
-
const youtubeThumbnail = getYoutubeThumbnail(url);
|
|
5675
|
-
if (youtubeThumbnail) {
|
|
5676
|
-
if (small) {
|
|
5677
|
-
setThumbnail([youtubeThumbnail.mqdefault]);
|
|
5678
|
-
} else {
|
|
5679
|
-
setThumbnail([youtubeThumbnail.maxresdefault, youtubeThumbnail.hqdefault]);
|
|
5680
|
-
}
|
|
5681
|
-
}
|
|
5682
|
-
}
|
|
5683
|
-
}, [url]);
|
|
5684
|
-
return vimeoThumbnail ? [vimeoThumbnail] : thumbnail;
|
|
5685
|
-
};
|
|
5686
|
-
var useThumbnail_default = useThumbnail;
|
|
5687
|
-
|
|
5688
|
-
// src/components/Modal/index.tsx
|
|
5689
|
-
import * as React46 from "react";
|
|
5690
|
-
|
|
5691
|
-
// src/components/Modal/wrapper.tsx
|
|
5692
|
-
import styled37 from "styled-components";
|
|
5693
|
-
var Wrapper20 = styled37.div.attrs(() => ({
|
|
5694
|
-
role: "dialog"
|
|
5695
|
-
}))`
|
|
5696
|
-
position: fixed;
|
|
5697
|
-
top: 0;
|
|
5698
|
-
bottom: 0;
|
|
5699
|
-
left: 0;
|
|
5700
|
-
right: 0;
|
|
5701
|
-
width: 100%;
|
|
5702
|
-
white-space: normal;
|
|
5703
|
-
text-align: left;
|
|
5704
|
-
z-index: 90;
|
|
5705
|
-
display: flex;
|
|
5706
|
-
align-items: center;
|
|
5707
|
-
justify-content: center;
|
|
5708
|
-
|
|
5709
|
-
${(props) => props.theme.breakpoint.Sm} {
|
|
5710
|
-
padding: ${size(2)};
|
|
5711
|
-
}
|
|
5712
|
-
`;
|
|
5713
|
-
var UiBlock3 = styled37.div.attrs(() => ({
|
|
5714
|
-
"aria-hidden": "true",
|
|
5715
|
-
role: "button"
|
|
5716
|
-
}))`
|
|
5717
|
-
position: fixed;
|
|
5718
|
-
top: 0;
|
|
5719
|
-
bottom: 0;
|
|
5720
|
-
left: 0;
|
|
5721
|
-
right: 0;
|
|
5722
|
-
background-color: rgba(0, 0, 0, 0.35);
|
|
5723
|
-
z-index: -1;
|
|
5724
|
-
|
|
5725
|
-
${(props) => props.theme.breakpoint.LtMd} {
|
|
5726
|
-
animation: ${fadeIn} 300ms ease forwards;
|
|
5727
|
-
}
|
|
5728
|
-
|
|
5729
|
-
${(props) => props.theme.breakpoint.Md} {
|
|
5730
|
-
animation: ${fadeIn} 400ms ease forwards;
|
|
5731
|
-
}
|
|
5732
|
-
`;
|
|
5733
|
-
var Dialog = styled37.article.attrs(() => ({
|
|
5734
|
-
className: "wayke__theme wayke__font--regular"
|
|
5735
|
-
}))`
|
|
5736
|
-
display: flex;
|
|
5737
|
-
flex-direction: column;
|
|
5738
|
-
background-color: ${(props) => props.theme.color.bg};
|
|
5739
|
-
z-index: 1;
|
|
5740
|
-
width: 100%;
|
|
5741
|
-
max-width: 680px;
|
|
5742
|
-
max-height: 100%;
|
|
5743
|
-
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
|
|
5744
|
-
overflow: hidden;
|
|
5745
|
-
|
|
5746
|
-
${(props) => props.theme.breakpoint.LtSm} {
|
|
5747
|
-
align-self: flex-end;
|
|
5748
|
-
transform: translateY(100%);
|
|
5749
|
-
animation: ${noTransform} 300ms ease forwards;
|
|
5750
|
-
}
|
|
5751
|
-
|
|
5752
|
-
${(props) => props.theme.breakpoint.Sm} {
|
|
5753
|
-
transform: translateY(${size(2)});
|
|
5754
|
-
animation: ${fadeIn} 400ms ease, ${noTransform} 400ms ease forwards;
|
|
5755
|
-
}
|
|
5756
|
-
`;
|
|
5757
|
-
var Content4 = styled37.div`
|
|
5758
|
-
flex: 1 1 auto;
|
|
5759
|
-
overflow: auto;
|
|
5760
|
-
-webkit-overflow-scrolling: touch;
|
|
5761
|
-
`;
|
|
5762
|
-
var Header4 = styled37.header`
|
|
5763
|
-
display: flex;
|
|
5764
|
-
align-items: center;
|
|
5765
|
-
min-height: 60px;
|
|
5766
|
-
padding: ${size(3)};
|
|
5767
|
-
padding-bottom: 0;
|
|
5768
|
-
`;
|
|
5769
|
-
var Heading5 = styled37.div`
|
|
5770
|
-
flex: 1 1 auto;
|
|
5771
|
-
|
|
5772
|
-
${H1} {
|
|
5773
|
-
font-size: 1.5rem;
|
|
5774
|
-
}
|
|
5775
|
-
`;
|
|
5776
|
-
var Close2 = styled37.div`
|
|
5777
|
-
flex-shrink: 0;
|
|
5778
|
-
margin: ${size(-2)};
|
|
5779
|
-
padding-left: ${size(3)};
|
|
5780
|
-
`;
|
|
5781
|
-
var CloseBtn3 = styled37(ButtonReset)`
|
|
5782
|
-
display: block;
|
|
5783
|
-
padding: ${size(2)};
|
|
5784
|
-
`;
|
|
5785
|
-
var Body4 = styled37.div`
|
|
5786
|
-
padding: ${size(3)};
|
|
5787
|
-
`;
|
|
5788
|
-
var Image3 = styled37.img`
|
|
5789
|
-
display: block;
|
|
5790
|
-
width: calc(100% + ${size(6)});
|
|
5791
|
-
margin-left: ${size(-3)};
|
|
5792
|
-
margin-bottom: ${size(3)};
|
|
5793
|
-
`;
|
|
5794
|
-
var ModalFoldout = styled37.div`
|
|
5795
|
-
background-color: ${(props) => props.theme.color.accent};
|
|
5796
|
-
margin: ${size(-3)};
|
|
5797
|
-
margin-top: ${size(3)};
|
|
5798
|
-
padding: ${size(3)};
|
|
5799
|
-
`;
|
|
5800
|
-
var ModalFoldoutBody = styled37.div``;
|
|
5801
|
-
|
|
5802
|
-
// src/components/Modal/index.tsx
|
|
5803
|
-
var Modal = ({ id, title, onClose, children }) => {
|
|
5804
|
-
return /* @__PURE__ */ React46.createElement(portal_default, {
|
|
5805
|
-
id: id || portal_namespace_exports.DefaultPortal
|
|
5806
|
-
}, /* @__PURE__ */ React46.createElement(Wrapper20, {
|
|
5807
|
-
onClick: (e) => e.stopPropagation()
|
|
5808
|
-
}, /* @__PURE__ */ React46.createElement(UiBlock3, {
|
|
5809
|
-
onClick: onClose,
|
|
5810
|
-
title: "St\xE4ng modal"
|
|
5811
|
-
}), /* @__PURE__ */ React46.createElement(Dialog, null, /* @__PURE__ */ React46.createElement(Content4, null, /* @__PURE__ */ React46.createElement(Header4, null, /* @__PURE__ */ React46.createElement(Heading5, null, /* @__PURE__ */ React46.createElement(H1, {
|
|
5812
|
-
noMargin: true
|
|
5813
|
-
}, title)), /* @__PURE__ */ React46.createElement(Close2, null, /* @__PURE__ */ React46.createElement(CloseBtn3, {
|
|
5814
|
-
onClick: onClose,
|
|
5815
|
-
title: "St\xE4ng modal"
|
|
5816
|
-
}, /* @__PURE__ */ React46.createElement(IconCancel, {
|
|
5817
|
-
block: true
|
|
5818
|
-
})))), /* @__PURE__ */ React46.createElement(Body4, null, children)))));
|
|
5819
|
-
};
|
|
5820
|
-
var Modal_default = Modal;
|
|
5821
|
-
|
|
5822
|
-
// src/components/Video/EmbededVideo.tsx
|
|
5823
|
-
var GalleryEmbed = ({ src, index: index2 }) => {
|
|
5824
|
-
const [modal, setModal] = useState14();
|
|
5825
|
-
const thumbnail = useThumbnail_default(src);
|
|
5826
|
-
const onClick = (e) => {
|
|
5827
|
-
e.stopPropagation();
|
|
5828
|
-
setModal(src);
|
|
5829
|
-
};
|
|
5830
|
-
const onCloseModal = (e) => {
|
|
5831
|
-
e.stopPropagation();
|
|
5832
|
-
setModal(void 0);
|
|
5833
|
-
};
|
|
5834
|
-
const onError = useCallback16(
|
|
5835
|
-
(e) => onImageError(e, thumbnail),
|
|
5836
|
-
[thumbnail]
|
|
5837
|
-
);
|
|
5838
|
-
const onLoad = useCallback16(
|
|
5839
|
-
(e) => onImageLoad(e, thumbnail),
|
|
5840
|
-
[thumbnail]
|
|
5841
|
-
);
|
|
5842
|
-
const customVideo = src.toLowerCase().endsWith(".mp4");
|
|
5843
|
-
if (thumbnail?.length && !customVideo) {
|
|
5844
|
-
return /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement(ImageFull, {
|
|
5845
|
-
onLoad,
|
|
5846
|
-
src: thumbnail[0],
|
|
5847
|
-
onError,
|
|
5848
|
-
alt: `Bild ${index2 + 1}`
|
|
5849
|
-
}), /* @__PURE__ */ React47.createElement(MediaButton_default, {
|
|
5850
|
-
text: "Spela video",
|
|
5851
|
-
onClick
|
|
5852
|
-
}), modal && /* @__PURE__ */ React47.createElement(Modal_default, {
|
|
5853
|
-
title: "Video",
|
|
5854
|
-
onClose: onCloseModal
|
|
5855
|
-
}, /* @__PURE__ */ React47.createElement(EmbeddedVideoLightbox_default, {
|
|
5856
|
-
url: modal
|
|
5857
|
-
})));
|
|
5858
|
-
}
|
|
5859
|
-
if (customVideo)
|
|
5860
|
-
return /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement(CustomPlayer_default, {
|
|
5861
|
-
ratio: "66.66%",
|
|
5862
|
-
isPreview: true,
|
|
5863
|
-
controls: false,
|
|
5864
|
-
url: src
|
|
5865
|
-
}), /* @__PURE__ */ React47.createElement(MediaButton_default, {
|
|
5866
|
-
text: "Spela video",
|
|
5867
|
-
onClick
|
|
5868
|
-
}), modal && /* @__PURE__ */ React47.createElement(Modal_default, {
|
|
5869
|
-
title: "Video",
|
|
5870
|
-
onClose: onCloseModal
|
|
5871
|
-
}, /* @__PURE__ */ React47.createElement(EmbeddedVideoLightbox_default, {
|
|
5872
|
-
url: modal
|
|
5873
|
-
})));
|
|
5874
|
-
return null;
|
|
5875
|
-
};
|
|
5876
|
-
var EmbededVideo_default = GalleryEmbed;
|
|
5877
|
-
|
|
5878
|
-
// src/components/Video/QuickNavEmbeded.tsx
|
|
5879
|
-
import React48, { useCallback as useCallback17 } from "react";
|
|
5880
|
-
var QuickNavEmbeded = ({ src, index: index2 }) => {
|
|
5881
|
-
const thumbnail = useThumbnail_default(src);
|
|
5882
|
-
const onError = useCallback17(
|
|
5883
|
-
(e) => onImageError(e, thumbnail),
|
|
5884
|
-
[thumbnail]
|
|
5885
|
-
);
|
|
5886
|
-
const onLoad = useCallback17(
|
|
5887
|
-
(e) => onImageLoad(e, thumbnail),
|
|
5888
|
-
[thumbnail]
|
|
5889
|
-
);
|
|
5890
|
-
const customVideo = src?.toLowerCase().endsWith(".mp4");
|
|
5891
|
-
if (thumbnail?.length && !customVideo)
|
|
5892
|
-
return /* @__PURE__ */ React48.createElement(QuickNavImg, {
|
|
5893
|
-
onLoad,
|
|
5894
|
-
src: thumbnail[0],
|
|
5895
|
-
onError,
|
|
5896
|
-
alt: `Bild ${index2 + 1}`
|
|
5897
|
-
});
|
|
5898
|
-
if (customVideo)
|
|
5899
|
-
return /* @__PURE__ */ React48.createElement(CustomPlayer_default, {
|
|
5900
|
-
key: index2,
|
|
5901
|
-
url: src,
|
|
5902
|
-
ratio: "66.66%"
|
|
5903
|
-
});
|
|
5904
|
-
return null;
|
|
5905
|
-
};
|
|
5906
|
-
var QuickNavEmbeded_default = QuickNavEmbeded;
|
|
5907
|
-
|
|
5908
|
-
// src/components/ThreeSixty/ThreeSixty.tsx
|
|
5909
|
-
import React49 from "react";
|
|
5910
|
-
var onMediaClick = (e, func) => {
|
|
5911
|
-
e.stopPropagation();
|
|
5912
|
-
e.preventDefault();
|
|
5913
|
-
func();
|
|
5914
|
-
};
|
|
5915
|
-
var ThreeSixty = ({ urls, visible, onDisableNavigation, navigationDisabled }) => {
|
|
5916
|
-
if (!visible || !navigationDisabled && visible) {
|
|
5917
|
-
return /* @__PURE__ */ React49.createElement(React49.Fragment, null, /* @__PURE__ */ React49.createElement(Image2, {
|
|
5918
|
-
src: urls[0],
|
|
5919
|
-
alt: "alt"
|
|
5920
|
-
}), /* @__PURE__ */ React49.createElement(MediaButton_default, {
|
|
5921
|
-
text: "Starta 360\xB0 exteri\xF6rt",
|
|
5922
|
-
onClick: (e) => onMediaClick(e, onDisableNavigation)
|
|
5923
|
-
}));
|
|
5924
|
-
}
|
|
5925
|
-
if (navigationDisabled && visible) {
|
|
5926
|
-
return /* @__PURE__ */ React49.createElement("div", {
|
|
5927
|
-
onClick: (e) => {
|
|
5928
|
-
e.stopPropagation();
|
|
5929
|
-
e.preventDefault();
|
|
5930
|
-
}
|
|
5931
|
-
}, /* @__PURE__ */ React49.createElement(Rotation_default, null, urls.map((image, i) => /* @__PURE__ */ React49.createElement(Image2, {
|
|
5932
|
-
key: image,
|
|
5933
|
-
src: image,
|
|
5934
|
-
alt: `Bild ${i + 1}`
|
|
5935
|
-
}))));
|
|
5936
|
-
}
|
|
5937
|
-
return null;
|
|
5938
|
-
};
|
|
5939
|
-
var ThreeSixty_default = ThreeSixty;
|
|
5940
|
-
|
|
5941
|
-
// src/components/Gallery/index.tsx
|
|
5942
|
-
var sliderSettings = {
|
|
5943
|
-
dots: false,
|
|
5944
|
-
arrows: false,
|
|
5945
|
-
infinite: true,
|
|
5946
|
-
speed: 300,
|
|
5947
|
-
slidesToShow: 1,
|
|
5948
|
-
slidesToScroll: 1
|
|
5949
|
-
};
|
|
5950
|
-
var Gallery = ({ media, placeholderImage }) => {
|
|
5951
|
-
const slider = useRef3(null);
|
|
5952
|
-
const quickNavRef = useRef3(null);
|
|
5953
|
-
const isDragging = useRef3(false);
|
|
5954
|
-
const [index2, setIndex] = useState15(0);
|
|
5955
|
-
const [lightbox, setLightbox] = useState15(false);
|
|
5956
|
-
const [navigationDisabled, setNavigationDisabled] = useState15(false);
|
|
5957
|
-
const beforeChange = useCallback18((_, newIndex) => {
|
|
5958
|
-
const element = quickNavRef.current?.querySelectorAll("li")?.[newIndex];
|
|
5959
|
-
if (element) {
|
|
5960
|
-
scrollIntoView(element, { scrollMode: "if-needed", block: "nearest", inline: "nearest" });
|
|
5961
|
-
}
|
|
5962
|
-
setIndex(newIndex);
|
|
5963
|
-
}, []);
|
|
5964
|
-
const onMouseDown = useCallback18(() => {
|
|
5965
|
-
if (isDragging.current) {
|
|
5966
|
-
isDragging.current = false;
|
|
5967
|
-
}
|
|
5968
|
-
}, []);
|
|
5969
|
-
const onMouseMove = useCallback18(() => {
|
|
5970
|
-
if (!isDragging.current) {
|
|
5971
|
-
isDragging.current = true;
|
|
5972
|
-
}
|
|
5973
|
-
}, []);
|
|
5974
|
-
const onClick = useCallback18(() => {
|
|
5975
|
-
pubsub_default.publish("ImagesClick");
|
|
5976
|
-
if (!isDragging.current && !lightbox && !!media?.length) {
|
|
5977
|
-
setLightbox(true);
|
|
5978
|
-
}
|
|
5979
|
-
}, [lightbox, media]);
|
|
5980
|
-
const nextImage = useCallback18(() => {
|
|
5981
|
-
if (!slider || !slider.current) {
|
|
5982
|
-
return;
|
|
5983
|
-
}
|
|
5984
|
-
slider.current.slickNext();
|
|
5985
|
-
}, [slider]);
|
|
5986
|
-
const prevImage = useCallback18(() => {
|
|
5987
|
-
if (!slider || !slider.current) {
|
|
5988
|
-
return;
|
|
5989
|
-
}
|
|
5990
|
-
slider.current.slickPrev();
|
|
5991
|
-
}, [slider]);
|
|
5992
|
-
const goTo = (target) => {
|
|
5993
|
-
if (!slider || !slider.current) {
|
|
5994
|
-
return;
|
|
5995
|
-
}
|
|
5996
|
-
if (slider.current) {
|
|
5997
|
-
setIndex(target);
|
|
5998
|
-
slider.current.slickGoTo(target);
|
|
5999
|
-
}
|
|
6000
|
-
};
|
|
6001
|
-
const onDisableNavigation = () => {
|
|
6002
|
-
if (!isDragging.current)
|
|
6003
|
-
setNavigationDisabled(true);
|
|
6004
|
-
};
|
|
6005
|
-
const onEnableNavigation = (e) => {
|
|
6006
|
-
e.stopPropagation();
|
|
6007
|
-
isDragging.current = false;
|
|
6008
|
-
setNavigationDisabled(false);
|
|
6009
|
-
};
|
|
6010
|
-
const onToggleLightbox = useCallback18(() => setLightbox(!lightbox), [lightbox]);
|
|
6011
|
-
const mediaLength = media?.length || 0;
|
|
6012
|
-
const placeholder = useMemo3(
|
|
6013
|
-
() => placeholderImage || DEFAULT_PLACEHOLDER_IMAGE,
|
|
6014
|
-
[placeholderImage]
|
|
6015
|
-
);
|
|
6016
|
-
return /* @__PURE__ */ React50.createElement(React50.Fragment, null, /* @__PURE__ */ React50.createElement(Wrapper17, null, /* @__PURE__ */ React50.createElement(Main, null, /* @__PURE__ */ React50.createElement(SliderWrapper, {
|
|
6017
|
-
onMouseDown,
|
|
6018
|
-
onMouseMove,
|
|
6019
|
-
onClick
|
|
6020
|
-
}, /* @__PURE__ */ React50.createElement(Slider3, {
|
|
6021
|
-
...sliderSettings,
|
|
6022
|
-
swipe: !navigationDisabled,
|
|
6023
|
-
touchMove: !navigationDisabled,
|
|
6024
|
-
swipeToSlide: !navigationDisabled,
|
|
6025
|
-
ref: slider,
|
|
6026
|
-
beforeChange
|
|
6027
|
-
}, !!media?.length ? media.filter((x) => x.type !== "sphere").map((m, i) => /* @__PURE__ */ React50.createElement(Item8, {
|
|
6028
|
-
key: m.files[0].url || i
|
|
6029
|
-
}, m.type === "image" && /* @__PURE__ */ React50.createElement(Image2, {
|
|
6030
|
-
src: m.files[0].formats.filter(notEmpty).find((x) => x.format === "1170x")?.url,
|
|
6031
|
-
alt: `Bild ${i + 1}`
|
|
6032
|
-
}), m.type === "threesixty" && /* @__PURE__ */ React50.createElement(ThreeSixty_default, {
|
|
6033
|
-
urls: m.files.map((x) => x.url),
|
|
6034
|
-
visible: i === index2,
|
|
6035
|
-
onDisableNavigation,
|
|
6036
|
-
navigationDisabled
|
|
6037
|
-
}), m.type === "embedded" && /* @__PURE__ */ React50.createElement(EmbededVideo_default, {
|
|
6038
|
-
src: m.files[0].url,
|
|
6039
|
-
index: i + 1
|
|
6040
|
-
}))) : /* @__PURE__ */ React50.createElement(Item8, {
|
|
6041
|
-
key: placeholder
|
|
6042
|
-
}, /* @__PURE__ */ React50.createElement(Image2, {
|
|
6043
|
-
src: placeholder,
|
|
6044
|
-
alt: `Bild 1`
|
|
6045
|
-
}))), navigationDisabled && mediaLength > 1 && /* @__PURE__ */ React50.createElement(EnableNavigationButton, null, /* @__PURE__ */ React50.createElement(ButtonSecondary, {
|
|
6046
|
-
onClick: onEnableNavigation,
|
|
6047
|
-
title: "St\xE4ng"
|
|
6048
|
-
}, /* @__PURE__ */ React50.createElement(ButtonContent, null, "St\xE4ng")))), !navigationDisabled && mediaLength > 1 && /* @__PURE__ */ React50.createElement(React50.Fragment, null, /* @__PURE__ */ React50.createElement(ArrowLeft, {
|
|
6049
|
-
onClick: prevImage,
|
|
6050
|
-
title: "F\xF6reg\xE5ende bild"
|
|
6051
|
-
}, /* @__PURE__ */ React50.createElement(IconChevronLeft, {
|
|
6052
|
-
block: true
|
|
6053
|
-
})), /* @__PURE__ */ React50.createElement(ArrowRight, {
|
|
6054
|
-
onClick: nextImage,
|
|
6055
|
-
title: "N\xE4sta bild"
|
|
6056
|
-
}, /* @__PURE__ */ React50.createElement(IconChevronRight, {
|
|
6057
|
-
block: true
|
|
6058
|
-
})))), /* @__PURE__ */ React50.createElement(Alt, null, /* @__PURE__ */ React50.createElement(QuickNav, {
|
|
6059
|
-
ref: quickNavRef
|
|
6060
|
-
}, !!media?.length ? media.map((m, i) => {
|
|
6061
|
-
const src = m.files[0].formats.filter(notEmpty).find((x) => x.format === "225x150")?.url || m.files[0].url;
|
|
6062
|
-
return /* @__PURE__ */ React50.createElement(QuickNavItem, {
|
|
6063
|
-
key: src || i,
|
|
6064
|
-
active: index2 === i
|
|
6065
|
-
}, /* @__PURE__ */ React50.createElement(QuickNavBtn, {
|
|
6066
|
-
onClick: () => goTo(i),
|
|
6067
|
-
title: `G\xE5 till bild ${i + 1}`
|
|
6068
|
-
}, m.type === "image" && /* @__PURE__ */ React50.createElement(QuickNavImg, {
|
|
6069
|
-
src,
|
|
6070
|
-
alt: `Bild ${i + 1}`
|
|
6071
|
-
}), m.type === "threesixty" && /* @__PURE__ */ React50.createElement(QuickNavImg, {
|
|
6072
|
-
src,
|
|
6073
|
-
alt: `Bild ${i + 1}`
|
|
6074
|
-
}), m.type === "embedded" && /* @__PURE__ */ React50.createElement(QuickNavEmbeded_default, {
|
|
6075
|
-
src,
|
|
6076
|
-
index: i
|
|
6077
|
-
}), m.type === "sphere" && /* @__PURE__ */ React50.createElement(QuickNavImg, {
|
|
6078
|
-
src: m.files[0].url,
|
|
6079
|
-
alt: `Bild ${i + 1}`
|
|
6080
|
-
})));
|
|
6081
|
-
}) : /* @__PURE__ */ React50.createElement(QuickNavItem, {
|
|
6082
|
-
key: placeholder,
|
|
6083
|
-
active: true
|
|
6084
|
-
}, /* @__PURE__ */ React50.createElement(QuickNavBtn, {
|
|
6085
|
-
onClick: () => goTo(0),
|
|
6086
|
-
title: `G\xE5 till bild 0`
|
|
6087
|
-
}, /* @__PURE__ */ React50.createElement(QuickNavImg, {
|
|
6088
|
-
src: placeholder,
|
|
6089
|
-
alt: `Bild 1`
|
|
6090
|
-
})))))), lightbox && !!media?.length && /* @__PURE__ */ React50.createElement(Lightbox_default, {
|
|
6091
|
-
media,
|
|
6092
|
-
index: index2,
|
|
6093
|
-
onClose: onToggleLightbox
|
|
6094
|
-
}));
|
|
6095
|
-
};
|
|
6096
|
-
var Gallery_default = Gallery;
|
|
6097
|
-
|
|
6098
|
-
// src/components/ProductPage/index.tsx
|
|
6099
|
-
import styled38 from "styled-components";
|
|
6100
|
-
var ProductPage = styled38.div`
|
|
6101
|
-
display: flex;
|
|
6102
|
-
flex-direction: column;
|
|
6103
|
-
|
|
6104
|
-
${(props) => props.theme.breakpoint.Md} {
|
|
6105
|
-
flex-direction: row;
|
|
6106
|
-
}
|
|
6107
|
-
`;
|
|
6108
|
-
var ProductPageAside = styled38.div`
|
|
6109
|
-
${(props) => props.theme.breakpoint.LtMd} {
|
|
6110
|
-
display: contents;
|
|
6111
|
-
}
|
|
6112
|
-
|
|
6113
|
-
${(props) => props.theme.breakpoint.Md} {
|
|
6114
|
-
flex-shrink: 0;
|
|
6115
|
-
width: calc(375px + ${size(2)});
|
|
6116
|
-
padding-right: ${size(2)};
|
|
6117
|
-
}
|
|
6118
|
-
`;
|
|
6119
|
-
var ProductPageMain = styled38.div`
|
|
6120
|
-
${(props) => props.theme.breakpoint.LtMd} {
|
|
6121
|
-
display: contents;
|
|
6122
|
-
}
|
|
6123
|
-
|
|
6124
|
-
${(props) => props.theme.breakpoint.Md} {
|
|
6125
|
-
flex: 1 1 100%;
|
|
6126
|
-
min-width: 0;
|
|
6127
|
-
padding-left: ${size(2)};
|
|
6128
|
-
}
|
|
6129
|
-
`;
|
|
6130
|
-
var ProductPageAsideSection = styled38.div`
|
|
6131
|
-
${(props) => props.theme.breakpoint.LtMd} {
|
|
6132
|
-
order: ${(props) => props.mobileOrder};
|
|
6133
|
-
|
|
6134
|
-
& + & {
|
|
6135
|
-
margin-top: ${size(2)};
|
|
6136
|
-
}
|
|
6137
|
-
|
|
6138
|
-
:last-child {
|
|
6139
|
-
margin-bottom: ${size(4)};
|
|
6140
|
-
}
|
|
6141
|
-
|
|
6142
|
-
${ProductPageMain} & {
|
|
6143
|
-
margin-top: ${size(2)};
|
|
6144
|
-
}
|
|
6145
|
-
}
|
|
6146
|
-
|
|
6147
|
-
${(props) => props.theme.breakpoint.Md} {
|
|
6148
|
-
& + & {
|
|
6149
|
-
margin-top: ${size(4)};
|
|
6150
|
-
}
|
|
6151
|
-
|
|
6152
|
-
${ProductPageMain} & {
|
|
6153
|
-
margin-bottom: ${size(8)};
|
|
6154
|
-
}
|
|
6155
|
-
}
|
|
6156
|
-
`;
|
|
6157
|
-
var ProductPageMainSection = styled38.div`
|
|
6158
|
-
${(props) => props.theme.breakpoint.LtMd} {
|
|
6159
|
-
order: 99;
|
|
6160
|
-
padding: ${size(4)} 0;
|
|
6161
|
-
border-top: ${size(1)} solid ${(props) => props.theme.color.accent};
|
|
6162
|
-
|
|
6163
|
-
${Wrapper} & {
|
|
6164
|
-
margin-left: ${size(-2)};
|
|
6165
|
-
margin-right: ${size(-2)};
|
|
6166
|
-
padding-left: ${size(2)};
|
|
6167
|
-
padding-right: ${size(2)};
|
|
6168
|
-
}
|
|
6169
|
-
}
|
|
6170
|
-
|
|
6171
|
-
${(props) => props.theme.breakpoint.Md} {
|
|
6172
|
-
& + & {
|
|
6173
|
-
margin-top: ${size(8)};
|
|
6174
|
-
padding-top: ${size(8)};
|
|
6175
|
-
border-top: 1px solid ${(props) => props.theme.color.border};
|
|
6176
|
-
}
|
|
6177
|
-
}
|
|
6178
|
-
`;
|
|
6179
|
-
var ProductPageContentLimit = styled38.div`
|
|
6180
|
-
max-width: 420px;
|
|
6181
|
-
`;
|
|
6182
|
-
|
|
6183
|
-
// src/hooks/useSearchItem.ts
|
|
6184
|
-
import { useQuery } from "@apollo/client";
|
|
6185
|
-
|
|
6186
|
-
// src/queries/SEARCH_ITEM_QUERY.ts
|
|
6187
|
-
import { gql } from "@apollo/client";
|
|
6188
|
-
var FinancialOptionDetail = gql`
|
|
6189
|
-
fragment FinancialOptionDetail on FinancialOptionDetail {
|
|
6190
|
-
current
|
|
6191
|
-
default
|
|
6192
|
-
max
|
|
6193
|
-
min
|
|
6194
|
-
step
|
|
4958
|
+
// src/queries/SEARCH_ITEM_QUERY.ts
|
|
4959
|
+
import { gql } from "@apollo/client";
|
|
4960
|
+
var FinancialOptionDetail = gql`
|
|
4961
|
+
fragment FinancialOptionDetail on FinancialOptionDetail {
|
|
4962
|
+
current
|
|
4963
|
+
default
|
|
4964
|
+
max
|
|
4965
|
+
min
|
|
4966
|
+
step
|
|
6195
4967
|
}
|
|
6196
4968
|
`;
|
|
6197
4969
|
var HoursOpen = gql`
|
|
@@ -6413,30 +5185,164 @@ var SEARCH_ITEM_QUERY = gql`
|
|
|
6413
5185
|
title
|
|
6414
5186
|
}
|
|
6415
5187
|
}
|
|
6416
|
-
${HoursOpen}
|
|
6417
|
-
${FinancialOptionDetail}
|
|
5188
|
+
${HoursOpen}
|
|
5189
|
+
${FinancialOptionDetail}
|
|
5190
|
+
`;
|
|
5191
|
+
var SEARCH_ITEM_QUERY_default = SEARCH_ITEM_QUERY;
|
|
5192
|
+
|
|
5193
|
+
// src/hooks/useSearchItem.ts
|
|
5194
|
+
var useSearchItem = (id) => useQuery(SEARCH_ITEM_QUERY_default, {
|
|
5195
|
+
variables: { id },
|
|
5196
|
+
skip: !id
|
|
5197
|
+
});
|
|
5198
|
+
var useSearchItem_default = useSearchItem;
|
|
5199
|
+
|
|
5200
|
+
// src/components/Modal/index.tsx
|
|
5201
|
+
import * as React39 from "react";
|
|
5202
|
+
|
|
5203
|
+
// src/components/Modal/wrapper.tsx
|
|
5204
|
+
import styled34 from "styled-components";
|
|
5205
|
+
var Wrapper17 = styled34.div.attrs(() => ({
|
|
5206
|
+
role: "dialog"
|
|
5207
|
+
}))`
|
|
5208
|
+
position: fixed;
|
|
5209
|
+
top: 0;
|
|
5210
|
+
bottom: 0;
|
|
5211
|
+
left: 0;
|
|
5212
|
+
right: 0;
|
|
5213
|
+
width: 100%;
|
|
5214
|
+
white-space: normal;
|
|
5215
|
+
text-align: left;
|
|
5216
|
+
z-index: 90;
|
|
5217
|
+
display: flex;
|
|
5218
|
+
align-items: center;
|
|
5219
|
+
justify-content: center;
|
|
5220
|
+
|
|
5221
|
+
${(props) => props.theme.breakpoint.Sm} {
|
|
5222
|
+
padding: ${size(2)};
|
|
5223
|
+
}
|
|
6418
5224
|
`;
|
|
6419
|
-
var
|
|
5225
|
+
var UiBlock2 = styled34.div.attrs(() => ({
|
|
5226
|
+
"aria-hidden": "true",
|
|
5227
|
+
role: "button"
|
|
5228
|
+
}))`
|
|
5229
|
+
position: fixed;
|
|
5230
|
+
top: 0;
|
|
5231
|
+
bottom: 0;
|
|
5232
|
+
left: 0;
|
|
5233
|
+
right: 0;
|
|
5234
|
+
background-color: rgba(0, 0, 0, 0.35);
|
|
5235
|
+
z-index: -1;
|
|
6420
5236
|
|
|
6421
|
-
|
|
6422
|
-
|
|
6423
|
-
|
|
6424
|
-
|
|
6425
|
-
}
|
|
6426
|
-
|
|
5237
|
+
${(props) => props.theme.breakpoint.LtMd} {
|
|
5238
|
+
animation: ${fadeIn} 300ms ease forwards;
|
|
5239
|
+
}
|
|
5240
|
+
|
|
5241
|
+
${(props) => props.theme.breakpoint.Md} {
|
|
5242
|
+
animation: ${fadeIn} 400ms ease forwards;
|
|
5243
|
+
}
|
|
5244
|
+
`;
|
|
5245
|
+
var Dialog = styled34.article.attrs(() => ({
|
|
5246
|
+
className: "wayke__theme wayke__font--regular"
|
|
5247
|
+
}))`
|
|
5248
|
+
display: flex;
|
|
5249
|
+
flex-direction: column;
|
|
5250
|
+
background-color: ${(props) => props.theme.color.bg};
|
|
5251
|
+
z-index: 1;
|
|
5252
|
+
width: 100%;
|
|
5253
|
+
max-width: 680px;
|
|
5254
|
+
max-height: 100%;
|
|
5255
|
+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
|
|
5256
|
+
overflow: hidden;
|
|
5257
|
+
|
|
5258
|
+
${(props) => props.theme.breakpoint.LtSm} {
|
|
5259
|
+
align-self: flex-end;
|
|
5260
|
+
transform: translateY(100%);
|
|
5261
|
+
animation: ${noTransform} 300ms ease forwards;
|
|
5262
|
+
}
|
|
5263
|
+
|
|
5264
|
+
${(props) => props.theme.breakpoint.Sm} {
|
|
5265
|
+
transform: translateY(${size(2)});
|
|
5266
|
+
animation: ${fadeIn} 400ms ease, ${noTransform} 400ms ease forwards;
|
|
5267
|
+
}
|
|
5268
|
+
`;
|
|
5269
|
+
var Content4 = styled34.div`
|
|
5270
|
+
flex: 1 1 auto;
|
|
5271
|
+
overflow: auto;
|
|
5272
|
+
-webkit-overflow-scrolling: touch;
|
|
5273
|
+
`;
|
|
5274
|
+
var Header4 = styled34.header`
|
|
5275
|
+
display: flex;
|
|
5276
|
+
align-items: center;
|
|
5277
|
+
min-height: 60px;
|
|
5278
|
+
padding: ${size(3)};
|
|
5279
|
+
padding-bottom: 0;
|
|
5280
|
+
`;
|
|
5281
|
+
var Heading5 = styled34.div`
|
|
5282
|
+
flex: 1 1 auto;
|
|
5283
|
+
|
|
5284
|
+
${H1} {
|
|
5285
|
+
font-size: 1.5rem;
|
|
5286
|
+
}
|
|
5287
|
+
`;
|
|
5288
|
+
var Close2 = styled34.div`
|
|
5289
|
+
flex-shrink: 0;
|
|
5290
|
+
margin: ${size(-2)};
|
|
5291
|
+
padding-left: ${size(3)};
|
|
5292
|
+
`;
|
|
5293
|
+
var CloseBtn2 = styled34(ButtonReset)`
|
|
5294
|
+
display: block;
|
|
5295
|
+
padding: ${size(2)};
|
|
5296
|
+
`;
|
|
5297
|
+
var Body4 = styled34.div`
|
|
5298
|
+
padding: ${size(3)};
|
|
5299
|
+
`;
|
|
5300
|
+
var Image2 = styled34.img`
|
|
5301
|
+
display: block;
|
|
5302
|
+
width: calc(100% + ${size(6)});
|
|
5303
|
+
margin-left: ${size(-3)};
|
|
5304
|
+
margin-bottom: ${size(3)};
|
|
5305
|
+
`;
|
|
5306
|
+
var ModalFoldout = styled34.div`
|
|
5307
|
+
background-color: ${(props) => props.theme.color.accent};
|
|
5308
|
+
margin: ${size(-3)};
|
|
5309
|
+
margin-top: ${size(3)};
|
|
5310
|
+
padding: ${size(3)};
|
|
5311
|
+
`;
|
|
5312
|
+
var ModalFoldoutBody = styled34.div``;
|
|
5313
|
+
|
|
5314
|
+
// src/components/Modal/index.tsx
|
|
5315
|
+
var Modal = ({ id, title, onClose, children }) => {
|
|
5316
|
+
return /* @__PURE__ */ React39.createElement(portal_default, {
|
|
5317
|
+
id: id || portal_namespace_exports.DefaultPortal
|
|
5318
|
+
}, /* @__PURE__ */ React39.createElement(Wrapper17, {
|
|
5319
|
+
onClick: (e) => e.stopPropagation()
|
|
5320
|
+
}, /* @__PURE__ */ React39.createElement(UiBlock2, {
|
|
5321
|
+
onClick: onClose,
|
|
5322
|
+
title: "St\xE4ng modal"
|
|
5323
|
+
}), /* @__PURE__ */ React39.createElement(Dialog, null, /* @__PURE__ */ React39.createElement(Content4, null, /* @__PURE__ */ React39.createElement(Header4, null, /* @__PURE__ */ React39.createElement(Heading5, null, /* @__PURE__ */ React39.createElement(H1, {
|
|
5324
|
+
noMargin: true
|
|
5325
|
+
}, title)), /* @__PURE__ */ React39.createElement(Close2, null, /* @__PURE__ */ React39.createElement(CloseBtn2, {
|
|
5326
|
+
onClick: onClose,
|
|
5327
|
+
title: "St\xE4ng modal"
|
|
5328
|
+
}, /* @__PURE__ */ React39.createElement(IconCancel, {
|
|
5329
|
+
block: true
|
|
5330
|
+
})))), /* @__PURE__ */ React39.createElement(Body4, null, children)))));
|
|
5331
|
+
};
|
|
5332
|
+
var Modal_default = Modal;
|
|
6427
5333
|
|
|
6428
5334
|
// src/components/FinancialOptions/index.tsx
|
|
6429
|
-
import
|
|
5335
|
+
import React48, { Fragment } from "react";
|
|
6430
5336
|
|
|
6431
5337
|
// src/components/FinancialOptions/leasing.tsx
|
|
6432
|
-
import
|
|
5338
|
+
import React42, { useState as useState10, useCallback as useCallback15 } from "react";
|
|
6433
5339
|
|
|
6434
5340
|
// src/components/OptionBox/index.tsx
|
|
6435
|
-
import * as
|
|
5341
|
+
import * as React40 from "react";
|
|
6436
5342
|
|
|
6437
5343
|
// src/components/OptionBox/wrapper.tsx
|
|
6438
|
-
import
|
|
6439
|
-
var
|
|
5344
|
+
import styled35 from "styled-components";
|
|
5345
|
+
var Wrapper18 = styled35.div`
|
|
6440
5346
|
display: flex;
|
|
6441
5347
|
align-items: center;
|
|
6442
5348
|
padding: ${size(1)};
|
|
@@ -6447,14 +5353,14 @@ var Wrapper21 = styled39.div`
|
|
|
6447
5353
|
margin-top: ${size(1)};
|
|
6448
5354
|
}
|
|
6449
5355
|
`;
|
|
6450
|
-
var Logo2 =
|
|
5356
|
+
var Logo2 = styled35.div`
|
|
6451
5357
|
position: relative;
|
|
6452
5358
|
flex-shrink: 0;
|
|
6453
5359
|
margin-right: ${size(1)};
|
|
6454
5360
|
width: ${size(9.5)};
|
|
6455
5361
|
height: ${size(6)};
|
|
6456
5362
|
`;
|
|
6457
|
-
var LogoImg =
|
|
5363
|
+
var LogoImg = styled35.img`
|
|
6458
5364
|
display: block;
|
|
6459
5365
|
position: absolute;
|
|
6460
5366
|
left: 0;
|
|
@@ -6465,17 +5371,17 @@ var LogoImg = styled39.img`
|
|
|
6465
5371
|
max-width: 100%;
|
|
6466
5372
|
max-height: 100%;
|
|
6467
5373
|
`;
|
|
6468
|
-
var Content5 =
|
|
5374
|
+
var Content5 = styled35.div`
|
|
6469
5375
|
flex: 1 1 auto;
|
|
6470
5376
|
text-align: right;
|
|
6471
5377
|
line-height: 1.4;
|
|
6472
5378
|
`;
|
|
6473
|
-
var OptionBoxHeading =
|
|
5379
|
+
var OptionBoxHeading = styled35.div.attrs(() => ({
|
|
6474
5380
|
className: "wayke__theme wayke__font--bold"
|
|
6475
5381
|
}))`
|
|
6476
5382
|
font-size: 1rem;
|
|
6477
5383
|
`;
|
|
6478
|
-
var OptionBoxContent =
|
|
5384
|
+
var OptionBoxContent = styled35.div`
|
|
6479
5385
|
margin-top: ${size(0.5)};
|
|
6480
5386
|
font-size: 0.875rem;
|
|
6481
5387
|
|
|
@@ -6485,24 +5391,24 @@ var OptionBoxContent = styled39.div`
|
|
|
6485
5391
|
`;
|
|
6486
5392
|
|
|
6487
5393
|
// src/components/OptionBox/index.tsx
|
|
6488
|
-
var OptionBox = ({ logo, logo2x, logoAlt, children }) => /* @__PURE__ */
|
|
5394
|
+
var OptionBox = ({ logo, logo2x, logoAlt, children }) => /* @__PURE__ */ React40.createElement(Wrapper18, null, logo && /* @__PURE__ */ React40.createElement(Logo2, null, /* @__PURE__ */ React40.createElement(LogoImg, {
|
|
6489
5395
|
src: logo,
|
|
6490
5396
|
srcSet: logo2x,
|
|
6491
5397
|
alt: logoAlt
|
|
6492
|
-
})), /* @__PURE__ */
|
|
5398
|
+
})), /* @__PURE__ */ React40.createElement(Content5, null, children));
|
|
6493
5399
|
var OptionBox_default = OptionBox;
|
|
6494
5400
|
|
|
6495
5401
|
// src/components/DataList/index.tsx
|
|
6496
|
-
import
|
|
5402
|
+
import React41 from "react";
|
|
6497
5403
|
|
|
6498
5404
|
// src/components/DataList/wrapper.tsx
|
|
6499
|
-
import
|
|
6500
|
-
var List8 =
|
|
5405
|
+
import styled36 from "styled-components";
|
|
5406
|
+
var List8 = styled36.ul`
|
|
6501
5407
|
list-style: none;
|
|
6502
5408
|
padding: 0;
|
|
6503
5409
|
margin: 0;
|
|
6504
5410
|
`;
|
|
6505
|
-
var
|
|
5411
|
+
var Item8 = styled36.li`
|
|
6506
5412
|
display: flex;
|
|
6507
5413
|
align-items: flex-start;
|
|
6508
5414
|
|
|
@@ -6510,10 +5416,10 @@ var Item10 = styled40.li`
|
|
|
6510
5416
|
margin-top: ${size(1)};
|
|
6511
5417
|
}
|
|
6512
5418
|
`;
|
|
6513
|
-
var Label7 =
|
|
5419
|
+
var Label7 = styled36.div`
|
|
6514
5420
|
flex: 1 1 auto;
|
|
6515
5421
|
`;
|
|
6516
|
-
var Value2 =
|
|
5422
|
+
var Value2 = styled36.div.attrs(() => ({
|
|
6517
5423
|
className: "wayke__theme wayke__font--bold"
|
|
6518
5424
|
}))`
|
|
6519
5425
|
flex-shrink: 0;
|
|
@@ -6521,25 +5427,25 @@ var Value2 = styled40.div.attrs(() => ({
|
|
|
6521
5427
|
`;
|
|
6522
5428
|
|
|
6523
5429
|
// src/components/DataList/index.tsx
|
|
6524
|
-
var DataList = ({ items }) => /* @__PURE__ */
|
|
5430
|
+
var DataList = ({ items }) => /* @__PURE__ */ React41.createElement(List8, null, items.map((item) => /* @__PURE__ */ React41.createElement(Item8, {
|
|
6525
5431
|
key: item.label
|
|
6526
|
-
}, /* @__PURE__ */
|
|
5432
|
+
}, /* @__PURE__ */ React41.createElement(Label7, null, item.label), /* @__PURE__ */ React41.createElement(Value2, null, item.value))));
|
|
6527
5433
|
var DataList_default = DataList;
|
|
6528
5434
|
|
|
6529
5435
|
// src/components/FinancialOptions/leasing.tsx
|
|
6530
5436
|
var Leasing = ({ financialOption }) => {
|
|
6531
|
-
const [modal, setModal] =
|
|
6532
|
-
const toggleModal =
|
|
5437
|
+
const [modal, setModal] = useState10(false);
|
|
5438
|
+
const toggleModal = useCallback15(() => setModal(!modal), [modal]);
|
|
6533
5439
|
const { image, description, monthlyCost, duration, mileage } = financialOption;
|
|
6534
|
-
return /* @__PURE__ */
|
|
5440
|
+
return /* @__PURE__ */ React42.createElement(React42.Fragment, null, modal && /* @__PURE__ */ React42.createElement(Modal_default, {
|
|
6535
5441
|
title: "Privatleasing",
|
|
6536
5442
|
onClose: toggleModal
|
|
6537
|
-
}, image && /* @__PURE__ */
|
|
5443
|
+
}, image && /* @__PURE__ */ React42.createElement(Image2, {
|
|
6538
5444
|
src: image,
|
|
6539
5445
|
alt: "Privatleasing"
|
|
6540
|
-
}), description && /* @__PURE__ */
|
|
5446
|
+
}), description && /* @__PURE__ */ React42.createElement(Content_default, {
|
|
6541
5447
|
dangerouslySetInnerHTML: { __html: description }
|
|
6542
|
-
}), /* @__PURE__ */
|
|
5448
|
+
}), /* @__PURE__ */ React42.createElement(ModalFoldout, null, /* @__PURE__ */ React42.createElement(ModalFoldoutBody, null, /* @__PURE__ */ React42.createElement(DataList_default, {
|
|
6543
5449
|
items: [
|
|
6544
5450
|
{
|
|
6545
5451
|
label: "M\xE5nadskostnad",
|
|
@@ -6554,14 +5460,14 @@ var Leasing = ({ financialOption }) => {
|
|
|
6554
5460
|
value: `${numberSeparator(mileage?.current || 0)} mil/\xE5r`
|
|
6555
5461
|
}
|
|
6556
5462
|
]
|
|
6557
|
-
})))), /* @__PURE__ */
|
|
5463
|
+
})))), /* @__PURE__ */ React42.createElement(OptionBox_default, null, /* @__PURE__ */ React42.createElement(React42.Fragment, null, monthlyCost !== null && monthlyCost !== void 0 && /* @__PURE__ */ React42.createElement(OptionBoxHeading, null, `ca ${numberSeparator(monthlyCost)} kr/m\xE5n`)), /* @__PURE__ */ React42.createElement(OptionBoxContent, null, /* @__PURE__ */ React42.createElement("p", null, "Privatleasing", " ", mileage?.current && duration?.current && /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(UtilityTextPrimary, null, numberSeparator(mileage?.current), " mil/\xE5r"), " ", "i ", /* @__PURE__ */ React42.createElement(UtilityTextPrimary, null, duration?.current, " m\xE5n"), ".", " ")), /* @__PURE__ */ React42.createElement("p", null, /* @__PURE__ */ React42.createElement(ButtonInline, {
|
|
6558
5464
|
onClick: toggleModal
|
|
6559
5465
|
}, "L\xE4s mer")))));
|
|
6560
5466
|
};
|
|
6561
5467
|
var leasing_default = Leasing;
|
|
6562
5468
|
|
|
6563
5469
|
// src/components/FinancialOptions/loan.tsx
|
|
6564
|
-
import
|
|
5470
|
+
import React47, { useState as useState13, useCallback as useCallback18 } from "react";
|
|
6565
5471
|
|
|
6566
5472
|
// src/hooks/useLoan.ts
|
|
6567
5473
|
import { useQuery as useQuery2 } from "@apollo/client";
|
|
@@ -6617,22 +5523,22 @@ var useLoanCalculation = (id, duration, downPayment, residual) => useQuery2(LOAN
|
|
|
6617
5523
|
var useLoan_default = useLoanCalculation;
|
|
6618
5524
|
|
|
6619
5525
|
// src/components/FinancialOptions/LoanModal.tsx
|
|
6620
|
-
import
|
|
5526
|
+
import React46, { useState as useState12, useCallback as useCallback17, useEffect as useEffect8 } from "react";
|
|
6621
5527
|
|
|
6622
5528
|
// src/components/ContentLogo/index.tsx
|
|
6623
|
-
import
|
|
6624
|
-
var ContentLogo =
|
|
5529
|
+
import styled37 from "styled-components";
|
|
5530
|
+
var ContentLogo = styled37.div`
|
|
6625
5531
|
${(props) => props.theme.breakpoint.Sm} {
|
|
6626
5532
|
display: flex;
|
|
6627
5533
|
align-items: flex-start;
|
|
6628
5534
|
}
|
|
6629
5535
|
`;
|
|
6630
|
-
var ContentLogoText =
|
|
5536
|
+
var ContentLogoText = styled37.div`
|
|
6631
5537
|
${(props) => props.theme.breakpoint.Sm} {
|
|
6632
5538
|
flex: 1 1 auto;
|
|
6633
5539
|
}
|
|
6634
5540
|
`;
|
|
6635
|
-
var ContentLogoMedia =
|
|
5541
|
+
var ContentLogoMedia = styled37.div`
|
|
6636
5542
|
${(props) => props.theme.breakpoint.LtSm} {
|
|
6637
5543
|
margin-top: ${size(2)};
|
|
6638
5544
|
}
|
|
@@ -6644,44 +5550,44 @@ var ContentLogoMedia = styled41.div`
|
|
|
6644
5550
|
`;
|
|
6645
5551
|
|
|
6646
5552
|
// src/components/RangeSlider/SliderWithLabel.tsx
|
|
6647
|
-
import
|
|
5553
|
+
import React45, { useCallback as useCallback16, useEffect as useEffect7, useState as useState11 } from "react";
|
|
6648
5554
|
|
|
6649
5555
|
// src/components/RangeSliderLabel/index.tsx
|
|
6650
|
-
import
|
|
5556
|
+
import React43 from "react";
|
|
6651
5557
|
|
|
6652
5558
|
// src/components/RangeSliderLabel/wrapper.tsx
|
|
6653
|
-
import
|
|
6654
|
-
var
|
|
5559
|
+
import styled38, { css as css12 } from "styled-components";
|
|
5560
|
+
var Wrapper19 = styled38.div`
|
|
6655
5561
|
display: flex;
|
|
6656
5562
|
align-items: flex-end;
|
|
6657
5563
|
`;
|
|
6658
|
-
var Label8 =
|
|
5564
|
+
var Label8 = styled38.div.attrs(() => ({
|
|
6659
5565
|
className: "wayke__theme wayke__font--bold"
|
|
6660
5566
|
}))`
|
|
6661
5567
|
flex: 1 1 auto;
|
|
6662
5568
|
`;
|
|
6663
|
-
var Value3 =
|
|
5569
|
+
var Value3 = styled38.div.attrs(() => ({
|
|
6664
5570
|
className: "wayke__theme wayke__font--bold wayke__color--primary-text"
|
|
6665
5571
|
}))`
|
|
6666
5572
|
flex-shrink: 0;
|
|
6667
5573
|
padding-left: ${size(2)};
|
|
6668
5574
|
font-size: 1.125rem;
|
|
6669
5575
|
|
|
6670
|
-
${({ isHighlighted }) => isHighlighted &&
|
|
5576
|
+
${({ isHighlighted }) => isHighlighted && css12`
|
|
6671
5577
|
font-size: 1.375rem;
|
|
6672
5578
|
color: ${(props) => props.theme.color.textDark} !important;
|
|
6673
5579
|
`}
|
|
6674
5580
|
`;
|
|
6675
5581
|
|
|
6676
5582
|
// src/components/RangeSliderLabel/index.tsx
|
|
6677
|
-
var RangeSliderLabel = ({ label, value, highlight }) => /* @__PURE__ */
|
|
5583
|
+
var RangeSliderLabel = ({ label, value, highlight }) => /* @__PURE__ */ React43.createElement(Wrapper19, null, /* @__PURE__ */ React43.createElement(Label8, null, label), value && /* @__PURE__ */ React43.createElement(Value3, {
|
|
6678
5584
|
isHighlighted: highlight
|
|
6679
5585
|
}, value));
|
|
6680
5586
|
var RangeSliderLabel_default = RangeSliderLabel;
|
|
6681
5587
|
|
|
6682
5588
|
// src/components/RangeSlider/RangeSliderSimple.tsx
|
|
6683
|
-
import
|
|
6684
|
-
import { Slider as
|
|
5589
|
+
import React44 from "react";
|
|
5590
|
+
import { Slider as Slider3, Rail as Rail2, Handles as Handles2, Tracks as Tracks2 } from "react-compound-slider";
|
|
6685
5591
|
var RangeSliderSimple = ({
|
|
6686
5592
|
loading,
|
|
6687
5593
|
values,
|
|
@@ -6700,7 +5606,7 @@ var RangeSliderSimple = ({
|
|
|
6700
5606
|
if (steps.length < 2) {
|
|
6701
5607
|
return null;
|
|
6702
5608
|
}
|
|
6703
|
-
return /* @__PURE__ */
|
|
5609
|
+
return /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement(Slider, null, /* @__PURE__ */ React44.createElement(Slider3, {
|
|
6704
5610
|
disabled: loading,
|
|
6705
5611
|
mode: 1,
|
|
6706
5612
|
step,
|
|
@@ -6709,20 +5615,20 @@ var RangeSliderSimple = ({
|
|
|
6709
5615
|
onUpdate,
|
|
6710
5616
|
values,
|
|
6711
5617
|
rootStyle: { position: "relative" }
|
|
6712
|
-
}, /* @__PURE__ */
|
|
5618
|
+
}, /* @__PURE__ */ React44.createElement(Rail2, null, ({ getRailProps }) => /* @__PURE__ */ React44.createElement(Bar2, {
|
|
6713
5619
|
...getRailProps()
|
|
6714
|
-
})), /* @__PURE__ */
|
|
5620
|
+
})), /* @__PURE__ */ React44.createElement(Handles2, null, ({ handles, getHandleProps }) => /* @__PURE__ */ React44.createElement("div", {
|
|
6715
5621
|
className: "slider-handles"
|
|
6716
|
-
}, handles.map((handle) => /* @__PURE__ */
|
|
5622
|
+
}, handles.map((handle) => /* @__PURE__ */ React44.createElement(Handle2, {
|
|
6717
5623
|
key: handle.id,
|
|
6718
5624
|
handle,
|
|
6719
5625
|
domain,
|
|
6720
5626
|
getHandleProps
|
|
6721
|
-
})))), /* @__PURE__ */
|
|
5627
|
+
})))), /* @__PURE__ */ React44.createElement(Tracks2, {
|
|
6722
5628
|
right: false
|
|
6723
|
-
}, ({ tracks, getTrackProps }) => /* @__PURE__ */
|
|
5629
|
+
}, ({ tracks, getTrackProps }) => /* @__PURE__ */ React44.createElement("div", {
|
|
6724
5630
|
className: "slider-tracks"
|
|
6725
|
-
}, tracks.map(({ id, source, target }) => /* @__PURE__ */
|
|
5631
|
+
}, tracks.map(({ id, source, target }) => /* @__PURE__ */ React44.createElement(Track2, {
|
|
6726
5632
|
key: id,
|
|
6727
5633
|
source,
|
|
6728
5634
|
target,
|
|
@@ -6742,18 +5648,18 @@ var SliderWithLabel = ({
|
|
|
6742
5648
|
formatValues,
|
|
6743
5649
|
onChange
|
|
6744
5650
|
}) => {
|
|
6745
|
-
const [local, setLocal] =
|
|
6746
|
-
const onUpdate =
|
|
5651
|
+
const [local, setLocal] = useState11(steps);
|
|
5652
|
+
const onUpdate = useCallback16((nextValues) => {
|
|
6747
5653
|
setLocal([...nextValues]);
|
|
6748
5654
|
}, []);
|
|
6749
|
-
|
|
5655
|
+
useEffect7(() => {
|
|
6750
5656
|
if (!loading)
|
|
6751
5657
|
setLocal(void 0);
|
|
6752
5658
|
}, [loading]);
|
|
6753
|
-
return /* @__PURE__ */
|
|
5659
|
+
return /* @__PURE__ */ React45.createElement(React45.Fragment, null, /* @__PURE__ */ React45.createElement(RepeatTiny, null, /* @__PURE__ */ React45.createElement(RangeSliderLabel_default, {
|
|
6754
5660
|
label,
|
|
6755
5661
|
value: `${numberSeparator(local?.[0] || values[0])}${unit ? ` ${unit}` : ""}`
|
|
6756
|
-
})), /* @__PURE__ */
|
|
5662
|
+
})), /* @__PURE__ */ React45.createElement(RepeatTiny, null, /* @__PURE__ */ React45.createElement(RangeSliderSimple_default, {
|
|
6757
5663
|
loading,
|
|
6758
5664
|
values,
|
|
6759
5665
|
domain,
|
|
@@ -6778,22 +5684,22 @@ var stepGenerator = (step, max, steps = [], current) => {
|
|
|
6778
5684
|
return stepGenerator(step, max, steps, nextCurrent);
|
|
6779
5685
|
};
|
|
6780
5686
|
var LoanModal = ({ id, financialOption, onClose }) => {
|
|
6781
|
-
const [tmp, setTmp] =
|
|
6782
|
-
const [extend, setExtend] =
|
|
6783
|
-
const onToggleExtend =
|
|
5687
|
+
const [tmp, setTmp] = useState12();
|
|
5688
|
+
const [extend, setExtend] = React46.useState(false);
|
|
5689
|
+
const onToggleExtend = React46.useCallback(() => {
|
|
6784
5690
|
if (!extend) {
|
|
6785
5691
|
pubsub_default.publish("FinanceInterest");
|
|
6786
5692
|
}
|
|
6787
5693
|
setExtend(!extend);
|
|
6788
5694
|
}, [extend]);
|
|
6789
|
-
const [variables, setVariables] =
|
|
5695
|
+
const [variables, setVariables] = useState12({
|
|
6790
5696
|
duration: financialOption.duration?.current,
|
|
6791
5697
|
downPayment: financialOption.downPayment?.current,
|
|
6792
5698
|
residual: financialOption.residual?.current
|
|
6793
5699
|
});
|
|
6794
5700
|
const { duration, downPayment, residual } = variables;
|
|
6795
5701
|
const { loading, data } = useLoan_default(id, duration, downPayment, residual);
|
|
6796
|
-
|
|
5702
|
+
useEffect8(() => {
|
|
6797
5703
|
if (data) {
|
|
6798
5704
|
setTmp(data);
|
|
6799
5705
|
setVariables({
|
|
@@ -6809,7 +5715,7 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6809
5715
|
const downPaymentMax = loan?.downPayment?.max || 0;
|
|
6810
5716
|
const downPaymentStep = loan?.downPayment?.step || 0;
|
|
6811
5717
|
const downPaymentSteps = stepGenerator(downPaymentStep, downPaymentMax);
|
|
6812
|
-
const onDownPaymentChange =
|
|
5718
|
+
const onDownPaymentChange = useCallback17(
|
|
6813
5719
|
(values) => {
|
|
6814
5720
|
pubsub_default.publish("FinanceInterest");
|
|
6815
5721
|
setVariables({ ...variables, downPayment: values[0] });
|
|
@@ -6821,7 +5727,7 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6821
5727
|
const durationMax = loan?.duration?.max || 0;
|
|
6822
5728
|
const durationStep = loan?.duration?.step || 0;
|
|
6823
5729
|
const durationSteps = stepGenerator(durationStep, durationMax);
|
|
6824
|
-
const onDurationChange =
|
|
5730
|
+
const onDurationChange = useCallback17(
|
|
6825
5731
|
(values) => {
|
|
6826
5732
|
pubsub_default.publish("FinanceInterest");
|
|
6827
5733
|
setVariables({ ...variables, duration: values[0] });
|
|
@@ -6833,7 +5739,7 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6833
5739
|
const residualMax = (loan?.residual?.max || 0) * 100 || 0;
|
|
6834
5740
|
const residualStep = (loan?.residual?.step || 0) * 100 || 0;
|
|
6835
5741
|
const residualSteps = stepGenerator(residualStep, residualMax);
|
|
6836
|
-
const onResidualChange =
|
|
5742
|
+
const onResidualChange = useCallback17(
|
|
6837
5743
|
(values) => {
|
|
6838
5744
|
pubsub_default.publish("FinanceInterest");
|
|
6839
5745
|
setVariables({ ...variables, residual: values[0] / 100 });
|
|
@@ -6842,14 +5748,14 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6842
5748
|
);
|
|
6843
5749
|
const interestText = ((loan?.interest || 0) * 100).toFixed(2);
|
|
6844
5750
|
const effectiveInterestText = ((loan?.effectiveInterest || 0) * 100).toFixed(2);
|
|
6845
|
-
return /* @__PURE__ */
|
|
5751
|
+
return /* @__PURE__ */ React46.createElement(Modal_default, {
|
|
6846
5752
|
title: "L\xE5nealternativ",
|
|
6847
5753
|
onClose
|
|
6848
|
-
}, /* @__PURE__ */
|
|
5754
|
+
}, /* @__PURE__ */ React46.createElement(Repeat, null, /* @__PURE__ */ React46.createElement(ContentLogo, null, financialOption?.description && /* @__PURE__ */ React46.createElement(ContentLogoText, null, /* @__PURE__ */ React46.createElement(Content_default, null, /* @__PURE__ */ React46.createElement("p", null, financialOption.description))), financialOption?.image && /* @__PURE__ */ React46.createElement(ContentLogoMedia, null, /* @__PURE__ */ React46.createElement(LogoBox_default, {
|
|
6849
5755
|
logo: financialOption.image,
|
|
6850
5756
|
alt: financialOption.name || "Logotyp",
|
|
6851
5757
|
wide: true
|
|
6852
|
-
})))), /* @__PURE__ */
|
|
5758
|
+
})))), /* @__PURE__ */ React46.createElement(Repeat, null, /* @__PURE__ */ React46.createElement(RepeatSmall, null, /* @__PURE__ */ React46.createElement(SliderWithLabel_default, {
|
|
6853
5759
|
label: "Kontantinsatts",
|
|
6854
5760
|
values: [downPaymentCurrent],
|
|
6855
5761
|
domain: [downPaymentMin, downPaymentMax],
|
|
@@ -6858,7 +5764,7 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6858
5764
|
formatValues: true,
|
|
6859
5765
|
loading,
|
|
6860
5766
|
onChange: onDownPaymentChange
|
|
6861
|
-
})), /* @__PURE__ */
|
|
5767
|
+
})), /* @__PURE__ */ React46.createElement(RepeatSmall, null, /* @__PURE__ */ React46.createElement(SliderWithLabel_default, {
|
|
6862
5768
|
label: "Avbetalning",
|
|
6863
5769
|
values: [durationCurrent],
|
|
6864
5770
|
domain: [durationMin, durationMax],
|
|
@@ -6866,7 +5772,7 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6866
5772
|
unit: "m\xE5n",
|
|
6867
5773
|
loading,
|
|
6868
5774
|
onChange: onDurationChange
|
|
6869
|
-
})), residual !== void 0 && residualMax !== 0 && /* @__PURE__ */
|
|
5775
|
+
})), residual !== void 0 && residualMax !== 0 && /* @__PURE__ */ React46.createElement(RepeatSmall, null, /* @__PURE__ */ React46.createElement(SliderWithLabel_default, {
|
|
6870
5776
|
label: "Restskuld",
|
|
6871
5777
|
values: [residualCurrent],
|
|
6872
5778
|
domain: [residualMin, residualMax],
|
|
@@ -6874,12 +5780,12 @@ var LoanModal = ({ id, financialOption, onClose }) => {
|
|
|
6874
5780
|
unit: "%",
|
|
6875
5781
|
loading,
|
|
6876
5782
|
onChange: onResidualChange
|
|
6877
|
-
})), /* @__PURE__ */
|
|
5783
|
+
})), /* @__PURE__ */ React46.createElement(RepeatSmall, null, /* @__PURE__ */ React46.createElement(RepeatTiny, null, /* @__PURE__ */ React46.createElement(Content_default, {
|
|
6878
5784
|
small: true
|
|
6879
|
-
}, /* @__PURE__ */
|
|
5785
|
+
}, /* @__PURE__ */ React46.createElement("p", null, `*Ber\xE4knat p\xE5 ${interestText} % r\xE4nta (effektivt ${effectiveInterestText} %)${loan?.mileage !== null ? `och en \xE5rlig k\xF6rstr\xE4cka om ${loan?.mileage} mil.` : ""}`)))), /* @__PURE__ */ React46.createElement(RepeatSmall, null, /* @__PURE__ */ React46.createElement(ButtonClear, {
|
|
6880
5786
|
onClick: onToggleExtend,
|
|
6881
5787
|
title: extend ? "Visa mindre information" : "Visa mer information"
|
|
6882
|
-
}, /* @__PURE__ */
|
|
5788
|
+
}, /* @__PURE__ */ React46.createElement(ButtonContent, null, extend ? "Mindre information" : "Mer information"))), /* @__PURE__ */ React46.createElement(React46.Fragment, null, extend && /* @__PURE__ */ React46.createElement(ModalFoldout, null, /* @__PURE__ */ React46.createElement(ModalFoldoutBody, null, /* @__PURE__ */ React46.createElement(DataList_default, {
|
|
6883
5789
|
items: [
|
|
6884
5790
|
{
|
|
6885
5791
|
label: "R\xE4nta",
|
|
@@ -6908,8 +5814,8 @@ var LoanModal_default = LoanModal;
|
|
|
6908
5814
|
|
|
6909
5815
|
// src/components/FinancialOptions/loan.tsx
|
|
6910
5816
|
var Loan = ({ id, financialOption }) => {
|
|
6911
|
-
const [modal, setModal] =
|
|
6912
|
-
const toggleModal =
|
|
5817
|
+
const [modal, setModal] = useState13(false);
|
|
5818
|
+
const toggleModal = useCallback18(() => setModal(!modal), [modal]);
|
|
6913
5819
|
const { data } = useLoan_default(
|
|
6914
5820
|
id,
|
|
6915
5821
|
financialOption.duration?.current,
|
|
@@ -6921,100 +5827,100 @@ var Loan = ({ id, financialOption }) => {
|
|
|
6921
5827
|
const monthlyCost = data?.loan?.monthlyCost;
|
|
6922
5828
|
const logo = financialOption?.logotype || "https://placehold.it/67x10";
|
|
6923
5829
|
if (financialOption.loanAmount === void 0 || financialOption.loanAmount === null || interest === void 0 || duration === void 0 || monthlyCost === void 0 || interest === null || duration === null || monthlyCost === null) {
|
|
6924
|
-
return /* @__PURE__ */
|
|
5830
|
+
return /* @__PURE__ */ React47.createElement(OptionBox_default, {
|
|
6925
5831
|
logo,
|
|
6926
5832
|
logoAlt: "Logotyp"
|
|
6927
|
-
}, /* @__PURE__ */
|
|
5833
|
+
}, /* @__PURE__ */ React47.createElement(OptionBoxHeading, null, "Laddar..."), /* @__PURE__ */ React47.createElement(OptionBoxContent, null, /* @__PURE__ */ React47.createElement("p", null, "Laddar...")));
|
|
6928
5834
|
}
|
|
6929
|
-
return /* @__PURE__ */
|
|
5835
|
+
return /* @__PURE__ */ React47.createElement(React47.Fragment, null, modal && /* @__PURE__ */ React47.createElement(LoanModal_default, {
|
|
6930
5836
|
id,
|
|
6931
5837
|
financialOption,
|
|
6932
5838
|
onClose: toggleModal
|
|
6933
|
-
}), /* @__PURE__ */
|
|
5839
|
+
}), /* @__PURE__ */ React47.createElement(OptionBox_default, {
|
|
6934
5840
|
logo,
|
|
6935
5841
|
logoAlt: "Logotyp"
|
|
6936
|
-
}, /* @__PURE__ */
|
|
5842
|
+
}, /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement(OptionBoxHeading, null, `${numberSeparator(monthlyCost)} kr/m\xE5n*`), /* @__PURE__ */ React47.createElement(OptionBoxContent, null, /* @__PURE__ */ React47.createElement("p", null, "Delbetala", " ", financialOption.loanAmount && duration && /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement(UtilityTextPrimary, null, numberSeparator(financialOption.loanAmount), " kr"), " ", "i ", /* @__PURE__ */ React47.createElement(UtilityTextPrimary, null, duration, " m\xE5n"), ".")), /* @__PURE__ */ React47.createElement("p", null, `*Ber\xE4knat p\xE5 ${(interest * 100).toFixed(2)}% r\xE4nta. `, /* @__PURE__ */ React47.createElement(ButtonInline, {
|
|
6937
5843
|
onClick: toggleModal
|
|
6938
5844
|
}, "L\xE4s mer"))))));
|
|
6939
5845
|
};
|
|
6940
5846
|
var loan_default = Loan;
|
|
6941
5847
|
|
|
6942
5848
|
// src/components/FinancialOptions/index.tsx
|
|
6943
|
-
var FinancialOptions = ({ id, financialOptions }) => /* @__PURE__ */
|
|
5849
|
+
var FinancialOptions = ({ id, financialOptions }) => /* @__PURE__ */ React48.createElement(Repeat, null, /* @__PURE__ */ React48.createElement(RepeatTiny, null, /* @__PURE__ */ React48.createElement(VisualHeading, null, "Andra finansieringsalternativ")), /* @__PURE__ */ React48.createElement(RepeatTiny, null, financialOptions.map((financialOption, index2) => /* @__PURE__ */ React48.createElement(Fragment, {
|
|
6944
5850
|
key: index2
|
|
6945
|
-
}, financialOption.type === "leasing" && /* @__PURE__ */
|
|
5851
|
+
}, financialOption.type === "leasing" && /* @__PURE__ */ React48.createElement(leasing_default, {
|
|
6946
5852
|
financialOption
|
|
6947
|
-
}), financialOption.type === "loan" && /* @__PURE__ */
|
|
5853
|
+
}), financialOption.type === "loan" && /* @__PURE__ */ React48.createElement(loan_default, {
|
|
6948
5854
|
id,
|
|
6949
5855
|
financialOption
|
|
6950
5856
|
})))));
|
|
6951
5857
|
var FinancialOptions_default = FinancialOptions;
|
|
6952
5858
|
|
|
6953
5859
|
// src/components/InsuranceOptions/index.tsx
|
|
6954
|
-
import
|
|
5860
|
+
import React60 from "react";
|
|
6955
5861
|
|
|
6956
5862
|
// src/components/InsuranceOptions/Insurance.tsx
|
|
6957
|
-
import
|
|
5863
|
+
import React57, { useState as useState16, useCallback as useCallback21 } from "react";
|
|
6958
5864
|
|
|
6959
5865
|
// src/components/InsuranceOptions/InsuranceModal.tsx
|
|
6960
|
-
import
|
|
5866
|
+
import React56, { useState as useState15, useCallback as useCallback20 } from "react";
|
|
6961
5867
|
|
|
6962
5868
|
// src/components/DetailBox/index.tsx
|
|
6963
|
-
import
|
|
5869
|
+
import React49 from "react";
|
|
6964
5870
|
|
|
6965
5871
|
// src/components/DetailBox/wrapper.tsx
|
|
6966
|
-
import
|
|
6967
|
-
var
|
|
5872
|
+
import styled39 from "styled-components";
|
|
5873
|
+
var Wrapper20 = styled39.article`
|
|
6968
5874
|
box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
|
|
6969
5875
|
border-radius: 3px;
|
|
6970
5876
|
overflow: hidden;
|
|
6971
5877
|
`;
|
|
6972
|
-
var
|
|
5878
|
+
var Main = styled39.div`
|
|
6973
5879
|
padding: ${size(2.5)};
|
|
6974
5880
|
`;
|
|
6975
|
-
var Heading6 =
|
|
5881
|
+
var Heading6 = styled39(H2).attrs(() => ({
|
|
6976
5882
|
as: "h1"
|
|
6977
5883
|
}))`
|
|
6978
5884
|
margin-bottom: 0;
|
|
6979
5885
|
`;
|
|
6980
|
-
var Description3 =
|
|
5886
|
+
var Description3 = styled39.div`
|
|
6981
5887
|
margin-top: ${size(1)};
|
|
6982
5888
|
`;
|
|
6983
|
-
var Footer3 =
|
|
5889
|
+
var Footer3 = styled39.div`
|
|
6984
5890
|
margin-top: ${size(1)};
|
|
6985
5891
|
color: red;
|
|
6986
5892
|
`;
|
|
6987
|
-
var Foldout =
|
|
5893
|
+
var Foldout = styled39.div`
|
|
6988
5894
|
background-color: ${(props) => props.theme.color.accent};
|
|
6989
5895
|
padding: ${size(2.5)};
|
|
6990
5896
|
`;
|
|
6991
5897
|
|
|
6992
5898
|
// src/components/DetailBox/index.tsx
|
|
6993
5899
|
var DetailBox = ({ heading, description, children }) => {
|
|
6994
|
-
const [extend, setExtend] =
|
|
6995
|
-
const onToggleExtend =
|
|
5900
|
+
const [extend, setExtend] = React49.useState(false);
|
|
5901
|
+
const onToggleExtend = React49.useCallback(() => setExtend(!extend), [extend]);
|
|
6996
5902
|
const extendBtnText = extend ? "Mindre information" : "Mer information";
|
|
6997
|
-
return /* @__PURE__ */
|
|
5903
|
+
return /* @__PURE__ */ React49.createElement(Wrapper20, null, /* @__PURE__ */ React49.createElement(Main, null, /* @__PURE__ */ React49.createElement(Heading6, null, heading), description && /* @__PURE__ */ React49.createElement(Description3, null, description), /* @__PURE__ */ React49.createElement(Footer3, null, /* @__PURE__ */ React49.createElement(ButtonClear, {
|
|
6998
5904
|
onClick: onToggleExtend
|
|
6999
|
-
}, /* @__PURE__ */
|
|
5905
|
+
}, /* @__PURE__ */ React49.createElement(ButtonContent, null, extendBtnText)))), extend && /* @__PURE__ */ React49.createElement(Foldout, null, children));
|
|
7000
5906
|
};
|
|
7001
5907
|
var DetailBox_default = DetailBox;
|
|
7002
5908
|
|
|
7003
5909
|
// src/components/ExtendInfo/index.tsx
|
|
7004
|
-
import
|
|
5910
|
+
import React50, { useState as useState14, useCallback as useCallback19 } from "react";
|
|
7005
5911
|
|
|
7006
5912
|
// src/components/ExtendInfo/wrapper.tsx
|
|
7007
|
-
import
|
|
7008
|
-
var
|
|
7009
|
-
var Header5 =
|
|
5913
|
+
import styled40 from "styled-components";
|
|
5914
|
+
var Wrapper21 = styled40.div``;
|
|
5915
|
+
var Header5 = styled40.div`
|
|
7010
5916
|
display: flex;
|
|
7011
5917
|
align-items: center;
|
|
7012
5918
|
`;
|
|
7013
|
-
var Title =
|
|
7014
|
-
var Info2 =
|
|
5919
|
+
var Title = styled40.div``;
|
|
5920
|
+
var Info2 = styled40.div`
|
|
7015
5921
|
margin-left: ${size(1)};
|
|
7016
5922
|
`;
|
|
7017
|
-
var InfoBtn =
|
|
5923
|
+
var InfoBtn = styled40(ButtonReset).attrs(() => ({
|
|
7018
5924
|
className: "wayke__theme wayke__color--primary-text"
|
|
7019
5925
|
}))`
|
|
7020
5926
|
position: relative;
|
|
@@ -7052,7 +5958,7 @@ var InfoBtn = styled44(ButtonReset).attrs(() => ({
|
|
|
7052
5958
|
transform: scale(0.95);
|
|
7053
5959
|
}
|
|
7054
5960
|
`;
|
|
7055
|
-
var Extend2 =
|
|
5961
|
+
var Extend2 = styled40.div`
|
|
7056
5962
|
padding-top: ${size(1)};
|
|
7057
5963
|
margin-top: ${size(1)};
|
|
7058
5964
|
border-top: 1px solid ${(props) => props.theme.color.border};
|
|
@@ -7061,23 +5967,23 @@ var Extend2 = styled44.div`
|
|
|
7061
5967
|
|
|
7062
5968
|
// src/components/ExtendInfo/index.tsx
|
|
7063
5969
|
var ExtendInfo = ({ title, children }) => {
|
|
7064
|
-
const [extend, setExtend] =
|
|
7065
|
-
const onToggleExtend =
|
|
7066
|
-
return /* @__PURE__ */
|
|
5970
|
+
const [extend, setExtend] = useState14(false);
|
|
5971
|
+
const onToggleExtend = useCallback19(() => setExtend(!extend), [extend]);
|
|
5972
|
+
return /* @__PURE__ */ React50.createElement(Wrapper21, null, /* @__PURE__ */ React50.createElement(Header5, null, /* @__PURE__ */ React50.createElement(Title, null, title), children && /* @__PURE__ */ React50.createElement(Info2, null, /* @__PURE__ */ React50.createElement(InfoBtn, {
|
|
7067
5973
|
onClick: onToggleExtend,
|
|
7068
5974
|
title: "Mer information"
|
|
7069
|
-
}, /* @__PURE__ */
|
|
5975
|
+
}, /* @__PURE__ */ React50.createElement(IconInfo, {
|
|
7070
5976
|
block: true
|
|
7071
|
-
})))), extend && /* @__PURE__ */
|
|
5977
|
+
})))), extend && /* @__PURE__ */ React50.createElement(Extend2, null, children));
|
|
7072
5978
|
};
|
|
7073
5979
|
var ExtendInfo_default = ExtendInfo;
|
|
7074
5980
|
|
|
7075
5981
|
// src/components/InputLabel/index.tsx
|
|
7076
|
-
import
|
|
5982
|
+
import React51 from "react";
|
|
7077
5983
|
|
|
7078
5984
|
// src/components/InputLabel/wrapper.tsx
|
|
7079
|
-
import
|
|
7080
|
-
var
|
|
5985
|
+
import styled41 from "styled-components";
|
|
5986
|
+
var Wrapper22 = styled41.label.attrs(() => ({
|
|
7081
5987
|
className: "wayke__theme wayke__font--bold"
|
|
7082
5988
|
}))`
|
|
7083
5989
|
margin-bottom: ${size(0.5)};
|
|
@@ -7085,24 +5991,24 @@ var Wrapper25 = styled45.label.attrs(() => ({
|
|
|
7085
5991
|
`;
|
|
7086
5992
|
|
|
7087
5993
|
// src/components/InputLabel/index.tsx
|
|
7088
|
-
var InputLabel = ({ children, htmlFor }) => /* @__PURE__ */
|
|
5994
|
+
var InputLabel = ({ children, htmlFor }) => /* @__PURE__ */ React51.createElement(Wrapper22, {
|
|
7089
5995
|
htmlFor
|
|
7090
5996
|
}, children);
|
|
7091
5997
|
var InputLabel_default = InputLabel;
|
|
7092
5998
|
|
|
7093
5999
|
// src/components/InputText/index.tsx
|
|
7094
|
-
import
|
|
6000
|
+
import React52 from "react";
|
|
7095
6001
|
|
|
7096
6002
|
// src/components/InputText/wrapper.tsx
|
|
7097
|
-
import
|
|
7098
|
-
var
|
|
6003
|
+
import styled42 from "styled-components";
|
|
6004
|
+
var Wrapper23 = styled42.div`
|
|
7099
6005
|
position: relative;
|
|
7100
6006
|
display: flex;
|
|
7101
6007
|
align-items: stretch;
|
|
7102
6008
|
background-color: ${(props) => props.theme.color.accent};
|
|
7103
6009
|
border-radius: 3px;
|
|
7104
6010
|
`;
|
|
7105
|
-
var Input2 =
|
|
6011
|
+
var Input2 = styled42.input.attrs(() => ({
|
|
7106
6012
|
type: "text",
|
|
7107
6013
|
className: "wayke__theme wayke__font--regular"
|
|
7108
6014
|
}))`
|
|
@@ -7149,7 +6055,7 @@ var Input2 = styled46.input.attrs(() => ({
|
|
|
7149
6055
|
`;
|
|
7150
6056
|
|
|
7151
6057
|
// src/components/InputText/index.tsx
|
|
7152
|
-
var InputText = ({ placeholder, label, value, id, onChange, onKeyDown }) => /* @__PURE__ */
|
|
6058
|
+
var InputText = ({ placeholder, label, value, id, onChange, onKeyDown }) => /* @__PURE__ */ React52.createElement(Wrapper23, null, /* @__PURE__ */ React52.createElement(Input2, {
|
|
7153
6059
|
placeholder,
|
|
7154
6060
|
value,
|
|
7155
6061
|
id,
|
|
@@ -7160,12 +6066,12 @@ var InputText = ({ placeholder, label, value, id, onChange, onKeyDown }) => /* @
|
|
|
7160
6066
|
var InputText_default = InputText;
|
|
7161
6067
|
|
|
7162
6068
|
// src/components/InputCheckbox/index.tsx
|
|
7163
|
-
import * as
|
|
6069
|
+
import * as React54 from "react";
|
|
7164
6070
|
|
|
7165
6071
|
// src/components/InputCheckbox/wrapper.tsx
|
|
7166
|
-
import * as
|
|
7167
|
-
import
|
|
7168
|
-
var Label9 =
|
|
6072
|
+
import * as React53 from "react";
|
|
6073
|
+
import styled43, { css as css13 } from "styled-components";
|
|
6074
|
+
var Label9 = styled43.label.attrs(() => ({
|
|
7169
6075
|
className: "wayke__theme wayke__color--primary-text"
|
|
7170
6076
|
}))`
|
|
7171
6077
|
position: relative;
|
|
@@ -7195,13 +6101,13 @@ var Label9 = styled47.label.attrs(() => ({
|
|
|
7195
6101
|
margin-top: -2px;
|
|
7196
6102
|
}
|
|
7197
6103
|
`;
|
|
7198
|
-
var
|
|
6104
|
+
var Wrapper24 = styled43((props) => /* @__PURE__ */ React53.createElement("div", {
|
|
7199
6105
|
...props
|
|
7200
6106
|
})).attrs(({ type, checked }) => ({
|
|
7201
6107
|
role: type || "checkbox",
|
|
7202
6108
|
"aria-checked": checked
|
|
7203
6109
|
}))`
|
|
7204
|
-
${({ error }) => error &&
|
|
6110
|
+
${({ error }) => error && css13`
|
|
7205
6111
|
${Label9} {
|
|
7206
6112
|
color: ${(props) => props.theme.color.ui.negative};
|
|
7207
6113
|
|
|
@@ -7211,7 +6117,7 @@ var Wrapper27 = styled47((props) => /* @__PURE__ */ React64.createElement("div",
|
|
|
7211
6117
|
}
|
|
7212
6118
|
`}
|
|
7213
6119
|
`;
|
|
7214
|
-
var Input3 =
|
|
6120
|
+
var Input3 = styled43((props) => /* @__PURE__ */ React53.createElement("input", {
|
|
7215
6121
|
...props,
|
|
7216
6122
|
className: `${props.checked ? "checked" : void 0} ${props.className}`
|
|
7217
6123
|
})).attrs(({ type, checked }) => ({
|
|
@@ -7242,23 +6148,23 @@ var Input3 = styled47((props) => /* @__PURE__ */ React64.createElement("input",
|
|
|
7242
6148
|
}
|
|
7243
6149
|
}
|
|
7244
6150
|
`;
|
|
7245
|
-
var LabelText =
|
|
6151
|
+
var LabelText = styled43.div`
|
|
7246
6152
|
color: ${(props) => props.theme.color.textDark};
|
|
7247
6153
|
`;
|
|
7248
6154
|
|
|
7249
6155
|
// src/components/InputSelect/index.tsx
|
|
7250
|
-
import
|
|
6156
|
+
import React55 from "react";
|
|
7251
6157
|
|
|
7252
6158
|
// src/components/InputSelect/wrapper.tsx
|
|
7253
|
-
import
|
|
6159
|
+
import styled44 from "styled-components";
|
|
7254
6160
|
var iconSize2 = "0.875rem";
|
|
7255
6161
|
var selectPadding = size(2);
|
|
7256
|
-
var
|
|
6162
|
+
var Wrapper25 = styled44.div`
|
|
7257
6163
|
position: relative;
|
|
7258
6164
|
background-color: ${(props) => props.theme.color.accent};
|
|
7259
6165
|
border-radius: 3px;
|
|
7260
6166
|
`;
|
|
7261
|
-
var Select2 =
|
|
6167
|
+
var Select2 = styled44.select.attrs(() => ({
|
|
7262
6168
|
className: "wayke__theme wayke__font--regular"
|
|
7263
6169
|
}))`
|
|
7264
6170
|
position: relative;
|
|
@@ -7292,10 +6198,10 @@ var Select2 = styled48.select.attrs(() => ({
|
|
|
7292
6198
|
border: 0;
|
|
7293
6199
|
}
|
|
7294
6200
|
`;
|
|
7295
|
-
var Option2 =
|
|
6201
|
+
var Option2 = styled44.option`
|
|
7296
6202
|
color: ${(props) => props.theme.color.textDark};
|
|
7297
6203
|
`;
|
|
7298
|
-
var Icon5 =
|
|
6204
|
+
var Icon5 = styled44.div`
|
|
7299
6205
|
position: absolute;
|
|
7300
6206
|
top: 50%;
|
|
7301
6207
|
right: ${selectPadding};
|
|
@@ -7304,29 +6210,29 @@ var Icon5 = styled48.div`
|
|
|
7304
6210
|
`;
|
|
7305
6211
|
|
|
7306
6212
|
// src/components/InputSelect/index.tsx
|
|
7307
|
-
var InputSelect = ({ value, options, onChange, unit, title }) => /* @__PURE__ */
|
|
6213
|
+
var InputSelect = ({ value, options, onChange, unit, title }) => /* @__PURE__ */ React55.createElement(Wrapper25, null, /* @__PURE__ */ React55.createElement(Select2, {
|
|
7308
6214
|
value,
|
|
7309
6215
|
onChange,
|
|
7310
6216
|
title,
|
|
7311
6217
|
"aria-label": title
|
|
7312
|
-
}, options?.map((option) => /* @__PURE__ */
|
|
6218
|
+
}, options?.map((option) => /* @__PURE__ */ React55.createElement(Option2, {
|
|
7313
6219
|
key: option.value,
|
|
7314
6220
|
value: option.value
|
|
7315
|
-
}, option.displayName || option.value, unit ? ` ${unit}` : ""))), /* @__PURE__ */
|
|
6221
|
+
}, option.displayName || option.value, unit ? ` ${unit}` : ""))), /* @__PURE__ */ React55.createElement(Icon5, null, /* @__PURE__ */ React55.createElement(IconChevronDown, {
|
|
7316
6222
|
block: true
|
|
7317
6223
|
})));
|
|
7318
6224
|
var InputSelect_default = InputSelect;
|
|
7319
6225
|
|
|
7320
6226
|
// src/components/InputGroup/index.tsx
|
|
7321
|
-
import
|
|
7322
|
-
var InputGroup =
|
|
6227
|
+
import styled45 from "styled-components";
|
|
6228
|
+
var InputGroup = styled45.div`
|
|
7323
6229
|
${(props) => props.theme.breakpoint.Sm} {
|
|
7324
6230
|
display: flex;
|
|
7325
6231
|
align-items: flex-start;
|
|
7326
6232
|
margin: ${size(-0.5)};
|
|
7327
6233
|
}
|
|
7328
6234
|
`;
|
|
7329
|
-
var InputGroupColumn =
|
|
6235
|
+
var InputGroupColumn = styled45.div`
|
|
7330
6236
|
${(props) => props.theme.breakpoint.LtSm} {
|
|
7331
6237
|
& + & {
|
|
7332
6238
|
margin-top: ${size(1)};
|
|
@@ -7340,12 +6246,12 @@ var InputGroupColumn = styled49.div`
|
|
|
7340
6246
|
`;
|
|
7341
6247
|
|
|
7342
6248
|
// src/components/ColumnRow/index.tsx
|
|
7343
|
-
import
|
|
7344
|
-
var ColumnRow =
|
|
6249
|
+
import styled46 from "styled-components";
|
|
6250
|
+
var ColumnRow = styled46.div`
|
|
7345
6251
|
display: flex;
|
|
7346
6252
|
align-items: flex-start;
|
|
7347
6253
|
`;
|
|
7348
|
-
var ColumnRowItem =
|
|
6254
|
+
var ColumnRowItem = styled46.div`
|
|
7349
6255
|
flex: 1 1 auto;
|
|
7350
6256
|
|
|
7351
6257
|
:last-child:not(:only-child) {
|
|
@@ -7420,30 +6326,30 @@ var ssnIsValid = (s) => s ? /^\d{2,4}\d{2}\d{2}\-?\d{4}$/.test(s) : false;
|
|
|
7420
6326
|
|
|
7421
6327
|
// src/components/InsuranceOptions/InsuranceModal.tsx
|
|
7422
6328
|
var InsuranceModal = ({ id, branch, onClose, insuranceOptions }) => {
|
|
7423
|
-
const [form, setForm] =
|
|
6329
|
+
const [form, setForm] = useState15({
|
|
7424
6330
|
ssn: "",
|
|
7425
6331
|
drivingDistance: "BETWEEN0AND1000" /* Between0And1000 */
|
|
7426
6332
|
});
|
|
7427
|
-
const [payload, setPayload] =
|
|
6333
|
+
const [payload, setPayload] = useState15();
|
|
7428
6334
|
const { loading, data, error } = useInsurance_default(
|
|
7429
6335
|
id,
|
|
7430
6336
|
branch?.id ? branch?.id : void 0,
|
|
7431
6337
|
ssnIsValid(payload?.ssn) ? payload?.ssn : void 0,
|
|
7432
6338
|
payload?.drivingDistance
|
|
7433
6339
|
);
|
|
7434
|
-
const onChangeSsn =
|
|
6340
|
+
const onChangeSsn = useCallback20(
|
|
7435
6341
|
(e) => setForm({ ...form, ssn: e.currentTarget.value }),
|
|
7436
6342
|
[form]
|
|
7437
6343
|
);
|
|
7438
|
-
const onChangeDrivingDistance =
|
|
6344
|
+
const onChangeDrivingDistance = useCallback20(
|
|
7439
6345
|
(e) => setForm({ ...form, drivingDistance: e.currentTarget.value }),
|
|
7440
6346
|
[form]
|
|
7441
6347
|
);
|
|
7442
|
-
const onShowInsurances =
|
|
6348
|
+
const onShowInsurances = useCallback20(() => {
|
|
7443
6349
|
pubsub_default.publish("InsuranceInterest");
|
|
7444
6350
|
setPayload(form);
|
|
7445
6351
|
}, [form]);
|
|
7446
|
-
const onKeyDown =
|
|
6352
|
+
const onKeyDown = useCallback20(
|
|
7447
6353
|
(e) => {
|
|
7448
6354
|
if (e.keyCode === 13 && ssnIsValid(form.ssn) && !loading) {
|
|
7449
6355
|
onShowInsurances();
|
|
@@ -7458,105 +6364,105 @@ var InsuranceModal = ({ id, branch, onClose, insuranceOptions }) => {
|
|
|
7458
6364
|
{ value: "BETWEEN2000AND2500" /* Between2000And2500 */, displayName: "2000 - 2500" },
|
|
7459
6365
|
{ value: "OVER2500" /* Over2500 */, displayName: "2500+" }
|
|
7460
6366
|
];
|
|
7461
|
-
return /* @__PURE__ */
|
|
6367
|
+
return /* @__PURE__ */ React56.createElement(Modal_default, {
|
|
7462
6368
|
title: "F\xF6rs\xE4kring",
|
|
7463
6369
|
onClose
|
|
7464
|
-
}, (insuranceOptions?.description || insuranceOptions?.logotype) && /* @__PURE__ */
|
|
6370
|
+
}, (insuranceOptions?.description || insuranceOptions?.logotype) && /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(ContentLogo, null, insuranceOptions.description && /* @__PURE__ */ React56.createElement(ContentLogoText, null, /* @__PURE__ */ React56.createElement(Content_default, null, /* @__PURE__ */ React56.createElement("p", null, insuranceOptions.description))), insuranceOptions.logotype && /* @__PURE__ */ React56.createElement(ContentLogoMedia, null, /* @__PURE__ */ React56.createElement(LogoBox_default, {
|
|
7465
6371
|
logo: insuranceOptions.logotype,
|
|
7466
6372
|
alt: insuranceOptions.name || "Logotyp",
|
|
7467
6373
|
wide: true
|
|
7468
|
-
})))), /* @__PURE__ */
|
|
6374
|
+
})))), /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(RepeatSmall, null, /* @__PURE__ */ React56.createElement(RepeatTiny, null, /* @__PURE__ */ React56.createElement(InputGroup, null, /* @__PURE__ */ React56.createElement(InputGroupColumn, null, /* @__PURE__ */ React56.createElement(InputLabel_default, {
|
|
7469
6375
|
htmlFor: "input-insurance-personalnumber"
|
|
7470
|
-
}, "Personnummer"), /* @__PURE__ */
|
|
6376
|
+
}, "Personnummer"), /* @__PURE__ */ React56.createElement(InputText_default, {
|
|
7471
6377
|
placeholder: "\xC5\xC5\xC5\xC5MMDD-XXXX",
|
|
7472
6378
|
label: "Personnummer",
|
|
7473
6379
|
value: form.ssn,
|
|
7474
6380
|
onChange: onChangeSsn,
|
|
7475
6381
|
onKeyDown,
|
|
7476
6382
|
id: "input-insurance-personalnumber"
|
|
7477
|
-
})), /* @__PURE__ */
|
|
6383
|
+
})), /* @__PURE__ */ React56.createElement(InputGroupColumn, null, /* @__PURE__ */ React56.createElement(InputLabel_default, {
|
|
7478
6384
|
htmlFor: "input-insurance-mileage"
|
|
7479
|
-
}, "Uppskattad k\xF6rstr\xE4cka per \xE5r"), /* @__PURE__ */
|
|
6385
|
+
}, "Uppskattad k\xF6rstr\xE4cka per \xE5r"), /* @__PURE__ */ React56.createElement(InputSelect_default, {
|
|
7480
6386
|
value: form.drivingDistance,
|
|
7481
6387
|
onChange: onChangeDrivingDistance,
|
|
7482
6388
|
options,
|
|
7483
6389
|
unit: "mil",
|
|
7484
6390
|
title: "Uppskattad k\xF6rstr\xE4cka per \xE5r"
|
|
7485
|
-
})))), /* @__PURE__ */
|
|
6391
|
+
})))), /* @__PURE__ */ React56.createElement(RepeatTiny, null, /* @__PURE__ */ React56.createElement(ButtonPrimary, {
|
|
7486
6392
|
fullWidth: true,
|
|
7487
6393
|
disabled: !ssnIsValid(form.ssn) || loading,
|
|
7488
6394
|
onClick: onShowInsurances
|
|
7489
|
-
}, /* @__PURE__ */
|
|
6395
|
+
}, /* @__PURE__ */ React56.createElement(ButtonContent, null, "Visa f\xF6rs\xE4kringar")))), false, /* @__PURE__ */ React56.createElement(RepeatSmall, null, /* @__PURE__ */ React56.createElement(Content_default, {
|
|
7490
6396
|
small: true
|
|
7491
|
-
}, /* @__PURE__ */
|
|
6397
|
+
}, /* @__PURE__ */ React56.createElement("p", null, "Spara personnummer p\xE5 denna dator f\xF6r att direkt visa f\xF6rs\xE4kringskostnaderna i Wayke. Personnumret lagras inte hos Wayke utan finns bara sparad i din webbl\xE4sare.")))), loading && /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(Loader_default, null)), error && /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(Snackbar_default, {
|
|
7492
6398
|
severity: "error",
|
|
7493
6399
|
icon: true,
|
|
7494
6400
|
heading: "Ett fel har intr\xE4ffat"
|
|
7495
|
-
}, "Kunde inte h\xE4mta f\xF6rs\xE4kringar. V\xE4nligen f\xF6rs\xF6k igen.")), /* @__PURE__ */
|
|
6401
|
+
}, "Kunde inte h\xE4mta f\xF6rs\xE4kringar. V\xE4nligen f\xF6rs\xF6k igen.")), /* @__PURE__ */ React56.createElement(React56.Fragment, null, data?.insurances && /* @__PURE__ */ React56.createElement(Repeat, null, data?.insurances.map((insurance) => /* @__PURE__ */ React56.createElement(Repeat, {
|
|
7496
6402
|
key: insurance.name
|
|
7497
|
-
}, /* @__PURE__ */
|
|
6403
|
+
}, /* @__PURE__ */ React56.createElement(DetailBox_default, {
|
|
7498
6404
|
heading: `${numberSeparator(insurance.price)} ${insurance.unit}`,
|
|
7499
6405
|
description: insurance.name
|
|
7500
|
-
}, /* @__PURE__ */
|
|
6406
|
+
}, /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(React56.Fragment, null, insurance.description && /* @__PURE__ */ React56.createElement(RepeatTiny, null, /* @__PURE__ */ React56.createElement(Content_default, null, /* @__PURE__ */ React56.createElement("p", null, insurance.description)))), /* @__PURE__ */ React56.createElement(React56.Fragment, null, insurance.url && /* @__PURE__ */ React56.createElement(RepeatTiny, null, /* @__PURE__ */ React56.createElement(ButtonInline, {
|
|
7501
6407
|
as: "a",
|
|
7502
6408
|
href: insurance.url || "",
|
|
7503
6409
|
target: "_blank",
|
|
7504
6410
|
rel: "noopener noreferrer nofollow"
|
|
7505
|
-
}, "F\xF6rk\xF6psinformation och villkor (\xF6ppnas i ny flik)")))), insurance.items && insurance.items.length > 0 && /* @__PURE__ */
|
|
6411
|
+
}, "F\xF6rk\xF6psinformation och villkor (\xF6ppnas i ny flik)")))), insurance.items && insurance.items.length > 0 && /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(H4, null, "F\xF6rs\xE4kringen inneh\xE5ller"), insurance.items.map((item) => /* @__PURE__ */ React56.createElement(RepeatSmall, {
|
|
7506
6412
|
key: item.name || ""
|
|
7507
|
-
}, /* @__PURE__ */
|
|
6413
|
+
}, /* @__PURE__ */ React56.createElement(ExtendInfo_default, {
|
|
7508
6414
|
title: item.name || ""
|
|
7509
|
-
}, item.description)))), insurance.addons && insurance.addons.length > 0 && /* @__PURE__ */
|
|
6415
|
+
}, item.description)))), insurance.addons && insurance.addons.length > 0 && /* @__PURE__ */ React56.createElement(Repeat, null, /* @__PURE__ */ React56.createElement(H4, null, "V\xE4lj till"), insurance.addons.map((addon) => /* @__PURE__ */ React56.createElement(RepeatSmall, {
|
|
7510
6416
|
key: addon.title || ""
|
|
7511
|
-
}, /* @__PURE__ */
|
|
6417
|
+
}, /* @__PURE__ */ React56.createElement(ColumnRow, null, /* @__PURE__ */ React56.createElement(ColumnRowItem, null, /* @__PURE__ */ React56.createElement(ExtendInfo_default, {
|
|
7512
6418
|
title: addon.title || ""
|
|
7513
|
-
}, addon.description)), /* @__PURE__ */
|
|
6419
|
+
}, addon.description)), /* @__PURE__ */ React56.createElement(ColumnRowItem, null, /* @__PURE__ */ React56.createElement(UtilityTextBold, null, "+", addon.price, " ", addon.unit))))))))))));
|
|
7514
6420
|
};
|
|
7515
6421
|
var InsuranceModal_default = InsuranceModal;
|
|
7516
6422
|
|
|
7517
6423
|
// src/components/InsuranceOptions/Insurance.tsx
|
|
7518
6424
|
var Insurance = ({ id, branch, insuranceOptions }) => {
|
|
7519
|
-
const [modal, setModal] =
|
|
7520
|
-
const toggleModal =
|
|
6425
|
+
const [modal, setModal] = useState16(false);
|
|
6426
|
+
const toggleModal = useCallback21(() => setModal(!modal), [modal]);
|
|
7521
6427
|
if (!insuranceOptions.length) {
|
|
7522
6428
|
return null;
|
|
7523
6429
|
}
|
|
7524
|
-
return /* @__PURE__ */
|
|
6430
|
+
return /* @__PURE__ */ React57.createElement(React57.Fragment, null, modal && /* @__PURE__ */ React57.createElement(InsuranceModal_default, {
|
|
7525
6431
|
id,
|
|
7526
6432
|
branch,
|
|
7527
6433
|
onClose: toggleModal,
|
|
7528
6434
|
insuranceOptions: insuranceOptions[0]
|
|
7529
|
-
}), /* @__PURE__ */
|
|
6435
|
+
}), /* @__PURE__ */ React57.createElement(Repeat, null, /* @__PURE__ */ React57.createElement(RepeatTiny, null, /* @__PURE__ */ React57.createElement(VisualHeading, null, "V\xE4lj till f\xF6rs\xE4kring")), /* @__PURE__ */ React57.createElement(RepeatTiny, null, /* @__PURE__ */ React57.createElement(React57.Fragment, null, insuranceOptions.map((insuranceOption, index2) => /* @__PURE__ */ React57.createElement(OptionBox_default, {
|
|
7530
6436
|
key: `${insuranceOption.url}-${index2}`,
|
|
7531
6437
|
logo: insuranceOption.logotype || void 0,
|
|
7532
6438
|
logoAlt: insuranceOption.name || "Logotyp"
|
|
7533
|
-
}, /* @__PURE__ */
|
|
6439
|
+
}, /* @__PURE__ */ React57.createElement(OptionBoxHeading, null, "F\xE5 prisf\xF6rslag"), /* @__PURE__ */ React57.createElement(OptionBoxContent, null, /* @__PURE__ */ React57.createElement("p", null, /* @__PURE__ */ React57.createElement(ButtonInline, {
|
|
7534
6440
|
onClick: toggleModal
|
|
7535
6441
|
}, "Mer information")))))))));
|
|
7536
6442
|
};
|
|
7537
6443
|
var Insurance_default = Insurance;
|
|
7538
6444
|
|
|
7539
6445
|
// src/components/InsuranceOptions/InsuranceFree.tsx
|
|
7540
|
-
import
|
|
6446
|
+
import React59, { useState as useState17, useCallback as useCallback22 } from "react";
|
|
7541
6447
|
import { marked as marked2 } from "marked";
|
|
7542
6448
|
|
|
7543
6449
|
// src/components/InsuranceOptions/InsuranceFreeModal.tsx
|
|
7544
|
-
import
|
|
6450
|
+
import React58 from "react";
|
|
7545
6451
|
import { marked } from "marked";
|
|
7546
6452
|
var InsuranceFreeModal = ({ onClose, insuranceOptions }) => {
|
|
7547
|
-
return /* @__PURE__ */
|
|
6453
|
+
return /* @__PURE__ */ React58.createElement(Modal_default, {
|
|
7548
6454
|
title: insuranceOptions?.insuranceHeader ?? "F\xF6rs\xE4kring",
|
|
7549
6455
|
onClose
|
|
7550
|
-
}, insuranceOptions?.longDescription && /* @__PURE__ */
|
|
6456
|
+
}, insuranceOptions?.longDescription && /* @__PURE__ */ React58.createElement(Repeat, null, /* @__PURE__ */ React58.createElement(Content_default, {
|
|
7551
6457
|
dangerouslySetInnerHTML: {
|
|
7552
6458
|
__html: marked(insuranceOptions.longDescription)
|
|
7553
6459
|
}
|
|
7554
|
-
})), insuranceOptions?.url && /* @__PURE__ */
|
|
6460
|
+
})), insuranceOptions?.url && /* @__PURE__ */ React58.createElement(Repeat, null, /* @__PURE__ */ React58.createElement(ButtonInline, {
|
|
7555
6461
|
as: "a",
|
|
7556
6462
|
href: insuranceOptions.url,
|
|
7557
6463
|
target: "_blank",
|
|
7558
6464
|
rel: "noopener noreferrer"
|
|
7559
|
-
}, "L\xE4s mer om f\xF6rs\xE4kringen (\xD6ppnas i ett nytt f\xF6nster)")), insuranceOptions?.logotype && /* @__PURE__ */
|
|
6465
|
+
}, "L\xE4s mer om f\xF6rs\xE4kringen (\xD6ppnas i ett nytt f\xF6nster)")), insuranceOptions?.logotype && /* @__PURE__ */ React58.createElement(Repeat, null, /* @__PURE__ */ React58.createElement(LogoBox_default, {
|
|
7560
6466
|
logo: insuranceOptions.logotype,
|
|
7561
6467
|
alt: insuranceOptions.name || "Logotyp",
|
|
7562
6468
|
wide: true
|
|
@@ -7566,23 +6472,23 @@ var InsuranceFreeModal_default = InsuranceFreeModal;
|
|
|
7566
6472
|
|
|
7567
6473
|
// src/components/InsuranceOptions/InsuranceFree.tsx
|
|
7568
6474
|
var Insurance2 = ({ insuranceOptions }) => {
|
|
7569
|
-
const [modal, setModal] =
|
|
7570
|
-
const toggleModal =
|
|
6475
|
+
const [modal, setModal] = useState17(false);
|
|
6476
|
+
const toggleModal = useCallback22(() => setModal(!modal), [modal]);
|
|
7571
6477
|
if (!insuranceOptions.length) {
|
|
7572
6478
|
return null;
|
|
7573
6479
|
}
|
|
7574
|
-
return /* @__PURE__ */
|
|
6480
|
+
return /* @__PURE__ */ React59.createElement(React59.Fragment, null, modal && /* @__PURE__ */ React59.createElement(InsuranceFreeModal_default, {
|
|
7575
6481
|
onClose: toggleModal,
|
|
7576
6482
|
insuranceOptions: insuranceOptions[0]
|
|
7577
|
-
}), /* @__PURE__ */
|
|
6483
|
+
}), /* @__PURE__ */ React59.createElement(Repeat, null, /* @__PURE__ */ React59.createElement(RepeatTiny, null, /* @__PURE__ */ React59.createElement(VisualHeading, null, insuranceOptions[0]?.insuranceHeader ?? "F\xF6rs\xE4kring")), /* @__PURE__ */ React59.createElement(RepeatTiny, null, /* @__PURE__ */ React59.createElement(React59.Fragment, null, insuranceOptions.map((insuranceOption, index2) => /* @__PURE__ */ React59.createElement(OptionBox_default, {
|
|
7578
6484
|
key: `${insuranceOption.url}-${index2}`,
|
|
7579
6485
|
logo: insuranceOption.logotype || void 0,
|
|
7580
6486
|
logoAlt: insuranceOption.name || "Logotyp"
|
|
7581
|
-
}, insuranceOption.description && /* @__PURE__ */
|
|
6487
|
+
}, insuranceOption.description && /* @__PURE__ */ React59.createElement(Content_default, {
|
|
7582
6488
|
dangerouslySetInnerHTML: {
|
|
7583
6489
|
__html: marked2(insuranceOption.description)
|
|
7584
6490
|
}
|
|
7585
|
-
}), /* @__PURE__ */
|
|
6491
|
+
}), /* @__PURE__ */ React59.createElement(OptionBoxContent, null, /* @__PURE__ */ React59.createElement("p", null, /* @__PURE__ */ React59.createElement(ButtonInline, {
|
|
7586
6492
|
onClick: toggleModal
|
|
7587
6493
|
}, "Mer information")))))))));
|
|
7588
6494
|
};
|
|
@@ -7595,12 +6501,12 @@ var InsuranceOptions = ({ id, branch, insuranceOptions }) => {
|
|
|
7595
6501
|
}
|
|
7596
6502
|
if (insuranceOptions.length > 0) {
|
|
7597
6503
|
if (insuranceOptions[0].requiresDistance && insuranceOptions[0].requiresPersonalNumber)
|
|
7598
|
-
return /* @__PURE__ */
|
|
6504
|
+
return /* @__PURE__ */ React60.createElement(Insurance_default, {
|
|
7599
6505
|
id,
|
|
7600
6506
|
branch,
|
|
7601
6507
|
insuranceOptions
|
|
7602
6508
|
});
|
|
7603
|
-
return /* @__PURE__ */
|
|
6509
|
+
return /* @__PURE__ */ React60.createElement(InsuranceFree_default, {
|
|
7604
6510
|
insuranceOptions
|
|
7605
6511
|
});
|
|
7606
6512
|
}
|
|
@@ -7609,22 +6515,22 @@ var InsuranceOptions = ({ id, branch, insuranceOptions }) => {
|
|
|
7609
6515
|
var InsuranceOptions_default = InsuranceOptions;
|
|
7610
6516
|
|
|
7611
6517
|
// src/layouts/searchItem/ManufacturerPackagesOption.tsx
|
|
7612
|
-
import
|
|
6518
|
+
import React61 from "react";
|
|
7613
6519
|
import { marked as marked3 } from "marked";
|
|
7614
6520
|
var ManufacturerPackageOption = ({ packageOption }) => {
|
|
7615
6521
|
if (!packageOption) {
|
|
7616
6522
|
return null;
|
|
7617
6523
|
}
|
|
7618
|
-
return /* @__PURE__ */
|
|
6524
|
+
return /* @__PURE__ */ React61.createElement(ProductPageMainSection, null, /* @__PURE__ */ React61.createElement(Repeat, null, /* @__PURE__ */ React61.createElement(H2, {
|
|
7619
6525
|
noMargin: true
|
|
7620
|
-
}, packageOption.title)), packageOption.description && /* @__PURE__ */
|
|
6526
|
+
}, packageOption.title)), packageOption.description && /* @__PURE__ */ React61.createElement(Repeat, null, /* @__PURE__ */ React61.createElement(Content_default, {
|
|
7621
6527
|
dangerouslySetInnerHTML: { __html: marked3(packageOption.description) }
|
|
7622
|
-
})), packageOption.link?.url && /* @__PURE__ */
|
|
6528
|
+
})), packageOption.link?.url && /* @__PURE__ */ React61.createElement(Repeat, null, /* @__PURE__ */ React61.createElement(ButtonInline, {
|
|
7623
6529
|
as: "a",
|
|
7624
6530
|
href: packageOption.link.url,
|
|
7625
6531
|
target: "_blank",
|
|
7626
6532
|
rel: "noopener noreferrer"
|
|
7627
|
-
}, packageOption.link.title ? packageOption.link.title : "L\xE4s mer (\xD6ppnas i ett nytt f\xF6nster)")), packageOption.image && /* @__PURE__ */
|
|
6533
|
+
}, packageOption.link.title ? packageOption.link.title : "L\xE4s mer (\xD6ppnas i ett nytt f\xF6nster)")), packageOption.image && /* @__PURE__ */ React61.createElement(Repeat, null, /* @__PURE__ */ React61.createElement(LogoBox_default, {
|
|
7628
6534
|
logo: packageOption.image,
|
|
7629
6535
|
alt: "Logotyp",
|
|
7630
6536
|
wide: true
|
|
@@ -7633,23 +6539,23 @@ var ManufacturerPackageOption = ({ packageOption }) => {
|
|
|
7633
6539
|
var ManufacturerPackagesOption_default = ManufacturerPackageOption;
|
|
7634
6540
|
|
|
7635
6541
|
// src/layouts/searchItem/CheckList.tsx
|
|
7636
|
-
import
|
|
6542
|
+
import React68, { useState as useState21, useCallback as useCallback27, useEffect as useEffect9 } from "react";
|
|
7637
6543
|
|
|
7638
6544
|
// src/components/ActionList/index.tsx
|
|
7639
|
-
import
|
|
6545
|
+
import React63, { useCallback as useCallback24 } from "react";
|
|
7640
6546
|
|
|
7641
6547
|
// src/components/ActionList/toggle-item.tsx
|
|
7642
|
-
import
|
|
6548
|
+
import React62, { useState as useState18, useCallback as useCallback23 } from "react";
|
|
7643
6549
|
var initialValue = {};
|
|
7644
6550
|
var getInitialValue = (title) => title && !!initialValue[title];
|
|
7645
6551
|
var ToggleItem = ({ title, value, type, onClickVisible, onClickValue }) => {
|
|
7646
|
-
const [visible, setVisible] =
|
|
7647
|
-
const _onClickValue =
|
|
6552
|
+
const [visible, setVisible] = useState18(() => getInitialValue(type));
|
|
6553
|
+
const _onClickValue = useCallback23(() => {
|
|
7648
6554
|
if (onClickValue) {
|
|
7649
6555
|
onClickValue();
|
|
7650
6556
|
}
|
|
7651
6557
|
}, []);
|
|
7652
|
-
const onClick =
|
|
6558
|
+
const onClick = useCallback23(() => {
|
|
7653
6559
|
if (!visible) {
|
|
7654
6560
|
initialValue[type] = true;
|
|
7655
6561
|
setVisible(true);
|
|
@@ -7659,17 +6565,17 @@ var ToggleItem = ({ title, value, type, onClickVisible, onClickValue }) => {
|
|
|
7659
6565
|
}
|
|
7660
6566
|
}, [visible]);
|
|
7661
6567
|
const visibleTitle = type === "tel" ? "Ring" : type === "mailto" ? "Skicka ett mail till" : "";
|
|
7662
|
-
return /* @__PURE__ */
|
|
6568
|
+
return /* @__PURE__ */ React62.createElement(RepeatTiny, null, visible ? /* @__PURE__ */ React62.createElement(ButtonSecondary, {
|
|
7663
6569
|
onClick: _onClickValue,
|
|
7664
6570
|
as: "a",
|
|
7665
6571
|
href: `${type}:${value}`,
|
|
7666
6572
|
title: `${visibleTitle} ${value}`,
|
|
7667
6573
|
fullWidth: true
|
|
7668
|
-
}, /* @__PURE__ */
|
|
6574
|
+
}, /* @__PURE__ */ React62.createElement(ButtonContent, null, value)) : /* @__PURE__ */ React62.createElement(ButtonSecondary, {
|
|
7669
6575
|
onClick,
|
|
7670
6576
|
title,
|
|
7671
6577
|
fullWidth: true
|
|
7672
|
-
}, /* @__PURE__ */
|
|
6578
|
+
}, /* @__PURE__ */ React62.createElement(ButtonContent, null, title)));
|
|
7673
6579
|
};
|
|
7674
6580
|
var toggle_item_default = ToggleItem;
|
|
7675
6581
|
|
|
@@ -7782,18 +6688,18 @@ var formatPhonenumber = (text) => {
|
|
|
7782
6688
|
var ActionList = ({ contact, branch }) => {
|
|
7783
6689
|
const email = contact?.email || branch?.contact?.email;
|
|
7784
6690
|
const phonenumber = contact?.phonenumber || branch?.contact?.phonenumber;
|
|
7785
|
-
const onClickMailVisible =
|
|
7786
|
-
const onClickPhoneVisible =
|
|
7787
|
-
const onClickPhoneValue =
|
|
6691
|
+
const onClickMailVisible = useCallback24(() => pubsub_default.publish("MailVisible"), []);
|
|
6692
|
+
const onClickPhoneVisible = useCallback24(() => pubsub_default.publish("PhonenumberVisible"), []);
|
|
6693
|
+
const onClickPhoneValue = useCallback24(() => pubsub_default.publish("PhonenumberCall"), []);
|
|
7788
6694
|
if (!email && !phonenumber) {
|
|
7789
6695
|
return null;
|
|
7790
6696
|
}
|
|
7791
|
-
return /* @__PURE__ */
|
|
6697
|
+
return /* @__PURE__ */ React63.createElement(React63.Fragment, null, email && /* @__PURE__ */ React63.createElement(toggle_item_default, {
|
|
7792
6698
|
onClickVisible: onClickMailVisible,
|
|
7793
6699
|
title: "Visa mailadress",
|
|
7794
6700
|
value: email,
|
|
7795
6701
|
type: "mailto"
|
|
7796
|
-
}), phonenumber && /* @__PURE__ */
|
|
6702
|
+
}), phonenumber && /* @__PURE__ */ React63.createElement(toggle_item_default, {
|
|
7797
6703
|
title: "Visa telefonnummer",
|
|
7798
6704
|
value: formatPhonenumber(phonenumber),
|
|
7799
6705
|
type: "tel",
|
|
@@ -7804,16 +6710,16 @@ var ActionList = ({ contact, branch }) => {
|
|
|
7804
6710
|
var ActionList_default = ActionList;
|
|
7805
6711
|
|
|
7806
6712
|
// src/components/CheckMarkList/index.tsx
|
|
7807
|
-
import
|
|
6713
|
+
import React64 from "react";
|
|
7808
6714
|
|
|
7809
6715
|
// src/components/CheckMarkList/wrapper.tsx
|
|
7810
|
-
import
|
|
7811
|
-
var List9 =
|
|
6716
|
+
import styled47 from "styled-components";
|
|
6717
|
+
var List9 = styled47.ul`
|
|
7812
6718
|
list-style: none;
|
|
7813
6719
|
padding: 0;
|
|
7814
6720
|
margin: 0;
|
|
7815
6721
|
`;
|
|
7816
|
-
var
|
|
6722
|
+
var Item9 = styled47.li`
|
|
7817
6723
|
position: relative;
|
|
7818
6724
|
font-size: 0.875rem;
|
|
7819
6725
|
|
|
@@ -7821,7 +6727,7 @@ var Item11 = styled51.li`
|
|
|
7821
6727
|
margin-top: ${size(0.5)};
|
|
7822
6728
|
}
|
|
7823
6729
|
`;
|
|
7824
|
-
var Icon6 =
|
|
6730
|
+
var Icon6 = styled47.div.attrs(() => ({
|
|
7825
6731
|
className: "wayke__theme wayke__color--primary-text"
|
|
7826
6732
|
}))`
|
|
7827
6733
|
position: absolute;
|
|
@@ -7829,52 +6735,52 @@ var Icon6 = styled51.div.attrs(() => ({
|
|
|
7829
6735
|
top: 4px; // Magic number
|
|
7830
6736
|
font-size: 0.875em;
|
|
7831
6737
|
`;
|
|
7832
|
-
var Label10 =
|
|
6738
|
+
var Label10 = styled47.div`
|
|
7833
6739
|
padding-left: calc(1em + ${size(1)});
|
|
7834
6740
|
`;
|
|
7835
6741
|
|
|
7836
6742
|
// src/components/CheckMarkList/index.tsx
|
|
7837
|
-
var CheckMarkListItem = ({ children }) => /* @__PURE__ */
|
|
6743
|
+
var CheckMarkListItem = ({ children }) => /* @__PURE__ */ React64.createElement(Item9, null, /* @__PURE__ */ React64.createElement(Icon6, null, /* @__PURE__ */ React64.createElement(IconCheck, {
|
|
7838
6744
|
block: true
|
|
7839
|
-
})), /* @__PURE__ */
|
|
7840
|
-
var CheckMarkList = ({ children }) => /* @__PURE__ */
|
|
6745
|
+
})), /* @__PURE__ */ React64.createElement(Label10, null, children));
|
|
6746
|
+
var CheckMarkList = ({ children }) => /* @__PURE__ */ React64.createElement(List9, null, children);
|
|
7841
6747
|
var CheckMarkList_default = CheckMarkList;
|
|
7842
6748
|
|
|
7843
6749
|
// src/components/SwitchBar/index.tsx
|
|
7844
|
-
import
|
|
6750
|
+
import React65, { useState as useState19, useCallback as useCallback25 } from "react";
|
|
7845
6751
|
|
|
7846
6752
|
// src/components/SwitchBar/wrapper.tsx
|
|
7847
|
-
import
|
|
7848
|
-
var
|
|
6753
|
+
import styled48 from "styled-components";
|
|
6754
|
+
var Wrapper26 = styled48.div`
|
|
7849
6755
|
padding: ${size(1.5)} ${size(2)};
|
|
7850
6756
|
background-color: ${(props) => props.theme.color.accentDark};
|
|
7851
6757
|
border-radius: 3px;
|
|
7852
6758
|
font-size: 0.875rem;
|
|
7853
6759
|
`;
|
|
7854
|
-
var Header6 =
|
|
6760
|
+
var Header6 = styled48.div`
|
|
7855
6761
|
display: flex;
|
|
7856
6762
|
align-items: center;
|
|
7857
6763
|
`;
|
|
7858
|
-
var Body5 =
|
|
6764
|
+
var Body5 = styled48.div`
|
|
7859
6765
|
font-size: 0.875rem;
|
|
7860
6766
|
margin-top: ${size(1)};
|
|
7861
6767
|
`;
|
|
7862
|
-
var Info3 =
|
|
6768
|
+
var Info3 = styled48.div`
|
|
7863
6769
|
flex: 1 1 auto;
|
|
7864
6770
|
display: flex;
|
|
7865
6771
|
align-items: center;
|
|
7866
6772
|
`;
|
|
7867
|
-
var Action7 =
|
|
6773
|
+
var Action7 = styled48.div`
|
|
7868
6774
|
flex-shrink: 0;
|
|
7869
6775
|
padding-left: ${size(1.5)};
|
|
7870
6776
|
font-size: 0.875rem;
|
|
7871
6777
|
`;
|
|
7872
|
-
var InfoContent =
|
|
6778
|
+
var InfoContent = styled48.div`
|
|
7873
6779
|
& + & {
|
|
7874
6780
|
margin-left: ${size(0.75)};
|
|
7875
6781
|
}
|
|
7876
6782
|
`;
|
|
7877
|
-
var InfoBtn2 =
|
|
6783
|
+
var InfoBtn2 = styled48(ButtonReset).attrs(() => ({
|
|
7878
6784
|
className: "wayke__theme wayke__color--primary-text"
|
|
7879
6785
|
}))`
|
|
7880
6786
|
position: relative;
|
|
@@ -7908,7 +6814,7 @@ var InfoBtn2 = styled52(ButtonReset).attrs(() => ({
|
|
|
7908
6814
|
transform: scale(0.95);
|
|
7909
6815
|
}
|
|
7910
6816
|
`;
|
|
7911
|
-
var Title2 =
|
|
6817
|
+
var Title2 = styled48.div.attrs(() => ({
|
|
7912
6818
|
className: "wayke__theme wayke__font--bold"
|
|
7913
6819
|
}))`
|
|
7914
6820
|
font-size: 1rem;
|
|
@@ -7916,17 +6822,17 @@ var Title2 = styled52.div.attrs(() => ({
|
|
|
7916
6822
|
|
|
7917
6823
|
// src/components/SwitchBar/index.tsx
|
|
7918
6824
|
var SwitchBar = ({ title, body, actionTitle, children, onClick }) => {
|
|
7919
|
-
const [info, setInfo] =
|
|
7920
|
-
const onToggleInfo =
|
|
7921
|
-
return /* @__PURE__ */
|
|
6825
|
+
const [info, setInfo] = useState19(false);
|
|
6826
|
+
const onToggleInfo = useCallback25(() => setInfo(!info), [info]);
|
|
6827
|
+
return /* @__PURE__ */ React65.createElement(React65.Fragment, null, /* @__PURE__ */ React65.createElement(Wrapper26, null, /* @__PURE__ */ React65.createElement(Header6, null, /* @__PURE__ */ React65.createElement(Info3, null, /* @__PURE__ */ React65.createElement(InfoContent, null, /* @__PURE__ */ React65.createElement(Title2, null, title)), children && /* @__PURE__ */ React65.createElement(InfoContent, null, /* @__PURE__ */ React65.createElement(InfoBtn2, {
|
|
7922
6828
|
onClick: onToggleInfo,
|
|
7923
6829
|
title: "Mer information"
|
|
7924
|
-
}, /* @__PURE__ */
|
|
6830
|
+
}, /* @__PURE__ */ React65.createElement(IconInfo, {
|
|
7925
6831
|
block: true
|
|
7926
|
-
})))), actionTitle && /* @__PURE__ */
|
|
6832
|
+
})))), actionTitle && /* @__PURE__ */ React65.createElement(Action7, null, /* @__PURE__ */ React65.createElement(ButtonInline, {
|
|
7927
6833
|
onClick,
|
|
7928
6834
|
title: actionTitle
|
|
7929
|
-
}, actionTitle))), body && /* @__PURE__ */
|
|
6835
|
+
}, actionTitle))), body && /* @__PURE__ */ React65.createElement(Body5, null, body)), info && /* @__PURE__ */ React65.createElement(Modal_default, {
|
|
7930
6836
|
title,
|
|
7931
6837
|
onClose: onToggleInfo
|
|
7932
6838
|
}, children));
|
|
@@ -7934,7 +6840,7 @@ var SwitchBar = ({ title, body, actionTitle, children, onClick }) => {
|
|
|
7934
6840
|
var SwitchBar_default = SwitchBar;
|
|
7935
6841
|
|
|
7936
6842
|
// src/layouts/searchItem/BranchModal.tsx
|
|
7937
|
-
import
|
|
6843
|
+
import React66, { useState as useState20, useCallback as useCallback26, useContext as useContext3 } from "react";
|
|
7938
6844
|
|
|
7939
6845
|
// src/State/CentralStorage/CentralStorageContext.ts
|
|
7940
6846
|
import { createContext as createContext3 } from "react";
|
|
@@ -7946,23 +6852,23 @@ var CentralStorageContext = createContext3({
|
|
|
7946
6852
|
// src/layouts/searchItem/BranchModal.tsx
|
|
7947
6853
|
var BranchModal = ({ loading, connections, onClose }) => {
|
|
7948
6854
|
const { centralStorageId, setCentralStorageId } = useContext3(CentralStorageContext);
|
|
7949
|
-
const [localValue, setLocalValue] =
|
|
7950
|
-
const onConfirm =
|
|
6855
|
+
const [localValue, setLocalValue] = useState20(centralStorageId);
|
|
6856
|
+
const onConfirm = useCallback26((id) => {
|
|
7951
6857
|
if (id) {
|
|
7952
6858
|
setCentralStorageId(id);
|
|
7953
6859
|
}
|
|
7954
6860
|
}, []);
|
|
7955
|
-
const onChange =
|
|
6861
|
+
const onChange = useCallback26(
|
|
7956
6862
|
(e) => setLocalValue(e.currentTarget.value),
|
|
7957
6863
|
[]
|
|
7958
6864
|
);
|
|
7959
6865
|
if (!localValue) {
|
|
7960
6866
|
return null;
|
|
7961
6867
|
}
|
|
7962
|
-
return /* @__PURE__ */
|
|
6868
|
+
return /* @__PURE__ */ React66.createElement(Modal_default, {
|
|
7963
6869
|
title: "Byt anl\xE4ggning",
|
|
7964
6870
|
onClose
|
|
7965
|
-
}, /* @__PURE__ */
|
|
6871
|
+
}, /* @__PURE__ */ React66.createElement(Repeat, null, /* @__PURE__ */ React66.createElement(RepeatTiny, null, /* @__PURE__ */ React66.createElement(Content_default, null, /* @__PURE__ */ React66.createElement("p", null, "V\xE4lj den anl\xE4ggning du vill visa kontaktuppgifter f\xF6r."))), /* @__PURE__ */ React66.createElement(RepeatTiny, null, /* @__PURE__ */ React66.createElement(InputLabel_default, null, "V\xE4lj anl\xE4ggning"), /* @__PURE__ */ React66.createElement(InputSelect_default, {
|
|
7966
6872
|
value: localValue,
|
|
7967
6873
|
onChange,
|
|
7968
6874
|
options: connections?.map((x) => ({
|
|
@@ -7970,27 +6876,27 @@ var BranchModal = ({ loading, connections, onClose }) => {
|
|
|
7970
6876
|
displayName: x.name
|
|
7971
6877
|
})),
|
|
7972
6878
|
title: "V\xE4lj anl\xE4ggning"
|
|
7973
|
-
}))), /* @__PURE__ */
|
|
6879
|
+
}))), /* @__PURE__ */ React66.createElement(Repeat, null, /* @__PURE__ */ React66.createElement(ButtonPrimary, {
|
|
7974
6880
|
disabled: loading,
|
|
7975
6881
|
fullWidth: true,
|
|
7976
6882
|
onClick: () => onConfirm(localValue)
|
|
7977
|
-
}, /* @__PURE__ */
|
|
6883
|
+
}, /* @__PURE__ */ React66.createElement(ButtonContent, null, "V\xE4lj"))));
|
|
7978
6884
|
};
|
|
7979
6885
|
var BranchModal_default = BranchModal;
|
|
7980
6886
|
|
|
7981
6887
|
// src/layouts/searchItem/PackageOptionModal.tsx
|
|
7982
|
-
import
|
|
6888
|
+
import React67 from "react";
|
|
7983
6889
|
import { marked as marked4 } from "marked";
|
|
7984
|
-
var PackageOptionModal = ({ packageOption, onClose }) => /* @__PURE__ */
|
|
6890
|
+
var PackageOptionModal = ({ packageOption, onClose }) => /* @__PURE__ */ React67.createElement(Modal_default, {
|
|
7985
6891
|
title: packageOption.title || "",
|
|
7986
6892
|
onClose
|
|
7987
|
-
}, packageOption.image && /* @__PURE__ */
|
|
6893
|
+
}, packageOption.image && /* @__PURE__ */ React67.createElement(Repeat, null, /* @__PURE__ */ React67.createElement(LogoBox_default, {
|
|
7988
6894
|
logo: packageOption.image,
|
|
7989
6895
|
alt: packageOption.title || void 0,
|
|
7990
6896
|
wide: true
|
|
7991
|
-
})), packageOption.description && /* @__PURE__ */
|
|
6897
|
+
})), packageOption.description && /* @__PURE__ */ React67.createElement(Repeat, null, /* @__PURE__ */ React67.createElement(Content_default, {
|
|
7992
6898
|
dangerouslySetInnerHTML: { __html: marked4(packageOption.description) }
|
|
7993
|
-
})), packageOption.link?.href && packageOption.link.title && /* @__PURE__ */
|
|
6899
|
+
})), packageOption.link?.href && packageOption.link.title && /* @__PURE__ */ React67.createElement(Repeat, null, /* @__PURE__ */ React67.createElement(ButtonInline, {
|
|
7994
6900
|
as: "a",
|
|
7995
6901
|
href: packageOption.link.href,
|
|
7996
6902
|
target: "_blank",
|
|
@@ -8008,90 +6914,90 @@ var CheckList = ({
|
|
|
8008
6914
|
toggleEcomModal,
|
|
8009
6915
|
loadingCentralStorageVehicle
|
|
8010
6916
|
}) => {
|
|
8011
|
-
const [modalBranch, setModalBranch] =
|
|
8012
|
-
const openModalBranch =
|
|
8013
|
-
const closeModalBranch =
|
|
8014
|
-
const [modal, setModal] =
|
|
8015
|
-
const onOpen =
|
|
8016
|
-
const onClose =
|
|
8017
|
-
|
|
6917
|
+
const [modalBranch, setModalBranch] = useState21(false);
|
|
6918
|
+
const openModalBranch = useCallback27(() => setModalBranch(true), []);
|
|
6919
|
+
const closeModalBranch = useCallback27(() => setModalBranch(false), []);
|
|
6920
|
+
const [modal, setModal] = useState21();
|
|
6921
|
+
const onOpen = useCallback27((nextModal) => setModal(nextModal), []);
|
|
6922
|
+
const onClose = useCallback27(() => setModal(void 0), []);
|
|
6923
|
+
useEffect9(() => {
|
|
8018
6924
|
if ((branch || contact) && modalBranch) {
|
|
8019
6925
|
setModalBranch(false);
|
|
8020
6926
|
}
|
|
8021
6927
|
}, [branch, contact]);
|
|
8022
6928
|
const packageOption = manufacturer?.packageOption;
|
|
8023
|
-
return /* @__PURE__ */
|
|
6929
|
+
return /* @__PURE__ */ React68.createElement(React68.Fragment, null, modalBranch && /* @__PURE__ */ React68.createElement(BranchModal_default, {
|
|
8024
6930
|
loading: loadingCentralStorageVehicle,
|
|
8025
6931
|
connections: branch?.connections,
|
|
8026
6932
|
onClose: closeModalBranch
|
|
8027
|
-
}), modal && /* @__PURE__ */
|
|
6933
|
+
}), modal && /* @__PURE__ */ React68.createElement(PackageOptionModal_default, {
|
|
8028
6934
|
packageOption: modal,
|
|
8029
6935
|
onClose
|
|
8030
|
-
}), /* @__PURE__ */
|
|
6936
|
+
}), /* @__PURE__ */ React68.createElement(Repeat, null, /* @__PURE__ */ React68.createElement(CheckMarkList_default, null, packageOption?.title && /* @__PURE__ */ React68.createElement(CheckMarkListItem, null, /* @__PURE__ */ React68.createElement(React68.Fragment, null, "Inkl.", " ", /* @__PURE__ */ React68.createElement(ButtonInline, {
|
|
8031
6937
|
onClick: () => onOpen({
|
|
8032
6938
|
title: packageOption?.title,
|
|
8033
6939
|
image: packageOption?.image,
|
|
8034
6940
|
description: packageOption?.description,
|
|
8035
6941
|
link: packageOption?.link
|
|
8036
6942
|
})
|
|
8037
|
-
}, packageOption.title), " ", "begagnatgaranti")), packageOptions?.map((packageOption2, index2) => /* @__PURE__ */
|
|
6943
|
+
}, packageOption.title), " ", "begagnatgaranti")), packageOptions?.map((packageOption2, index2) => /* @__PURE__ */ React68.createElement(CheckMarkListItem, {
|
|
8038
6944
|
key: packageOption2.title || index2
|
|
8039
|
-
}, /* @__PURE__ */
|
|
6945
|
+
}, /* @__PURE__ */ React68.createElement(React68.Fragment, null, "Inkl.", " ", /* @__PURE__ */ React68.createElement(ButtonInline, {
|
|
8040
6946
|
onClick: () => onOpen({
|
|
8041
6947
|
title: packageOption2?.title,
|
|
8042
6948
|
image: packageOption2?.image,
|
|
8043
6949
|
description: packageOption2?.description,
|
|
8044
6950
|
link: packageOption2?.link
|
|
8045
6951
|
})
|
|
8046
|
-
}, packageOption2.title)))), ecommerce?.withHomeDelivery && /* @__PURE__ */
|
|
6952
|
+
}, packageOption2.title)))), ecommerce?.withHomeDelivery && /* @__PURE__ */ React68.createElement(CheckMarkListItem, null, "Hemleverans"))), /* @__PURE__ */ React68.createElement(Repeat, null, ecommerce && ecommerce.enabled && /* @__PURE__ */ React68.createElement(RepeatTiny, null, /* @__PURE__ */ React68.createElement(ButtonPrimary, {
|
|
8047
6953
|
disabled: !!ecommerce.reserved,
|
|
8048
6954
|
fullWidth: true,
|
|
8049
6955
|
onClick: toggleEcomModal
|
|
8050
|
-
}, /* @__PURE__ */
|
|
6956
|
+
}, /* @__PURE__ */ React68.createElement(ButtonContent, null, "K\xF6p bilen online"))), ecommerce?.reserved && /* @__PURE__ */ React68.createElement(RepeatTiny, null, /* @__PURE__ */ React68.createElement(SwitchBar_default, {
|
|
8051
6957
|
title: "Bilen \xE4r reserverad",
|
|
8052
6958
|
body: "Denna bil \xE4r reserverad av en annan k\xF6pare."
|
|
8053
|
-
}, /* @__PURE__ */
|
|
6959
|
+
}, /* @__PURE__ */ React68.createElement(Content_default, null, /* @__PURE__ */ React68.createElement("p", null, "Denna bil \xE4r reserverad av en annan k\xF6pare.")))), /* @__PURE__ */ React68.createElement(ActionList_default, {
|
|
8054
6960
|
branch,
|
|
8055
6961
|
contact
|
|
8056
|
-
})), (branch?.connections.length || 0) > 1 && /* @__PURE__ */
|
|
6962
|
+
})), (branch?.connections.length || 0) > 1 && /* @__PURE__ */ React68.createElement(Repeat, null, /* @__PURE__ */ React68.createElement(SwitchBar_default, {
|
|
8057
6963
|
title: "Centrallagerbil",
|
|
8058
6964
|
actionTitle: "Byt anl\xE4ggning",
|
|
8059
6965
|
onClick: openModalBranch
|
|
8060
|
-
}, /* @__PURE__ */
|
|
6966
|
+
}, /* @__PURE__ */ React68.createElement(Content_default, null, /* @__PURE__ */ React68.createElement("p", null, "Denna bil tillh\xF6r ett centrallager och g\xE5r att k\xF6pa genom flera anl\xE4ggningar. Byt anl\xE4ggning f\xF6r att visa kontaktuppgifter till just den anl\xE4ggningen.")))));
|
|
8061
6967
|
};
|
|
8062
6968
|
var CheckList_default = CheckList;
|
|
8063
6969
|
|
|
8064
6970
|
// src/layouts/searchItem/Related.tsx
|
|
8065
|
-
import
|
|
6971
|
+
import React70, { useCallback as useCallback28 } from "react";
|
|
8066
6972
|
|
|
8067
6973
|
// src/components/SectionHeader/index.tsx
|
|
8068
|
-
import
|
|
6974
|
+
import React69 from "react";
|
|
8069
6975
|
|
|
8070
6976
|
// src/components/SectionHeader/wrapper.tsx
|
|
8071
|
-
import
|
|
8072
|
-
var
|
|
6977
|
+
import styled49 from "styled-components";
|
|
6978
|
+
var Wrapper27 = styled49.div`
|
|
8073
6979
|
display: flex;
|
|
8074
6980
|
align-items: center;
|
|
8075
6981
|
`;
|
|
8076
|
-
var Heading7 =
|
|
6982
|
+
var Heading7 = styled49.div`
|
|
8077
6983
|
flex: 1 1 auto;
|
|
8078
6984
|
`;
|
|
8079
|
-
var Action8 =
|
|
6985
|
+
var Action8 = styled49.div`
|
|
8080
6986
|
flex-shrink: 0;
|
|
8081
6987
|
padding-left: ${size(2)};
|
|
8082
6988
|
`;
|
|
8083
6989
|
|
|
8084
6990
|
// src/components/SectionHeader/index.tsx
|
|
8085
|
-
var SectionHeader = ({ children, onClick, actionTitle }) => /* @__PURE__ */
|
|
6991
|
+
var SectionHeader = ({ children, onClick, actionTitle }) => /* @__PURE__ */ React69.createElement(Wrapper27, null, /* @__PURE__ */ React69.createElement(Heading7, null, children), onClick && actionTitle && /* @__PURE__ */ React69.createElement(Action8, null, /* @__PURE__ */ React69.createElement(ButtonClear, {
|
|
8086
6992
|
as: "a",
|
|
8087
6993
|
href: "#",
|
|
8088
6994
|
onClick
|
|
8089
|
-
}, /* @__PURE__ */
|
|
6995
|
+
}, /* @__PURE__ */ React69.createElement(ButtonContent, null, actionTitle))));
|
|
8090
6996
|
var SectionHeader_default = SectionHeader;
|
|
8091
6997
|
|
|
8092
6998
|
// src/components/OverflowGrid/index.tsx
|
|
8093
|
-
import
|
|
8094
|
-
var OverflowGrid =
|
|
6999
|
+
import styled50 from "styled-components";
|
|
7000
|
+
var OverflowGrid = styled50.div`
|
|
8095
7001
|
${(props) => props.theme.breakpoint.LtMd} {
|
|
8096
7002
|
${Wrapper} & {
|
|
8097
7003
|
margin-left: ${size(-3)};
|
|
@@ -8106,7 +7012,7 @@ var OverflowGrid = styled54.div`
|
|
|
8106
7012
|
}
|
|
8107
7013
|
}
|
|
8108
7014
|
`;
|
|
8109
|
-
var OverflowGridList =
|
|
7015
|
+
var OverflowGridList = styled50.ul`
|
|
8110
7016
|
display: flex;
|
|
8111
7017
|
align-items: flex-start;
|
|
8112
7018
|
list-style: none;
|
|
@@ -8138,7 +7044,7 @@ var OverflowGridList = styled54.ul`
|
|
|
8138
7044
|
}
|
|
8139
7045
|
}
|
|
8140
7046
|
`;
|
|
8141
|
-
var OverflowGridItem =
|
|
7047
|
+
var OverflowGridItem = styled50.li`
|
|
8142
7048
|
flex: 1 0 auto;
|
|
8143
7049
|
width: calc(100% - ${size(2)});
|
|
8144
7050
|
max-width: calc(100% - ${size(2)});
|
|
@@ -8156,7 +7062,7 @@ var OverflowGridItem = styled54.li`
|
|
|
8156
7062
|
`;
|
|
8157
7063
|
|
|
8158
7064
|
// src/State/RelatedSearch/useRelatedSearch.ts
|
|
8159
|
-
import { useContext as useContext4, useEffect as
|
|
7065
|
+
import { useContext as useContext4, useEffect as useEffect10 } from "react";
|
|
8160
7066
|
|
|
8161
7067
|
// src/State/RelatedSearch/RelatedSearchContext.ts
|
|
8162
7068
|
import { createContext as createContext4 } from "react";
|
|
@@ -8172,7 +7078,7 @@ var RelatedSearchContext = createContext4({
|
|
|
8172
7078
|
// src/State/RelatedSearch/useRelatedSearch.ts
|
|
8173
7079
|
var useRelatedSearch = (id) => {
|
|
8174
7080
|
const data = useContext4(RelatedSearchContext);
|
|
8175
|
-
|
|
7081
|
+
useEffect10(() => {
|
|
8176
7082
|
const searchParams = new URLSearchParams();
|
|
8177
7083
|
searchParams.set("hits", "3");
|
|
8178
7084
|
if (data.moreLikeThisUrl && id) {
|
|
@@ -8198,7 +7104,7 @@ var regexPathGuid = (path) => {
|
|
|
8198
7104
|
// src/layouts/searchItem/Related.tsx
|
|
8199
7105
|
var Related = ({ id, hashRoute, pathRoute, onClickSearchItem }) => {
|
|
8200
7106
|
const { loading, response, moreLikeThisUrl } = useRelatedSearch_default(id);
|
|
8201
|
-
const onItemClicked =
|
|
7107
|
+
const onItemClicked = useCallback28((id2) => {
|
|
8202
7108
|
pubsub_default.publish("ItemClicked", id2);
|
|
8203
7109
|
if (onClickSearchItem) {
|
|
8204
7110
|
onClickSearchItem(id2);
|
|
@@ -8208,30 +7114,30 @@ var Related = ({ id, hashRoute, pathRoute, onClickSearchItem }) => {
|
|
|
8208
7114
|
return null;
|
|
8209
7115
|
}
|
|
8210
7116
|
if (loading) {
|
|
8211
|
-
return /* @__PURE__ */
|
|
7117
|
+
return /* @__PURE__ */ React70.createElement(Loader_default, null);
|
|
8212
7118
|
}
|
|
8213
|
-
return /* @__PURE__ */
|
|
7119
|
+
return /* @__PURE__ */ React70.createElement(PageSection, {
|
|
8214
7120
|
accent: true,
|
|
8215
7121
|
large: true,
|
|
8216
7122
|
className: "wayke__theme wayke__color--accent-bg"
|
|
8217
|
-
}, /* @__PURE__ */
|
|
7123
|
+
}, /* @__PURE__ */ React70.createElement(Container_default, null, moreLikeThisUrl ? /* @__PURE__ */ React70.createElement(Repeat, null, /* @__PURE__ */ React70.createElement(SectionHeader_default, {
|
|
8218
7124
|
onClick: () => {
|
|
8219
7125
|
}
|
|
8220
|
-
}, /* @__PURE__ */
|
|
7126
|
+
}, /* @__PURE__ */ React70.createElement(H2, {
|
|
8221
7127
|
noMargin: true
|
|
8222
|
-
}, "Relaterade fordon"))) : /* @__PURE__ */
|
|
7128
|
+
}, "Relaterade fordon"))) : /* @__PURE__ */ React70.createElement(Repeat, null, /* @__PURE__ */ React70.createElement(SectionHeader_default, {
|
|
8223
7129
|
onClick: () => {
|
|
8224
7130
|
},
|
|
8225
7131
|
actionTitle: "Visa alla"
|
|
8226
|
-
}, /* @__PURE__ */
|
|
7132
|
+
}, /* @__PURE__ */ React70.createElement(H2, {
|
|
8227
7133
|
noMargin: true
|
|
8228
|
-
}, "Senast inkomna"))), /* @__PURE__ */
|
|
7134
|
+
}, "Senast inkomna"))), /* @__PURE__ */ React70.createElement(Repeat, null, /* @__PURE__ */ React70.createElement(OverflowGrid, null, /* @__PURE__ */ React70.createElement(OverflowGridList, null, response?.documentList.documents.map((document2) => {
|
|
8229
7135
|
const prefix = pathRoute ? `/${pathRoute}` : "/";
|
|
8230
7136
|
const r = regexPathGuid(pathRoute);
|
|
8231
7137
|
const pathRouteUrl = window.location.pathname === "/" ? `${prefix}${document2._id}` : r.test(`${pathRoute}${id}`) ? window.location.pathname.replace(r, `${pathRoute}${document2._id}`) : `${window.location.pathname}${prefix}${document2._id}`;
|
|
8232
|
-
return /* @__PURE__ */
|
|
7138
|
+
return /* @__PURE__ */ React70.createElement(OverflowGridItem, {
|
|
8233
7139
|
key: document2._id
|
|
8234
|
-
}, /* @__PURE__ */
|
|
7140
|
+
}, /* @__PURE__ */ React70.createElement(ProductCard_default, {
|
|
8235
7141
|
id: document2._id,
|
|
8236
7142
|
onClick: onItemClicked,
|
|
8237
7143
|
title: document2.title,
|
|
@@ -8261,24 +7167,24 @@ var Related = ({ id, hashRoute, pathRoute, onClickSearchItem }) => {
|
|
|
8261
7167
|
var Related_default = Related;
|
|
8262
7168
|
|
|
8263
7169
|
// src/layouts/searchItem/PackageOptions.tsx
|
|
8264
|
-
import
|
|
7170
|
+
import React71 from "react";
|
|
8265
7171
|
import { marked as marked5 } from "marked";
|
|
8266
7172
|
var PackageOptions = ({ packageOptions }) => {
|
|
8267
7173
|
if (!packageOptions) {
|
|
8268
7174
|
return null;
|
|
8269
7175
|
}
|
|
8270
|
-
return /* @__PURE__ */
|
|
7176
|
+
return /* @__PURE__ */ React71.createElement(React71.Fragment, null, packageOptions.map((packageOption, index2) => /* @__PURE__ */ React71.createElement(ProductPageMainSection, {
|
|
8271
7177
|
key: packageOption.title || index2
|
|
8272
|
-
}, /* @__PURE__ */
|
|
7178
|
+
}, /* @__PURE__ */ React71.createElement(Repeat, null, /* @__PURE__ */ React71.createElement(H2, {
|
|
8273
7179
|
noMargin: true
|
|
8274
|
-
}, packageOption.title)), packageOption.description && /* @__PURE__ */
|
|
7180
|
+
}, packageOption.title)), packageOption.description && /* @__PURE__ */ React71.createElement(Repeat, null, /* @__PURE__ */ React71.createElement(Content_default, {
|
|
8275
7181
|
dangerouslySetInnerHTML: { __html: marked5(packageOption.description) }
|
|
8276
|
-
})), packageOption.link?.url && /* @__PURE__ */
|
|
7182
|
+
})), packageOption.link?.url && /* @__PURE__ */ React71.createElement(Repeat, null, /* @__PURE__ */ React71.createElement(ButtonInline, {
|
|
8277
7183
|
as: "a",
|
|
8278
7184
|
href: packageOption.link.url,
|
|
8279
7185
|
target: "_blank",
|
|
8280
7186
|
rel: "noopener noreferrer"
|
|
8281
|
-
}, packageOption.link.title ? packageOption.link.title : "L\xE4s mer (\xD6ppnas i ett nytt f\xF6nster)")), packageOption.image && /* @__PURE__ */
|
|
7187
|
+
}, packageOption.link.title ? packageOption.link.title : "L\xE4s mer (\xD6ppnas i ett nytt f\xF6nster)")), packageOption.image && /* @__PURE__ */ React71.createElement(Repeat, null, /* @__PURE__ */ React71.createElement(LogoBox_default, {
|
|
8282
7188
|
logo: packageOption.image,
|
|
8283
7189
|
alt: "Logotyp",
|
|
8284
7190
|
wide: true
|
|
@@ -8287,31 +7193,31 @@ var PackageOptions = ({ packageOptions }) => {
|
|
|
8287
7193
|
var PackageOptions_default = PackageOptions;
|
|
8288
7194
|
|
|
8289
7195
|
// src/layouts/searchItem/Branch.tsx
|
|
8290
|
-
import
|
|
7196
|
+
import React76, { useState as useState24, useCallback as useCallback31, useEffect as useEffect11 } from "react";
|
|
8291
7197
|
|
|
8292
7198
|
// src/components/TableColumn/index.tsx
|
|
8293
|
-
import
|
|
8294
|
-
var TableColumn =
|
|
7199
|
+
import styled51 from "styled-components";
|
|
7200
|
+
var TableColumn = styled51.div`
|
|
8295
7201
|
line-height: 1.2;
|
|
8296
7202
|
`;
|
|
8297
|
-
var TableColumnRow =
|
|
7203
|
+
var TableColumnRow = styled51.div`
|
|
8298
7204
|
display: flex;
|
|
8299
7205
|
align-items: flex-start;
|
|
8300
7206
|
margin: ${size(-1)};
|
|
8301
7207
|
`;
|
|
8302
|
-
var TableColumnCell =
|
|
7208
|
+
var TableColumnCell = styled51.div`
|
|
8303
7209
|
flex: 1 0 50%;
|
|
8304
7210
|
padding: ${size(1)};
|
|
8305
7211
|
`;
|
|
8306
7212
|
|
|
8307
7213
|
// src/components/OpeningHours/index.tsx
|
|
8308
|
-
import
|
|
7214
|
+
import React73, { useMemo as useMemo4 } from "react";
|
|
8309
7215
|
|
|
8310
7216
|
// src/components/Badge/index.tsx
|
|
8311
|
-
import
|
|
7217
|
+
import React72 from "react";
|
|
8312
7218
|
|
|
8313
7219
|
// src/components/Badge/wrapper.tsx
|
|
8314
|
-
import
|
|
7220
|
+
import styled52 from "styled-components";
|
|
8315
7221
|
var getBg = (severity) => {
|
|
8316
7222
|
let bg = theme_default.color.textDark;
|
|
8317
7223
|
if (severity === "positive") {
|
|
@@ -8321,7 +7227,7 @@ var getBg = (severity) => {
|
|
|
8321
7227
|
}
|
|
8322
7228
|
return bg;
|
|
8323
7229
|
};
|
|
8324
|
-
var
|
|
7230
|
+
var Wrapper28 = styled52.div.attrs(() => ({
|
|
8325
7231
|
className: "wayke__theme wayke__font--bold"
|
|
8326
7232
|
}))`
|
|
8327
7233
|
display: inline-block;
|
|
@@ -8334,7 +7240,7 @@ var Wrapper31 = styled56.div.attrs(() => ({
|
|
|
8334
7240
|
`;
|
|
8335
7241
|
|
|
8336
7242
|
// src/components/Badge/index.tsx
|
|
8337
|
-
var Badge = ({ label, severity }) => /* @__PURE__ */
|
|
7243
|
+
var Badge = ({ label, severity }) => /* @__PURE__ */ React72.createElement(Wrapper28, {
|
|
8338
7244
|
severity
|
|
8339
7245
|
}, label);
|
|
8340
7246
|
var Badge_default = Badge;
|
|
@@ -8418,33 +7324,33 @@ var OpeningHours = ({ openingHours }) => {
|
|
|
8418
7324
|
if (!oh) {
|
|
8419
7325
|
return null;
|
|
8420
7326
|
}
|
|
8421
|
-
return /* @__PURE__ */
|
|
7327
|
+
return /* @__PURE__ */ React73.createElement(React73.Fragment, null, /* @__PURE__ */ React73.createElement(RepeatSmall, null, /* @__PURE__ */ React73.createElement(Badge_default, {
|
|
8422
7328
|
label: currentlyOpen ? "\xD6ppet" : "St\xE4ngt",
|
|
8423
7329
|
severity: currentlyOpen ? "positive" : "negative"
|
|
8424
|
-
})), /* @__PURE__ */
|
|
7330
|
+
})), /* @__PURE__ */ React73.createElement(RepeatSmall, null, /* @__PURE__ */ React73.createElement(TableColumn, null, /* @__PURE__ */ React73.createElement(TableColumnRow, null, /* @__PURE__ */ React73.createElement(TableColumnCell, null, /* @__PURE__ */ React73.createElement(UtilityTextBold, null, today?.title)), /* @__PURE__ */ React73.createElement(TableColumnCell, null, /* @__PURE__ */ React73.createElement(UtilityTextBold, null, today?.from ? `${today.from}-${today.until}` : "St\xE4ngt"))), oh.map((o) => /* @__PURE__ */ React73.createElement(TableColumnRow, {
|
|
8425
7331
|
key: o.titleFrom
|
|
8426
|
-
}, /* @__PURE__ */
|
|
7332
|
+
}, /* @__PURE__ */ React73.createElement(TableColumnCell, null, o.titleTo ? `${o.titleFrom}-${o.titleTo}` : o.titleFrom), /* @__PURE__ */ React73.createElement(TableColumnCell, null, o.from ? `${o.from}-${o.until}` : "St\xE4ngt"))))));
|
|
8427
7333
|
};
|
|
8428
7334
|
var OpeningHours_default = OpeningHours;
|
|
8429
7335
|
|
|
8430
7336
|
// src/components/PhoneNumber/index.tsx
|
|
8431
|
-
import
|
|
7337
|
+
import React74, { useState as useState22, useCallback as useCallback29 } from "react";
|
|
8432
7338
|
var PhoneNumber = ({ phoneNumber }) => {
|
|
8433
|
-
const [visible, setVisible] =
|
|
8434
|
-
const onClick =
|
|
8435
|
-
return /* @__PURE__ */
|
|
7339
|
+
const [visible, setVisible] = useState22(false);
|
|
7340
|
+
const onClick = useCallback29(() => !visible && setVisible(true), [visible]);
|
|
7341
|
+
return /* @__PURE__ */ React74.createElement(TableColumnRow, null, /* @__PURE__ */ React74.createElement(TableColumnCell, null, "Telefonnummer"), /* @__PURE__ */ React74.createElement(TableColumnCell, null, visible ? /* @__PURE__ */ React74.createElement(ButtonInlineBold, {
|
|
8436
7342
|
as: "a",
|
|
8437
7343
|
href: `tel:${phoneNumber}`,
|
|
8438
7344
|
title: `Ring ${phoneNumber}`
|
|
8439
|
-
}, /* @__PURE__ */
|
|
7345
|
+
}, /* @__PURE__ */ React74.createElement(ButtonContent, null, phoneNumber)) : /* @__PURE__ */ React74.createElement(ButtonInlineBold, {
|
|
8440
7346
|
onClick,
|
|
8441
7347
|
title: "Visa telefonnummer"
|
|
8442
|
-
}, /* @__PURE__ */
|
|
7348
|
+
}, /* @__PURE__ */ React74.createElement(ButtonContent, null, "Visa telefonnummer"))));
|
|
8443
7349
|
};
|
|
8444
7350
|
var PhoneNumber_default = PhoneNumber;
|
|
8445
7351
|
|
|
8446
7352
|
// src/components/Map/index.tsx
|
|
8447
|
-
import
|
|
7353
|
+
import React75, { useState as useState23, useCallback as useCallback30 } from "react";
|
|
8448
7354
|
|
|
8449
7355
|
// src/State/Settings/useSettings.ts
|
|
8450
7356
|
import { useContext as useContext5 } from "react";
|
|
@@ -8458,16 +7364,16 @@ var useSettings = () => useContext5(SettingsContext);
|
|
|
8458
7364
|
var useSettings_default = useSettings;
|
|
8459
7365
|
|
|
8460
7366
|
// src/components/Map/wrapper.tsx
|
|
8461
|
-
import
|
|
8462
|
-
var
|
|
7367
|
+
import styled53 from "styled-components";
|
|
7368
|
+
var Wrapper29 = styled53.a`
|
|
8463
7369
|
display: block;
|
|
8464
7370
|
`;
|
|
8465
|
-
var
|
|
7371
|
+
var Image3 = styled53.img`
|
|
8466
7372
|
display: block;
|
|
8467
7373
|
width: 100%;
|
|
8468
7374
|
border-radius: 3px;
|
|
8469
7375
|
`;
|
|
8470
|
-
var Placeholder =
|
|
7376
|
+
var Placeholder = styled53.a`
|
|
8471
7377
|
display: block;
|
|
8472
7378
|
position: relative;
|
|
8473
7379
|
width: 100%;
|
|
@@ -8477,7 +7383,7 @@ var Placeholder = styled57.a`
|
|
|
8477
7383
|
border-radius: 3px;
|
|
8478
7384
|
color: ${(props) => props.theme.color.textDark};
|
|
8479
7385
|
`;
|
|
8480
|
-
var PlaceholderAction =
|
|
7386
|
+
var PlaceholderAction = styled53.div`
|
|
8481
7387
|
position: absolute;
|
|
8482
7388
|
top: 50%;
|
|
8483
7389
|
left: 50%;
|
|
@@ -8487,8 +7393,8 @@ var PlaceholderAction = styled57.div`
|
|
|
8487
7393
|
// src/components/Map/index.tsx
|
|
8488
7394
|
var StaticMap = ({ position }) => {
|
|
8489
7395
|
const { googleMapsApiKey, googleMapsMarker } = useSettings_default();
|
|
8490
|
-
const [visible, setVisible] =
|
|
8491
|
-
const onShowMap =
|
|
7396
|
+
const [visible, setVisible] = useState23(false);
|
|
7397
|
+
const onShowMap = useCallback30((e) => {
|
|
8492
7398
|
if (googleMapsApiKey) {
|
|
8493
7399
|
e.preventDefault();
|
|
8494
7400
|
setVisible(true);
|
|
@@ -8499,33 +7405,33 @@ var StaticMap = ({ position }) => {
|
|
|
8499
7405
|
}
|
|
8500
7406
|
const { latitude, longitude } = position;
|
|
8501
7407
|
if (visible && googleMapsApiKey) {
|
|
8502
|
-
return /* @__PURE__ */
|
|
7408
|
+
return /* @__PURE__ */ React75.createElement(Wrapper29, {
|
|
8503
7409
|
href: `http://maps.google.com/maps?q=${latitude},${longitude}`,
|
|
8504
7410
|
title: "Visa p\xE5 Google Maps",
|
|
8505
7411
|
target: "_blank",
|
|
8506
7412
|
rel: "nofollow noopener noreferrer"
|
|
8507
|
-
}, /* @__PURE__ */
|
|
7413
|
+
}, /* @__PURE__ */ React75.createElement(Image3, {
|
|
8508
7414
|
src: `https://maps.googleapis.com/maps/api/staticmap?center=${latitude},${longitude}&zoom=10&size=640x280&maptype=roadmap&markers=${googleMapsMarker ? `icon:${encodeURIComponent(googleMapsMarker)}` : ""}%7C${latitude},${longitude}&key=${googleMapsApiKey}`,
|
|
8509
7415
|
alt: "Karta"
|
|
8510
7416
|
}));
|
|
8511
7417
|
}
|
|
8512
|
-
return /* @__PURE__ */
|
|
7418
|
+
return /* @__PURE__ */ React75.createElement(Placeholder, {
|
|
8513
7419
|
href: `http://maps.google.com/maps?q=${latitude},${longitude}`,
|
|
8514
7420
|
target: "_blank",
|
|
8515
7421
|
rel: "noopener noreferrer nofollow",
|
|
8516
7422
|
onClick: onShowMap
|
|
8517
|
-
}, /* @__PURE__ */
|
|
7423
|
+
}, /* @__PURE__ */ React75.createElement(PlaceholderAction, null, /* @__PURE__ */ React75.createElement(ButtonSecondary, {
|
|
8518
7424
|
as: "div"
|
|
8519
|
-
}, /* @__PURE__ */
|
|
7425
|
+
}, /* @__PURE__ */ React75.createElement(ButtonContent, null, "Visa karta"))));
|
|
8520
7426
|
};
|
|
8521
7427
|
var Map_default = StaticMap;
|
|
8522
7428
|
|
|
8523
7429
|
// src/layouts/searchItem/Branch.tsx
|
|
8524
7430
|
var Branch2 = ({ branch, loading }) => {
|
|
8525
|
-
const [modal, setModal] =
|
|
8526
|
-
const openModal =
|
|
8527
|
-
const closeModal =
|
|
8528
|
-
|
|
7431
|
+
const [modal, setModal] = useState24(false);
|
|
7432
|
+
const openModal = useCallback31(() => setModal(true), []);
|
|
7433
|
+
const closeModal = useCallback31(() => setModal(false), []);
|
|
7434
|
+
useEffect11(() => {
|
|
8529
7435
|
if (branch && modal) {
|
|
8530
7436
|
setModal(false);
|
|
8531
7437
|
}
|
|
@@ -8533,29 +7439,29 @@ var Branch2 = ({ branch, loading }) => {
|
|
|
8533
7439
|
if (!branch) {
|
|
8534
7440
|
return null;
|
|
8535
7441
|
}
|
|
8536
|
-
return /* @__PURE__ */
|
|
7442
|
+
return /* @__PURE__ */ React76.createElement(React76.Fragment, null, modal && /* @__PURE__ */ React76.createElement(BranchModal_default, {
|
|
8537
7443
|
loading,
|
|
8538
7444
|
connections: branch?.connections,
|
|
8539
7445
|
onClose: closeModal
|
|
8540
|
-
}), /* @__PURE__ */
|
|
7446
|
+
}), /* @__PURE__ */ React76.createElement(Repeat, null, /* @__PURE__ */ React76.createElement(H2, {
|
|
8541
7447
|
noMargin: true
|
|
8542
|
-
}, branch?.location?.city ? `Den h\xE4r bilen finns p\xE5 v\xE5r anl\xE4ggning i ${branch?.location?.city}` : "Kontakt")), /* @__PURE__ */
|
|
7448
|
+
}, branch?.location?.city ? `Den h\xE4r bilen finns p\xE5 v\xE5r anl\xE4ggning i ${branch?.location?.city}` : "Kontakt")), /* @__PURE__ */ React76.createElement(Repeat, null, /* @__PURE__ */ React76.createElement(Map_default, {
|
|
8543
7449
|
position: branch?.location?.position
|
|
8544
|
-
})), (branch?.connections?.length || 0) > 1 && /* @__PURE__ */
|
|
7450
|
+
})), (branch?.connections?.length || 0) > 1 && /* @__PURE__ */ React76.createElement(Repeat, null, /* @__PURE__ */ React76.createElement(Content_default, null, /* @__PURE__ */ React76.createElement("p", null, "Denna bil tillh\xF6r ett centrallager och g\xE5r att k\xF6pa genom flera anl\xE4ggningar.", " ", /* @__PURE__ */ React76.createElement(ButtonInline, {
|
|
8545
7451
|
as: "span",
|
|
8546
7452
|
role: "button",
|
|
8547
7453
|
onClick: openModal,
|
|
8548
7454
|
inline: true
|
|
8549
|
-
}, "Klicka h\xE4r f\xF6r att visa kontaktuppgifter till en annan anl\xE4ggning"), "."))), /* @__PURE__ */
|
|
7455
|
+
}, "Klicka h\xE4r f\xF6r att visa kontaktuppgifter till en annan anl\xE4ggning"), "."))), /* @__PURE__ */ React76.createElement(Repeat, null, /* @__PURE__ */ React76.createElement(ProductPageContentLimit, null, /* @__PURE__ */ React76.createElement(Repeat, null, /* @__PURE__ */ React76.createElement(TableColumn, null, branch?.location?.streetAddress && branch?.location?.city && /* @__PURE__ */ React76.createElement(TableColumnRow, null, /* @__PURE__ */ React76.createElement(TableColumnCell, null, "Adress"), /* @__PURE__ */ React76.createElement(TableColumnCell, null, /* @__PURE__ */ React76.createElement(ButtonInlineBold, null, /* @__PURE__ */ React76.createElement(ButtonContent, null, `${branch?.location?.streetAddress}, ${branch?.location?.city}`)))), branch?.contact?.phonenumber && /* @__PURE__ */ React76.createElement(PhoneNumber_default, {
|
|
8550
7456
|
phoneNumber: formatPhonenumber(branch.contact.phonenumber)
|
|
8551
|
-
}))), branch?.openingHours && /* @__PURE__ */
|
|
7457
|
+
}))), branch?.openingHours && /* @__PURE__ */ React76.createElement(Repeat, null, /* @__PURE__ */ React76.createElement(OpeningHours_default, {
|
|
8552
7458
|
openingHours: branch.openingHours
|
|
8553
7459
|
})))));
|
|
8554
7460
|
};
|
|
8555
7461
|
var Branch_default = Branch2;
|
|
8556
7462
|
|
|
8557
7463
|
// src/State/CentralStorage/useCentralStorage.ts
|
|
8558
|
-
import { useContext as useContext6, useEffect as
|
|
7464
|
+
import { useContext as useContext6, useEffect as useEffect12 } from "react";
|
|
8559
7465
|
|
|
8560
7466
|
// src/hooks/useSearchItemBranch.ts
|
|
8561
7467
|
import { useQuery as useQuery4 } from "@apollo/client";
|
|
@@ -8692,7 +7598,7 @@ var useCentralStorage = (vehicle) => {
|
|
|
8692
7598
|
const connections = vehicle?.branch?.connections;
|
|
8693
7599
|
const branchId = centralStorageId ? connections?.find((x) => x.id === centralStorageId)?.id : void 0;
|
|
8694
7600
|
const { data, loading } = useSearchItemBranch_default(vehicle?.id, branchId);
|
|
8695
|
-
|
|
7601
|
+
useEffect12(() => {
|
|
8696
7602
|
if ((connections?.length || 0) > 0) {
|
|
8697
7603
|
const match = centralStorageId ? connections?.find((x) => x.id === centralStorageId) : void 0;
|
|
8698
7604
|
if (!match) {
|
|
@@ -8711,23 +7617,23 @@ var useCentralStorage = (vehicle) => {
|
|
|
8711
7617
|
var useCentralStorage_default = useCentralStorage;
|
|
8712
7618
|
|
|
8713
7619
|
// src/layouts/searchItem/Page404.tsx
|
|
8714
|
-
import
|
|
8715
|
-
var Page404 = () => /* @__PURE__ */
|
|
7620
|
+
import React77 from "react";
|
|
7621
|
+
var Page404 = () => /* @__PURE__ */ React77.createElement(Page, null, /* @__PURE__ */ React77.createElement(PageSection, {
|
|
8716
7622
|
large: true
|
|
8717
|
-
}, /* @__PURE__ */
|
|
7623
|
+
}, /* @__PURE__ */ React77.createElement(Container_default, null, /* @__PURE__ */ React77.createElement(H1, {
|
|
8718
7624
|
noMargin: true
|
|
8719
7625
|
}, "404"))));
|
|
8720
7626
|
var Page404_default = Page404;
|
|
8721
7627
|
|
|
8722
7628
|
// src/layouts/searchItem/PageLoading.tsx
|
|
8723
|
-
import
|
|
8724
|
-
var PageLoading = () => /* @__PURE__ */
|
|
7629
|
+
import React78 from "react";
|
|
7630
|
+
var PageLoading = () => /* @__PURE__ */ React78.createElement(Page, null, /* @__PURE__ */ React78.createElement(PageSection, {
|
|
8725
7631
|
large: true
|
|
8726
|
-
}, /* @__PURE__ */
|
|
7632
|
+
}, /* @__PURE__ */ React78.createElement(Container_default, null, /* @__PURE__ */ React78.createElement(Loader_default, null))));
|
|
8727
7633
|
var PageLoading_default = PageLoading;
|
|
8728
7634
|
|
|
8729
7635
|
// src/layouts/searchItem/Property.tsx
|
|
8730
|
-
import
|
|
7636
|
+
import React81, { useCallback as useCallback33, useEffect as useEffect13, useMemo as useMemo5, useState as useState26 } from "react";
|
|
8731
7637
|
|
|
8732
7638
|
// src/utils/vehicle-properties/property-tree-creator.ts
|
|
8733
7639
|
var _PropertyTreeCreator = class {
|
|
@@ -9220,11 +8126,11 @@ var property_remover_default = (properties) => {
|
|
|
9220
8126
|
};
|
|
9221
8127
|
|
|
9222
8128
|
// src/layouts/searchItem/MetadataItem.tsx
|
|
9223
|
-
import
|
|
8129
|
+
import React79, { useState as useState25, useCallback as useCallback32 } from "react";
|
|
9224
8130
|
|
|
9225
8131
|
// src/components/TableList/index.tsx
|
|
9226
|
-
import
|
|
9227
|
-
var TableList =
|
|
8132
|
+
import styled54 from "styled-components";
|
|
8133
|
+
var TableList = styled54.ul`
|
|
9228
8134
|
list-style: none;
|
|
9229
8135
|
padding: 0;
|
|
9230
8136
|
margin: 0;
|
|
@@ -9232,7 +8138,7 @@ var TableList = styled58.ul`
|
|
|
9232
8138
|
border-bottom: 1px solid ${(props) => props.theme.color.border};
|
|
9233
8139
|
font-size: 0.875rem;
|
|
9234
8140
|
`;
|
|
9235
|
-
var TableListItem =
|
|
8141
|
+
var TableListItem = styled54.li`
|
|
9236
8142
|
display: flex;
|
|
9237
8143
|
align-items: center;
|
|
9238
8144
|
padding: ${size(1)} 0;
|
|
@@ -9241,30 +8147,30 @@ var TableListItem = styled58.li`
|
|
|
9241
8147
|
border-top: 1px solid ${(props) => props.theme.color.border};
|
|
9242
8148
|
}
|
|
9243
8149
|
`;
|
|
9244
|
-
var TableListKey =
|
|
8150
|
+
var TableListKey = styled54.div`
|
|
9245
8151
|
flex: 1 1 auto;
|
|
9246
8152
|
`;
|
|
9247
|
-
var TableListValue =
|
|
8153
|
+
var TableListValue = styled54.div`
|
|
9248
8154
|
flex-shrink: 0;
|
|
9249
8155
|
padding-left: ${size(1)};
|
|
9250
8156
|
`;
|
|
9251
|
-
var TableListBooleanPos =
|
|
8157
|
+
var TableListBooleanPos = styled54.div`
|
|
9252
8158
|
color: ${(props) => props.theme.color.ui.positive};
|
|
9253
8159
|
`;
|
|
9254
|
-
var TableListBooleanNeg =
|
|
8160
|
+
var TableListBooleanNeg = styled54.div`
|
|
9255
8161
|
color: ${(props) => props.theme.color.ui.negative};
|
|
9256
8162
|
`;
|
|
9257
8163
|
|
|
9258
8164
|
// src/layouts/searchItem/MetadataItem.tsx
|
|
9259
8165
|
var formatValue = (value, unit) => {
|
|
9260
8166
|
if (typeof value === "boolean") {
|
|
9261
|
-
return value ? /* @__PURE__ */
|
|
8167
|
+
return value ? /* @__PURE__ */ React79.createElement(TableListBooleanPos, {
|
|
9262
8168
|
title: "Ja"
|
|
9263
|
-
}, /* @__PURE__ */
|
|
8169
|
+
}, /* @__PURE__ */ React79.createElement(SrOnly, null, "Ja"), /* @__PURE__ */ React79.createElement(IconCheck, {
|
|
9264
8170
|
block: true
|
|
9265
|
-
})) : /* @__PURE__ */
|
|
8171
|
+
})) : /* @__PURE__ */ React79.createElement(TableListBooleanNeg, {
|
|
9266
8172
|
title: "Nej"
|
|
9267
|
-
}, /* @__PURE__ */
|
|
8173
|
+
}, /* @__PURE__ */ React79.createElement(SrOnly, null, "Nej"), /* @__PURE__ */ React79.createElement(IconCancel, {
|
|
9268
8174
|
block: true
|
|
9269
8175
|
}));
|
|
9270
8176
|
}
|
|
@@ -9277,27 +8183,27 @@ var formatValue = (value, unit) => {
|
|
|
9277
8183
|
return value;
|
|
9278
8184
|
};
|
|
9279
8185
|
var MetadataItem = ({ name, hint, value, unit }) => {
|
|
9280
|
-
const [foldout, setFoldout] =
|
|
9281
|
-
const onToggleFoldout =
|
|
8186
|
+
const [foldout, setFoldout] = useState25(false);
|
|
8187
|
+
const onToggleFoldout = useCallback32(() => setFoldout(!foldout), [foldout]);
|
|
9282
8188
|
const presentedValue = formatValue(value, unit);
|
|
9283
|
-
return /* @__PURE__ */
|
|
8189
|
+
return /* @__PURE__ */ React79.createElement(TableListItem, null, /* @__PURE__ */ React79.createElement(TableListKey, null, hint ? /* @__PURE__ */ React79.createElement(ButtonInline, {
|
|
9284
8190
|
onClick: onToggleFoldout,
|
|
9285
8191
|
title: `Mer information om ${name}`
|
|
9286
|
-
}, name) : name), /* @__PURE__ */
|
|
8192
|
+
}, name) : name), /* @__PURE__ */ React79.createElement(TableListValue, null, value !== void 0 ? presentedValue : "Uppgift saknas"), hint && foldout && /* @__PURE__ */ React79.createElement(Modal_default, {
|
|
9287
8193
|
title: name,
|
|
9288
8194
|
onClose: onToggleFoldout
|
|
9289
|
-
}, /* @__PURE__ */
|
|
8195
|
+
}, /* @__PURE__ */ React79.createElement(Content_default, {
|
|
9290
8196
|
dangerouslySetInnerHTML: { __html: hint }
|
|
9291
8197
|
})));
|
|
9292
8198
|
};
|
|
9293
8199
|
var MetadataItem_default = MetadataItem;
|
|
9294
8200
|
|
|
9295
8201
|
// src/components/Tabs/index.tsx
|
|
9296
|
-
import * as
|
|
8202
|
+
import * as React80 from "react";
|
|
9297
8203
|
|
|
9298
8204
|
// src/components/Tabs/wrapper.tsx
|
|
9299
|
-
import
|
|
9300
|
-
var
|
|
8205
|
+
import styled55, { css as css14 } from "styled-components";
|
|
8206
|
+
var Wrapper30 = styled55.div`
|
|
9301
8207
|
overflow: hidden;
|
|
9302
8208
|
margin-top: ${size(-1)};
|
|
9303
8209
|
margin-left: ${size(-1)};
|
|
@@ -9308,7 +8214,7 @@ var Wrapper33 = styled59.div`
|
|
|
9308
8214
|
margin-right: ${size(-2)};
|
|
9309
8215
|
}
|
|
9310
8216
|
`;
|
|
9311
|
-
var List10 =
|
|
8217
|
+
var List10 = styled55.ul`
|
|
9312
8218
|
list-style: none;
|
|
9313
8219
|
padding: 0;
|
|
9314
8220
|
margin: 0;
|
|
@@ -9322,12 +8228,12 @@ var List10 = styled59.ul`
|
|
|
9322
8228
|
padding-right: ${size(1)};
|
|
9323
8229
|
}
|
|
9324
8230
|
`;
|
|
9325
|
-
var
|
|
8231
|
+
var Item10 = styled55.li`
|
|
9326
8232
|
display: inline-block;
|
|
9327
8233
|
vertical-align: bottom;
|
|
9328
8234
|
font-size: 1rem;
|
|
9329
8235
|
`;
|
|
9330
|
-
var Action9 =
|
|
8236
|
+
var Action9 = styled55(ButtonReset).attrs(() => ({
|
|
9331
8237
|
role: "tab",
|
|
9332
8238
|
className: "wayke__theme wayke__font--bold"
|
|
9333
8239
|
}))`
|
|
@@ -9353,7 +8259,7 @@ var Action9 = styled59(ButtonReset).attrs(() => ({
|
|
|
9353
8259
|
z-index: 1;
|
|
9354
8260
|
}
|
|
9355
8261
|
|
|
9356
|
-
${(props) => props.active &&
|
|
8262
|
+
${(props) => props.active && css14`
|
|
9357
8263
|
color: ${(props2) => props2.theme.color.textDark};
|
|
9358
8264
|
|
|
9359
8265
|
:after {
|
|
@@ -9363,9 +8269,9 @@ var Action9 = styled59(ButtonReset).attrs(() => ({
|
|
|
9363
8269
|
`;
|
|
9364
8270
|
|
|
9365
8271
|
// src/components/Tabs/index.tsx
|
|
9366
|
-
var Tabs = ({ tabs, active, onClick }) => /* @__PURE__ */
|
|
8272
|
+
var Tabs = ({ tabs, active, onClick }) => /* @__PURE__ */ React80.createElement(Wrapper30, null, /* @__PURE__ */ React80.createElement(List10, null, tabs.map((tab) => /* @__PURE__ */ React80.createElement(Item10, {
|
|
9367
8273
|
key: tab.name
|
|
9368
|
-
}, /* @__PURE__ */
|
|
8274
|
+
}, /* @__PURE__ */ React80.createElement(Action9, {
|
|
9369
8275
|
title: tab.displayName,
|
|
9370
8276
|
onClick: onClick ? () => onClick(tab.name) : void 0,
|
|
9371
8277
|
active: tab.name === active ? "true" : void 0
|
|
@@ -9373,30 +8279,30 @@ var Tabs = ({ tabs, active, onClick }) => /* @__PURE__ */ React91.createElement(
|
|
|
9373
8279
|
var Tabs_default = Tabs;
|
|
9374
8280
|
|
|
9375
8281
|
// src/layouts/searchItem/Property.tsx
|
|
9376
|
-
var MetadataSubCategory = ({ name, properties }) => /* @__PURE__ */
|
|
8282
|
+
var MetadataSubCategory = ({ name, properties }) => /* @__PURE__ */ React81.createElement(Repeat, null, /* @__PURE__ */ React81.createElement(H5, {
|
|
9377
8283
|
as: "h3"
|
|
9378
|
-
}, name), /* @__PURE__ */
|
|
8284
|
+
}, name), /* @__PURE__ */ React81.createElement(TableList, null, !!properties.length && properties.map((property, index2) => /* @__PURE__ */ React81.createElement(MetadataItem_default, {
|
|
9379
8285
|
name: property.name,
|
|
9380
8286
|
hint: property.hint,
|
|
9381
8287
|
value: property.value,
|
|
9382
8288
|
unit: property.unit,
|
|
9383
8289
|
key: `${property.name}-${index2}`
|
|
9384
8290
|
}))));
|
|
9385
|
-
var MetadataCategory = ({ properties, subCategories }) => /* @__PURE__ */
|
|
8291
|
+
var MetadataCategory = ({ properties, subCategories }) => /* @__PURE__ */ React81.createElement("div", {
|
|
9386
8292
|
className: "tab-section"
|
|
9387
|
-
}, !!properties.length && /* @__PURE__ */
|
|
8293
|
+
}, !!properties.length && /* @__PURE__ */ React81.createElement(Repeat, null, /* @__PURE__ */ React81.createElement(TableList, null, properties.map((property, index2) => /* @__PURE__ */ React81.createElement(MetadataItem_default, {
|
|
9388
8294
|
name: property.name,
|
|
9389
8295
|
hint: property.hint,
|
|
9390
8296
|
value: property.value,
|
|
9391
8297
|
unit: property.unit,
|
|
9392
8298
|
key: `${property.name}-${index2}`
|
|
9393
|
-
})))), !!subCategories.length && subCategories.map((subCategory, index2) => /* @__PURE__ */
|
|
8299
|
+
})))), !!subCategories.length && subCategories.map((subCategory, index2) => /* @__PURE__ */ React81.createElement(MetadataSubCategory, {
|
|
9394
8300
|
name: subCategory.name,
|
|
9395
8301
|
properties: subCategory.properties,
|
|
9396
8302
|
key: `${subCategory.name}-${index2}`
|
|
9397
8303
|
})));
|
|
9398
8304
|
var PropertySet = ({ propertySet, vehicleData }) => {
|
|
9399
|
-
const [activeCategoryId, setActiveCategoryId] =
|
|
8305
|
+
const [activeCategoryId, setActiveCategoryId] = useState26(-1);
|
|
9400
8306
|
const mappedProperties = useMemo5(() => {
|
|
9401
8307
|
if (!propertySet) {
|
|
9402
8308
|
return void 0;
|
|
@@ -9408,24 +8314,24 @@ var PropertySet = ({ propertySet, vehicleData }) => {
|
|
|
9408
8314
|
property_tree_sorter_default(tree);
|
|
9409
8315
|
return tree;
|
|
9410
8316
|
}, [propertySet]);
|
|
9411
|
-
|
|
8317
|
+
useEffect13(() => {
|
|
9412
8318
|
const categories = mappedProperties?.categories?.length !== void 0 ? mappedProperties?.categories : void 0;
|
|
9413
8319
|
if (activeCategoryId < 0 && categories !== void 0 && categories.length > 0) {
|
|
9414
8320
|
setActiveCategoryId(categories[0].id);
|
|
9415
8321
|
}
|
|
9416
8322
|
}, [mappedProperties]);
|
|
9417
|
-
const onTab =
|
|
8323
|
+
const onTab = useCallback33((id) => setActiveCategoryId(parseInt(id, 10)), []);
|
|
9418
8324
|
const activeCategory = mappedProperties?.categories?.find(
|
|
9419
8325
|
(category) => category.id === activeCategoryId
|
|
9420
8326
|
);
|
|
9421
|
-
return /* @__PURE__ */
|
|
8327
|
+
return /* @__PURE__ */ React81.createElement(React81.Fragment, null, /* @__PURE__ */ React81.createElement(Repeat, null, /* @__PURE__ */ React81.createElement(Tabs_default, {
|
|
9422
8328
|
tabs: mappedProperties?.categories?.map((category) => ({
|
|
9423
8329
|
name: `${category.id}`,
|
|
9424
8330
|
displayName: category.name
|
|
9425
8331
|
})) || [],
|
|
9426
8332
|
active: `${activeCategoryId}`,
|
|
9427
8333
|
onClick: onTab
|
|
9428
|
-
})), activeCategory && /* @__PURE__ */
|
|
8334
|
+
})), activeCategory && /* @__PURE__ */ React81.createElement(Repeat, null, /* @__PURE__ */ React81.createElement(MetadataCategory, {
|
|
9429
8335
|
properties: activeCategory.properties,
|
|
9430
8336
|
subCategories: activeCategory.subCategories
|
|
9431
8337
|
})));
|
|
@@ -9433,11 +8339,11 @@ var PropertySet = ({ propertySet, vehicleData }) => {
|
|
|
9433
8339
|
var Property_default = PropertySet;
|
|
9434
8340
|
|
|
9435
8341
|
// src/components/Pdf/index.tsx
|
|
9436
|
-
import
|
|
8342
|
+
import React82 from "react";
|
|
9437
8343
|
|
|
9438
8344
|
// src/components/Pdf/wrapper.tsx
|
|
9439
|
-
import
|
|
9440
|
-
var PdfListItem =
|
|
8345
|
+
import styled56 from "styled-components";
|
|
8346
|
+
var PdfListItem = styled56.li.attrs(() => ({
|
|
9441
8347
|
className: "wayke__theme wayke__color--primary-text"
|
|
9442
8348
|
}))`
|
|
9443
8349
|
flex: 0 0 50%;
|
|
@@ -9447,14 +8353,14 @@ var PdfListItem = styled60.li.attrs(() => ({
|
|
|
9447
8353
|
flex: 0 0 100%;
|
|
9448
8354
|
}
|
|
9449
8355
|
`;
|
|
9450
|
-
var PdfContainer =
|
|
8356
|
+
var PdfContainer = styled56.ul`
|
|
9451
8357
|
list-style: none;
|
|
9452
8358
|
padding: 0;
|
|
9453
8359
|
display: flex;
|
|
9454
8360
|
flex-wrap: wrap;
|
|
9455
8361
|
margin: ${size(-1)};
|
|
9456
8362
|
`;
|
|
9457
|
-
var PdfLink =
|
|
8363
|
+
var PdfLink = styled56.a.attrs(() => ({
|
|
9458
8364
|
className: "wayke__theme wayke__color--primary-text wayke__font--bold"
|
|
9459
8365
|
}))`
|
|
9460
8366
|
text-decoration: none;
|
|
@@ -9468,19 +8374,19 @@ var PdfLink = styled60.a.attrs(() => ({
|
|
|
9468
8374
|
height: 100%;
|
|
9469
8375
|
}
|
|
9470
8376
|
`;
|
|
9471
|
-
var PdfTitle =
|
|
8377
|
+
var PdfTitle = styled56.div`
|
|
9472
8378
|
color: ${(props) => props.theme.color.textDark};
|
|
9473
8379
|
`;
|
|
9474
|
-
var PdfSubtitle =
|
|
8380
|
+
var PdfSubtitle = styled56.div`
|
|
9475
8381
|
color: ${(props) => props.theme.color.textDarkLighten};
|
|
9476
8382
|
`;
|
|
9477
|
-
var PdfColumn =
|
|
8383
|
+
var PdfColumn = styled56.div`
|
|
9478
8384
|
flex 0 0 auto;
|
|
9479
8385
|
&:first-child {
|
|
9480
8386
|
flex: 1 1 auto;
|
|
9481
8387
|
}
|
|
9482
8388
|
`;
|
|
9483
|
-
var PdfListInner =
|
|
8389
|
+
var PdfListInner = styled56.div`
|
|
9484
8390
|
position: relative;
|
|
9485
8391
|
border: 1px solid ${(props) => props.theme.color.border};
|
|
9486
8392
|
padding: ${size(1.5)};
|
|
@@ -9492,12 +8398,12 @@ var PdfListInner = styled60.div`
|
|
|
9492
8398
|
`;
|
|
9493
8399
|
|
|
9494
8400
|
// src/components/Pdf/index.tsx
|
|
9495
|
-
var PdfDownloadItem = ({ document: document2 }) => /* @__PURE__ */
|
|
8401
|
+
var PdfDownloadItem = ({ document: document2 }) => /* @__PURE__ */ React82.createElement(PdfListItem, null, /* @__PURE__ */ React82.createElement(PdfListInner, null, /* @__PURE__ */ React82.createElement(PdfColumn, null, /* @__PURE__ */ React82.createElement(PdfTitle, null, document2.name), /* @__PURE__ */ React82.createElement(PdfSubtitle, null, document2.contentType)), /* @__PURE__ */ React82.createElement(PdfColumn, null, /* @__PURE__ */ React82.createElement(PdfLink, {
|
|
9496
8402
|
href: document2.url,
|
|
9497
8403
|
rel: "noopener noreferrer nofollow",
|
|
9498
8404
|
target: "_blank"
|
|
9499
8405
|
}, "\xD6ppna"))));
|
|
9500
|
-
var PdfDownloadContainer = ({ documents }) => /* @__PURE__ */
|
|
8406
|
+
var PdfDownloadContainer = ({ documents }) => /* @__PURE__ */ React82.createElement(PdfContainer, null, documents.map((document2, i) => /* @__PURE__ */ React82.createElement(PdfDownloadItem, {
|
|
9501
8407
|
key: `${document2.url}-${i}`,
|
|
9502
8408
|
document: document2
|
|
9503
8409
|
})));
|
|
@@ -9514,10 +8420,10 @@ var WaykeSearchItem = ({
|
|
|
9514
8420
|
onClickSearchItem
|
|
9515
8421
|
}) => {
|
|
9516
8422
|
const { ecomSettings } = useSettings_default();
|
|
9517
|
-
const ecomContext =
|
|
8423
|
+
const ecomContext = useRef3();
|
|
9518
8424
|
const { loading, data: result } = useSearchItem_default(id);
|
|
9519
8425
|
const { vehicle: centralStorageVehicle, loading: loadingCentralStorageVehicle } = useCentralStorage_default(result?.vehicle);
|
|
9520
|
-
|
|
8426
|
+
useEffect14(() => {
|
|
9521
8427
|
if (ecomSettings) {
|
|
9522
8428
|
ecomContext.current = new WaykeEcomWeb({
|
|
9523
8429
|
id,
|
|
@@ -9539,12 +8445,12 @@ var WaykeSearchItem = ({
|
|
|
9539
8445
|
}
|
|
9540
8446
|
};
|
|
9541
8447
|
}, []);
|
|
9542
|
-
|
|
8448
|
+
useEffect14(() => {
|
|
9543
8449
|
if (!disableResetScrollOnInit) {
|
|
9544
8450
|
window.scrollTo(0, 0);
|
|
9545
8451
|
}
|
|
9546
8452
|
}, []);
|
|
9547
|
-
|
|
8453
|
+
useEffect14(() => {
|
|
9548
8454
|
if (result?.vehicle?.data && modifyDocumentTitleItem) {
|
|
9549
8455
|
const { vehicle: vehicle2 } = result;
|
|
9550
8456
|
const { registrationNumber } = vehicle2.data;
|
|
@@ -9555,12 +8461,12 @@ var WaykeSearchItem = ({
|
|
|
9555
8461
|
() => result?.vehicle?.data?.options?.filter(notEmpty).map((opt) => ({ title: opt })),
|
|
9556
8462
|
[result?.vehicle?.data?.options]
|
|
9557
8463
|
);
|
|
9558
|
-
const onShowMoreOptionsClick =
|
|
8464
|
+
const onShowMoreOptionsClick = useCallback34(() => pubsub_default.publish("OptionsClick"), []);
|
|
9559
8465
|
if (loading) {
|
|
9560
|
-
return /* @__PURE__ */
|
|
8466
|
+
return /* @__PURE__ */ React83.createElement(PageLoading_default, null);
|
|
9561
8467
|
}
|
|
9562
8468
|
if (!result?.vehicle?.data) {
|
|
9563
|
-
return /* @__PURE__ */
|
|
8469
|
+
return /* @__PURE__ */ React83.createElement(Page404_default, null);
|
|
9564
8470
|
}
|
|
9565
8471
|
const { vehicle } = result;
|
|
9566
8472
|
const contact = centralStorageVehicle?.contact;
|
|
@@ -9594,40 +8500,40 @@ var WaykeSearchItem = ({
|
|
|
9594
8500
|
if (fuelType) {
|
|
9595
8501
|
uspList.push({ title: fuelType });
|
|
9596
8502
|
}
|
|
9597
|
-
return /* @__PURE__ */
|
|
8503
|
+
return /* @__PURE__ */ React83.createElement(React83.Fragment, null, /* @__PURE__ */ React83.createElement(Page, null, /* @__PURE__ */ React83.createElement(PageSection, {
|
|
9598
8504
|
large: true
|
|
9599
|
-
}, /* @__PURE__ */
|
|
8505
|
+
}, /* @__PURE__ */ React83.createElement(Container_default, null, /* @__PURE__ */ React83.createElement(ProductPage, null, /* @__PURE__ */ React83.createElement(ProductPageAside, null, /* @__PURE__ */ React83.createElement(ProductPageAsideSection, {
|
|
9600
8506
|
mobileOrder: 1
|
|
9601
|
-
}, !pathRoute && hashRoute ? /* @__PURE__ */
|
|
8507
|
+
}, !pathRoute && hashRoute ? /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(UtilityFontSizeSmall, null, /* @__PURE__ */ React83.createElement(ButtonInlineLight, {
|
|
9602
8508
|
as: "a",
|
|
9603
8509
|
href: "#",
|
|
9604
8510
|
title: "Tillbaka till bils\xF6k"
|
|
9605
|
-
}, /* @__PURE__ */
|
|
8511
|
+
}, /* @__PURE__ */ React83.createElement(ButtonContent, null, /* @__PURE__ */ React83.createElement(IconChevronLeft, {
|
|
9606
8512
|
block: true
|
|
9607
|
-
})), /* @__PURE__ */
|
|
8513
|
+
})), /* @__PURE__ */ React83.createElement(ButtonContent, null, "Tillbaka till bils\xF6k")))) : null, manufacturer?.logotype && /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(LogoBox_default, {
|
|
9608
8514
|
logo: manufacturer.logotype,
|
|
9609
8515
|
alt: manufacturer.name
|
|
9610
|
-
})), /* @__PURE__ */
|
|
8516
|
+
})), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(RepeatSmall, null, /* @__PURE__ */ React83.createElement(H1, {
|
|
9611
8517
|
noMargin: true
|
|
9612
|
-
}, title)), shortDescription && /* @__PURE__ */
|
|
8518
|
+
}, title)), shortDescription && /* @__PURE__ */ React83.createElement(RepeatSmall, null, /* @__PURE__ */ React83.createElement("div", null, shortDescription)), /* @__PURE__ */ React83.createElement(RepeatSmall, null, /* @__PURE__ */ React83.createElement(UspList_default, {
|
|
9613
8519
|
small: true,
|
|
9614
8520
|
items: uspList
|
|
9615
|
-
})))), /* @__PURE__ */
|
|
8521
|
+
})))), /* @__PURE__ */ React83.createElement(ProductPageAsideSection, {
|
|
9616
8522
|
mobileOrder: 2
|
|
9617
|
-
}, /* @__PURE__ */
|
|
8523
|
+
}, /* @__PURE__ */ React83.createElement(PriceTable_default, {
|
|
9618
8524
|
price
|
|
9619
|
-
})), (financialOptions.length > 0 || insuranceOptions.length > 0) && /* @__PURE__ */
|
|
8525
|
+
})), (financialOptions.length > 0 || insuranceOptions.length > 0) && /* @__PURE__ */ React83.createElement(ProductPageAsideSection, {
|
|
9620
8526
|
mobileOrder: 4
|
|
9621
|
-
}, financialOptions.length > 0 && /* @__PURE__ */
|
|
8527
|
+
}, financialOptions.length > 0 && /* @__PURE__ */ React83.createElement(FinancialOptions_default, {
|
|
9622
8528
|
id,
|
|
9623
8529
|
financialOptions
|
|
9624
|
-
}), insuranceOptions.length > 0 && /* @__PURE__ */
|
|
8530
|
+
}), insuranceOptions.length > 0 && /* @__PURE__ */ React83.createElement(InsuranceOptions_default, {
|
|
9625
8531
|
id,
|
|
9626
8532
|
branch: centralStorageVehicle?.branch,
|
|
9627
8533
|
insuranceOptions
|
|
9628
|
-
})), /* @__PURE__ */
|
|
8534
|
+
})), /* @__PURE__ */ React83.createElement(ProductPageAsideSection, {
|
|
9629
8535
|
mobileOrder: 5
|
|
9630
|
-
}, /* @__PURE__ */
|
|
8536
|
+
}, /* @__PURE__ */ React83.createElement(CheckList_default, {
|
|
9631
8537
|
manufacturer,
|
|
9632
8538
|
packageOptions,
|
|
9633
8539
|
ecommerce,
|
|
@@ -9635,77 +8541,141 @@ var WaykeSearchItem = ({
|
|
|
9635
8541
|
contact: centralStorageVehicle?.contact,
|
|
9636
8542
|
loadingCentralStorageVehicle,
|
|
9637
8543
|
toggleEcomModal: () => ecomContext.current?.start()
|
|
9638
|
-
}))), /* @__PURE__ */
|
|
8544
|
+
}))), /* @__PURE__ */ React83.createElement(ProductPageMain, null, /* @__PURE__ */ React83.createElement(ProductPageAsideSection, {
|
|
9639
8545
|
mobileOrder: 3
|
|
9640
|
-
}, /* @__PURE__ */
|
|
8546
|
+
}, /* @__PURE__ */ React83.createElement(Gallery_default, {
|
|
9641
8547
|
media,
|
|
9642
8548
|
placeholderImage
|
|
9643
|
-
})), /* @__PURE__ */
|
|
8549
|
+
})), /* @__PURE__ */ React83.createElement(ProductPageMainSection, null, /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(H2, {
|
|
9644
8550
|
noMargin: true
|
|
9645
|
-
}, "Biluppgifter")), /* @__PURE__ */
|
|
8551
|
+
}, "Biluppgifter")), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(Content_default, null, /* @__PURE__ */ React83.createElement("p", null, "Information direkt fr\xE5n Transportstyrelsen och tillverkaren."))), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(Property_default, {
|
|
9646
8552
|
propertySet,
|
|
9647
8553
|
vehicleData: vehicle.data
|
|
9648
|
-
}))), description && /* @__PURE__ */
|
|
8554
|
+
}))), description && /* @__PURE__ */ React83.createElement(ProductPageMainSection, null, /* @__PURE__ */ React83.createElement(Blockquote_default, {
|
|
9649
8555
|
author: contact && contact.name ? contact.name : null,
|
|
9650
8556
|
date: publishedAt ? dateTimeFormat.format(publishedAt, dateTimeFormat.DayMonth) : void 0,
|
|
9651
8557
|
avatar: contact?.avatar || void 0
|
|
9652
|
-
}, !!description && /* @__PURE__ */
|
|
8558
|
+
}, !!description && /* @__PURE__ */ React83.createElement("p", null, description))), (options?.length || 0) > 0 && /* @__PURE__ */ React83.createElement(ProductPageMainSection, null, /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(H2, {
|
|
9653
8559
|
noMargin: true
|
|
9654
|
-
}, "Utrustning")), /* @__PURE__ */
|
|
8560
|
+
}, "Utrustning")), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(Content_default, null, /* @__PURE__ */ React83.createElement("p", null, "Kompletterande uppgifter om bilen."))), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(ExtendContent_default, {
|
|
9655
8561
|
actionTitle: "Visa mer",
|
|
9656
8562
|
onClick: onShowMoreOptionsClick
|
|
9657
|
-
}, /* @__PURE__ */
|
|
8563
|
+
}, /* @__PURE__ */ React83.createElement(UspList_default, {
|
|
9658
8564
|
items: options
|
|
9659
|
-
})))), (documents.length || 0) > 0 && /* @__PURE__ */
|
|
8565
|
+
})))), (documents.length || 0) > 0 && /* @__PURE__ */ React83.createElement(ProductPageMainSection, null, /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(H2, {
|
|
9660
8566
|
noMargin: true
|
|
9661
|
-
}, "Dokument")), /* @__PURE__ */
|
|
8567
|
+
}, "Dokument")), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(Content_default, null, /* @__PURE__ */ React83.createElement("p", null, "Tillh\xF6rande dokument f\xF6r bilen."))), /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(Pdf_default, {
|
|
9662
8568
|
documents
|
|
9663
|
-
}))), /* @__PURE__ */
|
|
8569
|
+
}))), /* @__PURE__ */ React83.createElement(ProductPageMainSection, null, /* @__PURE__ */ React83.createElement(Branch_default, {
|
|
9664
8570
|
branch,
|
|
9665
8571
|
loading: loadingCentralStorageVehicle
|
|
9666
|
-
}), ecommerce && ecommerce.enabled && /* @__PURE__ */
|
|
8572
|
+
}), ecommerce && ecommerce.enabled && /* @__PURE__ */ React83.createElement(Repeat, null, /* @__PURE__ */ React83.createElement(ButtonPrimary, {
|
|
9667
8573
|
disabled: !!ecommerce.reserved,
|
|
9668
8574
|
title: "K\xF6p bilen online",
|
|
9669
8575
|
onClick: () => ecomContext.current?.start()
|
|
9670
|
-
}, "K\xF6p bilen online"))), /* @__PURE__ */
|
|
8576
|
+
}, "K\xF6p bilen online"))), /* @__PURE__ */ React83.createElement(PackageOptions_default, {
|
|
9671
8577
|
packageOptions
|
|
9672
|
-
}), /* @__PURE__ */
|
|
8578
|
+
}), /* @__PURE__ */ React83.createElement(ManufacturerPackagesOption_default, {
|
|
9673
8579
|
packageOption: manufacturer?.packageOption
|
|
9674
|
-
}))))), /* @__PURE__ */
|
|
8580
|
+
}))))), /* @__PURE__ */ React83.createElement(Related_default, {
|
|
9675
8581
|
id,
|
|
9676
8582
|
hashRoute,
|
|
9677
8583
|
pathRoute,
|
|
9678
8584
|
onClickSearchItem
|
|
9679
|
-
})), false, /* @__PURE__ */
|
|
8585
|
+
})), false, /* @__PURE__ */ React83.createElement(portal_element_default, {
|
|
9680
8586
|
id: portal_namespace_exports.DefaultPortal
|
|
9681
8587
|
}));
|
|
9682
8588
|
};
|
|
9683
8589
|
var searchItem_default = WaykeSearchItem;
|
|
9684
8590
|
|
|
9685
8591
|
// src/providers/WaykeProvider.tsx
|
|
9686
|
-
import
|
|
8592
|
+
import React91 from "react";
|
|
9687
8593
|
|
|
9688
8594
|
// src/providers/graphqlProvider.tsx
|
|
9689
|
-
import
|
|
8595
|
+
import React84 from "react";
|
|
9690
8596
|
import { ApolloProvider as ApolloProviderBase, ApolloClient, InMemoryCache } from "@apollo/client";
|
|
9691
8597
|
var GraphqlProvider = ({ uri, children }) => {
|
|
9692
8598
|
const client = new ApolloClient({ uri, cache: new InMemoryCache() });
|
|
9693
|
-
return /* @__PURE__ */
|
|
8599
|
+
return /* @__PURE__ */ React84.createElement(ApolloProviderBase, {
|
|
9694
8600
|
client
|
|
9695
8601
|
}, children);
|
|
9696
8602
|
};
|
|
9697
8603
|
var graphqlProvider_default = GraphqlProvider;
|
|
9698
8604
|
|
|
9699
8605
|
// src/providers/themeProvider.tsx
|
|
9700
|
-
import
|
|
8606
|
+
import React85 from "react";
|
|
9701
8607
|
import { ThemeProvider as ThemeProviderBase } from "styled-components";
|
|
9702
|
-
var ThemeProvider = ({ children }) => /* @__PURE__ */
|
|
8608
|
+
var ThemeProvider = ({ children }) => /* @__PURE__ */ React85.createElement(ThemeProviderBase, {
|
|
9703
8609
|
theme: theme_default
|
|
9704
8610
|
}, children);
|
|
9705
8611
|
var themeProvider_default = ThemeProvider;
|
|
9706
8612
|
|
|
9707
8613
|
// src/State/Search/SearchProvider.tsx
|
|
9708
|
-
import
|
|
8614
|
+
import React86, { useState as useState28, useEffect as useEffect16, useCallback as useCallback36 } from "react";
|
|
8615
|
+
|
|
8616
|
+
// src/hooks/useFetch.ts
|
|
8617
|
+
import { useEffect as useEffect15, useState as useState27, useCallback as useCallback35 } from "react";
|
|
8618
|
+
var cache = {};
|
|
8619
|
+
var getCachedResult = (key) => cache?.[key] || void 0;
|
|
8620
|
+
var setCachedResult = (key, value) => {
|
|
8621
|
+
cache[key] = value;
|
|
8622
|
+
};
|
|
8623
|
+
var pendingPromise = {};
|
|
8624
|
+
var isPendingPromise = (url) => !!pendingPromise[url];
|
|
8625
|
+
var setPendingPromise = (url, promise) => {
|
|
8626
|
+
pendingPromise = {
|
|
8627
|
+
...pendingPromise,
|
|
8628
|
+
[url]: promise
|
|
8629
|
+
};
|
|
8630
|
+
};
|
|
8631
|
+
var clearPendingPromise = (url) => {
|
|
8632
|
+
delete pendingPromise[url];
|
|
8633
|
+
};
|
|
8634
|
+
var useFetch = (path, options, skip, promiseCache) => {
|
|
8635
|
+
const [data, setData] = useState27();
|
|
8636
|
+
const [loading, setLoading] = useState27(false);
|
|
8637
|
+
const [error, setError] = useState27(false);
|
|
8638
|
+
const doFetch = useCallback35(async () => {
|
|
8639
|
+
const key = path.toString();
|
|
8640
|
+
const cached = getCachedResult(key);
|
|
8641
|
+
setError(false);
|
|
8642
|
+
if (cached) {
|
|
8643
|
+
setData(cached);
|
|
8644
|
+
return;
|
|
8645
|
+
}
|
|
8646
|
+
setLoading(true);
|
|
8647
|
+
try {
|
|
8648
|
+
const reusePromise = promiseCache && isPendingPromise(key);
|
|
8649
|
+
const request = reusePromise ? pendingPromise[key] : fetch(path, options);
|
|
8650
|
+
if (promiseCache) {
|
|
8651
|
+
setPendingPromise(key, request);
|
|
8652
|
+
}
|
|
8653
|
+
const result = await request;
|
|
8654
|
+
if (result.ok) {
|
|
8655
|
+
const json2 = await result.clone().json();
|
|
8656
|
+
setCachedResult(key, json2);
|
|
8657
|
+
setData(json2);
|
|
8658
|
+
}
|
|
8659
|
+
} catch (e) {
|
|
8660
|
+
setError(true);
|
|
8661
|
+
} finally {
|
|
8662
|
+
setLoading(false);
|
|
8663
|
+
clearPendingPromise(key);
|
|
8664
|
+
}
|
|
8665
|
+
return;
|
|
8666
|
+
}, [path, options]);
|
|
8667
|
+
useEffect15(() => {
|
|
8668
|
+
if (!skip) {
|
|
8669
|
+
doFetch();
|
|
8670
|
+
}
|
|
8671
|
+
}, [path, skip]);
|
|
8672
|
+
return {
|
|
8673
|
+
loading,
|
|
8674
|
+
data,
|
|
8675
|
+
error
|
|
8676
|
+
};
|
|
8677
|
+
};
|
|
8678
|
+
var useFetch_default = useFetch;
|
|
9709
8679
|
|
|
9710
8680
|
// src/utils/url.ts
|
|
9711
8681
|
var getUrlSearchParamsFromUrl = () => new URLSearchParams(window.location.search);
|
|
@@ -9722,12 +8692,12 @@ var SearchProvider = ({
|
|
|
9722
8692
|
children
|
|
9723
8693
|
}) => {
|
|
9724
8694
|
const { replaceState, pushState } = usePath_default();
|
|
9725
|
-
const [queryFilter, setQueryFilter] =
|
|
8695
|
+
const [queryFilter, setQueryFilter] = useState28({
|
|
9726
8696
|
searchParams: initialSearchParams
|
|
9727
8697
|
});
|
|
9728
|
-
const [initialFacets, setInitialFacets] =
|
|
9729
|
-
const [documents, setDocuments] =
|
|
9730
|
-
const [initialize, setInitialize] =
|
|
8698
|
+
const [initialFacets, setInitialFacets] = useState28();
|
|
8699
|
+
const [documents, setDocuments] = useState28();
|
|
8700
|
+
const [initialize, setInitialize] = useState28(false);
|
|
9731
8701
|
const { data: initialDataRepsonse } = useFetch_default(
|
|
9732
8702
|
`${url}?hits=0`,
|
|
9733
8703
|
{
|
|
@@ -9763,7 +8733,7 @@ var SearchProvider = ({
|
|
|
9763
8733
|
});
|
|
9764
8734
|
}
|
|
9765
8735
|
};
|
|
9766
|
-
|
|
8736
|
+
useEffect16(() => {
|
|
9767
8737
|
if (useQueryParamsFromUrl) {
|
|
9768
8738
|
window.addEventListener("popstate", popStateEvent);
|
|
9769
8739
|
}
|
|
@@ -9777,12 +8747,12 @@ var SearchProvider = ({
|
|
|
9777
8747
|
pubsub_default.unsubscribeAction(onFilterUpdateEvent);
|
|
9778
8748
|
};
|
|
9779
8749
|
}, []);
|
|
9780
|
-
|
|
8750
|
+
useEffect16(() => {
|
|
9781
8751
|
if (initialDataRepsonse) {
|
|
9782
8752
|
setInitialFacets(initialDataRepsonse.facets);
|
|
9783
8753
|
}
|
|
9784
8754
|
}, [initialDataRepsonse]);
|
|
9785
|
-
|
|
8755
|
+
useEffect16(() => {
|
|
9786
8756
|
if (useQueryParamsFromUrl) {
|
|
9787
8757
|
const nextSearchParams = new URLSearchParams(queryFilter.searchParams);
|
|
9788
8758
|
nextSearchParams.delete("hits");
|
|
@@ -9805,7 +8775,7 @@ var SearchProvider = ({
|
|
|
9805
8775
|
}
|
|
9806
8776
|
}
|
|
9807
8777
|
}, [queryFilter, initialize, useQueryParamsFromUrl]);
|
|
9808
|
-
|
|
8778
|
+
useEffect16(() => {
|
|
9809
8779
|
if (response) {
|
|
9810
8780
|
if (!initialFacets && !useQueryParamsFromUrl) {
|
|
9811
8781
|
setInitialFacets(response.facets);
|
|
@@ -9830,7 +8800,7 @@ var SearchProvider = ({
|
|
|
9830
8800
|
}
|
|
9831
8801
|
}
|
|
9832
8802
|
}, [response, useQueryParamsFromUrl]);
|
|
9833
|
-
const onFilterUpdate =
|
|
8803
|
+
const onFilterUpdate = useCallback36(
|
|
9834
8804
|
(nextQuery) => {
|
|
9835
8805
|
{
|
|
9836
8806
|
if (!initialize) {
|
|
@@ -9843,7 +8813,7 @@ var SearchProvider = ({
|
|
|
9843
8813
|
},
|
|
9844
8814
|
[initialize]
|
|
9845
8815
|
);
|
|
9846
|
-
const onLoadMore =
|
|
8816
|
+
const onLoadMore = useCallback36(() => {
|
|
9847
8817
|
if (response) {
|
|
9848
8818
|
setQueryFilter({
|
|
9849
8819
|
searchParams: new URLSearchParams(response?.documentList.pagination.nextPage?.query),
|
|
@@ -9851,7 +8821,7 @@ var SearchProvider = ({
|
|
|
9851
8821
|
});
|
|
9852
8822
|
}
|
|
9853
8823
|
}, [response]);
|
|
9854
|
-
const onInitialize =
|
|
8824
|
+
const onInitialize = useCallback36(
|
|
9855
8825
|
(_initialQueryParams) => {
|
|
9856
8826
|
if (!initialize) {
|
|
9857
8827
|
const searchParamsFromUrl = getUrlSearchParamsFromUrl();
|
|
@@ -9895,15 +8865,15 @@ var SearchProvider = ({
|
|
|
9895
8865
|
onLoadMore,
|
|
9896
8866
|
onInitialize
|
|
9897
8867
|
};
|
|
9898
|
-
return /* @__PURE__ */
|
|
8868
|
+
return /* @__PURE__ */ React86.createElement(SearchContext.Provider, {
|
|
9899
8869
|
value
|
|
9900
8870
|
}, children);
|
|
9901
8871
|
};
|
|
9902
8872
|
var SearchProvider_default = SearchProvider;
|
|
9903
8873
|
|
|
9904
8874
|
// src/components/Root/index.tsx
|
|
9905
|
-
import
|
|
9906
|
-
var Root =
|
|
8875
|
+
import styled57 from "styled-components";
|
|
8876
|
+
var Root = styled57.div.attrs(() => ({
|
|
9907
8877
|
className: "wayke__theme wayke__font--regular"
|
|
9908
8878
|
}))`
|
|
9909
8879
|
background-color: ${(props) => props.theme.color.bg};
|
|
@@ -9945,21 +8915,21 @@ var useEcom = (ecomSettings) => {
|
|
|
9945
8915
|
var useEcom_default = useEcom;
|
|
9946
8916
|
|
|
9947
8917
|
// src/State/Settings/SettingsProvider.tsx
|
|
9948
|
-
import
|
|
8918
|
+
import React87 from "react";
|
|
9949
8919
|
var SettingsProvider = ({
|
|
9950
8920
|
googleMapsApiKey,
|
|
9951
8921
|
googleMapsMarker,
|
|
9952
8922
|
ecomSettings,
|
|
9953
8923
|
children
|
|
9954
|
-
}) => /* @__PURE__ */
|
|
8924
|
+
}) => /* @__PURE__ */ React87.createElement(SettingsContext.Provider, {
|
|
9955
8925
|
value: { ecomSettings, googleMapsApiKey, googleMapsMarker }
|
|
9956
8926
|
}, children);
|
|
9957
8927
|
var SettingsProvider_default = SettingsProvider;
|
|
9958
8928
|
|
|
9959
8929
|
// src/State/RelatedSearch/RelatedSearchProvider.tsx
|
|
9960
|
-
import
|
|
8930
|
+
import React88, { useState as useState29, useCallback as useCallback37 } from "react";
|
|
9961
8931
|
var RelatedSearchProvider = ({ url, urlMlt, apiKey, children }) => {
|
|
9962
|
-
const [queryFilter, setQueryFilter] =
|
|
8932
|
+
const [queryFilter, setQueryFilter] = useState29();
|
|
9963
8933
|
const query = queryFilter?.searchParams.toString();
|
|
9964
8934
|
const {
|
|
9965
8935
|
loading,
|
|
@@ -9974,7 +8944,7 @@ var RelatedSearchProvider = ({ url, urlMlt, apiKey, children }) => {
|
|
|
9974
8944
|
},
|
|
9975
8945
|
!queryFilter
|
|
9976
8946
|
);
|
|
9977
|
-
const fetchRelated =
|
|
8947
|
+
const fetchRelated = useCallback37(
|
|
9978
8948
|
(searchParams) => setQueryFilter({
|
|
9979
8949
|
searchParams
|
|
9980
8950
|
}),
|
|
@@ -9988,31 +8958,31 @@ var RelatedSearchProvider = ({ url, urlMlt, apiKey, children }) => {
|
|
|
9988
8958
|
queryFilter,
|
|
9989
8959
|
fetchRelated
|
|
9990
8960
|
};
|
|
9991
|
-
return /* @__PURE__ */
|
|
8961
|
+
return /* @__PURE__ */ React88.createElement(RelatedSearchContext.Provider, {
|
|
9992
8962
|
value
|
|
9993
8963
|
}, children);
|
|
9994
8964
|
};
|
|
9995
8965
|
var RelatedSearchProvider_default = RelatedSearchProvider;
|
|
9996
8966
|
|
|
9997
8967
|
// src/State/CentralStorage/CentralStorageProvider.tsx
|
|
9998
|
-
import
|
|
8968
|
+
import React89, { useCallback as useCallback39 } from "react";
|
|
9999
8969
|
|
|
10000
8970
|
// src/hooks/useSessionStorage.ts
|
|
10001
|
-
import { useState as
|
|
8971
|
+
import { useState as useState30, useCallback as useCallback38 } from "react";
|
|
10002
8972
|
var useSessionStorage = (key) => {
|
|
10003
|
-
const [value, setValue] =
|
|
10004
|
-
const set =
|
|
8973
|
+
const [value, setValue] = useState30(sessionStorage.getItem(key));
|
|
8974
|
+
const set = useCallback38(
|
|
10005
8975
|
(v) => {
|
|
10006
8976
|
sessionStorage.setItem(key, v);
|
|
10007
8977
|
setValue(v);
|
|
10008
8978
|
},
|
|
10009
8979
|
[key]
|
|
10010
8980
|
);
|
|
10011
|
-
const remove =
|
|
8981
|
+
const remove = useCallback38(() => {
|
|
10012
8982
|
sessionStorage.removeItem(key);
|
|
10013
8983
|
setValue(null);
|
|
10014
8984
|
}, [key]);
|
|
10015
|
-
const clear =
|
|
8985
|
+
const clear = useCallback38(() => {
|
|
10016
8986
|
sessionStorage.clear();
|
|
10017
8987
|
setValue(null);
|
|
10018
8988
|
}, [key]);
|
|
@@ -10028,21 +8998,21 @@ var useSessionStorage_default = useSessionStorage;
|
|
|
10028
8998
|
// src/State/CentralStorage/CentralStorageProvider.tsx
|
|
10029
8999
|
var CentralStorageProvider = ({ children }) => {
|
|
10030
9000
|
const { value, set, remove } = useSessionStorage_default("centralStorage");
|
|
10031
|
-
const setCentralStorageId =
|
|
10032
|
-
return /* @__PURE__ */
|
|
9001
|
+
const setCentralStorageId = useCallback39((id) => id ? set(id) : remove(), []);
|
|
9002
|
+
return /* @__PURE__ */ React89.createElement(CentralStorageContext.Provider, {
|
|
10033
9003
|
value: { centralStorageId: value, setCentralStorageId }
|
|
10034
9004
|
}, children);
|
|
10035
9005
|
};
|
|
10036
9006
|
var CentralStorageProvider_default = CentralStorageProvider;
|
|
10037
9007
|
|
|
10038
9008
|
// src/State/Path/PathProvider.tsx
|
|
10039
|
-
import
|
|
9009
|
+
import React90, { useCallback as useCallback40, useEffect as useEffect18, useMemo as useMemo7, useReducer } from "react";
|
|
10040
9010
|
|
|
10041
9011
|
// src/hooks/usePrevious.ts
|
|
10042
|
-
import { useRef as
|
|
9012
|
+
import { useRef as useRef4, useEffect as useEffect17 } from "react";
|
|
10043
9013
|
var usePrevious = (value) => {
|
|
10044
|
-
const ref =
|
|
10045
|
-
|
|
9014
|
+
const ref = useRef4();
|
|
9015
|
+
useEffect17(() => {
|
|
10046
9016
|
ref.current = value;
|
|
10047
9017
|
});
|
|
10048
9018
|
return ref.current;
|
|
@@ -10072,7 +9042,7 @@ var POP_STATE = "popstate";
|
|
|
10072
9042
|
var PathProvider = ({ children }) => {
|
|
10073
9043
|
const [state, dispatch] = useReducer(reducer_default, initialState);
|
|
10074
9044
|
const previousPath = usePrevious_default(state.path);
|
|
10075
|
-
|
|
9045
|
+
useEffect18(() => {
|
|
10076
9046
|
const onPopState = () => {
|
|
10077
9047
|
dispatch({ type: SET_PATH, path: window.location.pathname });
|
|
10078
9048
|
};
|
|
@@ -10081,7 +9051,7 @@ var PathProvider = ({ children }) => {
|
|
|
10081
9051
|
window.removeEventListener(POP_STATE, onPopState);
|
|
10082
9052
|
};
|
|
10083
9053
|
}, []);
|
|
10084
|
-
const pushState =
|
|
9054
|
+
const pushState = useCallback40((path) => {
|
|
10085
9055
|
const h1 = window.location.hash;
|
|
10086
9056
|
history.pushState(null, "", `${path}`);
|
|
10087
9057
|
const h2 = window.location.hash;
|
|
@@ -10090,7 +9060,7 @@ var PathProvider = ({ children }) => {
|
|
|
10090
9060
|
}
|
|
10091
9061
|
dispatch({ type: SET_PATH, path });
|
|
10092
9062
|
}, []);
|
|
10093
|
-
const replaceState =
|
|
9063
|
+
const replaceState = useCallback40((path) => {
|
|
10094
9064
|
const h1 = window.location.hash;
|
|
10095
9065
|
history.replaceState(null, "", path);
|
|
10096
9066
|
const h2 = window.location.hash;
|
|
@@ -10110,7 +9080,7 @@ var PathProvider = ({ children }) => {
|
|
|
10110
9080
|
}),
|
|
10111
9081
|
[state]
|
|
10112
9082
|
);
|
|
10113
|
-
return /* @__PURE__ */
|
|
9083
|
+
return /* @__PURE__ */ React90.createElement(PathContext.Provider, {
|
|
10114
9084
|
value
|
|
10115
9085
|
}, children);
|
|
10116
9086
|
};
|
|
@@ -10130,33 +9100,33 @@ var WaykeProvider = ({
|
|
|
10130
9100
|
children
|
|
10131
9101
|
}) => {
|
|
10132
9102
|
useEcom_default(ecomSettings);
|
|
10133
|
-
return /* @__PURE__ */
|
|
9103
|
+
return /* @__PURE__ */ React91.createElement(PathProvider_default, null, /* @__PURE__ */ React91.createElement(SettingsProvider_default, {
|
|
10134
9104
|
googleMapsApiKey,
|
|
10135
9105
|
googleMapsMarker,
|
|
10136
9106
|
ecomSettings
|
|
10137
|
-
}, /* @__PURE__ */
|
|
9107
|
+
}, /* @__PURE__ */ React91.createElement(CentralStorageProvider_default, null, /* @__PURE__ */ React91.createElement(graphqlProvider_default, {
|
|
10138
9108
|
uri: graphQlUrl
|
|
10139
|
-
}, /* @__PURE__ */
|
|
9109
|
+
}, /* @__PURE__ */ React91.createElement(SearchProvider_default, {
|
|
10140
9110
|
url,
|
|
10141
9111
|
apiKey,
|
|
10142
9112
|
useQueryParamsFromUrl,
|
|
10143
9113
|
pathRoute
|
|
10144
|
-
}, /* @__PURE__ */
|
|
9114
|
+
}, /* @__PURE__ */ React91.createElement(RelatedSearchProvider_default, {
|
|
10145
9115
|
url,
|
|
10146
9116
|
urlMlt,
|
|
10147
9117
|
apiKey
|
|
10148
|
-
}, /* @__PURE__ */
|
|
9118
|
+
}, /* @__PURE__ */ React91.createElement(themeProvider_default, null, /* @__PURE__ */ React91.createElement(Root_default, null, children))))))));
|
|
10149
9119
|
};
|
|
10150
9120
|
var WaykeProvider_default = WaykeProvider;
|
|
10151
9121
|
|
|
10152
9122
|
// src/layouts/WaykeCompositeWithProvider.tsx
|
|
10153
|
-
import
|
|
9123
|
+
import React93 from "react";
|
|
10154
9124
|
|
|
10155
9125
|
// src/layouts/WaykeComposite.tsx
|
|
10156
|
-
import
|
|
9126
|
+
import React92, { useEffect as useEffect20 } from "react";
|
|
10157
9127
|
|
|
10158
9128
|
// src/hooks/useHashGuid.ts
|
|
10159
|
-
import { useState as
|
|
9129
|
+
import { useState as useState31, useEffect as useEffect19 } from "react";
|
|
10160
9130
|
var regexGuid = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-5][0-9a-f]{3}-[089ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
|
|
10161
9131
|
var HASH_CHANGE = "hashchange";
|
|
10162
9132
|
var getGuid = () => {
|
|
@@ -10164,7 +9134,7 @@ var getGuid = () => {
|
|
|
10164
9134
|
return regexGuid.test(guid) || !guid ? guid : void 0;
|
|
10165
9135
|
};
|
|
10166
9136
|
var useHashGuid = () => {
|
|
10167
|
-
const [id, setId] =
|
|
9137
|
+
const [id, setId] = useState31(() => getGuid());
|
|
10168
9138
|
const onHashChange = () => {
|
|
10169
9139
|
const guid = window.location.hash.substr(1, window.location.hash.length);
|
|
10170
9140
|
if (regexGuid.test(guid) || !guid) {
|
|
@@ -10173,7 +9143,7 @@ var useHashGuid = () => {
|
|
|
10173
9143
|
throw "Invalid Guid";
|
|
10174
9144
|
}
|
|
10175
9145
|
};
|
|
10176
|
-
|
|
9146
|
+
useEffect19(() => {
|
|
10177
9147
|
onHashChange();
|
|
10178
9148
|
window.addEventListener(HASH_CHANGE, onHashChange);
|
|
10179
9149
|
return () => {
|
|
@@ -10198,7 +9168,7 @@ var WaykeComposite = ({
|
|
|
10198
9168
|
}) => {
|
|
10199
9169
|
const hashId = useHashGuid_default();
|
|
10200
9170
|
const { id: pathId } = usePath_default();
|
|
10201
|
-
|
|
9171
|
+
useEffect20(() => {
|
|
10202
9172
|
if (!pathRoute) {
|
|
10203
9173
|
if (hashId) {
|
|
10204
9174
|
pubsub_default.publish("HashRouteChange", hashId);
|
|
@@ -10208,14 +9178,14 @@ var WaykeComposite = ({
|
|
|
10208
9178
|
}
|
|
10209
9179
|
}, [hashId]);
|
|
10210
9180
|
const id = pathId || hashId;
|
|
10211
|
-
return /* @__PURE__ */
|
|
9181
|
+
return /* @__PURE__ */ React92.createElement(React92.Fragment, null, id ? /* @__PURE__ */ React92.createElement(searchItem_default, {
|
|
10212
9182
|
id,
|
|
10213
9183
|
hashRoute: !pathRoute,
|
|
10214
9184
|
disableResetScrollOnInit,
|
|
10215
9185
|
placeholderImage,
|
|
10216
9186
|
pathRoute,
|
|
10217
9187
|
modifyDocumentTitleItem
|
|
10218
|
-
}) : /* @__PURE__ */
|
|
9188
|
+
}) : /* @__PURE__ */ React92.createElement(search_default, {
|
|
10219
9189
|
filterList,
|
|
10220
9190
|
initialQueryParams,
|
|
10221
9191
|
removeSearchBar,
|
|
@@ -10229,15 +9199,15 @@ var WaykeComposite = ({
|
|
|
10229
9199
|
var WaykeComposite_default = WaykeComposite;
|
|
10230
9200
|
|
|
10231
9201
|
// src/layouts/WaykeCompositeWithProvider.tsx
|
|
10232
|
-
var WaykeCompositeWithProvider = ({ provider, composite }) => /* @__PURE__ */
|
|
9202
|
+
var WaykeCompositeWithProvider = ({ provider, composite }) => /* @__PURE__ */ React93.createElement(WaykeProvider_default, {
|
|
10233
9203
|
...provider
|
|
10234
|
-
}, /* @__PURE__ */
|
|
9204
|
+
}, /* @__PURE__ */ React93.createElement(WaykeComposite_default, {
|
|
10235
9205
|
...composite
|
|
10236
9206
|
}));
|
|
10237
9207
|
var WaykeCompositeWithProvider_default = WaykeCompositeWithProvider;
|
|
10238
9208
|
|
|
10239
9209
|
// src/providers/WaykeItemProvidet.tsx
|
|
10240
|
-
import
|
|
9210
|
+
import React94 from "react";
|
|
10241
9211
|
var WaykeItemProvider = ({
|
|
10242
9212
|
url,
|
|
10243
9213
|
urlMlt,
|
|
@@ -10249,17 +9219,17 @@ var WaykeItemProvider = ({
|
|
|
10249
9219
|
children
|
|
10250
9220
|
}) => {
|
|
10251
9221
|
useEcom_default(ecomSettings);
|
|
10252
|
-
return /* @__PURE__ */
|
|
9222
|
+
return /* @__PURE__ */ React94.createElement(PathProvider_default, null, /* @__PURE__ */ React94.createElement(SettingsProvider_default, {
|
|
10253
9223
|
googleMapsApiKey,
|
|
10254
9224
|
googleMapsMarker,
|
|
10255
9225
|
ecomSettings
|
|
10256
|
-
}, /* @__PURE__ */
|
|
9226
|
+
}, /* @__PURE__ */ React94.createElement(CentralStorageProvider_default, null, /* @__PURE__ */ React94.createElement(graphqlProvider_default, {
|
|
10257
9227
|
uri: graphQlUrl
|
|
10258
|
-
}, /* @__PURE__ */
|
|
9228
|
+
}, /* @__PURE__ */ React94.createElement(RelatedSearchProvider_default, {
|
|
10259
9229
|
url,
|
|
10260
9230
|
urlMlt,
|
|
10261
9231
|
apiKey
|
|
10262
|
-
}, /* @__PURE__ */
|
|
9232
|
+
}, /* @__PURE__ */ React94.createElement(themeProvider_default, null, /* @__PURE__ */ React94.createElement(Root_default, null, children)))))));
|
|
10263
9233
|
};
|
|
10264
9234
|
var WaykeItemProvidet_default = WaykeItemProvider;
|
|
10265
9235
|
|