@react-spectrum/button 3.6.0 → 3.7.0
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/dist/main.css +1 -2
- package/dist/main.js +428 -420
- package/dist/main.js.map +1 -1
- package/dist/module.js +411 -379
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +4 -4
- package/dist/types.d.ts.map +1 -1
- package/package.json +12 -12
- package/src/ActionButton.tsx +6 -0
- package/dist/main.css.map +0 -1
package/dist/module.js
CHANGED
|
@@ -1,413 +1,445 @@
|
|
|
1
|
-
import { useToggleState } from "@react-stately/toggle";
|
|
2
|
-
import _spectrumIconsUiCrossSmall from "@spectrum-icons/ui/CrossSmall";
|
|
3
|
-
import { useProviderProps } from "@react-spectrum/provider";
|
|
4
|
-
import { useHover } from "@react-aria/interactions";
|
|
5
|
-
import { useButton, useToggleButton } from "@react-aria/button";
|
|
6
|
-
import { Text } from "@react-spectrum/text";
|
|
7
|
-
import _react from "react";
|
|
8
|
-
import { mergeProps } from "@react-aria/utils";
|
|
9
|
-
import { FocusRing } from "@react-aria/focus";
|
|
10
|
-
import { classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps } from "@react-spectrum/utils";
|
|
11
|
-
import _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
12
|
-
import _babelRuntimeHelpersEsmExtends from "@babel/runtime/helpers/esm/extends";
|
|
13
1
|
import "./main.css";
|
|
2
|
+
import {useSlotProps as $fHJpt$useSlotProps, useFocusableRef as $fHJpt$useFocusableRef, useStyleProps as $fHJpt$useStyleProps, classNames as $fHJpt$classNames, SlotProvider as $fHJpt$SlotProvider} from "@react-spectrum/utils";
|
|
3
|
+
import {FocusRing as $fHJpt$FocusRing} from "@react-aria/focus";
|
|
4
|
+
import {mergeProps as $fHJpt$mergeProps} from "@react-aria/utils";
|
|
5
|
+
import $fHJpt$react from "react";
|
|
6
|
+
import {Text as $fHJpt$Text} from "@react-spectrum/text";
|
|
7
|
+
import {useButton as $fHJpt$useButton, useToggleButton as $fHJpt$useToggleButton} from "@react-aria/button";
|
|
8
|
+
import {useHover as $fHJpt$useHover} from "@react-aria/interactions";
|
|
9
|
+
import {useProviderProps as $fHJpt$useProviderProps} from "@react-spectrum/provider";
|
|
10
|
+
import $fHJpt$spectrumiconsuiCornerTriangle from "@spectrum-icons/ui/CornerTriangle";
|
|
11
|
+
import $fHJpt$spectrumiconsuiCrossSmall from "@spectrum-icons/ui/CrossSmall";
|
|
12
|
+
import {useToggleState as $fHJpt$useToggleState} from "@react-stately/toggle";
|
|
14
13
|
|
|
15
14
|
function $parcel$interopDefault(a) {
|
|
16
15
|
return a && a.__esModule ? a.default : a;
|
|
17
16
|
}
|
|
17
|
+
function $parcel$export(e, n, v, s) {
|
|
18
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
19
|
+
}
|
|
20
|
+
var $541db85b7740d02d$exports = {};
|
|
21
|
+
|
|
22
|
+
$parcel$export($541db85b7740d02d$exports, "Button", () => $541db85b7740d02d$export$353f5b6fc5456de1);
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
var $b7f6498a26cdd616$exports = {};
|
|
28
|
+
|
|
29
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button", () => $b7f6498a26cdd616$export$1db4cca5b4ade39a, (v) => $b7f6498a26cdd616$export$1db4cca5b4ade39a = v);
|
|
30
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton", () => $b7f6498a26cdd616$export$53da69f51b770d3, (v) => $b7f6498a26cdd616$export$53da69f51b770d3 = v);
|
|
31
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-LogicButton", () => $b7f6498a26cdd616$export$36ae67a131730482, (v) => $b7f6498a26cdd616$export$36ae67a131730482 = v);
|
|
32
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-FieldButton", () => $b7f6498a26cdd616$export$a024c99ecf6b5741, (v) => $b7f6498a26cdd616$export$a024c99ecf6b5741 = v);
|
|
33
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ClearButton", () => $b7f6498a26cdd616$export$b752ce409e5660c, (v) => $b7f6498a26cdd616$export$b752ce409e5660c = v);
|
|
34
|
+
$parcel$export($b7f6498a26cdd616$exports, "focus-ring", () => $b7f6498a26cdd616$export$f39a09f249340e2a, (v) => $b7f6498a26cdd616$export$f39a09f249340e2a = v);
|
|
35
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Icon", () => $b7f6498a26cdd616$export$d374b04f30360026, (v) => $b7f6498a26cdd616$export$d374b04f30360026 = v);
|
|
36
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton--emphasized", () => $b7f6498a26cdd616$export$5aabb61a966e266f, (v) => $b7f6498a26cdd616$export$5aabb61a966e266f = v);
|
|
37
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton--staticColor", () => $b7f6498a26cdd616$export$29b7b5d6a5a497c5, (v) => $b7f6498a26cdd616$export$29b7b5d6a5a497c5 = v);
|
|
38
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-hovered", () => $b7f6498a26cdd616$export$b8813cd5d7824ce7, (v) => $b7f6498a26cdd616$export$b8813cd5d7824ce7 = v);
|
|
39
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button-label", () => $b7f6498a26cdd616$export$c081ba562e204942, (v) => $b7f6498a26cdd616$export$c081ba562e204942 = v);
|
|
40
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton-label", () => $b7f6498a26cdd616$export$ebb4635c66bacdb9, (v) => $b7f6498a26cdd616$export$ebb4635c66bacdb9 = v);
|
|
41
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton-hold", () => $b7f6498a26cdd616$export$4a4f01c443eff992, (v) => $b7f6498a26cdd616$export$4a4f01c443eff992 = v);
|
|
42
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton--quiet", () => $b7f6498a26cdd616$export$40e1f009544bacf3, (v) => $b7f6498a26cdd616$export$40e1f009544bacf3 = v);
|
|
43
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-disabled", () => $b7f6498a26cdd616$export$d35bc1e505d1ebbf, (v) => $b7f6498a26cdd616$export$d35bc1e505d1ebbf = v);
|
|
44
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-open", () => $b7f6498a26cdd616$export$a9781837241c946d, (v) => $b7f6498a26cdd616$export$a9781837241c946d = v);
|
|
45
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-FieldButton--quiet", () => $b7f6498a26cdd616$export$5ca7b274e4fff9fc, (v) => $b7f6498a26cdd616$export$5ca7b274e4fff9fc = v);
|
|
46
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ClearButton--overBackground", () => $b7f6498a26cdd616$export$116f2fccf941d34d, (v) => $b7f6498a26cdd616$export$116f2fccf941d34d = v);
|
|
47
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ClearButton--small", () => $b7f6498a26cdd616$export$49280ffa5236ba8b, (v) => $b7f6498a26cdd616$export$49280ffa5236ba8b = v);
|
|
48
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-focused", () => $b7f6498a26cdd616$export$e7dc768d35940237, (v) => $b7f6498a26cdd616$export$e7dc768d35940237 = v);
|
|
49
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-active", () => $b7f6498a26cdd616$export$20fd0f7cd4e6112f, (v) => $b7f6498a26cdd616$export$20fd0f7cd4e6112f = v);
|
|
50
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button--cta", () => $b7f6498a26cdd616$export$b818fdf0052a2cab, (v) => $b7f6498a26cdd616$export$b818fdf0052a2cab = v);
|
|
51
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button--primary", () => $b7f6498a26cdd616$export$c1c3511f5e96e926, (v) => $b7f6498a26cdd616$export$c1c3511f5e96e926 = v);
|
|
52
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button--secondary", () => $b7f6498a26cdd616$export$4f1b75526afd8ff3, (v) => $b7f6498a26cdd616$export$4f1b75526afd8ff3 = v);
|
|
53
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button--warning", () => $b7f6498a26cdd616$export$6f97cef817ff1cac, (v) => $b7f6498a26cdd616$export$6f97cef817ff1cac = v);
|
|
54
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button--overBackground", () => $b7f6498a26cdd616$export$5cda1128f9112d2e, (v) => $b7f6498a26cdd616$export$5cda1128f9112d2e = v);
|
|
55
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-Button--quiet", () => $b7f6498a26cdd616$export$25f049c049371040, (v) => $b7f6498a26cdd616$export$25f049c049371040 = v);
|
|
56
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-selected", () => $b7f6498a26cdd616$export$1e0fb04f31d3c22a, (v) => $b7f6498a26cdd616$export$1e0fb04f31d3c22a = v);
|
|
57
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton--staticWhite", () => $b7f6498a26cdd616$export$ccc536e1adbdc059, (v) => $b7f6498a26cdd616$export$ccc536e1adbdc059 = v);
|
|
58
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-ActionButton--staticBlack", () => $b7f6498a26cdd616$export$8f7c9db66978d20f, (v) => $b7f6498a26cdd616$export$8f7c9db66978d20f = v);
|
|
59
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-LogicButton--and", () => $b7f6498a26cdd616$export$e52daab43a62c528, (v) => $b7f6498a26cdd616$export$e52daab43a62c528 = v);
|
|
60
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-LogicButton--or", () => $b7f6498a26cdd616$export$da76be6126aaa633, (v) => $b7f6498a26cdd616$export$da76be6126aaa633 = v);
|
|
61
|
+
$parcel$export($b7f6498a26cdd616$exports, "is-placeholder", () => $b7f6498a26cdd616$export$e5b2f5233e4e5194, (v) => $b7f6498a26cdd616$export$e5b2f5233e4e5194 = v);
|
|
62
|
+
$parcel$export($b7f6498a26cdd616$exports, "spectrum-FieldButton--invalid", () => $b7f6498a26cdd616$export$c9f503f672e8a3c1, (v) => $b7f6498a26cdd616$export$c9f503f672e8a3c1 = v);
|
|
63
|
+
var $b7f6498a26cdd616$export$1db4cca5b4ade39a;
|
|
64
|
+
var $b7f6498a26cdd616$export$53da69f51b770d3;
|
|
65
|
+
var $b7f6498a26cdd616$export$36ae67a131730482;
|
|
66
|
+
var $b7f6498a26cdd616$export$a024c99ecf6b5741;
|
|
67
|
+
var $b7f6498a26cdd616$export$b752ce409e5660c;
|
|
68
|
+
var $b7f6498a26cdd616$export$f39a09f249340e2a;
|
|
69
|
+
var $b7f6498a26cdd616$export$d374b04f30360026;
|
|
70
|
+
var $b7f6498a26cdd616$export$5aabb61a966e266f;
|
|
71
|
+
var $b7f6498a26cdd616$export$29b7b5d6a5a497c5;
|
|
72
|
+
var $b7f6498a26cdd616$export$b8813cd5d7824ce7;
|
|
73
|
+
var $b7f6498a26cdd616$export$c081ba562e204942;
|
|
74
|
+
var $b7f6498a26cdd616$export$ebb4635c66bacdb9;
|
|
75
|
+
var $b7f6498a26cdd616$export$4a4f01c443eff992;
|
|
76
|
+
var $b7f6498a26cdd616$export$40e1f009544bacf3;
|
|
77
|
+
var $b7f6498a26cdd616$export$d35bc1e505d1ebbf;
|
|
78
|
+
var $b7f6498a26cdd616$export$a9781837241c946d;
|
|
79
|
+
var $b7f6498a26cdd616$export$5ca7b274e4fff9fc;
|
|
80
|
+
var $b7f6498a26cdd616$export$116f2fccf941d34d;
|
|
81
|
+
var $b7f6498a26cdd616$export$49280ffa5236ba8b;
|
|
82
|
+
var $b7f6498a26cdd616$export$e7dc768d35940237;
|
|
83
|
+
var $b7f6498a26cdd616$export$20fd0f7cd4e6112f;
|
|
84
|
+
var $b7f6498a26cdd616$export$b818fdf0052a2cab;
|
|
85
|
+
var $b7f6498a26cdd616$export$c1c3511f5e96e926;
|
|
86
|
+
var $b7f6498a26cdd616$export$4f1b75526afd8ff3;
|
|
87
|
+
var $b7f6498a26cdd616$export$6f97cef817ff1cac;
|
|
88
|
+
var $b7f6498a26cdd616$export$5cda1128f9112d2e;
|
|
89
|
+
var $b7f6498a26cdd616$export$25f049c049371040;
|
|
90
|
+
var $b7f6498a26cdd616$export$1e0fb04f31d3c22a;
|
|
91
|
+
var $b7f6498a26cdd616$export$ccc536e1adbdc059;
|
|
92
|
+
var $b7f6498a26cdd616$export$8f7c9db66978d20f;
|
|
93
|
+
var $b7f6498a26cdd616$export$e52daab43a62c528;
|
|
94
|
+
var $b7f6498a26cdd616$export$da76be6126aaa633;
|
|
95
|
+
var $b7f6498a26cdd616$export$e5b2f5233e4e5194;
|
|
96
|
+
var $b7f6498a26cdd616$export$c9f503f672e8a3c1;
|
|
97
|
+
$b7f6498a26cdd616$export$1db4cca5b4ade39a = "spectrum-Button_e2d99e";
|
|
98
|
+
$b7f6498a26cdd616$export$53da69f51b770d3 = "spectrum-ActionButton_e2d99e";
|
|
99
|
+
$b7f6498a26cdd616$export$36ae67a131730482 = "spectrum-LogicButton_e2d99e";
|
|
100
|
+
$b7f6498a26cdd616$export$a024c99ecf6b5741 = "spectrum-FieldButton_e2d99e";
|
|
101
|
+
$b7f6498a26cdd616$export$b752ce409e5660c = "spectrum-ClearButton_e2d99e";
|
|
102
|
+
$b7f6498a26cdd616$export$f39a09f249340e2a = "focus-ring_e2d99e";
|
|
103
|
+
$b7f6498a26cdd616$export$d374b04f30360026 = "spectrum-Icon_e2d99e";
|
|
104
|
+
$b7f6498a26cdd616$export$5aabb61a966e266f = "spectrum-ActionButton--emphasized_e2d99e";
|
|
105
|
+
$b7f6498a26cdd616$export$29b7b5d6a5a497c5 = "spectrum-ActionButton--staticColor_e2d99e";
|
|
106
|
+
$b7f6498a26cdd616$export$b8813cd5d7824ce7 = "is-hovered_e2d99e";
|
|
107
|
+
$b7f6498a26cdd616$export$c081ba562e204942 = "spectrum-Button-label_e2d99e";
|
|
108
|
+
$b7f6498a26cdd616$export$ebb4635c66bacdb9 = "spectrum-ActionButton-label_e2d99e";
|
|
109
|
+
$b7f6498a26cdd616$export$4a4f01c443eff992 = "spectrum-ActionButton-hold_e2d99e";
|
|
110
|
+
$b7f6498a26cdd616$export$40e1f009544bacf3 = "spectrum-ActionButton--quiet_e2d99e";
|
|
111
|
+
$b7f6498a26cdd616$export$d35bc1e505d1ebbf = "is-disabled_e2d99e";
|
|
112
|
+
$b7f6498a26cdd616$export$a9781837241c946d = "is-open_e2d99e";
|
|
113
|
+
$b7f6498a26cdd616$export$5ca7b274e4fff9fc = "spectrum-FieldButton--quiet_e2d99e";
|
|
114
|
+
$b7f6498a26cdd616$export$116f2fccf941d34d = "spectrum-ClearButton--overBackground_e2d99e";
|
|
115
|
+
$b7f6498a26cdd616$export$49280ffa5236ba8b = "spectrum-ClearButton--small_e2d99e";
|
|
116
|
+
$b7f6498a26cdd616$export$e7dc768d35940237 = "is-focused_e2d99e";
|
|
117
|
+
$b7f6498a26cdd616$export$20fd0f7cd4e6112f = "is-active_e2d99e";
|
|
118
|
+
$b7f6498a26cdd616$export$b818fdf0052a2cab = "spectrum-Button--cta_e2d99e";
|
|
119
|
+
$b7f6498a26cdd616$export$c1c3511f5e96e926 = "spectrum-Button--primary_e2d99e";
|
|
120
|
+
$b7f6498a26cdd616$export$4f1b75526afd8ff3 = "spectrum-Button--secondary_e2d99e";
|
|
121
|
+
$b7f6498a26cdd616$export$6f97cef817ff1cac = "spectrum-Button--warning_e2d99e";
|
|
122
|
+
$b7f6498a26cdd616$export$5cda1128f9112d2e = "spectrum-Button--overBackground_e2d99e";
|
|
123
|
+
$b7f6498a26cdd616$export$25f049c049371040 = "spectrum-Button--quiet_e2d99e";
|
|
124
|
+
$b7f6498a26cdd616$export$1e0fb04f31d3c22a = "is-selected_e2d99e";
|
|
125
|
+
$b7f6498a26cdd616$export$ccc536e1adbdc059 = "spectrum-ActionButton--staticWhite_e2d99e";
|
|
126
|
+
$b7f6498a26cdd616$export$8f7c9db66978d20f = "spectrum-ActionButton--staticBlack_e2d99e";
|
|
127
|
+
$b7f6498a26cdd616$export$e52daab43a62c528 = "spectrum-LogicButton--and_e2d99e";
|
|
128
|
+
$b7f6498a26cdd616$export$da76be6126aaa633 = "spectrum-LogicButton--or_e2d99e";
|
|
129
|
+
$b7f6498a26cdd616$export$e5b2f5233e4e5194 = "is-placeholder_e2d99e";
|
|
130
|
+
$b7f6498a26cdd616$export$c9f503f672e8a3c1 = "spectrum-FieldButton--invalid_e2d99e";
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
|
|
135
|
+
|
|
18
136
|
|
|
19
|
-
// ASSET: /Users/govett/dev/react-spectrum-v3/node_modules/@adobe/spectrum-css-temp/components/button/vars.css
|
|
20
|
-
var $a0b8eb4b46824fd288195a4db8814b$exports = {};
|
|
21
|
-
$a0b8eb4b46824fd288195a4db8814b$exports = {
|
|
22
|
-
"spectrum-Button": "_spectrum-Button_7a745",
|
|
23
|
-
"spectrum-ActionButton": "_spectrum-ActionButton_7a745",
|
|
24
|
-
"spectrum-LogicButton": "_spectrum-LogicButton_7a745",
|
|
25
|
-
"spectrum-FieldButton": "_spectrum-FieldButton_7a745",
|
|
26
|
-
"spectrum-ClearButton": "_spectrum-ClearButton_7a745",
|
|
27
|
-
"focus-ring": "_focus-ring_7a745",
|
|
28
|
-
"spectrum-Icon": "_spectrum-Icon_7a745",
|
|
29
|
-
"spectrum-ActionButton--emphasized": "_spectrum-ActionButton--emphasized_7a745",
|
|
30
|
-
"spectrum-ActionButton--staticColor": "_spectrum-ActionButton--staticColor_7a745",
|
|
31
|
-
"is-hovered": "_is-hovered_7a745",
|
|
32
|
-
"spectrum-Button-label": "_spectrum-Button-label_7a745",
|
|
33
|
-
"spectrum-ActionButton-label": "_spectrum-ActionButton-label_7a745",
|
|
34
|
-
"spectrum-ActionButton-hold": "_spectrum-ActionButton-hold_7a745",
|
|
35
|
-
"spectrum-ActionButton--quiet": "_spectrum-ActionButton--quiet_7a745",
|
|
36
|
-
"is-disabled": "_is-disabled_7a745",
|
|
37
|
-
"is-open": "_is-open_7a745",
|
|
38
|
-
"spectrum-FieldButton--quiet": "_spectrum-FieldButton--quiet_7a745",
|
|
39
|
-
"spectrum-ClearButton--overBackground": "_spectrum-ClearButton--overBackground_7a745",
|
|
40
|
-
"spectrum-ClearButton--small": "_spectrum-ClearButton--small_7a745",
|
|
41
|
-
"is-focused": "_is-focused_7a745",
|
|
42
|
-
"is-active": "_is-active_7a745",
|
|
43
|
-
"spectrum-Button--cta": "_spectrum-Button--cta_7a745",
|
|
44
|
-
"spectrum-Button--primary": "_spectrum-Button--primary_7a745",
|
|
45
|
-
"spectrum-Button--secondary": "_spectrum-Button--secondary_7a745",
|
|
46
|
-
"spectrum-Button--warning": "_spectrum-Button--warning_7a745",
|
|
47
|
-
"spectrum-Button--overBackground": "_spectrum-Button--overBackground_7a745",
|
|
48
|
-
"spectrum-Button--quiet": "_spectrum-Button--quiet_7a745",
|
|
49
|
-
"is-selected": "_is-selected_7a745",
|
|
50
|
-
"spectrum-ActionButton--staticWhite": "_spectrum-ActionButton--staticWhite_7a745",
|
|
51
|
-
"spectrum-ActionButton--staticBlack": "_spectrum-ActionButton--staticBlack_7a745",
|
|
52
|
-
"spectrum-LogicButton--and": "_spectrum-LogicButton--and_7a745",
|
|
53
|
-
"spectrum-LogicButton--or": "_spectrum-LogicButton--or_7a745",
|
|
54
|
-
"is-placeholder": "_is-placeholder_7a745",
|
|
55
|
-
"spectrum-FieldButton--invalid": "_spectrum-FieldButton--invalid_7a745"
|
|
56
|
-
};
|
|
57
137
|
// todo: CSS hasn't caught up yet, map
|
|
58
|
-
let $
|
|
59
|
-
|
|
138
|
+
let $541db85b7740d02d$var$VARIANT_MAPPING = {
|
|
139
|
+
negative: 'warning'
|
|
60
140
|
};
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
return /*#__PURE__*/_react.createElement(FocusRing, {
|
|
98
|
-
focusRingClass: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'focus-ring'),
|
|
99
|
-
autoFocus: autoFocus
|
|
100
|
-
}, /*#__PURE__*/_react.createElement(ElementType, _babelRuntimeHelpersEsmExtends({}, styleProps, mergeProps(buttonProps, hoverProps), {
|
|
101
|
-
ref: domRef,
|
|
102
|
-
className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-Button', "spectrum-Button--" + buttonVariant, {
|
|
103
|
-
'spectrum-Button--quiet': isQuiet,
|
|
104
|
-
'is-disabled': isDisabled,
|
|
105
|
-
'is-active': isPressed,
|
|
106
|
-
'is-hovered': isHovered
|
|
107
|
-
}, styleProps.className)
|
|
108
|
-
}), /*#__PURE__*/_react.createElement(SlotProvider, {
|
|
109
|
-
slots: {
|
|
110
|
-
icon: {
|
|
111
|
-
size: 'S',
|
|
112
|
-
UNSAFE_className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-Icon')
|
|
113
|
-
},
|
|
114
|
-
text: {
|
|
115
|
-
UNSAFE_className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-Button-label')
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
}, typeof children === 'string' ? /*#__PURE__*/_react.createElement(Text, null, children) : children)));
|
|
141
|
+
function $541db85b7740d02d$var$Button(props, ref) {
|
|
142
|
+
props = $fHJpt$useProviderProps(props);
|
|
143
|
+
props = $fHJpt$useSlotProps(props, 'button');
|
|
144
|
+
let { elementType: ElementType = 'button' , children: children , variant: variant , isQuiet: isQuiet , isDisabled: isDisabled , autoFocus: autoFocus , ...otherProps } = props;
|
|
145
|
+
let domRef = $fHJpt$useFocusableRef(ref);
|
|
146
|
+
let { buttonProps: buttonProps , isPressed: isPressed } = $fHJpt$useButton(props, domRef);
|
|
147
|
+
let { hoverProps: hoverProps , isHovered: isHovered } = $fHJpt$useHover({
|
|
148
|
+
isDisabled: isDisabled
|
|
149
|
+
});
|
|
150
|
+
let { styleProps: styleProps } = $fHJpt$useStyleProps(otherProps);
|
|
151
|
+
let buttonVariant = variant;
|
|
152
|
+
if ($541db85b7740d02d$var$VARIANT_MAPPING[variant]) buttonVariant = $541db85b7740d02d$var$VARIANT_MAPPING[variant];
|
|
153
|
+
return(/*#__PURE__*/ $fHJpt$react.createElement($fHJpt$FocusRing, {
|
|
154
|
+
focusRingClass: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'focus-ring'),
|
|
155
|
+
autoFocus: autoFocus
|
|
156
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement(ElementType, {
|
|
157
|
+
...styleProps,
|
|
158
|
+
...$fHJpt$mergeProps(buttonProps, hoverProps),
|
|
159
|
+
ref: domRef,
|
|
160
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Button', `spectrum-Button--${buttonVariant}`, {
|
|
161
|
+
'spectrum-Button--quiet': isQuiet,
|
|
162
|
+
'is-disabled': isDisabled,
|
|
163
|
+
'is-active': isPressed,
|
|
164
|
+
'is-hovered': isHovered
|
|
165
|
+
}, styleProps.className)
|
|
166
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$SlotProvider, {
|
|
167
|
+
slots: {
|
|
168
|
+
icon: {
|
|
169
|
+
size: 'S',
|
|
170
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Icon')
|
|
171
|
+
},
|
|
172
|
+
text: {
|
|
173
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Button-label')
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
}, typeof children === 'string' ? /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$Text, null, children) : children))));
|
|
119
177
|
}
|
|
120
178
|
/**
|
|
121
179
|
* Buttons allow users to perform an action or to navigate to another page.
|
|
122
180
|
* They have multiple styles for various needs, and are ideal for calling attention to
|
|
123
181
|
* where a user needs to do something in order to move forward in a flow.
|
|
124
|
-
*/
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
} = useButton(props, domRef);
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
} =
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
}
|
|
183
|
-
}, typeof children === 'string' || isTextOnly ? /*#__PURE__*/_react.createElement(Text, null, children) : children)));
|
|
182
|
+
*/ let $541db85b7740d02d$export$353f5b6fc5456de1 = /*#__PURE__*/ $fHJpt$react.forwardRef($541db85b7740d02d$var$Button);
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
var $6e14e6d2d3d4214c$exports = {};
|
|
186
|
+
|
|
187
|
+
$parcel$export($6e14e6d2d3d4214c$exports, "ActionButton", () => $6e14e6d2d3d4214c$export$cfc7921d29ef7b80);
|
|
188
|
+
|
|
189
|
+
|
|
190
|
+
|
|
191
|
+
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
|
|
195
|
+
|
|
196
|
+
|
|
197
|
+
|
|
198
|
+
function $6e14e6d2d3d4214c$var$ActionButton(props, ref) {
|
|
199
|
+
props = $fHJpt$useProviderProps(props);
|
|
200
|
+
props = $fHJpt$useSlotProps(props, 'actionButton');
|
|
201
|
+
let { isQuiet: isQuiet , isDisabled: isDisabled , staticColor: staticColor , children: children , autoFocus: autoFocus , holdAffordance: // @ts-ignore (private)
|
|
202
|
+
holdAffordance , ...otherProps } = props;
|
|
203
|
+
let domRef = $fHJpt$useFocusableRef(ref);
|
|
204
|
+
let { buttonProps: buttonProps , isPressed: isPressed } = $fHJpt$useButton(props, domRef);
|
|
205
|
+
let { hoverProps: hoverProps , isHovered: isHovered } = $fHJpt$useHover({
|
|
206
|
+
isDisabled: isDisabled
|
|
207
|
+
});
|
|
208
|
+
let { styleProps: styleProps } = $fHJpt$useStyleProps(otherProps);
|
|
209
|
+
let isTextOnly = $fHJpt$react.Children.toArray(props.children).every((c)=>!/*#__PURE__*/ $fHJpt$react.isValidElement(c)
|
|
210
|
+
);
|
|
211
|
+
return(/*#__PURE__*/ $fHJpt$react.createElement($fHJpt$FocusRing, {
|
|
212
|
+
focusRingClass: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'focus-ring'),
|
|
213
|
+
autoFocus: autoFocus
|
|
214
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement("button", {
|
|
215
|
+
...styleProps,
|
|
216
|
+
...$fHJpt$mergeProps(buttonProps, hoverProps),
|
|
217
|
+
ref: domRef,
|
|
218
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-ActionButton', {
|
|
219
|
+
'spectrum-ActionButton--quiet': isQuiet,
|
|
220
|
+
'spectrum-ActionButton--staticColor': !!staticColor,
|
|
221
|
+
'spectrum-ActionButton--staticWhite': staticColor === 'white',
|
|
222
|
+
'spectrum-ActionButton--staticBlack': staticColor === 'black',
|
|
223
|
+
'is-active': isPressed,
|
|
224
|
+
'is-disabled': isDisabled,
|
|
225
|
+
'is-hovered': isHovered
|
|
226
|
+
}, styleProps.className)
|
|
227
|
+
}, holdAffordance && /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$spectrumiconsuiCornerTriangle, {
|
|
228
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-ActionButton-hold')
|
|
229
|
+
}), /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$SlotProvider, {
|
|
230
|
+
slots: {
|
|
231
|
+
icon: {
|
|
232
|
+
size: 'S',
|
|
233
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Icon')
|
|
234
|
+
},
|
|
235
|
+
text: {
|
|
236
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-ActionButton-label')
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
}, typeof children === 'string' || isTextOnly ? /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$Text, null, children) : children))));
|
|
184
240
|
}
|
|
185
241
|
/**
|
|
186
242
|
* ActionButtons allow users to perform an action.
|
|
187
243
|
* They’re used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren’t meant to draw a lot of attention.
|
|
188
|
-
*/
|
|
244
|
+
*/ let $6e14e6d2d3d4214c$export$cfc7921d29ef7b80 = /*#__PURE__*/ $fHJpt$react.forwardRef($6e14e6d2d3d4214c$var$ActionButton);
|
|
245
|
+
|
|
246
|
+
|
|
247
|
+
var $d719b239c270b445$exports = {};
|
|
248
|
+
|
|
249
|
+
$parcel$export($d719b239c270b445$exports, "FieldButton", () => $d719b239c270b445$export$47dc48f595b075da);
|
|
250
|
+
|
|
251
|
+
|
|
252
|
+
|
|
253
|
+
|
|
189
254
|
|
|
190
255
|
|
|
191
|
-
export let ActionButton = /*#__PURE__*/_react.forwardRef($bc80af2826ac4208742b91a4749726d$var$ActionButton);
|
|
192
256
|
|
|
193
257
|
// @private
|
|
194
|
-
function $
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
autoFocus: autoFocus
|
|
225
|
-
}, /*#__PURE__*/_react.createElement("button", _babelRuntimeHelpersEsmExtends({}, mergeProps(buttonProps, hoverProps), {
|
|
226
|
-
ref: domRef,
|
|
227
|
-
className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-FieldButton', {
|
|
228
|
-
'spectrum-FieldButton--quiet': isQuiet,
|
|
229
|
-
'is-active': isActive || isPressed,
|
|
230
|
-
'is-disabled': isDisabled,
|
|
231
|
-
'spectrum-FieldButton--invalid': validationState === 'invalid',
|
|
232
|
-
'is-hovered': isHovered
|
|
233
|
-
}, styleProps.className)
|
|
234
|
-
}), /*#__PURE__*/_react.createElement(SlotProvider, {
|
|
235
|
-
slots: {
|
|
236
|
-
icon: {
|
|
237
|
-
size: 'S',
|
|
238
|
-
UNSAFE_className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-Icon')
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
}, children)));
|
|
258
|
+
function $d719b239c270b445$var$FieldButton(props, ref) {
|
|
259
|
+
props = $fHJpt$useSlotProps(props, 'button');
|
|
260
|
+
let { isQuiet: isQuiet , isDisabled: isDisabled , validationState: validationState , children: children , autoFocus: autoFocus , isActive: isActive , focusRingClass: focusRingClass , ...otherProps } = props;
|
|
261
|
+
let domRef = $fHJpt$useFocusableRef(ref);
|
|
262
|
+
let { buttonProps: buttonProps , isPressed: isPressed } = $fHJpt$useButton(props, domRef);
|
|
263
|
+
let { hoverProps: hoverProps , isHovered: isHovered } = $fHJpt$useHover({
|
|
264
|
+
isDisabled: isDisabled
|
|
265
|
+
});
|
|
266
|
+
let { styleProps: styleProps } = $fHJpt$useStyleProps(otherProps);
|
|
267
|
+
return(/*#__PURE__*/ $fHJpt$react.createElement($fHJpt$FocusRing, {
|
|
268
|
+
focusRingClass: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'focus-ring', focusRingClass),
|
|
269
|
+
autoFocus: autoFocus
|
|
270
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement("button", {
|
|
271
|
+
...$fHJpt$mergeProps(buttonProps, hoverProps),
|
|
272
|
+
ref: domRef,
|
|
273
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-FieldButton', {
|
|
274
|
+
'spectrum-FieldButton--quiet': isQuiet,
|
|
275
|
+
'is-active': isActive || isPressed,
|
|
276
|
+
'is-disabled': isDisabled,
|
|
277
|
+
'spectrum-FieldButton--invalid': validationState === 'invalid',
|
|
278
|
+
'is-hovered': isHovered
|
|
279
|
+
}, styleProps.className)
|
|
280
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$SlotProvider, {
|
|
281
|
+
slots: {
|
|
282
|
+
icon: {
|
|
283
|
+
size: 'S',
|
|
284
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Icon')
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
}, children))));
|
|
242
288
|
}
|
|
289
|
+
let $d719b239c270b445$export$47dc48f595b075da = /*#__PURE__*/ $fHJpt$react.forwardRef($d719b239c270b445$var$FieldButton);
|
|
290
|
+
|
|
291
|
+
|
|
292
|
+
var $a62aa7e81765f7e1$exports = {};
|
|
293
|
+
|
|
294
|
+
$parcel$export($a62aa7e81765f7e1$exports, "LogicButton", () => $a62aa7e81765f7e1$export$9b0b80fed00ba8b1);
|
|
295
|
+
|
|
296
|
+
|
|
243
297
|
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
children,
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
} =
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
}, /*#__PURE__*/_react.createElement("button", _babelRuntimeHelpersEsmExtends({}, styleProps, mergeProps(buttonProps, hoverProps), {
|
|
275
|
-
ref: domRef,
|
|
276
|
-
className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-LogicButton', {
|
|
277
|
-
["spectrum-LogicButton--" + variant]: variant,
|
|
278
|
-
'is-disabled': isDisabled,
|
|
279
|
-
'is-active': isPressed,
|
|
280
|
-
'is-hovered': isHovered
|
|
281
|
-
}, styleProps.className)
|
|
282
|
-
}), /*#__PURE__*/_react.createElement("span", {
|
|
283
|
-
className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-Button-label')
|
|
284
|
-
}, children)));
|
|
298
|
+
|
|
299
|
+
|
|
300
|
+
|
|
301
|
+
|
|
302
|
+
|
|
303
|
+
function $a62aa7e81765f7e1$var$LogicButton(props, ref) {
|
|
304
|
+
props = $fHJpt$useProviderProps(props);
|
|
305
|
+
let { variant: variant , children: children , isDisabled: isDisabled , autoFocus: autoFocus , ...otherProps } = props;
|
|
306
|
+
let domRef = $fHJpt$useFocusableRef(ref);
|
|
307
|
+
let { buttonProps: buttonProps , isPressed: isPressed } = $fHJpt$useButton(props, domRef);
|
|
308
|
+
let { hoverProps: hoverProps , isHovered: isHovered } = $fHJpt$useHover({
|
|
309
|
+
isDisabled: isDisabled
|
|
310
|
+
});
|
|
311
|
+
let { styleProps: styleProps } = $fHJpt$useStyleProps(otherProps);
|
|
312
|
+
return(/*#__PURE__*/ $fHJpt$react.createElement($fHJpt$FocusRing, {
|
|
313
|
+
focusRingClass: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'focus-ring'),
|
|
314
|
+
autoFocus: autoFocus
|
|
315
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement("button", {
|
|
316
|
+
...styleProps,
|
|
317
|
+
...$fHJpt$mergeProps(buttonProps, hoverProps),
|
|
318
|
+
ref: domRef,
|
|
319
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-LogicButton', {
|
|
320
|
+
[`spectrum-LogicButton--${variant}`]: variant,
|
|
321
|
+
'is-disabled': isDisabled,
|
|
322
|
+
'is-active': isPressed,
|
|
323
|
+
'is-hovered': isHovered
|
|
324
|
+
}, styleProps.className)
|
|
325
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement("span", {
|
|
326
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Button-label')
|
|
327
|
+
}, children))));
|
|
285
328
|
}
|
|
286
329
|
/**
|
|
287
330
|
* A LogicButton displays an operator within a boolean logic sequence.
|
|
288
|
-
*/
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
children = /*#__PURE__*/_react.createElement(_spectrumIconsUiCrossSmall, {
|
|
296
|
-
UNSAFE_className: $a0b8eb4b46824fd288195a4db8814b$$interop$default['spectrum-Icon']
|
|
297
|
-
}),
|
|
298
|
-
focusClassName,
|
|
299
|
-
variant,
|
|
300
|
-
autoFocus,
|
|
301
|
-
isDisabled,
|
|
302
|
-
preventFocus,
|
|
303
|
-
elementType = preventFocus ? 'div' : 'button'
|
|
304
|
-
} = props,
|
|
305
|
-
otherProps = _babelRuntimeHelpersEsmObjectWithoutPropertiesLoose(props, ["children", "focusClassName", "variant", "autoFocus", "isDisabled", "preventFocus", "elementType"]);
|
|
306
|
-
|
|
307
|
-
let domRef = useFocusableRef(ref);
|
|
308
|
-
let {
|
|
309
|
-
buttonProps,
|
|
310
|
-
isPressed
|
|
311
|
-
} = useButton(_babelRuntimeHelpersEsmExtends({}, props, {
|
|
312
|
-
elementType
|
|
313
|
-
}), domRef);
|
|
314
|
-
let {
|
|
315
|
-
hoverProps,
|
|
316
|
-
isHovered
|
|
317
|
-
} = useHover({
|
|
318
|
-
isDisabled
|
|
319
|
-
});
|
|
320
|
-
let {
|
|
321
|
-
styleProps
|
|
322
|
-
} = useStyleProps(otherProps); // For cases like the clear button in a search field, remove the tabIndex so
|
|
323
|
-
// iOS 14 with VoiceOver doesn't focus the button and hide the keyboard when
|
|
324
|
-
// moving the cursor over the clear button.
|
|
325
|
-
|
|
326
|
-
if (preventFocus) {
|
|
327
|
-
delete buttonProps.tabIndex;
|
|
328
|
-
}
|
|
329
|
-
|
|
330
|
-
let ElementType = elementType;
|
|
331
|
-
return /*#__PURE__*/_react.createElement(FocusRing, {
|
|
332
|
-
focusRingClass: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'focus-ring', focusClassName),
|
|
333
|
-
autoFocus: autoFocus
|
|
334
|
-
}, /*#__PURE__*/_react.createElement(ElementType, _babelRuntimeHelpersEsmExtends({}, styleProps, mergeProps(buttonProps, hoverProps), {
|
|
335
|
-
ref: domRef,
|
|
336
|
-
className: classNames($a0b8eb4b46824fd288195a4db8814b$$interop$default, 'spectrum-ClearButton', {
|
|
337
|
-
["spectrum-ClearButton--" + variant]: variant,
|
|
338
|
-
'is-disabled': isDisabled,
|
|
339
|
-
'is-active': isPressed,
|
|
340
|
-
'is-hovered': isHovered
|
|
341
|
-
}, styleProps.className)
|
|
342
|
-
}), children));
|
|
343
|
-
}
|
|
331
|
+
*/ let $a62aa7e81765f7e1$export$9b0b80fed00ba8b1 = /*#__PURE__*/ $fHJpt$react.forwardRef($a62aa7e81765f7e1$var$LogicButton);
|
|
332
|
+
|
|
333
|
+
|
|
334
|
+
var $9a5d81ee0c9a6503$exports = {};
|
|
335
|
+
|
|
336
|
+
$parcel$export($9a5d81ee0c9a6503$exports, "ClearButton", () => $9a5d81ee0c9a6503$export$13ec83e50bf04290);
|
|
337
|
+
|
|
344
338
|
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
339
|
+
|
|
340
|
+
|
|
341
|
+
|
|
342
|
+
|
|
343
|
+
|
|
344
|
+
|
|
345
|
+
function $9a5d81ee0c9a6503$var$ClearButton(props, ref) {
|
|
346
|
+
let { children: children = /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$spectrumiconsuiCrossSmall, {
|
|
347
|
+
UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports))['spectrum-Icon']
|
|
348
|
+
}) , focusClassName: focusClassName , variant: variant , autoFocus: autoFocus , isDisabled: isDisabled , preventFocus: preventFocus , elementType: elementType = preventFocus ? 'div' : 'button' , ...otherProps } = props;
|
|
349
|
+
let domRef = $fHJpt$useFocusableRef(ref);
|
|
350
|
+
let { buttonProps: buttonProps , isPressed: isPressed } = $fHJpt$useButton({
|
|
351
|
+
...props,
|
|
352
|
+
elementType: elementType
|
|
353
|
+
}, domRef);
|
|
354
|
+
let { hoverProps: hoverProps , isHovered: isHovered } = $fHJpt$useHover({
|
|
355
|
+
isDisabled: isDisabled
|
|
356
|
+
});
|
|
357
|
+
let { styleProps: styleProps } = $fHJpt$useStyleProps(otherProps);
|
|
358
|
+
// For cases like the clear button in a search field, remove the tabIndex so
|
|
359
|
+
// iOS 14 with VoiceOver doesn't focus the button and hide the keyboard when
|
|
360
|
+
// moving the cursor over the clear button.
|
|
361
|
+
if (preventFocus) delete buttonProps.tabIndex;
|
|
362
|
+
let ElementType = elementType;
|
|
363
|
+
return(/*#__PURE__*/ $fHJpt$react.createElement($fHJpt$FocusRing, {
|
|
364
|
+
focusRingClass: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'focus-ring', focusClassName),
|
|
365
|
+
autoFocus: autoFocus
|
|
366
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement(ElementType, {
|
|
367
|
+
...styleProps,
|
|
368
|
+
...$fHJpt$mergeProps(buttonProps, hoverProps),
|
|
369
|
+
ref: domRef,
|
|
370
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-ClearButton', {
|
|
371
|
+
[`spectrum-ClearButton--${variant}`]: variant,
|
|
372
|
+
'is-disabled': isDisabled,
|
|
373
|
+
'is-active': isPressed,
|
|
374
|
+
'is-hovered': isHovered
|
|
375
|
+
}, styleProps.className)
|
|
376
|
+
}, children)));
|
|
377
|
+
}
|
|
378
|
+
let $9a5d81ee0c9a6503$export$13ec83e50bf04290 = /*#__PURE__*/ $fHJpt$react.forwardRef($9a5d81ee0c9a6503$var$ClearButton);
|
|
379
|
+
|
|
380
|
+
|
|
381
|
+
var $62657bdfd15f871f$exports = {};
|
|
382
|
+
|
|
383
|
+
$parcel$export($62657bdfd15f871f$exports, "ToggleButton", () => $62657bdfd15f871f$export$d2b052e7b4be1756);
|
|
384
|
+
|
|
385
|
+
|
|
386
|
+
|
|
387
|
+
|
|
388
|
+
|
|
389
|
+
|
|
390
|
+
|
|
391
|
+
|
|
392
|
+
|
|
393
|
+
|
|
394
|
+
function $62657bdfd15f871f$var$ToggleButton(props, ref) {
|
|
395
|
+
props = $fHJpt$useProviderProps(props);
|
|
396
|
+
let { isQuiet: isQuiet , isDisabled: isDisabled , isEmphasized: isEmphasized , staticColor: staticColor , children: children , autoFocus: autoFocus , ...otherProps } = props;
|
|
397
|
+
let domRef = $fHJpt$useFocusableRef(ref);
|
|
398
|
+
let state = $fHJpt$useToggleState(props);
|
|
399
|
+
let { buttonProps: buttonProps , isPressed: isPressed } = $fHJpt$useToggleButton(props, state, domRef);
|
|
400
|
+
let { hoverProps: hoverProps , isHovered: isHovered } = $fHJpt$useHover({
|
|
401
|
+
isDisabled: isDisabled
|
|
402
|
+
});
|
|
403
|
+
let { styleProps: styleProps } = $fHJpt$useStyleProps(otherProps);
|
|
404
|
+
let isTextOnly = $fHJpt$react.Children.toArray(props.children).every((c)=>!/*#__PURE__*/ $fHJpt$react.isValidElement(c)
|
|
405
|
+
);
|
|
406
|
+
return(/*#__PURE__*/ $fHJpt$react.createElement($fHJpt$FocusRing, {
|
|
407
|
+
focusRingClass: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'focus-ring'),
|
|
408
|
+
autoFocus: autoFocus
|
|
409
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement("button", {
|
|
410
|
+
...styleProps,
|
|
411
|
+
...$fHJpt$mergeProps(buttonProps, hoverProps),
|
|
412
|
+
ref: domRef,
|
|
413
|
+
className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-ActionButton', {
|
|
414
|
+
'spectrum-ActionButton--quiet': isQuiet,
|
|
415
|
+
'spectrum-ActionButton--emphasized': isEmphasized,
|
|
416
|
+
'spectrum-ActionButton--staticColor': !!staticColor,
|
|
417
|
+
'spectrum-ActionButton--staticWhite': staticColor === 'white',
|
|
418
|
+
'spectrum-ActionButton--staticBlack': staticColor === 'black',
|
|
419
|
+
'is-active': isPressed,
|
|
420
|
+
'is-disabled': isDisabled,
|
|
421
|
+
'is-hovered': isHovered,
|
|
422
|
+
'is-selected': state.isSelected
|
|
423
|
+
}, styleProps.className)
|
|
424
|
+
}, /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$SlotProvider, {
|
|
425
|
+
slots: {
|
|
426
|
+
icon: {
|
|
427
|
+
size: 'S',
|
|
428
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-Icon')
|
|
429
|
+
},
|
|
430
|
+
text: {
|
|
431
|
+
UNSAFE_className: $fHJpt$classNames((/*@__PURE__*/$parcel$interopDefault($b7f6498a26cdd616$exports)), 'spectrum-ActionButton-label')
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
}, typeof children === 'string' || isTextOnly ? /*#__PURE__*/ $fHJpt$react.createElement($fHJpt$Text, null, children) : children))));
|
|
405
435
|
}
|
|
406
436
|
/**
|
|
407
437
|
* ToggleButtons allow users to toggle a selection on or off, for example
|
|
408
438
|
* switching between two states or modes.
|
|
409
|
-
*/
|
|
439
|
+
*/ let $62657bdfd15f871f$export$d2b052e7b4be1756 = /*#__PURE__*/ $fHJpt$react.forwardRef($62657bdfd15f871f$var$ToggleButton);
|
|
440
|
+
|
|
441
|
+
|
|
410
442
|
|
|
411
443
|
|
|
412
|
-
export
|
|
444
|
+
export {$541db85b7740d02d$export$353f5b6fc5456de1 as Button, $6e14e6d2d3d4214c$export$cfc7921d29ef7b80 as ActionButton, $d719b239c270b445$export$47dc48f595b075da as FieldButton, $a62aa7e81765f7e1$export$9b0b80fed00ba8b1 as LogicButton, $9a5d81ee0c9a6503$export$13ec83e50bf04290 as ClearButton, $62657bdfd15f871f$export$d2b052e7b4be1756 as ToggleButton};
|
|
413
445
|
//# sourceMappingURL=module.js.map
|