@compsych-ui-components/angular 3.2.4

package/ng-package.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "lib": {
+    "entryFile": "src/index.ts"
+  },
+  "dest": "../../dist/packages/angular"
+}

package/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "@compsych-ui-components/angular",
+  "version": "3.2.4",
+  "description": "Angular UI components for compsych",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "peerDependencies": {
+    "@angular/common": ">=17.0.0",
+    "@angular/core": ">=17.0.0",
+    "@compsych-ui-components/shared": "*"
+  }
+}

package/project.json

@@ -0,0 +1,18 @@
+{
+  "name": "angular",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "packages/angular/src",
+  "projectType": "library",
+  "targets": {
+    "build": {
+      "executor": "@nx/angular:ng-packagr-lite",
+      "outputs": ["{workspaceRoot}/dist/packages/angular"],
+      "options": {
+        "project": "packages/angular/ng-package.json",
+        "tsConfig": "packages/angular/tsconfig.lib.json"
+      },
+      "dependsOn": ["^build"]
+    }
+  },
+  "implicitDependencies": ["shared"]
+}

package/src/index.ts

@@ -0,0 +1,10 @@
+import { NgModule } from '@angular/core';
+import { ButtonComponent } from './lib/button.component';
+
+export { ButtonComponent } from './lib/button.component';
+
+@NgModule({
+  imports: [ButtonComponent],
+  exports: [ButtonComponent],
+})
+export class CompsychAngularModule {}

package/src/lib/button.component.ts

@@ -0,0 +1,34 @@
+import { Component, Input } from '@angular/core';
+import { showAlert } from '@compsych-ui-components/shared';
+
+@Component({
+  selector: 'compsych-button',
+  standalone: true,
+  template: `
+    <button class="compsych-button" (click)="handleClick()">
+      {{ label }}
+    </button>
+  `,
+  styles: [`
+    .compsych-button {
+      padding: 8px 16px;
+      background-color: #1976d2;
+      color: white;
+      border: none;
+      border-radius: 4px;
+      font-size: 14px;
+      cursor: pointer;
+    }
+    .compsych-button:hover {
+      background-color: #1565c0;
+    }
+  `],
+})
+export class ButtonComponent {
+  @Input() label = 'Click me';
+  @Input() alertMessage = 'Hello from @compsych-ui-components/angular!';
+
+  handleClick(): void {
+    showAlert(this.alertMessage);
+  }
+}

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "declarationDir": "../../dist/out-tsc",
+    "experimentalDecorators": true
+  },
+  "include": ["src/**/*.ts"]
+}

package/tsconfig.lib.json

@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "declaration": true,
+    "types": []
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  },
+  "exclude": ["**/*.spec.ts"]
+}