@deque/cauldron-react 7.2.0 → 7.3.0-canary.588f1404

package/lib/components/ActionMenu/ActionMenu.d.ts

@@ -1,19 +1,27 @@
 import React from 'react';
 import type { onActionCallbackFunction } from '../ActionList/ActionListContext';
+import AnchoredOverlay from '../AnchoredOverlay';
 interface ActionMenuListProps {
     ref?: React.Ref<HTMLElement>;
     onAction?: onActionCallbackFunction;
     [key: string]: unknown;
 }
-type ActionMenuTriggerProps = Pick<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'onClick' | 'onKeyDown' | 'aria-expanded' | 'aria-haspopup' | 'aria-controls'> & {
-    ref: React.RefObject<HTMLButtonElement | null>;
+/**
+ * Props passed to an `ActionMenu` trigger render function. The element type
+ * defaults to `HTMLButtonElement`; annotate it (e.g. `ActionMenuTriggerProps<HTMLLIElement>`)
+ * when the trigger is not a button — for example a `MenuItem`/`TopBarItem`
+ * (`<li>`) in the documented `TopBar`/`MenuBar` nesting — so the `ref` and
+ * spread handlers type against the actual element without casts.
+ */
+export type ActionMenuTriggerProps<E extends HTMLElement = HTMLButtonElement> = Pick<React.HTMLAttributes<E>, 'children' | 'id' | 'onClick' | 'onKeyDown' | 'aria-expanded' | 'aria-haspopup' | 'aria-controls'> & {
+    ref: React.RefObject<E | null>;
 };
-type ActionMenuTriggerFunction = (props: ActionMenuTriggerProps, open: boolean) => React.ReactElement;
-declare const ActionMenu: React.ForwardRefExoticComponent<{
+export type ActionMenuTriggerFunction<E extends HTMLElement = HTMLButtonElement> = (props: ActionMenuTriggerProps<E>, open: boolean) => React.ReactElement;
+type ActionMenuProps<E extends HTMLElement = HTMLButtonElement> = {
     children: React.ReactElement<ActionMenuListProps>;
-    trigger: React.ReactElement | ActionMenuTriggerFunction;
+    trigger: React.ReactElement | ActionMenuTriggerFunction<E>;
     /** Render the action menu in a different location in the dom. */
-    portal?: HTMLElement | React.RefObject<HTMLElement | null> | undefined;
+    portal?: React.RefObject<HTMLElement | null> | HTMLElement;
     /**
      * Controls whether the menu should render as a child of the trigger, as opposed to
      * rendering as a sibling. Intended for use with nested menu patterns, for example
@@ -21,25 +29,17 @@ declare const ActionMenu: React.ForwardRefExoticComponent<{
      *
      * Only supported if trigger is a function *and* portal is undefined.
      */
-    renderInTrigger?: boolean | undefined;
-} & Pick<{
-    target: HTMLElement | React.RefObject<HTMLElement | null> | React.MutableRefObject<HTMLElement | null>;
-    placement?: "auto" | import("@floating-ui/dom").Placement | "auto-start" | "auto-end" | undefined;
-    open?: boolean | undefined;
-    onOpenChange?: ((open: boolean) => void) | undefined;
-    onPlacementChange?: ((placement: import("@floating-ui/dom").Placement) => void) | undefined;
-    onShiftChange?: ((coords: import("@floating-ui/dom").Coords) => void) | undefined;
-    offset?: number | undefined;
-    focusTrap?: boolean | undefined;
-    focusTrapOptions?: {
-        disabled?: boolean | undefined;
-        initialFocusElement?: import("../../types").ElementOrRef<HTMLElement> | undefined;
-        returnFocus?: boolean | undefined;
-        returnFocusElement?: import("../../types").ElementOrRef<HTMLElement> | undefined;
-    } | undefined;
-    portal?: HTMLElement | React.RefObject<HTMLElement | null> | undefined;
-    children?: React.ReactNode;
-} & React.HTMLAttributes<HTMLElement> & {
-    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
-} & React.RefAttributes<HTMLElement>, "placement"> & React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+    renderInTrigger?: boolean;
+} & Pick<React.ComponentProps<typeof AnchoredOverlay>, 'placement'> & React.HTMLAttributes<HTMLElement>;
+/**
+ * The trigger element type is parameterized (defaulting to `HTMLButtonElement`)
+ * so it can be widened for nested menu patterns where the trigger is not a
+ * button — e.g. a `MenuItem`/`TopBarItem` (`<li>`) inside a `TopBar`/`MenuBar`.
+ * This only widens the public types of the `trigger` function; the internal
+ * implementation is unaffected. See the ActionMenu docs for a usage example.
+ */
+type ActionMenuType = Omit<React.ForwardRefExoticComponent<ActionMenuProps>, keyof CallableFunction> & {
+    <E extends HTMLElement = HTMLButtonElement>(props: ActionMenuProps<E> & React.RefAttributes<HTMLElement>): React.ReactElement;
+};
+declare const ActionMenu: ActionMenuType;
 export default ActionMenu;

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

@@ -1 +1,2 @@
 export { default as ActionMenu } from './ActionMenu';
+export type { ActionMenuTriggerProps, ActionMenuTriggerFunction } from './ActionMenu';

package/lib/components/Icon/types.d.ts

@@ -2,6 +2,6 @@
  * GENERATED CODE. DO NOT EDIT DIRECTLY!
  */
 /** IconType represents each valid icon type. */
-export type IconType = 'add-user' | 'arrow-circle-up' | 'arrow-circle-down' | 'arrow-circle-left' | 'arrow-circle-right' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrows-alt' | 'bolt' | 'broken-image' | 'caution' | 'check-circle' | 'check-shield' | 'check-solid' | 'check' | 'checkbox-checked' | 'checkbox-unchecked' | 'chevron-double-up' | 'chevron-double-down' | 'chevron-double-left' | 'chevron-double-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'clipboard' | 'clock' | 'close' | 'code' | 'copy' | 'download' | 'dropper' | 'exchange' | 'export-solid' | 'external-link' | 'eye' | 'filter' | 'flag' | 'gears' | 'github' | 'grid' | 'hamburger-menu' | 'hashtag' | 'highlight' | 'images' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'link' | 'linkedin' | 'list' | 'lock' | 'magnifying-glass' | 'menu' | 'minus' | 'new-releases' | 'new' | 'no' | 'pause' | 'pencil' | 'person-running' | 'play' | 'plus' | 'question-circle-alt' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle-square' | 'recycle' | 'resend' | 'robot' | 'run-again' | 'save' | 'share-nodes' | 'share' | 'sort-triangle' | 'sort' | 'star-outline' | 'star' | 'step-back' | 'step-forward' | 'sun' | 'table-sort-ascending' | 'table-sort-descending' | 'tag' | 'target' | 'trash' | 'triangle-up' | 'triangle-down' | 'triangle-left' | 'triangle-right' | 'twitter' | 'upload' | 'filter-solid';
+export type IconType = 'add-user' | 'arrow-circle-up' | 'arrow-circle-down' | 'arrow-circle-left' | 'arrow-circle-right' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrows-alt' | 'bolt' | 'broken-image' | 'caution' | 'check-circle' | 'check-shield' | 'check-solid' | 'check' | 'checkbox-checked' | 'checkbox-unchecked' | 'chevron-double-up' | 'chevron-double-down' | 'chevron-double-left' | 'chevron-double-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'clipboard' | 'clock' | 'close' | 'code' | 'copy' | 'download' | 'dropper' | 'exchange' | 'export-solid' | 'external-link' | 'eye' | 'filter' | 'flag' | 'gears' | 'github' | 'grid' | 'hamburger-menu' | 'hashtag' | 'highlight' | 'images' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'link' | 'linkedin' | 'list' | 'lock' | 'magnifying-glass' | 'menu' | 'minus' | 'new-releases' | 'new' | 'no' | 'pause' | 'pencil' | 'person-running' | 'play' | 'plus' | 'question-circle-alt' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle-square' | 'recycle' | 'report' | 'resend' | 'robot' | 'run-again' | 'save' | 'share-nodes' | 'share' | 'sort-triangle' | 'sort' | 'star-outline' | 'star' | 'step-back' | 'step-forward' | 'sun' | 'table-sort-ascending' | 'table-sort-descending' | 'tag' | 'target' | 'trash' | 'triangle-up' | 'triangle-down' | 'triangle-left' | 'triangle-right' | 'twitter' | 'upload' | 'filter-solid';
 /** iconTypes holds each valid icon type. */
 export declare const iconTypes: string[];

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

@@ -0,0 +1,11 @@
+import React, { type ComponentPropsWithRef } from 'react';
+export type MetadataListProps = {
+    orientation?: 'vertical' | 'horizontal';
+} & ComponentPropsWithRef<'dl'>;
+export declare const MetadataList: React.ForwardRefExoticComponent<Omit<MetadataListProps, "ref"> & React.RefAttributes<HTMLDListElement>>;
+export type MetadataListItemProps = ComponentPropsWithRef<'div'>;
+export declare const MetadataListItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type MetadataListLabelProps = ComponentPropsWithRef<'dt'>;
+export declare const MetadataListLabel: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export type MetadataListValueProps = ComponentPropsWithRef<'dd'>;
+export declare const MetadataListValue: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;

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

@@ -5,6 +5,7 @@ declare const iconTypeMap: {
     caution: string;
     danger: string;
     info: string;
+    success: string;
 };
 export interface NoticeProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
     type?: keyof typeof iconTypeMap;

package/lib/index.d.ts

@@ -44,6 +44,7 @@ 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';
+export { MetadataList, MetadataListItem, MetadataListLabel, MetadataListValue } from './components/MetadataList';
 export { default as Stepper, Step } from './components/Stepper';
 export { default as Panel, PanelHeader, PanelContent } from './components/Panel';
 export { default as ProgressBar } from './components/ProgressBar';
@@ -67,7 +68,7 @@ export { default as PageHeader } from './components/PageHeader';
 export { default as SectionHeader } from './components/SectionHeader';
 export { default as EmptyState } from './components/EmptyState';
 export { ActionList, ActionListItem, ActionListGroup, ActionListSeparator, ActionListLinkItem } from './components/ActionList';
-export { ActionMenu } from './components/ActionMenu';
+export { ActionMenu, type ActionMenuTriggerProps, type ActionMenuTriggerFunction } from './components/ActionMenu';
 export { default as TreeView, type TreeViewNode } from './components/TreeView';
 /**
  * Helpers / Utils

package/lib/index.js

@@ -177,6 +177,7 @@ var iconTypes = [
     'radio-unchecked',
     'recycle-square',
     'recycle',
+    'report',
     'resend',
     'robot',
     'run-again',
@@ -266,6 +267,7 @@ function __variableDynamicImportRuntime0__(path) {
     case './icons/radio-unchecked.svg': return Promise.resolve().then(function () { return require('./radio-unchecked.js'); });
     case './icons/recycle-square.svg': return Promise.resolve().then(function () { return require('./recycle-square.js'); });
     case './icons/recycle.svg': return Promise.resolve().then(function () { return require('./recycle.js'); });
+    case './icons/report.svg': return Promise.resolve().then(function () { return require('./report.js'); });
     case './icons/resend.svg': return Promise.resolve().then(function () { return require('./resend.js'); });
     case './icons/robot.svg': return Promise.resolve().then(function () { return require('./robot.js'); });
     case './icons/run-again.svg': return Promise.resolve().then(function () { return require('./run-again.js'); });
@@ -3366,6 +3368,27 @@ var DescriptionDetails = function (_a) {
 };
 DescriptionDetails.displayName = 'DescriptionDetails';
 
+var MetadataList = React.forwardRef(function (_a, ref) {
+    var _b = _a.orientation, orientation = _b === void 0 ? 'horizontal' : _b, className = _a.className, children = _a.children, rest = tslib.__rest(_a, ["orientation", "className", "children"]);
+    return (React__default["default"].createElement("dl", tslib.__assign({ className: classNames__default["default"]('MetadataList', "MetadataList--".concat(orientation), className), ref: ref }, rest), children));
+});
+MetadataList.displayName = 'MetadataList';
+var MetadataListItem = React.forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, rest = tslib.__rest(_a, ["className", "children"]);
+    return (React__default["default"].createElement("div", tslib.__assign({ className: classNames__default["default"]('MetadataList__item', className), ref: ref }, rest), children));
+});
+MetadataListItem.displayName = 'MetadataListItem';
+var MetadataListLabel = React.forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, rest = tslib.__rest(_a, ["className", "children"]);
+    return (React__default["default"].createElement("dt", tslib.__assign({ className: classNames__default["default"]('MetadataList__label', className), ref: ref }, rest), children));
+});
+MetadataListLabel.displayName = 'MetadataListLabel';
+var MetadataListValue = React.forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, rest = tslib.__rest(_a, ["className", "children"]);
+    return (React__default["default"].createElement("dd", tslib.__assign({ className: classNames__default["default"]('MetadataList__value', className), ref: ref }, rest), children));
+});
+MetadataListValue.displayName = 'MetadataListValue';
+
 var isTooltipProps = function (props) {
     return !!props.tooltip;
 };
@@ -3695,8 +3718,9 @@ ColumnList.displayName = 'ColumnList';
 
 var iconTypeMap = {
     caution: 'caution',
-    danger: 'caution',
-    info: 'info-circle'
+    danger: 'report',
+    info: 'info-circle',
+    success: 'check-circle'
 };
 var Notice = React.forwardRef(function (_a, ref) {
     var _b;
@@ -5309,7 +5333,7 @@ var ActionListLinkItem = React.forwardRef(function (_a, ref) {
 ActionListLinkItem.displayName = 'ActionListLinkItem';
 
 var _a = tslib.__read(['ArrowDown', 'ArrowUp'], 2), ArrowDown = _a[0], ArrowUp = _a[1];
-var ActionMenu = React.forwardRef(function (_a, ref) {
+var ActionMenuComponent = React.forwardRef(function (_a, ref) {
     var className = _a.className, style = _a.style, trigger = _a.trigger, _b = _a.placement, placement = _b === void 0 ? 'bottom-start' : _b, actionMenuList = _a.children, portal = _a.portal, _c = _a.renderInTrigger, renderInTrigger = _c === void 0 ? false : _c, props = tslib.__rest(_a, ["className", "style", "trigger", "placement", "children", "portal", "renderInTrigger"]);
     var _d = tslib.__read(React.useState(false), 2), open = _d[0], setOpen = _d[1];
     var _e = tslib.__read(React.useState('first'), 2), focusStrategy = _e[0], setFocusStrategy = _e[1];
@@ -5427,7 +5451,8 @@ var ActionMenu = React.forwardRef(function (_a, ref) {
         React__default["default"].createElement(ClickOutsideListener$1, { onClickOutside: handleClickOutside, mouseEvent: open ? undefined : false, touchEvent: open ? undefined : false, target: triggerProps.ref }, actionMenuTrigger),
         renderInTrigger ? null : overlay));
 });
-ActionMenu.displayName = 'ActionMenu';
+ActionMenuComponent.displayName = 'ActionMenu';
+var ActionMenu = ActionMenuComponent;
 
 var TreeViewItem = function (_a) {
     var id = _a.id, textValue = _a.textValue, children = _a.children;
@@ -5625,7 +5650,7 @@ var ThemeProvider = function (_a) {
     // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
     _b = _a.context, 
     // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
-    context = _b === void 0 ? document === null || document === void 0 ? void 0 : document.body : _b, _c = _a.initialTheme, initialTheme = _c === void 0 ? 'light' : _c;
+    context = _b === void 0 ? typeof document !== 'undefined' ? document.body : undefined : _b, _c = _a.initialTheme, initialTheme = _c === void 0 ? 'light' : _c;
     var _d = tslib.__read(React.useState(initialTheme), 2), theme = _d[0], setTheme = _d[1];
     var getThemeFromContext = function () {
         return (context === null || context === void 0 ? void 0 : context.classList.contains(DARK_THEME_CLASS)) ? 'dark' : 'light';
@@ -5744,6 +5769,10 @@ exports.LoaderOverlay = LoaderOverlay;
 exports.Main = Main;
 exports.MenuBar = TopBar$1;
 exports.MenuItem = MenuItem;
+exports.MetadataList = MetadataList;
+exports.MetadataListItem = MetadataListItem;
+exports.MetadataListLabel = MetadataListLabel;
+exports.MetadataListValue = MetadataListValue;
 exports.Modal = Modal;
 exports.ModalCloseButton = ModalCloseButton;
 exports.ModalContent = ModalContent;

package/lib/report.js

@@ -0,0 +1,36 @@
+'use strict';
+
+var React = require('react');
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n["default"] = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const SvgReport = props => /*#__PURE__*/React__namespace.createElement("svg", _extends({
+  viewBox: "0 -960 960 960",
+  fill: "currentColor",
+  height: 24,
+  width: 24
+}, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
+  d: "M480-280q17 0 28.5-11.5T520-320q0-17-11.5-28.5T480-360q-17 0-28.5 11.5T440-320q0 17 11.5 28.5T480-280Zm-40-160h80v-240h-80v240ZM330-120 120-330v-300l210-210h300l210 210v300L630-120H330Z"
+})));
+
+exports["default"] = SvgReport;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "7.2.0",
+  "version": "7.3.0-canary.588f1404",
   "license": "MPL-2.0",
   "description": "Fully accessible react components library for Deque Cauldron",
   "homepage": "https://cauldron.dequelabs.com/",
@@ -25,6 +25,7 @@
     "tslib": "^2.4.0"
   },
   "devDependencies": {
+    "@arethetypeswrong/cli": "^0.18.4",
     "@babel/core": "^7.29.7",
     "@babel/plugin-proposal-export-default-from": "^7.29.7",
     "@babel/preset-env": "^7.29.7",
@@ -60,6 +61,7 @@
     "postcss-import": "^16.1.1",
     "postcss-loader": "^8.2.1",
     "prop-types": "^15.8.1",
+    "publint": "^0.3.21",
     "react": "^19",
     "react-dom": "^19",
     "rollup": "^2.23.0",
@@ -81,6 +83,7 @@
     "build:lib": "rollup -c",
     "build:css": "postcss --output=lib/cauldron.css src/index.css",
     "typecheck": "tsc --noEmit --skipLibCheck",
+    "verify:packaging": "pnpm build && node scripts/verifyPackaging.js",
     "dev": "concurrently 'pnpm build:css --watch' 'rollup -c --watch'",
     "test": "jest --maxWorkers=1 --coverage",
     "figma:parse": "figma connect parse",