import React from "react";
import { Select } from "@jobber/components-native";

/** Individual options can be disabled. */
export function SelectComposableDisabledOptions() {
  return (
    <Select.Root>
      <Select.Label>Province</Select.Label>
      <Select.Trigger>
        <Select.Value placeholder="Select a province" />
      </Select.Trigger>
      <Select.Content>
        <Select.Item value="on" label="Ontario" />
        <Select.Item value="qc" label="Quebec" disabled />
        <Select.Item value="bc" label="British Columbia" />
        <Select.Item value="ab" label="Alberta" disabled />
      </Select.Content>
    </Select.Root>
  );
}