@kksdev/ds-angular 1.2.4 → 1.3.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/fesm2022/kksdev-ds-angular.mjs +1060 -39
- package/fesm2022/kksdev-ds-angular.mjs.map +1 -1
- package/index.d.ts +353 -3
- package/package.json +2 -2
- package/src/styles/themes/_custom.scss +297 -0
- package/src/styles/themes/_dark.scss +227 -0
- package/src/styles/themes/_light.scss +227 -0
- package/src/styles/tokens/_primitives.scss +2 -0
- package/src/styles/tokens/_semantic.scss +144 -0
- package/src/styles/tokens/_tokens.scss +109 -0
package/index.d.ts
CHANGED
|
@@ -4084,6 +4084,10 @@ interface DateRange {
|
|
|
4084
4084
|
start: Date | null;
|
|
4085
4085
|
end: Date | null;
|
|
4086
4086
|
}
|
|
4087
|
+
interface DatePreset {
|
|
4088
|
+
label: string;
|
|
4089
|
+
getValue: () => DateRange;
|
|
4090
|
+
}
|
|
4087
4091
|
/**
|
|
4088
4092
|
* DsDatePicker - Composant de sélection de date
|
|
4089
4093
|
*
|
|
@@ -4122,6 +4126,12 @@ declare class DsDatePicker implements ControlValueAccessor, OnInit {
|
|
|
4122
4126
|
readonly prevMonthLabel: _angular_core.InputSignal<string>;
|
|
4123
4127
|
/** Label bouton mois suivant */
|
|
4124
4128
|
readonly nextMonthLabel: _angular_core.InputSignal<string>;
|
|
4129
|
+
/** Presets pour le mode range */
|
|
4130
|
+
readonly presets: _angular_core.InputSignal<DatePreset[]>;
|
|
4131
|
+
/** Afficher les presets */
|
|
4132
|
+
readonly showPresets: _angular_core.InputSignal<boolean>;
|
|
4133
|
+
/** Activer le preview au survol en mode range */
|
|
4134
|
+
readonly showRangePreview: _angular_core.InputSignal<boolean>;
|
|
4125
4135
|
/** Événement de changement de date (mode single) */
|
|
4126
4136
|
readonly dateChange: _angular_core.OutputEmitterRef<Date | null>;
|
|
4127
4137
|
/** Événement de changement de range */
|
|
@@ -4142,6 +4152,7 @@ declare class DsDatePicker implements ControlValueAccessor, OnInit {
|
|
|
4142
4152
|
readonly rangeEnd: _angular_core.WritableSignal<Date | null>;
|
|
4143
4153
|
readonly showMonthPicker: _angular_core.WritableSignal<boolean>;
|
|
4144
4154
|
readonly showYearPicker: _angular_core.WritableSignal<boolean>;
|
|
4155
|
+
readonly hoveredDate: _angular_core.WritableSignal<Date | null>;
|
|
4145
4156
|
/** Callbacks CVA */
|
|
4146
4157
|
private onChange;
|
|
4147
4158
|
private onTouched;
|
|
@@ -4164,6 +4175,12 @@ declare class DsDatePicker implements ControlValueAccessor, OnInit {
|
|
|
4164
4175
|
private isRangeStartDate;
|
|
4165
4176
|
private isRangeEndDate;
|
|
4166
4177
|
private isDateInRange;
|
|
4178
|
+
private isDateInPreviewRange;
|
|
4179
|
+
onDayMouseEnter(date: Date | null): void;
|
|
4180
|
+
onDayMouseLeave(): void;
|
|
4181
|
+
selectPreset(preset: DatePreset): void;
|
|
4182
|
+
/** Presets effectifs (utilise les presets fournis ou les défauts) */
|
|
4183
|
+
readonly effectivePresets: _angular_core.Signal<DatePreset[]>;
|
|
4167
4184
|
private isDateDisabled;
|
|
4168
4185
|
private isSameDay;
|
|
4169
4186
|
private formatDateForAria;
|
|
@@ -4172,7 +4189,7 @@ declare class DsDatePicker implements ControlValueAccessor, OnInit {
|
|
|
4172
4189
|
registerOnTouched(fn: () => void): void;
|
|
4173
4190
|
setDisabledState(isDisabled: boolean): void;
|
|
4174
4191
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsDatePicker, never>;
|
|
4175
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsDatePicker, "ds-date-picker", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "showTodayButton": { "alias": "showTodayButton"; "required": false; "isSignal": true; }; "showClearButton": { "alias": "showClearButton"; "required": false; "isSignal": true; }; "todayLabel": { "alias": "todayLabel"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "prevMonthLabel": { "alias": "prevMonthLabel"; "required": false; "isSignal": true; }; "nextMonthLabel": { "alias": "nextMonthLabel"; "required": false; "isSignal": true; }; }, { "dateChange": "dateChange"; "rangeChange": "rangeChange"; }, never, never, true, never>;
|
|
4192
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsDatePicker, "ds-date-picker", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "showTodayButton": { "alias": "showTodayButton"; "required": false; "isSignal": true; }; "showClearButton": { "alias": "showClearButton"; "required": false; "isSignal": true; }; "todayLabel": { "alias": "todayLabel"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "prevMonthLabel": { "alias": "prevMonthLabel"; "required": false; "isSignal": true; }; "nextMonthLabel": { "alias": "nextMonthLabel"; "required": false; "isSignal": true; }; "presets": { "alias": "presets"; "required": false; "isSignal": true; }; "showPresets": { "alias": "showPresets"; "required": false; "isSignal": true; }; "showRangePreview": { "alias": "showRangePreview"; "required": false; "isSignal": true; }; }, { "dateChange": "dateChange"; "rangeChange": "rangeChange"; }, never, never, true, never>;
|
|
4176
4193
|
}
|
|
4177
4194
|
interface CalendarDay {
|
|
4178
4195
|
date: Date;
|
|
@@ -4183,6 +4200,7 @@ interface CalendarDay {
|
|
|
4183
4200
|
isRangeStart: boolean;
|
|
4184
4201
|
isRangeEnd: boolean;
|
|
4185
4202
|
isInRange: boolean;
|
|
4203
|
+
isInPreviewRange: boolean;
|
|
4186
4204
|
isDisabled: boolean;
|
|
4187
4205
|
ariaLabel: string;
|
|
4188
4206
|
}
|
|
@@ -4316,6 +4334,338 @@ declare class DsMenu implements OnDestroy {
|
|
|
4316
4334
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsMenu, "ds-menu", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "trigger": { "alias": "trigger"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "itemSelected": "itemSelected"; "opened": "opened"; "closed": "closed"; }, never, ["[dsMenuTrigger]"], true, never>;
|
|
4317
4335
|
}
|
|
4318
4336
|
|
|
4337
|
+
type ChipVariant = 'filled' | 'outlined';
|
|
4338
|
+
type ChipSize = 'sm' | 'md' | 'lg';
|
|
4339
|
+
type ChipColor = 'default' | 'primary' | 'success' | 'warning' | 'error';
|
|
4340
|
+
/**
|
|
4341
|
+
* Design System Chip component
|
|
4342
|
+
*
|
|
4343
|
+
* @example
|
|
4344
|
+
* ```html
|
|
4345
|
+
* <ds-chip label="Tag" />
|
|
4346
|
+
* <ds-chip label="Removable" [removable]="true" (removed)="onRemove()" />
|
|
4347
|
+
* <ds-chip label="Clickable" [clickable]="true" (clicked)="onClick()" />
|
|
4348
|
+
* <ds-chip label="With icon" icon="fas-star" />
|
|
4349
|
+
* ```
|
|
4350
|
+
*/
|
|
4351
|
+
declare class DsChip {
|
|
4352
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
4353
|
+
readonly variant: _angular_core.InputSignal<ChipVariant>;
|
|
4354
|
+
readonly size: _angular_core.InputSignal<ChipSize>;
|
|
4355
|
+
readonly color: _angular_core.InputSignal<ChipColor>;
|
|
4356
|
+
readonly removable: _angular_core.InputSignal<boolean>;
|
|
4357
|
+
readonly clickable: _angular_core.InputSignal<boolean>;
|
|
4358
|
+
readonly selected: _angular_core.InputSignal<boolean>;
|
|
4359
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
4360
|
+
readonly icon: _angular_core.InputSignal<string>;
|
|
4361
|
+
readonly avatar: _angular_core.InputSignal<string>;
|
|
4362
|
+
readonly removed: _angular_core.OutputEmitterRef<void>;
|
|
4363
|
+
readonly clicked: _angular_core.OutputEmitterRef<void>;
|
|
4364
|
+
readonly selectedChange: _angular_core.OutputEmitterRef<boolean>;
|
|
4365
|
+
readonly isSelected: _angular_core.WritableSignal<boolean>;
|
|
4366
|
+
readonly closeIcon: IconDefinition;
|
|
4367
|
+
readonly chipClasses: _angular_core.Signal<string>;
|
|
4368
|
+
readonly role: _angular_core.Signal<"button" | null>;
|
|
4369
|
+
readonly tabindex: _angular_core.Signal<0 | -1 | null>;
|
|
4370
|
+
readonly ariaSelected: _angular_core.Signal<boolean | null>;
|
|
4371
|
+
readonly ariaDisabled: _angular_core.Signal<true | null>;
|
|
4372
|
+
/**
|
|
4373
|
+
* Handle chip click
|
|
4374
|
+
*/
|
|
4375
|
+
handleClick(event: MouseEvent): void;
|
|
4376
|
+
/**
|
|
4377
|
+
* Handle remove button click
|
|
4378
|
+
*/
|
|
4379
|
+
handleRemove(event: MouseEvent): void;
|
|
4380
|
+
/**
|
|
4381
|
+
* Handle keyboard events
|
|
4382
|
+
*/
|
|
4383
|
+
handleKeyDown(event: KeyboardEvent): void;
|
|
4384
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsChip, never>;
|
|
4385
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsChip, "ds-chip", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "removable": { "alias": "removable"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "avatar": { "alias": "avatar"; "required": false; "isSignal": true; }; }, { "removed": "removed"; "clicked": "clicked"; "selectedChange": "selectedChange"; }, never, never, true, never>;
|
|
4386
|
+
}
|
|
4387
|
+
|
|
4388
|
+
type SliderSize = 'sm' | 'md' | 'lg';
|
|
4389
|
+
type SliderValue = number | [number, number];
|
|
4390
|
+
type SliderOrientation = 'horizontal' | 'vertical';
|
|
4391
|
+
declare class DsSlider implements ControlValueAccessor {
|
|
4392
|
+
min: _angular_core.InputSignal<number>;
|
|
4393
|
+
max: _angular_core.InputSignal<number>;
|
|
4394
|
+
step: _angular_core.InputSignal<number>;
|
|
4395
|
+
disabled: _angular_core.InputSignal<boolean>;
|
|
4396
|
+
size: _angular_core.InputSignal<SliderSize>;
|
|
4397
|
+
range: _angular_core.InputSignal<boolean>;
|
|
4398
|
+
orientation: _angular_core.InputSignal<SliderOrientation>;
|
|
4399
|
+
showLabels: _angular_core.InputSignal<boolean>;
|
|
4400
|
+
showTicks: _angular_core.InputSignal<boolean>;
|
|
4401
|
+
tickInterval: _angular_core.InputSignal<number | undefined>;
|
|
4402
|
+
formatLabel: _angular_core.InputSignal<((value: number) => string) | undefined>;
|
|
4403
|
+
valueChange: _angular_core.OutputEmitterRef<SliderValue>;
|
|
4404
|
+
trackElement?: ElementRef<HTMLDivElement>;
|
|
4405
|
+
thumb1Element?: ElementRef<HTMLDivElement>;
|
|
4406
|
+
thumb2Element?: ElementRef<HTMLDivElement>;
|
|
4407
|
+
private readonly disabledState;
|
|
4408
|
+
readonly internalValue: _angular_core.WritableSignal<SliderValue>;
|
|
4409
|
+
readonly dragging: _angular_core.WritableSignal<number | null>;
|
|
4410
|
+
readonly focusedThumb: _angular_core.WritableSignal<number>;
|
|
4411
|
+
constructor();
|
|
4412
|
+
readonly isDisabled: _angular_core.Signal<boolean>;
|
|
4413
|
+
readonly isRange: _angular_core.Signal<boolean>;
|
|
4414
|
+
readonly isVertical: _angular_core.Signal<boolean>;
|
|
4415
|
+
readonly containerClasses: _angular_core.Signal<string>;
|
|
4416
|
+
readonly value1: _angular_core.Signal<number>;
|
|
4417
|
+
readonly value2: _angular_core.Signal<number>;
|
|
4418
|
+
readonly percentage1: _angular_core.Signal<number>;
|
|
4419
|
+
readonly percentage2: _angular_core.Signal<number>;
|
|
4420
|
+
readonly thumb1Style: _angular_core.Signal<{
|
|
4421
|
+
bottom: string;
|
|
4422
|
+
left?: undefined;
|
|
4423
|
+
} | {
|
|
4424
|
+
left: string;
|
|
4425
|
+
bottom?: undefined;
|
|
4426
|
+
}>;
|
|
4427
|
+
readonly thumb2Style: _angular_core.Signal<{
|
|
4428
|
+
bottom?: undefined;
|
|
4429
|
+
left?: undefined;
|
|
4430
|
+
} | {
|
|
4431
|
+
bottom: string;
|
|
4432
|
+
left?: undefined;
|
|
4433
|
+
} | {
|
|
4434
|
+
left: string;
|
|
4435
|
+
bottom?: undefined;
|
|
4436
|
+
}>;
|
|
4437
|
+
readonly fillStyle: _angular_core.Signal<{
|
|
4438
|
+
bottom: string;
|
|
4439
|
+
height: string;
|
|
4440
|
+
left?: undefined;
|
|
4441
|
+
width?: undefined;
|
|
4442
|
+
} | {
|
|
4443
|
+
left: string;
|
|
4444
|
+
width: string;
|
|
4445
|
+
bottom?: undefined;
|
|
4446
|
+
height?: undefined;
|
|
4447
|
+
}>;
|
|
4448
|
+
readonly ticks: _angular_core.Signal<number[]>;
|
|
4449
|
+
readonly label1: _angular_core.Signal<string>;
|
|
4450
|
+
readonly label2: _angular_core.Signal<string>;
|
|
4451
|
+
private onChange;
|
|
4452
|
+
private onTouched;
|
|
4453
|
+
writeValue(value: SliderValue | null): void;
|
|
4454
|
+
registerOnChange(fn: (value: SliderValue) => void): void;
|
|
4455
|
+
registerOnTouched(fn: () => void): void;
|
|
4456
|
+
setDisabledState(isDisabled: boolean): void;
|
|
4457
|
+
private valueToPercentage;
|
|
4458
|
+
private percentageToValue;
|
|
4459
|
+
private clampValue;
|
|
4460
|
+
private emitValue;
|
|
4461
|
+
onKeyDown(event: KeyboardEvent, thumbIndex: number): void;
|
|
4462
|
+
onTrackClick(event: MouseEvent): void;
|
|
4463
|
+
onThumbMouseDown(event: MouseEvent, thumbIndex: number): void;
|
|
4464
|
+
private onMouseMove;
|
|
4465
|
+
onThumbFocus(thumbIndex: number): void;
|
|
4466
|
+
onThumbBlur(): void;
|
|
4467
|
+
getTickPosition(value: number): number;
|
|
4468
|
+
getTickLabel(value: number): string;
|
|
4469
|
+
getAriaValueText(thumbIndex: number): string;
|
|
4470
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsSlider, never>;
|
|
4471
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsSlider, "ds-slider", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "range": { "alias": "range"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "showLabels": { "alias": "showLabels"; "required": false; "isSignal": true; }; "showTicks": { "alias": "showTicks"; "required": false; "isSignal": true; }; "tickInterval": { "alias": "tickInterval"; "required": false; "isSignal": true; }; "formatLabel": { "alias": "formatLabel"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
|
|
4472
|
+
}
|
|
4473
|
+
|
|
4474
|
+
/**
|
|
4475
|
+
* Tailles disponibles pour le composant file upload.
|
|
4476
|
+
*/
|
|
4477
|
+
type FileUploadSize = 'sm' | 'md' | 'lg';
|
|
4478
|
+
/**
|
|
4479
|
+
* Représente un fichier avec son état de chargement.
|
|
4480
|
+
*/
|
|
4481
|
+
interface UploadFile {
|
|
4482
|
+
file: File;
|
|
4483
|
+
preview?: string;
|
|
4484
|
+
progress: number;
|
|
4485
|
+
error?: string;
|
|
4486
|
+
}
|
|
4487
|
+
/**
|
|
4488
|
+
* # DsFileUpload
|
|
4489
|
+
*
|
|
4490
|
+
* Composant de téléchargement de fichiers avec support drag & drop,
|
|
4491
|
+
* validation, preview et barre de progression.
|
|
4492
|
+
*
|
|
4493
|
+
* ## Usage
|
|
4494
|
+
*
|
|
4495
|
+
* ```html
|
|
4496
|
+
* <!-- Upload simple -->
|
|
4497
|
+
* <ds-file-upload
|
|
4498
|
+
* [accept]="'image/*'"
|
|
4499
|
+
* [maxFileSize]="5242880"
|
|
4500
|
+
* (filesChange)="onFilesChange($event)">
|
|
4501
|
+
* </ds-file-upload>
|
|
4502
|
+
*
|
|
4503
|
+
* <!-- Upload multiple avec preview -->
|
|
4504
|
+
* <ds-file-upload
|
|
4505
|
+
* [multiple]="true"
|
|
4506
|
+
* [showPreview]="true"
|
|
4507
|
+
* [maxFiles]="5"
|
|
4508
|
+
* size="lg">
|
|
4509
|
+
* </ds-file-upload>
|
|
4510
|
+
* ```
|
|
4511
|
+
*
|
|
4512
|
+
* ## Accessibilité
|
|
4513
|
+
*
|
|
4514
|
+
* - Input natif avec label accessible
|
|
4515
|
+
* - Drag & drop avec feedback ARIA
|
|
4516
|
+
* - Messages d'erreur associés via aria-describedby
|
|
4517
|
+
*
|
|
4518
|
+
* @component
|
|
4519
|
+
*/
|
|
4520
|
+
declare class DsFileUpload implements ControlValueAccessor {
|
|
4521
|
+
/**
|
|
4522
|
+
* Types de fichiers acceptés (ex: 'image/*,.pdf').
|
|
4523
|
+
* @default '*'
|
|
4524
|
+
*/
|
|
4525
|
+
accept: _angular_core.InputSignal<string>;
|
|
4526
|
+
/**
|
|
4527
|
+
* Taille maximale d'un fichier en bytes.
|
|
4528
|
+
* @default 10485760 (10 MB)
|
|
4529
|
+
*/
|
|
4530
|
+
maxFileSize: _angular_core.InputSignal<number>;
|
|
4531
|
+
/**
|
|
4532
|
+
* Nombre maximum de fichiers.
|
|
4533
|
+
* @default 1
|
|
4534
|
+
*/
|
|
4535
|
+
maxFiles: _angular_core.InputSignal<number>;
|
|
4536
|
+
/**
|
|
4537
|
+
* Permet la sélection multiple de fichiers.
|
|
4538
|
+
* @default false
|
|
4539
|
+
*/
|
|
4540
|
+
multiple: _angular_core.InputSignal<boolean>;
|
|
4541
|
+
/**
|
|
4542
|
+
* Désactive le composant.
|
|
4543
|
+
* @default false
|
|
4544
|
+
*/
|
|
4545
|
+
disabled: _angular_core.InputSignal<boolean>;
|
|
4546
|
+
/**
|
|
4547
|
+
* Taille du composant.
|
|
4548
|
+
* @default 'md'
|
|
4549
|
+
*/
|
|
4550
|
+
size: _angular_core.InputSignal<FileUploadSize>;
|
|
4551
|
+
/**
|
|
4552
|
+
* Affiche une preview pour les images.
|
|
4553
|
+
* @default true
|
|
4554
|
+
*/
|
|
4555
|
+
showPreview: _angular_core.InputSignal<boolean>;
|
|
4556
|
+
/**
|
|
4557
|
+
* Label personnalisé pour le bouton.
|
|
4558
|
+
*/
|
|
4559
|
+
label: _angular_core.InputSignal<string>;
|
|
4560
|
+
/**
|
|
4561
|
+
* Texte d'aide pour le drag & drop.
|
|
4562
|
+
*/
|
|
4563
|
+
dragHelpText: _angular_core.InputSignal<string>;
|
|
4564
|
+
/**
|
|
4565
|
+
* Événement émis lors du changement de fichiers.
|
|
4566
|
+
*/
|
|
4567
|
+
filesChange: _angular_core.OutputEmitterRef<File[]>;
|
|
4568
|
+
/**
|
|
4569
|
+
* Événement émis lors de la suppression d'un fichier.
|
|
4570
|
+
*/
|
|
4571
|
+
fileRemoved: _angular_core.OutputEmitterRef<File>;
|
|
4572
|
+
/**
|
|
4573
|
+
* Événement émis lors de la progression de l'upload.
|
|
4574
|
+
*/
|
|
4575
|
+
uploadProgress: _angular_core.OutputEmitterRef<{
|
|
4576
|
+
file: File;
|
|
4577
|
+
progress: number;
|
|
4578
|
+
}>;
|
|
4579
|
+
readonly faCloudArrowUp: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4580
|
+
readonly faXmark: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4581
|
+
readonly faFile: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4582
|
+
readonly faFileImage: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4583
|
+
readonly faFilePdf: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4584
|
+
readonly faFileWord: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4585
|
+
readonly faFileExcel: _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4586
|
+
readonly fileInput: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
|
|
4587
|
+
readonly files: _angular_core.WritableSignal<UploadFile[]>;
|
|
4588
|
+
readonly isDragging: _angular_core.WritableSignal<boolean>;
|
|
4589
|
+
readonly errorMessage: _angular_core.WritableSignal<string>;
|
|
4590
|
+
private onChange;
|
|
4591
|
+
private onTouched;
|
|
4592
|
+
/**
|
|
4593
|
+
* Classes CSS calculées pour le conteneur (public pour tests).
|
|
4594
|
+
*/
|
|
4595
|
+
readonly containerClasses: _angular_core.Signal<string[]>;
|
|
4596
|
+
/**
|
|
4597
|
+
* Nombre de fichiers actuellement sélectionnés (public pour tests).
|
|
4598
|
+
*/
|
|
4599
|
+
readonly fileCount: _angular_core.Signal<number>;
|
|
4600
|
+
/**
|
|
4601
|
+
* Vérifie si la limite de fichiers est atteinte (public pour tests).
|
|
4602
|
+
*/
|
|
4603
|
+
readonly isMaxFilesReached: _angular_core.Signal<boolean>;
|
|
4604
|
+
/**
|
|
4605
|
+
* Ouvre le sélecteur de fichiers.
|
|
4606
|
+
*/
|
|
4607
|
+
openFileSelector(): void;
|
|
4608
|
+
/**
|
|
4609
|
+
* Gère la sélection de fichiers via l'input.
|
|
4610
|
+
*/
|
|
4611
|
+
onFileSelect(event: Event): void;
|
|
4612
|
+
/**
|
|
4613
|
+
* Gère le début du drag.
|
|
4614
|
+
*/
|
|
4615
|
+
onDragEnter(event: DragEvent): void;
|
|
4616
|
+
/**
|
|
4617
|
+
* Gère le survol pendant le drag.
|
|
4618
|
+
*/
|
|
4619
|
+
onDragOver(event: DragEvent): void;
|
|
4620
|
+
/**
|
|
4621
|
+
* Gère la sortie du drag.
|
|
4622
|
+
*/
|
|
4623
|
+
onDragLeave(event: DragEvent): void;
|
|
4624
|
+
/**
|
|
4625
|
+
* Gère le drop des fichiers.
|
|
4626
|
+
*/
|
|
4627
|
+
onDrop(event: DragEvent): void;
|
|
4628
|
+
/**
|
|
4629
|
+
* Traite les fichiers sélectionnés ou déposés.
|
|
4630
|
+
*/
|
|
4631
|
+
private handleFiles;
|
|
4632
|
+
/**
|
|
4633
|
+
* Valide un fichier (taille, type).
|
|
4634
|
+
*/
|
|
4635
|
+
private validateFile;
|
|
4636
|
+
/**
|
|
4637
|
+
* Génère une preview pour les images.
|
|
4638
|
+
*/
|
|
4639
|
+
private generatePreview;
|
|
4640
|
+
/**
|
|
4641
|
+
* Simule l'upload avec progression (pour démonstration).
|
|
4642
|
+
* Dans une vraie application, remplacer par un vrai upload HTTP.
|
|
4643
|
+
*/
|
|
4644
|
+
private simulateUpload;
|
|
4645
|
+
/**
|
|
4646
|
+
* Retire un fichier de la liste.
|
|
4647
|
+
*/
|
|
4648
|
+
removeFile(uploadFile: UploadFile): void;
|
|
4649
|
+
/**
|
|
4650
|
+
* Notifie le changement de valeur.
|
|
4651
|
+
*/
|
|
4652
|
+
private notifyChange;
|
|
4653
|
+
/**
|
|
4654
|
+
* Retourne l'icône appropriée pour le type de fichier (public pour tests).
|
|
4655
|
+
*/
|
|
4656
|
+
getFileIcon(file: File): _fortawesome_fontawesome_common_types.IconDefinition;
|
|
4657
|
+
/**
|
|
4658
|
+
* Formate la taille du fichier en MB ou KB (public pour tests).
|
|
4659
|
+
*/
|
|
4660
|
+
formatFileSize(bytes: number): string;
|
|
4661
|
+
writeValue(value: File[] | null): void;
|
|
4662
|
+
registerOnChange(fn: (value: File[] | null) => void): void;
|
|
4663
|
+
registerOnTouched(fn: () => void): void;
|
|
4664
|
+
setDisabledState(isDisabled: boolean): void;
|
|
4665
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsFileUpload, never>;
|
|
4666
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DsFileUpload, "ds-file-upload", never, { "accept": { "alias": "accept"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "maxFiles": { "alias": "maxFiles"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showPreview": { "alias": "showPreview"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "dragHelpText": { "alias": "dragHelpText"; "required": false; "isSignal": true; }; }, { "filesChange": "filesChange"; "fileRemoved": "fileRemoved"; "uploadProgress": "uploadProgress"; }, never, never, true, never>;
|
|
4667
|
+
}
|
|
4668
|
+
|
|
4319
4669
|
/**
|
|
4320
4670
|
* Positions standard pour dropdowns (menus déroulants, select, etc.)
|
|
4321
4671
|
*
|
|
@@ -4684,5 +5034,5 @@ declare class DsI18nService {
|
|
|
4684
5034
|
static ɵprov: _angular_core.ɵɵInjectableDeclaration<DsI18nService>;
|
|
4685
5035
|
}
|
|
4686
5036
|
|
|
4687
|
-
export { AUTOCOMPLETE_POSITIONS, BUTTON_APPEARANCE_OPTIONS, BUTTON_SIZE_OPTIONS, BUTTON_VARIANT_OPTIONS, DROPDOWN_POSITIONS, DsAccordion, DsAlert, DsAvatar, DsBadge, DsBreadcrumb, DsButton, DsCard, DsCheckbox, DsCombobox, DsContainer, DsDatePicker, DsDivider, DsDropdown, DsI18nService, DsInputField, DsInputTextarea, DsMenu, DsModalComponent, DsPagination, DsPopover, DsPopoverComponent, DsProgressBar, DsRadioGroup, DsSearchInput, DsSelect, DsSkeleton, DsStepper, DsTable, DsTabs, DsToastComponent, DsToastContainerComponent, DsToastService, DsToggle, DsTooltip, DsTooltipComponent, IconRegistryService, POPOVER_POSITIONS, PrimitiveBadge, PrimitiveButton, PrimitiveCheckbox, PrimitiveInput, PrimitiveRadio, PrimitiveTextarea, PrimitiveToggle, TOOLTIP_POSITIONS, buildButtonArgTypes, buildButtonArgs, createSizeRender, createVariantRender };
|
|
4688
|
-
export type { AccordionChangeEvent, AccordionItem, AccordionSize, AccordionVariant, AlertSize, AlertType, AvatarShape, AvatarSize, BadgeAppearance, BadgeShape, BadgeSize, BadgeType, BadgeVariant, BreadcrumbItem, ButtonAppearance, ButtonSize, ButtonType, ButtonVariant, CardSize, CardVariant, CheckboxSize, CheckboxState, ContainerGutter, ContainerMaxWidth, DatePickerMode, DatePickerSize, DateRange, DividerLabelPosition, DividerOrientation, DividerSize, DividerVariant, DropdownItem, DropdownItemDTO, DsComboboxOption, DsComboboxSize, DsSelectOption, DsSelectSize, DsTableColumn, DsTableSize, DsTableVariant, I18nLabels, InputAppearance, InputSize, InputState, InputType, MenuItem, MenuSize, MenuTrigger, PageChangeEvent, PageSizeOption, PaginationSize, PopoverTrigger, ProgressBarMode, ProgressBarSize, ProgressBarVariant, RadioGroupLayout, RadioOption, RadioSize, SearchInputSize, SkeletonSize, SkeletonVariant, SortDirection, SortEvent, Step, StepChangeEvent, StepState, StepperOrientation, StepperSize, SupportedLocale, TabItem, TableState, TextareaAppearance, TextareaResize, TextareaSize, TextareaState, ToastInstance, ToastOptions, ToastPosition, ToastType, ToggleSize };
|
|
5037
|
+
export { AUTOCOMPLETE_POSITIONS, BUTTON_APPEARANCE_OPTIONS, BUTTON_SIZE_OPTIONS, BUTTON_VARIANT_OPTIONS, DROPDOWN_POSITIONS, DsAccordion, DsAlert, DsAvatar, DsBadge, DsBreadcrumb, DsButton, DsCard, DsCheckbox, DsChip, DsCombobox, DsContainer, DsDatePicker, DsDivider, DsDropdown, DsFileUpload, DsI18nService, DsInputField, DsInputTextarea, DsMenu, DsModalComponent, DsPagination, DsPopover, DsPopoverComponent, DsProgressBar, DsRadioGroup, DsSearchInput, DsSelect, DsSkeleton, DsSlider, DsStepper, DsTable, DsTabs, DsToastComponent, DsToastContainerComponent, DsToastService, DsToggle, DsTooltip, DsTooltipComponent, IconRegistryService, POPOVER_POSITIONS, PrimitiveBadge, PrimitiveButton, PrimitiveCheckbox, PrimitiveInput, PrimitiveRadio, PrimitiveTextarea, PrimitiveToggle, TOOLTIP_POSITIONS, buildButtonArgTypes, buildButtonArgs, createSizeRender, createVariantRender };
|
|
5038
|
+
export type { AccordionChangeEvent, AccordionItem, AccordionSize, AccordionVariant, AlertSize, AlertType, AvatarShape, AvatarSize, BadgeAppearance, BadgeShape, BadgeSize, BadgeType, BadgeVariant, BreadcrumbItem, ButtonAppearance, ButtonSize, ButtonType, ButtonVariant, CardSize, CardVariant, CheckboxSize, CheckboxState, ChipColor, ChipSize, ChipVariant, ContainerGutter, ContainerMaxWidth, DatePickerMode, DatePickerSize, DateRange, DividerLabelPosition, DividerOrientation, DividerSize, DividerVariant, DropdownItem, DropdownItemDTO, DsComboboxOption, DsComboboxSize, DsSelectOption, DsSelectSize, DsTableColumn, DsTableSize, DsTableVariant, FileUploadSize, I18nLabels, InputAppearance, InputSize, InputState, InputType, MenuItem, MenuSize, MenuTrigger, PageChangeEvent, PageSizeOption, PaginationSize, PopoverTrigger, ProgressBarMode, ProgressBarSize, ProgressBarVariant, RadioGroupLayout, RadioOption, RadioSize, SearchInputSize, SkeletonSize, SkeletonVariant, SliderOrientation, SliderSize, SliderValue, SortDirection, SortEvent, Step, StepChangeEvent, StepState, StepperOrientation, StepperSize, SupportedLocale, TabItem, TableState, TextareaAppearance, TextareaResize, TextareaSize, TextareaState, ToastInstance, ToastOptions, ToastPosition, ToastType, ToggleSize, UploadFile };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kksdev/ds-angular",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"description": "Angular 20 standalone component library - Design System with
|
|
3
|
+
"version": "1.3.0",
|
|
4
|
+
"description": "Angular 20 standalone component library - Design System with 33 components, 7 primitives, 3 themes, i18n support",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
7
7
|
"angular20",
|