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

feat(dropdown): add date range section #427

Merged
merged 7 commits into from
Dec 27, 2023
Merged

feat(dropdown): add date range section #427

merged 7 commits into from
Dec 27, 2023

Conversation

kiaking
Copy link
Member

@kiaking kiaking commented Dec 25, 2023

Add dropdown section to handle "Date Range" selection.

I've added new class DateRange which holds from and to dates, with presets. The usage would look like this.

<script setup lang="ts">
// Create a new `DateRange` instance.
const range = shallowRef(new DateRange())

const sections = [
  createDropdownDateRange({
    range,

    // This callback will only be called when user hits
    // `Apply` button in dropdown menu.
    onApply: (r) => { range.value = r }
  })
]

// Access `from` and `to` value.
range.value.getFrom() // Day instance
range.value.getTo()   // Day instance
</script>

<template>
<SDropdown :sections="sections" />
</template>

You can define custom preset as a default value by creating the preset at the beginning.

const range = shallowRef(
  new DateRange.setPreset(
    new YearHalf().setYear(2018).setHalf(2)
  )
)

Screenshot 2023-12-25 at 16 57 34 Screenshot 2023-12-25 at 16 57 50

@kiaking kiaking added the enhancement New feature or request label Dec 25, 2023
@kiaking kiaking requested a review from brc-dd December 25, 2023 08:04
@kiaking kiaking self-assigned this Dec 25, 2023
Copy link

netlify bot commented Dec 25, 2023

Deploy Preview for sefirot-story ready!

Name Link
🔨 Latest commit d405da4
🔍 Latest deploy log https://app.netlify.com/sites/sefirot-story/deploys/658b97cc54aa010008949daa
😎 Deploy Preview https://deploy-preview-427--sefirot-story.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Dec 25, 2023

Deploy Preview for sefirot-docs ready!

Name Link
🔨 Latest commit d405da4
🔍 Latest deploy log https://app.netlify.com/sites/sefirot-docs/deploys/658b97cc20ff8200086a407a
😎 Deploy Preview https://deploy-preview-427--sefirot-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@brc-dd brc-dd merged commit e1ef252 into main Dec 27, 2023
9 checks passed
@brc-dd brc-dd deleted the date-range branch December 27, 2023 03:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants