@atlaskit/editor-common 60.0.0 → 61.0.0

package/dist/esm/i18n/de.js

@@ -6,6 +6,7 @@
  */
 // German
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Bidirektionale Zeichen ändern die Reihenfolge, in der Text gerendert wird. Dies könnte verwendet werden, um bösartigen Code zu verbergen.',
   'fabric.editor.captionPlaceholder': 'Eine Bildunterschrift hinzufügen',
   'fabric.editor.collapseNode': 'Inhaltsanzeige reduzieren',
   'fabric.editor.expandDefaultTitle': 'Klicken Sie hier, um zu erweitern …',

package/dist/esm/i18n/es.js

@@ -6,6 +6,7 @@
  */
 // Spanish
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Los caracteres bidireccionales cambian el orden de renderización del texto. Esto podría utilizarse para ocultar código malicioso.',
   'fabric.editor.captionPlaceholder': 'Añadir un subtítulo',
   'fabric.editor.collapseNode': 'contraer contenido',
   'fabric.editor.expandDefaultTitle': 'Haz clic aquí para ampliar...',

package/dist/esm/i18n/fi.js

@@ -6,6 +6,7 @@
  */
 // Finnish
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Kaksisuuntaiset merkit muuttavat tekstin renderöintijärjestystä. Tätä voidaan hyödyntää haitallisen koodin peittämisessä.',
   'fabric.editor.captionPlaceholder': 'Lisää kuvateksti',
   'fabric.editor.collapseNode': 'piilota sisältö',
   'fabric.editor.expandDefaultTitle': 'Klikkaa tähän laajentaaksesi...',

package/dist/esm/i18n/fr.js

@@ -6,6 +6,7 @@
  */
 // French
 export default {
+  'fabric.editor.codeBidiWarningLabel': "Les caractères bidirectionnels changent l'ordre de rendu du texte. Ils peuvent être utilisés pour masquer du code malveillant.",
   'fabric.editor.captionPlaceholder': 'Ajouter une légende',
   'fabric.editor.collapseNode': 'Réduire le contenu',
   'fabric.editor.expandDefaultTitle': 'Cliquez ici pour développer...',

package/dist/esm/i18n/hu.js

@@ -6,6 +6,7 @@
  */
 // Hungarian
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'A kétirányú karakterek megváltoztatják a szöveg renderelési sorrendjét. Ez felhasználható rosszindulatú kód elfedésére.',
   'fabric.editor.captionPlaceholder': 'Képaláírás hozzáadása',
   'fabric.editor.collapseNode': 'tartalom összecsukása',
   'fabric.editor.expandDefaultTitle': 'Kattints ide a kibontáshoz…',

package/dist/esm/i18n/it.js

@@ -6,6 +6,7 @@
  */
 // Italian
 export default {
+  'fabric.editor.codeBidiWarningLabel': "I caratteri bidirezionali modificano l'ordine in cui è visualizzato il testo. Possono essere utilizzati per nascondere un codice dannoso.",
   'fabric.editor.captionPlaceholder': 'Aggiungi didascalia',
   'fabric.editor.collapseNode': 'Comprimi contenuto',
   'fabric.editor.expandDefaultTitle': 'Clicca qui per espandere...',

package/dist/esm/i18n/ja.js

@@ -6,6 +6,7 @@
  */
 // Japanese
 export default {
+  'fabric.editor.codeBidiWarningLabel': '双方向文字はテキストのレンダリング順序を変更します。このため、悪意あるコードを隠すために使用される場合があります。',
   'fabric.editor.captionPlaceholder': 'キャプションを追加',
   'fabric.editor.collapseNode': 'コンテンツを折りたたむ',
   'fabric.editor.expandDefaultTitle': 'こちらをクリックして展開…',

package/dist/esm/i18n/ko.js

@@ -6,6 +6,7 @@
  */
 // Korean
 export default {
+  'fabric.editor.codeBidiWarningLabel': '양방향 문자가 텍스트가 렌더링되는 순서를 변경합니다. 악성 코드를 가리는 데 사용할 수 있습니다.',
   'fabric.editor.captionPlaceholder': '캡션 추가',
   'fabric.editor.collapseNode': '콘텐츠 접기',
   'fabric.editor.expandDefaultTitle': '여기를 클릭하여 펼치기...',

package/dist/esm/i18n/nb.js

@@ -6,6 +6,7 @@
  */
 // Norwegian Bokmål
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Toveistegn endrer rekkefølgen som tekst vises i. Dette kan brukes til å skjule skadelig kode.',
   'fabric.editor.captionPlaceholder': 'Legg til bildetekst',
   'fabric.editor.collapseNode': 'Minimer innhold',
   'fabric.editor.expandDefaultTitle': 'Klikk her for å utvide …',

package/dist/esm/i18n/nl.js

@@ -6,6 +6,7 @@
  */
 // Dutch
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Bidirectionele tekens wijzigen de volgorde waarin de tekst wordt weergegeven. Dit kan worden gebruikt om schadelijke code te verdoezelen.',
   'fabric.editor.captionPlaceholder': 'Bijschrift toevoegen',
   'fabric.editor.collapseNode': 'Content inklappen',
   'fabric.editor.expandDefaultTitle': 'Klik hier om uit te breiden...',

package/dist/esm/i18n/pl.js

@@ -6,6 +6,7 @@
  */
 // Polish
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Znaki dwukierunkowe zmieniają kolejność, w jakiej tekst jest renderowany. Może to zostać wykorzystane do ukrycia złośliwego kodu.',
   'fabric.editor.captionPlaceholder': 'Dodaj podpis',
   'fabric.editor.collapseNode': 'Zwiń zawartość',
   'fabric.editor.expandDefaultTitle': 'Kliknij tutaj, aby rozwinąć...',

package/dist/esm/i18n/pt_BR.js

@@ -6,6 +6,7 @@
  */
 // Portuguese (Brazil)
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Caracteres bidirecionais alteram a ordem em que o texto é renderizado. Eles podem ser usados para ocultar códigos mal-intencionados.',
   'fabric.editor.captionPlaceholder': 'Adicionar legenda',
   'fabric.editor.collapseNode': 'Recolher conteúdo',
   'fabric.editor.expandDefaultTitle': 'Clique aqui para expandir...',

package/dist/esm/i18n/ru.js

@@ -6,6 +6,7 @@
  */
 // Russian
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Двунаправленные символы изменяют порядок отображения текста. Они могут использоваться для маскировки вредоносного кода.',
   'fabric.editor.captionPlaceholder': 'Добавьте подпись',
   'fabric.editor.collapseNode': 'Свернуть содержимое',
   'fabric.editor.expandDefaultTitle': 'Нажмите здесь, чтобы развернуть…',

package/dist/esm/i18n/sv.js

@@ -6,6 +6,7 @@
  */
 // Swedish
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Dubbelriktade tecken ändrar återgivningsordningen för text. Detta kan användas för att dölja skadlig kod.',
   'fabric.editor.captionPlaceholder': 'Lägg till en bildtext',
   'fabric.editor.collapseNode': 'komprimera innehåll',
   'fabric.editor.expandDefaultTitle': 'Klicka här för att expandera ...',

package/dist/esm/i18n/th.js

@@ -6,6 +6,7 @@
  */
 // Thai
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'ตัวอักษรแบบสองทิศทางเปลี่ยนลำดับการแสดงข้อความ ซึ่งอาจนำไปใช้เพื่อปิดบังรหัสที่มีวัตถุประสงค์ในทางที่ไม่ดีได้',
   'fabric.editor.captionPlaceholder': 'เพิ่มคำอธิบาย',
   'fabric.editor.collapseNode': 'ย่อเนื้อหา',
   'fabric.editor.expandDefaultTitle': 'คลิกที่นี่เพื่อขยาย...',

package/dist/esm/i18n/tr.js

@@ -6,6 +6,7 @@
  */
 // Turkish
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Çift yönlü karakterler metnin oluşturulduğu sırayı değiştirir. Bu, kötü amaçlı kodu gizlemek için kullanılabilir.',
   'fabric.editor.captionPlaceholder': 'Açıklama yazısı ekleyin',
   'fabric.editor.collapseNode': 'içeriği daraltın',
   'fabric.editor.expandDefaultTitle': 'Genişletmek için buraya tıklayın...',

package/dist/esm/i18n/uk.js

@@ -6,6 +6,7 @@
  */
 // Ukrainian
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Двонаправлені символи змінюють порядок відображення тексту. Такий спосіб може використовуватися, щоб приховати зловмисний код.',
   'fabric.editor.captionPlaceholder': 'Додати підпис',
   'fabric.editor.collapseNode': 'Згорніть вміст',
   'fabric.editor.expandDefaultTitle': 'Натисніть, щоб розгорнути…',

package/dist/esm/i18n/vi.js

@@ -6,6 +6,7 @@
  */
 // Vietnamese
 export default {
+  'fabric.editor.codeBidiWarningLabel': 'Ký tự hai chiều thay đổi thứ tự kết xuất văn bản. Điều này có thể được dùng để che giấu mã độc hại.',
   'fabric.editor.captionPlaceholder': 'Thêm chú thích',
   'fabric.editor.collapseNode': 'thu gọn nội dung',
   'fabric.editor.expandDefaultTitle': 'Nhấp vào đây để mở rộng...',

package/dist/esm/i18n/zh.js

@@ -4,8 +4,8 @@
  * This file is automatically generated by i18n-tools.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
-// Chinese
 export default {
+  'fabric.editor.codeBidiWarningLabel': '双向字符会更改文本的呈现顺序。这可能被用于掩盖恶意代码。',
   'fabric.editor.captionPlaceholder': '添加标题',
   'fabric.editor.collapseNode': '收起内容',
   'fabric.editor.expandDefaultTitle': '点击此处展开...',

package/dist/esm/i18n/zh_TW.js

@@ -6,6 +6,7 @@
  */
 // undefined
 export default {
+  'fabric.editor.codeBidiWarningLabel': '雙向字元會變更文字呈現的順序。這可用來將惡意程式碼模糊化。',
   'fabric.editor.captionPlaceholder': '新增標題',
   'fabric.editor.collapseNode': '摺疊內容',
   'fabric.editor.expandDefaultTitle': '按一下此處以展開...',

package/dist/esm/index.js

@@ -1,9 +1,27 @@
-export { ADFTraversor, ErrorReporter, ZERO_WIDTH_SPACE, absoluteBreakoutWidth, browser, calcBreakoutWidth, breakoutConsts, calcTableColumnWidths, calcWideWidth, clearMeasure, compose, convertProsemirrorTableNodeToArrayOfRows, createCompareNodes, findAndTrackUnsupportedContentNodes, getAnalyticsAppearance, analyticsEventKey, getAnalyticsEventSeverity, getUnsupportedContentLevelData, UNSUPPORTED_CONTENT_LEVEL_SEVERITY_THRESHOLD_DEFAULTS, getExtensionLozengeData, getExtensionRenderer, getMarksByOrder, getModeFromTheme, getResponseEndTime, getValidContent, getValidDocument, getValidMark, getValidNode, getValidUnknownNode, hasMergedCell, isPastDate, isPerformanceAPIAvailable, isPerformanceObserverAvailable, isSameMark, isSubSupType, markOrder, measureRender, startMeasure, stopMeasure, measureTTI, getTTISeverity, TTI_SEVERITY_THRESHOLD_DEFAULTS, TTI_FROM_INVOCATION_SEVERITY_THRESHOLD_DEFAULTS, timestampToIsoFormat, timestampToString, timestampToTaskContext, timestampToUTCDate, todayTimestampInUTC, withImageLoader, canApplyAnnotationOnRange, getAnnotationIdsFromRange, SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, shouldForceTracking, sniffUserBrowserExtensions } from './utils';
-export { SortOrder, AnnotationUpdateEmitter, AnnotationUpdateEvent } from './types';
-export { DefaultExtensionProvider, combineExtensionProviders, getExtensionKeyAndNodeKey, getExtensionModuleNode, getExtensionModuleNodePrivateProps, getQuickInsertItemsFromModule, getNodeRenderer, getContextualToolbarItemsFromModule, buildMenuItem, resolveImport } from './extensions';
-export { ProviderFactory, WithProviders } from './provider-factory';
-export { combineProviders } from './provider-helpers';
-export { TableSharedCssClassName, blockMarksSharedStyles, blockquoteSharedStyles, calcTableWidth, codeMarkSharedStyles, columnLayoutSharedStyle, dateSharedStyle, DateSharedCssClassName, annotationSharedStyles, AnnotationSharedCSSByState, AnnotationSharedClassNames, headingsSharedStyles, indentationSharedStyles, inlineNodeSharedStyle, linkSharedStyle, listsSharedStyles, richMediaClassName, mediaSingleSharedStyle, getPanelTypeBackground, panelSharedStyles, PanelSharedCssClassName, PanelSharedSelectors, paragraphSharedStyles, ruleSharedStyles, shadowSharedStyle, tableCellBorderWidth, tableCellMinWidth, tableCellPadding, tableMarginBottom, tableMarginSides, tableMarginTop, tableNewColumnMinWidth, tableResizeHandleWidth, tableSharedStyle, tasksAndDecisionsStyles, TaskDecisionSharedCssClassName, whitespaceSharedStyles, MentionSharedCssClassName, EmojiSharedCssClassName, StatusSharedCssClassName, smartCardSharedStyles, SmartCardSharedCssClassName } from './styles';
-export { BaseTheme, Caption, ClearNextSiblingMarginTop, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH, Emoji, ErrorMessage, ExpandIconWrapper, ExpandLayoutWrapper, HelperMessage, MediaSingle, MediaSingleDimensionHelper, Mention, Popup, UnsupportedBlock, UnsupportedInline, ValidMessage, WidthConsumer, WidthProvider, WithCreateAnalyticsEvent, calcColumnsFromPx, calcPctFromPx, calcPxFromColumns, calcPxFromPct, expandMessages, findOverflowScrollParent, getBreakpoint, layoutSupportsWidth, mapBreakpointToLayoutMaxWidth, overflowShadow, shadowClassNames, sharedExpandStyles, snapToGrid, withOuterListeners, MediaLink, wrappedLayouts, shouldAddDefaultWrappedWidth } from './ui';
-export { linkMessages } from './messages/link';
+// new child entry point ./utils/index.ts
+export { ADFTraversor, ErrorReporter, ZERO_WIDTH_SPACE, absoluteBreakoutWidth, browser, calcBreakoutWidth, breakoutConsts, calcTableColumnWidths, calcWideWidth, clearMeasure, compose, convertProsemirrorTableNodeToArrayOfRows, createCompareNodes, findAndTrackUnsupportedContentNodes, getAnalyticsAppearance, analyticsEventKey, getAnalyticsEventSeverity, getUnsupportedContentLevelData, UNSUPPORTED_CONTENT_LEVEL_SEVERITY_THRESHOLD_DEFAULTS, getExtensionLozengeData, getExtensionRenderer, getMarksByOrder, getModeFromTheme, getResponseEndTime, getValidContent, getValidDocument, getValidMark, getValidNode, getValidUnknownNode, hasMergedCell, isPastDate, isPerformanceAPIAvailable, isPerformanceObserverAvailable, isSameMark, isSubSupType, markOrder, measureRender, startMeasure, stopMeasure, measureTTI, getTTISeverity, TTI_SEVERITY_THRESHOLD_DEFAULTS, TTI_FROM_INVOCATION_SEVERITY_THRESHOLD_DEFAULTS, timestampToIsoFormat, timestampToString, timestampToTaskContext, timestampToUTCDate, todayTimestampInUTC, withImageLoader, canApplyAnnotationOnRange, getAnnotationIdsFromRange, SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, shouldForceTracking, sniffUserBrowserExtensions, RenderCountProfiler } from './utils'; // new child entry point ./utils/index.ts
+
+// new child entry point ./types/index.ts
+export { SortOrder, AnnotationUpdateEmitter, AnnotationUpdateEvent } from './types'; // new child entry point ./types/index.ts
+
+// already exported by ./extensions.ts
+export { DefaultExtensionProvider, combineExtensionProviders, getExtensionKeyAndNodeKey, getExtensionModuleNode, getExtensionModuleNodePrivateProps, getQuickInsertItemsFromModule, getNodeRenderer, getContextualToolbarItemsFromModule, buildMenuItem, resolveImport } from './extensions'; // already exported by ./extensions.ts
+
+// already exported by ./provider-factory.ts
+export { ProviderFactory, WithProviders } from './provider-factory'; // already exported by ./provider-factory.ts
+
+// new child entry point ./provider-helpers/index.ts
+export { combineProviders } from './provider-helpers'; // already exported by ./styles/index.ts
+
+export { TableSharedCssClassName, blockMarksSharedStyles, blockquoteSharedStyles, calcTableWidth, codeMarkSharedStyles, columnLayoutSharedStyle, dateSharedStyle, DateSharedCssClassName, annotationSharedStyles, AnnotationSharedCSSByState, AnnotationSharedClassNames, headingsSharedStyles, indentationSharedStyles, inlineNodeSharedStyle, linkSharedStyle, listsSharedStyles, richMediaClassName, mediaSingleSharedStyle, getPanelTypeBackground, getPanelBackgroundDarkModeColors, panelSharedStyles, PanelSharedCssClassName, PanelSharedSelectors, paragraphSharedStyles, ruleSharedStyles, shadowSharedStyle, tableCellBorderWidth, tableCellMinWidth, tableCellPadding, tableMarginBottom, tableMarginSides, tableMarginTop, tableNewColumnMinWidth, tableResizeHandleWidth, tableSharedStyle, tasksAndDecisionsStyles, TaskDecisionSharedCssClassName, whitespaceSharedStyles, MentionSharedCssClassName, //exported from ./src/mention.ts
+EmojiSharedCssClassName, //exported from ./src/emoji.ts
+StatusSharedCssClassName, smartCardSharedStyles, SmartCardSharedCssClassName } from './styles'; // new child entry point ./ui/index.tsx
+
+export { BaseTheme, Caption, ClearNextSiblingMarginTop, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH, Emoji, //exported from ./src/emoji.ts
+ErrorMessage, ExpandIconWrapper, ExpandLayoutWrapper, HelperMessage, MediaSingle, MediaSingleDimensionHelper, Mention, //exported from ./src/mention.ts
+Popup, UnsupportedBlock, UnsupportedInline, ValidMessage, WidthConsumer, WidthProvider, WithCreateAnalyticsEvent, calcColumnsFromPx, calcPctFromPx, calcPxFromColumns, calcPxFromPct, expandMessages, findOverflowScrollParent, getBreakpoint, layoutSupportsWidth, mapBreakpointToLayoutMaxWidth, overflowShadow, shadowClassNames, sharedExpandStyles, snapToGrid, withOuterListeners, MediaLink, wrappedLayouts, shouldAddDefaultWrappedWidth } from './ui'; // new child entry point ./ui/index.tsx
+
+// already exported by ./messages/index.ts
+export { linkMessages } from './messages/link'; // new child entry point in ./utils/index.ts
+
 export { validateADFEntity, validationErrorHandler } from './utils/validate-using-spec';

package/dist/esm/mention.js

@@ -0,0 +1,2 @@
+export { default as Mention } from './ui/Mention';
+export { MentionSharedCssClassName } from './styles/shared/mention';

package/dist/esm/messages/codeBidiWarning.js

@@ -0,0 +1,12 @@
+import { defineMessages } from 'react-intl';
+export var codeBidiWarningMessages = defineMessages({
+  /**
+   * Message taken from
+   * https://hello.atlassian.net/wiki/spaces/~tswan/pages/1366555782/PSHELP-2943+Investigate+Trojan+Source+Attack+Vulnerability+design
+   */
+  label: {
+    id: 'fabric.editor.codeBidiWarningLabel',
+    defaultMessage: 'Bidirectional characters change the order that text is rendered. This could be used to obscure malicious code.',
+    description: 'Tooltip message to present to users when a bidirectional character is encountered in code.'
+  }
+});

package/dist/esm/messages/index.js

@@ -1,2 +1,3 @@
+export { codeBidiWarningMessages } from './codeBidiWarning';
 export { linkMessages } from './link';
 export { unsupportedContentMessages } from './unsupportedContent';

package/dist/esm/styles/index.js

@@ -4,7 +4,7 @@ export { columnLayoutSharedStyle } from './shared/column-layout';
 export { mediaSingleSharedStyle, richMediaClassName } from './shared/media-single';
 export { blockquoteSharedStyles } from './shared/blockquote';
 export { headingsSharedStyles } from './shared/headings';
-export { getPanelTypeBackground, panelSharedStyles, PanelSharedCssClassName, PanelSharedSelectors } from './shared/panel';
+export { getPanelTypeBackground, panelSharedStyles, PanelSharedCssClassName, PanelSharedSelectors, getPanelBackgroundDarkModeColors } from './shared/panel';
 export { ruleSharedStyles } from './shared/rule';
 export { whitespaceSharedStyles } from './shared/whitespace';
 export { paragraphSharedStyles } from './shared/paragraph';
@@ -16,7 +16,9 @@ export { blockMarksSharedStyles } from './shared/block-marks';
 export { codeMarkSharedStyles } from './shared/code-mark';
 export { shadowSharedStyle } from './shared/shadow';
 export { dateSharedStyle, DateSharedCssClassName } from './shared/date';
-export { tasksAndDecisionsStyles, TaskDecisionSharedCssClassName } from './shared/task-decision';
+export { tasksAndDecisionsStyles, TaskDecisionSharedCssClassName } from './shared/task-decision'; // TODO: ED-13875 Remove MentionSharedCssClassName and EmojiSharedCssClassName
+// exports once root entry point for editor-common has been removed
+
 export { MentionSharedCssClassName } from './shared/mention';
 export { EmojiSharedCssClassName } from './shared/emoji';
 export { StatusSharedCssClassName } from './shared/status';

package/dist/esm/styles/shared/panel.js

@@ -1,11 +1,13 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 
 var _templateObject;
 
 import { css } from 'styled-components';
-import { hexToRgba, PanelType } from '@atlaskit/adf-schema';
+import { PanelType } from '@atlaskit/adf-schema';
 import { akEditorTableCellMinWidth, blockNodesVerticalMargin } from '@atlaskit/editor-shared-styles';
-import { emojiSprite } from '@atlaskit/emoji';
+import { akEditorCustomIconSize } from '@atlaskit/editor-shared-styles/consts';
+import { emojiImage, emojiSprite } from '@atlaskit/emoji';
 import * as colors from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import { borderRadius, gridSize } from '@atlaskit/theme/constants';
@@ -17,22 +19,67 @@ var lightPanelColor = {
   warning: colors.Y50,
   error: colors.R50
 };
-var darkPanelOpacity = 0.64;
-var darkPanelColor = {
-  info: colors.B500,
-  note: colors.P500,
-  tip: colors.G500,
-  success: colors.G500,
-  warning: colors.Y500,
-  error: colors.R500
-};
-var darkPanelBorderColor = {
-  info: colors.B400,
-  note: colors.P400,
-  tip: colors.G400,
-  success: colors.G400,
-  warning: colors.Y400,
-  error: colors.R400
+var darkPanelColors = {
+  // standard panels
+  info: '#0C294F',
+  error: "#441C13",
+  warning: "#413001",
+  tip: "#052E21",
+  success: "#052E21",
+  note: "#282249",
+  // Reds
+  R900: '#601D16',
+  // Red Saturated
+  R100S: "#FFEFEB",
+  R300S: "#FFB5A3",
+  R500S: "#FF6B47",
+  R800S: "#C4320E",
+  R1200S: "#441C13",
+  // Yellows
+  Y900: '#533F04',
+  // Yellow Saturated
+  Y100S: "#FFF3D1",
+  Y300S: "#FFDC7A",
+  Y500S: "#FFC933",
+  Y800S: "#D8A003",
+  Y1200S: "#413001",
+  // Greens
+  G900: '#164B35',
+  // Green Saturated
+  G100S: "#E3FCF0",
+  G300S: "#95EEC5",
+  G400S: "#60DCA8",
+  G900S: "#086848",
+  G1200S: "#052E21",
+  // Blues
+  B900: '#09326C',
+  // Saturated Blues
+  B100S: '#E5F0FF',
+  B300S: '#A3C9FF',
+  B500S: '#4794FF',
+  B800S: '#0055CC',
+  B1200S: '#0C294F',
+  // Purples
+  P900: "#352C63",
+  // Purple Saturated
+  P100S: "#EEEBFF",
+  P300S: "#CCC3FE",
+  P500S: "#A292F7",
+  P800S: "#5E49CA",
+  P1200S: "#282249",
+  // Teals
+  T900: '#1D474C',
+  // Teal Saturated
+  T100S: "#DBFAFF",
+  T300S: "#78EBFC",
+  T400S: "#3AD6EE",
+  T900S: "#056270",
+  T1200S: "#0B3037",
+  // Dark Mode Alpha
+  DNA20A: 'rgba(150, 176, 210, 0.53)',
+  DNA40A: 'rgba(134, 156, 180, 0.29)',
+  DNA80A: '#161A1D',
+  TextColor: '#D9DDE3'
 };
 var lightIconColor = {
   info: colors.B400,
@@ -49,15 +96,21 @@ var darkIconColor = {
   success: colors.G200,
   warning: colors.Y100,
   error: colors.R200
-};
-var darkTextColor = {
-  info: colors.B75,
-  note: colors.P75,
-  tip: colors.G75,
-  success: colors.G75,
-  warning: colors.Y75,
-  error: colors.R75
-};
+}; // New custom icons are a little smaller than predefined icons.
+// To fix alignment issues with custom icons, vertical alignment is updated.
+
+var panelEmojiSpriteVerticalAlignment = -(gridSize() * 3 - akEditorCustomIconSize) / 2;
+var panelEmojiImageVerticalAlignment = panelEmojiSpriteVerticalAlignment - 1;
+export var getPanelBackgroundDarkModeColors = [[colors.B50, darkPanelColors.B1200S], [colors.B75, darkPanelColors.B900], [colors.B100, darkPanelColors.B800S], [colors.N0, darkPanelColors.DNA80A], [colors.N20, darkPanelColors.DNA40A], [colors.N60, darkPanelColors.DNA20A], [colors.T50, darkPanelColors.T1200S], [colors.T75, darkPanelColors.T900], [colors.T100, darkPanelColors.T900S], [colors.G50, darkPanelColors.G1200S], [colors.G75, darkPanelColors.G900], [colors.G200, darkPanelColors.G900S], [colors.Y50, darkPanelColors.Y1200S], [colors.Y75, darkPanelColors.Y900], [colors.Y200, darkPanelColors.Y800S], [colors.R50, darkPanelColors.R1200S], [colors.R75, darkPanelColors.R900], [colors.R100, darkPanelColors.R800S], [colors.P50, darkPanelColors.P1200S], [colors.P75, darkPanelColors.P900], [colors.P100, darkPanelColors.P800S]].map(function (_ref) {
+  var _ref2 = _slicedToArray(_ref, 2),
+      colorName = _ref2[0],
+      colorValue = _ref2[1];
+
+  return getPanelDarkModeCSS(colorName, colorValue);
+}).join('\n');
+export function getPanelDarkModeCSS(colorName, colorValue) {
+  return "\n  &[data-panel-color=\"".concat(colorName, "\"] {\n    background-color: ").concat(colorValue, " !important; // !important to override default style color\n    color: ").concat(darkPanelColors.TextColor, ";\n  }\n  ");
+}
 var prefix = 'ak-editor-panel';
 export var PanelSharedCssClassName = {
   prefix: prefix,
@@ -74,7 +127,7 @@ export var PanelSharedSelectors = {
   removeButton: "button[aria-label=\"Remove\"]",
   colorPalette: "[aria-label=\"Background color\"]",
   selectedColor: "[aria-label=\"The smell\"]",
-  hideEmojiIcon: "[aria-label=\"Hide emoji\"]",
+  removeEmojiIcon: "[aria-label=\"Remove emoji\"]",
   emojiIcon: "[aria-label=\"editor-add-emoji\"]",
   selectedEmoji: "[aria-label=\":grinning:\"]",
   title: "#editor-title"
@@ -95,7 +148,7 @@ var iconDynamicStyles = function iconDynamicStyles(panelType) {
 export var getPanelTypeBackground = function getPanelTypeBackground(panelType) {
   var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   var light = lightPanelColor[panelType];
-  var dark = hexToRgba(darkPanelColor[panelType], darkPanelOpacity);
+  var dark = darkPanelColors[panelType];
   var background = themed({
     light: light,
     dark: dark
@@ -106,18 +159,14 @@ export var getPanelTypeBackground = function getPanelTypeBackground(panelType) {
 var mainDynamicStyles = function mainDynamicStyles(panelType) {
   return function (props) {
     var background = getPanelTypeBackground(panelType, props);
-    var darkText = darkTextColor[panelType];
-    var darkBorder = '1px solid ' + darkPanelBorderColor[panelType];
-    var border = themed({
-      light: 'none',
-      dark: darkBorder
-    })(props);
     var text = themed({
       light: 'inherit',
-      dark: darkText
+      dark: darkPanelColors.TextColor
     })(props);
-    return "\n    background-color: ".concat(background, ";\n    border: ").concat(border, ";\n    color: ").concat(text, ";\n  ");
+    return "\n    background-color: ".concat(background, ";\n    color: ").concat(text, ";\n  ");
   };
 };
 
-export var panelSharedStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    border-radius: ", "px;\n    margin: ", " 0 0;\n    padding: ", "px;\n    min-width: ", "px;\n    display: flex;\n    align-items: baseline;\n    word-break: break-word;\n\n    ", "\n\n    .", " {\n      display: block;\n      flex-shrink: 0;\n      height: ", "px;\n      width: ", "px;\n      box-sizing: content-box;\n      padding-right: ", "px;\n      text-align: center;\n      ", "\n\n      > span {\n        vertical-align: middle;\n        display: inline;\n      }\n\n      .", " {\n        vertical-align: -2px;\n      }\n    }\n\n    .ak-editor-panel__content {\n      margin: 1px 0 1px;\n      flex: 1 0 0;\n      /*\n        https://ishadeed.com/article/min-max-css/#setting-min-width-to-zero-with-flexbox\n        The default value for min-width is auto, which is computed to zero. When an element is a flex item, the value of min-width doesn\u2019t compute to zero. The minimum size of a flex item is equal to the size of its contents.\n      */\n      min-width: 0;\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n  }\n"])), PanelSharedCssClassName.prefix, borderRadius(), blockNodesVerticalMargin, gridSize(), akEditorTableCellMinWidth, mainDynamicStyles(PanelType.INFO), PanelSharedCssClassName.icon, gridSize() * 3, gridSize() * 3, gridSize(), iconDynamicStyles(PanelType.INFO), emojiSprite, PanelType.NOTE, mainDynamicStyles(PanelType.NOTE), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.NOTE), PanelType.TIP, mainDynamicStyles(PanelType.TIP), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.TIP), PanelType.WARNING, mainDynamicStyles(PanelType.WARNING), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.WARNING), PanelType.ERROR, mainDynamicStyles(PanelType.ERROR), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.ERROR), PanelType.SUCCESS, mainDynamicStyles(PanelType.SUCCESS), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.SUCCESS));
+export var panelSharedStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    border-radius: ", "px;\n    margin: ", " 0 0;\n    padding: ", "px;\n    min-width: ", "px;\n    display: flex;\n    position: relative;\n    align-items: baseline;\n    word-break: break-word;\n\n    ", "\n\n    .", " {\n      flex-shrink: 0;\n      height: ", "px;\n      width: ", "px;\n      box-sizing: content-box;\n      padding-right: ", "px;\n      text-align: center;\n      user-select: none;\n      -moz-user-select: none;\n      -webkit-user-select: none;\n      -ms-user-select: none;\n      ", "\n\n      > span {\n        vertical-align: middle;\n        display: inline;\n      }\n\n      .", " {\n        vertical-align: ", "px;\n      }\n\n      .", " {\n        vertical-align: ", "px;\n\n        // Vertical align only works for inline-block elements in Firefox\n        @-moz-document url-prefix() {\n          img {\n            display: inline-block;\n          }\n        }\n      }\n    }\n\n    .ak-editor-panel__content {\n      margin: 1px 0 1px;\n      flex: 1 0 0;\n      /*\n        https://ishadeed.com/article/min-max-css/#setting-min-width-to-zero-with-flexbox\n        The default value for min-width is auto, which is computed to zero. When an element is a flex item, the value of min-width doesn\u2019t compute to zero. The minimum size of a flex item is equal to the size of its contents.\n      */\n      min-width: 0;\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", "\n\n      .", " {\n        ", "\n      }\n    }\n\n    &[data-panel-type='", "'] {\n      ", ";\n    }\n  }\n"])), PanelSharedCssClassName.prefix, borderRadius(), blockNodesVerticalMargin, gridSize(), akEditorTableCellMinWidth, mainDynamicStyles(PanelType.INFO), PanelSharedCssClassName.icon, gridSize() * 3, gridSize() * 3, gridSize(), iconDynamicStyles(PanelType.INFO), emojiSprite, panelEmojiSpriteVerticalAlignment, emojiImage, panelEmojiImageVerticalAlignment, PanelType.NOTE, mainDynamicStyles(PanelType.NOTE), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.NOTE), PanelType.TIP, mainDynamicStyles(PanelType.TIP), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.TIP), PanelType.WARNING, mainDynamicStyles(PanelType.WARNING), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.WARNING), PanelType.ERROR, mainDynamicStyles(PanelType.ERROR), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.ERROR), PanelType.SUCCESS, mainDynamicStyles(PanelType.SUCCESS), PanelSharedCssClassName.icon, iconDynamicStyles(PanelType.SUCCESS), PanelType.CUSTOM, themed({
+  dark: getPanelBackgroundDarkModeColors
+}));

package/dist/esm/styles/shared/table.js

@@ -29,13 +29,13 @@ export var TableSharedCssClassName = {
   TABLE_CELL_NODEVIEW_CONTENT_DOM: tableCellContentDomSelector,
   TABLE_CELL_WRAPPER: tableCellSelector
 };
-var tableSharedStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    position: relative;\n    margin: 0 auto ", "px;\n    box-sizing: border-box;\n\n    /**\n     * Fix block top alignment inside table cells.\n     */\n    .decisionItemView-content-wrap:first-child > div {\n      margin-top: 0;\n    }\n  }\n  .", "[data-number-column='true'] {\n    padding-left: ", "px;\n  }\n  /* avoid applying styles to nested tables (possible via extensions) */\n  .", " > table,\n  .", " > table,\n  .", " > table {\n    border-collapse: collapse;\n    margin: ", "px ", "px 0 0;\n    border: ", "px solid\n      ", ";\n    table-layout: fixed;\n    font-size: 1em;\n    width: 100%;\n\n    &[data-autosize='true'] {\n      table-layout: auto;\n    }\n\n    & {\n      * {\n        box-sizing: border-box;\n      }\n      hr {\n        box-sizing: content-box;\n      }\n\n      tbody {\n        border-bottom: none;\n      }\n      th td {\n        background-color: white;\n      }\n      th,\n      td {\n        min-width: ", "px;\n        font-weight: normal;\n        vertical-align: top;\n        border: 1px solid\n          ", ";\n        border-right-width: 0;\n        border-bottom-width: 0;\n        padding: ", "px;\n        /* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n        ", "\n\n        ", ";\n\n        > *:first-child {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor.-right:first-child + * {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor:first-child + span + * {\n          margin-top: 0;\n        }\n\n        th p:not(:first-of-type),\n        td p:not(:first-of-type) {\n          margin-top: 12px;\n        }\n      }\n      th {\n        background-color: ", ";\n        text-align: left;\n\n        /* only apply this styling to codeblocks in default background headercells */\n        /* TODO this needs to be overhauled as it relies on unsafe selectors */\n        &:not([style]) {\n          .code-block {\n            background-image: ", ";\n            background-attachment: local, scroll, scroll;\n            background-position: 100% 0, 100% 0, 0 0;\n            background-color: ", ";\n\n            .line-number-gutter {\n              background-color: ", ";\n            }\n\n            /* this is only relevant to the element taken care of by renderer */\n            > [data-ds--code--code-block] {\n              background-image: ", "!important;\n\n              background-color: ", "!important;\n\n              // selector lives inside @atlaskit/code\n              --ds--code--line-number-bg-color: ", ";\n            }\n          }\n        }\n      }\n    }\n  }\n"])), TableSharedCssClassName.TABLE_CONTAINER, tableMarginBottom, TableSharedCssClassName.TABLE_CONTAINER, akEditorTableNumberColumnWidth - 1, TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, tableMarginTop, tableMarginSides, tableCellBorderWidth, themed({
+var tableSharedStyle = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .", " {\n    position: relative;\n    margin: 0 auto ", "px;\n    box-sizing: border-box;\n\n    /**\n     * Fix block top alignment inside table cells.\n     */\n    .decisionItemView-content-wrap:first-child > div {\n      margin-top: 0;\n    }\n  }\n  .", "[data-number-column='true'] {\n    padding-left: ", "px;\n    clear: both;\n  }\n  /* avoid applying styles to nested tables (possible via extensions) */\n  .", " > table,\n  .", " > table,\n  .", " > table {\n    border-collapse: collapse;\n    margin: ", "px ", "px 0 0;\n    border: ", "px solid\n      ", ";\n    table-layout: fixed;\n    font-size: 1em;\n    width: 100%;\n\n    &[data-autosize='true'] {\n      table-layout: auto;\n    }\n\n    & {\n      * {\n        box-sizing: border-box;\n      }\n      hr {\n        box-sizing: content-box;\n      }\n\n      tbody {\n        border-bottom: none;\n      }\n      th td {\n        background-color: white;\n      }\n      th,\n      td {\n        min-width: ", "px;\n        font-weight: normal;\n        vertical-align: top;\n        border: 1px solid\n          ", ";\n        border-right-width: 0;\n        border-bottom-width: 0;\n        padding: ", "px;\n        /* https://stackoverflow.com/questions/7517127/borders-not-shown-in-firefox-with-border-collapse-on-table-position-relative-o */\n        ", "\n\n        ", ";\n\n        > *:first-child {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor.-right:first-child + * {\n          margin-top: 0;\n        }\n\n        > .ProseMirror-gapcursor:first-child + span + * {\n          margin-top: 0;\n        }\n\n        th p:not(:first-of-type),\n        td p:not(:first-of-type) {\n          margin-top: 12px;\n        }\n      }\n      th {\n        background-color: ", ";\n        text-align: left;\n\n        /* only apply this styling to codeblocks in default background headercells */\n        /* TODO this needs to be overhauled as it relies on unsafe selectors */\n        &:not([style]) {\n          .code-block {\n            background-image: ", ";\n            background-attachment: local, scroll, scroll;\n            background-position: 100% 0, 100% 0, 0 0;\n            background-color: ", ";\n\n            .line-number-gutter {\n              background-color: ", ";\n            }\n\n            /* this is only relevant to the element taken care of by renderer */\n            > [data-ds--code--code-block] {\n              background-image: ", "!important;\n\n              background-color: ", "!important;\n\n              // selector lives inside @atlaskit/code\n              --ds--code--line-number-bg-color: ", ";\n            }\n          }\n        }\n      }\n    }\n  }\n"])), TableSharedCssClassName.TABLE_CONTAINER, tableMarginBottom, TableSharedCssClassName.TABLE_CONTAINER, akEditorTableNumberColumnWidth - 1, TableSharedCssClassName.TABLE_CONTAINER, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_STICKY_WRAPPER, tableMarginTop, tableMarginSides, tableCellBorderWidth, themed({
   light: akEditorTableBorder,
   dark: akEditorTableBorderDark
 }), tableCellMinWidth, themed({
   light: akEditorTableBorder,
   dark: akEditorTableBorderDark
-}), tableCellPadding, browser.gecko || browser.ie ? 'background-clip: padding-box;' : '', themed({
+}), tableCellPadding, browser.gecko || browser.ie || browser.mac && browser.chrome ? 'background-clip: padding-box;' : '', themed({
   dark: getTableCellBackgroundDarkModeColors
 }), themed({
   light: akEditorTableToolbar,