@vygruppen/spor-react 12.4.0 → 12.4.2

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vygruppen/spor-react",
3
- "version": "12.4.0",
3
+ "version": "12.4.2",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./src/index.d.ts",
@@ -58,7 +58,7 @@ export const CountryCodeSelect = forwardRef<
58
58
  variant={"rightSideSquare"}
59
59
  >
60
60
  {callingCodes.items.map((code) => (
61
- <SelectItem key={code.label} item={code}>
61
+ <SelectItem as={"option"} key={code.label} item={code}>
62
62
  {code.label}
63
63
  </SelectItem>
64
64
  ))}
@@ -102,6 +102,7 @@ export const PhoneNumberInput = forwardRef<
102
102
  <Input
103
103
  ref={ref}
104
104
  type="tel"
105
+ {...props}
105
106
  value={value.nationalNumber}
106
107
  invalid={invalid}
107
108
  errorText={errorText}
@@ -116,7 +117,6 @@ export const PhoneNumberInput = forwardRef<
116
117
  }}
117
118
  variant={variant}
118
119
  data-state="on"
119
- {...props}
120
120
  label={label}
121
121
  />
122
122
  </>
@@ -93,6 +93,7 @@ export const selectSlotRecipe = defineSlotRecipe({
93
93
  animationStyle: "slide-fade-in",
94
94
  animationDuration: "fast",
95
95
  zIndex: "popover",
96
+ outline: "none",
96
97
  },
97
98
  _closed: {
98
99
  animationStyle: "slide-fade-out",
@@ -112,7 +113,17 @@ export const selectSlotRecipe = defineSlotRecipe({
112
113
  color: "ghost.text",
113
114
  cursor: "pointer",
114
115
  outline: "none",
115
-
116
+ "&[data-highlighted]:hover": {
117
+ outlineOffset: "2px",
118
+ outline: "2px solid",
119
+ outlineColor: "outline.focus",
120
+ backgroundColor: "ghost.surface.hover",
121
+ },
122
+ "&[data-highlighted]": {
123
+ outlineOffset: "2px",
124
+ outline: "2px solid",
125
+ outlineColor: "outline.focus",
126
+ },
116
127
  _active: {
117
128
  backgroundColor: "ghost.surface.active",
118
129
  color: "green",