otimus-library 0.0.20 → 0.0.21

package/src/lib/components/oc-menu/oc-menu.component.scss

@@ -1,49 +0,0 @@
-@use '../../../styles/variables.scss';
-
-.oc-menu-btn{
-  padding: 0;
-  margin: 0;
-}
-
-
-
-::ng-deep {
-  .oc-menu{
-
-    display: flex;
-    flex-direction: column;
-    border-radius: 0px 8px 8px 8px;
-    background-color: variables.$color-gray-6;
-    border: 1px solid variables.$color-white;
-    max-width: 400px;
-
-    position: absolute;
-    
-    box-shadow: 0px 4px 8.7px 0px rgba(0, 0, 0, 0.13);
-    
-    >div {
-      display: flex;
-      flex-direction: column;
-    }
-
-    a, button, p, span, b, small, h1,h2,h3,h4,h5,h6 {
-      color: variables.$color-gray-3 ;
-      
-      font-size: 1rem;
-      font-weight: 500;
-      text-align: left;
-
-      border: none;
-      padding: 0.6rem;
-      padding-right: 1.5rem;
-      background-color: transparent ;
-
-      cursor: pointer;
-
-      &:hover{
-        filter: brightness(0.8);
-      }
-    }
-  }
-
-}

package/src/lib/components/oc-menu/oc-menu.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { OcMenuComponent } from './oc-menu.component';
-
-describe('OcMenuComponent', () => {
-  let component: OcMenuComponent;
-  let fixture: ComponentFixture<OcMenuComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [OcMenuComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(OcMenuComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/oc-menu/oc-menu.component.ts

@@ -1,24 +0,0 @@
-import { AfterContentInit, Component, ContentChildren, QueryList, ElementRef, Renderer2 } from '@angular/core';
-import { CdkMenuItem, CdkMenuModule } from '@angular/cdk/menu';
-import { CommonModule } from '@angular/common';
-
-@Component({
-  selector: 'oc-menu',
-  standalone: true,
-  imports: [CommonModule, CdkMenuModule],
-  templateUrl: './oc-menu.component.html',
-  styleUrls: ['./oc-menu.component.scss']
-})
-export class OcMenuComponent implements AfterContentInit {
-  @ContentChildren(CdkMenuItem, { descendants: true }) menuItems!: QueryList<CdkMenuItem>;
-
-  constructor(private renderer: Renderer2, private el: ElementRef) {}
-
-  ngAfterContentInit() {
-    if (this.menuItems) {
-      this.menuItems.forEach(item => {
-        this.renderer.setAttribute(item._elementRef.nativeElement, 'cdkMenuItem', '');
-      });
-    }
-  }
-}

package/src/lib/components/oc-modal/oc-modal.component.html

@@ -1,16 +0,0 @@
-<div class="oc-modal-bg" *ngIf="isOpen" [ngClass]="{'closing-bg': closing}">
-  <div class="oc-modal" [ngClass]="{large: ocSize === 'large', medium: ocSize === 'medium', small: ocSize === 'small', closing: closing}">
-    <header class="oc-modal-header">
-      <h3 *ngIf="ocTitle.trim().length > 0">{{ocTitle}}</h3>
-      <button (click)="close()" class="oc-close-btn">
-        <span class="material-symbols-outlined md-18" title="Fechar">close</span>
-      </button>
-    </header>
-    <div class="oc-modal-content">
-      <ng-content></ng-content>
-    </div>
-    <footer class="oc-modal-footer">
-      <ng-content select="[footer]"></ng-content>
-    </footer>
-  </div>
-</div>

package/src/lib/components/oc-modal/oc-modal.component.scss

@@ -1,159 +0,0 @@
-@use '../../../styles/variables.scss';
-@import '../../../styles/styles.scss';
-
-*{
-  box-sizing: border-box;
-}
-
-.oc-modal-bg{
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  padding: 1rem;
-
-  background-color: rgba($color: #000000, $alpha: 0.5);
-
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-
-  z-index: 20;
-}
-
-
-.oc-modal{
-  animation: show-up-modal 0.3s ease;
-
-  width: 100%;
-
-  padding: 1rem;
-
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-
-  background-color: variables.$color-gray-6;
-
-  border-radius: 1rem;
-}
-
-.oc-modal-footer {
-  width: 100%;
-
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  gap: .5rem;
-
-}
-
-.oc-modal-content{
-  margin: 0;
-  padding: 0;
-  margin-bottom: 2rem;
-
-  max-height: 80vh;
-  overflow-y: auto;
-  overflow-x: hidden;
-}
-
-.oc-modal-header{
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-
-  padding: 0;
-  margin: 0;
-
-  position: sticky;
-  top: 0;
-  width: 100%;
-
-  h3{
-    margin: 0;
-    padding: 0;
-    margin-bottom: 2rem;
-
-    font-size: 1.5rem;
-    color: variables.$color-gray-1;
-  }
-
-  .oc-close-btn{
-    margin: 0;
-    margin-right: .5rem;
-    padding: 0;
-    border: none;
-    border-radius: 50%;
-
-    background-color: transparent;
-
-    transition: 0.15s ease;
-
-    color: variables.$color-gray-4;
-  
-    width: 15px;
-    height: 15px;
-  
-    border-radius: 50%;
-    transition: 0.15s ease;
-  
-    cursor: pointer;
-  
-    span{
-      transition: .15s ease;
-    }
-
-    &:hover{
-      span{
-        color: variables.$color-gray-3;
-      }
-    }
-
-    position: absolute;
-    top: 0;
-    right: 0;
-  }
-}
-
-.small {
-  width: 400px;
-}
-
-.medium {
-  width: 600px;
-}
-
-.large {
-  width: 800px;
-}
-
-.closing{
-  animation: closeModal .15s ease;
-}
-
-.closing-bg{
-  transition: .1s ease;
-  opacity: 0;
-}
-
-@keyframes show-up-modal {
-  from{
-    opacity: 0.5;
-    transform: scale(0.8);
-  }to {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
-@keyframes closeModal {
-  from{
-    opacity: 1;
-  }to{
-    opacity: 0.5;
-    transform: scale(0.5);
-  }
-}

package/src/lib/components/oc-modal/oc-modal.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { OcModalComponent } from './oc-modal.component';
-
-describe('OcModalComponent', () => {
-  let component: OcModalComponent;
-  let fixture: ComponentFixture<OcModalComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [OcModalComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(OcModalComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/oc-modal/oc-modal.component.ts

@@ -1,29 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component, ContentChild, ElementRef, Input } from '@angular/core';
-
-@Component({
-  selector: 'oc-modal',
-  standalone: true,
-  imports: [CommonModule],
-  templateUrl: './oc-modal.component.html',
-  styleUrl: './oc-modal.component.scss'
-})
-export class OcModalComponent {
-  @Input() ocTitle: string = ''
-  @Input() ocSize: 'small' | 'medium' |'large' = 'medium'
-
-  isOpen: boolean = false
-
-  closing: boolean = false
-
-  open() {
-    this.isOpen = true
-  }
-  close() {
-    this.closing = true
-    setTimeout(() => {
-      this.isOpen = false
-      this.closing = false
-    },100)
-  }
-}

package/src/lib/components/oc-table/oc-table.component.html

@@ -1,10 +0,0 @@
-<table cdk-table [dataSource]="dataSource">
-
-  <ng-container *ngFor="let column of columns; let i = index" [cdkColumnDef]="column">
-    <th cdk-header-cell *cdkHeaderCellDef> {{column}} </th>
-    <td cdk-cell *cdkCellDef="let row"> {{row[keys[i]]}} </td>
-  </ng-container>
-
-  <tr cdk-header-row *cdkHeaderRowDef="columns"></tr>
-  <tr cdk-row *cdkRowDef="let row; columns: columns"></tr>
-</table>

package/src/lib/components/oc-table/oc-table.component.scss

@@ -1,3 +0,0 @@
-table{
-  width: 100%;
-}

package/src/lib/components/oc-table/oc-table.component.ts

@@ -1,24 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import {CdkTableModule} from '@angular/cdk/table'
-
-
-@Component({
-  selector: 'oc-table',
-  standalone: true,
-  imports: [CommonModule, CdkTableModule],
-  templateUrl: './oc-table.component.html',
-  styleUrls: ['./oc-table.component.scss']
-})
-export class OcTableComponent implements OnInit {
-
-  @Input() columns: string[] = []
-  @Input() dataSource: any[] = []
-  keys: string[] = []
-
-  ngOnInit(): void {
-    if(!this.dataSource.length) return
-
-    this.keys = Object.keys(this.dataSource[0])
-  }
-}

package/src/lib/directives/oc-tooltip/oc-tooltip.directive.ts

@@ -1,67 +0,0 @@
-import { Directive, ElementRef, HostListener, Input, Renderer2 } from '@angular/core';
-
-@Directive({
-  selector: '[ocTooltip]',
-  standalone: true
-})
-export class OcTooltipDirective {
-  constructor(private elRef: ElementRef, private renderer: Renderer2) { }
-
-  @Input() content: string = ''
-  @Input() side: 'bottom' | 'upon' | 'left' | 'right' = 'bottom'
-
-  created:boolean = false
-
-  createToolTip() {
-    if(this.created) return
-
-    const tooltip = this.renderer.createElement('div')
-    const text = this.renderer.createText(this.content)
-
-    this.renderer.appendChild(tooltip, text)
-    this.renderer.setStyle(tooltip, 'margin', '0')
-    this.renderer.addClass(tooltip, 'oc-tooltip')
-    this.renderer.setStyle(tooltip, 'position', 'absolute')
-    this.renderer.setStyle(tooltip, 'padding', '0.4rem 0.8rem')
-    this.renderer.setStyle(tooltip, 'font-size', '0.9rem')
-    this.renderer.setStyle(tooltip, 'font-weight', '600')
-    this.renderer.setStyle(tooltip, 'color', '#7E8485')
-    this.renderer.setStyle(tooltip, 'border', '1px solid #FFFFFF')
-    this.renderer.setStyle(tooltip, 'background-color', '#F8F9FF')
-    this.renderer.setStyle(tooltip, 'border-radius','1rem')
-    this.renderer.setStyle(tooltip, 'box-shadow', '0px 3px 6.5px 0px rgba(0, 0, 0, 0.20)')
-    this.renderer.setStyle(tooltip, 'transition', '0.1s ease')
-    this.renderer.setStyle(tooltip, 'max-width', '400px')
-
-    const width = this.elRef.nativeElement.offsetWidth
-    const height = this.elRef.nativeElement.offsetHeight
-
-    this.renderer.setStyle(tooltip, 'transform', `translateY(${height - 10}px)`)
-
-    if (this.side === 'right') {
-      this.renderer.setStyle(tooltip, 'transform', `translateX(${width + 20}px) translateY(-50%)`)
-    } else if (this.side === 'left') {
-      this.renderer.setStyle(tooltip, 'transform', `translateX(-${width + 20}px) translateY(-50%)`)
-    } else if (this.side === 'upon') {
-      this.renderer.setStyle(tooltip, 'transform', `translateY(-${height  + 40}px)`)
-    }
-
-    this.created = true
-    return tooltip
-  }
-
-  @HostListener('mouseover')
-  onMouseOver() {
-      const tooltip = this.createToolTip()
-      this.renderer.appendChild(this.elRef.nativeElement, tooltip)
-  }
-
-  @HostListener('mouseout')
-  onMouseOut() {
-    const tooltip = this.elRef.nativeElement.querySelector('.oc-tooltip')
-    if(tooltip){
-      this.renderer.removeChild(this.elRef.nativeElement, tooltip)
-      this.created = false
-    }
-  }
-}

package/src/lib/otimus-library.component.ts

@@ -1,16 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'lib-otimus-library',
-  standalone: true,
-  imports: [],
-  template: `
-    <p>
-      otimus-library works!
-    </p>
-  `,
-  styles: ``
-})
-export class OtimusLibraryComponent {
-
-}

package/src/lib/otimus-library.service.ts

@@ -1,9 +0,0 @@
-import { Injectable } from '@angular/core';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class OtimusLibraryService {
-
-  constructor() { }
-}

package/src/public-api.ts

@@ -1,15 +0,0 @@
-
-/*
-* Public API Surface of otimus-library
-*/
-
-export * from './lib/otimus-library.service'
-export * from './lib/otimus-library.component'
-export * from './lib/components/oc-table/oc-table.component'
-export * from './lib/components/oc-badge/oc-badge.component'
-export * from './lib/components/oc-filter/oc-filter.component'
-export * from './lib/directives/oc-tooltip/oc-tooltip.directive'
-export * from './lib/components/oc-input/oc-input.component'
-export * from './lib/components/oc-modal/oc-modal.component'
-export * from './lib/components/oc-key-value/oc-key-value.component'
-export * from './lib/components/oc-chip/oc-chip.component'

package/tsconfig.lib.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": []
-  },
-  "exclude": [
-    "**/*.spec.ts"
-  ]
-}

package/tsconfig.lib.prod.json

@@ -1,10 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "./tsconfig.lib.json",
-  "compilerOptions": {
-    "declarationMap": false
-  },
-  "angularCompilerOptions": {
-    "compilationMode": "partial"
-  }
-}

package/tsconfig.spec.json

@@ -1,14 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/spec",
-    "types": [
-      "jasmine"
-    ]
-  },
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}