@updevs/components 1.0.0-alpha.98 → 1.0.0-beta.1

package/types/updevs-components-form-controls-textarea.d.ts

@@ -0,0 +1,31 @@
+import * as _angular_core from '@angular/core';
+import { OnInit, OnChanges } from '@angular/core';
+import { BaseControl } from '@updevs/components/form-controls/abstractions';
+import * as i2 from '@angular/common';
+
+declare class TextareaComponent extends BaseControl implements OnInit, OnChanges {
+    hostWrapperClasses: string;
+    value: _angular_core.ModelSignal<string | undefined>;
+    customClasses: _angular_core.InputSignal<string | undefined>;
+    wrapperClasses: _angular_core.InputSignal<string | undefined>;
+    maxLength: _angular_core.InputSignal<number | undefined>;
+    rows: _angular_core.InputSignal<number | undefined>;
+    displayCharactersCount: _angular_core.InputSignal<boolean>;
+    classes: string[];
+    ngOnInit(): void;
+    ngOnChanges(): void;
+    updateValue(event?: any): void;
+    protected _getValue(): any;
+    protected _updateValue(value: any): void;
+    private updateClasses;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "upd-textarea", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "customClasses": { "alias": "customClasses"; "required": false; "isSignal": true; }; "wrapperClasses": { "alias": "wrapperClasses"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "displayCharactersCount": { "alias": "displayCharactersCount"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, false, never>;
+}
+
+declare class UpdTextareaModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UpdTextareaModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<UpdTextareaModule, [typeof TextareaComponent], [typeof i2.CommonModule], [typeof TextareaComponent]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<UpdTextareaModule>;
+}
+
+export { TextareaComponent, UpdTextareaModule };

package/types/updevs-components-form-controls-time-picker.d.ts

@@ -0,0 +1,164 @@
+import * as i4 from '@jsverse/transloco';
+import { TranslocoService } from '@jsverse/transloco';
+import * as i0 from '@angular/core';
+import { OnInit, OnChanges, ElementRef, SimpleChanges } from '@angular/core';
+import * as i3 from '@angular/common';
+import * as i5 from '@updevs/components/form-controls/input';
+import * as i6 from '@updevs/icons';
+import * as i7 from '@updevs/components/button';
+import * as i8 from '@updevs/components/list';
+import * as i9 from '@updevs/components/dropdown';
+
+declare class TimePickerComponent implements OnInit, OnChanges {
+    inputRef?: ElementRef;
+    /**
+     * Maximum height of the dropdown.
+     */
+    dropdownMaxHeight: number;
+    /**
+     * Whether the mask should be shown.
+     */
+    showMask: boolean;
+    /**
+     * Whether seconds should be selectable.
+     */
+    shouldSelectSeconds: boolean;
+    /**
+     * Whether the 24-hour format will be used or the 12-hour one (AM/PM)
+     */
+    shouldUse24hFormat: boolean;
+    /**
+     * Hour from which where the list will begin.
+     */
+    startingHour: number;
+    /**
+     * Hour from which where the list will end.
+     */
+    endingHour: number;
+    /**
+     * Interval between hours displayed.
+     */
+    hourInterval: number;
+    /**
+     * Minute from which where the list will begin.
+     */
+    startingMinute: number;
+    /**
+     * Minute from which where the list will end.
+     */
+    endingMinute: number;
+    /**
+     * Interval between minutes displayed.
+     */
+    minuteInterval: number;
+    /**
+     * Second from which where the list will begin.
+     */
+    startingSecond: number;
+    /**
+     * Second from which where the list will end.
+     */
+    endingSecond: number;
+    /**
+     * Interval between seconds displayed.
+     */
+    secondInterval: number;
+    /**
+     * Custom list of hours to be displayed for selection.
+     */
+    customHours?: number[];
+    /**
+     * Custom list of minutes to be displayed for selection.
+     */
+    customMinutes?: number[];
+    /**
+     * Custom list of seconds to be displayed for selection.
+     */
+    customSeconds?: number[];
+    maxWidth: number;
+    isDropdownOpen: boolean;
+    get inputMask(): string;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    openDropdown(): void;
+    private setupStyle;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "upd-time-picker", never, { "dropdownMaxHeight": { "alias": "dropdownMaxHeight"; "required": false; }; "showMask": { "alias": "showMask"; "required": false; }; "shouldSelectSeconds": { "alias": "shouldSelectSeconds"; "required": false; }; "shouldUse24hFormat": { "alias": "shouldUse24hFormat"; "required": false; }; "startingHour": { "alias": "startingHour"; "required": false; }; "endingHour": { "alias": "endingHour"; "required": false; }; "hourInterval": { "alias": "hourInterval"; "required": false; }; "startingMinute": { "alias": "startingMinute"; "required": false; }; "endingMinute": { "alias": "endingMinute"; "required": false; }; "minuteInterval": { "alias": "minuteInterval"; "required": false; }; "startingSecond": { "alias": "startingSecond"; "required": false; }; "endingSecond": { "alias": "endingSecond"; "required": false; }; "secondInterval": { "alias": "secondInterval"; "required": false; }; "customHours": { "alias": "customHours"; "required": false; }; "customMinutes": { "alias": "customMinutes"; "required": false; }; "customSeconds": { "alias": "customSeconds"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+declare class TimeSelectorComponent implements OnInit, OnChanges {
+    /**
+     * Whether seconds should be selectable.
+     */
+    shouldSelectSeconds: boolean;
+    /**
+     * Whether the 24-hour format will be used or the 12-hour one (AM/PM)
+     */
+    shouldUse24hFormat: boolean;
+    /**
+     * Hour from which where the list will begin.
+     */
+    startingHour: number;
+    /**
+     * Hour from which where the list will end.
+     */
+    endingHour: number;
+    /**
+     * Interval between hours displayed.
+     */
+    hourInterval: number;
+    /**
+     * Minute from which where the list will begin.
+     */
+    startingMinute: number;
+    /**
+     * Minute from which where the list will end.
+     */
+    endingMinute: number;
+    /**
+     * Interval between minutes displayed.
+     */
+    minuteInterval: number;
+    /**
+     * Second from which where the list will begin.
+     */
+    startingSecond: number;
+    /**
+     * Second from which where the list will end.
+     */
+    endingSecond: number;
+    /**
+     * Interval between seconds displayed.
+     */
+    secondInterval: number;
+    /**
+     * Custom list of hours to be displayed for selection.
+     */
+    customHours?: number[];
+    /**
+     * Custom list of minutes to be displayed for selection.
+     */
+    customMinutes?: number[];
+    /**
+     * Custom list of seconds to be displayed for selection.
+     */
+    customSeconds?: number[];
+    hoursList: number[];
+    minutesList: number[];
+    secondsList: number[];
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    private setupTimeLists;
+    private setupTimeList;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimeSelectorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimeSelectorComponent, "upd-time-selector", never, { "shouldSelectSeconds": { "alias": "shouldSelectSeconds"; "required": false; }; "shouldUse24hFormat": { "alias": "shouldUse24hFormat"; "required": false; }; "startingHour": { "alias": "startingHour"; "required": false; }; "endingHour": { "alias": "endingHour"; "required": false; }; "hourInterval": { "alias": "hourInterval"; "required": false; }; "startingMinute": { "alias": "startingMinute"; "required": false; }; "endingMinute": { "alias": "endingMinute"; "required": false; }; "minuteInterval": { "alias": "minuteInterval"; "required": false; }; "startingSecond": { "alias": "startingSecond"; "required": false; }; "endingSecond": { "alias": "endingSecond"; "required": false; }; "secondInterval": { "alias": "secondInterval"; "required": false; }; "customHours": { "alias": "customHours"; "required": false; }; "customMinutes": { "alias": "customMinutes"; "required": false; }; "customSeconds": { "alias": "customSeconds"; "required": false; }; }, {}, never, never, false, never>;
+}
+
+declare class UpdTimePickerModule {
+    constructor(translocoService: TranslocoService);
+    static ɵfac: i0.ɵɵFactoryDeclaration<UpdTimePickerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<UpdTimePickerModule, [typeof TimePickerComponent, typeof TimeSelectorComponent], [typeof i3.CommonModule, typeof i4.TranslocoModule, typeof i5.UpdInputModule, typeof i6.UpdIconsModule, typeof i7.UpdButtonModule, typeof i8.UpdListModule, typeof i9.UpdDropdownModule], [typeof TimePickerComponent, typeof TimeSelectorComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<UpdTimePickerModule>;
+}
+
+export { TimePickerComponent, TimeSelectorComponent, UpdTimePickerModule };

package/types/updevs-components-form.d.ts

@@ -0,0 +1,356 @@
+import { ButtonModel, BaseComponent } from '@updevs/sdk/layout';
+import * as i4 from '@angular/forms';
+import { ValidatorFn, FormControlStatus, FormGroup, FormControl } from '@angular/forms';
+import * as i0 from '@angular/core';
+import { Signal, OnInit, EventEmitter, InputSignal } from '@angular/core';
+import * as i14 from '@updevs/sdk';
+import { TextModel, TextService } from '@updevs/sdk';
+import { RowColumnSize, HorizontalVerticalType, ValidationStatusType } from '@updevs/components';
+import { RequiredPermissionsModel } from '@updevs/sdk/security';
+import { DictionaryType, OptionalType } from '@updevs/sdk/types';
+import * as i7 from '@updevs/components/form-controls/input';
+import { InputType } from '@updevs/components/form-controls/input';
+import { UpdMaskConfig } from '@updevs/sdk/mask';
+import * as i11 from '@updevs/components/form-controls/select';
+import { SelectItem, Defaults } from '@updevs/components/form-controls/select';
+import { BaseSearchStore, ObservableSearchType } from '@updevs/sdk/stores';
+import * as i6 from '@jsverse/transloco';
+import { TranslocoService } from '@jsverse/transloco';
+import * as i13 from '@updevs/components/form-controls/file-upload';
+import { FileUploadChangedEvent } from '@updevs/components/form-controls/file-upload';
+import * as i3 from '@angular/common';
+import * as i5 from '@updevs/components/button';
+import * as i8 from '@updevs/components/form-controls/checkbox';
+import * as i9 from '@updevs/components/form-controls/radio';
+import * as i10 from '@updevs/components/form-controls/date-picker';
+import * as i12 from '@updevs/components/form-controls/textarea';
+
+/**
+ * How a parent field influences its child.
+ **/
+declare enum AttachmentTypeEnum {
+    /**
+     * Enable / disable behaviour (default).
+     **/
+    Disabled = "disabled",
+    /**
+     * Child waits for the parent to have a value and (re)loads afterwards.
+     **/
+    ParentLoad = "parentLoad"
+}
+
+declare enum DynamicFieldType {
+    Input = 1,
+    Select = 2,
+    SelectMultiple = 3,
+    Label = 4,
+    Checkbox = 5,
+    CheckboxGroup = 6,
+    Radio = 7,
+    RadioGroup = 8,
+    TextArea = 9,
+    FileUpload = 10,
+    MaskedInput = 11,
+    Button = 12,
+    ButtonGroup = 13
+}
+
+/**
+ * Declarative relationship between two dynamic fields.
+ * P = parent value type, C = child value type.
+ */
+interface AttachmentRule<P = any, C = any> {
+    /**
+     * Name of the *parent* control inside the same FormGroup.
+     **/
+    name: string;
+    /**
+     * Kind of interaction (default = Disabled).
+     **/
+    type?: AttachmentTypeEnum;
+    /**
+     * Returns true when the *child* must be disabled.
+     **/
+    disableIf?: (childValue: C, parentValue: P) => boolean;
+    /**
+     * Disable when the parent is empty/null/''.
+     **/
+    disableIfEmpty?: boolean;
+    /**
+     * Clear the child’s value the moment it becomes disabled.
+     **/
+    clearValueIfDisabled?: boolean;
+    /**
+     * Clear the child when the parent turns empty.
+     **/
+    clearValueIfEmpty?: boolean;
+    /**
+     * Return false to HIDE the child; true → show.
+     **/
+    visibleIf?: (childValue: C, parentValue: P) => boolean;
+}
+
+type FormUpdateOn = 'change' | 'blur' | 'submit';
+
+interface DynamicFieldModel {
+    type: DynamicFieldType;
+    name: string;
+    isRequired?: boolean;
+    isDisabled?: boolean;
+    /**
+     * If the field is valid it will be marked as such, instead of just maintaining the default state.
+     */
+    showValidStatus?: boolean;
+    /**
+     * Initial value.
+     */
+    initValue?: any;
+    /**
+     * Determines when the control validation is triggered.
+     * 'change' (default), 'blur', or 'submit'.
+     */
+    updateOn?: FormUpdateOn;
+    placeholder?: TextModel;
+    label?: TextModel;
+    hint?: TextModel;
+    hintAsTooltip?: boolean;
+    colSize?: RowColumnSize;
+    labelColSize?: RowColumnSize;
+    validators?: ValidatorFn[];
+    requiredPermissions?: RequiredPermissionsModel;
+    /**
+     * Cross-field dependencies (optional).
+     **/
+    attachments?: AttachmentRule[];
+    isHidden?: boolean;
+    /**
+     * Value coming from a parent field when the rule `AttachmentTypeEnum.ParentLoad` is active.
+     * `upd-select` can use it to fetch the dependent list.
+     */
+    parentValue?: any;
+    /**
+     * A signal to control the visibility of the field.
+     */
+    isVisible?: Signal<boolean>;
+    onValueChanged?: (value: any) => void;
+    onBlur?: () => void;
+    onFocus?: () => void;
+    onTouched?: () => void;
+    onInput?: (value: any) => void;
+    onEnter?: () => void;
+    onValidationStatusChanged?: (status: FormControlStatus) => void;
+}
+
+interface ButtonFieldModel extends DynamicFieldModel {
+    model: ButtonModel;
+}
+
+interface ButtonGroupFieldModel extends DynamicFieldModel {
+    buttons: ButtonModel[];
+}
+
+interface RadioFieldModel extends DynamicFieldModel {
+    isInline?: boolean;
+}
+
+interface CheckboxFieldModel extends RadioFieldModel {
+    isSwitch?: boolean;
+}
+
+interface CheckboxGroupFieldModel extends CheckboxFieldModel {
+    options: DictionaryType<TextModel>;
+}
+
+interface FileUploadFieldModel extends DynamicFieldModel {
+    title?: TextModel;
+    allowFilesDrop?: boolean;
+    isMultiple?: boolean;
+    allowedExtensions?: string;
+    minFileSize?: number;
+    maxFileSize?: number;
+    saveAsDataUrl?: boolean;
+    /**
+     * If set, uses this property to store/read the name of the file.
+     * *NOTE*: Required when using saveAsDataUrl.
+     */
+    fileNameFormProperty?: string;
+}
+
+interface FormConfig {
+}
+
+interface FormRowModel {
+    fields: DynamicFieldModel[];
+    isCompact?: boolean;
+    isHidden?: boolean;
+    requiredPermissions?: RequiredPermissionsModel;
+    title?: TextModel;
+}
+
+interface InputFieldModel extends DynamicFieldModel {
+    inputType?: InputType;
+    shouldSubmitOnEnter?: boolean;
+    prefix?: TextModel;
+    suffix?: TextModel;
+}
+
+interface MaskedInputFieldModel extends InputFieldModel {
+    mask?: string;
+    maskConfig?: UpdMaskConfig;
+}
+
+interface RadioGroupFieldModel extends RadioFieldModel {
+    options: DictionaryType<TextModel>;
+}
+
+interface SelectFieldModel extends DynamicFieldModel {
+    items?: SelectItem[];
+    store?: BaseSearchStore;
+    /**
+     * Observable used to load/filter the items.
+     */
+    observable?: ObservableSearchType;
+    /**
+     * Name of the property in the object that represents the ID/key of the option.
+     * **Note:** used only for remote data.
+     */
+    itemKey?: string;
+    /**
+     * Name of the property in the object that represents the value/description of the option.
+     * **Note:** used only for remote data.
+     */
+    itemValue?: string;
+    /**
+     * Maximum height of the dropdown.
+     */
+    dropdownMaxHeight?: number;
+    typeaheadDebounce?: number;
+    shouldAutoSearch?: boolean;
+    shouldCloseOnOutsideClick?: boolean;
+    shouldTruncateSelectedText?: boolean;
+}
+
+interface SingleSelectFieldModel extends SelectFieldModel {
+    useSystemStyle?: boolean;
+}
+
+interface TextareaFieldModel extends DynamicFieldModel {
+    value?: string;
+    customClasses?: string;
+    wrapperClasses?: string;
+    maxLength?: number;
+    rows?: number;
+    isDisabled?: boolean;
+    displayCharactersCount?: boolean;
+}
+
+declare class FormComponent<T> extends BaseComponent implements OnInit {
+    readonly initialized: EventEmitter<void>;
+    readonly dataLoaded: EventEmitter<T>;
+    readonly submitted: EventEmitter<T>;
+    /**
+     * Rows to generate the form.
+     */
+    rows: InputSignal<FormRowModel[]>;
+    /**
+     * Form's layout.
+     */
+    layout: InputSignal<HorizontalVerticalType>;
+    /**
+     * Title of the form.
+     * Optional.
+     */
+    title: InputSignal<OptionalType<TextModel>>;
+    /**
+     * Whether the actions section will be displayed.
+     */
+    hasActionsSection: InputSignal<boolean>;
+    /**
+     * Whether the form is contained in a card.
+     * If true, it'll display a card as a form wrapper.
+     */
+    isCard: InputSignal<boolean>;
+    /**
+     * Whether the form is in read only mode, which means no fields can be edited.
+     */
+    isDisabled: i0.InputSignalWithTransform<boolean, string | boolean>;
+    /**
+     * Whether the form is loading.
+     */
+    isLoading: InputSignal<boolean>;
+    /**
+     * Whether the form is saving.
+     */
+    isSaving: InputSignal<boolean>;
+    /**
+     * Current form data.
+     */
+    formData: i0.ModelSignal<T>;
+    formGroup: i0.ModelSignal<FormGroup<{}>>;
+    get titleText(): string;
+    readonly textService: TextService;
+    constructor();
+    ngOnInit(): void;
+    submit(): void;
+    private setupFormGroup;
+    /**
+     * Glue the declarative AttachmentRule array to actual FormControls.
+     **/
+    private bindAttachments;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormComponent<any>, "upd-form", never, { "rows": { "alias": "rows"; "required": true; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "hasActionsSection": { "alias": "hasActionsSection"; "required": false; "isSignal": true; }; "isCard": { "alias": "isCard"; "required": false; "isSignal": true; }; "isDisabled": { "alias": "isDisabled"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "isSaving": { "alias": "isSaving"; "required": false; "isSignal": true; }; "formData": { "alias": "formData"; "required": false; "isSignal": true; }; "formGroup": { "alias": "formGroup"; "required": false; "isSignal": true; }; }, { "initialized": "initialized"; "dataLoaded": "dataLoaded"; "submitted": "submitted"; "formData": "formDataChange"; "formGroup": "formGroupChange"; }, never, never, false, never>;
+}
+
+declare class DynamicFieldComponent extends BaseComponent implements OnInit {
+    get hostClasses(): string;
+    readonly submitForm: EventEmitter<void>;
+    DynamicFieldType: typeof DynamicFieldType;
+    SelectDefaults: typeof Defaults;
+    formGroup: InputSignal<FormGroup>;
+    field: InputSignal<DynamicFieldModel>;
+    layout: InputSignal<HorizontalVerticalType>;
+    validationStatus?: ValidationStatusType;
+    validationStatusDescriptions: TextModel[];
+    get formControl(): FormControl;
+    get inputField(): InputFieldModel;
+    get checkboxField(): CheckboxFieldModel;
+    get checkboxGroupField(): CheckboxGroupFieldModel;
+    get radioField(): CheckboxFieldModel;
+    get radioGroupField(): RadioGroupFieldModel;
+    get selectField(): SelectFieldModel;
+    get singleSelectField(): SingleSelectFieldModel;
+    get textareaField(): TextareaFieldModel;
+    get fileUploadField(): FileUploadFieldModel;
+    get maskedField(): MaskedInputFieldModel;
+    get buttonField(): ButtonFieldModel;
+    get buttonGroupField(): ButtonGroupFieldModel;
+    get checkboxGroupOptionsKeys(): string[];
+    get radioGroupOptionsKeys(): string[];
+    get fileNameControl(): OptionalType<FormControl>;
+    readonly textService: TextService;
+    private readonly wrapperClasses;
+    private readonly errorsHelper;
+    constructor();
+    ngOnInit(): void;
+    onBlur(): void;
+    onFocus(): void;
+    onInput(event: Event): void;
+    setControlValue(value: any): void;
+    getText(textModel?: TextModel): string;
+    getOptionDescription(key: string, type: 'checkbox' | 'radio'): OptionalType<TextModel>;
+    handleFileSelected(event?: FileUploadChangedEvent): void;
+    onInputEnter(): void;
+    private updateValidationDisplay;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DynamicFieldComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DynamicFieldComponent, "upd-dynamic-field", never, { "formGroup": { "alias": "formGroup"; "required": true; "isSignal": true; }; "field": { "alias": "field"; "required": true; "isSignal": true; }; "layout": { "alias": "layout"; "required": true; "isSignal": true; }; }, { "submitForm": "submitForm"; }, never, never, false, never>;
+}
+
+declare class UpdFormModule {
+    constructor(translocoService: TranslocoService);
+    static ɵfac: i0.ɵɵFactoryDeclaration<UpdFormModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<UpdFormModule, [typeof FormComponent, typeof DynamicFieldComponent], [typeof i3.CommonModule, typeof i4.ReactiveFormsModule, typeof i5.UpdButtonModule, typeof i6.TranslocoDirective, typeof i7.UpdInputModule, typeof i8.UpdCheckboxModule, typeof i9.UpdRadioModule, typeof i10.UpdDatePickerModule, typeof i11.UpdSelectModule, typeof i12.UpdTextareaModule, typeof i13.UpdFileUploadModule, typeof i14.UpdSdkModule], [typeof FormComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<UpdFormModule>;
+}
+
+export { AttachmentTypeEnum, DynamicFieldType, FormComponent, UpdFormModule };
+export type { AttachmentRule, ButtonFieldModel, ButtonGroupFieldModel, CheckboxFieldModel, CheckboxGroupFieldModel, DynamicFieldModel, FileUploadFieldModel, FormConfig, FormRowModel, InputFieldModel, MaskedInputFieldModel, RadioFieldModel, RadioGroupFieldModel, SelectFieldModel, SingleSelectFieldModel, TextareaFieldModel };