@rangertechnologies/ngnxt
Version:
This library was used for creating dymanic UI based on the input JSON/data
486 lines (485 loc) • 17 kB
TypeScript
import { ElementRef, EventEmitter, OnInit, ChangeDetectorRef } from '@angular/core';
import { CropperPosition, Dimensions, ImageTransform } from '../../../components/image-cropper/interfaces';
import { PipeTransform } from '@angular/core';
import { FormBuilderService } from '../../../services/form-builder/form-builder.service';
import { TemplateService } from '../../../services/template/template.service';
import { TranslationService } from '../../../services/translation/translation.service';
import { DataService } from '../../../services/data/data.service';
import * as i0 from "@angular/core";
export declare class GetValueByPathPipe implements PipeTransform {
transform(obj: any, path: string, defaultValue?: any): any;
static ɵfac: i0.ɵɵFactoryDeclaration<GetValueByPathPipe, never>;
static ɵpipe: i0.ɵɵPipeDeclaration<GetValueByPathPipe, "getValueByPath", true>;
}
export declare class PropertiesComponent implements OnInit {
private formBuilderService;
private templateService;
private translationService;
private cdr;
private dataService;
templateSelected: boolean;
set selectedElementType(value: string);
formButtonHandler: EventEmitter<any>;
templateSaveHandler: EventEmitter<any>;
dropdown: ElementRef;
selectedElementTypeSig: import("@angular/core").WritableSignal<string>;
selectedElement: import("@angular/core").WritableSignal<any>;
selectedElementIndex: import("@angular/core").WritableSignal<number>;
headerSelect: import("@angular/core").WritableSignal<boolean>;
book: import("@angular/core").WritableSignal<any>;
bookId: import("@angular/core").WritableSignal<any>;
activeTab: import("@angular/core").WritableSignal<string>;
selectColumn: import("@angular/core").WritableSignal<any>;
transform: import("@angular/core").WritableSignal<ImageTransform>;
canvasRotation: import("@angular/core").WritableSignal<number>;
cropper: import("@angular/core").WritableSignal<CropperPosition>;
loading: import("@angular/core").WritableSignal<boolean>;
isLinkDropdownOpen: import("@angular/core").WritableSignal<boolean>;
errorMessage: import("@angular/core").WritableSignal<string>;
bookSubtext: import("@angular/core").WritableSignal<{
endpoint: string;
variable: any;
field: string[];
defaultField: string;
}>;
isStyleExpanded: import("@angular/core").WritableSignal<boolean>;
cropperMaxHeight: number;
cropperMaxWidth: number;
cropperMinHeight: number;
cropperMinWidth: number;
cropperStaticWidth: number;
cropperStaticHeight: number;
aspectRatio: number;
roundCropper: boolean;
isExpanded: Boolean;
alignImage: "center";
elementType: string[];
private _cachedProperties;
private _lastSelectedElement;
private _lastSelectedColumn;
fieldAsString: import("@angular/core").Signal<string>;
filteredColumns: import("@angular/core").Signal<any[]>;
elementProperties: import("@angular/core").Signal<{
Header: {
elementProps: {
label: string;
placeholder: string;
type: string;
key: string;
isTranslate: boolean;
labelPath: string;
}[];
};
currency: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Line: {
elementProps: ({
label: string;
type: string;
key: string;
labelPath: string;
placeholder?: undefined;
options?: undefined;
} | {
label: string;
type: string;
key: string;
placeholder: string;
labelPath: string;
options?: undefined;
} | {
label: string;
type: string;
key: string;
labelPath: string;
options: {
label: string;
value: string;
labelPath: string;
}[];
placeholder?: undefined;
})[];
fieldProps: any[];
};
Space: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Table: {
elementProps: ({
label: string;
placeholder: string;
type: string;
key: string;
labelPath: string;
isTranslate?: undefined;
} | {
label: string;
placeholder: string;
type: string;
key: string;
isTranslate: boolean;
labelPath: string;
} | {
label: string;
type: string;
key: string;
labelPath: string;
placeholder?: undefined;
isTranslate?: undefined;
})[];
fieldProps: ({
label: string;
type: string;
key: string;
labelPath: string;
placeholder?: undefined;
isTranslate?: undefined;
subQuestion?: undefined;
} | {
label: string;
placeholder: string;
type: string;
key: string;
isTranslate: boolean;
labelPath: string;
subQuestion?: undefined;
} | {
label: string;
placeholder: string;
type: string;
key: string;
labelPath: string;
isTranslate?: undefined;
subQuestion?: undefined;
} | {
label: string;
placeholder: string;
type: string;
key: string;
labelPath: string;
subQuestion: {
label: string;
placeholder: string;
type: string;
key: string;
labelPath: string;
}[];
isTranslate?: undefined;
})[];
appearance: ({
label: string;
type: string;
key: string;
placeholder: string;
required: boolean;
labelPath: string;
options: {
label: string;
value: string;
labelPath: string;
}[];
defaultValue?: undefined;
} | {
label: string;
type: string;
key: string;
defaultValue: string;
required: boolean;
labelPath: string;
placeholder?: undefined;
options?: undefined;
} | {
label: string;
type: string;
key: string;
defaultValue: string;
required: boolean;
labelPath: string;
options: {
label: string;
value: string;
labelPath: string;
}[];
placeholder?: undefined;
} | {
label: string;
type: string;
key: string;
defaultValue: boolean;
labelPath: string;
placeholder?: undefined;
required?: undefined;
options?: undefined;
})[];
};
TableColumn: {
elementProps: ({
label: string;
placeholder: string;
type: string;
targetArray: string;
targetArrayKey: string;
key: string;
required: boolean;
labelPath: string;
options: {
label: string;
value: string;
labelPath: string;
}[];
isTranslate?: undefined;
subQuestion?: undefined;
} | {
label: string;
placeholder: string;
type: string;
targetArray: string;
targetArrayKey: string;
key: string;
isTranslate: boolean;
labelPath: string;
required?: undefined;
options?: undefined;
subQuestion?: undefined;
} | {
label: string;
placeholder: string;
type: string;
targetArray: string;
targetArrayKey: string;
key: string;
labelPath: string;
required?: undefined;
options?: undefined;
isTranslate?: undefined;
subQuestion?: undefined;
} | {
label: string;
type: string;
targetArray: string;
targetArrayKey: string;
key: string;
labelPath: string;
placeholder?: undefined;
required?: undefined;
options?: undefined;
isTranslate?: undefined;
subQuestion?: undefined;
} | {
label: string;
placeholder: string;
type: string;
targetArray: string;
targetArrayKey: string;
key: string;
labelPath: string;
subQuestion: {
label: string;
placeholder: string;
type: string;
targetArray: string;
targetArrayKey: string;
key: string;
labelPath: string;
}[];
required?: undefined;
options?: undefined;
isTranslate?: undefined;
})[];
fieldProps: any[];
appearance: any[];
};
Checkbox: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Dropdown: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
MultiSelect: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Radio: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Text: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Calendar: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Date: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Time: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
DateTime: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
month: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Email: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Book: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
List: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
TextArea: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
RichTextArea: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Number: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Image: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Label: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Boolean: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
File: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Icon: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
Button: {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
}>;
formBuilderLanguageCode: any;
copied: boolean;
constructor(formBuilderService: FormBuilderService, templateService: TemplateService, translationService: TranslationService, cdr: ChangeDetectorRef, dataService: DataService);
ngOnInit(): void;
private createElementProperties;
createElementConfig(config?: {
customElementProps?: any[];
customFieldProps?: any[];
customAppearanceProps?: any[];
}): {
elementProps: any[];
fieldProps: any[];
appearance: any[];
};
addNewButton(): void;
removeButton(btn: any): void;
onButtonPropertyChange(index: number, key: string, value: any, isTranslate?: boolean): void;
updateTitle(value: string): void;
validateInput(value: string, type: string): boolean;
updateField(value: string): void;
onCheckboxChange(targetArrayPath: any, targetArrayKey: any, key: any, apiName: string, isChecked: boolean): void;
updateProperty(key: string, value: any): void;
onRadioChange(targetArrayPath: any, targetArrayKey: any, key: any, value: any): void;
onRequiredChange(value: boolean): void;
toggleSubQuestion(prop: any): void;
toggleStyleSection(): void;
getProperties(): any;
private clearPropertiesCache;
addOption(options: any[]): void;
removeOption(options: any[], id: string): void;
handleButtonClick(): void;
handleTemplateSave(): void;
setActiveTab(tab: string): void;
onSave(): void;
onCancel(): void;
onAlignSelect(value: string): void;
onStyleSelect(value: string): void;
isStyleActive(value: string): boolean;
getValueByPath(path: string, obj?: any, defaultValue?: any): any;
isAnotherIdSelected(): boolean;
onToggleChange(path: string, event: any): void;
setValueByPath(path: string, value: any, isTranslate?: boolean): void;
optionTranslationUpdate(option: any, event: any): void;
getStyleKeys(): string[];
updateElement(element: any): void;
getValueByArrayPath(targetArrayPath: any, targetArrayKey: string, selectColumn: string, keyPath: string, isTableColumn?: boolean): any;
updateValueByArrayPath(targetArrayPath: any, targetArrayKey: string, selectColumn: string, keyPath: string, event: any, isTableColumn?: boolean, isTranslate?: boolean): void;
getDataByPath(path: string): any;
flipHorizontal(): void;
flipVertical(): void;
resetImage(): void;
zoomOut(): void;
zoomIn(): void;
rotateLeft(): void;
rotateRight(): void;
moveLeft(): void;
moveRight(): void;
moveDown(): void;
moveUp(): void;
private flipAfterRotate;
imageCropped(event: any): Promise<void>;
cropperReady(sourceImageDimensions: Dimensions): void;
convertBlobToBase64(objectUrl: string): Promise<string>;
childEventCapture(event: any): void;
linkToggleDropdown(event: Event): void;
onClickOutside(event: Event): void;
onDragStart(event: DragEvent, id: string): void;
onDragOver(event: DragEvent): void;
onDrop(event: DragEvent, key: string): void;
duplicateField(element: any): void;
private draggedId;
updateBookSubtext(key: 'endpoint' | 'variable' | 'defaultField', value: string): void;
trackByProp(index: number, item: any): any;
getOptimizedSubPropValue(subProp: any): string;
copyToClipboard(text: string | null): void;
static ɵfac: i0.ɵɵFactoryDeclaration<PropertiesComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<PropertiesComponent, "app-properties", never, { "templateSelected": { "alias": "templateSelected"; "required": false; }; "selectedElementType": { "alias": "selectedElementType"; "required": false; }; }, { "formButtonHandler": "formButtonHandler"; "templateSaveHandler": "templateSaveHandler"; }, never, never, true, never>;
}