@atlaskit/editor-core 191.0.0 → 191.0.3

package/dist/es2019/plugins/extension/ui/ConfigPanel/Fields/String.js

@@ -1,67 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { Fragment } from 'react';
-import { Field } from '@atlaskit/form';
-import TextArea from '@atlaskit/textarea';
-import TextField from '@atlaskit/textfield';
-import FieldMessages from '../FieldMessages';
-import { validate } from '../utils';
-export default function String({
-  name,
-  field,
-  autoFocus,
-  onFieldChange,
-  placeholder
-}) {
-  const {
-    label,
-    description,
-    defaultValue,
-    isRequired
-  } = field;
-  return /*#__PURE__*/React.createElement(Field, {
-    name: name,
-    label: label,
-    defaultValue: defaultValue || '',
-    isRequired: isRequired,
-    validate: value => validate(field, value || ''),
-    testId: `config-panel-string-${name}`
-  }, ({
-    fieldProps,
-    error,
-    meta
-  }) => {
-    if (field.style === 'multiline') {
-      const {
-        onChange,
-        ...restFieldProps
-      } = fieldProps;
-      const {
-        options
-      } = field;
-      return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(TextArea, _extends({}, restFieldProps, options, {
-        onChange: e => onChange(e.currentTarget.value),
-        onBlur: () => {
-          fieldProps.onBlur();
-          onFieldChange(name, meta.dirty);
-        },
-        placeholder: placeholder,
-        "data-testid": `config-panel-textarea-${name}`
-      })), /*#__PURE__*/React.createElement(FieldMessages, {
-        error: error,
-        description: description
-      }));
-    }
-    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(TextField, _extends({}, fieldProps, {
-      type: "text",
-      autoFocus: autoFocus,
-      onBlur: () => {
-        fieldProps.onBlur();
-        onFieldChange(name, meta.dirty);
-      },
-      placeholder: placeholder
-    })), /*#__PURE__*/React.createElement(FieldMessages, {
-      error: error,
-      description: description
-    }));
-  });
-}

package/dist/es2019/plugins/extension/ui/ConfigPanel/Fields/TabGroup.js

@@ -1,56 +0,0 @@
-/** @jsx jsx */
-import React, { useState } from 'react';
-import { css, jsx } from '@emotion/react';
-import { injectIntl } from 'react-intl-next';
-import Tabs, { Tab, TabList, TabPanel } from '@atlaskit/tabs';
-const tabWrapper = css`
-  // increase specificity to make sure the tab style is overridden
-  &&& [role='tabpanel'][tabindex] {
-    padding: 0;
-  }
-
-  &&& [role='tablist']::before {
-    left: 0;
-    right: 0;
-  }
-`;
-const panelWrapper = css`
-  flex-grow: 1;
-  max-width: 100%;
-`;
-const TabGroupImpl = props => {
-  const {
-    field,
-    renderPanel
-  } = props;
-  const {
-    fields
-  } = field;
-  const [activeTab, setActiveTab] = useState(() => {
-    const activeTabName = field.defaultTab || fields[0].name;
-    const index = fields.findIndex(f => f.name === activeTabName);
-    return Math.max(index, 0);
-  });
-  const onChange = React.useCallback(index => {
-    setActiveTab(index);
-  }, [setActiveTab]);
-  return jsx("div", {
-    css: tabWrapper
-  }, jsx(Tabs, {
-    id: `configPanelTabs-${field.name}`,
-    onChange: onChange,
-    selected: activeTab
-  }, jsx(TabList, null, fields.map(({
-    name,
-    label
-  }) => jsx(Tab, {
-    key: `tab-${name}`
-  }, label))), fields.map(field => jsx(TabPanel, {
-    key: `panel-${field.name}`
-  }, jsx("div", {
-    css: panelWrapper
-  }, renderPanel(field))))));
-};
-TabGroupImpl.displayName = 'TabGroup';
-const TabGroup = injectIntl(TabGroupImpl);
-export default TabGroup;

package/dist/es2019/plugins/extension/ui/ConfigPanel/Fields/UnhandledType.js

@@ -1,11 +0,0 @@
-import React, { useEffect } from 'react';
-import { HelperMessage } from '@atlaskit/form';
-export default function ({
-  errorMessage
-}) {
-  useEffect(() => {
-    // eslint-disable-next-line no-console
-    console.error(errorMessage);
-  }, [errorMessage]);
-  return /*#__PURE__*/React.createElement(HelperMessage, null, errorMessage);
-}

package/dist/es2019/plugins/extension/ui/ConfigPanel/Fields/UserSelect.js

@@ -1,194 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { useEffect, useState } from 'react';
-import { Field } from '@atlaskit/form';
-import SmartUserPicker, { hydrateDefaultValues } from '@atlaskit/smart-user-picker';
-import { getUserFieldContextProvider } from '@atlaskit/editor-common/extensions';
-import UnhandledType from './UnhandledType';
-import { validate } from '../utils';
-import FieldMessages from '../FieldMessages';
-function makeCompat(defaultValue) {
-  if (!defaultValue) {
-    return null;
-  }
-  if (Array.isArray(defaultValue)) {
-    return defaultValue.map(id => ({
-      type: 'user',
-      id
-    }));
-  }
-  return {
-    type: 'user',
-    id: defaultValue
-  };
-}
-function makeSafe(value) {
-  if (!value) {
-    return null;
-  }
-  if (Array.isArray(value)) {
-    const ids = [];
-    for (const {
-      id
-    } of value) {
-      ids.push(id);
-    }
-    return ids;
-  }
-  return value.id;
-}
-const isOptionData = value => {
-  if (!value) {
-    return false;
-  }
-  return (Array.isArray(value) ? value : [value]).every(item => 'name' in item);
-};
-function SafeSmartUserPicker({
-  context,
-  field,
-  formFieldProps,
-  autoFocus,
-  onBlur,
-  onChange
-}) {
-  const [unsafeValue, setUnsafeValue] = useState(null);
-  const {
-    siteId,
-    principalId,
-    fieldId,
-    productKey,
-    containerId,
-    objectId,
-    childObjectId,
-    productAttributes,
-    includeUsers = true
-  } = context;
-  const {
-    value: safeValue,
-    ...formFieldPropsRest
-  } = formFieldProps;
-  const {
-    isMultiple,
-    placeholder
-  } = field;
-  function onChangeUnsafe(newValue) {
-    setUnsafeValue(newValue);
-    onChange(makeSafe(newValue));
-  }
-  useEffect(() => {
-    let cancel = false;
-    async function hydrate() {
-      const hydrated = await hydrateDefaultValues(undefined,
-      // no need to override baseUrl
-      makeCompat(safeValue), productKey);
-      if (cancel || !isOptionData(hydrated)) {
-        return;
-      }
-      setUnsafeValue(hydrated);
-    }
-    hydrate();
-    return () => {
-      cancel = true;
-    };
-  }, [safeValue, productKey]);
-  return /*#__PURE__*/React.createElement(SmartUserPicker, _extends({}, formFieldPropsRest, {
-    onChange: onChangeUnsafe,
-    autoFocus: autoFocus,
-    onBlur: onBlur,
-    maxOptions: 10,
-    isClearable: true,
-    isMulti: isMultiple,
-    includeUsers: includeUsers,
-    includeGroups: false,
-    includeTeams: false,
-    fieldId: fieldId,
-    principalId: principalId,
-    siteId: siteId,
-    productKey: productKey,
-    objectId: objectId,
-    containerId: containerId,
-    childObjectId: childObjectId,
-    placeholder: placeholder,
-    productAttributes: productAttributes,
-    value: unsafeValue,
-    width: "100%"
-  }));
-}
-export default function UserSelect({
-  name,
-  autoFocus,
-  extensionManifest,
-  field,
-  onFieldChange
-}) {
-  const [context, setContext] = useState({});
-  const {
-    siteId,
-    principalId,
-    fieldId,
-    productKey
-  } = context;
-  const {
-    label,
-    defaultValue,
-    description,
-    isRequired,
-    options
-  } = field;
-  const {
-    type
-  } = options.provider;
-  useEffect(() => {
-    let cancel = false;
-    async function fetchContext() {
-      try {
-        const context = await (await getUserFieldContextProvider(extensionManifest, field.options.provider))();
-        if (cancel) {
-          return;
-        }
-        setContext(context);
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.error(e);
-      }
-    }
-    fetchContext();
-    return () => {
-      cancel = true;
-    };
-  }, [extensionManifest, field.options.provider]);
-  return /*#__PURE__*/React.createElement(Field, {
-    name: name,
-    label: label,
-    isRequired: isRequired,
-    defaultValue: defaultValue,
-    validate: value => validate(field, value),
-    testId: `config-panel-user-select-${name}`
-  }, ({
-    fieldProps,
-    error
-  }) => {
-    // if any of these don't exists, the provider is missing
-    if (!siteId || !principalId || !fieldId || !productKey) {
-      return /*#__PURE__*/React.createElement(UnhandledType, {
-        key: name,
-        field: field,
-        errorMessage: `Field "${name}" can't be renderered. Missing provider for "${type}".`
-      });
-    }
-    function onChange(newValue) {
-      fieldProps.onChange(newValue);
-      onFieldChange(name, true);
-    }
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SafeSmartUserPicker, {
-      context: context,
-      field: field,
-      formFieldProps: fieldProps,
-      autoFocus: autoFocus || false,
-      onBlur: () => onFieldChange(name, true),
-      onChange: onChange
-    }), /*#__PURE__*/React.createElement(FieldMessages, {
-      error: error,
-      description: description
-    }));
-  });
-}

package/dist/es2019/plugins/extension/ui/ConfigPanel/Fields/common/RequiredIndicator.js

@@ -1,5 +0,0 @@
-import { css } from '@emotion/react';
-import { R500 } from '@atlaskit/theme/colors';
-export const requiredIndicator = css`
-  color: ${`var(--ds-text-danger, ${R500})`};
-`;

package/dist/es2019/plugins/extension/ui/ConfigPanel/FormContent.js

@@ -1,225 +0,0 @@
-import React from 'react';
-import { isFieldset } from '@atlaskit/editor-common/extensions';
-import ColorPicker from './Fields/ColorPicker';
-import Boolean from './Fields/Boolean';
-import CustomSelect from './Fields/CustomSelect';
-import Date from './Fields/Date';
-import DateRange from './Fields/DateRange';
-import Enum from './Fields/Enum';
-import Fieldset from './Fields/Fieldset';
-import Number from './Fields/Number';
-import String from './Fields/String';
-import UnhandledType from './Fields/UnhandledType';
-import UserSelect from './Fields/UserSelect';
-import Expand from './Fields/Expand';
-import TabGroup from './Fields/TabGroup';
-import RemovableField from './NestedForms/RemovableField';
-import { getSafeParentedName } from './utils';
-import { FormErrorBoundary } from './FormErrorBoundary';
-export function FieldComponent({
-  field,
-  parameters,
-  parentName,
-  extensionManifest,
-  firstVisibleFieldName,
-  onFieldChange,
-  featureFlags
-}) {
-  var _parameters$errors;
-  const {
-    name,
-    type
-  } = field;
-  const autoFocus = name === firstVisibleFieldName;
-  const defaultValue = parameters[name];
-  const error = (_parameters$errors = parameters.errors) === null || _parameters$errors === void 0 ? void 0 : _parameters$errors[name];
-  const parentedName = getSafeParentedName(name, parentName);
-  const fieldDefaultValue = field.type === 'enum' ? field.defaultValue : undefined;
-  if (name in parameters && !isFieldset(field)) {
-    field = {
-      ...field,
-      ...(defaultValue != null ? {
-        defaultValue
-      } : {})
-    };
-  }
-  switch (field.type) {
-    case 'string':
-      return /*#__PURE__*/React.createElement(String, {
-        name: parentedName,
-        field: field,
-        autoFocus: autoFocus,
-        onFieldChange: onFieldChange,
-        placeholder: field.placeholder
-      });
-    case 'number':
-      return /*#__PURE__*/React.createElement(Number, {
-        name: parentedName,
-        field: field,
-        autoFocus: autoFocus,
-        onFieldChange: onFieldChange,
-        placeholder: field.placeholder
-      });
-    case 'boolean':
-      return /*#__PURE__*/React.createElement(Boolean, {
-        name: parentedName,
-        field: field,
-        onFieldChange: onFieldChange
-      });
-    case 'color':
-      return /*#__PURE__*/React.createElement(ColorPicker, {
-        name: parentedName,
-        field: field,
-        onFieldChange: onFieldChange,
-        featureFlags: featureFlags
-      });
-    case 'date':
-      return /*#__PURE__*/React.createElement(Date, {
-        name: parentedName,
-        field: field,
-        autoFocus: autoFocus,
-        onFieldChange: onFieldChange,
-        placeholder: field.placeholder
-      });
-    case 'date-range':
-      return /*#__PURE__*/React.createElement(DateRange, {
-        name: parentedName,
-        field: field,
-        autoFocus: autoFocus,
-        onFieldChange: onFieldChange
-      });
-    case 'enum':
-      return /*#__PURE__*/React.createElement(Enum, {
-        name: parentedName,
-        field: field,
-        autoFocus: autoFocus,
-        onFieldChange: onFieldChange,
-        fieldDefaultValue: fieldDefaultValue
-      });
-    case 'custom':
-      return /*#__PURE__*/React.createElement(CustomSelect, {
-        name: parentedName,
-        field: field,
-        extensionManifest: extensionManifest,
-        placeholder: field.placeholder,
-        autoFocus: autoFocus,
-        onFieldChange: onFieldChange,
-        parameters: parameters
-      });
-    case 'fieldset':
-      return /*#__PURE__*/React.createElement(Fieldset, {
-        name: parentedName,
-        field: field,
-        firstVisibleFieldName: firstVisibleFieldName,
-        onFieldChange: onFieldChange,
-        extensionManifest: extensionManifest,
-        parameters: defaultValue || {},
-        error: error,
-        formComponent: FormContent
-      });
-    case 'user':
-      return /*#__PURE__*/React.createElement(UserSelect, {
-        name: parentedName,
-        field: field,
-        autoFocus: name === firstVisibleFieldName,
-        extensionManifest: extensionManifest,
-        onFieldChange: onFieldChange
-      });
-    case 'expand':
-      {
-        // if expand is under a tab with hasGroupedValues=true
-        const resolvedParentName = [parentName, field.hasGroupedValues ? field.name : undefined].filter(val => !!val).join('.') || undefined;
-        const resolvedParameters = !field.hasGroupedValues ? parameters : parameters[field.name] || {};
-        return /*#__PURE__*/React.createElement(Expand, {
-          field: field,
-          isExpanded: field.isExpanded
-        }, /*#__PURE__*/React.createElement(FormContent, {
-          parentName: resolvedParentName,
-          fields: field.fields,
-          parameters: resolvedParameters,
-          onFieldChange: onFieldChange,
-          extensionManifest: extensionManifest,
-          featureFlags: featureFlags
-        }));
-      }
-    case 'tab-group':
-      {
-        const tabGroupField = field;
-        const tabGroupParams = tabGroupField.hasGroupedValues ? parameters[tabGroupField.name] || {} : parameters;
-        const renderPanel = tabField => {
-          const parentName = [tabGroupField.hasGroupedValues ? tabGroupField.name : undefined, tabField.hasGroupedValues ? tabField.name : undefined].filter(val => !!val).join('.') || undefined;
-          const tabParameters = tabField.hasGroupedValues ? tabGroupParams[tabField.name] || {} : tabGroupParams;
-          return /*#__PURE__*/React.createElement(FormContent, {
-            parentName: parentName,
-            fields: tabField.fields,
-            parameters: tabParameters,
-            onFieldChange: onFieldChange,
-            extensionManifest: extensionManifest,
-            featureFlags: featureFlags
-          });
-        };
-        return /*#__PURE__*/React.createElement(TabGroup, {
-          field: tabGroupField,
-          renderPanel: renderPanel
-        });
-      }
-    default:
-      return /*#__PURE__*/React.createElement(UnhandledType, {
-        field: field,
-        errorMessage: `Field "${name}" of type "${type}" not supported`
-      });
-  }
-}
-function Hidden({
-  children
-}) {
-  return /*#__PURE__*/React.createElement("div", {
-    style: {
-      display: 'none'
-    }
-  }, children);
-}
-export default function FormContent({
-  fields,
-  parentName,
-  parameters,
-  extensionManifest,
-  canRemoveFields,
-  onClickRemove,
-  onFieldChange,
-  firstVisibleFieldName,
-  contextIdentifierProvider,
-  featureFlags
-}) {
-  return /*#__PURE__*/React.createElement(FormErrorBoundary, {
-    contextIdentifierProvider: contextIdentifierProvider,
-    extensionKey: extensionManifest.key,
-    fields: fields
-  }, fields.map(field => {
-    let fieldElement = /*#__PURE__*/React.createElement(FieldComponent, {
-      field: field,
-      parameters: parameters || {},
-      parentName: parentName,
-      extensionManifest: extensionManifest,
-      firstVisibleFieldName: firstVisibleFieldName,
-      onFieldChange: onFieldChange,
-      featureFlags: featureFlags
-    });
-
-    // only to be supported by String fields at this time
-    if ('isHidden' in field && field.isHidden) {
-      fieldElement = /*#__PURE__*/React.createElement(Hidden, null, fieldElement);
-    }
-    const {
-      name,
-      type
-    } = field;
-    return /*#__PURE__*/React.createElement(RemovableField, {
-      key: name,
-      name: name,
-      canRemoveField: canRemoveFields && !field.isRequired,
-      onClickRemove: onClickRemove,
-      className: `field-wrapper-${type}`
-    }, fieldElement);
-  }));
-}

package/dist/es2019/plugins/extension/ui/ConfigPanel/FormErrorBoundary.js

@@ -1,99 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { injectIntl } from 'react-intl-next';
-import SectionMessage from '@atlaskit/section-message';
-import { withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE, editorAnalyticsChannel } from '@atlaskit/editor-common/analytics';
-import { messages } from './messages';
-class FormErrorBoundaryInner extends React.Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "state", {
-      error: undefined
-    });
-    _defineProperty(this, "getProductName", async () => {
-      const {
-        contextIdentifierProvider
-      } = this.props;
-      if (contextIdentifierProvider) {
-        const context = await contextIdentifierProvider;
-        if (context.product) {
-          return context.product;
-        }
-      }
-      return 'atlaskit';
-    });
-    _defineProperty(this, "fireAnalytics", analyticsErrorPayload => {
-      const {
-        createAnalyticsEvent,
-        extensionKey,
-        fields
-      } = this.props;
-      this.getProductName().then(product => {
-        var _window, _window$navigator;
-        if (!createAnalyticsEvent) {
-          // eslint-disable-next-line no-console
-          console.error('ConfigPanel FormErrorBoundary: Missing `createAnalyticsEvent`', {
-            channel: editorAnalyticsChannel,
-            product,
-            error: analyticsErrorPayload
-          });
-          return;
-        }
-        const {
-          error,
-          errorInfo,
-          errorStack
-        } = analyticsErrorPayload;
-        const payload = {
-          action: ACTION.ERRORED,
-          actionSubject: ACTION_SUBJECT.CONFIG_PANEL,
-          eventType: EVENT_TYPE.UI,
-          attributes: {
-            product,
-            browserInfo: ((_window = window) === null || _window === void 0 ? void 0 : (_window$navigator = _window.navigator) === null || _window$navigator === void 0 ? void 0 : _window$navigator.userAgent) || 'unknown',
-            extensionKey,
-            fields: JSON.stringify(fields),
-            error,
-            errorInfo,
-            errorStack
-          }
-        };
-        createAnalyticsEvent(payload).fire(editorAnalyticsChannel);
-      }).catch(e => {
-        // eslint-disable-next-line no-console
-        console.error('Failed to resolve product name from contextIdentifierProvider.', e);
-      });
-    });
-  }
-  componentDidCatch(error, errorInfo) {
-    this.setState({
-      error
-    }, () => {
-      // Log the error
-      this.fireAnalytics({
-        error: error.toString(),
-        errorInfo,
-        errorStack: error.stack
-      });
-    });
-  }
-  render() {
-    const {
-      intl
-    } = this.props;
-    const {
-      error
-    } = this.state;
-    if (!error) {
-      return this.props.children;
-    }
-    return /*#__PURE__*/React.createElement(SectionMessage, {
-      title: intl.formatMessage(messages.errorBoundaryTitle),
-      appearance: "error"
-    }, /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("i", null, error.message)), /*#__PURE__*/React.createElement("p", null, intl.formatMessage(messages.errorBoundaryNote)));
-  }
-}
-export const FormErrorBoundaryImpl = injectIntl(FormErrorBoundaryInner);
-export const FormErrorBoundary = withAnalyticsContext()(withAnalyticsEvents()(FormErrorBoundaryImpl));
-FormErrorBoundary.displayName = 'FormErrorBoundary';