@dev-tcloud/tcloud-ui 7.7.1 → 7.7.3
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/docs/tcloud-ui-tab-menu.md +33 -21
- package/fesm2022/dev-tcloud-tcloud-ui.mjs +112 -22
- package/fesm2022/dev-tcloud-tcloud-ui.mjs.map +1 -1
- package/js/tcloud-ui-app.js +72 -71
- package/package.json +1 -1
- package/scss/tcloud-revitalizacao/components/_tc-rev-input-control.scss +15 -0
- package/types/dev-tcloud-tcloud-ui.d.ts +34 -6
|
@@ -44,16 +44,16 @@ export class ExampleComponent {}
|
|
|
44
44
|
| registerInUrl | boolean | Atualiza query param `tab` com a aba ativa. | false |
|
|
45
45
|
| loading | boolean | Propaga estado de carregamento para abas. | false |
|
|
46
46
|
| active | string | Id da aba ativa inicial (aceita atualização). | '' |
|
|
47
|
-
| full | boolean |
|
|
47
|
+
| full | boolean | Distribui os itens do head para preencher a largura disponível. | false |
|
|
48
48
|
|
|
49
49
|
### `tcloud-ui-tab-head`
|
|
50
50
|
|
|
51
51
|
| Nome | Tipo | Descrição | Valor Default |
|
|
52
52
|
| --------------- | -------------------------------------------- | ---------------------------------------- | ------------------------------------------ |
|
|
53
53
|
| scroll | boolean | Controla scroll horizontal do cabeçalho. | true |
|
|
54
|
-
| appearance | 'default'\|'
|
|
55
|
-
|
|
|
56
|
-
|
|
|
54
|
+
| appearance | 'default'\|'segmented' | Define a aparência do cabeçalho. `default` é o layout preenchido padrão e `segmented` cria o trilho arredondado. | 'default' |
|
|
55
|
+
| density | 'default'\|'compact' | Define a densidade visual. Use `compact` para reduzir fonte, padding e altura do head. | 'default' |
|
|
56
|
+
| wrapLabel | boolean | Permite quebra de linha nos labels, removendo ellipsis e mantendo alinhamento central. | false |
|
|
57
57
|
| bottom_line | boolean | Exibe linha inferior. | false |
|
|
58
58
|
| tabOptionTextTone | 'default'\|'inverse' | Tom semântico do texto dos itens visuais do head (`default` escuro, `inverse` claro). | 'default' |
|
|
59
59
|
| tabOptionActiveTextTone | 'default'\|'inverse' | Tom semântico do texto ativo dos itens visuais do head (`default` claro, `inverse` escuro). | 'default' |
|
|
@@ -93,9 +93,11 @@ export class ExampleComponent {}
|
|
|
93
93
|
|
|
94
94
|
### Uso Básico
|
|
95
95
|
|
|
96
|
+
O layout padrão de `tcloud-ui-tab-title` é `default`; não é necessário informar `appearance` para usar o menu preenchido.
|
|
97
|
+
|
|
96
98
|
```html
|
|
97
99
|
<tcloud-ui-tab-menu [active]="'tab-1'" (onChange)="onTab($event)">
|
|
98
|
-
<tcloud-ui-tab-head [bottom_line]="
|
|
100
|
+
<tcloud-ui-tab-head [bottom_line]="false" [background]="true">
|
|
99
101
|
<tcloud-ui-tab-title tab="tab-1">Tab 1</tcloud-ui-tab-title>
|
|
100
102
|
<tcloud-ui-tab-title tab="tab-2">Tab 2</tcloud-ui-tab-title>
|
|
101
103
|
</tcloud-ui-tab-head>
|
|
@@ -105,31 +107,42 @@ export class ExampleComponent {}
|
|
|
105
107
|
</tcloud-ui-tab-menu>
|
|
106
108
|
```
|
|
107
109
|
|
|
108
|
-
###
|
|
110
|
+
### Menu horizontal preenchido
|
|
109
111
|
|
|
110
112
|
```html
|
|
111
|
-
<tcloud-ui-tab-menu [active]="'
|
|
112
|
-
<tcloud-ui-tab-head
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
113
|
+
<tcloud-ui-tab-menu [active]="'environment-details'" [full]="true">
|
|
114
|
+
<tcloud-ui-tab-head
|
|
115
|
+
[bottom_line]="false"
|
|
116
|
+
[background]="true"
|
|
117
|
+
tabOptionActiveTextTone="inverse">
|
|
118
|
+
<tcloud-ui-tab-title tab="environment-details">Detalhes do ambiente</tcloud-ui-tab-title>
|
|
119
|
+
<tcloud-ui-tab-title tab="monitoring">Monitoramento</tcloud-ui-tab-title>
|
|
120
|
+
<tcloud-ui-tab-title tab="log">Log</tcloud-ui-tab-title>
|
|
121
|
+
<tcloud-ui-tab-title tab="database">Banco de dados</tcloud-ui-tab-title>
|
|
122
|
+
<tcloud-ui-tab-title tab="executed-actions">Ações executadas</tcloud-ui-tab-title>
|
|
123
|
+
<tcloud-ui-tab-title tab="backup">Backup</tcloud-ui-tab-title>
|
|
124
|
+
<tcloud-ui-tab-title tab="infrastructure">Infraestrutura</tcloud-ui-tab-title>
|
|
125
|
+
<tcloud-ui-tab-title tab="security">Segurança</tcloud-ui-tab-title>
|
|
126
|
+
<tcloud-ui-tab-title tab="manage">Gerenciar</tcloud-ui-tab-title>
|
|
116
127
|
</tcloud-ui-tab-head>
|
|
117
128
|
|
|
118
|
-
<tcloud-ui-tab-content tab="
|
|
119
|
-
<tcloud-ui-tab-content tab="a2">Content A2</tcloud-ui-tab-content>
|
|
120
|
-
<tcloud-ui-tab-content tab="a3">Content A3</tcloud-ui-tab-content>
|
|
129
|
+
<tcloud-ui-tab-content tab="environment-details">Detalhes do ambiente</tcloud-ui-tab-content>
|
|
121
130
|
</tcloud-ui-tab-menu>
|
|
122
131
|
```
|
|
123
132
|
|
|
124
|
-
### Menu
|
|
133
|
+
### Menu com muitos itens
|
|
134
|
+
|
|
135
|
+
Use `[full]="true"` para dividir a largura disponível entre os itens, `density="compact"` para reduzir a altura e `[wrapLabel]="true"` para permitir labels com quebra de linha sem truncamento.
|
|
125
136
|
|
|
126
137
|
```html
|
|
127
|
-
<tcloud-ui-tab-menu [active]="'
|
|
138
|
+
<tcloud-ui-tab-menu [active]="'security'" [full]="true">
|
|
128
139
|
<tcloud-ui-tab-head
|
|
129
|
-
|
|
140
|
+
density="compact"
|
|
141
|
+
[wrapLabel]="true"
|
|
130
142
|
[bottom_line]="false"
|
|
131
143
|
[background]="true"
|
|
132
|
-
|
|
144
|
+
[scroll]="true"
|
|
145
|
+
tabOptionActiveTextTone="default">
|
|
133
146
|
<tcloud-ui-tab-title tab="environment-details">Detalhes do ambiente</tcloud-ui-tab-title>
|
|
134
147
|
<tcloud-ui-tab-title tab="monitoring">Monitoramento</tcloud-ui-tab-title>
|
|
135
148
|
<tcloud-ui-tab-title tab="log">Log</tcloud-ui-tab-title>
|
|
@@ -140,8 +153,6 @@ export class ExampleComponent {}
|
|
|
140
153
|
<tcloud-ui-tab-title tab="security">Segurança</tcloud-ui-tab-title>
|
|
141
154
|
<tcloud-ui-tab-title tab="manage">Gerenciar</tcloud-ui-tab-title>
|
|
142
155
|
</tcloud-ui-tab-head>
|
|
143
|
-
|
|
144
|
-
<tcloud-ui-tab-content tab="environment-details">Detalhes do ambiente</tcloud-ui-tab-content>
|
|
145
156
|
</tcloud-ui-tab-menu>
|
|
146
157
|
```
|
|
147
158
|
|
|
@@ -182,5 +193,6 @@ export interface ITab {
|
|
|
182
193
|
}
|
|
183
194
|
|
|
184
195
|
export type TabOptionTextTone = 'default' | 'inverse';
|
|
185
|
-
export type TabHeadAppearance = 'default' | '
|
|
196
|
+
export type TabHeadAppearance = 'default' | 'segmented';
|
|
197
|
+
export type TabHeadDensity = 'default' | 'compact';
|
|
186
198
|
```
|
|
@@ -3748,14 +3748,14 @@ class TCloudUiModalComponent {
|
|
|
3748
3748
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TCloudUiModalComponent, isStandalone: true, selector: "tcloud-ui-modal", inputs: { confirm: "confirm", confirmText: "confirmText", confirmInput: "confirmInput", autoClose: "autoClose", title: "title", maxWidth: "maxWidth", position: "position", sticky: "sticky", window: "window", open: "open", loading: "loading" }, outputs: { openChange: "openChange", toConfirm: "toConfirm", toCancel: "toCancel", toAction: "toAction" }, providers: [
|
|
3749
3749
|
TcloudModalService,
|
|
3750
3750
|
TCloudUiLayoutService
|
|
3751
|
-
], ngImport: i0, template: "@if (control_open) {\n <div class=\"tc-background-modal\" >{{ checkIsOpen() }}</div>\n}\n\n@if (open) {\n <div class=\"tcloud-ui-modal base-modal tcloud-ui-modal-layout-{{ layout }} tcloud-ui-modal-postition-{{ position }}\" [attr.data-layout]=\"layout\">\n <div class=\"sub-modal\" [ngClass]=\"['position-' + position, sticky ? 'is-sticky' : '']\" animate.enter=\"modal-fade-enter\" animate.leave=\"modal-fade-leave\">\n <div class=\"tc-modal tc-modal-shadow\" [style.max-width.px]=\"maxWidth\" [class.tcloud-ui-modal-sticky]=\"sticky\">\n <div class=\"area-top-actions tc-ui-modal-{{mode}}\">\n @if( layout === 'classic'){\n <button type=\"button\" class=\"tc-btn-action-close-ui-modal\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }@else{\n <button type=\"button\" class=\"tc-rev-btn-square tc-btn-x\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }\n </div>\n @if (title) {\n <h4 [innerHTML]=\"title\"></h4>\n }\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n}\n\n<!-- Ex: Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open\">\n\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\n\n <tcloud-ui-modal-body>\n Conte\u00FAdo do modal aqui\n </tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\n-->\n\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n\n<!-- Ex: Confirm Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\n\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\n-->", styles: [".tc-background-modal{border:1px solid var(--c-neutral-300);position:fixed;width:100%;left:0;top:0;background-color
|
|
3751
|
+
], ngImport: i0, template: "@if (control_open) {\n <div class=\"tc-background-modal\" >{{ checkIsOpen() }}</div>\n}\n\n@if (open) {\n <div class=\"tcloud-ui-modal base-modal tcloud-ui-modal-layout-{{ layout }} tcloud-ui-modal-postition-{{ position }}\" [attr.data-layout]=\"layout\">\n <div class=\"sub-modal\" [ngClass]=\"['position-' + position, sticky ? 'is-sticky' : '']\" animate.enter=\"modal-fade-enter\" animate.leave=\"modal-fade-leave\">\n <div class=\"tc-modal tc-modal-shadow\" [style.max-width.px]=\"maxWidth\" [class.tcloud-ui-modal-sticky]=\"sticky\">\n <div class=\"area-top-actions tc-ui-modal-{{mode}}\">\n @if( layout === 'classic'){\n <button type=\"button\" class=\"tc-btn-action-close-ui-modal\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }@else{\n <button type=\"button\" class=\"tc-rev-btn-square tc-btn-x\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }\n </div>\n @if (title) {\n <h4 [innerHTML]=\"title\"></h4>\n }\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n}\n\n<!-- Ex: Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open\">\n\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\n\n <tcloud-ui-modal-body>\n Conte\u00FAdo do modal aqui\n </tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\n-->\n\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n\n<!-- Ex: Confirm Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\n\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\n-->", styles: [".tc-background-modal{border:1px solid var(--c-neutral-300);position:fixed;width:100%;left:0;top:0;background-color:var(--c-neutral-1700);z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0;text-align:left!important}.sub-modal{padding:30px;position:absolute;width:100%;display:flex;justify-content:center;align-items:flex-start}.sub-modal.position-left{justify-content:flex-start}.sub-modal.position-right{justify-content:flex-end}.sub-modal.position-bottom{align-items:flex-end}.sub-modal{--modal-enter-from: translateY(-38%);--modal-leave-to: translateY(-38%)}.sub-modal.position-left{--modal-enter-from: translateX(-30%);--modal-leave-to: translateX(-30%)}.sub-modal.position-right{--modal-enter-from: translateX(30%);--modal-leave-to: translateX(30%)}.sub-modal.position-bottom{--modal-enter-from: translateY(30%);--modal-leave-to: translateY(30%)}.sub-modal.modal-fade-enter{animation:tcModalFadeIn .3s ease-out}.sub-modal.modal-fade-leave{animation:tcModalFadeOut .3s ease-out}@keyframes tcModalFadeIn{0%{opacity:0;transform:var(--modal-enter-from)}to{opacity:1;transform:translate(0)}}@keyframes tcModalFadeOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:var(--modal-leave-to)}}@media(prefers-reduced-motion:reduce){.sub-modal.modal-fade-enter,.sub-modal.modal-fade-leave{animation:none}}.tc-modal{position:relative;background-color:var(--c-neutral-50);border:1px solid var(--c-neutral-200);padding:12px;border-radius:8px;margin:auto;width:100%;transition:max-width .3s ease-out}@media(prefers-reduced-motion:reduce){.tc-modal{transition:none}}.sub-modal.is-sticky{padding:0}.sub-modal.is-sticky>.tc-modal{border-radius:0}.sub-modal.is-sticky.position-left>.tc-modal{margin:0 auto 0 0}.sub-modal.is-sticky.position-right>.tc-modal{margin:0 0 0 auto}.sub-modal.is-sticky.position-bottom>.tc-modal{margin:auto 0 0}.sub-modal.is-sticky.position-center>.tc-modal,.sub-modal.is-sticky.position-bottom>.tc-modal{max-width:100%!important;width:100%!important}.tc-modal-shadow{-webkit-box-shadow:2px 2px 10px 0px rgba(0,0,0,.368627451);box-shadow:2px 2px 10px #0000005e}.tc-btn-x{min-height:25px!important;min-width:25px!important;height:25px;width:25px;margin-top:8px}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions.tc-ui-modal-colorless button.tc-btn-action-close-ui-modal i{color:var(--c-neutral-600)!important}.area-top-actions button.tc-btn-action-close-ui-modal{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button.tc-btn-action-close-ui-modal i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button.tc-btn-action-close-ui-modal i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:var(--c-neutral-500)!important}.tcloud-ui-modal-sticky{height:100vh;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
3752
3752
|
}
|
|
3753
3753
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiModalComponent, decorators: [{
|
|
3754
3754
|
type: Component,
|
|
3755
3755
|
args: [{ selector: 'tcloud-ui-modal', providers: [
|
|
3756
3756
|
TcloudModalService,
|
|
3757
3757
|
TCloudUiLayoutService
|
|
3758
|
-
], standalone: true, imports: [CommonModule], template: "@if (control_open) {\n <div class=\"tc-background-modal\" >{{ checkIsOpen() }}</div>\n}\n\n@if (open) {\n <div class=\"tcloud-ui-modal base-modal tcloud-ui-modal-layout-{{ layout }} tcloud-ui-modal-postition-{{ position }}\" [attr.data-layout]=\"layout\">\n <div class=\"sub-modal\" [ngClass]=\"['position-' + position, sticky ? 'is-sticky' : '']\" animate.enter=\"modal-fade-enter\" animate.leave=\"modal-fade-leave\">\n <div class=\"tc-modal tc-modal-shadow\" [style.max-width.px]=\"maxWidth\" [class.tcloud-ui-modal-sticky]=\"sticky\">\n <div class=\"area-top-actions tc-ui-modal-{{mode}}\">\n @if( layout === 'classic'){\n <button type=\"button\" class=\"tc-btn-action-close-ui-modal\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }@else{\n <button type=\"button\" class=\"tc-rev-btn-square tc-btn-x\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }\n </div>\n @if (title) {\n <h4 [innerHTML]=\"title\"></h4>\n }\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n}\n\n<!-- Ex: Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open\">\n\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\n\n <tcloud-ui-modal-body>\n Conte\u00FAdo do modal aqui\n </tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\n-->\n\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n\n<!-- Ex: Confirm Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\n\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\n-->", styles: [".tc-background-modal{border:1px solid var(--c-neutral-300);position:fixed;width:100%;left:0;top:0;background-color
|
|
3758
|
+
], standalone: true, imports: [CommonModule], template: "@if (control_open) {\n <div class=\"tc-background-modal\" >{{ checkIsOpen() }}</div>\n}\n\n@if (open) {\n <div class=\"tcloud-ui-modal base-modal tcloud-ui-modal-layout-{{ layout }} tcloud-ui-modal-postition-{{ position }}\" [attr.data-layout]=\"layout\">\n <div class=\"sub-modal\" [ngClass]=\"['position-' + position, sticky ? 'is-sticky' : '']\" animate.enter=\"modal-fade-enter\" animate.leave=\"modal-fade-leave\">\n <div class=\"tc-modal tc-modal-shadow\" [style.max-width.px]=\"maxWidth\" [class.tcloud-ui-modal-sticky]=\"sticky\">\n <div class=\"area-top-actions tc-ui-modal-{{mode}}\">\n @if( layout === 'classic'){\n <button type=\"button\" class=\"tc-btn-action-close-ui-modal\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }@else{\n <button type=\"button\" class=\"tc-rev-btn-square tc-btn-x\" [class.no-use-header]=\"title\" (click)=\"toClose()\" [disabled]=\"loading\">\n @if (!loading) {\n <i class=\"fas fa-times\"></i>\n }\n @if (loading) {\n <i class=\"fas fa-spinner fa-spin\"></i>\n }\n </button>\n }\n </div>\n @if (title) {\n <h4 [innerHTML]=\"title\"></h4>\n }\n <ng-content></ng-content>\n </div>\n </div>\n </div>\n}\n\n<!-- Ex: Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open\">\n\n <tcloud-ui-modal-header title=\"T\u00EDtulo do Modal\" ></tcloud-ui-modal-header>\n\n <tcloud-ui-modal-body>\n Conte\u00FAdo do modal aqui\n </tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open = !open\">open modal {{ open }}</button>\n-->\n\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n<!-- ****** -->\n\n<!-- Ex: Confirm Modal -->\n<!--\n<tcloud-ui-modal [(open)]=\"open_confirm\" [title]=\"'Aten\u00E7\u00E3o'\" [confirmText]=\"'Aceito'\" [confirm]=\"true\" (toAction)=\"$event\" >\n\n <tcloud-ui-modal-body>Deseja realmente executar esta a\u00E7\u00E3o?</tcloud-ui-modal-body>\n\n <tcloud-ui-modal-footer></tcloud-ui-modal-footer>\n\n</tcloud-ui-modal>\n\n<button type=\"button\" (click)=\"open_confirm = !open_confirm\">open_confirm modal {{ open_confirm }}</button>\n-->", styles: [".tc-background-modal{border:1px solid var(--c-neutral-300);position:fixed;width:100%;left:0;top:0;background-color:var(--c-neutral-1700);z-index:4005;height:100%;opacity:.3}.base-modal{height:100%;overflow:scroll;position:fixed;width:100%;z-index:4005;left:0;top:0;text-align:left!important}.sub-modal{padding:30px;position:absolute;width:100%;display:flex;justify-content:center;align-items:flex-start}.sub-modal.position-left{justify-content:flex-start}.sub-modal.position-right{justify-content:flex-end}.sub-modal.position-bottom{align-items:flex-end}.sub-modal{--modal-enter-from: translateY(-38%);--modal-leave-to: translateY(-38%)}.sub-modal.position-left{--modal-enter-from: translateX(-30%);--modal-leave-to: translateX(-30%)}.sub-modal.position-right{--modal-enter-from: translateX(30%);--modal-leave-to: translateX(30%)}.sub-modal.position-bottom{--modal-enter-from: translateY(30%);--modal-leave-to: translateY(30%)}.sub-modal.modal-fade-enter{animation:tcModalFadeIn .3s ease-out}.sub-modal.modal-fade-leave{animation:tcModalFadeOut .3s ease-out}@keyframes tcModalFadeIn{0%{opacity:0;transform:var(--modal-enter-from)}to{opacity:1;transform:translate(0)}}@keyframes tcModalFadeOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:var(--modal-leave-to)}}@media(prefers-reduced-motion:reduce){.sub-modal.modal-fade-enter,.sub-modal.modal-fade-leave{animation:none}}.tc-modal{position:relative;background-color:var(--c-neutral-50);border:1px solid var(--c-neutral-200);padding:12px;border-radius:8px;margin:auto;width:100%;transition:max-width .3s ease-out}@media(prefers-reduced-motion:reduce){.tc-modal{transition:none}}.sub-modal.is-sticky{padding:0}.sub-modal.is-sticky>.tc-modal{border-radius:0}.sub-modal.is-sticky.position-left>.tc-modal{margin:0 auto 0 0}.sub-modal.is-sticky.position-right>.tc-modal{margin:0 0 0 auto}.sub-modal.is-sticky.position-bottom>.tc-modal{margin:auto 0 0}.sub-modal.is-sticky.position-center>.tc-modal,.sub-modal.is-sticky.position-bottom>.tc-modal{max-width:100%!important;width:100%!important}.tc-modal-shadow{-webkit-box-shadow:2px 2px 10px 0px rgba(0,0,0,.368627451);box-shadow:2px 2px 10px #0000005e}.tc-btn-x{min-height:25px!important;min-width:25px!important;height:25px;width:25px;margin-top:8px}.area-top-actions{position:absolute;top:2px;right:5px;z-index:1}.area-top-actions.tc-ui-modal-colorless button.tc-btn-action-close-ui-modal i{color:var(--c-neutral-600)!important}.area-top-actions button.tc-btn-action-close-ui-modal{cursor:pointer;background-color:transparent;border:none;font-size:15px;padding:5px 7px}.area-top-actions button.tc-btn-action-close-ui-modal i{font-size:17px;color:#fff;transition:all .25s;opacity:.7}.area-top-actions button.tc-btn-action-close-ui-modal i:hover{opacity:1!important}h4{font-size:16px;margin:5px 30px 10px 0;font-weight:700}.no-use-header i{color:var(--c-neutral-500)!important}.tcloud-ui-modal-sticky{height:100vh;overflow:hidden}\n"] }]
|
|
3759
3759
|
}], ctorParameters: () => [{ type: TCloudUiLayoutService }, { type: TcloudModalService }], propDecorators: { confirm: [{
|
|
3760
3760
|
type: Input
|
|
3761
3761
|
}], confirmText: [{
|
|
@@ -4488,6 +4488,12 @@ class TabMenuService {
|
|
|
4488
4488
|
this._tabHeadAppearance = 'default';
|
|
4489
4489
|
this.tabHeadAppearanceSubject = new Subject();
|
|
4490
4490
|
this.tabHeadAppearanceState$ = this.tabHeadAppearanceSubject.asObservable();
|
|
4491
|
+
this._tabHeadDensity = 'default';
|
|
4492
|
+
this.tabHeadDensitySubject = new Subject();
|
|
4493
|
+
this.tabHeadDensityState$ = this.tabHeadDensitySubject.asObservable();
|
|
4494
|
+
this._tabHeadWrapLabel = false;
|
|
4495
|
+
this.tabHeadWrapLabelSubject = new Subject();
|
|
4496
|
+
this.tabHeadWrapLabelState$ = this.tabHeadWrapLabelSubject.asObservable();
|
|
4491
4497
|
}
|
|
4492
4498
|
setTabScroll(scroll) {
|
|
4493
4499
|
this._scroll = scroll;
|
|
@@ -4532,12 +4538,28 @@ class TabMenuService {
|
|
|
4532
4538
|
return this._tabOptionActiveTextTone;
|
|
4533
4539
|
}
|
|
4534
4540
|
setTabHeadAppearance(appearance) {
|
|
4535
|
-
|
|
4536
|
-
this.
|
|
4541
|
+
const normalizedAppearance = appearance === 'segmented' ? 'segmented' : 'default';
|
|
4542
|
+
this._tabHeadAppearance = normalizedAppearance;
|
|
4543
|
+
this.tabHeadAppearanceSubject.next(normalizedAppearance);
|
|
4537
4544
|
}
|
|
4538
4545
|
getTabHeadAppearance() {
|
|
4539
4546
|
return this._tabHeadAppearance;
|
|
4540
4547
|
}
|
|
4548
|
+
setTabHeadDensity(density) {
|
|
4549
|
+
const normalizedDensity = density === 'compact' ? 'compact' : 'default';
|
|
4550
|
+
this._tabHeadDensity = normalizedDensity;
|
|
4551
|
+
this.tabHeadDensitySubject.next(normalizedDensity);
|
|
4552
|
+
}
|
|
4553
|
+
getTabHeadDensity() {
|
|
4554
|
+
return this._tabHeadDensity;
|
|
4555
|
+
}
|
|
4556
|
+
setTabHeadWrapLabel(wrapLabel) {
|
|
4557
|
+
this._tabHeadWrapLabel = wrapLabel;
|
|
4558
|
+
this.tabHeadWrapLabelSubject.next(wrapLabel);
|
|
4559
|
+
}
|
|
4560
|
+
getTabHeadWrapLabel() {
|
|
4561
|
+
return this._tabHeadWrapLabel;
|
|
4562
|
+
}
|
|
4541
4563
|
setTabState(tab, registerInUrl) {
|
|
4542
4564
|
this._tab = tab;
|
|
4543
4565
|
if (registerInUrl) {
|
|
@@ -4662,6 +4684,20 @@ class TCloudUiTabHeadComponent {
|
|
|
4662
4684
|
}
|
|
4663
4685
|
}
|
|
4664
4686
|
get scroll() { return this._scroll; }
|
|
4687
|
+
set appearance(appearance) {
|
|
4688
|
+
this._appearance = appearance === 'segmented' ? 'segmented' : 'default';
|
|
4689
|
+
}
|
|
4690
|
+
get appearance() { return this._appearance; }
|
|
4691
|
+
set density(density) {
|
|
4692
|
+
this._density = density === 'compact' ? 'compact' : 'default';
|
|
4693
|
+
}
|
|
4694
|
+
get density() { return this._density; }
|
|
4695
|
+
set wrapLabel(wrapLabel) {
|
|
4696
|
+
if (typeof wrapLabel === 'boolean') {
|
|
4697
|
+
this._wrapLabel = wrapLabel;
|
|
4698
|
+
}
|
|
4699
|
+
}
|
|
4700
|
+
get wrapLabel() { return this._wrapLabel; }
|
|
4665
4701
|
set tabOptionTextTone(tabOptionTextTone) {
|
|
4666
4702
|
this._tabOptionTextTone = tabOptionTextTone;
|
|
4667
4703
|
this.tabMenuService.setTabOptionTextTone(tabOptionTextTone);
|
|
@@ -4684,7 +4720,9 @@ class TCloudUiTabHeadComponent {
|
|
|
4684
4720
|
this._scroll = true;
|
|
4685
4721
|
this.ID = '';
|
|
4686
4722
|
this.background = true;
|
|
4687
|
-
this.
|
|
4723
|
+
this._appearance = 'default';
|
|
4724
|
+
this._density = 'default';
|
|
4725
|
+
this._wrapLabel = false;
|
|
4688
4726
|
// Aceita 'white' | 'transparent' (ou um CSS color); resolvido para token dark-aware no ngOnInit
|
|
4689
4727
|
this.backgroundColor = 'transparent';
|
|
4690
4728
|
this._tabOptionTextTone = 'default';
|
|
@@ -4695,17 +4733,9 @@ class TCloudUiTabHeadComponent {
|
|
|
4695
4733
|
this.tabMenuService.setTabOptionTextTone(this.tabOptionTextTone);
|
|
4696
4734
|
this.tabMenuService.setTabOptionActiveTextTone(this.tabOptionActiveTextTone);
|
|
4697
4735
|
this.tabMenuService.setTabHeadAppearance(this.appearance);
|
|
4698
|
-
|
|
4699
|
-
|
|
4700
|
-
|
|
4701
|
-
else if (this.background) {
|
|
4702
|
-
if (this.backgroundColor === 'white') {
|
|
4703
|
-
this.backgroundColor = 'var(--c-neutral-50)';
|
|
4704
|
-
}
|
|
4705
|
-
else {
|
|
4706
|
-
this.backgroundColor = 'var(--c-neutral-100)';
|
|
4707
|
-
}
|
|
4708
|
-
}
|
|
4736
|
+
this.tabMenuService.setTabHeadDensity(this.density);
|
|
4737
|
+
this.tabMenuService.setTabHeadWrapLabel(this.wrapLabel);
|
|
4738
|
+
this.backgroundColor = 'var(--c-neutral-100)';
|
|
4709
4739
|
this.ID = this.generateID();
|
|
4710
4740
|
}
|
|
4711
4741
|
generateID() {
|
|
@@ -4740,17 +4770,21 @@ class TCloudUiTabHeadComponent {
|
|
|
4740
4770
|
this.scrollSuave(ccs_s, action == 'next' ? wid + ccs_s : ccs_s - wid, 0, ccs);
|
|
4741
4771
|
}
|
|
4742
4772
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiTabHeadComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4743
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TCloudUiTabHeadComponent, isStandalone: true, selector: "tcloud-ui-tab-head", inputs: { scroll: "scroll", background: "background", appearance: "appearance", backgroundColor: "backgroundColor", tabOptionTextTone: "tabOptionTextTone", tabOptionActiveTextTone: "tabOptionActiveTextTone", bottom_line: "bottom_line" }, ngImport: i0, template: "\n\n<table class=\"tcloud-ui-tab-head area-navigation\">\n <tr>\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\n </td>\n }\n\n <td>\n\n </td>\n\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\n </td>\n }\n </tr>\n</table>\n\n<div\n class=\"tc-menu {{ ID }}\"\n [attr.style]=\"'background: ' + backgroundColor + ';'\"\n [class.tab-full]=\"!scroll\"\n [class.tab-head-filled]=\"appearance === '
|
|
4773
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TCloudUiTabHeadComponent, isStandalone: true, selector: "tcloud-ui-tab-head", inputs: { scroll: "scroll", background: "background", appearance: "appearance", density: "density", wrapLabel: "wrapLabel", backgroundColor: "backgroundColor", tabOptionTextTone: "tabOptionTextTone", tabOptionActiveTextTone: "tabOptionActiveTextTone", bottom_line: "bottom_line" }, ngImport: i0, template: "\n\n<table class=\"tcloud-ui-tab-head area-navigation\">\n <tr>\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\n </td>\n }\n\n <td>\n\n </td>\n\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\n </td>\n }\n </tr>\n</table>\n\n<div\n class=\"tc-menu {{ ID }}\"\n [attr.style]=\"'background: ' + backgroundColor + ';'\"\n [class.tab-full]=\"!scroll\"\n [class.tab-head-filled]=\"appearance === 'default'\"\n [class.tab-head-segmented]=\"appearance === 'segmented'\"\n [class.tab-head-density-compact]=\"density === 'compact'\"\n [class.tab-head-wrap-label]=\"wrapLabel\"\n [class.tab-subtitle-line-bottom]=\"bottom_line\">\n <ng-content></ng-content>\n</div>\n\n@if (bottom_line) {\n <div class=\"hr-border-bottom\"></div>\n}\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation button{padding:0!important}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--c-primary-500);cursor:pointer;position:relative;top:20px;right:0;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--c-primary-500);cursor:pointer;position:relative;top:20px;left:0;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;overflow-x:auto;overflow-y:hidden;margin-bottom:5px;scrollbar-width:none;z-index:1;position:relative}.tc-menu::-webkit-scrollbar{display:none}.tab-head-filled{border-radius:0;min-height:70px}.tab-head-segmented{border:var(--bor-size-1) solid var(--c-neutral-300);border-radius:var(--bor-radius-16);gap:var(--size-4);min-height:var(--size-64);padding:var(--size-6)}.tab-head-density-compact.tab-head-filled,.tab-head-density-compact.tab-head-segmented{min-height:var(--size-60)}.tab-head-density-compact.tab-head-segmented{padding:var(--size-4)}.hr-border-bottom{border-bottom:none;border-left:none;border-right:none;margin-top:0!important;border-top:1px solid var(--c-neutral-300);margin-bottom:0}@media(max-width:1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}.tab-head-segmented{min-height:var(--size-60)}}.tab-full{margin-left:0!important;margin-right:0!important}\n"] }); }
|
|
4744
4774
|
}
|
|
4745
4775
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiTabHeadComponent, decorators: [{
|
|
4746
4776
|
type: Component,
|
|
4747
|
-
args: [{ selector: 'tcloud-ui-tab-head', standalone: true, imports: [], template: "\n\n<table class=\"tcloud-ui-tab-head area-navigation\">\n <tr>\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\n </td>\n }\n\n <td>\n\n </td>\n\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\n </td>\n }\n </tr>\n</table>\n\n<div\n class=\"tc-menu {{ ID }}\"\n [attr.style]=\"'background: ' + backgroundColor + ';'\"\n [class.tab-full]=\"!scroll\"\n [class.tab-head-filled]=\"appearance === '
|
|
4777
|
+
args: [{ selector: 'tcloud-ui-tab-head', standalone: true, imports: [], template: "\n\n<table class=\"tcloud-ui-tab-head area-navigation\">\n <tr>\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('prev')\"> <i class=\"fas fa-chevron-left\"></i> </button>\n </td>\n }\n\n <td>\n\n </td>\n\n @if (scroll) {\n <td>\n <button (click)=\"to_scroll('next')\"> <i class=\"fas fa-chevron-right\"></i> </button>\n </td>\n }\n </tr>\n</table>\n\n<div\n class=\"tc-menu {{ ID }}\"\n [attr.style]=\"'background: ' + backgroundColor + ';'\"\n [class.tab-full]=\"!scroll\"\n [class.tab-head-filled]=\"appearance === 'default'\"\n [class.tab-head-segmented]=\"appearance === 'segmented'\"\n [class.tab-head-density-compact]=\"density === 'compact'\"\n [class.tab-head-wrap-label]=\"wrapLabel\"\n [class.tab-subtitle-line-bottom]=\"bottom_line\">\n <ng-content></ng-content>\n</div>\n\n@if (bottom_line) {\n <div class=\"hr-border-bottom\"></div>\n}\n", styles: [".area-navigation{display:none;width:100%;line-height:0}.area-navigation button{padding:0!important}.area-navigation td{width:100%;height:0;line-height:0}.area-navigation td:first-child{width:10px!important;text-align:left}.area-navigation td:first-child button{color:var(--c-primary-500);cursor:pointer;position:relative;top:20px;right:0;border:none;background-color:transparent;font-size:15px;height:30px}.area-navigation td:last-child{width:10px!important;text-align:right}.area-navigation td:last-child button{color:var(--c-primary-500);cursor:pointer;position:relative;top:20px;left:0;border:none;background-color:transparent;font-size:15px;height:30px}.tc-menu{display:flex;align-items:center;overflow-x:auto;overflow-y:hidden;margin-bottom:5px;scrollbar-width:none;z-index:1;position:relative}.tc-menu::-webkit-scrollbar{display:none}.tab-head-filled{border-radius:0;min-height:70px}.tab-head-segmented{border:var(--bor-size-1) solid var(--c-neutral-300);border-radius:var(--bor-radius-16);gap:var(--size-4);min-height:var(--size-64);padding:var(--size-6)}.tab-head-density-compact.tab-head-filled,.tab-head-density-compact.tab-head-segmented{min-height:var(--size-60)}.tab-head-density-compact.tab-head-segmented{padding:var(--size-4)}.hr-border-bottom{border-bottom:none;border-left:none;border-right:none;margin-top:0!important;border-top:1px solid var(--c-neutral-300);margin-bottom:0}@media(max-width:1440px){.area-navigation{display:block!important;position:relative;top:0;height:2px}.tc-menu{margin-left:15px;margin-right:15px}.tab-head-segmented{min-height:var(--size-60)}}.tab-full{margin-left:0!important;margin-right:0!important}\n"] }]
|
|
4748
4778
|
}], ctorParameters: () => [{ type: TabMenuService }], propDecorators: { scroll: [{
|
|
4749
4779
|
type: Input
|
|
4750
4780
|
}], background: [{
|
|
4751
4781
|
type: Input
|
|
4752
4782
|
}], appearance: [{
|
|
4753
4783
|
type: Input
|
|
4784
|
+
}], density: [{
|
|
4785
|
+
type: Input
|
|
4786
|
+
}], wrapLabel: [{
|
|
4787
|
+
type: Input
|
|
4754
4788
|
}], backgroundColor: [{
|
|
4755
4789
|
type: Input
|
|
4756
4790
|
}], tabOptionTextTone: [{
|
|
@@ -4795,11 +4829,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
4795
4829
|
|
|
4796
4830
|
class TCloudUiTabTitleComponent {
|
|
4797
4831
|
get filledHost() {
|
|
4798
|
-
return this.inheritedAppearance === '
|
|
4832
|
+
return this.inheritedAppearance === 'default';
|
|
4799
4833
|
}
|
|
4800
4834
|
get segmentedHost() {
|
|
4801
4835
|
return this.inheritedAppearance === 'segmented';
|
|
4802
4836
|
}
|
|
4837
|
+
get fullHost() {
|
|
4838
|
+
return this.inheritedFull && (this.inheritedAppearance === 'default' || this.inheritedAppearance === 'segmented');
|
|
4839
|
+
}
|
|
4840
|
+
get compactHost() {
|
|
4841
|
+
return this.inheritedDensity === 'compact';
|
|
4842
|
+
}
|
|
4843
|
+
get wrapLabelHost() {
|
|
4844
|
+
return this.inheritedWrapLabel;
|
|
4845
|
+
}
|
|
4803
4846
|
set disabled(disabled) {
|
|
4804
4847
|
this._disabled = disabled;
|
|
4805
4848
|
this.tabMenuService.setTabDisabled(this.tab, this._disabled);
|
|
@@ -4811,7 +4854,10 @@ class TCloudUiTabTitleComponent {
|
|
|
4811
4854
|
this.active = false;
|
|
4812
4855
|
this.loading = false;
|
|
4813
4856
|
this.bottom_line = false;
|
|
4857
|
+
this.inheritedFull = false;
|
|
4814
4858
|
this.inheritedAppearance = 'default';
|
|
4859
|
+
this.inheritedDensity = 'default';
|
|
4860
|
+
this.inheritedWrapLabel = false;
|
|
4815
4861
|
this.inheritedTextTone = 'default';
|
|
4816
4862
|
this.inheritedActiveTextTone = 'default';
|
|
4817
4863
|
this._disabled = false;
|
|
@@ -4840,7 +4886,10 @@ class TCloudUiTabTitleComponent {
|
|
|
4840
4886
|
}
|
|
4841
4887
|
}));
|
|
4842
4888
|
this.loading = this.tabMenuService.getTabLoading();
|
|
4889
|
+
this.inheritedFull = this.tabMenuService.getTabFull() ?? false;
|
|
4843
4890
|
this.inheritedAppearance = this.tabMenuService.getTabHeadAppearance();
|
|
4891
|
+
this.inheritedDensity = this.tabMenuService.getTabHeadDensity();
|
|
4892
|
+
this.inheritedWrapLabel = this.tabMenuService.getTabHeadWrapLabel();
|
|
4844
4893
|
this.inheritedTextTone = this.tabMenuService.getTabOptionTextTone();
|
|
4845
4894
|
this.inheritedActiveTextTone = this.tabMenuService.getTabOptionActiveTextTone();
|
|
4846
4895
|
this.subscription?.add(this.tabMenuService.loadingState$.subscribe((loading) => {
|
|
@@ -4849,9 +4898,18 @@ class TCloudUiTabTitleComponent {
|
|
|
4849
4898
|
this.subscription?.add(this.tabMenuService.bottom_lineState$.subscribe((bottom_line) => {
|
|
4850
4899
|
this.bottom_line = bottom_line;
|
|
4851
4900
|
}));
|
|
4901
|
+
this.subscription?.add(this.tabMenuService.fullState$.subscribe((full) => {
|
|
4902
|
+
this.inheritedFull = full;
|
|
4903
|
+
}));
|
|
4852
4904
|
this.subscription?.add(this.tabMenuService.tabHeadAppearanceState$.subscribe((appearance) => {
|
|
4853
4905
|
this.inheritedAppearance = appearance;
|
|
4854
4906
|
}));
|
|
4907
|
+
this.subscription?.add(this.tabMenuService.tabHeadDensityState$.subscribe((density) => {
|
|
4908
|
+
this.inheritedDensity = density;
|
|
4909
|
+
}));
|
|
4910
|
+
this.subscription?.add(this.tabMenuService.tabHeadWrapLabelState$.subscribe((wrapLabel) => {
|
|
4911
|
+
this.inheritedWrapLabel = wrapLabel;
|
|
4912
|
+
}));
|
|
4855
4913
|
this.subscription?.add(this.tabMenuService.tabOptionTextToneState$.subscribe((textTone) => {
|
|
4856
4914
|
this.inheritedTextTone = textTone;
|
|
4857
4915
|
}));
|
|
@@ -4884,11 +4942,11 @@ class TCloudUiTabTitleComponent {
|
|
|
4884
4942
|
return 'var(--c-neutral-50)';
|
|
4885
4943
|
}
|
|
4886
4944
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiTabTitleComponent, deps: [{ token: TabMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4887
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: TCloudUiTabTitleComponent, isStandalone: true, selector: "tcloud-ui-tab-title", inputs: { tab: "tab", title: "title", active: "active", disabled: "disabled" }, host: { properties: { "class.tab-title-host-filled": "this.filledHost", "class.tab-title-host-segmented": "this.segmentedHost" } }, ngImport: i0, template: "<button\n [class.loading]=\"loading\"\n [attr.data-id]=\"tab\"\n [class.tab-title-active]=\"active\"\n [class.tab-title-filled]=\"inheritedAppearance === '
|
|
4945
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.17", type: TCloudUiTabTitleComponent, isStandalone: true, selector: "tcloud-ui-tab-title", inputs: { tab: "tab", title: "title", active: "active", disabled: "disabled" }, host: { properties: { "class.tab-title-host-filled": "this.filledHost", "class.tab-title-host-segmented": "this.segmentedHost", "class.tab-title-host-full": "this.fullHost", "class.tab-title-host-density-compact": "this.compactHost", "class.tab-title-host-wrap-label": "this.wrapLabelHost" } }, ngImport: i0, template: "<button\n [class.loading]=\"loading\"\n [attr.data-id]=\"tab\"\n [class.tab-title-active]=\"active\"\n [class.tab-title-filled]=\"inheritedAppearance === 'default'\"\n [class.tab-title-segmented]=\"inheritedAppearance === 'segmented'\"\n [style.--tc-tab-title-text-color]=\"resolvedTextColor\"\n [style.--tc-tab-title-active-text-color]=\"resolvedActiveTextColor\"\n [disabled]=\"disabled || loading\"\n type=\"button\"\n (click)=\"toTab()\"\n class=\"tcloud-ui-tab-title tab-title\">\n <ng-content></ng-content>\n</button>\n<div class=\"bottom-line\" [class.bottom-line-hover]=\"bottom_line\" ></div>\n", styles: [":host(.tab-title-host-filled),:host(.tab-title-host-segmented){display:inline-flex;flex:0 0 auto;min-width:160px}:host(.tab-title-host-full){flex:1 1 0;min-width:0}.tab-title{border-radius:0!important;height:initial;display:inline-block;margin:0!important;color:var(--c-neutral-500);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title-active{background:var(--c-primary-500);color:var(--c-neutral-50)}.tab-title.tab-title-filled,.tab-title.tab-title-segmented{align-items:center;color:var(--tc-tab-title-text-color, var(--c-neutral-900));display:inline-flex;font-family:var(--f-family);font-size:var(--f-size-14);font-weight:var(--f-weight-400);justify-content:center;line-height:1.2;max-width:none;min-width:0;padding:0 var(--size-24);text-align:center;text-transform:none;white-space:nowrap;width:100%}:host(.tab-title-host-density-compact) .tab-title{transition:none}.tab-title.tab-title-filled{border-radius:0!important;min-height:70px}.tab-title.tab-title-segmented{border-radius:var(--bor-radius-8)!important;min-height:52px}:host(.tab-title-host-density-compact) .tab-title.tab-title-filled,:host(.tab-title-host-density-compact) .tab-title.tab-title-segmented{font-size:var(--f-size-12);line-height:var(--l-height-16);min-height:var(--size-60);padding:0 var(--size-12)}:host(.tab-title-host-wrap-label) .tab-title.tab-title-filled,:host(.tab-title-host-wrap-label) .tab-title.tab-title-segmented{overflow:visible;overflow-wrap:break-word;text-overflow:clip;white-space:normal}.tab-title.tab-title-filled:hover,.tab-title.tab-title-filled:focus,.tab-title.tab-title-segmented:hover,.tab-title.tab-title-segmented:focus{background:var(--c-neutral-200);color:var(--tc-tab-title-text-color, var(--c-neutral-900));outline:none}.tab-title.tab-title-filled.tab-title-active,.tab-title.tab-title-filled.tab-title-active:hover,.tab-title.tab-title-filled.tab-title-active:focus,.tab-title.tab-title-segmented.tab-title-active,.tab-title.tab-title-segmented.tab-title-active:hover,.tab-title.tab-title-segmented.tab-title-active:focus{background:var(--c-primary-500);color:var(--tc-tab-title-active-text-color, var(--c-neutral-50));font-weight:var(--f-weight-700)}.loading{cursor:progress!important}button:disabled{opacity:.7;cursor:not-allowed!important}@media(max-width:1580px){.tab-title{font-size:11px;padding:20px 14px}}@media(max-width:1440px){.tab-title{font-size:10px;padding:20px 13px}}\n"] }); }
|
|
4888
4946
|
}
|
|
4889
4947
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiTabTitleComponent, decorators: [{
|
|
4890
4948
|
type: Component,
|
|
4891
|
-
args: [{ selector: 'tcloud-ui-tab-title', standalone: true, imports: [], template: "<button\n [class.loading]=\"loading\"\n [attr.data-id]=\"tab\"\n [class.tab-title-active]=\"active\"\n [class.tab-title-filled]=\"inheritedAppearance === '
|
|
4949
|
+
args: [{ selector: 'tcloud-ui-tab-title', standalone: true, imports: [], template: "<button\n [class.loading]=\"loading\"\n [attr.data-id]=\"tab\"\n [class.tab-title-active]=\"active\"\n [class.tab-title-filled]=\"inheritedAppearance === 'default'\"\n [class.tab-title-segmented]=\"inheritedAppearance === 'segmented'\"\n [style.--tc-tab-title-text-color]=\"resolvedTextColor\"\n [style.--tc-tab-title-active-text-color]=\"resolvedActiveTextColor\"\n [disabled]=\"disabled || loading\"\n type=\"button\"\n (click)=\"toTab()\"\n class=\"tcloud-ui-tab-title tab-title\">\n <ng-content></ng-content>\n</button>\n<div class=\"bottom-line\" [class.bottom-line-hover]=\"bottom_line\" ></div>\n", styles: [":host(.tab-title-host-filled),:host(.tab-title-host-segmented){display:inline-flex;flex:0 0 auto;min-width:160px}:host(.tab-title-host-full){flex:1 1 0;min-width:0}.tab-title{border-radius:0!important;height:initial;display:inline-block;margin:0!important;color:var(--c-neutral-500);border:none;background:none;text-transform:uppercase;font-size:11px;padding:20px;cursor:pointer;min-width:60px;max-width:200px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;transition:all .25s}.tab-title-active{background:var(--c-primary-500);color:var(--c-neutral-50)}.tab-title.tab-title-filled,.tab-title.tab-title-segmented{align-items:center;color:var(--tc-tab-title-text-color, var(--c-neutral-900));display:inline-flex;font-family:var(--f-family);font-size:var(--f-size-14);font-weight:var(--f-weight-400);justify-content:center;line-height:1.2;max-width:none;min-width:0;padding:0 var(--size-24);text-align:center;text-transform:none;white-space:nowrap;width:100%}:host(.tab-title-host-density-compact) .tab-title{transition:none}.tab-title.tab-title-filled{border-radius:0!important;min-height:70px}.tab-title.tab-title-segmented{border-radius:var(--bor-radius-8)!important;min-height:52px}:host(.tab-title-host-density-compact) .tab-title.tab-title-filled,:host(.tab-title-host-density-compact) .tab-title.tab-title-segmented{font-size:var(--f-size-12);line-height:var(--l-height-16);min-height:var(--size-60);padding:0 var(--size-12)}:host(.tab-title-host-wrap-label) .tab-title.tab-title-filled,:host(.tab-title-host-wrap-label) .tab-title.tab-title-segmented{overflow:visible;overflow-wrap:break-word;text-overflow:clip;white-space:normal}.tab-title.tab-title-filled:hover,.tab-title.tab-title-filled:focus,.tab-title.tab-title-segmented:hover,.tab-title.tab-title-segmented:focus{background:var(--c-neutral-200);color:var(--tc-tab-title-text-color, var(--c-neutral-900));outline:none}.tab-title.tab-title-filled.tab-title-active,.tab-title.tab-title-filled.tab-title-active:hover,.tab-title.tab-title-filled.tab-title-active:focus,.tab-title.tab-title-segmented.tab-title-active,.tab-title.tab-title-segmented.tab-title-active:hover,.tab-title.tab-title-segmented.tab-title-active:focus{background:var(--c-primary-500);color:var(--tc-tab-title-active-text-color, var(--c-neutral-50));font-weight:var(--f-weight-700)}.loading{cursor:progress!important}button:disabled{opacity:.7;cursor:not-allowed!important}@media(max-width:1580px){.tab-title{font-size:11px;padding:20px 14px}}@media(max-width:1440px){.tab-title{font-size:10px;padding:20px 13px}}\n"] }]
|
|
4892
4950
|
}], ctorParameters: () => [{ type: TabMenuService }], propDecorators: { tab: [{
|
|
4893
4951
|
type: Input
|
|
4894
4952
|
}], title: [{
|
|
@@ -4901,6 +4959,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
4901
4959
|
}], segmentedHost: [{
|
|
4902
4960
|
type: HostBinding,
|
|
4903
4961
|
args: ['class.tab-title-host-segmented']
|
|
4962
|
+
}], fullHost: [{
|
|
4963
|
+
type: HostBinding,
|
|
4964
|
+
args: ['class.tab-title-host-full']
|
|
4965
|
+
}], compactHost: [{
|
|
4966
|
+
type: HostBinding,
|
|
4967
|
+
args: ['class.tab-title-host-density-compact']
|
|
4968
|
+
}], wrapLabelHost: [{
|
|
4969
|
+
type: HostBinding,
|
|
4970
|
+
args: ['class.tab-title-host-wrap-label']
|
|
4904
4971
|
}], disabled: [{
|
|
4905
4972
|
type: Input
|
|
4906
4973
|
}] } });
|
|
@@ -10577,6 +10644,9 @@ class TCloudUiMarkReadmeComponent {
|
|
|
10577
10644
|
this.open = false;
|
|
10578
10645
|
this._pathName = '';
|
|
10579
10646
|
this._description = '';
|
|
10647
|
+
// Permite injetar o Markdown diretamente, sem buscar um arquivo via pathName.
|
|
10648
|
+
// Quando content estiver preenchido, ele tem prioridade e o pathName e ignorado.
|
|
10649
|
+
this._content = '';
|
|
10580
10650
|
}
|
|
10581
10651
|
ngAfterViewInit() {
|
|
10582
10652
|
// Configurar highlight.js quando o componente for inicializado
|
|
@@ -10602,7 +10672,25 @@ class TCloudUiMarkReadmeComponent {
|
|
|
10602
10672
|
get description() {
|
|
10603
10673
|
return this._description;
|
|
10604
10674
|
}
|
|
10675
|
+
set content(v) {
|
|
10676
|
+
this._content = v ?? '';
|
|
10677
|
+
if (this._content !== '') {
|
|
10678
|
+
this.changelogContent = this._content;
|
|
10679
|
+
this.loading = false;
|
|
10680
|
+
this.message = '';
|
|
10681
|
+
}
|
|
10682
|
+
}
|
|
10683
|
+
get content() {
|
|
10684
|
+
return this._content;
|
|
10685
|
+
}
|
|
10605
10686
|
loadChangelog() {
|
|
10687
|
+
// content tem prioridade sobre pathName; sem pathName nao ha o que buscar.
|
|
10688
|
+
if (this._content !== '') {
|
|
10689
|
+
return;
|
|
10690
|
+
}
|
|
10691
|
+
if (this._pathName === '') {
|
|
10692
|
+
return;
|
|
10693
|
+
}
|
|
10606
10694
|
this.message = '';
|
|
10607
10695
|
this.loading = true;
|
|
10608
10696
|
this.http.get(`${this.pathName}`, { responseType: 'text' }).subscribe({
|
|
@@ -10650,7 +10738,7 @@ class TCloudUiMarkReadmeComponent {
|
|
|
10650
10738
|
});
|
|
10651
10739
|
}
|
|
10652
10740
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiMarkReadmeComponent, deps: [{ token: i1$3.HttpClient }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10653
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TCloudUiMarkReadmeComponent, isStandalone: true, selector: "tcloud-ui-mark-readme", inputs: { useAccordion: "useAccordion", open: "open", pathName: "pathName", description: "description" }, ngImport: i0, template: "@if (message) {\n <div [innerHTML]=\"message\"></div>\n}\n\n@if (useAccordion) {\n <br><div><hr></div><br>\n <tcloud-ui-accordion [show]=\"open\">\n <tcloud-ui-accordion-title>\n {{ description }}\n </tcloud-ui-accordion-title>\n <tcloud-ui-accordion-body>\n <div>\n <tcloud-ui-loading [loading]=\"loading\" [mode]=\"'inline'\"></tcloud-ui-loading>\n <markdown\n [id]=\"ID\"\n [data]=\"changelogContent\"\n (ready)=\"onMarkdownReady()\">\n </markdown>\n </div>\n </tcloud-ui-accordion-body>\n </tcloud-ui-accordion>\n}\n\n@if (!useAccordion) {\n <div>\n @if (description) {\n <h3 [innerHTML]=\"description\"></h3>\n }\n <tcloud-ui-loading [loading]=\"loading\" [mode]=\"'inline'\"></tcloud-ui-loading>\n <markdown\n [id]=\"ID\"\n [data]=\"changelogContent\"\n (ready)=\"onMarkdownReady()\">\n </markdown>\n </div>\n}\n\n\n", styles: [".hljs{color:var(--c-neutral-700);background:var(--c-neutral-100)}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#e45649}.hljs-built_in,.hljs-builtin-name,.hljs-class,.hljs-title{color:#c18401}.hljs-comment,.hljs-quote,.hljs-deletion{color:#a0a1a7;font-style:italic}.hljs-keyword,.hljs-selector-tag,.hljs-section,.hljs-link,.hljs-emphasis{color:#a626a4}.hljs-addition,.hljs-string,.hljs-symbol{color:#50a14f}.hljs-code{color:#383a42}.hljs-meta-string{color:#50a14f}.hljs-regexp{color:#0184bc}.hljs-name{color:#4078f2}.hljs-type,.hljs-attr-name,.hljs-selector-pseudo{color:#e45649}.hljs-subst{color:var(--c-neutral-700)}.hljs-tag{color:#e45649}.hljs-tag .hljs-name,.hljs-tag .hljs-attr{color:var(--c-neutral-700)}.hljs-template-tag,.hljs-template-variable{color:#a626a4}body.tc-dark .hljs-attr,body.tc-dark .hljs-attribute,body.tc-dark .hljs-literal,body.tc-dark .hljs-meta,body.tc-dark .hljs-number,body.tc-dark .hljs-operator,body.tc-dark .hljs-variable,body.tc-dark .hljs-selector-attr,body.tc-dark .hljs-selector-class,body.tc-dark .hljs-selector-id,body.tc-dark .hljs-type,body.tc-dark .hljs-attr-name,body.tc-dark .hljs-selector-pseudo,body.tc-dark .hljs-tag{color:#e06c75}body.tc-dark .hljs-built_in,body.tc-dark .hljs-builtin-name,body.tc-dark .hljs-class,body.tc-dark .hljs-title{color:#e6c07b}body.tc-dark .hljs-comment,body.tc-dark .hljs-quote,body.tc-dark .hljs-deletion{color:#7f848e}body.tc-dark .hljs-keyword,body.tc-dark .hljs-selector-tag,body.tc-dark .hljs-section,body.tc-dark .hljs-link,body.tc-dark .hljs-emphasis,body.tc-dark .hljs-template-tag,body.tc-dark .hljs-template-variable{color:#c678dd}body.tc-dark .hljs-addition,body.tc-dark .hljs-string,body.tc-dark .hljs-symbol,body.tc-dark .hljs-meta-string{color:#98c379}body.tc-dark .hljs-regexp{color:#56b6c2}body.tc-dark .hljs-name{color:#61afef}#mark-readme-content{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;color:var(--c-neutral-700)}#mark-readme-content h1,#mark-readme-content h2,#mark-readme-content h3,#mark-readme-content h4,#mark-readme-content h5,#mark-readme-content h6{margin-top:1.5em;margin-bottom:.5em;font-weight:600;line-height:1.25}#mark-readme-content h1{font-size:2em;border-bottom:1px solid var(--c-neutral-200);padding-bottom:.3em}#mark-readme-content h2{font-size:1.5em;border-bottom:1px solid var(--c-neutral-200);padding-bottom:.3em}#mark-readme-content h3{font-size:1.25em}#mark-readme-content p{margin:.5em 0}#mark-readme-content ul,#mark-readme-content ol{padding-left:2em;margin:.5em 0}#mark-readme-content ul li,#mark-readme-content ol li{margin:.25em 0}#mark-readme-content a{color:var(--c-primary-500);text-decoration:none}#mark-readme-content a:hover{text-decoration:underline}#mark-readme-content code{background-color:var(--c-neutral-100);border-radius:3px;padding:.2em .4em;font-family:Courier New,Courier,monospace;font-size:.9em;color:var(--c-neutral-700);white-space:normal}#mark-readme-content pre{background-color:var(--c-neutral-100)!important;border:1px solid var(--c-neutral-300)!important;border-radius:6px!important;overflow:auto!important;padding:16px!important;margin:1em 0!important;font-family:Courier New,Courier,monospace!important;font-size:.9em!important;line-height:1.45!important;white-space:pre-wrap!important;word-wrap:break-word!important;overflow-wrap:break-word!important;display:block!important}#mark-readme-content pre code{background-color:transparent!important;padding:0!important;margin:0!important;border-radius:0!important;color:inherit!important;display:block!important;white-space:pre-wrap!important;word-break:break-word!important;word-spacing:normal!important;overflow-wrap:break-word!important;tab-size:4!important;-moz-tab-size:4!important;border:none!important;font-family:Courier New,Courier,monospace!important;font-size:.9em!important;line-height:1.45!important}#mark-readme-content pre code.language-typescript,#mark-readme-content pre code.language-html,#mark-readme-content pre code.language-css,#mark-readme-content pre code.language-scss,#mark-readme-content pre code.language-javascript,#mark-readme-content pre code.language-json,#mark-readme-content pre code.language-bash{color:inherit!important}#mark-readme-content table{border-collapse:collapse;width:100%;margin:1em 0}#mark-readme-content table thead{background-color:var(--c-neutral-100);font-weight:600}#mark-readme-content table th,#mark-readme-content table td{border:1px solid var(--c-neutral-300);padding:12px;text-align:left}#mark-readme-content table tr:nth-child(odd){background-color:var(--c-neutral-50)}#mark-readme-content table tr:nth-child(2n){background-color:var(--c-neutral-100)}#mark-readme-content table tr:hover{background-color:var(--c-neutral-200)}#mark-readme-content blockquote{border-left:4px solid var(--c-neutral-300);color:var(--c-neutral-500);padding:.5em 1em;margin:1em 0}#mark-readme-content hr{border:none;border-top:2px solid var(--c-neutral-200);margin:2em 0}#mark-readme-content img{max-width:100%;height:auto}.p-relative{position:relative}\n"], dependencies: [{ kind: "ngmodule", type: MarkdownModule }, { kind: "component", type: i2.MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }, { kind: "component", type: TCloudUiAccordionComponent, selector: "tcloud-ui-accordion", inputs: ["disabled", "show", "loading"], outputs: ["onAction"] }, { kind: "component", type: TCloudUiAccordionTitleComponent, selector: "tcloud-ui-accordion-title" }, { kind: "component", type: TCloudUiAccordionBodyComponent, selector: "tcloud-ui-accordion-body" }, { kind: "component", type: TCloudUiLoadingComponent, selector: "tcloud-ui-loading", inputs: ["gif", "mode", "onlyInline", "onlyIcon", "full", "loading"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10741
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TCloudUiMarkReadmeComponent, isStandalone: true, selector: "tcloud-ui-mark-readme", inputs: { useAccordion: "useAccordion", open: "open", pathName: "pathName", description: "description", content: "content" }, ngImport: i0, template: "@if (message) {\n <div [innerHTML]=\"message\"></div>\n}\n\n@if (useAccordion) {\n <br><div><hr></div><br>\n <tcloud-ui-accordion [show]=\"open\">\n <tcloud-ui-accordion-title>\n {{ description }}\n </tcloud-ui-accordion-title>\n <tcloud-ui-accordion-body>\n <div>\n <tcloud-ui-loading [loading]=\"loading\" [mode]=\"'inline'\"></tcloud-ui-loading>\n <markdown\n [id]=\"ID\"\n [data]=\"changelogContent\"\n (ready)=\"onMarkdownReady()\">\n </markdown>\n </div>\n </tcloud-ui-accordion-body>\n </tcloud-ui-accordion>\n}\n\n@if (!useAccordion) {\n <div>\n @if (description) {\n <h3 [innerHTML]=\"description\"></h3>\n }\n <tcloud-ui-loading [loading]=\"loading\" [mode]=\"'inline'\"></tcloud-ui-loading>\n <markdown\n [id]=\"ID\"\n [data]=\"changelogContent\"\n (ready)=\"onMarkdownReady()\">\n </markdown>\n </div>\n}\n\n\n", styles: [".hljs{color:var(--c-neutral-700);background:var(--c-neutral-100)}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#e45649}.hljs-built_in,.hljs-builtin-name,.hljs-class,.hljs-title{color:#c18401}.hljs-comment,.hljs-quote,.hljs-deletion{color:#a0a1a7;font-style:italic}.hljs-keyword,.hljs-selector-tag,.hljs-section,.hljs-link,.hljs-emphasis{color:#a626a4}.hljs-addition,.hljs-string,.hljs-symbol{color:#50a14f}.hljs-code{color:#383a42}.hljs-meta-string{color:#50a14f}.hljs-regexp{color:#0184bc}.hljs-name{color:#4078f2}.hljs-type,.hljs-attr-name,.hljs-selector-pseudo{color:#e45649}.hljs-subst{color:var(--c-neutral-700)}.hljs-tag{color:#e45649}.hljs-tag .hljs-name,.hljs-tag .hljs-attr{color:var(--c-neutral-700)}.hljs-template-tag,.hljs-template-variable{color:#a626a4}body.tc-dark .hljs-attr,body.tc-dark .hljs-attribute,body.tc-dark .hljs-literal,body.tc-dark .hljs-meta,body.tc-dark .hljs-number,body.tc-dark .hljs-operator,body.tc-dark .hljs-variable,body.tc-dark .hljs-selector-attr,body.tc-dark .hljs-selector-class,body.tc-dark .hljs-selector-id,body.tc-dark .hljs-type,body.tc-dark .hljs-attr-name,body.tc-dark .hljs-selector-pseudo,body.tc-dark .hljs-tag{color:#e06c75}body.tc-dark .hljs-built_in,body.tc-dark .hljs-builtin-name,body.tc-dark .hljs-class,body.tc-dark .hljs-title{color:#e6c07b}body.tc-dark .hljs-comment,body.tc-dark .hljs-quote,body.tc-dark .hljs-deletion{color:#7f848e}body.tc-dark .hljs-keyword,body.tc-dark .hljs-selector-tag,body.tc-dark .hljs-section,body.tc-dark .hljs-link,body.tc-dark .hljs-emphasis,body.tc-dark .hljs-template-tag,body.tc-dark .hljs-template-variable{color:#c678dd}body.tc-dark .hljs-addition,body.tc-dark .hljs-string,body.tc-dark .hljs-symbol,body.tc-dark .hljs-meta-string{color:#98c379}body.tc-dark .hljs-regexp{color:#56b6c2}body.tc-dark .hljs-name{color:#61afef}#mark-readme-content{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.6;color:var(--c-neutral-700)}#mark-readme-content h1,#mark-readme-content h2,#mark-readme-content h3,#mark-readme-content h4,#mark-readme-content h5,#mark-readme-content h6{margin-top:1.5em;margin-bottom:.5em;font-weight:600;line-height:1.25}#mark-readme-content h1{font-size:2em;border-bottom:1px solid var(--c-neutral-200);padding-bottom:.3em}#mark-readme-content h2{font-size:1.5em;border-bottom:1px solid var(--c-neutral-200);padding-bottom:.3em}#mark-readme-content h3{font-size:1.25em}#mark-readme-content p{margin:.5em 0}#mark-readme-content ul,#mark-readme-content ol{padding-left:2em;margin:.5em 0}#mark-readme-content ul li,#mark-readme-content ol li{margin:.25em 0}#mark-readme-content a{color:var(--c-primary-500);text-decoration:none}#mark-readme-content a:hover{text-decoration:underline}#mark-readme-content code{background-color:var(--c-neutral-100);border-radius:3px;padding:.2em .4em;font-family:Courier New,Courier,monospace;font-size:.9em;color:var(--c-neutral-700);white-space:normal}#mark-readme-content pre{background-color:var(--c-neutral-100)!important;border:1px solid var(--c-neutral-300)!important;border-radius:6px!important;overflow:auto!important;padding:16px!important;margin:1em 0!important;font-family:Courier New,Courier,monospace!important;font-size:.9em!important;line-height:1.45!important;white-space:pre-wrap!important;word-wrap:break-word!important;overflow-wrap:break-word!important;display:block!important}#mark-readme-content pre code{background-color:transparent!important;padding:0!important;margin:0!important;border-radius:0!important;color:inherit!important;display:block!important;white-space:pre-wrap!important;word-break:break-word!important;word-spacing:normal!important;overflow-wrap:break-word!important;tab-size:4!important;-moz-tab-size:4!important;border:none!important;font-family:Courier New,Courier,monospace!important;font-size:.9em!important;line-height:1.45!important}#mark-readme-content pre code.language-typescript,#mark-readme-content pre code.language-html,#mark-readme-content pre code.language-css,#mark-readme-content pre code.language-scss,#mark-readme-content pre code.language-javascript,#mark-readme-content pre code.language-json,#mark-readme-content pre code.language-bash{color:inherit!important}#mark-readme-content table{border-collapse:collapse;width:100%;margin:1em 0}#mark-readme-content table thead{background-color:var(--c-neutral-100);font-weight:600}#mark-readme-content table th,#mark-readme-content table td{border:1px solid var(--c-neutral-300);padding:12px;text-align:left}#mark-readme-content table tr:nth-child(odd){background-color:var(--c-neutral-50)}#mark-readme-content table tr:nth-child(2n){background-color:var(--c-neutral-100)}#mark-readme-content table tr:hover{background-color:var(--c-neutral-200)}#mark-readme-content blockquote{border-left:4px solid var(--c-neutral-300);color:var(--c-neutral-500);padding:.5em 1em;margin:1em 0}#mark-readme-content hr{border:none;border-top:2px solid var(--c-neutral-200);margin:2em 0}#mark-readme-content img{max-width:100%;height:auto}.p-relative{position:relative}\n"], dependencies: [{ kind: "ngmodule", type: MarkdownModule }, { kind: "component", type: i2.MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }, { kind: "component", type: TCloudUiAccordionComponent, selector: "tcloud-ui-accordion", inputs: ["disabled", "show", "loading"], outputs: ["onAction"] }, { kind: "component", type: TCloudUiAccordionTitleComponent, selector: "tcloud-ui-accordion-title" }, { kind: "component", type: TCloudUiAccordionBodyComponent, selector: "tcloud-ui-accordion-body" }, { kind: "component", type: TCloudUiLoadingComponent, selector: "tcloud-ui-loading", inputs: ["gif", "mode", "onlyInline", "onlyIcon", "full", "loading"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10654
10742
|
}
|
|
10655
10743
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TCloudUiMarkReadmeComponent, decorators: [{
|
|
10656
10744
|
type: Component,
|
|
@@ -10669,6 +10757,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
10669
10757
|
type: Input
|
|
10670
10758
|
}], description: [{
|
|
10671
10759
|
type: Input
|
|
10760
|
+
}], content: [{
|
|
10761
|
+
type: Input
|
|
10672
10762
|
}] } });
|
|
10673
10763
|
|
|
10674
10764
|
const COMPONENTS = [
|