observable-framework-input-date

Create a date and datetime picker input component for Observable Framework applications.

Updated Feb 28, 2026

Search Tags:#frontend #framework #ui component #observable #input #date picker

Ready to run

npx skills add https://github.com/spqw/skill-observable-framework --skill observable-framework-input-date

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: observable-framework-input-date
Source: https://github.com/spqw/skill-observable-framework/tree/main/skills/observable-framework-input-date
Command: npx skills add https://github.com/spqw/skill-observable-framework --skill observable-framework-input-date

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the process of capturing date inputs within Observable Framework applications, providing a user-friendly interface for date selection.

Core Features & Use Cases

Date Selection: Allows users to pick a specific date using a calendar interface.
Datetime Selection: Enables selection of both date and time.
Configurable Options: Supports setting initial values, minimum/maximum date ranges, and required fields.
Use Case: Integrate this Skill into a dashboard to allow users to filter data by a specific date range or to input event dates.

Quick Start

Use the observable-framework-input-date skill to create a date picker with the label "Event Date".

Frequently Asked Questions about observable-framework-input-date

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I add a date picker to an Observable Framework dashboard?▼

To add a date picker in Observable Framework, use this component to integrate an interactive UI element that facilitates user selection of specific dates or date-time combinations with configurable labels and initial values.

Can I set minimum and maximum date ranges for user selection?▼

Yes, you can set minimum and maximum date ranges for the date picker. The component supports configurable options allowing you to restrict user selection to a specific valid date interval.

Does the Observable Framework date input support both date and time selection?▼

Yes, the Observable Framework date input supports both date and time selection. It enables users to pick specific date-time combinations rather than just calendar dates alone.

What is the best way to filter dashboard data by a specific date range?▼

The best way to filter dashboard data by a specific date range is to integrate this date picker component, allowing users to interactively select start and end dates for data visualization filtering.

Do I need to install external dependencies to use the date picker in Observable Framework?▼

No, you do not need to install external dependencies to use this date picker. It leverages the built-in Observable Inputs library for interactive UI elements without requiring additional packages.