newspack-components 3.0.0 → 4.0.0

package/dist/cjs/wizard/index.js

@@ -13,11 +13,9 @@ var _icons = require("@wordpress/icons");
 var _ = require("../");
 var _router = _interopRequireDefault(require("../proxied-imports/router"));
 var _store = _interopRequireWildcard(require("./store"));
-var _utils = require("./store/utils");
 var _WizardError = _interopRequireDefault(require("./components/WizardError"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * External dependencies.
  */
@@ -37,22 +35,45 @@ const {
   Route,
   Switch
 } = _router.default;
+
+/**
+ * @typedef  {Object}     WizardProps
+ * @property {string}     headerText                The header text.
+ * @property {string}     [subHeaderText]           The sub-header text, optional.
+ * @property {string}     [apiSlug]                 The API slug, optional.
+ * @property {string}     [className]               CSS classes, optional.
+ * @property {any[]}      sections                  Array of sections.
+ * @property {boolean}    [hasSimpleFooter]         Indicates if a simple footer is used, optional.
+ * @property {() => void} [renderAboveSections]     Function to render content above sections, optional.
+ * @property {string[]}   [requiredPlugins]         Array of required plugin strings, optional.
+ * @property {boolean}    [isInitialFetchTriggered] Indicates if the initial fetch should be triggered, optional.
+ */
+
+/**
+ * Wizard Component
+ *
+ * Provides a tabbed UI with history.
+ *
+ * @param {WizardProps} props
+ * @return {JSX.Element} Wizard component
+ */
 const Wizard = ({
   sections = [],
-  apiSlug,
   headerText,
+  apiSlug,
   subHeaderText,
   hasSimpleFooter,
   className,
   renderAboveSections,
-  requiredPlugins = []
-}) => {
+  requiredPlugins = [],
+  isInitialFetchTriggered = true
+}, ref) => {
   const isLoading = (0, _data.useSelect)(select => select(_store.WIZARD_STORE_NAMESPACE).isLoading());
   const isQuietLoading = (0, _data.useSelect)(select => select(_store.WIZARD_STORE_NAMESPACE).isQuietLoading());
 
   // Trigger initial data fetch. Some sections might not use the wizard data,
   // but for consistency, fetching is triggered regardless of the section.
-  (0, _data.useSelect)(select => select(_store.WIZARD_STORE_NAMESPACE).getWizardAPIData(apiSlug));
+  (0, _data.useSelect)(select => isInitialFetchTriggered && select(_store.WIZARD_STORE_NAMESPACE).getWizardAPIData(apiSlug));
   let displayedSections = sections.filter(section => !section.isHidden);
   const [pluginRequirementsSatisfied, setPluginRequirementsSatisfied] = (0, _element.useState)(requiredPlugins.length === 0);
   if (!pluginRequirementsSatisfied) {
@@ -67,7 +88,9 @@ const Wizard = ({
       })
     }];
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+  const urlWithoutHash = window.location.href.split('#')[0];
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    ref: ref,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames.default)(isLoading ? 'newspack-wizard__is-loading' : 'newspack-wizard__is-loaded', {
         'newspack-wizard__is-loading-quiet': isQuietLoading
@@ -82,7 +105,7 @@ const Wizard = ({
             className: "newspack-wizard__header__inner",
             children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: "newspack-wizard__title",
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Button, {
+              children: [newspack_urls.dashboard !== urlWithoutHash ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Button, {
                 isLink: true,
                 href: newspack_urls.dashboard,
                 label: (0, _i18n.__)('Return to Dashboard', 'newspack-plugin'),
@@ -92,6 +115,8 @@ const Wizard = ({
                 children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.NewspackIcon, {
                   size: 36
                 })
+              }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_.NewspackIcon, {
+                size: 36
               }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
                 children: [headerText && /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
                   children: headerText
@@ -106,11 +131,13 @@ const Wizard = ({
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_WizardError.default, {})
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.HandoffMessage, {}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Switch, {
           children: [displayedSections.map((section, index) => {
+            var _section$exact;
             const SectionComponent = section.render;
             return /*#__PURE__*/(0, _jsxRuntime.jsx)(Route, {
+              exact: (_section$exact = section.exact) !== null && _section$exact !== void 0 ? _section$exact : false,
               path: section.path,
               children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-                className: (0, _classnames.default)('newspack-wizard newspack-wizard__content', className),
+                className: (0, _classnames.default)('newspack-wizard__content', className),
                 children: ['function' === typeof renderAboveSections ? renderAboveSections() : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(SectionComponent, {})]
               })
             }, index);
@@ -124,6 +151,4 @@ const Wizard = ({
     })]
   });
 };
-Wizard.useWizardData = _utils.useWizardData;
-Wizard.STORE_NAMESPACE = _store.WIZARD_STORE_NAMESPACE;
-var _default = exports.default = Wizard;
+var _default = exports.default = (0, _element.forwardRef)(Wizard);

package/dist/cjs/wizard/store/index.js

@@ -21,7 +21,7 @@ var _utils = require("./utils.js");
 
 const WIZARD_STORE_NAMESPACE = exports.WIZARD_STORE_NAMESPACE = 'newspack/wizards';
 const DEFAULT_STATE = {
-  isLoading: true,
+  isLoading: false,
   isQuietLoading: false,
   apiData: {},
   error: null
@@ -120,6 +120,10 @@ const selectors = {
   isLoading: state => state.isLoading,
   isQuietLoading: state => state.isQuietLoading,
   getWizardAPIData: (state, slug) => state.apiData[slug] || {},
+  getWizardData: (state, slug) => {
+    var _state$apiData$slug;
+    return (_state$apiData$slug = state.apiData[slug]) !== null && _state$apiData$slug !== void 0 ? _state$apiData$slug : {};
+  },
   getError: state => state.error
 };
 const store = (0, _data.createReduxStore)(WIZARD_STORE_NAMESPACE, {
@@ -128,17 +132,21 @@ const store = (0, _data.createReduxStore)(WIZARD_STORE_NAMESPACE, {
   selectors,
   controls: {
     FETCH_FROM_API: action => {
+      const {
+        isLocalError = false,
+        isQuietFetch = false
+      } = action.payload;
       (0, _data.dispatch)(WIZARD_STORE_NAMESPACE).startLoadingData({
-        isQuietLoading: Boolean(action.payload.isQuietFetch)
+        isQuietLoading: Boolean(isQuietFetch)
       });
       return (0, _apiFetch.default)(action.payload).then(data => {
         (0, _data.dispatch)(WIZARD_STORE_NAMESPACE).setError(null);
         return data;
       }).catch(error => {
+        if (isLocalError) {
+          throw error;
+        }
         (0, _data.dispatch)(WIZARD_STORE_NAMESPACE).setError(error);
-        return {
-          error
-        };
       }).finally(result => {
         (0, _data.dispatch)(WIZARD_STORE_NAMESPACE).finishLoadingData();
         return result;

package/dist/cjs/wizard/store/utils.js

@@ -19,5 +19,7 @@ const createAction = type => payload => ({
   payload
 });
 exports.createAction = createAction;
-const useWizardData = (wizardName, defaultValue = {}) => (0, _data.useSelect)(select => select(_.WIZARD_STORE_NAMESPACE).getWizardAPIData(`newspack-${wizardName}-wizard`)) || defaultValue;
+const useWizardData = (wizardName, defaultValue = {}) => {
+  return (0, _data.useSelect)(select => select(_.WIZARD_STORE_NAMESPACE).getWizardAPIData(wizardName)) || defaultValue;
+};
 exports.useWizardData = useWizardData;

package/dist/esm/action-card/action-card.d.js

@@ -0,0 +1 @@
+export {};