v5.5.5 (#635)

* Raise importance of pill cursor css value

* v5.5.5

* Fix failing test

Author: kapantzak

.gitignore

@@ -3,6 +3,7 @@
 .jest-test-results.json
 .jest-tmp
 .idea
+.claude/
 node_modules
 public
 lib

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netdata/netdata-ui",
-  "version": "5.5.4",
+  "version": "5.5.5",
   "description": "netdata UI kit",
   "main": "dist/index.js",
   "module": "dist/es6/index.js",

src/components/pill/styled.js

@@ -23,6 +23,11 @@ export const MasterCardContainer = styled(Flex).attrs(
   }
 `
 
+const cursorStyle = props => {
+  if (props.onClick) return `&& { cursor: pointer; }`
+  return ""
+}
+
 export const PillContainer = styled(Flex).attrs(
   ({
     round = true,
@@ -41,19 +46,21 @@ export const PillContainer = styled(Flex).attrs(
     semi,
     ...rest
   }) => ({
+    ...(onClick && { cursor: "pointer" }),
     padding: getPillPadding(padding, size, tiny),
     round: round === false ? 1 : round === true ? 7.5 : round,
     border: {
       side: "all",
       color: borderColor || getPillColor(semi ? "hollow" : "border", flavour),
       size: "1px",
     },
-    ...(onClick && { cursor: "pointer" }),
     justifyContent,
     alignItems,
     position,
     zIndex,
     background: getPillBackground({ background, flavour, hollow, semi }),
     ...rest,
   })
-)``
+)`
+  ${cursorStyle}
+`