@budibase/bbui 3.33.1 → 3.33.3
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
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@budibase/bbui",
|
|
3
3
|
"description": "A UI solution used in the different Budibase projects.",
|
|
4
|
-
"version": "3.33.
|
|
4
|
+
"version": "3.33.3",
|
|
5
5
|
"license": "MPL-2.0",
|
|
6
6
|
"module": "dist/bbui.mjs",
|
|
7
7
|
"exports": {
|
|
@@ -107,5 +107,5 @@
|
|
|
107
107
|
}
|
|
108
108
|
}
|
|
109
109
|
},
|
|
110
|
-
"gitHead": "
|
|
110
|
+
"gitHead": "636f2bfa98c45e71c604b7a655ddedb16871dd85"
|
|
111
111
|
}
|
package/src/Button/Button.svelte
CHANGED
|
@@ -1,32 +1,38 @@
|
|
|
1
|
-
<script>
|
|
1
|
+
<script lang="ts">
|
|
2
2
|
import "@spectrum-css/button/dist/index-vars.css"
|
|
3
3
|
import AbsTooltip from "../Tooltip/AbsTooltip.svelte"
|
|
4
|
+
import { TooltipPosition } from "../constants"
|
|
4
5
|
import { createEventDispatcher } from "svelte"
|
|
5
6
|
import Icon from "../Icon/Icon.svelte"
|
|
6
7
|
|
|
7
|
-
|
|
8
|
+
type IconSize = "XXS" | "XS" | "S" | "M" | "L" | "XL" | "XXL" | "XXXL"
|
|
9
|
+
type IconWeight = "regular" | "bold" | "fill"
|
|
10
|
+
|
|
11
|
+
export let type: "button" | "submit" | "reset" | undefined = undefined
|
|
8
12
|
export let disabled = false
|
|
9
|
-
export let size = "M"
|
|
13
|
+
export let size: IconSize = "M"
|
|
10
14
|
export let cta = false
|
|
11
15
|
export let primary = false
|
|
12
16
|
export let secondary = false
|
|
13
17
|
export let warning = false
|
|
14
18
|
export let overBackground = false
|
|
15
19
|
export let quiet = false
|
|
16
|
-
export let icon = undefined
|
|
17
|
-
export let iconColor = undefined
|
|
18
|
-
export let iconWeight = "regular"
|
|
20
|
+
export let icon: string | undefined = undefined
|
|
21
|
+
export let iconColor: string | undefined = undefined
|
|
22
|
+
export let iconWeight: IconWeight = "regular"
|
|
19
23
|
export let active = false
|
|
20
|
-
export let tooltip =
|
|
24
|
+
export let tooltip: string | null = ""
|
|
25
|
+
export let tooltipPosition: TooltipPosition = TooltipPosition.Top
|
|
21
26
|
export let newStyles = true
|
|
22
|
-
export let id = undefined
|
|
23
|
-
export let ref = undefined
|
|
27
|
+
export let id: string | undefined = undefined
|
|
28
|
+
export let ref: HTMLButtonElement | undefined = undefined
|
|
24
29
|
export let reverse = false
|
|
25
30
|
|
|
26
|
-
const dispatch = createEventDispatcher()
|
|
31
|
+
const dispatch = createEventDispatcher<{ click: undefined }>()
|
|
32
|
+
$: tooltipText = tooltip ?? ""
|
|
27
33
|
</script>
|
|
28
34
|
|
|
29
|
-
<AbsTooltip text={
|
|
35
|
+
<AbsTooltip text={tooltipText} position={tooltipPosition}>
|
|
30
36
|
<button
|
|
31
37
|
{id}
|
|
32
38
|
{type}
|
|
@@ -40,7 +46,7 @@
|
|
|
40
46
|
class:new-styles={newStyles}
|
|
41
47
|
class:active
|
|
42
48
|
class:is-disabled={disabled}
|
|
43
|
-
class="spectrum-Button spectrum-Button--size{size
|
|
49
|
+
class="spectrum-Button spectrum-Button--size{size}"
|
|
44
50
|
on:click|preventDefault={() => {
|
|
45
51
|
if (!disabled) {
|
|
46
52
|
dispatch("click")
|
|
@@ -52,12 +58,7 @@
|
|
|
52
58
|
{/if}
|
|
53
59
|
{#if icon}
|
|
54
60
|
<span class="icon">
|
|
55
|
-
<Icon
|
|
56
|
-
name={icon}
|
|
57
|
-
size={size.toUpperCase()}
|
|
58
|
-
color={iconColor}
|
|
59
|
-
weight={iconWeight}
|
|
60
|
-
/>
|
|
61
|
+
<Icon name={icon} {size} color={iconColor} weight={iconWeight} />
|
|
61
62
|
</span>
|
|
62
63
|
{/if}
|
|
63
64
|
{#if $$slots && !reverse}
|
|
@@ -4,11 +4,13 @@
|
|
|
4
4
|
import { createEventDispatcher } from "svelte"
|
|
5
5
|
import type { EnvDropdownType, LabelPosition } from "../types"
|
|
6
6
|
|
|
7
|
-
export let value: string | undefined = undefined
|
|
7
|
+
export let value: string | number | undefined = undefined
|
|
8
8
|
export let label: string | undefined = undefined
|
|
9
9
|
export let labelPosition: LabelPosition = "above"
|
|
10
10
|
export let placeholder: string | undefined = undefined
|
|
11
11
|
export let type: EnvDropdownType = "text"
|
|
12
|
+
export let required: boolean = false
|
|
13
|
+
export let description: string | undefined = undefined
|
|
12
14
|
export let disabled = false
|
|
13
15
|
export let readonly = false
|
|
14
16
|
export let error: string | undefined = undefined
|
|
@@ -26,7 +28,7 @@
|
|
|
26
28
|
}
|
|
27
29
|
</script>
|
|
28
30
|
|
|
29
|
-
<Field {helpText} {label} {labelPosition} {error}>
|
|
31
|
+
<Field {helpText} {label} {labelPosition} {error} {required} {description}>
|
|
30
32
|
<EnvDropdown
|
|
31
33
|
{updateOnChange}
|
|
32
34
|
{disabled}
|