@soyfri/shared-library 2.0.0-beta.19 → 2.0.0-beta.20

package/dist/formField.sx-Cmhj9iGb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"formField.sx-Cmhj9iGb.js","sources":["../src/components/_shared/formField.sx.ts"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nimport {\n  LABEL_COLOR_FILLED,\n  LABEL_COLOR_FOCUSED,\n  LABEL_COLOR_REST,\n  LABEL_FONT_WEIGHT_FILLED,\n  LABEL_MARGIN_TOP,\n  LABEL_SHRINK_TRANSFORM,\n  LABEL_TRANSFORM_ORIGIN,\n  LABEL_TRANSITION,\n} from '../../theme/tokens';\n\nexport type LabelPosition = 'outside' | 'floating';\n\nexport interface BuildFormFieldSxOptions {\n  borderRadius: number | string;\n  labelPosition: LabelPosition;\n  /**\n   * Si es `true`, los selectores incluyen también la API nueva de MUI X\n   * Pickers (v8): `MuiPickersInputBase-root`, `MuiPickersOutlinedInput-*`.\n   */\n  includePickersApi?: boolean;\n  /**\n   * Selectores/valores extra que se mergean SOLO cuando labelPosition === 'outside'.\n   * Usar para paddings específicos del componente (p.ej. MuiAutocomplete-input).\n   */\n  extraOutsideSx?: Record<string, any>;\n  /**\n   * Selectores/valores extra que se mergean SOLO cuando labelPosition === 'floating'.\n   */\n  extraFloatingSx?: Record<string, any>;\n  /**\n   * Cuando es `true`, se emiten sólo los estilos estructurales de layout\n   * (marginTop, posición del label, notch oculto, helpers) y se omiten los\n   * estilos visuales (colores del label, borderRadius del input base).\n   *\n   * Usar cuando el consumer registra un preset de host: el preset asume el\n   * control visual total, y los `styleOverrides` del host pueden actuar sin\n   * ser bloqueados por los estilos inline de la librería.\n   */\n  layoutOnly?: boolean;\n}\n\nconst toRadius = (borderRadius: number | string) =>\n  typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n/**\n * Builder del sx compartido por todos los campos de formulario\n * (Input/Select/Autocomplete/DatePicker/DateTimePicker).\n *\n * Produce:\n * - en modo \"floating\": sólo el border-radius del outlined input;\n * - en modo \"outside\": todo el pack (margen superior, label flotante afuera,\n *   input base, notched outline oculto, helper text sin margen izquierdo).\n *\n * Componentes con paddings o selectores propios pueden inyectarlos vía\n * `extraOutsideSx` / `extraFloatingSx`.\n */\nexport const buildFormFieldSx = ({\n  borderRadius,\n  labelPosition,\n  includePickersApi = false,\n  extraOutsideSx,\n  extraFloatingSx,\n  layoutOnly = false,\n}: BuildFormFieldSxOptions): SxProps<Theme> => {\n  const radius = toRadius(borderRadius);\n\n  // ── Selectores (alternan según la API de pickers) ────────────────────\n  const outlinedRootSelector = includePickersApi\n    ? '& .MuiOutlinedInput-root, & .MuiPickersOutlinedInput-root'\n    : '& .MuiOutlinedInput-root';\n\n  const inputBaseSelector = includePickersApi\n    ? '& .MuiInputBase-root, & .MuiPickersInputBase-root'\n    : '& .MuiInputBase-root';\n\n  const notchedOutlineSelector = includePickersApi\n    ? '& .MuiOutlinedInput-notchedOutline, & .MuiPickersOutlinedInput-notchedOutline'\n    : '& .MuiOutlinedInput-notchedOutline';\n\n  // ── Floating ─────────────────────────────────────────────────────────\n  if (labelPosition === 'floating') {\n    return {\n      // Visual borderRadius only when no preset — preset controls it when layoutOnly.\n      ...(!layoutOnly && { [outlinedRootSelector]: { borderRadius: radius } }),\n      ...(extraFloatingSx ?? {}),\n    };\n  }\n\n  // ── Outside ──────────────────────────────────────────────────────────\n  return {\n    marginTop: LABEL_MARGIN_TOP,\n\n    '& .MuiInputLabel-root': {\n      // Visual label colors omitted when layoutOnly — host styleOverrides or preset handles them.\n      ...(!layoutOnly && { color: LABEL_COLOR_REST }),\n      transition: LABEL_TRANSITION,\n\n      // Estado shrunk (focused o con valor): flota ARRIBA del input.\n      '&.MuiInputLabel-shrink': {\n        transform: LABEL_SHRINK_TRANSFORM,\n        transformOrigin: LABEL_TRANSFORM_ORIGIN,\n        ...(!layoutOnly && {\n          color: LABEL_COLOR_FILLED,\n          fontWeight: LABEL_FONT_WEIGHT_FILLED,\n        }),\n      },\n\n      ...(!layoutOnly && { '&.Mui-focused': { color: LABEL_COLOR_FOCUSED } }),\n    },\n\n    // Input base — centra verticalmente (clásico y, si aplica, pickers).\n    [inputBaseSelector]: {\n      // Visual borderRadius omitted when layoutOnly — preset sets it on the root.\n      ...(!layoutOnly && { borderRadius: radius }),\n      display: 'flex',\n      alignItems: 'center',\n    },\n\n    // El label flota afuera: ocultar legend del notch.\n    [notchedOutlineSelector]: {\n      top: 0,\n      '& legend': { display: 'none' },\n    },\n\n    '& .MuiFormHelperText-root': {\n      marginLeft: 0,\n    },\n\n    ...(extraOutsideSx ?? {}),\n  };\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AA4CA,MAAM,WAAW,CAAC,iBAChB,OAAO,iBAAiB,WAAW,GAAG,YAAY,OAAO;AAcpD,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB;AAAA,EACA;AAAA,EACA,aAAa;AACf,MAA+C;AAC7C,QAAM,SAAS,SAAS,YAAY;AAGpC,QAAM,uBAAuB,oBACzB,8DACA;AAEJ,QAAM,oBAAoB,oBACtB,sDACA;AAEJ,QAAM,yBAAyB,oBAC3B,kFACA;AAGJ,MAAI,kBAAkB,YAAY;AAChC,WAAO,kCAED,CAAC,cAAc,EAAE,CAAC,oBAAoB,GAAG,EAAE,cAAc,SAAO,IAChE,4CAAmB,CAAA;AAAA,EAE3B;AAGA,SAAO;AAAA,IACL,WAAW;AAAA,IAEX,yBAAyB,gDAEnB,CAAC,cAAc,EAAE,OAAO,iBAAA,IAFL;AAAA,MAGvB,YAAY;AAAA;AAAA,MAGZ,0BAA0B;AAAA,QACxB,WAAW;AAAA,QACX,iBAAiB;AAAA,SACb,CAAC,cAAc;AAAA,QACjB,OAAO;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,QAIZ,CAAC,cAAc,EAAE,iBAAiB,EAAE,OAAO,sBAAoB;AAAA;AAAA,IAIrE,CAAC,iBAAiB,GAAG,iCAEf,CAAC,cAAc,EAAE,cAAc,OAAA,IAFhB;AAAA,MAGnB,SAAS;AAAA,MACT,YAAY;AAAA,IAAA;AAAA;AAAA,IAId,CAAC,sBAAsB,GAAG;AAAA,MACxB,KAAK;AAAA,MACL,YAAY,EAAE,SAAS,OAAA;AAAA,IAAO;AAAA,IAGhC,6BAA6B;AAAA,MAC3B,YAAY;AAAA,IAAA;AAAA,KAGV,0CAAkB,CAAA;AAE1B;"}

package/dist/formField.sx-V9PLO0wv.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"formField.sx-V9PLO0wv.cjs","sources":["../src/components/_shared/formField.sx.ts"],"sourcesContent":["import type { SxProps, Theme } from '@mui/material/styles';\n\nimport {\n  LABEL_COLOR_FILLED,\n  LABEL_COLOR_FOCUSED,\n  LABEL_COLOR_REST,\n  LABEL_FONT_WEIGHT_FILLED,\n  LABEL_MARGIN_TOP,\n  LABEL_SHRINK_TRANSFORM,\n  LABEL_TRANSFORM_ORIGIN,\n  LABEL_TRANSITION,\n} from '../../theme/tokens';\n\nexport type LabelPosition = 'outside' | 'floating';\n\nexport interface BuildFormFieldSxOptions {\n  borderRadius: number | string;\n  labelPosition: LabelPosition;\n  /**\n   * Si es `true`, los selectores incluyen también la API nueva de MUI X\n   * Pickers (v8): `MuiPickersInputBase-root`, `MuiPickersOutlinedInput-*`.\n   */\n  includePickersApi?: boolean;\n  /**\n   * Selectores/valores extra que se mergean SOLO cuando labelPosition === 'outside'.\n   * Usar para paddings específicos del componente (p.ej. MuiAutocomplete-input).\n   */\n  extraOutsideSx?: Record<string, any>;\n  /**\n   * Selectores/valores extra que se mergean SOLO cuando labelPosition === 'floating'.\n   */\n  extraFloatingSx?: Record<string, any>;\n  /**\n   * Cuando es `true`, se emiten sólo los estilos estructurales de layout\n   * (marginTop, posición del label, notch oculto, helpers) y se omiten los\n   * estilos visuales (colores del label, borderRadius del input base).\n   *\n   * Usar cuando el consumer registra un preset de host: el preset asume el\n   * control visual total, y los `styleOverrides` del host pueden actuar sin\n   * ser bloqueados por los estilos inline de la librería.\n   */\n  layoutOnly?: boolean;\n}\n\nconst toRadius = (borderRadius: number | string) =>\n  typeof borderRadius === 'number' ? `${borderRadius}px` : borderRadius;\n\n/**\n * Builder del sx compartido por todos los campos de formulario\n * (Input/Select/Autocomplete/DatePicker/DateTimePicker).\n *\n * Produce:\n * - en modo \"floating\": sólo el border-radius del outlined input;\n * - en modo \"outside\": todo el pack (margen superior, label flotante afuera,\n *   input base, notched outline oculto, helper text sin margen izquierdo).\n *\n * Componentes con paddings o selectores propios pueden inyectarlos vía\n * `extraOutsideSx` / `extraFloatingSx`.\n */\nexport const buildFormFieldSx = ({\n  borderRadius,\n  labelPosition,\n  includePickersApi = false,\n  extraOutsideSx,\n  extraFloatingSx,\n  layoutOnly = false,\n}: BuildFormFieldSxOptions): SxProps<Theme> => {\n  const radius = toRadius(borderRadius);\n\n  // ── Selectores (alternan según la API de pickers) ────────────────────\n  const outlinedRootSelector = includePickersApi\n    ? '& .MuiOutlinedInput-root, & .MuiPickersOutlinedInput-root'\n    : '& .MuiOutlinedInput-root';\n\n  const inputBaseSelector = includePickersApi\n    ? '& .MuiInputBase-root, & .MuiPickersInputBase-root'\n    : '& .MuiInputBase-root';\n\n  const notchedOutlineSelector = includePickersApi\n    ? '& .MuiOutlinedInput-notchedOutline, & .MuiPickersOutlinedInput-notchedOutline'\n    : '& .MuiOutlinedInput-notchedOutline';\n\n  // ── Floating ─────────────────────────────────────────────────────────\n  if (labelPosition === 'floating') {\n    return {\n      // Visual borderRadius only when no preset — preset controls it when layoutOnly.\n      ...(!layoutOnly && { [outlinedRootSelector]: { borderRadius: radius } }),\n      ...(extraFloatingSx ?? {}),\n    };\n  }\n\n  // ── Outside ──────────────────────────────────────────────────────────\n  return {\n    marginTop: LABEL_MARGIN_TOP,\n\n    '& .MuiInputLabel-root': {\n      // Visual label colors omitted when layoutOnly — host styleOverrides or preset handles them.\n      ...(!layoutOnly && { color: LABEL_COLOR_REST }),\n      transition: LABEL_TRANSITION,\n\n      // Estado shrunk (focused o con valor): flota ARRIBA del input.\n      '&.MuiInputLabel-shrink': {\n        transform: LABEL_SHRINK_TRANSFORM,\n        transformOrigin: LABEL_TRANSFORM_ORIGIN,\n        ...(!layoutOnly && {\n          color: LABEL_COLOR_FILLED,\n          fontWeight: LABEL_FONT_WEIGHT_FILLED,\n        }),\n      },\n\n      ...(!layoutOnly && { '&.Mui-focused': { color: LABEL_COLOR_FOCUSED } }),\n    },\n\n    // Input base — centra verticalmente (clásico y, si aplica, pickers).\n    [inputBaseSelector]: {\n      // Visual borderRadius omitted when layoutOnly — preset sets it on the root.\n      ...(!layoutOnly && { borderRadius: radius }),\n      display: 'flex',\n      alignItems: 'center',\n    },\n\n    // El label flota afuera: ocultar legend del notch.\n    [notchedOutlineSelector]: {\n      top: 0,\n      '& legend': { display: 'none' },\n    },\n\n    '& .MuiFormHelperText-root': {\n      marginLeft: 0,\n    },\n\n    ...(extraOutsideSx ?? {}),\n  };\n};\n"],"names":["LABEL_MARGIN_TOP","LABEL_COLOR_REST","LABEL_TRANSITION","LABEL_SHRINK_TRANSFORM","LABEL_TRANSFORM_ORIGIN","LABEL_COLOR_FILLED","LABEL_FONT_WEIGHT_FILLED","LABEL_COLOR_FOCUSED"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA4CA,MAAM,WAAW,CAAC,iBAChB,OAAO,iBAAiB,WAAW,GAAG,YAAY,OAAO;AAcpD,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB;AAAA,EACA;AAAA,EACA,aAAa;AACf,MAA+C;AAC7C,QAAM,SAAS,SAAS,YAAY;AAGpC,QAAM,uBAAuB,oBACzB,8DACA;AAEJ,QAAM,oBAAoB,oBACtB,sDACA;AAEJ,QAAM,yBAAyB,oBAC3B,kFACA;AAGJ,MAAI,kBAAkB,YAAY;AAChC,WAAO,kCAED,CAAC,cAAc,EAAE,CAAC,oBAAoB,GAAG,EAAE,cAAc,SAAO,IAChE,4CAAmB,CAAA;AAAA,EAE3B;AAGA,SAAO;AAAA,IACL,WAAWA,OAAAA;AAAAA,IAEX,yBAAyB,gDAEnB,CAAC,cAAc,EAAE,OAAOC,wBAAA,IAFL;AAAA,MAGvB,YAAYC,OAAAA;AAAAA;AAAAA,MAGZ,0BAA0B;AAAA,QACxB,WAAWC,OAAAA;AAAAA,QACX,iBAAiBC,OAAAA;AAAAA,SACb,CAAC,cAAc;AAAA,QACjB,OAAOC,OAAAA;AAAAA,QACP,YAAYC,OAAAA;AAAAA,MAAA;AAAA,QAIZ,CAAC,cAAc,EAAE,iBAAiB,EAAE,OAAOC,OAAAA,sBAAoB;AAAA;AAAA,IAIrE,CAAC,iBAAiB,GAAG,iCAEf,CAAC,cAAc,EAAE,cAAc,OAAA,IAFhB;AAAA,MAGnB,SAAS;AAAA,MACT,YAAY;AAAA,IAAA;AAAA;AAAA,IAId,CAAC,sBAAsB,GAAG;AAAA,MACxB,KAAK;AAAA,MACL,YAAY,EAAE,SAAS,OAAA;AAAA,IAAO;AAAA,IAGhC,6BAA6B;AAAA,MAC3B,YAAY;AAAA,IAAA;AAAA,KAGV,0CAAkB,CAAA;AAE1B;;"}