@vygruppen/spor-react 13.1.3 → 13.1.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.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@vygruppen/spor-react",
3
3
  "type": "module",
4
- "version": "13.1.3",
4
+ "version": "13.1.4",
5
5
  "exports": {
6
6
  ".": {
7
7
  "types": "./dist/index.d.ts",
@@ -69,7 +69,7 @@ export const PasswordInput = ({
69
69
  return (
70
70
  <Input
71
71
  ref={ref}
72
- startElement={startElement && startElement}
72
+ startElement={startElement}
73
73
  label={label}
74
74
  type={visible ? "text" : "password"}
75
75
  endElement={
@@ -1,6 +1,7 @@
1
1
  "use client";
2
2
 
3
3
  import {
4
+ Box,
4
5
  Popover as ChakraPopover,
5
6
  Portal,
6
7
  usePopoverContext,
@@ -22,8 +23,13 @@ export const PopoverTrigger = ({
22
23
  const isStringChild = typeof children === "string";
23
24
 
24
25
  return (
25
- <ChakraPopover.Trigger {...props} ref={ref} asChild={!isStringChild}>
26
- {children}
26
+ <ChakraPopover.Trigger
27
+ ref={ref}
28
+ asChild={!isStringChild}
29
+ width={isStringChild ? undefined : "fit-content"}
30
+ {...props}
31
+ >
32
+ {isStringChild ? children : <Box>{children}</Box>}
27
33
  </ChakraPopover.Trigger>
28
34
  );
29
35
  };
@@ -58,6 +64,7 @@ export const PopoverContent = ({
58
64
  <ChakraPopover.Positioner>
59
65
  <ChakraPopover.Content ref={ref} {...props}>
60
66
  <ChakraPopover.Arrow />
67
+ <ChakraPopover.Body {...props}>{children}</ChakraPopover.Body>
61
68
  {showCloseButton && (
62
69
  <div>
63
70
  <ChakraPopover.CloseTrigger asChild>
@@ -68,7 +75,6 @@ export const PopoverContent = ({
68
75
  </ChakraPopover.CloseTrigger>
69
76
  </div>
70
77
  )}
71
- <ChakraPopover.Body {...props}>{children}</ChakraPopover.Body>
72
78
  </ChakraPopover.Content>
73
79
  </ChakraPopover.Positioner>
74
80
  </Portal>
@@ -36,6 +36,7 @@ export const menuSlotRecipe = defineSlotRecipe({
36
36
  display: "flex",
37
37
  justifyContent: "space-between",
38
38
  gap: 1.5,
39
+ cursor: "pointer",
39
40
 
40
41
  _hover: {
41
42
  backgroundColor: "surface.accent.hover",
@@ -68,18 +69,21 @@ export const menuSlotRecipe = defineSlotRecipe({
68
69
  display: "flex",
69
70
  justifyContent: "space-between",
70
71
  gap: 2,
72
+ cursor: "pointer",
71
73
  },
72
74
  triggerItem: {
73
75
  display: "flex",
74
76
  justifyContent: "space-between",
75
77
  gap: 1.5,
76
78
  alignItems: "center",
79
+ cursor: "pointer",
77
80
  },
78
81
  checkboxItem: {
79
82
  display: "flex",
80
83
  gap: 2,
81
84
  alignItems: "center",
82
85
  width: "full",
86
+ cursor: "pointer",
83
87
  },
84
88
  },
85
89
  variants: {
@@ -9,7 +9,7 @@ export const popoverSlotRecipe = defineSlotRecipe({
9
9
  content: {
10
10
  position: "relative",
11
11
  display: "flex",
12
- flexDirection: "row-reverse",
12
+ flexDirection: "row",
13
13
  color: "text.brand",
14
14
 
15
15
  gap: "0.625rem",
@@ -35,7 +35,6 @@ export const popoverSlotRecipe = defineSlotRecipe({
35
35
  },
36
36
  body: {
37
37
  color: "text.brand",
38
-
39
38
  alignItems: "center",
40
39
  borderRadius: "sm",
41
40
  zIndex: "inherit",
@@ -34,7 +34,6 @@ export const tableSlotRecipe = defineSlotRecipe({
34
34
  ...numericStyles,
35
35
  paddingX: 1.5,
36
36
  paddingY: 1,
37
- width: "100%",
38
37
  },
39
38
  footer: {
40
39
  fontWeight: "medium",
package/src/tooltip.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
 
3
- import { Portal, Tooltip as ChakraTooltip } from "@chakra-ui/react";
3
+ import { Box, Portal, Tooltip as ChakraTooltip } from "@chakra-ui/react";
4
4
 
5
5
  export const Tooltip = ChakraTooltip.Root;
6
6
 
@@ -14,17 +14,20 @@ export const TooltipTrigger = ({
14
14
  const isStringChild = typeof children === "string";
15
15
 
16
16
  return (
17
- <ChakraTooltip.Trigger {...props} ref={ref} asChild={!isStringChild}>
18
- {children}
17
+ <ChakraTooltip.Trigger ref={ref} asChild={!isStringChild} {...props}>
18
+ {isStringChild ? children : <Box width="fit-content">{children}</Box>}
19
19
  </ChakraTooltip.Trigger>
20
20
  );
21
21
  };
22
22
 
23
- export type TooltipProps = ChakraTooltip.ContentProps;
23
+ export type TooltipProps = ChakraTooltip.ContentProps & {
24
+ showArrow?: boolean;
25
+ };
24
26
 
25
27
  export const TooltipContent = ({
26
28
  ref,
27
29
  children,
30
+ showArrow = false,
28
31
  ...props
29
32
  }: TooltipProps & {
30
33
  ref?: React.Ref<HTMLDivElement>;
@@ -33,8 +36,12 @@ export const TooltipContent = ({
33
36
  <Portal>
34
37
  <ChakraTooltip.Positioner>
35
38
  <ChakraTooltip.Content ref={ref} {...props}>
36
- <ChakraTooltip.Arrow />
37
- <ChakraTooltip.Content {...props}>{children}</ChakraTooltip.Content>
39
+ {showArrow && (
40
+ <ChakraTooltip.Arrow>
41
+ <ChakraTooltip.ArrowTip />
42
+ </ChakraTooltip.Arrow>
43
+ )}
44
+ {children}
38
45
  </ChakraTooltip.Content>
39
46
  </ChakraTooltip.Positioner>
40
47
  </Portal>