@vireocodedev/ui 0.2.0 → 0.2.1

package/dist/capabilities/forms/components/forms/VireoFormStepProgress/VireoFormStepProgress.styled.js

@@ -0,0 +1,159 @@
+import { Box, ButtonBase, LinearProgress, Menu, MenuItem, Typography, } from "@mui/material";
+import { styled } from "@mui/material/styles";
+import { VIREO_FORM_STEP_PROGRESS_NAME } from "./VireoFormStepProgress.identity.js";
+import { vireoFormStepProgressClasses } from "./VireoFormStepProgress.classes.js";
+export const VireoFormStepProgressRoot = styled(Box, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "Root",
+    overridesResolver: (_props, styles) => styles.root,
+})(({ ownerState }) => ({
+    containerType: "inline-size",
+    [`& .${vireoFormStepProgressClasses.list}`]: { display: ownerState.layout === "compact" ? "none" : "grid" },
+    [`& .${vireoFormStepProgressClasses.compactRoot}`]: {
+        display: ownerState.layout === "compact" ? "flex" : "none",
+    },
+    ...(ownerState.layout === "responsive" && {
+        [`@container (max-width: ${ownerState.compactBreakpoint}px)`]: {
+            [`& .${vireoFormStepProgressClasses.list}`]: { display: "none" },
+            [`& .${vireoFormStepProgressClasses.compactRoot}`]: { display: "flex" },
+        },
+    }),
+}));
+export const VireoFormStepProgressList = styled(Box, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "List",
+    overridesResolver: (_props, styles) => styles.list,
+})(({ theme }) => ({
+    alignItems: "center",
+    display: "grid",
+    gap: theme.spacing(1),
+    gridTemplateColumns: "repeat(var(--vireo-step-count), minmax(0, 1fr))",
+    listStyle: "none",
+    margin: 0,
+    minWidth: 0,
+    padding: 0,
+}));
+export const VireoFormStepProgressStep = styled(Box, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "Step",
+    overridesResolver: (_props, styles) => styles.step,
+})({ alignItems: "center", display: "flex", minWidth: 0 });
+export const VireoFormStepProgressStepButton = styled(ButtonBase, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "StepButton",
+    overridesResolver: (_props, styles) => styles.stepButton,
+})(({ theme }) => ({
+    alignItems: "center",
+    borderRadius: theme.shape.borderRadius,
+    display: "flex",
+    gap: theme.spacing(1),
+    minWidth: 0,
+    padding: theme.spacing(0.75),
+    textAlign: "start",
+    width: "100%",
+}));
+export const VireoFormStepProgressStatusIcon = styled(Box, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "StatusIcon",
+    overridesResolver: (_props, styles) => styles.statusIcon,
+})(({ ownerState, theme }) => ({
+    alignItems: "center",
+    backgroundColor: ownerState.step?.hasError
+        ? theme.palette.error.main
+        : ownerState.step?.isComplete
+            ? theme.palette.success.main
+            : ownerState.step?.isCurrent
+                ? theme.palette.primary.main
+                : theme.palette.action.disabledBackground,
+    borderRadius: "50%",
+    color: ownerState.step?.hasError || ownerState.step?.isComplete || ownerState.step?.isCurrent
+        ? theme.palette.getContrastText(ownerState.step?.hasError
+            ? theme.palette.error.main
+            : ownerState.step?.isComplete
+                ? theme.palette.success.main
+                : theme.palette.primary.main)
+        : theme.palette.text.secondary,
+    display: "inline-flex",
+    flex: "0 0 auto",
+    fontSize: theme.typography.caption.fontSize,
+    fontWeight: theme.typography.fontWeightBold,
+    height: 24,
+    justifyContent: "center",
+    width: 24,
+}));
+export const VireoFormStepProgressStepLabel = styled(Typography, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "StepLabel",
+    overridesResolver: (_props, styles) => styles.stepLabel,
+})(({ ownerState, theme }) => ({
+    color: ownerState.step?.isCurrent ? theme.palette.text.primary : theme.palette.text.secondary,
+    fontWeight: ownerState.step?.isCurrent ? theme.typography.fontWeightMedium : undefined,
+    minWidth: 0,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+}));
+export const VireoFormStepProgressConnector = styled(Box, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "Connector",
+    overridesResolver: (_props, styles) => styles.connector,
+})(({ ownerState, theme }) => ({
+    backgroundColor: ownerState.step?.isComplete ? theme.palette.success.main : theme.palette.divider,
+    flex: "1 1 auto",
+    height: 2,
+    marginInline: theme.spacing(0.5),
+    minWidth: theme.spacing(1),
+}));
+export const VireoFormStepProgressCompactRoot = styled(Box, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "CompactRoot",
+    overridesResolver: (_props, styles) => styles.compactRoot,
+})(({ theme }) => ({
+    display: "flex",
+    flexDirection: "column",
+    gap: theme.spacing(1),
+}));
+export const VireoFormStepProgressCompactTrigger = styled(ButtonBase, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "CompactTrigger",
+    overridesResolver: (_props, styles) => styles.compactTrigger,
+})(({ theme }) => ({
+    alignItems: "center",
+    borderRadius: theme.shape.borderRadius,
+    display: "flex",
+    gap: theme.spacing(1),
+    justifyContent: "space-between",
+    padding: theme.spacing(0.5),
+    textAlign: "start",
+    width: "100%",
+}));
+export const VireoFormStepProgressCompactLabel = styled(Typography, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "CompactLabel",
+    overridesResolver: (_props, styles) => styles.compactLabel,
+})({
+    minWidth: 0,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "nowrap",
+});
+export const VireoFormStepProgressCompactCount = styled(Typography, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "CompactCount",
+    overridesResolver: (_props, styles) => styles.compactCount,
+})(({ theme }) => ({ color: theme.palette.text.secondary, flex: "0 0 auto" }));
+export const VireoFormStepProgressCompactProgress = styled(LinearProgress, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "CompactProgress",
+    overridesResolver: (_props, styles) => styles.compactProgress,
+})({ width: "100%" });
+export const VireoFormStepProgressMenu = styled(Menu, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "Menu",
+    overridesResolver: (_props, styles) => styles.menu,
+})({});
+export const VireoFormStepProgressMenuItem = styled(MenuItem, {
+    name: VIREO_FORM_STEP_PROGRESS_NAME,
+    slot: "MenuItem",
+    overridesResolver: (_props, styles) => styles.menuItem,
+})(({ theme }) => ({ display: "flex", gap: theme.spacing(1) }));

package/dist/capabilities/forms/components/forms/VireoFormStepProgress/VireoFormStepProgress.types.d.ts

@@ -0,0 +1,107 @@
+import type { VireoMultiStepStepState } from "../../../../../capabilities/forms/types/vireoMultiStep.types.js";
+import type { VireoDataAttributeValue, VireoThemeComponent } from "../../../../../core/public.js";
+import type { Box, BoxProps, ButtonBase, LinearProgress, Menu, MenuItem, Typography } from "@mui/material";
+import type { CreateSlotsAndSlotProps, SlotProps } from "@mui/material/utils";
+import type React from "react";
+import type { VireoFormStepProgressClasses, VireoFormStepProgressClassKey } from "./VireoFormStepProgress.classes.js";
+import type { VIREO_FORM_STEP_PROGRESS_NAME, VireoFormStepProgressSlotName } from "./VireoFormStepProgress.identity.js";
+export type VireoFormStepProgressLayout = "responsive" | "horizontal" | "compact";
+export type VireoFormStepProgressNavigation = "none" | "visited" | "all";
+export type VireoFormStepProgressOwnerState = {
+    compactBreakpoint: number;
+    layout: VireoFormStepProgressLayout;
+    navigation: VireoFormStepProgressNavigation;
+    step?: VireoMultiStepStepState<string>;
+};
+export interface VireoFormStepProgressRootSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressListSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressStepSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressStepButtonSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressStatusIconSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressStepLabelSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressConnectorSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressCompactRootSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressCompactTriggerSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressCompactLabelSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressCompactCountSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressCompactProgressSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressMenuSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export interface VireoFormStepProgressMenuItemSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+export type VireoFormStepProgressSlots = {
+    [T in VireoFormStepProgressSlotName]: React.ElementType;
+};
+export type VireoFormStepProgressSlotsAndSlotProps = CreateSlotsAndSlotProps<VireoFormStepProgressSlots, {
+    /** @default 'nav' */
+    root: SlotProps<typeof Box, VireoFormStepProgressRootSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'ol' */
+    list: SlotProps<typeof Box, VireoFormStepProgressListSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'li' */
+    step: SlotProps<typeof Box, VireoFormStepProgressStepSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default ButtonBase */
+    stepButton: SlotProps<typeof ButtonBase, VireoFormStepProgressStepButtonSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'span' */
+    statusIcon: SlotProps<typeof Box, VireoFormStepProgressStatusIconSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'span' */
+    stepLabel: SlotProps<typeof Typography, VireoFormStepProgressStepLabelSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'span' */
+    connector: SlotProps<typeof Box, VireoFormStepProgressConnectorSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default Box */
+    compactRoot: SlotProps<typeof Box, VireoFormStepProgressCompactRootSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default ButtonBase */
+    compactTrigger: SlotProps<typeof ButtonBase, VireoFormStepProgressCompactTriggerSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'span' */
+    compactLabel: SlotProps<typeof Typography, VireoFormStepProgressCompactLabelSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default 'span' */
+    compactCount: SlotProps<typeof Typography, VireoFormStepProgressCompactCountSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default LinearProgress */
+    compactProgress: SlotProps<typeof LinearProgress, VireoFormStepProgressCompactProgressSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default Menu */
+    menu: SlotProps<typeof Menu, VireoFormStepProgressMenuSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+    /** @default MenuItem */
+    menuItem: SlotProps<typeof MenuItem, VireoFormStepProgressMenuItemSlotPropsOverrides, VireoFormStepProgressOwnerState>;
+}>;
+export type VireoFormStepProgressOwnProps = VireoFormStepProgressSlotsAndSlotProps & {
+    /** Container width at which responsive progress changes to its compact presentation. @default 600 */
+    compactBreakpoint?: number;
+    /** Override or extend the utility classes applied to each slot. */
+    classes?: Partial<VireoFormStepProgressClasses>;
+    /** Chooses the wide, compact, or container-responsive presentation. @default 'responsive' */
+    layout?: VireoFormStepProgressLayout;
+    /** Controls which steps can be selected directly from progress navigation. @default 'visited' */
+    navigation?: VireoFormStepProgressNavigation;
+};
+export type VireoFormStepProgressInheritedProps = Omit<BoxProps<"nav">, "component" | "ref">;
+export type VireoFormStepProgressProps = VireoFormStepProgressOwnProps & VireoFormStepProgressInheritedProps;
+declare module "@mui/material/styles" {
+    interface Components<Theme = unknown> {
+        [VIREO_FORM_STEP_PROGRESS_NAME]?: VireoThemeComponent<VireoFormStepProgressProps, VireoFormStepProgressClassKey, VireoFormStepProgressOwnerState, Theme>;
+    }
+}

package/dist/capabilities/forms/components/forms/VireoFormStepProgress/VireoFormStepProgress.types.js

@@ -0,0 +1 @@
+export {};

package/dist/capabilities/forms/components/forms/VireoFormStepProgress/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./VireoFormStepProgress.js";
+export * from "./VireoFormStepProgress.classes.js";
+export * from "./VireoFormStepProgress.types.js";

package/dist/capabilities/forms/components/forms/VireoFormStepProgress/index.js

@@ -0,0 +1,3 @@
+export * from "./VireoFormStepProgress.js";
+export * from "./VireoFormStepProgress.classes.js";
+export * from "./VireoFormStepProgress.types.js";

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.classes.d.ts

@@ -0,0 +1,9 @@
+import { type VireoFormSubmitButtonSlotName, type VireoFormSubmitButtonStateName } from "./VireoFormSubmitButton.identity.js";
+/** Utility classes available to VireoFormSubmitButton. */
+export type VireoFormSubmitButtonClasses = Record<VireoFormSubmitButtonSlotName | VireoFormSubmitButtonStateName, string>;
+/** Valid keys for VireoFormSubmitButton utility classes and theme style overrides. */
+export type VireoFormSubmitButtonClassKey = keyof VireoFormSubmitButtonClasses;
+/** Returns the generated utility class name for a VireoFormSubmitButton slot or state. */
+export declare function getVireoFormSubmitButtonUtilityClass(slot: string): string;
+/** Generated utility class names keyed by each public VireoFormSubmitButton class key. */
+export declare const vireoFormSubmitButtonClasses: VireoFormSubmitButtonClasses;

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.classes.js

@@ -0,0 +1,8 @@
+import { generateUtilityClass, generateUtilityClasses } from "@mui/material";
+import { VIREO_FORM_SUBMIT_BUTTON_NAME, VIREO_FORM_SUBMIT_BUTTON_SLOTS, VIREO_FORM_SUBMIT_BUTTON_STATES, } from "./VireoFormSubmitButton.identity.js";
+/** Returns the generated utility class name for a VireoFormSubmitButton slot or state. */
+export function getVireoFormSubmitButtonUtilityClass(slot) {
+    return generateUtilityClass(VIREO_FORM_SUBMIT_BUTTON_NAME, slot);
+}
+/** Generated utility class names keyed by each public VireoFormSubmitButton class key. */
+export const vireoFormSubmitButtonClasses = generateUtilityClasses(VIREO_FORM_SUBMIT_BUTTON_NAME, [...VIREO_FORM_SUBMIT_BUTTON_SLOTS, ...VIREO_FORM_SUBMIT_BUTTON_STATES]);

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { type VireoFormSubmitButtonProps } from "./VireoFormSubmitButton.types.js";
+/**
+ * Renders a submit action whose loading state follows the current Vireo form submission lifecycle.
+ *
+ * Consumers render it through `form.SubmitButton`; the raw runtime is intentionally capability-bound.
+ */
+export declare const VireoFormSubmitButton: React.ForwardRefExoticComponent<Omit<VireoFormSubmitButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.identity.d.ts

@@ -0,0 +1,10 @@
+/** Stable component name shared by every VireoFormSubmitButton integration point. */
+export declare const VIREO_FORM_SUBMIT_BUTTON_NAME = "VireoFormSubmitButton";
+/** Canonical public slots exposed by VireoFormSubmitButton, in rendered DOM order. */
+export declare const VIREO_FORM_SUBMIT_BUTTON_SLOTS: readonly ["root"];
+/** Public slot names exposed by VireoFormSubmitButton. */
+export type VireoFormSubmitButtonSlotName = (typeof VIREO_FORM_SUBMIT_BUTTON_SLOTS)[number];
+/** Canonical state classes exposed by VireoFormSubmitButton. */
+export declare const VIREO_FORM_SUBMIT_BUTTON_STATES: readonly ["disabled", "loading", "submitting"];
+/** Public state names exposed by VireoFormSubmitButton. */
+export type VireoFormSubmitButtonStateName = (typeof VIREO_FORM_SUBMIT_BUTTON_STATES)[number];

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.identity.js

@@ -0,0 +1,6 @@
+/** Stable component name shared by every VireoFormSubmitButton integration point. */
+export const VIREO_FORM_SUBMIT_BUTTON_NAME = "VireoFormSubmitButton";
+/** Canonical public slots exposed by VireoFormSubmitButton, in rendered DOM order. */
+export const VIREO_FORM_SUBMIT_BUTTON_SLOTS = ["root"];
+/** Canonical state classes exposed by VireoFormSubmitButton. */
+export const VIREO_FORM_SUBMIT_BUTTON_STATES = ["disabled", "loading", "submitting"];

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useVireoTanStackFormContext } from "../../../../../capabilities/forms/contexts/VireoFormHookContexts/VireoFormHookContexts.js";
+import { useOptionalVireoMultiStepContext } from "../../../../../capabilities/forms/contexts/VireoMultiStepContext/VireoMultiStepContext.js";
+import { joinClassNames, mergeSx, resolveSlotProps } from "../../../../../core/public.js";
+import { unstable_composeClasses as composeClasses } from "@mui/material";
+import { useThemeProps } from "@mui/material/styles";
+import { useForkRef } from "@mui/material/utils";
+import { useStore } from "@tanstack/react-form";
+import React from "react";
+const subscribeToNothing = () => () => undefined;
+const getNoMultiStepState = () => undefined;
+import { getVireoFormSubmitButtonUtilityClass, } from "./VireoFormSubmitButton.classes.js";
+import { VIREO_FORM_SUBMIT_BUTTON_NAME } from "./VireoFormSubmitButton.identity.js";
+import { VireoFormSubmitButtonRoot } from "./VireoFormSubmitButton.styled.js";
+function useUtilityClasses(ownerState, classes) {
+    return composeClasses({
+        root: [
+            "root",
+            ownerState.disabled && "disabled",
+            ownerState.loading && "loading",
+            ownerState.submitting && "submitting",
+        ],
+    }, getVireoFormSubmitButtonUtilityClass, classes);
+}
+/**
+ * Renders a submit action whose loading state follows the current Vireo form submission lifecycle.
+ *
+ * Consumers render it through `form.SubmitButton`; the raw runtime is intentionally capability-bound.
+ */
+export const VireoFormSubmitButton = React.forwardRef(function VireoFormSubmitButton(inProps, forwardedRef) {
+    const props = useThemeProps({ props: inProps, name: VIREO_FORM_SUBMIT_BUTTON_NAME });
+    const { children, className, classes: classesProp, disabled = false, loading = false, slotProps = {}, slots = {}, style, sx, visibility = "auto", ...other } = props;
+    const form = useVireoTanStackFormContext();
+    const submitting = useStore(form.store, current => current.isSubmitting);
+    const multiStep = useOptionalVireoMultiStepContext();
+    const multiStepState = React.useSyncExternalStore(multiStep?.controller.subscribe ?? subscribeToNothing, multiStep?.controller.getSnapshot ?? getNoMultiStepState, multiStep?.controller.getSnapshot ?? getNoMultiStepState);
+    const available = !multiStepState || multiStepState.isLastStep;
+    const ownerState = {
+        available,
+        disabled: disabled || (!available && visibility === "always"),
+        loading: submitting || loading === true,
+        submitting,
+    };
+    const classes = useUtilityClasses(ownerState, classesProp);
+    const resolvedRootSlotProps = resolveSlotProps(slotProps.root, ownerState);
+    const { className: rootSlotClassName, component: _rootSlotComponent, disabled: _rootSlotDisabled, href: _rootSlotHref, loading: _rootSlotLoading, ref: rootSlotRef, style: rootSlotStyle, sx: rootSlotSx, ...rootSlotOther } = resolvedRootSlotProps;
+    void _rootSlotComponent;
+    void _rootSlotDisabled;
+    void _rootSlotHref;
+    void _rootSlotLoading;
+    const rootRef = useForkRef(forwardedRef, rootSlotRef);
+    if (!available && visibility === "auto")
+        return null;
+    return (_jsx(VireoFormSubmitButtonRoot, { ...other, ...rootSlotOther, as: slots.root, ref: rootRef, ownerState: ownerState, "aria-busy": ownerState.loading || undefined, className: joinClassNames(classes.root, className, rootSlotClassName), disabled: ownerState.disabled, loading: ownerState.loading, style: { ...style, ...rootSlotStyle }, sx: mergeSx(sx, rootSlotSx), type: "submit", children: children }));
+});
+VireoFormSubmitButton.displayName = VIREO_FORM_SUBMIT_BUTTON_NAME;

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.styled.d.ts

@@ -0,0 +1,6 @@
+import { type StyledSlotComponent } from "../../../../../core/public.js";
+import { type ButtonProps } from "@mui/material";
+import { type VireoFormSubmitButtonOwnerState } from "./VireoFormSubmitButton.types.js";
+type VireoFormSubmitButtonStyledSlotComponent<TProps extends object> = StyledSlotComponent<TProps, VireoFormSubmitButtonOwnerState>;
+export declare const VireoFormSubmitButtonRoot: VireoFormSubmitButtonStyledSlotComponent<ButtonProps>;
+export {};

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.styled.js

@@ -0,0 +1,13 @@
+import { Button } from "@mui/material";
+import { styled } from "@mui/material/styles";
+import { VIREO_FORM_SUBMIT_BUTTON_NAME } from "./VireoFormSubmitButton.identity.js";
+export const VireoFormSubmitButtonRoot = styled(Button, {
+    name: VIREO_FORM_SUBMIT_BUTTON_NAME,
+    slot: "Root",
+    overridesResolver: ({ ownerState }, styles) => [
+        styles.root,
+        ownerState.disabled && styles.disabled,
+        ownerState.loading && styles.loading,
+        ownerState.submitting && styles.submitting,
+    ],
+})({});

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.types.d.ts

@@ -0,0 +1,42 @@
+import type { VireoDataAttributeValue, VireoThemeComponent } from "../../../../../core/public.js";
+import type { Button, ButtonProps } from "@mui/material";
+import type { CreateSlotsAndSlotProps, SlotProps } from "@mui/material/utils";
+import type React from "react";
+import { type VireoFormSubmitButtonClasses, type VireoFormSubmitButtonClassKey } from "./VireoFormSubmitButton.classes.js";
+import type { VIREO_FORM_SUBMIT_BUTTON_NAME, VireoFormSubmitButtonSlotName } from "./VireoFormSubmitButton.identity.js";
+export type VireoFormSubmitButtonOwnerState = {
+    available: boolean;
+    disabled: boolean;
+    loading: boolean;
+    submitting: boolean;
+};
+export interface VireoFormSubmitButtonRootSlotPropsOverrides {
+    [key: `data-${string}`]: VireoDataAttributeValue;
+}
+/** Replaceable semantic regions exposed by {@link VireoFormSubmitButton}. */
+export type VireoFormSubmitButtonSlots = {
+    [TSlotName in VireoFormSubmitButtonSlotName]: React.ElementType;
+};
+/** Slot props exposed by {@link VireoFormSubmitButton}. */
+export type VireoFormSubmitButtonSlotsAndSlotProps = CreateSlotsAndSlotProps<VireoFormSubmitButtonSlots, {
+    /** @default Button */
+    root: SlotProps<typeof Button, VireoFormSubmitButtonRootSlotPropsOverrides, VireoFormSubmitButtonOwnerState>;
+}>;
+/** Props owned by {@link VireoFormSubmitButton}. */
+export type VireoFormSubmitButtonOwnProps = VireoFormSubmitButtonSlotsAndSlotProps & {
+    /** Override or extend the utility classes applied to each slot. */
+    classes?: Partial<VireoFormSubmitButtonClasses>;
+    /** Adds a consumer-owned loading condition to the form's submission state. @default false */
+    loading?: boolean | null;
+    /** Controls whether a multi-step submit action is rendered only on the final step. @default 'auto' */
+    visibility?: "auto" | "always";
+};
+/** Props VireoFormSubmitButton inherits from its default root after excluding component-owned props. */
+export type VireoFormSubmitButtonInheritedProps = Omit<ButtonProps, "component" | "href" | "loading" | "type">;
+/** Props accepted by {@link VireoFormSubmitButton}. */
+export type VireoFormSubmitButtonProps = VireoFormSubmitButtonOwnProps & VireoFormSubmitButtonInheritedProps;
+declare module "@mui/material/styles" {
+    interface Components<Theme = unknown> {
+        [VIREO_FORM_SUBMIT_BUTTON_NAME]?: VireoThemeComponent<VireoFormSubmitButtonProps, VireoFormSubmitButtonClassKey, VireoFormSubmitButtonOwnerState, Theme>;
+    }
+}

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/VireoFormSubmitButton.types.js

@@ -0,0 +1 @@
+export {};

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./VireoFormSubmitButton.js";
+export * from "./VireoFormSubmitButton.classes.js";
+export * from "./VireoFormSubmitButton.types.js";

package/dist/capabilities/forms/components/forms/VireoFormSubmitButton/index.js

@@ -0,0 +1,3 @@
+export * from "./VireoFormSubmitButton.js";
+export * from "./VireoFormSubmitButton.classes.js";
+export * from "./VireoFormSubmitButton.types.js";

package/dist/capabilities/forms/components/forms/VireoFormSwitchField/VireoFormSwitchField.classes.d.ts

@@ -0,0 +1,9 @@
+import { type VireoFormSwitchFieldSlotName, type VireoFormSwitchFieldStateName } from "./VireoFormSwitchField.identity.js";
+/** Utility classes available to VireoFormSwitchField. */
+export type VireoFormSwitchFieldClasses = Record<VireoFormSwitchFieldSlotName | VireoFormSwitchFieldStateName, string>;
+/** Valid keys for VireoFormSwitchField utility classes and theme style overrides. */
+export type VireoFormSwitchFieldClassKey = keyof VireoFormSwitchFieldClasses;
+/** Returns the generated utility class name for a VireoFormSwitchField slot or state. */
+export declare function getVireoFormSwitchFieldUtilityClass(slot: string): string;
+/** Generated utility class names keyed by each public VireoFormSwitchField class key. */
+export declare const vireoFormSwitchFieldClasses: VireoFormSwitchFieldClasses;

package/dist/capabilities/forms/components/forms/VireoFormSwitchField/VireoFormSwitchField.classes.js

@@ -0,0 +1,8 @@
+import { generateUtilityClass, generateUtilityClasses } from "@mui/material";
+import { VIREO_FORM_SWITCH_FIELD_NAME, VIREO_FORM_SWITCH_FIELD_SLOTS, VIREO_FORM_SWITCH_FIELD_STATES, } from "./VireoFormSwitchField.identity.js";
+/** Returns the generated utility class name for a VireoFormSwitchField slot or state. */
+export function getVireoFormSwitchFieldUtilityClass(slot) {
+    return generateUtilityClass(VIREO_FORM_SWITCH_FIELD_NAME, slot);
+}
+/** Generated utility class names keyed by each public VireoFormSwitchField class key. */
+export const vireoFormSwitchFieldClasses = generateUtilityClasses(VIREO_FORM_SWITCH_FIELD_NAME, [...VIREO_FORM_SWITCH_FIELD_SLOTS, ...VIREO_FORM_SWITCH_FIELD_STATES]);

package/dist/capabilities/forms/components/forms/VireoFormSwitchField/VireoFormSwitchField.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { type VireoFormSwitchFieldProps } from "./VireoFormSwitchField.types.js";
+/**
+ * Binds a labelled MUI Switch to the current TanStack Form boolean field and shared validation policy.
+ *
+ * Consumers render it as `field.SwitchField`; the raw runtime remains internal to the forms capability.
+ */
+export declare const VireoFormSwitchField: React.ForwardRefExoticComponent<Omit<VireoFormSwitchFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/capabilities/forms/components/forms/VireoFormSwitchField/VireoFormSwitchField.identity.d.ts

@@ -0,0 +1,10 @@
+/** Stable component name shared by every VireoFormSwitchField integration point. */
+export declare const VIREO_FORM_SWITCH_FIELD_NAME = "VireoFormSwitchField";
+/** Canonical public slots exposed by VireoFormSwitchField, in rendered DOM order. */
+export declare const VIREO_FORM_SWITCH_FIELD_SLOTS: readonly ["root", "formControlLabel", "switch", "label", "formHelperText"];
+/** Canonical interaction and validation states exposed as utility classes. */
+export declare const VIREO_FORM_SWITCH_FIELD_STATES: readonly ["checked", "dirty", "touched", "invalid", "errorVisible", "validating", "submitting", "disabled"];
+/** Public slot names exposed by VireoFormSwitchField. */
+export type VireoFormSwitchFieldSlotName = (typeof VIREO_FORM_SWITCH_FIELD_SLOTS)[number];
+/** Public state names exposed by VireoFormSwitchField. */
+export type VireoFormSwitchFieldStateName = (typeof VIREO_FORM_SWITCH_FIELD_STATES)[number];

package/dist/capabilities/forms/components/forms/VireoFormSwitchField/VireoFormSwitchField.identity.js

@@ -0,0 +1,21 @@
+/** Stable component name shared by every VireoFormSwitchField integration point. */
+export const VIREO_FORM_SWITCH_FIELD_NAME = "VireoFormSwitchField";
+/** Canonical public slots exposed by VireoFormSwitchField, in rendered DOM order. */
+export const VIREO_FORM_SWITCH_FIELD_SLOTS = [
+    "root",
+    "formControlLabel",
+    "switch",
+    "label",
+    "formHelperText",
+];
+/** Canonical interaction and validation states exposed as utility classes. */
+export const VIREO_FORM_SWITCH_FIELD_STATES = [
+    "checked",
+    "dirty",
+    "touched",
+    "invalid",
+    "errorVisible",
+    "validating",
+    "submitting",
+    "disabled",
+];