Skip to content

Commit e36e237

Browse files
docs(date-time-editor, date-picker): update readme files
1 parent 82d66a9 commit e36e237

File tree

2 files changed

+52
-54
lines changed

2 files changed

+52
-54
lines changed

projects/igniteui-angular/src/lib/date-picker/README.md

Lines changed: 46 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -91,54 +91,53 @@ The date picker also supports binding through `ngModel` if two-way date-bind is
9191
# API
9292

9393
###### Inputs
94-
| Name | Type | Description |
95-
|:----------|:-------------:|:------|
96-
| `id` | string | Unique identifier of the component. If not provided it will be automatically generated.|
97-
| `todayBottonLabel` | `string` | Renders today button with custom content, which selects today date from calendar, and fill the datePicker input. |
98-
| `cancelButtonLabel` | `string` | Renders cancel button with custom content, which closes the calendar. |
99-
| `formatter` | `function` | Applied custom formatter on the selected or passed in date. |
100-
| `formatViews` | `PickersFormatViews` | Determines if `day`, `month` and `year` will be rendered in the calendar. `locale` and `calendarFormat` are taken into account as well, if present.
101-
| `disabled` | `boolean` | Disables the date picker. |
102-
| `weekStart`| `Number | WEEKDAYS` | Sets on which day will the week start. |
103-
| `locale` | `string` | Sets the locale used for formatting and displaying the dates in the calendar. For more information check out [this](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl) page for valid formats. |
104-
| `displayFormat` | `string` | The format used to display the picker's value when it's not being edited. |
105-
| `inputFormat` | `string` | The editor's input mask. |
106-
| `disabledDates` | `DateRangeDescriptor[]` | Configure the disabled dates. |
107-
| `specialDates` | `DateRangeDescriptor[]` | Configure the special dates. |
108-
| `calendarFormat` | `PickersFormatOptions` | The calendar's format options for the day view.
109-
| `value` | `Date | string` | The date picker's value and the selected date in the calendar. |
110-
| `headerOrientation` | `'horizontal' | 'vertical'` | Determines whether the calendar's header renders in vertical or horizontal state. Applies only in dialog mode. |
111-
| `mode` | `'dropdown' | 'dialog'` | Sets whether `IgxDatePickerComponent` is in dialog or dropdown mode. |
112-
| `spinLoop` | `boolean` | Determines if the currently spun date segment should loop over. |
113-
| `spinDelta` | `DatePartDeltas` | Delta values used to increment or decrement each editor date part on spin actions. All values default to `1`.
114-
| `type` | `IgxInputGroupType` | Determines how the picker will be styled.
115-
| `displayMonthsCount` | `number` | Sets the number of displayed month views. Default is `2`. |
116-
| `hideOutsideDays`| `boolean` | Controls the visibility of the dates that do not belong to the current month. |
117-
| `overlaySettings` | `OverlaySettings` | Changes the default overlay settings used by the `IgxDatePickerComponent`.
118-
| `placeholder` | `string` | Sets the placeholder text for empty input.
119-
| `minValue` | `Date | string` | The minimum value required for the picker to remain valid.
120-
| `maxValue` | `Date | string` | The maximum value required for the editor to remain valid.
121-
122-
94+
| Name | Description | Type |
95+
|:-----|:------------|:----|
96+
| `id` | `attr.id` of the picker. | string |
97+
| `mode` | Sets whether `IgxDatePickerComponent` is in dialog or dropdown mode. | InteractionMode |
98+
| `value` | The value of the editor. | Date |
99+
| `minValue` | The minimum value required for the picker to remain valid. | Date \| string |
100+
| `maxValue` | The maximum value required for the editor to remain valid. | Date \| string |
101+
| `displayFormat` | The display value of the editor. | string |
102+
| `inputFormat` | The format that the editor will use to display the date/time. | string |
103+
| `calendarFormat` | The calendar's format options for the day view. | PickersFormatOptions |
104+
| `specialDates` | Dates that will be marked as special in the calendar. | DateRangeDescriptor[] |
105+
| `disabledDates` | Dates that will be disabled in the calendar. | DateRangeDescriptor[] |
106+
| `formatViews` | Determines if `day`, `month` and `year` will be rendered in the calendar. `locale` and `formatOptions` are taken into account as well, if present. | PickersFormatViews |
107+
| `displayMonthsCount` | Sets the number of displayed month views. Default is `2`. | number |
108+
| `hideOutsideDays` | Sets whether dates that are not part of the current month will be displayed. Default is `false`. | boolean |
109+
| `showWeekNumbers` | Shows or hides week numbers. | number |
110+
| `tabindex` | The editor's tabindex. | number |
111+
| `weekStart`| Sets the start day of the week. | number |
112+
| `locale` | Locale settings used in `displayFormat` and for localizing the calendar. | string |
113+
| `overlaySettings` | Changes the default overlay settings used by the `IgxDatePickerComponent`. | OverlaySettings |
114+
| `placeholder` | Sets the placeholder text for empty input. | string |
115+
| `disabled` | Disables or enables the picker. | boolean |
116+
| `outlet` | The container used for the pop up element. | IgxOverlayOutletDirective \| ElementRef |
117+
| `type` | Determines how the picker will be styled. | IgxInputGroupType |
118+
| `spinLoop` | Determines if the currently spun date segment should loop over. | boolean |
119+
| `spinDelta` | Delta values used to increment or decrement each editor date part on spin actions. All values default to `1`. | DatePartDeltas |
120+
| `cancelButtonLabel` | The label of the `cancel` button. No button is rendered if there is no label provided. | string |
121+
| `todayButtonLabel` | The label of the `select today` button. No button is rendered if there is no label provided. | string |
122+
| `headerOrientation` | Determines whether the calendar's header renders in `vertical` or `horizontal` state. Applies only in `dialog` mode. | 'horizontal' \| 'vertical' |
123123

124124
### Outputs
125-
| Name | Return Type | Description |
126-
|:--:|:---|:---|
127-
| `opening` | `IBaseCancelableBrowserEventArgs` | Fired when the calendar has started opening, cancelable. |
128-
| `opened` | `IBaseEventArgs` | Fired after the calendar has opened. |
129-
| `closing` | `IBaseCancelableBrowserEventArgs` | Fired when the calendar has started closing, cancelable. |
130-
| `closed` | `IBaseEventArgs` | Fired after the calendar has closed. |
131-
| `validationFailed` | `IDatePickerValidationFailedEventArgs` | Emitted when a user enters an invalid date string or when the value is not within a min/max range. |
132-
| `valueChange` | `Date` | Emitted when the picker's value changes. Allows two-way binding of `value`. |
125+
| Name | Description | Emitted with |
126+
|:-----|:------------|:----|
127+
| `opening` | Fired when the calendar has started opening, cancelable. | IBaseCancelableBrowserEventArgs |
128+
| `opened` | Fired after the calendar has opened. | IBaseEventArgs |
129+
| `closing` | Fired when the calendar has started closing, cancelable. | IBaseCancelableBrowserEventArgs |
130+
| `closed` | Fired after the calendar has closed. | IBaseEventArgs |
131+
| `valueChange` | Emitted when the picker's value changes. Allows two-way binding of `value`. | Date |
132+
| `validationFailed` | Emitted when a user enters an invalid date string or when the value is not within a min/max range. | IDatePickerValidationFailedEventArgs |
133133

134134
### Methods
135-
| Name | Arguments | Return Type | Description |
136-
|:----------:|:------|:------|:------|
137-
| `select` | `Date` | `void` | Accepts a Date object and selects the corresponding date from the calendar. |
138-
| `clear` | n/a | `void` | Clears the editor's date. |
139-
| `selectToday` | n/a | `void` | Selects today's date in calendar and changes the input field value. |
140-
| `open` | `OverlaySettings` | `void` | Opens the calendar. |
141-
| `close` | n/a | `void` | Closes the calendar. |
142-
| `toggle` | `OverlaySettings` | `void` | Toggles the calendar between opened and closed states. |
143-
| `increment` | `DatePart?, number?` | | `void` | Accepts a `DatePart` and increments it by one. If no value is provided, it defaults to the part at the position of the cursor.
144-
| `decrement` | `DatePart?, number?` | `void` | Accepts a `DatePart` and decrements it by one. If no value is provided, it defaults to the part at the position of the cursor.
135+
| Name | Description | Return type |
136+
|:-----|:------------|:----|
137+
| `select` | Accepts a Date object and selects the corresponding date from the calendar. | void |
138+
| `clear` | Clears the editor's date. | void |
139+
| `open` | Opens the calendar. | void |
140+
| `close` | Closes the calendar. | void |
141+
| `toggle` | Toggles the calendar between opened and closed states. | void |
142+
| `increment` | Accepts a `DatePart` and increments it by one. If no value is provided, it defaults to the part at the position of the cursor. | void |
143+
| `decrement` | Accepts a `DatePart` and decrements it by one. If no value is provided, it defaults to the part at the position of the cursor. | void |

projects/igniteui-angular/src/lib/directives/date-time-editor/README.md

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -94,14 +94,15 @@ public datePart: typeof DatePart = DatePart;
9494
### API
9595
| Name | Type | Description |
9696
|:-----|:----|:------------|
97-
| `value` | Date | The value of the editor. |
97+
| `value` | Date \| string | The value of the editor. |
9898
| `displayFormat` | string | The display value of the editor. |
9999
| `inputFormat` | string | The format that the editor will use to display the date/time. |
100-
| `minValue` | string / Date | Sets the minimum value required for the editor to remain valid. |
101-
| `maxValue` | string / Date | Sets the maximum value required for the editor to remain valid. |
102-
| `isSpinLoop` | boolean | Loop over the currently spun segment. |
100+
| `minValue` | Date \| string | Sets the minimum value required for the editor to remain valid. |
101+
| `maxValue` | Date \| string | Sets the maximum value required for the editor to remain valid. |
102+
| `spinLoop` | boolean | Loop over the currently spun segment. |
103+
| `spinDelta` | DatePartDeltas | Delta values used to increment or decrement each editor date part on spin actions. All values default to `1`.
103104
| `promptChar` | string | Defines the empty characters in the mask. |
104-
| `locale` | string | Locale settings used in displayFormat. |
105+
| `locale` | string | Locale settings used in displayFormat. |
105106

106107
#### Methods
107108
| Name | Type | Description |
@@ -115,5 +116,3 @@ public datePart: typeof DatePart = DatePart;
115116
|:-----|:----|:------------|
116117
| `valueChanged` | custom | Fired when the editor's value has changed. |
117118
| `validationFailed` | custom | Fired when the editor is not within a specified range. Can revert back to a previously valid state by changing the `newValue` property of the `args` parameter. |
118-
119-

0 commit comments

Comments
 (0)