@atlaskit/editor-plugin-extension 0.5.1 → 0.5.2

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/editor-plugin-extension
 
+## 0.5.2
+
+### Patch Changes
+
+- [#66759](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/66759) [`906578f1ea5d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/906578f1ea5d) - [ux] ED-21787: Migrating few CSS entries to space and color tokens
+
 ## 0.5.1
 
 ### Patch Changes

package/dist/cjs/ui/ConfigPanel/Fields/Boolean.js

@@ -26,7 +26,7 @@ var toggleFieldWrapperStyles = (0, _react2.css)({
 });
 var toggleLabelStyles = (0, _react2.css)({
   display: 'flex',
-  padding: '3px 3px 3px 0px',
+  padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-050, 4px)", " ", "var(--ds-space-050, 4px)", " ", "var(--ds-space-0, 0px)"),
   flexGrow: 1
 });
 function _validate(value, isRequired) {

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

@@ -362,7 +362,10 @@ var ColorPicker = function ColorPicker(props) {
       height: "var(--ds-space-300, 24px)"
     }
     /* ED-18288 We align the palette to the right edge which is 1.5rem spacing away to avoid
-      excess overflow on left. Additional 1 is to mitigate 1px added by floating toolbar. */,
+      excess overflow on left. Additional 1 is to mitigate 1px added by floating toolbar. */
+    // Disabling design token check as this is a calculated value
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+    ,
     absoluteOffset: {
       right: Number(-1.5 * getCurrentRemSize() - 1)
     }

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

@@ -22,9 +22,11 @@ var itemWrapperStyles = (0, _react.css)({
 var iconWrapperStyles = (0, _react.css)({
   lineHeight: 1
 });
+
+// Adding 4px instead of 3px, since Design tokens supports space sizes in 2 multiples only Ref: https://atlassian.design/components/tokens/all-tokens
 var iconWrapperMenuStyles = (0, _react.css)({
   alignSelf: 'flex-start',
-  marginTop: '3px'
+  marginTop: "var(--ds-space-050, 4px)"
 });
 var getIconSize = function getIconSize(context, description) {
   if (context === 'value' || !description) {

package/dist/es2019/ui/ConfigPanel/Fields/Boolean.js

@@ -13,7 +13,7 @@ const toggleFieldWrapperStyles = css({
 });
 const toggleLabelStyles = css({
   display: 'flex',
-  padding: '3px 3px 3px 0px',
+  padding: `${"var(--ds-space-050, 4px)"} ${"var(--ds-space-050, 4px)"} ${"var(--ds-space-050, 4px)"} ${"var(--ds-space-0, 0px)"}`,
   flexGrow: 1
 });
 function validate(value, isRequired) {

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

@@ -353,7 +353,10 @@ const ColorPicker = props => {
       height: "var(--ds-space-300, 24px)"
     }
     /* ED-18288 We align the palette to the right edge which is 1.5rem spacing away to avoid
-      excess overflow on left. Additional 1 is to mitigate 1px added by floating toolbar. */,
+      excess overflow on left. Additional 1 is to mitigate 1px added by floating toolbar. */
+    // Disabling design token check as this is a calculated value
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+    ,
     absoluteOffset: {
       right: Number(-1.5 * getCurrentRemSize() - 1)
     }

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

@@ -14,9 +14,11 @@ const itemWrapperStyles = css({
 const iconWrapperStyles = css({
   lineHeight: 1
 });
+
+// Adding 4px instead of 3px, since Design tokens supports space sizes in 2 multiples only Ref: https://atlassian.design/components/tokens/all-tokens
 const iconWrapperMenuStyles = css({
   alignSelf: 'flex-start',
-  marginTop: '3px'
+  marginTop: "var(--ds-space-050, 4px)"
 });
 const getIconSize = (context, description) => {
   if (context === 'value' || !description) {

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

@@ -16,7 +16,7 @@ var toggleFieldWrapperStyles = css({
 });
 var toggleLabelStyles = css({
   display: 'flex',
-  padding: '3px 3px 3px 0px',
+  padding: "var(--ds-space-050, 4px)".concat(" ", "var(--ds-space-050, 4px)", " ", "var(--ds-space-050, 4px)", " ", "var(--ds-space-0, 0px)"),
   flexGrow: 1
 });
 function _validate(value, isRequired) {

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

@@ -356,7 +356,10 @@ var ColorPicker = function ColorPicker(props) {
       height: "var(--ds-space-300, 24px)"
     }
     /* ED-18288 We align the palette to the right edge which is 1.5rem spacing away to avoid
-      excess overflow on left. Additional 1 is to mitigate 1px added by floating toolbar. */,
+      excess overflow on left. Additional 1 is to mitigate 1px added by floating toolbar. */
+    // Disabling design token check as this is a calculated value
+    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
+    ,
     absoluteOffset: {
       right: Number(-1.5 * getCurrentRemSize() - 1)
     }

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

@@ -14,9 +14,11 @@ var itemWrapperStyles = css({
 var iconWrapperStyles = css({
   lineHeight: 1
 });
+
+// Adding 4px instead of 3px, since Design tokens supports space sizes in 2 multiples only Ref: https://atlassian.design/components/tokens/all-tokens
 var iconWrapperMenuStyles = css({
   alignSelf: 'flex-start',
-  marginTop: '3px'
+  marginTop: "var(--ds-space-050, 4px)"
 });
 var getIconSize = function getIconSize(context, description) {
   if (context === 'value' || !description) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-extension",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "description": "editor-plugin-extension plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",