@pautena/react-design-system 0.20.2 → 1.0.0

package/dist/Content/Content.mjs

@@ -0,0 +1,10 @@
+import { j as t } from "../_virtual/jsx-runtime.mjs";
+import n from "../node_modules/@mui/material/esm/Container/Container.mjs";
+function m({ children: o }) {
+  return /* @__PURE__ */ t.jsx(n, { component: "main", sx: { py: 3, flexGrow: 1 }, children: o });
+}
+export {
+  m as Content,
+  m as default
+};
+//# sourceMappingURL=Content.mjs.map

package/dist/Content/Content.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Content.mjs","sources":["../../src/Content/Content.tsx"],"sourcesContent":["import Container from \"@mui/material/Container\";\nimport type { ContentProps } from \"./Content.types\";\n\n/**\n * A functional component that renders its children inside a main container.\n */\nexport function Content({ children }: ContentProps) {\n  return (\n    <Container component=\"main\" sx={{ py: 3, flexGrow: 1 }}>\n      {children}\n    </Container>\n  );\n}\n\nexport default Content;\n"],"names":["Content","children","jsx","Container"],"mappings":";;AAMO,SAASA,EAAQ,EAAE,UAAAC,KAA0B;AAClD,SACEC,gBAAAA,EAAAA,IAACC,GAAA,EAAU,WAAU,QAAO,IAAI,EAAE,IAAI,GAAG,UAAU,EAAA,GAChD,UAAAF,EAAA,CACH;AAEJ;"}

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

@@ -0,0 +1,18 @@
+import { FunctionComponent, ReactElement } from 'react';
+/**
+ * Props for the Content component
+ */
+export interface ContentProps {
+    /**
+     * Content to display
+     */
+    children?: React.ReactNode;
+}
+/**
+ * Content component type
+ */
+export type ContentComponent = FunctionComponent<ContentProps>;
+/**
+ * Content element type
+ */
+export type ContentElement = ReactElement<ContentElement, ContentComponent>;

package/dist/Content/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Content';
+export { default, default as Content } from './Content';
+export * from './Content.types';

package/dist/ContentPlaceholder/ContentPlaceholder.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Props for the ContentPlaceholder component.
+ */
+export interface ContentPlaceholderProps {
+    /**
+     * Optional size of the placeholder.
+     */
+    size?: number;
+    /**
+     * Optional padding for the placeholder.
+     */
+    p?: number;
+    /**
+     * Content to display before the skeleton grid
+     */
+    children?: React.ReactNode;
+}
+/**
+ * A component that serves as a placeholder for content, displaying a skeleton grid.
+ */
+export declare function ContentPlaceholder({ size, children, p, }: ContentPlaceholderProps): import("react/jsx-runtime").JSX.Element;
+export default ContentPlaceholder;

package/dist/ContentPlaceholder/ContentPlaceholder.mjs

@@ -0,0 +1,26 @@
+import { j as t } from "../_virtual/jsx-runtime.mjs";
+import { SkeletonGrid as r } from "../SkeletonGrid/SkeletonGrid.mjs";
+import i from "../node_modules/@mui/material/esm/Container/Container.mjs";
+function d({
+  size: e = 20,
+  children: o,
+  p: n
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    i,
+    {
+      component: "main",
+      sx: { p: n },
+      "data-testid": "content-placeholder-test",
+      children: [
+        o,
+        /* @__PURE__ */ t.jsx(r, { size: e })
+      ]
+    }
+  );
+}
+export {
+  d as ContentPlaceholder,
+  d as default
+};
+//# sourceMappingURL=ContentPlaceholder.mjs.map

package/dist/ContentPlaceholder/ContentPlaceholder.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContentPlaceholder.mjs","sources":["../../src/ContentPlaceholder/ContentPlaceholder.tsx"],"sourcesContent":["import Container from \"@mui/material/Container\";\nimport SkeletonGrid from \"../SkeletonGrid\";\n\n/**\n * Props for the ContentPlaceholder component.\n */\nexport interface ContentPlaceholderProps {\n  /**\n   * Optional size of the placeholder.\n   */\n  size?: number;\n  /**\n   * Optional padding for the placeholder.\n   */\n  p?: number;\n  /**\n   * Content to display before the skeleton grid\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * A component that serves as a placeholder for content, displaying a skeleton grid.\n */\nexport function ContentPlaceholder({\n  size = 20,\n  children,\n  p,\n}: ContentPlaceholderProps) {\n  return (\n    <Container\n      component=\"main\"\n      sx={{ p }}\n      data-testid=\"content-placeholder-test\"\n    >\n      {children}\n      <SkeletonGrid size={size} />\n    </Container>\n  );\n}\n\nexport default ContentPlaceholder;\n"],"names":["ContentPlaceholder","size","children","p","jsxs","Container","jsx","SkeletonGrid"],"mappings":";;;AAwBO,SAASA,EAAmB;AAAA,EACjC,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,GAAAC;AACF,GAA4B;AAC1B,SACEC,gBAAAA,EAAAA;AAAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,IAAI,EAAE,GAAAF,EAAA;AAAA,MACN,eAAY;AAAA,MAEX,UAAA;AAAA,QAAAD;AAAA,QACDI,gBAAAA,MAACC,KAAa,MAAAN,EAAA,CAAY;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhC;"}

package/dist/ContentPlaceholder/index.d.ts

@@ -0,0 +1,2 @@
+export type { ContentPlaceholderProps } from './ContentPlaceholder';
+export { default, default as ContentPlaceholder } from './ContentPlaceholder';

package/dist/DateRangeCalendar/DateRangeCalendar.d.ts

@@ -0,0 +1,22 @@
+type DateRange = [Date, Date | undefined];
+/**
+ * Props for the DateRangeCalendar component.
+ */
+export interface DateRangeCalendarProps {
+    /**
+     * The default date range value.
+     */
+    defaultValue: DateRange;
+    /**
+     * Callback function that is called when the date range value changes.
+     *
+     * @param value - The new date range value.
+     * @param updatedIndex - The index of the updated date range.
+     */
+    onValueChange: (value: DateRange, updatedIndex: number) => void;
+}
+/**
+ * A Date Range Calendar component that allows users to select a range of dates.
+ */
+export declare function DateRangeCalendar({ defaultValue, onValueChange, }: DateRangeCalendarProps): import("react/jsx-runtime").JSX.Element;
+export default DateRangeCalendar;

package/dist/DateRangeCalendar/DateRangeCalendar.mjs

@@ -0,0 +1,79 @@
+import { j as l } from "../_virtual/jsx-runtime.mjs";
+import { DateCalendar as g, PickersDay as u } from "@mui/x-date-pickers";
+import { isAfter as k, isBefore as R, isSameDay as c, startOfWeek as x, endOfWeek as D, format as h } from "date-fns";
+import { useState as y } from "react";
+import b from "../node_modules/@mui/material/esm/styles/styled.mjs";
+import p from "../node_modules/@mui/material/esm/Box/Box.mjs";
+const B = b(p, {
+  shouldForwardProp: (s) => s !== "dayIsBetween" && s !== "isFirstDay" && s !== "isLastDay" && s !== "isStartOfWeek" && s !== "isEndOfWeek"
+})(({ theme: s, dayIsBetween: t, isFirstDay: r, isLastDay: i }) => ({
+  ...(r || i || t) && {
+    borderRadius: 0,
+    backgroundColor: `${s.palette.primary.light}40`,
+    margin: 0
+  },
+  ...r && {
+    borderTopLeftRadius: "50%",
+    borderBottomLeftRadius: "50%"
+  },
+  ...i && {
+    borderTopRightRadius: "50%",
+    borderBottomRightRadius: "50%"
+  }
+})), j = (s) => {
+  const { day: t, dateRange: r, ...i } = s;
+  if (r == null)
+    return /* @__PURE__ */ l.jsx(u, { day: t, ...i });
+  const [a, d] = r, o = !!d && k(t, a) && R(t, d), n = c(t, a), e = !!d && c(t, d), f = c(t, x(t)), m = c(t, D(t));
+  return /* @__PURE__ */ l.jsx(
+    B,
+    {
+      dayIsBetween: o,
+      isFirstDay: n || o && f,
+      isLastDay: e || o && m,
+      "aria-label": h(t, "yyyy-MM-dd"),
+      "aria-selected": o || n || e,
+      role: "gridcell",
+      children: /* @__PURE__ */ l.jsx(u, { ...i, day: t, selected: n || e })
+    }
+  );
+};
+function S({
+  defaultValue: s,
+  onValueChange: t
+}) {
+  const [r, i] = y(s), [a, d] = y(0), o = (e, f, m) => {
+    i(e), t(e, f), d(m);
+  }, n = (e) => {
+    if (e) {
+      if (a === 1 && e < r[0])
+        return o([e, void 0], 0, 1);
+      if (a === 0 && r[1] && e > r[1])
+        return o([e, void 0], 0, 1);
+      o(
+        [a === 0 ? e : r[0], a === 1 ? e : r[1]],
+        a,
+        a === 0 ? 1 : 0
+      );
+    }
+  };
+  return /* @__PURE__ */ l.jsx(
+    g,
+    {
+      value: null,
+      onChange: n,
+      slots: { day: j },
+      slotProps: {
+        day: {
+          dateRange: r
+        }
+      },
+      "aria-label": "calendar range picker"
+    }
+  );
+}
+export {
+  S as DateRangeCalendar,
+  S as default
+};
+//# sourceMappingURL=DateRangeCalendar.mjs.map

package/dist/DateRangeCalendar/DateRangeCalendar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangeCalendar.mjs","sources":["../../src/DateRangeCalendar/DateRangeCalendar.tsx"],"sourcesContent":["import Box, { type BoxProps } from \"@mui/material/Box\";\nimport { styled } from \"@mui/material/styles\";\nimport {\n  DateCalendar,\n  PickersDay,\n  type PickersDayProps,\n} from \"@mui/x-date-pickers\";\nimport {\n  endOfWeek,\n  format,\n  isAfter,\n  isBefore,\n  isSameDay,\n  startOfWeek,\n} from \"date-fns\";\nimport { useState } from \"react\";\n\ntype DateRange = [Date, Date | undefined];\n\ninterface CustomPickerDayProps extends BoxProps {\n  dayIsBetween: boolean;\n  isFirstDay: boolean;\n  isLastDay: boolean;\n}\n\nconst CustomPickersDayBackground = styled(Box, {\n  shouldForwardProp: (prop) =>\n    prop !== \"dayIsBetween\" &&\n    prop !== \"isFirstDay\" &&\n    prop !== \"isLastDay\" &&\n    prop !== \"isStartOfWeek\" &&\n    prop !== \"isEndOfWeek\",\n})<CustomPickerDayProps>(({ theme, dayIsBetween, isFirstDay, isLastDay }) => {\n  return {\n    ...((isFirstDay || isLastDay || dayIsBetween) && {\n      borderRadius: 0,\n      backgroundColor: `${theme.palette.primary.light}40`,\n      margin: 0,\n    }),\n    ...(isFirstDay && {\n      borderTopLeftRadius: \"50%\",\n      borderBottomLeftRadius: \"50%\",\n    }),\n    ...(isLastDay && {\n      borderTopRightRadius: \"50%\",\n      borderBottomRightRadius: \"50%\",\n    }),\n  };\n}) as React.ComponentType<CustomPickerDayProps>;\n\nconst Day = (props: PickersDayProps & { dateRange?: DateRange | null }) => {\n  const { day, dateRange, ...other } = props;\n\n  if (dateRange == null) {\n    return <PickersDay day={day} {...other} />;\n  }\n\n  const [start, end] = dateRange;\n\n  const dayIsBetween = !!end && isAfter(day, start) && isBefore(day, end);\n  const isFirstDay = isSameDay(day, start);\n  const isLastDay = !!end && isSameDay(day, end);\n  const isStartOfWeek = isSameDay(day, startOfWeek(day));\n  const isEndOfWeek = isSameDay(day, endOfWeek(day));\n\n  return (\n    <CustomPickersDayBackground\n      dayIsBetween={dayIsBetween}\n      isFirstDay={isFirstDay || (dayIsBetween && isStartOfWeek)}\n      isLastDay={isLastDay || (dayIsBetween && isEndOfWeek)}\n      aria-label={format(day, \"yyyy-MM-dd\")}\n      aria-selected={dayIsBetween || isFirstDay || isLastDay}\n      role=\"gridcell\"\n    >\n      <PickersDay {...other} day={day} selected={isFirstDay || isLastDay} />\n    </CustomPickersDayBackground>\n  );\n};\n\n/**\n * Props for the DateRangeCalendar component.\n */\nexport interface DateRangeCalendarProps {\n  /**\n   * The default date range value.\n   */\n  defaultValue: DateRange;\n\n  /**\n   * Callback function that is called when the date range value changes.\n   *\n   * @param value - The new date range value.\n   * @param updatedIndex - The index of the updated date range.\n   */\n  onValueChange: (value: DateRange, updatedIndex: number) => void;\n}\n\n/**\n * A Date Range Calendar component that allows users to select a range of dates.\n */\nexport function DateRangeCalendar({\n  defaultValue,\n  onValueChange,\n}: DateRangeCalendarProps) {\n  const [value, setValue] = useState(defaultValue);\n  const [index, setIndex] = useState(0);\n\n  const setValueRange = (\n    newRange: DateRange,\n    index: number,\n    newIndex: number,\n  ) => {\n    setValue(newRange);\n    onValueChange(newRange, index);\n    setIndex(newIndex);\n  };\n\n  const handleChange = (newValue: Date | null) => {\n    if (!newValue) {\n      return;\n    }\n\n    // If is the end date and is minor than the start date\n    if (index === 1 && newValue < value[0]) {\n      return setValueRange([newValue, undefined], 0, 1);\n    }\n\n    // If is the start date and is bigger than the end date\n    if (index === 0 && value[1] && newValue > value[1]) {\n      return setValueRange([newValue, undefined], 0, 1);\n    }\n\n    // Default case\n    setValueRange(\n      [index === 0 ? newValue : value[0], index === 1 ? newValue : value[1]],\n      index,\n      index === 0 ? 1 : 0,\n    );\n  };\n  return (\n    <DateCalendar\n      value={null}\n      onChange={handleChange}\n      slots={{ day: Day }}\n      slotProps={{\n        day: {\n          dateRange: value,\n        } as any,\n      }}\n      aria-label=\"calendar range picker\"\n    />\n  );\n}\n\nexport default DateRangeCalendar;\n"],"names":["CustomPickersDayBackground","styled","Box","prop","theme","dayIsBetween","isFirstDay","isLastDay","Day","props","day","dateRange","other","jsx","PickersDay","start","end","isAfter","isBefore","isSameDay","isStartOfWeek","startOfWeek","isEndOfWeek","endOfWeek","format","DateRangeCalendar","defaultValue","onValueChange","value","setValue","useState","index","setIndex","setValueRange","newRange","newIndex","handleChange","newValue","DateCalendar"],"mappings":"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"}

package/dist/DateRangeCalendar/index.d.ts

@@ -0,0 +1,2 @@
+export type { DateRangeCalendarProps } from './DateRangeCalendar';
+export { default, default as DateRangeCalendar } from './DateRangeCalendar';

package/dist/DateRangePicker/DateRangePicker.d.ts

@@ -0,0 +1,39 @@
+type DateRange = [Date, Date | undefined];
+/**
+ * Props for the DateRangePicker component.
+ */
+export interface DateRangePickerProps {
+    /**
+     * The label for the date range picker.
+     */
+    label: string;
+    /**
+     * The default value for the date range picker.
+     */
+    defaultValue: DateRange;
+    /**
+     * The format in which the date range should be displayed.
+     */
+    format: string;
+    /**
+     * If true, the date range picker will take up the full width of its container.
+     * @default false
+     */
+    fullWidth?: boolean;
+    /**
+     * The size of the date range picker.
+     * @default "medium"
+     */
+    size?: "small" | "medium";
+    /**
+     * Callback function that is called when the value of the date range picker changes.
+     * @param value - The new date range value.
+     * @param index - The index of the date range picker.
+     */
+    onValueChange: (value: DateRange, index: number) => void;
+}
+/**
+ * DateRangePicker component allows users to select a date range.
+ */
+export declare function DateRangePicker({ defaultValue, format: fmt, label, fullWidth, onValueChange, size, }: DateRangePickerProps): import("react/jsx-runtime").JSX.Element;
+export default DateRangePicker;

package/dist/DateRangePicker/DateRangePicker.mjs

@@ -0,0 +1,55 @@
+import { j as e } from "../_virtual/jsx-runtime.mjs";
+import j from "../node_modules/@mui/icons-material/esm/Event.mjs";
+import { format as i } from "date-fns";
+import { useState as m } from "react";
+import { DateRangeCalendar as h } from "../DateRangeCalendar/DateRangeCalendar.mjs";
+import C from "../node_modules/@mui/material/esm/TextField/TextField.mjs";
+import g from "../node_modules/@mui/material/esm/InputAdornment/InputAdornment.mjs";
+import v from "../node_modules/@mui/material/esm/IconButton/IconButton.mjs";
+import I from "../node_modules/@mui/material/esm/Paper/Paper.mjs";
+import P from "../node_modules/@mui/material/esm/Collapse/Collapse.mjs";
+function S({
+  defaultValue: t,
+  format: r,
+  label: p,
+  fullWidth: l,
+  onValueChange: c,
+  size: d = "medium"
+}) {
+  const [f, a] = m(!1), [n, u] = m(t), x = (o, s) => {
+    u(o), c(o, s), a(s < 1);
+  };
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx(
+      C,
+      {
+        label: p,
+        fullWidth: l,
+        size: d,
+        value: `${i(n[0], r)} - ${n[1] ? i(n[1], r) : r.toUpperCase()}`,
+        InputProps: {
+          endAdornment: /* @__PURE__ */ e.jsx(g, { position: "end", children: /* @__PURE__ */ e.jsx(
+            v,
+            {
+              onClick: () => a((o) => !o),
+              "aria-label": "open calendar",
+              children: /* @__PURE__ */ e.jsx(j, {})
+            }
+          ) })
+        }
+      }
+    ),
+    /* @__PURE__ */ e.jsx(I, { children: /* @__PURE__ */ e.jsx(P, { in: f, "aria-label": "calendar collapse", children: /* @__PURE__ */ e.jsx(
+      h,
+      {
+        defaultValue: t,
+        onValueChange: x
+      }
+    ) }) })
+  ] });
+}
+export {
+  S as DateRangePicker,
+  S as default
+};
+//# sourceMappingURL=DateRangePicker.mjs.map

package/dist/DateRangePicker/DateRangePicker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangePicker.mjs","sources":["../../src/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import EventIcon from \"@mui/icons-material/Event\";\nimport Collapse from \"@mui/material/Collapse\";\nimport IconButton from \"@mui/material/IconButton\";\nimport InputAdornment from \"@mui/material/InputAdornment\";\nimport Paper from \"@mui/material/Paper\";\nimport TextField from \"@mui/material/TextField\";\nimport { format } from \"date-fns\";\nimport { useState } from \"react\";\nimport DateRangeCalendar from \"../DateRangeCalendar\";\n\ntype DateRange = [Date, Date | undefined];\n\n/**\n * Props for the DateRangePicker component.\n */\nexport interface DateRangePickerProps {\n  /**\n   * The label for the date range picker.\n   */\n  label: string;\n\n  /**\n   * The default value for the date range picker.\n   */\n  defaultValue: DateRange;\n\n  /**\n   * The format in which the date range should be displayed.\n   */\n  format: string;\n\n  /**\n   * If true, the date range picker will take up the full width of its container.\n   * @default false\n   */\n  fullWidth?: boolean;\n\n  /**\n   * The size of the date range picker.\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\";\n\n  /**\n   * Callback function that is called when the value of the date range picker changes.\n   * @param value - The new date range value.\n   * @param index - The index of the date range picker.\n   */\n  onValueChange: (value: DateRange, index: number) => void;\n}\n\n/**\n * DateRangePicker component allows users to select a date range.\n */\nexport function DateRangePicker({\n  defaultValue,\n  format: fmt,\n  label,\n  fullWidth,\n  onValueChange,\n  size = \"medium\",\n}: DateRangePickerProps) {\n  const [isPopoverOpened, setIsPopoverOpened] = useState(false);\n  const [value, setValue] = useState(defaultValue);\n\n  const handleValueChange = (newValue: DateRange, index: number) => {\n    setValue(newValue);\n    onValueChange(newValue, index);\n    setIsPopoverOpened(index < 1);\n  };\n\n  return (\n    <>\n      <TextField\n        label={label}\n        fullWidth={fullWidth}\n        size={size}\n        value={`${format(value[0], fmt)} - ${value[1] ? format(value[1], fmt) : fmt.toUpperCase()}`}\n        InputProps={{\n          endAdornment: (\n            <InputAdornment position=\"end\">\n              <IconButton\n                onClick={() => setIsPopoverOpened((o) => !o)}\n                aria-label=\"open calendar\"\n              >\n                <EventIcon />\n              </IconButton>\n            </InputAdornment>\n          ),\n        }}\n      />\n      <Paper>\n        <Collapse in={isPopoverOpened} aria-label=\"calendar collapse\">\n          <DateRangeCalendar\n            defaultValue={defaultValue}\n            onValueChange={handleValueChange}\n          />\n        </Collapse>\n      </Paper>\n    </>\n  );\n}\n\nexport default DateRangePicker;\n"],"names":["DateRangePicker","defaultValue","fmt","label","fullWidth","onValueChange","size","isPopoverOpened","setIsPopoverOpened","useState","value","setValue","handleValueChange","newValue","index","jsxs","Fragment","jsx","TextField","format","InputAdornment","IconButton","EventIcon","Paper","Collapse","DateRangeCalendar"],"mappings":";;;;;;;;;;AAsDO,SAASA,EAAgB;AAAA,EAC9B,cAAAC;AAAA,EACA,QAAQC;AAAA,EACR,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,MAAAC,IAAO;AACT,GAAyB;AACvB,QAAM,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GACtD,CAACC,GAAOC,CAAQ,IAAIF,EAASR,CAAY,GAEzCW,IAAoB,CAACC,GAAqBC,MAAkB;AAChE,IAAAH,EAASE,CAAQ,GACjBR,EAAcQ,GAAUC,CAAK,GAC7BN,EAAmBM,IAAQ,CAAC;AAAA,EAC9B;AAEA,SACEC,gBAAAA,EAAAA,KAAAC,YAAA,EACE,UAAA;AAAA,IAAAC,gBAAAA,EAAAA;AAAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAAf;AAAA,QACA,WAAAC;AAAA,QACA,MAAAE;AAAA,QACA,OAAO,GAAGa,EAAOT,EAAM,CAAC,GAAGR,CAAG,CAAC,MAAMQ,EAAM,CAAC,IAAIS,EAAOT,EAAM,CAAC,GAAGR,CAAG,IAAIA,EAAI,aAAa;AAAA,QACzF,YAAY;AAAA,UACV,cACEe,gBAAAA,EAAAA,IAACG,GAAA,EAAe,UAAS,OACvB,UAAAH,gBAAAA,EAAAA;AAAAA,YAACI;AAAA,YAAA;AAAA,cACC,SAAS,MAAMb,EAAmB,CAAC,MAAM,CAAC,CAAC;AAAA,cAC3C,cAAW;AAAA,cAEX,gCAACc,GAAA,CAAA,CAAU;AAAA,YAAA;AAAA,UAAA,EACb,CACF;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,0BAEDC,GAAA,EACC,UAAAN,gBAAAA,EAAAA,IAACO,KAAS,IAAIjB,GAAiB,cAAW,qBACxC,UAAAU,gBAAAA,EAAAA;AAAAA,MAACQ;AAAA,MAAA;AAAA,QACC,cAAAxB;AAAA,QACA,eAAeW;AAAA,MAAA;AAAA,IAAA,GAEnB,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/DateRangePicker/index.d.ts

@@ -0,0 +1,2 @@
+export type { DateRangePickerProps } from './DateRangePicker';
+export { default, default as DateRangePicker } from './DateRangePicker';

package/dist/Dialog/Dialog.types.d.ts

@@ -0,0 +1,230 @@
+import { BoxProps, ButtonProps, CircularProgressProps, DialogActionsProps, DialogContentProps, DialogProps, DialogTitleProps, IconButtonProps } from '@mui/material';
+import { JSXElementConstructor, ReactNode } from 'react';
+/**
+ * Action button configuration for dialogs
+ */
+export interface DialogAction {
+    /**
+     * Unique identifier
+     */
+    id: string;
+    /**
+     * Button text label
+     */
+    text: string;
+    /**
+     * Button type attribute
+     * @default "button"
+     */
+    type?: "button" | "submit";
+    /**
+     * Button color theme
+     * @default "primary"
+     */
+    color?: "inherit" | "primary" | "secondary" | "success" | "error" | "info" | "warning";
+    /**
+     * Click handler function
+     */
+    onClick?: () => void;
+}
+/**
+ * Interface representing the slots for the BootstrapDialog component.
+ */
+export interface BootstrapDialogSlots {
+    /**
+     * Root dialog component
+     */
+    dialog?: JSXElementConstructor<DialogProps>;
+    /**
+     * Dialog title component
+     */
+    dialogTitle?: JSXElementConstructor<DialogTitleProps>;
+    /**
+     * Title container component
+     */
+    titleContainer?: JSXElementConstructor<BoxProps>;
+    /**
+     * Loading indicator component
+     */
+    loadingIndicator?: JSXElementConstructor<CircularProgressProps>;
+    /**
+     * Close button component
+     */
+    closeButton?: JSXElementConstructor<IconButtonProps>;
+    /**
+     * Close icon component
+     */
+    closeIcon?: JSXElementConstructor<any>;
+    /**
+     * Content wrapper component
+     */
+    contentWrapper?: JSXElementConstructor<BoxProps>;
+    /**
+     * Dialog content component
+     */
+    dialogContent?: JSXElementConstructor<DialogContentProps>;
+    /**
+     * Dialog actions component
+     */
+    dialogActions?: JSXElementConstructor<DialogActionsProps>;
+    /**
+     * Action button component
+     */
+    actionButton?: JSXElementConstructor<ButtonProps>;
+    /**
+     * Cancel button component
+     */
+    cancelButton?: JSXElementConstructor<ButtonProps>;
+    /**
+     * Accept button component
+     */
+    acceptButton?: JSXElementConstructor<ButtonProps>;
+}
+/**
+ * Interface representing the slot properties for the BootstrapDialog component.
+ */
+export interface BootstrapDialogSlotProps {
+    /**
+     * Props for the root dialog
+     */
+    dialog?: Partial<DialogProps>;
+    /**
+     * Props for the dialog title
+     */
+    dialogTitle?: Partial<DialogTitleProps>;
+    /**
+     * Props for the title container
+     */
+    titleContainer?: Partial<BoxProps>;
+    /**
+     * Props for the loading indicator
+     */
+    loadingIndicator?: Partial<CircularProgressProps>;
+    /**
+     * Props for the close button
+     */
+    closeButton?: Partial<IconButtonProps>;
+    /**
+     * Props for the content wrapper
+     */
+    contentWrapper?: Partial<BoxProps>;
+    /**
+     * Props for the dialog content
+     */
+    dialogContent?: Partial<DialogContentProps>;
+    /**
+     * Props for the dialog actions
+     */
+    dialogActions?: Partial<DialogActionsProps>;
+    /**
+     * Props for action buttons
+     */
+    actionButton?: Partial<ButtonProps>;
+    /**
+     * Props for the cancel button
+     */
+    cancelButton?: Partial<ButtonProps>;
+    /**
+     * Props for the accept button
+     */
+    acceptButton?: Partial<ButtonProps>;
+}
+/**
+ * Props for the BootstrapDialog component.
+ */
+export type BootstrapDialogDialogProps = {
+    /**
+     * Whether the dialog is open.
+     */
+    open: boolean;
+    /**
+     * The title of the dialog.
+     */
+    title: string;
+    /**
+     * Whether the dialog is in a loading state.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Whether the dialog is disabled.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Whether the accept button is disabled.
+     * @default false
+     */
+    disableAccept?: boolean;
+    /**
+     * Whether the cancel button is disabled.
+     * @default false
+     */
+    disableCancel?: boolean;
+    /**
+     * Whether the dialog is cancelable.
+     * @default true
+     */
+    cancelable?: boolean;
+    /**
+     * Whether the dialog is acceptable.
+     * @default true
+     */
+    acceptable?: boolean;
+    /**
+     * Whether to call the onClose function when the cancel button is clicked.
+     * @default true
+     */
+    callCloseWhenCancel?: boolean;
+    /**
+     * Actions to be displayed in the dialog.
+     */
+    actions?: DialogAction[];
+    /**
+     * Text for the cancel button.
+     * @default "Cancel"
+     */
+    cancelText?: string;
+    /**
+     * Text for the accept button.
+     * @default "Accept"
+     */
+    acceptText?: string;
+    /**
+     * Type of the accept button.
+     * @default "button"
+     */
+    acceptType?: "button" | "submit";
+    /**
+     * Function to call when the dialog is closed.
+     */
+    onClose: () => void;
+    /**
+     * Function to call when the cancel button is clicked.
+     */
+    onCancel?: () => void;
+    /**
+     * Function to call when the accept button is clicked.
+     */
+    onAccept?: () => void;
+    /**
+     * Component to be rendered inside the dialog.
+     */
+    component?: React.ElementType;
+    /**
+     * Props to be passed to the component.
+     */
+    componentProps?: any;
+    /**
+     * Children to be rendered inside the dialog.
+     */
+    children?: ReactNode | undefined;
+    /**
+     * Optional slots for custom rendering within the dialog
+     */
+    slots?: BootstrapDialogSlots;
+    /**
+     * Optional props for the slots
+     */
+    slotProps?: BootstrapDialogSlotProps;
+};

package/dist/Dialog/UseDialog.mjs

@@ -0,0 +1,9 @@
+import { useState as t } from "react";
+const r = (s = !1) => {
+  const [o, e] = t(s);
+  return { isOpen: o, open: () => e(!0), close: () => e(!1), setIsOpen: e };
+};
+export {
+  r as useDialog
+};
+//# sourceMappingURL=UseDialog.mjs.map

package/dist/Dialog/UseDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"UseDialog.mjs","sources":["../../src/Dialog/UseDialog.ts"],"sourcesContent":["import { useState } from \"react\";\n\nexport const useDialog = (intialOpen = false) => {\n  const [isOpen, setIsOpen] = useState(intialOpen);\n\n  const open = () => setIsOpen(true);\n  const close = () => setIsOpen(false);\n\n  return { isOpen, open, close, setIsOpen };\n};\n"],"names":["useDialog","intialOpen","isOpen","setIsOpen","useState"],"mappings":";AAEO,MAAMA,IAAY,CAACC,IAAa,OAAU;AAC/C,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAASH,CAAU;AAK/C,SAAO,EAAE,QAAAC,GAAQ,MAHJ,MAAMC,EAAU,EAAI,GAGV,OAFT,MAAMA,EAAU,EAAK,GAEL,WAAAA,EAAA;AAChC;"}

package/dist/Dialog/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Dialog.types';
+export * from './UseDialog';

package/dist/Drawerx/Drawer/Drawer.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { DrawerProps } from '../Drawer.types';
+export declare const DrawerHeader: React.ComponentType<{
+    children?: React.ReactNode;
+    className?: string;
+}>;
+/**
+ * Drawer component that provides a customizable drawer interface.
+ */
+export default function Drawer({ children, ...rest }: DrawerProps): import("react/jsx-runtime").JSX.Element;

package/dist/Drawerx/Drawer/Drawer.mjs

@@ -0,0 +1,73 @@
+import { j as t } from "../../_virtual/jsx-runtime.mjs";
+import u from "../../node_modules/@mui/icons-material/esm/ChevronLeft.mjs";
+import { useDrawer as w } from "../DrawerContext/DrawerContext.mjs";
+import { closedMixin as s, openedMixin as a } from "../DrawerContext/DrawerMixins.mjs";
+import h from "../../node_modules/@mui/material/esm/styles/styled.mjs";
+import j from "../../node_modules/@mui/material/esm/styles/useTheme.mjs";
+import p from "../../node_modules/@mui/material/esm/Drawer/drawerClasses.mjs";
+import y from "../../node_modules/@mui/material/esm/Drawer/Drawer.mjs";
+import C from "../../node_modules/@mui/material/esm/IconButton/IconButton.mjs";
+import v from "../../node_modules/@mui/material/esm/Divider/Divider.mjs";
+import D from "../../node_modules/@mui/material/esm/Paper/paperClasses.mjs";
+const S = h("div")(({ theme: r }) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "flex-end",
+  padding: r.spacing(0, 1),
+  ...r.mixins.toolbar
+})), I = {
+  temporary: !0,
+  mini: !0,
+  persistent: !0
+}, b = {
+  temporary: "temporary",
+  mini: "permanent",
+  persistent: "persistent"
+}, m = () => ({}), g = {
+  mini: (r, n) => ({
+    boxSizing: "border-box",
+    [`& .${D.root}`]: {
+      zIndex: n.zIndex.drawer - 1
+    }
+  }),
+  temporary: m,
+  persistent: m
+};
+function T({ children: r, ...n }) {
+  const e = j(), { state: o, switchState: d, clipped: c, close: l, drawerWidth: x, variant: i } = w(), f = {
+    width: x,
+    flexShrink: 0,
+    whiteSpace: "nowrap",
+    ...o === "open" && {
+      ...a(e),
+      [`& .${p.paper}`]: a(e)
+    },
+    ...o !== "open" && {
+      ...s(e),
+      [`& .${p.paper}`]: s(e)
+    },
+    ...g[i](o, e)
+  };
+  return /* @__PURE__ */ t.jsxs(
+    y,
+    {
+      open: o === "open",
+      variant: b[i],
+      role: "menu",
+      "aria-hidden": o === "close",
+      onClose: l,
+      sx: f,
+      ...n,
+      children: [
+        /* @__PURE__ */ t.jsx(S, { children: !c && I[i] && /* @__PURE__ */ t.jsx(C, { onClick: d, children: /* @__PURE__ */ t.jsx(u, {}) }) }),
+        /* @__PURE__ */ t.jsx(v, {}),
+        r
+      ]
+    }
+  );
+}
+export {
+  S as DrawerHeader,
+  T as default
+};
+//# sourceMappingURL=Drawer.mjs.map