Socket
Socket
Sign inDemoInstall

@headlessui/react

Package Overview
Dependencies
Maintainers
2
Versions
713
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@headlessui/react - npm Package Compare versions

Comparing version 0.2.0 to 0.3.0

dist/utils/bugs.d.ts
dist/utils/calculate-active-index.d.ts
dist/utils/resolve-prop-value.d.ts

236

dist/components/listbox/listbox.d.ts

@@ -1,47 +0,231 @@

import * as React from 'react';
import React, { ElementType } from 'react';
import { Props } from '../../types';
declare const DEFAULT_LISTBOX_TAG: React.ExoticComponent<{
declare let DEFAULT_LISTBOX_TAG: React.ExoticComponent<{
children?: React.ReactNode;
}>;
declare type ListboxRenderPropArg = {
interface ListboxRenderPropArg {
open: boolean;
};
export declare function Listbox<TTag extends React.ElementType = typeof DEFAULT_LISTBOX_TAG, TType = string>(props: Props<TTag, ListboxRenderPropArg> & {
disabled: boolean;
}
export declare function Listbox<TTag extends ElementType = typeof DEFAULT_LISTBOX_TAG, TType = string>(props: Props<TTag, ListboxRenderPropArg, 'value' | 'onChange'> & {
value: TType;
onChange(value: TType): void;
disabled?: boolean;
}): JSX.Element;
export declare namespace Listbox {
var Button: <TTag extends React.ElementType<any> = "button">(props: Props<TTag, ButtonRenderPropArg, ButtonPropsWeControl>, ref: React.Ref<HTMLButtonElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
var Label: <TTag extends React.ElementType<any> = "label">(props: Props<TTag, LabelRenderPropArg, LabelPropsWeControl>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
var Options: <TTag extends React.ElementType<any> = "ul">(props: ListboxOptionsProp<TTag>, ref: React.Ref<HTMLUListElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
var Option: <TTag extends React.ElementType<any> = "li", TType = string>(props: {
var Button: <TTag extends React.ElementType<any> = "button">(props: Props<TTag, ButtonRenderPropArg, ButtonPropsWeControl>, ref: React.Ref<HTMLButtonElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
var Label: <TTag extends React.ElementType<any> = "label">(props: Props<TTag, LabelRenderPropArg, LabelPropsWeControl>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
var Options: <TTag extends React.ElementType<any> = "ul">(props: ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-labelledby">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-labelledby">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onKeyDown">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onKeyDown">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-activedescendant">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-activedescendant">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "role">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "role">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "tabIndex">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "tabIndex">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}), ref: React.Ref<HTMLUListElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
var Option: <TTag extends React.ElementType<any> = "li", TType = unknown>(props: ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id" | "onFocus" | "role" | "tabIndex" | "aria-disabled" | "aria-selected" | "onPointerLeave" | "className">> & {
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "value">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "role">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "tabIndex">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-disabled">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-selected">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onPointerLeave">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onMouseLeave">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onPointerMove">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onMouseMove">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onFocus">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: OptionRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "className">> & {
disabled?: boolean | undefined;
value: TType;
className?: string | ((bag: OptionRenderPropArg) => string) | undefined;
})) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
}
declare type ButtonPropsWeControl = 'ref' | 'id' | 'type' | 'aria-haspopup' | 'aria-controls' | 'aria-expanded' | 'aria-labelledby' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'onPointerUp';
declare type ButtonRenderPropArg = {
interface ButtonRenderPropArg {
open: boolean;
focused: boolean;
};
declare type LabelPropsWeControl = 'id' | 'ref' | 'onPointerUp';
declare type LabelRenderPropArg = {
disabled: boolean;
}
declare type ButtonPropsWeControl = 'id' | 'type' | 'aria-haspopup' | 'aria-controls' | 'aria-expanded' | 'aria-labelledby' | 'disabled' | 'onKeyDown' | 'onClick';
interface LabelRenderPropArg {
open: boolean;
};
declare type OptionsPropsWeControl = 'aria-activedescendant' | 'aria-labelledby' | 'id' | 'onKeyDown' | 'ref' | 'role' | 'tabIndex';
declare type OptionsRenderPropArg = {
disabled: boolean;
}
declare type LabelPropsWeControl = 'id' | 'ref' | 'onClick';
interface OptionsRenderPropArg {
open: boolean;
};
declare type ListboxOptionsProp<TTag> = Props<TTag, OptionsRenderPropArg, OptionsPropsWeControl> & {
static?: boolean;
};
declare type OptionRenderPropArg = {
}
interface OptionRenderPropArg {
active: boolean;
selected: boolean;
disabled: boolean;
};
}
export {};

222

dist/components/menu/menu.d.ts

@@ -1,24 +0,116 @@

import * as React from 'react';
import React, { ElementType } from 'react';
import { Props } from '../../types';
declare const DEFAULT_MENU_TAG: React.ExoticComponent<{
declare let DEFAULT_MENU_TAG: React.ExoticComponent<{
children?: React.ReactNode;
}>;
declare type MenuRenderPropArg = {
interface MenuRenderPropArg {
open: boolean;
};
export declare function Menu<TTag extends React.ElementType = typeof DEFAULT_MENU_TAG>(props: Props<TTag, MenuRenderPropArg>): JSX.Element;
}
export declare function Menu<TTag extends ElementType = typeof DEFAULT_MENU_TAG>(props: Props<TTag, MenuRenderPropArg>): JSX.Element;
export declare namespace Menu {
var Button: <TTag extends React.ElementType<any> = "button">(props: Props<TTag, ButtonRenderPropArg, ButtonPropsWeControl>, ref: React.Ref<HTMLButtonElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
var Items: <TTag extends React.ElementType<any> = "div">(props: {
var Button: <TTag extends React.ElementType<any> = "button">(props: Props<TTag, ButtonRenderPropArg, ButtonPropsWeControl>, ref: React.Ref<HTMLButtonElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
var Items: <TTag extends React.ElementType<any> = "div">(props: ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, ItemsPropsWeControl>> & {
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}, ref: React.Ref<HTMLDivElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onKeyDown">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onKeyDown">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-activedescendant">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-activedescendant">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-labelledby">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-labelledby">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "role">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "role">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "tabIndex">> & {
static?: undefined;
} & {
unmount?: boolean | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemsRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "tabIndex">> & {
unmount?: undefined;
} & {
static?: boolean | undefined;
}), ref: React.Ref<HTMLDivElement>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
var Item: <TTag extends React.ElementType<any> = React.ExoticComponent<{
children?: React.ReactNode;
}>>(props: {
}>>(props: ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id" | "onFocus" | "role" | "tabIndex" | "aria-disabled" | "onPointerLeave" | "className">> & {
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "id">> & {
disabled?: boolean | undefined;

@@ -29,17 +121,105 @@ onClick?: ((event: {

className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "role">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "tabIndex">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "aria-disabled">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onPointerLeave">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onPointerMove">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onMouseLeave">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onMouseMove">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "onFocus">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
}) | ({
as?: TTag | undefined;
children?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | ((bag: ItemRenderPropArg) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>) | null | undefined;
refName?: string | undefined;
} & Pick<import("../../types").PropsOf<TTag>, Exclude<keyof import("../../types").PropsOf<TTag>, "className">> & {
disabled?: boolean | undefined;
onClick?: ((event: {
preventDefault: Function;
}) => void) | undefined;
className?: string | ((bag: ItemRenderPropArg) => string) | undefined;
})) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
}
declare type ButtonPropsWeControl = 'ref' | 'id' | 'type' | 'aria-haspopup' | 'aria-controls' | 'aria-expanded' | 'onKeyDown' | 'onFocus' | 'onBlur' | 'onPointerUp';
declare type ButtonRenderPropArg = {
interface ButtonRenderPropArg {
open: boolean;
focused: boolean;
};
declare type ItemsPropsWeControl = 'aria-activedescendant' | 'aria-labelledby' | 'id' | 'onKeyDown' | 'ref' | 'role' | 'tabIndex';
declare type ItemsRenderPropArg = {
}
declare type ButtonPropsWeControl = 'id' | 'type' | 'aria-haspopup' | 'aria-controls' | 'aria-expanded' | 'onKeyDown' | 'onClick';
interface ItemsRenderPropArg {
open: boolean;
};
declare type ItemRenderPropArg = {
}
interface ItemRenderPropArg {
active: boolean;
disabled: boolean;
};
}
export {};

23

dist/components/switch/switch.d.ts

@@ -1,21 +0,22 @@

import * as React from 'react';
import React, { ElementType } from 'react';
import { Props } from '../../types';
declare const DEFAULT_SWITCH_TAG = "button";
declare type SwitchRenderPropArg = {
declare let DEFAULT_SWITCH_TAG: "button";
interface SwitchRenderPropArg {
checked: boolean;
};
declare type SwitchPropsWeControl = 'id' | 'role' | 'tabIndex' | 'aria-checked' | 'onClick' | 'onKeyUp';
export declare function Switch<TTag extends React.ElementType = typeof DEFAULT_SWITCH_TAG>(props: Props<TTag, SwitchRenderPropArg, SwitchPropsWeControl | 'checked' | 'onChange' | 'className'> & {
}
declare type SwitchPropsWeControl = 'id' | 'role' | 'tabIndex' | 'aria-checked' | 'onClick' | 'onKeyUp' | 'onKeyPress';
export declare function Switch<TTag extends ElementType = typeof DEFAULT_SWITCH_TAG>(props: Props<TTag, SwitchRenderPropArg, SwitchPropsWeControl | 'checked' | 'onChange' | 'className'> & {
checked: boolean;
onChange(checked: boolean): void;
className?: ((bag: SwitchRenderPropArg) => string) | string;
}): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
}): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
export declare namespace Switch {
var Group: <TTag extends React.ElementType<any> = React.ExoticComponent<{
children?: React.ReactNode;
}>>(props: Props<TTag, {}, "">) => JSX.Element;
var Label: <TTag extends React.ElementType<any> = "label">(props: Props<TTag, LabelRenderPropArg, LabelPropsWeControl>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
}>>(props: Props<TTag, {}, unique symbol>) => JSX.Element;
var Label: <TTag extends React.ElementType<any> = "label">(props: Props<TTag, LabelRenderPropArg, LabelPropsWeControl>) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | null;
}
declare type LabelPropsWeControl = 'id' | 'ref' | 'onPointerUp';
declare type LabelRenderPropArg = {};
interface LabelRenderPropArg {
}
declare type LabelPropsWeControl = 'id' | 'ref' | 'onClick';
export {};

47

dist/components/transitions/transition.d.ts

@@ -1,25 +0,26 @@

import * as React from 'react';
export declare type TransitionClasses = Partial<{
enter: string;
enterFrom: string;
enterTo: string;
leave: string;
leaveFrom: string;
leaveTo: string;
}>;
declare type HTMLTags = keyof JSX.IntrinsicElements;
declare type HTMLTagProps<TTag extends HTMLTags> = JSX.IntrinsicElements[TTag];
declare type AsShortcut<TTag extends HTMLTags> = {
children?: React.ReactNode;
as?: TTag;
} & Omit<HTMLTagProps<TTag>, 'ref'>;
declare type AsRenderPropFunction = {
children: (ref: React.MutableRefObject<any>) => JSX.Element;
import { ElementType, MutableRefObject } from 'react';
import { Props } from 'types';
import { Features, PropsForFeatures } from '../../utils/render';
export interface TransitionClasses {
enter?: string;
enterFrom?: string;
enterTo?: string;
leave?: string;
leaveFrom?: string;
leaveTo?: string;
}
export interface TransitionEvents {
beforeEnter?: () => void;
afterEnter?: () => void;
beforeLeave?: () => void;
afterLeave?: () => void;
}
declare type TransitionChildProps<TTag> = Props<TTag, TransitionChildRenderPropArg> & PropsForFeatures<typeof TransitionChildRenderFeatures> & TransitionClasses & TransitionEvents & {
appear?: boolean;
};
declare type BaseConfig = Partial<{
appear: boolean;
}>;
declare type TransitionChildProps<TTag extends HTMLTags> = BaseConfig & (AsShortcut<TTag> | AsRenderPropFunction) & TransitionClasses;
declare function TransitionChild<TTag extends HTMLTags = 'div'>(props: TransitionChildProps<TTag>): JSX.Element | null;
export declare function Transition<TTag extends HTMLTags = 'div'>(props: TransitionChildProps<TTag> & {
declare let DEFAULT_TRANSITION_CHILD_TAG: "div";
declare type TransitionChildRenderPropArg = MutableRefObject<HTMLDivElement>;
declare let TransitionChildRenderFeatures: Features;
declare function TransitionChild<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>(props: TransitionChildProps<TTag>): JSX.Element;
export declare function Transition<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>(props: TransitionChildProps<TTag> & {
show: boolean;

@@ -26,0 +27,0 @@ appear?: boolean;

2

dist/headlessui.cjs.production.min.js

@@ -1,2 +0,2 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");function n(){return(n=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function t(e,n){if(null==e)return{};var t,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n.indexOf(t=i[r])>=0||(o[t]=e[t]);return o}function r(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}var o,i="undefined"!=typeof window?e.useLayoutEffect:e.useEffect,u={serverHandoffComplete:!1},a=0;function c(){return++a}function l(){var n=e.useState(u.serverHandoffComplete?c:null),t=n[0],r=n[1];return i((function(){null===t&&r(c())}),[]),e.useEffect((function(){!1===u.serverHandoffComplete&&(u.serverHandoffComplete=!0)}),[]),null!=t?""+t:void 0}function s(){var n=e.useRef(!0);return e.useEffect((function(){n.current=!1}),[]),n.current}function f(e,n){if(e in n){for(var t=n[e],r=arguments.length,o=new Array(r>2?r-2:0),i=2;i<r;i++)o[i-2]=arguments[i];return"function"==typeof t?t.apply(void 0,o):t}var u=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(n).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(u,f),u}function d(){var e=[],n={requestAnimationFrame:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=requestAnimationFrame.apply(void 0,arguments);n.add((function(){return cancelAnimationFrame(e)}))})),nextFrame:function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];n.requestAnimationFrame((function(){n.requestAnimationFrame.apply(n,t)}))},setTimeout:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=setTimeout.apply(void 0,arguments);n.add((function(){return clearTimeout(e)}))})),add:function(n){e.push(n)},dispose:function(){e.splice(0).forEach((function(e){return e()}))}};return n}function v(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).add.apply(n,r)}function p(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).remove.apply(n,r)}function m(e,n,t,r,i){var u=d(),a=void 0!==i?function(e){var n={called:!1};return function(){if(!n.called)return n.called=!0,e.apply(void 0,arguments)}}(i):function(){};return v.apply(void 0,[e].concat(n,t)),u.nextFrame((function(){p.apply(void 0,[e].concat(t)),v.apply(void 0,[e].concat(r)),u.add(function(e,n){var t=d();if(!e)return t.dispose;var r=getComputedStyle(e),i=[r.transitionDuration,r.transitionDelay].map((function(e){var n=e.split(",").filter(Boolean).map((function(e){return e.includes("ms")?parseFloat(e):1e3*parseFloat(e)})).sort((function(e,n){return n-e}))[0];return void 0===n?0:n})),u=i[0];return 0!==u?t.setTimeout((function(){n(o.Finished)}),u+i[1]):n(o.Finished),t.add((function(){return n(o.Cancelled)})),t.dispose}(e,(function(t){return p.apply(void 0,[e].concat(r,n)),a(t)})))})),u.add((function(){return p.apply(void 0,[e].concat(n,t,r))})),u.add((function(){return a(o.Cancelled)})),u.dispose}function b(n){return void 0===n&&(n=""),e.useMemo((function(){return n.split(" ").filter((function(e){return e.trim().length>1}))}),[n])}!function(e){e.Finished="finished",e.Cancelled="cancelled"}(o||(o={}));var h,y=e.createContext(null);!function(e){e.Visible="visible",e.Hidden="hidden"}(h||(h={}));var x,I,g,C,R,O=e.createContext(null);function S(n){var t=e.useRef(n),r=e.useRef([]),o=function(){var n=e.useRef(!0);return e.useEffect((function(){return function(){n.current=!1}}),[]),n}();e.useEffect((function(){t.current=n}),[n]);var i=e.useCallback((function(e){var n,i=r.current.indexOf(e);-1!==i&&(r.current.splice(i,1),r.current.length<=0&&o.current&&(null===(n=t.current)||void 0===n||n.call(t)))}),[t,o,r]),u=e.useCallback((function(e){return r.current.push(e),function(){return i(e)}}),[r,i]);return e.useMemo((function(){return{children:r,register:u,unregister:i}}),[u,i,r])}function w(n){var r=n.children,u=n.enter,a=n.enterFrom,c=n.enterTo,f=n.leave,d=n.leaveFrom,v=n.leaveTo,p=t(n,["children","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo"]),x=e.useRef(null),I=e.useState(h.Visible),g=I[0],C=I[1],R=function(){var n=e.useContext(y);if(null===n)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return n}(),w=R.show,k=R.appear,E=function(){var n=e.useContext(O);if(null===n)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return n}(),T=E.register,F=E.unregister,D=s(),L=l(),P=e.useRef(!1),M=S((function(){P.current||(C(h.Hidden),F(L))}));i((function(){if(L)return T(L)}),[T,L]);var A=b(u),G=b(a),N=b(c),j=b(f),U=b(d),H=b(v);e.useEffect((function(){if(g===h.Visible&&null===x.current)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")}),[x,g]);var Q=D&&!k;if(i((function(){var e=x.current;if(e&&!Q)return P.current=!0,w?m(e,A,G,N,(function(){P.current=!1})):m(e,j,U,H,(function(e){P.current=!1,e===o.Finished&&M.children.current.length<=0&&(C(h.Hidden),F(L))}))}),[L,P,F,M,x,Q,w,A,G,N,j,U,H]),g===h.Hidden)return null;if("function"==typeof r)return e.createElement(O.Provider,{value:M},r(x));var B=p.as,V=void 0===B?"div":B,q=t(p,["as"]);return e.createElement(O.Provider,{value:M},e.createElement(V,Object.assign({},q,{ref:x}),r))}function k(n){var r,o=n.show,i=n.appear,u=void 0!==i&&i,a=t(n,["show","appear"]);if(![!0,!1].includes(o))throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");var c=e.useState(o?h.Visible:h.Hidden),l=c[0],d=c[1],v=S((function(){d(h.Hidden)})),p=s(),m=e.useMemo((function(){return{show:o,appear:u||!p}}),[o,u,p]);return e.useEffect((function(){o?d(h.Visible):v.children.current.length<=0&&d(h.Hidden)}),[o,v]),e.createElement(O.Provider,{value:v},e.createElement(y.Provider,{value:m},f(l,((r={})[h.Visible]=function(){return e.createElement(w,Object.assign({},a))},r[h.Hidden]=null,r))))}function E(n,o,i){var u=n.as,a=void 0===u?i:u,c=n.children,l=t(n,["as","children"]),s="function"==typeof c?c(o):c;if(a===e.Fragment&&Object.keys(l).length>0){if(Array.isArray(s)&&s.length>1){var f=new Error("You should only render 1 child");throw Error.captureStackTrace&&Error.captureStackTrace(f,E),f}if(!e.isValidElement(s)){var d=new Error('You should render an element as a child. Did you forget the as="..." prop?');throw Error.captureStackTrace&&Error.captureStackTrace(d,E),d}return e.cloneElement(s,function(e,n,t){for(var o,i=Object.assign({},e),u=function(){var t,r=o.value;void 0!==e[r]&&void 0!==n[r]&&Object.assign(i,((t={})[r]=function(t){t.defaultPrevented||e[r](t),t.defaultPrevented||n[r](t)},t))},a=function(e,n){var t;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(t=function(e,n){if(e){if("string"==typeof e)return r(e,void 0);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?r(e,void 0):void 0}}(e))){t&&(e=t);var o=0;return function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(t=e[Symbol.iterator]()).next.bind(t)}(["onClick"]);!(o=a()).done;)u();return i}(function(e){var n=Object.assign({},e);for(var t in n)void 0===n[t]&&delete n[t];return n}(l),s.props))}return e.createElement(a,l,s)}function T(n){return e.forwardRef(n)}function F(){var n=e.useState(d)[0];return e.useEffect((function(){return function(){return n.dispose()}}),[n]),n}function D(){for(var n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];return e.useCallback((function(e){t.forEach((function(n){if(null!==n)return"function"==typeof n?n(e):void(n.current=e)}))}),[t])}k.Child=w,function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(x||(x={})),function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(g||(g={})),function(e){e[e.OpenMenu=0]="OpenMenu",e[e.CloseMenu=1]="CloseMenu",e[e.GoToItem=2]="GoToItem",e[e.Search=3]="Search",e[e.ClearSearch=4]="ClearSearch",e[e.RegisterItem=5]="RegisterItem",e[e.UnregisterItem=6]="UnregisterItem"}(C||(C={})),function(e){e[e.FirstItem=0]="FirstItem",e[e.PreviousItem=1]="PreviousItem",e[e.NextItem=2]="NextItem",e[e.LastItem=3]="LastItem",e[e.SpecificItem=4]="SpecificItem",e[e.Nothing=5]="Nothing"}(R||(R={}));var L=((I={})[C.CloseMenu]=function(e){return n({},e,{menuState:g.Closed})},I[C.OpenMenu]=function(e){return n({},e,{menuState:g.Open})},I[C.GoToItem]=function(e,t){var r=function(e,n,t){var r,o;if(e.items.length<=0)return null;var i=e.items,u=null!==(r=e.activeItemIndex)&&void 0!==r?r:-1,a=f(n,((o={})[R.FirstItem]=function(){return i.findIndex((function(e){return!e.dataRef.current.disabled}))},o[R.PreviousItem]=function(){var e=i.slice().reverse().findIndex((function(e,n,t){return!(-1!==u&&t.length-n-1>=u||e.dataRef.current.disabled)}));return-1===e?e:i.length-1-e},o[R.NextItem]=function(){return i.findIndex((function(e,n){return!(n<=u||e.dataRef.current.disabled)}))},o[R.LastItem]=function(){var e=i.slice().reverse().findIndex((function(e){return!e.dataRef.current.disabled}));return-1===e?e:i.length-1-e},o[R.SpecificItem]=function(){return i.findIndex((function(e){return e.id===t}))},o[R.Nothing]=function(){return null},o));return-1===a?e.activeItemIndex:a}(e,t.focus,t.id);return""===e.searchQuery&&e.activeItemIndex===r?e:n({},e,{searchQuery:"",activeItemIndex:r})},I[C.Search]=function(e,t){var r=e.searchQuery+t.value,o=e.items.findIndex((function(e){var n;return(null===(n=e.dataRef.current.textValue)||void 0===n?void 0:n.startsWith(r))&&!e.dataRef.current.disabled}));return n({},e,-1===o||o===e.activeItemIndex?{searchQuery:r}:{searchQuery:r,activeItemIndex:o})},I[C.ClearSearch]=function(e){return n({},e,{searchQuery:""})},I[C.RegisterItem]=function(e,t){return n({},e,{items:[].concat(e.items,[{id:t.id,dataRef:t.dataRef}])})},I[C.UnregisterItem]=function(e,t){var r=e.items.slice(),o=null!==e.activeItemIndex?r[e.activeItemIndex]:null,i=r.findIndex((function(e){return e.id===t.id}));return-1!==i&&r.splice(i,1),n({},e,{items:r,activeItemIndex:i===e.activeItemIndex||null===o?null:r.indexOf(o)})},I),P=e.createContext(null);function M(n){var t=e.useContext(P);if(null===t){var r=new Error("<"+n+" /> is missing a parent <"+N.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,M),r}return t}function A(e,n){return f(n.type,L,e,n)}var G=e.Fragment;function N(n){var t=F(),r=e.useReducer(A,{menuState:g.Closed,buttonRef:e.createRef(),itemsRef:e.createRef(),items:[],searchQuery:"",activeItemIndex:null}),o=r[0],i=o.menuState,u=o.itemsRef,a=o.buttonRef,c=r[1];e.useEffect((function(){function e(e){var n,r;i===g.Open&&((null===(n=a.current)||void 0===n?void 0:n.contains(e.target))||((null===(r=u.current)||void 0===r?void 0:r.contains(e.target))||c({type:C.CloseMenu}),e.defaultPrevented||t.nextFrame((function(){var e;return null===(e=a.current)||void 0===e?void 0:e.focus()}))))}return window.addEventListener("click",e),function(){return window.removeEventListener("click",e)}}),[i,u,a,t,c]);var l=e.useMemo((function(){return{open:i===g.Open}}),[i]);return e.createElement(P.Provider,{value:r},E(n,l,G))}var j,U,H,Q,B=T((function t(r,o){var i,u=M([N.name,t.name].join(".")),a=u[0],c=u[1],s=D(a.buttonRef,o),f=e.useState(!1),d=f[0],v=f[1],p="headlessui-menu-button-"+l(),m=F(),b=e.useCallback((function(e){switch(e.key){case x.Space:case x.Enter:case x.ArrowDown:e.preventDefault(),c({type:C.OpenMenu}),m.nextFrame((function(){var e;null===(e=a.itemsRef.current)||void 0===e||e.focus(),c({type:C.GoToItem,focus:R.FirstItem})}));break;case x.ArrowUp:e.preventDefault(),c({type:C.OpenMenu}),m.nextFrame((function(){var e;null===(e=a.itemsRef.current)||void 0===e||e.focus(),c({type:C.GoToItem,focus:R.LastItem})}))}}),[c,a,m]),h=e.useCallback((function(e){a.menuState===g.Open?(c({type:C.CloseMenu}),m.nextFrame((function(){var e;return null===(e=a.buttonRef.current)||void 0===e?void 0:e.focus()}))):(e.preventDefault(),c({type:C.OpenMenu}),m.nextFrame((function(){var e;return null===(e=a.itemsRef.current)||void 0===e?void 0:e.focus()})))}),[c,m,a]),y=e.useCallback((function(){var e;a.menuState===g.Open&&(null===(e=a.itemsRef.current)||void 0===e||e.focus()),v(!0)}),[a,v]),I=e.useCallback((function(){return v(!1)}),[v]),O=e.useMemo((function(){return{open:a.menuState===g.Open,focused:d}}),[a,d]);return E(n({},r,{ref:s,id:p,type:"button","aria-haspopup":!0,"aria-controls":null===(i=a.itemsRef.current)||void 0===i?void 0:i.id,"aria-expanded":a.menuState===g.Open||void 0,onKeyDown:b,onFocus:y,onBlur:I,onPointerUp:h}),O,"button")})),V=T((function r(o,i){var u,a,c=o.static,s=void 0!==c&&c,f=t(o,["static"]),v=M([N.name,r.name].join(".")),p=v[0],m=v[1],b=D(p.itemsRef,i),h="headlessui-menu-items-"+l(),y=F(),I=e.useCallback((function(e){switch(y.dispose(),e.key){case x.Space:if(""!==p.searchQuery)return e.preventDefault(),m({type:C.Search,value:e.key});case x.Enter:var n;e.preventDefault(),m({type:C.CloseMenu}),null!==p.activeItemIndex&&(null===(n=document.getElementById(p.items[p.activeItemIndex].id))||void 0===n||n.click()),d().nextFrame((function(){var e;return null===(e=p.buttonRef.current)||void 0===e?void 0:e.focus()}));break;case x.ArrowDown:return e.preventDefault(),m({type:C.GoToItem,focus:R.NextItem});case x.ArrowUp:return e.preventDefault(),m({type:C.GoToItem,focus:R.PreviousItem});case x.Home:case x.PageUp:return e.preventDefault(),m({type:C.GoToItem,focus:R.FirstItem});case x.End:case x.PageDown:return e.preventDefault(),m({type:C.GoToItem,focus:R.LastItem});case x.Escape:e.preventDefault(),m({type:C.CloseMenu}),d().nextFrame((function(){var e;return null===(e=p.buttonRef.current)||void 0===e?void 0:e.focus()}));break;case x.Tab:return e.preventDefault();default:1===e.key.length&&(m({type:C.Search,value:e.key}),y.setTimeout((function(){return m({type:C.ClearSearch})}),350))}}),[m,y,p]),O=e.useMemo((function(){return{open:p.menuState===g.Open}}),[p]),S={"aria-activedescendant":null===p.activeItemIndex||null===(u=p.items[p.activeItemIndex])||void 0===u?void 0:u.id,"aria-labelledby":null===(a=p.buttonRef.current)||void 0===a?void 0:a.id,id:h,onKeyDown:I,role:"menu",tabIndex:0};return s||p.menuState!==g.Closed?E(n({},f,S,{ref:b}),O,"div"):null})),q=e.Fragment;function K(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}function W(n,t){var r=e.useState(n),o=r[0],u=r[1],a=e.useRef(n);return i((function(){a.current=n}),[n]),i((function(){return u(a.current)}),[a,u].concat(t)),o}N.Button=B,N.Items=V,N.Item=function r(o){var u=o.disabled,a=void 0!==u&&u,c=o.className,s=o.onClick,f=t(o,["disabled","className","onClick"]),d=M([N.name,r.name].join(".")),v=d[0],p=d[1],m=F(),b="headlessui-menu-item-"+l(),h=null!==v.activeItemIndex&&v.items[v.activeItemIndex].id===b,y=e.useRef({disabled:a});i((function(){y.current.disabled=a}),[y,a]),i((function(){var e,n;y.current.textValue=null===(e=document.getElementById(b))||void 0===e||null===(n=e.textContent)||void 0===n?void 0:n.toLowerCase()}),[y,b]),i((function(){return p({type:C.RegisterItem,id:b,dataRef:y}),function(){return p({type:C.UnregisterItem,id:b})}}),[y,b]);var x=e.useCallback((function(e){return a?e.preventDefault():(p({type:C.CloseMenu}),m.nextFrame((function(){var e;return null===(e=v.buttonRef.current)||void 0===e?void 0:e.focus()})),s?s(e):void 0)}),[m,p,v.buttonRef,a,s]),I=e.useCallback((function(){if(a)return p({type:C.GoToItem,focus:R.Nothing});p({type:C.GoToItem,focus:R.SpecificItem,id:b})}),[a,b,p]),g=e.useCallback((function(){a||h||p({type:C.GoToItem,focus:R.SpecificItem,id:b})}),[a,h,b,p]),O=e.useCallback((function(){a||h&&p({type:C.GoToItem,focus:R.Nothing})}),[a,h,p]),S=e.useMemo((function(){return{active:h,disabled:a}}),[h,a]);return E(n({},f,{id:b,role:"menuitem",tabIndex:-1,className:K(c,S),"aria-disabled":!0===a||void 0,onClick:x,onFocus:I,onPointerMove:g,onPointerLeave:O}),S,q)},function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(U||(U={})),function(e){e[e.OpenListbox=0]="OpenListbox",e[e.CloseListbox=1]="CloseListbox",e[e.GoToOption=2]="GoToOption",e[e.Search=3]="Search",e[e.ClearSearch=4]="ClearSearch",e[e.RegisterOption=5]="RegisterOption",e[e.UnregisterOption=6]="UnregisterOption"}(H||(H={})),function(e){e[e.First=0]="First",e[e.Previous=1]="Previous",e[e.Next=2]="Next",e[e.Last=3]="Last",e[e.Specific=4]="Specific",e[e.Nothing=5]="Nothing"}(Q||(Q={}));var Y=((j={})[H.CloseListbox]=function(e){return n({},e,{listboxState:U.Closed})},j[H.OpenListbox]=function(e){return n({},e,{listboxState:U.Open})},j[H.GoToOption]=function(e,t){var r=function(e,n,t){var r,o;if(e.options.length<=0)return null;var i=e.options,u=null!==(r=e.activeOptionIndex)&&void 0!==r?r:-1,a=f(n,((o={})[Q.First]=function(){return i.findIndex((function(e){return!e.dataRef.current.disabled}))},o[Q.Previous]=function(){var e=i.slice().reverse().findIndex((function(e,n,t){return!(-1!==u&&t.length-n-1>=u||e.dataRef.current.disabled)}));return-1===e?e:i.length-1-e},o[Q.Next]=function(){return i.findIndex((function(e,n){return!(n<=u||e.dataRef.current.disabled)}))},o[Q.Last]=function(){var e=i.slice().reverse().findIndex((function(e){return!e.dataRef.current.disabled}));return-1===e?e:i.length-1-e},o[Q.Specific]=function(){return i.findIndex((function(e){return e.id===t}))},o[Q.Nothing]=function(){return null},o));return-1===a?e.activeOptionIndex:a}(e,t.focus,t.id);return""===e.searchQuery&&e.activeOptionIndex===r?e:n({},e,{searchQuery:"",activeOptionIndex:r})},j[H.Search]=function(e,t){var r=e.searchQuery+t.value,o=e.options.findIndex((function(e){var n;return!e.dataRef.current.disabled&&(null===(n=e.dataRef.current.textValue)||void 0===n?void 0:n.startsWith(r))}));return n({},e,-1===o||o===e.activeOptionIndex?{searchQuery:r}:{searchQuery:r,activeOptionIndex:o})},j[H.ClearSearch]=function(e){return n({},e,{searchQuery:""})},j[H.RegisterOption]=function(e,t){return n({},e,{options:[].concat(e.options,[{id:t.id,dataRef:t.dataRef}])})},j[H.UnregisterOption]=function(e,t){var r=e.options.slice(),o=null!==e.activeOptionIndex?r[e.activeOptionIndex]:null,i=r.findIndex((function(e){return e.id===t.id}));return-1!==i&&r.splice(i,1),n({},e,{options:r,activeOptionIndex:i===e.activeOptionIndex||null===o?null:r.indexOf(o)})},j),_=e.createContext(null);function $(e,n){return f(n.type,Y,e,n)}function z(n){var t=e.useContext(_);if(null===t){var r=new Error("<"+n+" /> is missing a parent <"+X.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,z),r}return t}var J=e.Fragment;function X(n){var r=n.value,o=n.onChange,u=t(n,["value","onChange"]),a=F(),c=e.useReducer($,{listboxState:U.Closed,propsRef:{current:{value:r,onChange:o}},labelRef:e.createRef(),buttonRef:e.createRef(),optionsRef:e.createRef(),options:[],searchQuery:"",activeOptionIndex:null}),l=c[0],s=l.listboxState,f=l.propsRef,d=l.optionsRef,v=l.buttonRef,p=c[1];i((function(){f.current.value=r}),[r,f]),i((function(){f.current.onChange=o}),[o,f]),e.useEffect((function(){function e(e){var n,t;s===U.Open&&((null===(n=v.current)||void 0===n?void 0:n.contains(e.target))||((null===(t=d.current)||void 0===t?void 0:t.contains(e.target))||p({type:H.CloseListbox}),e.defaultPrevented||a.nextFrame((function(){var e;return null===(e=v.current)||void 0===e?void 0:e.focus()}))))}return window.addEventListener("click",e),function(){return window.removeEventListener("click",e)}}),[s,d,v,a,p]);var m=e.useMemo((function(){return{open:s===U.Open}}),[s]);return e.createElement(_.Provider,{value:c},E(u,m,J))}var Z=T((function t(r,o){var i,u=z([X.name,t.name].join(".")),a=u[0],c=u[1],s=D(a.buttonRef,o),f=e.useState(!1),d=f[0],v=f[1],p="headlessui-listbox-button-"+l(),m=F(),b=e.useCallback((function(e){switch(e.key){case x.Space:case x.Enter:case x.ArrowDown:e.preventDefault(),c({type:H.OpenListbox}),m.nextFrame((function(){var e;null===(e=a.optionsRef.current)||void 0===e||e.focus(),a.propsRef.current.value||c({type:H.GoToOption,focus:Q.First})}));break;case x.ArrowUp:e.preventDefault(),c({type:H.OpenListbox}),m.nextFrame((function(){var e;null===(e=a.optionsRef.current)||void 0===e||e.focus(),a.propsRef.current.value||c({type:H.GoToOption,focus:Q.Last})}))}}),[c,a,m]),h=e.useCallback((function(e){a.listboxState===U.Open?(c({type:H.CloseListbox}),m.nextFrame((function(){var e;return null===(e=a.buttonRef.current)||void 0===e?void 0:e.focus()}))):(e.preventDefault(),c({type:H.OpenListbox}),m.nextFrame((function(){var e;return null===(e=a.optionsRef.current)||void 0===e?void 0:e.focus()})))}),[c,m,a]),y=e.useCallback((function(){var e;if(a.listboxState===U.Open)return null===(e=a.optionsRef.current)||void 0===e?void 0:e.focus();v(!0)}),[a,v]),I=e.useCallback((function(){return v(!1)}),[v]),g=W((function(){if(a.labelRef.current)return[a.labelRef.current.id,p].join(" ")}),[a.labelRef.current,p]),C=e.useMemo((function(){return{open:a.listboxState===U.Open,focused:d}}),[a,d]);return E(n({},r,{ref:s,id:p,type:"button","aria-haspopup":!0,"aria-controls":null===(i=a.optionsRef.current)||void 0===i?void 0:i.id,"aria-expanded":a.listboxState===U.Open||void 0,"aria-labelledby":g,onKeyDown:b,onFocus:y,onBlur:I,onPointerUp:h}),C,"button")})),ee=T((function r(o,i){var u,a=o.static,c=void 0!==a&&a,s=t(o,["enter","enterFrom","enterTo","leave","leaveFrom","leaveTo","static"]),f=z([X.name,r.name].join(".")),v=f[0],p=f[1],m=D(v.optionsRef,i),b="headlessui-listbox-options-"+l(),h=F(),y=F(),I=e.useCallback((function(e){switch(y.dispose(),e.key){case x.Space:if(""!==v.searchQuery)return e.preventDefault(),p({type:H.Search,value:e.key});case x.Enter:e.preventDefault(),p({type:H.CloseListbox}),null!==v.activeOptionIndex&&v.propsRef.current.onChange(v.options[v.activeOptionIndex].dataRef.current.value),d().nextFrame((function(){var e;return null===(e=v.buttonRef.current)||void 0===e?void 0:e.focus()}));break;case x.ArrowDown:return e.preventDefault(),p({type:H.GoToOption,focus:Q.Next});case x.ArrowUp:return e.preventDefault(),p({type:H.GoToOption,focus:Q.Previous});case x.Home:case x.PageUp:return e.preventDefault(),p({type:H.GoToOption,focus:Q.First});case x.End:case x.PageDown:return e.preventDefault(),p({type:H.GoToOption,focus:Q.Last});case x.Escape:return e.preventDefault(),p({type:H.CloseListbox}),h.nextFrame((function(){var e;return null===(e=v.buttonRef.current)||void 0===e?void 0:e.focus()}));case x.Tab:return e.preventDefault();default:1===e.key.length&&(p({type:H.Search,value:e.key}),y.setTimeout((function(){return p({type:H.ClearSearch})}),350))}}),[h,p,y,v]),g=W((function(){var e,n,t;return null!==(e=null===(n=v.labelRef.current)||void 0===n?void 0:n.id)&&void 0!==e?e:null===(t=v.buttonRef.current)||void 0===t?void 0:t.id}),[v.labelRef.current,v.buttonRef.current]),C=e.useMemo((function(){return{open:v.listboxState===U.Open}}),[v]),R={"aria-activedescendant":null===v.activeOptionIndex||null===(u=v.options[v.activeOptionIndex])||void 0===u?void 0:u.id,"aria-labelledby":g,id:b,onKeyDown:I,role:"listbox",tabIndex:0};return c||v.listboxState!==U.Closed?E(n({},s,R,{ref:m}),C,"ul"):null}));function ne(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}X.Button=Z,X.Label=function t(r){var o=z([X.name,t.name].join("."))[0],i="headlessui-listbox-label-"+l(),u=e.useCallback((function(){var e;return null===(e=o.buttonRef.current)||void 0===e?void 0:e.focus()}),[o.buttonRef]),a=e.useMemo((function(){return{open:o.listboxState===U.Open}}),[o]);return E(n({},r,{ref:o.labelRef,id:i,onPointerUp:u}),a,"label")},X.Options=ee,X.Option=function r(o){var u=o.disabled,a=void 0!==u&&u,c=o.value,s=o.className,f=t(o,["disabled","value","className"]),v=z([X.name,r.name].join(".")),p=v[0],m=v[1],b="headlessui-listbox-option-"+l(),h=null!==p.activeOptionIndex&&p.options[p.activeOptionIndex].id===b,y=p.propsRef.current.value===c,x=e.useRef({disabled:a,value:c});i((function(){x.current.disabled=a}),[x,a]),i((function(){x.current.value=c}),[x,c]),i((function(){var e,n;x.current.textValue=null===(e=document.getElementById(b))||void 0===e||null===(n=e.textContent)||void 0===n?void 0:n.toLowerCase()}),[x,b]);var I=e.useCallback((function(){return p.propsRef.current.onChange(c)}),[p.propsRef,c]);i((function(){return m({type:H.RegisterOption,id:b,dataRef:x}),function(){return m({type:H.UnregisterOption,id:b})}}),[x,b]),i((function(){var e,n;y&&(m({type:H.GoToOption,focus:Q.Specific,id:b}),null===(e=document.getElementById(b))||void 0===e||null===(n=e.focus)||void 0===n||n.call(e))}),[]),i((function(){if(h){var e=d();return e.nextFrame((function(){var e,n;return null===(e=document.getElementById(b))||void 0===e||null===(n=e.scrollIntoView)||void 0===n?void 0:n.call(e,{block:"nearest"})})),e.dispose}}),[h]);var g=e.useCallback((function(e){if(a)return e.preventDefault();I(),m({type:H.CloseListbox}),d().nextFrame((function(){var e;return null===(e=p.buttonRef.current)||void 0===e?void 0:e.focus()}))}),[m,p.buttonRef,a,I]),C=e.useCallback((function(){if(a)return m({type:H.GoToOption,focus:Q.Nothing});m({type:H.GoToOption,focus:Q.Specific,id:b})}),[a,b,m]),R=e.useCallback((function(){a||h||m({type:H.GoToOption,focus:Q.Specific,id:b})}),[a,h,b,m]),O=e.useCallback((function(){a||h&&m({type:H.GoToOption,focus:Q.Nothing})}),[a,h,m]),S=e.useMemo((function(){return{active:h,selected:y,disabled:a}}),[h,y,a]);return E(n({},f,{id:b,role:"option",tabIndex:-1,className:ne(s,S),"aria-disabled":!0===a||void 0,"aria-selected":!0===y||void 0,onClick:g,onFocus:C,onPointerMove:R,onPointerLeave:O}),S,"li")};var te=e.createContext(null);function re(n){var t=e.useContext(te);if(null===t){var r=new Error("<"+n+" /> is missing a parent <Switch.Group /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,re),r}return t}var oe=e.Fragment;function ie(r){var o,i=r.checked,u=r.onChange,a=r.className,c=t(r,["checked","onChange","className"]),s="headlessui-switch-"+l(),f=e.useContext(te),d=e.useCallback((function(){return u(!i)}),[u,i]),v=e.useCallback((function(e){e.preventDefault(),d()}),[d]),p=e.useCallback((function(e){e.key===x.Space&&(e.preventDefault(),d())}),[d]),m=e.useMemo((function(){return{checked:i}}),[i]);return E(n({},c,{id:s,ref:null===f?void 0:f.setSwitch,role:"switch",tabIndex:0,className:ue(a,m),"aria-checked":i,"aria-labelledby":null==f||null===(o=f.label)||void 0===o?void 0:o.id,onClick:v,onKeyUp:p}),m,"button")}function ue(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}ie.Group=function(n){var t=e.useState(null),r=t[0],o=t[1],i=e.useState(null),u=i[0],a=i[1],c=e.useMemo((function(){return{switch:r,label:u,setSwitch:o,setLabel:a}}),[r,o,u,a]);return e.createElement(te.Provider,{value:c},E(n,{},oe))},ie.Label=function t(r){var o=re([ie.name,t.name].join(".")),i="headlessui-switch-label-"+l(),u=e.useCallback((function(){o.switch&&(o.switch.click(),o.switch.focus())}),[o.switch]);return E(n({},r,{ref:o.setLabel,id:i,onPointerUp:u}),{},"label")},exports.Listbox=X,exports.Menu=N,exports.Switch=ie,exports.Transition=k;
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,n=require("react"),t=(e=n)&&"object"==typeof e&&"default"in e?e.default:e;function r(){return(r=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function o(e,n){if(null==e)return{};var t,r,o={},u=Object.keys(e);for(r=0;r<u.length;r++)n.indexOf(t=u[r])>=0||(o[t]=e[t]);return o}function u(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function i(e,n){var t;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(t=function(e,n){if(e){if("string"==typeof e)return u(e,void 0);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?u(e,void 0):void 0}}(e))||n&&e&&"number"==typeof e.length){t&&(e=t);var r=0;return function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(t=e[Symbol.iterator]()).next.bind(t)}var a,c,l,s="undefined"!=typeof window?n.useLayoutEffect:n.useEffect,f={serverHandoffComplete:!1},d=0;function v(){return++d}function p(){var e=n.useState(f.serverHandoffComplete?v:null),t=e[0],r=e[1];return s((function(){null===t&&r(v())}),[t]),n.useEffect((function(){!1===f.serverHandoffComplete&&(f.serverHandoffComplete=!0)}),[]),null!=t?""+t:void 0}function m(){var e=n.useRef(!0);return n.useEffect((function(){e.current=!1}),[]),e.current}function b(e,n){if(e in n){for(var t=n[e],r=arguments.length,o=new Array(r>2?r-2:0),u=2;u<r;u++)o[u-2]=arguments[u];return"function"==typeof t?t.apply(void 0,o):t}var i=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(n).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(i,b),i}function y(e,n,t,u,i){if(void 0===i&&(i=!0),i)return h(e,n,t);var l=null!=u?u:a.None;if(l&a.Static){var s=e.static,f=void 0!==s&&s,d=o(e,["static"]);if(f)return h(d,n,t)}if(l&a.RenderStrategy){var v,p=e.unmount,m=void 0===p||p,y=o(e,["unmount"]);return b(m?c.Unmount:c.Hidden,((v={})[c.Unmount]=function(){return null},v[c.Hidden]=function(){return h(r({},y,{hidden:!0,style:{display:"none"}}),n,t)},v))}return h(e,n,t)}function h(e,t,r){var u,a=S(e,["unmount","static"]),c=a.as,l=void 0===c?r:c,s=a.children,f=a.refName,d=void 0===f?"ref":f,v=o(a,["as","children","refName"]),p=void 0!==e.ref?((u={})[d]=e.ref,u):{},m="function"==typeof s?s(t):s;if(l===n.Fragment&&Object.keys(v).length>0){if(Array.isArray(m)&&m.length>1){var b=new Error("You should only render 1 child");throw Error.captureStackTrace&&Error.captureStackTrace(b,h),b}if(!n.isValidElement(m)){var y=new Error('You should render an element as a child. Did you forget the as="..." prop?');throw Error.captureStackTrace&&Error.captureStackTrace(y,h),y}return n.cloneElement(m,Object.assign({},function(e,n,t){for(var r,o=Object.assign({},e),u=function(){var t,u=r.value;void 0!==e[u]&&void 0!==n[u]&&Object.assign(o,((t={})[u]=function(t){t.defaultPrevented||e[u](t),t.defaultPrevented||n[u](t)},t))},a=i(["onClick"]);!(r=a()).done;)u();return o}(function(e){var n=Object.assign({},e);for(var t in n)void 0===n[t]&&delete n[t];return n}(S(v,["ref"])),m.props),p))}return n.createElement(l,Object.assign({},S(v,["ref"]),l!==n.Fragment&&p),m)}function x(e){return n.forwardRef(e)}function S(e,n){void 0===n&&(n=[]);for(var t,r=Object.assign({},e),o=i(n);!(t=o()).done;){var u=t.value;u in r&&delete r[u]}return r}function g(){var e=[],n={requestAnimationFrame:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=requestAnimationFrame.apply(void 0,arguments);n.add((function(){return cancelAnimationFrame(e)}))})),nextFrame:function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];n.requestAnimationFrame((function(){n.requestAnimationFrame.apply(n,t)}))},setTimeout:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=setTimeout.apply(void 0,arguments);n.add((function(){return clearTimeout(e)}))})),add:function(n){e.push(n)},dispose:function(){for(var n,t=i(e.splice(0));!(n=t()).done;)(0,n.value)()}};return n}function I(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).add.apply(n,r)}function C(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).remove.apply(n,r)}function O(e,n,t,r,o){var u=g(),i=void 0!==o?function(e){var n={called:!1};return function(){if(!n.called)return n.called=!0,e.apply(void 0,arguments)}}(o):function(){};return I.apply(void 0,[e].concat(n,t)),u.nextFrame((function(){C.apply(void 0,[e].concat(t)),I.apply(void 0,[e].concat(r)),u.add(function(e,n){var t=g();if(!e)return t.dispose;var r=getComputedStyle(e),o=[r.transitionDuration,r.transitionDelay].map((function(e){var n=e.split(",").filter(Boolean).map((function(e){return e.includes("ms")?parseFloat(e):1e3*parseFloat(e)})).sort((function(e,n){return n-e}))[0];return void 0===n?0:n})),u=o[0];return 0!==u?t.setTimeout((function(){n(l.Finished)}),u+o[1]):n(l.Finished),t.add((function(){return n(l.Cancelled)})),t.dispose}(e,(function(t){return C.apply(void 0,[e].concat(r,n)),i(t)})))})),u.add((function(){return C.apply(void 0,[e].concat(n,t,r))})),u.add((function(){return i(l.Cancelled)})),u.dispose}function w(e){return void 0===e&&(e=""),n.useMemo((function(){return e.split(" ").filter((function(e){return e.trim().length>1}))}),[e])}!function(e){e[e.None=0]="None",e[e.RenderStrategy=1]="RenderStrategy",e[e.Static=2]="Static"}(a||(a={})),function(e){e[e.Unmount=0]="Unmount",e[e.Hidden=1]="Hidden"}(c||(c={})),function(e){e.Finished="finished",e.Cancelled="cancelled"}(l||(l={}));var R,E=n.createContext(null);E.displayName="TransitionContext",function(e){e.Visible="visible",e.Hidden="hidden"}(R||(R={}));var k=n.createContext(null);function T(e){return"children"in e?T(e.children):e.current.filter((function(e){return e.state===R.Visible})).length>0}function L(e){var t=n.useRef(e),r=n.useRef([]),o=function(){var e=n.useRef(!0);return n.useEffect((function(){return function(){e.current=!1}}),[]),e}();n.useEffect((function(){t.current=e}),[e]);var u=n.useCallback((function(e,n){var u;void 0===n&&(n=c.Hidden);var i=r.current.findIndex((function(n){return n.id===e}));-1!==i&&(b(n,((u={})[c.Unmount]=function(){r.current.splice(i,1)},u[c.Hidden]=function(){r.current[i].state=R.Hidden},u)),!T(r)&&o.current&&(null==t.current||t.current()))}),[t,o,r]),i=n.useCallback((function(e){var n=r.current.find((function(n){return n.id===e}));return n?n.state!==R.Visible&&(n.state=R.Visible):r.current.push({id:e,state:R.Visible}),function(){return u(e,c.Unmount)}}),[r,u]);return n.useMemo((function(){return{children:r,register:i,unregister:u}}),[i,u,r])}function D(){}k.displayName="NestingContext";var F=["beforeEnter","afterEnter","beforeLeave","afterLeave"];function M(e){return F.reduce((function(n,t){return n[t]=e[t]||D,n}),{})}var A,N,P,G,j,H=a.RenderStrategy;function U(e){var u=e.beforeEnter,i=e.afterEnter,a=e.beforeLeave,f=e.afterLeave,d=e.enter,v=e.enterFrom,h=e.enterTo,x=e.leave,S=e.leaveFrom,g=e.leaveTo,I=o(e,["beforeEnter","afterEnter","beforeLeave","afterLeave","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo"]),C=n.useRef(null),D=n.useState(R.Visible),F=D[0],A=D[1],N=I.unmount?c.Unmount:c.Hidden,P=function(){var e=n.useContext(E);if(null===e)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return e}(),G=P.show,j=P.appear,U=function(){var e=n.useContext(k);if(null===e)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return e}(),V=U.register,Q=U.unregister,B=m(),K=p(),_=n.useRef(!1),q=L((function(){_.current||(A(R.Hidden),Q(K),Z.current.afterLeave())}));s((function(){if(K)return V(K)}),[V,K]),s((function(){var e;N===c.Hidden&&K&&(G&&F!==R.Visible?A(R.Visible):b(F,((e={})[R.Hidden]=function(){return Q(K)},e[R.Visible]=function(){return V(K)},e)))}),[F,K,V,Q,G,N]);var W=w(d),Y=w(v),J=w(h),$=w(x),z=w(S),X=w(g),Z=function(e){var t=n.useRef(M(e));return n.useEffect((function(){t.current=M(e)}),[e]),t}({beforeEnter:u,afterEnter:i,beforeLeave:a,afterLeave:f});n.useEffect((function(){if(F===R.Visible&&null===C.current)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")}),[C,F]);var ee=B&&!j;return s((function(){var e=C.current;if(e&&!ee)return _.current=!0,G&&Z.current.beforeEnter(),G||Z.current.beforeLeave(),G?O(e,W,Y,J,(function(e){_.current=!1,e===l.Finished&&Z.current.afterEnter()})):O(e,$,z,X,(function(e){_.current=!1,e===l.Finished&&(T(q)||(A(R.Hidden),Q(K),Z.current.afterLeave()))}))}),[Z,K,_,Q,q,C,ee,G,W,Y,J,$,z,X]),t.createElement(k.Provider,{value:q},y(r({},I,{ref:C}),{},"div",H,F===R.Visible))}function V(e){var u=e.show,i=e.appear,a=void 0!==i&&i,c=e.unmount,l=o(e,["show","appear","unmount"]);if(![!0,!1].includes(u))throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");var s=n.useState(u?R.Visible:R.Hidden),f=s[0],d=s[1],v=L((function(){d(R.Hidden)})),p=m(),b=n.useMemo((function(){return{show:u,appear:a||!p}}),[u,a,p]);n.useEffect((function(){u?d(R.Visible):T(v)||d(R.Hidden)}),[u,v]);var h={unmount:c};return t.createElement(k.Provider,{value:v},t.createElement(E.Provider,{value:b},y(r({},h,{as:n.Fragment,children:t.createElement(U,Object.assign({},h,l))}),{},n.Fragment,H,f===R.Visible)))}function Q(){var e=n.useState(g)[0];return n.useEffect((function(){return function(){return e.dispose()}}),[e]),e}function B(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return n.useCallback((function(e){t.forEach((function(n){if(null!==n)return"function"==typeof n?n(e):void(n.current=e)}))}),[t])}function K(e,n){var t=n.resolveItems();if(t.length<=0)return null;var r=n.resolveActiveIndex(),o=null!=r?r:-1,u=function(){switch(e.focus){case N.First:return t.findIndex((function(e){return!n.resolveDisabled(e)}));case N.Previous:var r=t.slice().reverse().findIndex((function(e,t,r){return!(-1!==o&&r.length-t-1>=o||n.resolveDisabled(e))}));return-1===r?r:t.length-1-r;case N.Next:return t.findIndex((function(e,t){return!(t<=o||n.resolveDisabled(e))}));case N.Last:var u=t.slice().reverse().findIndex((function(e){return!n.resolveDisabled(e)}));return-1===u?u:t.length-1-u;case N.Specific:return t.findIndex((function(t){return n.resolveId(t)===e.id}));case N.Nothing:return null;default:!function(e){throw new Error("Unexpected object: "+e)}(e)}}();return-1===u?r:u}function _(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}function q(e){for(var n,t,r=e.parentElement,o=null;r&&!(r instanceof HTMLFieldSetElement);)r instanceof HTMLLegendElement&&(o=r),r=r.parentElement;var u=null!=(n=""===(null==(t=r)?void 0:t.getAttribute("disabled")))&&n;return(!u||!function(e){if(!e)return!1;for(var n=e.previousElementSibling;null!==n;){if(n instanceof HTMLLegendElement)return!1;n=n.previousElementSibling}return!0}(o))&&u}V.Child=U,function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(A||(A={})),function(e){e[e.First=0]="First",e[e.Previous=1]="Previous",e[e.Next=2]="Next",e[e.Last=3]="Last",e[e.Specific=4]="Specific",e[e.Nothing=5]="Nothing"}(N||(N={})),function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(G||(G={})),function(e){e[e.OpenMenu=0]="OpenMenu",e[e.CloseMenu=1]="CloseMenu",e[e.GoToItem=2]="GoToItem",e[e.Search=3]="Search",e[e.ClearSearch=4]="ClearSearch",e[e.RegisterItem=5]="RegisterItem",e[e.UnregisterItem=6]="UnregisterItem"}(j||(j={}));var W=((P={})[j.CloseMenu]=function(e){return r({},e,{activeItemIndex:null,menuState:G.Closed})},P[j.OpenMenu]=function(e){return r({},e,{menuState:G.Open})},P[j.GoToItem]=function(e,n){var t=K(n,{resolveItems:function(){return e.items},resolveActiveIndex:function(){return e.activeItemIndex},resolveId:function(e){return e.id},resolveDisabled:function(e){return e.dataRef.current.disabled}});return""===e.searchQuery&&e.activeItemIndex===t?e:r({},e,{searchQuery:"",activeItemIndex:t})},P[j.Search]=function(e,n){var t=e.searchQuery+n.value,o=e.items.findIndex((function(e){var n;return(null==(n=e.dataRef.current.textValue)?void 0:n.startsWith(t))&&!e.dataRef.current.disabled}));return r({},e,-1===o||o===e.activeItemIndex?{searchQuery:t}:{searchQuery:t,activeItemIndex:o})},P[j.ClearSearch]=function(e){return r({},e,{searchQuery:""})},P[j.RegisterItem]=function(e,n){return r({},e,{items:[].concat(e.items,[{id:n.id,dataRef:n.dataRef}])})},P[j.UnregisterItem]=function(e,n){var t=e.items.slice(),o=null!==e.activeItemIndex?t[e.activeItemIndex]:null,u=t.findIndex((function(e){return e.id===n.id}));return-1!==u&&t.splice(u,1),r({},e,{items:t,activeItemIndex:u===e.activeItemIndex||null===o?null:t.indexOf(o)})},P),Y=n.createContext(null);function J(e){var t=n.useContext(Y);if(null===t){var r=new Error("<"+e+" /> is missing a parent <"+X.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,J),r}return t}function $(e,n){return b(n.type,W,e,n)}Y.displayName="MenuContext";var z=n.Fragment;function X(e){var r=n.useReducer($,{menuState:G.Closed,buttonRef:n.createRef(),itemsRef:n.createRef(),items:[],searchQuery:"",activeItemIndex:null}),o=r[0],u=o.menuState,i=o.itemsRef,a=o.buttonRef,c=r[1];n.useEffect((function(){function e(e){var n,t,r,o=e.target,l=document.activeElement;u===G.Open&&((null==(n=a.current)?void 0:n.contains(o))||((null==(t=i.current)?void 0:t.contains(o))||c({type:j.CloseMenu}),l!==document.body&&(null==l?void 0:l.contains(o))||e.defaultPrevented||null==(r=a.current)||r.focus({preventScroll:!0})))}return window.addEventListener("mousedown",e),function(){return window.removeEventListener("mousedown",e)}}),[u,i,a,c]);var l=n.useMemo((function(){return{open:u===G.Open}}),[u]);return t.createElement(Y.Provider,{value:r},y(e,l,z))}var Z,ee,ne,te=x((function e(t,o){var u,i=J([X.name,e.name].join(".")),a=i[0],c=i[1],l=B(a.buttonRef,o),s="headlessui-menu-button-"+p(),f=Q(),d=n.useCallback((function(e){switch(e.key){case A.Space:case A.Enter:case A.ArrowDown:e.preventDefault(),c({type:j.OpenMenu}),f.nextFrame((function(){var e;null==(e=a.itemsRef.current)||e.focus({preventScroll:!0}),c({type:j.GoToItem,focus:N.First})}));break;case A.ArrowUp:e.preventDefault(),c({type:j.OpenMenu}),f.nextFrame((function(){var e;null==(e=a.itemsRef.current)||e.focus({preventScroll:!0}),c({type:j.GoToItem,focus:N.Last})}))}}),[c,a,f]),v=n.useCallback((function(e){if(q(e.currentTarget))return e.preventDefault();t.disabled||(a.menuState===G.Open?(c({type:j.CloseMenu}),f.nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}))):(e.preventDefault(),c({type:j.OpenMenu}),f.nextFrame((function(){var e;return null==(e=a.itemsRef.current)?void 0:e.focus({preventScroll:!0})}))))}),[c,f,a,t.disabled]),m=n.useMemo((function(){return{open:a.menuState===G.Open}}),[a]);return y(r({},t,{ref:l,id:s,type:"button","aria-haspopup":!0,"aria-controls":null==(u=a.itemsRef.current)?void 0:u.id,"aria-expanded":a.menuState===G.Open||void 0,onKeyDown:d,onClick:v}),m,"button")})),re=a.RenderStrategy|a.Static,oe=x((function e(t,o){var u,i,a=J([X.name,e.name].join(".")),c=a[0],l=a[1],f=B(c.itemsRef,o),d="headlessui-menu-items-"+p(),v=Q();s((function(){var e=c.itemsRef.current;if(e&&c.menuState===G.Open)for(var n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:function(e){return"menuitem"===e.getAttribute("role")?NodeFilter.FILTER_REJECT:e.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT}});n.nextNode();)n.currentNode.setAttribute("role","none")}));var m=n.useCallback((function(e){switch(v.dispose(),e.key){case A.Space:if(""!==c.searchQuery)return e.preventDefault(),l({type:j.Search,value:e.key});case A.Enter:var n;e.preventDefault(),l({type:j.CloseMenu}),null!==c.activeItemIndex&&(null==(n=document.getElementById(c.items[c.activeItemIndex].id))||n.click()),g().nextFrame((function(){var e;return null==(e=c.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));break;case A.ArrowDown:return e.preventDefault(),l({type:j.GoToItem,focus:N.Next});case A.ArrowUp:return e.preventDefault(),l({type:j.GoToItem,focus:N.Previous});case A.Home:case A.PageUp:return e.preventDefault(),l({type:j.GoToItem,focus:N.First});case A.End:case A.PageDown:return e.preventDefault(),l({type:j.GoToItem,focus:N.Last});case A.Escape:e.preventDefault(),l({type:j.CloseMenu}),g().nextFrame((function(){var e;return null==(e=c.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));break;case A.Tab:return e.preventDefault();default:1===e.key.length&&(l({type:j.Search,value:e.key}),v.setTimeout((function(){return l({type:j.ClearSearch})}),350))}}),[l,v,c]),b=n.useMemo((function(){return{open:c.menuState===G.Open}}),[c]);return y(r({},t,{"aria-activedescendant":null===c.activeItemIndex||null==(u=c.items[c.activeItemIndex])?void 0:u.id,"aria-labelledby":null==(i=c.buttonRef.current)?void 0:i.id,id:d,onKeyDown:m,role:"menu",tabIndex:0,ref:f}),b,"div",re,c.menuState===G.Open)})),ue=n.Fragment;function ie(e,t){var r=n.useState(e),o=r[0],u=r[1],i=n.useRef(e);return s((function(){i.current=e}),[e]),s((function(){return u(i.current)}),[i,u].concat(t)),o}X.Button=te,X.Items=oe,X.Item=function e(t){var u=t.disabled,i=void 0!==u&&u,a=t.className,c=t.onClick,l=o(t,["disabled","className","onClick"]),f=J([X.name,e.name].join(".")),d=f[0],v=f[1],m="headlessui-menu-item-"+p(),b=null!==d.activeItemIndex&&d.items[d.activeItemIndex].id===m;s((function(){if(d.menuState===G.Open&&b){var e=g();return e.nextFrame((function(){var e;return null==(e=document.getElementById(m))||null==e.scrollIntoView?void 0:e.scrollIntoView({block:"nearest"})})),e.dispose}}),[m,b,d.menuState]);var h=n.useRef({disabled:i});s((function(){h.current.disabled=i}),[h,i]),s((function(){var e,n;h.current.textValue=null==(e=document.getElementById(m))||null==(n=e.textContent)?void 0:n.toLowerCase()}),[h,m]),s((function(){return v({type:j.RegisterItem,id:m,dataRef:h}),function(){return v({type:j.UnregisterItem,id:m})}}),[h,m]);var x=n.useCallback((function(e){return i?e.preventDefault():(v({type:j.CloseMenu}),g().nextFrame((function(){var e;return null==(e=d.buttonRef.current)?void 0:e.focus({preventScroll:!0})})),c?c(e):void 0)}),[v,d.buttonRef,i,c]),S=n.useCallback((function(){if(i)return v({type:j.GoToItem,focus:N.Nothing});v({type:j.GoToItem,focus:N.Specific,id:m})}),[i,m,v]),I=n.useCallback((function(){i||b||v({type:j.GoToItem,focus:N.Specific,id:m})}),[i,b,m,v]),C=n.useCallback((function(){i||b&&v({type:j.GoToItem,focus:N.Nothing})}),[i,b,v]),O=n.useMemo((function(){return{active:b,disabled:i}}),[b,i]);return y(r({},l,{id:m,role:"menuitem",tabIndex:-1,className:_(a,O),"aria-disabled":!0===i||void 0,onClick:x,onFocus:S,onPointerMove:I,onMouseMove:I,onPointerLeave:C,onMouseLeave:C}),O,ue)},function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(ee||(ee={})),function(e){e[e.OpenListbox=0]="OpenListbox",e[e.CloseListbox=1]="CloseListbox",e[e.SetDisabled=2]="SetDisabled",e[e.GoToOption=3]="GoToOption",e[e.Search=4]="Search",e[e.ClearSearch=5]="ClearSearch",e[e.RegisterOption=6]="RegisterOption",e[e.UnregisterOption=7]="UnregisterOption"}(ne||(ne={}));var ae=((Z={})[ne.CloseListbox]=function(e){return e.disabled||e.listboxState===ee.Closed?e:r({},e,{activeOptionIndex:null,listboxState:ee.Closed})},Z[ne.OpenListbox]=function(e){return e.disabled||e.listboxState===ee.Open?e:r({},e,{listboxState:ee.Open})},Z[ne.SetDisabled]=function(e,n){return e.disabled===n.disabled?e:r({},e,{disabled:n.disabled})},Z[ne.GoToOption]=function(e,n){if(e.disabled)return e;if(e.listboxState===ee.Closed)return e;var t=K(n,{resolveItems:function(){return e.options},resolveActiveIndex:function(){return e.activeOptionIndex},resolveId:function(e){return e.id},resolveDisabled:function(e){return e.dataRef.current.disabled}});return""===e.searchQuery&&e.activeOptionIndex===t?e:r({},e,{searchQuery:"",activeOptionIndex:t})},Z[ne.Search]=function(e,n){if(e.disabled)return e;if(e.listboxState===ee.Closed)return e;var t=e.searchQuery+n.value,o=e.options.findIndex((function(e){var n;return!e.dataRef.current.disabled&&(null==(n=e.dataRef.current.textValue)?void 0:n.startsWith(t))}));return r({},e,-1===o||o===e.activeOptionIndex?{searchQuery:t}:{searchQuery:t,activeOptionIndex:o})},Z[ne.ClearSearch]=function(e){return e.disabled||e.listboxState===ee.Closed||""===e.searchQuery?e:r({},e,{searchQuery:""})},Z[ne.RegisterOption]=function(e,n){return r({},e,{options:[].concat(e.options,[{id:n.id,dataRef:n.dataRef}])})},Z[ne.UnregisterOption]=function(e,n){var t=e.options.slice(),o=null!==e.activeOptionIndex?t[e.activeOptionIndex]:null,u=t.findIndex((function(e){return e.id===n.id}));return-1!==u&&t.splice(u,1),r({},e,{options:t,activeOptionIndex:u===e.activeOptionIndex||null===o?null:t.indexOf(o)})},Z),ce=n.createContext(null);function le(e){var t=n.useContext(ce);if(null===t){var r=new Error("<"+e+" /> is missing a parent <"+de.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,le),r}return t}function se(e,n){return b(n.type,ae,e,n)}ce.displayName="ListboxContext";var fe=n.Fragment;function de(e){var r=e.value,u=e.onChange,i=e.disabled,a=void 0!==i&&i,c=o(e,["value","onChange","disabled"]),l=Q(),f=n.useReducer(se,{listboxState:ee.Closed,propsRef:{current:{value:r,onChange:u}},labelRef:n.createRef(),buttonRef:n.createRef(),optionsRef:n.createRef(),disabled:a,options:[],searchQuery:"",activeOptionIndex:null}),d=f[0],v=d.listboxState,p=d.propsRef,m=d.optionsRef,b=d.buttonRef,h=f[1];s((function(){p.current.value=r}),[r,p]),s((function(){p.current.onChange=u}),[u,p]),s((function(){return h({type:ne.SetDisabled,disabled:a})}),[a]),n.useEffect((function(){function e(e){var n,t,r,o=e.target,u=document.activeElement;v===ee.Open&&((null==(n=b.current)?void 0:n.contains(o))||((null==(t=m.current)?void 0:t.contains(o))||h({type:ne.CloseListbox}),u!==document.body&&(null==u?void 0:u.contains(o))||e.defaultPrevented||null==(r=b.current)||r.focus({preventScroll:!0})))}return window.addEventListener("mousedown",e),function(){return window.removeEventListener("mousedown",e)}}),[v,m,b,l,h]);var x=n.useMemo((function(){return{open:v===ee.Open,disabled:a}}),[v,a]);return t.createElement(ce.Provider,{value:f},y(c,x,fe))}var ve=x((function e(t,o){var u,i=le([de.name,e.name].join(".")),a=i[0],c=i[1],l=B(a.buttonRef,o),s="headlessui-listbox-button-"+p(),f=Q(),d=n.useCallback((function(e){switch(e.key){case A.Space:case A.Enter:case A.ArrowDown:e.preventDefault(),c({type:ne.OpenListbox}),f.nextFrame((function(){var e;null==(e=a.optionsRef.current)||e.focus({preventScroll:!0}),a.propsRef.current.value||c({type:ne.GoToOption,focus:N.First})}));break;case A.ArrowUp:e.preventDefault(),c({type:ne.OpenListbox}),f.nextFrame((function(){var e;null==(e=a.optionsRef.current)||e.focus({preventScroll:!0}),a.propsRef.current.value||c({type:ne.GoToOption,focus:N.Last})}))}}),[c,a,f]),v=n.useCallback((function(e){if(q(e.currentTarget))return e.preventDefault();a.listboxState===ee.Open?(c({type:ne.CloseListbox}),f.nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}))):(e.preventDefault(),c({type:ne.OpenListbox}),f.nextFrame((function(){var e;return null==(e=a.optionsRef.current)?void 0:e.focus({preventScroll:!0})})))}),[c,f,a]),m=ie((function(){if(a.labelRef.current)return[a.labelRef.current.id,s].join(" ")}),[a.labelRef.current,s]),b=n.useMemo((function(){return{open:a.listboxState===ee.Open,disabled:a.disabled}}),[a]);return y(r({},t,{ref:l,id:s,type:"button","aria-haspopup":!0,"aria-controls":null==(u=a.optionsRef.current)?void 0:u.id,"aria-expanded":a.listboxState===ee.Open||void 0,"aria-labelledby":m,disabled:a.disabled,onKeyDown:d,onClick:v}),b,"button")})),pe=a.RenderStrategy|a.Static,me=x((function e(t,o){var u,i=le([de.name,e.name].join(".")),a=i[0],c=i[1],l=B(a.optionsRef,o),s="headlessui-listbox-options-"+p(),f=Q(),d=Q(),v=n.useCallback((function(e){switch(d.dispose(),e.key){case A.Space:if(""!==a.searchQuery)return e.preventDefault(),c({type:ne.Search,value:e.key});case A.Enter:e.preventDefault(),c({type:ne.CloseListbox}),null!==a.activeOptionIndex&&a.propsRef.current.onChange(a.options[a.activeOptionIndex].dataRef.current.value),g().nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));break;case A.ArrowDown:return e.preventDefault(),c({type:ne.GoToOption,focus:N.Next});case A.ArrowUp:return e.preventDefault(),c({type:ne.GoToOption,focus:N.Previous});case A.Home:case A.PageUp:return e.preventDefault(),c({type:ne.GoToOption,focus:N.First});case A.End:case A.PageDown:return e.preventDefault(),c({type:ne.GoToOption,focus:N.Last});case A.Escape:return e.preventDefault(),c({type:ne.CloseListbox}),f.nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));case A.Tab:return e.preventDefault();default:1===e.key.length&&(c({type:ne.Search,value:e.key}),d.setTimeout((function(){return c({type:ne.ClearSearch})}),350))}}),[f,c,d,a]),m=ie((function(){var e,n,t;return null!=(e=null==(n=a.labelRef.current)?void 0:n.id)?e:null==(t=a.buttonRef.current)?void 0:t.id}),[a.labelRef.current,a.buttonRef.current]),b=n.useMemo((function(){return{open:a.listboxState===ee.Open}}),[a]);return y(r({},t,{"aria-activedescendant":null===a.activeOptionIndex||null==(u=a.options[a.activeOptionIndex])?void 0:u.id,"aria-labelledby":m,id:s,onKeyDown:v,role:"listbox",tabIndex:0,ref:l}),b,"ul",pe,a.listboxState===ee.Open)}));de.Button=ve,de.Label=function e(t){var o=le([de.name,e.name].join("."))[0],u="headlessui-listbox-label-"+p(),i=n.useCallback((function(){var e;return null==(e=o.buttonRef.current)?void 0:e.focus({preventScroll:!0})}),[o.buttonRef]),a=n.useMemo((function(){return{open:o.listboxState===ee.Open,disabled:o.disabled}}),[o]);return y(r({},t,{ref:o.labelRef,id:u,onClick:i}),a,"label")},de.Options=me,de.Option=function e(t){var u=t.disabled,i=void 0!==u&&u,a=t.value,c=t.className,l=o(t,["disabled","value","className"]),f=le([de.name,e.name].join(".")),d=f[0],v=f[1],m="headlessui-listbox-option-"+p(),b=null!==d.activeOptionIndex&&d.options[d.activeOptionIndex].id===m,h=d.propsRef.current.value===a,x=n.useRef({disabled:i,value:a});s((function(){x.current.disabled=i}),[x,i]),s((function(){x.current.value=a}),[x,a]),s((function(){var e,n;x.current.textValue=null==(e=document.getElementById(m))||null==(n=e.textContent)?void 0:n.toLowerCase()}),[x,m]);var S=n.useCallback((function(){return d.propsRef.current.onChange(a)}),[d.propsRef,a]);s((function(){return v({type:ne.RegisterOption,id:m,dataRef:x}),function(){return v({type:ne.UnregisterOption,id:m})}}),[x,m]),s((function(){var e;d.listboxState===ee.Open&&h&&(v({type:ne.GoToOption,focus:N.Specific,id:m}),null==(e=document.getElementById(m))||null==e.focus||e.focus())}),[d.listboxState]),s((function(){if(d.listboxState===ee.Open&&b){var e=g();return e.nextFrame((function(){var e;return null==(e=document.getElementById(m))||null==e.scrollIntoView?void 0:e.scrollIntoView({block:"nearest"})})),e.dispose}}),[m,b,d.listboxState]);var I=n.useCallback((function(e){if(i)return e.preventDefault();S(),v({type:ne.CloseListbox}),g().nextFrame((function(){var e;return null==(e=d.buttonRef.current)?void 0:e.focus({preventScroll:!0})}))}),[v,d.buttonRef,i,S]),C=n.useCallback((function(){if(i)return v({type:ne.GoToOption,focus:N.Nothing});v({type:ne.GoToOption,focus:N.Specific,id:m})}),[i,m,v]),O=n.useCallback((function(){i||b||v({type:ne.GoToOption,focus:N.Specific,id:m})}),[i,b,m,v]),w=n.useCallback((function(){i||b&&v({type:ne.GoToOption,focus:N.Nothing})}),[i,b,v]),R=n.useMemo((function(){return{active:b,selected:h,disabled:i}}),[b,h,i]);return y(r({},l,{id:m,role:"option",tabIndex:-1,className:_(c,R),"aria-disabled":!0===i||void 0,"aria-selected":!0===h||void 0,onClick:I,onFocus:C,onPointerMove:O,onMouseMove:O,onPointerLeave:w,onMouseLeave:w}),R,"li")};var be=n.createContext(null);function ye(e){var t=n.useContext(be);if(null===t){var r=new Error("<"+e+" /> is missing a parent <Switch.Group /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,ye),r}return t}be.displayName="GroupContext";var he=n.Fragment;function xe(e){var t,u=e.checked,i=e.onChange,a=e.className,c=o(e,["checked","onChange","className"]),l="headlessui-switch-"+p(),s=n.useContext(be),f=n.useCallback((function(){return i(!u)}),[i,u]),d=n.useCallback((function(e){if(q(e.currentTarget))return e.preventDefault();e.preventDefault(),f()}),[f]),v=n.useCallback((function(e){e.key!==A.Tab&&e.preventDefault(),e.key===A.Space&&f()}),[f]),m=n.useCallback((function(e){return e.preventDefault()}),[]),b=n.useMemo((function(){return{checked:u}}),[u]),h={id:l,ref:null===s?void 0:s.setSwitch,role:"switch",tabIndex:0,className:_(a,b),"aria-checked":u,"aria-labelledby":null==s||null==(t=s.label)?void 0:t.id,onClick:d,onKeyUp:v,onKeyPress:m};return"button"===c.as&&Object.assign(h,{type:"button"}),y(r({},c,h),b,"button")}xe.Group=function(e){var r=n.useState(null),o=r[0],u=r[1],i=n.useState(null),a=i[0],c=i[1],l=n.useMemo((function(){return{switch:o,label:a,setSwitch:u,setLabel:c}}),[o,u,a,c]);return t.createElement(be.Provider,{value:l},y(e,{},he))},xe.Label=function e(t){var o=ye([xe.name,e.name].join(".")),u="headlessui-switch-label-"+p(),i=n.useCallback((function(){o.switch&&(o.switch.click(),o.switch.focus({preventScroll:!0}))}),[o.switch]);return y(r({},t,{ref:o.setLabel,id:u,onClick:i}),{},"label")},exports.Listbox=de,exports.Menu=X,exports.Switch=xe,exports.Transition=V;
//# sourceMappingURL=headlessui.cjs.production.min.js.map

2

dist/headlessui.umd.production.min.js

@@ -1,2 +0,2 @@

!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((e=e||self).headlessui={},e.React)}(this,(function(e,n){"use strict";function t(){return(t=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function r(e,n){if(null==e)return{};var t,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n.indexOf(t=i[r])>=0||(o[t]=e[t]);return o}function o(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}var i,u="undefined"!=typeof window?n.useLayoutEffect:n.useEffect,a={serverHandoffComplete:!1},c=0;function l(){return++c}function s(){var e=n.useState(a.serverHandoffComplete?l:null),t=e[0],r=e[1];return u((function(){null===t&&r(l())}),[]),n.useEffect((function(){!1===a.serverHandoffComplete&&(a.serverHandoffComplete=!0)}),[]),null!=t?""+t:void 0}function f(){var e=n.useRef(!0);return n.useEffect((function(){e.current=!1}),[]),e.current}function d(e,n){if(e in n){for(var t=n[e],r=arguments.length,o=new Array(r>2?r-2:0),i=2;i<r;i++)o[i-2]=arguments[i];return"function"==typeof t?t.apply(void 0,o):t}var u=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(n).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(u,d),u}function v(){var e=[],n={requestAnimationFrame:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=requestAnimationFrame.apply(void 0,arguments);n.add((function(){return cancelAnimationFrame(e)}))})),nextFrame:function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];n.requestAnimationFrame((function(){n.requestAnimationFrame.apply(n,t)}))},setTimeout:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=setTimeout.apply(void 0,arguments);n.add((function(){return clearTimeout(e)}))})),add:function(n){e.push(n)},dispose:function(){e.splice(0).forEach((function(e){return e()}))}};return n}function p(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).add.apply(n,r)}function m(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).remove.apply(n,r)}function b(e,n,t,r,o){var u=v(),a=void 0!==o?function(e){var n={called:!1};return function(){if(!n.called)return n.called=!0,e.apply(void 0,arguments)}}(o):function(){};return p.apply(void 0,[e].concat(n,t)),u.nextFrame((function(){m.apply(void 0,[e].concat(t)),p.apply(void 0,[e].concat(r)),u.add(function(e,n){var t=v();if(!e)return t.dispose;var r=getComputedStyle(e),o=[r.transitionDuration,r.transitionDelay].map((function(e){var n=e.split(",").filter(Boolean).map((function(e){return e.includes("ms")?parseFloat(e):1e3*parseFloat(e)})).sort((function(e,n){return n-e}))[0];return void 0===n?0:n})),u=o[0];return 0!==u?t.setTimeout((function(){n(i.Finished)}),u+o[1]):n(i.Finished),t.add((function(){return n(i.Cancelled)})),t.dispose}(e,(function(t){return m.apply(void 0,[e].concat(r,n)),a(t)})))})),u.add((function(){return m.apply(void 0,[e].concat(n,t,r))})),u.add((function(){return a(i.Cancelled)})),u.dispose}function h(e){return void 0===e&&(e=""),n.useMemo((function(){return e.split(" ").filter((function(e){return e.trim().length>1}))}),[e])}!function(e){e.Finished="finished",e.Cancelled="cancelled"}(i||(i={}));var y,x=n.createContext(null);!function(e){e.Visible="visible",e.Hidden="hidden"}(y||(y={}));var I,g,C,R,O,S=n.createContext(null);function w(e){var t=n.useRef(e),r=n.useRef([]),o=function(){var e=n.useRef(!0);return n.useEffect((function(){return function(){e.current=!1}}),[]),e}();n.useEffect((function(){t.current=e}),[e]);var i=n.useCallback((function(e){var n,i=r.current.indexOf(e);-1!==i&&(r.current.splice(i,1),r.current.length<=0&&o.current&&(null===(n=t.current)||void 0===n||n.call(t)))}),[t,o,r]),u=n.useCallback((function(e){return r.current.push(e),function(){return i(e)}}),[r,i]);return n.useMemo((function(){return{children:r,register:u,unregister:i}}),[u,i,r])}function k(e){var t=e.children,o=e.enter,a=e.enterFrom,c=e.enterTo,l=e.leave,d=e.leaveFrom,v=e.leaveTo,p=r(e,["children","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo"]),m=n.useRef(null),I=n.useState(y.Visible),g=I[0],C=I[1],R=function(){var e=n.useContext(x);if(null===e)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return e}(),O=R.show,k=R.appear,E=function(){var e=n.useContext(S);if(null===e)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return e}(),T=E.register,F=E.unregister,D=f(),L=s(),P=n.useRef(!1),M=w((function(){P.current||(C(y.Hidden),F(L))}));u((function(){if(L)return T(L)}),[T,L]);var A=h(o),G=h(a),N=h(c),j=h(l),U=h(d),H=h(v);n.useEffect((function(){if(g===y.Visible&&null===m.current)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")}),[m,g]);var Q=D&&!k;if(u((function(){var e=m.current;if(e&&!Q)return P.current=!0,O?b(e,A,G,N,(function(){P.current=!1})):b(e,j,U,H,(function(e){P.current=!1,e===i.Finished&&M.children.current.length<=0&&(C(y.Hidden),F(L))}))}),[L,P,F,M,m,Q,O,A,G,N,j,U,H]),g===y.Hidden)return null;if("function"==typeof t)return n.createElement(S.Provider,{value:M},t(m));var B=p.as,V=void 0===B?"div":B,q=r(p,["as"]);return n.createElement(S.Provider,{value:M},n.createElement(V,Object.assign({},q,{ref:m}),t))}function E(e){var t,o=e.show,i=e.appear,u=void 0!==i&&i,a=r(e,["show","appear"]);if(![!0,!1].includes(o))throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");var c=n.useState(o?y.Visible:y.Hidden),l=c[0],s=c[1],v=w((function(){s(y.Hidden)})),p=f(),m=n.useMemo((function(){return{show:o,appear:u||!p}}),[o,u,p]);return n.useEffect((function(){o?s(y.Visible):v.children.current.length<=0&&s(y.Hidden)}),[o,v]),n.createElement(S.Provider,{value:v},n.createElement(x.Provider,{value:m},d(l,((t={})[y.Visible]=function(){return n.createElement(k,Object.assign({},a))},t[y.Hidden]=null,t))))}function T(e,t,i){var u=e.as,a=void 0===u?i:u,c=e.children,l=r(e,["as","children"]),s="function"==typeof c?c(t):c;if(a===n.Fragment&&Object.keys(l).length>0){if(Array.isArray(s)&&s.length>1){var f=new Error("You should only render 1 child");throw Error.captureStackTrace&&Error.captureStackTrace(f,T),f}if(!n.isValidElement(s)){var d=new Error('You should render an element as a child. Did you forget the as="..." prop?');throw Error.captureStackTrace&&Error.captureStackTrace(d,T),d}return n.cloneElement(s,function(e,n,t){for(var r,i=Object.assign({},e),u=function(){var t,o=r.value;void 0!==e[o]&&void 0!==n[o]&&Object.assign(i,((t={})[o]=function(t){t.defaultPrevented||e[o](t),t.defaultPrevented||n[o](t)},t))},a=function(e,n){var t;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(t=function(e,n){if(e){if("string"==typeof e)return o(e,void 0);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?o(e,void 0):void 0}}(e))){t&&(e=t);var r=0;return function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(t=e[Symbol.iterator]()).next.bind(t)}(["onClick"]);!(r=a()).done;)u();return i}(function(e){var n=Object.assign({},e);for(var t in n)void 0===n[t]&&delete n[t];return n}(l),s.props))}return n.createElement(a,l,s)}function F(e){return n.forwardRef(e)}function D(){var e=n.useState(v)[0];return n.useEffect((function(){return function(){return e.dispose()}}),[e]),e}function L(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return n.useCallback((function(e){t.forEach((function(n){if(null!==n)return"function"==typeof n?n(e):void(n.current=e)}))}),[t])}E.Child=k,function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(I||(I={})),function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(C||(C={})),function(e){e[e.OpenMenu=0]="OpenMenu",e[e.CloseMenu=1]="CloseMenu",e[e.GoToItem=2]="GoToItem",e[e.Search=3]="Search",e[e.ClearSearch=4]="ClearSearch",e[e.RegisterItem=5]="RegisterItem",e[e.UnregisterItem=6]="UnregisterItem"}(R||(R={})),function(e){e[e.FirstItem=0]="FirstItem",e[e.PreviousItem=1]="PreviousItem",e[e.NextItem=2]="NextItem",e[e.LastItem=3]="LastItem",e[e.SpecificItem=4]="SpecificItem",e[e.Nothing=5]="Nothing"}(O||(O={}));var P=((g={})[R.CloseMenu]=function(e){return t({},e,{menuState:C.Closed})},g[R.OpenMenu]=function(e){return t({},e,{menuState:C.Open})},g[R.GoToItem]=function(e,n){var r=function(e,n,t){var r,o;if(e.items.length<=0)return null;var i=e.items,u=null!==(r=e.activeItemIndex)&&void 0!==r?r:-1,a=d(n,((o={})[O.FirstItem]=function(){return i.findIndex((function(e){return!e.dataRef.current.disabled}))},o[O.PreviousItem]=function(){var e=i.slice().reverse().findIndex((function(e,n,t){return!(-1!==u&&t.length-n-1>=u||e.dataRef.current.disabled)}));return-1===e?e:i.length-1-e},o[O.NextItem]=function(){return i.findIndex((function(e,n){return!(n<=u||e.dataRef.current.disabled)}))},o[O.LastItem]=function(){var e=i.slice().reverse().findIndex((function(e){return!e.dataRef.current.disabled}));return-1===e?e:i.length-1-e},o[O.SpecificItem]=function(){return i.findIndex((function(e){return e.id===t}))},o[O.Nothing]=function(){return null},o));return-1===a?e.activeItemIndex:a}(e,n.focus,n.id);return""===e.searchQuery&&e.activeItemIndex===r?e:t({},e,{searchQuery:"",activeItemIndex:r})},g[R.Search]=function(e,n){var r=e.searchQuery+n.value,o=e.items.findIndex((function(e){var n;return(null===(n=e.dataRef.current.textValue)||void 0===n?void 0:n.startsWith(r))&&!e.dataRef.current.disabled}));return t({},e,-1===o||o===e.activeItemIndex?{searchQuery:r}:{searchQuery:r,activeItemIndex:o})},g[R.ClearSearch]=function(e){return t({},e,{searchQuery:""})},g[R.RegisterItem]=function(e,n){return t({},e,{items:[].concat(e.items,[{id:n.id,dataRef:n.dataRef}])})},g[R.UnregisterItem]=function(e,n){var r=e.items.slice(),o=null!==e.activeItemIndex?r[e.activeItemIndex]:null,i=r.findIndex((function(e){return e.id===n.id}));return-1!==i&&r.splice(i,1),t({},e,{items:r,activeItemIndex:i===e.activeItemIndex||null===o?null:r.indexOf(o)})},g),M=n.createContext(null);function A(e){var t=n.useContext(M);if(null===t){var r=new Error("<"+e+" /> is missing a parent <"+j.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,A),r}return t}function G(e,n){return d(n.type,P,e,n)}var N=n.Fragment;function j(e){var t=D(),r=n.useReducer(G,{menuState:C.Closed,buttonRef:n.createRef(),itemsRef:n.createRef(),items:[],searchQuery:"",activeItemIndex:null}),o=r[0],i=o.menuState,u=o.itemsRef,a=o.buttonRef,c=r[1];n.useEffect((function(){function e(e){var n,r;i===C.Open&&((null===(n=a.current)||void 0===n?void 0:n.contains(e.target))||((null===(r=u.current)||void 0===r?void 0:r.contains(e.target))||c({type:R.CloseMenu}),e.defaultPrevented||t.nextFrame((function(){var e;return null===(e=a.current)||void 0===e?void 0:e.focus()}))))}return window.addEventListener("click",e),function(){return window.removeEventListener("click",e)}}),[i,u,a,t,c]);var l=n.useMemo((function(){return{open:i===C.Open}}),[i]);return n.createElement(M.Provider,{value:r},T(e,l,N))}var U,H,Q,B,V=F((function e(r,o){var i,u=A([j.name,e.name].join(".")),a=u[0],c=u[1],l=L(a.buttonRef,o),f=n.useState(!1),d=f[0],v=f[1],p="headlessui-menu-button-"+s(),m=D(),b=n.useCallback((function(e){switch(e.key){case I.Space:case I.Enter:case I.ArrowDown:e.preventDefault(),c({type:R.OpenMenu}),m.nextFrame((function(){var e;null===(e=a.itemsRef.current)||void 0===e||e.focus(),c({type:R.GoToItem,focus:O.FirstItem})}));break;case I.ArrowUp:e.preventDefault(),c({type:R.OpenMenu}),m.nextFrame((function(){var e;null===(e=a.itemsRef.current)||void 0===e||e.focus(),c({type:R.GoToItem,focus:O.LastItem})}))}}),[c,a,m]),h=n.useCallback((function(e){a.menuState===C.Open?(c({type:R.CloseMenu}),m.nextFrame((function(){var e;return null===(e=a.buttonRef.current)||void 0===e?void 0:e.focus()}))):(e.preventDefault(),c({type:R.OpenMenu}),m.nextFrame((function(){var e;return null===(e=a.itemsRef.current)||void 0===e?void 0:e.focus()})))}),[c,m,a]),y=n.useCallback((function(){var e;a.menuState===C.Open&&(null===(e=a.itemsRef.current)||void 0===e||e.focus()),v(!0)}),[a,v]),x=n.useCallback((function(){return v(!1)}),[v]),g=n.useMemo((function(){return{open:a.menuState===C.Open,focused:d}}),[a,d]);return T(t({},r,{ref:l,id:p,type:"button","aria-haspopup":!0,"aria-controls":null===(i=a.itemsRef.current)||void 0===i?void 0:i.id,"aria-expanded":a.menuState===C.Open||void 0,onKeyDown:b,onFocus:y,onBlur:x,onPointerUp:h}),g,"button")})),q=F((function e(o,i){var u,a,c=o.static,l=void 0!==c&&c,f=r(o,["static"]),d=A([j.name,e.name].join(".")),p=d[0],m=d[1],b=L(p.itemsRef,i),h="headlessui-menu-items-"+s(),y=D(),x=n.useCallback((function(e){switch(y.dispose(),e.key){case I.Space:if(""!==p.searchQuery)return e.preventDefault(),m({type:R.Search,value:e.key});case I.Enter:var n;e.preventDefault(),m({type:R.CloseMenu}),null!==p.activeItemIndex&&(null===(n=document.getElementById(p.items[p.activeItemIndex].id))||void 0===n||n.click()),v().nextFrame((function(){var e;return null===(e=p.buttonRef.current)||void 0===e?void 0:e.focus()}));break;case I.ArrowDown:return e.preventDefault(),m({type:R.GoToItem,focus:O.NextItem});case I.ArrowUp:return e.preventDefault(),m({type:R.GoToItem,focus:O.PreviousItem});case I.Home:case I.PageUp:return e.preventDefault(),m({type:R.GoToItem,focus:O.FirstItem});case I.End:case I.PageDown:return e.preventDefault(),m({type:R.GoToItem,focus:O.LastItem});case I.Escape:e.preventDefault(),m({type:R.CloseMenu}),v().nextFrame((function(){var e;return null===(e=p.buttonRef.current)||void 0===e?void 0:e.focus()}));break;case I.Tab:return e.preventDefault();default:1===e.key.length&&(m({type:R.Search,value:e.key}),y.setTimeout((function(){return m({type:R.ClearSearch})}),350))}}),[m,y,p]),g=n.useMemo((function(){return{open:p.menuState===C.Open}}),[p]),S={"aria-activedescendant":null===p.activeItemIndex||null===(u=p.items[p.activeItemIndex])||void 0===u?void 0:u.id,"aria-labelledby":null===(a=p.buttonRef.current)||void 0===a?void 0:a.id,id:h,onKeyDown:x,role:"menu",tabIndex:0};return l||p.menuState!==C.Closed?T(t({},f,S,{ref:b}),g,"div"):null})),K=n.Fragment;function W(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}function Y(e,t){var r=n.useState(e),o=r[0],i=r[1],a=n.useRef(e);return u((function(){a.current=e}),[e]),u((function(){return i(a.current)}),[a,i].concat(t)),o}j.Button=V,j.Items=q,j.Item=function e(o){var i=o.disabled,a=void 0!==i&&i,c=o.className,l=o.onClick,f=r(o,["disabled","className","onClick"]),d=A([j.name,e.name].join(".")),v=d[0],p=d[1],m=D(),b="headlessui-menu-item-"+s(),h=null!==v.activeItemIndex&&v.items[v.activeItemIndex].id===b,y=n.useRef({disabled:a});u((function(){y.current.disabled=a}),[y,a]),u((function(){var e,n;y.current.textValue=null===(e=document.getElementById(b))||void 0===e||null===(n=e.textContent)||void 0===n?void 0:n.toLowerCase()}),[y,b]),u((function(){return p({type:R.RegisterItem,id:b,dataRef:y}),function(){return p({type:R.UnregisterItem,id:b})}}),[y,b]);var x=n.useCallback((function(e){return a?e.preventDefault():(p({type:R.CloseMenu}),m.nextFrame((function(){var e;return null===(e=v.buttonRef.current)||void 0===e?void 0:e.focus()})),l?l(e):void 0)}),[m,p,v.buttonRef,a,l]),I=n.useCallback((function(){if(a)return p({type:R.GoToItem,focus:O.Nothing});p({type:R.GoToItem,focus:O.SpecificItem,id:b})}),[a,b,p]),g=n.useCallback((function(){a||h||p({type:R.GoToItem,focus:O.SpecificItem,id:b})}),[a,h,b,p]),C=n.useCallback((function(){a||h&&p({type:R.GoToItem,focus:O.Nothing})}),[a,h,p]),S=n.useMemo((function(){return{active:h,disabled:a}}),[h,a]);return T(t({},f,{id:b,role:"menuitem",tabIndex:-1,className:W(c,S),"aria-disabled":!0===a||void 0,onClick:x,onFocus:I,onPointerMove:g,onPointerLeave:C}),S,K)},function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(H||(H={})),function(e){e[e.OpenListbox=0]="OpenListbox",e[e.CloseListbox=1]="CloseListbox",e[e.GoToOption=2]="GoToOption",e[e.Search=3]="Search",e[e.ClearSearch=4]="ClearSearch",e[e.RegisterOption=5]="RegisterOption",e[e.UnregisterOption=6]="UnregisterOption"}(Q||(Q={})),function(e){e[e.First=0]="First",e[e.Previous=1]="Previous",e[e.Next=2]="Next",e[e.Last=3]="Last",e[e.Specific=4]="Specific",e[e.Nothing=5]="Nothing"}(B||(B={}));var _=((U={})[Q.CloseListbox]=function(e){return t({},e,{listboxState:H.Closed})},U[Q.OpenListbox]=function(e){return t({},e,{listboxState:H.Open})},U[Q.GoToOption]=function(e,n){var r=function(e,n,t){var r,o;if(e.options.length<=0)return null;var i=e.options,u=null!==(r=e.activeOptionIndex)&&void 0!==r?r:-1,a=d(n,((o={})[B.First]=function(){return i.findIndex((function(e){return!e.dataRef.current.disabled}))},o[B.Previous]=function(){var e=i.slice().reverse().findIndex((function(e,n,t){return!(-1!==u&&t.length-n-1>=u||e.dataRef.current.disabled)}));return-1===e?e:i.length-1-e},o[B.Next]=function(){return i.findIndex((function(e,n){return!(n<=u||e.dataRef.current.disabled)}))},o[B.Last]=function(){var e=i.slice().reverse().findIndex((function(e){return!e.dataRef.current.disabled}));return-1===e?e:i.length-1-e},o[B.Specific]=function(){return i.findIndex((function(e){return e.id===t}))},o[B.Nothing]=function(){return null},o));return-1===a?e.activeOptionIndex:a}(e,n.focus,n.id);return""===e.searchQuery&&e.activeOptionIndex===r?e:t({},e,{searchQuery:"",activeOptionIndex:r})},U[Q.Search]=function(e,n){var r=e.searchQuery+n.value,o=e.options.findIndex((function(e){var n;return!e.dataRef.current.disabled&&(null===(n=e.dataRef.current.textValue)||void 0===n?void 0:n.startsWith(r))}));return t({},e,-1===o||o===e.activeOptionIndex?{searchQuery:r}:{searchQuery:r,activeOptionIndex:o})},U[Q.ClearSearch]=function(e){return t({},e,{searchQuery:""})},U[Q.RegisterOption]=function(e,n){return t({},e,{options:[].concat(e.options,[{id:n.id,dataRef:n.dataRef}])})},U[Q.UnregisterOption]=function(e,n){var r=e.options.slice(),o=null!==e.activeOptionIndex?r[e.activeOptionIndex]:null,i=r.findIndex((function(e){return e.id===n.id}));return-1!==i&&r.splice(i,1),t({},e,{options:r,activeOptionIndex:i===e.activeOptionIndex||null===o?null:r.indexOf(o)})},U),$=n.createContext(null);function z(e,n){return d(n.type,_,e,n)}function J(e){var t=n.useContext($);if(null===t){var r=new Error("<"+e+" /> is missing a parent <"+Z.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,J),r}return t}var X=n.Fragment;function Z(e){var t=e.value,o=e.onChange,i=r(e,["value","onChange"]),a=D(),c=n.useReducer(z,{listboxState:H.Closed,propsRef:{current:{value:t,onChange:o}},labelRef:n.createRef(),buttonRef:n.createRef(),optionsRef:n.createRef(),options:[],searchQuery:"",activeOptionIndex:null}),l=c[0],s=l.listboxState,f=l.propsRef,d=l.optionsRef,v=l.buttonRef,p=c[1];u((function(){f.current.value=t}),[t,f]),u((function(){f.current.onChange=o}),[o,f]),n.useEffect((function(){function e(e){var n,t;s===H.Open&&((null===(n=v.current)||void 0===n?void 0:n.contains(e.target))||((null===(t=d.current)||void 0===t?void 0:t.contains(e.target))||p({type:Q.CloseListbox}),e.defaultPrevented||a.nextFrame((function(){var e;return null===(e=v.current)||void 0===e?void 0:e.focus()}))))}return window.addEventListener("click",e),function(){return window.removeEventListener("click",e)}}),[s,d,v,a,p]);var m=n.useMemo((function(){return{open:s===H.Open}}),[s]);return n.createElement($.Provider,{value:c},T(i,m,X))}var ee=F((function e(r,o){var i,u=J([Z.name,e.name].join(".")),a=u[0],c=u[1],l=L(a.buttonRef,o),f=n.useState(!1),d=f[0],v=f[1],p="headlessui-listbox-button-"+s(),m=D(),b=n.useCallback((function(e){switch(e.key){case I.Space:case I.Enter:case I.ArrowDown:e.preventDefault(),c({type:Q.OpenListbox}),m.nextFrame((function(){var e;null===(e=a.optionsRef.current)||void 0===e||e.focus(),a.propsRef.current.value||c({type:Q.GoToOption,focus:B.First})}));break;case I.ArrowUp:e.preventDefault(),c({type:Q.OpenListbox}),m.nextFrame((function(){var e;null===(e=a.optionsRef.current)||void 0===e||e.focus(),a.propsRef.current.value||c({type:Q.GoToOption,focus:B.Last})}))}}),[c,a,m]),h=n.useCallback((function(e){a.listboxState===H.Open?(c({type:Q.CloseListbox}),m.nextFrame((function(){var e;return null===(e=a.buttonRef.current)||void 0===e?void 0:e.focus()}))):(e.preventDefault(),c({type:Q.OpenListbox}),m.nextFrame((function(){var e;return null===(e=a.optionsRef.current)||void 0===e?void 0:e.focus()})))}),[c,m,a]),y=n.useCallback((function(){var e;if(a.listboxState===H.Open)return null===(e=a.optionsRef.current)||void 0===e?void 0:e.focus();v(!0)}),[a,v]),x=n.useCallback((function(){return v(!1)}),[v]),g=Y((function(){if(a.labelRef.current)return[a.labelRef.current.id,p].join(" ")}),[a.labelRef.current,p]),C=n.useMemo((function(){return{open:a.listboxState===H.Open,focused:d}}),[a,d]);return T(t({},r,{ref:l,id:p,type:"button","aria-haspopup":!0,"aria-controls":null===(i=a.optionsRef.current)||void 0===i?void 0:i.id,"aria-expanded":a.listboxState===H.Open||void 0,"aria-labelledby":g,onKeyDown:b,onFocus:y,onBlur:x,onPointerUp:h}),C,"button")})),ne=F((function e(o,i){var u,a=o.static,c=void 0!==a&&a,l=r(o,["enter","enterFrom","enterTo","leave","leaveFrom","leaveTo","static"]),f=J([Z.name,e.name].join(".")),d=f[0],p=f[1],m=L(d.optionsRef,i),b="headlessui-listbox-options-"+s(),h=D(),y=D(),x=n.useCallback((function(e){switch(y.dispose(),e.key){case I.Space:if(""!==d.searchQuery)return e.preventDefault(),p({type:Q.Search,value:e.key});case I.Enter:e.preventDefault(),p({type:Q.CloseListbox}),null!==d.activeOptionIndex&&d.propsRef.current.onChange(d.options[d.activeOptionIndex].dataRef.current.value),v().nextFrame((function(){var e;return null===(e=d.buttonRef.current)||void 0===e?void 0:e.focus()}));break;case I.ArrowDown:return e.preventDefault(),p({type:Q.GoToOption,focus:B.Next});case I.ArrowUp:return e.preventDefault(),p({type:Q.GoToOption,focus:B.Previous});case I.Home:case I.PageUp:return e.preventDefault(),p({type:Q.GoToOption,focus:B.First});case I.End:case I.PageDown:return e.preventDefault(),p({type:Q.GoToOption,focus:B.Last});case I.Escape:return e.preventDefault(),p({type:Q.CloseListbox}),h.nextFrame((function(){var e;return null===(e=d.buttonRef.current)||void 0===e?void 0:e.focus()}));case I.Tab:return e.preventDefault();default:1===e.key.length&&(p({type:Q.Search,value:e.key}),y.setTimeout((function(){return p({type:Q.ClearSearch})}),350))}}),[h,p,y,d]),g=Y((function(){var e,n,t;return null!==(e=null===(n=d.labelRef.current)||void 0===n?void 0:n.id)&&void 0!==e?e:null===(t=d.buttonRef.current)||void 0===t?void 0:t.id}),[d.labelRef.current,d.buttonRef.current]),C=n.useMemo((function(){return{open:d.listboxState===H.Open}}),[d]),R={"aria-activedescendant":null===d.activeOptionIndex||null===(u=d.options[d.activeOptionIndex])||void 0===u?void 0:u.id,"aria-labelledby":g,id:b,onKeyDown:x,role:"listbox",tabIndex:0};return c||d.listboxState!==H.Closed?T(t({},l,R,{ref:m}),C,"ul"):null}));function te(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}Z.Button=ee,Z.Label=function e(r){var o=J([Z.name,e.name].join("."))[0],i="headlessui-listbox-label-"+s(),u=n.useCallback((function(){var e;return null===(e=o.buttonRef.current)||void 0===e?void 0:e.focus()}),[o.buttonRef]),a=n.useMemo((function(){return{open:o.listboxState===H.Open}}),[o]);return T(t({},r,{ref:o.labelRef,id:i,onPointerUp:u}),a,"label")},Z.Options=ne,Z.Option=function e(o){var i=o.disabled,a=void 0!==i&&i,c=o.value,l=o.className,f=r(o,["disabled","value","className"]),d=J([Z.name,e.name].join(".")),p=d[0],m=d[1],b="headlessui-listbox-option-"+s(),h=null!==p.activeOptionIndex&&p.options[p.activeOptionIndex].id===b,y=p.propsRef.current.value===c,x=n.useRef({disabled:a,value:c});u((function(){x.current.disabled=a}),[x,a]),u((function(){x.current.value=c}),[x,c]),u((function(){var e,n;x.current.textValue=null===(e=document.getElementById(b))||void 0===e||null===(n=e.textContent)||void 0===n?void 0:n.toLowerCase()}),[x,b]);var I=n.useCallback((function(){return p.propsRef.current.onChange(c)}),[p.propsRef,c]);u((function(){return m({type:Q.RegisterOption,id:b,dataRef:x}),function(){return m({type:Q.UnregisterOption,id:b})}}),[x,b]),u((function(){var e,n;y&&(m({type:Q.GoToOption,focus:B.Specific,id:b}),null===(e=document.getElementById(b))||void 0===e||null===(n=e.focus)||void 0===n||n.call(e))}),[]),u((function(){if(h){var e=v();return e.nextFrame((function(){var e,n;return null===(e=document.getElementById(b))||void 0===e||null===(n=e.scrollIntoView)||void 0===n?void 0:n.call(e,{block:"nearest"})})),e.dispose}}),[h]);var g=n.useCallback((function(e){if(a)return e.preventDefault();I(),m({type:Q.CloseListbox}),v().nextFrame((function(){var e;return null===(e=p.buttonRef.current)||void 0===e?void 0:e.focus()}))}),[m,p.buttonRef,a,I]),C=n.useCallback((function(){if(a)return m({type:Q.GoToOption,focus:B.Nothing});m({type:Q.GoToOption,focus:B.Specific,id:b})}),[a,b,m]),R=n.useCallback((function(){a||h||m({type:Q.GoToOption,focus:B.Specific,id:b})}),[a,h,b,m]),O=n.useCallback((function(){a||h&&m({type:Q.GoToOption,focus:B.Nothing})}),[a,h,m]),S=n.useMemo((function(){return{active:h,selected:y,disabled:a}}),[h,y,a]);return T(t({},f,{id:b,role:"option",tabIndex:-1,className:te(l,S),"aria-disabled":!0===a||void 0,"aria-selected":!0===y||void 0,onClick:g,onFocus:C,onPointerMove:R,onPointerLeave:O}),S,"li")};var re=n.createContext(null);function oe(e){var t=n.useContext(re);if(null===t){var r=new Error("<"+e+" /> is missing a parent <Switch.Group /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,oe),r}return t}var ie=n.Fragment;function ue(e){var o,i=e.checked,u=e.onChange,a=e.className,c=r(e,["checked","onChange","className"]),l="headlessui-switch-"+s(),f=n.useContext(re),d=n.useCallback((function(){return u(!i)}),[u,i]),v=n.useCallback((function(e){e.preventDefault(),d()}),[d]),p=n.useCallback((function(e){e.key===I.Space&&(e.preventDefault(),d())}),[d]),m=n.useMemo((function(){return{checked:i}}),[i]);return T(t({},c,{id:l,ref:null===f?void 0:f.setSwitch,role:"switch",tabIndex:0,className:ae(a,m),"aria-checked":i,"aria-labelledby":null==f||null===(o=f.label)||void 0===o?void 0:o.id,onClick:v,onKeyUp:p}),m,"button")}function ae(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}ue.Group=function(e){var t=n.useState(null),r=t[0],o=t[1],i=n.useState(null),u=i[0],a=i[1],c=n.useMemo((function(){return{switch:r,label:u,setSwitch:o,setLabel:a}}),[r,o,u,a]);return n.createElement(re.Provider,{value:c},T(e,{},ie))},ue.Label=function e(r){var o=oe([ue.name,e.name].join(".")),i="headlessui-switch-label-"+s(),u=n.useCallback((function(){o.switch&&(o.switch.click(),o.switch.focus())}),[o.switch]);return T(t({},r,{ref:o.setLabel,id:i,onPointerUp:u}),{},"label")},e.Listbox=Z,e.Menu=j,e.Switch=ue,e.Transition=E,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((e=e||self).headlessui={},e.React)}(this,(function(e,n){"use strict";var t="default"in n?n.default:n;function r(){return(r=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function o(e,n){if(null==e)return{};var t,r,o={},u=Object.keys(e);for(r=0;r<u.length;r++)n.indexOf(t=u[r])>=0||(o[t]=e[t]);return o}function u(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function i(e,n){var t;if("undefined"==typeof Symbol||null==e[Symbol.iterator]){if(Array.isArray(e)||(t=function(e,n){if(e){if("string"==typeof e)return u(e,void 0);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?u(e,void 0):void 0}}(e))||n&&e&&"number"==typeof e.length){t&&(e=t);var r=0;return function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}return(t=e[Symbol.iterator]()).next.bind(t)}var a,c,l,s="undefined"!=typeof window?n.useLayoutEffect:n.useEffect,f={serverHandoffComplete:!1},d=0;function v(){return++d}function p(){var e=n.useState(f.serverHandoffComplete?v:null),t=e[0],r=e[1];return s((function(){null===t&&r(v())}),[t]),n.useEffect((function(){!1===f.serverHandoffComplete&&(f.serverHandoffComplete=!0)}),[]),null!=t?""+t:void 0}function m(){var e=n.useRef(!0);return n.useEffect((function(){e.current=!1}),[]),e.current}function b(e,n){if(e in n){for(var t=n[e],r=arguments.length,o=new Array(r>2?r-2:0),u=2;u<r;u++)o[u-2]=arguments[u];return"function"==typeof t?t.apply(void 0,o):t}var i=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(n).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(i,b),i}function y(e,n,t,u,i){if(void 0===i&&(i=!0),i)return h(e,n,t);var l=null!=u?u:a.None;if(l&a.Static){var s=e.static,f=void 0!==s&&s,d=o(e,["static"]);if(f)return h(d,n,t)}if(l&a.RenderStrategy){var v,p=e.unmount,m=void 0===p||p,y=o(e,["unmount"]);return b(m?c.Unmount:c.Hidden,((v={})[c.Unmount]=function(){return null},v[c.Hidden]=function(){return h(r({},y,{hidden:!0,style:{display:"none"}}),n,t)},v))}return h(e,n,t)}function h(e,t,r){var u,a=S(e,["unmount","static"]),c=a.as,l=void 0===c?r:c,s=a.children,f=a.refName,d=void 0===f?"ref":f,v=o(a,["as","children","refName"]),p=void 0!==e.ref?((u={})[d]=e.ref,u):{},m="function"==typeof s?s(t):s;if(l===n.Fragment&&Object.keys(v).length>0){if(Array.isArray(m)&&m.length>1){var b=new Error("You should only render 1 child");throw Error.captureStackTrace&&Error.captureStackTrace(b,h),b}if(!n.isValidElement(m)){var y=new Error('You should render an element as a child. Did you forget the as="..." prop?');throw Error.captureStackTrace&&Error.captureStackTrace(y,h),y}return n.cloneElement(m,Object.assign({},function(e,n,t){for(var r,o=Object.assign({},e),u=function(){var t,u=r.value;void 0!==e[u]&&void 0!==n[u]&&Object.assign(o,((t={})[u]=function(t){t.defaultPrevented||e[u](t),t.defaultPrevented||n[u](t)},t))},a=i(["onClick"]);!(r=a()).done;)u();return o}(function(e){var n=Object.assign({},e);for(var t in n)void 0===n[t]&&delete n[t];return n}(S(v,["ref"])),m.props),p))}return n.createElement(l,Object.assign({},S(v,["ref"]),l!==n.Fragment&&p),m)}function x(e){return n.forwardRef(e)}function S(e,n){void 0===n&&(n=[]);for(var t,r=Object.assign({},e),o=i(n);!(t=o()).done;){var u=t.value;u in r&&delete r[u]}return r}function g(){var e=[],n={requestAnimationFrame:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=requestAnimationFrame.apply(void 0,arguments);n.add((function(){return cancelAnimationFrame(e)}))})),nextFrame:function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];n.requestAnimationFrame((function(){n.requestAnimationFrame.apply(n,t)}))},setTimeout:function(e){function n(){return e.apply(this,arguments)}return n.toString=function(){return e.toString()},n}((function(){var e=setTimeout.apply(void 0,arguments);n.add((function(){return clearTimeout(e)}))})),add:function(n){e.push(n)},dispose:function(){for(var n,t=i(e.splice(0));!(n=t()).done;)(0,n.value)()}};return n}function I(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).add.apply(n,r)}function C(e){for(var n,t=arguments.length,r=new Array(t>1?t-1:0),o=1;o<t;o++)r[o-1]=arguments[o];e&&r.length>0&&(n=e.classList).remove.apply(n,r)}function O(e,n,t,r,o){var u=g(),i=void 0!==o?function(e){var n={called:!1};return function(){if(!n.called)return n.called=!0,e.apply(void 0,arguments)}}(o):function(){};return I.apply(void 0,[e].concat(n,t)),u.nextFrame((function(){C.apply(void 0,[e].concat(t)),I.apply(void 0,[e].concat(r)),u.add(function(e,n){var t=g();if(!e)return t.dispose;var r=getComputedStyle(e),o=[r.transitionDuration,r.transitionDelay].map((function(e){var n=e.split(",").filter(Boolean).map((function(e){return e.includes("ms")?parseFloat(e):1e3*parseFloat(e)})).sort((function(e,n){return n-e}))[0];return void 0===n?0:n})),u=o[0];return 0!==u?t.setTimeout((function(){n(l.Finished)}),u+o[1]):n(l.Finished),t.add((function(){return n(l.Cancelled)})),t.dispose}(e,(function(t){return C.apply(void 0,[e].concat(r,n)),i(t)})))})),u.add((function(){return C.apply(void 0,[e].concat(n,t,r))})),u.add((function(){return i(l.Cancelled)})),u.dispose}function R(e){return void 0===e&&(e=""),n.useMemo((function(){return e.split(" ").filter((function(e){return e.trim().length>1}))}),[e])}!function(e){e[e.None=0]="None",e[e.RenderStrategy=1]="RenderStrategy",e[e.Static=2]="Static"}(a||(a={})),function(e){e[e.Unmount=0]="Unmount",e[e.Hidden=1]="Hidden"}(c||(c={})),function(e){e.Finished="finished",e.Cancelled="cancelled"}(l||(l={}));var w,E=n.createContext(null);E.displayName="TransitionContext",function(e){e.Visible="visible",e.Hidden="hidden"}(w||(w={}));var k=n.createContext(null);function T(e){return"children"in e?T(e.children):e.current.filter((function(e){return e.state===w.Visible})).length>0}function L(e){var t=n.useRef(e),r=n.useRef([]),o=function(){var e=n.useRef(!0);return n.useEffect((function(){return function(){e.current=!1}}),[]),e}();n.useEffect((function(){t.current=e}),[e]);var u=n.useCallback((function(e,n){var u;void 0===n&&(n=c.Hidden);var i=r.current.findIndex((function(n){return n.id===e}));-1!==i&&(b(n,((u={})[c.Unmount]=function(){r.current.splice(i,1)},u[c.Hidden]=function(){r.current[i].state=w.Hidden},u)),!T(r)&&o.current&&(null==t.current||t.current()))}),[t,o,r]),i=n.useCallback((function(e){var n=r.current.find((function(n){return n.id===e}));return n?n.state!==w.Visible&&(n.state=w.Visible):r.current.push({id:e,state:w.Visible}),function(){return u(e,c.Unmount)}}),[r,u]);return n.useMemo((function(){return{children:r,register:i,unregister:u}}),[i,u,r])}function D(){}k.displayName="NestingContext";var F=["beforeEnter","afterEnter","beforeLeave","afterLeave"];function M(e){return F.reduce((function(n,t){return n[t]=e[t]||D,n}),{})}var A,N,P,G,j,H=a.RenderStrategy;function U(e){var u=e.beforeEnter,i=e.afterEnter,a=e.beforeLeave,f=e.afterLeave,d=e.enter,v=e.enterFrom,h=e.enterTo,x=e.leave,S=e.leaveFrom,g=e.leaveTo,I=o(e,["beforeEnter","afterEnter","beforeLeave","afterLeave","enter","enterFrom","enterTo","leave","leaveFrom","leaveTo"]),C=n.useRef(null),D=n.useState(w.Visible),F=D[0],A=D[1],N=I.unmount?c.Unmount:c.Hidden,P=function(){var e=n.useContext(E);if(null===e)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return e}(),G=P.show,j=P.appear,U=function(){var e=n.useContext(k);if(null===e)throw new Error("A <Transition.Child /> is used but it is missing a parent <Transition />.");return e}(),V=U.register,Q=U.unregister,B=m(),K=p(),_=n.useRef(!1),q=L((function(){_.current||(A(w.Hidden),Q(K),Z.current.afterLeave())}));s((function(){if(K)return V(K)}),[V,K]),s((function(){var e;N===c.Hidden&&K&&(G&&F!==w.Visible?A(w.Visible):b(F,((e={})[w.Hidden]=function(){return Q(K)},e[w.Visible]=function(){return V(K)},e)))}),[F,K,V,Q,G,N]);var W=R(d),Y=R(v),J=R(h),$=R(x),z=R(S),X=R(g),Z=function(e){var t=n.useRef(M(e));return n.useEffect((function(){t.current=M(e)}),[e]),t}({beforeEnter:u,afterEnter:i,beforeLeave:a,afterLeave:f});n.useEffect((function(){if(F===w.Visible&&null===C.current)throw new Error("Did you forget to passthrough the `ref` to the actual DOM node?")}),[C,F]);var ee=B&&!j;return s((function(){var e=C.current;if(e&&!ee)return _.current=!0,G&&Z.current.beforeEnter(),G||Z.current.beforeLeave(),G?O(e,W,Y,J,(function(e){_.current=!1,e===l.Finished&&Z.current.afterEnter()})):O(e,$,z,X,(function(e){_.current=!1,e===l.Finished&&(T(q)||(A(w.Hidden),Q(K),Z.current.afterLeave()))}))}),[Z,K,_,Q,q,C,ee,G,W,Y,J,$,z,X]),t.createElement(k.Provider,{value:q},y(r({},I,{ref:C}),{},"div",H,F===w.Visible))}function V(e){var u=e.show,i=e.appear,a=void 0!==i&&i,c=e.unmount,l=o(e,["show","appear","unmount"]);if(![!0,!1].includes(u))throw new Error("A <Transition /> is used but it is missing a `show={true | false}` prop.");var s=n.useState(u?w.Visible:w.Hidden),f=s[0],d=s[1],v=L((function(){d(w.Hidden)})),p=m(),b=n.useMemo((function(){return{show:u,appear:a||!p}}),[u,a,p]);n.useEffect((function(){u?d(w.Visible):T(v)||d(w.Hidden)}),[u,v]);var h={unmount:c};return t.createElement(k.Provider,{value:v},t.createElement(E.Provider,{value:b},y(r({},h,{as:n.Fragment,children:t.createElement(U,Object.assign({},h,l))}),{},n.Fragment,H,f===w.Visible)))}function Q(){var e=n.useState(g)[0];return n.useEffect((function(){return function(){return e.dispose()}}),[e]),e}function B(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return n.useCallback((function(e){t.forEach((function(n){if(null!==n)return"function"==typeof n?n(e):void(n.current=e)}))}),[t])}function K(e,n){var t=n.resolveItems();if(t.length<=0)return null;var r=n.resolveActiveIndex(),o=null!=r?r:-1,u=function(){switch(e.focus){case N.First:return t.findIndex((function(e){return!n.resolveDisabled(e)}));case N.Previous:var r=t.slice().reverse().findIndex((function(e,t,r){return!(-1!==o&&r.length-t-1>=o||n.resolveDisabled(e))}));return-1===r?r:t.length-1-r;case N.Next:return t.findIndex((function(e,t){return!(t<=o||n.resolveDisabled(e))}));case N.Last:var u=t.slice().reverse().findIndex((function(e){return!n.resolveDisabled(e)}));return-1===u?u:t.length-1-u;case N.Specific:return t.findIndex((function(t){return n.resolveId(t)===e.id}));case N.Nothing:return null;default:!function(e){throw new Error("Unexpected object: "+e)}(e)}}();return-1===u?r:u}function _(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}function q(e){for(var n,t,r=e.parentElement,o=null;r&&!(r instanceof HTMLFieldSetElement);)r instanceof HTMLLegendElement&&(o=r),r=r.parentElement;var u=null!=(n=""===(null==(t=r)?void 0:t.getAttribute("disabled")))&&n;return(!u||!function(e){if(!e)return!1;for(var n=e.previousElementSibling;null!==n;){if(n instanceof HTMLLegendElement)return!1;n=n.previousElementSibling}return!0}(o))&&u}V.Child=U,function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(A||(A={})),function(e){e[e.First=0]="First",e[e.Previous=1]="Previous",e[e.Next=2]="Next",e[e.Last=3]="Last",e[e.Specific=4]="Specific",e[e.Nothing=5]="Nothing"}(N||(N={})),function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(G||(G={})),function(e){e[e.OpenMenu=0]="OpenMenu",e[e.CloseMenu=1]="CloseMenu",e[e.GoToItem=2]="GoToItem",e[e.Search=3]="Search",e[e.ClearSearch=4]="ClearSearch",e[e.RegisterItem=5]="RegisterItem",e[e.UnregisterItem=6]="UnregisterItem"}(j||(j={}));var W=((P={})[j.CloseMenu]=function(e){return r({},e,{activeItemIndex:null,menuState:G.Closed})},P[j.OpenMenu]=function(e){return r({},e,{menuState:G.Open})},P[j.GoToItem]=function(e,n){var t=K(n,{resolveItems:function(){return e.items},resolveActiveIndex:function(){return e.activeItemIndex},resolveId:function(e){return e.id},resolveDisabled:function(e){return e.dataRef.current.disabled}});return""===e.searchQuery&&e.activeItemIndex===t?e:r({},e,{searchQuery:"",activeItemIndex:t})},P[j.Search]=function(e,n){var t=e.searchQuery+n.value,o=e.items.findIndex((function(e){var n;return(null==(n=e.dataRef.current.textValue)?void 0:n.startsWith(t))&&!e.dataRef.current.disabled}));return r({},e,-1===o||o===e.activeItemIndex?{searchQuery:t}:{searchQuery:t,activeItemIndex:o})},P[j.ClearSearch]=function(e){return r({},e,{searchQuery:""})},P[j.RegisterItem]=function(e,n){return r({},e,{items:[].concat(e.items,[{id:n.id,dataRef:n.dataRef}])})},P[j.UnregisterItem]=function(e,n){var t=e.items.slice(),o=null!==e.activeItemIndex?t[e.activeItemIndex]:null,u=t.findIndex((function(e){return e.id===n.id}));return-1!==u&&t.splice(u,1),r({},e,{items:t,activeItemIndex:u===e.activeItemIndex||null===o?null:t.indexOf(o)})},P),Y=n.createContext(null);function J(e){var t=n.useContext(Y);if(null===t){var r=new Error("<"+e+" /> is missing a parent <"+X.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,J),r}return t}function $(e,n){return b(n.type,W,e,n)}Y.displayName="MenuContext";var z=n.Fragment;function X(e){var r=n.useReducer($,{menuState:G.Closed,buttonRef:n.createRef(),itemsRef:n.createRef(),items:[],searchQuery:"",activeItemIndex:null}),o=r[0],u=o.menuState,i=o.itemsRef,a=o.buttonRef,c=r[1];n.useEffect((function(){function e(e){var n,t,r,o=e.target,l=document.activeElement;u===G.Open&&((null==(n=a.current)?void 0:n.contains(o))||((null==(t=i.current)?void 0:t.contains(o))||c({type:j.CloseMenu}),l!==document.body&&(null==l?void 0:l.contains(o))||e.defaultPrevented||null==(r=a.current)||r.focus({preventScroll:!0})))}return window.addEventListener("mousedown",e),function(){return window.removeEventListener("mousedown",e)}}),[u,i,a,c]);var l=n.useMemo((function(){return{open:u===G.Open}}),[u]);return t.createElement(Y.Provider,{value:r},y(e,l,z))}var Z,ee,ne,te=x((function e(t,o){var u,i=J([X.name,e.name].join(".")),a=i[0],c=i[1],l=B(a.buttonRef,o),s="headlessui-menu-button-"+p(),f=Q(),d=n.useCallback((function(e){switch(e.key){case A.Space:case A.Enter:case A.ArrowDown:e.preventDefault(),c({type:j.OpenMenu}),f.nextFrame((function(){var e;null==(e=a.itemsRef.current)||e.focus({preventScroll:!0}),c({type:j.GoToItem,focus:N.First})}));break;case A.ArrowUp:e.preventDefault(),c({type:j.OpenMenu}),f.nextFrame((function(){var e;null==(e=a.itemsRef.current)||e.focus({preventScroll:!0}),c({type:j.GoToItem,focus:N.Last})}))}}),[c,a,f]),v=n.useCallback((function(e){if(q(e.currentTarget))return e.preventDefault();t.disabled||(a.menuState===G.Open?(c({type:j.CloseMenu}),f.nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}))):(e.preventDefault(),c({type:j.OpenMenu}),f.nextFrame((function(){var e;return null==(e=a.itemsRef.current)?void 0:e.focus({preventScroll:!0})}))))}),[c,f,a,t.disabled]),m=n.useMemo((function(){return{open:a.menuState===G.Open}}),[a]);return y(r({},t,{ref:l,id:s,type:"button","aria-haspopup":!0,"aria-controls":null==(u=a.itemsRef.current)?void 0:u.id,"aria-expanded":a.menuState===G.Open||void 0,onKeyDown:d,onClick:v}),m,"button")})),re=a.RenderStrategy|a.Static,oe=x((function e(t,o){var u,i,a=J([X.name,e.name].join(".")),c=a[0],l=a[1],f=B(c.itemsRef,o),d="headlessui-menu-items-"+p(),v=Q();s((function(){var e=c.itemsRef.current;if(e&&c.menuState===G.Open)for(var n=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT,{acceptNode:function(e){return"menuitem"===e.getAttribute("role")?NodeFilter.FILTER_REJECT:e.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT}});n.nextNode();)n.currentNode.setAttribute("role","none")}));var m=n.useCallback((function(e){switch(v.dispose(),e.key){case A.Space:if(""!==c.searchQuery)return e.preventDefault(),l({type:j.Search,value:e.key});case A.Enter:var n;e.preventDefault(),l({type:j.CloseMenu}),null!==c.activeItemIndex&&(null==(n=document.getElementById(c.items[c.activeItemIndex].id))||n.click()),g().nextFrame((function(){var e;return null==(e=c.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));break;case A.ArrowDown:return e.preventDefault(),l({type:j.GoToItem,focus:N.Next});case A.ArrowUp:return e.preventDefault(),l({type:j.GoToItem,focus:N.Previous});case A.Home:case A.PageUp:return e.preventDefault(),l({type:j.GoToItem,focus:N.First});case A.End:case A.PageDown:return e.preventDefault(),l({type:j.GoToItem,focus:N.Last});case A.Escape:e.preventDefault(),l({type:j.CloseMenu}),g().nextFrame((function(){var e;return null==(e=c.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));break;case A.Tab:return e.preventDefault();default:1===e.key.length&&(l({type:j.Search,value:e.key}),v.setTimeout((function(){return l({type:j.ClearSearch})}),350))}}),[l,v,c]),b=n.useMemo((function(){return{open:c.menuState===G.Open}}),[c]);return y(r({},t,{"aria-activedescendant":null===c.activeItemIndex||null==(u=c.items[c.activeItemIndex])?void 0:u.id,"aria-labelledby":null==(i=c.buttonRef.current)?void 0:i.id,id:d,onKeyDown:m,role:"menu",tabIndex:0,ref:f}),b,"div",re,c.menuState===G.Open)})),ue=n.Fragment;function ie(e,t){var r=n.useState(e),o=r[0],u=r[1],i=n.useRef(e);return s((function(){i.current=e}),[e]),s((function(){return u(i.current)}),[i,u].concat(t)),o}X.Button=te,X.Items=oe,X.Item=function e(t){var u=t.disabled,i=void 0!==u&&u,a=t.className,c=t.onClick,l=o(t,["disabled","className","onClick"]),f=J([X.name,e.name].join(".")),d=f[0],v=f[1],m="headlessui-menu-item-"+p(),b=null!==d.activeItemIndex&&d.items[d.activeItemIndex].id===m;s((function(){if(d.menuState===G.Open&&b){var e=g();return e.nextFrame((function(){var e;return null==(e=document.getElementById(m))||null==e.scrollIntoView?void 0:e.scrollIntoView({block:"nearest"})})),e.dispose}}),[m,b,d.menuState]);var h=n.useRef({disabled:i});s((function(){h.current.disabled=i}),[h,i]),s((function(){var e,n;h.current.textValue=null==(e=document.getElementById(m))||null==(n=e.textContent)?void 0:n.toLowerCase()}),[h,m]),s((function(){return v({type:j.RegisterItem,id:m,dataRef:h}),function(){return v({type:j.UnregisterItem,id:m})}}),[h,m]);var x=n.useCallback((function(e){return i?e.preventDefault():(v({type:j.CloseMenu}),g().nextFrame((function(){var e;return null==(e=d.buttonRef.current)?void 0:e.focus({preventScroll:!0})})),c?c(e):void 0)}),[v,d.buttonRef,i,c]),S=n.useCallback((function(){if(i)return v({type:j.GoToItem,focus:N.Nothing});v({type:j.GoToItem,focus:N.Specific,id:m})}),[i,m,v]),I=n.useCallback((function(){i||b||v({type:j.GoToItem,focus:N.Specific,id:m})}),[i,b,m,v]),C=n.useCallback((function(){i||b&&v({type:j.GoToItem,focus:N.Nothing})}),[i,b,v]),O=n.useMemo((function(){return{active:b,disabled:i}}),[b,i]);return y(r({},l,{id:m,role:"menuitem",tabIndex:-1,className:_(a,O),"aria-disabled":!0===i||void 0,onClick:x,onFocus:S,onPointerMove:I,onMouseMove:I,onPointerLeave:C,onMouseLeave:C}),O,ue)},function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(ee||(ee={})),function(e){e[e.OpenListbox=0]="OpenListbox",e[e.CloseListbox=1]="CloseListbox",e[e.SetDisabled=2]="SetDisabled",e[e.GoToOption=3]="GoToOption",e[e.Search=4]="Search",e[e.ClearSearch=5]="ClearSearch",e[e.RegisterOption=6]="RegisterOption",e[e.UnregisterOption=7]="UnregisterOption"}(ne||(ne={}));var ae=((Z={})[ne.CloseListbox]=function(e){return e.disabled||e.listboxState===ee.Closed?e:r({},e,{activeOptionIndex:null,listboxState:ee.Closed})},Z[ne.OpenListbox]=function(e){return e.disabled||e.listboxState===ee.Open?e:r({},e,{listboxState:ee.Open})},Z[ne.SetDisabled]=function(e,n){return e.disabled===n.disabled?e:r({},e,{disabled:n.disabled})},Z[ne.GoToOption]=function(e,n){if(e.disabled)return e;if(e.listboxState===ee.Closed)return e;var t=K(n,{resolveItems:function(){return e.options},resolveActiveIndex:function(){return e.activeOptionIndex},resolveId:function(e){return e.id},resolveDisabled:function(e){return e.dataRef.current.disabled}});return""===e.searchQuery&&e.activeOptionIndex===t?e:r({},e,{searchQuery:"",activeOptionIndex:t})},Z[ne.Search]=function(e,n){if(e.disabled)return e;if(e.listboxState===ee.Closed)return e;var t=e.searchQuery+n.value,o=e.options.findIndex((function(e){var n;return!e.dataRef.current.disabled&&(null==(n=e.dataRef.current.textValue)?void 0:n.startsWith(t))}));return r({},e,-1===o||o===e.activeOptionIndex?{searchQuery:t}:{searchQuery:t,activeOptionIndex:o})},Z[ne.ClearSearch]=function(e){return e.disabled||e.listboxState===ee.Closed||""===e.searchQuery?e:r({},e,{searchQuery:""})},Z[ne.RegisterOption]=function(e,n){return r({},e,{options:[].concat(e.options,[{id:n.id,dataRef:n.dataRef}])})},Z[ne.UnregisterOption]=function(e,n){var t=e.options.slice(),o=null!==e.activeOptionIndex?t[e.activeOptionIndex]:null,u=t.findIndex((function(e){return e.id===n.id}));return-1!==u&&t.splice(u,1),r({},e,{options:t,activeOptionIndex:u===e.activeOptionIndex||null===o?null:t.indexOf(o)})},Z),ce=n.createContext(null);function le(e){var t=n.useContext(ce);if(null===t){var r=new Error("<"+e+" /> is missing a parent <"+de.name+" /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,le),r}return t}function se(e,n){return b(n.type,ae,e,n)}ce.displayName="ListboxContext";var fe=n.Fragment;function de(e){var r=e.value,u=e.onChange,i=e.disabled,a=void 0!==i&&i,c=o(e,["value","onChange","disabled"]),l=Q(),f=n.useReducer(se,{listboxState:ee.Closed,propsRef:{current:{value:r,onChange:u}},labelRef:n.createRef(),buttonRef:n.createRef(),optionsRef:n.createRef(),disabled:a,options:[],searchQuery:"",activeOptionIndex:null}),d=f[0],v=d.listboxState,p=d.propsRef,m=d.optionsRef,b=d.buttonRef,h=f[1];s((function(){p.current.value=r}),[r,p]),s((function(){p.current.onChange=u}),[u,p]),s((function(){return h({type:ne.SetDisabled,disabled:a})}),[a]),n.useEffect((function(){function e(e){var n,t,r,o=e.target,u=document.activeElement;v===ee.Open&&((null==(n=b.current)?void 0:n.contains(o))||((null==(t=m.current)?void 0:t.contains(o))||h({type:ne.CloseListbox}),u!==document.body&&(null==u?void 0:u.contains(o))||e.defaultPrevented||null==(r=b.current)||r.focus({preventScroll:!0})))}return window.addEventListener("mousedown",e),function(){return window.removeEventListener("mousedown",e)}}),[v,m,b,l,h]);var x=n.useMemo((function(){return{open:v===ee.Open,disabled:a}}),[v,a]);return t.createElement(ce.Provider,{value:f},y(c,x,fe))}var ve=x((function e(t,o){var u,i=le([de.name,e.name].join(".")),a=i[0],c=i[1],l=B(a.buttonRef,o),s="headlessui-listbox-button-"+p(),f=Q(),d=n.useCallback((function(e){switch(e.key){case A.Space:case A.Enter:case A.ArrowDown:e.preventDefault(),c({type:ne.OpenListbox}),f.nextFrame((function(){var e;null==(e=a.optionsRef.current)||e.focus({preventScroll:!0}),a.propsRef.current.value||c({type:ne.GoToOption,focus:N.First})}));break;case A.ArrowUp:e.preventDefault(),c({type:ne.OpenListbox}),f.nextFrame((function(){var e;null==(e=a.optionsRef.current)||e.focus({preventScroll:!0}),a.propsRef.current.value||c({type:ne.GoToOption,focus:N.Last})}))}}),[c,a,f]),v=n.useCallback((function(e){if(q(e.currentTarget))return e.preventDefault();a.listboxState===ee.Open?(c({type:ne.CloseListbox}),f.nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}))):(e.preventDefault(),c({type:ne.OpenListbox}),f.nextFrame((function(){var e;return null==(e=a.optionsRef.current)?void 0:e.focus({preventScroll:!0})})))}),[c,f,a]),m=ie((function(){if(a.labelRef.current)return[a.labelRef.current.id,s].join(" ")}),[a.labelRef.current,s]),b=n.useMemo((function(){return{open:a.listboxState===ee.Open,disabled:a.disabled}}),[a]);return y(r({},t,{ref:l,id:s,type:"button","aria-haspopup":!0,"aria-controls":null==(u=a.optionsRef.current)?void 0:u.id,"aria-expanded":a.listboxState===ee.Open||void 0,"aria-labelledby":m,disabled:a.disabled,onKeyDown:d,onClick:v}),b,"button")})),pe=a.RenderStrategy|a.Static,me=x((function e(t,o){var u,i=le([de.name,e.name].join(".")),a=i[0],c=i[1],l=B(a.optionsRef,o),s="headlessui-listbox-options-"+p(),f=Q(),d=Q(),v=n.useCallback((function(e){switch(d.dispose(),e.key){case A.Space:if(""!==a.searchQuery)return e.preventDefault(),c({type:ne.Search,value:e.key});case A.Enter:e.preventDefault(),c({type:ne.CloseListbox}),null!==a.activeOptionIndex&&a.propsRef.current.onChange(a.options[a.activeOptionIndex].dataRef.current.value),g().nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));break;case A.ArrowDown:return e.preventDefault(),c({type:ne.GoToOption,focus:N.Next});case A.ArrowUp:return e.preventDefault(),c({type:ne.GoToOption,focus:N.Previous});case A.Home:case A.PageUp:return e.preventDefault(),c({type:ne.GoToOption,focus:N.First});case A.End:case A.PageDown:return e.preventDefault(),c({type:ne.GoToOption,focus:N.Last});case A.Escape:return e.preventDefault(),c({type:ne.CloseListbox}),f.nextFrame((function(){var e;return null==(e=a.buttonRef.current)?void 0:e.focus({preventScroll:!0})}));case A.Tab:return e.preventDefault();default:1===e.key.length&&(c({type:ne.Search,value:e.key}),d.setTimeout((function(){return c({type:ne.ClearSearch})}),350))}}),[f,c,d,a]),m=ie((function(){var e,n,t;return null!=(e=null==(n=a.labelRef.current)?void 0:n.id)?e:null==(t=a.buttonRef.current)?void 0:t.id}),[a.labelRef.current,a.buttonRef.current]),b=n.useMemo((function(){return{open:a.listboxState===ee.Open}}),[a]);return y(r({},t,{"aria-activedescendant":null===a.activeOptionIndex||null==(u=a.options[a.activeOptionIndex])?void 0:u.id,"aria-labelledby":m,id:s,onKeyDown:v,role:"listbox",tabIndex:0,ref:l}),b,"ul",pe,a.listboxState===ee.Open)}));de.Button=ve,de.Label=function e(t){var o=le([de.name,e.name].join("."))[0],u="headlessui-listbox-label-"+p(),i=n.useCallback((function(){var e;return null==(e=o.buttonRef.current)?void 0:e.focus({preventScroll:!0})}),[o.buttonRef]),a=n.useMemo((function(){return{open:o.listboxState===ee.Open,disabled:o.disabled}}),[o]);return y(r({},t,{ref:o.labelRef,id:u,onClick:i}),a,"label")},de.Options=me,de.Option=function e(t){var u=t.disabled,i=void 0!==u&&u,a=t.value,c=t.className,l=o(t,["disabled","value","className"]),f=le([de.name,e.name].join(".")),d=f[0],v=f[1],m="headlessui-listbox-option-"+p(),b=null!==d.activeOptionIndex&&d.options[d.activeOptionIndex].id===m,h=d.propsRef.current.value===a,x=n.useRef({disabled:i,value:a});s((function(){x.current.disabled=i}),[x,i]),s((function(){x.current.value=a}),[x,a]),s((function(){var e,n;x.current.textValue=null==(e=document.getElementById(m))||null==(n=e.textContent)?void 0:n.toLowerCase()}),[x,m]);var S=n.useCallback((function(){return d.propsRef.current.onChange(a)}),[d.propsRef,a]);s((function(){return v({type:ne.RegisterOption,id:m,dataRef:x}),function(){return v({type:ne.UnregisterOption,id:m})}}),[x,m]),s((function(){var e;d.listboxState===ee.Open&&h&&(v({type:ne.GoToOption,focus:N.Specific,id:m}),null==(e=document.getElementById(m))||null==e.focus||e.focus())}),[d.listboxState]),s((function(){if(d.listboxState===ee.Open&&b){var e=g();return e.nextFrame((function(){var e;return null==(e=document.getElementById(m))||null==e.scrollIntoView?void 0:e.scrollIntoView({block:"nearest"})})),e.dispose}}),[m,b,d.listboxState]);var I=n.useCallback((function(e){if(i)return e.preventDefault();S(),v({type:ne.CloseListbox}),g().nextFrame((function(){var e;return null==(e=d.buttonRef.current)?void 0:e.focus({preventScroll:!0})}))}),[v,d.buttonRef,i,S]),C=n.useCallback((function(){if(i)return v({type:ne.GoToOption,focus:N.Nothing});v({type:ne.GoToOption,focus:N.Specific,id:m})}),[i,m,v]),O=n.useCallback((function(){i||b||v({type:ne.GoToOption,focus:N.Specific,id:m})}),[i,b,m,v]),R=n.useCallback((function(){i||b&&v({type:ne.GoToOption,focus:N.Nothing})}),[i,b,v]),w=n.useMemo((function(){return{active:b,selected:h,disabled:i}}),[b,h,i]);return y(r({},l,{id:m,role:"option",tabIndex:-1,className:_(c,w),"aria-disabled":!0===i||void 0,"aria-selected":!0===h||void 0,onClick:I,onFocus:C,onPointerMove:O,onMouseMove:O,onPointerLeave:R,onMouseLeave:R}),w,"li")};var be=n.createContext(null);function ye(e){var t=n.useContext(be);if(null===t){var r=new Error("<"+e+" /> is missing a parent <Switch.Group /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,ye),r}return t}be.displayName="GroupContext";var he=n.Fragment;function xe(e){var t,u=e.checked,i=e.onChange,a=e.className,c=o(e,["checked","onChange","className"]),l="headlessui-switch-"+p(),s=n.useContext(be),f=n.useCallback((function(){return i(!u)}),[i,u]),d=n.useCallback((function(e){if(q(e.currentTarget))return e.preventDefault();e.preventDefault(),f()}),[f]),v=n.useCallback((function(e){e.key!==A.Tab&&e.preventDefault(),e.key===A.Space&&f()}),[f]),m=n.useCallback((function(e){return e.preventDefault()}),[]),b=n.useMemo((function(){return{checked:u}}),[u]),h={id:l,ref:null===s?void 0:s.setSwitch,role:"switch",tabIndex:0,className:_(a,b),"aria-checked":u,"aria-labelledby":null==s||null==(t=s.label)?void 0:t.id,onClick:d,onKeyUp:v,onKeyPress:m};return"button"===c.as&&Object.assign(h,{type:"button"}),y(r({},c,h),b,"button")}xe.Group=function(e){var r=n.useState(null),o=r[0],u=r[1],i=n.useState(null),a=i[0],c=i[1],l=n.useMemo((function(){return{switch:o,label:a,setSwitch:u,setLabel:c}}),[o,u,a,c]);return t.createElement(be.Provider,{value:l},y(e,{},he))},xe.Label=function e(t){var o=ye([xe.name,e.name].join(".")),u="headlessui-switch-label-"+p(),i=n.useCallback((function(){o.switch&&(o.switch.click(),o.switch.focus({preventScroll:!0}))}),[o.switch]);return y(r({},t,{ref:o.setLabel,id:u,onClick:i}),{},"label")},e.Listbox=de,e.Menu=X,e.Switch=xe,e.Transition=V,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=headlessui.umd.production.min.js.map

2

dist/hooks/use-computed.d.ts

@@ -1,2 +0,2 @@

import * as React from 'react';
/// <reference types="react" />
export declare function useComputed<T>(cb: () => T, dependencies: React.DependencyList): T;

4

dist/hooks/use-is-mounted.d.ts

@@ -1,2 +0,2 @@

import * as React from 'react';
export declare function useIsMounted(): React.MutableRefObject<boolean>;
/// <reference types="react" />
export declare function useIsMounted(): import("react").MutableRefObject<boolean>;

4

dist/hooks/use-iso-morphic-effect.d.ts

@@ -1,2 +0,2 @@

import * as React from 'react';
export declare const useIsoMorphicEffect: typeof React.useLayoutEffect;
import { useLayoutEffect } from 'react';
export declare const useIsoMorphicEffect: typeof useLayoutEffect;

2

dist/hooks/use-sync-refs.d.ts

@@ -1,2 +0,2 @@

import * as React from 'react';
/// <reference types="react" />
export declare function useSyncRefs<TType>(...refs: (React.MutableRefObject<TType> | ((instance: TType) => void) | null)[]): (value: TType) => void;

18

dist/test-utils/accessibility-assertions.d.ts

@@ -7,4 +7,8 @@ export declare function getMenuButton(): HTMLElement | null;

export declare enum MenuState {
Open = 0,
Closed = 1
/** The menu is visible to the user. */
Visible = 0,
/** The menu is **not** visible to the user. It's still in the DOM, but it is hidden. */
InvisibleHidden = 1,
/** The menu is **not** visible to the user. It's not in the DOM, it is unmounted. */
InvisibleUnmounted = 2
}

@@ -35,4 +39,8 @@ export declare function assertMenuButton(options: {

export declare enum ListboxState {
Open = 0,
Closed = 1
/** The listbox is visible to the user. */
Visible = 0,
/** The listbox is **not** visible to the user. It's still in the DOM, but it is hidden. */
InvisibleHidden = 1,
/** The listbox is **not** visible to the user. It's not in the DOM, it is unmounted. */
InvisibleUnmounted = 2
}

@@ -79,1 +87,3 @@ export declare function assertListbox(options: {

export declare function assertActiveElement(element: HTMLElement | null): void;
export declare function assertHidden(element: HTMLElement | null): void;
export declare function assertVisible(element: HTMLElement | null): void;

12

dist/test-utils/interactions.d.ts

@@ -1,2 +0,2 @@

export declare const Keys: Record<string, Partial<KeyboardEvent>>;
export declare let Keys: Record<string, Partial<KeyboardEvent>>;
export declare function shift(event: Partial<KeyboardEvent>): {

@@ -47,5 +47,9 @@ shiftKey: boolean;

export declare function word(input: string): Partial<KeyboardEvent>[];
export declare function type(events: Partial<KeyboardEvent>[]): Promise<void>;
export declare function press(event: Partial<KeyboardEvent>): Promise<void>;
export declare function click(element: Document | Element | Window | Node | null): Promise<void>;
export declare function type(events: Partial<KeyboardEvent>[], element?: Element | null): Promise<void>;
export declare function press(event: Partial<KeyboardEvent>, element?: Element | null): Promise<void>;
export declare enum MouseButton {
Left = 0,
Right = 2
}
export declare function click(element: Document | Element | Window | Node | null, button?: MouseButton): Promise<void>;
export declare function focus(element: Document | Element | Window | Node | null): Promise<void>;

@@ -52,0 +56,0 @@ export declare function mouseEnter(element: Document | Element | Window | null): Promise<void>;

15

dist/types.d.ts
/// <reference types="react" />
declare const __: unique symbol;
export declare type __ = typeof __;
export declare type Expand<T> = T extends infer O ? {
[K in keyof O]: O[K];
} : never;
export declare type PropsOf<TTag = any> = TTag extends React.ElementType ? React.ComponentProps<TTag> : never;
export declare type Props<TTag, TSlot = {}, TOmitableProps extends keyof any = ''> = {
export declare type Props<TTag, TSlot = {}, TOmitableProps extends keyof any = __> = {
as?: TTag;
children?: React.ReactNode | ((bag: TSlot) => React.ReactElement);
} & Omit<PropsOf<TTag>, TOmitableProps>;
refName?: string;
} & (TOmitableProps extends __ ? PropsOf<TTag> : Omit<PropsOf<TTag>, TOmitableProps>);
declare type Without<T, U> = {
[P in Exclude<keyof T, keyof U>]?: never;
};
export declare type XOR<T, U> = T | U extends __ ? never : T extends __ ? U : U extends __ ? T : T | U extends object ? (Without<T, U> & U) | (Without<U, T> & T) : T | U;
export {};

36

dist/utils/render.d.ts

@@ -1,4 +0,33 @@

import * as React from 'react';
import { Props } from '../types';
export declare function render<TTag extends React.ElementType, TBag>(props: Props<TTag, TBag, any>, bag: TBag, tag: React.ElementType): React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
import { ElementType, ReactElement } from 'react';
import { Props, XOR, __, Expand } from '../types';
export declare enum Features {
/** No features at all */
None = 0,
/**
* When used, this will allow us to use one of the render strategies.
*
* **The render strategies are:**
* - **Unmount** _(Will unmount the component.)_
* - **Hidden** _(Will hide the component using the [hidden] attribute.)_
*/
RenderStrategy = 1,
/**
* When used, this will allow the user of our component to be in control. This can be used when
* you want to transition based on some state.
*/
Static = 2
}
export declare enum RenderStrategy {
Unmount = 0,
Hidden = 1
}
declare type PropsForFeature<TPassedInFeatures extends Features, TForFeature extends Features, TProps> = {
[P in TPassedInFeatures]: P extends TForFeature ? TProps : __;
}[TPassedInFeatures];
export declare type PropsForFeatures<T extends Features> = XOR<PropsForFeature<T, Features.Static, {
static?: boolean;
}>, PropsForFeature<T, Features.RenderStrategy, {
unmount?: boolean;
}>>;
export declare function render<TFeature extends Features, TTag extends ElementType, TBag>(props: Expand<Props<TTag, TBag, any> & PropsForFeatures<TFeature>>, propsBag: TBag, defaultTag: ElementType, features?: TFeature, visible?: boolean): ReactElement<any, string | ((props: any) => ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | null;
/**

@@ -9,1 +38,2 @@ * This is a hack, but basically we want to keep the full 'API' of the component, but we do want to

export declare function forwardRefWithAs<T>(component: T): T;
export {};

18

package.json
{
"name": "@headlessui/react",
"version": "0.2.0",
"version": "0.3.0",
"main": "dist/index.js",

@@ -34,12 +34,12 @@ "typings": "dist/index.d.ts",

"devDependencies": {
"@types/react": "^16.9.50",
"@types/react-dom": "^16.9.8",
"@popperjs/core": "^2.5.3",
"@testing-library/react": "^11.0.4",
"framer-motion": "^2.7.7",
"next": "9.5.3",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"@types/react": "^16.14.2",
"@types/react-dom": "^16.9.10",
"@popperjs/core": "^2.6.0",
"@testing-library/react": "^11.2.3",
"framer-motion": "^2.9.5",
"next": "10.0.5",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"snapshot-diff": "^0.8.1"
}
}

414

README.md

@@ -32,3 +32,3 @@ <h3 align="center">

- [Menu Button (Dropdown)](#menu-button-dropdown)
- [Listbox (Select)](#listbox)
- [Listbox (Select)](#listbox-select)
- [Switch (Toggle)](#switch-toggle)

@@ -148,27 +148,2 @@

If you'd prefer not to render an additional element at all, you can pass your children as a function instead which will receive a `ref` that you need to attach to your root node:
```tsx
import { Transition } from '@headlessui/react'
import { useState } from 'react'
function MyComponent() {
const [isOpen, setIsOpen] = useState(false)
return (
<>
<button onClick={() => setIsOpen(!isOpen)}>Toggle</button>
<Transition
show={isOpen}
// ...
>
{ref => <div ref={ref}>{/* Your content goes here*/}</div>}
</Transition>
</>
)
}
```
Be sure to attach the `ref` or your transitions will not work correctly.
### Animating transitions

@@ -317,19 +292,22 @@

| Prop | Type | Description |
| ----------- | ------------------------------------- | ------------------------------------------------------------------------------------- |
| `show` | Boolean | Whether the children should be shown or hidden. |
| `as` | String Component _(Default: `'div'`)_ | The element or component to render in place of the `Transition` itself. |
| `appear` | Boolean _(Default: `false`)_ | Whether the transition should run on initial mount. |
| `enter` | String _(Default: '')_ | Classes to add to the transitioning element during the entire enter phase. |
| `enterFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the enter phase starts. |
| `enterTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the enter phase starts. |
| `leave` | String _(Default: '')_ | Classes to add to the transitioning element during the entire leave phase. |
| `leaveFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the leave phase starts. |
| `leaveTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the leave phase starts. |
| Prop | Type | Description |
| ------------- | ------------------------------------- | ------------------------------------------------------------------------------------- |
| `show` | Boolean | Whether the children should be shown or hidden. |
| `as` | String Component _(Default: `'div'`)_ | The element or component to render in place of the `Transition` itself. |
| `appear` | Boolean _(Default: `false`)_ | Whether the transition should run on initial mount. |
| `unmount` | Boolean _(Default: `true`)_ | Whether the element should be `unmounted` or `hidden` based on the show state. |
| `enter` | String _(Default: '')_ | Classes to add to the transitioning element during the entire enter phase. |
| `enterFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the enter phase starts. |
| `enterTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the enter phase starts. |
| `leave` | String _(Default: '')_ | Classes to add to the transitioning element during the entire leave phase. |
| `leaveFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the leave phase starts. |
| `leaveTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the leave phase starts. |
| `beforeEnter` | Function | Callback which is called before we start the enter transition. |
| `afterEnter` | Function | Callback which is called after we finished the enter transition. |
| `beforeLeave` | Function | Callback which is called before we start the leave transition. |
| `afterLeave` | Function | Callback which is called after we finished the leave transition. |
##### Render prop arguments
| Prop | Type | Description |
| ----- | ---------------------- | ----------------------------------------------------------------------------------- |
| `ref` | React.MutableRefObject | A ref that needs to be manually added to the child node when using the render prop. |
- None

@@ -356,18 +334,21 @@ #### Transition.Child

| Prop | Type | Description |
| ----------- | ------------------------------------- | ------------------------------------------------------------------------------------- |
| `as` | String Component _(Default: `'div'`)_ | The element or component to render in place of the `Transition.Child` itself. |
| `appear` | Boolean _(Default: `false`)_ | Whether the transition should run on initial mount. |
| `enter` | String _(Default: '')_ | Classes to add to the transitioning element during the entire enter phase. |
| `enterFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the enter phase starts. |
| `enterTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the enter phase starts. |
| `leave` | String _(Default: '')_ | Classes to add to the transitioning element during the entire leave phase. |
| `leaveFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the leave phase starts. |
| `leaveTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the leave phase starts. |
| Prop | Type | Description |
| ------------- | ------------------------------------- | ------------------------------------------------------------------------------------- |
| `as` | String Component _(Default: `'div'`)_ | The element or component to render in place of the `Transition.Child` itself. |
| `appear` | Boolean _(Default: `false`)_ | Whether the transition should run on initial mount. |
| `unmount` | Boolean _(Default: `true`)_ | Whether the element should be `unmounted` or `hidden` based on the show state. |
| `enter` | String _(Default: '')_ | Classes to add to the transitioning element during the entire enter phase. |
| `enterFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the enter phase starts. |
| `enterTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the enter phase starts. |
| `leave` | String _(Default: '')_ | Classes to add to the transitioning element during the entire leave phase. |
| `leaveFrom` | String _(Default: '')_ | Classes to add to the transitioning element before the leave phase starts. |
| `leaveTo` | String _(Default: '')_ | Classes to add to the transitioning element immediately after the leave phase starts. |
| `beforeEnter` | Function | Callback which is called before we start the enter transition. |
| `afterEnter` | Function | Callback which is called after we finished the enter transition. |
| `beforeLeave` | Function | Callback which is called before we start the leave transition. |
| `afterLeave` | Function | Callback which is called after we finished the leave transition. |
##### Render prop arguments
| Prop | Type | Description |
| ----- | ---------------------- | ----------------------------------------------------------------------------------- |
| `ref` | React.MutableRefObject | A ref that needs to be manually added to the child node when using the render prop. |
- None

@@ -585,5 +566,5 @@ ---

<Menu.Items>
<div class="px-4 py-3">
<p class="text-sm leading-5">Signed in as</p>
<p class="text-sm font-medium leading-5 text-gray-900 truncate">tom@example.com</p>
<div className="px-4 py-3">
<p className="text-sm leading-5">Signed in as</p>
<p className="text-sm font-medium leading-5 text-gray-900 truncate">tom@example.com</p>
</div>

@@ -730,7 +711,10 @@ <Menu.Item>

| Prop | Type | Default | Description |
| -------- | ------------------- | ------- | --------------------------------------------------------------------------- |
| `as` | String \| Component | `div` | The element or component the `Menu.Items` should render as. |
| `static` | Boolean | `false` | Whether the element should ignore the internally managed open/closed state. |
| Prop | Type | Default | Description |
| --------- | ------------------- | ------- | --------------------------------------------------------------------------------- |
| `as` | String \| Component | `div` | The element or component the `Menu.Items` should render as. |
| `static` | Boolean | `false` | Whether the element should ignore the internally managed open/closed state. |
| `unmount` | Boolean | `true` | Whether the element should be unmounted or hidden based on the open/closed state. |
> **note**: `static` and `unmount` can not be used at the same time. You will get a TypeScript error if you try to do it.
##### Render prop object

@@ -794,13 +778,14 @@

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -840,10 +825,11 @@

const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -856,4 +842,4 @@

{people.map(person => (
{/* Use the `active` state to conditionally style the active option. */}
{/* Use the `selected` state to conditionally style the selected option. */}
/* Use the `active` state to conditionally style the active option. */
/* Use the `selected` state to conditionally style the selected option. */
<Listbox.Option as={Fragment} key={person.id} value={person}>

@@ -883,10 +869,11 @@ {({ active, selected }) => (

const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -915,13 +902,14 @@

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -949,13 +937,14 @@

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -992,13 +981,14 @@

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -1011,3 +1001,3 @@

{people.map(person => (
{/* Disabled options will be skipped by keyboard navigation. */}
/* Disabled options will be skipped by keyboard navigation. */
<Listbox.Option key={person.id} value={person} disabled={person.unavailable}>

@@ -1028,13 +1018,14 @@ <span className={person.unavailable ? 'opacity-75' : ''}>{person.name}</span>

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox, Transition } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds', unavailable: false },
{ id: 2, name: 'Kenton Towne', unavailable: false },
{ id: 3, name: 'Therese Wunsch', unavailable: false },
{ id: 4, name: 'Benedict Kessler', unavailable: true },
{ id: 5, name: 'Katelyn Rohan', unavailable: false },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -1044,21 +1035,25 @@

<Listbox value={selectedPerson} onChange={setSelectedPerson}>
<Listbox.Button>{selectedPerson.name}</Listbox.Button>
{/* Use the Transition + open render prop argument to add transitions. */}
<Transition
show={open}
enter="transition duration-100 ease-out"
enterFrom="transform scale-95 opacity-0"
enterTo="transform scale-100 opacity-100"
leave="transition duration-75 ease-out"
leaveFrom="transform scale-100 opacity-100"
leaveTo="transform scale-95 opacity-0"
>
<Listbox.Options static>
{people.map(person => (
<Listbox.Option key={person.id} value={person} disabled={person.unavailable}>
{person.name}
</Listbox.Option>
))}
</Listbox.Options>
</Transition>
{({ open }) => (
<>
<Listbox.Button>{selectedPerson.name}</Listbox.Button>
{/* Use the Transition + open render prop argument to add transitions. */}
<Transition
show={open}
enter="transition duration-100 ease-out"
enterFrom="transform scale-95 opacity-0"
enterTo="transform scale-100 opacity-100"
leave="transition duration-75 ease-out"
leaveFrom="transform scale-100 opacity-100"
leaveTo="transform scale-95 opacity-0"
>
<Listbox.Options static>
{people.map(person => (
<Listbox.Option key={person.id} value={person} disabled={person.unavailable}>
{person.name}
</Listbox.Option>
))}
</Listbox.Options>
</Transition>
</>
)}
</Listbox>

@@ -1078,13 +1073,14 @@ )

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -1113,10 +1109,11 @@

const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -1126,3 +1123,3 @@

<Listbox value={selectedPerson} onChange={setSelectedPerson}>
<Listbox.Button as={React.Fragment}>{selectedPerson.name}</Listbox.Button>
<Listbox.Button as={Fragment}>{selectedPerson.name}</Listbox.Button>
<Listbox.Options>

@@ -1145,13 +1142,14 @@ {people.map(person => (

```jsx
import { useState, Fragment } from 'react'
import { useState } from 'react'
import { Listbox } from '@headlessui/react'
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
function MyListbox() {
const people = [
{ id: 1, name: 'Durward Reynolds' },
{ id: 2, name: 'Kenton Towne' },
{ id: 3, name: 'Therese Wunsch' },
{ id: 4, name: 'Benedict Kessler' },
{ id: 5, name: 'Katelyn Rohan' },
]
const [selectedPerson, setSelectedPerson] = useState(people[0])

@@ -1176,13 +1174,15 @@

| Prop | Type | Default | Description |
| ---------- | ----------------------- | --------------------------------------- | -------------------------------------------------------- |
| `as` | String \| Component | `React.Fragment` _(no wrapper element_) | The element or component the `Listbox` should render as. |
| `value` | `T` | | The selected value. |
| `onChange` | `(value: T): void` | | The function to call when a new option is selected. |
| Prop | Type | Default | Description |
| ---------- | ------------------- | --------------------------------------- | -------------------------------------------------------- |
| `as` | String \| Component | `React.Fragment` _(no wrapper element_) | The element or component the `Listbox` should render as. |
| `disabled` | Boolean | `false` | Enable/Disable the `Listbox` component. |
| `value` | `T` | | The selected value. |
| `onChange` | `(value: T): void` | | The function to call when a new option is selected. |
##### Render prop object
| Prop | Type | Description |
| ------ | ------- | ----------------------------------- |
| `open` | Boolean | Whether or not the listbox is open. |
| Prop | Type | Description |
| ---------- | ------- | --------------------------------------- |
| `open` | Boolean | Whether or not the listbox is open. |
| `disabled` | Boolean | Whether or not the listbox is disabled. |

@@ -1210,5 +1210,6 @@ #### Listbox.Button

| Prop | Type | Description |
| ------ | ------- | ----------------------------------- |
| `open` | Boolean | Whether or not the listbox is open. |
| Prop | Type | Description |
| ---------- | ------- | --------------------------------------- |
| `open` | Boolean | Whether or not the listbox is open. |
| `disabled` | Boolean | Whether or not the listbox is disabled. |

@@ -1227,2 +1228,9 @@ #### Listbox.Label

##### Render prop object
| Prop | Type | Description |
| ---------- | ------- | --------------------------------------- |
| `open` | Boolean | Whether or not the listbox is open. |
| `disabled` | Boolean | Whether or not the listbox is disabled. |
#### Listbox.Options

@@ -1239,7 +1247,10 @@

| Prop | Type | Default | Description |
| -------- | ------------------- | ------- | --------------------------------------------------------------------------- |
| `as` | String \| Component | `ul` | The element or component the `Listbox.Options` should render as. |
| `static` | Boolean | `false` | Whether the element should ignore the internally managed open/closed state. |
| Prop | Type | Default | Description |
| --------- | ------------------- | ------- | --------------------------------------------------------------------------------- |
| `as` | String \| Component | `ul` | The element or component the `Listbox.Options` should render as. |
| `static` | Boolean | `false` | Whether the element should ignore the internally managed open/closed state. |
| `unmount` | Boolean | `true` | Whether the element should be unmounted or hidden based on the open/closed state. |
> **note**: `static` and `unmount` can not be used at the same time. You will get a TypeScript error if you try to do it.
##### Render prop object

@@ -1259,7 +1270,7 @@

| Prop | Type | Default | Description |
| ---------- | ----------------------- | ----------- | --------------------------------------------------------------------------------------- |
| `as` | String \| Component | `li` | The element or component the `Listbox.Option` should render as. |
| `value` | `T` | | The option value. |
| `disabled` | Boolean | `false` | Whether or not the option should be disabled for keyboard navigation and ARIA purposes. |
| Prop | Type | Default | Description |
| ---------- | ------------------- | ------- | --------------------------------------------------------------------------------------- |
| `as` | String \| Component | `li` | The element or component the `Listbox.Option` should render as. |
| `value` | `T` | | The option value. |
| `disabled` | Boolean | `false` | Whether or not the option should be disabled for keyboard navigation and ARIA purposes. |

@@ -1299,7 +1310,11 @@ ##### Render prop object

onChange={setEnabled}
className={`${switchValue ? "bg-blue-600" : "bg-gray-200"} relative inline-flex h-6 rounded-full w-8`}
className={`${
enabled ? 'bg-blue-600' : 'bg-gray-200'
} relative inline-flex h-6 rounded-full w-8`}
>
<span className="sr-only">Enable notifications</span>
<span
className={`${enabled ? "translate-x-4" : "translate-x-0"} inline-block w-4 h-4 transform bg-white rounded-full`}
className={`${
enabled ? 'translate-x-4' : 'translate-x-0'
} inline-block w-4 h-4 transform bg-white rounded-full`}
/>

@@ -1330,6 +1345,10 @@ </Switch>

onChange={setEnabled}
className={`${switchValue ? "bg-blue-600" : "bg-gray-200"} relative inline-flex h-6 rounded-full w-8`}
className={`${
enabled ? 'bg-blue-600' : 'bg-gray-200'
} relative inline-flex h-6 rounded-full w-8`}
>
<span
className={`${enabled ? "translate-x-4" : "translate-x-0"} inline-block w-4 h-4 transform bg-white rounded-full`}
className={`${
enabled ? 'translate-x-4' : 'translate-x-0'
} inline-block w-4 h-4 transform bg-white rounded-full`}
/>

@@ -1355,15 +1374,14 @@ </Switch>

| Prop | Type | Default | Description |
| ---------- | ----------------------- | --------------------------------------- | -------------------------------------------------------- |
| `as` | String \| Component | `button` | The element or component the `Switch` should render as. |
| `checked` | Boolean | | Whether or not the switch is checked. |
| `onChange` | `(value: boolean): void` | | The function to call when the switch is toggled. |
| Prop | Type | Default | Description |
| ---------- | ------------------------ | -------- | ------------------------------------------------------- |
| `as` | String \| Component | `button` | The element or component the `Switch` should render as. |
| `checked` | Boolean | | Whether or not the switch is checked. |
| `onChange` | `(value: boolean): void` | | The function to call when the switch is toggled. |
##### Render prop object
| Prop | Type | Description |
| ------ | ------- | ----------------------------------- |
| Prop | Type | Description |
| --------- | ------- | ------------------------------------- |
| `checked` | Boolean | Whether or not the switch is checked. |
#### Switch.Label

@@ -1382,5 +1400,5 @@

| Prop | Type | Default | Description |
| ---------- | ----------------------- | --------------------------------------- | -------------------------------------------------------- |
| `as` | String \| Component | `label` | The element or component the `Switch.Label` should render as. |
| Prop | Type | Default | Description |
| ---- | ------------------- | ------- | ------------------------------------------------------------- |
| `as` | String \| Component | `label` | The element or component the `Switch.Label` should render as. |

@@ -1400,4 +1418,4 @@ #### Switch.Group

| Prop | Type | Default | Description |
| ---------- | ----------------------- | --------------------------------------- | -------------------------------------------------------- |
| `as` | String \| Component | `React.Fragment` _(no wrapper element)_| The element or component the `Switch.Group` should render as. |
| Prop | Type | Default | Description |
| ---- | ------------------- | --------------------------------------- | ------------------------------------------------------------- |
| `as` | String \| Component | `React.Fragment` _(no wrapper element)_ | The element or component the `Switch.Group` should render as. |
dist/headlessui.cjs.development.js

Sorry, the diff of this file is too big to display

dist/headlessui.cjs.development.js.map

Sorry, the diff of this file is not supported yet

dist/headlessui.cjs.production.min.js.map

Sorry, the diff of this file is not supported yet

dist/headlessui.esm.js

Sorry, the diff of this file is too big to display

dist/headlessui.esm.js.map

Sorry, the diff of this file is not supported yet

dist/headlessui.umd.development.js

Sorry, the diff of this file is too big to display

dist/headlessui.umd.development.js.map

Sorry, the diff of this file is not supported yet

dist/headlessui.umd.production.min.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc