@deque/cauldron-react 5.8.1-canary.faf22037 → 5.9.0-canary.07ef06bd

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

@@ -5,19 +5,21 @@ interface AlertProps extends Omit<DialogProps, 'forceAction' | 'closeButtonText'
 }
 declare const Alert: ({ children, className, variant, heading, ...other }: AlertProps) => React.JSX.Element;
 declare const AlertContent: {
-    ({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    ({ children, className, align, ...other }: import("../Dialog").DialogContentProps): React.JSX.Element;
     displayName: string;
     propTypes: {
         className: import("prop-types").Requireable<string>;
         children: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
+        align: import("prop-types").Requireable<string>;
     };
 };
 declare const AlertActions: {
-    ({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    ({ children, className, align, ...other }: import("../Dialog").DialogFooterProps): React.JSX.Element;
     displayName: string;
     propTypes: {
         className: import("prop-types").Requireable<string>;
         children: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
+        align: import("prop-types").Requireable<string>;
     };
 };
 export default Alert;

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

@@ -48,20 +48,27 @@ export default class Dialog extends React.Component<DialogProps, DialogState> {
     handleClickOutside(): void;
     focusHeading(): void;
 }
+interface DialogAlignmentProps {
+    align?: 'left' | 'center' | 'right';
+}
+export type DialogContentProps = React.HTMLAttributes<HTMLDivElement> & DialogAlignmentProps;
 declare const DialogContent: {
-    ({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    ({ children, className, align, ...other }: DialogContentProps): React.JSX.Element;
     displayName: string;
     propTypes: {
         className: PropTypes.Requireable<string>;
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        align: PropTypes.Requireable<string>;
     };
 };
+export type DialogFooterProps = React.HTMLAttributes<HTMLDivElement> & DialogAlignmentProps;
 declare const DialogFooter: {
-    ({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    ({ children, className, align, ...other }: DialogFooterProps): React.JSX.Element;
     displayName: string;
     propTypes: {
         className: PropTypes.Requireable<string>;
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        align: PropTypes.Requireable<string>;
     };
 };
 export { Dialog, DialogContent, DialogFooter };

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

@@ -5,19 +5,21 @@ interface ModalProps extends Omit<DialogProps, 'forceAction'> {
 }
 declare const Modal: ({ children, className, variant, ...other }: ModalProps) => React.JSX.Element;
 declare const ModalContent: {
-    ({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    ({ children, className, align, ...other }: import("../Dialog").DialogContentProps): React.JSX.Element;
     displayName: string;
     propTypes: {
         className: import("prop-types").Requireable<string>;
         children: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
+        align: import("prop-types").Requireable<string>;
     };
 };
 declare const ModalFooter: {
-    ({ children, className, ...other }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    ({ children, className, align, ...other }: import("../Dialog").DialogFooterProps): React.JSX.Element;
     displayName: string;
     propTypes: {
         className: import("prop-types").Requireable<string>;
         children: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
+        align: import("prop-types").Requireable<string>;
     };
 };
 export default Modal;

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

@@ -0,0 +1,11 @@
+import React from 'react';
+import { IconType } from '../Icon';
+import { ContentNode } from '../../types';
+interface TagButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
+    label: ContentNode;
+    value: ContentNode;
+    icon: IconType;
+    onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
+}
+declare const TagButton: React.ForwardRefExoticComponent<TagButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default TagButton;

package/lib/index.d.ts

@@ -39,6 +39,7 @@ export { default as Code } from './components/Code';
 export { default as LoaderOverlay } from './components/LoaderOverlay';
 export { default as Line } from './components/Line';
 export { default as Tag, TagLabel } from './components/Tag';
+export { default as TagButton } from './components/TagButton';
 export { default as Table, TableBody, TableCell, TableHead, TableHeader, TableRow, TableFooter } from './components/Table';
 export { default as Tabs, Tab, TabPanel } from './components/Tabs';
 export { DescriptionList, DescriptionListItem, DescriptionTerm, DescriptionDetails } from './components/DescriptionList';

package/lib/index.js

@@ -1664,22 +1664,32 @@ var Dialog = /** @class */ (function (_super) {
     return Dialog;
 }(React__default["default"].Component));
 var DialogContent = function (_a) {
-    var children = _a.children, className = _a.className, other = tslib.__rest(_a, ["children", "className"]);
-    return (React__default["default"].createElement("div", tslib.__assign({ className: classNames__default["default"]('Dialog__content', className) }, other), children));
+    var children = _a.children, className = _a.className, align = _a.align, other = tslib.__rest(_a, ["children", "className", "align"]);
+    return (React__default["default"].createElement("div", tslib.__assign({ className: classNames__default["default"]('Dialog__content', className, {
+            'text--align-left': align === 'left',
+            'text--align-center': align === 'center',
+            'text--align-right': align === 'right'
+        }) }, other), children));
 };
 DialogContent.displayName = 'DialogContent';
 DialogContent.propTypes = {
     className: PropTypes__default["default"].string,
-    children: PropTypes__default["default"].node
+    children: PropTypes__default["default"].node,
+    align: PropTypes__default["default"].string
 };
 var DialogFooter = function (_a) {
-    var children = _a.children, className = _a.className, other = tslib.__rest(_a, ["children", "className"]);
-    return (React__default["default"].createElement("div", tslib.__assign({ className: classNames__default["default"]('Dialog__footer', className) }, other), children));
+    var children = _a.children, className = _a.className, align = _a.align, other = tslib.__rest(_a, ["children", "className", "align"]);
+    return (React__default["default"].createElement("div", tslib.__assign({ className: classNames__default["default"]('Dialog__footer', className, {
+            'text--align-left': align === 'left',
+            'text--align-center': align === 'center',
+            'text--align-right': align === 'right'
+        }) }, other), children));
 };
 DialogFooter.displayName = 'DialogFooter';
 DialogFooter.propTypes = {
     className: PropTypes__default["default"].string,
-    children: PropTypes__default["default"].node
+    children: PropTypes__default["default"].node,
+    align: PropTypes__default["default"].string
 };
 
 var Alert = function (_a) {
@@ -1813,7 +1823,10 @@ function Tooltip(_a) {
         placement: initialPlacement,
         modifiers: [
             { name: 'preventOverflow', options: { padding: 8 } },
-            { name: 'flip' },
+            {
+                name: 'flip',
+                options: { fallbackPlacements: ['left', 'right', 'top', 'bottom'] }
+            },
             { name: 'offset', options: { offset: [0, 8] } },
             { name: 'arrow', options: { padding: 5, element: arrowElement } }
         ]
@@ -3157,6 +3170,15 @@ Tag.propTypes = {
     className: PropTypes__default["default"].string
 };
 
+var TagButton = React__default["default"].forwardRef(function (_a, ref) {
+    var label = _a.label, value = _a.value, icon = _a.icon, className = _a.className, rest = tslib.__rest(_a, ["label", "value", "icon", "className"]);
+    return (React__default["default"].createElement(Button, tslib.__assign({ variant: "tag", className: classNames__default["default"]('TagButton', className), ref: ref }, rest),
+        React__default["default"].createElement(TagLabel, null, label),
+        value,
+        React__default["default"].createElement(Icon, { className: "TagButton__icon", type: icon })));
+});
+TagButton.displayName = 'TagButton';
+
 var Table = function (_a) {
     var children = _a.children, className = _a.className, variant = _a.variant, other = tslib.__rest(_a, ["children", "className", "variant"]);
     return (React__default["default"].createElement("table", tslib.__assign({ className: classNames__default["default"]('Table', variant === 'border' && 'Table--border', className) }, other), children));
@@ -4842,6 +4864,7 @@ exports.TableHeader = TableHeader;
 exports.TableRow = TableRow;
 exports.Tabs = Tabs;
 exports.Tag = Tag;
+exports.TagButton = TagButton;
 exports.TagLabel = TagLabel;
 exports.TextField = TextField;
 exports.ThemeContext = ThemeContext;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "5.8.1-canary.faf22037",
+  "version": "5.9.0-canary.07ef06bd",
   "license": "MPL-2.0",
   "description": "Fully accessible react components library for Deque Cauldron",
   "homepage": "https://cauldron.dequelabs.com/",