import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { format } from "date-fns";
import { useState } from "react";
import { YStack } from "tamagui";
import { RenderStage } from "./storybook-utils.native.js";
import { TimePicker } from "./TimePicker.native.js";
import { Body, Title } from "./typography.native.js";
var TimePicker_stories_default = {
    component: TimePicker
  },
  Picker = function () {
    var [date, setDate] = useState(/* @__PURE__ */new Date());
    return /* @__PURE__ */_jsx(RenderStage, {
      height: 240,
      children: /* @__PURE__ */_jsxs(YStack, {
        gap: 20,
        justifyContent: "center",
        alignItems: "center",
        children: [/* @__PURE__ */_jsx(TimePicker, {
          value: date,
          onChange: setDate
        }), /* @__PURE__ */_jsx(Title, {
          children: "Date state:"
        }), /* @__PURE__ */_jsx(Body, {
          size: "large",
          children: format(date, "hh:mm aaaaa'm'")
        })]
      })
    });
  };
export { Picker, TimePicker_stories_default as default };
//# sourceMappingURL=TimePicker.stories.native.js.map
