aril 0.0.46 → 0.0.48

package/ui/field/src/field.component.ts

@@ -1,46 +0,0 @@
-import { NgIf, NgTemplateOutlet } from '@angular/common';
-import { ChangeDetectionStrategy, Component, HostBinding, effect, input } from '@angular/core';
-
-import { DxFieldComponent } from 'aril/ui/dxField';
-import { Types } from 'aril/util/lib';
-
-type LabelPositions = 'top' | 'left';
-
-interface ColumnSizeTypes {
-	xl?: Types.NumberRange<1, 13>;
-	lg?: Types.NumberRange<1, 13>;
-	md?: Types.NumberRange<1, 13>;
-	sm?: Types.NumberRange<1, 13>;
-	default?: Types.NumberRange<1, 13>;
-}
-
-@Component({
-	standalone: true,
-	selector: 'aril-field',
-	templateUrl: './field.component.html',
-	imports: [DxFieldComponent, NgIf, NgTemplateOutlet],
-	changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class FieldComponent {
-	constructor() {
-		effect(() => {
-			if (this.cols()) {
-				this.hostClass = Object.entries(this.cols()).reduce((acc, [key, value]) => {
-					if (key === 'default') return `${acc} col-${value}`;
-					return `${acc} ${key}:col-${value}`;
-				}, '');
-			}
-		});
-	}
-
-	label = input<string>();
-	color = input<string>('#333');
-	labelWidth = input<number>(30);
-	valueWidth = input<number>(70);
-	labelPos = input<LabelPositions>('top');
-	markAsRequired = input<boolean>(false);
-	cols = input.required<ColumnSizeTypes>({});
-
-	@HostBinding('class') hostClass = '';
-	@HostBinding('style.padding') padding = '.5rem';
-}

package/ui/fileUpload/ng-package.json

@@ -1,6 +0,0 @@
-{
-	"$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-	"lib": {
-		"entryFile": "./index.ts"
-	}
-}

package/ui/fileUpload/src/file-upload.component.html

@@ -1,38 +0,0 @@
-<p-fileUpload
-	[name]="name()"
-	[url]="url()"
-	method="post"
-	[multiple]="multiple()"
-	[accept]="accept()"
-	[disabled]="disabled()"
-	[auto]="auto()"
-	[maxFileSize]="maxFileSize()"
-	[tabindex]="tabindex"
-	[withCredentials]="withCredentials()"
-	[showUploadButton]="showUploadButton()"
-	[showCancelButton]="showCancelButton()"
-	[chooseLabel]="chooseLabel()"
-	[cancelLabel]="cancelLabel()"
-	[uploadLabel]="uploadLabel()"
-	[invalidFileTypeMessageSummary]="invalidFileTypeMessageSummary()"
-	[invalidFileTypeMessageDetail]="invalidFileTypeMessageDetail()"
-	[invalidFileSizeMessageSummary]="invalidFileSizeMessageSummary()"
-	[invalidFileSizeMessageDetail]="invalidFileSizeMessageDetail()"
-	(onBeforeSend)="beforeSend.emit($event)"
-	(onUpload)="onUpload($event)"
-	(onError)="onError($event)"
-	(onSelect)="selects.emit($event)"
-	(onClear)="clear.emit($event)">
-	<ng-template pTemplate="content">
-		@if (uploadedFiles.length) {
-			<div class="flex flex-column">
-				@for (file of uploadedFiles; track file) {
-					<div class="mt-2">
-						<i class="pi pi-file-excel" style="color: slateblue; font-size: 1.4rem"></i>
-						{{ file.name }} - {{ file.size }} bytes
-					</div>
-				}
-			</div>
-		}
-	</ng-template>
-</p-fileUpload>

package/ui/fileUpload/src/file-upload.component.ts

@@ -1,72 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { HttpEvent } from '@angular/common/http';
-import { Component, EventEmitter, Output, input } from '@angular/core';
-
-import { MessageService } from 'primeng/api';
-import { FileUploadModule } from 'primeng/fileupload';
-
-interface UploadEvent {
-	originalEvent: HttpEvent<any>;
-	files: File[];
-}
-
-interface UploadFile {
-	name: string;
-	size: number;
-	type: string;
-	objectURL?: string;
-}
-
-interface FileUploadErrorEvent {
-	files: File[];
-	error: ErrorEvent;
-}
-
-@Component({
-	standalone: true,
-	selector: 'aril-file-upload',
-	templateUrl: './file-upload.component.html',
-	imports: [FileUploadModule],
-	providers: [MessageService]
-})
-export class FileUploadComponent {
-	constructor(private messageService: MessageService) {}
-
-	name = input<string>();
-	url = input.required<string>();
-	multiple = input(false);
-	accept = input<string>('.xlsx');
-	disabled = input(false);
-	auto = input(false);
-	maxFileSize = input<number>();
-	tabindex = input<number>();
-	withCredentials = input(false);
-	showUploadButton = input(true);
-	showCancelButton = input(true);
-	cancelLabel = input('Temizle');
-	chooseLabel = input('Dosya Seç');
-	uploadLabel = input('Dosya Yükle');
-	invalidFileTypeMessageSummary = input('Geçersiz dosya türü');
-	invalidFileTypeMessageDetail = input('Seçilen dosya türü desteklenmiyor.');
-	invalidFileSizeMessageSummary = input('Dosya boyutu çok büyük');
-	invalidFileSizeMessageDetail = input('Dosya boyutu izin verilen maksimum boyuttan daha büyük.');
-
-	@Output() beforeSend: EventEmitter<unknown> = new EventEmitter();
-	@Output() upload: EventEmitter<unknown> = new EventEmitter();
-	@Output() errors: EventEmitter<unknown> = new EventEmitter();
-	@Output() selects: EventEmitter<unknown> = new EventEmitter();
-	@Output() clear: EventEmitter<unknown> = new EventEmitter();
-
-	uploadedFiles: UploadFile[] = [];
-
-	onUpload(event: UploadEvent) {
-		this.upload.emit(event);
-		this.uploadedFiles = event.files;
-		this.messageService.add({ key: 'toast-root', severity: 'success', summary: 'Dosya başarıyla yüklendi.' });
-	}
-
-	onError(event: any) {
-		this.errors.emit(event);
-		this.messageService.add({ key: 'toast-root', severity: 'error', summary: 'Dosya yüklenemedi.' });
-	}
-}

package/ui/form/index.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-
-import { ButtonComponent } from 'aril/ui/button';
-
-import { FormSubmitButtonComponent } from './src/form-submit-button.component';
-import { FormComponent } from './src/form.component';
-
-export * from './src/form.component';
-export * from './src/form-submit-button.component';
-
-const components = [FormComponent, FormSubmitButtonComponent];
-
-@NgModule({
-	imports: [ButtonComponent],
-	exports: [components],
-	declarations: [components]
-})
-export class ARiLFormModule {}

package/ui/form/ng-package.json

@@ -1,6 +0,0 @@
-{
-	"$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-	"lib": {
-		"entryFile": "./index.ts"
-	}
-}

package/ui/form/src/form-submit-button.component.html

@@ -1,12 +0,0 @@
-<aril-button
-	[label]="label()"
-	[loading]="formGroup().pending"
-	[disabled]="disabled()"
-	[raised]="raised()"
-	[outlined]="outlined()"
-	[badge]="badge()"
-	[size]="size()"
-	[icon]="icon()"
-	[color]="color()"
-	(clickEvent)="submit()">
-</aril-button>

package/ui/form/src/form-submit-button.component.ts

@@ -1,36 +0,0 @@
-import { ChangeDetectionStrategy, Component, EventEmitter, Output, inject, input } from '@angular/core';
-import { FormGroup } from '@angular/forms';
-
-import { MessageService } from 'primeng/api';
-
-import { ButtonComponent } from 'aril/ui/button';
-import { checkValidInputs } from 'aril/ui/lib';
-
-@Component({
-	selector: 'aril-form-submit:not([click])',
-	templateUrl: './form-submit-button.component.html',
-	changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class FormSubmitButtonComponent extends ButtonComponent {
-	formGroup = input.required<FormGroup>();
-
-	@Output() validEvent: EventEmitter<never> = new EventEmitter<never>();
-	@Output() inValidEvent: EventEmitter<never> = new EventEmitter<never>();
-
-	messageService = inject(MessageService);
-
-	submit() {
-		checkValidInputs(this.formGroup());
-
-		if (this.formGroup().valid) this.validEvent.emit();
-		else {
-			this.messageService.add({
-				key: 'toast-root',
-				severity: 'warn ',
-				summary: 'Form Hatası',
-				detail: 'Lütfen formdaki eksikleri gideriniz'
-			});
-			this.inValidEvent.emit();
-		}
-	}
-}

package/ui/form/src/form.component.ts

@@ -1,20 +0,0 @@
-import { ChangeDetectionStrategy, Component, input } from '@angular/core';
-import { FormGroup } from '@angular/forms';
-
-import { FlexGridDirective, FormErrorMessageDirective } from 'aril/ui/lib';
-
-@Component({
-	selector: 'aril-form',
-	template: ` <ng-content></ng-content> `,
-	hostDirectives: [
-		FlexGridDirective,
-		{
-			directive: FormErrorMessageDirective,
-			inputs: ['formErrorMessage: formGroup']
-		}
-	],
-	changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class FormComponent {
-	formGroup = input.required<FormGroup>();
-}

package/ui/index.ts

@@ -1 +0,0 @@
-export const aril_ui = 'ARiL-UI';

package/ui/lib/ng-package.json

@@ -1,6 +0,0 @@
-{
-	"$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-	"lib": {
-		"entryFile": "./index.ts"
-	}
-}

package/ui/lib/src/form/form-error-message.component.ts

@@ -1,25 +0,0 @@
-import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
-import { ValidationErrors } from '@angular/forms';
-
-import { Message } from 'primeng/api';
-import { MessagesModule } from 'primeng/messages';
-
-@Component({
-	standalone: true,
-	imports: [MessagesModule],
-	template: `
-		<div class="flex gap-2 formErrorMessage">
-			<p-messages [(value)]="_pMessages" [enableService]="false" [closable]="false"></p-messages>
-		</div>
-	`,
-	changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class FormErrorMessagesComponent {
-	_pMessages!: Message[];
-
-	@Input() set messages(messages: ValidationErrors | null) {
-		this._pMessages = Object.values(messages!).map((msg) => {
-			return { severity: 'error', summary: '', detail: msg };
-		});
-	}
-}

package/ui/lib/src/form/form-error-message.directive.ts

@@ -1,32 +0,0 @@
-/* eslint-disable @angular-eslint/directive-selector */
-import { ComponentRef, Directive, OnInit, ViewContainerRef, input } from '@angular/core';
-import { FormGroup } from '@angular/forms';
-
-import { FormErrorMessagesComponent } from './form-error-message.component';
-
-@Directive({
-	standalone: true,
-	selector: '[formErrorMessage]'
-})
-export class FormErrorMessageDirective implements OnInit {
-	constructor(private viewContainerRef: ViewContainerRef) {}
-
-	formErrorMessage = input.required<FormGroup>();
-
-	errorKeys: string[] = [];
-	componentRef!: ComponentRef<FormErrorMessagesComponent>;
-
-	ngOnInit(): void {
-		this.formErrorMessage().statusChanges.subscribe((status) => {
-			if (this.componentRef) this.viewContainerRef.remove();
-
-			if (status === 'INVALID') {
-				if (this.formErrorMessage().errors) {
-					this.componentRef = this.viewContainerRef.createComponent(FormErrorMessagesComponent);
-					this.componentRef.instance.messages = this.formErrorMessage().errors;
-					this.viewContainerRef.insert(this.componentRef.hostView);
-				}
-			}
-		});
-	}
-}

package/ui/lib/src/form/form-field-builder.ts

@@ -1,31 +0,0 @@
-import { FormControl, FormGroup, ValidatorFn } from '@angular/forms';
-
-export const addControlsWithValidation = (
-	form: FormGroup,
-	controls: { name: string; validator?: ValidatorFn; disabled?: boolean }[]
-) => {
-	controls.forEach((control) => {
-		if (!form.contains(control.name)) {
-			form.addControl(
-				control.name,
-				new FormControl({ value: null, disabled: control?.disabled || false }, control.validator)
-			);
-		}
-	});
-};
-
-export const removeControls = (form: FormGroup, controlNames: string[]) => {
-	controlNames.forEach((controlName) => {
-		if (form.contains(controlName)) {
-			form.removeControl(controlName);
-		}
-	});
-};
-
-export const updateValueAndValidities = (form: FormGroup, controlNames: string[]) => {
-	controlNames.forEach((controlName) => {
-		if (form.contains(controlName)) {
-			form.get(controlName)?.updateValueAndValidity();
-		}
-	});
-};

package/ui/lib/src/form/form-validation.ts

@@ -1,14 +0,0 @@
-import { FormArray, FormControl, FormGroup } from '@angular/forms';
-
-export const checkValidInputs = (formGroup: FormGroup | FormArray) => {
-	Object.keys(formGroup.controls).forEach((field) => {
-		const control = formGroup.get(field);
-
-		if (control instanceof FormControl) {
-			control.markAsTouched({ onlySelf: true });
-			control.markAsDirty({ onlySelf: true });
-		} else if (control instanceof FormGroup || control instanceof FormArray) {
-			checkValidInputs(control);
-		}
-	});
-};

package/ui/lib/src/grid/flex-grid.directive.ts

@@ -1,10 +0,0 @@
-/* eslint-disable @angular-eslint/directive-selector */
-import { Directive, HostBinding } from '@angular/core';
-
-@Directive({
-	standalone: true,
-	selector: '[flexGrid]'
-})
-export class FlexGridDirective {
-	@HostBinding('class') hostClass = 'grid p-fluid m-0 p-0';
-}

package/ui/lib/src/input/baseInput.ts

@@ -1,30 +0,0 @@
-import { inject } from '@angular/core';
-import { FormControlDirective, FormControlName, NgControl, NgModel } from '@angular/forms';
-
-import { TooltipOptions } from 'primeng/api';
-
-export abstract class BaseInputComponent {
-	ngControl = injectNgControl();
-
-	tooltipOptions: TooltipOptions = {
-		tooltipPosition: 'top',
-		tooltipEvent: 'focus',
-		tooltipStyleClass: 'tooltipErrorMessage'
-	};
-}
-
-export function injectNgControl() {
-	const ngControl = inject(NgControl, { self: true, optional: true });
-
-	if (!ngControl) throw new Error('NgModel or FormControlName or FormControlDirective is required');
-
-	if (
-		ngControl instanceof NgModel ||
-		ngControl instanceof FormControlName ||
-		ngControl instanceof FormControlDirective
-	) {
-		return ngControl;
-	}
-
-	throw new Error('Something went wrong in InjectNgControl');
-}

package/ui/lib/src/input/common-input-validators.service.ts

@@ -1,57 +0,0 @@
-import { Injectable } from '@angular/core';
-import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';
-
-import 'aril/util/primitive-extensions';
-
-type DateRangeFormat = 'minute' | 'hour' | 'day' | 'month' | 'year';
-
-@Injectable({
-	providedIn: 'root'
-})
-export class CommonInputValidatorsService {
-	/**
-	 * @param sdCtrlName - name of the start date form control
-	 * @param edCtrlName - name of the end date form control
-	 * @param rangeValue - range between start and end date. Default value is 1
-	 * @param rangeFormat - format of the range. Default value is "day"
-	 */
-	dateRange(sdCtrlName: string, edCtrlName: string, rangeValue = 0, rangeFormat: DateRangeFormat = 'day'): ValidatorFn {
-		return (control: AbstractControl): ValidationErrors | null => {
-			const start: number = control.get(sdCtrlName)?.value;
-			const end: number = control.get(edCtrlName)?.value;
-
-			const startJSDate = start.longToDate();
-			const endJSDate = end.longToDate();
-
-			if (startJSDate && endJSDate) {
-				const isRangeValid = endJSDate.getTime() - startJSDate.getTime() > rangeValue;
-
-				return isRangeValid ? null : (
-						{ dateRange: `The end date must be at least ${rangeValue} ${rangeFormat} bigger than the start date` }
-					);
-			}
-
-			return null;
-		};
-	}
-
-	/**
-	 * @description - pasword match vs.
-	 */
-	strictMatch(controlName: string, matchingControlName: string): ValidatorFn {
-		return (control: AbstractControl): ValidationErrors | null => {
-			const firstField = control.get(controlName);
-			const secondField = control.get(matchingControlName);
-
-			if (!firstField || !secondField) {
-				return null;
-			}
-
-			if (firstField.value !== secondField.value) {
-				return { strictMatch: `${controlName} and ${matchingControlName} do not match` };
-			}
-
-			return null;
-		};
-	}
-}

package/ui/lib/src/input/dx-input-error-message.pipe.ts

@@ -1,16 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { Pipe, PipeTransform, inject } from '@angular/core';
-
-import { InputErrorMessagePipe } from './input-error-message.pipe';
-
-@Pipe({
-	standalone: true,
-	name: 'dxInputErrorMessage'
-})
-export class DXInputErrorMessagePipe implements PipeTransform {
-	errorMsgPipe = inject(InputErrorMessagePipe);
-
-	transform(value: any, ...args: any[]): { message: string } {
-		return { message: this.errorMsgPipe.transform(value, ...args) };
-	}
-}

package/ui/lib/src/input/input-disabled.directive.ts

@@ -1,15 +0,0 @@
-import { Directive, Input } from '@angular/core';
-import { NgControl } from '@angular/forms';
-
-@Directive({
-	standalone: true,
-	selector: '[arilDisabled]'
-})
-export class InputDisabledDirective {
-	constructor(private ngControl: NgControl) {}
-
-	@Input() set arilDisabled(condition: boolean) {
-		const action = condition ? 'disable' : 'enable';
-		if (this.ngControl.control) this.ngControl.control[action]();
-	}
-}

package/ui/lib/src/input/input-error-message.pipe.ts

@@ -1,39 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-	standalone: true,
-	name: 'inputErrorMessage'
-})
-export class InputErrorMessagePipe implements PipeTransform {
-	transform(value: any, ...args: any[]): string {
-		const control = args[0];
-		const errorKeys = Object.keys(control.errors || {});
-
-		if (errorKeys.length) {
-			const errorKey = errorKeys[0];
-			const errorValue = control.errors![errorKey];
-
-			switch (errorKey) {
-				case 'required':
-					return 'This field is required';
-				case 'min':
-					return `Minimum value is ${errorValue.min}`;
-				case 'max':
-					return `Maximum value is ${errorValue.max}`;
-				case 'minlength':
-					return `Minimum length is ${errorValue.requiredLength}`;
-				case 'maxlength':
-					return `Maximum length is ${errorValue.requiredLength}`;
-				case 'email':
-					return 'Invalid email';
-				case 'pattern':
-					return 'Invalid format';
-				default:
-					return errorValue;
-			}
-		}
-
-		return '';
-	}
-}

package/ui/lib/src/input/input-transforms.ts

@@ -1,11 +0,0 @@
-import { PrimeIcons } from 'primeng/api';
-
-export type PrimeIcon = Exclude<keyof typeof PrimeIcons, 'prototype'>;
-export function iconTransform(icon: PrimeIcon): string {
-	return PrimeIcons[icon];
-}
-
-export type IconPosTypes = 'right' | 'left';
-export function iconPosTransform(pos: IconPosTypes): string {
-	return 'p-input-icon-' + pos;
-}

package/ui/lib/src/input/value-accessor.directive.ts

@@ -1,27 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-vars */
-
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { Directive } from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-
-@Directive({
-	standalone: true,
-	providers: [
-		{
-			provide: NG_VALUE_ACCESSOR,
-			multi: true,
-			useExisting: ValueAccessorDirective
-		}
-	]
-})
-export class ValueAccessorDirective implements ControlValueAccessor {
-	writeValue(obj: any): void {
-		return;
-	}
-	registerOnChange(fn: any): void {
-		return;
-	}
-	registerOnTouched(fn: any): void {
-		return;
-	}
-}

package/ui/mask/ng-package.json

@@ -1,6 +0,0 @@
-{
-	"$schema": "../../../../node_modules/ng-packagr/ng-package.schema.json",
-	"lib": {
-		"entryFile": "./index.ts"
-	}
-}

package/ui/mask/src/mask.component.css

@@ -1,23 +0,0 @@
-.custom-tooltip {
-	position: absolute;
-	background-color: crimson;
-	color: white;
-	padding: 0.75rem 0.75rem;
-	border-radius: 6px;
-	z-index: 1001;
-	top: -107%;
-	left: 50%;
-	transform: translateX(-50%);
-	white-space: nowrap;
-}
-
-.custom-tooltip:before {
-	content: '';
-	position: absolute;
-	top: 100%;
-	left: 50%;
-	margin-left: -5px;
-	border-width: 3px;
-	border-style: solid;
-	border-color: var(--primary-color) transparent transparent transparent;
-}

package/ui/mask/src/mask.component.html

@@ -1,17 +0,0 @@
-<div style="position: relative" [ngStyle]="!usageInGrid ? { display: 'inline-block' } : {}">
-	<p-inputMask
-		[mask]="mask()"
-		[slotChar]="slotChar()"
-		[placeholder]="placeholder()"
-		[maxlength]="maxlength()"
-		[formControl]="ngControl.control"
-		(ngModelChange)="ngControl.viewToModelUpdate($event)"
-		(onFocus)="showTooltip = true"
-		(onBlur)="showTooltip = false">
-	</p-inputMask>
-	@if (ngControl.invalid && showTooltip) {
-		<div class="custom-tooltip tooltipErrorMessage">
-			{{ ngControl.control.value | inputErrorMessage: ngControl }}
-		</div>
-	}
-</div>