@atlaskit/editor-plugin-extension 11.0.14 → 11.0.15

package/dist/esm/ui/ConfigPanel/Fields/ColorPicker.js

@@ -26,105 +26,105 @@ import { validate as _validate } from '../utils';
 
 export var colorPalette = [{
   label: 'Light Blue',
-  value: "var(--ds-background-accent-blue-subtle, #7AB2FF)"
+  value: "var(--ds-background-accent-blue-subtle, #669DF1)"
 },
 // 400
 {
   label: 'Light Green',
-  value: "var(--ds-background-accent-green-subtle, #6BE1B0)"
+  value: "var(--ds-background-accent-green-subtle, #4BCE97)"
 },
 // 400
 {
   label: 'Light Yellow',
-  value: "var(--ds-background-accent-yellow-subtle, #FFDB57)"
+  value: "var(--ds-background-accent-yellow-subtle, #EED12B)"
 },
 // 400
 {
   label: 'Light Red',
-  value: "var(--ds-background-accent-red-subtle, #FF8F73)"
+  value: "var(--ds-background-accent-red-subtle, #F87168)"
 },
 // 400
 {
   label: 'Light Purple',
-  value: "var(--ds-background-accent-purple-subtle, #B5A7FB)"
+  value: "var(--ds-background-accent-purple-subtle, #C97CF4)"
 },
 // 400
 
 {
   label: 'Blue',
-  value: "var(--ds-chart-blue-bold, #247FFF)"
+  value: "var(--ds-chart-blue-bold, #4688EC)"
 },
 // 600
 {
   label: 'Green',
-  value: "var(--ds-chart-green-bold, #23A971)"
+  value: "var(--ds-chart-green-bold, #22A06B)"
 },
 // 600
 {
   label: 'Yellow',
-  value: "var(--ds-chart-yellow-bold, #FFBE33)"
+  value: "var(--ds-chart-yellow-bold, #B38600)"
 },
 // 600
 {
   label: 'Red',
-  value: "var(--ds-chart-red-bold, #FC552C)"
+  value: "var(--ds-chart-red-bold, #F15B50)"
 },
 // 600
 {
   label: 'Purple',
-  value: "var(--ds-chart-purple-bold, #8B77EE)"
+  value: "var(--ds-chart-purple-bold, #BF63F3)"
 },
 // 600
 
 {
   label: 'Dark Blue',
-  value: "var(--ds-chart-blue-bolder, #0055CC)"
+  value: "var(--ds-chart-blue-bolder, #357DE8)"
 },
 // 800
 {
   label: 'Dark Green',
-  value: "var(--ds-chart-green-bolder, #177D52)"
+  value: "var(--ds-chart-green-bolder, #1F845A)"
 },
 // 800
 {
   label: 'Dark Yellow',
-  value: "var(--ds-chart-yellow-bolder, #FF9D00)"
+  value: "var(--ds-chart-yellow-bolder, #946F00)"
 },
 // 800
 {
   label: 'Dark Red',
-  value: "var(--ds-chart-red-bolder, #D32D03)"
+  value: "var(--ds-chart-red-bolder, #E2483D)"
 },
 // 800
 {
   label: 'Dark Purple',
-  value: "var(--ds-chart-purple-bolder, #5A43D0)"
+  value: "var(--ds-chart-purple-bolder, #AF59E1)"
 },
 // 800
 
 {
   label: 'Darker Blue',
-  value: "var(--ds-chart-blue-boldest, #003884)"
+  value: "var(--ds-chart-blue-boldest, #1558BC)"
 },
 // 1000
 {
   label: 'Darker Green',
-  value: "var(--ds-chart-green-boldest, #055C3F)"
+  value: "var(--ds-chart-green-boldest, #216E4E)"
 },
 // 1000
 {
   label: 'Darker Yellow',
-  value: "var(--ds-chart-yellow-boldest, #946104)"
+  value: "var(--ds-chart-yellow-boldest, #7F5F01)"
 },
 // 1000
 {
   label: 'Darker Red',
-  value: "var(--ds-chart-red-boldest, #A32000)"
+  value: "var(--ds-chart-red-boldest, #AE2E24)"
 },
 // 1000
 {
   label: 'Darker Purple',
-  value: "var(--ds-chart-purple-boldest, #44368B)"
+  value: "var(--ds-chart-purple-boldest, #803FA5)"
 } // 1000
 ].map(function (color) {
   return _objectSpread(_objectSpread({}, color), {}, {
@@ -138,32 +138,32 @@ export var colorPalette = [{
  */
 export var extendedColorPalette = [{
   label: 'Darker Blue',
-  value: "var(--ds-chart-blue-boldest, #003884)"
+  value: "var(--ds-chart-blue-boldest, #1558BC)"
 },
 // 1000
 {
   label: 'Darker Teal',
-  value: "var(--ds-chart-teal-boldest, #206B74)"
+  value: "var(--ds-chart-teal-boldest, #206A83)"
 },
 // 1000
 {
   label: 'Darker Green',
-  value: "var(--ds-chart-green-boldest, #055C3F)"
+  value: "var(--ds-chart-green-boldest, #216E4E)"
 },
 // 1000
 {
   label: 'Darker Yellow',
-  value: "var(--ds-chart-yellow-boldest, #946104)"
+  value: "var(--ds-chart-yellow-boldest, #7F5F01)"
 },
 // 1000
 {
   label: 'Darker Orange',
-  value: "var(--ds-chart-orange-boldest, #974F0C)"
+  value: "var(--ds-chart-orange-boldest, #7A3B00)"
 },
 // 1000
 {
   label: 'Darker Red',
-  value: "var(--ds-chart-red-boldest, #A32000)"
+  value: "var(--ds-chart-red-boldest, #AE2E24)"
 },
 // 1000
 {
@@ -173,43 +173,43 @@ export var extendedColorPalette = [{
 // 1000
 {
   label: 'Darker Purple',
-  value: "var(--ds-chart-purple-boldest, #44368B)"
+  value: "var(--ds-chart-purple-boldest, #803FA5)"
 },
 // 1000
 {
   label: 'Darker Gray',
-  value: "var(--ds-chart-gray-boldest, #44546F)"
+  value: "var(--ds-chart-gray-boldest, #505258)"
 },
 // 1000
 
 {
   label: 'Dark Blue',
-  value: "var(--ds-chart-blue-bolder, #0055CC)"
+  value: "var(--ds-chart-blue-bolder, #357DE8)"
 },
 // 800
 {
   label: 'Dark Teal',
-  value: "var(--ds-chart-teal-bolder, #1D7F8C)"
+  value: "var(--ds-chart-teal-bolder, #227D9B)"
 },
 // 800
 {
   label: 'Dark Green',
-  value: "var(--ds-chart-green-bolder, #177D52)"
+  value: "var(--ds-chart-green-bolder, #1F845A)"
 },
 // 800
 {
   label: 'Dark Yellow',
-  value: "var(--ds-chart-yellow-bolder, #FF9D00)"
+  value: "var(--ds-chart-yellow-bolder, #946F00)"
 },
 // 800
 {
   label: 'Dark Orange',
-  value: "var(--ds-chart-orange-bolder, #B65C02)"
+  value: "var(--ds-chart-orange-bolder, #BD5B00)"
 },
 // 800
 {
   label: 'Dark Red',
-  value: "var(--ds-chart-red-bolder, #D32D03)"
+  value: "var(--ds-chart-red-bolder, #E2483D)"
 },
 // 800
 {
@@ -219,43 +219,43 @@ export var extendedColorPalette = [{
 // 800
 {
   label: 'Dark Purple',
-  value: "var(--ds-chart-purple-bolder, #5A43D0)"
+  value: "var(--ds-chart-purple-bolder, #AF59E1)"
 },
 // 800
 {
   label: 'Dark Gray',
-  value: "var(--ds-chart-gray-bolder, #758195)"
+  value: "var(--ds-chart-gray-bolder, #7D818A)"
 },
 // 800
 
 {
   label: 'Blue',
-  value: "var(--ds-chart-blue-bold, #247FFF)"
+  value: "var(--ds-chart-blue-bold, #4688EC)"
 },
 // 600
 {
   label: 'Teal',
-  value: "var(--ds-chart-teal-bold, #1D9AAA)"
+  value: "var(--ds-chart-teal-bold, #2898BD)"
 },
 // 600
 {
   label: 'Green',
-  value: "var(--ds-chart-green-bold, #23A971)"
+  value: "var(--ds-chart-green-bold, #22A06B)"
 },
 // 600
 {
   label: 'Yellow',
-  value: "var(--ds-chart-yellow-bold, #FFBE33)"
+  value: "var(--ds-chart-yellow-bold, #B38600)"
 },
 // 600
 {
   label: 'Orange',
-  value: "var(--ds-chart-orange-bold, #D97008)"
+  value: "var(--ds-chart-orange-bold, #E06C00)"
 },
 // 600
 {
   label: 'Red',
-  value: "var(--ds-chart-red-bold, #FC552C)"
+  value: "var(--ds-chart-red-bold, #F15B50)"
 },
 // 600
 {
@@ -265,43 +265,43 @@ export var extendedColorPalette = [{
 // 600
 {
   label: 'Purple',
-  value: "var(--ds-chart-purple-bold, #8B77EE)"
+  value: "var(--ds-chart-purple-bold, #BF63F3)"
 },
 // 600
 {
   label: 'Gray',
-  value: "var(--ds-chart-gray-bold, #8590A2)"
+  value: "var(--ds-chart-gray-bold, #8C8F97)"
 },
 // 600
 
 {
   label: 'Light Blue',
-  value: "var(--ds-background-accent-blue-subtle, #7AB2FF)"
+  value: "var(--ds-background-accent-blue-subtle, #669DF1)"
 },
 // 400
 {
   label: 'Light Teal',
-  value: "var(--ds-background-accent-teal-subtle, #60C6D2)"
+  value: "var(--ds-background-accent-teal-subtle, #6CC3E0)"
 },
 // 400
 {
   label: 'Light Green',
-  value: "var(--ds-background-accent-green-subtle, #6BE1B0)"
+  value: "var(--ds-background-accent-green-subtle, #4BCE97)"
 },
 // 400
 {
   label: 'Light Yellow',
-  value: "var(--ds-background-accent-yellow-subtle, #FFDB57)"
+  value: "var(--ds-background-accent-yellow-subtle, #EED12B)"
 },
 // 400
 {
   label: 'Light Orange',
-  value: "var(--ds-background-accent-orange-subtle, #FAA53D)"
+  value: "var(--ds-background-accent-orange-subtle, #FCA700)"
 },
 // 400
 {
   label: 'Light Red',
-  value: "var(--ds-background-accent-red-subtle, #FF8F73)"
+  value: "var(--ds-background-accent-red-subtle, #F87168)"
 },
 // 400
 {
@@ -311,12 +311,12 @@ export var extendedColorPalette = [{
 // 400
 {
   label: 'Light Purple',
-  value: "var(--ds-background-accent-purple-subtle, #B5A7FB)"
+  value: "var(--ds-background-accent-purple-subtle, #C97CF4)"
 },
 // 400
 {
   label: 'Light Gray',
-  value: "var(--ds-background-accent-gray-subtle, #8993A5)"
+  value: "var(--ds-background-accent-gray-subtle, #8C8F97)"
 } // 400
 ].map(function (color) {
   return _objectSpread(_objectSpread({}, color), {}, {

package/dist/esm/ui/ConfigPanel/Fields/Expand.js

@@ -12,9 +12,8 @@ import { IconButton } from '@atlaskit/button/new';
 import { configPanelMessages as messages } from '@atlaskit/editor-common/extensions';
 import ChevronDownIcon from '@atlaskit/icon/core/chevron-down';
 import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
-import { N40 } from '@atlaskit/theme/colors';
 var expandContainerStyles = css({
-  borderBottom: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, ".concat(N40, ")"))
+  borderBottom: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)")
 });
 var expandControlStyles = css({
   display: 'flex',

package/dist/esm/ui/ConfigPanel/Fields/Fieldset.js

@@ -28,10 +28,9 @@ import AddCircleIcon from '@atlaskit/icon/core/add';
 import { Box, Text, xcss } from '@atlaskit/primitives';
 import SectionMessage from '@atlaskit/section-message';
 import Select from '@atlaskit/select';
-import { N40A } from '@atlaskit/theme/colors';
 import { getNameFromDuplicateField, isDuplicateField } from '../utils';
 var actionsWrapperStyles = css({
-  borderTop: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, ".concat(N40A, ")")),
+  borderTop: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)"),
   marginTop: "var(--ds-space-200, 16px)",
   paddingTop: "var(--ds-space-200, 16px)"
 });

package/dist/esm/ui/ConfigPanel/Fields/SelectItem.js

@@ -46,7 +46,7 @@ export var formatOptionLabel = function formatOptionLabel(_ref, _ref2) {
     appearance: "square"
   }) : icon), jsx("div", {
     style: {
-      paddingLeft: icon ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0)"
+      paddingLeft: icon ? "var(--ds-space-100, 8px)" : "var(--ds-space-0, 0px)"
     },
     "data-testid": "extension-option-label"
   }, label, description && context !== 'value' && jsx("small", null, description)));

package/dist/esm/ui/ConfigPanel/Header/HeaderIcon.js

@@ -7,7 +7,7 @@ var itemIconStyles = xcss({
   width: iconWidth,
   height: iconWidth,
   overflow: 'hidden',
-  border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, rgba(223, 225, 229, 0.5))"),
+  border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)"),
   borderRadius: "var(--ds-radius-small, 3px)",
   boxSizing: 'border-box',
   display: 'flex',

package/dist/esm/ui/ConfigPanel/Header.js

@@ -13,7 +13,6 @@ import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 import CrossIcon from '@atlaskit/icon/core/cross';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, Text, xcss } from '@atlaskit/primitives';
-import { N200 } from '@atlaskit/theme/colors';
 import { HelpLink } from './HelpLink';
 var iconWidth = 40;
 var buttonWidth = 40;
@@ -27,7 +26,7 @@ var itemIconStyles = css({
   width: iconWidth,
   height: iconWidth,
   overflow: 'hidden',
-  border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, rgba(223, 225, 229, 0.5))"),
+  border: "var(--ds-border-width, 1px)".concat(" solid ", "var(--ds-border, #0B120E24)"),
   borderRadius: "var(--ds-radius-small, 3px)",
   boxSizing: 'border-box',
   display: 'flex',
@@ -63,7 +62,7 @@ var itemTextStyles = css({
   itemSummary: {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     fontSize: relativeFontSizeToBase16(11.67),
-    color: "var(--ds-text-subtlest, ".concat(N200, ")"),
+    color: "var(--ds-text-subtlest, #6B6E76)",
     marginTop: "var(--ds-space-050, 4px)",
     whiteSpace: 'nowrap',
     overflow: 'hidden',

package/dist/esm/ui/ConfigPanel/NestedForms/RemovableField.js

@@ -9,7 +9,6 @@ import { css, jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
 import { configPanelMessages as messages } from '@atlaskit/editor-common/extensions';
 import CrossCircleIcon from '@atlaskit/icon/core/cross-circle';
-import { N80, R300 } from '@atlaskit/theme/colors';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import Tooltip from '@atlaskit/tooltip';
 var removableFieldWrapperStyles = css({
@@ -24,9 +23,9 @@ var removeButtonWrapperStyles = css({
   right: 0,
   top: 0,
   cursor: 'pointer',
-  color: "var(--ds-icon-subtle, ".concat(N80, ")"),
+  color: "var(--ds-icon-subtle, #505258)",
   '&:hover': {
-    color: "var(--ds-icon-danger, ".concat(R300, ")")
+    color: "var(--ds-icon-danger, #C9372C)"
   }
 });
 var RemovableField = function RemovableField(_ref) {

package/dist/esm/ui/SaveIndicator/SaveIndicator.js

@@ -12,7 +12,6 @@ import { messages } from '@atlaskit/editor-common/extensions';
 import CheckCircleIcon from '@atlaskit/icon/core/status-success';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, Text, xcss } from '@atlaskit/primitives';
-import { G300, N0 } from '@atlaskit/theme/colors';
 var noop = function noop() {};
 var saveIndicatorWrapperStyles = css({
   display: 'flex',
@@ -26,9 +25,9 @@ var saveIndicatorContentStyles = css({
   flexDirection: 'row',
   alignItems: 'center',
   padding: "var(--ds-space-075, 6px)".concat(" ", "var(--ds-space-150, 12px)"),
-  background: "var(--ds-surface-overlay, ".concat(N0, ")"),
+  background: "var(--ds-surface-overlay, #FFFFFF)",
   /* E300 */
-  boxShadow: "var(--ds-shadow-overlay, ".concat("0px 8px 12px rgba(9, 30, 66, 0.15), 0px 0px 1px rgba(9, 30, 66, 0.31)", ")"),
+  boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)",
   borderRadius: "var(--ds-radius-xxlarge, 16px)"
 });
 var saveIndicatorTextStyles = xcss({
@@ -70,7 +69,7 @@ export var SaveIndicator = function SaveIndicator(_ref) {
     "data-testid": "save-indicator-content"
   }, jsx(CheckCircleIcon, {
     label: "Saving",
-    color: "var(--ds-icon-success, ".concat(G300, ")"),
+    color: "var(--ds-icon-success, #6A9A23)",
     spacing: "none"
   }), jsx(Box, {
     xcss: saveIndicatorTextStyles

package/example-utils/config-panel/ConfigPanelWithExtensionPicker.tsx

@@ -21,9 +21,6 @@ import Heading from '@atlaskit/heading';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
 import TextArea from '@atlaskit/textarea';
-// Ignored via go/ees005
-// eslint-disable-next-line import/no-namespace
-import * as colors from '@atlaskit/theme/colors';
 import { token } from '@atlaskit/tokens';
 
 import { useStateFromPromise } from '../../src/ui/ConfigPanel/use-state-from-promise';
@@ -41,17 +38,16 @@ const column = (width: number | string) =>
 	css({
 		// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 		width: `${width}px`,
-		margin: token('space.200', '16px'),
+		margin: token('space.200'),
 		// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
 		h3: {
-			// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-			borderBottom: `${token('border.width')} solid ${colors.N50}`,
-			marginBottom: token('space.200', '16px'),
+			borderBottom: `${token('border.width')} solid ${token('color.border')}`,
+			marginBottom: token('space.200'),
 		},
 	});
 
 const codeWrapperStyles = css({
-	marginTop: token('space.200', '16px'),
+	marginTop: token('space.200'),
 });
 
 function ExtensionConfigPanel({

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-extension",
-	"version": "11.0.14",
+	"version": "11.0.15",
 	"description": "editor-plugin-extension plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -46,7 +46,7 @@
 		"@atlaskit/empty-state": "^10.1.0",
 		"@atlaskit/form": "^15.5.0",
 		"@atlaskit/heading": "^5.3.0",
-		"@atlaskit/icon": "^33.0.0",
+		"@atlaskit/icon": "^33.1.0",
 		"@atlaskit/link": "^3.3.0",
 		"@atlaskit/mention": "^24.6.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
@@ -59,8 +59,7 @@
 		"@atlaskit/tabs": "^19.0.0",
 		"@atlaskit/textarea": "^8.2.0",
 		"@atlaskit/textfield": "^8.2.0",
-		"@atlaskit/theme": "^22.0.0",
-		"@atlaskit/tmp-editor-statsig": "^46.0.0",
+		"@atlaskit/tmp-editor-statsig": "^46.1.0",
 		"@atlaskit/toggle": "^15.2.0",
 		"@atlaskit/tokens": "^11.2.0",
 		"@atlaskit/tooltip": "^21.0.0",
@@ -74,7 +73,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^112.9.0",
+		"@atlaskit/editor-common": "^112.10.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},