Rebranding

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@betha-plataforma/estrutura-componentes",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "Coleção de Web Components para compor a estrutura de uma aplicação front-end da Betha Sistemas.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

src/components.d.ts

@@ -182,6 +182,10 @@ export namespace Components {
         "inline": boolean;
     }
     interface BthMarcaProduto {
+        /**
+          * Define a área de produtos.
+         */
+        "area"?: string;
         /**
           * Configuração de autorização. É necessária para o componente poder se autentizar com os serviços.
          */
@@ -884,6 +888,10 @@ declare namespace LocalJSX {
         "inline"?: boolean;
     }
     interface BthMarcaProduto {
+        /**
+          * Define a área de produtos.
+         */
+        "area"?: string;
         /**
           * Configuração de autorização. É necessária para o componente poder se autentizar com os serviços.
          */

src/components/app/app.scss

@@ -134,7 +134,7 @@ slot[name="container_contexto"] {
   /**
    * @prop --bth-app-menu-bg-color: Cor de fundo do menu horizontal
    */
-  background-color: var(--bth-app-menu-bg-color, #142c48);
+  background-color: var(--bth-app-menu-bg-color);
   color: var(--bth-app-gray-light-40);
   height: 40px;
   grid-area: menu-horizontal;

src/components/app/app.tsx

@@ -53,7 +53,7 @@
   /**
    * Permite customizar a cor de fundo da barra do menu. Por padrão segue a cor da linha dos produtos.
    */
-  @Prop() readonly menuBgColor: string = '#142c48';
+  @Prop() readonly menuBgColor: string;
 
   /**
    * Permite definir um banner que é exibido acima do menu
@@ -515,13 +515,13 @@
 
         {this.possuiBanner() && ([
           <div class="banner__icon">
             <bth-icone icone={this.banner.icone ? this.banner.icone : this.banner.tipo === 'info' ? 'information' : 'alert'}></bth-icone>
           </div>,
           <div class="banner__content">
             <span>{this.banner.texto}</span>
             {!isNill(this.banner.link) && this.banner.link.trim() !== '' && (
               <a href={this.banner.link} target={this.banner.target} title="Mais informações" rel="noreferrer">
                 {this.banner.labelLink ? this.banner.labelLink : 'Mais informações'}
               </a>
             )}
             {!isNill(this.banner.button) && (

src/components/app/readme.md

@@ -98,7 +98,7 @@ As opções do menu podem ser configuradas através de algumas propriedades
 | Property       | Attribute       | Description                                                                                                             | Type          | Default     |
 | -------------- | --------------- | ----------------------------------------------------------------------------------------------------------------------- | ------------- | ----------- |
 | `banner`       | --              | Permite definir um banner que é exibido acima do menu                                                                   | `Banner`      | `undefined` |
-| `menuBgColor`  | `menu-bg-color` | Permite customizar a cor de fundo da barra do menu. Por padrão segue a cor da linha dos produtos.                       | `string`      | `'#142c48'` |
+| `menuBgColor`  | `menu-bg-color` | Permite customizar a cor de fundo da barra do menu. Por padrão segue a cor da linha dos produtos.                       | `string`      | `undefined` |
 | `menuVertical` | `menu-vertical` | Define se as opções do menu serão exibidas no formato "vertical", caso contrário serão exibidas no formato "horizontal" | `boolean`     | `false`     |
 | `opcoes`       | --              | Opções de navegação do menu                                                                                             | `OpcaoMenu[]` | `[]`        |
 
@@ -108,6 +108,7 @@ As opções do menu podem ser configuradas através de algumas propriedades
 | Event                  | Description                                                                       | Type                                     |
 | ---------------------- | --------------------------------------------------------------------------------- | ---------------------------------------- |
 | `bannerAlterado`       | É emitido quando o componente de menu possuir alterações na propriedade de banner | `CustomEvent<MenuBannerAlteradoEvent>`   |
+| `botaoBannerAcionado`  | É emitido quando o botão do banner é clicado                                      | `CustomEvent<void>`                      |
 | `opcaoMenuSelecionada` | É emitido quando alguma opção do menu for selecionada                             | `CustomEvent<OpcaoMenuSelecionadaEvent>` |
 
 

src/components/app/test/app.spec.ts

@@ -24,7 +24,7 @@ describe('app', () => {
     await page.setContent('<bth-app></bth-app>');
 
     // Assert
-    expect(page.root).toEqualLightHtml('<bth-app style="--bth-app-menu-bg-color: #142c48;"></bth-app>');
+    expect(page.root).toEqualLightHtml('<bth-app></bth-app>');
   });
 
   it('renderiza conteudo slot "menu_marca_produto"', async () => {
@@ -252,20 +252,6 @@ describe('app', () => {
     expect(app.style.getPropertyValue('--bth-app-menu-bg-color')).toBe(app.menuBgColor);
   });
 
-  it('define cor da barra padrão caso "menuBgColor" não seja definido', async () => {
-    // Arrange
-    await page.setContent('<bth-app></bth-app>');
-
-    // Act
-    const app: HTMLBthAppElement = page.doc.querySelector('bth-app');
-    app.menuBgColor = undefined;
-    await page.waitForChanges();
-
-    // Assert
-    const corPadraoBetha = '#142c48';
-    expect(app.style.getPropertyValue('--bth-app-menu-bg-color')).toBe(corPadraoBetha);
-  });
-
   it('recebe eventos de conteudo sinalizado no desktop', async () => {
     // Arrange
     await page.setContent('<bth-app></bth-app>');