From 906f694b26f0fac9268819dd316ed1e9eb83eda1 Mon Sep 17 00:00:00 2001 From: emyarod Date: Thu, 25 Mar 2021 12:55:08 -0500 Subject: [PATCH 1/6] fix(sketch): hard code IDL sketch file metadata references --- packages/sketch/src/commands/icons/sync.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/packages/sketch/src/commands/icons/sync.js b/packages/sketch/src/commands/icons/sync.js index ea3d9c43e58d..3f4f08b9e007 100644 --- a/packages/sketch/src/commands/icons/sync.js +++ b/packages/sketch/src/commands/icons/sync.js @@ -10,6 +10,11 @@ import { command } from '../command'; import { syncIconSymbols } from './shared'; import { findOrCreateSymbolPage } from '../../tools/page'; +const IDL_SKETCH_LIBRARY_METADATA = { + id: '9E0A7EC6-C3F3-4DE6-BA36-3F90C4853BA5', + name: 'IBM Design Language v2', +}; + export function syncSmallIcons() { command('commands/icons/syncSmallIcons', () => { const document = Document.getSelectedDocument(); @@ -17,6 +22,7 @@ export function syncSmallIcons() { const symbols = document.getSymbols(); syncIconSymbols({ document, + IDL_SKETCH_LIBRARY_METADATA, symbols: Array.from(symbols), symbolsPage, sizes: [16, 20], @@ -31,6 +37,7 @@ export function syncLargeIcons() { const symbols = document.getSymbols(); syncIconSymbols({ document, + IDL_SKETCH_LIBRARY_METADATA, symbols: Array.from(symbols), symbolsPage, sizes: [24, 32], From b407dbf5087b9add42ab659dbfa44d333507507f Mon Sep 17 00:00:00 2001 From: emyarod Date: Thu, 25 Mar 2021 12:57:12 -0500 Subject: [PATCH 2/6] fix(sketch): fetch default icon layer styles from IDL Sketch library * avoid running colors sync during icon sync --- packages/sketch/src/commands/icons/shared.js | 26 ++++++++++++++++---- 1 file changed, 21 insertions(+), 5 deletions(-) diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index b71951b9a855..fc015496f8a3 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -7,8 +7,7 @@ /* global MSSVGImporter, NSString, NSUTF8StringEncoding */ -import { Artboard, Rectangle, Shape } from 'sketch/dom'; -import { syncColorStyles } from '../../sharedStyles/colors'; +import { Artboard, Library, Rectangle, Shape } from 'sketch/dom'; import { groupByKey } from '../../tools/grouping'; import { syncSymbol } from '../../tools/symbols'; @@ -67,13 +66,30 @@ function removeDeprecatedSymbolArtboards({ icons, sizes, symbolsPage }) { */ export function syncIconSymbols({ document, + IDL_SKETCH_LIBRARY_METADATA, symbols, symbolsPage, sizes = [32, 24, 20, 16], }) { - const sharedStyles = syncColorStyles({ document }); - const [sharedStyle] = sharedStyles.filter( - ({ name }) => name === 'color / black' + const { + id: idlSketchLibraryId, + name: idlSketchLibraryName, + } = IDL_SKETCH_LIBRARY_METADATA; + + const [idlSketchLibrary] = Library.getLibraries().filter( + ({ id, name }) => id === idlSketchLibraryId && name === idlSketchLibraryName + ); + + idlSketchLibrary + .getImportableLayerStyleReferencesForDocument(document) + .forEach((layerStyle) => { + if (layerStyle.name.startsWith('color')) { + layerStyle.import(); + } + }); + + const sharedStyle = [...document.sharedLayerStyles].find((sharedLayerStyle) => + sharedLayerStyle?.name.endsWith('black') ); if (!sharedStyle) { From 632010a41864b6f7e41c71986946c54a62b89d09 Mon Sep 17 00:00:00 2001 From: emyarod Date: Thu, 25 Mar 2021 13:41:09 -0500 Subject: [PATCH 3/6] docs(sketch): annotate syncIconSymbols --- packages/sketch/src/commands/icons/shared.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index fc015496f8a3..61eaca424de9 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -60,6 +60,7 @@ function removeDeprecatedSymbolArtboards({ icons, sizes, symbolsPage }) { * Sync Carbon icon symbols into current Sketch Document * @param {object} params - syncIconSymbols parameters * @param {Document} params.document - current document + * @param {object} params.IDL_SKETCH_LIBRARY_METADATA - IDL Sketch file metadata * @param {Array} params.symbols * @param {Page} params.symbolsPage - the symbols page as identified by Sketch * @param {Array} params.sizes - array of icon sizes From f7af1d8d55d751d4a420dc5be42c67b60c04da72 Mon Sep 17 00:00:00 2001 From: emyarod Date: Thu, 25 Mar 2021 13:41:39 -0500 Subject: [PATCH 4/6] feat(sketch): error handling for missing IDL Sketch library --- packages/sketch/src/commands/icons/shared.js | 41 ++++++++++++++++---- 1 file changed, 33 insertions(+), 8 deletions(-) diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index 61eaca424de9..c8c3a7adf738 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -7,6 +7,7 @@ /* global MSSVGImporter, NSString, NSUTF8StringEncoding */ +import sketch from 'sketch'; import { Artboard, Library, Rectangle, Shape } from 'sketch/dom'; import { groupByKey } from '../../tools/grouping'; import { syncSymbol } from '../../tools/symbols'; @@ -56,6 +57,35 @@ function removeDeprecatedSymbolArtboards({ icons, sizes, symbolsPage }) { }); } +/** + * Fetch the IDL Sketch Library if it is installed + * @param {object} params - fetchIDLSketchLibrary parameters + * @param {Array} params.icons - array of all icon object metadata + * @param {Array} params.sizes - array of icon sizes + * @param {Page} params.symbolsPage - the symbols page as identified by Sketch + */ +function fetchIDLSketchLibrary({ IDL_SKETCH_LIBRARY_METADATA }) { + const { + id: idlSketchLibraryId, + name: idlSketchLibraryName, + } = IDL_SKETCH_LIBRARY_METADATA; + + const installedLibraries = Library.getLibraries().filter( + ({ id, name }) => id === idlSketchLibraryId && name === idlSketchLibraryName + ); + + if (!installedLibraries.length) { + sketch.UI.message( + 'Please install the IDL V2 Sketch library before trying again' + ); + throw new Error( + 'Please install the IDL V2 Sketch library before trying again' + ); + } + + return installedLibraries[0]; +} + /** * Sync Carbon icon symbols into current Sketch Document * @param {object} params - syncIconSymbols parameters @@ -72,14 +102,9 @@ export function syncIconSymbols({ symbolsPage, sizes = [32, 24, 20, 16], }) { - const { - id: idlSketchLibraryId, - name: idlSketchLibraryName, - } = IDL_SKETCH_LIBRARY_METADATA; - - const [idlSketchLibrary] = Library.getLibraries().filter( - ({ id, name }) => id === idlSketchLibraryId && name === idlSketchLibraryName - ); + const idlSketchLibrary = fetchIDLSketchLibrary({ + IDL_SKETCH_LIBRARY_METADATA, + }); idlSketchLibrary .getImportableLayerStyleReferencesForDocument(document) From 655c5657a34879c7f9973273e2fafb5832411528 Mon Sep 17 00:00:00 2001 From: emyarod Date: Wed, 19 May 2021 16:36:36 -0500 Subject: [PATCH 5/6] docs(sketch): additional notes on syncIconSymbols --- packages/sketch/src/commands/icons/shared.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index c8c3a7adf738..798d31f336b3 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -106,6 +106,7 @@ export function syncIconSymbols({ IDL_SKETCH_LIBRARY_METADATA, }); + // import shared color styles from IDL Sketch library idlSketchLibrary .getImportableLayerStyleReferencesForDocument(document) .forEach((layerStyle) => { @@ -114,6 +115,7 @@ export function syncIconSymbols({ } }); + // set default icon color shared style const sharedStyle = [...document.sharedLayerStyles].find((sharedLayerStyle) => sharedLayerStyle?.name.endsWith('black') ); From 04eac1202f0cc45690de79d1bf34077554c332c3 Mon Sep 17 00:00:00 2001 From: emyarod Date: Wed, 19 May 2021 16:37:13 -0500 Subject: [PATCH 6/6] docs(sketch): update fetchIDLSketchLibrary JSDoc --- packages/sketch/src/commands/icons/shared.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/sketch/src/commands/icons/shared.js b/packages/sketch/src/commands/icons/shared.js index 798d31f336b3..0f1e5473bdad 100644 --- a/packages/sketch/src/commands/icons/shared.js +++ b/packages/sketch/src/commands/icons/shared.js @@ -60,9 +60,8 @@ function removeDeprecatedSymbolArtboards({ icons, sizes, symbolsPage }) { /** * Fetch the IDL Sketch Library if it is installed * @param {object} params - fetchIDLSketchLibrary parameters - * @param {Array} params.icons - array of all icon object metadata - * @param {Array} params.sizes - array of icon sizes - * @param {Page} params.symbolsPage - the symbols page as identified by Sketch + * @param {object} params.IDL_SKETCH_LIBRARY_METADATA - IDL Sketch file metadata + * @returns {Library} */ function fetchIDLSketchLibrary({ IDL_SKETCH_LIBRARY_METADATA }) { const {