structra-ui 0.1.24 → 0.1.26
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 +24 -4
- package/package.json +17 -11
- package/structra-ui.scss +2 -0
package/README.md
CHANGED
|
@@ -19,6 +19,29 @@ Se usar **npm 6 ou anterior**, instale explicitamente os mesmos pacotes e versõ
|
|
|
19
19
|
- **Angular 21** (`^21.2.7` nos peers): sem suporte para Angular 22.
|
|
20
20
|
- **Material e CDK** obrigatórios; **Router** obrigatório; **AG Grid** obrigatório; **RxJS** e **Zone.js** obrigatórios — nada é opcional no `package.json` da lib.
|
|
21
21
|
|
|
22
|
+
## Estilos globais (obrigatório)
|
|
23
|
+
|
|
24
|
+
O pacote inclui **só um ficheiro de tema:** **`structra-ui.scss`**. É o resultado de compilar o `styles.scss` do monorepo (tokens, Material, AG Grid, CDK, etc.): por dentro é **CSS já resolvido**, mas a extensão é **`.scss`** para alinhar com projetos que só usam SCSS no `angular.json`. Sem este ficheiro na lista `styles`, a UI fica sem estilos.
|
|
25
|
+
|
|
26
|
+
**`angular.json`:** no **início** de `projects.<app>.architect.build.options.styles`:
|
|
27
|
+
|
|
28
|
+
```json
|
|
29
|
+
"styles": [
|
|
30
|
+
"node_modules/structra-ui/structra-ui.scss",
|
|
31
|
+
"src/styles.scss"
|
|
32
|
+
]
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
**`main.ts` (alternativa):** antes de `bootstrapApplication`:
|
|
36
|
+
|
|
37
|
+
```ts
|
|
38
|
+
import 'structra-ui/styles';
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
(Exige `moduleResolution` compatível com `exports` do npm, por exemplo `bundler` ou `node16`.)
|
|
42
|
+
|
|
43
|
+
**AG Grid 35+:** registe os módulos Community uma vez na app (ex. `ModuleRegistry.registerModules([AllCommunityModule])` em `main.ts`).
|
|
44
|
+
|
|
22
45
|
**Importar componentes:** `import { TextFieldComponent } from 'structra-ui';` e use em `imports: [TextFieldComponent, …]` do `@Component`. No `tsconfig.json` da app, prefira `"moduleResolution": "bundler"` ou `"node16"` para o Node resolver o campo `exports` do pacote.
|
|
23
46
|
|
|
24
47
|
## Build do pacote
|
|
@@ -27,10 +50,9 @@ A entrada publicada é **`src/structra-public-api.ts`** na raiz do monorepo (ver
|
|
|
27
50
|
|
|
28
51
|
```bash
|
|
29
52
|
npm run lib:build
|
|
30
|
-
# ou: npx ng build structra-ui
|
|
31
53
|
```
|
|
32
54
|
|
|
33
|
-
|
|
55
|
+
Gera `dist/structra-ui/` (JavaScript + tipos + **`structra-ui.scss`**). **Não use só `ng build structra-ui`** para publicar: esse comando **não** gera o tema global; o `npm run lib:build` corre o ng-packagr e depois compila `src/styles.scss` para `structra-ui.scss`.
|
|
34
56
|
|
|
35
57
|
## Uso
|
|
36
58
|
|
|
@@ -38,8 +60,6 @@ gera `dist/structra-ui/`, pronto para `npm pack` / `npm publish`. O `package.jso
|
|
|
38
60
|
import { STRUCTRA_UI, BaseButtonComponent } from 'structra-ui';
|
|
39
61
|
```
|
|
40
62
|
|
|
41
|
-
Os estilos globais (tokens, Material, AG Grid, CDK) seguem os do StructraLab; nas aplicações consumidoras importe o `styles.scss` principal do produto ou replique os `@use` de tema conforme a documentação interna.
|
|
42
|
-
|
|
43
63
|
## Licença
|
|
44
64
|
|
|
45
65
|
MIT
|
package/package.json
CHANGED
|
@@ -1,16 +1,31 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "structra-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.26",
|
|
4
4
|
"description": "Biblioteca de componentes Angular da StructraLab (UI reutilizável).",
|
|
5
5
|
"homepage": "https://structralab.com/",
|
|
6
6
|
"license": "MIT",
|
|
7
|
-
"sideEffects":
|
|
7
|
+
"sideEffects": [
|
|
8
|
+
"structra-ui.scss"
|
|
9
|
+
],
|
|
8
10
|
"files": [
|
|
9
11
|
"fesm2022/",
|
|
10
12
|
"types/",
|
|
13
|
+
"structra-ui.scss",
|
|
11
14
|
"README.md",
|
|
12
15
|
"package.json"
|
|
13
16
|
],
|
|
17
|
+
"exports": {
|
|
18
|
+
"./structra-ui.scss": "./structra-ui.scss",
|
|
19
|
+
"./styles": "./structra-ui.scss",
|
|
20
|
+
"./global.scss": "./structra-ui.scss",
|
|
21
|
+
"./package.json": {
|
|
22
|
+
"default": "./package.json"
|
|
23
|
+
},
|
|
24
|
+
".": {
|
|
25
|
+
"types": "./types/structra-ui.d.ts",
|
|
26
|
+
"default": "./fesm2022/structra-ui.mjs"
|
|
27
|
+
}
|
|
28
|
+
},
|
|
14
29
|
"keywords": [
|
|
15
30
|
"angular",
|
|
16
31
|
"angular21",
|
|
@@ -44,14 +59,5 @@
|
|
|
44
59
|
},
|
|
45
60
|
"module": "fesm2022/structra-ui.mjs",
|
|
46
61
|
"typings": "types/structra-ui.d.ts",
|
|
47
|
-
"exports": {
|
|
48
|
-
"./package.json": {
|
|
49
|
-
"default": "./package.json"
|
|
50
|
-
},
|
|
51
|
-
".": {
|
|
52
|
-
"types": "./types/structra-ui.d.ts",
|
|
53
|
-
"default": "./fesm2022/structra-ui.mjs"
|
|
54
|
-
}
|
|
55
|
-
},
|
|
56
62
|
"type": "module"
|
|
57
63
|
}
|
package/structra-ui.scss
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/* structra-ui: tema global gerado (CSS compilado; sintaxe válida em SCSS). Não editar. */
|
|
2
|
+
@import'ag-grid-community/styles/ag-grid.css';@import'ag-grid-community/styles/ag-theme-alpine.css';@import'@angular/material/prebuilt-themes/indigo-pink.css';@keyframes app-lib-dialog-panel-in{from{opacity:0;transform:translateY(-6px) scale(0.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes app-lib-dialog-backdrop-enter{from{backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}to{backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05)}}.cdk-overlay-pane.app-lib-dialog-panel{box-sizing:border-box;border-radius:10px;border:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, 0.12));background:var(--app-color-surface, #fff);box-shadow:0 4px 6px -1px rgba(0,0,0,.08),0 12px 28px -8px rgba(26,47,69,.18);max-height:min(88vh,40rem);overflow:auto;outline:none;animation:app-lib-dialog-panel-in 280ms cubic-bezier(0.22, 1, 0.36, 1) both}@media(prefers-reduced-motion: reduce){.cdk-overlay-pane.app-lib-dialog-panel{animation:none}.cdk-overlay-backdrop.app-lib-dialog-backdrop{transition:opacity 1ms}}.cdk-overlay-pane.app-lib-dialog-panel .cdk-dialog-container{outline:none}.cdk-overlay-backdrop.app-lib-dialog-backdrop{background:rgba(26,47,69,.42);backdrop-filter:blur(10px) saturate(1.05);-webkit-backdrop-filter:blur(10px) saturate(1.05);transition:opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1),backdrop-filter 380ms ease-out,-webkit-backdrop-filter 380ms ease-out}.cdk-overlay-backdrop.app-lib-dialog-backdrop:not(.cdk-overlay-backdrop-showing){backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0)}:root{--app-color-error: #b91c1c;--app-color-error-contrast: #ffffff;--app-color-error-border: #dc2626;--app-color-error-bg-subtle: rgba(185, 28, 28, 0.12);--app-color-invalid-input-bg: #fef2f2;--app-color-validation-focus-ring: rgba(185, 28, 28, 0.45);--app-color-success: #15803d;--app-color-warning: #c2410c;--app-color-info: #1d4ed8;--app-color-primary: #2b7fd9;--app-color-primary-contrast: #ffffff;--app-color-primary-muted: rgba(43, 127, 217, 0.14);--app-color-secondary: #4a6d8c;--app-color-secondary-contrast: #ffffff;--app-color-surface: #ffffff;--app-color-surface-alt: color-mix(in srgb, var(--app-color-primary) 7%, #ffffff 93%);--app-color-background: #fafbfc;--app-color-border: #d4d4d4;--app-color-border-strong: #b6cce5;--app-color-border-subtle: rgba(26, 47, 69, 0.09);--app-color-text-primary: #1a2f45;--app-color-text-secondary: #5a7fa3;--app-color-text-muted: #6b8299;--app-color-placeholder: #737373;--app-color-focus-ring: rgba(43, 127, 217, 0.25);--app-color-focus-ring-strong: rgba(43, 127, 217, 0.45);--app-color-disabled-bg: #f5f5f5;--app-color-disabled-text: #737373;--app-color-selected-bg: rgba(43, 127, 217, 0.1);--app-color-selected-border: #2b7fd9;--app-color-hover-bg: rgba(43, 127, 217, 0.08);--app-color-hover-bg-strong: rgba(43, 127, 217, 0.12);--app-color-active-bg: rgba(43, 127, 217, 0.14);--app-color-tab-inactive-bg: #f3f6f9;--app-color-tab-inactive-border: rgba(182, 204, 229, 0.75);--app-color-tab-inactive-text: #51667a;--app-color-tab-hover-border: rgba(43, 127, 217, 0.42);--app-color-tab-hover-bg: #eef3f8;--app-color-tab-shadow: rgba(43, 127, 217, 0.14);--app-color-shell-shadow: rgba(26, 47, 69, 0.05);--app-color-elevated-shadow: rgba(43, 127, 217, 0.07);--app-color-group-header-hover: rgba(43, 127, 217, 0.06);--app-color-readonly-bg: #eceff1;--app-color-readonly-border: #b0bec5;--app-color-readonly-border-focus: #78909c;--app-color-readonly-label: #607d8b;--app-color-readonly-label-top: #455a64;--app-color-readonly-prefix: #78909b;--app-color-readonly-input: #37474f;--app-color-readonly-focus-ring: rgba(120, 144, 156, 0.28);--app-color-readonly-button-bg: #cfd8dc;--app-color-readonly-button-border: #90a4ae;--app-color-readonly-button-text: #37474f;--app-color-readonly-button-focus-ring: rgba(96, 125, 139, 0.35);--app-color-skeleton-track: rgba(26, 47, 69, 0.09);--app-color-skeleton-track-strong: rgba(26, 47, 69, 0.12);--app-color-skeleton-shine: rgba(255, 255, 255, 0.22);--app-color-empty-border: rgba(26, 47, 69, 0.14);--app-color-empty-bg: rgba(243, 246, 249, 0.55);--app-color-avatar-gradient-start: rgba(43, 127, 217, 0.14);--app-color-avatar-gradient-end: rgba(26, 47, 69, 0.06);--app-color-button-secondary-hover-bg: #e8f0fa;--app-color-prefix-hover-bg: rgba(90, 127, 163, 0.15);--app-color-overlay-shadow: rgba(0, 0, 0, 0.12);--app-z-drawer-backdrop: 1100;--app-z-drawer-panel: 1101;--app-z-overlay-container: 1120;--app-z-dialog: 1200;--app-z-toast: 1300;--app-z-validation-summary-pinned: 1400}.app-library-theme.theme-green{--app-color-primary: #16a34a;--app-color-surface-alt: color-mix(in srgb, var(--app-color-primary) 7%, #ffffff 93%);--app-color-primary-muted: rgba(22, 163, 74, 0.16);--app-color-secondary: #3d6b4f;--app-color-border-strong: #86cba0;--app-color-focus-ring: rgba(22, 163, 74, 0.28);--app-color-focus-ring-strong: rgba(22, 163, 74, 0.42);--app-color-selected-bg: rgba(22, 163, 74, 0.12);--app-color-selected-border: #16a34a;--app-color-hover-bg: rgba(22, 163, 74, 0.07);--app-color-hover-bg-strong: rgba(22, 163, 74, 0.12);--app-color-active-bg: rgba(22, 163, 74, 0.16);--app-color-tab-hover-border: rgba(22, 163, 74, 0.45);--app-color-tab-shadow: rgba(22, 163, 74, 0.16);--app-color-elevated-shadow: rgba(22, 163, 74, 0.09);--app-color-group-header-hover: rgba(22, 163, 74, 0.07);--app-color-text-secondary: #3f6b52;--app-color-tab-inactive-text: #4a6356;--app-color-tab-hover-bg: #ecfdf3;--app-color-button-secondary-hover-bg: #dff7e8;--app-color-prefix-hover-bg: rgba(63, 107, 82, 0.14);--app-color-avatar-gradient-start: rgba(22, 163, 74, 0.18);--app-color-avatar-gradient-end: rgba(26, 47, 69, 0.06)}.app-library-theme.theme-purple{--app-color-primary: #7c3aed;--app-color-surface-alt: color-mix(in srgb, var(--app-color-primary) 7%, #ffffff 93%);--app-color-primary-muted: rgba(124, 58, 237, 0.16);--app-color-secondary: #5b21b6;--app-color-border-strong: #c4b5fd;--app-color-focus-ring: rgba(124, 58, 237, 0.28);--app-color-focus-ring-strong: rgba(124, 58, 237, 0.42);--app-color-selected-bg: rgba(124, 58, 237, 0.12);--app-color-selected-border: #7c3aed;--app-color-hover-bg: rgba(124, 58, 237, 0.08);--app-color-hover-bg-strong: rgba(124, 58, 237, 0.14);--app-color-active-bg: rgba(124, 58, 237, 0.18);--app-color-tab-hover-border: rgba(124, 58, 237, 0.45);--app-color-tab-shadow: rgba(124, 58, 237, 0.18);--app-color-elevated-shadow: rgba(124, 58, 237, 0.1);--app-color-group-header-hover: rgba(124, 58, 237, 0.08);--app-color-text-secondary: #6d5a9c;--app-color-tab-inactive-text: #5c5678;--app-color-tab-hover-bg: #f5f3ff;--app-color-button-secondary-hover-bg: #ede9fe;--app-color-prefix-hover-bg: rgba(109, 90, 156, 0.14);--app-color-avatar-gradient-start: rgba(124, 58, 237, 0.2);--app-color-avatar-gradient-end: rgba(26, 47, 69, 0.06)}.app-library-theme.theme-orange{--app-color-primary: #ea580c;--app-color-surface-alt: color-mix(in srgb, var(--app-color-primary) 7%, #ffffff 93%);--app-color-primary-muted: rgba(234, 88, 12, 0.16);--app-color-secondary: #9a3412;--app-color-border-strong: #fdba74;--app-color-focus-ring: rgba(234, 88, 12, 0.28);--app-color-focus-ring-strong: rgba(234, 88, 12, 0.42);--app-color-selected-bg: rgba(234, 88, 12, 0.1);--app-color-selected-border: #ea580c;--app-color-hover-bg: rgba(234, 88, 12, 0.07);--app-color-hover-bg-strong: rgba(234, 88, 12, 0.12);--app-color-active-bg: rgba(234, 88, 12, 0.16);--app-color-tab-hover-border: rgba(234, 88, 12, 0.45);--app-color-tab-shadow: rgba(234, 88, 12, 0.16);--app-color-elevated-shadow: rgba(234, 88, 12, 0.09);--app-color-group-header-hover: rgba(234, 88, 12, 0.07);--app-color-text-secondary: #a16207;--app-color-tab-inactive-text: #6b5c4e;--app-color-tab-hover-bg: #fff7ed;--app-color-button-secondary-hover-bg: #ffedd5;--app-color-prefix-hover-bg: rgba(154, 52, 18, 0.12);--app-color-avatar-gradient-start: rgba(234, 88, 12, 0.2);--app-color-avatar-gradient-end: rgba(26, 47, 69, 0.06)}.app-library-theme.theme-white{--app-color-primary: #64748b;--app-color-primary-contrast: #ffffff;--app-color-primary-muted: rgba(100, 116, 139, 0.14);--app-color-secondary: #475569;--app-color-secondary-contrast: #ffffff;--app-color-surface: #ffffff;--app-color-surface-alt: #f8fafc;--app-color-background: #fcfcfd;--app-color-border: #e2e8f0;--app-color-border-strong: #cbd5e1;--app-color-border-subtle: rgba(71, 85, 105, 0.08);--app-color-text-primary: #1e293b;--app-color-text-secondary: #64748b;--app-color-text-muted: #94a3b8;--app-color-placeholder: #94a3b8;--app-color-focus-ring: rgba(100, 116, 139, 0.28);--app-color-focus-ring-strong: rgba(100, 116, 139, 0.42);--app-color-disabled-bg: #f1f5f9;--app-color-disabled-text: #cbd5e1;--app-color-selected-bg: rgba(100, 116, 139, 0.1);--app-color-selected-border: #64748b;--app-color-hover-bg: rgba(100, 116, 139, 0.06);--app-color-hover-bg-strong: rgba(100, 116, 139, 0.11);--app-color-active-bg: rgba(100, 116, 139, 0.14);--app-color-tab-inactive-bg: #f8fafc;--app-color-tab-inactive-border: #e2e8f0;--app-color-tab-inactive-text: #64748b;--app-color-tab-hover-border: rgba(100, 116, 139, 0.35);--app-color-tab-hover-bg: #f1f5f9;--app-color-tab-shadow: rgba(100, 116, 139, 0.1);--app-color-shell-shadow: rgba(30, 41, 59, 0.05);--app-color-elevated-shadow: rgba(30, 41, 59, 0.07);--app-color-group-header-hover: rgba(100, 116, 139, 0.05);--app-color-readonly-bg: #f1f5f9;--app-color-readonly-border: #cbd5e1;--app-color-readonly-border-focus: #94a3b8;--app-color-readonly-label: #64748b;--app-color-readonly-label-top: #475569;--app-color-readonly-prefix: #94a3b8;--app-color-readonly-input: #334155;--app-color-readonly-focus-ring: rgba(100, 116, 139, 0.28);--app-color-readonly-button-bg: #e2e8f0;--app-color-readonly-button-border: #cbd5e1;--app-color-readonly-button-text: #334155;--app-color-readonly-button-focus-ring: rgba(71, 85, 105, 0.32);--app-color-skeleton-track: rgba(100, 116, 139, 0.08);--app-color-skeleton-track-strong: rgba(100, 116, 139, 0.12);--app-color-skeleton-shine: rgba(255, 255, 255, 0.35);--app-color-empty-border: rgba(100, 116, 139, 0.12);--app-color-empty-bg: rgba(248, 250, 252, 0.9);--app-color-avatar-gradient-start: rgba(100, 116, 139, 0.12);--app-color-avatar-gradient-end: rgba(30, 41, 59, 0.05);--app-color-button-secondary-hover-bg: #e2e8f0;--app-color-prefix-hover-bg: rgba(71, 85, 105, 0.12);--app-color-overlay-shadow: rgba(15, 23, 42, 0.12)}.app-library-theme.theme-gray{--app-color-primary: #52525b;--app-color-primary-contrast: #ffffff;--app-color-primary-muted: rgba(82, 82, 91, 0.14);--app-color-secondary: #3f3f46;--app-color-secondary-contrast: #ffffff;--app-color-surface: #fafafa;--app-color-surface-alt: #f4f4f5;--app-color-background: #f4f4f5;--app-color-border: #d4d4d8;--app-color-border-strong: #a1a1aa;--app-color-border-subtle: rgba(39, 39, 42, 0.09);--app-color-text-primary: #18181b;--app-color-text-secondary: #52525b;--app-color-text-muted: #71717a;--app-color-placeholder: #a1a1aa;--app-color-focus-ring: rgba(82, 82, 91, 0.28);--app-color-focus-ring-strong: rgba(82, 82, 91, 0.42);--app-color-disabled-bg: #f4f4f5;--app-color-disabled-text: #a1a1aa;--app-color-selected-bg: rgba(82, 82, 91, 0.1);--app-color-selected-border: #52525b;--app-color-hover-bg: rgba(82, 82, 91, 0.07);--app-color-hover-bg-strong: rgba(82, 82, 91, 0.12);--app-color-active-bg: rgba(82, 82, 91, 0.16);--app-color-tab-inactive-bg: #f4f4f5;--app-color-tab-inactive-border: #e4e4e7;--app-color-tab-inactive-text: #52525b;--app-color-tab-hover-border: rgba(82, 82, 91, 0.35);--app-color-tab-hover-bg: #e4e4e7;--app-color-tab-shadow: rgba(24, 24, 27, 0.1);--app-color-shell-shadow: rgba(24, 24, 27, 0.06);--app-color-elevated-shadow: rgba(24, 24, 27, 0.08);--app-color-group-header-hover: rgba(82, 82, 91, 0.06);--app-color-readonly-bg: #e4e4e7;--app-color-readonly-border: #a1a1aa;--app-color-readonly-border-focus: #71717a;--app-color-readonly-label: #52525b;--app-color-readonly-label-top: #3f3f46;--app-color-readonly-prefix: #71717a;--app-color-readonly-input: #27272a;--app-color-readonly-focus-ring: rgba(113, 113, 122, 0.28);--app-color-readonly-button-bg: #d4d4d8;--app-color-readonly-button-border: #a1a1aa;--app-color-readonly-button-text: #27272a;--app-color-readonly-button-focus-ring: rgba(63, 63, 70, 0.32);--app-color-skeleton-track: rgba(82, 82, 91, 0.09);--app-color-skeleton-track-strong: rgba(82, 82, 91, 0.13);--app-color-skeleton-shine: rgba(255, 255, 255, 0.28);--app-color-empty-border: rgba(82, 82, 91, 0.14);--app-color-empty-bg: rgba(244, 244, 245, 0.92);--app-color-avatar-gradient-start: rgba(82, 82, 91, 0.14);--app-color-avatar-gradient-end: rgba(24, 24, 27, 0.06);--app-color-button-secondary-hover-bg: #e4e4e7;--app-color-prefix-hover-bg: rgba(63, 63, 70, 0.12);--app-color-overlay-shadow: rgba(0, 0, 0, 0.16)}.app-library-theme.theme-sepia{--app-color-primary: #8d6e4b;--app-color-primary-contrast: #fffef8;--app-color-primary-muted: rgba(141, 110, 75, 0.18);--app-color-secondary: #6b5344;--app-color-secondary-contrast: #fffef8;--app-color-surface: #fffef8;--app-color-surface-alt: #faf6ed;--app-color-background: #f4efe6;--app-color-border: #e5d9c8;--app-color-border-strong: #cbb89a;--app-color-border-subtle: rgba(61, 48, 40, 0.1);--app-color-text-primary: #3d3428;--app-color-text-secondary: #6b5a48;--app-color-text-muted: #8a7a66;--app-color-placeholder: #a89884;--app-color-focus-ring: rgba(141, 110, 75, 0.35);--app-color-focus-ring-strong: rgba(141, 110, 75, 0.48);--app-color-disabled-bg: #f0ebe3;--app-color-disabled-text: #b5a896;--app-color-selected-bg: rgba(141, 110, 75, 0.12);--app-color-selected-border: #8d6e4b;--app-color-hover-bg: rgba(141, 110, 75, 0.08);--app-color-hover-bg-strong: rgba(141, 110, 75, 0.14);--app-color-active-bg: rgba(141, 110, 75, 0.18);--app-color-tab-inactive-bg: #faf6ed;--app-color-tab-inactive-border: #e8dcc8;--app-color-tab-inactive-text: #6b5a48;--app-color-tab-hover-border: rgba(141, 110, 75, 0.42);--app-color-tab-hover-bg: #f2ebe0;--app-color-tab-shadow: rgba(61, 48, 40, 0.12);--app-color-shell-shadow: rgba(61, 48, 40, 0.07);--app-color-elevated-shadow: rgba(61, 48, 40, 0.1);--app-color-group-header-hover: rgba(141, 110, 75, 0.07);--app-color-readonly-bg: #efe8dc;--app-color-readonly-border: #cbb89a;--app-color-readonly-border-focus: #a89884;--app-color-readonly-label: #6b5a48;--app-color-readonly-label-top: #4a3f35;--app-color-readonly-prefix: #8a7a66;--app-color-readonly-input: #3d3428;--app-color-readonly-focus-ring: rgba(141, 110, 75, 0.32);--app-color-readonly-button-bg: #e5d9c8;--app-color-readonly-button-border: #cbb89a;--app-color-readonly-button-text: #3d3428;--app-color-readonly-button-focus-ring: rgba(107, 90, 72, 0.35);--app-color-skeleton-track: rgba(141, 110, 75, 0.1);--app-color-skeleton-track-strong: rgba(141, 110, 75, 0.14);--app-color-skeleton-shine: rgba(255, 254, 248, 0.45);--app-color-empty-border: rgba(141, 110, 75, 0.18);--app-color-empty-bg: rgba(250, 246, 237, 0.92);--app-color-avatar-gradient-start: rgba(141, 110, 75, 0.16);--app-color-avatar-gradient-end: rgba(61, 48, 40, 0.06);--app-color-button-secondary-hover-bg: #ebe2d4;--app-color-prefix-hover-bg: rgba(107, 90, 72, 0.14);--app-color-overlay-shadow: rgba(45, 35, 28, 0.18)}.app-library-theme.theme-black{--app-color-primary: #111827;--app-color-primary-contrast: #ffffff;--app-color-primary-muted: rgba(17, 24, 39, 0.12);--app-color-secondary: #374151;--app-color-secondary-contrast: #ffffff;--app-color-surface: #ffffff;--app-color-surface-alt: color-mix(in srgb, var(--app-color-primary) 7%, #ffffff 93%);--app-color-background: #fafbfc;--app-color-border: #d1d5db;--app-color-border-strong: #9ca3af;--app-color-border-subtle: rgba(17, 24, 39, 0.08);--app-color-text-primary: #111827;--app-color-text-secondary: #4b5563;--app-color-text-muted: #6b7280;--app-color-placeholder: #9ca3af;--app-color-focus-ring: rgba(17, 24, 39, 0.22);--app-color-focus-ring-strong: rgba(17, 24, 39, 0.38);--app-color-disabled-bg: #f3f4f6;--app-color-disabled-text: #9ca3af;--app-color-selected-bg: rgba(17, 24, 39, 0.08);--app-color-selected-border: #111827;--app-color-hover-bg: rgba(17, 24, 39, 0.05);--app-color-hover-bg-strong: rgba(17, 24, 39, 0.1);--app-color-active-bg: rgba(17, 24, 39, 0.14);--app-color-tab-inactive-bg: #f3f4f6;--app-color-tab-inactive-border: #e5e7eb;--app-color-tab-inactive-text: #4b5563;--app-color-tab-hover-border: rgba(17, 24, 39, 0.28);--app-color-tab-hover-bg: #eceff2;--app-color-tab-shadow: rgba(17, 24, 39, 0.1);--app-color-shell-shadow: rgba(17, 24, 39, 0.06);--app-color-elevated-shadow: rgba(17, 24, 39, 0.08);--app-color-group-header-hover: rgba(17, 24, 39, 0.05);--app-color-readonly-bg: #eceff1;--app-color-readonly-border: #b0bec5;--app-color-readonly-border-focus: #78909c;--app-color-readonly-label: #607d8b;--app-color-readonly-label-top: #455a64;--app-color-readonly-prefix: #78909b;--app-color-readonly-input: #37474f;--app-color-readonly-focus-ring: rgba(120, 144, 156, 0.28);--app-color-readonly-button-bg: #cfd8dc;--app-color-readonly-button-border: #90a4ae;--app-color-readonly-button-text: #37474f;--app-color-readonly-button-focus-ring: rgba(96, 125, 139, 0.35);--app-color-skeleton-track: rgba(17, 24, 39, 0.08);--app-color-skeleton-track-strong: rgba(17, 24, 39, 0.11);--app-color-skeleton-shine: rgba(255, 255, 255, 0.22);--app-color-empty-border: rgba(17, 24, 39, 0.12);--app-color-empty-bg: rgba(243, 244, 246, 0.85);--app-color-avatar-gradient-start: rgba(17, 24, 39, 0.12);--app-color-avatar-gradient-end: rgba(17, 24, 39, 0.05);--app-color-button-secondary-hover-bg: #e5e7eb;--app-color-prefix-hover-bg: rgba(75, 85, 99, 0.12);--app-color-overlay-shadow: rgba(0, 0, 0, 0.14)}:root,.app-library-theme{--ui-field-float-bg: var(--app-color-surface-alt);--ui-field-float-border: var(--app-color-border-strong);--ui-field-float-border-focus: var(--app-color-primary);--ui-field-float-border-radius: 14px;--ui-field-float-label-color: var(--app-color-text-secondary);--ui-field-float-label-top-color: var(--app-color-secondary);--ui-field-float-label-invalid-color: var(--app-color-error);--ui-field-float-input-text: var(--app-color-text-primary);--ui-field-float-prefix-color: var(--app-color-text-secondary);--ui-field-float-focus-ring: var(--app-color-focus-ring);--app-color-dropdown-option-selected-bg: color-mix(in srgb, var(--app-color-primary) 12%, #ffffff 88%);--app-color-dropdown-option-selected-bg-active: color-mix( in srgb, var(--app-color-primary) 18%, #ffffff 82% );--app-color-dropdown-option-selected-hover-bg: color-mix( in srgb, var(--app-color-primary) 16%, #ffffff 84% );--app-color-dropdown-option-highlight-bg: color-mix(in srgb, var(--app-color-primary) 16%, #ffffff 84%);--app-color-dropdown-option-hover-bg: color-mix(in srgb, var(--app-color-primary) 13%, #ffffff 87%);--ui-field-input-border: var(--app-color-border);--ui-field-input-border-radius: 6px;--ui-field-input-bg: var(--app-color-surface);--ui-field-input-color: var(--app-color-text-primary);--ui-field-input-placeholder: var(--app-color-placeholder);--ui-field-input-focus-ring: var(--app-color-primary);--ui-field-input-focus-ring-width: 2px;--ui-field-input-invalid-border: var(--app-color-error-border);--ui-field-input-invalid-placeholder: var(--app-color-error);--ui-field-input-invalid-focus-ring: var(--app-color-error);--ui-field-input-invalid-focus-halo: var(--app-color-error-bg-subtle);--ui-field-invalid-input-bg: var(--app-color-invalid-input-bg);--ui-field-input-disabled-bg: var(--app-color-disabled-bg);--ui-field-input-disabled-opacity: 0.65;--ui-field-label-color: var(--app-color-text-primary);--ui-field-required-mark-color: var(--app-color-error);--ui-field-error-text-color: var(--app-color-error);--ui-field-datepicker-selected-bg: var(--app-color-primary);--ui-field-datepicker-selected-fg: var(--app-color-primary-contrast);--ui-field-datepicker-today-outline: var(--app-color-primary);--ui-field-datepicker-nav-icon: var(--app-color-primary);--ui-field-datepicker-period-icon: var(--app-color-secondary);--ui-field-datepicker-hover-bg: var(--app-color-hover-bg-strong);--ui-field-datepicker-focus-bg: var(--app-color-hover-bg-strong);--ui-field-readonly-bg: var(--app-color-readonly-bg);--ui-field-readonly-border: var(--app-color-readonly-border);--ui-field-readonly-border-focus: var(--app-color-readonly-border-focus);--ui-field-readonly-label-color: var(--app-color-readonly-label);--ui-field-readonly-label-top-color: var(--app-color-readonly-label-top);--ui-field-readonly-prefix-color: var(--app-color-readonly-prefix);--ui-field-readonly-input-text: var(--app-color-readonly-input);--ui-field-readonly-focus-ring: var(--app-color-readonly-focus-ring);--ui-field-readonly-button-bg: var(--app-color-readonly-button-bg);--ui-field-readonly-button-border: var(--app-color-readonly-button-border);--ui-field-readonly-button-text: var(--app-color-readonly-button-text);--ui-field-readonly-button-focus-ring: var(--app-color-readonly-button-focus-ring);--ui-form-actions-divider-color: var(--app-color-border);--ui-form-group-chevron-locked: var(--app-color-text-muted);--app-color-nav-shell-bg: var(--app-color-surface);--app-color-nav-surface: #ffffff;--app-color-nav-card-border: color-mix(in srgb, var(--app-color-primary) 32%, #ffffff);--app-color-nav-border-subtle: color-mix(in srgb, var(--app-color-primary) 18%, #ffffff);--app-color-nav-group-label: var(--app-color-text-muted);--app-color-nav-item-text: var(--app-color-text-primary);--app-color-nav-icon: var(--app-color-text-secondary);--app-color-nav-selected-bg: var(--app-color-selected-bg);--app-color-nav-selected-border: var(--app-color-selected-border);--app-color-nav-selected-text: var(--app-color-primary);--app-color-nav-hover-bg: var(--app-color-hover-bg);--app-color-nav-link: var(--app-color-primary);--app-color-nav-focus-ring: var(--app-color-focus-ring-strong);--app-color-shell-main-bg: var(--app-color-surface)}.mat-calendar.ui-field-datepicker-panel{--mat-datepicker-calendar-date-selected-state-text-color: var( --ui-field-datepicker-selected-fg );--mat-datepicker-calendar-date-selected-state-background-color: var( --ui-field-datepicker-selected-bg );--mat-datepicker-calendar-date-selected-disabled-state-background-color: color-mix( in srgb, var(--ui-field-datepicker-selected-bg) 45%, transparent );--mat-datepicker-calendar-date-today-outline-color: var(--ui-field-datepicker-today-outline);--mat-datepicker-calendar-date-today-disabled-state-outline-color: var( --ui-field-float-border );--mat-datepicker-calendar-date-today-selected-state-outline-color: var( --ui-field-datepicker-selected-fg );--mat-datepicker-calendar-date-focus-state-background-color: var( --ui-field-datepicker-focus-bg );--mat-datepicker-calendar-date-hover-state-background-color: var( --ui-field-datepicker-hover-bg );--mat-datepicker-calendar-navigation-button-icon-color: var(--ui-field-datepicker-nav-icon);--mat-datepicker-calendar-period-button-icon-color: var(--ui-field-datepicker-period-icon);--mat-datepicker-calendar-toggle-active-state-icon-color: var(--ui-field-datepicker-nav-icon);--mat-datepicker-calendar-date-in-range-state-background-color: var( --ui-field-datepicker-hover-bg )}.mat-calendar.ui-field-datepicker-panel .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mat-icon-button-icon-color: var(--ui-field-datepicker-nav-icon);--mat-icon-button-state-layer-color: var(--ui-field-datepicker-nav-icon)}.app-nav-surface{display:flex;flex-direction:column;min-height:0;box-sizing:border-box}.app-nav-surface__brand{flex:0 0 auto;display:block;margin:0 0 1rem;font-size:.95rem;font-weight:700;line-height:1.3;color:var(--app-color-text-primary, #1a2f45);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-nav-surface__brand:hover{color:var(--app-color-nav-link)}.app-nav-surface__scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:0;padding:.15rem 0 .35rem;background:rgba(0,0,0,0);border:none;border-radius:0;box-sizing:border-box}.app-nav-surface__section{flex:0 0 auto;min-width:0;margin:0;padding:.75rem 0 .5rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, 0.08))}.app-nav-surface__section:first-of-type{border-top:none;padding-top:.35rem}.app-nav-surface__section-title{margin:0 0 .5rem;padding:0 .1rem;font-size:.74rem;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--app-color-text-secondary, #5a7fa3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-nav-surface__list{margin:0;padding:0;list-style:none}.app-nav-surface__list li+li{margin-top:.08rem}.app-nav-surface__link{display:block;box-sizing:border-box;padding:.52rem .55rem;border:1px solid rgba(0,0,0,0);border-radius:8px;font-size:.93rem;color:var(--app-color-text-primary, #1a2f45);text-decoration:none;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-nav-surface__link:hover{background:var(--app-color-nav-hover-bg);color:var(--app-color-nav-selected-text)}.app-nav-surface__link:focus-visible{outline:2px solid var(--app-color-nav-focus-ring);outline-offset:1px}.app-nav-surface__link--active{font-weight:600;color:var(--app-color-primary, #2b7fd9);background:color-mix(in srgb, var(--app-color-primary) 9%, transparent);border:1px solid rgba(0,0,0,0);box-shadow:inset 3px 0 0 0 var(--app-color-primary, #2b7fd9)}.app-nav-surface app-menu-list .menu-list{background:rgba(0,0,0,0);border:none;border-radius:0;box-shadow:none;max-height:none;overflow-x:hidden;overflow-y:visible;padding:.15rem 0 .35rem;gap:.08rem}.app-nav-surface app-menu-list .menu-list--dense{padding:.12rem 0;gap:0}.app-nav-surface app-menu-list .menu-list__group-label{font-size:.74rem;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--app-color-text-secondary, #5a7fa3);padding:.75rem .55rem .5rem;margin-top:.35rem;border-top:1px solid var(--app-color-border-subtle, rgba(26, 47, 69, 0.08))}.app-nav-surface app-menu-list .menu-list>app-menu-group:first-of-type .menu-list__group-label{margin-top:0;padding-top:.35rem;border-top:none}.app-nav-surface app-menu-list .menu-list__label{color:var(--app-color-nav-item-text)}.app-nav-surface app-menu-list .menu-list__icon{color:var(--app-color-nav-icon)}.app-nav-surface app-menu-list .menu-list__submenu-chevron{color:var(--app-color-nav-icon)}.app-nav-surface app-menu-list .menu-list__option:hover:not(.menu-list__option--disabled):not(.menu-list__option--loading){background:var(--app-color-nav-hover-bg)}.app-nav-surface app-menu-list .menu-list__option.menu-list__option--active:not(.menu-list__option--selected):not(.menu-list__option--disabled):not(.menu-list__option--loading){background:var(--app-color-nav-hover-bg);border-color:rgba(0,0,0,0);box-shadow:none}.app-nav-surface app-menu-list .menu-list__option--selected:not(.menu-list__option--disabled){background:color-mix(in srgb, var(--app-color-primary) 9%, transparent);box-shadow:inset 3px 0 0 0 var(--app-color-primary, #2b7fd9);border-radius:8px;border:1px solid rgba(0,0,0,0)}.app-nav-surface app-menu-list .menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__label{color:var(--app-color-primary, #2b7fd9);font-weight:600}.app-nav-surface app-menu-list .menu-list__option--selected:not(.menu-list__option--disabled) .menu-list__icon{color:var(--app-color-primary, #2b7fd9)}.app-nav-surface app-menu-list .menu-list__option:focus-visible{outline:2px solid var(--app-color-nav-focus-ring);outline-offset:1px}.app-nav-surface app-menu-list .menu-list--compress-text{gap:.1rem}.app-nav-surface app-menu-list .menu-list--compress-text .menu-list__option{border-radius:8px;border-color:rgba(0,0,0,0)}.app-nav-surface app-menu-list .menu-list--compress-text .menu-list__option.menu-list__option--active:not(.menu-list__option--selected):not(.menu-list__option--disabled):not(.menu-list__option--loading){background:color-mix(in srgb, var(--app-color-primary) 5%, transparent);border-color:rgba(0,0,0,0);box-shadow:none}@media(max-width: 52rem){.app-nav-surface__brand{margin:.25rem 0 .85rem;font-size:1.08rem;font-weight:700;letter-spacing:-0.02em}}.cdk-overlay-container{z-index:var(--app-z-overlay-container, 1120)}.cdk-overlay-container .cdk-overlay-pane.app-library-theme:not(.app-lib-dialog-panel){background:rgba(0,0,0,0);color:var(--app-color-text-primary, inherit)}html{height:100%;box-sizing:border-box}html,body{margin:0;background-color:#fff}body{height:100%;overflow:hidden;box-sizing:border-box}html.cdk-global-scrollblock{position:fixed;top:0;left:0;width:100%;min-height:100%;min-height:100dvh;overflow:hidden;overscroll-behavior:none}html.cdk-global-scrollblock body{overflow:hidden !important}html.cdk-global-scrollblock [data-app-scroll-lock]{overflow:hidden !important;overscroll-behavior:none}html.app-dialog-scroll-lock{overflow:hidden !important;overscroll-behavior:none}html.app-dialog-scroll-lock body{overflow:hidden !important;overscroll-behavior:none}
|