@@ -48,3 +48,78 @@ export class Badge {
4848 }
4949}
5050
51+ /**
52+ * @class Button
53+ * @description Create a new Neptune Button
54+ *
55+ * @param {any } config Add your configuration
56+ *
57+ * parent -> class or id of your target element, when null its document.body
58+ *
59+ * text -> content of your Button
60+ *
61+ * icon -> add the i tagof your icon
62+ *
63+ * iconPosition -> left or right
64+ *
65+ * size -> s, m, l
66+ *
67+ * style -> primary, cta, information, success, warning, error
68+ *
69+ * @example
70+ * const myButton = new Button({
71+ * parent: "#container",
72+ * text: "My Button",
73+ * size: "m",
74+ * style: "primary"
75+ * });
76+ */
77+ export class Button {
78+ constructor ( config ) {
79+ // Create Badge
80+ const newButton = document . createElement ( 'button' ) ;
81+ newButton . classList . add ( 'button' ) ;
82+ newButton . innerHTML = '<span class="button-text">' + config . text + '</span>' ;
83+
84+ // Add Icon
85+ if ( config . icon != null ) {
86+ const newIcon = document . createElement ( 'span' ) ;
87+ newIcon . innerHTML = config . icon ;
88+
89+ if ( config . iconPosition != null ) {
90+ if ( config . iconPosition == 'left' ) {
91+ newIcon . classList . add ( 'button-icon-left' ) ;
92+ newButton . insertBefore ( newIcon , newButton . children [ 0 ] ) ;
93+
94+ }
95+
96+ if ( config . iconPosition == 'right' ) {
97+ newIcon . classList . add ( 'button-icon-right' ) ;
98+ newButton . appendChild ( newIcon ) ;
99+
100+ }
101+ } else {
102+ console . error ( "Error! Please set icon position!" ) ;
103+ }
104+ }
105+
106+ // Setup Size
107+ if ( config . size != null ) {
108+ newButton . classList . add ( 'button-' + config . size ) ;
109+ }
110+
111+ // Setup Style
112+ if ( config . style != null ) {
113+ // Setup Style
114+ newButton . classList . add ( 'button-' + config . style ) ;
115+ }
116+
117+ // Append badge to DOM
118+ if ( config . parent != null ) {
119+ document . querySelector ( config . parent ) . appendChild ( newButton )
120+ } else {
121+ document . body . appendChild ( newButton ) ;
122+ }
123+ }
124+ }
125+
0 commit comments