@biblioteksentralen/react 4.0.0-beta.0 → 4.0.0-beta.1

package/dist/chunk-5GJBW3WE.mjs

@@ -1,229 +1,270 @@
 "use client";
-import {
-  colors
-} from "./chunk-BN5W6FVN.mjs";
-
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+var _defaultConfig_theme_recipes_button_variants, _defaultConfig_theme_recipes_button, _defaultConfig_theme_recipes, _defaultConfig_theme;
+import { colors } from "./chunk-BN5W6FVN.mjs";
 // src/styles/chakraTheme/biblioteksentralenChakraTheme.ts
 import { defineConfig, defineTokens } from "@chakra-ui/react";
-
 // src/styles/chakraTheme/ButtonStyles.ts
 import { defaultConfig, defineRecipe } from "@chakra-ui/react";
-var variants = {
-  primary: {
-    backgroundColor: colors.black,
-    color: "white",
-    _hover: {
-      backgroundColor: "hsla(0deg, 0%, 70%, 1)",
-      color: "black"
-    }
-  },
-  secondary: {
-    borderColor: "currentColor",
-    color: "currentColor",
-    backgroundColor: "transparent",
-    _hover: {
-      backgroundColor: "currentColor/7"
-    }
-  },
-  tertiary: {
-    color: "currentColor",
-    backgroundColor: "transparent",
-    _hover: {
-      backgroundColor: "currentColor/7"
+var variants = _object_spread({
+    primary: {
+        backgroundColor: colors.black,
+        color: "white",
+        _hover: {
+            backgroundColor: "hsla(0deg, 0%, 70%, 1)",
+            color: "black"
+        }
+    },
+    secondary: {
+        borderColor: "currentColor",
+        color: "currentColor",
+        backgroundColor: "transparent",
+        _hover: {
+            backgroundColor: "currentColor/7"
+        }
+    },
+    tertiary: {
+        color: "currentColor",
+        backgroundColor: "transparent",
+        _hover: {
+            backgroundColor: "currentColor/7"
+        }
     }
-  },
-  // Inherit variants from Chakra's default config. Seems like they are overridden by our custom variants by default.
-  ...defaultConfig.theme?.recipes?.button?.variants?.variant
-};
+}, (_defaultConfig_theme = defaultConfig.theme) === null || _defaultConfig_theme === void 0 ? void 0 : (_defaultConfig_theme_recipes = _defaultConfig_theme.recipes) === null || _defaultConfig_theme_recipes === void 0 ? void 0 : (_defaultConfig_theme_recipes_button = _defaultConfig_theme_recipes.button) === null || _defaultConfig_theme_recipes_button === void 0 ? void 0 : (_defaultConfig_theme_recipes_button_variants = _defaultConfig_theme_recipes_button.variants) === null || _defaultConfig_theme_recipes_button_variants === void 0 ? void 0 : _defaultConfig_theme_recipes_button_variants.variant);
 var ButtonStyles = defineRecipe({
-  base: {
-    borderColor: "transparent",
-    borderWidth: "0.1em",
-    fontWeight: 600,
-    _disabled: {
-      backgroundColor: `${colors.grey45}`,
-      color: "white",
-      opacity: 1
-    }
-  },
-  variants: {
-    variant: variants,
-    size: {
-      sm: {
-        h: "8",
-        px: "2",
-        textStyle: "md"
-      },
-      md: {
-        textStyle: "md"
-      },
-      lg: {
-        h: "12",
-        textStyle: "lg"
-      }
+    base: {
+        borderColor: "transparent",
+        borderWidth: "0.1em",
+        fontWeight: 600,
+        _disabled: {
+            backgroundColor: "".concat(colors.grey45),
+            color: "white",
+            opacity: 1
+        }
+    },
+    variants: {
+        variant: variants,
+        size: {
+            sm: {
+                h: "8",
+                px: "2",
+                textStyle: "md"
+            },
+            md: {
+                textStyle: "md"
+            },
+            lg: {
+                h: "12",
+                textStyle: "lg"
+            }
+        }
+    },
+    defaultVariants: {
+        variant: "primary",
+        size: "md"
     }
-  },
-  defaultVariants: {
-    variant: "primary",
-    size: "md"
-  }
 });
-
 // src/styles/chakraTheme/ContainerStyles.ts
 import { defineRecipe as defineRecipe2 } from "@chakra-ui/react";
 var ContainerStyles = defineRecipe2({
-  base: {
-    px: ".75rem"
-    // Padding left/right
-  }
+    base: {
+        px: ".75rem"
+    }
 });
-
 // src/styles/chakraTheme/HeadingStyles.ts
 import { defineRecipe as defineRecipe3 } from "@chakra-ui/react";
 var HeadingStyles = defineRecipe3({
-  base: {
-    fontWeight: "600"
-  }
+    base: {
+        fontWeight: "600"
+    }
 });
-
 // src/styles/chakraTheme/InputStyles.ts
 import { defineRecipe as defineRecipe4 } from "@chakra-ui/react";
 var variants2 = {
-  subtle: {
-    backgroundColor: { _light: "gray.200", _dark: "whiteAlpha.100" },
-    _hover: {
-      bg: { _light: "gray.300", _dark: "whiteAlpha.200" }
-    }
-  },
-  outline: {
-    borderColor: { _light: "gray.300", _dark: "whiteAlpha.300" },
-    _hover: {
-      borderColor: { _light: "gray.400", _dark: "whiteAlpha.400" }
-    }
-  },
-  flushed: {
-    borderColor: { _light: "gray.300", _dark: "whiteAlpha.300" },
-    _hover: {
-      borderColor: { _light: "gray.400", _dark: "whiteAlpha.400" }
+    subtle: {
+        backgroundColor: {
+            _light: "gray.200",
+            _dark: "whiteAlpha.100"
+        },
+        _hover: {
+            bg: {
+                _light: "gray.300",
+                _dark: "whiteAlpha.200"
+            }
+        }
+    },
+    outline: {
+        borderColor: {
+            _light: "gray.300",
+            _dark: "whiteAlpha.300"
+        },
+        _hover: {
+            borderColor: {
+                _light: "gray.400",
+                _dark: "whiteAlpha.400"
+            }
+        }
+    },
+    flushed: {
+        borderColor: {
+            _light: "gray.300",
+            _dark: "whiteAlpha.300"
+        },
+        _hover: {
+            borderColor: {
+                _light: "gray.400",
+                _dark: "whiteAlpha.400"
+            }
+        }
     }
-  }
 };
 var InputStyles = defineRecipe4({
-  base: {
-    _placeholder: {
-      color: { _light: "gray.500", _dark: "whiteAlpha.500" }
+    base: {
+        _placeholder: {
+            color: {
+                _light: "gray.500",
+                _dark: "whiteAlpha.500"
+            }
+        }
+    },
+    variants: {
+        variant: variants2
+    },
+    defaultVariants: {
+        variant: "subtle"
     }
-  },
-  variants: {
-    variant: variants2
-  },
-  defaultVariants: {
-    variant: "subtle"
-  }
 });
-
 // src/styles/chakraTheme/SpinnerStyles.ts
 import { defineRecipe as defineRecipe5 } from "@chakra-ui/react";
 var SpinnerStyles = defineRecipe5({
-  base: {
-    animationDuration: ".8s",
-    color: colors.accentBlueMedium,
-    // Todo: Legg til trackColor: https://chakra-ui.com/docs/components/spinner#track-color
-    borderWidth: ".175em"
-  }
+    base: {
+        animationDuration: ".8s",
+        color: colors.accentBlueMedium,
+        // Todo: Legg til trackColor: https://chakra-ui.com/docs/components/spinner#track-color
+        borderWidth: ".175em"
+    }
 });
-
 // src/styles/chakraTheme/sizes.ts
 var container = {
-  sm: { value: "40rem" },
-  md: { value: "48rem" },
-  lg: { value: "56rem" },
-  // Forsøker 56rem som standardbredde etter testing med Katrine
-  xl: { value: "80rem" }
+    sm: {
+        value: "40rem"
+    },
+    md: {
+        value: "48rem"
+    },
+    lg: {
+        value: "56rem"
+    },
+    // Forsøker 56rem som standardbredde etter testing med Katrine
+    xl: {
+        value: "80rem"
+    }
 };
 var sizes = {
-  container
+    container: container
 };
-
 // src/styles/chakraTheme/LinkStyles.ts
 import { defineRecipe as defineRecipe6 } from "@chakra-ui/react";
 var variants3 = {
-  plain: {
-    color: "currentColor",
-    textDecoration: "none",
-    textDecorationColor: "currentColor",
-    _hover: {
-      textDecorationColor: "currentColor",
-      textDecoration: "underline"
-    }
-  },
-  underline: {
-    color: "currentColor",
-    textDecoration: "underline",
-    textDecorationColor: "currentColor",
-    _hover: {
-      textDecoration: "none"
+    plain: {
+        color: "currentColor",
+        textDecoration: "none",
+        textDecorationColor: "currentColor",
+        _hover: {
+            textDecorationColor: "currentColor",
+            textDecoration: "underline"
+        }
+    },
+    underline: {
+        color: "currentColor",
+        textDecoration: "underline",
+        textDecorationColor: "currentColor",
+        _hover: {
+            textDecoration: "none"
+        }
     }
-  }
 };
 var LinkStyles = defineRecipe6({
-  base: {
-    _focus: {
-      outline: "none"
+    base: {
+        _focus: {
+            outline: "none"
+        }
+    },
+    variants: {
+        variant: variants3
+    },
+    defaultVariants: {
+        variant: "underline"
     }
-  },
-  variants: {
-    variant: variants3
-  },
-  defaultVariants: {
-    variant: "underline"
-  }
 });
-
 // src/styles/chakraTheme/biblioteksentralenChakraTheme.ts
 var tokens = defineTokens({
-  sizes
+    sizes: sizes
 });
 var globalHyphens = {
-  hyphens: "auto",
-  hyphenateLimitChars: "8 5 3"
-  // minimum word-length / min letters first line / min letters second line
+    hyphens: "auto",
+    hyphenateLimitChars: "8 5 3"
 };
 var focusStyle = {
-  outline: "none !important",
-  boxShadow: `0 0 0 .05rem ${colors.white}, 0 0 0 .25rem ${colors.accentBlueMedium}, 0 0 0 .3rem ${colors.white} !important`,
-  transition: "box-shadow 0.1s ease-out"
-  // Transition makes the newly focused element "pop in" and easier to spot
+    outline: "none !important",
+    boxShadow: "0 0 0 .05rem ".concat(colors.white, ", 0 0 0 .25rem ").concat(colors.accentBlueMedium, ", 0 0 0 .3rem ").concat(colors.white, " !important"),
+    transition: "box-shadow 0.1s ease-out"
 };
 var biblioteksentralenChakraTheme = defineConfig({
-  theme: {
-    tokens,
-    recipes: {
-      heading: HeadingStyles,
-      button: ButtonStyles,
-      input: InputStyles,
-      link: LinkStyles,
-      container: ContainerStyles,
-      spinner: SpinnerStyles
-    }
-  },
-  globalCss: {
-    html: {
-      fontSize: { base: "112.5%", md: "120%" },
-      // Sørger for smooth scrolling for interne lenker som scroller til annet sted på siden,
-      // men ikke hvis fokus er utenfor viduet, feks ved søk i tekst (ctrl + f)
-      "&:focus-within": { scrollBehavior: "smooth !important" }
+    theme: {
+        tokens: tokens,
+        recipes: {
+            heading: HeadingStyles,
+            button: ButtonStyles,
+            input: InputStyles,
+            link: LinkStyles,
+            container: ContainerStyles,
+            spinner: SpinnerStyles
+        }
     },
-    body: {
-      ...globalHyphens
-    },
-    // Felles fokus-styling for alle elementer for å sikre at de har en tydelig og uniform visuell indikasjon når de er i fokus
-    "*:focus-visible": focusStyle
-  }
+    globalCss: {
+        html: {
+            fontSize: {
+                base: "112.5%",
+                md: "120%"
+            },
+            // Sørger for smooth scrolling for interne lenker som scroller til annet sted på siden,
+            // men ikke hvis fokus er utenfor viduet, feks ved søk i tekst (ctrl + f)
+            "&:focus-within": {
+                scrollBehavior: "smooth !important"
+            }
+        },
+        body: _object_spread({}, globalHyphens),
+        // Felles fokus-styling for alle elementer for å sikre at de har en tydelig og uniform visuell indikasjon når de er i fokus
+        "*:focus-visible": focusStyle
+    }
 });
-
-export {
-  focusStyle,
-  biblioteksentralenChakraTheme
-};
+export { focusStyle, biblioteksentralenChakraTheme };
 //# sourceMappingURL=chunk-5GJBW3WE.mjs.map

package/dist/chunk-5GJBW3WE.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/styles/chakraTheme/biblioteksentralenChakraTheme.ts","../src/styles/chakraTheme/ButtonStyles.ts","../src/styles/chakraTheme/ContainerStyles.ts","../src/styles/chakraTheme/HeadingStyles.ts","../src/styles/chakraTheme/InputStyles.ts","../src/styles/chakraTheme/SpinnerStyles.ts","../src/styles/chakraTheme/sizes.ts","../src/styles/chakraTheme/LinkStyles.ts"],"sourcesContent":["import { defineConfig, defineTokens } from \"@chakra-ui/react\";\nimport { ButtonStyles } from \"./ButtonStyles\";\nimport { ContainerStyles } from \"./ContainerStyles\";\nimport { HeadingStyles } from \"./HeadingStyles\";\nimport { InputStyles } from \"./InputStyles\";\nimport { SpinnerStyles } from \"./SpinnerStyles\";\nimport { sizes } from \"./sizes\";\nimport { LinkStyles } from \"./LinkStyles\";\nimport { colors } from \"@biblioteksentralen/utils\";\n\nconst tokens = defineTokens({\n  sizes,\n});\n\n// https://blog.logrocket.com/guide-css-word-wrap-overflow-wrap-word-break/\n// https://medium.com/clear-left-thinking/all-you-need-to-know-about-hyphenation-in-css-2baee2d89179\n// Skrur på hyphens auto som default fordi vi har masse mikrotekster og små elementer der layout knekker uten dette, og vi lager stadig nye og glemmer å ta hensyn til dette.\n// Så kan man optionaly sette hyphens: none de stedene man ikke ønsker det, men har ikke sett noe som knekker/blir rart pga dette enda\nconst globalHyphens = {\n  hyphens: \"auto\",\n  hyphenateLimitChars: \"8 5 3\", // minimum word-length / min letters first line / min letters second line\n};\n\nexport const focusStyle = {\n  outline: \"none !important\",\n  boxShadow: `0 0 0 .05rem ${colors.white}, 0 0 0 .25rem ${colors.accentBlueMedium}, 0 0 0 .3rem ${colors.white} !important`,\n  transition: \"box-shadow 0.1s ease-out\", // Transition makes the newly focused element \"pop in\" and easier to spot\n};\n\nexport const biblioteksentralenChakraTheme = defineConfig({\n  theme: {\n    tokens,\n    recipes: {\n      heading: HeadingStyles,\n      button: ButtonStyles,\n      input: InputStyles,\n      link: LinkStyles,\n      container: ContainerStyles,\n      spinner: SpinnerStyles,\n    },\n  },\n  globalCss: {\n    html: {\n      fontSize: { base: \"112.5%\", md: \"120%\" },\n      // Sørger for smooth scrolling for interne lenker som scroller til annet sted på siden,\n      // men ikke hvis fokus er utenfor viduet, feks ved søk i tekst (ctrl + f)\n      \"&:focus-within\": { scrollBehavior: \"smooth !important\" },\n    },\n    body: {\n      ...globalHyphens,\n    },\n    // Felles fokus-styling for alle elementer for å sikre at de har en tydelig og uniform visuell indikasjon når de er i fokus\n    \"*:focus-visible\": focusStyle,\n  },\n});\n","import { colors } from \"@biblioteksentralen/utils\";\nimport { defaultConfig, defineRecipe, SystemStyleObject } from \"@chakra-ui/react\";\n\nexport type CustomButtonVariants = \"primary\" | \"secondary\" | \"tertiary\";\n\nconst variants: Record<CustomButtonVariants, SystemStyleObject> = {\n  primary: {\n    backgroundColor: colors.black,\n    color: \"white\",\n    _hover: {\n      backgroundColor: \"hsla(0deg, 0%, 70%, 1)\",\n      color: \"black\",\n    },\n  },\n  secondary: {\n    borderColor: \"currentColor\",\n    color: \"currentColor\",\n    backgroundColor: \"transparent\",\n    _hover: {\n      backgroundColor: \"currentColor/7\",\n    },\n  },\n  tertiary: {\n    color: \"currentColor\",\n    backgroundColor: \"transparent\",\n    _hover: {\n      backgroundColor: \"currentColor/7\",\n    },\n  },\n  // Inherit variants from Chakra's default config. Seems like they are overridden by our custom variants by default.\n  ...defaultConfig.theme?.recipes?.button?.variants?.variant,\n};\n\nexport const ButtonStyles = defineRecipe({\n  base: {\n    borderColor: \"transparent\",\n    borderWidth: \"0.1em\",\n    fontWeight: 600,\n    _disabled: {\n      backgroundColor: `${colors.grey45}`,\n      color: \"white\",\n      opacity: 1,\n    },\n  },\n  variants: {\n    variant: variants,\n    size: {\n      sm: {\n        h: \"8\",\n        px: \"2\",\n        textStyle: \"md\",\n      },\n      md: {\n        textStyle: \"md\",\n      },\n      lg: {\n        h: \"12\",\n        textStyle: \"lg\",\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"primary\",\n    size: \"md\",\n  },\n});\n","import { defineRecipe } from \"@chakra-ui/react\";\n\nexport const ContainerStyles = defineRecipe({\n  base: {\n    px: \".75rem\", // Padding left/right\n  },\n});\n","import { defineRecipe } from \"@chakra-ui/react\";\n\nexport const HeadingStyles = defineRecipe({\n  base: {\n    fontWeight: \"600\",\n  },\n});\n","import { defineRecipe, SystemStyleObject } from \"@chakra-ui/react\";\n\nconst variants: Record<string, SystemStyleObject> = {\n  subtle: {\n    backgroundColor: { _light: \"gray.200\", _dark: \"whiteAlpha.100\" },\n    _hover: {\n      bg: { _light: \"gray.300\", _dark: \"whiteAlpha.200\" },\n    },\n  },\n  outline: {\n    borderColor: { _light: \"gray.300\", _dark: \"whiteAlpha.300\" },\n    _hover: {\n      borderColor: { _light: \"gray.400\", _dark: \"whiteAlpha.400\" },\n    },\n  },\n  flushed: {\n    borderColor: { _light: \"gray.300\", _dark: \"whiteAlpha.300\" },\n    _hover: {\n      borderColor: { _light: \"gray.400\", _dark: \"whiteAlpha.400\" },\n    },\n  },\n};\n\nexport const InputStyles = defineRecipe({\n  base: {\n    _placeholder: {\n      color: { _light: \"gray.500\", _dark: \"whiteAlpha.500\" },\n    },\n  },\n  variants: {\n    variant: variants,\n  },\n  defaultVariants: {\n    variant: \"subtle\",\n  },\n});\n","import { colors } from \"@biblioteksentralen/utils\";\nimport { defineRecipe } from \"@chakra-ui/react\";\n\nexport const SpinnerStyles = defineRecipe({\n  base: {\n    animationDuration: \".8s\",\n    color: colors.accentBlueMedium,\n    // Todo: Legg til trackColor: https://chakra-ui.com/docs/components/spinner#track-color\n    borderWidth: \".175em\",\n  },\n});\n","const container = {\n  sm: { value: \"40rem\" },\n  md: { value: \"48rem\" },\n  lg: { value: \"56rem\" }, // Forsøker 56rem som standardbredde etter testing med Katrine\n  xl: { value: \"80rem\" },\n};\n\nexport const sizes = {\n  container,\n};\n","import { defineRecipe, SystemStyleObject } from \"@chakra-ui/react\";\n\nexport type CustomLinkVariants = \"plain\" | \"underline\";\n\nconst variants: Record<CustomLinkVariants, SystemStyleObject> = {\n  plain: {\n    color: \"currentColor\",\n    textDecoration: \"none\",\n    textDecorationColor: \"currentColor\",\n    _hover: {\n      textDecorationColor: \"currentColor\",\n      textDecoration: \"underline\",\n    },\n  },\n  underline: {\n    color: \"currentColor\",\n    textDecoration: \"underline\",\n    textDecorationColor: \"currentColor\",\n    _hover: {\n      textDecoration: \"none\",\n    },\n  },\n};\n\nexport const LinkStyles = defineRecipe({\n  base: {\n    _focus: {\n      outline: \"none\",\n    },\n  },\n  variants: {\n    variant: variants,\n  },\n  defaultVariants: {\n    variant: \"underline\",\n  },\n});\n"],"mappings":"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","names":["defineRecipe","defineRecipe","defineRecipe","variants","defineRecipe","defineRecipe","variants"]}
+{"version":3,"sources":["/Users/danielwinsvold/Code/js-utils/packages/react/dist/chunk-5GJBW3WE.mjs","../src/styles/chakraTheme/ButtonStyles.ts","../src/styles/chakraTheme/biblioteksentralenChakraTheme.ts","../src/styles/chakraTheme/ContainerStyles.ts","../src/styles/chakraTheme/HeadingStyles.ts","../src/styles/chakraTheme/InputStyles.ts","../src/styles/chakraTheme/SpinnerStyles.ts","../src/styles/chakraTheme/sizes.ts","../src/styles/chakraTheme/LinkStyles.ts"],"names":["defaultConfig","colors","defineConfig","defineTokens","defineRecipe","variants","primary","backgroundColor","black","color","_hover","secondary","borderColor","tertiary","theme","recipes","button","variant","ButtonStyles","base","borderWidth","fontWeight","_disabled","grey45","opacity","size","sm","h","px","textStyle","md","lg","defaultVariants","ContainerStyles","HeadingStyles","subtle","_light","_dark","bg","outline","flushed","InputStyles","_placeholder","SpinnerStyles","animationDuration","accentBlueMedium","container","value","xl","sizes","plain","textDecoration","textDecorationColor","underline","LinkStyles","_focus","tokens","globalHyphens","hyphens","hyphenateLimitChars","focusStyle","boxShadow","white","transition","biblioteksentralenChakraTheme","heading","input","link","spinner","globalCss","html","fontSize","scrollBehavior","body"],"mappings":"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","sourcesContent":["\"use client\";\nimport {\n  colors\n} from \"./chunk-BN5W6FVN.mjs\";\n\n// src/styles/chakraTheme/biblioteksentralenChakraTheme.ts\nimport { defineConfig, defineTokens } from \"@chakra-ui/react\";\n\n// src/styles/chakraTheme/ButtonStyles.ts\nimport { defaultConfig, defineRecipe } from \"@chakra-ui/react\";\nvar variants = {\n  primary: {\n    backgroundColor: colors.black,\n    color: \"white\",\n    _hover: {\n      backgroundColor: \"hsla(0deg, 0%, 70%, 1)\",\n      color: \"black\"\n    }\n  },\n  secondary: {\n    borderColor: \"currentColor\",\n    color: \"currentColor\",\n    backgroundColor: \"transparent\",\n    _hover: {\n      backgroundColor: \"currentColor/7\"\n    }\n  },\n  tertiary: {\n    color: \"currentColor\",\n    backgroundColor: \"transparent\",\n    _hover: {\n      backgroundColor: \"currentColor/7\"\n    }\n  },\n  // Inherit variants from Chakra's default config. Seems like they are overridden by our custom variants by default.\n  ...defaultConfig.theme?.recipes?.button?.variants?.variant\n};\nvar ButtonStyles = defineRecipe({\n  base: {\n    borderColor: \"transparent\",\n    borderWidth: \"0.1em\",\n    fontWeight: 600,\n    _disabled: {\n      backgroundColor: `${colors.grey45}`,\n      color: \"white\",\n      opacity: 1\n    }\n  },\n  variants: {\n    variant: variants,\n    size: {\n      sm: {\n        h: \"8\",\n        px: \"2\",\n        textStyle: \"md\"\n      },\n      md: {\n        textStyle: \"md\"\n      },\n      lg: {\n        h: \"12\",\n        textStyle: \"lg\"\n      }\n    }\n  },\n  defaultVariants: {\n    variant: \"primary\",\n    size: \"md\"\n  }\n});\n\n// src/styles/chakraTheme/ContainerStyles.ts\nimport { defineRecipe as defineRecipe2 } from \"@chakra-ui/react\";\nvar ContainerStyles = defineRecipe2({\n  base: {\n    px: \".75rem\"\n    // Padding left/right\n  }\n});\n\n// src/styles/chakraTheme/HeadingStyles.ts\nimport { defineRecipe as defineRecipe3 } from \"@chakra-ui/react\";\nvar HeadingStyles = defineRecipe3({\n  base: {\n    fontWeight: \"600\"\n  }\n});\n\n// src/styles/chakraTheme/InputStyles.ts\nimport { defineRecipe as defineRecipe4 } from \"@chakra-ui/react\";\nvar variants2 = {\n  subtle: {\n    backgroundColor: { _light: \"gray.200\", _dark: \"whiteAlpha.100\" },\n    _hover: {\n      bg: { _light: \"gray.300\", _dark: \"whiteAlpha.200\" }\n    }\n  },\n  outline: {\n    borderColor: { _light: \"gray.300\", _dark: \"whiteAlpha.300\" },\n    _hover: {\n      borderColor: { _light: \"gray.400\", _dark: \"whiteAlpha.400\" }\n    }\n  },\n  flushed: {\n    borderColor: { _light: \"gray.300\", _dark: \"whiteAlpha.300\" },\n    _hover: {\n      borderColor: { _light: \"gray.400\", _dark: \"whiteAlpha.400\" }\n    }\n  }\n};\nvar InputStyles = defineRecipe4({\n  base: {\n    _placeholder: {\n      color: { _light: \"gray.500\", _dark: \"whiteAlpha.500\" }\n    }\n  },\n  variants: {\n    variant: variants2\n  },\n  defaultVariants: {\n    variant: \"subtle\"\n  }\n});\n\n// src/styles/chakraTheme/SpinnerStyles.ts\nimport { defineRecipe as defineRecipe5 } from \"@chakra-ui/react\";\nvar SpinnerStyles = defineRecipe5({\n  base: {\n    animationDuration: \".8s\",\n    color: colors.accentBlueMedium,\n    // Todo: Legg til trackColor: https://chakra-ui.com/docs/components/spinner#track-color\n    borderWidth: \".175em\"\n  }\n});\n\n// src/styles/chakraTheme/sizes.ts\nvar container = {\n  sm: { value: \"40rem\" },\n  md: { value: \"48rem\" },\n  lg: { value: \"56rem\" },\n  // Forsøker 56rem som standardbredde etter testing med Katrine\n  xl: { value: \"80rem\" }\n};\nvar sizes = {\n  container\n};\n\n// src/styles/chakraTheme/LinkStyles.ts\nimport { defineRecipe as defineRecipe6 } from \"@chakra-ui/react\";\nvar variants3 = {\n  plain: {\n    color: \"currentColor\",\n    textDecoration: \"none\",\n    textDecorationColor: \"currentColor\",\n    _hover: {\n      textDecorationColor: \"currentColor\",\n      textDecoration: \"underline\"\n    }\n  },\n  underline: {\n    color: \"currentColor\",\n    textDecoration: \"underline\",\n    textDecorationColor: \"currentColor\",\n    _hover: {\n      textDecoration: \"none\"\n    }\n  }\n};\nvar LinkStyles = defineRecipe6({\n  base: {\n    _focus: {\n      outline: \"none\"\n    }\n  },\n  variants: {\n    variant: variants3\n  },\n  defaultVariants: {\n    variant: \"underline\"\n  }\n});\n\n// src/styles/chakraTheme/biblioteksentralenChakraTheme.ts\nvar tokens = defineTokens({\n  sizes\n});\nvar globalHyphens = {\n  hyphens: \"auto\",\n  hyphenateLimitChars: \"8 5 3\"\n  // minimum word-length / min letters first line / min letters second line\n};\nvar focusStyle = {\n  outline: \"none !important\",\n  boxShadow: `0 0 0 .05rem ${colors.white}, 0 0 0 .25rem ${colors.accentBlueMedium}, 0 0 0 .3rem ${colors.white} !important`,\n  transition: \"box-shadow 0.1s ease-out\"\n  // Transition makes the newly focused element \"pop in\" and easier to spot\n};\nvar biblioteksentralenChakraTheme = defineConfig({\n  theme: {\n    tokens,\n    recipes: {\n      heading: HeadingStyles,\n      button: ButtonStyles,\n      input: InputStyles,\n      link: LinkStyles,\n      container: ContainerStyles,\n      spinner: SpinnerStyles\n    }\n  },\n  globalCss: {\n    html: {\n      fontSize: { base: \"112.5%\", md: \"120%\" },\n      // Sørger for smooth scrolling for interne lenker som scroller til annet sted på siden,\n      // men ikke hvis fokus er utenfor viduet, feks ved søk i tekst (ctrl + f)\n      \"&:focus-within\": { scrollBehavior: \"smooth !important\" }\n    },\n    body: {\n      ...globalHyphens\n    },\n    // Felles fokus-styling for alle elementer for å sikre at de har en tydelig og uniform visuell indikasjon når de er i fokus\n    \"*:focus-visible\": focusStyle\n  }\n});\n\nexport {\n  focusStyle,\n  biblioteksentralenChakraTheme\n};\n","import { colors } from \"@biblioteksentralen/utils\";\nimport { defaultConfig, defineRecipe, SystemStyleObject } from \"@chakra-ui/react\";\n\nexport type CustomButtonVariants = \"primary\" | \"secondary\" | \"tertiary\";\n\nconst variants: Record<CustomButtonVariants, SystemStyleObject> = {\n  primary: {\n    backgroundColor: colors.black,\n    color: \"white\",\n    _hover: {\n      backgroundColor: \"hsla(0deg, 0%, 70%, 1)\",\n      color: \"black\",\n    },\n  },\n  secondary: {\n    borderColor: \"currentColor\",\n    color: \"currentColor\",\n    backgroundColor: \"transparent\",\n    _hover: {\n      backgroundColor: \"currentColor/7\",\n    },\n  },\n  tertiary: {\n    color: \"currentColor\",\n    backgroundColor: \"transparent\",\n    _hover: {\n      backgroundColor: \"currentColor/7\",\n    },\n  },\n  // Inherit variants from Chakra's default config. Seems like they are overridden by our custom variants by default.\n  ...defaultConfig.theme?.recipes?.button?.variants?.variant,\n};\n\nexport const ButtonStyles = defineRecipe({\n  base: {\n    borderColor: \"transparent\",\n    borderWidth: \"0.1em\",\n    fontWeight: 600,\n    _disabled: {\n      backgroundColor: `${colors.grey45}`,\n      color: \"white\",\n      opacity: 1,\n    },\n  },\n  variants: {\n    variant: variants,\n    size: {\n      sm: {\n        h: \"8\",\n        px: \"2\",\n        textStyle: \"md\",\n      },\n      md: {\n        textStyle: \"md\",\n      },\n      lg: {\n        h: \"12\",\n        textStyle: \"lg\",\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"primary\",\n    size: \"md\",\n  },\n});\n","import { defineConfig, defineTokens } from \"@chakra-ui/react\";\nimport { ButtonStyles } from \"./ButtonStyles\";\nimport { ContainerStyles } from \"./ContainerStyles\";\nimport { HeadingStyles } from \"./HeadingStyles\";\nimport { InputStyles } from \"./InputStyles\";\nimport { SpinnerStyles } from \"./SpinnerStyles\";\nimport { sizes } from \"./sizes\";\nimport { LinkStyles } from \"./LinkStyles\";\nimport { colors } from \"@biblioteksentralen/utils\";\n\nconst tokens = defineTokens({\n  sizes,\n});\n\n// https://blog.logrocket.com/guide-css-word-wrap-overflow-wrap-word-break/\n// https://medium.com/clear-left-thinking/all-you-need-to-know-about-hyphenation-in-css-2baee2d89179\n// Skrur på hyphens auto som default fordi vi har masse mikrotekster og små elementer der layout knekker uten dette, og vi lager stadig nye og glemmer å ta hensyn til dette.\n// Så kan man optionaly sette hyphens: none de stedene man ikke ønsker det, men har ikke sett noe som knekker/blir rart pga dette enda\nconst globalHyphens = {\n  hyphens: \"auto\",\n  hyphenateLimitChars: \"8 5 3\", // minimum word-length / min letters first line / min letters second line\n};\n\nexport const focusStyle = {\n  outline: \"none !important\",\n  boxShadow: `0 0 0 .05rem ${colors.white}, 0 0 0 .25rem ${colors.accentBlueMedium}, 0 0 0 .3rem ${colors.white} !important`,\n  transition: \"box-shadow 0.1s ease-out\", // Transition makes the newly focused element \"pop in\" and easier to spot\n};\n\nexport const biblioteksentralenChakraTheme = defineConfig({\n  theme: {\n    tokens,\n    recipes: {\n      heading: HeadingStyles,\n      button: ButtonStyles,\n      input: InputStyles,\n      link: LinkStyles,\n      container: ContainerStyles,\n      spinner: SpinnerStyles,\n    },\n  },\n  globalCss: {\n    html: {\n      fontSize: { base: \"112.5%\", md: \"120%\" },\n      // Sørger for smooth scrolling for interne lenker som scroller til annet sted på siden,\n      // men ikke hvis fokus er utenfor viduet, feks ved søk i tekst (ctrl + f)\n      \"&:focus-within\": { scrollBehavior: \"smooth !important\" },\n    },\n    body: {\n      ...globalHyphens,\n    },\n    // Felles fokus-styling for alle elementer for å sikre at de har en tydelig og uniform visuell indikasjon når de er i fokus\n    \"*:focus-visible\": focusStyle,\n  },\n});\n","import { defineRecipe } from \"@chakra-ui/react\";\n\nexport const ContainerStyles = defineRecipe({\n  base: {\n    px: \".75rem\", // Padding left/right\n  },\n});\n","import { defineRecipe } from \"@chakra-ui/react\";\n\nexport const HeadingStyles = defineRecipe({\n  base: {\n    fontWeight: \"600\",\n  },\n});\n","import { defineRecipe, SystemStyleObject } from \"@chakra-ui/react\";\n\nconst variants: Record<string, SystemStyleObject> = {\n  subtle: {\n    backgroundColor: { _light: \"gray.200\", _dark: \"whiteAlpha.100\" },\n    _hover: {\n      bg: { _light: \"gray.300\", _dark: \"whiteAlpha.200\" },\n    },\n  },\n  outline: {\n    borderColor: { _light: \"gray.300\", _dark: \"whiteAlpha.300\" },\n    _hover: {\n      borderColor: { _light: \"gray.400\", _dark: \"whiteAlpha.400\" },\n    },\n  },\n  flushed: {\n    borderColor: { _light: \"gray.300\", _dark: \"whiteAlpha.300\" },\n    _hover: {\n      borderColor: { _light: \"gray.400\", _dark: \"whiteAlpha.400\" },\n    },\n  },\n};\n\nexport const InputStyles = defineRecipe({\n  base: {\n    _placeholder: {\n      color: { _light: \"gray.500\", _dark: \"whiteAlpha.500\" },\n    },\n  },\n  variants: {\n    variant: variants,\n  },\n  defaultVariants: {\n    variant: \"subtle\",\n  },\n});\n","import { colors } from \"@biblioteksentralen/utils\";\nimport { defineRecipe } from \"@chakra-ui/react\";\n\nexport const SpinnerStyles = defineRecipe({\n  base: {\n    animationDuration: \".8s\",\n    color: colors.accentBlueMedium,\n    // Todo: Legg til trackColor: https://chakra-ui.com/docs/components/spinner#track-color\n    borderWidth: \".175em\",\n  },\n});\n","const container = {\n  sm: { value: \"40rem\" },\n  md: { value: \"48rem\" },\n  lg: { value: \"56rem\" }, // Forsøker 56rem som standardbredde etter testing med Katrine\n  xl: { value: \"80rem\" },\n};\n\nexport const sizes = {\n  container,\n};\n","import { defineRecipe, SystemStyleObject } from \"@chakra-ui/react\";\n\nexport type CustomLinkVariants = \"plain\" | \"underline\";\n\nconst variants: Record<CustomLinkVariants, SystemStyleObject> = {\n  plain: {\n    color: \"currentColor\",\n    textDecoration: \"none\",\n    textDecorationColor: \"currentColor\",\n    _hover: {\n      textDecorationColor: \"currentColor\",\n      textDecoration: \"underline\",\n    },\n  },\n  underline: {\n    color: \"currentColor\",\n    textDecoration: \"underline\",\n    textDecorationColor: \"currentColor\",\n    _hover: {\n      textDecoration: \"none\",\n    },\n  },\n};\n\nexport const LinkStyles = defineRecipe({\n  base: {\n    _focus: {\n      outline: \"none\",\n    },\n  },\n  variants: {\n    variant: variants,\n  },\n  defaultVariants: {\n    variant: \"underline\",\n  },\n});\n"]}

package/dist/chunk-7MKFY66H.mjs

@@ -1,44 +1,65 @@
 "use client";
-import {
-  focusStyle
-} from "./chunk-5GJBW3WE.mjs";
-
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+import { focusStyle } from "./chunk-5GJBW3WE.mjs";
 // src/components/HashLinkTargetBS.tsx
 import { Box } from "@chakra-ui/react";
 import React from "react";
 var focusOnRelativeParentStyle = {
-  _focusWithin: {
-    position: "static",
-    boxShadow: "none",
-    "&::after": {
-      content: '""',
-      position: "absolute",
-      top: 0,
-      left: 0,
-      height: "100%",
-      width: "100%",
-      pointerEvents: "none",
-      borderRadius: "0.25rem",
-      ...focusStyle
+    _focusWithin: {
+        position: "static",
+        boxShadow: "none",
+        "&::after": _object_spread({
+            content: '""',
+            position: "absolute",
+            top: 0,
+            left: 0,
+            height: "100%",
+            width: "100%",
+            pointerEvents: "none",
+            borderRadius: "0.25rem"
+        }, focusStyle)
     }
-  }
 };
 function HashLinkTargetBS(props) {
-  return /* @__PURE__ */ React.createElement(Box, { position: "relative", css: props.focusOnParent ? focusOnRelativeParentStyle : void 0 }, /* @__PURE__ */ React.createElement(
-    Box,
-    {
-      id: props.id,
-      tabIndex: props.focusOnParent ? -1 : void 0,
-      position: "absolute",
-      top: `-${props.spaceAbove || "2.5rem"}`,
-      _focus: {
-        boxShadow: "none !important"
-      }
-    }
-  ));
+    return /* @__PURE__ */ React.createElement(Box, {
+        position: "relative",
+        css: props.focusOnParent ? focusOnRelativeParentStyle : void 0
+    }, /* @__PURE__ */ React.createElement(Box, {
+        id: props.id,
+        tabIndex: props.focusOnParent ? -1 : void 0,
+        position: "absolute",
+        top: "-".concat(props.spaceAbove || "2.5rem"),
+        _focus: {
+            boxShadow: "none !important"
+        }
+    }));
 }
-
-export {
-  HashLinkTargetBS
-};
+export { HashLinkTargetBS };
 //# sourceMappingURL=chunk-7MKFY66H.mjs.map

package/dist/chunk-7MKFY66H.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/HashLinkTargetBS.tsx"],"sourcesContent":["import { Box } from \"@chakra-ui/react\";\nimport React from \"react\";\nimport { focusStyle } from \"../styles/chakraTheme/biblioteksentralenChakraTheme\";\n\ninterface Props {\n  id: string;\n  /**\n   * angir hvor mye luft til vil ha over HashLinkTarget ved bruk av hash-lenke, eks '4rem'\n   */\n  spaceAbove?: string;\n  /**\n   * angir om du vil ha fokusramme rundt komponenten som mounter HashLinkTarget. Da må komponenten du wrapper med ha position: relative | absolute el\n   */\n  focusOnParent?: boolean;\n}\n\nconst focusOnRelativeParentStyle = {\n  _focusWithin: {\n    position: \"static\",\n    boxShadow: \"none\",\n    \"&::after\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: 0,\n      left: 0,\n      height: \"100%\",\n      width: \"100%\",\n      pointerEvents: \"none\",\n      borderRadius: \"0.25rem\",\n      ...focusStyle,\n    },\n  },\n};\n\n/*\n * Komponent som sørger for luft over anchors (elementer man kan lenke til med hash-lenker feks <a href=\"#min-overskrift\">Ta meg til overskrift</a>)\n */\nexport function HashLinkTargetBS(props: Props) {\n  return (\n    <Box position=\"relative\" css={props.focusOnParent ? focusOnRelativeParentStyle : undefined}>\n      <Box\n        id={props.id}\n        tabIndex={props.focusOnParent ? -1 : undefined}\n        position=\"absolute\"\n        top={`-${props.spaceAbove || \"2.5rem\"}`}\n        _focus={{\n          boxShadow: \"none !important\",\n        }}\n      />\n    </Box>\n  );\n}\n"],"mappings":";;;;;;AAAA,SAAS,WAAW;AACpB,OAAO,WAAW;AAelB,IAAM,6BAA6B;AAAA,EACjC,cAAc;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,MACV,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,eAAe;AAAA,MACf,cAAc;AAAA,MACd,GAAG;AAAA,IACL;AAAA,EACF;AACF;AAKO,SAAS,iBAAiB,OAAc;AAC7C,SACE,oCAAC,OAAI,UAAS,YAAW,KAAK,MAAM,gBAAgB,6BAA6B,UAC/E;AAAA,IAAC;AAAA;AAAA,MACC,IAAI,MAAM;AAAA,MACV,UAAU,MAAM,gBAAgB,KAAK;AAAA,MACrC,UAAS;AAAA,MACT,KAAK,IAAI,MAAM,cAAc,QAAQ;AAAA,MACrC,QAAQ;AAAA,QACN,WAAW;AAAA,MACb;AAAA;AAAA,EACF,CACF;AAEJ;","names":[]}
+{"version":3,"sources":["/Users/danielwinsvold/Code/js-utils/packages/react/dist/chunk-7MKFY66H.mjs","../src/components/HashLinkTargetBS.tsx"],"names":["focusStyle","Box","React","focusOnRelativeParentStyle","_focusWithin","position","boxShadow","content","top","left","height","width","pointerEvents","borderRadius","HashLinkTargetBS","props","createElement","css","focusOnParent","id","tabIndex","spaceAbove","_focus"],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,SACEA,UAAU,QACL,uBAAuB;AAE9B,sCAAsC;ACLtC,SAASC,GAAA,QAAW,mBAAA;AACpB,OAAOC,WAAW,QAAA;AAelB,IAAMC,6BAA6B;IACjCC,cAAc;QACZC,UAAU;QACVC,WAAW;QACX,YAAY;YACVC,SAAS;YACTF,UAAU;YACVG,KAAK;YACLC,MAAM;YACNC,QAAQ;YACRC,OAAO;YACPC,eAAe;YACfC,cAAc;WACXb;IAEP;AACF;AAKO,SAASc,iBAAiBC,KAAA;IAC/B,OACE,aAAA,GAAAb,MAAAc,aAAA,CAACf,KAAA;QAAII,UAAS;QAAWY,KAAKF,MAAMG,aAAA,GAAgBf,6BAA6B,KAAA;IAAA,GAC/E,aAAA,GAAAD,MAAAc,aAAA,CAACf,KAAA;QACCkB,IAAIJ,MAAMI,EAAA;QACVC,UAAUL,MAAMG,aAAA,GAAgB,CAAA,IAAK,KAAA;QACrCb,UAAS;QACTG,KAAK,IAAgC,OAA5BO,MAAMM,UAAA,IAAc;QAC7BC,QAAQ;YACNhB,WAAW;QACb;IAAA;AAIR;ADXA,SACEQ,gBAAgB,GAChB","sourcesContent":["\"use client\";\nimport {\n  focusStyle\n} from \"./chunk-5GJBW3WE.mjs\";\n\n// src/components/HashLinkTargetBS.tsx\nimport { Box } from \"@chakra-ui/react\";\nimport React from \"react\";\nvar focusOnRelativeParentStyle = {\n  _focusWithin: {\n    position: \"static\",\n    boxShadow: \"none\",\n    \"&::after\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: 0,\n      left: 0,\n      height: \"100%\",\n      width: \"100%\",\n      pointerEvents: \"none\",\n      borderRadius: \"0.25rem\",\n      ...focusStyle\n    }\n  }\n};\nfunction HashLinkTargetBS(props) {\n  return /* @__PURE__ */ React.createElement(Box, { position: \"relative\", css: props.focusOnParent ? focusOnRelativeParentStyle : void 0 }, /* @__PURE__ */ React.createElement(\n    Box,\n    {\n      id: props.id,\n      tabIndex: props.focusOnParent ? -1 : void 0,\n      position: \"absolute\",\n      top: `-${props.spaceAbove || \"2.5rem\"}`,\n      _focus: {\n        boxShadow: \"none !important\"\n      }\n    }\n  ));\n}\n\nexport {\n  HashLinkTargetBS\n};\n","import { Box } from \"@chakra-ui/react\";\nimport React from \"react\";\nimport { focusStyle } from \"../styles/chakraTheme/biblioteksentralenChakraTheme\";\n\ninterface Props {\n  id: string;\n  /**\n   * angir hvor mye luft til vil ha over HashLinkTarget ved bruk av hash-lenke, eks '4rem'\n   */\n  spaceAbove?: string;\n  /**\n   * angir om du vil ha fokusramme rundt komponenten som mounter HashLinkTarget. Da må komponenten du wrapper med ha position: relative | absolute el\n   */\n  focusOnParent?: boolean;\n}\n\nconst focusOnRelativeParentStyle = {\n  _focusWithin: {\n    position: \"static\",\n    boxShadow: \"none\",\n    \"&::after\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: 0,\n      left: 0,\n      height: \"100%\",\n      width: \"100%\",\n      pointerEvents: \"none\",\n      borderRadius: \"0.25rem\",\n      ...focusStyle,\n    },\n  },\n};\n\n/*\n * Komponent som sørger for luft over anchors (elementer man kan lenke til med hash-lenker feks <a href=\"#min-overskrift\">Ta meg til overskrift</a>)\n */\nexport function HashLinkTargetBS(props: Props) {\n  return (\n    <Box position=\"relative\" css={props.focusOnParent ? focusOnRelativeParentStyle : undefined}>\n      <Box\n        id={props.id}\n        tabIndex={props.focusOnParent ? -1 : undefined}\n        position=\"absolute\"\n        top={`-${props.spaceAbove || \"2.5rem\"}`}\n        _focus={{\n          boxShadow: \"none !important\",\n        }}\n      />\n    </Box>\n  );\n}\n"]}