@andreagiugni/tailwind-dashboard-ui 0.5.17 → 0.5.19

package/README.md

@@ -38,7 +38,6 @@ data-viz component:
 |---|---|
 | `BarChart`, `LineChart` | `apexcharts`, `react-apexcharts` |
 | `Calendar` | `@fullcalendar/core`, `@fullcalendar/react`, `@fullcalendar/daygrid`, `@fullcalendar/timegrid`, `@fullcalendar/list`, `@fullcalendar/interaction` |
-| `CountryMap` | `@react-jvectormap/core`, `@react-jvectormap/world` |
 | `Editor` (WYSIWYG) | `@tiptap/react`, `@tiptap/pm`, `@tiptap/starter-kit`, `@tiptap/extension-link`, `@tiptap/extension-placeholder`, `@tiptap/extension-superscript`, `@tiptap/extension-subscript` |
 
 Install only the ones for the components you use, e.g.:
@@ -124,7 +123,6 @@ import {
   BarChart,
   LineChart,
   Calendar,
-  CountryMap,
   Editor,
 } from '@andreagiugni/tailwind-dashboard-ui';
 ```
@@ -167,7 +165,7 @@ Legend: **(+native)** = also extends the element's native HTML attributes.
 | `Alert` | `variant` (success/error/warning/info), `title`, `message`, `showLink`, `linkHref`, `linkText`, `icon?` (override icon), (+native div) |
 | `Avatar` | `src`, `alt`, `size` (xsmall…xxlarge), `status` (online/offline/busy/none), `statusColor?`, (+native img) |
 | `AvatarText` | `children`, `className`, (+native div) |
-| `Dropdown` | `isOpen`, `onClose`, `children`, `portal?` (default `true`, prevents clipping inside tables/overflow containers), (+native div) |
+| `Dropdown` | `isOpen`, `onClose`, `children`, `portal?` (default `true`, prevents clipping inside cards/tables/overflow containers), `triggerRef?` (optional custom trigger anchor), (+native div) |
 | `DropdownItem` | `variant` (default/primary/outline, like Button), `icon?`, `bgColor`/`textColor`/`borderColor` overrides, `tag` (a/button), `href`, `onClick`, `onItemClick`, `baseClassName` (full override) |
 | `Modal` | `isOpen`, `onClose`, `title?` (wrapping header aligned with close button), `showCloseButton`, `isFullscreen`, `closeOnBackdrop?`, `closeOnEsc?`; **alert preset** → `variant` (`success`/`info`/`warning`/`danger`) + `title`, `description`, `actionText?`, `onAction?`; (+native div) |
 | `Table` (composable) | `TableHeader` / `TableBody` / `TableRow` / `TableCell` with `children`, `isHeader` (cell), (+native table elements; `onClick` / `onDoubleClick` on rows & cells) |
@@ -225,7 +223,6 @@ in [Peer dependencies](#peer-dependencies)).
 | `BarChart` | `series`, `categories`, `colors?`, `height?`, `options?` (merged over defaults) |
 | `LineChart` | `series`, `categories`, `colors?`, `height?`, `options?` |
 | `Calendar` | `events`, `onEventClick`, `onDateSelect`, `initialView` |
-| `CountryMap` | `markers`, `markerColor?`, `mapColor?` |
 | `Editor` (WYSIWYG) | `content`, `onChange(html)`, `placeholder?`, `editable?`, `toolbar?` — Tiptap-powered, customizable toolbar |
 
 > The data-viz components default their data to sensible demo values, so they render

package/dist/index.cjs

@@ -4,7 +4,6 @@
 var chunk2C5QY3Z2_cjs = require('./chunk-2C5QY3Z2.cjs');
 var chunk3EE6CPHW_cjs = require('./chunk-3EE6CPHW.cjs');
 var chunkYSON6RJC_cjs = require('./chunk-YSON6RJC.cjs');
-var chunkHT7SQXRF_cjs = require('./chunk-HT7SQXRF.cjs');
 var chunkS4ADL5B7_cjs = require('./chunk-S4ADL5B7.cjs');
 var chunkH4UQ67RI_cjs = require('./chunk-H4UQ67RI.cjs');
 var chunkTF3G3E72_cjs = require('./chunk-TF3G3E72.cjs');
@@ -416,12 +415,20 @@ var AvatarText = ({
     }
   );
 };
+function getTriggerElement(anchor, triggerRef) {
+  if (triggerRef?.current) return triggerRef.current;
+  if (!anchor) return null;
+  const previous = anchor.previousElementSibling;
+  const adjacentTrigger = previous?.matches(".dropdown-toggle, button, [aria-haspopup='menu']") ? previous : previous?.querySelector(".dropdown-toggle, button, [aria-haspopup='menu']");
+  return adjacentTrigger ?? anchor.parentElement?.querySelector(".dropdown-toggle");
+}
 var Dropdown = ({
   isOpen,
   onClose,
   children,
   className,
   portal = true,
+  triggerRef,
   style,
   ...rest
 }) => {
@@ -430,7 +437,8 @@ var Dropdown = ({
   const [position, setPosition] = React5.useState();
   React5.useEffect(() => {
     const handleClickOutside = (event) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target) && !event.target.closest(".dropdown-toggle")) {
+      const trigger = getTriggerElement(anchorRef.current, triggerRef);
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target) && !trigger?.contains(event.target)) {
         onClose();
       }
     };
@@ -438,13 +446,13 @@ var Dropdown = ({
     return () => {
       document.removeEventListener("mousedown", handleClickOutside);
     };
-  }, [onClose]);
+  }, [onClose, triggerRef]);
   React5.useLayoutEffect(() => {
     if (!isOpen || !portal) return;
     const updatePosition = () => {
       const anchor = anchorRef.current;
       const menu2 = dropdownRef.current;
-      const trigger = anchor?.parentElement?.querySelector(".dropdown-toggle");
+      const trigger = getTriggerElement(anchor, triggerRef);
       if (!anchor || !menu2) return;
       const triggerRect = (trigger ?? anchor).getBoundingClientRect();
       const menuRect = menu2.getBoundingClientRect();
@@ -465,7 +473,7 @@ var Dropdown = ({
       window.removeEventListener("resize", updatePosition);
       window.removeEventListener("scroll", updatePosition, true);
     };
-  }, [isOpen, portal]);
+  }, [isOpen, portal, triggerRef]);
   if (!isOpen) return null;
   const menu = /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -3311,10 +3319,6 @@ Object.defineProperty(exports, "Modal", {
   enumerable: true,
   get: function () { return chunkYSON6RJC_cjs.Modal; }
 });
-Object.defineProperty(exports, "CountryMap", {
-  enumerable: true,
-  get: function () { return chunkHT7SQXRF_cjs.CountryMap; }
-});
 Object.defineProperty(exports, "Editor", {
   enumerable: true,
   get: function () { return chunkS4ADL5B7_cjs.Editor; }