@webilix/ngx-form-m3 0.0.15 → 0.0.17

package/lib/inputs/multi-select/input-multi-select.component.d.ts

@@ -13,6 +13,8 @@ export declare class InputMultiSelectComponent implements OnInit {
     isButtonDisabled: boolean;
     ids: string[];
     ngOnInit(): void;
+    select(type: 'ALL' | 'NONE'): void;
+    selectGroup(index: number): void;
     toggleValue(id: string): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<InputMultiSelectComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<InputMultiSelectComponent, "ng-component", never, { "values": { "alias": "values"; "required": true; }; "isButtonDisabled": { "alias": "isButtonDisabled"; "required": true; }; }, {}, never, never, true, never>;

package/lib/inputs/multi-select/input-multi-select.interface.d.ts

@@ -8,9 +8,14 @@ export interface IInputMultiSelect extends Omit<IInput, 'value' | 'optional' | '
         readonly id: string;
         readonly title: string;
     }[];
+    readonly groups?: {
+        readonly title: string;
+        readonly ids: string[];
+    }[];
     readonly minCount?: number;
     readonly maxCount?: number;
     readonly listMaxHeight?: number;
+    readonly selectButtons?: boolean;
 }
 export declare class InputMultiSelectMethods extends InputMethods<IInputMultiSelect, string[] | null> {
     control(input: IInputMultiSelect, validators: ValidatorFn[]): FormControl<string[] | null>;

package/ngx-form-m3.css

@@ -156,8 +156,29 @@
 
 /* INPUTS: MULTI-SELECT */
 .ngx-helper-form-m3-multi-select-input {
-    .title {
+    .header {
+        display: flex;
+        align-items: center;
+        column-gap: 0.5rem;
+
         padding-bottom: 0.5rem;
+
+        .title {
+            flex: 1;
+            width: 0;
+
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+
+        button {
+            padding: 0 0.5rem;
+            height: auto;
+            min-width: auto;
+            border-radius: 0;
+            font-size: 85%;
+        }
     }
 
     .options {
@@ -175,6 +196,10 @@
                 flex: 1;
                 text-align: right;
             }
+
+            mat-icon.selected {
+                color: var(--primary);
+            }
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webilix/ngx-form-m3",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "author": "Ali Amirnezhad",
   "description": "Persian form library for Angular and Material 3",
   "repository": {