From 06b1082a24e26105a7332be3b34564f17c7afea2 Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:09:09 -0600 Subject: [PATCH 01/10] refactor(sketch): use param object in syncColorStyles --- packages/sketch/src/commands/colors/generate.js | 2 +- packages/sketch/src/commands/colors/sync.js | 2 +- packages/sketch/src/commands/icons/shared.js | 2 +- packages/sketch/src/sharedStyles/colors.js | 5 +++-- 4 files changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/sketch/src/commands/colors/generate.js b/packages/sketch/src/commands/colors/generate.js index d302ccec12d7..5e78207d37b5 100644 --- a/packages/sketch/src/commands/colors/generate.js +++ b/packages/sketch/src/commands/colors/generate.js @@ -19,7 +19,7 @@ export function generate() { command('commands/colors/generate', () => { const document = Document.getSelectedDocument(); const page = selectPage(findOrCreatePage(document, 'color')); - const sharedStyles = syncColorStyles(document, 'fill'); + const sharedStyles = syncColorStyles({ document }, 'fill'); const { black, white, colors, support } = groupByKey( sharedStyles, (sharedStyle) => { diff --git a/packages/sketch/src/commands/colors/sync.js b/packages/sketch/src/commands/colors/sync.js index ee2e82578047..026c727f16ec 100644 --- a/packages/sketch/src/commands/colors/sync.js +++ b/packages/sketch/src/commands/colors/sync.js @@ -11,6 +11,6 @@ import { syncColorStyles } from '../../sharedStyles/colors'; export function sync() { command('commands/colors/sync', () => { - syncColorStyles(Document.getSelectedDocument(), 'fill'); + syncColorStyles({ document: Document.getSelectedDocument() }, 'fill'); }); } diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index 8f63c2297eed..b04b6f463f64 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -20,7 +20,7 @@ export function syncIconSymbols({ symbolsPage, sizes = [32, 24, 20, 16], }) { - const sharedStyles = syncColorStyles(document, 'fill'); + const sharedStyles = syncColorStyles({ document }, 'fill'); const [sharedStyle] = sharedStyles.filter( ({ name }) => name === 'color / fill / black' ); diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js index c85af36b3dea..a545f47335a4 100644 --- a/packages/sketch/src/sharedStyles/colors.js +++ b/packages/sketch/src/sharedStyles/colors.js @@ -15,10 +15,11 @@ const { black, white, orange, yellow, ...swatches } = colors; /** * Sync color shared styles to the given document and return the result - * @param {Document} document + * @param {object} params - syncColorStyles parameters + * @param {Document} params.document * @returns {Array} */ -export function syncColorStyles(document, type) { +export function syncColorStyles({ document }, type) { const sharedStyles = Object.keys(swatches).flatMap((swatchName) => { const name = formatTokenName(swatchName); const result = Object.keys(swatches[swatchName]).map((grade) => { From 77ba639bf850386aa7783d7621659a69f0bdc9c9 Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:11:07 -0600 Subject: [PATCH 02/10] refactor(colors): declare function before calling --- packages/sketch/src/sharedStyles/colors.js | 28 +++++++++++----------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js index a545f47335a4..299c191e52d2 100644 --- a/packages/sketch/src/sharedStyles/colors.js +++ b/packages/sketch/src/sharedStyles/colors.js @@ -13,6 +13,20 @@ import { syncColorStyle } from '../tools/sharedStyles'; // that we need to render const { black, white, orange, yellow, ...swatches } = colors; +/** + * Our shared style name will need to have the `color` namespace alongside a + * name for the swatch, the style type, and an optional grade. + * @param {string} name + * @param {string} type + * @param {string?} grade + * @returns {string} + */ +function formatSharedStyleName(name, type, grade) { + return ['color', type, name.split('-').join(' '), grade] + .filter(Boolean) + .join(' / '); +} + /** * Sync color shared styles to the given document and return the result * @param {object} params - syncColorStyles parameters @@ -49,17 +63,3 @@ export function syncColorStyles({ document }, type) { return sharedStyles.concat(singleColors); } - -/** - * Our shared style name will need to have the `color` namespace alongside a - * name for the swatch, the style type, and an optional grade. - * @param {string} name - * @param {string} type - * @param {string?} grade - * @returns {string} - */ -function formatSharedStyleName(name, type, grade) { - return ['color', type, name.split('-').join(' '), grade] - .filter(Boolean) - .join(' / '); -} From dd7e278d032275d0729b45eaac04d09c4e3bae5f Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:13:25 -0600 Subject: [PATCH 03/10] refactor(sketch): use param object in formatSharedColorStyleName --- packages/sketch/src/sharedStyles/colors.js | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js index 299c191e52d2..3f018a0a9a23 100644 --- a/packages/sketch/src/sharedStyles/colors.js +++ b/packages/sketch/src/sharedStyles/colors.js @@ -16,12 +16,13 @@ const { black, white, orange, yellow, ...swatches } = colors; /** * Our shared style name will need to have the `color` namespace alongside a * name for the swatch, the style type, and an optional grade. - * @param {string} name - * @param {string} type - * @param {string?} grade + * @param {object} params - formatSharedColorStyleName parameters + * @param {string} params.name + * @param {string} params.type + * @param {string?} params.grade * @returns {string} */ -function formatSharedStyleName(name, type, grade) { +function formatSharedColorStyleName({ name, type, grade }) { return ['color', type, name.split('-').join(' '), grade] .filter(Boolean) .join(' / '); @@ -39,7 +40,7 @@ export function syncColorStyles({ document }, type) { const result = Object.keys(swatches[swatchName]).map((grade) => { return syncColorStyle( document, - formatSharedStyleName(name, type, grade), + formatSharedColorStyleName({ name, type, grade }), swatches[swatchName][grade], type ); @@ -55,7 +56,7 @@ export function syncColorStyles({ document }, type) { ].map(([name, value]) => { return syncColorStyle( document, - formatSharedStyleName(name, type), + formatSharedColorStyleName({ name, type }), value, type ); From a4ed63b7fbcfd8106962cd888f5a18b1978c137d Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:17:57 -0600 Subject: [PATCH 04/10] refactor(sketch): use param object in syncColorStyle --- .../src/commands/test/sync-shared-styles.js | 11 ++++++++--- packages/sketch/src/sharedStyles/colors.js | 18 +++++++++--------- packages/sketch/src/sharedStyles/themes.js | 7 ++++++- packages/sketch/src/tools/sharedStyles.js | 11 ++++++----- 4 files changed, 29 insertions(+), 18 deletions(-) diff --git a/packages/sketch/src/commands/test/sync-shared-styles.js b/packages/sketch/src/commands/test/sync-shared-styles.js index 2de746804f13..db4cd71705a5 100644 --- a/packages/sketch/src/commands/test/sync-shared-styles.js +++ b/packages/sketch/src/commands/test/sync-shared-styles.js @@ -42,13 +42,18 @@ export function testSyncSharedStyles() { /** * Testing shared layer styles */ - const sharedStyle = syncColorStyle(document, 'black', '#000000', 'fill'); + const sharedStyle = syncColorStyle({ + document, + name: 'black', + value: '#000000', + type: 'fill', + }); if (document.sharedLayerStyles.length !== 1) { throw new Error('Expected sync command to generate a shared layer style'); } - syncColorStyle(document, 'black', '#000000', 'fill'); + syncColorStyle({ document, name: 'black', value: '#000000', type: 'fill' }); if (document.sharedLayerStyles.length !== 1) { throw new Error( @@ -118,7 +123,7 @@ export function testSyncSharedStyles() { throw new Error('The layer is not in sync with the shared style'); } - syncColorStyle(document, 'black', '#dedede', 'fill'); + syncColorStyle({ document, name: 'black', value: '#dedede', type: 'fill' }); if (getLayerFillColor() !== '#dededeff') { throw new Error('The layer did not update to the new shared style'); diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js index 3f018a0a9a23..0a78b7f37244 100644 --- a/packages/sketch/src/sharedStyles/colors.js +++ b/packages/sketch/src/sharedStyles/colors.js @@ -38,12 +38,12 @@ export function syncColorStyles({ document }, type) { const sharedStyles = Object.keys(swatches).flatMap((swatchName) => { const name = formatTokenName(swatchName); const result = Object.keys(swatches[swatchName]).map((grade) => { - return syncColorStyle( + return syncColorStyle({ document, - formatSharedColorStyleName({ name, type, grade }), - swatches[swatchName][grade], - type - ); + name: formatSharedColorStyleName({ name, type, grade }), + value: swatches[swatchName][grade], + type, + }); }); return result; }); @@ -54,12 +54,12 @@ export function syncColorStyles({ document }, type) { ['orange', orange['40']], ['yellow', yellow['30']], ].map(([name, value]) => { - return syncColorStyle( + return syncColorStyle({ document, - formatSharedColorStyleName({ name, type }), + name: formatSharedColorStyleName({ name, type }), value, - type - ); + type, + }); }); return sharedStyles.concat(singleColors); diff --git a/packages/sketch/src/sharedStyles/themes.js b/packages/sketch/src/sharedStyles/themes.js index 33c535ee0d03..04e5054f95cd 100644 --- a/packages/sketch/src/sharedStyles/themes.js +++ b/packages/sketch/src/sharedStyles/themes.js @@ -44,7 +44,12 @@ export function syncThemeColorStyles(document, styleType) { const name = `theme / ${theme.toLowerCase()} / ${type} tokens / ${formatTokenName( token )}`; - return syncColorStyle(document, name, themes[theme][token], styleType); + return syncColorStyle({ + document, + name, + value: themes[theme][token], + type: styleType, + }); }); }); diff --git a/packages/sketch/src/tools/sharedStyles.js b/packages/sketch/src/tools/sharedStyles.js index f987317c57b6..8c2f3898a7da 100644 --- a/packages/sketch/src/tools/sharedStyles.js +++ b/packages/sketch/src/tools/sharedStyles.js @@ -62,13 +62,14 @@ export function syncSharedStyle( /** * Sync the given color value as a shared style for the document - * @param {Document} document - * @param {string} name - * @param {string} value - * @param {string} type + * @param {object} params - syncColorStyle parameters + * @param {Document} params.document + * @param {string} params.name + * @param {string} params.value + * @param {string} params.type * @returns {SharedStyle} */ -export function syncColorStyle(document, name, value, type) { +export function syncColorStyle({ document, name, value, type }) { if (type === 'fill') { return syncSharedStyle(document, name, { fills: [ From 7b94b6331622db99313b4b41a2847b1d30f43cb8 Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:22:17 -0600 Subject: [PATCH 05/10] fix(sketch): remove type param from formatSharedColorStyleName --- packages/sketch/src/sharedStyles/colors.js | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js index 0a78b7f37244..31b425bc5087 100644 --- a/packages/sketch/src/sharedStyles/colors.js +++ b/packages/sketch/src/sharedStyles/colors.js @@ -18,12 +18,11 @@ const { black, white, orange, yellow, ...swatches } = colors; * name for the swatch, the style type, and an optional grade. * @param {object} params - formatSharedColorStyleName parameters * @param {string} params.name - * @param {string} params.type * @param {string?} params.grade * @returns {string} */ -function formatSharedColorStyleName({ name, type, grade }) { - return ['color', type, name.split('-').join(' '), grade] +function formatSharedColorStyleName({ name, grade }) { + return ['color', name.split('-').join(' '), grade] .filter(Boolean) .join(' / '); } @@ -40,7 +39,7 @@ export function syncColorStyles({ document }, type) { const result = Object.keys(swatches[swatchName]).map((grade) => { return syncColorStyle({ document, - name: formatSharedColorStyleName({ name, type, grade }), + name: formatSharedColorStyleName({ name, grade }), value: swatches[swatchName][grade], type, }); @@ -56,7 +55,7 @@ export function syncColorStyles({ document }, type) { ].map(([name, value]) => { return syncColorStyle({ document, - name: formatSharedColorStyleName({ name, type }), + name: formatSharedColorStyleName({ name }), value, type, }); From 625c2fb755c303fcd197a77d211d9c41e7c01395 Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:26:20 -0600 Subject: [PATCH 06/10] fix(sketch): remove styleType param from syncThemeColorStyles --- packages/sketch/src/commands/themes/generate.js | 2 +- packages/sketch/src/commands/themes/sync.js | 2 +- packages/sketch/src/sharedStyles/themes.js | 4 +--- 3 files changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/sketch/src/commands/themes/generate.js b/packages/sketch/src/commands/themes/generate.js index 8b9da9f012b1..7a129003c49a 100644 --- a/packages/sketch/src/commands/themes/generate.js +++ b/packages/sketch/src/commands/themes/generate.js @@ -21,7 +21,7 @@ export function generate() { command('commands/themes/generate', () => { const document = Document.getSelectedDocument(); const page = selectPage(findOrCreatePage(document, 'themes')); - const sharedStyles = syncThemeColorStyles(document, 'fill'); + const sharedStyles = syncThemeColorStyles(document); const tokens = groupByKey(sharedStyles, (sharedStyle) => { const [_namespace, _category, _group, token] = sharedStyle.name.split( diff --git a/packages/sketch/src/commands/themes/sync.js b/packages/sketch/src/commands/themes/sync.js index 4868bc5756e4..2314f035b16d 100644 --- a/packages/sketch/src/commands/themes/sync.js +++ b/packages/sketch/src/commands/themes/sync.js @@ -12,6 +12,6 @@ import { syncThemeColorStyles } from '../../sharedStyles/themes'; export function sync() { command('commands/themes/sync', () => { const document = Document.getSelectedDocument(); - syncThemeColorStyles(document, 'fill'); + syncThemeColorStyles(document); }); } diff --git a/packages/sketch/src/sharedStyles/themes.js b/packages/sketch/src/sharedStyles/themes.js index 04e5054f95cd..909080254937 100644 --- a/packages/sketch/src/sharedStyles/themes.js +++ b/packages/sketch/src/sharedStyles/themes.js @@ -21,10 +21,9 @@ const { colors } = tokens; /** * Sync theme color shared styles to the given document and return the result * @param {Document} document - * @param {string} styleType * @returns {Array} */ -export function syncThemeColorStyles(document, styleType) { +export function syncThemeColorStyles(document) { const themes = { 'White theme': white, 'Gray 10 theme': g10, @@ -48,7 +47,6 @@ export function syncThemeColorStyles(document, styleType) { document, name, value: themes[theme][token], - type: styleType, }); }); }); From 68ad2d4273c7cb555dfef21868f0581fe09f900c Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:30:26 -0600 Subject: [PATCH 07/10] fix(sketch): remove type param from syncColorStyles and syncColorStyle --- .../sketch/src/commands/colors/generate.js | 2 +- packages/sketch/src/commands/colors/sync.js | 2 +- packages/sketch/src/commands/icons/shared.js | 2 +- .../src/commands/test/sync-shared-styles.js | 5 ++- packages/sketch/src/sharedStyles/colors.js | 4 +-- packages/sketch/src/tools/sharedStyles.js | 31 ++++++------------- 6 files changed, 15 insertions(+), 31 deletions(-) diff --git a/packages/sketch/src/commands/colors/generate.js b/packages/sketch/src/commands/colors/generate.js index 5e78207d37b5..8fdb78149675 100644 --- a/packages/sketch/src/commands/colors/generate.js +++ b/packages/sketch/src/commands/colors/generate.js @@ -19,7 +19,7 @@ export function generate() { command('commands/colors/generate', () => { const document = Document.getSelectedDocument(); const page = selectPage(findOrCreatePage(document, 'color')); - const sharedStyles = syncColorStyles({ document }, 'fill'); + const sharedStyles = syncColorStyles({ document }); const { black, white, colors, support } = groupByKey( sharedStyles, (sharedStyle) => { diff --git a/packages/sketch/src/commands/colors/sync.js b/packages/sketch/src/commands/colors/sync.js index 026c727f16ec..7703e8c59b35 100644 --- a/packages/sketch/src/commands/colors/sync.js +++ b/packages/sketch/src/commands/colors/sync.js @@ -11,6 +11,6 @@ import { syncColorStyles } from '../../sharedStyles/colors'; export function sync() { command('commands/colors/sync', () => { - syncColorStyles({ document: Document.getSelectedDocument() }, 'fill'); + syncColorStyles({ document: Document.getSelectedDocument() }); }); } diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index b04b6f463f64..a87bbc4c73ae 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -20,7 +20,7 @@ export function syncIconSymbols({ symbolsPage, sizes = [32, 24, 20, 16], }) { - const sharedStyles = syncColorStyles({ document }, 'fill'); + const sharedStyles = syncColorStyles({ document }); const [sharedStyle] = sharedStyles.filter( ({ name }) => name === 'color / fill / black' ); diff --git a/packages/sketch/src/commands/test/sync-shared-styles.js b/packages/sketch/src/commands/test/sync-shared-styles.js index db4cd71705a5..65c35fdfc411 100644 --- a/packages/sketch/src/commands/test/sync-shared-styles.js +++ b/packages/sketch/src/commands/test/sync-shared-styles.js @@ -46,14 +46,13 @@ export function testSyncSharedStyles() { document, name: 'black', value: '#000000', - type: 'fill', }); if (document.sharedLayerStyles.length !== 1) { throw new Error('Expected sync command to generate a shared layer style'); } - syncColorStyle({ document, name: 'black', value: '#000000', type: 'fill' }); + syncColorStyle({ document, name: 'black', value: '#000000' }); if (document.sharedLayerStyles.length !== 1) { throw new Error( @@ -123,7 +122,7 @@ export function testSyncSharedStyles() { throw new Error('The layer is not in sync with the shared style'); } - syncColorStyle({ document, name: 'black', value: '#dedede', type: 'fill' }); + syncColorStyle({ document, name: 'black', value: '#dedede' }); if (getLayerFillColor() !== '#dededeff') { throw new Error('The layer did not update to the new shared style'); diff --git a/packages/sketch/src/sharedStyles/colors.js b/packages/sketch/src/sharedStyles/colors.js index 31b425bc5087..5ea0afae2771 100644 --- a/packages/sketch/src/sharedStyles/colors.js +++ b/packages/sketch/src/sharedStyles/colors.js @@ -33,7 +33,7 @@ function formatSharedColorStyleName({ name, grade }) { * @param {Document} params.document * @returns {Array} */ -export function syncColorStyles({ document }, type) { +export function syncColorStyles({ document }) { const sharedStyles = Object.keys(swatches).flatMap((swatchName) => { const name = formatTokenName(swatchName); const result = Object.keys(swatches[swatchName]).map((grade) => { @@ -41,7 +41,6 @@ export function syncColorStyles({ document }, type) { document, name: formatSharedColorStyleName({ name, grade }), value: swatches[swatchName][grade], - type, }); }); return result; @@ -57,7 +56,6 @@ export function syncColorStyles({ document }, type) { document, name: formatSharedColorStyleName({ name }), value, - type, }); }); diff --git a/packages/sketch/src/tools/sharedStyles.js b/packages/sketch/src/tools/sharedStyles.js index 8c2f3898a7da..ad9da6b48100 100644 --- a/packages/sketch/src/tools/sharedStyles.js +++ b/packages/sketch/src/tools/sharedStyles.js @@ -66,28 +66,15 @@ export function syncSharedStyle( * @param {Document} params.document * @param {string} params.name * @param {string} params.value - * @param {string} params.type * @returns {SharedStyle} */ -export function syncColorStyle({ document, name, value, type }) { - if (type === 'fill') { - return syncSharedStyle(document, name, { - fills: [ - { - color: value, - fillType: Style.FillType.Color, - }, - ], - }); - } - if (type === 'border') { - return syncSharedStyle(document, name, { - borders: [ - { - color: value, - fillType: Style.FillType.Color, - }, - ], - }); - } +export function syncColorStyle({ document, name, value }) { + return syncSharedStyle(document, name, { + fills: [ + { + color: value, + fillType: Style.FillType.Color, + }, + ], + }); } From 739ec54fe4792896b95065f8cf3531b92fd73903 Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:33:18 -0600 Subject: [PATCH 08/10] fix(shared): remove 'fill' from shared style name --- packages/sketch/src/commands/icons/shared.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index a87bbc4c73ae..7e052730bd03 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -22,7 +22,7 @@ export function syncIconSymbols({ }) { const sharedStyles = syncColorStyles({ document }); const [sharedStyle] = sharedStyles.filter( - ({ name }) => name === 'color / fill / black' + ({ name }) => name === 'color / black' ); if (!sharedStyle) { From 85c686224f93075f4e91cfa52f99a6c0a3c9ce1f Mon Sep 17 00:00:00 2001 From: emyarod Date: Mon, 8 Feb 2021 13:58:53 -0600 Subject: [PATCH 09/10] fix(colors): remove style type from generate command --- packages/sketch/src/commands/colors/generate.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/sketch/src/commands/colors/generate.js b/packages/sketch/src/commands/colors/generate.js index 8fdb78149675..ce8760753427 100644 --- a/packages/sketch/src/commands/colors/generate.js +++ b/packages/sketch/src/commands/colors/generate.js @@ -24,7 +24,7 @@ export function generate() { sharedStyles, (sharedStyle) => { const { name } = sharedStyle; - const [_category, _type, swatch] = name.split(' / '); + const [_category, swatch] = name.split(' / '); switch (swatch) { case 'black': return 'black'; @@ -43,7 +43,7 @@ export function generate() { let Y_OFFSET = 0; const swatches = groupByKey(colors, (sharedStyle) => { - const [_category, _type, swatch] = sharedStyle.name.split('/'); + const [_category, swatch] = sharedStyle.name.split('/'); return swatch; }); From c36968278a3d68812be9b195dfd699fbc7485d82 Mon Sep 17 00:00:00 2001 From: emyarod Date: Thu, 11 Feb 2021 13:13:48 -0600 Subject: [PATCH 10/10] fix(sharedStyles): rename layers to match updated format --- packages/sketch/src/tools/sharedStyles.js | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/packages/sketch/src/tools/sharedStyles.js b/packages/sketch/src/tools/sharedStyles.js index ad9da6b48100..b72102348935 100644 --- a/packages/sketch/src/tools/sharedStyles.js +++ b/packages/sketch/src/tools/sharedStyles.js @@ -29,6 +29,21 @@ export function syncSharedStyle( : document.sharedTextStyles; const [sharedStyle] = Array.from(documentSharedStyles).filter( (sharedStyle) => { + /** + * TODO: remove the following block after next Sketch plugin release + * backwards compatibility to avoid breaking changes from #5664, #5744 + * we search for style names with the following format + * `color/teal/60` + * and reformat it to + * `color / teal / 60` + * this search and replace will not be needed after the plugin has been + * published with renamed style layers + */ + // start removal + if (sharedStyle.name.split('/').join(' / ') === name) { + sharedStyle.name = name; + } + // end removal return sharedStyle.name === name; } );