{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"time-field-web","type":"registry:item","title":"Time Field","description":"A segmented input for entering and editing time values with keyboard-friendly hour, minute and optional second or period fields.","files":[{"path":"snippets/web/time-field.tsx","content":"import { Description, Label, TimeField } from \"@heroui/react\";\n\nexport function TimeFieldExample() {\n  return (\n    <div className=\"flex flex-col gap-4\">\n      <TimeField className=\"w-[256px]\" name=\"time\">\n        <Label>Start time</Label>\n        <TimeField.Group>\n          <TimeField.Input>{(segment) => <TimeField.Segment segment={segment} />}</TimeField.Input>\n        </TimeField.Group>\n        <Description>Enter the start time</Description>\n      </TimeField>\n      <TimeField className=\"w-[256px]\" name=\"end-time\">\n        <Label>End time</Label>\n        <TimeField.Group>\n          <TimeField.Input>{(segment) => <TimeField.Segment segment={segment} />}</TimeField.Input>\n        </TimeField.Group>\n        <Description>Enter the end time</Description>\n      </TimeField>\n    </div>\n  );\n}\n","type":"registry:file","target":"~/snippets/web/time-field.tsx"}],"author":"heroui","dependencies":["@heroui/react"]}