@wavv/ui 2.4.4-alpha.1 → 2.4.4-alpha.2

package/build/components/Dialog.d.ts

@@ -15,8 +15,12 @@ type DialogProps = {
     confirmText?: string;
     /** The confirm button will be negative (red) */
     negative?: boolean;
+    /** Disables the confirm button */
+    confirmDisabled?: boolean;
     /** The function called when the confirm button is clicked */
     onConfirm?: () => void;
+    /** The function called when the cancel button is clicked */
+    onCancel?: () => void;
     /** Controls whether or not the Dialog is open */
     visible: boolean;
     /** The function called when the Dialog is closed */
@@ -46,5 +50,5 @@ type DialogProps = {
     /** The `aria-label` of the dialog */
     'aria-label'?: string;
 } & WidthHeight & MaxWidthHeight & MinWidthHeight & Padding & DivAttributes;
-declare const Dialog: ({ header, text, children, cancelText, confirmText, negative, onConfirm, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur, overlayColor, backgroundColor, inert, scopeRef, position, zIndex, ...props }: DialogProps) => import("react/jsx-runtime").JSX.Element;
+declare const Dialog: ({ header, text, children, cancelText, confirmText, negative, confirmDisabled, onConfirm, onCancel, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur, overlayColor, backgroundColor, inert, scopeRef, position, zIndex, ...props }: DialogProps) => import("react/jsx-runtime").JSX.Element;
 export default Dialog;

package/build/components/Dialog.js

@@ -1,11 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import styled from "@emotion/styled";
-import { Dialog, Modal, ModalOverlay } from "react-aria-components";
+import { Dialog, Heading, Modal, ModalOverlay } from "react-aria-components";
 import Button from "./Button/index.js";
 import { maxWidthHeightProps, minWidthHeightProps, paddingProps } from "./helpers/styledProps.js";
 import Icon from "./Icon/index.js";
 import PortalScope from "./PortalScope.js";
-const Dialog_Dialog = ({ header, text, children, cancelText = 'Cancel', confirmText = 'Okay', negative, onConfirm, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur = true, overlayColor, backgroundColor, inert, scopeRef, position, zIndex, ...props })=>{
+const Dialog_Dialog = ({ header, text, children, cancelText = 'Cancel', confirmText = 'Okay', negative, confirmDisabled, onConfirm, onCancel, visible, width, height, onClose, closeIcon, preventOverlayClose, overlayBlur = true, overlayColor, backgroundColor, inert, scopeRef, position, zIndex, ...props })=>{
     const { 'aria-label': ariaLabel, ...rest } = props;
     const handleOpenChange = (open)=>{
         if (!open) onClose();
@@ -36,6 +36,7 @@ const Dialog_Dialog = ({ header, text, children, cancelText = 'Cancel', confirmT
                     ...rest,
                     children: [
                         /*#__PURE__*/ jsxs(DialogHeader, {
+                            slot: "title",
                             children: [
                                 header,
                                 closeIcon && /*#__PURE__*/ jsx(CloseInHeader, {
@@ -58,11 +59,12 @@ const Dialog_Dialog = ({ header, text, children, cancelText = 'Cancel', confirmT
                             children: [
                                 /*#__PURE__*/ jsx(Button, {
                                     secondary: true,
-                                    onClick: onClose,
+                                    onClick: onCancel || onClose,
                                     children: cancelText
                                 }),
                                 /*#__PURE__*/ jsx(Button, {
                                     negative: negative,
+                                    disabled: confirmDisabled,
                                     onClick: onConfirm,
                                     children: confirmText
                                 })
@@ -78,7 +80,7 @@ const Dialog_Dialog = ({ header, text, children, cancelText = 'Cancel', confirmT
         children: dialog
     }) : dialog;
 };
-const DialogHeader = styled.div(({ theme })=>({
+const DialogHeader = styled(Heading)(({ theme })=>({
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'space-between',

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wavv/ui",
-	"version": "2.4.4-alpha.1",
+	"version": "2.4.4-alpha.2",
 	"type": "module",
 	"exports": {
 		".": {