@contentful/field-editor-reference 6.15.1 → 6.16.0-alpha.0

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.
Files changed (5) hide show
  1. package/dist/cjs/assets/WrappedAssetCard/WrappedAssetCard.js +18 -2
  2. package/dist/cjs/components/AssetThumbnail/AssetThumbnail.js +3 -1
  3. package/dist/esm/assets/WrappedAssetCard/WrappedAssetCard.js +18 -2
  4. package/dist/esm/components/AssetThumbnail/AssetThumbnail.js +3 -1
  5. package/package.json +3 -3
package/dist/cjs/assets/WrappedAssetCard/WrappedAssetCard.js CHANGED
@@ -88,6 +88,23 @@ function getFileType(file) {
88
88
  }
89
89
  const WrappedAssetCard = ({ asset, className, size, localeCode, defaultLocaleCode, activeLocales, localesStatusMap, isDisabled, isSelected, isClickable, useLocalizedEntityStatus, renderDragHandle, getEntityScheduledActions, onEdit, getAssetUrl, onRemove, releaseEntityStatus, releaseStatusMap, release })=>{
90
90
  const status = _fieldeditorshared.entityHelpers.getEntityStatus(asset.sys, useLocalizedEntityStatus ? localeCode : undefined);
91
+ const entityFile = asset.fields.file ? asset.fields.file[localeCode] || asset.fields.file[defaultLocaleCode] : undefined;
92
+ const imageUrl = _react.useMemo(()=>{
93
+ if (!entityFile?.url) return '';
94
+ if (size === 'small') {
95
+ return _fieldeditorshared.entityHelpers.getResolvedImageUrl(entityFile.url, {
96
+ width: 150,
97
+ height: 150,
98
+ fit: 'thumb'
99
+ });
100
+ }
101
+ return _fieldeditorshared.entityHelpers.getResolvedImageUrl(entityFile.url, {
102
+ height: 300
103
+ });
104
+ }, [
105
+ entityFile?.url,
106
+ size
107
+ ]);
91
108
  if (status === 'deleted') {
92
109
  return /*#__PURE__*/ _react.createElement(_components.MissingAssetCard, {
93
110
  asSquare: true,
@@ -101,7 +118,6 @@ const WrappedAssetCard = ({ asset, className, size, localeCode, defaultLocaleCod
101
118
  defaultLocaleCode: defaultLocaleCode,
102
119
  defaultTitle: 'Untitled'
103
120
  });
104
- const entityFile = asset.fields.file ? asset.fields.file[localeCode] || asset.fields.file[defaultLocaleCode] : undefined;
105
121
  const href = getAssetUrl ? getAssetUrl(asset.sys.id) : undefined;
106
122
  return /*#__PURE__*/ _react.createElement(_f36components.AssetCard, {
107
123
  as: isClickable && href ? 'a' : 'article',
@@ -122,7 +138,7 @@ const WrappedAssetCard = ({ asset, className, size, localeCode, defaultLocaleCod
122
138
  releaseStatusMap: releaseStatusMap,
123
139
  release: release
124
140
  }),
125
- src: entityFile && entityFile.url ? size === 'small' ? `${entityFile.url}?w=150&h=150&fit=thumb` : `${entityFile.url}?h=300` : '',
141
+ src: imageUrl,
126
142
  onClick: isClickable ? (e)=>{
127
143
  e.preventDefault();
128
144
  onEdit && onEdit();
package/dist/cjs/components/AssetThumbnail/AssetThumbnail.js CHANGED
@@ -9,6 +9,7 @@ Object.defineProperty(exports, "AssetThumbnail", {
9
9
  }
10
10
  });
11
11
  const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
12
+ const _fieldeditorshared = require("@contentful/field-editor-shared");
12
13
  function _getRequireWildcardCache(nodeInterop) {
13
14
  if (typeof WeakMap !== "function") return null;
14
15
  var cacheBabelInterop = new WeakMap();
@@ -55,9 +56,10 @@ const dimensions = {
55
56
  height: 70
56
57
  };
57
58
  function AssetThumbnail(props) {
59
+ const thumbnailUrl = _fieldeditorshared.entityHelpers.getResolvedImageUrl(props.file.url, dimensions);
58
60
  return /*#__PURE__*/ _react.createElement("img", {
59
61
  alt: props.file.fileName,
60
- src: `${props.file.url}?w=${dimensions.width}&h=${dimensions.height}&fit=thumb`,
62
+ src: thumbnailUrl,
61
63
  height: dimensions.height,
62
64
  width: dimensions.width
63
65
  });
package/dist/esm/assets/WrappedAssetCard/WrappedAssetCard.js CHANGED
@@ -32,6 +32,23 @@ function getFileType(file) {
32
32
  }
33
33
  export const WrappedAssetCard = ({ asset, className, size, localeCode, defaultLocaleCode, activeLocales, localesStatusMap, isDisabled, isSelected, isClickable, useLocalizedEntityStatus, renderDragHandle, getEntityScheduledActions, onEdit, getAssetUrl, onRemove, releaseEntityStatus, releaseStatusMap, release })=>{
34
34
  const status = entityHelpers.getEntityStatus(asset.sys, useLocalizedEntityStatus ? localeCode : undefined);
35
+ const entityFile = asset.fields.file ? asset.fields.file[localeCode] || asset.fields.file[defaultLocaleCode] : undefined;
36
+ const imageUrl = React.useMemo(()=>{
37
+ if (!entityFile?.url) return '';
38
+ if (size === 'small') {
39
+ return entityHelpers.getResolvedImageUrl(entityFile.url, {
40
+ width: 150,
41
+ height: 150,
42
+ fit: 'thumb'
43
+ });
44
+ }
45
+ return entityHelpers.getResolvedImageUrl(entityFile.url, {
46
+ height: 300
47
+ });
48
+ }, [
49
+ entityFile?.url,
50
+ size
51
+ ]);
35
52
  if (status === 'deleted') {
36
53
  return /*#__PURE__*/ React.createElement(MissingAssetCard, {
37
54
  asSquare: true,
@@ -45,7 +62,6 @@ export const WrappedAssetCard = ({ asset, className, size, localeCode, defaultLo
45
62
  defaultLocaleCode: defaultLocaleCode,
46
63
  defaultTitle: 'Untitled'
47
64
  });
48
- const entityFile = asset.fields.file ? asset.fields.file[localeCode] || asset.fields.file[defaultLocaleCode] : undefined;
49
65
  const href = getAssetUrl ? getAssetUrl(asset.sys.id) : undefined;
50
66
  return /*#__PURE__*/ React.createElement(AssetCard, {
51
67
  as: isClickable && href ? 'a' : 'article',
@@ -66,7 +82,7 @@ export const WrappedAssetCard = ({ asset, className, size, localeCode, defaultLo
66
82
  releaseStatusMap: releaseStatusMap,
67
83
  release: release
68
84
  }),
69
- src: entityFile && entityFile.url ? size === 'small' ? `${entityFile.url}?w=150&h=150&fit=thumb` : `${entityFile.url}?h=300` : '',
85
+ src: imageUrl,
70
86
  onClick: isClickable ? (e)=>{
71
87
  e.preventDefault();
72
88
  onEdit && onEdit();
package/dist/esm/components/AssetThumbnail/AssetThumbnail.js CHANGED
@@ -1,12 +1,14 @@
1
1
  import * as React from 'react';
2
+ import { entityHelpers } from '@contentful/field-editor-shared';
2
3
  const dimensions = {
3
4
  width: 70,
4
5
  height: 70
5
6
  };
6
7
  export function AssetThumbnail(props) {
8
+ const thumbnailUrl = entityHelpers.getResolvedImageUrl(props.file.url, dimensions);
7
9
  return /*#__PURE__*/ React.createElement("img", {
8
10
  alt: props.file.fileName,
9
- src: `${props.file.url}?w=${dimensions.width}&h=${dimensions.height}&fit=thumb`,
11
+ src: thumbnailUrl,
10
12
  height: dimensions.height,
11
13
  width: dimensions.width
12
14
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contentful/field-editor-reference",
3
- "version": "6.15.1",
3
+ "version": "6.16.0-alpha.0",
4
4
  "main": "dist/cjs/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/types/index.d.ts",
@@ -39,7 +39,7 @@
39
39
  "@contentful/f36-components": "^5.4.1",
40
40
  "@contentful/f36-icons": "^5.4.1",
41
41
  "@contentful/f36-tokens": "^5.1.0",
42
- "@contentful/field-editor-shared": "^2.16.0",
42
+ "@contentful/field-editor-shared": "^2.17.0-alpha.0",
43
43
  "@contentful/mimetype": "^2.2.29",
44
44
  "@dnd-kit/core": "^6.0.8",
45
45
  "@dnd-kit/sortable": "^8.0.0",
@@ -68,5 +68,5 @@
68
68
  "publishConfig": {
69
69
  "registry": "https://npm.pkg.github.com/"
70
70
  },
71
- "gitHead": "c29a501efe92281b4a990adc129b78270ce1acff"
71
+ "gitHead": "aae7ea3dcdc2010b1bc8c15a4d6ce3ddba9702e2"
72
72
  }