@apia/components 1.0.4 → 2.0.0

package/dist/components/Toolbar/ToolbarTextButton.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { ISimpleButton } from '../forms/buttons/SimpleButton.js';
+import '../forms/DateInput.js';
+import '../forms/NumberInput.js';
+
+declare const ToolbarTextButton: (props: ISimpleButton) => React.JSX.Element;
+
+export { ToolbarTextButton };
+//# sourceMappingURL=ToolbarTextButton.d.ts.map

package/dist/components/Toolbar/ToolbarTextButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarTextButton.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Toolbar/ToolbarTextButton.js

@@ -0,0 +1,18 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { getVariant } from '@apia/theme';
+import { SimpleButton } from '../forms/buttons/SimpleButton.js';
+
+const ToolbarTextButton = (props) => {
+  return /* @__PURE__ */ jsx(
+    SimpleButton,
+    {
+      ...props,
+      className: `toolbar__textButton ${props?.className ?? ""}`,
+      ...props.variant ? getVariant(props.variant) : null,
+      children: props.children
+    }
+  );
+};
+
+export { ToolbarTextButton };
+//# sourceMappingURL=ToolbarTextButton.js.map

package/dist/components/Toolbar/ToolbarTextButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolbarTextButton.js","sources":["../../../src/components/Toolbar/ToolbarTextButton.tsx"],"sourcesContent":["import { getVariant } from '@apia/theme';\nimport { ISimpleButton, SimpleButton } from '../forms';\n\nexport const ToolbarTextButton = (props: ISimpleButton) => {\n  return (\n    <SimpleButton\n      {...props}\n      className={`toolbar__textButton ${props?.className ?? ''}`}\n      {...(props.variant ? getVariant(props.variant) : null)}\n    >\n      {props.children}\n    </SimpleButton>\n  );\n};\n"],"names":[],"mappings":";;;;AAGa,MAAA,iBAAA,GAAoB,CAAC,KAAyB,KAAA;AACzD,EACE,uBAAA,GAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,SAAW,EAAA,CAAA,oBAAA,EAAuB,KAAO,EAAA,SAAA,IAAa,EAAE,CAAA,CAAA;AAAA,MACvD,GAAI,KAAM,CAAA,OAAA,GAAU,UAAW,CAAA,KAAA,CAAM,OAAO,CAAI,GAAA,IAAA;AAAA,MAEhD,QAAM,EAAA,KAAA,CAAA,QAAA;AAAA,KAAA;AAAA,GACT,CAAA;AAEJ;;;;"}

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

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+import { ToolbarController } from './ToolbarController.js';
+import '../forms/DateInput.js';
+import '../forms/NumberInput.js';
+
+declare const Toolbar: ({ children, getController, }: {
+    children: ReactNode;
+    /**
+     * El controlador permite gestionar el estado de los distintos elementos de
+     * la toolbar
+     */
+    getController?: ((newController: ToolbarController) => unknown) | undefined;
+}) => React.JSX.Element;
+
+export { Toolbar, ToolbarController };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toolbar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Toolbar/index.js

@@ -0,0 +1,26 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { useMount } from '@apia/util';
+import { Box, getVariant } from '@apia/theme';
+import { useMemo } from 'react';
+import { ToolbarController } from './ToolbarController.js';
+
+const Toolbar = ({
+  children,
+  getController
+}) => {
+  const controller = useMemo(() => new ToolbarController(), []);
+  useMount(() => {
+    getController?.(controller);
+  });
+  return /* @__PURE__ */ jsx(controller.Context, { children: /* @__PURE__ */ jsx(
+    Box,
+    {
+      className: "toolbar",
+      ...getVariant("layout.common.components.toolbar"),
+      children
+    }
+  ) });
+};
+
+export { Toolbar, ToolbarController };
+//# sourceMappingURL=index.js.map

package/dist/components/Toolbar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/Toolbar/index.tsx"],"sourcesContent":["import { useMount } from '@apia/util';\nimport { TToolbarIconButton } from './types';\nimport { Box, getVariant } from '@apia/theme';\nimport { ReactNode, useMemo } from 'react';\nimport { ToolbarController } from './ToolbarController';\nimport { ToolbarTextButton } from './ToolbarTextButton';\nimport { ToolbarIconButton } from './ToolbarIconButton';\nimport { ToolbarInput } from './ToolbarInput';\nimport { ToolbarSeparator } from './ToolbarSeparator';\nimport { ToolbarSelect } from './ToolbarSelect';\n\nconst Toolbar = ({\n  children,\n  getController,\n}: {\n  children: ReactNode;\n  /**\n   * El controlador permite gestionar el estado de los distintos elementos de\n   * la toolbar\n   */\n  getController?: (newController: ToolbarController) => unknown;\n}) => {\n  const controller = useMemo(() => new ToolbarController(), []);\n\n  useMount(() => {\n    getController?.(controller);\n  });\n\n  return (\n    <controller.Context>\n      <Box\n        className=\"toolbar\"\n        {...getVariant('layout.common.components.toolbar')}\n      >\n        {children}\n      </Box>\n    </controller.Context>\n  );\n};\n\nexport type { TToolbarIconButton as TToolDefinition };\nexport {\n  ToolbarIconButton,\n  ToolbarInput,\n  ToolbarTextButton,\n  Toolbar,\n  ToolbarController,\n  ToolbarSeparator,\n  ToolbarSelect,\n};\n"],"names":[],"mappings":";;;;;;AAWA,MAAM,UAAU,CAAC;AAAA,EACf,QAAA;AAAA,EACA,aAAA;AACF,CAOM,KAAA;AACJ,EAAA,MAAM,aAAa,OAAQ,CAAA,MAAM,IAAI,iBAAkB,EAAA,EAAG,EAAE,CAAA,CAAA;AAE5D,EAAA,QAAA,CAAS,MAAM;AACb,IAAA,aAAA,GAAgB,UAAU,CAAA,CAAA;AAAA,GAC3B,CAAA,CAAA;AAED,EACE,uBAAA,GAAA,CAAC,UAAW,CAAA,OAAA,EAAX,EACC,QAAA,kBAAA,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,SAAA;AAAA,MACT,GAAG,WAAW,kCAAkC,CAAA;AAAA,MAEhD,QAAA;AAAA,KAAA;AAAA,GAEL,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/Toolbar/styles.js

@@ -0,0 +1,84 @@
+const styles = {
+  alignItems: "center",
+  backgroundColor: "palette.background.default",
+  display: "flex",
+  gap: "2px",
+  py: "4px",
+  px: "8px",
+  "& > *": {
+    alignItems: "center",
+    borderRadius: "4px",
+    display: "flex",
+    flexShrink: 0,
+    justifyContent: "center",
+    outline: "none !important",
+    p: 0
+  },
+  ".toolbar__textButton": (theme) => ({
+    variant: "buttons.primary-sm",
+    background: "transparent",
+    border: "none",
+    color: "palette.text.primary",
+    ...theme.palette.getStatesFromDefinition(
+      {
+        backgroundColor: theme.palette.background.default
+      },
+      { states: { default: false } }
+    ),
+    "&.primary": theme.palette.getStatesFromPath("buttons.primary")
+  }),
+  ".toolbar__select": () => ({
+    padding: "4px",
+    paddingLeft: "8px",
+    paddingRight: "32px"
+  }),
+  ".toolbar__button": {
+    border: "none",
+    borderRadius: "4px",
+    height: "32px",
+    width: "32px",
+    background: "transparent",
+    svg: {
+      path: {
+        fill: "palette.text.primary"
+      }
+    },
+    "&:disabled": {
+      svg: {
+        path: {
+          fill: "palette.border.section"
+        }
+      }
+    }
+  },
+  ".fieldLabel": {
+    display: "flex",
+    flexDirection: "row",
+    gap: 3,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  ".toolbar__input": {
+    borderRadius: "4px",
+    p: 3,
+    width: "80px"
+  },
+  ".toolbar__separator": {
+    borderLeft: "1px solid",
+    borderRight: "1px solid",
+    borderColor: "palette.gray.750",
+    height: "60%",
+    width: "3px"
+  },
+  ".toggled": (theme) => {
+    return {
+      ...theme.palette.getOneState(
+        { backgroundColor: theme.palette.background.default },
+        "selected"
+      )
+    };
+  }
+};
+
+export { styles };
+//# sourceMappingURL=styles.js.map

package/dist/components/Toolbar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../src/components/Toolbar/styles.ts"],"sourcesContent":["import { ThemeUICSSObject } from '@apia/theme';\n\nexport const styles: ThemeUICSSObject = {\n  alignItems: 'center',\n  backgroundColor: 'palette.background.default',\n  display: 'flex',\n  gap: '2px',\n  py: '4px',\n  px: '8px',\n\n  '& > *': {\n    alignItems: 'center',\n    borderRadius: '4px',\n    display: 'flex',\n    flexShrink: 0,\n    justifyContent: 'center',\n    outline: 'none !important',\n    p: 0,\n  },\n\n  '.toolbar__textButton': (theme) => ({\n    variant: 'buttons.primary-sm',\n    background: 'transparent',\n    border: 'none',\n    color: 'palette.text.primary',\n\n    ...theme.palette.getStatesFromDefinition(\n      {\n        backgroundColor: theme.palette.background.default,\n      },\n      { states: { default: false } },\n    ),\n\n    '&.primary': theme.palette.getStatesFromPath('buttons.primary'),\n  }),\n\n  '.toolbar__select': () => ({\n    padding: '4px',\n    paddingLeft: '8px',\n    paddingRight: '32px',\n  }),\n\n  '.toolbar__button': {\n    border: 'none',\n    borderRadius: '4px',\n    height: '32px',\n    width: '32px',\n    background: 'transparent',\n    svg: {\n      path: {\n        fill: 'palette.text.primary',\n      },\n    },\n\n    '&:disabled': {\n      svg: {\n        path: {\n          fill: 'palette.border.section',\n        },\n      },\n    },\n  },\n\n  '.fieldLabel': {\n    display: 'flex',\n    flexDirection: 'row',\n    gap: 3,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n\n  '.toolbar__input': {\n    borderRadius: '4px',\n    p: 3,\n    width: '80px',\n  },\n\n  '.toolbar__separator': {\n    borderLeft: '1px solid',\n    borderRight: '1px solid',\n    borderColor: 'palette.gray.750',\n    height: '60%',\n    width: '3px',\n  },\n\n  '.toggled': (theme) => {\n    return {\n      ...theme.palette.getOneState(\n        { backgroundColor: theme.palette.background.default },\n        'selected',\n      ),\n    };\n  },\n};\n"],"names":[],"mappings":"AAEO,MAAM,MAA2B,GAAA;AAAA,EACtC,UAAY,EAAA,QAAA;AAAA,EACZ,eAAiB,EAAA,4BAAA;AAAA,EACjB,OAAS,EAAA,MAAA;AAAA,EACT,GAAK,EAAA,KAAA;AAAA,EACL,EAAI,EAAA,KAAA;AAAA,EACJ,EAAI,EAAA,KAAA;AAAA,EAEJ,OAAS,EAAA;AAAA,IACP,UAAY,EAAA,QAAA;AAAA,IACZ,YAAc,EAAA,KAAA;AAAA,IACd,OAAS,EAAA,MAAA;AAAA,IACT,UAAY,EAAA,CAAA;AAAA,IACZ,cAAgB,EAAA,QAAA;AAAA,IAChB,OAAS,EAAA,iBAAA;AAAA,IACT,CAAG,EAAA,CAAA;AAAA,GACL;AAAA,EAEA,sBAAA,EAAwB,CAAC,KAAW,MAAA;AAAA,IAClC,OAAS,EAAA,oBAAA;AAAA,IACT,UAAY,EAAA,aAAA;AAAA,IACZ,MAAQ,EAAA,MAAA;AAAA,IACR,KAAO,EAAA,sBAAA;AAAA,IAEP,GAAG,MAAM,OAAQ,CAAA,uBAAA;AAAA,MACf;AAAA,QACE,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,UAAW,CAAA,OAAA;AAAA,OAC5C;AAAA,MACA,EAAE,MAAA,EAAQ,EAAE,OAAA,EAAS,OAAQ,EAAA;AAAA,KAC/B;AAAA,IAEA,WAAa,EAAA,KAAA,CAAM,OAAQ,CAAA,iBAAA,CAAkB,iBAAiB,CAAA;AAAA,GAChE,CAAA;AAAA,EAEA,oBAAoB,OAAO;AAAA,IACzB,OAAS,EAAA,KAAA;AAAA,IACT,WAAa,EAAA,KAAA;AAAA,IACb,YAAc,EAAA,MAAA;AAAA,GAChB,CAAA;AAAA,EAEA,kBAAoB,EAAA;AAAA,IAClB,MAAQ,EAAA,MAAA;AAAA,IACR,YAAc,EAAA,KAAA;AAAA,IACd,MAAQ,EAAA,MAAA;AAAA,IACR,KAAO,EAAA,MAAA;AAAA,IACP,UAAY,EAAA,aAAA;AAAA,IACZ,GAAK,EAAA;AAAA,MACH,IAAM,EAAA;AAAA,QACJ,IAAM,EAAA,sBAAA;AAAA,OACR;AAAA,KACF;AAAA,IAEA,YAAc,EAAA;AAAA,MACZ,GAAK,EAAA;AAAA,QACH,IAAM,EAAA;AAAA,UACJ,IAAM,EAAA,wBAAA;AAAA,SACR;AAAA,OACF;AAAA,KACF;AAAA,GACF;AAAA,EAEA,aAAe,EAAA;AAAA,IACb,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA,KAAA;AAAA,IACf,GAAK,EAAA,CAAA;AAAA,IACL,UAAY,EAAA,QAAA;AAAA,IACZ,cAAgB,EAAA,QAAA;AAAA,GAClB;AAAA,EAEA,iBAAmB,EAAA;AAAA,IACjB,YAAc,EAAA,KAAA;AAAA,IACd,CAAG,EAAA,CAAA;AAAA,IACH,KAAO,EAAA,MAAA;AAAA,GACT;AAAA,EAEA,qBAAuB,EAAA;AAAA,IACrB,UAAY,EAAA,WAAA;AAAA,IACZ,WAAa,EAAA,WAAA;AAAA,IACb,WAAa,EAAA,kBAAA;AAAA,IACb,MAAQ,EAAA,KAAA;AAAA,IACR,KAAO,EAAA,KAAA;AAAA,GACT;AAAA,EAEA,UAAA,EAAY,CAAC,KAAU,KAAA;AACrB,IAAO,OAAA;AAAA,MACL,GAAG,MAAM,OAAQ,CAAA,WAAA;AAAA,QACf,EAAE,eAAA,EAAiB,KAAM,CAAA,OAAA,CAAQ,WAAW,OAAQ,EAAA;AAAA,QACpD,UAAA;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AACF;;;;"}

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

@@ -0,0 +1,40 @@
+import { TIconType, TIconName } from '@apia/icons';
+import { ToolbarController } from './ToolbarController.js';
+import { InputProps } from '@apia/theme';
+
+type TToolEventState = {
+    isLoading: boolean;
+    isToggled: boolean;
+};
+type TToolbarIconButton = {
+    action: (props: TToolEventState, controller: ToolbarController) => unknown;
+    actionSource?: 'click' | 'mousedown';
+    /**
+     * Si se pasa allowToggle y no se pasa toggled ( ni en true ni en false ),
+     * entonces el estado de toggle será controlado internamente en el toolbar
+     */
+    allowToggle?: boolean;
+    /**
+     * Si se desea usar defaultToggled, debería pasarse también allowToggle
+     */
+    defaultToggled?: boolean;
+    disabled?: boolean;
+    icon: TIconType | TIconName;
+    iconSize?: 'Xs' | 'Sm' | 'Md' | 'Lg' | 'Xl' | undefined;
+    id: string;
+    isLoading?: boolean;
+    title: string;
+    /**
+     * Siempre que se pase toggled, no importa si en true o en false, el
+     * usuario del toolbar deberá mantener la lógica de persistencia del
+     * toggle
+     */
+    toggled?: boolean;
+};
+type TToolInput = {
+    inputProps?: InputProps;
+    label?: string;
+};
+
+export type { TToolEventState, TToolInput, TToolbarIconButton };
+//# sourceMappingURL=types.d.ts.map

package/dist/components/Toolbar/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

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

@@ -0,0 +1,20 @@
+import { ReactNode, FC } from 'react';
+import { AccordionHandler } from './handler.js';
+
+interface IAccordionProps {
+    /**
+     * Tiempo en ms que dura la animación. Por defecto se usa 150.
+     */
+    animationDuration?: number;
+    children?: ReactNode;
+    className?: string;
+    getHandler?: (handler: AccordionHandler) => unknown;
+    /**
+     * Por defecto usa la variante layout.common.components.accordion.primary
+     */
+    variant?: string;
+}
+declare const Accordion: FC<IAccordionProps>;
+
+export { Accordion, type IAccordionProps };
+//# sourceMappingURL=Accordion.d.ts.map

package/dist/components/accordion/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/accordion/Accordion.js

@@ -0,0 +1,60 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { useMemo, useState, useRef, useEffect } from 'react';
+import { AccordionHandler } from './handler.js';
+import { KeyHandler } from './KeyHandler.js';
+import { shallowEqual } from '@apia/store';
+import { uniqueId } from '../ListBox/common.js';
+
+const Accordion = ({
+  animationDuration = 150,
+  children,
+  className,
+  getHandler,
+  variant = "layout.common.components.accordion.primary"
+}) => {
+  const id = useMemo(() => uniqueId(), []);
+  const [handler] = useState(() => {
+    return new AccordionHandler(id, {
+      animationDuration,
+      children,
+      getHandler,
+      variant
+    });
+  });
+  const propsRef = useRef({
+    animationDuration,
+    children,
+    getHandler,
+    variant
+  });
+  if (!shallowEqual(
+    {
+      animationDuration,
+      children,
+      getHandler,
+      variant
+    },
+    propsRef.current
+  )) {
+    propsRef.current = {
+      animationDuration,
+      children,
+      getHandler,
+      variant
+    };
+    handler.updateProps({
+      animationDuration,
+      children,
+      getHandler,
+      variant
+    });
+  }
+  const Provider = handler.hooks.useAccordionContextProvider();
+  useEffect(() => {
+    getHandler?.(handler);
+  }, [getHandler, handler]);
+  return /* @__PURE__ */ jsx(Provider, { children: /* @__PURE__ */ jsx(KeyHandler, { className: `accordion ${className ?? ""}`, children }) });
+};
+
+export { Accordion };
+//# sourceMappingURL=Accordion.js.map

package/dist/components/accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.js","sources":["../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import { useRef, FC, ReactNode, useEffect, useState, useMemo } from 'react';\nimport { AccordionHandler } from './handler';\nimport { KeyHandler } from './KeyHandler';\nimport { shallowEqual } from '@apia/store';\nimport { uniqueId } from '../ListBox/common';\n\nexport interface IAccordionProps {\n  /**\n   * Tiempo en ms que dura la animación. Por defecto se usa 150.\n   */\n  animationDuration?: number;\n  children?: ReactNode;\n  className?: string;\n  getHandler?: (handler: AccordionHandler) => unknown;\n  /**\n   * Por defecto usa la variante layout.common.components.accordion.primary\n   */\n  variant?: string;\n}\n\nexport const Accordion: FC<IAccordionProps> = ({\n  animationDuration = 150,\n  children,\n  className,\n  getHandler,\n  variant = 'layout.common.components.accordion.primary',\n}) => {\n  const id = useMemo(() => uniqueId(), []);\n\n  const [handler] = useState(() => {\n    return new AccordionHandler(id, {\n      animationDuration,\n      children,\n      getHandler,\n      variant,\n    });\n  });\n  const propsRef = useRef({\n    animationDuration,\n    children,\n    getHandler,\n    variant,\n  });\n  if (\n    !shallowEqual(\n      {\n        animationDuration,\n        children,\n        getHandler,\n        variant,\n      },\n      propsRef.current,\n    )\n  ) {\n    propsRef.current = {\n      animationDuration,\n      children,\n      getHandler,\n      variant,\n    };\n    handler.updateProps({\n      animationDuration,\n      children,\n      getHandler,\n      variant,\n    });\n  }\n\n  const Provider = handler.hooks.useAccordionContextProvider();\n\n  useEffect(() => {\n    getHandler?.(handler);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [getHandler, handler]);\n\n  return (\n    <Provider>\n      <KeyHandler className={`accordion ${className ?? ''}`}>\n        {children}\n      </KeyHandler>\n    </Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAoBO,MAAM,YAAiC,CAAC;AAAA,EAC7C,iBAAoB,GAAA,GAAA;AAAA,EACpB,QAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,OAAU,GAAA,4CAAA;AACZ,CAAM,KAAA;AACJ,EAAA,MAAM,KAAK,OAAQ,CAAA,MAAM,QAAS,EAAA,EAAG,EAAE,CAAA,CAAA;AAEvC,EAAA,MAAM,CAAC,OAAO,CAAI,GAAA,QAAA,CAAS,MAAM;AAC/B,IAAO,OAAA,IAAI,iBAAiB,EAAI,EAAA;AAAA,MAC9B,iBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAAA,GACF,CAAA,CAAA;AACD,EAAA,MAAM,WAAW,MAAO,CAAA;AAAA,IACtB,iBAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,OAAA;AAAA,GACD,CAAA,CAAA;AACD,EAAA,IACE,CAAC,YAAA;AAAA,IACC;AAAA,MACE,iBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,KACF;AAAA,IACA,QAAS,CAAA,OAAA;AAAA,GAEX,EAAA;AACA,IAAA,QAAA,CAAS,OAAU,GAAA;AAAA,MACjB,iBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,KACF,CAAA;AACA,IAAA,OAAA,CAAQ,WAAY,CAAA;AAAA,MAClB,iBAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,KACD,CAAA,CAAA;AAAA,GACH;AAEA,EAAM,MAAA,QAAA,GAAW,OAAQ,CAAA,KAAA,CAAM,2BAA4B,EAAA,CAAA;AAE3D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,GAAa,OAAO,CAAA,CAAA;AAAA,GAEnB,EAAA,CAAC,UAAY,EAAA,OAAO,CAAC,CAAA,CAAA;AAExB,EACE,uBAAA,GAAA,CAAC,QACC,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,SAAA,EAAW,aAAa,SAAa,IAAA,EAAE,CAChD,CAAA,EAAA,QAAA,EACH,CACF,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/accordion/AccordionItem.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+import { TId } from '@apia/util';
+import { IAccordionItemButton } from './defaultElements/DefaultAccordionItemButton.js';
+
+interface IAccordionItemProps {
+    /**
+     * Cada elemento del acordeón tiene dos formas de renderizar el botón. O bien
+     * se pasa un elemento AccordionItemButton como hijo o bien se pasan
+     * buttonProps. En caso contrario, el elemento no tendrá botón.
+     */
+    buttonProps?: IAccordionItemButton;
+    children?: ReactNode;
+    id: TId;
+}
+declare const AccordionItem: ({ children, id, ...props }: IAccordionItemProps) => React.JSX.Element;
+
+export { AccordionItem, type IAccordionItemProps };
+//# sourceMappingURL=AccordionItem.d.ts.map

package/dist/components/accordion/AccordionItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/accordion/AccordionItem.js

@@ -0,0 +1,22 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { useRef } from 'react';
+import { AccordionItemContent } from './AccordionItemContent.js';
+import { useAccordionContext } from './context.js';
+
+const AccordionItem = ({
+  children,
+  id,
+  ...props
+}) => {
+  const context = useAccordionContext();
+  const Provider = context.hooks.useItemContextProvider(id);
+  const hasRegistered = useRef(false);
+  if (!hasRegistered.current) {
+    hasRegistered.current = true;
+    context.registerItem(id, { isChecked: false, isExpanded: false });
+  }
+  return /* @__PURE__ */ jsx(Provider, { children: /* @__PURE__ */ jsx(AccordionItemContent, { id, ...props, children }) });
+};
+
+export { AccordionItem };
+//# sourceMappingURL=AccordionItem.js.map

package/dist/components/accordion/AccordionItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.js","sources":["../../../src/components/accordion/AccordionItem.tsx"],"sourcesContent":["import { ReactNode, useRef } from 'react';\nimport { AccordionItemContent } from './AccordionItemContent';\nimport { useAccordionContext } from './context';\nimport { TId } from '@apia/util';\nimport { IAccordionItemButton } from './defaultElements/DefaultAccordionItemButton';\n\nexport interface IAccordionItemProps {\n  /**\n   * Cada elemento del acordeón tiene dos formas de renderizar el botón. O bien\n   * se pasa un elemento AccordionItemButton como hijo o bien se pasan\n   * buttonProps. En caso contrario, el elemento no tendrá botón.\n   */\n  buttonProps?: IAccordionItemButton;\n  children?: ReactNode;\n  id: TId;\n}\n\nexport const AccordionItem = ({\n  children,\n  id,\n  ...props\n}: IAccordionItemProps) => {\n  const context = useAccordionContext();\n  const Provider = context.hooks.useItemContextProvider(id);\n  const hasRegistered = useRef(false);\n\n  if (!hasRegistered.current) {\n    hasRegistered.current = true;\n    context.registerItem(id, { isChecked: false, isExpanded: false });\n  }\n\n  return (\n    <Provider>\n      <AccordionItemContent id={id} {...props}>\n        {children}\n      </AccordionItemContent>\n    </Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;AAiBO,MAAM,gBAAgB,CAAC;AAAA,EAC5B,QAAA;AAAA,EACA,EAAA;AAAA,EACA,GAAG,KAAA;AACL,CAA2B,KAAA;AACzB,EAAA,MAAM,UAAU,mBAAoB,EAAA,CAAA;AACpC,EAAA,MAAM,QAAW,GAAA,OAAA,CAAQ,KAAM,CAAA,sBAAA,CAAuB,EAAE,CAAA,CAAA;AACxD,EAAM,MAAA,aAAA,GAAgB,OAAO,KAAK,CAAA,CAAA;AAElC,EAAI,IAAA,CAAC,cAAc,OAAS,EAAA;AAC1B,IAAA,aAAA,CAAc,OAAU,GAAA,IAAA,CAAA;AACxB,IAAA,OAAA,CAAQ,aAAa,EAAI,EAAA,EAAE,WAAW,KAAO,EAAA,UAAA,EAAY,OAAO,CAAA,CAAA;AAAA,GAClE;AAEA,EACE,uBAAA,GAAA,CAAC,YACC,QAAC,kBAAA,GAAA,CAAA,oBAAA,EAAA,EAAqB,IAAS,GAAG,KAAA,EAC/B,UACH,CACF,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/accordion/AccordionItemButton.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { ReactNode } from 'react';
+
+type TAccordionItemButton = {
+    children?: ReactNode;
+};
+declare const AccordionItemButton: ({ children }: TAccordionItemButton) => React.JSX.Element;
+
+export { AccordionItemButton, type TAccordionItemButton };
+//# sourceMappingURL=AccordionItemButton.d.ts.map

package/dist/components/accordion/AccordionItemButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItemButton.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/accordion/AccordionItemButton.js

@@ -0,0 +1,8 @@
+import { jsx, Fragment } from '@apia/theme/jsx-runtime';
+
+const AccordionItemButton = ({ children }) => {
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+
+export { AccordionItemButton };
+//# sourceMappingURL=AccordionItemButton.js.map

package/dist/components/accordion/AccordionItemButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItemButton.js","sources":["../../../src/components/accordion/AccordionItemButton.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nexport type TAccordionItemButton = {\n  children?: ReactNode;\n};\n\nexport const AccordionItemButton = ({ children }: TAccordionItemButton) => {\n  return <>{children}</>;\n};\n"],"names":[],"mappings":";;AAMO,MAAM,mBAAsB,GAAA,CAAC,EAAE,QAAA,EAAqC,KAAA;AACzE,EAAA,uCAAU,QAAS,EAAA,CAAA,CAAA;AACrB;;;;"}

package/dist/components/accordion/AccordionItemContent.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { IAccordionItemProps } from './AccordionItem.js';
+
+declare const AccordionItemContent: ({ children, buttonProps, }: IAccordionItemProps) => React.JSX.Element;
+
+export { AccordionItemContent };
+//# sourceMappingURL=AccordionItemContent.d.ts.map

package/dist/components/accordion/AccordionItemContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItemContent.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/accordion/AccordionItemContent.js

@@ -0,0 +1,50 @@
+import { jsxs, jsx } from '@apia/theme/jsx-runtime';
+import { Children } from 'react';
+import { AccordionItemButton } from './AccordionItemButton.js';
+import { DefaultAccordionItemButton } from './defaultElements/DefaultAccordionItemButton.js';
+import AnimateHeight from 'react-animate-height';
+import { useAccordionContext } from './context.js';
+import { Box } from '@apia/theme';
+
+const AccordionItemContent = ({
+  children,
+  buttonProps
+}) => {
+  let button = null;
+  const actualChildren = Children.toArray(children).filter((current) => {
+    if (typeof current !== "string" && typeof current !== "number") {
+      const element = current;
+      if (element.type === AccordionItemButton) {
+        button = element;
+        return false;
+      }
+    }
+    return true;
+  });
+  if (button === null && buttonProps)
+    button = /* @__PURE__ */ jsx(DefaultAccordionItemButton, { ...buttonProps });
+  const handler = useAccordionContext();
+  const isExpanded = handler.hooks.useItemStateSelector(
+    (current) => current.isExpanded
+  );
+  const duration = handler.hooks.usePropsSelector(
+    (current) => current.animationDuration
+  );
+  const id = handler.hooks.useItemId();
+  return /* @__PURE__ */ jsxs(Box, { className: "accordion__item", "data-id": id, children: [
+    button,
+    /* @__PURE__ */ jsx(
+      AnimateHeight,
+      {
+        className: "accordion__item__content",
+        height: isExpanded ? "auto" : 0,
+        duration,
+        id: `accordion__${handler.id}__${id}`,
+        children: actualChildren
+      }
+    )
+  ] });
+};
+
+export { AccordionItemContent };
+//# sourceMappingURL=AccordionItemContent.js.map

package/dist/components/accordion/AccordionItemContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItemContent.js","sources":["../../../src/components/accordion/AccordionItemContent.tsx"],"sourcesContent":["import { Children, ReactElement } from 'react';\nimport { AccordionItemButton } from './AccordionItemButton';\nimport { DefaultAccordionItemButton } from './defaultElements/DefaultAccordionItemButton';\nimport { IAccordionItemProps } from './AccordionItem';\nimport AnimateHeight from 'react-animate-height';\nimport { useAccordionContext } from './context';\nimport { Box } from '@apia/theme';\n\nexport const AccordionItemContent = ({\n  children,\n  buttonProps,\n}: IAccordionItemProps) => {\n  let button = null;\n\n  const actualChildren = Children.toArray(children).filter((current) => {\n    if (typeof current !== 'string' && typeof current !== 'number') {\n      const element = current as ReactElement;\n\n      if (element.type === AccordionItemButton) {\n        button = element;\n        return false;\n      }\n    }\n    return true;\n  });\n\n  if (button === null && buttonProps)\n    button = <DefaultAccordionItemButton {...buttonProps} />;\n\n  const handler = useAccordionContext();\n  const isExpanded = handler.hooks.useItemStateSelector(\n    (current) => current.isExpanded,\n  );\n  const duration = handler.hooks.usePropsSelector(\n    (current) => current.animationDuration,\n  );\n  const id = handler.hooks.useItemId();\n\n  return (\n    <Box className=\"accordion__item\" data-id={id}>\n      {button}\n      <AnimateHeight\n        className=\"accordion__item__content\"\n        height={isExpanded ? 'auto' : 0}\n        duration={duration}\n        id={`accordion__${handler.id}__${id}`}\n      >\n        {actualChildren}\n      </AnimateHeight>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAQO,MAAM,uBAAuB,CAAC;AAAA,EACnC,QAAA;AAAA,EACA,WAAA;AACF,CAA2B,KAAA;AACzB,EAAA,IAAI,MAAS,GAAA,IAAA,CAAA;AAEb,EAAA,MAAM,iBAAiB,QAAS,CAAA,OAAA,CAAQ,QAAQ,CAAE,CAAA,MAAA,CAAO,CAAC,OAAY,KAAA;AACpE,IAAA,IAAI,OAAO,OAAA,KAAY,QAAY,IAAA,OAAO,YAAY,QAAU,EAAA;AAC9D,MAAA,MAAM,OAAU,GAAA,OAAA,CAAA;AAEhB,MAAI,IAAA,OAAA,CAAQ,SAAS,mBAAqB,EAAA;AACxC,QAAS,MAAA,GAAA,OAAA,CAAA;AACT,QAAO,OAAA,KAAA,CAAA;AAAA,OACT;AAAA,KACF;AACA,IAAO,OAAA,IAAA,CAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,IAAI,WAAW,IAAQ,IAAA,WAAA;AACrB,IAAS,MAAA,mBAAA,GAAA,CAAC,0BAA4B,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA,CAAA;AAExD,EAAA,MAAM,UAAU,mBAAoB,EAAA,CAAA;AACpC,EAAM,MAAA,UAAA,GAAa,QAAQ,KAAM,CAAA,oBAAA;AAAA,IAC/B,CAAC,YAAY,OAAQ,CAAA,UAAA;AAAA,GACvB,CAAA;AACA,EAAM,MAAA,QAAA,GAAW,QAAQ,KAAM,CAAA,gBAAA;AAAA,IAC7B,CAAC,YAAY,OAAQ,CAAA,iBAAA;AAAA,GACvB,CAAA;AACA,EAAM,MAAA,EAAA,GAAK,OAAQ,CAAA,KAAA,CAAM,SAAU,EAAA,CAAA;AAEnC,EAAA,uBACG,IAAA,CAAA,GAAA,EAAA,EAAI,SAAU,EAAA,iBAAA,EAAkB,WAAS,EACvC,EAAA,QAAA,EAAA;AAAA,IAAA,MAAA;AAAA,oBACD,GAAA;AAAA,MAAC,aAAA;AAAA,MAAA;AAAA,QACC,SAAU,EAAA,0BAAA;AAAA,QACV,MAAA,EAAQ,aAAa,MAAS,GAAA,CAAA;AAAA,QAC9B,QAAA;AAAA,QACA,EAAI,EAAA,CAAA,WAAA,EAAc,OAAQ,CAAA,EAAE,KAAK,EAAE,CAAA,CAAA;AAAA,QAElC,QAAA,EAAA,cAAA;AAAA,OAAA;AAAA,KACH;AAAA,GACF,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/dist/components/accordion/KeyHandler.js

@@ -0,0 +1,77 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { Box, getVariant } from '@apia/theme';
+import { useState, useEffect } from 'react';
+import { useAccordionContext } from './context.js';
+
+const KeyHandler = (props) => {
+  const [ref, setRef] = useState(null);
+  const handler = useAccordionContext();
+  useEffect(() => {
+    if (ref) {
+      ref.addEventListener("keydown", (ev) => {
+        const accordionItem = ev.target?.closest(
+          ".accordion__item"
+        );
+        const accordion = ev.target?.closest(".accordion");
+        const allItems = [
+          ...accordion?.querySelectorAll(".accordion__item") ?? []
+        ];
+        const currentIndex = allItems.findIndex(
+          (current) => current === accordionItem
+        );
+        if (ev.code === "ArrowDown") {
+          if (currentIndex < allItems.length - 1) {
+            ev.preventDefault();
+            allItems[currentIndex + 1]?.querySelector(
+              ".accordion__item__button"
+            )?.focus();
+          }
+        } else if (ev.code === "ArrowUp") {
+          if (currentIndex > 0) {
+            ev.preventDefault();
+            allItems[currentIndex - 1]?.querySelector(
+              ".accordion__item__button"
+            )?.focus();
+          }
+        } else if (ev.code === "ArrowLeft") {
+          if (allItems[currentIndex]?.querySelector(
+            '[aria-expanded="true"]'
+          )) {
+            ev.preventDefault();
+            allItems[currentIndex]?.querySelector(
+              ".accordion__item__button"
+            )?.click();
+          }
+        } else if (ev.code === "ArrowRight") {
+          if (allItems[currentIndex]?.querySelector(
+            '[aria-expanded="false"]'
+          )) {
+            ev.preventDefault();
+            allItems[currentIndex]?.querySelector(
+              ".accordion__item__button"
+            )?.click();
+          }
+        } else if (ev.code === "Space") {
+          ev.preventDefault();
+          ev.stopPropagation();
+          const id = accordionItem.dataset.id;
+          handler.udpateItem(id, {
+            isChecked: !handler.itemsState[id].isChecked
+          });
+        }
+      });
+    }
+  }, [handler, ref]);
+  const variant = handler.hooks.usePropsSelector((current) => current.variant);
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ...props,
+      ref: setRef,
+      ...variant ? getVariant(variant) : void 0
+    }
+  );
+};
+
+export { KeyHandler };
+//# sourceMappingURL=KeyHandler.js.map

package/dist/components/accordion/KeyHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyHandler.js","sources":["../../../src/components/accordion/KeyHandler.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@apia/theme';\nimport { useEffect, useState } from 'react';\nimport { useAccordionContext } from './context';\nimport { getVariant } from '@apia/theme';\n\nexport const KeyHandler = (props: BoxProps) => {\n  const [ref, setRef] = useState<HTMLDivElement | null>(null);\n  const handler = useAccordionContext();\n\n  useEffect(() => {\n    if (ref) {\n      ref.addEventListener('keydown', (ev) => {\n        const accordionItem = (ev.target as HTMLElement)?.closest(\n          '.accordion__item',\n        ) as HTMLElement;\n        const accordion = (ev.target as HTMLElement)?.closest('.accordion');\n        const allItems = [\n          ...(accordion?.querySelectorAll('.accordion__item') ?? []),\n        ];\n        const currentIndex = allItems.findIndex(\n          (current) => current === accordionItem,\n        );\n\n        if (ev.code === 'ArrowDown') {\n          if (currentIndex < allItems.length - 1) {\n            ev.preventDefault();\n            (\n              (allItems[currentIndex + 1] as HTMLElement)?.querySelector(\n                '.accordion__item__button',\n              ) as HTMLElement\n            )?.focus();\n          }\n        } else if (ev.code === 'ArrowUp') {\n          if (currentIndex > 0) {\n            ev.preventDefault();\n            (\n              (allItems[currentIndex - 1] as HTMLElement)?.querySelector(\n                '.accordion__item__button',\n              ) as HTMLElement\n            )?.focus();\n          }\n        } else if (ev.code === 'ArrowLeft') {\n          if (\n            (allItems[currentIndex] as HTMLElement)?.querySelector(\n              '[aria-expanded=\"true\"]',\n            ) as HTMLElement\n          ) {\n            ev.preventDefault();\n            (\n              (allItems[currentIndex] as HTMLElement)?.querySelector(\n                '.accordion__item__button',\n              ) as HTMLElement\n            )?.click();\n          }\n        } else if (ev.code === 'ArrowRight') {\n          if (\n            (allItems[currentIndex] as HTMLElement)?.querySelector(\n              '[aria-expanded=\"false\"]',\n            ) as HTMLElement\n          ) {\n            ev.preventDefault();\n            (\n              (allItems[currentIndex] as HTMLElement)?.querySelector(\n                '.accordion__item__button',\n              ) as HTMLElement\n            )?.click();\n          }\n        } else if (ev.code === 'Space') {\n          ev.preventDefault();\n          ev.stopPropagation();\n          const id = accordionItem.dataset.id as string;\n          handler.udpateItem(id, {\n            isChecked: !handler.itemsState[id].isChecked,\n          });\n        }\n      });\n    }\n  }, [handler, ref]);\n\n  const variant = handler.hooks.usePropsSelector((current) => current.variant);\n\n  return (\n    <Box\n      {...props}\n      ref={setRef}\n      {...(variant ? getVariant(variant) : undefined)}\n    />\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/accordion/context.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { AccordionHandler } from './handler.js';
+import { TId } from '@apia/util';
+
+declare const AccordionContext: React.Context<AccordionHandler | null>;
+declare const AccordionItemContext: React.Context<TId | null>;
+declare const useAccordionContext: () => AccordionHandler;
+
+export { AccordionContext, AccordionItemContext, useAccordionContext };
+//# sourceMappingURL=context.d.ts.map

package/dist/components/accordion/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/accordion/context.js

@@ -0,0 +1,13 @@
+import { createContext, useContext } from 'react';
+
+const AccordionContext = createContext(null);
+const AccordionItemContext = createContext(null);
+const useAccordionContext = () => {
+  const context = useContext(AccordionContext);
+  if (!context)
+    throw new Error("There is no AccordionContext");
+  return context;
+};
+
+export { AccordionContext, AccordionItemContext, useAccordionContext };
+//# sourceMappingURL=context.js.map

package/dist/components/accordion/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sources":["../../../src/components/accordion/context.ts"],"sourcesContent":["import { TId } from '@apia/util';\nimport { createContext, useContext } from 'react';\nimport { TAccordionHandler } from '.';\n\nexport const AccordionContext = createContext<TAccordionHandler | null>(null);\nexport const AccordionItemContext = createContext<TId | null>(null);\n\nexport const useAccordionContext = () => {\n  const context = useContext(AccordionContext);\n  if (!context) throw new Error('There is no AccordionContext');\n  return context;\n};\n"],"names":[],"mappings":";;AAIa,MAAA,gBAAA,GAAmB,cAAwC,IAAI,EAAA;AAC/D,MAAA,oBAAA,GAAuB,cAA0B,IAAI,EAAA;AAE3D,MAAM,sBAAsB,MAAM;AACvC,EAAM,MAAA,OAAA,GAAU,WAAW,gBAAgB,CAAA,CAAA;AAC3C,EAAA,IAAI,CAAC,OAAA;AAAS,IAAM,MAAA,IAAI,MAAM,8BAA8B,CAAA,CAAA;AAC5D,EAAO,OAAA,OAAA,CAAA;AACT;;;;"}

package/dist/components/accordion/defaultElements/Checkbox.js

@@ -0,0 +1,22 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { Box } from '@apia/theme';
+import { Icon } from '@apia/icons';
+
+const Checkbox = (props) => {
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className: "accordion__item__button__check",
+      onClick: (ev) => {
+        ev.stopPropagation();
+        ev.preventDefault();
+        if (!props.disabled)
+          props.onChange?.(!props.checked);
+      },
+      children: props.checked && /* @__PURE__ */ jsx(Icon, { title: "", name: "Check" })
+    }
+  );
+};
+
+export { Checkbox };
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/accordion/defaultElements/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/accordion/defaultElements/Checkbox.tsx"],"sourcesContent":["import { Box } from '@apia/theme';\nimport { Icon } from '@apia/icons';\n\nexport interface ICheckbox {\n  checked: boolean;\n  disabled?: boolean;\n  onChange: (checked: boolean) => unknown;\n}\n\nexport const Checkbox = (props: ICheckbox) => {\n  return (\n    <Box\n      className=\"accordion__item__button__check\"\n      onClick={(ev) => {\n        ev.stopPropagation();\n        ev.preventDefault();\n        if (!props.disabled) props.onChange?.(!props.checked);\n      }}\n    >\n      {props.checked && <Icon title=\"\" name=\"Check\" />}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;AASa,MAAA,QAAA,GAAW,CAAC,KAAqB,KAAA;AAC5C,EACE,uBAAA,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,gCAAA;AAAA,MACV,OAAA,EAAS,CAAC,EAAO,KAAA;AACf,QAAA,EAAA,CAAG,eAAgB,EAAA,CAAA;AACnB,QAAA,EAAA,CAAG,cAAe,EAAA,CAAA;AAClB,QAAA,IAAI,CAAC,KAAM,CAAA,QAAA;AAAU,UAAM,KAAA,CAAA,QAAA,GAAW,CAAC,KAAA,CAAM,OAAO,CAAA,CAAA;AAAA,OACtD;AAAA,MAEC,gBAAM,OAAW,oBAAA,GAAA,CAAC,QAAK,KAAM,EAAA,EAAA,EAAG,MAAK,OAAQ,EAAA,CAAA;AAAA,KAAA;AAAA,GAChD,CAAA;AAEJ;;;;"}