@deque/cauldron-react 5.6.2 → 5.7.0-canary.ade57cca

package/lib/components/NavBar/NavBar.d.ts

@@ -1,15 +1,14 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-interface NavBarProps {
+interface NavBarProps extends React.HTMLAttributes<HTMLDivElement> {
     children: React.ReactNode;
-    initialActiveIndex?: number;
     className?: string;
     collapsed?: boolean;
     navTriggerLabel?: string;
     propId?: string;
 }
 declare const NavBar: {
-    ({ children, className, collapsed, navTriggerLabel, propId }: NavBarProps): JSX.Element;
+    ({ children, className, collapsed, navTriggerLabel, propId, ...props }: NavBarProps): JSX.Element;
     displayName: string;
     propTypes: {
         children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;

package/lib/components/Notice/index.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode } from 'react';
+import { IconType } from '../Icon';
+import { ContentNode } from '../../types';
+declare const iconTypeMap: {
+    caution: string;
+    danger: string;
+    info: string;
+};
+export interface NoticeProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
+    type?: keyof typeof iconTypeMap;
+    title: ContentNode;
+    icon?: IconType;
+    children?: ReactNode;
+}
+declare const Notice: React.ForwardRefExoticComponent<NoticeProps & React.RefAttributes<HTMLDivElement>>;
+export default Notice;

package/lib/components/Pagination/Pagination.d.ts

@@ -5,7 +5,7 @@ interface Props extends React.HTMLAttributes<HTMLDivElement> {
     totalItems: number;
     itemsPerPage?: number;
     currentPage?: number;
-    statusLabel?: React.ReactNode;
+    statusLabel?: ContentNode;
     firstPageLabel?: ContentNode;
     previousPageLabel?: ContentNode;
     nextPageLabel?: ContentNode;

package/lib/contexts/theme.d.ts

@@ -1,11 +1,18 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+declare type Theme = 'light' | 'dark';
 interface ProviderProps {
     children: React.ReactNode;
     context?: HTMLElement;
-    initialTheme?: string;
+    initialTheme?: Theme;
 }
-declare const ThemeContext: React.Context<{}>;
+interface State {
+    theme: Theme;
+}
+interface Methods {
+    toggleTheme: () => void;
+}
+declare const ThemeContext: React.Context<State & Methods>;
 declare const ThemeProvider: {
     ({ children, context, initialTheme }: ProviderProps): JSX.Element;
     propTypes: {
@@ -13,5 +20,5 @@ declare const ThemeProvider: {
         initialTheme: PropTypes.Requireable<string>;
     };
 };
-declare function useThemeContext(): {};
+declare function useThemeContext(): State & Methods;
 export { ThemeContext, ThemeProvider, useThemeContext };

package/lib/index.d.ts

@@ -51,6 +51,7 @@ export { default as Pagination, usePagination } from './components/Pagination';
 export { default as FieldWrap } from './components/FieldWrap';
 export { default as Breadcrumb, BreadcrumbItem, BreadcrumbLink } from './components/Breadcrumb';
 export { default as TwoColumnPanel, ColumnHeader, ColumnGroupHeader, ColumnLeft, ColumnRight, ColumnList } from './components/TwoColumnPanel';
+export { default as Notice } from './components/Notice';
 /**
  * Helpers / Utils
  */

package/lib/index.js

@@ -1282,7 +1282,7 @@ var TopBarMenu = /** @class */ (function (_super) {
 }(React__default.Component));
 
 var NavBar = function (_a) {
-    var children = _a.children, className = _a.className, _b = _a.collapsed, collapsed = _b === void 0 ? false : _b, _c = _a.navTriggerLabel, navTriggerLabel = _c === void 0 ? 'MAIN MENU' : _c, propId = _a.propId;
+    var children = _a.children, className = _a.className, _b = _a.collapsed, collapsed = _b === void 0 ? false : _b, _c = _a.navTriggerLabel, navTriggerLabel = _c === void 0 ? 'MAIN MENU' : _c, propId = _a.propId, props = tslib.__rest(_a, ["children", "className", "collapsed", "navTriggerLabel", "propId"]);
     var navRef = React.useRef(null);
     var triggerRef = React.useRef(null);
     var _d = tslib.__read(React.useState(false), 2), showDropdown = _d[0], setShowDropdown = _d[1];
@@ -1314,9 +1314,9 @@ var NavBar = function (_a) {
     var handleTriggerClick = function () {
         setShowDropdown(!showDropdown);
     };
-    return (React__default.createElement("nav", { className: classNames('NavBar', className, {
+    return (React__default.createElement("nav", tslib.__assign({ className: classNames('NavBar', className, {
             'NavBar--collapsed': collapsed
-        }), ref: navRef },
+        }), ref: navRef }, props),
         collapsed && (React__default.createElement("button", { "aria-haspopup": "true", "aria-expanded": showDropdown, "aria-controls": menuId, ref: triggerRef, onClick: handleTriggerClick, className: classNames('NavBar__trigger', {
                 'NavBar__trigger--active': showDropdown
             }) },
@@ -9121,9 +9121,45 @@ ColumnList.propTypes = {
     className: PropTypes.string
 };
 
+var iconTypeMap = {
+    caution: 'caution',
+    danger: 'caution',
+    info: 'info-circle'
+};
+var Notice = React.forwardRef(function (_a, ref) {
+    var _b;
+    var _c = _a.type, type = _c === void 0 ? 'info' : _c, title = _a.title, icon = _a.icon, children = _a.children, otherProps = tslib.__rest(_a, ["type", "title", "icon", "children"]);
+    return (React__default.createElement("div", tslib.__assign({ className: classNames('Notice', (_b = {},
+            _b["Notice--".concat(type)] = type,
+            _b)), ref: ref }, otherProps),
+        React__default.createElement("div", { className: "Notice__title" },
+            React__default.createElement(Icon, { type: icon || iconTypeMap[type] }),
+            title),
+        children && React__default.createElement("div", { className: "Notice__content" }, children)));
+});
+Notice.displayName = 'Notice';
+Notice.propTypes = {
+    // @ts-expect-error
+    children: PropTypes.node,
+    type: PropTypes.oneOf(['caution', 'info', 'danger']),
+    // @ts-expect-error
+    title: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.number,
+        PropTypes.element
+    ]),
+    // @ts-expect-error
+    icon: PropTypes.string
+};
+
 var LIGHT_THEME_CLASS = 'cauldron--theme-light';
 var DARK_THEME_CLASS = 'cauldron--theme-dark';
-var ThemeContext = React.createContext({});
+var ThemeContext = React.createContext({
+    theme: 'light',
+    toggleTheme: function () {
+        throw new Error('ThemeContext not initialized');
+    }
+});
 var ThemeProvider = function (_a) {
     var children = _a.children, _b = _a.context, context = _b === void 0 ? document.body : _b, _c = _a.initialTheme, initialTheme = _c === void 0 ? 'light' : _c;
     var _d = tslib.__read(React.useState(initialTheme), 2), theme = _d[0], setTheme = _d[1];
@@ -9231,6 +9267,7 @@ exports.ModalContent = ModalContent;
 exports.ModalFooter = ModalFooter;
 exports.NavBar = NavBar;
 exports.NavItem = NavItem;
+exports.Notice = Notice;
 exports.Offscreen = Offscreen;
 exports.OptionsMenu = OptionsMenu;
 exports.OptionsMenuItem = OptionsMenuItem;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "5.6.2",
+  "version": "5.7.0-canary.ade57cca",
   "description": "Fully accessible react components library for Deque Cauldron",
   "homepage": "https://cauldron.dequelabs.com/",
   "publishConfig": {
@@ -122,4 +122,4 @@
       "\\.svg$": "<rootDir>/__tests__/svgMock.js"
     }
   }
-}
+}