angular-dumb-lib 0.0.6 → 0.0.9

package/src/lib/components/molecules/table/table.component.scss

@@ -1,169 +0,0 @@
-:host {
-  width: 100%;
-}
-
-body {
-	color: #566787;
-	background: #f5f5f5;
-	font-family: 'Varela Round', sans-serif;
-	font-size: 13px;
-}
-
-.table-responsive {
-    margin: 30px 0;
-}
-
-.table-wrapper {
-	background: #fff;
-	border-radius: 3px;
-	min-width: 1000px;
-	box-shadow: 0 1px 1px rgba(0,0,0,.05);
-}
-
-.table-title {
-	background: #435d7d;
-	color: #fff;
-	border-radius: 3px 3px 0 0;
-  padding: 0px 12px;
-  display: flex;
-  .table-name {
-    width: 70%;
-  };
-  .table-add {
-    width: 30%;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    a {
-      cursor: pointer;
-    }
-  }
-  h2 {
-	font-size: 24px;
-  }
-  .btn-group {
-    float: right;
-  }
-  .btn {
-    color: #fff;
-    float: right;
-    font-size: 13px;
-    border: none;
-    min-width: 50px;
-    border-radius: 2px;
-    border: none;
-    outline: none !important;
-    margin-left: 10px;
-    i {
-      float: left;
-      font-size: 21px;
-      margin-right: 5px;
-    }
-    span {
-      float: left;
-      margin-top: 2px;
-    }
-  }
-}
-
-::ng-deep .table tr th, ::ng-deep .table tr td {
-	border-color: #e9e9e9;
-	padding: 12px 15px;
-	vertical-align: middle;
-}
-
-::ng-deep .table tr th:first-child {
-	width: 60px;
-  display: flex;
-}
-
-::ng-deep .table tr th:last-child {
-	width: 150px;
-}
-
-table.table-striped tbody tr:nth-of-type(odd) {
-	background-color: #fcfcfc;
-}
-
-table.table-striped.table-hover tbody tr:hover {
-	background: #f5f5f5;
-}
-
-::ng-deep .table th {
-  text-align: left;
-  i {
-    font-size: 13px;
-    margin: 0 5px;
-    cursor: pointer;
-  }
-}
-
-
-::ng-deep .table td:last-child i {
-	opacity: 0.9;
-	font-size: 22px;
-	margin: 0 5px;
-}
-
-::ng-deep .table td a {
-	font-weight: bold;
-	color: #566787;
-	display: inline-block;
-	text-decoration: none;
-	outline: none !important;
-}
-
-.hint-text {
-	float: left;
-	margin-top: 10px;
-	font-size: 13px;
-}
-
-.no-record-message {
-	width: 100%;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	height: 100%;
-}
-
-.excel {
-  display: flex;
-  a {
-    display: inline-flex;
-    align-items: center;
-  }
-}
-
-.loading-wrapper {
-  height: calc(100vh - 220px);
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  overflow-y: auto; /* Scroll vertically when content overflows */
-  overflow-x: hidden; /* Hide horizontal scrollbar */
-
-  /* Custom Scrollbar for WebKit-based Browsers */
-  &::-webkit-scrollbar {
-    width: 12px; /* Adjusted width for a more standard look */
-  }
-
-  &::-webkit-scrollbar-track {
-    background: #f1f1f1; /* Light gray background for the track */
-    border-radius: 10px; /* Rounded corners for the track */
-    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1); /* Subtle shadow for a polished look */
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: #888; /* Neutral gray color for the thumb */
-    border-radius: 10px; /* Rounded corners for the thumb */
-    border: 3px solid #f1f1f1; /* Creates a gap between the thumb and track */
-    transition: background 0.3s; /* Smooth transition for hover effect */
-  }
-
-  &::-webkit-scrollbar-thumb:hover {
-    background: #555; /* Darker gray for the thumb on hover */
-  }
-}
-

package/src/lib/components/molecules/table/table.component.ts

@@ -1,40 +0,0 @@
-import { ChangeDetectorRef, Component, ContentChild, EventEmitter, Input, OnInit, Output, TemplateRef } from '@angular/core';
-import { Observable } from 'rxjs';
-import { IDataColumnConfig, IPaginator } from '../../../shared/interfaces/interface';
-import { CommonModule } from '@angular/common';
-import { TableModule} from 'primeng/table';
-import { LoadingComponent } from '../../atoms/loading/loading.component';
-import { PaginatorComponent } from '../paginator/paginator.component';
-
-@Component({
-  selector: 'app-table',
-  standalone: true,
-  templateUrl: './table.component.html',
-  styleUrls: ['./table.component.scss'],
-  imports: [CommonModule, TableModule, LoadingComponent, PaginatorComponent]
-})
-export class TableComponent<T> implements OnInit {
-  @Input() items: T[] = [];
-  @Input() columns: IDataColumnConfig[] = [];
-  @Input() totalRecords: number = 0;
-  @Input() tableName: string = '';
-  @Input() loadingState!: Observable<boolean>;
-
-  @Output() paginator = new EventEmitter<IPaginator>()
-
-  @ContentChild('bodyTemplate') bodyTemplate!: TemplateRef<any>;
-
-  allSelected = false;
-
-  constructor(private cdRef: ChangeDetectorRef) { }
-
-  ngOnInit() {
-    this.loadingState.subscribe(() => {
-      this.cdRef.detectChanges();  // Explicitly mark for change detection
-    });
-  }
-
-  changePaginator(paging: IPaginator) {
-    this.paginator.emit(paging);
-  }
-}

package/src/lib/components/pages/footer/footer.component.html

@@ -1,32 +0,0 @@
-<footer class="footer">
-  <div class="footer-container">
-    <div class="footer-section">
-      <h3>About Us</h3>
-      <p>We are a company dedicated to providing excellent services and products to our customers.</p>
-    </div>
-
-    <div class="footer-section">
-      <h3>Quick Links</h3>
-      <ul>
-        <li><a href="#">Home</a></li>
-        <li><a href="#">Services</a></li>
-        <li><a href="#">Contact</a></li>
-        <li><a href="#">Privacy Policy</a></li>
-      </ul>
-    </div>
-
-    <div class="footer-section">
-      <h3>Follow Us</h3>
-      <div class="social-icons">
-        <a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
-        <a href="#" aria-label="Twitter"><i class="fab fa-twitter"></i></a>
-        <a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
-        <a href="#" aria-label="LinkedIn"><i class="fab fa-linkedin-in"></i></a>
-      </div>
-    </div>
-  </div>
-
-  <div class="footer-bottom">
-    <p>&copy; 2024 Your Company. All Rights Reserved.</p>
-  </div>
-</footer>

package/src/lib/components/pages/footer/footer.component.scss

@@ -1,69 +0,0 @@
-.footer {
-  background-color: #333;
-  color: #fff;
-  padding: 20px 0;
-  text-align: center;
-  font-family: 'Roboto', sans-serif;
-}
-
-.footer-container {
-  display: flex;
-  justify-content: space-around;
-  flex-wrap: wrap;
-  max-width: 1200px;
-  margin: 0 auto;
-}
-
-.footer-section {
-  flex: 1;
-  margin: 15px;
-  min-width: 200px;
-}
-
-.footer-section h3 {
-  margin-bottom: 15px;
-  font-size: 18px;
-}
-
-.footer-section p,
-.footer-section ul,
-.footer-section a {
-  font-size: 14px;
-  color: #ccc;
-  text-decoration: none;
-}
-
-.footer-section ul {
-  list-style: none;
-  padding: 0;
-}
-
-.footer-section ul li {
-  margin: 5px 0;
-}
-
-.footer-section ul li a:hover {
-  color: #fff;
-}
-
-.social-icons {
-  margin-top: 10px;
-}
-
-.social-icons a {
-  display: inline-block;
-  color: #ccc;
-  margin: 0 10px;
-  font-size: 20px;
-}
-
-.social-icons a:hover {
-  color: #fff;
-}
-
-.footer-bottom {
-  margin-top: 20px;
-  border-top: 1px solid #444;
-  padding-top: 10px;
-  font-size: 12px;
-}

package/src/lib/components/pages/footer/footer.component.ts

@@ -1,16 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-footer',
-  standalone: true,
-  templateUrl: './footer.component.html',
-  styleUrls: ['./footer.component.scss']
-})
-export class FooterComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-}

package/src/lib/components/pages/login/login.component.html

@@ -1,10 +0,0 @@
-<div class="login-page">
-    <div class="icon-area">
-      <div class="icon">
-        <span>innocons</span>
-      </div>
-    </div>
-    <div class="login-button" id="buttonDiv">
-      <ng-template #buttonContainer></ng-template>
-    </div>
-</div>

package/src/lib/components/pages/login/login.component.scss

@@ -1,32 +0,0 @@
-.login-button {
-  width: 100%;
-  align-items: center;
-  justify-content: center;
-  display: flex;
-}
-
-.login-page {
-  height: 100%;
-  width: 100%;
-  flex-direction: row;
-  display: flex;
-}
-
-.icon-area {
-  width: 38%;
-  background-color: #2a76d7;
-  height: 100%;
-  display: flex;;
-}
-
-.icon {
-  width: 100%;
-  align-items: center;
-  justify-content: center;
-  display: flex;
-  span {
-    color: white;
-    font-size: xxx-large;
-    font-family: fantasy;
-  }
-}

package/src/lib/components/pages/login/login.component.ts

@@ -1,32 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component, Input, OnInit, TemplateRef, ViewChild, ViewContainerRef } from '@angular/core';
-
-@Component({
-  selector: 'app-login',
-  standalone: true,
-  templateUrl: './login.component.html',
-  styleUrls: ['./login.component.scss'],
-  imports: [CommonModule]
-})
-export class LoginComponent implements OnInit {
- // Input property to accept a TemplateRef from the parent component
- @Input() buttonTemplate!: TemplateRef<any>;
- @ViewChild('buttonContainer', { read: ViewContainerRef }) buttonContainer!: ViewContainerRef;
-
- constructor() {
- }
-
- ngOnInit(): void {
- }
-
- // After the view initializes, we render the button
- ngAfterViewInit(): void {
-   // Clear any existing content in the container
-   this.buttonContainer.clear();
-
-   // Render the provided button template inside the container
-   if (this.buttonTemplate) {
-     this.buttonContainer.createEmbeddedView(this.buttonTemplate);
-   }
- }
-}

package/src/lib/components/pages/menu/menu.component.html

@@ -1,18 +0,0 @@
-<nav class="menu" [ngClass]="{'vertical': isVertical, 'horizontal': !isVertical}">
-  <div class="logo">
-    <img src="{{logoUrl}}" alt="Logo" />
-  </div>
-  <ul>
-    <li *ngFor="let item of menuItems">
-      <a [href]="item.route">{{ item.label }}</a>
-    </li>
-  </ul>
-  <div class="actions">
-    <div class="language">
-      <span class="material-icons" aria-hidden="true">language</span>
-    </div>
-    <div class="login">
-      <span class="material-icons" aria-hidden="true">person</span>
-    </div>
-  </div>
-</nav>

package/src/lib/components/pages/menu/menu.component.scss

@@ -1,87 +0,0 @@
-:host {
-  display: flex;
-}
-
-.menu {
-  background-color: #f8f9fa;
-  padding: 10px;
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
-
-  &.vertical {
-    display: flex;
-    justify-content: space-between;
-    flex-direction: column;
-    width: 200px;
-
-    ul {
-      list-style-type: none;
-      padding: 0;
-      height: 100%;
-
-      li {
-        padding: 8px 0;
-
-        &:hover {
-          background-color: #e9ecef;
-          cursor: pointer;
-        }
-      }
-    }
-
-    .actions {
-      display: flex;
-      flex-direction: column;
-      align-items: baseline;
-    }
-  }
-
-  &.horizontal {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    height: 80px;
-
-    ul {
-      display: flex;
-      list-style-type: none;
-      padding: 0;
-      margin: 0;
-      flex-grow: 1;
-      align-items: center;
-
-      li {
-        padding: 8px 16px; /* Adjust for horizontal spacing */
-
-        &:hover {
-          background-color: #e9ecef;
-          cursor: pointer;
-        }
-      }
-    }
-  }
-
-  .logo {
-    img {
-      width: 100%;
-      height: 100%; /* Maintain aspect ratio */
-    }
-  }
-
-  .actions {
-    display: flex;
-    align-items: center;
-
-    .language,
-    .login {
-      margin-left: 10px;
-    }
-  }
-}
-
-a {
-  text-decoration: none; // Remove the underline from links
-  color: inherit; // Inherit color from parent element
-  display: block; // Make the link block-level so it fills the entire list item
-  padding: 10px; // Add some padding for clickable area
-  transition: background-color 0.3s ease; // Optional: smooth background color transition
-}

package/src/lib/components/pages/menu/menu.component.ts

@@ -1,26 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { IMenuItem } from '../../../shared/interfaces/interface';
-import { MenuDirection } from '../../../shared/enums/enum';
-import { CommonModule } from '@angular/common';
-
-@Component({
-  selector: 'app-menu',
-  standalone: true,
-  templateUrl: './menu.component.html',
-  styleUrls: ['./menu.component.scss'],
-  imports: [CommonModule]
-})
-export class MenuComponent implements OnInit {
-  @Input() menuItems: IMenuItem[] = [];
-  @Input() logoUrl: string = "";
-  @Input() direction: MenuDirection = MenuDirection.horizontal;
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-  get isVertical(): boolean {
-    return this.direction === MenuDirection.vertical;
-  }
-}

package/src/lib/components/pages/version/version.component.html

@@ -1,3 +0,0 @@
-<app-content-design
-[content] = "content">
-</app-content-design>

package/src/lib/components/pages/version/version.component.ts

@@ -1,28 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { Component, OnInit } from '@angular/core';
-import { ContentDesignComponent } from 'angular-dumb-lib';
-import { IContentDesign } from '../../../shared/interfaces/interface';
-import { ContentDirection } from '../../../shared/enums/enum';
-
-@Component({
-  selector: 'app-version',
-  standalone: true,
-  templateUrl: './version.component.html',
-  styleUrls: ['./version.component.scss'],
-  imports: [CommonModule, ContentDesignComponent]
-})
-export class VersionComponent implements OnInit {
-  content: IContentDesign;
-  constructor() {
-    this.content = {
-      title: 'Card 2 Title',
-      content: 'This is an example of left-aligned content.',
-      coverImage: 'https://via.placeholder.com/150',
-      contentDirection: ContentDirection.right,
-      template: null
-    }
-  }
-
-  ngOnInit() {
-  }
-}

package/src/lib/shared/constants/constant.ts

@@ -1,7 +0,0 @@
-import { InputType } from "../enums/enum";
-
-export const textualInputTypes: InputType[] =
-  [InputType.text, InputType.password, InputType.email, InputType.url,
-  InputType.tel, InputType.search, InputType.number, InputType.range,
-  InputType.hidden, InputType.textarea, InputType.richText, InputType.image];
-export const selectionInputTypes: InputType[] = [InputType.checkbox, InputType.radio, InputType.select]

package/src/lib/shared/enums/enum.ts

@@ -1,68 +0,0 @@
-
-export enum DesignType {
-  normal = 'normal',
-  contrast = 'contrast'
-}
-
-export enum ButtonType {
-  submit = 'submit',
-  button = 'button'
-}
-
-export enum InputGroupType {
-  textual = 'textual',
-  datetime = 'datetime',
-  selection = 'selection',
-  file = 'file'
-}
-
-export enum InputDirection {
-  horizontal = 'horizontal',
-  vertical = 'vertical'
-}
-
-export enum InputType {
-  image = 'image',
-  text = 'text',
-  richText = 'richText',
-  password = 'password',
-  email = 'email',
-  url = 'url',
-  tel = 'tel',
-  search = 'search',
-  number = 'number',
-  range = 'range',
-  hidden = 'hidden',
-  textarea = 'textarea',
-  datetime = 'datetime',
-  checkbox = 'checkbox',
-  radio = 'radio',
-  select = 'select',
-  file = 'file'
-}
-
-export enum ContentDirection {
-  left = 'left',
-  right = 'right',
-  up = 'up',
-  down = 'down'
-}
-
-export enum SelectionType {
-  dropdown = 'dropdown',
-  radio = 'radio',
-  checkbox = 'checkbox'
-}
-
-export enum LoadingSize {
-	Xbig = 'xbig',
-	Big = 'big',
-	Medium = 'medium',
-	Small = 'small',
-	Xsmall = 'xsmall'
-}
-
-export enum MenuDirection {
-  vertical = 'vertical',
-  horizontal = 'horizontal'
-}