UNPKG

@progress/kendo-vue-dateinputs

Version:
161 lines (160 loc) 5.32 kB
/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2026 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the package root for more information *------------------------------------------------------------------------------------------- */ import { DateInputFormatPlaceholder } from './format-placeholder'; import { DateInputIncrementalSteps } from './incremental-steps'; import { DateFormatOptions } from '@progress/kendo-vue-intl'; /** * @hidden */ export interface DateInputSettings { /** * Specifies the `date` format which is used for formatting the value ([see example]({% slug formats_dateinput %}). If not set, the default format will be used. */ format?: string | DateFormatOptions; /** * Specifies the descriptions of the format sections in the input field ([more information and example]({% slug placeholders_dateinput %}). */ formatPlaceholder?: DateInputFormatPlaceholder; /** * Specifies the width of the DateInput. */ width?: number | string; /** * Configures the `size` of the DateInput. * * The available options are: * - small * - medium * - large * - null—Does not set a size `class`. * * @default `medium` */ size?: null | 'small' | 'medium' | 'large'; /** * Configures the `roundness` of the DateInput. * * The available options are: * - small * - medium * - large * - circle * - full * - null—Does not set a rounded `class`. * * @default `medium` */ rounded?: null | 'small' | 'medium' | 'large' | 'full' | string; /** * Configures the `fillMode` of the DateInput. * * The available options are: * - solid * - outline * - flat * - link * - null—Does not set a fillMode `class`. * * @default `solid` */ fillMode?: null | 'solid' | 'outline' | 'flat' | string; /** * Sets the `tabIndex` property of the DateInput. */ tabIndex?: number; /** * Sets the title of the `input` element of the DateInput. */ title?: string; /** * Sets the aria-label of the DateInput. */ ariaLabel?: string; /** * Sets the aria role of the DateInput. */ ariaRole?: string; /** * Sets the aria-controls of the DateInput. */ ariaControls?: string; /** * Sets the aria-haspopup of the DateInput. */ ariaHasPopup?: String; /** * Sets the aria-expanded of the DateInput. */ ariaExpanded?: boolean; /** * Specifies the incremental steps of the DateInput ([see example]({% slug incrementalsteps_dateinput %}). * * The available options are: * - `year: Number`—Controls the incremental step of the year value. * - `month: Number`—Controls the incremental step of the month value. * - `day: Number`—Controls the incremental step of the day value. * - `hour: Number`—Controls the incremental step of the hour value. * - `minute: Number`—Controls the incremental step of the minute value. * - `second: Number`—Controls the incremental step of the second value. */ steps?: DateInputIncrementalSteps; /** * Specifies the smallest date that is valid ([see example]({% slug dateranges_dateinput %}). */ min?: Date; /** * Specifies the greatest date that is valid ([see example]({% slug dateranges_dateinput %}). */ max?: Date; /** * Specifies the smallest time that is valid ([see example]({% slug dateranges_dateinput %}#toc-limiting-the-time-range). */ minTime?: Date; /** * Specifies the greatest time that is valid ([see example]({% slug dateranges_dateinput %}#toc-limiting-the-time-range). */ maxTime?: Date; /** * Determines whether the DateInput is disabled ([see example]({% slug disabled_dateinput %})). */ disabled?: boolean; /** * Specifies whether the **Up** and **Down** spin buttons will be rendered ([see example]({% slug spinbuttons_dateinput %})). */ spinners?: boolean; /** * Specifies the name property of the input DOM element. */ name?: string; /** * Represents the `dir` HTML attribute. */ dir?: string; /** * Renders a floating label for the DateInput. */ label?: string; /** * Sets the `id` of the `input` DOM element. */ id?: string; /** * Identifies the element(s) which will describe the component, similar to [HTML aria-describedby attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute). * For example these elements could contain error or hint message. */ ariaDescribedBy?: string; /** * Identifies the element(s) which will label the component. */ ariaLabelledBy?: string; /** * Sets the built-in HTML attributes of the inner focusable input element. * Attributes which are essential for certain component functionalities cannot be changed. */ inputAttributes?: Object; }