@echo-blue/ng-jsoneditor 18.0.5

package/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

package/.eslintrc.json

@@ -0,0 +1,86 @@
+{
+  "root": true,
+  "ignorePatterns": [
+    "projects/**/*"
+  ],
+  "overrides": [
+    {
+      "files": [
+        "*.ts"
+      ],
+      "parserOptions": {
+        "project": [
+          "tsconfig.json",
+          "e2e/tsconfig.json"
+        ],
+        "createDefaultProgram": true
+      },
+      "extends": [
+        "plugin:@angular-eslint/ng-cli-compat",
+        "plugin:@angular-eslint/ng-cli-compat--formatting-add-on",
+        "plugin:@angular-eslint/template/process-inline-templates"
+      ],
+      "rules": {
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "app",
+            "style": "kebab-case"
+          }
+        ],
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "type": "attribute",
+            "prefix": "app",
+            "style": "camelCase"
+          }
+        ],
+        "@typescript-eslint/consistent-type-definitions": "error",
+        "@typescript-eslint/dot-notation": "off",
+        "@typescript-eslint/explicit-member-accessibility": [
+          "off",
+          {
+            "accessibility": "explicit"
+          }
+        ],
+        "@typescript-eslint/member-delimiter-style": [
+          "off",
+          {
+            "multiline": {
+              "delimiter": "none",
+              "requireLast": true
+            },
+            "singleline": {
+              "delimiter": "semi",
+              "requireLast": false
+            }
+          }
+        ],
+        "@typescript-eslint/no-use-before-define": "error",
+        "@typescript-eslint/semi": [
+          "off",
+          null
+        ],
+        "brace-style": [
+          "error",
+          "1tbs"
+        ],
+        "id-blacklist": "off",
+        "id-match": "off",
+        "no-underscore-dangle": "off",
+        "valid-typeof": "error"
+      }
+    },
+    {
+      "files": [
+        "*.html"
+      ],
+      "extends": [
+        "plugin:@angular-eslint/template/recommended"
+      ],
+      "rules": {}
+    }
+  ]
+}

package/.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,42 @@
+---
+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.
+
+**Console and Error stack trace**
+If applicable, add screenshots to help explain your problem.
+Use debug mode to see in your console the data and options passed to jsoneditor. Copy this and paste in your issue when reporting bugs. Copy the stacktrace as well!
+
+```html
+<json-editor [debug]="true" [options]="editorOptionsData" [data]="dataStructure"></json-editor>
+```
+
+
+**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]
+ - Ng Version [run `ng version` and paste here]
+
+
+**Additional context**
+Add any other context about the problem here.

package/.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.

package/.github/workflows/npm-publish.yml

@@ -0,0 +1,26 @@
+# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
+# For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages
+
+name: Node.js Package
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      id-token: write
+    steps:
+      - uses: actions/checkout@v6
+      - uses: actions/setup-node@v6
+        with:
+          node-version: 24
+          registry-url: 'https://registry.npmjs.org'
+      - run: npm ci
+      - run: npm test
+      - run: npm publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.npm_token}}

package/.travis.yml

@@ -0,0 +1,24 @@
+language: node_js
+node_js:
+  - "10.13"
+addons:
+  chrome: stable
+services:
+  - xvfb
+before_script:
+  - "export DISPLAY=:99.0"
+  # - "sh -e /etc/init.d/xvfb start"
+  - sleep 3 # give xvfb some time to start
+  - npm run build:lib build:app
+  - sleep 3 # give Web server some time to bind to sockets, etc
+
+before_install:
+  - npm install -g typescript webdriver-manager ng-packagr @angular/cli@9.0.2
+  - "/sbin/start-stop-daemon --start --quiet --pidfile /tmp/custom_xvfb_99.pid --make-pidfile --background --exec /usr/bin/Xvfb -- :99 -ac -screen 0 1280x1024x16"
+  - google-chrome-stable --headless --disable-gpu --remote-debugging-port=9222 http://localhost &
+
+install:
+  - npm install
+  - webdriver-manager update
+  - node node_modules/protractor/bin/webdriver-manager update
+  - node_modules/protractor/bin/webdriver-manager update

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 David Herges
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,188 @@
+# Angular Json Editor
+
+[![Build Status](https://travis-ci.org/mariohmol/ang-jsoneditor.svg?branch=master)](https://travis-ci.org/mariohmol/ang-jsoneditor)
+
+Angular Json Editor (wrapper for [jsoneditor](https://github.com/josdejong/jsoneditor)). View/Edit Json file with formatting.
+
+[StackBlitz template](https://stackblitz.com/edit/ang-jsoneditor)
+
+Working with latest Angular 18.
+
+![Demo Image](/src/assets/printDemo.png)
+
+## Installation
+
+To install this library with npm, run below command:
+
+```sh
+$ npm install --save jsoneditor @echo-blue/ng-jsoneditor
+```
+
+Example:
+
+```html
+<json-editor [options]="editorOptions" [data]="data" (change)="getData($event)"></json-editor>
+```
+
+## Usage
+
+### Configuration
+
+Import the standalone component as below:
+
+```ts
+import { Component, ViewChild } from '@angular/core';
+import { JsonEditorComponent, JsonEditorOptions } from '@echo-blue/ng-jsoneditor';
+
+@Component({
+  selector: 'app-root',
+  template: '<json-editor [options]="editorOptions" [data]="data"></json-editor>',
+  styleUrls: ['./app.component.css'],
+  imports: [JsonEditorComponent]
+})
+export class AppComponent {
+  public editorOptions: JsonEditorOptions;
+  public data: any;
+  // optional
+  @ViewChild(JsonEditorComponent, { static: false }) editor: JsonEditorComponent;
+
+  constructor() {
+    this.editorOptions = new JsonEditorOptions()
+    this.editorOptions.modes = ['code', 'text', 'tree', 'view']; // set all allowed modes
+    //this.options.mode = 'code'; //set only one mode
+
+    this.data = {"products":[{"name":"car","product":[{"name":"honda","model":[{"id":"civic","name":"civic"},{"id":"accord","name":"accord"},{"id":"crv","name":"crv"},{"id":"pilot","name":"pilot"},{"id":"odyssey","name":"odyssey"}]}]}]}
+  }
+
+}
+```
+Note : For better styling, add below line to your main style.css file
+
+```js
+@import "~jsoneditor/dist/jsoneditor.min.css";
+```
+
+
+### Forms
+
+Build it integrated with ReactiveForms:
+
+```ts
+this.form = this.fb.group({
+  myinput: [this.data]
+});
+```
+```html
+<form  [formGroup]="form" (submit)="submit()">
+    <json-editor [options]="editorOptions2" formControlName="myinput">
+    </json-editor>
+</form>
+```
+
+### Extra Features
+
+Besides all the
+[configuration options](https://github.com/josdejong/jsoneditor/blob/master/docs/api.md)
+from the original jsoneditor, Angular Json Editor supports one additional option:
+
+_expandAll_ - to automatically expand all nodes upon json loaded with the _data_ input.
+
+# Troubleshoot
+
+If you have issue with the height of the component, you can try one of those solutions:
+
+When you import CSS:
+
+```css
+@import "~jsoneditor/dist/jsoneditor.min.css";
+textarea.jsoneditor-text{min-height:350px;}
+```
+
+Or Customizing the CSS:
+
+```css
+:host ::ng-deep json-editor,
+:host ::ng-deep json-editor .jsoneditor,
+:host ::ng-deep json-editor > div,
+:host ::ng-deep json-editor jsoneditor-outer {
+  height: 500px;
+}
+```
+
+Or  as a inner style in component:
+
+```html
+<json-editor class="col-md-12" #editorExample style="min-height: 300px;" [options]="editorOptionsData" [data]="dataStructure"></json-editor>
+```
+
+For code view you can change the height using this example:
+```css
+.ace_editor.ace-jsoneditor {
+  min-height: 500px;
+}
+```
+
+Use debug mode to see in your console the data and options passed to jsoneditor. Copy this and paste in your issue when reporting bugs.
+
+```html
+<json-editor [debug]="true" [options]="editorOptionsData" [data]="dataStructure"></json-editor>
+```
+
+## JSONOptions missing params
+
+If you find youself trying to use an custom option that is not mapped here, you can do:
+
+```ts
+let editorOptions: JsonEditorOptions = new JsonEditorOptions(); (<any>this.editorOptions).templates = [{menu options objects as in json editor documentation}]
+```
+
+See the [issue](https://github.com/mariohmol/ang-jsoneditor/issues/57)
+
+## Internet Explorer
+
+If you want to support IE, please follow this guide:
+* https://github.com/mariohmol/ang-jsoneditor/issues/44#issuecomment-508650610
+
+## Multiple editors
+
+To use multiple jsoneditors in your view you cannot use the same editor options.
+
+You should have something like:
+
+```html
+<div *ngFor="let prd of data.products" class="w-100-p p-24" >
+  <json-editor [options]="makeOptions()" [data]="prd" (change)="showJson($event)"></json-editor>
+</div>
+```
+
+```ts
+makeOptions = () => {
+  return new JsonEditorOptions();
+}
+```
+
+# Demo
+
+Demo component files are included in Git Project.
+
+Demo Project with a lot of different implementations (ngInit, change event and others):
+[https://github.com/mariohmol/ang-jsoneditor/tree/master/src/app/demo)
+
+When publishing it to npm, look over this docs: https://docs.npmjs.com/misc/developers
+
+# Testing
+
+Unit tests now run with [Vitest](https://vitest.dev/). Use `npm run test:dev` for an interactive watch mode during development or `npm run test:unit` for a single CI-friendly execution. The legacy Karma/Jasmine setup has been removed.
+
+# Collaborate
+
+Fork, clone this repo and install dependencies.
+This project just works with webpack 4 (dont change to 5):
+
+```sh
+npm i -g rimraf
+npm i
+```
+
+# License
+MIT(./LICENSE)

package/angular.json

@@ -0,0 +1,132 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "ng-jsoneditor-demo": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:application",
+          "options": {
+            "outputPath": "dist/ng-jsoneditor-demo",
+            "index": "src/index.html",
+            "browser": "src/main.ts",
+            "polyfills": [
+              "zone.js"
+            ],
+            "tsConfig": "tsconfig.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.scss"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kb",
+                  "maximumError": "2mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "2kb",
+                  "maximumError": "4kb"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "ng-jsoneditor-demo:build:production"
+            },
+            "development": {
+              "buildTarget": "ng-jsoneditor-demo:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "buildTarget": "ng-jsoneditor-demo:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/architect:run-script",
+          "options": {
+            "script": "test:unit"
+          }
+        }
+      }
+    },
+    "@echo-blue/ng-jsoneditor": {
+      "projectType": "library",
+      "root": "projects/ng-jsoneditor",
+      "sourceRoot": "projects/ng-jsoneditor/src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/ng-jsoneditor/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/ng-jsoneditor/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/ng-jsoneditor/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "test": {
+          "builder": "@angular-devkit/architect:run-script",
+          "options": {
+            "script": "test:unit"
+          }
+        }
+      }
+    }
+  },
+  "schematics": {
+    "@schematics/angular:component": {
+      "prefix": "app",
+      "style": "css"
+    },
+    "@schematics/angular:directive": {
+      "prefix": "app"
+    }
+  },
+  "cli": {
+    "schematicCollections": [
+      "@angular-eslint/schematics"
+    ],
+    "analytics": false
+  }
+}

package/e2e/app.e2e-spec.ts

@@ -0,0 +1,17 @@
+import { NgPackagedPage } from './app.po';
+
+describe('ng-packaged App', () => {
+  let page: NgPackagedPage;
+
+  beforeEach(() => {
+    page = new NgPackagedPage();
+  });
+
+  it('should display message saying app works', () => {
+    page.navigateTo();
+    page.getParagraphText()
+    .then(t => {
+      expect(t).toEqual('Welcome to Angular Json Editor');
+    });
+  });
+});

package/e2e/app.po.ts

@@ -0,0 +1,11 @@
+import { browser, by, element } from 'protractor';
+
+export class NgPackagedPage {
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getParagraphText() {
+    return element(by.css('app-root h1')).getText();
+  }
+}

package/e2e/tsconfig.e2e.json

@@ -0,0 +1,12 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/e2e",
+    "module": "commonjs",
+    "target": "es5",
+    "types": [
+      "jasmine",
+      "node"
+    ]
+  }
+}

package/package.json

@@ -0,0 +1,73 @@
+{
+  "name": "@echo-blue/ng-jsoneditor",
+  "version": "18.0.5",
+  "private": false,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/echo-blue/ng-jsoneditor"
+  },
+  "author": "https://www.linkedin.com/in/mariomol",
+  "contributors": [
+    "https://github.com/echo-blue"
+  ],
+  "license": "MIT",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "build:app": "npm run build:lib && ng build",
+    "build:lib": "ng build --project ng-jsoneditor",
+    "watch": "npm run build:lib -- --watch",
+    "build:full": "npm run build:lib && npm run build:app",
+    "publishnpm": "cp README.md projects/ng-jsoneditor/README.md && npm run build:lib && cd dist/ng-jsoneditor && npm publish",
+    "unpublish": "npm deprecate -f 'ng-jsoneditor@18.0.5' 'this package has been deprecated'",
+    "test": "npm run test:unit",
+    "test:dev": "vitest",
+    "test:unit": "vitest run",
+    "lint": "ng lint",
+    "e2e": "ng e2e",
+    "ports": "lsof -i tcp:4201",
+    "reinstall": "rm package-lock.json && rm -rf node_modules && npm i",
+    "rebuildsass": "npm rebuild node-sass"
+  },
+  "dependencies": {
+    "@angular/common": "^18.2.14",
+    "@angular/compiler": "^18.2.14",
+    "@angular/core": "^18.2.14",
+    "@angular/forms": "^18.2.14",
+    "@angular/platform-browser": "^18.2.14",
+    "@angular/platform-browser-dynamic": "^18.2.14",
+    "@angular/router": "^18.2.14",
+    "jsoneditor": "*",
+    "ng-packagr": "^18.2.1",
+    "rxjs": "*",
+    "tslib": "^2.3.0",
+    "webpack": "^5.88.2",
+    "zone.js": "~0.14.2"
+  },
+  "devDependencies": {
+    "@analogjs/vite-plugin-angular": "^2.3.1",
+    "@angular-devkit/build-angular": "^18.2.21",
+    "@angular-devkit/schematics": "^18.2.21",
+    "@angular-eslint/builder": "^18.4.3",
+    "@angular-eslint/eslint-plugin": "^18.4.3",
+    "@angular-eslint/eslint-plugin-template": "^18.4.3",
+    "@angular-eslint/schematics": "^18.4.3",
+    "@angular-eslint/template-parser": "^18.4.3",
+    "@angular/cli": "^18.2.21",
+    "@angular/compiler-cli": "^18.2.14",
+    "@angular/language-service": "^18.2.14",
+    "@types/jsoneditor": "^9.9.3",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
+    "cpr": "^3.0.1",
+    "eslint": "^8.57.0",
+    "eslint-plugin-import": "latest",
+    "eslint-plugin-jsdoc": "latest",
+    "eslint-plugin-prefer-arrow": "latest",
+    "jsdom": "^29.0.0",
+    "typescript": "5.5.4",
+    "vite": "^8.0.0",
+    "vitest": "^4.1.0"
+  }
+}