@vygruppen/spor-react 12.10.2 → 12.10.4

package/dist/index.d.cts

@@ -895,6 +895,7 @@ declare const DrawerCloseTrigger: React$1.ForwardRefExoticComponent<Drawer$1.Clo
 declare const DrawerBackTrigger: React$1.ForwardRefExoticComponent<Drawer$1.CloseTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
 declare const DrawerFullScreenHeader: React$1.ForwardRefExoticComponent<Drawer$1.HeaderProps & {
     backTrigger?: boolean;
+    closeTrigger?: boolean;
     title?: string;
 } & React$1.RefAttributes<HTMLDivElement>>;
 declare const Drawer: (props: DrawerProps) => react_jsx_runtime.JSX.Element;
@@ -2114,6 +2115,12 @@ declare const lineIconSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon" |
             title: {
                 color: "text";
             };
+            iconContainer: {
+                backgroundColor: "none";
+            };
+            icon: {
+                color: "text";
+            };
         };
         custom: {
             iconContainer: {};
@@ -2263,7 +2270,7 @@ declare const travelTagSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon"
         walk: {
             textContainer: {
                 position: "absolute";
-                left: "1.3rem";
+                left: "0.875rem";
                 bottom: number;
             };
             title: {

package/dist/index.d.ts

@@ -895,6 +895,7 @@ declare const DrawerCloseTrigger: React$1.ForwardRefExoticComponent<Drawer$1.Clo
 declare const DrawerBackTrigger: React$1.ForwardRefExoticComponent<Drawer$1.CloseTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
 declare const DrawerFullScreenHeader: React$1.ForwardRefExoticComponent<Drawer$1.HeaderProps & {
     backTrigger?: boolean;
+    closeTrigger?: boolean;
     title?: string;
 } & React$1.RefAttributes<HTMLDivElement>>;
 declare const Drawer: (props: DrawerProps) => react_jsx_runtime.JSX.Element;
@@ -2114,6 +2115,12 @@ declare const lineIconSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon" |
             title: {
                 color: "text";
             };
+            iconContainer: {
+                backgroundColor: "none";
+            };
+            icon: {
+                color: "text";
+            };
         };
         custom: {
             iconContainer: {};
@@ -2263,7 +2270,7 @@ declare const travelTagSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"icon"
         walk: {
             textContainer: {
                 position: "absolute";
-                left: "1.3rem";
+                left: "0.875rem";
                 bottom: number;
             };
             title: {

package/dist/index.mjs

@@ -1062,6 +1062,7 @@ var Alert = forwardRef((props, ref) => {
       children && /* @__PURE__ */ jsx(
         Alert$1.Description,
         {
+          width: "100%",
           paddingLeft: title ? 0.5 : 0,
           paddingRight: closable ? 6 : 0,
           children
@@ -2146,9 +2147,16 @@ var TimeField = ({ state, ...props }) => {
         style: {
           marginBottom: 0,
           fontSize: "mobile.xs",
+          top: 0,
           cursor: "text",
+          left: "50%",
+          transform: "translateX(-50%)",
           position: "absolute",
-          paddingTop: "2px"
+          paddingTop: "2px",
+          whiteSpace: "nowrap",
+          overflow: "hidden",
+          textOverflow: "ellipsis",
+          maxWidth: "80%"
         },
         children: props.label
       }
@@ -2235,6 +2243,7 @@ var TimePicker = ({
       "aria-disabled": isDisabled,
       "aria-live": "assertive",
       "aria-label": ariaLabel,
+      position: "relative",
       ...boxProps,
       children: [
         /* @__PURE__ */ jsx(
@@ -2248,7 +2257,8 @@ var TimePicker = ({
             icon: /* @__PURE__ */ jsx(DropdownLeftFill18Icon, {}),
             onClick: handleBackwardsClick,
             disabled: isDisabled,
-            style: isDisabled ? { backgroundColor: "transparent" } : {}
+            style: isDisabled ? { backgroundColor: "transparent" } : {},
+            zIndex: 1
           }
         ),
         /* @__PURE__ */ jsx(TimeField, { label, state, name }),
@@ -2263,7 +2273,8 @@ var TimePicker = ({
             icon: /* @__PURE__ */ jsx(DropdownRightFill18Icon, {}),
             onClick: handleForwardClick,
             disabled: isDisabled,
-            style: isDisabled ? { backgroundColor: "transparent" } : {}
+            style: isDisabled ? { backgroundColor: "transparent" } : {},
+            zIndex: 1
           }
         )
       ]
@@ -2382,11 +2393,11 @@ var DrawerBackTrigger = forwardRef((props, ref) => {
 });
 DrawerBackTrigger.displayName = "DrawerBackTrigger";
 var DrawerFullScreenHeader = forwardRef((props, ref) => {
-  const { backTrigger = true, title } = props;
+  const { backTrigger = true, closeTrigger = true, title } = props;
   return /* @__PURE__ */ jsx(Drawer$1.Header, { ...props, ref, asChild: true, children: /* @__PURE__ */ jsxs(Grid, { templateColumns: "1fr auto 1fr", height: "auto", paddingX: "8", children: [
     /* @__PURE__ */ jsx(GridItem, { width: "full", alignSelf: "center", children: backTrigger && /* @__PURE__ */ jsx(DrawerBackTrigger, {}) }),
     /* @__PURE__ */ jsx(GridItem, { width: "full", alignSelf: "end", asChild: true, children: title && /* @__PURE__ */ jsx(DrawerTitle, { children: title }) }),
-    /* @__PURE__ */ jsx(GridItem, { width: "full", alignSelf: "end", children: /* @__PURE__ */ jsx(DrawerCloseTrigger, { justifySelf: "end", top: "0" }) })
+    closeTrigger && /* @__PURE__ */ jsx(GridItem, { width: "full", alignSelf: "end", children: /* @__PURE__ */ jsx(DrawerCloseTrigger, { justifySelf: "end", top: "0" }) })
   ] }) });
 });
 DrawerFullScreenHeader.displayName = "DrawerFullScreenHeader";
@@ -3687,16 +3698,9 @@ var PressableCard = forwardRef(
 PressableCard.displayName = "PressableCard";
 var RadioCard = forwardRef(
   (props, ref) => {
-    const { inputProps, children, value, ariaLabel } = props;
+    const { inputProps, children } = props;
     return /* @__PURE__ */ jsxs(RadioCard$1.Item, { ...props, children: [
-      /* @__PURE__ */ jsx(
-        RadioCard$1.ItemHiddenInput,
-        {
-          "aria-label": ariaLabel ?? value,
-          ref,
-          ...inputProps
-        }
-      ),
+      /* @__PURE__ */ jsx(RadioCard$1.ItemHiddenInput, { ref, ...inputProps }),
       /* @__PURE__ */ jsx(RadioCard$1.ItemControl, { children })
     ] });
   }
@@ -3838,7 +3842,7 @@ var LineIcon = forwardRef(
       return target === "travelTag" ? 0.5 : 1;
     };
     const borderContainer = () => {
-      return variant === "walk" && target === "travelTag" ? 0 : 0.5;
+      return variant === "walk" && target === "travelTag" ? 0 : "1px";
     };
     const Icon3 = getCorrectIcon({
       variant: (
@@ -3983,18 +3987,42 @@ var TextLink = forwardRef(
     const isExternal = external ?? Boolean((href == null ? void 0 : href.startsWith("http://")) || (href == null ? void 0 : href.startsWith("https://")));
     const externalLabel = t ? t(texts18.externalLink) : texts18.externalLink.en;
     if (props.asChild && isValidElement(children)) {
-      return /* @__PURE__ */ jsx(Link, { href, ...props, ref, children: cloneElement(children, {
-        ...children.props,
-        children: /* @__PURE__ */ jsxs(Fragment, { children: [
-          children.props.children,
-          isExternal && /* @__PURE__ */ jsx(ExternalIcon, { label: externalLabel, size: props.size })
-        ] })
-      }) });
+      return /* @__PURE__ */ jsx(
+        Link,
+        {
+          href,
+          ...props,
+          ref,
+          ...isExternal && {
+            target: "_blank",
+            rel: "noopener noreferrer"
+          },
+          children: cloneElement(children, {
+            ...children.props,
+            children: /* @__PURE__ */ jsxs(Fragment, { children: [
+              children.props.children,
+              isExternal && /* @__PURE__ */ jsx(ExternalIcon, { label: externalLabel, size: props.size })
+            ] })
+          })
+        }
+      );
     }
-    return /* @__PURE__ */ jsxs(Link, { href, ...props, ref, children: [
-      children,
-      isExternal && /* @__PURE__ */ jsx(ExternalIcon, { label: externalLabel, size: props.size })
-    ] });
+    return /* @__PURE__ */ jsxs(
+      Link,
+      {
+        href,
+        ...props,
+        ref,
+        ...isExternal && {
+          target: "_blank",
+          rel: "noopener noreferrer"
+        },
+        children: [
+          children,
+          isExternal && /* @__PURE__ */ jsx(ExternalIcon, { label: externalLabel, size: props.size })
+        ]
+      }
+    );
   }
 );
 TextLink.displayName = "TextLink";
@@ -7485,7 +7513,7 @@ var drawerSlotRecipe = defineSlotRecipe({
       maxHeight: "100dvh",
       color: "inherit",
       boxShadow: "lg",
-      minHeight: ["50vh", null, null, "auto"],
+      minHeight: ["10rem", null, null, "auto"],
       _open: {
         animationDuration: "slowest",
         animationTimingFunction: "ease-in-smooth"
@@ -7499,16 +7527,16 @@ var drawerSlotRecipe = defineSlotRecipe({
       display: "flex",
       alignItems: "center",
       justifyContent: "space-between",
-      paddingX: "5",
+      paddingX: ["3", null, null, "5"],
       paddingBottom: "1"
     },
     body: {
-      paddingX: "5",
+      paddingX: ["3", null, null, "5"],
       paddingY: ["1", null, null, "2"],
       flex: "1",
       overflow: "auto",
       fontSize: ["xs", null, null, "sm"],
-      minHeight: ["12", null, null, "auto"]
+      minHeight: ["2", null, null, "auto"]
     },
     footer: {
       display: "flex",
@@ -7525,8 +7553,8 @@ var drawerSlotRecipe = defineSlotRecipe({
     },
     closeTrigger: {
       position: "absolute",
-      top: "2",
-      insetEnd: "2"
+      top: "0",
+      right: "0"
     }
   },
   variants: {
@@ -7952,7 +7980,7 @@ var travelTagSlotRecipe = defineSlotRecipe({
       walk: {
         textContainer: {
           position: "absolute",
-          left: "1.3rem",
+          left: "0.875rem",
           bottom: 0
         },
         title: {
@@ -8150,6 +8178,12 @@ var lineIconSlotRecipe = defineSlotRecipe({
       walk: {
         title: {
           color: "text"
+        },
+        iconContainer: {
+          backgroundColor: "none"
+        },
+        icon: {
+          color: "text"
         }
       },
       custom: {