@sondor-technology/sondor-components 1.0.0-1165-initial-setup.11 → 1.0.1-develop.10

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 (43) hide show
  1. package/dist/components/checkbox/checkbox.d.ts +3 -0
  2. package/dist/components/checkbox/checkbox.d.ts.map +1 -1
  3. package/dist/components/checkbox/checkbox.js +38 -20
  4. package/dist/components/divider/divider.js +1 -1
  5. package/dist/components/field/field.js +1 -1
  6. package/dist/components/form/form.d.ts.map +1 -1
  7. package/dist/components/form/form.js +33 -27
  8. package/dist/components/icon/icon-paths.d.ts +16 -0
  9. package/dist/components/icon/icon-paths.d.ts.map +1 -1
  10. package/dist/components/icon/icon-paths.js +16 -0
  11. package/dist/components/icon/icon.d.ts +2 -1
  12. package/dist/components/icon/icon.d.ts.map +1 -1
  13. package/dist/components/link/link.js +1 -1
  14. package/dist/components/modal/modal.d.ts +11 -0
  15. package/dist/components/modal/modal.d.ts.map +1 -1
  16. package/dist/components/modal/modal.js +103 -15
  17. package/dist/components/router/router.d.ts +27 -3
  18. package/dist/components/router/router.d.ts.map +1 -1
  19. package/dist/components/router/router.js +72 -12
  20. package/dist/components/select/select.js +1 -1
  21. package/dist/components/skeleton/skeleton.d.ts +2 -3
  22. package/dist/components/skeleton/skeleton.d.ts.map +1 -1
  23. package/dist/components/skeleton/skeleton.js +89 -18
  24. package/dist/components/vertical-nav/vertical-nav-group.d.ts +6 -0
  25. package/dist/components/vertical-nav/vertical-nav-group.d.ts.map +1 -1
  26. package/dist/components/vertical-nav/vertical-nav-group.js +37 -21
  27. package/dist/components/vertical-nav/vertical-nav-item.d.ts +6 -0
  28. package/dist/components/vertical-nav/vertical-nav-item.d.ts.map +1 -1
  29. package/dist/components/vertical-nav/vertical-nav-item.js +27 -7
  30. package/package.json +5 -1
  31. package/src/components/checkbox/checkbox.ts +54 -26
  32. package/src/components/divider/divider.ts +1 -1
  33. package/src/components/field/field.ts +1 -1
  34. package/src/components/form/form.ts +39 -30
  35. package/src/components/icon/icon-paths.ts +16 -0
  36. package/src/components/icon/icon.ts +3 -1
  37. package/src/components/link/link.ts +1 -1
  38. package/src/components/modal/modal.ts +103 -15
  39. package/src/components/router/router.ts +99 -12
  40. package/src/components/select/select.ts +1 -1
  41. package/src/components/skeleton/skeleton.ts +87 -20
  42. package/src/components/vertical-nav/vertical-nav-group.ts +40 -21
  43. package/src/components/vertical-nav/vertical-nav-item.ts +30 -7
@@ -11,11 +11,14 @@ export declare class StCheckbox extends LitElement {
11
11
  disabled: boolean;
12
12
  invalid: boolean;
13
13
  required: boolean;
14
+ errorMessage: string;
14
15
  ariaLabel: string;
15
16
  constructor();
16
17
  static styles: import("lit").CSSResult[];
17
18
  updated(changedProperties: PropertyValues<this>): void;
18
19
  private _syncValidity;
20
+ checkValidity(): boolean;
21
+ reportValidity(): boolean;
19
22
  formResetCallback(): void;
20
23
  private _handleChange;
21
24
  render(): import("lit-html").TemplateResult<1>;
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAa,cAAc,EAAC,MAAM,KAAK,CAAC;AAI1D,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAAmB;IAErB,OAAO,CAAC,QAAQ,CAAoB;IAEX,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAChC,IAAI,SAAM;IAEzB,KAAK,SAAQ;IAEG,OAAO,UAAS;IAChB,aAAa,UAAS;IAEtB,QAAQ,UAAS;IACjB,OAAO,UAAS;IAChB,QAAQ,UAAS;IAEtB,SAAS,SAAM;IAEtD,cAaG;IAED,MAAM,CAAC,MAAM,4BAuHX;IAEO,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,QAYvD;IAED,OAAO,CAAC,aAAa;IASrB,iBAAiB,SAKhB;IAED,OAAO,CAAC,aAAa;IAcrB,MAAM,yCAyBL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
1
+ {"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/checkbox/checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAa,cAAc,EAAC,MAAM,KAAK,CAAC;AAI1D,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAAmB;IAErB,OAAO,CAAC,QAAQ,CAAoB;IAEX,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAChC,IAAI,SAAM;IACzB,KAAK,SAAQ;IAEG,OAAO,UAAS;IAChB,aAAa,UAAS;IAEtB,QAAQ,UAAS;IACjB,OAAO,UAAS;IAChB,QAAQ,UAAS;IACjC,YAAY,SAAM;IAEP,SAAS,SAAM;IAEpD,cAWC;IAED,MAAM,CAAC,MAAM,4BA6GX;IAEO,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,QAWvD;IAED,OAAO,CAAC,aAAa;IAmBd,aAAa,IAAI,OAAO,CAkB9B;IAEM,cAAc,IAAI,OAAO,CAK/B;IAED,iBAAiB,SAMhB;IAED,OAAO,CAAC,aAAa;IAkBrB,MAAM,yCAwBL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
@@ -12,28 +12,25 @@ let StCheckbox = class StCheckbox extends LitElement {
12
12
  super();
13
13
  this.size = "md";
14
14
  this.name = "";
15
- // Checkboxes default to 'on' natively if no value is provided
16
15
  this.value = "on";
17
16
  this.checked = false;
18
17
  this.indeterminate = false;
19
18
  this.disabled = false;
20
19
  this.invalid = false;
21
20
  this.required = false;
21
+ this.errorMessage = "";
22
22
  this.ariaLabel = "";
23
23
  this._internals = this.attachInternals();
24
- // 1. Trigger error state if the user clicks away and the field is invalid
25
24
  this.addEventListener('focusout', () => {
26
- this.invalid = !this._inputEl.validity.valid;
25
+ this.invalid = !this.checkValidity();
27
26
  });
28
- // 2. Trigger error state if the st-form tries to submit and fails
29
27
  this.addEventListener('invalid', () => {
30
- this.invalid = true;
28
+ this.invalid = !this.checkValidity();
31
29
  });
32
30
  }
33
31
  updated(changedProperties) {
34
32
  super.updated(changedProperties);
35
- if (changedProperties.has("checked") || changedProperties.has("value")) {
36
- // Form API: If checked, submit the value. If unchecked, submit null to remove it from FormData.
33
+ if (changedProperties.has("checked") || changedProperties.has("value") || changedProperties.has("errorMessage")) {
37
34
  this._internals.setFormValue(this.checked ? this.value : null);
38
35
  this._syncValidity();
39
36
  }
@@ -44,11 +41,38 @@ let StCheckbox = class StCheckbox extends LitElement {
44
41
  _syncValidity() {
45
42
  if (!this._inputEl)
46
43
  return;
47
- this._internals.setValidity(this._inputEl.validity, this._inputEl.validationMessage, this._inputEl);
44
+ if (this.required && !this.checked) {
45
+ const message = this.errorMessage || this._inputEl.validationMessage || "Please check this box if you want to proceed.";
46
+ this._internals.setValidity({ valueMissing: true }, message, this._inputEl);
47
+ }
48
+ else {
49
+ this._internals.setValidity(this._inputEl.validity, this._inputEl.validationMessage, this._inputEl);
50
+ }
51
+ }
52
+ checkValidity() {
53
+ if (!this._inputEl)
54
+ return true;
55
+ if (this.required && !this.checked) {
56
+ const message = this.errorMessage || this._inputEl.validationMessage || "Please check this box if you want to proceed.";
57
+ this._internals.setValidity({ valueMissing: true }, message, this._inputEl);
58
+ this.invalid = true;
59
+ return false;
60
+ }
61
+ const isValid = this._inputEl.checkValidity();
62
+ this._syncValidity();
63
+ this.invalid = !isValid;
64
+ return isValid;
65
+ }
66
+ reportValidity() {
67
+ this._syncValidity();
68
+ const isValid = this._internals.reportValidity();
69
+ this.invalid = !isValid;
70
+ return isValid;
48
71
  }
49
72
  formResetCallback() {
50
73
  this.checked = false;
51
74
  this.indeterminate = false;
75
+ this.invalid = false;
52
76
  this._internals.setFormValue(null);
53
77
  this.updateComplete.then(() => this._syncValidity());
54
78
  }
@@ -56,11 +80,13 @@ let StCheckbox = class StCheckbox extends LitElement {
56
80
  e.stopPropagation();
57
81
  if (this.disabled)
58
82
  return;
59
- // Standard native behavior: clicking an indeterminate checkbox unsets the indeterminate state
60
83
  if (this.indeterminate) {
61
84
  this.indeterminate = false;
62
85
  }
63
86
  this.checked = this._inputEl.checked;
87
+ if (this.checkValidity()) {
88
+ this.invalid = false;
89
+ }
64
90
  this.dispatchEvent(new Event("change", { bubbles: true, composed: true }));
65
91
  }
66
92
  render() {
@@ -78,7 +104,6 @@ let StCheckbox = class StCheckbox extends LitElement {
78
104
  @change=${this._handleChange}
79
105
  />
80
106
  <div class="control">
81
- <!-- Render both SVGs and use CSS to conditionally reveal them based on host attributes -->
82
107
  ${this.indeterminate
83
108
  ? html `<svg class="icon-minus" viewBox="0 0 24 24"><path d="M5 12h14"></path></svg>`
84
109
  : html `<svg class="icon-check" viewBox="0 0 24 24">
@@ -120,7 +145,6 @@ StCheckbox.styles = [
120
145
  font-size: var(--st-font-size-base);
121
146
  }
122
147
 
123
- /* Visually hide the native input but keep it in the DOM for focus/screen readers */
124
148
  input {
125
149
  position: absolute;
126
150
  width: var(--checkbox-size);
@@ -133,7 +157,6 @@ StCheckbox.styles = [
133
157
  border-width: 0;
134
158
  }
135
159
 
136
- /* Custom Checkbox Box */
137
160
  .control {
138
161
  display: flex;
139
162
  align-items: center;
@@ -145,30 +168,25 @@ StCheckbox.styles = [
145
168
  background-color: var(--st-color-bg);
146
169
  transition: all 0.2s ease;
147
170
  flex-shrink: 0;
148
- /* Aligns the box nicely with standard text line-height */
149
171
  margin-top: 0.125rem;
150
172
  }
151
173
 
152
- /* Hover State */
153
174
  label:hover .control {
154
175
  border-color: var(--st-color-primary-hover);
155
176
  }
156
177
 
157
- /* Focus State */
158
178
  input:focus-visible + .control {
159
179
  box-shadow:
160
180
  0 0 0 2px var(--st-color-bg),
161
181
  0 0 0 4px var(--st-color-primary);
162
182
  }
163
183
 
164
- /* Checked & Indeterminate States */
165
184
  :host([checked]) .control,
166
185
  :host([indeterminate]) .control {
167
186
  border-color: var(--st-color-primary);
168
187
  background-color: var(--st-color-primary);
169
188
  }
170
189
 
171
- /* SVG Icons */
172
190
  svg {
173
191
  width: var(--checkbox-icon-size);
174
192
  height: var(--checkbox-icon-size);
@@ -184,14 +202,12 @@ StCheckbox.styles = [
184
202
  opacity 0.2s ease;
185
203
  }
186
204
 
187
- /* Reveal Icons */
188
205
  :host([checked]) svg.icon-check,
189
206
  :host([indeterminate]) svg.icon-minus {
190
207
  opacity: 1;
191
208
  transform: scale(1);
192
209
  }
193
210
 
194
- /* Disabled State */
195
211
  :host([disabled]) {
196
212
  pointer-events: none;
197
213
  }
@@ -200,7 +216,6 @@ StCheckbox.styles = [
200
216
  cursor: not-allowed;
201
217
  }
202
218
 
203
- /* Invalid State */
204
219
  :host([invalid]) .control {
205
220
  border-color: var(--st-color-error);
206
221
  }
@@ -238,6 +253,9 @@ __decorate([
238
253
  __decorate([
239
254
  property({ type: Boolean, reflect: true })
240
255
  ], StCheckbox.prototype, "required", void 0);
256
+ __decorate([
257
+ property({ type: String })
258
+ ], StCheckbox.prototype, "errorMessage", void 0);
241
259
  __decorate([
242
260
  property({ attribute: "aria-label" })
243
261
  ], StCheckbox.prototype, "ariaLabel", void 0);
@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { LitElement, html, css } from 'lit';
8
8
  import { customElement, property } from 'lit/decorators.js';
9
- import { resetStyles } from '../../styles/reset';
9
+ import { resetStyles } from '../../styles/reset.js';
10
10
  let StDivider = class StDivider extends LitElement {
11
11
  constructor() {
12
12
  super(...arguments);
@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { LitElement, html, css } from 'lit';
8
8
  import { customElement, } from 'lit/decorators.js';
9
- import { resetStyles } from '../../styles/reset';
9
+ import { resetStyles } from '../../styles/reset.js';
10
10
  let StField = class StField extends LitElement {
11
11
  render() {
12
12
  return html `
@@ -1 +1 @@
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
+ {"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,4BAqIX;IAEF,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,qBAAqB;YAOf,uBAAuB;IAuDrC,OAAO,CAAC,kBAAkB;IAI1B,OAAO,CAAC,SAAS;IAOjB,OAAO,CAAC,gBAAgB;YAkCV,aAAa;IA4B3B,MAAM,yCAiFL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
@@ -26,18 +26,16 @@ let StForm = class StForm extends LitElement {
26
26
  });
27
27
  this.requestUpdate();
28
28
  }
29
- _validateCurrentContext() {
30
- if (this._stepElements.length === 0) {
31
- return this._formEl.checkValidity();
32
- }
33
- const currentStep = this._stepElements[this._currentStepIndex];
29
+ async _validateCurrentContext() {
30
+ const scope = this._stepElements.length > 0
31
+ ? this._stepElements[this._currentStepIndex]
32
+ : this;
34
33
  let isValid = true;
35
- // Find all custom and native form inputs assigned to the current step
36
- const inputs = Array.from(currentStep.querySelectorAll("*"));
34
+ // 1. Validate standard DOM input components
35
+ const inputs = Array.from(scope.querySelectorAll("*"));
37
36
  for (const input of inputs) {
38
37
  if (typeof input.checkValidity === "function") {
39
38
  if (!input.checkValidity()) {
40
- // Focus and report on the first invalid element encountered
41
39
  if (isValid && typeof input.reportValidity === "function") {
42
40
  input.reportValidity();
43
41
  }
@@ -45,10 +43,33 @@ let StForm = class StForm extends LitElement {
45
43
  }
46
44
  }
47
45
  }
46
+ if (this._stepElements.length === 0 && this._formEl) {
47
+ if (!this._formEl.checkValidity()) {
48
+ isValid = false;
49
+ }
50
+ }
51
+ // 2. Execute step-level async/sync validation hook if defined
52
+ if (isValid && this._stepElements.length > 0) {
53
+ const currentStep = this._stepElements[this._currentStepIndex];
54
+ if (typeof currentStep.validate === "function") {
55
+ try {
56
+ this.loading = true;
57
+ const stepPassed = await currentStep.validate();
58
+ if (!stepPassed) {
59
+ isValid = false;
60
+ }
61
+ }
62
+ catch (err) {
63
+ isValid = false;
64
+ }
65
+ finally {
66
+ this.loading = false;
67
+ }
68
+ }
69
+ }
48
70
  return isValid;
49
71
  }
50
72
  _triggerSubmission() {
51
- // HTML5 method that triggers form validation and fires the native submit event
52
73
  this._formEl.requestSubmit();
53
74
  }
54
75
  _prevStep() {
@@ -59,10 +80,8 @@ let StForm = class StForm extends LitElement {
59
80
  }
60
81
  _extractFormData() {
61
82
  const formData = new FormData();
62
- // Query all light-DOM children that have a 'name' attribute
63
83
  const fields = this.querySelectorAll("[name]");
64
84
  fields.forEach((field) => {
65
- // Standard HTML form behavior: ignore disabled fields
66
85
  if (field.hasAttribute("disabled"))
67
86
  return;
68
87
  const isToggle = field.tagName === "ST-RADIO" ||
@@ -70,7 +89,6 @@ let StForm = class StForm extends LitElement {
70
89
  field.getAttribute("type") === "radio" ||
71
90
  field.getAttribute("type") === "checkbox";
72
91
  if (isToggle) {
73
- // Only append radios/checkboxes if they are actively checked
74
92
  if (field.checked) {
75
93
  formData.append(field.name, field.value || "on");
76
94
  }
@@ -78,20 +96,19 @@ let StForm = class StForm extends LitElement {
78
96
  else if (field.tagName === "INPUT" &&
79
97
  field.getAttribute("type") === "file" &&
80
98
  field.files) {
81
- // Handle native file uploads
82
99
  Array.from(field.files).forEach((file) => formData.append(field.name, file));
83
100
  }
84
101
  else if (field.value !== undefined) {
85
- // Handle st-input, st-select, st-textarea, and standard inputs
86
102
  formData.append(field.name, field.value);
87
103
  }
88
104
  });
89
105
  return formData;
90
106
  }
91
- _handleSubmit(e) {
107
+ async _handleSubmit(e) {
92
108
  e.preventDefault();
93
109
  e.stopPropagation();
94
- if (!this._validateCurrentContext())
110
+ const isValid = await this._validateCurrentContext();
111
+ if (!isValid)
95
112
  return;
96
113
  const hasSteps = this._stepElements.length > 0;
97
114
  const isLastStep = hasSteps ? this._currentStepIndex === this._stepElements.length - 1 : true;
@@ -100,7 +117,6 @@ let StForm = class StForm extends LitElement {
100
117
  this._updateStepVisibility();
101
118
  return;
102
119
  }
103
- // Use our custom extractor to pierce the Shadow DOM boundary
104
120
  const formData = this._extractFormData();
105
121
  this.dispatchEvent(new CustomEvent("submit", {
106
122
  bubbles: true,
@@ -176,7 +192,6 @@ let StForm = class StForm extends LitElement {
176
192
  `
177
193
  : ""}
178
194
 
179
- <!-- Type is "button", but click triggers requestSubmit() on the internal form -->
180
195
  <st-button
181
196
  color="primary"
182
197
  type="button"
@@ -204,9 +219,6 @@ StForm.styles = [
204
219
  gap: var(--st-spacing-md);
205
220
  }
206
221
 
207
- /* ==========================================================
208
- Layouts
209
- ========================================================== */
210
222
  :host([layout="vertical"]) form {
211
223
  flex-direction: column;
212
224
  }
@@ -228,9 +240,6 @@ StForm.styles = [
228
240
  flex-direction: column;
229
241
  }
230
242
 
231
- /* ==========================================================
232
- Progress Navigation
233
- ========================================================== */
234
243
  .progress-nav {
235
244
  display: flex;
236
245
  align-items: center;
@@ -294,9 +303,6 @@ StForm.styles = [
294
303
  background-color: var(--st-color-success);
295
304
  }
296
305
 
297
- /* ==========================================================
298
- Actions & States
299
- ========================================================== */
300
306
  .form-actions {
301
307
  display: flex;
302
308
  gap: var(--st-spacing-md);
@@ -111,6 +111,22 @@ export declare const iconPaths: {
111
111
  outline: import("lit-html").TemplateResult<2>;
112
112
  solid: import("lit-html").TemplateResult<2>;
113
113
  };
114
+ calender: {
115
+ outline: import("lit-html").TemplateResult<2>;
116
+ solid: import("lit-html").TemplateResult<2>;
117
+ };
118
+ user: {
119
+ outline: import("lit-html").TemplateResult<2>;
120
+ solid: import("lit-html").TemplateResult<2>;
121
+ };
122
+ home: {
123
+ outline: import("lit-html").TemplateResult<2>;
124
+ solid: import("lit-html").TemplateResult<2>;
125
+ };
126
+ "circle-cross": {
127
+ outline: import("lit-html").TemplateResult<2>;
128
+ solid: import("lit-html").TemplateResult<2>;
129
+ };
114
130
  };
115
131
  export type IconName = keyof typeof iconPaths;
116
132
  //# sourceMappingURL=icon-paths.d.ts.map
@@ -1 +1 @@
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"}
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;;IAEP,QAAQ;QACN,OAAO;QACP,KAAK;;IAEP,IAAI;QACF,OAAO;QACP,KAAK;;IAEP,IAAI;QACF,OAAO;QACP,KAAK;;IAEP,cAAc;QACZ,OAAO;QACP,KAAK;;CAER,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC"}
@@ -118,4 +118,20 @@ export const iconPaths = {
118
118
  outline: svg `<rect x="3" y="3" width="18" height="18" rx="2" stroke="currentColor" stroke-width="2" fill="none"></rect><line x1="3" y1="8" x2="21" y2="8" stroke="currentColor" stroke-width="2"></line><line x1="7" y1="8" x2="7" y2="21" stroke="currentColor" stroke-width="2"></line><line x1="17" y1="8" x2="17" y2="21" stroke="currentColor" stroke-width="2"></line><line x1="10" y1="14" x2="14" y2="14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></line>`,
119
119
  solid: svg `<path fill="currentColor" d="M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5zm2 3h14V5H5v3zM7 9H3v12h4V9zm14 0h-4v12h4V9z"></path>`,
120
120
  },
121
+ calender: {
122
+ outline: svg `<rect x="3" y="4" width="18" height="18" rx="2" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></rect><line x1="16" y1="2" x2="16" y2="6" stroke="currentColor" stroke-width="2" stroke-linecap="round"></line><line x1="8" y1="2" x2="8" y2="6" stroke="currentColor" stroke-width="2" stroke-linecap="round"></line><line x1="3" y1="10" x2="21" y2="10" stroke="currentColor" stroke-width="2"></line>`,
123
+ solid: svg `<path fill="currentColor" d="M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V9h14v11z"></path>`,
124
+ },
125
+ user: {
126
+ outline: svg `<circle cx="12" cy="8" r="4" fill="none" stroke="currentColor" stroke-width="2"></circle><path d="M4 20c0-4 4-6 8-6s8 2 8 6" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"></path>`,
127
+ solid: svg `<path fill="currentColor" d="M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5zm0 2c-3.33 0-10 1.67-10 5v3h20v-3c0-3.33-6.67-5-10-5z"></path>`,
128
+ },
129
+ home: {
130
+ outline: svg `<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><polyline points="9 22 9 12 15 12 15 22" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></polyline>`,
131
+ solid: svg `<path fill="currentColor" d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"></path>`,
132
+ },
133
+ "circle-cross": {
134
+ outline: svg `<circle cx="12" cy="12" r="9" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></circle><line x1="15" y1="9" x2="9" y2="15" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></line><line x1="9" y1="9" x2="15" y2="15" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></line>`,
135
+ solid: svg `<path fill="currentColor" fill-rule="evenodd" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm3.36 6.64a1 1 0 0 1 0 1.41L13.41 12l1.95 1.95a1 1 0 0 1-1.41 1.41L12 13.41l-1.95 1.95a1 1 0 0 1-1.41-1.41L10.59 12 8.64 10.05a1 1 0 0 1 1.41-1.41L12 10.59l1.95-1.95a1 1 0 0 1 1.41 0z" clip-rule="evenodd"></path>`,
136
+ },
121
137
  };
@@ -1,8 +1,9 @@
1
1
  import { LitElement } from 'lit';
2
2
  import { IconName } from './icon-paths.js';
3
+ export type IconVariant = 'outline' | 'solid';
3
4
  export declare class StIcon extends LitElement {
4
5
  name: IconName | string;
5
- variant: 'outline' | 'solid';
6
+ variant: IconVariant;
6
7
  color: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
7
8
  size: 'sm' | 'md' | 'lg' | 'xl';
8
9
  static styles: import("lit").CSSResult[];
@@ -1 +1 @@
1
- {"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAa,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGtD,qBACa,MAAO,SAAQ,UAAU;IACR,IAAI,EAAE,QAAQ,GAAG,MAAM,CAAM;IAC7B,OAAO,EAAE,SAAS,GAAG,OAAO,CAAa;IAG1B,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAa;IAGlG,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAElF,MAAM,CAAC,MAAM,4BAsCX;IAEF,MAAM,yCAmBL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
1
+ {"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAa,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGtD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,OAAO,CAAC;AAE9C,qBACa,MAAO,SAAQ,UAAU;IACR,IAAI,EAAE,QAAQ,GAAG,MAAM,CAAM;IAC7B,OAAO,EAAE,WAAW,CAAa;IAGlB,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAa;IAGlG,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAElF,MAAM,CAAC,MAAM,4BAsCX;IAEF,MAAM,yCAmBL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { LitElement, html, css } from 'lit';
8
8
  import { customElement, property } from 'lit/decorators.js';
9
- import { resetStyles } from '../../styles/reset';
9
+ import { resetStyles } from '../../styles/reset.js';
10
10
  let StLink = class StLink extends LitElement {
11
11
  constructor() {
12
12
  super(...arguments);
@@ -8,10 +8,21 @@ export declare class StModal extends LitElement {
8
8
  * Title text displayed in the modal header.
9
9
  */
10
10
  heading: string;
11
+ /**
12
+ * Size of the modal (sm, md, lg, xl, xxl).
13
+ */
14
+ size: 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
15
+ /**
16
+ * If true, the modal cannot be closed by clicking the backdrop or pressing Esc.
17
+ */
18
+ static: boolean;
11
19
  private dialogEl;
20
+ private isClosing;
12
21
  static styles: import("lit").CSSResult[];
13
22
  updated(changedProperties: PropertyValues): void;
23
+ private closeWithAnimation;
14
24
  private handleClose;
25
+ private handleCancel;
15
26
  private onDialogClose;
16
27
  private handleBackdropClick;
17
28
  render(): import("lit-html").TemplateResult<1>;
@@ -1 +1 @@
1
- {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5D,qBACa,OAAQ,SAAQ,UAAU;IACrC;;OAEG;IACyC,IAAI,UAAS;IAEzD;;OAEG;IACyB,OAAO,SAAM;IAExB,OAAO,CAAC,QAAQ,CAAqB;IAEtD,MAAM,CAAC,MAAM,4BAwEX;IAEF,OAAO,CAAC,iBAAiB,EAAE,cAAc,QAUxC;IAED,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAY3B,MAAM,yCAuBL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
1
+ {"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/modal/modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAW,MAAM,KAAK,CAAC;AAIrE,qBACa,OAAQ,SAAQ,UAAU;IACrC;;OAEG;IACyC,IAAI,UAAS;IAEzD;;OAEG;IACyB,OAAO,SAAM;IAEzC;;OAEG;IACyB,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAQ;IAE3E;;OAEG;IAC0B,MAAM,UAAS;IAE3B,OAAO,CAAC,QAAQ,CAAqB;IAEtD,OAAO,CAAC,SAAS,CAAS;IAE1B,MAAM,CAAC,MAAM,4BAkHX;IAEF,OAAO,CAAC,iBAAiB,EAAE,cAAc,QAYxC;IAED,OAAO,CAAC,kBAAkB;IAiB1B,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,YAAY;IAOpB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAe3B,MAAM,yCA4BL;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}