@platformatic/ui-components 0.19.1 → 0.19.2
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.
package/package.json
CHANGED
|
@@ -12,7 +12,8 @@ import {
|
|
|
12
12
|
ACTIVE_AND_INACTIVE_STATUS,
|
|
13
13
|
TRANSPARENT
|
|
14
14
|
} from './constants'
|
|
15
|
-
|
|
15
|
+
import SpinnerCircular from './loaders/SpinnerCircular'
|
|
16
|
+
|
|
16
17
|
function Button ({
|
|
17
18
|
textClass = '',
|
|
18
19
|
paddingClass = '',
|
|
@@ -28,6 +29,7 @@ function Button ({
|
|
|
28
29
|
platformaticIcon = null,
|
|
29
30
|
platformaticIconAfter = null,
|
|
30
31
|
selected = false,
|
|
32
|
+
loading = false,
|
|
31
33
|
...rest
|
|
32
34
|
}) {
|
|
33
35
|
let buttonClassName = textClass
|
|
@@ -39,7 +41,7 @@ function Button ({
|
|
|
39
41
|
} else {
|
|
40
42
|
contentClassName += `${styles['button-' + size]} `
|
|
41
43
|
}
|
|
42
|
-
if (disabled) {
|
|
44
|
+
if (disabled || loading) {
|
|
43
45
|
tmpBorderedClassName = commonStyles[`bordered--${color}-30`]
|
|
44
46
|
buttonClassName += ` ${styles.disabled}`
|
|
45
47
|
} else {
|
|
@@ -109,6 +111,7 @@ function Button ({
|
|
|
109
111
|
return (
|
|
110
112
|
<button className={`${buttonClassName} ${restClassName()} ${borderedClassName}`} disabled={disabled} alt={label} {...rest} onMouseLeave={() => setHover(false)} onMouseOver={() => setHover(true)}>
|
|
111
113
|
<div className={`${contentClassName} ${backgroundClassName}`}>
|
|
114
|
+
{loading ? <SpinnerCircular className={styles.spinner} size={30} thickness={2} color={color} /> : null}
|
|
112
115
|
{platformaticIcon ? <PlatformaticIcon key='left' iconName={platformaticIcon.iconName} color={platformaticIcon.color} data-testid='button-icon' onClick={null} inactive={inactive} /> : null}
|
|
113
116
|
<span className={styles.label}>{label}</span>
|
|
114
117
|
{platformaticIconAfter ? <PlatformaticIcon key='right' iconName={platformaticIconAfter.iconName} color={platformaticIconAfter.color} data-testid='button-icon' onClick={null} inactive={inactive} /> : null}
|