diff --git a/.yarn/cache/zod-npm-3.23.8-11c49c85b5-15949ff821.zip b/.yarn/cache/zod-npm-3.23.8-11c49c85b5-15949ff821.zip new file mode 100644 index 0000000..2c8a617 Binary files /dev/null and b/.yarn/cache/zod-npm-3.23.8-11c49c85b5-15949ff821.zip differ diff --git a/figma-plugin/plugin-src/service.ts b/figma-plugin/plugin-src/service.ts index c73f1b8..18fe788 100644 --- a/figma-plugin/plugin-src/service.ts +++ b/figma-plugin/plugin-src/service.ts @@ -3,6 +3,7 @@ import type { IconaIconData } from "@icona/types"; import { Base64 } from "js-base64"; import type { PngOptionPayload } from "../common/types"; +import { removeDotPrefix } from "./utils"; type TargetNode = | ComponentNode @@ -113,24 +114,33 @@ export async function getSvgFromExtractedNodes(nodes: ExtractedNode[]) { const regex = createRegexWithDelimiters("[", "]"); const metadatasRegexResult = regex.exec(description || ""); + const metadatas = []; + + // 피그마에서 node name 앞에 `.`이 붙어있는 경우에는 `tag:figma-not-published`로 처리 + if (node.name.startsWith(".")) { + metadatas.push("tag:figma-not-published"); + } + if (metadatasRegexResult && metadatasRegexResult.length === 2) { + metadatas.push(...metadatasRegexResult[1].split(",")); + return { - name: component.name, + name: removeDotPrefix(component.name), svg: await node.exportAsync({ format: "SVG_STRING", svgIdAttribute: true, }), - metadatas: metadatasRegexResult[1].split(","), + metadatas, }; } return { - name: component.name, + name: removeDotPrefix(component.name), svg: await node.exportAsync({ format: "SVG_STRING", svgIdAttribute: true, }), - metadatas: [], + metadatas, }; }), ); @@ -139,7 +149,8 @@ export async function getSvgFromExtractedNodes(nodes: ExtractedNode[]) { if (cur.status === "rejected") console.error(cur.reason); if (cur.status === "fulfilled") { const { name, ...rest } = cur.value as IconaIconData; - acc[name] = { + const removedName = removeDotPrefix(name); + acc[removedName] = { ...rest, name, }; @@ -203,8 +214,9 @@ export async function exportFromIconaIconData( }, {} as Record); // name = "icon_name" - result[component.name] = { - ...result[component.name], + const name = removeDotPrefix(component.name); + result[name] = { + ...result[name], png: { ...pngDatas, }, diff --git a/figma-plugin/plugin-src/utils.ts b/figma-plugin/plugin-src/utils.ts index 5ef9ba0..72ac562 100644 --- a/figma-plugin/plugin-src/utils.ts +++ b/figma-plugin/plugin-src/utils.ts @@ -21,3 +21,11 @@ export function getIconaFrame(): FrameNode { return iconaFrame as FrameNode; } + +/** + * @description 컴포넌트 이름 맨 앞에 `.`이 붙어있는 경우에는 `.`을 없애요. + * + */ +export function removeDotPrefix(name: string) { + return name.startsWith(".") ? name.replace(".", "") : name; +} diff --git a/packages/generator/CHANGELOG.md b/packages/generator/CHANGELOG.md index be29427..fdf3646 100644 --- a/packages/generator/CHANGELOG.md +++ b/packages/generator/CHANGELOG.md @@ -1,5 +1,16 @@ # @icona/generator +## 0.9.0 + +### Minor Changes + +- change `icons` prop in `generator` fn + +### Patch Changes + +- Updated dependencies + - @icona/types@0.9.0 + ## 0.8.0 ### Minor Changes diff --git a/packages/generator/package.json b/packages/generator/package.json index dddde21..519b1d4 100644 --- a/packages/generator/package.json +++ b/packages/generator/package.json @@ -1,6 +1,6 @@ { "name": "@icona/generator", - "version": "0.8.0", + "version": "0.9.0", "repository": { "type": "git", "url": "git+https://github.com/daangn/icona.git", @@ -25,7 +25,7 @@ "prepack": "yarn build" }, "dependencies": { - "@icona/types": "^0.8.0", + "@icona/types": "^0.9.0", "@svgr/core": "^8.0.0", "@types/cli-progress": "^3.11.5", "cli-progress": "^3.12.0", @@ -35,7 +35,8 @@ "svg-to-pdfkit": "^0.1.8", "svg2vectordrawable": "^2.9.1", "svgo": "^3.0.2", - "svgtofont": "^4.2.0" + "svgtofont": "^4.2.0", + "zod": "^3.23.8" }, "devDependencies": { "@types/findup-sync": "^4.0.5", diff --git a/packages/generator/src/generator.ts b/packages/generator/src/generator.ts index 570a40a..7eb6b79 100644 --- a/packages/generator/src/generator.ts +++ b/packages/generator/src/generator.ts @@ -1,4 +1,5 @@ import type { IconaConfig, IconaIconData } from "@icona/types"; +import fs from "fs"; import { generateDrawable } from "./core/drawable.js"; import { generatePDF } from "./core/pdf.js"; @@ -7,6 +8,7 @@ import { generateReact } from "./core/react.js"; import { generateSVG } from "./core/svg.js"; import { generateVue2 } from "./core/vue2.js"; import { generateVue3 } from "./core/vue3.js"; +import { iconaIconJsonFile } from "./schema.js"; import { getIconaIconsFile } from "./utils/file"; interface Props { @@ -14,27 +16,39 @@ interface Props { * @description Icona icons data * @default .icona/icons.json */ - icons?: Record | null; + icons?: Record | string; config: IconaConfig; } + export const generate = async (props: Props) => { const { config, icons = getIconaIconsFile() } = props; - if (!icons) { + let iconData = icons; + + if (!iconData) { throw new Error( "[@Icona/generator] There is no `icons.json` file in .icona folder", ); } + if (typeof iconData === "string") { + const data = fs.readFileSync(iconData, "utf-8"); + iconData = JSON.parse(data); + } + + const paredIconFile = iconaIconJsonFile.parse(iconData); + const { pdf, drawable, react, svg, png, vue2, vue3 } = config; console.log("[@Icona/generator] Start generating..."); - await generateSVG({ icons, config: svg }); // SVG is required - if (png?.active) await generatePNG({ icons, config: png }); - if (pdf?.active) generatePDF({ icons, config: pdf }); - if (drawable?.active) await generateDrawable({ icons, config: drawable }); - if (react?.active) await generateReact({ icons, config: react }); - if (vue2?.active) await generateVue2({ icons, config: vue2 }); - if (vue3?.active) await generateVue3({ icons, config: vue3 }); + await generateSVG({ icons: paredIconFile, config: svg }); // SVG is required + if (png?.active) await generatePNG({ icons: paredIconFile, config: png }); + if (pdf?.active) generatePDF({ icons: paredIconFile, config: pdf }); + if (drawable?.active) + await generateDrawable({ icons: paredIconFile, config: drawable }); + if (react?.active) + await generateReact({ icons: paredIconFile, config: react }); + if (vue2?.active) await generateVue2({ icons: paredIconFile, config: vue2 }); + if (vue3?.active) await generateVue3({ icons: paredIconFile, config: vue3 }); console.log("\n[@Icona/generator] Finish generating!!!"); }; diff --git a/packages/generator/src/schema.ts b/packages/generator/src/schema.ts new file mode 100644 index 0000000..04736ee --- /dev/null +++ b/packages/generator/src/schema.ts @@ -0,0 +1,19 @@ +import { z } from "zod"; + +export const iconaIconData = z.object({ + name: z.string(), + svg: z.string(), + metadatas: z.array(z.string()).optional(), + png: z.object({ + "1x": z.string().nullable(), + "2x": z.string().nullable(), + "3x": z.string().nullable(), + "4x": z.string().nullable(), + }), +}); + +export type IconaIconData = z.infer; + +export const iconaIconJsonFile = z.record(iconaIconData); + +export type IconaIconJsonFile = z.infer; diff --git a/packages/types/CHANGELOG.md b/packages/types/CHANGELOG.md index 0fef0a3..ec7abec 100644 --- a/packages/types/CHANGELOG.md +++ b/packages/types/CHANGELOG.md @@ -1,5 +1,11 @@ # @icona/types +## 0.9.0 + +### Minor Changes + +- change `icons` prop in `generator` fn + ## 0.8.0 ### Minor Changes diff --git a/packages/types/package.json b/packages/types/package.json index fa44d5c..4236322 100644 --- a/packages/types/package.json +++ b/packages/types/package.json @@ -1,6 +1,6 @@ { "name": "@icona/types", - "version": "0.8.0", + "version": "0.9.0", "repository": { "type": "git", "url": "git+https://github.com/daangn/icona.git", diff --git a/packages/types/src/data.d.ts b/packages/types/src/data.d.ts index b203b84..d88a0d1 100644 --- a/packages/types/src/data.d.ts +++ b/packages/types/src/data.d.ts @@ -7,7 +7,6 @@ export interface SVGStyleOptions { export interface IconaIconData { name: string; - style: SVGStyleOptions; svg: string; metadatas?: string[]; png: { diff --git a/yarn.lock b/yarn.lock index c35f6ac..4904c1b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3869,7 +3869,7 @@ __metadata: version: 0.0.0-use.local resolution: "@icona/generator@workspace:packages/generator" dependencies: - "@icona/types": ^0.8.0 + "@icona/types": ^0.9.0 "@svgr/core": ^8.0.0 "@types/cli-progress": ^3.11.5 "@types/findup-sync": ^4.0.5 @@ -3885,6 +3885,7 @@ __metadata: svgo: ^3.0.2 svgtofont: ^4.2.0 typescript: ^5.1.3 + zod: ^3.23.8 languageName: unknown linkType: soft @@ -3912,7 +3913,7 @@ __metadata: languageName: unknown linkType: soft -"@icona/types@^0.8.0, @icona/types@workspace:^, @icona/types@workspace:packages/types": +"@icona/types@^0.9.0, @icona/types@workspace:^, @icona/types@workspace:packages/types": version: 0.0.0-use.local resolution: "@icona/types@workspace:packages/types" dependencies: @@ -13334,3 +13335,10 @@ __metadata: checksum: 2cac84540f65c64ccc1683c267edce396b26b1e931aa429660aefac8fbe0188167b7aee815a3c22fa59a28a58d898d1a2b1825048f834d8d629f4c2a5d443801 languageName: node linkType: hard + +"zod@npm:^3.23.8": + version: 3.23.8 + resolution: "zod@npm:3.23.8" + checksum: 15949ff82118f59c893dacd9d3c766d02b6fa2e71cf474d5aa888570c469dbf5446ac5ad562bb035bf7ac9650da94f290655c194f4a6de3e766f43febd432c5c + languageName: node + linkType: hard