@sondor-technology/sondor-components 1.0.0-1165-initial-setup.11 → 1.0.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 (168) hide show
  1. package/package.json +2 -3
  2. package/src/components/alert/alert.ts +100 -100
  3. package/src/components/badge/badge.ts +96 -96
  4. package/src/components/breadcrumb/breadcrumb.ts +98 -98
  5. package/src/components/button/button.ts +281 -281
  6. package/src/components/button-group/button-group.ts +67 -67
  7. package/src/components/card/card.ts +52 -52
  8. package/src/components/checkbox/checkbox.ts +238 -238
  9. package/src/components/code-block/code-block.ts +256 -256
  10. package/src/components/content-card/content-card.ts +133 -133
  11. package/src/components/divider/divider.ts +68 -68
  12. package/src/components/drawer/drawer.ts +217 -217
  13. package/src/components/field/field.ts +30 -30
  14. package/src/components/footer/footer.ts +58 -58
  15. package/src/components/form/form-step.ts +32 -32
  16. package/src/components/form/form.ts +376 -376
  17. package/src/components/grid/grid-row.ts +75 -75
  18. package/src/components/grid/grid.ts +36 -36
  19. package/src/components/icon/icon-paths.ts +124 -124
  20. package/src/components/icon/icon.ts +82 -82
  21. package/src/components/input/input.ts +248 -248
  22. package/src/components/link/link.ts +97 -97
  23. package/src/components/metadata/metadata.ts +66 -66
  24. package/src/components/modal/modal.ts +158 -158
  25. package/src/components/page-layout/page-layout.ts +704 -704
  26. package/src/components/radio/radio.ts +142 -142
  27. package/src/components/radio-group/radio-group.ts +157 -157
  28. package/src/components/router/router.ts +46 -46
  29. package/src/components/select/select.ts +161 -161
  30. package/src/components/skeleton/skeleton.ts +67 -67
  31. package/src/components/switch/switch.ts +181 -181
  32. package/src/components/table/data-table.ts +556 -556
  33. package/src/components/table/table.ts +153 -153
  34. package/src/components/tabs/tab-panel.ts +30 -30
  35. package/src/components/tabs/tab.ts +76 -76
  36. package/src/components/tabs/tabs.ts +88 -88
  37. package/src/components/textarea/textarea.ts +215 -215
  38. package/src/components/theme-toggle/theme-toggle.ts +131 -131
  39. package/src/components/vertical-nav/vertical-nav-group.ts +96 -96
  40. package/src/components/vertical-nav/vertical-nav-item.ts +49 -49
  41. package/src/styles/globals.css +58 -58
  42. package/src/styles/index.css +80 -80
  43. package/src/styles/reset.ts +50 -50
  44. package/src/styles/theme.css +58 -58
  45. package/src/styles/typography.css +25 -25
  46. package/tsconfig.json +15 -15
  47. package/README.md +0 -8
  48. package/dist/components/alert/alert.d.ts +0 -13
  49. package/dist/components/alert/alert.d.ts.map +0 -1
  50. package/dist/components/alert/alert.js +0 -105
  51. package/dist/components/badge/badge.d.ts +0 -13
  52. package/dist/components/badge/badge.d.ts.map +0 -1
  53. package/dist/components/badge/badge.js +0 -101
  54. package/dist/components/breadcrumb/breadcrumb.d.ts +0 -19
  55. package/dist/components/breadcrumb/breadcrumb.d.ts.map +0 -1
  56. package/dist/components/breadcrumb/breadcrumb.js +0 -99
  57. package/dist/components/button/button.d.ts +0 -23
  58. package/dist/components/button/button.d.ts.map +0 -1
  59. package/dist/components/button/button.js +0 -304
  60. package/dist/components/button-group/button-group.d.ts +0 -6
  61. package/dist/components/button-group/button-group.d.ts.map +0 -1
  62. package/dist/components/button-group/button-group.js +0 -74
  63. package/dist/components/card/card.d.ts +0 -11
  64. package/dist/components/card/card.d.ts.map +0 -1
  65. package/dist/components/card/card.js +0 -54
  66. package/dist/components/checkbox/checkbox.d.ts +0 -28
  67. package/dist/components/checkbox/checkbox.d.ts.map +0 -1
  68. package/dist/components/checkbox/checkbox.js +0 -247
  69. package/dist/components/code-block/code-block.d.ts +0 -20
  70. package/dist/components/code-block/code-block.d.ts.map +0 -1
  71. package/dist/components/code-block/code-block.js +0 -260
  72. package/dist/components/content-card/content-card.d.ts +0 -13
  73. package/dist/components/content-card/content-card.d.ts.map +0 -1
  74. package/dist/components/content-card/content-card.js +0 -140
  75. package/dist/components/divider/divider.d.ts +0 -16
  76. package/dist/components/divider/divider.d.ts.map +0 -1
  77. package/dist/components/divider/divider.js +0 -82
  78. package/dist/components/drawer/drawer.d.ts +0 -22
  79. package/dist/components/drawer/drawer.d.ts.map +0 -1
  80. package/dist/components/drawer/drawer.js +0 -226
  81. package/dist/components/field/field.d.ts +0 -11
  82. package/dist/components/field/field.d.ts.map +0 -1
  83. package/dist/components/field/field.js +0 -32
  84. package/dist/components/footer/footer.d.ts +0 -6
  85. package/dist/components/footer/footer.d.ts.map +0 -1
  86. package/dist/components/footer/footer.js +0 -65
  87. package/dist/components/form/form-step.d.ts +0 -13
  88. package/dist/components/form/form-step.d.ts.map +0 -1
  89. package/dist/components/form/form-step.js +0 -41
  90. package/dist/components/form/form.d.ts +0 -25
  91. package/dist/components/form/form.d.ts.map +0 -1
  92. package/dist/components/form/form.js +0 -358
  93. package/dist/components/grid/grid-row.d.ts +0 -17
  94. package/dist/components/grid/grid-row.d.ts.map +0 -1
  95. package/dist/components/grid/grid-row.js +0 -92
  96. package/dist/components/grid/grid.d.ts +0 -13
  97. package/dist/components/grid/grid.d.ts.map +0 -1
  98. package/dist/components/grid/grid.js +0 -42
  99. package/dist/components/icon/icon-paths.d.ts +0 -116
  100. package/dist/components/icon/icon-paths.d.ts.map +0 -1
  101. package/dist/components/icon/icon-paths.js +0 -121
  102. package/dist/components/icon/icon.d.ts +0 -16
  103. package/dist/components/icon/icon.d.ts.map +0 -1
  104. package/dist/components/icon/icon.js +0 -95
  105. package/dist/components/input/input.d.ts +0 -31
  106. package/dist/components/input/input.d.ts.map +0 -1
  107. package/dist/components/input/input.js +0 -268
  108. package/dist/components/link/link.d.ts +0 -16
  109. package/dist/components/link/link.d.ts.map +0 -1
  110. package/dist/components/link/link.js +0 -116
  111. package/dist/components/metadata/metadata.d.ts +0 -18
  112. package/dist/components/metadata/metadata.d.ts.map +0 -1
  113. package/dist/components/metadata/metadata.js +0 -71
  114. package/dist/components/modal/modal.d.ts +0 -24
  115. package/dist/components/modal/modal.d.ts.map +0 -1
  116. package/dist/components/modal/modal.js +0 -163
  117. package/dist/components/page-layout/page-layout.d.ts +0 -46
  118. package/dist/components/page-layout/page-layout.d.ts.map +0 -1
  119. package/dist/components/page-layout/page-layout.js +0 -697
  120. package/dist/components/radio/radio.d.ts +0 -16
  121. package/dist/components/radio/radio.d.ts.map +0 -1
  122. package/dist/components/radio/radio.js +0 -152
  123. package/dist/components/radio-group/radio-group.d.ts +0 -27
  124. package/dist/components/radio-group/radio-group.d.ts.map +0 -1
  125. package/dist/components/radio-group/radio-group.js +0 -161
  126. package/dist/components/router/router.d.ts +0 -7
  127. package/dist/components/router/router.d.ts.map +0 -1
  128. package/dist/components/router/router.js +0 -37
  129. package/dist/components/select/select.d.ts +0 -16
  130. package/dist/components/select/select.d.ts.map +0 -1
  131. package/dist/components/select/select.js +0 -172
  132. package/dist/components/skeleton/skeleton.d.ts +0 -17
  133. package/dist/components/skeleton/skeleton.d.ts.map +0 -1
  134. package/dist/components/skeleton/skeleton.js +0 -78
  135. package/dist/components/switch/switch.d.ts +0 -25
  136. package/dist/components/switch/switch.d.ts.map +0 -1
  137. package/dist/components/switch/switch.js +0 -185
  138. package/dist/components/table/data-table.d.ts +0 -72
  139. package/dist/components/table/data-table.d.ts.map +0 -1
  140. package/dist/components/table/data-table.js +0 -551
  141. package/dist/components/table/table.d.ts +0 -22
  142. package/dist/components/table/table.d.ts.map +0 -1
  143. package/dist/components/table/table.js +0 -167
  144. package/dist/components/tabs/tab-panel.d.ts +0 -8
  145. package/dist/components/tabs/tab-panel.d.ts.map +0 -1
  146. package/dist/components/tabs/tab-panel.js +0 -46
  147. package/dist/components/tabs/tab.d.ts +0 -9
  148. package/dist/components/tabs/tab.d.ts.map +0 -1
  149. package/dist/components/tabs/tab.js +0 -91
  150. package/dist/components/tabs/tabs.d.ts +0 -14
  151. package/dist/components/tabs/tabs.d.ts.map +0 -1
  152. package/dist/components/tabs/tabs.js +0 -85
  153. package/dist/components/textarea/textarea.d.ts +0 -36
  154. package/dist/components/textarea/textarea.d.ts.map +0 -1
  155. package/dist/components/textarea/textarea.js +0 -231
  156. package/dist/components/theme-toggle/theme-toggle.d.ts +0 -15
  157. package/dist/components/theme-toggle/theme-toggle.d.ts.map +0 -1
  158. package/dist/components/theme-toggle/theme-toggle.js +0 -130
  159. package/dist/components/vertical-nav/vertical-nav-group.d.ts +0 -9
  160. package/dist/components/vertical-nav/vertical-nav-group.d.ts.map +0 -1
  161. package/dist/components/vertical-nav/vertical-nav-group.js +0 -111
  162. package/dist/components/vertical-nav/vertical-nav-item.d.ts +0 -8
  163. package/dist/components/vertical-nav/vertical-nav-item.d.ts.map +0 -1
  164. package/dist/components/vertical-nav/vertical-nav-item.js +0 -65
  165. package/dist/styles/index.css +0 -171
  166. package/dist/styles/reset.d.ts +0 -2
  167. package/dist/styles/reset.d.ts.map +0 -1
  168. package/dist/styles/reset.js +0 -50
@@ -1,25 +0,0 @@
1
- import { LitElement } from "lit";
2
- export type FormLayout = "vertical" | "horizontal" | "inline";
3
- export declare class StForm extends LitElement {
4
- layout: FormLayout;
5
- loading: boolean;
6
- error: string;
7
- private _currentStepIndex;
8
- private _stepElements;
9
- private _formEl;
10
- static styles: import("lit").CSSResult[];
11
- private _handleSlotChange;
12
- private _updateStepVisibility;
13
- private _validateCurrentContext;
14
- private _triggerSubmission;
15
- private _prevStep;
16
- private _extractFormData;
17
- private _handleSubmit;
18
- render(): import("lit-html").TemplateResult<1>;
19
- }
20
- declare global {
21
- interface HTMLElementTagNameMap {
22
- "st-form": StForm;
23
- }
24
- }
25
- //# sourceMappingURL=form.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/form/form.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAY,MAAM,KAAK,CAAC;AAK1C,MAAM,MAAM,UAAU,GAAG,UAAU,GAAG,YAAY,GAAG,QAAQ,CAAC;AAE9D,qBACa,MAAO,SAAQ,UAAU;IACK,MAAM,EAAE,UAAU,CAAc;IAC/B,OAAO,UAAS;IAChC,KAAK,SAAM;IAE5B,OAAO,CAAC,iBAAiB,CAAK;IAGvC,OAAO,CAAC,aAAa,CAAgB;IAEtB,OAAO,CAAC,OAAO,CAAmB;IAEjD,MAAM,CAAC,MAAM,4BA8IX;IAEF,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,uBAAuB;IA8B/B,OAAO,CAAC,kBAAkB;IAK1B,OAAO,CAAC,SAAS;IAOjB,OAAO,CAAC,gBAAgB;IAuCxB,OAAO,CAAC,aAAa;IA4BrB,MAAM,yCAkFL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
@@ -1,358 +0,0 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement, html, css } from "lit";
8
- import { customElement, property, state, queryAssignedElements, query } from "lit/decorators.js";
9
- import { resetStyles } from "../../styles/reset.js";
10
- let StForm = class StForm extends LitElement {
11
- constructor() {
12
- super(...arguments);
13
- this.layout = "vertical";
14
- this.loading = false;
15
- this.error = "";
16
- this._currentStepIndex = 0;
17
- }
18
- _handleSlotChange() {
19
- if (this._stepElements.length > 0) {
20
- this._updateStepVisibility();
21
- }
22
- }
23
- _updateStepVisibility() {
24
- this._stepElements.forEach((step, index) => {
25
- step.active = index === this._currentStepIndex;
26
- });
27
- this.requestUpdate();
28
- }
29
- _validateCurrentContext() {
30
- if (this._stepElements.length === 0) {
31
- return this._formEl.checkValidity();
32
- }
33
- const currentStep = this._stepElements[this._currentStepIndex];
34
- let isValid = true;
35
- // Find all custom and native form inputs assigned to the current step
36
- const inputs = Array.from(currentStep.querySelectorAll("*"));
37
- for (const input of inputs) {
38
- if (typeof input.checkValidity === "function") {
39
- if (!input.checkValidity()) {
40
- // Focus and report on the first invalid element encountered
41
- if (isValid && typeof input.reportValidity === "function") {
42
- input.reportValidity();
43
- }
44
- isValid = false;
45
- }
46
- }
47
- }
48
- return isValid;
49
- }
50
- _triggerSubmission() {
51
- // HTML5 method that triggers form validation and fires the native submit event
52
- this._formEl.requestSubmit();
53
- }
54
- _prevStep() {
55
- if (this._currentStepIndex > 0) {
56
- this._currentStepIndex--;
57
- this._updateStepVisibility();
58
- }
59
- }
60
- _extractFormData() {
61
- const formData = new FormData();
62
- // Query all light-DOM children that have a 'name' attribute
63
- const fields = this.querySelectorAll("[name]");
64
- fields.forEach((field) => {
65
- // Standard HTML form behavior: ignore disabled fields
66
- if (field.hasAttribute("disabled"))
67
- return;
68
- const isToggle = field.tagName === "ST-RADIO" ||
69
- field.tagName === "ST-CHECKBOX" ||
70
- field.getAttribute("type") === "radio" ||
71
- field.getAttribute("type") === "checkbox";
72
- if (isToggle) {
73
- // Only append radios/checkboxes if they are actively checked
74
- if (field.checked) {
75
- formData.append(field.name, field.value || "on");
76
- }
77
- }
78
- else if (field.tagName === "INPUT" &&
79
- field.getAttribute("type") === "file" &&
80
- field.files) {
81
- // Handle native file uploads
82
- Array.from(field.files).forEach((file) => formData.append(field.name, file));
83
- }
84
- else if (field.value !== undefined) {
85
- // Handle st-input, st-select, st-textarea, and standard inputs
86
- formData.append(field.name, field.value);
87
- }
88
- });
89
- return formData;
90
- }
91
- _handleSubmit(e) {
92
- e.preventDefault();
93
- e.stopPropagation();
94
- if (!this._validateCurrentContext())
95
- return;
96
- const hasSteps = this._stepElements.length > 0;
97
- const isLastStep = hasSteps ? this._currentStepIndex === this._stepElements.length - 1 : true;
98
- if (hasSteps && !isLastStep) {
99
- this._currentStepIndex++;
100
- this._updateStepVisibility();
101
- return;
102
- }
103
- // Use our custom extractor to pierce the Shadow DOM boundary
104
- const formData = this._extractFormData();
105
- this.dispatchEvent(new CustomEvent("submit", {
106
- bubbles: true,
107
- composed: true,
108
- cancelable: true,
109
- detail: { formData },
110
- }));
111
- }
112
- render() {
113
- const hasSteps = this._stepElements?.length > 0;
114
- const isLastStep = hasSteps ? this._currentStepIndex === this._stepElements.length - 1 : true;
115
- return html `
116
- <div class="${hasSteps ? "has-steps" : ""}" aria-busy=${this.loading}>
117
- ${this.loading
118
- ? html `
119
- <div class="loading-overlay">
120
- <st-icon name="cloud-download" color="primary"></st-icon> Processing...
121
- </div>
122
- `
123
- : ""}
124
- ${hasSteps
125
- ? html `
126
- <div class="progress-nav" role="tablist">
127
- ${this._stepElements.map((step, index) => {
128
- const isActive = index === this._currentStepIndex;
129
- const isCompleted = index < this._currentStepIndex;
130
- return html `
131
- <div
132
- class="step-indicator ${isActive ? "active" : ""} ${isCompleted
133
- ? "completed"
134
- : ""}"
135
- role="tab"
136
- aria-selected=${isActive}
137
- >
138
- <div class="step-circle">
139
- ${isCompleted
140
- ? html `<st-icon name="check-circle" size="sm"></st-icon>`
141
- : html `${index + 1}`}
142
- </div>
143
- <span>${step.title || `Step ${index + 1}`}</span>
144
- </div>
145
- ${index < this._stepElements.length - 1
146
- ? html ` <div class="step-connector ${isCompleted ? "completed" : ""}"></div> `
147
- : ""}
148
- `;
149
- })}
150
- </div>
151
- `
152
- : ""}
153
- ${this.error
154
- ? html `
155
- <st-alert color="error" style="margin-bottom: var(--st-spacing-lg);">
156
- <st-icon slot="icon" name="alert-triangle"></st-icon>
157
- ${this.error}
158
- </st-alert>
159
- `
160
- : ""}
161
-
162
- <form @submit=${this._handleSubmit}>
163
- <slot @slotchange=${this._handleSlotChange}></slot>
164
-
165
- <div class="form-actions">
166
- ${hasSteps && this._currentStepIndex > 0
167
- ? html `
168
- <st-button
169
- variant="secondary"
170
- type="button"
171
- @click=${this._prevStep}
172
- ?disabled=${this.loading}
173
- >
174
- Back
175
- </st-button>
176
- `
177
- : ""}
178
-
179
- <!-- Type is "button", but click triggers requestSubmit() on the internal form -->
180
- <st-button
181
- color="primary"
182
- type="button"
183
- @click=${this._triggerSubmission}
184
- ?disabled=${this.loading}
185
- >
186
- ${this.loading ? "Submitting..." : isLastStep ? "Submit" : "Continue"}
187
- </st-button>
188
- </div>
189
- </form>
190
- </div>
191
- `;
192
- }
193
- };
194
- StForm.styles = [
195
- resetStyles,
196
- css `
197
- :host {
198
- display: block;
199
- position: relative;
200
- }
201
-
202
- form {
203
- display: flex;
204
- gap: var(--st-spacing-md);
205
- }
206
-
207
- /* ==========================================================
208
- Layouts
209
- ========================================================== */
210
- :host([layout="vertical"]) form {
211
- flex-direction: column;
212
- }
213
-
214
- :host([layout="horizontal"]) form {
215
- display: grid;
216
- grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
217
- align-items: start;
218
- }
219
-
220
- :host([layout="inline"]) form {
221
- flex-direction: row;
222
- align-items: flex-end;
223
- flex-wrap: wrap;
224
- }
225
-
226
- .has-steps form {
227
- display: flex;
228
- flex-direction: column;
229
- }
230
-
231
- /* ==========================================================
232
- Progress Navigation
233
- ========================================================== */
234
- .progress-nav {
235
- display: flex;
236
- align-items: center;
237
- margin-bottom: var(--st-spacing-xl);
238
- padding-bottom: var(--st-spacing-md);
239
- overflow-x: auto;
240
- scrollbar-width: none;
241
- }
242
-
243
- .step-indicator {
244
- display: flex;
245
- align-items: center;
246
- gap: var(--st-spacing-sm);
247
- color: var(--st-color-text-muted);
248
- font-size: var(--st-font-size-sm);
249
- font-weight: var(--st-font-weight-medium);
250
- transition: color 0.2s ease;
251
- }
252
-
253
- .step-indicator.active {
254
- color: var(--st-color-text);
255
- }
256
- .step-indicator.completed {
257
- color: var(--st-color-success);
258
- }
259
-
260
- .step-circle {
261
- display: flex;
262
- align-items: center;
263
- justify-content: center;
264
- width: 1.75rem;
265
- height: 1.75rem;
266
- border-radius: 50%;
267
- border: 2px solid currentColor;
268
- font-size: 0.875rem;
269
- background-color: var(--st-color-bg);
270
- transition: all 0.2s ease;
271
- }
272
-
273
- .step-indicator.active .step-circle {
274
- background-color: var(--st-color-primary);
275
- border-color: var(--st-color-primary);
276
- color: var(--st-color-bg);
277
- }
278
-
279
- .step-indicator.completed .step-circle {
280
- border-color: var(--st-color-success);
281
- background-color: var(--st-color-success-bg, transparent);
282
- }
283
-
284
- .step-connector {
285
- flex: 1;
286
- height: 2px;
287
- min-width: 24px;
288
- margin: 0 var(--st-spacing-sm);
289
- background-color: var(--st-color-border);
290
- transition: background-color 0.2s ease;
291
- }
292
-
293
- .step-connector.completed {
294
- background-color: var(--st-color-success);
295
- }
296
-
297
- /* ==========================================================
298
- Actions & States
299
- ========================================================== */
300
- .form-actions {
301
- display: flex;
302
- gap: var(--st-spacing-md);
303
- margin-top: var(--st-spacing-lg);
304
- justify-content: flex-end;
305
- }
306
-
307
- .loading-overlay {
308
- position: absolute;
309
- inset: 0;
310
- background: rgba(var(--st-color-bg-rgb, 255, 255, 255), 0.7);
311
- backdrop-filter: blur(2px);
312
- display: flex;
313
- align-items: center;
314
- justify-content: center;
315
- z-index: 10;
316
- border-radius: inherit;
317
- color: var(--st-color-text);
318
- font-weight: var(--st-font-weight-medium);
319
- gap: var(--st-spacing-sm);
320
- }
321
-
322
- @keyframes pulse {
323
- 0%,
324
- 100% {
325
- opacity: 1;
326
- }
327
- 50% {
328
- opacity: 0.5;
329
- }
330
- }
331
-
332
- .loading-overlay st-icon {
333
- animation: pulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
334
- }
335
- `,
336
- ];
337
- __decorate([
338
- property({ type: String, reflect: true })
339
- ], StForm.prototype, "layout", void 0);
340
- __decorate([
341
- property({ type: Boolean, reflect: true })
342
- ], StForm.prototype, "loading", void 0);
343
- __decorate([
344
- property({ type: String })
345
- ], StForm.prototype, "error", void 0);
346
- __decorate([
347
- state()
348
- ], StForm.prototype, "_currentStepIndex", void 0);
349
- __decorate([
350
- queryAssignedElements({ selector: "st-form-step" })
351
- ], StForm.prototype, "_stepElements", void 0);
352
- __decorate([
353
- query("form")
354
- ], StForm.prototype, "_formEl", void 0);
355
- StForm = __decorate([
356
- customElement("st-form")
357
- ], StForm);
358
- export { StForm };
@@ -1,17 +0,0 @@
1
- import { LitElement } from 'lit';
2
- export declare class StGridRow extends LitElement {
3
- xs: number;
4
- sm?: number;
5
- md?: number;
6
- lg?: number;
7
- xl?: number;
8
- static styles: import("lit").CSSResult[];
9
- updated(changedProperties: Map<string, any>): void;
10
- render(): import("lit-html").TemplateResult<1>;
11
- }
12
- declare global {
13
- interface HTMLElementTagNameMap {
14
- 'st-grid-row': StGridRow;
15
- }
16
- }
17
- //# sourceMappingURL=grid-row.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"grid-row.d.ts","sourceRoot":"","sources":["../../../src/components/grid/grid-row.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C,qBACa,SAAU,SAAQ,UAAU;IACX,EAAE,SAAK;IACP,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,EAAE,CAAC,EAAE,MAAM,CAAC;IAExC,MAAM,CAAC,MAAM,4BAkCX;IAEF,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,QAgB1C;IAED,MAAM,yCAEL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,SAAS,CAAC;KAC1B;CACF"}
@@ -1,92 +0,0 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement, html, css } from 'lit';
8
- import { customElement, property } from 'lit/decorators.js';
9
- import { resetStyles } from '../../styles/reset.js';
10
- let StGridRow = class StGridRow extends LitElement {
11
- constructor() {
12
- super(...arguments);
13
- this.xs = 1;
14
- }
15
- updated(changedProperties) {
16
- super.updated(changedProperties);
17
- this.style.setProperty('--grid-xs', this.xs.toString());
18
- if (this.sm !== undefined)
19
- this.style.setProperty('--grid-sm', this.sm.toString());
20
- else
21
- this.style.removeProperty('--grid-sm');
22
- if (this.md !== undefined)
23
- this.style.setProperty('--grid-md', this.md.toString());
24
- else
25
- this.style.removeProperty('--grid-md');
26
- if (this.lg !== undefined)
27
- this.style.setProperty('--grid-lg', this.lg.toString());
28
- else
29
- this.style.removeProperty('--grid-lg');
30
- if (this.xl !== undefined)
31
- this.style.setProperty('--grid-xl', this.xl.toString());
32
- else
33
- this.style.removeProperty('--grid-xl');
34
- }
35
- render() {
36
- return html `<slot></slot>`;
37
- }
38
- };
39
- StGridRow.styles = [
40
- resetStyles,
41
- css `
42
- :host {
43
- display: grid;
44
- /* Seamlessly inherits --grid-gap from <st-grid> parent, or falls back */
45
- gap: var(--grid-gap, var(--st-spacing-md));
46
- grid-template-columns: repeat(var(--_cols, 1), 1fr);
47
- width: 100%;
48
- }
49
-
50
- /* Mobile First (xs) */
51
- :host { --_cols: var(--grid-xs, 1); }
52
-
53
- /* Small (sm: >= 640px) */
54
- @media (min-width: 640px) {
55
- :host { --_cols: var(--grid-sm, var(--grid-xs, 1)); }
56
- }
57
-
58
- /* Medium (md: >= 768px) */
59
- @media (min-width: 768px) {
60
- :host { --_cols: var(--grid-md, var(--grid-sm, var(--grid-xs, 1))); }
61
- }
62
-
63
- /* Large (lg: >= 1024px) */
64
- @media (min-width: 1024px) {
65
- :host { --_cols: var(--grid-lg, var(--grid-md, var(--grid-sm, var(--grid-xs, 1)))); }
66
- }
67
-
68
- /* Extra Large (xl: >= 1280px) */
69
- @media (min-width: 1280px) {
70
- :host { --_cols: var(--grid-xl, var(--grid-lg, var(--grid-md, var(--grid-sm, var(--grid-xs, 1))))); }
71
- }
72
- `
73
- ];
74
- __decorate([
75
- property({ type: Number })
76
- ], StGridRow.prototype, "xs", void 0);
77
- __decorate([
78
- property({ type: Number })
79
- ], StGridRow.prototype, "sm", void 0);
80
- __decorate([
81
- property({ type: Number })
82
- ], StGridRow.prototype, "md", void 0);
83
- __decorate([
84
- property({ type: Number })
85
- ], StGridRow.prototype, "lg", void 0);
86
- __decorate([
87
- property({ type: Number })
88
- ], StGridRow.prototype, "xl", void 0);
89
- StGridRow = __decorate([
90
- customElement('st-grid-row')
91
- ], StGridRow);
92
- export { StGridRow };
@@ -1,13 +0,0 @@
1
- import { LitElement } from 'lit';
2
- export declare class StGrid extends LitElement {
3
- gap: string;
4
- static styles: import("lit").CSSResult[];
5
- updated(changedProperties: Map<string, any>): void;
6
- render(): import("lit-html").TemplateResult<1>;
7
- }
8
- declare global {
9
- interface HTMLElementTagNameMap {
10
- 'st-grid': StGrid;
11
- }
12
- }
13
- //# sourceMappingURL=grid.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../src/components/grid/grid.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C,qBACa,MAAO,SAAQ,UAAU;IAER,GAAG,SAA0B;IAEzD,MAAM,CAAC,MAAM,4BAUX;IAEF,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,QAI1C;IAED,MAAM,yCAEL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
@@ -1,42 +0,0 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement, html, css } from 'lit';
8
- import { customElement, property } from 'lit/decorators.js';
9
- import { resetStyles } from '../../styles/reset.js';
10
- let StGrid = class StGrid extends LitElement {
11
- constructor() {
12
- super(...arguments);
13
- // Centralized gap control
14
- this.gap = 'var(--st-spacing-md)';
15
- }
16
- updated(changedProperties) {
17
- super.updated(changedProperties);
18
- // This CSS variable will automatically cascade down the DOM tree
19
- this.style.setProperty('--grid-gap', this.gap);
20
- }
21
- render() {
22
- return html `<slot></slot>`;
23
- }
24
- };
25
- StGrid.styles = [
26
- resetStyles,
27
- css `
28
- :host {
29
- display: grid;
30
- grid-template-columns: 1fr; /* Stacks the rows vertically */
31
- gap: var(--grid-gap, var(--st-spacing-md));
32
- width: 100%;
33
- }
34
- `
35
- ];
36
- __decorate([
37
- property({ type: String })
38
- ], StGrid.prototype, "gap", void 0);
39
- StGrid = __decorate([
40
- customElement('st-grid')
41
- ], StGrid);
42
- export { StGrid };
@@ -1,116 +0,0 @@
1
- export declare const iconPaths: {
2
- "check-circle": {
3
- outline: import("lit-html").TemplateResult<2>;
4
- solid: import("lit-html").TemplateResult<2>;
5
- };
6
- "alert-triangle": {
7
- outline: import("lit-html").TemplateResult<2>;
8
- solid: import("lit-html").TemplateResult<2>;
9
- };
10
- info: {
11
- outline: import("lit-html").TemplateResult<2>;
12
- solid: import("lit-html").TemplateResult<2>;
13
- };
14
- package: {
15
- outline: import("lit-html").TemplateResult<2>;
16
- solid: import("lit-html").TemplateResult<2>;
17
- };
18
- terminal: {
19
- outline: import("lit-html").TemplateResult<2>;
20
- solid: import("lit-html").TemplateResult<2>;
21
- };
22
- "cloud-download": {
23
- outline: import("lit-html").TemplateResult<2>;
24
- solid: import("lit-html").TemplateResult<2>;
25
- };
26
- monitor: {
27
- outline: import("lit-html").TemplateResult<2>;
28
- solid: import("lit-html").TemplateResult<2>;
29
- };
30
- component: {
31
- outline: import("lit-html").TemplateResult<2>;
32
- solid: import("lit-html").TemplateResult<2>;
33
- };
34
- "layout-template": {
35
- outline: import("lit-html").TemplateResult<2>;
36
- solid: import("lit-html").TemplateResult<2>;
37
- };
38
- palette: {
39
- outline: import("lit-html").TemplateResult<2>;
40
- solid: import("lit-html").TemplateResult<2>;
41
- };
42
- bug: {
43
- outline: import("lit-html").TemplateResult<2>;
44
- solid: import("lit-html").TemplateResult<2>;
45
- };
46
- support: {
47
- outline: import("lit-html").TemplateResult<2>;
48
- solid: import("lit-html").TemplateResult<2>;
49
- };
50
- "join-us": {
51
- outline: import("lit-html").TemplateResult<2>;
52
- solid: import("lit-html").TemplateResult<2>;
53
- };
54
- "chevron-left": {
55
- outline: import("lit-html").TemplateResult<2>;
56
- solid: import("lit-html").TemplateResult<2>;
57
- };
58
- "chevron-right": {
59
- outline: import("lit-html").TemplateResult<2>;
60
- solid: import("lit-html").TemplateResult<2>;
61
- };
62
- discord: {
63
- outline: import("lit-html").TemplateResult<2>;
64
- solid: import("lit-html").TemplateResult<2>;
65
- };
66
- envelope: {
67
- outline: import("lit-html").TemplateResult<2>;
68
- solid: import("lit-html").TemplateResult<2>;
69
- };
70
- button: {
71
- outline: import("lit-html").TemplateResult<2>;
72
- solid: import("lit-html").TemplateResult<2>;
73
- };
74
- "pointer-click": {
75
- outline: import("lit-html").TemplateResult<2>;
76
- solid: import("lit-html").TemplateResult<2>;
77
- };
78
- checkbox: {
79
- outline: import("lit-html").TemplateResult<2>;
80
- solid: import("lit-html").TemplateResult<2>;
81
- };
82
- input: {
83
- outline: import("lit-html").TemplateResult<2>;
84
- solid: import("lit-html").TemplateResult<2>;
85
- };
86
- "check-box": {
87
- outline: import("lit-html").TemplateResult<2>;
88
- solid: import("lit-html").TemplateResult<2>;
89
- };
90
- github: {
91
- outline: import("lit-html").TemplateResult<2>;
92
- solid: import("lit-html").TemplateResult<2>;
93
- };
94
- link: {
95
- outline: import("lit-html").TemplateResult<2>;
96
- solid: import("lit-html").TemplateResult<2>;
97
- };
98
- "layout-single-column": {
99
- outline: import("lit-html").TemplateResult<2>;
100
- solid: import("lit-html").TemplateResult<2>;
101
- };
102
- "layout-content-sidebar": {
103
- outline: import("lit-html").TemplateResult<2>;
104
- solid: import("lit-html").TemplateResult<2>;
105
- };
106
- "layout-app-shell": {
107
- outline: import("lit-html").TemplateResult<2>;
108
- solid: import("lit-html").TemplateResult<2>;
109
- };
110
- "layout-three-column": {
111
- outline: import("lit-html").TemplateResult<2>;
112
- solid: import("lit-html").TemplateResult<2>;
113
- };
114
- };
115
- export type IconName = keyof typeof iconPaths;
116
- //# sourceMappingURL=icon-paths.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"icon-paths.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon-paths.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;IACpB,cAAc;QACZ,OAAO;QACP,KAAK;;IAEP,gBAAgB;QACd,OAAO;QACP,KAAK;;IAEP,IAAI;QACF,OAAO;QACP,KAAK;;IAEP,OAAO;QACL,OAAO;QACP,KAAK;;IAEP,QAAQ;QACN,OAAO;QACP,KAAK;;IAEP,gBAAgB;QACd,OAAO;QACP,KAAK;;IAEP,OAAO;QACL,OAAO;QACP,KAAK;;IAEP,SAAS;QACP,OAAO;QACP,KAAK;;IAEP,iBAAiB;QACf,OAAO;QACP,KAAK;;IAEP,OAAO;QACL,OAAO;QACP,KAAK;;IAEP,GAAG;QACD,OAAO;QACP,KAAK;;IAEP,OAAO;QACL,OAAO;QACP,KAAK;;IAEP,SAAS;QACP,OAAO;QACP,KAAK;;IAEP,cAAc;QACZ,OAAO;QACP,KAAK;;IAEP,eAAe;QACb,OAAO;QACP,KAAK;;IAEP,OAAO;QACL,OAAO;QACP,KAAK;;IAEP,QAAQ;QACN,OAAO;QACP,KAAK;;IAEP,MAAM;QACJ,OAAO;QACP,KAAK;;IAEP,eAAe;QACb,OAAO;QAIP,KAAK;;IAKP,QAAQ;QACN,OAAO;QACP,KAAK;;IAEP,KAAK;QACH,OAAO;QACP,KAAK;;IAEP,WAAW;QACT,OAAO;QACP,KAAK;;IAEP,MAAM;QACJ,OAAO;QACP,KAAK;;IAEP,IAAI;QACF,OAAO;QACP,KAAK;;IAEP,sBAAsB;QACpB,OAAO;QACP,KAAK;;IAEP,wBAAwB;QACtB,OAAO;QACP,KAAK;;IAEP,kBAAkB;QAChB,OAAO;QACP,KAAK;;IAEP,qBAAqB;QACnB,OAAO;QACP,KAAK;;CAER,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC"}