@scaleflex/widget-provider-views 4.1.0 → 4.4.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 (28) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/package.json +5 -5
  3. package/dist/style.css +0 -787
  4. package/dist/style.min.css +0 -1
  5. package/lib/components/AuthView.js +0 -35
  6. package/lib/components/AuthView.styled.js +0 -21
  7. package/lib/components/Browser.js +0 -58
  8. package/lib/components/FolderImportProgress/FolderImportProgress.styled.js +0 -50
  9. package/lib/components/FolderImportProgress/index.js +0 -50
  10. package/lib/components/Items/AssetsSection/AssetsSectionTableHeader.js +0 -41
  11. package/lib/components/Items/AssetsSection/AssetsSectionTableRow.js +0 -147
  12. package/lib/components/Items/AssetsSection/index.js +0 -65
  13. package/lib/components/Items/FoldersSection/FoldersSectionTableHeader.js +0 -41
  14. package/lib/components/Items/FoldersSection/FoldersSectionTableRow.js +0 -102
  15. package/lib/components/Items/FoldersSection/index.js +0 -64
  16. package/lib/components/Items/Items.styled.js +0 -156
  17. package/lib/components/Items/List.js +0 -96
  18. package/lib/components/Items/index.js +0 -172
  19. package/lib/components/SearchProviderView/FooterActions.js +0 -25
  20. package/lib/components/SearchProviderView/SearchFilterInput.js +0 -76
  21. package/lib/components/SearchProviderView/SearchProviderBrowser.js +0 -74
  22. package/lib/components/SearchProviderView/SearchProviderBrowser.styled.js +0 -65
  23. package/lib/components/SearchProviderView/SearchProviderView.js +0 -248
  24. package/lib/components/SearchProviderView/index.js +0 -1
  25. package/lib/context/index.js +0 -2
  26. package/lib/hooks/useBrowserContext.js +0 -5
  27. package/lib/utils/View.js +0 -219
  28. package/lib/utils/remoteFileObjToLocal.js +0 -13
@@ -1,76 +0,0 @@
1
- function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
2
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
- function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
4
- function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
5
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
- function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
7
- import { useEffect, useState, useCallback } from 'react';
8
- import { UnsplashIcon } from '@scaleflex/widget-icons/lib';
9
- import { Search } from '@scaleflex/icons';
10
- import Styled from './SearchProviderBrowser.styled';
11
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
12
- export default function SearchFilterInput(_ref) {
13
- var search = _ref.search,
14
- searchTerm = _ref.searchTerm,
15
- files = _ref.files,
16
- i18n = _ref.i18n;
17
- var _useState = useState(''),
18
- _useState2 = _slicedToArray(_useState, 2),
19
- searchText = _useState2[0],
20
- setSearchText = _useState2[1];
21
- var validateAndSearch = useCallback(function () {
22
- setSearchText(function (_search) {
23
- if (!(_search !== null && _search !== void 0 && _search.length)) return;
24
- search(_search);
25
- return _search;
26
- });
27
- }, [search, searchText]);
28
- useEffect(function () {
29
- var submitSearchHandler = function submitSearchHandler(event) {
30
- if (event.key === 'Enter') {
31
- validateAndSearch();
32
- }
33
- };
34
- document.addEventListener('keydown', submitSearchHandler);
35
- return function () {
36
- document.removeEventListener('keydown', submitSearchHandler);
37
- };
38
- }, []);
39
- useEffect(function () {
40
- if (searchTerm) {
41
- setSearchText(searchTerm);
42
- }
43
- }, [searchTerm]);
44
- return /*#__PURE__*/_jsxs(_Fragment, {
45
- children: [!files.length && /*#__PURE__*/_jsxs(_Fragment, {
46
- children: [/*#__PURE__*/_jsx(Styled.IconWrapper, {
47
- children: /*#__PURE__*/_jsx(UnsplashIcon, {})
48
- }), /*#__PURE__*/_jsx(Styled.Title, {
49
- children: i18n('searchUnsplachTitle')
50
- })]
51
- }), /*#__PURE__*/_jsx(Styled.SearchWrapper, {
52
- children: /*#__PURE__*/_jsx(Styled.Search, {
53
- value: searchText,
54
- onChange: function onChange(e) {
55
- return setSearchText(e.target.value);
56
- },
57
- placeholder: i18n('searchUnsplachLabel'),
58
- size: "md",
59
- fullWidth: true,
60
- focusOnMount: true,
61
- iconEnd: function iconEnd() {
62
- return /*#__PURE__*/_jsxs(Styled.IconEndWrapper, {
63
- children: [/*#__PURE__*/_jsx(Styled.Separator, {}), /*#__PURE__*/_jsx(Styled.IconButton, {
64
- color: "basic",
65
- size: "lg",
66
- onClick: validateAndSearch,
67
- children: /*#__PURE__*/_jsx(Search, {
68
- size: 18
69
- })
70
- })]
71
- });
72
- }
73
- })
74
- })]
75
- });
76
- }
@@ -1,74 +0,0 @@
1
- import { useCallback } from 'react';
2
- import { CheckBox } from '@scaleflex/ui/core';
3
- import { Image, LoaderView } from '@scaleflex/widget-common';
4
- import Styled from './SearchProviderBrowser.styled';
5
- import FooterActionBar from './FooterActions';
6
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
7
- var FIXED_IMAGE_WIDTH = 220;
8
- var WIDTH_REGEX = /w=\d*/g;
9
- function SearchProviderBrowser(_ref) {
10
- var currentSelection = _ref.currentSelection,
11
- files = _ref.files,
12
- toggleCheckbox = _ref.toggleCheckbox,
13
- i18n = _ref.i18n,
14
- isLoading = _ref.isLoading,
15
- searchTerm = _ref.searchTerm,
16
- done = _ref.done,
17
- handleScroll = _ref.handleScroll,
18
- cancel = _ref.cancel;
19
- var imageWidth = Math.floor(devicePixelRatio * FIXED_IMAGE_WIDTH);
20
- var getImageSrc = function getImageSrc(_ref2) {
21
- var _ref2$thumbnail = _ref2.thumbnail,
22
- thumbnail = _ref2$thumbnail === void 0 ? '' : _ref2$thumbnail;
23
- return thumbnail.replace(WIDTH_REGEX, "w=".concat(imageWidth));
24
- };
25
- var selected = currentSelection.length;
26
- var checkIsSelected = useCallback(function (image) {
27
- return currentSelection.some(function (selectedImg) {
28
- return selectedImg.id === image.id;
29
- });
30
- }, [currentSelection]);
31
- if (isLoading) {
32
- return /*#__PURE__*/_jsx(Styled.LoaderWrapper, {
33
- children: /*#__PURE__*/_jsx(LoaderView, {
34
- loaderLabel: i18n('loaderLoadingLabel')
35
- })
36
- });
37
- }
38
- if (!files.length && searchTerm !== null && searchTerm !== void 0 && searchTerm.length) {
39
- return /*#__PURE__*/_jsx(Styled.NoResultPlaceHolder, {
40
- children: i18n('unsplashNoResultLabel')
41
- });
42
- }
43
- return /*#__PURE__*/_jsxs(_Fragment, {
44
- children: [/*#__PURE__*/_jsx(Styled.Container, {
45
- onScroll: handleScroll,
46
- children: files.map(function (file) {
47
- return /*#__PURE__*/_jsxs(Styled.ImageWrapper, {
48
- onClick: function onClick(event) {
49
- return toggleCheckbox(event, file);
50
- },
51
- checked: checkIsSelected(file),
52
- children: [/*#__PURE__*/_jsx(Styled.CheckboxWrapper, {
53
- children: /*#__PURE__*/_jsx(CheckBox, {
54
- checked: checkIsSelected(file),
55
- onClick: function onClick(event) {
56
- return toggleCheckbox(event, file);
57
- },
58
- onChange: function onChange() {}
59
- })
60
- }), /*#__PURE__*/_jsx(Image, {
61
- src: getImageSrc(file),
62
- alt: file.author.name
63
- })]
64
- }, file.id);
65
- })
66
- }), selected > 0 && /*#__PURE__*/_jsx(FooterActionBar, {
67
- done: done,
68
- cancel: cancel,
69
- i18n: i18n,
70
- selected: selected
71
- })]
72
- });
73
- }
74
- export default SearchProviderBrowser;
@@ -1,65 +0,0 @@
1
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
2
- function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
3
- import { FV, PC } from '@scaleflex/widget-common';
4
- import { Label, Search as SfxSearch, IconButton as SfxIconButton } from '@scaleflex/ui/core';
5
- import styled, { css } from 'styled-components';
6
- var UnSplashWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: ", ";\n width: 100%;\n height: 100%;\n padding: 0 4px 4px 24px;\n"])), function (_ref) {
7
- var hasFiles = _ref.hasFiles;
8
- return hasFiles ? 'flex-start' : 'center';
9
- });
10
- var Container = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-columns: repeat( auto-fit, minmax(190px, 1fr));\n gap: 6px;\n padding-right: 20px;\n padding-top: 4px;\n overflow: scroll;\n"])));
11
- var CheckboxWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n opacity: 0;\n position: absolute;\n top: 12px;\n left: 12px;\n transition: opacity 200ms ease-in-out;\n"])));
12
- var ImageWrapper = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n cursor: pointer;\n\n ", "\n\n &:hover {\n ", " {\n opacity: 1;\n }\n }\n\n img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 4px;\n }\n"])), function (_ref2) {
13
- var checked = _ref2.checked;
14
- return checked && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n ", " {\n opacity: 1;\n }\n "])), CheckboxWrapper);
15
- }, CheckboxWrapper);
16
- var SearchWrapper = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: 100%;\n max-width: 700px;\n align-items: center;\n\n .SfxSearch-root {\n width: 100%;\n\n .SfxInput-Icon:first-child {\n display: none;\n }\n\n .SfxInput-root {\n max-height: 48px;\n height: 48px;\n }\n }\n"])));
17
- var Search = styled(SfxSearch)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n margin-top: 16px;\n margin-bottom: 20px;\n"])));
18
- var LoaderWrapper = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n height: 100%;\n"])));
19
- var NoResultPlaceHolder = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: fit-content;\n margin-top: 20px;\n"])));
20
- var IconWrapper = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n width: 80px;\n height: 80px;\n }\n"])));
21
- var Title = styled(Label)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n margin-top: 16px;\n\n .SfxLabel-text {\n ", "\n color: ", ";\n }\n"])), function (_ref3) {
22
- var theme = _ref3.theme;
23
- return theme.typography.font[FV.LabelLargeUp];
24
- }, function (_ref4) {
25
- var palette = _ref4.theme.palette;
26
- return palette[PC.TextPrimary];
27
- });
28
- var AssetsNumber = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n margin-top: 12px;\n margin-bottom: 20px;\n ", "\n color: ", ";\n"])), function (_ref5) {
29
- var theme = _ref5.theme;
30
- return theme.typography.font[FV.LabelMediumEmphasis];
31
- }, function (_ref6) {
32
- var palette = _ref6.theme.palette;
33
- return palette[PC.TextSecondary];
34
- });
35
- var FooterWrapper = styled.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: flex-end;\n column-gap: 12px;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n padding: 0 24px;\n border: 1px solid ", ";\n height: 96px;\n\n .SfxButton-root {\n min-width: 120px;\n }\n\n ", "\n"])), function (_ref7) {
36
- var palette = _ref7.theme.palette;
37
- return palette[PC.BordersSecondary];
38
- }, function (_ref8) {
39
- var breakpoints = _ref8.theme.breakpoints;
40
- return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n ", " {\n height: 72px;\n }\n\n ", " & {\n height: 72px;\n }\n\n ", " & {\n height: 72px;\n }\n\n ", " & {\n height: 72px;\n }\n\n ", " & {\n height: 72px;\n }\n "])), breakpoints.between('xs', 'lg'), breakpoints.classes.lg, breakpoints.classes.md, breakpoints.classes.sm, breakpoints.classes.xs);
41
- });
42
- var IconEndWrapper = styled.div(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n column-gap: 4px;\n"])));
43
- var IconButton = styled(SfxIconButton)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral([""])));
44
- var Separator = styled.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n width: 1px;\n height: 26px;\n border: 1px solid ", ";\n"])), function (_ref9) {
45
- var palette = _ref9.theme.palette;
46
- return palette[PC.BordersPrimary];
47
- });
48
- var Styled = {
49
- Container: Container,
50
- ImageWrapper: ImageWrapper,
51
- CheckboxWrapper: CheckboxWrapper,
52
- UnSplashWrapper: UnSplashWrapper,
53
- SearchWrapper: SearchWrapper,
54
- Search: Search,
55
- LoaderWrapper: LoaderWrapper,
56
- NoResultPlaceHolder: NoResultPlaceHolder,
57
- FooterWrapper: FooterWrapper,
58
- IconWrapper: IconWrapper,
59
- Title: Title,
60
- IconButton: IconButton,
61
- Separator: Separator,
62
- IconEndWrapper: IconEndWrapper,
63
- AssetsNumber: AssetsNumber
64
- };
65
- export default Styled;
@@ -1,248 +0,0 @@
1
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- var _excluded = ["children"];
3
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
4
- function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
5
- function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
6
- function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
7
- function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
8
- function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
9
- function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
10
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
11
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
12
- function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
13
- function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
14
- function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
15
- function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
16
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
17
- function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
18
- function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
19
- function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
20
- function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
21
- function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
22
- function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
23
- function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
24
- function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
25
- function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
26
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
27
- import { useEffect } from 'react';
28
- import SearchFilterInput from './SearchFilterInput';
29
- import View from '../../utils/View';
30
- import SearchProviderBrowser from './SearchProviderBrowser';
31
- import Styled from './SearchProviderBrowser.styled';
32
-
33
- /**
34
- * SearchProviderView, used for Unsplash and future image search providers.
35
- * Extends generic View, shared with regular providers like Google Drive and Instagram.
36
- */
37
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
38
- var CloseWrapper = function CloseWrapper(_ref) {
39
- var children = _ref.children,
40
- props = _objectWithoutProperties(_ref, _excluded);
41
- useEffect(function () {
42
- return props.onUnmount;
43
- }, []);
44
- return children;
45
- };
46
- var SearchProviderView = /*#__PURE__*/function (_View) {
47
- // static VERSION = packageJson.version
48
-
49
- /**
50
- * @param {object} plugin instance of the plugin
51
- * @param {object} opts
52
- */
53
- function SearchProviderView(plugin, opts) {
54
- var _this;
55
- _classCallCheck(this, SearchProviderView);
56
- _this = _callSuper(this, SearchProviderView, [plugin, opts]);
57
-
58
- // set default options
59
- var defaultOptions = {
60
- layoutType: 'grid',
61
- showTitles: false,
62
- showFilter: false,
63
- showBreadcrumbs: false
64
- };
65
-
66
- // merge default options with the ones set by user
67
- _this.opts = _objectSpread(_objectSpread({}, defaultOptions), opts);
68
-
69
- // Logic
70
- _this.search = _this.search.bind(_this);
71
- _this.clearSearch = _this.clearSearch.bind(_this);
72
- _this.resetPluginCommonState = _this.resetPluginCommonState.bind(_this);
73
- _this.handleScroll = _this.handleScroll.bind(_this);
74
- _this.addSelectedItems = _this.addSelectedItems.bind(_this);
75
-
76
- // Visual
77
- _this.render = _this.render.bind(_this);
78
- _this.defaultState = {
79
- isInputMode: true,
80
- files: [],
81
- folders: [],
82
- directories: [],
83
- filterInput: '',
84
- currentSelection: [],
85
- searchTerm: null
86
- };
87
-
88
- // Set default state for the plugin
89
- _this.plugin.setPluginCommonState(_this.defaultState);
90
- return _this;
91
- }
92
-
93
- // eslint-disable-next-line class-methods-use-this
94
- _inherits(SearchProviderView, _View);
95
- return _createClass(SearchProviderView, [{
96
- key: "tearDown",
97
- value: function tearDown() {
98
- // Nothing.
99
- }
100
- }, {
101
- key: "resetPluginCommonState",
102
- value: function resetPluginCommonState() {
103
- this.plugin.setPluginCommonState(this.defaultState);
104
- }
105
- }, {
106
- key: "updateFilesAndInputMode",
107
- value: function updateFilesAndInputMode(res, files) {
108
- var resetSelections = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
109
- this.nextPageQuery = res.nextPageQuery;
110
- var newFiles = _toConsumableArray(files);
111
- res.items.forEach(function (item) {
112
- newFiles.push(item);
113
- });
114
- this.plugin.setPluginCommonState(_objectSpread(_objectSpread({}, resetSelections && {
115
- currentSelection: []
116
- }), {}, {
117
- isInputMode: false,
118
- files: newFiles,
119
- searchTerm: res.searchedFor
120
- }));
121
- }
122
- }, {
123
- key: "search",
124
- value: async function search(query) {
125
- var _this$plugin$getPlugi = this.plugin.getPluginCommonState(),
126
- searchTerm = _this$plugin$getPlugi.searchTerm;
127
- if (query && query === searchTerm) {
128
- // no need to search again as this is the same as the previous search
129
- return;
130
- }
131
- this.setLoading(true);
132
- try {
133
- var res = await this.provider.search(query);
134
- this.updateFilesAndInputMode(res, [], true);
135
- } catch (err) {
136
- this.handleError(err);
137
- } finally {
138
- this.setLoading(false);
139
- }
140
- }
141
- }, {
142
- key: "clearSearch",
143
- value: function clearSearch() {
144
- this.plugin.setPluginCommonState({
145
- currentSelection: [],
146
- files: [],
147
- searchTerm: null
148
- });
149
- }
150
- }, {
151
- key: "handleScroll",
152
- value: async function handleScroll(event) {
153
- var query = this.nextPageQuery || null;
154
- if (this.shouldHandleScroll(event) && query) {
155
- this.isHandlingScroll = true;
156
- try {
157
- var _this$plugin$getPlugi2 = this.plugin.getPluginCommonState(),
158
- files = _this$plugin$getPlugi2.files,
159
- searchTerm = _this$plugin$getPlugi2.searchTerm;
160
- var response = await this.provider.search(searchTerm, query);
161
- this.updateFilesAndInputMode(response, files);
162
- } catch (error) {
163
- this.handleError(error);
164
- } finally {
165
- this.isHandlingScroll = false;
166
- }
167
- }
168
- }
169
- }, {
170
- key: "addSelectedItems",
171
- value: function addSelectedItems() {
172
- var _this2 = this;
173
- var _this$plugin$getPlugi3 = this.plugin.getPluginCommonState(),
174
- currentSelection = _this$plugin$getPlugi3.currentSelection;
175
- this.plugin.filerobot.log('Adding remote search provider files');
176
- this.plugin.filerobot.addFiles(currentSelection.map(function (file) {
177
- return _this2.getTagFile(file);
178
- }));
179
- this.resetPluginCommonState();
180
- }
181
- }, {
182
- key: "render",
183
- value: function render(state) {
184
- var viewOptions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
185
- var _this$plugin$getPlugi4 = this.plugin.getPluginCommonState(),
186
- didFirstRender = _this$plugin$getPlugi4.didFirstRender,
187
- isInputMode = _this$plugin$getPlugi4.isInputMode,
188
- searchTerm = _this$plugin$getPlugi4.searchTerm;
189
- if (!didFirstRender) {
190
- this.preFirstRender();
191
- }
192
- var targetViewOptions = _objectSpread(_objectSpread({}, this.opts), viewOptions);
193
- var _this$plugin$getPlugi5 = this.plugin.getPluginCommonState(),
194
- files = _this$plugin$getPlugi5.files,
195
- folders = _this$plugin$getPlugi5.folders,
196
- filterInput = _this$plugin$getPlugi5.filterInput,
197
- loading = _this$plugin$getPlugi5.loading,
198
- currentSelection = _this$plugin$getPlugi5.currentSelection;
199
- var isChecked = this.isChecked,
200
- toggleCheckbox = this.toggleCheckbox,
201
- filterItems = this.filterItems;
202
- var hasInput = filterInput !== '';
203
- var browserProps = _extends({}, this.plugin.getPluginCommonState(), _objectSpread(_objectSpread({}, targetViewOptions), {}, {
204
- isChecked: isChecked,
205
- toggleCheckbox: toggleCheckbox,
206
- currentSelection: currentSelection,
207
- files: hasInput ? filterItems(files) : files,
208
- folders: hasInput ? filterItems(folders) : folders,
209
- handleScroll: this.handleScroll,
210
- done: this.addSelectedItems,
211
- cancel: this.cancelPicking,
212
- // For SearchFilterInput component
213
- showSearchFilter: targetViewOptions.showFilter,
214
- search: this.search,
215
- clearSearch: this.clearSearch,
216
- searchTerm: searchTerm,
217
- searchOnInput: false,
218
- title: this.plugin.title,
219
- layoutType: targetViewOptions.layoutType,
220
- showTitles: targetViewOptions.showTitles,
221
- showFilter: targetViewOptions.showFilter,
222
- isLoading: loading,
223
- showBreadcrumbs: targetViewOptions.showBreadcrumbs,
224
- pluginIcon: this.plugin.icon,
225
- i18n: this.opts.i18n,
226
- filesToUpload: this.plugin.filerobot.getUploadsArray(),
227
- setPluginCommonState: this.plugin.setPluginCommonState
228
- }));
229
- return /*#__PURE__*/_jsx(CloseWrapper, {
230
- onUnmount: this.resetPluginCommonState,
231
- children: /*#__PURE__*/_jsxs(Styled.UnSplashWrapper, {
232
- hasFiles: files === null || files === void 0 ? void 0 : files.length,
233
- children: [/*#__PURE__*/_jsx(SearchFilterInput, {
234
- search: this.search,
235
- clearSelection: this.clearSelection,
236
- i18n: this.opts.i18n,
237
- files: files
238
- }), (files === null || files === void 0 ? void 0 : files.length) > 1 && /*#__PURE__*/_jsx(Styled.AssetsNumber, {
239
- children: this.opts.i18n('unsplashAssetsLabel', {
240
- smart_count: files === null || files === void 0 ? void 0 : files.length
241
- })
242
- }), !isInputMode && /*#__PURE__*/_jsx(SearchProviderBrowser, _objectSpread({}, browserProps))]
243
- })
244
- });
245
- }
246
- }]);
247
- }(View);
248
- export { SearchProviderView as default };
@@ -1 +0,0 @@
1
- export { default } from './SearchProviderView';
@@ -1,2 +0,0 @@
1
- import { createContext } from 'use-context-selector';
2
- export var BrowserContext = createContext({});
@@ -1,5 +0,0 @@
1
- import { useContextSelector } from 'use-context-selector';
2
- import { BrowserContext } from '../context';
3
- export function useBrowserContext(getState) {
4
- return useContextSelector(BrowserContext, getState);
5
- }