@vector-business-services/cristal-ds-web 0.6.0 → 0.8.0

package/dist/index.cjs

@@ -17,6 +17,7 @@ var menu = require('primereact/menu');
 var menubar = require('primereact/menubar');
 var avatar = require('primereact/avatar');
 var tooltip = require('primereact/tooltip');
+var tag = require('primereact/tag');
 var dialog = require('primereact/dialog');
 var multiselect = require('primereact/multiselect');
 var panel = require('primereact/panel');
@@ -26,7 +27,6 @@ var selectbutton = require('primereact/selectbutton');
 var dropdown = require('primereact/dropdown');
 var inputswitch = require('primereact/inputswitch');
 var tabview = require('primereact/tabview');
-var tag = require('primereact/tag');
 
 // src/components/AutoComplete/AutoComplete.tsx
 var AutoComplete = react.forwardRef(function AutoComplete2({
@@ -321,6 +321,7 @@ function Drawer({
   subtitle,
   side = "right",
   behavior = "full",
+  size = "small",
   modal = true,
   onBack,
   backLabel = "Voltar",
@@ -368,7 +369,13 @@ function Drawer({
       primeiro.focus();
     }
   };
-  const classes = ["cr-drawer", `cr-drawer--${side}`, `cr-drawer--${behavior}`, className].filter(Boolean).join(" ");
+  const classes = [
+    "cr-drawer",
+    `cr-drawer--${side}`,
+    `cr-drawer--${behavior}`,
+    `cr-drawer--size-${size}`,
+    className
+  ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsx(
     sidebar.Sidebar,
     {
@@ -844,6 +851,105 @@ var Menubar = react.forwardRef(function Menubar2({
     }
   ) });
 });
+var Tag = react.forwardRef(function Tag2({ variant = "default", size = "small", icon, className, children, ...props }, ref) {
+  const primeRef = react.useRef(null);
+  react.useImperativeHandle(ref, () => primeRef.current?.getElement());
+  const classes = ["cr-tag", `cr-tag--${variant}`, `cr-tag--${size}`, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    tag.Tag,
+    {
+      unstyled: true,
+      ref: primeRef,
+      className: classes,
+      icon: icon ? () => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-tag__icon", "aria-hidden": "true", children: icon }) : void 0,
+      value: children,
+      ...props
+    }
+  );
+});
+var isGroup = (entry) => "items" in entry;
+var MenuPrincipal = react.forwardRef(
+  function MenuPrincipal2({
+    model,
+    popup = false,
+    "aria-label": ariaLabel = "Menu principal",
+    onShow,
+    onHide,
+    id,
+    className
+  }, ref) {
+    const primeRef = react.useRef(null);
+    const context = react.useContext(api.PrimeReactContext);
+    react.useImperativeHandle(ref, () => ({
+      toggle: (event) => primeRef.current?.toggle(event),
+      show: (event) => primeRef.current?.show(event),
+      hide: (event) => primeRef.current?.hide(event),
+      getElement: () => primeRef.current?.getElement() ?? null
+    }));
+    const toPrime = (item) => ({
+      id: item.id,
+      // Sem label no Prime: ele viraria o aria-label do item, só com parte do texto visível. O
+      // nome vem do conteúdo: o nome, a descrição e a tag. Os espaços entre eles não aparecem
+      // (estão em flex), mas separam as palavras no nome ("Início Tela inicial", não colado).
+      command: item.command,
+      url: item.url,
+      target: item.target,
+      className: item.className,
+      // O <a> leva o data-pc-section do Prime: o Enter do teclado clica nele (e segue o link).
+      template: () => /* @__PURE__ */ jsxRuntime.jsxs(
+        "a",
+        {
+          className: "cr-menu-principal__action",
+          "data-pc-section": "action",
+          href: item.url ?? "#",
+          target: item.target,
+          tabIndex: -1,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-menu-principal__icon", "aria-hidden": "true", children: item.icon }),
+            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "cr-menu-principal__text", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-menu-principal__label", children: item.label }),
+              " ",
+              item.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-menu-principal__description", children: item.description })
+            ] }),
+            " ",
+            item.tag && /* @__PURE__ */ jsxRuntime.jsx(Tag, { className: "cr-menu-principal__tag", variant: "warning", icon: /* @__PURE__ */ jsxRuntime.jsx(react$1.DribbbleLogo, {}), children: item.tag })
+          ]
+        }
+      )
+    });
+    const items = [];
+    let anterior;
+    model.forEach((entry) => {
+      if (anterior && (isGroup(entry) || isGroup(anterior))) items.push({ separator: true });
+      items.push(
+        isGroup(entry) ? { id: entry.id, label: entry.label, items: entry.items.map(toPrime) } : toPrime(entry)
+      );
+      anterior = entry;
+    });
+    const classes = ["cr-menu-principal", popup && "cr-menu-principal--popup", className].filter(Boolean).join(" ");
+    const pt = {
+      menu: { className: "cr-menu-principal__list", "aria-label": ariaLabel },
+      submenuHeader: { className: "cr-menu-principal__group" },
+      separator: { className: "cr-menu-principal__separator" },
+      menuitem: { className: "cr-menu-principal__item" }
+    };
+    const menu$1 = /* @__PURE__ */ jsxRuntime.jsx(
+      menu.Menu,
+      {
+        unstyled: true,
+        ref: primeRef,
+        id,
+        className: classes,
+        model: items,
+        popup,
+        onShow,
+        onHide,
+        pt
+      }
+    );
+    return context ? menu$1 : /* @__PURE__ */ jsxRuntime.jsx(api.PrimeReactProvider, { children: menu$1 });
+  }
+);
 function Modal({
   visible,
   onHide,
@@ -1509,22 +1615,6 @@ var Tabs = react.forwardRef(function Tabs2({ activeIndex, onTabChange, children,
     }
   );
 });
-var Tag = react.forwardRef(function Tag2({ variant = "default", size = "small", icon, className, children, ...props }, ref) {
-  const primeRef = react.useRef(null);
-  react.useImperativeHandle(ref, () => primeRef.current?.getElement());
-  const classes = ["cr-tag", `cr-tag--${variant}`, `cr-tag--${size}`, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    tag.Tag,
-    {
-      unstyled: true,
-      ref: primeRef,
-      className: classes,
-      icon: icon ? () => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cr-tag__icon", "aria-hidden": "true", children: icon }) : void 0,
-      value: children,
-      ...props
-    }
-  );
-});
 
 exports.AutoComplete = AutoComplete;
 exports.Badge = Badge;
@@ -1537,6 +1627,7 @@ exports.Drawer = Drawer;
 exports.IconButton = IconButton;
 exports.Input = Input;
 exports.Menu = Menu;
+exports.MenuPrincipal = MenuPrincipal;
 exports.Menubar = Menubar;
 exports.Modal = Modal;
 exports.MultiSelect = MultiSelect;