npm - @contentful/field-editor-tags - Versions diffs - 0.14.6 → 1.0.2 - Mend

@contentful/field-editor-tags 0.14.6 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/CHANGELOG.md +21 -94
package/README.md +0 -1
package/dist/field-editor-tags.cjs.development.js +22 -23
package/dist/field-editor-tags.cjs.development.js.map +1 -1
package/dist/field-editor-tags.cjs.production.min.js +1 -1
package/dist/field-editor-tags.cjs.production.min.js.map +1 -1
package/dist/field-editor-tags.esm.js +20 -21
package/dist/field-editor-tags.esm.js.map +1 -1
package/package.json +7 -6

package/CHANGELOG.md CHANGED Viewed

@@ -3,205 +3,132 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-## [0.14.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.5...@contentful/field-editor-tags@0.14.6) (2021-10-14)
+## [1.0.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@1.0.1...@contentful/field-editor-tags@1.0.2) (2021-12-20)
 **Note:** Version bump only for package @contentful/field-editor-tags
+## [1.0.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@1.0.0...@contentful/field-editor-tags@1.0.1) (2021-11-17)
+### Bug Fixes
+- **card-actions:** update forma 36 to fix card actions click issue ([#927](https://github.com/contentful/field-editors/issues/927)) ([3dfdef2](https://github.com/contentful/field-editors/commit/3dfdef2c2b0045f12ea94ddafca89a8e9f25e7d0))
-## [0.14.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.4...@contentful/field-editor-tags@0.14.5) (2021-10-06)
+# [1.0.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.15.0...@contentful/field-editor-tags@1.0.0) (2021-11-04)
 **Note:** Version bump only for package @contentful/field-editor-tags
+# [0.15.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.6...@contentful/field-editor-tags@0.15.0) (2021-11-04)
+### Features
+- Forma v4 components adoption ([#805](https://github.com/contentful/field-editors/issues/805)) ([526bde6](https://github.com/contentful/field-editors/commit/526bde6e10e0ee3789705ec10fb31489af7ca59e))
+### BREAKING CHANGES
-## [0.14.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.3...@contentful/field-editor-tags@0.14.4) (2021-09-17)
+- adopts a new Forma v4 beta
+## [0.14.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.5...@contentful/field-editor-tags@0.14.6) (2021-10-14)
 **Note:** Version bump only for package @contentful/field-editor-tags
+## [0.14.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.4...@contentful/field-editor-tags@0.14.5) (2021-10-06)
+**Note:** Version bump only for package @contentful/field-editor-tags
+## [0.14.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.3...@contentful/field-editor-tags@0.14.4) (2021-09-17)
+**Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.14.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.2...@contentful/field-editor-tags@0.14.3) (2021-09-16)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.14.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.1...@contentful/field-editor-tags@0.14.2) (2021-08-19)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.14.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.14.0...@contentful/field-editor-tags@0.14.1) (2021-07-29)
 **Note:** Version bump only for package @contentful/field-editor-tags
 # [0.14.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.13.5...@contentful/field-editor-tags@0.14.0) (2021-07-23)
 ### Features
-* 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
+- 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
 ## [0.13.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.13.2...@contentful/field-editor-tags@0.13.5) (2021-07-06)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.13.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.13.2...@contentful/field-editor-tags@0.13.4) (2021-07-06)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.13.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.13.2...@contentful/field-editor-tags@0.13.3) (2021-06-23)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.13.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.13.1...@contentful/field-editor-tags@0.13.2) (2021-06-23)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.13.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.13.0...@contentful/field-editor-tags@0.13.1) (2021-06-22)
 **Note:** Version bump only for package @contentful/field-editor-tags
 # [0.13.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.12.1...@contentful/field-editor-tags@0.13.0) (2021-04-06)
 ### Features
-* bump react-sortable-hoc from 1.11.0 to 2.0.0 ([#664](https://github.com/contentful/field-editors/issues/664)) ([24f1db2](https://github.com/contentful/field-editors/commit/24f1db20ba2842c1990773983b4fb7146efca5ca))
+- bump react-sortable-hoc from 1.11.0 to 2.0.0 ([#664](https://github.com/contentful/field-editors/issues/664)) ([24f1db2](https://github.com/contentful/field-editors/commit/24f1db20ba2842c1990773983b4fb7146efca5ca))
 ## [0.12.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.12.0...@contentful/field-editor-tags@0.12.1) (2021-03-05)
 **Note:** Version bump only for package @contentful/field-editor-tags
 # [0.12.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.11.2...@contentful/field-editor-tags@0.12.0) (2021-02-19)
 ### Features
-* bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
+- bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
 ## [0.11.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.11.1...@contentful/field-editor-tags@0.11.2) (2021-02-09)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.11.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.11.0...@contentful/field-editor-tags@0.11.1) (2021-02-01)
 **Note:** Version bump only for package @contentful/field-editor-tags
 # [0.11.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.10.0...@contentful/field-editor-tags@0.11.0) (2021-01-20)
 ### Features
-* update minimal forma-36 versions to use updated design ([#565](https://github.com/contentful/field-editors/issues/565)) ([332c734](https://github.com/contentful/field-editors/commit/332c734bfaf54f0e9773fcbb460d743b1f5459ec))
+- update minimal forma-36 versions to use updated design ([#565](https://github.com/contentful/field-editors/issues/565)) ([332c734](https://github.com/contentful/field-editors/commit/332c734bfaf54f0e9773fcbb460d743b1f5459ec))
 # [0.10.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.9.5...@contentful/field-editor-tags@0.10.0) (2021-01-12)
 ### Features
-* update minimal required Forma version to the 3.73.12 ([#552](https://github.com/contentful/field-editors/issues/552)) ([2816fd9](https://github.com/contentful/field-editors/commit/2816fd960c28815faebf49a9ef8f4c4c0d91fc36))
+- update minimal required Forma version to the 3.73.12 ([#552](https://github.com/contentful/field-editors/issues/552)) ([2816fd9](https://github.com/contentful/field-editors/commit/2816fd960c28815faebf49a9ef8f4c4c0d91fc36))
 ## [0.9.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.9.4...@contentful/field-editor-tags@0.9.5) (2020-12-16)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.9.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.9.3...@contentful/field-editor-tags@0.9.4) (2020-11-06)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.9.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.9.2...@contentful/field-editor-tags@0.9.3) (2020-11-06)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.9.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.9.1...@contentful/field-editor-tags@0.9.2) (2020-10-28)
 **Note:** Version bump only for package @contentful/field-editor-tags
 ## [0.9.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-tags@0.9.0...@contentful/field-editor-tags@0.9.1) (2020-08-24)
 **Note:** Version bump only for package @contentful/field-editor-tags

package/README.md CHANGED Viewed

@@ -7,6 +7,5 @@ npm install @contentful/field-editor-tags
 This package contains a React `TagsEditor` component that is used as a default for the `Symbol / List` field type in the Contentful web application.
 ```js
-import '@contentful/forma-36-react-components/dist/styles.css';
 import { TagsEditor } from '@contentful/field-editor-tags';
 ```

package/dist/field-editor-tags.cjs.development.js CHANGED Viewed

@@ -10,28 +10,28 @@ var isNumber = _interopDefault(require('lodash/isNumber'));
 var fieldEditorShared = require('@contentful/field-editor-shared');
 var noop = _interopDefault(require('lodash/noop'));
 var emotion = require('emotion');
-var tokens = _interopDefault(require('@contentful/forma-36-tokens'));
-var forma36ReactComponents = require('@contentful/forma-36-react-components');
+var tokens = _interopDefault(require('@contentful/f36-tokens'));
+var f36Components = require('@contentful/f36-components');
 var reactSortableHoc = require('react-sortable-hoc');
 var arrayMove = _interopDefault(require('array-move'));
+var f36Icons = require('@contentful/f36-icons');
-var styles = {
-  constraints: /*#__PURE__*/emotion.css({
-    fontStyle: 'italic',
-    marginTop: tokens.spacingS,
-    color: tokens.gray600
-  })
-};
 function TagsEditorConstraints(props) {
   var constraintsType = props.constraintsType,
       constraints = props.constraints;
-  return React__default.createElement(forma36ReactComponents.Paragraph, {
-    className: styles.constraints,
+  return React__default.createElement(f36Components.Text, {
+    as: "p",
+    fontColor: "gray600",
+    marginBottom: "none",
+    marginTop: "spacingS",
+    className: emotion.css({
+      fontStyle: 'italic'
+    }),
     testId: "tag-editor-constraints"
   }, constraintsType === 'min' && React__default.createElement("span", null, "Requires at least ", constraints.min, " ", constraints.min === 1 ? 'tag' : 'tags'), constraintsType === 'max' && React__default.createElement("span", null, "Requires no more than ", constraints.max, " ", constraints.max === 1 ? 'tag' : 'tags'), constraintsType === 'min-max' && constraints.max !== constraints.min && React__default.createElement("span", null, "Requires between ", constraints.min, " and ", constraints.max, " tags"), constraintsType === 'min-max' && constraints.max === constraints.min && React__default.createElement("span", null, "Requires exactly ", constraints.max, " ", constraints.max === 1 ? 'tag' : 'tags'));
 }
-var styles$1 = {
+var styles = {
   dropContainer: /*#__PURE__*/emotion.css({
     whiteSpace: 'nowrap',
     display: 'flex',
@@ -59,16 +59,15 @@ var styles$1 = {
 };
 var SortablePillHandle = /*#__PURE__*/reactSortableHoc.SortableHandle(function () {
   return React__default.createElement("div", {
-    className: styles$1.handle
-  }, React__default.createElement(forma36ReactComponents.Icon, {
-    icon: "Drag",
-    color: "muted"
+    className: styles.handle
+  }, React__default.createElement(f36Icons.DragIcon, {
+    variant: "muted"
   }));
 });
 var SortablePill = /*#__PURE__*/reactSortableHoc.SortableElement(function (props) {
-  return React__default.createElement(forma36ReactComponents.Pill, {
+  return React__default.createElement(f36Components.Pill, {
     testId: "tag-editor-pill",
-    className: styles$1.pill,
+    className: styles.pill,
     label: props.label,
     onClose: function onClose() {
       if (!props.disabled) {
@@ -81,7 +80,7 @@ var SortablePill = /*#__PURE__*/reactSortableHoc.SortableElement(function (props
 });
 var SortableList = /*#__PURE__*/reactSortableHoc.SortableContainer(function (props) {
   return React__default.createElement("div", {
-    className: styles$1.dropContainer
+    className: styles.dropContainer
   }, props.children);
 });
 function TagsEditor(props) {
@@ -108,11 +107,11 @@ function TagsEditor(props) {
   }, [props]);
   return React__default.createElement("div", {
     "data-test-id": "tag-editor-container"
-  }, React__default.createElement(forma36ReactComponents.TextInput, {
+  }, React__default.createElement(f36Components.TextInput, {
     testId: "tag-editor-input",
-    className: styles$1.input,
-    disabled: isDisabled,
-    error: hasError,
+    className: styles.input,
+    isDisabled: isDisabled,
+    isInvalid: hasError,
     type: "text",
     value: pendingValue,
     placeholder: "Type the value and hit enter",

package/dist/field-editor-tags.cjs.development.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"field-editor-tags.cjs.development.js","sources":["../src/TagsEditorConstraints.tsx","../src/TagsEditor.tsx","../src/TagsEditorContainer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from 'emotion';\nimport { Paragraph } from '@contentful/forma-36-react-components';\nimport tokens from '@contentful/forma-36-tokens';\nimport { Constraint, ConstraintsType } from './types';\n\nconst styles = {\n constraints: css({\n fontStyle: 'italic',\n marginTop: tokens.spacingS,\n color: tokens.gray600,\n }),\n};\n\ninterface TagEditorConstraintsProps {\n constraintsType: ConstraintsType;\n constraints: Constraint;\n}\n\nexport function TagsEditorConstraints(props: TagEditorConstraintsProps) {\n const { constraintsType, constraints } = props;\n return (\n <Paragraph className={styles.constraints} testId=\"tag-editor-constraints\">\n {constraintsType === 'min' && (\n <span>\n Requires at least {constraints.min} {constraints.min === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'max' && (\n <span>\n Requires no more than {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max !== constraints.min && (\n <span>\n Requires between {constraints.min} and {constraints.max} tags\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max === constraints.min && (\n <span>\n Requires exactly {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n </Paragraph>\n );\n}\n","import noop from 'lodash/noop';\nimport React, { useState, useCallback } from 'react';\nimport { css } from 'emotion';\nimport tokens from '@contentful/forma-36-tokens';\nimport { TextInput, Pill, Icon } from '@contentful/forma-36-react-components';\nimport { TagsEditorConstraints } from './TagsEditorConstraints';\nimport { ConstraintsType, Constraint } from './types';\nimport { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';\nimport arrayMove from 'array-move';\n\nexport interface TagsEditorProps {\n items: string[];\n isDisabled: boolean;\n hasError: boolean;\n constraintsType?: ConstraintsType;\n constraints?: Constraint;\n onUpdate: (items: string[]) => void;\n}\n\nconst styles = {\n dropContainer: css({\n whiteSpace: 'nowrap',\n display: 'flex',\n flexWrap: 'wrap',\n }),\n input: css({\n marginTop: tokens.spacingS,\n marginBottom: tokens.spacingM,\n }),\n pill: css({\n marginRight: tokens.spacingS,\n marginBottom: tokens.spacingS,\n }),\n handle: css({\n lineHeight: '1.5rem',\n padding: '0.375rem 0.625rem',\n paddingRight: 0,\n cursor: 'grab',\n userSelect: 'none',\n svg: {\n fill: tokens.gray500,\n verticalAlign: 'middle',\n },\n }),\n};\n\nconst SortablePillHandle = SortableHandle(() => (\n <div className={styles.handle}>\n <Icon icon=\"Drag\" color=\"muted\" />\n </div>\n));\n\ninterface SortablePillProps {\n label: string;\n onRemove: Function;\n disabled: boolean;\n index: number;\n}\n\nconst SortablePill = SortableElement((props: SortablePillProps) => (\n <Pill\n testId=\"tag-editor-pill\"\n className={styles.pill}\n label={props.label}\n onClose={() => {\n if (!props.disabled) {\n props.onRemove(props.index);\n }\n }}\n onDrag={noop}\n dragHandleComponent={<SortablePillHandle />}\n />\n));\n\ninterface SortableListProps {\n children: React.ReactNode;\n}\n\nconst SortableList = SortableContainer((props: SortableListProps) => (\n <div className={styles.dropContainer}>{props.children}</div>\n));\n\nexport function TagsEditor(props: TagsEditorProps) {\n const [pendingValue, setPendingValue] = useState('');\n\n const { isDisabled, items, constraints, constraintsType, hasError } = props;\n\n const removeItem = useCallback(\n (index) => {\n const newItems = props.items.filter((_, filterIndex) => index !== filterIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n const swapItems = useCallback(\n ({ oldIndex, newIndex }) => {\n const newItems = arrayMove(props.items, oldIndex, newIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n return (\n <div data-test-id=\"tag-editor-container\">\n <TextInput\n testId=\"tag-editor-input\"\n className={styles.input}\n disabled={isDisabled}\n error={hasError}\n type=\"text\"\n value={pendingValue}\n placeholder=\"Type the value and hit enter\"\n onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n if (pendingValue && e.keyCode === 13) {\n props.onUpdate([...props.items, pendingValue]);\n setPendingValue('');\n }\n }}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n setPendingValue(e.target.value);\n }}\n />\n <SortableList\n useDragHandle\n axis=\"xy\"\n distance={10}\n onSortEnd={({ oldIndex, newIndex }) => {\n swapItems({ oldIndex, newIndex });\n }}>\n {items.map((item, index) => {\n return (\n <SortablePill\n label={item}\n index={index}\n key={item + index}\n disabled={isDisabled}\n onRemove={() => {\n removeItem(index);\n }}\n />\n );\n })}\n </SortableList>\n {constraints && constraintsType && (\n <TagsEditorConstraints constraints={constraints} constraintsType={constraintsType} />\n )}\n </div>\n );\n}\n","import * as React from 'react';\nimport isNumber from 'lodash/isNumber';\nimport { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TagsEditor } from './TagsEditor';\nimport { ConstraintsType, Constraint } from './types';\n\nexport interface TagsEditorContainerProps {\n /*\n is the field disabled initially\n /\n isInitiallyDisabled: boolean;\n /\n sdk.field\n */\n field: FieldAPI;\n}\n\ntype TagEditorValue = string[];\n\nfunction isEmptyTagsValue(value: TagEditorValue \| null) {\n return value === null \|\| value.length === 0;\n}\n\nfunction getConstraintsType(sizeConstraints?: Constraint): ConstraintsType \| undefined {\n if (!sizeConstraints) {\n return undefined;\n }\n if (isNumber(sizeConstraints.min) && isNumber(sizeConstraints.max)) {\n return 'min-max';\n } else if (isNumber(sizeConstraints.min)) {\n return 'min';\n } else if (isNumber(sizeConstraints.max)) {\n return 'max';\n } else {\n return undefined;\n }\n}\n\nexport function TagsEditorContainer(props: TagsEditorContainerProps) {\n const field = props.field;\n\n const validations = field.validations \|\| [];\n\n const sizeValidations = (validations as { size?: Constraint }[])\n .filter((validation) => validation.size)\n .map((validation) => validation.size);\n\n const constraints = sizeValidations.length > 0 ? sizeValidations[0] : {};\n\n const constraintsType = getConstraintsType(constraints);\n\n return (\n <FieldConnector<TagEditorValue>\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}\n isEmptyValue={isEmptyTagsValue}\n throttle={0}>\n {({ disabled, value, errors, setValue }) => {\n const items = value \|\| [];\n return (\n <TagsEditor\n constraints={constraints}\n constraintsType={constraintsType}\n isDisabled={disabled}\n hasError={errors.length > 0}\n items={items}\n onUpdate={(items) => {\n setValue(items);\n }}\n />\n );\n }}\n </FieldConnector>\n );\n}\n\nTagsEditorContainer.defaultProps = {\n isInitiallyDisabled: true,\n};\n","import { TagsEditorContainer } from './TagsEditorContainer';\n\nexport const TagsEditor = TagsEditorContainer;\n"],"names":["styles","constraints","css","fontStyle","marginTop","tokens","spacingS","color","gray600","TagsEditorConstraints","props","constraintsType","React","Paragraph","className","testId","min","max","dropContainer","whiteSpace","display","flexWrap","input","marginBottom","spacingM","pill","marginRight","handle","lineHeight","padding","paddingRight","cursor","userSelect","svg","fill","gray500","verticalAlign","SortablePillHandle","SortableHandle","Icon","icon","SortablePill","SortableElement","Pill","label","onClose","disabled","onRemove","index","onDrag","noop","dragHandleComponent","SortableList","SortableContainer","children","TagsEditor","useState","pendingValue","setPendingValue","isDisabled","items","hasError","removeItem","useCallback","newItems","filter","_","filterIndex","onUpdate","swapItems","oldIndex","newIndex","arrayMove","TextInput","error","type","value","placeholder","onKeyDown","e","keyCode","onChange","target","useDragHandle","axis","distance","onSortEnd","map","item","key","isEmptyTagsValue","length","getConstraintsType","sizeConstraints","undefined","isNumber","TagsEditorContainer","field","validations","sizeValidations","validation","size","FieldConnector","isInitiallyDisabled","isEmptyValue","throttle","errors","setValue","defaultProps"],"mappings":"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"}
1	+ {"version":3,"file":"field-editor-tags.cjs.development.js","sources":["../src/TagsEditorConstraints.tsx","../src/TagsEditor.tsx","../src/TagsEditorContainer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from 'emotion';\nimport { Constraint, ConstraintsType } from './types';\n\nimport { Text } from '@contentful/f36-components';\n\ninterface TagEditorConstraintsProps {\n constraintsType: ConstraintsType;\n constraints: Constraint;\n}\n\nexport function TagsEditorConstraints(props: TagEditorConstraintsProps) {\n const { constraintsType, constraints } = props;\n return (\n <Text\n as=\"p\"\n fontColor=\"gray600\"\n marginBottom=\"none\"\n marginTop=\"spacingS\"\n className={css({\n fontStyle: 'italic',\n })}\n testId=\"tag-editor-constraints\">\n {constraintsType === 'min' && (\n <span>\n Requires at least {constraints.min} {constraints.min === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'max' && (\n <span>\n Requires no more than {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max !== constraints.min && (\n <span>\n Requires between {constraints.min} and {constraints.max} tags\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max === constraints.min && (\n <span>\n Requires exactly {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n </Text>\n );\n}\n","import noop from 'lodash/noop';\nimport React, { useState, useCallback } from 'react';\nimport { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { TagsEditorConstraints } from './TagsEditorConstraints';\nimport { ConstraintsType, Constraint } from './types';\nimport { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';\nimport arrayMove from 'array-move';\n\nimport { Pill, TextInput } from '@contentful/f36-components';\n\nimport { DragIcon } from '@contentful/f36-icons';\n\nexport interface TagsEditorProps {\n items: string[];\n isDisabled: boolean;\n hasError: boolean;\n constraintsType?: ConstraintsType;\n constraints?: Constraint;\n onUpdate: (items: string[]) => void;\n}\n\nconst styles = {\n dropContainer: css({\n whiteSpace: 'nowrap',\n display: 'flex',\n flexWrap: 'wrap',\n }),\n input: css({\n marginTop: tokens.spacingS,\n marginBottom: tokens.spacingM,\n }),\n pill: css({\n marginRight: tokens.spacingS,\n marginBottom: tokens.spacingS,\n }),\n handle: css({\n lineHeight: '1.5rem',\n padding: '0.375rem 0.625rem',\n paddingRight: 0,\n cursor: 'grab',\n userSelect: 'none',\n svg: {\n fill: tokens.gray500,\n verticalAlign: 'middle',\n },\n }),\n};\n\nconst SortablePillHandle = SortableHandle(() => (\n <div className={styles.handle}>\n <DragIcon variant=\"muted\" />\n </div>\n));\n\ninterface SortablePillProps {\n label: string;\n onRemove: Function;\n disabled: boolean;\n index: number;\n}\n\nconst SortablePill = SortableElement((props: SortablePillProps) => (\n <Pill\n testId=\"tag-editor-pill\"\n className={styles.pill}\n label={props.label}\n onClose={() => {\n if (!props.disabled) {\n props.onRemove(props.index);\n }\n }}\n onDrag={noop}\n dragHandleComponent={<SortablePillHandle />}\n />\n));\n\ninterface SortableListProps {\n children: React.ReactNode;\n}\n\nconst SortableList = SortableContainer((props: SortableListProps) => (\n <div className={styles.dropContainer}>{props.children}</div>\n));\n\nexport function TagsEditor(props: TagsEditorProps) {\n const [pendingValue, setPendingValue] = useState('');\n\n const { isDisabled, items, constraints, constraintsType, hasError } = props;\n\n const removeItem = useCallback(\n (index) => {\n const newItems = props.items.filter((_, filterIndex) => index !== filterIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n const swapItems = useCallback(\n ({ oldIndex, newIndex }) => {\n const newItems = arrayMove(props.items, oldIndex, newIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n return (\n <div data-test-id=\"tag-editor-container\">\n <TextInput\n testId=\"tag-editor-input\"\n className={styles.input}\n isDisabled={isDisabled}\n isInvalid={hasError}\n type=\"text\"\n value={pendingValue}\n placeholder=\"Type the value and hit enter\"\n onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n if (pendingValue && e.keyCode === 13) {\n props.onUpdate([...props.items, pendingValue]);\n setPendingValue('');\n }\n }}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n setPendingValue(e.target.value);\n }}\n />\n <SortableList\n useDragHandle\n axis=\"xy\"\n distance={10}\n onSortEnd={({ oldIndex, newIndex }) => {\n swapItems({ oldIndex, newIndex });\n }}>\n {items.map((item, index) => {\n return (\n <SortablePill\n label={item}\n index={index}\n key={item + index}\n disabled={isDisabled}\n onRemove={() => {\n removeItem(index);\n }}\n />\n );\n })}\n </SortableList>\n {constraints && constraintsType && (\n <TagsEditorConstraints constraints={constraints} constraintsType={constraintsType} />\n )}\n </div>\n );\n}\n","import * as React from 'react';\nimport isNumber from 'lodash/isNumber';\nimport { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TagsEditor } from './TagsEditor';\nimport { ConstraintsType, Constraint } from './types';\n\nexport interface TagsEditorContainerProps {\n /*\n is the field disabled initially\n /\n isInitiallyDisabled: boolean;\n /\n sdk.field\n */\n field: FieldAPI;\n}\n\ntype TagEditorValue = string[];\n\nfunction isEmptyTagsValue(value: TagEditorValue \| null) {\n return value === null \|\| value.length === 0;\n}\n\nfunction getConstraintsType(sizeConstraints?: Constraint): ConstraintsType \| undefined {\n if (!sizeConstraints) {\n return undefined;\n }\n if (isNumber(sizeConstraints.min) && isNumber(sizeConstraints.max)) {\n return 'min-max';\n } else if (isNumber(sizeConstraints.min)) {\n return 'min';\n } else if (isNumber(sizeConstraints.max)) {\n return 'max';\n } else {\n return undefined;\n }\n}\n\nexport function TagsEditorContainer(props: TagsEditorContainerProps) {\n const field = props.field;\n\n const validations = field.validations \|\| [];\n\n const sizeValidations = (validations as { size?: Constraint }[])\n .filter((validation) => validation.size)\n .map((validation) => validation.size);\n\n const constraints = sizeValidations.length > 0 ? sizeValidations[0] : {};\n\n const constraintsType = getConstraintsType(constraints);\n\n return (\n <FieldConnector<TagEditorValue>\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}\n isEmptyValue={isEmptyTagsValue}\n throttle={0}>\n {({ disabled, value, errors, setValue }) => {\n const items = value \|\| [];\n return (\n <TagsEditor\n constraints={constraints}\n constraintsType={constraintsType}\n isDisabled={disabled}\n hasError={errors.length > 0}\n items={items}\n onUpdate={(items) => {\n setValue(items);\n }}\n />\n );\n }}\n </FieldConnector>\n );\n}\n\nTagsEditorContainer.defaultProps = {\n isInitiallyDisabled: true,\n};\n","import { TagsEditorContainer } from './TagsEditorContainer';\n\nexport const TagsEditor = TagsEditorContainer;\n"],"names":["TagsEditorConstraints","props","constraintsType","constraints","React","Text","as","fontColor","marginBottom","marginTop","className","css","fontStyle","testId","min","max","styles","dropContainer","whiteSpace","display","flexWrap","input","tokens","spacingS","spacingM","pill","marginRight","handle","lineHeight","padding","paddingRight","cursor","userSelect","svg","fill","gray500","verticalAlign","SortablePillHandle","SortableHandle","DragIcon","variant","SortablePill","SortableElement","Pill","label","onClose","disabled","onRemove","index","onDrag","noop","dragHandleComponent","SortableList","SortableContainer","children","TagsEditor","useState","pendingValue","setPendingValue","isDisabled","items","hasError","removeItem","useCallback","newItems","filter","_","filterIndex","onUpdate","swapItems","oldIndex","newIndex","arrayMove","TextInput","isInvalid","type","value","placeholder","onKeyDown","e","keyCode","onChange","target","useDragHandle","axis","distance","onSortEnd","map","item","key","isEmptyTagsValue","length","getConstraintsType","sizeConstraints","undefined","isNumber","TagsEditorContainer","field","validations","sizeValidations","validation","size","FieldConnector","isInitiallyDisabled","isEmptyValue","throttle","errors","setValue","defaultProps"],"mappings":"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"}

package/dist/field-editor-tags.cjs.production.min.js CHANGED Viewed

@@ -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=e(n),a=e(require("lodash/isNumber")),r=require("@contentful/field-editor-shared"),i=e(require("lodash/noop")),l=require("emotion"),o=e(require("@contentful/forma-36-tokens")),s=require("@contentful/forma-36-react-components"),c=require("react-sortable-hoc"),u=e(require("array-move")),d={constraints:l.css({fontStyle:"italic",marginTop:o.spacingS,color:o.gray600})};function m(e){var n=e.constraintsType,a=e.constraints;return t.createElement(s.Paragraph,{className:d.constraints,testId:"tag-editor-constraints"},"min"===n&&t.createElement("span",null,"Requires at least ",a.min," ",1===a.min?"tag":"tags"),"max"===n&&t.createElement("span",null,"Requires no more than ",a.max," ",1===a.max?"tag":"tags"),"min-max"===n&&a.max!==a.min&&t.createElement("span",null,"Requires between ",a.min," and ",a.max," tags"),"min-max"===n&&a.max===a.min&&t.createElement("span",null,"Requires exactly ",a.max," ",1===a.max?"tag":"tags"))}var p={dropContainer:l.css({whiteSpace:"nowrap",display:"flex",flexWrap:"wrap"}),input:l.css({marginTop:o.spacingS,marginBottom:o.spacingM}),pill:l.css({marginRight:o.spacingS,marginBottom:o.spacingS}),handle:l.css({lineHeight:"1.5rem",padding:"0.375rem 0.625rem",paddingRight:0,cursor:"grab",userSelect:"none",svg:{fill:o.gray500,verticalAlign:"middle"}})},f=c.SortableHandle((function(){return t.createElement("div",{className:p.handle},t.createElement(s.Icon,{icon:"Drag",color:"muted"}))})),g=c.SortableElement((function(e){return t.createElement(s.Pill,{testId:"tag-editor-pill",className:p.pill,label:e.label,onClose:function(){e.disabled||e.onRemove(e.index)},onDrag:i,dragHandleComponent:t.createElement(f,null)})})),x=c.SortableContainer((function(e){return t.createElement("div",{className:p.dropContainer},e.children)}));function b(e){var a=n.useState(""),r=a[0],i=a[1],l=e.isDisabled,o=e.items,c=e.constraints,d=e.constraintsType,f=e.hasError,b=n.useCallback((function(n){var t=e.items.filter((function(e,t){return n!==t}));e.onUpdate(t)}),[e]),h=n.useCallback((function(n){var t=u(e.items,n.oldIndex,n.newIndex);e.onUpdate(t)}),[e]);return t.createElement("div",{"data-test-id":"tag-editor-container"},t.createElement(s.TextInput,{testId:"tag-editor-input",className:p.input,disabled:l,error:f,type:"text",value:r,placeholder:"Type the value and hit enter",onKeyDown:function(n){r&&13===n.keyCode&&(e.onUpdate([].concat(e.items,[r])),i(""))},onChange:function(e){i(e.target.value)}}),t.createElement(x,{useDragHandle:!0,axis:"xy",distance:10,onSortEnd:function(e){h({oldIndex:e.oldIndex,newIndex:e.newIndex})}},o.map((function(e,n){return t.createElement(g,{label:e,index:n,key:e+n,disabled:l,onRemove:function(){b(n)}})}))),c&&d&&t.createElement(m,{constraints:c,constraintsType:d}))}function h(e){return null===e||0===e.length}function v(e){var t=e.field,i=(t.validations||[]).filter((function(e){return e.size})).map((function(e){return e.size})),l=i.length>0?i[0]:{},o=function(e){if(e)return a(e.min)&&a(e.max)?"min-max":a(e.min)?"min":a(e.max)?"max":void 0}(l);return n.createElement(r.FieldConnector,{field:t,isInitiallyDisabled:e.isInitiallyDisabled,isEmptyValue:h,throttle:0},(function(e){var t=e.setValue;return n.createElement(b,{constraints:l,constraintsType:o,isDisabled:e.disabled,hasError:e.errors.length>0,items:e.value||[],onUpdate:function(e){t(e)}})}))}v.defaultProps={isInitiallyDisabled:!0},exports.TagsEditor=v;
+"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=e(n),a=e(require("lodash/isNumber")),r=require("@contentful/field-editor-shared"),i=e(require("lodash/noop")),l=require("emotion"),o=e(require("@contentful/f36-tokens")),s=require("@contentful/f36-components"),c=require("react-sortable-hoc"),u=e(require("array-move")),d=require("@contentful/f36-icons");function m(e){var n=e.constraintsType,a=e.constraints;return t.createElement(s.Text,{as:"p",fontColor:"gray600",marginBottom:"none",marginTop:"spacingS",className:l.css({fontStyle:"italic"}),testId:"tag-editor-constraints"},"min"===n&&t.createElement("span",null,"Requires at least ",a.min," ",1===a.min?"tag":"tags"),"max"===n&&t.createElement("span",null,"Requires no more than ",a.max," ",1===a.max?"tag":"tags"),"min-max"===n&&a.max!==a.min&&t.createElement("span",null,"Requires between ",a.min," and ",a.max," tags"),"min-max"===n&&a.max===a.min&&t.createElement("span",null,"Requires exactly ",a.max," ",1===a.max?"tag":"tags"))}var p={dropContainer:l.css({whiteSpace:"nowrap",display:"flex",flexWrap:"wrap"}),input:l.css({marginTop:o.spacingS,marginBottom:o.spacingM}),pill:l.css({marginRight:o.spacingS,marginBottom:o.spacingS}),handle:l.css({lineHeight:"1.5rem",padding:"0.375rem 0.625rem",paddingRight:0,cursor:"grab",userSelect:"none",svg:{fill:o.gray500,verticalAlign:"middle"}})},f=c.SortableHandle((function(){return t.createElement("div",{className:p.handle},t.createElement(d.DragIcon,{variant:"muted"}))})),g=c.SortableElement((function(e){return t.createElement(s.Pill,{testId:"tag-editor-pill",className:p.pill,label:e.label,onClose:function(){e.disabled||e.onRemove(e.index)},onDrag:i,dragHandleComponent:t.createElement(f,null)})})),x=c.SortableContainer((function(e){return t.createElement("div",{className:p.dropContainer},e.children)}));function v(e){var a=n.useState(""),r=a[0],i=a[1],l=e.isDisabled,o=e.items,c=e.constraints,d=e.constraintsType,f=e.hasError,v=n.useCallback((function(n){var t=e.items.filter((function(e,t){return n!==t}));e.onUpdate(t)}),[e]),b=n.useCallback((function(n){var t=u(e.items,n.oldIndex,n.newIndex);e.onUpdate(t)}),[e]);return t.createElement("div",{"data-test-id":"tag-editor-container"},t.createElement(s.TextInput,{testId:"tag-editor-input",className:p.input,isDisabled:l,isInvalid:f,type:"text",value:r,placeholder:"Type the value and hit enter",onKeyDown:function(n){r&&13===n.keyCode&&(e.onUpdate([].concat(e.items,[r])),i(""))},onChange:function(e){i(e.target.value)}}),t.createElement(x,{useDragHandle:!0,axis:"xy",distance:10,onSortEnd:function(e){b({oldIndex:e.oldIndex,newIndex:e.newIndex})}},o.map((function(e,n){return t.createElement(g,{label:e,index:n,key:e+n,disabled:l,onRemove:function(){v(n)}})}))),c&&d&&t.createElement(m,{constraints:c,constraintsType:d}))}function b(e){return null===e||0===e.length}function E(e){var t=e.field,i=(t.validations||[]).filter((function(e){return e.size})).map((function(e){return e.size})),l=i.length>0?i[0]:{},o=function(e){if(e)return a(e.min)&&a(e.max)?"min-max":a(e.min)?"min":a(e.max)?"max":void 0}(l);return n.createElement(r.FieldConnector,{field:t,isInitiallyDisabled:e.isInitiallyDisabled,isEmptyValue:b,throttle:0},(function(e){var t=e.setValue;return n.createElement(v,{constraints:l,constraintsType:o,isDisabled:e.disabled,hasError:e.errors.length>0,items:e.value||[],onUpdate:function(e){t(e)}})}))}E.defaultProps={isInitiallyDisabled:!0},exports.TagsEditor=E;
 //# sourceMappingURL=field-editor-tags.cjs.production.min.js.map

package/dist/field-editor-tags.cjs.production.min.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"field-editor-tags.cjs.production.min.js","sources":["../src/TagsEditorConstraints.tsx","../src/TagsEditor.tsx","../src/TagsEditorContainer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from 'emotion';\nimport { Paragraph } from '@contentful/forma-36-react-components';\nimport tokens from '@contentful/forma-36-tokens';\nimport { Constraint, ConstraintsType } from './types';\n\nconst styles = {\n constraints: css({\n fontStyle: 'italic',\n marginTop: tokens.spacingS,\n color: tokens.gray600,\n }),\n};\n\ninterface TagEditorConstraintsProps {\n constraintsType: ConstraintsType;\n constraints: Constraint;\n}\n\nexport function TagsEditorConstraints(props: TagEditorConstraintsProps) {\n const { constraintsType, constraints } = props;\n return (\n <Paragraph className={styles.constraints} testId=\"tag-editor-constraints\">\n {constraintsType === 'min' && (\n <span>\n Requires at least {constraints.min} {constraints.min === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'max' && (\n <span>\n Requires no more than {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max !== constraints.min && (\n <span>\n Requires between {constraints.min} and {constraints.max} tags\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max === constraints.min && (\n <span>\n Requires exactly {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n </Paragraph>\n );\n}\n","import noop from 'lodash/noop';\nimport React, { useState, useCallback } from 'react';\nimport { css } from 'emotion';\nimport tokens from '@contentful/forma-36-tokens';\nimport { TextInput, Pill, Icon } from '@contentful/forma-36-react-components';\nimport { TagsEditorConstraints } from './TagsEditorConstraints';\nimport { ConstraintsType, Constraint } from './types';\nimport { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';\nimport arrayMove from 'array-move';\n\nexport interface TagsEditorProps {\n items: string[];\n isDisabled: boolean;\n hasError: boolean;\n constraintsType?: ConstraintsType;\n constraints?: Constraint;\n onUpdate: (items: string[]) => void;\n}\n\nconst styles = {\n dropContainer: css({\n whiteSpace: 'nowrap',\n display: 'flex',\n flexWrap: 'wrap',\n }),\n input: css({\n marginTop: tokens.spacingS,\n marginBottom: tokens.spacingM,\n }),\n pill: css({\n marginRight: tokens.spacingS,\n marginBottom: tokens.spacingS,\n }),\n handle: css({\n lineHeight: '1.5rem',\n padding: '0.375rem 0.625rem',\n paddingRight: 0,\n cursor: 'grab',\n userSelect: 'none',\n svg: {\n fill: tokens.gray500,\n verticalAlign: 'middle',\n },\n }),\n};\n\nconst SortablePillHandle = SortableHandle(() => (\n <div className={styles.handle}>\n <Icon icon=\"Drag\" color=\"muted\" />\n </div>\n));\n\ninterface SortablePillProps {\n label: string;\n onRemove: Function;\n disabled: boolean;\n index: number;\n}\n\nconst SortablePill = SortableElement((props: SortablePillProps) => (\n <Pill\n testId=\"tag-editor-pill\"\n className={styles.pill}\n label={props.label}\n onClose={() => {\n if (!props.disabled) {\n props.onRemove(props.index);\n }\n }}\n onDrag={noop}\n dragHandleComponent={<SortablePillHandle />}\n />\n));\n\ninterface SortableListProps {\n children: React.ReactNode;\n}\n\nconst SortableList = SortableContainer((props: SortableListProps) => (\n <div className={styles.dropContainer}>{props.children}</div>\n));\n\nexport function TagsEditor(props: TagsEditorProps) {\n const [pendingValue, setPendingValue] = useState('');\n\n const { isDisabled, items, constraints, constraintsType, hasError } = props;\n\n const removeItem = useCallback(\n (index) => {\n const newItems = props.items.filter((_, filterIndex) => index !== filterIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n const swapItems = useCallback(\n ({ oldIndex, newIndex }) => {\n const newItems = arrayMove(props.items, oldIndex, newIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n return (\n <div data-test-id=\"tag-editor-container\">\n <TextInput\n testId=\"tag-editor-input\"\n className={styles.input}\n disabled={isDisabled}\n error={hasError}\n type=\"text\"\n value={pendingValue}\n placeholder=\"Type the value and hit enter\"\n onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n if (pendingValue && e.keyCode === 13) {\n props.onUpdate([...props.items, pendingValue]);\n setPendingValue('');\n }\n }}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n setPendingValue(e.target.value);\n }}\n />\n <SortableList\n useDragHandle\n axis=\"xy\"\n distance={10}\n onSortEnd={({ oldIndex, newIndex }) => {\n swapItems({ oldIndex, newIndex });\n }}>\n {items.map((item, index) => {\n return (\n <SortablePill\n label={item}\n index={index}\n key={item + index}\n disabled={isDisabled}\n onRemove={() => {\n removeItem(index);\n }}\n />\n );\n })}\n </SortableList>\n {constraints && constraintsType && (\n <TagsEditorConstraints constraints={constraints} constraintsType={constraintsType} />\n )}\n </div>\n );\n}\n","import * as React from 'react';\nimport isNumber from 'lodash/isNumber';\nimport { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TagsEditor } from './TagsEditor';\nimport { ConstraintsType, Constraint } from './types';\n\nexport interface TagsEditorContainerProps {\n /*\n is the field disabled initially\n /\n isInitiallyDisabled: boolean;\n /\n sdk.field\n */\n field: FieldAPI;\n}\n\ntype TagEditorValue = string[];\n\nfunction isEmptyTagsValue(value: TagEditorValue \| null) {\n return value === null \|\| value.length === 0;\n}\n\nfunction getConstraintsType(sizeConstraints?: Constraint): ConstraintsType \| undefined {\n if (!sizeConstraints) {\n return undefined;\n }\n if (isNumber(sizeConstraints.min) && isNumber(sizeConstraints.max)) {\n return 'min-max';\n } else if (isNumber(sizeConstraints.min)) {\n return 'min';\n } else if (isNumber(sizeConstraints.max)) {\n return 'max';\n } else {\n return undefined;\n }\n}\n\nexport function TagsEditorContainer(props: TagsEditorContainerProps) {\n const field = props.field;\n\n const validations = field.validations \|\| [];\n\n const sizeValidations = (validations as { size?: Constraint }[])\n .filter((validation) => validation.size)\n .map((validation) => validation.size);\n\n const constraints = sizeValidations.length > 0 ? sizeValidations[0] : {};\n\n const constraintsType = getConstraintsType(constraints);\n\n return (\n <FieldConnector<TagEditorValue>\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}\n isEmptyValue={isEmptyTagsValue}\n throttle={0}>\n {({ disabled, value, errors, setValue }) => {\n const items = value \|\| [];\n return (\n <TagsEditor\n constraints={constraints}\n constraintsType={constraintsType}\n isDisabled={disabled}\n hasError={errors.length > 0}\n items={items}\n onUpdate={(items) => {\n setValue(items);\n }}\n />\n );\n }}\n </FieldConnector>\n );\n}\n\nTagsEditorContainer.defaultProps = {\n isInitiallyDisabled: true,\n};\n","import { TagsEditorContainer } from './TagsEditorContainer';\n\nexport const TagsEditor = TagsEditorContainer;\n"],"names":["styles","constraints","css","fontStyle","marginTop","tokens","spacingS","color","gray600","TagsEditorConstraints","props","constraintsType","React","Paragraph","className","testId","min","max","dropContainer","whiteSpace","display","flexWrap","input","marginBottom","spacingM","pill","marginRight","handle","lineHeight","padding","paddingRight","cursor","userSelect","svg","fill","gray500","verticalAlign","SortablePillHandle","SortableHandle","Icon","icon","SortablePill","SortableElement","Pill","label","onClose","disabled","onRemove","index","onDrag","noop","dragHandleComponent","SortableList","SortableContainer","children","TagsEditor","useState","pendingValue","setPendingValue","isDisabled","items","hasError","removeItem","useCallback","newItems","filter","_","filterIndex","onUpdate","swapItems","arrayMove","oldIndex","newIndex","TextInput","error","type","value","placeholder","onKeyDown","e","keyCode","onChange","target","useDragHandle","axis","distance","onSortEnd","map","item","key","isEmptyTagsValue","length","TagsEditorContainer","field","sizeValidations","validations","validation","size","sizeConstraints","isNumber","getConstraintsType","FieldConnector","isInitiallyDisabled","isEmptyValue","throttle","setValue","errors","defaultProps"],"mappings":"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"}
1	+ {"version":3,"file":"field-editor-tags.cjs.production.min.js","sources":["../src/TagsEditorConstraints.tsx","../src/TagsEditor.tsx","../src/TagsEditorContainer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from 'emotion';\nimport { Constraint, ConstraintsType } from './types';\n\nimport { Text } from '@contentful/f36-components';\n\ninterface TagEditorConstraintsProps {\n constraintsType: ConstraintsType;\n constraints: Constraint;\n}\n\nexport function TagsEditorConstraints(props: TagEditorConstraintsProps) {\n const { constraintsType, constraints } = props;\n return (\n <Text\n as=\"p\"\n fontColor=\"gray600\"\n marginBottom=\"none\"\n marginTop=\"spacingS\"\n className={css({\n fontStyle: 'italic',\n })}\n testId=\"tag-editor-constraints\">\n {constraintsType === 'min' && (\n <span>\n Requires at least {constraints.min} {constraints.min === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'max' && (\n <span>\n Requires no more than {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max !== constraints.min && (\n <span>\n Requires between {constraints.min} and {constraints.max} tags\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max === constraints.min && (\n <span>\n Requires exactly {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n </Text>\n );\n}\n","import noop from 'lodash/noop';\nimport React, { useState, useCallback } from 'react';\nimport { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { TagsEditorConstraints } from './TagsEditorConstraints';\nimport { ConstraintsType, Constraint } from './types';\nimport { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';\nimport arrayMove from 'array-move';\n\nimport { Pill, TextInput } from '@contentful/f36-components';\n\nimport { DragIcon } from '@contentful/f36-icons';\n\nexport interface TagsEditorProps {\n items: string[];\n isDisabled: boolean;\n hasError: boolean;\n constraintsType?: ConstraintsType;\n constraints?: Constraint;\n onUpdate: (items: string[]) => void;\n}\n\nconst styles = {\n dropContainer: css({\n whiteSpace: 'nowrap',\n display: 'flex',\n flexWrap: 'wrap',\n }),\n input: css({\n marginTop: tokens.spacingS,\n marginBottom: tokens.spacingM,\n }),\n pill: css({\n marginRight: tokens.spacingS,\n marginBottom: tokens.spacingS,\n }),\n handle: css({\n lineHeight: '1.5rem',\n padding: '0.375rem 0.625rem',\n paddingRight: 0,\n cursor: 'grab',\n userSelect: 'none',\n svg: {\n fill: tokens.gray500,\n verticalAlign: 'middle',\n },\n }),\n};\n\nconst SortablePillHandle = SortableHandle(() => (\n <div className={styles.handle}>\n <DragIcon variant=\"muted\" />\n </div>\n));\n\ninterface SortablePillProps {\n label: string;\n onRemove: Function;\n disabled: boolean;\n index: number;\n}\n\nconst SortablePill = SortableElement((props: SortablePillProps) => (\n <Pill\n testId=\"tag-editor-pill\"\n className={styles.pill}\n label={props.label}\n onClose={() => {\n if (!props.disabled) {\n props.onRemove(props.index);\n }\n }}\n onDrag={noop}\n dragHandleComponent={<SortablePillHandle />}\n />\n));\n\ninterface SortableListProps {\n children: React.ReactNode;\n}\n\nconst SortableList = SortableContainer((props: SortableListProps) => (\n <div className={styles.dropContainer}>{props.children}</div>\n));\n\nexport function TagsEditor(props: TagsEditorProps) {\n const [pendingValue, setPendingValue] = useState('');\n\n const { isDisabled, items, constraints, constraintsType, hasError } = props;\n\n const removeItem = useCallback(\n (index) => {\n const newItems = props.items.filter((_, filterIndex) => index !== filterIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n const swapItems = useCallback(\n ({ oldIndex, newIndex }) => {\n const newItems = arrayMove(props.items, oldIndex, newIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n return (\n <div data-test-id=\"tag-editor-container\">\n <TextInput\n testId=\"tag-editor-input\"\n className={styles.input}\n isDisabled={isDisabled}\n isInvalid={hasError}\n type=\"text\"\n value={pendingValue}\n placeholder=\"Type the value and hit enter\"\n onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n if (pendingValue && e.keyCode === 13) {\n props.onUpdate([...props.items, pendingValue]);\n setPendingValue('');\n }\n }}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n setPendingValue(e.target.value);\n }}\n />\n <SortableList\n useDragHandle\n axis=\"xy\"\n distance={10}\n onSortEnd={({ oldIndex, newIndex }) => {\n swapItems({ oldIndex, newIndex });\n }}>\n {items.map((item, index) => {\n return (\n <SortablePill\n label={item}\n index={index}\n key={item + index}\n disabled={isDisabled}\n onRemove={() => {\n removeItem(index);\n }}\n />\n );\n })}\n </SortableList>\n {constraints && constraintsType && (\n <TagsEditorConstraints constraints={constraints} constraintsType={constraintsType} />\n )}\n </div>\n );\n}\n","import * as React from 'react';\nimport isNumber from 'lodash/isNumber';\nimport { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TagsEditor } from './TagsEditor';\nimport { ConstraintsType, Constraint } from './types';\n\nexport interface TagsEditorContainerProps {\n /*\n is the field disabled initially\n /\n isInitiallyDisabled: boolean;\n /\n sdk.field\n */\n field: FieldAPI;\n}\n\ntype TagEditorValue = string[];\n\nfunction isEmptyTagsValue(value: TagEditorValue \| null) {\n return value === null \|\| value.length === 0;\n}\n\nfunction getConstraintsType(sizeConstraints?: Constraint): ConstraintsType \| undefined {\n if (!sizeConstraints) {\n return undefined;\n }\n if (isNumber(sizeConstraints.min) && isNumber(sizeConstraints.max)) {\n return 'min-max';\n } else if (isNumber(sizeConstraints.min)) {\n return 'min';\n } else if (isNumber(sizeConstraints.max)) {\n return 'max';\n } else {\n return undefined;\n }\n}\n\nexport function TagsEditorContainer(props: TagsEditorContainerProps) {\n const field = props.field;\n\n const validations = field.validations \|\| [];\n\n const sizeValidations = (validations as { size?: Constraint }[])\n .filter((validation) => validation.size)\n .map((validation) => validation.size);\n\n const constraints = sizeValidations.length > 0 ? sizeValidations[0] : {};\n\n const constraintsType = getConstraintsType(constraints);\n\n return (\n <FieldConnector<TagEditorValue>\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}\n isEmptyValue={isEmptyTagsValue}\n throttle={0}>\n {({ disabled, value, errors, setValue }) => {\n const items = value \|\| [];\n return (\n <TagsEditor\n constraints={constraints}\n constraintsType={constraintsType}\n isDisabled={disabled}\n hasError={errors.length > 0}\n items={items}\n onUpdate={(items) => {\n setValue(items);\n }}\n />\n );\n }}\n </FieldConnector>\n );\n}\n\nTagsEditorContainer.defaultProps = {\n isInitiallyDisabled: true,\n};\n","import { TagsEditorContainer } from './TagsEditorContainer';\n\nexport const TagsEditor = TagsEditorContainer;\n"],"names":["TagsEditorConstraints","props","constraintsType","constraints","React","Text","as","fontColor","marginBottom","marginTop","className","css","fontStyle","testId","min","max","styles","dropContainer","whiteSpace","display","flexWrap","input","tokens","spacingS","spacingM","pill","marginRight","handle","lineHeight","padding","paddingRight","cursor","userSelect","svg","fill","gray500","verticalAlign","SortablePillHandle","SortableHandle","DragIcon","variant","SortablePill","SortableElement","Pill","label","onClose","disabled","onRemove","index","onDrag","noop","dragHandleComponent","SortableList","SortableContainer","children","TagsEditor","useState","pendingValue","setPendingValue","isDisabled","items","hasError","removeItem","useCallback","newItems","filter","_","filterIndex","onUpdate","swapItems","arrayMove","oldIndex","newIndex","TextInput","isInvalid","type","value","placeholder","onKeyDown","e","keyCode","onChange","target","useDragHandle","axis","distance","onSortEnd","map","item","key","isEmptyTagsValue","length","TagsEditorContainer","field","sizeValidations","validations","validation","size","sizeConstraints","isNumber","getConstraintsType","FieldConnector","isInitiallyDisabled","isEmptyValue","throttle","setValue","errors","defaultProps"],"mappings":"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"}

package/dist/field-editor-tags.esm.js CHANGED Viewed

@@ -3,28 +3,28 @@ import isNumber from 'lodash-es/isNumber';
 import { FieldConnector } from '@contentful/field-editor-shared';
 import noop from 'lodash-es/noop';
 import { css } from 'emotion';
-import tokens from '@contentful/forma-36-tokens';
-import { Paragraph, TextInput, Pill, Icon } from '@contentful/forma-36-react-components';
+import tokens from '@contentful/f36-tokens';
+import { Text, TextInput, Pill } from '@contentful/f36-components';
 import { SortableElement, SortableContainer, SortableHandle } from 'react-sortable-hoc';
 import arrayMove from 'array-move';
+import { DragIcon } from '@contentful/f36-icons';
-var styles = {
-  constraints: /*#__PURE__*/css({
-    fontStyle: 'italic',
-    marginTop: tokens.spacingS,
-    color: tokens.gray600
-  })
-};
 function TagsEditorConstraints(props) {
   var constraintsType = props.constraintsType,
       constraints = props.constraints;
-  return React__default.createElement(Paragraph, {
-    className: styles.constraints,
+  return React__default.createElement(Text, {
+    as: "p",
+    fontColor: "gray600",
+    marginBottom: "none",
+    marginTop: "spacingS",
+    className: css({
+      fontStyle: 'italic'
+    }),
     testId: "tag-editor-constraints"
   }, constraintsType === 'min' && React__default.createElement("span", null, "Requires at least ", constraints.min, " ", constraints.min === 1 ? 'tag' : 'tags'), constraintsType === 'max' && React__default.createElement("span", null, "Requires no more than ", constraints.max, " ", constraints.max === 1 ? 'tag' : 'tags'), constraintsType === 'min-max' && constraints.max !== constraints.min && React__default.createElement("span", null, "Requires between ", constraints.min, " and ", constraints.max, " tags"), constraintsType === 'min-max' && constraints.max === constraints.min && React__default.createElement("span", null, "Requires exactly ", constraints.max, " ", constraints.max === 1 ? 'tag' : 'tags'));
 }
-var styles$1 = {
+var styles = {
   dropContainer: /*#__PURE__*/css({
     whiteSpace: 'nowrap',
     display: 'flex',
@@ -52,16 +52,15 @@ var styles$1 = {
 };
 var SortablePillHandle = /*#__PURE__*/SortableHandle(function () {
   return React__default.createElement("div", {
-    className: styles$1.handle
-  }, React__default.createElement(Icon, {
-    icon: "Drag",
-    color: "muted"
+    className: styles.handle
+  }, React__default.createElement(DragIcon, {
+    variant: "muted"
   }));
 });
 var SortablePill = /*#__PURE__*/SortableElement(function (props) {
   return React__default.createElement(Pill, {
     testId: "tag-editor-pill",
-    className: styles$1.pill,
+    className: styles.pill,
     label: props.label,
     onClose: function onClose() {
       if (!props.disabled) {
@@ -74,7 +73,7 @@ var SortablePill = /*#__PURE__*/SortableElement(function (props) {
 });
 var SortableList = /*#__PURE__*/SortableContainer(function (props) {
   return React__default.createElement("div", {
-    className: styles$1.dropContainer
+    className: styles.dropContainer
   }, props.children);
 });
 function TagsEditor(props) {
@@ -103,9 +102,9 @@ function TagsEditor(props) {
     "data-test-id": "tag-editor-container"
   }, React__default.createElement(TextInput, {
     testId: "tag-editor-input",
-    className: styles$1.input,
-    disabled: isDisabled,
-    error: hasError,
+    className: styles.input,
+    isDisabled: isDisabled,
+    isInvalid: hasError,
     type: "text",
     value: pendingValue,
     placeholder: "Type the value and hit enter",

package/dist/field-editor-tags.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"field-editor-tags.esm.js","sources":["../src/TagsEditorConstraints.tsx","../src/TagsEditor.tsx","../src/TagsEditorContainer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from 'emotion';\nimport { Paragraph } from '@contentful/forma-36-react-components';\nimport tokens from '@contentful/forma-36-tokens';\nimport { Constraint, ConstraintsType } from './types';\n\nconst styles = {\n constraints: css({\n fontStyle: 'italic',\n marginTop: tokens.spacingS,\n color: tokens.gray600,\n }),\n};\n\ninterface TagEditorConstraintsProps {\n constraintsType: ConstraintsType;\n constraints: Constraint;\n}\n\nexport function TagsEditorConstraints(props: TagEditorConstraintsProps) {\n const { constraintsType, constraints } = props;\n return (\n <Paragraph className={styles.constraints} testId=\"tag-editor-constraints\">\n {constraintsType === 'min' && (\n <span>\n Requires at least {constraints.min} {constraints.min === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'max' && (\n <span>\n Requires no more than {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max !== constraints.min && (\n <span>\n Requires between {constraints.min} and {constraints.max} tags\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max === constraints.min && (\n <span>\n Requires exactly {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n </Paragraph>\n );\n}\n","import noop from 'lodash/noop';\nimport React, { useState, useCallback } from 'react';\nimport { css } from 'emotion';\nimport tokens from '@contentful/forma-36-tokens';\nimport { TextInput, Pill, Icon } from '@contentful/forma-36-react-components';\nimport { TagsEditorConstraints } from './TagsEditorConstraints';\nimport { ConstraintsType, Constraint } from './types';\nimport { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';\nimport arrayMove from 'array-move';\n\nexport interface TagsEditorProps {\n items: string[];\n isDisabled: boolean;\n hasError: boolean;\n constraintsType?: ConstraintsType;\n constraints?: Constraint;\n onUpdate: (items: string[]) => void;\n}\n\nconst styles = {\n dropContainer: css({\n whiteSpace: 'nowrap',\n display: 'flex',\n flexWrap: 'wrap',\n }),\n input: css({\n marginTop: tokens.spacingS,\n marginBottom: tokens.spacingM,\n }),\n pill: css({\n marginRight: tokens.spacingS,\n marginBottom: tokens.spacingS,\n }),\n handle: css({\n lineHeight: '1.5rem',\n padding: '0.375rem 0.625rem',\n paddingRight: 0,\n cursor: 'grab',\n userSelect: 'none',\n svg: {\n fill: tokens.gray500,\n verticalAlign: 'middle',\n },\n }),\n};\n\nconst SortablePillHandle = SortableHandle(() => (\n <div className={styles.handle}>\n <Icon icon=\"Drag\" color=\"muted\" />\n </div>\n));\n\ninterface SortablePillProps {\n label: string;\n onRemove: Function;\n disabled: boolean;\n index: number;\n}\n\nconst SortablePill = SortableElement((props: SortablePillProps) => (\n <Pill\n testId=\"tag-editor-pill\"\n className={styles.pill}\n label={props.label}\n onClose={() => {\n if (!props.disabled) {\n props.onRemove(props.index);\n }\n }}\n onDrag={noop}\n dragHandleComponent={<SortablePillHandle />}\n />\n));\n\ninterface SortableListProps {\n children: React.ReactNode;\n}\n\nconst SortableList = SortableContainer((props: SortableListProps) => (\n <div className={styles.dropContainer}>{props.children}</div>\n));\n\nexport function TagsEditor(props: TagsEditorProps) {\n const [pendingValue, setPendingValue] = useState('');\n\n const { isDisabled, items, constraints, constraintsType, hasError } = props;\n\n const removeItem = useCallback(\n (index) => {\n const newItems = props.items.filter((_, filterIndex) => index !== filterIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n const swapItems = useCallback(\n ({ oldIndex, newIndex }) => {\n const newItems = arrayMove(props.items, oldIndex, newIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n return (\n <div data-test-id=\"tag-editor-container\">\n <TextInput\n testId=\"tag-editor-input\"\n className={styles.input}\n disabled={isDisabled}\n error={hasError}\n type=\"text\"\n value={pendingValue}\n placeholder=\"Type the value and hit enter\"\n onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n if (pendingValue && e.keyCode === 13) {\n props.onUpdate([...props.items, pendingValue]);\n setPendingValue('');\n }\n }}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n setPendingValue(e.target.value);\n }}\n />\n <SortableList\n useDragHandle\n axis=\"xy\"\n distance={10}\n onSortEnd={({ oldIndex, newIndex }) => {\n swapItems({ oldIndex, newIndex });\n }}>\n {items.map((item, index) => {\n return (\n <SortablePill\n label={item}\n index={index}\n key={item + index}\n disabled={isDisabled}\n onRemove={() => {\n removeItem(index);\n }}\n />\n );\n })}\n </SortableList>\n {constraints && constraintsType && (\n <TagsEditorConstraints constraints={constraints} constraintsType={constraintsType} />\n )}\n </div>\n );\n}\n","import * as React from 'react';\nimport isNumber from 'lodash/isNumber';\nimport { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TagsEditor } from './TagsEditor';\nimport { ConstraintsType, Constraint } from './types';\n\nexport interface TagsEditorContainerProps {\n /*\n is the field disabled initially\n /\n isInitiallyDisabled: boolean;\n /\n sdk.field\n */\n field: FieldAPI;\n}\n\ntype TagEditorValue = string[];\n\nfunction isEmptyTagsValue(value: TagEditorValue \| null) {\n return value === null \|\| value.length === 0;\n}\n\nfunction getConstraintsType(sizeConstraints?: Constraint): ConstraintsType \| undefined {\n if (!sizeConstraints) {\n return undefined;\n }\n if (isNumber(sizeConstraints.min) && isNumber(sizeConstraints.max)) {\n return 'min-max';\n } else if (isNumber(sizeConstraints.min)) {\n return 'min';\n } else if (isNumber(sizeConstraints.max)) {\n return 'max';\n } else {\n return undefined;\n }\n}\n\nexport function TagsEditorContainer(props: TagsEditorContainerProps) {\n const field = props.field;\n\n const validations = field.validations \|\| [];\n\n const sizeValidations = (validations as { size?: Constraint }[])\n .filter((validation) => validation.size)\n .map((validation) => validation.size);\n\n const constraints = sizeValidations.length > 0 ? sizeValidations[0] : {};\n\n const constraintsType = getConstraintsType(constraints);\n\n return (\n <FieldConnector<TagEditorValue>\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}\n isEmptyValue={isEmptyTagsValue}\n throttle={0}>\n {({ disabled, value, errors, setValue }) => {\n const items = value \|\| [];\n return (\n <TagsEditor\n constraints={constraints}\n constraintsType={constraintsType}\n isDisabled={disabled}\n hasError={errors.length > 0}\n items={items}\n onUpdate={(items) => {\n setValue(items);\n }}\n />\n );\n }}\n </FieldConnector>\n );\n}\n\nTagsEditorContainer.defaultProps = {\n isInitiallyDisabled: true,\n};\n","import { TagsEditorContainer } from './TagsEditorContainer';\n\nexport const TagsEditor = TagsEditorContainer;\n"],"names":["styles","constraints","css","fontStyle","marginTop","tokens","spacingS","color","gray600","TagsEditorConstraints","props","constraintsType","React","Paragraph","className","testId","min","max","dropContainer","whiteSpace","display","flexWrap","input","marginBottom","spacingM","pill","marginRight","handle","lineHeight","padding","paddingRight","cursor","userSelect","svg","fill","gray500","verticalAlign","SortablePillHandle","SortableHandle","Icon","icon","SortablePill","SortableElement","Pill","label","onClose","disabled","onRemove","index","onDrag","noop","dragHandleComponent","SortableList","SortableContainer","children","TagsEditor","useState","pendingValue","setPendingValue","isDisabled","items","hasError","removeItem","useCallback","newItems","filter","_","filterIndex","onUpdate","swapItems","oldIndex","newIndex","arrayMove","TextInput","error","type","value","placeholder","onKeyDown","e","keyCode","onChange","target","useDragHandle","axis","distance","onSortEnd","map","item","key","isEmptyTagsValue","length","getConstraintsType","sizeConstraints","undefined","isNumber","TagsEditorContainer","field","validations","sizeValidations","validation","size","FieldConnector","isInitiallyDisabled","isEmptyValue","throttle","errors","setValue","defaultProps"],"mappings":"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"}
1	+ {"version":3,"file":"field-editor-tags.esm.js","sources":["../src/TagsEditorConstraints.tsx","../src/TagsEditor.tsx","../src/TagsEditorContainer.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from 'emotion';\nimport { Constraint, ConstraintsType } from './types';\n\nimport { Text } from '@contentful/f36-components';\n\ninterface TagEditorConstraintsProps {\n constraintsType: ConstraintsType;\n constraints: Constraint;\n}\n\nexport function TagsEditorConstraints(props: TagEditorConstraintsProps) {\n const { constraintsType, constraints } = props;\n return (\n <Text\n as=\"p\"\n fontColor=\"gray600\"\n marginBottom=\"none\"\n marginTop=\"spacingS\"\n className={css({\n fontStyle: 'italic',\n })}\n testId=\"tag-editor-constraints\">\n {constraintsType === 'min' && (\n <span>\n Requires at least {constraints.min} {constraints.min === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'max' && (\n <span>\n Requires no more than {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max !== constraints.min && (\n <span>\n Requires between {constraints.min} and {constraints.max} tags\n </span>\n )}\n {constraintsType === 'min-max' && constraints.max === constraints.min && (\n <span>\n Requires exactly {constraints.max} {constraints.max === 1 ? 'tag' : 'tags'}\n </span>\n )}\n </Text>\n );\n}\n","import noop from 'lodash/noop';\nimport React, { useState, useCallback } from 'react';\nimport { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { TagsEditorConstraints } from './TagsEditorConstraints';\nimport { ConstraintsType, Constraint } from './types';\nimport { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';\nimport arrayMove from 'array-move';\n\nimport { Pill, TextInput } from '@contentful/f36-components';\n\nimport { DragIcon } from '@contentful/f36-icons';\n\nexport interface TagsEditorProps {\n items: string[];\n isDisabled: boolean;\n hasError: boolean;\n constraintsType?: ConstraintsType;\n constraints?: Constraint;\n onUpdate: (items: string[]) => void;\n}\n\nconst styles = {\n dropContainer: css({\n whiteSpace: 'nowrap',\n display: 'flex',\n flexWrap: 'wrap',\n }),\n input: css({\n marginTop: tokens.spacingS,\n marginBottom: tokens.spacingM,\n }),\n pill: css({\n marginRight: tokens.spacingS,\n marginBottom: tokens.spacingS,\n }),\n handle: css({\n lineHeight: '1.5rem',\n padding: '0.375rem 0.625rem',\n paddingRight: 0,\n cursor: 'grab',\n userSelect: 'none',\n svg: {\n fill: tokens.gray500,\n verticalAlign: 'middle',\n },\n }),\n};\n\nconst SortablePillHandle = SortableHandle(() => (\n <div className={styles.handle}>\n <DragIcon variant=\"muted\" />\n </div>\n));\n\ninterface SortablePillProps {\n label: string;\n onRemove: Function;\n disabled: boolean;\n index: number;\n}\n\nconst SortablePill = SortableElement((props: SortablePillProps) => (\n <Pill\n testId=\"tag-editor-pill\"\n className={styles.pill}\n label={props.label}\n onClose={() => {\n if (!props.disabled) {\n props.onRemove(props.index);\n }\n }}\n onDrag={noop}\n dragHandleComponent={<SortablePillHandle />}\n />\n));\n\ninterface SortableListProps {\n children: React.ReactNode;\n}\n\nconst SortableList = SortableContainer((props: SortableListProps) => (\n <div className={styles.dropContainer}>{props.children}</div>\n));\n\nexport function TagsEditor(props: TagsEditorProps) {\n const [pendingValue, setPendingValue] = useState('');\n\n const { isDisabled, items, constraints, constraintsType, hasError } = props;\n\n const removeItem = useCallback(\n (index) => {\n const newItems = props.items.filter((_, filterIndex) => index !== filterIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n const swapItems = useCallback(\n ({ oldIndex, newIndex }) => {\n const newItems = arrayMove(props.items, oldIndex, newIndex);\n props.onUpdate(newItems);\n },\n [props]\n );\n\n return (\n <div data-test-id=\"tag-editor-container\">\n <TextInput\n testId=\"tag-editor-input\"\n className={styles.input}\n isDisabled={isDisabled}\n isInvalid={hasError}\n type=\"text\"\n value={pendingValue}\n placeholder=\"Type the value and hit enter\"\n onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n if (pendingValue && e.keyCode === 13) {\n props.onUpdate([...props.items, pendingValue]);\n setPendingValue('');\n }\n }}\n onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n setPendingValue(e.target.value);\n }}\n />\n <SortableList\n useDragHandle\n axis=\"xy\"\n distance={10}\n onSortEnd={({ oldIndex, newIndex }) => {\n swapItems({ oldIndex, newIndex });\n }}>\n {items.map((item, index) => {\n return (\n <SortablePill\n label={item}\n index={index}\n key={item + index}\n disabled={isDisabled}\n onRemove={() => {\n removeItem(index);\n }}\n />\n );\n })}\n </SortableList>\n {constraints && constraintsType && (\n <TagsEditorConstraints constraints={constraints} constraintsType={constraintsType} />\n )}\n </div>\n );\n}\n","import * as React from 'react';\nimport isNumber from 'lodash/isNumber';\nimport { FieldAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TagsEditor } from './TagsEditor';\nimport { ConstraintsType, Constraint } from './types';\n\nexport interface TagsEditorContainerProps {\n /*\n is the field disabled initially\n /\n isInitiallyDisabled: boolean;\n /\n sdk.field\n */\n field: FieldAPI;\n}\n\ntype TagEditorValue = string[];\n\nfunction isEmptyTagsValue(value: TagEditorValue \| null) {\n return value === null \|\| value.length === 0;\n}\n\nfunction getConstraintsType(sizeConstraints?: Constraint): ConstraintsType \| undefined {\n if (!sizeConstraints) {\n return undefined;\n }\n if (isNumber(sizeConstraints.min) && isNumber(sizeConstraints.max)) {\n return 'min-max';\n } else if (isNumber(sizeConstraints.min)) {\n return 'min';\n } else if (isNumber(sizeConstraints.max)) {\n return 'max';\n } else {\n return undefined;\n }\n}\n\nexport function TagsEditorContainer(props: TagsEditorContainerProps) {\n const field = props.field;\n\n const validations = field.validations \|\| [];\n\n const sizeValidations = (validations as { size?: Constraint }[])\n .filter((validation) => validation.size)\n .map((validation) => validation.size);\n\n const constraints = sizeValidations.length > 0 ? sizeValidations[0] : {};\n\n const constraintsType = getConstraintsType(constraints);\n\n return (\n <FieldConnector<TagEditorValue>\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}\n isEmptyValue={isEmptyTagsValue}\n throttle={0}>\n {({ disabled, value, errors, setValue }) => {\n const items = value \|\| [];\n return (\n <TagsEditor\n constraints={constraints}\n constraintsType={constraintsType}\n isDisabled={disabled}\n hasError={errors.length > 0}\n items={items}\n onUpdate={(items) => {\n setValue(items);\n }}\n />\n );\n }}\n </FieldConnector>\n );\n}\n\nTagsEditorContainer.defaultProps = {\n isInitiallyDisabled: true,\n};\n","import { TagsEditorContainer } from './TagsEditorContainer';\n\nexport const TagsEditor = TagsEditorContainer;\n"],"names":["TagsEditorConstraints","props","constraintsType","constraints","React","Text","as","fontColor","marginBottom","marginTop","className","css","fontStyle","testId","min","max","styles","dropContainer","whiteSpace","display","flexWrap","input","tokens","spacingS","spacingM","pill","marginRight","handle","lineHeight","padding","paddingRight","cursor","userSelect","svg","fill","gray500","verticalAlign","SortablePillHandle","SortableHandle","DragIcon","variant","SortablePill","SortableElement","Pill","label","onClose","disabled","onRemove","index","onDrag","noop","dragHandleComponent","SortableList","SortableContainer","children","TagsEditor","useState","pendingValue","setPendingValue","isDisabled","items","hasError","removeItem","useCallback","newItems","filter","_","filterIndex","onUpdate","swapItems","oldIndex","newIndex","arrayMove","TextInput","isInvalid","type","value","placeholder","onKeyDown","e","keyCode","onChange","target","useDragHandle","axis","distance","onSortEnd","map","item","key","isEmptyTagsValue","length","getConstraintsType","sizeConstraints","undefined","isNumber","TagsEditorContainer","field","validations","sizeValidations","validation","size","FieldConnector","isInitiallyDisabled","isEmptyValue","throttle","errors","setValue","defaultProps"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@contentful/field-editor-tags",
-  "version": "0.14.6",
+  "version": "1.0.2",
   "main": "dist/index.js",
   "module": "dist/field-editor-tags.esm.js",
   "typings": "dist/index.d.ts",
@@ -21,9 +21,10 @@
     "tsc": "tsc -p ./ --noEmit"
   },
   "dependencies": {
-    "@contentful/field-editor-shared": "^0.25.1",
-    "@contentful/forma-36-react-components": "^3.93.4",
-    "@contentful/forma-36-tokens": "^0.11.0",
+    "@contentful/f36-components": "^4.0.1-beta.2696",
+    "@contentful/f36-icons": "^4.0.1-beta.2696",
+    "@contentful/f36-tokens": "^4.0.1-beta.2696",
+    "@contentful/field-editor-shared": "^1.0.2",
     "array-move": "^3.0.0",
     "emotion": "^10.0.0",
     "lodash": "^4.17.15",
@@ -31,7 +32,7 @@
     "react-sortable-hoc": "^2.0.0"
   },
   "devDependencies": {
-    "@contentful/field-editor-test-utils": "^0.18.1"
+    "@contentful/field-editor-test-utils": "^1.0.2"
   },
   "peerDependencies": {
     "react": ">=16.8.0"
@@ -46,5 +47,5 @@
       }
     }
   },
-  "gitHead": "422234c47b3637970eea4501d095d2914c88b855"
+  "gitHead": "7813114ba59222371e5b3f2c4d90464b75cb8d0d"
 }