@vygruppen/spor-react 12.6.1 → 12.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vygruppen/spor-react",
-  "version": "12.6.1",
+  "version": "12.6.3",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -46,7 +46,7 @@
     "react-swipeable": "^7.0.1",
     "usehooks-ts": "^3.1.0",
     "@vygruppen/spor-design-tokens": "4.0.7",
-    "@vygruppen/spor-icon-react": "4.2.0",
+    "@vygruppen/spor-icon-react": "4.2.1",
     "@vygruppen/spor-loader": "0.6.0"
   },
   "devDependencies": {
@@ -66,8 +66,8 @@
     "vitest": "^0.26.3",
     "vitest-axe": "^0.1.0",
     "vitest-canvas-mock": "^0.2.2",
-    "@vygruppen/eslint-config": "1.1.1",
-    "@vygruppen/tsconfig": "0.1.0"
+    "@vygruppen/tsconfig": "0.1.0",
+    "@vygruppen/eslint-config": "1.1.1"
   },
   "peerDependencies": {
     "react": ">=18.0.0 <19.0.0",

package/src/input/Combobox.tsx

@@ -76,6 +76,7 @@ export const Combobox = (props: ComboboxProps<object>) => {
     inputRef: externalInputRef,
     children,
     variant,
+    ...restProps
   } = props;
   const { contains } = useFilter({ sensitivity: "base" });
 
@@ -128,6 +129,7 @@ export const Combobox = (props: ComboboxProps<object>) => {
   return (
     <>
       <Input
+        {...restProps}
         {...styleProps(comboBoxProps)}
         aria-haspopup="listbox"
         ref={inputRef}

package/src/input/NumericStepper.tsx

@@ -6,7 +6,7 @@ import {
   useControllableState,
   useSlotRecipe,
 } from "@chakra-ui/react";
-import React, { PropsWithChildren, useRef } from "react";
+import React, { useRef } from "react";
 
 import { BoxProps, createTexts, IconButton, Text, useTranslation } from "..";
 import { numericStepperRecipe } from "../theme/slot-recipes/numeric-stepper";
@@ -14,10 +14,9 @@ import { Field, FieldBaseProps } from "./Field";
 
 type NumericStepperVariants = RecipeVariantProps<typeof numericStepperRecipe>;
 
-export type NumericStepperProps = BoxProps &
-  FieldBaseProps &
-  PropsWithChildren<NumericStepperVariants> & {
-    children: React.ReactNode;
+export type NumericStepperProps = FieldBaseProps &
+  NumericStepperVariants & {
+    children?: React.ReactNode;
     /** The name of the input field */
     name?: string;
     /** The current value */

package/src/theme/slot-recipes/dialog.ts

@@ -145,36 +145,42 @@ export const dialogSlotRecipe = defineSlotRecipe({
       xs: {
         content: {
           maxWidth: "sm",
+          height: "auto",
         },
       },
       sm: {
         content: {
           maxWidth: "md",
+          height: "auto",
         },
       },
       md: {
         content: {
           maxWidth: "lg",
+          height: "auto",
         },
       },
       lg: {
         content: {
           maxWidth: "2xl",
+          height: "auto",
         },
       },
       xl: {
         content: {
           maxWidth: "4xl",
+          height: "auto",
         },
       },
       cover: {
         positioner: {
-          padding: "10",
+          padding: "4",
         },
         content: {
           width: "100%",
           height: "100%",
           "--dialog-margin": "0",
+          margin: "0",
         },
       },
     },

package/src/theme/slot-recipes/tabs.ts

@@ -84,6 +84,9 @@ export const tabsSlotRecipe = defineSlotRecipe({
           _selected: {
             backgroundColor: "brand.surface",
             color: "brand.text",
+            _hover: {
+              outline: "none",
+            },
           },
           _disabled: {
             backgroundColor: "surface.disabled",
@@ -98,6 +101,7 @@ export const tabsSlotRecipe = defineSlotRecipe({
         },
         trigger: {
           color: "accent.text",
+
           _disabled: {
             backgroundColor: "surface.disabled",
             color: "accent.text.disabled",
@@ -115,6 +119,7 @@ export const tabsSlotRecipe = defineSlotRecipe({
             _hover: {
               backgroundColor: "brand.surface.hover",
               color: "brand.text",
+              outline: "none",
             },
           },
         },