@tecsinapse/cortex-react 1.3.0-beta.8 → 1.3.0

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

@@ -0,0 +1,31 @@
+import { selectVariants } from '@tecsinapse/cortex-core';
+import React__default, { useContext } from 'react';
+import { Select } from './index.js';
+import '@internationalized/date';
+import 'react-aria';
+import 'react-stately';
+import '@floating-ui/react';
+import { useSelectOptions } from '../../hooks/useSelectOptions.js';
+import { SkeletonOptions } from './SkeletonOptions.js';
+import { SelectContext, SelectMultiOptionsContext } from './context.js';
+import { handleSelectMulti } from './utils.js';
+
+const { list } = selectVariants();
+const SelectMultiOptions = ({
+  onSelect,
+  options,
+  children
+}) => {
+  const { keyExtractor, value: currentValue = [] } = 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(
+    Select.MultiOption,
+    {
+      option,
+      key: keyExtractor(option),
+      onSelectOption: (option2) => handleSelectMulti(option2, currentValue, onSelect, keyExtractor)
+    }
+  ))));
+};
+
+export { SelectMultiOptions };

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

@@ -1,18 +1,20 @@
 import { option } from '@tecsinapse/cortex-core';
-import React, { useContext } from 'react';
+import React__default, { useContext } from 'react';
 import { SelectContext } from './context.js';
 
 const SelectOption = ({
   onSelectOption,
-  option: option$1
+  option: option$1,
+  grouped = false
 }) => {
   const { keyExtractor, labelExtractor, value } = useContext(SelectContext);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React__default.createElement(
     "li",
     {
       onClick: () => onSelectOption(option$1),
       className: option({
-        selected: value && keyExtractor(value) === keyExtractor(option$1)
+        selected: value && keyExtractor(value) === keyExtractor(option$1),
+        grouped
       }),
       role: "option"
     },

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

@@ -1,14 +1,23 @@
-import React, { useContext, useCallback } from 'react';
-import { SelectContext } from './context.js';
+import { selectVariants } from '@tecsinapse/cortex-core';
+import React__default, { useContext, useCallback } from 'react';
 import { Select } from './index.js';
+import '@internationalized/date';
+import 'react-aria';
+import 'react-stately';
+import '@floating-ui/react';
+import { useSelectOptions } from '../../hooks/useSelectOptions.js';
 import { usePopoverContext } from '../Popover/Context.js';
+import { SkeletonOptions } from './SkeletonOptions.js';
+import { SelectContext } from './context.js';
 
+const { list } = selectVariants();
 const SelectOptions = ({
   onSelect,
   options
 }) => {
   const { keyExtractor } = useContext(SelectContext);
   const { setIsOpen } = usePopoverContext();
+  const { options: _options, isLoading } = useSelectOptions({ options });
   const handleSelect = useCallback(
     (option) => {
       onSelect(option);
@@ -16,7 +25,7 @@ const SelectOptions = ({
     },
     [onSelect]
   );
-  return /* @__PURE__ */ React.createElement("ul", { role: "select" }, (options ?? []).map((option) => /* @__PURE__ */ React.createElement(
+  return isLoading ? /* @__PURE__ */ React__default.createElement(SkeletonOptions, null) : /* @__PURE__ */ React__default.createElement("ul", { role: "select", className: list() }, _options?.map((option) => /* @__PURE__ */ React__default.createElement(
     Select.Option,
     {
       option,

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

@@ -1,8 +1,8 @@
-import React from 'react';
+import React__default from 'react';
 import { Popover } from '../Popover/index.js';
 
 const SelectPopover = ({ children }) => {
-  return /* @__PURE__ */ React.createElement(Popover.Content, { className: "bg-white max-h-[30vh] w-full overflow-y-scroll gap-y-mili flex flex-col" }, children);
+  return /* @__PURE__ */ React__default.createElement(Popover.Content, { className: "bg-white max-h-[30vh] w-full overflow-y-scroll gap-y-mili flex flex-col p-0" }, children);
 };
 
 export { SelectPopover };

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

@@ -1,6 +1,7 @@
-import React from 'react';
-import Content from './Content.js';
+import React__default from 'react';
 import { Popover } from '../Popover/index.js';
+import { Content } from './Content.js';
+import { SelectContext } from './context.js';
 
 const SelectRoot = ({
   children,
@@ -8,15 +9,7 @@ const SelectRoot = ({
   keyExtractor,
   labelExtractor
 }) => {
-  return /* @__PURE__ */ React.createElement(Popover.Provider, null, /* @__PURE__ */ React.createElement(Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React.createElement(
-    Content,
-    {
-      keyExtractor,
-      labelExtractor,
-      value
-    },
-    children
-  )));
+  return /* @__PURE__ */ React__default.createElement(Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React__default.createElement(SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React__default.createElement(Content, null, children)));
 };
 
 export { SelectRoot };

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

@@ -0,0 +1,9 @@
+import React__default from 'react';
+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 }))));
+};
+
+export { SkeletonOptions };

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

@@ -1,25 +1,31 @@
 import { selectVariants } from '@tecsinapse/cortex-core';
-import React, { useContext, useMemo } from 'react';
+import React__default, { useContext, useMemo } from 'react';
 import { IoChevronDownOutline } from 'react-icons/io5';
-import { SelectContext } from './context.js';
 import { Popover } from '../Popover/index.js';
+import { SelectContext } from './context.js';
 
 const { button } = selectVariants();
-const SelectTrigger = ({ label, disabled }) => {
+const SelectTrigger = ({
+  label,
+  placeholder,
+  disabled
+}) => {
   const { value, labelExtractor } = useContext(SelectContext);
-  const placeholder = useMemo(
-    () => value ? labelExtractor(value) : label,
-    [label, value]
-  );
-  return /* @__PURE__ */ React.createElement(Popover.Trigger, null, /* @__PURE__ */ React.createElement(
+  const _placeholder = useMemo(() => {
+    if (value?.length === 0 || !value) return placeholder ?? label;
+    if (value?.length === 1) return labelExtractor(value[0]);
+    if (value?.length > 1) return `${value.length} items selected`;
+    return labelExtractor(value);
+  }, [label, value]);
+  return /* @__PURE__ */ React__default.createElement(Popover.Trigger, null, /* @__PURE__ */ React__default.createElement(
     "button",
     {
-      className: button({ disabled }),
+      className: button({ disabled, className: "bg-white" }),
       disabled,
       role: "button"
     },
-    /* @__PURE__ */ React.createElement("span", { "data-testid": "select-placeholder" }, placeholder),
-    /* @__PURE__ */ React.createElement(IoChevronDownOutline, null)
+    /* @__PURE__ */ React__default.createElement("span", { "data-testid": "select-placeholder" }, _placeholder),
+    /* @__PURE__ */ React__default.createElement(IoChevronDownOutline, null)
   ));
 };
 

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

@@ -4,5 +4,8 @@ const SelectContext = createContext({
   keyExtractor: () => "",
   labelExtractor: () => ""
 });
+const SelectMultiOptionsContext = createContext({
+  onSelect: () => ""
+});
 
-export { SelectContext };
+export { SelectContext, SelectMultiOptionsContext };

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

@@ -1,4 +1,8 @@
 import { SelectGroupedOptions } from './GroupedOptions.js';
+import { SelectMultiCheckAllOptions } from './MultiCheckAllOptions.js';
+import { SelectMultiGroupedOptions } from './MultiGroupedOptions.js';
+import { SelectMultiOption } from './MultiOption.js';
+import { SelectMultiOptions } from './MultiOptions.js';
 import { SelectOption } from './Option.js';
 import { SelectOptions } from './Options.js';
 import { SelectPopover } from './Popover.js';
@@ -11,7 +15,11 @@ const Select = {
   Popover: SelectPopover,
   Options: SelectOptions,
   GroupedOptions: SelectGroupedOptions,
-  Option: SelectOption
+  Option: SelectOption,
+  MultiOptions: SelectMultiOptions,
+  MultiGroupedOptions: SelectMultiGroupedOptions,
+  MultiOption: SelectMultiOption,
+  MultiCheckAllOptions: SelectMultiCheckAllOptions
 };
 
 export { Select };

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

@@ -0,0 +1,14 @@
+const handleSelectMulti = (option, value, onSelect, keyExtractor) => {
+  const current = Array.from(value ?? []);
+  const indexOf = current.findIndex(
+    (it) => keyExtractor(it) === keyExtractor(option)
+  );
+  if (indexOf === -1) {
+    current.push(option);
+  } else {
+    current.splice(indexOf, 1);
+  }
+  onSelect(current);
+};
+
+export { handleSelectMulti };

package/dist/esm/components/Skeleton.js

@@ -1,12 +1,8 @@
 import clsx from 'clsx';
-import React from 'react';
+import React__default from 'react';
 
-const Skeleton = ({
-  className,
-  children,
-  ...rest
-}) => {
-  return /* @__PURE__ */ React.createElement(
+const Skeleton = ({ className, children, ...rest }) => {
+  return /* @__PURE__ */ React__default.createElement(
     "div",
     {
       ...rest,

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

@@ -0,0 +1,11 @@
+import { snackbar } from '@tecsinapse/cortex-core';
+import React__default, { 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));
+  }
+);
+
+export { BaseSnackbar };

package/dist/esm/components/{DefaultSnack.js → Snackbar/DefaultSnack.js}

@@ -1,18 +1,18 @@
-import React from 'react';
-import { BaseSnackbar } from './BaseSnackbar.js';
+import React__default from 'react';
 import { IoMdInformationCircleOutline, IoMdClose } from 'react-icons/io';
+import { BaseSnackbar } from './BaseSnackbar.js';
 
 const DefaultSnack = ({
   text,
   onDismiss,
   variants
-}) => /* @__PURE__ */ React.createElement(BaseSnackbar, { show: true, variants: { intent: variants?.intent } }, /* @__PURE__ */ React.createElement("div", { className: "flex justify-between items-center flex-row gap-x-mili" }, /* @__PURE__ */ React.createElement(
+}) => /* @__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.createElement("p", null, text), /* @__PURE__ */ React.createElement(
+), /* @__PURE__ */ React__default.createElement("p", null, text), /* @__PURE__ */ React__default.createElement(
   IoMdClose,
   {
     "data-testid": "icon-close",

package/dist/esm/components/Table.js

@@ -1,42 +1,42 @@
 import { tHead, tRow, tHeadCell, hr, tCell, tFoot, tRoot } from '@tecsinapse/cortex-core';
-import React from 'react';
+import React__default from 'react';
 
 const THead = ({
   children,
   className,
   ...rest
-}) => /* @__PURE__ */ React.createElement("thead", { className: tHead({ className }), "data-testid": "thead", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("thead", { className: tHead({ className }), "data-testid": "thead", ...rest }, children);
 const TRow = ({
   children,
   className,
   ...rest
-}) => /* @__PURE__ */ React.createElement("tr", { className: tRow({ className }), "data-testid": "trow", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("tr", { className: tRow({ className }), "data-testid": "trow", ...rest }, children);
 const THeadCell = ({
   children,
   className,
   ...rest
-}) => /* @__PURE__ */ React.createElement("th", { className: tHeadCell({ className }), "data-testid": "thead-cell", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("th", { className: tHeadCell({ className }), "data-testid": "thead-cell", ...rest }, children);
 const TRowHeader = ({
   children
-}) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("tr", { className: tRow(), "data-testid": "trow-header" }, children), /* @__PURE__ */ React.createElement("tr", { className: tRow() }, /* @__PURE__ */ React.createElement("td", { colSpan: 99 }, /* @__PURE__ */ React.createElement("hr", { className: hr() }))));
+}) => /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("tr", { className: tRow(), "data-testid": "trow-header" }, children), /* @__PURE__ */ React__default.createElement("tr", { className: tRow() }, /* @__PURE__ */ React__default.createElement("td", { colSpan: 99 }, /* @__PURE__ */ React__default.createElement("hr", { className: hr() }))));
 const TCell = ({
   children,
   className,
   ...rest
-}) => /* @__PURE__ */ React.createElement("td", { className: tCell({ className }), "data-testid": "tcell", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("td", { className: tCell({ className }), "data-testid": "tcell", ...rest }, children);
 const TFoot = ({
   children,
   className,
   ...rest
-}) => /* @__PURE__ */ React.createElement("tfoot", { className: tFoot({ className }), "data-testid": "tfoot", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("tfoot", { className: tFoot({ className }), "data-testid": "tfoot", ...rest }, children);
 const Table = ({
   children,
   className,
   ...rest
-}) => /* @__PURE__ */ React.createElement("table", { className: tRoot({ className }), "data-testid": "table", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("table", { className: tRoot({ className }), "data-testid": "table", ...rest }, children);
 const Td = ({
   children,
   ...rest
-}) => /* @__PURE__ */ React.createElement("td", { "data-testid": "td", ...rest }, children);
+}) => /* @__PURE__ */ React__default.createElement("td", { "data-testid": "td", ...rest }, children);
 
 export { TCell, TFoot, THead, THeadCell, TRow, TRowHeader, Table, Td };

package/dist/esm/components/Tag.js

@@ -1,16 +1,9 @@
-import React, { forwardRef } from 'react';
 import { tag } from '@tecsinapse/cortex-core';
+import React__default, { forwardRef } from 'react';
 
 const Tag = forwardRef((props, ref) => {
   const { label, variants } = props;
-  return /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: tag(variants),
-      ref
-    },
-    /* @__PURE__ */ React.createElement("p", null, label)
-  );
+  return /* @__PURE__ */ React__default.createElement("div", { className: tag(variants), ref }, /* @__PURE__ */ React__default.createElement("p", null, label));
 });
 
 export { Tag };

package/dist/esm/components/TextArea/Box.js

@@ -0,0 +1,45 @@
+import { inputBox, labelStyle } from '@tecsinapse/cortex-core';
+import clsx from 'clsx';
+import React__default from 'react';
+
+const TextAreaBox = React__default.forwardRef(
+  ({
+    id,
+    name,
+    variants,
+    label,
+    placeholder,
+    rows,
+    className,
+    ...rest
+  }, ref) => {
+    return /* @__PURE__ */ React__default.createElement("div", { className: "flex w-full flex-col" }, /* @__PURE__ */ React__default.createElement(
+      "textarea",
+      {
+        "data-testid": "textarea-box",
+        ref,
+        id: id ?? name,
+        name,
+        placeholder: placeholder ?? " ",
+        className: clsx(
+          inputBox(placeholder, label, className),
+          "resize-none mt-mili"
+        ),
+        rows,
+        ...rest
+      }
+    ), /* @__PURE__ */ React__default.createElement(
+      "label",
+      {
+        htmlFor: id ?? name,
+        className: labelStyle({
+          intent: variants?.intent,
+          placeholder
+        })
+      },
+      label
+    ));
+  }
+);
+
+export { TextAreaBox };

package/dist/esm/components/TextArea/Face.js

@@ -0,0 +1,25 @@
+import { input } from '@tecsinapse/cortex-core';
+import clsx from 'clsx';
+import React__default from 'react';
+import { getValidChildren } from './utils.js';
+
+const TextAreaFace = React__default.forwardRef(
+  ({ children, variants, className, ...rest }, ref) => {
+    const clones = getValidChildren(children).map((el) => {
+      return React__default.cloneElement(el, { ...el.props, variants });
+    });
+    return /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        ref,
+        className: clsx(input(variants), className),
+        "data-testid": "textarea-face",
+        id: "textarea-face",
+        ...rest
+      },
+      clones
+    );
+  }
+);
+
+export { TextAreaFace };

package/dist/esm/components/TextArea/Left.js

@@ -0,0 +1,8 @@
+import clsx from 'clsx';
+import React__default from 'react';
+
+const TextAreaLeft = React__default.forwardRef(({ children, className, ...rest }, ref) => {
+  return /* @__PURE__ */ React__default.createElement("div", { className: clsx(className, "mr-2.5"), ...rest, ref }, children);
+});
+
+export { TextAreaLeft };

package/dist/esm/components/TextArea/Right.js

@@ -0,0 +1,8 @@
+import clsx from 'clsx';
+import React__default from 'react';
+
+const TextAreaRight = React__default.forwardRef(({ children, className, ...rest }, ref) => {
+  return /* @__PURE__ */ React__default.createElement("div", { className: clsx(className, "ml-2.5"), ...rest, ref }, children);
+});
+
+export { TextAreaRight };

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

@@ -0,0 +1,9 @@
+import React__default from 'react';
+import { TextAreaBox } from './Box.js';
+import { TextAreaFace } from './Face.js';
+
+const TextAreaRoot = React__default.forwardRef(({ variants, className, ...rest }, ref) => {
+  return /* @__PURE__ */ React__default.createElement(TextAreaFace, { variants, className }, /* @__PURE__ */ React__default.createElement(TextAreaBox, { ref, ...rest }));
+});
+
+export { TextAreaRoot };

package/dist/esm/components/TextArea/index.js

@@ -0,0 +1,15 @@
+import { TextAreaBox } from './Box.js';
+import { TextAreaFace } from './Face.js';
+import { TextAreaLeft } from './Left.js';
+import { TextAreaRight } from './Right.js';
+import { TextAreaRoot } from './Root.js';
+
+const TextArea = {
+  Root: TextAreaRoot,
+  Face: TextAreaFace,
+  Box: TextAreaBox,
+  Left: TextAreaLeft,
+  Right: TextAreaRight
+};
+
+export { TextArea };

package/dist/esm/components/TextArea/utils.js

@@ -0,0 +1,9 @@
+import React__default from 'react';
+
+const getValidChildren = (children) => {
+  return React__default.Children.toArray(children).filter(
+    (el) => React__default.isValidElement(el)
+  );
+};
+
+export { getValidChildren };

package/dist/esm/components/TimeField/TimeField.js

@@ -0,0 +1,10 @@
+import React__default from 'react';
+import { useTimeField } from '../../hooks/useTimeField.js';
+import { DateSegment } from '../DatePicker/DateSegment.js';
+
+const TimeField = (props) => {
+  const { fieldProps, ref, state } = useTimeField(props);
+  return /* @__PURE__ */ React__default.createElement("div", { ...fieldProps, ref, className: "flex flex-row" }, state.segments.map((segment, i) => /* @__PURE__ */ React__default.createElement(DateSegment, { key: i, segment, state })));
+};
+
+export { TimeField };

package/dist/esm/components/TimeField/TimeFieldInput.js

@@ -0,0 +1,20 @@
+import { labelStyle, inputBox } from '@tecsinapse/cortex-core';
+import React__default from 'react';
+import { Input } from '../Input/index.js';
+import { TimeField } from './TimeField.js';
+
+const TimeFieldInput = (props) => {
+  const { onChange, value, label, variants } = props;
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+    Input.Face,
+    {
+      variants,
+      className: "flex flex-row",
+      "data-testid": "time-field-input"
+    },
+    /* @__PURE__ */ React__default.createElement("span", { className: labelStyle({}) }, label),
+    /* @__PURE__ */ React__default.createElement("div", { className: inputBox("", label) }, /* @__PURE__ */ React__default.createElement(TimeField, { onChange, value }))
+  ));
+};
+
+export { TimeFieldInput };

package/dist/esm/components/Toggle.js

@@ -1,14 +1,14 @@
 import { styleLabelElement, styleInputElement, toggle } from '@tecsinapse/cortex-core';
-import React, { forwardRef } from 'react';
+import React__default, { forwardRef } from 'react';
 
 const Toggle = forwardRef((props, ref) => {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React__default.createElement(
     "div",
     {
       className: "flex flex-row items-center gap-x-centi",
       "data-testid": "toggle-div"
     },
-    /* @__PURE__ */ React.createElement("label", { className: styleLabelElement() }, /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React__default.createElement("label", { className: styleLabelElement() }, /* @__PURE__ */ React__default.createElement(
       "input",
       {
         type: "checkbox",
@@ -17,7 +17,7 @@ const Toggle = forwardRef((props, ref) => {
         "data-testid": "toggle-input",
         ...props
       }
-    ), /* @__PURE__ */ React.createElement("div", { className: toggle() }))
+    ), /* @__PURE__ */ React__default.createElement("div", { className: toggle() }))
   );
 });
 

package/dist/esm/components/Tooltip.js

@@ -1,8 +1,9 @@
-import React, { forwardRef, useRef } from 'react';
 import { FloatingArrow } from '@floating-ui/react';
+import React__default, { forwardRef, useRef } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
+import { cloneWithProps } from './utils.js';
 import { useFloatingLogic } from '../hooks/useFloatingLogic.js';
 
 const Tooltip = forwardRef(
@@ -26,7 +27,7 @@ const Tooltip = forwardRef(
       context,
       floatingStyles
     } = useFloatingLogic({ placement, arrowRef, trigger });
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, React.cloneElement(children, triggerProps), isOpen ? /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React__default.createElement(
       "div",
       {
         ref: ref || refs.setFloating,
@@ -41,8 +42,8 @@ const Tooltip = forwardRef(
         }
       },
       text,
-      /* @__PURE__ */ React.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
-    ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
+      /* @__PURE__ */ React__default.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
+    ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
   }
 );
 

package/dist/esm/components/utils.js

@@ -1,4 +1,5 @@
 import { CalendarDate, getLocalTimeZone } from '@internationalized/date';
+import React__default from 'react';
 
 const getNameInitials = (name) => {
   const nameSplit = name.split(" ");
@@ -18,5 +19,8 @@ const dateToCalendarDate = (value) => {
 const calendarDateToDate = (value) => {
   return value.toDate(getLocalTimeZone());
 };
+function cloneWithProps(children, triggerProps) {
+  return React__default.cloneElement(/* @__PURE__ */ React__default.createElement("div", null, children), triggerProps);
+}
 
-export { calendarDateToDate, dateToCalendarDate, getNameInitials };
+export { calendarDateToDate, cloneWithProps, dateToCalendarDate, getNameInitials };

package/dist/esm/hooks/useSelectGroupedOptions.js

@@ -0,0 +1,33 @@
+import { useState, useEffect } from 'react';
+
+const useSelectGroupedOptions = ({
+  options: _options
+}) => {
+  const [options, setOptions] = useState();
+  const [isLoading, setIsLoading] = useState();
+  const [error, setError] = useState();
+  const initData = async (fetch) => {
+    setIsLoading(true);
+    try {
+      const result = await fetch();
+      if (result) {
+        setOptions(result ?? []);
+      }
+    } catch (e) {
+      setError(String(e));
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  useEffect(() => {
+    if (typeof _options === "function") initData(_options);
+    else setOptions(_options);
+  }, [_options]);
+  return {
+    isLoading,
+    options,
+    error
+  };
+};
+
+export { useSelectGroupedOptions };