@caspeco/casper-ui-library 6.0.0 → 6.1.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.
Files changed (8) hide show
  1. package/dist/components/button/types.d.ts +1 -1
  2. package/dist/components/button/types.d.ts.map +1 -1
  3. package/dist/components/icon-button/icon-button.d.ts +1 -1
  4. package/dist/components/icon-button/types.d.ts +3 -2
  5. package/dist/components/icon-button/types.d.ts.map +1 -1
  6. package/dist/theme/theme-config/components/button-theme.d.ts.map +1 -1
  7. package/dist/theme/theme-config/components/button-theme.js +35 -20
  8. package/package.json +12 -7
package/dist/components/button/types.d.ts CHANGED
@@ -7,7 +7,7 @@ export type ButtonProps = CustomChakraBoxProps & LayoutProps & MarginProps & Pad
7
7
  * @note The 'segmentedControl' variant is only used by the SegmentedControl component.
8
8
  * @note The 'card' variant is deprecated, use the component ToggleButton instead.
9
9
  */
10
- variant?: ResponsiveValue<"primary" | "secondary" | "link" | "ghost" | "tertiary" | "segmentedControl" | "card"> | undefined;
10
+ variant?: ResponsiveValue<"primary" | "secondary" | "link" | "ghost" | "tertiary" | "segmentedControl" | "card" | "alert"> | undefined;
11
11
  /** The size of the button, default: md */
12
12
  size?: ResponsiveValue<"lg" | "sm" | "md"> | undefined;
13
13
  /**
package/dist/components/button/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../lib/components/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC5F,OAAO,EACN,KAAK,WAAW,IAAI,iBAAiB,EACrC,KAAK,SAAS,IAAI,eAAe,EACjC,KAAK,eAAe,EACpB,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,WAAW,GAAG,oBAAoB,GAC7C,WAAW,GACX,WAAW,GACX,YAAY,GACZ,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC,GAChD,IAAI,CAAC,iBAAiB,EAAE,UAAU,GAAG,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG;IACvG;;;;OAIG;IACH,OAAO,CAAC,EACL,eAAe,CAAC,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,kBAAkB,GAAG,MAAM,CAAC,GACtG,SAAS,CAAC;IAEb,0CAA0C;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IAEvD;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAEjC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC;IAEjB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,KAAK,CAAC;CAClB,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../lib/components/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC5F,OAAO,EACN,KAAK,WAAW,IAAI,iBAAiB,EACrC,KAAK,SAAS,IAAI,eAAe,EACjC,KAAK,eAAe,EACpB,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,WAAW,GAAG,oBAAoB,GAC7C,WAAW,GACX,WAAW,GACX,YAAY,GACZ,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC,GAChD,IAAI,CAAC,iBAAiB,EAAE,UAAU,GAAG,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG;IACvG;;;;OAIG;IACH,OAAO,CAAC,EACL,eAAe,CACf,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,kBAAkB,GAAG,MAAM,GAAG,OAAO,CAC9F,GACD,SAAS,CAAC;IAEb,0CAA0C;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IAEvD;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAEjC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC;IAEjB,8CAA8C;IAC9C,SAAS,CAAC,EAAE,KAAK,CAAC;CAClB,CAAC"}
package/dist/components/icon-button/icon-button.d.ts CHANGED
@@ -7,7 +7,7 @@
7
7
  */
8
8
  export declare const IconButton: import('react').ForwardRefExoticComponent<{
9
9
  icon: import('../icon/index.js').Icons;
10
- variant?: "primary" | "secondary" | "ghost" | "tertiary";
10
+ variant?: Exclude<import('../button/index.js').ButtonProps["variant"], "link" | "segmentedControl" | import('@chakra-ui/styled-system').ResponsiveArray<unknown> | Partial<Record<string, unknown>>>;
11
11
  size?: import('@chakra-ui/styled-system').ResponsiveValue<"lg" | "sm" | "md">;
12
12
  } & {
13
13
  "aria-label": string;
package/dist/components/icon-button/types.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { Icons } from '../icon/index.js';
2
2
  import { CustomChakraBoxProps, MarginProps, PaddingProps } from '../../theme/index.js';
3
- import { IconButtonProps as ChakraIconButtonProps, ResponsiveValue } from '@chakra-ui/react';
3
+ import { IconButtonProps as ChakraIconButtonProps, ResponsiveArray, ResponsiveValue } from '@chakra-ui/react';
4
+ import { ButtonProps } from '../button/index.js';
4
5
  type CustomStyleProps = CustomChakraBoxProps & MarginProps & PaddingProps;
5
6
  type CustomProperties = {
6
7
  /**
@@ -10,7 +11,7 @@ type CustomProperties = {
10
11
  /**
11
12
  * Appearance variant for Button.
12
13
  */
13
- variant?: "primary" | "secondary" | "ghost" | "tertiary";
14
+ variant?: Exclude<ButtonProps["variant"], "link" | "segmentedControl" | ResponsiveArray<unknown> | Partial<Record<string, unknown>>>;
14
15
  /**
15
16
  * The size of the button, defaults to md
16
17
  */
package/dist/components/icon-button/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../lib/components/icon-button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC/E,OAAO,KAAK,EAAE,eAAe,IAAI,qBAAqB,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAElG,KAAK,gBAAgB,GAAG,oBAAoB,GAAG,WAAW,GAAG,YAAY,CAAC;AAE1E,KAAK,gBAAgB,GAAG;IACvB;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC;IACZ;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,UAAU,CAAC;IACzD;;OAEG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;CAC3C,CAAC;AAEF,KAAK,0BAA0B,GAAG,IAAI,CACrC,qBAAqB,EACrB,YAAY,GAAG,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,WAAW,CAC5E,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,gBAAgB,GAAG,0BAA0B,GAAG,gBAAgB,CAAC"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../lib/components/icon-button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC/E,OAAO,KAAK,EACX,eAAe,IAAI,qBAAqB,EACxC,eAAe,EACf,eAAe,EACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE7C,KAAK,gBAAgB,GAAG,oBAAoB,GAAG,WAAW,GAAG,YAAY,CAAC;AAE1E,KAAK,gBAAgB,GAAG;IACvB;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC;IACZ;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAChB,WAAW,CAAC,SAAS,CAAC,EACtB,MAAM,GAAG,kBAAkB,GAAG,eAAe,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CACzF,CAAC;IACF;;OAEG;IACH,IAAI,CAAC,EAAE,eAAe,CAAC,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;CAC3C,CAAC;AAEF,KAAK,0BAA0B,GAAG,IAAI,CACrC,qBAAqB,EACrB,YAAY,GAAG,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,WAAW,CAC5E,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,gBAAgB,GAAG,0BAA0B,GAAG,gBAAgB,CAAC"}
package/dist/theme/theme-config/components/button-theme.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"button-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/button-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,0BAA0B,EAA6C,MAAM,kBAAkB,CAAC;AAuN9G,eAAO,MAAM,YAAY,EAAE,0BA+BzB,CAAC"}
1
+ {"version":3,"file":"button-theme.d.ts","sourceRoot":"","sources":["../../../../lib/theme/theme-config/components/button-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,0BAA0B,EAA6C,MAAM,kBAAkB,CAAC;AAuO9G,eAAO,MAAM,YAAY,EAAE,0BAgCzB,CAAC"}
package/dist/theme/theme-config/components/button-theme.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { defineStyleConfig as i } from "@chakra-ui/react";
2
- import { isTouchScreenDevice as e } from "../../theme-helper.js";
2
+ import { isTouchScreenDevice as r } from "../../theme-helper.js";
3
3
  import { ThemeColorToken as o, ThemeBorderToken as a, ThemeRadiusToken as d, ThemeFontToken as t, ThemeFontSizeToken as c } from "../theme-tokens.js";
4
4
  const l = {
5
5
  fontFamily: t.SubHeader,
@@ -21,7 +21,7 @@ const l = {
21
21
  background: o.Accent,
22
22
  color: o.OnAccent,
23
23
  _hover: {
24
- background: e() ? o.Accent : o.AccentHover,
24
+ background: r() ? o.Accent : o.AccentHover,
25
25
  _disabled: {
26
26
  background: o.Accent,
27
27
  color: o.OnAccent
@@ -31,12 +31,12 @@ const l = {
31
31
  background: o.AccentActive,
32
32
  color: o.OnAccent
33
33
  }
34
- }, g = {
34
+ }, b = {
35
35
  background: o.AccentContainer,
36
36
  color: o.OnAccentContainer,
37
37
  _hover: {
38
- background: e() ? o.AccentContainer : o.AccentHover,
39
- color: e() ? o.OnAccentContainer : o.OnAccent,
38
+ background: r() ? o.AccentContainer : o.AccentHover,
39
+ color: r() ? o.OnAccentContainer : o.OnAccent,
40
40
  _disabled: {
41
41
  background: o.AccentContainer,
42
42
  color: o.OnAccentContainer
@@ -46,18 +46,32 @@ const l = {
46
46
  background: o.AccentActive,
47
47
  color: o.OnAccent
48
48
  }
49
- }, b = {
49
+ }, g = {
50
50
  color: o.OnBackground,
51
51
  fontWeight: "medium",
52
52
  _hover: {
53
53
  color: o.OnBackground,
54
- bg: e() ? "none" : o.AccentHoverAlpha,
54
+ bg: r() ? "none" : o.AccentHoverAlpha,
55
55
  textDecoration: "none"
56
56
  },
57
57
  _active: {
58
58
  bg: o.AccentActiveAlpha,
59
59
  color: o.OnBackground
60
60
  }
61
+ }, A = {
62
+ background: o.Error,
63
+ color: o.OnAccent,
64
+ _hover: {
65
+ background: r() ? o.Error : o.ErrorHover,
66
+ _disabled: {
67
+ background: o.Error,
68
+ color: o.OnAccent
69
+ }
70
+ },
71
+ _active: {
72
+ background: o.ErrorActive,
73
+ color: o.OnAccent
74
+ }
61
75
  }, s = {
62
76
  color: o.OnBackground,
63
77
  fontFamily: t.Body,
@@ -69,7 +83,7 @@ const l = {
69
83
  width: "fit-content",
70
84
  border: 0,
71
85
  _hover: {
72
- color: e() ? o.OnBackground : o.AccentHover
86
+ color: r() ? o.OnBackground : o.AccentHover
73
87
  },
74
88
  _active: {
75
89
  color: o.AccentActive,
@@ -78,7 +92,7 @@ const l = {
78
92
  _disabled: {
79
93
  textDecoration: "none"
80
94
  }
81
- }, A = {
95
+ }, v = {
82
96
  flex: "1",
83
97
  fontWeight: "normal",
84
98
  font: t.Body,
@@ -108,7 +122,7 @@ const l = {
108
122
  bg: o.AccentHoverAlpha,
109
123
  color: o.OnAccentContainer
110
124
  }
111
- }, v = {
125
+ }, k = {
112
126
  background: "transparent",
113
127
  color: o.OnBackground,
114
128
  borderColor: o.OnBackgroundBorder,
@@ -134,13 +148,13 @@ const l = {
134
148
  }
135
149
  }
136
150
  }
137
- }, r = '&[aria-pressed="true"]', n = '&[aria-pressed="false"]', k = {
151
+ }, e = '&[aria-pressed="true"]', n = '&[aria-pressed="false"]', h = {
138
152
  // Base style
139
153
  borderRadius: d.Small,
140
154
  borderWidth: a.XSmall,
141
155
  borderColor: o.OnSurfaceBorder,
142
156
  // Pressed state
143
- [`${r}`]: {
157
+ [`${e}`]: {
144
158
  background: o.Accent,
145
159
  color: o.OnAccent
146
160
  },
@@ -151,7 +165,7 @@ const l = {
151
165
  },
152
166
  // Hover styles
153
167
  "@media(hover: hover)": {
154
- [`${r}&:hover`]: {
168
+ [`${e}&:hover`]: {
155
169
  background: o.AccentHover,
156
170
  borderColor: o.AccentHover,
157
171
  _disabled: {
@@ -169,7 +183,7 @@ const l = {
169
183
  }
170
184
  },
171
185
  // Active styles
172
- [`${r}:active`]: {
186
+ [`${e}:active`]: {
173
187
  color: o.OnAccent,
174
188
  background: o.AccentActive
175
189
  },
@@ -178,7 +192,7 @@ const l = {
178
192
  background: o.AccentActiveAlpha
179
193
  },
180
194
  // Define general disabled styles last to ensure they are not overridden
181
- [`${r}:disabled`]: {
195
+ [`${e}:disabled`]: {
182
196
  color: o.OnAccent,
183
197
  background: o.Accent,
184
198
  borderColor: o.Accent
@@ -211,12 +225,13 @@ const l = {
211
225
  },
212
226
  variants: {
213
227
  primary: u,
214
- secondary: g,
215
- ghost: b,
228
+ secondary: b,
229
+ ghost: g,
216
230
  link: s,
217
- segmentedControl: A,
218
- tertiary: v,
219
- toggle: k
231
+ segmentedControl: v,
232
+ tertiary: k,
233
+ toggle: h,
234
+ alert: A
220
235
  }
221
236
  });
222
237
  export {
package/package.json CHANGED
@@ -1,9 +1,14 @@
1
1
  {
2
2
  "name": "@caspeco/casper-ui-library",
3
- "version": "6.0.0",
3
+ "version": "6.1.0",
4
4
  "prettier": "@caspeco/prettier-config",
5
5
  "type": "module",
6
6
  "sideEffects": false,
7
+ "homepage": "https://github.com/Caspeco/casper-ui-library",
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "git+https://github.com/Caspeco/casper-ui-library.git"
11
+ },
7
12
  "files": [
8
13
  "dist"
9
14
  ],
@@ -25,24 +30,24 @@
25
30
  "@arethetypeswrong/cli": "^0.18.2",
26
31
  "@caspeco/eslint-config": "^4.0.5",
27
32
  "@caspeco/prettier-config": "^1.0.6",
28
- "@eslint/js": "^9.35.0",
33
+ "@eslint/js": "^9.36.0",
29
34
  "@testing-library/jest-dom": "^6.8.0",
30
35
  "@testing-library/react": "^16.3.0",
31
36
  "@testing-library/user-event": "^14.6.1",
32
37
  "@types/jest": "^30.0.0",
33
- "@types/node": "^24.4.0",
38
+ "@types/node": "^24.5.2",
34
39
  "@types/react": "^18.3.12",
35
40
  "@types/react-dom": "^18.3.1",
36
- "@vitejs/plugin-react-swc": "^4.0.1",
37
- "eslint": "^9.35.0",
41
+ "@vitejs/plugin-react-swc": "^4.1.0",
42
+ "eslint": "^9.36.0",
38
43
  "eslint-plugin-react-hooks": "^5.2.0",
39
44
  "eslint-plugin-react-refresh": "^0.4.20",
40
45
  "globals": "^16.4.0",
41
46
  "jsdom": "^27.0.0",
42
47
  "tsc-alias": "^1.8.16",
43
48
  "typescript": "~5.9.2",
44
- "typescript-eslint": "^8.43.0",
45
- "vite": "^7.1.5",
49
+ "typescript-eslint": "^8.44.0",
50
+ "vite": "^7.1.6",
46
51
  "vite-plugin-dts": "^4.5.4",
47
52
  "vite-tsconfig-paths": "^5.1.4",
48
53
  "vitest": "^3.2.4"