shirkasoft-ui-components 1.3.0 → 1.3.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "shirkasoft-ui-components",
-  "version": "1.3.0",
+  "version": "1.3.2",
   "description": "Angular UI Components Library — themeable via CSS custom properties",
   "keywords": [
     "angular",

package/types/shirkasoft-ui-components-file-upload.d.ts

@@ -1,10 +1,18 @@
 import * as _angular_core from '@angular/core';
+import { OnDestroy } from '@angular/core';
 
 interface FileUploadError {
     type: 'size' | 'type';
     message: string;
     file: File;
 }
+interface ExistingFile {
+    id?: number | string;
+    name: string;
+    url?: string;
+    mimeType?: string;
+    size?: number;
+}
 /**
  * Shirkasoft UI Components.
  * Authors: Roberto Valladares Martin (Ansem13), Julio César García García (Sanjuli14).
@@ -14,7 +22,7 @@ interface FileUploadError {
  * Drag & drop file uploader with file type/size validation, image previews,
  * multiple files support and localized error messages.
  */
-declare class FileUploadComponent {
+declare class FileUploadComponent implements OnDestroy {
     protected getIcon: (name: any) => any;
     private transloco;
     /** Main label of the uploader. */
@@ -33,6 +41,10 @@ declare class FileUploadComponent {
     changeFilesText: _angular_core.InputSignal<string>;
     /** Enables selecting more than one file at once. */
     multiple: _angular_core.InputSignal<boolean>;
+    /** Files already stored by the parent (read-only; the component only emits events). */
+    existingFiles: _angular_core.InputSignal<ExistingFile[]>;
+    /** How existing files are rendered. */
+    existingDisplay: _angular_core.InputSignal<"chips" | "tiles">;
     /** Emitted with the currently selected files. */
     fileSelected: _angular_core.OutputEmitterRef<File[]>;
     /** Emitted when the last selected file is removed. */
@@ -41,6 +53,10 @@ declare class FileUploadComponent {
     fileError: _angular_core.OutputEmitterRef<FileUploadError>;
     /** Emitted when a file is near the size limit. */
     fileWarning: _angular_core.OutputEmitterRef<FileUploadError>;
+    /** Emitted when an existing file is requested for download/view. */
+    existingFileAction: _angular_core.OutputEmitterRef<ExistingFile>;
+    /** Emitted when an existing file should be removed (parent deletes it). */
+    existingFileRemove: _angular_core.OutputEmitterRef<ExistingFile>;
     /** Currently selected files. */
     selectedFiles: _angular_core.WritableSignal<File[]>;
     /** Localized error message displayed to the user. */
@@ -77,11 +93,29 @@ declare class FileUploadComponent {
     changeFiles(): void;
     /** Revokes every stored preview object URL. */
     private clearPreviews;
+    /** Revokes pending preview URLs when the component is destroyed. */
+    ngOnDestroy(): void;
+    /** Emits the action (download/view) for an existing file. */
+    onExistingAction(file: ExistingFile): void;
+    /** Emits the removal request for an existing file. */
+    onExistingRemove(file: ExistingFile): void;
+    /** Whether an existing file is an image (by mime type or extension). */
+    isExistingImage(file: ExistingFile): boolean;
+    /** Resolves the extension of a file name. */
+    getExtension(name: string): string;
+    /** Icon + colored badge shown for non-image files, hinting at the type. */
+    getExistingBadge(file: ExistingFile): {
+        label: string;
+        color: string;
+        icon: string;
+    };
+    /** trackBy for existing files. */
+    trackExistingFile(file: ExistingFile): any;
     /** Human readable size (B/KB/MB). */
     private formatFileSize;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FileUploadComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FileUploadComponent, "shk-file-upload", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "maxFiles": { "alias": "maxFiles"; "required": false; "isSignal": true; }; "fileUploadText": { "alias": "fileUploadText"; "required": false; "isSignal": true; }; "fileRecommendation": { "alias": "fileRecommendation"; "required": false; "isSignal": true; }; "changeFilesText": { "alias": "changeFilesText"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; }, { "fileSelected": "fileSelected"; "fileRemoved": "fileRemoved"; "fileError": "fileError"; "fileWarning": "fileWarning"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FileUploadComponent, "shk-file-upload", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "maxFiles": { "alias": "maxFiles"; "required": false; "isSignal": true; }; "fileUploadText": { "alias": "fileUploadText"; "required": false; "isSignal": true; }; "fileRecommendation": { "alias": "fileRecommendation"; "required": false; "isSignal": true; }; "changeFilesText": { "alias": "changeFilesText"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "existingFiles": { "alias": "existingFiles"; "required": false; "isSignal": true; }; "existingDisplay": { "alias": "existingDisplay"; "required": false; "isSignal": true; }; }, { "fileSelected": "fileSelected"; "fileRemoved": "fileRemoved"; "fileError": "fileError"; "fileWarning": "fileWarning"; "existingFileAction": "existingFileAction"; "existingFileRemove": "existingFileRemove"; }, never, never, true, never>;
 }
 
 export { FileUploadComponent };
-export type { FileUploadError };
+export type { ExistingFile, FileUploadError };

package/types/shirkasoft-ui-components-price-input.d.ts

@@ -1,4 +1,5 @@
 import * as _angular_core from '@angular/core';
+import { ControlValueAccessor, FormControl } from '@angular/forms';
 
 /**
  * Shirkasoft UI Components.
@@ -6,13 +7,21 @@ import * as _angular_core from '@angular/core';
  * Belongs to Shirkasoft.
  */
 /**
- * Numeric input tailored for currency values with a optional percentage mode.
- * Uses two-way bindable models: `value` and `isPercentage`.
+ * Currency/percentage numeric input with reactive forms support.
+ *
+ * Binding modes (highest precedence first):
+ *  - `control`: a FormControl (or use it inside a form with `formControlName`).
+ *  - `value`/`valueChange` or `[(value)]`: two-way model signals.
+ *
+ * Text-based input (`type="text"` + `inputmode="decimal"`) with decimal
+ * precision control, min/max clamping on blur and thousands formatting.
  */
-declare class PriceInputComponent {
-    /** Numeric value, bindable with [(value)]. */
-    value: _angular_core.ModelSignal<number>;
-    /** Whether the input works as a percentage, bindable with [(isPercentage)]. */
+declare class PriceInputComponent implements ControlValueAccessor {
+    /** Reactive control. When provided it takes precedence over `value`/`valueChange`. */
+    control: _angular_core.InputSignal<FormControl<number | null> | undefined>;
+    /** Numeric value (two-way), used when no `control` is bound. */
+    value: _angular_core.ModelSignal<number | null>;
+    /** Whether the input works as a percentage (two-way). */
     isPercentage: _angular_core.ModelSignal<boolean>;
     /** Label displayed above the field. */
     label: _angular_core.InputSignal<string>;
@@ -22,20 +31,60 @@ declare class PriceInputComponent {
     required: _angular_core.InputSignal<boolean>;
     /** Disables the input. */
     disabled: _angular_core.InputSignal<boolean>;
-    /** Minimum allowed value. */
+    /** Minimum allowed value (clamped on blur). */
     min: _angular_core.InputSignal<number>;
-    /** Maximum allowed value. */
+    /** Maximum allowed value (clamped on blur). */
     max: _angular_core.InputSignal<number>;
+    /** Maximum number of decimal places (0 = integer). */
+    decimals: _angular_core.InputSignal<number>;
+    /** Symbol shown in the mode toggle button when not a percentage. */
+    currency: _angular_core.InputSignal<string>;
+    /** Placeholder text of the native input. */
+    placeholder: _angular_core.InputSignal<string>;
+    /** Accessible label; falls back to `label`. */
+    ariaLabel: _angular_core.InputSignal<string>;
+    /** Blocks the minus sign from being typed. */
+    preventNegative: _angular_core.InputSignal<boolean>;
     /** Shows the error styling on the field. */
     showError: _angular_core.InputSignal<boolean>;
     /** Message rendered when the field is in error state. */
     errorMessage: _angular_core.InputSignal<string>;
+    private destroyRef;
+    /** Text currently shown in the input (raw while focused, formatted on blur). */
+    displayText: _angular_core.WritableSignal<string>;
+    /** Whether the native input currently has focus. */
+    focused: _angular_core.WritableSignal<boolean>;
+    /** Disabled state coming from the reactive control. */
+    private controlDisabled;
+    /** Prevents re-subscribing to the same form control. */
+    private ctrlSubscribed;
+    /** Effective disabled state combining the input and the form binding. */
+    isDisabled: _angular_core.Signal<boolean>;
+    /** Callbacks used by the ControlValueAccessor contract. */
+    private onChange;
+    private onTouched;
+    constructor();
     /** Toggles between amount and percentage modes (unless disabled). */
     toggleMode(): void;
-    /** Parses the user input and updates the bound `value`. */
+    /** Selects the whole value on focus so the user can type over it. */
+    onFocus(event: FocusEvent): void;
+    /** Clamps, rounds and formats the value when the field loses focus. */
+    onBlur(): void;
+    /** Blocks characters that would break the numeric format. */
+    onKeydown(event: KeyboardEvent): void;
+    /** Sanitizes the raw input (digits + one separator + optional sign) and writes the value once. */
     onInput(event: Event): void;
+    /** Writes the value to the effective binding source. */
+    private setValue;
+    private roundTo;
+    /** Formats a number with thousands separator and up to `decimals` places. */
+    private formatNumber;
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<PriceInputComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PriceInputComponent, "shk-price-input", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "isPercentage": { "alias": "isPercentage"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "showError": { "alias": "showError"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "isPercentage": "isPercentageChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PriceInputComponent, "shk-price-input", never, { "control": { "alias": "control"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "isPercentage": { "alias": "isPercentage"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "decimals": { "alias": "decimals"; "required": false; "isSignal": true; }; "currency": { "alias": "currency"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "preventNegative": { "alias": "preventNegative"; "required": false; "isSignal": true; }; "showError": { "alias": "showError"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "isPercentage": "isPercentageChange"; }, never, never, true, never>;
 }
 
 export { PriceInputComponent };

package/types/shirkasoft-ui-components-timeline.d.ts

@@ -72,7 +72,7 @@ interface TimelineSubItemAction {
     isVisible?: (item: TimelineItem, subItem: TimelineSubItem) => boolean;
     isDisabled?: (item: TimelineItem, subItem: TimelineSubItem) => boolean;
 }
-type TimelineAlignment = 'left' | 'alternate';
+type TimelineAlignment = 'left' | 'alternate' | 'split';
 type TimelineMarkerSize = 'sm' | 'md' | 'lg';
 declare const DEFAULT_MARKER_GRADIENTS: string[];
 /** Supplier-type style palette used by the original wac-app timeline. */
@@ -86,7 +86,7 @@ declare class TimelineComponent {
     protected getIcon: (name: any) => any;
     /** Timeline data. */
     items: _angular_core.InputSignal<TimelineItem[]>;
-    /** 'left' = line and markers on the left; 'alternate' = cards alternate around a centered line on lg+. */
+    /** 'left' = line and markers on the left; 'alternate' = cards alternate around a centered line on lg+; 'split' = markers centered with days on the left and activities on the right. */
     alignment: _angular_core.InputSignal<TimelineAlignment>;
     /** Shows/hides the vertical connector line. */
     showLine: _angular_core.InputSignal<boolean>;