@tecsinapse/cortex-react 1.13.1-beta.2 → 1.13.1-beta.3

package/dist/esm/components/Select/CustomMultiOption.js

@@ -1,5 +1,5 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { option, checkbox } from '@tecsinapse/cortex-core';
-import React__default from 'react';
 import { useMultiSelectOption } from './useMultiSelectOption.js';
 
 const SelectCustomMultiOption = ({
@@ -12,24 +12,26 @@ const SelectCustomMultiOption = ({
     option$1,
     onSelect
   );
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsxs(
     "li",
     {
       onClick: onClickOption,
       className: option({ grouped }),
-      role: "option"
-    },
-    /* @__PURE__ */ React__default.createElement(
-      "input",
-      {
-        type: "checkbox",
-        checked: isChecked,
-        className: checkbox({ className: "pointer-events-none" }),
-        onChange: () => false,
-        ref: inputRef
-      }
-    ),
-    children
+      role: "option",
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            checked: isChecked,
+            className: checkbox({ className: "pointer-events-none" }),
+            onChange: () => false,
+            ref: inputRef
+          }
+        ),
+        children
+      ]
+    }
   );
 };
 

package/dist/esm/components/Select/CustomOption.js

@@ -1,4 +1,5 @@
-import React__default, { useContext } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
 import { SelectContext } from './context.js';
 import { option } from '@tecsinapse/cortex-core';
 
@@ -9,7 +10,7 @@ const SelectCustomOption = ({
   children
 }) => {
   const { keyExtractor, value } = useContext(SelectContext);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     "li",
     {
       onClick: (e) => {
@@ -20,9 +21,9 @@ const SelectCustomOption = ({
         selected: value && keyExtractor(value) === keyExtractor(option$1),
         grouped
       }),
-      role: "option"
-    },
-    children
+      role: "option",
+      children
+    }
   );
 };
 

package/dist/esm/components/Select/GroupedOptions.js

@@ -1,5 +1,6 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { selectVariants } from '@tecsinapse/cortex-core';
-import React__default, { useContext, useCallback } from 'react';
+import { useContext, useCallback } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
@@ -29,15 +30,18 @@ const SelectGroupedOptions = ({
     },
     [onSelect]
   );
-  return isLoading ? /* @__PURE__ */ React__default.createElement(SkeletonOptions, null) : /* @__PURE__ */ React__default.createElement("ul", { role: "select", className: list() }, [..._options ?? []].map(([key, value]) => /* @__PURE__ */ React__default.createElement("div", { key }, /* @__PURE__ */ React__default.createElement("span", { className: groupedTitle() }, groupedLabelExtractor?.(key)), value.map((option) => /* @__PURE__ */ React__default.createElement(
-    SelectOption,
-    {
-      grouped: true,
-      option,
-      key: keyExtractor(option),
-      onSelectOption: handleSelect
-    }
-  )))));
+  return isLoading ? /* @__PURE__ */ jsx(SkeletonOptions, {}) : /* @__PURE__ */ jsx("ul", { role: "select", className: list(), children: [..._options ?? []].map(([key, value]) => /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("span", { className: groupedTitle(), children: groupedLabelExtractor?.(key) }),
+    value.map((option) => /* @__PURE__ */ jsx(
+      SelectOption,
+      {
+        grouped: true,
+        option,
+        onSelectOption: handleSelect
+      },
+      keyExtractor(option)
+    ))
+  ] }, key)) });
 };
 
 export { SelectGroupedOptions };

package/dist/esm/components/Select/MultiCheckAllOptions.js

@@ -1,5 +1,6 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { option, checkbox } from '@tecsinapse/cortex-core';
-import React__default, { useContext, useMemo, useCallback } from 'react';
+import { useContext, useMemo, useCallback } from 'react';
 import { SelectContext, SelectMultiOptionsContext } from './context.js';
 
 const SelectMultiCheckAllOptions = ({
@@ -34,15 +35,18 @@ const SelectMultiCheckAllOptions = ({
       onSelect?.(updateSelected);
     }
   }, [options, onSelect]);
-  return options?.length ? /* @__PURE__ */ React__default.createElement("div", { className: option(), onClick: checkAll }, /* @__PURE__ */ React__default.createElement(
-    "input",
-    {
-      type: "checkbox",
-      className: checkbox(),
-      onChange: () => void 0,
-      checked: isChecked
-    }
-  ), /* @__PURE__ */ React__default.createElement("span", null, checkAllLabel)) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null);
+  return options?.length ? /* @__PURE__ */ jsxs("div", { className: option(), onClick: checkAll, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "checkbox",
+        className: checkbox(),
+        onChange: () => void 0,
+        checked: isChecked
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { children: checkAllLabel })
+  ] }) : /* @__PURE__ */ jsx(Fragment, {});
 };
 
 export { SelectMultiCheckAllOptions };

package/dist/esm/components/Select/MultiGroupedOptions.js

@@ -1,5 +1,6 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { selectVariants } from '@tecsinapse/cortex-core';
-import React__default, { useContext, useMemo } from 'react';
+import { useContext, useMemo } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
@@ -26,21 +27,26 @@ const SelectMultiGroupedOptions = ({
     () => _options ? Array.from(_options?.values()).flatMap((value) => value) : [],
     [_options]
   );
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsxs(
     SelectMultiOptionsContext.Provider,
     {
-      value: { onSelect, options: flattenMap }
-    },
-    children,
-    isLoading ? /* @__PURE__ */ React__default.createElement(SkeletonOptions, null) : /* @__PURE__ */ React__default.createElement("ul", { role: "select", className: list() }, [..._options ?? []].map(([key, value]) => /* @__PURE__ */ React__default.createElement("div", { key }, /* @__PURE__ */ React__default.createElement("span", { className: groupedTitle() }, groupedLabelExtractor?.(key)), value.map((option) => /* @__PURE__ */ React__default.createElement(
-      SelectMultiOption,
-      {
-        grouped: true,
-        option,
-        key: keyExtractor(option),
-        onSelect
-      }
-    )))))
+      value: { onSelect, options: flattenMap },
+      children: [
+        children,
+        isLoading ? /* @__PURE__ */ jsx(SkeletonOptions, {}) : /* @__PURE__ */ jsx("ul", { role: "select", className: list(), children: [..._options ?? []].map(([key, value]) => /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("span", { className: groupedTitle(), children: groupedLabelExtractor?.(key) }),
+          value.map((option) => /* @__PURE__ */ jsx(
+            SelectMultiOption,
+            {
+              grouped: true,
+              option,
+              onSelect
+            },
+            keyExtractor(option)
+          ))
+        ] }, key)) })
+      ]
+    }
   );
 };
 

package/dist/esm/components/Select/MultiOption.js

@@ -1,5 +1,5 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { option, checkbox } from '@tecsinapse/cortex-core';
-import React__default from 'react';
 import { useMultiSelectOption } from './useMultiSelectOption.js';
 
 const SelectMultiOption = ({
@@ -8,24 +8,26 @@ const SelectMultiOption = ({
   grouped = false
 }) => {
   const { onClickOption, isChecked, inputRef, labelExtractor } = useMultiSelectOption(option$1, onSelect);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsxs(
     "li",
     {
       onClick: onClickOption,
       className: option({ grouped }),
-      role: "option"
-    },
-    /* @__PURE__ */ React__default.createElement(
-      "input",
-      {
-        type: "checkbox",
-        checked: isChecked,
-        className: checkbox({ className: "pointer-events-none" }),
-        onChange: () => false,
-        ref: inputRef
-      }
-    ),
-    labelExtractor(option$1)
+      role: "option",
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            checked: isChecked,
+            className: checkbox({ className: "pointer-events-none" }),
+            onChange: () => false,
+            ref: inputRef
+          }
+        ),
+        labelExtractor(option$1)
+      ]
+    }
   );
 };
 

package/dist/esm/components/Select/MultiOptions.js

@@ -1,5 +1,6 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { selectVariants } from '@tecsinapse/cortex-core';
-import React__default, { useContext } from 'react';
+import { useContext } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
@@ -21,14 +22,17 @@ const SelectMultiOptions = ({
 }) => {
   const { keyExtractor } = useContext(SelectContext);
   const { options: _options, isLoading } = useSelectOptions({ options });
-  return /* @__PURE__ */ React__default.createElement(SelectMultiOptionsContext.Provider, { value: { onSelect, options: _options } }, isLoading ? /* @__PURE__ */ React__default.createElement(SkeletonOptions, null) : /* @__PURE__ */ React__default.createElement("ul", { role: "select", className: list() }, children, _options?.map((option) => /* @__PURE__ */ React__default.createElement(
-    SelectMultiOption,
-    {
-      option,
-      key: keyExtractor(option),
-      onSelect
-    }
-  ))));
+  return /* @__PURE__ */ jsx(SelectMultiOptionsContext.Provider, { value: { onSelect, options: _options }, children: isLoading ? /* @__PURE__ */ jsx(SkeletonOptions, {}) : /* @__PURE__ */ jsxs("ul", { role: "select", className: list(), children: [
+    children,
+    _options?.map((option) => /* @__PURE__ */ jsx(
+      SelectMultiOption,
+      {
+        option,
+        onSelect
+      },
+      keyExtractor(option)
+    ))
+  ] }) });
 };
 
 export { SelectMultiOptions };

package/dist/esm/components/Select/Option.js

@@ -1,5 +1,6 @@
+import { jsx } from 'react/jsx-runtime';
 import { option } from '@tecsinapse/cortex-core';
-import React__default, { useContext } from 'react';
+import { useContext } from 'react';
 import { SelectContext } from './context.js';
 
 const SelectOption = ({
@@ -8,7 +9,7 @@ const SelectOption = ({
   grouped = false
 }) => {
   const { keyExtractor, labelExtractor, value } = useContext(SelectContext);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     "li",
     {
       onClick: () => onSelectOption(option$1),
@@ -16,9 +17,9 @@ const SelectOption = ({
         selected: value && keyExtractor(value) === keyExtractor(option$1),
         grouped
       }),
-      role: "option"
-    },
-    labelExtractor(option$1)
+      role: "option",
+      children: labelExtractor(option$1)
+    }
   );
 };
 

package/dist/esm/components/Select/Options.js

@@ -1,5 +1,6 @@
+import { jsx } from 'react/jsx-runtime';
 import { selectVariants } from '@tecsinapse/cortex-core';
-import React__default, { useContext, useCallback, useMemo } from 'react';
+import { useContext, useCallback, useMemo } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
@@ -30,17 +31,17 @@ const SelectOptions = ({
     [onSelect]
   );
   const defaultOptions = useMemo(
-    () => _options?.map((option) => /* @__PURE__ */ React__default.createElement(
+    () => _options?.map((option) => /* @__PURE__ */ jsx(
       SelectOption,
       {
         option,
-        key: keyExtractor(option),
         onSelectOption: handleSelect
-      }
+      },
+      keyExtractor(option)
     )) ?? [],
     [_options, keyExtractor, handleSelect]
   );
-  return isLoading ? /* @__PURE__ */ React__default.createElement(SkeletonOptions, null) : /* @__PURE__ */ React__default.createElement("ul", { role: "select", className: list() }, children ?? defaultOptions);
+  return isLoading ? /* @__PURE__ */ jsx(SkeletonOptions, {}) : /* @__PURE__ */ jsx("ul", { role: "select", className: list(), children: children ?? defaultOptions });
 };
 
 export { SelectOptions };

package/dist/esm/components/Select/Popover.js

@@ -1,21 +1,22 @@
-import React__default, { useContext } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
 import { Popover } from '../Popover/index.js';
 import { FloatingPortal } from '@floating-ui/react';
 import { SelectContext } from './context.js';
 
 const SelectPopover = ({ children }) => {
   const { triggerWidth } = useContext(SelectContext);
-  return /* @__PURE__ */ React__default.createElement(FloatingPortal, null, /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(FloatingPortal, { children: /* @__PURE__ */ jsx(
     Popover.Content,
     {
       className: "bg-white max-h-[30vh] overflow-y-scroll gap-y-mili flex flex-col p-0",
       style: {
         width: triggerWidth ? `${triggerWidth}px` : "auto",
         zIndex: 9999
-      }
-    },
-    children
-  ));
+      },
+      children
+    }
+  ) });
 };
 
 export { SelectPopover };

package/dist/esm/components/Select/Root.js

@@ -1,4 +1,5 @@
-import React__default, { useState } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
 import { Popover } from '../Popover/index.js';
 import { Content } from './Content.js';
 import { SelectContext } from './context.js';
@@ -11,26 +12,26 @@ const SelectRoot = ({
   className
 }) => {
   const [triggerWidth, setTriggerWidth] = useState(0);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     Popover.Root,
     {
       fallbackPlacements: ["bottom", "top"],
       placement: "bottom",
-      trigger: "click"
-    },
-    /* @__PURE__ */ React__default.createElement(
-      SelectContext.Provider,
-      {
-        value: {
-          value,
-          keyExtractor,
-          labelExtractor,
-          triggerWidth,
-          setTriggerWidth
+      trigger: "click",
+      children: /* @__PURE__ */ jsx(
+        SelectContext.Provider,
+        {
+          value: {
+            value,
+            keyExtractor,
+            labelExtractor,
+            triggerWidth,
+            setTriggerWidth
+          },
+          children: /* @__PURE__ */ jsx(Content, { className, children })
         }
-      },
-      /* @__PURE__ */ React__default.createElement(Content, { className }, children)
-    )
+      )
+    }
   );
 };
 

package/dist/esm/components/Select/SkeletonOptions.js

@@ -1,9 +1,9 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { Skeleton } from '../Skeleton.js';
 
 const optionSkeletonStyle = "w-full px-deca my-nano h-[30px]";
 const SkeletonOptions = () => {
-  return /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col gap-y-nano" }, Array.from(Array(10).keys()).map((value) => /* @__PURE__ */ React__default.createElement(Skeleton, { key: value }, /* @__PURE__ */ React__default.createElement("div", { className: optionSkeletonStyle }))));
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-nano", children: Array.from(Array(10).keys()).map((value) => /* @__PURE__ */ jsx(Skeleton, { children: /* @__PURE__ */ jsx("div", { className: optionSkeletonStyle }) }, value)) });
 };
 
 export { SkeletonOptions };

package/dist/esm/components/Select/Trigger.js

@@ -1,4 +1,5 @@
-import React__default, { useContext, useRef, useMemo, useEffect } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useContext, useRef, useMemo, useEffect } from 'react';
 import { IoChevronDownOutline } from 'react-icons/io5';
 import { Popover } from '../Popover/index.js';
 import { SelectContext } from './context.js';
@@ -29,36 +30,41 @@ const SelectTrigger = ({
       setTriggerWidth(width);
     }
   }, [triggerRef.current, setTriggerWidth]);
-  return /* @__PURE__ */ React__default.createElement(Popover.Trigger, { disabled }, /* @__PURE__ */ React__default.createElement("div", { className: "w-full gap-mili" }, /* @__PURE__ */ React__default.createElement(
-    "button",
-    {
-      ref: triggerRef,
-      className: button({ className: rest.className }),
-      disabled,
-      role: "button",
-      ...rest
-    },
-    /* @__PURE__ */ React__default.createElement(
-      "span",
+  return /* @__PURE__ */ jsx(Popover.Trigger, { disabled, children: /* @__PURE__ */ jsxs("div", { className: "w-full gap-mili", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
       {
-        className: clsx({ "mt-mili": hasValue && label }),
-        "data-testid": "select-placeholder"
-      },
-      _placeholder
+        ref: triggerRef,
+        className: button({ className: rest.className }),
+        disabled,
+        role: "button",
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: clsx({ "mt-mili": hasValue && label }),
+              "data-testid": "select-placeholder",
+              children: _placeholder
+            }
+          ),
+          /* @__PURE__ */ jsx(IoChevronDownOutline, {})
+        ]
+      }
     ),
-    /* @__PURE__ */ React__default.createElement(IoChevronDownOutline, null)
-  ), hasValue && label ? /* @__PURE__ */ React__default.createElement(
-    "label",
-    {
-      htmlFor: "select-trigger",
-      className: clsx(
-        "ml-centi",
-        labelStyle({ intent: "default", placeholder })
-      ),
-      "data-testid": "input-label"
-    },
-    label
-  ) : null));
+    hasValue && label ? /* @__PURE__ */ jsx(
+      "label",
+      {
+        htmlFor: "select-trigger",
+        className: clsx(
+          "ml-centi",
+          labelStyle({ intent: "default", placeholder })
+        ),
+        "data-testid": "input-label",
+        children: label
+      }
+    ) : null
+  ] }) });
 };
 
 export { SelectTrigger };

package/dist/esm/components/Skeleton.js

@@ -1,15 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import React__default from 'react';
 
 const Skeleton = ({ className, children, ...rest }) => {
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     "div",
     {
       ...rest,
       "data-testid": "skeleton",
-      className: clsx("animate-pulse bg-secondary-light", className)
-    },
-    children
+      className: clsx("animate-pulse bg-secondary-light", className),
+      children
+    }
   );
 };
 

package/dist/esm/components/Snackbar/BaseSnackbar.js

@@ -1,10 +1,11 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
 import { snackbar } from '@tecsinapse/cortex-core';
-import React__default, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 
 const BaseSnackbar = forwardRef(
   (props, ref) => {
     const { children, show, variants } = props;
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, show ? /* @__PURE__ */ React__default.createElement("div", { className: snackbar(variants), ref, "data-testid": "snackbar" }, children) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+    return /* @__PURE__ */ jsx(Fragment, { children: show ? /* @__PURE__ */ jsx("div", { className: snackbar(variants), ref, "data-testid": "snackbar", children }) : /* @__PURE__ */ jsx(Fragment, {}) });
   }
 );
 

package/dist/esm/components/Snackbar/DefaultSnack.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { IoMdInformationCircleOutline, IoMdClose } from 'react-icons/io';
 import { BaseSnackbar } from './BaseSnackbar.js';
 
@@ -6,20 +6,24 @@ const DefaultSnack = ({
   text,
   onDismiss,
   variants
-}) => /* @__PURE__ */ React__default.createElement(BaseSnackbar, { show: true, variants: { intent: variants?.intent } }, /* @__PURE__ */ React__default.createElement("div", { className: "flex justify-between items-center flex-row gap-x-mili" }, /* @__PURE__ */ React__default.createElement(
-  IoMdInformationCircleOutline,
-  {
-    className: "w-[20px] h-[20px] shrink-0",
-    "data-testid": "icon-info"
-  }
-), /* @__PURE__ */ React__default.createElement("p", null, text), /* @__PURE__ */ React__default.createElement(
-  IoMdClose,
-  {
-    "data-testid": "icon-close",
-    onClick: onDismiss,
-    size: 24,
-    className: "cursor-pointer w-[20px] h-[20px] shrink-0"
-  }
-)));
+}) => /* @__PURE__ */ jsx(BaseSnackbar, { show: true, variants: { intent: variants?.intent }, children: /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center flex-row gap-x-mili", children: [
+  /* @__PURE__ */ jsx(
+    IoMdInformationCircleOutline,
+    {
+      className: "w-[20px] h-[20px] shrink-0",
+      "data-testid": "icon-info"
+    }
+  ),
+  /* @__PURE__ */ jsx("p", { children: text }),
+  /* @__PURE__ */ jsx(
+    IoMdClose,
+    {
+      "data-testid": "icon-close",
+      onClick: onDismiss,
+      size: 24,
+      className: "cursor-pointer w-[20px] h-[20px] shrink-0"
+    }
+  )
+] }) });
 
 export { DefaultSnack };

package/dist/esm/components/Stepper/Node.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { StepNodeVariants } from '../../styles/stepNodeVariants.js';
 
 const Node = ({
@@ -22,7 +22,10 @@ const Node = ({
     disabled: rest.disabled,
     interactive
   });
-  return /* @__PURE__ */ React__default.createElement("button", { type: "button", className: container({ className }), ...rest }, children ? /* @__PURE__ */ React__default.createElement("div", { className: content() }, children) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null), segmented ? /* @__PURE__ */ React__default.createElement("div", { className: separator() }) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+  return /* @__PURE__ */ jsxs("button", { type: "button", className: container({ className }), ...rest, children: [
+    children ? /* @__PURE__ */ jsx("div", { className: content(), children }) : /* @__PURE__ */ jsx(Fragment, {}),
+    segmented ? /* @__PURE__ */ jsx("div", { className: separator() }) : /* @__PURE__ */ jsx(Fragment, {})
+  ] });
 };
 
 export { Node };