@@ -157,4 +157,56 @@ export class Link {
157
157
document . body . appendChild ( newLink ) ;
158
158
}
159
159
}
160
+ }
161
+
162
+ /**
163
+ * @class Button
164
+ * @description Create a new Neptune Button
165
+ *
166
+ * @param {any } config Add your configuration
167
+ *
168
+ * parent -> class or id of your target element, when null its document.body
169
+ *
170
+ * style -> primary, cta, information, success, warning, error
171
+ *
172
+ * animation -> linnear, eased
173
+ *
174
+ * @example
175
+ * const mySpinner = new Spinner({
176
+ * parent: "#container",
177
+ * style: "primary",
178
+ * animation: "eased"
179
+ * });
180
+ */
181
+ export class Spinner {
182
+ constructor ( config ) {
183
+ // Create Link
184
+ const newSpinner = document . createElement ( 'div' ) ;
185
+ const spinnerInner = document . createElement ( 'div' )
186
+ const spinnerHole = document . createElement ( 'div' )
187
+ newSpinner . classList . add ( 'spinner' ) ;
188
+
189
+ spinnerInner . classList . add ( 'spinner-inner' ) ;
190
+ spinnerHole . classList . add ( 'spinner-hole' ) ;
191
+
192
+ newSpinner . appendChild ( spinnerHole ) ;
193
+ newSpinner . appendChild ( spinnerInner ) ;
194
+
195
+ // Setup Style
196
+ if ( config . style != null ) {
197
+ newSpinner . classList . add ( 'spinner-' + config . style ) ;
198
+ }
199
+
200
+ // Setup Animation
201
+ if ( config . animation != null ) {
202
+ newSpinner . classList . add ( 'spin-' + config . animation )
203
+ }
204
+
205
+ // Append to parent element
206
+ if ( config . parent != null ) {
207
+ document . querySelector ( config . parent ) . appendChild ( newSpinner ) ;
208
+ } else {
209
+ document . body . appendChild ( newSpinner ) ;
210
+ }
211
+ }
160
212
}
0 commit comments