@vygruppen/spor-react 13.7.0 → 13.7.2

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@13.7.0 build /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@13.7.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           356.08 KB
-ESM dist/icons/index.mjs     110.00 B
-ESM dist/index.mjs.map       756.21 KB
-ESM dist/icons/index.mjs.map 157.00 B
-ESM ⚡️ Build success in 2676ms
-CJS dist/index.cjs           380.79 KB
+CJS dist/index.cjs           381.87 KB
 CJS dist/icons/index.cjs     381.00 B
-CJS dist/index.cjs.map       756.21 KB
+CJS dist/index.cjs.map       757.99 KB
 CJS dist/icons/index.cjs.map 157.00 B
-CJS ⚡️ Build success in 2678ms
-DTS ⚡️ Build success in 21841ms
+CJS ⚡️ Build success in 2512ms
+ESM dist/index.mjs           357.13 KB
+ESM dist/icons/index.mjs     110.00 B
+ESM dist/index.mjs.map       757.99 KB
+ESM dist/icons/index.mjs.map 157.00 B
+ESM ⚡️ Build success in 2513ms
+DTS ⚡️ Build success in 21861ms
 DTS dist/icons/index.d.ts  44.00 B
-DTS dist/index.d.ts        156.17 KB
+DTS dist/index.d.ts        156.60 KB
 DTS dist/icons/index.d.cts 44.00 B
-DTS dist/index.d.cts       156.17 KB
+DTS dist/index.d.cts       156.60 KB

package/.turbo/turbo-postinstall.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@13.7.0 postinstall /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@13.7.2 postinstall /home/runner/work/spor/spor/packages/spor-react
 > chakra typegen src/theme/index.ts
 
 ◇ injected env (0) from .env // tip: ⌘ override existing { override: true }

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @vygruppen/spor-react
 
+## 13.7.2
+
+### Patch Changes
+
+- ff28880: RadioCard: Make children take 100% width
+
+## 13.7.1
+
+### Patch Changes
+
+- 15a6c48: Badge: Added outline on badges
+- e4c369c: truncate long select labels when selected
+- ac7ec72: Remove aria-hidden property from Field component to support better screen reading of form elements.
+- 1272e1d: RadioCard bug: make the children of a RadioCard to by default be placed in a column instead of a row.
+- Updated dependencies [1272e1d]
+  - @vygruppen/spor-icon-react@5.0.3
+
 ## 13.7.0
 
 ### Minor Changes

package/dist/index.cjs

@@ -692,58 +692,70 @@ var badgeRecipie = react.defineRecipe({
     alignItems: "center",
     justifyContent: "center",
     height: "fit-content",
-    gap: "0.5"
+    gap: "0.5",
+    outline: "1px solid",
+    outlineOffset: "-1px"
   },
   variants: {
     colorPalette: {
       neutral: {
         backgroundColor: "surface",
         color: "text",
+        outlineColor: "outline",
         "& svg": { color: "icon" }
       },
       grey: {
         backgroundColor: "surface.neutral",
         color: "text.neutral",
+        outlineColor: "outline.neutral",
         "& svg": { color: "icon.neutral" }
       },
       green: {
         backgroundColor: "surface.success",
         color: "text.success",
+        outlineColor: "outline.success",
         "& svg": { color: "icon.success" }
       },
       blue: {
         backgroundColor: "surface.info",
         color: "text.info",
+        outlineColor: "outline.info",
         "& svg": { color: "icon.info" }
       },
       cream: {
         backgroundColor: "surface.warning",
         color: "text.warning",
+        outlineColor: "outline.warning",
         "& svg": { color: "icon.warning" }
       },
       yellow: {
         backgroundColor: "surface.notice",
         color: "text.notice",
+        outlineColor: "outline.notice",
         "& svg": { color: "icon.notice" }
       },
       orange: {
         backgroundColor: "surface.caution",
         color: "text.caution",
+        outlineColor: "outline.caution",
         "& svg": { color: "icon.caution" }
       },
       red: {
         backgroundColor: "surface.critical",
         color: "text.critical",
+        outlineColor: "outline.critical",
         "& svg": { color: "icon.critical" }
       },
       brightRed: {
         backgroundColor: { _light: "brightRed", _dark: "brightRed" },
         color: { _light: "pink", _dark: "pink" },
+        outlineColor: "outline.error",
         "& svg": { color: { _light: "pink", _dark: "pink" } }
       },
       disabled: {
         backgroundColor: "surface.disabled",
         color: "text.disabled",
+        outlineColor: "outline.disabled",
         "& svg": { color: "icon.disabled" }
       }
     },
@@ -786,6 +798,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "darkBlue", _dark: "lightBlue" },
         color: { _light: "icyBlue", _dark: "royal" },
+        outlineColor: { _light: "ocean", _dark: "cloudy" },
         "& svg": { color: { _light: "royal", _dark: "icyBlue" } }
       }
     },
@@ -795,6 +808,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "darkTeal", _dark: "seaMist" },
         color: { _light: "mint", _dark: "jungle" },
+        outlineColor: { _light: "greenHaze", _dark: "coralGreen" },
         "& svg": { color: { _light: "mint", _dark: "jungle" } }
       }
     },
@@ -804,6 +818,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "carbon", _dark: "platinum" },
         color: { _light: "white", _dark: "darkGrey" },
+        outlineColor: { _light: "iron", _dark: "silver" },
         "& svg": { color: { _light: "white", _dark: "darkGrey" } }
       }
     },
@@ -814,6 +829,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "coffee", _dark: "blonde" },
         color: { _light: "cornsilk", _dark: "coffee" },
+        outlineColor: { _light: "bronze", _dark: "banana" },
         "& svg": { color: { _light: "cornsilk", _dark: "coffee" } }
       }
     },
@@ -823,6 +839,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "bronze", _dark: "banana" },
         color: { _light: "cornsilk", _dark: "coffee" },
+        outlineColor: { _light: "golden", _dark: "banana" },
         "& svg": { color: { _light: "cornsilk", _dark: "coffee" } }
       }
     },
@@ -832,6 +849,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "wood", _dark: "champagne" },
         color: { _light: "bisque", _dark: "wood" },
+        outlineColor: { _light: "russet", _dark: "saffron" },
         "& svg": { color: { _light: "bisque", _dark: "wood" } }
       }
     },
@@ -841,6 +859,7 @@ var badgeRecipie = react.defineRecipe({
       css: {
         backgroundColor: { _light: "burgundy", _dark: "lightRed" },
         color: { _light: "pink", _dark: "maroon" },
+        outlineColor: { _light: "crimson", _dark: "salmon" },
         "& svg": { color: { _light: "pink", _dark: "maroon" } }
       }
     },
@@ -850,6 +869,7 @@ var badgeRecipie = react.defineRecipe({
       inverted: true,
       css: {
         backgroundColor: { _light: "ink", _dark: "white" },
+        outlineColor: { _light: "whiteAlpha.400", _dark: "blackAlpha.400" },
         color: { _light: "white", _dark: "darkGrey" },
         "& svg": { color: { _light: "white", _dark: "darkGrey" } }
       }
@@ -1590,7 +1610,7 @@ var RadioCard = ({
     ),
     /* @__PURE__ */ jsxRuntime.jsxs(react.RadioCard.ItemControl, { id: itemControlId, "aria-hidden": true, children: [
       showIndicator && /* @__PURE__ */ jsxRuntime.jsx(react.RadioCard.ItemIndicator, {}),
-      children
+      /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { direction: "column", width: "100%", children })
     ] })
   ] });
 };
@@ -2108,18 +2128,17 @@ var Field3 = ({
         id,
         gap,
         children: [
-          label && !floatingLabel && /* @__PURE__ */ jsxRuntime.jsx(Label, { asChild: labelAsChild, "aria-hidden": true, css: styles.label, children: renderLabelWithIndicator(label, labelAsChild) }),
-          children,
+          label && !floatingLabel && /* @__PURE__ */ jsxRuntime.jsx(Label, { asChild: labelAsChild, css: styles.label, children: renderLabelWithIndicator(label, labelAsChild) }),
           label && floatingLabel && /* @__PURE__ */ jsxRuntime.jsx(
             FloatingLabel,
             {
               "data-float": shouldFloat ? true : void 0,
               asChild: labelAsChild,
-              "aria-hidden": true,
               css: styles.label,
               children: renderLabelWithIndicator(label, labelAsChild)
             }
           ),
+          children,
           errorText && /* @__PURE__ */ jsxRuntime.jsx(react.Field.ErrorText, { "aria-live": "polite", children: errorText })
         ]
       }
@@ -11588,6 +11607,11 @@ var selectSlotRecipe = react.defineSlotRecipe({
         outlineColor: "outline.error"
       }
     },
+    valueText: {
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap",
+      overflow: "hidden"
+    },
     itemText: {
       flex: "1",
       alignItems: "center"