import { BeDatePicker } from '@brewer/beerui'
    let value = ''
    let value0 = ''
    let value1 = ''
    const disabledDate = (time) => {
      return time.getTime() > Date.now()
    }
		
    <div class="flex column align-center">
      <span class="demonstration">默认</span>
      <BeDatePicker bind:value={value} placeholder='选择日期' selectMode="date" />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">无清除按钮</span>
      <BeDatePicker bind:value={value0} placeholder='选择日期' clearable={false} selectMode="date" />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">禁用日期</span>
      <BeDatePicker bind:value={value1} placeholder='选择日期' {disabledDate} clearable={false} selectMode="date" />
    </div>
    
	

		
    import { BeDatePicker } from '@brewer/beerui'
    let value2 = ''
    let value3 = ''
    let value4 = ''
		
    <div class="flex column align-center">
      <span class="demonstration">日期时间</span>
      <BeDatePicker bind:value={value2} placeholder='选择日期时间' selectMode="datetime" />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">月</span>
      <BeDatePicker bind:value={value3} placeholder='选择月' selectMode="month" />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">月</span>
      <BeDatePicker bind:value={value4} placeholder='选择年' selectMode="year" />
    </div>
    
	

		
    import { BeDatePicker } from '@brewer/beerui'
    let value5 = ''
    let value10 = ''
    let value11 = ''
    let value6 = ''
		
    <div class="flex column align-center">
      <span class="demonstration">默认</span>
      <BeDatePicker bind:value={value5} selectMode="daterange"  />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">时间日期范围</span>
      <BeDatePicker bind:value={value10} selectMode="datetimerange"  />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">月份范围</span>
      <BeDatePicker bind:value={value6} selectMode="monthrange"  />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">年份范围</span>
      <BeDatePicker bind:value={value11} selectMode="yearrange" />
    </div>
    
	

		
    import { BeTimePicker } from '@brewer/beerui'
    let value7 = ''
    let value8 = ''
    let value9 = ''
    const selectableRange = '18:30:00 - 20:30:00'
		
     <div class="flex column align-center">
      <span class="demonstration">默认</span>
      <BeTimePicker bind:value={value7}/>
    </div>
    <div class="flex column align-center">
      <span class="demonstration">显示时分</span>
      <BeTimePicker bind:value={value8}  format="HH:mm" />
    </div>
    <div class="flex column align-center">
      <span class="demonstration">禁用选项</span>
      <BeTimePicker bind:value={value9} {selectableRange} />
    </div>