usePreviewItems.js 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
  2. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  3. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  4. import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
  5. import * as React from 'react';
  6. import { COMMON_PROPS } from "../common";
  7. /**
  8. * Merge props provided `items` or context collected images
  9. */
  10. export default function usePreviewItems(items) {
  11. // Context collection image data
  12. var _React$useState = React.useState({}),
  13. _React$useState2 = _slicedToArray(_React$useState, 2),
  14. images = _React$useState2[0],
  15. setImages = _React$useState2[1];
  16. var registerImage = React.useCallback(function (id, data) {
  17. setImages(function (imgs) {
  18. return _objectSpread(_objectSpread({}, imgs), {}, _defineProperty({}, id, data));
  19. });
  20. return function () {
  21. setImages(function (imgs) {
  22. var cloneImgs = _objectSpread({}, imgs);
  23. delete cloneImgs[id];
  24. return cloneImgs;
  25. });
  26. };
  27. }, []);
  28. // items
  29. var mergedItems = React.useMemo(function () {
  30. // use `items` first
  31. if (items) {
  32. return items.map(function (item) {
  33. if (typeof item === 'string') {
  34. return {
  35. data: {
  36. src: item
  37. }
  38. };
  39. }
  40. var data = {};
  41. Object.keys(item).forEach(function (key) {
  42. if (['src'].concat(_toConsumableArray(COMMON_PROPS)).includes(key)) {
  43. data[key] = item[key];
  44. }
  45. });
  46. return {
  47. data: data
  48. };
  49. });
  50. }
  51. // use registered images secondly
  52. return Object.keys(images).reduce(function (total, id) {
  53. var _images$id = images[id],
  54. canPreview = _images$id.canPreview,
  55. data = _images$id.data;
  56. if (canPreview) {
  57. total.push({
  58. data: data,
  59. id: id
  60. });
  61. }
  62. return total;
  63. }, []);
  64. }, [items, images]);
  65. return [mergedItems, registerImage, !!items];
  66. }