@contentful/field-editor-checkbox 1.1.12 → 1.2.0

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.2.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-checkbox@1.1.12...@contentful/field-editor-checkbox@1.2.0) (2023-04-19)
+
+### Features
+
+- upgrade cypress [TOL-1036] ([#1391](https://github.com/contentful/field-editors/issues/1391)) ([9c1aec9](https://github.com/contentful/field-editors/commit/9c1aec98aabbe464cdc3f1236c3bb1cc29b8208d))
+
 ## [1.1.12](https://github.com/contentful/field-editors/compare/@contentful/field-editor-checkbox@1.1.11...@contentful/field-editor-checkbox@1.1.12) (2023-03-14)
 
 **Note:** Version bump only for package @contentful/field-editor-checkbox

package/dist/field-editor-checkbox.cjs.development.js

@@ -5,24 +5,24 @@ Object.defineProperty(exports, '__esModule', { value: true });
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
 var React = require('react');
+var f36Components = require('@contentful/f36-components');
+var fieldEditorShared = require('@contentful/field-editor-shared');
 var emotion = require('emotion');
 var get = _interopDefault(require('lodash/get'));
-var fieldEditorShared = require('@contentful/field-editor-shared');
-var f36Components = require('@contentful/f36-components');
-var tokens = _interopDefault(require('@contentful/f36-tokens'));
 var nanoid = require('nanoid');
+var tokens = _interopDefault(require('@contentful/f36-tokens'));
 
-var form = /*#__PURE__*/emotion.css({
+const form = /*#__PURE__*/emotion.css({
   marginTop: tokens.spacingS
 });
-var rightToLeft = /*#__PURE__*/emotion.css({
+const rightToLeft = /*#__PURE__*/emotion.css({
   direction: 'rtl'
 });
-var invalidText = /*#__PURE__*/emotion.css({
+const invalidText = /*#__PURE__*/emotion.css({
   color: tokens.red500,
   marginLeft: tokens.spacing2Xs
 });
-var removeBtn = /*#__PURE__*/emotion.css({
+const removeBtn = /*#__PURE__*/emotion.css({
   marginLeft: tokens.spacingL
 });
 
@@ -32,115 +32,94 @@ function isEmptyListValue(value) {
 
 function getOptions(field, id) {
   // Get first object that has a 'in' property
-  var validations = get(field, ['items', 'validations'], []);
-  var predefinedValues = validations.filter(function (validation) {
-    return validation["in"];
-  }).map(function (validation) {
-    return validation["in"];
-  });
-  var firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];
-  return firstPredefinedValues.map(function (value, index) {
-    return {
-      // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)
-      id: ['entity', field.id, field.locale, index, id].join('.'),
-      value: value,
-      label: value
-    };
-  });
+  const validations = get(field, ['items', 'validations'], []);
+  const predefinedValues = validations.filter(validation => validation.in).map(validation => validation.in);
+  const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];
+  return firstPredefinedValues.map((value, index) => ({
+    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)
+    id: ['entity', field.id, field.locale, index, id].join('.'),
+    value,
+    label: value
+  }));
 }
 
-var getInvalidValues = function getInvalidValues(field, values, options) {
-  var getValueFromOptions = options.map(function (item) {
-    return item.value;
-  });
-  var invalidValues = values.filter(function (value) {
-    return !getValueFromOptions.includes(value);
-  }).map(function (value, index) {
-    return {
-      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),
-      label: value,
-      invalid: true,
-      value: value
-    };
-  });
+const getInvalidValues = (field, values, options) => {
+  const getValueFromOptions = options.map(item => item.value);
+  const invalidValues = values.filter(value => !getValueFromOptions.includes(value)).map((value, index) => ({
+    id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),
+    label: value,
+    invalid: true,
+    value
+  }));
   return invalidValues;
 };
 
 function CheckboxEditor(props) {
-  var _useState = React.useState(function () {
-    return nanoid.nanoid(6);
-  }),
-      id = _useState[0];
-
-  var field = props.field,
-      locales = props.locales;
-  var options = getOptions(field, id);
-  var misconfigured = options.length === 0;
+  const [id] = React.useState(() => nanoid.nanoid(6));
+  const {
+    field,
+    locales
+  } = props;
+  const options = getOptions(field, id);
+  const misconfigured = options.length === 0;
 
   if (misconfigured) {
     return React.createElement(fieldEditorShared.PredefinedValuesError, null);
   }
 
-  var direction = locales.direction[field.locale] || 'ltr';
+  const direction = locales.direction[field.locale] || 'ltr';
   return React.createElement(fieldEditorShared.FieldConnector, {
     throttle: 0,
     isEmptyValue: isEmptyListValue,
     field: field,
     isInitiallyDisabled: props.isInitiallyDisabled
-  }, function (_ref) {
-    var disabled = _ref.disabled,
-        value = _ref.value,
-        setValue = _ref.setValue;
-    var values = value || [];
+  }, ({
+    disabled,
+    value,
+    setValue
+  }) => {
+    const values = value || [];
 
-    var addValue = function addValue(value) {
-      var newValues = [].concat(values.filter(function (item) {
-        return item !== value;
-      }), [value]);
+    const addValue = value => {
+      const newValues = [...values.filter(item => item !== value), value];
       setValue(newValues);
     };
 
-    var removeValue = function removeValue(value) {
-      var newValues = values.filter(function (item) {
-        return item !== value;
-      });
+    const removeValue = value => {
+      const newValues = values.filter(item => item !== value);
       setValue(newValues);
     };
 
-    var invalidValues = getInvalidValues(field, values, options);
-    var mergedOptions = [].concat(options, invalidValues);
+    const invalidValues = getInvalidValues(field, values, options);
+    const mergedOptions = [...options, ...invalidValues];
     return React.createElement(f36Components.Form, {
       testId: "checkbox-editor",
       className: emotion.cx(form, direction === 'rtl' ? rightToLeft : '')
-    }, mergedOptions.map(function (item) {
-      return React.createElement(f36Components.Box, {
-        key: item.id,
-        marginBottom: "spacingS"
-      }, React.createElement(f36Components.Checkbox, {
-        key: item.id,
-        id: item.id,
-        isChecked: values.includes(item.value),
-        isDisabled: disabled,
-        value: item.value,
-        name: field.id + "." + field.locale,
-        onChange: function onChange(e) {
-          if (e.target.checked) {
-            addValue(item.value);
-          } else {
-            removeValue(item.value);
-          }
-        }
-      }, item.label), item.invalid && React.createElement(React.Fragment, null, React.createElement("span", {
-        "data-test-id": "invalid-text",
-        className: invalidText
-      }, "(invalid)"), React.createElement(f36Components.TextLink, {
-        as: "button",
-        className: removeBtn,
-        onClick: function onClick() {
-          return removeValue(item.value);
+    }, mergedOptions.map(item => React.createElement(f36Components.Box, {
+      key: item.id,
+      marginBottom: "spacingS"
+    }, React.createElement(f36Components.Checkbox, {
+      key: item.id,
+      id: item.id,
+      isChecked: values.includes(item.value),
+      isDisabled: disabled,
+      value: item.value,
+      name: `${field.id}.${field.locale}`,
+      onChange: e => {
+        if (e.target.checked) {
+          addValue(item.value);
+        } else {
+          removeValue(item.value);
         }
-      }, "Remove")));
-    }));
+      }
+    }, item.label), item.invalid && React.createElement(React.Fragment, null, React.createElement("span", {
+      "data-test-id": "invalid-text",
+      className: invalidText
+    }, "(invalid)"), React.createElement(f36Components.TextLink, {
+      as: "button",
+      className: removeBtn,
+      onClick: () => removeValue(item.value)
+    }, "Remove")))));
   });
 }
 CheckboxEditor.defaultProps = {

package/dist/field-editor-checkbox.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-editor-checkbox.cjs.development.js","sources":["../src/styles.ts","../src/CheckboxEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const form = css({\n  marginTop: tokens.spacingS,\n});\n\nexport const rightToLeft = css({\n  direction: 'rtl',\n});\n\nexport const invalidText = css({\n  color: tokens.red500,\n  marginLeft: tokens.spacing2Xs,\n});\n\nexport const removeBtn = css({\n  marginLeft: tokens.spacingL,\n});\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { cx } from 'emotion';\nimport get from 'lodash/get';\nimport {\n  FieldAPI,\n  FieldConnector,\n  LocalesAPI,\n  PredefinedValuesError,\n} from '@contentful/field-editor-shared';\nimport { Checkbox, Box } from '@contentful/f36-components';\nimport * as styles from './styles';\nimport { nanoid } from 'nanoid';\n\nimport { TextLink, Form } from '@contentful/f36-components';\n\nexport interface CheckboxEditorProps {\n  /**\n   * is the field disabled initially\n   */\n  isInitiallyDisabled: boolean;\n  /**\n   * sdk.field\n   */\n  field: FieldAPI;\n  /**\n   * sdk.locales\n   */\n  locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\ntype CheckboxOption = { id: string; value: string; label: string; invalid?: boolean };\n\nfunction isEmptyListValue(value: ListValue | null) {\n  return value === null || value.length === 0;\n}\n\nfunction getOptions(field: FieldAPI, id: string): CheckboxOption[] {\n  // Get first object that has a 'in' property\n  const validations = get(field, ['items', 'validations'], []) as Record<\n    string,\n    { in?: string[] }\n  >[];\n\n  const predefinedValues = validations\n    .filter((validation) => validation.in)\n    .map((validation) => validation.in);\n\n  const firstPredefinedValues = (\n    predefinedValues.length > 0 ? predefinedValues[0] : []\n  ) as string[];\n\n  return firstPredefinedValues.map((value: string, index) => ({\n    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)\n    id: ['entity', field.id, field.locale, index, id].join('.'),\n    value,\n    label: value,\n  }));\n}\n\nconst getInvalidValues = (\n  field: FieldAPI,\n  values: string[],\n  options: CheckboxOption[]\n): CheckboxOption[] => {\n  const getValueFromOptions = (options as CheckboxOption[]).map((item) => item.value);\n  const invalidValues = values\n    .filter((value) => !getValueFromOptions.includes(value))\n    .map((value, index) => ({\n      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),\n      label: value,\n      invalid: true,\n      value,\n    }));\n\n  return invalidValues;\n};\n\nexport function CheckboxEditor(props: CheckboxEditorProps) {\n  const [id] = useState(() => nanoid(6));\n  const { field, locales } = props;\n\n  const options = getOptions(field, id);\n  const misconfigured = options.length === 0;\n\n  if (misconfigured) {\n    return <PredefinedValuesError />;\n  }\n\n  const direction = locales.direction[field.locale] || 'ltr';\n\n  return (\n    <FieldConnector<ListValue>\n      throttle={0}\n      isEmptyValue={isEmptyListValue}\n      field={field}\n      isInitiallyDisabled={props.isInitiallyDisabled}>\n      {({ disabled, value, setValue }) => {\n        const values = value || [];\n\n        const addValue = (value: string) => {\n          const newValues = [...values.filter((item) => item !== value), value];\n          setValue(newValues);\n        };\n\n        const removeValue = (value: string) => {\n          const newValues = values.filter((item) => item !== value);\n          setValue(newValues);\n        };\n\n        const invalidValues = getInvalidValues(field, values, options);\n        const mergedOptions = [...options, ...invalidValues];\n\n        return (\n          <Form\n            testId=\"checkbox-editor\"\n            className={cx(styles.form, direction === 'rtl' ? styles.rightToLeft : '')}>\n            {mergedOptions.map((item) => (\n              <Box key={item.id} marginBottom=\"spacingS\">\n                <Checkbox\n                  key={item.id}\n                  id={item.id}\n                  isChecked={values.includes(item.value)}\n                  isDisabled={disabled}\n                  value={item.value}\n                  name={`${field.id}.${field.locale}`}\n                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n                    if (e.target.checked) {\n                      addValue(item.value);\n                    } else {\n                      removeValue(item.value);\n                    }\n                  }}>\n                  {item.label}\n                </Checkbox>\n                {item.invalid && (\n                  <>\n                    <span data-test-id=\"invalid-text\" className={styles.invalidText}>\n                      (invalid)\n                    </span>\n                    <TextLink\n                      as=\"button\"\n                      className={styles.removeBtn}\n                      onClick={() => removeValue(item.value)}>\n                      Remove\n                    </TextLink>\n                  </>\n                )}\n              </Box>\n            ))}\n          </Form>\n        );\n      }}\n    </FieldConnector>\n  );\n}\n\nCheckboxEditor.defaultProps = {\n  isInitiallyDisabled: true,\n};\n"],"names":["form","css","marginTop","tokens","spacingS","rightToLeft","direction","invalidText","color","red500","marginLeft","spacing2Xs","removeBtn","spacingL","isEmptyListValue","value","length","getOptions","field","id","validations","get","predefinedValues","filter","validation","map","firstPredefinedValues","index","locale","join","label","getInvalidValues","values","options","getValueFromOptions","item","invalidValues","includes","invalid","CheckboxEditor","props","useState","nanoid","locales","misconfigured","React","PredefinedValuesError","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","disabled","setValue","addValue","newValues","removeValue","mergedOptions","Form","testId","className","cx","styles","Box","key","marginBottom","Checkbox","isChecked","isDisabled","name","onChange","e","target","checked","TextLink","as","onClick","defaultProps"],"mappings":"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"}
+{"version":3,"file":"field-editor-checkbox.cjs.development.js","sources":["../src/styles.ts","../src/CheckboxEditor.tsx"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport const form = css({\n  marginTop: tokens.spacingS,\n});\n\nexport const rightToLeft = css({\n  direction: 'rtl',\n});\n\nexport const invalidText = css({\n  color: tokens.red500,\n  marginLeft: tokens.spacing2Xs,\n});\n\nexport const removeBtn = css({\n  marginLeft: tokens.spacingL,\n});\n","import * as React from 'react';\nimport { useState } from 'react';\n\nimport { Checkbox, Box } from '@contentful/f36-components';\nimport { TextLink, Form } from '@contentful/f36-components';\nimport {\n  FieldAPI,\n  FieldConnector,\n  LocalesAPI,\n  PredefinedValuesError,\n} from '@contentful/field-editor-shared';\nimport { cx } from 'emotion';\nimport get from 'lodash/get';\nimport { nanoid } from 'nanoid';\n\nimport * as styles from './styles';\n\n\nexport interface CheckboxEditorProps {\n  /**\n   * is the field disabled initially\n   */\n  isInitiallyDisabled: boolean;\n  /**\n   * sdk.field\n   */\n  field: FieldAPI;\n  /**\n   * sdk.locales\n   */\n  locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\ntype CheckboxOption = { id: string; value: string; label: string; invalid?: boolean };\n\nfunction isEmptyListValue(value: ListValue | null) {\n  return value === null || value.length === 0;\n}\n\nfunction getOptions(field: FieldAPI, id: string): CheckboxOption[] {\n  // Get first object that has a 'in' property\n  const validations = get(field, ['items', 'validations'], []) as Record<\n    string,\n    { in?: string[] }\n  >[];\n\n  const predefinedValues = validations\n    .filter((validation) => validation.in)\n    .map((validation) => validation.in);\n\n  const firstPredefinedValues = (\n    predefinedValues.length > 0 ? predefinedValues[0] : []\n  ) as string[];\n\n  return firstPredefinedValues.map((value: string, index) => ({\n    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)\n    id: ['entity', field.id, field.locale, index, id].join('.'),\n    value,\n    label: value,\n  }));\n}\n\nconst getInvalidValues = (\n  field: FieldAPI,\n  values: string[],\n  options: CheckboxOption[]\n): CheckboxOption[] => {\n  const getValueFromOptions = (options as CheckboxOption[]).map((item) => item.value);\n  const invalidValues = values\n    .filter((value) => !getValueFromOptions.includes(value))\n    .map((value, index) => ({\n      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),\n      label: value,\n      invalid: true,\n      value,\n    }));\n\n  return invalidValues;\n};\n\nexport function CheckboxEditor(props: CheckboxEditorProps) {\n  const [id] = useState(() => nanoid(6));\n  const { field, locales } = props;\n\n  const options = getOptions(field, id);\n  const misconfigured = options.length === 0;\n\n  if (misconfigured) {\n    return <PredefinedValuesError />;\n  }\n\n  const direction = locales.direction[field.locale] || 'ltr';\n\n  return (\n    <FieldConnector<ListValue>\n      throttle={0}\n      isEmptyValue={isEmptyListValue}\n      field={field}\n      isInitiallyDisabled={props.isInitiallyDisabled}>\n      {({ disabled, value, setValue }) => {\n        const values = value || [];\n\n        const addValue = (value: string) => {\n          const newValues = [...values.filter((item) => item !== value), value];\n          setValue(newValues);\n        };\n\n        const removeValue = (value: string) => {\n          const newValues = values.filter((item) => item !== value);\n          setValue(newValues);\n        };\n\n        const invalidValues = getInvalidValues(field, values, options);\n        const mergedOptions = [...options, ...invalidValues];\n\n        return (\n          <Form\n            testId=\"checkbox-editor\"\n            className={cx(styles.form, direction === 'rtl' ? styles.rightToLeft : '')}>\n            {mergedOptions.map((item) => (\n              <Box key={item.id} marginBottom=\"spacingS\">\n                <Checkbox\n                  key={item.id}\n                  id={item.id}\n                  isChecked={values.includes(item.value)}\n                  isDisabled={disabled}\n                  value={item.value}\n                  name={`${field.id}.${field.locale}`}\n                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n                    if (e.target.checked) {\n                      addValue(item.value);\n                    } else {\n                      removeValue(item.value);\n                    }\n                  }}>\n                  {item.label}\n                </Checkbox>\n                {item.invalid && (\n                  <>\n                    <span data-test-id=\"invalid-text\" className={styles.invalidText}>\n                      (invalid)\n                    </span>\n                    <TextLink\n                      as=\"button\"\n                      className={styles.removeBtn}\n                      onClick={() => removeValue(item.value)}>\n                      Remove\n                    </TextLink>\n                  </>\n                )}\n              </Box>\n            ))}\n          </Form>\n        );\n      }}\n    </FieldConnector>\n  );\n}\n\nCheckboxEditor.defaultProps = {\n  isInitiallyDisabled: true,\n};\n"],"names":["form","css","marginTop","tokens","spacingS","rightToLeft","direction","invalidText","color","red500","marginLeft","spacing2Xs","removeBtn","spacingL","isEmptyListValue","value","length","getOptions","field","id","validations","get","predefinedValues","filter","validation","in","map","firstPredefinedValues","index","locale","join","label","getInvalidValues","values","options","getValueFromOptions","item","invalidValues","includes","invalid","CheckboxEditor","props","useState","nanoid","locales","misconfigured","React","PredefinedValuesError","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","disabled","setValue","addValue","newValues","removeValue","mergedOptions","Form","testId","className","cx","styles","Box","key","marginBottom","Checkbox","isChecked","isDisabled","name","onChange","e","target","checked","TextLink","as","onClick","defaultProps"],"mappings":"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"}

package/dist/field-editor-checkbox.cjs.production.min.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react"),t=require("emotion"),i=e(require("lodash/get")),r=require("@contentful/field-editor-shared"),a=require("@contentful/f36-components"),l=e(require("@contentful/f36-tokens")),u=require("nanoid"),c=t.css({marginTop:l.spacingS}),o=t.css({direction:"rtl"}),s=t.css({color:l.red500,marginLeft:l.spacing2Xs}),d=t.css({marginLeft:l.spacingL});function f(e){return null===e||0===e.length}function m(e){var l=n.useState((function(){return u.nanoid(6)})),m=e.field,v=e.locales,p=function(e,n){var t=i(e,["items","validations"],[]).filter((function(e){return e.in})).map((function(e){return e.in}));return(t.length>0?t[0]:[]).map((function(t,i){return{id:["entity",e.id,e.locale,i,n].join("."),value:t,label:t}}))}(m,l[0]);if(0===p.length)return n.createElement(r.PredefinedValuesError,null);var g=v.direction[m.locale]||"ltr";return n.createElement(r.FieldConnector,{throttle:0,isEmptyValue:f,field:m,isInitiallyDisabled:e.isInitiallyDisabled},(function(e){var i=e.disabled,r=e.setValue,l=e.value||[],u=function(e){var n=l.filter((function(n){return n!==e}));r(n)},f=function(e,n,t){var i=t.map((function(e){return e.value}));return n.filter((function(e){return!i.includes(e)})).map((function(n,t){return{id:["entity",e.id,e.locale,t,"invalid"].join("."),label:n,invalid:!0,value:n}}))}(m,l,p),v=[].concat(p,f);return n.createElement(a.Form,{testId:"checkbox-editor",className:t.cx(c,"rtl"===g?o:"")},v.map((function(e){return n.createElement(a.Box,{key:e.id,marginBottom:"spacingS"},n.createElement(a.Checkbox,{key:e.id,id:e.id,isChecked:l.includes(e.value),isDisabled:i,value:e.value,name:m.id+"."+m.locale,onChange:function(n){var t,i;n.target.checked?(t=e.value,i=[].concat(l.filter((function(e){return e!==t})),[t]),r(i)):u(e.value)}},e.label),e.invalid&&n.createElement(n.Fragment,null,n.createElement("span",{"data-test-id":"invalid-text",className:s},"(invalid)"),n.createElement(a.TextLink,{as:"button",className:d,onClick:function(){return u(e.value)}},"Remove")))})))}))}m.defaultProps={isInitiallyDisabled:!0},exports.CheckboxEditor=m;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),i=require("@contentful/f36-components"),l=require("@contentful/field-editor-shared"),n=require("emotion"),a=e(require("lodash/get")),r=require("nanoid"),o=e(require("@contentful/f36-tokens"));const s=n.css({marginTop:o.spacingS}),c=n.css({direction:"rtl"}),d=n.css({color:o.red500,marginLeft:o.spacing2Xs}),u=n.css({marginLeft:o.spacingL});function m(e){return null===e||0===e.length}function f(e){const[o]=t.useState(()=>r.nanoid(6)),{field:f,locales:v}=e,p=function(e,t){const i=a(e,["items","validations"],[]).filter(e=>e.in).map(e=>e.in);return(i.length>0?i[0]:[]).map((i,l)=>({id:["entity",e.id,e.locale,l,t].join("."),value:i,label:i}))}(f,o);if(0===p.length)return t.createElement(l.PredefinedValuesError,null);const g=v.direction[f.locale]||"ltr";return t.createElement(l.FieldConnector,{throttle:0,isEmptyValue:m,field:f,isInitiallyDisabled:e.isInitiallyDisabled},({disabled:e,value:l,setValue:a})=>{const r=l||[],o=e=>{const t=r.filter(t=>t!==e);a(t)},m=((e,t,i)=>{const l=i.map(e=>e.value);return t.filter(e=>!l.includes(e)).map((t,i)=>({id:["entity",e.id,e.locale,i,"invalid"].join("."),label:t,invalid:!0,value:t}))})(f,r,p),v=[...p,...m];return t.createElement(i.Form,{testId:"checkbox-editor",className:n.cx(s,"rtl"===g?c:"")},v.map(l=>t.createElement(i.Box,{key:l.id,marginBottom:"spacingS"},t.createElement(i.Checkbox,{key:l.id,id:l.id,isChecked:r.includes(l.value),isDisabled:e,value:l.value,name:`${f.id}.${f.locale}`,onChange:e=>{e.target.checked?(e=>{const t=[...r.filter(t=>t!==e),e];a(t)})(l.value):o(l.value)}},l.label),l.invalid&&t.createElement(t.Fragment,null,t.createElement("span",{"data-test-id":"invalid-text",className:d},"(invalid)"),t.createElement(i.TextLink,{as:"button",className:u,onClick:()=>o(l.value)},"Remove")))))})}f.defaultProps={isInitiallyDisabled:!0},exports.CheckboxEditor=f;
 //# sourceMappingURL=field-editor-checkbox.cjs.production.min.js.map

package/dist/field-editor-checkbox.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-editor-checkbox.cjs.production.min.js","sources":["../src/styles.ts","../src/CheckboxEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const form = css({\n  marginTop: tokens.spacingS,\n});\n\nexport const rightToLeft = css({\n  direction: 'rtl',\n});\n\nexport const invalidText = css({\n  color: tokens.red500,\n  marginLeft: tokens.spacing2Xs,\n});\n\nexport const removeBtn = css({\n  marginLeft: tokens.spacingL,\n});\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { cx } from 'emotion';\nimport get from 'lodash/get';\nimport {\n  FieldAPI,\n  FieldConnector,\n  LocalesAPI,\n  PredefinedValuesError,\n} from '@contentful/field-editor-shared';\nimport { Checkbox, Box } from '@contentful/f36-components';\nimport * as styles from './styles';\nimport { nanoid } from 'nanoid';\n\nimport { TextLink, Form } from '@contentful/f36-components';\n\nexport interface CheckboxEditorProps {\n  /**\n   * is the field disabled initially\n   */\n  isInitiallyDisabled: boolean;\n  /**\n   * sdk.field\n   */\n  field: FieldAPI;\n  /**\n   * sdk.locales\n   */\n  locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\ntype CheckboxOption = { id: string; value: string; label: string; invalid?: boolean };\n\nfunction isEmptyListValue(value: ListValue | null) {\n  return value === null || value.length === 0;\n}\n\nfunction getOptions(field: FieldAPI, id: string): CheckboxOption[] {\n  // Get first object that has a 'in' property\n  const validations = get(field, ['items', 'validations'], []) as Record<\n    string,\n    { in?: string[] }\n  >[];\n\n  const predefinedValues = validations\n    .filter((validation) => validation.in)\n    .map((validation) => validation.in);\n\n  const firstPredefinedValues = (\n    predefinedValues.length > 0 ? predefinedValues[0] : []\n  ) as string[];\n\n  return firstPredefinedValues.map((value: string, index) => ({\n    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)\n    id: ['entity', field.id, field.locale, index, id].join('.'),\n    value,\n    label: value,\n  }));\n}\n\nconst getInvalidValues = (\n  field: FieldAPI,\n  values: string[],\n  options: CheckboxOption[]\n): CheckboxOption[] => {\n  const getValueFromOptions = (options as CheckboxOption[]).map((item) => item.value);\n  const invalidValues = values\n    .filter((value) => !getValueFromOptions.includes(value))\n    .map((value, index) => ({\n      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),\n      label: value,\n      invalid: true,\n      value,\n    }));\n\n  return invalidValues;\n};\n\nexport function CheckboxEditor(props: CheckboxEditorProps) {\n  const [id] = useState(() => nanoid(6));\n  const { field, locales } = props;\n\n  const options = getOptions(field, id);\n  const misconfigured = options.length === 0;\n\n  if (misconfigured) {\n    return <PredefinedValuesError />;\n  }\n\n  const direction = locales.direction[field.locale] || 'ltr';\n\n  return (\n    <FieldConnector<ListValue>\n      throttle={0}\n      isEmptyValue={isEmptyListValue}\n      field={field}\n      isInitiallyDisabled={props.isInitiallyDisabled}>\n      {({ disabled, value, setValue }) => {\n        const values = value || [];\n\n        const addValue = (value: string) => {\n          const newValues = [...values.filter((item) => item !== value), value];\n          setValue(newValues);\n        };\n\n        const removeValue = (value: string) => {\n          const newValues = values.filter((item) => item !== value);\n          setValue(newValues);\n        };\n\n        const invalidValues = getInvalidValues(field, values, options);\n        const mergedOptions = [...options, ...invalidValues];\n\n        return (\n          <Form\n            testId=\"checkbox-editor\"\n            className={cx(styles.form, direction === 'rtl' ? styles.rightToLeft : '')}>\n            {mergedOptions.map((item) => (\n              <Box key={item.id} marginBottom=\"spacingS\">\n                <Checkbox\n                  key={item.id}\n                  id={item.id}\n                  isChecked={values.includes(item.value)}\n                  isDisabled={disabled}\n                  value={item.value}\n                  name={`${field.id}.${field.locale}`}\n                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n                    if (e.target.checked) {\n                      addValue(item.value);\n                    } else {\n                      removeValue(item.value);\n                    }\n                  }}>\n                  {item.label}\n                </Checkbox>\n                {item.invalid && (\n                  <>\n                    <span data-test-id=\"invalid-text\" className={styles.invalidText}>\n                      (invalid)\n                    </span>\n                    <TextLink\n                      as=\"button\"\n                      className={styles.removeBtn}\n                      onClick={() => removeValue(item.value)}>\n                      Remove\n                    </TextLink>\n                  </>\n                )}\n              </Box>\n            ))}\n          </Form>\n        );\n      }}\n    </FieldConnector>\n  );\n}\n\nCheckboxEditor.defaultProps = {\n  isInitiallyDisabled: true,\n};\n"],"names":["form","css","marginTop","tokens","spacingS","rightToLeft","direction","invalidText","color","red500","marginLeft","spacing2Xs","removeBtn","spacingL","isEmptyListValue","value","length","CheckboxEditor","props","useState","nanoid","field","locales","options","id","predefinedValues","get","filter","validation","map","index","locale","join","label","getOptions","React","PredefinedValuesError","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","disabled","setValue","values","removeValue","newValues","item","invalidValues","getValueFromOptions","includes","invalid","getInvalidValues","mergedOptions","Form","testId","className","cx","styles","Box","key","marginBottom","Checkbox","isChecked","isDisabled","name","onChange","e","target","checked","TextLink","as","onClick","defaultProps"],"mappings":"iWAGaA,EAAOC,MAAI,CACtBC,UAAWC,EAAOC,WAGPC,EAAcJ,MAAI,CAC7BK,UAAW,QAGAC,EAAcN,MAAI,CAC7BO,MAAOL,EAAOM,OACdC,WAAYP,EAAOQ,aAGRC,EAAYX,MAAI,CAC3BS,WAAYP,EAAOU,WCkBrB,SAASC,EAAiBC,UACP,OAAVA,GAAmC,IAAjBA,EAAMC,gBA4CjBC,EAAeC,SAChBC,YAAS,kBAAMC,SAAO,MAC3BC,EAAmBH,EAAnBG,MAAOC,EAAYJ,EAAZI,QAETC,EA7CR,SAAoBF,EAAiBG,OAO7BC,EALcC,EAAIL,EAAO,CAAC,QAAS,eAAgB,IAMtDM,QAAO,SAACC,UAAeA,QACvBC,KAAI,SAACD,UAAeA,eAGrBH,EAAiBT,OAAS,EAAIS,EAAiB,GAAK,IAGzBI,KAAI,SAACd,EAAee,SAAW,CAE1DN,GAAI,CAAC,SAAUH,EAAMG,GAAIH,EAAMU,OAAQD,EAAON,GAAIQ,KAAK,KACvDjB,MAAAA,EACAkB,MAAOlB,MA0BOmB,CAAWb,WACc,IAAnBE,EAAQP,cAGrBmB,gBAACC,kCAGJ9B,EAAYgB,EAAQhB,UAAUe,EAAMU,SAAW,aAGnDI,gBAACE,kBACCC,SAAU,EACVC,aAAczB,EACdO,MAAOA,EACPmB,oBAAqBtB,EAAMsB,sBAC1B,gBAAGC,IAAAA,SAAiBC,IAAAA,SACbC,IADM5B,OACY,GAOlB6B,EAAc,SAAC7B,OACb8B,EAAYF,EAAOhB,QAAO,SAACmB,UAASA,IAAS/B,KACnD2B,EAASG,IAGLE,EAlDW,SACvB1B,EACAsB,EACApB,OAEMyB,EAAuBzB,EAA6BM,KAAI,SAACiB,UAASA,EAAK/B,gBACvD4B,EACnBhB,QAAO,SAACZ,UAAWiC,EAAoBC,SAASlC,MAChDc,KAAI,SAACd,EAAOe,SAAW,CACtBN,GAAI,CAAC,SAAUH,EAAMG,GAAIH,EAAMU,OAAQD,EAAO,WAAWE,KAAK,KAC9DC,MAAOlB,EACPmC,SAAS,EACTnC,MAAAA,MAsCwBoC,CAAiB9B,EAAOsB,EAAQpB,GAChD6B,YAAoB7B,EAAYwB,UAGpCZ,gBAACkB,QACCC,OAAO,kBACPC,UAAWC,KAAGC,EAA2B,QAAdnD,EAAsBmD,EAAqB,KACrEL,EAAcvB,KAAI,SAACiB,UAClBX,gBAACuB,OAAIC,IAAKb,EAAKtB,GAAIoC,aAAa,YAC9BzB,gBAAC0B,YACCF,IAAKb,EAAKtB,GACVA,GAAIsB,EAAKtB,GACTsC,UAAWnB,EAAOM,SAASH,EAAK/B,OAChCgD,WAAYtB,EACZ1B,MAAO+B,EAAK/B,MACZiD,KAAS3C,EAAMG,OAAMH,EAAMU,OAC3BkC,SAAU,SAACC,GA1BJ,IAACnD,EACV8B,EA0BQqB,EAAEC,OAAOC,SA3BPrD,EA4BK+B,EAAK/B,MA3BpB8B,YAAgBF,EAAOhB,QAAO,SAACmB,UAASA,IAAS/B,MAAQA,IAC/D2B,EAASG,IA4BGD,EAAYE,EAAK/B,SAGpB+B,EAAKb,OAEPa,EAAKI,SACJf,gCACEA,uCAAmB,eAAeoB,UAAWE,gBAG7CtB,gBAACkC,YACCC,GAAG,SACHf,UAAWE,EACXc,QAAS,kBAAM3B,EAAYE,EAAK/B,4BActDE,EAAeuD,aAAe,CAC5BhC,qBAAqB"}
+{"version":3,"file":"field-editor-checkbox.cjs.production.min.js","sources":["../src/styles.ts","../src/CheckboxEditor.tsx"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport const form = css({\n  marginTop: tokens.spacingS,\n});\n\nexport const rightToLeft = css({\n  direction: 'rtl',\n});\n\nexport const invalidText = css({\n  color: tokens.red500,\n  marginLeft: tokens.spacing2Xs,\n});\n\nexport const removeBtn = css({\n  marginLeft: tokens.spacingL,\n});\n","import * as React from 'react';\nimport { useState } from 'react';\n\nimport { Checkbox, Box } from '@contentful/f36-components';\nimport { TextLink, Form } from '@contentful/f36-components';\nimport {\n  FieldAPI,\n  FieldConnector,\n  LocalesAPI,\n  PredefinedValuesError,\n} from '@contentful/field-editor-shared';\nimport { cx } from 'emotion';\nimport get from 'lodash/get';\nimport { nanoid } from 'nanoid';\n\nimport * as styles from './styles';\n\n\nexport interface CheckboxEditorProps {\n  /**\n   * is the field disabled initially\n   */\n  isInitiallyDisabled: boolean;\n  /**\n   * sdk.field\n   */\n  field: FieldAPI;\n  /**\n   * sdk.locales\n   */\n  locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\ntype CheckboxOption = { id: string; value: string; label: string; invalid?: boolean };\n\nfunction isEmptyListValue(value: ListValue | null) {\n  return value === null || value.length === 0;\n}\n\nfunction getOptions(field: FieldAPI, id: string): CheckboxOption[] {\n  // Get first object that has a 'in' property\n  const validations = get(field, ['items', 'validations'], []) as Record<\n    string,\n    { in?: string[] }\n  >[];\n\n  const predefinedValues = validations\n    .filter((validation) => validation.in)\n    .map((validation) => validation.in);\n\n  const firstPredefinedValues = (\n    predefinedValues.length > 0 ? predefinedValues[0] : []\n  ) as string[];\n\n  return firstPredefinedValues.map((value: string, index) => ({\n    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)\n    id: ['entity', field.id, field.locale, index, id].join('.'),\n    value,\n    label: value,\n  }));\n}\n\nconst getInvalidValues = (\n  field: FieldAPI,\n  values: string[],\n  options: CheckboxOption[]\n): CheckboxOption[] => {\n  const getValueFromOptions = (options as CheckboxOption[]).map((item) => item.value);\n  const invalidValues = values\n    .filter((value) => !getValueFromOptions.includes(value))\n    .map((value, index) => ({\n      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),\n      label: value,\n      invalid: true,\n      value,\n    }));\n\n  return invalidValues;\n};\n\nexport function CheckboxEditor(props: CheckboxEditorProps) {\n  const [id] = useState(() => nanoid(6));\n  const { field, locales } = props;\n\n  const options = getOptions(field, id);\n  const misconfigured = options.length === 0;\n\n  if (misconfigured) {\n    return <PredefinedValuesError />;\n  }\n\n  const direction = locales.direction[field.locale] || 'ltr';\n\n  return (\n    <FieldConnector<ListValue>\n      throttle={0}\n      isEmptyValue={isEmptyListValue}\n      field={field}\n      isInitiallyDisabled={props.isInitiallyDisabled}>\n      {({ disabled, value, setValue }) => {\n        const values = value || [];\n\n        const addValue = (value: string) => {\n          const newValues = [...values.filter((item) => item !== value), value];\n          setValue(newValues);\n        };\n\n        const removeValue = (value: string) => {\n          const newValues = values.filter((item) => item !== value);\n          setValue(newValues);\n        };\n\n        const invalidValues = getInvalidValues(field, values, options);\n        const mergedOptions = [...options, ...invalidValues];\n\n        return (\n          <Form\n            testId=\"checkbox-editor\"\n            className={cx(styles.form, direction === 'rtl' ? styles.rightToLeft : '')}>\n            {mergedOptions.map((item) => (\n              <Box key={item.id} marginBottom=\"spacingS\">\n                <Checkbox\n                  key={item.id}\n                  id={item.id}\n                  isChecked={values.includes(item.value)}\n                  isDisabled={disabled}\n                  value={item.value}\n                  name={`${field.id}.${field.locale}`}\n                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n                    if (e.target.checked) {\n                      addValue(item.value);\n                    } else {\n                      removeValue(item.value);\n                    }\n                  }}>\n                  {item.label}\n                </Checkbox>\n                {item.invalid && (\n                  <>\n                    <span data-test-id=\"invalid-text\" className={styles.invalidText}>\n                      (invalid)\n                    </span>\n                    <TextLink\n                      as=\"button\"\n                      className={styles.removeBtn}\n                      onClick={() => removeValue(item.value)}>\n                      Remove\n                    </TextLink>\n                  </>\n                )}\n              </Box>\n            ))}\n          </Form>\n        );\n      }}\n    </FieldConnector>\n  );\n}\n\nCheckboxEditor.defaultProps = {\n  isInitiallyDisabled: true,\n};\n"],"names":["form","css","marginTop","tokens","spacingS","rightToLeft","direction","invalidText","color","red500","marginLeft","spacing2Xs","removeBtn","spacingL","isEmptyListValue","value","length","CheckboxEditor","props","id","useState","nanoid","field","locales","options","predefinedValues","get","filter","validation","in","map","index","locale","join","label","getOptions","React","PredefinedValuesError","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","disabled","setValue","values","removeValue","newValues","item","invalidValues","getValueFromOptions","includes","invalid","getInvalidValues","mergedOptions","Form","testId","className","cx","styles","Box","key","marginBottom","Checkbox","isChecked","isDisabled","name","onChange","e","target","checked","addValue","TextLink","as","onClick","defaultProps"],"mappings":"iWAGO,MAAMA,EAAOC,MAAI,CACtBC,UAAWC,EAAOC,WAGPC,EAAcJ,MAAI,CAC7BK,UAAW,QAGAC,EAAcN,MAAI,CAC7BO,MAAOL,EAAOM,OACdC,WAAYP,EAAOQ,aAGRC,EAAYX,MAAI,CAC3BS,WAAYP,EAAOU,WCoBrB,SAASC,EAAiBC,UACP,OAAVA,GAAmC,IAAjBA,EAAMC,gBA4CjBC,EAAeC,SACtBC,GAAMC,WAAS,IAAMC,SAAO,KAC7BC,MAAEA,EAAFC,QAASA,GAAYL,EAErBM,EA7CR,SAAoBF,EAAiBH,SAO7BM,EALcC,EAAIJ,EAAO,CAAC,QAAS,eAAgB,IAMtDK,OAAQC,GAAeA,EAAWC,IAClCC,IAAKF,GAAeA,EAAWC,WAGhCJ,EAAiBT,OAAS,EAAIS,EAAiB,GAAK,IAGzBK,IAAI,CAACf,EAAegB,MAE/CZ,GAAI,CAAC,SAAUG,EAAMH,GAAIG,EAAMU,OAAQD,EAAOZ,GAAIc,KAAK,KACvDlB,MAAAA,EACAmB,MAAOnB,KA0BOoB,CAAWb,EAAOH,MACO,IAAnBK,EAAQR,cAGrBoB,gBAACC,oCAGJ/B,EAAYiB,EAAQjB,UAAUgB,EAAMU,SAAW,aAGnDI,gBAACE,kBACCC,SAAU,EACVC,aAAc1B,EACdQ,MAAOA,EACPmB,oBAAqBvB,EAAMuB,qBAC1B,EAAGC,SAAAA,EAAU3B,MAAAA,EAAO4B,SAAAA,YACbC,EAAS7B,GAAS,GAOlB8B,EAAe9B,UACb+B,EAAYF,EAAOjB,OAAQoB,GAASA,IAAShC,GACnD4B,EAASG,IAGLE,EAlDW,EACvB1B,EACAsB,EACApB,WAEMyB,EAAuBzB,EAA6BM,IAAKiB,GAASA,EAAKhC,cACvD6B,EACnBjB,OAAQZ,IAAWkC,EAAoBC,SAASnC,IAChDe,IAAI,CAACf,EAAOgB,MACXZ,GAAI,CAAC,SAAUG,EAAMH,GAAIG,EAAMU,OAAQD,EAAO,WAAWE,KAAK,KAC9DC,MAAOnB,EACPoC,SAAS,EACTpC,MAAAA,MAsCwBqC,CAAiB9B,EAAOsB,EAAQpB,GAChD6B,EAAgB,IAAI7B,KAAYwB,UAGpCZ,gBAACkB,QACCC,OAAO,kBACPC,UAAWC,KAAGC,EAA2B,QAAdpD,EAAsBoD,EAAqB,KACrEL,EAAcvB,IAAKiB,GAClBX,gBAACuB,OAAIC,IAAKb,EAAK5B,GAAI0C,aAAa,YAC9BzB,gBAAC0B,YACCF,IAAKb,EAAK5B,GACVA,GAAI4B,EAAK5B,GACT4C,UAAWnB,EAAOM,SAASH,EAAKhC,OAChCiD,WAAYtB,EACZ3B,MAAOgC,EAAKhC,MACZkD,QAAS3C,EAAMH,MAAMG,EAAMU,SAC3BkC,SAAWC,IACLA,EAAEC,OAAOC,QA3BPtD,CAAAA,UACV+B,EAAY,IAAIF,EAAOjB,OAAQoB,GAASA,IAAShC,GAAQA,GAC/D4B,EAASG,IA0BGwB,CAASvB,EAAKhC,OAEd8B,EAAYE,EAAKhC,SAGpBgC,EAAKb,OAEPa,EAAKI,SACJf,gCACEA,uCAAmB,eAAeoB,UAAWE,gBAG7CtB,gBAACmC,YACCC,GAAG,SACHhB,UAAWE,EACXe,QAAS,IAAM5B,EAAYE,EAAKhC,wBActDE,EAAeyD,aAAe,CAC5BjC,qBAAqB"}

package/dist/field-editor-checkbox.esm.js

@@ -1,22 +1,22 @@
 import { useState, createElement, Fragment } from 'react';
+import { Form, Box, Checkbox, TextLink } from '@contentful/f36-components';
+import { PredefinedValuesError, FieldConnector } from '@contentful/field-editor-shared';
 import { css, cx } from 'emotion';
 import get from 'lodash-es/get';
-import { PredefinedValuesError, FieldConnector } from '@contentful/field-editor-shared';
-import { Form, Box, Checkbox, TextLink } from '@contentful/f36-components';
-import tokens from '@contentful/f36-tokens';
 import { nanoid } from 'nanoid';
+import tokens from '@contentful/f36-tokens';
 
-var form = /*#__PURE__*/css({
+const form = /*#__PURE__*/css({
   marginTop: tokens.spacingS
 });
-var rightToLeft = /*#__PURE__*/css({
+const rightToLeft = /*#__PURE__*/css({
   direction: 'rtl'
 });
-var invalidText = /*#__PURE__*/css({
+const invalidText = /*#__PURE__*/css({
   color: tokens.red500,
   marginLeft: tokens.spacing2Xs
 });
-var removeBtn = /*#__PURE__*/css({
+const removeBtn = /*#__PURE__*/css({
   marginLeft: tokens.spacingL
 });
 
@@ -26,115 +26,94 @@ function isEmptyListValue(value) {
 
 function getOptions(field, id) {
   // Get first object that has a 'in' property
-  var validations = get(field, ['items', 'validations'], []);
-  var predefinedValues = validations.filter(function (validation) {
-    return validation["in"];
-  }).map(function (validation) {
-    return validation["in"];
-  });
-  var firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];
-  return firstPredefinedValues.map(function (value, index) {
-    return {
-      // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)
-      id: ['entity', field.id, field.locale, index, id].join('.'),
-      value: value,
-      label: value
-    };
-  });
+  const validations = get(field, ['items', 'validations'], []);
+  const predefinedValues = validations.filter(validation => validation.in).map(validation => validation.in);
+  const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];
+  return firstPredefinedValues.map((value, index) => ({
+    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)
+    id: ['entity', field.id, field.locale, index, id].join('.'),
+    value,
+    label: value
+  }));
 }
 
-var getInvalidValues = function getInvalidValues(field, values, options) {
-  var getValueFromOptions = options.map(function (item) {
-    return item.value;
-  });
-  var invalidValues = values.filter(function (value) {
-    return !getValueFromOptions.includes(value);
-  }).map(function (value, index) {
-    return {
-      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),
-      label: value,
-      invalid: true,
-      value: value
-    };
-  });
+const getInvalidValues = (field, values, options) => {
+  const getValueFromOptions = options.map(item => item.value);
+  const invalidValues = values.filter(value => !getValueFromOptions.includes(value)).map((value, index) => ({
+    id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),
+    label: value,
+    invalid: true,
+    value
+  }));
   return invalidValues;
 };
 
 function CheckboxEditor(props) {
-  var _useState = useState(function () {
-    return nanoid(6);
-  }),
-      id = _useState[0];
-
-  var field = props.field,
-      locales = props.locales;
-  var options = getOptions(field, id);
-  var misconfigured = options.length === 0;
+  const [id] = useState(() => nanoid(6));
+  const {
+    field,
+    locales
+  } = props;
+  const options = getOptions(field, id);
+  const misconfigured = options.length === 0;
 
   if (misconfigured) {
     return createElement(PredefinedValuesError, null);
   }
 
-  var direction = locales.direction[field.locale] || 'ltr';
+  const direction = locales.direction[field.locale] || 'ltr';
   return createElement(FieldConnector, {
     throttle: 0,
     isEmptyValue: isEmptyListValue,
     field: field,
     isInitiallyDisabled: props.isInitiallyDisabled
-  }, function (_ref) {
-    var disabled = _ref.disabled,
-        value = _ref.value,
-        setValue = _ref.setValue;
-    var values = value || [];
+  }, ({
+    disabled,
+    value,
+    setValue
+  }) => {
+    const values = value || [];
 
-    var addValue = function addValue(value) {
-      var newValues = [].concat(values.filter(function (item) {
-        return item !== value;
-      }), [value]);
+    const addValue = value => {
+      const newValues = [...values.filter(item => item !== value), value];
       setValue(newValues);
     };
 
-    var removeValue = function removeValue(value) {
-      var newValues = values.filter(function (item) {
-        return item !== value;
-      });
+    const removeValue = value => {
+      const newValues = values.filter(item => item !== value);
       setValue(newValues);
     };
 
-    var invalidValues = getInvalidValues(field, values, options);
-    var mergedOptions = [].concat(options, invalidValues);
+    const invalidValues = getInvalidValues(field, values, options);
+    const mergedOptions = [...options, ...invalidValues];
     return createElement(Form, {
       testId: "checkbox-editor",
       className: cx(form, direction === 'rtl' ? rightToLeft : '')
-    }, mergedOptions.map(function (item) {
-      return createElement(Box, {
-        key: item.id,
-        marginBottom: "spacingS"
-      }, createElement(Checkbox, {
-        key: item.id,
-        id: item.id,
-        isChecked: values.includes(item.value),
-        isDisabled: disabled,
-        value: item.value,
-        name: field.id + "." + field.locale,
-        onChange: function onChange(e) {
-          if (e.target.checked) {
-            addValue(item.value);
-          } else {
-            removeValue(item.value);
-          }
-        }
-      }, item.label), item.invalid && createElement(Fragment, null, createElement("span", {
-        "data-test-id": "invalid-text",
-        className: invalidText
-      }, "(invalid)"), createElement(TextLink, {
-        as: "button",
-        className: removeBtn,
-        onClick: function onClick() {
-          return removeValue(item.value);
+    }, mergedOptions.map(item => createElement(Box, {
+      key: item.id,
+      marginBottom: "spacingS"
+    }, createElement(Checkbox, {
+      key: item.id,
+      id: item.id,
+      isChecked: values.includes(item.value),
+      isDisabled: disabled,
+      value: item.value,
+      name: `${field.id}.${field.locale}`,
+      onChange: e => {
+        if (e.target.checked) {
+          addValue(item.value);
+        } else {
+          removeValue(item.value);
         }
-      }, "Remove")));
-    }));
+      }
+    }, item.label), item.invalid && createElement(Fragment, null, createElement("span", {
+      "data-test-id": "invalid-text",
+      className: invalidText
+    }, "(invalid)"), createElement(TextLink, {
+      as: "button",
+      className: removeBtn,
+      onClick: () => removeValue(item.value)
+    }, "Remove")))));
   });
 }
 CheckboxEditor.defaultProps = {

package/dist/field-editor-checkbox.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-editor-checkbox.esm.js","sources":["../src/styles.ts","../src/CheckboxEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const form = css({\n  marginTop: tokens.spacingS,\n});\n\nexport const rightToLeft = css({\n  direction: 'rtl',\n});\n\nexport const invalidText = css({\n  color: tokens.red500,\n  marginLeft: tokens.spacing2Xs,\n});\n\nexport const removeBtn = css({\n  marginLeft: tokens.spacingL,\n});\n","import * as React from 'react';\nimport { useState } from 'react';\nimport { cx } from 'emotion';\nimport get from 'lodash/get';\nimport {\n  FieldAPI,\n  FieldConnector,\n  LocalesAPI,\n  PredefinedValuesError,\n} from '@contentful/field-editor-shared';\nimport { Checkbox, Box } from '@contentful/f36-components';\nimport * as styles from './styles';\nimport { nanoid } from 'nanoid';\n\nimport { TextLink, Form } from '@contentful/f36-components';\n\nexport interface CheckboxEditorProps {\n  /**\n   * is the field disabled initially\n   */\n  isInitiallyDisabled: boolean;\n  /**\n   * sdk.field\n   */\n  field: FieldAPI;\n  /**\n   * sdk.locales\n   */\n  locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\ntype CheckboxOption = { id: string; value: string; label: string; invalid?: boolean };\n\nfunction isEmptyListValue(value: ListValue | null) {\n  return value === null || value.length === 0;\n}\n\nfunction getOptions(field: FieldAPI, id: string): CheckboxOption[] {\n  // Get first object that has a 'in' property\n  const validations = get(field, ['items', 'validations'], []) as Record<\n    string,\n    { in?: string[] }\n  >[];\n\n  const predefinedValues = validations\n    .filter((validation) => validation.in)\n    .map((validation) => validation.in);\n\n  const firstPredefinedValues = (\n    predefinedValues.length > 0 ? predefinedValues[0] : []\n  ) as string[];\n\n  return firstPredefinedValues.map((value: string, index) => ({\n    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)\n    id: ['entity', field.id, field.locale, index, id].join('.'),\n    value,\n    label: value,\n  }));\n}\n\nconst getInvalidValues = (\n  field: FieldAPI,\n  values: string[],\n  options: CheckboxOption[]\n): CheckboxOption[] => {\n  const getValueFromOptions = (options as CheckboxOption[]).map((item) => item.value);\n  const invalidValues = values\n    .filter((value) => !getValueFromOptions.includes(value))\n    .map((value, index) => ({\n      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),\n      label: value,\n      invalid: true,\n      value,\n    }));\n\n  return invalidValues;\n};\n\nexport function CheckboxEditor(props: CheckboxEditorProps) {\n  const [id] = useState(() => nanoid(6));\n  const { field, locales } = props;\n\n  const options = getOptions(field, id);\n  const misconfigured = options.length === 0;\n\n  if (misconfigured) {\n    return <PredefinedValuesError />;\n  }\n\n  const direction = locales.direction[field.locale] || 'ltr';\n\n  return (\n    <FieldConnector<ListValue>\n      throttle={0}\n      isEmptyValue={isEmptyListValue}\n      field={field}\n      isInitiallyDisabled={props.isInitiallyDisabled}>\n      {({ disabled, value, setValue }) => {\n        const values = value || [];\n\n        const addValue = (value: string) => {\n          const newValues = [...values.filter((item) => item !== value), value];\n          setValue(newValues);\n        };\n\n        const removeValue = (value: string) => {\n          const newValues = values.filter((item) => item !== value);\n          setValue(newValues);\n        };\n\n        const invalidValues = getInvalidValues(field, values, options);\n        const mergedOptions = [...options, ...invalidValues];\n\n        return (\n          <Form\n            testId=\"checkbox-editor\"\n            className={cx(styles.form, direction === 'rtl' ? styles.rightToLeft : '')}>\n            {mergedOptions.map((item) => (\n              <Box key={item.id} marginBottom=\"spacingS\">\n                <Checkbox\n                  key={item.id}\n                  id={item.id}\n                  isChecked={values.includes(item.value)}\n                  isDisabled={disabled}\n                  value={item.value}\n                  name={`${field.id}.${field.locale}`}\n                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n                    if (e.target.checked) {\n                      addValue(item.value);\n                    } else {\n                      removeValue(item.value);\n                    }\n                  }}>\n                  {item.label}\n                </Checkbox>\n                {item.invalid && (\n                  <>\n                    <span data-test-id=\"invalid-text\" className={styles.invalidText}>\n                      (invalid)\n                    </span>\n                    <TextLink\n                      as=\"button\"\n                      className={styles.removeBtn}\n                      onClick={() => removeValue(item.value)}>\n                      Remove\n                    </TextLink>\n                  </>\n                )}\n              </Box>\n            ))}\n          </Form>\n        );\n      }}\n    </FieldConnector>\n  );\n}\n\nCheckboxEditor.defaultProps = {\n  isInitiallyDisabled: true,\n};\n"],"names":["form","css","marginTop","tokens","spacingS","rightToLeft","direction","invalidText","color","red500","marginLeft","spacing2Xs","removeBtn","spacingL","isEmptyListValue","value","length","getOptions","field","id","validations","get","predefinedValues","filter","validation","map","firstPredefinedValues","index","locale","join","label","getInvalidValues","values","options","getValueFromOptions","item","invalidValues","includes","invalid","CheckboxEditor","props","useState","nanoid","locales","misconfigured","React","PredefinedValuesError","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","disabled","setValue","addValue","newValues","removeValue","mergedOptions","Form","testId","className","cx","styles","Box","key","marginBottom","Checkbox","isChecked","isDisabled","name","onChange","e","target","checked","TextLink","as","onClick","defaultProps"],"mappings":"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"}
+{"version":3,"file":"field-editor-checkbox.esm.js","sources":["../src/styles.ts","../src/CheckboxEditor.tsx"],"sourcesContent":["import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport const form = css({\n  marginTop: tokens.spacingS,\n});\n\nexport const rightToLeft = css({\n  direction: 'rtl',\n});\n\nexport const invalidText = css({\n  color: tokens.red500,\n  marginLeft: tokens.spacing2Xs,\n});\n\nexport const removeBtn = css({\n  marginLeft: tokens.spacingL,\n});\n","import * as React from 'react';\nimport { useState } from 'react';\n\nimport { Checkbox, Box } from '@contentful/f36-components';\nimport { TextLink, Form } from '@contentful/f36-components';\nimport {\n  FieldAPI,\n  FieldConnector,\n  LocalesAPI,\n  PredefinedValuesError,\n} from '@contentful/field-editor-shared';\nimport { cx } from 'emotion';\nimport get from 'lodash/get';\nimport { nanoid } from 'nanoid';\n\nimport * as styles from './styles';\n\n\nexport interface CheckboxEditorProps {\n  /**\n   * is the field disabled initially\n   */\n  isInitiallyDisabled: boolean;\n  /**\n   * sdk.field\n   */\n  field: FieldAPI;\n  /**\n   * sdk.locales\n   */\n  locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\ntype CheckboxOption = { id: string; value: string; label: string; invalid?: boolean };\n\nfunction isEmptyListValue(value: ListValue | null) {\n  return value === null || value.length === 0;\n}\n\nfunction getOptions(field: FieldAPI, id: string): CheckboxOption[] {\n  // Get first object that has a 'in' property\n  const validations = get(field, ['items', 'validations'], []) as Record<\n    string,\n    { in?: string[] }\n  >[];\n\n  const predefinedValues = validations\n    .filter((validation) => validation.in)\n    .map((validation) => validation.in);\n\n  const firstPredefinedValues = (\n    predefinedValues.length > 0 ? predefinedValues[0] : []\n  ) as string[];\n\n  return firstPredefinedValues.map((value: string, index) => ({\n    // Append a random id to distinguish between checkboxes opened in two editors (e.g. slide-in)\n    id: ['entity', field.id, field.locale, index, id].join('.'),\n    value,\n    label: value,\n  }));\n}\n\nconst getInvalidValues = (\n  field: FieldAPI,\n  values: string[],\n  options: CheckboxOption[]\n): CheckboxOption[] => {\n  const getValueFromOptions = (options as CheckboxOption[]).map((item) => item.value);\n  const invalidValues = values\n    .filter((value) => !getValueFromOptions.includes(value))\n    .map((value, index) => ({\n      id: ['entity', field.id, field.locale, index, 'invalid'].join('.'),\n      label: value,\n      invalid: true,\n      value,\n    }));\n\n  return invalidValues;\n};\n\nexport function CheckboxEditor(props: CheckboxEditorProps) {\n  const [id] = useState(() => nanoid(6));\n  const { field, locales } = props;\n\n  const options = getOptions(field, id);\n  const misconfigured = options.length === 0;\n\n  if (misconfigured) {\n    return <PredefinedValuesError />;\n  }\n\n  const direction = locales.direction[field.locale] || 'ltr';\n\n  return (\n    <FieldConnector<ListValue>\n      throttle={0}\n      isEmptyValue={isEmptyListValue}\n      field={field}\n      isInitiallyDisabled={props.isInitiallyDisabled}>\n      {({ disabled, value, setValue }) => {\n        const values = value || [];\n\n        const addValue = (value: string) => {\n          const newValues = [...values.filter((item) => item !== value), value];\n          setValue(newValues);\n        };\n\n        const removeValue = (value: string) => {\n          const newValues = values.filter((item) => item !== value);\n          setValue(newValues);\n        };\n\n        const invalidValues = getInvalidValues(field, values, options);\n        const mergedOptions = [...options, ...invalidValues];\n\n        return (\n          <Form\n            testId=\"checkbox-editor\"\n            className={cx(styles.form, direction === 'rtl' ? styles.rightToLeft : '')}>\n            {mergedOptions.map((item) => (\n              <Box key={item.id} marginBottom=\"spacingS\">\n                <Checkbox\n                  key={item.id}\n                  id={item.id}\n                  isChecked={values.includes(item.value)}\n                  isDisabled={disabled}\n                  value={item.value}\n                  name={`${field.id}.${field.locale}`}\n                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n                    if (e.target.checked) {\n                      addValue(item.value);\n                    } else {\n                      removeValue(item.value);\n                    }\n                  }}>\n                  {item.label}\n                </Checkbox>\n                {item.invalid && (\n                  <>\n                    <span data-test-id=\"invalid-text\" className={styles.invalidText}>\n                      (invalid)\n                    </span>\n                    <TextLink\n                      as=\"button\"\n                      className={styles.removeBtn}\n                      onClick={() => removeValue(item.value)}>\n                      Remove\n                    </TextLink>\n                  </>\n                )}\n              </Box>\n            ))}\n          </Form>\n        );\n      }}\n    </FieldConnector>\n  );\n}\n\nCheckboxEditor.defaultProps = {\n  isInitiallyDisabled: true,\n};\n"],"names":["form","css","marginTop","tokens","spacingS","rightToLeft","direction","invalidText","color","red500","marginLeft","spacing2Xs","removeBtn","spacingL","isEmptyListValue","value","length","getOptions","field","id","validations","get","predefinedValues","filter","validation","in","map","firstPredefinedValues","index","locale","join","label","getInvalidValues","values","options","getValueFromOptions","item","invalidValues","includes","invalid","CheckboxEditor","props","useState","nanoid","locales","misconfigured","React","PredefinedValuesError","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","disabled","setValue","addValue","newValues","removeValue","mergedOptions","Form","testId","className","cx","styles","Box","key","marginBottom","Checkbox","isChecked","isDisabled","name","onChange","e","target","checked","TextLink","as","onClick","defaultProps"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/field-editor-checkbox",
-  "version": "1.1.12",
+  "version": "1.2.0",
   "main": "dist/index.js",
   "module": "dist/field-editor-checkbox.esm.js",
   "typings": "dist/index.d.ts",
@@ -23,16 +23,16 @@
   "dependencies": {
     "@contentful/f36-components": "^4.3.23",
     "@contentful/f36-tokens": "^4.0.0",
-    "@contentful/field-editor-shared": "^1.1.8",
+    "@contentful/field-editor-shared": "^1.2.0",
     "emotion": "^10.0.17",
     "lodash": "^4.17.15",
     "lodash-es": "^4.17.15"
   },
   "devDependencies": {
-    "@contentful/field-editor-test-utils": "^1.2.7"
+    "@contentful/field-editor-test-utils": "^1.3.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0"
   },
-  "gitHead": "4fff7b9534374dcc44cb477240d369fc34f46415"
+  "gitHead": "de7e74e3485dd69c240cfe9c545e6e50e41fb295"
 }