@contentful/field-editor-shared 1.2.0 → 1.3.1

package/dist/cjs/index.js

@@ -0,0 +1,155 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    AccessAPI: function() {
+        return _appsdk.AccessAPI;
+    },
+    AppConfigAPI: function() {
+        return _appsdk.AppConfigAPI;
+    },
+    BaseExtensionSDK: function() {
+        return _appsdk.BaseExtensionSDK;
+    },
+    ContentType: function() {
+        return _appsdk.ContentType;
+    },
+    DialogsAPI: function() {
+        return _appsdk.DialogsAPI;
+    },
+    EntryAPI: function() {
+        return _appsdk.EntryAPI;
+    },
+    EntryFieldAPI: function() {
+        return _appsdk.EntryFieldAPI;
+    },
+    FieldAPI: function() {
+        return _appsdk.FieldAPI;
+    },
+    FieldExtensionSDK: function() {
+        return _appsdk.FieldExtensionSDK;
+    },
+    IdsAPI: function() {
+        return _appsdk.IdsAPI;
+    },
+    LocalesAPI: function() {
+        return _appsdk.LocalesAPI;
+    },
+    LocationAPI: function() {
+        return _appsdk.LocationAPI;
+    },
+    NavigatorAPI: function() {
+        return _appsdk.NavigatorAPI;
+    },
+    NotifierAPI: function() {
+        return _appsdk.NotifierAPI;
+    },
+    OpenCustomWidgetOptions: function() {
+        return _appsdk.OpenCustomWidgetOptions;
+    },
+    ParametersAPI: function() {
+        return _appsdk.ParametersAPI;
+    },
+    SpaceAPI: function() {
+        return _appsdk.SpaceAPI;
+    },
+    WindowAPI: function() {
+        return _appsdk.WindowAPI;
+    },
+    CharCounter: function() {
+        return _CharCounter.CharCounter;
+    },
+    CharValidation: function() {
+        return _CharValidation.CharValidation;
+    },
+    FieldConnector: function() {
+        return _FieldConnector.FieldConnector;
+    },
+    PredefinedValuesError: function() {
+        return _PredefinedValuesError.PredefinedValuesError;
+    },
+    Asset: function() {
+        return _typesEntity.Asset;
+    },
+    Entry: function() {
+        return _typesEntity.Entry;
+    },
+    File: function() {
+        return _typesEntity.File;
+    },
+    isValidImage: function() {
+        return _isValidImage.isValidImage;
+    },
+    shortenStorageUnit: function() {
+        return _shortenStorageUnit.shortenStorageUnit;
+    },
+    toLocaleString: function() {
+        return _shortenStorageUnit.toLocaleString;
+    },
+    ModalDialogLauncher: function() {
+        return _ModalDialogLauncher;
+    },
+    entityHelpers: function() {
+        return _entityHelpers;
+    },
+    ConstraintsUtils: function() {
+        return _constraints;
+    }
+});
+const _appsdk = require("@contentful/app-sdk");
+const _CharCounter = require("./CharCounter");
+const _CharValidation = require("./CharValidation");
+const _FieldConnector = require("./FieldConnector");
+const _PredefinedValuesError = require("./PredefinedValuesError");
+const _typesEntity = require("./typesEntity");
+const _isValidImage = require("./utils/isValidImage");
+const _shortenStorageUnit = require("./utils/shortenStorageUnit");
+const _ModalDialogLauncher = _interop_require_wildcard(require("./ModalDialogLauncher"));
+const _constraints = _interop_require_wildcard(require("./utils/constraints"));
+const _entityHelpers = _interop_require_wildcard(require("./utils/entityHelpers"));
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}

package/dist/cjs/types.js

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

package/dist/cjs/typesEntity.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    BaseExtensionSDK: function() {
+        return _appsdk.BaseExtensionSDK;
+    },
+    ContentType: function() {
+        return _appsdk.ContentType;
+    },
+    ContentTypeField: function() {
+        return _appsdk.ContentTypeField;
+    },
+    Link: function() {
+        return _appsdk.Link;
+    },
+    Entry: function() {
+        return _appsdk.Entry;
+    },
+    Asset: function() {
+        return _appsdk.Asset;
+    }
+});
+const _appsdk = require("@contentful/app-sdk");

package/dist/cjs/utils/constraints.js

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    fromFieldValidations: function() {
+        return fromFieldValidations;
+    },
+    makeChecker: function() {
+        return makeChecker;
+    }
+});
+const _isNumber = _interop_require_default(require("lodash/isNumber"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function fromFieldValidations(validations = [], fieldType) {
+    const sizeValidation = validations.find((v)=>'size' in v);
+    const size = sizeValidation && sizeValidation.size || {};
+    const min = size.min;
+    const max = size.max;
+    if ((0, _isNumber.default)(min) && (0, _isNumber.default)(max)) {
+        return {
+            type: 'min-max',
+            min,
+            max
+        };
+    } else if ((0, _isNumber.default)(min)) {
+        return {
+            type: 'min',
+            min
+        };
+    } else if ((0, _isNumber.default)(max)) {
+        return {
+            type: 'max',
+            max
+        };
+    } else {
+        return {
+            type: 'max',
+            max: fieldType === 'Symbol' ? 256 : 50000
+        };
+    }
+}
+function makeChecker(constraint) {
+    return function checkConstraint(length) {
+        if (constraint.type === 'max') {
+            return length <= constraint.max;
+        } else if (constraint.type === 'min') {
+            return length >= constraint.min;
+        } else {
+            return length >= constraint.min && length <= constraint.max;
+        }
+    };
+}

package/dist/cjs/utils/entityHelpers.js

@@ -0,0 +1,214 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    getFieldValue: function() {
+        return getFieldValue;
+    },
+    getAssetTitle: function() {
+        return getAssetTitle;
+    },
+    isAssetField: function() {
+        return isAssetField;
+    },
+    isDisplayField: function() {
+        return isDisplayField;
+    },
+    isDescriptionField: function() {
+        return isDescriptionField;
+    },
+    getEntityDescription: function() {
+        return getEntityDescription;
+    },
+    getEntryTitle: function() {
+        return getEntryTitle;
+    },
+    getEntryStatus: function() {
+        return getEntryStatus;
+    },
+    getEntryImage: function() {
+        return getEntryImage;
+    }
+});
+const _get = _interop_require_default(require("lodash/get"));
+const _isObject = _interop_require_default(require("lodash/isObject"));
+const _isString = _interop_require_default(require("lodash/isString"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function titleOrDefault(title, defaultTitle) {
+    if (!(0, _isString.default)(title)) {
+        return defaultTitle;
+    }
+    if (title) {
+        const trimmedTitle = title.trim();
+        if (trimmedTitle.length === 0) {
+            return defaultTitle;
+        }
+        return trimmedTitle;
+    }
+    return defaultTitle;
+}
+function getFieldValue({ entity , fieldId , localeCode , defaultLocaleCode  }) {
+    const values = (0, _get.default)(entity, [
+        'fields',
+        fieldId
+    ]);
+    if (!(0, _isObject.default)(values)) {
+        return;
+    }
+    const firstLocaleCode = Object.keys(values)[0];
+    return values[localeCode] || values[defaultLocaleCode] || values[firstLocaleCode];
+}
+function getAssetTitle({ asset , localeCode , defaultLocaleCode , defaultTitle  }) {
+    const title = getFieldValue({
+        entity: {
+            fields: {
+                title: asset.fields?.title
+            }
+        },
+        fieldId: 'title',
+        localeCode,
+        defaultLocaleCode
+    });
+    return titleOrDefault(title, defaultTitle);
+}
+const isAssetField = (field)=>field.type === 'Link' && field.linkType === 'Asset';
+function isDisplayField({ field , contentType  }) {
+    return field.id === contentType.displayField;
+}
+function isDescriptionField({ field , contentType  }) {
+    const isTextField = (field)=>[
+            'Symbol',
+            'Text'
+        ].includes(field.type);
+    const isMaybeSlugField = (field)=>/\bslug\b/.test(field.name);
+    return isTextField(field) && !isDisplayField({
+        field,
+        contentType
+    }) && !isMaybeSlugField(field);
+}
+function getEntityDescription({ entity , contentType , localeCode , defaultLocaleCode  }) {
+    if (!contentType) {
+        return '';
+    }
+    const descriptionField = contentType.fields.find((field)=>isDescriptionField({
+            field,
+            contentType
+        }));
+    if (!descriptionField) {
+        return '';
+    }
+    return getFieldValue({
+        entity,
+        fieldId: descriptionField.id,
+        localeCode,
+        defaultLocaleCode
+    }) || '';
+}
+function getEntryTitle({ entry , contentType , localeCode , defaultLocaleCode , defaultTitle  }) {
+    let title;
+    if (!contentType) {
+        return defaultTitle;
+    }
+    const displayField = contentType.displayField;
+    if (!displayField) {
+        return defaultTitle;
+    }
+    const displayFieldInfo = contentType.fields.find((field)=>field.id === displayField);
+    if (!displayFieldInfo) {
+        return defaultTitle;
+    }
+    if (displayFieldInfo.localized) {
+        title = getFieldValue({
+            entity: entry,
+            fieldId: displayField,
+            localeCode,
+            defaultLocaleCode
+        });
+        if (!title) {
+            title = getFieldValue({
+                entity: entry,
+                fieldId: displayFieldInfo.id,
+                localeCode,
+                defaultLocaleCode
+            });
+        }
+    } else {
+        title = getFieldValue({
+            entity: entry,
+            fieldId: displayField,
+            defaultLocaleCode,
+            localeCode: ''
+        });
+        if (!title) {
+            title = getFieldValue({
+                entity: entry,
+                fieldId: displayFieldInfo.id,
+                defaultLocaleCode,
+                localeCode: ''
+            });
+        }
+    }
+    return titleOrDefault(title, defaultTitle);
+}
+function getEntryStatus(sys) {
+    if (!sys || sys.type !== 'Entry' && sys.type !== 'Asset') {
+        throw new TypeError('Invalid entity metadata object');
+    }
+    if (sys.deletedVersion) {
+        return 'deleted';
+    } else if (sys.archivedVersion) {
+        return 'archived';
+    } else if (sys.publishedVersion) {
+        if (sys.version > sys.publishedVersion + 1) {
+            return 'changed';
+        } else {
+            return 'published';
+        }
+    } else {
+        return 'draft';
+    }
+}
+const getEntryImage = async ({ entry , contentType , localeCode  }, getAsset)=>{
+    if (!contentType) {
+        return null;
+    }
+    const assetLink = contentType.fields.find(isAssetField);
+    if (!assetLink) {
+        return null;
+    }
+    const assetId = (0, _get.default)(entry.fields, [
+        assetLink.id,
+        localeCode,
+        'sys',
+        'id'
+    ]);
+    if (!assetId) {
+        return null;
+    }
+    try {
+        const asset = await getAsset(assetId);
+        const file = (0, _get.default)(asset, [
+            'fields',
+            'file',
+            localeCode
+        ]);
+        const isImage = Boolean((0, _get.default)(file, [
+            'details',
+            'image'
+        ], false));
+        return isImage ? file : null;
+    } catch (e) {
+        return null;
+    }
+};

package/dist/cjs/utils/isValidImage.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "isValidImage", {
+    enumerable: true,
+    get: function() {
+        return isValidImage;
+    }
+});
+function isValidImage(file) {
+    const validMimeTypes = [
+        'image/avif',
+        'image/bmp',
+        'image/x-windows-bmp',
+        'image/gif',
+        'image/webp',
+        'image/jpg',
+        'image/jpeg',
+        'image/pjpeg',
+        'image/x-jps',
+        'image/png',
+        'image/svg+xml'
+    ];
+    return validMimeTypes.includes(file.contentType);
+}

package/dist/cjs/utils/shortenStorageUnit.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    toLocaleString: function() {
+        return toLocaleString;
+    },
+    shortenStorageUnit: function() {
+        return shortenStorageUnit;
+    }
+});
+function toLocaleString(number) {
+    return number.toLocaleString('en-US');
+}
+function formatFloat(value, localize) {
+    return localize ? toLocaleString(value) : value.toFixed(2).replace(/\.(0)*$|0*$/, '');
+}
+function shortenStorageUnit(value, uom) {
+    if (value <= 0) {
+        return '0 B';
+    }
+    const units = [
+        'PB',
+        'TB',
+        'GB',
+        'MB',
+        'KB',
+        'B'
+    ];
+    const getBigger = (unit)=>units[units.indexOf(unit) - 1];
+    const getSmaller = (unit)=>units[units.indexOf(unit) + 1];
+    const isBiggestUnit = (unit)=>units.indexOf(unit) === 0;
+    const isSmallestUnit = (unit)=>units.indexOf(unit) === units.length - 1;
+    const reduce = (number, unit)=>{
+        if (number < 0.99 && !isSmallestUnit(unit)) {
+            return reduce(number * 1000, getSmaller(unit));
+        } else if (number >= 1000 && !isBiggestUnit(unit)) {
+            return reduce(number / 1000, getBigger(unit));
+        } else {
+            return {
+                number,
+                unit
+            };
+        }
+    };
+    const { number , unit  } = reduce(value, uom);
+    return `${formatFloat(number, false)} ${unit}`;
+}

package/dist/esm/CharCounter.js

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import tokens from '@contentful/f36-tokens';
+import { css, cx } from 'emotion';
+const styles = {
+    invalid: css({
+        color: tokens.red600
+    })
+};
+export function CharCounter(props) {
+    let count = 0;
+    if (props.value) {
+        count = props.value.length;
+    }
+    const valid = count === 0 || props.checkConstraint(count);
+    return React.createElement("span", {
+        "data-status-code": valid ? null : 'invalid-size',
+        className: cx({
+            [styles.invalid]: !valid
+        })
+    }, count, " characters");
+}

package/dist/esm/CharValidation.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export function CharValidation(props) {
+    const { constraints  } = props;
+    if (constraints.type === 'max') {
+        return React.createElement("span", null, "Maximum ", constraints.max, " characters");
+    } else if (constraints.type === 'min') {
+        return React.createElement("span", null, "Requires at least ", constraints.min, " characters");
+    } else {
+        return React.createElement("span", null, "Requires between ", constraints.min, " and ", constraints.max, " characters");
+    }
+}

package/dist/esm/FieldConnector.js

@@ -0,0 +1,113 @@
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+import * as React from 'react';
+import isEqual from 'lodash/isEqual';
+import throttle from 'lodash/throttle';
+var _React_Component;
+export class FieldConnector extends (_React_Component = React.Component) {
+    componentDidMount() {
+        const { field  } = this.props;
+        this.unsubscribeErrors = field.onSchemaErrorsChanged((errors)=>{
+            this.setState({
+                errors: errors || []
+            });
+        });
+        this.unsubscribeDisabled = field.onIsDisabledChanged((disabled)=>{
+            this.setState({
+                disabled
+            });
+        });
+        this.unsubscribeValue = field.onValueChanged((value)=>{
+            this.setState((currentState)=>{
+                const isLocalValueChange = this.props.isEqualValues(value, currentState.value);
+                const lastRemoteValue = isLocalValueChange ? currentState.lastRemoteValue : value;
+                const externalReset = currentState.externalReset + (isLocalValueChange ? 0 : 1);
+                return {
+                    value,
+                    lastRemoteValue,
+                    isLocalValueChange,
+                    externalReset
+                };
+            });
+        });
+    }
+    componentWillUnmount() {
+        if (typeof this.unsubscribeErrors === 'function') {
+            this.unsubscribeErrors();
+        }
+        if (typeof this.unsubscribeDisabled === 'function') {
+            this.unsubscribeDisabled();
+        }
+        if (typeof this.unsubscribeValue === 'function') {
+            this.unsubscribeValue();
+        }
+    }
+    render() {
+        return this.props.children({
+            ...this.state,
+            setValue: this.setValue,
+            disabled: this.props.isDisabled || this.state.disabled
+        });
+    }
+    constructor(props){
+        super(props);
+        _define_property(this, "unsubscribeErrors", null);
+        _define_property(this, "unsubscribeDisabled", null);
+        _define_property(this, "unsubscribeValue", null);
+        _define_property(this, "setValue", async (value)=>{
+            if (this.props.isEmptyValue(value ?? null)) {
+                this.setState({
+                    value: undefined
+                });
+            } else {
+                this.setState({
+                    value
+                });
+            }
+            await this.triggerSetValueCallbacks(value);
+        });
+        _define_property(this, "triggerSetValueCallbacks", throttle((value)=>{
+            return new Promise((resolve, reject)=>{
+                if (this.props.isEmptyValue(value ?? null)) {
+                    this.props.field.removeValue().then(resolve).catch(reject);
+                } else {
+                    this.props.field.setValue(value).then(resolve).catch(reject);
+                }
+            });
+        }, this.props.throttle, {
+            leading: this.props.throttle === 0
+        }));
+        const initialValue = props.field.getValue();
+        this.state = {
+            isLocalValueChange: false,
+            externalReset: 0,
+            value: initialValue,
+            lastRemoteValue: initialValue,
+            disabled: props.isInitiallyDisabled ?? false,
+            errors: []
+        };
+    }
+}
+_define_property(FieldConnector, "defaultProps", {
+    children: ()=>{
+        return null;
+    },
+    isEmptyValue: (value)=>{
+        return value === null || value === '';
+    },
+    isEqualValues: (value1, value2)=>{
+        return isEqual(value1, value2);
+    },
+    throttle: 300
+});