payload 1.15.5 → 2.0.0-beta.0

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

@@ -1,36 +1,37 @@
 @import '../../../../scss/styles.scss';
 
 .blocks-field {
-  margin: 0 0 base(2);
+  display: flex;
+  flex-direction: column;
+  gap: calc(var(--base) / 2);
 
   &__header {
     h3 {
-      margin-bottom: 0;
+      margin: 0;
     }
-
-    margin-bottom: base(1);
   }
 
   &__header-wrap {
     display: flex;
     align-items: flex-end;
     width: 100%;
+    justify-content: space-between;
   }
 
   &__heading-with-error {
     display: flex;
     align-items: center;
-    gap: base(.5);
+    gap: base(0.5);
   }
 
   &--has-no-error {
-    >.array-field__header .array-field__heading-with-error {
+    > .array-field__header .array-field__heading-with-error {
       color: var(--theme-text);
     }
   }
 
   &--has-error {
-    >.array-field__header {
+    > .array-field__header {
       color: var(--theme-error-500);
     }
   }
@@ -41,7 +42,7 @@
 
   &__header-actions {
     list-style: none;
-    margin: 0 0 0 auto;
+    margin: 0;
     padding: 0;
     display: flex;
   }
@@ -49,9 +50,10 @@
   &__header-action {
     @extend %btn-reset;
     cursor: pointer;
-    margin-left: base(.5);
+    margin-left: base(0.5);
 
-    &:hover, &:focus-visible {
+    &:hover,
+    &:focus-visible {
       text-decoration: underline;
     }
   }
@@ -60,7 +62,7 @@
     display: inline-flex;
     max-width: 100%;
     overflow: hidden;
-    gap: base(.375);
+    gap: base(0.375);
   }
 
   &__block-number {
@@ -73,23 +75,22 @@
     line-height: unset;
   }
 
-  .section-title {
-    min-width: 0;
-  }
-
-  &__row {
-    margin-bottom: base(.5);
-  }
-
   &__error-wrap {
     position: relative;
   }
 
+  &__rows {
+    display: flex;
+    flex-direction: column;
+    gap: calc(var(--base) / 2);
+  }
+
   &__drawer-toggler {
     background-color: transparent;
     margin: 0;
     padding: 0;
     border: none;
+    align-self: flex-start;
 
     .btn {
       color: var(--theme-elevation-400);
@@ -102,17 +103,19 @@
   }
 }
 
-html[data-theme="light"] {
+html[data-theme='light'] {
   .blocks-field--has-error {
-    .section-title__input, .blocks-field__heading-with-error {
+    .section-title__input,
+    .blocks-field__heading-with-error {
       color: var(--theme-error-750);
     }
   }
 }
 
-html[data-theme="dark"] {
+html[data-theme='dark'] {
   .blocks-field--has-error {
-    .section-title__input, .blocks-field__heading-with-error {
+    .section-title__input,
+    .blocks-field__heading-with-error {
       color: var(--theme-error-500);
     }
   }

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

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

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

@@ -1,28 +1,51 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxInput = void 0;
-const react_1 = __importDefault(require("react"));
-const Check_1 = __importDefault(require("../../../icons/Check"));
-const Label_1 = __importDefault(require("../../Label"));
-const Line_1 = __importDefault(require("../../../icons/Line"));
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "CheckboxInput", {
+    enumerable: true,
+    get: function() {
+        return CheckboxInput;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _Check = /*#__PURE__*/ _interop_require_default(require("../../../icons/Check"));
+const _Line = /*#__PURE__*/ _interop_require_default(require("../../../icons/Line"));
+const _Label = /*#__PURE__*/ _interop_require_default(require("../../Label"));
 require("./index.scss");
-const baseClass = 'custom-checkbox';
-const CheckboxInput = (props) => {
-    const { onToggle, checked, partialChecked, inputRef, name, id, label, 'aria-label': ariaLabel, readOnly, required, } = props;
-    return (react_1.default.createElement("div", { className: [
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const baseClass = 'checkbox-input';
+const CheckboxInput = (props)=>{
+    const { id, name, 'aria-label': ariaLabel, checked, inputRef, label, onToggle, partialChecked, readOnly, required, className } = props;
+    return /*#__PURE__*/ _react.default.createElement("div", {
+        className: [
             baseClass,
+            className,
             (checked || partialChecked) && `${baseClass}--checked`,
-            readOnly && `${baseClass}--read-only`,
-        ].filter(Boolean).join(' ') },
-        react_1.default.createElement("div", { className: `${baseClass}__input` },
-            react_1.default.createElement("input", { ref: inputRef, id: id, type: "checkbox", name: name, "aria-label": ariaLabel, defaultChecked: Boolean(checked), disabled: readOnly, onInput: onToggle }),
-            react_1.default.createElement("span", { className: `${baseClass}__icon ${!partialChecked ? 'check' : 'partial'}` },
-                !partialChecked && (react_1.default.createElement(Check_1.default, null)),
-                partialChecked && (react_1.default.createElement(Line_1.default, null)))),
-        label && (react_1.default.createElement(Label_1.default, { htmlFor: id, label: label, required: required }))));
+            readOnly && `${baseClass}--read-only`
+        ].filter(Boolean).join(' ')
+    }, /*#__PURE__*/ _react.default.createElement("div", {
+        className: `${baseClass}__input`
+    }, /*#__PURE__*/ _react.default.createElement("input", {
+        "aria-label": ariaLabel,
+        defaultChecked: Boolean(checked),
+        disabled: readOnly,
+        id: id,
+        name: name,
+        onInput: onToggle,
+        ref: inputRef,
+        type: "checkbox"
+    }), /*#__PURE__*/ _react.default.createElement("span", {
+        className: `${baseClass}__icon ${!partialChecked ? 'check' : 'partial'}`
+    }, !partialChecked && /*#__PURE__*/ _react.default.createElement(_Check.default, null), partialChecked && /*#__PURE__*/ _react.default.createElement(_Line.default, null))), label && /*#__PURE__*/ _react.default.createElement(_Label.default, {
+        htmlFor: id,
+        label: label,
+        required: required
+    }));
 };
-exports.CheckboxInput = CheckboxInput;
-//# sourceMappingURL=Input.js.map
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL2Zvcm1zL2ZpZWxkLXR5cGVzL0NoZWNrYm94L0lucHV0LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnXG5cbmltcG9ydCBDaGVjayBmcm9tICcuLi8uLi8uLi9pY29ucy9DaGVjaydcbmltcG9ydCBMaW5lIGZyb20gJy4uLy4uLy4uL2ljb25zL0xpbmUnXG5pbXBvcnQgTGFiZWwgZnJvbSAnLi4vLi4vTGFiZWwnXG5pbXBvcnQgJy4vaW5kZXguc2NzcydcblxuY29uc3QgYmFzZUNsYXNzID0gJ2NoZWNrYm94LWlucHV0J1xuXG50eXBlIENoZWNrYm94SW5wdXRQcm9wcyA9IHtcbiAgJ2FyaWEtbGFiZWwnPzogc3RyaW5nXG4gIGNoZWNrZWQ/OiBib29sZWFuXG4gIGlkPzogc3RyaW5nXG4gIGlucHV0UmVmPzogUmVhY3QuTXV0YWJsZVJlZk9iamVjdDxIVE1MSW5wdXRFbGVtZW50PlxuICBsYWJlbD86IHN0cmluZ1xuICBuYW1lPzogc3RyaW5nXG4gIG9uVG9nZ2xlOiBSZWFjdC5Gb3JtRXZlbnRIYW5kbGVyPEhUTUxJbnB1dEVsZW1lbnQ+XG4gIHBhcnRpYWxDaGVja2VkPzogYm9vbGVhblxuICByZWFkT25seT86IGJvb2xlYW5cbiAgcmVxdWlyZWQ/OiBib29sZWFuXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xufVxuXG5leHBvcnQgY29uc3QgQ2hlY2tib3hJbnB1dDogUmVhY3QuRkM8Q2hlY2tib3hJbnB1dFByb3BzPiA9IChwcm9wcykgPT4ge1xuICBjb25zdCB7XG4gICAgaWQsXG4gICAgbmFtZSxcbiAgICAnYXJpYS1sYWJlbCc6IGFyaWFMYWJlbCxcbiAgICBjaGVja2VkLFxuICAgIGlucHV0UmVmLFxuICAgIGxhYmVsLFxuICAgIG9uVG9nZ2xlLFxuICAgIHBhcnRpYWxDaGVja2VkLFxuICAgIHJlYWRPbmx5LFxuICAgIHJlcXVpcmVkLFxuICAgIGNsYXNzTmFtZSxcbiAgfSA9IHByb3BzXG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjbGFzc05hbWU9e1tcbiAgICAgICAgYmFzZUNsYXNzLFxuICAgICAgICBjbGFzc05hbWUsXG4gICAgICAgIChjaGVja2VkIHx8IHBhcnRpYWxDaGVja2VkKSAmJiBgJHtiYXNlQ2xhc3N9LS1jaGVja2VkYCxcbiAgICAgICAgcmVhZE9ubHkgJiYgYCR7YmFzZUNsYXNzfS0tcmVhZC1vbmx5YCxcbiAgICAgIF1cbiAgICAgICAgLmZpbHRlcihCb29sZWFuKVxuICAgICAgICAuam9pbignICcpfVxuICAgID5cbiAgICAgIDxkaXYgY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19pbnB1dGB9PlxuICAgICAgICA8aW5wdXRcbiAgICAgICAgICBhcmlhLWxhYmVsPXthcmlhTGFiZWx9XG4gICAgICAgICAgZGVmYXVsdENoZWNrZWQ9e0Jvb2xlYW4oY2hlY2tlZCl9XG4gICAgICAgICAgZGlzYWJsZWQ9e3JlYWRPbmx5fVxuICAgICAgICAgIGlkPXtpZH1cbiAgICAgICAgICBuYW1lPXtuYW1lfVxuICAgICAgICAgIG9uSW5wdXQ9e29uVG9nZ2xlfVxuICAgICAgICAgIHJlZj17aW5wdXRSZWZ9XG4gICAgICAgICAgdHlwZT1cImNoZWNrYm94XCJcbiAgICAgICAgLz5cbiAgICAgICAgPHNwYW4gY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19pY29uICR7IXBhcnRpYWxDaGVja2VkID8gJ2NoZWNrJyA6ICdwYXJ0aWFsJ31gfT5cbiAgICAgICAgICB7IXBhcnRpYWxDaGVja2VkICYmIDxDaGVjayAvPn1cbiAgICAgICAgICB7cGFydGlhbENoZWNrZWQgJiYgPExpbmUgLz59XG4gICAgICAgIDwvc3Bhbj5cbiAgICAgIDwvZGl2PlxuICAgICAge2xhYmVsICYmIDxMYWJlbCBodG1sRm9yPXtpZH0gbGFiZWw9e2xhYmVsfSByZXF1aXJlZD17cmVxdWlyZWR9IC8+fVxuICAgIDwvZGl2PlxuICApXG59XG4iXSwibmFtZXMiOlsiQ2hlY2tib3hJbnB1dCIsImJhc2VDbGFzcyIsInByb3BzIiwiaWQiLCJuYW1lIiwiYXJpYUxhYmVsIiwiY2hlY2tlZCIsImlucHV0UmVmIiwibGFiZWwiLCJvblRvZ2dsZSIsInBhcnRpYWxDaGVja2VkIiwicmVhZE9ubHkiLCJyZXF1aXJlZCIsImNsYXNzTmFtZSIsImRpdiIsImZpbHRlciIsIkJvb2xlYW4iLCJqb2luIiwiaW5wdXQiLCJhcmlhLWxhYmVsIiwiZGVmYXVsdENoZWNrZWQiLCJkaXNhYmxlZCIsIm9uSW5wdXQiLCJyZWYiLCJ0eXBlIiwic3BhbiIsIkNoZWNrIiwiTGluZSIsIkxhYmVsIiwiaHRtbEZvciJdLCJtYXBwaW5ncyI6Ijs7OzsrQkF1QmFBOzs7ZUFBQUE7Ozs4REF2Qks7OERBRUE7NkRBQ0Q7OERBQ0M7UUFDWDs7Ozs7O0FBRVAsTUFBTUMsWUFBWTtBQWdCWCxNQUFNRCxnQkFBOEMsQ0FBQ0U7SUFDMUQsTUFBTSxFQUNKQyxFQUFFLEVBQ0ZDLElBQUksRUFDSixjQUFjQyxTQUFTLEVBQ3ZCQyxPQUFPLEVBQ1BDLFFBQVEsRUFDUkMsS0FBSyxFQUNMQyxRQUFRLEVBQ1JDLGNBQWMsRUFDZEMsUUFBUSxFQUNSQyxRQUFRLEVBQ1JDLFNBQVMsRUFDVixHQUFHWDtJQUVKLHFCQUNFLDZCQUFDWTtRQUNDRCxXQUFXO1lBQ1RaO1lBQ0FZO1lBQ0NQLENBQUFBLFdBQVdJLGNBQWEsS0FBTSxDQUFDLEVBQUVULFVBQVUsU0FBUyxDQUFDO1lBQ3REVSxZQUFZLENBQUMsRUFBRVYsVUFBVSxXQUFXLENBQUM7U0FDdEMsQ0FDRWMsTUFBTSxDQUFDQyxTQUNQQyxJQUFJLENBQUM7cUJBRVIsNkJBQUNIO1FBQUlELFdBQVcsQ0FBQyxFQUFFWixVQUFVLE9BQU8sQ0FBQztxQkFDbkMsNkJBQUNpQjtRQUNDQyxjQUFZZDtRQUNaZSxnQkFBZ0JKLFFBQVFWO1FBQ3hCZSxVQUFVVjtRQUNWUixJQUFJQTtRQUNKQyxNQUFNQTtRQUNOa0IsU0FBU2I7UUFDVGMsS0FBS2hCO1FBQ0xpQixNQUFLO3NCQUVQLDZCQUFDQztRQUFLWixXQUFXLENBQUMsRUFBRVosVUFBVSxPQUFPLEVBQUUsQ0FBQ1MsaUJBQWlCLFVBQVUsVUFBVSxDQUFDO09BQzNFLENBQUNBLGdDQUFrQiw2QkFBQ2dCLGNBQUssU0FDekJoQixnQ0FBa0IsNkJBQUNpQixhQUFJLFdBRzNCbkIsdUJBQVMsNkJBQUNvQixjQUFLO1FBQUNDLFNBQVMxQjtRQUFJSyxPQUFPQTtRQUFPSSxVQUFVQTs7QUFHNUQifQ==

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

@@ -1,78 +1,130 @@
 "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(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
     }
-    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 FieldDescription_1 = __importDefault(require("../../FieldDescription"));
-const getTranslation_1 = require("../../../../../utilities/getTranslation");
-const Input_1 = require("./Input");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _reacti18next = require("react-i18next");
+const _validations = require("../../../../../fields/validations");
+const _getTranslation = require("../../../../../utilities/getTranslation");
+const _Error = /*#__PURE__*/ _interop_require_default(require("../../Error"));
+const _FieldDescription = /*#__PURE__*/ _interop_require_default(require("../../FieldDescription"));
+const _useField = /*#__PURE__*/ _interop_require_default(require("../../useField"));
+const _withCondition = /*#__PURE__*/ _interop_require_default(require("../../withCondition"));
+const _Input = require("./Input");
 require("./index.scss");
+const _shared = require("../shared");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
 const baseClass = 'checkbox';
-const Checkbox = (props) => {
-    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 Checkbox = (props)=>{
+    const { name, admin: { className, condition, description, readOnly, style, width } = {}, disableFormData, label, onChange, path: pathFromProps, required, validate = _validations.checkbox } = props;
+    const { i18n } = (0, _reacti18next.useTranslation)();
     const path = pathFromProps || name;
-    const memoizedValidate = (0, react_1.useCallback)((value, options) => {
-        return validate(value, { ...options, required });
-    }, [validate, required]);
-    const { value, showError, errorMessage, setValue, } = (0, useField_1.default)({
-        path,
-        validate: memoizedValidate,
-        disableFormData,
+    const memoizedValidate = (0, _react.useCallback)((value, options)=>{
+        return validate(value, {
+            ...options,
+            required
+        });
+    }, [
+        validate,
+        required
+    ]);
+    const { errorMessage, setValue, showError, value } = (0, _useField.default)({
         condition,
+        disableFormData,
+        path,
+        validate: memoizedValidate
     });
-    const onToggle = (0, react_1.useCallback)(() => {
+    const onToggle = (0, _react.useCallback)(()=>{
         if (!readOnly) {
             setValue(!value);
-            if (typeof onChange === 'function')
-                onChange(!value);
+            if (typeof onChange === 'function') onChange(!value);
         }
-    }, [onChange, readOnly, setValue, value]);
-    const fieldID = `field-${path.replace(/\./gi, '__')}`;
-    return (react_1.default.createElement("div", { className: [
-            'field-type',
+    }, [
+        onChange,
+        readOnly,
+        setValue,
+        value
+    ]);
+    const fieldID = `field-${path.replace(/\./g, '__')}`;
+    return /*#__PURE__*/ _react.default.createElement("div", {
+        className: [
+            _shared.fieldBaseClass,
             baseClass,
             showError && 'error',
             className,
             value && `${baseClass}--checked`,
-            readOnly && `${baseClass}--read-only`,
-        ].filter(Boolean).join(' '), style: {
+            readOnly && `${baseClass}--read-only`
+        ].filter(Boolean).join(' '),
+        style: {
             ...style,
-            width,
-        } },
-        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_1.CheckboxInput, { onToggle: onToggle, id: fieldID, label: (0, getTranslation_1.getTranslation)(label || name, i18n), name: path, checked: Boolean(value), readOnly: readOnly }),
-        react_1.default.createElement(FieldDescription_1.default, { value: value, description: description })));
+            width
+        }
+    }, /*#__PURE__*/ _react.default.createElement("div", {
+        className: `${baseClass}__error-wrap`
+    }, /*#__PURE__*/ _react.default.createElement(_Error.default, {
+        message: errorMessage,
+        showError: showError
+    })), /*#__PURE__*/ _react.default.createElement(_Input.CheckboxInput, {
+        checked: Boolean(value),
+        id: fieldID,
+        label: (0, _getTranslation.getTranslation)(label || name, i18n),
+        name: path,
+        onToggle: onToggle,
+        readOnly: readOnly
+    }), /*#__PURE__*/ _react.default.createElement(_FieldDescription.default, {
+        description: description,
+        value: value
+    }));
 };
-exports.default = (0, withCondition_1.default)(Checkbox);
-//# sourceMappingURL=index.js.map
+const _default = (0, _withCondition.default)(Checkbox);
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9hZG1pbi9jb21wb25lbnRzL2Zvcm1zL2ZpZWxkLXR5cGVzL0NoZWNrYm94L2luZGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlQ2FsbGJhY2sgfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCdcblxuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnXG5cbmltcG9ydCB7IGNoZWNrYm94IH0gZnJvbSAnLi4vLi4vLi4vLi4vLi4vZmllbGRzL3ZhbGlkYXRpb25zJ1xuaW1wb3J0IHsgZ2V0VHJhbnNsYXRpb24gfSBmcm9tICcuLi8uLi8uLi8uLi8uLi91dGlsaXRpZXMvZ2V0VHJhbnNsYXRpb24nXG5pbXBvcnQgRXJyb3IgZnJvbSAnLi4vLi4vRXJyb3InXG5pbXBvcnQgRmllbGREZXNjcmlwdGlvbiBmcm9tICcuLi8uLi9GaWVsZERlc2NyaXB0aW9uJ1xuaW1wb3J0IHVzZUZpZWxkIGZyb20gJy4uLy4uL3VzZUZpZWxkJ1xuaW1wb3J0IHdpdGhDb25kaXRpb24gZnJvbSAnLi4vLi4vd2l0aENvbmRpdGlvbidcbmltcG9ydCB7IENoZWNrYm94SW5wdXQgfSBmcm9tICcuL0lucHV0J1xuaW1wb3J0ICcuL2luZGV4LnNjc3MnXG5pbXBvcnQgeyBmaWVsZEJhc2VDbGFzcyB9IGZyb20gJy4uL3NoYXJlZCdcblxuY29uc3QgYmFzZUNsYXNzID0gJ2NoZWNrYm94J1xuXG5jb25zdCBDaGVja2JveDogUmVhY3QuRkM8UHJvcHM+ID0gKHByb3BzKSA9PiB7XG4gIGNvbnN0IHtcbiAgICBuYW1lLFxuICAgIGFkbWluOiB7IGNsYXNzTmFtZSwgY29uZGl0aW9uLCBkZXNjcmlwdGlvbiwgcmVhZE9ubHksIHN0eWxlLCB3aWR0aCB9ID0ge30sXG4gICAgZGlzYWJsZUZvcm1EYXRhLFxuICAgIGxhYmVsLFxuICAgIG9uQ2hhbmdlLFxuICAgIHBhdGg6IHBhdGhGcm9tUHJvcHMsXG4gICAgcmVxdWlyZWQsXG4gICAgdmFsaWRhdGUgPSBjaGVja2JveCxcbiAgfSA9IHByb3BzXG5cbiAgY29uc3QgeyBpMThuIH0gPSB1c2VUcmFuc2xhdGlvbigpXG5cbiAgY29uc3QgcGF0aCA9IHBhdGhGcm9tUHJvcHMgfHwgbmFtZVxuXG4gIGNvbnN0IG1lbW9pemVkVmFsaWRhdGUgPSB1c2VDYWxsYmFjayhcbiAgICAodmFsdWUsIG9wdGlvbnMpID0+IHtcbiAgICAgIHJldHVybiB2YWxpZGF0ZSh2YWx1ZSwgeyAuLi5vcHRpb25zLCByZXF1aXJlZCB9KVxuICAgIH0sXG4gICAgW3ZhbGlkYXRlLCByZXF1aXJlZF0sXG4gIClcblxuICBjb25zdCB7IGVycm9yTWVzc2FnZSwgc2V0VmFsdWUsIHNob3dFcnJvciwgdmFsdWUgfSA9IHVzZUZpZWxkKHtcbiAgICBjb25kaXRpb24sXG4gICAgZGlzYWJsZUZvcm1EYXRhLFxuICAgIHBhdGgsXG4gICAgdmFsaWRhdGU6IG1lbW9pemVkVmFsaWRhdGUsXG4gIH0pXG5cbiAgY29uc3Qgb25Ub2dnbGUgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgaWYgKCFyZWFkT25seSkge1xuICAgICAgc2V0VmFsdWUoIXZhbHVlKVxuICAgICAgaWYgKHR5cGVvZiBvbkNoYW5nZSA9PT0gJ2Z1bmN0aW9uJykgb25DaGFuZ2UoIXZhbHVlKVxuICAgIH1cbiAgfSwgW29uQ2hhbmdlLCByZWFkT25seSwgc2V0VmFsdWUsIHZhbHVlXSlcblxuICBjb25zdCBmaWVsZElEID0gYGZpZWxkLSR7cGF0aC5yZXBsYWNlKC9cXC4vZywgJ19fJyl9YFxuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgY2xhc3NOYW1lPXtbXG4gICAgICAgIGZpZWxkQmFzZUNsYXNzLFxuICAgICAgICBiYXNlQ2xhc3MsXG4gICAgICAgIHNob3dFcnJvciAmJiAnZXJyb3InLFxuICAgICAgICBjbGFzc05hbWUsXG4gICAgICAgIHZhbHVlICYmIGAke2Jhc2VDbGFzc30tLWNoZWNrZWRgLFxuICAgICAgICByZWFkT25seSAmJiBgJHtiYXNlQ2xhc3N9LS1yZWFkLW9ubHlgLFxuICAgICAgXVxuICAgICAgICAuZmlsdGVyKEJvb2xlYW4pXG4gICAgICAgIC5qb2luKCcgJyl9XG4gICAgICBzdHlsZT17e1xuICAgICAgICAuLi5zdHlsZSxcbiAgICAgICAgd2lkdGgsXG4gICAgICB9fVxuICAgID5cbiAgICAgIDxkaXYgY2xhc3NOYW1lPXtgJHtiYXNlQ2xhc3N9X19lcnJvci13cmFwYH0+XG4gICAgICAgIDxFcnJvciBtZXNzYWdlPXtlcnJvck1lc3NhZ2V9IHNob3dFcnJvcj17c2hvd0Vycm9yfSAvPlxuICAgICAgPC9kaXY+XG4gICAgICA8Q2hlY2tib3hJbnB1dFxuICAgICAgICBjaGVja2VkPXtCb29sZWFuKHZhbHVlKX1cbiAgICAgICAgaWQ9e2ZpZWxkSUR9XG4gICAgICAgIGxhYmVsPXtnZXRUcmFuc2xhdGlvbihsYWJlbCB8fCBuYW1lLCBpMThuKX1cbiAgICAgICAgbmFtZT17cGF0aH1cbiAgICAgICAgb25Ub2dnbGU9e29uVG9nZ2xlfVxuICAgICAgICByZWFkT25seT17cmVhZE9ubHl9XG4gICAgICAvPlxuICAgICAgPEZpZWxkRGVzY3JpcHRpb24gZGVzY3JpcHRpb249e2Rlc2NyaXB0aW9ufSB2YWx1ZT17dmFsdWV9IC8+XG4gICAgPC9kaXY+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgd2l0aENvbmRpdGlvbihDaGVja2JveClcbiJdLCJuYW1lcyI6WyJiYXNlQ2xhc3MiLCJDaGVja2JveCIsInByb3BzIiwibmFtZSIsImFkbWluIiwiY2xhc3NOYW1lIiwiY29uZGl0aW9uIiwiZGVzY3JpcHRpb24iLCJyZWFkT25seSIsInN0eWxlIiwid2lkdGgiLCJkaXNhYmxlRm9ybURhdGEiLCJsYWJlbCIsIm9uQ2hhbmdlIiwicGF0aCIsInBhdGhGcm9tUHJvcHMiLCJyZXF1aXJlZCIsInZhbGlkYXRlIiwiY2hlY2tib3giLCJpMThuIiwidXNlVHJhbnNsYXRpb24iLCJtZW1vaXplZFZhbGlkYXRlIiwidXNlQ2FsbGJhY2siLCJ2YWx1ZSIsIm9wdGlvbnMiLCJlcnJvck1lc3NhZ2UiLCJzZXRWYWx1ZSIsInNob3dFcnJvciIsInVzZUZpZWxkIiwib25Ub2dnbGUiLCJmaWVsZElEIiwicmVwbGFjZSIsImRpdiIsImZpZWxkQmFzZUNsYXNzIiwiZmlsdGVyIiwiQm9vbGVhbiIsImpvaW4iLCJFcnJvciIsIm1lc3NhZ2UiLCJDaGVja2JveElucHV0IiwiY2hlY2tlZCIsImlkIiwiZ2V0VHJhbnNsYXRpb24iLCJGaWVsZERlc2NyaXB0aW9uIiwid2l0aENvbmRpdGlvbiJdLCJtYXBwaW5ncyI6Ijs7OzsrQkF5RkE7OztlQUFBOzs7K0RBekZtQzs4QkFDSjs2QkFJTjtnQ0FDTTs4REFDYjt5RUFDVztpRUFDUjtzRUFDSzt1QkFDSTtRQUN2Qjt3QkFDd0I7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUUvQixNQUFNQSxZQUFZO0FBRWxCLE1BQU1DLFdBQTRCLENBQUNDO0lBQ2pDLE1BQU0sRUFDSkMsSUFBSSxFQUNKQyxPQUFPLEVBQUVDLFNBQVMsRUFBRUMsU0FBUyxFQUFFQyxXQUFXLEVBQUVDLFFBQVEsRUFBRUMsS0FBSyxFQUFFQyxLQUFLLEVBQUUsR0FBRyxDQUFDLENBQUMsRUFDekVDLGVBQWUsRUFDZkMsS0FBSyxFQUNMQyxRQUFRLEVBQ1JDLE1BQU1DLGFBQWEsRUFDbkJDLFFBQVEsRUFDUkMsV0FBV0MscUJBQVEsRUFDcEIsR0FBR2hCO0lBRUosTUFBTSxFQUFFaUIsSUFBSSxFQUFFLEdBQUdDLElBQUFBLDRCQUFjO0lBRS9CLE1BQU1OLE9BQU9DLGlCQUFpQlo7SUFFOUIsTUFBTWtCLG1CQUFtQkMsSUFBQUEsa0JBQVcsRUFDbEMsQ0FBQ0MsT0FBT0M7UUFDTixPQUFPUCxTQUFTTSxPQUFPO1lBQUUsR0FBR0MsT0FBTztZQUFFUjtRQUFTO0lBQ2hELEdBQ0E7UUFBQ0M7UUFBVUQ7S0FBUztJQUd0QixNQUFNLEVBQUVTLFlBQVksRUFBRUMsUUFBUSxFQUFFQyxTQUFTLEVBQUVKLEtBQUssRUFBRSxHQUFHSyxJQUFBQSxpQkFBUSxFQUFDO1FBQzVEdEI7UUFDQUs7UUFDQUc7UUFDQUcsVUFBVUk7SUFDWjtJQUVBLE1BQU1RLFdBQVdQLElBQUFBLGtCQUFXLEVBQUM7UUFDM0IsSUFBSSxDQUFDZCxVQUFVO1lBQ2JrQixTQUFTLENBQUNIO1lBQ1YsSUFBSSxPQUFPVixhQUFhLFlBQVlBLFNBQVMsQ0FBQ1U7UUFDaEQ7SUFDRixHQUFHO1FBQUNWO1FBQVVMO1FBQVVrQjtRQUFVSDtLQUFNO0lBRXhDLE1BQU1PLFVBQVUsQ0FBQyxNQUFNLEVBQUVoQixLQUFLaUIsT0FBTyxDQUFDLE9BQU8sTUFBTSxDQUFDO0lBRXBELHFCQUNFLDZCQUFDQztRQUNDM0IsV0FBVztZQUNUNEIsc0JBQWM7WUFDZGpDO1lBQ0EyQixhQUFhO1lBQ2J0QjtZQUNBa0IsU0FBUyxDQUFDLEVBQUV2QixVQUFVLFNBQVMsQ0FBQztZQUNoQ1EsWUFBWSxDQUFDLEVBQUVSLFVBQVUsV0FBVyxDQUFDO1NBQ3RDLENBQ0VrQyxNQUFNLENBQUNDLFNBQ1BDLElBQUksQ0FBQztRQUNSM0IsT0FBTztZQUNMLEdBQUdBLEtBQUs7WUFDUkM7UUFDRjtxQkFFQSw2QkFBQ3NCO1FBQUkzQixXQUFXLENBQUMsRUFBRUwsVUFBVSxZQUFZLENBQUM7cUJBQ3hDLDZCQUFDcUMsY0FBSztRQUFDQyxTQUFTYjtRQUFjRSxXQUFXQTt1QkFFM0MsNkJBQUNZLG9CQUFhO1FBQ1pDLFNBQVNMLFFBQVFaO1FBQ2pCa0IsSUFBSVg7UUFDSmxCLE9BQU84QixJQUFBQSw4QkFBYyxFQUFDOUIsU0FBU1QsTUFBTWdCO1FBQ3JDaEIsTUFBTVc7UUFDTmUsVUFBVUE7UUFDVnJCLFVBQVVBO3NCQUVaLDZCQUFDbUMseUJBQWdCO1FBQUNwQyxhQUFhQTtRQUFhZ0IsT0FBT0E7O0FBR3pEO01BRUEsV0FBZXFCLElBQUFBLHNCQUFhLEVBQUMzQyJ9

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

@@ -4,10 +4,10 @@
   position: relative;
   margin-bottom: $baseline;
 
-  .tooltip:not([aria-hidden="true"]) {
+  .tooltip:not([aria-hidden='true']) {
     right: auto;
     position: relative;
-    margin-bottom: .2em;
+    margin-bottom: 0.2em;
     max-width: fit-content;
   }
 
@@ -16,13 +16,17 @@
   }
 }
 
-
-.custom-checkbox {
+.checkbox-input {
   display: inline-flex;
-  
+
   label {
     padding-bottom: 0;
-    padding-left: base(.5);
+    padding-left: base(0.5);
+  }
+
+  [dir='rtl'] &__input {
+    margin-right: 0;
+    margin-left: base(0.5);
   }
 
   &__input {
@@ -34,7 +38,7 @@
     width: $baseline;
     height: $baseline;
 
-    & input[type="checkbox"] {
+    & input[type='checkbox'] {
       position: absolute;
       // Without the extra 4px, there is an uncheckable area due to the border of the parent element
       width: calc(100% + 4px);
@@ -57,28 +61,29 @@
       opacity: 0;
     }
   }
-  
- 
+
   &:not(&--read-only) {
     &:active,
     &:focus-within,
     &:focus {
-      .custom-checkbox__input, & input[type="checkbox"] {
+      .checkbox-input__input,
+      & input[type='checkbox'] {
         @include inputShadowActive;
 
         outline: 0;
-        box-shadow: 0 0 3px 3px var(--theme-success-400)!important;
+        box-shadow: 0 0 3px 3px var(--theme-success-400) !important;
         border: 1px solid var(--theme-elevation-150);
       }
     }
 
     &:hover {
-      .custom-checkbox__input, & input[type="checkbox"] {
+      .checkbox-input__input,
+      & input[type='checkbox'] {
         border-color: var(--theme-elevation-250);
       }
     }
   }
-  
+
   &:not(&--read-only):not(&--checked) {
     &:hover {
       cursor: pointer;
@@ -90,7 +95,7 @@
   }
 
   &--checked {
-    .custom-checkbox__icon {
+    .checkbox-input__icon {
       svg {
         opacity: 1;
       }
@@ -98,7 +103,7 @@
   }
 
   &--read-only {
-    .custom-checkbox__input {
+    .checkbox-input__input {
       background-color: var(--theme-elevation-100);
     }
 
@@ -108,20 +113,20 @@
   }
 }
 
-html[data-theme=light] {
+html[data-theme='light'] {
   .checkbox {
     &.error {
-       .custom-checkbox__input {
+      .checkbox-input__input {
         @include lightInputError;
       }
     }
   }
 }
 
-html[data-theme=dark] {
+html[data-theme='dark'] {
   .checkbox {
     &.error {
-      .custom-checkbox__input {
+      .checkbox-input__input {
         @include darkInputError;
       }
     }

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

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