myrta-ui 17.0.20 → 17.0.22

package/src/lib/components/form/checkbox-group/helpers/inner-list-to-list.helper.ts

@@ -1,15 +0,0 @@
-import { CheckboxGroupInnerItem, CheckboxGroupItem } from '../models/checkbox-group.model';
-
-export const innerListToList = (innerList: CheckboxGroupInnerItem[]): CheckboxGroupItem[] => {
-  const getModifiedList = (items: CheckboxGroupInnerItem[]): CheckboxGroupItem[] => {
-    return items.map((item, idx, array) => {
-      return {
-        id: item.id,
-        text: item.text,
-        items: item.items ? getModifiedList(item.items) : []
-      }
-    })
-  }
-
-  return getModifiedList(innerList)
-}

package/src/lib/components/form/checkbox-group/models/checkbox-group.model.ts

@@ -1,32 +0,0 @@
-export interface CheckboxGroupItem {
-  id: string | number,
-  text: string,
-  items?: CheckboxGroupItem[],
-}
-
-export interface CheckboxGroupInnerItem {
-  id: string | number,
-  text: string,
-  parentId: string | number | null,
-  value: boolean | null,
-  type: 'single' | 'array',
-  items: CheckboxGroupInnerItem[],
-}
-
-export type CheckboxIndeterminateState = boolean | null
-
-export type CheckboxGroupSearchValue = string
-
-export type AnimateCheckboxGroupState = 'open' | 'close' | 'sustain'
-
-export interface CheckboxGroupValueWithId {
-  value: CheckboxGroupItem[],
-  full: CheckboxGroupItem[],
-  id: string
-}
-
-export interface CheckboxGroupValueInnerWithId {
-  value: CheckboxGroupInnerItem[],
-  full: CheckboxGroupInnerItem[],
-  id: string
-}

package/src/lib/components/form/document-editor/components/document-editor-preview-modal/document-editor-preview-modal.component.html

@@ -1,20 +0,0 @@
-<mrx-modal
-  [title]="title"
-  [expandable]="true"
-  size="extra-large"
-  color="info"
-  [enableFooter]="false"
-  (close)="close()"
-  (ok)="ok()"
->
-  <div>
-    <div>
-      <iframe
-        #iframeTemplate
-        frameborder="0"
-        class="w-100"
-        [srcdoc]="content"
-      ></iframe>
-    </div>
-  </div>
-</mrx-modal>

package/src/lib/components/form/document-editor/components/document-editor-preview-modal/document-editor-preview-modal.component.ts

@@ -1,69 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectionStrategy,
-  Component,
-  ElementRef,
-  Inject, Renderer2,
-  ViewChild
-} from '@angular/core';
-import { ModalServiceComponent } from '../../../../../services/modal-service/helpers/modal.component';
-import { ModalRef } from '../../../../../services/modal-service/helpers/modal-ref';
-import { MODAL_DATA } from '../../../../../services/modal-service/helpers/modal-tokens';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
-
-export interface DocumentEditorPreviewModalParams {
-  title: string;
-  content: string;
-}
-
-export interface DocumentEditorPreviewModalResult {
-  result: boolean;
-}
-
-@Component({
-  selector: 'mrx-document-editor-preview-modal',
-  templateUrl: './document-editor-preview-modal.component.html',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class DocumentEditorPreviewModalComponent extends ModalServiceComponent<DocumentEditorPreviewModalParams, DocumentEditorPreviewModalResult> implements AfterViewInit {
-  public title: string | undefined;
-  public content: SafeHtml = '';
-
-  @ViewChild('iframeTemplate') iframeTemplate!: ElementRef;
-
-  constructor(
-    private dialogRef: ModalRef<DocumentEditorPreviewModalResult>,
-    @Inject(MODAL_DATA) data: DocumentEditorPreviewModalParams,
-    public sanitizer: DomSanitizer,
-    private renderer: Renderer2
-  ) {
-    super();
-    this.title = data.title;
-    this.content = this.getSanitizeValue(data.content);
-    this.result = {result: false};
-  }
-
-  ngAfterViewInit(): void {
-    this.renderer.listen(this.iframeTemplate.nativeElement, 'load', () => {
-      this.renderer.setStyle(
-        this.iframeTemplate.nativeElement,
-        'height',
-        this.iframeTemplate.nativeElement.contentWindow.document.documentElement.scrollHeight + 'px'
-      );
-    })
-  }
-
-  getSanitizeValue(value: string) {
-    return this.sanitizer.bypassSecurityTrustHtml(value);
-  }
-
-  public ok() {
-    this.result = {result: true};
-    this.dialogRef.close();
-  }
-
-  public close() {
-    this.result = {result: false};
-    this.dialogRef.close();
-  }
-}

package/src/lib/components/form/document-editor/document-editor.component.html

@@ -1,41 +0,0 @@
-<div class="mrx-document-editor">
-  <div class="mrx-document-editor__shortcode-buttons mb-2">
-    <ng-container *ngFor="let shortCode of sliceShortCodeButtons">
-      <mrx-button
-        size="small"
-        type="secondary"
-        (mrxClick)="insertShortCode(shortCode)"
-      >{{ shortCode.viewName }}</mrx-button>
-    </ng-container>
-    <mrx-button
-      *ngIf="isSliced"
-      size="small"
-      (mrxClick)="showAllShortCodes()"
-    >Еще</mrx-button>
-  </div>
-
-  <div class="mrx-document-editor__editor mb-2">
-    <mrx-editor
-      #editor
-      [ngModel]="transformedValue"
-      [toolbar]="toolbar"
-      [customClasses]="customClasses"
-      [placeholder]="placeholder"
-      [disabled]="disabled"
-      [readonly]="readonly"
-      [iframe]="true"
-      [editHTMLDocumentMode]="editHTMLDocumentMode"
-      (ngModelChange)="updateValue($event)"
-    ></mrx-editor>
-  </div>
-
-  <div class="mrx-document-editor__preview">
-    <mrx-button
-      size="medium"
-      type="secondary"
-      iconClass="icon-view"
-      [disabled]="!transformedValue"
-      (mrxClick)="openPreviewModal()"
-    >Предпросмотр</mrx-button>
-  </div>
-</div>

package/src/lib/components/form/document-editor/document-editor.component.less

@@ -1,7 +0,0 @@
-.mrx-document-editor {
-  &__shortcode-buttons {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--sizing-2);
-  }
-}

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

@@ -1,109 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  EventEmitter,
-  forwardRef,
-  Input,
-  Output,
-  ViewChild
-} from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { ShortCodeI } from './models/document-editor-short-codes.enum';
-import { EditorComponent } from '../editor/editor.component';
-import {
-  DocumentEditorPreviewModalComponent
-} from './components/document-editor-preview-modal/document-editor-preview-modal.component';
-import {
-  transformSysNameToViewName,
-  transformViewNameToPreviewName,
-  transformViewNameToSysName
-} from './helpers/transform-sysname';
-import { ToolbarConfig } from '../editor/models/toolbar.model';
-import { ModalService } from '../../../services/modal-service/modal-service.service';
-
-@Component({
-  selector: 'mrx-document-editor',
-  templateUrl: './document-editor.component.html',
-  styleUrls: ['./document-editor.component.less'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => DocumentEditorComponent),
-      multi: true,
-    },
-  ]
-})
-export class DocumentEditorComponent implements ControlValueAccessor {
-  public value = ''
-  public isHiddenShortCodes = true
-
-  @Input() public shortCodes: ShortCodeI[] = []
-  @Input() public shortCodeViewCount = 0
-  @Input() public editHTMLDocumentMode = true;
-  @Input() public toolbar!: ToolbarConfig
-  @Input() public customClasses = '';
-  @Input() public placeholder = '';
-  @Input() public disabled = false;
-  @Input() public readonly = false;
-
-  @ViewChild('editor') editor!: EditorComponent;
-
-  @Output() public changed: EventEmitter<string> = new EventEmitter<string>();
-
-  constructor(
-    private modalService: ModalService
-  ) { }
-
-  public get transformedValue(): string {
-    return transformSysNameToViewName(this.value, this.shortCodes);
-  }
-
-  public get sliceShortCodeButtons(): ShortCodeI[] {
-    return this.isSliced ? this.shortCodes.slice(0, this.shortCodeViewCount) : this.shortCodes
-  }
-
-  public get isSliced(): boolean {
-    return this.isHiddenShortCodes && !!this.shortCodeViewCount && (this.shortCodeViewCount < this.shortCodes.length)
-  }
-
-  public insertShortCode(shortCode: ShortCodeI) {
-    this.editor.insertPositionText(`[${shortCode.viewName}]`)
-  }
-
-  public openPreviewModal() {
-    this.modalService.open(DocumentEditorPreviewModalComponent, {
-      title: 'ПРЕДПРОСМОТР',
-      content: transformViewNameToPreviewName(this.value, this.shortCodes)
-    })
-  }
-
-  private onChange = (value: any) => {
-  };
-
-  private onTouched = () => {
-  };
-
-  public registerOnChange(fn: any) {
-    this.onChange = fn;
-  }
-
-  public registerOnTouched(fn: () => {}): void {
-    this.onTouched = fn;
-  }
-
-  public writeValue(outsideValue: any) {
-    this.value = transformSysNameToViewName(outsideValue, this.shortCodes);
-  }
-
-  public updateValue(insideValue: string) {
-    this.value = insideValue;
-    this.changed.emit(transformViewNameToSysName(insideValue, this.shortCodes))
-    this.onChange(transformViewNameToSysName(insideValue, this.shortCodes));
-    this.onTouched();
-  }
-
-  public showAllShortCodes() {
-    this.isHiddenShortCodes = false
-  }
-}

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

@@ -1,29 +0,0 @@
-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { DocumentEditorComponent } from './document-editor.component';
-import { EditorModule } from '../editor/editor.module';
-import { ButtonModule } from '../../button/button.module';
-import { FormsModule } from '@angular/forms';
-import { ModalModule } from '../../modal/modal.module';
-import {
-  DocumentEditorPreviewModalComponent
-} from './components/document-editor-preview-modal/document-editor-preview-modal.component';
-
-
-@NgModule({
-  declarations: [
-    DocumentEditorComponent,
-    DocumentEditorPreviewModalComponent
-  ],
-  imports: [
-    CommonModule,
-    FormsModule,
-    EditorModule,
-    ButtonModule,
-    ModalModule
-  ],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA],
-  exports: [DocumentEditorComponent]
-})
-export class DocumentEditorModule {
-}

package/src/lib/components/form/document-editor/helpers/transform-sysname.ts

@@ -1,57 +0,0 @@
-import { ShortCodeI } from '../models/document-editor-short-codes.enum';
-
-export const transformSysNameToViewName = (text: string, shortcodes: ShortCodeI[]) => {
-  let tempText = text || ''
-
-  shortcodes.forEach((shortcode: ShortCodeI) => {
-    const reg1 = '[[^\\]]'
-    const reg2 = '[\\]$]'
-    const regexp = new RegExp(reg1 + shortcode.systemName + reg2, 'g')
-
-    tempText = tempText.replace(regexp, `[${shortcode.viewName}]`);
-  })
-
-  return tempText
-}
-
-export const transformViewNameToSysName = (text: string, shortcodes: ShortCodeI[]) => {
-  let tempText = text || ''
-
-  shortcodes.forEach((shortcode: ShortCodeI) => {
-    const reg1 = '[[^\\]]'
-    const reg2 = '[\\]$]'
-    const regexp = new RegExp(reg1 + shortcode.viewName + reg2, 'g')
-
-    tempText = tempText.replace(regexp, `[${shortcode.systemName}]`);
-  })
-
-  return tempText
-}
-
-export const transformSysNameToPreviewName = (text: string, shortcodes: ShortCodeI[]) => {
-  let tempText = text || ''
-
-  shortcodes.forEach((shortcode: ShortCodeI) => {
-    const reg1 = '[[^\\]]'
-    const reg2 = '[\\]$]'
-    const regexp = new RegExp(reg1 + shortcode.systemName + reg2, 'g')
-
-    tempText = tempText.replace(regexp, shortcode.previewValue);
-  })
-
-  return tempText
-}
-
-export const transformViewNameToPreviewName = (text: string, shortcodes: ShortCodeI[]) => {
-  let tempText = text || ''
-
-  shortcodes.forEach((shortcode: ShortCodeI) => {
-    const reg1 = '[[^\\]]'
-    const reg2 = '[\\]$]'
-    const regexp = new RegExp(reg1 + shortcode.viewName + reg2, 'g')
-
-    tempText = tempText.replace(regexp, shortcode.previewValue);
-  })
-
-  return tempText
-}

package/src/lib/components/form/document-editor/models/document-editor-short-codes.enum.ts

@@ -1,6 +0,0 @@
-export interface ShortCodeI {
-  order: number,
-  systemName: string,
-  viewName: string,
-  previewValue: string
-}

package/src/lib/components/form/editor/assets/editor-borders.less

@@ -1,29 +0,0 @@
-.mrx-editor {
-  .jodit-container {
-    transition: border .2s;
-    border: var(--border-width-default) solid var(--neutral-bg-stroke-default);
-
-    &:not(.jodit_inline), .jodit-workplace {
-      border-radius: 4px;
-    }
-
-    .jodit-toolbar__box:not(:empty) {
-      transition: border .2s;
-      border-bottom: var(--border-width-default) solid var(--neutral-bg-stroke-default);
-    }
-
-    &:hover {
-      border: var(--border-width-default) solid var(--neutral-bg-stroke-hover);
-
-      .jodit-toolbar__box:not(:empty) {
-        border-bottom: var(--border-width-default) solid var(--neutral-bg-stroke-hover);
-      }
-    }
-  }
-
-  &.mrx-input-focused {
-    .jodit-container {
-      outline: var(--neutral-bg-island-default) solid var(--border-width-focused);
-    }
-  }
-}

package/src/lib/components/form/editor/assets/editor-clear-elements.less

@@ -1,5 +0,0 @@
-.mrx-editor {
-  .jodit-add-new-line {
-    display: none;
-  }
-}

package/src/lib/components/form/editor/assets/editor-clear-out-elements.less

@@ -1,46 +0,0 @@
-.jodit.jodit-popup-container {
-  .jodit-popup {
-    .jodit-popup__content {
-      &:not(:empty) {
-        background-color: #fff;
-        padding: 4px;
-      }
-    }
-
-    .jodit-ui-group {
-      flex-wrap: wrap;
-      gap: var(--sizing-1);
-    }
-
-    .jodit-toolbar-button {
-      &.jodit-toolbar-button_with-trigger_true {
-        &:hover:not([disabled]) {
-          border-color: transparent;
-          box-shadow: 0px 1px 4px rgba(58, 58, 58, 0.3);
-        }
-      }
-      .jodit-toolbar-button__button {
-        &:hover:not([disabled]) {
-          background-color: var(--brand-bg-tertiary-hover);
-        }
-      }
-      .jodit-toolbar-button__trigger {
-        &:hover:not([disabled]) {
-          background-color: var(--brand-bg-tertiary-hover);
-        }
-      }
-    }
-  }
-  .jodit-toolbar-button_nullable {
-    display: none !important;
-  }
-
-  .jodit-form__table-creator-box {
-    .jodit-form__container {
-      span.jodit_hovered {
-        background-color: var(--system-diagram-diagram-2);
-        border-color: var(--system-diagram-diagram-2);
-      }
-    }
-  }
-}

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

@@ -1,33 +0,0 @@
-.mrx-editor {
-  &.mrx-input-error, &.mrx-input-checked-error {
-    .jodit-container {
-      border: var(--border-width-default) solid var(--system-bg-controls-negative-default) !important;
-
-      .jodit-toolbar__box:not(:empty) {
-        border-bottom: var(--border-width-default) solid var(--system-bg-controls-negative-default) !important;
-      }
-    }
-  }
-
-  &.mrx-input-success, &.mrx-input-checked-success {
-    .jodit-container {
-      border: var(--border-width-default) solid var(--system-bg-controls-positive-default) !important;
-
-      .jodit-toolbar__box:not(:empty) {
-        border-bottom: var(--border-width-default) solid var(--system-bg-controls-positive-default) !important;
-      }
-    }
-  }
-
-  &.mrx-input-checked-error {
-    .jodit-workplace {
-      background-color: var(--system-bg-negative-secondary) !important;
-    }
-  }
-
-  &.mrx-input-checked-success {
-    .jodit-workplace {
-      background-color: var(--system-bg-positive-secondary) !important;
-    }
-  }
-}

package/src/lib/components/form/editor/assets/editor-popups.less

@@ -1,11 +0,0 @@
-.jodit.jodit-popup-container {
-  .jodit-popup__content {
-    .jodit-ui-checkbox__wrapper {
-      .jodit-ui-checkbox__input {
-        -webkit-appearance: checkbox !important;
-        position: static !important;
-        width: auto !important;
-      }
-    }
-  }
-}

package/src/lib/components/form/editor/assets/editor-table.less

@@ -1,5 +0,0 @@
-.mrx-editor {
-
-}
-
-

package/src/lib/components/form/editor/assets/editor-toolbar.less

@@ -1,53 +0,0 @@
-.mrx-editor {
-  .jodit-toolbar__box {
-    &:not(:empty) {
-      background-color: #fff;
-      padding: 4px;
-    }
-
-    .jodit-toolbar-collection_size_middle.jodit-toolbar-collection_mode_horizontal, .jodit-toolbar-collection_size_middle.jodit-toolbar-editor-collection_mode_horizontal, .jodit-toolbar-editor-collection_size_middle.jodit-toolbar-collection_mode_horizontal, .jodit-toolbar-editor-collection_size_middle.jodit-toolbar-editor-collection_mode_horizontal {
-      background-image: none;
-    }
-    .jodit-toolbar-editor-collection:after {
-      display: none;
-    }
-  }
-
-  .jodit-ui-group {
-    flex-wrap: wrap;
-    gap: var(--sizing-1);
-  }
-
-  .jodit-toolbar-button {
-    height: 28px;
-    margin: 0;
-    border: none;
-
-    &.jodit-toolbar-button_with-trigger_true {
-      &:hover:not([disabled]) {
-        border-color: transparent;
-        box-shadow: 0px 1px 4px rgba(58, 58, 58, 0.3);
-      }
-    }
-    .jodit-toolbar-button__button {
-      height: 28px;
-
-      &:hover:not([disabled]) {
-        background-color: var(--brand-bg-tertiary-hover);
-      }
-
-      &[aria-pressed=true]:not([disabled]) {
-        background-color: var(--brand-bg-tertiary-hover);
-      }
-    }
-    .jodit-toolbar-button__trigger {
-      &:hover:not([disabled]) {
-        background-color: var(--brand-bg-tertiary-hover);
-      }
-    }
-  }
-
-  .jodit-ui-separator {
-    border-color: var(--neutral-bg-stroke-default);
-  }
-}

package/src/lib/components/form/editor/assets/editor-wysiwyg.less

@@ -1,21 +0,0 @@
-.mrx-editor {
-  position: relative;
-
-  .jodit-container {
-    .jodit-wysiwyg {
-      padding: var(--spacing-3) var(--spacing-4);
-    }
-
-    &:not(.jodit_inline) {
-      &.jodit_disabled {
-        .jodit-toolbar__box {
-          background-color: var(--neutral-bg-island-default);
-        }
-        .jodit-workplace {
-          opacity: 1;
-          background-color: var(--neutral-bg-disabled);
-        }
-      }
-    }
-  }
-}

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

@@ -1,10 +0,0 @@
-.jodit-toolbar__box {
-  button {
-    margin-bottom: 0 !important;
-  }
-}
-.jodit-source * {
-  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace !important;
-  font-size: 12px;
-  font-style: normal;
-}