react-component-scaffolder/dist/generateComponent.js

CLI tool for scaffolding accessible React components with built-in Storybook stories, Jest tests, and markdown documentation

#!/usr/bin/env node
"use strict";var S=Object.create;var d=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var R=(t,o,a,f)=>{if(o&&typeof o=="object"||typeof o=="function")for(let m of j(o))!F.call(t,m)&&m!==a&&d(t,m,{get:()=>o[m],enumerable:!(f=L(o,m))||f.enumerable});return t};var l=(t,o,a)=>(a=t!=null?S(k(t)):{},R(o||!t||!t.__esModule?d(a,"default",{value:t,enumerable:!0}):a,t));var i=l(require("fs")),s=l(require("path")),C=l(require("minimist"));var u=t=>`
import React from 'react'

export const ${t} = ({ type = 'button', children, ...props }) => {
  return (
    <button type={type} {...props}>
      {children || '${t}'}
    </button>
  )
}
`;var g=t=>`
import React from 'react'

export const ${t} = ({ id = '${t}Input', ...props }) => {
  return (
    <input
      type="text"
      id={id}
      name={id}
      aria-label="${t}"
      required
      {...props}
    />
  )
}
`;var h=t=>`
import React from 'react'

export const ${t} = ({ onSubmit, children, ...props }) => {
  return (
    <form role="form" onSubmit={onSubmit} {...props}>
      {children}
    </form>
  )
}
`;var $=t=>`
import React from 'react'

export const ${t} = ({ id = '${t}Area', ...props }) => {
  return (
    <textarea
      id={id}
      name={id}
      aria-label="${t}"
      required
      {...props}
    />
  )
}
`;var x=t=>`
import React from 'react'

export const ${t} = ({ htmlFor = '${t}Input', children, ...props }) => {
  return (
    <label htmlFor={htmlFor} {...props}>
      {children || '${t}'}
    </label>
  )
}
`;var b=t=>`
import React from 'react'

export const ${t} = (props) => {
  return <div {...props}>${t}</div>
}
`;var T=t=>`
import React from 'react'

export const ${t} = ({ children, ...props }) => {
  return (
    <a href="" {...props}>
      {children || '${t}'}
    </a>
  )
}
`;var w={button:u,input:g,form:h,textarea:$,label:x,link:T},y=t=>t in w?w[t]:b;var r=(0,C.default)(process.argv.slice(2)),e=r._[0],c=r.lang||"ts",v=r["with-tests"],W=r["with-story"],I=r["with-docs"],D=r.element?.toLowerCase(),M=r.help;(M||!e)&&(console.log(`
Usage: react-dev-scaffolder <ComponentName> [options]

Options:
  --lang=ts|js         Language output (default: ts)
  --with-tests         Include Jest test file
  --with-story         Include Storybook story file
  --with-docs          Include Markdown props documentation
  --element=<tag>      Override tag detection (e.g. input, form)
  --help               Show this help message
`),process.exit(0));var n=null;e.toLowerCase().endsWith("button")&&(n="button");e.toLowerCase().endsWith("form")&&(n="form");e.toLowerCase().endsWith("input")&&(n="input");e.toLowerCase().endsWith("label")&&(n="label");e.toLowerCase().endsWith("textarea")&&(n="textarea");e.toLowerCase().endsWith("link")&&(n="link");var O=D||n||e.toLowerCase(),q=y(O),A=q(e),B=c==="js"?"js":"tsx",p=s.default.join("src","components",e);i.default.mkdirSync(p,{recursive:!0});i.default.writeFileSync(s.default.join(p,`${e}.${B}`),A);v&&i.default.writeFileSync(s.default.join(p,`${e}.test.${c}`),`describe('${e}', () => {
  it('renders correctly', () => {
    // TODO: Add test
  })
})`);W&&i.default.writeFileSync(s.default.join(p,`${e}.stories.${c}`),`import React from 'react'
import { ${e} } from './${e}'

export default {
  title: '${e}',
  component: ${e},
}

export const Default = () => <${e} />
`);I&&i.default.writeFileSync(s.default.join(p,`${e}.md`),`# ${e}

Component props and usage.

\`\`\`tsx
<${e} />
\`\`\`
`);console.log(`\u2705 Component "${e}" scaffolded in ${p}`);