payload 0.20.0 → 0.20.1

package/dist/admin/components/forms/Form/types.d.ts

@@ -0,0 +1,78 @@
+import React from 'react';
+import { Field as FieldConfig, Condition, Validate } from '../../../../fields/config/types';
+export declare type Field = {
+    value: unknown;
+    initialValue: unknown;
+    errorMessage?: string;
+    valid: boolean;
+    validate?: Validate;
+    disableFormData?: boolean;
+    condition?: Condition;
+    passesCondition?: boolean;
+};
+export declare type Fields = {
+    [path: string]: Field;
+};
+export declare type Data = {
+    [key: string]: any;
+};
+export declare type Preferences = {
+    [key: string]: unknown;
+};
+export declare type Props = {
+    disabled?: boolean;
+    onSubmit?: (fields: Fields, data: Data) => void;
+    method?: 'get' | 'put' | 'delete' | 'post';
+    action?: string;
+    handleResponse?: (res: Response) => void;
+    onSuccess?: (json: unknown) => void;
+    className?: string;
+    redirect?: string;
+    disableSuccessStatus?: boolean;
+    initialState?: Fields;
+    initialData?: Data;
+    waitForAutocomplete?: boolean;
+    log?: boolean;
+    validationOperation?: 'create' | 'update';
+    children?: React.ReactNode;
+};
+export declare type SubmitOptions = {
+    action?: string;
+    method?: string;
+    overrides?: Record<string, unknown>;
+    skipValidation?: boolean;
+};
+export declare type DispatchFields = React.Dispatch<any>;
+export declare type Submit = (options?: SubmitOptions, e?: React.FormEvent<HTMLFormElement>) => void;
+export declare type ValidateForm = () => Promise<boolean>;
+export declare type CreateFormData = (overrides?: any) => FormData;
+export declare type GetFields = () => Fields;
+export declare type GetField = (path: string) => Field;
+export declare type GetData = () => Data;
+export declare type GetSiblingData = (path: string) => Data;
+export declare type GetUnflattenedValues = () => Data;
+export declare type GetDataByPath = <T = unknown>(path: string) => T;
+export declare type SetModified = (modified: boolean) => void;
+export declare type SetSubmitted = (submitted: boolean) => void;
+export declare type SetProcessing = (processing: boolean) => void;
+export declare type Reset = (fieldSchema: FieldConfig[], data: unknown) => Promise<void>;
+export declare type Context = {
+    dispatchFields: DispatchFields;
+    submit: Submit;
+    fields: Fields;
+    initialState: Fields;
+    validateForm: ValidateForm;
+    createFormData: CreateFormData;
+    disabled: boolean;
+    getFields: GetFields;
+    getField: GetField;
+    getData: GetData;
+    getSiblingData: GetSiblingData;
+    getUnflattenedValues: GetUnflattenedValues;
+    getDataByPath: GetDataByPath;
+    setModified: SetModified;
+    setProcessing: SetProcessing;
+    setSubmitted: SetSubmitted;
+    formRef: React.MutableRefObject<HTMLFormElement>;
+    reset: Reset;
+};

package/dist/admin/components/forms/Form/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvYWRtaW4vY29tcG9uZW50cy9mb3Jtcy9Gb3JtL3R5cGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIifQ==

package/dist/admin/components/forms/Label/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Props } from './types';
+import './index.scss';
+declare const Label: React.FC<Props>;
+export default Label;

package/dist/admin/components/forms/Label/index.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import './index.scss';
+const Label = (props) => {
+    const { label, required = false, htmlFor, } = props;
+    if (label) {
+        return (React.createElement("label", { htmlFor: htmlFor, className: "field-label" },
+            label,
+            required && React.createElement("span", { className: "required" }, "*")));
+    }
+    return null;
+};
+export default Label;

package/dist/admin/components/forms/Label/index.scss

@@ -0,0 +1,13 @@
+@import '../../../scss/styles.scss';
+
+label.field-label {
+  display: flex;
+  padding-bottom: base(.25);
+  color: $color-dark-gray;
+
+  .required {
+    color: $color-red;
+    margin-left: base(.25);
+    margin-right: auto;
+  }
+}

package/dist/admin/components/forms/Label/types.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare type Props = {
+    label?: string | false | JSX.Element;
+    required?: boolean;
+    htmlFor?: string;
+};

package/dist/admin/components/forms/Label/types.js

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

package/dist/admin/components/forms/RenderFields/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { Props } from './types';
+declare const RenderFields: React.FC<Props>;
+export default RenderFields;

package/dist/admin/components/forms/RenderFields/index.js

@@ -0,0 +1,77 @@
+import React, { useEffect, useState } from 'react';
+import RenderCustomComponent from '../../utilities/RenderCustomComponent';
+import useIntersect from '../../../hooks/useIntersect';
+import { fieldAffectsData, fieldIsPresentationalOnly } from '../../../../fields/config/types';
+import { useOperation } from '../../utilities/OperationProvider';
+const baseClass = 'render-fields';
+const intersectionObserverOptions = {
+    rootMargin: '1000px',
+};
+const RenderFields = (props) => {
+    var _a;
+    const { fieldSchema, fieldTypes, filter, permissions, readOnly: readOnlyOverride, className, } = props;
+    const [hasRendered, setHasRendered] = useState(false);
+    const [intersectionRef, entry] = useIntersect(intersectionObserverOptions);
+    const operation = useOperation();
+    const isIntersecting = Boolean(entry === null || entry === void 0 ? void 0 : entry.isIntersecting);
+    const isAboveViewport = ((_a = entry === null || entry === void 0 ? void 0 : entry.boundingClientRect) === null || _a === void 0 ? void 0 : _a.top) < 0;
+    const shouldRender = isIntersecting || isAboveViewport;
+    useEffect(() => {
+        if (shouldRender && !hasRendered) {
+            setHasRendered(true);
+        }
+    }, [shouldRender, hasRendered]);
+    const classes = [
+        baseClass,
+        className,
+    ].filter(Boolean).join(' ');
+    if (fieldSchema) {
+        return (React.createElement("div", { ref: intersectionRef, className: classes }, hasRendered && (fieldSchema.map((field, i) => {
+            var _a, _b, _c, _d, _e, _f, _g, _h;
+            const fieldIsPresentational = fieldIsPresentationalOnly(field);
+            let FieldComponent = fieldTypes[field.type];
+            if (fieldIsPresentational || (!(field === null || field === void 0 ? void 0 : field.hidden) && ((_a = field === null || field === void 0 ? void 0 : field.admin) === null || _a === void 0 ? void 0 : _a.disabled) !== true)) {
+                if ((filter && typeof filter === 'function' && filter(field)) || !filter) {
+                    if (fieldIsPresentational) {
+                        return (React.createElement(FieldComponent, { ...field, key: i }));
+                    }
+                    if ((_b = field === null || field === void 0 ? void 0 : field.admin) === null || _b === void 0 ? void 0 : _b.hidden) {
+                        FieldComponent = fieldTypes.hidden;
+                    }
+                    const isFieldAffectingData = fieldAffectsData(field);
+                    const fieldPermissions = isFieldAffectingData ? permissions === null || permissions === void 0 ? void 0 : permissions[field.name] : permissions;
+                    let { admin: { readOnly } = {} } = field;
+                    if (readOnlyOverride && readOnly !== false)
+                        readOnly = true;
+                    if ((isFieldAffectingData && ((_d = (_c = permissions === null || permissions === void 0 ? void 0 : permissions[field === null || field === void 0 ? void 0 : field.name]) === null || _c === void 0 ? void 0 : _c.read) === null || _d === void 0 ? void 0 : _d.permission) !== false) || !isFieldAffectingData) {
+                        if (isFieldAffectingData && ((_f = (_e = permissions === null || permissions === void 0 ? void 0 : permissions[field === null || field === void 0 ? void 0 : field.name]) === null || _e === void 0 ? void 0 : _e[operation]) === null || _f === void 0 ? void 0 : _f.permission) === false) {
+                            readOnly = true;
+                        }
+                        if (FieldComponent) {
+                            return (React.createElement(RenderCustomComponent, { key: i, CustomComponent: (_h = (_g = field === null || field === void 0 ? void 0 : field.admin) === null || _g === void 0 ? void 0 : _g.components) === null || _h === void 0 ? void 0 : _h.Field, DefaultComponent: FieldComponent, componentProps: {
+                                    ...field,
+                                    path: field.path || (isFieldAffectingData ? field.name : undefined),
+                                    fieldTypes,
+                                    admin: {
+                                        ...(field.admin || {}),
+                                        readOnly,
+                                    },
+                                    permissions: fieldPermissions,
+                                } }));
+                        }
+                        return (React.createElement("div", { className: "missing-field", key: i },
+                            "No matched field found for",
+                            ' ',
+                            "\"",
+                            field.label,
+                            "\""));
+                    }
+                }
+                return null;
+            }
+            return null;
+        }))));
+    }
+    return null;
+};
+export default RenderFields;

package/dist/admin/components/forms/RenderFields/types.d.ts

@@ -0,0 +1,13 @@
+import { FieldPermissions } from '../../../../auth/types';
+import { FieldWithPath, Field } from '../../../../fields/config/types';
+import { FieldTypes } from '../field-types';
+export declare type Props = {
+    className?: string;
+    readOnly?: boolean;
+    permissions?: {
+        [field: string]: FieldPermissions;
+    };
+    filter?: (field: Field) => boolean;
+    fieldSchema: FieldWithPath[];
+    fieldTypes: FieldTypes;
+};

package/dist/admin/components/forms/RenderFields/types.js

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

package/dist/admin/components/forms/Submit/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Props } from '../../elements/Button/types';
+import './index.scss';
+declare const FormSubmit: React.FC<Props>;
+export default FormSubmit;

package/dist/admin/components/forms/Submit/index.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { useForm, useFormProcessing } from '../Form/context';
+import Button from '../../elements/Button';
+import './index.scss';
+const baseClass = 'form-submit';
+const FormSubmit = (props) => {
+    const { children, disabled: disabledFromProps, type = 'submit' } = props;
+    const processing = useFormProcessing();
+    const { disabled } = useForm();
+    return (React.createElement("div", { className: baseClass },
+        React.createElement(Button, { ...props, type: type, disabled: disabledFromProps || processing || disabled ? true : undefined }, children)));
+};
+export default FormSubmit;

package/dist/admin/components/forms/Submit/index.scss

@@ -0,0 +1,5 @@
+form > .form-submit {
+  .btn {
+    width: 100%;
+  }
+}

package/dist/admin/components/forms/field-types/Array/Array.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Props } from './types';
+import './index.scss';
+declare const _default: React.FC<Props>;
+export default _default;

package/dist/admin/components/forms/field-types/Array/Array.js

@@ -0,0 +1,116 @@
+import React, { useCallback, useEffect, useReducer, useState } from 'react';
+import { DragDropContext, Droppable } from 'react-beautiful-dnd';
+import { useAuth } from '../../../utilities/Auth';
+import withCondition from '../../withCondition';
+import Button from '../../../elements/Button';
+import DraggableSection from '../../DraggableSection';
+import reducer from '../rowReducer';
+import { useForm } from '../../Form/context';
+import buildStateFromSchema from '../../Form/buildStateFromSchema';
+import useField from '../../useField';
+import { useLocale } from '../../../utilities/Locale';
+import Error from '../../Error';
+import { array } from '../../../../../fields/validations';
+import Banner from '../../../elements/Banner';
+import FieldDescription from '../../FieldDescription';
+import { useDocumentInfo } from '../../../utilities/DocumentInfo';
+import { useOperation } from '../../../utilities/OperationProvider';
+import './index.scss';
+const baseClass = 'field-type array';
+const ArrayFieldType = (props) => {
+    var _a, _b;
+    const { name, path: pathFromProps, fields, fieldTypes, validate = array, required, maxRows, minRows, permissions, admin: { readOnly, description, condition, className, }, } = props;
+    // Handle labeling for Arrays, Global Arrays, and Blocks
+    const getLabels = (p) => {
+        if (p === null || p === void 0 ? void 0 : p.labels)
+            return p.labels;
+        if (p === null || p === void 0 ? void 0 : p.label)
+            return { singular: p.label, plural: undefined };
+        return { singular: 'Row', plural: 'Rows' };
+    };
+    const labels = getLabels(props);
+    // eslint-disable-next-line react/destructuring-assignment
+    const label = (_a = props === null || props === void 0 ? void 0 : props.label) !== null && _a !== void 0 ? _a : (_b = props === null || props === void 0 ? void 0 : props.labels) === null || _b === void 0 ? void 0 : _b.singular;
+    const [rows, dispatchRows] = useReducer(reducer, []);
+    const formContext = useForm();
+    const { user } = useAuth();
+    const { id } = useDocumentInfo();
+    const locale = useLocale();
+    const operation = useOperation();
+    const { dispatchFields } = formContext;
+    const path = pathFromProps || name;
+    const memoizedValidate = useCallback((value, options) => {
+        return validate(value, { ...options, minRows, maxRows, required });
+    }, [maxRows, minRows, required, validate]);
+    const [disableFormData, setDisableFormData] = useState(false);
+    const { showError, errorMessage, value, setValue, } = useField({
+        path,
+        validate: memoizedValidate,
+        disableFormData,
+        condition,
+    });
+    const addRow = useCallback(async (rowIndex) => {
+        const subFieldState = await buildStateFromSchema({ fieldSchema: fields, operation, id, user, locale });
+        dispatchFields({ type: 'ADD_ROW', rowIndex, subFieldState, path });
+        dispatchRows({ type: 'ADD', rowIndex });
+        setValue(value + 1);
+    }, [dispatchRows, dispatchFields, fields, path, setValue, value, operation, id, user, locale]);
+    const removeRow = useCallback((rowIndex) => {
+        dispatchRows({ type: 'REMOVE', rowIndex });
+        dispatchFields({ type: 'REMOVE_ROW', rowIndex, path });
+        setValue(value - 1);
+    }, [dispatchRows, dispatchFields, path, value, setValue]);
+    const moveRow = useCallback((moveFromIndex, moveToIndex) => {
+        dispatchRows({ type: 'MOVE', moveFromIndex, moveToIndex });
+        dispatchFields({ type: 'MOVE_ROW', moveFromIndex, moveToIndex, path });
+    }, [dispatchRows, dispatchFields, path]);
+    const onDragEnd = useCallback((result) => {
+        if (!result.destination)
+            return;
+        const sourceIndex = result.source.index;
+        const destinationIndex = result.destination.index;
+        moveRow(sourceIndex, destinationIndex);
+    }, [moveRow]);
+    useEffect(() => {
+        const data = formContext.getDataByPath(path);
+        dispatchRows({ type: 'SET_ALL', data: data || [] });
+    }, [formContext, path]);
+    useEffect(() => {
+        setValue((rows === null || rows === void 0 ? void 0 : rows.length) || 0, true);
+        if ((rows === null || rows === void 0 ? void 0 : rows.length) === 0) {
+            setDisableFormData(false);
+        }
+        else {
+            setDisableFormData(true);
+        }
+    }, [rows, setValue]);
+    const hasMaxRows = maxRows && rows.length >= maxRows;
+    const classes = [
+        baseClass,
+        className,
+    ].filter(Boolean).join(' ');
+    return (React.createElement(DragDropContext, { onDragEnd: onDragEnd },
+        React.createElement("div", { className: classes },
+            React.createElement("div", { className: `${baseClass}__error-wrap` },
+                React.createElement(Error, { showError: showError, message: errorMessage })),
+            React.createElement("header", { className: `${baseClass}__header` },
+                React.createElement("h3", null, label),
+                React.createElement(FieldDescription, { value: value, description: description })),
+            React.createElement(Droppable, { droppableId: "array-drop" }, (provided) => (React.createElement("div", { ref: provided.innerRef, ...provided.droppableProps },
+                rows.length > 0 && rows.map((row, i) => (React.createElement(DraggableSection, { readOnly: readOnly, key: row.id, id: row.id, blockType: "array", label: labels.singular, rowCount: rows.length, rowIndex: i, addRow: addRow, removeRow: removeRow, moveRow: moveRow, parentPath: path, fieldTypes: fieldTypes, fieldSchema: fields, permissions: permissions, hasMaxRows: hasMaxRows }))),
+                (rows.length < minRows || (required && rows.length === 0)) && (React.createElement(Banner, { type: "error" },
+                    "This field requires at least",
+                    ' ',
+                    minRows
+                        ? `${minRows} ${labels.plural}`
+                        : `1 ${labels.singular}`)),
+                (rows.length === 0 && readOnly) && (React.createElement(Banner, null,
+                    "This field has no",
+                    ' ',
+                    labels.plural,
+                    ".")),
+                provided.placeholder))),
+            (!readOnly && (!hasMaxRows)) && (React.createElement("div", { className: `${baseClass}__add-button-wrap` },
+                React.createElement(Button, { onClick: () => addRow(value), buttonStyle: "icon-label", icon: "plus", iconStyle: "with-border", iconPosition: "left" }, `Add ${labels.singular}`))))));
+};
+export default withCondition(ArrayFieldType);

package/dist/admin/components/forms/field-types/Array/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { Props } from './types';
+declare const ArrayFieldType: React.FC<Props>;
+export default ArrayFieldType;

package/dist/admin/components/forms/field-types/Array/index.js

@@ -0,0 +1,6 @@
+import React, { Suspense, lazy } from 'react';
+import Loading from '../../../elements/Loading';
+const ArrayField = lazy(() => import('./Array'));
+const ArrayFieldType = (props) => (React.createElement(Suspense, { fallback: React.createElement(Loading, null) },
+    React.createElement(ArrayField, { ...props })));
+export default ArrayFieldType;

package/dist/admin/components/forms/field-types/Array/index.scss

@@ -0,0 +1,63 @@
+@import '../../../../scss/styles.scss';
+
+.field-type.array {
+  margin: base(2) 0;
+  min-width: base(15);
+
+  &__header {
+    h3 {
+      margin-bottom: 0;
+    }
+
+    margin-bottom: base(1);
+  }
+
+  &__error-wrap {
+    position: relative;
+  }
+
+  &__add-button-wrap {
+    margin-left: base(0);
+
+    .btn {
+      color: $color-gray;
+      margin: 0;
+
+      &:hover {
+        color: $color-dark-gray;
+      }
+    }
+  }
+
+  .section .section {
+    margin-top: 0;
+  }
+
+  .section__content {
+    > div > div {
+      width: 100%;
+    }
+  }
+
+  .render-fields {
+    .row {
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  @include mid-break {
+    min-width: calc(100vw - #{base(2)});
+  }
+}
+
+.field-type.group,
+.field-type.array,
+.field-type.blocks {
+  .field-type.array {
+    .field-type.array__add-button-wrap {
+      margin-left: base(3);
+    }
+  }
+}

package/dist/admin/components/forms/field-types/Array/types.d.ts

@@ -0,0 +1,9 @@
+import { ArrayField } from '../../../../../fields/config/types';
+import { FieldTypes } from '..';
+import { FieldPermissions } from '../../../../../auth/types';
+export declare type Props = Omit<ArrayField, 'type'> & {
+    path?: string;
+    fieldTypes: FieldTypes;
+    permissions: FieldPermissions;
+    label: string | false;
+};

package/dist/admin/components/forms/field-types/Array/types.js

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

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSearch/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import './index.scss';
+declare const BlockSearch: React.FC<{
+    setSearchTerm: (term: string) => void;
+}>;
+export default BlockSearch;

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSearch/index.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import SearchIcon from '../../../../../graphics/Search';
+import './index.scss';
+const baseClass = 'block-search';
+const BlockSearch = (props) => {
+    const { setSearchTerm } = props;
+    const handleChange = (e) => {
+        setSearchTerm(e.target.value);
+    };
+    return (React.createElement("div", { className: baseClass },
+        React.createElement("input", { className: `${baseClass}__input`, placeholder: "Search for a block", onChange: handleChange }),
+        React.createElement(SearchIcon, null)));
+};
+export default BlockSearch;

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSearch/index.scss

@@ -0,0 +1,30 @@
+@import '../../../../../../scss/styles.scss';
+
+$icon-width: base(1);
+$icon-margin: base(.25);
+
+.block-search {
+  position: sticky;
+  top: 0;
+  display: flex;
+  align-items: center;
+  z-index: 1;
+
+  &__input {
+    @include formInput;
+    padding-right: calc(#{$icon-width} + #{$icon-margin} * 2);
+  }
+
+  .search {
+    position: absolute;
+    right: base(.25);
+    width: $icon-width;
+    margin: 0 $icon-margin;
+  }
+
+  @include mid-break {
+    &__input {
+      margin-bottom: 0;
+    }
+  }
+}

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSelection/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Props } from './types';
+import './index.scss';
+declare const BlockSelection: React.FC<Props>;
+export default BlockSelection;

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSelection/index.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import DefaultBlockImage from '../../../../../graphics/DefaultBlockImage';
+import './index.scss';
+const baseClass = 'block-selection';
+const BlockSelection = (props) => {
+    const { addRow, addRowIndex, block, close, } = props;
+    const { labels, slug, imageURL, imageAltText, } = block;
+    const handleBlockSelection = () => {
+        close();
+        addRow(addRowIndex, slug);
+    };
+    return (React.createElement("button", { className: baseClass, tabIndex: 0, type: "button", onClick: handleBlockSelection },
+        React.createElement("div", { className: `${baseClass}__image` }, imageURL
+            ? (React.createElement("img", { src: imageURL, alt: imageAltText }))
+            : React.createElement(DefaultBlockImage, null)),
+        React.createElement("div", { className: `${baseClass}__label` }, labels.singular)));
+};
+export default BlockSelection;

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSelection/index.scss

@@ -0,0 +1,37 @@
+@import '../../../../../../scss/styles';
+
+.block-selection {
+  display: inline-flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  width: 33%;
+  padding: base(.75) base(.5);
+  cursor: pointer;
+  align-items: center;
+  background: none;
+  border-radius: 0;
+  box-shadow: 0;
+  border: 0;
+
+  &:hover {
+    background-color: $color-background-gray;
+  }
+
+  &__image {
+    svg,
+    img {
+      max-width: 100%;
+    }
+  }
+
+  &__label {
+    margin-top: base(.25);
+    font-weight: 600;
+    text-align: center;
+    white-space: initial;
+  }
+
+  @include mid-break {
+    width: unset;
+  }
+}

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSelection/types.d.ts

@@ -0,0 +1,7 @@
+import { Block } from '../../../../../../../fields/config/types';
+export declare type Props = {
+    addRow: (i: number, block: string) => void;
+    addRowIndex: number;
+    block: Block;
+    close: () => void;
+};

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlockSelection/types.js

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

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlocksContainer/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { Props } from './types';
+import './index.scss';
+declare const BlocksContainer: React.FC<Props>;
+export default BlocksContainer;

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlocksContainer/index.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import BlockSelection from '../BlockSelection';
+import './index.scss';
+const baseClass = 'blocks-container';
+const BlocksContainer = (props) => {
+    const { blocks, ...remainingProps } = props;
+    return (React.createElement("div", { className: baseClass }, blocks === null || blocks === void 0 ? void 0 : blocks.map((block, index) => (React.createElement(BlockSelection, { key: index, block: block, ...remainingProps })))));
+};
+export default BlocksContainer;

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlocksContainer/index.scss

@@ -0,0 +1,14 @@
+@import '../../../../../../scss/styles';
+
+.blocks-container {
+  width: 100%;
+  margin-top: base(1);
+  margin-bottom: base(.5);
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  min-width: 450px;
+  max-width: 80vw;
+  max-height: 300px;
+  position: relative;
+}

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlocksContainer/types.d.ts

@@ -0,0 +1,7 @@
+import { Block } from '../../../../../../../fields/config/types';
+export declare type Props = {
+    blocks: Block[];
+    close: () => void;
+    addRow: (i: number, block: string) => void;
+    addRowIndex: number;
+};

package/dist/admin/components/forms/field-types/Blocks/BlockSelector/BlocksContainer/types.js

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