@ndla/image-search 10.0.12-alpha.0 → 10.0.14-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 (11) hide show
  1. package/es/ImageMeta.js +2 -2
  2. package/es/ImageSearch.js +2 -2
  3. package/es/ImageSearchResult.js +1 -1
  4. package/es/PreviewImage.js +8 -9
  5. package/es/util/imageUtil.js +2 -2
  6. package/lib/ImageMeta.js +2 -2
  7. package/lib/ImageSearch.js +2 -2
  8. package/lib/ImageSearchResult.js +1 -1
  9. package/lib/PreviewImage.js +8 -9
  10. package/lib/util/imageUtil.js +2 -2
  11. package/package.json +7 -7
package/es/ImageMeta.js CHANGED
@@ -33,10 +33,10 @@ const ImageMeta = _ref => {
33
33
  fileSize,
34
34
  imageDimensions
35
35
  } = _ref;
36
- const dimensions = imageDimensions ? " - ".concat(imageDimensions.width, "x").concat(imageDimensions.height, " px") : "";
36
+ const dimensions = imageDimensions ? ` - ${imageDimensions.width}x${imageDimensions.height} px` : "";
37
37
  return _jsx(StyledDiv, {
38
38
  children: _jsx(StyledSpan, {
39
- children: "".concat(contentType, " - ").concat(prettyBytes(fileSize)).concat(dimensions)
39
+ children: `${contentType} - ${prettyBytes(fileSize)}${dimensions}`
40
40
  })
41
41
  });
42
42
  };
package/es/ImageSearch.js CHANGED
@@ -116,7 +116,7 @@ class ImageSearch extends Component {
116
116
  });
117
117
  onImageSelect(image);
118
118
  if (saveAsMetaImage) {
119
- checkboxAction === null || checkboxAction === void 0 || checkboxAction(image);
119
+ checkboxAction?.(image);
120
120
  }
121
121
  }
122
122
  searchImages(queryObject) {
@@ -208,7 +208,7 @@ class ImageSearch extends Component {
208
208
  checkboxLabel: checkboxLabel
209
209
  }, image.id))
210
210
  }), _jsx(Pager, {
211
- page: page !== null && page !== void 0 ? page : 1,
211
+ page: page ?? 1,
212
212
  pathname: "",
213
213
  lastPage: lastPage,
214
214
  query: queryObject,
package/es/ImageSearchResult.js CHANGED
@@ -36,7 +36,7 @@ export default function ImageSearchResult(_ref) {
36
36
  } = _ref;
37
37
  const active = selectedImage && selectedImage.id === image.id ? "active" : "";
38
38
  return _jsxs("div", {
39
- className: "list-item ".concat(active),
39
+ className: `list-item ${active}`,
40
40
  children: [_jsx("div", {
41
41
  className: "list-item-inner",
42
42
  children: _jsxs(StyledButton, {
package/es/PreviewImage.js CHANGED
@@ -21,7 +21,6 @@ const CheckboxWrapper = /*#__PURE__*/_styled("div", {
21
21
  label: "CheckboxWrapper"
22
22
  })("display:flex;gap:", spacing.small, ";align-items:center;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlByZXZpZXdJbWFnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEJrQyIsImZpbGUiOiJQcmV2aWV3SW1hZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTctcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgeyB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBCdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IHNwYWNpbmcgfSBmcm9tIFwiQG5kbGEvY29yZVwiO1xuaW1wb3J0IHsgQ2hlY2tib3hJdGVtLCBMYWJlbCB9IGZyb20gXCJAbmRsYS9mb3Jtc1wiO1xuaW1wb3J0IHsgSUltYWdlTWV0YUluZm9ybWF0aW9uVjMgfSBmcm9tIFwiQG5kbGEvdHlwZXMtYmFja2VuZC9pbWFnZS1hcGlcIjtcbmltcG9ydCB7IHV1aWQgfSBmcm9tIFwiQG5kbGEvdXRpbFwiO1xuXG5pbXBvcnQgSW1hZ2VNZXRhIGZyb20gXCIuL0ltYWdlTWV0YVwiO1xuaW1wb3J0IHsgZ2V0U3JjU2V0cyB9IGZyb20gXCIuL3V0aWwvaW1hZ2VVdGlsXCI7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIGltYWdlOiBJSW1hZ2VNZXRhSW5mb3JtYXRpb25WMztcbiAgb25TZWxlY3RJbWFnZTogKGltYWdlOiBJSW1hZ2VNZXRhSW5mb3JtYXRpb25WMywgc2F2ZUFzTWV0YUltYWdlOiBib29sZWFuKSA9PiB2b2lkO1xuICB1c2VJbWFnZVRpdGxlOiBzdHJpbmc7XG4gIHNob3dDaGVja2JveDogYm9vbGVhbjtcbiAgY2hlY2tib3hMYWJlbD86IHN0cmluZztcbn1cblxuY29uc3QgQ2hlY2tib3hXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAke3NwYWNpbmcuc21hbGx9O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgUHJldmlld0ltYWdlID0gKHsgaW1hZ2UsIG9uU2VsZWN0SW1hZ2UsIHVzZUltYWdlVGl0bGUsIHNob3dDaGVja2JveCwgY2hlY2tib3hMYWJlbCB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IFtzYXZlQXNNZXRhSW1hZ2UsIHNldFNhdmVBc01ldGFJbWFnZV0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgdGFncyA9IGltYWdlLnRhZ3MudGFncyA/PyBbXTtcbiAgY29uc3QgdGl0bGUgPSBpbWFnZS50aXRsZS50aXRsZSA/PyBcIlwiO1xuICBjb25zdCBhbHRUZXh0ID0gaW1hZ2UuYWx0dGV4dC5hbHR0ZXh0ID8/IFwiXCI7XG4gIGNvbnN0IGNhcHRpb24gPSBpbWFnZS5jYXB0aW9uLmNhcHRpb24gPz8gXCJcIjtcbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNsYXNzTmFtZT1cImltYWdlLXByZXZpZXdcIj5cbiAgICAgIDxkaXYgY2xhc3NOYW1lPVwiaW1hZ2VcIj5cbiAgICAgICAgPGltZ1xuICAgICAgICAgIHJvbGU9XCJwcmVzZW50YXRpb25cIlxuICAgICAgICAgIGFsdD1cInByZXNlbnRhdGlvblwiXG4gICAgICAgICAgc3JjU2V0PXtnZXRTcmNTZXRzKGltYWdlLmltYWdlLmltYWdlVXJsKX1cbiAgICAgICAgICBzaXplcz1cIihtaW4td2lkdGg6IDgwMHB4KSAzNjBweCwgKG1pbi13aWR0aDogNDAwcHgpIDMwMHB4LCAxMDB2d1wiXG4gICAgICAgICAgc3JjPXtpbWFnZS5pbWFnZS5pbWFnZVVybH1cbiAgICAgICAgICBhcmlhLWxhYmVsPXt0aXRsZX1cbiAgICAgICAgLz5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjbGFzc05hbWU9XCJpbmZvcm1hdGlvblwiPlxuICAgICAgICA8aDIgY2xhc3NOYW1lPVwidGl0bGVcIj57dGl0bGV9PC9oMj5cbiAgICAgICAge2ltYWdlLmNvcHlyaWdodC5jcmVhdG9ycyAmJiBpbWFnZS5jb3B5cmlnaHQuY3JlYXRvcnMubGVuZ3RoID4gMCA/IChcbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cImNvcHlyaWdodC1hdXRob3JcIj5cbiAgICAgICAgICAgIDxzcGFuIGNsYXNzTmFtZT1cInRleHRcIj57aW1hZ2UuY29weXJpZ2h0LmNyZWF0b3JzLm1hcCgoY3JlYXRvcikgPT4gY3JlYXRvci5uYW1lKS5qb2luKFwiLCBcIil9PC9zcGFuPlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICApIDogbnVsbH1cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJpbmZvXCI+XG4gICAgICAgICAgPHNwYW4gY2xhc3NOYW1lPVwidGV4dFwiPntpbWFnZS5jb3B5cmlnaHQubGljZW5zZS5kZXNjcmlwdGlvbn08L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cImluZm9cIj5cbiAgICAgICAgICA8c3BhbiBjbGFzc05hbWU9XCJ0ZXh0XCI+e2Ake3QoXCJpbWFnZS5jYXB0aW9uXCIpfTogJHtjYXB0aW9ufWB9PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJpbmZvXCI+XG4gICAgICAgICAgPHNwYW4gY2xhc3NOYW1lPVwidGV4dFwiPntgJHt0KFwiaW1hZ2UuYWx0VGV4dFwiKX06ICR7YWx0VGV4dH1gfTwvc3Bhbj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPVwiaW5mb1wiPlxuICAgICAgICAgIDxzcGFuIGNsYXNzTmFtZT1cInRleHRcIj57YCR7dChcImltYWdlLm1vZGVsUmVsZWFzZWQubGFiZWxcIil9OiAke3QoXG4gICAgICAgICAgICBgaW1hZ2UubW9kZWxSZWxlYXNlZC4ke2ltYWdlLm1vZGVsUmVsZWFzZX1gLFxuICAgICAgICAgICl9YH08L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8SW1hZ2VNZXRhXG4gICAgICAgICAgY29udGVudFR5cGU9e2ltYWdlLmltYWdlLmNvbnRlbnRUeXBlfVxuICAgICAgICAgIGZpbGVTaXplPXtpbWFnZS5pbWFnZS5zaXplfVxuICAgICAgICAgIGltYWdlRGltZW5zaW9ucz17aW1hZ2UuaW1hZ2UuZGltZW5zaW9uc31cbiAgICAgICAgLz5cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJ0YWdzXCI+XG4gICAgICAgICAge3RhZ3MubWFwKCh0YWcpID0+IChcbiAgICAgICAgICAgIDxzcGFuIGtleT17dXVpZCgpfSBjbGFzc05hbWU9XCJ0YWdfaXRlbVwiPntgIyR7dGFnfWB9PC9zcGFuPlxuICAgICAgICAgICkpfVxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPEJ1dHRvblYyIGRhdGEtdGVzdGlkPVwidXNlLWltYWdlXCIgb25DbGljaz17KCkgPT4gb25TZWxlY3RJbWFnZShpbWFnZSwgc2F2ZUFzTWV0YUltYWdlKX0+XG4gICAgICAgICAge3VzZUltYWdlVGl0bGV9XG4gICAgICAgIDwvQnV0dG9uVjI+XG4gICAgICAgIHtzaG93Q2hlY2tib3ggJiYgKFxuICAgICAgICAgIDxDaGVja2JveFdyYXBwZXI+XG4gICAgICAgICAgICA8Q2hlY2tib3hJdGVtXG4gICAgICAgICAgICAgIGlkPVwic2F2ZUFzTWV0YVwiXG4gICAgICAgICAgICAgIGNoZWNrZWQ9e3NhdmVBc01ldGFJbWFnZX1cbiAgICAgICAgICAgICAgb25DaGVja2VkQ2hhbmdlPXsoKSA9PiBzZXRTYXZlQXNNZXRhSW1hZ2UoKHByZXYpID0+ICFwcmV2KX1cbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8TGFiZWwgaHRtbEZvcj1cInNhdmVBc01ldGFcIiB0ZXh0U3R5bGU9XCJsYWJlbC1zbWFsbFwiIG1hcmdpbj1cIm5vbmVcIj5cbiAgICAgICAgICAgICAge2NoZWNrYm94TGFiZWx9XG4gICAgICAgICAgICA8L0xhYmVsPlxuICAgICAgICAgIDwvQ2hlY2tib3hXcmFwcGVyPlxuICAgICAgICApfVxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzTmFtZT1cImNsZWFyXCIgLz5cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFByZXZpZXdJbWFnZTtcbiJdfQ== */"));
23
23
  const PreviewImage = _ref => {
24
- var _image$tags$tags, _image$title$title, _image$alttext$alttex, _image$caption$captio;
25
24
  let {
26
25
  image,
27
26
  onSelectImage,
@@ -33,10 +32,10 @@ const PreviewImage = _ref => {
33
32
  t
34
33
  } = useTranslation();
35
34
  const [saveAsMetaImage, setSaveAsMetaImage] = useState(false);
36
- const tags = (_image$tags$tags = image.tags.tags) !== null && _image$tags$tags !== void 0 ? _image$tags$tags : [];
37
- const title = (_image$title$title = image.title.title) !== null && _image$title$title !== void 0 ? _image$title$title : "";
38
- const altText = (_image$alttext$alttex = image.alttext.alttext) !== null && _image$alttext$alttex !== void 0 ? _image$alttext$alttex : "";
39
- const caption = (_image$caption$captio = image.caption.caption) !== null && _image$caption$captio !== void 0 ? _image$caption$captio : "";
35
+ const tags = image.tags.tags ?? [];
36
+ const title = image.title.title ?? "";
37
+ const altText = image.alttext.alttext ?? "";
38
+ const caption = image.caption.caption ?? "";
40
39
  return _jsxs("div", {
41
40
  className: "image-preview",
42
41
  children: [_jsx("div", {
@@ -70,19 +69,19 @@ const PreviewImage = _ref => {
70
69
  className: "info",
71
70
  children: _jsx("span", {
72
71
  className: "text",
73
- children: "".concat(t("image.caption"), ": ").concat(caption)
72
+ children: `${t("image.caption")}: ${caption}`
74
73
  })
75
74
  }), _jsx("div", {
76
75
  className: "info",
77
76
  children: _jsx("span", {
78
77
  className: "text",
79
- children: "".concat(t("image.altText"), ": ").concat(altText)
78
+ children: `${t("image.altText")}: ${altText}`
80
79
  })
81
80
  }), _jsx("div", {
82
81
  className: "info",
83
82
  children: _jsx("span", {
84
83
  className: "text",
85
- children: "".concat(t("image.modelReleased.label"), ": ").concat(t("image.modelReleased.".concat(image.modelRelease)))
84
+ children: `${t("image.modelReleased.label")}: ${t(`image.modelReleased.${image.modelRelease}`)}`
86
85
  })
87
86
  }), _jsx(ImageMeta, {
88
87
  contentType: image.image.contentType,
@@ -92,7 +91,7 @@ const PreviewImage = _ref => {
92
91
  className: "tags",
93
92
  children: tags.map(tag => _jsx("span", {
94
93
  className: "tag_item",
95
- children: "#".concat(tag)
94
+ children: `#${tag}`
96
95
  }, uuid()))
97
96
  }), _jsx(ButtonV2, {
98
97
  "data-testid": "use-image",
package/es/util/imageUtil.js CHANGED
@@ -9,5 +9,5 @@
9
9
  /* - Source sets for gallery search is retina-display optimized
10
10
  - Based on: https://www.smashingmagazine.com/2014/05/responsive-images-done-right-guide-picture-srcset/ */
11
11
 
12
- export const getSrcSets = imageUrl => ["".concat(imageUrl, "?width=1440 1440w"), "".concat(imageUrl, "?width=1120 1120w"), "".concat(imageUrl, "?width=1000 1000w"), "".concat(imageUrl, "?width=960 960w"), "".concat(imageUrl, "?width=800 800w"), "".concat(imageUrl, "?width=640 640w"), "".concat(imageUrl, "?width=480 480w"), "".concat(imageUrl, "?width=320 320w")].join(", ");
13
- export const getPreviewSrcSets = imageUrl => ["".concat(imageUrl, "?width=480 3x"), "".concat(imageUrl, "?width=320 2x"), "".concat(imageUrl, "?width=160 1x")].join(", ");
12
+ export const getSrcSets = imageUrl => [`${imageUrl}?width=1440 1440w`, `${imageUrl}?width=1120 1120w`, `${imageUrl}?width=1000 1000w`, `${imageUrl}?width=960 960w`, `${imageUrl}?width=800 800w`, `${imageUrl}?width=640 640w`, `${imageUrl}?width=480 480w`, `${imageUrl}?width=320 320w`].join(", ");
13
+ export const getPreviewSrcSets = imageUrl => [`${imageUrl}?width=480 3x`, `${imageUrl}?width=320 2x`, `${imageUrl}?width=160 1x`].join(", ");
package/lib/ImageMeta.js CHANGED
@@ -38,10 +38,10 @@ const ImageMeta = _ref => {
38
38
  fileSize,
39
39
  imageDimensions
40
40
  } = _ref;
41
- const dimensions = imageDimensions ? " - ".concat(imageDimensions.width, "x").concat(imageDimensions.height, " px") : "";
41
+ const dimensions = imageDimensions ? ` - ${imageDimensions.width}x${imageDimensions.height} px` : "";
42
42
  return (0, _jsxRuntime.jsx)(StyledDiv, {
43
43
  children: (0, _jsxRuntime.jsx)(StyledSpan, {
44
- children: "".concat(contentType, " - ").concat((0, _prettyBytes.default)(fileSize)).concat(dimensions)
44
+ children: `${contentType} - ${(0, _prettyBytes.default)(fileSize)}${dimensions}`
45
45
  })
46
46
  });
47
47
  };
package/lib/ImageSearch.js CHANGED
@@ -121,7 +121,7 @@ class ImageSearch extends _react.Component {
121
121
  });
122
122
  onImageSelect(image);
123
123
  if (saveAsMetaImage) {
124
- checkboxAction === null || checkboxAction === void 0 || checkboxAction(image);
124
+ checkboxAction?.(image);
125
125
  }
126
126
  }
127
127
  searchImages(queryObject) {
@@ -213,7 +213,7 @@ class ImageSearch extends _react.Component {
213
213
  checkboxLabel: checkboxLabel
214
214
  }, image.id))
215
215
  }), (0, _jsxRuntime.jsx)(_pager.Pager, {
216
- page: page !== null && page !== void 0 ? page : 1,
216
+ page: page ?? 1,
217
217
  pathname: "",
218
218
  lastPage: lastPage,
219
219
  query: queryObject,
package/lib/ImageSearchResult.js CHANGED
@@ -41,7 +41,7 @@ function ImageSearchResult(_ref) {
41
41
  } = _ref;
42
42
  const active = selectedImage && selectedImage.id === image.id ? "active" : "";
43
43
  return (0, _jsxRuntime.jsxs)("div", {
44
- className: "list-item ".concat(active),
44
+ className: `list-item ${active}`,
45
45
  children: [(0, _jsxRuntime.jsx)("div", {
46
46
  className: "list-item-inner",
47
47
  children: (0, _jsxRuntime.jsxs)(StyledButton, {
package/lib/PreviewImage.js CHANGED
@@ -28,7 +28,6 @@ const CheckboxWrapper = /*#__PURE__*/(0, _base.default)("div", {
28
28
  label: "CheckboxWrapper"
29
29
  })("display:flex;gap:", _core.spacing.small, ";align-items:center;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlByZXZpZXdJbWFnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEJrQyIsImZpbGUiOiJQcmV2aWV3SW1hZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTctcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgeyB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tIFwicmVhY3QtaTE4bmV4dFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBCdXR0b25WMiB9IGZyb20gXCJAbmRsYS9idXR0b25cIjtcbmltcG9ydCB7IHNwYWNpbmcgfSBmcm9tIFwiQG5kbGEvY29yZVwiO1xuaW1wb3J0IHsgQ2hlY2tib3hJdGVtLCBMYWJlbCB9IGZyb20gXCJAbmRsYS9mb3Jtc1wiO1xuaW1wb3J0IHsgSUltYWdlTWV0YUluZm9ybWF0aW9uVjMgfSBmcm9tIFwiQG5kbGEvdHlwZXMtYmFja2VuZC9pbWFnZS1hcGlcIjtcbmltcG9ydCB7IHV1aWQgfSBmcm9tIFwiQG5kbGEvdXRpbFwiO1xuXG5pbXBvcnQgSW1hZ2VNZXRhIGZyb20gXCIuL0ltYWdlTWV0YVwiO1xuaW1wb3J0IHsgZ2V0U3JjU2V0cyB9IGZyb20gXCIuL3V0aWwvaW1hZ2VVdGlsXCI7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIGltYWdlOiBJSW1hZ2VNZXRhSW5mb3JtYXRpb25WMztcbiAgb25TZWxlY3RJbWFnZTogKGltYWdlOiBJSW1hZ2VNZXRhSW5mb3JtYXRpb25WMywgc2F2ZUFzTWV0YUltYWdlOiBib29sZWFuKSA9PiB2b2lkO1xuICB1c2VJbWFnZVRpdGxlOiBzdHJpbmc7XG4gIHNob3dDaGVja2JveDogYm9vbGVhbjtcbiAgY2hlY2tib3hMYWJlbD86IHN0cmluZztcbn1cblxuY29uc3QgQ2hlY2tib3hXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAke3NwYWNpbmcuc21hbGx9O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuYDtcblxuY29uc3QgUHJldmlld0ltYWdlID0gKHsgaW1hZ2UsIG9uU2VsZWN0SW1hZ2UsIHVzZUltYWdlVGl0bGUsIHNob3dDaGVja2JveCwgY2hlY2tib3hMYWJlbCB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IFtzYXZlQXNNZXRhSW1hZ2UsIHNldFNhdmVBc01ldGFJbWFnZV0gPSB1c2VTdGF0ZShmYWxzZSk7XG5cbiAgY29uc3QgdGFncyA9IGltYWdlLnRhZ3MudGFncyA/PyBbXTtcbiAgY29uc3QgdGl0bGUgPSBpbWFnZS50aXRsZS50aXRsZSA/PyBcIlwiO1xuICBjb25zdCBhbHRUZXh0ID0gaW1hZ2UuYWx0dGV4dC5hbHR0ZXh0ID8/IFwiXCI7XG4gIGNvbnN0IGNhcHRpb24gPSBpbWFnZS5jYXB0aW9uLmNhcHRpb24gPz8gXCJcIjtcbiAgcmV0dXJuIChcbiAgICA8ZGl2IGNsYXNzTmFtZT1cImltYWdlLXByZXZpZXdcIj5cbiAgICAgIDxkaXYgY2xhc3NOYW1lPVwiaW1hZ2VcIj5cbiAgICAgICAgPGltZ1xuICAgICAgICAgIHJvbGU9XCJwcmVzZW50YXRpb25cIlxuICAgICAgICAgIGFsdD1cInByZXNlbnRhdGlvblwiXG4gICAgICAgICAgc3JjU2V0PXtnZXRTcmNTZXRzKGltYWdlLmltYWdlLmltYWdlVXJsKX1cbiAgICAgICAgICBzaXplcz1cIihtaW4td2lkdGg6IDgwMHB4KSAzNjBweCwgKG1pbi13aWR0aDogNDAwcHgpIDMwMHB4LCAxMDB2d1wiXG4gICAgICAgICAgc3JjPXtpbWFnZS5pbWFnZS5pbWFnZVVybH1cbiAgICAgICAgICBhcmlhLWxhYmVsPXt0aXRsZX1cbiAgICAgICAgLz5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBjbGFzc05hbWU9XCJpbmZvcm1hdGlvblwiPlxuICAgICAgICA8aDIgY2xhc3NOYW1lPVwidGl0bGVcIj57dGl0bGV9PC9oMj5cbiAgICAgICAge2ltYWdlLmNvcHlyaWdodC5jcmVhdG9ycyAmJiBpbWFnZS5jb3B5cmlnaHQuY3JlYXRvcnMubGVuZ3RoID4gMCA/IChcbiAgICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cImNvcHlyaWdodC1hdXRob3JcIj5cbiAgICAgICAgICAgIDxzcGFuIGNsYXNzTmFtZT1cInRleHRcIj57aW1hZ2UuY29weXJpZ2h0LmNyZWF0b3JzLm1hcCgoY3JlYXRvcikgPT4gY3JlYXRvci5uYW1lKS5qb2luKFwiLCBcIil9PC9zcGFuPlxuICAgICAgICAgIDwvZGl2PlxuICAgICAgICApIDogbnVsbH1cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJpbmZvXCI+XG4gICAgICAgICAgPHNwYW4gY2xhc3NOYW1lPVwidGV4dFwiPntpbWFnZS5jb3B5cmlnaHQubGljZW5zZS5kZXNjcmlwdGlvbn08L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzTmFtZT1cImluZm9cIj5cbiAgICAgICAgICA8c3BhbiBjbGFzc05hbWU9XCJ0ZXh0XCI+e2Ake3QoXCJpbWFnZS5jYXB0aW9uXCIpfTogJHtjYXB0aW9ufWB9PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJpbmZvXCI+XG4gICAgICAgICAgPHNwYW4gY2xhc3NOYW1lPVwidGV4dFwiPntgJHt0KFwiaW1hZ2UuYWx0VGV4dFwiKX06ICR7YWx0VGV4dH1gfTwvc3Bhbj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3NOYW1lPVwiaW5mb1wiPlxuICAgICAgICAgIDxzcGFuIGNsYXNzTmFtZT1cInRleHRcIj57YCR7dChcImltYWdlLm1vZGVsUmVsZWFzZWQubGFiZWxcIil9OiAke3QoXG4gICAgICAgICAgICBgaW1hZ2UubW9kZWxSZWxlYXNlZC4ke2ltYWdlLm1vZGVsUmVsZWFzZX1gLFxuICAgICAgICAgICl9YH08L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8SW1hZ2VNZXRhXG4gICAgICAgICAgY29udGVudFR5cGU9e2ltYWdlLmltYWdlLmNvbnRlbnRUeXBlfVxuICAgICAgICAgIGZpbGVTaXplPXtpbWFnZS5pbWFnZS5zaXplfVxuICAgICAgICAgIGltYWdlRGltZW5zaW9ucz17aW1hZ2UuaW1hZ2UuZGltZW5zaW9uc31cbiAgICAgICAgLz5cbiAgICAgICAgPGRpdiBjbGFzc05hbWU9XCJ0YWdzXCI+XG4gICAgICAgICAge3RhZ3MubWFwKCh0YWcpID0+IChcbiAgICAgICAgICAgIDxzcGFuIGtleT17dXVpZCgpfSBjbGFzc05hbWU9XCJ0YWdfaXRlbVwiPntgIyR7dGFnfWB9PC9zcGFuPlxuICAgICAgICAgICkpfVxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPEJ1dHRvblYyIGRhdGEtdGVzdGlkPVwidXNlLWltYWdlXCIgb25DbGljaz17KCkgPT4gb25TZWxlY3RJbWFnZShpbWFnZSwgc2F2ZUFzTWV0YUltYWdlKX0+XG4gICAgICAgICAge3VzZUltYWdlVGl0bGV9XG4gICAgICAgIDwvQnV0dG9uVjI+XG4gICAgICAgIHtzaG93Q2hlY2tib3ggJiYgKFxuICAgICAgICAgIDxDaGVja2JveFdyYXBwZXI+XG4gICAgICAgICAgICA8Q2hlY2tib3hJdGVtXG4gICAgICAgICAgICAgIGlkPVwic2F2ZUFzTWV0YVwiXG4gICAgICAgICAgICAgIGNoZWNrZWQ9e3NhdmVBc01ldGFJbWFnZX1cbiAgICAgICAgICAgICAgb25DaGVja2VkQ2hhbmdlPXsoKSA9PiBzZXRTYXZlQXNNZXRhSW1hZ2UoKHByZXYpID0+ICFwcmV2KX1cbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgICA8TGFiZWwgaHRtbEZvcj1cInNhdmVBc01ldGFcIiB0ZXh0U3R5bGU9XCJsYWJlbC1zbWFsbFwiIG1hcmdpbj1cIm5vbmVcIj5cbiAgICAgICAgICAgICAge2NoZWNrYm94TGFiZWx9XG4gICAgICAgICAgICA8L0xhYmVsPlxuICAgICAgICAgIDwvQ2hlY2tib3hXcmFwcGVyPlxuICAgICAgICApfVxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzTmFtZT1cImNsZWFyXCIgLz5cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFByZXZpZXdJbWFnZTtcbiJdfQ== */"));
30
30
  const PreviewImage = _ref => {
31
- var _image$tags$tags, _image$title$title, _image$alttext$alttex, _image$caption$captio;
32
31
  let {
33
32
  image,
34
33
  onSelectImage,
@@ -40,10 +39,10 @@ const PreviewImage = _ref => {
40
39
  t
41
40
  } = (0, _reactI18next.useTranslation)();
42
41
  const [saveAsMetaImage, setSaveAsMetaImage] = (0, _react.useState)(false);
43
- const tags = (_image$tags$tags = image.tags.tags) !== null && _image$tags$tags !== void 0 ? _image$tags$tags : [];
44
- const title = (_image$title$title = image.title.title) !== null && _image$title$title !== void 0 ? _image$title$title : "";
45
- const altText = (_image$alttext$alttex = image.alttext.alttext) !== null && _image$alttext$alttex !== void 0 ? _image$alttext$alttex : "";
46
- const caption = (_image$caption$captio = image.caption.caption) !== null && _image$caption$captio !== void 0 ? _image$caption$captio : "";
42
+ const tags = image.tags.tags ?? [];
43
+ const title = image.title.title ?? "";
44
+ const altText = image.alttext.alttext ?? "";
45
+ const caption = image.caption.caption ?? "";
47
46
  return (0, _jsxRuntime.jsxs)("div", {
48
47
  className: "image-preview",
49
48
  children: [(0, _jsxRuntime.jsx)("div", {
@@ -77,19 +76,19 @@ const PreviewImage = _ref => {
77
76
  className: "info",
78
77
  children: (0, _jsxRuntime.jsx)("span", {
79
78
  className: "text",
80
- children: "".concat(t("image.caption"), ": ").concat(caption)
79
+ children: `${t("image.caption")}: ${caption}`
81
80
  })
82
81
  }), (0, _jsxRuntime.jsx)("div", {
83
82
  className: "info",
84
83
  children: (0, _jsxRuntime.jsx)("span", {
85
84
  className: "text",
86
- children: "".concat(t("image.altText"), ": ").concat(altText)
85
+ children: `${t("image.altText")}: ${altText}`
87
86
  })
88
87
  }), (0, _jsxRuntime.jsx)("div", {
89
88
  className: "info",
90
89
  children: (0, _jsxRuntime.jsx)("span", {
91
90
  className: "text",
92
- children: "".concat(t("image.modelReleased.label"), ": ").concat(t("image.modelReleased.".concat(image.modelRelease)))
91
+ children: `${t("image.modelReleased.label")}: ${t(`image.modelReleased.${image.modelRelease}`)}`
93
92
  })
94
93
  }), (0, _jsxRuntime.jsx)(_ImageMeta.default, {
95
94
  contentType: image.image.contentType,
@@ -99,7 +98,7 @@ const PreviewImage = _ref => {
99
98
  className: "tags",
100
99
  children: tags.map(tag => (0, _jsxRuntime.jsx)("span", {
101
100
  className: "tag_item",
102
- children: "#".concat(tag)
101
+ children: `#${tag}`
103
102
  }, (0, _util.uuid)()))
104
103
  }), (0, _jsxRuntime.jsx)(_button.ButtonV2, {
105
104
  "data-testid": "use-image",
package/lib/util/imageUtil.js CHANGED
@@ -15,7 +15,7 @@ exports.getSrcSets = exports.getPreviewSrcSets = void 0;
15
15
  /* - Source sets for gallery search is retina-display optimized
16
16
  - Based on: https://www.smashingmagazine.com/2014/05/responsive-images-done-right-guide-picture-srcset/ */
17
17
 
18
- const getSrcSets = imageUrl => ["".concat(imageUrl, "?width=1440 1440w"), "".concat(imageUrl, "?width=1120 1120w"), "".concat(imageUrl, "?width=1000 1000w"), "".concat(imageUrl, "?width=960 960w"), "".concat(imageUrl, "?width=800 800w"), "".concat(imageUrl, "?width=640 640w"), "".concat(imageUrl, "?width=480 480w"), "".concat(imageUrl, "?width=320 320w")].join(", ");
18
+ const getSrcSets = imageUrl => [`${imageUrl}?width=1440 1440w`, `${imageUrl}?width=1120 1120w`, `${imageUrl}?width=1000 1000w`, `${imageUrl}?width=960 960w`, `${imageUrl}?width=800 800w`, `${imageUrl}?width=640 640w`, `${imageUrl}?width=480 480w`, `${imageUrl}?width=320 320w`].join(", ");
19
19
  exports.getSrcSets = getSrcSets;
20
- const getPreviewSrcSets = imageUrl => ["".concat(imageUrl, "?width=480 3x"), "".concat(imageUrl, "?width=320 2x"), "".concat(imageUrl, "?width=160 1x")].join(", ");
20
+ const getPreviewSrcSets = imageUrl => [`${imageUrl}?width=480 3x`, `${imageUrl}?width=320 2x`, `${imageUrl}?width=160 1x`].join(", ");
21
21
  exports.getPreviewSrcSets = getPreviewSrcSets;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ndla/image-search",
3
- "version": "10.0.12-alpha.0",
3
+ "version": "10.0.14-alpha.0",
4
4
  "description": "A simple library for searching images from NDLA",
5
5
  "license": "GPL-3.0",
6
6
  "main": "lib/index.js",
@@ -26,12 +26,12 @@
26
26
  "es"
27
27
  ],
28
28
  "dependencies": {
29
- "@ndla/button": "^14.0.5-alpha.0",
29
+ "@ndla/button": "^14.0.7-alpha.0",
30
30
  "@ndla/core": "^5.0.1",
31
- "@ndla/forms": "^9.0.5-alpha.0",
32
- "@ndla/icons": "^7.0.6-alpha.0",
33
- "@ndla/pager": "^3.0.21",
34
- "@ndla/ui": "^55.0.12-alpha.0",
31
+ "@ndla/forms": "^9.0.7-alpha.0",
32
+ "@ndla/icons": "^7.0.8-alpha.0",
33
+ "@ndla/pager": "^4.0.1-alpha.0",
34
+ "@ndla/ui": "^55.0.14-alpha.0",
35
35
  "@ndla/util": "^4.1.0",
36
36
  "pretty-bytes": "^5.6.0"
37
37
  },
@@ -50,5 +50,5 @@
50
50
  "publishConfig": {
51
51
  "access": "public"
52
52
  },
53
- "gitHead": "8c3254246b993068a867ab9ec9594347d5ebf439"
53
+ "gitHead": "6fdfbed9f18bbd725c837fb74de2f093e80d5605"
54
54
  }