slexkit 0.2.0 → 0.3.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 (94) hide show
  1. package/CHANGELOG.md +52 -0
  2. package/LICENSE +21 -21
  3. package/dist/ai/llms-authoring.txt +2 -0
  4. package/dist/ai/llms-capabilities.txt +126 -0
  5. package/dist/ai/llms-components.txt +27 -6
  6. package/dist/ai/llms-full.txt +1729 -4
  7. package/dist/ai/llms-runtime.txt +7 -1
  8. package/dist/ai/llms.txt +22 -1
  9. package/dist/ai/slexkit-ai-manifest.json +674 -23
  10. package/dist/base.css +359 -359
  11. package/dist/chunks/{accordion-cfjyxw93.js → button-53ccjq5p.js} +11 -11
  12. package/dist/chunks/{accordion-nw12ytps.js → button-cr1fhsa7.js} +48 -2
  13. package/dist/chunks/{accordion-5f0nvjjm.js → button-dsftwzvg.js} +4 -3
  14. package/dist/chunks/{accordion-hzyrngd6.js → button-faf563xf.js} +2 -2
  15. package/dist/chunks/{accordion-ehnhpeca.js → button-jxv4c65t.js} +2 -2
  16. package/dist/chunks/{accordion-cw5r75jm.js → button-xv2dz7vn.js} +1 -1
  17. package/dist/chunks/{accordion-830dw78f.js → button-z5yv24ks.js} +2 -2
  18. package/dist/components/accordion.js +2 -2
  19. package/dist/components/badge.js +2 -2
  20. package/dist/components/button.css +101 -101
  21. package/dist/components/button.js +3 -3
  22. package/dist/components/callout.js +4 -4
  23. package/dist/components/card.js +2 -2
  24. package/dist/components/checkbox.js +2 -2
  25. package/dist/components/choice.css +151 -151
  26. package/dist/components/code-block.js +2 -2
  27. package/dist/components/collapsible.js +2 -2
  28. package/dist/components/column.js +1 -1
  29. package/dist/components/content.css +273 -250
  30. package/dist/components/divider.js +2 -2
  31. package/dist/components/grid.js +1 -1
  32. package/dist/components/index.js +13945 -26
  33. package/dist/components/input.css +777 -777
  34. package/dist/components/input.js +8 -8
  35. package/dist/components/link.js +2 -2
  36. package/dist/components/progress.js +2 -2
  37. package/dist/components/radio-group.js +2 -2
  38. package/dist/components/row.js +1 -1
  39. package/dist/components/section.js +2 -2
  40. package/dist/components/select.css +178 -178
  41. package/dist/components/select.js +3 -3
  42. package/dist/components/slider.css +116 -116
  43. package/dist/components/slider.js +2 -2
  44. package/dist/components/specs.js +32 -0
  45. package/dist/components/stat.js +2 -2
  46. package/dist/components/submit.css +8 -8
  47. package/dist/components/submit.js +1 -1
  48. package/dist/components/switch.css +105 -105
  49. package/dist/components/switch.js +3 -3
  50. package/dist/components/table.js +4 -4
  51. package/dist/components/tabs.css +95 -95
  52. package/dist/components/tabs.js +4 -4
  53. package/dist/components/text-input.css +23 -23
  54. package/dist/components/text.js +1 -1
  55. package/dist/components/toast.js +4 -4
  56. package/dist/components/tooling.js +73 -8
  57. package/dist/runtime.cjs +1590 -14
  58. package/dist/runtime.js +1589 -13
  59. package/dist/slexkit.cjs +28254 -13848
  60. package/dist/slexkit.css +1538 -1515
  61. package/dist/slexkit.js +28253 -13847
  62. package/dist/tooling.js +117 -11
  63. package/dist/types/components/svelte/helpers.d.ts +8 -1
  64. package/dist/types/engine/capabilities.d.ts +54 -0
  65. package/dist/types/engine/index.d.ts +6 -0
  66. package/dist/types/engine/secure-runtime.d.ts +9 -1
  67. package/dist/types/engine/stdlib.d.ts +30 -0
  68. package/dist/types/engine/types.d.ts +1 -0
  69. package/dist/types/engine/validation.d.ts +28 -0
  70. package/dist/types/index.d.ts +6 -3
  71. package/dist/types/runtime.d.ts +6 -3
  72. package/dist/types/version.d.ts +2 -2
  73. package/dist/umd/slexkit.tooling.umd.js +45016 -44626
  74. package/dist/umd/slexkit.umd.js +28255 -13849
  75. package/package.json +3 -2
  76. package/src/components/svelte/content/Formula.svelte +27 -0
  77. package/src/components/svelte/content/Table.svelte +1 -1
  78. package/src/components/svelte/helpers.ts +56 -1
  79. package/src/components/svelte/input/Input.svelte +7 -7
  80. package/src/components/svelte/input/Select.svelte +2 -2
  81. package/src/components/svelte/input/Switch.svelte +1 -1
  82. package/src/components/svelte/input/Tabs.svelte +7 -7
  83. package/src/components/svelte/tooling/PlaygroundMarkdown.svelte +84 -2
  84. package/src/styles/components/button.css +101 -101
  85. package/src/styles/components/choice.css +152 -152
  86. package/src/styles/components/select.css +178 -178
  87. package/src/styles/components/slider.css +116 -116
  88. package/src/styles/components/submit.css +8 -8
  89. package/src/styles/components/switch.css +105 -105
  90. package/src/styles/components/tabs.css +95 -95
  91. package/src/styles/components/text-input.css +23 -23
  92. package/src/styles/content.css +274 -251
  93. package/src/styles/input.css +8 -8
  94. package/src/styles/layout.css +360 -360
@@ -25,7 +25,7 @@ import {
25
25
  text1 as text,
26
26
  user_derived,
27
27
  user_effect
28
- } from "../chunks/accordion-nw12ytps.js";
28
+ } from "../chunks/button-cr1fhsa7.js";
29
29
 
30
30
  // src/components/entries/input.ts
31
31
  import { register } from "../runtime.js";
@@ -117,7 +117,7 @@ function parseEngineeringNumber(input) {
117
117
  var nextInputId = 0;
118
118
  var root_1 = from_html(`<label class="slex-input-label"> </label>`);
119
119
  var root_2 = from_html(`<span class="slex-input-unit" aria-hidden="true"> </span>`);
120
- var root_3 = from_html(`<span class="slex-input-controls"><button class="slex-input-step" type="button">-</button> <button class="slex-input-step" type="button">+</button></span>`);
120
+ var root_3 = from_html(`<span class="slex-input-controls"><button class="slex-input-step" type="button">+</button> <button class="slex-input-step" type="button">-</button></span>`);
121
121
  var root_4 = from_html(`<div class="slex-input-description"> </div>`);
122
122
  var root_5 = from_html(`<div class="slex-input-error" role="alert"> </div>`);
123
123
  var root = from_html(`<div class="slex-input-field"><!> <div class="slex-input-control"><input class="slex-input"/> <!> <!></div> <!> <!></div>`);
@@ -289,13 +289,13 @@ function Input($$anchor, $$props) {
289
289
  var button_1 = sibling(button, 2);
290
290
  reset(span_1);
291
291
  template_effect(() => {
292
- set_attribute(button, "aria-label", `Decrease ${get(controlLabel)}`);
293
- button.disabled = get(decrementDisabled);
294
- set_attribute(button_1, "aria-label", `Increase ${get(controlLabel)}`);
295
- button_1.disabled = get(incrementDisabled);
292
+ set_attribute(button, "aria-label", `Increase ${get(controlLabel)}`);
293
+ button.disabled = get(incrementDisabled);
294
+ set_attribute(button_1, "aria-label", `Decrease ${get(controlLabel)}`);
295
+ button_1.disabled = get(decrementDisabled);
296
296
  });
297
- delegated("click", button, () => stepBy(-1));
298
- delegated("click", button_1, () => stepBy(1));
297
+ delegated("click", button, () => stepBy(1));
298
+ delegated("click", button_1, () => stepBy(-1));
299
299
  append($$anchor2, span_1);
300
300
  };
301
301
  if_block(node_2, ($$render) => {
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InlineIcon
3
- } from "../chunks/accordion-cw5r75jm.js";
3
+ } from "../chunks/button-xv2dz7vn.js";
4
4
  import {
5
5
  append,
6
6
  bindPropStore,
@@ -21,7 +21,7 @@ import {
21
21
  template_effect,
22
22
  text1 as text,
23
23
  user_effect
24
- } from "../chunks/accordion-nw12ytps.js";
24
+ } from "../chunks/button-cr1fhsa7.js";
25
25
 
26
26
  // src/components/entries/link.ts
27
27
  import { register } from "../runtime.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InlineIcon
3
- } from "../chunks/accordion-cw5r75jm.js";
3
+ } from "../chunks/button-xv2dz7vn.js";
4
4
  import {
5
5
  append,
6
6
  bindPropStore,
@@ -22,7 +22,7 @@ import {
22
22
  template_effect,
23
23
  text1 as text,
24
24
  user_effect
25
- } from "../chunks/accordion-nw12ytps.js";
25
+ } from "../chunks/button-cr1fhsa7.js";
26
26
 
27
27
  // src/components/entries/progress.ts
28
28
  import { register } from "../runtime.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InlineIcon
3
- } from "../chunks/accordion-cw5r75jm.js";
3
+ } from "../chunks/button-xv2dz7vn.js";
4
4
  import {
5
5
  append,
6
6
  bindPropStore,
@@ -31,7 +31,7 @@ import {
31
31
  text1 as text,
32
32
  user_derived,
33
33
  user_effect
34
- } from "../chunks/accordion-nw12ytps.js";
34
+ } from "../chunks/button-cr1fhsa7.js";
35
35
 
36
36
  // src/components/entries/radio-group.ts
37
37
  import { register } from "../runtime.js";
@@ -17,7 +17,7 @@ import {
17
17
  template_effect,
18
18
  text1 as text,
19
19
  user_effect
20
- } from "../chunks/accordion-nw12ytps.js";
20
+ } from "../chunks/button-cr1fhsa7.js";
21
21
 
22
22
  // src/components/entries/row.ts
23
23
  import { register } from "../runtime.js";
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InlineIcon
3
- } from "../chunks/accordion-cw5r75jm.js";
3
+ } from "../chunks/button-xv2dz7vn.js";
4
4
  import {
5
5
  action,
6
6
  append,
@@ -23,7 +23,7 @@ import {
23
23
  template_effect,
24
24
  text1 as text,
25
25
  user_effect
26
- } from "../chunks/accordion-nw12ytps.js";
26
+ } from "../chunks/button-cr1fhsa7.js";
27
27
 
28
28
  // src/components/entries/section.ts
29
29
  import { register } from "../runtime.js";
@@ -1,130 +1,130 @@
1
- .slex-select {
2
- position: relative;
3
- display: flex;
4
- width: 100%;
5
- min-width: 0;
6
- flex-direction: column;
7
- gap: 0.5rem;
8
- }
9
-
1
+ .slex-select {
2
+ position: relative;
3
+ display: flex;
4
+ width: 100%;
5
+ min-width: 0;
6
+ flex-direction: column;
7
+ gap: 0.5rem;
8
+ }
9
+
10
10
  .slex-select-label {
11
11
  display: inline-flex;
12
12
  align-items: center;
13
13
  gap: 0.375rem;
14
14
  min-width: 0;
15
15
  color: var(--foreground);
16
- font-size: 0.875rem;
17
- font-weight: 500;
18
- line-height: 1;
19
- }
20
-
21
- .slex-select-control {
22
- width: 100%;
23
- min-width: 0;
24
- }
25
-
26
- .slex-select .slex-select-trigger {
27
- box-sizing: border-box;
28
- display: flex;
29
- align-items: center;
30
- justify-content: space-between;
31
- gap: 0.75rem;
32
- width: 100%;
33
- min-width: 0;
34
- min-height: 2.5rem;
35
- margin: 0;
16
+ font-size: 0.875rem;
17
+ font-weight: 500;
18
+ line-height: 1;
19
+ }
20
+
21
+ .slex-select-control {
22
+ width: 100%;
23
+ min-width: 0;
24
+ }
25
+
26
+ .slex-select .slex-select-trigger {
27
+ box-sizing: border-box;
28
+ display: flex;
29
+ align-items: center;
30
+ justify-content: space-between;
31
+ gap: 0.75rem;
32
+ width: 100%;
33
+ min-width: 0;
34
+ min-height: 2.5rem;
35
+ margin: 0;
36
36
  padding: 0.5rem 1rem;
37
- border: 1px solid var(--input);
38
- border-radius: var(--radius);
39
- background: var(--background);
40
- color: var(--foreground);
41
- font: inherit;
42
- font-size: 0.875rem;
43
- line-height: 1.25rem;
44
- outline: none;
45
- box-shadow: 0 1px 2px color-mix(in oklab, var(--foreground) 8%, transparent);
46
- cursor: pointer;
47
- transition:
48
- border-color 150ms ease,
49
- background-color 150ms ease,
50
- box-shadow 150ms ease,
51
- color 150ms ease;
52
- appearance: none;
53
- text-align: left;
54
- }
55
-
56
- .slex-select .slex-select-trigger:hover:not(:disabled) {
57
- background: color-mix(in oklab, var(--accent) 34%, var(--background));
58
- }
59
-
60
- .slex-select .slex-select-trigger:focus-visible {
61
- border-color: var(--ring);
62
- box-shadow: 0 0 0 2px color-mix(in oklab, var(--ring) 20%, transparent);
63
- }
64
-
65
- .slex-select .slex-select-trigger:disabled {
66
- cursor: not-allowed;
67
- opacity: 0.5;
68
- }
69
-
37
+ border: 1px solid var(--input);
38
+ border-radius: var(--radius);
39
+ background: var(--background);
40
+ color: var(--foreground);
41
+ font: inherit;
42
+ font-size: 0.875rem;
43
+ line-height: 1.25rem;
44
+ outline: none;
45
+ box-shadow: 0 1px 2px color-mix(in oklab, var(--foreground) 8%, transparent);
46
+ cursor: pointer;
47
+ transition:
48
+ border-color 150ms ease,
49
+ background-color 150ms ease,
50
+ box-shadow 150ms ease,
51
+ color 150ms ease;
52
+ appearance: none;
53
+ text-align: left;
54
+ }
55
+
56
+ .slex-select .slex-select-trigger:hover:not(:disabled) {
57
+ background: color-mix(in oklab, var(--accent) 34%, var(--background));
58
+ }
59
+
60
+ .slex-select .slex-select-trigger:focus-visible {
61
+ border-color: var(--ring);
62
+ box-shadow: 0 0 0 2px color-mix(in oklab, var(--ring) 20%, transparent);
63
+ }
64
+
65
+ .slex-select .slex-select-trigger:disabled {
66
+ cursor: not-allowed;
67
+ opacity: 0.5;
68
+ }
69
+
70
70
  .slex-select-value {
71
71
  display: inline-flex;
72
72
  align-items: center;
73
73
  gap: 0.375rem;
74
74
  min-width: 0;
75
75
  overflow: hidden;
76
- text-overflow: ellipsis;
77
- white-space: nowrap;
78
- }
79
-
80
- .slex-select-value[data-placeholder] {
81
- color: var(--muted-foreground);
82
- }
83
-
84
- .slex-select-icon {
85
- position: relative;
86
- flex: 0 0 auto;
87
- width: 0.75rem;
88
- height: 0.75rem;
89
- opacity: 0.72;
90
- }
91
-
92
- .slex-select-icon::before {
93
- position: absolute;
94
- top: 0.2rem;
95
- left: 0.125rem;
96
- width: 0.45rem;
97
- height: 0.45rem;
98
- border-right: 1.5px solid currentColor;
99
- border-bottom: 1.5px solid currentColor;
100
- content: "";
101
- transform: rotate(45deg);
102
- }
103
-
104
- .slex-select-native {
105
- position: absolute;
106
- width: 1px;
107
- height: 1px;
108
- margin: -1px;
109
- padding: 0;
110
- border: 0;
111
- overflow: hidden;
112
- clip: rect(0 0 0 0);
113
- clip-path: inset(50%);
114
- white-space: nowrap;
115
- }
116
-
117
- .slex-select-menu {
118
- position: absolute;
119
- z-index: 40;
120
- top: calc(100% + 0.375rem);
121
- left: 0;
122
- right: 0;
123
- width: 100%;
124
- max-height: 14rem;
125
- margin: 0;
126
- padding: 0.25rem;
127
- overflow-y: auto;
76
+ text-overflow: ellipsis;
77
+ white-space: nowrap;
78
+ }
79
+
80
+ .slex-select-value[data-placeholder] {
81
+ color: var(--muted-foreground);
82
+ }
83
+
84
+ .slex-select-icon {
85
+ position: relative;
86
+ flex: 0 0 auto;
87
+ width: 0.75rem;
88
+ height: 0.75rem;
89
+ opacity: 0.72;
90
+ }
91
+
92
+ .slex-select-icon::before {
93
+ position: absolute;
94
+ top: 0.2rem;
95
+ left: 0.125rem;
96
+ width: 0.45rem;
97
+ height: 0.45rem;
98
+ border-right: 1.5px solid currentColor;
99
+ border-bottom: 1.5px solid currentColor;
100
+ content: "";
101
+ transform: rotate(45deg);
102
+ }
103
+
104
+ .slex-select-native {
105
+ position: absolute;
106
+ width: 1px;
107
+ height: 1px;
108
+ margin: -1px;
109
+ padding: 0;
110
+ border: 0;
111
+ overflow: hidden;
112
+ clip: rect(0 0 0 0);
113
+ clip-path: inset(50%);
114
+ white-space: nowrap;
115
+ }
116
+
117
+ .slex-select-menu {
118
+ position: absolute;
119
+ z-index: 40;
120
+ top: calc(100% + 0.375rem);
121
+ left: 0;
122
+ right: 0;
123
+ width: 100%;
124
+ max-height: 14rem;
125
+ margin: 0;
126
+ padding: 0.25rem;
127
+ overflow-y: auto;
128
128
  border: 1px solid color-mix(in oklab, var(--border) 82%, transparent);
129
129
  border-radius: var(--radius);
130
130
  background: var(--popover, var(--background));
@@ -136,23 +136,23 @@
136
136
  );
137
137
  list-style: none;
138
138
  }
139
-
140
- .slexkit-root .slex-select-menu {
141
- margin: 0;
142
- padding: 0.25rem;
143
- list-style: none;
144
- }
145
-
139
+
140
+ .slexkit-root .slex-select-menu {
141
+ margin: 0;
142
+ padding: 0.25rem;
143
+ list-style: none;
144
+ }
145
+
146
146
  .slexkit-root .slex-select-menu li {
147
147
  margin: 0;
148
148
  list-style: none;
149
149
  }
150
-
151
- .slex-select-option {
152
- display: flex;
153
- align-items: center;
154
- justify-content: space-between;
155
- gap: 0.75rem;
150
+
151
+ .slex-select-option {
152
+ display: flex;
153
+ align-items: center;
154
+ justify-content: space-between;
155
+ gap: 0.75rem;
156
156
  min-height: 2rem;
157
157
  padding: 0.5rem 0.75rem;
158
158
  border-radius: calc(var(--radius) - 2px);
@@ -160,9 +160,9 @@
160
160
  font-size: 0.875rem;
161
161
  line-height: 1.25rem;
162
162
  cursor: pointer;
163
- user-select: none;
164
- }
165
-
163
+ user-select: none;
164
+ }
165
+
166
166
  .slex-select-option:hover:not([data-disabled]),
167
167
  .slex-select-option--active:not([data-disabled]) {
168
168
  background: var(--accent);
@@ -173,27 +173,27 @@
173
173
  background: transparent;
174
174
  color: var(--popover-foreground, var(--foreground));
175
175
  }
176
-
177
- .slex-select-option--selected {
178
- font-weight: 500;
179
- }
180
-
181
- .slex-select-option[data-disabled] {
182
- color: var(--muted-foreground);
183
- cursor: not-allowed;
184
- opacity: 0.52;
185
- }
186
-
176
+
177
+ .slex-select-option--selected {
178
+ font-weight: 500;
179
+ }
180
+
181
+ .slex-select-option[data-disabled] {
182
+ color: var(--muted-foreground);
183
+ cursor: not-allowed;
184
+ opacity: 0.52;
185
+ }
186
+
187
187
  .slex-select-option-label {
188
188
  display: inline-flex;
189
189
  align-items: center;
190
190
  gap: 0.375rem;
191
191
  min-width: 0;
192
- overflow: hidden;
193
- text-overflow: ellipsis;
194
- white-space: nowrap;
195
- }
196
-
192
+ overflow: hidden;
193
+ text-overflow: ellipsis;
194
+ white-space: nowrap;
195
+ }
196
+
197
197
  .slex-select-check {
198
198
  position: relative;
199
199
  flex: 0 0 auto;
@@ -213,35 +213,35 @@
213
213
  content: "";
214
214
  transform: rotate(-45deg);
215
215
  }
216
-
217
- .slex-select[data-variant="toolbar"] {
218
- height: 100%;
219
- gap: 0;
220
- }
221
-
222
- .slex-select[data-variant="toolbar"] .slex-select-trigger {
223
- height: var(--slex-control-height, 2.25rem);
224
- min-height: 0;
225
- border-width: 0 1px 0 0;
226
- border-color: color-mix(in oklab, var(--border) 58%, transparent);
227
- border-radius: 0;
228
- background: transparent;
229
- padding: 0 0.75rem 0 0.875rem;
230
- font-size: 0.8125rem;
231
- line-height: 1;
232
- box-shadow: none;
233
- }
234
-
235
- .slex-select[data-variant="toolbar"] .slex-select-trigger:hover:not(:disabled) {
236
- background: color-mix(in oklab, var(--muted) 36%, var(--background));
237
- }
238
-
239
- .slex-select[data-variant="toolbar"] .slex-select-menu {
240
- top: calc(100% + 0.25rem);
241
- left: 0;
242
- right: auto;
243
- width: 100%;
244
- min-width: 100%;
216
+
217
+ .slex-select[data-variant="toolbar"] {
218
+ height: 100%;
219
+ gap: 0;
220
+ }
221
+
222
+ .slex-select[data-variant="toolbar"] .slex-select-trigger {
223
+ height: var(--slex-control-height, 2.25rem);
224
+ min-height: 0;
225
+ border-width: 0 1px 0 0;
226
+ border-color: color-mix(in oklab, var(--border) 58%, transparent);
227
+ border-radius: 0;
228
+ background: transparent;
229
+ padding: 0 0.75rem 0 0.875rem;
230
+ font-size: 0.8125rem;
231
+ line-height: 1;
232
+ box-shadow: none;
233
+ }
234
+
235
+ .slex-select[data-variant="toolbar"] .slex-select-trigger:hover:not(:disabled) {
236
+ background: color-mix(in oklab, var(--muted) 36%, var(--background));
237
+ }
238
+
239
+ .slex-select[data-variant="toolbar"] .slex-select-menu {
240
+ top: calc(100% + 0.25rem);
241
+ left: 0;
242
+ right: auto;
243
+ width: 100%;
244
+ min-width: 100%;
245
245
  border-color: color-mix(in oklab, var(--border) 76%, transparent);
246
246
  border-radius: calc(var(--radius) - 2px);
247
247
  padding: 0.25rem;
@@ -251,9 +251,9 @@
251
251
  0 1px 3px rgb(0 0 0 / 0.06)
252
252
  );
253
253
  }
254
-
255
- .slex-select[data-variant="toolbar"] .slex-select-option {
256
- height: 1.875rem;
254
+
255
+ .slex-select[data-variant="toolbar"] .slex-select-option {
256
+ height: 1.875rem;
257
257
  border-radius: calc(var(--radius) - 4px);
258
258
  font-size: 0.8125rem;
259
259
  padding-inline: 0.75rem;
@@ -1,10 +1,10 @@
1
1
  import {
2
2
  Select
3
- } from "../chunks/accordion-5f0nvjjm.js";
4
- import"../chunks/accordion-cw5r75jm.js";
3
+ } from "../chunks/button-dsftwzvg.js";
4
+ import"../chunks/button-xv2dz7vn.js";
5
5
  import {
6
6
  createSvelteRenderer
7
- } from "../chunks/accordion-nw12ytps.js";
7
+ } from "../chunks/button-cr1fhsa7.js";
8
8
 
9
9
  // src/components/entries/select.ts
10
10
  import { register } from "../runtime.js";