@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.
@@ -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,2CAsMpB"}
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 N, Flex as c, Box as d, Input as X } from "@chakra-ui/react";
3
- import { Fragment as $ } from "react";
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 j() {
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: B,
30
+ id: j,
31
31
  asPlainText: e,
32
32
  inputValue: h,
33
33
  selectedItems: n,
34
- displayItems: R,
35
- toggleItem: C,
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: s,
42
+ placeHolderText: C,
43
43
  isDisabled: b,
44
- isReadOnly: m,
45
- isInvalid: w,
44
+ isReadOnly: s,
45
+ isInvalid: m,
46
46
  collapsed: k,
47
- hasPendingDelete: t,
48
- setHasPendingDelete: g,
47
+ hasPendingDelete: w,
48
+ setHasPendingDelete: t,
49
49
  setInputValue: O,
50
50
  onSearch: y,
51
51
  isSingleSelect: z
52
52
  }) {
53
- const A = N("Combobox", { size: W, variant: v }), D = (o) => {
54
- if (o.key === "Enter" && (o.preventDefault(), o.stopPropagation(), a.isOpen ? C(R[l.index]) : a.open()), o.key === "Escape") {
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 && (t ? (C(n[n.length - 1]), g(!1)) : g(!0)) : g(!1), o.key === "ArrowDown" && (a.isOpen ? l.next() : a.open()), o.key === "ArrowUp" && (a.isOpen ? l.previous() : a.open());
59
- }, F = (o) => {
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
- }, x = n[0], _ = n[n.length - 1], L = a.isOpen || e || s;
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": m,
70
- "aria-invalid": w,
69
+ "aria-readonly": s,
70
+ "aria-invalid": m,
71
71
  borderRadius: G.Small,
72
72
  padding: u.Small,
73
- _focusWithin: w ? {
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(j, {}),
105
- n.length > 2 && /* @__PURE__ */ i(j, {}),
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: t,
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 && t
118
+ isDeleting: p === n.length - 1 && w
123
119
  },
124
120
  o.id
125
121
  ))),
126
- e && n.length > 0 && x && h === x.label && V[x.id]?.map((o) => /* @__PURE__ */ f($, { children: [
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
- X,
136
+ $,
141
137
  {
142
- id: B,
138
+ id: j,
143
139
  isDisabled: b,
144
- isReadOnly: m,
145
- isInvalid: w,
146
- onKeyDown: D,
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: F,
152
- placeholder: s,
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: L ? {} : {
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 || m ? r.OnSurfaceSubdued : r.OnSurface
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
- "&:hover:not(:focus-within)": {
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;AAgF5E,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIzB,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
- "&:hover:not(:focus-within)": {
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;AAkJzB,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAMtB,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 f, defineStyle as l } from "@chakra-ui/react";
2
- import { isTouchScreenDevice as m } from "../../theme-helper.js";
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 d, ThemeFontToken as s, ThemeFontSizeToken as i } from "../theme-tokens.js";
5
- import { inputAnatomy as b } from "../../../packages/casper-ui-library/node_modules/@chakra-ui/anatomy/dist/esm/components.js";
6
- const { definePartsStyle: a, defineMultiStyleConfig: p } = f(b.keys), c = {
7
- fontFamily: s.Body,
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: d.XSmall,
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: m() ? o.OnSurfaceBorder : o.OnSurface,
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: a({
82
+ lg: d({
83
83
  field: e.lg,
84
84
  addon: e.lg,
85
85
  element: e.lg
86
86
  }),
87
- md: a({
87
+ md: d({
88
88
  field: e.md,
89
89
  addon: e.md,
90
90
  element: e.md
91
91
  }),
92
- sm: a({
92
+ sm: d({
93
93
  field: e.sm,
94
94
  addon: e.sm,
95
95
  element: e.sm
96
96
  })
97
- }, h = a({
97
+ }, C = d({
98
98
  field: {
99
99
  ...c,
100
- border: d.XSmall,
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: d.XSmall,
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: d.XSmall,
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
- }), C = {
139
+ }), h = {
128
140
  outline: {
129
141
  field: c,
130
142
  addon: u,
131
143
  element: S
132
144
  },
133
- ghost: h
134
- }, _ = p({
145
+ ghost: C
146
+ }, T = p({
135
147
  sizes: g,
136
- variants: C,
148
+ variants: h,
137
149
  defaultProps: {
138
150
  variant: "outline"
139
151
  }
140
152
  });
141
153
  export {
142
- _ as inputConfig
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQvB,CAAC"}
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;AA8EtF,eAAO,MAAM,cAAc,EAAE,0BAQ3B,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 r } from "../../theme-types.js";
4
- import { ThemeColorToken as o, ThemeBorderToken as e, ThemeSpaceToken as l, ThemeRadiusToken as i, ThemeFontToken as c } from "../theme-tokens.js";
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: e.XSmall,
8
+ border: r.XSmall,
9
9
  borderColor: o.OnSurfaceBorder,
10
10
  background: o.Surface,
11
- borderRadius: i.Small,
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 ${r.ErrorContainer}`
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 ${r.InfoContainer}`
44
+ boxShadow: `0 0 0 4px ${e.InfoContainer}`
45
45
  }
46
- }, t = {
46
+ }, i = {
47
47
  ...a,
48
- border: "none",
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: e.XSmall,
66
+ border: r.XSmall,
51
67
  borderColor: o.Info,
52
- boxShadow: `0 0 0 4px ${r.InfoContainer}`
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: o.OnSurfaceBorder
73
+ borderColor: "transparent"
61
74
  }
62
75
  },
63
76
  _invalid: {
64
- border: e.XSmall,
77
+ border: r.XSmall,
65
78
  borderColor: o.Error,
66
- boxShadow: `0 0 0 4px ${r.ErrorContainer}`
79
+ boxShadow: `0 0 0 4px ${e.ErrorContainer}`
67
80
  }
68
- }, s = d({
81
+ }, f = d({
69
82
  variants: {
70
83
  unstyled: a,
71
- ghost: t
84
+ ghost: i
72
85
  },
73
86
  defaultProps: {
74
87
  variant: "unstyled"
75
88
  }
76
89
  });
77
90
  export {
78
- s as textareaConfig
91
+ f as textareaConfig
79
92
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@caspeco/casper-ui-library",
3
- "version": "7.10.0",
3
+ "version": "7.10.1",
4
4
  "prettier": "@caspeco/prettier-config",
5
5
  "type": "module",
6
6
  "sideEffects": false,