@dev-tcloud/tcloud-ui 6.30.1-beta.7 → 7.0.2

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dev-tcloud/tcloud-ui",
3
- "version": "6.30.1-beta.7",
3
+ "version": "7.0.2",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "21.2.17",
6
6
  "@angular/core": "21.2.17",
@@ -9,7 +9,7 @@
9
9
  "dependencies": {
10
10
  "highlight.js": "^11.9.0",
11
11
  "ngx-markdown": "^21.3.0",
12
- "marked": "^17.0.1",
12
+ "marked": "^17.0.2",
13
13
  "tslib": "^2.6.2"
14
14
  },
15
15
  "module": "fesm2022/dev-tcloud-tcloud-ui.mjs",
@@ -66,3 +66,75 @@
66
66
  color-scheme: dark;
67
67
  }
68
68
  }
69
+
70
+ // =============================================================================
71
+ // Datepicker (vanillajs-datepicker) — remap dark do dropdown
72
+ // =============================================================================
73
+ // O dropdown é anexado ao <body> e estilizado por datepicker.min.css (cores
74
+ // fixas, base Bulma: #fff, #363636, #3273dc...). Aqui remapeamos essas cores
75
+ // para os tokens --c-* apenas no dark. Cada regra usa o prefixo `.tc-dark`, que
76
+ // vence o CSS de terceiros por especificidade (independente da ordem de carga).
77
+ .tc-dark {
78
+ .datepicker-picker {
79
+ background-color: var(--c-neutral-50);
80
+ color: var(--c-neutral-700);
81
+ }
82
+ .datepicker-dropdown .datepicker-picker {
83
+ box-shadow: 0 2px 6px rgba(0, 0, 0, .4), 0 0 0 1px var(--c-neutral-300);
84
+ }
85
+ .datepicker-footer,
86
+ .datepicker-title {
87
+ background-color: var(--c-neutral-100);
88
+ color: var(--c-neutral-700);
89
+ box-shadow: none;
90
+ }
91
+
92
+ // Controles: setas prev/next, view-switch e botões do rodapé (Hoje/Limpar)
93
+ .datepicker-controls .button {
94
+ background-color: var(--c-neutral-50);
95
+ border-color: var(--c-neutral-300);
96
+ color: var(--c-neutral-700);
97
+ }
98
+ .datepicker-controls .button:hover { border-color: var(--c-neutral-400); color: var(--c-neutral-700); }
99
+ .datepicker-controls .button:focus { border-color: var(--c-primary-500); color: var(--c-neutral-700); }
100
+ .datepicker-controls .button:active { border-color: var(--c-neutral-500); color: var(--c-neutral-700); }
101
+ .datepicker-header .datepicker-controls .button:hover { background-color: var(--c-neutral-100); }
102
+ .datepicker-header .datepicker-controls .button:active { background-color: var(--c-neutral-100); }
103
+
104
+ // Número da semana
105
+ .datepicker-view .week { color: var(--c-neutral-400); }
106
+
107
+ // Células de dia
108
+ .datepicker-cell:not(.disabled):hover { background-color: var(--c-neutral-100); }
109
+ .datepicker-cell.focused:not(.selected) { background-color: var(--c-neutral-200); }
110
+ .datepicker-cell.selected,
111
+ .datepicker-cell.selected:hover { background-color: var(--c-primary-300); color: var(--c-primary-500); }
112
+ .datepicker-cell.disabled { color: var(--c-neutral-400); }
113
+ .datepicker-cell.next:not(.disabled),
114
+ .datepicker-cell.prev:not(.disabled) { color: var(--c-neutral-500); }
115
+ .datepicker-cell.next.selected,
116
+ .datepicker-cell.prev.selected { color: var(--c-primary-500); }
117
+
118
+ // Fins de semana destacados (daysOfWeekHighlighted [0,6])
119
+ .datepicker-cell.highlighted:not(.selected):not(.range):not(.today) { background-color: var(--c-neutral-100); }
120
+ .datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover { background-color: var(--c-neutral-200); }
121
+ .datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused { background-color: var(--c-neutral-200); }
122
+
123
+ // Hoje
124
+ .datepicker-cell.today:not(.selected) { background-color: var(--c-primary-400); }
125
+ .datepicker-cell.today:not(.selected):not(.disabled) { color: var(--c-neutral-900); }
126
+ .datepicker-cell.today.focused:not(.selected) { background-color: var(--c-primary-400); }
127
+
128
+ // Range (seleção de intervalo / múltiplas datas)
129
+ .datepicker-cell.range-end:not(.selected),
130
+ .datepicker-cell.range-start:not(.selected) { background-color: var(--c-neutral-400); color: var(--c-neutral-900); }
131
+ .datepicker-cell.range-end.focused:not(.selected),
132
+ .datepicker-cell.range-start.focused:not(.selected) { background-color: var(--c-neutral-500); }
133
+ .datepicker-cell.range { background-color: var(--c-neutral-300); }
134
+ .datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover { background-color: var(--c-neutral-200); }
135
+ .datepicker-cell.range.disabled { color: var(--c-neutral-500); }
136
+ .datepicker-cell.range.focused { background-color: var(--c-neutral-300); }
137
+
138
+ // Input em edição
139
+ .datepicker-input.in-edit { border-color: var(--c-primary-500); }
140
+ }