@simpli-route/apollo-ds 0.1.67 → 0.1.69
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/components/SearchField/types.d.ts +4 -0
- package/dist/components/TextField/types.d.ts +4 -0
- package/dist/index.cjs10.js +1 -1
- package/dist/index.cjs100.js +1 -1
- package/dist/index.cjs101.js +1 -1
- package/dist/index.cjs11.js +1 -1
- package/dist/index.cjs123.js +1 -1
- package/dist/index.cjs125.js +1 -1
- package/dist/index.cjs14.js +1 -1
- package/dist/index.cjs18.js +1 -1
- package/dist/index.cjs24.js +1 -1
- package/dist/index.cjs26.js +1 -1
- package/dist/index.cjs27.js +1 -1
- package/dist/index.cjs29.js +1 -1
- package/dist/index.cjs30.js +1 -1
- package/dist/index.cjs31.js +1 -1
- package/dist/index.cjs36.js +1 -1
- package/dist/index.cjs37.js +1 -1
- package/dist/index.cjs39.js +2 -2
- package/dist/index.cjs43.js +1 -1
- package/dist/index.cjs51.js +1 -1
- package/dist/index.cjs52.js +1 -1
- package/dist/index.cjs53.js +1 -1
- package/dist/index.cjs7.js +1 -1
- package/dist/index.cjs73.js +1 -1
- package/dist/index.cjs74.js +1 -1
- package/dist/index.cjs75.js +1 -1
- package/dist/index.cjs76.js +1 -1
- package/dist/index.cjs77.js +1 -1
- package/dist/index.cjs78.js +1 -1
- package/dist/index.cjs79.js +1 -1
- package/dist/index.cjs8.js +1 -1
- package/dist/index.cjs80.js +1 -1
- package/dist/index.cjs81.js +1 -1
- package/dist/index.cjs82.js +1 -3
- package/dist/index.cjs83.js +1 -1
- package/dist/index.cjs84.js +1 -1
- package/dist/index.cjs85.js +1 -1
- package/dist/index.cjs86.js +3 -1
- package/dist/index.cjs87.js +1 -1
- package/dist/index.cjs88.js +1 -1
- package/dist/index.cjs89.js +1 -1
- package/dist/index.cjs9.js +1 -1
- package/dist/index.cjs90.js +1 -1
- package/dist/index.cjs91.js +1 -1
- package/dist/index.cjs92.js +1 -1
- package/dist/index.cjs93.js +1 -1
- package/dist/index.cjs94.js +1 -1
- package/dist/index.cjs95.js +1 -1
- package/dist/index.es10.js +3 -3
- package/dist/index.es100.js +1 -1
- package/dist/index.es101.js +1 -1
- package/dist/index.es11.js +1 -1
- package/dist/index.es123.js +2 -57
- package/dist/index.es124.js +2 -2
- package/dist/index.es125.js +57 -2
- package/dist/index.es14.js +1 -1
- package/dist/index.es18.js +1 -1
- package/dist/index.es24.js +1 -1
- package/dist/index.es26.js +2 -2
- package/dist/index.es27.js +2 -2
- package/dist/index.es29.js +39 -37
- package/dist/index.es30.js +2 -2
- package/dist/index.es31.js +2 -2
- package/dist/index.es36.js +2 -2
- package/dist/index.es37.js +3 -3
- package/dist/index.es39.js +111 -99
- package/dist/index.es43.js +1 -1
- package/dist/index.es51.js +30 -167
- package/dist/index.es52.js +148 -20
- package/dist/index.es53.js +40 -31
- package/dist/index.es7.js +3 -3
- package/dist/index.es73.js +163 -18
- package/dist/index.es74.js +15 -14
- package/dist/index.es75.js +14 -13
- package/dist/index.es76.js +14 -77
- package/dist/index.es77.js +78 -162
- package/dist/index.es78.js +10 -10
- package/dist/index.es79.js +10 -12
- package/dist/index.es8.js +1 -1
- package/dist/index.es80.js +12 -10
- package/dist/index.es81.js +10 -13
- package/dist/index.es82.js +9 -149
- package/dist/index.es83.js +45 -12
- package/dist/index.es84.js +40 -7
- package/dist/index.es85.js +12 -41
- package/dist/index.es86.js +155 -20
- package/dist/index.es87.js +12 -101
- package/dist/index.es88.js +7 -13
- package/dist/index.es89.js +42 -78
- package/dist/index.es9.js +1 -1
- package/dist/index.es90.js +20 -19
- package/dist/index.es91.js +74 -16
- package/dist/index.es92.js +101 -10
- package/dist/index.es93.js +12 -9
- package/dist/index.es94.js +19 -45
- package/dist/index.es95.js +17 -37
- package/dist/stories/MultiTextField.stories.d.ts +1 -0
- package/dist/stories/SearchField.stories.d.ts +1 -0
- package/dist/style.css +3 -0
- package/package.json +1 -1
package/dist/index.es39.js
CHANGED
|
@@ -1,152 +1,164 @@
|
|
|
1
|
-
import { j as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { TextField as
|
|
4
|
-
import { cn as
|
|
5
|
-
import { Badge as
|
|
1
|
+
import { j as s } from "./index.es47.js";
|
|
2
|
+
import { useState as D, useRef as ce } from "react";
|
|
3
|
+
import { TextField as fe, Text as pe, FieldError as me } from "react-aria-components";
|
|
4
|
+
import { cn as b } from "./index.es48.js";
|
|
5
|
+
import { Badge as xe } from "./index.es4.js";
|
|
6
6
|
import "./index.es5.js";
|
|
7
7
|
import "./index.es15.js";
|
|
8
|
-
import { Label as
|
|
9
|
-
import { multiTextFieldContainerVariants as
|
|
10
|
-
const
|
|
8
|
+
import { Label as he } from "./index.es16.js";
|
|
9
|
+
import { multiTextFieldContainerVariants as ge } from "./index.es69.js";
|
|
10
|
+
const je = (q) => {
|
|
11
11
|
const {
|
|
12
|
-
label:
|
|
13
|
-
placeholder:
|
|
12
|
+
label: j,
|
|
13
|
+
placeholder: z,
|
|
14
14
|
isDisabled: o = !1,
|
|
15
|
-
size:
|
|
16
|
-
description:
|
|
17
|
-
inputValue:
|
|
18
|
-
isInvalid:
|
|
15
|
+
size: E = "sm",
|
|
16
|
+
description: R,
|
|
17
|
+
inputValue: T,
|
|
18
|
+
isInvalid: _,
|
|
19
19
|
errorMessage: I,
|
|
20
|
-
invalidInputErrorMessage:
|
|
21
|
-
values:
|
|
20
|
+
invalidInputErrorMessage: k,
|
|
21
|
+
values: A,
|
|
22
22
|
onValuesChange: a,
|
|
23
|
-
onInputChange:
|
|
24
|
-
validateValue:
|
|
25
|
-
separator:
|
|
23
|
+
onInputChange: B,
|
|
24
|
+
validateValue: i,
|
|
25
|
+
separator: r = `
|
|
26
26
|
`,
|
|
27
|
-
icon:
|
|
28
|
-
tooltipText:
|
|
29
|
-
tooltipSupportText:
|
|
30
|
-
tooltipProps:
|
|
31
|
-
labelClassName:
|
|
32
|
-
errorClassName:
|
|
33
|
-
descriptionClassName:
|
|
34
|
-
isRequired:
|
|
35
|
-
isReadOnly:
|
|
36
|
-
className:
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
27
|
+
icon: F,
|
|
28
|
+
tooltipText: G,
|
|
29
|
+
tooltipSupportText: H,
|
|
30
|
+
tooltipProps: J,
|
|
31
|
+
labelClassName: Q,
|
|
32
|
+
errorClassName: U,
|
|
33
|
+
descriptionClassName: W,
|
|
34
|
+
isRequired: M = !1,
|
|
35
|
+
isReadOnly: S = !1,
|
|
36
|
+
className: X,
|
|
37
|
+
inputType: P = "text",
|
|
38
|
+
inputMax: N,
|
|
39
|
+
inputMin: y,
|
|
40
|
+
...Y
|
|
41
|
+
} = q, [Z, ee] = D(""), [te, w] = D([]), [K, u] = D(!1), L = T !== void 0, x = A !== void 0, l = L ? T : Z, n = x ? A : te, d = l.trim(), ne = d !== "" && n.includes(d), se = d !== "" && i && !i(d), h = K && (ne || se), le = n.length > 0, C = () => {
|
|
42
|
+
d !== "" && u(!0);
|
|
43
|
+
}, c = (e) => {
|
|
44
|
+
K && u(!1), L || ee(e), B && B(e);
|
|
45
|
+
}, O = (e) => {
|
|
43
46
|
const t = e.trim();
|
|
44
|
-
if (!t
|
|
47
|
+
if (!t)
|
|
45
48
|
return !1;
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
49
|
+
if (P === "number") {
|
|
50
|
+
const p = Number(t);
|
|
51
|
+
if (Number.isNaN(p) || y !== void 0 && p < Number(y) || N !== void 0 && p > Number(N))
|
|
52
|
+
return !1;
|
|
53
|
+
}
|
|
54
|
+
if (i && !i(t) || n.includes(t))
|
|
55
|
+
return !1;
|
|
56
|
+
const f = [...n, t];
|
|
57
|
+
return x || w(f), a && a(f), !0;
|
|
58
|
+
}, $ = (e) => {
|
|
59
|
+
const t = n.filter((f) => f !== e);
|
|
60
|
+
x || w(t), a && a(t);
|
|
61
|
+
}, ae = (e) => {
|
|
52
62
|
if (e.key === "Enter")
|
|
53
|
-
e.preventDefault(),
|
|
63
|
+
e.preventDefault(), C(), l.trim() && O(l) && (c(""), u(!1));
|
|
54
64
|
else if (e.key === " " || e.key === "Tab")
|
|
55
|
-
|
|
56
|
-
else if (e.key === "Backspace" && l === "" &&
|
|
65
|
+
C(), l.trim() && (O(l) ? (c(""), u(!1)) : e.preventDefault());
|
|
66
|
+
else if (e.key === "Backspace" && l === "" && n.length > 0) {
|
|
57
67
|
e.preventDefault();
|
|
58
|
-
const t =
|
|
59
|
-
|
|
68
|
+
const t = n[n.length - 1];
|
|
69
|
+
$(t), c(t), u(!1);
|
|
60
70
|
}
|
|
61
|
-
},
|
|
62
|
-
|
|
63
|
-
},
|
|
71
|
+
}, ie = () => {
|
|
72
|
+
C();
|
|
73
|
+
}, re = (e) => {
|
|
64
74
|
const t = e.clipboardData.getData("text");
|
|
65
|
-
if (!(typeof
|
|
75
|
+
if (!(typeof r == "string" ? new RegExp(r.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")) : r).test(t))
|
|
66
76
|
return;
|
|
67
77
|
e.preventDefault();
|
|
68
|
-
const
|
|
69
|
-
for (const
|
|
70
|
-
const
|
|
71
|
-
|
|
78
|
+
const p = t.split(r), V = [];
|
|
79
|
+
for (const v of p) {
|
|
80
|
+
const m = v.trim();
|
|
81
|
+
m && (!i || i(m)) && !n.includes(m) && !V.includes(m) && V.push(m);
|
|
72
82
|
}
|
|
73
|
-
if (
|
|
74
|
-
const
|
|
75
|
-
|
|
83
|
+
if (V.length > 0) {
|
|
84
|
+
const v = [...n, ...V];
|
|
85
|
+
x || w(v), a && a(v);
|
|
76
86
|
}
|
|
77
|
-
|
|
78
|
-
},
|
|
79
|
-
return /* @__PURE__ */
|
|
80
|
-
|
|
87
|
+
c("");
|
|
88
|
+
}, g = (_ || h) && !o, oe = ce(null), ue = b("text-sm leading-6 text-error-500", U), de = b("text-xs leading-5 text-neutral-700", W);
|
|
89
|
+
return /* @__PURE__ */ s.jsxs(
|
|
90
|
+
fe,
|
|
81
91
|
{
|
|
82
|
-
className:
|
|
92
|
+
className: b("flex flex-col gap-2", X),
|
|
83
93
|
isDisabled: o,
|
|
84
|
-
isReadOnly:
|
|
85
|
-
isRequired:
|
|
86
|
-
isInvalid:
|
|
87
|
-
...
|
|
94
|
+
isReadOnly: S,
|
|
95
|
+
isRequired: M,
|
|
96
|
+
isInvalid: g,
|
|
97
|
+
...Y,
|
|
88
98
|
children: [
|
|
89
|
-
|
|
90
|
-
|
|
99
|
+
j && /* @__PURE__ */ s.jsx(
|
|
100
|
+
he,
|
|
91
101
|
{
|
|
92
|
-
isRequired:
|
|
93
|
-
tooltipText:
|
|
94
|
-
tooltipSupportText:
|
|
95
|
-
tooltipProps:
|
|
96
|
-
labelClassName:
|
|
97
|
-
children:
|
|
102
|
+
isRequired: M,
|
|
103
|
+
tooltipText: G,
|
|
104
|
+
tooltipSupportText: H,
|
|
105
|
+
tooltipProps: J,
|
|
106
|
+
labelClassName: Q,
|
|
107
|
+
children: j
|
|
98
108
|
}
|
|
99
109
|
),
|
|
100
|
-
/* @__PURE__ */
|
|
110
|
+
/* @__PURE__ */ s.jsxs(
|
|
101
111
|
"div",
|
|
102
112
|
{
|
|
103
|
-
ref:
|
|
113
|
+
ref: oe,
|
|
104
114
|
"data-testid": "multi-text-field-container",
|
|
105
|
-
className:
|
|
106
|
-
size:
|
|
115
|
+
className: ge({
|
|
116
|
+
size: E,
|
|
107
117
|
isDisabled: o,
|
|
108
|
-
hasInvalidValue:
|
|
118
|
+
hasInvalidValue: h
|
|
109
119
|
}),
|
|
110
120
|
children: [
|
|
111
|
-
|
|
112
|
-
|
|
121
|
+
le && /* @__PURE__ */ s.jsx(s.Fragment, { children: n.map((e) => /* @__PURE__ */ s.jsx(
|
|
122
|
+
xe,
|
|
113
123
|
{
|
|
114
124
|
label: e,
|
|
115
|
-
size:
|
|
125
|
+
size: E,
|
|
116
126
|
isDisabled: o,
|
|
117
|
-
onDelete: () =>
|
|
127
|
+
onDelete: () => $(e)
|
|
118
128
|
},
|
|
119
129
|
e
|
|
120
130
|
)) }),
|
|
121
|
-
/* @__PURE__ */
|
|
131
|
+
/* @__PURE__ */ s.jsx(
|
|
122
132
|
"input",
|
|
123
133
|
{
|
|
124
|
-
type:
|
|
134
|
+
type: P,
|
|
135
|
+
max: N,
|
|
136
|
+
min: y,
|
|
125
137
|
value: l,
|
|
126
|
-
placeholder:
|
|
127
|
-
className:
|
|
138
|
+
placeholder: z,
|
|
139
|
+
className: b(
|
|
128
140
|
"min-w-[120px] flex-1 border-0 bg-transparent p-0 outline-none focus:ring-0",
|
|
129
|
-
|
|
141
|
+
h && "text-error-500"
|
|
130
142
|
),
|
|
131
143
|
disabled: o,
|
|
132
|
-
readOnly:
|
|
133
|
-
"aria-invalid":
|
|
134
|
-
onChange: (e) =>
|
|
135
|
-
onKeyDown:
|
|
136
|
-
onBlur:
|
|
137
|
-
onPaste:
|
|
144
|
+
readOnly: S,
|
|
145
|
+
"aria-invalid": g,
|
|
146
|
+
onChange: (e) => c(e.target.value),
|
|
147
|
+
onKeyDown: ae,
|
|
148
|
+
onBlur: ie,
|
|
149
|
+
onPaste: re
|
|
138
150
|
}
|
|
139
151
|
),
|
|
140
|
-
|
|
152
|
+
F ? /* @__PURE__ */ s.jsx("div", { className: "absolute inset-y-0 right-0 flex items-center pr-3 text-neutral-700", children: F }) : null
|
|
141
153
|
]
|
|
142
154
|
}
|
|
143
155
|
),
|
|
144
|
-
|
|
145
|
-
|
|
156
|
+
R && !g && /* @__PURE__ */ s.jsx(pe, { slot: "description", className: de, children: R }),
|
|
157
|
+
g && /* @__PURE__ */ s.jsx(me, { className: ue, children: I ? typeof I != "function" ? I : null : h && k ? k : null })
|
|
146
158
|
]
|
|
147
159
|
}
|
|
148
160
|
);
|
|
149
161
|
};
|
|
150
162
|
export {
|
|
151
|
-
|
|
163
|
+
je as MultiTextField
|
|
152
164
|
};
|
package/dist/index.es43.js
CHANGED
|
@@ -3,7 +3,7 @@ import { forwardRef as f, useContext as u } from "react";
|
|
|
3
3
|
import { useTooltip as T, mergeProps as h } from "react-aria";
|
|
4
4
|
import { cn as e } from "./index.es48.js";
|
|
5
5
|
import { TooltipContext as j } from "./index.es57.js";
|
|
6
|
-
import { tooltipVariants as N } from "./index.
|
|
6
|
+
import { tooltipVariants as N } from "./index.es84.js";
|
|
7
7
|
const P = f((p, i) => {
|
|
8
8
|
const { placement: l = "bottom", className: m, mode: o = "dark", supportText: t, children: a, ...r } = p, { state: n, ...c } = u(j), { tooltipProps: x } = T(r, n), d = e(N({ placement: l, mode: o, hasSupportText: !!t }), m);
|
|
9
9
|
return /* @__PURE__ */ s.jsxs("span", { className: d, ...h(r, x, c), ref: i, children: [
|
package/dist/index.es51.js
CHANGED
|
@@ -1,173 +1,36 @@
|
|
|
1
1
|
import { cva as r } from "class-variance-authority";
|
|
2
|
-
const t = r(
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
primary: "bg-primary-500 text-primary-50",
|
|
8
|
-
secondary: "border border-primary-500 bg-primary-50 text-primary-500",
|
|
9
|
-
tertiary: "text-primary-500",
|
|
10
|
-
outline: "border border-primary-500 text-primary-500",
|
|
11
|
-
success: "border bg-success-500 text-success-50",
|
|
12
|
-
error: "border bg-error-500 text-error-50",
|
|
13
|
-
orangeWarning: "border bg-orange-warning-500 text-orange-warning-50",
|
|
14
|
-
yellowWarning: "border bg-yellow-warning-500 text-yellow-warning-900",
|
|
15
|
-
info: "border bg-blue-500 text-blue-50"
|
|
16
|
-
},
|
|
17
|
-
size: {
|
|
18
|
-
xs: "rounded px-3 py-1",
|
|
19
|
-
sm: "rounded px-3 py-2",
|
|
20
|
-
md: "rounded px-4 py-3",
|
|
21
|
-
lg: "rounded-lg px-6 py-4"
|
|
22
|
-
},
|
|
23
|
-
isDisabled: {
|
|
24
|
-
true: "pointer-events-none cursor-not-allowed border-none bg-neutral-400 text-neutral-600"
|
|
25
|
-
},
|
|
26
|
-
isHovered: {
|
|
27
|
-
true: ""
|
|
28
|
-
},
|
|
29
|
-
isActive: {
|
|
30
|
-
true: ""
|
|
31
|
-
},
|
|
32
|
-
fullWidth: {
|
|
33
|
-
true: "w-full",
|
|
34
|
-
false: "w-fit"
|
|
35
|
-
},
|
|
36
|
-
isLoading: {
|
|
37
|
-
true: "pointer-events-none cursor-not-allowed opacity-70"
|
|
38
|
-
},
|
|
39
|
-
isFocused: {
|
|
40
|
-
true: "focus:outline-none focus:ring-2 focus:ring-sky-400 focus:ring-offset-[0.4px] border-none",
|
|
41
|
-
false: ""
|
|
42
|
-
}
|
|
2
|
+
const t = r("bg-primary-50 inline-flex items-center select-none border border-transparent", {
|
|
3
|
+
variants: {
|
|
4
|
+
style: {
|
|
5
|
+
square: "rounded-md",
|
|
6
|
+
rounded: "rounded-full"
|
|
43
7
|
},
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
8
|
+
size: {
|
|
9
|
+
xs: [
|
|
10
|
+
"gap-1 py-[2px] pr-[6px] pl-1 font-normal text-neutral-900 text-[10px]",
|
|
11
|
+
"[&_svg]:w-[10px] [&_svg]:h-[10px]"
|
|
12
|
+
],
|
|
13
|
+
sm: ["gap-1 py-[2px] pr-[6px] pl-1 font-normal text-neutral-900 text-xs", "[&_svg]:w-3 [&_svg]:h-3"],
|
|
14
|
+
md: ["gap-1 py-1 pr-3 pl-2 font-normal text-neutral-900 text-sm", "[&_svg]:w-4 [&_svg]:h-4"],
|
|
15
|
+
lg: ["gap-2 py-1 pr-3 pl-2 font-normal text-neutral-900 text-sm", "[&_svg]:w-4 [&_svg]:h-4"]
|
|
47
16
|
},
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
class: "bg-primary-300 text-primary-800"
|
|
64
|
-
},
|
|
65
|
-
{
|
|
66
|
-
intent: "outline",
|
|
67
|
-
isHovered: !0,
|
|
68
|
-
class: "bg-primary-500 text-primary-50"
|
|
69
|
-
},
|
|
70
|
-
{
|
|
71
|
-
intent: "success",
|
|
72
|
-
isHovered: !0,
|
|
73
|
-
class: "bg-success-700 text-neutral-50"
|
|
74
|
-
},
|
|
75
|
-
{
|
|
76
|
-
intent: "error",
|
|
77
|
-
isHovered: !0,
|
|
78
|
-
class: "bg-error-700 text-error-50"
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
intent: "orangeWarning",
|
|
82
|
-
isHovered: !0,
|
|
83
|
-
class: "bg-orange-warning-700 text-orange-warning-50"
|
|
84
|
-
},
|
|
85
|
-
{
|
|
86
|
-
intent: "yellowWarning",
|
|
87
|
-
isHovered: !0,
|
|
88
|
-
class: "bg-yellow-warning-700 text-neutral-50"
|
|
89
|
-
},
|
|
90
|
-
{
|
|
91
|
-
intent: "info",
|
|
92
|
-
isHovered: !0,
|
|
93
|
-
class: "bg-blue-700 text-blue-50"
|
|
94
|
-
},
|
|
95
|
-
/* /Focus State */
|
|
96
|
-
{
|
|
97
|
-
intent: "success",
|
|
98
|
-
isFocused: !0,
|
|
99
|
-
class: "border-[1.5px] focus:ring-success-500"
|
|
100
|
-
},
|
|
101
|
-
{
|
|
102
|
-
intent: "error",
|
|
103
|
-
isFocused: !0,
|
|
104
|
-
class: "border-[1.5px] focus:ring-error-500"
|
|
105
|
-
},
|
|
106
|
-
{
|
|
107
|
-
intent: "orangeWarning",
|
|
108
|
-
isFocused: !0,
|
|
109
|
-
class: "border-[1.5px] focus:ring-orange-500"
|
|
110
|
-
},
|
|
111
|
-
{
|
|
112
|
-
intent: "yellowWarning",
|
|
113
|
-
isFocused: !0,
|
|
114
|
-
class: "border-[1.5px] focus:ring-yellow-500"
|
|
115
|
-
},
|
|
116
|
-
{
|
|
117
|
-
intent: "info",
|
|
118
|
-
isFocused: !0,
|
|
119
|
-
class: "border-[1.5px] focus:ring-blue-500"
|
|
120
|
-
},
|
|
121
|
-
/* Active State */
|
|
122
|
-
{
|
|
123
|
-
intent: "primary",
|
|
124
|
-
isActive: !0,
|
|
125
|
-
class: "bg-primary-900"
|
|
126
|
-
},
|
|
127
|
-
{
|
|
128
|
-
intent: "secondary",
|
|
129
|
-
isActive: !0,
|
|
130
|
-
class: "bg-primary-300"
|
|
131
|
-
},
|
|
132
|
-
{
|
|
133
|
-
intent: "tertiary",
|
|
134
|
-
isActive: !0,
|
|
135
|
-
class: "bg-primary-500 text-white"
|
|
136
|
-
},
|
|
137
|
-
{
|
|
138
|
-
intent: "outline",
|
|
139
|
-
isActive: !0,
|
|
140
|
-
class: "border border-primary-500 bg-primary-300 text-primary-500"
|
|
141
|
-
},
|
|
142
|
-
{
|
|
143
|
-
intent: "success",
|
|
144
|
-
isActive: !0,
|
|
145
|
-
class: "border border-transparent bg-success-300 text-success-900"
|
|
146
|
-
},
|
|
147
|
-
{
|
|
148
|
-
intent: "error",
|
|
149
|
-
isActive: !0,
|
|
150
|
-
class: "border border-transparent bg-error-300 text-error-900"
|
|
151
|
-
},
|
|
152
|
-
{
|
|
153
|
-
intent: "orangeWarning",
|
|
154
|
-
isActive: !0,
|
|
155
|
-
class: "border border-transparent bg-orange-warning-300 text-orange-warning-900"
|
|
156
|
-
},
|
|
157
|
-
{
|
|
158
|
-
intent: "yellowWarning",
|
|
159
|
-
isActive: !0,
|
|
160
|
-
class: "border border-transparent bg-yellow-warning-300 text-yellow-warning-900"
|
|
161
|
-
},
|
|
162
|
-
{
|
|
163
|
-
intent: "info",
|
|
164
|
-
isActive: !0,
|
|
165
|
-
class: "border border-transparent bg-blue-200 text-blue-900"
|
|
166
|
-
}
|
|
167
|
-
/* /Active State */
|
|
168
|
-
]
|
|
17
|
+
pressable: {
|
|
18
|
+
true: "cursor-pointer"
|
|
19
|
+
},
|
|
20
|
+
isFocused: {
|
|
21
|
+
true: "border-primary-500"
|
|
22
|
+
},
|
|
23
|
+
isHovered: {
|
|
24
|
+
true: "border-primary-300"
|
|
25
|
+
},
|
|
26
|
+
isPressed: {
|
|
27
|
+
true: "bg-primary-200"
|
|
28
|
+
},
|
|
29
|
+
isDisabled: {
|
|
30
|
+
true: "bg-neutral-50 text-neutral-600 [&_svg]:text-neutral-600 cursor-not-allowed"
|
|
31
|
+
}
|
|
169
32
|
}
|
|
170
|
-
);
|
|
33
|
+
});
|
|
171
34
|
export {
|
|
172
|
-
t as
|
|
35
|
+
t as assistChipVariants
|
|
173
36
|
};
|
package/dist/index.es52.js
CHANGED
|
@@ -1,45 +1,173 @@
|
|
|
1
1
|
import { cva as r } from "class-variance-authority";
|
|
2
|
-
const
|
|
3
|
-
"flex
|
|
2
|
+
const t = r(
|
|
3
|
+
"inline-flex select-none items-center justify-center text-center text-xs font-semibold leading-6 transition duration-150 ease-in-out focus:outline-none",
|
|
4
4
|
{
|
|
5
5
|
variants: {
|
|
6
|
+
intent: {
|
|
7
|
+
primary: "bg-primary-500 text-primary-50",
|
|
8
|
+
secondary: "border border-primary-500 bg-primary-50 text-primary-500",
|
|
9
|
+
tertiary: "text-primary-500",
|
|
10
|
+
outline: "border border-primary-500 text-primary-500",
|
|
11
|
+
success: "border bg-success-500 text-success-50",
|
|
12
|
+
error: "border bg-error-500 text-error-50",
|
|
13
|
+
orangeWarning: "border bg-orange-warning-500 text-orange-warning-50",
|
|
14
|
+
yellowWarning: "border bg-yellow-warning-500 text-yellow-warning-900",
|
|
15
|
+
info: "border bg-blue-500 text-blue-50"
|
|
16
|
+
},
|
|
17
|
+
size: {
|
|
18
|
+
xs: "rounded px-3 py-1",
|
|
19
|
+
sm: "rounded px-3 py-2",
|
|
20
|
+
md: "rounded px-4 py-3",
|
|
21
|
+
lg: "rounded-lg px-6 py-4"
|
|
22
|
+
},
|
|
23
|
+
isDisabled: {
|
|
24
|
+
true: "pointer-events-none cursor-not-allowed border-none bg-neutral-400 text-neutral-600"
|
|
25
|
+
},
|
|
6
26
|
isHovered: {
|
|
7
27
|
true: ""
|
|
8
28
|
},
|
|
9
|
-
|
|
10
|
-
true: "
|
|
11
|
-
false: "bg-white"
|
|
29
|
+
isActive: {
|
|
30
|
+
true: ""
|
|
12
31
|
},
|
|
13
|
-
|
|
14
|
-
true: "
|
|
32
|
+
fullWidth: {
|
|
33
|
+
true: "w-full",
|
|
34
|
+
false: "w-fit"
|
|
15
35
|
},
|
|
16
|
-
|
|
17
|
-
true: "
|
|
36
|
+
isLoading: {
|
|
37
|
+
true: "pointer-events-none cursor-not-allowed opacity-70"
|
|
18
38
|
},
|
|
19
|
-
|
|
20
|
-
true: "
|
|
39
|
+
isFocused: {
|
|
40
|
+
true: "focus:outline-none focus:ring-2 focus:ring-sky-400 focus:ring-offset-[0.4px] border-none",
|
|
41
|
+
false: ""
|
|
21
42
|
}
|
|
22
43
|
},
|
|
44
|
+
defaultVariants: {
|
|
45
|
+
intent: "primary",
|
|
46
|
+
size: "md"
|
|
47
|
+
},
|
|
23
48
|
compoundVariants: [
|
|
49
|
+
/* Hover State */
|
|
50
|
+
{
|
|
51
|
+
intent: "primary",
|
|
52
|
+
isHovered: !0,
|
|
53
|
+
class: "bg-primary-700"
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
intent: "secondary",
|
|
57
|
+
isHovered: !0,
|
|
58
|
+
class: "bg-primary-200"
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
intent: "tertiary",
|
|
62
|
+
isHovered: !0,
|
|
63
|
+
class: "bg-primary-300 text-primary-800"
|
|
64
|
+
},
|
|
65
|
+
{
|
|
66
|
+
intent: "outline",
|
|
67
|
+
isHovered: !0,
|
|
68
|
+
class: "bg-primary-500 text-primary-50"
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
intent: "success",
|
|
72
|
+
isHovered: !0,
|
|
73
|
+
class: "bg-success-700 text-neutral-50"
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
intent: "error",
|
|
77
|
+
isHovered: !0,
|
|
78
|
+
class: "bg-error-700 text-error-50"
|
|
79
|
+
},
|
|
80
|
+
{
|
|
81
|
+
intent: "orangeWarning",
|
|
82
|
+
isHovered: !0,
|
|
83
|
+
class: "bg-orange-warning-700 text-orange-warning-50"
|
|
84
|
+
},
|
|
24
85
|
{
|
|
86
|
+
intent: "yellowWarning",
|
|
25
87
|
isHovered: !0,
|
|
26
|
-
|
|
27
|
-
class: "border-none bg-primary-600 group-active:bg-primary-600"
|
|
88
|
+
class: "bg-yellow-warning-700 text-neutral-50"
|
|
28
89
|
},
|
|
29
90
|
{
|
|
91
|
+
intent: "info",
|
|
30
92
|
isHovered: !0,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
93
|
+
class: "bg-blue-700 text-blue-50"
|
|
94
|
+
},
|
|
95
|
+
/* /Focus State */
|
|
96
|
+
{
|
|
97
|
+
intent: "success",
|
|
98
|
+
isFocused: !0,
|
|
99
|
+
class: "border-[1.5px] focus:ring-success-500"
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
intent: "error",
|
|
103
|
+
isFocused: !0,
|
|
104
|
+
class: "border-[1.5px] focus:ring-error-500"
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
intent: "orangeWarning",
|
|
108
|
+
isFocused: !0,
|
|
109
|
+
class: "border-[1.5px] focus:ring-orange-500"
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
intent: "yellowWarning",
|
|
113
|
+
isFocused: !0,
|
|
114
|
+
class: "border-[1.5px] focus:ring-yellow-500"
|
|
115
|
+
},
|
|
116
|
+
{
|
|
117
|
+
intent: "info",
|
|
118
|
+
isFocused: !0,
|
|
119
|
+
class: "border-[1.5px] focus:ring-blue-500"
|
|
120
|
+
},
|
|
121
|
+
/* Active State */
|
|
122
|
+
{
|
|
123
|
+
intent: "primary",
|
|
124
|
+
isActive: !0,
|
|
125
|
+
class: "bg-primary-900"
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
intent: "secondary",
|
|
129
|
+
isActive: !0,
|
|
130
|
+
class: "bg-primary-300"
|
|
131
|
+
},
|
|
132
|
+
{
|
|
133
|
+
intent: "tertiary",
|
|
134
|
+
isActive: !0,
|
|
135
|
+
class: "bg-primary-500 text-white"
|
|
136
|
+
},
|
|
137
|
+
{
|
|
138
|
+
intent: "outline",
|
|
139
|
+
isActive: !0,
|
|
140
|
+
class: "border border-primary-500 bg-primary-300 text-primary-500"
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
intent: "success",
|
|
144
|
+
isActive: !0,
|
|
145
|
+
class: "border border-transparent bg-success-300 text-success-900"
|
|
146
|
+
},
|
|
147
|
+
{
|
|
148
|
+
intent: "error",
|
|
149
|
+
isActive: !0,
|
|
150
|
+
class: "border border-transparent bg-error-300 text-error-900"
|
|
151
|
+
},
|
|
152
|
+
{
|
|
153
|
+
intent: "orangeWarning",
|
|
154
|
+
isActive: !0,
|
|
155
|
+
class: "border border-transparent bg-orange-warning-300 text-orange-warning-900"
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
intent: "yellowWarning",
|
|
159
|
+
isActive: !0,
|
|
160
|
+
class: "border border-transparent bg-yellow-warning-300 text-yellow-warning-900"
|
|
34
161
|
},
|
|
35
162
|
{
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
class: "bg-
|
|
163
|
+
intent: "info",
|
|
164
|
+
isActive: !0,
|
|
165
|
+
class: "border border-transparent bg-blue-200 text-blue-900"
|
|
39
166
|
}
|
|
167
|
+
/* /Active State */
|
|
40
168
|
]
|
|
41
169
|
}
|
|
42
170
|
);
|
|
43
171
|
export {
|
|
44
|
-
|
|
172
|
+
t as buttonVariants
|
|
45
173
|
};
|