@saltcorn/builder 1.3.1-beta.6 → 1.3.1-beta.7

package/dist/builder_bundle.js.LICENSE.txt

@@ -0,0 +1,96 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+
+/*!
+  Copyright (c) 2017 Jed Watson.
+  Licensed under the MIT License (MIT), see
+  http://jedwatson.github.io/classnames
+*/
+
+/*!
+ * Font Awesome Free 5.15.2 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation. All rights reserved.
+Licensed under the Apache License, Version 2.0 (the "License"); you may not use
+this file except in compliance with the License. You may obtain a copy of the
+License at http://www.apache.org/licenses/LICENSE-2.0
+
+THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
+WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
+MERCHANTABLITY OR NON-INFRINGEMENT.
+
+See the Apache Version 2.0 License for specific language governing permissions
+and limitations under the License.
+***************************************************************************** */
+
+/*!*
+ * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/**
+ * @license
+ * Lodash <https://lodash.com/>
+ * Copyright OpenJS Foundation and other contributors <https://openjsf.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */
+
+/** @license React v0.19.1
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saltcorn/builder",
-  "version": "1.3.1-beta.6",
+  "version": "1.3.1-beta.7",
   "description": "Drag and drop view builder for Saltcorn, open-source no-code platform",
   "main": "index.js",
   "homepage": "https://saltcorn.com",
@@ -20,7 +20,7 @@
     "@babel/preset-react": "7.24.7",
     "@craftjs/core": "0.1.0-beta.20",
     "@craftjs/utils": "0.1.0-beta.20",
-    "@saltcorn/common-code": "1.3.1-beta.6",
+    "@saltcorn/common-code": "1.3.1-beta.7",
     "saltcorn-craft-layers-noeye": "0.1.0-beta.22",
     "@fonticonpicker/react-fonticonpicker": "1.2.0",
     "@fortawesome/fontawesome-svg-core": "1.2.34",

package/src/components/elements/Action.js

@@ -5,7 +5,7 @@
  */
 /*global notifyAlert*/
 
-import React, { Fragment, useContext } from "react";
+import React, { Fragment, useContext, useEffect } from "react";
 import { useNode } from "@craftjs/core";
 import optionsCtx from "../context";
 import {
@@ -178,6 +178,13 @@ const ActionSettings = () => {
     });
     setInitialConfig(setProp, value, getCfgFields(value));
   };
+  const setMultistepAction = (value0) => {
+    const value = value0.value || value0;
+    setProp((prop) => {
+      if (!prop.step_action_names) prop.step_action_names = [];
+      prop.step_action_names[use_setting_action_n] = value;
+    });
+  };
   const actionOptions = options.actions.filter(Boolean).map((f, ix) =>
     f.optgroup && !f.options.length
       ? null
@@ -189,6 +196,37 @@ const ActionSettings = () => {
         : { label: f, value: f }
   );
   const selectedAction = { label: name, value: name };
+  const multiStepActionOptions = options.actions
+    .filter((f) => f && !(options.builtInActions || []).includes(f))
+    .map((f, ix) =>
+      f.optgroup && !f.options.length
+        ? null
+        : f.optgroup
+          ? {
+              label: f.label,
+              options: f.options
+                .filter(
+                  (f) =>
+                    ![
+                      "Multi-step action",
+                      ...(options.builtInActions || []),
+                    ].includes(f)
+                )
+                .map((a, jx) => ({ label: a, value: a })),
+            }
+          : { label: f, value: f }
+    );
+  const selectedMultiStepAction = {
+    label: step_action_names?.[use_setting_action_n] || "",
+    value: step_action_names?.[use_setting_action_n] || "",
+  };
+  useEffect(() => {
+    apply_showif();
+  }, [
+    name,
+    step_action_names?.[use_setting_action_n] || "",
+    JSON.stringify(configuration?.steps?.[use_setting_action_n]),
+  ]);
 
   return (
     <div>
@@ -198,7 +236,7 @@ const ActionSettings = () => {
             <td>
               <label>Action</label>
             </td>
-            <td>             
+            <td>
               {options.inJestTestingMode ? null : (
                 <Select
                   options={actionOptions}
@@ -343,47 +381,19 @@ const ActionSettings = () => {
           ></ArrayManager>
 
           <label>Action</label>
-          <select
-            value={step_action_names?.[use_setting_action_n] || ""}
-            className="form-control form-select"
-            onChange={(e) => {
-              if (!e.target) return;
-              const value = e.target.value;
-              setProp((prop) => {
-                if (!prop.step_action_names) prop.step_action_names = [];
-                prop.step_action_names[use_setting_action_n] = value;
-              });
-            }}
-          >
-            <option value="" disabled>
-              Select action...
-            </option>
-            {options.actions
-              .filter((f) => !(options.builtInActions || []).includes(f))
-              .map((f, ix) =>
-                f.optgroup ? (
-                  <optgroup key={ix} label={f.label}>
-                    {f.options
-                      .filter(
-                        (f) =>
-                          ![
-                            "Multi-step action",
-                            ...(options.builtInActions || []),
-                          ].includes(f)
-                      )
-                      .map((a, jx) => (
-                        <option key={jx} value={a}>
-                          {a}
-                        </option>
-                      ))}
-                  </optgroup>
-                ) : (
-                  <option key={ix} value={f}>
-                    {f}
-                  </option>
-                )
-              )}
-          </select>
+          {options.inJestTestingMode ? null : (
+            <Select
+              options={multiStepActionOptions}
+              className="react-select multistep-action-selector"
+              value={selectedMultiStepAction}
+              defaultValue={selectedMultiStepAction}
+              onChange={setMultistepAction}
+              menuPortalTarget={document.body}
+              styles={{
+                menuPortal: (base) => ({ ...base, zIndex: 19999 }),
+              }}
+            ></Select>
+          )}
           {options.mode !== "page" ? (
             <Fragment>
               <label>Only if... (formula)</label>

package/src/components/elements/utils.js

@@ -132,15 +132,19 @@ export const FormulaTooltip = () => {
           ))}
         </Fragment>
       ) : null}
-  
+
       <div>
-        In view formulae, you can use aggregation formulae. The syntax for this is 
-        <code>[inbound_table]$[inboundkey_field]$[target_field]$[aggrgation]</code> 
-        The aggregation (which should be lower case) can be ommitted and defaults to 
-        <code>array_agg</code>. Examples: <code>patients$favbook$id$count</code> or 
-        <code>patients$favbook$id</code>. 
-        This is useful if you want a count in a view link label 
-        without creating a stored calculated field.
+        In view formulae, you can use aggregation formulae. The syntax for this
+        is
+        <code>
+          [inbound_table]$[inboundkey_field]$[target_field]$[aggrgation]
+        </code>
+        The aggregation (which should be lower case) can be ommitted and
+        defaults to
+        <code>array_agg</code>. Examples: <code>patients$favbook$id$count</code>{" "}
+        or
+        <code>patients$favbook$id</code>. This is useful if you want a count in
+        a view link label without creating a stored calculated field.
       </div>
       <a
         className="d-block"
@@ -786,7 +790,7 @@ const ConfigForm = ({
   tableName,
   fieldName,
 }) => (
-  <div>
+  <div className="form-namespace">
     {fields.map((f, ix) => {
       if (f.showIf && configuration) {
         let noshow = false;
@@ -948,6 +952,7 @@ const ConfigField = ({
         return (
           <select
             className={`field-${field?.name} form-control form-select`}
+            name={field?.name}
             value={value || ""}
             onChange={(e) => e.target && myOnChange(e.target.value)}
             onBlur={(e) => e.target && myOnChange(e.target.value)}
@@ -966,6 +971,7 @@ const ConfigField = ({
         return (
           <input
             type="text"
+            name={field?.name}
             className={`field-${field?.name} form-control`}
             value={value || ""}
             spellCheck={false}
@@ -977,6 +983,7 @@ const ConfigField = ({
       <select
         className="fontselect form-control form-select"
         value={value || ""}
+        name={field?.name}
         onChange={(e) => e.target && myOnChange(e.target.value)}
         onBlur={(e) => e.target && myOnChange(e.target.value)}
       >
@@ -997,6 +1004,7 @@ const ConfigField = ({
         step={field.step || 1}
         min={field.min}
         max={field.max}
+        name={field?.name}
         value={value || ""}
         onChange={(e) => e.target && myOnChange(e.target.value)}
       />
@@ -1007,6 +1015,7 @@ const ConfigField = ({
         className={`field-${field?.name} form-control`}
         value={value || ""}
         step={0.01}
+        name={field?.name}
         max={or_if_undef(field?.attributes?.max, undefined)}
         min={or_if_undef(field?.attributes?.min, undefined)}
         onChange={(e) => e.target && myOnChange(e.target.value)}
@@ -1019,6 +1028,7 @@ const ConfigField = ({
           type="checkbox"
           className={`field-${field?.name} form-check-input`}
           checked={value}
+          name={field?.name}
           onChange={(e) => e.target && myOnChange(e.target.checked)}
         />
         <label className="form-check-label">{field.label}</label>
@@ -1030,6 +1040,7 @@ const ConfigField = ({
         type="text"
         className={`field-${field?.name} form-control`}
         value={value}
+        name={field?.name}
         spellCheck={false}
         onChange={(e) => e.target && myOnChange(e.target.value)}
       />
@@ -1040,6 +1051,7 @@ const ConfigField = ({
         type="text"
         className={`field-${field?.name} form-control`}
         value={value}
+        name={field?.name}
         onChange={(e) => e.target && myOnChange(e.target.value)}
         spellCheck={false}
       />
@@ -1063,6 +1075,7 @@ const ConfigField = ({
               (e.value && myOnChange(e.value)) ||
               (typeof e === "string" && myOnChange(e))
             }
+            name={field?.name}
             onBlur={(e) =>
               (e.name && myOnChange(e.name)) ||
               (e.value && myOnChange(e.value)) ||
@@ -1077,6 +1090,7 @@ const ConfigField = ({
           <select
             className={`field-${field?.name} form-control form-select`}
             value={value || ""}
+            name={field?.name}
             onChange={(e) => e.target && myOnChange(e.target.value)}
             onBlur={(e) => e.target && myOnChange(e.target.value)}
           >
@@ -1791,8 +1805,7 @@ export const buildLayers = (relations, tableName, tableNameCache) => {
         fkeys: [],
         relPath: relation.relationString,
       });
-    }
-    else {
+    } else {
       let currentTbl = relation.sourceTblName;
       for (const pathElement of relation.path) {
         if (pathElement.inboundKey) {