@vygruppen/spor-react 3.4.1 → 3.4.2

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@3.4.1 build
+> @vygruppen/spor-react@3.4.2 build
 > tsup src/index.tsx --dts --treeshake --format cjs,esm
 
 CLI Building entry: src/index.tsx
@@ -9,13 +9,13 @@
 CJS Build start
 ESM Build start
 DTS Build start
+"toZoned" and "toTime" are imported from external module "@internationalized/date" but never used in "dist/chunk-DOHLC4LS.mjs".
 "toZoned" and "toTime" are imported from external module "@internationalized/date" but never used in "dist/index.js".
-"toZoned" and "toTime" are imported from external module "@internationalized/date" but never used in "dist/chunk-GIXEJPV7.mjs".
-CJS dist/index.js 903.40 KB
-CJS ⚡️ Build success in 4807ms
 ESM dist/index.mjs                      2.01 KB
-ESM dist/CountryCodeSelect-I6MGYQTH.mjs 350.82 KB
-ESM dist/chunk-GIXEJPV7.mjs             420.57 KB
-ESM ⚡️ Build success in 4808ms
-DTS ⚡️ Build success in 18338ms
+ESM dist/CountryCodeSelect-FTCKNVSB.mjs 350.82 KB
+ESM dist/chunk-DOHLC4LS.mjs             420.85 KB
+ESM ⚡️ Build success in 5055ms
+CJS dist/index.js 903.69 KB
+CJS ⚡️ Build success in 5056ms
+DTS ⚡️ Build success in 18301ms
 DTS dist/index.d.ts 252.53 KB

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @vygruppen/spor-react
 
+## 3.4.2
+
+### Patch Changes
+
+- f5fb6ae6: Card: Improve the way card outlines are generated
+- 5b33fdc5: Card: Correct the colors of white cards
+
 ## 3.4.1
 
 ### Patch Changes

package/dist/{CountryCodeSelect-I6MGYQTH.mjs → CountryCodeSelect-FTCKNVSB.mjs}

@@ -1,4 +1,4 @@
-import { createTexts, useTranslation, InfoSelect, Item } from './chunk-GIXEJPV7.mjs';
+import { createTexts, useTranslation, InfoSelect, Item } from './chunk-DOHLC4LS.mjs';
 import React from 'react';
 
 // ../../node_modules/awesome-phonenumber/index-esm.mjs

package/dist/{chunk-GIXEJPV7.mjs → chunk-DOHLC4LS.mjs}

@@ -5084,7 +5084,7 @@ var texts14 = createTexts({
     sv: "Telefonnummer"
   }
 });
-var LazyCountryCodeSelect = React49__default.lazy(() => import('./CountryCodeSelect-I6MGYQTH.mjs'));
+var LazyCountryCodeSelect = React49__default.lazy(() => import('./CountryCodeSelect-FTCKNVSB.mjs'));
 var Radio = forwardRef((props, ref) => {
   return /* @__PURE__ */ React49__default.createElement(Radio$1, { ...props, ref });
 });
@@ -11468,7 +11468,8 @@ var config7 = defineStyleConfig$1({
         focus: {
           boxShadow: getBoxShadowString({
             borderColor: "greenHaze",
-            borderWidth: 2
+            borderWidth: 2,
+            isInset: false
           }),
           outline: "none",
           _active: getColorSchemeActiveProps(props)
@@ -11481,7 +11482,8 @@ var config7 = defineStyleConfig$1({
       _disabled: {
         backgroundColor: "platinum",
         boxShadow: getBoxShadowString({
-          borderColor: "silver"
+          borderColor: "silver",
+          isInset: false
         }),
         color: "osloGrey",
         pointerEvents: "none"
@@ -11495,7 +11497,7 @@ function getColorSchemeBaseProps({ colorScheme }) {
   switch (colorScheme) {
     case "white":
       return {
-        backgroundColor: "lightGrey"
+        backgroundColor: "white"
       };
     case "grey":
       return {
@@ -11520,14 +11522,16 @@ function getColorSchemeClickableProps({ colorScheme, size: size2 }) {
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: "silver"
+          borderColor: "silver",
+          isInset: false
         })
       };
     case "grey":
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: "steel"
+          borderColor: "steel",
+          isInset: false
         })
       };
     default:
@@ -11535,7 +11539,8 @@ function getColorSchemeClickableProps({ colorScheme, size: size2 }) {
         backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[200]) ?? "silver"
+          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[200]) ?? "silver",
+          isInset: false
         })
       };
   }
@@ -11548,14 +11553,16 @@ function getColorSchemeHoverProps({ colorScheme, size: size2 }) {
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.steel
+          borderColor: colors.steel,
+          isInset: false
         })
       };
     case "grey":
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.osloGrey
+          borderColor: colors.osloGrey,
+          isInset: false
         })
       };
     default:
@@ -11563,7 +11570,8 @@ function getColorSchemeHoverProps({ colorScheme, size: size2 }) {
         backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[200]) ?? "silver",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[400]) ?? colors.silver
+          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[400]) ?? colors.silver,
+          isInset: false
         })
       };
   }
@@ -11577,7 +11585,8 @@ function getColorSchemeActiveProps({ colorScheme, size: size2 }) {
         backgroundColor: "mint",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.silver
+          borderColor: colors.silver,
+          isInset: false
         })
       };
     case "grey":
@@ -11585,7 +11594,8 @@ function getColorSchemeActiveProps({ colorScheme, size: size2 }) {
         backgroundColor: "white",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.steel
+          borderColor: colors.steel,
+          isInset: false
         })
       };
     default:
@@ -11593,7 +11603,8 @@ function getColorSchemeActiveProps({ colorScheme, size: size2 }) {
         backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[50]) ?? "lightGrey",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[100]) ?? colors.silver
+          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[100]) ?? colors.silver,
+          isInset: false
         })
       };
   }

package/dist/index.js

@@ -19472,7 +19472,7 @@ function getColorSchemeBaseProps({ colorScheme }) {
   switch (colorScheme) {
     case "white":
       return {
-        backgroundColor: "lightGrey"
+        backgroundColor: "white"
       };
     case "grey":
       return {
@@ -19497,14 +19497,16 @@ function getColorSchemeClickableProps({ colorScheme, size: size2 }) {
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: "silver"
+          borderColor: "silver",
+          isInset: false
         })
       };
     case "grey":
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: "steel"
+          borderColor: "steel",
+          isInset: false
         })
       };
     default:
@@ -19512,7 +19514,8 @@ function getColorSchemeClickableProps({ colorScheme, size: size2 }) {
         backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[200]) ?? "silver"
+          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[200]) ?? "silver",
+          isInset: false
         })
       };
   }
@@ -19525,14 +19528,16 @@ function getColorSchemeHoverProps({ colorScheme, size: size2 }) {
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.steel
+          borderColor: colors.steel,
+          isInset: false
         })
       };
     case "grey":
       return {
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.osloGrey
+          borderColor: colors.osloGrey,
+          isInset: false
         })
       };
     default:
@@ -19540,7 +19545,8 @@ function getColorSchemeHoverProps({ colorScheme, size: size2 }) {
         backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[200]) ?? "silver",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[400]) ?? colors.silver
+          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[400]) ?? colors.silver,
+          isInset: false
         })
       };
   }
@@ -19554,7 +19560,8 @@ function getColorSchemeActiveProps({ colorScheme, size: size2 }) {
         backgroundColor: "mint",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.silver
+          borderColor: colors.silver,
+          isInset: false
         })
       };
     case "grey":
@@ -19562,7 +19569,8 @@ function getColorSchemeActiveProps({ colorScheme, size: size2 }) {
         backgroundColor: "white",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: colors.steel
+          borderColor: colors.steel,
+          isInset: false
         })
       };
     default:
@@ -19570,7 +19578,8 @@ function getColorSchemeActiveProps({ colorScheme, size: size2 }) {
         backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[50]) ?? "lightGrey",
         boxShadow: getBoxShadowString({
           baseShadow,
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[100]) ?? colors.silver
+          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[100]) ?? colors.silver,
+          isInset: false
         })
       };
   }
@@ -19600,7 +19609,8 @@ var init_card2 = __esm({
             focus: {
               boxShadow: getBoxShadowString({
                 borderColor: "greenHaze",
-                borderWidth: 2
+                borderWidth: 2,
+                isInset: false
               }),
               outline: "none",
               _active: getColorSchemeActiveProps(props)
@@ -19613,7 +19623,8 @@ var init_card2 = __esm({
           _disabled: {
             backgroundColor: "platinum",
             boxShadow: getBoxShadowString({
-              borderColor: "silver"
+              borderColor: "silver",
+              isInset: false
             }),
             color: "osloGrey",
             pointerEvents: "none"

package/dist/index.mjs

@@ -1 +1 @@
-export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Button, ButtonGroup, Card, CardSelect, Center, Checkbox, CheckboxGroup, ChoiceChip, ClosableAlert, CloseButton, Code, Collapse, ColorInlineLoader, ColorSpinner, Combobox, Container, ContentLoader, DarkFullScreenLoader, DarkInlineLoader, DarkMode, DarkSpinner, DatePicker, DateRangePicker, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, ModalHeader as DrawerHeader, DrawerOverlay, Expandable, ExpandableAlert, ExpandableItem, Fade, Flex, FloatingActionButton, FormControl, FormErrorMessage, FormHelperText, FormLabel, Grid, GridItem, HStack, Heading, IconButton, Image, Img, InfoSelect, InfoTag, Input, InputGroup, InputLeftElement, InputRightElement, Item, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightMode, LightSpinner, LineIcon, ListBox, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, NumericStepper, PasswordInput, PhoneNumberInput, PlayPauseButton, Popover, PopoverAnchor, PopoverArrow, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, PopoverTrigger, PopoverWizardBody, ProgressBar, ProgressLoader, Radio, RadioGroup, ScaleFade, SearchInput, Section, SimpleDrawer, SimpleGrid, SimplePopover, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tr, TravelTag, VStack, VyLogo, WizardPopover, Wrap, WrapItem, createTexts, extendTheme, fontFaces, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useTheme, useToast, useToken, useTranslation } from './chunk-GIXEJPV7.mjs';
+export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Button, ButtonGroup, Card, CardSelect, Center, Checkbox, CheckboxGroup, ChoiceChip, ClosableAlert, CloseButton, Code, Collapse, ColorInlineLoader, ColorSpinner, Combobox, Container, ContentLoader, DarkFullScreenLoader, DarkInlineLoader, DarkMode, DarkSpinner, DatePicker, DateRangePicker, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, ModalHeader as DrawerHeader, DrawerOverlay, Expandable, ExpandableAlert, ExpandableItem, Fade, Flex, FloatingActionButton, FormControl, FormErrorMessage, FormHelperText, FormLabel, Grid, GridItem, HStack, Heading, IconButton, Image, Img, InfoSelect, InfoTag, Input, InputGroup, InputLeftElement, InputRightElement, Item, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightMode, LightSpinner, LineIcon, ListBox, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, NumericStepper, PasswordInput, PhoneNumberInput, PlayPauseButton, Popover, PopoverAnchor, PopoverArrow, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, PopoverTrigger, PopoverWizardBody, ProgressBar, ProgressLoader, Radio, RadioGroup, ScaleFade, SearchInput, Section, SimpleDrawer, SimpleGrid, SimplePopover, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tr, TravelTag, VStack, VyLogo, WizardPopover, Wrap, WrapItem, createTexts, extendTheme, fontFaces, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useTheme, useToast, useToken, useTranslation } from './chunk-DOHLC4LS.mjs';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vygruppen/spor-react",
-  "version": "3.4.1",
+  "version": "3.4.2",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",

package/src/theme/components/card.ts

@@ -24,6 +24,7 @@ const config = defineStyleConfig({
           boxShadow: getBoxShadowString({
             borderColor: "greenHaze",
             borderWidth: 2,
+            isInset: false,
           }),
           outline: "none",
           _active: getColorSchemeActiveProps(props),
@@ -37,6 +38,7 @@ const config = defineStyleConfig({
         backgroundColor: "platinum",
         boxShadow: getBoxShadowString({
           borderColor: "silver",
+          isInset: false,
         }),
         color: "osloGrey",
         pointerEvents: "none",
@@ -65,7 +67,7 @@ function getColorSchemeBaseProps({ colorScheme }: CardThemeProps): {
   switch (colorScheme) {
     case "white":
       return {
-        backgroundColor: "lightGrey",
+        backgroundColor: "white",
       };
     case "grey":
       return {
@@ -91,6 +93,7 @@ function getColorSchemeClickableProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: "silver",
+          isInset: false,
         }),
       };
     case "grey":
@@ -98,6 +101,7 @@ function getColorSchemeClickableProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: "steel",
+          isInset: false,
         }),
       };
     default:
@@ -106,6 +110,7 @@ function getColorSchemeClickableProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors[colorScheme]?.[200] ?? "silver",
+          isInset: false,
         }),
       };
   }
@@ -119,6 +124,7 @@ function getColorSchemeHoverProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors.steel,
+          isInset: false,
         }),
       };
     case "grey":
@@ -126,6 +132,7 @@ function getColorSchemeHoverProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors.osloGrey,
+          isInset: false,
         }),
       };
     default:
@@ -134,6 +141,7 @@ function getColorSchemeHoverProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors[colorScheme]?.[400] ?? colors.silver,
+          isInset: false,
         }),
       };
   }
@@ -148,6 +156,7 @@ function getColorSchemeActiveProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors.silver,
+          isInset: false,
         }),
       };
     case "grey":
@@ -156,6 +165,7 @@ function getColorSchemeActiveProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors.steel,
+          isInset: false,
         }),
       };
     default:
@@ -164,6 +174,7 @@ function getColorSchemeActiveProps({ colorScheme, size }: CardThemeProps) {
         boxShadow: getBoxShadowString({
           baseShadow,
           borderColor: colors[colorScheme]?.[100] ?? colors.silver,
+          isInset: false,
         }),
       };
   }