#!/bin/bash
# This script sets up a Vue 3 + TypeScript library project ready for development
# and eventual building & publishing of your distributable component(s).

# 1. Create your project folder.
read -p "Enter your project folder name: " project_folder
mkdir "$project_folder"
cd "$project_folder" || exit

# 2. Initialize a new npm package.
npm init -y

# 3. Install needed dependencies.
#   - vue: The Vue framework (we install version 3)
#   - typescript: For TS support
#   - vite and @vitejs/plugin-vue: For development and build tooling
npm install vue@3
npm install -D typescript vite @vitejs/plugin-vue

# 4. Create the src folder and add a minimal component and entry point.
mkdir src

# Create a sample Vue component (MyComponent.vue)
cat > src/MyComponent.vue <<'EOF'
<template>
  <div>
    <!-- Your component markup -->
    Hello from MyComponent!
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
  name: 'MyComponent'
});
</script>

<style scoped>
/* Your component styles */
</style>
EOF

# Create an index entry file that exports your component (or library)
cat > src/index.ts <<'EOF'
import { App, Plugin } from 'vue';
import MyComponent from './MyComponent.vue';

const MyLibrary: Plugin = {
  install(app: App) {
    app.component('MyComponent', MyComponent);
  }
};

export { MyComponent };
export default MyLibrary;
EOF

# 5. Create a tsconfig.json file for TypeScript configuration.
cat > tsconfig.json <<'EOF'
{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node",
    "lib": ["ESNext", "DOM"],
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "declaration": true,
    "declarationDir": "dist",
    "sourceMap": true,
    "resolveJsonModule": true,
    "jsx": "preserve"
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.vue"],
  "exclude": ["node_modules", "dist"]
}
EOF

# 6. Set up Vite for library mode by creating vite.config.ts.
cat > vite.config.ts <<'EOF'
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import path from 'path';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  build: {
    lib: {
      // Set the entry point for our library
      entry: path.resolve(__dirname, 'src/index.ts'),
      name: 'MyLibrary',
      formats: ['es', 'umd'],
      // Customize file names for the dist outputs.
      fileName: (format) => \`index.\${format}.js\`
    },
    rollupOptions: {
      // Ensure vue is treated as an external dependency.
      external: ['vue'],
      output: {
        globals: {
          vue: 'Vue'
        }
      }
    }
  }
});
EOF

# 7. Update package.json using a Node.js script.
# Create update-package.js to modify package.json accordingly.
cat > update-package.js <<'EOF'
const fs = require('fs');

const pkgFile = 'package.json';
const pkg = JSON.parse(fs.readFileSync(pkgFile, {encoding: 'utf-8'}));

// Update package.json fields needed for a distributable library.
pkg.main = 'dist/index.umd.js';
pkg.module = 'dist/index.es.js';
pkg.types = 'dist/index.d.ts';
pkg.files = ['dist'];
pkg.scripts = pkg.scripts || {};
pkg.scripts.build = 'vite build';
pkg.peerDependencies = {
  vue: '^3.0.0'
};

fs.writeFileSync(pkgFile, JSON.stringify(pkg, null, 2));
EOF

# Run the Node.js script to update package.json.
node update-package.js

# Remove the update script after running.
rm update-package.js

# 8. Create a basic README file.
cat > README.md <<'EOF'
# Vue 3 Component Library

This project is set up as a library of Vue 3 components written in TypeScript.

## Development

- Add your components in the src folder.
- Build the library with: npm run build

## Usage

After publishing, install via npm and register the library as a Vue plugin:
  import { createApp } from 'vue'
  import MyLibrary from 'your-library-name'
  import App from './App.vue'

  const app = createApp(App);
  app.use(MyLibrary);
  app.mount('#app');
EOF

echo "Setup complete!"
echo "Next steps:"
echo "1. Customize your component(s) in the src folder."
echo "2. Run 'npm run build' to build distributable files into the dist folder."
echo "3. Publish your package to npm as desired."