chore(ci): introduce ci workflows (#352)

* ci: add workflows

* ci: add template files

* update scripts

* update path aliases

* add type aliases

* update dependencies

* finalize react build

* update publish workflow

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,38 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**To Reproduce**
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Desktop (please complete the following information):**
+ - OS: [e.g. iOS]
+ - Browser [e.g. chrome, safari]
+ - Version [e.g. 22]
+
+**Smartphone (please complete the following information):**
+ - Device: [e.g. iPhone6]
+ - OS: [e.g. iOS8.1]
+ - Browser [e.g. stock browser, safari]
+ - Version [e.g. 22]
+
+**Additional context**
+Add any other context about the problem here.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,20 @@
+---
+name: Feature request
+about: Suggest an idea for this project
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+
+**Describe the solution you'd like**
+A clear and concise description of what you want to happen.
+
+**Describe alternatives you've considered**
+A clear and concise description of any alternative solutions or features you've considered.
+
+**Additional context**
+Add any other context or screenshots about the feature request here.

.github/pull_request_template.md

@@ -0,0 +1,17 @@
+<!--
+Thanks for opening a PR! Your contribution is much appreciated.
+In order to make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below.
+Choose the right checklist for the change that you're making:
+-->
+
+## Bug
+
+- [ ] Related issues linked using `fixes #number`
+- [ ] Tests added
+
+## Feature
+
+- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
+- [ ] Related issues linked using `fixes #number`
+- [ ] Tests added
+- [ ] Documentation added

.github/workflows/development.yml

@@ -0,0 +1,58 @@
+name: Development
+
+on:
+  pull_request:
+    types:
+      - opened
+      - edited
+      - synchronize
+      - reopened
+  workflow_call:
+
+jobs:
+  test:
+    name: Run unit tests
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 9
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "pnpm"
+
+      - name: "📦 install dependencies"
+        run: pnpm install
+
+      - name: "🔍 run tests"
+        run: pnpm test
+
+  lint:
+    name: Run linter
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    steps:
+      - name: "☁️ checkout repository"
+        uses: actions/checkout@v4
+
+      - name: "🔧 setup pnpm"
+        uses: pnpm/action-setup@v3
+        with:
+          version: 9
+
+      - name: "🔧 setup node"
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "pnpm"
+
+      - name: "📦 install dependencies"
+        run: pnpm install
+
+      - name: "🔍 lint code"
+        run: pnpm lint

.github/workflows/npm-publish.yml

@@ -0,0 +1,83 @@
+name: Publish
+
+on:
+  pull_request:
+    types:
+      - closed
+    branches:
+      - main
+
+jobs:
+  build:
+    if:
+      github.event.pull_request.merged == true &&
+      startsWith(github.event.pull_request.head.ref, 'release/')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Set PACKAGE_NAME variable
+        id: set-package-name
+        run:
+          echo "PACKAGE_NAME=$(echo ${{ github.head_ref }} | awk -F'/' '{print
+          $2}')" >> $GITHUB_ENV
+
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 9
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "pnpm"
+
+      - name: "📦 install dependencies"
+        run: pnpm install
+
+      - name: "🧱 build package"
+        run: pnpm ${{ env.PACKAGE_NAME }}:build
+
+      - name: "🗄️ archive package"
+        uses: actions/upload-artifact@v4
+        with:
+          name: dist
+          path: packages/${{ env.PACKAGE_NAME }}/dist
+
+  publish-npm:
+    needs: build
+    if:
+      github.event.pull_request.merged == true &&
+      startsWith(github.event.pull_request.head.ref, 'release/')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Set PACKAGE_NAME variable
+        id: set-package-name
+        run:
+          echo "PACKAGE_NAME=$(echo ${{ github.head_ref }} | awk -F'/' '{print
+          $2}')" >> $GITHUB_ENV
+
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 9
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "pnpm"
+          registry-url: https://registry.npmjs.org/
+
+      - name: "📦 install dependencies"
+        run: pnpm install
+
+      - name: "🚚 download package"
+        uses: actions/download-artifact@v4
+        with:
+          name: dist
+          path: packages/${{ env.PACKAGE_NAME }}/dist
+
+      - name: "🚀 publish package"
+        run: pnpm ${{ env.PACKAGE_NAME }}:release
+        env:
+          NPM_AUTH_TOKEN: ${{secrets.NPM_AUTH_TOKEN}}

package.json

@@ -21,10 +21,10 @@
     "web-icons:release": "pnpm --filter @tapsioss/web-icons run release",
     "react-icons:build": "pnpm --filter @tapsioss/react-icons run build",
     "react-icons:release": "pnpm --filter @tapsioss/react-icons run release",
-    "packages:dev": "pnpm run -r --parallel dev",
-    "packages:build": "pnpm run -r --filter=!@tapsioss/playground build",
+    "packages:dev": "pnpm run -r --parallel --filter=!@tapsioss/docs dev",
+    "packages:build": "pnpm run -r --filter=!@tapsioss/playground --filter=!@tapsioss/docs build",
     "prepackages:release": "pnpm packages:build",
-    "packages:release": "pnpm run -r --filter=!@tapsioss/playground release",
+    "packages:release": "pnpm run -r --filter=!@tapsioss/playground --filter=!@tapsioss/docs release",
     "dev": "pnpm run packages:dev",
     "test": "pnpm run -r --parallel test",
     "lint:ts": "tsc --project tsconfig.json",
@@ -43,9 +43,9 @@
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.10.2",
     "@eslint/js": "^9.1.1",
+    "@lit/react": "^1.0.6",
     "@open-wc/lit-helpers": "^0.7.0",
     "@open-wc/testing": "^4.0.0",
-    "@tapsioss/icons": "0.0.0-alpha-8",
     "@types/chai": "^4.3.12",
     "@types/eslint__js": "^8.42.3",
     "@types/mocha": "^10.0.6",

packages/react-components/scripts/generate.ts

@@ -214,7 +214,7 @@ const transformToComponentModule = new Transform({
 
       await fs.promises.appendFile(
         barrelFilePath,
-        `export { default as ${componentName} } from "./${componentName}";\n`,
+        `export { default as ${componentName} } from "./${componentName}.ts";\n`,
         {
           encoding: "utf-8",
         },

packages/react-components/src/index.ts

@@ -1,37 +1,37 @@
-export { default as Avatar } from "./Avatar";
-export { default as Badge } from "./Badge";
-export { default as BadgeWrapper } from "./BadgeWrapper";
-export { default as Banner } from "./Banner";
-export { default as BottomNavigation } from "./BottomNavigation";
-export { default as BottomNavigationItem } from "./BottomNavigationItem";
-export { default as BottomSheet } from "./BottomSheet";
-export { default as Button } from "./Button";
-export { default as ButtonGroup } from "./ButtonGroup";
-export { default as ChatBubbleIn } from "./ChatBubbleIn";
-export { default as ChatBubbleOut } from "./ChatBubbleOut";
-export { default as Checkbox } from "./Checkbox";
-export { default as Chip } from "./Chip";
-export { default as ChipGroup } from "./ChipGroup";
-export { default as Divider } from "./Divider";
-export { default as EmptyState } from "./EmptyState";
-export { default as FileInput } from "./FileInput";
-export { default as IconButton } from "./IconButton";
-export { default as Modal } from "./Modal";
-export { default as Notice } from "./Notice";
-export { default as PinInput } from "./PinInput";
-export { default as Pinwheel } from "./Pinwheel";
-export { default as PinwheelGroup } from "./PinwheelGroup";
-export { default as PinwheelItem } from "./PinwheelItem";
-export { default as ProgressIndicator } from "./ProgressIndicator";
-export { default as Radio } from "./Radio";
-export { default as RateSlider } from "./RateSlider";
-export { default as SegmentedView } from "./SegmentedView";
-export { default as SegmentedViewItem } from "./SegmentedViewItem";
-export { default as Skeleton } from "./Skeleton";
-export { default as Snackbar } from "./Snackbar";
-export { default as Spinner } from "./Spinner";
-export { default as Stepper } from "./Stepper";
-export { default as Switch } from "./Switch";
-export { default as TextArea } from "./TextArea";
-export { default as TextField } from "./TextField";
-export { default as Tooltip } from "./Tooltip";
+export { default as Avatar } from "./Avatar.ts";
+export { default as Badge } from "./Badge.ts";
+export { default as BadgeWrapper } from "./BadgeWrapper.ts";
+export { default as Banner } from "./Banner.ts";
+export { default as BottomNavigation } from "./BottomNavigation.ts";
+export { default as BottomNavigationItem } from "./BottomNavigationItem.ts";
+export { default as BottomSheet } from "./BottomSheet.ts";
+export { default as Button } from "./Button.ts";
+export { default as ButtonGroup } from "./ButtonGroup.ts";
+export { default as ChatBubbleIn } from "./ChatBubbleIn.ts";
+export { default as ChatBubbleOut } from "./ChatBubbleOut.ts";
+export { default as Checkbox } from "./Checkbox.ts";
+export { default as Chip } from "./Chip.ts";
+export { default as ChipGroup } from "./ChipGroup.ts";
+export { default as Divider } from "./Divider.ts";
+export { default as EmptyState } from "./EmptyState.ts";
+export { default as FileInput } from "./FileInput.ts";
+export { default as IconButton } from "./IconButton.ts";
+export { default as Modal } from "./Modal.ts";
+export { default as Notice } from "./Notice.ts";
+export { default as PinInput } from "./PinInput.ts";
+export { default as Pinwheel } from "./Pinwheel.ts";
+export { default as PinwheelGroup } from "./PinwheelGroup.ts";
+export { default as PinwheelItem } from "./PinwheelItem.ts";
+export { default as ProgressIndicator } from "./ProgressIndicator.ts";
+export { default as Radio } from "./Radio.ts";
+export { default as RateSlider } from "./RateSlider.ts";
+export { default as SegmentedView } from "./SegmentedView.ts";
+export { default as SegmentedViewItem } from "./SegmentedViewItem.ts";
+export { default as Skeleton } from "./Skeleton.ts";
+export { default as Snackbar } from "./Snackbar.ts";
+export { default as Spinner } from "./Spinner.ts";
+export { default as Stepper } from "./Stepper.ts";
+export { default as Switch } from "./Switch.ts";
+export { default as TextArea } from "./TextArea.ts";
+export { default as TextField } from "./TextField.ts";
+export { default as Tooltip } from "./Tooltip.ts";

playground/package.json

@@ -9,7 +9,11 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@lit/react": "^1.0.6",
-    "lit": "^3.2.1"
+    "@tapsioss/icons": "workspace:*",
+    "@tapsioss/react-components": "workspace:*",
+    "@tapsioss/react-icons": "workspace:*",
+    "@tapsioss/theme": "workspace:*",
+    "@tapsioss/web-components": "workspace:*",
+    "@tapsioss/web-icons": "workspace:*"
   }
 }