@fremtind/jkl-tooltip-react - npm Package Compare versions

Comparing version 1.0.24 to 2.0.0

build/cjs/Tooltip.js

@@ -31,2 +31,3 @@ "use strict";
 var import_react_dom_interactions = require("@floating-ui/react-dom-interactions");
+var import_jkl_icons_react = require("@fremtind/jkl-icons-react");
 var import_jkl_react_hooks = require("@fremtind/jkl-react-hooks");
@@ -39,2 +40,3 @@ var import_classnames = __toESM(require("classnames"));
   const [open, setOpen] = (0, import_react.useState)(false);
+  const [buttonHasFocus, setButtonFocus] = (0, import_react.useState)(false);
   const arrowElement = (0, import_react.useRef)(null);
@@ -69,5 +71,11 @@ const {
       className: "jkl-tooltip__button",
-      ...getReferenceProps({ ref: reference })
+      ...getReferenceProps({
+        ref: reference,
+        onFocus: () => setButtonFocus(true),
+        onBlur: () => setButtonFocus(false),
+        onMouseOver: () => setButtonFocus(true),
+        onMouseLeave: () => setButtonFocus(false)
+      })
     },
-    /* @__PURE__ */ import_react.default.createElement("span", { "aria-hidden": "true" }, "?"),
+    /* @__PURE__ */ import_react.default.createElement(import_jkl_icons_react.QuestionIcon, { bold: buttonHasFocus }),
     /* @__PURE__ */ import_react.default.createElement("span", { className: "jkl-sr-only" }, `${open ? "Skjul" : "Vis"} hjelpetekst`)
@@ -74,0 +82,0 @@ ), /* @__PURE__ */ import_react.default.createElement(import_framer_motion.AnimatePresence, null, open && /* @__PURE__ */ import_react.default.createElement(

build/esm/Tooltip.js

@@ -13,2 +13,3 @@ import {
 } from "@floating-ui/react-dom-interactions";
+import { QuestionIcon } from "@fremtind/jkl-icons-react";
 import { useId } from "@fremtind/jkl-react-hooks";
@@ -21,2 +22,3 @@ import cn from "classnames";
   const [open, setOpen] = useState(false);
+  const [buttonHasFocus, setButtonFocus] = useState(false);
   const arrowElement = useRef(null);
@@ -51,5 +53,11 @@ const {
       className: "jkl-tooltip__button",
-      ...getReferenceProps({ ref: reference })
+      ...getReferenceProps({
+        ref: reference,
+        onFocus: () => setButtonFocus(true),
+        onBlur: () => setButtonFocus(false),
+        onMouseOver: () => setButtonFocus(true),
+        onMouseLeave: () => setButtonFocus(false)
+      })
     },
-    /* @__PURE__ */ React.createElement("span", { "aria-hidden": "true" }, "?"),
+    /* @__PURE__ */ React.createElement(QuestionIcon, { bold: buttonHasFocus }),
     /* @__PURE__ */ React.createElement("span", { className: "jkl-sr-only" }, `${open ? "Skjul" : "Vis"} hjelpetekst`)
@@ -56,0 +64,0 @@ ), /* @__PURE__ */ React.createElement(AnimatePresence, null, open && /* @__PURE__ */ React.createElement(

package.json

 {
     "name": "@fremtind/jkl-tooltip-react",
-    "version": "1.0.24",
+    "version": "2.0.0",
     "publishConfig": {
@@ -42,5 +42,6 @@ "access": "public"
         "@floating-ui/react-dom-interactions": "^0.12.0",
-        "@fremtind/jkl-core": "^11.4.0",
-        "@fremtind/jkl-react-hooks": "^10.2.9",
-        "@fremtind/jkl-tooltip": "^1.0.9",
+        "@fremtind/jkl-core": "^12.0.0",
+        "@fremtind/jkl-icons-react": "^7.0.0",
+        "@fremtind/jkl-react-hooks": "^11.0.0",
+        "@fremtind/jkl-tooltip": "^2.0.0",
         "classnames": "^2.3.2",
@@ -62,3 +63,3 @@ "framer-motion": "^7.10.3"
     },
-    "gitHead": "ec5d85c9e404fbced0be21140faf4d7d295dbdea"
+    "gitHead": "f325f04cebd537eaa97ae7b27535c946b6f85ff6"
 }

README.md

@@ -17,2 +17,5 @@ # [`@fremtind/jkl-tooltip-react`](https://jokul.fremtind.no/komponenter/tooltip)
 import "@fremtind/jkl-tooltip/tooltip.min.css";
+
+// Du må også importere stilarket til ikonene for å vise komponenten riktig:
+import "@fremtind/jkl-icons/icons.min.css";
 ```
@@ -23,2 +26,3 @@
 @use "@fremtind/jkl-tooltip/tooltip";
+@use "@fremtind/jkl-icons/icons";
 ```

No alert changes

Improved metrics

Total package byte prevSize

27810

increased by8.36%

Lines of code

270

increased by6.3%

Number of lines in readme file

27

increased by17.39%

Worsened metrics

Dependency count

12

increased by9.09%

Dependency changes

• + Added@fremtind/jkl-icons-react@^7.0.0

• + Added@fremtind/jkl-core@12.2.0(transitive)

• + Added@fremtind/jkl-icons@8.0.3(transitive)

• + Added@fremtind/jkl-icons-react@7.2.9(transitive)

• + Added@fremtind/jkl-react-hooks@11.5.1(transitive)

• + Added@fremtind/jkl-tooltip@2.0.6(transitive)

• - Removed@fremtind/jkl-core@11.4.0(transitive)

• - Removed@fremtind/jkl-react-hooks@10.2.9(transitive)

• - Removed@fremtind/jkl-tooltip@1.0.9(transitive)

• Updated@fremtind/jkl-core@^12.0.0

• Updated@fremtind/jkl-react-hooks@^11.0.0

• Updated@fremtind/jkl-tooltip@^2.0.0