Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weโ€™ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(datepicker): add since tags #1008

Merged
merged 1 commit into from
Dec 18, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/angular/src/components.ts
Original file line number Diff line number Diff line change
Expand Up @@ -498,12 +498,12 @@ import type { DateChangeEvent as IIxDatePickerDateChangeEvent } from '@siemens/i
export declare interface IxDatePicker extends Components.IxDatePicker {
/**
* Triggers if the date selection changes.
Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string` @since 2.0.0
Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string` @since 2.1.0
*/
dateChange: EventEmitter<CustomEvent<IIxDatePickerDateChangeEvent>>;
/**
* Triggers if the date selection changes.
Only triggered if date-picker-rework is in range mode. @since 2.0.0
Only triggered if date-picker-rework is in range mode. @since 2.1.0
*/
dateRangeChange: EventEmitter<CustomEvent<IIxDatePickerDateChangeEvent>>;
/**
Expand Down
29 changes: 22 additions & 7 deletions packages/core/component-doc.json
Original file line number Diff line number Diff line change
Expand Up @@ -2785,7 +2785,12 @@
"attr": "locale",
"reflectToAttr": false,
"docs": "Format of time string\nSee {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.",
"docsTags": [],
"docsTags": [
{
"name": "since",
"text": "2.1.0"
}
],
"default": "undefined",
"values": [
{
Expand Down Expand Up @@ -2911,7 +2916,7 @@
"docsTags": [
{
"name": "since",
"text": "2.0.0"
"text": "2.1.0"
}
],
"default": "0",
Expand Down Expand Up @@ -2948,7 +2953,7 @@
"docsTags": [
{
"name": "since",
"text": "2.0.0"
"text": "2.1.0"
}
]
},
Expand All @@ -2962,7 +2967,7 @@
"docsTags": [
{
"name": "since",
"text": "2.0.0"
"text": "2.1.0"
}
]
},
Expand Down Expand Up @@ -3150,7 +3155,12 @@
"attr": "locale",
"reflectToAttr": false,
"docs": "Format of time string\nSee {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.",
"docsTags": [],
"docsTags": [
{
"name": "since",
"text": "2.1.0"
}
],
"default": "undefined",
"values": [
{
Expand Down Expand Up @@ -3413,7 +3423,7 @@
"docsTags": [
{
"name": "since",
"text": "2.0.0"
"text": "2.1.0"
}
],
"default": "0",
Expand Down Expand Up @@ -11062,7 +11072,12 @@
"attr": "text-time",
"reflectToAttr": false,
"docs": "Text for top label",
"docsTags": [],
"docsTags": [
{
"name": "since",
"text": "2.1.0"
}
],
"default": "'Time'",
"values": [
{
Expand Down
18 changes: 12 additions & 6 deletions packages/core/src/components.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -573,6 +573,7 @@ export namespace Components {
"individual": boolean;
/**
* Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
* @since 2.1.0
*/
"locale": string;
/**
Expand Down Expand Up @@ -604,7 +605,7 @@ export namespace Components {
"today": string;
/**
* The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
* @since 2.0.0
* @since 2.1.0
*/
"weekStartIndex": number;
}
Expand Down Expand Up @@ -643,6 +644,7 @@ export namespace Components {
"i18nDone": string;
/**
* Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
* @since 2.1.0
*/
"locale": string;
/**
Expand Down Expand Up @@ -703,7 +705,7 @@ export namespace Components {
"to": string | undefined;
/**
* The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
* @since 2.0.0
* @since 2.1.0
*/
"weekStartIndex": number;
}
Expand Down Expand Up @@ -1965,6 +1967,7 @@ export namespace Components {
"textSelectTime": string;
/**
* Text for top label
* @since 2.1.0
*/
"textTime": string;
/**
Expand Down Expand Up @@ -3807,6 +3810,7 @@ declare namespace LocalJSX {
"individual"?: boolean;
/**
* Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
* @since 2.1.0
*/
"locale"?: string;
/**
Expand All @@ -3821,12 +3825,12 @@ declare namespace LocalJSX {
"minDate"?: string;
/**
* Triggers if the date selection changes. Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string`
* @since 2.0.0
* @since 2.1.0
*/
"onDateChange"?: (event: IxDatePickerCustomEvent<DateChangeEvent>) => void;
/**
* Triggers if the date selection changes. Only triggered if date-picker-rework is in range mode.
* @since 2.0.0
* @since 2.1.0
*/
"onDateRangeChange"?: (event: IxDatePickerCustomEvent<DateChangeEvent>) => void;
/**
Expand Down Expand Up @@ -3858,7 +3862,7 @@ declare namespace LocalJSX {
"today"?: string;
/**
* The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
* @since 2.0.0
* @since 2.1.0
*/
"weekStartIndex"?: number;
}
Expand Down Expand Up @@ -3897,6 +3901,7 @@ declare namespace LocalJSX {
"i18nDone"?: string;
/**
* Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
* @since 2.1.0
*/
"locale"?: string;
/**
Expand Down Expand Up @@ -3977,7 +3982,7 @@ declare namespace LocalJSX {
"to"?: string | undefined;
/**
* The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
* @since 2.0.0
* @since 2.1.0
*/
"weekStartIndex"?: number;
}
Expand Down Expand Up @@ -5352,6 +5357,7 @@ declare namespace LocalJSX {
"textSelectTime"?: string;
/**
* Text for top label
* @since 2.1.0
*/
"textTime"?: string;
/**
Expand Down
8 changes: 5 additions & 3 deletions packages/core/src/components/date-picker/date-picker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -136,13 +136,15 @@ export class DatePicker {
* The index of which day to start the week on, based on the Locale#weekdays array.
* E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
*
* @since 2.0.0
* @since 2.1.0
*/
@Prop() weekStartIndex = 0;

/**
* Format of time string
* See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
*
* @since 2.1.0
*/
@Prop() locale: string = undefined;
@Watch('locale')
Expand Down Expand Up @@ -174,15 +176,15 @@ export class DatePicker {
* Triggers if the date selection changes.
* Note: Since 2.0.0 `dateChange` does not dispatch detail property as `string`
*
* @since 2.0.0
* @since 2.1.0
*/
@Event() dateChange: EventEmitter<DateChangeEvent>;

/**
* Triggers if the date selection changes.
* Only triggered if date-picker-rework is in range mode.
*
* @since 2.0.0
* @since 2.1.0
*/
@Event() dateRangeChange: EventEmitter<DateChangeEvent>;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -133,13 +133,15 @@ export class DatetimePicker {
* The index of which day to start the week on, based on the Locale#weekdays array.
* E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
*
* @since 2.0.0
* @since 2.1.0
*/
@Prop() weekStartIndex = 0;

/**
* Format of time string
* See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
*
* @since 2.1.0
*/
@Prop() locale: string = undefined;

Expand Down
2 changes: 2 additions & 0 deletions packages/core/src/components/time-picker/time-picker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,8 @@ export class TimePicker {

/**
* Text for top label
*
* @since 2.1.0
*/
@Prop() textTime: string = 'Time';

Expand Down
38 changes: 3 additions & 35 deletions packages/documentation/docs/controls/date-picker.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,59 +2,27 @@ import Playground from '@site/src/components/Playground';
import Props from './../auto-generated/ix-date-picker/props.md';
import Events from './../auto-generated/ix-date-picker/events.md';

import SourceDatepicker from './../auto-generated/previews/web-component/datepicker.md'
import SourceReactDatepicker from './../auto-generated/previews/react/datepicker.md'
import SourceAngularDatepicker from './../auto-generated/previews/angular/datepicker.ts.md'
import SourceVueDatepicker from './../auto-generated/previews/vue/datepicker.md'

import SourceDatepickerRange from './../auto-generated/previews/web-component/datepicker-range.md'
import SourceReactDatepickerRange from './../auto-generated/previews/react/datepicker-range.md'
import SourceAngularDatepickerRange from './../auto-generated/previews/angular/datepicker-range.ts.md'
import SourceVueDatepickerRange from './../auto-generated/previews/vue/datepicker-range.md'


import SourceDatepickerLocale from './../auto-generated/previews/web-component/datepicker.md'
import SourceReactDatepickerLocale from './../auto-generated/previews/react/datepicker.md'
import SourceAngularDatepickerLocale from './../auto-generated/previews/angular/datepicker.ts.md'
import SourceVueDatepickerLocale from './../auto-generated/previews/vue/datepicker-locale.md'

# Date picker

## Range Selection

<Playground
name="datepicker-range" height="35rem"
hideInitalCodePreview
frameworks={{
react: SourceReactDatepickerRange,
angular: SourceAngularDatepickerRange,
javascript: SourceDatepickerRange,
vue: SourceVueDatepickerRange
}}></Playground>
examplesByName></Playground>

## Single Selection

<Playground
name="datepicker" height="35rem"
frameworks={{
react: SourceReactDatepicker,
angular: SourceAngularDatepicker,
javascript: SourceDatepicker,
vue: SourceVueDatepicker
}}></Playground>
examplesByName></Playground>

## Translation

The `ix-date-picker` can be configured using [BCP 47](https://tools.ietf.org/html/rfc5646) locale strings specifying the language to use generating or interpreting strings. More information can be found [here](https://moment.github.io/luxon/#/intl?id=default-locale)

<Playground
name="datepicker-locale" height="35rem"
frameworks={{
react: SourceReactDatepickerLocale,
angular: SourceAngularDatepickerLocale,
javascript: SourceDatepickerLocale,
vue: SourceVueDatepickerLocale
}}></Playground>
examplesByName></Playground>

## Properties

Expand Down