@vygruppen/spor-react 10.6.0 → 10.6.1

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@10.6.0 build
+> @vygruppen/spor-react@10.6.1 build
 > tsup src/index.tsx --dts --treeshake --format cjs,esm
 
 CLI Building entry: src/index.tsx
@@ -10,11 +10,11 @@
 ESM Build start
 DTS Build start
 ESM dist/index.mjs                      2.16 KB
-ESM dist/CountryCodeSelect-R27DZ2PB.mjs 1.22 KB
-ESM dist/chunk-WSGO53OP.mjs             424.74 KB
-ESM ⚡️ Build success in 2252ms
-CJS dist/index.js 538.15 KB
-CJS ⚡️ Build success in 2253ms
-DTS ⚡️ Build success in 15042ms
-DTS dist/index.d.ts  339.27 KB
-DTS dist/index.d.mts 339.27 KB
+ESM dist/CountryCodeSelect-SIB4RO26.mjs 1.22 KB
+ESM dist/chunk-RQ4CWVFZ.mjs             425.08 KB
+ESM ⚡️ Build success in 2278ms
+CJS dist/index.js 538.54 KB
+CJS ⚡️ Build success in 2279ms
+DTS ⚡️ Build success in 15683ms
+DTS dist/index.d.ts  339.80 KB
+DTS dist/index.d.mts 339.80 KB

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @vygruppen/spor-react
 
+## 10.6.1
+
+### Patch Changes
+
+- 22459d4: Added outline color of ExpandableAlert like the design
+
 ## 10.6.0
 
 ### Minor Changes

package/dist/{CountryCodeSelect-R27DZ2PB.mjs → CountryCodeSelect-SIB4RO26.mjs}

@@ -1,4 +1,4 @@
-import { createTexts, useTranslation, InfoSelect, Item } from './chunk-WSGO53OP.mjs';
+import { createTexts, useTranslation, InfoSelect, Item } from './chunk-RQ4CWVFZ.mjs';
 import React from 'react';
 import { getSupportedCallingCodes } from 'awesome-phonenumber';
 

package/dist/{chunk-WSGO53OP.mjs → chunk-RQ4CWVFZ.mjs}

@@ -1841,7 +1841,7 @@ var texts4 = createTexts({
     sv: "Landskod"
   }
 });
-var LazyCountryCodeSelect = React85__default.lazy(() => import('./CountryCodeSelect-R27DZ2PB.mjs'));
+var LazyCountryCodeSelect = React85__default.lazy(() => import('./CountryCodeSelect-SIB4RO26.mjs'));
 var Radio = forwardRef((props, ref) => {
   return /* @__PURE__ */ React85__default.createElement(Radio$1, { ...props, ref });
 });
@@ -2815,7 +2815,7 @@ var ExpandableAlert = ({
       allowToggle: true,
       flexGrow: "1"
     },
-    /* @__PURE__ */ React85__default.createElement(AccordionItem, null, /* @__PURE__ */ React85__default.createElement(AccordionButton, { sx: styles3.container }, /* @__PURE__ */ React85__default.createElement(
+    /* @__PURE__ */ React85__default.createElement(AccordionItem, { sx: styles3.accordion }, /* @__PURE__ */ React85__default.createElement(AccordionButton, { sx: styles3.container }, /* @__PURE__ */ React85__default.createElement(
       Flex,
       {
         justifyContent: "space-between",
@@ -10765,7 +10765,7 @@ var config3 = helpers2.defineMultiStyleConfig({
 var alert_default = config3;
 
 // src/theme/components/alert-expandable.ts
-var parts2 = anatomy("alertExpandable").parts("container");
+var parts2 = anatomy("alertExpandable").parts("container", "accordion");
 var helpers3 = createMultiStyleConfigHelpers(parts2.keys);
 var config4 = helpers3.defineMultiStyleConfig({
   baseStyle: {
@@ -10785,6 +10785,9 @@ var config4 = helpers3.defineMultiStyleConfig({
   },
   variants: {
     info: {
+      accordion: {
+        outlineColor: "cloudy"
+      },
       container: {
         _hover: {
           outlineColor: "sky"
@@ -10795,6 +10798,9 @@ var config4 = helpers3.defineMultiStyleConfig({
       }
     },
     success: {
+      accordion: {
+        outlineColor: "coralGreen"
+      },
       container: {
         _hover: {
           outlineColor: "blueGreen"
@@ -10805,6 +10811,9 @@ var config4 = helpers3.defineMultiStyleConfig({
       }
     },
     warning: {
+      accordion: {
+        outlineColor: "primrose"
+      },
       container: {
         _hover: {
           outlineColor: "sunshine"
@@ -10815,6 +10824,9 @@ var config4 = helpers3.defineMultiStyleConfig({
       }
     },
     "alt-transport": {
+      accordion: {
+        outlineColor: "burntYellow"
+      },
       container: {
         _hover: {
           outlineColor: "golden"
@@ -10825,6 +10837,9 @@ var config4 = helpers3.defineMultiStyleConfig({
       }
     },
     error: {
+      accordion: {
+        outlineColor: "salmon"
+      },
       container: {
         _hover: {
           outlineColor: "apricot"

package/dist/index.d.mts

@@ -2558,11 +2558,14 @@ declare const theme: {
             } | undefined;
             sizes?: {
                 [key: string]: _chakra_ui_styled_system.PartsStyleInterpolation<{
-                    keys: "container"[];
+                    keys: ("container" | "accordion")[];
                 }>;
             } | undefined;
             variants?: {
                 info: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2573,6 +2576,9 @@ declare const theme: {
                     };
                 };
                 success: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2583,6 +2589,9 @@ declare const theme: {
                     };
                 };
                 warning: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2593,6 +2602,9 @@ declare const theme: {
                     };
                 };
                 "alt-transport": {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2603,6 +2615,9 @@ declare const theme: {
                     };
                 };
                 error: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2628,7 +2643,7 @@ declare const theme: {
                 variant?: "error" | "info" | "success" | "warning" | "alt-transport" | "service" | undefined;
                 colorScheme?: string | undefined;
             } | undefined;
-            parts: "container"[];
+            parts: ("container" | "accordion")[];
         };
         AlertService: {
             baseStyle?: {

package/dist/index.d.ts

@@ -2558,11 +2558,14 @@ declare const theme: {
             } | undefined;
             sizes?: {
                 [key: string]: _chakra_ui_styled_system.PartsStyleInterpolation<{
-                    keys: "container"[];
+                    keys: ("container" | "accordion")[];
                 }>;
             } | undefined;
             variants?: {
                 info: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2573,6 +2576,9 @@ declare const theme: {
                     };
                 };
                 success: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2583,6 +2589,9 @@ declare const theme: {
                     };
                 };
                 warning: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2593,6 +2602,9 @@ declare const theme: {
                     };
                 };
                 "alt-transport": {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2603,6 +2615,9 @@ declare const theme: {
                     };
                 };
                 error: {
+                    accordion: {
+                        outlineColor: string;
+                    };
                     container: {
                         _hover: {
                             outlineColor: string;
@@ -2628,7 +2643,7 @@ declare const theme: {
                 variant?: "error" | "info" | "success" | "warning" | "alt-transport" | "service" | undefined;
                 colorScheme?: string | undefined;
             } | undefined;
-            parts: "container"[];
+            parts: ("container" | "accordion")[];
         };
         AlertService: {
             baseStyle?: {

package/dist/index.js

@@ -3322,7 +3322,7 @@ var init_ExpandableAlert = __esm({
           allowToggle: true,
           flexGrow: "1"
         },
-        /* @__PURE__ */ React86__namespace.default.createElement(react.AccordionItem, null, /* @__PURE__ */ React86__namespace.default.createElement(react.AccordionButton, { sx: styles3.container }, /* @__PURE__ */ React86__namespace.default.createElement(
+        /* @__PURE__ */ React86__namespace.default.createElement(react.AccordionItem, { sx: styles3.accordion }, /* @__PURE__ */ React86__namespace.default.createElement(react.AccordionButton, { sx: styles3.container }, /* @__PURE__ */ React86__namespace.default.createElement(
           react.Flex,
           {
             justifyContent: "space-between",
@@ -12147,7 +12147,7 @@ var init_alert_expandable = __esm({
   "src/theme/components/alert-expandable.ts"() {
     init_dist4();
     init_dist3();
-    parts2 = anatomy("alertExpandable").parts("container");
+    parts2 = anatomy("alertExpandable").parts("container", "accordion");
     helpers3 = createMultiStyleConfigHelpers(parts2.keys);
     config4 = helpers3.defineMultiStyleConfig({
       baseStyle: {
@@ -12167,6 +12167,9 @@ var init_alert_expandable = __esm({
       },
       variants: {
         info: {
+          accordion: {
+            outlineColor: "cloudy"
+          },
           container: {
             _hover: {
               outlineColor: "sky"
@@ -12177,6 +12180,9 @@ var init_alert_expandable = __esm({
           }
         },
         success: {
+          accordion: {
+            outlineColor: "coralGreen"
+          },
           container: {
             _hover: {
               outlineColor: "blueGreen"
@@ -12187,6 +12193,9 @@ var init_alert_expandable = __esm({
           }
         },
         warning: {
+          accordion: {
+            outlineColor: "primrose"
+          },
           container: {
             _hover: {
               outlineColor: "sunshine"
@@ -12197,6 +12206,9 @@ var init_alert_expandable = __esm({
           }
         },
         "alt-transport": {
+          accordion: {
+            outlineColor: "burntYellow"
+          },
           container: {
             _hover: {
               outlineColor: "golden"
@@ -12207,6 +12219,9 @@ var init_alert_expandable = __esm({
           }
         },
         error: {
+          accordion: {
+            outlineColor: "salmon"
+          },
           container: {
             _hover: {
               outlineColor: "apricot"

package/dist/index.mjs

@@ -1 +1 @@
-export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, CardSelect, CargonetLogo, 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, FullScreenDrawer, 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, ListItem, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, Nudge, NumericStepper, OrderedList, Pagination, PasswordInput, PhoneNumberInput, PlayPauseButton, Portal, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, RadioGroup, ScaleFade, SearchInput, Section, ServiceAlert, SimpleDrawer, SimpleGrid, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, StaticCard, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tooltip, Tr, TravelTag, UnorderedList, VStack, VyLogo, VyLogoPride, WizardNudge, Wrap, WrapItem, brandTheme, createTexts, defineStyleConfig, extendTheme, fontFaces, slugify, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useSize, useTheme, useToast, useToken, useTranslation } from './chunk-WSGO53OP.mjs';
+export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Brand, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Button, ButtonGroup, CardSelect, CargonetLogo, 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, FullScreenDrawer, 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, ListItem, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, Nudge, NumericStepper, OrderedList, Pagination, PasswordInput, PhoneNumberInput, PlayPauseButton, Portal, PressableCard, ProgressBar, ProgressIndicator, ProgressLoader, Radio, RadioCard, RadioCardGroup, RadioCardGroupContext, RadioGroup, ScaleFade, SearchInput, Section, ServiceAlert, SimpleDrawer, SimpleGrid, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, StaticCard, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tooltip, Tr, TravelTag, UnorderedList, VStack, VyLogo, VyLogoPride, WizardNudge, Wrap, WrapItem, brandTheme, createTexts, defineStyleConfig, extendTheme, fontFaces, slugify, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useSize, useTheme, useToast, useToken, useTranslation } from './chunk-RQ4CWVFZ.mjs';

package/package.json

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

package/src/alert/ExpandableAlert.tsx

@@ -54,7 +54,7 @@ export const ExpandableAlert = ({
         allowToggle
         flexGrow="1"
       >
-        <AccordionItem>
+        <AccordionItem sx={styles.accordion}>
           <AccordionButton sx={styles.container}>
             <Flex
               justifyContent="space-between"

package/src/theme/components/alert-expandable.ts

@@ -1,7 +1,7 @@
 import { anatomy } from "@chakra-ui/anatomy";
 import { createMultiStyleConfigHelpers } from "@chakra-ui/styled-system";
 
-const parts = anatomy("alertExpandable").parts("container");
+const parts = anatomy("alertExpandable").parts("container", "accordion");
 const helpers = createMultiStyleConfigHelpers(parts.keys);
 
 const config = helpers.defineMultiStyleConfig({
@@ -22,6 +22,9 @@ const config = helpers.defineMultiStyleConfig({
   },
   variants: {
     info: {
+      accordion: {
+        outlineColor: "cloudy",
+      },
       container: {
         _hover: {
           outlineColor: "sky",
@@ -32,6 +35,9 @@ const config = helpers.defineMultiStyleConfig({
       },
     },
     success: {
+      accordion: {
+        outlineColor: "coralGreen",
+      },
       container: {
         _hover: {
           outlineColor: "blueGreen",
@@ -42,6 +48,9 @@ const config = helpers.defineMultiStyleConfig({
       },
     },
     warning: {
+      accordion: {
+        outlineColor: "primrose",
+      },
       container: {
         _hover: {
           outlineColor: "sunshine",
@@ -52,6 +61,9 @@ const config = helpers.defineMultiStyleConfig({
       },
     },
     "alt-transport": {
+      accordion: {
+        outlineColor: "burntYellow",
+      },
       container: {
         _hover: {
           outlineColor: "golden",
@@ -62,6 +74,9 @@ const config = helpers.defineMultiStyleConfig({
       },
     },
     error: {
+      accordion: {
+        outlineColor: "salmon",
+      },
       container: {
         _hover: {
           outlineColor: "apricot",