carriera-intern-components 0.0.7 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/app/components/document-preview/document-preview.component.d.ts +8 -1
- package/app/components/input/directives/mask.directive.d.ts +81 -0
- package/app/components/input/input.component.d.ts +23 -7
- package/app/components/input/models/input.model.d.ts +9 -1
- package/fesm2022/carriera-intern-components.mjs +330 -31
- package/fesm2022/carriera-intern-components.mjs.map +1 -1
- package/package.json +1 -1
- package/public/assets/examplelargeview.png +0 -0
- package/public/assets/icons/{PrimaryArrowUp.svg → cai-arrow-primary-up.svg} +1 -1
- package/public/assets/icons/cai-date.svg +3 -0
- package/public/assets/icons/cai-dislike.svg +3 -0
- package/public/assets/icons/cai-driver.svg +3 -0
- package/public/assets/icons/cai-edit.svg +4 -0
- package/public/assets/icons/cai-illustration-dark.svg +4 -0
- package/public/assets/icons/cai-illustration.svg +18 -0
- package/public/assets/icons/cai-like.svg +3 -0
- package/public/assets/icons/cai-money.svg +3 -0
- package/public/assets/icons/cai-phone.svg +3 -0
- package/public/assets/icons/cai-search.svg +3 -0
- package/public/assets/icons/cai-share.svg +3 -0
- package/public/assets/icons/cai-sort-by.svg +3 -0
- package/public/assets/icons/trailers/ic_trailer_bottom-dump.svg +2 -2
- package/public/assets/json/icons.json +194 -40
- package/public/assets/icons/Driver.svg +0 -3
- /package/public/assets/icons/{ArrowDown.svg → cai-arrow-secondary-down.svg} +0 -0
- /package/public/assets/icons/{ArrowLeft.svg → cai-arrow-secondary-left.svg} +0 -0
- /package/public/assets/icons/{ArrowRight.svg → cai-arrow-secondary-right.svg} +0 -0
- /package/public/assets/icons/{Cancel.svg → cai-cancel.svg} +0 -0
- /package/public/assets/icons/{Checkmark.svg → cai-checkmark.svg} +0 -0
- /package/public/assets/icons/{Delete.svg → cai-delete.svg} +0 -0
- /package/public/assets/icons/{Download.svg → cai-download.svg} +0 -0
- /package/public/assets/icons/{Email.svg → cai-email.svg} +0 -0
- /package/public/assets/icons/{drop-zone.svg → cai-illustration-drop-zone.svg} +0 -0
- /package/public/assets/icons/{Label.svg → cai-label.svg} +0 -0
- /package/public/assets/icons/{LTL.svg → cai-ltl-single.svg} +0 -0
- /package/public/assets/icons/{Minus.svg → cai-minus.svg} +0 -0
- /package/public/assets/icons/{PasswordHidden.svg → cai-password-hidden.svg} +0 -0
- /package/public/assets/icons/{PasswordKey.svg → cai-password-key.svg} +0 -0
- /package/public/assets/icons/{PasswordShown.svg → cai-password-shown.svg} +0 -0
- /package/public/assets/icons/{Plus.svg → cai-plus.svg} +0 -0
- /package/public/assets/icons/{Reset.svg → cai-reset.svg} +0 -0
- /package/public/assets/icons/{Warning.svg → cai-status-warning.svg} +0 -0
|
@@ -13,6 +13,12 @@ export declare class DocumentPreviewComponent {
|
|
|
13
13
|
* @type {InputSignal<AppFile>}
|
|
14
14
|
*/
|
|
15
15
|
file: import("@angular/core").InputSignal<AppFile>;
|
|
16
|
+
/**
|
|
17
|
+
* /**
|
|
18
|
+
* The view mode in whic the file is displayed. This is a required input.
|
|
19
|
+
* @type {InputSignal<string>}
|
|
20
|
+
*/
|
|
21
|
+
viewMode: import("@angular/core").InputSignal<string>;
|
|
16
22
|
/**
|
|
17
23
|
* An output event that emits the file name when the delete action is triggered.
|
|
18
24
|
* @type {OutputEmitterRef<string>}
|
|
@@ -47,6 +53,7 @@ export declare class DocumentPreviewComponent {
|
|
|
47
53
|
}>;
|
|
48
54
|
getTag(newTag: string): void;
|
|
49
55
|
removeTag(): void;
|
|
56
|
+
handleShare(): void;
|
|
50
57
|
static ɵfac: i0.ɵɵFactoryDeclaration<DocumentPreviewComponent, never>;
|
|
51
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DocumentPreviewComponent, "
|
|
58
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DocumentPreviewComponent, "cai-document-preview", never, { "file": { "alias": "file"; "required": true; "isSignal": true; }; "viewMode": { "alias": "viewMode"; "required": true; "isSignal": true; }; }, { "onDelete": "onDelete"; "onDownload": "onDownload"; "onTagChange": "onTagChange"; }, never, never, true, never>;
|
|
52
59
|
}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { ElementRef, OnInit } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class MaskDirective implements OnInit {
|
|
4
|
+
private el;
|
|
5
|
+
/**
|
|
6
|
+
* The mask pattern to apply.
|
|
7
|
+
* Placeholders:
|
|
8
|
+
* '0' - Digit (0-9)
|
|
9
|
+
* 'a' - Letter (a-z, A-Z)
|
|
10
|
+
* '*' - Alphanumeric (0-9, a-z, A-Z)
|
|
11
|
+
* @example '(000) 000-0000' for a phone number.
|
|
12
|
+
*/
|
|
13
|
+
appMask: import("@angular/core").InputSignal<string>;
|
|
14
|
+
/**
|
|
15
|
+
* Stores the unmasked, "real" value of the input, containing only
|
|
16
|
+
* the characters entered by the user that fit the mask placeholders.
|
|
17
|
+
*/
|
|
18
|
+
private realValue;
|
|
19
|
+
constructor(el: ElementRef<HTMLInputElement>);
|
|
20
|
+
ngOnInit(): void;
|
|
21
|
+
/**
|
|
22
|
+
* HostListener for the 'input' event. This is the primary handler for
|
|
23
|
+
* formatting the value as the user types or pastes.
|
|
24
|
+
*/
|
|
25
|
+
onInput(event: InputEvent): void;
|
|
26
|
+
/**
|
|
27
|
+
* HostListener for the 'paste' event. It intercepts pasted content,
|
|
28
|
+
* cleans it, and integrates it into the masked value.
|
|
29
|
+
*/
|
|
30
|
+
onPaste(event: ClipboardEvent): void;
|
|
31
|
+
/**
|
|
32
|
+
* HostListener for the 'copy' event. Ensures that copying a selection
|
|
33
|
+
* from the input copies the unmasked, "real" value.
|
|
34
|
+
*/
|
|
35
|
+
onCopy(event: ClipboardEvent): void;
|
|
36
|
+
/**
|
|
37
|
+
* HostListener for the 'cut' event. Ensures cutting a selection removes
|
|
38
|
+
* the corresponding part from the real value and reformats the input.
|
|
39
|
+
*/
|
|
40
|
+
onCut(event: ClipboardEvent): void;
|
|
41
|
+
/**
|
|
42
|
+
* HostListener for the 'keydown' event. It validates key presses against
|
|
43
|
+
* the mask pattern, preventing invalid characters from being entered.
|
|
44
|
+
*/
|
|
45
|
+
onKeydown(event: KeyboardEvent): void;
|
|
46
|
+
/**
|
|
47
|
+
* The core formatting logic. It takes a value, extracts the valid user
|
|
48
|
+
* input, applies the mask, updates the display, and dispatches the change.
|
|
49
|
+
* @param value The current value from the input field.
|
|
50
|
+
*/
|
|
51
|
+
private formatValue;
|
|
52
|
+
/**
|
|
53
|
+
* Applies the mask to a given string of user input.
|
|
54
|
+
* @param realValue The clean user input.
|
|
55
|
+
* @param mask The mask pattern.
|
|
56
|
+
* @returns An object with the formatted value and the final real value.
|
|
57
|
+
*/
|
|
58
|
+
private applyMask;
|
|
59
|
+
/**
|
|
60
|
+
* Extracts valid user input characters from a string.
|
|
61
|
+
* @param value The string to clean.
|
|
62
|
+
* @returns A string containing only valid mask characters (digits/letters).
|
|
63
|
+
*/
|
|
64
|
+
private extractUserInput;
|
|
65
|
+
private isPlaceholder;
|
|
66
|
+
private charMatchesPlaceholder;
|
|
67
|
+
private setCursorToEnd;
|
|
68
|
+
private dispatchRealValueChange;
|
|
69
|
+
/**
|
|
70
|
+
* Public method to get the current unmasked "real" value.
|
|
71
|
+
* @returns The real value as a string.
|
|
72
|
+
*/
|
|
73
|
+
getRealValue(): string;
|
|
74
|
+
/**
|
|
75
|
+
* Public method to set the "real" value from outside the directive.
|
|
76
|
+
* @param value The new value to set.
|
|
77
|
+
*/
|
|
78
|
+
setRealValue(value: string): void;
|
|
79
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MaskDirective, never>;
|
|
80
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<MaskDirective, "[appMask]", never, { "appMask": { "alias": "appMask"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
81
|
+
}
|
|
@@ -5,6 +5,7 @@ import { NumberFormatDirective } from '../../directives/number-format.directive'
|
|
|
5
5
|
import { NgbPopover } from '@ng-bootstrap/ng-bootstrap';
|
|
6
6
|
import { CaiInputConfig, DropdownOption } from './models/input.model';
|
|
7
7
|
import { Dispatch, DispatchBoard } from './models';
|
|
8
|
+
import { MaskDirective } from './directives/mask.directive';
|
|
8
9
|
import * as i0 from "@angular/core";
|
|
9
10
|
/**
|
|
10
11
|
* A reusable input component that integrates with Angular Forms and supports
|
|
@@ -16,17 +17,31 @@ export declare class InputComponent implements ControlValueAccessor {
|
|
|
16
17
|
ngControl: NgControl | null;
|
|
17
18
|
/**
|
|
18
19
|
* Defines the unique identifier for the input element.
|
|
19
|
-
* This ID is crucial for accessibility, linking the `<label>` to the
|
|
20
|
-
* native `<input>` via the `for` attribute.
|
|
21
20
|
* It is provided by the parent component as an Angular `input()` signal.
|
|
22
21
|
*/
|
|
23
22
|
id: import("@angular/core").InputSignal<string>;
|
|
24
23
|
/**
|
|
25
24
|
* Configuration object for the input's behavior and appearance.
|
|
26
|
-
*
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
25
|
+
* It is provided by the parent component as an Angular `input()` signal.
|
|
26
|
+
- `type`: HTML input type (`'text'`, `'password'`, `'number'`).
|
|
27
|
+
- `name`: The HTML `name` attribute.
|
|
28
|
+
- `required`: If `true`, the input is required for form submission.
|
|
29
|
+
- `alignment`: Text alignment within the input (`'left'` or `'right'`).
|
|
30
|
+
- `inverse`: If `true`, renders the input in a dark mode style.
|
|
31
|
+
- `reveal`: For password inputs, the number of characters to reveal from the end.
|
|
32
|
+
- `icon`: Name of an icon to display (e.g., `'cai-email'`).
|
|
33
|
+
- `iconColor`: Color of the displayed icon (e.g., `'#FF0000'`).
|
|
34
|
+
- `dropdown`: If `true`, the input is associated with a dropdown.
|
|
35
|
+
- `search`: Enables search within the dropdown.
|
|
36
|
+
- `add`: Enables 'add new' functionality in the dropdown.
|
|
37
|
+
- `dispatch`: If `true`, shows the dispatch modal as a dropdown.
|
|
38
|
+
- `placeholderBehavior`: Defines placeholder animation (`'dynamic'` , `'fade'`, `'static'`).
|
|
39
|
+
- `label`: An `aria-label` for accessibility.
|
|
40
|
+
- `mask`: A pattern string for input masking (e.g., `'(000) 000-0000'`).
|
|
41
|
+
- `min`: Minimum value for number inputs.
|
|
42
|
+
- `max`: Maximum value for number inputs or maximum length for text inputs.
|
|
43
|
+
- `withButtons`: If `true`, adds increment/decrement buttons for number inputs.
|
|
44
|
+
- `autocomplete`: The HTML `autocomplete` attribute.
|
|
30
45
|
*/
|
|
31
46
|
config: import("@angular/core").InputSignal<CaiInputConfig>;
|
|
32
47
|
/**
|
|
@@ -63,6 +78,7 @@ export declare class InputComponent implements ControlValueAccessor {
|
|
|
63
78
|
inputRef: ElementRef<HTMLInputElement>;
|
|
64
79
|
PasswordDirective: PasswordDirective;
|
|
65
80
|
NumberFormatDirective: NumberFormatDirective;
|
|
81
|
+
MaskDirective: MaskDirective;
|
|
66
82
|
dropdown: NgbPopover;
|
|
67
83
|
/**
|
|
68
84
|
* Constructor for the InputComponent.
|
|
@@ -247,7 +263,7 @@ export declare class InputComponent implements ControlValueAccessor {
|
|
|
247
263
|
dispatches: import("@angular/core").InputSignal<DispatchBoard[] | undefined>;
|
|
248
264
|
dispatchCount: import("@angular/core").Signal<number>;
|
|
249
265
|
filteredDispatches: import("@angular/core").Signal<DispatchBoard[]>;
|
|
250
|
-
|
|
266
|
+
handleDispatchOption(option: Dispatch, event: MouseEvent): void;
|
|
251
267
|
selectedDispatch: import("@angular/core").WritableSignal<Dispatch | null>;
|
|
252
268
|
foldedBoards: import("@angular/core").WritableSignal<number[]>;
|
|
253
269
|
fold(boardId: number, event: MouseEvent): void;
|
|
@@ -6,10 +6,18 @@ export interface CaiInputConfig {
|
|
|
6
6
|
inverse?: boolean;
|
|
7
7
|
reveal?: number;
|
|
8
8
|
icon?: string | null;
|
|
9
|
+
iconColor?: string;
|
|
9
10
|
dropdown?: boolean;
|
|
10
11
|
search?: boolean;
|
|
11
12
|
add?: boolean;
|
|
12
|
-
|
|
13
|
+
dispatch?: boolean;
|
|
14
|
+
placeholderBehavior?: 'dynamic' | 'fade' | 'static';
|
|
15
|
+
label?: string;
|
|
16
|
+
mask?: string;
|
|
17
|
+
min?: number;
|
|
18
|
+
max?: number;
|
|
19
|
+
withButtons?: boolean;
|
|
20
|
+
autocomplete?: string;
|
|
13
21
|
}
|
|
14
22
|
export type DropdownOption = {
|
|
15
23
|
id: string;
|