From a03cf570908862d0192f5fcf114c388c91780bb5 Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 2 Aug 2023 17:20:27 +0200 Subject: [PATCH] docs: update content --- docs/assets/js/snippets.js | 35 +++++++++++------- docs/content/forms/date-picker.md | 17 +-------- docs/content/forms/date-range-picker.md | 48 ++----------------------- 3 files changed, 25 insertions(+), 75 deletions(-) diff --git a/docs/assets/js/snippets.js b/docs/assets/js/snippets.js index 7ca65226f..737f470c4 100644 --- a/docs/assets/js/snippets.js +++ b/docs/assets/js/snippets.js @@ -176,8 +176,7 @@ const myMultiSelect = document.getElementById('multiSelect') if (myMultiSelect) { - // eslint-disable-next-line no-unused-vars - const toastCoreUI = new coreui.MultiSelect(myMultiSelect, { + new coreui.MultiSelect(myMultiSelect, { name: 'multiSelect', options: [ { @@ -219,17 +218,18 @@ ], search: true }) - // js-docs-end multi-select-array-data } + // js-docs-end multi-select-array-data // ------------------------------- // Date Pickers // ------------------------------- // 'Date Pickers components' example in docs only - if (document.getElementById('myDatePickerDisabledDates')) { - // eslint-disable-next-line no-unused-vars - const myDatePickerDisabledDates = new coreui.DatePicker(document.getElementById('myDatePickerDisabledDates'), { + // js-docs-start date-picker-disabled-dates + const myDatePickerDisabledDates = document.getElementById('myDatePickerDisabledDates') + if (myDatePickerDisabledDates) { + const optionsDatePickerDisabledDates = { locale: 'en-US', calendarDate: new Date(2022, 2, 1), disabledDates: [ @@ -240,15 +240,20 @@ ], maxDate: new Date(2022, 5, 0), minDate: new Date(2022, 1, 1) - }) + } + + new coreui.DatePicker(document.getElementById('myDatePickerDisabledDates'), optionsDatePickerDisabledDates) } + // js-docs-end date-picker-disabled-dates // ------------------------------- // Date Range Pickers // ------------------------------- // 'Date Range Pickers components' example in docs only - if (document.getElementById('myDateRangePickerDisabledDates')) { + // js-docs-start date-range-picker-disabled-dates + const myDateRangePickerDisabledDates = document.getElementById('myDateRangePickerDisabledDates') + if (myDateRangePickerDisabledDates) { const optionsDateRangePickerDisabledDates = { locale: 'en-US', calendarDate: new Date(2022, 2, 1), @@ -261,11 +266,14 @@ maxDate: new Date(2022, 5, 0), minDate: new Date(2022, 1, 1) } - // eslint-disable-next-line no-unused-vars - const myDateRangePickerDisabledDates = new coreui.DateRangePicker(document.getElementById('myDateRangePickerDisabledDates'), optionsDateRangePickerDisabledDates) + + new coreui.DateRangePicker(document.getElementById('myDateRangePickerDisabledDates'), optionsDateRangePickerDisabledDates) } + // js-docs-end date-range-picker-disabled-dates - if (document.getElementById('myDateRangePickerCustomRanges')) { + // js-docs-start date-range-picker-custom-ranges + const myDateRangePickerCustomRanges = document.getElementById('myDateRangePickerCustomRanges') + if (myDateRangePickerCustomRanges) { const optionsCustomRanges = { locale: 'en-US', ranges: { @@ -292,7 +300,8 @@ ] } } - // eslint-disable-next-line no-unused-vars - const myDateRangePickerCustomRanges = new coreui.DateRangePicker(document.getElementById('myDateRangePickerCustomRanges'), optionsCustomRanges) + + new coreui.DateRangePicker(myDateRangePickerCustomRanges, optionsCustomRanges) } + // js-docs-end date-range-picker-custom-ranges })() diff --git a/docs/content/forms/date-picker.md b/docs/content/forms/date-picker.md index 61fb3e09b..dd8e9060d 100644 --- a/docs/content/forms/date-picker.md +++ b/docs/content/forms/date-picker.md @@ -98,22 +98,7 @@ Add the `data-coreui-input-read-only="true"` boolean attribute to prevent modifi {{< /example >}} -```js -const options = { - locale: 'en-US', - calendarDate: new Date(2022, 2, 1), - disabledDates: [ - [new Date(2022, 2, 4), new Date(2022, 2, 7)], - new Date(2022, 2, 16), - new Date(2022, 3, 16), - [new Date(2022, 4, 2), new Date(2022, 4, 8)] - ], - maxDate: new Date(2022, 5, 0), - minDate: new Date(2022, 1, 1) -} - -const myDatePickerDisabledDates = new coreui.DatePicker(document.getElementById('myDatePickerDisabledDates'), options) -``` +{{< js-docs name="date-picker-disabled-dates" file="docs/assets/js/snippets.js" >}} ## Non-english locale diff --git a/docs/content/forms/date-range-picker.md b/docs/content/forms/date-range-picker.md index b52f29b41..7251820e2 100644 --- a/docs/content/forms/date-range-picker.md +++ b/docs/content/forms/date-range-picker.md @@ -126,22 +126,7 @@ Add the `data-coreui-input-read-only="true"` boolean attribute to prevent modifi {{< /example >}} -```js -const options = { - locale: 'en-US', - calendarDate: new Date(2022, 2, 1), - disabledDates: [ - [new Date(2022, 2, 4), new Date(2022, 2, 7)], - new Date(2022, 2, 16), - new Date(2022, 3, 16), - [new Date(2022, 4, 2), new Date(2022, 4, 8)] - ], - maxDate: new Date(2022, 5, 0), - minDate: new Date(2022, 1, 1) -} - -const myDateRangePickerDisabledDates = new coreui.DateRangePicker(document.getElementById('myDateRangePickerDisabledDates'), options) -``` +{{< js-docs name="date-range-picker-disabled-dates" file="docs/assets/js/snippets.js" >}} ## Custom ranges @@ -153,36 +138,7 @@ const myDateRangePickerDisabledDates = new coreui.DateRangePicker(document.getEl {{< /example >}} -```js -const optionsCustomRanges = { - locale: 'en-US', - ranges: { - Today: [new Date(), new Date()], - Yesterday: [ - new Date(new Date().setDate(new Date().getDate() - 1)), - new Date(new Date().setDate(new Date().getDate() - 1)) - ], - 'Last 7 Days': [ - new Date(new Date().setDate(new Date().getDate() - 6)), - new Date(new Date()) - ], - 'Last 30 Days': [ - new Date(new Date().setDate(new Date().getDate() - 29)), - new Date(new Date()) - ], - 'This Month': [ - new Date(new Date().setDate(1)), - new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0) - ], - 'Last Month': [ - new Date(new Date().getFullYear(), new Date().getMonth() - 1, 1), - new Date(new Date().getFullYear(), new Date().getMonth(), 0) - ] - } -} - -const myDateRangePickerCustomRanges = new coreui.DateRangePicker(document.getElementById('myDateRangePickerCustomRanges'), optionsCustomRanges) -``` +{{< js-docs name="date-range-picker-custom-ranges" file="docs/assets/js/snippets.js" >}} ## Non-english locale