payload 1.4.2 → 1.5.1

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

@@ -1,20 +1,25 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import useField from '../../../useField';
-import './index.scss';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_i18next_1 = require("react-i18next");
+const useField_1 = __importDefault(require("../../../useField"));
+require("./index.scss");
 const baseClass = 'section-title';
 const SectionTitle = (props) => {
     const { path, readOnly } = props;
-    const { value, setValue } = useField({ path });
-    const { t } = useTranslation('general');
+    const { value, setValue } = (0, useField_1.default)({ path });
+    const { t } = (0, react_i18next_1.useTranslation)('general');
     const classes = [
         baseClass,
     ].filter(Boolean).join(' ');
-    return (React.createElement("div", { className: classes, "data-value": value },
-        React.createElement("input", { className: `${baseClass}__input`, id: path, value: value || '', placeholder: t('untitled'), type: "text", name: path, onChange: (e) => {
+    return (react_1.default.createElement("div", { className: classes, "data-value": value },
+        react_1.default.createElement("input", { className: `${baseClass}__input`, id: path, value: value || '', placeholder: t('untitled'), type: "text", name: path, onChange: (e) => {
                 e.stopPropagation();
                 e.preventDefault();
                 setValue(e.target.value);
             }, readOnly: readOnly })));
 };
-export default SectionTitle;
+exports.default = SectionTitle;

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

@@ -1,4 +1,4 @@
-export declare type Props = {
+export type Props = {
     path: string;
     readOnly: boolean;
 };

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

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,102 +1,130 @@
-import React, { useCallback, useEffect, useReducer, useState } from 'react';
-import { DragDropContext, Draggable, Droppable } from 'react-beautiful-dnd';
-import { useTranslation } from 'react-i18next';
-import { useAuth } from '../../../utilities/Auth';
-import { usePreferences } from '../../../utilities/Preferences';
-import { useLocale } from '../../../utilities/Locale';
-import withCondition from '../../withCondition';
-import Button from '../../../elements/Button';
-import reducer from '../rowReducer';
-import { useDocumentInfo } from '../../../utilities/DocumentInfo';
-import { useForm } from '../../Form/context';
-import buildStateFromSchema from '../../Form/buildStateFromSchema';
-import Error from '../../Error';
-import useField from '../../useField';
-import Popup from '../../../elements/Popup';
-import BlockSelector from './BlockSelector';
-import { blocks as blocksValidator } from '../../../../../fields/validations';
-import Banner from '../../../elements/Banner';
-import FieldDescription from '../../FieldDescription';
-import { useOperation } from '../../../utilities/OperationProvider';
-import { Collapsible } from '../../../elements/Collapsible';
-import { ArrayAction } from '../../../elements/ArrayAction';
-import RenderFields from '../../RenderFields';
-import SectionTitle from './SectionTitle';
-import Pill from '../../../elements/Pill';
-import { scrollToID } from '../../../../utilities/scrollToID';
-import HiddenInput from '../HiddenInput';
-import { getTranslation } from '../../../../../utilities/getTranslation';
-import { createNestedFieldPath } from '../../Form/createNestedFieldPath';
-import './index.scss';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_beautiful_dnd_1 = require("react-beautiful-dnd");
+const react_i18next_1 = require("react-i18next");
+const Auth_1 = require("../../../utilities/Auth");
+const Preferences_1 = require("../../../utilities/Preferences");
+const Locale_1 = require("../../../utilities/Locale");
+const withCondition_1 = __importDefault(require("../../withCondition"));
+const Button_1 = __importDefault(require("../../../elements/Button"));
+const rowReducer_1 = __importDefault(require("../rowReducer"));
+const DocumentInfo_1 = require("../../../utilities/DocumentInfo");
+const context_1 = require("../../Form/context");
+const buildStateFromSchema_1 = __importDefault(require("../../Form/buildStateFromSchema"));
+const Error_1 = __importDefault(require("../../Error"));
+const useField_1 = __importDefault(require("../../useField"));
+const Popup_1 = __importDefault(require("../../../elements/Popup"));
+const BlockSelector_1 = __importDefault(require("./BlockSelector"));
+const validations_1 = require("../../../../../fields/validations");
+const Banner_1 = __importDefault(require("../../../elements/Banner"));
+const FieldDescription_1 = __importDefault(require("../../FieldDescription"));
+const OperationProvider_1 = require("../../../utilities/OperationProvider");
+const Collapsible_1 = require("../../../elements/Collapsible");
+const ArrayAction_1 = require("../../../elements/ArrayAction");
+const RenderFields_1 = __importDefault(require("../../RenderFields"));
+const SectionTitle_1 = __importDefault(require("./SectionTitle"));
+const Pill_1 = __importDefault(require("../../../elements/Pill"));
+const scrollToID_1 = require("../../../../utilities/scrollToID");
+const HiddenInput_1 = __importDefault(require("../HiddenInput"));
+const getTranslation_1 = require("../../../../../utilities/getTranslation");
+const createNestedFieldPath_1 = require("../../Form/createNestedFieldPath");
+require("./index.scss");
 const baseClass = 'blocks-field';
 const BlocksField = (props) => {
-    const { t, i18n } = useTranslation('fields');
+    const { t, i18n } = (0, react_i18next_1.useTranslation)('fields');
     const { label, name, path: pathFromProps, blocks, labels = {
         singular: t('block'),
         plural: t('blocks'),
-    }, fieldTypes, maxRows, minRows, required, validate = blocksValidator, permissions, indexPath, admin: { readOnly, description, condition, initCollapsed, className, }, } = props;
+    }, fieldTypes, maxRows, minRows, required, validate = validations_1.blocks, permissions, indexPath, admin: { readOnly, description, condition, initCollapsed, className, }, } = props;
     const path = pathFromProps || name;
-    const { preferencesKey } = useDocumentInfo();
-    const { getPreference } = usePreferences();
-    const { setPreference } = usePreferences();
-    const [rows, dispatchRows] = useReducer(reducer, undefined);
-    const formContext = useForm();
-    const { user } = useAuth();
-    const { id } = useDocumentInfo();
-    const locale = useLocale();
-    const operation = useOperation();
+    const { preferencesKey } = (0, DocumentInfo_1.useDocumentInfo)();
+    const { getPreference } = (0, Preferences_1.usePreferences)();
+    const { setPreference } = (0, Preferences_1.usePreferences)();
+    const [rows, dispatchRows] = (0, react_1.useReducer)(rowReducer_1.default, undefined);
+    const formContext = (0, context_1.useForm)();
+    const { user } = (0, Auth_1.useAuth)();
+    const { id } = (0, DocumentInfo_1.useDocumentInfo)();
+    const locale = (0, Locale_1.useLocale)();
+    const operation = (0, OperationProvider_1.useOperation)();
     const { dispatchFields, setModified } = formContext;
-    const [selectorIndexOpen, setSelectorIndexOpen] = useState();
-    const memoizedValidate = useCallback((value, options) => {
+    const [selectorIndexOpen, setSelectorIndexOpen] = (0, react_1.useState)();
+    const memoizedValidate = (0, react_1.useCallback)((value, options) => {
         return validate(value, { ...options, minRows, maxRows, required });
     }, [maxRows, minRows, required, validate]);
-    const { showError, errorMessage, value, } = useField({
+    const { showError, errorMessage, value, } = (0, useField_1.default)({
         path,
         validate: memoizedValidate,
         condition,
         disableFormData: (rows === null || rows === void 0 ? void 0 : rows.length) > 0,
     });
-    const onAddPopupToggle = useCallback((open) => {
+    const onAddPopupToggle = (0, react_1.useCallback)((open) => {
         if (!open) {
             setSelectorIndexOpen(undefined);
         }
     }, []);
-    const addRow = useCallback(async (rowIndex, blockType) => {
+    const addRow = (0, react_1.useCallback)(async (rowIndex, blockType) => {
         const block = blocks.find((potentialBlock) => potentialBlock.slug === blockType);
-        const subFieldState = await buildStateFromSchema({ fieldSchema: block.fields, operation, id, user, locale, t });
+        const subFieldState = await (0, buildStateFromSchema_1.default)({ fieldSchema: block.fields, operation, id, user, locale, t });
         dispatchFields({ type: 'ADD_ROW', rowIndex, subFieldState, path, blockType });
         dispatchRows({ type: 'ADD', rowIndex, blockType });
         setModified(true);
         setTimeout(() => {
-            scrollToID(`${path}-row-${rowIndex + 1}`);
+            (0, scrollToID_1.scrollToID)(`${path}-row-${rowIndex + 1}`);
         }, 0);
     }, [blocks, operation, id, user, locale, t, dispatchFields, path, setModified]);
-    const duplicateRow = useCallback(async (rowIndex, blockType) => {
+    const duplicateRow = (0, react_1.useCallback)(async (rowIndex, blockType) => {
         dispatchFields({ type: 'DUPLICATE_ROW', rowIndex, path });
         dispatchRows({ type: 'ADD', rowIndex, blockType });
         setModified(true);
         setTimeout(() => {
-            scrollToID(`${path}-row-${rowIndex + 1}`);
+            (0, scrollToID_1.scrollToID)(`${path}-row-${rowIndex + 1}`);
         }, 0);
     }, [dispatchRows, dispatchFields, path, setModified]);
-    const removeRow = useCallback((rowIndex) => {
+    const removeRow = (0, react_1.useCallback)((rowIndex) => {
         dispatchRows({ type: 'REMOVE', rowIndex });
         dispatchFields({ type: 'REMOVE_ROW', rowIndex, path });
         setModified(true);
     }, [path, dispatchFields, setModified]);
-    const moveRow = useCallback((moveFromIndex, moveToIndex) => {
+    const moveRow = (0, react_1.useCallback)((moveFromIndex, moveToIndex) => {
         dispatchRows({ type: 'MOVE', moveFromIndex, moveToIndex });
         dispatchFields({ type: 'MOVE_ROW', moveFromIndex, moveToIndex, path });
         setModified(true);
     }, [dispatchRows, dispatchFields, path, setModified]);
-    const onDragEnd = useCallback((result) => {
+    const onDragEnd = (0, react_1.useCallback)((result) => {
         if (!result.destination)
             return;
         const sourceIndex = result.source.index;
         const destinationIndex = result.destination.index;
         moveRow(sourceIndex, destinationIndex);
     }, [moveRow]);
-    const setCollapse = useCallback(async (rowID, collapsed) => {
+    const setCollapse = (0, react_1.useCallback)(async (rowID, collapsed) => {
         var _a, _b, _c;
         dispatchRows({ type: 'SET_COLLAPSE', id: rowID, collapsed });
         if (preferencesKey) {
@@ -126,7 +154,7 @@ const BlocksField = (props) => {
             });
         }
     }, [preferencesKey, getPreference, path, setPreference, initCollapsed, rows]);
-    const toggleCollapseAll = useCallback(async (collapse) => {
+    const toggleCollapseAll = (0, react_1.useCallback)(async (collapse) => {
         var _a;
         dispatchRows({ type: 'SET_ALL_COLLAPSED', collapse });
         if (preferencesKey) {
@@ -144,7 +172,7 @@ const BlocksField = (props) => {
         }
     }, [getPreference, path, preferencesKey, rows, setPreference]);
     // Set row count on mount and when form context is reset
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         const initializeRowState = async () => {
             var _a, _b;
             const data = formContext.getDataByPath(path);
@@ -161,47 +189,47 @@ const BlocksField = (props) => {
     ].filter(Boolean).join(' ');
     if (!rows)
         return null;
-    return (React.createElement(DragDropContext, { onDragEnd: onDragEnd },
-        React.createElement("div", { id: `field-${path.replace(/\./gi, '__')}`, className: classes },
-            React.createElement("div", { className: `${baseClass}__error-wrap` },
-                React.createElement(Error, { showError: showError, message: errorMessage })),
-            React.createElement("header", { className: `${baseClass}__header` },
-                React.createElement("div", { className: `${baseClass}__header-wrap` },
-                    React.createElement("h3", null, getTranslation(label || name, i18n)),
-                    React.createElement("ul", { className: `${baseClass}__header-actions` },
-                        React.createElement("li", null,
-                            React.createElement("button", { type: "button", onClick: () => toggleCollapseAll(true), className: `${baseClass}__header-action` }, t('collapseAll'))),
-                        React.createElement("li", null,
-                            React.createElement("button", { type: "button", onClick: () => toggleCollapseAll(false), className: `${baseClass}__header-action` }, t('showAll'))))),
-                React.createElement(FieldDescription, { value: value, description: description })),
-            React.createElement(Droppable, { droppableId: "blocks-drop", isDropDisabled: readOnly }, (provided) => (React.createElement("div", { ref: provided.innerRef, ...provided.droppableProps },
+    return (react_1.default.createElement(react_beautiful_dnd_1.DragDropContext, { onDragEnd: onDragEnd },
+        react_1.default.createElement("div", { id: `field-${path.replace(/\./gi, '__')}`, className: classes },
+            react_1.default.createElement("div", { className: `${baseClass}__error-wrap` },
+                react_1.default.createElement(Error_1.default, { showError: showError, message: errorMessage })),
+            react_1.default.createElement("header", { className: `${baseClass}__header` },
+                react_1.default.createElement("div", { className: `${baseClass}__header-wrap` },
+                    react_1.default.createElement("h3", null, (0, getTranslation_1.getTranslation)(label || name, i18n)),
+                    react_1.default.createElement("ul", { className: `${baseClass}__header-actions` },
+                        react_1.default.createElement("li", null,
+                            react_1.default.createElement("button", { type: "button", onClick: () => toggleCollapseAll(true), className: `${baseClass}__header-action` }, t('collapseAll'))),
+                        react_1.default.createElement("li", null,
+                            react_1.default.createElement("button", { type: "button", onClick: () => toggleCollapseAll(false), className: `${baseClass}__header-action` }, t('showAll'))))),
+                react_1.default.createElement(FieldDescription_1.default, { value: value, description: description })),
+            react_1.default.createElement(react_beautiful_dnd_1.Droppable, { droppableId: "blocks-drop", isDropDisabled: readOnly }, (provided) => (react_1.default.createElement("div", { ref: provided.innerRef, ...provided.droppableProps },
                 rows.length > 0 && rows.map((row, i) => {
                     const { blockType } = row;
                     const blockToRender = blocks.find((block) => block.slug === blockType);
                     const rowNumber = i + 1;
                     if (blockToRender) {
-                        return (React.createElement(Draggable, { key: row.id, draggableId: row.id, index: i, isDragDisabled: readOnly }, (providedDrag) => (React.createElement("div", { id: `${path}-row-${i}`, ref: providedDrag.innerRef, ...providedDrag.draggableProps },
-                            React.createElement(Collapsible, { collapsed: row.collapsed, onToggle: (collapsed) => setCollapse(row.id, collapsed), className: `${baseClass}__row`, key: row.id, dragHandleProps: providedDrag.dragHandleProps, header: (React.createElement("div", { className: `${baseClass}__block-header` },
-                                    React.createElement("span", { className: `${baseClass}__block-number` }, rowNumber >= 10 ? rowNumber : `0${rowNumber}`),
-                                    React.createElement(Pill, { pillStyle: "white", className: `${baseClass}__block-pill ${baseClass}__block-pill-${blockType}` }, getTranslation(blockToRender.labels.singular, i18n)),
-                                    React.createElement(SectionTitle, { path: `${path}.${i}.blockName`, readOnly: readOnly }))), actions: !readOnly ? (React.createElement(React.Fragment, null,
-                                    React.createElement(Popup, { key: `${blockType}-${i}`, forceOpen: selectorIndexOpen === i, onToggleOpen: onAddPopupToggle, buttonType: "none", size: "large", horizontalAlign: "right", render: ({ close }) => (React.createElement(BlockSelector, { blocks: blocks, addRow: addRow, addRowIndex: i, close: close })) }),
-                                    React.createElement(ArrayAction, { rowCount: rows.length, duplicateRow: () => duplicateRow(i, blockType), addRow: () => setSelectorIndexOpen(i), moveRow: moveRow, removeRow: removeRow, index: i }))) : undefined },
-                                React.createElement(HiddenInput, { name: `${path}.${i}.id`, value: row.id }),
-                                React.createElement(RenderFields, { className: `${baseClass}__fields`, forceRender: true, readOnly: readOnly, fieldTypes: fieldTypes, permissions: permissions === null || permissions === void 0 ? void 0 : permissions.fields, fieldSchema: blockToRender.fields.map((field) => ({
+                        return (react_1.default.createElement(react_beautiful_dnd_1.Draggable, { key: row.id, draggableId: row.id, index: i, isDragDisabled: readOnly }, (providedDrag) => (react_1.default.createElement("div", { id: `${path}-row-${i}`, ref: providedDrag.innerRef, ...providedDrag.draggableProps },
+                            react_1.default.createElement(Collapsible_1.Collapsible, { collapsed: row.collapsed, onToggle: (collapsed) => setCollapse(row.id, collapsed), className: `${baseClass}__row`, key: row.id, dragHandleProps: providedDrag.dragHandleProps, header: (react_1.default.createElement("div", { className: `${baseClass}__block-header` },
+                                    react_1.default.createElement("span", { className: `${baseClass}__block-number` }, rowNumber >= 10 ? rowNumber : `0${rowNumber}`),
+                                    react_1.default.createElement(Pill_1.default, { pillStyle: "white", className: `${baseClass}__block-pill ${baseClass}__block-pill-${blockType}` }, (0, getTranslation_1.getTranslation)(blockToRender.labels.singular, i18n)),
+                                    react_1.default.createElement(SectionTitle_1.default, { path: `${path}.${i}.blockName`, readOnly: readOnly }))), actions: !readOnly ? (react_1.default.createElement(react_1.default.Fragment, null,
+                                    react_1.default.createElement(Popup_1.default, { key: `${blockType}-${i}`, forceOpen: selectorIndexOpen === i, onToggleOpen: onAddPopupToggle, buttonType: "none", size: "large", horizontalAlign: "right", render: ({ close }) => (react_1.default.createElement(BlockSelector_1.default, { blocks: blocks, addRow: addRow, addRowIndex: i, close: close })) }),
+                                    react_1.default.createElement(ArrayAction_1.ArrayAction, { rowCount: rows.length, duplicateRow: () => duplicateRow(i, blockType), addRow: () => setSelectorIndexOpen(i), moveRow: moveRow, removeRow: removeRow, index: i }))) : undefined },
+                                react_1.default.createElement(HiddenInput_1.default, { name: `${path}.${i}.id`, value: row.id }),
+                                react_1.default.createElement(RenderFields_1.default, { className: `${baseClass}__fields`, forceRender: true, readOnly: readOnly, fieldTypes: fieldTypes, permissions: permissions === null || permissions === void 0 ? void 0 : permissions.fields, fieldSchema: blockToRender.fields.map((field) => ({
                                         ...field,
-                                        path: createNestedFieldPath(`${path}.${i}`, field),
+                                        path: (0, createNestedFieldPath_1.createNestedFieldPath)(`${path}.${i}`, field),
                                     })), indexPath: indexPath }))))));
                     }
                     return null;
                 }),
-                (rows.length < minRows || (required && rows.length === 0)) && (React.createElement(Banner, { type: "error" }, t('validation:requiresAtLeast', {
+                (rows.length < minRows || (required && rows.length === 0)) && (react_1.default.createElement(Banner_1.default, { type: "error" }, t('validation:requiresAtLeast', {
                     count: minRows,
-                    label: getTranslation(minRows === 1 || typeof minRows === 'undefined' ? labels.singular : labels.plural, i18n),
+                    label: (0, getTranslation_1.getTranslation)(minRows === 1 || typeof minRows === 'undefined' ? labels.singular : labels.plural, i18n),
                 }))),
-                (rows.length === 0 && readOnly) && (React.createElement(Banner, null, t('validation:fieldHasNo', { label: getTranslation(labels.plural, i18n) }))),
+                (rows.length === 0 && readOnly) && (react_1.default.createElement(Banner_1.default, null, t('validation:fieldHasNo', { label: (0, getTranslation_1.getTranslation)(labels.plural, i18n) }))),
                 provided.placeholder))),
-            (!readOnly && !hasMaxRows) && (React.createElement("div", { className: `${baseClass}__add-button-wrap` },
-                React.createElement(Popup, { buttonType: "custom", size: "large", horizontalAlign: "left", button: (React.createElement(Button, { buttonStyle: "icon-label", icon: "plus", iconPosition: "left", iconStyle: "with-border" }, t('addLabel', { label: getTranslation(labels.singular, i18n) }))), render: ({ close }) => (React.createElement(BlockSelector, { blocks: blocks, addRow: addRow, addRowIndex: value, close: close })) }))))));
+            (!readOnly && !hasMaxRows) && (react_1.default.createElement("div", { className: `${baseClass}__add-button-wrap` },
+                react_1.default.createElement(Popup_1.default, { buttonType: "custom", size: "large", horizontalAlign: "left", button: (react_1.default.createElement(Button_1.default, { buttonStyle: "icon-label", icon: "plus", iconPosition: "left", iconStyle: "with-border" }, t('addLabel', { label: (0, getTranslation_1.getTranslation)(labels.singular, i18n) }))), render: ({ close }) => (react_1.default.createElement(BlockSelector_1.default, { blocks: blocks, addRow: addRow, addRowIndex: value, close: close })) }))))));
 };
-export default withCondition(BlocksField);
+exports.default = (0, withCondition_1.default)(BlocksField);

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

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

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

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,28 +1,56 @@
-import React, { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import useField from '../../useField';
-import withCondition from '../../withCondition';
-import Error from '../../Error';
-import { checkbox } from '../../../../../fields/validations';
-import Check from '../../../icons/Check';
-import FieldDescription from '../../FieldDescription';
-import { getTranslation } from '../../../../../utilities/getTranslation';
-import './index.scss';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_i18next_1 = require("react-i18next");
+const useField_1 = __importDefault(require("../../useField"));
+const withCondition_1 = __importDefault(require("../../withCondition"));
+const Error_1 = __importDefault(require("../../Error"));
+const validations_1 = require("../../../../../fields/validations");
+const Check_1 = __importDefault(require("../../../icons/Check"));
+const FieldDescription_1 = __importDefault(require("../../FieldDescription"));
+const getTranslation_1 = require("../../../../../utilities/getTranslation");
+require("./index.scss");
 const baseClass = 'checkbox';
 const Checkbox = (props) => {
-    const { name, path: pathFromProps, validate = checkbox, label, onChange, disableFormData, required, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
-    const { i18n } = useTranslation();
+    const { name, path: pathFromProps, validate = validations_1.checkbox, label, onChange, disableFormData, required, admin: { readOnly, style, className, width, description, condition, } = {}, } = props;
+    const { i18n } = (0, react_i18next_1.useTranslation)();
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value, options) => {
+    const memoizedValidate = (0, react_1.useCallback)((value, options) => {
         return validate(value, { ...options, required });
     }, [validate, required]);
-    const { value, showError, errorMessage, setValue, } = useField({
+    const { value, showError, errorMessage, setValue, } = (0, useField_1.default)({
         path,
         validate: memoizedValidate,
         disableFormData,
         condition,
     });
-    return (React.createElement("div", { className: [
+    return (react_1.default.createElement("div", { className: [
             'field-type',
             baseClass,
             showError && 'error',
@@ -33,17 +61,17 @@ const Checkbox = (props) => {
             ...style,
             width,
         } },
-        React.createElement("div", { className: `${baseClass}__error-wrap` },
-            React.createElement(Error, { showError: showError, message: errorMessage })),
-        React.createElement("input", { id: `field-${path.replace(/\./gi, '__')}`, type: "checkbox", name: path, checked: Boolean(value), readOnly: true }),
-        React.createElement("button", { type: "button", onClick: readOnly ? undefined : () => {
+        react_1.default.createElement("div", { className: `${baseClass}__error-wrap` },
+            react_1.default.createElement(Error_1.default, { showError: showError, message: errorMessage })),
+        react_1.default.createElement("input", { id: `field-${path.replace(/\./gi, '__')}`, type: "checkbox", name: path, checked: Boolean(value), readOnly: true }),
+        react_1.default.createElement("button", { type: "button", onClick: readOnly ? undefined : () => {
                 setValue(!value);
                 if (typeof onChange === 'function')
                     onChange(!value);
             } },
-            React.createElement("span", { className: `${baseClass}__input` },
-                React.createElement(Check, null)),
-            React.createElement("span", { className: `${baseClass}__label` }, getTranslation(label || name, i18n))),
-        React.createElement(FieldDescription, { value: value, description: description })));
+            react_1.default.createElement("span", { className: `${baseClass}__input` },
+                react_1.default.createElement(Check_1.default, null)),
+            react_1.default.createElement("span", { className: `${baseClass}__label` }, (0, getTranslation_1.getTranslation)(label || name, i18n))),
+        react_1.default.createElement(FieldDescription_1.default, { value: value, description: description })));
 };
-export default withCondition(Checkbox);
+exports.default = (0, withCondition_1.default)(Checkbox);

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

@@ -1,5 +1,5 @@
 import { CheckboxField } from '../../../../../fields/config/types';
-export declare type Props = Omit<CheckboxField, 'type'> & {
+export type Props = Omit<CheckboxField, 'type'> & {
     path?: string;
     onChange?: (val: boolean) => void;
     disableFormData?: boolean;

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

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -1,13 +1,4 @@
 import React from 'react';
-import 'prismjs/components/prism-clike';
-import 'prismjs/components/prism-css';
-import 'prismjs/components/prism-markup';
-import 'prismjs/components/prism-javascript';
-import 'prismjs/components/prism-json';
-import 'prismjs/components/prism-jsx';
-import 'prismjs/components/prism-typescript';
-import 'prismjs/components/prism-tsx';
-import 'prismjs/components/prism-yaml';
 import { Props } from './types';
 import './index.scss';
 declare const _default: React.FC<Props>;

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

@@ -1,36 +1,52 @@
-import React, { useCallback, useState } from 'react';
-import Editor from 'react-simple-code-editor';
-import { highlight, languages } from 'prismjs/components/prism-core';
-import 'prismjs/components/prism-clike';
-import 'prismjs/components/prism-css';
-import 'prismjs/components/prism-markup';
-import 'prismjs/components/prism-javascript';
-import 'prismjs/components/prism-json';
-import 'prismjs/components/prism-jsx';
-import 'prismjs/components/prism-typescript';
-import 'prismjs/components/prism-tsx';
-import 'prismjs/components/prism-yaml';
-import useField from '../../useField';
-import withCondition from '../../withCondition';
-import Label from '../../Label';
-import Error from '../../Error';
-import FieldDescription from '../../FieldDescription';
-import { code } from '../../../../../fields/validations';
-import './index.scss';
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const validations_1 = require("../../../../../fields/validations");
+const Error_1 = __importDefault(require("../../Error"));
+const FieldDescription_1 = __importDefault(require("../../FieldDescription"));
+const Label_1 = __importDefault(require("../../Label"));
+const useField_1 = __importDefault(require("../../useField"));
+const withCondition_1 = __importDefault(require("../../withCondition"));
+const CodeEditor_1 = __importDefault(require("../../../elements/CodeEditor"));
+require("./index.scss");
+const prismToMonacoLanguageMap = {
+    js: 'javascript',
+    ts: 'typescript',
+};
 const baseClass = 'code-field';
 const Code = (props) => {
-    const { path: pathFromProps, name, required, validate = code, admin: { readOnly, style, className, width, language, description, condition, } = {}, label, } = props;
-    const [highlighter] = useState(() => {
-        if (languages[language]) {
-            return (content) => highlight(content, languages[language]);
-        }
-        return (content) => content;
-    });
+    const { path: pathFromProps, name, required, validate = validations_1.code, admin: { readOnly, style, className, width, language, description, condition, editorOptions, } = {}, label, } = props;
     const path = pathFromProps || name;
-    const memoizedValidate = useCallback((value, options) => {
+    const memoizedValidate = (0, react_1.useCallback)((value, options) => {
         return validate(value, { ...options, required });
     }, [validate, required]);
-    const { value, showError, setValue, errorMessage, } = useField({
+    const { value, showError, setValue, errorMessage, } = (0, useField_1.default)({
         path,
         validate: memoizedValidate,
         condition,
@@ -42,17 +58,13 @@ const Code = (props) => {
         showError && 'error',
         readOnly && 'read-only',
     ].filter(Boolean).join(' ');
-    return (React.createElement("div", { className: classes, style: {
+    return (react_1.default.createElement("div", { className: classes, style: {
             ...style,
             width,
         } },
-        React.createElement(Error, { showError: showError, message: errorMessage }),
-        React.createElement(Label, { htmlFor: `field-${path}`, label: label, required: required }),
-        React.createElement(Editor, { className: `${baseClass}__input`, id: `field-${path.replace(/\./gi, '__')}`, value: value || '', onValueChange: readOnly ? () => null : setValue, highlight: highlighter, padding: 25, style: {
-                fontFamily: '"Consolas", "Monaco", monospace',
-                fontSize: 12,
-                pointerEvents: readOnly ? 'none' : 'auto',
-            } }),
-        React.createElement(FieldDescription, { value: value, description: description })));
+        react_1.default.createElement(Error_1.default, { showError: showError, message: errorMessage }),
+        react_1.default.createElement(Label_1.default, { htmlFor: `field-${path}`, label: label, required: required }),
+        react_1.default.createElement(CodeEditor_1.default, { options: editorOptions, defaultLanguage: prismToMonacoLanguageMap[language] || language, value: value || '', onChange: readOnly ? () => null : (val) => setValue(val), readOnly: readOnly }),
+        react_1.default.createElement(FieldDescription_1.default, { value: value, description: description })));
 };
-export default withCondition(Code);
+exports.default = (0, withCondition_1.default)(Code);