@coreui/react-pro/dist/cjs/components/time-picker/CTimePicker.d.ts

UI Components Library for React.js

import React, { ReactNode } from 'react';
import { CFormControlWrapperProps } from '../form/CFormControlWrapper';
import { CPickerProps } from './../picker/CPicker';
import { Colors } from '../../types';
export interface CTimePickerProps extends Omit<CFormControlWrapperProps, 'floatingLabel'>, Omit<CPickerProps, 'placeholder'> {
    /**
     * Set if the component should use the 12/24 hour format. If `true` forces the interface to a 12-hour format. If `false` forces the interface into a 24-hour format. If `auto` the current locale will determine the 12 or 24-hour interface by default locales.
     *
     * @since 4.8.0
     */
    ampm?: 'auto' | boolean;
    /**
     * A string of all className you want applied to the component.
     */
    className?: string;
    /**
     * Toggle visibility or set the content of cancel button.
     */
    cancelButton?: boolean | ReactNode;
    /**
     * Sets the color context of the cancel button to one of CoreUI’s themed colors.
     *
     * @type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string
     */
    cancelButtonColor?: Colors;
    /**
     * Size the cancel button small or large.
     */
    cancelButtonSize?: 'sm' | 'lg';
    /**
     * Set the cancel button variant to an outlined button or a ghost button.
     */
    cancelButtonVariant?: 'outline' | 'ghost';
    /**
     * A string of all className you want applied to the component.
     */
    /**
     * Toggle visibility or set the content of the cleaner button.
     */
    cleaner?: ReactNode | boolean;
    /**
     * Toggle visibility or set the content of confirm button.
     */
    confirmButton?: boolean | ReactNode;
    /**
     * Sets the color context of the confirm button to one of CoreUI’s themed colors.
     *
     * @type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string
     */
    confirmButtonColor?: Colors;
    /**
     * Size the confirm button small or large.
     */
    confirmButtonSize?: 'sm' | 'lg';
    /**
     * Set the confirm button variant to an outlined button or a ghost button.
     */
    confirmButtonVariant?: 'outline' | 'ghost';
    /**
     * Specify a list of available hours using an array, or customize the filtering of hours through a function.
     *
     * @since 5.0.0
     */
    hours?: number[] | ((hour: number) => number[]);
    /**
     * Set the id attribute for the input element.
     *
     * @since 5.3.0
     */
    id?: string;
    /**
     * Toggle visibility or set the content of the input indicator.
     */
    indicator?: ReactNode | boolean;
    /**
     * Defines the delay (in milliseconds) for the input field's onChange event.
     *
     * @since 5.0.0
     */
    inputOnChangeDelay?: number;
    /**
     * Toggle the readonly state for the component.
     */
    inputReadOnly?: boolean;
    /**
     * Sets the default locale for components. If not set, it is inherited from the browser.
     */
    locale?: string;
    /**
     * Toggle the display of minutes, specify a list of available minutes using an array, or customize the filtering of minutes through a function.
     *
     * @since 5.0.0
     */
    minutes?: boolean | number[] | ((minute: number) => number[]);
    /**
     * Set the name attribute for the input element.
     *
     * @since 5.3.0
     */
    name?: string;
    /**
     * Callback fired when the time changed.
     */
    onTimeChange?: (timeString: string | null, localeTimeString?: string, date?: Date) => void;
    /**
     * Specifies a short hint that is visible in the input.
     */
    placeholder?: string;
    /**
     * When present, it specifies that time must be filled out before submitting the form.
     *
     * @since 4.10.0
     */
    required?: boolean;
    /**
     * Toggle the display of seconds, specify a list of available seconds using an array, or customize the filtering of seconds through a function.
     *
     * @since 4.8.0
     */
    seconds?: boolean | number[] | ((second: number) => number[]);
    /**
     * Size the component small or large.
     */
    size?: 'sm' | 'lg';
    /**
     * Initial selected time.
     */
    time?: Date | string | null;
    /**
     * Set the time picker variant to a roll or select.
     */
    variant?: 'roll' | 'select';
}
export declare const CTimePicker: React.ForwardRefExoticComponent<CTimePickerProps & React.RefAttributes<HTMLDivElement | HTMLLIElement>>;