@soyfri/shared-library 4.0.4 → 4.1.0

package/EmptyState-DJj9KOEy.cjs

@@ -1,47 +0,0 @@
-"use strict";
-const jsxRuntime = require("react/jsx-runtime");
-const material = require("@mui/material");
-const resolvePreset = require("./resolvePreset-CxTI6_Ln.cjs");
-function EmptyState({
-  title,
-  message,
-  icon,
-  action,
-  preset,
-  sx,
-  className,
-  "data-testid": dataTestId
-}) {
-  const theme = material.useTheme();
-  const presetSx = resolvePreset.resolvePreset("EmptyState", preset, theme);
-  const rootSx = [
-    {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      justifyContent: "center",
-      py: 8,
-      px: 3,
-      textAlign: "center",
-      color: "text.secondary"
-    },
-    ...presetSx ? [presetSx] : [],
-    ...Array.isArray(sx) ? sx : sx ? [sx] : []
-  ];
-  return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: rootSx, className, "data-testid": dataTestId, children: [
-    icon,
-    /* @__PURE__ */ jsxRuntime.jsx(
-      material.Typography,
-      {
-        variant: "subtitle1",
-        className: "fri-EmptyState-title",
-        sx: { fontWeight: 600, color: "text.primary", mt: icon ? 2 : 0 },
-        children: title
-      }
-    ),
-    message && /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", className: "fri-EmptyState-message", sx: { mt: 0.5 }, children: message }),
-    action && /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { mt: 3 }, children: action })
-  ] });
-}
-exports.EmptyState = EmptyState;
-//# sourceMappingURL=EmptyState-DJj9KOEy.cjs.map

package/EmptyState-DJj9KOEy.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"EmptyState-DJj9KOEy.cjs","sources":["../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import { type ReactNode } from 'react';\nimport { Box, Typography, useTheme } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nimport { resolvePreset } from '../_shared/resolvePreset';\n\nexport interface EmptyStateProps {\n  /** Qué falta, en positivo: \"Sin dispositivos registrados\". */\n  title: string;\n  /** Línea secundaria opcional: qué puede hacer el usuario. */\n  message?: string;\n  /** Icono o ilustración arriba del título. */\n  icon?: ReactNode;\n  /** Acción opcional (botón) debajo del mensaje. */\n  action?: ReactNode;\n  /** Preset registrado en `theme.styles.EmptyState`. */\n  preset?: string;\n  sx?: SxProps<Theme>;\n  className?: string;\n  'data-testid'?: string;\n}\n\n/**\n * Estado vacío centrado, para usar dentro de una card, un tab o una tabla sin\n * resultados. Color y tipografía salen del theme del consumidor: no hay\n * hex ni tamaños hardcodeados.\n */\nexport function EmptyState({\n  title,\n  message,\n  icon,\n  action,\n  preset,\n  sx,\n  className,\n  'data-testid': dataTestId,\n}: EmptyStateProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('EmptyState', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      justifyContent: 'center',\n      py: 8,\n      px: 3,\n      textAlign: 'center',\n      color: 'text.secondary',\n    },\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ] as SxProps<Theme>;\n\n  return (\n    <Box sx={rootSx} className={className} data-testid={dataTestId}>\n      {icon}\n      <Typography\n        variant=\"subtitle1\"\n        className=\"fri-EmptyState-title\"\n        sx={{ fontWeight: 600, color: 'text.primary', mt: icon ? 2 : 0 }}\n      >\n        {title}\n      </Typography>\n      {message && (\n        <Typography variant=\"body2\" className=\"fri-EmptyState-message\" sx={{ mt: 0.5 }}>\n          {message}\n        </Typography>\n      )}\n      {action && <Box sx={{ mt: 3 }}>{action}</Box>}\n    </Box>\n  );\n}\n\nexport default EmptyState;\n"],"names":["useTheme","resolvePreset","Box","jsx","Typography"],"mappings":";;;;AA2BO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAAoB;AAClB,QAAM,QAAQA,SAAAA,SAAA;AACd,QAAM,WAAWC,cAAAA,cAAc,cAAc,QAAQ,KAAK;AAE1D,QAAM,SAAyB;AAAA,IAC7B;AAAA,MACE,SAAS;AAAA,MACT,eAAe;AAAA,MACf,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,WAAW;AAAA,MACX,OAAO;AAAA,IAAA;AAAA,IAET,GAAI,WAAW,CAAC,QAAQ,IAAI,CAAA;AAAA,IAC5B,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC;AAG5C,yCACGC,SAAAA,KAAA,EAAI,IAAI,QAAQ,WAAsB,eAAa,YACjD,UAAA;AAAA,IAAA;AAAA,IACDC,2BAAAA;AAAAA,MAACC,SAAAA;AAAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,IAAI,EAAE,YAAY,KAAK,OAAO,gBAAgB,IAAI,OAAO,IAAI,EAAA;AAAA,QAE5D,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,WACCD,2BAAAA,IAACC,SAAAA,YAAA,EAAW,SAAQ,SAAQ,WAAU,0BAAyB,IAAI,EAAE,IAAI,IAAA,GACtE,UAAA,QAAA,CACH;AAAA,IAED,yCAAWF,SAAAA,KAAA,EAAI,IAAI,EAAE,IAAI,EAAA,GAAM,UAAA,OAAA,CAAO;AAAA,EAAA,GACzC;AAEJ;;"}

package/EmptyState-kEoDkg1B.js

@@ -1,48 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useTheme, Box, Typography } from "@mui/material";
-import { r as resolvePreset } from "./resolvePreset-K6_BfWHD.js";
-function EmptyState({
-  title,
-  message,
-  icon,
-  action,
-  preset,
-  sx,
-  className,
-  "data-testid": dataTestId
-}) {
-  const theme = useTheme();
-  const presetSx = resolvePreset("EmptyState", preset, theme);
-  const rootSx = [
-    {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      justifyContent: "center",
-      py: 8,
-      px: 3,
-      textAlign: "center",
-      color: "text.secondary"
-    },
-    ...presetSx ? [presetSx] : [],
-    ...Array.isArray(sx) ? sx : sx ? [sx] : []
-  ];
-  return /* @__PURE__ */ jsxs(Box, { sx: rootSx, className, "data-testid": dataTestId, children: [
-    icon,
-    /* @__PURE__ */ jsx(
-      Typography,
-      {
-        variant: "subtitle1",
-        className: "fri-EmptyState-title",
-        sx: { fontWeight: 600, color: "text.primary", mt: icon ? 2 : 0 },
-        children: title
-      }
-    ),
-    message && /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "fri-EmptyState-message", sx: { mt: 0.5 }, children: message }),
-    action && /* @__PURE__ */ jsx(Box, { sx: { mt: 3 }, children: action })
-  ] });
-}
-export {
-  EmptyState as E
-};
-//# sourceMappingURL=EmptyState-kEoDkg1B.js.map

package/EmptyState-kEoDkg1B.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"EmptyState-kEoDkg1B.js","sources":["../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import { type ReactNode } from 'react';\nimport { Box, Typography, useTheme } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material/styles';\n\nimport { resolvePreset } from '../_shared/resolvePreset';\n\nexport interface EmptyStateProps {\n  /** Qué falta, en positivo: \"Sin dispositivos registrados\". */\n  title: string;\n  /** Línea secundaria opcional: qué puede hacer el usuario. */\n  message?: string;\n  /** Icono o ilustración arriba del título. */\n  icon?: ReactNode;\n  /** Acción opcional (botón) debajo del mensaje. */\n  action?: ReactNode;\n  /** Preset registrado en `theme.styles.EmptyState`. */\n  preset?: string;\n  sx?: SxProps<Theme>;\n  className?: string;\n  'data-testid'?: string;\n}\n\n/**\n * Estado vacío centrado, para usar dentro de una card, un tab o una tabla sin\n * resultados. Color y tipografía salen del theme del consumidor: no hay\n * hex ni tamaños hardcodeados.\n */\nexport function EmptyState({\n  title,\n  message,\n  icon,\n  action,\n  preset,\n  sx,\n  className,\n  'data-testid': dataTestId,\n}: EmptyStateProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('EmptyState', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      justifyContent: 'center',\n      py: 8,\n      px: 3,\n      textAlign: 'center',\n      color: 'text.secondary',\n    },\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ] as SxProps<Theme>;\n\n  return (\n    <Box sx={rootSx} className={className} data-testid={dataTestId}>\n      {icon}\n      <Typography\n        variant=\"subtitle1\"\n        className=\"fri-EmptyState-title\"\n        sx={{ fontWeight: 600, color: 'text.primary', mt: icon ? 2 : 0 }}\n      >\n        {title}\n      </Typography>\n      {message && (\n        <Typography variant=\"body2\" className=\"fri-EmptyState-message\" sx={{ mt: 0.5 }}>\n          {message}\n        </Typography>\n      )}\n      {action && <Box sx={{ mt: 3 }}>{action}</Box>}\n    </Box>\n  );\n}\n\nexport default EmptyState;\n"],"names":[],"mappings":";;;AA2BO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAAoB;AAClB,QAAM,QAAQ,SAAA;AACd,QAAM,WAAW,cAAc,cAAc,QAAQ,KAAK;AAE1D,QAAM,SAAyB;AAAA,IAC7B;AAAA,MACE,SAAS;AAAA,MACT,eAAe;AAAA,MACf,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,WAAW;AAAA,MACX,OAAO;AAAA,IAAA;AAAA,IAET,GAAI,WAAW,CAAC,QAAQ,IAAI,CAAA;AAAA,IAC5B,GAAI,MAAM,QAAQ,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,IAAI,CAAA;AAAA,EAAC;AAG5C,8BACG,KAAA,EAAI,IAAI,QAAQ,WAAsB,eAAa,YACjD,UAAA;AAAA,IAAA;AAAA,IACD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,IAAI,EAAE,YAAY,KAAK,OAAO,gBAAgB,IAAI,OAAO,IAAI,EAAA;AAAA,QAE5D,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,WACC,oBAAC,YAAA,EAAW,SAAQ,SAAQ,WAAU,0BAAyB,IAAI,EAAE,IAAI,IAAA,GACtE,UAAA,QAAA,CACH;AAAA,IAED,8BAAW,KAAA,EAAI,IAAI,EAAE,IAAI,EAAA,GAAM,UAAA,OAAA,CAAO;AAAA,EAAA,GACzC;AAEJ;"}

package/Flyout-DCcDBYKT.js

@@ -1,117 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
-import { Drawer, Box, Typography, IconButton, Divider } from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-const Flyout = ({
-  open,
-  onClose,
-  title,
-  anchor = "right",
-  children,
-  size = "medium",
-  // Default size: 'medium'
-  height = "auto"
-}) => {
-  const getWidthBySize = (flyoutSize) => {
-    const baseMultiplier = 1.15;
-    switch (flyoutSize) {
-      case "small":
-        return Math.round(300 * baseMultiplier);
-      // ~345px
-      case "medium":
-        return Math.round(450 * baseMultiplier);
-      // ~518px (rounded)
-      case "large":
-        return Math.round(600 * baseMultiplier);
-      // ~690px
-      default:
-        return Math.round(450 * baseMultiplier);
-    }
-  };
-  const calculatedWidth = getWidthBySize(size);
-  const contentStyle = useMemo(() => {
-    if (anchor === "left" || anchor === "right") {
-      return { width: calculatedWidth };
-    } else {
-      return { height, width: "100%" };
-    }
-  }, [anchor, calculatedWidth, height]);
-  return /* @__PURE__ */ jsx(
-    Drawer,
-    {
-      anchor,
-      open,
-      onClose,
-      disableEscapeKeyDown: false,
-      ModalProps: {
-        // Keep mounted for better performance if content is complex or needs to retain state
-        keepMounted: true
-      },
-      children: /* @__PURE__ */ jsxs(
-        Box,
-        {
-          sx: __spreadProps(__spreadValues({}, contentStyle), {
-            // Apply calculated width/height
-            display: "flex",
-            flexDirection: "column",
-            p: 2,
-            // Padding around the content
-            backgroundColor: (theme) => theme.palette.background.paper,
-            // Use theme background color
-            color: (theme) => theme.palette.text.primary,
-            // Use theme text color
-            height: "100%"
-            // Ensure the main container of the Drawer takes full height
-          }),
-          role: "presentation",
-          children: [
-            /* @__PURE__ */ jsxs(
-              Box,
-              {
-                sx: {
-                  display: "flex",
-                  justifyContent: "space-between",
-                  alignItems: "center",
-                  mb: 2,
-                  // Margin bottom for separation from content
-                  flexShrink: 0
-                  // Prevent the header from shrinking when content scrolls
-                },
-                children: [
-                  title && /* @__PURE__ */ jsx(Typography, { variant: "h6", component: "div", sx: { fontWeight: "bold" }, children: title }),
-                  /* @__PURE__ */ jsx(IconButton, { onClick: onClose, sx: { ml: "auto" }, children: /* @__PURE__ */ jsx(CloseIcon, {}) })
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsx(Divider, { sx: { mb: 2 } }),
-            " ",
-            /* @__PURE__ */ jsx(Box, { sx: { flexGrow: 1, overflowY: "auto" }, children })
-          ]
-        }
-      )
-    }
-  );
-};
-export {
-  Flyout as F
-};
-//# sourceMappingURL=Flyout-DCcDBYKT.js.map

package/Flyout-DCcDBYKT.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Flyout-DCcDBYKT.js","sources":["../src/components/Flyout/Flyout.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport {\n  Box,\n  Typography,\n  IconButton,\n  Divider,\n  Drawer,\n  List,\n  ListItem,\n  ListItemText,\n  TextField,\n  Button,\n} from '@mui/material';\nimport CloseIcon from '@mui/icons-material/Close';\n\n// Define the size types for the Flyout\ntype FlyoutSize = 'small' | 'medium' | 'large';\n\n// Define the props for the Flyout component\nexport interface FlyoutProps {\n  open: boolean;\n  onClose: () => void;\n  title?: string;\n  anchor?: 'left' | 'top' | 'right' | 'bottom';\n  children: React.ReactNode;\n  size?: FlyoutSize; // New prop for predefined size\n  height?: string | number; // Allows custom height for top/bottom anchors\n}\n\nconst Flyout: React.FC<FlyoutProps> = ({\n  open,\n  onClose,\n  title,\n  anchor = 'right',\n  children,\n  size = 'medium', // Default size: 'medium'\n  height = 'auto',\n}) => {\n  // Mapping of predefined sizes to pixel widths\n  const getWidthBySize = (flyoutSize: FlyoutSize): number => {\n    const baseMultiplier = 1.15; // 15% larger than base\n    switch (flyoutSize) {\n      case 'small':\n        return Math.round(300 * baseMultiplier); // ~345px\n      case 'medium':\n        return Math.round(450 * baseMultiplier); // ~518px (rounded)\n      case 'large':\n        return Math.round(600 * baseMultiplier); // ~690px\n      default:\n        return Math.round(450 * baseMultiplier); // Fallback, ~518px\n    }\n  };\n\n  // Calculate width based on size prop for left/right anchors\n  const calculatedWidth = getWidthBySize(size);\n\n  // Determine the style for the content box based on anchor\n  const contentStyle = useMemo(() => {\n    if (anchor === 'left' || anchor === 'right') {\n      return { width: calculatedWidth }; // Use the calculated width\n    } else {\n      // For 'top' or 'bottom' anchors, width is 100% and height is controlled\n      return { height: height, width: '100%' };\n    }\n  }, [anchor, calculatedWidth, height]);\n\n  return (\n    <Drawer\n      anchor={anchor}\n      open={open}\n      onClose={onClose}\n      // Allows closing with Escape key, but prevents closing by clicking outside if ModalProps.disableBackdropClick is true\n      disableEscapeKeyDown={false}\n      ModalProps={{\n        // Keep mounted for better performance if content is complex or needs to retain state\n        keepMounted: true,\n      }}\n    >\n      <Box\n        sx={{\n          ...contentStyle, // Apply calculated width/height\n          display: 'flex',\n          flexDirection: 'column',\n          p: 2, // Padding around the content\n          backgroundColor: (theme) => theme.palette.background.paper, // Use theme background color\n          color: (theme) => theme.palette.text.primary, // Use theme text color\n          height: '100%', // Ensure the main container of the Drawer takes full height\n        }}\n        role=\"presentation\" // ARIA role for accessibility\n      >\n        {/* Header section with title and close button */}\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            alignItems: 'center',\n            mb: 2, // Margin bottom for separation from content\n            flexShrink: 0, // Prevent the header from shrinking when content scrolls\n          }}\n        >\n          {title && (\n            <Typography variant=\"h6\" component=\"div\" sx={{ fontWeight: 'bold' }}>\n              {title}\n            </Typography>\n          )}\n          <IconButton onClick={onClose} sx={{ ml: 'auto' }}>\n            <CloseIcon />\n          </IconButton>\n        </Box>\n\n        <Divider sx={{ mb: 2 }} /> {/* Separator line */}\n\n        {/* Scrollable content area */}\n        <Box sx={{ flexGrow: 1, overflowY: 'auto' }}>\n          {children}\n        </Box>\n      </Box>\n    </Drawer>\n  );\n};\n\nexport default Flyout;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAM,SAAgC,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,OAAO;AAAA;AAAA,EACP,SAAS;AACX,MAAM;AAEJ,QAAM,iBAAiB,CAAC,eAAmC;AACzD,UAAM,iBAAiB;AACvB,YAAQ,YAAA;AAAA,MACN,KAAK;AACH,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA;AAAA,MACxC,KAAK;AACH,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA;AAAA,MACxC,KAAK;AACH,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA;AAAA,MACxC;AACE,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA,IAAA;AAAA,EAE5C;AAGA,QAAM,kBAAkB,eAAe,IAAI;AAG3C,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,WAAW,UAAU,WAAW,SAAS;AAC3C,aAAO,EAAE,OAAO,gBAAA;AAAA,IAClB,OAAO;AAEL,aAAO,EAAE,QAAgB,OAAO,OAAA;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,QAAQ,iBAAiB,MAAM,CAAC;AAEpC,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MAEA,sBAAsB;AAAA,MACtB,YAAY;AAAA;AAAA,QAEV,aAAa;AAAA,MAAA;AAAA,MAGf,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI,iCACC,eADD;AAAA;AAAA,YAEF,SAAS;AAAA,YACT,eAAe;AAAA,YACf,GAAG;AAAA;AAAA,YACH,iBAAiB,CAAC,UAAU,MAAM,QAAQ,WAAW;AAAA;AAAA,YACrD,OAAO,CAAC,UAAU,MAAM,QAAQ,KAAK;AAAA;AAAA,YACrC,QAAQ;AAAA;AAAA,UAAA;AAAA,UAEV,MAAK;AAAA,UAGL,UAAA;AAAA,YAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,IAAI;AAAA,kBACF,SAAS;AAAA,kBACT,gBAAgB;AAAA,kBAChB,YAAY;AAAA,kBACZ,IAAI;AAAA;AAAA,kBACJ,YAAY;AAAA;AAAA,gBAAA;AAAA,gBAGb,UAAA;AAAA,kBAAA,SACC,oBAAC,YAAA,EAAW,SAAQ,MAAK,WAAU,OAAM,IAAI,EAAE,YAAY,OAAA,GACxD,UAAA,MAAA,CACH;AAAA,kBAEF,oBAAC,YAAA,EAAW,SAAS,SAAS,IAAI,EAAE,IAAI,OAAA,GACtC,UAAA,oBAAC,WAAA,CAAA,CAAU,EAAA,CACb;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,gCAGD,SAAA,EAAQ,IAAI,EAAE,IAAI,KAAK;AAAA,YAAE;AAAA,YAG1B,oBAAC,OAAI,IAAI,EAAE,UAAU,GAAG,WAAW,OAAA,GAChC,SAAA,CACH;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;"}

package/Flyout-fycujUVf.cjs

@@ -1,116 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const material = require("@mui/material");
-const CloseIcon = require("@mui/icons-material/Close");
-const Flyout = ({
-  open,
-  onClose,
-  title,
-  anchor = "right",
-  children,
-  size = "medium",
-  // Default size: 'medium'
-  height = "auto"
-}) => {
-  const getWidthBySize = (flyoutSize) => {
-    const baseMultiplier = 1.15;
-    switch (flyoutSize) {
-      case "small":
-        return Math.round(300 * baseMultiplier);
-      // ~345px
-      case "medium":
-        return Math.round(450 * baseMultiplier);
-      // ~518px (rounded)
-      case "large":
-        return Math.round(600 * baseMultiplier);
-      // ~690px
-      default:
-        return Math.round(450 * baseMultiplier);
-    }
-  };
-  const calculatedWidth = getWidthBySize(size);
-  const contentStyle = React.useMemo(() => {
-    if (anchor === "left" || anchor === "right") {
-      return { width: calculatedWidth };
-    } else {
-      return { height, width: "100%" };
-    }
-  }, [anchor, calculatedWidth, height]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    material.Drawer,
-    {
-      anchor,
-      open,
-      onClose,
-      disableEscapeKeyDown: false,
-      ModalProps: {
-        // Keep mounted for better performance if content is complex or needs to retain state
-        keepMounted: true
-      },
-      children: /* @__PURE__ */ jsxRuntime.jsxs(
-        material.Box,
-        {
-          sx: __spreadProps(__spreadValues({}, contentStyle), {
-            // Apply calculated width/height
-            display: "flex",
-            flexDirection: "column",
-            p: 2,
-            // Padding around the content
-            backgroundColor: (theme) => theme.palette.background.paper,
-            // Use theme background color
-            color: (theme) => theme.palette.text.primary,
-            // Use theme text color
-            height: "100%"
-            // Ensure the main container of the Drawer takes full height
-          }),
-          role: "presentation",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              material.Box,
-              {
-                sx: {
-                  display: "flex",
-                  justifyContent: "space-between",
-                  alignItems: "center",
-                  mb: 2,
-                  // Margin bottom for separation from content
-                  flexShrink: 0
-                  // Prevent the header from shrinking when content scrolls
-                },
-                children: [
-                  title && /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "h6", component: "div", sx: { fontWeight: "bold" }, children: title }),
-                  /* @__PURE__ */ jsxRuntime.jsx(material.IconButton, { onClick: onClose, sx: { ml: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon, {}) })
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(material.Divider, { sx: { mb: 2 } }),
-            " ",
-            /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { flexGrow: 1, overflowY: "auto" }, children })
-          ]
-        }
-      )
-    }
-  );
-};
-exports.Flyout = Flyout;
-//# sourceMappingURL=Flyout-fycujUVf.cjs.map

package/Flyout-fycujUVf.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Flyout-fycujUVf.cjs","sources":["../src/components/Flyout/Flyout.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport {\n  Box,\n  Typography,\n  IconButton,\n  Divider,\n  Drawer,\n  List,\n  ListItem,\n  ListItemText,\n  TextField,\n  Button,\n} from '@mui/material';\nimport CloseIcon from '@mui/icons-material/Close';\n\n// Define the size types for the Flyout\ntype FlyoutSize = 'small' | 'medium' | 'large';\n\n// Define the props for the Flyout component\nexport interface FlyoutProps {\n  open: boolean;\n  onClose: () => void;\n  title?: string;\n  anchor?: 'left' | 'top' | 'right' | 'bottom';\n  children: React.ReactNode;\n  size?: FlyoutSize; // New prop for predefined size\n  height?: string | number; // Allows custom height for top/bottom anchors\n}\n\nconst Flyout: React.FC<FlyoutProps> = ({\n  open,\n  onClose,\n  title,\n  anchor = 'right',\n  children,\n  size = 'medium', // Default size: 'medium'\n  height = 'auto',\n}) => {\n  // Mapping of predefined sizes to pixel widths\n  const getWidthBySize = (flyoutSize: FlyoutSize): number => {\n    const baseMultiplier = 1.15; // 15% larger than base\n    switch (flyoutSize) {\n      case 'small':\n        return Math.round(300 * baseMultiplier); // ~345px\n      case 'medium':\n        return Math.round(450 * baseMultiplier); // ~518px (rounded)\n      case 'large':\n        return Math.round(600 * baseMultiplier); // ~690px\n      default:\n        return Math.round(450 * baseMultiplier); // Fallback, ~518px\n    }\n  };\n\n  // Calculate width based on size prop for left/right anchors\n  const calculatedWidth = getWidthBySize(size);\n\n  // Determine the style for the content box based on anchor\n  const contentStyle = useMemo(() => {\n    if (anchor === 'left' || anchor === 'right') {\n      return { width: calculatedWidth }; // Use the calculated width\n    } else {\n      // For 'top' or 'bottom' anchors, width is 100% and height is controlled\n      return { height: height, width: '100%' };\n    }\n  }, [anchor, calculatedWidth, height]);\n\n  return (\n    <Drawer\n      anchor={anchor}\n      open={open}\n      onClose={onClose}\n      // Allows closing with Escape key, but prevents closing by clicking outside if ModalProps.disableBackdropClick is true\n      disableEscapeKeyDown={false}\n      ModalProps={{\n        // Keep mounted for better performance if content is complex or needs to retain state\n        keepMounted: true,\n      }}\n    >\n      <Box\n        sx={{\n          ...contentStyle, // Apply calculated width/height\n          display: 'flex',\n          flexDirection: 'column',\n          p: 2, // Padding around the content\n          backgroundColor: (theme) => theme.palette.background.paper, // Use theme background color\n          color: (theme) => theme.palette.text.primary, // Use theme text color\n          height: '100%', // Ensure the main container of the Drawer takes full height\n        }}\n        role=\"presentation\" // ARIA role for accessibility\n      >\n        {/* Header section with title and close button */}\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            alignItems: 'center',\n            mb: 2, // Margin bottom for separation from content\n            flexShrink: 0, // Prevent the header from shrinking when content scrolls\n          }}\n        >\n          {title && (\n            <Typography variant=\"h6\" component=\"div\" sx={{ fontWeight: 'bold' }}>\n              {title}\n            </Typography>\n          )}\n          <IconButton onClick={onClose} sx={{ ml: 'auto' }}>\n            <CloseIcon />\n          </IconButton>\n        </Box>\n\n        <Divider sx={{ mb: 2 }} /> {/* Separator line */}\n\n        {/* Scrollable content area */}\n        <Box sx={{ flexGrow: 1, overflowY: 'auto' }}>\n          {children}\n        </Box>\n      </Box>\n    </Drawer>\n  );\n};\n\nexport default Flyout;\n"],"names":["useMemo","jsx","Drawer","jsxs","Box","Typography","IconButton","Divider"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAM,SAAgC,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,OAAO;AAAA;AAAA,EACP,SAAS;AACX,MAAM;AAEJ,QAAM,iBAAiB,CAAC,eAAmC;AACzD,UAAM,iBAAiB;AACvB,YAAQ,YAAA;AAAA,MACN,KAAK;AACH,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA;AAAA,MACxC,KAAK;AACH,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA;AAAA,MACxC,KAAK;AACH,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA;AAAA,MACxC;AACE,eAAO,KAAK,MAAM,MAAM,cAAc;AAAA,IAAA;AAAA,EAE5C;AAGA,QAAM,kBAAkB,eAAe,IAAI;AAG3C,QAAM,eAAeA,MAAAA,QAAQ,MAAM;AACjC,QAAI,WAAW,UAAU,WAAW,SAAS;AAC3C,aAAO,EAAE,OAAO,gBAAA;AAAA,IAClB,OAAO;AAEL,aAAO,EAAE,QAAgB,OAAO,OAAA;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,QAAQ,iBAAiB,MAAM,CAAC;AAEpC,SACEC,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MAEA,sBAAsB;AAAA,MACtB,YAAY;AAAA;AAAA,QAEV,aAAa;AAAA,MAAA;AAAA,MAGf,UAAAC,2BAAAA;AAAAA,QAACC,SAAAA;AAAAA,QAAA;AAAA,UACC,IAAI,iCACC,eADD;AAAA;AAAA,YAEF,SAAS;AAAA,YACT,eAAe;AAAA,YACf,GAAG;AAAA;AAAA,YACH,iBAAiB,CAAC,UAAU,MAAM,QAAQ,WAAW;AAAA;AAAA,YACrD,OAAO,CAAC,UAAU,MAAM,QAAQ,KAAK;AAAA;AAAA,YACrC,QAAQ;AAAA;AAAA,UAAA;AAAA,UAEV,MAAK;AAAA,UAGL,UAAA;AAAA,YAAAD,2BAAAA;AAAAA,cAACC,SAAAA;AAAAA,cAAA;AAAA,gBACC,IAAI;AAAA,kBACF,SAAS;AAAA,kBACT,gBAAgB;AAAA,kBAChB,YAAY;AAAA,kBACZ,IAAI;AAAA;AAAA,kBACJ,YAAY;AAAA;AAAA,gBAAA;AAAA,gBAGb,UAAA;AAAA,kBAAA,SACCH,2BAAAA,IAACI,SAAAA,YAAA,EAAW,SAAQ,MAAK,WAAU,OAAM,IAAI,EAAE,YAAY,OAAA,GACxD,UAAA,MAAA,CACH;AAAA,kBAEFJ,2BAAAA,IAACK,SAAAA,YAAA,EAAW,SAAS,SAAS,IAAI,EAAE,IAAI,OAAA,GACtC,UAAAL,2BAAAA,IAAC,WAAA,CAAA,CAAU,EAAA,CACb;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,2CAGDM,SAAAA,SAAA,EAAQ,IAAI,EAAE,IAAI,KAAK;AAAA,YAAE;AAAA,YAG1BN,+BAACG,SAAAA,OAAI,IAAI,EAAE,UAAU,GAAG,WAAW,OAAA,GAChC,SAAA,CACH;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;;"}