@tecsinapse/cortex-react 1.3.0-beta.3 → 1.3.0-beta.30

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,20 +1,31 @@
-import React, { useContext, useCallback } from 'react';
+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 { setOpen, keyExtractor } = useContext(SelectContext);
+  const { keyExtractor } = useContext(SelectContext);
+  const { setIsOpen } = usePopoverContext();
+  const { options: _options, isLoading } = useSelectOptions({ options });
   const handleSelect = useCallback(
     (option) => {
       onSelect(option);
-      setOpen?.(false);
+      setIsOpen?.(false);
     },
     [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,11 +1,8 @@
-import { selectVariants } from '@tecsinapse/cortex-core';
-import React, { useContext } from 'react';
-import { SelectContext } from './context.js';
+import React__default from 'react';
+import { Popover } from '../Popover/index.js';
 
-const { dropdown } = selectVariants();
 const SelectPopover = ({ children }) => {
-  const { open } = useContext(SelectContext);
-  return /* @__PURE__ */ React.createElement("div", { className: dropdown({ open }), "data-testid": "select-popover" }, 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,9 +1,6 @@
-import React, { useState, useRef } from 'react';
-import '@internationalized/date';
-import 'react-aria';
-import 'react-stately';
-import { useOutsideClickListener } from '../../hooks/useOutsideClickListener.js';
-import '@floating-ui/react';
+import React__default from 'react';
+import { Popover } from '../Popover/index.js';
+import { Content } from './Content.js';
 import { SelectContext } from './context.js';
 
 const SelectRoot = ({
@@ -12,19 +9,7 @@ const SelectRoot = ({
   keyExtractor,
   labelExtractor
 }) => {
-  const [open, setOpen] = useState(false);
-  const ref = useRef(null);
-  useOutsideClickListener({
-    ref,
-    onClickOutside: () => setOpen?.(false)
-  });
-  return /* @__PURE__ */ React.createElement(
-    SelectContext.Provider,
-    {
-      value: { value, open, setOpen, keyExtractor, labelExtractor }
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "w-full relative bg-white", ref }, 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,26 +1,28 @@
 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 { Popover } from '../Popover/index.js';
 import { SelectContext } from './context.js';
 
 const { button } = selectVariants();
 const SelectTrigger = ({ label, disabled }) => {
-  const { value, setOpen, labelExtractor, open } = useContext(SelectContext);
-  const placeholder = useMemo(
-    () => value ? labelExtractor(value) : label,
-    [label, value]
-  );
-  return /* @__PURE__ */ React.createElement(
+  const { value, labelExtractor } = useContext(SelectContext);
+  const placeholder = useMemo(() => {
+    if (value?.length === 0 || !value) return 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 }),
-      onClick: () => setOpen?.(!open),
       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)
+  ));
 };
 
 export { SelectTrigger };

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,45 +1,50 @@
-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';
 
-forwardRef((props, ref) => {
-  const {
-    children,
-    text,
-    trigger = "hover",
-    placement = "top",
-    width,
-    height
-  } = props;
-  const arrowRef = useRef(null);
-  const {
-    isOpen,
-    triggerProps,
-    x,
-    y,
-    strategy,
-    refs,
-    context,
-    floatingStyles
-  } = useFloatingLogic({ placement, arrowRef, trigger });
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, React.cloneElement(children, triggerProps), isOpen ? /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      ref: ref || refs.setFloating,
-      className: "bg-black text-white p-2 rounded z-50 shadow-md text-justify",
-      style: {
-        position: strategy,
-        top: y ?? 0,
-        left: x ?? 0,
-        width,
-        height,
-        ...floatingStyles
-      }
-    },
-    text,
-    /* @__PURE__ */ React.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
-  ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
-});
+const Tooltip = forwardRef(
+  (props, ref) => {
+    const {
+      children,
+      text,
+      trigger = "hover",
+      placement = "top",
+      width,
+      height
+    } = props;
+    const arrowRef = useRef(null);
+    const {
+      isOpen,
+      triggerProps,
+      x,
+      y,
+      strategy,
+      refs,
+      context,
+      floatingStyles
+    } = useFloatingLogic({ placement, arrowRef, trigger });
+    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        ref: ref || refs.setFloating,
+        className: "bg-black text-white p-2 rounded z-50 shadow-md text-justify",
+        style: {
+          position: strategy,
+          top: y ?? 0,
+          left: x ?? 0,
+          width,
+          height,
+          ...floatingStyles
+        }
+      },
+      text,
+      /* @__PURE__ */ React__default.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
+    ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+  }
+);
+
+export { Tooltip, Tooltip as default };

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 };