npm - @libs-ui/components-buttons-group - Versions diffs - 0.2.356-9 → 0.2.357-1 - Mend

@libs-ui/components-buttons-group 0.2.356-9 → 0.2.357-1

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.

Files changed (6) hide show

package/README.md +175 -320
package/esm2022/group.component.mjs +3 -3
package/fesm2022/libs-ui-components-buttons-group.mjs +3 -3
package/fesm2022/libs-ui-components-buttons-group.mjs.map +1 -1
package/group.component.d.ts +1 -1
package/package.json +3 -3

package/README.md CHANGED Viewed

@@ -1,38 +1,33 @@
 # @libs-ui/components-buttons-group
-> Component Button Group cho phép nhóm nhiều button thành một nhóm liền kề với trạng thái active.
+> Component nhóm nhiều button thành một group liền kề với quản lý trạng thái active tự động.
 ## Giới thiệu
-`LibsUiComponentsButtonsGroupComponent` là một standalone Angular component được thiết kế để hiển thị một nhóm các button liền kề nhau. Component hỗ trợ quản lý trạng thái active và cho phép chuyển đổi giữa các button trong nhóm.
+`LibsUiComponentsButtonsGroupComponent` là standalone Angular component cho phép nhóm nhiều button thành một dải liền kề. Component tự động xử lý trạng thái active/inactive theo index, hỗ trợ two-way binding, disable theo group hoặc từng button riêng lẻ, và tích hợp popover cho từng button trong group.
-### Tính năng
+## Tính năng
-- ✅ Nhóm nhiều button thành một group liền kề
-- ✅ Quản lý trạng thái active với visual feedback rõ ràng
-- ✅ Two-way binding cho index button đang active
-- ✅ Hỗ trợ disable toàn bộ group hoặc từng button
-- ✅ Tích hợp popover cho từng button
-- ✅ Hỗ trợ icon cho button
-- ✅ Tự động xử lý border radius cho button đầu/cuối/giữa
-- ✅ Angular Signals cho tính phản hồi cao
-- ✅ OnPush Change Detection tối ưu hiệu năng
+- ✅ Nhóm nhiều button thành một dải liền kề với border styling tự động
+- ✅ Quản lý trạng thái active/inactive theo index với visual feedback rõ ràng
+- ✅ Two-way binding `[(indexActive)]` cho index button đang active
+- ✅ Disable toàn bộ group hoặc từng button riêng lẻ
+- ✅ Hỗ trợ icon trái/phải và chế độ icon-only cho từng button
+- ✅ Tích hợp popover cho từng button trong group
+- ✅ Click vào button đang active không emit event (tránh re-render không cần thiết)
+- ✅ Angular Signals + OnPush Change Detection tối ưu hiệu năng
 ## Khi nào sử dụng
-- Khi cần nhóm các button có liên quan với nhau
-- Khi cần toggle giữa các options (như tab buttons)
-- Khi cần hiển thị một nhóm actions liền kề
-- Phù hợp cho filter groups, view switchers, segmented controls
+- Khi cần nhóm các button liên quan thành filter group (All / Active / Completed)
+- Khi cần view switcher (List View / Grid View / Card View)
+- Khi cần segmented control hoặc tab-style buttons
+- Khi cần toolbar formatting (Bold / Italic / Underline) dạng icon-only
 ## Cài đặt
 ```bash
-# npm
 npm install @libs-ui/components-buttons-group
-# yarn
-yarn add @libs-ui/components-buttons-group
 ```
 ## Import
@@ -40,6 +35,7 @@ yarn add @libs-ui/components-buttons-group
 ```typescript
 import { LibsUiComponentsButtonsGroupComponent } from '@libs-ui/components-buttons-group';
 import { IButton } from '@libs-ui/components-buttons-button';
+import { IPopoverFunctionControlEvent } from '@libs-ui/components-popover';
 @Component({
   standalone: true,
@@ -49,28 +45,81 @@ import { IButton } from '@libs-ui/components-buttons-button';
 export class YourComponent {}
 ```
-## Ví dụ
+## Ví dụ sử dụng
-### Basic Usage
+### Basic — View Switcher
 ```html
 <libs_ui-components-buttons-group
   [buttons]="viewButtons"
-  [(indexActive)]="activeIndex"
-  (outChange)="handleChange($event)" />
+  [(indexActive)]="activeView"
+  (outChange)="handlerViewChange($event)"
+/>
 ```
 ```typescript
-viewButtons: IButton[] = [
-  { label: 'List View', key: 'list' },
-  { label: 'Grid View', key: 'grid' },
-  { label: 'Card View', key: 'card' }
-];
+import { Component, signal } from '@angular/core';
+import { LibsUiComponentsButtonsGroupComponent } from '@libs-ui/components-buttons-group';
+import { IButton } from '@libs-ui/components-buttons-button';
+@Component({
+  selector: 'app-view-switcher',
+  standalone: true,
+  imports: [LibsUiComponentsButtonsGroupComponent],
+  templateUrl: './view-switcher.component.html',
+})
+export class ViewSwitcherComponent {
+  readonly activeView = signal<number>(0);
+  readonly viewButtons: IButton[] = [
+    { label: 'List View', key: 'list' },
+    { label: 'Grid View', key: 'grid' },
+    { label: 'Card View', key: 'card' },
+  ];
+  protected handlerViewChange(event: Event): void {
+    event.stopPropagation();
+    // activeView đã được cập nhật tự động qua two-way binding
+  }
+}
+```
+### Filter Group
+```html
+<libs_ui-components-buttons-group
+  [buttons]="filterButtons"
+  [(indexActive)]="activeFilter"
+  (outChange)="handlerFilterChange($event)"
+/>
+<p>Đang lọc: {{ filterButtons[activeFilter()].key }}</p>
+```
-activeIndex = 0;
+```typescript
+import { Component, signal } from '@angular/core';
+import { LibsUiComponentsButtonsGroupComponent } from '@libs-ui/components-buttons-group';
+import { IButton } from '@libs-ui/components-buttons-button';
-handleChange(button: IButton) {
-  console.log('Selected:', button);
+@Component({
+  selector: 'app-filter-group',
+  standalone: true,
+  imports: [LibsUiComponentsButtonsGroupComponent],
+  templateUrl: './filter-group.component.html',
+})
+export class FilterGroupComponent {
+  readonly activeFilter = signal<number>(0);
+  readonly filterButtons: IButton[] = [
+    { label: 'All', key: 'all' },
+    { label: 'Active', key: 'active' },
+    { label: 'Completed', key: 'completed' },
+    { label: 'Archived', key: 'archived' },
+  ];
+  protected handlerFilterChange(button: IButton): void {
+    button.key; // 'all' | 'active' | 'completed' | 'archived'
+    // Thực hiện logic lọc dữ liệu theo button.key
+  }
 }
 ```
@@ -79,79 +128,59 @@ handleChange(button: IButton) {
 ```html
 <libs_ui-components-buttons-group
   [buttons]="viewButtonsWithIcons"
-  [(indexActive)]="activeView" />
+  [(indexActive)]="activeView"
+/>
 ```
 ```typescript
-viewButtonsWithIcons: IButton[] = [
-  {
-    label: 'List',
-    key: 'list',
-    classIconLeft: 'libs-ui-icon-list'
-  },
-  {
-    label: 'Grid',
-    key: 'grid',
-    classIconLeft: 'libs-ui-icon-grid'
-  },
-  {
-    label: 'Card',
-    key: 'card',
-    classIconLeft: 'libs-ui-icon-card'
-  }
+readonly viewButtonsWithIcons: IButton[] = [
+  { label: 'List', key: 'list', classIconLeft: 'libs-ui-icon-list-bulleted' },
+  { label: 'Grid', key: 'grid', classIconLeft: 'libs-ui-icon-table' },
+  { label: 'Card', key: 'card', classIconLeft: 'libs-ui-icon-image-solid' },
 ];
-activeView = 0;
 ```
-### Icon Only Buttons
+### Icon Only (Toolbar)
 ```html
 <libs_ui-components-buttons-group
-  [buttons]="iconOnlyButtons"
-  [(indexActive)]="selectedIndex" />
+  [buttons]="formatButtons"
+  [(indexActive)]="activeFormat"
+/>
 ```
 ```typescript
-iconOnlyButtons: IButton[] = [
-  {
-    key: 'bold',
-    classIconLeft: 'libs-ui-icon-bold',
-    iconOnlyType: true
-  },
-  {
-    key: 'italic',
-    classIconLeft: 'libs-ui-icon-italic',
-    iconOnlyType: true
-  },
-  {
-    key: 'underline',
-    classIconLeft: 'libs-ui-icon-underline',
-    iconOnlyType: true
-  }
+readonly formatButtons: IButton[] = [
+  { key: 'bold', classIconLeft: 'libs-ui-icon-editor-bold', iconOnlyType: true },
+  { key: 'italic', classIconLeft: 'libs-ui-icon-editor-italic', iconOnlyType: true },
+  { key: 'underline', classIconLeft: 'libs-ui-icon-editor-underlined', iconOnlyType: true },
 ];
 ```
-### With Disabled State
+### Disable — Toàn bộ group
 ```html
-<!-- Disable entire group -->
 <libs_ui-components-buttons-group
-  [buttons]="buttons"
+  [buttons]="viewButtons"
   [disable]="true"
-  [(indexActive)]="activeIndex" />
+  [(indexActive)]="activeView"
+/>
+```
-<!-- Disable specific buttons -->
+### Disable — Từng button riêng lẻ
+```html
 <libs_ui-components-buttons-group
   [buttons]="buttonsWithDisabled"
-  [(indexActive)]="activeIndex" />
+  [(indexActive)]="activeIndex"
+/>
 ```
 ```typescript
-buttonsWithDisabled: IButton[] = [
+readonly buttonsWithDisabled: IButton[] = [
   { label: 'Option 1', key: '1' },
   { label: 'Option 2', key: '2', disable: true },
-  { label: 'Option 3', key: '3' }
+  { label: 'Option 3', key: '3' },
 ];
 ```
@@ -161,174 +190,85 @@ buttonsWithDisabled: IButton[] = [
 <libs_ui-components-buttons-group
   [buttons]="buttonsWithPopover"
   [(indexActive)]="activeIndex"
-  (outFunctionsControl)="handlePopoverControl($event)" />
+  (outFunctionsControl)="handlerPopoverControl($event)"
+/>
 ```
 ```typescript
-buttonsWithPopover: IButton[] = [
+import { IPopoverFunctionControlEvent } from '@libs-ui/components-popover';
+readonly buttonsWithPopover: IButton[] = [
   {
     label: 'Info',
     key: 'info',
-    popover: {
-      content: 'This is information button',
-      mode: 'hover'
-    }
+    popover: { content: 'Thông tin chi tiết về chức năng này', mode: 'hover' },
   },
   {
     label: 'Warning',
     key: 'warning',
-    popover: {
-      content: 'This is warning button',
-      mode: 'hover'
-    }
-  }
+    popover: { content: 'Cảnh báo: thao tác này không thể hoàn tác', mode: 'hover' },
+  },
 ];
-handlePopoverControl(control: IPopoverFunctionControlEvent) {
-  console.log('Popover control:', control);
+protected handlerPopoverControl(control: IPopoverFunctionControlEvent): void {
+  // Lưu lại control để thao tác popover thủ công nếu cần
+  // control.showPopover(), control.removePopoverOverlay(), ...
 }
 ```
-### Filter Group Example
-```html
-<libs_ui-components-buttons-group
-  [buttons]="filterButtons"
-  [(indexActive)]="activeFilter"
-  (outChange)="applyFilter($event)" />
-```
-```typescript
-filterButtons: IButton[] = [
-  { label: 'All', key: 'all' },
-  { label: 'Active', key: 'active' },
-  { label: 'Completed', key: 'completed' },
-  { label: 'Archived', key: 'archived' }
-];
+## @Input()
-activeFilter = 0;
+| Input | Type | Default | Mô tả | Ví dụ |
+|---|---|---|---|---|
+| `[buttons]` | `Array<IButton>` | **required** | Danh sách các button trong group. Không được để rỗng. | `[buttons]="viewButtons"` |
+| `[disable]` | `boolean` | `false` | Disable toàn bộ button group. Từng button có thể disable riêng qua `IButton.disable`. | `[disable]="isLoading"` |
+| `[(indexActive)]` | `number` | `0` | Index (0-based) của button đang active. Hỗ trợ two-way binding để đồng bộ state với component cha. | `[(indexActive)]="activeView"` |
-applyFilter(button: IButton) {
-  // Apply filter based on button.key
-  console.log('Filtering by:', button.key);
-}
-```
+## @Output()
-### Custom Styling
+| Output | Type | Mô tả | Handler TS | Binding HTML |
+|---|---|---|---|---|
+| `(outChange)` | `IButton` | Emit button vừa được chọn. Không emit khi click lại button đang active. | `handlerChange(button: IButton): void { button.stopPropagation?.(); /* xử lý */ }` | `(outChange)="handlerChange($event)"` |
+| `(outFunctionsControl)` | `IPopoverFunctionControlEvent` | Emit API điều khiển popover khi popover của một button trong group được khởi tạo. | `handlerPopoverControl(control: IPopoverFunctionControlEvent): void { control; }` | `(outFunctionsControl)="handlerPopoverControl($event)"` |
-```html
-<libs_ui-components-buttons-group
-  [buttons]="styledButtons"
-  [(indexActive)]="activeIndex" />
-```
-```typescript
-styledButtons: IButton[] = [
-  {
-    label: 'Primary',
-    key: '1',
-    classInclude: 'custom-button-class'
-  },
-  {
-    label: 'Secondary',
-    key: '2',
-    classInclude: 'custom-button-class'
-  }
-];
-```
-## API
-### libs_ui-components-buttons-group
-#### Inputs
-| Property          | Type             | Default  | Description                                    |
-| ----------------- | ---------------- | -------- | ---------------------------------------------- |
-| `[buttons]`       | `Array<IButton>` | required | Danh sách các button trong group               |
-| `[(indexActive)]` | `number`         | `0`      | Index của button đang active (two-way binding) |
-| `[disable]`       | `boolean`        | `false`  | Disable toàn bộ button group                   |
-#### Outputs
-| Property                | Type                           | Description                       |
-| ----------------------- | ------------------------------ | --------------------------------- |
-| `(outChange)`           | `IButton`                      | Emit khi chuyển đổi button active |
-| `(outFunctionsControl)` | `IPopoverFunctionControlEvent` | Emit functions điều khiển popover |
-#### Public Methods
-| Method             | Description                             |
-| ------------------ | --------------------------------------- |
-| `FunctionsControl` | Getter để lấy popover control functions |
+> **Lưu ý `outChange`:** Event này không emit khi click vào button đang active (index không thay đổi). Handler không nhận `Event` DOM nên không cần `stopPropagation()` trong handler này.
 ## Types & Interfaces
-### IButton Interface
+### IButton
-Button group sử dụng interface `IButton` từ `@libs-ui/components-buttons-button`:
+Import từ `@libs-ui/components-buttons-button`:
 ```typescript
-export interface IButton {
-  /** Unique key cho button */
-  key?: string;
-  /** Kiểu button (sẽ được override bởi component) */
-  type?: TYPE_BUTTON;
-  /** Kích thước button */
-  sizeButton?: TYPE_SIZE_BUTTON;
-  /** Chỉ hiển thị icon, ẩn label */
-  iconOnlyType?: boolean;
-  /** Label hiển thị trên button */
-  label?: string;
-  /** Disable button này */
-  disable?: boolean;
-  /** Class CSS bổ sung */
-  classInclude?: string;
-  /** Class icon bên trái */
-  classIconLeft?: string;
-  /** Class icon bên phải */
-  classIconRight?: string;
-  /** Class cho label */
-  classLabel?: string;
-  /** Cấu hình popover */
-  popover?: IPopover;
-  /** Không stop propagation event */
-  ignoreStopPropagationEvent?: boolean;
-  /** Z-index cho button */
-  zIndex?: number;
-  /** Trạng thái pending */
-  isPending?: boolean;
-  /** Action callback */
-  action?: (data?: any) => Promise<void>;
-  /** Style cho icon trái */
-  styleIconLeft?: Record<string, any>;
-  /** Style cho button */
-  styleButton?: Record<string, any>;
+import { IButton } from '@libs-ui/components-buttons-button';
-  /** Custom color (khi type là button-custom) */
-  buttonCustom?: IColorButton;
+export interface IButton {
+  key?: string;                                        // Định danh duy nhất cho button
+  type?: TYPE_BUTTON;                                  // Bị override bởi component (xem Lưu ý quan trọng)
+  sizeButton?: TYPE_SIZE_BUTTON;                       // Kích thước button
+  iconOnlyType?: boolean;                              // Chỉ hiển thị icon, ẩn label
+  label?: string;                                      // Nội dung text hiển thị
+  disable?: boolean;                                   // Disable riêng button này
+  classInclude?: string;                               // Class CSS bổ sung cho button
+  classIconLeft?: string;                              // Class icon bên trái label
+  classIconRight?: string;                             // Class icon bên phải label
+  classLabel?: string;                                 // Class CSS bổ sung cho label
+  popover?: IPopover;                                  // Cấu hình popover của button
+  ignoreStopPropagationEvent?: boolean;                // Không dừng propagation event
+  zIndex?: number;                                     // z-index của button
+  isPending?: boolean;                                 // Trạng thái loading/pending
+  action?: (data?: any) => Promise<void>;              // Callback async tuỳ chỉnh
+  styleIconLeft?: Record<string, any>;                 // Inline style cho icon trái
+  styleButton?: Record<string, any>;                   // Inline style cho button
+  buttonCustom?: IColorButton;                         // Màu tuỳ chỉnh (khi type = 'button-custom')
 }
 ```
 ### TYPE_BUTTON
 ```typescript
+import { TYPE_BUTTON } from '@libs-ui/components-buttons-button';
 export type TYPE_BUTTON =
   | 'button-primary'
   | 'button-primary-revert'
@@ -359,51 +299,37 @@ export type TYPE_BUTTON =
 ### TYPE_SIZE_BUTTON
 ```typescript
+import { TYPE_SIZE_BUTTON } from '@libs-ui/components-buttons-button';
 export type TYPE_SIZE_BUTTON = 'large' | 'medium' | 'small' | 'smaller';
 ```
-## Styling
-Component tự động xử lý styling cho button group:
-- **First button**: Border radius trái (top-left, bottom-left)
-- **Middle buttons**: Không có border radius, border-left bị loại bỏ
-- **Last button**: Border radius phải (top-right, bottom-right), border-left bị loại bỏ
-- **Active button**: Sử dụng `button-primary` type
-- **Inactive buttons**: Sử dụng `button-primary-revert` type
+### IPopoverFunctionControlEvent
-### CSS Variables
+Import từ `@libs-ui/components-popover` (chỉ cần khi xử lý `(outFunctionsControl)`):
-Component sử dụng CSS variable:
-```scss
---libs-ui-button-other-color-border: #226ff5; // Border color cho disabled state
+```typescript
+import { IPopoverFunctionControlEvent } from '@libs-ui/components-popover';
+export interface IPopoverFunctionControlEvent {
+  showPopover: (elementRef?: HTMLElement) => Promise<void>;
+  updatePopoverOverlayPosition: () => Promise<void>;
+  removePopoverOverlay: () => Promise<void>;
+  getRectContainer: () => Promise<IBoundingClientRect>;
+  getRectContent: () => Promise<IBoundingClientRect>;
+  updatePopoverOverlay: () => Promise<void>;
+}
 ```
-## Behavior
-### Active State Management
-- Khi click vào một button, nó sẽ trở thành active
-- Click vào button đang active sẽ không có effect (không emit event)
-- Index active được quản lý qua two-way binding `[(indexActive)]`
-- Active button hiển thị với style `button-primary`
-- Inactive buttons hiển thị với style `button-primary-revert`
+## Lưu ý quan trọng
-### Disable Behavior
+⚠️ **Type của button bị override tự động**: Component tự động đặt `type = 'button-primary'` cho button đang active và `type = 'button-primary-revert'` cho các button còn lại. Giá trị `type` trong `IButton.type` không có tác dụng khi dùng trong `buttons-group`.
-- Khi `[disable]="true"`: Toàn bộ group bị disable
-- Khi button cụ thể có `disable: true`: Chỉ button đó bị disable
-- Disabled buttons vẫn giữ border styling phù hợp với vị trí trong group
+⚠️ **Index-based active state**: Component quản lý trạng thái active theo index (vị trí trong mảng), không theo `key`. Nếu mảng `buttons` thay đổi thứ tự phần tử, `indexActive` có thể trỏ sai button. Đảm bảo thứ tự mảng ổn định khi muốn giữ nguyên trạng thái active.
-## Công nghệ
+⚠️ **Click button đang active không emit event**: Khi người dùng click vào button có index trùng `indexActive()`, component bỏ qua và không emit `outChange`. Đây là behavior có chủ đích để tránh re-render không cần thiết.
-| Technology      | Version | Purpose          |
-| --------------- | ------- | ---------------- |
-| Angular         | 18+     | Framework        |
-| Angular Signals | -       | State management |
-| SCSS            | -       | Styling          |
-| OnPush          | -       | Change Detection |
+⚠️ **`outChange` không truyền DOM Event**: Handler của `(outChange)` nhận `IButton` trực tiếp, không phải `Event` DOM — không cần và không thể gọi `event.stopPropagation()` trong handler này.
 ## Demo
@@ -411,75 +337,4 @@ Component sử dụng CSS variable:
 npx nx serve core-ui
 ```
-Truy cập: `http://localhost:4500/buttons/group`
-## Unit Tests
-```bash
-# Chạy tests
-npx nx test components-buttons-group
-# Coverage
-npx nx test components-buttons-group --coverage
-# Watch mode
-npx nx test components-buttons-group --watch
-```
-## Dependencies
-- `@angular/core`: >=18.0.0
-- `@libs-ui/components-buttons-button`: 0.2.355-14
-- `@libs-ui/components-popover`: 0.2.355-14
-- `@ngx-translate/core`: ^15.0.0
-## Important Notes
-### ⚠️ Type Override
-Component tự động override `type` property của buttons:
-- Active button → `button-primary`
-- Inactive button → `button-primary-revert`
-Nếu bạn muốn custom type, cần modify component source code.
-### ⚠️ Border Styling
-Component sử dụng `::ng-deep` để style nested components. Điều này cần thiết để style các button components bên trong nhưng có thể ảnh hưởng đến global styles nếu không cẩn thận.
-### ⚠️ Index-based Active State
-Component sử dụng index thay vì key để quản lý active state. Đảm bảo array `buttons` không thay đổi thứ tự nếu bạn muốn maintain active state.
-## Best Practices
-1. **Sử dụng key duy nhất**: Luôn cung cấp `key` unique cho mỗi button để dễ identify
-2. **Limit số lượng buttons**: Nên giới hạn 3-5 buttons trong một group để UX tốt
-3. **Consistent labels**: Sử dụng label ngắn gọn, rõ ràng và có độ dài tương đương
-4. **Icon consistency**: Nếu dùng icon, nên dùng cho tất cả buttons hoặc không dùng
-5. **Responsive design**: Cân nhắc sử dụng icon-only mode trên mobile
-## Troubleshooting
-### Button không chuyển active state
-- Kiểm tra `[(indexActive)]` binding
-- Đảm bảo không có logic nào block event handler
-- Verify button không bị disable
-### Border styling không đúng
-- Kiểm tra ViewEncapsulation của parent component
-- Verify CSS variables được define
-- Check xem có CSS conflicts không
-### Popover không hoạt động
-- Đảm bảo đã import `@libs-ui/components-popover`
-- Verify popover config đúng format
-- Check z-index conflicts
-## License
-MIT
+Truy cập: http://localhost:4500/components/buttons/group

package/esm2022/group.component.mjs CHANGED Viewed

@@ -27,10 +27,10 @@ export class LibsUiComponentsButtonsGroupComponent {
         return this.functionsControlPopover();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsButtonsGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsButtonsGroupComponent, isStandalone: true, selector: "libs_ui-components-buttons-group", inputs: { buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: true, transformFunction: null }, indexActive: { classPropertyName: "indexActive", publicName: "indexActive", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { indexActive: "indexActiveChange", outChange: "outChange", outFunctionsControl: "outFunctionsControl" }, ngImport: i0, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsButtonsGroupComponent, isStandalone: true, selector: "libs_ui-components-buttons-group", inputs: { buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: true, transformFunction: null }, indexActive: { classPropertyName: "indexActive", publicName: "indexActive", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { indexActive: "indexActiveChange", outChange: "outChange", outFunctionsControl: "outFunctionsControl" }, ngImport: i0, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      [iconOnlyType]=\"button.iconOnlyType || false\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsButtonsGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'libs_ui-components-buttons-group', standalone: true, imports: [TranslateModule, LibsUiComponentsButtonsButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"] }]
+            args: [{ selector: 'libs_ui-components-buttons-group', standalone: true, imports: [TranslateModule, LibsUiComponentsButtonsButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      [iconOnlyType]=\"button.iconOnlyType || false\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"] }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2J1dHRvbnMvZ3JvdXAvc3JjL2dyb3VwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL2dyb3VwL3NyYy9ncm91cC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRyxPQUFPLEVBQVcsc0NBQXNDLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUVyRyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0scUJBQXFCLENBQUM7O0FBV3RELE1BQU0sT0FBTyxxQ0FBcUM7SUFDeEMsdUJBQXVCLEdBQUcsTUFBTSxDQUEyQyxTQUFTLENBQUMsQ0FBQztJQUU5RixnQkFBZ0I7SUFDUCxPQUFPLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBa0IsQ0FBQztJQUMzQyxXQUFXLEdBQUcsS0FBSyxDQUFTLENBQUMsQ0FBQyxDQUFDO0lBQy9CLE9BQU8sR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7SUFFekMsaUJBQWlCO0lBQ1IsU0FBUyxHQUFHLE1BQU0sRUFBVyxDQUFDO0lBQzlCLG1CQUFtQixHQUFHLE1BQU0sRUFBZ0MsQ0FBQztJQUV0RSxlQUFlO0lBQ0wsS0FBSyxDQUFDLGtCQUFrQixDQUFDLEtBQWEsRUFBRSxNQUFlO1FBQy9ELElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRSxLQUFLLEtBQUssRUFBRSxDQUFDO1lBQ2pDLE9BQU87UUFDVCxDQUFDO1FBQ0QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDNUIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDOUIsQ0FBQztJQUVTLEtBQUssQ0FBQyx1QkFBdUIsQ0FBQyxPQUFxQztRQUMzRSxJQUFJLENBQUMsbUJBQW1CLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQ3ZDLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxHQUFHLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDNUMsQ0FBQztJQUVELElBQVcsZ0JBQWdCO1FBQ3pCLE9BQU8sSUFBSSxDQUFDLHVCQUF1QixFQUFFLENBQUM7SUFDeEMsQ0FBQzt3R0E1QlUscUNBQXFDOzRGQUFyQyxxQ0FBcUMsZ21CQ2RsRCw2b0JBY0EsdzhCREhZLGVBQWUsK0JBQUUsc0NBQXNDOzs0RkFHdEQscUNBQXFDO2tCQVRqRCxTQUFTOytCQUVFLGtDQUFrQyxjQUdoQyxJQUFJLFdBQ1AsQ0FBQyxlQUFlLEVBQUUsc0NBQXNDLENBQUMsbUJBQ2pELHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbnB1dCwgbW9kZWwsIG91dHB1dCwgc2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBJQnV0dG9uLCBMaWJzVWlDb21wb25lbnRzQnV0dG9uc0J1dHRvbkNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtYnV0dG9ucy1idXR0b24nO1xuaW1wb3J0IHsgSVBvcG92ZXJGdW5jdGlvbkNvbnRyb2xFdmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtcG9wb3Zlcic7XG5pbXBvcnQgeyBUcmFuc2xhdGVNb2R1bGUgfSBmcm9tICdAbmd4LXRyYW5zbGF0ZS9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAYW5ndWxhci1lc2xpbnQvY29tcG9uZW50LXNlbGVjdG9yXG4gIHNlbGVjdG9yOiAnbGlic191aS1jb21wb25lbnRzLWJ1dHRvbnMtZ3JvdXAnLFxuICB0ZW1wbGF0ZVVybDogJy4vZ3JvdXAuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vZ3JvdXAuY29tcG9uZW50LnNjc3MnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbVHJhbnNsYXRlTW9kdWxlLCBMaWJzVWlDb21wb25lbnRzQnV0dG9uc0J1dHRvbkNvbXBvbmVudF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBMaWJzVWlDb21wb25lbnRzQnV0dG9uc0dyb3VwQ29tcG9uZW50IHtcbiAgcHJpdmF0ZSBmdW5jdGlvbnNDb250cm9sUG9wb3ZlciA9IHNpZ25hbDxJUG9wb3ZlckZ1bmN0aW9uQ29udHJvbEV2ZW50IHwgdW5kZWZpbmVkPih1bmRlZmluZWQpO1xuXG4gIC8vICNyZWdpb24gSU5QVVRcbiAgcmVhZG9ubHkgYnV0dG9ucyA9IGlucHV0LnJlcXVpcmVkPEFycmF5PElCdXR0b24+PigpO1xuICByZWFkb25seSBpbmRleEFjdGl2ZSA9IG1vZGVsPG51bWJlcj4oMCk7XG4gIHJlYWRvbmx5IGRpc2FibGUgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG5cbiAgLy8gI3JlZ2lvbiBPVVRQVVRcbiAgcmVhZG9ubHkgb3V0Q2hhbmdlID0gb3V0cHV0PElCdXR0b24+KCk7XG4gIHJlYWRvbmx5IG91dEZ1bmN0aW9uc0NvbnRyb2wgPSBvdXRwdXQ8SVBvcG92ZXJGdW5jdGlvbkNvbnRyb2xFdmVudD4oKTtcblxuICAvKiBGVU5DVElPTlMgKi9cbiAgcHJvdGVjdGVkIGFzeW5jIGhhbmRsZXJDbGlja0J1dHRvbihpbmRleDogbnVtYmVyLCBidXR0b246IElCdXR0b24pIHtcbiAgICBpZiAodGhpcy5pbmRleEFjdGl2ZSgpID09PSBpbmRleCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLmluZGV4QWN0aXZlLnNldChpbmRleCk7XG4gICAgdGhpcy5vdXRDaGFuZ2UuZW1pdChidXR0b24pO1xuICB9XG5cbiAgcHJvdGVjdGVkIGFzeW5jIGhhbmRsZXJGdW5jdGlvbnNDb250cm9sKGNvbnRyb2w6IElQb3BvdmVyRnVuY3Rpb25Db250cm9sRXZlbnQpIHtcbiAgICB0aGlzLm91dEZ1bmN0aW9uc0NvbnRyb2wuZW1pdChjb250cm9sKTtcbiAgICB0aGlzLmZ1bmN0aW9uc0NvbnRyb2xQb3BvdmVyLnNldChjb250cm9sKTtcbiAgfVxuXG4gIHB1YmxpYyBnZXQgRnVuY3Rpb25zQ29udHJvbCgpOiBJUG9wb3ZlckZ1bmN0aW9uQ29udHJvbEV2ZW50IHwgdW5kZWZpbmVkIHtcbiAgICByZXR1cm4gdGhpcy5mdW5jdGlvbnNDb250cm9sUG9wb3ZlcigpO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwibGlicy11aS1idXR0b25zLWdyb3VwXCI+XG4gIEBmb3IgKGJ1dHRvbiBvZiBidXR0b25zKCk7IHRyYWNrIGJ1dHRvbikge1xuICAgIDxsaWJzX3VpLWNvbXBvbmVudHMtYnV0dG9ucy1idXR0b25cbiAgICAgIFt0eXBlXT1cImluZGV4QWN0aXZlKCkgPT09ICRpbmRleCA/ICdidXR0b24tcHJpbWFyeScgOiAnYnV0dG9uLXByaW1hcnktcmV2ZXJ0J1wiXG4gICAgICBbbGFiZWxdPVwiYnV0dG9uLmxhYmVsIHx8ICcnXCJcbiAgICAgIFtkaXNhYmxlXT1cImRpc2FibGUoKSB8fCBidXR0b24uZGlzYWJsZSB8fCBmYWxzZVwiXG4gICAgICBbY2xhc3NJY29uTGVmdF09XCJidXR0b24uY2xhc3NJY29uTGVmdCB8fCAnJ1wiXG4gICAgICBbY2xhc3NJbmNsdWRlXT1cImJ1dHRvbi5jbGFzc0luY2x1ZGUgfHwgJydcIlxuICAgICAgW2NsYXNzSWNvblJpZ2h0XT1cImJ1dHRvbi5jbGFzc0ljb25SaWdodCB8fCAnJ1wiXG4gICAgICBbcG9wb3Zlcl09XCJidXR0b24ucG9wb3ZlciB8fCB7fVwiXG4gICAgICAob3V0RnVuY3Rpb25zQ29udHJvbCk9XCJoYW5kbGVyRnVuY3Rpb25zQ29udHJvbCgkZXZlbnQpXCJcbiAgICAgIChvdXRDbGljayk9XCJoYW5kbGVyQ2xpY2tCdXR0b24oJGluZGV4LCBidXR0b24pXCIgLz5cbiAgfVxuPC9kaXY+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JvdXAuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2J1dHRvbnMvZ3JvdXAvc3JjL2dyb3VwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMtdWkvY29tcG9uZW50cy9idXR0b25zL2dyb3VwL3NyYy9ncm91cC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRyxPQUFPLEVBQVcsc0NBQXNDLEVBQUUsTUFBTSxvQ0FBb0MsQ0FBQztBQUVyRyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0scUJBQXFCLENBQUM7O0FBV3RELE1BQU0sT0FBTyxxQ0FBcUM7SUFDL0IsdUJBQXVCLEdBQUcsTUFBTSxDQUEyQyxTQUFTLENBQUMsQ0FBQztJQUV2RyxnQkFBZ0I7SUFDUCxPQUFPLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBa0IsQ0FBQztJQUMzQyxXQUFXLEdBQUcsS0FBSyxDQUFTLENBQUMsQ0FBQyxDQUFDO0lBQy9CLE9BQU8sR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7SUFFekMsaUJBQWlCO0lBQ1IsU0FBUyxHQUFHLE1BQU0sRUFBVyxDQUFDO0lBQzlCLG1CQUFtQixHQUFHLE1BQU0sRUFBZ0MsQ0FBQztJQUV0RSxlQUFlO0lBQ0wsS0FBSyxDQUFDLGtCQUFrQixDQUFDLEtBQWEsRUFBRSxNQUFlO1FBQy9ELElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRSxLQUFLLEtBQUssRUFBRSxDQUFDO1lBQ2pDLE9BQU87UUFDVCxDQUFDO1FBQ0QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDNUIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDOUIsQ0FBQztJQUVTLEtBQUssQ0FBQyx1QkFBdUIsQ0FBQyxPQUFxQztRQUMzRSxJQUFJLENBQUMsbUJBQW1CLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQ3ZDLElBQUksQ0FBQyx1QkFBdUIsQ0FBQyxHQUFHLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDNUMsQ0FBQztJQUVELElBQVcsZ0JBQWdCO1FBQ3pCLE9BQU8sSUFBSSxDQUFDLHVCQUF1QixFQUFFLENBQUM7SUFDeEMsQ0FBQzt3R0E1QlUscUNBQXFDOzRGQUFyQyxxQ0FBcUMsZ21CQ2RsRCxvc0JBZUEsdzhCREpZLGVBQWUsK0JBQUUsc0NBQXNDOzs0RkFHdEQscUNBQXFDO2tCQVRqRCxTQUFTOytCQUVFLGtDQUFrQyxjQUdoQyxJQUFJLFdBQ1AsQ0FBQyxlQUFlLEVBQUUsc0NBQXNDLENBQUMsbUJBQ2pELHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbnB1dCwgbW9kZWwsIG91dHB1dCwgc2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBJQnV0dG9uLCBMaWJzVWlDb21wb25lbnRzQnV0dG9uc0J1dHRvbkNvbXBvbmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtYnV0dG9ucy1idXR0b24nO1xuaW1wb3J0IHsgSVBvcG92ZXJGdW5jdGlvbkNvbnRyb2xFdmVudCB9IGZyb20gJ0BsaWJzLXVpL2NvbXBvbmVudHMtcG9wb3Zlcic7XG5pbXBvcnQgeyBUcmFuc2xhdGVNb2R1bGUgfSBmcm9tICdAbmd4LXRyYW5zbGF0ZS9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAYW5ndWxhci1lc2xpbnQvY29tcG9uZW50LXNlbGVjdG9yXG4gIHNlbGVjdG9yOiAnbGlic191aS1jb21wb25lbnRzLWJ1dHRvbnMtZ3JvdXAnLFxuICB0ZW1wbGF0ZVVybDogJy4vZ3JvdXAuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vZ3JvdXAuY29tcG9uZW50LnNjc3MnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbVHJhbnNsYXRlTW9kdWxlLCBMaWJzVWlDb21wb25lbnRzQnV0dG9uc0J1dHRvbkNvbXBvbmVudF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBMaWJzVWlDb21wb25lbnRzQnV0dG9uc0dyb3VwQ29tcG9uZW50IHtcbiAgcHJpdmF0ZSByZWFkb25seSBmdW5jdGlvbnNDb250cm9sUG9wb3ZlciA9IHNpZ25hbDxJUG9wb3ZlckZ1bmN0aW9uQ29udHJvbEV2ZW50IHwgdW5kZWZpbmVkPih1bmRlZmluZWQpO1xuXG4gIC8vICNyZWdpb24gSU5QVVRcbiAgcmVhZG9ubHkgYnV0dG9ucyA9IGlucHV0LnJlcXVpcmVkPEFycmF5PElCdXR0b24+PigpO1xuICByZWFkb25seSBpbmRleEFjdGl2ZSA9IG1vZGVsPG51bWJlcj4oMCk7XG4gIHJlYWRvbmx5IGRpc2FibGUgPSBpbnB1dDxib29sZWFuPihmYWxzZSk7XG5cbiAgLy8gI3JlZ2lvbiBPVVRQVVRcbiAgcmVhZG9ubHkgb3V0Q2hhbmdlID0gb3V0cHV0PElCdXR0b24+KCk7XG4gIHJlYWRvbmx5IG91dEZ1bmN0aW9uc0NvbnRyb2wgPSBvdXRwdXQ8SVBvcG92ZXJGdW5jdGlvbkNvbnRyb2xFdmVudD4oKTtcblxuICAvKiBGVU5DVElPTlMgKi9cbiAgcHJvdGVjdGVkIGFzeW5jIGhhbmRsZXJDbGlja0J1dHRvbihpbmRleDogbnVtYmVyLCBidXR0b246IElCdXR0b24pIHtcbiAgICBpZiAodGhpcy5pbmRleEFjdGl2ZSgpID09PSBpbmRleCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLmluZGV4QWN0aXZlLnNldChpbmRleCk7XG4gICAgdGhpcy5vdXRDaGFuZ2UuZW1pdChidXR0b24pO1xuICB9XG5cbiAgcHJvdGVjdGVkIGFzeW5jIGhhbmRsZXJGdW5jdGlvbnNDb250cm9sKGNvbnRyb2w6IElQb3BvdmVyRnVuY3Rpb25Db250cm9sRXZlbnQpIHtcbiAgICB0aGlzLm91dEZ1bmN0aW9uc0NvbnRyb2wuZW1pdChjb250cm9sKTtcbiAgICB0aGlzLmZ1bmN0aW9uc0NvbnRyb2xQb3BvdmVyLnNldChjb250cm9sKTtcbiAgfVxuXG4gIHB1YmxpYyBnZXQgRnVuY3Rpb25zQ29udHJvbCgpOiBJUG9wb3ZlckZ1bmN0aW9uQ29udHJvbEV2ZW50IHwgdW5kZWZpbmVkIHtcbiAgICByZXR1cm4gdGhpcy5mdW5jdGlvbnNDb250cm9sUG9wb3ZlcigpO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwibGlicy11aS1idXR0b25zLWdyb3VwXCI+XG4gIEBmb3IgKGJ1dHRvbiBvZiBidXR0b25zKCk7IHRyYWNrIGJ1dHRvbikge1xuICAgIDxsaWJzX3VpLWNvbXBvbmVudHMtYnV0dG9ucy1idXR0b25cbiAgICAgIFt0eXBlXT1cImluZGV4QWN0aXZlKCkgPT09ICRpbmRleCA/ICdidXR0b24tcHJpbWFyeScgOiAnYnV0dG9uLXByaW1hcnktcmV2ZXJ0J1wiXG4gICAgICBbbGFiZWxdPVwiYnV0dG9uLmxhYmVsIHx8ICcnXCJcbiAgICAgIFtkaXNhYmxlXT1cImRpc2FibGUoKSB8fCBidXR0b24uZGlzYWJsZSB8fCBmYWxzZVwiXG4gICAgICBbY2xhc3NJY29uTGVmdF09XCJidXR0b24uY2xhc3NJY29uTGVmdCB8fCAnJ1wiXG4gICAgICBbY2xhc3NJbmNsdWRlXT1cImJ1dHRvbi5jbGFzc0luY2x1ZGUgfHwgJydcIlxuICAgICAgW2NsYXNzSWNvblJpZ2h0XT1cImJ1dHRvbi5jbGFzc0ljb25SaWdodCB8fCAnJ1wiXG4gICAgICBbcG9wb3Zlcl09XCJidXR0b24ucG9wb3ZlciB8fCB7fVwiXG4gICAgICBbaWNvbk9ubHlUeXBlXT1cImJ1dHRvbi5pY29uT25seVR5cGUgfHwgZmFsc2VcIlxuICAgICAgKG91dEZ1bmN0aW9uc0NvbnRyb2wpPVwiaGFuZGxlckZ1bmN0aW9uc0NvbnRyb2woJGV2ZW50KVwiXG4gICAgICAob3V0Q2xpY2spPVwiaGFuZGxlckNsaWNrQnV0dG9uKCRpbmRleCwgYnV0dG9uKVwiIC8+XG4gIH1cbjwvZGl2PlxuIl19

package/fesm2022/libs-ui-components-buttons-group.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { signal, input, model, output, ChangeDetectionStrategy, Component } from '@angular/core';
+import { signal, input, model, output, Component, ChangeDetectionStrategy } from '@angular/core';
 import { LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';
 import { TranslateModule } from '@ngx-translate/core';
@@ -28,11 +28,11 @@ class LibsUiComponentsButtonsGroupComponent {
         return this.functionsControlPopover();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsButtonsGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsButtonsGroupComponent, isStandalone: true, selector: "libs_ui-components-buttons-group", inputs: { buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: true, transformFunction: null }, indexActive: { classPropertyName: "indexActive", publicName: "indexActive", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { indexActive: "indexActiveChange", outChange: "outChange", outFunctionsControl: "outFunctionsControl" }, ngImport: i0, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsButtonsGroupComponent, isStandalone: true, selector: "libs_ui-components-buttons-group", inputs: { buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: true, transformFunction: null }, indexActive: { classPropertyName: "indexActive", publicName: "indexActive", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { indexActive: "indexActiveChange", outChange: "outChange", outFunctionsControl: "outFunctionsControl" }, ngImport: i0, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      [iconOnlyType]=\"button.iconOnlyType || false\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive", "isHandlerEnterDocumentClickButton"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsButtonsGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'libs_ui-components-buttons-group', standalone: true, imports: [TranslateModule, LibsUiComponentsButtonsButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"] }]
+            args: [{ selector: 'libs_ui-components-buttons-group', standalone: true, imports: [TranslateModule, LibsUiComponentsButtonsButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"libs-ui-buttons-group\">\n  @for (button of buttons(); track button) {\n    <libs_ui-components-buttons-button\n      [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n      [label]=\"button.label || ''\"\n      [disable]=\"disable() || button.disable || false\"\n      [classIconLeft]=\"button.classIconLeft || ''\"\n      [classInclude]=\"button.classInclude || ''\"\n      [classIconRight]=\"button.classIconRight || ''\"\n      [popover]=\"button.popover || {}\"\n      [iconOnlyType]=\"button.iconOnlyType || false\"\n      (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n      (outClick)=\"handlerClickButton($index, button)\" />\n  }\n</div>\n", styles: [":host ::ng-deep .libs-ui-buttons-group{display:flex}:host ::ng-deep .libs-ui-buttons-group .libs-ui-button-disable{border:1px solid var(--libs-ui-button-other-color-border, #226ff5)!important}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button:hover{border-radius:0;border-left:0}:host ::ng-deep .libs-ui-buttons-group>:not(:first-child):not(:last-child) libs_ui-components-popover .libs-ui-button-disable{border-left:0!important}:host ::ng-deep .libs-ui-buttons-group>:first-child libs_ui-components-popover .libs-ui-button{border-radius:4px 0 0 4px}:host ::ng-deep .libs-ui-buttons-group>:last-child libs_ui-components-popover .libs-ui-button{border-left:0!important;border-radius:0 4px 4px 0}\n"] }]
         }] });
 /**

package/fesm2022/libs-ui-components-buttons-group.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"libs-ui-components-buttons-group.mjs","sources":["../../../../../../libs-ui/components/buttons/group/src/group.component.ts","../../../../../../libs-ui/components/buttons/group/src/group.component.html","../../../../../../libs-ui/components/buttons/group/src/libs-ui-components-buttons-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, model, output, signal } from '@angular/core';\nimport { IButton, LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';\nimport { IPopoverFunctionControlEvent } from '@libs-ui/components-popover';\nimport { TranslateModule } from '@ngx-translate/core';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-buttons-group',\n templateUrl: './group.component.html',\n styleUrl: './group.component.scss',\n standalone: true,\n imports: [TranslateModule, LibsUiComponentsButtonsButtonComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class LibsUiComponentsButtonsGroupComponent {\n private functionsControlPopover = signal<IPopoverFunctionControlEvent \| undefined>(undefined);\n\n // #region INPUT\n readonly buttons = input.required<Array<IButton>>();\n readonly indexActive = model<number>(0);\n readonly disable = input<boolean>(false);\n\n // #region OUTPUT\n readonly outChange = output<IButton>();\n readonly outFunctionsControl = output<IPopoverFunctionControlEvent>();\n\n /* FUNCTIONS /\n protected async handlerClickButton(index: number, button: IButton) {\n if (this.indexActive() === index) {\n return;\n }\n this.indexActive.set(index);\n this.outChange.emit(button);\n }\n\n protected async handlerFunctionsControl(control: IPopoverFunctionControlEvent) {\n this.outFunctionsControl.emit(control);\n this.functionsControlPopover.set(control);\n }\n\n public get FunctionsControl(): IPopoverFunctionControlEvent \| undefined {\n return this.functionsControlPopover();\n }\n}\n","<div class=\"libs-ui-buttons-group\">\n @for (button of buttons(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n [label]=\"button.label \|\| ''\"\n [disable]=\"disable() \|\| button.disable \|\| false\"\n [classIconLeft]=\"button.classIconLeft \|\| ''\"\n [classInclude]=\"button.classInclude \|\| ''\"\n [classIconRight]=\"button.classIconRight \|\| ''\"\n [popover]=\"button.popover \|\| {}\"\n (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n (outClick)=\"handlerClickButton($index, button)\" />\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;MAca,qCAAqC,CAAA;~~AACxC~~,IAAA,uBAAuB,GAAG,MAAM,CAA2C,SAAS,CAAC;;~~AAGpF~~,IAAA,OAAO,GAAG,KAAK,CAAC,QAAQ,EAAkB;~~AAC1C~~,IAAA,WAAW,GAAG,KAAK,CAAS,CAAC,CAAC;~~AAC9B~~,IAAA,OAAO,GAAG,KAAK,CAAU,KAAK,CAAC;;~~IAG/B~~,SAAS,GAAG,MAAM,EAAW;~~IAC7B~~,mBAAmB,GAAG,MAAM,EAAgC;;~~AAG3D~~,IAAA,MAAM,kBAAkB,CAAC,KAAa,EAAE,MAAe,EAAA;AAC/D,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;YAChC;~~QACF~~;~~AACA~~,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC;~~AAC3B~~,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC;~~IAC7B~~;~~IAEU~~,MAAM,uBAAuB,CAAC,OAAqC,EAAA;AAC3E,QAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC;~~AACtC~~,QAAA,IAAI,CAAC,uBAAuB,CAAC,GAAG,CAAC,OAAO,CAAC;~~IAC3C~~;~~AAEA~~,IAAA,IAAW,gBAAgB,GAAA;AACzB,QAAA,OAAO,IAAI,CAAC,uBAAuB,EAAE;~~IACvC~~;~~wGA5BW~~,qCAAqC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAArC,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qCAAqC,~~EAAA~~,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kCAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,~~ECdlD~~,~~6oBAcA~~,~~EAAA~~,MAAA,EAAA,CAAA,i5BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,~~EDHY~~,eAAe,+BAAE,sCAAsC,EAAA,QAAA,EAAA,mCAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,MAAA,EAAA,cAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,WAAA,EAAA,cAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,SAAA,EAAA,4BAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,eAAA,EAAA,aAAA,EAAA,yBAAA,EAAA,+BAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,mCAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,EAAA,iBAAA,EAAA,qBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;4FAGtD,qCAAqC,EAAA,UAAA,EAAA,CAAA;kBATjD,SAAS;+BAEE,kCAAkC,EAAA,UAAA,EAGhC,IAAI,EAAA,OAAA,EACP,CAAC,eAAe,EAAE,sCAAsC,CAAC,EAAA,eAAA,EACjD,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,~~6oBAAA~~,EAAA,MAAA,EAAA,CAAA,i5BAAA,CAAA,EAAA;;;AEZjD;;AAEG;;;;"}
1	+ {"version":3,"file":"libs-ui-components-buttons-group.mjs","sources":["../../../../../../libs-ui/components/buttons/group/src/group.component.ts","../../../../../../libs-ui/components/buttons/group/src/group.component.html","../../../../../../libs-ui/components/buttons/group/src/libs-ui-components-buttons-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, input, model, output, signal } from '@angular/core';\nimport { IButton, LibsUiComponentsButtonsButtonComponent } from '@libs-ui/components-buttons-button';\nimport { IPopoverFunctionControlEvent } from '@libs-ui/components-popover';\nimport { TranslateModule } from '@ngx-translate/core';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'libs_ui-components-buttons-group',\n templateUrl: './group.component.html',\n styleUrl: './group.component.scss',\n standalone: true,\n imports: [TranslateModule, LibsUiComponentsButtonsButtonComponent],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class LibsUiComponentsButtonsGroupComponent {\n private readonly functionsControlPopover = signal<IPopoverFunctionControlEvent \| undefined>(undefined);\n\n // #region INPUT\n readonly buttons = input.required<Array<IButton>>();\n readonly indexActive = model<number>(0);\n readonly disable = input<boolean>(false);\n\n // #region OUTPUT\n readonly outChange = output<IButton>();\n readonly outFunctionsControl = output<IPopoverFunctionControlEvent>();\n\n /* FUNCTIONS /\n protected async handlerClickButton(index: number, button: IButton) {\n if (this.indexActive() === index) {\n return;\n }\n this.indexActive.set(index);\n this.outChange.emit(button);\n }\n\n protected async handlerFunctionsControl(control: IPopoverFunctionControlEvent) {\n this.outFunctionsControl.emit(control);\n this.functionsControlPopover.set(control);\n }\n\n public get FunctionsControl(): IPopoverFunctionControlEvent \| undefined {\n return this.functionsControlPopover();\n }\n}\n","<div class=\"libs-ui-buttons-group\">\n @for (button of buttons(); track button) {\n <libs_ui-components-buttons-button\n [type]=\"indexActive() === $index ? 'button-primary' : 'button-primary-revert'\"\n [label]=\"button.label \|\| ''\"\n [disable]=\"disable() \|\| button.disable \|\| false\"\n [classIconLeft]=\"button.classIconLeft \|\| ''\"\n [classInclude]=\"button.classInclude \|\| ''\"\n [classIconRight]=\"button.classIconRight \|\| ''\"\n [popover]=\"button.popover \|\| {}\"\n [iconOnlyType]=\"button.iconOnlyType \|\| false\"\n (outFunctionsControl)=\"handlerFunctionsControl($event)\"\n (outClick)=\"handlerClickButton($index, button)\" />\n }\n</div>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;MAca,qCAAqC,CAAA;AAC/B,IAAA,uBAAuB,GAAG,MAAM,CAA2C,SAAS,CAAC,CAAC;;AAG9F,IAAA,OAAO,GAAG,KAAK,CAAC,QAAQ,EAAkB,CAAC;AAC3C,IAAA,WAAW,GAAG,KAAK,CAAS,CAAC,CAAC,CAAC;AAC/B,IAAA,OAAO,GAAG,KAAK,CAAU,KAAK,CAAC,CAAC;;IAGhC,SAAS,GAAG,MAAM,EAAW,CAAC;IAC9B,mBAAmB,GAAG,MAAM,EAAgC,CAAC;;AAG5D,IAAA,MAAM,kBAAkB,CAAC,KAAa,EAAE,MAAe,EAAA;AAC/D,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;YAChC,OAAO;SACR;AACD,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;AAC5B,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAC7B;IAES,MAAM,uBAAuB,CAAC,OAAqC,EAAA;AAC3E,QAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;AACvC,QAAA,IAAI,CAAC,uBAAuB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;KAC3C;AAED,IAAA,IAAW,gBAAgB,GAAA;AACzB,QAAA,OAAO,IAAI,CAAC,uBAAuB,EAAE,CAAC;KACvC;wGA5BU,qCAAqC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArC,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qCAAqC,ECdlD,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kCAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,osBAeA,EDJY,MAAA,EAAA,CAAA,i5BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,eAAe,+BAAE,sCAAsC,EAAA,QAAA,EAAA,mCAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,MAAA,EAAA,cAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,WAAA,EAAA,cAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,SAAA,EAAA,4BAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,eAAA,EAAA,aAAA,EAAA,yBAAA,EAAA,+BAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,mCAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,EAAA,iBAAA,EAAA,qBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAGtD,qCAAqC,EAAA,UAAA,EAAA,CAAA;kBATjD,SAAS;+BAEE,kCAAkC,EAAA,UAAA,EAGhC,IAAI,EAAA,OAAA,EACP,CAAC,eAAe,EAAE,sCAAsC,CAAC,EAAA,eAAA,EACjD,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,osBAAA,EAAA,MAAA,EAAA,CAAA,i5BAAA,CAAA,EAAA,CAAA;;;AEZjD;;AAEG;;;;"}

package/group.component.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import { IButton } from '@libs-ui/components-buttons-button';
 import { IPopoverFunctionControlEvent } from '@libs-ui/components-popover';
 import * as i0 from "@angular/core";
 export declare class LibsUiComponentsButtonsGroupComponent {
-    private functionsControlPopover;
+    private readonly functionsControlPopover;
     readonly buttons: import("@angular/core").InputSignal<IButton[]>;
     readonly indexActive: import("@angular/core").ModelSignal<number>;
     readonly disable: import("@angular/core").InputSignal<boolean>;

package/package.json CHANGED Viewed

@@ -1,10 +1,10 @@
 {
   "name": "@libs-ui/components-buttons-group",
-  "version": "0.2.356-9",
+  "version": "0.2.357-1",
   "peerDependencies": {
     "@angular/core": ">=18.0.0",
-    "@libs-ui/components-buttons-button": "0.2.356-9",
-    "@libs-ui/components-popover": "0.2.356-9",
+    "@libs-ui/components-buttons-button": "0.2.357-1",
+    "@libs-ui/components-popover": "0.2.357-1",
     "@ngx-translate/core": "^15.0.0"
   },
   "sideEffects": false,