@vygruppen/spor-react 13.3.0 → 13.3.2

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@13.3.0 build /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@13.3.2 build /home/runner/work/spor/spor/packages/spor-react
 > tsup
 
 CLI Building entry: src/index.tsx, src/icons/index.tsx
@@ -11,18 +11,18 @@ CLI Cleaning output folder
 ESM Build start
 CJS Build start
 DTS Build start
+ESM dist/index.mjs           348.86 KB
 ESM dist/icons/index.mjs     110.00 B
-ESM dist/index.mjs           349.79 KB
+ESM dist/index.mjs.map       741.95 KB
 ESM dist/icons/index.mjs.map 157.00 B
-ESM dist/index.mjs.map       743.47 KB
-ESM ⚡️ Build success in 2804ms
-CJS dist/index.cjs           374.32 KB
+ESM ⚡️ Build success in 2868ms
+CJS dist/index.cjs           373.39 KB
 CJS dist/icons/index.cjs     381.00 B
-CJS dist/index.cjs.map       743.47 KB
 CJS dist/icons/index.cjs.map 157.00 B
-CJS ⚡️ Build success in 2805ms
-DTS ⚡️ Build success in 21436ms
+CJS dist/index.cjs.map       741.95 KB
+CJS ⚡️ Build success in 2869ms
+DTS ⚡️ Build success in 21449ms
 DTS dist/icons/index.d.ts  44.00 B
-DTS dist/index.d.ts        150.54 KB
+DTS dist/index.d.ts        150.59 KB
 DTS dist/icons/index.d.cts 44.00 B
-DTS dist/index.d.cts       150.54 KB
+DTS dist/index.d.cts       150.59 KB

package/.turbo/turbo-postinstall.log

@@ -1,8 +1,8 @@
 
-> @vygruppen/spor-react@13.3.0 postinstall /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@13.3.2 postinstall /home/runner/work/spor/spor/packages/spor-react
 > chakra typegen src/theme/index.ts
 
-◇ injected env (0) from .env // tip: ⌘ multiple files { path: ['.env.local', '.env'] }
+◇ injected env (0) from .env // tip: ⌘ enable debugging { debug: true }
 ┌  Chakra CLI ⚡️
 [?25l│
 ◒  Generating conditions types...

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @vygruppen/spor-react
 
+## 13.3.2
+
+### Patch Changes
+
+- b1e5186: Add disabled colorPalette to badge
+- d6eddea: Add Chakra's AccordionItem-props to the ExpandableItem
+- Updated dependencies [0a35c66]
+  - @vygruppen/spor-design-tokens@5.0.4
+
+## 13.3.1
+
+### Patch Changes
+
+- 55e243a: add maxWidth to Tooltip
+- b365786: Update focus colour for date time segments
+  - @vygruppen/spor-icon-react@5.0.0
+
 ## 13.3.0
 
 ### Minor Changes

package/dist/index.cjs

@@ -699,74 +699,52 @@ var badgeRecipie = react.defineRecipe({
       neutral: {
         backgroundColor: "surface",
         color: "text",
-        "& svg": {
-          color: "icon"
-        }
+        "& svg": { color: "icon" }
       },
       grey: {
         backgroundColor: "surface.neutral",
         color: "text.neutral",
-        "& svg": {
-          color: "icon.neutral"
-        }
+        "& svg": { color: "icon.neutral" }
       },
       green: {
         backgroundColor: "surface.success",
         color: "text.success",
-        "& svg": {
-          color: "icon.success"
-        }
+        "& svg": { color: "icon.success" }
       },
       blue: {
         backgroundColor: "surface.info",
         color: "text.info",
-        "& svg": {
-          color: "icon.info"
-        }
+        "& svg": { color: "icon.info" }
       },
       cream: {
         backgroundColor: "surface.warning",
         color: "text.warning",
-        "& svg": {
-          color: "icon.warning"
-        }
+        "& svg": { color: "icon.warning" }
       },
       yellow: {
         backgroundColor: "surface.notice",
         color: "text.notice",
-        "& svg": {
-          color: "icon.notice"
-        }
+        "& svg": { color: "icon.notice" }
       },
       orange: {
         backgroundColor: "surface.caution",
         color: "text.caution",
-        "& svg": {
-          color: "icon.caution"
-        }
+        "& svg": { color: "icon.caution" }
       },
       red: {
         backgroundColor: "surface.critical",
         color: "text.critical",
-        "& svg": {
-          color: "icon.critical"
-        }
+        "& svg": { color: "icon.critical" }
       },
       brightRed: {
-        backgroundColor: {
-          _light: "brightRed",
-          _dark: "brightRed"
-        },
-        color: {
-          _light: "pink",
-          _dark: "pink"
-        },
-        "& svg": {
-          color: {
-            _light: "pink",
-            _dark: "pink"
-          }
-        }
+        backgroundColor: { _light: "brightRed", _dark: "brightRed" },
+        color: { _light: "pink", _dark: "pink" },
+        "& svg": { color: { _light: "pink", _dark: "pink" } }
+      },
+      disabled: {
+        backgroundColor: "surface.disabled",
+        color: "text.disabled",
+        "& svg": { color: "icon.disabled" }
       }
     },
     size: {
@@ -792,11 +770,7 @@ var badgeRecipie = react.defineRecipe({
         borderRadius: "xs"
       }
     },
-    attached: {
-      true: {
-        borderBottomRadius: "none"
-      }
-    },
+    attached: { true: { borderBottomRadius: "none" } },
     inverted: { true: {} }
   },
   defaultVariants: {
@@ -810,60 +784,27 @@ var badgeRecipie = react.defineRecipe({
       colorPalette: "blue",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "darkBlue",
-          _dark: "lightBlue"
-        },
-        color: {
-          _light: "icyBlue",
-          _dark: "royal"
-        },
-        "& svg": {
-          color: {
-            _light: "royal",
-            _dark: "icyBlue"
-          }
-        }
+        backgroundColor: { _light: "darkBlue", _dark: "lightBlue" },
+        color: { _light: "icyBlue", _dark: "royal" },
+        "& svg": { color: { _light: "royal", _dark: "icyBlue" } }
       }
     },
     {
       colorPalette: "green",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "darkTeal",
-          _dark: "seaMist"
-        },
-        color: {
-          _light: "mint",
-          _dark: "jungle"
-        },
-        "& svg": {
-          color: {
-            _light: "mint",
-            _dark: "jungle"
-          }
-        }
+        backgroundColor: { _light: "darkTeal", _dark: "seaMist" },
+        color: { _light: "mint", _dark: "jungle" },
+        "& svg": { color: { _light: "mint", _dark: "jungle" } }
       }
     },
     {
       colorPalette: "grey",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "carbon",
-          _dark: "platinum"
-        },
-        color: {
-          _light: "white",
-          _dark: "darkGrey"
-        },
-        "& svg": {
-          color: {
-            _light: "white",
-            _dark: "darkGrey"
-          }
-        }
+        backgroundColor: { _light: "carbon", _dark: "platinum" },
+        color: { _light: "white", _dark: "darkGrey" },
+        "& svg": { color: { _light: "white", _dark: "darkGrey" } }
       }
     },
     {
@@ -871,80 +812,36 @@ var badgeRecipie = react.defineRecipe({
       colorPalette: "cream",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "coffee",
-          _dark: "blonde"
-        },
-        color: {
-          _light: "cornsilk",
-          _dark: "coffee"
-        },
-        "& svg": {
-          color: {
-            _light: "cornsilk",
-            _dark: "coffee"
-          }
-        }
+        backgroundColor: { _light: "coffee", _dark: "blonde" },
+        color: { _light: "cornsilk", _dark: "coffee" },
+        "& svg": { color: { _light: "cornsilk", _dark: "coffee" } }
       }
     },
     {
       colorPalette: "yellow",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "bronze",
-          _dark: "banana"
-        },
-        color: {
-          _light: "cornsilk",
-          _dark: "coffee"
-        },
-        "& svg": {
-          color: {
-            _light: "cornsilk",
-            _dark: "coffee"
-          }
-        }
+        backgroundColor: { _light: "bronze", _dark: "banana" },
+        color: { _light: "cornsilk", _dark: "coffee" },
+        "& svg": { color: { _light: "cornsilk", _dark: "coffee" } }
       }
     },
     {
       colorPalette: "orange",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "wood",
-          _dark: "champagne"
-        },
-        color: {
-          _light: "bisque",
-          _dark: "wood"
-        },
-        "& svg": {
-          color: {
-            _light: "bisque",
-            _dark: "wood"
-          }
-        }
+        backgroundColor: { _light: "wood", _dark: "champagne" },
+        color: { _light: "bisque", _dark: "wood" },
+        "& svg": { color: { _light: "bisque", _dark: "wood" } }
       }
     },
     {
       colorPalette: "red",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "burgundy",
-          _dark: "lightRed"
-        },
-        color: {
-          _light: "pink",
-          _dark: "maroon"
-        },
-        "& svg": {
-          color: {
-            _light: "pink",
-            _dark: "maroon"
-          }
-        }
+        backgroundColor: { _light: "burgundy", _dark: "lightRed" },
+        color: { _light: "pink", _dark: "maroon" },
+        "& svg": { color: { _light: "pink", _dark: "maroon" } }
       }
     },
     {
@@ -952,20 +849,9 @@ var badgeRecipie = react.defineRecipe({
       colorPalette: "neutral",
       inverted: true,
       css: {
-        backgroundColor: {
-          _light: "ink",
-          _dark: "white"
-        },
-        color: {
-          _light: "white",
-          _dark: "darkGrey"
-        },
-        "& svg": {
-          color: {
-            _light: "white",
-            _dark: "darkGrey"
-          }
-        }
+        backgroundColor: { _light: "ink", _dark: "white" },
+        color: { _light: "white", _dark: "darkGrey" },
+        "& svg": { color: { _light: "white", _dark: "darkGrey" } }
       }
     }
   ]
@@ -9070,7 +8956,7 @@ var datePickerSlotRecipe = react.defineSlotRecipe({
     },
     dateTimeSegment: {
       _focus: {
-        backgroundColor: "surface.ghost.active",
+        backgroundColor: "surface.floating.active",
         color: "text"
       }
     },
@@ -11070,6 +10956,7 @@ var popoverSlotRecipe = react.defineSlotRecipe({
       outline: "0",
       transformOrigin: "var(--transform-origin)",
       maxHeight: "var(--available-height)",
+      maxWidth: "var(--available-width)",
       _open: {
         animationStyle: "scale-fade-in",
         animationDuration: "fast"