@adaptabletools/adaptable 11.1.12 → 11.1.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "11.1.12",
+  "version": "11.1.13",
   "description": "Powerful data-agnostic HTML5 datagrid add-on that sits on top of an underlying grid component and provides all the rich functionality that advanced users expect from their DataGrids and Data Tables",
   "keywords": [
     "web-components",

package/publishTimestamp.d.ts

@@ -1,2 +1,2 @@
-declare const _default: 1651266602932;
+declare const _default: 1651319806713;
 export default _default;

package/publishTimestamp.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = 1651266602932;
+exports.default = 1651319806713;

package/src/PredefinedConfig/Common/AdaptableForm.d.ts

@@ -1,4 +1,5 @@
 import { AdaptableButton, ButtonContext } from './AdaptableButton';
+import { AdaptableFormConfig } from '../../components/FormLayout';
 export declare type AdaptableFormData = Record<string, any>;
 /**
  * Defines a form which appears dynamically; used by Alerts & Export Custom Destinations
@@ -15,11 +16,15 @@ export interface AdaptableForm<T extends ButtonContext> {
     /**
      * Collection of Dynamic Fields to display
      */
-    fields?: AdaptableFormField[];
+    fields?: (AdaptableFormField | AdaptableFormField[])[];
     /**
      * Buttons to include in the Form
      */
     buttons?: AdaptableButton<T>[];
+    /**
+     * @internal do NOT use this property as it's in an experimental phase
+     */
+    config?: AdaptableFormConfig;
 }
 /**
  * Defines a Field that appears in an Adaptable Form
@@ -34,9 +39,9 @@ export interface AdaptableFormField {
      */
     label: string;
     /**
-     * Field Type: text, date, number, checkbox, select
+     * Field Type: text, date, number, checkbox, select, textOutput
      */
-    fieldType: 'text' | 'select' | 'date' | 'number' | 'checkbox';
+    fieldType: 'text' | 'select' | 'date' | 'number' | 'checkbox' | 'textOutput';
     /**
      * Field Default Value - can be of type string, boolean, number
      */

package/src/PredefinedConfig/Common/AdaptableForm.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getDefaultAdaptableFormData = void 0;
 function getDefaultAdaptableFormData(formDef) {
-    return (formDef.fields || []).reduce((data, field) => {
+    return (formDef.fields || []).flat().reduce((data, field) => {
         var _a;
         data[field.name] = (_a = field.defaultValue) !== null && _a !== void 0 ? _a : '';
         return data;

package/src/components/AdaptableFormComponent/AdaptableFormComponent.js

@@ -32,7 +32,7 @@ function AdaptableFormComponentButtons({ formDef, onClick, defaultTone, disabled
 }
 exports.AdaptableFormComponentButtons = AdaptableFormComponentButtons;
 function AdaptableFormComponent({ formDef, data, onChange, onButtonClick, displayTitle, api, context, focusFirstButton, }) {
-    var _a;
+    var _a, _b, _c;
     const getFieldValue = (key) => data[key];
     const setFieldValue = (key, value) => {
         const newData = Object.assign(Object.assign({}, data), { [key]: value });
@@ -43,6 +43,9 @@ function AdaptableFormComponent({ formDef, data, onChange, onButtonClick, displa
         const isValid = !!button.disabled && !!context ? !button.disabled(button, context) : true;
         return !isValid;
     })) !== null && _b !== void 0 ? _b : []; }, [data]);
+    const renderLabel = (field) => {
+        return (React.createElement(rebass_1.Box, { className: 'ab-FormLayout_column--label', style: { textAlign: 'end' } }, field.label));
+    };
     const renderField = (field) => {
         var _a;
         const value = (_a = getFieldValue(field.name)) !== null && _a !== void 0 ? _a : '';
@@ -81,16 +84,35 @@ function AdaptableFormComponent({ formDef, data, onChange, onButtonClick, displa
                 return (React.createElement(Input_1.default, { type: "checkbox", name: field.name, checked: value, onChange: (event) => {
                         setFieldValue(field.name, event.target.checked);
                     } }));
+            case 'textOutput':
+                return React.createElement(rebass_1.Box, { style: { textAlign: 'center' } }, value);
             default:
                 return React.createElement("div", null,
                     "Unknown field type: ",
                     field.fieldType);
         }
     };
+    // by default we have 2 columns: label & input
+    const columns = (_b = (_a = formDef.config) === null || _a === void 0 ? void 0 : _a.columns) !== null && _b !== void 0 ? _b : [1, 2];
     return (React.createElement(React.Fragment, null,
         displayTitle && formDef.title && (React.createElement(rebass_1.Box, { fontSize: 5, mb: 2, style: { fontWeight: 'bold' } }, formDef.title)),
         formDef.description && React.createElement(rebass_1.Box, { mb: 3 }, formDef.description),
-        React.createElement(FormLayout_1.default, null, (_a = formDef.fields) === null || _a === void 0 ? void 0 : _a.map((field) => (React.createElement(FormLayout_1.FormRow, { key: field.name, label: field.label }, renderField(field))))),
+        React.createElement(FormLayout_1.default, { columns: columns }, (_c = formDef.fields) === null || _c === void 0 ? void 0 : _c.map((field, index) => {
+            if (Array.isArray(field)) {
+                const rowFields = {};
+                field.map((fieldItem, index) => {
+                    const rowFieldIndex = 2 * index + 1;
+                    rowFields[rowFieldIndex] = renderLabel(fieldItem);
+                    rowFields[rowFieldIndex + 1] = renderField(fieldItem);
+                });
+                return React.createElement(FormLayout_1.FormRow, Object.assign({ key: index }, rowFields));
+            }
+            else {
+                return (React.createElement(FormLayout_1.FormRow, { key: field.name },
+                    renderLabel(field),
+                    renderField(field)));
+            }
+        })),
         formDef.buttons ? (React.createElement(rebass_1.Flex, { marginTop: 3, flexDirection: "row", alignItems: "center", justifyContent: "center" },
             React.createElement(AdaptableFormComponentButtons, { focusFirstButton: focusFirstButton, onClick: onButtonClick, disabledButtons: disabledButtons, defaultTone: "success", formDef: formDef, api: api, context: context }))) : null));
 }

package/src/metamodel/adaptable.metamodel.js

@@ -837,7 +837,7 @@ exports.ADAPTABLE_METAMODEL = {
             {
                 "name": "fieldType",
                 "kind": "unknown",
-                "description": "Field Type: text, date, number, checkbox, select",
+                "description": "Field Type: text, date, number, checkbox, select, textOutput",
                 "uiLabel": "Field Type"
             },
             {

package/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "11.1.12";
+declare const _default: "11.1.13";
 export default _default;

package/version.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = '11.1.12'; // PLEASE DONT UPDATE THIS!!! - will be updated at build time with the correct version
+exports.default = '11.1.13'; // PLEASE DONT UPDATE THIS!!! - will be updated at build time with the correct version