@synergy-design-system/components 1.0.0-main.2 → 1.0.0-main.4

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 (146) hide show
  1. package/LICENSE +28 -0
  2. package/README.md +6 -0
  3. package/dist/chunks/chunk.2FIY3TX5.js +32 -0
  4. package/dist/chunks/chunk.2FIY3TX5.js.map +7 -0
  5. package/dist/chunks/chunk.5OIEI73E.js +45 -0
  6. package/dist/chunks/chunk.5OIEI73E.js.map +7 -0
  7. package/dist/chunks/chunk.5PZUAKCS.js +202 -0
  8. package/dist/chunks/chunk.5PZUAKCS.js.map +7 -0
  9. package/dist/chunks/chunk.6C4JXZZN.js +15 -0
  10. package/dist/chunks/chunk.6C4JXZZN.js.map +7 -0
  11. package/dist/chunks/chunk.7EGSHKGV.js +12 -0
  12. package/dist/chunks/chunk.7EGSHKGV.js.map +7 -0
  13. package/dist/chunks/chunk.A3SKDWCT.js +42 -0
  14. package/dist/chunks/chunk.A3SKDWCT.js.map +7 -0
  15. package/dist/chunks/chunk.BQPK6UKU.js +498 -0
  16. package/dist/chunks/chunk.BQPK6UKU.js.map +7 -0
  17. package/dist/chunks/chunk.BREU4ILT.js +28 -0
  18. package/dist/chunks/chunk.BREU4ILT.js.map +7 -0
  19. package/dist/chunks/chunk.C7624ITA.js +30 -0
  20. package/dist/chunks/chunk.C7624ITA.js.map +7 -0
  21. package/dist/chunks/chunk.DJOAQ4JU.js +36 -0
  22. package/dist/chunks/chunk.DJOAQ4JU.js.map +7 -0
  23. package/dist/chunks/chunk.DREO4ZTN.js +10 -0
  24. package/dist/chunks/chunk.DREO4ZTN.js.map +7 -0
  25. package/dist/chunks/chunk.EW2JZPYV.js +12 -0
  26. package/dist/chunks/chunk.EW2JZPYV.js.map +7 -0
  27. package/dist/chunks/chunk.FUYWF5Y2.js +278 -0
  28. package/dist/chunks/chunk.FUYWF5Y2.js.map +7 -0
  29. package/dist/chunks/chunk.ILONRPL4.js +10 -0
  30. package/dist/chunks/chunk.ILONRPL4.js.map +7 -0
  31. package/dist/chunks/chunk.N2I6HVX3.js +71 -0
  32. package/dist/chunks/chunk.N2I6HVX3.js.map +7 -0
  33. package/dist/chunks/chunk.O7USYXBT.js +23 -0
  34. package/dist/chunks/chunk.O7USYXBT.js.map +7 -0
  35. package/dist/chunks/chunk.P22LQI5J.js +376 -0
  36. package/dist/chunks/chunk.P22LQI5J.js.map +7 -0
  37. package/dist/chunks/chunk.Q77OTWF2.js +378 -0
  38. package/dist/chunks/chunk.Q77OTWF2.js.map +7 -0
  39. package/dist/chunks/chunk.R6VNLE6N.js +11 -0
  40. package/dist/chunks/chunk.R6VNLE6N.js.map +7 -0
  41. package/dist/chunks/chunk.SLLG4KJR.js +63 -0
  42. package/dist/chunks/chunk.SLLG4KJR.js.map +7 -0
  43. package/dist/chunks/chunk.U7ZJ22QM.js +128 -0
  44. package/dist/chunks/chunk.U7ZJ22QM.js.map +7 -0
  45. package/dist/chunks/chunk.WDCAHRYG.js +273 -0
  46. package/dist/chunks/chunk.WDCAHRYG.js.map +7 -0
  47. package/dist/chunks/chunk.WTCUSH7V.js +42 -0
  48. package/dist/chunks/chunk.WTCUSH7V.js.map +7 -0
  49. package/dist/chunks/chunk.XGXFE6IF.js +49 -0
  50. package/dist/chunks/chunk.XGXFE6IF.js.map +7 -0
  51. package/dist/components/button/button.component.d.ts +123 -0
  52. package/dist/components/button/button.component.js +24 -0
  53. package/dist/components/button/button.component.js.map +7 -0
  54. package/dist/components/button/button.custom.styles.d.ts +2 -0
  55. package/dist/components/button/button.custom.styles.js +8 -0
  56. package/dist/components/button/button.custom.styles.js.map +7 -0
  57. package/dist/components/button/button.d.ts +8 -0
  58. package/dist/components/button/button.js +25 -0
  59. package/dist/components/button/button.js.map +7 -0
  60. package/dist/components/button/button.styles.d.ts +2 -0
  61. package/dist/components/button/button.styles.js +10 -0
  62. package/dist/components/button/button.styles.js.map +7 -0
  63. package/dist/components/checkbox/checkbox.custom.styles.d.ts +2 -0
  64. package/dist/components/checkbox/checkbox.custom.styles.js +11 -0
  65. package/dist/components/checkbox/checkbox.custom.styles.js.map +7 -0
  66. package/dist/components/icon/icon.component.d.ts +42 -0
  67. package/dist/components/icon/icon.component.js +15 -0
  68. package/dist/components/icon/icon.component.js.map +7 -0
  69. package/dist/components/icon/icon.d.ts +8 -0
  70. package/dist/components/icon/icon.js +19 -0
  71. package/dist/components/icon/icon.js.map +7 -0
  72. package/dist/components/icon/icon.styles.d.ts +2 -0
  73. package/dist/components/icon/icon.styles.js +9 -0
  74. package/dist/components/icon/icon.styles.js.map +7 -0
  75. package/dist/components/icon/library.d.ts +19 -0
  76. package/dist/components/icon/library.default.d.ts +3 -0
  77. package/dist/components/icon/library.default.js +9 -0
  78. package/dist/components/icon/library.default.js.map +7 -0
  79. package/dist/components/icon/library.js +19 -0
  80. package/dist/components/icon/library.js.map +7 -0
  81. package/dist/components/icon/library.system.d.ts +3 -0
  82. package/dist/components/icon/library.system.js +8 -0
  83. package/dist/components/icon/library.system.js.map +7 -0
  84. package/dist/components/input/input.component.d.ts +175 -0
  85. package/dist/components/input/input.component.js +22 -0
  86. package/dist/components/input/input.component.js.map +7 -0
  87. package/dist/components/input/input.custom.styles.d.ts +2 -0
  88. package/dist/components/input/input.custom.styles.js +8 -0
  89. package/dist/components/input/input.custom.styles.js.map +7 -0
  90. package/dist/components/input/input.d.ts +8 -0
  91. package/dist/components/input/input.js +23 -0
  92. package/dist/components/input/input.js.map +7 -0
  93. package/dist/components/input/input.styles.d.ts +2 -0
  94. package/dist/components/input/input.styles.js +10 -0
  95. package/dist/components/input/input.styles.js.map +7 -0
  96. package/dist/components/spinner/spinner.component.d.ts +20 -0
  97. package/dist/components/spinner/spinner.component.js +13 -0
  98. package/dist/components/spinner/spinner.component.js.map +7 -0
  99. package/dist/components/spinner/spinner.styles.d.ts +2 -0
  100. package/dist/components/spinner/spinner.styles.js +9 -0
  101. package/dist/components/spinner/spinner.styles.js.map +7 -0
  102. package/dist/components/textarea/textarea.custom.styles.d.ts +2 -0
  103. package/dist/components/textarea/textarea.custom.styles.js +11 -0
  104. package/dist/components/textarea/textarea.custom.styles.js.map +7 -0
  105. package/dist/custom-elements.json +1870 -0
  106. package/dist/events/events.d.ts +8 -0
  107. package/dist/events/syn-blur.d.ts +6 -0
  108. package/dist/events/syn-change.d.ts +6 -0
  109. package/dist/events/syn-clear.d.ts +6 -0
  110. package/dist/events/syn-error.d.ts +8 -0
  111. package/dist/events/syn-focus.d.ts +6 -0
  112. package/dist/events/syn-input.d.ts +6 -0
  113. package/dist/events/syn-invalid.d.ts +6 -0
  114. package/dist/events/syn-load.d.ts +6 -0
  115. package/dist/internal/default-value.d.ts +2 -0
  116. package/dist/internal/form.d.ts +73 -0
  117. package/dist/internal/slot.d.ts +23 -0
  118. package/dist/internal/synergy-element.d.ts +47 -0
  119. package/dist/internal/test/form-control-base-tests.d.ts +7 -0
  120. package/dist/internal/watch.d.ts +26 -0
  121. package/dist/styles/component.styles.d.ts +2 -0
  122. package/dist/styles/form-control.styles.d.ts +2 -0
  123. package/dist/synergy-autoloader.d.ts +4 -0
  124. package/dist/synergy-autoloader.js +41 -0
  125. package/dist/synergy-autoloader.js.map +7 -0
  126. package/dist/synergy.d.ts +4 -0
  127. package/dist/synergy.js +38 -0
  128. package/dist/synergy.js.map +7 -0
  129. package/dist/translations/de.d.ts +3 -0
  130. package/dist/translations/de.js +46 -0
  131. package/dist/translations/de.js.map +7 -0
  132. package/dist/translations/en.d.ts +3 -0
  133. package/dist/translations/en.js +8 -0
  134. package/dist/translations/en.js.map +7 -0
  135. package/dist/utilities/base-path.d.ts +18 -0
  136. package/dist/utilities/base-path.js +10 -0
  137. package/dist/utilities/base-path.js.map +7 -0
  138. package/dist/utilities/form.d.ts +11 -0
  139. package/dist/utilities/form.js +11 -0
  140. package/dist/utilities/form.js.map +7 -0
  141. package/dist/utilities/localize.d.ts +33 -0
  142. package/dist/utilities/localize.js +11 -0
  143. package/dist/utilities/localize.js.map +7 -0
  144. package/dist/vscode.html-custom-data.json +371 -0
  145. package/dist/web-types.json +738 -0
  146. package/package.json +39 -25
@@ -0,0 +1,36 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
5
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
8
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
9
+ var __spreadValues = (a, b) => {
10
+ for (var prop in b || (b = {}))
11
+ if (__hasOwnProp.call(b, prop))
12
+ __defNormalProp(a, prop, b[prop]);
13
+ if (__getOwnPropSymbols)
14
+ for (var prop of __getOwnPropSymbols(b)) {
15
+ if (__propIsEnum.call(b, prop))
16
+ __defNormalProp(a, prop, b[prop]);
17
+ }
18
+ return a;
19
+ };
20
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
21
+ var __decorateClass = (decorators, target, key, kind) => {
22
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
23
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
24
+ if (decorator = decorators[i])
25
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
26
+ if (kind && result)
27
+ __defProp(target, key, result);
28
+ return result;
29
+ };
30
+
31
+ export {
32
+ __spreadValues,
33
+ __spreadProps,
34
+ __decorateClass
35
+ };
36
+ //# sourceMappingURL=chunk.DJOAQ4JU.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": [],
4
+ "sourcesContent": [],
5
+ "mappings": "",
6
+ "names": []
7
+ }
@@ -0,0 +1,10 @@
1
+ // src/components/button/button.custom.styles.ts
2
+ import { css } from "lit";
3
+ var button_custom_styles_default = css`
4
+ /* Write custom CSS here */
5
+ `;
6
+
7
+ export {
8
+ button_custom_styles_default
9
+ };
10
+ //# sourceMappingURL=chunk.DREO4ZTN.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/components/button/button.custom.styles.ts"],
4
+ "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n /* Write custom CSS here */\n`;\n"],
5
+ "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,+BAAQ;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,12 @@
1
+ import {
2
+ SynInput
3
+ } from "./chunk.BQPK6UKU.js";
4
+
5
+ // src/components/input/input.ts
6
+ var input_default = SynInput;
7
+ SynInput.define("syn-input");
8
+
9
+ export {
10
+ input_default
11
+ };
12
+ //# sourceMappingURL=chunk.EW2JZPYV.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/components/input/input.ts"],
4
+ "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport SynInput from './input.component.js';\n\nexport * from './input.component.js';\nexport default SynInput;\n\nSynInput.define('syn-input');\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'syn-input': SynInput;\n }\n}\n"],
5
+ "mappings": ";;;;;AASA,IAAO,gBAAQ;AAEf,SAAS,OAAO,WAAW;",
6
+ "names": []
7
+ }
@@ -0,0 +1,278 @@
1
+ import {
2
+ SynSpinner
3
+ } from "./chunk.2FIY3TX5.js";
4
+ import {
5
+ HasSlotController
6
+ } from "./chunk.XGXFE6IF.js";
7
+ import {
8
+ LocalizeController
9
+ } from "./chunk.R6VNLE6N.js";
10
+ import {
11
+ FormControlController,
12
+ validValidityState
13
+ } from "./chunk.WDCAHRYG.js";
14
+ import {
15
+ button_styles_default
16
+ } from "./chunk.P22LQI5J.js";
17
+ import {
18
+ SynIcon,
19
+ watch
20
+ } from "./chunk.5PZUAKCS.js";
21
+ import {
22
+ SynergyElement
23
+ } from "./chunk.SLLG4KJR.js";
24
+ import {
25
+ __decorateClass
26
+ } from "./chunk.DJOAQ4JU.js";
27
+
28
+ // src/components/button/button.component.ts
29
+ import { classMap } from "lit/directives/class-map.js";
30
+ import { html, literal } from "lit/static-html.js";
31
+ import { ifDefined } from "lit/directives/if-defined.js";
32
+ import { property, query, state } from "lit/decorators.js";
33
+ var SynButton = class extends SynergyElement {
34
+ constructor() {
35
+ super(...arguments);
36
+ this.formControlController = new FormControlController(this, {
37
+ form: (input) => {
38
+ if (input.hasAttribute("form")) {
39
+ const doc = input.getRootNode();
40
+ const formId = input.getAttribute("form");
41
+ return doc.getElementById(formId);
42
+ }
43
+ return input.closest("form");
44
+ },
45
+ assumeInteractionOn: ["click"]
46
+ });
47
+ this.hasSlotController = new HasSlotController(this, "[default]", "prefix", "suffix");
48
+ this.localize = new LocalizeController(this);
49
+ this.hasFocus = false;
50
+ this.invalid = false;
51
+ this.title = "";
52
+ this.variant = "default";
53
+ this.size = "medium";
54
+ this.caret = false;
55
+ this.disabled = false;
56
+ this.loading = false;
57
+ this.type = "button";
58
+ this.name = "";
59
+ this.value = "";
60
+ this.href = "";
61
+ this.rel = "noreferrer noopener";
62
+ }
63
+ /** Gets the validity state object */
64
+ get validity() {
65
+ if (this.isButton()) {
66
+ return this.button.validity;
67
+ }
68
+ return validValidityState;
69
+ }
70
+ /** Gets the validation message */
71
+ get validationMessage() {
72
+ if (this.isButton()) {
73
+ return this.button.validationMessage;
74
+ }
75
+ return "";
76
+ }
77
+ firstUpdated() {
78
+ if (this.isButton()) {
79
+ this.formControlController.updateValidity();
80
+ }
81
+ }
82
+ handleBlur() {
83
+ this.hasFocus = false;
84
+ this.emit("syn-blur");
85
+ }
86
+ handleFocus() {
87
+ this.hasFocus = true;
88
+ this.emit("syn-focus");
89
+ }
90
+ handleClick() {
91
+ if (this.type === "submit") {
92
+ this.formControlController.submit(this);
93
+ }
94
+ if (this.type === "reset") {
95
+ this.formControlController.reset(this);
96
+ }
97
+ }
98
+ handleInvalid(event) {
99
+ this.formControlController.setValidity(false);
100
+ this.formControlController.emitInvalidEvent(event);
101
+ }
102
+ isButton() {
103
+ return this.href ? false : true;
104
+ }
105
+ isLink() {
106
+ return this.href ? true : false;
107
+ }
108
+ handleDisabledChange() {
109
+ if (this.isButton()) {
110
+ this.formControlController.setValidity(this.disabled);
111
+ }
112
+ }
113
+ /** Simulates a click on the button. */
114
+ click() {
115
+ this.button.click();
116
+ }
117
+ /** Sets focus on the button. */
118
+ focus(options) {
119
+ this.button.focus(options);
120
+ }
121
+ /** Removes focus from the button. */
122
+ blur() {
123
+ this.button.blur();
124
+ }
125
+ /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
126
+ checkValidity() {
127
+ if (this.isButton()) {
128
+ return this.button.checkValidity();
129
+ }
130
+ return true;
131
+ }
132
+ /** Gets the associated form, if one exists. */
133
+ getForm() {
134
+ return this.formControlController.getForm();
135
+ }
136
+ /** Checks for validity and shows the browser's validation message if the control is invalid. */
137
+ reportValidity() {
138
+ if (this.isButton()) {
139
+ return this.button.reportValidity();
140
+ }
141
+ return true;
142
+ }
143
+ /** Sets a custom validation message. Pass an empty string to restore validity. */
144
+ setCustomValidity(message) {
145
+ if (this.isButton()) {
146
+ this.button.setCustomValidity(message);
147
+ this.formControlController.updateValidity();
148
+ }
149
+ }
150
+ render() {
151
+ const isLink = this.isLink();
152
+ const tag = isLink ? literal`a` : literal`button`;
153
+ return html`
154
+ <${tag}
155
+ part="base"
156
+ class=${classMap({
157
+ button: true,
158
+ "button--primary": true,
159
+ "button--text": this.variant === "text",
160
+ "button--small": this.size === "small",
161
+ "button--medium": this.size === "medium",
162
+ "button--large": this.size === "large",
163
+ "button--caret": this.caret,
164
+ "button--disabled": this.disabled,
165
+ "button--focused": this.hasFocus,
166
+ "button--loading": this.loading,
167
+ "button--default": this.variant === "default",
168
+ "button--outline": this.variant === "outline",
169
+ "button--rtl": this.localize.dir() === "rtl",
170
+ "button--has-label": this.hasSlotController.test("[default]"),
171
+ "button--has-prefix": this.hasSlotController.test("prefix"),
172
+ "button--has-suffix": this.hasSlotController.test("suffix")
173
+ })}
174
+ ?disabled=${ifDefined(isLink ? void 0 : this.disabled)}
175
+ type=${ifDefined(isLink ? void 0 : this.type)}
176
+ title=${this.title}
177
+ name=${ifDefined(isLink ? void 0 : this.name)}
178
+ value=${ifDefined(isLink ? void 0 : this.value)}
179
+ href=${ifDefined(isLink ? this.href : void 0)}
180
+ target=${ifDefined(isLink ? this.target : void 0)}
181
+ download=${ifDefined(isLink ? this.download : void 0)}
182
+ rel=${ifDefined(isLink ? this.rel : void 0)}
183
+ role=${ifDefined(isLink ? void 0 : "button")}
184
+ aria-disabled=${this.disabled ? "true" : "false"}
185
+ tabindex=${this.disabled ? "-1" : "0"}
186
+ @blur=${this.handleBlur}
187
+ @focus=${this.handleFocus}
188
+ @invalid=${this.isButton() ? this.handleInvalid : null}
189
+ @click=${this.handleClick}
190
+ >
191
+ <slot name="prefix" part="prefix" class="button__prefix"></slot>
192
+ <slot part="label" class="button__label"></slot>
193
+ <slot name="suffix" part="suffix" class="button__suffix"></slot>
194
+ ${this.caret ? html` <syn-icon part="caret" class="button__caret" library="system" name="caret"></syn-icon> ` : ""}
195
+ ${this.loading ? html`<syn-spinner part="spinner"></syn-spinner>` : ""}
196
+ </${tag}>
197
+ `;
198
+ }
199
+ };
200
+ SynButton.styles = button_styles_default;
201
+ SynButton.dependencies = {
202
+ "syn-icon": SynIcon,
203
+ "syn-spinner": SynSpinner
204
+ };
205
+ __decorateClass([
206
+ query(".button")
207
+ ], SynButton.prototype, "button", 2);
208
+ __decorateClass([
209
+ state()
210
+ ], SynButton.prototype, "hasFocus", 2);
211
+ __decorateClass([
212
+ state()
213
+ ], SynButton.prototype, "invalid", 2);
214
+ __decorateClass([
215
+ property()
216
+ ], SynButton.prototype, "title", 2);
217
+ __decorateClass([
218
+ property({ reflect: true })
219
+ ], SynButton.prototype, "variant", 2);
220
+ __decorateClass([
221
+ property({ reflect: true })
222
+ ], SynButton.prototype, "size", 2);
223
+ __decorateClass([
224
+ property({ type: Boolean, reflect: true })
225
+ ], SynButton.prototype, "caret", 2);
226
+ __decorateClass([
227
+ property({ type: Boolean, reflect: true })
228
+ ], SynButton.prototype, "disabled", 2);
229
+ __decorateClass([
230
+ property({ type: Boolean, reflect: true })
231
+ ], SynButton.prototype, "loading", 2);
232
+ __decorateClass([
233
+ property()
234
+ ], SynButton.prototype, "type", 2);
235
+ __decorateClass([
236
+ property()
237
+ ], SynButton.prototype, "name", 2);
238
+ __decorateClass([
239
+ property()
240
+ ], SynButton.prototype, "value", 2);
241
+ __decorateClass([
242
+ property()
243
+ ], SynButton.prototype, "href", 2);
244
+ __decorateClass([
245
+ property()
246
+ ], SynButton.prototype, "target", 2);
247
+ __decorateClass([
248
+ property()
249
+ ], SynButton.prototype, "rel", 2);
250
+ __decorateClass([
251
+ property()
252
+ ], SynButton.prototype, "download", 2);
253
+ __decorateClass([
254
+ property()
255
+ ], SynButton.prototype, "form", 2);
256
+ __decorateClass([
257
+ property({ attribute: "formaction" })
258
+ ], SynButton.prototype, "formAction", 2);
259
+ __decorateClass([
260
+ property({ attribute: "formenctype" })
261
+ ], SynButton.prototype, "formEnctype", 2);
262
+ __decorateClass([
263
+ property({ attribute: "formmethod" })
264
+ ], SynButton.prototype, "formMethod", 2);
265
+ __decorateClass([
266
+ property({ attribute: "formnovalidate", type: Boolean })
267
+ ], SynButton.prototype, "formNoValidate", 2);
268
+ __decorateClass([
269
+ property({ attribute: "formtarget" })
270
+ ], SynButton.prototype, "formTarget", 2);
271
+ __decorateClass([
272
+ watch("disabled", { waitUntilFirstUpdate: true })
273
+ ], SynButton.prototype, "handleDisabledChange", 1);
274
+
275
+ export {
276
+ SynButton
277
+ };
278
+ //# sourceMappingURL=chunk.FUYWF5Y2.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/components/button/button.component.ts"],
4
+ "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { FormControlController, validValidityState } from '../../internal/form.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport { html, literal } from 'lit/static-html.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query, state } from 'lit/decorators.js';\nimport { watch } from '../../internal/watch.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport SynSpinner from '../spinner/spinner.component.js';\nimport styles from './button.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport type { SynergyFormControl } from '../../internal/synergy-element.js';\n\n/**\n * @summary Buttons represent actions that are available to the user.\n * @documentation https://synergy.style/components/button\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n * @dependency syn-spinner\n *\n * @event syn-blur - Emitted when the button loses focus.\n * @event syn-focus - Emitted when the button gains focus.\n * @event syn-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n *\n * @slot - The button's label.\n * @slot prefix - A presentational prefix icon or similar element.\n * @slot suffix - A presentational suffix icon or similar element.\n *\n * @csspart base - The component's base wrapper.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The button's label.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart caret - The button's caret icon, an `<syn-icon>` element.\n * @csspart spinner - The spinner that shows when the button is in the loading state.\n */\nexport default class SynButton extends SynergyElement implements SynergyFormControl {\n static styles: CSSResultGroup = styles;\n static dependencies = {\n 'syn-icon': SynIcon,\n 'syn-spinner': SynSpinner\n };\n\n private readonly formControlController = new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document | ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click']\n });\n private readonly hasSlotController = new HasSlotController(this, '[default]', 'prefix', 'suffix');\n private readonly localize = new LocalizeController(this);\n\n @query('.button') button: HTMLButtonElement | HTMLLinkElement;\n\n @state() private hasFocus = false;\n @state() invalid = false;\n @property() title = ''; // make reactive to pass through\n\n /** The button's theme variant. */\n @property({ reflect: true }) variant: 'default' | 'outline' | 'text' = 'default';\n\n /** The button's size. */\n @property({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n\n /** Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior. */\n @property({ type: Boolean, reflect: true }) caret = false;\n\n /** Disables the button. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Draws the button in a loading state. */\n @property({ type: Boolean, reflect: true }) loading = false;\n\n /**\n * The type of button. Note that the default value is `button` instead of `submit`, which is opposite of how native\n * `<button>` elements behave. When the type is `submit`, the button will submit the surrounding form.\n */\n @property() type: 'button' | 'submit' | 'reset' = 'button';\n\n /**\n * The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.\n * This attribute is ignored when `href` is present.\n */\n @property() name = '';\n\n /**\n * The value of the button, submitted as a pair with the button's name as part of the form data, but only when this\n * button is the submitter. This attribute is ignored when `href` is present.\n */\n @property() value = '';\n\n /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n @property() href = '';\n\n /** Tells the browser where to open the link. Only used when `href` is present. */\n @property() target: '_blank' | '_parent' | '_self' | '_top';\n\n /**\n * When using `href`, this attribute will map to the underlying link's `rel` attribute. Unlike regular links, the\n * default is `noreferrer noopener` to prevent security exploits. However, if you're using `target` to point to a\n * specific tab/window, this will prevent that from working correctly. You can remove or change the default value by\n * setting the attribute to an empty string or a value of your choice, respectively.\n */\n @property() rel = 'noreferrer noopener';\n\n /** Tells the browser to download the linked file as this filename. Only used when `href` is present. */\n @property() download?: string;\n\n /**\n * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n * value of this attribute must be an id of a form in the same document or shadow root as the button.\n */\n @property() form: string;\n\n /** Used to override the form owner's `action` attribute. */\n @property({ attribute: 'formaction' }) formAction: string;\n\n /** Used to override the form owner's `enctype` attribute. */\n @property({ attribute: 'formenctype' })\n formEnctype: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';\n\n /** Used to override the form owner's `method` attribute. */\n @property({ attribute: 'formmethod' }) formMethod: 'post' | 'get';\n\n /** Used to override the form owner's `novalidate` attribute. */\n @property({ attribute: 'formnovalidate', type: Boolean }) formNoValidate: boolean;\n\n /** Used to override the form owner's `target` attribute. */\n @property({ attribute: 'formtarget' }) formTarget: '_self' | '_blank' | '_parent' | '_top' | string;\n\n /** Gets the validity state object */\n get validity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validity;\n }\n\n return validValidityState;\n }\n\n /** Gets the validation message */\n get validationMessage() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validationMessage;\n }\n\n return '';\n }\n\n firstUpdated() {\n if (this.isButton()) {\n this.formControlController.updateValidity();\n }\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('syn-blur');\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('syn-focus');\n }\n\n private handleClick() {\n if (this.type === 'submit') {\n this.formControlController.submit(this);\n }\n\n if (this.type === 'reset') {\n this.formControlController.reset(this);\n }\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private isButton() {\n return this.href ? false : true;\n }\n\n private isLink() {\n return this.href ? true : false;\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n if (this.isButton()) {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n }\n }\n\n /** Simulates a click on the button. */\n click() {\n this.button.click();\n }\n\n /** Sets focus on the button. */\n focus(options?: FocusOptions) {\n this.button.focus(options);\n }\n\n /** Removes focus from the button. */\n blur() {\n this.button.blur();\n }\n\n /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */\n checkValidity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).checkValidity();\n }\n\n return true;\n }\n\n /** Gets the associated form, if one exists. */\n getForm(): HTMLFormElement | null {\n return this.formControlController.getForm();\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n reportValidity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).reportValidity();\n }\n\n return true;\n }\n\n /** Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n if (this.isButton()) {\n (this.button as HTMLButtonElement).setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n }\n\n render() {\n const isLink = this.isLink();\n const tag = isLink ? literal`a` : literal`button`;\n\n /* eslint-disable lit/no-invalid-html */\n /* eslint-disable lit/binding-positions */\n return html`\n <${tag}\n part=\"base\"\n class=${classMap({\n button: true,\n 'button--primary': true,\n 'button--text': this.variant === 'text',\n 'button--small': this.size === 'small',\n 'button--medium': this.size === 'medium',\n 'button--large': this.size === 'large',\n 'button--caret': this.caret,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--loading': this.loading,\n 'button--default': this.variant === 'default',\n 'button--outline': this.variant === 'outline',\n 'button--rtl': this.localize.dir() === 'rtl',\n 'button--has-label': this.hasSlotController.test('[default]'),\n 'button--has-prefix': this.hasSlotController.test('prefix'),\n 'button--has-suffix': this.hasSlotController.test('suffix')\n })}\n ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n type=${ifDefined(isLink ? undefined : this.type)}\n title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}\n name=${ifDefined(isLink ? undefined : this.name)}\n value=${ifDefined(isLink ? undefined : this.value)}\n href=${ifDefined(isLink ? this.href : undefined)}\n target=${ifDefined(isLink ? this.target : undefined)}\n download=${ifDefined(isLink ? this.download : undefined)}\n rel=${ifDefined(isLink ? this.rel : undefined)}\n role=${ifDefined(isLink ? undefined : 'button')}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @invalid=${this.isButton() ? this.handleInvalid : null}\n @click=${this.handleClick}\n >\n <slot name=\"prefix\" part=\"prefix\" class=\"button__prefix\"></slot>\n <slot part=\"label\" class=\"button__label\"></slot>\n <slot name=\"suffix\" part=\"suffix\" class=\"button__suffix\"></slot>\n ${\n this.caret ? html` <syn-icon part=\"caret\" class=\"button__caret\" library=\"system\" name=\"caret\"></syn-icon> ` : ''\n }\n ${this.loading ? html`<syn-spinner part=\"spinner\"></syn-spinner>` : ''}\n </${tag}>\n `;\n /* eslint-enable lit/no-invalid-html */\n /* eslint-enable lit/binding-positions */\n }\n}\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -0,0 +1,10 @@
1
+ // src/components/input/input.custom.styles.ts
2
+ import { css } from "lit";
3
+ var input_custom_styles_default = css`
4
+ /* Write custom CSS here */
5
+ `;
6
+
7
+ export {
8
+ input_custom_styles_default
9
+ };
10
+ //# sourceMappingURL=chunk.ILONRPL4.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/components/input/input.custom.styles.ts"],
4
+ "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n /* Write custom CSS here */\n`;\n"],
5
+ "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,8BAAQ;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,71 @@
1
+ import {
2
+ component_styles_default
3
+ } from "./chunk.O7USYXBT.js";
4
+
5
+ // src/components/spinner/spinner.styles.ts
6
+ import { css } from "lit";
7
+ var spinner_styles_default = css`
8
+ /* stylelint-disable */
9
+ ${component_styles_default}
10
+
11
+ :host {
12
+ --track-width: 2px;
13
+ --track-color: rgb(128 128 128 / 25%);
14
+ --indicator-color: var(--syn-color-primary-600);
15
+ --speed: 2s;
16
+
17
+ display: inline-flex;
18
+ width: 1em;
19
+ height: 1em;
20
+ }
21
+
22
+ .spinner {
23
+ flex: 1 1 auto;
24
+ height: 100%;
25
+ width: 100%;
26
+ }
27
+
28
+ .spinner__track,
29
+ .spinner__indicator {
30
+ fill: none;
31
+ stroke-width: var(--track-width);
32
+ r: calc(0.5em - var(--track-width) / 2);
33
+ cx: 0.5em;
34
+ cy: 0.5em;
35
+ transform-origin: 50% 50%;
36
+ }
37
+
38
+ .spinner__track {
39
+ stroke: var(--track-color);
40
+ transform-origin: 0% 0%;
41
+ }
42
+
43
+ .spinner__indicator {
44
+ stroke: var(--indicator-color);
45
+ stroke-linecap: round;
46
+ stroke-dasharray: 150% 75%;
47
+ animation: spin var(--speed) linear infinite;
48
+ }
49
+
50
+ @keyframes spin {
51
+ 0% {
52
+ transform: rotate(0deg);
53
+ stroke-dasharray: 0.01em, 2.75em;
54
+ }
55
+
56
+ 50% {
57
+ transform: rotate(450deg);
58
+ stroke-dasharray: 1.375em, 1.375em;
59
+ }
60
+
61
+ 100% {
62
+ transform: rotate(1080deg);
63
+ stroke-dasharray: 0.01em, 2.75em;
64
+ }
65
+ }
66
+ `;
67
+
68
+ export {
69
+ spinner_styles_default
70
+ };
71
+ //# sourceMappingURL=chunk.N2I6HVX3.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/components/spinner/spinner.styles.ts"],
4
+ "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\nimport componentStyles from '../../styles/component.styles.js';\n\nexport default css`\n\t/* stylelint-disable */\n ${componentStyles}\n\n :host {\n --track-width: 2px;\n --track-color: rgb(128 128 128 / 25%);\n --indicator-color: var(--syn-color-primary-600);\n --speed: 2s;\n\n display: inline-flex;\n width: 1em;\n height: 1em;\n }\n\n .spinner {\n flex: 1 1 auto;\n height: 100%;\n width: 100%;\n }\n\n .spinner__track,\n .spinner__indicator {\n fill: none;\n stroke-width: var(--track-width);\n r: calc(0.5em - var(--track-width) / 2);\n cx: 0.5em;\n cy: 0.5em;\n transform-origin: 50% 50%;\n }\n\n .spinner__track {\n stroke: var(--track-color);\n transform-origin: 0% 0%;\n }\n\n .spinner__indicator {\n stroke: var(--indicator-color);\n stroke-linecap: round;\n stroke-dasharray: 150% 75%;\n animation: spin var(--speed) linear infinite;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n stroke-dasharray: 0.01em, 2.75em;\n }\n\n 50% {\n transform: rotate(450deg);\n stroke-dasharray: 1.375em, 1.375em;\n }\n\n 100% {\n transform: rotate(1080deg);\n stroke-dasharray: 0.01em, 2.75em;\n }\n }\n`;\n"],
5
+ "mappings": ";;;;;AAMA,SAAS,WAAW;AAGpB,IAAO,yBAAQ;AAAA;AAAA,IAEX,wBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,23 @@
1
+ // src/styles/component.styles.ts
2
+ import { css } from "lit";
3
+ var component_styles_default = css`
4
+ /* stylelint-disable */
5
+ :host {
6
+ box-sizing: border-box;
7
+ }
8
+
9
+ :host *,
10
+ :host *::before,
11
+ :host *::after {
12
+ box-sizing: inherit;
13
+ }
14
+
15
+ [hidden] {
16
+ display: none !important;
17
+ }
18
+ `;
19
+
20
+ export {
21
+ component_styles_default
22
+ };
23
+ //# sourceMappingURL=chunk.O7USYXBT.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/styles/component.styles.ts"],
4
+ "sourcesContent": ["// ---------------------------------------------------------------------\n// \uD83D\uDD12 AUTOGENERATED BY VENDORISM\n// Removing this comment will prevent it from being managed by it.\n// ---------------------------------------------------------------------\n\n/* eslint-disable */\nimport { css } from 'lit';\n\nexport default css`\n\t/* stylelint-disable */\n :host {\n box-sizing: border-box;\n }\n\n :host *,\n :host *::before,\n :host *::after {\n box-sizing: inherit;\n }\n\n [hidden] {\n display: none !important;\n }\n`;\n"],
5
+ "mappings": ";AAMA,SAAS,WAAW;AAEpB,IAAO,2BAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
+ "names": []
7
+ }