@atlaskit/editor-core 190.2.2 → 191.0.0

package/dist/cjs/plugins/collab-edit/ui/avatars.js

@@ -1,46 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Avatars = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-var _avatarGroup = _interopRequireDefault(require("@atlaskit/avatar-group"));
-var _styles = require("./styles");
-var _toAvatar = _interopRequireDefault(require("./to-avatar"));
-var _utils = require("../utils");
-/** @jsx jsx */
-
-var Avatars = exports.Avatars = /*#__PURE__*/_react.default.memo(function (props) {
-  var sessionId = props.sessionId,
-    editorView = props.editorView,
-    featureFlags = props.featureFlags;
-  var participants = props.participants.toArray();
-  var avatars = participants.sort(function (p) {
-    return p.sessionId === sessionId ? -1 : 1;
-  }).map(_toAvatar.default);
-  if (!avatars.length) {
-    return null;
-  }
-  return (0, _react2.jsx)("div", {
-    css: _styles.avatarContainer
-  }, (0, _react2.jsx)(_avatarGroup.default, {
-    appearance: "stack",
-    size: "medium",
-    data: avatars,
-    maxCount: 3,
-    onAvatarClick: function onAvatarClick(_event, _analytics, index) {
-      if (!editorView) {
-        return;
-      }
-      var allowCollabAvatarScroll = featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.collabAvatarScroll;
-
-      // user does not need to scroll to their own position (index 0)
-      if (allowCollabAvatarScroll && index > 0) {
-        (0, _utils.scrollToCollabCursor)(editorView, participants, props.sessionId, index, props.editorAnalyticsAPI);
-      }
-    }
-  }), props.children);
-});

package/dist/cjs/plugins/collab-edit/utils.js

@@ -1,156 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof3 = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.scrollToCollabCursor = exports.replaceDocument = exports.getPositionOfTelepointer = exports.getAvatarColor = exports.findPointers = exports.createTelepointers = exports.colors = void 0;
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-var _state = require("@atlaskit/editor-prosemirror/state");
-var _view = require("@atlaskit/editor-prosemirror/view");
-var themeColors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
-var _adfSchema = require("@atlaskit/adf-schema");
-var _utils = require("@atlaskit/editor-common/utils");
-var _analytics = require("@atlaskit/editor-common/analytics");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(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; }
-// TODO: https://product-fabric.atlassian.net/browse/DSP-7269
-/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-var colors = exports.colors = [themeColors.R100, themeColors.R300, themeColors.R500, themeColors.Y100, themeColors.Y300, themeColors.Y500, themeColors.G100, themeColors.G300, themeColors.G500, themeColors.T100, themeColors.T300, themeColors.T500, themeColors.B100, themeColors.B300, themeColors.B500, themeColors.P100, themeColors.P300, themeColors.P500, themeColors.N70, themeColors.N200, themeColors.N800].map(function (solid) {
-  return {
-    solid: solid,
-    selection: (0, _adfSchema.hexToRgba)(solid, 0.2)
-  };
-});
-/* eslint-enable @atlaskit/design-system/ensure-design-token-usage */
-
-var getAvatarColor = exports.getAvatarColor = function getAvatarColor(str) {
-  var hash = 0;
-  for (var i = 0; i < str.length; i++) {
-    /* eslint-disable no-bitwise */
-    hash = (hash << 5) - hash + str.charCodeAt(i);
-    hash = hash & hash;
-    /* eslint-enable no-bitwise */
-  }
-
-  var index = Math.abs(hash) % colors.length;
-  return {
-    index: index,
-    color: colors[index]
-  };
-};
-var findPointers = exports.findPointers = function findPointers(id, decorations) {
-  return decorations.find().reduce(function (arr, deco) {
-    return deco.spec.pointer.sessionId === id ? arr.concat(deco) : arr;
-  }, []);
-};
-function style(options) {
-  var color = options && options.color || 'black';
-  return "border-left: 1px solid ".concat(color, "; border-right: 1px solid ").concat(color, "; margin-right: -2px;");
-}
-var createTelepointers = exports.createTelepointers = function createTelepointers(from, to, sessionId, isSelection, initial) {
-  var decorations = [];
-  var avatarColor = getAvatarColor(sessionId);
-  var color = avatarColor.index.toString();
-  if (isSelection) {
-    var className = "telepointer color-".concat(color, " telepointer-selection");
-    decorations.push(_view.Decoration.inline(from, to, {
-      class: className,
-      'data-initial': initial
-    }, {
-      pointer: {
-        sessionId: sessionId
-      }
-    }));
-  }
-  var spaceJoinerBefore = document.createElement('span');
-  spaceJoinerBefore.textContent = _utils.ZERO_WIDTH_JOINER;
-  var spaceJoinerAfter = document.createElement('span');
-  spaceJoinerAfter.textContent = _utils.ZERO_WIDTH_JOINER;
-  var cursor = document.createElement('span');
-  cursor.textContent = _utils.ZERO_WIDTH_JOINER;
-  cursor.className = "telepointer color-".concat(color, " telepointer-selection-badge");
-  cursor.style.cssText = "".concat(style({
-    color: avatarColor.color.solid
-  }), ";");
-  cursor.setAttribute('data-initial', initial);
-  return decorations.concat(_view.Decoration.widget(to, spaceJoinerAfter, {
-    pointer: {
-      sessionId: sessionId
-    },
-    key: "telepointer-".concat(sessionId, "-zero")
-  })).concat(_view.Decoration.widget(to, cursor, {
-    pointer: {
-      sessionId: sessionId
-    },
-    key: "telepointer-".concat(sessionId)
-  })).concat(_view.Decoration.widget(to, spaceJoinerBefore, {
-    pointer: {
-      sessionId: sessionId
-    },
-    key: "telepointer-".concat(sessionId, "-zero")
-  }));
-};
-var replaceDocument = exports.replaceDocument = function replaceDocument(doc, state, version, options, reserveCursor) {
-  var schema = state.schema,
-    tr = state.tr;
-  var content = (doc.content || []).map(function (child) {
-    return schema.nodeFromJSON(child);
-  });
-  var hasContent = !!content.length;
-  if (hasContent) {
-    tr.setMeta('addToHistory', false);
-    tr.replaceWith(0, state.doc.nodeSize - 2, content);
-    var selection = state.selection;
-    if (reserveCursor) {
-      // If the cursor is still in the range of the new document,
-      // keep where it was.
-      if (selection.to < tr.doc.content.size - 2) {
-        var $from = tr.doc.resolve(selection.from);
-        var $to = tr.doc.resolve(selection.to);
-        var newselection = new _state.TextSelection($from, $to);
-        tr.setSelection(newselection);
-      }
-    } else {
-      tr.setSelection(_state.Selection.atStart(tr.doc));
-    }
-    tr.setMeta('replaceDocument', true);
-    if ((0, _typeof2.default)(version) !== undefined && options && options.useNativePlugin) {
-      var collabState = {
-        version: version,
-        unconfirmed: []
-      };
-      tr.setMeta('collab$', collabState);
-    }
-  }
-  return tr;
-};
-var scrollToCollabCursor = exports.scrollToCollabCursor = function scrollToCollabCursor(editorView, participants, sessionId, index, editorAnalyticsAPI) {
-  var selectedUser = participants[index];
-  if (selectedUser && selectedUser.cursorPos !== undefined && selectedUser.sessionId !== sessionId) {
-    var state = editorView.state;
-    var tr = state.tr;
-    var analyticsPayload = {
-      action: _analytics.ACTION.MATCHED,
-      actionSubject: _analytics.ACTION_SUBJECT.SELECTION,
-      eventType: _analytics.EVENT_TYPE.TRACK
-    };
-    tr.setSelection(_state.Selection.near(tr.doc.resolve(selectedUser.cursorPos)));
-    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsPayload)(tr);
-    tr.scrollIntoView();
-    editorView.dispatch(tr);
-    if (!editorView.hasFocus()) {
-      editorView.focus();
-    }
-  }
-};
-var getPositionOfTelepointer = exports.getPositionOfTelepointer = function getPositionOfTelepointer(sessionId, decorationSet) {
-  var scrollPosition;
-  decorationSet.find().forEach(function (deco) {
-    if (deco.type.spec.pointer.sessionId === sessionId) {
-      scrollPosition = deco.from;
-    }
-  });
-  return scrollPosition;
-};

package/dist/cjs/plugins/extension/nodeviews/extension.js

@@ -1,91 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ExtensionNode = void 0;
-exports.default = ExtensionNodeView;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _react = _interopRequireDefault(require("react"));
-var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
-var _Extension = _interopRequireDefault(require("../ui/Extension"));
-var _ExtensionNodeWrapper = _interopRequireDefault(require("../ui/Extension/ExtensionNodeWrapper"));
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-// getInlineNodeViewProducer is a new api to use instead of ReactNodeView
-// when creating inline node views, however, it is difficult to test the impact
-// on selections when migrating inlineExtension to use the new api.
-// The ReactNodeView api will be visited in the second phase of the selections
-// project whilst investigating block nodes. We will revisit the Extension node view there too.
-var ExtensionNode = exports.ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
-  (0, _inherits2.default)(ExtensionNode, _ReactNodeView);
-  var _super = _createSuper(ExtensionNode);
-  function ExtensionNode() {
-    (0, _classCallCheck2.default)(this, ExtensionNode);
-    return _super.apply(this, arguments);
-  }
-  (0, _createClass2.default)(ExtensionNode, [{
-    key: "ignoreMutation",
-    value: function ignoreMutation(mutation) {
-      // Extensions can perform async operations that will change the DOM.
-      // To avoid having their tree rebuilt, we need to ignore the mutation
-      // for atom based extensions if its not a layout, we need to give
-      // children a chance to recalc
-      return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
-    }
-  }, {
-    key: "getContentDOM",
-    value: function getContentDOM() {
-      if (this.node.isInline) {
-        return;
-      }
-      var dom = document.createElement('div');
-      dom.className = "".concat(this.node.type.name, "-content-dom-wrapper");
-      return {
-        dom: dom
-      };
-    }
-  }, {
-    key: "render",
-    value: function render(props, forwardRef) {
-      var _props$extensionNodeV;
-      return /*#__PURE__*/_react.default.createElement(_ExtensionNodeWrapper.default, {
-        nodeType: this.node.type.name
-      }, /*#__PURE__*/_react.default.createElement(_Extension.default, {
-        editorView: this.view,
-        node: this.node,
-        eventDispatcher: this.eventDispatcher
-        // The getPos arg is always a function when used with nodes
-        // the version of the types we use has a union with the type
-        // for marks.
-        // This has been fixed in later versions of the definitly typed
-        // types (and also in prosmirror-views inbuilt types).
-        // https://github.com/DefinitelyTyped/DefinitelyTyped/pull/57384
-        ,
-        getPos: this.getPos,
-        providerFactory: props.providerFactory,
-        handleContentDOMRef: forwardRef,
-        extensionHandlers: props.extensionHandlers,
-        editorAppearance: (_props$extensionNodeV = props.extensionNodeViewOptions) === null || _props$extensionNodeV === void 0 ? void 0 : _props$extensionNodeV.appearance,
-        pluginInjectionApi: props.pluginInjectionApi
-      }));
-    }
-  }]);
-  return ExtensionNode;
-}(_reactNodeView.default);
-function ExtensionNodeView(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi) {
-  return function (node, view, getPos) {
-    var hasIntlContext = true;
-    return new ExtensionNode(node, view, getPos, portalProviderAPI, eventDispatcher, {
-      providerFactory: providerFactory,
-      extensionHandlers: extensionHandlers,
-      extensionNodeViewOptions: extensionNodeViewOptions,
-      pluginInjectionApi: pluginInjectionApi
-    }, undefined, undefined, undefined, hasIntlContext).init();
-  };
-}

package/dist/cjs/plugins/extension/ui/Extension/Extension/index.js

@@ -1,150 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-var _ui = require("@atlaskit/editor-common/ui");
-var _utils = require("@atlaskit/editor-common/utils");
-var _styles = require("./styles");
-var _styles2 = require("../styles");
-var _Lozenge = _interopRequireDefault(require("../Lozenge"));
-var _classnames2 = _interopRequireDefault(require("classnames"));
-var _hooks = require("@atlaskit/editor-common/hooks");
-var _withPluginState = require("@atlaskit/editor-common/with-plugin-state");
-var _excluded = ["type"];
-/** @jsx jsx */
-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 ExtensionWithPluginState(props) {
-  var node = props.node,
-    handleContentDOMRef = props.handleContentDOMRef,
-    children = props.children,
-    _props$widthState = props.widthState,
-    widthState = _props$widthState === void 0 ? {
-      width: 0
-    } : _props$widthState,
-    handleRef = props.handleRef,
-    shadowClassNames = props.shadowClassNames,
-    hideFrame = props.hideFrame,
-    editorAppearance = props.editorAppearance;
-  var hasBody = ['bodiedExtension', 'multiBodiedExtension'].includes(node.type.name);
-  var isMobile = editorAppearance === 'mobile';
-  var hasChildren = !!children;
-  var removeBorder = hideFrame && !isMobile && !hasBody || false;
-  var getPos = props.getPos,
-    view = props.view;
-  var isTopLevelNode = _react.default.useMemo(function () {
-    var pos = typeof getPos === 'function' ? getPos() : undefined;
-    return typeof pos !== 'undefined' && !isNaN(pos) && view.state.doc.resolve(pos).depth === 0;
-    return false;
-  }, [view, getPos]);
-  var shouldBreakout =
-  // Extension should breakout when the layout is set to 'full-width' or 'wide'.
-  ['full-width', 'wide'].includes(node.attrs.layout) &&
-  // Extension breakout state should only be respected for top level nodes.
-  isTopLevelNode &&
-  // Extension breakout state should not be respected when the editor appearance is full-width mode
-  editorAppearance !== 'full-width';
-  var classNames = (0, _classnames2.default)('extension-container', 'block', shadowClassNames, (0, _defineProperty2.default)({
-    'with-overlay': !hasBody,
-    'without-frame': removeBorder
-  }, _styles.widerLayoutClassName, shouldBreakout));
-  var headerClassNames = (0, _classnames2.default)({
-    'with-children': hasChildren,
-    'without-frame': removeBorder
-  });
-  var customContainerStyles = {
-    width: '100%'
-  };
-  var newContentStyles = {};
-  if (shouldBreakout) {
-    var _calculateBreakoutSty = (0, _utils.calculateBreakoutStyles)({
-        mode: node.attrs.layout,
-        widthStateWidth: widthState.width,
-        widthStateLineLength: widthState.lineLength
-      }),
-      type = _calculateBreakoutSty.type,
-      breakoutStyles = (0, _objectWithoutProperties2.default)(_calculateBreakoutSty, _excluded);
-    newContentStyles = _objectSpread({}, breakoutStyles);
-    customContainerStyles = breakoutStyles;
-  }
-  newContentStyles = _objectSpread(_objectSpread({}, newContentStyles), _styles.contentWrapper);
-  return (0, _react2.jsx)("div", {
-    ref: handleRef,
-    "data-layout": node.attrs.layout,
-    className: classNames,
-    css: _styles.wrapperStyle,
-    style: customContainerStyles
-  }, (0, _react2.jsx)("div", {
-    className: "extension-overflow-wrapper ".concat(hasBody ? 'with-body' : '')
-  }, (0, _react2.jsx)("div", {
-    css: _styles2.overlay,
-    className: "extension-overlay"
-  }), (0, _react2.jsx)("div", {
-    css: _styles.header,
-    contentEditable: false,
-    className: headerClassNames
-  }, !removeBorder && (0, _react2.jsx)(_Lozenge.default, {
-    node: node
-  }), children), hasBody && (0, _react2.jsx)("div", {
-    css: newContentStyles
-  }, (0, _react2.jsx)("div", {
-    css: _styles.content,
-    ref: handleContentDOMRef,
-    className: "extension-content block"
-  }))));
-}
-var Extension = function Extension(props) {
-  // TODO: ED-17836 This code is here because confluence injects
-  // the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
-  // which cannot access the `pluginInjectionApi`. When we move
-  // Confluence to using presets we can remove this workaround.
-  var pluginInjectionApi = props.pluginInjectionApi;
-  return pluginInjectionApi === undefined ? (0, _react2.jsx)(ExtensionDeprecated, props) : (0, _react2.jsx)(ExtensionWithSharedState, props);
-};
-var ExtensionWithSharedState = function ExtensionWithSharedState(props) {
-  var pluginInjectionApi = props.pluginInjectionApi;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width']),
-    widthState = _useSharedPluginState.widthState;
-  return (0, _react2.jsx)(ExtensionWithPluginState, (0, _extends2.default)({
-    widthState: widthState
-  }, props));
-};
-// TODO: ED-17836 This code is here because Confluence injects
-// the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
-// which cannot access the `pluginInjectionApi`. When we move
-// Confluence to using presets we can remove this workaround.
-// @ts-ignore
-var widthPluginKey = {
-  key: 'widthPlugin$',
-  getState: function getState(state) {
-    return state['widthPlugin$'];
-  }
-};
-var ExtensionDeprecated = function ExtensionDeprecated(props) {
-  return (0, _react2.jsx)(_withPluginState.WithPluginState, {
-    editorView: props.view,
-    plugins: {
-      widthState: widthPluginKey
-    },
-    render: function render(_ref) {
-      var widthState = _ref.widthState;
-      return (0, _react2.jsx)(ExtensionWithPluginState, (0, _extends2.default)({
-        widthState: widthState
-      }, props));
-    }
-  });
-};
-/**
- * End workaround
- */
-var _default = exports.default = (0, _ui.overflowShadow)(Extension, {
-  overflowSelector: '.extension-overflow-wrapper'
-});

package/dist/cjs/plugins/extension/ui/Extension/Extension/styles.js

@@ -1,28 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.wrapperStyle = exports.widerLayoutClassName = exports.header = exports.contentWrapper = exports.content = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = require("@emotion/react");
-var _components = require("@atlaskit/theme/components");
-var _constants = require("@atlaskit/theme/constants");
-var _colors = require("@atlaskit/theme/colors");
-var _styles = require("../styles");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-var widerLayoutClassName = exports.widerLayoutClassName = 'wider-layout';
-var wrapperStyle = exports.wrapperStyle = function wrapperStyle(theme) {
-  return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n\n  &.without-frame {\n    background: transparent;\n  }\n  cursor: pointer;\n  width: 100%;\n\n  .extension-overflow-wrapper:not(.with-body) {\n    overflow-x: auto;\n  }\n"])), (0, _styles.wrapperDefault)(theme));
-};
-var header = exports.header = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  padding: ", "px ", "px 0px;\n  vertical-align: middle;\n\n  &.with-children:not(.without-frame) {\n    padding: ", " ", "\n      ", ";\n  }\n  &.without-frame {\n    padding: 0;\n  }\n"])), _styles.padding / 2, _styles.padding / 2, "var(--ds-space-050, 4px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)");
-var content = exports.content = function content(theme) {
-  return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  padding: ", "px;\n  background: ", ";\n  color: ", ";\n  border: 1px solid ", ";\n  border-radius: ", "px;\n  cursor: initial;\n  width: 100%;\n"])), _styles.padding, (0, _components.themed)({
-    light: "var(--ds-surface, white)",
-    dark: "var(--ds-surface, ".concat(_colors.DN30, ")")
-  })(theme), (0, _components.themed)({
-    dark: "var(--ds-text, ".concat(_colors.DN900, ")")
-  })(theme), "var(--ds-border, ".concat(_colors.N30, ")"), (0, _constants.borderRadius)());
-};
-var contentWrapper = exports.contentWrapper = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 0 ", "px ", "px;\n  display: flex;\n  justify-content: center;\n"])), _styles.padding, _styles.padding);