@m4l/components 0.1.40 → 0.1.41

package/components/Period/index.abe445bd.js

@@ -0,0 +1,256 @@
+import { useModuleDictionary, useModuleSkeleton, useEnvironment } from "@m4l/core";
+import { styled, Skeleton, Autocomplete, TextField } from "@mui/material";
+import { useMemo } from "react";
+import { I as Icon } from "../Icon/index.8d754623.js";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { g as getCommonActionsDictionary } from "../CommonActions/components/Actions/index.d3e1f36e.js";
+import "@mui/material/Button";
+import "react-hook-form";
+import "../../contexts/ModalContext/index.b90eec94.js";
+import "../../react-draggable.84d6b038.js";
+import "../ModalDialog/index.a684827f.js";
+import "../Resizeable/index.c96c0f09.js";
+import "@m4l/graphics";
+import "../areas/contexts/DynamicMFParmsContext/index.668bc2e2.js";
+import "../modal/WindowConfirm.0b8a6818.js";
+import "@mui/material/styles";
+import "../modal/WindowBase.04439b8e.js";
+import "@mui/lab";
+const ContainerPeriod = styled("div")(({
+  theme,
+  error,
+  readOnly
+}) => ({
+  display: "flex",
+  width: "100%",
+  height: "auto",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  border: error ? `1px solid ${theme.palette.error.main}` : `1px solid ${theme.palette.divider}`,
+  padding: theme.spacing(0.5, 1),
+  borderRadius: "4px",
+  ...readOnly && {
+    border: "0px"
+  },
+  "& .MuiAutocomplete-root, & .MuiTextField-root": {
+    width: "100%"
+  },
+  "& .MuiAutocomplete-root .MuiTextField-root": {
+    width: "100%"
+  },
+  "& .MuiTextField-root .MuiInput-input": {
+    padding: "5px!important"
+  }
+}));
+const Gap = styled("div")(({
+  theme
+}) => ({
+  width: "1px",
+  height: "20px",
+  backgroundColor: theme.palette.divider
+}));
+const SKTWrapper = styled("div", {
+  shouldForwardProp: (props) => props !== "readOnly"
+})(({
+  theme,
+  readOnly
+}) => ({
+  display: "flex",
+  width: "100%",
+  height: "37.5px",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  border: `1px solid ${theme.palette.divider}`,
+  ...readOnly && {
+    border: "0px"
+  },
+  padding: theme.spacing(0.5, 1),
+  borderRadius: "4px"
+}));
+const FieldPeriod = styled("div")(({
+  theme
+}) => ({
+  ...theme.typography.body2,
+  width: "100%",
+  display: "flex",
+  textOverflow: "elipsis",
+  overflow: "hidden",
+  padding: "5px",
+  textAlign: "left"
+}));
+const FieldValue = styled("div")(({
+  theme
+}) => ({
+  ...theme.typography.body2,
+  width: "70px",
+  display: "flex",
+  textOverflow: "elipsis",
+  overflow: "hidden",
+  padding: "5px",
+  textAlign: "left"
+}));
+var ETimePeriods = /* @__PURE__ */ ((ETimePeriods2) => {
+  ETimePeriods2[ETimePeriods2["YEARS"] = 0] = "YEARS";
+  ETimePeriods2[ETimePeriods2["MONTHS"] = 1] = "MONTHS";
+  ETimePeriods2[ETimePeriods2["DAYS"] = 2] = "DAYS";
+  return ETimePeriods2;
+})(ETimePeriods || {});
+const getSelPeriodTime = (period) => {
+  if (!period)
+    return ETimePeriods.YEARS;
+  if (period.selPeriodTime)
+    return period.selPeriodTime;
+  if (period.years && period.years > 0)
+    return ETimePeriods.YEARS;
+  if (period.months && period.months > 0)
+    return ETimePeriods.MONTHS;
+  if (period.days && period.days > 0)
+    return ETimePeriods.DAYS;
+  return ETimePeriods.YEARS;
+};
+const getSingleValue = (period) => {
+  if (!period)
+    return "";
+  if (period.singleValue !== void 0)
+    return period.singleValue;
+  if (period.years && period.years > 0)
+    return period.years;
+  if (period.months && period.months > 0)
+    return period.months;
+  if (period.days && period.days > 0)
+    return period.days;
+  return "";
+};
+const Period = (props) => {
+  const {
+    value,
+    onChange,
+    error = false,
+    readOnly = false,
+    skeletonWidth = "100%",
+    skeletonHeight = "18px"
+  } = props;
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const isSkeleton = useModuleSkeleton();
+  const selPeriodTime = getSelPeriodTime(value);
+  const singleValue = getSingleValue(value);
+  const onTotalChange = (newPeriodTime, newValue) => {
+    const newPeriod = {
+      selPeriodTime: newPeriodTime,
+      singleValue: newValue
+    };
+    if (newValue !== "" && newValue > 0) {
+      newPeriod.years = 0;
+      newPeriod.months = 0;
+      newPeriod.days = 0;
+      if (newPeriodTime === ETimePeriods.YEARS)
+        newPeriod.years = newValue;
+      if (newPeriodTime === ETimePeriods.MONTHS)
+        newPeriod.months = newValue;
+      if (newPeriodTime === ETimePeriods.DAYS)
+        newPeriod.days = newValue;
+    }
+    onChange(newPeriod);
+  };
+  const onChangeTime = (newPeriodTime) => {
+    if (newPeriodTime) {
+      onTotalChange(newPeriodTime.id, singleValue);
+    }
+  };
+  const {
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
+  const options = useMemo(() => [{
+    id: 0,
+    label: getLabel("period.label_days")
+  }, {
+    id: 1,
+    label: getLabel("period.label_months")
+  }, {
+    id: 2,
+    label: getLabel("period.label_years")
+  }], [getLabel]);
+  if (isSkeleton) {
+    return /* @__PURE__ */ jsxs(SKTWrapper, {
+      readOnly,
+      children: [/* @__PURE__ */ jsx(Skeleton, {
+        variant: "text",
+        width: "50%",
+        height: skeletonHeight
+      }), /* @__PURE__ */ jsx(Gap, {}), /* @__PURE__ */ jsx(Skeleton, {
+        variant: "text",
+        width: skeletonWidth,
+        height: skeletonHeight
+      }), /* @__PURE__ */ jsx(Skeleton, {
+        variant: "circular",
+        width: 20,
+        sx: {
+          minWidth: "20px",
+          minHeight: "20px"
+        }
+      })]
+    });
+  }
+  if (readOnly) {
+    /* @__PURE__ */ jsxs(ContainerPeriod, {
+      error: false,
+      readOnly,
+      children: [/* @__PURE__ */ jsx(FieldPeriod, {
+        children: value.selPeriodTime
+      }), /* @__PURE__ */ jsx(Gap, {}), /* @__PURE__ */ jsx(FieldValue, {
+        children: value.singleValue
+      }), /* @__PURE__ */ jsx(Icon, {
+        src: `${host_static_assets}/${environment_assets}/frontend/components/period/assets/icons/clock.svg`
+      })]
+    });
+  }
+  return /* @__PURE__ */ jsxs(ContainerPeriod, {
+    error,
+    readOnly,
+    children: [/* @__PURE__ */ jsx(Autocomplete, {
+      options,
+      value: options[selPeriodTime],
+      disableClearable: true,
+      onChange: (_event, autcValue) => {
+        onChangeTime(autcValue);
+      },
+      renderInput: (params) => {
+        return /* @__PURE__ */ jsx(TextField, {
+          ...params,
+          fullWidth: true,
+          variant: "standard",
+          SelectProps: {
+            native: true
+          },
+          InputProps: {
+            disableUnderline: true,
+            ...params.InputProps
+          },
+          autoComplete: "off"
+        }, `tx_async_${params.id}`);
+      }
+    }), /* @__PURE__ */ jsx(Gap, {}), /* @__PURE__ */ jsx(TextField, {
+      type: "number",
+      variant: "standard",
+      value: singleValue,
+      InputProps: {
+        disableUnderline: true
+      },
+      onChange: (e) => {
+        onTotalChange(selPeriodTime, e.target.value === "" ? "" : parseInt(e.target.value));
+      }
+    }), /* @__PURE__ */ jsx(Icon, {
+      src: `${host_static_assets}/${environment_assets}/frontend/components/period/assets/icons/clock.svg`
+    })]
+  });
+};
+function getPeriodComponetsDictionary() {
+  return ["period"].concat(getCommonActionsDictionary());
+}
+export {
+  Period as P,
+  getPeriodComponetsDictionary as g
+};

package/components/Period/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { PeriodProps } from './types';
+export declare const Period: (props: PeriodProps) => JSX.Element;

package/components/Period/styles.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { SKTWrapperProps, WrapperProps } from './types';
+export declare const ContainerPeriod: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & WrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Gap: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const SKTWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & SKTWrapperProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FieldPeriod: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FieldValue: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/Period/types.d.ts

@@ -0,0 +1,33 @@
+export declare enum ETimePeriods {
+    YEARS = 0,
+    MONTHS = 1,
+    DAYS = 2
+}
+export declare type PeriodVariant = 'monoperiod' | 'multiperiod';
+export declare type PeriodTime = {
+    id: number;
+    label: string;
+};
+export interface WrapperProps extends Pick<PeriodProps, 'readOnly'> {
+    error: boolean;
+}
+export declare type SKTWrapperProps = Pick<PeriodProps, 'readOnly'>;
+export declare type PeriodType = {
+    selPeriodTime: ETimePeriods;
+    singleValue: number | '';
+    years?: number;
+    months?: number;
+    days?: number;
+};
+export interface PeriodProps {
+    value: PeriodType;
+    onChange: (newValue: PeriodType) => void;
+    error?: boolean;
+    readOnly?: boolean;
+    variant?: PeriodVariant;
+    skeletonWidth?: string | number;
+    skeletonHeight?: string | number;
+}
+export interface WrapperProps {
+    error: boolean;
+}

package/components/PropertyValue/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { PropertyValueProps } from './types';
+export declare function PropertyValue(props: PropertyValueProps): JSX.Element;

package/components/PropertyValue/index.dfcfe1ba.js

@@ -0,0 +1,147 @@
+import { styled } from "@mui/material/styles";
+import { Skeleton } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useResponsiveDesktop } from "@m4l/graphics";
+import { useModuleSkeleton } from "@m4l/core";
+const WrapperPropertyValue = styled("div", {
+  shouldForwardProp: (prop) => prop !== "propertyWidth" && prop !== "propertyHeight" && prop !== "isForm"
+})(({
+  propertyWidth,
+  isForm,
+  theme
+}) => ({
+  display: "grid",
+  gridTemplateColumns: "1fr",
+  alignItems: "flex-start",
+  width: "100%",
+  padding: `${theme.spacing(1)} ${theme.spacing(2)}`,
+  ":hover": {
+    backgroundColor: isForm ? "unset" : theme.palette.grid?.rowHover
+  },
+  borderBottom: isForm ? "none" : `1px solid ${theme.palette.divider}`,
+  flexDirection: "column",
+  [theme.breakpoints.up("sm")]: {
+    gridTemplateColumns: propertyWidth ? `${propertyWidth}px 1fr` : "150px 1fr",
+    gap: theme.spacing(2),
+    alignItems: "center"
+  }
+}));
+const Property = styled("div", {
+  shouldForwardProp: (prop) => prop !== "propertyWidth" && prop !== "propertyHeight" && prop !== "isForm"
+})(({
+  propertyWidth,
+  isForm,
+  theme
+}) => ({
+  width: "100%",
+  minWidth: "100%",
+  ...theme.typography.subtitle2,
+  color: theme.palette.text.primary,
+  height: "100%",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "flex-start",
+  position: "relative",
+  [theme.breakpoints.up("sm")]: {
+    borderRight: isForm ? "none" : `1px solid ${theme.palette.divider}`,
+    paddingRight: theme.spacing(2),
+    textAlign: "right",
+    width: propertyWidth || "150px",
+    minWidth: propertyWidth || "150px",
+    justifyContent: "flex-end"
+  },
+  overflow: "hidden",
+  overflowWrap: "break-word"
+}));
+const Value = styled("div", {
+  shouldForwardProp: (prop) => prop !== "valueWidth" && prop !== "valueHeight" && prop !== "withGrid"
+})(({
+  valueWidth,
+  valueHeight,
+  theme
+}) => ({
+  flexGrow: "1",
+  ...theme.typography.body2,
+  color: theme.palette.text.secondary,
+  position: "relative",
+  padding: "1px",
+  maxWidth: `${valueWidth}%`,
+  width: `${valueWidth}%`,
+  height: valueHeight,
+  marginTop: theme.spacing(1),
+  [theme.breakpoints.up("sm")]: {
+    marginTop: "0px"
+  },
+  overflow: "auto",
+  overflowWrap: "break-word"
+}));
+const SKTWrapperProperty = styled("div")(() => ({
+  display: "flex",
+  justifyContent: "flex-end"
+}));
+function SKTProperty() {
+  return /* @__PURE__ */ jsx(SKTWrapperProperty, {
+    children: /* @__PURE__ */ jsx(Skeleton, {
+      variant: "text",
+      width: 68,
+      height: 14
+    })
+  });
+}
+function PropertyValue(props) {
+  const {
+    property,
+    value,
+    propertyWidth = 200,
+    valueHeight = "auto",
+    valueWidth = "100",
+    valueWidthMobile,
+    isForm
+  } = props;
+  const isDesktop = useResponsiveDesktop();
+  const isSkeleton = useModuleSkeleton();
+  const getValueW = () => {
+    if (valueWidthMobile && !isDesktop) {
+      return valueWidthMobile;
+    }
+    if (valueWidth === 75 && isDesktop) {
+      return 75;
+    } else if (valueWidth === 75 && !isDesktop) {
+      return 100;
+    }
+    if (valueWidth === 50 && isDesktop) {
+      return 50;
+    } else if (valueWidth === 50 && !isDesktop) {
+      return 100;
+    }
+    if (valueWidth === 25 && isDesktop || valueWidth === 12.5 && isDesktop) {
+      return valueWidth;
+    }
+    if (valueWidth === 25 && !isDesktop) {
+      return 50;
+    }
+    if (valueWidth === 12.5 && !isDesktop) {
+      return 25;
+    }
+    return 100;
+  };
+  return /* @__PURE__ */ jsxs(WrapperPropertyValue, {
+    id: "WrapperPropertyValue",
+    isForm,
+    propertyWidth,
+    children: [/* @__PURE__ */ jsx(Property, {
+      id: "Property",
+      isForm,
+      propertyWidth,
+      children: isSkeleton ? /* @__PURE__ */ jsx(SKTProperty, {}) : property
+    }), /* @__PURE__ */ jsx(Value, {
+      id: "Value",
+      valueWidth: getValueW(),
+      valueHeight,
+      children: value
+    })]
+  });
+}
+export {
+  PropertyValue as P
+};

package/components/PropertyValue/skeleton.d.ts

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

package/components/PropertyValue/styles.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { WrapperValueProps } from './types';
+export declare const WrapperPropertyValue: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & import("./types").PropertyProps & Pick<import("./types").PropertyValueProps, "isForm">, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Property: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & import("./types").PropertyProps & Pick<import("./types").PropertyValueProps, "isForm">, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Value: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & WrapperValueProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const SKTWrapperProperty: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/PropertyValue/types.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from 'react';
+export interface PropertyProps {
+    propertyWidth?: number;
+}
+export interface ValueProps {
+    valueHeight?: number | string;
+    valueWidth?: number;
+    valueWidthMobile?: number;
+}
+export interface PropertyValueProps extends PropertyProps, ValueProps {
+    property: string;
+    value: number | string | ReactNode;
+    isForm?: boolean;
+}
+export declare type WrapperProps = PropertyProps & Pick<PropertyValueProps, 'isForm'>;
+export declare type WrapperPropertyProps = WrapperProps;
+export declare type WrapperValueProps = Omit<ValueProps, 'valueWidthMobile'>;

package/components/Resizeable/index.c96c0f09.js

@@ -0,0 +1,96 @@
+import { styled } from "@mui/material/styles";
+import { R as ResizableBox } from "../../react-resizable.1d00271d.js";
+import { jsx } from "react/jsx-runtime";
+const WrapperResizeable = styled(ResizableBox)(({
+  theme
+}) => ({
+  "&.react-resizable": {
+    position: "relative",
+    width: "100%",
+    height: "100%"
+  },
+  "& .react-resizable-handle": {
+    position: "absolute",
+    width: "20px",
+    height: "20px",
+    margin: "4px",
+    backgroundRepeat: "no-repeat",
+    backgroundOrigin: "content-box",
+    boxSizing: "border-box",
+    backgroundColor: theme.palette.action.active,
+    mask: `url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' focusable='false' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='enable-background:new 0 0 24 24;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;%7D%0A%3C/style%3E%3Cg id='Grupo_5256'%3E%3C/g%3E%3Cpath class='st0' d='z'/%3E%3Cg%3E%3Cpolygon points='21.9,21.9 15.8,21.9 15.8,19.9 19.9,19.9 19.9,15.9 21.9,15.9 '/%3E%3C/g%3E%3C/svg%3E%0A")`,
+    backgroundImage: `url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 26.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' focusable='false' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='enable-background:new 0 0 24 24;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;%7D%0A%3C/style%3E%3Cg id='Grupo_5256'%3E%3C/g%3E%3Cpath class='st0' d='z'/%3E%3Cg%3E%3Cpolygon points='21.9,21.9 15.8,21.9 15.8,19.9 19.9,19.9 19.9,15.9 21.9,15.9 '/%3E%3C/g%3E%3C/svg%3E%0A")`,
+    backgroundPosition: "bottom right",
+    padding: "0 3px 3px 0"
+  },
+  "& .react-resizable-handle-sw": {
+    bottom: "0",
+    left: "0",
+    cursor: "sw-resize",
+    transform: "rotate(90deg)"
+  },
+  ".react-resizable-handle-se": {
+    bottom: "0",
+    right: "0",
+    cursor: "se-resize"
+  },
+  "& .react-resizable-handle-nw": {
+    top: "0",
+    left: "0",
+    cursor: "nw-resize",
+    transform: "rotate(180deg)"
+  },
+  "& .react-resizable-handle-ne": {
+    top: "0",
+    right: "0",
+    cursor: "ne-resize",
+    transform: "rotate(270deg)"
+  },
+  "& .react-resizable-handle-w, .react-resizable-handle-e": {
+    top: "50%",
+    marginTop: "-10px",
+    cursor: "ew-resize"
+  },
+  "& .react-resizable-handle-w": {
+    left: "0",
+    transform: "rotate(135deg)"
+  },
+  "& .react-resizable-handle-e": {
+    right: "0",
+    transform: "rotate(315deg) "
+  },
+  "& .react-resizable-handle-n,.react-resizable-handle-s": {
+    left: "50%",
+    marginLeft: "-10px",
+    cursor: "ns-resize"
+  },
+  "& .react-resizable-handle-n": {
+    top: "0",
+    transform: "rotate(225deg)"
+  },
+  "& .react-resizable-handle-s": {
+    bottom: "0",
+    transform: "rotate(45deg)"
+  }
+}));
+function ResizeableWindow(props) {
+  const {
+    children,
+    width = 200,
+    height = 200,
+    maxHeigth,
+    maxWidth,
+    ...other
+  } = props;
+  return /* @__PURE__ */ jsx(WrapperResizeable, {
+    width,
+    height,
+    maxConstraints: maxHeigth && maxWidth ? [maxWidth, maxHeigth] : void 0,
+    resizeHandles: ["se", "nw"],
+    ...other,
+    children
+  });
+}
+export {
+  ResizeableWindow as R
+};

package/components/ResizeableWindow/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ResizeableProps } from './types';
+export declare function ResizeableWindow(props: ResizeableProps): JSX.Element;

package/components/ResizeableWindow/styles.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { ResizableBox } from 'react-resizable';
+export declare const WrapperResizeable: import("@emotion/styled").StyledComponent<import("react-resizable").ResizableBoxProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {
+    ref?: import("react").Ref<ResizableBox> | undefined;
+}>;

package/components/ResizeableWindow/types.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { ResizableBoxProps } from 'react-resizable';
+declare type InternalResizeableProps = {
+    children: ReactNode;
+    width?: number;
+    height?: number;
+    maxWidth?: number;
+    maxHeigth?: number;
+};
+export declare type ResizeableProps = InternalResizeableProps & Partial<ResizableBoxProps>;
+export {};

package/components/ScrollBar/index.39eeb2de.js

@@ -0,0 +1,54 @@
+import SimpleBarReact from "simplebar-react";
+import { styled, alpha } from "@mui/material/styles";
+import { Box } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+const RootStyle = styled("div")(() => ({
+  flexGrow: 1,
+  height: "100%",
+  overflow: "hidden"
+}));
+const SimpleBarStyle = styled(SimpleBarReact)(({
+  theme
+}) => ({
+  maxHeight: "100%",
+  "& .simplebar-scrollbar": {
+    "&:before": {
+      backgroundColor: alpha(theme.palette.grey[600], 0.48)
+    },
+    "&.simplebar-visible:before": {
+      opacity: 1
+    }
+  },
+  "& .simplebar-track.simplebar-vertical": {
+    width: 10
+  },
+  "& .simplebar-track.simplebar-horizontal .simplebar-scrollbar": {
+    height: 6
+  },
+  "& .simplebar-mask": {
+    zIndex: "inherit"
+  }
+}));
+function ScrollBar({
+  children
+}) {
+  const userAgent = typeof navigator === "undefined" ? "SSR" : navigator.userAgent;
+  const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent);
+  if (isMobile) {
+    return /* @__PURE__ */ jsx(Box, {
+      sx: {
+        overflowX: "auto"
+      },
+      children
+    });
+  }
+  return /* @__PURE__ */ jsx(RootStyle, {
+    children: /* @__PURE__ */ jsx(SimpleBarStyle, {
+      autoHide: false,
+      children
+    })
+  });
+}
+export {
+  ScrollBar as S
+};

package/components/ScrollBar/index.d.ts

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+interface Props {
+    children?: ReactElement;
+}
+export declare function ScrollBar({ children }: Props): JSX.Element;
+export default ScrollBar;

package/components/ScrollToTop/index.d.ts

@@ -0,0 +1 @@
+export declare function ScrollToTop(): null;