import React, { useState } from "react";
import type { ComponentProps } from "react";
import { InputPressable } from "@jobber/components-native";

type InputPressableProps = ComponentProps<typeof InputPressable>;

export function InputPressableClearable(props: Partial<InputPressableProps>) {
  const [value, setValue] = useState("Cucumber");

  function handleClear() {
    setValue("");
  }

  return (
    <InputPressable
      placeholder="Favourite fruit"
      clearable="always"
      {...props}
      value={value}
      onClear={handleClear}
    />
  );
}