UNPKG

@kode-frontend/svg-transformer

Version:

CLI to optimize and convert SVGs to React/React Native components

11 lines (8 loc) • 2.91 kB
#!/usr/bin/env node "use strict";var t=Object.create,e=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,r=Object.getPrototypeOf,n=Object.prototype.hasOwnProperty,p=(p,i,u)=>(u=null!=p?t(r(p)):{},((t,r,p,i)=>{if(r&&"object"==typeof r||"function"==typeof r)for(let u of o(r))n.call(t,u)||u===p||e(t,u,{get:()=>r[u],enumerable:!(i=a(r,u))||i.enumerable});return t})(!i&&p&&p.__esModule?u:e(u,"default",{value:p,enumerable:!0}),p)),i=require("commander"),u=p(require("inquirer")),c=require("@svgr/core"),s=p(require("case")),l=p(require("fs-extra")),f=p(require("path")),m={plugins:["@svgr/plugin-svgo","@svgr/plugin-jsx","@svgr/plugin-prettier"],prettier:!0,svgo:!0,svgoConfig:{plugins:["preset-default"]},typescript:!0};async function g({inputPath:t,outputPath:e,config:a,platform:o}){try{const r=(await l.default.readdir(t)).filter((t=>t.endsWith(".svg")));await Promise.all(r.map((async r=>{const n=f.default.join(t,r),p=await l.default.readFile(n,"utf8"),i=s.default.pascal(r.replace(/\.svg$/,"")),u=await async function(t,e,a,o){return await(0,c.transform)(t,{...m,native:"react-native"===a,template:e.template},{componentName:o})}(p,a,o,i),g=f.default.join(e,`${r.replace(".svg",".tsx")}`);await l.default.outputFile(g,u)})))}catch(t){console.error("Error processing SVG files:",t)}}var h=(t,{tpl:e})=>e` ${t.imports}; ${t.interfaces}; export const ${t.componentName} = (${t.props}) => ( ${t.jsx} ); `;!async function(){const t=new i.Command;t.name("@kode-frontend/svg-transformer").description("CLI to convert SVGs to React/React Native components").option("-i, --input <path>","Input folder containing SVG files","./icons").option("--interactive","Interactive mode for configuring the CLI",!1).option("-o, --output <path>","Output folder to save React components","./output").addOption(new i.Option("-p, --platform <platform>","Platform for the components (react or react-native)").choices(["react","react-native"]).default("react")).parse(process.argv);try{const e=await async function(t){const e=t.getOptionValue("input"),a=t.getOptionValue("output"),o=t.getOptionValue("platform");if(t.getOptionValue("interactive")){const t=await u.default.prompt([{type:"input",name:"inputPath",message:"Enter the input folder path (containing SVG files):",default:e},{type:"input",name:"outputPath",message:"Enter the output folder path (where the React components will be saved):",default:a},{type:"list",name:"platform",message:"Choose a platform for the components:",choices:["react","react-native"],default:o}]);return{inputPath:t.inputPath,outputPath:t.outputPath,platform:t.platform,template:h}}return{inputPath:e,outputPath:a,platform:o,template:h}}(t);await g({inputPath:e.inputPath,outputPath:e.outputPath,config:e,platform:e.platform}),console.log(`\nšŸŽ‰ SVG processing complete! See – ${e.outputPath}\n`)}catch(t){console.error("Error processing SVG files:",t)}}();