feat: initial react jotform component

.eslintrc.cjs

@@ -0,0 +1,22 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2020: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+    'plugin:storybook/recommended',
+    'plugin:@typescript-eslint/recommended-requiring-type-checking',
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+  },
+  plugins: ['react-refresh'],
+  rules: {
+    'react-refresh/only-export-components': 'warn',
+  },
+};

.github/workflows/build.yml

@@ -0,0 +1,27 @@
+name: Build and Test
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [20.x]
+    steps:
+      - uses: actions/checkout@v4
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
+      - name: Run tests
+        run: npm test
+      - name: Build package
+        run: npm run build

.github/workflows/release-and-publish.yml

@@ -0,0 +1,46 @@
+name: Release and Publish
+on:
+  workflow_dispatch:
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20.x'
+          registry-url: 'https://registry.npmjs.org'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests
+        run: npm test
+
+      - name: Get version
+        run: echo "PACKAGE_VERSION=$(node -p "require('./package.json').version")" >> $GITHUB_ENV
+
+      - name: Create Release
+        uses: softprops/action-gh-release@v1
+        with:
+          name: Release v${{ env.PACKAGE_VERSION }}
+          tag_name: v${{ env.PACKAGE_VERSION }}
+          generate_release_notes: true
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Build
+        run: npm run build
+
+      - name: Publish to npm
+        run: npm publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.prettierrc.json

@@ -0,0 +1,5 @@
+{
+  "printWidth": 120,
+  "singleQuote": true,
+  "tabWidth": 2
+}

.storybook/main.ts

@@ -0,0 +1,18 @@
+import type { StorybookConfig } from '@storybook/react-vite';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],
+  addons: ['@storybook/addon-essentials'],
+  core: {
+    disableTelemetry: true,
+  },
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  docs: {
+    autodocs: 'tag',
+  },
+};
+
+export default config;

README.md

@@ -1,2 +1,62 @@
-# react-embed-jotform
-A react component for embedding jotforms
+# REACT EMBED JOTFORM
+
+A React component library for easily embedding JotForm forms into your React applications.
+
+## INSTALLATION
+
+```bash
+npm install @symbiotetech/react-embed-jotform
+```
+
+## USAGE
+
+```tsx
+import { JotForm } from '@symbiotetech/react-embed-jotform';
+
+function App() {
+  return (
+    <JotForm
+      formId="your-jotform-id-here"
+      // Optional props
+      className="jotform-form"
+      style={{
+        width: '500px',
+      }}
+    />
+  );
+}
+```
+
+## Props
+
+| Prop        | Type          | Required | Description                             |
+| ----------- | ------------- | -------- | --------------------------------------- |
+| `formId`    | string        | Yes      | The JotForm form ID to embed            |
+| `className` | string        | No       | Custom CSS class name for the container |
+| `style`     | CSSProperties | No       | Inline styles for the container         |
+
+## Development
+
+To start development:
+
+1. Clone the repository
+2. Install dependencies:
+
+   ```bash
+   npm install
+   ```
+
+3. Run Storybook for development:
+
+   ```bash
+   npm run storybook:dev
+   ```
+
+4. Run tests:
+   ```bash
+   npm run test
+   ```
+
+---
+
+Made with love by [Symbiote](https://www.symbiote.com.au/)