framepexls-ui-lib 0.1.16 → 0.1.18

package/dist/AppTopbar.js

@@ -40,7 +40,7 @@ function AppTopbar({ title, subtitle, secondary, primary, actions }) {
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-lg font-semibold tracking-tight", children: title }),
       subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-slate-500", children: subtitle })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 z-10", children: [
       Array.isArray(actions) && actions.map((a, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_Button.default,
         {

package/dist/AppTopbar.mjs

@@ -7,7 +7,7 @@ function AppTopbar({ title, subtitle, secondary, primary, actions }) {
       /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold tracking-tight", children: title }),
       subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs text-slate-500", children: subtitle })
     ] }) }),
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 z-10", children: [
       Array.isArray(actions) && actions.map((a, idx) => /* @__PURE__ */ jsx(
         Button,
         {

package/dist/Dialog.js

@@ -246,7 +246,7 @@ function DialogField({
   children,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: cx("grid gap-1 text-sm content-start", className), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: cx("grid gap-1 text-sm content-start justify-start", className), children: [
     label && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-medium", children: [
       label,
       " ",

package/dist/Dialog.mjs

@@ -206,7 +206,7 @@ function DialogField({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs("label", { className: cx("grid gap-1 text-sm content-start", className), children: [
+  return /* @__PURE__ */ jsxs("label", { className: cx("grid gap-1 text-sm content-start justify-start", className), children: [
     label && /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
       label,
       " ",

package/dist/Dropdown.js

@@ -39,7 +39,7 @@ __export(Dropdown_exports, {
 });
 module.exports = __toCommonJS(Dropdown_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
+var import_react = __toESM(require("react"));
 var import_react_dom = require("react-dom");
 var import_iconos = require("./iconos/index");
 var import_Button = __toESM(require("./Button"));
@@ -165,7 +165,7 @@ function Content({
   className = "",
   maxHeight = 360
 }) {
-  const { open, setOpen, triggerRef, menuRef, menuId, labelId, align } = useDropdown();
+  const { open, setOpen, triggerRef, menuRef, menuId, labelId, align, isAllowed, defaultHideUnauthorized } = useDropdown();
   const [pos, setPos] = (0, import_react.useState)({ top: 0, left: 0, origin: "top-left", maxH: maxHeight });
   const computePosition = (0, import_react.useCallback)(() => {
     var _a, _b;
@@ -221,6 +221,49 @@ function Content({
     }
   };
   if (!open) return null;
+  const normalizedChildren = (0, import_react.useMemo)(() => {
+    const arr = import_react.default.Children.toArray(children);
+    const list = arr.map((ch) => {
+      var _a, _b, _c;
+      if (import_react.default.isValidElement(ch)) {
+        const el = ch;
+        if (el.type === Separator) {
+          return { node: ch, kind: "SEP", visible: true };
+        }
+        if (el.type === Item) {
+          const require2 = (_a = el.props) == null ? void 0 : _a.require;
+          const hideIfUnauthorized = (_c = (_b = el.props) == null ? void 0 : _b.hideIfUnauthorized) != null ? _c : defaultHideUnauthorized;
+          const allowed = typeof isAllowed === "function" ? isAllowed(require2) : true;
+          const visible = hideIfUnauthorized ? !!allowed : true;
+          return { node: ch, kind: "ITEM", visible };
+        }
+      }
+      return { node: ch, kind: "OTHER", visible: true };
+    });
+    let filtered = list.filter((it) => it.visible);
+    const out = [];
+    for (const it of filtered) {
+      if (it.kind === "SEP") {
+        const prev = out.length > 0 ? out[out.length - 1] : null;
+        const prevIsSep = prev && import_react.default.isValidElement(prev) && prev.type === Separator;
+        if (prevIsSep) continue;
+        out.push(it.node);
+      } else {
+        out.push(it.node);
+      }
+    }
+    while (out.length > 0) {
+      const first = out[0];
+      if (import_react.default.isValidElement(first) && first.type === Separator) out.shift();
+      else break;
+    }
+    while (out.length > 0) {
+      const last = out[out.length - 1];
+      if (import_react.default.isValidElement(last) && last.type === Separator) out.pop();
+      else break;
+    }
+    return out;
+  }, [children, isAllowed, defaultHideUnauthorized]);
   return (0, import_react_dom.createPortal)(
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
@@ -246,7 +289,7 @@ function Content({
           className
         ].join(" "),
         "data-open": "true",
-        children
+        children: normalizedChildren
       }
     ),
     document.body

package/dist/Dropdown.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import {
+import React, {
   createContext,
   useCallback,
   useContext,
@@ -135,7 +135,7 @@ function Content({
   className = "",
   maxHeight = 360
 }) {
-  const { open, setOpen, triggerRef, menuRef, menuId, labelId, align } = useDropdown();
+  const { open, setOpen, triggerRef, menuRef, menuId, labelId, align, isAllowed, defaultHideUnauthorized } = useDropdown();
   const [pos, setPos] = useState({ top: 0, left: 0, origin: "top-left", maxH: maxHeight });
   const computePosition = useCallback(() => {
     var _a, _b;
@@ -191,6 +191,49 @@ function Content({
     }
   };
   if (!open) return null;
+  const normalizedChildren = useMemo(() => {
+    const arr = React.Children.toArray(children);
+    const list = arr.map((ch) => {
+      var _a, _b, _c;
+      if (React.isValidElement(ch)) {
+        const el = ch;
+        if (el.type === Separator) {
+          return { node: ch, kind: "SEP", visible: true };
+        }
+        if (el.type === Item) {
+          const require2 = (_a = el.props) == null ? void 0 : _a.require;
+          const hideIfUnauthorized = (_c = (_b = el.props) == null ? void 0 : _b.hideIfUnauthorized) != null ? _c : defaultHideUnauthorized;
+          const allowed = typeof isAllowed === "function" ? isAllowed(require2) : true;
+          const visible = hideIfUnauthorized ? !!allowed : true;
+          return { node: ch, kind: "ITEM", visible };
+        }
+      }
+      return { node: ch, kind: "OTHER", visible: true };
+    });
+    let filtered = list.filter((it) => it.visible);
+    const out = [];
+    for (const it of filtered) {
+      if (it.kind === "SEP") {
+        const prev = out.length > 0 ? out[out.length - 1] : null;
+        const prevIsSep = prev && React.isValidElement(prev) && prev.type === Separator;
+        if (prevIsSep) continue;
+        out.push(it.node);
+      } else {
+        out.push(it.node);
+      }
+    }
+    while (out.length > 0) {
+      const first = out[0];
+      if (React.isValidElement(first) && first.type === Separator) out.shift();
+      else break;
+    }
+    while (out.length > 0) {
+      const last = out[out.length - 1];
+      if (React.isValidElement(last) && last.type === Separator) out.pop();
+      else break;
+    }
+    return out;
+  }, [children, isAllowed, defaultHideUnauthorized]);
   return createPortal(
     /* @__PURE__ */ jsx(
       "div",
@@ -216,7 +259,7 @@ function Content({
           className
         ].join(" "),
         "data-open": "true",
-        children
+        children: normalizedChildren
       }
     ),
     document.body

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "framepexls-ui-lib",
-  "version": "0.1.16",
+  "version": "0.1.18",
   "private": false,
   "license": "MIT",
   "description": "Componentes UI de Framepexls para React/Next.",