@vygruppen/spor-react 13.1.2 → 13.1.4

package/dist/index.d.cts

@@ -2,13 +2,13 @@ import * as React$1 from 'react';
 import React__default, { PropsWithChildren, ReactNode, ComponentProps, Ref } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _chakra_ui_react from '@chakra-ui/react';
-import { AccordionRootProps, RecipeVariantProps, Accordion as Accordion$1, Alert as Alert$1, ConditionalValue, BreadcrumbRootProps, ButtonProps as ButtonProps$1, GroupProps, Clipboard as Clipboard$1, IconButtonProps as IconButtonProps$1, BoxProps, SystemStyleObject, RadioCard as RadioCard$1, SeparatorProps, Field as Field$1, PopoverRootProps, Dialog, Drawer as Drawer$1, Box, ComboboxRootProps, ComboboxItemProps, Combobox as Combobox$1, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, CheckboxCardRootProps, Fieldset as Fieldset$1, Input as Input$1, TagRootProps, ListRootProps, MenuRootProps, MenuCheckboxItemProps, MenuContentProps, MenuItemProps as MenuItemProps$1, MenuItemGroupProps as MenuItemGroupProps$1, MenuRadioItemProps, MenuRadioItemGroupProps, MenuSeparatorProps, MenuTriggerItemProps as MenuTriggerItemProps$1, NativeSelectFieldProps, RadioGroup as RadioGroup$1, SelectRootProps, Select as Select$1, SelectLabelProps, CollectionItem, Switch as Switch$1, TextareaProps as TextareaProps$1, 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, TableBodyProps as TableBodyProps$1, TableColumnHeaderProps as TableColumnHeaderProps$1, Tooltip as Tooltip$1, BadgeProps as BadgeProps$1, CodeProps, HeadingProps as HeadingProps$1, TextProps as TextProps$1 } from '@chakra-ui/react';
+import { AccordionRootProps, RecipeVariantProps, Accordion as Accordion$1, Alert as Alert$1, ConditionalValue, BreadcrumbRootProps, ButtonProps as ButtonProps$1, GroupProps, Clipboard as Clipboard$1, IconButtonProps as IconButtonProps$1, BoxProps, SystemStyleObject, RadioCard as RadioCard$1, SeparatorProps, Field as Field$1, PopoverRootProps, Dialog, Drawer as Drawer$1, Box, ComboboxRootProps, Combobox as Combobox$1, ComboboxItemProps, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, CheckboxCardRootProps, Fieldset as Fieldset$1, Input as Input$1, TagRootProps, ListRootProps, MenuRootProps, MenuContentProps, MenuItemProps as MenuItemProps$1, MenuTriggerItemProps as MenuTriggerItemProps$1, MenuRadioItemGroupProps, MenuRadioItemProps, MenuItemGroupProps as MenuItemGroupProps$1, MenuCheckboxItemProps, MenuSeparatorProps, NativeSelectFieldProps, RadioGroup as RadioGroup$1, SelectRootProps, SelectLabelProps, Select as Select$1, CollectionItem, Switch as Switch$1, TextareaProps as TextareaProps$1, 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, TableColumnHeaderProps as TableColumnHeaderProps$1, TableBodyProps as TableBodyProps$1, Tooltip as Tooltip$1, BadgeProps as BadgeProps$1, CodeProps, HeadingProps as HeadingProps$1, TextProps as TextProps$1 } from '@chakra-ui/react';
 export { AspectRatio, Box, BoxProps, BreadcrumbCurrentLink, BreadcrumbEllipsis, BreadcrumbLink, Center, CenterProps, ClientOnly, Collapsible, CollapsibleRootProps, Container, ContainerProps, Em, Flex, FlexProps, For, FormatByte, FormatNumber, Grid, GridItem, GridItemProps, GridProps, HStack, Icon, Image, ImageProps, Kbd, LocaleProvider, Portal, PortalProps, Show, SimpleGrid, SimpleGridProps, Spacer, SpacerProps, Span, Stack, SystemConfig, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColumn, TableColumnGroup, TableColumnProps, TableFooter, TableFooterProps, TableHeader, TableHeaderProps, TableRoot, TableRootProps, TableRow, TableRowProps, UseDisclosureProps, VStack, VisuallyHidden, Wrap, createIcon, createListCollection, createSystem, defineConfig, defineRecipe, defineSlotRecipe, defineStyle, mergeConfigs, chakra as spor, useBreakpointValue, useCheckbox, useClipboard, useControllableProp, useDisclosure, useMediaQuery, useRecipe, useSlotRecipe, useToken } from '@chakra-ui/react';
 import { IconComponent } from '@vygruppen/spor-icon-react';
 import { CalendarDate, DateDuration, DateValue as DateValue$1 } from '@internationalized/date';
 export { Time } from '@internationalized/date';
 import { DOMAttributes, FocusableElement } from '@react-types/shared';
-import { AriaCalendarProps, DateValue, AriaRangeCalendarProps, AriaButtonProps, AriaDatePickerProps, AriaDateRangePickerProps, RangeCalendarProps as RangeCalendarProps$1, AriaComboBoxProps, AriaListBoxProps } from 'react-aria';
+import { AriaButtonProps, AriaCalendarProps, DateValue, AriaRangeCalendarProps, AriaDatePickerProps, AriaDateRangePickerProps, RangeCalendarProps as RangeCalendarProps$1, AriaComboBoxProps, AriaListBoxProps } from 'react-aria';
 import { CalendarState as CalendarState$1, RangeCalendarState as RangeCalendarState$1, ListState, SelectState } from 'react-stately';
 export { Item, Section } from 'react-stately';
 import { ThemeProviderProps } from 'next-themes';
@@ -4031,8 +4031,10 @@ declare const Tooltip: React$1.FC<Tooltip$1.RootProps>;
 declare const TooltipTrigger: ({ ref, children, ...props }: Tooltip$1.TriggerProps & {
     ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
-type TooltipProps = Tooltip$1.ContentProps;
-declare const TooltipContent: ({ ref, children, ...props }: TooltipProps & {
+type TooltipProps = Tooltip$1.ContentProps & {
+    showArrow?: boolean;
+};
+declare const TooltipContent: ({ ref, children, showArrow, ...props }: TooltipProps & {
     ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 

package/dist/index.d.ts

@@ -2,13 +2,13 @@ import * as React$1 from 'react';
 import React__default, { PropsWithChildren, ReactNode, ComponentProps, Ref } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _chakra_ui_react from '@chakra-ui/react';
-import { AccordionRootProps, RecipeVariantProps, Accordion as Accordion$1, Alert as Alert$1, ConditionalValue, BreadcrumbRootProps, ButtonProps as ButtonProps$1, GroupProps, Clipboard as Clipboard$1, IconButtonProps as IconButtonProps$1, BoxProps, SystemStyleObject, RadioCard as RadioCard$1, SeparatorProps, Field as Field$1, PopoverRootProps, Dialog, Drawer as Drawer$1, Box, ComboboxRootProps, ComboboxItemProps, Combobox as Combobox$1, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, CheckboxCardRootProps, Fieldset as Fieldset$1, Input as Input$1, TagRootProps, ListRootProps, MenuRootProps, MenuCheckboxItemProps, MenuContentProps, MenuItemProps as MenuItemProps$1, MenuItemGroupProps as MenuItemGroupProps$1, MenuRadioItemProps, MenuRadioItemGroupProps, MenuSeparatorProps, MenuTriggerItemProps as MenuTriggerItemProps$1, NativeSelectFieldProps, RadioGroup as RadioGroup$1, SelectRootProps, Select as Select$1, SelectLabelProps, CollectionItem, Switch as Switch$1, TextareaProps as TextareaProps$1, 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, TableBodyProps as TableBodyProps$1, TableColumnHeaderProps as TableColumnHeaderProps$1, Tooltip as Tooltip$1, BadgeProps as BadgeProps$1, CodeProps, HeadingProps as HeadingProps$1, TextProps as TextProps$1 } from '@chakra-ui/react';
+import { AccordionRootProps, RecipeVariantProps, Accordion as Accordion$1, Alert as Alert$1, ConditionalValue, BreadcrumbRootProps, ButtonProps as ButtonProps$1, GroupProps, Clipboard as Clipboard$1, IconButtonProps as IconButtonProps$1, BoxProps, SystemStyleObject, RadioCard as RadioCard$1, SeparatorProps, Field as Field$1, PopoverRootProps, Dialog, Drawer as Drawer$1, Box, ComboboxRootProps, Combobox as Combobox$1, ComboboxItemProps, Checkbox as Checkbox$1, CheckboxGroup as CheckboxGroup$1, CheckboxCardRootProps, Fieldset as Fieldset$1, Input as Input$1, TagRootProps, ListRootProps, MenuRootProps, MenuContentProps, MenuItemProps as MenuItemProps$1, MenuTriggerItemProps as MenuTriggerItemProps$1, MenuRadioItemGroupProps, MenuRadioItemProps, MenuItemGroupProps as MenuItemGroupProps$1, MenuCheckboxItemProps, MenuSeparatorProps, NativeSelectFieldProps, RadioGroup as RadioGroup$1, SelectRootProps, SelectLabelProps, Select as Select$1, CollectionItem, Switch as Switch$1, TextareaProps as TextareaProps$1, 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, TableColumnHeaderProps as TableColumnHeaderProps$1, TableBodyProps as TableBodyProps$1, Tooltip as Tooltip$1, BadgeProps as BadgeProps$1, CodeProps, HeadingProps as HeadingProps$1, TextProps as TextProps$1 } from '@chakra-ui/react';
 export { AspectRatio, Box, BoxProps, BreadcrumbCurrentLink, BreadcrumbEllipsis, BreadcrumbLink, Center, CenterProps, ClientOnly, Collapsible, CollapsibleRootProps, Container, ContainerProps, Em, Flex, FlexProps, For, FormatByte, FormatNumber, Grid, GridItem, GridItemProps, GridProps, HStack, Icon, Image, ImageProps, Kbd, LocaleProvider, Portal, PortalProps, Show, SimpleGrid, SimpleGridProps, Spacer, SpacerProps, Span, Stack, SystemConfig, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableColumn, TableColumnGroup, TableColumnProps, TableFooter, TableFooterProps, TableHeader, TableHeaderProps, TableRoot, TableRootProps, TableRow, TableRowProps, UseDisclosureProps, VStack, VisuallyHidden, Wrap, createIcon, createListCollection, createSystem, defineConfig, defineRecipe, defineSlotRecipe, defineStyle, mergeConfigs, chakra as spor, useBreakpointValue, useCheckbox, useClipboard, useControllableProp, useDisclosure, useMediaQuery, useRecipe, useSlotRecipe, useToken } from '@chakra-ui/react';
 import { IconComponent } from '@vygruppen/spor-icon-react';
 import { CalendarDate, DateDuration, DateValue as DateValue$1 } from '@internationalized/date';
 export { Time } from '@internationalized/date';
 import { DOMAttributes, FocusableElement } from '@react-types/shared';
-import { AriaCalendarProps, DateValue, AriaRangeCalendarProps, AriaButtonProps, AriaDatePickerProps, AriaDateRangePickerProps, RangeCalendarProps as RangeCalendarProps$1, AriaComboBoxProps, AriaListBoxProps } from 'react-aria';
+import { AriaButtonProps, AriaCalendarProps, DateValue, AriaRangeCalendarProps, AriaDatePickerProps, AriaDateRangePickerProps, RangeCalendarProps as RangeCalendarProps$1, AriaComboBoxProps, AriaListBoxProps } from 'react-aria';
 import { CalendarState as CalendarState$1, RangeCalendarState as RangeCalendarState$1, ListState, SelectState } from 'react-stately';
 export { Item, Section } from 'react-stately';
 import { ThemeProviderProps } from 'next-themes';
@@ -4031,8 +4031,10 @@ declare const Tooltip: React$1.FC<Tooltip$1.RootProps>;
 declare const TooltipTrigger: ({ ref, children, ...props }: Tooltip$1.TriggerProps & {
     ref?: React.Ref<HTMLButtonElement>;
 }) => react_jsx_runtime.JSX.Element;
-type TooltipProps = Tooltip$1.ContentProps;
-declare const TooltipContent: ({ ref, children, ...props }: TooltipProps & {
+type TooltipProps = Tooltip$1.ContentProps & {
+    showArrow?: boolean;
+};
+declare const TooltipContent: ({ ref, children, showArrow, ...props }: TooltipProps & {
     ref?: React.Ref<HTMLDivElement>;
 }) => react_jsx_runtime.JSX.Element;
 

package/dist/index.mjs

@@ -4,7 +4,7 @@ import * as spor_icon_react_star from '@vygruppen/spor-icon-react';
 import { DropdownDownFill24Icon, CloseFill18Icon, CloseFill30Icon, CloseFill24Icon, DropdownDownFill18Icon, ServiceFill24Icon, WarningFill24Icon, DropdownRightFill18Icon, CalendarOutline24Icon, DropdownLeftFill18Icon, ArrowLeftFill24Icon, ChangeDirectionOutline24Icon, CheckmarkFill18Icon, CloseOutline24Icon, SearchOutline24Icon, Forward15MediaControllerFill30Icon, Backward15MediaControllerFill30Icon, PauseMediaControllerFill24Icon, PlayMediaControllerFill24Icon, NextMediaControllerFill30Icon, PreviousMediaControllerFill30Icon, ArrowRightFill18Icon, DropdownLeftOutline18Icon, DropdownRightOutline18Icon, ArrowUpFill18Icon, ArrowDownFill18Icon, ChangeDirectionFill18Icon, CopyOutline18Icon, WalkFill30Icon, WalkFill24Icon, WalkFill18Icon, AltTransportFill30Icon, AltTransportFill24Icon, AltTransportFill18Icon, TramFill30Icon, TramFill24Icon, TramFill18Icon, SubwayFill30Icon, SubwayFill24Icon, SubwayFill18Icon, FerryFill30Icon, FerryFill24Icon, FerryFill18Icon, BusFill30Icon, BusFill24Icon, BusFill18Icon, ExpressBusFill30Icon, ExpressBusFill24Icon, ExpressBusFill18Icon, TrainFill30Icon, TrainFill24Icon, TrainFill18Icon, InformationFill24Icon, InformationFill18Icon, WarningFill18Icon, ErrorFill24Icon, ErrorFill18Icon, LinkOutOutline24Icon, LinkOutOutline18Icon, QuestionFill24Icon, ErrorOutline24Icon, SuccessFill24Icon, ArrowLeftOutline24Icon, ArrowRightOutline24Icon } from '@vygruppen/spor-icon-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React13 from 'react';
-import React13__default, { createContext, useContext, useId, isValidElement, cloneElement, useRef, useEffect, useImperativeHandle, useState, useLayoutEffect, useMemo } from 'react';
+import React13__default, { createContext, useContext, useId, cloneElement, isValidElement, useRef, useEffect, useImperativeHandle, useState, useLayoutEffect, useMemo } from 'react';
 import { spinnerColorData, inlineLoaderColorData, contentLoaderData, fullScreenLoaderWhiteData, inlineLoaderDarkData, spinnerLightData, spinnerDarkData, fullScreenLoaderBlackData, inlineLoaderLightData } from '@vygruppen/spor-loader';
 import { useLottie } from 'lottie-react';
 import { useInterval } from 'usehooks-ts';
@@ -4581,7 +4581,7 @@ var PasswordInput = ({
     Input,
     {
       ref,
-      startElement: startElement && startElement,
+      startElement,
       label,
       type: visible ? "text" : "password",
       endElement: /* @__PURE__ */ jsx(
@@ -5633,7 +5633,18 @@ var VyLogo = ({
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M98.49.07h-1.82c-2.98 0-4.6 1.49-5.63 5.06l-6.52 21.79a18.22 18.22 0 0 1-1.67 3.96c.57.78 1.17 1.26 1.76 1.38 1.13-.96 2.06-2.75 2.89-5.46l6.49-21.67c.9-3.1 2.23-4.63 4.5-4.98a.04.04 0 0 0 0-.08Z",
-        fill: fillForAccent
+        fill: fillForAccent,
+        display: { _light: "block", _dark: "none" }
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Path,
+      {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M98.49.07h-1.82c-2.98 0-4.6 1.49-5.63 5.06l-6.52 21.79a18.22 18.22 0 0 1-1.67 3.96c.57.78 1.17 1.26 1.76 1.38 1.13-.96 2.06-2.75 2.89-5.46l6.49-21.67c.9-3.1 2.23-4.63 4.5-4.98a.04.04 0 0 0 0-.08Z",
+        fill: "main",
+        display: { _light: "none", _dark: "block" }
       }
     ),
     /* @__PURE__ */ jsx(
@@ -5685,7 +5696,16 @@ var VyLogo = ({
         Path,
         {
           d: "M53.78 1.44a4.64 4.64 0 0 0-4.17.93A10.79 10.79 0 0 0 46.19 8L34.53 47.72c-.58 1.93-1.2 3.75-2.56 4.87-.62.5-1.4.86-2.39 1.01a.04.04 0 0 0 0 .08h1.8c1.57 0 2.69-.41 3.53-1.1 1.36-1.1 1.98-2.93 2.56-4.86L49.05 8.3c.73-2.74 1.95-4.63 3.43-5.9.43-.36.88-.68 1.35-.95l-.05-.01Z",
-          fill: fillForAccent
+          fill: fillForAccent,
+          display: { _light: "block", _dark: "none" }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Path,
+        {
+          d: "M53.78 1.44a4.64 4.64 0 0 0-4.17.93A10.79 10.79 0 0 0 46.19 8L34.53 47.72c-.58 1.93-1.2 3.75-2.56 4.87-.62.5-1.4.86-2.39 1.01a.04.04 0 0 0 0 .08h1.8c1.57 0 2.69-.41 3.53-1.1 1.36-1.1 1.98-2.93 2.56-4.86L49.05 8.3c.73-2.74 1.95-4.63 3.43-5.9.43-.36.88-.68 1.35-.95l-.05-.01Z",
+          fill: "main",
+          display: { _light: "none", _dark: "block" }
         }
       )
     ] }),
@@ -6356,7 +6376,16 @@ var PopoverTrigger = ({
   ...props
 }) => {
   const isStringChild = typeof children === "string";
-  return /* @__PURE__ */ jsx(Popover$1.Trigger, { ...props, ref, asChild: !isStringChild, children });
+  return /* @__PURE__ */ jsx(
+    Popover$1.Trigger,
+    {
+      ref,
+      asChild: !isStringChild,
+      width: isStringChild ? void 0 : "fit-content",
+      ...props,
+      children: isStringChild ? children : /* @__PURE__ */ jsx(Box, { children })
+    }
+  );
 };
 var PopoverContent = ({
   ref,
@@ -6374,14 +6403,14 @@ var PopoverContent = ({
   }, [showCloseButton, open]);
   return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Popover$1.Positioner, { children: /* @__PURE__ */ jsxs(Popover$1.Content, { ref, ...props, children: [
     /* @__PURE__ */ jsx(Popover$1.Arrow, {}),
+    /* @__PURE__ */ jsx(Popover$1.Body, { ...props, children }),
     showCloseButton && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Popover$1.CloseTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
       CloseButton,
       {
         className: colorMode === "dark" ? "light" : "dark",
         ref: closeButtonRef
       }
-    ) }) }),
-    /* @__PURE__ */ jsx(Popover$1.Body, { ...props, children })
+    ) }) })
   ] }) }) });
 };
 var ProgressDot = ({ isActive }) => {
@@ -10341,6 +10370,7 @@ var menuSlotRecipe = defineSlotRecipe({
       display: "flex",
       justifyContent: "space-between",
       gap: 1.5,
+      cursor: "pointer",
       _hover: {
         backgroundColor: "surface.accent.hover"
       },
@@ -10368,19 +10398,22 @@ var menuSlotRecipe = defineSlotRecipe({
     radioItem: {
       display: "flex",
       justifyContent: "space-between",
-      gap: 2
+      gap: 2,
+      cursor: "pointer"
     },
     triggerItem: {
       display: "flex",
       justifyContent: "space-between",
       gap: 1.5,
-      alignItems: "center"
+      alignItems: "center",
+      cursor: "pointer"
     },
     checkboxItem: {
       display: "flex",
       gap: 2,
       alignItems: "center",
-      width: "full"
+      width: "full",
+      cursor: "pointer"
     }
   },
   variants: {
@@ -10578,7 +10611,7 @@ var popoverSlotRecipe = defineSlotRecipe({
     content: {
       position: "relative",
       display: "flex",
-      flexDirection: "row-reverse",
+      flexDirection: "row",
       color: "text.brand",
       gap: "0.625rem",
       padding: "0.563rem 0.75rem",
@@ -11363,8 +11396,7 @@ var tableSlotRecipe = defineSlotRecipe({
     cell: {
       ...numericStyles,
       paddingX: 1.5,
-      paddingY: 1,
-      width: "100%"
+      paddingY: 1
     },
     footer: {
       fontWeight: "medium"
@@ -12609,16 +12641,17 @@ var TooltipTrigger = ({
   ...props
 }) => {
   const isStringChild = typeof children === "string";
-  return /* @__PURE__ */ jsx(Tooltip$1.Trigger, { ...props, ref, asChild: !isStringChild, children });
+  return /* @__PURE__ */ jsx(Tooltip$1.Trigger, { ref, asChild: !isStringChild, ...props, children: isStringChild ? children : /* @__PURE__ */ jsx(Box, { width: "fit-content", children }) });
 };
 var TooltipContent = ({
   ref,
   children,
+  showArrow = false,
   ...props
 }) => {
   return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { children: /* @__PURE__ */ jsxs(Tooltip$1.Content, { ref, ...props, children: [
-    /* @__PURE__ */ jsx(Tooltip$1.Arrow, {}),
-    /* @__PURE__ */ jsx(Tooltip$1.Content, { ...props, children })
+    showArrow && /* @__PURE__ */ jsx(Tooltip$1.Arrow, { children: /* @__PURE__ */ jsx(Tooltip$1.ArrowTip, {}) }),
+    children
   ] }) }) });
 };