@schandlergarcia/sf-web-components 1.2.13 → 1.2.14

package/dist/components/library/heroui/Popover.d.ts

@@ -32,14 +32,13 @@ export function Popover({ children, open, onOpenChange, ...props }: {
     open: any;
     onOpenChange: any;
 }): import("react/jsx-runtime").JSX.Element;
-export function PopoverTrigger({ children, open, onOpenChange, ...props }: {
+export function PopoverTrigger({ children, open, onOpenChange, asChild, ...props }: {
     [x: string]: any;
     children: any;
     open: any;
     onOpenChange: any;
-}): React.DetailedReactHTMLElement<{
-    onClick: () => any;
-}, HTMLElement>;
+    asChild: any;
+}): import("react/jsx-runtime").JSX.Element;
 export function PopoverContent({ children, open, className, align, sideOffset, ...props }: {
     [x: string]: any;
     children: any;
@@ -48,4 +47,3 @@ export function PopoverContent({ children, open, className, align, sideOffset, .
     align?: string | undefined;
     sideOffset?: number | undefined;
 }): import("react/jsx-runtime").JSX.Element | null;
-import React from "react";

package/dist/components/library/heroui/Popover.js

@@ -1,20 +1,20 @@
 import { jsx as c } from "react/jsx-runtime";
-import l from "react";
-function p({ children: n, open: e, onOpenChange: r, ...o }) {
-  const [s, i] = l.useState(!1), a = e !== void 0, d = a ? e : s, m = (t) => {
-    a || i(t), r?.(t);
+import a from "react";
+function m({ children: e, open: t, onOpenChange: l, ...s }) {
+  const [n, r] = a.useState(!1), i = t !== void 0, d = i ? t : n, u = (o) => {
+    i || r(o), l?.(o);
   };
-  return /* @__PURE__ */ c("div", { className: "relative inline-block", ...o, children: l.Children.map(n, (t) => l.isValidElement(t) ? l.cloneElement(t, { open: d, onOpenChange: m }) : t) });
+  return /* @__PURE__ */ c("div", { className: "relative inline-block", ...s, children: a.Children.map(e, (o) => a.isValidElement(o) ? a.cloneElement(o, { open: d, onOpenChange: u }) : o) });
 }
-const g = p, v = ({ children: n, open: e, onOpenChange: r, ...o }) => {
-  const s = () => r?.(!e);
-  return l.cloneElement(n, {
-    ...o,
-    onClick: s
-  });
-}, C = ({ children: n, open: e, className: r = "", align: o = "center", sideOffset: s = 4, ...i }) => {
-  if (!e) return null;
-  const a = {
+const b = m, C = ({ children: e, open: t, onOpenChange: l, asChild: s, ...n }) => {
+  const r = () => l?.(!t);
+  return s && a.isValidElement(e) ? a.cloneElement(e, {
+    ...n,
+    onClick: r
+  }) : /* @__PURE__ */ c("button", { type: "button", onClick: r, ...n, children: e });
+}, g = ({ children: e, open: t, className: l = "", align: s = "center", sideOffset: n = 4, ...r }) => {
+  if (!t) return null;
+  const i = {
     start: "left-0",
     center: "left-1/2 -translate-x-1/2",
     end: "right-0"
@@ -22,16 +22,16 @@ const g = p, v = ({ children: n, open: e, onOpenChange: r, ...o }) => {
   return /* @__PURE__ */ c(
     "div",
     {
-      className: `absolute z-50 mt-${s} w-72 rounded-md border border-slate-200 bg-white p-4 text-slate-900 shadow-md dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 ${a[o] || a.center} ${r}`,
-      ...i,
-      children: n
+      className: `absolute z-50 mt-${n} w-72 rounded-md border border-slate-200 bg-white p-4 text-slate-900 shadow-md dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 ${i[s] || i.center} ${l}`,
+      ...r,
+      children: e
     }
   );
 };
 export {
-  g as Popover,
-  C as PopoverContent,
-  v as PopoverTrigger,
-  p as default
+  b as Popover,
+  g as PopoverContent,
+  C as PopoverTrigger,
+  m as default
 };
 //# sourceMappingURL=Popover.js.map

package/dist/components/library/heroui/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../../src/components/library/heroui/Popover.jsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * HeroUI v3 Popover — simple popover for shadcn compatibility.\n * Using native HTML/CSS since HeroUI v3 doesn't have a Popover component.\n *\n * @example\n *   import { Popover, PopoverTrigger, PopoverContent } from \"@/components/library\";\n *   <Popover>\n *     <PopoverTrigger>Open</PopoverTrigger>\n *     <PopoverContent>Content</PopoverContent>\n *   </Popover>\n */\nexport default function HeroUIPopover({ children, open, onOpenChange, ...props }) {\n  const [isOpen, setIsOpen] = React.useState(false);\n  const isControlled = open !== undefined;\n  const actualOpen = isControlled ? open : isOpen;\n\n  const handleOpenChange = (newOpen) => {\n    if (!isControlled) setIsOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  return (\n    <div className=\"relative inline-block\" {...props}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child)) {\n          return React.cloneElement(child, { open: actualOpen, onOpenChange: handleOpenChange });\n        }\n        return child;\n      })}\n    </div>\n  );\n}\n\nexport const Popover = HeroUIPopover;\n\nexport const PopoverTrigger = ({ children, open, onOpenChange, ...props }) => {\n  const handleClick = () => onOpenChange?.(!open);\n\n  return React.cloneElement(children, {\n    ...props,\n    onClick: handleClick,\n  });\n};\n\nexport const PopoverContent = ({ children, open, className = \"\", align = \"center\", sideOffset = 4, ...props }) => {\n  if (!open) return null;\n\n  const alignClasses = {\n    start: \"left-0\",\n    center: \"left-1/2 -translate-x-1/2\",\n    end: \"right-0\"\n  };\n\n  return (\n    <div\n      className={`absolute z-50 mt-${sideOffset} w-72 rounded-md border border-slate-200 bg-white p-4 text-slate-900 shadow-md dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 ${alignClasses[align] || alignClasses.center} ${className}`}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["HeroUIPopover","children","open","onOpenChange","props","isOpen","setIsOpen","React","isControlled","actualOpen","handleOpenChange","newOpen","jsx","child","Popover","PopoverTrigger","handleClick","PopoverContent","className","align","sideOffset","alignClasses"],"mappings":";;AAaA,SAAwBA,EAAc,EAAE,UAAAC,GAAU,MAAAC,GAAM,cAAAC,GAAc,GAAGC,KAAS;AAChF,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAC1CC,IAAeN,MAAS,QACxBO,IAAaD,IAAeN,IAAOG,GAEnCK,IAAmB,CAACC,MAAY;AACpC,IAAKH,KAAcF,EAAUK,CAAO,GACpCR,IAAeQ,CAAO;AAAA,EACxB;AAEA,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,yBAAyB,GAAGR,GACxC,UAAAG,EAAM,SAAS,IAAIN,GAAU,CAACY,MACzBN,EAAM,eAAeM,CAAK,IACrBN,EAAM,aAAaM,GAAO,EAAE,MAAMJ,GAAY,cAAcC,GAAkB,IAEhFG,CACR,EAAA,CACH;AAEJ;AAEO,MAAMC,IAAUd,GAEVe,IAAiB,CAAC,EAAE,UAAAd,GAAU,MAAAC,GAAM,cAAAC,GAAc,GAAGC,QAAY;AAC5E,QAAMY,IAAc,MAAMb,IAAe,CAACD,CAAI;AAE9C,SAAOK,EAAM,aAAaN,GAAU;AAAA,IAClC,GAAGG;AAAA,IACH,SAASY;AAAA,EAAA,CACV;AACH,GAEaC,IAAiB,CAAC,EAAE,UAAAhB,GAAU,MAAAC,GAAM,WAAAgB,IAAY,IAAI,OAAAC,IAAQ,UAAU,YAAAC,IAAa,GAAG,GAAGhB,QAAY;AAChH,MAAI,CAACF,EAAM,QAAO;AAElB,QAAMmB,IAAe;AAAA,IACnB,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,KAAK;AAAA,EAAA;AAGP,SACE,gBAAAT;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,oBAAoBQ,CAAU,6IAA6IC,EAAaF,CAAK,KAAKE,EAAa,MAAM,IAAIH,CAAS;AAAA,MAC5O,GAAGd;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Popover.js","sources":["../../../../src/components/library/heroui/Popover.jsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * HeroUI v3 Popover — simple popover for shadcn compatibility.\n * Using native HTML/CSS since HeroUI v3 doesn't have a Popover component.\n *\n * @example\n *   import { Popover, PopoverTrigger, PopoverContent } from \"@/components/library\";\n *   <Popover>\n *     <PopoverTrigger>Open</PopoverTrigger>\n *     <PopoverContent>Content</PopoverContent>\n *   </Popover>\n */\nexport default function HeroUIPopover({ children, open, onOpenChange, ...props }) {\n  const [isOpen, setIsOpen] = React.useState(false);\n  const isControlled = open !== undefined;\n  const actualOpen = isControlled ? open : isOpen;\n\n  const handleOpenChange = (newOpen) => {\n    if (!isControlled) setIsOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  return (\n    <div className=\"relative inline-block\" {...props}>\n      {React.Children.map(children, (child) => {\n        if (React.isValidElement(child)) {\n          return React.cloneElement(child, { open: actualOpen, onOpenChange: handleOpenChange });\n        }\n        return child;\n      })}\n    </div>\n  );\n}\n\nexport const Popover = HeroUIPopover;\n\nexport const PopoverTrigger = ({ children, open, onOpenChange, asChild, ...props }) => {\n  const handleClick = () => onOpenChange?.(!open);\n\n  // If asChild is true, clone the child element with the props\n  if (asChild && React.isValidElement(children)) {\n    return React.cloneElement(children, {\n      ...props,\n      onClick: handleClick,\n    });\n  }\n\n  // Otherwise, wrap in a button\n  return (\n    <button type=\"button\" onClick={handleClick} {...props}>\n      {children}\n    </button>\n  );\n};\n\nexport const PopoverContent = ({ children, open, className = \"\", align = \"center\", sideOffset = 4, ...props }) => {\n  if (!open) return null;\n\n  const alignClasses = {\n    start: \"left-0\",\n    center: \"left-1/2 -translate-x-1/2\",\n    end: \"right-0\"\n  };\n\n  return (\n    <div\n      className={`absolute z-50 mt-${sideOffset} w-72 rounded-md border border-slate-200 bg-white p-4 text-slate-900 shadow-md dark:border-slate-800 dark:bg-slate-900 dark:text-slate-50 ${alignClasses[align] || alignClasses.center} ${className}`}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["HeroUIPopover","children","open","onOpenChange","props","isOpen","setIsOpen","React","isControlled","actualOpen","handleOpenChange","newOpen","jsx","child","Popover","PopoverTrigger","asChild","handleClick","PopoverContent","className","align","sideOffset","alignClasses"],"mappings":";;AAaA,SAAwBA,EAAc,EAAE,UAAAC,GAAU,MAAAC,GAAM,cAAAC,GAAc,GAAGC,KAAS;AAChF,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAC1CC,IAAeN,MAAS,QACxBO,IAAaD,IAAeN,IAAOG,GAEnCK,IAAmB,CAACC,MAAY;AACpC,IAAKH,KAAcF,EAAUK,CAAO,GACpCR,IAAeQ,CAAO;AAAA,EACxB;AAEA,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,yBAAyB,GAAGR,GACxC,UAAAG,EAAM,SAAS,IAAIN,GAAU,CAACY,MACzBN,EAAM,eAAeM,CAAK,IACrBN,EAAM,aAAaM,GAAO,EAAE,MAAMJ,GAAY,cAAcC,GAAkB,IAEhFG,CACR,EAAA,CACH;AAEJ;AAEO,MAAMC,IAAUd,GAEVe,IAAiB,CAAC,EAAE,UAAAd,GAAU,MAAAC,GAAM,cAAAC,GAAc,SAAAa,GAAS,GAAGZ,QAAY;AACrF,QAAMa,IAAc,MAAMd,IAAe,CAACD,CAAI;AAG9C,SAAIc,KAAWT,EAAM,eAAeN,CAAQ,IACnCM,EAAM,aAAaN,GAAU;AAAA,IAClC,GAAGG;AAAA,IACH,SAASa;AAAA,EAAA,CACV,IAKD,gBAAAL,EAAC,YAAO,MAAK,UAAS,SAASK,GAAc,GAAGb,GAC7C,UAAAH,GACH;AAEJ,GAEaiB,IAAiB,CAAC,EAAE,UAAAjB,GAAU,MAAAC,GAAM,WAAAiB,IAAY,IAAI,OAAAC,IAAQ,UAAU,YAAAC,IAAa,GAAG,GAAGjB,QAAY;AAChH,MAAI,CAACF,EAAM,QAAO;AAElB,QAAMoB,IAAe;AAAA,IACnB,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,KAAK;AAAA,EAAA;AAGP,SACE,gBAAAV;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,oBAAoBS,CAAU,6IAA6IC,EAAaF,CAAK,KAAKE,EAAa,MAAM,IAAIH,CAAS;AAAA,MAC5O,GAAGf;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schandlergarcia/sf-web-components",
-  "version": "1.2.13",
+  "version": "1.2.14",
   "description": "Reusable Salesforce web components library with Tailwind CSS v4 and shadcn/ui",
   "type": "module",
   "main": "./dist/index.js",

package/src/components/library/heroui/Popover.jsx

@@ -35,13 +35,23 @@ export default function HeroUIPopover({ children, open, onOpenChange, ...props }
 
 export const Popover = HeroUIPopover;
 
-export const PopoverTrigger = ({ children, open, onOpenChange, ...props }) => {
+export const PopoverTrigger = ({ children, open, onOpenChange, asChild, ...props }) => {
   const handleClick = () => onOpenChange?.(!open);
 
-  return React.cloneElement(children, {
-    ...props,
-    onClick: handleClick,
-  });
+  // If asChild is true, clone the child element with the props
+  if (asChild && React.isValidElement(children)) {
+    return React.cloneElement(children, {
+      ...props,
+      onClick: handleClick,
+    });
+  }
+
+  // Otherwise, wrap in a button
+  return (
+    <button type="button" onClick={handleClick} {...props}>
+      {children}
+    </button>
+  );
 };
 
 export const PopoverContent = ({ children, open, className = "", align = "center", sideOffset = 4, ...props }) => {