3 upvotes
0 downvotes
Comment
Log in to vote & comment
Best LIBRARY LOL
by abalad14 days agoupvotereply

Truly-UI

License Greenkeeper badge Codacy Badge Build Status Commitizen friendly Dependency Status semantic-release

Web Components for Desktop Applications.


MotivationPrerequisitesInstallationUsageAvailable FeaturesFeedbackLicense


Motivation

TrulyUI is an Angular Framework especially developed for Desktop Applications based on Web Components using the greatest technologies of the world. TrulyUI is based on Angular, maintained by world-wide community. By the way, we believe that Angular is the most promising Web Framework. We developed TrulyUI thinking to fill a gap on open-source Web Technologies that's poor when it's about applications on Desktop. Ex: Electron, App.js and NW.js

Prerequisites

We assume that you have already installed the following packages at least and are already running an AngularIO project.

Installation

  1. Having NPM installation run the following command on your terminal to install it:

    $ npm install truly-ui --save
  2. Configure styles of used font packages (Icon Packages are already installed when running npm install truly-ui):

    Inside the angular.json file add the following paths to the styles key

    "styles": [
           "node_modules/@angular/cdk/overlay-prebuilt.css",
           "node_modules/font-awesome/css/font-awesome.min.css",
           "node_modules/ionicons-npm/css/ionicons.min.css",
           "node_modules/truly-ui/css/icons/dx-icons/dx-icons.scss"
    ]
    
  3. Configure CoreModule on your AppModule:

    import { BrowserModule } from '@angular/platform-browser';
    import { FormsModule } from '@angular/forms';
    import { NgModule } from '@angular/core';
    
    import { AppComponent } from './app.component';
    
    import { CoreModule } from 'truly-ui'; //CoreModule
     
    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        CoreModule.forRoot({theme: 'default'}) // Configurations
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

Usage

The use of the components is basically the importation of the main module and the use of the directives in its application: Example is the import of the input module and its use

import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import your library, for example the InputComponent :
import { InputModule, ButtonModule } from 'truly-ui';//Import Modules

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    // Specify your library as an import
    InputModule,
    ButtonModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Once your library is imported, you can use its components, directives and pipes in your Angular application:

<!-- You can now use your library component in app.component.html -->

 <tl-input
     [(ngModel)]="Many Properties"
     [iconBefore]="'ion-printer'"
     [placeholder]="'With Placeholder'"
     [textAfter]="'US'"
     [clearButton]="true"
     [autocomplete]="'off'">
 </tl-input>

Available Features

Feature Notes Docs
accordion Docs
autocomplete Docs
badge Docs
blockui Docs
button Docs
buttongroup Docs
calendar Docs
chatlist Docs
checkbox Docs
colorpicker Docs
contextmenu Docs
datatable Docs
datepicker Docs
dialog Docs
dropdownlist Docs
editor Docs
form Docs
input Docs
listbox Docs
menu Docs
shortcut Docs
modal Docs
multiselect Docs
multiview Docs
navigator Docs
overlaypanel Docs
panelgroup Docs
popupmenu Docs
progressbar Docs
radiobutton Docs
sidebar Docs
splitbutton Docs
switch Docs
tabcontrol Docs
theming Docs
toaster Docs
toolbar Docs
tooltip Docs
validators Docs

In progress, planned, and non-planned features

Feature Status Docs Issue
datetimepicker non-planned
hourpicker In-progress, planned S2 2018
icon In-progress, planned S2 2018
monthyearpicker non-planned
paginator In-progress, planned S1 2019
schedule In-progress, planned S1 2019
timeline non-planned
widget non-planned

Feedback

Feedback is always welcome.

License

The MIT License (MIT)

Copyright (c) 2018 Temainfo Software

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.