@caspeco/casper-ui-library 7.10.0 → 7.10.1
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/combobox/combobox-button.d.ts.map +1 -1
- package/dist/components/combobox/combobox-button.js +33 -37
- package/dist/theme/theme-config/components/combobox-theme.d.ts +20 -1
- package/dist/theme/theme-config/components/combobox-theme.d.ts.map +1 -1
- package/dist/theme/theme-config/components/combobox-theme.js +21 -4
- package/dist/theme/theme-config/components/input-theme.d.ts +16 -23
- package/dist/theme/theme-config/components/input-theme.d.ts.map +1 -1
- package/dist/theme/theme-config/components/input-theme.js +36 -24
- package/dist/theme/theme-config/components/select-theme.d.ts +16 -23
- package/dist/theme/theme-config/components/select-theme.d.ts.map +1 -1
- package/dist/theme/theme-config/components/textarea-theme.d.ts.map +1 -1
- package/dist/theme/theme-config/components/textarea-theme.js +33 -20
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox-button.d.ts","sourceRoot":"","sources":["../../../lib/components/combobox/combobox-button.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAsBlD,wBAAgB,cAAc,CAAC,EAC9B,EAAE,EACF,WAAW,EACX,UAAU,EACV,aAAa,EACb,YAAY,EACZ,UAAU,EACV,cAAc,EACd,SAAS,EACT,aAAa,EACb,IAAI,EACJ,OAAO,EACP,KAAK,EACL,eAAe,EACf,UAAU,EACV,UAAU,EACV,SAAS,EACT,SAAS,EACT,gBAAgB,EAChB,mBAAmB,EACnB,aAAa,EACb,QAAQ,EACR,cAAc,GACd,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"combobox-button.d.ts","sourceRoot":"","sources":["../../../lib/components/combobox/combobox-button.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAsBlD,wBAAgB,cAAc,CAAC,EAC9B,EAAE,EACF,WAAW,EACX,UAAU,EACV,aAAa,EACb,YAAY,EACZ,UAAU,EACV,cAAc,EACd,SAAS,EACT,aAAa,EACb,IAAI,EACJ,OAAO,EACP,KAAK,EACL,eAAe,EACf,UAAU,EACV,UAAU,EACV,SAAS,EACT,SAAS,EACT,gBAAgB,EAChB,mBAAmB,EACnB,aAAa,EACb,QAAQ,EACR,cAAc,GACd,EAAE,kBAAkB,2CAgMpB"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsxs as f, jsx as i } from "react/jsx-runtime";
|
|
2
|
-
import { useStyleConfig as
|
|
3
|
-
import { Fragment as
|
|
2
|
+
import { useStyleConfig as X, Flex as c, Box as d, Input as $ } from "@chakra-ui/react";
|
|
3
|
+
import { Fragment as D } from "react";
|
|
4
4
|
import { ComboboxItem as E } from "./combobox-item.js";
|
|
5
5
|
import { Tag as K } from "../tag/tag.js";
|
|
6
6
|
import { Icon as U } from "../icon/icon.js";
|
|
7
7
|
import { Icons as q } from "../icon/types.js";
|
|
8
8
|
import { ThemeColorVariable as r, ThemeSpaceVariable as u, ThemeRadiusVariable as G, ThemeIconSizeVariable as J } from "../../theme/theme-types.js";
|
|
9
|
-
function
|
|
9
|
+
function R() {
|
|
10
10
|
return /* @__PURE__ */ i(
|
|
11
11
|
d,
|
|
12
12
|
{
|
|
@@ -27,50 +27,50 @@ function j() {
|
|
|
27
27
|
);
|
|
28
28
|
}
|
|
29
29
|
function oo({
|
|
30
|
-
id:
|
|
30
|
+
id: j,
|
|
31
31
|
asPlainText: e,
|
|
32
32
|
inputValue: h,
|
|
33
33
|
selectedItems: n,
|
|
34
|
-
displayItems:
|
|
35
|
-
toggleItem:
|
|
34
|
+
displayItems: B,
|
|
35
|
+
toggleItem: x,
|
|
36
36
|
highlightState: l,
|
|
37
37
|
openState: a,
|
|
38
38
|
parentStrings: V,
|
|
39
39
|
size: W,
|
|
40
40
|
variant: v,
|
|
41
41
|
label: S,
|
|
42
|
-
placeHolderText:
|
|
42
|
+
placeHolderText: C,
|
|
43
43
|
isDisabled: b,
|
|
44
|
-
isReadOnly:
|
|
45
|
-
isInvalid:
|
|
44
|
+
isReadOnly: s,
|
|
45
|
+
isInvalid: m,
|
|
46
46
|
collapsed: k,
|
|
47
|
-
hasPendingDelete:
|
|
48
|
-
setHasPendingDelete:
|
|
47
|
+
hasPendingDelete: w,
|
|
48
|
+
setHasPendingDelete: t,
|
|
49
49
|
setInputValue: O,
|
|
50
50
|
onSearch: y,
|
|
51
51
|
isSingleSelect: z
|
|
52
52
|
}) {
|
|
53
|
-
const A =
|
|
54
|
-
if (o.key === "Enter" && (o.preventDefault(), o.stopPropagation(), a.isOpen ?
|
|
53
|
+
const A = X("Combobox", { size: W, variant: v }), F = (o) => {
|
|
54
|
+
if (o.key === "Enter" && (o.preventDefault(), o.stopPropagation(), a.isOpen ? x(B[l.index]) : a.open()), o.key === "Escape") {
|
|
55
55
|
if (!a.isOpen) return;
|
|
56
56
|
o.preventDefault(), o.stopPropagation(), a.close(), e || (O(""), y?.(""));
|
|
57
57
|
}
|
|
58
|
-
o.key === "Backspace" ? h.length === 0 && n.length > 0 && !e && (
|
|
59
|
-
},
|
|
58
|
+
o.key === "Backspace" ? h.length === 0 && n.length > 0 && !e && (w ? (x(n[n.length - 1]), t(!1)) : t(!0)) : t(!1), o.key === "ArrowDown" && (a.isOpen ? l.next() : a.open()), o.key === "ArrowUp" && (a.isOpen ? l.previous() : a.open());
|
|
59
|
+
}, L = (o) => {
|
|
60
60
|
o.preventDefault(), o.stopPropagation();
|
|
61
61
|
const p = o.target.value;
|
|
62
62
|
O(p), y?.(p), l.set(0), a.open();
|
|
63
|
-
},
|
|
63
|
+
}, g = n[0], _ = n[n.length - 1], N = a.isOpen || e || C;
|
|
64
64
|
return /* @__PURE__ */ f(
|
|
65
65
|
c,
|
|
66
66
|
{
|
|
67
67
|
__css: A,
|
|
68
68
|
"aria-disabled": b,
|
|
69
|
-
"aria-readonly":
|
|
70
|
-
"aria-invalid":
|
|
69
|
+
"aria-readonly": s,
|
|
70
|
+
"aria-invalid": m,
|
|
71
71
|
borderRadius: G.Small,
|
|
72
72
|
padding: u.Small,
|
|
73
|
-
_focusWithin:
|
|
73
|
+
_focusWithin: m ? {
|
|
74
74
|
borderColor: r.Error,
|
|
75
75
|
boxShadow: `0 0 0 4px ${r.ErrorContainer}`,
|
|
76
76
|
backgroundColor: r.Surface
|
|
@@ -79,10 +79,6 @@ function oo({
|
|
|
79
79
|
boxShadow: `0 0 0 4px ${r.InfoContainer}`,
|
|
80
80
|
backgroundColor: r.Surface
|
|
81
81
|
},
|
|
82
|
-
_disabled: {
|
|
83
|
-
borderColor: "transparent",
|
|
84
|
-
backgroundColor: r.SurfaceDisabled
|
|
85
|
-
},
|
|
86
82
|
children: [
|
|
87
83
|
/* @__PURE__ */ f(
|
|
88
84
|
c,
|
|
@@ -101,13 +97,13 @@ function oo({
|
|
|
101
97
|
whiteSpace: "nowrap",
|
|
102
98
|
textOverflow: "ellipsis",
|
|
103
99
|
children: [
|
|
104
|
-
n.length > 3 && /* @__PURE__ */ i(
|
|
105
|
-
n.length > 2 && /* @__PURE__ */ i(
|
|
100
|
+
n.length > 3 && /* @__PURE__ */ i(R, {}),
|
|
101
|
+
n.length > 2 && /* @__PURE__ */ i(R, {}),
|
|
106
102
|
n.length > 1 && /* @__PURE__ */ i(K, { children: n.length - 1 }),
|
|
107
103
|
/* @__PURE__ */ i(
|
|
108
104
|
E,
|
|
109
105
|
{
|
|
110
|
-
isDeleting:
|
|
106
|
+
isDeleting: w,
|
|
111
107
|
item: _,
|
|
112
108
|
asPlainText: e
|
|
113
109
|
}
|
|
@@ -119,11 +115,11 @@ function oo({
|
|
|
119
115
|
{
|
|
120
116
|
item: o,
|
|
121
117
|
asPlainText: e,
|
|
122
|
-
isDeleting: p === n.length - 1 &&
|
|
118
|
+
isDeleting: p === n.length - 1 && w
|
|
123
119
|
},
|
|
124
120
|
o.id
|
|
125
121
|
))),
|
|
126
|
-
e && n.length > 0 &&
|
|
122
|
+
e && n.length > 0 && g && h === g.label && V[g.id]?.map((o) => /* @__PURE__ */ f(D, { children: [
|
|
127
123
|
/* @__PURE__ */ i(
|
|
128
124
|
d,
|
|
129
125
|
{
|
|
@@ -137,19 +133,19 @@ function oo({
|
|
|
137
133
|
/* @__PURE__ */ i(d, { color: r.OnSurfaceSubdued, children: "/" })
|
|
138
134
|
] }, o)),
|
|
139
135
|
/* @__PURE__ */ i(
|
|
140
|
-
|
|
136
|
+
$,
|
|
141
137
|
{
|
|
142
|
-
id:
|
|
138
|
+
id: j,
|
|
143
139
|
isDisabled: b,
|
|
144
|
-
isReadOnly:
|
|
145
|
-
isInvalid:
|
|
146
|
-
onKeyDown:
|
|
140
|
+
isReadOnly: s,
|
|
141
|
+
isInvalid: m,
|
|
142
|
+
onKeyDown: F,
|
|
147
143
|
variant: "unstyled",
|
|
148
144
|
value: h,
|
|
149
145
|
autoComplete: "off",
|
|
150
146
|
minWidth: u.XLarge,
|
|
151
|
-
onChange:
|
|
152
|
-
placeholder:
|
|
147
|
+
onChange: L,
|
|
148
|
+
placeholder: C,
|
|
153
149
|
border: "none",
|
|
154
150
|
flex: 1,
|
|
155
151
|
color: r.OnSurface,
|
|
@@ -161,7 +157,7 @@ function oo({
|
|
|
161
157
|
cursor: "not-allowed",
|
|
162
158
|
color: r.OnSurfaceSubdued
|
|
163
159
|
},
|
|
164
|
-
sx:
|
|
160
|
+
sx: N ? {} : {
|
|
165
161
|
position: "absolute",
|
|
166
162
|
width: "1px",
|
|
167
163
|
height: "1px",
|
|
@@ -182,7 +178,7 @@ function oo({
|
|
|
182
178
|
{
|
|
183
179
|
icon: q.TreeViewCollapse,
|
|
184
180
|
size: J.Small,
|
|
185
|
-
color: b
|
|
181
|
+
color: b ? r.OnSurfaceSubdued : r.OnSurface
|
|
186
182
|
}
|
|
187
183
|
) })
|
|
188
184
|
]
|
|
@@ -23,6 +23,14 @@ export declare const comboboxConfig: {
|
|
|
23
23
|
background: ThemeColorVariable;
|
|
24
24
|
color: ThemeColorVariable;
|
|
25
25
|
borderColor: ThemeColorVariable;
|
|
26
|
+
'&[aria-disabled="true"]': {
|
|
27
|
+
backgroundColor: ThemeColorVariable;
|
|
28
|
+
color: ThemeColorVariable;
|
|
29
|
+
};
|
|
30
|
+
'&[aria-readonly="true"]': {
|
|
31
|
+
backgroundColor: ThemeColorVariable;
|
|
32
|
+
color: ThemeColorVariable;
|
|
33
|
+
};
|
|
26
34
|
"@media(hover: hover)": {
|
|
27
35
|
'&:hover:not(:focus-within):not([aria-disabled="true"]):not([aria-readonly="true"])': {
|
|
28
36
|
borderColor: ThemeColorVariable;
|
|
@@ -32,6 +40,17 @@ export declare const comboboxConfig: {
|
|
|
32
40
|
ghost: {
|
|
33
41
|
background: string;
|
|
34
42
|
color: ThemeColorVariable;
|
|
43
|
+
'&[aria-disabled="true"]': {
|
|
44
|
+
backgroundColor: string;
|
|
45
|
+
color: ThemeColorVariable;
|
|
46
|
+
};
|
|
47
|
+
'&[aria-readonly="true"]': {
|
|
48
|
+
backgroundColor: string;
|
|
49
|
+
color: ThemeColorVariable;
|
|
50
|
+
".combobox-dropdown-icon": {
|
|
51
|
+
opacity: number;
|
|
52
|
+
};
|
|
53
|
+
};
|
|
35
54
|
'&:not([aria-disabled="true"]):not([aria-readonly="true"]) .combobox-dropdown-icon': {
|
|
36
55
|
opacity: number;
|
|
37
56
|
};
|
|
@@ -41,7 +60,7 @@ export declare const comboboxConfig: {
|
|
|
41
60
|
};
|
|
42
61
|
};
|
|
43
62
|
"@media(hover: hover)": {
|
|
44
|
-
|
|
63
|
+
'&:hover:not(:focus-within):not([aria-disabled="true"])': {
|
|
45
64
|
backgroundColor: ThemeColorVariable;
|
|
46
65
|
".combobox-dropdown-icon": {
|
|
47
66
|
opacity: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/combobox-theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAuB,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"combobox-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/combobox-theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAuB,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAiG5E,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIzB,CAAC"}
|
|
@@ -6,12 +6,10 @@ const a = {
|
|
|
6
6
|
border: `${e.XSmall} transparent`,
|
|
7
7
|
'&[aria-disabled="true"]': {
|
|
8
8
|
borderColor: "transparent",
|
|
9
|
-
backgroundColor: o.SurfaceDisabled,
|
|
10
9
|
cursor: "not-allowed"
|
|
11
10
|
},
|
|
12
11
|
'&[aria-readonly="true"]': {
|
|
13
|
-
borderColor: "transparent"
|
|
14
|
-
backgroundColor: o.SurfaceDisabled
|
|
12
|
+
borderColor: "transparent"
|
|
15
13
|
},
|
|
16
14
|
'&[aria-invalid="true"]': {
|
|
17
15
|
borderColor: o.Error,
|
|
@@ -30,6 +28,14 @@ const a = {
|
|
|
30
28
|
background: o.Surface,
|
|
31
29
|
color: o.OnSurface,
|
|
32
30
|
borderColor: o.OnSurfaceBorder,
|
|
31
|
+
'&[aria-disabled="true"]': {
|
|
32
|
+
backgroundColor: o.SurfaceDisabled,
|
|
33
|
+
color: o.OnSurfaceSubdued
|
|
34
|
+
},
|
|
35
|
+
'&[aria-readonly="true"]': {
|
|
36
|
+
backgroundColor: o.SurfaceDisabled,
|
|
37
|
+
color: o.OnSurface
|
|
38
|
+
},
|
|
33
39
|
"@media(hover: hover)": {
|
|
34
40
|
'&:hover:not(:focus-within):not([aria-disabled="true"]):not([aria-readonly="true"])': {
|
|
35
41
|
borderColor: o.OnSurface
|
|
@@ -39,6 +45,17 @@ const a = {
|
|
|
39
45
|
ghost: {
|
|
40
46
|
background: "none",
|
|
41
47
|
color: o.OnSurface,
|
|
48
|
+
'&[aria-disabled="true"]': {
|
|
49
|
+
backgroundColor: "transparent",
|
|
50
|
+
color: o.OnSurfaceSubdued
|
|
51
|
+
},
|
|
52
|
+
'&[aria-readonly="true"]': {
|
|
53
|
+
backgroundColor: "transparent",
|
|
54
|
+
color: o.OnSurface,
|
|
55
|
+
".combobox-dropdown-icon": {
|
|
56
|
+
opacity: 1
|
|
57
|
+
}
|
|
58
|
+
},
|
|
42
59
|
'&:not([aria-disabled="true"]):not([aria-readonly="true"]) .combobox-dropdown-icon': {
|
|
43
60
|
opacity: 0
|
|
44
61
|
},
|
|
@@ -48,7 +65,7 @@ const a = {
|
|
|
48
65
|
}
|
|
49
66
|
},
|
|
50
67
|
"@media(hover: hover)": {
|
|
51
|
-
|
|
68
|
+
'&:hover:not(:focus-within):not([aria-disabled="true"])': {
|
|
52
69
|
backgroundColor: o.SurfaceDisabled,
|
|
53
70
|
".combobox-dropdown-icon": {
|
|
54
71
|
opacity: 1
|
|
@@ -121,6 +121,21 @@ export declare const inputConfig: {
|
|
|
121
121
|
borderColor: string;
|
|
122
122
|
background: string;
|
|
123
123
|
color: ThemeColorToken;
|
|
124
|
+
_hover: undefined;
|
|
125
|
+
_disabled: {
|
|
126
|
+
cursor: string;
|
|
127
|
+
background: string;
|
|
128
|
+
color: ThemeColorToken;
|
|
129
|
+
borderColor: string;
|
|
130
|
+
opacity: number;
|
|
131
|
+
};
|
|
132
|
+
_readOnly: {
|
|
133
|
+
color: ThemeColorToken;
|
|
134
|
+
background: string;
|
|
135
|
+
userSelect: string;
|
|
136
|
+
opacity: number;
|
|
137
|
+
borderColor: string;
|
|
138
|
+
};
|
|
124
139
|
_focus: {
|
|
125
140
|
border: ThemeBorderToken;
|
|
126
141
|
borderColor: ThemeColorToken;
|
|
@@ -128,10 +143,7 @@ export declare const inputConfig: {
|
|
|
128
143
|
backgroundColor: ThemeColorToken;
|
|
129
144
|
};
|
|
130
145
|
"@media(hover: hover)": {
|
|
131
|
-
"&:hover": {
|
|
132
|
-
borderColor: ThemeColorToken;
|
|
133
|
-
};
|
|
134
|
-
"&:hover:not(:focus)": {
|
|
146
|
+
"&:hover:not(:focus):not(:disabled)": {
|
|
135
147
|
backgroundColor: ThemeColorToken;
|
|
136
148
|
borderColor: string;
|
|
137
149
|
};
|
|
@@ -146,29 +158,10 @@ export declare const inputConfig: {
|
|
|
146
158
|
paddingInlineStart: ThemeSpaceToken;
|
|
147
159
|
paddingInlineEnd: ThemeSpaceToken;
|
|
148
160
|
width: string;
|
|
149
|
-
_disabled: {
|
|
150
|
-
cursor: string;
|
|
151
|
-
background: ThemeColorToken;
|
|
152
|
-
color: ThemeColorToken;
|
|
153
|
-
border: number;
|
|
154
|
-
opacity: number;
|
|
155
|
-
};
|
|
156
|
-
_readOnly: {
|
|
157
|
-
color: ThemeColorToken;
|
|
158
|
-
background: ThemeColorToken;
|
|
159
|
-
userSelect: string;
|
|
160
|
-
opacity: number;
|
|
161
|
-
border: number;
|
|
162
|
-
};
|
|
163
161
|
_placeholder: {
|
|
164
162
|
color: ThemeColorToken;
|
|
165
163
|
opacity: number;
|
|
166
164
|
};
|
|
167
|
-
_hover: {
|
|
168
|
-
borderColor: ThemeColorToken;
|
|
169
|
-
_disabled: undefined;
|
|
170
|
-
_readOnly: undefined;
|
|
171
|
-
};
|
|
172
165
|
};
|
|
173
166
|
addon: {
|
|
174
167
|
color: ThemeColorToken;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/input-theme.ts"],"names":[],"mappings":"AAIA,OAAO,EACN,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"input-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/input-theme.ts"],"names":[],"mappings":"AAIA,OAAO,EACN,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,MAAM,iBAAiB,CAAC;AA8JzB,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAMtB,CAAC"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { createMultiStyleConfigHelpers as
|
|
2
|
-
import { isTouchScreenDevice as
|
|
1
|
+
import { createMultiStyleConfigHelpers as s, defineStyle as l } from "@chakra-ui/react";
|
|
2
|
+
import { isTouchScreenDevice as b } from "../../theme-helper.js";
|
|
3
3
|
import { ThemeColorVariable as n } from "../../theme-types.js";
|
|
4
|
-
import { ThemeColorToken as o, ThemeSpaceToken as r, ThemeRadiusToken as t, ThemeBorderToken as
|
|
5
|
-
import { inputAnatomy as
|
|
6
|
-
const { definePartsStyle:
|
|
7
|
-
fontFamily:
|
|
4
|
+
import { ThemeColorToken as o, ThemeSpaceToken as r, ThemeRadiusToken as t, ThemeBorderToken as a, ThemeFontToken as f, ThemeFontSizeToken as i } from "../theme-tokens.js";
|
|
5
|
+
import { inputAnatomy as m } from "../../../packages/casper-ui-library/node_modules/@chakra-ui/anatomy/dist/esm/components.js";
|
|
6
|
+
const { definePartsStyle: d, defineMultiStyleConfig: p } = s(m.keys), c = {
|
|
7
|
+
fontFamily: f.Body,
|
|
8
8
|
color: o.OnSurface,
|
|
9
|
-
border:
|
|
9
|
+
border: a.XSmall,
|
|
10
10
|
borderColor: o.OnSurfaceBorder,
|
|
11
11
|
background: o.Surface,
|
|
12
12
|
borderRadius: t.Small,
|
|
@@ -40,7 +40,7 @@ const { definePartsStyle: a, defineMultiStyleConfig: p } = f(b.keys), c = {
|
|
|
40
40
|
boxShadow: `0 0 0 4px ${n.InfoContainer}`
|
|
41
41
|
},
|
|
42
42
|
_hover: {
|
|
43
|
-
borderColor:
|
|
43
|
+
borderColor: b() ? o.OnSurfaceBorder : o.OnSurface,
|
|
44
44
|
_disabled: void 0,
|
|
45
45
|
_readOnly: void 0
|
|
46
46
|
}
|
|
@@ -79,65 +79,77 @@ const { definePartsStyle: a, defineMultiStyleConfig: p } = f(b.keys), c = {
|
|
|
79
79
|
px: r.Small
|
|
80
80
|
})
|
|
81
81
|
}, g = {
|
|
82
|
-
lg:
|
|
82
|
+
lg: d({
|
|
83
83
|
field: e.lg,
|
|
84
84
|
addon: e.lg,
|
|
85
85
|
element: e.lg
|
|
86
86
|
}),
|
|
87
|
-
md:
|
|
87
|
+
md: d({
|
|
88
88
|
field: e.md,
|
|
89
89
|
addon: e.md,
|
|
90
90
|
element: e.md
|
|
91
91
|
}),
|
|
92
|
-
sm:
|
|
92
|
+
sm: d({
|
|
93
93
|
field: e.sm,
|
|
94
94
|
addon: e.sm,
|
|
95
95
|
element: e.sm
|
|
96
96
|
})
|
|
97
|
-
},
|
|
97
|
+
}, C = d({
|
|
98
98
|
field: {
|
|
99
99
|
...c,
|
|
100
|
-
border:
|
|
100
|
+
border: a.XSmall,
|
|
101
101
|
borderColor: "transparent",
|
|
102
102
|
background: "none",
|
|
103
103
|
color: o.OnSurface,
|
|
104
|
+
_hover: void 0,
|
|
105
|
+
_disabled: {
|
|
106
|
+
cursor: "not-allowed",
|
|
107
|
+
background: "none",
|
|
108
|
+
color: o.OnSurfaceSubdued,
|
|
109
|
+
borderColor: "transparent",
|
|
110
|
+
opacity: 1
|
|
111
|
+
},
|
|
112
|
+
_readOnly: {
|
|
113
|
+
color: o.OnSurface,
|
|
114
|
+
background: "none",
|
|
115
|
+
userSelect: "text",
|
|
116
|
+
opacity: 1,
|
|
117
|
+
borderColor: "transparent"
|
|
118
|
+
},
|
|
104
119
|
_focus: {
|
|
105
|
-
border:
|
|
120
|
+
border: a.XSmall,
|
|
106
121
|
borderColor: o.Info,
|
|
107
122
|
boxShadow: `0 0 0 4px ${n.InfoContainer}`,
|
|
108
123
|
backgroundColor: o.Surface
|
|
109
124
|
},
|
|
110
125
|
"@media(hover: hover)": {
|
|
111
|
-
"&:hover": {
|
|
112
|
-
borderColor: o.Info
|
|
113
|
-
},
|
|
114
|
-
"&:hover:not(:focus)": {
|
|
126
|
+
"&:hover:not(:focus):not(:disabled)": {
|
|
115
127
|
backgroundColor: o.SurfaceDisabled,
|
|
116
128
|
borderColor: "transparent"
|
|
117
129
|
}
|
|
118
130
|
},
|
|
119
131
|
_invalid: {
|
|
120
|
-
border:
|
|
132
|
+
border: a.XSmall,
|
|
121
133
|
borderColor: o.Error,
|
|
122
134
|
boxShadow: `0 0 0 4px ${n.ErrorContainer}`
|
|
123
135
|
}
|
|
124
136
|
},
|
|
125
137
|
addon: u,
|
|
126
138
|
element: S
|
|
127
|
-
}),
|
|
139
|
+
}), h = {
|
|
128
140
|
outline: {
|
|
129
141
|
field: c,
|
|
130
142
|
addon: u,
|
|
131
143
|
element: S
|
|
132
144
|
},
|
|
133
|
-
ghost:
|
|
134
|
-
},
|
|
145
|
+
ghost: C
|
|
146
|
+
}, T = p({
|
|
135
147
|
sizes: g,
|
|
136
|
-
variants:
|
|
148
|
+
variants: h,
|
|
137
149
|
defaultProps: {
|
|
138
150
|
variant: "outline"
|
|
139
151
|
}
|
|
140
152
|
});
|
|
141
153
|
export {
|
|
142
|
-
|
|
154
|
+
T as inputConfig
|
|
143
155
|
};
|
|
@@ -98,6 +98,21 @@ export declare const selectConfig: {
|
|
|
98
98
|
borderColor?: string | undefined;
|
|
99
99
|
background?: string | undefined;
|
|
100
100
|
color?: ThemeColorToken | undefined;
|
|
101
|
+
_hover?: undefined;
|
|
102
|
+
_disabled?: {
|
|
103
|
+
cursor: string;
|
|
104
|
+
background: string;
|
|
105
|
+
color: ThemeColorToken;
|
|
106
|
+
borderColor: string;
|
|
107
|
+
opacity: number;
|
|
108
|
+
} | undefined;
|
|
109
|
+
_readOnly?: {
|
|
110
|
+
color: ThemeColorToken;
|
|
111
|
+
background: string;
|
|
112
|
+
userSelect: string;
|
|
113
|
+
opacity: number;
|
|
114
|
+
borderColor: string;
|
|
115
|
+
} | undefined;
|
|
101
116
|
_focus?: {
|
|
102
117
|
border: import('../theme-tokens.js').ThemeBorderToken;
|
|
103
118
|
borderColor: ThemeColorToken;
|
|
@@ -105,10 +120,7 @@ export declare const selectConfig: {
|
|
|
105
120
|
backgroundColor: ThemeColorToken;
|
|
106
121
|
} | undefined;
|
|
107
122
|
"@media(hover: hover)"?: {
|
|
108
|
-
"&:hover": {
|
|
109
|
-
borderColor: ThemeColorToken;
|
|
110
|
-
};
|
|
111
|
-
"&:hover:not(:focus)": {
|
|
123
|
+
"&:hover:not(:focus):not(:disabled)": {
|
|
112
124
|
backgroundColor: ThemeColorToken;
|
|
113
125
|
borderColor: string;
|
|
114
126
|
};
|
|
@@ -123,29 +135,10 @@ export declare const selectConfig: {
|
|
|
123
135
|
paddingInlineStart?: import('../theme-tokens.js').ThemeSpaceToken | undefined;
|
|
124
136
|
paddingInlineEnd?: import('../theme-tokens.js').ThemeSpaceToken | undefined;
|
|
125
137
|
width?: string | undefined;
|
|
126
|
-
_disabled?: {
|
|
127
|
-
cursor: string;
|
|
128
|
-
background: ThemeColorToken;
|
|
129
|
-
color: ThemeColorToken;
|
|
130
|
-
border: number;
|
|
131
|
-
opacity: number;
|
|
132
|
-
} | undefined;
|
|
133
|
-
_readOnly?: {
|
|
134
|
-
color: ThemeColorToken;
|
|
135
|
-
background: ThemeColorToken;
|
|
136
|
-
userSelect: string;
|
|
137
|
-
opacity: number;
|
|
138
|
-
border: number;
|
|
139
|
-
} | undefined;
|
|
140
138
|
_placeholder?: {
|
|
141
139
|
color: ThemeColorToken;
|
|
142
140
|
opacity: number;
|
|
143
141
|
} | undefined;
|
|
144
|
-
_hover?: {
|
|
145
|
-
borderColor: ThemeColorToken;
|
|
146
|
-
_disabled: undefined;
|
|
147
|
-
_readOnly: undefined;
|
|
148
|
-
} | undefined;
|
|
149
142
|
};
|
|
150
143
|
icon: {
|
|
151
144
|
fontSize: ThemeFontSizeToken;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/select-theme.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AA8CtE,eAAO,MAAM,YAAY
|
|
1
|
+
{"version":3,"file":"select-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/select-theme.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AA8CtE,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQvB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/textarea-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,0BAA0B,EAAqB,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"textarea-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/textarea-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,0BAA0B,EAAqB,MAAM,kBAAkB,CAAC;AA2FtF,eAAO,MAAM,cAAc,EAAE,0BAQ3B,CAAC"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { defineStyleConfig as d } from "@chakra-ui/react";
|
|
2
2
|
import { isTouchScreenDevice as n } from "../../theme-helper.js";
|
|
3
|
-
import { ThemeColorVariable as
|
|
4
|
-
import { ThemeColorToken as o, ThemeBorderToken as
|
|
3
|
+
import { ThemeColorVariable as e } from "../../theme-types.js";
|
|
4
|
+
import { ThemeColorToken as o, ThemeBorderToken as r, ThemeSpaceToken as l, ThemeRadiusToken as t, ThemeFontToken as c } from "../theme-tokens.js";
|
|
5
5
|
const a = {
|
|
6
6
|
fontFamily: c.Body,
|
|
7
7
|
color: o.OnSurface,
|
|
8
|
-
border:
|
|
8
|
+
border: r.XSmall,
|
|
9
9
|
borderColor: o.OnSurfaceBorder,
|
|
10
10
|
background: o.Surface,
|
|
11
|
-
borderRadius:
|
|
11
|
+
borderRadius: t.Small,
|
|
12
12
|
paddingX: l.Medium,
|
|
13
13
|
paddingY: "12px",
|
|
14
14
|
width: "100%",
|
|
@@ -32,7 +32,7 @@ const a = {
|
|
|
32
32
|
},
|
|
33
33
|
_invalid: {
|
|
34
34
|
borderColor: o.Error,
|
|
35
|
-
boxShadow: `0 0 0 4px ${
|
|
35
|
+
boxShadow: `0 0 0 4px ${e.ErrorContainer}`
|
|
36
36
|
},
|
|
37
37
|
_hover: {
|
|
38
38
|
borderColor: n() ? o.OnSurfaceBorder : o.OnSurface,
|
|
@@ -41,39 +41,52 @@ const a = {
|
|
|
41
41
|
},
|
|
42
42
|
_focus: {
|
|
43
43
|
borderColor: o.Info,
|
|
44
|
-
boxShadow: `0 0 0 4px ${
|
|
44
|
+
boxShadow: `0 0 0 4px ${e.InfoContainer}`
|
|
45
45
|
}
|
|
46
|
-
},
|
|
46
|
+
}, i = {
|
|
47
47
|
...a,
|
|
48
|
-
border:
|
|
48
|
+
border: r.XSmall,
|
|
49
|
+
borderColor: "transparent",
|
|
50
|
+
_hover: void 0,
|
|
51
|
+
_disabled: {
|
|
52
|
+
cursor: "not-allowed",
|
|
53
|
+
background: "none",
|
|
54
|
+
color: o.OnSurfaceSubdued,
|
|
55
|
+
borderColor: "transparent",
|
|
56
|
+
opacity: 1
|
|
57
|
+
},
|
|
58
|
+
_readOnly: {
|
|
59
|
+
color: o.OnSurface,
|
|
60
|
+
background: "none",
|
|
61
|
+
userSelect: "text",
|
|
62
|
+
opacity: 1,
|
|
63
|
+
borderColor: "transparent"
|
|
64
|
+
},
|
|
49
65
|
_focus: {
|
|
50
|
-
border:
|
|
66
|
+
border: r.XSmall,
|
|
51
67
|
borderColor: o.Info,
|
|
52
|
-
boxShadow: `0 0 0 4px ${
|
|
68
|
+
boxShadow: `0 0 0 4px ${e.InfoContainer}`
|
|
53
69
|
},
|
|
54
70
|
"@media(hover: hover)": {
|
|
55
|
-
"&:hover": {
|
|
56
|
-
borderColor: o.Info
|
|
57
|
-
},
|
|
58
|
-
"&:hover:not(:focus)": {
|
|
71
|
+
"&:hover:not(:focus):not(:disabled)": {
|
|
59
72
|
backgroundColor: o.SurfaceDisabled,
|
|
60
|
-
borderColor:
|
|
73
|
+
borderColor: "transparent"
|
|
61
74
|
}
|
|
62
75
|
},
|
|
63
76
|
_invalid: {
|
|
64
|
-
border:
|
|
77
|
+
border: r.XSmall,
|
|
65
78
|
borderColor: o.Error,
|
|
66
|
-
boxShadow: `0 0 0 4px ${
|
|
79
|
+
boxShadow: `0 0 0 4px ${e.ErrorContainer}`
|
|
67
80
|
}
|
|
68
|
-
},
|
|
81
|
+
}, f = d({
|
|
69
82
|
variants: {
|
|
70
83
|
unstyled: a,
|
|
71
|
-
ghost:
|
|
84
|
+
ghost: i
|
|
72
85
|
},
|
|
73
86
|
defaultProps: {
|
|
74
87
|
variant: "unstyled"
|
|
75
88
|
}
|
|
76
89
|
});
|
|
77
90
|
export {
|
|
78
|
-
|
|
91
|
+
f as textareaConfig
|
|
79
92
|
};
|