@atlaskit/editor-common 93.5.2 → 93.6.0

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/editor-common
 
+## 93.6.0
+
+### Minor Changes
+
+- [#153024](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/153024)
+  [`0200c770ddcb2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0200c770ddcb2) -
+  [ux] Add multiple column layout via quick insert
+
+### Patch Changes
+
+- [#153020](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/153020)
+  [`74bfda385156e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/74bfda385156e) -
+  ED-24117: remediates legacy react apis in with-providers
+- Updated dependencies
+
+## 93.5.3
+
+### Patch Changes
+
+- [#152823](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/152823)
+  [`0ec705650807f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0ec705650807f) -
+  [ux] ED-25090: ED-25090: Migrated link toolbar and panel toolbar to use the new icons
+- Updated dependencies
+
 ## 93.5.2
 
 ### Patch Changes

package/dist/cjs/card/LinkToolbarButtonGroup.js

@@ -50,7 +50,9 @@ var LinkToolbarButtonGroup = exports.LinkToolbarButtonGroup = function LinkToolb
       testId = _ref3.testId,
       tooltipContent = _ref3.tooltipContent,
       title = _ref3.title,
-      Icon = _ref3.icon;
+      icon = _ref3.icon,
+      iconFallback = _ref3.iconFallback;
+    var ButtonIcon = icon;
     return (0, _react2.jsx)(DisallowedWrapper, {
       css: disabled ? disallowedWrapperStyle : defaultWrapperStyle,
       key: testId,
@@ -58,9 +60,11 @@ var LinkToolbarButtonGroup = exports.LinkToolbarButtonGroup = function LinkToolb
     }, (0, _react2.jsx)(_ui.FloatingToolbarButton, {
       css: disabled ? buttonStyleNoneEvent : buttonStyle,
       title: title,
-      icon: (0, _react2.jsx)(Icon, {
-        size: "medium",
-        label: title
+      icon: (0, _react2.jsx)(ButtonIcon, {
+        label: title,
+        spacing: "spacious",
+        LEGACY_size: "medium",
+        LEGACY_fallbackIcon: iconFallback
       }),
       selected: selected,
       onClick: onClick,

package/dist/cjs/card/link-toolbar-button-group-options.js

@@ -1,9 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getButtonGroupOption = void 0;
+var _minus = _interopRequireDefault(require("@atlaskit/icon/core/minus"));
+var _smartLinkCard = _interopRequireDefault(require("@atlaskit/icon/core/smart-link-card"));
+var _smartLinkEmbed = _interopRequireDefault(require("@atlaskit/icon/core/smart-link-embed"));
+var _smartLinkInline = _interopRequireDefault(require("@atlaskit/icon/core/smart-link-inline"));
 var _messages = require("../messages");
 var _card = require("./ui/assets/card");
 var _embed = require("./ui/assets/embed");
@@ -12,19 +17,23 @@ var _url = require("./ui/assets/url");
 var appearancePropsMap = {
   url: {
     title: _messages.cardMessages.urlTitle,
-    icon: _url.IconUrl
+    icon: _minus.default,
+    iconFallback: _url.IconUrl
   },
   inline: {
     title: _messages.cardMessages.inlineTitle,
-    icon: _inline.IconInline
+    icon: _smartLinkInline.default,
+    iconFallback: _inline.IconInline
   },
   block: {
     title: _messages.cardMessages.blockTitle,
-    icon: _card.IconCard
+    icon: _smartLinkCard.default,
+    iconFallback: _card.IconCard
   },
   embed: {
     title: _messages.cardMessages.embedTitle,
-    icon: _embed.IconEmbed
+    icon: _smartLinkEmbed.default,
+    iconFallback: _embed.IconEmbed
   }
 };
 var getButtonGroupOption = exports.getButtonGroupOption = function getButtonGroupOption(intl, dispatchCommand, _ref) {
@@ -36,10 +45,12 @@ var getButtonGroupOption = exports.getButtonGroupOption = function getButtonGrou
     tooltip = _ref.tooltip;
   var _appearancePropsMap = appearancePropsMap[appearance !== null && appearance !== void 0 ? appearance : 'url'],
     title = _appearancePropsMap.title,
-    icon = _appearancePropsMap.icon;
+    icon = _appearancePropsMap.icon,
+    iconFallback = _appearancePropsMap.iconFallback;
   return {
     title: intl.formatMessage(title),
     icon: icon,
+    iconFallback: iconFallback,
     onClick: function onClick() {
       return dispatchCommand(_onClick);
     },

package/dist/cjs/card/ui/assets/card.js

@@ -8,6 +8,8 @@ exports.IconCard = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+/* eslint-disable @atlaskit/design-system/no-custom-icons */
+
 var IconCardGlyph = function IconCardGlyph(props) {
   return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
     width: "32",

package/dist/cjs/card/ui/assets/embed.js

@@ -8,6 +8,8 @@ exports.IconEmbed = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+/* eslint-disable @atlaskit/design-system/no-custom-icons */
+
 var IconEmbedGlyph = function IconEmbedGlyph(props) {
   return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
     width: "32",

package/dist/cjs/card/ui/assets/inline.js

@@ -8,6 +8,8 @@ exports.IconInline = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+/* eslint-disable @atlaskit/design-system/no-custom-icons */
+
 var IconInlineGlyph = function IconInlineGlyph(props) {
   return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
     width: "32",

package/dist/cjs/card/ui/assets/url.js

@@ -8,6 +8,8 @@ exports.IconUrl = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _icon = _interopRequireDefault(require("@atlaskit/icon"));
+/* eslint-disable @atlaskit/design-system/no-custom-icons */
+
 var IconUrlGlyph = function IconUrlGlyph(props) {
   return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
     width: "32",

package/dist/cjs/media-single/CommentBadge.js

@@ -11,7 +11,8 @@ var _react2 = require("@emotion/react");
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
 var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _comment = _interopRequireDefault(require("@atlaskit/icon/glyph/comment"));
+var _comment = _interopRequireDefault(require("@atlaskit/icon/core/comment"));
+var _comment2 = _interopRequireDefault(require("@atlaskit/icon/glyph/comment"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _media = require("../media");
 /**
@@ -115,7 +116,10 @@ var CommentBadge = exports.CommentBadge = /*#__PURE__*/(0, _react.forwardRef)(fu
     onMouseLeave: onMouseLeave,
     iconAfter: (0, _react2.jsx)(_comment.default, {
       label: title,
-      size: badgeSize
+      spacing: "spacious",
+      color: "currentColor",
+      LEGACY_size: badgeSize,
+      LEGACY_fallbackIcon: _comment2.default
     })
   })));
 });

package/dist/cjs/media-single/CommentBadgeNext.js

@@ -8,7 +8,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.CommentBadgeNext = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
-var _comment = _interopRequireDefault(require("@atlaskit/icon/glyph/comment"));
+var _comment = _interopRequireDefault(require("@atlaskit/icon/core/comment"));
+var _comment2 = _interopRequireDefault(require("@atlaskit/icon/glyph/comment"));
 var _primitives = require("@atlaskit/primitives");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _media = require("../media");
@@ -56,6 +57,9 @@ var CommentBadgeNext = exports.CommentBadgeNext = function CommentBadgeNext(_ref
     backgroundColor: colourToken
   }, /*#__PURE__*/_react.default.createElement(_comment.default, {
     label: title,
-    size: badgeSize
+    spacing: "spacious",
+    color: "currentColor",
+    LEGACY_size: badgeSize,
+    LEGACY_fallbackIcon: _comment2.default
   })));
 };

package/dist/cjs/messages/insert-block.js

@@ -171,6 +171,26 @@ var toolbarInsertBlockMessages = exports.toolbarInsertBlockMessages = (0, _react
     defaultMessage: 'Layouts',
     description: 'Create a multi column section or layout'
   },
+  twoColumns: {
+    id: 'fabric.editor.twoColumns',
+    defaultMessage: '2 columns layout',
+    description: 'Create a section or layout with two columns'
+  },
+  threeColumns: {
+    id: 'fabric.editor.threeColumns',
+    defaultMessage: '3 columns layout',
+    description: 'Create a section or layout with three columns'
+  },
+  fourColumns: {
+    id: 'fabric.editor.fourColumns',
+    defaultMessage: '4 columns layout',
+    description: 'Create a section or layout with four columns'
+  },
+  fiveColumns: {
+    id: 'fabric.editor.fiveColumns',
+    defaultMessage: '5 columns layout',
+    description: 'Create a section or layout with five columns'
+  },
   columnsDescription: {
     id: 'fabric.editor.columns.description',
     defaultMessage: 'Structure your page using sections',

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "93.5.2";
+var packageVersion = "93.6.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/cjs/provider-factory/provider-factory.js

@@ -58,6 +58,7 @@ var ProviderFactory = exports.default = /*#__PURE__*/function () {
       if (provider) {
         handler(name, provider);
       }
+      return provider;
     }
   }, {
     key: "unsubscribe",

package/dist/cjs/provider-factory/with-providers.js

@@ -13,10 +13,11 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 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 _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @repo/internal/react/no-class-components */
 var WithProviders = exports.WithProviders = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(WithProviders, _PureComponent);
   var _super = _createSuper(WithProviders);
@@ -24,6 +25,13 @@ var WithProviders = exports.WithProviders = /*#__PURE__*/function (_PureComponen
     var _this;
     (0, _classCallCheck2.default)(this, WithProviders);
     _this = _super.call(this, props);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "mounted", false);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleProviderIfMounted", function (name, provider) {
+      if (!_this.mounted) {
+        return;
+      }
+      _this.handleProvider(name, provider);
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleProvider", function (name, provider) {
       _this.setState(function (_ref) {
         var providers = _ref.providers;
@@ -32,9 +40,15 @@ var WithProviders = exports.WithProviders = /*#__PURE__*/function (_PureComponen
         };
       });
     });
+    _this.mounted = false;
     var _providers = {};
     _this.props.providers.forEach(function (name) {
-      _providers[name] = undefined;
+      if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2')) {
+        var providerPromise = props.providerFactory.subscribe(name, _this.handleProviderIfMounted);
+        _providers[name] = providerPromise;
+      } else {
+        _providers[name] = undefined;
+      }
     });
     _this.state = {
       providers: _providers
@@ -42,15 +56,22 @@ var WithProviders = exports.WithProviders = /*#__PURE__*/function (_PureComponen
     return _this;
   }
   (0, _createClass2.default)(WithProviders, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.mounted = true;
+    }
+  }, {
     key: "UNSAFE_componentWillMount",
     value: function UNSAFE_componentWillMount() {
       var _this2 = this;
-      var _this$props = this.props,
-        providers = _this$props.providers,
-        providerFactory = _this$props.providerFactory;
-      providers.forEach(function (name) {
-        providerFactory.subscribe(name, _this2.handleProvider);
-      });
+      if (!(0, _platformFeatureFlags.fg)('platform_editor_react18_phase2')) {
+        var _this$props = this.props,
+          providers = _this$props.providers,
+          providerFactory = _this$props.providerFactory;
+        providers.forEach(function (name) {
+          providerFactory.subscribe(name, _this2.handleProvider);
+        });
+      }
     }
   }, {
     key: "componentWillUnmount",

package/dist/cjs/quick-insert/assets/five-column-layout.js

@@ -0,0 +1,173 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = OneColumnLayoutIcon;
+var _react = _interopRequireDefault(require("react"));
+var _useIconThemed2 = require("../use-icon-themed");
+function OneColumnLayoutIcon() {
+  var _useIconThemed = (0, _useIconThemed2.useIconThemed)(),
+    iconThemed = _useIconThemed.iconThemed;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    focusable: "false",
+    "aria-hidden": true,
+    width: "40",
+    height: "40",
+    viewBox: "0 0 40 40",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("g", {
+    clipPath: "url(#clip0_5808_5176)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "39",
+    height: "39",
+    rx: "2.5",
+    stroke: "var(--ds-border, #091E42)",
+    strokeOpacity: "0.14"
+  })), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "6",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "10",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "29",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "33",
+    width: "16",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "12.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "18.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "24.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "30.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
+    id: "clip0_5808_5176"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }))));
+}

package/dist/cjs/quick-insert/assets/four-column-layout.js

@@ -0,0 +1,158 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = OneColumnLayoutIcon;
+var _react = _interopRequireDefault(require("react"));
+var _useIconThemed2 = require("../use-icon-themed");
+function OneColumnLayoutIcon() {
+  var _useIconThemed = (0, _useIconThemed2.useIconThemed)(),
+    iconThemed = _useIconThemed.iconThemed;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    focusable: "false",
+    "aria-hidden": true,
+    width: "40",
+    height: "40",
+    viewBox: "0 0 40 40",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("g", {
+    clipPath: "url(#clip0_5808_7157)"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "39",
+    height: "39",
+    rx: "2.5",
+    stroke: "var(--ds-border, #091E42)",
+    strokeOpacity: "0.14"
+  })), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "6",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "10",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "29",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6",
+    y: "33",
+    width: "16",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "6.25",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "13.75",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "21.25",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("rect", {
+    x: "28.75",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
+    id: "clip0_5808_7157"
+  }, /*#__PURE__*/_react.default.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }))));
+}