@jongh/cli 4.0.0 → 4.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +10 -9
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
|
-
import {Command}from'commander';import {intro,confirm,outro,spinner,log,select}from'@clack/prompts';import
|
|
2
|
+
import {Command}from'commander';import {intro,confirm,outro,spinner,log,select}from'@clack/prompts';import de from'chalk';import T from'fs-extra';import v from'path';import {z}from'zod';import Pe from'fast-glob';import {loadConfig,createMatchPath}from'tsconfig-paths';import {Project,SyntaxKind}from'ts-morph';import {detect,resolveCommand}from'package-manager-detector';import {packageDirectory}from'pkg-dir';import fe from'handlebars';import {StdioServerTransport}from'@modelcontextprotocol/sdk/server/stdio.js';import {Server}from'@modelcontextprotocol/sdk/server/index.js';import {ListToolsRequestSchema,CallToolRequestSchema,ListPromptsRequestSchema,GetPromptRequestSchema}from'@modelcontextprotocol/sdk/types.js';import {zodToJsonSchema}from'zod-to-json-schema';var K=t=>{let e={};for(let r of t)e[r]=r;return e},H=K(["config_not_found","resolve_path_fail","failed_to_fetch"]);K(["components.json","tsconfig.json","panda.config.*","package.json"]);var x=class extends Error{issue;constructor(e){super(),this.name="NewError",this.issue=e;}get format(){return this.issue.code+`
|
|
3
3
|
`+this.issue.message?.join(`
|
|
4
|
-
`)}},u=t=>{let e;switch(t.code){case H.config_not_found:e=`error occured while config ${t.configFile}`;break;case H.resolve_path_fail:e=`failed to resolve your path, current ${t.cwd}`;break;case H.failed_to_fetch:e=`failed to fetch ${t.target} [${t.statusCode}]`;break;default:e="error occured";}return new x({...t,message:[...t.message||"",e]})};var L=z
|
|
5
|
-
${$}`));}catch(p){p instanceof Error&&console.log(k(p.message));}}}catch(r){outro(k(B("error occured"))),r instanceof z
|
|
4
|
+
`)}},u=t=>{let e;switch(t.code){case H.config_not_found:e=`error occured while config ${t.configFile}`;break;case H.resolve_path_fail:e=`failed to resolve your path, current ${t.cwd}`;break;case H.failed_to_fetch:e=`failed to fetch ${t.target} [${t.statusCode}]`;break;default:e="error occured";}return new x({...t,message:[...t.message||"",e]})};var L=z.enum(["panda","tailwind"]),q=z.object({utils:z.string(),components:z.string(),hooks:z.string()}),b={fileName:"components.json",schema:z.discriminatedUnion("style",[q.extend({style:z.literal("panda"),styledsystem:z.string()}).strict(),q.extend({style:z.literal("tailwind")}).strict()])},ze=z.object({name:z.string(),content:z.string(),type:z.enum(["ui","hooks","utils"])}),Y=z.object({name:z.string(),styles:z.record(z.string(),z.object({dependencies:z.array(z.string()).optional(),files:z.array(ze)}))}),Z=z.object({name:z.string(),content:z.string()});z.object({name:z.string(),dependencies:z.array(z.string()).optional(),file:z.string()});function X(t){try{return T.readJsonSync(v.resolve(t,b.fileName))}catch(e){return u({code:"config_not_found",configFile:b.fileName,message:[e instanceof Error?e.message:""]})}}function F(t){let e=loadConfig(t);if(e.resultType==="failed")throw u({code:"config_not_found",configFile:"tsconfig.json",message:["cannot found tsconfig.json"]});return e}async function ee(t){return await T.pathExists(v.join(t,"components.json"))}function te(t,e){let r=["./","./src/","./app/","./src/app"].map(o=>v.resolve(t,o));for(let[o,a]of Object.entries(e.paths)){let n=v.join(t,e.baseUrl||"",a[0].replace(/\/\*$/,""));if(r.some(s=>s===n||s.includes(n)))return o.replace(/\/\*$/,"")}return null}function re(t,e){let r=["./","./src/","./app/","./src/app"].map(o=>v.resolve(t,o));for(let o of Object.values(e.paths)){let a=v.join(t,e.baseUrl||"",o[0].replace(/\/\*$/,""));if(r.some(n=>n===a||n.includes(a)))return a}return null}function oe(t,e,r){let o=v.join(t,e);for(let[a,n]of Object.entries(r.paths)){let s=n[0].replace(/\/\*$/,"");if(o===v.join(t,r.baseUrl||"",s))return a.replace(/\/\*$/,"")}return null}async function ne(t){try{let e=await Pe.glob(["panda.config.*"],{cwd:t,deep:3});if(!e.length)throw u({code:"config_not_found",configFile:"panda.config.*",message:["failed to find panda.config file"]});return e[0]}catch(e){throw u({code:"config_not_found",configFile:"panda.config.*",message:[e instanceof Error?e.message:"unknown error occured finding panda.config"]})}}async function C(t,e){let r=createMatchPath(e.absoluteBaseUrl,e.paths)(t,void 0,()=>true);if(!r)throw u({code:"resolve_path_fail",target:t,cwd:process.cwd(),message:["resolve error"]});return r}async function ae(t){let e=t.match(/outdir:\s*["']([^"']+)["']/),r=t.match(/importMap:\s*({[^}]+}|["'][^"']+["'])/),o=e?e[1]:null,a=null;if(r){let n=r[1];if(n.startsWith("{")){let s=n.match(/css:\s*["']([^"']+)["']/);a=s?s[1].replace(/\/css$/,""):null;}else a=n.replace(/["']/g,"");}return {outdir:o,importMap:a}}function ie(t,e){let r=t,o=[{from:/@\/component\/([^/"']+)\/(?:panda|tailwind)/g,to:`${e.components}/$1`},{from:/@utils\//g,to:`${e.utils}/`},{from:/@hooks\//g,to:`${e.hooks}/`},{from:/@components\//g,to:`${e.components}/`}];return e.style==="panda"&&o.push({from:/@styled-system\//g,to:`${e.styledsystem}/`}),o.forEach(({from:a,to:n})=>{r=r.replace(a,n);}),r}function se(t){let r=new Project().addSourceFileAtPath(t),o=[{namedImports:[{name:"preset"}],moduleSpecifier:"panda-animation"},{namedImports:[{name:"defaultPreset"}],moduleSpecifier:"./preset"}];r.addImportDeclarations(o);let n=r.getFirstDescendantByKind(SyntaxKind.CallExpression)?.getArguments()[0];n?(n.getProperty("presets")||n.addPropertyAssignment({name:"presets",initializer:'[preset(), "@pandacss/preset-panda", defaultPreset]'}),r.saveSync()):console.warn("Could not modify panda.config.ts. add presets : [preset(), @pandacss/preset-panda, defaultPreset] in your panda.config");}async function O(t,e){let r=await detect({cwd:t}),o=resolveCommand(r?.agent||"npm","add",e);if(o)return o}var Me=z.object({components:z.array(z.string()).optional(),cwd:z.string()}),He=(process.env.JDS_REGISTRY_URL??"https://jds-docs.vercel.app").replace(/\/$/,""),k=de.bold.red,B=de.bold.blue,pe=new Command().name("add").argument("[components...]").option("-c, --cwd <cwd>","current working directory, default to process.cwd()",process.cwd()).action(async(t,e)=>{try{let r=Me.parse({components:t,...e});intro(B("install components..."));let o=b.schema.parse(X(r.cwd),{errorMap:()=>({message:"components.json is invalid"})}),a=F(r.cwd),n={utils:await C(o.utils,a),components:await C(o.components,a),hooks:await C(o.hooks,a)},s=r.components?.map(l=>l.toLowerCase());if(!s?.length)return;let d=await Promise.allSettled(s.map(async l=>{let c=await fetch(`${He}/${l}.json`);if(!c.ok)throw u({code:"failed_to_fetch",target:l,statusCode:c.status,message:[c.statusText]});return await c.json()}));for(let[l,c]of d.entries()){if(c.status==="rejected"){c.reason instanceof x?console.log(k(c.reason.format)):console.log(k(c.reason));continue}try{let p=Y.parse(c.value,{errorMap:()=>({message:`registry for ${s[l]} is invaliad`})}),y=p.styles[o.style];if(!y){let[g]=Object.keys(p.styles);if(!g){console.log(k(`${s[l]} has no styles`));continue}if(!await confirm({message:`${s[l]} does not support ${o.style}. Install ${g} instead?`}))continue;y=p.styles[g];}let h=v.join(n.components,s[l]);if(T.pathExistsSync(h)&&!await confirm({message:`Component ${s[l]} already exists. Do you want to overwrite it?`}))return;y.files.forEach(g=>{let z=ie(g.content,o);g.type==="ui"?T.outputFileSync(v.join(h,g.name),z):T.outputFileSync(v.join(n[g.type],g.name),z,"utf-8");});let m=y.dependencies||[],f=m.length?await O(r.cwd,m):void 0,$=m.length?f?`Run this command in the terminal : ${f.command} ${f.args.join(" ")}`:`Cannot find your package manager, install this dependencies: ${m.join(" ")}`:"No additional dependencies required";outro(B(`${s[l]} completed successfully
|
|
5
|
+
${$}`));}catch(p){p instanceof Error&&console.log(k(p.message));}}}catch(r){outro(k(B("error occured"))),r instanceof z.ZodError&&console.log(r.message),r instanceof x&&console.log(k(r.format)),r instanceof Error&&console.log(k(r.message)),process.exit(1);}});var Ue=(process.env.JDS_REGISTRY_URL??"https://jds-docs.vercel.app").replace(/\/$/,""),me=new Command().name("guide").description("Print component authoring guidance").argument("<component>").action(async t=>{let e=t.trim().toLowerCase();try{let r=await fetch(`${Ue}/guides/${e}.json`);if(!r.ok)throw new Error(`Failed to fetch guide for ${e}: ${r.status} ${r.statusText}`);let o=Z.parse(await r.json());process.stdout.write(o.content);}catch(r){process.stderr.write(`${r instanceof Error?r.message:String(r)}
|
|
6
|
+
`),process.exitCode=1;}});var ge=`@import "tailwindcss";
|
|
6
7
|
|
|
7
8
|
@theme inline {
|
|
8
9
|
--color-background: var(--jds-background);
|
|
@@ -352,7 +353,7 @@ import {Command}from'commander';import {intro,confirm,outro,spinner,log,select}f
|
|
|
352
353
|
color: var(--jds-foreground);
|
|
353
354
|
}
|
|
354
355
|
}
|
|
355
|
-
`;var
|
|
356
|
+
`;var ue=`
|
|
356
357
|
import {
|
|
357
358
|
definePreset,
|
|
358
359
|
defineSemanticTokens,
|
|
@@ -646,13 +647,13 @@ export const defaultPreset = definePreset({
|
|
|
646
647
|
utilities,
|
|
647
648
|
})
|
|
648
649
|
|
|
649
|
-
`;var j=["rose","pink","fuchsia","purple","violet","indigo","blue","sky","cyan","teal","emerald","green","lime","yellow","amber","orange","red","neutral","stone","zinc","gray","slate"],I=["neutral","stone","zinc","gray","slate"],E=z
|
|
650
|
+
`;var j=["rose","pink","fuchsia","purple","violet","indigo","blue","sky","cyan","teal","emerald","green","lime","yellow","amber","orange","red","neutral","stone","zinc","gray","slate"],I=["neutral","stone","zinc","gray","slate"],E=z.object({primary:z.enum(j),secondary:z.enum(j),gray:z.enum(I)}),ye=t=>fe.compile(ue)(t),he=t=>fe.compile(ge)(t);var D=z.object({cwd:z.string().default(()=>process.cwd()),yes:z.boolean().default(false),style:L.default("panda"),primary:E.shape.primary.default("neutral"),secondary:E.shape.secondary.default("slate"),gray:E.shape.gray.default("gray")}),W=async t=>t.yes?D.parse(t):D.parse({...t,style:t.style??await select({message:"Pick component style",initialValue:"panda",options:L.options.map(e=>({value:e,label:e}))}),primary:t.primary??await select({message:"Pick primary color",initialValue:"neutral",options:j.map(e=>({value:e,label:e}))}),secondary:t.secondary??await select({message:"Pick secondary color",initialValue:"slate",options:j.map(e=>({value:e,label:e}))}),gray:t.gray??await select({message:"Pick gray color",initialValue:"gray",options:I.map(e=>({value:e,label:e}))})});var G=de.bold.red,ve=de.bold.blue,qe=["tailwindcss","clsx","tailwind-merge","tailwind-variants"],be=new Command().name("init").description("Initialize the project").option("-c, --cwd <cwd>","current working directory, default to process.cwd()",process.cwd()).option("-y, --yes","skip prompts and use default options",false).option("--style <style>","component style").option("--primary <color>","primary color").option("--secondary <color>","secondary color").option("--gray <color>","gray color").action(async t=>{let e=spinner();e.start("Initializing");try{let r=await W({cwd:v.resolve(t.cwd),yes:t.yes,style:t.style,primary:t.primary,secondary:t.secondary,gray:t.gray}),o=await V(r);if(e.stop("successfully Initialized!"),o?.style==="tailwind"){let a=await O(r.cwd,qe);a&&outro(ve(`Run this command in the terminal : ${a.command} ${a.args.join(" ")}`));}}catch(r){e.stop(G(ve("error occured"))),r instanceof z.ZodError&&console.log(r.message),r instanceof x&&console.log(G(r.format)),r instanceof Error&&console.log(G(r.message)),process.exit(1);}});async function V(t){let e=t.cwd||await packageDirectory();if(!e)throw u({code:"config_not_found",configFile:"package.json",message:[`cannot find package.json in ${e}`]});let r=F(e),o=te(e,r);if(o===null)throw u({code:"resolve_path_fail",target:"tsconfig.json",cwd:e,message:[`cannot find paths alias in your ${v.join(e,"tsconfig.json")}`]});if(await ee(e)&&(await confirm({message:"you already initialize,are you want to overwrite it?"})||process.exit(0)),t.style==="panda"){let n=await ne(e),s=await T.readFile(v.join(e,n),"utf-8"),d="styled-system",{outdir:l,importMap:c}=await ae(s);c?d=c:d=oe(e,l||"styled-system",r)||".",l&&(d=l);let p=b.schema.parse({style:t.style,utils:`${o}/utils`,components:`${o}/components`,hooks:`${o}/hooks`,styledsystem:d},{errorMap:()=>({message:"components.json is invalid"})});await T.writeFile(v.resolve(e,"components.json"),JSON.stringify(p),"utf-8");let y=ye({primary:t.primary,secondary:t.secondary,gray:t.gray});return await T.writeFile(v.join(e,"preset.ts"),y),se(v.resolve(e,n)),p}if(t.style==="tailwind"){let n=re(e,r);if(n===null)throw u({code:"resolve_path_fail",target:"tsconfig.json",cwd:e,message:[`cannot find base path in your ${v.join(e,"tsconfig.json")}`]});let s=b.schema.parse({style:t.style,utils:`${o}/utils`,components:`${o}/components`,hooks:`${o}/hooks`},{errorMap:()=>({message:"components.json is invalid"})});await T.writeFile(v.resolve(e,"components.json"),JSON.stringify(s),"utf-8");let d=he({primary:t.primary,secondary:t.secondary,gray:t.gray});return await T.outputFile(v.join(n,"styles.css"),d),await T.outputFile(v.join(await C(s.utils,r),"cn.ts"),`import { type ClassValue, clsx } from "clsx"
|
|
650
651
|
import { twMerge } from "tailwind-merge"
|
|
651
652
|
|
|
652
653
|
export function cn(...inputs: ClassValue[]) {
|
|
653
654
|
return twMerge(clsx(inputs))
|
|
654
655
|
}
|
|
655
|
-
`),
|
|
656
|
+
`),s}}var _=new Server({name:"DesignSystemCLI",version:"1.0.0"},{capabilities:{resources:{},tools:{},prompts:{}}});_.setRequestHandler(ListToolsRequestSchema,async()=>({tools:[{name:"init",description:"Initialize the design system and generate theme files.",inputSchema:zodToJsonSchema(D)},{name:"previewColors",description:"Generate a preview of selected color combinations.",inputSchema:zodToJsonSchema(E)}]}));_.setRequestHandler(CallToolRequestSchema,async t=>{try{if(!t.params.arguments)throw new Error("Arguments are required for this tool.");switch(t.params.name){case "init":try{let e=await W({...t.params.arguments,yes:!0});return await V(e),{content:[{type:"text",text:`Design system initialized for directory: ${e.cwd}. Theme files generated.`}]}}catch(e){return console.error("Error during init tool execution:",e),{content:[{type:"text",text:`Error initializing design system: ${e instanceof Error?e.message:String(e)}`}],isError:!0}}default:return {content:[{type:"text",text:`Tool ${t.params.name} not found`}],isError:!0}}}catch(e){return console.error("Error parsing MCP request arguments:",e),e instanceof z.ZodError?{content:[{type:"text",text:`Invalid arguments for tool ${t.params?.name}: ${JSON.stringify(e.errors)}`}],isError:true}:{content:[{type:"text",text:`An unexpected error occurred: ${e instanceof Error?e.message:String(e)}`}],isError:true}}});_.setRequestHandler(ListPromptsRequestSchema,async()=>({prompts:[{name:"selectThemeColors",description:"Theme color selection guide for AI",arguments:[{name:"primary",description:"The primary color using design system"},{name:"secondary",description:"The secondary color using design system."},{name:"gray",description:"The gray color using design system."}]}]}));_.setRequestHandler(GetPromptRequestSchema,async t=>t.params.name!=="selectThemeColors"?{jsonrpc:"2.0",error:{code:-32601,message:`Prompt ${t.params.name} not found.`}}:{description:"Help the user select appropriate primary, secondary, and gray colors for the design system theme.",messages:[{role:"assistant",content:{type:"text",text:`I'll help you set up the theme colors for your design system.
|
|
656
657
|
|
|
657
658
|
**The goal is to determine primary, secondary, and gray colors based on your preference.**
|
|
658
659
|
|
|
@@ -678,7 +679,7 @@ export function cn(...inputs: ClassValue[]) {
|
|
|
678
679
|
**Important notes:**
|
|
679
680
|
- Color values must only be used from the lists above.
|
|
680
681
|
- Colors not in the list (e.g., 'magenta', 'brown') cannot be used.
|
|
681
|
-
- When executing the 'DesignSystemCLI init' tool, color arguments must be passed with the exact names from the list.`}},{role:"user",content:{type:"text",text:"I need to set up the theme colors for my design system. Can you guide me through the process?"}},{role:"assistant",content:{type:"text",text:"I can help you set up the theme colors for your design system. First, you need to select a primary color. Please choose from the following colors: rose, pink, fuchsia, purple, violet, indigo, blue, sky, cyan, teal, emerald, green, lime, yellow, amber, orange, red, neutral, stone, zinc, gray, slate. Which color would you like to use as your primary color?"}}]});var
|
|
682
|
+
- When executing the 'DesignSystemCLI init' tool, color arguments must be passed with the exact names from the list.`}},{role:"user",content:{type:"text",text:"I need to set up the theme colors for my design system. Can you guide me through the process?"}},{role:"assistant",content:{type:"text",text:"I can help you set up the theme colors for your design system. First, you need to select a primary color. Please choose from the following colors: rose, pink, fuchsia, purple, violet, indigo, blue, sky, cyan, teal, emerald, green, lime, yellow, amber, orange, red, neutral, stone, zinc, gray, slate. Which color would you like to use as your primary color?"}}]});var ke=new Command().name("mcp").description("Manage your design system").action(async()=>{try{let t=new StdioServerTransport;await _.connect(t);}catch(t){console.error(t);}});var je={"@radix-ui/react-accessible-icon":"AccessibleIcon","@radix-ui/react-accordion":"Accordion","@radix-ui/react-alert-dialog":"AlertDialog","@radix-ui/react-aspect-ratio":"AspectRatio","@radix-ui/react-avatar":"Avatar","@radix-ui/react-checkbox":"Checkbox","@radix-ui/react-collapsible":"Collapsible","@radix-ui/react-context-menu":"ContextMenu","@radix-ui/react-dialog":"Dialog","@radix-ui/react-direction":"Direction","@radix-ui/react-dropdown-menu":"DropdownMenu","@radix-ui/react-form":"Form","@radix-ui/react-hover-card":"HoverCard","@radix-ui/react-label":"Label","@radix-ui/react-menubar":"Menubar","@radix-ui/react-navigation-menu":"NavigationMenu","@radix-ui/react-popover":"Popover","@radix-ui/react-portal":"Portal","@radix-ui/react-progress":"Progress","@radix-ui/react-radio-group":"RadioGroup","@radix-ui/react-scroll-area":"ScrollArea","@radix-ui/react-select":"Select","@radix-ui/react-separator":"Separator","@radix-ui/react-slider":"Slider","@radix-ui/react-slot":"Slot","@radix-ui/react-switch":"Switch","@radix-ui/react-tabs":"Tabs","@radix-ui/react-toast":"Toast","@radix-ui/react-toggle":"Toggle","@radix-ui/react-toggle-group":"ToggleGroup","@radix-ui/react-toolbar":"Toolbar","@radix-ui/react-tooltip":"Tooltip","@radix-ui/react-visually-hidden":"VisuallyHidden"};function M(t,e,r){return r?t===r:t===e}function Se(t){return `import {${t}} from "radix-ui"`}function Ce(t){let e=[];return t.getImportDeclarations().forEach(r=>{let o=r.getModuleSpecifierValue();if(!(o in je))return;let a=je[o];e.push(o);let n=r.getNamespaceImport();if(n){let d=n.getText();a!==d&&(a+=` as ${d}`),r.replaceWithText(Se(a));return}let s=r.getNamedImports();if(s.length){let d=a;s.forEach(l=>{let c=l.getName(),p=l.getAliasNode()?.getText(),y=`${d}.${c}`;for(let h of [SyntaxKind.JsxOpeningElement,SyntaxKind.JsxClosingElement,SyntaxKind.JsxSelfClosingElement])t.getDescendantsOfKind(h).forEach(m=>{let f=m.getTagNameNode().getText();M(f,c,p)&&m.getTagNameNode().replaceWithText(y);});t.getDescendantsOfKind(SyntaxKind.TypeQuery).forEach(h=>{h.getChildren().forEach(m=>{let f=m.getText();M(f,c,p)&&m.replaceWithText(y);});}),t.getDescendantsOfKind(SyntaxKind.ExpressionStatement).forEach(h=>{h.getChildrenOfKind(SyntaxKind.BinaryExpression).forEach(f=>{f.getRight().getChildren().forEach(g=>{let z=g.getText();M(z,c,p)&&g.replaceWithText(y);});});}),t.getDescendantsOfKind(SyntaxKind.VariableDeclaration).forEach(h=>{let m=h.getInitializer();m&&m.getChildren().forEach(f=>{let $=f.getText();M($,c,p)&&f.replaceWithText(y);});});}),r.replaceWithText(Se(d));}}),{source:t.getFullText(),packages:e}}var Te=new Command().name("radix-ui-import").action(()=>{intro("find .tsx files...");let t=Pe.sync("**/*.tsx",{ignore:["**/node_modules/**"],dot:false}),e=new Project,r="";t.forEach(o=>{let a=e.addSourceFileAtPathIfExists(v.join(process.cwd(),o));if(a)try{let{packages:n}=Ce(a);r+=n.join(" "),a.save();}catch(n){log.error(`failed to transform ${o} ${n}`);}}),r.length?`copy this to delete and install new package
|
|
682
683
|
<your package manager's delete command> ${r}
|
|
683
|
-
<your package manager's install command> ${
|
|
684
|
-
`).forEach(log.step):outro("no transform occured");});var
|
|
684
|
+
<your package manager's install command> ${de.bgGreen("radix-ui")}`.split(`
|
|
685
|
+
`).forEach(log.step):outro("no transform occured");});var _e={version:"4.1.0"};async function gt(){new Command().name("design-system").version(_e.version).addCommand(be).addCommand(pe).addCommand(me).addCommand(Te).addCommand(ke).parse();}gt();
|