@vygruppen/spor-react 12.13.4 → 12.14.0

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@12.13.4 build /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@12.14.0 build /home/runner/work/spor/spor/packages/spor-react
 > tsup
 
 CLI Building entry: src/index.tsx, src/icons/index.tsx
@@ -11,17 +11,17 @@ CLI Cleaning output folder
 ESM Build start
 CJS Build start
 DTS Build start
-ESM dist/index.mjs           297.26 KB
-ESM dist/icons/index.mjs     110.00 B
-ESM dist/icons/index.mjs.map 157.00 B
-ESM dist/index.mjs.map       635.10 KB
-ESM ⚡️ Build success in 2617ms
-CJS dist/index.cjs           318.74 KB
+CJS dist/index.cjs           319.89 KB
 CJS dist/icons/index.cjs     381.00 B
-CJS dist/index.cjs.map       635.10 KB
+CJS dist/index.cjs.map       636.92 KB
 CJS dist/icons/index.cjs.map 157.00 B
-CJS ⚡️ Build success in 2618ms
-DTS ⚡️ Build success in 18619ms
+CJS ⚡️ Build success in 2691ms
+ESM dist/index.mjs           298.29 KB
+ESM dist/icons/index.mjs     110.00 B
+ESM dist/index.mjs.map       636.92 KB
+ESM dist/icons/index.mjs.map 157.00 B
+ESM ⚡️ Build success in 2692ms
+DTS ⚡️ Build success in 18936ms
 DTS dist/icons/index.d.ts  44.00 B
 DTS dist/index.d.ts        157.02 KB
 DTS dist/icons/index.d.cts 44.00 B

package/.turbo/turbo-postinstall.log

@@ -1,8 +1,8 @@
 
-> @vygruppen/spor-react@12.13.4 postinstall /home/runner/work/spor/spor/packages/spor-react
+> @vygruppen/spor-react@12.14.0 postinstall /home/runner/work/spor/spor/packages/spor-react
 > chakra typegen src/theme/index.ts
 
-[dotenv@17.2.2] injecting env (0) from .env -- tip: ⚙️  enable debug logging with { debug: true }
+[dotenv@17.2.2] injecting env (0) from .env -- tip: 📡 version env with Radar: https://dotenvx.com/radar
 ┌  Chakra CLI ⚡️
 [?25l│
 ◒  Generating conditions types...

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @vygruppen/spor-react
 
+## 12.14.0
+
+### Minor Changes
+
+- cdb40ce: Add new fontsizes, md-lg and 2xs. Md on desktop adjusts from 24px to 21px.
+
+### Patch Changes
+
+- Updated dependencies [cdb40ce]
+  - @vygruppen/spor-design-tokens@4.2.0
+
+## 12.13.5
+
+### Patch Changes
+
+- ae25c85: Fix cover modal not handling overflow with scroll
+
 ## 12.13.4
 
 ### Patch Changes

package/dist/index.cjs

@@ -1821,11 +1821,19 @@ var DateField = React27.forwardRef(
           css: styles.inputLabel,
           position: "absolute",
           paddingTop: "2px",
-          children: /* @__PURE__ */ jsxRuntime.jsxs(Label, { padding: "0", fontSize: "2xs", ...props.labelProps, children: [
-            props.label,
-            " ",
-            /* @__PURE__ */ jsxRuntime.jsx(react.Field.RequiredIndicator, {})
-          ] })
+          children: /* @__PURE__ */ jsxRuntime.jsxs(
+            Label,
+            {
+              padding: "0",
+              fontSize: ["mobile.xs", "desktop.xs"],
+              ...props.labelProps,
+              children: [
+                props.label,
+                " ",
+                /* @__PURE__ */ jsxRuntime.jsx(react.Field.RequiredIndicator, {})
+              ]
+            }
+          )
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(react.Flex, { ...fieldProps, ref, paddingTop: "3", paddingBottom: "0.5", children: state.segments.map((segment, i) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -1914,6 +1922,7 @@ var StyledField = React27.forwardRef(
         ref,
         "aria-invalid": invalid,
         "aria-disabled": isDisabled,
+        fontSize: ["mobile.md", "desktop.md"],
         children
       }
     );
@@ -2166,29 +2175,41 @@ function DateRangePicker({
     ] })
   ] }) });
 }
+
+// src/util/slugify.tsx
+function slugify(text, maxLength = 50) {
+  if (!text) {
+    return text;
+  }
+  if (Array.isArray(text)) {
+    text = text.join(" ");
+  }
+  if (maxLength < 1) {
+    throw new Error("The maxLength parameter must be a positive number");
+  }
+  return text.normalize("NFD").replaceAll(/[\u0300-\u036F]/g, "").replaceAll(/[\u00C6\u00E6]/g, "ae").replaceAll(/[\u00D8\u00F8]/g, "oe").replaceAll(/[\u00C5\u00E5]/g, "aa").toLowerCase().replaceAll(/\s+/g, "-").replaceAll(/[^\w-]+/g, "").replaceAll(/--+/g, "-").replace(/^-+/, "").replace(/-+$/, "").slice(0, Math.max(0, maxLength));
+}
 var TimeField = ({ state, ...props }) => {
   const ref = React27.useRef(null);
   const { labelProps, fieldProps } = reactAria.useTimeField(props, state, ref);
   return /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(
-      "label",
+      react.chakra.label,
       {
         ...labelProps,
         htmlFor: fieldProps.id,
-        style: {
-          marginBottom: 0,
-          fontSize: "mobile.xs",
-          top: 0,
-          cursor: "text",
-          left: "50%",
-          transform: "translateX(-50%)",
-          position: "absolute",
-          paddingTop: "2px",
-          whiteSpace: "nowrap",
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          maxWidth: "80%"
-        },
+        marginBottom: 0,
+        fontSize: ["mobile.xs", "desktop.xs"],
+        top: 0,
+        cursor: "text",
+        left: "50%",
+        transform: "translateX(-50%)",
+        position: "absolute",
+        paddingTop: "2px",
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        maxWidth: "80%",
         children: props.label
       }
     ),
@@ -5839,22 +5860,6 @@ var linkRecipe = react.defineRecipe({
     size: "sm"
   }
 });
-
-// src/util/slugify.tsx
-function slugify(text, maxLength = 50) {
-  if (!text) {
-    return text;
-  }
-  if (Array.isArray(text)) {
-    text = text.join(" ");
-  }
-  if (maxLength < 1) {
-    throw new Error("The maxLength parameter must be a positive number");
-  }
-  return text.normalize("NFD").replaceAll(/[\u0300-\u036F]/g, "").replaceAll(/[\u00C6\u00E6]/g, "ae").replaceAll(/[\u00D8\u00F8]/g, "oe").replaceAll(/[\u00C5\u00E5]/g, "aa").toLowerCase().replaceAll(/\s+/g, "-").replaceAll(/[^\w-]+/g, "").replaceAll(/--+/g, "-").replace(/^-+/, "").replace(/-+$/, "").slice(0, Math.max(0, maxLength));
-}
-
-// src/theme/recipes/pressable-card.ts
 var pressableCardRecipe = react.defineRecipe({
   base: {
     appearance: "none",
@@ -7479,11 +7484,8 @@ var dialogSlotRecipe = react.defineSlotRecipe({
   variants: {
     placement: {
       center: {
-        positioner: {
-          alignItems: "center"
-        },
         content: {
-          marginX: "auto"
+          margin: "auto"
         }
       },
       top: {
@@ -7559,7 +7561,7 @@ var dialogSlotRecipe = react.defineSlotRecipe({
         },
         content: {
           width: "100%",
-          height: "100%",
+          minHeight: "100%",
           "--dialog-margin": "0",
           margin: "0"
         }
@@ -10095,17 +10097,21 @@ var fontSizes = react.defineTokens.fontSizes({
   "2xl": { value: tokens23__namespace.default.size.font.xl.desktop },
   "3xl": { value: tokens23__namespace.default.size.font.xxl.desktop },
   mobile: {
+    "2xs": { value: tokens23__namespace.default.size.font["2xs"].mobile },
     xs: { value: tokens23__namespace.default.size.font.xs.mobile },
     sm: { value: tokens23__namespace.default.size.font.sm.mobile },
     md: { value: tokens23__namespace.default.size.font.md.mobile },
+    "md-lg": { value: tokens23__namespace.default.size.font["md-lg"].mobile },
     lg: { value: tokens23__namespace.default.size.font.lg.mobile },
     xl: { value: tokens23__namespace.default.size.font.xl.mobile },
     xxl: { value: tokens23__namespace.default.size.font.xxl.mobile }
   },
   desktop: {
+    "2xs": { value: tokens23__namespace.default.size.font["2xs"].desktop },
     xs: { value: tokens23__namespace.default.size.font.xs.desktop },
     sm: { value: tokens23__namespace.default.size.font.sm.desktop },
     md: { value: tokens23__namespace.default.size.font.md.desktop },
+    "md-lg": { value: tokens23__namespace.default.size.font["md-lg"].desktop },
     lg: { value: tokens23__namespace.default.size.font.lg.desktop },
     xl: { value: tokens23__namespace.default.size.font.xl.desktop },
     xxl: { value: tokens23__namespace.default.size.font.xxl.desktop }
@@ -10675,6 +10681,18 @@ var textStyles = react.defineTextStyles({
       lineHeight: tokens23__namespace.default.font.style.lg["line-height"]
     }
   },
+  "md-lg": {
+    value: {
+      fontSize: [
+        tokens23__namespace.default.font.style["md-lg"]["font-size"].mobile,
+        null,
+        null,
+        tokens23__namespace.default.font.style["md-lg"]["font-size"].desktop
+      ],
+      fontFamily: tokens23__namespace.default.font.style["md-lg"]["font-family"],
+      lineHeight: tokens23__namespace.default.font.style["md-lg"]["line-height"]
+    }
+  },
   md: {
     value: {
       fontSize: [
@@ -10710,6 +10728,18 @@ var textStyles = react.defineTextStyles({
       fontFamily: tokens23__namespace.default.font.style.xs["font-family"],
       lineHeight: tokens23__namespace.default.font.style.xs["line-height"]
     }
+  },
+  "2xs": {
+    value: {
+      fontSize: [
+        tokens23__namespace.default.font.style["2xs"]["font-size"].mobile,
+        null,
+        null,
+        tokens23__namespace.default.font.style["2xs"]["font-size"].desktop
+      ],
+      fontFamily: tokens23__namespace.default.font.style["2xs"]["font-family"],
+      lineHeight: tokens23__namespace.default.font.style["2xs"]["line-height"]
+    }
   }
 });
 var generateTheme = (brand) => {