@webiny/app 0.0.0-mt-1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Webiny
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,19 @@
+# @webiny/app
+[![](https://img.shields.io/npm/dw/@webiny/app.svg)](https://www.npmjs.com/package/@webiny/app) 
+[![](https://img.shields.io/npm/v/@webiny/app.svg)](https://www.npmjs.com/package/@webiny/app)
+[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
+[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
+
+The base package for building Webiny and React powered web apps.
+
+For more information, please visit [the official docs](https://docs.webiny.com/docs/webiny/introduction). 
+  
+## Install
+```
+npm install --save @webiny/app
+```
+
+Or if you prefer yarn: 
+```
+yarn add @webiny/app
+```

package/apollo-client/InMemoryCache.d.ts

@@ -0,0 +1,7 @@
+import { InMemoryCache as BaseInMemoryCache, InMemoryCacheConfig } from "apollo-cache-inmemory";
+import { DocumentNode } from "graphql";
+export declare class InMemoryCache extends BaseInMemoryCache {
+    private transformPlugins;
+    constructor(config?: InMemoryCacheConfig);
+    transformDocument(document: DocumentNode): DocumentNode;
+}

package/apollo-client/InMemoryCache.js

@@ -0,0 +1,59 @@
+import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _get from "@babel/runtime/helpers/get";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _createSuper from "@babel/runtime/helpers/createSuper";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { InMemoryCache as BaseInMemoryCache } from "apollo-cache-inmemory";
+import { plugins } from "@webiny/plugins";
+import { AddQuerySelectionPlugin } from "../plugins/AddQuerySelectionPlugin";
+import { ApolloLinkPlugin } from "../plugins/ApolloLinkPlugin";
+export var InMemoryCache = /*#__PURE__*/function (_BaseInMemoryCache) {
+  _inherits(InMemoryCache, _BaseInMemoryCache);
+
+  var _super = _createSuper(InMemoryCache);
+
+  function InMemoryCache(config) {
+    var _this;
+
+    _classCallCheck(this, InMemoryCache);
+
+    _this = _super.call(this, config);
+
+    _defineProperty(_assertThisInitialized(_this), "transformPlugins", void 0);
+
+    _this.transformPlugins = plugins.byType(ApolloLinkPlugin.type).filter(function (pl) {
+      return pl instanceof AddQuerySelectionPlugin;
+    });
+    return _this;
+  }
+
+  _createClass(InMemoryCache, [{
+    key: "transformDocument",
+    value: function transformDocument(document) {
+      // @ts-ignore
+      var operationName = document.definitions[0].name.value;
+
+      var _iterator = _createForOfIteratorHelper(this.transformPlugins),
+          _step;
+
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var pl = _step.value;
+          pl.addSelectionToQuery(operationName, document);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+
+      return _get(_getPrototypeOf(InMemoryCache.prototype), "transformDocument", this).call(this, document);
+    }
+  }]);
+
+  return InMemoryCache;
+}(BaseInMemoryCache);

package/components/Image.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+import { ImageProps } from "../types";
+export declare const Image: React.FC<ImageProps>;

package/components/Image.js

@@ -0,0 +1,28 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _get from "lodash/get";
+var _excluded = ["preset"];
+import invariant from "invariant";
+import { plugins } from "@webiny/plugins";
+export var Image = function Image(_ref) {
+  var presetName = _ref.preset,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var plugin = plugins.byName("image-component");
+
+  if (!plugin) {
+    throw new Error("Image component plugin (type \"image-component\") not defined.");
+  }
+
+  if (presetName) {
+    var preset = _get(plugin, "presets.".concat(presetName));
+
+    invariant(preset, "Transform preset \"".concat(presetName, "\" not found."));
+    props.transform = preset;
+  }
+
+  if (props.transform) {
+    props.src = plugin.getImageSrc(props);
+  }
+
+  return plugin.render(props);
+};

package/components/Routes.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Routes: () => JSX.Element;

package/components/Routes.js

@@ -0,0 +1,35 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import React from "react";
+import { plugins } from "@webiny/plugins";
+import { Switch } from "@webiny/react-router";
+export var Routes = function Routes() {
+  // We cannot call `sort` on the array returned by the `plugins.byType` call - it is read-only.
+  var routes = _toConsumableArray(plugins.byType("route")).sort(function (a, b) {
+    var pathA = a.route.props.path || "*";
+    var pathB = b.route.props.path || "*"; // This will sort paths at the very bottom of the list
+
+    if (pathA === "/" && pathB === "*") {
+      return -1;
+    } // This will push * and / to the bottom of the list
+
+
+    if (pathA === "*" || pathA === "/") {
+      return 1;
+    } // This will push * and / to the bottom of the list
+
+
+    if (["*", "/"].includes(pathB)) {
+      return -1;
+    }
+
+    return 0;
+  });
+
+  return /*#__PURE__*/React.createElement(Switch, null, routes.map(function (_ref) {
+    var route = _ref.route,
+        name = _ref.name;
+    return /*#__PURE__*/React.cloneElement(route, {
+      key: name
+    });
+  }));
+};

package/components/View.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface Props {
+    name: string;
+    props?: Record<string, any>;
+    children?: React.ReactNode;
+}
+export declare const View: ({ name, children, props }: Props) => JSX.Element;
+export {};

package/components/View.js

@@ -0,0 +1,23 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import React, { Fragment } from "react";
+import { plugins } from "@webiny/plugins";
+import { ViewPlugin } from "../plugins/ViewPlugin";
+export var View = function View(_ref) {
+  var name = _ref.name,
+      children = _ref.children,
+      _ref$props = _ref.props,
+      props = _ref$props === void 0 ? {} : _ref$props;
+  var viewPlugins = plugins.byType(ViewPlugin.type).filter(function (pl) {
+    return pl.key === name;
+  });
+
+  if (viewPlugins.length) {
+    children = viewPlugins.reduce(function (el, pl) {
+      return pl.render(_objectSpread({
+        children: el
+      }, props));
+    }, children);
+  }
+
+  return /*#__PURE__*/React.createElement(Fragment, null, children || null);
+};

package/components/index.d.ts

@@ -0,0 +1 @@
+export { Image } from "./Image";

package/components/index.js

@@ -0,0 +1 @@
+export { Image } from "./Image";

package/contexts/Ui/index.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+export declare const UiContext: React.Context<{}>;
+declare type Props = {};
+declare type State = {
+    ui: {
+        [key: string]: any;
+    };
+};
+interface UiData {
+    [key: string]: any;
+}
+interface UiDataSetter {
+    (ui: UiData): UiData;
+}
+export interface UiContextValue {
+    setState: (setter: UiDataSetter) => void;
+    [key: string]: any;
+}
+export declare class UiProvider extends React.Component<Props, State> {
+    state: State;
+    setData: (setter: Function) => void;
+    render(): JSX.Element;
+}
+export declare const UiConsumer: ({ children }: {
+    children: any;
+}) => JSX.Element;
+export {};

package/contexts/Ui/index.js

@@ -0,0 +1,69 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _createSuper from "@babel/runtime/helpers/createSuper";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React from "react";
+import { plugins } from "@webiny/plugins";
+export var UiContext = /*#__PURE__*/React.createContext({});
+export var UiProvider = /*#__PURE__*/function (_React$Component) {
+  _inherits(UiProvider, _React$Component);
+
+  var _super = _createSuper(UiProvider);
+
+  function UiProvider() {
+    var _this;
+
+    _classCallCheck(this, UiProvider);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+
+    _defineProperty(_assertThisInitialized(_this), "state", {
+      ui: {}
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "setData", function (setter) {
+      return _this.setState(function (state) {
+        return {
+          ui: _objectSpread(_objectSpread({}, state.ui), setter(state.ui))
+        };
+      });
+    });
+
+    return _this;
+  }
+
+  _createClass(UiProvider, [{
+    key: "render",
+    value: function render() {
+      var value = _objectSpread(_objectSpread({}, this.state.ui), {}, {
+        setState: this.setData
+      });
+
+      var uiStatePlugins = plugins.byType("ui-state");
+      return /*#__PURE__*/React.createElement(UiContext.Provider, {
+        value: value
+      }, uiStatePlugins.map(function (pl) {
+        return /*#__PURE__*/React.cloneElement(pl.render(), {
+          key: pl.name
+        });
+      }), this.props.children);
+    }
+  }]);
+
+  return UiProvider;
+}(React.Component);
+export var UiConsumer = function UiConsumer(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/React.createElement(UiContext.Consumer, null, function (ui) {
+    return /*#__PURE__*/React.cloneElement(children, {
+      ui: ui
+    });
+  });
+};

package/hooks/useAutocomplete/index.d.ts

@@ -0,0 +1 @@
+export { useAutocomplete } from "./useAutocomplete";

package/hooks/useAutocomplete/index.js

@@ -0,0 +1 @@
+export { useAutocomplete } from "./useAutocomplete";

package/hooks/useAutocomplete/useAutocomplete.d.ts

@@ -0,0 +1,6 @@
+interface UseAutocompleteHook {
+    options: any[];
+    onInput(value: string): void;
+}
+export declare const useAutocomplete: (props: any) => UseAutocompleteHook;
+export {};

package/hooks/useAutocomplete/useAutocomplete.js

@@ -0,0 +1,27 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _debounce from "lodash/debounce";
+import { useDataList } from "../useDataList";
+export var useAutocomplete = function useAutocomplete(props) {
+  var useDataListProps = props.query ? props : {
+    query: props
+  };
+  var dataList = useDataList(_objectSpread({
+    useRouter: false
+  }, useDataListProps));
+  return {
+    options: dataList.data || [],
+    onInput: _debounce(function (query) {
+      if (!query) {
+        return;
+      }
+
+      var search = props.search || query;
+
+      if (typeof search === "function") {
+        search = search(query);
+      }
+
+      dataList.setSearch(search);
+    }, 250)
+  };
+};

package/hooks/useDataList/functions/getData.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (response: any) => any;
+export default _default;

package/hooks/useDataList/functions/getData.js

@@ -0,0 +1,4 @@
+import searchDataByKey from "./searchDataByKey";
+export default (function (response) {
+  return searchDataByKey("data", response);
+});

package/hooks/useDataList/functions/getError.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (response: any) => any;
+export default _default;

package/hooks/useDataList/functions/getError.js

@@ -0,0 +1,4 @@
+import searchDataByKey from "./searchDataByKey";
+export default (function (response) {
+  return searchDataByKey("error", response);
+});

package/hooks/useDataList/functions/getMeta.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (response: any) => any;
+export default _default;

package/hooks/useDataList/functions/getMeta.js

@@ -0,0 +1,4 @@
+import searchDataByKey from "./searchDataByKey";
+export default (function (response) {
+  return searchDataByKey("meta", response);
+});

package/hooks/useDataList/functions/index.d.ts

@@ -0,0 +1,3 @@
+export { default as getData } from "./getData";
+export { default as getError } from "./getError";
+export { default as getMeta } from "./getMeta";

package/hooks/useDataList/functions/index.js

@@ -0,0 +1,3 @@
+export { default as getData } from "./getData";
+export { default as getError } from "./getError";
+export { default as getMeta } from "./getMeta";

package/hooks/useDataList/functions/searchDataByKey.d.ts

@@ -0,0 +1,2 @@
+declare const searchDataByKey: (searchKey: any, object: any) => any;
+export default searchDataByKey;

package/hooks/useDataList/functions/searchDataByKey.js

@@ -0,0 +1,21 @@
+var searchDataByKey = function searchDataByKey(searchKey, object) {
+  if (!object || typeof object !== "object") {
+    return null;
+  }
+
+  if (object[searchKey]) {
+    return object[searchKey];
+  }
+
+  for (var key in object) {
+    var value = searchDataByKey(searchKey, object[key]);
+
+    if (value) {
+      return value;
+    }
+  }
+
+  return null;
+};
+
+export default searchDataByKey;

package/hooks/useDataList/index.d.ts

@@ -0,0 +1 @@
+export { useDataList } from "./useDataList";

package/hooks/useDataList/index.js

@@ -0,0 +1 @@
+export { useDataList } from "./useDataList";

package/hooks/useDataList/useDataList.d.ts

@@ -0,0 +1,36 @@
+import { DocumentNode } from "graphql";
+import { ApolloClient } from "apollo-client";
+export declare type UseDataListParams = {
+    useRouter?: boolean;
+    variables?: ((params: UseDataListParams) => any) | object;
+    client?: ApolloClient<any>;
+    query: DocumentNode;
+    getData?: (data: any) => any;
+    getMeta?: (data: any) => any;
+    getError?: (data: any) => any;
+};
+export declare type DataListProps = {
+    __loadParams: any;
+    refresh: (params?: any) => void;
+    data: any[];
+    meta: any;
+    error: any;
+    loading: boolean;
+    isSelected: (item: any) => boolean;
+    select: (item: any) => void;
+    isMultiSelected: (item: any) => boolean;
+    isNoneMultiSelected: () => boolean;
+    isAllMultiSelected: () => boolean;
+    multiSelectAll: (value: boolean) => void;
+    getMultiSelected: () => any[];
+    setSearch: (search: any) => void;
+    setWhere: (where: any) => void;
+    setSorters: (sort: any) => void;
+    setPerPage: (perPage: number) => void;
+    setPreviousPage: (cursor: string) => void;
+    setNextPage: (cursor: string) => void;
+    multiSelect: (items: string | string[], value?: boolean) => void;
+    init: () => void;
+};
+declare const useDataList: (params: UseDataListParams) => DataListProps;
+export { useDataList };

package/hooks/useDataList/useDataList.js

@@ -0,0 +1,193 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _isEqual from "lodash/isEqual";
+import _get from "lodash/get";
+import { useState, useEffect, useRef, useCallback } from "react";
+import { useQuery } from "@apollo/react-hooks";
+import { useRouter } from "@webiny/react-router";
+import { prepareLoadListParams } from "./utils";
+import { getData, getError, getMeta } from "./functions";
+
+var useDataList = function useDataList(params) {
+  var _useState = useState([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      multiSelectedItems = _useState2[0],
+      _multiSelect = _useState2[1];
+
+  var history = null;
+  var location = null;
+  var routerHook = useRouter();
+
+  if (params.useRouter !== false) {
+    history = routerHook.history;
+    location = routerHook.location;
+  }
+
+  var getQueryOptions = useCallback(function () {
+    var variables = params.variables;
+
+    if (typeof variables === "function") {
+      variables = variables(params);
+    }
+
+    return {
+      client: params.client,
+      variables: _objectSpread(_objectSpread({}, variables), prepareLoadListParams(location))
+    };
+  }, undefined);
+  var queryData = useQuery(params.query, getQueryOptions());
+  var prevLoadParamsRef = useRef({});
+  var dataListProps = {
+    data: _get(params, "getData", getData)(queryData.data),
+    meta: _get(params, "getMeta", getMeta)(queryData.data),
+    error: _get(params, "getError", getError)(queryData.data),
+    loading: queryData.loading,
+    init: function init() {
+      this.refresh();
+    },
+    refresh: function refresh() {
+      var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+
+      // Refresh multi select first.
+      _multiSelect([]);
+
+      if (!params) {
+        queryData.refetch(dataListProps.__loadParams);
+        return;
+      } // if (history) {
+      //     redirectToRouteWithQueryParams(params, { history, location });
+      //     return;
+      // }
+
+
+      queryData.refetch(params);
+    },
+    setPerPage: function setPerPage(perPage) {
+      var preparedParams = _objectSpread(_objectSpread({}, dataListProps.__loadParams), {}, {
+        limit: parseInt("" + perPage),
+        after: undefined,
+        before: undefined
+      });
+
+      this.refresh(preparedParams);
+    },
+    setNextPage: function setNextPage(cursor) {
+      var preparedParams = _objectSpread(_objectSpread({}, dataListProps.__loadParams), {}, {
+        after: cursor,
+        before: undefined
+      });
+
+      this.refresh(preparedParams);
+    },
+    setPreviousPage: function setPreviousPage(cursor) {
+      var preparedParams = _objectSpread(_objectSpread({}, dataListProps.__loadParams), {}, {
+        after: undefined,
+        before: cursor
+      });
+
+      this.refresh(preparedParams);
+    },
+    setSearch: function setSearch(search) {
+      var preparedParams = _objectSpread(_objectSpread({}, dataListProps.__loadParams), {}, {
+        search: search,
+        after: undefined,
+        before: undefined
+      });
+
+      this.refresh(preparedParams);
+    },
+    setWhere: function setWhere(where) {
+      var preparedParams = _objectSpread(_objectSpread({}, dataListProps.__loadParams), {}, {
+        where: where,
+        after: undefined,
+        before: undefined
+      });
+
+      this.refresh(preparedParams);
+    },
+    setSorters: function setSorters(sort) {
+      var preparedParams = _objectSpread(_objectSpread({}, dataListProps.__loadParams), {}, {
+        sort: sort,
+        after: undefined,
+        before: undefined
+      });
+
+      this.refresh(preparedParams);
+    },
+    multiSelect: function multiSelect(items, value) {
+      if (!Array.isArray(items)) {
+        items = [items];
+      }
+
+      var returnItems = _toConsumableArray(multiSelectedItems);
+
+      items.forEach(function (item) {
+        if (value === undefined) {
+          returnItems.includes(item) ? returnItems.splice(returnItems.indexOf(item), 1) : returnItems.push(item);
+        } else {
+          if (value === true) {
+            !returnItems.includes(item) && returnItems.push(item);
+          } else {
+            returnItems.includes(item) && returnItems.splice(returnItems.indexOf(item), 1);
+          }
+        }
+      });
+
+      _multiSelect(returnItems);
+    },
+    isSelected: function isSelected(item) {
+      var query = new URLSearchParams(location.search);
+      return query.get("id") === item.id;
+    },
+    select: function select(item) {
+      var query = new URLSearchParams(location.search);
+      query.set("id", item.id);
+      history.push({
+        search: query.toString()
+      });
+    },
+    isMultiSelected: function isMultiSelected(item) {
+      if (!Array.isArray(multiSelectedItems)) {
+        return false;
+      }
+
+      return multiSelectedItems.includes(item);
+    },
+    isNoneMultiSelected: function isNoneMultiSelected() {
+      return multiSelectedItems.length === 0;
+    },
+    getMultiSelected: function getMultiSelected() {
+      return multiSelectedItems;
+    },
+    multiSelectAll: function multiSelectAll(value) {
+      var data = dataListProps.data;
+
+      if (Array.isArray(data)) {
+        dataListProps.multiSelect(data, value);
+      } else {
+        dataListProps.multiSelect([], value);
+      }
+    },
+    isAllMultiSelected: function isAllMultiSelected() {
+      var data = dataListProps.data;
+      return Array.isArray(data) && multiSelectedItems.length === data.length;
+    },
+    __loadParams: prepareLoadListParams(location)
+  };
+  useEffect(function () {
+    var params = {
+      prev: prevLoadParamsRef.current,
+      current: dataListProps.__loadParams
+    };
+
+    if (!_isEqual(params.prev, params.current)) {
+      dataListProps.init();
+    }
+
+    prevLoadParamsRef.current = params.current;
+  });
+  return dataListProps;
+};
+
+export { useDataList };