@3ddv/software-division-components 1.0.0-alpha.3 → 1.0.0-alpha.3.10

package/README.md

@@ -1,14 +1,14 @@
-# **Software Division Components**
+# Software Division Components
 
-## **Overview**
+## Overview
 
 ![Angular Badge](https://img.shields.io/badge/Angular-18.2.13-dd0031?logo=angular&style=for-the-badge)
 ![PrimeNG Badge](https://img.shields.io/badge/PrimeNG-18.0.2-034efc?logo=primeng&style=for-the-badge)
 ![Storybook Badge](https://img.shields.io/badge/Storybook-8.4.5-ff4785?logo=storybook&style=for-the-badge)
 
-The Software Division Components library is a wrapper around the [PrimeNG](https://v18.primeng.org/installation) component library. It enhances PrimeNG components by providing additional functionality tailored to the common requirements of applications developed within the Software Division department. It also uses [Angular](https://v18.angular.dev/) for application development and [Storybook](https://storybook.js.org/) for interactive component documentation and testing.
+The Software Division Components library is a wrapper around the [PrimeNG](https://v18.primeng.org/installation) component library that provides extra functionality based on common needs within the Software Division department applications. It also uses [Angular](https://v18.angular.dev/) and [Storybook](https://storybook.js.org/).
 
-## **Installation**
+## Installation
 
 To install the library, use npm:
 
@@ -16,216 +16,88 @@ To install the library, use npm:
  npm install @3ddv/software-division-components
 ```
 
-## **Reporting issues**
-
-> **Note: This is a temporary workflow for reporting issues. As the usage of the library increases, we will reassess and scale the issue reporting system accordingly.**
-
-To report an issue, please visit [the following ticket](https://mmcbcn.atlassian.net/browse/TICKETING-598) and create a **Bug** ticket. Ensure that your report includes a clear and detailed description of the issue you are encountering..
-
-## **Project summary**
-
-The source folder of this project contains multiple subfolders. Below are the most important ones:
-
-- **Backoffice**
-  This folder contains components that are **exclusive to the backoffice setting**, such as tables or sidebars. These components do **not** receive any styling from the theme class passed on initialization (be it `generic` or `backoffice`).
-
-  Some components from the Generic folder can also be used in the backoffice, but in such cases, the backoffice theme must be passed to the library provider. This ensures that no additional styles are applied, keeping the default PrimeNG design intact.
-
-- **DVM**
-  This folder includes components specific to applications that use **DVM**. Many of these components share both style and functionality, and this module is designed to **maximize reusability**. Examples include the **section navigator buttons** and the **minimap**.
-
-- **Generic**
-  This folder contains components which can be used in **any** setting. The appearance of these components relies heavily on the parameter that is passed to the library provider (generic or backoffice).
-
-- **Shared**
-  This folder contains **initialization methods, directives and shared utilities, which are exposed to the library API**, like methods to aid with the usage of the library or debugging of the library.
-
-- **Utils**
-  This folder contains **internal tools** which can also be shared across the library, but this is more directed to functions used by the developer to **streamline processes and reuse common logic**.
-
-## **Common library errors**
-
-**❌ Error: `Invalid CSS class string found on ...`**
-
-This indicates that the `stylesClasses` input that you provided to the component does not have a valid format.
-
-**✅ Solution:**
-Ensure that the value assigned to `styleClasses` follows the correct format as documented in the respective component's guidelines.
-
-If the issue persists, refer to the documentation or check for any unintended modifications in the `styleClasses` input.
-
----
-
-> Any future errors will be documented here
-
----
-
-## **How to use the library from the consuming application**
+## Usage
 
 ### Theming and styling
 
-This library is a wrapper to an already existing component library (PrimeNG), which means that there are some styles that are already present in all the exported components. These styles are kept intact whenever the `backoffice` theme parameter is passed to the `provideSdc` method. You also have the option of passing the `generic` parameter, which in turn makes the component align to the design that several ticketing applications share. If no parameter is passed, the `generic` is assigned as a fallback option. You can check that design [here](https://xd.adobe.com/view/0ea7033e-8fdf-4fcd-8215-546d1df20d37-5bf4/), [here](https://xd.adobe.com/view/c640d5a1-b5d3-4379-8684-fb860f95f052-9313/grid) and [here](https://xd.adobe.com/view/50a2d5c5-e2e1-413f-b7a5-8f3d61c88026-05f1/screen/65dee679-9942-4a63-b790-40e3b1fec39b/).
+This library is a wrapper to an already existing component library, so there are some styles which are already present in all the components. These styles are kept intact whenever the `backoffice` theme parameter is passed. You also have the option of passing the `generic` parameter, which in turn makes the component align to the design that several ticketing applications share. You can check that design [here](https://xd.adobe.com/view/0ea7033e-8fdf-4fcd-8215-546d1df20d37-5bf4/) and [here](https://xd.adobe.com/view/c640d5a1-b5d3-4379-8684-fb860f95f052-9313/grid).
 
-Styling components consist of passing down CSS classes that consist of PrimeNG variables. Go by as if you were styling a common HTML element. Every component has a `styleClasses` input which accepts a single or several whitespace-separated CSS class/classes declared within the using application. To see the variables that each component has, please check the official PrimeNG documentation per each component. Here you can see an example for the (button component)[https://primeng.org/button]. The column _Variable_ includes every single class that you can use within the your CSS classes which you will later pass into the library button to style it. The result looks as follows:
+Styling components works as if you were styling a usual HTML element. Every component has a `styleClasses` input which accepts a single or several whitespace-separated CSS class/classes declared within the using application.
 
 ```css
 .my-class {
-  --p-button-primary-background: red;
-}
-```
-
-```html
-<sdc-button styleClasses="my-class"></sdc-button>
-```
-
-#### Specifity issues
-
-If you are facing any specifity problems, each component also has an ID reference so you can later add them on your styles composition, giving advantage to the specifity algorithm to prioritize your styles:
-
-```css
-#sdc-button.my-class {
-  --p-button-primary-background: red;
+  background-color: red;
 }
 ```
 
-#### Encapsulation issues
-
-Most of the time you will be declaring your styles with a CSS file declared within the component scope (my-component.component.css) and later import it with _styleUrl_ or _stylesUrl_ in your component. In that scenario, you will be dealing with the default (component View Encapsulation)[https://angular.dev/guide/components/styling] setting, which does not allow a parent component to apply styles to the child component. This brings a problem when it comes to passing down CSS classes to the library components. Following similar practices from other component librareis, we bring the option to bypass View Encapsulation for a certain CSS class by declaring your classes with a pseudo-class selector:
-
-Depending on the Encapsulation option that you are using in your component, some styles will not apply. In that scenario, declare the style as follows:
-
-```css
-::ng-deep.my-class {
-  --p-button-primary-background: red;
-}
-```
-
-You also have the option with SCSS to nest:
-
-```css
-::ng-deep {
-  &.my-class-1 {
-    --p-button-primary-background: red;
-  }
-  &.my-class-2 {
-    --p-button-primary-background: green;
-  }
-
-  &.my-class-3 {
-    --p-button-primary-background: blue;
-  }
-}
-```
-
-Or declare the style in your root stylesheet to avoid any view encapsulation to affect your custom styles. (not recommended)
-
-#### Several styleClasses inputs
-
-Some components are composed of several underlying components, so a single `styleClass` input will not be enough. For those scenarios, some components require the `styleClasses` paramater to be composed of an object, with each key targetting different parts of the component:
+```typescript
+ <sdc-button
+  styleClasses='my-class'
+ ></sdc-button>
 
-```html
-<sdc-neighbours
-  [currentSection]="..."
-  [sectionsMmcToTdc]="..."
-  [neigboursData]="..."
-  [styleClasses]=`{
-    sideButtonsClass: 'mock-side-button',
-    middleDivClass: 'mock-middle-div'
-  }`
-></sdc-neighbours>
 ```
 
-With this method, we are able to apply certain styles for the buttons on the sides ( with `sideButtonsClass`) and a different one for the `div` on the middle of the component template (with `middleDivClass`).
-
 Styles will pierce through the PrimeNG layer and directly style the underlying HTML element. If you are facing any problem styling any component, please check the [official PrimeNG documentation on theming](https://v18.primeng.org/theming) or the individual webpage for styling each component [as in this example for the button component](https://v18.primeng.org/button).
 
-### What if I'm using Tailwind in my application?
+### Importing the library
 
-Tailwind does reset most of the styles that any other third party app is applying, so PrimeNG styles will be overriden. In that scenario, the component library exposes several layers to scope this overriding as much as posible. If you are using Tailwind, declare the Tailwind reset as follows in your root stylesheet:
+#### Setting a theme
 
-```css
-@layer tailwind-base {
-  @tailwind base;
-  @tailwind components;
-}
+```ts
+import { ApplicationConfig } from '@angular/core';
+import { provideSdComponentsTheme } from '@3ddv/software-division-components';
 
-@tailwind utilities;
+export const appConfig: ApplicationConfig = {
+  // this can be generic or backoffice
+  providers: [provideSdComponentsTheme({ theme: 'generic' })],
+};
 ```
 
-TODO: DOCUMENT TAILWIND OPTION
-
-### Passing inputs to components that have a lot of props
-
-Besides all the documented inputs that components have, some components also have the option to pass all components in an object to end up with a more concise template markup, instead of using individual bindings.
+#### Import from main entry
 
-> The components that provide this functionality are usually the ones that have a more direct representation within PrimeNG, as this is intended to solve the polution that the library creates due to it having so many inputs. An example would be the **ButtonComponent**.
+```typescript
+import { TableComponent, ButtonComponent } from '@3ddv/software-division-components';
+```
 
-This is the old markup:
+#### Import from secondary entry
 
-```html
-<sdc-button
-  type="button"
-  label="Hover to trigger"
-  ariaLabel="Hover to trigger"
-  tooltip="You triggered the tooltip"
-  tooltipPos="right"
-  severity="primary"
-  styleClasses="tooltip-padding" />
+```typescript
+import { ButtonComponent } from '@3ddv/software-division-components/generic/button';
 ```
 
-And this is the example with the configuration object:
+## **Reporting issues**
 
-```ts
-import { ButtonProps } from '@3ddv/software-division-components';
+> **This is a temporary workflow to report issues until the usage of the library grows and we find ourselves in the need to scale this issue reporting system.**
 
-class MyComponent {
-  // You can of course declare, this where it better suits your use case
-  protected props = {
-    type: 'button',
-    label: 'Hover to trigger',
-    ariaLabel: 'Hover to trigger',
-    severity: 'primary',
-    tooltip: 'You triggered the tooltip',
-    tooltipPos: 'right',
-    styleClasses: 'tooltip-padding',
-  } satisfies ButtonProps;
-}
-```
+To report an issue, please visit [the following ticket](https://mmcbcn.atlassian.net/browse/TICKETING-598) and open a Bug ticket with a clear description of the issue you are facing.
 
-And the resulting HTML:
+## **Project summary**
 
-```html
-<sdc-button [props]="{props}" />
-```
+This project source folder contains multiple folders, the most important are the following:
 
-### Importing the library
+- **Backoffice**
+  This folder contains components that are exclusive to the backoffice setting, such as tables or sidebars. These components do not receive any styling from the theme class passed on initialization (be it `generic` or `backoffice`). There are some components in the Generic folder which can also be used in the backoffice, but please do so by passing the `backoffice` theme to the library provider. The `backoffice` parameter tells the system to not apply any styles to the components, keeping the design to the one PrimeNG already has by default.
 
-#### Providing the library to the application
+- **DVM**
+  This folder contains components that are exclusive to an application that uses DVM. There are a lot of components that are common both in style and functionality, and this module aims to reuse those as much as posible. Some examples of these components are the section navigator buttons or the minimap.
 
-```ts
-import { ApplicationConfig } from '@angular/core';
-import { provideSdc } from '@3ddv/software-division-components';
+- **Generic**
+  This folder contains components which can be used in any setting. The appearance of these components relies heavily on the parameter that is passed to the library provider (generic or backoffice).
 
-export const appConfig: ApplicationConfig = {
-  // this provides the consuming app with all necessary modules
-  // to make it work
-  providers: [provideSdc({ theme: 'generic' })],
-};
-```
+- **Shared**
+  This folder contains initialization methods, directives and other methods to aid with the usage and debugging of the library.
 
-#### Import from main entry
+- **Utils**
+  This folder contains internal tools which can also be shared across the library, but this is more directed to functions used by the developer to streamline processes and reuse common logic.
 
-```ts
-import { TableComponent, ButtonComponent } from '@3ddv/software-division-components';
-```
+### Common @3ddv/software-division-components errors
 
-#### Import from secondary entry
+#### Error console `Invalid CSS class string found on ...`
 
-```ts
-import { ButtonComponent } from '@3ddv/software-division-components/generic/button';
-```
+This indicates that the `stylesClasses` input that you provided to the component does not have a valid format. Please make sure
+to adhere to a valid format documented in the component.
 
-## **How to collaborate to the library as a developer**
+## **How to collaborate**
 
 ### Semantic versioning
 
@@ -264,6 +136,8 @@ If the commit message does not adhere to the Conventional Commits format, Commit
 
 - Rinse and repeat.
 
+## **How to document your changes**
+
 ### Documenting component files
 
 When documenting your code changes, we use JSDoc to ensure that all JavaScript functions and components are described comprehensively. This helps maintain clarity and understandability throughout the codebase.
@@ -303,132 +177,12 @@ export class ButtonComponent extends Button {
    */
   public handleClick(event: MouseEvent): void {
     // Implementation should document any steps that cannot be easily explained
-    // with variable names. Another scenario on why you would add comments includes documenting why things
+    // with variable names. Another scenario might be on documenting why things
     // are done the way they are done (there might be some framework or language limitation).
   }
 }
 ```
 
-### Internally overriding PrimeNG styles with component scope
-
-> First of all, we would like to clarify that this is a different feature from the previously mentioned `styleClasses` feature. Style classes are thought of as a styling interface for the users of the library. This feature is to be used for developers working on component development and wanting to override any styles of PrimeNG components, so custom components adhere to the styling required.
-
-In some cases, specially if we are developing a component placed within the `generic` scope, we will need to override any required native styles from PrimeNG to be able to adhere to the design provided by our design team.
-
-PrimeNG provides us with a tool called [Design Tokens](https://v18.primeng.org/theming), which consists of a CSS-in-JS solution that composes a nested object which targets several styles of each component. Here is an example corresponding to the Neighbours component:
-
-```ts
-// Import types from PrimeNG module
-import { ButtonDesignTokens } from '@primeng/themes/types/button';
-
-// Create an export an object which will later by used in neighbours.components.ts
-export const sideButtonTokens = {
-  root: {
-    primary: {
-      // Overwrite the theme  variables with PrimeNG existing variables
-      // Button text
-      color: '',
-      borderColor: '{zinc.50}',
-      hoverColor: '',
-      activeColor: '',
-      // Button background
-      background: '{zinc.50}',
-      hoverBackground: '{zinc.50}',
-      activeBackground: '{zinc.50}',
-      // Button border
-      activeBorderColor: '{zinc.50}',
-      hoverBorderColor: '{zinc.50}',
-    },
-  },
-} satisfies ButtonDesignTokens;
-```
-
-And we pass in the styles within the component template
-
-```ts
-import { sideButtonTokens } from './styles/side-button.tokens';
-....
-export class NeighboursComponent {
-  ...
-    protected readonly sideButtonStyle = sideButtonTokens;
-  ...
-}
-```
-
-Template example:
-
-```html
-<!-- [dt] is a default input which is present in all components to declare PrimeNG design tokens -->
-<sdc-button [dt]="sideButtonStyle" />
-```
-
-This way, we accomplished adhering to the styling that this component needed, which brings this result:
-
-<div style="display: flex; align-items: center; gap: 20px;">
-  <div style="text-align: center;">
-    <p>Before Styling</p>
-    <img src="./projects/software-division-components/public/neighbours-before.png" alt="Before styling neighbours." width="300">
-  </div>
-  <div style="text-align: center;">
-    <p>After Styling</p>
-    <img src="./projects/software-division-components/public/neighbours-after.png" alt="After styling neighbours." width="300">
-  </div>
-</div>
-
-### Styling native HTML elements
-
-For styling native HTML elements in our project, we adhere to the **Block-Element-Modifier (BEM)** methodology. This ensures that our styles remain modular, maintainable, and predictable.
-
-#### Guidelines for Using BEM
-
-- **Use BEM for anything that is not a design token.**
-
-  - Design tokens (e.g., colors, typography, spacing) should be handled via variables, custom properties, or a design system, not through BEM class names.
-
-- **Use design tokens for everything that involves styling a native PrimeNG component.**
-
-  - PrimeNG components already use design tokens, so we must align with them instead of defining custom BEM classes.
-
-- **Native HTML elements must always be styled using BEM classes.**
-  - Avoid styling elements directly by tag selectors (e.g., button {} or input {}), as this can lead to specificity conflicts and unintended side effects.
-- **Structure your class names properly:**
-  - Use meaningful blocks that represent standalone components.
-  - Define elements as child parts of blocks.
-  - Use modifiers to indicate variations in style or behavior.
-
-By following this approach, we ensure that:
-
-- Styles are reusable and scoped properly.
-- We avoid unnecessary global overrides.
-- We maintain consistency across the project.
-- PrimeNG components remain compatible with design tokens.
-
-Any further information regarding the BEM methodology can be found through the following links:
-
-- https://css-tricks.com/bem-101/
-- https://getbem.com/introduction/
-- https://stackoverflow.com/questions/36703546/what-is-bem-methodology
-- https://gauravmahlawat.github.io/online-bem-generator.html#google_vignette
-
-#### Why are we not internally using Tailwind or SCSS?
-
-###### Why no Tailwind?
-
-We are not internally using Tailwind because this project has the intention of having a long lifespan, we do not want to introduce an extra dependency that could cause compatibility issues with PrimeNG, Angular, and Storybook.
-Since our project already relies on component libraries that define their own styles and classes, Tailwind’s utility-based approach could lead to conflicts and unnecessary complexity. For all we know, Tailwind is more likely to not be that popular in the near future than native CSS :).
-
-However, we have included in the roadmap the ability to pass Tailwind classes within the `styleClasses` prop, present in most components so you can use Tailwind from your consuming application.
-
-###### Why no SCSS?
-
-We are not using SCSS because modern CSS now provides most of SCSS’s features natively.
-With CSS evolving rapidly (e.g., CSS variables, nesting, container queries, @layer, @scope, and :has()), there is little need for a preprocessor like SCSS.
-Additionally, relying on native CSS ensures:
-
-- Better browser compatibility.
-- No build-step dependencies.
-- Future-proof styling that aligns with upcoming CSS standards.
-
 ### Properly exporting a newly added component
 
 Whenever a newly added component is added, do not forget to add a secondary entrypoint to be able to uniquely import that component in the consuming app:

package/backoffice/table/table.component.d.ts

@@ -3,25 +3,12 @@ import { MenuItem } from 'primeng/api';
 import { Table } from 'primeng/table';
 import { ObjectColumnData } from './types';
 import * as i0 from "@angular/core";
-/**
- * A customizable table component built on PrimeNG's Table.
- *
- * This component extends the PrimeNG Table by introducing additional configurations and styling
- * capabilities. It supports defining column data, enabling sorting, exporting data, and integrating
- * context menu options for enhanced user interactions. Additionally, the component allows for dynamic
- * styling through custom CSS classes and leverages Angular's standalone component pattern with OnPush
- * change detection for performance optimization.
- *
- * @since 1.0.0-alpha.2
- * @updated 1.0.0-alpha.2
- */
 export declare class TableComponent extends Table implements OnInit {
-    props: import("@angular/core").InputSignal<typeof Table | undefined>;
     /**
      * Single string or whitespace-separated string of additional style classes for the button.
      * Only accepts valid whitespace-separated class names.
      */
-    styleClasses: import("@angular/core").InputSignalWithTransform<string | Record<string, string>, string | Record<string, string>>;
+    styleClasses: import("@angular/core").InputSignalWithTransform<string, string>;
     columnData: import("@angular/core").InputSignal<ObjectColumnData[]>;
     sortable: import("@angular/core").InputSignal<boolean | undefined>;
     export: import("@angular/core").InputSignal<boolean | undefined>;
@@ -31,6 +18,6 @@ export declare class TableComponent extends Table implements OnInit {
     protected selectedRow: (typeof this.value)[number];
     protected cb(event: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "sdc-table", never, { "props": { "alias": "props"; "required": false; "isSignal": true; }; "styleClasses": { "alias": "styleClasses"; "required": false; "isSignal": true; }; "columnData": { "alias": "columnData"; "required": true; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "export": { "alias": "export"; "required": false; "isSignal": true; }; "exportButtonLabel": { "alias": "exportButtonLabel"; "required": false; "isSignal": true; }; "contextMenuOptions": { "alias": "contextMenuOptions"; "required": false; "isSignal": true; }; "projectedElementIdArray": { "alias": "projectedElementIdArray"; "required": false; "isSignal": true; }; }, {}, never, ["*", "*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "sdc-table", never, { "styleClasses": { "alias": "styleClasses"; "required": false; "isSignal": true; }; "columnData": { "alias": "columnData"; "required": true; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "export": { "alias": "export"; "required": false; "isSignal": true; }; "exportButtonLabel": { "alias": "exportButtonLabel"; "required": false; "isSignal": true; }; "contextMenuOptions": { "alias": "contextMenuOptions"; "required": false; "isSignal": true; }; "projectedElementIdArray": { "alias": "projectedElementIdArray"; "required": false; "isSignal": true; }; }, {}, never, ["*", "*"], true, never>;
 }
 //# sourceMappingURL=table.component.d.ts.map

package/backoffice/table/table.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table.component.d.ts","sourceRoot":"","sources":["../../../projects/software-division-components/src/backoffice/table/table.component.ts"],"names":[],"mappings":"AACA,OAAO,EAA6C,MAAM,EAAE,MAAM,eAAe,CAAC;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAIvC,OAAO,EAAE,KAAK,EAA6B,MAAM,eAAe,CAAC;AAKjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;AAE3C;;;;;;;;;;;GAWG;AACH,qBAkBa,cAAe,SAAQ,KAAM,YAAW,MAAM;IAClD,KAAK,gEAAyB;IACrC;;;OAGG;IACI,YAAY,qHAA+E;IAC3F,UAAU,0DAAwC;IAClD,QAAQ,2DAAoB;IAC5B,MAAM,2DAAoB;IAC1B,iBAAiB,8CAA2B;IAC5C,kBAAkB,8DAAuB;IACzC,uBAAuB,4DAAqB;IAEnD,SAAS,CAAC,WAAW,EAAE,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC;IAEnD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG;yCAhBZ,cAAc;2CAAd,cAAc;CAiB1B"}
+{"version":3,"file":"table.component.d.ts","sourceRoot":"","sources":["../../../projects/software-division-components/src/backoffice/table/table.component.ts"],"names":[],"mappings":"AACA,OAAO,EAA6C,MAAM,EAAE,MAAM,eAAe,CAAC;AAGlF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAIvC,OAAO,EAAE,KAAK,EAA6B,MAAM,eAAe,CAAC;AAGjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;AAE3C,qBAkBa,cAAe,SAAQ,KAAM,YAAW,MAAM;IACzD;;;OAGG;IACI,YAAY,mEAA+E;IAC3F,UAAU,0DAAwC;IAClD,QAAQ,2DAAoB;IAC5B,MAAM,2DAAoB;IAC1B,iBAAiB,8CAA2B;IAC5C,kBAAkB,8DAAuB;IACzC,uBAAuB,4DAAqB;IAEnD,SAAS,CAAC,WAAW,EAAE,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC;IAEnD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG;yCAfZ,cAAc;2CAAd,cAAc;CAgB1B"}

package/backoffice/table/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../projects/software-division-components/src/backoffice/table/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAE7C,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC;AAEjE,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;AAErD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;AACxD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,UAAU,CAAC;IAEjB,IAAI,EAAE,GAAG,EAAE,CAAC;CACb;AACD,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,mBAAmB,CAAC;CAC/B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../projects/software-division-components/src/backoffice/table/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAExC,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAC;AAEjE,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;AAErD,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;AACxD,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,UAAU,CAAC;IAEjB,IAAI,EAAE,GAAG,EAAE,CAAC;CACb;AACD,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,mBAAmB,CAAC;CAC/B"}

package/dvm/public-api.d.ts

@@ -2,7 +2,6 @@ export * from './cart';
 export * from './cart-item';
 export * from './legend';
 export * from './loader';
-export * from './neighbours';
 export * from './popover';
 export * from './stepper';
 export * from './ticket-info-item';

package/dvm/public-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../projects/software-division-components/src/dvm/public-api.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"public-api.d.ts","sourceRoot":"","sources":["../../projects/software-division-components/src/dvm/public-api.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,oBAAoB,CAAC"}

package/esm2022/backoffice/table/components/body-row/body-row.component.mjs

@@ -1,14 +1,32 @@
 import { Component, input } from '@angular/core';
-import { FormatValuePipe } from '../../../../shared/format-value.pipe';
+import { FormatValuePipe } from '../../../../../shared/format-value.pipe.js';
 import * as i0 from "@angular/core";
+const _c0 = ["app-body-row", ""];
+const _forTrack0 = ($index, $item) => $item.field;
+function BodyRowComponent_For_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "td");
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "formatValue");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const col_r1 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(2, 1, ctx_r1.rows()[col_r1.field], col_r1 == null ? null : col_r1.options == null ? null : col_r1.options.pipe), " ");
+} }
 export class BodyRowComponent {
     rows = input.required();
     columns = input.required();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BodyRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BodyRowComponent, isStandalone: true, selector: "[app-body-row]", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@for (col of columns(); track col.field) {\n  <td>\n    {{ rows()[col.field] | formatValue: col?.options?.pipe }}\n  </td>\n}\n", styles: [""], dependencies: [{ kind: "pipe", type: FormatValuePipe, name: "formatValue" }] });
+    static ɵfac = function BodyRowComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || BodyRowComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: BodyRowComponent, selectors: [["", "app-body-row", ""]], inputs: { rows: [1, "rows"], columns: [1, "columns"] }, standalone: true, features: [i0.ɵɵStandaloneFeature], attrs: _c0, decls: 2, vars: 0, template: function BodyRowComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵrepeaterCreate(0, BodyRowComponent_For_1_Template, 3, 4, "td", null, _forTrack0);
+        } if (rf & 2) {
+            i0.ɵɵrepeater(ctx.columns());
+        } }, dependencies: [FormatValuePipe] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BodyRowComponent, decorators: [{
-            type: Component,
-            args: [{ standalone: true, selector: '[app-body-row]', imports: [FormatValuePipe], template: "@for (col of columns(); track col.field) {\n  <td>\n    {{ rows()[col.field] | formatValue: col?.options?.pipe }}\n  </td>\n}\n" }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9keS1yb3cuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc29mdHdhcmUtZGl2aXNpb24tY29tcG9uZW50cy9zcmMvYmFja29mZmljZS90YWJsZS9jb21wb25lbnRzL2JvZHktcm93L2JvZHktcm93LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NvZnR3YXJlLWRpdmlzaW9uLWNvbXBvbmVudHMvc3JjL2JhY2tvZmZpY2UvdGFibGUvY29tcG9uZW50cy9ib2R5LXJvdy9ib2R5LXJvdy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sc0NBQXNDLENBQUM7O0FBVXZFLE1BQU0sT0FBTyxnQkFBZ0I7SUFDcEIsSUFBSSxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQXVCLENBQUM7SUFDN0MsT0FBTyxHQUFHLEtBQUssQ0FBQyxRQUFRLEVBQXNCLENBQUM7d0dBRjNDLGdCQUFnQjs0RkFBaEIsZ0JBQWdCLHVVQ1g3QixpSUFLQSxxRERJWSxlQUFlOzs0RkFFZCxnQkFBZ0I7a0JBUDVCLFNBQVM7aUNBQ0ksSUFBSSxZQUNOLGdCQUFnQixXQUdqQixDQUFDLGVBQWUsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1hdFZhbHVlUGlwZSB9IGZyb20gJy4uLy4uLy4uLy4uL3NoYXJlZC9mb3JtYXQtdmFsdWUucGlwZSc7XG5pbXBvcnQgeyBPYmplY3RDb2x1bW5EYXRhIH0gZnJvbSAnLi4vLi4vdHlwZXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgc2VsZWN0b3I6ICdbYXBwLWJvZHktcm93XScsXG4gIHRlbXBsYXRlVXJsOiAnLi9ib2R5LXJvdy5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2JvZHktcm93LmNvbXBvbmVudC5jc3MnXSxcbiAgaW1wb3J0czogW0Zvcm1hdFZhbHVlUGlwZV0sXG59KVxuZXhwb3J0IGNsYXNzIEJvZHlSb3dDb21wb25lbnQge1xuICBwdWJsaWMgcm93cyA9IGlucHV0LnJlcXVpcmVkPFJlY29yZDxzdHJpbmcsIGFueT4+KCk7XG4gIHB1YmxpYyBjb2x1bW5zID0gaW5wdXQucmVxdWlyZWQ8T2JqZWN0Q29sdW1uRGF0YVtdPigpO1xufVxuIiwiQGZvciAoY29sIG9mIGNvbHVtbnMoKTsgdHJhY2sgY29sLmZpZWxkKSB7XG4gIDx0ZD5cbiAgICB7eyByb3dzKClbY29sLmZpZWxkXSB8IGZvcm1hdFZhbHVlOiBjb2w/Lm9wdGlvbnM/LnBpcGUgfX1cbiAgPC90ZD5cbn1cbiJdfQ==
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BodyRowComponent, [{
+        type: Component,
+        args: [{ standalone: true, selector: '[app-body-row]', imports: [FormatValuePipe], template: "@for (col of columns(); track col.field) {\n  <td>\n    {{ rows()[col.field] | formatValue: col?.options?.pipe }}\n  </td>\n}\n" }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(BodyRowComponent, { className: "BodyRowComponent", filePath: "backoffice/table/components/body-row/body-row.component.ts", lineNumber: 12 }); })();
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9keS1yb3cuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc29mdHdhcmUtZGl2aXNpb24tY29tcG9uZW50cy9zcmMvYmFja29mZmljZS90YWJsZS9jb21wb25lbnRzL2JvZHktcm93L2JvZHktcm93LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NvZnR3YXJlLWRpdmlzaW9uLWNvbXBvbmVudHMvc3JjL2JhY2tvZmZpY2UvdGFibGUvY29tcG9uZW50cy9ib2R5LXJvdy9ib2R5LXJvdy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMkJBQTJCLENBQUM7Ozs7O0lDQTFELDBCQUFJO0lBQ0YsWUFDRjs7SUFBQSxpQkFBSzs7OztJQURILGNBQ0Y7SUFERSwrSkFDRjs7QURRRixNQUFNLE9BQU8sZ0JBQWdCO0lBQ3BCLElBQUksR0FBRyxLQUFLLENBQUMsUUFBUSxFQUF1QixDQUFDO0lBQzdDLE9BQU8sR0FBRyxLQUFLLENBQUMsUUFBUSxFQUFzQixDQUFDOzBHQUYzQyxnQkFBZ0I7NkRBQWhCLGdCQUFnQjtZQ1g3QixxRkFJQzs7WUFKRCxjQUFBLGFBQVMsQ0FJUjs0QkRLVyxlQUFlOztpRkFFZCxnQkFBZ0I7Y0FQNUIsU0FBUzs2QkFDSSxJQUFJLFlBQ04sZ0JBQWdCLFdBR2pCLENBQUMsZUFBZSxDQUFDOztrRkFFZixnQkFBZ0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIGlucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtYXRWYWx1ZVBpcGUgfSBmcm9tICdAc2hhcmVkL2Zvcm1hdC12YWx1ZS5waXBlJztcbmltcG9ydCB7IE9iamVjdENvbHVtbkRhdGEgfSBmcm9tICcuLi8uLi90eXBlcyc7XG5cbkBDb21wb25lbnQoe1xuICBzdGFuZGFsb25lOiB0cnVlLFxuICBzZWxlY3RvcjogJ1thcHAtYm9keS1yb3ddJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2JvZHktcm93LmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vYm9keS1yb3cuY29tcG9uZW50LmNzcyddLFxuICBpbXBvcnRzOiBbRm9ybWF0VmFsdWVQaXBlXSxcbn0pXG5leHBvcnQgY2xhc3MgQm9keVJvd0NvbXBvbmVudCB7XG4gIHB1YmxpYyByb3dzID0gaW5wdXQucmVxdWlyZWQ8UmVjb3JkPHN0cmluZywgYW55Pj4oKTtcbiAgcHVibGljIGNvbHVtbnMgPSBpbnB1dC5yZXF1aXJlZDxPYmplY3RDb2x1bW5EYXRhW10+KCk7XG59XG4iLCJAZm9yIChjb2wgb2YgY29sdW1ucygpOyB0cmFjayBjb2wuZmllbGQpIHtcbiAgPHRkPlxuICAgIHt7IHJvd3MoKVtjb2wuZmllbGRdIHwgZm9ybWF0VmFsdWU6IGNvbD8ub3B0aW9ucz8ucGlwZSB9fVxuICA8L3RkPlxufVxuIl19