@servicetitan/anvil2 1.48.0 → 1.49.0

package/dist/beta/components/Table/DataTable/DataTable.d.ts

@@ -2,6 +2,7 @@ import { ComponentPropsWithoutRef } from 'react';
 import { LayoutUtilProps } from '../../../../types';
 import { ColumnDef, CustomTableFooterCellProps, TableRow } from '../types';
 import { TableContainerProps } from '../base/TableContainer';
+import { DataTablePaginationConfig } from './types';
 /**
  * Represents a sorted column configuration for DataTable
  */
@@ -21,10 +22,6 @@ export type SortedColumn = {
  * @extends ComponentPropsWithoutRef<"div">
  */
 export type DataTableProps<T> = LayoutUtilProps & ComponentPropsWithoutRef<"div"> & {
-    /**
-     * The data for the table. Must be an array of objects with an `id` property.
-     */
-    data: TableRow<T>[];
     /**
      * The columns for the table, created with the `createColumnHelper` factory function.
      */
@@ -38,6 +35,10 @@ export type DataTableProps<T> = LayoutUtilProps & ComponentPropsWithoutRef<"div"
      * The custom footer content for the table. Will be overridden by the footer content of the columns.
      */
     customFooter?: CustomTableFooterCellProps[][];
+    /**
+     * The data for the table. Must be an array of objects with an `id` property.
+     */
+    data?: TableRow<T>[] | Promise<TableRow<T>[]>;
     /**
      * The default expanded row ids. Can be "all" to expand all rows, or an array of row ids to expand specific rows.
      */
@@ -71,6 +72,12 @@ export type DataTableProps<T> = LayoutUtilProps & ComponentPropsWithoutRef<"div"
      * Called when the column sorting state changes. Passes the sorted column.
      */
     onSort?: (sortedColumn: SortedColumn | undefined) => void;
+    /**
+     * Pagination configuration. When provided, enables pagination and filters data to show only the current page.
+     * When `true`, the default pagination configuration is used.
+     * When `false` or `undefined`, no pagination is applied and all data is shown.
+     */
+    pagination?: boolean | DataTablePaginationConfig<T>;
     /**
      * The selected row ids.
      */
@@ -94,6 +101,7 @@ export type DataTableProps<T> = LayoutUtilProps & ComponentPropsWithoutRef<"div"
  * - Row sub-component
  * - Row sub-rows
  * - Default and Strong backgrounds
+ * - Pagination support with configurable items per page
  *
  * @param props - The props for the DataTable component
  * @param props.data - The data for the table. Must be an array of objects with an `id` property.
@@ -108,9 +116,22 @@ export type DataTableProps<T> = LayoutUtilProps & ComponentPropsWithoutRef<"div"
  * @param props.onSelectRow - Called when the row selection state changes. Passes the selected row ids.
  * @param props.onSort - Called when the column sorting state changes. Passes the sorted column.
  * @param props.onExpandRow - Called when the row expansion state changes. Passes the expanded row ids.
+ * @param props.pagination - Pagination configuration. When provided, enables pagination and filters data to show only the current page. When undefined, all data is shown and no pagination controls are rendered.
  * @param props.selectedRowIds - The selected row ids.
  * @param props.sortedColumn - The sorted column.
  * @param props.style - The style of the table container.
  * @param props.rest - The rest of the props for the DataTable component, spread to the div surrounding the table.
+ *
+ * @example
+ * <DataTable
+ *   data={tableData}
+ *   columns={columns}
+ *   pagination={{
+ *     itemsPerPage: 25,
+ *     defaultPageIndex: 0,
+ *     onPageChange: (pageIndex) => console.log('Page changed to:', pageIndex),
+ *     showCount: true,
+ *   }}
+ * />
  */
 export declare function DataTable<T>(props: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Table/DataTable/DataTable.test-data.d.ts

@@ -7,6 +7,7 @@ export type TableStoryData = {
     status?: Status[];
 };
 export declare const data: TableRow<TableStoryData>[];
+export declare const longData: TableRow<TableStoryData>[];
 export declare const dataWithEmptyCells: TableRow<TableStoryData>[];
 export declare const dataWithSubRow: TableRow<TableStoryData>[];
 export declare const dataWithSubComponent: TableRow<TableStoryData>[];

package/dist/beta/components/Table/DataTable/internal/DataTableContext.d.ts

@@ -3,7 +3,7 @@ import { RegisterCellProps } from '../../internal/focus-management/useFocusManag
 /**
  * The context type for the table
  */
-interface DataTableContextType {
+export interface DataTableContextType {
     hoveredColumnId: string | null;
     setHoveredColumnId: (columnId: string | null) => void;
     isOffGridInteractionOccurring: boolean;
@@ -23,4 +23,3 @@ interface DataTableContextType {
  * The context for the table context provider
  */
 export declare const DataTableContext: import('react').Context<DataTableContextType | undefined>;
-export {};

package/dist/beta/components/Table/DataTable/internal/DataTablePagination.d.ts

@@ -0,0 +1,3 @@
+import { PaginationProps } from '../../../../..';
+export type DataTablePaginationProps = Pick<PaginationProps, "page" | "itemsPerPage" | "totalItemCount" | "showCount" | "onPageChange">;
+export declare const DataTablePagination: ({ showCount, ...props }: DataTablePaginationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Table/DataTable/internal/useAsyncData.d.ts

@@ -0,0 +1,5 @@
+export declare const useAsyncData: <T>(dataOrPromise: T | Promise<T>) => {
+    data: T | null;
+    error: boolean;
+    isLoading: boolean;
+};

package/dist/beta/components/Table/DataTable/internal/useDataTableContext.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Hook to access the internal data table context
+ */
+export declare function useDataTableContext(): import('./DataTableContext').DataTableContextType;

package/dist/beta/components/Table/DataTable/stories/DataTable.story-data.d.ts

@@ -15,6 +15,7 @@ export declare const expandedRowData: TableRow<TableStoryData>[];
 export declare const subComponentsData: TableRow<TableStoryData>[];
 export declare const primaryColumns: import('../..').ColumnDef<TableStoryData>[];
 export declare const groupedColumns: import('../..').ColumnDef<TableStoryData>[];
+export declare const columnsWithoutFooter: import('../..').ColumnDef<TableStoryData>[];
 export type Category = "electronics" | "clothing" | "home" | "garden" | "other";
 export type EditableTableStoryData = {
     id: string;

package/dist/beta/components/Table/DataTable/types.d.ts

@@ -0,0 +1,43 @@
+import { TableRow } from '../types';
+/**
+ * Configuration for pagination in DataTable
+ */
+export type DataTablePaginationConfig<T> = {
+    /**
+     * Number of rows displayed per page
+     * @default 25
+     */
+    rowsPerPage?: number;
+    /**
+     * Current page index (0-based)
+     */
+    currentPageIndex?: number;
+    /**
+     * Function to get the data for the current page. When used, the data displayed will be
+     * fully controlled by the implementor. This is useful for server-side pagination scenarios where
+     * the total number of rows may differ from the data array length.
+     */
+    loadPageData?: ({ pageIndex, pageSize, }: {
+        pageIndex: number;
+        pageSize: number;
+    }) => TableRow<T>[] | Promise<TableRow<T>[]>;
+    /**
+     * Default page index for uncontrolled mode (0-based)
+     * @default 0
+     */
+    defaultPageIndex?: number;
+    /**
+     * Callback when page changes. Receives the new page index (0-based)
+     */
+    onPageChange?: (pageIndex: number) => void;
+    /**
+     * Whether to display the item count information in pagination
+     * @default true
+     */
+    showCount?: boolean;
+    /**
+     * Total number of rows across all pages. Falls back to data.length if not provided.
+     * Useful for server-side pagination scenarios where totalRowCount may differ from data array length.
+     */
+    totalRowCount?: number;
+};

package/dist/beta/components/Table/createColumnHelper.d.ts

@@ -4,7 +4,7 @@ import { ColumnDef } from './types';
  * Utility type that allows a value to be either the original type or,
  * if it's an array, one of the elements in the array
  */
-type ValueOrElement<V> = V extends (infer U)[] ? V | U : V;
+export type ValueOrElement<V> = V extends (infer U)[] ? V | U : V;
 /**
  * Factory function to create column helper function for defining Table columns
  *
@@ -22,4 +22,3 @@ export declare function createColumnHelper<T>(): <K extends keyof T>(id: K | {
         label: string;
     }[];
 }) => ColumnDef<T>;
-export {};

package/dist/beta/components/Table/index.d.ts

@@ -1,3 +1,4 @@
+export * from './createColumnHelper';
 export * from './formatters';
 export * from './DataTable';
 export * from './types';

package/dist/beta.js

@@ -1,5 +1,5 @@
-export { D as DataTable, c as chipsFormatter, a as currencyFormatter, p as percentFormatter } from './DataTable-BHI2ONJ-.js';
-export { T as Toolbar, a as ToolbarButton, c as ToolbarButtonLink, b as ToolbarButtonToggle, e as ToolbarControlGroup, g as ToolbarElement, f as ToolbarSearchField, d as ToolbarSelect } from './Toolbar-hhk9ZQ9l.js';
-export { u as useCalendarBetaProps } from './Calendar-BWETPlKE.js';
-export { C as Calendar } from './Calendar-Bv7N3SoB.js';
+export { D as DataTable, a as chipsFormatter, c as createColumnHelper, b as currencyFormatter, p as percentFormatter } from './DataTable-BkNCMaVu.js';
+export { T as Toolbar, a as ToolbarButton, c as ToolbarButtonLink, b as ToolbarButtonToggle, e as ToolbarControlGroup, g as ToolbarElement, f as ToolbarSearchField, d as ToolbarSelect } from './Toolbar-BvFwcXOk.js';
+export { u as useCalendarBetaProps } from './Calendar-B7ypKGUn.js';
+export { C as Calendar } from './Calendar-1MhJ03iy.js';
 //# sourceMappingURL=beta.js.map

package/dist/components/DateFieldYearless/DateFieldYearless.d.ts

@@ -1,7 +1,9 @@
-import { DataTrackingId } from '../../types';
+import { DataTrackingId, LayoutUtilProps, Size } from '../../types';
 import { YearlessDate, YearlessDateMode } from './types';
-import { MaskedYearlessDateInputProps } from './internal/MaskedYearlessDateInput';
-export type DateFieldYearlessProps = Omit<MaskedYearlessDateInputProps, "onChange" | "value" | "defaultValue" | "ref" | "required" | "autoComplete"> & {
+import { ReactElement, ReactNode, ComponentPropsWithoutRef } from 'react';
+import { FieldLabelProps } from '../FieldLabel';
+import { HelperProps } from '../../internal/components';
+export type DateFieldYearlessProps = Omit<ComponentPropsWithoutRef<"input">, "onChange" | "value" | "defaultValue" | "ref" | "size" | "type" | "onFocus" | "onBlur"> & LayoutUtilProps & {
     /**
      * The controlled value of the date field
      */
@@ -39,6 +41,58 @@ export type DateFieldYearlessProps = Omit<MaskedYearlessDateInputProps, "onChang
          */
         dates?: YearlessDate[];
     };
+    /**
+     * Whether the picker is disabled
+     */
+    disablePicker?: boolean;
+    /**
+     * Error state or error message
+     */
+    error?: ReactElement | string | boolean;
+    /**
+     * Label for the field
+     */
+    label?: FieldLabelProps["children"];
+    /**
+     * Props for the label component
+     */
+    labelProps?: FieldLabelProps;
+    /**
+     * Description text for the field
+     */
+    description?: HelperProps["description"];
+    /**
+     * Error aria-live setting
+     */
+    errorAriaLive?: HelperProps["errorAriaLive"];
+    /**
+     * Size of the input
+     */
+    size?: Extract<Size, "small" | "medium" | "large">;
+    /**
+     * Whether the field is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether the field is in loading state
+     */
+    loading?: boolean;
+    /**
+     * Additional info content
+     */
+    moreInfo?: ReactNode;
+    /**
+     * Whether to disable the format hint
+     */
+    disableHint?: boolean;
+    /**
+     * Function to call when the field is focused
+     */
+    onFocus?: (event: React.FocusEvent) => void;
+    /**
+     * Function to call when the field is blurred
+     */
+    onBlur?: (event: React.FocusEvent) => void;
 } & DataTrackingId;
 /**
  * Represents a change event for the DateFieldYearless component

package/dist/components/DateFieldYearless/internal/PickerList.d.ts

@@ -0,0 +1,61 @@
+import { ComponentPropsWithoutRef } from 'react';
+import { LayoutUtilProps } from '../../../types';
+/**
+ * Represents an item in the picker list with a label and optional disabled state.
+ */
+export type PickerListItem = {
+    /** The display label for the item */
+    label: string;
+    /** The value of the item */
+    value: number;
+    /** Whether the item is disabled and cannot be selected */
+    disabled?: boolean;
+};
+/**
+ * Props for the PickerList component
+ * @extends ComponentPropsWithoutRef<"ul">
+ * @extends LayoutUtilProps
+ */
+export type PickerListProps = Omit<ComponentPropsWithoutRef<"ul">, "children"> & LayoutUtilProps & {
+    /** Array of items to render */
+    items: PickerListItem[];
+    /** Currently selected item (controlled) */
+    selected?: PickerListItem;
+    /** Callback when selection changes */
+    onSelectionChange?: (selected: PickerListItem | undefined) => void;
+};
+/**
+ * Ref methods exposed by PickerList
+ */
+export type PickerListRef = {
+    /** Scroll to a specific item by label */
+    scrollToItem: (label: string, behavior?: ScrollBehavior) => void;
+    /** Scroll to a specific item by value */
+    scrollToValue: (value: number, behavior?: ScrollBehavior) => void;
+};
+/**
+ * PickerList component for selecting items from a list.
+ *
+ * Features:
+ * - Single selection mode only
+ * - Mouse click selection
+ * - Programmatic scrolling to specific items
+ * - Support for disabled items
+ * - Accessible with proper ARIA attributes
+ * - Visual consistency with Listbox component
+ *
+ * @example
+ * <PickerList
+ *   items={months}
+ *   selected={selectedMonth}
+ *   onSelectionChange={handleMonthChange}
+ * />
+ */
+export declare const PickerList: import('react').ForwardRefExoticComponent<Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref">, "children"> & LayoutUtilProps & {
+    /** Array of items to render */
+    items: PickerListItem[];
+    /** Currently selected item (controlled) */
+    selected?: PickerListItem;
+    /** Callback when selection changes */
+    onSelectionChange?: (selected: PickerListItem | undefined) => void;
+} & import('react').RefAttributes<PickerListRef>>;

package/dist/components/DateFieldYearless/internal/PickerListOption.d.ts

@@ -0,0 +1,61 @@
+import { ComponentPropsWithoutRef } from 'react';
+import { FlexProps } from '../../Flex';
+import { DataTrackingId } from '../../../types';
+/**
+ * Props for the PickerListOption component
+ * @extends ComponentPropsWithoutRef<"li">
+ */
+export type PickerListOptionProps = ComponentPropsWithoutRef<"li"> & {
+    /** The item object containing label, value, and optional disabled state */
+    item: {
+        label: string;
+        value: number;
+        disabled?: boolean;
+    };
+    /** Whether this option is currently selected */
+    isSelected: boolean;
+    /** Callback when this option is selected */
+    onSelectionChange: (selected: {
+        label: string;
+        value: number;
+    } | undefined) => void;
+    /** Flex alignment for items */
+    alignItems?: FlexProps["alignItems"];
+    /** Flex justification for items */
+    justifyItems?: FlexProps["justifyItems"];
+    /** Flex alignment for content */
+    alignContent?: FlexProps["alignContent"];
+    /** Flex justification for content */
+    justifyContent?: FlexProps["justifyContent"];
+    /** Flex place-items property */
+    placeItems?: FlexProps["placeItems"];
+    /** Flex place-content property */
+    placeContent?: FlexProps["placeContent"];
+} & DataTrackingId;
+export declare const PickerListOption: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
+    /** The item object containing label, value, and optional disabled state */
+    item: {
+        label: string;
+        value: number;
+        disabled?: boolean;
+    };
+    /** Whether this option is currently selected */
+    isSelected: boolean;
+    /** Callback when this option is selected */
+    onSelectionChange: (selected: {
+        label: string;
+        value: number;
+    } | undefined) => void;
+    /** Flex alignment for items */
+    alignItems?: FlexProps["alignItems"];
+    /** Flex justification for items */
+    justifyItems?: FlexProps["justifyItems"];
+    /** Flex alignment for content */
+    alignContent?: FlexProps["alignContent"];
+    /** Flex justification for content */
+    justifyContent?: FlexProps["justifyContent"];
+    /** Flex place-items property */
+    placeItems?: FlexProps["placeItems"];
+    /** Flex place-content property */
+    placeContent?: FlexProps["placeContent"];
+} & DataTrackingId & import('react').RefAttributes<HTMLLIElement>>;

package/dist/components/DateFieldYearless/internal/YearlessDateInput.d.ts

@@ -0,0 +1,51 @@
+import { InputHTMLAttributes } from 'react';
+import { YearlessDateMode, YearlessDate } from '../types';
+import { PassThroughPropsWithRef, Size } from '../../../types';
+export type YearlessDateInputChange = {
+    event: React.ChangeEvent<HTMLInputElement> | null;
+    value: YearlessDate | null;
+    isInputValid: boolean;
+    isInputEmpty: boolean;
+};
+export type YearlessDateInputChangeHandler = (change: YearlessDateInputChange) => void;
+export type YearlessDateInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "ref" | "size"> & {
+    onChange: YearlessDateInputChangeHandler;
+    mode?: YearlessDateMode;
+    value?: YearlessDate | null;
+    error?: boolean;
+    size?: Extract<Size, "small" | "medium" | "large">;
+    wrapperProps?: PassThroughPropsWithRef<"div">;
+    rootProps?: PassThroughPropsWithRef<"div">;
+    loading?: boolean;
+    enableStepping?: boolean;
+};
+export type YearlessDateInputRef = HTMLInputElement & {
+    setValue: (value: YearlessDate | null) => {
+        value: YearlessDate | null;
+        isInputValid: boolean;
+        isInputEmpty: boolean;
+    };
+    removePlaceholder: (value: string) => string;
+};
+/**
+ * A masked date input component that allows for the input of a date in a specific format.
+ *
+ * Provides a `setDate` method that can be used to set the date from outside the component (e.g from a calendar).
+ *
+ * @internal This component is not intended to be used directly in consumer code.
+ *
+ * @param props - The props for the MaskedDateInput component.
+ * @param props.onChange - The function to call when the date changes.
+ * @param props.mode - The mode of the date input.
+ */
+export declare const YearlessDateInput: import('react').ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "ref" | "value" | "onChange"> & {
+    onChange: YearlessDateInputChangeHandler;
+    mode?: YearlessDateMode;
+    value?: YearlessDate | null;
+    error?: boolean;
+    size?: Extract<Size, "small" | "medium" | "large">;
+    wrapperProps?: PassThroughPropsWithRef<"div">;
+    rootProps?: PassThroughPropsWithRef<"div">;
+    loading?: boolean;
+    enableStepping?: boolean;
+} & import('react').RefAttributes<YearlessDateInputRef>>;

package/dist/components/DateFieldYearless/internal/YearlessDateInputWithPicker.d.ts

@@ -0,0 +1,134 @@
+import { InputHTMLAttributes } from 'react';
+import { YearlessDateMode, YearlessDate } from '../types';
+import { DateFieldYearlessChangeHandler } from '../DateFieldYearless';
+import { Size } from '../../../types';
+export type YearlessDateInputWithPickerProps = Omit<InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "ref" | "size" | "defaultValue" | "onFocus" | "onBlur"> & {
+    /**
+     * The controlled value of the date field
+     */
+    value?: YearlessDate | null;
+    /**
+     * The default value for uncontrolled usage
+     */
+    defaultValue?: YearlessDate | null;
+    /**
+     * The function to call when the date value changes
+     */
+    onChange?: DateFieldYearlessChangeHandler;
+    /**
+     * The date format mode (mm/dd or dd/mm)
+     */
+    mode?: YearlessDateMode;
+    /**
+     * Whether the field is required
+     */
+    required?: boolean;
+    /**
+     * The minimum allowed date
+     */
+    minDate?: YearlessDate | null;
+    /**
+     * The maximum allowed date
+     */
+    maxDate?: YearlessDate | null;
+    /**
+     * Configuration for unavailable dates
+     */
+    unavailable?: {
+        /**
+         * Array of dates that are not selectable
+         */
+        dates?: YearlessDate[];
+    };
+    /**
+     * Whether the picker is disabled
+     */
+    disablePicker?: boolean;
+    /**
+     * The size of the input
+     */
+    size?: Extract<Size, "small" | "medium" | "large">;
+    /**
+     * Whether the input has an error
+     */
+    error?: boolean;
+    /**
+     * Whether the input is in loading state
+     */
+    loading?: boolean;
+    /**
+     * Function to call when the input is focused
+     */
+    onFocus?: (event: React.FocusEvent) => void;
+    /**
+     * Function to call when the input is blurred
+     */
+    onBlur?: (event: React.FocusEvent) => void;
+};
+export type YearlessDateInputWithPickerRef = {
+    focus: () => void;
+    setValue: (value: YearlessDate | null) => void;
+};
+export declare const YearlessDateInputWithPicker: import('react').ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "ref" | "value" | "onBlur" | "onFocus" | "onChange" | "defaultValue"> & {
+    /**
+     * The controlled value of the date field
+     */
+    value?: YearlessDate | null;
+    /**
+     * The default value for uncontrolled usage
+     */
+    defaultValue?: YearlessDate | null;
+    /**
+     * The function to call when the date value changes
+     */
+    onChange?: DateFieldYearlessChangeHandler;
+    /**
+     * The date format mode (mm/dd or dd/mm)
+     */
+    mode?: YearlessDateMode;
+    /**
+     * Whether the field is required
+     */
+    required?: boolean;
+    /**
+     * The minimum allowed date
+     */
+    minDate?: YearlessDate | null;
+    /**
+     * The maximum allowed date
+     */
+    maxDate?: YearlessDate | null;
+    /**
+     * Configuration for unavailable dates
+     */
+    unavailable?: {
+        /**
+         * Array of dates that are not selectable
+         */
+        dates?: YearlessDate[];
+    };
+    /**
+     * Whether the picker is disabled
+     */
+    disablePicker?: boolean;
+    /**
+     * The size of the input
+     */
+    size?: Extract<Size, "small" | "medium" | "large">;
+    /**
+     * Whether the input has an error
+     */
+    error?: boolean;
+    /**
+     * Whether the input is in loading state
+     */
+    loading?: boolean;
+    /**
+     * Function to call when the input is focused
+     */
+    onFocus?: (event: React.FocusEvent) => void;
+    /**
+     * Function to call when the input is blurred
+     */
+    onBlur?: (event: React.FocusEvent) => void;
+} & import('react').RefAttributes<YearlessDateInputWithPickerRef>>;

package/dist/components/DateFieldYearless/internal/YearlessDateSelectionPopover.d.ts

@@ -0,0 +1,27 @@
+import { RefObject } from 'react';
+import { YearlessDateMode } from '..';
+import { PopoverTriggerProps } from '../../Popover/PopoverTrigger';
+/**
+ * Props for the YearlessDateSelectionPopover component
+ */
+export type YearlessDateSelectionPopoverProps = {
+    popoverRef: RefObject<{
+        openPopover: () => void;
+        closePopover: () => void;
+    }>;
+    popoverContentRef: RefObject<HTMLDivElement>;
+    month: number | null;
+    day: number | null;
+    onMonthChange: (month: number | null) => void;
+    onDayChange: (day: number | null) => void;
+    onClose: () => void;
+    mode: YearlessDateMode;
+    onFocus?: (event: React.FocusEvent) => void;
+    onBlur?: (event: React.FocusEvent) => void;
+} & PopoverTriggerProps;
+/**
+ * A yearless date selection tool built into a popover.
+ * @param param0
+ * @returns
+ */
+export declare function YearlessDateSelectionPopover({ children, popoverRef, popoverContentRef, month, day, onMonthChange, onDayChange, onClose, mode, onFocus, onBlur, }: YearlessDateSelectionPopoverProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/DateFieldYearless/internal/maskito/yearlessDatePlaceholderMask.d.ts

@@ -1,6 +1,7 @@
 import { YearlessDateMode } from '../../types';
-declare const yearlessDatePlaceholderMask: ({ mode, separator, placeholder, }: {
+declare const yearlessDatePlaceholderMask: ({ mode, separator, placeholder, enableStepping, }: {
     mode: YearlessDateMode;
+    enableStepping: boolean;
     separator?: string;
     placeholder: string;
 }) => {
@@ -12,5 +13,6 @@ declare const yearlessDatePlaceholderMask: ({ mode, separator, placeholder, }: {
         overwriteMode: "replace" | "shift" | ((elementState: import('@maskito/core/src/lib/types').ElementState) => "replace" | "shift");
     };
     removePlaceholder: (value: string) => string;
+    transform: (value: string) => string;
 };
 export default yearlessDatePlaceholderMask;

package/dist/components/DateFieldYearless/internal/maskito/yearlessDateSegmentsStepping.d.ts

@@ -0,0 +1,12 @@
+import { MaskitoPlugin } from '@maskito/core';
+import { YearlessDateMode } from '../../types';
+/**
+ * Creates a Maskito plugin for yearless date segment stepping
+ * @param mode - The date format mode (mm/dd or dd/mm)
+ * @returns MaskitoPlugin that handles arrow key navigation
+ * @example
+ * const plugin = createYearlessDateSegmentsSteppingPlugin({ mode: "mm/dd" });
+ */
+export declare function createYearlessDateSegmentsSteppingPlugin({ mode, }: {
+    mode: YearlessDateMode;
+}): MaskitoPlugin;