@edm-sdui/sdui 1.0.1 → 1.0.3

package/src/lib/components/uilayout/single-column-layout/single-column-layout.component.scss

@@ -1,37 +0,0 @@
-:host {
-  display: contents;
-}
-
-.single-column-layout {
-  display: flex;
-  flex-direction: column;
-  width: 100vw;
-  min-height: 100vh;
-  position: relative;
-
-  .header {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    z-index: 100;
-  }
-  .scrollview {
-    .main {
-      flex: 1;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      margin-top: var(--header-height, 64px);
-      margin-bottom: var(--footer-height, 64px);
-    }
-  }
-
-  .footer {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    z-index: 100;
-  }
-}

package/src/lib/components/uilayout/single-column-layout/single-column-layout.component.ts

@@ -1,27 +0,0 @@
-import {
-  ChangeDetectionStrategy,
-  Component,
-  Input,
-  OnChanges,
-  SimpleChanges,
-} from '@angular/core';
-import { UISingleColumnLayout } from '../../../core/uicomposition/models/uisingle-column-layout';
-
-@Component({
-  selector: 'edm-sdui-single-column-layout',
-  templateUrl: './single-column-layout.component.html',
-  styleUrl: './single-column-layout.component.scss',
-  standalone: false,
-})
-export class SingleColumnLayoutComponent implements OnChanges {
-  @Input() uiLayout?: UISingleColumnLayout;
-
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['uiLayout']) {
-      console.debug(
-        '[SingleColumnLayout] Novo layout recebido:',
-        changes['uiLayout'].currentValue
-      );
-    }
-  }
-}

package/src/lib/components/uilayout/uinavigation/uinavigation.component.html

@@ -1,8 +0,0 @@
-<div class="nav" *ngIf="uiNavigation">
-  <h1 *ngIf="uiNavigation.title">{{ uiNavigation.title }}</h1>
-
-  <edm-sdui-component
-    [uiComponent]="uiNavigation.titleComponent"
-    *ngIf="uiNavigation.titleComponent"
-  ></edm-sdui-component>
-</div>

package/src/lib/components/uilayout/uinavigation/uinavigation.component.scss

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

package/src/lib/components/uilayout/uinavigation/uinavigation.component.ts

@@ -1,12 +0,0 @@
-import { AfterViewInit, Component, Input } from '@angular/core';
-import { UINavigation } from '../../../core/uicomposition/models/uinavigation';
-
-@Component({
-  selector: 'edm-sdui-navigation',
-  styleUrl: './uinavigation.component.scss',
-  templateUrl: './uinavigation.component.html',
-  standalone: false,
-})
-export class UINavigationComponent {
-  @Input() uiNavigation?: UINavigation;
-}

package/src/lib/components/uiscreen/uiscreen.component.html

@@ -1,29 +0,0 @@
-<div *ngIf="viewModel.isLoading$ | async"><p>Carregando...</p></div>
-
-<div *ngIf="viewModel.error$ | async as errorMessage">
-  <p class="error-label">Erro: {{ errorMessage }}</p>
-</div>
-
-<div
-  class="ui-screen"
-  *ngIf="viewModel.uiScreen$ | async as uiScreen"
-  [edmSduiView]="uiScreen"
->
-  <edm-sdui-navigation-controls
-    [edmSduiView]="uiScreen"
-  ></edm-sdui-navigation-controls>
-
-  <ng-container [ngSwitch]="uiScreen.identifier">
-    <edm-sdui-single-column-layout
-      *ngSwitchCase="UIScreenIdentifier.SINGLE_COLUMN"
-      [uiLayout]="uiScreen.content"
-    >
-    </edm-sdui-single-column-layout>
-
-    <edm-sdui-centered-content-layout
-      *ngSwitchCase="UIScreenIdentifier.CENTERED_CONTENT"
-      [uiLayout]="uiScreen.content"
-    >
-    </edm-sdui-centered-content-layout>
-  </ng-container>
-</div>

package/src/lib/components/uiscreen/uiscreen.component.scss

@@ -1,12 +0,0 @@
-:host {
-  display: contents;
-}
-
-.ui-screen {
-  width: 100vw;
-  min-height: 100vh;
-}
-
-.error-label {
-  color: var(--input-error);
-}

package/src/lib/components/uiscreen/uiscreen.component.ts

@@ -1,15 +0,0 @@
-import { Component } from '@angular/core';
-import { UIScreenViewModel } from '../../core/view-models/uiscreen.viewmodel';
-import { UIScreenIdentifier } from '../../core/uicomposition/enums/uiscreen-identifier';
-
-@Component({
-  selector: 'edm-sdui-uiscreen',
-  templateUrl: './uiscreen.component.html',
-  styleUrl: './uiscreen.component.scss',
-  standalone: false,
-})
-export class UIScreenComponent {
-  readonly UIScreenIdentifier = UIScreenIdentifier;
-
-  constructor(public viewModel: UIScreenViewModel) {}
-}

package/src/lib/core/interfaces/sdui-config.interface.ts

@@ -1,3 +0,0 @@
-export interface SduiConfig {
-  baseUrl: string;
-}

package/src/lib/core/services/navigation.service.ts

@@ -1,25 +0,0 @@
-import { Injectable } from '@angular/core';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class SduiNavigationService {
-  private navigationHistory: string[] = [];
-
-  forward(url: string): void {
-    this.navigationHistory.push(url);
-  }
-
-  back(): string | null | undefined {
-    if (this.canGoBack()) {
-      this.navigationHistory.pop();
-      return this.navigationHistory[this.navigationHistory.length - 1];
-    }
-
-    return null;
-  }
-
-  canGoBack(): boolean {
-    return this.navigationHistory.length > 1;
-  }
-}

package/src/lib/core/services/sdui-config.service.ts

@@ -1,19 +0,0 @@
-import { Injectable } from '@angular/core';
-import { SduiConfig } from '../interfaces/sdui-config.interface';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class SduiConfigService {
-  private config: SduiConfig = {
-    baseUrl: '',
-  };
-
-  setConfig(config: SduiConfig): void {
-    this.config = { ...this.config, ...config };
-  }
-
-  getBaseUrl(): string {
-    return this.config.baseUrl;
-  }
-}

package/src/lib/core/services/ui-action.service.ts

@@ -1,36 +0,0 @@
-import { Injectable } from '@angular/core';
-import { Router } from '@angular/router';
-import { UIActionType } from '../uitheme/enums/uiaction-type';
-import { UIAction } from '../uitheme/models/uiaction';
-import { resolveSduiUrl, isSduiUrl } from '../utils/url-parser.util';
-import { SDUI_URL_PARAM } from '../view-models/uiscreen.viewmodel';
-
-@Injectable({ providedIn: 'root' })
-export class UIActionService {
-  constructor(private router: Router) {}
-
-  execute(action: UIAction): void {
-    if (!action || !action.type) return;
-
-    switch (action.type) {
-      case UIActionType.INTERNAL_URL:
-      case UIActionType.RELOAD_INTERNAL_URL:
-        if (action.url) {
-          console.debug('[UIActionService] Navigating to:', action.url);
-
-          if (isSduiUrl(action.url)) {
-            const resolved = resolveSduiUrl(action.url);
-            this.router.navigate([], {
-              queryParams: { [SDUI_URL_PARAM]: resolved },
-              queryParamsHandling: 'merge',
-            });
-          } else {
-            this.router.navigateByUrl(action.url, { replaceUrl: false });
-          }
-        }
-        break;
-
-      // Outros tipos de ação podem ser adicionados aqui
-    }
-  }
-}

package/src/lib/core/services/uiscreen.service.ts

@@ -1,185 +0,0 @@
-import { Injectable, Inject, Optional } from '@angular/core';
-import { Observable, map } from 'rxjs';
-import { HttpClient } from '@angular/common/http';
-import { UIScreen } from '../uicomposition/models/uiscreen';
-import { UILayout } from '../uicomposition/models/uilayout';
-import { UIScreenIdentifier } from '../uicomposition/enums/uiscreen-identifier';
-import { UISingleColumnLayout } from '../uicomposition/models/uisingle-column-layout';
-import { UINavigation } from '../uicomposition/models/uinavigation';
-import { UIComponent } from '../uicomposition/models/uicomponent';
-import { UIComponentType } from '../uicomposition/enums/uicomponent-type';
-import { UIElement } from '../uicomposition/models/uielement';
-import { UIView } from '../uicomposition/models/uiview';
-import { UIPadding } from '../uitheme/models/uipadding';
-import { UIBackground } from '../uitheme/models/uibackground';
-import { UIAction } from '../uitheme/models/uiaction';
-import { UIShadow } from '../uitheme/models/uishadow';
-import { UIRadius } from '../uitheme/models/uiradius';
-import { UIActionType } from '../uitheme/enums/uiaction-type';
-import { UIColor } from '../uitheme/enums/uicolor';
-import { UITextStyle } from '../uitheme/enums/uitext-style';
-import { UIAsset } from '../uitheme/enums/uiasset';
-import { UIAlignmentType } from '../uitheme/enums/uialignment-type';
-import { UISpacingLevel } from '../uitheme/enums/uispacing-level';
-import { SDUI_BASE_URL } from '../tokens/sdui-config.token';
-import { resolveSduiUrl } from '../utils/url-parser.util';
-import { UICenteredContentLayout } from '../uicomposition/models/uicentered-content-layout';
-import { UIRadiusLevel } from '../uitheme/enums/uiradius-level';
-import { UIContentType } from '../uitheme/enums/uicontent-type';
-import { UIAspectType } from '../uitheme/enums/uiaspect-type';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class UIScreenService {
-  constructor(
-    private http: HttpClient,
-    @Optional() @Inject(SDUI_BASE_URL) private baseUrl: string = ''
-  ) {}
-
-  getUIScreen(url: string): Observable<UIScreen> {
-    let finalUrl = resolveSduiUrl(url, this.baseUrl);
-
-    return this.http
-      .get<any>(finalUrl)
-      .pipe(map((json) => this.mapToUIScreen(json)));
-  }
-
-  private mapToUIScreen(json: Partial<UIScreen>): UIScreen {
-    const { identifier, content } = json;
-
-    if (!identifier) {
-      throw new Error(`Identificador da tela ausente no JSON recebido.`);
-    }
-
-    const layout = this.getLayout(identifier as UIScreenIdentifier, content);
-
-    return {
-      identifier: identifier as UIScreenIdentifier,
-      content: layout,
-      ...this.mapToUIView(json),
-    };
-  }
-
-  private getLayout(
-    identifier: UIScreenIdentifier,
-    content: UILayout | undefined
-  ): UILayout {
-    switch (identifier) {
-      case UIScreenIdentifier.SINGLE_COLUMN:
-        return this.mapToSingleColumnLayout(content ?? {});
-
-      case UIScreenIdentifier.CENTERED_CONTENT:
-        return this.mapToCenteredContentLayout(content ?? {});
-
-      default:
-        throw new Error(`Tipo de tela desconhecido: ${identifier}`);
-    }
-  }
-
-  private mapToSingleColumnLayout(
-    json: Partial<UISingleColumnLayout>
-  ): UISingleColumnLayout {
-    return {
-      nav: json.nav ? this.mapToUINavigation(json.nav) : null,
-      header: json.header ? this.mapToUIComponent(json.header) : null,
-      main: json.main ? this.mapToUIComponent(json.main) : null,
-      footer: json.footer ? this.mapToUIComponent(json.footer) : null,
-    };
-  }
-
-  private mapToCenteredContentLayout(
-    json: Partial<UICenteredContentLayout>
-  ): UICenteredContentLayout {
-    return {
-      nav: json.nav ? this.mapToUINavigation(json.nav) : null,
-      backgroundComponent: json.backgroundComponent
-        ? this.mapToUIComponent(json.backgroundComponent)
-        : null,
-      header: json.header ? this.mapToUIComponent(json.header) : null,
-      centered: json.centered ? this.mapToUIComponent(json.centered) : null,
-      footer: json.footer ? this.mapToUIComponent(json.footer) : null,
-    };
-  }
-
-  private mapToUINavigation(json: any): UINavigation {
-    return {
-      title: json.title ?? null,
-      titleComponent: json.title_component
-        ? this.mapToUIComponent(json.title_component)
-        : null,
-    };
-  }
-
-  private mapToUIComponent(json: Partial<UIComponent>): UIComponent {
-    return {
-      type: json.type || UIComponentType.COLUMN, // Define um tipo padrão
-      components: json.components
-        ? json.components.map((c) => this.mapToUIComponent(c))
-        : [],
-      element: json.element ? this.mapToUIElement(json.element) : null,
-    };
-  }
-
-  private mapToUIElement(json: any): UIElement {
-    return {
-      label: json.label ?? null,
-      textColor: json.text_color ? (json.text_color as UIColor) : null,
-      textStyle: json.text_style ? (json.text_style as UITextStyle) : null,
-      maxLines: json.max_lines ?? null,
-      asset: json.asset ? (json.asset as UIAsset) : null,
-      url: json.url ?? null,
-      enabled: json.enabled ?? true,
-      size: json.size ?? null,
-      opacity: json.opacity ?? null,
-      contentType: (json.content_type as UIContentType) ?? null,
-      aspect: (json.aspect as UIAspectType) ?? null,
-      grow: json.grow ?? null,
-      placeholder: json.placeholder ?? null,
-      placeholderTextColor: json.placeholder_text_color ?? null,
-      placeholderTextStyle: json.placeholder_text_style ?? null,
-      ...this.mapToUIView(json),
-    };
-  }
-
-  private mapToUIView(json: any): UIView {
-    return {
-      padding: json.padding as UIPadding,
-      background: json.background ? this.mapBackground(json.background) : null,
-      action: json.action ? this.mapAction(json.action) : null,
-      alignment: json.alignment
-        ? { alignment: json.alignment as UIAlignmentType }
-        : null,
-      shadow: json.shadow as UIShadow,
-      radius: json.radius ? this.mapRadius(json.radius) : null,
-      spacing: json.spacing
-        ? { spacing: json.spacing as UISpacingLevel }
-        : null,
-    };
-  }
-
-  private mapBackground(json: any): UIBackground {
-    return {
-      backgroundColor: json.background_color,
-    };
-  }
-
-  private mapAction(json: any): UIAction {
-    return {
-      canAccess: json.can_acces ?? null,
-      type: json.type ? (json.type as UIActionType) : null,
-      url: json.url ?? null,
-    };
-  }
-
-  private mapRadius(json: any): UIRadius {
-    return {
-      topLeft: json.top_left ? (json.top_left as UIRadiusLevel) : null,
-      topRight: json.top_right ? (json.top_right as UIRadiusLevel) : null,
-      bottomLeft: json.bottom_left ? (json.bottom_left as UIRadiusLevel) : null,
-      bottomRight: json.bottom_right
-        ? (json.bottom_right as UIRadiusLevel)
-        : null,
-    };
-  }
-}

package/src/lib/core/tokens/sdui-config.token.ts

@@ -1,3 +0,0 @@
-import { InjectionToken } from '@angular/core';
-
-export const SDUI_BASE_URL = new InjectionToken<string>('SDUI_BASE_URL');

package/src/lib/core/uicomposition/enums/uicomponent-type.ts

@@ -1,32 +0,0 @@
-export enum UIComponentType {
-  // stacks
-  ROW = 'ROW',
-  ROW_DIVISOR = 'ROW_DIVISOR',
-  COLUMN = 'COLUMN',
-  Z_STACK = 'Z_STACK',
-
-  // elements
-  BUTTON = 'BUTTON',
-  LABEL = 'LABEL',
-  IMAGE = 'IMAGE',
-  SPACE = 'SPACE',
-
-  // players
-  VIDEO_PLAYER_HLS = 'VIDEO_PLAYER_HLS',
-  VIDEO_PLAYER_WEB = 'VIDEO_PLAYER_WEB',
-
-  // componentes visuais media
-  MEDIA_TYPE = 'MEDIA_TYPE',
-  MEDIA_CONTENT = 'MEDIA_CONTENT',
-
-  // search
-  SEARCH_BAR = 'SEARCH_BAR',
-  SEARCH_BAR_DISMISS = 'SEARCH_BAR_DISMISS',
-
-  // picker
-  PICKER = 'PICKER',
-  PICKER_ITEM = 'PICKER_ITEM',
-
-  // tag
-  TAG = 'TAG',
-}

package/src/lib/core/uicomposition/enums/uiplatform-type.ts

@@ -1,4 +0,0 @@
-export enum UIPlatformType {
-  iOS = 'iOS',
-  Android = 'Android',
-}

package/src/lib/core/uicomposition/enums/uiscene.ts

@@ -1,3 +0,0 @@
-export enum UIScene {
-  ACTIVITY_LIST = 'ACTIVITY_LIST',
-}

package/src/lib/core/uicomposition/enums/uiscreen-identifier.ts

@@ -1,4 +0,0 @@
-export enum UIScreenIdentifier {
-  SINGLE_COLUMN = 'SINGLE_COLUMN',
-  CENTERED_CONTENT = 'CENTERED_CONTENT',
-}

package/src/lib/core/uicomposition/mapping/component-mapping.ts

@@ -1,90 +0,0 @@
-import { Type } from '@angular/core';
-import { UIComponentType } from '../enums/uicomponent-type';
-
-export const componentMapping: Record<
-  UIComponentType,
-  () => Promise<Type<any>>
-> = {
-  // com filhos
-  [UIComponentType.ROW]: () =>
-    import('../../../components/uicomponent/row/row.component').then(
-      (m) => m.RowComponent
-    ),
-  [UIComponentType.ROW_DIVISOR]: () =>
-    import(
-      '../../../components/uicomponent/row-divisor/row-divisor.component'
-    ).then((m) => m.RowDivisorComponent),
-
-  [UIComponentType.COLUMN]: () =>
-    import('../../../components/uicomponent/column/column.component').then(
-      (m) => m.ColumnComponent
-    ),
-  [UIComponentType.Z_STACK]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-
-  // elementos
-  [UIComponentType.BUTTON]: () =>
-    import('../../../components/uicomponent/button/button.component').then(
-      (m) => m.ButtonComponent
-    ),
-  [UIComponentType.IMAGE]: () =>
-    import('../../../components/uicomponent/image/image.component').then(
-      (m) => m.ImageComponent
-    ),
-  [UIComponentType.SPACE]: () =>
-    import('../../../components/uicomponent/space/space.component').then(
-      (m) => m.SpaceComponent
-    ),
-  [UIComponentType.LABEL]: () =>
-    import('../../../components/uicomponent/label/label.component').then(
-      (m) => m.LabelComponent
-    ),
-
-  // players
-  [UIComponentType.VIDEO_PLAYER_HLS]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-  [UIComponentType.VIDEO_PLAYER_WEB]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-
-  // componentes visuais media
-  [UIComponentType.MEDIA_TYPE]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-  [UIComponentType.MEDIA_CONTENT]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-
-  // search
-  [UIComponentType.SEARCH_BAR]: () =>
-    import(
-      '../../../components/uicomponent/search-bar/search-bar.component'
-    ).then((m) => m.SearchBarComponent),
-  [UIComponentType.SEARCH_BAR_DISMISS]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-
-  // picker
-  [UIComponentType.PICKER]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-  [UIComponentType.PICKER_ITEM]: () =>
-    import('../../../components/uicomponent/zstack/zstack.component').then(
-      (m) => m.ZStackComponent
-    ),
-
-  // tag
-  [UIComponentType.TAG]: () =>
-    import('../../../components/uicomponent/tag/tag.component').then(
-      (m) => m.TagComponent
-    ),
-};

package/src/lib/core/uicomposition/models/uicentered-content-layout.ts

@@ -1,11 +0,0 @@
-import { UIComponent } from './uicomponent';
-import { UILayout } from './uilayout';
-import { UINavigation } from './uinavigation';
-
-export interface UICenteredContentLayout extends UILayout {
-  nav?: UINavigation | null;
-  backgroundComponent?: UIComponent | null;
-  header?: UIComponent | null;
-  centered?: UIComponent | null;
-  footer?: UIComponent | null;
-}

package/src/lib/core/uicomposition/models/uielement.ts

@@ -1,25 +0,0 @@
-import { UIAspectType } from '../../uitheme/enums/uiaspect-type';
-import { UIAsset } from '../../uitheme/enums/uiasset';
-import { UIColor } from '../../uitheme/enums/uicolor';
-import { UIContentType } from '../../uitheme/enums/uicontent-type';
-import { UISize } from '../../uitheme/enums/uisize';
-import { UITextStyle } from '../../uitheme/enums/uitext-style';
-import { UIView } from './uiview';
-
-export interface UIElement extends UIView {
-  label?: string | null;
-  textColor?: UIColor | null;
-  textStyle?: UITextStyle | null;
-  maxLines?: number | null;
-  asset?: UIAsset | null;
-  url?: string | null;
-  enabled?: boolean | null;
-  size?: UISize | null;
-  opacity?: number | null;
-  contentType?: UIContentType | null;
-  aspect?: UIAspectType | null;
-  grow?: number | null;
-  placeholder?: string | null;
-  placeholderTextColor?: UIColor | null;
-  placeholderTextStyle?: UITextStyle | null;
-}

package/src/lib/core/uicomposition/models/uilayout.ts

@@ -1,4 +0,0 @@
-import { UIView } from './uiview';
-
-// interface ABSTRATA - não deve existir objetos dela!
-export interface UILayout extends UIView {}

package/src/lib/core/uicomposition/models/uinavigation.ts

@@ -1,6 +0,0 @@
-import { UIComponent } from './uicomponent';
-
-export interface UINavigation {
-  title?: string | null;
-  titleComponent?: UIComponent | null;
-}

package/src/lib/core/uitheme/enums/uiaction-type.ts

@@ -1,14 +0,0 @@
-export enum UIActionType {
-  // navegação
-  INTERNAL_URL = 'INTERNAL_URL',
-  RELOAD_INTERNAL_URL = 'RELOAD_INTERNAL_URL',
-  DISMISS_TO_SCENE = 'DISMISS_TO_SCENE',
-
-  // paywall
-  PAYWALL = 'PAYWALL',
-  REGISTER = 'REGISTER',
-
-  // conteúdo
-  HTML = 'HTML',
-  FILE = 'FILE',
-}

package/src/lib/core/uitheme/enums/uialignment-type.ts

@@ -1,5 +0,0 @@
-export enum UIAlignmentType {
-  START = 'start',
-  CENTER = 'center',
-  END = 'end',
-}

package/src/lib/core/uitheme/enums/uiaspect-type.ts

@@ -1,4 +0,0 @@
-export enum UIAspectType {
-  FILL = 'fill',
-  FIT = 'fit',
-}