@soyfri/shared-library 3.2.1 → 3.3.0

package/DataRow-B7fJ5taA.js

@@ -0,0 +1,55 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTheme, Box, Typography } from "@mui/material";
+import { r as resolvePreset } from "./resolvePreset-K6_BfWHD.js";
+function DataRow({
+  label,
+  children,
+  last,
+  labelWidth = 200,
+  preset,
+  sx,
+  className,
+  "data-testid": dataTestId
+}) {
+  const theme = useTheme();
+  const presetSx = resolvePreset("DataRow", preset, theme);
+  const rootSx = [
+    {
+      display: "flex",
+      flexDirection: { xs: "column", sm: "row" },
+      alignItems: { xs: "flex-start", sm: "center" },
+      gap: { xs: 0.5, sm: 2 },
+      mb: last ? 0 : 2.5
+    },
+    ...presetSx ? [presetSx] : [],
+    ...Array.isArray(sx) ? sx : sx ? [sx] : []
+  ];
+  return /* @__PURE__ */ jsxs(Box, { sx: rootSx, className, "data-testid": dataTestId, children: [
+    /* @__PURE__ */ jsx(
+      Typography,
+      {
+        variant: "body2",
+        component: "label",
+        className: "fri-DataRow-label",
+        sx: { width: { sm: labelWidth }, flexShrink: 0, color: "text.secondary" },
+        children: label
+      }
+    ),
+    typeof children === "string" ? /* @__PURE__ */ jsx(Typography, { variant: "body1", component: "span", className: "fri-DataRow-value", children }) : (
+      // El slot de valor crece: así un Input en modo edición ocupa el ancho
+      // restante y un Chip conserva su tamaño (es inline-flex).
+      /* @__PURE__ */ jsx(
+        Box,
+        {
+          className: "fri-DataRow-value",
+          sx: { flex: 1, minWidth: 0, width: { xs: "100%", sm: "auto" } },
+          children
+        }
+      )
+    )
+  ] });
+}
+export {
+  DataRow as D
+};
+//# sourceMappingURL=DataRow-B7fJ5taA.js.map

package/DataRow-B7fJ5taA.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataRow-B7fJ5taA.js","sources":["../src/components/DataRow/DataRow.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 DataRowProps {\n  /** Etiqueta del dato (columna izquierda). */\n  label: ReactNode;\n  /** Valor: texto, o cualquier nodo (chip, link, Input en modo edición). */\n  children: ReactNode;\n  /** Última fila de un bloque: sin margen inferior. */\n  last?: boolean;\n  /**\n   * Ancho de la columna del label a partir de `sm`. Default `200`.\n   * Fijo a propósito: alinea verticalmente todos los valores de un bloque.\n   */\n  labelWidth?: number | string;\n  /** Preset registrado en `theme.styles.DataRow`. */\n  preset?: string;\n  sx?: SxProps<Theme>;\n  className?: string;\n  'data-testid'?: string;\n}\n\n/**\n * Fila label/valor — el patrón de dato para vistas de detalle.\n *\n * Geometría: label de ancho fijo + valor al lado; en móvil apila. El ancho fijo\n * (en vez de un `Grid` 4/8) evita que en una card full-width queden cientos de\n * px muertos entre label y valor.\n *\n * Tipografía: el paquete pone `body2`/`body1`. Para mapear a variantes propias\n * del consumidor, registrar un preset en el theme apuntando a las clases\n * internas:\n *\n * ```ts\n * styles: {\n *   DataRow: {\n *     default: {\n *       '& .fri-DataRow-label': { typography: 'dataLabel' },\n *       '& .fri-DataRow-value': { typography: 'dataValue' },\n *     },\n *   },\n * }\n * ```\n */\nexport function DataRow({\n  label,\n  children,\n  last,\n  labelWidth = 200,\n  preset,\n  sx,\n  className,\n  'data-testid': dataTestId,\n}: DataRowProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('DataRow', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    {\n      display: 'flex',\n      flexDirection: { xs: 'column', sm: 'row' },\n      alignItems: { xs: 'flex-start', sm: 'center' },\n      gap: { xs: 0.5, sm: 2 },\n      mb: last ? 0 : 2.5,\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      <Typography\n        variant=\"body2\"\n        component=\"label\"\n        className=\"fri-DataRow-label\"\n        sx={{ width: { sm: labelWidth }, flexShrink: 0, color: 'text.secondary' }}\n      >\n        {label}\n      </Typography>\n      {typeof children === 'string' ? (\n        <Typography variant=\"body1\" component=\"span\" className=\"fri-DataRow-value\">\n          {children}\n        </Typography>\n      ) : (\n        // El slot de valor crece: así un Input en modo edición ocupa el ancho\n        // restante y un Chip conserva su tamaño (es inline-flex).\n        <Box\n          className=\"fri-DataRow-value\"\n          sx={{ flex: 1, minWidth: 0, width: { xs: '100%', sm: 'auto' } }}\n        >\n          {children}\n        </Box>\n      )}\n    </Box>\n  );\n}\n\nexport default DataRow;\n"],"names":[],"mappings":";;;AA+CO,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAAiB;AACf,QAAM,QAAQ,SAAA;AACd,QAAM,WAAW,cAAc,WAAW,QAAQ,KAAK;AAEvD,QAAM,SAAyB;AAAA,IAC7B;AAAA,MACE,SAAS;AAAA,MACT,eAAe,EAAE,IAAI,UAAU,IAAI,MAAA;AAAA,MACnC,YAAY,EAAE,IAAI,cAAc,IAAI,SAAA;AAAA,MACpC,KAAK,EAAE,IAAI,KAAK,IAAI,EAAA;AAAA,MACpB,IAAI,OAAO,IAAI;AAAA,IAAA;AAAA,IAEjB,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,YAClD,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,WAAU;AAAA,QACV,IAAI,EAAE,OAAO,EAAE,IAAI,cAAc,YAAY,GAAG,OAAO,iBAAA;AAAA,QAEtD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,OAAO,aAAa,WACnB,oBAAC,YAAA,EAAW,SAAQ,SAAQ,WAAU,QAAO,WAAU,qBACpD,SAAA,CACH;AAAA;AAAA;AAAA,MAIA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,EAAE,IAAI,QAAQ,IAAI,OAAA,EAAO;AAAA,UAE3D;AAAA,QAAA;AAAA,MAAA;AAAA;AAAA,EACH,GAEJ;AAEJ;"}

package/DataRow-CfCaSdaJ.cjs

@@ -0,0 +1,54 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const resolvePreset = require("./resolvePreset-CxTI6_Ln.cjs");
+function DataRow({
+  label,
+  children,
+  last,
+  labelWidth = 200,
+  preset,
+  sx,
+  className,
+  "data-testid": dataTestId
+}) {
+  const theme = material.useTheme();
+  const presetSx = resolvePreset.resolvePreset("DataRow", preset, theme);
+  const rootSx = [
+    {
+      display: "flex",
+      flexDirection: { xs: "column", sm: "row" },
+      alignItems: { xs: "flex-start", sm: "center" },
+      gap: { xs: 0.5, sm: 2 },
+      mb: last ? 0 : 2.5
+    },
+    ...presetSx ? [presetSx] : [],
+    ...Array.isArray(sx) ? sx : sx ? [sx] : []
+  ];
+  return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: rootSx, className, "data-testid": dataTestId, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      material.Typography,
+      {
+        variant: "body2",
+        component: "label",
+        className: "fri-DataRow-label",
+        sx: { width: { sm: labelWidth }, flexShrink: 0, color: "text.secondary" },
+        children: label
+      }
+    ),
+    typeof children === "string" ? /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", component: "span", className: "fri-DataRow-value", children }) : (
+      // El slot de valor crece: así un Input en modo edición ocupa el ancho
+      // restante y un Chip conserva su tamaño (es inline-flex).
+      /* @__PURE__ */ jsxRuntime.jsx(
+        material.Box,
+        {
+          className: "fri-DataRow-value",
+          sx: { flex: 1, minWidth: 0, width: { xs: "100%", sm: "auto" } },
+          children
+        }
+      )
+    )
+  ] });
+}
+exports.DataRow = DataRow;
+//# sourceMappingURL=DataRow-CfCaSdaJ.cjs.map

package/DataRow-CfCaSdaJ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataRow-CfCaSdaJ.cjs","sources":["../src/components/DataRow/DataRow.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 DataRowProps {\n  /** Etiqueta del dato (columna izquierda). */\n  label: ReactNode;\n  /** Valor: texto, o cualquier nodo (chip, link, Input en modo edición). */\n  children: ReactNode;\n  /** Última fila de un bloque: sin margen inferior. */\n  last?: boolean;\n  /**\n   * Ancho de la columna del label a partir de `sm`. Default `200`.\n   * Fijo a propósito: alinea verticalmente todos los valores de un bloque.\n   */\n  labelWidth?: number | string;\n  /** Preset registrado en `theme.styles.DataRow`. */\n  preset?: string;\n  sx?: SxProps<Theme>;\n  className?: string;\n  'data-testid'?: string;\n}\n\n/**\n * Fila label/valor — el patrón de dato para vistas de detalle.\n *\n * Geometría: label de ancho fijo + valor al lado; en móvil apila. El ancho fijo\n * (en vez de un `Grid` 4/8) evita que en una card full-width queden cientos de\n * px muertos entre label y valor.\n *\n * Tipografía: el paquete pone `body2`/`body1`. Para mapear a variantes propias\n * del consumidor, registrar un preset en el theme apuntando a las clases\n * internas:\n *\n * ```ts\n * styles: {\n *   DataRow: {\n *     default: {\n *       '& .fri-DataRow-label': { typography: 'dataLabel' },\n *       '& .fri-DataRow-value': { typography: 'dataValue' },\n *     },\n *   },\n * }\n * ```\n */\nexport function DataRow({\n  label,\n  children,\n  last,\n  labelWidth = 200,\n  preset,\n  sx,\n  className,\n  'data-testid': dataTestId,\n}: DataRowProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('DataRow', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    {\n      display: 'flex',\n      flexDirection: { xs: 'column', sm: 'row' },\n      alignItems: { xs: 'flex-start', sm: 'center' },\n      gap: { xs: 0.5, sm: 2 },\n      mb: last ? 0 : 2.5,\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      <Typography\n        variant=\"body2\"\n        component=\"label\"\n        className=\"fri-DataRow-label\"\n        sx={{ width: { sm: labelWidth }, flexShrink: 0, color: 'text.secondary' }}\n      >\n        {label}\n      </Typography>\n      {typeof children === 'string' ? (\n        <Typography variant=\"body1\" component=\"span\" className=\"fri-DataRow-value\">\n          {children}\n        </Typography>\n      ) : (\n        // El slot de valor crece: así un Input en modo edición ocupa el ancho\n        // restante y un Chip conserva su tamaño (es inline-flex).\n        <Box\n          className=\"fri-DataRow-value\"\n          sx={{ flex: 1, minWidth: 0, width: { xs: '100%', sm: 'auto' } }}\n        >\n          {children}\n        </Box>\n      )}\n    </Box>\n  );\n}\n\nexport default DataRow;\n"],"names":["useTheme","resolvePreset","Box","jsx","Typography"],"mappings":";;;;AA+CO,SAAS,QAAQ;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,GAAiB;AACf,QAAM,QAAQA,SAAAA,SAAA;AACd,QAAM,WAAWC,cAAAA,cAAc,WAAW,QAAQ,KAAK;AAEvD,QAAM,SAAyB;AAAA,IAC7B;AAAA,MACE,SAAS;AAAA,MACT,eAAe,EAAE,IAAI,UAAU,IAAI,MAAA;AAAA,MACnC,YAAY,EAAE,IAAI,cAAc,IAAI,SAAA;AAAA,MACpC,KAAK,EAAE,IAAI,KAAK,IAAI,EAAA;AAAA,MACpB,IAAI,OAAO,IAAI;AAAA,IAAA;AAAA,IAEjB,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,YAClD,UAAA;AAAA,IAAAC,2BAAAA;AAAAA,MAACC,SAAAA;AAAAA,MAAA;AAAA,QACC,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,WAAU;AAAA,QACV,IAAI,EAAE,OAAO,EAAE,IAAI,cAAc,YAAY,GAAG,OAAO,iBAAA;AAAA,QAEtD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,OAAO,aAAa,WACnBD,+BAACC,SAAAA,YAAA,EAAW,SAAQ,SAAQ,WAAU,QAAO,WAAU,qBACpD,SAAA,CACH;AAAA;AAAA;AAAA,MAIAD,2BAAAA;AAAAA,QAACD,SAAAA;AAAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,EAAE,IAAI,QAAQ,IAAI,OAAA,EAAO;AAAA,UAE3D;AAAA,QAAA;AAAA,MAAA;AAAA;AAAA,EACH,GAEJ;AAEJ;;"}

package/EmptyState-DJj9KOEy.cjs

@@ -0,0 +1,47 @@
+"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

@@ -0,0 +1 @@
+{"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

@@ -0,0 +1,48 @@
+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

@@ -0,0 +1 @@
+{"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/PageHeader-BQZOqjNr.cjs

@@ -0,0 +1,37 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const resolvePreset = require("./resolvePreset-CxTI6_Ln.cjs");
+function PageHeader({
+  title,
+  breadcrumbs,
+  actions,
+  preset,
+  sx,
+  className,
+  "data-testid": dataTestId
+}) {
+  const theme = material.useTheme();
+  const presetSx = resolvePreset.resolvePreset("PageHeader", preset, theme);
+  const rootSx = [
+    {
+      display: "flex",
+      flexWrap: "wrap",
+      alignItems: "center",
+      justifyContent: "space-between",
+      gap: 2,
+      mb: 3
+    },
+    ...presetSx ? [presetSx] : [],
+    ...Array.isArray(sx) ? sx : sx ? [sx] : []
+  ];
+  return /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: rootSx, className, "data-testid": dataTestId, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "h4", component: "h1", className: "fri-PageHeader-title", sx: { color: "text.primary" }, children: title }),
+    (breadcrumbs || actions) && /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { className: "fri-PageHeader-aside", sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
+      breadcrumbs,
+      actions
+    ] })
+  ] });
+}
+exports.PageHeader = PageHeader;
+//# sourceMappingURL=PageHeader-BQZOqjNr.cjs.map

package/PageHeader-BQZOqjNr.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader-BQZOqjNr.cjs","sources":["../src/components/PageHeader/PageHeader.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 PageHeaderProps {\n  /** Título de la página. Se renderiza como `<h1>`. */\n  title: ReactNode;\n  /**\n   * Migas de pan ya armadas por el consumidor — normalmente un `<Breadcrumbs>`\n   * con los `Link` de su router. Es un slot a propósito: el paquete no depende\n   * de ninguna librería de routing.\n   */\n  breadcrumbs?: ReactNode;\n  /** Acciones a la derecha (botones, menús). */\n  actions?: ReactNode;\n  /** Preset registrado en `theme.styles.PageHeader`. */\n  preset?: string;\n  sx?: SxProps<Theme>;\n  className?: string;\n  'data-testid'?: string;\n}\n\n/**\n * Encabezado de página: título a la izquierda, migas + acciones a la derecha.\n * En pantallas angostas envuelve en vez de comprimir el título.\n */\nexport function PageHeader({\n  title,\n  breadcrumbs,\n  actions,\n  preset,\n  sx,\n  className,\n  'data-testid': dataTestId,\n}: PageHeaderProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('PageHeader', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    {\n      display: 'flex',\n      flexWrap: 'wrap',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 2,\n      mb: 3,\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      <Typography variant=\"h4\" component=\"h1\" className=\"fri-PageHeader-title\" sx={{ color: 'text.primary' }}>\n        {title}\n      </Typography>\n      {(breadcrumbs || actions) && (\n        <Box className=\"fri-PageHeader-aside\" sx={{ display: 'flex', alignItems: 'center', gap: 2 }}>\n          {breadcrumbs}\n          {actions}\n        </Box>\n      )}\n    </Box>\n  );\n}\n\nexport default PageHeader;\n"],"names":["useTheme","resolvePreset","Box","jsx","Typography","jsxs"],"mappings":";;;;AA4BO,SAAS,WAAW;AAAA,EACzB;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,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,KAAK;AAAA,MACL,IAAI;AAAA,IAAA;AAAA,IAEN,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,YAClD,UAAA;AAAA,IAAAC,2BAAAA,IAACC,SAAAA,YAAA,EAAW,SAAQ,MAAK,WAAU,MAAK,WAAU,wBAAuB,IAAI,EAAE,OAAO,eAAA,GACnF,UAAA,OACH;AAAA,KACE,eAAe,YACfC,2BAAAA,KAACH,SAAAA,KAAA,EAAI,WAAU,wBAAuB,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,KACrF,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;;"}

package/PageHeader-DDYi6Nhy.js

@@ -0,0 +1,38 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTheme, Box, Typography } from "@mui/material";
+import { r as resolvePreset } from "./resolvePreset-K6_BfWHD.js";
+function PageHeader({
+  title,
+  breadcrumbs,
+  actions,
+  preset,
+  sx,
+  className,
+  "data-testid": dataTestId
+}) {
+  const theme = useTheme();
+  const presetSx = resolvePreset("PageHeader", preset, theme);
+  const rootSx = [
+    {
+      display: "flex",
+      flexWrap: "wrap",
+      alignItems: "center",
+      justifyContent: "space-between",
+      gap: 2,
+      mb: 3
+    },
+    ...presetSx ? [presetSx] : [],
+    ...Array.isArray(sx) ? sx : sx ? [sx] : []
+  ];
+  return /* @__PURE__ */ jsxs(Box, { sx: rootSx, className, "data-testid": dataTestId, children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "h4", component: "h1", className: "fri-PageHeader-title", sx: { color: "text.primary" }, children: title }),
+    (breadcrumbs || actions) && /* @__PURE__ */ jsxs(Box, { className: "fri-PageHeader-aside", sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
+      breadcrumbs,
+      actions
+    ] })
+  ] });
+}
+export {
+  PageHeader as P
+};
+//# sourceMappingURL=PageHeader-DDYi6Nhy.js.map

package/PageHeader-DDYi6Nhy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader-DDYi6Nhy.js","sources":["../src/components/PageHeader/PageHeader.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 PageHeaderProps {\n  /** Título de la página. Se renderiza como `<h1>`. */\n  title: ReactNode;\n  /**\n   * Migas de pan ya armadas por el consumidor — normalmente un `<Breadcrumbs>`\n   * con los `Link` de su router. Es un slot a propósito: el paquete no depende\n   * de ninguna librería de routing.\n   */\n  breadcrumbs?: ReactNode;\n  /** Acciones a la derecha (botones, menús). */\n  actions?: ReactNode;\n  /** Preset registrado en `theme.styles.PageHeader`. */\n  preset?: string;\n  sx?: SxProps<Theme>;\n  className?: string;\n  'data-testid'?: string;\n}\n\n/**\n * Encabezado de página: título a la izquierda, migas + acciones a la derecha.\n * En pantallas angostas envuelve en vez de comprimir el título.\n */\nexport function PageHeader({\n  title,\n  breadcrumbs,\n  actions,\n  preset,\n  sx,\n  className,\n  'data-testid': dataTestId,\n}: PageHeaderProps) {\n  const theme = useTheme();\n  const presetSx = resolvePreset('PageHeader', preset, theme);\n\n  const rootSx: SxProps<Theme> = [\n    {\n      display: 'flex',\n      flexWrap: 'wrap',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 2,\n      mb: 3,\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      <Typography variant=\"h4\" component=\"h1\" className=\"fri-PageHeader-title\" sx={{ color: 'text.primary' }}>\n        {title}\n      </Typography>\n      {(breadcrumbs || actions) && (\n        <Box className=\"fri-PageHeader-aside\" sx={{ display: 'flex', alignItems: 'center', gap: 2 }}>\n          {breadcrumbs}\n          {actions}\n        </Box>\n      )}\n    </Box>\n  );\n}\n\nexport default PageHeader;\n"],"names":[],"mappings":";;;AA4BO,SAAS,WAAW;AAAA,EACzB;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,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,KAAK;AAAA,MACL,IAAI;AAAA,IAAA;AAAA,IAEN,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,YAClD,UAAA;AAAA,IAAA,oBAAC,YAAA,EAAW,SAAQ,MAAK,WAAU,MAAK,WAAU,wBAAuB,IAAI,EAAE,OAAO,eAAA,GACnF,UAAA,OACH;AAAA,KACE,eAAe,YACf,qBAAC,KAAA,EAAI,WAAU,wBAAuB,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,KACrF,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;"}

package/components/DataRow/DataRow.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const DataRow = require("../../DataRow-CfCaSdaJ.cjs");
+exports.DataRow = DataRow.DataRow;
+exports.default = DataRow.DataRow;
+//# sourceMappingURL=DataRow.cjs.map

package/components/DataRow/DataRow.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataRow.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/DataRow/DataRow.d.ts

@@ -0,0 +1,44 @@
+import { ReactNode } from 'react';
+import { SxProps, Theme } from '@mui/material/styles';
+export interface DataRowProps {
+    /** Etiqueta del dato (columna izquierda). */
+    label: ReactNode;
+    /** Valor: texto, o cualquier nodo (chip, link, Input en modo edición). */
+    children: ReactNode;
+    /** Última fila de un bloque: sin margen inferior. */
+    last?: boolean;
+    /**
+     * Ancho de la columna del label a partir de `sm`. Default `200`.
+     * Fijo a propósito: alinea verticalmente todos los valores de un bloque.
+     */
+    labelWidth?: number | string;
+    /** Preset registrado en `theme.styles.DataRow`. */
+    preset?: string;
+    sx?: SxProps<Theme>;
+    className?: string;
+    'data-testid'?: string;
+}
+/**
+ * Fila label/valor — el patrón de dato para vistas de detalle.
+ *
+ * Geometría: label de ancho fijo + valor al lado; en móvil apila. El ancho fijo
+ * (en vez de un `Grid` 4/8) evita que en una card full-width queden cientos de
+ * px muertos entre label y valor.
+ *
+ * Tipografía: el paquete pone `body2`/`body1`. Para mapear a variantes propias
+ * del consumidor, registrar un preset en el theme apuntando a las clases
+ * internas:
+ *
+ * ```ts
+ * styles: {
+ *   DataRow: {
+ *     default: {
+ *       '& .fri-DataRow-label': { typography: 'dataLabel' },
+ *       '& .fri-DataRow-value': { typography: 'dataValue' },
+ *     },
+ *   },
+ * }
+ * ```
+ */
+export declare function DataRow({ label, children, last, labelWidth, preset, sx, className, 'data-testid': dataTestId, }: DataRowProps): import("react/jsx-runtime").JSX.Element;
+export default DataRow;

package/components/DataRow/DataRow.js

@@ -0,0 +1,6 @@
+import { D, D as D2 } from "../../DataRow-B7fJ5taA.js";
+export {
+  D as DataRow,
+  D2 as default
+};
+//# sourceMappingURL=DataRow.js.map

package/components/DataRow/DataRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataRow.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/DataRow/index.d.ts

@@ -0,0 +1,2 @@
+export { DataRow, default } from './DataRow';
+export type { DataRowProps } from './DataRow';

package/components/DataRow.d.ts

@@ -0,0 +1,6 @@
+export * from './DataRow/index'
+export {}
+import _default from './DataRow/index'
+export default _default
+export * from './DataRow/index'
+export {}

package/components/EmptyState/EmptyState.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const EmptyState = require("../../EmptyState-DJj9KOEy.cjs");
+exports.EmptyState = EmptyState.EmptyState;
+exports.default = EmptyState.EmptyState;
+//# sourceMappingURL=EmptyState.cjs.map

package/components/EmptyState/EmptyState.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+import { SxProps, Theme } from '@mui/material/styles';
+export interface EmptyStateProps {
+    /** Qué falta, en positivo: "Sin dispositivos registrados". */
+    title: string;
+    /** Línea secundaria opcional: qué puede hacer el usuario. */
+    message?: string;
+    /** Icono o ilustración arriba del título. */
+    icon?: ReactNode;
+    /** Acción opcional (botón) debajo del mensaje. */
+    action?: ReactNode;
+    /** Preset registrado en `theme.styles.EmptyState`. */
+    preset?: string;
+    sx?: SxProps<Theme>;
+    className?: string;
+    'data-testid'?: string;
+}
+/**
+ * Estado vacío centrado, para usar dentro de una card, un tab o una tabla sin
+ * resultados. Color y tipografía salen del theme del consumidor: no hay
+ * hex ni tamaños hardcodeados.
+ */
+export declare function EmptyState({ title, message, icon, action, preset, sx, className, 'data-testid': dataTestId, }: EmptyStateProps): import("react/jsx-runtime").JSX.Element;
+export default EmptyState;

package/components/EmptyState/EmptyState.js

@@ -0,0 +1,6 @@
+import { E, E as E2 } from "../../EmptyState-kEoDkg1B.js";
+export {
+  E as EmptyState,
+  E2 as default
+};
+//# sourceMappingURL=EmptyState.js.map

package/components/EmptyState/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/EmptyState/index.d.ts

@@ -0,0 +1,2 @@
+export { EmptyState, default } from './EmptyState';
+export type { EmptyStateProps } from './EmptyState';

package/components/EmptyState.d.ts

@@ -0,0 +1,6 @@
+export * from './EmptyState/index'
+export {}
+import _default from './EmptyState/index'
+export default _default
+export * from './EmptyState/index'
+export {}

package/components/PageHeader/PageHeader.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const PageHeader = require("../../PageHeader-BQZOqjNr.cjs");
+exports.PageHeader = PageHeader.PageHeader;
+exports.default = PageHeader.PageHeader;
+//# sourceMappingURL=PageHeader.cjs.map

package/components/PageHeader/PageHeader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/components/PageHeader/PageHeader.d.ts

@@ -0,0 +1,25 @@
+import { ReactNode } from 'react';
+import { SxProps, Theme } from '@mui/material/styles';
+export interface PageHeaderProps {
+    /** Título de la página. Se renderiza como `<h1>`. */
+    title: ReactNode;
+    /**
+     * Migas de pan ya armadas por el consumidor — normalmente un `<Breadcrumbs>`
+     * con los `Link` de su router. Es un slot a propósito: el paquete no depende
+     * de ninguna librería de routing.
+     */
+    breadcrumbs?: ReactNode;
+    /** Acciones a la derecha (botones, menús). */
+    actions?: ReactNode;
+    /** Preset registrado en `theme.styles.PageHeader`. */
+    preset?: string;
+    sx?: SxProps<Theme>;
+    className?: string;
+    'data-testid'?: string;
+}
+/**
+ * Encabezado de página: título a la izquierda, migas + acciones a la derecha.
+ * En pantallas angostas envuelve en vez de comprimir el título.
+ */
+export declare function PageHeader({ title, breadcrumbs, actions, preset, sx, className, 'data-testid': dataTestId, }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;
+export default PageHeader;

package/components/PageHeader/PageHeader.js

@@ -0,0 +1,6 @@
+import { P, P as P2 } from "../../PageHeader-DDYi6Nhy.js";
+export {
+  P as PageHeader,
+  P2 as default
+};
+//# sourceMappingURL=PageHeader.js.map

package/components/PageHeader/PageHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/components/PageHeader/index.d.ts

@@ -0,0 +1,2 @@
+export { PageHeader, default } from './PageHeader';
+export type { PageHeaderProps } from './PageHeader';

package/components/PageHeader.d.ts

@@ -0,0 +1,6 @@
+export * from './PageHeader/index'
+export {}
+import _default from './PageHeader/index'
+export default _default
+export * from './PageHeader/index'
+export {}

package/index.cjs

@@ -14,6 +14,9 @@ const Alert = require("./Alert-B3SMPD1s.cjs");
 const Divider = require("./Divider-CIY0JK4U.cjs");
 const ButtonGroup = require("./ButtonGroup-CNunDofQ.cjs");
 const Breadcrumbs = require("./Breadcrumbs-B9I3vxPb.cjs");
+const PageHeader = require("./PageHeader-BQZOqjNr.cjs");
+const DataRow = require("./DataRow-CfCaSdaJ.cjs");
+const EmptyState = require("./EmptyState-DJj9KOEy.cjs");
 const Step = require("./Step-Nd7SJbRZ.cjs");
 const Tab = require("./Tab-D1S7kxXI.cjs");
 const Table = require("./Table-DaNgX7PO.cjs");
@@ -178,6 +181,9 @@ exports.Alert = Alert.Alert;
 exports.Divider = Divider.Divider;
 exports.ButtonGroup = ButtonGroup.ButtonGroup;
 exports.Breadcrumbs = Breadcrumbs.Breadcrumbs;
+exports.PageHeader = PageHeader.PageHeader;
+exports.DataRow = DataRow.DataRow;
+exports.EmptyState = EmptyState.EmptyState;
 exports.Step = Step.Step;
 exports.Stepper = Step.Stepper;
 exports.Tab = Tab.Tab;

package/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../src/utils/scrollToTop.ts"],"sourcesContent":["export interface ScrollToTopOptions {\n  /** Comportamiento del scroll. Default: `'smooth'`. */\n  behavior?: ScrollBehavior;\n  /**\n   * Elemento target del scroll. Default: `window`. Útil cuando el contenedor\n   * scrolleable NO es `window` (p.ej. un `<Box>` con `overflow: auto`).\n   */\n  target?: Window | HTMLElement;\n  /** Offset desde el top. Default: `0`. */\n  top?: number;\n}\n\n/**\n * Hace scroll al tope (por default con animación suave). Safe en SSR — si\n * `window` no existe, es un no-op.\n *\n * Llamar tras mutaciones / cambios de filtros / apertura de modales para\n * asegurar que el usuario vea el mensaje de confirmación en la parte\n * superior de la página.\n *\n * ```ts\n * import { scrollToTop } from '@soyfri/shared-library';\n *\n * scrollToTop();                                  // window, smooth\n * scrollToTop({ behavior: 'auto' });              // window, instantáneo\n * scrollToTop({ target: myScrollableRef.current }); // container custom\n * ```\n */\nexport function scrollToTop({\n  behavior = 'smooth',\n  target = typeof window !== 'undefined' ? window : undefined,\n  top = 0,\n}: ScrollToTopOptions = {}): void {\n  if (!target) return;\n  target.scrollTo({ top, left: 0, behavior });\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,SAAS,YAAY;AAAA,EAC1B,WAAW;AAAA,EACX,SAAS,OAAO,WAAW,cAAc,SAAS;AAAA,EAClD,MAAM;AACR,IAAwB,IAAU;AAChC,MAAI,CAAC,OAAQ;AACb,SAAO,SAAS,EAAE,KAAK,MAAM,GAAG,UAAU;AAC5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":["../src/utils/scrollToTop.ts"],"sourcesContent":["export interface ScrollToTopOptions {\n  /** Comportamiento del scroll. Default: `'smooth'`. */\n  behavior?: ScrollBehavior;\n  /**\n   * Elemento target del scroll. Default: `window`. Útil cuando el contenedor\n   * scrolleable NO es `window` (p.ej. un `<Box>` con `overflow: auto`).\n   */\n  target?: Window | HTMLElement;\n  /** Offset desde el top. Default: `0`. */\n  top?: number;\n}\n\n/**\n * Hace scroll al tope (por default con animación suave). Safe en SSR — si\n * `window` no existe, es un no-op.\n *\n * Llamar tras mutaciones / cambios de filtros / apertura de modales para\n * asegurar que el usuario vea el mensaje de confirmación en la parte\n * superior de la página.\n *\n * ```ts\n * import { scrollToTop } from '@soyfri/shared-library';\n *\n * scrollToTop();                                  // window, smooth\n * scrollToTop({ behavior: 'auto' });              // window, instantáneo\n * scrollToTop({ target: myScrollableRef.current }); // container custom\n * ```\n */\nexport function scrollToTop({\n  behavior = 'smooth',\n  target = typeof window !== 'undefined' ? window : undefined,\n  top = 0,\n}: ScrollToTopOptions = {}): void {\n  if (!target) return;\n  target.scrollTo({ top, left: 0, behavior });\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,SAAS,YAAY;AAAA,EAC1B,WAAW;AAAA,EACX,SAAS,OAAO,WAAW,cAAc,SAAS;AAAA,EAClD,MAAM;AACR,IAAwB,IAAU;AAChC,MAAI,CAAC,OAAQ;AACb,SAAO,SAAS,EAAE,KAAK,MAAM,GAAG,UAAU;AAC5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/index.d.ts

@@ -20,6 +20,12 @@ export { ButtonGroup } from './components/ButtonGroup';
 export type { ButtonGroupProps } from './components/ButtonGroup';
 export { Breadcrumbs } from './components/Breadcrumbs';
 export type { BreadcrumbsProps } from './components/Breadcrumbs';
+export { PageHeader } from './components/PageHeader';
+export type { PageHeaderProps } from './components/PageHeader';
+export { DataRow } from './components/DataRow';
+export type { DataRowProps } from './components/DataRow';
+export { EmptyState } from './components/EmptyState';
+export type { EmptyStateProps } from './components/EmptyState';
 export { Stepper, Step } from './components/Stepper';
 export { Tabs, Tab } from './components/Tabs';
 export { Table } from './components/Table';

package/index.js

@@ -12,6 +12,9 @@ import { A as A2 } from "./Alert-YsPScpSE.js";
 import { D as D2 } from "./Divider-BApcM5CV.js";
 import { B as B2 } from "./ButtonGroup-CcKUZ-lT.js";
 import { B as B3 } from "./Breadcrumbs-C41SPbtX.js";
+import { P } from "./PageHeader-DDYi6Nhy.js";
+import { D as D3 } from "./DataRow-B7fJ5taA.js";
+import { E } from "./EmptyState-kEoDkg1B.js";
 import { a, S as S3 } from "./Step-BArsou1V.js";
 import { a as a2, T } from "./Tab-DycIMXmQ.js";
 import { T as T2 } from "./Table-aNFAOuQk.js";
@@ -23,12 +26,12 @@ import { A as A3, a as a4 } from "./Autocomplete-E5aSUGVK.js";
 import { S as S6 } from "./Switch-CY1Dd2ff.js";
 import { R } from "./RadioGroup-cKCpag8W.js";
 import { C as C3 } from "./Checkbox-BL4kvHFB.js";
-import { D as D3 } from "./DatePicker-D__RSgs-.js";
-import { D as D4 } from "./DateTimePicker-LeaE716a.js";
+import { D as D4 } from "./DatePicker-D__RSgs-.js";
+import { D as D5 } from "./DateTimePicker-LeaE716a.js";
 import { I as I2 } from "./InputGroup-D5pXKGjZ.js";
 import { A as A4, a as a5 } from "./ActionMenu-BXRVKopM.js";
 import { A as A5, a as a6, u } from "./AppBarMenuToggle-BpXBMeca.js";
-import { D as D5, a as a7, u as u2 } from "./DrawerItem-at1lsEo9.js";
+import { D as D6, a as a7, u as u2 } from "./DrawerItem-at1lsEo9.js";
 import { F } from "./Flyout-DCcDBYKT.js";
 import { G } from "./Gallery-ClBJxCMc.js";
 import { I as I3 } from "./Icon-CUwK2c8z.js";
@@ -66,11 +69,13 @@ export {
   Column,
   Container,
   D as DEFAULT_PRESET_NAME,
-  D3 as DatePicker,
-  D4 as DateTimePicker,
+  D3 as DataRow,
+  D4 as DatePicker,
+  D5 as DateTimePicker,
   D2 as Divider,
-  D5 as Drawer,
+  D6 as Drawer,
   a7 as DrawerItem,
+  E as EmptyState,
   Fade,
   F as Flyout,
   G as Gallery,
@@ -93,6 +98,7 @@ export {
   c as ModalFooter,
   a3 as ModalHeader,
   O as Option,
+  P as PageHeader,
   Paper,
   R as RadioGroup,
   S5 as Select,

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/utils/scrollToTop.ts"],"sourcesContent":["export interface ScrollToTopOptions {\n  /** Comportamiento del scroll. Default: `'smooth'`. */\n  behavior?: ScrollBehavior;\n  /**\n   * Elemento target del scroll. Default: `window`. Útil cuando el contenedor\n   * scrolleable NO es `window` (p.ej. un `<Box>` con `overflow: auto`).\n   */\n  target?: Window | HTMLElement;\n  /** Offset desde el top. Default: `0`. */\n  top?: number;\n}\n\n/**\n * Hace scroll al tope (por default con animación suave). Safe en SSR — si\n * `window` no existe, es un no-op.\n *\n * Llamar tras mutaciones / cambios de filtros / apertura de modales para\n * asegurar que el usuario vea el mensaje de confirmación en la parte\n * superior de la página.\n *\n * ```ts\n * import { scrollToTop } from '@soyfri/shared-library';\n *\n * scrollToTop();                                  // window, smooth\n * scrollToTop({ behavior: 'auto' });              // window, instantáneo\n * scrollToTop({ target: myScrollableRef.current }); // container custom\n * ```\n */\nexport function scrollToTop({\n  behavior = 'smooth',\n  target = typeof window !== 'undefined' ? window : undefined,\n  top = 0,\n}: ScrollToTopOptions = {}): void {\n  if (!target) return;\n  target.scrollTo({ top, left: 0, behavior });\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,SAAS,YAAY;AAAA,EAC1B,WAAW;AAAA,EACX,SAAS,OAAO,WAAW,cAAc,SAAS;AAAA,EAClD,MAAM;AACR,IAAwB,IAAU;AAChC,MAAI,CAAC,OAAQ;AACb,SAAO,SAAS,EAAE,KAAK,MAAM,GAAG,UAAU;AAC5C;"}
+{"version":3,"file":"index.js","sources":["../src/utils/scrollToTop.ts"],"sourcesContent":["export interface ScrollToTopOptions {\n  /** Comportamiento del scroll. Default: `'smooth'`. */\n  behavior?: ScrollBehavior;\n  /**\n   * Elemento target del scroll. Default: `window`. Útil cuando el contenedor\n   * scrolleable NO es `window` (p.ej. un `<Box>` con `overflow: auto`).\n   */\n  target?: Window | HTMLElement;\n  /** Offset desde el top. Default: `0`. */\n  top?: number;\n}\n\n/**\n * Hace scroll al tope (por default con animación suave). Safe en SSR — si\n * `window` no existe, es un no-op.\n *\n * Llamar tras mutaciones / cambios de filtros / apertura de modales para\n * asegurar que el usuario vea el mensaje de confirmación en la parte\n * superior de la página.\n *\n * ```ts\n * import { scrollToTop } from '@soyfri/shared-library';\n *\n * scrollToTop();                                  // window, smooth\n * scrollToTop({ behavior: 'auto' });              // window, instantáneo\n * scrollToTop({ target: myScrollableRef.current }); // container custom\n * ```\n */\nexport function scrollToTop({\n  behavior = 'smooth',\n  target = typeof window !== 'undefined' ? window : undefined,\n  top = 0,\n}: ScrollToTopOptions = {}): void {\n  if (!target) return;\n  target.scrollTo({ top, left: 0, behavior });\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BO,SAAS,YAAY;AAAA,EAC1B,WAAW;AAAA,EACX,SAAS,OAAO,WAAW,cAAc,SAAS;AAAA,EAClD,MAAM;AACR,IAAwB,IAAU;AAChC,MAAI,CAAC,OAAQ;AACb,SAAO,SAAS,EAAE,KAAK,MAAM,GAAG,UAAU;AAC5C;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soyfri/shared-library",
-  "version": "3.2.1",
+  "version": "3.3.0",
   "main": "./index.cjs",
   "module": "./index.js",
   "types": "./index.d.ts",
@@ -87,6 +87,11 @@
       "require": "./components/RadioGroup/RadioGroup.cjs",
       "types": "./components/RadioGroup/index.d.ts"
     },
+    "./components/PageHeader": {
+      "import": "./components/PageHeader/PageHeader.js",
+      "require": "./components/PageHeader/PageHeader.cjs",
+      "types": "./components/PageHeader/index.d.ts"
+    },
     "./components/Modal": {
       "import": "./components/Modal/Modal.js",
       "require": "./components/Modal/Modal.cjs",
@@ -122,6 +127,11 @@
       "require": "./components/Flyout/Flyout.cjs",
       "types": "./components/Flyout/index.d.ts"
     },
+    "./components/EmptyState": {
+      "import": "./components/EmptyState/EmptyState.js",
+      "require": "./components/EmptyState/EmptyState.cjs",
+      "types": "./components/EmptyState/index.d.ts"
+    },
     "./components/Drawer": {
       "import": "./components/Drawer/Drawer.js",
       "require": "./components/Drawer/Drawer.cjs",
@@ -142,6 +152,11 @@
       "require": "./components/DatePicker/DatePicker.cjs",
       "types": "./components/DatePicker/index.d.ts"
     },
+    "./components/DataRow": {
+      "import": "./components/DataRow/DataRow.js",
+      "require": "./components/DataRow/DataRow.cjs",
+      "types": "./components/DataRow/index.d.ts"
+    },
     "./components/Column": {
       "import": "./components/Column/Column.js",
       "require": "./components/Column/Column.cjs",

package/theme/componentStyles.d.ts

@@ -4,7 +4,7 @@ import { SxProps, Theme } from '@mui/material/styles';
  * theme. Si en el futuro se agrega otro componente al sistema, se extiende
  * esta union.
  */
-export type LibraryComponentName = 'Input' | 'Select' | 'Autocomplete' | 'DatePicker' | 'DateTimePicker' | 'Drawer' | 'AppBar' | 'Card' | 'RadioGroup' | 'Switch' | 'Checkbox' | 'Gallery';
+export type LibraryComponentName = 'Input' | 'Select' | 'Autocomplete' | 'DatePicker' | 'DateTimePicker' | 'Drawer' | 'AppBar' | 'Card' | 'RadioGroup' | 'Switch' | 'Checkbox' | 'Gallery' | 'DataRow' | 'EmptyState' | 'PageHeader';
 /**
  * Un estilo de preset. Puede ser un objeto sx directo o una función del theme
  * para acceder a palette/typography/etc.

package/styles.css

@@ -1,375 +0,0 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
-@layer properties;
-.\@container {
-  container-type: inline-size;
-}
-.collapse {
-  visibility: collapse;
-}
-.invisible {
-  visibility: hidden;
-}
-.visible {
-  visibility: visible;
-}
-.absolute {
-  position: absolute;
-}
-.fixed {
-  position: fixed;
-}
-.relative {
-  position: relative;
-}
-.static {
-  position: static;
-}
-.sticky {
-  position: sticky;
-}
-.isolate {
-  isolation: isolate;
-}
-.float-left {
-  float: left;
-}
-.float-right {
-  float: right;
-}
-.container {
-  width: 100%;
-}
-.block {
-  display: block;
-}
-.contents {
-  display: contents;
-}
-.flex {
-  display: flex;
-}
-.grid {
-  display: grid;
-}
-.hidden {
-  display: none;
-}
-.inline {
-  display: inline;
-}
-.inline-block {
-  display: inline-block;
-}
-.inline-flex {
-  display: inline-flex;
-}
-.table {
-  display: table;
-}
-.table-cell {
-  display: table-cell;
-}
-.table-header-group {
-  display: table-header-group;
-}
-.table-row {
-  display: table-row;
-}
-.table-row-group {
-  display: table-row-group;
-}
-.flex-shrink {
-  flex-shrink: 1;
-}
-.shrink {
-  flex-shrink: 1;
-}
-.flex-grow {
-  flex-grow: 1;
-}
-.grow {
-  flex-grow: 1;
-}
-.border-collapse {
-  border-collapse: collapse;
-}
-.transform {
-  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
-}
-.transform\! {
-  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,) !important;
-}
-.resize {
-  resize: both;
-}
-.truncate {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.border {
-  border-style: var(--tw-border-style);
-  border-width: 1px;
-}
-.text-wrap {
-  text-wrap: wrap;
-}
-.lowercase {
-  text-transform: lowercase;
-}
-.uppercase {
-  text-transform: uppercase;
-}
-.italic {
-  font-style: italic;
-}
-.tabular-nums {
-  --tw-numeric-spacing: tabular-nums;
-  font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
-}
-.overline {
-  text-decoration-line: overline;
-}
-.underline {
-  text-decoration-line: underline;
-}
-.antialiased {
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-.ring {
-  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
-  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-}
-.outline {
-  outline-style: var(--tw-outline-style);
-  outline-width: 1px;
-}
-.grayscale {
-  --tw-grayscale: grayscale(100%);
-  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
-}
-.filter {
-  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
-}
-.filter\! {
-  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,) !important;
-}
-.transition {
-  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
-  transition-timing-function: var(--tw-ease, ease);
-  transition-duration: var(--tw-duration, 0s);
-}
-@property --tw-rotate-x {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-rotate-y {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-rotate-z {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-skew-x {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-skew-y {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-@property --tw-ordinal {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-slashed-zero {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-numeric-figure {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-numeric-spacing {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-numeric-fraction {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-shadow {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0 0 #0000;
-}
-@property --tw-shadow-color {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-shadow-alpha {
-  syntax: "<percentage>";
-  inherits: false;
-  initial-value: 100%;
-}
-@property --tw-inset-shadow {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0 0 #0000;
-}
-@property --tw-inset-shadow-color {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-inset-shadow-alpha {
-  syntax: "<percentage>";
-  inherits: false;
-  initial-value: 100%;
-}
-@property --tw-ring-color {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-ring-shadow {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0 0 #0000;
-}
-@property --tw-inset-ring-color {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-inset-ring-shadow {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0 0 #0000;
-}
-@property --tw-ring-inset {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-ring-offset-width {
-  syntax: "<length>";
-  inherits: false;
-  initial-value: 0px;
-}
-@property --tw-ring-offset-color {
-  syntax: "*";
-  inherits: false;
-  initial-value: #fff;
-}
-@property --tw-ring-offset-shadow {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0 0 #0000;
-}
-@property --tw-outline-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-@property --tw-blur {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-brightness {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-contrast {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-grayscale {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-hue-rotate {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-invert {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-opacity {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-saturate {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-sepia {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-drop-shadow {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-drop-shadow-color {
-  syntax: "*";
-  inherits: false;
-}
-@property --tw-drop-shadow-alpha {
-  syntax: "<percentage>";
-  inherits: false;
-  initial-value: 100%;
-}
-@property --tw-drop-shadow-size {
-  syntax: "*";
-  inherits: false;
-}
-@layer properties {
-  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-    *, ::before, ::after, ::backdrop {
-      --tw-rotate-x: initial;
-      --tw-rotate-y: initial;
-      --tw-rotate-z: initial;
-      --tw-skew-x: initial;
-      --tw-skew-y: initial;
-      --tw-border-style: solid;
-      --tw-ordinal: initial;
-      --tw-slashed-zero: initial;
-      --tw-numeric-figure: initial;
-      --tw-numeric-spacing: initial;
-      --tw-numeric-fraction: initial;
-      --tw-shadow: 0 0 #0000;
-      --tw-shadow-color: initial;
-      --tw-shadow-alpha: 100%;
-      --tw-inset-shadow: 0 0 #0000;
-      --tw-inset-shadow-color: initial;
-      --tw-inset-shadow-alpha: 100%;
-      --tw-ring-color: initial;
-      --tw-ring-shadow: 0 0 #0000;
-      --tw-inset-ring-color: initial;
-      --tw-inset-ring-shadow: 0 0 #0000;
-      --tw-ring-inset: initial;
-      --tw-ring-offset-width: 0px;
-      --tw-ring-offset-color: #fff;
-      --tw-ring-offset-shadow: 0 0 #0000;
-      --tw-outline-style: solid;
-      --tw-blur: initial;
-      --tw-brightness: initial;
-      --tw-contrast: initial;
-      --tw-grayscale: initial;
-      --tw-hue-rotate: initial;
-      --tw-invert: initial;
-      --tw-opacity: initial;
-      --tw-saturate: initial;
-      --tw-sepia: initial;
-      --tw-drop-shadow: initial;
-      --tw-drop-shadow-color: initial;
-      --tw-drop-shadow-alpha: 100%;
-      --tw-drop-shadow-size: initial;
-    }
-  }
-}