@vygruppen/spor-react 12.6.2 → 12.6.4

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 (16) hide show
  1. package/.turbo/turbo-build.log +12 -12
  2. package/.turbo/turbo-postinstall.log +1 -1
  3. package/CHANGELOG.md +18 -0
  4. package/dist/index.d.mts +15 -8
  5. package/dist/index.d.ts +15 -8
  6. package/dist/index.js +38 -27
  7. package/dist/index.js.map +1 -1
  8. package/dist/index.mjs +38 -27
  9. package/dist/index.mjs.map +1 -1
  10. package/package.json +2 -2
  11. package/src/datepicker/DateRangePicker.tsx +1 -1
  12. package/src/input/Combobox.tsx +2 -0
  13. package/src/theme/recipes/button.ts +8 -7
  14. package/src/theme/slot-recipes/dialog.ts +7 -1
  15. package/src/theme/slot-recipes/field.ts +6 -8
  16. package/src/theme/slot-recipes/tabs.ts +5 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vygruppen/spor-react",
3
- "version": "12.6.2",
3
+ "version": "12.6.4",
4
4
  "exports": {
5
5
  ".": {
6
6
  "types": "./dist/index.d.ts",
@@ -46,7 +46,7 @@
46
46
  "react-swipeable": "^7.0.1",
47
47
  "usehooks-ts": "^3.1.0",
48
48
  "@vygruppen/spor-design-tokens": "4.0.7",
49
- "@vygruppen/spor-icon-react": "4.2.0",
49
+ "@vygruppen/spor-icon-react": "4.2.1",
50
50
  "@vygruppen/spor-loader": "0.6.0"
51
51
  },
52
52
  "devDependencies": {
package/src/datepicker/DateRangePicker.tsx CHANGED
@@ -9,8 +9,8 @@ import {
9
9
  useFieldContext,
10
10
  useSlotRecipe,
11
11
  } from "@chakra-ui/react";
12
- import { DateValue } from "@internationalized/date";
13
12
  import { PropsWithChildren, useRef } from "react";
13
+ import { DateValue } from "react-aria";
14
14
  import {
15
15
  AriaDateRangePickerProps,
16
16
  I18nProvider,
package/src/input/Combobox.tsx CHANGED
@@ -76,6 +76,7 @@ export const Combobox = (props: ComboboxProps<object>) => {
76
76
  inputRef: externalInputRef,
77
77
  children,
78
78
  variant,
79
+ ...restProps
79
80
  } = props;
80
81
  const { contains } = useFilter({ sensitivity: "base" });
81
82
 
@@ -128,6 +129,7 @@ export const Combobox = (props: ComboboxProps<object>) => {
128
129
  return (
129
130
  <>
130
131
  <Input
132
+ {...restProps}
131
133
  {...styleProps(comboBoxProps)}
132
134
  aria-haspopup="listbox"
133
135
  ref={inputRef}
package/src/theme/recipes/button.ts CHANGED
@@ -15,8 +15,6 @@ export const buttonRecipe = defineRecipe({
15
15
  cursor: "pointer",
16
16
  textWrap: "wrap",
17
17
  width: "fit-content",
18
- paddingX: 3,
19
- paddingY: 1,
20
18
  _disabled: {
21
19
  cursor: "not-allowed",
22
20
  pointerEvents: "none",
@@ -98,27 +96,30 @@ export const buttonRecipe = defineRecipe({
98
96
  xs: {
99
97
  minHeight: 5,
100
98
  minWidth: 5,
101
- paddingY: 0.5,
102
- fontSize: "xs",
99
+ paddingX: 1.5,
100
+ fontSize: "mobile.xs",
103
101
  fontWeight: "normal",
104
102
  },
105
103
  sm: {
106
104
  minHeight: 6,
107
105
  minWidth: 6,
108
- fontSize: "xs",
106
+ paddingX: 2,
107
+ fontSize: "mobile.sm",
109
108
  fontWeight: "normal",
110
109
  },
111
110
  md: {
112
111
  minHeight: 7,
113
112
  minWidth: 7,
114
- fontSize: "sm",
113
+ fontSize: "mobile.md",
115
114
  fontWeight: "bold",
115
+ paddingX: 3,
116
116
  },
117
117
  lg: {
118
118
  minHeight: 8,
119
119
  minWidth: 8,
120
- fontSize: "sm",
120
+ fontSize: "mobile.md",
121
121
  fontWeight: "bold",
122
+ paddingX: 3,
122
123
  },
123
124
  },
124
125
  },
package/src/theme/slot-recipes/dialog.ts CHANGED
@@ -145,36 +145,42 @@ export const dialogSlotRecipe = defineSlotRecipe({
145
145
  xs: {
146
146
  content: {
147
147
  maxWidth: "sm",
148
+ height: "auto",
148
149
  },
149
150
  },
150
151
  sm: {
151
152
  content: {
152
153
  maxWidth: "md",
154
+ height: "auto",
153
155
  },
154
156
  },
155
157
  md: {
156
158
  content: {
157
159
  maxWidth: "lg",
160
+ height: "auto",
158
161
  },
159
162
  },
160
163
  lg: {
161
164
  content: {
162
165
  maxWidth: "2xl",
166
+ height: "auto",
163
167
  },
164
168
  },
165
169
  xl: {
166
170
  content: {
167
171
  maxWidth: "4xl",
172
+ height: "auto",
168
173
  },
169
174
  },
170
175
  cover: {
171
176
  positioner: {
172
- padding: "10",
177
+ padding: "4",
173
178
  },
174
179
  content: {
175
180
  width: "100%",
176
181
  height: "100%",
177
182
  "--dialog-margin": "0",
183
+ margin: "0",
178
184
  },
179
185
  },
180
186
  },
package/src/theme/slot-recipes/field.ts CHANGED
@@ -38,15 +38,13 @@ export const fieldSlotRecipe = defineSlotRecipe({
38
38
  _after: {
39
39
  content: "''",
40
40
  position: "absolute",
41
- marginTop: "-0.45em",
41
+ top: 0,
42
42
  left: "1em",
43
- width: 0,
44
- height: 0,
45
- transform: "rotate(45deg)",
46
- borderLeft: "0.5em solid transparent",
47
- borderRight: "0.5em solid transparent",
48
- borderBottom: "0.5em solid",
49
- borderColor: "lightRed",
43
+ width: "0.5rem",
44
+ height: "0.5rem",
45
+ backgroundColor: "lightRed",
46
+ transform: "translateY(-50%) rotate(45deg)",
47
+ pointerEvents: "none",
50
48
  },
51
49
  },
52
50
  },
package/src/theme/slot-recipes/tabs.ts CHANGED
@@ -84,6 +84,9 @@ export const tabsSlotRecipe = defineSlotRecipe({
84
84
  _selected: {
85
85
  backgroundColor: "brand.surface",
86
86
  color: "brand.text",
87
+ _hover: {
88
+ outline: "none",
89
+ },
87
90
  },
88
91
  _disabled: {
89
92
  backgroundColor: "surface.disabled",
@@ -98,6 +101,7 @@ export const tabsSlotRecipe = defineSlotRecipe({
98
101
  },
99
102
  trigger: {
100
103
  color: "accent.text",
104
+
101
105
  _disabled: {
102
106
  backgroundColor: "surface.disabled",
103
107
  color: "accent.text.disabled",
@@ -115,6 +119,7 @@ export const tabsSlotRecipe = defineSlotRecipe({
115
119
  _hover: {
116
120
  backgroundColor: "brand.surface.hover",
117
121
  color: "brand.text",
122
+ outline: "none",
118
123
  },
119
124
  },
120
125
  },