freemium-ui 2.0.0-beta.44 → 2.0.0-beta.46

package/index.cjs.js

@@ -2062,7 +2062,7 @@ modal:!0}))}))``,Ls=on(zs)``,Vs=on(Ss)``,As=on(Es)``,ks=on(Ms)`
   line-height: ${({theme:e})=>e.typography.primary.lineHeight};
   letter-spacing: 0px;
   text-align: left;
-  padding: 0 32px ${({hasChildren:e})=>e?"16px":"32px"} 32px;
+  padding: 0 32px ${({$hasChildren:e})=>e?"16px":"32px"} 32px;
 `,Is=on.div`
   border-top: 1px solid ${({theme:e})=>e.colors.border.light};
   border-bottom-right-radius: 8px;
@@ -16079,18 +16079,19 @@ disabled:t?.disabled,className:"DropdownMenuItem",key:t?.[i],onSelect:()=>c?.(t)
 exports.CardActions=Sn,exports.CardContent=En,exports.CardDescription=Hn,
 exports.CardText=Dn,
 exports.CardTitle=_n,exports.Checkbox=Ac,exports.ChevronUp=rr,
-exports.Confirmation=({isOpen:t,title:n,description:r,onConfirm:a,onDismiss:o,cancelButtonText:i,children:l,cancelButtonDisabled:c,confirmButtonDisabled:s,confirmButtonText:u,bodyStyles:d,contentStyles:h,footerStyles:p,width:f="520px"})=>e.createElement(Ds,{
-open:t,onOpenChange:e=>{e||o?.("overlay")}
-},e.createElement(Ls,null,e.createElement(ks,{forceMount:!0,style:d,
-className:"AlertDialogOverlay",onClick:()=>o?.("overlay")}),e.createElement(Ts,{
-forceMount:!0,className:"AlertDialogContent",style:{...h,width:f}
-},n&&e.createElement(Rs,{className:"AlertDialogTitle"
-},n),r&&e.createElement(Ps,{hasChildren:!!l,className:"AlertDialogDescription"
-},r),l?e.createElement(e.Fragment,null,l):null,e.createElement(Is,{style:p
+exports.Confirmation=({isOpen:t,title:n,description:r,onConfirm:a,onDismiss:o,cancelButtonText:i,children:l,cancelButtonDisabled:c,confirmButtonDisabled:s,confirmButtonText:u,clickOutToClose:d=!1,bodyStyles:h,contentStyles:p,footerStyles:f,width:m="520px"})=>e.createElement(Ds,{
+open:t,onOpenChange:e=>{e||o?.("root")}
+},e.createElement(Ls,null,e.createElement(ks,{forceMount:!0,style:h,
+className:"AlertDialogOverlay",onClick:e=>{d&&o?.("overlay",e)}
+}),e.createElement(Ts,{forceMount:!0,className:"AlertDialogContent",style:{...p,
+width:m}},n&&e.createElement(Rs,{className:"AlertDialogTitle"
+},n),r&&e.createElement(Ps,{$hasChildren:!!l,className:"AlertDialogDescription"
+},r),l?e.createElement(e.Fragment,null,l):null,e.createElement(Is,{style:f
 },i&&e.createElement(Vs,{asChild:!0},e.createElement(tr,{variant:"secondary",
-autoFocus:!0,"aria-disabled":c,disabled:c,onClick:()=>o?.("button"),
-"aria-label":i},i)),u&&e.createElement(As,{asChild:!0},e.createElement(tr,{
-variant:"primary","aria-disabled":s,disabled:s,onClick:()=>a?.(),"aria-label":u
+autoFocus:!0,"aria-disabled":c,disabled:c,onClick:e=>{
+e.preventDefault(),o?.("button",e)},"aria-label":i},i)),u&&e.createElement(As,{
+asChild:!0},e.createElement(tr,{variant:"primary","aria-disabled":s,disabled:s,
+onClick:e=>{e.preventDefault(),a?.(e)},"aria-label":u
 },u)))))),exports.CrossIcon=qn,exports.DatePicker=t=>{
 const{placeholder:n,name:r,isRequired:a,label:o,isErrored:i,errorText:l,id:c,disabled:s,displayFormat:u="YYYY-MM-DD",...d}=t
 ;return e.createElement(jR,{id:`date-picker-container-${c??""}`.trim(),

package/index.d.ts

@@ -253,6 +253,10 @@ interface ConfirmationProps {
      * Is the cancel button disabled
      */
     cancelButtonDisabled?: boolean;
+    /**
+     * Should the confirmation close when clicking outside
+     */
+    clickOutToClose?: boolean;
     /**
      * Title of the confirmation
      */
@@ -268,11 +272,11 @@ interface ConfirmationProps {
     /**
      * Function to be called when the confirmation is dismissed
      */
-    onDismiss?: (type: 'overlay' | 'button') => void;
+    onDismiss?: (type: 'overlay' | 'button' | 'root', event?: React.MouseEvent<HTMLElement, MouseEvent>) => void;
     /**
      * Function to be called when the confirmation is confirmed
      */
-    onConfirm?: () => void;
+    onConfirm?: React.DOMAttributes<HTMLButtonElement>['onClick'];
     /**
      * Confirm button text
      */
@@ -298,7 +302,7 @@ interface ConfirmationProps {
 /**
  * Confirmation component is used to show a confirmation dialog to the user. It is used to confirm an action before it is executed.
  */
-declare const Confirmation: ({ isOpen, title, description, onConfirm, onDismiss, cancelButtonText, children, cancelButtonDisabled, confirmButtonDisabled, confirmButtonText, bodyStyles, contentStyles, footerStyles, width, }: ConfirmationProps) => react__default.JSX.Element;
+declare const Confirmation: ({ isOpen, title, description, onConfirm, onDismiss, cancelButtonText, children, cancelButtonDisabled, confirmButtonDisabled, confirmButtonText, clickOutToClose, bodyStyles, contentStyles, footerStyles, width, }: ConfirmationProps) => react__default.JSX.Element;
 
 type DrawerSizeType = 'default' | 'medium' | 'small' | 'large' | 'x-large';
 type DrawerPlacement = 'left' | 'right';

package/index.js

@@ -2058,7 +2058,7 @@ const{__scopeAlertDialog:t,...n}=e,r=Is(t);return i(_s,Ln({},r,n,{modal:!0}))
   line-height: ${({theme:e})=>e.typography.primary.lineHeight};
   letter-spacing: 0px;
   text-align: left;
-  padding: 0 32px ${({hasChildren:e})=>e?"16px":"32px"} 32px;
+  padding: 0 32px ${({$hasChildren:e})=>e?"16px":"32px"} 32px;
 `,iu=En.div`
   border-top: 1px solid ${({theme:e})=>e.colors.border.light};
   border-bottom-right-radius: 8px;
@@ -2068,21 +2068,21 @@ const{__scopeAlertDialog:t,...n}=e,r=Is(t);return i(_s,Ln({},r,n,{modal:!0}))
   padding: 16px;
   gap: 8px;
   justify-content: flex-end;
-`,lu=({isOpen:e,title:n,description:r,onConfirm:a,onDismiss:o,cancelButtonText:i,children:l,cancelButtonDisabled:c,confirmButtonDisabled:s,confirmButtonText:u,bodyStyles:d,contentStyles:h,footerStyles:p,width:f="520px"})=>t.createElement(Qs,{
-open:e,onOpenChange:e=>{e||o?.("overlay")}
-},t.createElement(Js,null,t.createElement(nu,{forceMount:!0,style:d,
-className:"AlertDialogOverlay",onClick:()=>o?.("overlay")}),t.createElement(ru,{
-forceMount:!0,className:"AlertDialogContent",style:{...h,width:f}
-},n&&t.createElement(au,{className:"AlertDialogTitle"
-},n),r&&t.createElement(ou,{hasChildren:!!l,className:"AlertDialogDescription"
-},r),l?t.createElement(t.Fragment,null,l):null,t.createElement(iu,{style:p
+`,lu=({isOpen:e,title:n,description:r,onConfirm:a,onDismiss:o,cancelButtonText:i,children:l,cancelButtonDisabled:c,confirmButtonDisabled:s,confirmButtonText:u,clickOutToClose:d=!1,bodyStyles:h,contentStyles:p,footerStyles:f,width:m="520px"})=>t.createElement(Qs,{
+open:e,onOpenChange:e=>{e||o?.("root")}
+},t.createElement(Js,null,t.createElement(nu,{forceMount:!0,style:h,
+className:"AlertDialogOverlay",onClick:e=>{d&&o?.("overlay",e)}
+}),t.createElement(ru,{forceMount:!0,className:"AlertDialogContent",style:{...p,
+width:m}},n&&t.createElement(au,{className:"AlertDialogTitle"
+},n),r&&t.createElement(ou,{$hasChildren:!!l,className:"AlertDialogDescription"
+},r),l?t.createElement(t.Fragment,null,l):null,t.createElement(iu,{style:f
 },i&&t.createElement(eu,{asChild:!0},t.createElement(zr,{variant:"secondary",
-autoFocus:!0,"aria-disabled":c,disabled:c,onClick:()=>o?.("button"),
-"aria-label":i},i)),u&&t.createElement(tu,{asChild:!0},t.createElement(zr,{
-variant:"primary","aria-disabled":s,disabled:s,onClick:()=>a?.(),"aria-label":u
-},u)))))),cu={right:{x:"0",right:"0",top:"0"},left:{x:"0",left:"0",top:"0"}
-},su={small:"424px",default:"600px",medium:"720px",large:"800px",
-"x-large":"1200px"},uu=Hn`
+autoFocus:!0,"aria-disabled":c,disabled:c,onClick:e=>{
+e.preventDefault(),o?.("button",e)},"aria-label":i},i)),u&&t.createElement(tu,{
+asChild:!0},t.createElement(zr,{variant:"primary","aria-disabled":s,disabled:s,
+onClick:e=>{e.preventDefault(),a?.(e)},"aria-label":u},u)))))),cu={right:{x:"0",
+right:"0",top:"0"},left:{x:"0",left:"0",top:"0"}},su={small:"424px",
+default:"600px",medium:"720px",large:"800px","x-large":"1200px"},uu=Hn`
   from {
     opacity: 1;
     transform: translate(0px, 0px);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "freemium-ui",
-  "version": "2.0.0-beta.44",
+  "version": "2.0.0-beta.46",
   "description": "React Ui Components for Freemium Apps",
   "main": "./index.js",
   "module": "./index.js",