@arsedizioni/ars-utils 19.0.32 → 19.0.34
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.
|
@@ -2383,7 +2383,7 @@ class ChipsSelectorComponent {
|
|
|
2383
2383
|
* @param item: the item to check
|
|
2384
2384
|
*/
|
|
2385
2385
|
isSelectable(item) {
|
|
2386
|
-
return this.getSelection().findIndex(x => x.value === item.value)
|
|
2386
|
+
return this.multiple() || this.getSelection().findIndex(x => x.value === item.value) === -1;
|
|
2387
2387
|
}
|
|
2388
2388
|
writeValue(value) {
|
|
2389
2389
|
if (this.value !== value) {
|
|
@@ -2438,14 +2438,14 @@ class ChipsSelectorComponent {
|
|
|
2438
2438
|
}
|
|
2439
2439
|
}
|
|
2440
2440
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ChipsSelectorComponent, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2441
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: ChipsSelectorComponent, isStandalone: true, selector: "chips-selector", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, collapsedWidth: { classPropertyName: "collapsedWidth", publicName: "collapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, collapsedDisplayMode: { classPropertyName: "collapsedDisplayMode", publicName: "collapsedDisplayMode", isSignal: true, isRequired: false, transformFunction: null }, collapseAt: { classPropertyName: "collapseAt", publicName: "collapseAt", isSignal: true, isRequired: false, transformFunction: null }, collapseAtContainer: { classPropertyName: "collapseAtContainer", publicName: "collapseAtContainer", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, mustSelect: { classPropertyName: "mustSelect", publicName: "mustSelect", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, host: { properties: { "id": "this.id", "class.floating": "this.shouldLabelFloat", "attr.aria-describedBy": "this.describedBy" } }, ngImport: i0, template: "<div [id]=\"containerId\" class=\"chips-selector\">\r\n @if(containerWidth() > 0) {\r\n @if(collapsed()) {\r\n @if(collapsedDisplayMode() === 'dropdown') {\r\n <mat-form-field [ngStyle]=\"{'min-width': collapsedWidth() > 0 ? collapsedWidth()+'.px' : '100%'}\"\r\n subscriptSizing=\"dynamic\">\r\n @if(label()) {\r\n <mat-label>{{label()}}</mat-label>\r\n }\r\n <mat-select [(ngModel)]=\"selection\" [multiple]=\"multiple()\" (selectionChange)=\"updateValue()\">\r\n <mat-select-trigger>\r\n @if (value && (value.length || 0) > 0) {\r\n {{value[0].shortName ?? value[0].name}}\r\n }\r\n @if (value && (value.length || 0) > 1) {\r\n <span class=\"collapsed-additional-selection\">\r\n (+{{(value.length || 0) - 1}} {{value.length === 2 ? 'altro' : 'altri'}})\r\n </span>\r\n }\r\n </mat-select-trigger>\r\n @for (o of options(); track o.value) {\r\n <mat-option [value]=\"o\" [disabled]=\"o.disabled\">\r\n {{o.name}}\r\n @if(o.bag) {\r\n ({{o.bag}});\r\n }\r\n </mat-option>\r\n }\r\n </mat-select>\r\n @if (value && (value.length || 0) > 0) {\r\n <button matSuffix tabindex=\"-1\" mat-icon-button aria-label=\"Pulisci\" (click)=\"clear($event)\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n } @else {\r\n <button-selector [label]=\"label()\" [options]=\"options()\" [width]=\"collapsedWidth()\" [(ngModel)]=\"singleSelection\"\r\n name=\"value\" (selected)=\"updateValue()\" ></button-selector>\r\n\r\n }\r\n } @else {\r\n <mat-chip-listbox [ngClass]=\"stacked() ? 'mat-mdc-chip-set-stacked' : ''\" [multiple]=\"multiple()\" [(ngModel)]=\"selection\" (change)=\"updateValue()\">\r\n @for (o of options(); track o.value) {\r\n <mat-chip-option [matBadge]=\"o.bag\" [matTooltip]=\"o.bagInfo ?? ''\" [selectable]=\"
|
|
2441
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: ChipsSelectorComponent, isStandalone: true, selector: "chips-selector", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, collapsedWidth: { classPropertyName: "collapsedWidth", publicName: "collapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, collapsedDisplayMode: { classPropertyName: "collapsedDisplayMode", publicName: "collapsedDisplayMode", isSignal: true, isRequired: false, transformFunction: null }, collapseAt: { classPropertyName: "collapseAt", publicName: "collapseAt", isSignal: true, isRequired: false, transformFunction: null }, collapseAtContainer: { classPropertyName: "collapseAtContainer", publicName: "collapseAtContainer", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, mustSelect: { classPropertyName: "mustSelect", publicName: "mustSelect", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, host: { properties: { "id": "this.id", "class.floating": "this.shouldLabelFloat", "attr.aria-describedBy": "this.describedBy" } }, ngImport: i0, template: "<div [id]=\"containerId\" class=\"chips-selector\">\r\n @if(containerWidth() > 0) {\r\n @if(collapsed()) {\r\n @if(collapsedDisplayMode() === 'dropdown') {\r\n <mat-form-field [ngStyle]=\"{'min-width': collapsedWidth() > 0 ? collapsedWidth()+'.px' : '100%'}\"\r\n subscriptSizing=\"dynamic\">\r\n @if(label()) {\r\n <mat-label>{{label()}}</mat-label>\r\n }\r\n <mat-select [(ngModel)]=\"selection\" [multiple]=\"multiple()\" (selectionChange)=\"updateValue()\">\r\n <mat-select-trigger>\r\n @if (value && (value.length || 0) > 0) {\r\n {{value[0].shortName ?? value[0].name}}\r\n }\r\n @if (value && (value.length || 0) > 1) {\r\n <span class=\"collapsed-additional-selection\">\r\n (+{{(value.length || 0) - 1}} {{value.length === 2 ? 'altro' : 'altri'}})\r\n </span>\r\n }\r\n </mat-select-trigger>\r\n @for (o of options(); track o.value) {\r\n <mat-option [value]=\"o\" [disabled]=\"o.disabled\">\r\n {{o.name}}\r\n @if(o.bag) {\r\n ({{o.bag}});\r\n }\r\n </mat-option>\r\n }\r\n </mat-select>\r\n @if (value && (value.length || 0) > 0) {\r\n <button matSuffix tabindex=\"-1\" mat-icon-button aria-label=\"Pulisci\" (click)=\"clear($event)\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n } @else {\r\n <button-selector [label]=\"label()\" [options]=\"options()\" [width]=\"collapsedWidth()\" [(ngModel)]=\"singleSelection\"\r\n name=\"value\" (selected)=\"updateValue()\" ></button-selector>\r\n\r\n }\r\n } @else {\r\n <mat-chip-listbox [ngClass]=\"stacked() ? 'mat-mdc-chip-set-stacked' : ''\" [multiple]=\"multiple()\" [(ngModel)]=\"selection\" (change)=\"updateValue()\">\r\n @for (o of options(); track o.value) {\r\n <mat-chip-option [matBadge]=\"o.bag\" [matTooltip]=\"o.bagInfo ?? ''\" [selectable]=\"isSelectable(o)\" [value]=\"o\" [disabled]=\"o.disabled\" >{{o.shortName ??\r\n o.name}}</mat-chip-option>\r\n }\r\n </mat-chip-listbox>\r\n }\r\n }\r\n</div>", styles: [".chips-selector{width:100%}.chips-selector .collapsed-additional-selection{opacity:.75;font-size:.75em}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i2.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i2.DefaultStyleDirective, selector: " [ngStyle], [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl], [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl], [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i4$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i9$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i6$1.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i6$1.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i9$2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ButtonSelectorComponent, selector: "button-selector", inputs: ["disabled", "width", "border", "borderRadius", "label", "labelSelected", "options", "autoSelect"], outputs: ["changed", "selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2442
2442
|
}
|
|
2443
2443
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: ChipsSelectorComponent, decorators: [{
|
|
2444
2444
|
type: Component,
|
|
2445
2445
|
args: [{ selector: 'chips-selector', standalone: true, imports: [NgStyle, NgClass, FlexLayoutModule, FormsModule, MatFormFieldModule, MatSelectModule,
|
|
2446
2446
|
MatChipsModule, MatIconModule, MatButtonModule, MatBadgeModule, MatTooltipModule,
|
|
2447
2447
|
ButtonSelectorComponent
|
|
2448
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [id]=\"containerId\" class=\"chips-selector\">\r\n @if(containerWidth() > 0) {\r\n @if(collapsed()) {\r\n @if(collapsedDisplayMode() === 'dropdown') {\r\n <mat-form-field [ngStyle]=\"{'min-width': collapsedWidth() > 0 ? collapsedWidth()+'.px' : '100%'}\"\r\n subscriptSizing=\"dynamic\">\r\n @if(label()) {\r\n <mat-label>{{label()}}</mat-label>\r\n }\r\n <mat-select [(ngModel)]=\"selection\" [multiple]=\"multiple()\" (selectionChange)=\"updateValue()\">\r\n <mat-select-trigger>\r\n @if (value && (value.length || 0) > 0) {\r\n {{value[0].shortName ?? value[0].name}}\r\n }\r\n @if (value && (value.length || 0) > 1) {\r\n <span class=\"collapsed-additional-selection\">\r\n (+{{(value.length || 0) - 1}} {{value.length === 2 ? 'altro' : 'altri'}})\r\n </span>\r\n }\r\n </mat-select-trigger>\r\n @for (o of options(); track o.value) {\r\n <mat-option [value]=\"o\" [disabled]=\"o.disabled\">\r\n {{o.name}}\r\n @if(o.bag) {\r\n ({{o.bag}});\r\n }\r\n </mat-option>\r\n }\r\n </mat-select>\r\n @if (value && (value.length || 0) > 0) {\r\n <button matSuffix tabindex=\"-1\" mat-icon-button aria-label=\"Pulisci\" (click)=\"clear($event)\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n } @else {\r\n <button-selector [label]=\"label()\" [options]=\"options()\" [width]=\"collapsedWidth()\" [(ngModel)]=\"singleSelection\"\r\n name=\"value\" (selected)=\"updateValue()\" ></button-selector>\r\n\r\n }\r\n } @else {\r\n <mat-chip-listbox [ngClass]=\"stacked() ? 'mat-mdc-chip-set-stacked' : ''\" [multiple]=\"multiple()\" [(ngModel)]=\"selection\" (change)=\"updateValue()\">\r\n @for (o of options(); track o.value) {\r\n <mat-chip-option [matBadge]=\"o.bag\" [matTooltip]=\"o.bagInfo ?? ''\" [selectable]=\"
|
|
2448
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [id]=\"containerId\" class=\"chips-selector\">\r\n @if(containerWidth() > 0) {\r\n @if(collapsed()) {\r\n @if(collapsedDisplayMode() === 'dropdown') {\r\n <mat-form-field [ngStyle]=\"{'min-width': collapsedWidth() > 0 ? collapsedWidth()+'.px' : '100%'}\"\r\n subscriptSizing=\"dynamic\">\r\n @if(label()) {\r\n <mat-label>{{label()}}</mat-label>\r\n }\r\n <mat-select [(ngModel)]=\"selection\" [multiple]=\"multiple()\" (selectionChange)=\"updateValue()\">\r\n <mat-select-trigger>\r\n @if (value && (value.length || 0) > 0) {\r\n {{value[0].shortName ?? value[0].name}}\r\n }\r\n @if (value && (value.length || 0) > 1) {\r\n <span class=\"collapsed-additional-selection\">\r\n (+{{(value.length || 0) - 1}} {{value.length === 2 ? 'altro' : 'altri'}})\r\n </span>\r\n }\r\n </mat-select-trigger>\r\n @for (o of options(); track o.value) {\r\n <mat-option [value]=\"o\" [disabled]=\"o.disabled\">\r\n {{o.name}}\r\n @if(o.bag) {\r\n ({{o.bag}});\r\n }\r\n </mat-option>\r\n }\r\n </mat-select>\r\n @if (value && (value.length || 0) > 0) {\r\n <button matSuffix tabindex=\"-1\" mat-icon-button aria-label=\"Pulisci\" (click)=\"clear($event)\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n } @else {\r\n <button-selector [label]=\"label()\" [options]=\"options()\" [width]=\"collapsedWidth()\" [(ngModel)]=\"singleSelection\"\r\n name=\"value\" (selected)=\"updateValue()\" ></button-selector>\r\n\r\n }\r\n } @else {\r\n <mat-chip-listbox [ngClass]=\"stacked() ? 'mat-mdc-chip-set-stacked' : ''\" [multiple]=\"multiple()\" [(ngModel)]=\"selection\" (change)=\"updateValue()\">\r\n @for (o of options(); track o.value) {\r\n <mat-chip-option [matBadge]=\"o.bag\" [matTooltip]=\"o.bagInfo ?? ''\" [selectable]=\"isSelectable(o)\" [value]=\"o\" [disabled]=\"o.disabled\" >{{o.shortName ??\r\n o.name}}</mat-chip-option>\r\n }\r\n </mat-chip-listbox>\r\n }\r\n }\r\n</div>", styles: [".chips-selector{width:100%}.chips-selector .collapsed-additional-selection{opacity:.75;font-size:.75em}\n"] }]
|
|
2449
2449
|
}], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
|
|
2450
2450
|
type: Optional
|
|
2451
2451
|
}, {
|