@atlaskit/tokens 0.1.0 → 0.3.0

package/dist/cjs/tokens/token-default-values.js

@@ -0,0 +1,104 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+// THIS IS AN AUTO-GENERATED FILE DO NOT MODIFY DIRECTLY
+// Re-generate by running `yarn build tokens`.
+
+/**
+ * A map of token names to their value in the default Atlassian theme ('light')
+ */
+var defaultTokenValues = {
+  'color.accent.boldBlue': '#579DFF',
+  'color.accent.boldGreen': '#3ACF91',
+  'color.accent.boldOrange': '#FFA333',
+  'color.accent.boldPurple': '#9F8FEF',
+  'color.accent.boldRed': '#F97362',
+  'color.accent.boldTeal': '#53C8D5',
+  'color.accent.subtleBlue': '#CCE0FF',
+  'color.accent.subtleGreen': '#AFF3D6',
+  'color.accent.subtleMagenta': '#FDD0EC',
+  'color.accent.subtleOrange': '#FFDEB8',
+  'color.accent.subtlePurple': '#DFD8FD',
+  'color.accent.subtleRed': '#FFD2CC',
+  'color.accent.subtleTeal': '#ADEEF5',
+  'color.background.sunken': '#091E4208',
+  'color.background.default': '#FFFFFF',
+  'color.background.card': '#FFFFFF',
+  'color.background.overlay': '#FFFFFF',
+  'color.background.selected.resting': '#E9F2FF',
+  'color.background.selected.hover': '#CCE0FF',
+  'color.background.selected.pressed': '#85B8FF',
+  'color.background.blanket': '#091E427A',
+  'color.background.disabled': '#091E420F',
+  'color.background.boldBrand.resting': '#0C66E4',
+  'color.background.boldBrand.hover': '#0055CC',
+  'color.background.boldBrand.pressed': '#09326C',
+  'color.background.subtleBrand.resting': '#E9F2FF',
+  'color.background.subtleBrand.hover': '#CCE0FF',
+  'color.background.subtleBrand.pressed': '#85B8FF',
+  'color.background.boldDanger.resting': '#CE2E1C',
+  'color.background.boldDanger.hover': '#B22515',
+  'color.background.boldDanger.pressed': '#601D16',
+  'color.background.subtleDanger.resting': '#FFEDEB',
+  'color.background.subtleDanger.hover': '#FFD2CC',
+  'color.background.subtleDanger.pressed': '#FF9A8F',
+  'color.background.boldWarning.resting': '#EBB800',
+  'color.background.boldWarning.hover': '#D19D00',
+  'color.background.boldWarning.pressed': '#B38600',
+  'color.background.subtleWarning.resting': '#FFF7D6',
+  'color.background.subtleWarning.hover': '#FFE785',
+  'color.background.subtleWarning.pressed': '#FFD138',
+  'color.background.boldSuccess.resting': '#1F845A',
+  'color.background.boldSuccess.hover': '#216E4E',
+  'color.background.boldSuccess.pressed': '#164B35',
+  'color.background.subtleSuccess.resting': '#DFFCF0',
+  'color.background.subtleSuccess.hover': '#AFF3D6',
+  'color.background.subtleSuccess.pressed': '#76E0B4',
+  'color.background.boldDiscovery.resting': '#6E5DC6',
+  'color.background.boldDiscovery.hover': '#5E4DB2',
+  'color.background.boldDiscovery.pressed': '#352C63',
+  'color.background.subtleDiscovery.resting': '#F3F0FF',
+  'color.background.subtleDiscovery.hover': '#DFD8FD',
+  'color.background.subtleDiscovery.pressed': '#B8ACF6',
+  'color.background.boldNeutral.resting': '#44546F',
+  'color.background.boldNeutral.hover': '#2C3E5D',
+  'color.background.boldNeutral.pressed': '#172B4D',
+  'color.background.transparentNeutral.hover': '#091E420F',
+  'color.background.transparentNeutral.pressed': '#091E4224',
+  'color.background.subtleNeutral.resting': '#091E420F',
+  'color.background.subtleNeutral.hover': '#091E4224',
+  'color.background.subtleNeutral.pressed': '#091E424F',
+  'color.background.subtleBorderedNeutral.resting': '#091E4208',
+  'color.background.subtleBorderedNeutral.pressed': '#091E420F',
+  'color.border.focus': '#388BFF',
+  'color.border.neutral': '#091E4224',
+  'color.iconBorder.brand': '#1D7AFC',
+  'color.iconBorder.danger': '#E8422C',
+  'color.iconBorder.warning': '#DB6E00',
+  'color.iconBorder.success': '#22A06B',
+  'color.iconBorder.discovery': '#8270DB',
+  'color.overlay.hover': '#091E424F',
+  'color.overlay.pressed': '#091E427A',
+  'color.text.selected': '#0C66E4',
+  'color.text.highEmphasis': '#172B4D',
+  'color.text.mediumEmphasis': '#44546F',
+  'color.text.lowEmphasis': '#626F86',
+  'color.text.onBold': '#FFFFFF',
+  'color.text.onBoldWarning': '#172B4D',
+  'color.text.link.resting': '#0C66E4',
+  'color.text.link.pressed': '#0055CC',
+  'color.text.brand': '#0055CC',
+  'color.text.warning': '#974F0C',
+  'color.text.danger': '#B22515',
+  'color.text.success': '#216E4E',
+  'color.text.discovery': '#5E4DB2',
+  'color.text.disabled': '#8993A5',
+  'shadow.card': '0px 1px 1px #091E4240, 0px 0px 1px #091E424F',
+  'shadow.overlay': '0px 8px 12px #091E4226, 0px 0px 1px #091E424F',
+  'utility.UNSAFE_util.transparent': 'transparent'
+};
+var _default = defaultTokenValues;
+exports.default = _default;

package/dist/cjs/tokens/token-names.js

@@ -7,87 +7,94 @@ exports.default = void 0;
 // THIS IS AN AUTO-GENERATED FILE DO NOT MODIFY DIRECTLY
 // Re-generate by running `yarn build tokens`.
 var tokens = {
-  'color.accent.subtleBlue': '--accent-subtleBlue',
-  'color.accent.subtleGreen': '--accent-subtleGreen',
-  'color.accent.subtleMagenta': '--accent-subtleMagenta',
-  'color.accent.subtleOrange': '--accent-subtleOrange',
-  'color.accent.subtlePurple': '--accent-subtlePurple',
-  'color.accent.subtleRed': '--accent-subtleRed',
-  'color.accent.subtleTeal': '--accent-subtleTeal',
-  'color.background.sunken': '--background-sunken',
-  'color.background.default': '--background-default',
-  'color.background.card': '--background-card',
-  'color.background.overlay': '--background-overlay',
-  'color.background.selected.resting': '--background-selected-resting',
-  'color.background.selected.hover': '--background-selected-hover',
-  'color.background.selected.pressed': '--background-selected-pressed',
-  'color.background.blanket': '--background-blanket',
-  'color.background.disabled': '--background-disabled',
-  'color.background.boldBrand.resting': '--background-boldBrand-resting',
-  'color.background.boldBrand.hover': '--background-boldBrand-hover',
-  'color.background.boldBrand.pressed': '--background-boldBrand-pressed',
-  'color.background.subtleBrand.resting': '--background-subtleBrand-resting',
-  'color.background.subtleBrand.hover': '--background-subtleBrand-hover',
-  'color.background.subtleBrand.pressed': '--background-subtleBrand-pressed',
-  'color.background.boldDanger.resting': '--background-boldDanger-resting',
-  'color.background.boldDanger.hover': '--background-boldDanger-hover',
-  'color.background.boldDanger.pressed': '--background-boldDanger-pressed',
-  'color.background.subtleDanger.resting': '--background-subtleDanger-resting',
-  'color.background.subtleDanger.hover': '--background-subtleDanger-hover',
-  'color.background.subtleDanger.pressed': '--background-subtleDanger-pressed',
-  'color.background.boldWarning.resting': '--background-boldWarning-resting',
-  'color.background.boldWarning.hover': '--background-boldWarning-hover',
-  'color.background.boldWarning.pressed': '--background-boldWarning-pressed',
-  'color.background.subtleWarning.resting': '--background-subtleWarning-resting',
-  'color.background.subtleWarning.hover': '--background-subtleWarning-hover',
-  'color.background.subtleWarning.pressed': '--background-subtleWarning-pressed',
-  'color.background.boldSuccess.resting': '--background-boldSuccess-resting',
-  'color.background.boldSuccess.hover': '--background-boldSuccess-hover',
-  'color.background.boldSuccess.pressed': '--background-boldSuccess-pressed',
-  'color.background.subtleSuccess.resting': '--background-subtleSuccess-resting',
-  'color.background.subtleSuccess.hover': '--background-subtleSuccess-hover',
-  'color.background.subtleSuccess.pressed': '--background-subtleSuccess-pressed',
-  'color.background.boldDiscovery.resting': '--background-boldDiscovery-resting',
-  'color.background.boldDiscovery.hover': '--background-boldDiscovery-hover',
-  'color.background.boldDiscovery.pressed': '--background-boldDiscovery-pressed',
-  'color.background.subtleDiscovery.resting': '--background-subtleDiscovery-resting',
-  'color.background.subtleDiscovery.hover': '--background-subtleDiscovery-hover',
-  'color.background.subtleDiscovery.pressed': '--background-subtleDiscovery-pressed',
-  'color.background.boldNeutral.resting': '--background-boldNeutral-resting',
-  'color.background.boldNeutral.hover': '--background-boldNeutral-hover',
-  'color.background.boldNeutral.pressed': '--background-boldNeutral-pressed',
-  'color.background.transparentNeutral.hover': '--background-transparentNeutral-hover',
-  'color.background.transparentNeutral.pressed': '--background-transparentNeutral-pressed',
-  'color.background.subtleNeutral.resting': '--background-subtleNeutral-resting',
-  'color.background.subtleNeutral.hover': '--background-subtleNeutral-hover',
-  'color.background.subtleNeutral.pressed': '--background-subtleNeutral-pressed',
-  'color.background.subtleBorderedNeutral.resting': '--background-subtleBorderedNeutral-resting',
-  'color.background.subtleBorderedNeutral.pressed': '--background-subtleBorderedNeutral-pressed',
-  'color.border.focus': '--border-focus',
-  'color.border.neutral': '--border-neutral',
-  'color.iconBorder.brand': '--iconBorder-brand',
-  'color.iconBorder.danger': '--iconBorder-danger',
-  'color.iconBorder.warning': '--iconBorder-warning',
-  'color.iconBorder.success': '--iconBorder-success',
-  'color.iconBorder.discovery': '--iconBorder-discovery',
-  'color.overlay.hover': '--overlay-hover',
-  'color.overlay.pressed': '--overlay-pressed',
-  'color.text.selected': '--text-selected',
-  'color.text.highEmphasis': '--text-highEmphasis',
-  'color.text.mediumEmphasis': '--text-mediumEmphasis',
-  'color.text.lowEmphasis': '--text-lowEmphasis',
-  'color.text.onBold': '--text-onBold',
-  'color.text.onBoldWarning': '--text-onBoldWarning',
-  'color.text.link.resting': '--text-link-resting',
-  'color.text.link.pressed': '--text-link-pressed',
-  'color.text.brand': '--text-brand',
-  'color.text.warning': '--text-warning',
-  'color.text.danger': '--text-danger',
-  'color.text.success': '--text-success',
-  'color.text.discovery': '--text-discovery',
-  'color.text.disabled': '--text-disabled',
-  'shadow.card': '--card',
-  'shadow.overlay': '--overlay'
+  'color.accent.boldBlue': '--ds-accent-boldBlue',
+  'color.accent.boldGreen': '--ds-accent-boldGreen',
+  'color.accent.boldOrange': '--ds-accent-boldOrange',
+  'color.accent.boldPurple': '--ds-accent-boldPurple',
+  'color.accent.boldRed': '--ds-accent-boldRed',
+  'color.accent.boldTeal': '--ds-accent-boldTeal',
+  'color.accent.subtleBlue': '--ds-accent-subtleBlue',
+  'color.accent.subtleGreen': '--ds-accent-subtleGreen',
+  'color.accent.subtleMagenta': '--ds-accent-subtleMagenta',
+  'color.accent.subtleOrange': '--ds-accent-subtleOrange',
+  'color.accent.subtlePurple': '--ds-accent-subtlePurple',
+  'color.accent.subtleRed': '--ds-accent-subtleRed',
+  'color.accent.subtleTeal': '--ds-accent-subtleTeal',
+  'color.background.sunken': '--ds-background-sunken',
+  'color.background.default': '--ds-background-default',
+  'color.background.card': '--ds-background-card',
+  'color.background.overlay': '--ds-background-overlay',
+  'color.background.selected.resting': '--ds-background-selected-resting',
+  'color.background.selected.hover': '--ds-background-selected-hover',
+  'color.background.selected.pressed': '--ds-background-selected-pressed',
+  'color.background.blanket': '--ds-background-blanket',
+  'color.background.disabled': '--ds-background-disabled',
+  'color.background.boldBrand.resting': '--ds-background-boldBrand-resting',
+  'color.background.boldBrand.hover': '--ds-background-boldBrand-hover',
+  'color.background.boldBrand.pressed': '--ds-background-boldBrand-pressed',
+  'color.background.subtleBrand.resting': '--ds-background-subtleBrand-resting',
+  'color.background.subtleBrand.hover': '--ds-background-subtleBrand-hover',
+  'color.background.subtleBrand.pressed': '--ds-background-subtleBrand-pressed',
+  'color.background.boldDanger.resting': '--ds-background-boldDanger-resting',
+  'color.background.boldDanger.hover': '--ds-background-boldDanger-hover',
+  'color.background.boldDanger.pressed': '--ds-background-boldDanger-pressed',
+  'color.background.subtleDanger.resting': '--ds-background-subtleDanger-resting',
+  'color.background.subtleDanger.hover': '--ds-background-subtleDanger-hover',
+  'color.background.subtleDanger.pressed': '--ds-background-subtleDanger-pressed',
+  'color.background.boldWarning.resting': '--ds-background-boldWarning-resting',
+  'color.background.boldWarning.hover': '--ds-background-boldWarning-hover',
+  'color.background.boldWarning.pressed': '--ds-background-boldWarning-pressed',
+  'color.background.subtleWarning.resting': '--ds-background-subtleWarning-resting',
+  'color.background.subtleWarning.hover': '--ds-background-subtleWarning-hover',
+  'color.background.subtleWarning.pressed': '--ds-background-subtleWarning-pressed',
+  'color.background.boldSuccess.resting': '--ds-background-boldSuccess-resting',
+  'color.background.boldSuccess.hover': '--ds-background-boldSuccess-hover',
+  'color.background.boldSuccess.pressed': '--ds-background-boldSuccess-pressed',
+  'color.background.subtleSuccess.resting': '--ds-background-subtleSuccess-resting',
+  'color.background.subtleSuccess.hover': '--ds-background-subtleSuccess-hover',
+  'color.background.subtleSuccess.pressed': '--ds-background-subtleSuccess-pressed',
+  'color.background.boldDiscovery.resting': '--ds-background-boldDiscovery-resting',
+  'color.background.boldDiscovery.hover': '--ds-background-boldDiscovery-hover',
+  'color.background.boldDiscovery.pressed': '--ds-background-boldDiscovery-pressed',
+  'color.background.subtleDiscovery.resting': '--ds-background-subtleDiscovery-resting',
+  'color.background.subtleDiscovery.hover': '--ds-background-subtleDiscovery-hover',
+  'color.background.subtleDiscovery.pressed': '--ds-background-subtleDiscovery-pressed',
+  'color.background.boldNeutral.resting': '--ds-background-boldNeutral-resting',
+  'color.background.boldNeutral.hover': '--ds-background-boldNeutral-hover',
+  'color.background.boldNeutral.pressed': '--ds-background-boldNeutral-pressed',
+  'color.background.transparentNeutral.hover': '--ds-background-transparentNeutral-hover',
+  'color.background.transparentNeutral.pressed': '--ds-background-transparentNeutral-pressed',
+  'color.background.subtleNeutral.resting': '--ds-background-subtleNeutral-resting',
+  'color.background.subtleNeutral.hover': '--ds-background-subtleNeutral-hover',
+  'color.background.subtleNeutral.pressed': '--ds-background-subtleNeutral-pressed',
+  'color.background.subtleBorderedNeutral.resting': '--ds-background-subtleBorderedNeutral-resting',
+  'color.background.subtleBorderedNeutral.pressed': '--ds-background-subtleBorderedNeutral-pressed',
+  'color.border.focus': '--ds-border-focus',
+  'color.border.neutral': '--ds-border-neutral',
+  'color.iconBorder.brand': '--ds-iconBorder-brand',
+  'color.iconBorder.danger': '--ds-iconBorder-danger',
+  'color.iconBorder.warning': '--ds-iconBorder-warning',
+  'color.iconBorder.success': '--ds-iconBorder-success',
+  'color.iconBorder.discovery': '--ds-iconBorder-discovery',
+  'color.overlay.hover': '--ds-overlay-hover',
+  'color.overlay.pressed': '--ds-overlay-pressed',
+  'color.text.selected': '--ds-text-selected',
+  'color.text.highEmphasis': '--ds-text-highEmphasis',
+  'color.text.mediumEmphasis': '--ds-text-mediumEmphasis',
+  'color.text.lowEmphasis': '--ds-text-lowEmphasis',
+  'color.text.onBold': '--ds-text-onBold',
+  'color.text.onBoldWarning': '--ds-text-onBoldWarning',
+  'color.text.link.resting': '--ds-text-link-resting',
+  'color.text.link.pressed': '--ds-text-link-pressed',
+  'color.text.brand': '--ds-text-brand',
+  'color.text.warning': '--ds-text-warning',
+  'color.text.danger': '--ds-text-danger',
+  'color.text.success': '--ds-text-success',
+  'color.text.discovery': '--ds-text-discovery',
+  'color.text.disabled': '--ds-text-disabled',
+  'shadow.card': '--ds-card',
+  'shadow.overlay': '--ds-overlay',
+  'utility.UNSAFE_util.transparent': '--ds-UNSAFE_util-transparent'
 };
 var _default = tokens;
 exports.default = _default;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/tokens",
-	"version": "0.1.0",
+	"version": "0.3.0",
 	"sideEffects": false
 }

package/dist/es2019/entry-points/token-default-values.js

@@ -0,0 +1 @@
+export { default } from '../tokens/token-default-values';

package/dist/es2019/figma/synchronize-figma-tokens.js

@@ -107,7 +107,7 @@ function synchronizeFigmaTokens(themeName, tokens, renameMap = {}) {
         // It's still an effect! Update it.
         console.log(`=> ${style.name} shadow style has been updated!`);
         style.effects = createEffects(token.value);
-        style.description = token.comment || ''; // Remove from themeValues so it isn't picked up as a new token.
+        style.description = (token.attributes.description || '').trim(); // Remove from themeValues so it isn't picked up as a new token.
 
         delete tokens[style.name];
       }
@@ -143,7 +143,7 @@ function synchronizeFigmaTokens(themeName, tokens, renameMap = {}) {
         console.log(`=> ${style.name} paint style has been updated!`); // Mutating is how Figma updates.
 
         style.paints = [createPaint(token.value)];
-        style.description = token.comment || ''; // Remove from themeValues so it isn't picked up as a new token.
+        style.description = (token.attributes.description || '').trim(); // Remove from themeValues so it isn't picked up as a new token.
 
         delete tokens[style.name];
       }
@@ -161,7 +161,7 @@ function synchronizeFigmaTokens(themeName, tokens, renameMap = {}) {
     if (token.attributes.group === 'paint') {
       const newStyle = figma.createPaintStyle();
       newStyle.name = key;
-      newStyle.description = token.comment || '';
+      newStyle.description = (token.attributes.description || '').trim();
       newStyle.paints = [createPaint(token.value)];
       console.log(`=> ${key} paint style has been added!`);
     }
@@ -169,7 +169,7 @@ function synchronizeFigmaTokens(themeName, tokens, renameMap = {}) {
     if (token.attributes.group === 'shadow') {
       const newStyle = figma.createEffectStyle();
       newStyle.name = key;
-      newStyle.description = token.comment || '';
+      newStyle.description = (token.attributes.description || '').trim();
       newStyle.effects = createEffects(token.value);
       console.log(`=> ${key} shadow style has been added!`);
     }

package/dist/es2019/tokens/atlassian-dark/color/accent.js

@@ -1,47 +1,44 @@
 const color = {
   color: {
     accent: {
+      boldBlue: {
+        value: 'B700'
+      },
+      boldGreen: {
+        value: 'G700'
+      },
+      boldOrange: {
+        value: 'O700'
+      },
+      boldPurple: {
+        value: 'P700'
+      },
+      boldRed: {
+        value: 'R700'
+      },
+      boldTeal: {
+        value: 'T700'
+      },
       subtleBlue: {
-        value: 'B900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'B900'
       },
       subtleGreen: {
-        value: 'G900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'G900'
       },
       subtleMagenta: {
-        value: 'M900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'M900'
       },
       subtleOrange: {
-        value: 'O900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'O900'
       },
       subtlePurple: {
-        value: 'P900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'P900'
       },
       subtleRed: {
-        value: 'R900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'R900'
       },
       subtleTeal: {
-        value: 'T900',
-        attributes: {
-          group: 'paint'
-        }
+        value: 'T900'
       }
     }
   }