lct-components v0.11.14
LctComponents
This library was generated with Angular CLI version 12.1.0.
How to use
npm i lct-components --save
- Import LctComponentsModule to component module
- Add
<lct-select></lct-select>
to html component - add change
title
attribute - add
options
attribute to select options - get value selected with
(value)
when select change value
Example
Select
<lct-select
title="Title to component"
placeholder="Select option"
(value)="changeSelect($event)"
[options]="['Option one', 'option two']]"
>
</lct-select>
Select multiple
<lct-select-multiple [list]="list2"
placeholder="select options"
title="Insert title"
(shareCheckedList)="shareCheckedList($event)"
(shareIndividualCheckedList)="myFunction($event)">
</lct-select-multiple>
Input Text
<lct-input-text
icon="assets/img/keyboard.svg"
[showIcon]="true"
(iconClick)="myFunction()"
placeholder="Insert placeholder"
[(ngModel)]="value"
(enterEmitted)="myFunctionEnter($event)"
iconPosition="right"
title="Insert title"
></lct-input-text>
<lct-input-text
[disabled]="true"
icon="assets/img/keyboard.svg"
[showIcon]="true"
(iconClick)="myFunction()"
(enterEmitted)="myFunctionEnter($event)"
iconPosition="left"
></lct-input-text>
<lct-input-text
(enterEmitted)="myFunctionEnter($event)"
[(ngModel)]="value"
></lct-input-text>
Buttons
<lct-button buttonType="primary" title="Primary"></lct-button>
<lct-button buttonType="secondary" title="Secondary"></lct-button>
<lct-button buttonType="error" title="Error"></lct-button>
<lct-button buttonType="success" title="Success"></lct-button>
tooltip directive
<lct-button
buttonType="primary"
title="Primary"
lctTooltip
tooltipText="Tooltip from button 1"
position="right"
color="tertiary"
></lct-button>
<lct-button
buttonType="secondary"
title="Secondary"
lctTooltip
tooltipText="Tooltip from button 2"
position="top"
marginBottom="55px"
color="primary"
></lct-button>
<lct-button
[title]="'Estoy en'"
buttonType="secondary"
icon="./assets/img/Tienda.svg"
lctModalTooltip
[dateVersion]="'10/08/2022'"
[version]="'1.0.0'"
[widthModalConfig]="'458px'"
[heightModalConfig]="'268px'"
[nodes]="tiendas"
(changeNode)="changeNode($event)"
(openModalChangeNode)="openModalChangeNode($event)"
[country]="'CL'"
></lct-button>
Overlay loading
yourComponent.html
...
<lct-loading #lctLoading></lct-loading>
...
-----------------------------------------------------------
yourComponent.ts
...
@ViewChild('lctLoading') lctLoading!: LoadingComponent;
...
Method | Description | Example |
---|---|---|
show(): void | show overlay | this.lctLoading.show() |
dismiss(): void | hide overlay | this.lctLoading.dismiss() |
Rate experience
...
<lct-rate-experience class="fixed-bottom-right" *ngIf="show" (sendVote)="sendVote($event)" (closeRate)="closeRate($event)" (skip)="skipRate($event)" [titleQuestion]="'¿Cómo te fue con la entrega al cliente?'"></lct-rate-experience>
...
> Version 0.11.14
>
> [(ngModel)] Can only be used at the moment for:
>
> > lct-input-text
> > lct-switch
8 months ago
8 months ago
7 months ago
11 months ago
10 months ago
11 months ago
11 months ago
11 months ago
10 months ago
10 months ago
12 months ago
12 months ago
11 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago