@edm-sdui/sdui 1.0.1 → 1.0.2

package/{src/lib/core/uitheme/models/uispacing.ts → lib/core/uitheme/models/uispacing.d.ts}

@@ -1,5 +1,4 @@
 import { UISpacingLevel } from '../enums/uispacing-level';
-
 export interface UISpacing {
-  spacing?: UISpacingLevel;
+    spacing?: UISpacingLevel;
 }

package/lib/core/utils/url-parser.util.d.ts

@@ -0,0 +1,2 @@
+export declare function resolveSduiUrl(rawUrl: string, baseUrl?: string): string;
+export declare function isSduiUrl(rawUrl: string): boolean;

package/lib/core/view-models/uiscreen.viewmodel.d.ts

@@ -0,0 +1,39 @@
+import { Observable } from 'rxjs';
+import { UIScreen } from '../uicomposition/models/uiscreen';
+import { UIScreenService } from '../services/uiscreen.service';
+import { Location } from '@angular/common';
+import * as i0 from "@angular/core";
+export declare const SDUI_URL_PARAM = "sduiUrl";
+export declare class UIScreenViewModel {
+    private uiScreenService;
+    private location;
+    private uiScreenSubject;
+    private isLoadingSubject;
+    private errorSubject;
+    private navigationHistorySubject;
+    private canGoBackSubject;
+    private currentUrlSubject;
+    uiScreen$: Observable<UIScreen>;
+    isLoading$: Observable<boolean>;
+    error$: Observable<string>;
+    navigationHistory$: Observable<string[]>;
+    canGoBack$: Observable<boolean>;
+    currentUrl$: Observable<string>;
+    constructor(uiScreenService: UIScreenService, location: Location);
+    /**
+     * Atualiza o estado do botão de voltar com base no tamanho do histórico
+     */
+    private updateCanGoBack;
+    loadUIScreen(url: string, shouldUpdateHistory?: boolean, shouldUpdateBrowserUrl?: boolean): void;
+    private loadUIScreenInternal;
+    /**
+     * Volta para a tela anterior
+     */
+    goBack(): void;
+    /**
+     * Verifica se é possível voltar
+     */
+    canGoBack(): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UIScreenViewModel, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<UIScreenViewModel>;
+}

package/lib/directives/uiview.directive.d.ts

@@ -0,0 +1,28 @@
+import { ElementRef, OnChanges, Renderer2, SimpleChanges } from '@angular/core';
+import { UIView } from '../core/uicomposition/models/uiview';
+import { Router } from '@angular/router';
+import { UIScreenViewModel } from '../core/view-models/uiscreen.viewmodel';
+import { UIActionService } from '../core/services/ui-action.service';
+import * as i0 from "@angular/core";
+export declare class UIViewDirective implements OnChanges {
+    private elementRef;
+    private renderer;
+    private router;
+    private actionService;
+    private screenViewModel;
+    edmSduiView?: UIView;
+    disableClick: boolean;
+    constructor(elementRef: ElementRef, renderer: Renderer2, router: Router, actionService: UIActionService, screenViewModel: UIScreenViewModel);
+    ngOnChanges(changes: SimpleChanges): void;
+    private applyStyles;
+    private applyPadding;
+    private applyBackground;
+    private applyAction;
+    private applyAlignment;
+    private applyShadow;
+    private applyRadius;
+    private applySpacing;
+    onClick(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UIViewDirective, [null, null, null, null, { optional: true; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<UIViewDirective, "[edmSduiView]", never, { "edmSduiView": { "alias": "edmSduiView"; "required": false; }; "disableClick": { "alias": "disableClick"; "required": false; }; }, {}, never, never, false, never>;
+}

package/lib/sdui-routing.module.d.ts

@@ -0,0 +1,9 @@
+import { ModuleWithProviders } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/router";
+export declare class SduiRoutingModule {
+    static forChild(customPath?: string): ModuleWithProviders<SduiRoutingModule>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SduiRoutingModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SduiRoutingModule, never, [typeof i1.RouterModule], [typeof i1.RouterModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SduiRoutingModule>;
+}

package/lib/sdui.component.d.ts

@@ -0,0 +1,16 @@
+import { OnInit, AfterViewInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { UIScreenViewModel } from './core/view-models/uiscreen.viewmodel';
+import * as i0 from "@angular/core";
+export declare class SduiComponent implements OnInit, AfterViewInit {
+    private route;
+    private viewModel;
+    currentSduiUrl: string | null;
+    initialUrl: string | null;
+    constructor(route: ActivatedRoute, viewModel: UIScreenViewModel);
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    private validateParam;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SduiComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SduiComponent, "edm-sdui", never, { "initialUrl": { "alias": "initialUrl"; "required": false; }; }, {}, never, never, false, never>;
+}

package/lib/sdui.module.d.ts

@@ -0,0 +1,34 @@
+import { ModuleWithProviders } from '@angular/core';
+import { SduiRoutingModule } from './sdui-routing.module';
+import * as i0 from "@angular/core";
+import * as i1 from "./components/uiscreen/uiscreen.component";
+import * as i2 from "./components/uilayout/uinavigation/uinavigation.component";
+import * as i3 from "./components/uilayout/single-column-layout/single-column-layout.component";
+import * as i4 from "./components/uilayout/centered-content-layout/centered-content-layout.component";
+import * as i5 from "./components/uicomponent/uicomponent.component";
+import * as i6 from "./components/uicomponent/row/row.component";
+import * as i7 from "./components/uicomponent/row-divisor/row-divisor.component";
+import * as i8 from "./components/uicomponent/column/column.component";
+import * as i9 from "./components/uicomponent/zstack/zstack.component";
+import * as i10 from "./components/uicomponent/label/label.component";
+import * as i11 from "./components/uicomponent/space/space.component";
+import * as i12 from "./components/uicomponent/button/button.component";
+import * as i13 from "./components/uicomponent/image/image.component";
+import * as i14 from "./components/uicomponent/tag/tag.component";
+import * as i15 from "./components/uicomponent/search-bar/search-bar.component";
+import * as i16 from "./directives/uiview.directive";
+import * as i17 from "./components/navigation-controls/navigation-controls.component";
+import * as i18 from "./sdui.component";
+import * as i19 from "@angular/common";
+import * as i20 from "@angular/router";
+export interface SduiModuleConfig {
+    baseUrl: string;
+    routePath?: string;
+}
+export declare class SduiModule {
+    static forRoot(config: SduiModuleConfig): ModuleWithProviders<SduiModule>;
+    static forRouting(config?: SduiModuleConfig): ModuleWithProviders<SduiRoutingModule>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SduiModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SduiModule, [typeof i1.UIScreenComponent, typeof i2.UINavigationComponent, typeof i3.SingleColumnLayoutComponent, typeof i4.CenteredContentLayoutComponent, typeof i5.UIComponentComponent, typeof i6.RowComponent, typeof i7.RowDivisorComponent, typeof i8.ColumnComponent, typeof i9.ZStackComponent, typeof i10.LabelComponent, typeof i11.SpaceComponent, typeof i12.ButtonComponent, typeof i13.ImageComponent, typeof i14.TagComponent, typeof i15.SearchBarComponent, typeof i16.UIViewDirective, typeof i17.NavigationControlsComponent, typeof i18.SduiComponent], [typeof i19.CommonModule, typeof i20.RouterModule], [typeof i18.SduiComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<SduiModule>;
+}

package/package.json

@@ -1,25 +1,27 @@
 {
   "name": "@edm-sdui/sdui",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "private": false,
   "publishConfig": {
     "access": "public"
   },
-  "ngPackage": {
-    "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-    "dest": "../../dist/libs/sdui",
-    "lib": {
-      "entryFile": "src/public-api.ts"
-    }
-  },
-  "scripts": {
-    "build": "ng-packagr -p ng-package.json"
-  },
   "peerDependencies": {
     "@angular/core": "^18.2.9",
     "@angular/common": "^18.2.9"
   },
-  "devDependencies": {
-    "ng-packagr": "^18.2.9"
+  "module": "fesm2022/edm-sdui-sdui.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "default": "./fesm2022/edm-sdui-sdui.mjs"
+    }
+  },
+  "sideEffects": false,
+  "dependencies": {
+    "tslib": "^2.3.0"
   }
-}
+}

package/public-api.d.ts

@@ -0,0 +1,4 @@
+export { SduiModule } from './lib/sdui.module';
+export { SduiComponent } from './lib/sdui.component';
+export { SDUI_URL_PARAM } from './lib/core/view-models/uiscreen.viewmodel';
+export { SduiModuleConfig } from './lib/sdui.module';

package/ng-package.json

@@ -1,9 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/libs/sdui",
-  "deleteDestPath": true,
-  "lib": {
-    "entryFile": "src/public-api.ts"
-  },
-  "allowedNonPeerDependencies": ["tslib"]
-}

package/src/index.ts

@@ -1 +0,0 @@
-export * from './public-api';

package/src/lib/components/navigation-controls/navigation-controls.component.html

@@ -1,9 +0,0 @@
-<div class="navigation-controls">
-  <button
-    class="back-button"
-    [disabled]="!(viewModel.canGoBack$ | async)"
-    (click)="goBack()"
-  >
-    <span class="material-icons">arrow_back</span>
-  </button>
-</div>

package/src/lib/components/navigation-controls/navigation-controls.component.scss

@@ -1,35 +0,0 @@
-:host {
-  display: contents;
-}
-
-.navigation-controls {
-  display: flex;
-  gap: 8px;
-  //margin: 8px;
-
-  button {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 8px;
-    border-radius: 4px;
-    border: 1px solid #e0e0e0;
-    background-color: #f5f5f5;
-    cursor: pointer;
-    transition: all 0.2s ease;
-
-    &:hover:not(:disabled) {
-      background-color: #e8e8e8;
-    }
-
-    &:disabled {
-      opacity: 0.5;
-      cursor: not-allowed;
-    }
-
-    .material-icons {
-      font-size: 18px;
-      color: #444;
-    }
-  }
-}

package/src/lib/components/navigation-controls/navigation-controls.component.ts

@@ -1,27 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { UIScreenViewModel } from '../../core/view-models/uiscreen.viewmodel';
-
-@Component({
-  selector: 'edm-sdui-navigation-controls',
-  templateUrl: './navigation-controls.component.html',
-  styleUrls: ['./navigation-controls.component.scss'],
-  standalone: false,
-})
-export class NavigationControlsComponent implements OnInit {
-  constructor(public viewModel: UIScreenViewModel) {}
-
-  ngOnInit(): void {
-    // Monitorar o estado do botão de voltar para debugging
-    this.viewModel.canGoBack$.subscribe((canGoBack) => {
-      console.debug(
-        '[NavigationControls] Estado do botão de voltar:',
-        canGoBack
-      );
-    });
-  }
-
-  goBack(): void {
-    console.debug('[NavigationControls] Botão de voltar clicado');
-    this.viewModel.goBack();
-  }
-}

package/src/lib/components/uicomponent/button/button.component.html

@@ -1,4 +0,0 @@
-<button #buttonElement [edmSduiView]="uiComponent.element" *ngIf="uiComponent">
-  <img *ngIf="uiComponent.element.asset" [src]="getAssetPath(uiComponent.element.asset)" alt="">
-  {{ uiComponent.element.label }}
-</button>

package/src/lib/components/uicomponent/button/button.component.scss

@@ -1,11 +0,0 @@
-:host {
-  display: contents;
-}
-
-button {
-  border: none;
-  white-space: nowrap;
-  line-height: 1.5;
-  // transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
-  background-color: unset;
-}

package/src/lib/components/uicomponent/button/button.component.ts

@@ -1,64 +0,0 @@
-import {
-  AfterViewInit,
-  Component,
-  ElementRef,
-  Inject,
-  OnInit,
-  Renderer2,
-  ViewChild,
-} from '@angular/core';
-import { UIComponent } from '../../../core/uicomposition/models/uicomponent';
-import { UIElement } from '../../../core/uicomposition/models/uielement';
-import { colorMapping } from '../../../core/uitheme/mapping/color-mapping';
-import { textStyleMappingFontSize } from '../../../core/uitheme/mapping/text-style-mapping';
-import { assetMapping } from '../../../core/uitheme/mapping/asset-mapping';
-import { UIAsset } from '../../../core/uitheme/enums/uiasset';
-
-@Component({
-  selector: 'edm-sdui-button',
-  templateUrl: './button.component.html',
-  styleUrl: './button.component.scss',
-  standalone: false,
-})
-export class ButtonComponent implements OnInit, AfterViewInit {
-  @ViewChild('buttonElement') buttonElementRef!: ElementRef<HTMLButtonElement>;
-
-  constructor(
-    @Inject('uiComponent') public uiComponent: UIComponent,
-    private renderer: Renderer2
-  ) {}
-
-  ngOnInit(): void {
-    // console.debug('button.uiComponent: ', this.uiComponent);
-  }
-
-  ngAfterViewInit(): void {
-    if (this.uiComponent.element) {
-      this.applyElement(this.uiComponent.element);
-    }
-  }
-
-  private applyElement(element: UIElement) {
-    if (element.textColor) {
-      const color = colorMapping[element.textColor];
-      this.renderer.setStyle(
-        this.buttonElementRef.nativeElement,
-        'color',
-        color
-      );
-    }
-
-    if (element.textStyle) {
-      const fontSize = textStyleMappingFontSize[element.textStyle];
-      this.renderer.setStyle(
-        this.buttonElementRef.nativeElement,
-        'font-size',
-        fontSize
-      );
-    }
-  }
-
-  getAssetPath(asset: UIAsset) {
-    return './assets/' +assetMapping[asset];
-  }
-}

package/src/lib/components/uicomponent/column/column.component.html

@@ -1,7 +0,0 @@
-<div class="column" *ngIf="uiComponent" [edmSduiView]="uiComponent.element">
-  <edm-sdui-component
-    *ngFor="let child of uiComponent.components"
-    [uiComponent]="child"
-  >
-  </edm-sdui-component>
-</div>

package/src/lib/components/uicomponent/column/column.component.scss

@@ -1,9 +0,0 @@
-:host {
-  display: contents;
-}
-
-.column {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-}

package/src/lib/components/uicomponent/column/column.component.ts

@@ -1,16 +0,0 @@
-import { Component, Inject, OnInit } from '@angular/core';
-import { UIComponent } from '../../../core/uicomposition/models/uicomponent';
-
-@Component({
-  selector: 'edm-sdui-column',
-  templateUrl: './column.component.html',
-  styleUrl: './column.component.scss',
-  standalone: false,
-})
-export class ColumnComponent implements OnInit {
-  constructor(@Inject('uiComponent') public uiComponent: UIComponent) {}
-
-  ngOnInit(): void {
-    // console.debug('column.uiComponent: ', this.uiComponent);
-  }
-}

package/src/lib/components/uicomponent/image/image.component.html

@@ -1 +0,0 @@
-<img #imgElement [edmSduiView]="uiComponent.element" *ngIf="uiComponent" />

package/src/lib/components/uicomponent/image/image.component.scss

@@ -1,3 +0,0 @@
-:host {
-  display: contents;
-}

package/src/lib/components/uicomponent/image/image.component.ts

@@ -1,69 +0,0 @@
-import {
-  AfterViewInit,
-  Component,
-  ElementRef,
-  Inject,
-  OnInit,
-  Renderer2,
-  ViewChild,
-} from '@angular/core';
-import { UIComponent } from '../../../core/uicomposition/models/uicomponent';
-import { UIElement } from '../../../core/uicomposition/models/uielement';
-import { assetMapping } from '../../../core/uitheme/mapping/asset-mapping';
-import {
-  sizeMappingHeight,
-  sizeMappingWidth,
-} from '../../../core/uitheme/mapping/size-mapping';
-
-@Component({
-  selector: 'edm-sdui-image',
-  templateUrl: './image.component.html',
-  styleUrl: './image.component.scss',
-  standalone: false,
-})
-export class ImageComponent implements OnInit, AfterViewInit {
-  @ViewChild('imgElement') imgElementRef!: ElementRef<HTMLImageElement>;
-
-  constructor(
-    @Inject('uiComponent') public uiComponent: UIComponent,
-    private renderer: Renderer2
-  ) {}
-
-  ngOnInit(): void {
-    // console.debug('image.uiComponent: ', this.uiComponent);
-  }
-
-  ngAfterViewInit(): void {
-    if (this.uiComponent?.element) {
-      this.applyElement(this.uiComponent.element);
-    }
-  }
-
-  private applyElement(element: UIElement) {
-    if (element.asset) {
-      const asset = assetMapping[element.asset];
-      this.renderer.setAttribute(
-        this.imgElementRef.nativeElement,
-        'src',
-        './assets/' + asset
-      );
-    } else if (element.url) {
-      this.renderer.setAttribute(
-        this.imgElementRef.nativeElement,
-        'src',
-        element.url
-      );
-    }
-
-    if (element.size) {
-      const height = sizeMappingHeight[element.size];
-      const width = sizeMappingWidth[element.size];
-      this.renderer.setStyle(
-        this.imgElementRef.nativeElement,
-        'height',
-        height
-      );
-      this.renderer.setStyle(this.imgElementRef.nativeElement, 'width', width);
-    }
-  }
-}

package/src/lib/components/uicomponent/label/label.component.html

@@ -1,3 +0,0 @@
-<span #spanElement [edmSduiView]="uiComponent.element" *ngIf="uiComponent">{{
-  uiComponent.element?.label ?? ""
-}}</span>

package/src/lib/components/uicomponent/label/label.component.scss

@@ -1,3 +0,0 @@
-:host {
-  display: contents;
-}

package/src/lib/components/uicomponent/label/label.component.ts

@@ -1,66 +0,0 @@
-import {
-  AfterViewInit,
-  Component,
-  ElementRef,
-  Inject,
-  OnInit,
-  Renderer2,
-  ViewChild,
-} from '@angular/core';
-import { UIComponent } from '../../../core/uicomposition/models/uicomponent';
-import { UIElement } from '../../../core/uicomposition/models/uielement';
-import { colorMapping } from '../../../core/uitheme/mapping/color-mapping';
-import { textStyleMappingFontSize } from '../../../core/uitheme/mapping/text-style-mapping';
-
-@Component({
-  selector: 'edm-sdui-label',
-  templateUrl: './label.component.html',
-  styleUrl: './label.component.scss',
-  standalone: false,
-})
-export class LabelComponent implements OnInit, AfterViewInit {
-  @ViewChild('spanElement') spanElementRef!: ElementRef<HTMLImageElement>;
-
-  constructor(
-    @Inject('uiComponent') public uiComponent: UIComponent,
-    private renderer: Renderer2
-  ) {}
-
-  ngOnInit(): void {
-    // console.debug('label.uiComponent: ', this.uiComponent);
-  }
-
-  ngAfterViewInit(): void {
-    if (this.uiComponent.element) {
-      this.applyElement(this.uiComponent.element);
-    }
-  }
-
-  private applyElement(element: UIElement) {
-    if (element.textColor) {
-      const color = colorMapping[element.textColor];
-      this.renderer.setStyle(this.spanElementRef.nativeElement, 'color', color);
-    }
-
-    if (element.textStyle) {
-      const fontSize = textStyleMappingFontSize[element.textStyle];
-      this.renderer.setStyle(
-        this.spanElementRef.nativeElement,
-        'font-size',
-        fontSize
-      );
-    }
-
-    const maxLines = element.maxLines ?? 1;
-    // TODO: - definir o maxLines do Span
-
-    if (element.opacity) {
-      const opacity = element.opacity;
-      this.renderer.setStyle(
-        this.spanElementRef.nativeElement,
-        'opacity',
-        opacity
-      );
-    }
-  }
-}

package/src/lib/components/uicomponent/row/row.component.html

@@ -1,7 +0,0 @@
-<div class="row" *ngIf="uiComponent" [edmSduiView]="uiComponent.element">
-  <edm-sdui-component
-    *ngFor="let component of uiComponent.components"
-    [uiComponent]="component"
-  >
-  </edm-sdui-component>
-</div>

package/src/lib/components/uicomponent/row/row.component.scss

@@ -1,8 +0,0 @@
-:host {
-  display: contents;
-}
-
-.row {
-  display: flex;
-  flex-direction: row;
-}

package/src/lib/components/uicomponent/row/row.component.ts

@@ -1,16 +0,0 @@
-import { Component, Inject, OnInit } from '@angular/core';
-import { UIComponent } from '../../../core/uicomposition/models/uicomponent';
-
-@Component({
-  selector: 'edm-sdui-row',
-  styleUrl: './row.component.scss',
-  templateUrl: './row.component.html',
-  standalone: false,
-})
-export class RowComponent implements OnInit {
-  constructor(@Inject('uiComponent') public uiComponent: UIComponent) {}
-
-  ngOnInit(): void {
-    // console.debug('row.uiComponent: ', this.uiComponent);
-  }
-}

package/src/lib/components/uicomponent/row-divisor/row-divisor.component.html

@@ -1,5 +0,0 @@
-<div
-  class="row-divisor"
-  *ngIf="uiComponent"
-  [edmSduiView]="uiComponent.element"
-></div>

package/src/lib/components/uicomponent/row-divisor/row-divisor.component.scss

@@ -1,8 +0,0 @@
-:host {
-  display: contents;
-}
-
-.row-divisor {
-  height: 1px;
-  // width: 100%;
-}

package/src/lib/components/uicomponent/row-divisor/row-divisor.component.ts

@@ -1,16 +0,0 @@
-import { Component, Inject, OnInit } from '@angular/core';
-import { UIComponent } from '../../../core/uicomposition/models/uicomponent';
-
-@Component({
-  selector: 'edm-sdui-row-divisor',
-  styleUrl: './row-divisor.component.scss',
-  templateUrl: './row-divisor.component.html',
-  standalone: false,
-})
-export class RowDivisorComponent implements OnInit {
-  constructor(@Inject('uiComponent') public uiComponent: UIComponent) {}
-
-  ngOnInit(): void {
-    // console.debug('rowDivisor.uiComponent: ', this.uiComponent);
-  }
-}

package/src/lib/components/uicomponent/search-bar/search-bar.component.html

@@ -1,7 +0,0 @@
-<input
-  #inputElement
-  class="search-bar"
-  [edmSduiView]="uiComponent.element"
-  [disableClick]="true"
-  *ngIf="uiComponent"
-/>

package/src/lib/components/uicomponent/search-bar/search-bar.component.scss

@@ -1,7 +0,0 @@
-.search-bar {
-  width: 100vw;
-  margin: 1rem;
-  line-height: 1.5rem;
-  padding: 0.25rem 0.5rem;
-  background-color: var(--bg-search);
-}