ngx-opalbytes-components 1.25.1 → 1.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +497 -0
- package/fesm2022/ngx-opalbytes-components.mjs +890 -2
- package/fesm2022/ngx-opalbytes-components.mjs.map +1 -1
- package/package.json +1 -1
- package/src/lib/shared/components/checkbox/checkbox.component.css +131 -0
- package/src/lib/shared/components/checkbox/checkbox.component.html +84 -0
- package/src/lib/shared/components/checkbox/checkbox.component.spec.ts +344 -0
- package/src/lib/shared/components/checkbox/checkbox.component.ts +258 -0
- package/src/lib/shared/components/checkbox/checkbox.stories.ts +240 -0
- package/src/lib/shared/components/index.ts +4 -0
- package/src/lib/shared/components/radio/radio-button.component.css +95 -0
- package/src/lib/shared/components/radio/radio-button.component.html +32 -0
- package/src/lib/shared/components/radio/radio-button.component.ts +133 -0
- package/src/lib/shared/components/radio/radio-button.stories.ts +94 -0
- package/src/lib/shared/components/radio/radio-group.component.css +21 -0
- package/src/lib/shared/components/radio/radio-group.component.ts +216 -0
- package/src/lib/shared/components/radio/radio.component.spec.ts +128 -0
- package/src/lib/shared/components/radio/radio.stories.ts +128 -0
- package/src/lib/shared/components/slide-toggle/slide-toggle.component.css +135 -0
- package/src/lib/shared/components/slide-toggle/slide-toggle.component.html +48 -0
- package/src/lib/shared/components/slide-toggle/slide-toggle.component.spec.ts +155 -0
- package/src/lib/shared/components/slide-toggle/slide-toggle.component.ts +233 -0
- package/src/lib/shared/components/slide-toggle/slide-toggle.stories.ts +165 -0
- package/types/ngx-opalbytes-components.d.ts +228 -2
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
import { LucideCheck, LucideX, provideLucideIcons } from '@lucide/angular';
|
|
2
|
+
import { applicationConfig, type Meta, type StoryObj } from '@storybook/angular-vite';
|
|
3
|
+
import { fn } from 'storybook/test';
|
|
4
|
+
|
|
5
|
+
import { CaoSlideToggleComponent } from './slide-toggle.component';
|
|
6
|
+
|
|
7
|
+
const imageIcon =
|
|
8
|
+
'data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Ccircle cx="12" cy="12" r="10" fill="%234f46e5"/%3E%3C/svg%3E';
|
|
9
|
+
|
|
10
|
+
const meta: Meta<CaoSlideToggleComponent> = {
|
|
11
|
+
title: 'Componentes/Slide Toggle',
|
|
12
|
+
component: CaoSlideToggleComponent,
|
|
13
|
+
tags: ['autodocs'],
|
|
14
|
+
decorators: [
|
|
15
|
+
applicationConfig({
|
|
16
|
+
providers: [provideLucideIcons(LucideCheck, LucideX)],
|
|
17
|
+
}),
|
|
18
|
+
],
|
|
19
|
+
argTypes: {
|
|
20
|
+
checked: { control: 'boolean' },
|
|
21
|
+
isDisabled: { control: 'boolean' },
|
|
22
|
+
disabled: { control: 'boolean' },
|
|
23
|
+
required: { control: 'boolean' },
|
|
24
|
+
label: { control: 'text' },
|
|
25
|
+
labelPosition: { control: 'select', options: ['before', 'after'] },
|
|
26
|
+
trackColor: { control: 'color' },
|
|
27
|
+
trackCheckedColor: { control: 'color' },
|
|
28
|
+
thumbColor: { control: 'color' },
|
|
29
|
+
thumbCheckedColor: { control: 'color' },
|
|
30
|
+
disabledTrackColor: { control: 'color' },
|
|
31
|
+
disabledThumbColor: { control: 'color' },
|
|
32
|
+
labelColor: { control: 'color' },
|
|
33
|
+
disabledLabelColor: { control: 'color' },
|
|
34
|
+
focusRingColor: { control: 'color' },
|
|
35
|
+
trackWidth: { control: 'text' },
|
|
36
|
+
trackHeight: { control: 'text' },
|
|
37
|
+
thumbSize: { control: 'text' },
|
|
38
|
+
animationDuration: { control: 'text' },
|
|
39
|
+
thumbIcon: { control: 'text' },
|
|
40
|
+
thumbCheckedIcon: { control: 'text' },
|
|
41
|
+
isLucideThumbIcon: { control: 'boolean' },
|
|
42
|
+
thumbIconColor: { control: 'color' },
|
|
43
|
+
thumbCheckedIconColor: { control: 'color' },
|
|
44
|
+
thumbIconSize: { control: 'text' },
|
|
45
|
+
thumbIconStrokeWidth: { control: 'text' },
|
|
46
|
+
},
|
|
47
|
+
args: {
|
|
48
|
+
checked: false,
|
|
49
|
+
isDisabled: false,
|
|
50
|
+
label: 'Ativar notificações',
|
|
51
|
+
labelPosition: 'after',
|
|
52
|
+
thumbIcon: '',
|
|
53
|
+
thumbCheckedIcon: '',
|
|
54
|
+
isLucideThumbIcon: false,
|
|
55
|
+
thumbIconColor: '',
|
|
56
|
+
thumbCheckedIconColor: '',
|
|
57
|
+
thumbIconSize: 12,
|
|
58
|
+
thumbIconStrokeWidth: 2,
|
|
59
|
+
checkedChange: fn(),
|
|
60
|
+
toggleChange: fn(),
|
|
61
|
+
},
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
export default meta;
|
|
65
|
+
type Story = StoryObj<CaoSlideToggleComponent>;
|
|
66
|
+
|
|
67
|
+
export const Padrao: Story = {
|
|
68
|
+
args: {
|
|
69
|
+
checked: false,
|
|
70
|
+
},
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
export const Ativado: Story = {
|
|
74
|
+
args: {
|
|
75
|
+
checked: true,
|
|
76
|
+
label: 'Notificações ativadas',
|
|
77
|
+
},
|
|
78
|
+
};
|
|
79
|
+
|
|
80
|
+
export const Desabilitado: Story = {
|
|
81
|
+
args: {
|
|
82
|
+
checked: false,
|
|
83
|
+
isDisabled: true,
|
|
84
|
+
label: 'Desabilitado',
|
|
85
|
+
},
|
|
86
|
+
};
|
|
87
|
+
|
|
88
|
+
export const DesabilitadoAtivado: Story = {
|
|
89
|
+
args: {
|
|
90
|
+
checked: true,
|
|
91
|
+
isDisabled: true,
|
|
92
|
+
label: 'Desabilitado e ativado',
|
|
93
|
+
},
|
|
94
|
+
};
|
|
95
|
+
|
|
96
|
+
export const LabelAntes: Story = {
|
|
97
|
+
args: {
|
|
98
|
+
checked: true,
|
|
99
|
+
label: 'Label antes',
|
|
100
|
+
labelPosition: 'before',
|
|
101
|
+
},
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
export const CoresCustomizadas: Story = {
|
|
105
|
+
args: {
|
|
106
|
+
checked: true,
|
|
107
|
+
label: 'Cores customizadas',
|
|
108
|
+
trackCheckedColor: '#16a34a',
|
|
109
|
+
thumbCheckedColor: '#ffffff',
|
|
110
|
+
trackColor: '#fca5a5',
|
|
111
|
+
thumbColor: '#ffffff',
|
|
112
|
+
labelColor: '#166534',
|
|
113
|
+
},
|
|
114
|
+
};
|
|
115
|
+
|
|
116
|
+
export const TamanhoCustomizado: Story = {
|
|
117
|
+
args: {
|
|
118
|
+
checked: true,
|
|
119
|
+
label: 'Tamanho customizado',
|
|
120
|
+
trackWidth: '52px',
|
|
121
|
+
trackHeight: '28px',
|
|
122
|
+
thumbSize: '22px',
|
|
123
|
+
animationDuration: '300ms',
|
|
124
|
+
},
|
|
125
|
+
};
|
|
126
|
+
|
|
127
|
+
export const IconesLucide: Story = {
|
|
128
|
+
args: {
|
|
129
|
+
checked: true,
|
|
130
|
+
label: 'Notificações ativadas',
|
|
131
|
+
thumbIcon: 'x',
|
|
132
|
+
thumbCheckedIcon: 'check',
|
|
133
|
+
isLucideThumbIcon: true,
|
|
134
|
+
thumbIconColor: '#6b7280',
|
|
135
|
+
thumbCheckedIconColor: '#16a34a',
|
|
136
|
+
thumbIconSize: 12,
|
|
137
|
+
thumbIconStrokeWidth: 2.5,
|
|
138
|
+
},
|
|
139
|
+
};
|
|
140
|
+
|
|
141
|
+
export const IconeImagem: Story = {
|
|
142
|
+
args: {
|
|
143
|
+
checked: true,
|
|
144
|
+
label: 'Ícone via URL',
|
|
145
|
+
thumbIcon: imageIcon,
|
|
146
|
+
thumbCheckedIcon: imageIcon,
|
|
147
|
+
isLucideThumbIcon: false,
|
|
148
|
+
thumbIconSize: 10,
|
|
149
|
+
},
|
|
150
|
+
};
|
|
151
|
+
|
|
152
|
+
export const IconeTamanhoCustomizado: Story = {
|
|
153
|
+
args: {
|
|
154
|
+
checked: true,
|
|
155
|
+
label: 'Ícone maior',
|
|
156
|
+
thumbIcon: 'x',
|
|
157
|
+
thumbCheckedIcon: 'check',
|
|
158
|
+
isLucideThumbIcon: true,
|
|
159
|
+
thumbIconSize: 16,
|
|
160
|
+
thumbIconStrokeWidth: 3,
|
|
161
|
+
trackWidth: '52px',
|
|
162
|
+
trackHeight: '28px',
|
|
163
|
+
thumbSize: '24px',
|
|
164
|
+
},
|
|
165
|
+
};
|
|
@@ -637,6 +637,232 @@ declare class CaoBaseToggleComponent {
|
|
|
637
637
|
static ɵcmp: i0.ɵɵComponentDeclaration<CaoBaseToggleComponent, "cao-base-toggle", never, { "type": { "alias": "type"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "inputClass": { "alias": "inputClass"; "required": false; }; "value": { "alias": "value"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; "maxLength": { "alias": "maxLength"; "required": false; }; "searchMode": { "alias": "searchMode"; "required": false; }; "showBorder": { "alias": "showBorder"; "required": false; }; "isLucideIcon": { "alias": "isLucideIcon"; "required": false; }; "iconColor": { "alias": "iconColor"; "required": false; }; "mask": { "alias": "mask"; "required": false; }; "control": { "alias": "control"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "textareaRows": { "alias": "textareaRows"; "required": false; }; "decimalMarker": { "alias": "decimalMarker"; "required": false; }; "thousandSeparator": { "alias": "thousandSeparator"; "required": false; }; "allowNegativeNumbers": { "alias": "allowNegativeNumbers"; "required": false; }; "separatorLimit": { "alias": "separatorLimit"; "required": false; }; "leadingIcon": { "alias": "leadingIcon"; "required": false; }; "trailingIcon": { "alias": "trailingIcon"; "required": false; }; "controlName": { "alias": "controlName"; "required": false; }; "isChecked": { "alias": "isChecked"; "required": false; }; "checkedTextPlaceholder": { "alias": "checkedTextPlaceholder"; "required": false; }; "uncheckedTextPlaceholder": { "alias": "uncheckedTextPlaceholder"; "required": false; }; }, { "valueChange": "valueChange"; "searchClick": "searchClick"; "inputChange": "inputChange"; "statusChanged": "statusChanged"; }, never, never, true, never>;
|
|
638
638
|
}
|
|
639
639
|
|
|
640
|
+
interface ICaoSlideToggleChangeEvent {
|
|
641
|
+
checked: boolean;
|
|
642
|
+
source: CaoSlideToggleComponent;
|
|
643
|
+
}
|
|
644
|
+
declare class CaoSlideToggleComponent implements ControlValueAccessor {
|
|
645
|
+
checked: boolean;
|
|
646
|
+
isDisabled: boolean;
|
|
647
|
+
label: string;
|
|
648
|
+
labelPosition: "before" | "after";
|
|
649
|
+
name: string;
|
|
650
|
+
id: string;
|
|
651
|
+
ariaLabel: string;
|
|
652
|
+
dataCy: string;
|
|
653
|
+
required: boolean;
|
|
654
|
+
trackColor?: string;
|
|
655
|
+
trackCheckedColor?: string;
|
|
656
|
+
thumbColor?: string;
|
|
657
|
+
thumbCheckedColor?: string;
|
|
658
|
+
disabledTrackColor?: string;
|
|
659
|
+
disabledThumbColor?: string;
|
|
660
|
+
labelColor?: string;
|
|
661
|
+
disabledLabelColor?: string;
|
|
662
|
+
focusRingColor?: string;
|
|
663
|
+
trackWidth?: string;
|
|
664
|
+
trackHeight?: string;
|
|
665
|
+
thumbSize?: string;
|
|
666
|
+
animationDuration?: string;
|
|
667
|
+
thumbIcon: string;
|
|
668
|
+
thumbCheckedIcon: string;
|
|
669
|
+
isLucideThumbIcon: boolean;
|
|
670
|
+
thumbIconColor: string;
|
|
671
|
+
thumbCheckedIconColor: string;
|
|
672
|
+
thumbIconSize: string | number;
|
|
673
|
+
thumbIconStrokeWidth: string | number;
|
|
674
|
+
set disabled(value: boolean);
|
|
675
|
+
get disabled(): boolean;
|
|
676
|
+
readonly checkedChange: EventEmitter<boolean>;
|
|
677
|
+
readonly toggleChange: EventEmitter<ICaoSlideToggleChangeEvent>;
|
|
678
|
+
private readonly cdr;
|
|
679
|
+
private onChange;
|
|
680
|
+
private onTouched;
|
|
681
|
+
get resolvedThumbIcon(): string;
|
|
682
|
+
get resolvedThumbIconColor(): string;
|
|
683
|
+
get hostStyles(): Record<string, string>;
|
|
684
|
+
toggle(): void;
|
|
685
|
+
setChecked(value: boolean): void;
|
|
686
|
+
enable(): void;
|
|
687
|
+
disable(): void;
|
|
688
|
+
onInputChange(event: Event): void;
|
|
689
|
+
onEnter(event: Event): void;
|
|
690
|
+
onBlur(): void;
|
|
691
|
+
writeValue(value: boolean | null): void;
|
|
692
|
+
registerOnChange(fn: (value: boolean) => void): void;
|
|
693
|
+
registerOnTouched(fn: () => void): void;
|
|
694
|
+
setDisabledState(isDisabled: boolean): void;
|
|
695
|
+
private toCssLength;
|
|
696
|
+
private updateChecked;
|
|
697
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CaoSlideToggleComponent, never>;
|
|
698
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<CaoSlideToggleComponent, "cao-slide-toggle", never, { "checked": { "alias": "checked"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; "label": { "alias": "label"; "required": false; }; "labelPosition": { "alias": "labelPosition"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "required": { "alias": "required"; "required": false; }; "trackColor": { "alias": "trackColor"; "required": false; }; "trackCheckedColor": { "alias": "trackCheckedColor"; "required": false; }; "thumbColor": { "alias": "thumbColor"; "required": false; }; "thumbCheckedColor": { "alias": "thumbCheckedColor"; "required": false; }; "disabledTrackColor": { "alias": "disabledTrackColor"; "required": false; }; "disabledThumbColor": { "alias": "disabledThumbColor"; "required": false; }; "labelColor": { "alias": "labelColor"; "required": false; }; "disabledLabelColor": { "alias": "disabledLabelColor"; "required": false; }; "focusRingColor": { "alias": "focusRingColor"; "required": false; }; "trackWidth": { "alias": "trackWidth"; "required": false; }; "trackHeight": { "alias": "trackHeight"; "required": false; }; "thumbSize": { "alias": "thumbSize"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "thumbIcon": { "alias": "thumbIcon"; "required": false; }; "thumbCheckedIcon": { "alias": "thumbCheckedIcon"; "required": false; }; "isLucideThumbIcon": { "alias": "isLucideThumbIcon"; "required": false; }; "thumbIconColor": { "alias": "thumbIconColor"; "required": false; }; "thumbCheckedIconColor": { "alias": "thumbCheckedIconColor"; "required": false; }; "thumbIconSize": { "alias": "thumbIconSize"; "required": false; }; "thumbIconStrokeWidth": { "alias": "thumbIconStrokeWidth"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "checkedChange": "checkedChange"; "toggleChange": "toggleChange"; }, never, ["*"], true, never>;
|
|
699
|
+
}
|
|
700
|
+
|
|
701
|
+
declare class CaoRadioButtonComponent {
|
|
702
|
+
readonly group: CaoRadioGroupComponent | null;
|
|
703
|
+
value: unknown;
|
|
704
|
+
label: string;
|
|
705
|
+
isDisabled: boolean;
|
|
706
|
+
labelPosition?: "before" | "after";
|
|
707
|
+
id: string;
|
|
708
|
+
name: string;
|
|
709
|
+
ariaLabel: string;
|
|
710
|
+
ariaLabelledBy: string;
|
|
711
|
+
dataCy: string;
|
|
712
|
+
color?: string;
|
|
713
|
+
unselectedColor?: string;
|
|
714
|
+
disabledColor?: string;
|
|
715
|
+
labelColor?: string;
|
|
716
|
+
disabledLabelColor?: string;
|
|
717
|
+
focusRingColor?: string;
|
|
718
|
+
size?: string;
|
|
719
|
+
animationDuration?: string;
|
|
720
|
+
set disabled(value: boolean);
|
|
721
|
+
get disabled(): boolean;
|
|
722
|
+
private readonly uid;
|
|
723
|
+
constructor(group: CaoRadioGroupComponent | null);
|
|
724
|
+
get effectiveDisabled(): boolean;
|
|
725
|
+
get effectiveLabelPosition(): "before" | "after";
|
|
726
|
+
get effectiveName(): string;
|
|
727
|
+
get inputId(): string;
|
|
728
|
+
get isSelected(): boolean;
|
|
729
|
+
get isRequired(): boolean;
|
|
730
|
+
get hostStyles(): Record<string, string>;
|
|
731
|
+
select(): void;
|
|
732
|
+
onBlur(): void;
|
|
733
|
+
enable(): void;
|
|
734
|
+
disable(): void;
|
|
735
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CaoRadioButtonComponent, [{ optional: true; }]>;
|
|
736
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<CaoRadioButtonComponent, "cao-radio-button", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; "labelPosition": { "alias": "labelPosition"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "color": { "alias": "color"; "required": false; }; "unselectedColor": { "alias": "unselectedColor"; "required": false; }; "disabledColor": { "alias": "disabledColor"; "required": false; }; "labelColor": { "alias": "labelColor"; "required": false; }; "disabledLabelColor": { "alias": "disabledLabelColor"; "required": false; }; "focusRingColor": { "alias": "focusRingColor"; "required": false; }; "size": { "alias": "size"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
737
|
+
}
|
|
738
|
+
|
|
739
|
+
interface ICaoRadioChangeEvent {
|
|
740
|
+
value: unknown;
|
|
741
|
+
source: CaoRadioButtonComponent;
|
|
742
|
+
}
|
|
743
|
+
declare class CaoRadioGroupComponent implements ControlValueAccessor {
|
|
744
|
+
value: unknown;
|
|
745
|
+
name: string;
|
|
746
|
+
isDisabled: boolean;
|
|
747
|
+
required: boolean;
|
|
748
|
+
orientation: "vertical" | "horizontal";
|
|
749
|
+
labelPosition: "before" | "after";
|
|
750
|
+
compareWith: (option: unknown, value: unknown) => boolean;
|
|
751
|
+
color?: string;
|
|
752
|
+
unselectedColor?: string;
|
|
753
|
+
disabledColor?: string;
|
|
754
|
+
labelColor?: string;
|
|
755
|
+
disabledLabelColor?: string;
|
|
756
|
+
focusRingColor?: string;
|
|
757
|
+
size?: string;
|
|
758
|
+
animationDuration?: string;
|
|
759
|
+
gap?: string;
|
|
760
|
+
ariaLabel: string;
|
|
761
|
+
ariaLabelledBy: string;
|
|
762
|
+
dataCy: string;
|
|
763
|
+
set disabled(value: boolean);
|
|
764
|
+
get disabled(): boolean;
|
|
765
|
+
readonly valueChange: EventEmitter<unknown>;
|
|
766
|
+
readonly selectionChange: EventEmitter<ICaoRadioChangeEvent>;
|
|
767
|
+
readonly resolvedName: string;
|
|
768
|
+
private readonly cdr;
|
|
769
|
+
private formDisabled;
|
|
770
|
+
private onChange;
|
|
771
|
+
private onTouched;
|
|
772
|
+
get isEffectivelyDisabled(): boolean;
|
|
773
|
+
readonly role = "radiogroup";
|
|
774
|
+
get isHorizontal(): boolean;
|
|
775
|
+
get isDisabledClass(): boolean;
|
|
776
|
+
get ariaLabelAttr(): string | null;
|
|
777
|
+
get ariaLabelledByAttr(): string | null;
|
|
778
|
+
get ariaDisabledAttr(): boolean | null;
|
|
779
|
+
get ariaRequiredAttr(): boolean | null;
|
|
780
|
+
get dataCyAttr(): string | null;
|
|
781
|
+
get hostStyles(): Record<string, string>;
|
|
782
|
+
get groupName(): string;
|
|
783
|
+
isValueSelected(value: unknown): boolean;
|
|
784
|
+
select(button: CaoRadioButtonComponent): void;
|
|
785
|
+
markAsTouched(): void;
|
|
786
|
+
enable(): void;
|
|
787
|
+
disable(): void;
|
|
788
|
+
writeValue(value: unknown): void;
|
|
789
|
+
registerOnChange(fn: (value: unknown) => void): void;
|
|
790
|
+
registerOnTouched(fn: () => void): void;
|
|
791
|
+
setDisabledState(isDisabled: boolean): void;
|
|
792
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CaoRadioGroupComponent, never>;
|
|
793
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<CaoRadioGroupComponent, "cao-radio-group", never, { "value": { "alias": "value"; "required": false; }; "name": { "alias": "name"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "labelPosition": { "alias": "labelPosition"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "color": { "alias": "color"; "required": false; }; "unselectedColor": { "alias": "unselectedColor"; "required": false; }; "disabledColor": { "alias": "disabledColor"; "required": false; }; "labelColor": { "alias": "labelColor"; "required": false; }; "disabledLabelColor": { "alias": "disabledLabelColor"; "required": false; }; "focusRingColor": { "alias": "focusRingColor"; "required": false; }; "size": { "alias": "size"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; "selectionChange": "selectionChange"; }, never, ["*"], true, never>;
|
|
794
|
+
}
|
|
795
|
+
|
|
796
|
+
interface ICaoCheckboxChangeEvent {
|
|
797
|
+
checked: boolean;
|
|
798
|
+
source: CaoCheckboxComponent;
|
|
799
|
+
}
|
|
800
|
+
declare class CaoCheckboxComponent implements ControlValueAccessor, OnChanges, OnDestroy {
|
|
801
|
+
checked: boolean;
|
|
802
|
+
indeterminate: boolean;
|
|
803
|
+
isDisabled: boolean;
|
|
804
|
+
required: boolean;
|
|
805
|
+
label: string;
|
|
806
|
+
labelPosition: "before" | "after";
|
|
807
|
+
name: string;
|
|
808
|
+
id: string;
|
|
809
|
+
ariaLabel: string;
|
|
810
|
+
ariaLabelledBy: string;
|
|
811
|
+
dataCy: string;
|
|
812
|
+
control?: AbstractControl | null;
|
|
813
|
+
errorMessage: string;
|
|
814
|
+
color?: string;
|
|
815
|
+
uncheckedColor?: string;
|
|
816
|
+
disabledColor?: string;
|
|
817
|
+
labelColor?: string;
|
|
818
|
+
disabledLabelColor?: string;
|
|
819
|
+
focusRingColor?: string;
|
|
820
|
+
size?: string;
|
|
821
|
+
borderRadius?: string;
|
|
822
|
+
animationDuration?: string;
|
|
823
|
+
checkedIcon: string;
|
|
824
|
+
uncheckedIcon: string;
|
|
825
|
+
indeterminateIcon: string;
|
|
826
|
+
isLucideIcon: boolean;
|
|
827
|
+
iconColor: string;
|
|
828
|
+
checkedIconColor: string;
|
|
829
|
+
uncheckedIconColor: string;
|
|
830
|
+
iconSize: string | number;
|
|
831
|
+
iconStrokeWidth: string | number;
|
|
832
|
+
set disabled(value: boolean);
|
|
833
|
+
get disabled(): boolean;
|
|
834
|
+
readonly checkedChange: EventEmitter<boolean>;
|
|
835
|
+
readonly indeterminateChange: EventEmitter<boolean>;
|
|
836
|
+
readonly checkboxChange: EventEmitter<ICaoCheckboxChangeEvent>;
|
|
837
|
+
private readonly cdr;
|
|
838
|
+
private readonly uid;
|
|
839
|
+
private controlSub?;
|
|
840
|
+
private onChange;
|
|
841
|
+
private onTouched;
|
|
842
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
843
|
+
ngOnDestroy(): void;
|
|
844
|
+
get inputId(): string;
|
|
845
|
+
get hasError(): boolean;
|
|
846
|
+
get hasInvalidState(): boolean;
|
|
847
|
+
get hasValidState(): boolean;
|
|
848
|
+
get resolvedIconColor(): string;
|
|
849
|
+
get hostStyles(): Record<string, string>;
|
|
850
|
+
toggle(): void;
|
|
851
|
+
setChecked(value: boolean, emit?: boolean): void;
|
|
852
|
+
setIndeterminate(value: boolean): void;
|
|
853
|
+
enable(): void;
|
|
854
|
+
disable(): void;
|
|
855
|
+
onInputChange(event: Event): void;
|
|
856
|
+
onBlur(): void;
|
|
857
|
+
writeValue(value: boolean | null): void;
|
|
858
|
+
registerOnChange(fn: (value: boolean) => void): void;
|
|
859
|
+
registerOnTouched(fn: () => void): void;
|
|
860
|
+
setDisabledState(isDisabled: boolean): void;
|
|
861
|
+
private toCssLength;
|
|
862
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CaoCheckboxComponent, never>;
|
|
863
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<CaoCheckboxComponent, "cao-checkbox", never, { "checked": { "alias": "checked"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "label": { "alias": "label"; "required": false; }; "labelPosition": { "alias": "labelPosition"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "control": { "alias": "control"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "color": { "alias": "color"; "required": false; }; "uncheckedColor": { "alias": "uncheckedColor"; "required": false; }; "disabledColor": { "alias": "disabledColor"; "required": false; }; "labelColor": { "alias": "labelColor"; "required": false; }; "disabledLabelColor": { "alias": "disabledLabelColor"; "required": false; }; "focusRingColor": { "alias": "focusRingColor"; "required": false; }; "size": { "alias": "size"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "checkedIcon": { "alias": "checkedIcon"; "required": false; }; "uncheckedIcon": { "alias": "uncheckedIcon"; "required": false; }; "indeterminateIcon": { "alias": "indeterminateIcon"; "required": false; }; "isLucideIcon": { "alias": "isLucideIcon"; "required": false; }; "iconColor": { "alias": "iconColor"; "required": false; }; "checkedIconColor": { "alias": "checkedIconColor"; "required": false; }; "uncheckedIconColor": { "alias": "uncheckedIconColor"; "required": false; }; "iconSize": { "alias": "iconSize"; "required": false; }; "iconStrokeWidth": { "alias": "iconStrokeWidth"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "checkedChange": "checkedChange"; "indeterminateChange": "indeterminateChange"; "checkboxChange": "checkboxChange"; }, never, ["*"], true, never>;
|
|
864
|
+
}
|
|
865
|
+
|
|
640
866
|
type ModalType = "validation" | "finger" | "facial" | "clinic" | "graph" | "restriction" | "default";
|
|
641
867
|
interface IModal {
|
|
642
868
|
status: boolean;
|
|
@@ -1092,5 +1318,5 @@ declare class CaoBaseWidgetComponent<TData = unknown> {
|
|
|
1092
1318
|
static ɵcmp: i0.ɵɵComponentDeclaration<CaoBaseWidgetComponent<any>, "cao-base-widget", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "subtitle": { "alias": "subtitle"; "required": false; "isSignal": true; }; "widgetIcon": { "alias": "widgetIcon"; "required": false; "isSignal": true; }; "cancelTextButton": { "alias": "cancelTextButton"; "required": false; "isSignal": true; }; "saveTextButton": { "alias": "saveTextButton"; "required": false; "isSignal": true; }; "displayActionButton": { "alias": "displayActionButton"; "required": false; "isSignal": true; }; "displaySaveButton": { "alias": "displaySaveButton"; "required": false; "isSignal": true; }; "displayCancelButton": { "alias": "displayCancelButton"; "required": false; "isSignal": true; }; "shouldCloseWhenCancel": { "alias": "shouldCloseWhenCancel"; "required": false; "isSignal": true; }; "widgetDirection": { "alias": "widgetDirection"; "required": false; "isSignal": true; }; "typeCancel": { "alias": "typeCancel"; "required": false; "isSignal": true; }; "saveDisabled": { "alias": "saveDisabled"; "required": false; "isSignal": true; }; "saveIcon": { "alias": "saveIcon"; "required": false; "isSignal": true; }; "saveIconPosition": { "alias": "saveIconPosition"; "required": false; "isSignal": true; }; "closeOnClickOutside": { "alias": "closeOnClickOutside"; "required": false; "isSignal": true; }; "confirmOnClose": { "alias": "confirmOnClose"; "required": false; "isSignal": true; }; "widgetData": { "alias": "widgetData"; "required": false; "isSignal": true; }; }, { "save": "save"; "deleted": "deleted"; "cancelEvent": "cancelEvent"; "closeRequest": "closeRequest"; }, never, ["widget-title", "*"], true, never>;
|
|
1093
1319
|
}
|
|
1094
1320
|
|
|
1095
|
-
export { BaseAlert, BaseAlertService, BaseDialog, BaseDialogService, BaseFilterTablePaginatedService, BaseFilterTableService, BaseModal, BaseModalService, BasePaginationService, BaseTable, BaseTablePaginated, BaseTableService, BaseTimeRange, CaoAutocompleteComponent, CaoBaseButtonComponent, CaoBaseIcon, CaoBaseInput, CaoBaseToggleComponent, CaoBaseWidgetComponent, CaoCardComponent, CaoDropDownComponent, CaoError, CaoFormField, CaoHint, CaoKpi, CaoSkeletonComponent, CaoTabGroup, CaoTabPanel, CaoWidgetService, DEFAULT_ERROR_STATE_MATCHER, ErrorStateMatcher, Footer, LinksButton, Paginator, ShowOnDirtyErrorStateMatcher, StepComponent, StepperComponent, TablePaginatedService, TimePicker, getPtBrPaginatorIntlBasePaginated, getPtBrPaginatorIntlBaseTable };
|
|
1096
|
-
export type { AlertType, CaoCardVariant, CaoSkeletonVariant, CaoTypeInputs, CaoWidgetDirection, DialogType, IAlertConfig, ICaoAutoCompleteOption, ICaoCardAvatar, ICaoCardBadge, ICaoCardMeta, ICaoDropDownOption, ICaoImage, ICaoKPI, ICaoTabChangeEvent, ICaoWidgetOptions, IColumnButton, IColumnConfig, IColumnPaginatedButton, IColumnPaginatedConfig, IDialogConfig, IErrorStateMatcher, IFormFieldControl, IModal, INavContent, INavLink, ITableConfig, ITablePaginatedConfig, ModalType, ModalTypeClass, ModalTypeSize };
|
|
1321
|
+
export { BaseAlert, BaseAlertService, BaseDialog, BaseDialogService, BaseFilterTablePaginatedService, BaseFilterTableService, BaseModal, BaseModalService, BasePaginationService, BaseTable, BaseTablePaginated, BaseTableService, BaseTimeRange, CaoAutocompleteComponent, CaoBaseButtonComponent, CaoBaseIcon, CaoBaseInput, CaoBaseToggleComponent, CaoBaseWidgetComponent, CaoCardComponent, CaoCheckboxComponent, CaoDropDownComponent, CaoError, CaoFormField, CaoHint, CaoKpi, CaoRadioButtonComponent, CaoRadioGroupComponent, CaoSkeletonComponent, CaoSlideToggleComponent, CaoTabGroup, CaoTabPanel, CaoWidgetService, DEFAULT_ERROR_STATE_MATCHER, ErrorStateMatcher, Footer, LinksButton, Paginator, ShowOnDirtyErrorStateMatcher, StepComponent, StepperComponent, TablePaginatedService, TimePicker, getPtBrPaginatorIntlBasePaginated, getPtBrPaginatorIntlBaseTable };
|
|
1322
|
+
export type { AlertType, CaoCardVariant, CaoSkeletonVariant, CaoTypeInputs, CaoWidgetDirection, DialogType, IAlertConfig, ICaoAutoCompleteOption, ICaoCardAvatar, ICaoCardBadge, ICaoCardMeta, ICaoCheckboxChangeEvent, ICaoDropDownOption, ICaoImage, ICaoKPI, ICaoRadioChangeEvent, ICaoSlideToggleChangeEvent, ICaoTabChangeEvent, ICaoWidgetOptions, IColumnButton, IColumnConfig, IColumnPaginatedButton, IColumnPaginatedConfig, IDialogConfig, IErrorStateMatcher, IFormFieldControl, IModal, INavContent, INavLink, ITableConfig, ITablePaginatedConfig, ModalType, ModalTypeClass, ModalTypeSize };
|