@tecsinapse/cortex-react 1.5.2 → 1.5.4

package/dist/cjs/components/DatePicker/Content.js

@@ -1,21 +1,9 @@
 'use strict';
 
 var React = require('react');
-require('@internationalized/date');
-require('react-aria');
-require('react-stately');
-require('@floating-ui/react');
-require('currency.js');
-var useOutsideClickListener = require('../../hooks/useOutsideClickListener.js');
-var Context = require('../Popover/Context.js');
 
 const Content = ({ children }) => {
-  const { setIsOpen } = Context.usePopoverContext();
   const ref = React.useRef(null);
-  useOutsideClickListener.useOutsideClickListener({
-    ref,
-    onClickOutside: () => setIsOpen(false)
-  });
   return /* @__PURE__ */ React.createElement("div", { ref }, children);
 };
 

package/dist/cjs/components/Popover/Content.js

@@ -3,16 +3,27 @@
 var clsx = require('clsx');
 var React = require('react');
 var Context = require('./Context.js');
+var react = require('@floating-ui/react');
 
 const PopoverContent = ({
   children,
   className
 }) => {
-  const { isOpen, x, y, strategy, floatingStyles, refs } = Context.usePopoverContext();
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, isOpen ? /* @__PURE__ */ React.createElement(
+  const {
+    isOpen,
+    x,
+    y,
+    strategy,
+    floatingStyles,
+    refs,
+    getFloatingProps,
+    context
+  } = Context.usePopoverContext();
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, isOpen && /* @__PURE__ */ React.createElement(react.FloatingFocusManager, { context, modal: true }, /* @__PURE__ */ React.createElement(
     "div",
     {
       ref: refs.setFloating,
+      ...getFloatingProps(),
       className: clsx(
         "border border-gray-200 bg-black p-[0px] rounded-md shadow-lg z-popover",
         className
@@ -25,7 +36,7 @@ const PopoverContent = ({
       }
     },
     children
-  ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
+  )));
 };
 
 exports.PopoverContent = PopoverContent;

package/dist/cjs/components/Select/Content.js

@@ -2,21 +2,9 @@
 
 var clsx = require('clsx');
 var React = require('react');
-require('@internationalized/date');
-require('react-aria');
-require('react-stately');
-require('@floating-ui/react');
-require('currency.js');
-var useOutsideClickListener = require('../../hooks/useOutsideClickListener.js');
-var Context = require('../Popover/Context.js');
 
 const Content = ({ children, className }) => {
-  const { setIsOpen } = Context.usePopoverContext();
   const ref = React.useRef(null);
-  useOutsideClickListener.useOutsideClickListener({
-    ref,
-    onClickOutside: () => setIsOpen(false)
-  });
   return /* @__PURE__ */ React.createElement("div", { className: clsx("w-full relative", className), ref }, children);
 };
 

package/dist/cjs/hooks/useFloatingLogic.js

@@ -13,6 +13,8 @@ const useFloatingLogic = ({
     {
       placement,
       whileElementsMounted: react.autoUpdate,
+      open: isOpen,
+      onOpenChange: setIsOpen,
       middleware: [
         react.offset(10),
         react.flip({
@@ -24,6 +26,14 @@ const useFloatingLogic = ({
       ]
     }
   );
+  const click = react.useClick(context);
+  const dismiss = react.useDismiss(context);
+  const role = react.useRole(context);
+  const { getReferenceProps, getFloatingProps } = react.useInteractions([
+    click,
+    dismiss,
+    role
+  ]);
   React.useEffect(() => {
     if (isOpen) update();
   }, [isOpen, update]);
@@ -35,7 +45,8 @@ const useFloatingLogic = ({
     },
     ...trigger === "click" && {
       onClick: () => setIsOpen((prev) => !prev)
-    }
+    },
+    ...getReferenceProps()
   };
   return {
     isOpen,
@@ -46,7 +57,9 @@ const useFloatingLogic = ({
     refs,
     context,
     floatingStyles,
-    triggerProps
+    triggerProps,
+    getReferenceProps,
+    getFloatingProps
   };
 };
 

package/dist/cjs/provider/SnackbarProvider.js

@@ -5,8 +5,11 @@ var sonner = require('sonner');
 var SnackbarSonner = require('../service/SnackbarSonner.js');
 
 const SnackbarContext = React.createContext(null);
-const SnackbarProvider = ({ children }) => {
-  const snackbar = new SnackbarSonner.SnackbarSonner();
+const SnackbarProvider = ({
+  children,
+  options
+}) => {
+  const snackbar = new SnackbarSonner.SnackbarSonner(options);
   return /* @__PURE__ */ React.createElement(SnackbarContext.Provider, { value: { snackbar } }, children, /* @__PURE__ */ React.createElement(sonner.Toaster, null));
 };
 const useSnackbar = () => {

package/dist/cjs/service/SnackbarSonner.js

@@ -5,10 +5,14 @@ var sonner = require('sonner');
 var DefaultSnack = require('../components/Snackbar/DefaultSnack.js');
 
 class SnackbarSonner {
+  _options;
+  constructor(options) {
+    this._options = { ...options, duration: options?.duration ?? 5e3 };
+  }
   custom(Component, options) {
     return sonner.toast.custom(() => Component, {
-      ...options,
-      duration: options?.duration ?? 5e3
+      ...this._options,
+      ...options
     });
   }
   show(type, message, options) {
@@ -23,7 +27,7 @@ class SnackbarSonner {
           }
         );
       },
-      { ...options, duration: options?.duration ?? 5e3 }
+      { ...this._options, ...options }
     );
   }
 }

package/dist/esm/components/DatePicker/Content.js

@@ -1,19 +1,7 @@
 import React__default, { useRef } from 'react';
-import '@internationalized/date';
-import 'react-aria';
-import 'react-stately';
-import '@floating-ui/react';
-import 'currency.js';
-import { useOutsideClickListener } from '../../hooks/useOutsideClickListener.js';
-import { usePopoverContext } from '../Popover/Context.js';
 
 const Content = ({ children }) => {
-  const { setIsOpen } = usePopoverContext();
   const ref = useRef(null);
-  useOutsideClickListener({
-    ref,
-    onClickOutside: () => setIsOpen(false)
-  });
   return /* @__PURE__ */ React__default.createElement("div", { ref }, children);
 };
 

package/dist/esm/components/Popover/Content.js

@@ -1,16 +1,27 @@
 import clsx from 'clsx';
 import React__default from 'react';
 import { usePopoverContext } from './Context.js';
+import { FloatingFocusManager } from '@floating-ui/react';
 
 const PopoverContent = ({
   children,
   className
 }) => {
-  const { isOpen, x, y, strategy, floatingStyles, refs } = usePopoverContext();
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, isOpen ? /* @__PURE__ */ React__default.createElement(
+  const {
+    isOpen,
+    x,
+    y,
+    strategy,
+    floatingStyles,
+    refs,
+    getFloatingProps,
+    context
+  } = usePopoverContext();
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, isOpen && /* @__PURE__ */ React__default.createElement(FloatingFocusManager, { context, modal: true }, /* @__PURE__ */ React__default.createElement(
     "div",
     {
       ref: refs.setFloating,
+      ...getFloatingProps(),
       className: clsx(
         "border border-gray-200 bg-black p-[0px] rounded-md shadow-lg z-popover",
         className
@@ -23,7 +34,7 @@ const PopoverContent = ({
       }
     },
     children
-  ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+  )));
 };
 
 export { PopoverContent };

package/dist/esm/components/Select/Content.js

@@ -1,20 +1,8 @@
 import clsx from 'clsx';
 import React__default, { useRef } from 'react';
-import '@internationalized/date';
-import 'react-aria';
-import 'react-stately';
-import '@floating-ui/react';
-import 'currency.js';
-import { useOutsideClickListener } from '../../hooks/useOutsideClickListener.js';
-import { usePopoverContext } from '../Popover/Context.js';
 
 const Content = ({ children, className }) => {
-  const { setIsOpen } = usePopoverContext();
   const ref = useRef(null);
-  useOutsideClickListener({
-    ref,
-    onClickOutside: () => setIsOpen(false)
-  });
   return /* @__PURE__ */ React__default.createElement("div", { className: clsx("w-full relative", className), ref }, children);
 };
 

package/dist/esm/hooks/useFloatingLogic.js

@@ -1,5 +1,5 @@
 import { useState, useEffect } from 'react';
-import { useFloating, autoUpdate, offset, flip, shift, arrow } from '@floating-ui/react';
+import { useFloating, autoUpdate, offset, flip, shift, arrow, useClick, useDismiss, useRole, useInteractions } from '@floating-ui/react';
 
 const useFloatingLogic = ({
   placement,
@@ -11,6 +11,8 @@ const useFloatingLogic = ({
     {
       placement,
       whileElementsMounted: autoUpdate,
+      open: isOpen,
+      onOpenChange: setIsOpen,
       middleware: [
         offset(10),
         flip({
@@ -22,6 +24,14 @@ const useFloatingLogic = ({
       ]
     }
   );
+  const click = useClick(context);
+  const dismiss = useDismiss(context);
+  const role = useRole(context);
+  const { getReferenceProps, getFloatingProps } = useInteractions([
+    click,
+    dismiss,
+    role
+  ]);
   useEffect(() => {
     if (isOpen) update();
   }, [isOpen, update]);
@@ -33,7 +43,8 @@ const useFloatingLogic = ({
     },
     ...trigger === "click" && {
       onClick: () => setIsOpen((prev) => !prev)
-    }
+    },
+    ...getReferenceProps()
   };
   return {
     isOpen,
@@ -44,7 +55,9 @@ const useFloatingLogic = ({
     refs,
     context,
     floatingStyles,
-    triggerProps
+    triggerProps,
+    getReferenceProps,
+    getFloatingProps
   };
 };
 

package/dist/esm/provider/SnackbarProvider.js

@@ -3,8 +3,11 @@ import { Toaster } from 'sonner';
 import { SnackbarSonner } from '../service/SnackbarSonner.js';
 
 const SnackbarContext = createContext(null);
-const SnackbarProvider = ({ children }) => {
-  const snackbar = new SnackbarSonner();
+const SnackbarProvider = ({
+  children,
+  options
+}) => {
+  const snackbar = new SnackbarSonner(options);
   return /* @__PURE__ */ React__default.createElement(SnackbarContext.Provider, { value: { snackbar } }, children, /* @__PURE__ */ React__default.createElement(Toaster, null));
 };
 const useSnackbar = () => {

package/dist/esm/service/SnackbarSonner.js

@@ -3,10 +3,14 @@ import { toast } from 'sonner';
 import { DefaultSnack } from '../components/Snackbar/DefaultSnack.js';
 
 class SnackbarSonner {
+  _options;
+  constructor(options) {
+    this._options = { ...options, duration: options?.duration ?? 5e3 };
+  }
   custom(Component, options) {
     return toast.custom(() => Component, {
-      ...options,
-      duration: options?.duration ?? 5e3
+      ...this._options,
+      ...options
     });
   }
   show(type, message, options) {
@@ -21,7 +25,7 @@ class SnackbarSonner {
           }
         );
       },
-      { ...options, duration: options?.duration ?? 5e3 }
+      { ...this._options, ...options }
     );
   }
 }

package/dist/types/components/Popover/Context.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Placement } from '@floating-ui/react';
+import { FloatingContext, Placement, UseInteractionsReturn } from '@floating-ui/react';
 interface ContextProps {
     triggerProps?: any;
     refs?: any;
@@ -12,6 +12,9 @@ interface ContextProps {
     placement?: Placement;
     setPlacement?: React.Dispatch<React.SetStateAction<Placement | undefined>>;
     setTrigger?: React.Dispatch<React.SetStateAction<'hover' | 'click'>>;
+    getReferenceProps: UseInteractionsReturn['getReferenceProps'];
+    getFloatingProps: UseInteractionsReturn['getFloatingProps'];
+    context: FloatingContext;
 }
 export declare const Context: React.Context<ContextProps | undefined>;
 export declare const usePopoverContext: () => ContextProps;

package/dist/types/hooks/useFloatingLogic.d.ts

@@ -42,5 +42,7 @@ export declare const useFloatingLogic: ({ placement, trigger, arrowRef, }: Float
         onMouseLeave?: (() => void) | undefined;
         ref: ((node: import("@floating-ui/react-dom").ReferenceType | null) => void) & ((node: import("@floating-ui/react").ReferenceType | null) => void);
     };
+    getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
+    getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
 };
 export {};

package/dist/types/provider/SnackbarProvider.d.ts

@@ -1,10 +1,12 @@
 import { ReactNode } from 'react';
+import { type ExternalToast } from 'sonner';
 import { SnackbarSonner } from '../service/SnackbarSonner';
 interface SnackbarProviderProps {
     snackbar: SnackbarSonner;
 }
-export declare const SnackbarProvider: ({ children }: {
+export declare const SnackbarProvider: ({ children, options, }: {
     children: ReactNode;
+    options?: ExternalToast;
 }) => JSX.Element;
 export declare const useSnackbar: () => SnackbarProviderProps;
 export {};

package/dist/types/service/ISnackbar.d.ts

@@ -1,7 +1,8 @@
-import { ReactElement } from 'react';
 import { SnackbarVariants } from '@tecsinapse/cortex-core';
+import { ReactElement } from 'react';
 export type TypeSnack = SnackbarVariants['intent'];
 export interface ISnackbar<T> {
+    _options?: T;
     show(type: TypeSnack, message: string, options?: T): any;
     custom(component: ReactElement, options?: T): any;
 }

package/dist/types/service/SnackbarSonner.d.ts

@@ -2,6 +2,8 @@ import React from 'react';
 import { ExternalToast } from 'sonner';
 import { ISnackbar, TypeSnack } from './ISnackbar';
 export declare class SnackbarSonner implements ISnackbar<ExternalToast> {
+    _options?: ExternalToast;
+    constructor(options?: ExternalToast);
     custom(Component: React.ReactElement, options?: ExternalToast): string | number;
     show(type: TypeSnack, message: string, options?: Omit<ExternalToast, 'className' | 'style'>): string | number;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.5.2",
+  "version": "1.5.4",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -45,5 +45,5 @@
     "react-dom": ">=18.0.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "5b8a619a4dad4ec8a423e1e836d211262c1fc2bd"
+  "gitHead": "331072b5da891409d0d7bd89df4a86e4d77dd8b8"
 }