ps-helix 3.0.8 → 4.0.0
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/README.md +44 -35
- package/fesm2022/ps-helix.mjs +198 -321
- package/fesm2022/ps-helix.mjs.map +1 -1
- package/package.json +3 -3
- package/{index.d.ts → types/ps-helix.d.ts} +33 -44
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ps-helix",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"description": "Helix Design System - A comprehensive Angular component library",
|
|
5
5
|
"author": "Fabrice PEREZ - Product designer at PACK Solutions",
|
|
6
6
|
"license": "MIT",
|
|
@@ -35,13 +35,13 @@
|
|
|
35
35
|
"*.css"
|
|
36
36
|
],
|
|
37
37
|
"module": "fesm2022/ps-helix.mjs",
|
|
38
|
-
"typings": "
|
|
38
|
+
"typings": "types/ps-helix.d.ts",
|
|
39
39
|
"exports": {
|
|
40
40
|
"./package.json": {
|
|
41
41
|
"default": "./package.json"
|
|
42
42
|
},
|
|
43
43
|
".": {
|
|
44
|
-
"types": "./
|
|
44
|
+
"types": "./types/ps-helix.d.ts",
|
|
45
45
|
"default": "./fesm2022/ps-helix.mjs"
|
|
46
46
|
}
|
|
47
47
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
-
import { AfterContentChecked, OnDestroy, AfterContentInit, InjectionToken,
|
|
2
|
+
import { AfterContentChecked, OnDestroy, AfterContentInit, InjectionToken, AfterViewInit, EventEmitter, TemplateRef, Type } from '@angular/core';
|
|
3
3
|
import { ControlValueAccessor } from '@angular/forms';
|
|
4
|
+
import { FormCheckboxControl, FormValueControl } from '@angular/forms/signals';
|
|
4
5
|
import * as ps_helix from 'ps-helix';
|
|
5
6
|
import { Observable } from 'rxjs';
|
|
6
7
|
import { Router } from '@angular/router';
|
|
@@ -625,22 +626,17 @@ interface CheckboxConfig {
|
|
|
625
626
|
}
|
|
626
627
|
|
|
627
628
|
declare const CHECKBOX_CONFIG: InjectionToken<Partial<CheckboxConfig>>;
|
|
628
|
-
declare class PshCheckboxComponent implements ControlValueAccessor {
|
|
629
|
+
declare class PshCheckboxComponent implements ControlValueAccessor, FormCheckboxControl {
|
|
629
630
|
private config;
|
|
630
631
|
private uniqueId;
|
|
631
632
|
private checkboxInput;
|
|
632
633
|
private onChange;
|
|
633
634
|
private onTouched;
|
|
634
|
-
checked: _angular_core.
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
indeterminate: _angular_core.WritableSignal<boolean>;
|
|
639
|
-
set indeterminateInput(v: boolean);
|
|
635
|
+
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
636
|
+
readonly disabled: _angular_core.ModelSignal<boolean>;
|
|
637
|
+
readonly indeterminate: _angular_core.ModelSignal<boolean>;
|
|
638
|
+
touched: _angular_core.ModelSignal<boolean>;
|
|
640
639
|
required: _angular_core.InputSignal<boolean>;
|
|
641
|
-
checkedChange: EventEmitter<boolean>;
|
|
642
|
-
disabledChange: EventEmitter<boolean>;
|
|
643
|
-
indeterminateChange: EventEmitter<boolean>;
|
|
644
640
|
label: _angular_core.InputSignal<string>;
|
|
645
641
|
error: _angular_core.InputSignal<string>;
|
|
646
642
|
success: _angular_core.InputSignal<string>;
|
|
@@ -664,7 +660,7 @@ declare class PshCheckboxComponent implements ControlValueAccessor {
|
|
|
664
660
|
focus(): void;
|
|
665
661
|
blur(): void;
|
|
666
662
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshCheckboxComponent, never>;
|
|
667
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshCheckboxComponent, "psh-checkbox", never, { "
|
|
663
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshCheckboxComponent, "psh-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; "indeterminate": "indeterminateChange"; "touched": "touchedChange"; }, never, ["*"], true, never>;
|
|
668
664
|
}
|
|
669
665
|
|
|
670
666
|
/**
|
|
@@ -810,18 +806,17 @@ declare const INPUT_LABELS: {
|
|
|
810
806
|
readonly hidePassword: "Masquer le mot de passe";
|
|
811
807
|
};
|
|
812
808
|
|
|
813
|
-
declare class PshInputComponent implements ControlValueAccessor {
|
|
809
|
+
declare class PshInputComponent implements ControlValueAccessor, FormValueControl<string> {
|
|
814
810
|
private elementRef;
|
|
815
811
|
private cdr;
|
|
816
812
|
private destroyRef;
|
|
817
813
|
private static nextId;
|
|
818
814
|
readonly inputId: string;
|
|
819
|
-
value: _angular_core.
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
set disabledInput(v: boolean);
|
|
823
|
-
readonly: _angular_core.ModelSignal<boolean>;
|
|
815
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
816
|
+
readonly disabled: _angular_core.ModelSignal<boolean>;
|
|
817
|
+
readonly readonly: _angular_core.ModelSignal<boolean>;
|
|
824
818
|
loading: _angular_core.ModelSignal<boolean>;
|
|
819
|
+
touched: _angular_core.ModelSignal<boolean>;
|
|
825
820
|
variant: _angular_core.InputSignal<InputVariant>;
|
|
826
821
|
size: _angular_core.InputSignal<InputSize>;
|
|
827
822
|
fullWidth: _angular_core.InputSignal<boolean>;
|
|
@@ -845,8 +840,6 @@ declare class PshInputComponent implements ControlValueAccessor {
|
|
|
845
840
|
private passwordVisibleSignal;
|
|
846
841
|
private blurTimeoutId;
|
|
847
842
|
private debounceTimeoutId;
|
|
848
|
-
valueChange: EventEmitter<string>;
|
|
849
|
-
disabledChange: EventEmitter<boolean>;
|
|
850
843
|
inputFocus: _angular_core.OutputEmitterRef<void>;
|
|
851
844
|
inputBlur: _angular_core.OutputEmitterRef<void>;
|
|
852
845
|
suggestionSelect: _angular_core.OutputEmitterRef<string>;
|
|
@@ -862,9 +855,9 @@ declare class PshInputComponent implements ControlValueAccessor {
|
|
|
862
855
|
constructor();
|
|
863
856
|
private onChange;
|
|
864
857
|
private onTouched;
|
|
865
|
-
writeValue(value:
|
|
866
|
-
registerOnChange(fn:
|
|
867
|
-
registerOnTouched(fn:
|
|
858
|
+
writeValue(value: unknown): void;
|
|
859
|
+
registerOnChange(fn: (_: unknown) => void): void;
|
|
860
|
+
registerOnTouched(fn: () => void): void;
|
|
868
861
|
setDisabledState(isDisabled: boolean): void;
|
|
869
862
|
handleInput(event: Event): void;
|
|
870
863
|
handleFocus(): void;
|
|
@@ -873,11 +866,12 @@ declare class PshInputComponent implements ControlValueAccessor {
|
|
|
873
866
|
handleSuggestionClick(suggestion: string): void;
|
|
874
867
|
togglePasswordVisibility(): void;
|
|
875
868
|
protected hasLabelContent(): boolean;
|
|
869
|
+
focus(): void;
|
|
876
870
|
focusSelect(): void;
|
|
877
871
|
private debouncedUpdateSuggestions;
|
|
878
872
|
private updateSuggestions;
|
|
879
873
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshInputComponent, never>;
|
|
880
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshInputComponent, "psh-input", never, { "
|
|
874
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshInputComponent, "psh-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "iconStart": { "alias": "iconStart"; "required": false; "isSignal": true; }; "iconEnd": { "alias": "iconEnd"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "suggestions": { "alias": "suggestions"; "required": false; "isSignal": true; }; "autocompleteConfig": { "alias": "autocompleteConfig"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "readonly": "readonlyChange"; "loading": "loadingChange"; "touched": "touchedChange"; "inputFocus": "inputFocus"; "inputBlur": "inputBlur"; "suggestionSelect": "suggestionSelect"; }, never, ["[input-label]", "[input-error]", "[input-success]", "[input-hint]"], true, never>;
|
|
881
875
|
}
|
|
882
876
|
|
|
883
877
|
/**
|
|
@@ -1492,15 +1486,14 @@ interface SearchConfig {
|
|
|
1492
1486
|
minLength: number;
|
|
1493
1487
|
}
|
|
1494
1488
|
|
|
1495
|
-
declare class PshSelectComponent<T =
|
|
1489
|
+
declare class PshSelectComponent<T = unknown> implements ControlValueAccessor, FormValueControl<T | T[] | null>, AfterContentInit {
|
|
1496
1490
|
private elementRef;
|
|
1497
1491
|
private cdr;
|
|
1498
1492
|
private destroyRef;
|
|
1499
1493
|
readonly selectId: string;
|
|
1500
|
-
value: _angular_core.
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
set disabledInput(v: boolean);
|
|
1494
|
+
readonly value: _angular_core.ModelSignal<T | T[] | null>;
|
|
1495
|
+
readonly disabled: _angular_core.ModelSignal<boolean>;
|
|
1496
|
+
touched: _angular_core.ModelSignal<boolean>;
|
|
1504
1497
|
size: _angular_core.InputSignal<SelectSize>;
|
|
1505
1498
|
searchable: _angular_core.InputSignal<boolean>;
|
|
1506
1499
|
multiple: _angular_core.InputSignal<boolean>;
|
|
@@ -1527,8 +1520,6 @@ declare class PshSelectComponent<T = any> implements ControlValueAccessor, After
|
|
|
1527
1520
|
private hasLabelContentSignal;
|
|
1528
1521
|
private initializedSignal;
|
|
1529
1522
|
private activeDescendantId;
|
|
1530
|
-
valueChange: EventEmitter<T | T[] | null>;
|
|
1531
|
-
disabledChange: EventEmitter<boolean>;
|
|
1532
1523
|
opened: _angular_core.OutputEmitterRef<void>;
|
|
1533
1524
|
closed: _angular_core.OutputEmitterRef<void>;
|
|
1534
1525
|
scrollEnd: _angular_core.OutputEmitterRef<void>;
|
|
@@ -1553,13 +1544,14 @@ declare class PshSelectComponent<T = any> implements ControlValueAccessor, After
|
|
|
1553
1544
|
isFocused(option: SelectOption<T>): boolean;
|
|
1554
1545
|
private onChange;
|
|
1555
1546
|
private onTouched;
|
|
1556
|
-
writeValue(value:
|
|
1557
|
-
registerOnChange(fn:
|
|
1558
|
-
registerOnTouched(fn:
|
|
1547
|
+
writeValue(value: unknown): void;
|
|
1548
|
+
registerOnChange(fn: (_: unknown) => void): void;
|
|
1549
|
+
registerOnTouched(fn: () => void): void;
|
|
1559
1550
|
setDisabledState(isDisabled: boolean): void;
|
|
1560
1551
|
isOptionGroup(option: SelectOption<T> | SelectOptionGroup<T>): option is SelectOptionGroup<T>;
|
|
1561
1552
|
getOptionKey(option: SelectOption<T> | SelectOptionGroup<T>): string;
|
|
1562
1553
|
hasValue(): boolean;
|
|
1554
|
+
focus(): void;
|
|
1563
1555
|
focusSelect(): void;
|
|
1564
1556
|
select(option: SelectOption<T>): void;
|
|
1565
1557
|
isSelected(option: SelectOption<T>): boolean;
|
|
@@ -1571,7 +1563,7 @@ declare class PshSelectComponent<T = any> implements ControlValueAccessor, After
|
|
|
1571
1563
|
private updateSelectedLabel;
|
|
1572
1564
|
private flattenOptions;
|
|
1573
1565
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshSelectComponent<any>, never>;
|
|
1574
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshSelectComponent<any>, "psh-select", never, { "
|
|
1566
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshSelectComponent<any>, "psh-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "multiplePlaceholder": { "alias": "multiplePlaceholder"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "maxSelections": { "alias": "maxSelections"; "required": false; "isSignal": true; }; "minSelections": { "alias": "minSelections"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "searchConfig": { "alias": "searchConfig"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "touched": "touchedChange"; "opened": "opened"; "closed": "closed"; "scrollEnd": "scrollEnd"; "searched": "searched"; }, never, ["[select-label]", "[select-error]", "[select-success]", "[select-hint]"], true, never>;
|
|
1575
1567
|
}
|
|
1576
1568
|
|
|
1577
1569
|
/**
|
|
@@ -1835,18 +1827,15 @@ interface SwitchConfig {
|
|
|
1835
1827
|
}
|
|
1836
1828
|
|
|
1837
1829
|
declare const SWITCH_CONFIG: InjectionToken<Partial<SwitchConfig>>;
|
|
1838
|
-
declare class PshSwitchComponent implements ControlValueAccessor {
|
|
1830
|
+
declare class PshSwitchComponent implements ControlValueAccessor, FormCheckboxControl {
|
|
1839
1831
|
private config;
|
|
1840
1832
|
private uniqueId;
|
|
1841
1833
|
private switchInput;
|
|
1842
1834
|
private onChange;
|
|
1843
1835
|
private onTouched;
|
|
1844
|
-
checked: _angular_core.
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
set disabledInput(v: boolean);
|
|
1848
|
-
checkedChange: EventEmitter<boolean>;
|
|
1849
|
-
disabledChange: EventEmitter<boolean>;
|
|
1836
|
+
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
1837
|
+
readonly disabled: _angular_core.ModelSignal<boolean>;
|
|
1838
|
+
touched: _angular_core.ModelSignal<boolean>;
|
|
1850
1839
|
required: _angular_core.InputSignal<boolean>;
|
|
1851
1840
|
size: _angular_core.InputSignal<SwitchSize>;
|
|
1852
1841
|
labelPosition: _angular_core.InputSignal<"left" | "right">;
|
|
@@ -1854,7 +1843,7 @@ declare class PshSwitchComponent implements ControlValueAccessor {
|
|
|
1854
1843
|
error: _angular_core.InputSignal<string>;
|
|
1855
1844
|
success: _angular_core.InputSignal<string>;
|
|
1856
1845
|
ariaLabel: _angular_core.InputSignal<string | undefined>;
|
|
1857
|
-
name: _angular_core.InputSignal<string
|
|
1846
|
+
name: _angular_core.InputSignal<string>;
|
|
1858
1847
|
id: _angular_core.InputSignal<string>;
|
|
1859
1848
|
computedAriaLabel: _angular_core.Signal<string>;
|
|
1860
1849
|
errorId: _angular_core.Signal<string | null>;
|
|
@@ -1868,7 +1857,7 @@ declare class PshSwitchComponent implements ControlValueAccessor {
|
|
|
1868
1857
|
focus(): void;
|
|
1869
1858
|
blur(): void;
|
|
1870
1859
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<PshSwitchComponent, never>;
|
|
1871
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshSwitchComponent, "psh-switch", never, { "
|
|
1860
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PshSwitchComponent, "psh-switch", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; "touched": "touchedChange"; }, never, ["*"], true, never>;
|
|
1872
1861
|
}
|
|
1873
1862
|
|
|
1874
1863
|
/**
|