@poveste/controls 0.19.1 → 0.21.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (15) hide show
  1. package/dist/{useKbd-DQM4Oqri.es.js → FieldRoot-BOFK7006.es.js} +13 -3
  2. package/dist/{HstColor-DHgxKTkm.es.js → HstColor-BnPyFVL_.es.js} +54 -54
  3. package/dist/{HstDate-Ct5Jp_ZD.es.js → HstDate-CFGLzzai.es.js} +1401 -1235
  4. package/dist/{HstJson-D83KEa9o.es.js → HstJson-CClJDodg.es.js} +2310 -2298
  5. package/dist/{HstWrapper-Bm5H3_to.es.js → HstWrapper-CpSNPVQJ.es.js} +487 -471
  6. package/dist/{PopoverTrigger-BVAfE9fE.es.js → PopoverTrigger-Cu3v0RQ6.es.js} +158 -144
  7. package/dist/THIRD_PARTY_NOTICES.md +3 -3
  8. package/dist/{VisuallyHiddenInput-0it-_FH2.es.js → VisuallyHiddenInput-o7pCu1YG.es.js} +11 -11
  9. package/dist/components/HstCopyIcon.vue.d.ts +4 -0
  10. package/dist/index.d.ts +4 -0
  11. package/dist/index.es.css +1 -1
  12. package/dist/index.es.js +721 -608
  13. package/dist/style-standalone.css +36 -262
  14. package/dist/{useLocale-Dr4PRYn1.es.js → useLocale-Cgl4bY7N.es.js} +3 -3
  15. package/package.json +16 -16
package/dist/style-standalone.css CHANGED
@@ -3,35 +3,14 @@
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
5
5
  :root, :host {
6
- --color-orange-500: oklch(70.5% 0.213 47.604);
7
- --color-gray-50: var(--_poveste-color-gray-50, #fafafa);
8
6
  --color-gray-100: var(--_poveste-color-gray-100, #f4f4f5);
9
7
  --color-gray-200: var(--_poveste-color-gray-200, #e4e4e7);
10
- --color-gray-400: var(--_poveste-color-gray-400, #a1a1aa);
11
8
  --color-gray-500: var(--_poveste-color-gray-500, #71717a);
12
- --color-gray-600: var(--_poveste-color-gray-600, #52525b);
13
9
  --color-gray-700: var(--_poveste-color-gray-700, #3f3f46);
14
- --color-gray-900: var(--_poveste-color-gray-900, #18181b);
15
- --color-black: #000;
16
- --color-white: #fff;
17
- --spacing: 0.25rem;
18
- --text-xs: 0.75rem;
19
- --text-xs--line-height: calc(1 / 0.75);
20
- --text-5xl: 3rem;
21
- --text-5xl--line-height: 1;
22
- --radius-sm: 0.25rem;
23
10
  --default-transition-duration: 150ms;
24
11
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
25
12
  --radius: 0.375rem;
26
- --color-primary-100: var(--_poveste-color-primary-100, #d1fae5);
27
- --color-primary-200: var(--_poveste-color-primary-200, #a7f3d0);
28
13
  --color-primary-500: var(--_poveste-color-primary-500, #10b981);
29
- --color-primary-600: var(--_poveste-color-primary-600, #059669);
30
- --color-primary-700: var(--_poveste-color-primary-700, #047857);
31
- --color-primary-800: var(--_poveste-color-primary-800, #065f46);
32
- --color-primary-900: var(--_poveste-color-primary-900, #064e3b);
33
- --color-gray-750: var(--_poveste-color-gray-750, #323238);
34
- --color-gray-850: var(--_poveste-color-gray-850, #1f1f21);
35
14
  }
36
15
  }
37
16
  @layer utilities {
@@ -41,30 +20,6 @@
41
20
  .fixed {
42
21
  position: fixed;
43
22
  }
44
- .relative {
45
- position: relative;
46
- }
47
- .m-4 {
48
- margin: calc(var(--spacing) * 4);
49
- }
50
- .mx-4 {
51
- margin-inline: calc(var(--spacing) * 4);
52
- }
53
- .-my-1 {
54
- margin-block: calc(var(--spacing) * -1);
55
- }
56
- .my-0 {
57
- margin-block: 0px;
58
- }
59
- .my-8 {
60
- margin-block: calc(var(--spacing) * 8);
61
- }
62
- .mb-2 {
63
- margin-bottom: calc(var(--spacing) * 2);
64
- }
65
- .box-border {
66
- box-sizing: border-box;
67
- }
68
23
  .block {
69
24
  display: block;
70
25
  }
@@ -77,54 +32,15 @@
77
32
  .hidden {
78
33
  display: none;
79
34
  }
80
- .h-4 {
81
- height: calc(var(--spacing) * 4);
82
- }
83
- .h-16 {
84
- height: calc(var(--spacing) * 16);
85
- }
86
- .h-20 {
87
- height: calc(var(--spacing) * 20);
88
- }
89
- .h-32 {
90
- height: calc(var(--spacing) * 32);
91
- }
92
- .h-48 {
93
- height: calc(var(--spacing) * 48);
94
- }
95
- .h-\[100px\] {
96
- height: 100px;
97
- }
98
- .min-h-32 {
99
- min-height: calc(var(--spacing) * 32);
100
- }
101
- .w-4 {
102
- width: calc(var(--spacing) * 4);
103
- }
104
- .w-16 {
105
- width: calc(var(--spacing) * 16);
106
- }
107
- .w-28 {
108
- width: calc(var(--spacing) * 28);
109
- }
110
- .w-32 {
111
- width: calc(var(--spacing) * 32);
112
- }
113
- .w-full {
114
- width: 100%;
115
- }
116
35
  .max-w-full {
117
36
  max-width: 100%;
118
37
  }
119
38
  .flex-none {
120
39
  flex: none;
121
40
  }
122
- .shrink {
41
+ .flex-shrink {
123
42
  flex-shrink: 1;
124
43
  }
125
- .shrink-0 {
126
- flex-shrink: 0;
127
- }
128
44
  .flex-grow {
129
45
  flex-grow: 1;
130
46
  }
@@ -137,158 +53,31 @@
137
53
  .transform {
138
54
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
139
55
  }
140
- .cursor-pointer {
141
- cursor: pointer;
142
- }
143
- .cursor-text {
144
- cursor: text;
145
- }
146
56
  .resize {
147
57
  resize: both;
148
58
  }
149
- .resize-y {
150
- resize: vertical;
151
- }
152
- .grid-cols-\[repeat\(auto-fill\,minmax\(200px\,1fr\)\)\] {
153
- grid-template-columns: repeat(auto-fill,minmax(200px,1fr));
154
- }
155
- .flex-col {
156
- flex-direction: column;
157
- }
158
- .flex-row {
159
- flex-direction: row;
160
- }
161
59
  .flex-wrap {
162
60
  flex-wrap: wrap;
163
61
  }
164
- .items-center {
165
- align-items: center;
166
- }
167
- .items-end {
168
- align-items: flex-end;
169
- }
170
- .gap-1 {
171
- gap: var(--spacing);
172
- }
173
- .gap-2 {
174
- gap: calc(var(--spacing) * 2);
175
- }
176
- .gap-4 {
177
- gap: calc(var(--spacing) * 4);
178
- }
179
- .truncate {
180
- overflow: hidden;
181
- text-overflow: ellipsis;
182
- white-space: nowrap;
183
- }
184
- .overflow-auto {
185
- overflow: auto;
186
- }
187
62
  .overflow-hidden {
188
63
  overflow: hidden;
189
64
  }
190
65
  .rounded {
191
66
  border-radius: var(--radius);
192
67
  }
193
- .rounded-full {
194
- border-radius: calc(infinity * 1px);
195
- }
196
- .rounded-sm {
197
- border-radius: var(--radius-sm);
198
- }
199
68
  .border {
200
69
  border-style: var(--tw-border-style);
201
70
  border-width: 1px;
202
71
  }
203
- .border-0 {
204
- border-style: var(--tw-border-style);
205
- border-width: 0px;
206
- }
207
- .border-2 {
208
- border-style: var(--tw-border-style);
209
- border-width: 2px;
210
- }
211
- .border-solid {
212
- --tw-border-style: solid;
213
- border-style: solid;
214
- }
215
- .border-black\/25 {
216
- border-color: color-mix(in srgb, #000 25%, transparent);
217
- @supports (color: color-mix(in lab, red, red)) {
218
- border-color: color-mix(in oklab, var(--color-black) 25%, transparent);
219
- }
220
- }
221
- .bg-gray-50 {
222
- background-color: var(--color-gray-50);
223
- }
224
72
  .bg-gray-200 {
225
73
  background-color: var(--color-gray-200);
226
74
  }
227
- .bg-gray-500\/10 {
228
- background-color: var(--color-gray-500);
229
- @supports (color: color-mix(in lab, red, red)) {
230
- background-color: color-mix(in oklab, var(--color-gray-500) 10%, transparent);
231
- }
232
- }
233
75
  .bg-gray-500\/20 {
234
76
  background-color: var(--color-gray-500);
235
77
  @supports (color: color-mix(in lab, red, red)) {
236
78
  background-color: color-mix(in oklab, var(--color-gray-500) 20%, transparent);
237
79
  }
238
80
  }
239
- .bg-gray-500\/50 {
240
- background-color: var(--color-gray-500);
241
- @supports (color: color-mix(in lab, red, red)) {
242
- background-color: color-mix(in oklab, var(--color-gray-500) 50%, transparent);
243
- }
244
- }
245
- .bg-transparent {
246
- background-color: transparent;
247
- }
248
- .bg-white {
249
- background-color: var(--color-white);
250
- }
251
- .p-0 {
252
- padding: 0px;
253
- }
254
- .p-2 {
255
- padding: calc(var(--spacing) * 2);
256
- }
257
- .p-4 {
258
- padding: calc(var(--spacing) * 4);
259
- }
260
- .px-2 {
261
- padding-inline: calc(var(--spacing) * 2);
262
- }
263
- .py-1 {
264
- padding-block: var(--spacing);
265
- }
266
- .text-5xl {
267
- font-size: var(--text-5xl);
268
- line-height: var(--tw-leading, var(--text-5xl--line-height));
269
- }
270
- .text-xs {
271
- font-size: var(--text-xs);
272
- line-height: var(--tw-leading, var(--text-xs--line-height));
273
- }
274
- .text-ellipsis {
275
- text-overflow: ellipsis;
276
- }
277
- .whitespace-nowrap {
278
- white-space: nowrap;
279
- }
280
- .text-gray-500 {
281
- color: var(--color-gray-500);
282
- }
283
- .text-inherit {
284
- color: inherit;
285
- }
286
- .text-orange-500 {
287
- color: var(--color-orange-500);
288
- }
289
- .opacity-50 {
290
- opacity: 50%;
291
- }
292
81
  .ring {
293
82
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
294
83
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -310,59 +99,44 @@
310
99
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
311
100
  transition-duration: var(--tw-duration, var(--default-transition-duration));
312
101
  }
313
- .outline-none {
314
- --tw-outline-style: none;
315
- outline-style: none;
316
- }
317
- .focus-within\:border-primary-500:focus-within {
318
- border-color: var(--color-primary-500);
319
- }
320
- @media (hover: hover) {
321
- .hover\:bg-primary-100:hover {
322
- background-color: var(--color-primary-100);
323
- }
324
- .hover\:text-primary-500:hover {
325
- color: var(--color-primary-500);
326
- }
327
- .hover\:opacity-100:hover {
328
- opacity: 100%;
329
- }
330
- }
331
- .focus\:border-primary-500:focus {
332
- border-color: var(--color-primary-500);
333
- }
334
- .focus-visible\:opacity-100:focus-visible {
335
- opacity: 100%;
336
- }
337
- .dark\:border-white\/25:where(.ptw-dark, .ptw-dark *) {
338
- border-color: color-mix(in srgb, #fff 25%, transparent);
339
- @supports (color: color-mix(in lab, red, red)) {
340
- border-color: color-mix(in oklab, var(--color-white) 25%, transparent);
341
- }
342
- }
343
- .dark\:bg-black:where(.ptw-dark, .ptw-dark *) {
344
- background-color: var(--color-black);
345
- }
346
- .dark\:bg-gray-600:where(.ptw-dark, .ptw-dark *) {
347
- background-color: var(--color-gray-600);
348
- }
349
102
  .dark\:bg-gray-700:where(.ptw-dark, .ptw-dark *) {
350
103
  background-color: var(--color-gray-700);
351
104
  }
352
- .dark\:text-gray-400:where(.ptw-dark, .ptw-dark *) {
353
- color: var(--color-gray-400);
354
- }
355
- .dark\:focus-within\:border-primary-500:where(.ptw-dark, .ptw-dark *):focus-within {
356
- border-color: var(--color-primary-500);
357
- }
358
- @media (hover: hover) {
359
- .dark\:hover\:bg-primary-800:where(.ptw-dark, .ptw-dark *):hover {
360
- background-color: var(--color-primary-800);
361
- }
362
- }
363
- .dark\:focus\:border-primary-500:where(.ptw-dark, .ptw-dark *):focus {
364
- border-color: var(--color-primary-500);
365
- }
105
+ }
106
+ :where([class*='poveste-']) {
107
+ --_poveste-primary-50: var(--_poveste-color-primary-50, #ecfdf5);
108
+ --_poveste-primary-100: var(--_poveste-color-primary-100, #d1fae5);
109
+ --_poveste-primary-200: var(--_poveste-color-primary-200, #a7f3d0);
110
+ --_poveste-primary-300: var(--_poveste-color-primary-300, #6ee7b7);
111
+ --_poveste-primary-400: var(--_poveste-color-primary-400, #34d399);
112
+ --_poveste-primary-500: var(--_poveste-color-primary-500, #10b981);
113
+ --_poveste-primary-600: var(--_poveste-color-primary-600, #059669);
114
+ --_poveste-primary-700: var(--_poveste-color-primary-700, #047857);
115
+ --_poveste-primary-800: var(--_poveste-color-primary-800, #065f46);
116
+ --_poveste-primary-900: var(--_poveste-color-primary-900, #064e3b);
117
+ --_poveste-gray-50: var(--_poveste-color-gray-50, #fafafa);
118
+ --_poveste-gray-100: var(--_poveste-color-gray-100, #f4f4f5);
119
+ --_poveste-gray-200: var(--_poveste-color-gray-200, #e4e4e7);
120
+ --_poveste-gray-300: var(--_poveste-color-gray-300, #d4d4d8);
121
+ --_poveste-gray-400: var(--_poveste-color-gray-400, #a1a1aa);
122
+ --_poveste-gray-500: var(--_poveste-color-gray-500, #71717a);
123
+ --_poveste-gray-600: var(--_poveste-color-gray-600, #52525b);
124
+ --_poveste-gray-700: var(--_poveste-color-gray-700, #3f3f46);
125
+ --_poveste-gray-750: var(--_poveste-color-gray-750, #323238);
126
+ --_poveste-gray-800: var(--_poveste-color-gray-800, #27272a);
127
+ --_poveste-gray-850: var(--_poveste-color-gray-850, #1f1f21);
128
+ --_poveste-gray-900: var(--_poveste-color-gray-900, #18181b);
129
+ --_poveste-gray-950: var(--_poveste-color-gray-950, #101012);
130
+ --_poveste-radius-sm: 0.25rem;
131
+ --_poveste-radius: 0.375rem;
132
+ --_poveste-radius-md: 0.5rem;
133
+ --_poveste-radius-lg: 0.75rem;
134
+ --_poveste-radius-xl: 1rem;
135
+ --_poveste-radius-2xl: 1.5rem;
136
+ --_poveste-radius-3xl: 2rem;
137
+ --_poveste-white: #fff;
138
+ --_poveste-black: #000;
139
+ --_poveste-warning: oklch(70.5% .213 47.604);
366
140
  }
367
141
  body {
368
142
  font-size: 1.125rem;
package/dist/{useLocale-Dr4PRYn1.es.js → useLocale-Cgl4bY7N.es.js} RENAMED
@@ -1,6 +1,6 @@
1
- import { E as e } from "./HstWrapper-Bm5H3_to.es.js";
1
+ import { D as e } from "./HstWrapper-CpSNPVQJ.es.js";
2
2
  import { computed as t, ref as n } from "@poveste/vendors/vue";
3
- //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/clamp.js
3
+ //#region ../../node_modules/.pnpm/reka-ui@2.11.0_vue@3.5.44_typescript@6.0.3_/node_modules/reka-ui/dist/shared/clamp.js
4
4
  function r(e, t = -Infinity, n = Infinity) {
5
5
  return Math.min(n, Math.max(t, e));
6
6
  }
@@ -18,7 +18,7 @@ function a(e, t, n, r) {
18
18
  return Number.isNaN(t) ? !Number.isNaN(n) && o > n && (o = Math.floor(i(n / r, r)) * r) : o < t ? o = t : !Number.isNaN(n) && o > n && (o = t + Math.floor(i((n - t) / r, r)) * r), o = i(o, r), o;
19
19
  }
20
20
  //#endregion
21
- //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/useLocale.js
21
+ //#region ../../node_modules/.pnpm/reka-ui@2.11.0_vue@3.5.44_typescript@6.0.3_/node_modules/reka-ui/dist/shared/useLocale.js
22
22
  function o(r) {
23
23
  let i = e({ locale: n("en") });
24
24
  return t(() => r?.value || i.locale?.value || "en");
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@poveste/controls",
3
3
  "type": "module",
4
- "version": "0.19.1",
4
+ "version": "0.21.0",
5
5
  "description": "Prebuilt controls components",
6
6
  "author": {
7
7
  "name": "Sorin Gitlan",
@@ -47,34 +47,34 @@
47
47
  "dependencies": {
48
48
  "@codemirror/commands": "^6.11.1",
49
49
  "@codemirror/lang-json": "^6.0.1",
50
- "@codemirror/language": "^6.12.4",
50
+ "@codemirror/language": "^6.13.1",
51
51
  "@codemirror/lint": "^6.9.7",
52
52
  "@codemirror/state": "^6.7.6",
53
53
  "@codemirror/theme-one-dark": "^6.1.2",
54
- "@codemirror/view": "^6.43.13",
55
- "@poveste/shared": "^0.19.1",
56
- "@poveste/vendors": "^0.19.1"
54
+ "@codemirror/view": "^6.43.14",
55
+ "@poveste/shared": "^0.21.0",
56
+ "@poveste/vendors": "^0.21.0"
57
57
  },
58
58
  "devDependencies": {
59
59
  "@iconify/vue": "^5.0.3",
60
60
  "@internationalized/date": "^3.12.4",
61
61
  "@tailwindcss/cli": "^4.3.3",
62
62
  "@tailwindcss/postcss": "^4.3.3",
63
- "@types/node": "^26.6.3",
64
- "@vitejs/plugin-vue": "^6.0.9",
65
- "@vue/runtime-dom": "^3.5.43",
63
+ "@types/node": "^26.6.5",
64
+ "@vitejs/plugin-vue": "^6.0.10",
65
+ "@vue/runtime-dom": "^3.5.44",
66
66
  "@vue/test-utils": "^2.5.1",
67
67
  "@vueuse/core": "^15.0.0",
68
- "concurrently": "^10.0.5",
69
- "jsdom": "^30.1.1",
70
- "postcss": "^8.5.23",
71
- "reka-ui": "^2.10.5",
68
+ "concurrently": "^10.0.6",
69
+ "jsdom": "^30.1.3",
70
+ "postcss": "^8.5.31",
71
+ "reka-ui": "^2.11.0",
72
72
  "tailwindcss": "^4.3.3",
73
73
  "typescript": "6.0.3",
74
- "vite": "^8.3.1",
75
- "vitest": "^5.0.2",
76
- "vue": "^3.5.43",
77
- "vue-tsc": "^3.3.11"
74
+ "vite": "^8.3.4",
75
+ "vitest": "^5.0.5",
76
+ "vue": "^3.5.44",
77
+ "vue-tsc": "^3.3.13"
78
78
  },
79
79
  "scripts": {
80
80
  "build": "rimraf dist && pnpm run build:css && vite build && pnpm run build:types",