@vygruppen/spor-react 3.3.4 → 3.4.0

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@3.3.4 build
+> @vygruppen/spor-react@3.4.0 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-QHD5YJ6K.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-A7MCH3JW.mjs".
+CJS dist/index.js 903.25 KB
+CJS ⚡️ Build success in 6022ms
 ESM dist/index.mjs                      2.01 KB
-ESM dist/CountryCodeSelect-HKZBFK6T.mjs 350.82 KB
-ESM dist/chunk-QHD5YJ6K.mjs             420.68 KB
-ESM ⚡️ Build success in 6202ms
-CJS dist/index.js 903.47 KB
-CJS ⚡️ Build success in 6203ms
-DTS ⚡️ Build success in 23010ms
-DTS dist/index.d.ts 252.39 KB
+ESM dist/CountryCodeSelect-J3XCI72L.mjs 350.82 KB
+ESM dist/chunk-A7MCH3JW.mjs             420.45 KB
+ESM ⚡️ Build success in 6024ms
+DTS ⚡️ Build success in 22767ms
+DTS dist/index.d.ts 252.35 KB

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @vygruppen/spor-react
 
+## 3.4.0
+
+### Minor Changes
+
+- 349fe0a5: Implement new breakpoint structure
+
+  This change introduces a new breakpoint between sm and md, and changes the breakpoint values slightly.
+
+  When upgrading, please make sure to check your responsive layouts.
+
+### Patch Changes
+
+- b18e847b: Card: Update design for non-interactive cards
+- Updated dependencies [349fe0a5]
+  - @vygruppen/spor-design-tokens@3.2.0
+
 ## 3.3.4
 
 ### Patch Changes

package/dist/{CountryCodeSelect-HKZBFK6T.mjs → CountryCodeSelect-J3XCI72L.mjs}

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

package/dist/{chunk-QHD5YJ6K.mjs → chunk-A7MCH3JW.mjs}

@@ -5084,7 +5084,7 @@ var texts14 = createTexts({
     sv: "Telefonnummer"
   }
 });
-var LazyCountryCodeSelect = React49__default.lazy(() => import('./CountryCodeSelect-HKZBFK6T.mjs'));
+var LazyCountryCodeSelect = React49__default.lazy(() => import('./CountryCodeSelect-J3XCI72L.mjs'));
 var Radio = forwardRef((props, ref) => {
   return /* @__PURE__ */ React49__default.createElement(Radio$1, { ...props, ref });
 });
@@ -10771,8 +10771,8 @@ var breakpoints2 = {
   sm: tokens10__default.size.breakpoint.sm,
   md: tokens10__default.size.breakpoint.md,
   lg: tokens10__default.size.breakpoint.lg,
-  xl: tokens10__default.size.breakpoint.lg,
-  "2xl": tokens10__default.size.breakpoint.lg
+  xl: tokens10__default.size.breakpoint.xl,
+  "2xl": tokens10__default.size.breakpoint.xl
 };
 
 // src/theme/foundations/config.ts
@@ -11482,28 +11482,24 @@ var config7 = defineStyleConfig$1({
 });
 var card_default = config7;
 function getColorSchemeBaseProps({ colorScheme }) {
-  var _a6, _b5;
+  var _a6;
   switch (colorScheme) {
     case "white":
       return {
-        backgroundColor: "white",
-        boxShadow: getBoxShadowString({
-          borderColor: "silver"
-        })
+        backgroundColor: "lightGrey"
       };
     case "grey":
       return {
-        backgroundColor: "lightGrey",
-        boxShadow: getBoxShadowString({
-          borderColor: "steel"
-        })
+        backgroundColor: "lightGrey"
+      };
+    case "green": {
+      return {
+        backgroundColor: "seaMist"
       };
+    }
     default:
       return {
-        backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum",
-        boxShadow: getBoxShadowString({
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[200]) ?? "silver"
-        })
+        backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum"
       };
   }
 }

package/dist/index.d.ts

@@ -2348,7 +2348,6 @@ declare const theme: {
                     boxShadow: string;
                 };
                 backgroundColor: string;
-                boxShadow: string;
                 appearance: string;
                 border: string;
                 overflow: string;

package/dist/index.js

@@ -18668,8 +18668,8 @@ var init_breakpoints = __esm({
       sm: tokens10__namespace.default.size.breakpoint.sm,
       md: tokens10__namespace.default.size.breakpoint.md,
       lg: tokens10__namespace.default.size.breakpoint.lg,
-      xl: tokens10__namespace.default.size.breakpoint.lg,
-      "2xl": tokens10__namespace.default.size.breakpoint.lg
+      xl: tokens10__namespace.default.size.breakpoint.xl,
+      "2xl": tokens10__namespace.default.size.breakpoint.xl
     };
   }
 });
@@ -19460,28 +19460,24 @@ var init_button2 = __esm({
   }
 });
 function getColorSchemeBaseProps({ colorScheme }) {
-  var _a6, _b5;
+  var _a6;
   switch (colorScheme) {
     case "white":
       return {
-        backgroundColor: "white",
-        boxShadow: getBoxShadowString({
-          borderColor: "silver"
-        })
+        backgroundColor: "lightGrey"
       };
     case "grey":
       return {
-        backgroundColor: "lightGrey",
-        boxShadow: getBoxShadowString({
-          borderColor: "steel"
-        })
+        backgroundColor: "lightGrey"
       };
+    case "green": {
+      return {
+        backgroundColor: "seaMist"
+      };
+    }
     default:
       return {
-        backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum",
-        boxShadow: getBoxShadowString({
-          borderColor: ((_b5 = colors[colorScheme]) == null ? void 0 : _b5[200]) ?? "silver"
-        })
+        backgroundColor: ((_a6 = colors[colorScheme]) == null ? void 0 : _a6[100]) ?? "platinum"
       };
   }
 }

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-QHD5YJ6K.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-A7MCH3JW.mjs';

package/package.json

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

package/src/theme/components/card.ts

@@ -60,29 +60,24 @@ type CardThemeProps = {
 
 function getColorSchemeBaseProps({ colorScheme }: CardThemeProps): {
   backgroundColor: string;
-  boxShadow: string;
 } {
   switch (colorScheme) {
     case "white":
       return {
-        backgroundColor: "white",
-        boxShadow: getBoxShadowString({
-          borderColor: "silver",
-        }),
+        backgroundColor: "lightGrey",
       };
     case "grey":
       return {
         backgroundColor: "lightGrey",
-        boxShadow: getBoxShadowString({
-          borderColor: "steel",
-        }),
       };
+    case "green": {
+      return {
+        backgroundColor: "seaMist",
+      };
+    }
     default:
       return {
         backgroundColor: colors[colorScheme]?.[100] ?? "platinum",
-        boxShadow: getBoxShadowString({
-          borderColor: colors[colorScheme]?.[200] ?? "silver",
-        }),
       };
   }
 }

package/src/theme/foundations/breakpoints.ts

@@ -4,6 +4,6 @@ export const breakpoints = {
   sm: tokens.size.breakpoint.sm,
   md: tokens.size.breakpoint.md,
   lg: tokens.size.breakpoint.lg,
-  xl: tokens.size.breakpoint.lg,
-  "2xl": tokens.size.breakpoint.lg,
+  xl: tokens.size.breakpoint.xl,
+  "2xl": tokens.size.breakpoint.xl,
 };