Date Input experimental

Ark UI Date Input 기반 wrapper입니다. 세그먼트(연·월·일) 단위로 키보드 입력과 ARIA spinbutton 동작을 제공하는 인풋형 날짜 입력 컴포넌트로, 캘린더 팝업 없이 직접 타이핑합니다.

@ark-ui/svelte/date-input Ark UI docs ↗

예약 날짜

mmddyyyy

<script lang="ts">
  import * as DateInput from '@odbd/svelte/date-input'
</script>

<DateInput.Root style="max-width: 16rem;">
  <DateInput.Label>예약 날짜</DateInput.Label>
  <DateInput.Control>
    <DateInput.SegmentGroup>
      <DateInput.Context>
        {#snippet render(api)}
          {#each api().getSegments() as segment, i (i)}
            <DateInput.Segment {segment} />
          {/each}
        {/snippet}
      </DateInput.Context>
    </DateInput.SegmentGroup>
  </DateInput.Control>
  <DateInput.HiddenInput />
</DateInput.Root>

Import

Svelte와 React가 같은 anatomy 계약을 공유합니다. 선택한 프레임워크는 모든 페이지에서 유지됩니다. 패키지 설치는 Getting Started를 참고하세요.

import * as DateInput from '@odbd/svelte/date-input'

import { DateInput } from '@odbd/react/date-input'