@atlaskit/editor-plugin-synced-block/dist/es2019/ui/assets/SyncedLocationsEmptyStateIllustration.js

SyncedBlock plugin for @atlaskit/editor-core

import React from 'react';
import { useThemeObserver } from '@atlaskit/tokens/use-theme-observer';

// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage -- Figma specifies this fixed illustration color, which has no semantic token equivalent across themes.
const arrowFill = '#8C8F97';
export const SyncedLocationsEmptyStateIllustration = () => {
  const {
    colorMode
  } = useThemeObserver();
  const placeholderFill = colorMode === 'dark' ? "var(--ds-surface-overlay-pressed, #DDDEE1)" : "var(--ds-background-accent-gray-subtlest, #F0F1F2)";
  return /*#__PURE__*/React.createElement("svg", {
    width: "274",
    height: "92",
    viewBox: "0 0 274 92",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg",
    "aria-hidden": "true",
    focusable: "false",
    "data-testid": "synced-locations-empty-state-illustration"
  }, /*#__PURE__*/React.createElement("rect", {
    x: "0.41416",
    y: "0.41416",
    width: "115.965",
    height: "90.2868",
    rx: "2.89912",
    stroke: "var(--ds-border, #0B120E24)",
    strokeWidth: "0.82832"
  }), /*#__PURE__*/React.createElement("rect", {
    x: "10.7681",
    y: "38.1016",
    width: "30.0956",
    height: "21.0056",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "43.3486",
    y: "38.1016",
    width: "30.0956",
    height: "21.0056",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "75.9292",
    y: "38.1016",
    width: "30.0956",
    height: "21.0056",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M10.8154 26.5352H77.1144V29.1609H10.8154V26.5352Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M7.45483 69.5781H110.166V72.0631H7.45483V69.5781Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M7.45483 75.3789H110.166V77.8639H7.45483V75.3789Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M7.45483 81.1719H82.0036V83.6568H7.45483V81.1719Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "10.8154",
    y: "31.7891",
    width: "17.7235",
    height: "2.6257",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "6.95492",
    y: "22.6954",
    width: "102.884",
    height: "40.7596",
    rx: "0.984638",
    stroke: "var(--ds-border-focused, #4688EC)",
    strokeWidth: "0.656425"
  }), /*#__PURE__*/React.createElement("rect", {
    x: "81.5023",
    y: "20.707",
    width: "22.5506",
    height: "4.96992",
    rx: "0.82832",
    fill: "var(--ds-surface-overlay, #FFFFFF)"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M85.2556 22.4161C85.2556 22.3732 85.2208 22.3384 85.1779 22.3384H83.6248C83.5819 22.3384 83.5472 22.3732 83.5472 22.4161V23.9692C83.5472 24.0121 83.5819 24.0468 83.6248 24.0468H84.0908V24.2798H83.6248C83.4533 24.2798 83.3142 24.1407 83.3142 23.9692V22.4161C83.3142 22.2445 83.4533 22.1055 83.6248 22.1055H85.1779C85.3495 22.1055 85.4885 22.2445 85.4885 22.4161V22.7267H85.2556V22.4161Z",
    fill: "var(--ds-icon-subtle, #505258)"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M85.4732 23.3029C85.7006 23.5303 85.7006 23.8991 85.4732 24.1266L85.4692 24.1305L85.5375 24.1533C85.5887 24.1704 85.6215 24.2205 85.6166 24.2743C85.6118 24.3281 85.5706 24.3715 85.5171 24.3791L85.1328 24.434C85.0965 24.4392 85.0598 24.427 85.0339 24.4011C85.008 24.3752 84.9958 24.3385 85.001 24.3022L85.0559 23.9179L85.0603 23.8985C85.0745 23.8547 85.1136 23.8226 85.1607 23.8184C85.2145 23.8135 85.2647 23.8463 85.2818 23.8976L85.3045 23.9658L85.3084 23.9619C85.4449 23.8254 85.4449 23.604 85.3084 23.4676L85.1986 23.3578L85.3633 23.1931L85.4732 23.3029ZM84.8801 22.9954C84.9164 22.9902 84.9531 23.0024 84.979 23.0283C85.0049 23.0543 85.0171 23.0909 85.0119 23.1272L84.957 23.5116C84.9494 23.565 84.906 23.6062 84.8522 23.6111C84.7984 23.6159 84.7483 23.5831 84.7312 23.5319L84.7084 23.4636L84.7045 23.4676C84.568 23.604 84.568 23.8254 84.7045 23.9619L84.8143 24.0717L84.6496 24.2364L84.5398 24.1266C84.3123 23.8991 84.3123 23.5303 84.5398 23.3029L84.5437 23.2989L84.4755 23.2762C84.4242 23.2591 84.3914 23.2089 84.3963 23.1551C84.4012 23.1013 84.4423 23.058 84.4958 23.0503L84.8801 22.9954Z",
    fill: "var(--ds-icon-subtle, #505258)"
  }), /*#__PURE__*/React.createElement("rect", {
    x: "86.4723",
    y: "22.1289",
    width: "15.9241",
    height: "2.12321",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "7.53369",
    y: "5.53516",
    width: "47.2626",
    height: "3.93855",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "24.8138",
    y: "14.1758",
    width: "14.4003",
    height: "1.92004",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("circle", {
    cx: "10.8929",
    cy: "14.654",
    r: "2.23595",
    fill: placeholderFill,
    stroke: "var(--ds-surface-overlay, #FFFFFF)",
    strokeWidth: "0.328213"
  }), /*#__PURE__*/React.createElement("circle", {
    cx: "14.7333",
    cy: "14.654",
    r: "2.23595",
    fill: placeholderFill,
    stroke: "var(--ds-surface-overlay, #FFFFFF)",
    strokeWidth: "0.328213"
  }), /*#__PURE__*/React.createElement("circle", {
    cx: "18.5736",
    cy: "14.654",
    r: "2.23595",
    fill: placeholderFill,
    stroke: "var(--ds-surface-overlay, #FFFFFF)",
    strokeWidth: "0.328213"
  }), /*#__PURE__*/React.createElement("g", {
    clipPath: "url(#synced-locations-arrow-clip)"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M153.151 39.5728C153.137 39.1517 151.895 38.7634 151.646 39.1155C151.294 39.6114 151.022 40.1671 150.803 40.9126C150.623 41.7746 150.828 42.0572 150.641 42.6134C150.509 43.089 150.24 43.7061 149.966 44.1967C149.692 44.691 149.411 45.0135 149.31 45.0811C149.281 45.1129 149.261 45.1394 149.246 45.1633C149.238 45.1894 149.22 45.2245 149.202 45.2719C149.184 45.291 149.164 45.3581 149.148 45.3734C149.109 45.4351 149.127 45.4725 148.993 45.5143C148.863 45.5572 148.58 45.5552 148.251 45.4788C147.924 45.4073 147.563 45.2853 147.215 45.1309C146.212 44.7559 145.565 44.449 145.235 44.3075C144.446 43.9591 143.8 43.8021 143.114 43.7547C142.737 43.7292 142.255 44.7498 142.515 45.0242C142.993 45.5205 143.531 45.9211 144.335 46.2984C144.655 46.4366 145.166 47.0275 146.147 47.4648C146.309 47.5326 146.478 47.578 146.665 47.5883C147.458 47.6306 148.351 47.8436 149.302 47.7055C149.781 47.6314 150.2 47.4182 150.458 47.2428C150.575 47.1475 150.67 47.0703 150.733 47.02C150.798 46.9661 150.823 46.9369 150.823 46.9369C150.823 46.9369 150.865 46.8886 150.938 46.8048C151.02 46.7195 151.104 46.5984 151.209 46.4471C151.407 46.1448 151.612 45.7354 151.767 45.3155C152.088 44.4704 152.337 43.5357 152.495 42.983C152.722 42.1549 152.83 41.7576 152.899 41.5105C153.099 40.7718 153.164 40.1758 153.145 39.5792L153.151 39.5728Z",
    fill: arrowFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M122.093 51.2051C122.362 52.3321 123.634 52.0495 123.655 51.0274C123.691 49.5646 123.763 48.06 124.288 46.2549C124.363 46.0014 124.43 45.7703 124.493 45.5579C124.524 45.4498 124.546 45.347 124.571 45.249C124.599 45.152 124.638 45.0621 124.668 44.9738C124.789 44.6166 124.892 44.319 124.99 44.0401C125.239 43.5099 125.419 43.0202 125.904 42.4543C126 42.3327 126.1 42.2 126.203 42.0684C126.323 41.9497 126.445 41.8236 126.572 41.6948C126.698 41.5697 126.829 41.4383 126.961 41.3069C127.092 41.1754 127.253 41.0688 127.399 40.9454C127.7 40.7058 127.999 40.4576 128.34 40.262C128.668 40.0545 128.989 39.8412 129.331 39.6824C129.99 39.3251 130.654 39.0906 131.194 38.8926C131.752 38.7406 132.176 38.5935 132.43 38.5547C132.577 38.5248 132.721 38.4863 132.865 38.4392C132.991 38.3953 133.171 38.3346 133.395 38.2588C133.627 38.2011 133.906 38.1331 134.224 38.0563C134.539 37.9624 134.906 37.9244 135.302 37.8582C135.697 37.7798 136.127 37.7641 136.581 37.7314C136.697 37.7247 136.808 37.7169 136.928 37.7076C137.045 37.7095 137.162 37.7113 137.283 37.7143C137.52 37.7191 137.765 37.7261 138.011 37.7294C138.259 37.7375 138.502 37.7802 138.755 37.8017C139.004 37.8343 139.264 37.8457 139.513 37.9066C139.765 37.9601 140.017 38.0098 140.269 38.0633C140.522 38.1093 140.764 38.2086 141.01 38.2807C141.509 38.4148 141.971 38.635 142.431 38.8345C142.76 38.9675 143.038 39.1502 143.325 39.2909C143.613 39.4278 143.855 39.6082 144.092 39.7667C144.58 40.0635 144.95 40.4149 145.293 40.6974C145.943 41.3089 146.377 41.8043 146.636 42.1759C147.917 43.8828 148.559 45.4067 149.143 46.9622C149.466 47.8095 150.591 47.6859 150.514 46.676C150.477 46.2238 150.46 45.7574 150.339 45.3009C150.285 45.0706 150.233 44.8328 150.18 44.5987C150.128 44.361 150.066 44.1162 149.966 43.8802C149.623 42.9218 149.158 41.8867 148.375 40.8682C148.217 40.6762 148.066 40.3892 147.825 40.0957C147.579 39.8011 147.315 39.4322 146.969 39.0516C146.788 38.8689 146.593 38.6782 146.389 38.4767C146.284 38.3773 146.177 38.2731 146.066 38.1678C145.95 38.0688 145.827 37.9762 145.702 37.8788C145.45 37.6877 145.182 37.4836 144.897 37.2827C144.601 37.1067 144.285 36.9253 143.958 36.7444C143.748 36.6181 143.52 36.5269 143.293 36.4443C143.066 36.3616 142.834 36.2853 142.604 36.2139C140.599 35.6384 138.269 35.4412 136.47 35.5293C135.569 35.5525 134.8 35.6753 134.253 35.7335C133.709 35.8333 133.392 35.8941 133.392 35.8941C133.392 35.8941 133.271 35.9194 133.06 35.9628C132.844 35.9965 132.543 36.0985 132.168 36.2032C131.982 36.258 131.774 36.3185 131.558 36.3805C131.344 36.4596 131.113 36.5455 130.875 36.6378C130.637 36.7338 130.378 36.8158 130.128 36.9368C129.874 37.0568 129.614 37.183 129.351 37.3082C129.081 37.4275 128.822 37.5821 128.557 37.7393C128.296 37.8976 128.022 38.044 127.766 38.2157C127.265 38.5831 126.738 38.9183 126.3 39.3363C126.075 39.5375 125.843 39.7205 125.642 39.9246C125.443 40.1334 125.254 40.337 125.068 40.5294C124.882 40.7218 124.709 40.9101 124.57 41.1081C124.425 41.3003 124.287 41.4824 124.157 41.6469C123.956 41.8915 123.806 42.1428 123.667 42.3814C123.525 42.619 123.391 42.8389 123.266 43.0451C123.041 43.4688 122.884 43.8519 122.73 44.171C122.568 44.4878 122.501 44.784 122.41 45.0283C122.33 45.2721 122.261 45.4787 122.201 45.6554C121.577 47.8403 121.729 49.6415 122.093 51.2051Z",
    fill: arrowFill
  })), /*#__PURE__*/React.createElement("rect", {
    x: "157.621",
    y: "0.41416",
    width: "115.965",
    height: "90.2868",
    rx: "2.89912",
    stroke: "var(--ds-border, #0B120E24)",
    strokeWidth: "0.82832"
  }), /*#__PURE__*/React.createElement("rect", {
    x: "167.975",
    y: "51.3594",
    width: "30.0956",
    height: "21.0056",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "200.556",
    y: "51.3594",
    width: "30.0956",
    height: "21.0056",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "233.136",
    y: "51.3594",
    width: "30.0956",
    height: "21.0056",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M168.022 39.7891H234.321V42.4148H168.022V39.7891Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M164.661 19.8789H267.373V22.3639H164.661V19.8789Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("path", {
    d: "M164.661 25.6719H267.373V28.1568H164.661V25.6719Z",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "168.022",
    y: "45.0391",
    width: "17.7235",
    height: "2.6257",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "164.161",
    y: "35.9454",
    width: "102.884",
    height: "40.7596",
    rx: "0.984638",
    stroke: "var(--ds-border-focused, #4688EC)",
    strokeWidth: "0.656425"
  }), /*#__PURE__*/React.createElement("rect", {
    x: "238.709",
    y: "33.9648",
    width: "22.5506",
    height: "4.96992",
    rx: "0.82832",
    fill: "var(--ds-surface-overlay, #FFFFFF)"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M242.463 35.6739C242.463 35.631 242.428 35.5962 242.385 35.5962H240.832C240.789 35.5962 240.754 35.631 240.754 35.6739V37.227C240.754 37.2699 240.789 37.3047 240.832 37.3047H241.298V37.5376H240.832C240.66 37.5376 240.521 37.3986 240.521 37.227V35.6739C240.521 35.5024 240.66 35.3633 240.832 35.3633H242.385C242.557 35.3633 242.696 35.5024 242.696 35.6739V35.9845H242.463V35.6739Z",
    fill: "var(--ds-icon-subtle, #505258)"
  }), /*#__PURE__*/React.createElement("path", {
    d: "M242.68 36.5607C242.908 36.7881 242.908 37.1569 242.68 37.3844L242.676 37.3883L242.745 37.4111C242.796 37.4282 242.829 37.4783 242.824 37.5321C242.819 37.5859 242.778 37.6293 242.724 37.6369L242.34 37.6918C242.304 37.697 242.267 37.6848 242.241 37.6589C242.215 37.633 242.203 37.5963 242.208 37.56L242.263 37.1757L242.267 37.1563C242.282 37.1125 242.321 37.0805 242.368 37.0762C242.422 37.0714 242.472 37.1041 242.489 37.1554L242.512 37.2236L242.516 37.2197C242.652 37.0832 242.652 36.8619 242.516 36.7254L242.406 36.6156L242.571 36.4509L242.68 36.5607ZM242.087 36.2532C242.124 36.2481 242.16 36.2602 242.186 36.2862C242.212 36.3121 242.224 36.3487 242.219 36.385L242.164 36.7694C242.157 36.8228 242.113 36.864 242.059 36.8689C242.006 36.8737 241.955 36.8409 241.938 36.7897L241.916 36.7214L241.912 36.7254C241.775 36.8619 241.775 37.0832 241.912 37.2197L242.021 37.3295L241.857 37.4942L241.747 37.3844C241.519 37.1569 241.519 36.7881 241.747 36.5607L241.751 36.5567L241.683 36.534C241.631 36.5169 241.599 36.4668 241.603 36.4129C241.608 36.3592 241.649 36.3158 241.703 36.3081L242.087 36.2532Z",
    fill: "var(--ds-icon-subtle, #505258)"
  }), /*#__PURE__*/React.createElement("rect", {
    x: "243.679",
    y: "35.3867",
    width: "15.9241",
    height: "2.12321",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("rect", {
    x: "164.74",
    y: "11.332",
    width: "47.2626",
    height: "3.93855",
    fill: placeholderFill
  }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
    id: "synced-locations-arrow-clip"
  }, /*#__PURE__*/React.createElement("rect", {
    width: "20.9549",
    height: "28.3348",
    transform: "translate(120.479 51.5039) rotate(-73.6651)"
  }))));
};