Distributing the Library

Build Configuration — Vite Library Mode

// vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import dts from 'vite-plugin-dts';

export default defineConfig({
  plugins: [react(), dts({ include: 'src' })],
  build: {
    lib: {
      entry: 'src/index.ts',
      name: 'AtlasContactControls',
      formats: ['es', 'cjs'],
      fileName: (format) => `index.${format === 'es' ? 'esm' : 'cjs'}.js`
    },
    rollupOptions: {
      // Peer dependencies must be external — not bundled
      external: [
        'react',
        'react-dom',
        '@atlas-forms/types-js',
        '@atlas-forms/control-registry-js',
        '@atlas-forms/validation-js'
      ],
      output: {
        globals: {
          'react': 'React',
          'react-dom': 'ReactDOM'
        }
      }
    }
  }
});

Publication Checklist

• Build passes — npm run build succeeds, dist/ contains JS + type declarations
• Types exported — dist/index.d.ts exists and imports work in TypeScript
• No bundled peers — Verify dist/ does not contain React or Atlas Forms code
• Tests pass — npm test passes with 80%+ coverage
• Version bumped — Follow semantic versioning for your changes

MarketHub Requirements for Control Libraries

Field libraries submitted to MarketHub undergo additional review:

• Accessibility audit — All interactive controls must meet WCAG 2.1 AA minimum (keyboard navigation, ARIA labels, focus management)
• Screenshot in README — Show the EditComponent and ViewComponent in both light and dark themes
• Demo form schema — Include a sample form JSON that demonstrates all controls in the library
• Security scan — No XSS vulnerabilities in display controls (if you render HTML, use DOMPurify)