@vygruppen/spor-react 12.4.7 → 12.4.8

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 (13) hide show
  1. package/.turbo/turbo-build.log +12 -12
  2. package/.turbo/turbo-postinstall.log +1 -1
  3. package/CHANGELOG.md +6 -0
  4. package/dist/index.d.mts +24 -17
  5. package/dist/index.d.ts +24 -17
  6. package/dist/index.js +32 -33
  7. package/dist/index.js.map +1 -1
  8. package/dist/index.mjs +29 -34
  9. package/dist/index.mjs.map +1 -1
  10. package/package.json +1 -1
  11. package/src/table/Table.tsx +10 -22
  12. package/src/table/index.tsx +1 -0
  13. package/src/theme/slot-recipes/table.ts +31 -22
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vygruppen/spor-react",
3
- "version": "12.4.7",
3
+ "version": "12.4.8",
4
4
  "exports": {
5
5
  ".": {
6
6
  "types": "./dist/index.d.ts",
package/src/table/Table.tsx CHANGED
@@ -1,6 +1,5 @@
1
1
  "use client";
2
2
  import {
3
- Box,
4
3
  RecipeVariantProps,
5
4
  Table as ChakraTable,
6
5
  TableRootProps as ChakraTableProps,
@@ -39,27 +38,16 @@ export const Table = forwardRef<HTMLTableElement, TableProps>((props, ref) => {
39
38
  const recipe = useSlotRecipe({ recipe: tableSlotRecipe });
40
39
  const styles = recipe({ variant, size });
41
40
  return (
42
- <Box overflowX="auto" role="region" {...getStyleProps(props)} {...props}>
43
- <ChakraTable.Root
44
- variant={variant}
45
- size={size}
46
- colorPalette={colorPalette}
47
- css={styles}
48
- ref={ref}
49
- >
50
- {children}
51
- </ChakraTable.Root>
52
- </Box>
41
+ <ChakraTable.Root
42
+ variant={variant}
43
+ size={size}
44
+ colorPalette={colorPalette}
45
+ css={styles}
46
+ ref={ref}
47
+ {...props}
48
+ >
49
+ {children}
50
+ </ChakraTable.Root>
53
51
  );
54
52
  });
55
53
  Table.displayName = "Table";
56
-
57
- function getStyleProps(props: TableProps) {
58
- return props.variant === "core"
59
- ? {
60
- borderRadius: "sm",
61
- border: "sm",
62
- borderColor: "outline.disabled",
63
- }
64
- : {};
65
- }
package/src/table/index.tsx CHANGED
@@ -15,6 +15,7 @@ export {
15
15
  TableCaption,
16
16
  TableCell,
17
17
  TableColumn,
18
+ TableColumnGroup,
18
19
  TableColumnHeader,
19
20
  TableFooter,
20
21
  TableHeader,
package/src/theme/slot-recipes/table.ts CHANGED
@@ -22,15 +22,12 @@ export const tableSlotRecipe = defineSlotRecipe({
22
22
  columnHeader: {
23
23
  fontWeight: "bold",
24
24
  textAlign: "start",
25
- borderBottom: "sm",
26
- borderColor: "outline.disabled",
25
+
27
26
  ...numericStyles,
28
27
  paddingX: 1.5,
29
28
  paddingY: 1,
30
29
  },
31
30
  row: {
32
- borderBottom: "sm",
33
- borderColor: "outline.disabled",
34
31
  ...numericStyles,
35
32
  },
36
33
  cell: {
@@ -85,7 +82,6 @@ export const tableSlotRecipe = defineSlotRecipe({
85
82
  backgroundColor: "none",
86
83
  },
87
84
  columnHeader: {
88
- borderLeft: "none",
89
85
  borderBottom: "sm",
90
86
  borderColor: "outline.disabled",
91
87
  backgroundColor: "none",
@@ -93,46 +89,59 @@ export const tableSlotRecipe = defineSlotRecipe({
93
89
  },
94
90
 
95
91
  cell: {
92
+ ...numericStyles,
93
+ },
94
+ row: {
96
95
  borderBottom: "sm",
97
96
  borderColor: "outline.disabled",
98
97
  ...numericStyles,
99
- _first: {
100
- borderLeft: "none",
101
- },
102
98
  },
103
99
  },
104
100
 
105
101
  core: {
102
+ root: {
103
+ boxShadow: "0 0 0 1px var(--shadow-color)",
104
+ shadowColor: "outline.disabled",
105
+ borderRadius: "sm",
106
+ },
107
+
106
108
  table: {
107
- borderRadius: "md",
108
109
  overflow: "hidden",
109
- border: "sm",
110
- borderColor: "outline.disabled",
111
110
  },
112
111
  cell: {
113
- borderLeft: "sm",
114
- borderColor: "outline.disabled",
115
112
  ...numericStyles,
116
- _first: {
117
- borderLeft: "none",
113
+
114
+ borderRight: "sm",
115
+ borderColor: "outline.disabled",
116
+
117
+ _last: {
118
+ borderRight: "none",
118
119
  },
119
120
  },
120
- header: {
121
- border: "none",
122
- },
121
+
123
122
  columnHeader: {
124
- borderBottom: "sm",
125
- borderLeft: "sm",
126
- borderLeftColor: "outline.disabled",
127
123
  ...numericStyles,
124
+
125
+ borderRight: "sm",
126
+ borderColor: "outline.disabled",
127
+
128
128
  _first: {
129
- borderLeft: "none",
129
+ borderTopLeftRadius: "sm",
130
+ },
131
+ _last: {
132
+ borderTopRightRadius: "sm",
133
+ borderRight: "none",
130
134
  },
131
135
  },
136
+ header: {
137
+ borderBottom: "sm",
138
+ borderColor: "outline.disabled",
139
+ },
132
140
  row: {
133
141
  ...numericStyles,
134
142
  borderBottom: "sm",
135
143
  borderColor: "outline.disabled",
144
+
136
145
  _last: {
137
146
  borderBottom: "none",
138
147
  },