@deque/cauldron-react 4.3.0-canary.bb49adf8 → 4.3.0-canary.e2302853

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

@@ -4,6 +4,7 @@ interface Props extends SyntaxHighlighterProps {
     children: React.ReactNode;
     language?: 'javascript' | 'css' | 'html' | 'yaml';
     className?: string;
+    tabIndex?: number;
 }
 declare const Code: React.ComponentType<Props>;
 export default Code;

package/lib/components/ExpandCollapsePanel/PanelTrigger.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import { IconType } from '../Icon';
 export interface PanelTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     children?: ((props: {
         open: boolean;
@@ -7,14 +8,18 @@ export interface PanelTriggerProps extends React.ButtonHTMLAttributes<HTMLButton
     open?: boolean;
     fullWidth?: string;
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    iconExpanded?: IconType;
+    iconCollapsed?: IconType;
 }
-declare function PanelTrigger({ children, className, open, fullWidth, onClick, ...other }: PanelTriggerProps): JSX.Element;
+declare function PanelTrigger({ children, className, open, fullWidth, onClick, iconExpanded, iconCollapsed, ...other }: PanelTriggerProps): JSX.Element;
 declare namespace PanelTrigger {
     var propTypes: {
         children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
         open: PropTypes.Requireable<boolean>;
         onClick: PropTypes.Requireable<(...args: any[]) => any>;
         className: PropTypes.Requireable<string>;
+        iconExpanded: PropTypes.Requireable<string>;
+        iconCollapsed: PropTypes.Requireable<string>;
     };
 }
 declare const _default: React.MemoExoticComponent<typeof PanelTrigger>;

package/lib/components/Table/TableHeader.d.ts

@@ -7,16 +7,18 @@ interface TableHeaderProps extends ThHTMLAttributes<HTMLTableCellElement> {
     onSort?: () => void;
     className?: string;
     sortAscendingAnnouncement?: string;
-    sortDescendingAnnouncemen?: string;
+    sortDescendingAnnouncement?: string;
 }
 declare const TableHeader: {
-    ({ children, sortDirection, onSort, className, sortAscendingAnnouncement, sortDescendingAnnouncemen, ...other }: TableHeaderProps): JSX.Element;
+    ({ children, sortDirection, onSort, className, sortAscendingAnnouncement, sortDescendingAnnouncement, ...other }: TableHeaderProps): JSX.Element;
     displayName: string;
     propTypes: {
         children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
         sortDirection: PropTypes.Requireable<string>;
         onSort: PropTypes.Requireable<(...args: any[]) => any>;
         className: PropTypes.Requireable<string>;
+        sortAscendingAnnouncement: PropTypes.Requireable<string>;
+        sortDescendingAnnouncement: PropTypes.Requireable<string>;
     };
 };
 export default TableHeader;

package/lib/index.js

@@ -2600,16 +2600,18 @@ var TextField = /** @class */ (function (_super) {
 }(React__default.Component));
 
 function PanelTrigger(_a) {
-    var children = _a.children, className = _a.className, open = _a.open, fullWidth = _a.fullWidth, onClick = _a.onClick, other = tslib.__rest(_a, ["children", "className", "open", "fullWidth", "onClick"]);
+    var children = _a.children, className = _a.className, open = _a.open, fullWidth = _a.fullWidth, onClick = _a.onClick, _b = _a.iconExpanded, iconExpanded = _b === void 0 ? 'chevron-down' : _b, _c = _a.iconCollapsed, iconCollapsed = _c === void 0 ? 'chevron-right' : _c, other = tslib.__rest(_a, ["children", "className", "open", "fullWidth", "onClick", "iconExpanded", "iconCollapsed"]);
     return (React__default.createElement("button", tslib.__assign({}, other, { className: classNames('ExpandCollapse__trigger', fullWidth ? 'fullWidth' : '', className), type: "button", "aria-expanded": open, onClick: onClick }),
         React__default.createElement("div", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function' ? children({ open: !!open }) : children),
-        React__default.createElement(Icon, { type: open ? 'chevron-down' : 'chevron-right' })));
+        React__default.createElement(Icon, { type: open ? iconExpanded : iconCollapsed })));
 }
 PanelTrigger.propTypes = {
     children: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
     open: PropTypes.bool,
     onClick: PropTypes.func,
-    className: PropTypes.string
+    className: PropTypes.string,
+    iconExpanded: PropTypes.string,
+    iconCollapsed: PropTypes.string
 };
 var PanelTrigger$1 = React__default.memo(PanelTrigger);
 
@@ -7984,8 +7986,8 @@ SyntaxHighlighter.registerLanguage('css', css_1);
 SyntaxHighlighter.registerLanguage('html', xml_1);
 SyntaxHighlighter.registerLanguage('yaml', yaml_1);
 var Code = function (_a) {
-    var children = _a.children, className = _a.className, props = tslib.__rest(_a, ["children", "className"]);
-    return (React__default.createElement(SyntaxHighlighter, tslib.__assign({}, props, { useInlineStyles: false, className: classNames('Code', className) }), children));
+    var children = _a.children, className = _a.className, tabIndex = _a.tabIndex, props = tslib.__rest(_a, ["children", "className", "tabIndex"]);
+    return (React__default.createElement(SyntaxHighlighter, tslib.__assign({}, props, { useInlineStyles: false, className: classNames('Code', className), tabIndex: tabIndex }), children));
 };
 Code.displayName = 'Code';
 Code.propTypes = {
@@ -8123,18 +8125,15 @@ TableHead.propTypes = {
 };
 
 var TableHeader = function (_a) {
-    var children = _a.children, sortDirection = _a.sortDirection, onSort = _a.onSort, className = _a.className, _b = _a.sortAscendingAnnouncement, sortAscendingAnnouncement = _b === void 0 ? 'sorted ascending' : _b, _c = _a.sortDescendingAnnouncemen, sortDescendingAnnouncemen = _c === void 0 ? 'sorted descending' : _c, other = tslib.__rest(_a, ["children", "sortDirection", "onSort", "className", "sortAscendingAnnouncement", "sortDescendingAnnouncemen"]);
+    var children = _a.children, sortDirection = _a.sortDirection, onSort = _a.onSort, className = _a.className, _b = _a.sortAscendingAnnouncement, sortAscendingAnnouncement = _b === void 0 ? 'sorted ascending' : _b, _c = _a.sortDescendingAnnouncement, sortDescendingAnnouncement = _c === void 0 ? 'sorted descending' : _c, other = tslib.__rest(_a, ["children", "sortDirection", "onSort", "className", "sortAscendingAnnouncement", "sortDescendingAnnouncement"]);
     // When the sort direction changes, we want to announce the change in a live region
     // because changes to the sort value is not widely supported yet
     // see: https://a11ysupport.io/tech/aria/aria-sort_attribute
-    var _d = tslib.__read(React.useState(''), 2), announcement = _d[0], setAnnouncement = _d[1];
-    React.useEffect(function () {
-        if (sortDirection !== 'none') {
-            setAnnouncement(sortDirection === 'ascending'
-                ? sortAscendingAnnouncement
-                : sortDescendingAnnouncemen);
-        }
-    }, [sortDirection]);
+    var announcement = sortDirection === 'ascending'
+        ? sortAscendingAnnouncement
+        : sortDirection === 'descending'
+            ? sortDescendingAnnouncement
+            : '';
     return (React__default.createElement("th", tslib.__assign({ "aria-sort": sortDirection, className: classNames('TableHeader', className, {
             'TableHeader--sort-ascending': sortDirection === 'ascending',
             'TableHeader--sort-descending': sortDirection === 'descending'
@@ -8149,7 +8148,9 @@ TableHeader.propTypes = {
     children: PropTypes.node.isRequired,
     sortDirection: PropTypes.string,
     onSort: PropTypes.func,
-    className: PropTypes.string
+    className: PropTypes.string,
+    sortAscendingAnnouncement: PropTypes.string,
+    sortDescendingAnnouncement: PropTypes.string
 };
 
 var TableRow = function (_a) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "4.3.0-canary.bb49adf8",
+  "version": "4.3.0-canary.e2302853",
   "description": "Fully accessible react components library for Deque Cauldron",
   "publishConfig": {
     "access": "public"