@tecsinapse/cortex-react 1.4.1 → 1.4.3

package/dist/cjs/components/Accordion.js

@@ -18,7 +18,8 @@ const Trigger = ({
   /**
    * Only applied to trigger arrow
    */
-  className
+  className,
+  onOpen
 }) => {
   const { open, toggle } = useAccordionContext();
   if (!floating && !label) {
@@ -26,6 +27,12 @@ const Trigger = ({
       "A label must be specified if the trigger is not floating variant"
     );
   }
+  const action = () => {
+    if (!open) {
+      onOpen?.();
+    }
+    toggle?.();
+  };
   return /* @__PURE__ */ React.createElement(
     "div",
     {
@@ -33,7 +40,7 @@ const Trigger = ({
         "flex flex-col justify-between align-center px-mili border-r border-secondary-light cursor-pointer",
         { "mr-deca": floating }
       ),
-      onClick: toggle
+      onClick: action
     },
     /* @__PURE__ */ React.createElement(
       "div",
@@ -93,8 +100,14 @@ const Face = ({
   const toggle = React.useCallback(() => setOpen((prev) => !prev), []);
   return /* @__PURE__ */ React.createElement(Context.Provider, { value: { open, toggle } }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-row" }, children));
 };
-const Root = ({ children, defaultOpen, label, floating }) => {
-  return /* @__PURE__ */ React.createElement(Face, { defaultOpen }, /* @__PURE__ */ React.createElement(Trigger, { label, floating }), /* @__PURE__ */ React.createElement(Content, null, children));
+const Root = ({
+  children,
+  defaultOpen,
+  label,
+  floating,
+  onOpen
+}) => {
+  return /* @__PURE__ */ React.createElement(Face, { defaultOpen }, /* @__PURE__ */ React.createElement(Trigger, { label, floating, onOpen }), /* @__PURE__ */ React.createElement(Content, null, children));
 };
 const Accordion = {
   Face,
@@ -104,3 +117,4 @@ const Accordion = {
 };
 
 exports.Accordion = Accordion;
+exports.useAccordionContext = useAccordionContext;

package/dist/cjs/components/Carousel/Carousel.js

@@ -0,0 +1,43 @@
+'use strict';
+
+var React = require('react');
+var Button = require('../Button.js');
+var reactSpringCarousel = require('react-spring-carousel');
+var io = require('react-icons/io');
+var CarouselItem = require('./CarouselItem.js');
+
+const Carousel = ({ images }) => {
+  const itemsCarousel = images.map((imageProp, i) => ({
+    id: `${imageProp.alt}-${i}`,
+    renderItem: /* @__PURE__ */ React.createElement(CarouselItem.CarouselItem, { item: imageProp })
+  }));
+  const { carouselFragment, slideToNextItem, slideToPrevItem } = reactSpringCarousel.useSpringCarousel({
+    withLoop: true,
+    items: itemsCarousel
+  });
+  return /* @__PURE__ */ React.createElement("div", { className: "overflow-hidden w-fit relative" }, itemsCarousel.length > 1 ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    Button.Button,
+    {
+      "data-testid": "button-carousel-prev",
+      variants: {
+        size: "square",
+        className: "z-absolute absolute left-deca top-[50%]  transform -translate-y-[50%] p-centi"
+      },
+      onClick: slideToPrevItem
+    },
+    /* @__PURE__ */ React.createElement(io.IoIosArrowBack, null)
+  ), /* @__PURE__ */ React.createElement(
+    Button.Button,
+    {
+      "data-testid": "button-carousel-next",
+      variants: {
+        size: "square",
+        className: "z-absolute absolute right-deca top-[50%] transform -translate-y-[50%] p-centi"
+      },
+      onClick: slideToNextItem
+    },
+    /* @__PURE__ */ React.createElement(io.IoIosArrowForward, null)
+  )) : /* @__PURE__ */ React.createElement(React.Fragment, null), carouselFragment);
+};
+
+exports.Carousel = Carousel;

package/dist/cjs/components/Carousel/CarouselItem.js

@@ -0,0 +1,50 @@
+'use strict';
+
+var React = require('react');
+var clsx = require('clsx');
+var Button = require('../Button.js');
+
+const CarouselItem = ({ item }) => {
+  const stylesTitle = {
+    color: item.title.color ?? "black",
+    fontSize: item.title?.size ?? "1rem"
+  };
+  const stylesSubTitle = {
+    color: item.subtitle.color ?? "white",
+    fontSize: item.subtitle?.size ?? "1rem"
+  };
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    "img",
+    {
+      className: "w-full h-[360px] object-fill rounded-mili",
+      src: item.src,
+      alt: item.alt
+    }
+  ), /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: "z-absolute absolute top-[50%] transform -translate-y-[50%] left-[10%] max-w-[60%]"
+    },
+    /* @__PURE__ */ React.createElement("p", { className: clsx("text-h2 font-bold"), style: stylesTitle }, item.title.text),
+    /* @__PURE__ */ React.createElement("p", { className: "text-white text-h2 font-bold", style: stylesSubTitle }, item.subtitle.text)
+  ), item.button ? /* @__PURE__ */ React.createElement(
+    "a",
+    {
+      href: item.button.link,
+      target: item.button.target ?? "_self",
+      rel: "noopener noreferrer"
+    },
+    /* @__PURE__ */ React.createElement(
+      Button.Button,
+      {
+        "data-testid": "button-link-carousel",
+        variants: {
+          className: "z-absolute absolute bottom-deca left-[10%]"
+        }
+      },
+      item.button.title
+    )
+  ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
+};
+
+exports.CarouselItem = CarouselItem;

package/dist/cjs/components/Menubar/MostUsedList.js

@@ -48,6 +48,7 @@ require('../TextArea/Right.js');
 require('../TextArea/Root.js');
 require('../Toggle.js');
 require('../Tooltip.js');
+require('react-spring-carousel');
 
 const MostUsedList = ({ mostUsed }) => {
   return /* @__PURE__ */ React.createElement(React.Fragment, null, (mostUsed ?? []).map((item, index$1) => {

package/dist/cjs/components/Select/Content.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var clsx = require('clsx');
 var React = require('react');
 require('@internationalized/date');
 require('react-aria');
@@ -9,14 +10,14 @@ require('currency.js');
 var useOutsideClickListener = require('../../hooks/useOutsideClickListener.js');
 var Context = require('../Popover/Context.js');
 
-const Content = ({ children }) => {
+const Content = ({ children, className }) => {
   const { setIsOpen } = Context.usePopoverContext();
   const ref = React.useRef(null);
   useOutsideClickListener.useOutsideClickListener({
     ref,
     onClickOutside: () => setIsOpen(false)
   });
-  return /* @__PURE__ */ React.createElement("div", { className: "w-full relative", ref }, children);
+  return /* @__PURE__ */ React.createElement("div", { className: clsx("w-full relative", className), ref }, children);
 };
 
 exports.Content = Content;

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

@@ -9,9 +9,10 @@ const SelectRoot = ({
   children,
   value,
   keyExtractor,
-  labelExtractor
+  labelExtractor,
+  className
 }) => {
-  return /* @__PURE__ */ React.createElement(index.Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React.createElement(context.SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React.createElement(Content.Content, null, children)));
+  return /* @__PURE__ */ React.createElement(index.Popover.Root, { placement: "bottom", trigger: "click" }, /* @__PURE__ */ React.createElement(context.SelectContext.Provider, { value: { value, keyExtractor, labelExtractor } }, /* @__PURE__ */ React.createElement(Content.Content, { className }, children)));
 };
 
 exports.SelectRoot = SelectRoot;

package/dist/cjs/index.js

@@ -37,6 +37,7 @@ var Toggle = require('./components/Toggle.js');
 var Tooltip = require('./components/Tooltip.js');
 var Kanban = require('./components/Kanban.js');
 var Loading = require('./components/Loading.js');
+var Carousel = require('./components/Carousel/Carousel.js');
 var useCalendar = require('./hooks/useCalendar.js');
 var useCalendarCell = require('./hooks/useCalendarCell.js');
 var useCalendarGrid = require('./hooks/useCalendarGrid.js');
@@ -58,6 +59,7 @@ var masks = require('./components/Input/masks.js');
 
 
 exports.Accordion = Accordion.Accordion;
+exports.useAccordionContext = Accordion.useAccordionContext;
 exports.Avatar = Avatar.Avatar;
 exports.Badge = Badge.Badge;
 exports.BadgeAnchor = Badge.BadgeAnchor;
@@ -102,6 +104,7 @@ exports.Toggle = Toggle.Toggle;
 exports.Tooltip = Tooltip.Tooltip;
 exports.Kanban = Kanban.Kanban;
 exports.Loading = Loading.Loading;
+exports.Carousel = Carousel.Carousel;
 exports.useCalendar = useCalendar.useCalendar;
 exports.useCalendarCell = useCalendarCell.useCalendarCell;
 exports.useCalendarGrid = useCalendarGrid.useCalendarGrid;

package/dist/cjs/service/SnackbarSonner.js

@@ -59,6 +59,8 @@ require('../components/TextArea/Right.js');
 require('../components/TextArea/Root.js');
 require('../components/Toggle.js');
 require('../components/Tooltip.js');
+require('react-spring-carousel');
+require('react-icons/io');
 
 class SnackbarSonner {
   custom(Component, options) {

package/dist/esm/components/Accordion.js

@@ -1,5 +1,5 @@
 import clsx from 'clsx';
-import React__default, { createContext, useRef, useState, useLayoutEffect, useCallback, useContext } from 'react';
+import React__default, { createContext, useContext, useRef, useState, useLayoutEffect, useCallback } from 'react';
 import { LiaAngleRightSolid } from 'react-icons/lia';
 
 const Context = createContext({ open: false });
@@ -16,7 +16,8 @@ const Trigger = ({
   /**
    * Only applied to trigger arrow
    */
-  className
+  className,
+  onOpen
 }) => {
   const { open, toggle } = useAccordionContext();
   if (!floating && !label) {
@@ -24,6 +25,12 @@ const Trigger = ({
       "A label must be specified if the trigger is not floating variant"
     );
   }
+  const action = () => {
+    if (!open) {
+      onOpen?.();
+    }
+    toggle?.();
+  };
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
@@ -31,7 +38,7 @@ const Trigger = ({
         "flex flex-col justify-between align-center px-mili border-r border-secondary-light cursor-pointer",
         { "mr-deca": floating }
       ),
-      onClick: toggle
+      onClick: action
     },
     /* @__PURE__ */ React__default.createElement(
       "div",
@@ -91,8 +98,14 @@ const Face = ({
   const toggle = useCallback(() => setOpen((prev) => !prev), []);
   return /* @__PURE__ */ React__default.createElement(Context.Provider, { value: { open, toggle } }, /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-row" }, children));
 };
-const Root = ({ children, defaultOpen, label, floating }) => {
-  return /* @__PURE__ */ React__default.createElement(Face, { defaultOpen }, /* @__PURE__ */ React__default.createElement(Trigger, { label, floating }), /* @__PURE__ */ React__default.createElement(Content, null, children));
+const Root = ({
+  children,
+  defaultOpen,
+  label,
+  floating,
+  onOpen
+}) => {
+  return /* @__PURE__ */ React__default.createElement(Face, { defaultOpen }, /* @__PURE__ */ React__default.createElement(Trigger, { label, floating, onOpen }), /* @__PURE__ */ React__default.createElement(Content, null, children));
 };
 const Accordion = {
   Face,
@@ -101,4 +114,4 @@ const Accordion = {
   Content
 };
 
-export { Accordion };
+export { Accordion, useAccordionContext };

package/dist/esm/components/Carousel/Carousel.js

@@ -0,0 +1,41 @@
+import React__default from 'react';
+import { Button } from '../Button.js';
+import { useSpringCarousel } from 'react-spring-carousel';
+import { IoIosArrowBack, IoIosArrowForward } from 'react-icons/io';
+import { CarouselItem } from './CarouselItem.js';
+
+const Carousel = ({ images }) => {
+  const itemsCarousel = images.map((imageProp, i) => ({
+    id: `${imageProp.alt}-${i}`,
+    renderItem: /* @__PURE__ */ React__default.createElement(CarouselItem, { item: imageProp })
+  }));
+  const { carouselFragment, slideToNextItem, slideToPrevItem } = useSpringCarousel({
+    withLoop: true,
+    items: itemsCarousel
+  });
+  return /* @__PURE__ */ React__default.createElement("div", { className: "overflow-hidden w-fit relative" }, itemsCarousel.length > 1 ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+    Button,
+    {
+      "data-testid": "button-carousel-prev",
+      variants: {
+        size: "square",
+        className: "z-absolute absolute left-deca top-[50%]  transform -translate-y-[50%] p-centi"
+      },
+      onClick: slideToPrevItem
+    },
+    /* @__PURE__ */ React__default.createElement(IoIosArrowBack, null)
+  ), /* @__PURE__ */ React__default.createElement(
+    Button,
+    {
+      "data-testid": "button-carousel-next",
+      variants: {
+        size: "square",
+        className: "z-absolute absolute right-deca top-[50%] transform -translate-y-[50%] p-centi"
+      },
+      onClick: slideToNextItem
+    },
+    /* @__PURE__ */ React__default.createElement(IoIosArrowForward, null)
+  )) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null), carouselFragment);
+};
+
+export { Carousel };

package/dist/esm/components/Carousel/CarouselItem.js

@@ -0,0 +1,48 @@
+import React__default from 'react';
+import clsx from 'clsx';
+import { Button } from '../Button.js';
+
+const CarouselItem = ({ item }) => {
+  const stylesTitle = {
+    color: item.title.color ?? "black",
+    fontSize: item.title?.size ?? "1rem"
+  };
+  const stylesSubTitle = {
+    color: item.subtitle.color ?? "white",
+    fontSize: item.subtitle?.size ?? "1rem"
+  };
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+    "img",
+    {
+      className: "w-full h-[360px] object-fill rounded-mili",
+      src: item.src,
+      alt: item.alt
+    }
+  ), /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      className: "z-absolute absolute top-[50%] transform -translate-y-[50%] left-[10%] max-w-[60%]"
+    },
+    /* @__PURE__ */ React__default.createElement("p", { className: clsx("text-h2 font-bold"), style: stylesTitle }, item.title.text),
+    /* @__PURE__ */ React__default.createElement("p", { className: "text-white text-h2 font-bold", style: stylesSubTitle }, item.subtitle.text)
+  ), item.button ? /* @__PURE__ */ React__default.createElement(
+    "a",
+    {
+      href: item.button.link,
+      target: item.button.target ?? "_self",
+      rel: "noopener noreferrer"
+    },
+    /* @__PURE__ */ React__default.createElement(
+      Button,
+      {
+        "data-testid": "button-link-carousel",
+        variants: {
+          className: "z-absolute absolute bottom-deca left-[10%]"
+        }
+      },
+      item.button.title
+    )
+  ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
+};
+
+export { CarouselItem };

package/dist/esm/components/Menubar/MostUsedList.js

@@ -46,6 +46,7 @@ import '../TextArea/Right.js';
 import '../TextArea/Root.js';
 import '../Toggle.js';
 import '../Tooltip.js';
+import 'react-spring-carousel';
 
 const MostUsedList = ({ mostUsed }) => {
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, (mostUsed ?? []).map((item, index) => {

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

@@ -1,3 +1,4 @@
+import clsx from 'clsx';
 import React__default, { useRef } from 'react';
 import '@internationalized/date';
 import 'react-aria';
@@ -7,14 +8,14 @@ import 'currency.js';
 import { useOutsideClickListener } from '../../hooks/useOutsideClickListener.js';
 import { usePopoverContext } from '../Popover/Context.js';
 
-const Content = ({ children }) => {
+const Content = ({ children, className }) => {
   const { setIsOpen } = usePopoverContext();
   const ref = useRef(null);
   useOutsideClickListener({
     ref,
     onClickOutside: () => setIsOpen(false)
   });
-  return /* @__PURE__ */ React__default.createElement("div", { className: "w-full relative", ref }, children);
+  return /* @__PURE__ */ React__default.createElement("div", { className: clsx("w-full relative", className), ref }, children);
 };
 
 export { Content };

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

@@ -7,9 +7,10 @@ const SelectRoot = ({
   children,
   value,
   keyExtractor,
-  labelExtractor
+  labelExtractor,
+  className
 }) => {
-  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)));
+  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, { className }, children)));
 };
 
 export { SelectRoot };

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-export { Accordion } from './components/Accordion.js';
+export { Accordion, useAccordionContext } from './components/Accordion.js';
 export { Avatar } from './components/Avatar.js';
 export { Badge, BadgeAnchor } from './components/Badge.js';
 export { BreadcrumbItem } from './components/Breadcrumbs/BreadcrumbItem.js';
@@ -35,6 +35,7 @@ export { Toggle } from './components/Toggle.js';
 export { Tooltip } from './components/Tooltip.js';
 export { Kanban } from './components/Kanban.js';
 export { Loading } from './components/Loading.js';
+export { Carousel } from './components/Carousel/Carousel.js';
 export { useCalendar } from './hooks/useCalendar.js';
 export { useCalendarCell } from './hooks/useCalendarCell.js';
 export { useCalendarGrid } from './hooks/useCalendarGrid.js';

package/dist/esm/service/SnackbarSonner.js

@@ -57,6 +57,8 @@ import '../components/TextArea/Right.js';
 import '../components/TextArea/Root.js';
 import '../components/Toggle.js';
 import '../components/Tooltip.js';
+import 'react-spring-carousel';
+import 'react-icons/io';
 
 class SnackbarSonner {
   custom(Component, options) {

package/dist/types/components/Accordion.d.ts

@@ -4,11 +4,16 @@ interface AccordionProps {
     defaultOpen?: boolean;
     label?: string;
     floating?: boolean;
+    onOpen?: () => void;
 }
+export declare const useAccordionContext: () => {
+    open: boolean;
+    toggle?: (() => void) | undefined;
+};
 export declare const Accordion: {
     Face: ({ children, defaultOpen, }: Pick<AccordionProps, 'children' | 'defaultOpen'>) => JSX.Element;
-    Root: ({ children, defaultOpen, label, floating }: AccordionProps) => JSX.Element;
-    Trigger: ({ label, floating, className, }: Pick<AccordionProps, 'floating' | 'label'> & {
+    Root: ({ children, defaultOpen, label, floating, onOpen, }: AccordionProps) => JSX.Element;
+    Trigger: ({ label, floating, className, onOpen, }: Pick<AccordionProps, 'floating' | 'label' | 'onOpen'> & {
         className?: string;
     }) => JSX.Element;
     Content: ({ children }: Pick<AccordionProps, 'children'>) => JSX.Element;

package/dist/types/components/Calendar/Calendar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface CalendarProps {
     value?: Date;
     onChange: (value: Date) => void;

package/dist/types/components/Calendar/CalendarCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CalendarDate } from '@internationalized/date';
 import { CalendarState, RangeCalendarState } from 'react-stately';
 interface CalendarCellProps {

package/dist/types/components/Calendar/CalendarGrid.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CalendarState, RangeCalendarState } from 'react-stately';
 interface CalendarGridProps {
     state: CalendarState | RangeCalendarState;

package/dist/types/components/Calendar/CalendarGridBodyRows.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CalendarState, RangeCalendarState } from 'react-stately';
 interface CalendarGridBodyRowsProps {
     state: CalendarState | RangeCalendarState;

package/dist/types/components/Calendar/CalendarGridHeaderRow.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface CalendarGridHeaderRowProps {
     weekDays: string[];
 }

package/dist/types/components/Calendar/CalendarHeader.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface CalendarHeaderProps {
     onClickPrevButton: () => void;
     onClickNextButton: () => void;

package/dist/types/components/Calendar/RangeCalendar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type DateRange = {
     start: Date;
     end: Date;

package/dist/types/components/Carousel/Carousel.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+type TextCarousel = {
+    text: string;
+    color: string;
+    size?: string;
+};
+type ButtonCarousel = {
+    title?: string;
+    link?: string;
+    target?: '_blank' | '_self';
+};
+export type ImageCarousel = {
+    src: string;
+    alt: string;
+    title: TextCarousel;
+    subtitle: TextCarousel;
+    button?: ButtonCarousel;
+};
+export interface CarouselProps {
+    images: ImageCarousel[];
+}
+export declare const Carousel: ({ images }: CarouselProps) => JSX.Element;
+export {};

package/dist/types/components/Carousel/CarouselItem.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { ImageCarousel } from './Carousel';
+export interface CarouselItemProps {
+    item: ImageCarousel;
+}
+export declare const CarouselItem: ({ item }: CarouselItemProps) => JSX.Element;

package/dist/types/components/Carousel/index.d.ts

@@ -0,0 +1 @@
+export * from './Carousel';

package/dist/types/components/DatePicker/DateField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { AriaDateFieldProps, DateValue } from 'react-aria';
 interface DateFieldProps extends AriaDateFieldProps<DateValue> {
 }

package/dist/types/components/DatePicker/DatePickerInput.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputPropsBase } from '../Input';
 export interface DatePickerInputProps extends InputPropsBase {
     value?: Date;

package/dist/types/components/DatePicker/DateRangePickerInput.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DateRange } from '../Calendar/RangeCalendar';
 import { InputPropsBase } from '../Input';
 export interface DateRangePickerInputProps extends InputPropsBase {

package/dist/types/components/DatePicker/DateSegment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DateFieldState, DateSegment as DateSegmentType } from 'react-stately';
 interface DateSegmentProps {
     segment: DateSegmentType;

package/dist/types/components/Input/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Input: {
     Root: import("react").ForwardRefExoticComponent<import("./types").InputProps & import("react").RefAttributes<HTMLInputElement>>;
     Face: import("react").ForwardRefExoticComponent<import("./types").InputFaceProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/Input/types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputBaseVariants } from '@tecsinapse/cortex-core';
 import { CurrencyOptions } from '../../hooks';
 export interface InputPropsBase {

package/dist/types/components/Loading.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface LoadingProps {
     className?: string;
 }

package/dist/types/components/Menubar/Categories.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DefaultProps } from './interface';
 declare const Categories: ({ children }: DefaultProps) => JSX.Element;
 export default Categories;

package/dist/types/components/Menubar/Dropdown.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DefaultProps } from './interface';
 declare const Dropdown: ({ children, ...rest }: DefaultProps) => JSX.Element;
 export default Dropdown;

package/dist/types/components/Menubar/DropdownRoot.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { MostUsedItemProps } from './MostUsedItem';
 import { DefaultProps } from './interface';
 interface MenuItem extends DefaultProps {

package/dist/types/components/Menubar/Left.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DefaultProps } from './interface';
 declare const Left: ({ children, ...rest }: DefaultProps) => JSX.Element;
 export default Left;

package/dist/types/components/Menubar/MostUsedItem.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CardProps } from '../Card';
 export interface MostUsedItemProps extends CardProps {
     title: string;

package/dist/types/components/Menubar/MostUsedList.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DropdownRootProps } from './DropdownRoot';
 declare const MostUsedList: ({ mostUsed }: Pick<DropdownRootProps, 'mostUsed'>) => JSX.Element;
 export default MostUsedList;

package/dist/types/components/Menubar/Right.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DefaultProps } from './interface';
 declare const Right: ({ children, ...rest }: DefaultProps) => JSX.Element;
 export default Right;

package/dist/types/components/Menubar/Search.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputSearchProps } from '../Input';
 declare const Search: (props: InputSearchProps) => JSX.Element;
 export default Search;

package/dist/types/components/Menubar/SubItem.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DefaultProps } from './interface';
 export interface SubItemProps extends DefaultProps {
     href?: string;

package/dist/types/components/Menubar/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Menubar: {
     Root: ({ children, ...rest }: import("./Root").RootProps) => JSX.Element;
     Header: ({ children, className, ...rest }: import("./Header").HeaderProps) => JSX.Element;

package/dist/types/components/Popover/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const Popover: {
     Root: ({ children, placement, trigger, }: import("./Root").PopoverRootProps) => JSX.Element;
     Trigger: ({ children }: import("./Trigger").PopoverTriggerProps) => import("react").FunctionComponentElement<any>;

package/dist/types/components/ProgressBar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface ProgressBarProps {
     segments?: number;
     valueMin?: number;

package/dist/types/components/Select/Content.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { ContentProps } from './types';
-export declare const Content: ({ children }: ContentProps) => JSX.Element;
+export declare const Content: ({ children, className }: ContentProps) => JSX.Element;

package/dist/types/components/Select/GroupedOptions.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectGroupedOptionsProps } from './types';
 export declare const SelectGroupedOptions: <T>({ onSelect, groupedLabelExtractor, options, }: SelectGroupedOptionsProps<T>) => JSX.Element;

package/dist/types/components/Select/MultiCheckAllOptions.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectMultiCheckAllOptionsProps } from './types';
 export declare const SelectMultiCheckAllOptions: <T>({ checkAllLabel, }: SelectMultiCheckAllOptionsProps) => JSX.Element;

package/dist/types/components/Select/MultiGroupedOptions.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectMultiGroupedOptionsProps } from './types';
 export declare const SelectMultiGroupedOptions: <T>({ onSelect, groupedLabelExtractor, options, children, }: SelectMultiGroupedOptionsProps<T>) => JSX.Element;

package/dist/types/components/Select/MultiOption.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectMultiOptionProps } from './types';
 export declare const SelectMultiOption: <T>({ onSelectOption, option, grouped, }: SelectMultiOptionProps<T>) => JSX.Element;

package/dist/types/components/Select/MultiOptions.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectMultiOptionsProps } from './types';
 export declare const SelectMultiOptions: <T>({ onSelect, options, children, }: SelectMultiOptionsProps<T>) => JSX.Element;

package/dist/types/components/Select/Option.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectOptionProps } from './types';
 export declare const SelectOption: <T>({ onSelectOption, option, grouped, }: SelectOptionProps<T>) => JSX.Element;

package/dist/types/components/Select/Options.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectOptionsProps } from './types';
 export declare const SelectOptions: <T>({ onSelect, options, }: SelectOptionsProps<T>) => JSX.Element;

package/dist/types/components/Select/Popover.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectPopoverProps } from './types';
 export declare const SelectPopover: ({ children }: SelectPopoverProps) => JSX.Element;

package/dist/types/components/Select/Root.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectRootProps } from './types';
-export declare const SelectRoot: <T>({ children, value, keyExtractor, labelExtractor, }: SelectRootProps<T>) => JSX.Element;
+export declare const SelectRoot: <T>({ children, value, keyExtractor, labelExtractor, className, }: SelectRootProps<T>) => JSX.Element;

package/dist/types/components/Select/SkeletonOptions.d.ts

@@ -1 +1,2 @@
+/// <reference types="react" />
 export declare const SkeletonOptions: () => JSX.Element;

package/dist/types/components/Select/Trigger.d.ts

@@ -1,2 +1,3 @@
+/// <reference types="react" />
 import { SelectTriggerProps } from './types';
 export declare const SelectTrigger: ({ label, placeholder, disabled, multiLabelSelected, }: SelectTriggerProps) => JSX.Element;

package/dist/types/components/Select/context.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface SelectContextProps<T> {
     value?: T | T[];
     keyExtractor: (value: T) => string;

package/dist/types/components/Select/index.d.ts

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 export declare const Select: {
-    Root: <T>({ children, value, keyExtractor, labelExtractor, }: import("./types").SelectRootProps<T>) => JSX.Element;
+    Root: <T>({ children, value, keyExtractor, labelExtractor, className, }: import("./types").SelectRootProps<T>) => JSX.Element;
     Trigger: ({ label, placeholder, disabled, multiLabelSelected, }: import("./types").SelectTriggerProps) => JSX.Element;
     Popover: ({ children }: import("./types").SelectPopoverProps) => JSX.Element;
     Options: <T_1>({ onSelect, options, }: import("./types").SelectOptionsProps<T_1>) => JSX.Element;

package/dist/types/components/Select/types.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
 export interface ContentProps {
     children: ReactNode;
+    className?: string;
 }
 export interface SelectGroupedOptionsProps<T> {
     onSelect: (value: T) => void;
@@ -43,6 +44,7 @@ export interface SelectRootProps<T> {
     value?: T | T[];
     keyExtractor: (value: T) => string;
     labelExtractor: (value: T) => string;
+    className?: string;
 }
 export interface SelectTriggerProps {
     label: string;

package/dist/types/components/Snackbar/DefaultSnack.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { SnackbarVariants } from '@tecsinapse/cortex-core';
 export declare const DefaultSnack: ({ text, onDismiss, variants, }: {
     text: string;

package/dist/types/components/TextArea/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const TextArea: {
     Root: import("react").ForwardRefExoticComponent<import("./types").TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
     Face: import("react").ForwardRefExoticComponent<import("./types").TextAreaFaceProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/TextArea/types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputBaseVariants } from '@tecsinapse/cortex-core';
 export type DivBaseProps = React.HTMLAttributes<HTMLDivElement>;
 export interface TextAreaElementsProps extends DivBaseProps {

package/dist/types/components/TimeField/TimeField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { TimeValueType } from './TimeFieldInput';
 export interface TimeFieldProps {
     value?: TimeValueType;

package/dist/types/components/TimeField/TimeFieldInput.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputPropsBase } from '../Input';
 export type TimeValueType = {
     hour: number;

package/dist/types/components/index.d.ts

@@ -27,3 +27,4 @@ export * from './Toggle';
 export * from './Tooltip';
 export * from './Kanban';
 export * from './Loading';
+export * from './Carousel';

package/dist/types/hooks/useCalendarCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { CalendarDate } from '@internationalized/date';
 import { CalendarState, RangeCalendarState } from 'react-stately';
 interface useCalendarCellProps {

package/dist/types/hooks/useDatePickerInput.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface useDatePickerInputProps {
     value?: Date;
     onChange: (date: Date) => void;

package/dist/types/hooks/useDateRangePickerInput.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DateRange } from '../components';
 interface useDateRangePickerInputProps {
     value?: DateRange;

package/dist/types/hooks/useRangeCalendar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DateRange } from '../components';
 interface useRangeCalendarProps {
     value?: DateRange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.4.1",
+  "version": "1.4.3",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -25,6 +25,8 @@
     "react-aria": "^3.33.1",
     "react-icons": "^5.2.1",
     "react-imask": "7.6.1",
+    "react-spring": "^9.7.4",
+    "react-spring-carousel": "^2.0.19",
     "react-stately": "^3.31.1",
     "sonner": "^1.5.0",
     "tailwind-merge": "*"
@@ -43,5 +45,5 @@
     "react-dom": ">=18.0.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "eef1f226df240fd877f74e279cca9ad99bdfcf12"
+  "gitHead": "1c59961e461601bb062e4637de0633dec64db329"
 }