myrta-ui 17.0.20 → 17.0.22

package/src/lib/components/form/json-editor/json-editor.component.ts

@@ -1,254 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  ElementRef,
-  EventEmitter,
-  forwardRef,
-  Input, OnDestroy, OnInit,
-  Output,
-  ViewChild
-} from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-import JSONEditor from 'jsoneditor';
-import { v4 as uuidv4 } from 'uuid';
-import { Field } from '../../../services';
-import { JsonEditorMode, JsonEditorOptions } from './utils/jsoneditoroptions';
-import { JsonEditorValueTypes, JsonEditorValueWithId } from './json-editor.enum';
-
-@Component({
-  selector: 'mrx-json-editor',
-  templateUrl: './json-editor.component.html',
-  styleUrl: './json-editor.component.less',
-  preserveWhitespaces: false,
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => JsonEditorComponent),
-      multi: true,
-    },
-  ],
-})
-export class JsonEditorComponent implements ControlValueAccessor, OnInit, OnDestroy {
-  private _data: Object = {};
-  private editor!: JSONEditor;
-
-  public optionsChanged = false;
-  public disabled = false;
-  public isFocused = false;
-
-  // SAVE STATE
-  public uuid: string = uuidv4()
-  @Input() public fields: Field[] = [];
-
-  @Input() options: JsonEditorOptions = new JsonEditorOptions();
-  @Input() debug = false;
-
-  @Input('data') set data(value: Object) {
-    this._data = value;
-    if (this.editor) {
-      this.editor.destroy();
-      this.ngOnInit();
-    }
-  }
-
-  @Output() public changed: EventEmitter<JsonEditorValueTypes> = new EventEmitter<JsonEditorValueTypes>();
-  @Output() public modelChange: EventEmitter<JsonEditorValueWithId> = new EventEmitter<JsonEditorValueWithId>();
-  @Output() jsonChange: EventEmitter<any> = new EventEmitter<any>();
-
-  @ViewChild('jsonEditorContainer', {static: true}) jsonEditorContainer!: ElementRef;
-
-  constructor() {
-  }
-
-  ngOnInit(): void {
-    let optionsBefore = this.options;
-    if (!this.optionsChanged && this.editor) {
-      //TODO: check if this is needed
-      optionsBefore = (this.editor as any).options;
-    }
-
-    if (!this.options.onChangeJSON && this.jsonChange) {
-      this.options.onChangeJSON = this.onChangeJSON;
-    }
-    if (!this.options.onChange && this.changed) {
-      this.options.onChange = this.onChange;
-    }
-    const optionsCopy = Object.assign({}, optionsBefore);
-
-    // expandAll is an option only supported by ang-jsoneditor and not by the the original jsoneditor.
-    delete optionsCopy.expandAll;
-    if (this.debug) {
-      console.log(optionsCopy, this._data);
-    }
-    if (!this.jsonEditorContainer.nativeElement) {
-      console.error(`Can't find the ElementRef reference for jsoneditor)`);
-    }
-
-    if (
-      optionsCopy.mode === 'text' || optionsCopy.mode === 'code' ||
-      (
-        optionsCopy.modes &&
-        (optionsCopy.modes.indexOf('text') !== -1 || optionsCopy.modes.indexOf('code') !== -1)
-      )
-    ) {
-      optionsCopy.onChangeJSON = undefined;
-    }
-    this.editor = new JSONEditor(this.jsonEditorContainer.nativeElement, optionsCopy as any, this._data);
-
-    if (this.options.expandAll) {
-      this.editor.expandAll();
-    }
-  }
-
-  ngOnDestroy(): void {
-  }
-
-  public onChangeJSON = () => {
-    if (this.editor) {
-      try {
-        this.jsonChange.emit(this.editor.get());
-      } catch (error) {
-        if (this.debug) {
-          console.log(error);
-        }
-      }
-    }
-  };
-
-  public onChange = () => {
-    if (this.editor) {
-      try {
-        const json = this.editor.get();
-        this.updateValue(json)
-      } catch (error) {
-        if (this.debug) {
-          console.log(error);
-        }
-      }
-    }
-  };
-
-  /**
-   * JSON EDITOR FUNCTIONS
-   */
-
-  public collapseAll() {
-    this.editor.collapseAll();
-  }
-
-  public expandAll() {
-    this.editor.expandAll();
-  }
-
-  public focus() {
-    this.editor.focus();
-  }
-
-  public get(): JSON {
-    return this.editor.get();
-  }
-
-  public getMode(): JsonEditorMode {
-    return this.editor.getMode() as JsonEditorMode;
-  }
-
-  public getName(): string {
-    return this.editor.getName()!;
-  }
-
-  public getText(): string {
-    return this.editor.getText();
-  }
-
-  public set(json: JSON) {
-    this.editor.set(json);
-  }
-
-  public setMode(mode: JsonEditorMode) {
-    this.editor.setMode(mode);
-  }
-
-  public setName(name: string) {
-    this.editor.setName(name);
-  }
-
-  public setSelection(start: any, end: any) {
-    this.editor.setSelection(start, end);
-  }
-
-  public getSelection(): any {
-    return this.editor.getSelection();
-  }
-
-  public getValidateSchema(): any {
-    //TODO: check if this is needed
-    return (this.editor as any).validateSchema;
-  }
-
-  public setSchema(schema: any, schemaRefs: any) {
-    this.editor.setSchema(schema, schemaRefs);
-  }
-
-  public search(query: string) {
-    //TODO: check if this is needed
-    (this.editor as any).search(query);
-  }
-
-  public setOptions(newOptions: JsonEditorOptions) {
-    if (this.editor) {
-      this.editor.destroy();
-    }
-    this.optionsChanged = true;
-    this.options = newOptions;
-    this.ngOnInit();
-  }
-
-  public update(json: JSON) {
-    this.editor.update(json);
-  }
-
-  public destroy() {
-    if (this.editor) {
-      this.editor.destroy();
-    }
-  }
-
-  public getEditor() {
-    //TODO: made it any because of the missing type definition
-    return this.editor as any;
-  }
-
-  public isValidJson() {
-    try {
-      JSON.parse(this.getText());
-      return true;
-    } catch (e) {
-      return false;
-    }
-  }
-
-  writeValue(value: any): void {
-    this.data = value;
-  }
-
-  public updateValue(insideValue: any) {
-    this.changed.emit(insideValue);
-    this.modelChange.emit({value: insideValue, id: this.uuid})
-    this.onChangeFn(insideValue);
-    this.onTouchedFn();
-  }
-
-  public registerOnChange(fn: any) {
-    this.onChangeFn = fn;
-  }
-
-  public registerOnTouched(fn: () => {}): void {
-    this.onTouchedFn = fn;
-  }
-
-  private onChangeFn = (value: any) => {
-  };
-  private onTouchedFn = () => {
-  };
-}

package/src/lib/components/form/json-editor/json-editor.enum.ts

@@ -1,6 +0,0 @@
-export type JsonEditorValueTypes = string;
-
-export interface JsonEditorValueWithId {
-  value: JsonEditorValueTypes,
-  id: string
-}

package/src/lib/components/form/json-editor/json-editor.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { JsonEditorComponent } from './json-editor.component';
-
-
-@NgModule({
-    declarations: [
-        JsonEditorComponent
-    ],
-    imports: [
-        CommonModule
-    ],
-    exports: [
-        JsonEditorComponent
-    ]
-})
-export class JsonEditorModule {
-}

package/src/lib/components/form/json-editor/utils/jsoneditoroptions.ts

@@ -1,167 +0,0 @@
-/* eslint-disable @typescript-eslint/ban-types */
-
-export type JsonEditorMode = 'tree' | 'view' | 'form' | 'code' | 'text';
-
-export interface JsonEditorTreeNode {
-  field: String,
-  value: String,
-  path: String[]
-}
-
-export interface IError {
-  path: (string | number)[];
-  message: string;
-}
-
-export class JsonEditorOptions {
-  public ace: any;
-  public ajv!: Object;
-
-
-  /**
-   *   {function} onChange  Callback method, triggered
-   on change of contents.
-   Does not pass the contents itself.
-   See also `onChangeJSON` and
-   `onChangeText`.
-   */
-  public onChange!: () => void;
-
-  /**
-   *   // {function} onChangeJSON  Callback method, triggered
-   //     in modes on change of contents,
-   //     passing the changed contents
-   //     as JSON.
-   //     Only applicable for modes
-   //     'tree', 'view', and 'form'.
-   */
-  public onChangeJSON?: () => void;
-
-
-  public onNodeName!: () => void;
-  public onCreateMenu!: (items: Array<any>, node: object) => Array<any>;
-  public onColorPicker!: () => void;
-
-  /**
-   // {function} onChangeText  Callback method, triggered
-   //     in modes on change of contents,
-   //     passing the changed contents
-   //     as stringified JSON.
-   */
-  public onChangeText!: (jsonstr: string) => void;
-
-
-  /**
-   *   {function} onSelectionChange Callback method,
-   triggered on node selection change
-   Only applicable for modes
-   'tree', 'view', and 'form'
-   */
-  public onSelectionChange!: () => void;
-
-  /**
-   *     {function} onTextSelectionChange Callback method,
-   triggered on text selection change
-   Only applicable for modes
-   */
-  public onTextSelectionChange!: () => void;
-
-
-  /**
-   *   // {function} onEvent Callback method, triggered
-   // when an event occurs in
-   // a JSON field or value.
-   // Only applicable for
-   // modes 'form', 'tree' and
-   // 'view'
-   */
-  public onEvent!: () => void;
-
-  /**
-   * // *   {function} onFocus  Callback method, triggered
-   //  when the editor comes into focus,
-   //  passing an object {type, target},
-   //  Applicable for all modes
-   */
-  public onFocus!: () => void;
-
-  // *   {function} onBlur   Callback method, triggered
-  //  when the editor goes out of focus,
-  //  passing an object {type, target},
-  //  Applicable for all modes
-  public onBlur!: () => void;
-
-  /**
-   *  // *   {function} onClassName Callback method, triggered
-   // when a Node DOM is rendered. Function returns
-   // a css class name to be set on a node.
-   // Only applicable for
-   // modes 'form', 'tree' and
-   // 'view'
-   */
-  public onClassName!: (node: JsonEditorTreeNode) => void;
-
-  public onEditable!: (node: JsonEditorTreeNode | {}) => boolean | { field: boolean, value: boolean };
-
-  /**
-   *   {function} onError   Callback method, triggered
-   when an error occurs
-   */
-  public onError!: (error: any) => void;
-  public onModeChange!: (newMode: JsonEditorMode, oldMode: JsonEditorMode) => void;
-  public onValidate!: (json: Object) => IError[];
-  public onValidationError!: (errors: object[]) => void;
-
-  public enableSort: boolean;
-  public enableTransform: boolean;
-  public escapeUnicode: boolean;
-  public expandAll?: boolean;
-  public sortObjectKeys: boolean;
-  public history: boolean;
-  public mode: JsonEditorMode;
-  public modes!: JsonEditorMode[];
-  public name!: String;
-  public schema!: Object;
-  public search: boolean;
-  public indentation: Number;
-  public templates!: Object;
-  public theme!: Number;
-  public language!: String;
-  public languages!: Object;
-
-  /**
-   * Adds main menu bar - Contains format, sort, transform, search etc. functionality. True
-   * by default. Applicable in all types of mode.
-   */
-  public mainMenuBar!: boolean;
-
-  /**
-   * Adds navigation bar to the menu - the navigation bar visualize the current position on
-   * the tree structure as well as allows breadcrumbs navigation.
-   * True by default.
-   * Only applicable when mode is 'tree', 'form' or 'view'.
-   */
-  public navigationBar!: boolean;
-
-  /**
-   * Adds status bar to the bottom of the editor - the status bar shows the cursor position
-   * and a count of the selected characters.
-   * True by default.
-   * Only applicable when mode is 'code' or 'text'.
-   */
-  public statusBar!: boolean;
-
-  constructor() {
-    this.enableSort = true;
-    this.enableTransform = true;
-    this.escapeUnicode = false;
-    this.expandAll = false;
-    this.sortObjectKeys = false;
-    this.history = true;
-    this.mode = 'tree';
-    this.search = true;
-    this.indentation = 2;
-    this.mainMenuBar = true
-    this.navigationBar = true
-  }
-}

package/src/lib/components/form/radio/assets/radio-error.less

@@ -1,9 +0,0 @@
-.mrx-radio.mrx-radio {
-  &.mrx-input-error {
-    &.mrx-radio-default {
-      .mrx-radio__mark {
-        border-color: var(--system-bg-controls-negative-default, #B83B15);
-      }
-    }
-  }
-}

package/src/lib/components/form/radio/assets/radio-input.less

@@ -1,10 +0,0 @@
-.mrx-radio {
-  input[type=radio] {
-    position: absolute;
-    z-index: -1;
-    opacity: 0;
-    width: 0;
-    height: 0;
-    margin: 0;
-  }
-}

package/src/lib/components/form/radio/assets/radio-label.less

@@ -1,26 +0,0 @@
-.mrx-radio.mrx-radio {
-  .mrx-radio__label {
-    font-family: var(--body-md-font-family);
-    font-size: var(--body-md-font-size);
-    font-weight: normal;
-    line-height: var(--body-md-line-height);
-  }
-
-  .mrx-radio__label--bold {
-    font-family: var(--body-md-font-family);
-    font-size: var(--body-md-font-size);
-    font-weight: 700;
-    line-height: var(--body-md-line-height);
-  }
-
-  .required-active {
-    font-family: var(--body-md-bold-font-family);
-    font-size: var(--body-md-bold-font-size);
-    font-weight: var(--body-md-bold-font-weight);
-    line-height: var(--body-md-bold-line-height);
-    color: var(--system-icon-negative, #C65836);
-    margin-left: var(--spacing-1);
-    position: relative;
-    display: inline-block;
-  }
-}

package/src/lib/components/form/radio/assets/radio-mark.less

@@ -1,62 +0,0 @@
-.mrx-radio.mrx-radio {
-  &.mrx-radio-default {
-    .mrx-radio__mark {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      height: var(--sizing-4);
-      width: var(--sizing-4);
-      min-width: var(--sizing-4);
-      border: var(--border-width-checkbox) solid var(--neutral-bg-stroke-default, #DBDFE5);
-      border-radius: 50%;
-      transition: border 0.2s;
-      position: relative;
-
-      .mrx-radio__mark__inner {
-        display: block;
-        width: 6px;
-        height: 6px;
-        border-radius: 50%;
-        background: var(--brand-bg-primary-default, #2A6AB8);
-        opacity: 0;
-        transition: opacity .2s;
-      }
-    }
-
-    &:hover {
-      .mrx-radio__mark {
-        border-color: var(--neutral-bg-stroke-hover, #0F54AA);
-      }
-    }
-
-    input[type="radio"] {
-      &:checked {
-        & + .mrx-radio__mark {
-          border-color: var(--brand-bg-primary-default, #2A6AB8);
-
-          .mrx-radio__mark__inner {
-            opacity: 1;
-          }
-        }
-      }
-
-      &:not(:checked){
-        &:disabled{
-          & + .mrx-radio__mark {
-            background: var(--neutral-control-bg-accent-disabled, #71767E);
-          }
-        }
-      }
-
-      &:disabled {
-        & + .mrx-radio__mark {
-          border-color: var(--neutral-control-bg-accent-disabled, #71767E);         
-
-          .mrx-radio__mark__inner {
-            background: var(--neutral-control-bg-accent-disabled, #71767E);
-          }
-        }
-      }
-    }
-  }
-}

package/src/lib/components/form/radio/assets/radio-wrapper.less

@@ -1,5 +0,0 @@
-.mrx-radio__wrapper.mrx-radio__wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-}

package/src/lib/components/form/radio/assets/radio.less

@@ -1,11 +0,0 @@
-.mrx-radio.mrx-radio {
-  display: flex !important;
-  align-items: center;
-  min-height: auto !important;
-  margin-bottom: 0 !important;
-  overflow: visible;
-  background-color: transparent;
-  cursor: pointer;
-  box-sizing: border-box;
-  position: relative;
-}

package/src/lib/components/form/radio/radio.component.html

@@ -1,25 +0,0 @@
-<div class="mrx-radio__wrapper">
-  <label
-    class="mrx-radio"
-    [class]="getClasses"
-    [class.mrx-input-error]="invalid"
-  >
-    <input
-      type="radio"
-      [name]="name"
-      [value]="value"
-      [(ngModel)]="modelValue"
-      [disabled]="disabled || readonly"
-      [readonly]="readonly"
-      (change)="valueChanged(value)"
-    />
-
-    <span class="mrx-radio__mark"><span class="mrx-radio__mark__inner"></span></span>
-
-    <span class="ml-1" [class]="boldLabel ? 'mrx-radio__label--bold' : 'mrx-radio__label'">
-        {{label}}
-      <ng-content></ng-content>
-        <span *ngIf="required && !disabled" class="required-active">*</span>
-    </span>
-  </label>
-</div>

package/src/lib/components/form/radio/radio.component.less

@@ -1,6 +0,0 @@
-@import "assets/radio";
-@import "assets/radio-input";
-@import "assets/radio-mark";
-@import "assets/radio-error";
-@import "assets/radio-label";
-@import "assets/radio-wrapper";

package/src/lib/components/form/radio/radio.component.ts

@@ -1,74 +0,0 @@
-import { ChangeDetectionStrategy, Component, forwardRef, Input } from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
-import { RadioTypes, RadioTypesEnum } from "./radio.enum";
-
-export type RadioValueTypes = false;
-
-@Component({
-  selector: 'mrx-radio',
-  templateUrl: './radio.component.html',
-  styleUrls: ['./radio.component.less'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => RadioComponent),
-      multi: true,
-    },
-  ],
-})
-export class RadioComponent implements ControlValueAccessor {
-  public modelValue: any;
-
-  @Input() public required = false;
-  @Input() public type: RadioTypes = 'default';
-  @Input() public name: string = '';
-  @Input() public boldLabel = true;
-  @Input() public disabled = false;
-  @Input() public readonly = false;
-  @Input() public placeholder = '';
-  @Input() public label = '';
-  @Input() public customClasses = '';
-
-  @Input() public invalid = false;
-
-  @Input('value') _value: any;
-
-  get value() {
-    return this._value;
-  }
-
-  set value(value) {
-
-    if (!!value) {
-      this._value = value;
-      this.onChange(value);
-      this.onTouched();
-    }
-  }
-
-  public get getClasses(): string {
-    return `${RadioTypesEnum[this.type]} ${this.customClasses}`;
-  }
-
-  private onChange = (value: any) => {
-  };
-  private onTouched = () => {
-  };
-
-  registerOnChange(fn: () => {}) {
-    this.onChange = fn;
-  }
-
-  registerOnTouched(fn: () => {}) {
-    this.onTouched = fn;
-  }
-
-  writeValue(outsideValue: any) {
-    this.modelValue = outsideValue;
-  }
-
-  valueChanged(event: any) {
-    this.onChange(this.modelValue);
-  }
-}

package/src/lib/components/form/radio/radio.enum.ts

@@ -1,5 +0,0 @@
-export enum RadioTypesEnum {
-  'default' = 'mrx-radio-default',
-}
-// | 'indeterminate'
-export type RadioTypes = 'default'