@canonical/react-components 0.36.0 → 0.37.2

package/dist/index.d.ts

@@ -19,6 +19,7 @@ export { default as List } from "./components/List";
 export { default as Loader } from "./components/Loader";
 export { default as MainTable } from "./components/MainTable";
 export { default as ModularTable } from "./components/ModularTable";
+export { default as Navigation } from "./components/Navigation";
 export { default as Modal } from "./components/Modal";
 export { default as Notification, NotificationSeverity, } from "./components/Notification";
 export { default as Pagination } from "./components/Pagination";
@@ -31,6 +32,7 @@ export { default as Select } from "./components/Select";
 export { default as Slider } from "./components/Slider";
 export { default as Switch } from "./components/Switch";
 export { default as Spinner } from "./components/Spinner";
+export { default as StatusLabel, StatusLabelAppearance, } from "./components/StatusLabel";
 export { default as Strip } from "./components/Strip";
 export { default as SummaryButton } from "./components/SummaryButton";
 export { default as Table } from "./components/Table";
@@ -63,6 +65,7 @@ export type { ListProps } from "./components/List";
 export type { MainTableProps } from "./components/MainTable";
 export type { ModularTableProps } from "./components/ModularTable";
 export type { ModalProps } from "./components/Modal";
+export type { GenerateLink, LogoProps, NavigationProps, NavItem, NavLink, NavLinkAnchor, NavLinkBase, NavLinkButton, } from "./components/Navigation";
 export type { NotificationProps } from "./components/Notification";
 export type { PaginationProps } from "./components/Pagination";
 export type { RadioInputProps } from "./components/RadioInput";
@@ -72,6 +75,7 @@ export type { SearchBoxProps } from "./components/SearchBox";
 export type { SelectProps } from "./components/Select";
 export type { SliderProps } from "./components/Slider";
 export type { SpinnerProps } from "./components/Spinner";
+export type { StatusLabelProps } from "./components/StatusLabel";
 export type { StripProps } from "./components/Strip";
 export type { SummaryButtonProps } from "./components/SummaryButton";
 export type { TableProps } from "./components/Table";
@@ -81,6 +85,8 @@ export type { TableRowProps } from "./components/TableRow";
 export type { TabsProps } from "./components/Tabs";
 export type { TextareaProps } from "./components/Textarea";
 export type { TooltipProps } from "./components/Tooltip";
-export { useWindowFitment, useListener, usePrevious, useThrottle, useId, } from "./hooks";
+export { useClickOutside, useId, useListener, useOnEscapePressed, usePrevious, useThrottle, useWindowFitment, } from "./hooks";
 export type { WindowFitment } from "./hooks";
+export { isNavigationAnchor, isNavigationButton } from "./utils";
 export type { ClassName, Headings, PropsWithSpread, SortDirection, SubComponentProps, TSFixMe, ValueOf, } from "./types";
+export { Theme } from "./enums";

package/dist/index.js

@@ -155,6 +155,12 @@ Object.defineProperty(exports, "ModularTable", {
     return _ModularTable.default;
   }
 });
+Object.defineProperty(exports, "Navigation", {
+  enumerable: true,
+  get: function get() {
+    return _Navigation.default;
+  }
+});
 Object.defineProperty(exports, "Notification", {
   enumerable: true,
   get: function get() {
@@ -221,6 +227,18 @@ Object.defineProperty(exports, "Spinner", {
     return _Spinner.default;
   }
 });
+Object.defineProperty(exports, "StatusLabel", {
+  enumerable: true,
+  get: function get() {
+    return _StatusLabel.default;
+  }
+});
+Object.defineProperty(exports, "StatusLabelAppearance", {
+  enumerable: true,
+  get: function get() {
+    return _StatusLabel.StatusLabelAppearance;
+  }
+});
 Object.defineProperty(exports, "Strip", {
   enumerable: true,
   get: function get() {
@@ -275,12 +293,36 @@ Object.defineProperty(exports, "Textarea", {
     return _Textarea.default;
   }
 });
+Object.defineProperty(exports, "Theme", {
+  enumerable: true,
+  get: function get() {
+    return _enums.Theme;
+  }
+});
 Object.defineProperty(exports, "Tooltip", {
   enumerable: true,
   get: function get() {
     return _Tooltip.default;
   }
 });
+Object.defineProperty(exports, "isNavigationAnchor", {
+  enumerable: true,
+  get: function get() {
+    return _utils.isNavigationAnchor;
+  }
+});
+Object.defineProperty(exports, "isNavigationButton", {
+  enumerable: true,
+  get: function get() {
+    return _utils.isNavigationButton;
+  }
+});
+Object.defineProperty(exports, "useClickOutside", {
+  enumerable: true,
+  get: function get() {
+    return _hooks.useClickOutside;
+  }
+});
 Object.defineProperty(exports, "useId", {
   enumerable: true,
   get: function get() {
@@ -293,6 +335,12 @@ Object.defineProperty(exports, "useListener", {
     return _hooks.useListener;
   }
 });
+Object.defineProperty(exports, "useOnEscapePressed", {
+  enumerable: true,
+  get: function get() {
+    return _hooks.useOnEscapePressed;
+  }
+});
 Object.defineProperty(exports, "usePrevious", {
   enumerable: true,
   get: function get() {
@@ -354,6 +402,8 @@ var _MainTable = _interopRequireDefault(require("./components/MainTable"));
 
 var _ModularTable = _interopRequireDefault(require("./components/ModularTable"));
 
+var _Navigation = _interopRequireDefault(require("./components/Navigation"));
+
 var _Modal = _interopRequireDefault(require("./components/Modal"));
 
 var _Notification = _interopRequireWildcard(require("./components/Notification"));
@@ -378,6 +428,8 @@ var _Switch = _interopRequireDefault(require("./components/Switch"));
 
 var _Spinner = _interopRequireDefault(require("./components/Spinner"));
 
+var _StatusLabel = _interopRequireWildcard(require("./components/StatusLabel"));
+
 var _Strip = _interopRequireDefault(require("./components/Strip"));
 
 var _SummaryButton = _interopRequireDefault(require("./components/SummaryButton"));
@@ -398,6 +450,10 @@ var _Tooltip = _interopRequireDefault(require("./components/Tooltip"));
 
 var _hooks = require("./hooks");
 
+var _utils = require("./utils");
+
+var _enums = require("./enums");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/dist/utils.d.ts

@@ -1,3 +1,4 @@
+import { NavLink, NavLinkAnchor, NavLinkButton } from "./components/Navigation";
 export declare const IS_DEV: boolean;
 /**
  * Find substring and wrap in <strong /> tag
@@ -9,3 +10,13 @@ export declare const highlightSubString: (str?: string, subString?: string) => {
     text: string;
     match: boolean;
 };
+/**
+ * Whether a navigation item is an anchor.
+ * @param link - The navigation item.
+ */
+export declare const isNavigationAnchor: (link: NavLink) => link is NavLinkAnchor;
+/**
+ * Whether a navigation item is a button.
+ * @param link - The navigation item.
+ */
+export declare const isNavigationButton: (link: NavLink) => link is NavLinkButton;

package/dist/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.highlightSubString = exports.IS_DEV = void 0;
+exports.isNavigationButton = exports.isNavigationAnchor = exports.highlightSubString = exports.IS_DEV = void 0;
 var IS_DEV = process.env.NODE_ENV === "development";
 /**
  * Find substring and wrap in <strong /> tag
@@ -31,5 +31,27 @@ var highlightSubString = function highlightSubString(str, subString) {
     match: newStr !== str
   };
 };
+/**
+ * Whether a navigation item is an anchor.
+ * @param link - The navigation item.
+ */
+
+
+exports.highlightSubString = highlightSubString;
+
+var isNavigationAnchor = function isNavigationAnchor(link) {
+  return !!link.url;
+};
+/**
+ * Whether a navigation item is a button.
+ * @param link - The navigation item.
+ */
+
+
+exports.isNavigationAnchor = isNavigationAnchor;
+
+var isNavigationButton = function isNavigationButton(link) {
+  return !link.url;
+};
 
-exports.highlightSubString = highlightSubString;
+exports.isNavigationButton = isNavigationButton;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canonical/react-components",
-  "version": "0.36.0",
+  "version": "0.37.2",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "author": "Huw Wilkins <huw.wilkins@canonical.com>",
@@ -22,87 +22,89 @@
   },
   "homepage": "/react-components/",
   "devDependencies": {
-    "@babel/cli": "7.17.6",
-    "@babel/eslint-parser": "7.17.0",
-    "@babel/preset-typescript": "7.16.7",
-    "@percy/cli": "1.0.5",
-    "@percy/storybook": "4.2.0",
-    "@storybook/addon-a11y": "6.4.20",
-    "@storybook/addon-controls": "6.4.20",
-    "@storybook/addon-docs": "6.4.20",
-    "@storybook/addons": "6.4.20",
-    "@storybook/react": "6.4.20",
-    "@storybook/theming": "6.4.20",
+    "@babel/cli": "7.17.10",
+    "@babel/eslint-parser": "7.18.2",
+    "@babel/preset-typescript": "7.17.12",
+    "@percy/cli": "1.2.1",
+    "@percy/storybook": "4.2.1",
+    "@storybook/addon-a11y": "6.4.22",
+    "@storybook/addon-controls": "6.4.22",
+    "@storybook/addon-docs": "6.4.22",
+    "@storybook/addons": "6.4.22",
+    "@storybook/react": "6.4.22",
+    "@storybook/theming": "6.4.22",
     "@testing-library/cypress": "8.0.2",
-    "@testing-library/dom": "8.12.0",
-    "@testing-library/jest-dom": "5.16.3",
-    "@testing-library/react": "12.1.4",
+    "@testing-library/dom": "8.14.0",
+    "@testing-library/jest-dom": "5.16.4",
+    "@testing-library/react": "12.1.5",
     "@testing-library/react-hooks": "7.0.2",
     "@testing-library/user-event": "13.5.0",
-    "@typescript-eslint/eslint-plugin": "5.18.0",
-    "@typescript-eslint/parser": "5.18.0",
+    "@typescript-eslint/eslint-plugin": "5.29.0",
+    "@typescript-eslint/parser": "5.29.0",
     "@wojtekmaj/enzyme-adapter-react-17": "0.6.7",
     "babel-jest": "27.5.1",
-    "babel-loader": "8.2.4",
+    "babel-loader": "8.2.5",
     "babel-plugin-module-resolver": "4.1.0",
     "babel-plugin-typescript-to-proptypes": "2.0.0",
-    "concurrently": "7.1.0",
+    "concurrently": "7.2.1",
     "css-loader": "5.2.7",
-    "cypress": "9.5.3",
+    "cypress": "9.7.0",
     "deepmerge": "4.2.2",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.6",
     "enzyme-to-json": "3.6.2",
-    "eslint": "8.12.0",
+    "eslint": "8.16.0",
     "eslint-config-prettier": "8.5.0",
-    "eslint-config-react-app": "7.0.0",
+    "eslint-config-react-app": "7.0.1",
     "eslint-plugin-cypress": "2.12.1",
     "eslint-plugin-flowtype": "8.0.3",
-    "eslint-plugin-import": "2.25.4",
+    "eslint-plugin-import": "2.26.0",
     "eslint-plugin-jsx-a11y": "6.5.1",
     "eslint-plugin-prettier": "4.0.0",
-    "eslint-plugin-react": "7.29.4",
-    "eslint-plugin-react-hooks": "4.4.0",
-    "eslint-plugin-testing-library": "5.2.1",
+    "eslint-plugin-react": "7.30.0",
+    "eslint-plugin-react-hooks": "4.5.0",
+    "eslint-plugin-testing-library": "5.5.1",
     "jest": "27.5.1",
     "npm-package-json-lint": "5.4.2",
     "prettier": "2.6.2",
     "react": "17.0.2",
     "react-docgen-typescript-loader": "3.7.2",
     "react-dom": "17.0.2",
-    "sass": "1.49.11",
+    "sass": "1.52.2",
     "sass-loader": "10.2.1",
     "style-loader": "2.0.0",
-    "stylelint": "14.6.1",
+    "stylelint": "14.8.5",
     "stylelint-config-prettier": "9.0.3",
     "stylelint-config-recommended-scss": "5.0.2",
     "stylelint-order": "5.0.0",
     "stylelint-prettier": "2.0.0",
-    "ts-jest": "27.1.4",
-    "tsc-alias": "1.6.5",
-    "typescript": "4.6.3",
-    "vanilla-framework": "3.3.0",
+    "ts-jest": "27.1.5",
+    "tsc-alias": "1.6.8",
+    "typescript": "4.7.2",
+    "vanilla-framework": "3.6.0",
     "wait-on": "5.3.0"
   },
   "dependencies": {
-    "@types/jest": "27.4.1",
-    "@types/node": "16.11.26",
-    "@types/react": "17.0.43",
-    "@types/react-dom": "17.0.14",
-    "@types/react-table": "7.7.10",
+    "@types/jest": "27.5.2",
+    "@types/node": "16.11.38",
+    "@types/react": "17.0.45",
+    "@types/react-dom": "17.0.17",
+    "@types/react-table": "7.7.12",
     "classnames": "2.3.1",
-    "nanoid": "3.3.2",
+    "nanoid": "3.3.4",
     "prop-types": "15.8.1",
-    "react-table": "7.7.0",
+    "react-table": "7.8.0",
     "react-useportal": "1.0.16"
   },
   "resolutions": {
+    "@types/react": "17.0.45",
+    "@types/react-dom": "17.0.17",
     "postcss": "^8.3.11"
   },
   "peerDependencies": {
     "react": "17.0.2",
     "react-dom": "17.0.2",
-    "vanilla-framework": "3.3.0"
+    "vanilla-framework": "3.6.0"
   },
   "scripts": {
     "build": "rm -rf dist && yarn build-local; yarn build-declaration",