@newhighsco/chipset 6.13.0 → 6.13.4

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@newhighsco/chipset",
   "description": "Shareable, theme-able component library by New High Score",
-  "version": "6.13.0",
+  "version": "6.13.4",
   "author": "New High Score <hello@newhighsco.re>",
   "license": "ISC",
   "config": {
@@ -25,9 +25,9 @@
     "url": "https://main--6004028a0df11e0021f58df8.chromatic.com"
   },
   "scripts": {
-    "start": "start-storybook --static-dir .storybook/static --docs",
+    "start": "start-storybook --docs --no-manager-cache",
     "prebuild": "rm -rf build",
-    "build": "build-storybook --output-dir build --static-dir .storybook/static --docs --quiet",
+    "build": "build-storybook --output-dir build --docs --quiet",
     "pretest": "yarn lint",
     "test": "npm-run-all --parallel test:*",
     "test:js": "jest --maxWorkers=2 --coverage",
@@ -47,40 +47,42 @@
     "react-device-detect": "2.1.2"
   },
   "devDependencies": {
-    "@babel/core": "7.16.0",
+    "@babel/core": "7.16.12",
     "@babel/polyfill": "7.12.1",
-    "@babel/preset-env": "7.16.0",
-    "@babel/preset-react": "7.16.0",
-    "@commitlint/cli": "14.1.0",
-    "@fullhuman/postcss-purgecss": "4.0.3",
+    "@babel/preset-env": "7.16.11",
+    "@babel/preset-react": "7.16.7",
+    "@commitlint/cli": "16.1.0",
+    "@fullhuman/postcss-purgecss": "4.1.3",
     "@newhighsco/browserslist-config": "1.0.3",
-    "@newhighsco/commitlint-config": "1.0.17",
+    "@newhighsco/commitlint-config": "1.0.22",
     "@newhighsco/editor-config": "1.1.2",
-    "@newhighsco/eslint-config": "2.3.37",
-    "@newhighsco/postcss-config": "3.4.15",
-    "@newhighsco/prettier-config": "2.0.14",
-    "@newhighsco/release-config": "1.0.76",
-    "@newhighsco/storybook-preset": "4.3.26",
-    "@newhighsco/stylelint-config": "3.0.3",
-    "@storybook/react": "6.3.12",
-    "@wojtekmaj/enzyme-adapter-react-17": "0.6.5",
-    "babel-jest": "27.3.1",
+    "@newhighsco/eslint-config": "2.3.59",
+    "@newhighsco/postcss-config": "3.4.49",
+    "@newhighsco/prettier-config": "2.0.16",
+    "@newhighsco/release-config": "1.1.5",
+    "@newhighsco/storybook-preset": "4.4.16",
+    "@newhighsco/stylelint-config": "3.0.11",
+    "@storybook/builder-webpack5": "6.4.16",
+    "@storybook/manager-webpack5": "6.4.16",
+    "@storybook/react": "6.4.16",
+    "@wojtekmaj/enzyme-adapter-react-17": "0.6.6",
+    "babel-jest": "27.4.6",
     "babel-loader": "8.2.3",
-    "chromatic": "6.0.5",
+    "chromatic": "6.4.2",
     "enzyme": "3.11.0",
-    "eslint": "8.1.0",
+    "eslint": "8.8.0",
     "husky": "7.0.4",
     "identity-obj-proxy": "3.0.0",
-    "jest": "27.3.1",
+    "jest": "27.4.7",
     "npm-run-all": "4.1.5",
-    "postcss": "8.3.11",
-    "prettier": "2.4.1",
+    "postcss": "8.4.5",
+    "prettier": "2.5.1",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "sass-true": "6.0.1",
-    "semantic-release": "18.0.0",
-    "stylelint": "14.0.1",
-    "webpack": "5.61.0"
+    "semantic-release": "19.0.2",
+    "stylelint": "14.3.0",
+    "webpack": "5.67.0"
   },
   "peerDependencies": {
     "react": "17.0.2",

package/src/components/Tooltip/Tooltip.jsx

@@ -9,14 +9,15 @@ import SmartLink from '../SmartLink'
  */
 const Tooltip = ({
   hidden = true,
+  manual = true,
   toggle,
   href,
   target,
-  automatic,
   heading,
   children,
   align = 'center',
   valign = 'top',
+  disabled,
   theme,
   className
 }) => {
@@ -27,7 +28,7 @@ const Tooltip = ({
   return (
     <span
       className={classNames(theme?.root, className)}
-      {...(automatic && {
+      {...(!manual && {
         onMouseOver: setVisibility,
         onMouseOut: setVisibility,
         onFocus: setVisibility,
@@ -39,8 +40,9 @@ const Tooltip = ({
         className={classNames(theme?.toggle, visible && theme?.toggleActive)}
         href={href}
         target={target}
+        disabled={disabled}
         aria-label="Toggle tooltip"
-        {...(!automatic && {
+        {...(manual && {
           'aria-expanded': visible,
           onClick: setVisibility
         })}
@@ -67,14 +69,15 @@ const Tooltip = ({
 Tooltip.displayName = 'Tooltip'
 Tooltip.propTypes = {
   hidden: bool,
+  manual: bool,
   toggle: node,
   href: string,
   target: string,
-  automatic: bool,
   heading: node,
   children: node,
   align: oneOf(['left', 'right', 'center']),
   valign: oneOf(['top', 'middle', 'bottom']),
+  disabled: bool,
   theme: shape({
     root: string,
     toggle: string,

package/src/components/Tooltip/Tooltip.module.scss

@@ -1,5 +1,3 @@
-@use '../../../styles/functions';
-
 .root {
   display: inline-block;
   position: relative;
@@ -15,10 +13,9 @@
 }
 
 .content {
-  $tooltip-content-margin: functions.spacing(1);
-
   display: block;
   position: absolute;
+  z-index: 1;
 
   &[hidden] {
     display: none;
@@ -26,11 +23,9 @@
 
   &.top {
     bottom: 100%;
-    margin-bottom: $tooltip-content-margin;
   }
 
   &.bottom {
-    margin-top: $tooltip-content-margin;
     top: 100%;
   }
 
@@ -53,13 +48,11 @@
 
     &.left {
       left: auto;
-      margin-right: $tooltip-content-margin;
       right: 100%;
     }
 
     &.right {
       left: 100%;
-      margin-left: $tooltip-content-margin;
       right: auto;
     }
 
@@ -68,3 +61,8 @@
     }
   }
 }
+
+.heading,
+.copy {
+  display: block;
+}