@stackcraftmx/calcita 0.51.0 → 0.53.0

package/dist/types/hookForm/FormTextField.d.ts

@@ -1,8 +1,8 @@
 /**
- * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
- *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'> & Partial<Pick<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'onChange'|'onBlur'>>} props las del campo de la casa, sin
+ *     value ni error (su onChange y su onBlur corren después de los del formulario); control: el de useForm, si la pantalla no usa FormProvider
  */
 export default function FormTextField({ name, control, ...inputProps }: {
     name: string;
     control?: object;
-} & Omit<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;
+} & Omit<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'> & Partial<Pick<Parameters<typeof import('../inputs/TextInput.js').default>[0], 'onChange' | 'onBlur'>>): import("react").JSX.Element;

package/dist/types/hookForm/FormTransferListField.d.ts

@@ -1,8 +1,8 @@
 /**
- * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/TransferListInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las del campo de la casa, sin
- *     value / onChange / onBlur / error; control: el de useForm, si la pantalla no usa FormProvider
+ * @param {{name: string, control?: object} & Omit<Parameters<typeof import('../inputs/TransferListInput.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'> & Partial<Pick<Parameters<typeof import('../inputs/TransferListInput.js').default>[0], 'onChange'|'onBlur'>>} props las del campo de la casa, sin
+ *     value ni error (su onChange y su onBlur corren después de los del formulario); control: el de useForm, si la pantalla no usa FormProvider
  */
 export default function FormTransferListField({ name, control, ...inputProps }: {
     name: string;
     control?: object;
-} & Omit<Parameters<typeof import('../inputs/TransferListInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;
+} & Omit<Parameters<typeof import('../inputs/TransferListInput.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'> & Partial<Pick<Parameters<typeof import('../inputs/TransferListInput.js').default>[0], 'onChange' | 'onBlur'>>): import("react").JSX.Element;

package/dist/types/hookForm/FormWizard.d.ts

@@ -6,17 +6,30 @@
  * @param {string[]} [props.steps[].fields] los campos del paso (los que revisa «Siguiente»)
  * @param {boolean} [props.steps[].optional] se puede omitir
  * @param {import('react').ReactNode} props.steps[].content los campos del paso
+ * @param {boolean} [props.steps[].completed] lleva la palomita (cuando los títulos se pulsan, solo si la pantalla lo dice)
  * @param {string} props.submitLabel ya traducido: el botón del último paso
+ * @param {'horizontal'|'vertical'} [props.orientation] uno de WIZARD_ORIENTATION; por omisión horizontal
+ * @param {boolean} [props.hideBackOnFirstStep] en el primer paso no se pinta «Anterior»; por omisión sale apagado, como antes
+ * @param {string} [props.initialStepKey] la llave del paso en el que se abre (la que diga el servidor); por omisión el primero
+ * @param {'none'|'free'|'checked'} [props.stepSelection] uno de WIZARD_STEP_SELECTION: si el título de otro paso se pulsa y qué
+ *   revisa antes; por omisión none (se avanza con «Siguiente», como siempre)
+ * @param {(stepKey: string, index: number) => void} [props.onStepChange] cada vez que cambia el paso abierto
  * @param {object} [props.texts] los textos que cambian, con la forma de `common`: {wizard: {next, back, skip, optional, skipped, stepOf}}
  */
-export default function FormWizard({ steps, submitLabel, texts, ...unknownProps }: {
+export default function FormWizard({ steps, submitLabel, orientation, hideBackOnFirstStep, initialStepKey, stepSelection, onStepChange, texts, ...unknownProps }: {
     steps: {
         key: string;
         label: string;
         fields?: string[];
         optional?: boolean;
         content: import('react').ReactNode;
+        completed?: boolean;
     }[];
     submitLabel: string;
+    orientation?: 'horizontal' | 'vertical';
+    hideBackOnFirstStep?: boolean;
+    initialStepKey?: string;
+    stepSelection?: 'none' | 'free' | 'checked';
+    onStepChange?: (stepKey: string, index: number) => void;
     texts?: object;
 }): import("react").JSX.Element;

package/dist/types/hookForm/useHookFormField.d.ts

@@ -1,13 +1,17 @@
 /**
  * @param {string} name el campo del formulario
  * @param {object} [control] el de useForm, si la pantalla no usa FormProvider
- * @returns {{name: string, value: unknown, onChange: (value: unknown) => void, onBlur: () => void, inputRef: Function, error: unknown}}
+ * @param {{onChange?: Function, onBlur?: Function}} [screen] lo que la pantalla le dijo al campo
+ * @returns {{name: string, value: unknown, onChange: (value: unknown, ...rest: unknown[]) => void, onBlur: (...args: unknown[]) => void, inputRef: Function, error: unknown}}
  */
-export declare function useHookFormField(name: string, control?: object): {
+export declare function useHookFormField(name: string, control?: object, screen?: {
+    onChange?: Function;
+    onBlur?: Function;
+}): {
     name: string;
     value: unknown;
-    onChange: (value: unknown) => void;
-    onBlur: () => void;
+    onChange: (value: unknown, ...rest: unknown[]) => void;
+    onBlur: (...args: unknown[]) => void;
     inputRef: Function;
     error: unknown;
 };

package/dist/types/index.d.ts

@@ -10,7 +10,7 @@ export { createPathIndex, fillPath } from './toolkit/pathIndex.js';
 export { combineTexts } from './toolkit/combineTexts.js';
 export { default as toolkitTextsEs } from './locales/es.js';
 export { default as toolkitTextsEn } from './locales/en.js';
-export { ConfirmDialog, ModalWaiting, NEW_BUILD_NOTICE_VARIANT, NewBuildNotice, StaleBuildBoundary, TOAST_DEFAULT_OPTIONS, Toaster, confirmActionMachine, dismissToast, errorsObjectToMessage, toastDefault, toastError, toastInfo, toastLoading, toastProblem, toastPromise, toastSuccess, toastWarn, useConfirmAction, } from './feedback/index.js';
+export { ConfirmDialog, ModalWaiting, NEW_BUILD_NOTICE_VARIANT, NewBuildNotice, StaleBuildBoundary, TOAST_DEFAULT_OPTIONS, TOASTER_POSITION, Toaster, confirmActionMachine, dismissToast, errorsObjectToMessage, toastDefault, toastError, toastInfo, toastLoading, toastProblem, toastPromise, toastSuccess, toastWarn, useConfirmAction, } from './feedback/index.js';
 export { DEFAULT_FILE_TYPES, DOWNLOAD_STATUS, DownloadManager, UNKNOWN_FILE_TYPE, cancelDownload, clearFinishedDownloads, downloadsMachine, startDownload, useFileTypes, } from './downloads/index.js';
 export { THEME_LOOK, TOP_BAR, createToolkitTheme } from './theme/createToolkitTheme.js';
 export { isAndroidDevice } from './theme/androidDevice.js';
@@ -62,13 +62,13 @@ export { transferProgressOf } from './upload/transferProgress.js';
 export { useFilePicker } from './upload/useFilePicker.js';
 export { buildUploadActors, uploadMachine } from './upload/uploadMachine.js';
 export { uploadWithProgress } from './upload/uploadWithProgress.js';
-export { APP_BAR_HEIGHT_CSS_VARIABLE, BackButton, COMPARISON_OPERATOR, FILTER_DRAWER_ANCHOR, FILTER_FIELD_KIND, FilterDrawer, activeDrawerFilterCountOf, comparisonOf, comparisonTextOf, filterDrawerChipsOf, filterDrawerDefaultsOf, filterDrawerKindsOf, filterKeysOf, CHART_VIEW, CalendarHeatmap, CollapsibleSection, ColorSchemeToggle, ContentDialog, CopyButton, DateRangeFilter, DefinitionList, DetailHeader, DictionaryText, DocumentTitle, DownloadMenu, FONT_SIZE_LEVELS, FontSizeToggle, FullPageLoader, GlassLensFilter, GlassPanel, HELP_CLOSE_REASON, HelpButton, HelpCarouselDialog, ICON_BADGE_CLASSES, ICON_BADGE_VARIANT, IconBadge, LANGUAGES, LanguageToggle, MetricCard, PageBreadcrumbs, PageHeader, PageHeading, ProfileHeader, ROUTE_TABS_MODE, RecordCard, RecordCardSkeleton, RouteTabs, TREND_DIRECTION, PeriodRangeSelector, QuickFilters, SCROLL_MARGIN_BELOW_APP_BAR, SEGMENTED_CONTROL_SX, ScrollableRow, SecretField, SectionCard, SegmentedControl, StatusChip, TableToggle, Tag, scrollableRow, tableRowTextOf, useActiveRouteTab, useAppBarHeightPublisher, useHelpCarousel, } from './ui/index.js';
+export { APP_BAR_HEIGHT_CSS_VARIABLE, BackButton, COMPARISON_OPERATOR, FILTER_DRAWER_ANCHOR, FILTER_FIELD_KIND, FilterDrawer, activeDrawerFilterCountOf, comparisonOf, comparisonTextOf, filterDrawerChipsOf, filterDrawerDefaultsOf, filterDrawerKindsOf, filterKeysOf, CHART_VIEW, CalendarHeatmap, CollapsibleSection, ColorSchemeToggle, ContentDialog, CopyButton, DateRangeFilter, DefinitionList, DetailHeader, DictionaryText, DocumentTitle, DownloadMenu, FONT_SIZE_LEVELS, FontSizeToggle, FullPageLoader, GlassLensFilter, GlassPanel, HELP_CLOSE_REASON, HelpButton, HelpCarouselDialog, ICON_BADGE_CLASSES, ICON_BADGE_VARIANT, IconBadge, LANGUAGES, LanguageToggle, MetricCard, PageBreadcrumbs, PageHeader, PageHeading, ProfileHeader, ROUTE_TABS_MODE, RECORD_CARD_FOOTER_ALIGN, RecordCard, RecordCardSkeleton, RouteTabs, TREND_DIRECTION, PeriodRangeSelector, QuickFilters, SCROLL_MARGIN_BELOW_APP_BAR, SEGMENTED_CONTROL_SX, ScrollableRow, SecretField, SectionCard, SegmentedControl, StatusChip, TableToggle, Tag, scrollableRow, tableRowTextOf, useActiveRouteTab, useAppBarHeightPublisher, useHelpCarousel, } from './ui/index.js';
 export { default as CatalogInput } from './inputs/CatalogInput.js';
 export { default as ColorInput } from './inputs/ColorInput.js';
 export { default as FieldFrame } from './inputs/FieldFrame.js';
 export { default as MaskedInput } from './inputs/MaskedInput.js';
 export { INPUT_MASK, isMaskComplete, maskPatternOf, maskedTextOf, rawValueOf } from './inputs/inputMasks.js';
-export { FORM_ROW_CLASS, FormRow, default as FormSection } from './inputs/FormSection.js';
+export { FORM_LABEL_PLACEMENT, FORM_ROW_CLASS, FormRow, default as FormSection } from './inputs/FormSection.js';
 export { default as CheckboxGroupInput } from './inputs/CheckboxGroupInput.js';
 export { default as NumberInput } from './inputs/NumberInput.js';
 export { default as TransferListInput } from './inputs/TransferListInput.js';
@@ -77,6 +77,7 @@ export { default as RepeatingFields } from './inputs/RepeatingFields.js';
 export { useRowKeys } from './inputs/useRowKeys.js';
 export { default as SelectInput } from './inputs/SelectInput.js';
 export { default as WizardLayout } from './inputs/WizardLayout.js';
+export { WIZARD_ORIENTATION, WIZARD_STEP_SELECTION, isStepCompleted, openingStepOf, stepSelectionActionOf } from './inputs/wizardSteps.js';
 export { default as TextInput } from './inputs/TextInput.js';
 export { HEX_COLOR, MIN_CONTRAST, contrastOnWhite, readableVariantOf } from './inputs/colorContrast.js';
 export { cleanNumberText, completeDecimals, groupThousands } from './inputs/numberText.js';

package/dist/types/inputs/CatalogInput.d.ts

@@ -20,6 +20,7 @@ declare const CatalogInput: (props: {
     loading?: boolean;
     placeholder?: string;
     disabled?: boolean;
+    required?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
     multiple?: boolean;
     selectAll?: boolean;

package/dist/types/inputs/CheckboxGroupInput.d.ts

@@ -18,6 +18,7 @@ declare const CheckboxGroupInput: (props: {
     };
     helperText?: string;
     disabled?: boolean;
+    required?: boolean;
     sx?: object;
     messages?: Record<string, string | object>;
     texts?: object;

package/dist/types/inputs/ColorInput.d.ts

@@ -11,6 +11,7 @@ declare const ColorInput: (props: {
     helperText?: string;
     checkContrast?: boolean;
     disabled?: boolean;
+    required?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
     messages?: Record<string, string | object>;
     texts?: object;

package/dist/types/inputs/FieldFrame.d.ts

@@ -2,6 +2,7 @@ declare const FieldFrame: (props: {
     inputId: string;
     labelId?: string;
     label: import('react').ReactNode;
+    required?: boolean;
     children: import('react').ReactNode;
 } & {
     slots?: Record<string, import('react').ElementType>;

package/dist/types/inputs/FormSection.d.ts

@@ -1,3 +1,11 @@
+/**
+ * Dónde va la etiqueta de cada renglón: a la izquierda siempre (side, lo de siempre) o arriba del campo en el teléfono
+ * (topOnPhone: por debajo de `sm` en el tema; más ancho, a la izquierda).
+ */
+export declare const FORM_LABEL_PLACEMENT: Readonly<{
+    side: "side";
+    topOnPhone: "topOnPhone";
+}>;
 /** La clase de cada renglón: la sección le dibuja su línea de arriba, esté donde esté adentro de la tarjeta. */
 export declare const FORM_ROW_CLASS = "calcita-form-row";
 /**
@@ -8,22 +16,27 @@ export declare const FORM_ROW_CLASS = "calcita-form-row";
  * @param {import('react').ReactNode} props.label ya traducida
  * @param {string} [props.htmlFor] el id del campo que nombra la etiqueta
  * @param {string} [props.labelId] el id de la etiqueta (para un campo que la nombra con aria-labelledby)
+ * @param {boolean} [props.required] el asterisco en la etiqueta (el lector de pantalla no lo lee: el campo ya lo dice)
  * @param {import('react').ReactNode} props.children
  */
 export declare function FormRow(props: {
     label: import('react').ReactNode;
     htmlFor?: string;
     labelId?: string;
+    required?: boolean;
     children: import('react').ReactNode;
 }): import("react").JSX.Element;
 /**
  * @param {object} props
  * @param {string} [props.title] ya traducido; va arriba de la tarjeta
  * @param {import('react').ReactNode} [props.footer] la explicación, abajo de la tarjeta
+ * @param {string} [props.labelPlacement] uno de FORM_LABEL_PLACEMENT: side (por omisión, la etiqueta a la izquierda) o
+ *     topOnPhone (arriba del campo por debajo de `sm`)
  * @param {import('react').ReactNode} props.children los campos, directo o dentro de un Grid, un Stack o un componente propio
  */
 export default function FormSection(props: {
     title?: string;
     footer?: import('react').ReactNode;
+    labelPlacement?: string;
     children: import('react').ReactNode;
 }): import("react").JSX.Element;

package/dist/types/inputs/NumberInput.d.ts

@@ -15,6 +15,7 @@ declare const NumberInput: (props: {
     suffix?: import('react').ReactNode;
     maxDigits?: number;
     disabled?: boolean;
+    required?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
     messages?: Record<string, string | object>;
     texts?: object;

package/dist/types/inputs/SelectInput.d.ts

@@ -17,6 +17,7 @@ declare const SelectInput: (props: {
     helperText?: string;
     placeholder?: string;
     disabled?: boolean;
+    required?: boolean;
     inputRef?: import('react').Ref<HTMLInputElement>;
     multiple?: boolean;
     selectAll?: boolean;

package/dist/types/inputs/TextInput.d.ts

@@ -22,7 +22,7 @@
  * @param {string} [props.autoComplete]
  * @param {boolean} [props.autoFocus]
  * @param {boolean} [props.disabled]
- * @param {boolean} [props.required]
+ * @param {boolean} [props.required] obligatorio: el asterisco en la etiqueta y, como en MUI, required en el campo
  * @param {boolean} [props.fullWidth]
  * @param {string} [props.id]
  * @param {object} [props.slotProps]

package/dist/types/inputs/TransferListInput.d.ts

@@ -20,6 +20,7 @@ declare const TransferListInput: (props: {
     };
     helperText?: string;
     disabled?: boolean;
+    required?: boolean;
     sx?: object;
     messages?: Record<string, string | object>;
     texts?: object;

package/dist/types/inputs/WizardLayout.d.ts

@@ -3,14 +3,18 @@ declare const WizardLayout: (props: {
         key: string;
         label: string;
         optional?: boolean;
+        completed?: boolean;
         content: import('react').ReactNode;
     }[];
     activeIndex: number;
-    skippedKeys: Set<string>;
+    skippedKeys?: Set<string>;
     isSubmitting?: boolean;
+    orientation?: 'horizontal' | 'vertical';
+    hideBackOnFirstStep?: boolean;
     onBack: () => void;
     onNext: () => void;
-    onSkip: () => void;
+    onSkip?: () => void;
+    onStepSelect?: (index: number) => void;
     submitButton: import('react').ReactNode;
     problemAlert?: import('react').ReactNode;
     texts?: object;

package/dist/types/inputs/formLayoutContext.d.ts

@@ -1,3 +1,10 @@
-export declare const FormSectionContext: import("react").Context<boolean>;
+/** @type {import('react').Context<false|{labelPlacement: string}>} */
+export declare const FormSectionContext: import('react').Context<false | {
+    labelPlacement: string;
+}>;
 /** true si el campo va dentro de una FormSection. */
 export declare const useIsInsideFormSection: () => boolean;
+/** Cómo pide la sección sus renglones ({labelPlacement}); false fuera de una sección. */
+export declare const useFormSectionLayout: () => false | {
+    labelPlacement: string;
+};

package/dist/types/inputs/requiredMark.d.ts

@@ -0,0 +1,9 @@
+/** El atributo que marca la etiqueta de un campo obligatorio. */
+export declare const REQUIRED_LABEL_ATTRIBUTE = "data-required";
+/**
+ * Los estilos de la etiqueta de un campo obligatorio: la marca después del texto, pegada y del mismo color.
+ *
+ * @param {string} mark el texto de la marca, ya traducido (common.form.requiredMark: «*»)
+ * @returns {object} para el sx de la etiqueta
+ */
+export declare function requiredMarkSxOf(mark: string): object;

package/dist/types/inputs/useWizardSteps.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @param {object} options
+ * @param {Array<{key: string}>} options.steps
+ * @param {string} [options.initialStepKey] el paso en el que se abre (el que diga el servidor); por omisión el primero
+ * @param {string} [options.stepSelection] uno de WIZARD_STEP_SELECTION; por omisión none
+ * @param {(stepKey: string, index: number) => void} [options.onStepChange] cada vez que cambia el paso abierto
+ * @param {(index: number) => Promise<boolean>} options.isStepValid revisa los campos de ese paso y marca sus errores
+ * @returns {{activeIndex: number, setActiveIndex: import('react').Dispatch<import('react').SetStateAction<number>>, selectStep: ((index: number) => Promise<void>)|undefined}}
+ *   selectStep es undefined con none: así WizardLayout sabe que los títulos no se pulsan
+ */
+export declare function useWizardSteps({ steps, initialStepKey, stepSelection, onStepChange, isStepValid }: {
+    steps: Array<{
+        key: string;
+    }>;
+    initialStepKey?: string;
+    stepSelection?: string;
+    onStepChange?: (stepKey: string, index: number) => void;
+    isStepValid: (index: number) => Promise<boolean>;
+}): {
+    activeIndex: number;
+    setActiveIndex: import('react').Dispatch<import('react').SetStateAction<number>>;
+    selectStep: ((index: number) => Promise<void>) | undefined;
+};

package/dist/types/inputs/wizardSteps.d.ts

@@ -0,0 +1,65 @@
+/**
+ * Cómo se acomodan los pasos:
+ *   horizontal  los pasos en fila arriba y los campos abajo (lo de siempre; en el teléfono, «Paso 2 de 4» y su nombre);
+ *   vertical    uno debajo del otro, como un acordeón: los campos y los botones van dentro del paso que está abierto.
+ */
+export declare const WIZARD_ORIENTATION: Readonly<{
+    horizontal: "horizontal";
+    vertical: "vertical";
+}>;
+/**
+ * Qué pasa al pulsar el título de otro paso:
+ *   none     los títulos no se pulsan (lo de siempre): se avanza con «Siguiente»;
+ *   free     salta directo, sin revisar el paso en el que está; al enviar, el formulario regresa al primer paso con error;
+ *   checked  salta solo si el paso en el que está no tiene errores (igual que «Siguiente»).
+ */
+export declare const WIZARD_STEP_SELECTION: Readonly<{
+    none: "none";
+    free: "free";
+    checked: "checked";
+}>;
+/**
+ * El paso en el que se abre: el de esa llave (la que dice el servidor) o el primero si no llega.
+ *
+ * @param {Array<{key: string}>} steps
+ * @param {string} [stepKey]
+ * @returns {{index: number, isUnknownKey: boolean}} isUnknownKey: llegó una llave que no es de ningún paso (se abre el primero)
+ */
+export declare function openingStepOf(steps: Array<{
+    key: string;
+}>, stepKey?: string): {
+    index: number;
+    isUnknownKey: boolean;
+};
+/**
+ * ¿Al pulsar el título del paso `targetIndex` hay que revisar antes el paso en el que está? Solo con `checked` y si de veras
+ * cambia de paso. Pulsar el paso en el que ya está no hace nada.
+ *
+ * @param {string} stepSelection uno de WIZARD_STEP_SELECTION
+ * @param {number} activeIndex
+ * @param {number} targetIndex
+ * @returns {'ignore'|'jump'|'checkFirst'}
+ */
+export declare function stepSelectionActionOf(stepSelection: string, activeIndex: number, targetIndex: number): 'ignore' | 'jump' | 'checkFirst';
+/**
+ * ¿El paso se pinta como hecho (la palomita)? En fila y sin pulsar, los de antes del que está abierto, salvo los omitidos
+ * (lo de siempre). Cuando los títulos se pulsan, «antes» ya no quiere decir «hecho» (se pudo brincar): sin palomita, salvo
+ * que la pantalla lo diga en `steps[].completed` (sabe qué datos ya están completos).
+ *
+ * @param {{key: string, completed?: boolean}} step
+ * @param {object} place
+ * @param {number} place.index
+ * @param {number} place.activeIndex
+ * @param {Set<string>} place.skippedKeys
+ * @param {boolean} place.isSelectable
+ * @returns {boolean}
+ */
+export declare function isStepCompleted(step: {
+    key: string;
+    completed?: boolean;
+}, { index, activeIndex, skippedKeys, isSelectable }: {
+    index: number;
+    activeIndex: number;
+    skippedKeys: Set<string>;
+    isSelectable: boolean;
+}): boolean;

package/dist/types/locales/en.d.ts

@@ -134,6 +134,7 @@ declare const _default: Readonly<{
             showPassword: string;
             hidePassword: string;
             clear: string;
+            requiredMark: string;
             selectPlaceholder: string;
             copy: string;
             copied: string;

package/dist/types/locales/es.d.ts

@@ -134,6 +134,7 @@ declare const _default: Readonly<{
             showPassword: string;
             hidePassword: string;
             clear: string;
+            requiredMark: string;
             selectPlaceholder: string;
             copy: string;
             copied: string;

package/dist/types/richText/FormRichTextField.d.ts

@@ -1,7 +1,7 @@
 /**
- * @param {{name: string} & Omit<Parameters<typeof import('./RichTextEditor.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'>} props las de
- *     RichTextEditor (features, maxLength, placeholder…), sin value / onChange / onBlur / error
+ * @param {{name: string} & Omit<Parameters<typeof import('./RichTextEditor.js').default>[0], 'name'|'value'|'onChange'|'onBlur'|'error'> & Partial<Pick<Parameters<typeof import('./RichTextEditor.js').default>[0], 'onChange'|'onBlur'>>} props las de
+ *     RichTextEditor (features, maxLength, placeholder…), sin value ni error (su onChange y su onBlur corren después de los del formulario)
  */
 export default function FormRichTextField({ name, ...editorProps }: {
     name: string;
-} & Omit<Parameters<typeof import('./RichTextEditor.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'>): import("react").JSX.Element;
+} & Omit<Parameters<typeof import('./RichTextEditor.js').default>[0], 'name' | 'value' | 'onChange' | 'onBlur' | 'error'> & Partial<Pick<Parameters<typeof import('./RichTextEditor.js').default>[0], 'onChange' | 'onBlur'>>): import("react").JSX.Element;

package/dist/types/richText/RichTextEditor.d.ts

@@ -17,6 +17,7 @@ declare const RichTextEditor: (props: {
     onEditorReady?: (editor: import('@tiptap/react').Editor) => void;
     minHeight?: number;
     disabled?: boolean;
+    required?: boolean;
     sx?: object;
     messages?: Record<string, string | object>;
     texts?: object;

package/dist/types/toolkit/ToolkitProvider.d.ts

@@ -16,6 +16,9 @@
  *     consola una vez por idioma y llave
  * @param {(namespace: string, key: string, values?: object) => string|undefined} [props.translate] traductor del
  *     proyecto (por ejemplo i18next); undefined deja el texto del paquete
+ * @param {boolean} [props.requiredFromSchema] los campos de formik leen del esquema de yup del formulario (validationSchema)
+ *     qué es obligatorio y le ponen su asterisco: el esquema manda y la pantalla no los marca a mano. Lo que la pantalla diga
+ *     con required gana. Por omisión no (cada campo con su required, como antes)
  * @param {string} [props.timeZone] zona de las fechas (por omisión la del navegador)
  * @param {string} [props.currency] moneda de los montos, código ISO 4217 (por omisión MXN)
  * @param {'h23'|'h12'} [props.hourCycle] la hora de 24 horas («15:10», por omisión) o de 12 con a.m. y p.m. («3:10 p.m.»):
@@ -29,7 +32,7 @@
  *     tiene regla
  * @param {import('react').ReactNode} props.children
  */
-export declare const ToolkitProvider: ({ language, languages, onLanguageChange, onMissingText, readValidationMessage, texts, translate, timeZone, currency, hourCycle, appName, navigation, buildId, canAccess, fileTypes, children, ...unknownProps }: {
+export declare const ToolkitProvider: ({ language, languages, onLanguageChange, onMissingText, readValidationMessage, requiredFromSchema, texts, translate, timeZone, currency, hourCycle, appName, navigation, buildId, canAccess, fileTypes, children, ...unknownProps }: {
     language?: string;
     languages?: Array<{
         code: string;
@@ -51,6 +54,7 @@ export declare const ToolkitProvider: ({ language, languages, onLanguageChange,
         language: string;
     }) => void;
     translate?: (namespace: string, key: string, values?: object) => string | undefined;
+    requiredFromSchema?: boolean;
     timeZone?: string;
     currency?: string;
     hourCycle?: 'h23' | 'h12';

package/dist/types/toolkit/toolkitContext.d.ts

@@ -2,11 +2,12 @@ export declare const ToolkitContext: import("react").Context<null>;
 /**
  * La configuración del proveedor; sin proveedor, la vigente con la navegación del navegador.
  *
- * @returns {{language: string, onLanguageChange: Function|null, texts: object, translate: Function|null, timeZone: string, currency: string, hourCycle: 'h23'|'h12', appName: string, buildId: string, navigation: object, canAccess: Function}}
+ * @returns {{language: string, onLanguageChange: Function|null, requiredFromSchema?: boolean, texts: object, translate: Function|null, timeZone: string, currency: string, hourCycle: 'h23'|'h12', appName: string, buildId: string, navigation: object, canAccess: Function}}
  */
 export declare function useToolkitSettings(): {
     language: string;
     onLanguageChange: Function | null;
+    requiredFromSchema?: boolean;
     texts: object;
     translate: Function | null;
     timeZone: string;

package/dist/types/ui/cards/RecordCard.d.ts

@@ -1,3 +1,14 @@
+/**
+ * Cómo se acomoda el renglón de abajo (footer y «Ver detalle»):
+ *   spaceBetween  el footer a la izquierda y «Ver detalle» en la otra orilla (lo de siempre);
+ *   start         los dos juntos, a la izquierda;
+ *   end           los dos juntos, a la derecha.
+ */
+export declare const RECORD_CARD_FOOTER_ALIGN: Readonly<{
+    spaceBetween: "spaceBetween";
+    start: "start";
+    end: "end";
+}>;
 declare const RecordCard: (props: {
     title: import('react').ReactNode;
     eyebrow?: import('react').ReactNode;
@@ -25,6 +36,7 @@ declare const RecordCard: (props: {
     trailing?: import('react').ReactNode;
     columns?: string;
     footer?: import('react').ReactNode;
+    footerAlign?: 'spaceBetween' | 'start' | 'end';
     details?: import('react').ReactNode;
     detailsLabel?: string;
     defaultDetailsOpen?: boolean;

package/dist/types/ui/index.d.ts

@@ -21,7 +21,7 @@ export { default as PageBreadcrumbs } from './navigation/PageBreadcrumbs.js';
 export { ROUTE_TABS_MODE, default as RouteTabs, useActiveRouteTab } from './navigation/RouteTabs.js';
 export { default as HelpButton } from './help/HelpButton.js';
 export { HELP_CLOSE_REASON, default as HelpCarouselDialog } from './help/HelpCarouselDialog.js';
-export { default as RecordCard } from './cards/RecordCard.js';
+export { RECORD_CARD_FOOTER_ALIGN, default as RecordCard } from './cards/RecordCard.js';
 export { default as RecordCardSkeleton } from './cards/RecordCardSkeleton.js';
 export { useHelpCarousel } from './help/useHelpCarousel.js';
 export { default as DateRangeFilter } from './filters/DateRangeFilter.js';

package/dist/types/ui/navigation/BackButton.d.ts

@@ -3,6 +3,7 @@ declare const BackButton: (props: {
     listKey?: string;
     label?: string;
     texts?: object;
+    sx?: object;
 } & {
     slots?: Record<string, import('react').ElementType>;
     slotProps?: Record<string, object | ((partProps: object) => object)>;

package/dist/types/upload/AttachmentsInput.d.ts

@@ -19,6 +19,7 @@
  * @param {boolean} [props.showButton] false esconde «Adjuntar» (la ventana se abre con pickerRef desde un botón suyo)
  * @param {import('react').Ref<{open: () => void}>} [props.pickerRef] recibe {open} para abrir la ventana de archivos
  * @param {boolean} [props.disabled]
+ * @param {boolean} [props.required] obligatorio: el asterisco en la etiqueta (lo revisa el esquema del formulario)
  * @param {boolean} [props.busy] candado mientras se sube: no se puede agregar ni quitar
  * @param {(file: File, reason: string) => void} [props.onReject] reason es uno de FILE_REJECTION; sin él, un aviso
  * @param {Parameters<typeof import('./TemplateDownloadButton.js').default>[0]} [props.template] «Descargar la
@@ -57,6 +58,7 @@ declare function AttachmentsInputContent<T extends File | {
         open: () => void;
     }>;
     disabled?: boolean;
+    required?: boolean;
     busy?: boolean;
     onReject?: (file: File, reason: string) => void;
     template?: Parameters<typeof import('./TemplateDownloadButton.js').default>[0];

package/dist/types/upload/FileInput.d.ts

@@ -17,6 +17,7 @@ declare const FileInput: (props: {
     buttonLabel?: string;
     emptyText?: string;
     disabled?: boolean;
+    required?: boolean;
     busy?: boolean;
     onReject?: (file: File, reason: string) => void;
     template?: Parameters<typeof import('./TemplateDownloadButton.js').default>[0];

package/dist/types/upload/FileUploadInput.d.ts

@@ -40,6 +40,7 @@ declare const FileUploadInput: (props: {
     };
     helperText?: string;
     disabled?: boolean;
+    required?: boolean;
     actions?: import('react').ReactNode;
     onUploaded?: (result: any) => void;
     onUploadFailed?: (error: unknown) => void;

package/dist/types/upload/ImageInput.d.ts

@@ -23,6 +23,7 @@ declare const ImageInput: (props: {
     chooseLabel?: string;
     removeLabel?: string;
     disabled?: boolean;
+    required?: boolean;
     busy?: boolean;
     onReject?: (file: File, reason: string) => void;
     sx?: object;

package/dist/ui/cards/RecordCard.js

@@ -17,6 +17,8 @@ import { piecePart, withPieceSlots, usePieceProps } from "../../theme/themePiece
 import { useToolkitTranslation } from "../../toolkit/useToolkitTranslation.js";
 import { warnUnknownProps } from "../../toolkit/unknownProps.js";
 import ActionsMenu from "../actions/ActionsMenu.js";
+const RECORD_CARD_FOOTER_ALIGN = Object.freeze({ spaceBetween: "spaceBetween", start: "start", end: "end" });
+const FOOTER_JUSTIFY = Object.freeze({ spaceBetween: "flex-start", start: "flex-start", end: "flex-end" });
 const THEME_NAME = "CalcitaRecordCard";
 const RecordCardRoot = piecePart(THEME_NAME, "Root", Paper);
 const RecordCardHeader = piecePart(THEME_NAME, "Header", Stack);
@@ -42,6 +44,7 @@ function RecordCardContent(props) {
     trailing,
     columns,
     footer,
+    footerAlign = RECORD_CARD_FOOTER_ALIGN.spaceBetween,
     details,
     detailsLabel,
     defaultDetailsOpen = false,
@@ -122,8 +125,8 @@ function RecordCardContent(props) {
       trailing && /* @__PURE__ */ jsx(Box, { sx: { minWidth: 0, alignSelf: "center", borderTop: { xs: 1, md: 0 }, pt: { xs: 1.5, md: 0 }, borderColor: "divider" }, children: trailing })
     ] }),
     children,
-    (footer || details) && /* @__PURE__ */ jsxs(RecordCardFooter, { direction: "row", ownSx: { mt: 2, gap: 1, alignItems: "center", flexWrap: "wrap" }, children: [
-      /* @__PURE__ */ jsx(Box, { sx: { flex: 1, minWidth: 0 }, children: footer }),
+    (footer || details) && /* @__PURE__ */ jsxs(RecordCardFooter, { direction: "row", ownSx: { mt: 2, gap: 1, alignItems: "center", flexWrap: "wrap", justifyContent: FOOTER_JUSTIFY[footerAlign] ?? "flex-start" }, children: [
+      /* @__PURE__ */ jsx(Box, { sx: { flex: footerAlign === RECORD_CARD_FOOTER_ALIGN.spaceBetween ? 1 : "0 1 auto", minWidth: 0 }, children: footer }),
       details && /* @__PURE__ */ jsx(
         Button,
         {
@@ -141,6 +144,7 @@ function RecordCardContent(props) {
 }
 const RecordCard = withPieceSlots(RecordCardContent, THEME_NAME);
 export {
+  RECORD_CARD_FOOTER_ALIGN,
   RecordCard as default
 };
 //# sourceMappingURL=RecordCard.js.map