@webilix/ngx-helper-m3 0.0.19 → 0.0.21

package/lib/components/card/ngx-helper-card.component.d.ts

@@ -1,7 +1,7 @@
 import { OnChanges, OnInit, SimpleChanges } from '@angular/core';
 import { INgxHelperConfig } from '../../ngx-helper.config';
 import { ComponentService } from '../component.service';
-import { NgxHelperAction } from './ngx-helper-card.interface';
+import { INgxHelperCardOption, NgxHelperCardAction } from './ngx-helper-card.interface';
 import * as i0 from "@angular/core";
 type Button = {
     type: 'BUTTON';
@@ -30,18 +30,26 @@ export declare class NgxHelperCardComponent implements OnInit, OnChanges {
     title: string;
     subTitle?: string;
     icon?: string;
-    actions: NgxHelperAction[];
+    actions: NgxHelperCardAction[];
+    option?: INgxHelperCardOption;
     padding: string;
     backgroundColor?: string;
     hasShadow: boolean;
     isMobile: boolean;
     buttons: Button[];
     private componentConfig;
+    optionId?: string;
+    optionTitle?: string;
+    optionItems: ('DIVIDER' | {
+        readonly id: string;
+        readonly title: string;
+    })[];
     constructor(componentService: ComponentService, config?: Partial<INgxHelperConfig> | undefined);
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     onResize(): void;
+    setOption(id: string, firstCheck?: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgxHelperCardComponent, [null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NgxHelperCardComponent, "ngx-helper-card", never, { "title": { "alias": "title"; "required": true; }; "subTitle": { "alias": "subTitle"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "hasShadow": { "alias": "hasShadow"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NgxHelperCardComponent, "ngx-helper-card", never, { "title": { "alias": "title"; "required": true; }; "subTitle": { "alias": "subTitle"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "option": { "alias": "option"; "required": false; }; "padding": { "alias": "padding"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "hasShadow": { "alias": "hasShadow"; "required": false; }; }, {}, never, ["*"], true, never>;
 }
 export {};

package/lib/components/card/ngx-helper-card.interface.d.ts

@@ -12,5 +12,14 @@ interface ICardMenu {
     readonly showIcon?: boolean;
     readonly buttons: ('DIVIDER' | ICardButton)[];
 }
-export type NgxHelperAction = ICardButton | ICardMenu;
+export type NgxHelperCardAction = ICardButton | ICardMenu;
+export interface INgxHelperCardOption {
+    readonly id?: string;
+    readonly icon: string;
+    readonly items: ('DIVIDER' | {
+        readonly id: string;
+        readonly title: string;
+    })[];
+    readonly action: (id: string) => void;
+}
 export {};

package/lib/components/component.service.d.ts

@@ -26,6 +26,7 @@ export interface IValueComponentData {
 }
 export declare class ComponentService {
     getComponentConfig(config?: Partial<INgxHelperConfig>): IComponentConfig;
+    private isRTL;
     getValueData(values: INgxHelperValue[]): IValueComponentData[];
     static ɵfac: i0.ɵɵFactoryDeclaration<ComponentService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<ComponentService>;

package/ngx-helper-m3.css

@@ -67,7 +67,12 @@
 
         .title {
             flex: 1;
+            width: 0;
             padding-right: 0.5rem;
+
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
         }
     }
 
@@ -101,6 +106,7 @@
         bottom: 0;
         left: 0;
 
+        direction: ltr;
         padding: 0.5rem 0.5rem 0.75rem 0.5rem;
         background-color: rgb(255, 255, 255);
         box-shadow: 0 0 5px 0px var(--primary);
@@ -451,6 +457,36 @@
                 padding: 0 0.5rem;
             }
         }
+
+        .option {
+            margin-right: 0.5rem;
+
+            button {
+                display: flex;
+                justify-content: center;
+                column-gap: 0.25rem;
+
+                border-radius: 0;
+                padding: 0 0.75rem;
+                min-width: auto;
+                height: 55px;
+
+                .title {
+                    font-size: 90%;
+                }
+
+                mat-icon {
+                    padding: 0 0 0 0.5rem;
+                    margin: 0;
+                    font-size: 120%;
+                    line-height: 1;
+                }
+
+                mat-icon.mobile-view {
+                    padding: 0;
+                }
+            }
+        }
     }
 
     .card-header.has-sub-title {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webilix/ngx-helper-m3",
-  "version": "0.0.19",
+  "version": "0.0.21",
   "author": "Ali Amirnezhad",
   "description": "Helper library for Angular and Material 3",
   "repository": {