@@ -157,4 +157,56 @@ export class Link {
157157 document . body . appendChild ( newLink ) ;
158158 }
159159 }
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+ }
160212}
0 commit comments