@tecsinapse/cortex-react 1.9.1 → 1.9.2-beta.0

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

@@ -0,0 +1,49 @@
+'use strict';
+
+var clsx = require('clsx');
+var React = require('react');
+var context = require('./context.js');
+
+const AccordionContent = ({
+  children,
+  direction = "horizontal"
+}) => {
+  const container = React.useRef(null);
+  const [width, setWidth] = React.useState(void 0);
+  const [height, setHeight] = React.useState(void 0);
+  const { open } = context.useAccordionContext();
+  React.useLayoutEffect(() => {
+    if (direction === "horizontal") {
+      const widthSize = Array.from(
+        container.current?.children || []
+      ).reduce((prev, curr) => prev + curr.clientWidth, 0);
+      setWidth(`${widthSize}px`);
+    } else {
+      const heightSize = Array.from(
+        container.current?.children || []
+      ).reduce((prev, curr) => prev + curr.clientHeight, 0);
+      setHeight(`${heightSize}px`);
+    }
+  }, [direction]);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: clsx(
+        `overflow-hidden ease-in-out duration-200`,
+        { "transition-[width]": direction === "horizontal" },
+        { "w-0": direction === "horizontal" && !open },
+        { "transition-[height]": direction === "vertical" },
+        { "h-0": direction === "vertical" && !open }
+      ),
+      style: {
+        width: direction === "horizontal" && open ? width : void 0,
+        height: direction === "vertical" && open ? height : void 0
+      },
+      ref: container,
+      "data-testid": "accordion-container"
+    },
+    children
+  );
+};
+
+exports.AccordionContent = AccordionContent;

package/dist/cjs/components/Accordion/Face.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var clsx = require('clsx');
+var React = require('react');
+var context = require('./context.js');
+
+const AccordionFace = ({
+  children,
+  defaultOpen = false,
+  direction = "horizontal"
+}) => {
+  const [open, setOpen] = React.useState(defaultOpen);
+  const toggle = React.useCallback(() => setOpen((prev) => !prev), []);
+  return /* @__PURE__ */ React.createElement(context.Context.Provider, { value: { open, toggle } }, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: clsx("flex", {
+        "flex flex-col": direction === "vertical"
+      })
+    },
+    children
+  ));
+};
+
+exports.AccordionFace = AccordionFace;

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

@@ -0,0 +1,31 @@
+'use strict';
+
+var React = require('react');
+var Content = require('./Content.js');
+var Face = require('./Face.js');
+var Trigger = require('./Trigger.js');
+
+const AccordionRoot = ({
+  children,
+  defaultOpen,
+  label,
+  floating,
+  onOpen,
+  invertedArrow,
+  onClose,
+  direction = "horizontal"
+}) => {
+  return /* @__PURE__ */ React.createElement(Face.AccordionFace, { defaultOpen, direction }, /* @__PURE__ */ React.createElement(
+    Trigger.AccordionTrigger,
+    {
+      label,
+      floating,
+      onOpen,
+      onClose,
+      invertedArrow,
+      direction
+    }
+  ), /* @__PURE__ */ React.createElement(Content.AccordionContent, { direction }, children));
+};
+
+exports.AccordionRoot = AccordionRoot;

package/dist/cjs/components/Accordion/Trigger.js

@@ -0,0 +1,94 @@
+'use strict';
+
+var clsx = require('clsx');
+var React = require('react');
+var lia = require('react-icons/lia');
+var context = require('./context.js');
+
+const AccordionTrigger = ({
+  label,
+  floating = false,
+  /**
+   * Only applied to trigger arrow
+   */
+  className,
+  onOpen,
+  onClose,
+  invertedArrow = false,
+  direction = "horizontal"
+}) => {
+  const { open, toggle } = context.useAccordionContext();
+  if (!floating && !label) {
+    throw new Error(
+      "A label must be specified if the trigger is not floating variant"
+    );
+  }
+  const action = () => {
+    if (!open) {
+      onOpen?.();
+    } else {
+      onClose?.();
+    }
+    toggle?.();
+  };
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: clsx(
+        "flex justify-between align-center border-secondary-light cursor-pointer",
+        { "mr-deca": floating && direction === "horizontal" },
+        { "mb-deca": floating && direction === "vertical" },
+        { "border-r flex-col px-mili": direction === "horizontal" },
+        { "border-b py-mili": direction === "vertical" }
+      ),
+      onClick: action
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: clsx(
+          "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
+          {
+            "absolute -translate-x-micro translate-y-deca bg-white": floating && direction === "horizontal"
+          },
+          {
+            "absolute -translate-y-micro translate-x-deca bg-white": floating && direction === "vertical"
+          },
+          className
+        )
+      },
+      direction === "horizontal" ? /* @__PURE__ */ React.createElement(
+        lia.LiaAngleRightSolid,
+        {
+          className: clsx(
+            "text-secondary-medium transition-transform duration-200",
+            {
+              "rotate-180": invertedArrow ? !open : open
+            }
+          )
+        }
+      ) : /* @__PURE__ */ React.createElement(
+        lia.LiaAngleDownSolid,
+        {
+          className: clsx(
+            "text-secondary-medium transition-transform duration-200",
+            {
+              "rotate-180": invertedArrow ? !open : open
+            }
+          )
+        }
+      )
+    ),
+    !floating ? /* @__PURE__ */ React.createElement(
+      "span",
+      {
+        className: clsx({
+          "-rotate-180 [writing-mode:vertical-lr]": direction === "horizontal"
+        })
+      },
+      label
+    ) : null
+  );
+};
+
+exports.AccordionTrigger = AccordionTrigger;

package/dist/cjs/components/Accordion/context.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var React = require('react');
+
+const Context = React.createContext({ open: false });
+const useAccordionContext = () => {
+  const context = React.useContext(Context);
+  if (!context) {
+    throw new Error("useAccordionContext must be used within a Accordion");
+  }
+  return context;
+};
+
+exports.Context = Context;
+exports.useAccordionContext = useAccordionContext;

package/dist/cjs/components/Accordion/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var Content = require('./Content.js');
+var Face = require('./Face.js');
+var Root = require('./Root.js');
+var Trigger = require('./Trigger.js');
+
+const Accordion = {
+  Root: Root.AccordionRoot,
+  Face: Face.AccordionFace,
+  Content: Content.AccordionContent,
+  Trigger: Trigger.AccordionTrigger
+};
+
+exports.Accordion = Accordion;

package/dist/cjs/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Accordion = require('./components/Accordion.js');
+var index = require('./components/Accordion/index.js');
 var Avatar = require('./components/Avatar.js');
 var Badge = require('./components/Badge.js');
 var BreadcrumbItem = require('./components/Breadcrumbs/BreadcrumbItem.js');
@@ -20,27 +20,27 @@ var Divider = require('./components/Divider.js');
 var Drawer = require('./components/Drawer.js');
 var GroupButton = require('./components/GroupButton.js');
 var Hint = require('./components/Hint.js');
-var index = require('./components/Input/index.js');
+var index$1 = require('./components/Input/index.js');
 var Kanban = require('./components/Kanban.js');
 var Loading = require('./components/Loading.js');
-var index$1 = require('./components/Menubar/index.js');
+var index$2 = require('./components/Menubar/index.js');
 var Modal = require('./components/Modal.js');
-var index$2 = require('./components/Popover/index.js');
+var index$3 = require('./components/Popover/index.js');
 var ProgressBar = require('./components/ProgressBar/ProgressBar.js');
 var RadioButton = require('./components/RadioButton.js');
-var index$3 = require('./components/Select/index.js');
+var index$4 = require('./components/Select/index.js');
 var Skeleton = require('./components/Skeleton.js');
 var BaseSnackbar = require('./components/Snackbar/BaseSnackbar.js');
 var DefaultSnack = require('./components/Snackbar/DefaultSnack.js');
+var index$5 = require('./components/Stepper/index.js');
 var Table = require('./components/Table.js');
 var Tag = require('./components/Tag.js');
-var index$4 = require('./components/TextArea/index.js');
+var index$6 = require('./components/TextArea/index.js');
 var TimeField = require('./components/TimeField/TimeField.js');
 var TimeFieldInput = require('./components/TimeField/TimeFieldInput.js');
 var Toggle = require('./components/Toggle.js');
 var Tooltip = require('./components/Tooltip.js');
-var index$5 = require('./components/Uploader/index.js');
-var index$6 = require('./components/Stepper/index.js');
+var index$7 = require('./components/Uploader/index.js');
 var useCalendar = require('./hooks/useCalendar.js');
 var useCalendarCell = require('./hooks/useCalendarCell.js');
 var useCalendarGrid = require('./hooks/useCalendarGrid.js');
@@ -67,8 +67,7 @@ var types = require('./components/Uploader/types.js');
 
 
 
-exports.Accordion = Accordion.Accordion;
-exports.useAccordionContext = Accordion.useAccordionContext;
+exports.Accordion = index.Accordion;
 exports.Avatar = Avatar.Avatar;
 exports.Badge = Badge.Badge;
 exports.BadgeAnchor = Badge.BadgeAnchor;
@@ -89,18 +88,19 @@ exports.Divider = Divider.Divider;
 exports.Drawer = Drawer.Drawer;
 exports.GroupButton = GroupButton.GroupButton;
 exports.Hint = Hint.Hint;
-exports.Input = index.Input;
+exports.Input = index$1.Input;
 exports.Kanban = Kanban.Kanban;
 exports.Loading = Loading.Loading;
-exports.Menubar = index$1.Menubar;
+exports.Menubar = index$2.Menubar;
 exports.Modal = Modal.Modal;
-exports.Popover = index$2.Popover;
+exports.Popover = index$3.Popover;
 exports.ProgressBar = ProgressBar.ProgressBar;
 exports.RadioButton = RadioButton.RadioButton;
-exports.Select = index$3.Select;
+exports.Select = index$4.Select;
 exports.Skeleton = Skeleton.Skeleton;
 exports.BaseSnackbar = BaseSnackbar.BaseSnackbar;
 exports.DefaultSnack = DefaultSnack.DefaultSnack;
+exports.Stepper = index$5.Stepper;
 exports.TCell = Table.TCell;
 exports.TFoot = Table.TFoot;
 exports.THead = Table.THead;
@@ -110,13 +110,12 @@ exports.TRowHeader = Table.TRowHeader;
 exports.Table = Table.Table;
 exports.Td = Table.Td;
 exports.Tag = Tag.Tag;
-exports.TextArea = index$4.TextArea;
+exports.TextArea = index$6.TextArea;
 exports.TimeField = TimeField.TimeField;
 exports.TimeFieldInput = TimeFieldInput.TimeFieldInput;
 exports.Toggle = Toggle.Toggle;
 exports.Tooltip = Tooltip.Tooltip;
-exports.Uploader = index$5.Uploader;
-exports.Stepper = index$6.Stepper;
+exports.Uploader = index$7.Uploader;
 exports.useCalendar = useCalendar.useCalendar;
 exports.useCalendarCell = useCalendarCell.useCalendarCell;
 exports.useCalendarGrid = useCalendarGrid.useCalendarGrid;

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

@@ -0,0 +1,47 @@
+import clsx from 'clsx';
+import React__default, { useRef, useState, useLayoutEffect } from 'react';
+import { useAccordionContext } from './context.js';
+
+const AccordionContent = ({
+  children,
+  direction = "horizontal"
+}) => {
+  const container = useRef(null);
+  const [width, setWidth] = useState(void 0);
+  const [height, setHeight] = useState(void 0);
+  const { open } = useAccordionContext();
+  useLayoutEffect(() => {
+    if (direction === "horizontal") {
+      const widthSize = Array.from(
+        container.current?.children || []
+      ).reduce((prev, curr) => prev + curr.clientWidth, 0);
+      setWidth(`${widthSize}px`);
+    } else {
+      const heightSize = Array.from(
+        container.current?.children || []
+      ).reduce((prev, curr) => prev + curr.clientHeight, 0);
+      setHeight(`${heightSize}px`);
+    }
+  }, [direction]);
+  return /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      className: clsx(
+        `overflow-hidden ease-in-out duration-200`,
+        { "transition-[width]": direction === "horizontal" },
+        { "w-0": direction === "horizontal" && !open },
+        { "transition-[height]": direction === "vertical" },
+        { "h-0": direction === "vertical" && !open }
+      ),
+      style: {
+        width: direction === "horizontal" && open ? width : void 0,
+        height: direction === "vertical" && open ? height : void 0
+      },
+      ref: container,
+      "data-testid": "accordion-container"
+    },
+    children
+  );
+};
+
+export { AccordionContent };

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

@@ -0,0 +1,23 @@
+import clsx from 'clsx';
+import React__default, { useState, useCallback } from 'react';
+import { Context } from './context.js';
+
+const AccordionFace = ({
+  children,
+  defaultOpen = false,
+  direction = "horizontal"
+}) => {
+  const [open, setOpen] = useState(defaultOpen);
+  const toggle = useCallback(() => setOpen((prev) => !prev), []);
+  return /* @__PURE__ */ React__default.createElement(Context.Provider, { value: { open, toggle } }, /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      className: clsx("flex", {
+        "flex flex-col": direction === "vertical"
+      })
+    },
+    children
+  ));
+};
+
+export { AccordionFace };

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

@@ -0,0 +1,29 @@
+import React__default from 'react';
+import { AccordionContent } from './Content.js';
+import { AccordionFace } from './Face.js';
+import { AccordionTrigger } from './Trigger.js';
+
+const AccordionRoot = ({
+  children,
+  defaultOpen,
+  label,
+  floating,
+  onOpen,
+  invertedArrow,
+  onClose,
+  direction = "horizontal"
+}) => {
+  return /* @__PURE__ */ React__default.createElement(AccordionFace, { defaultOpen, direction }, /* @__PURE__ */ React__default.createElement(
+    AccordionTrigger,
+    {
+      label,
+      floating,
+      onOpen,
+      onClose,
+      invertedArrow,
+      direction
+    }
+  ), /* @__PURE__ */ React__default.createElement(AccordionContent, { direction }, children));
+};
+
+export { AccordionRoot };

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

@@ -0,0 +1,92 @@
+import clsx from 'clsx';
+import React__default from 'react';
+import { LiaAngleRightSolid, LiaAngleDownSolid } from 'react-icons/lia';
+import { useAccordionContext } from './context.js';
+
+const AccordionTrigger = ({
+  label,
+  floating = false,
+  /**
+   * Only applied to trigger arrow
+   */
+  className,
+  onOpen,
+  onClose,
+  invertedArrow = false,
+  direction = "horizontal"
+}) => {
+  const { open, toggle } = useAccordionContext();
+  if (!floating && !label) {
+    throw new Error(
+      "A label must be specified if the trigger is not floating variant"
+    );
+  }
+  const action = () => {
+    if (!open) {
+      onOpen?.();
+    } else {
+      onClose?.();
+    }
+    toggle?.();
+  };
+  return /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      className: clsx(
+        "flex justify-between align-center border-secondary-light cursor-pointer",
+        { "mr-deca": floating && direction === "horizontal" },
+        { "mb-deca": floating && direction === "vertical" },
+        { "border-r flex-col px-mili": direction === "horizontal" },
+        { "border-b py-mili": direction === "vertical" }
+      ),
+      onClick: action
+    },
+    /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        className: clsx(
+          "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
+          {
+            "absolute -translate-x-micro translate-y-deca bg-white": floating && direction === "horizontal"
+          },
+          {
+            "absolute -translate-y-micro translate-x-deca bg-white": floating && direction === "vertical"
+          },
+          className
+        )
+      },
+      direction === "horizontal" ? /* @__PURE__ */ React__default.createElement(
+        LiaAngleRightSolid,
+        {
+          className: clsx(
+            "text-secondary-medium transition-transform duration-200",
+            {
+              "rotate-180": invertedArrow ? !open : open
+            }
+          )
+        }
+      ) : /* @__PURE__ */ React__default.createElement(
+        LiaAngleDownSolid,
+        {
+          className: clsx(
+            "text-secondary-medium transition-transform duration-200",
+            {
+              "rotate-180": invertedArrow ? !open : open
+            }
+          )
+        }
+      )
+    ),
+    !floating ? /* @__PURE__ */ React__default.createElement(
+      "span",
+      {
+        className: clsx({
+          "-rotate-180 [writing-mode:vertical-lr]": direction === "horizontal"
+        })
+      },
+      label
+    ) : null
+  );
+};
+
+export { AccordionTrigger };

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

@@ -0,0 +1,12 @@
+import { createContext, useContext } from 'react';
+
+const Context = createContext({ open: false });
+const useAccordionContext = () => {
+  const context = useContext(Context);
+  if (!context) {
+    throw new Error("useAccordionContext must be used within a Accordion");
+  }
+  return context;
+};
+
+export { Context, useAccordionContext };

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

@@ -0,0 +1,13 @@
+import { AccordionContent } from './Content.js';
+import { AccordionFace } from './Face.js';
+import { AccordionRoot } from './Root.js';
+import { AccordionTrigger } from './Trigger.js';
+
+const Accordion = {
+  Root: AccordionRoot,
+  Face: AccordionFace,
+  Content: AccordionContent,
+  Trigger: AccordionTrigger
+};
+
+export { Accordion };

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-export { Accordion, useAccordionContext } from './components/Accordion.js';
+export { Accordion } from './components/Accordion/index.js';
 export { Avatar } from './components/Avatar.js';
 export { Badge, BadgeAnchor } from './components/Badge.js';
 export { BreadcrumbItem } from './components/Breadcrumbs/BreadcrumbItem.js';
@@ -30,6 +30,7 @@ export { Select } from './components/Select/index.js';
 export { Skeleton } from './components/Skeleton.js';
 export { BaseSnackbar } from './components/Snackbar/BaseSnackbar.js';
 export { DefaultSnack } from './components/Snackbar/DefaultSnack.js';
+export { Stepper } from './components/Stepper/index.js';
 export { TCell, TFoot, THead, THeadCell, TRow, TRowHeader, Table, Td } from './components/Table.js';
 export { Tag } from './components/Tag.js';
 export { TextArea } from './components/TextArea/index.js';
@@ -38,7 +39,6 @@ export { TimeFieldInput } from './components/TimeField/TimeFieldInput.js';
 export { Toggle } from './components/Toggle.js';
 export { Tooltip } from './components/Tooltip.js';
 export { Uploader } from './components/Uploader/index.js';
-export { Stepper } from './components/Stepper/index.js';
 export { useCalendar } from './hooks/useCalendar.js';
 export { useCalendarCell } from './hooks/useCalendarCell.js';
 export { useCalendarGrid } from './hooks/useCalendarGrid.js';

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

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { AccordionProps } from './types';
+export declare const AccordionContent: ({ children, direction, }: Pick<AccordionProps, 'children' | 'direction'>) => JSX.Element;

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

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { AccordionProps } from './types';
+export declare const AccordionFace: ({ children, defaultOpen, direction, }: Pick<AccordionProps, 'children' | 'defaultOpen' | 'direction'>) => JSX.Element;

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

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { AccordionProps } from './types';
+export declare const AccordionRoot: ({ children, defaultOpen, label, floating, onOpen, invertedArrow, onClose, direction, }: AccordionProps) => JSX.Element;

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

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { AccordionProps } from './types';
+export declare const AccordionTrigger: ({ label, floating, className, onOpen, onClose, invertedArrow, direction, }: Pick<AccordionProps, 'floating' | 'label' | 'onOpen' | 'onClose' | 'invertedArrow' | 'direction'> & {
+    className?: string;
+}) => JSX.Element;

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+export declare const Context: import("react").Context<{
+    open: boolean;
+    toggle?: (() => void) | undefined;
+}>;
+export declare const useAccordionContext: () => {
+    open: boolean;
+    toggle?: (() => void) | undefined;
+};

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+export declare const Accordion: {
+    Root: ({ children, defaultOpen, label, floating, onOpen, invertedArrow, onClose, direction, }: import("./types").AccordionProps) => JSX.Element;
+    Face: ({ children, defaultOpen, direction, }: Pick<import("./types").AccordionProps, "children" | "direction" | "defaultOpen">) => JSX.Element;
+    Content: ({ children, direction, }: Pick<import("./types").AccordionProps, "children" | "direction">) => JSX.Element;
+    Trigger: ({ label, floating, className, onOpen, onClose, invertedArrow, direction, }: Pick<import("./types").AccordionProps, "direction" | "label" | "floating" | "onOpen" | "onClose" | "invertedArrow"> & {
+        className?: string | undefined;
+    }) => JSX.Element;
+};

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

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export interface AccordionProps {
+    children?: React.ReactNode;
+    defaultOpen?: boolean;
+    label?: string;
+    floating?: boolean;
+    onOpen?: () => void;
+    onClose?: () => void;
+    invertedArrow?: boolean;
+    direction?: 'vertical' | 'horizontal';
+}

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes, ReactNode } from 'react';
+import { ButtonHTMLAttributes, ReactNode } from 'react';
 export interface ContentProps {
     children: ReactNode;
     className?: string;
@@ -46,7 +46,7 @@ export interface SelectRootProps<T> {
     labelExtractor: (value: T) => string;
     className?: string;
 }
-export interface SelectTriggerProps extends HTMLAttributes<HTMLButtonElement> {
+export interface SelectTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     label: string;
     placeholder?: string;
     disabled?: boolean;

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

@@ -23,6 +23,7 @@ export * from './RadioButton';
 export * from './Select';
 export * from './Skeleton';
 export * from './Snackbar';
+export * from './Stepper';
 export * from './Table';
 export * from './Tag';
 export * from './TextArea';
@@ -30,4 +31,3 @@ export * from './TimeField';
 export * from './Toggle';
 export * from './Tooltip';
 export * from './Uploader';
-export * from './Stepper';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.9.1",
+  "version": "1.9.2-beta.0",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -48,5 +48,5 @@
     "react-dom": ">=18.0.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "f21eebeb8aa606118824628a559b77982e9c913b"
+  "gitHead": "22e2d4050a9481ca3839b62a99e78f36f38803db"
 }

package/dist/cjs/components/Accordion.js

@@ -1,135 +0,0 @@
-'use strict';
-
-var clsx = require('clsx');
-var React = require('react');
-var lia = require('react-icons/lia');
-
-const Context = React.createContext({ open: false });
-const useAccordionContext = () => {
-  const context = React.useContext(Context);
-  if (!context) {
-    throw new Error("useAccordionContext must be used within a Accordion");
-  }
-  return context;
-};
-const Trigger = ({
-  label,
-  floating = false,
-  /**
-   * Only applied to trigger arrow
-   */
-  className,
-  onOpen,
-  onClose,
-  invertedArrow = false
-}) => {
-  const { open, toggle } = useAccordionContext();
-  if (!floating && !label) {
-    throw new Error(
-      "A label must be specified if the trigger is not floating variant"
-    );
-  }
-  const action = () => {
-    if (!open) {
-      onOpen?.();
-    } else {
-      onClose?.();
-    }
-    toggle?.();
-  };
-  return /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: clsx(
-        "flex flex-col justify-between align-center px-mili border-r border-secondary-light cursor-pointer",
-        { "mr-deca": floating }
-      ),
-      onClick: action
-    },
-    /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        className: clsx(
-          "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
-          {
-            "absolute -translate-x-micro translate-y-deca bg-white": floating
-          },
-          className
-        )
-      },
-      /* @__PURE__ */ React.createElement(
-        lia.LiaAngleRightSolid,
-        {
-          className: clsx(
-            "text-secondary-medium transition-transform duration-200",
-            {
-              "rotate-180": invertedArrow ? !open : open
-            }
-          )
-        }
-      )
-    ),
-    !floating ? /* @__PURE__ */ React.createElement("span", { className: "-rotate-180 [writing-mode:vertical-lr]" }, label) : null
-  );
-};
-const Content = ({ children }) => {
-  const container = React.useRef(null);
-  const [width, setWidth] = React.useState(null);
-  const { open } = useAccordionContext();
-  React.useLayoutEffect(() => {
-    const size = Array.from(
-      container.current?.children || []
-    ).reduce((prev, curr) => prev + curr.clientWidth, 0);
-    setWidth(`${size}px`);
-  }, []);
-  return /* @__PURE__ */ React.createElement(
-    "div",
-    {
-      className: clsx(
-        `overflow-hidden transition-[width] ease-in-out duration-200`,
-        { [`w-[${width}]`]: !!width && open },
-        { "w-0": !open }
-      ),
-      ref: container,
-      "data-testid": "accordion-container"
-    },
-    children
-  );
-};
-const Face = ({
-  children,
-  defaultOpen = false
-}) => {
-  const [open, setOpen] = React.useState(defaultOpen);
-  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,
-  onOpen,
-  invertedArrow,
-  onClose
-}) => {
-  return /* @__PURE__ */ React.createElement(Face, { defaultOpen }, /* @__PURE__ */ React.createElement(
-    Trigger,
-    {
-      label,
-      floating,
-      onOpen,
-      onClose,
-      invertedArrow
-    }
-  ), /* @__PURE__ */ React.createElement(Content, null, children));
-};
-const Accordion = {
-  Face,
-  Root,
-  Trigger,
-  Content
-};
-
-exports.Accordion = Accordion;
-exports.useAccordionContext = useAccordionContext;

package/dist/esm/components/Accordion.js

@@ -1,132 +0,0 @@
-import clsx from 'clsx';
-import React__default, { createContext, useContext, useRef, useState, useLayoutEffect, useCallback } from 'react';
-import { LiaAngleRightSolid } from 'react-icons/lia';
-
-const Context = createContext({ open: false });
-const useAccordionContext = () => {
-  const context = useContext(Context);
-  if (!context) {
-    throw new Error("useAccordionContext must be used within a Accordion");
-  }
-  return context;
-};
-const Trigger = ({
-  label,
-  floating = false,
-  /**
-   * Only applied to trigger arrow
-   */
-  className,
-  onOpen,
-  onClose,
-  invertedArrow = false
-}) => {
-  const { open, toggle } = useAccordionContext();
-  if (!floating && !label) {
-    throw new Error(
-      "A label must be specified if the trigger is not floating variant"
-    );
-  }
-  const action = () => {
-    if (!open) {
-      onOpen?.();
-    } else {
-      onClose?.();
-    }
-    toggle?.();
-  };
-  return /* @__PURE__ */ React__default.createElement(
-    "div",
-    {
-      className: clsx(
-        "flex flex-col justify-between align-center px-mili border-r border-secondary-light cursor-pointer",
-        { "mr-deca": floating }
-      ),
-      onClick: action
-    },
-    /* @__PURE__ */ React__default.createElement(
-      "div",
-      {
-        className: clsx(
-          "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
-          {
-            "absolute -translate-x-micro translate-y-deca bg-white": floating
-          },
-          className
-        )
-      },
-      /* @__PURE__ */ React__default.createElement(
-        LiaAngleRightSolid,
-        {
-          className: clsx(
-            "text-secondary-medium transition-transform duration-200",
-            {
-              "rotate-180": invertedArrow ? !open : open
-            }
-          )
-        }
-      )
-    ),
-    !floating ? /* @__PURE__ */ React__default.createElement("span", { className: "-rotate-180 [writing-mode:vertical-lr]" }, label) : null
-  );
-};
-const Content = ({ children }) => {
-  const container = useRef(null);
-  const [width, setWidth] = useState(null);
-  const { open } = useAccordionContext();
-  useLayoutEffect(() => {
-    const size = Array.from(
-      container.current?.children || []
-    ).reduce((prev, curr) => prev + curr.clientWidth, 0);
-    setWidth(`${size}px`);
-  }, []);
-  return /* @__PURE__ */ React__default.createElement(
-    "div",
-    {
-      className: clsx(
-        `overflow-hidden transition-[width] ease-in-out duration-200`,
-        { [`w-[${width}]`]: !!width && open },
-        { "w-0": !open }
-      ),
-      ref: container,
-      "data-testid": "accordion-container"
-    },
-    children
-  );
-};
-const Face = ({
-  children,
-  defaultOpen = false
-}) => {
-  const [open, setOpen] = useState(defaultOpen);
-  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,
-  onOpen,
-  invertedArrow,
-  onClose
-}) => {
-  return /* @__PURE__ */ React__default.createElement(Face, { defaultOpen }, /* @__PURE__ */ React__default.createElement(
-    Trigger,
-    {
-      label,
-      floating,
-      onOpen,
-      onClose,
-      invertedArrow
-    }
-  ), /* @__PURE__ */ React__default.createElement(Content, null, children));
-};
-const Accordion = {
-  Face,
-  Root,
-  Trigger,
-  Content
-};
-
-export { Accordion, useAccordionContext };

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

@@ -1,23 +0,0 @@
-import React from 'react';
-interface AccordionProps {
-    children?: React.ReactNode;
-    defaultOpen?: boolean;
-    label?: string;
-    floating?: boolean;
-    onOpen?: () => void;
-    onClose?: () => void;
-    invertedArrow?: boolean;
-}
-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, onOpen, invertedArrow, onClose, }: AccordionProps) => JSX.Element;
-    Trigger: ({ label, floating, className, onOpen, onClose, invertedArrow, }: Pick<AccordionProps, 'floating' | 'label' | 'onOpen' | 'onClose' | 'invertedArrow'> & {
-        className?: string;
-    }) => JSX.Element;
-    Content: ({ children }: Pick<AccordionProps, 'children'>) => JSX.Element;
-};
-export {};