+64
-2
lines changedFilter options
+64
-2
lines changed Original file line number Diff line number Diff line change
@@ -4,6 +4,7 @@ import { getComponentConfig } from '../../utils/config'
4 4
import { createDate, formatYMD, parseYMD } from '../../utils/date'
5 5
import dropdownMixin from '../../mixins/dropdown'
6 6
import idMixin from '../../mixins/id'
7 +
import normalizeSlotMixin from '../../mixins/normalize-slot'
7 8
import { BButton } from '../button/button'
8 9
import { BCalendar } from '../calendar/calendar'
9 10
import { BIconCalendar, BIconCalendarFill } from '../../icons/icons'
@@ -215,7 +216,7 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
215 216
BHover: VBHover
216 217
},
217 218
// The mixins order determines the order of appearance in the props reference section
218 -
mixins: [idMixin, propsMixin, dropdownMixin],
219 +
mixins: [idMixin, normalizeSlotMixin, propsMixin, dropdownMixin],
219 220
model: {
220 221
prop: 'value',
221 222
event: 'input'
@@ -383,8 +384,13 @@ export const BFormDatepicker = /*#__PURE__*/ Vue.extend({
383 384
const idMenu = this.safeId('_dialog_')
384 385
const idWrapper = this.safeId('_b-form-date_')
385 386 387 +
const btnScope = { isHovered, hasFocus, state, opened: visible }
388 +
const defaultButtonFn = scope => {
389 +
const data = { props: { scale: 1.25 }, attrs: { 'aria-hidden': 'true' } }
390 +
return h(scope.isHovered || scope.hasFocus ? BIconCalendarFill : BIconCalendar, data)
391 +
}
386 392
let $button = h('div', { attrs: { 'aria-hidden': 'true' } }, [
387 -
h(isHovered || hasFocus ? BIconCalendarFill : BIconCalendar, { props: { scale: 1.25 } })
393 +
this.normalizeSlot('button-content', btnScope) || defaultButtonFn(btnScope)
388 394
])
389 395
$button = h(
390 396
'button',
@@ -511,4 +511,31 @@ describe('form-date', () => {
511 511 512 512
wrapper.destroy()
513 513
})
514 + 515 +
it('`button-content` static slot works', async () => {
516 +
const wrapper = mount(BFormDatepicker, {
517 +
attachToDocument: true,
518 +
propsData: {
519 +
id: 'test-button-slot',
520 +
value: '2020-01-15'
521 +
},
522 +
slots: {
523 +
'button-content': 'foobar'
524 +
}
525 +
})
526 + 527 +
expect(wrapper.isVueInstance()).toBe(true)
528 +
expect(wrapper.is('div')).toBe(true)
529 +
await waitNT(wrapper.vm)
530 +
await waitRAF()
531 +
await waitNT(wrapper.vm)
532 +
await waitRAF()
533 + 534 +
const $toggle = wrapper.find('button#test-button-slot')
535 + 536 +
expect($toggle.exists()).toBe(true)
537 +
expect($toggle.text()).toEqual('foobar')
538 + 539 +
wrapper.destroy()
540 +
})
514 541
})
Original file line number Diff line number Diff line change
@@ -231,6 +231,35 @@
231 231
}
232 232
]
233 233
}
234 +
],
235 +
"slots": [
236 +
{
237 +
"name": "button-content",
238 +
"version": "2.6.0",
239 +
"description": "Content to place in the datepicker's icon button",
240 +
"scope": [
241 +
{
242 +
"prop": "isHovered",
243 +
"type": "Boolean",
244 +
"description": "`true` if the component is hovered"
245 +
},
246 +
{
247 +
"prop": "hasFocus",
248 +
"type": "Boolean",
249 +
"description": "`true` if the datepicker icon button has focus"
250 +
},
251 +
{
252 +
"prop": "state",
253 +
"type": "Boolean",
254 +
"description": "The value of the `state` prop. `true` (valid), `false` (invalid), or `null`"
255 +
},
256 +
{
257 +
"prop": "open",
258 +
"type": "Boolean",
259 +
"description": "The visibility state of the popup. `true` if the popup is visible and `false` if not"
260 +
}
261 +
]
262 +
}
234 263
]
235 264
}
236 265
]
You can’t perform that action at this time.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4