@schandlergarcia/sf-web-components 1.6.0 → 1.7.0

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

@@ -1,25 +1,24 @@
 import { jsx as s } from "react/jsx-runtime";
-import "react";
-function n({ className: e = "", children: t, ...l }) {
+function r({ className: e = "", children: t, ...l }) {
   return /* @__PURE__ */ s("div", { className: `flex flex-col gap-1.5 ${e}`, ...l, children: t });
 }
-const x = n, d = ({ className: e = "", htmlFor: t, children: l, ...r }) => /* @__PURE__ */ s(
+const x = r, d = ({ className: e = "", htmlFor: t, children: l, ...a }) => /* @__PURE__ */ s(
   "label",
   {
     htmlFor: t,
     className: `text-sm font-medium text-slate-700 dark:text-slate-200 ${e}`,
-    ...r,
+    ...a,
     children: l
   }
-), c = ({ className: e = "", children: t, ...l }) => /* @__PURE__ */ s("p", { className: `text-xs text-slate-500 dark:text-slate-400 ${e}`, ...l, children: t }), m = ({ className: e = "", errors: t, children: l, ...r }) => {
-  const a = t?.length > 0 ? t.join(", ") : l;
-  return a ? /* @__PURE__ */ s("p", { className: `text-xs text-red-600 dark:text-red-400 ${e}`, ...r, children: a }) : null;
+), i = ({ className: e = "", children: t, ...l }) => /* @__PURE__ */ s("p", { className: `text-xs text-slate-500 dark:text-slate-400 ${e}`, ...l, children: t }), c = ({ className: e = "", errors: t, children: l, ...a }) => {
+  const n = t && t.length > 0 ? t.join(", ") : l;
+  return n ? /* @__PURE__ */ s("p", { className: `text-xs text-red-600 dark:text-red-400 ${e}`, ...a, children: n }) : null;
 };
 export {
   x as Field,
-  c as FieldDescription,
-  m as FieldError,
+  i as FieldDescription,
+  c as FieldError,
   d as FieldLabel,
-  n as default
+  r as default
 };
 //# sourceMappingURL=Field.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sources":["../../../../src/components/library/heroui/Field.jsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * HeroUI v3 Field components — simple wrappers for form field layout.\n *\n * @example\n *   import { Field, FieldLabel, FieldError } from \"@/components/library\";\n *   <Field>\n *     <FieldLabel>Name</FieldLabel>\n *     <Input />\n *     <FieldError>Required</FieldError>\n *   </Field>\n */\nexport default function HeroUIField({ className = \"\", children, ...props }) {\n  return (\n    <div className={`flex flex-col gap-1.5 ${className}`} {...props}>\n      {children}\n    </div>\n  );\n}\n\nexport const Field = HeroUIField;\n\nexport const FieldLabel = ({ className = \"\", htmlFor, children, ...props }) => (\n  <label\n    htmlFor={htmlFor}\n    className={`text-sm font-medium text-slate-700 dark:text-slate-200 ${className}`}\n    {...props}\n  >\n    {children}\n  </label>\n);\n\nexport const FieldDescription = ({ className = \"\", children, ...props }) => (\n  <p className={`text-xs text-slate-500 dark:text-slate-400 ${className}`} {...props}>\n    {children}\n  </p>\n);\n\nexport const FieldError = ({ className = \"\", errors, children, ...props }) => {\n  // Support both children and errors prop\n  const errorContent = errors?.length > 0 ? errors.join(\", \") : children;\n\n  if (!errorContent) return null;\n\n  return (\n    <p className={`text-xs text-red-600 dark:text-red-400 ${className}`} {...props}>\n      {errorContent}\n    </p>\n  );\n};\n"],"names":["HeroUIField","className","children","props","jsx","Field","FieldLabel","htmlFor","FieldDescription","FieldError","errors","errorContent"],"mappings":";;AAaA,SAAwBA,EAAY,EAAE,WAAAC,IAAY,IAAI,UAAAC,GAAU,GAAGC,KAAS;AAC1E,SACE,gBAAAC,EAAC,SAAI,WAAW,yBAAyBH,CAAS,IAAK,GAAGE,GACvD,UAAAD,GACH;AAEJ;AAEO,MAAMG,IAAQL,GAERM,IAAa,CAAC,EAAE,WAAAL,IAAY,IAAI,SAAAM,GAAS,UAAAL,GAAU,GAAGC,EAAA,MACjE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAAAG;AAAA,IACA,WAAW,0DAA0DN,CAAS;AAAA,IAC7E,GAAGE;AAAA,IAEH,UAAAD;AAAA,EAAA;AACH,GAGWM,IAAmB,CAAC,EAAE,WAAAP,IAAY,IAAI,UAAAC,GAAU,GAAGC,EAAA,MAC9D,gBAAAC,EAAC,OAAE,WAAW,8CAA8CH,CAAS,IAAK,GAAGE,GAC1E,UAAAD,EAAA,CACH,GAGWO,IAAa,CAAC,EAAE,WAAAR,IAAY,IAAI,QAAAS,GAAQ,UAAAR,GAAU,GAAGC,QAAY;AAE5E,QAAMQ,IAAeD,GAAQ,SAAS,IAAIA,EAAO,KAAK,IAAI,IAAIR;AAE9D,SAAKS,IAGH,gBAAAP,EAAC,OAAE,WAAW,0CAA0CH,CAAS,IAAK,GAAGE,GACtE,UAAAQ,EAAA,CACH,IALwB;AAO5B;"}
+{"version":3,"file":"Field.js","sources":["../../../../src/components/library/heroui/Field.tsx"],"sourcesContent":["import * as React from \"react\";\n\n/**\n * HeroUI v3 Field components — simple wrappers for form field layout.\n *\n * @example\n *   import { Field, FieldLabel, FieldError } from \"@/components/library\";\n *   <Field>\n *     <FieldLabel>Name</FieldLabel>\n *     <Input />\n *     <FieldError>Required</FieldError>\n *   </Field>\n */\nexport interface HeroUIFieldProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n}\n\nexport default function HeroUIField({ className = \"\", children, ...props }: HeroUIFieldProps) {\n  return (\n    <div className={`flex flex-col gap-1.5 ${className}`} {...props}>\n      {children}\n    </div>\n  );\n}\n\nexport const Field = HeroUIField;\n\nexport interface FieldLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  children?: React.ReactNode;\n}\n\nexport const FieldLabel = ({ className = \"\", htmlFor, children, ...props }: FieldLabelProps) => (\n  <label\n    htmlFor={htmlFor}\n    className={`text-sm font-medium text-slate-700 dark:text-slate-200 ${className}`}\n    {...props}\n  >\n    {children}\n  </label>\n);\n\nexport interface FieldDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {\n  children?: React.ReactNode;\n}\n\nexport const FieldDescription = ({ className = \"\", children, ...props }: FieldDescriptionProps) => (\n  <p className={`text-xs text-slate-500 dark:text-slate-400 ${className}`} {...props}>\n    {children}\n  </p>\n);\n\nexport interface FieldErrorProps extends React.HTMLAttributes<HTMLParagraphElement> {\n  errors?: string[];\n  children?: React.ReactNode;\n}\n\nexport const FieldError = ({ className = \"\", errors, children, ...props }: FieldErrorProps) => {\n  // Support both children and errors prop\n  const errorContent = errors && errors.length > 0 ? errors.join(\", \") : children;\n\n  if (!errorContent) return null;\n\n  return (\n    <p className={`text-xs text-red-600 dark:text-red-400 ${className}`} {...props}>\n      {errorContent}\n    </p>\n  );\n};\n"],"names":["HeroUIField","className","children","props","jsx","Field","FieldLabel","htmlFor","FieldDescription","FieldError","errors","errorContent"],"mappings":";AAiBA,SAAwBA,EAAY,EAAE,WAAAC,IAAY,IAAI,UAAAC,GAAU,GAAGC,KAA2B;AAC5F,SACE,gBAAAC,EAAC,SAAI,WAAW,yBAAyBH,CAAS,IAAK,GAAGE,GACvD,UAAAD,GACH;AAEJ;AAEO,MAAMG,IAAQL,GAMRM,IAAa,CAAC,EAAE,WAAAL,IAAY,IAAI,SAAAM,GAAS,UAAAL,GAAU,GAAGC,EAAA,MACjE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAAAG;AAAA,IACA,WAAW,0DAA0DN,CAAS;AAAA,IAC7E,GAAGE;AAAA,IAEH,UAAAD;AAAA,EAAA;AACH,GAOWM,IAAmB,CAAC,EAAE,WAAAP,IAAY,IAAI,UAAAC,GAAU,GAAGC,EAAA,MAC9D,gBAAAC,EAAC,OAAE,WAAW,8CAA8CH,CAAS,IAAK,GAAGE,GAC1E,UAAAD,EAAA,CACH,GAQWO,IAAa,CAAC,EAAE,WAAAR,IAAY,IAAI,QAAAS,GAAQ,UAAAR,GAAU,GAAGC,QAA6B;AAE7F,QAAMQ,IAAeD,KAAUA,EAAO,SAAS,IAAIA,EAAO,KAAK,IAAI,IAAIR;AAEvE,SAAKS,IAGH,gBAAAP,EAAC,OAAE,WAAW,0CAA0CH,CAAS,IAAK,GAAGE,GACtE,UAAAQ,EAAA,CACH,IALwB;AAO5B;"}

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

@@ -1,6 +1,8 @@
-export default function HeroUIMeter({ children, ...props }: {
-    [x: string]: any;
-    children: any;
-}): import("react/jsx-runtime").JSX.Element;
-export { Meter };
+import * as React from "react";
 import { Meter } from "@heroui/react";
+export interface HeroUIMeterProps {
+    children?: React.ReactNode;
+    [key: string]: any;
+}
+export default function HeroUIMeter({ children, ...props }: HeroUIMeterProps): import("react/jsx-runtime").JSX.Element;
+export { Meter };

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

@@ -1,12 +1,11 @@
 import { jsx as t } from "react/jsx-runtime";
-import "react";
 import { Meter as o } from "@heroui/react";
-import { Meter as x } from "@heroui/react";
-function i({ children: r, ...e }) {
+import { Meter as u } from "@heroui/react";
+function p({ children: r, ...e }) {
   return /* @__PURE__ */ t(o, { ...e, children: r });
 }
 export {
-  x as Meter,
-  i as default
+  u as Meter,
+  p as default
 };
 //# sourceMappingURL=Meter.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Meter.js","sources":["../../../../src/components/library/heroui/Meter.jsx"],"sourcesContent":["import React from \"react\";\nimport { Meter } from \"@heroui/react\";\n\nexport default function HeroUIMeter({ children, ...props }) {\n  return <Meter {...props}>{children}</Meter>;\n}\n\nexport { Meter };\n"],"names":["HeroUIMeter","children","props","jsx","Meter"],"mappings":";;;;AAGA,SAAwBA,EAAY,EAAE,UAAAC,GAAU,GAAGC,KAAS;AAC1D,SAAO,gBAAAC,EAACC,GAAA,EAAO,GAAGF,GAAQ,UAAAD,EAAA,CAAS;AACrC;"}
+{"version":3,"file":"Meter.js","sources":["../../../../src/components/library/heroui/Meter.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Meter } from \"@heroui/react\";\n\nexport interface HeroUIMeterProps {\n  children?: React.ReactNode;\n  [key: string]: any;\n}\n\nexport default function HeroUIMeter({ children, ...props }: HeroUIMeterProps) {\n  return <Meter {...props}>{children}</Meter>;\n}\n\nexport { Meter };\n"],"names":["HeroUIMeter","children","props","jsx","Meter"],"mappings":";;;AAQA,SAAwBA,EAAY,EAAE,UAAAC,GAAU,GAAGC,KAA2B;AAC5E,SAAO,gBAAAC,EAACC,GAAA,EAAO,GAAGF,GAAQ,UAAAD,EAAA,CAAS;AACrC;"}

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

@@ -1,3 +1,4 @@
+import * as React from "react";
 /**
  * HeroUI v3 Popover — simple popover for shadcn compatibility.
  * Using native HTML/CSS since HeroUI v3 doesn't have a Popover component.
@@ -9,41 +10,25 @@
  *     <PopoverContent>Content</PopoverContent>
  *   </Popover>
  */
-export default function HeroUIPopover({ children, open, onOpenChange, ...props }: {
-    [x: string]: any;
-    children: any;
-    open: any;
-    onOpenChange: any;
-}): import("react/jsx-runtime").JSX.Element;
-/**
- * HeroUI v3 Popover — simple popover for shadcn compatibility.
- * Using native HTML/CSS since HeroUI v3 doesn't have a Popover component.
- *
- * @example
- *   import { Popover, PopoverTrigger, PopoverContent } from "@/components/library";
- *   <Popover>
- *     <PopoverTrigger>Open</PopoverTrigger>
- *     <PopoverContent>Content</PopoverContent>
- *   </Popover>
- */
-export function Popover({ children, open, onOpenChange, ...props }: {
-    [x: string]: any;
-    children: any;
-    open: any;
-    onOpenChange: any;
-}): import("react/jsx-runtime").JSX.Element;
-export function PopoverTrigger({ children, open, onOpenChange, asChild, ...props }: {
-    [x: string]: any;
-    children: any;
-    open: any;
-    onOpenChange: any;
-    asChild: any;
-}): import("react/jsx-runtime").JSX.Element;
-export function PopoverContent({ children, open, className, align, sideOffset, ...props }: {
-    [x: string]: any;
-    children: any;
-    open: any;
-    className?: string | undefined;
-    align?: string | undefined;
-    sideOffset?: number | undefined;
-}): import("react/jsx-runtime").JSX.Element | null;
+export interface HeroUIPopoverProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+export default function HeroUIPopover({ children, open, onOpenChange, ...props }: HeroUIPopoverProps): import("react/jsx-runtime").JSX.Element;
+export declare const Popover: typeof HeroUIPopover;
+export interface PopoverTriggerProps {
+    children?: React.ReactNode;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    asChild?: boolean;
+    [key: string]: any;
+}
+export declare const PopoverTrigger: ({ children, open, onOpenChange, asChild, ...props }: PopoverTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export interface PopoverContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+    open?: boolean;
+    align?: "start" | "center" | "end";
+    sideOffset?: number;
+}
+export declare const PopoverContent: ({ children, open, className, align, sideOffset, ...props }: PopoverContentProps) => import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,18 +1,18 @@
 import { jsx as c } from "react/jsx-runtime";
-import a from "react";
-function m({ children: e, open: t, onOpenChange: l, ...s }) {
+import * as a from "react";
+function m({ children: e, open: t, onOpenChange: s, ...l }) {
   const [n, r] = a.useState(!1), i = t !== void 0, d = i ? t : n, u = (o) => {
-    i || r(o), l?.(o);
+    i || r(o), s?.(o);
   };
-  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) });
+  return /* @__PURE__ */ c("div", { className: "relative inline-block", ...l, children: a.Children.map(e, (o) => a.isValidElement(o) ? a.cloneElement(o, { open: d, onOpenChange: u }) : o) });
 }
-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, {
+const f = m, b = ({ children: e, open: t, onOpenChange: s, asChild: l, ...n }) => {
+  const r = () => s?.(!t);
+  return l && 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 }) => {
+}, C = ({ children: e, open: t, className: s = "", align: l = "center", sideOffset: n = 4, ...r }) => {
   if (!t) return null;
   const i = {
     start: "left-0",
@@ -22,16 +22,16 @@ const b = m, C = ({ children: e, open: t, onOpenChange: l, asChild: s, ...n }) =
   return /* @__PURE__ */ c(
     "div",
     {
-      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}`,
+      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[l] || i.center} ${s}`,
       ...r,
       children: e
     }
   );
 };
 export {
-  b as Popover,
-  g as PopoverContent,
-  C as PopoverTrigger,
+  f as Popover,
+  C as PopoverContent,
+  b 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, 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;"}
+{"version":3,"file":"Popover.js","sources":["../../../../src/components/library/heroui/Popover.tsx"],"sourcesContent":["import * as 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 interface HeroUIPopoverProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport default function HeroUIPopover({ children, open, onOpenChange, ...props }: HeroUIPopoverProps) {\n  const [isOpen, setIsOpen] = React.useState(false);\n  const isControlled = open !== undefined;\n  const actualOpen = isControlled ? open : isOpen;\n\n  const handleOpenChange = (newOpen: boolean) => {\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 } as any);\n        }\n        return child;\n      })}\n    </div>\n  );\n}\n\nexport const Popover = HeroUIPopover;\n\nexport interface PopoverTriggerProps {\n  children?: React.ReactNode;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  asChild?: boolean;\n  [key: string]: any;\n}\n\nexport const PopoverTrigger = ({ children, open, onOpenChange, asChild, ...props }: PopoverTriggerProps) => {\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    } as any);\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 interface PopoverContentProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n  open?: boolean;\n  align?: \"start\" | \"center\" | \"end\";\n  sideOffset?: number;\n}\n\nexport const PopoverContent = ({ children, open, className = \"\", align = \"center\", sideOffset = 4, ...props }: PopoverContentProps) => {\n  if (!open) return null;\n\n  const alignClasses: Record<string, string> = {\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":";;AAmBA,SAAwBA,EAAc,EAAE,UAAAC,GAAU,MAAAC,GAAM,cAAAC,GAAc,GAAGC,KAA6B;AACpG,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAM,SAAS,EAAK,GAC1CC,IAAeN,MAAS,QACxBO,IAAaD,IAAeN,IAAOG,GAEnCK,IAAmB,CAACC,MAAqB;AAC7C,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,GAAyB,IAEvFG,CACR,EAAA,CACH;AAEJ;AAEO,MAAMC,IAAUd,GAUVe,IAAiB,CAAC,EAAE,UAAAd,GAAU,MAAAC,GAAM,cAAAC,GAAc,SAAAa,GAAS,GAAGZ,QAAiC;AAC1G,QAAMa,IAAc,MAAMd,IAAe,CAACD,CAAI;AAG9C,SAAIc,KAAWT,EAAM,eAAeN,CAAQ,IACnCM,EAAM,aAAaN,GAAU;AAAA,IAClC,GAAGG;AAAA,IACH,SAASa;AAAA,EAAA,CACH,IAKR,gBAAAL,EAAC,YAAO,MAAK,UAAS,SAASK,GAAc,GAAGb,GAC7C,UAAAH,GACH;AAEJ,GASaiB,IAAiB,CAAC,EAAE,UAAAjB,GAAU,MAAAC,GAAM,WAAAiB,IAAY,IAAI,OAAAC,IAAQ,UAAU,YAAAC,IAAa,GAAG,GAAGjB,QAAiC;AACrI,MAAI,CAACF,EAAM,QAAO;AAElB,QAAMoB,IAAuC;AAAA,IAC3C,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/dist/components/library/heroui/Select.d.ts

@@ -1,3 +1,4 @@
+import * as React from "react";
 /**
  * HeroUI v3 Select wrapper with shadcn compatibility.
  *
@@ -5,40 +6,33 @@
  * - onValueChange -> onSelectionChange
  * - value -> selectedKeys
  */
-export default function HeroUISelect({ value, onValueChange, children, ...props }: {
-    [x: string]: any;
-    value: any;
-    onValueChange: any;
-    children: any;
-}): import("react/jsx-runtime").JSX.Element;
-/**
- * HeroUI v3 Select wrapper with shadcn compatibility.
- *
- * Translates shadcn API to HeroUI:
- * - onValueChange -> onSelectionChange
- * - value -> selectedKeys
- */
-export function Select({ value, onValueChange, children, ...props }: {
-    [x: string]: any;
-    value: any;
-    onValueChange: any;
-    children: any;
-}): import("react/jsx-runtime").JSX.Element;
-export function SelectTrigger({ children, size, ...props }: {
-    [x: string]: any;
-    children: any;
-    size: any;
-}): import("react/jsx-runtime").JSX.Element;
-export function SelectValue({ placeholder, ...props }: {
-    [x: string]: any;
-    placeholder: any;
-}): import("react/jsx-runtime").JSX.Element;
-export function SelectContent({ children, ...props }: {
-    [x: string]: any;
-    children: any;
-}): import("react/jsx-runtime").JSX.Element;
-export function SelectItem({ value, children, ...props }: {
-    [x: string]: any;
-    value: any;
-    children: any;
-}): import("react/jsx-runtime").JSX.Element;
+export interface HeroUISelectProps {
+    value?: string;
+    onValueChange?: (value: string) => void;
+    children?: React.ReactNode;
+    [key: string]: any;
+}
+export default function HeroUISelect({ value, onValueChange, children, ...props }: HeroUISelectProps): import("react/jsx-runtime").JSX.Element;
+export declare const Select: typeof HeroUISelect;
+export interface SelectTriggerProps {
+    children?: React.ReactNode;
+    size?: string;
+    [key: string]: any;
+}
+export declare const SelectTrigger: ({ children }: SelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
+export interface SelectValueProps {
+    placeholder?: string;
+    [key: string]: any;
+}
+export declare const SelectValue: ({ placeholder }: SelectValueProps) => import("react/jsx-runtime").JSX.Element;
+export interface SelectContentProps {
+    children?: React.ReactNode;
+    [key: string]: any;
+}
+export declare const SelectContent: ({ children }: SelectContentProps) => import("react/jsx-runtime").JSX.Element;
+export interface SelectItemProps {
+    value: string;
+    children?: React.ReactNode;
+    [key: string]: any;
+}
+export declare const SelectItem: ({ value, children, ...props }: SelectItemProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,6 @@
 import { jsx as l } from "react/jsx-runtime";
-import "react";
 import { Select as s } from "@heroui/react";
-function h({ value: e, onValueChange: t, children: o, ...n }) {
+function h({ value: e, onValueChange: t, children: n, ...o }) {
   return /* @__PURE__ */ l(
     s,
     {
@@ -10,8 +9,8 @@ function h({ value: e, onValueChange: t, children: o, ...n }) {
         const r = Array.from(c)[0];
         t?.(r || "");
       },
-      ...n,
-      children: o
+      ...o,
+      children: n
     }
   );
 }

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

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../src/components/library/heroui/Select.jsx"],"sourcesContent":["import React from \"react\";\nimport { Select as HeroSelect } from \"@heroui/react\";\n\n/**\n * HeroUI v3 Select wrapper with shadcn compatibility.\n *\n * Translates shadcn API to HeroUI:\n * - onValueChange -> onSelectionChange\n * - value -> selectedKeys\n */\nexport default function HeroUISelect({ value, onValueChange, children, ...props }) {\n  // Translate shadcn API to HeroUI API\n  const selectedKeys = value ? [value] : [];\n  const handleSelectionChange = (keys) => {\n    const selected = Array.from(keys)[0];\n    onValueChange?.(selected || \"\");\n  };\n\n  return (\n    <HeroSelect\n      selectedKeys={selectedKeys}\n      onSelectionChange={handleSelectionChange}\n      {...props}\n    >\n      {children}\n    </HeroSelect>\n  );\n}\n\n// For direct HeroUI usage\nexport const Select = HeroUISelect;\n\n// Shadcn-compatible subcomponents that just pass through children\nexport const SelectTrigger = ({ children, size, ...props }) => <>{children}</>;\nexport const SelectValue = ({ placeholder, ...props }) => <span {...props}>{placeholder}</span>;\nexport const SelectContent = ({ children, ...props }) => <>{children}</>;\nexport const SelectItem = ({ value, children, ...props }) => <HeroSelect.Item key={value} {...props}>{children}</HeroSelect.Item>;\n"],"names":["HeroUISelect","value","onValueChange","children","props","jsx","HeroSelect","keys","selected"],"mappings":";;;AAUA,SAAwBA,EAAa,EAAE,OAAAC,GAAO,eAAAC,GAAe,UAAAC,GAAU,GAAGC,KAAS;AAQjF,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,cARiBL,IAAQ,CAACA,CAAK,IAAI,CAAA;AAAA,MASnC,mBAR0B,CAACM,MAAS;AACtC,cAAMC,IAAW,MAAM,KAAKD,CAAI,EAAE,CAAC;AACnC,QAAAL,IAAgBM,KAAY,EAAE;AAAA,MAChC;AAAA,MAMK,GAAGJ;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Select.js","sources":["../../../../src/components/library/heroui/Select.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Select as HeroSelect } from \"@heroui/react\";\n\n/**\n * HeroUI v3 Select wrapper with shadcn compatibility.\n *\n * Translates shadcn API to HeroUI:\n * - onValueChange -> onSelectionChange\n * - value -> selectedKeys\n */\nexport interface HeroUISelectProps {\n  value?: string;\n  onValueChange?: (value: string) => void;\n  children?: React.ReactNode;\n  [key: string]: any;\n}\n\nexport default function HeroUISelect({ value, onValueChange, children, ...props }: HeroUISelectProps) {\n  // Translate shadcn API to HeroUI API\n  const selectedKeys = value ? [value] : [];\n  const handleSelectionChange = (keys: any) => {\n    const selected = Array.from(keys)[0] as string;\n    onValueChange?.(selected || \"\");\n  };\n\n  const HeroSelectAny = HeroSelect as any;\n  return (\n    <HeroSelectAny\n      selectedKeys={selectedKeys}\n      onSelectionChange={handleSelectionChange}\n      {...props}\n    >\n      {children}\n    </HeroSelectAny>\n  );\n}\n\n// For direct HeroUI usage\nexport const Select = HeroUISelect;\n\n// Shadcn-compatible subcomponents that just pass through children\nexport interface SelectTriggerProps {\n  children?: React.ReactNode;\n  size?: string;\n  [key: string]: any;\n}\n\nexport const SelectTrigger = ({ children }: SelectTriggerProps) => <>{children}</>;\n\nexport interface SelectValueProps {\n  placeholder?: string;\n  [key: string]: any;\n}\n\nexport const SelectValue = ({ placeholder }: SelectValueProps) => <span>{placeholder}</span>;\n\nexport interface SelectContentProps {\n  children?: React.ReactNode;\n  [key: string]: any;\n}\n\nexport const SelectContent = ({ children }: SelectContentProps) => <>{children}</>;\n\nexport interface SelectItemProps {\n  value: string;\n  children?: React.ReactNode;\n  [key: string]: any;\n}\n\nexport const SelectItem = ({ value, children, ...props }: SelectItemProps) => {\n  const HeroSelectAny = HeroSelect as any;\n  return <HeroSelectAny.Item key={value} {...props}>{children}</HeroSelectAny.Item>;\n};\n"],"names":["HeroUISelect","value","onValueChange","children","props","jsx","HeroSelect","keys","selected"],"mappings":";;AAiBA,SAAwBA,EAAa,EAAE,OAAAC,GAAO,eAAAC,GAAe,UAAAC,GAAU,GAAGC,KAA4B;AASpG,SACE,gBAAAC;AAAA,IAFoBC;AAAAA,IAEnB;AAAA,MACC,cATiBL,IAAQ,CAACA,CAAK,IAAI,CAAA;AAAA,MAUnC,mBAT0B,CAACM,MAAc;AAC3C,cAAMC,IAAW,MAAM,KAAKD,CAAI,EAAE,CAAC;AACnC,QAAAL,IAAgBM,KAAY,EAAE;AAAA,MAChC;AAAA,MAOK,GAAGJ;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/package.json

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

package/src/components/library/heroui/{Accordion.jsx → Accordion.tsx}

@@ -1,4 +1,3 @@
-import React from "react";
 import { Accordion } from "@heroui/react";
 
 /**
@@ -19,8 +18,14 @@ import { Accordion } from "@heroui/react";
  *     </Accordion.Item>
  *   </Accordion>
  */
-export default function HeroUIAccordion({ variant = "default", ...props }) {
-  return <Accordion variant={variant} {...props} />;
+export interface HeroUIAccordionProps {
+  variant?: string;
+  [key: string]: any;
+}
+
+export default function HeroUIAccordion({ variant = "default", ...props }: HeroUIAccordionProps) {
+  const AccordionAny = Accordion as any;
+  return <AccordionAny variant={variant} {...props} />;
 }
 
 export { Accordion };

package/src/components/library/heroui/{Breadcrumbs.jsx → Breadcrumbs.tsx}

@@ -1,4 +1,3 @@
-import React from "react";
 import { Breadcrumbs } from "@heroui/react";
 
 /**
@@ -15,7 +14,11 @@ import { Breadcrumbs } from "@heroui/react";
  *     <Breadcrumbs.Item>Profile</Breadcrumbs.Item>
  *   </Breadcrumbs>
  */
-export default function HeroUIBreadcrumbs(props) {
+export interface HeroUIBreadcrumbsProps {
+  [key: string]: any;
+}
+
+export default function HeroUIBreadcrumbs(props: HeroUIBreadcrumbsProps) {
   return <Breadcrumbs {...props} />;
 }
 

package/src/components/library/heroui/Collapsible.tsx

@@ -0,0 +1,62 @@
+import * as React from "react";
+import { Accordion } from "@heroui/react";
+
+/**
+ * HeroUI v3 Collapsible — maps to Accordion for shadcn compatibility.
+ *
+ * @example
+ *   import { Collapsible, CollapsibleTrigger, CollapsibleContent } from "@/components/library";
+ *   <Collapsible open={isOpen} onOpenChange={setIsOpen}>
+ *     <CollapsibleTrigger>Toggle</CollapsibleTrigger>
+ *     <CollapsibleContent>Content</CollapsibleContent>
+ *   </Collapsible>
+ */
+export interface HeroUICollapsibleProps {
+  open?: boolean;
+  onOpenChange?: (isOpen: boolean) => void;
+  children?: React.ReactNode;
+  [key: string]: any;
+}
+
+export default function HeroUICollapsible({ open, onOpenChange, children, ...props }: HeroUICollapsibleProps) {
+  // Map shadcn props to HeroUI Accordion
+  const selectedKeys = open ? ["item"] : [];
+  const AccordionAny = Accordion as any;
+
+  return (
+    <AccordionAny
+      selectedKeys={selectedKeys}
+      onSelectionChange={(keys: any) => {
+        const isOpen = Array.from(keys).includes("item");
+        onOpenChange?.(isOpen);
+      }}
+      {...props}
+    >
+      <AccordionAny.Item key="item" aria-label="Collapsible content">
+        {children}
+      </AccordionAny.Item>
+    </AccordionAny>
+  );
+}
+
+export const Collapsible = HeroUICollapsible;
+
+export interface CollapsibleTriggerProps {
+  children?: React.ReactNode;
+  [key: string]: any;
+}
+
+export const CollapsibleTrigger = ({ children, ...props }: CollapsibleTriggerProps) => {
+  const AccordionAny = Accordion as any;
+  return <AccordionAny.Trigger {...props}>{children}</AccordionAny.Trigger>;
+};
+
+export interface CollapsibleContentProps {
+  children?: React.ReactNode;
+  [key: string]: any;
+}
+
+export const CollapsibleContent = ({ children, ...props }: CollapsibleContentProps) => {
+  const AccordionAny = Accordion as any;
+  return <AccordionAny.Panel {...props}>{children}</AccordionAny.Panel>;
+};

package/src/components/library/heroui/{DatePicker.jsx → DatePicker.tsx}

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import { Popover, PopoverTrigger, PopoverContent } from "./Popover";
 
 /**
@@ -16,19 +16,43 @@ import { Popover, PopoverTrigger, PopoverContent } from "./Popover";
  *     </DatePickerContent>
  *   </DatePicker>
  */
-export default function HeroUIDatePicker({ children, ...props }) {
+export interface HeroUIDatePickerProps {
+  children?: React.ReactNode;
+  [key: string]: any;
+}
+
+export default function HeroUIDatePicker({ children, ...props }: HeroUIDatePickerProps) {
   return <Popover {...props}>{children}</Popover>;
 }
 
 export const DatePicker = HeroUIDatePicker;
-export const DatePickerTrigger = ({ children, date, dateFormat, placeholder, className = "", ...props }) => {
+
+export interface DatePickerTriggerProps {
+  children?: React.ReactNode;
+  date?: Date;
+  dateFormat?: string;
+  placeholder?: string;
+  className?: string;
+  [key: string]: any;
+}
+
+export const DatePickerTrigger = ({ children, date, dateFormat, placeholder, className = "", ...props }: DatePickerTriggerProps) => {
   // Accept shadcn DatePicker props but just pass through as trigger
   return <PopoverTrigger {...props}>{children}</PopoverTrigger>;
 };
+
 export const DatePickerContent = PopoverContent;
-export const DatePickerCalendar = ({ date, onSelect, ...props }) => (
+
+export interface DatePickerCalendarProps {
+  date?: Date;
+  onSelect?: (date: Date) => void;
+  [key: string]: any;
+}
+
+export const DatePickerCalendar = ({ date, onSelect, ...props }: DatePickerCalendarProps) => (
   <div className="p-4" {...props}>
     <p className="text-sm text-slate-500">Calendar placeholder - integrate react-day-picker here</p>
   </div>
 );
+
 export const DatePickerRangeTrigger = DatePickerTrigger;

package/src/components/library/heroui/Dialog.tsx

@@ -0,0 +1,43 @@
+import * as React from "react";
+import { Modal } from "@heroui/react";
+
+/**
+ * HeroUI v3 Dialog — maps to Modal for shadcn compatibility.
+ *
+ * Sub-components via dot notation on the named `Modal` export:
+ *   Modal.Backdrop, Modal.Container, Modal.Dialog,
+ *   Modal.CloseTrigger, Modal.Header, Modal.Icon,
+ *   Modal.Heading, Modal.Body, Modal.Footer
+ *
+ * @example
+ *   import { Dialog, DialogTrigger, DialogContent } from "@/components/library";
+ *   <Dialog>
+ *     <DialogTrigger>Open</DialogTrigger>
+ *     <DialogContent>
+ *       <DialogHeader><DialogTitle>Title</DialogTitle></DialogHeader>
+ *       <DialogDescription>Content</DialogDescription>
+ *       <DialogFooter>Actions</DialogFooter>
+ *     </DialogContent>
+ *   </Dialog>
+ */
+export interface HeroUIDialogProps {
+  children: React.ReactNode;
+  [key: string]: any;
+}
+
+export default function HeroUIDialog(props: HeroUIDialogProps) {
+  return <Modal {...props} />;
+}
+
+// Shadcn-compatible exports
+export const Dialog = HeroUIDialog;
+const ModalAny = Modal as any;
+export const DialogTrigger = ModalAny.Trigger || ((props: any) => <button {...props} />);
+export const DialogPortal = ({ children }: { children: React.ReactNode }) => <>{children}</>;
+export const DialogClose = ModalAny.CloseTrigger || ((props: any) => <button {...props} />);
+export const DialogOverlay = ModalAny.Backdrop || ((props: any) => <div {...props} />);
+export const DialogContent = ModalAny.Dialog || ModalAny.Container || ((props: any) => <div {...props} />);
+export const DialogHeader = ModalAny.Header || ((props: any) => <div {...props} />);
+export const DialogFooter = ModalAny.Footer || ((props: any) => <div {...props} />);
+export const DialogTitle = ModalAny.Heading || ((props: any) => <h2 {...props} />);
+export const DialogDescription = (props: any) => <p {...props} />;

package/src/components/library/heroui/{Drawer.jsx → Drawer.tsx}

@@ -1,4 +1,3 @@
-import React from "react";
 import { Drawer } from "@heroui/react";
 
 /**
@@ -25,7 +24,12 @@ import { Drawer } from "@heroui/react";
  *     </Drawer.Backdrop>
  *   </Drawer>
  */
-export default function HeroUIDrawer(props) {
+export interface HeroUIDrawerProps {
+  children: React.ReactNode;
+  [key: string]: any;
+}
+
+export default function HeroUIDrawer(props: HeroUIDrawerProps) {
   return <Drawer {...props} />;
 }
 

package/src/components/library/heroui/{Dropdown.jsx → Dropdown.tsx}

@@ -1,4 +1,3 @@
-import React from "react";
 import { Dropdown } from "@heroui/react";
 
 /**
@@ -21,7 +20,12 @@ import { Dropdown } from "@heroui/react";
  *     </Dropdown.Popover>
  *   </Dropdown>
  */
-export default function HeroUIDropdown(props) {
+export interface HeroUIDropdownProps {
+  children: React.ReactNode;
+  [key: string]: any;
+}
+
+export default function HeroUIDropdown(props: HeroUIDropdownProps) {
   return <Dropdown {...props} />;
 }