@soyfri/shared-library 1.5.0 → 1.6.0-beta.0

package/package.json

@@ -1,22 +1,10 @@
 {
   "name": "@soyfri/shared-library",
-  "version": "1.5.0",
+  "version": "1.6.0-beta.0",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "build:css": "tailwindcss -i ./src/styles.css -o ./dist/styles.css",
-    "watch:css": "tailwindcss -i ./src/styles.css -o ./dist/styles.css --watch",
-    "build": "vite build --mode lib",
-    "dev": "tsup --watch",
-    "rm": "node cleanDirectories",
-    "clean": "rimraf dist",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build",
-    "dist": "node build"
-  },
   "keywords": [],
   "author": "",
   "license": "ISC",
@@ -40,37 +28,170 @@
     "react-hook-form": "^7.62.0",
     "tailwindcss": "^4.1.7"
   },
-  "devDependencies": {
-    "@chromatic-com/storybook": "^4.0.1",
-    "@rollup/plugin-alias": "^5.1.1",
-    "@rollup/plugin-commonjs": "^28.0.3",
-    "@rollup/plugin-node-resolve": "^16.0.1",
-    "@rollup/plugin-terser": "^0.4.4",
-    "@storybook/addon-docs": "^9.0.15",
-    "@storybook/addon-onboarding": "^9.0.15",
-    "@storybook/addon-vitest": "^9.0.15",
-    "@storybook/react-vite": "^9.0.15",
-    "@types/react": "^19.1.6",
-    "@types/react-dom": "^19.1.5",
-    "@vitest/browser": "^3.1.4",
-    "@vitest/coverage-v8": "^3.1.4",
-    "chromatic": "^12.0.0",
-    "glob": "^11.0.2",
-    "playwright": "^1.52.0",
-    "prettier": "3.5.3",
-    "rimraf": "^6.0.1",
-    "rollup": "^4.41.1",
-    "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-typescript2": "^0.36.0",
-    "storybook": "^9.0.15",
-    "tsup": "^8.5.0",
-    "typescript": "^5.8.3",
-    "vite-plugin-dts": "^4.5.4",
-    "vite-plugin-lib-inject-css": "^2.2.2",
-    "vitest": "^3.1.4"
-  },
   "overrides": {
     "storybook": "$storybook"
+  },
+  "exports": {
+    ".": {
+      "import": "./index.js",
+      "require": "./index.cjs",
+      "types": "./index.d.ts"
+    },
+    "./package.json": "./package.json",
+    "./components/Tooltip": {
+      "import": "./components/Tooltip/Tooltip.js",
+      "require": "./components/Tooltip/Tooltip.cjs",
+      "types": "./components/Tooltip/Tooltip.d.ts"
+    },
+    "./components/Timeline": {
+      "import": "./components/Timeline/Timeline.js",
+      "require": "./components/Timeline/Timeline.cjs",
+      "types": "./components/Timeline/Timeline.d.ts"
+    },
+    "./components/Tabs": {
+      "import": "./components/Tabs/Tabs.js",
+      "require": "./components/Tabs/Tabs.cjs",
+      "types": "./components/Tabs/Tabs.d.ts"
+    },
+    "./components/Table": {
+      "import": "./components/Table/Table.js",
+      "require": "./components/Table/Table.cjs",
+      "types": "./components/Table/Table.d.ts"
+    },
+    "./components/Switch": {
+      "import": "./components/Switch/Switch.js",
+      "require": "./components/Switch/Switch.cjs",
+      "types": "./components/Switch/Switch.d.ts"
+    },
+    "./components/Stepper": {
+      "import": "./components/Stepper/Stepper.js",
+      "require": "./components/Stepper/Stepper.cjs",
+      "types": "./components/Stepper/Stepper.d.ts"
+    },
+    "./components/StatusMessage": {
+      "import": "./components/StatusMessage/StatusMessage.js",
+      "require": "./components/StatusMessage/StatusMessage.cjs",
+      "types": "./components/StatusMessage/StatusMessage.d.ts"
+    },
+    "./components/Stat": {
+      "import": "./components/Stat/Stat.js",
+      "require": "./components/Stat/Stat.cjs",
+      "types": "./components/Stat/Stat.d.ts"
+    },
+    "./components/Select": {
+      "import": "./components/Select/Select.js",
+      "require": "./components/Select/Select.cjs",
+      "types": "./components/Select/Select.d.ts"
+    },
+    "./components/RadioGroup": {
+      "import": "./components/RadioGroup/RadioGroup.js",
+      "require": "./components/RadioGroup/RadioGroup.cjs",
+      "types": "./components/RadioGroup/RadioGroup.d.ts"
+    },
+    "./components/Modal": {
+      "import": "./components/Modal/Modal.js",
+      "require": "./components/Modal/Modal.cjs",
+      "types": "./components/Modal/Modal.d.ts"
+    },
+    "./components/MenuButton": {
+      "import": "./components/MenuButton/MenuButton.js",
+      "require": "./components/MenuButton/MenuButton.cjs",
+      "types": "./components/MenuButton/MenuButton.d.ts"
+    },
+    "./components/InputGroup": {
+      "import": "./components/InputGroup/InputGroup.js",
+      "require": "./components/InputGroup/InputGroup.cjs",
+      "types": "./components/InputGroup/InputGroup.d.ts"
+    },
+    "./components/Input": {
+      "import": "./components/Input/Input.js",
+      "require": "./components/Input/Input.cjs",
+      "types": "./components/Input/Input.d.ts"
+    },
+    "./components/Icon": {
+      "import": "./components/Icon/Icon.js",
+      "require": "./components/Icon/Icon.cjs",
+      "types": "./components/Icon/Icon.d.ts"
+    },
+    "./components/Gallery": {
+      "import": "./components/Gallery/Gallery.js",
+      "require": "./components/Gallery/Gallery.cjs",
+      "types": "./components/Gallery/Gallery.d.ts"
+    },
+    "./components/Flyout": {
+      "import": "./components/Flyout/Flyout.js",
+      "require": "./components/Flyout/Flyout.cjs",
+      "types": "./components/Flyout/Flyout.d.ts"
+    },
+    "./components/Drawer": {
+      "import": "./components/Drawer/Drawer.js",
+      "require": "./components/Drawer/Drawer.cjs",
+      "types": "./components/Drawer/Drawer.d.ts"
+    },
+    "./components/DateTimePicker": {
+      "import": "./components/DateTimePicker/DateTimePicker.js",
+      "require": "./components/DateTimePicker/DateTimePicker.cjs",
+      "types": "./components/DateTimePicker/DateTimePicker.d.ts"
+    },
+    "./components/DateRangePicker": {
+      "import": "./components/DateRangePicker/DateRangePicker.js",
+      "require": "./components/DateRangePicker/DateRangePicker.cjs",
+      "types": "./components/DateRangePicker/DateRangePicker.d.ts"
+    },
+    "./components/DatePicker": {
+      "import": "./components/DatePicker/DatePicker.js",
+      "require": "./components/DatePicker/DatePicker.cjs",
+      "types": "./components/DatePicker/DatePicker.d.ts"
+    },
+    "./components/Column": {
+      "import": "./components/Column/Column.js",
+      "require": "./components/Column/Column.cjs",
+      "types": "./components/Column/Column.d.ts"
+    },
+    "./components/Chip": {
+      "import": "./components/Chip/Chip.js",
+      "require": "./components/Chip/Chip.cjs",
+      "types": "./components/Chip/Chip.d.ts"
+    },
+    "./components/Checkbox": {
+      "import": "./components/Checkbox/Checkbox.js",
+      "require": "./components/Checkbox/Checkbox.cjs",
+      "types": "./components/Checkbox/Checkbox.d.ts"
+    },
+    "./components/Card": {
+      "import": "./components/Card/Card.js",
+      "require": "./components/Card/Card.cjs",
+      "types": "./components/Card/Card.d.ts"
+    },
+    "./components/Button": {
+      "import": "./components/Button/Button.js",
+      "require": "./components/Button/Button.cjs",
+      "types": "./components/Button/Button.d.ts"
+    },
+    "./components/Avatar": {
+      "import": "./components/Avatar/Avatar.js",
+      "require": "./components/Avatar/Avatar.cjs",
+      "types": "./components/Avatar/Avatar.d.ts"
+    },
+    "./components/Autocomplete": {
+      "import": "./components/Autocomplete/Autocomplete.js",
+      "require": "./components/Autocomplete/Autocomplete.cjs",
+      "types": "./components/Autocomplete/Autocomplete.d.ts"
+    },
+    "./components/AppBar": {
+      "import": "./components/AppBar/AppBar.js",
+      "require": "./components/AppBar/AppBar.cjs",
+      "types": "./components/AppBar/AppBar.d.ts"
+    },
+    "./components/ActionMenu": {
+      "import": "./components/ActionMenu/ActionMenu.js",
+      "require": "./components/ActionMenu/ActionMenu.cjs",
+      "types": "./components/ActionMenu/ActionMenu.d.ts"
+    },
+    "./hooks/ClipBoard": {
+      "import": "./hooks/ClipBoard/ClipBoard.js",
+      "require": "./hooks/ClipBoard/ClipBoard.cjs",
+      "types": "./hooks/ClipBoard/ClipBoard.d.ts"
+    }
   }
 }

package/resolvePreset-B-IB0ehH.js

@@ -0,0 +1,15 @@
+const DEFAULT_PRESET_NAME = "default";
+function resolvePreset(componentName, presetName, theme) {
+  var _a;
+  if (!presetName || presetName === DEFAULT_PRESET_NAME) return void 0;
+  const componentPresets = (_a = theme.styles) == null ? void 0 : _a[componentName];
+  if (!componentPresets) return void 0;
+  const entry = componentPresets[presetName];
+  if (!entry) return void 0;
+  return typeof entry === "function" ? entry(theme) : entry;
+}
+export {
+  DEFAULT_PRESET_NAME as D,
+  resolvePreset as r
+};
+//# sourceMappingURL=resolvePreset-B-IB0ehH.js.map

package/resolvePreset-B-IB0ehH.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolvePreset-B-IB0ehH.js","sources":["../src/components/_shared/resolvePreset.ts"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nimport type { LibraryComponentName, PresetStyle } from '../../theme/componentStyles';\n\n/**\n * Nombre del preset built-in del paquete. No se registra en el theme: si un\n * componente recibe `preset=\"default\"` (o no recibe preset), sólo aplica el\n * estilo base de fábrica.\n */\nexport const DEFAULT_PRESET_NAME = 'default';\n\n/**\n * Resuelve el sx de un preset registrado en `theme.styles[componentName]`.\n *\n * - Si `presetName` es `\"default\"` o `undefined`, devuelve `undefined`\n *   (caller sólo aplicará el estilo base del paquete).\n * - Si la entrada en el theme es una función `(theme) => sx`, se ejecuta.\n * - Si la entrada no existe, devuelve `undefined` silenciosamente (no se\n *   rompe el componente — la responsabilidad de registrarlo es del consumer).\n */\nexport function resolvePreset(\n  componentName: LibraryComponentName,\n  presetName: string | undefined,\n  theme: Theme,\n): SxProps<Theme> | undefined {\n  if (!presetName || presetName === DEFAULT_PRESET_NAME) return undefined;\n\n  const componentPresets = theme.styles?.[componentName];\n  if (!componentPresets) return undefined;\n\n  const entry: PresetStyle | undefined = componentPresets[presetName];\n  if (!entry) return undefined;\n\n  return typeof entry === 'function' ? entry(theme) : entry;\n}\n"],"names":[],"mappings":"AASO,MAAM,sBAAsB;AAW5B,SAAS,cACd,eACA,YACA,OAC4B;AAfvB;AAgBL,MAAI,CAAC,cAAc,eAAe,oBAAqB,QAAO;AAE9D,QAAM,oBAAmB,WAAM,WAAN,mBAAe;AACxC,MAAI,CAAC,iBAAkB,QAAO;AAE9B,QAAM,QAAiC,iBAAiB,UAAU;AAClE,MAAI,CAAC,MAAO,QAAO;AAEnB,SAAO,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;AACtD;"}

package/resolvePreset-CT3kU-K2.cjs

@@ -0,0 +1,14 @@
+"use strict";
+const DEFAULT_PRESET_NAME = "default";
+function resolvePreset(componentName, presetName, theme) {
+  var _a;
+  if (!presetName || presetName === DEFAULT_PRESET_NAME) return void 0;
+  const componentPresets = (_a = theme.styles) == null ? void 0 : _a[componentName];
+  if (!componentPresets) return void 0;
+  const entry = componentPresets[presetName];
+  if (!entry) return void 0;
+  return typeof entry === "function" ? entry(theme) : entry;
+}
+exports.DEFAULT_PRESET_NAME = DEFAULT_PRESET_NAME;
+exports.resolvePreset = resolvePreset;
+//# sourceMappingURL=resolvePreset-CT3kU-K2.cjs.map

package/resolvePreset-CT3kU-K2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolvePreset-CT3kU-K2.cjs","sources":["../src/components/_shared/resolvePreset.ts"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nimport type { LibraryComponentName, PresetStyle } from '../../theme/componentStyles';\n\n/**\n * Nombre del preset built-in del paquete. No se registra en el theme: si un\n * componente recibe `preset=\"default\"` (o no recibe preset), sólo aplica el\n * estilo base de fábrica.\n */\nexport const DEFAULT_PRESET_NAME = 'default';\n\n/**\n * Resuelve el sx de un preset registrado en `theme.styles[componentName]`.\n *\n * - Si `presetName` es `\"default\"` o `undefined`, devuelve `undefined`\n *   (caller sólo aplicará el estilo base del paquete).\n * - Si la entrada en el theme es una función `(theme) => sx`, se ejecuta.\n * - Si la entrada no existe, devuelve `undefined` silenciosamente (no se\n *   rompe el componente — la responsabilidad de registrarlo es del consumer).\n */\nexport function resolvePreset(\n  componentName: LibraryComponentName,\n  presetName: string | undefined,\n  theme: Theme,\n): SxProps<Theme> | undefined {\n  if (!presetName || presetName === DEFAULT_PRESET_NAME) return undefined;\n\n  const componentPresets = theme.styles?.[componentName];\n  if (!componentPresets) return undefined;\n\n  const entry: PresetStyle | undefined = componentPresets[presetName];\n  if (!entry) return undefined;\n\n  return typeof entry === 'function' ? entry(theme) : entry;\n}\n"],"names":[],"mappings":";AASO,MAAM,sBAAsB;AAW5B,SAAS,cACd,eACA,YACA,OAC4B;;AAC5B,MAAI,CAAC,cAAc,eAAe,oBAAqB,QAAO;AAE9D,QAAM,oBAAmB,WAAM,WAAN,mBAAe;AACxC,MAAI,CAAC,iBAAkB,QAAO;AAE9B,QAAM,QAAiC,iBAAiB,UAAU;AAClE,MAAI,CAAC,MAAO,QAAO;AAEnB,SAAO,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;AACtD;;;"}

package/theme/componentStyles.d.ts

@@ -0,0 +1,32 @@
+import { SxProps, Theme } from '@mui/material/styles';
+/**
+ * Lista de componentes del paquete que soportan presets registrables en el
+ * 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';
+/**
+ * Un estilo de preset. Puede ser un objeto sx directo o una función del theme
+ * para acceder a palette/typography/etc.
+ */
+export type PresetStyle = SxProps<Theme> | ((theme: Theme) => SxProps<Theme>);
+/**
+ * Map de presets disponibles para un componente. Las keys son nombres libres
+ * elegidos por el consumidor (p.ej. `reddit`, `compact-filled`). El paquete
+ * no registra ninguna entrada: `preset="default"` significa "usar el estilo
+ * built-in de fábrica" y no requiere registro.
+ */
+export type ComponentPresets = Record<string, PresetStyle>;
+/**
+ * Shape del namespace `theme.styles` — un map de componentes del paquete a
+ * sus presets registrados.
+ */
+export type LibraryStyles = Partial<Record<LibraryComponentName, ComponentPresets>>;
+declare module '@mui/material/styles' {
+    interface Theme {
+        styles: LibraryStyles;
+    }
+    interface ThemeOptions {
+        styles?: LibraryStyles;
+    }
+}

package/theme/tokens.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Design tokens compartidos por los componentes de formulario
+ * (Input, Select, Autocomplete, DatePicker, DateTimePicker).
+ *
+ * Centralizar estos valores garantiza que:
+ * - el espaciado, la tipografía y las animaciones del label sean idénticos
+ *   en todos los campos;
+ * - un cambio visual global (p.ej. cambiar el transform del shrink) se haga
+ *   en un único archivo.
+ */
+/** Margen superior que deja el aire para el label flotante "outside". */
+export declare const LABEL_MARGIN_TOP = "14px";
+/** Padding vertical interno del input (TextField/Select/Picker sections). */
+export declare const FIELD_INPUT_PADDING_Y = "8.5px";
+/** Transform que aplica el label cuando sube arriba del input (shrink). */
+export declare const LABEL_SHRINK_TRANSFORM = "translate(4px, -22px) scale(0.85)";
+/** Origen del transform para el shrink. */
+export declare const LABEL_TRANSFORM_ORIGIN = "top left";
+/** Transición del label (color + transform + max-width). */
+export declare const LABEL_TRANSITION: string;
+/** Color del label en reposo. */
+export declare const LABEL_COLOR_REST = "text.secondary";
+/** Color del label cuando el campo tiene valor (shrink). */
+export declare const LABEL_COLOR_FILLED = "text.primary";
+/** Color del label cuando el campo está focused. */
+export declare const LABEL_COLOR_FOCUSED = "primary.main";
+/** Peso del label cuando sube (filled/focused). */
+export declare const LABEL_FONT_WEIGHT_FILLED = 500;

package/tokens-BRrcP_p_.js

@@ -0,0 +1,21 @@
+const LABEL_MARGIN_TOP = "14px";
+const FIELD_INPUT_PADDING_Y = "8.5px";
+const LABEL_SHRINK_TRANSFORM = "translate(4px, -22px) scale(0.85)";
+const LABEL_TRANSFORM_ORIGIN = "top left";
+const LABEL_TRANSITION = "color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms";
+const LABEL_COLOR_REST = "text.secondary";
+const LABEL_COLOR_FILLED = "text.primary";
+const LABEL_COLOR_FOCUSED = "primary.main";
+const LABEL_FONT_WEIGHT_FILLED = 500;
+export {
+  FIELD_INPUT_PADDING_Y as F,
+  LABEL_MARGIN_TOP as L,
+  LABEL_COLOR_FOCUSED as a,
+  LABEL_FONT_WEIGHT_FILLED as b,
+  LABEL_COLOR_FILLED as c,
+  LABEL_TRANSFORM_ORIGIN as d,
+  LABEL_SHRINK_TRANSFORM as e,
+  LABEL_TRANSITION as f,
+  LABEL_COLOR_REST as g
+};
+//# sourceMappingURL=tokens-BRrcP_p_.js.map

package/tokens-BRrcP_p_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens-BRrcP_p_.js","sources":["../src/theme/tokens.ts"],"sourcesContent":["/**\n * Design tokens compartidos por los componentes de formulario\n * (Input, Select, Autocomplete, DatePicker, DateTimePicker).\n *\n * Centralizar estos valores garantiza que:\n * - el espaciado, la tipografía y las animaciones del label sean idénticos\n *   en todos los campos;\n * - un cambio visual global (p.ej. cambiar el transform del shrink) se haga\n *   en un único archivo.\n */\n\n// ── Spacing ──────────────────────────────────────────────────────────────\n/** Margen superior que deja el aire para el label flotante \"outside\". */\nexport const LABEL_MARGIN_TOP = '14px';\n\n/** Padding vertical interno del input (TextField/Select/Picker sections). */\nexport const FIELD_INPUT_PADDING_Y = '8.5px';\n\n// ── Label animation ──────────────────────────────────────────────────────\n/** Transform que aplica el label cuando sube arriba del input (shrink). */\nexport const LABEL_SHRINK_TRANSFORM = 'translate(4px, -22px) scale(0.85)';\n\n/** Origen del transform para el shrink. */\nexport const LABEL_TRANSFORM_ORIGIN = 'top left';\n\n/** Transición del label (color + transform + max-width). */\nexport const LABEL_TRANSITION =\n  'color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms';\n\n// ── Label colors (theme-aware) ───────────────────────────────────────────\n/** Color del label en reposo. */\nexport const LABEL_COLOR_REST = 'text.secondary';\n\n/** Color del label cuando el campo tiene valor (shrink). */\nexport const LABEL_COLOR_FILLED = 'text.primary';\n\n/** Color del label cuando el campo está focused. */\nexport const LABEL_COLOR_FOCUSED = 'primary.main';\n\n/** Peso del label cuando sube (filled/focused). */\nexport const LABEL_FONT_WEIGHT_FILLED = 500;\n"],"names":[],"mappings":"AAaO,MAAM,mBAAmB;AAGzB,MAAM,wBAAwB;AAI9B,MAAM,yBAAyB;AAG/B,MAAM,yBAAyB;AAG/B,MAAM,mBACX;AAMK,MAAM,mBAAmB;AAGzB,MAAM,qBAAqB;AAG3B,MAAM,sBAAsB;AAG5B,MAAM,2BAA2B;"}

package/tokens-jaWWNk39.cjs

@@ -0,0 +1,20 @@
+"use strict";
+const LABEL_MARGIN_TOP = "14px";
+const FIELD_INPUT_PADDING_Y = "8.5px";
+const LABEL_SHRINK_TRANSFORM = "translate(4px, -22px) scale(0.85)";
+const LABEL_TRANSFORM_ORIGIN = "top left";
+const LABEL_TRANSITION = "color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms";
+const LABEL_COLOR_REST = "text.secondary";
+const LABEL_COLOR_FILLED = "text.primary";
+const LABEL_COLOR_FOCUSED = "primary.main";
+const LABEL_FONT_WEIGHT_FILLED = 500;
+exports.FIELD_INPUT_PADDING_Y = FIELD_INPUT_PADDING_Y;
+exports.LABEL_COLOR_FILLED = LABEL_COLOR_FILLED;
+exports.LABEL_COLOR_FOCUSED = LABEL_COLOR_FOCUSED;
+exports.LABEL_COLOR_REST = LABEL_COLOR_REST;
+exports.LABEL_FONT_WEIGHT_FILLED = LABEL_FONT_WEIGHT_FILLED;
+exports.LABEL_MARGIN_TOP = LABEL_MARGIN_TOP;
+exports.LABEL_SHRINK_TRANSFORM = LABEL_SHRINK_TRANSFORM;
+exports.LABEL_TRANSFORM_ORIGIN = LABEL_TRANSFORM_ORIGIN;
+exports.LABEL_TRANSITION = LABEL_TRANSITION;
+//# sourceMappingURL=tokens-jaWWNk39.cjs.map

package/tokens-jaWWNk39.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens-jaWWNk39.cjs","sources":["../src/theme/tokens.ts"],"sourcesContent":["/**\n * Design tokens compartidos por los componentes de formulario\n * (Input, Select, Autocomplete, DatePicker, DateTimePicker).\n *\n * Centralizar estos valores garantiza que:\n * - el espaciado, la tipografía y las animaciones del label sean idénticos\n *   en todos los campos;\n * - un cambio visual global (p.ej. cambiar el transform del shrink) se haga\n *   en un único archivo.\n */\n\n// ── Spacing ──────────────────────────────────────────────────────────────\n/** Margen superior que deja el aire para el label flotante \"outside\". */\nexport const LABEL_MARGIN_TOP = '14px';\n\n/** Padding vertical interno del input (TextField/Select/Picker sections). */\nexport const FIELD_INPUT_PADDING_Y = '8.5px';\n\n// ── Label animation ──────────────────────────────────────────────────────\n/** Transform que aplica el label cuando sube arriba del input (shrink). */\nexport const LABEL_SHRINK_TRANSFORM = 'translate(4px, -22px) scale(0.85)';\n\n/** Origen del transform para el shrink. */\nexport const LABEL_TRANSFORM_ORIGIN = 'top left';\n\n/** Transición del label (color + transform + max-width). */\nexport const LABEL_TRANSITION =\n  'color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms, ' +\n  'max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms';\n\n// ── Label colors (theme-aware) ───────────────────────────────────────────\n/** Color del label en reposo. */\nexport const LABEL_COLOR_REST = 'text.secondary';\n\n/** Color del label cuando el campo tiene valor (shrink). */\nexport const LABEL_COLOR_FILLED = 'text.primary';\n\n/** Color del label cuando el campo está focused. */\nexport const LABEL_COLOR_FOCUSED = 'primary.main';\n\n/** Peso del label cuando sube (filled/focused). */\nexport const LABEL_FONT_WEIGHT_FILLED = 500;\n"],"names":[],"mappings":";AAaO,MAAM,mBAAmB;AAGzB,MAAM,wBAAwB;AAI9B,MAAM,yBAAyB;AAG/B,MAAM,yBAAyB;AAG/B,MAAM,mBACX;AAMK,MAAM,mBAAmB;AAGzB,MAAM,qBAAqB;AAG3B,MAAM,sBAAsB;AAG5B,MAAM,2BAA2B;;;;;;;;;;"}

package/utils/index.d.ts

@@ -0,0 +1,2 @@
+export { scrollToTop } from './scrollToTop';
+export type { ScrollToTopOptions } from './scrollToTop';

package/utils/scrollToTop.d.ts

@@ -0,0 +1,28 @@
+export interface ScrollToTopOptions {
+    /** Comportamiento del scroll. Default: `'smooth'`. */
+    behavior?: ScrollBehavior;
+    /**
+     * Elemento target del scroll. Default: `window`. Útil cuando el contenedor
+     * scrolleable NO es `window` (p.ej. un `<Box>` con `overflow: auto`).
+     */
+    target?: Window | HTMLElement;
+    /** Offset desde el top. Default: `0`. */
+    top?: number;
+}
+/**
+ * Hace scroll al tope (por default con animación suave). Safe en SSR — si
+ * `window` no existe, es un no-op.
+ *
+ * Llamar tras mutaciones / cambios de filtros / apertura de modales para
+ * asegurar que el usuario vea el mensaje de confirmación en la parte
+ * superior de la página.
+ *
+ * ```ts
+ * import { scrollToTop } from '@soyfri/shared-library';
+ *
+ * scrollToTop();                                  // window, smooth
+ * scrollToTop({ behavior: 'auto' });              // window, instantáneo
+ * scrollToTop({ target: myScrollableRef.current }); // container custom
+ * ```
+ */
+export declare function scrollToTop({ behavior, target, top, }?: ScrollToTopOptions): void;

package/.dockerignore

@@ -1,8 +0,0 @@
-# Ignore dependencies, build artifacts, and local environment files
-node_modules
-dist
-
-# Ignore git and docker files
-.git
-.gitignore
-.dockerignore

package/.github/workflows/publish.yml

@@ -1,107 +0,0 @@
-name: Node.js CI
-
-on:
-  push:
-    branches: [ "main" ]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [v23.6.1]
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ matrix.node-version }}
-          npm-version: '10.9.2'
-          cache: 'npm' # Se asume que package-lock.json está en el repositorio
-      
-      - name: Install dependencies
-        run: npm install --frozen-lockfile # Uso de --frozen-lockfile para CI/CD
-
-      - name: Remove underscore-prefixed directories
-        run: npm run rm --if-present
-
-      - name: Build package
-        run: npm run build --if-present
-      
-      - name: Dist package
-        run: npm run dist --if-present
-
-      - name: Upload build artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: dist-package
-          path: dist/ # Guarda el directorio de distribución como un artefacto
-
-  publish:
-    runs-on: ubuntu-latest
-    needs: build # 👈 Depende del trabajo de construcción
-    environment: production # 👈 Asocia este trabajo con el ambiente 'production'
-    
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-        
-      - name: Download build artifact
-        uses: actions/download-artifact@v4
-        with:
-          name: dist-package
-          path: dist/ # Descarga el artefacto en el directorio 'dist'
-
-      - name: Use Node.js 20.x for publishing
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20.x
-          npm-version: '10.9.2'
-          registry-url: 'https://registry.npmjs.org'
-          
-      - name: Publish package
-        working-directory: dist
-        run: npm publish --access public
-        env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
-  
-  notify:
-    runs-on: ubuntu-latest
-    needs: publish
-    environment: production
-    
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-        
-      - name: Get package version
-        id: get_version
-        run: echo "PACKAGE_VERSION=$(npm pkg get version | tr -d '\"')" >> $GITHUB_ENV
-        
-      - name: Get commit message and author
-        id: get_commit_info
-        run: |
-          echo "COMMIT_MESSAGE=$(git log -1 --pretty=format:%s)" >> $GITHUB_ENV
-          echo "COMMIT_AUTHOR=$(git log -1 --pretty=format:%an)" >> $GITHUB_ENV
-        
-      - name: Send Discord notification (Success)
-        if: success()
-        uses: tsickert/discord-webhook@v5.3.0
-        with:
-          webhook-url: ${{ secrets.DISCORD_WEBHOOK_URL }}
-          content: "✅ **Publicación Exitosa:** Nueva versión de la librería de componentes en npm.\n**Paquete:** [@soyfri/shared-library](https://www.npmjs.com/package/@soyfri/shared-library/v/${{ env.PACKAGE_VERSION }})\n**Versión:** `v${{ env.PACKAGE_VERSION }}`\n**Notas del commit:** ${{ env.COMMIT_MESSAGE }}\n**Autor:** ${{ env.COMMIT_AUTHOR }}"
-          username: "GitHub Actions"
-          avatar-url: "https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png"
-      
-      - name: Send Discord notification (Failure)
-        if: failure()
-        uses: tsickert/discord-webhook@v5.3.0
-        with:
-          webhook-url: ${{ secrets.DISCORD_WEBHOOK_URL }}
-          content: "❌ **Publicación Fallida:** Falló la publicación de la librería de componentes en npm.\n**Commit:** ${{ env.COMMIT_MESSAGE }}\n**Autor:** ${{ env.COMMIT_AUTHOR }}"
-          username: "GitHub Actions"
-          avatar-url: "https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png"

package/.prettierrc

@@ -1,3 +0,0 @@
-{
-  "tabWidth": 2
-}

package/.storybook/main.ts

@@ -1,19 +0,0 @@
-import type { StorybookConfig } from '@storybook/react-vite';
-
-const config: StorybookConfig = {
-  "stories": [
-    "../src/**/*.mdx",
-    "../src/**/*.stories.@(js|jsx|mjs|ts|tsx|mdx)"
-  ],
-  "addons": [
-    "@storybook/addon-onboarding",
-    "@chromatic-com/storybook",
-    "@storybook/addon-vitest",
-    "@storybook/addon-docs"
-  ],
-  "framework": {
-    "name": "@storybook/react-vite",
-    "options": {}
-  }
-};
-export default config;

package/.storybook/preview.ts

@@ -1,14 +0,0 @@
-import type { Preview } from '@storybook/react-vite'
-
-const preview: Preview = {
-  parameters: {
-    controls: {
-      matchers: {
-       color: /(background|color)$/i,
-       date: /Date$/i,
-      },
-    },
-  },
-};
-
-export default preview;

package/.storybook/vitest.setup.ts

@@ -1,9 +0,0 @@
-import { beforeAll } from 'vitest';
-import { setProjectAnnotations } from '@storybook/react-vite';
-import * as projectAnnotations from './preview';
-
-// This is an important step to apply the right configuration when testing your stories.
-// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
-const project = setProjectAnnotations([projectAnnotations]);
-
-beforeAll(project.beforeAll);

package/Dockerfile

@@ -1,37 +0,0 @@
-# Use a specific Node.js version for the build environment.
-FROM node:20-alpine AS builder
-
-# Set the working directory in the container.
-WORKDIR /usr/src/app
-
-# Copy package.json and package-lock.json to leverage Docker's layer caching.
-# This step is cached and only re-runs if package*.json files change.
-COPY package*.json ./
-
-# Install project dependencies.
-RUN npm install
-
-# Copy the rest of your application's source code.
-COPY . .
-
-# Run the build script to create the distribution files.
-RUN npm run build --if-present
-
-RUN npm run dist --if-present
-
-# --- Final Stage: Create a lightweight image with only the build artifacts ---
-# Use a minimal base image. 'scratch' is the smallest, 'alpine' is also a good choice.
-FROM scratch
-
-# Set the working directory to the root of your library.
-WORKDIR /usr/src/app
-
-# Copy the built files from the 'builder' stage.
-COPY --from=builder /usr/src/app/dist ./dist
-
-# The final image contains only the 'dist' directory.
-# There is no need for EXPOSE or CMD as this is a component library, not a runnable application.
-
-# You can add a LABEL to describe the image if needed.
-LABEL maintainer="Your Name"
-LABEL version="1.0"