@vygruppen/spor-react 12.4.7 → 12.4.8

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@12.4.7 build /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@12.4.8 build /home/runner/work/spor/spor/packages/spor-react
 > tsup
 
 CLI Building entry: src/index.tsx, src/icons/index.tsx
@@ -10,18 +10,18 @@ CLI Target: node16
 CJS Build start
 ESM Build start
 DTS Build start
-ESM dist/index.mjs           290.18 KB
-ESM dist/icons/index.mjs     110.00 B
-ESM dist/index.mjs.map       622.39 KB
-ESM dist/icons/index.mjs.map 157.00 B
-ESM ⚡️ Build success in 2865ms
+CJS dist/index.js           310.50 KB
 CJS dist/icons/index.js     380.00 B
-CJS dist/index.js           310.62 KB
+CJS dist/index.js.map       621.95 KB
 CJS dist/icons/index.js.map 157.00 B
-CJS dist/index.js.map       622.39 KB
-CJS ⚡️ Build success in 2866ms
-DTS ⚡️ Build success in 28808ms
+CJS ⚡️ Build success in 2782ms
+ESM dist/index.mjs           289.96 KB
+ESM dist/icons/index.mjs     110.00 B
+ESM dist/index.mjs.map       621.95 KB
+ESM dist/icons/index.mjs.map 157.00 B
+ESM ⚡️ Build success in 2783ms
+DTS ⚡️ Build success in 30215ms
 DTS dist/icons/index.d.ts  44.00 B
-DTS dist/index.d.ts        126.45 KB
+DTS dist/index.d.ts        126.70 KB
 DTS dist/icons/index.d.mts 44.00 B
-DTS dist/index.d.mts       126.45 KB
+DTS dist/index.d.mts       126.70 KB

package/.turbo/turbo-postinstall.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@12.4.7 postinstall /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@12.4.8 postinstall /home/runner/work/spor/spor/packages/spor-react
 > chakra typegen src/theme/index.ts
 
 ┌  Chakra CLI ⚡️

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @vygruppen/spor-react
 
+## 12.4.8
+
+### Patch Changes
+
+- 0781619: Remove unnecessary box wrapper from table to allow props to be inserted directly to table root.
+
 ## 12.4.7
 
 ### Patch Changes

package/dist/index.d.mts

@@ -2,7 +2,7 @@ import * as React$1 from 'react';
 import React__default, { PropsWithChildren, ReactNode } from 'react';
 import * as _chakra_ui_react from '@chakra-ui/react';
 import { Accordion as Accordion$1, Alert as Alert$1, ConditionalValue, Breadcrumb as Breadcrumb$1, RecipeVariantProps, ButtonProps as ButtonProps$1, GroupProps, Clipboard as Clipboard$1, IconButtonProps as IconButtonProps$1, BoxProps, Field as Field$1, PopoverRootProps, Dialog, Drawer as Drawer$1, Checkbox as Checkbox$1, CheckboxGroupProps as CheckboxGroupProps$1, CheckboxCardRootProps, CheckboxCard, Fieldset as Fieldset$1, InputProps as InputProps$1, ListRootProps, NativeSelectFieldProps, NativeSelect as NativeSelect$1, RadioGroup as RadioGroup$1, SelectRootProps, SelectLabelProps, Select as Select$1, CollectionItem, Switch as Switch$1, TextareaProps as TextareaProps$1, RadioCard as RadioCard$1, SeparatorProps, LinkProps as LinkProps$1, List as List$1, UseProgressProps, SkeletonProps as SkeletonProps$1, CircleProps, Popover as Popover$1, Pagination as Pagination$1, ChakraProviderProps, SystemContext, TabsRootProps, Tabs as Tabs$1, TableRootProps, Table as Table$1, BadgeProps as BadgeProps$1, CodeProps, HeadingProps as HeadingProps$1, TextProps as TextProps$1 } from '@chakra-ui/react';
-export { Box, BoxProps, BreadcrumbCurrentLink, BreadcrumbEllipsis, BreadcrumbLink, Center, CenterProps, ClientOnly, Collapsible, CollapsibleRootProps, Container, ContainerProps, Em, Flex, FlexProps, For, FormatByte, FormatNumber, Grid, GridItem, GridItemProps, GridProps, HStack, Image, ImageProps, Kbd, LocaleProvider, Portal, PortalProps, Show, SimpleGrid, SimpleGridProps, Spacer, SpacerProps, Span, Stack, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColumn, TableColumnHeader, TableColumnHeaderProps, TableColumnProps, TableFooter, TableFooterProps, TableHeader, TableHeaderProps, TableRoot, TableRootProps, TableRow, TableRowProps, UseDisclosureProps, VStack, VisuallyHidden, createListCollection, createSystem, defineConfig, defineRecipe, defineStyle, useBreakpointValue, useCheckbox, useClipboard, useControllableProp, useDisclosure, useMediaQuery, useToken } from '@chakra-ui/react';
+export { Box, BoxProps, BreadcrumbCurrentLink, BreadcrumbEllipsis, BreadcrumbLink, Center, CenterProps, ClientOnly, Collapsible, CollapsibleRootProps, Container, ContainerProps, Em, Flex, FlexProps, For, FormatByte, FormatNumber, Grid, GridItem, GridItemProps, GridProps, HStack, Image, ImageProps, Kbd, LocaleProvider, Portal, PortalProps, Show, SimpleGrid, SimpleGridProps, Spacer, SpacerProps, Span, Stack, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColumn, TableColumnGroup, TableColumnHeader, TableColumnHeaderProps, TableColumnProps, TableFooter, TableFooterProps, TableHeader, TableHeaderProps, TableRoot, TableRootProps, TableRow, TableRowProps, UseDisclosureProps, VStack, VisuallyHidden, createListCollection, createSystem, defineConfig, defineRecipe, defineStyle, useBreakpointValue, useCheckbox, useClipboard, useControllableProp, useDisclosure, useMediaQuery, useToken } from '@chakra-ui/react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { IconComponent } from '@vygruppen/spor-icon-react';
 import { ThemeProviderProps } from 'next-themes';
@@ -3320,16 +3320,17 @@ declare const tableSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "b
                 backgroundColor: "none";
             };
             columnHeader: {
-                borderLeft: "none";
                 borderBottom: "sm";
                 borderColor: "outline.disabled";
                 backgroundColor: "none";
                 color: "text";
             };
             cell: {
-                _first: {
-                    borderLeft: "none";
+                "&[data-is-numeric=true]": {
+                    textAlign: string;
                 };
+            };
+            row: {
                 "&[data-is-numeric=true]": {
                     textAlign: string;
                 };
@@ -3338,35 +3339,41 @@ declare const tableSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "b
             };
         };
         core: {
+            root: {
+                boxShadow: "0 0 0 1px var(--shadow-color)";
+                shadowColor: "outline.disabled";
+                borderRadius: "sm";
+            };
             table: {
-                borderRadius: "md";
                 overflow: "hidden";
-                border: "sm";
-                borderColor: "outline.disabled";
             };
             cell: {
-                _first: {
-                    borderLeft: "none";
+                borderRight: "sm";
+                borderColor: "outline.disabled";
+                _last: {
+                    borderRight: "none";
                 };
                 "&[data-is-numeric=true]": {
                     textAlign: string;
                 };
-                borderLeft: "sm";
-                borderColor: "outline.disabled";
-            };
-            header: {
-                border: "none";
             };
             columnHeader: {
+                borderRight: "sm";
+                borderColor: "outline.disabled";
                 _first: {
-                    borderLeft: "none";
+                    borderTopLeftRadius: "sm";
+                };
+                _last: {
+                    borderTopRightRadius: "sm";
+                    borderRight: "none";
                 };
                 "&[data-is-numeric=true]": {
                     textAlign: string;
                 };
+            };
+            header: {
                 borderBottom: "sm";
-                borderLeft: "sm";
-                borderLeftColor: "outline.disabled";
+                borderColor: "outline.disabled";
             };
             row: {
                 borderBottom: "sm";

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import * as React$1 from 'react';
 import React__default, { PropsWithChildren, ReactNode } from 'react';
 import * as _chakra_ui_react from '@chakra-ui/react';
 import { Accordion as Accordion$1, Alert as Alert$1, ConditionalValue, Breadcrumb as Breadcrumb$1, RecipeVariantProps, ButtonProps as ButtonProps$1, GroupProps, Clipboard as Clipboard$1, IconButtonProps as IconButtonProps$1, BoxProps, Field as Field$1, PopoverRootProps, Dialog, Drawer as Drawer$1, Checkbox as Checkbox$1, CheckboxGroupProps as CheckboxGroupProps$1, CheckboxCardRootProps, CheckboxCard, Fieldset as Fieldset$1, InputProps as InputProps$1, ListRootProps, NativeSelectFieldProps, NativeSelect as NativeSelect$1, RadioGroup as RadioGroup$1, SelectRootProps, SelectLabelProps, Select as Select$1, CollectionItem, Switch as Switch$1, TextareaProps as TextareaProps$1, RadioCard as RadioCard$1, SeparatorProps, LinkProps as LinkProps$1, List as List$1, UseProgressProps, SkeletonProps as SkeletonProps$1, CircleProps, Popover as Popover$1, Pagination as Pagination$1, ChakraProviderProps, SystemContext, TabsRootProps, Tabs as Tabs$1, TableRootProps, Table as Table$1, BadgeProps as BadgeProps$1, CodeProps, HeadingProps as HeadingProps$1, TextProps as TextProps$1 } from '@chakra-ui/react';
-export { Box, BoxProps, BreadcrumbCurrentLink, BreadcrumbEllipsis, BreadcrumbLink, Center, CenterProps, ClientOnly, Collapsible, CollapsibleRootProps, Container, ContainerProps, Em, Flex, FlexProps, For, FormatByte, FormatNumber, Grid, GridItem, GridItemProps, GridProps, HStack, Image, ImageProps, Kbd, LocaleProvider, Portal, PortalProps, Show, SimpleGrid, SimpleGridProps, Spacer, SpacerProps, Span, Stack, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColumn, TableColumnHeader, TableColumnHeaderProps, TableColumnProps, TableFooter, TableFooterProps, TableHeader, TableHeaderProps, TableRoot, TableRootProps, TableRow, TableRowProps, UseDisclosureProps, VStack, VisuallyHidden, createListCollection, createSystem, defineConfig, defineRecipe, defineStyle, useBreakpointValue, useCheckbox, useClipboard, useControllableProp, useDisclosure, useMediaQuery, useToken } from '@chakra-ui/react';
+export { Box, BoxProps, BreadcrumbCurrentLink, BreadcrumbEllipsis, BreadcrumbLink, Center, CenterProps, ClientOnly, Collapsible, CollapsibleRootProps, Container, ContainerProps, Em, Flex, FlexProps, For, FormatByte, FormatNumber, Grid, GridItem, GridItemProps, GridProps, HStack, Image, ImageProps, Kbd, LocaleProvider, Portal, PortalProps, Show, SimpleGrid, SimpleGridProps, Spacer, SpacerProps, Span, Stack, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColumn, TableColumnGroup, TableColumnHeader, TableColumnHeaderProps, TableColumnProps, TableFooter, TableFooterProps, TableHeader, TableHeaderProps, TableRoot, TableRootProps, TableRow, TableRowProps, UseDisclosureProps, VStack, VisuallyHidden, createListCollection, createSystem, defineConfig, defineRecipe, defineStyle, useBreakpointValue, useCheckbox, useClipboard, useControllableProp, useDisclosure, useMediaQuery, useToken } from '@chakra-ui/react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { IconComponent } from '@vygruppen/spor-icon-react';
 import { ThemeProviderProps } from 'next-themes';
@@ -3320,16 +3320,17 @@ declare const tableSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "b
                 backgroundColor: "none";
             };
             columnHeader: {
-                borderLeft: "none";
                 borderBottom: "sm";
                 borderColor: "outline.disabled";
                 backgroundColor: "none";
                 color: "text";
             };
             cell: {
-                _first: {
-                    borderLeft: "none";
+                "&[data-is-numeric=true]": {
+                    textAlign: string;
                 };
+            };
+            row: {
                 "&[data-is-numeric=true]": {
                     textAlign: string;
                 };
@@ -3338,35 +3339,41 @@ declare const tableSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"root" | "b
             };
         };
         core: {
+            root: {
+                boxShadow: "0 0 0 1px var(--shadow-color)";
+                shadowColor: "outline.disabled";
+                borderRadius: "sm";
+            };
             table: {
-                borderRadius: "md";
                 overflow: "hidden";
-                border: "sm";
-                borderColor: "outline.disabled";
             };
             cell: {
-                _first: {
-                    borderLeft: "none";
+                borderRight: "sm";
+                borderColor: "outline.disabled";
+                _last: {
+                    borderRight: "none";
                 };
                 "&[data-is-numeric=true]": {
                     textAlign: string;
                 };
-                borderLeft: "sm";
-                borderColor: "outline.disabled";
-            };
-            header: {
-                border: "none";
             };
             columnHeader: {
+                borderRight: "sm";
+                borderColor: "outline.disabled";
                 _first: {
-                    borderLeft: "none";
+                    borderTopLeftRadius: "sm";
+                };
+                _last: {
+                    borderTopRightRadius: "sm";
+                    borderRight: "none";
                 };
                 "&[data-is-numeric=true]": {
                     textAlign: string;
                 };
+            };
+            header: {
                 borderBottom: "sm";
-                borderLeft: "sm";
-                borderLeftColor: "outline.disabled";
+                borderColor: "outline.disabled";
             };
             row: {
                 borderBottom: "sm";

package/dist/index.js

@@ -6238,15 +6238,11 @@ var tableSlotRecipe = react.defineSlotRecipe({
     columnHeader: {
       fontWeight: "bold",
       textAlign: "start",
-      borderBottom: "sm",
-      borderColor: "outline.disabled",
       ...numericStyles,
       paddingX: 1.5,
       paddingY: 1
     },
     row: {
-      borderBottom: "sm",
-      borderColor: "outline.disabled",
       ...numericStyles
     },
     cell: {
@@ -6300,48 +6296,53 @@ var tableSlotRecipe = react.defineSlotRecipe({
           backgroundColor: "none"
         },
         columnHeader: {
-          borderLeft: "none",
           borderBottom: "sm",
           borderColor: "outline.disabled",
           backgroundColor: "none",
           color: "text"
         },
         cell: {
+          ...numericStyles
+        },
+        row: {
           borderBottom: "sm",
           borderColor: "outline.disabled",
-          ...numericStyles,
-          _first: {
-            borderLeft: "none"
-          }
+          ...numericStyles
         }
       },
       core: {
+        root: {
+          boxShadow: "0 0 0 1px var(--shadow-color)",
+          shadowColor: "outline.disabled",
+          borderRadius: "sm"
+        },
         table: {
-          borderRadius: "md",
-          overflow: "hidden",
-          border: "sm",
-          borderColor: "outline.disabled"
+          overflow: "hidden"
         },
         cell: {
-          borderLeft: "sm",
-          borderColor: "outline.disabled",
           ...numericStyles,
-          _first: {
-            borderLeft: "none"
+          borderRight: "sm",
+          borderColor: "outline.disabled",
+          _last: {
+            borderRight: "none"
           }
         },
-        header: {
-          border: "none"
-        },
         columnHeader: {
-          borderBottom: "sm",
-          borderLeft: "sm",
-          borderLeftColor: "outline.disabled",
           ...numericStyles,
+          borderRight: "sm",
+          borderColor: "outline.disabled",
           _first: {
-            borderLeft: "none"
+            borderTopLeftRadius: "sm"
+          },
+          _last: {
+            borderTopRightRadius: "sm",
+            borderRight: "none"
           }
         },
+        header: {
+          borderBottom: "sm",
+          borderColor: "outline.disabled"
+        },
         row: {
           ...numericStyles,
           borderBottom: "sm",
@@ -6417,7 +6418,7 @@ var Table = React28.forwardRef((props, ref) => {
   const { variant = "ghost", size, colorPalette = "green", children } = props;
   const recipe = react.useSlotRecipe({ recipe: tableSlotRecipe });
   const styles = recipe({ variant, size });
-  return /* @__PURE__ */ jsxRuntime.jsx(react.Box, { overflowX: "auto", role: "region", ...getStyleProps(props), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     react.Table.Root,
     {
       variant,
@@ -6425,18 +6426,12 @@ var Table = React28.forwardRef((props, ref) => {
       colorPalette,
       css: styles,
       ref,
+      ...props,
       children
     }
-  ) });
+  );
 });
 Table.displayName = "Table";
-function getStyleProps(props) {
-  return props.variant === "core" ? {
-    borderRadius: "sm",
-    border: "sm",
-    borderColor: "outline.disabled"
-  } : {};
-}
 var buttonRecipe = react.defineRecipe({
   className: "spor-button",
   base: {
@@ -10642,6 +10637,10 @@ Object.defineProperty(exports, "TableColumn", {
   enumerable: true,
   get: function () { return react.TableColumn; }
 });
+Object.defineProperty(exports, "TableColumnGroup", {
+  enumerable: true,
+  get: function () { return react.TableColumnGroup; }
+});
 Object.defineProperty(exports, "TableColumnHeader", {
   enumerable: true,
   get: function () { return react.TableColumnHeader; }