@tecsinapse/cortex-react 1.12.3 → 1.13.0-beta.1

package/dist/cjs/components/Menubar/Categories.js

@@ -11,10 +11,11 @@ require('react-dropzone');
 require('uuid');
 require('@floating-ui/react');
 require('currency.js');
+var CategoriesContext = require('../../provider/CategoriesContext.js');
 
 const Categories = ({ children }) => {
   const { width } = useDimensions.useDimensions();
-  return /* @__PURE__ */ React.createElement(Masonry, { columns: width <= 640 ? 2 : 4 }, children);
+  return /* @__PURE__ */ React.createElement(CategoriesContext.CategoriesProvider, null, /* @__PURE__ */ React.createElement(Masonry, { columns: width <= 640 ? 2 : 4 }, children));
 };
 
 module.exports = Categories;

package/dist/cjs/components/Menubar/DropdownRoot.js

@@ -28,6 +28,8 @@ const DropdownRoot = ({
           {
             key: prop.title,
             ...rest,
+            parentCategoryTitle: item.title,
+            title,
             subItems: items ?? [],
             renderSubItems: ({ title: title2, ...rest2 }) => {
               return /* @__PURE__ */ React.createElement(SubItem, { key: title2, ...rest2 }, title2);

package/dist/cjs/components/Menubar/Item.js

@@ -16,6 +16,7 @@ var useMenubar = require('../../provider/useMenubar.js');
 var menubar = require('../../styles/menubar.js');
 var IconControlSubItem = require('./IconControlSubItem.js');
 var ItemLink = require('./ItemLink.js');
+var CategoriesContext = require('../../provider/CategoriesContext.js');
 
 const { container, textBehavior } = menubar.item();
 const Item = ({
@@ -24,21 +25,24 @@ const Item = ({
   renderSubItems,
   className,
   anchorProps,
+  title,
+  parentCategoryTitle,
   ...rest
 }) => {
-  const [showSubItem, setShowSubItem] = React.useState(false);
   const hasSubItems = (subItems ?? []).length > 0;
   const [, setShow] = useMenubar.useMenubar();
+  const { expandedMenus, toggleSubmenu } = CategoriesContext.useCategories();
+  const isExpanded = expandedMenus[parentCategoryTitle] === title;
   const handleClickItemMenubar = React.useCallback(
     (e) => {
       if (hasSubItems) {
         e.stopPropagation();
-        setShowSubItem((prev) => !prev);
+        toggleSubmenu(parentCategoryTitle, title);
       } else {
         setShow(false);
       }
     },
-    []
+    [hasSubItems, parentCategoryTitle, title, toggleSubmenu, setShow]
   );
   return /* @__PURE__ */ React.createElement(ItemLink, { anchorProps }, /* @__PURE__ */ React.createElement(
     "div",
@@ -52,8 +56,14 @@ const Item = ({
       )
     },
     children,
-    hasSubItems ? /* @__PURE__ */ React.createElement(IconControlSubItem, { show: showSubItem, setShow: setShowSubItem }) : /* @__PURE__ */ React.createElement(React.Fragment, null)
-  ), showSubItem ? /* @__PURE__ */ React.createElement(React.Fragment, null, subItems?.map((subItem) => renderSubItems?.(subItem))) : /* @__PURE__ */ React.createElement(React.Fragment, null));
+    hasSubItems ? /* @__PURE__ */ React.createElement(
+      IconControlSubItem,
+      {
+        show: isExpanded,
+        setShow: () => toggleSubmenu(parentCategoryTitle, title)
+      }
+    ) : null
+  ), isExpanded ? /* @__PURE__ */ React.createElement(React.Fragment, null, subItems?.map((subItem) => renderSubItems?.(subItem))) : null);
 };
 
 module.exports = Item;

package/dist/cjs/hooks/useFileUpload.js

@@ -8,11 +8,14 @@ var types = require('../components/Uploader/types.js');
 const useFileUpload = ({
   accept = {},
   onAccept,
+  onFileRejected,
   maxSize,
   allowMultiple = true,
-  onFileRejected
+  preventDuplicates = false,
+  onDuplicate
 }) => {
   const [files, setFiles] = React.useState([]);
+  const [duplicates, setDuplicates] = React.useState([]);
   const [isOpen, setIsOpen] = React.useState(false);
   const onOpen = React.useCallback(() => setIsOpen(true), []);
   const onClose = React.useCallback(() => setIsOpen(false), []);
@@ -25,7 +28,21 @@ const useFileUpload = ({
     []
   );
   const onDrop = async (acceptedFiles) => {
-    const newFiles = acceptedFiles.map((file) => ({
+    let toProcess = acceptedFiles;
+    if (preventDuplicates) {
+      const found = (acceptedFiles ?? []).filter(
+        (file) => files.some((existing) => existing.file.name === file.name)
+      );
+      if (found.length > 0) {
+        setDuplicates(found);
+        onDuplicate?.(found);
+      }
+      toProcess = acceptedFiles.filter(
+        (file) => !found.some((dup) => dup.name === file.name)
+      );
+      if (toProcess.length === 0) return;
+    }
+    const newFiles = toProcess.map((file) => ({
       file,
       status: onAccept ? types.FileStatus.UPLOADING : types.FileStatus.SUCCESS,
       uid: uuid.v4()
@@ -86,6 +103,7 @@ const useFileUpload = ({
     },
     open: isOpen,
     files,
+    duplicates,
     onClearFiles: handleClearFiles
   };
 };

package/dist/cjs/provider/CategoriesContext.js

@@ -0,0 +1,27 @@
+'use strict';
+
+var React = require('react');
+
+const CategoriesContext = React.createContext(null);
+const CategoriesProvider = ({ children }) => {
+  const [expandedMenus, setExpandedMenus] = React.useState({});
+  const toggleSubmenu = (categoryId, submenuId) => {
+    setExpandedMenus((prev) => {
+      return {
+        ...prev,
+        [categoryId]: prev[categoryId] === submenuId ? null : submenuId
+      };
+    });
+  };
+  return /* @__PURE__ */ React.createElement(CategoriesContext.Provider, { value: { expandedMenus, toggleSubmenu } }, children);
+};
+const useCategories = () => {
+  const context = React.useContext(CategoriesContext);
+  if (!context) {
+    throw new Error("useCategories must be used within CategoriesProvider");
+  }
+  return context;
+};
+
+exports.CategoriesProvider = CategoriesProvider;
+exports.useCategories = useCategories;

package/dist/esm/components/Menubar/Categories.js

@@ -9,10 +9,11 @@ import 'react-dropzone';
 import 'uuid';
 import '@floating-ui/react';
 import 'currency.js';
+import { CategoriesProvider } from '../../provider/CategoriesContext.js';
 
 const Categories = ({ children }) => {
   const { width } = useDimensions();
-  return /* @__PURE__ */ React__default.createElement(Masonry, { columns: width <= 640 ? 2 : 4 }, children);
+  return /* @__PURE__ */ React__default.createElement(CategoriesProvider, null, /* @__PURE__ */ React__default.createElement(Masonry, { columns: width <= 640 ? 2 : 4 }, children));
 };
 
 export { Categories as default };

package/dist/esm/components/Menubar/DropdownRoot.js

@@ -26,6 +26,8 @@ const DropdownRoot = ({
           {
             key: prop.title,
             ...rest,
+            parentCategoryTitle: item.title,
+            title,
             subItems: items ?? [],
             renderSubItems: ({ title: title2, ...rest2 }) => {
               return /* @__PURE__ */ React__default.createElement(SubItem, { key: title2, ...rest2 }, title2);

package/dist/esm/components/Menubar/Item.js

@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import React__default, { useState, useCallback } from 'react';
+import React__default, { useCallback } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
@@ -14,6 +14,7 @@ import { useMenubar } from '../../provider/useMenubar.js';
 import { item } from '../../styles/menubar.js';
 import IconControlSubItem from './IconControlSubItem.js';
 import ItemLink from './ItemLink.js';
+import { useCategories } from '../../provider/CategoriesContext.js';
 
 const { container, textBehavior } = item();
 const Item = ({
@@ -22,21 +23,24 @@ const Item = ({
   renderSubItems,
   className,
   anchorProps,
+  title,
+  parentCategoryTitle,
   ...rest
 }) => {
-  const [showSubItem, setShowSubItem] = useState(false);
   const hasSubItems = (subItems ?? []).length > 0;
   const [, setShow] = useMenubar();
+  const { expandedMenus, toggleSubmenu } = useCategories();
+  const isExpanded = expandedMenus[parentCategoryTitle] === title;
   const handleClickItemMenubar = useCallback(
     (e) => {
       if (hasSubItems) {
         e.stopPropagation();
-        setShowSubItem((prev) => !prev);
+        toggleSubmenu(parentCategoryTitle, title);
       } else {
         setShow(false);
       }
     },
-    []
+    [hasSubItems, parentCategoryTitle, title, toggleSubmenu, setShow]
   );
   return /* @__PURE__ */ React__default.createElement(ItemLink, { anchorProps }, /* @__PURE__ */ React__default.createElement(
     "div",
@@ -50,8 +54,14 @@ const Item = ({
       )
     },
     children,
-    hasSubItems ? /* @__PURE__ */ React__default.createElement(IconControlSubItem, { show: showSubItem, setShow: setShowSubItem }) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null)
-  ), showSubItem ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, subItems?.map((subItem) => renderSubItems?.(subItem))) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+    hasSubItems ? /* @__PURE__ */ React__default.createElement(
+      IconControlSubItem,
+      {
+        show: isExpanded,
+        setShow: () => toggleSubmenu(parentCategoryTitle, title)
+      }
+    ) : null
+  ), isExpanded ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, subItems?.map((subItem) => renderSubItems?.(subItem))) : null);
 };
 
 export { Item as default };

package/dist/esm/hooks/useFileUpload.js

@@ -6,11 +6,14 @@ import { FileStatus, AcceptSpecificMap } from '../components/Uploader/types.js';
 const useFileUpload = ({
   accept = {},
   onAccept,
+  onFileRejected,
   maxSize,
   allowMultiple = true,
-  onFileRejected
+  preventDuplicates = false,
+  onDuplicate
 }) => {
   const [files, setFiles] = useState([]);
+  const [duplicates, setDuplicates] = useState([]);
   const [isOpen, setIsOpen] = useState(false);
   const onOpen = useCallback(() => setIsOpen(true), []);
   const onClose = useCallback(() => setIsOpen(false), []);
@@ -23,7 +26,21 @@ const useFileUpload = ({
     []
   );
   const onDrop = async (acceptedFiles) => {
-    const newFiles = acceptedFiles.map((file) => ({
+    let toProcess = acceptedFiles;
+    if (preventDuplicates) {
+      const found = (acceptedFiles ?? []).filter(
+        (file) => files.some((existing) => existing.file.name === file.name)
+      );
+      if (found.length > 0) {
+        setDuplicates(found);
+        onDuplicate?.(found);
+      }
+      toProcess = acceptedFiles.filter(
+        (file) => !found.some((dup) => dup.name === file.name)
+      );
+      if (toProcess.length === 0) return;
+    }
+    const newFiles = toProcess.map((file) => ({
       file,
       status: onAccept ? FileStatus.UPLOADING : FileStatus.SUCCESS,
       uid: v4()
@@ -84,6 +101,7 @@ const useFileUpload = ({
     },
     open: isOpen,
     files,
+    duplicates,
     onClearFiles: handleClearFiles
   };
 };

package/dist/esm/provider/CategoriesContext.js

@@ -0,0 +1,24 @@
+import React__default, { createContext, useState, useContext } from 'react';
+
+const CategoriesContext = createContext(null);
+const CategoriesProvider = ({ children }) => {
+  const [expandedMenus, setExpandedMenus] = useState({});
+  const toggleSubmenu = (categoryId, submenuId) => {
+    setExpandedMenus((prev) => {
+      return {
+        ...prev,
+        [categoryId]: prev[categoryId] === submenuId ? null : submenuId
+      };
+    });
+  };
+  return /* @__PURE__ */ React__default.createElement(CategoriesContext.Provider, { value: { expandedMenus, toggleSubmenu } }, children);
+};
+const useCategories = () => {
+  const context = useContext(CategoriesContext);
+  if (!context) {
+    throw new Error("useCategories must be used within CategoriesProvider");
+  }
+  return context;
+};
+
+export { CategoriesProvider, useCategories };

package/dist/types/components/Menubar/Item.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { ItemProps } from './types';
-declare const Item: <T>({ children, subItems, renderSubItems, className, anchorProps, ...rest }: ItemProps<T>) => React.JSX.Element;
+declare const Item: <T>({ children, subItems, renderSubItems, className, anchorProps, title, parentCategoryTitle, ...rest }: ItemProps<T>) => React.JSX.Element;
 export default Item;

package/dist/types/components/Menubar/index.d.ts

@@ -9,7 +9,7 @@ export declare const Menubar: {
     MostUsedItem: ({ title, category, anchorProps, ...rest }: import("./types").MostUsedItemProps) => import("react").JSX.Element;
     Category: <T>({ title, options, render }: import("./types").CategoryType<T>) => import("react").JSX.Element;
     Categories: ({ children }: import("./types").DefaultProps) => import("react").JSX.Element;
-    Item: <T>({ children, subItems, renderSubItems, className, anchorProps, ...rest }: import("./types").ItemProps<T>) => import("react").JSX.Element;
+    Item: <T>({ children, subItems, renderSubItems, className, anchorProps, title, parentCategoryTitle, ...rest }: import("./types").ItemProps<T>) => import("react").JSX.Element;
     SubItem: ({ children, anchorProps, className, ...rest }: import("./types").SubItemProps) => import("react").JSX.Element;
     DropdownRoot: ({ mostUsed, options, labelMostUsed, }: import("./types").DropdownRootProps) => import("react").JSX.Element;
 };

package/dist/types/components/Menubar/types.d.ts

@@ -54,4 +54,6 @@ export interface ItemProps<T> extends DefaultProps {
     subItems?: T[];
     renderSubItems?: (prop: T) => React.ReactNode;
     anchorProps?: React.AnchorHTMLAttributes<HTMLAnchorElement>;
+    parentCategoryTitle: string;
+    title: string;
 }

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

@@ -9,18 +9,20 @@ interface UseFileUploadOptions<T> {
         TEXT?: (typeof AcceptSpecificMap.TEXT)[number][];
     };
     onAccept?: (files: FileUpload<T>[]) => Promise<FileUpload<T>[]>;
+    onFileRejected?: (fileRejections: FileRejection[], event: DropEvent) => void;
     maxSize?: number;
     allowMultiple?: boolean;
-    onDelete?: (file: FileUpload<T>) => Promise<void>;
-    onFileRejected?: (fileRejections: FileRejection[], event: DropEvent) => void;
+    preventDuplicates?: boolean;
+    onDuplicate?: (duplicates: File[]) => void;
 }
-export declare const useFileUpload: <T>({ accept, onAccept, maxSize, allowMultiple, onFileRejected, }: UseFileUploadOptions<T>) => {
+export declare const useFileUpload: <T>({ accept, onAccept, onFileRejected, maxSize, allowMultiple, preventDuplicates, onDuplicate, }: UseFileUploadOptions<T>) => {
     onOpen: () => void;
     onClose: () => void;
     onDelete: (index: number) => void;
     dropzoneProps: UseDropzoneProps;
     open: boolean;
     files: FileUpload<T>[];
+    duplicates: File[];
     onClearFiles: () => void;
 };
 export {};

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

@@ -0,0 +1,13 @@
+import React, { ReactNode } from 'react';
+interface ExpandedMenusState {
+    [categoryId: string]: string | null;
+}
+interface CategoriesContextProps {
+    expandedMenus: ExpandedMenusState;
+    toggleSubmenu: (categoryId: string, submenuId: string) => void;
+}
+export declare const CategoriesProvider: ({ children }: {
+    children: ReactNode;
+}) => React.JSX.Element;
+export declare const useCategories: () => CategoriesContextProps;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.12.3",
+  "version": "1.13.0-beta.1",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -47,5 +47,5 @@
     "react-icons": ">=5.2.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "645721229663f033e51773fd612a0fce2a3686c3"
+  "gitHead": "63a5eb0b70ad18f30ecd015e420aa8b4f4fdc2bd"
 }