@pareto-engineering/design-system 5.3.0 → 5.4.0

package/dist/cjs/g/ExpandableLexicalPreview/ExpandableLexicalPreview.js

@@ -1,139 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
-var _formik = require("formik");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
-var _f = require("../../f");
-var _b = require("../../b");
-var _common = require("./common");
-require("./styles.scss");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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; }
-/* @pareto-engineering/generator-front 1.0.12 */
-
-// Local Definitions
-
-const baseClassName = _exports.default.base;
-const componentClassName = 'expandable-lexical-preview';
-
-/**
- * This is the component description.
- */
-const ExpandableLexicalPreview = _ref => {
-  let {
-    id,
-    className: userClassName,
-    style,
-    nodes,
-    name,
-    color,
-    resize,
-    pageTitle,
-    onBlock,
-    onOpen,
-    header,
-    rows
-    // ...otherProps
-  } = _ref;
-  const [isCollapsed, setIsCollapsed] = (0, _react.useState)(false);
-  const handleButtonClick = () => {
-    setIsCollapsed(!isCollapsed);
-  };
-  return /*#__PURE__*/React.createElement(_formik.Formik, {
-    initialValues: {
-      [name]: nodes
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [baseClassName, componentClassName, userClassName, `y-${color}`, isCollapsed && 'collapsed'].filter(e => e).join(' '),
-    style: style
-  }, typeof header === 'string' ? /*#__PURE__*/React.createElement("p", {
-    className: "title h2"
-  }, header) : header, isCollapsed ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_b.Button, {
-    onClick: handleButtonClick,
-    color: "background-far",
-    isCompact: true
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "ai-icon c-x x-paragraph"
-  }, "C")), /*#__PURE__*/React.createElement(_common.NewWindowPortal, {
-    pageTitle: pageTitle,
-    onBlock: () => {
-      onBlock?.();
-      setIsCollapsed(false);
-    },
-    onOpen: () => {
-      onOpen?.();
-      setIsCollapsed(true);
-    }
-  }, /*#__PURE__*/React.createElement(_f.EditorInput, {
-    name: name,
-    resize: resize,
-    disabled: true
-  }))) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_f.EditorInput, {
-    name: name,
-    resize: resize,
-    disabled: true,
-    id: `${id}-editor-input`,
-    rows: rows
-  }), /*#__PURE__*/React.createElement(_b.Button, {
-    id: id,
-    className: "expand-button ai-icon",
-    color: "background-far",
-    isCompact: true,
-    onClick: handleButtonClick
-  }, "D"))));
-};
-ExpandableLexicalPreview.propTypes = {
-  /**
-   * The HTML id for this element
-   */
-  id: _propTypes.default.string,
-  /**
-   * The HTML class names for this element
-   */
-  className: _propTypes.default.string,
-  /**
-   * The React-written, css properties for this element.
-   */
-  style: _propTypes.default.objectOf(_propTypes.default.string),
-  /**
-   * Color of the text
-   */
-  color: _propTypes.default.string,
-  /**
-   * The nodes to render in the form of a json string
-   */
-  nodes: _propTypes.default.string,
-  /**
-   * The resize property of the textarea
-   */
-  resize: _propTypes.default.string,
-  /**
-   * The header for the preview component.
-   */
-  header: _propTypes.default.node,
-  /**
-   * The page title for the expanded preview.
-   */
-  pageTitle: _propTypes.default.string,
-  /**
-   * The name used to acces the nodes
-   */
-  name: _propTypes.default.string.isRequired,
-  /**
-   * The function to run when a new window portal can be opened
-   */
-  onBlock: _propTypes.default.func.isRequired
-};
-ExpandableLexicalPreview.defaultProps = {
-  color: 'paragraph',
-  resize: 'vertical'
-};
-var _default = exports.default = ExpandableLexicalPreview;

package/dist/cjs/g/ExpandableLexicalPreview/common/NewWindowPortal/NewWindowPortal.js

@@ -1,79 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _reactDom = require("react-dom");
-var _react = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
-var _a = require("../../../../a");
-require("./styles.scss");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/* @pareto-engineering/generator-front 1.0.12 */
-
-// Local Definitions
-
-const baseClassName = _exports.default.base;
-const copyStyles = (sourceDocument, targetDocument) => {
-  Array.from(sourceDocument.querySelectorAll('link[rel="stylesheet"], style')).forEach(link => {
-    targetDocument.head.appendChild(link.cloneNode(true));
-  });
-};
-/**
- * This is the component description.
- */
-const NewWindowPortal = _ref => {
-  let {
-    children,
-    pageTitle,
-    onBlock,
-    onOpen
-  } = _ref;
-  const [newWindow, setNewWindow] = (0, _react.useState)(null);
-  const container = (0, _react.useMemo)(() => document.createElement('div'), []);
-  const {
-    userTheme = 'light'
-  } = (0, _a.useTheme)();
-  (0, _react.useEffect)(() => {
-    if (!container) return;
-    container.classList.add(baseClassName, 'new-window-portal', `ui-${userTheme}`);
-    const newExternalWindow = window.open('', pageTitle, 'width="100%",height="100%"');
-    if (newExternalWindow) {
-      newExternalWindow.document.title = pageTitle;
-      newExternalWindow.document.body.appendChild(container);
-      setNewWindow(newExternalWindow);
-      onOpen();
-    } else {
-      console.warn('A new window / tab could not be opened. Check your settings and/or extensions, maybe it was blocked.');
-      onBlock();
-    }
-
-    // eslint-disable-next-line consistent-return
-    return () => {
-      container.classList.remove(...container.classList);
-      newExternalWindow?.close();
-    };
-  }, [container, pageTitle, userTheme]);
-  (0, _react.useEffect)(() => {
-    if (newWindow) {
-      copyStyles(document, newWindow.document);
-    }
-  }, [newWindow]);
-  return /*#__PURE__*/(0, _reactDom.createPortal)(children, container);
-};
-NewWindowPortal.propTypes = {
-  /**
-   *  The children JSX
-   */
-  children: _propTypes.default.node,
-  /**
-   * The new window page title
-   */
-  pageTitle: _propTypes.default.string.isRequired
-};
-NewWindowPortal.defaultProps = {
-  // someProp:false
-};
-var _default = exports.default = NewWindowPortal;

package/dist/cjs/g/ExpandableLexicalPreview/common/NewWindowPortal/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "NewWindowPortal", {
-  enumerable: true,
-  get: function () {
-    return _NewWindowPortal.default;
-  }
-});
-var _NewWindowPortal = _interopRequireDefault(require("./NewWindowPortal"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/dist/cjs/g/ExpandableLexicalPreview/common/NewWindowPortal/styles.scss

@@ -1,9 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-
-@use "@pareto-engineering/bem";
-
-.#{bem.$base}.new-window-portal {
-  background-color: var(--background-far);
-  height: 100%;
-  width: 100%;
-}

package/dist/cjs/g/ExpandableLexicalPreview/common/index.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "NewWindowPortal", {
-  enumerable: true,
-  get: function () {
-    return _NewWindowPortal.NewWindowPortal;
-  }
-});
-var _NewWindowPortal = require("./NewWindowPortal");

package/dist/cjs/g/ExpandableLexicalPreview/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "ExpandableLexicalPreview", {
-  enumerable: true,
-  get: function () {
-    return _ExpandableLexicalPreview.default;
-  }
-});
-var _ExpandableLexicalPreview = _interopRequireDefault(require("./ExpandableLexicalPreview"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/dist/cjs/g/ExpandableLexicalPreview/styles.scss

@@ -1,33 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-
-@use "@pareto-engineering/bem";
-
-.#{bem.$base}.expandable-lexical-preview {
-  display: flex;
-  flex-direction: column;
-  flex-wrap: wrap;
-  gap: var(--gap);
-  position: relative;
-  width: 100%;
-
-  &.collapsed {
-    flex-direction: row;
-  }
-
-  > .title {
-    margin: 0;
-  }
-
-  > .#{bem.$base}.button {
-    align-items: center;
-    border: 1px solid var(--outline-inputs);
-    display: flex;
-  }
-
-  > .#{bem.$base}.expand-button {
-    border: 1px solid var(--outline-inputs);
-    position: absolute;
-    right: 1em;
-    top: 5.5rem;
-  }
-}

package/dist/cjs/g/FormBuilder/FormBuilder.js

@@ -1,127 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
-require("./styles.scss");
-var _common = require("./common");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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; }
-/* @pareto-engineering/generator-front 1.1.1-alpha.2 */
-
-// Local Definitions
-
-const baseClassName = _exports.default.base;
-const componentClassName = 'form-builder';
-
-/**
- * This is the component description.
- */
-const FormBuilder = _ref => {
-  let {
-    id,
-    className: userClassName,
-    style,
-    mode,
-    formData,
-    readOnly,
-    shouldSubmit,
-    formBuilderId,
-    onBuilderFormSave,
-    onBuilderError,
-    onRendererFormSave,
-    onFileUpload,
-    onBuilderValidate,
-    initialBuilderValues,
-    fileUploadStatus,
-    handleFileDelete,
-    taskData
-    // ...otherProps
-  } = _ref;
-  const formattedJson = JSON.stringify(taskData, null, 2);
-  return /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
-    style: style
-    // {...otherProps}
-  }, taskData && /*#__PURE__*/React.createElement("pre", {
-    className: "task-data md-span-12 span-8 s-1"
-  }, formattedJson), mode === 'build' && /*#__PURE__*/React.createElement(_common.Builder, {
-    initialValues: initialBuilderValues,
-    formBuilderId: formBuilderId,
-    onSave: onBuilderFormSave,
-    onError: onBuilderError,
-    validate: onBuilderValidate
-  }), mode === 'render' && /*#__PURE__*/React.createElement(_common.Renderer, {
-    formData: formData,
-    onSave: onRendererFormSave,
-    readOnly: readOnly,
-    shouldSubmit: shouldSubmit,
-    fileUploadStatus: fileUploadStatus,
-    handleFileDelete: handleFileDelete,
-    onFileUpload: onFileUpload
-  }));
-};
-FormBuilder.propTypes = {
-  /**
-   * The HTML id for this element
-   */
-  id: _propTypes.default.string,
-  /**
-   * The HTML class names for this element
-   */
-  className: _propTypes.default.string,
-  /**
-   * The React-written, css properties for this element.
-   */
-  style: _propTypes.default.objectOf(_propTypes.default.string),
-  /**
-   * The mode of the form builder to determine whether to render a form or build a form
-   */
-  mode: _propTypes.default.oneOf(['build', 'render']),
-  /**
-   * This is the ID of the form element in the <Builder /> component
-   */
-  formBuilderId: _propTypes.default.string.isRequired,
-  /**
-   *  The form data to be used to construct the form builder in renderer mode
-   */
-  formData: _propTypes.default.shape({
-    sections: _propTypes.default.arrayOf(_propTypes.default.objectOf(_propTypes.default.any))
-  }),
-  /**
-   *  The initial values to instatiate form builder in builder mode
-   */
-  initialBuilderValues: _propTypes.default.shape({
-    sections: _propTypes.default.arrayOf(_propTypes.default.objectOf(_propTypes.default.any))
-  }),
-  /**
-   * Whether the whole Form in renderer mode should be readOnly
-   */
-  readOnly: _propTypes.default.bool,
-  /**
-   * Whether the form builder in renderer mode should submit the form values itself
-   */
-  shouldSubmit: _propTypes.default.bool,
-  /**
-   * The upload status of files if any
-   */
-  fileUploadStatus: _propTypes.default.objectOf(_propTypes.default.string),
-  /**
-   * The task preview data
-   */
-  // eslint-disable-next-line react/forbid-prop-types
-  taskData: _propTypes.default.objectOf(_propTypes.default.any)
-};
-FormBuilder.defaultProps = {
-  mode: 'build',
-  readOnly: false
-};
-FormBuilder.Builder = _common.Builder;
-FormBuilder.Renderer = _common.Renderer;
-var _default = exports.default = FormBuilder;

package/dist/cjs/g/FormBuilder/common/Builder/Builder.js

@@ -1,193 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
-var _formik = require("formik");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
-var _f = require("../../../../f");
-var _common = require("./common");
-require("./styles.scss");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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; }
-/* @pareto-engineering/generator-front 1.1.1-alpha.2 */
-
-// Local Definitions
-
-const baseClassName = _exports.default.base;
-const componentClassName = 'builder';
-const reorderInputs = values => {
-  const valuesCopy = JSON.parse(JSON.stringify(values));
-  valuesCopy.sections.forEach(section => {
-    const orderMap = new Map();
-    section.orderedInputDragIds.forEach((id, index) => orderMap.set(id, index));
-    section.inputs.sort((a, b) => orderMap.get(a.name) - orderMap.get(b.name));
-  });
-  return valuesCopy;
-};
-
-/**
- */
-const Builder = _ref => {
-  let {
-    id,
-    className: userClassName,
-    style,
-    onSave,
-    onError,
-    validate,
-    formBuilderId,
-    initialValues = {}
-    // ...otherProps
-  } = _ref;
-  const handleSubmit = values => {
-    const reOrderedValues = reorderInputs(values);
-    onSave?.(reOrderedValues);
-  };
-  const initialFormState = initialValues?.sections ? initialValues : {
-    sections: [{
-      title: '',
-      description: '',
-      key: 'section-0',
-      inputs: [],
-      orderedInputDragIds: [],
-      navigation: {
-        nextSection: 'next'
-      }
-    }]
-  };
-  const handleDeleteSection = _ref2 => {
-    let {
-      index,
-      remove,
-      values
-    } = _ref2;
-    remove(index);
-    values.sections.splice(index, 1);
-    values.sections.forEach((section, sectionIndex) => {
-      section.inputs.forEach((input, inputIndex) => {
-        // eslint-disable-next-line no-param-reassign
-        input.name = `section_${sectionIndex}_input_${inputIndex}`;
-      });
-    });
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    id: id,
-    className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
-    style: style
-  }, /*#__PURE__*/React.createElement("p", {
-    className: "h3"
-  }, "Form Builder"), /*#__PURE__*/React.createElement(_formik.Formik, {
-    initialValues: initialFormState,
-    onSubmit: handleSubmit,
-    validate: validate
-  }, _ref3 => {
-    let {
-      values,
-      errors,
-      setFieldValue
-    } = _ref3;
-    (0, _react.useEffect)(() => {
-      const reOrderedValues = reorderInputs(values);
-      onSave?.(reOrderedValues);
-    }, [values]);
-    (0, _react.useEffect)(() => {
-      onError?.(errors);
-    }, [errors, values]);
-    const availableSections = values?.sections?.map((section, idx) => ({
-      value: idx,
-      label: `Go to ${section.title || `Untitled Section ${idx + 1}`}`
-    }));
-    return /*#__PURE__*/React.createElement(_formik.Form, {
-      id: formBuilderId
-    }, /*#__PURE__*/React.createElement(_formik.FieldArray, {
-      name: "sections"
-    }, _ref4 => {
-      let {
-        push,
-        remove
-      } = _ref4;
-      return /*#__PURE__*/React.createElement(React.Fragment, null, values?.sections?.map((section, index) => /*#__PURE__*/React.createElement(_common.Section, {
-        key: section.key,
-        index: index,
-        handleDeleteSection: () => handleDeleteSection({
-          index,
-          remove,
-          values,
-          setFieldValue
-        })
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "section-footer"
-      }, /*#__PURE__*/React.createElement("button", {
-        className: "add-section-cta",
-        type: "button",
-        onClick: () => {
-          const currentIndex = values.sections.length;
-          return push({
-            title: '',
-            description: '',
-            key: `section-${currentIndex}`,
-            inputs: [{
-              type: 'text',
-              options: [],
-              required: true,
-              description: '',
-              name: `section_${values.sections.length}_input_0`,
-              label: ''
-            }],
-            orderedInputDragIds: [],
-            navigation: {
-              nextSection: 'next'
-            }
-          });
-        }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "icon-container"
-      }, /*#__PURE__*/React.createElement("span", {
-        className: "icon"
-      }, "+")), /*#__PURE__*/React.createElement("span", {
-        className: "text x-paragraph c-x"
-      }, "Add Section")), /*#__PURE__*/React.createElement("div", {
-        className: "section-navigation"
-      }, /*#__PURE__*/React.createElement("span", {
-        className: "x-paragraph c-x"
-      }, "After Section", ' ', values.sections.length), /*#__PURE__*/React.createElement(_f.SelectInput, {
-        name: `sections.${values.sections.length - 1}.navigation.nextSection`,
-        options: [{
-          label: 'Select section',
-          value: '',
-          disabled: true
-        }, {
-          label: 'Continue to next section',
-          value: 'next'
-        }, ...availableSections, {
-          label: 'Submit form',
-          value: 'submit'
-        }]
-      }))));
-    }));
-  }));
-};
-Builder.propTypes = {
-  /**
-   * The HTML id for this element
-   */
-  id: _propTypes.default.string,
-  /**
-   * The HTML class names for this element
-   */
-  className: _propTypes.default.string,
-  /**
-   * The React-written, css properties for this element.
-   */
-  style: _propTypes.default.objectOf(_propTypes.default.string)
-};
-Builder.defaultProps = {
-  // someProp:false
-};
-var _default = exports.default = Builder;