@saltcorn/builder 1.3.0-beta.1 → 1.3.0-beta.11

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.0-beta.1",
+  "version": "1.3.0-beta.11",
   "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.0-beta.1",
+    "@saltcorn/common-code": "1.3.0-beta.11",
     "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/Builder.js

@@ -78,6 +78,8 @@ const { Provider } = optionsCtx;
  * @namespace
  */
 const SettingsPanel = () => {
+  const options = useContext(optionsCtx);
+
   const { actions, selected, query } = useEditor((state, query) => {
     const currentNodeId = state.events.selected;
     let selected;
@@ -170,6 +172,48 @@ const SettingsPanel = () => {
         if (nextSib) actions.selectNode(nextSib);
         event.preventDefault();
       }
+      // Ctrl+C or Cmd+C pressed?
+      if ((event.ctrlKey || event.metaKey) && event.keyCode == 67 && selected) {
+        // copy elem in json format to clipboard
+        const { layout } = craftToSaltcorn(
+          JSON.parse(query.serialize()),
+          selected?.id,
+          options
+        );
+        navigator.clipboard.writeText(JSON.stringify(layout, null, 2));
+      }
+      if ((event.ctrlKey || event.metaKey) && event.keyCode == 88 && selected) {
+        // cut elem in json format to clipboard
+        const { layout } = craftToSaltcorn(
+          JSON.parse(query.serialize()),
+          selected?.id,
+          options
+        );
+        navigator.clipboard.writeText(JSON.stringify(layout, null, 2));
+        deleteThis();
+      }
+      if ((event.ctrlKey || event.metaKey) && event.keyCode == 86) {
+        // paste elem from clipboard into container element
+
+        navigator.clipboard.readText().then((clipText) => {
+          const layout = JSON.parse(clipText);
+          layoutToNodes(
+            layout,
+            query,
+            actions,
+            selected?.id || "ROOT",
+            options
+          );
+        });
+      }
+      if ((event.ctrlKey || event.metaKey) && event.keyCode == 90) {
+        // undo
+        actions.history.undo();
+      }
+      if ((event.ctrlKey || event.metaKey) && event.keyCode == 89) {
+        // redo
+        actions.history.redo();
+      }
     }
   };
   useEffect(() => {
@@ -223,14 +267,17 @@ const SettingsPanel = () => {
         {selected ? (
           <Fragment>
             {selected.isDeletable && (
-              <button className="btn btn-sm btn-danger" onClick={deleteThis}>
+              <button
+                className="btn btn-sm btn-danger delete-element-builder"
+                onClick={deleteThis}
+              >
                 <FontAwesomeIcon icon={faTrashAlt} className="me-1" />
                 Delete
               </button>
             )}
             {hasChildren && !selected.isDeletable ? (
               <button
-                className="btn btn-sm btn-danger"
+                className="btn btn-sm btn-danger delete-children-builder"
                 onClick={deleteChildren}
               >
                 <FontAwesomeIcon icon={faTrashAlt} className="me-1" />
@@ -239,7 +286,7 @@ const SettingsPanel = () => {
             ) : (
               <button
                 title="Duplicate element with its children"
-                className="btn btn-sm btn-secondary ms-2"
+                className="btn btn-sm btn-secondary ms-2 duplicate-element-builder"
                 onClick={duplicate}
               >
                 <FontAwesomeIcon icon={faCopy} className="me-1" />
@@ -293,7 +340,10 @@ const AddColumnButton = () => {
     );
   };
   return (
-    <button className="btn btn-primary mt-2" onClick={addColumn}>
+    <button
+      className="btn btn-primary mt-2 add-column-builder"
+      onClick={addColumn}
+    >
       <FontAwesomeIcon icon={faPlus} className="me-2" />
       Add column
     </button>
@@ -316,7 +366,7 @@ const HistoryPanel = () => {
     <Fragment>
       {canUndo && (
         <button
-          className="btn btn-sm btn-secondary ms-2 me-2"
+          className="btn btn-sm btn-secondary ms-2 me-2 undo-builder"
           title="Undo"
           onClick={() => actions.history.undo()}
         >
@@ -325,7 +375,7 @@ const HistoryPanel = () => {
       )}
       {canRedo && (
         <button
-          className="btn btn-sm btn-secondary"
+          className="btn btn-sm btn-secondary redo-builder"
           title="Redo"
           onClick={() => actions.history.redo()}
         >
@@ -471,7 +521,9 @@ const Builder = ({ options, layout, mode }) => {
                               ? faCaretSquareLeft
                               : faCaretSquareRight
                           }
-                          className={"float-end fa-lg"}
+                          className={
+                            "float-end fa-lg builder-expand-toggle-left"
+                          }
                           onClick={() => setIsLeftEnlarged(!isLeftEnlarged)}
                           title={isLeftEnlarged ? "Shrink" : "Enlarge"}
                         />
@@ -545,7 +597,9 @@ const Builder = ({ options, layout, mode }) => {
                         icon={
                           isEnlarged ? faCaretSquareRight : faCaretSquareLeft
                         }
-                        className={"float-end me-2 mt-1 fa-lg"}
+                        className={
+                          "float-end me-2 mt-1 fa-lg builder-expand-toggle-right"
+                        }
                         onClick={() => setIsEnlarged(!isEnlarged)}
                         title={isEnlarged ? "Shrink" : "Enlarge"}
                       />

package/src/components/Toolbox.js

@@ -619,7 +619,9 @@ const ToolboxList = ({ expanded }) => {
       !disable_toolbox?.view && (
         <ViewElem connectors={connectors} views={views} />
       ),
-      // <ContainerElem connectors={connectors} />,
+      !disable_toolbox?.dropdown_menu && (
+        <ContainerElem connectors={connectors} />
+      ),
       // <CardElem connectors={connectors} />,
       //  <TabsElem connectors={connectors} />,
       <HTMLElem connectors={connectors} />,

package/src/components/elements/Action.js

@@ -197,7 +197,7 @@ const ActionSettings = () => {
                   setInitialConfig(setProp, value, getCfgFields(value));
                 }}
               >
-                {options.actions.map((f, ix) =>
+                {options.actions.filter(Boolean).map((f, ix) =>
                   f.optgroup && !f.options.length ? null : f.optgroup ? (
                     <optgroup key={ix} label={f.label}>
                       {f.options.map((a, jx) => (

package/src/components/elements/Container.js

@@ -942,10 +942,10 @@ const ContainerSettings = () => {
       </table>
       <table className="w-100" accordiontitle="Show if...">
         <tbody>
-          {["show", "edit", "filter"].includes(options.mode) && (
+          {["show", "edit", "filter", "list"].includes(options.mode) && (
             <SettingsSectionHeaderRow title="Formula - show if true" />
           )}
-          {["show", "edit", "filter"].includes(options.mode) && (
+          {["show", "edit", "filter", "list"].includes(options.mode) && (
             <tr>
               <td colSpan={2}>
                 <input