@websolutespa/bom-mixer-ui 1.8.4 → 1.8.5

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/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @websolutespa/bom-mixer-ui
2
2
 
3
+ ## 1.8.5
4
+
5
+ ### Patch Changes
6
+
7
+ - Modified: getImageSrc handling latin1 src
8
+
3
9
  ## 1.8.4
4
10
 
5
11
  ### Patch Changes
package/dist/cjs/index.js CHANGED
@@ -4425,55 +4425,6 @@ const StyledMediaImage = styled__default.default.img`
4425
4425
  user-select: none;
4426
4426
  color: transparent;
4427
4427
  `;
4428
- const MediaImage = _a => {
4429
- var {
4430
- className,
4431
- type,
4432
- loading = 'lazy',
4433
- onLoaded,
4434
- canLoad = true
4435
- } = _a,
4436
- props = __rest(_a, ["className", "type", "loading", "onLoaded", "canLoad"]);
4437
- const theme = React.useContext(styled.ThemeContext);
4438
- if (!theme) {
4439
- throw new Error('MediaImage must be used within ThemeProvider');
4440
- }
4441
- const imageRef = React.useRef(null);
4442
- const classNames = bomCore.getClassNames(className, 'image', props.src && {
4443
- 'image-svg': isSVG(props.src)
4444
- });
4445
- const imageProps = getImageProps(props, theme.mediaQuery);
4446
- React.useEffect(() => {
4447
- if (imageRef.current && canLoad) {
4448
- const image = imageRef.current;
4449
- if (image.complete) {
4450
- if (typeof onLoaded === 'function') {
4451
- onLoaded(imageRef);
4452
- }
4453
- } else {
4454
- const onLoad = () => {
4455
- if (typeof onLoaded === 'function') {
4456
- onLoaded(imageRef);
4457
- }
4458
- };
4459
- image.addEventListener('load', onLoad);
4460
- return () => {
4461
- if (image) {
4462
- image.removeEventListener('load', onLoad);
4463
- }
4464
- };
4465
- }
4466
- }
4467
- return () => {};
4468
- }, [canLoad, onLoaded]);
4469
- return jsxRuntime.jsx(StyledMediaImage, Object.assign({
4470
- ref: imageRef
4471
- }, canLoad ? imageProps : undefined, {
4472
- className: classNames,
4473
- loading: loading,
4474
- draggable: false
4475
- }));
4476
- };
4477
4428
  function getMediaSizes(mediaQuery, ratio, size, maxWidth, maxHeight) {
4478
4429
  if (maxWidth === void 0) {
4479
4430
  maxWidth = Number.POSITIVE_INFINITY;
@@ -4592,6 +4543,20 @@ const BASE_URLS = {
4592
4543
  [bomCore.ImageStrategy.Oven]: bomMixerStore.getRemoteApiUrl('/_image')
4593
4544
  };
4594
4545
  const BASE_URL = BASE_URLS[IMAGE_STRATEGY];
4546
+ function parseUrl(src) {
4547
+ if (src.indexOf('http') === 0) {
4548
+ const url = new URL(src);
4549
+ return url;
4550
+ }
4551
+ const pathname = src.split('/').map(x => encodeURIComponent(x)).join('/');
4552
+ const url = {
4553
+ origin: '',
4554
+ pathname,
4555
+ search: '',
4556
+ href: pathname
4557
+ };
4558
+ return url;
4559
+ }
4595
4560
  function getImageSrc(src, width, ratio, focalX, focalY, quality) {
4596
4561
  if (focalX === void 0) {
4597
4562
  focalX = IMAGE_FOCAL_X;
@@ -4611,23 +4576,20 @@ function getImageSrc(src, width, ratio, focalX, focalY, quality) {
4611
4576
  const {
4612
4577
  origin,
4613
4578
  pathname,
4614
- search
4615
- } = src.indexOf('http') === 0 ? new URL(src) : {
4616
- origin: '',
4617
- pathname: src,
4618
- search: ''
4619
- };
4579
+ search,
4580
+ href
4581
+ } = parseUrl(src);
4620
4582
  const imageResize = ratio !== 0 ? {
4621
4583
  w: width,
4622
4584
  h: Math.round(width / ratio),
4623
4585
  x: focalX,
4624
4586
  y: focalY,
4625
4587
  q: quality,
4626
- src
4588
+ src: href
4627
4589
  } : {
4628
4590
  w: width,
4629
4591
  q: quality,
4630
- src
4592
+ src: href
4631
4593
  };
4632
4594
  const token = bomCore.encryptImageToken(imageResize);
4633
4595
  return `${BASE_URL}${pathname}?origin=${encodeURIComponent(origin)}&search=${encodeURIComponent(search)}&t=${encodeURIComponent(token)}`;
@@ -4639,11 +4601,7 @@ function getImageSrc(src, width, ratio, focalX, focalY, quality) {
4639
4601
  origin,
4640
4602
  pathname,
4641
4603
  search
4642
- } = src.indexOf('http') === 0 ? new URL(src) : {
4643
- origin: '',
4644
- pathname: src,
4645
- search: ''
4646
- };
4604
+ } = parseUrl(src);
4647
4605
  return ratio !== 0 ? `${BASE_URL}${pathname}?origin=${encodeURIComponent(origin)}&search=${encodeURIComponent(search)}&w=${width}&h=${Math.round(width / ratio)}&x=${focalX}&y=${focalY}&q=${quality}` : `${BASE_URL}${pathname}?origin=${encodeURIComponent(origin)}&search=${encodeURIComponent(search)}&w=${width}&x=${focalX}&y=${focalY}&q=${quality}`;
4648
4606
  }
4649
4607
  default:
@@ -4671,6 +4629,56 @@ function getImageSizes(sizes) {
4671
4629
  function isSVG(src) {
4672
4630
  return src.indexOf('.svg') !== -1;
4673
4631
  }
4632
+ const MediaImage_ = _a => {
4633
+ var {
4634
+ className,
4635
+ type,
4636
+ loading = 'lazy',
4637
+ onLoaded,
4638
+ canLoad = true
4639
+ } = _a,
4640
+ props = __rest(_a, ["className", "type", "loading", "onLoaded", "canLoad"]);
4641
+ const theme = React.useContext(styled.ThemeContext);
4642
+ if (!theme) {
4643
+ throw new Error('MediaImage must be used within ThemeProvider');
4644
+ }
4645
+ const imageRef = React.useRef(null);
4646
+ const classNames = bomCore.getClassNames(className, 'image', props.src && {
4647
+ 'image-svg': isSVG(props.src)
4648
+ });
4649
+ const imageProps = getImageProps(props, theme.mediaQuery);
4650
+ React.useEffect(() => {
4651
+ if (imageRef.current && canLoad) {
4652
+ const image = imageRef.current;
4653
+ if (image.complete) {
4654
+ if (typeof onLoaded === 'function') {
4655
+ onLoaded(imageRef);
4656
+ }
4657
+ } else {
4658
+ const onLoad = () => {
4659
+ if (typeof onLoaded === 'function') {
4660
+ onLoaded(imageRef);
4661
+ }
4662
+ };
4663
+ image.addEventListener('load', onLoad);
4664
+ return () => {
4665
+ if (image) {
4666
+ image.removeEventListener('load', onLoad);
4667
+ }
4668
+ };
4669
+ }
4670
+ }
4671
+ return () => {};
4672
+ }, [canLoad, onLoaded]);
4673
+ return jsxRuntime.jsx(StyledMediaImage, Object.assign({
4674
+ ref: imageRef
4675
+ }, canLoad ? imageProps : undefined, {
4676
+ className: classNames,
4677
+ loading: loading,
4678
+ draggable: false
4679
+ }));
4680
+ };
4681
+ const MediaImage = /*#__PURE__*/React.memo(MediaImage_);
4674
4682
 
4675
4683
  const StyledMediaVideo = styled__default.default.video`
4676
4684
  max-width: 100%;
@@ -4689,7 +4697,7 @@ const StyledMediaVideo = styled__default.default.video`
4689
4697
  }
4690
4698
  }
4691
4699
  `;
4692
- const MediaVideo = _a => {
4700
+ const MediaVideo_ = _a => {
4693
4701
  var {
4694
4702
  className,
4695
4703
  onLoaded,
@@ -4744,6 +4752,7 @@ const MediaVideo = _a => {
4744
4752
  })
4745
4753
  }));
4746
4754
  };
4755
+ const MediaVideo = /*#__PURE__*/React.memo(MediaVideo_);
4747
4756
 
4748
4757
  const MediaItem = _ref => {
4749
4758
  let {