@decaf-ts/for-angular 0.1.1 → 0.1.4

package/{index.d.ts → dist/lib/index.d.ts}

@@ -15,8 +15,8 @@ import * as i1 from '@angular/common';
 import { Location } from '@angular/common';
 import { Router } from '@angular/router';
 import { OverlayBaseController } from '@ionic/angular/common';
-import { Observable, Subject, Subscription } from 'rxjs';
 import { HttpClient } from '@angular/common/http';
+import { Observable, Subject, Subscription } from 'rxjs';
 import * as i3 from '@ngx-translate/core';
 import { InterpolationParameters, Translation, InterpolatableTranslationObject, TranslateLoader, TranslationObject, TranslateParser, RootTranslateServiceConfig } from '@ngx-translate/core';
 import { Title, SafeHtml, DomSanitizer } from '@angular/platform-browser';
@@ -1167,11 +1167,13 @@ declare class NgxRepositoryDirective<M extends Model> extends DecafComponent<M>
      * @type {Observer}
      */
     protected repositoryObserver: Observer;
+    protected destroySubscriptions$: Subject<void>;
     initialize(): Promise<void>;
     set context(context: DecafRepository<M>);
     from(repository: IRepository<M>): NgxRepositoryDirective<M>;
     get repository(): DecafRepository<M>;
     refresh(model?: unknown): Promise<void>;
+    observe(): void;
     protected buildCondition(attr?: keyof M): Condition<M>;
     read(uid: PrimaryKeyType): Promise<M>;
     delete(data: PrimaryKeyType | PrimaryKeyType[] | M[], pk: PrimaryKeyType): Promise<void>;
@@ -1614,7 +1616,6 @@ declare abstract class NgxComponentDirective extends NgxRepositoryDirective<Mode
      * @default WindowColorSchemes.light
      */
     protected colorSchema: WindowColorScheme;
-    protected destroySubscriptions$: Subject<void>;
     /**
      * @description Constructor for NgxComponentDirective.
      * @summary Initializes the directive by setting up the component name, locale root,
@@ -5954,7 +5955,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @returns {Promise<void>}
      * @memberOf ListComponent
      */
-    handleObserveEvent(clazz: UIFunctionLike, event: OperationKeys, uid: string | number): Promise<void>;
+    handleObserveEvent<M extends Model>(data: M, constructor: UIFunctionLike, event: OperationKeys, uid: string | number): Promise<void>;
     /**
      * @description Function for tracking items in the list.
      * @summary Provides a tracking function for the `*ngFor` directive in the component template.
@@ -5978,7 +5979,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @param {string | number} uid - The ID of the item to create.
      * @returns {Promise<void>} A promise that resolves when the item is created and added to the list.
      */
-    handleCreate(uid: string | number): Promise<void>;
+    handleCreate(data: Model, uid: string | number): Promise<void>;
     /**
      * @description Handles the update event from the repository.
      * @summary Updates the list item with the specified ID based on the new data.
@@ -5988,7 +5989,7 @@ declare class ListComponent extends NgxComponentDirective implements OnInit, OnD
      * @private
      * @memberOf ListComponent
      */
-    handleUpdate(uid: string | number): Promise<void>;
+    handleUpdate(item: Model, uid: string | number): Promise<void>;
     /**
      * @description Removes an item from the list by ID.
      * @summary Filters out an item with the specified ID from the data array and

package/eslint.config.mjs

@@ -0,0 +1,101 @@
+import eslint from '@eslint/js';
+import angular from 'angular-eslint';
+import unusedImports from 'eslint-plugin-unused-imports';
+import tseslint from 'typescript-eslint';
+// import Ajv from 'ajv/dist/ajv.bundle.js';
+
+// new Ajv({ missingRefs: 'ignore' });
+export default tseslint.config(
+  {
+    ignores: [
+      '.vscode/*',
+      'tests/**',
+      '**/*.spec.*',
+      '**/cli-module.*',
+      'src/tests/**',
+      'src/app/**',
+      'src/stories/**/*.ts',
+      'src/polyfills.ts',
+      'src/zone-flags.ts',
+    ],
+  },
+  {
+    files: ['**/*.ts'],
+    languageOptions: {
+      parserOptions: {
+        project: './tsconfig.json',
+      },
+    },
+
+    extends: [
+      eslint.configs.recommended,
+      ...tseslint.configs.recommended,
+      ...tseslint.configs.stylistic,
+      ...angular.configs.tsRecommended,
+    ],
+    processor: angular.processInlineTemplates,
+    plugins: {
+      'unused-imports': unusedImports,
+    },
+    rules: {
+      'prefer-const': 'warn',
+      '@typescript-eslint/no-explicit-any': 'warn',
+      'no-useless-constructor': 'off',
+      '@typescript-eslint/no-useless-constructor': 'warn',
+      '@typescript-eslint/no-inferrable-types': 'off',
+      '@typescript-eslint/no-empty-function': 'warn',
+
+      '@angular-eslint/no-empty-lifecycle-method': 'warn',
+      '@angular-eslint/prefer-inject': 'warn',
+      '@angular-eslint/component-class-suffix': ['error', { suffixes: ['Page', 'Component'] }],
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: ['ngx-decaf', ''],
+          style: 'kebab-case',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: ['app', 'for-angular', 'decaf', 'ngx-decaf'],
+          style: 'kebab-case',
+        },
+      ],
+
+      'unused-imports/no-unused-imports': 'warn',
+      'unused-imports/no-unused-vars': [
+        'warn',
+        {
+          vars: 'all',
+          varsIgnorePattern: '^_',
+          args: 'after-used',
+          argsIgnorePattern: '^_',
+        },
+      ],
+
+      '@typescript-eslint/no-unused-vars': 'warn',
+    },
+  },
+
+  // regras para tipos
+  {
+    files: ['**/*.ts', '**/*.spec.ts'],
+    rules: {
+      'unused-imports/no-unused-imports': 'off',
+      'unused-imports/no-unused-vars': 'off',
+      '@typescript-eslint/no-unused-vars': 'off',
+    },
+    // Só ativa este override se o arquivo estiver na mesma pasta que types.ts
+    // ou se o caminho contiver "types"
+    ignores: ['!**/types.ts', '!**/types/*'],
+  },
+
+  {
+    files: ['**/*.html'],
+    extends: [...angular.configs.templateRecommended, ...angular.configs.templateAccessibility],
+    rules: {},
+  }
+);

package/ionic.config.json

@@ -0,0 +1,14 @@
+
+{
+   "defaultProject": "for-angular-app",
+   "projects": {
+    "for-angular-app": {
+      "name": "@decaf-ts/for-angular-app",
+      "type": "angular",
+      "root": ".",
+      "integrations": {
+        "capacitor": {}
+      }
+    }
+  }
+}

package/jest.config.ts

@@ -0,0 +1,52 @@
+import type { Config } from 'jest';
+
+const config: Config = {
+  preset: 'jest-preset-angular',
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+  testEnvironment: 'jsdom',
+  testPathIgnorePatterns: ['/tests/playwright'],
+  modulePathIgnorePatterns: ['/dist', 'src/app'],
+
+  // Transform settings
+  transform: {
+    '^.+\\.(ts|js|mjs|html|svg)$': [
+      'jest-preset-angular',
+      {
+        tsconfig: '<rootDir>/tsconfig.spec.json',
+        stringifyContentPathRegex: '\\.(html|svg)$',
+        // isolatedModules: true,
+        useESM: true,
+      },
+    ],
+  },
+
+  // Module handling
+  moduleNameMapper: {
+    '^src/lib/engine/(.*)$': '<rootDir>/src/lib/engine/$1',
+    '^src/lib/helpers/(.*)$': '<rootDir>/src/lib/helpers/$1',
+    '^src/lib/(.*)$': '<rootDir>/src/lib/$1',
+    '^lodash-es$': 'lodash',
+    '^ionicons/components/ion-icon.js$': '@ionic/core/components/ion-icon.js'
+  },
+
+  // Critical for Ionic/Stencil modules
+  transformIgnorePatterns: [
+    'node_modules/(?!.*\\.mjs$|@ionic/core|@stencil|@ionic/angular|ionicons)',
+  ],
+
+  // Other settings
+  verbose: true,
+  collectCoverage: false,
+  coverageDirectory: './workdocs/reports/coverage',
+  collectCoverageFrom: ['src/**/*.{js,jsx,ts,tsx}', '!src/bin/**/*'],
+  reporters: ['default'],
+  moduleFileExtensions: ['ts', 'tsx', 'mjs', 'js', 'jsx', 'json', 'node', 'html'],
+  resolver: 'jest-preset-angular/build/resolvers/ng-jest-resolver.js',
+  snapshotSerializers: [
+    'jest-preset-angular/build/serializers/no-ng-attributes',
+    'jest-preset-angular/build/serializers/ng-snapshot',
+    'jest-preset-angular/build/serializers/html-comment',
+  ],
+};
+
+export default config;

package/jest.setup.ts

@@ -0,0 +1,50 @@
+// import 'jest-preset-angular/setup-jest'; // deprecated
+import { TextDecoder, TextEncoder } from 'util';
+import { setupZoneTestEnv } from 'jest-preset-angular/setup-env/zone';
+
+setupZoneTestEnv();
+
+// Jest + Ionic
+Object.defineProperty(window, 'CSS', { value: null });
+
+// Mocking window.matchMedia
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: jest.fn().mockImplementation(query => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: jest.fn(), // obsoleto
+    removeListener: jest.fn(), // obsoleto
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+    dispatchEvent: jest.fn(),
+  })),
+});
+
+// JSDOM: https://thymikee.github.io/jest-preset-angular/docs/getting-started/installation/#customizing
+Object.defineProperty(document, 'doctype', {
+  value: '<!DOCTYPE html>',
+});
+
+Object.defineProperty(window, 'getComputedStyle', {
+  value: () => ({
+    display: 'none',
+    appearance: ['-webkit-appearance'],
+  }),
+});
+
+/**
+ * Workaround for JSDOM missing transform property
+ */
+Object.defineProperty(document.body.style, 'transform', {
+  value: () => {
+    return {
+      enumerable: true,
+      configurable: true,
+    };
+  },
+});
+
+(global as Record<string, unknown>)['TextEncoder'] = TextEncoder;
+(global as Record<string, unknown>)['TextDecoder'] = TextDecoder;

package/karma.conf.js

@@ -0,0 +1,50 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = function (config) {
+  config.set({
+    basePath: "",
+    frameworks: ["jasmine", "@angular-devkit/build-angular"],
+    files: ['src/lib/**/*.spec.ts'],
+    plugins: [
+      require("karma-jasmine"),
+      require("karma-chrome-launcher"),
+      require("karma-jasmine-html-reporter"),
+      require("karma-coverage"),
+      require("@angular-devkit/build-angular/plugins/karma"),
+    ],
+    client: {
+      jasmine: {
+        // you can add configuration options for Jasmine here
+        // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
+        // for example, you can disable the random execution with `random: false`
+        // or set a specific seed with `seed: 4321`
+      },
+    },
+    jasmineHtmlReporter: {
+      suppressAll: true, // removes the duplicated traces
+    },
+    coverageReporter: {
+      dir: require("path").join(__dirname, "workdocs", "reports", "coverage"),
+      subdir: ".",
+      reporters: [
+        { type: 'html' },
+        { type: 'text-summary' },
+        { type: 'lcovonly' }
+      ],
+    },
+    reporters: ["progress", "kjhtml"],
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ["ChromeHeadless", "Chrome"],
+    customLaunchers: {
+      ChromeHeadlessCI: {
+        base: "ChromeHeadless",
+        flags: ["--no-sandbox"],
+      },
+    },
+    singleRun: true,
+    restartOnFileChange: true,
+  });
+};

package/ng-package.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "./dist/lib",
+  "lib": {
+    "entryFile": "src/lib/public-apis.ts",
+    "styleIncludePaths": ["./src/assets"]
+  },
+  "inlineStyleLanguage": "scss",
+  "assets": [
+    {
+      "glob": "**/*",
+      "input": "src/assets",
+      "output": "assets"
+    }
+  ]
+}

package/ngsw-config.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
+  "index": "/index.html",
+  "assetGroups": [
+    {
+      "name": "app",
+      "installMode": "prefetch",
+      "resources": {
+        "files": [
+          "/favicon.ico",
+          "/index.html",
+          "/manifest.webmanifest",
+          "/*.css",
+          "/*.js"
+        ]
+      }
+    },
+    {
+      "name": "assets",
+      "installMode": "lazy",
+      "updateMode": "prefetch",
+      "resources": {
+        "files": [
+          "/assets/**",
+          "/*.(svg|cur|jpg|jpeg|png|apng|webp|avif|gif|otf|ttf|woff|woff2)"
+        ]
+      }
+    }
+  ]
+}

package/package.json

@@ -1,6 +1,59 @@
 {
   "name": "@decaf-ts/for-angular",
-  "version": "0.1.1",
+  "version": "0.1.4",
+  "scripts": {
+    "ng": "ng",
+    "start": "npx rimraf .angular && ng run for-angular-app:serve --host=localhost --port=8110",
+    "decaf": "npx decaf angular generate",
+    "schematics": "schematics",
+    "do-install": "NPM_TOKEN=$(cat .npmtoken) npm install",
+    "update-scripts": "npx update-scripts",
+    "on-first-run": "npx update-scripts --boot",
+    "set-git-auth": "git config url.\"https://api:$(cat .token)@github.com/\".insteadOf \"https://github.com/\" && git config url.\"https://ssh:$(cat .token)@github.com/\".insteadOf \"ssh://git@github.com/\" && git config url.\"https://git:$(cat .token)@github.com/\".insteadOf \"git@github.com:\"",
+    "flash-forward": "npx npm-check-updates -u && npm run do-install",
+    "update-dependencies": "NPM_TOKEN=$(cat .npmtoken) PREFIX=\"decaf-ts\"; npm ls | grep \"$PREFIX\" | awk -F/ '{print $NF}' | sed 's/@.*//' | xargs -I package npm update --force @\"$PREFIX\"/package && ng cache clean",
+    "update-decaf": "NPM_TOKEN=$(cat .npmtoken) PREFIX=\"decaf-ts\"; npm ls | grep \"$PREFIX\" | awk -F/ '{print $NF}' | sed 's/@.*//' | xargs -I package npm update @\"$PREFIX\"/package",
+    "reset": "rm -rf * && git checkout . && git pull && npm run do-install",
+    "build:prod": "npm run lint && ng build for-angular && ng build  for-angular-app",
+    "build": "npx rimraf .angular && npm run lint && ng build for-angular --configuration development && ng build for-angular-app --configuration development && npm run build:cli",
+    "build:cli": "tsc --project tsconfig.cli.json --outDir dist/for-angular/cli",
+    "build:schematics": "node ./bin/build-schematics.js",
+    "server": "npm run start",
+    "watch": "ng build for-angular --watch --configuration development",
+    "test": "npm run test:all",
+    "test:all": "jest --runInBand --passWithNoTests",
+    "test:components": "jest --runInBand --passWithNoTests src/lib/components",
+    "test:services": "jest --runInBand --passWithNoTests src/lib/services",
+    "lint": "ng lint for-angular",
+    "lint-fix": "ng lint --fix",
+    "coverage": "npx rimraf ./workdocs/reports/data/*.json && npm run test:all -- --coverage --config=./workdocs/reports/jest.coverage.config.ts",
+    "prepare-pr": "npm run lint-fix && npm run build:prod && npm run coverage && npm run docs",
+    "prepare-release": "npm run lint-fix && npm run build:prod && npm run coverage && npm run docs",
+    "release": "./bin/tag-release.sh",
+    "clean-publish": "npx clean-publish",
+    "drawings": "for FILE in workdocs/drawings/*.drawio; do echo \"converting $FILE to image...\" && docker run --rm -v $(pwd):/data rlespinasse/drawio-export --format png $FILE; done && cp -rf workdocs/drawings/export/* workdocs/resources/",
+    "uml": "cd workdocs/uml && for FILE in ./*.puml; do docker run --rm -v $(pwd):/work -w /work miy4/plantuml -DPLANTUML_LIMIT_SIZE=8192 -tpng $FILE; done && cd ../.. && cp -fr workdocs/uml/*.png workdocs/resources/",
+    "docs": "npx rimraf ./docs && mkdir docs && npx build-scripts --docs",
+    "publish-docs": "docker run -it --rm --user $(id -u):$(id -g) -v \"$(pwd)/workdocs/confluence:/content\" -e ATLASSIAN_API_TOKEN=$(cat .confluence-token) ghcr.io/markdown-confluence/publish:latest",
+    "storybook": "ng run for-angular:storybook --debug-webpack",
+    "storybook:build": "ng run for-angular:build-storybook",
+    "playwright": "npx playwright test --config=./playwright.config.ts",
+    "playwright-ui": "npx playwright test --config=./playwright.config.ts --ui",
+    "playwright-setup": "npm init playwright@latest",
+    "increase:fs:watches": "sudo sysctl -n -w fs.inotify.max_user_watches=1048576 && sudo sysctl -n -w fs.inotify.max_user_instances=512",
+    "publish": "NPM_TOKEN=$(cat .npmtoken) npm publish ./dist/lib --access public",
+    "resources": "npm run resources:pwa",
+    "resources:android": "npx capacitor-assets generate --android --assetPath='resources' && npm run resources",
+    "resources:ios": "npx capacitor-assets generate --ios --assetPath='resources' && npm run resources",
+    "resources:pwa": "npx capacitor-assets generate --pwa --assetPath='resources' --pwaManifestPath='src/manifest.webmanifest'",
+    "repo:init": "codex exec \"$(cat ./.codex/prompts/repo-setup.md)\nbase_path is `./`, initialize the repository\"",
+    "repo:setup": "codex exec \"$(cat ./.codex/prompts/repo-setup.md)\nbase_path is ./\"",
+    "repo:doc": "codex exec \"$(cat ./.codex/prompts/doc.md) $(cat ./.codex/prompts/bulk-docs.md)\nbase_path is ./\"",
+    "repo:tests": "codex exec \"$(cat ./.codex/prompts/bulk-tests.md)\nbase_path is ./ and coverage is 95%\" -s workspace-write",
+    "repo:readme": "codex exec \"$(cat ./.codex/prompts/update-readme.md)\nbase_path is ./\"",
+    "repo:pr": "npm run repo:doc && npm run repo:tests && npm run repo:readme",
+    "sync-codex": "./bin/sync-codex.sh"
+  },
   "author": "Tiago Venceslau and Contributors",
   "license": "MPL-2.0 OR AGPL-3.0",
   "repository": {
@@ -11,6 +64,37 @@
     "node": ">=20.0.0",
     "npm": ">=10.0.0"
   },
+  "devDependencies": {
+    "@angular-devkit/schematics": "^20.2.0",
+    "@angular-devkit/schematics-cli": "^20.2.0",
+    "@angular-eslint/builder": "^20.5.0",
+    "@angular-eslint/schematics": "^20.2.0",
+    "@angular/cli": "^20.3.9",
+    "@angular/compiler-cli": "^20.3.9",
+    "@decaf-ts/cli": "latest",
+    "@decaf-ts/utils": "latest",
+    "@faker-js/faker": "^9.9.0",
+    "@playwright/test": "^1.54.1",
+    "@storybook/addon-docs": "9.1.5",
+    "@storybook/addon-onboarding": "9.1.5",
+    "@storybook/angular": "9.1.5",
+    "@types/bwip-js": "^3.2.3",
+    "@types/jest": "^30.0.0",
+    "@types/node": "^22.15.24",
+    "ajv": "^6.14.0",
+    "angular-eslint": "^20.2.0",
+    "eslint": "^9.29.0",
+    "eslint-plugin-storybook": "9.1.5",
+    "eslint-plugin-unused-imports": "^4.4.1",
+    "ffmpeg-static": "5.2.0",
+    "jest-preset-angular": "^14.6.0",
+    "ng-packagr": "^20.3.0",
+    "storybook": "^9.1.17",
+    "ts-node": "^10.9.2",
+    "tslib": "^2.3.0",
+    "typescript": "~5.8.3",
+    "typescript-eslint": "8.34.1"
+  },
   "peerDependencies": {
     "@angular-builders/custom-webpack": "^20.0.0",
     "@angular/animations": "^20.3.16",
@@ -54,20 +138,5 @@
   "browser": {
     "worker_threads": false,
     "node:worker_threads": false
-  },
-  "module": "fesm2022/decaf-ts-for-angular.mjs",
-  "typings": "index.d.ts",
-  "exports": {
-    "./package.json": {
-      "default": "./package.json"
-    },
-    ".": {
-      "types": "./index.d.ts",
-      "default": "./fesm2022/decaf-ts-for-angular.mjs"
-    }
-  },
-  "sideEffects": false,
-  "dependencies": {
-    "tslib": "^2.3.0"
   }
-}
+}

package/playwright.config.ts

@@ -0,0 +1,80 @@
+import { defineConfig, devices } from '@playwright/test';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// import dotenv from 'dotenv';
+// import path from 'path';
+// dotenv.config({ path: path.resolve(__dirname, '.env') });
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+  testDir: './tests/playwright',
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env?.['CI'],
+  /* Retry on CI only */
+  retries: process.env?.['CI'] ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env?.['CI']? 1 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    // baseURL: 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+    video: 'on',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+
+    // {
+    //   name: 'firefox',
+    //   use: { ...devices['Desktop Firefox'] },
+    // },
+
+    // {
+    //   name: 'webkit',
+    //   use: { ...devices['Desktop Safari'] },
+    // },
+
+    /* Test against mobile viewports. */
+    // {
+    //   name: 'Mobile Chrome',
+    //   use: { ...devices['Pixel 5'] },
+    // },
+    // {
+    //   name: 'Mobile Safari',
+    //   use: { ...devices['iPhone 12'] },
+    // },
+
+    /* Test against branded browsers. */
+    // {
+    //   name: 'Microsoft Edge',
+    //   use: { ...devices['Desktop Edge'], channel: 'msedge' },
+    // },
+    // {
+    //   name: 'Google Chrome',
+    //   use: { ...devices['Desktop Chrome'], channel: 'chrome' },
+    // },
+  ],
+
+  /* Run your local dev server before starting the tests */
+  // webServer: {
+  //   command: 'npm run start',
+  //   url: 'http://localhost:3000',
+  //   reuseExistingServer: !process.env.CI,
+  // },
+});