@atlaskit/editor-plugin-extension
Version:
editor-plugin-extension plugin for @atlaskit/editor-core
247 lines (245 loc) • 10.7 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.FieldComponent = FieldComponent;
exports.default = FormContent;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _extensions = require("@atlaskit/editor-common/extensions");
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
var _Boolean = _interopRequireDefault(require("./Fields/Boolean"));
var _ColorPicker = _interopRequireDefault(require("./Fields/ColorPicker"));
var _CustomSelect = _interopRequireDefault(require("./Fields/CustomSelect"));
var _Date = _interopRequireDefault(require("./Fields/Date"));
var _DateRange = _interopRequireDefault(require("./Fields/DateRange"));
var _Enum = _interopRequireDefault(require("./Fields/Enum"));
var _Expand = _interopRequireDefault(require("./Fields/Expand"));
var _Fieldset = _interopRequireDefault(require("./Fields/Fieldset"));
var _Number = _interopRequireDefault(require("./Fields/Number"));
var _String = _interopRequireDefault(require("./Fields/String"));
var _TabGroup = _interopRequireDefault(require("./Fields/TabGroup"));
var _UnhandledType = _interopRequireDefault(require("./Fields/UnhandledType"));
var _UserSelect = _interopRequireDefault(require("./Fields/UserSelect"));
var _FormErrorBoundary = require("./FormErrorBoundary");
var _RemovableField = _interopRequireDefault(require("./NestedForms/RemovableField"));
var _utils = require("./utils");
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function FieldComponent(_ref) {
var _parameters$errors;
var field = _ref.field,
parameters = _ref.parameters,
parentName = _ref.parentName,
extensionManifest = _ref.extensionManifest,
firstVisibleFieldName = _ref.firstVisibleFieldName,
onFieldChange = _ref.onFieldChange,
featureFlags = _ref.featureFlags;
var _field = field,
name = _field.name,
type = _field.type;
var autoFocus = name === firstVisibleFieldName;
var defaultValue = parameters[name];
var error = (_parameters$errors = parameters.errors) === null || _parameters$errors === void 0 ? void 0 : _parameters$errors[name];
var parentedName = (0, _utils.getSafeParentedName)(name, parentName);
var fieldDefaultValue = field.type === 'enum' ? field.defaultValue : undefined;
if (name in parameters && !(0, _extensions.isFieldset)(field)) {
field = _objectSpread(_objectSpread({}, field), defaultValue != null ? {
defaultValue: defaultValue
} : {});
}
switch (field.type) {
case 'string':
return /*#__PURE__*/_react.default.createElement(_String.default, {
name: parentedName,
field: field,
autoFocus: autoFocus,
onFieldChange: onFieldChange,
placeholder: field.placeholder
});
case 'number':
return /*#__PURE__*/_react.default.createElement(_Number.default, {
name: parentedName,
field: field,
autoFocus: autoFocus,
onFieldChange: onFieldChange,
placeholder: field.placeholder
});
case 'boolean':
return /*#__PURE__*/_react.default.createElement(_Boolean.default, {
name: parentedName,
field: field,
onFieldChange: onFieldChange
});
case 'color':
return /*#__PURE__*/_react.default.createElement(_ColorPicker.default, {
name: parentedName,
field: field,
onFieldChange: onFieldChange,
featureFlags: featureFlags
});
case 'date':
return /*#__PURE__*/_react.default.createElement(_Date.default, {
name: parentedName,
field: field,
autoFocus: autoFocus,
onFieldChange: onFieldChange,
placeholder: field.placeholder
});
case 'date-range':
return /*#__PURE__*/_react.default.createElement(_DateRange.default, {
name: parentedName,
field: field,
autoFocus: autoFocus,
onFieldChange: onFieldChange
});
case 'enum':
return /*#__PURE__*/_react.default.createElement(_Enum.default, {
name: parentedName,
field: field,
autoFocus: autoFocus,
onFieldChange: onFieldChange,
fieldDefaultValue: fieldDefaultValue
});
case 'custom':
return /*#__PURE__*/_react.default.createElement(_CustomSelect.default, {
name: parentedName,
field: field,
extensionManifest: extensionManifest,
placeholder: field.placeholder,
autoFocus: autoFocus,
onFieldChange: onFieldChange,
parameters: parameters
});
case 'fieldset':
return /*#__PURE__*/_react.default.createElement(_Fieldset.default, {
name: parentedName,
field: field,
firstVisibleFieldName: firstVisibleFieldName,
onFieldChange: onFieldChange,
extensionManifest: extensionManifest,
parameters: defaultValue || {},
error: error,
formComponent: FormContent
});
case 'user':
return /*#__PURE__*/_react.default.createElement(_UserSelect.default, {
name: parentedName,
field: field,
autoFocus: name === firstVisibleFieldName,
extensionManifest: extensionManifest,
onFieldChange: onFieldChange
});
case 'expand':
{
// if expand is under a tab with hasGroupedValues=true
var resolvedParentName = [parentName, field.hasGroupedValues ? field.name : undefined].filter(function (val) {
return !!val;
}).join('.') || undefined;
var resolvedParameters = !field.hasGroupedValues ? parameters : parameters[field.name] || {};
return /*#__PURE__*/_react.default.createElement(_Expand.default, {
field: field,
isExpanded: field.isExpanded
}, /*#__PURE__*/_react.default.createElement(FormContent, {
parentName: resolvedParentName,
fields: field.fields,
parameters: resolvedParameters,
onFieldChange: onFieldChange,
extensionManifest: extensionManifest,
featureFlags: featureFlags,
isDisabled: field.isDisabled
}));
}
case 'tab-group':
{
var tabGroupField = field;
var tabGroupParams = tabGroupField.hasGroupedValues ? parameters[tabGroupField.name] || {} : parameters;
var renderPanel = function renderPanel(tabField) {
var parentName = [tabGroupField.hasGroupedValues ? tabGroupField.name : undefined, tabField.hasGroupedValues ? tabField.name : undefined].filter(function (val) {
return !!val;
}).join('.') || undefined;
var tabParameters = tabField.hasGroupedValues ? tabGroupParams[tabField.name] || {} : tabGroupParams;
return /*#__PURE__*/_react.default.createElement(FormContent, {
parentName: parentName,
fields: tabField.fields,
parameters: tabParameters,
onFieldChange: onFieldChange,
extensionManifest: extensionManifest,
featureFlags: featureFlags,
isDisabled: field.isDisabled
});
};
return /*#__PURE__*/_react.default.createElement(_TabGroup.default, {
field: tabGroupField,
renderPanel: renderPanel
});
}
default:
return /*#__PURE__*/_react.default.createElement(_UnhandledType.default, {
field: field,
errorMessage: "Field \"".concat(name, "\" of type \"").concat(type, "\" not supported")
});
}
}
function Hidden(_ref2) {
var children = _ref2.children;
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
return /*#__PURE__*/_react.default.createElement("div", {
style: {
display: 'none'
}
}, children);
}
function FormContent(_ref3) {
var fields = _ref3.fields,
parentName = _ref3.parentName,
parameters = _ref3.parameters,
extensionManifest = _ref3.extensionManifest,
canRemoveFields = _ref3.canRemoveFields,
onClickRemove = _ref3.onClickRemove,
onFieldChange = _ref3.onFieldChange,
firstVisibleFieldName = _ref3.firstVisibleFieldName,
contextIdentifierProvider = _ref3.contextIdentifierProvider,
featureFlags = _ref3.featureFlags,
isDisabled = _ref3.isDisabled;
var mappedFields = fields;
if ((0, _experiments.editorExperiment)('platform_editor_offline_editing_web', true)) {
mappedFields = fields.map(function (field) {
var _field$isDisabled;
return _objectSpread(_objectSpread({}, field), {}, {
isDisabled: (_field$isDisabled = field.isDisabled) !== null && _field$isDisabled !== void 0 ? _field$isDisabled : isDisabled
});
});
}
return /*#__PURE__*/_react.default.createElement(_FormErrorBoundary.FormErrorBoundary, {
contextIdentifierProvider: contextIdentifierProvider,
extensionKey: extensionManifest.key,
fields: mappedFields
}, mappedFields.map(function (field) {
var fieldElement = /*#__PURE__*/_react.default.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.default.createElement(Hidden, null, fieldElement);
}
var name = field.name,
type = field.type;
return /*#__PURE__*/_react.default.createElement(_RemovableField.default, {
key: name,
name: name,
canRemoveField: canRemoveFields && !field.isRequired,
onClickRemove: onClickRemove
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
,
className: "field-wrapper-".concat(type)
}, fieldElement);
}));
}