@sfperusacdev/sf-ui 0.1.20 → 0.1.22

package/dist/types/src/components/dashboard/TramoCard.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+export type TramoCardTipo = "ida" | "retorno";
+type TramoCardProps = {
+    tipo: TramoCardTipo;
+    /** Hora del tramo (se muestra junto al título, tabular) */
+    hora?: string;
+    /** Cupos disponibles (capacidad de la unidad); se oculta si no hay dato */
+    cupos?: number | null;
+    /** Muestra el sello verde "Unidad apta" bajo el contenido */
+    apto?: boolean;
+    /** Texto del sello (default "Unidad apta") */
+    aptoLabel?: string;
+    children: ReactNode;
+};
+/**
+ * Tarjeta de tramo Ida/Retorno del wizard de programación (mockup transporte):
+ * header gris con icono direccional, título, hora y cupos; cuerpo libre.
+ * Estilos en sf-dashboard.css — sin clases arbitrarias de Tailwind.
+ */
+export declare const TramoCard: ({ tipo, hora, cupos, apto, aptoLabel, children, }: TramoCardProps) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/dashboard/index.d.ts

@@ -1,5 +1,7 @@
 export { Stepper } from './Stepper';
 export type { StepperVariant } from './Stepper';
+export { TramoCard } from './TramoCard';
+export type { TramoCardTipo } from './TramoCard';
 export { Calendar } from './Calendar';
 export { MONTH_NAMES, WEEKDAY_LABELS, toLocalYMD, parseYMD, buildMonthGrid } from './calendarUtils';
 export { DonutGauge, DonutGaugeRow } from './DonutGauge';

package/dist/types/src/components/inputs/Input.d.ts

@@ -11,11 +11,15 @@ type InputProps<TFormValues extends FieldValues> = {
     className?: string;
     placeholder?: string;
     readOnly?: boolean;
+    /** límites nativos para type="number" (y step opcional) */
+    min?: number | string;
+    max?: number | string;
+    step?: number | string;
     onChange?: (value: string) => void;
     icon?: IconType;
     small?: boolean;
     onIconClick?: () => Promise<void> | void;
     onRefresh?: () => Promise<void> | void;
 };
-export declare const Input: <TFormValues extends FieldValues>({ form, name, label, info, required, type, className, placeholder, readOnly, onChange, icon, small, onIconClick, onRefresh, }: InputProps<TFormValues>) => React.JSX.Element;
+export declare const Input: <TFormValues extends FieldValues>({ form, name, label, info, required, type, className, placeholder, readOnly, min, max, step, onChange, icon, small, onIconClick, onRefresh, }: InputProps<TFormValues>) => React.JSX.Element;
 export {};

package/dist/types/src/components/inputs/ToggleCard.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+type ToggleCardProps = {
+    checked: boolean;
+    onChange: (value: boolean) => void;
+    /** Icono opcional junto al título */
+    icon?: ReactNode;
+    title: ReactNode;
+    description?: ReactNode;
+    disabled?: boolean;
+};
+/**
+ * Toggle con tarjeta (mockup transporte: "Repetir de forma continua",
+ * "Duplicar para otra unidad"): switch + título bold + descripción; el borde
+ * y el fondo se acentúan al activarse. Estado controlado por el consumidor —
+ * para formularios react-hook-form usar `Toggle`.
+ *
+ * Reutiliza el riel de `.sf-toggle__track` (CSS compilado de sf-ui): nada de
+ * clases arbitrarias de Tailwind que dependan del escaneo del consumidor.
+ */
+export declare const ToggleCard: ({ checked, onChange, icon, title, description, disabled, }: ToggleCardProps) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/inputs/index.d.ts

@@ -17,6 +17,7 @@ export { Checkbox } from './Checkbox';
 export { CheckboxGroup } from './CheckboxGroup';
 export { RadioGroup } from './RadioGroup';
 export { Toggle } from './Toggle';
+export { ToggleCard } from './ToggleCard';
 export { BooleanCheckbox } from './BooleanCheckbox';
 export { YesNoSelect } from './YesNoSelect';
 export { SmartInput } from './SmartInput';

package/dist/types/src/components/layout/SummaryItem.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+type SummaryItemProps = {
+    label: ReactNode;
+    value: ReactNode;
+    className?: string;
+};
+/**
+ * Item de resumen (mockup transporte, paso Confirmar del wizard):
+ * label en versalitas chicas + valor en bold. Pensado para grillas de
+ * 2 columnas dentro de una tarjeta de resumen.
+ * Estilos en sf-layout.css — sin clases arbitrarias de Tailwind.
+ */
+export declare const SummaryItem: ({ label, value, className }: SummaryItemProps) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/layout/index.d.ts

@@ -18,6 +18,7 @@ export { Accordion } from './Accordion';
 export type { AccordionItemDef, AccordionProps, AccordionType } from './Accordion';
 export { ScrollArea } from './ScrollArea';
 export type { ScrollAreaProps } from './ScrollArea';
+export { SummaryItem } from './SummaryItem';
 export type { FormWizardFooterVariant, FormWizardProps, FormWizardShell, FormWizardStep, UseFormWizardOptions, } from './FormWizard';
 export { FormWizard, useFormWizard } from './FormWizard';
 export { MasterDetailLayout, MasterDetailListItem } from './MasterDetailLayout';

package/dist/types/src/components/range-inputs/DateRangeFields.d.ts

@@ -0,0 +1,37 @@
+import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
+export type DateRangeAdjustEnd = "start" | "month-end" | "none";
+type DateRangeFieldsProps<TFormValues extends FieldValues> = {
+    form: UseFormReturn<TFormValues>;
+    startName: Path<TFormValues>;
+    endName: Path<TFormValues>;
+    startLabel?: string;
+    endLabel?: string;
+    required?: boolean;
+    /** por defecto hereda `required`; útil para rangos con fin opcional */
+    endRequired?: boolean;
+    small?: boolean;
+    readOnlyEnd?: boolean;
+    /**
+     * Qué hacer cuando el fin queda antes del inicio:
+     * - "start": el fin se iguala al inicio (default)
+     * - "month-end": el fin salta al último día del mes del inicio (contratos)
+     * - "none": no autocorrige (el `min` nativo igual limita el calendario)
+     */
+    adjustEnd?: DateRangeAdjustEnd;
+    /** notifica la autocorrección (para que el consumidor muestre su toast) */
+    onEndAdjusted?: (nuevaFecha: string) => void;
+    className?: string;
+};
+/**
+ * Par de fechas Desde/Hasta ligado a DOS campos planos del formulario
+ * (p.ej. `fecha_inicio` / `fecha_fin` de un entity), cada uno con su label.
+ * El calendario del fin no permite fechas anteriores al inicio (min nativo)
+ * y, si igual queda un rango invertido (tipeo manual, cambio del inicio),
+ * el fin se autocorrige según `adjustEnd`.
+ *
+ * Diferencia con `DateRangeInput`: aquel es UN solo campo cuyo valor es un
+ * objeto `{start, end}` (con soporte UTC) — ideal para filtros; este mapea
+ * directo a columnas del entity, que es el caso de los mantenimientos.
+ */
+export declare const DateRangeFields: <TFormValues extends FieldValues>({ form, startName, endName, startLabel, endLabel, required, endRequired, small, readOnlyEnd, adjustEnd, onEndAdjusted, className, }: DateRangeFieldsProps<TFormValues>) => import("react").JSX.Element;
+export {};

package/dist/types/src/components/range-inputs/index.d.ts

@@ -1,5 +1,7 @@
 export { DateRangeInput } from './DateRangeInput';
 export type { DateRangeInputProps } from './DateRangeInput';
+export { DateRangeFields } from './DateRangeFields';
+export type { DateRangeAdjustEnd } from './DateRangeFields';
 export { DateRangeUtcInput } from './DateRangeUtcInput';
 export { TimeRangeInput } from './TimeRangeInput';
 export type { TimeRangeInputProps } from './TimeRangeInput';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sfperusacdev/sf-ui",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "description": "SF UI — librería de componentes React (inputs, tablas, hooks) para aplicaciones SF Perú.",
   "type": "module",
   "main": "./dist/sf-ui.umd.cjs",