@trackunit/react-components 0.1.26 → 0.1.28

package/index.js

@@ -1001,9 +1001,9 @@ const StyledCardBody = twx(CardBody) `
  * @param {PopoverListItemProps} props - The props for the PopoverListItem component
  * @returns {JSX.Element} PopoverListItem component
  */
-const PopoverListItem = ({ selected, children, disabled, ariaLabel, url, onClick, prefix, suffix, dataTestId, }) => {
+const PopoverListItem = ({ selected, children, disabled, ariaLabel, url, onClick, prefix, suffix, dataTestId, className, }) => {
     const content = (jsxs("div", Object.assign({ className: "flex items-center gap-3" }, { children: [prefix && jsx("div", { children: prefix }), jsx(StyledText$2, Object.assign({ weight: selected ? "bold" : "normal", "$selected": selected }, { children: children })), suffix && jsx("div", { children: suffix })] })));
-    return (jsx(ListItem, Object.assign({ "$selected": selected, disabled: disabled, onClick: onClick, "aria-label": ariaLabel, "data-testid": dataTestId }, { children: url ? jsx(PopoverLink, Object.assign({ to: url }, { children: content })) : content })));
+    return (jsx(ListItem, Object.assign({ "$selected": selected, disabled: disabled, onClick: onClick, "aria-label": ariaLabel, "data-testid": dataTestId, className: className }, { children: url ? jsx(PopoverLink, Object.assign({ to: url }, { children: content })) : content })));
 };
 const StyledText$2 = twx(Text$1) `
   tu-popover-list-item__text
@@ -1483,10 +1483,10 @@ const Backdrop = tw.div `
  * - Modals interrupt a user's workflow by design.
  * - The modal component provides a foundation for creating dialogs, lightboxes, etc.
  */
-const Modal = React.forwardRef(({ isOpen, children, dataTestId, className, onDismissClick = () => {
+const Modal = React.forwardRef(({ isOpen, children, dataTestId, className, role = "", onDismissClick = () => {
     return;
 }, }, ref) => {
-    return (jsx(ModalBackdrop, Object.assign({ isVisible: isOpen, onClick: onDismissClick }, { children: isOpen && (jsx(StyledDiv, Object.assign({ ref: ref }, { children: jsx(StyledCard, Object.assign({ dataTestId: dataTestId, className: className }, { children: children })) }))) })));
+    return (jsx(ModalBackdrop, Object.assign({ isVisible: isOpen, onClick: onDismissClick }, { children: isOpen && (jsx(StyledDiv, Object.assign({ ref: ref, role: role }, { children: jsx(StyledCard, Object.assign({ dataTestId: dataTestId, className: className }, { children: children })) }))) })));
 });
 const StyledCard = twx(Card) `
   tu-modal__card

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "0.1.26",
+  "version": "0.1.28",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {

package/src/components/Modal/Modal.d.ts

@@ -17,6 +17,10 @@ export interface ModalProps extends CommonProps {
      * Test id to be applied to the modal.
      */
     dataTestId?: string;
+    /**
+     * Aria role to be applied to element
+     */
+    role?: string;
 }
 /**
  * - Modals are used to present critical information or request user input needed to complete a user's workflow.

package/src/components/Popover/PopoverListItem.d.ts

@@ -27,4 +27,4 @@ export interface PopoverListItemProps extends CommonProps {
  * @param {PopoverListItemProps} props - The props for the PopoverListItem component
  * @returns {JSX.Element} PopoverListItem component
  */
-export declare const PopoverListItem: ({ selected, children, disabled, ariaLabel, url, onClick, prefix, suffix, dataTestId, }: PopoverListItemProps) => JSX.Element;
+export declare const PopoverListItem: ({ selected, children, disabled, ariaLabel, url, onClick, prefix, suffix, dataTestId, className, }: PopoverListItemProps) => JSX.Element;