@payfit/unity-components 2.46.12 → 2.46.13

package/dist/esm/components/select/TanstackSelect.d.ts

@@ -1,80 +0,0 @@
-import { ForwardedRef, JSX } from 'react';
-import { SelectProps } from './Select.js';
-export type TanstackSelectProps<T extends object> = Omit<SelectProps<T>, 'value' | 'defaultValue' | 'onChange' | 'isInvalid' | 'name'>;
-type TanstackSelectComponent = (<TItems extends object>(props: TanstackSelectProps<TItems> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * `TanstackSelect` is a controlled select component wired to the TanStack Form field context.
- * It is based on the Unity `Select` component.
- *
- * The component supports both static and dynamic options, search functionality, and grouping.
- * It manages field state via the TanStack Form context, including validation and accessibility.
- *
- * Example (static options):
- * ```tsx
- * import { useTanstackUnityForm } from '@payfit/unity-components'
- * import { z } from 'zod'
- *
- * function ExampleField() {
- *   const schema = z.object({
- *     fruit: z.string().min(1, 'Please select a fruit'),
- *   })
- *
- *   const form = useTanstackUnityForm({
- *     validators: { onBlur: schema },
- *     defaultValues: { fruit: '' }
- *   })
- *
- *   return (
- *     <form>
- *       <form.AppField name="fruit">
- *         {() => (
- *           <TanstackSelect placeholder="Choose a fruit">
- *             <SelectOption id="Apple">Apple</SelectOption>
- *             <SelectOption id="Banana">Banana</SelectOption>
- *             <SelectOption id="Orange">Orange</SelectOption>
- *           </TanstackSelect>
- *         )}
- *       </form.AppField>
- *     </form>
- *   )
- * }
- * ```
- *
- * Example (dynamic items):
- * ```tsx
- * function ExampleWithDynamicItems() {
- *   const items = [
- *     { id: 'Apple', name: 'Apple' },
- *     { id: 'Banana', name: 'Banana' },
- *     { id: 'Orange', name: 'Orange' },
- *   ]
- *
- *   const form = useTanstackUnityForm({
- *     validators: {},
- *     defaultValues: { fruit: '' }
- *   })
- *
- *   return (
- *     <form>
- *       <form.AppField name="fruit">
- *         {() => (
- *           <form.Select items={items}>
- *             {item => <SelectOption id={item.id}>{item.name}</SelectOption>}
- *           </form.Select>
- *         )}
- *       </form.AppField>
- *     </form>
- *   )
- * }
- * ```
- * @remarks Migration from `Select` (non-TanStack):
- * - Do not pass `value`, `defaultValue`, `onChange`, or `name` props: these are managed by the TanStack form context.
- * - `isInvalid` is automatically derived from the field's validation state.
- * - Use within `<form.AppField name="...">` to connect to the form state.
- */
-declare const TanstackSelect: TanstackSelectComponent;
-export { TanstackSelect };

package/dist/esm/components/select/TanstackSelect.js

@@ -1,41 +0,0 @@
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { useFieldContext as u } from "../../hooks/tanstack-form-context.js";
-import { useFieldA11yContext as p } from "../form-field/TanstackFormField.context.js";
-import { Select as b } from "./Select.js";
-const h = ({
-  onBlur: o,
-  isReadOnly: a,
-  isDisabled: l,
-  renderValue: r,
-  ...s
-}, c) => {
-  const e = u(), t = p(), d = e.state.meta.isTouched && !e.state.meta.isValid, i = [t.helperTextId, t.feedbackTextId].filter(Boolean).join(" ");
-  return /* @__PURE__ */ m(
-    b,
-    {
-      ...s,
-      ref: c,
-      value: e.state.value ?? "",
-      onChange: (n) => {
-        e.handleChange(n);
-      },
-      onBlur: (n) => {
-        e.handleBlur(), o?.(n);
-      },
-      isReadOnly: a,
-      isDisabled: l,
-      isInvalid: d,
-      "aria-labelledby": t.labelId,
-      "aria-describedby": i.length > 0 ? i : void 0,
-      "aria-details": t.contextualLinkId,
-      renderValue: r
-    }
-  );
-}, x = f(function(a, l) {
-  return h(a, l);
-});
-x.displayName = "TanstackSelect";
-export {
-  x as TanstackSelect
-};

package/dist/esm/components/select/parts/SearchInput.d.ts

@@ -1,5 +0,0 @@
-export interface SearchInputProps {
-    'aria-label': string;
-}
-declare const SearchInput: import('react').ForwardRefExoticComponent<SearchInputProps & import('react').RefAttributes<HTMLDivElement>>;
-export { SearchInput };

package/dist/esm/components/select/parts/SearchInput.js

@@ -1,59 +0,0 @@
-import { jsxs as e, Fragment as l, jsx as t } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-import { uyTv as c } from "@payfit/unity-themes";
-import { Input as y } from "react-aria-components/Input";
-import { SearchField as d } from "react-aria-components/SearchField";
-import { useIntl as p } from "react-intl";
-import { CircularIconButton as f } from "../../icon-button/CircularIconButton.js";
-import { Icon as b } from "../../icon/Icon.js";
-const h = c({
-  slots: {
-    base: "uy:flex uy:gap-100 uy:transition-colors uy:py-125 uy:sm:py-100 uy:px-150 uy:rounded-100 uy:sm:rounded-75 uy:bg-surface-form-high-enabled uy:text-content-form-active uy:mt-100 uy:mb-100 uy:ml-100 uy:mr-100 uy:typography-body uy:focus-within:border uy:focus-within:border-solid uy:focus-within:border-border-form-active",
-    input: "uy:flex-grow uy:outline-none uy:[&::-webkit-search-cancel-button]:hidden uy:min-h-300",
-    button: "uy:text-content-neutral-enabled",
-    separator: "uy:h-[1px] uy:bg-surface-neutral-lowest uy:w-full uy:mt-100"
-  }
-}), g = m(
-  ({ "aria-label": r }, o) => {
-    const a = p(), { base: u, input: n, button: i, separator: s } = h();
-    return /* @__PURE__ */ e(l, { children: [
-      /* @__PURE__ */ e(
-        d,
-        {
-          className: u(),
-          ref: o,
-          "data-dd-privacy": "mask",
-          "aria-label": r,
-          children: [
-            /* @__PURE__ */ t(
-              b,
-              {
-                src: "MagnifyingGlassOutlined",
-                "aria-hidden": "true",
-                color: "content.neutral.lowest"
-              }
-            ),
-            /* @__PURE__ */ t(y, { className: n() }),
-            /* @__PURE__ */ t(
-              f,
-              {
-                title: a.formatMessage({
-                  id: "unity:component:common:clear:title",
-                  defaultMessage: "Clear"
-                }),
-                className: i(),
-                icon: "CloseOutlined",
-                asElement: "button"
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ t("div", { "aria-hidden": "true", className: s() })
-    ] });
-  }
-);
-g.displayName = "SearchInput";
-export {
-  g as SearchInput
-};

package/dist/esm/components/select/parts/SelectButton.d.ts

@@ -1,19 +0,0 @@
-import { Node } from '@react-types/shared';
-import { ReactNode } from 'react';
-export interface SelectButtonProps<T extends object> {
-    /** Whether the button is disabled */
-    isDisabled?: boolean;
-    /** Whether the button is in an invalid state */
-    isInvalid?: boolean;
-    /** Whether the button is read-only */
-    isReadOnly?: boolean;
-    /** Whether the select popover is currently open */
-    isOpen: boolean;
-    /** Custom render function to format the selected value display */
-    renderValue?: (selectedItem: Node<T>) => ReactNode;
-}
-declare const SelectButton: {
-    <T extends object>({ isDisabled, isInvalid, isReadOnly, isOpen, renderValue, }: SelectButtonProps<T>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { SelectButton };

package/dist/esm/components/select/parts/SelectButton.js

@@ -1,104 +0,0 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { uyTv as b } from "@payfit/unity-themes";
-import { Button as p } from "react-aria-components/Button";
-import { SelectValue as n } from "react-aria-components/Select";
-import { useIntl as v } from "react-intl";
-import { Icon as u } from "../../icon/Icon.js";
-const h = b({
-  slots: {
-    base: "uy:flex uy:flex-row uy:items-center uy:gap-100 uy:h-5.5 uy:sm:h-500 uy:py-125 uy:sm:py-100 uy:px-150 uy:rounded-100 uy:sm:rounded-75 uy:border-solid uy:focus-visible:ring-2 uy:focus-visible:ring-utility-focus-ring uy:focus-visible:ring-offset-2 uy:outline-none uy:border",
-    selectValue: [
-      "uy:min-w-0 uy:whitespace-nowrap uy:text-ellipsis uy:typography-body uy:flex-grow uy:text-left uy:overflow-hidden",
-      "uy:data-[placeholder]:text-content-neutral-lowest"
-    ],
-    iconWrapper: "uy:flex uy:shrink-0 uy:gap-50",
-    icon: ""
-  },
-  variants: {
-    isDisabled: {
-      true: {
-        base: "uy:border-border-form-disabled uy:bg-surface-form-disabled",
-        selectValue: "uy:text-content-form-disabled",
-        icon: "uy:text-content-neutral-lowest-disabled"
-      }
-    },
-    isInvalid: {
-      true: {
-        base: "uy:border-border-form-error uy:bg-surface-form-error"
-      }
-    },
-    isReadOnly: {
-      true: {
-        base: "uy:border-border-form-disabled uy:bg-surface-form-disabled",
-        selectValue: "uy:text-content-form-readonly",
-        icon: "uy:text-content-neutral-lowest-disabled"
-      }
-    }
-  },
-  compoundVariants: [
-    {
-      isDisabled: !1,
-      isInvalid: !1,
-      isReadOnly: !1,
-      className: {
-        base: "uy:border-border-form-enabled uy:hover:border-border-form-hover uy:bg-surface-form-enabled uy:hover:bg-surface-form-hover uy:active:border-border-form-active",
-        selectValue: "uy:text-content-form-enabled uy:hover:text-content-form-hover",
-        icon: "uy:text-content-neutral-lowest uy:hover:text-content-neutral-lowest-hover"
-      }
-    }
-  ],
-  defaultVariants: {
-    isDisabled: !1,
-    isInvalid: !1,
-    isReadOnly: !1
-  }
-}), x = ({
-  isDisabled: r,
-  isInvalid: t,
-  isReadOnly: i,
-  isOpen: d,
-  renderValue: o
-}) => {
-  const c = v(), { base: y, selectValue: s, iconWrapper: f, icon: m } = h({
-    isDisabled: r,
-    isInvalid: t,
-    isReadOnly: i
-  });
-  return /* @__PURE__ */ l(
-    p,
-    {
-      "data-dd-privacy": "mask",
-      className: y(),
-      isDisabled: r,
-      "data-unity-slot": "select-button",
-      children: [
-        o ? /* @__PURE__ */ e(n, { className: s(), translate: "no", children: ({ state: a }) => a.selectedItems[0] ? o(a.selectedItems[0]) : null }) : /* @__PURE__ */ e(n, { className: s(), translate: "no" }),
-        /* @__PURE__ */ l("div", { className: f(), children: [
-          t && /* @__PURE__ */ e(
-            u,
-            {
-              src: "WarningCircleOutlined",
-              color: "content.form.invalid",
-              alt: c.formatMessage({
-                id: "unity:component:form-field:form-input:error:alt",
-                defaultMessage: "Error"
-              })
-            }
-          ),
-          /* @__PURE__ */ e(
-            u,
-            {
-              className: m(),
-              "aria-hidden": "true",
-              src: d ? "CaretUpOutlined" : "CaretDownOutlined"
-            }
-          )
-        ] })
-      ]
-    }
-  );
-};
-x.displayName = "SelectButton";
-export {
-  x as SelectButton
-};

package/dist/esm/components/select/parts/SelectOption.context.d.ts

@@ -1,8 +0,0 @@
-import { PropsWithChildren } from 'react';
-interface SelectOptionContextValue {
-    isDisabled: boolean | undefined;
-}
-export declare const SelectOptionContext: import('react').Context<SelectOptionContextValue>;
-export declare function SelectOptionProvider({ children, isDisabled, }: PropsWithChildren<SelectOptionContextValue>): import("react/jsx-runtime").JSX.Element;
-export declare function useSelectOptionContext(): SelectOptionContextValue;
-export {};

package/dist/esm/components/select/parts/SelectOption.context.js

@@ -1,24 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { createContext as r, useContext as i } from "react";
-const e = r({
-  isDisabled: void 0
-});
-function u({
-  children: t,
-  isDisabled: o
-}) {
-  return /* @__PURE__ */ n(e.Provider, { value: { isDisabled: o }, children: t });
-}
-function p() {
-  const t = i(e);
-  if (!t)
-    throw new Error(
-      "useSelectOptionContext must be used within an SelectOptionProvider"
-    );
-  return t;
-}
-export {
-  e as SelectOptionContext,
-  u as SelectOptionProvider,
-  p as useSelectOptionContext
-};

package/dist/esm/components/select/parts/SelectOption.d.ts

@@ -1,13 +0,0 @@
-import { default as React, ReactNode } from 'react';
-import { ListBoxItemProps } from 'react-aria-components/ListBox';
-/**
- * SelectOption component for displaying options in a Select dropdown.
- * @note The `textValue` prop (inherited from ListBoxItemProps) is used for searching when the content
- * of the option is more complex than a simple string (e.g., contains components
- * like Avatar, Flex, etc.). Providing this prop enables search functionality
- * for complex content options.
- */
-declare const SelectOption: React.ForwardRefExoticComponent<Omit<ListBoxItemProps<object>, "children"> & {
-    children: ReactNode;
-} & React.RefAttributes<HTMLDivElement>>;
-export { SelectOption };

package/dist/esm/components/select/parts/SelectOption.js

@@ -1,64 +0,0 @@
-import { jsx as e, jsxs as y, Fragment as i } from "react/jsx-runtime";
-import { forwardRef as d } from "react";
-import { uyTv as f } from "@payfit/unity-themes";
-import { ListBoxItem as p } from "react-aria-components/ListBox";
-import { Icon as m } from "../../icon/Icon.js";
-import { SelectOptionProvider as b } from "./SelectOption.context.js";
-const x = f({
-  base: "uy:flex uy:flex-col uy:typography-body uy:rounded-50 uy:pt-100 uy:pb-100 uy:pl-150 uy:pr-150 uy:outline-none uy:cursor-pointer",
-  variants: {
-    isFocusVisible: {
-      true: "uy:outline-offset-2 uy:outline-2 uy:outline-solid uy:outline-utility-focus-ring"
-    },
-    isHovered: {
-      true: "uy:bg-surface-neutral-hover uy:text-content-neutral"
-    },
-    isPressed: {
-      true: "uy:bg-surface-neutral-pressed uy:text-content-neutral-pressed"
-    },
-    isSelected: {
-      true: "uy:bg-surface-neutral-active uy:text-content-neutral-active"
-    },
-    isDisabled: {
-      true: "uy:text-content-neutral-disabled"
-    }
-  },
-  compoundVariants: [
-    {
-      isFocusVisible: !1,
-      isHovered: !1,
-      isPressed: !1,
-      isSelected: !1,
-      isDisabled: !1,
-      class: "uy:bg-surface-neutral-enabled uy:text-content-neutral-enabled"
-    }
-  ]
-}), v = d(
-  (s, l) => {
-    const { children: u, isDisabled: r, textValue: n } = s;
-    return /* @__PURE__ */ e(
-      p,
-      {
-        ...s,
-        ref: l,
-        "data-dd-privacy": "mask",
-        textValue: n,
-        className: ({ isHovered: t, isPressed: o, isFocusVisible: a, isSelected: c }) => x({
-          isHovered: t,
-          isPressed: o,
-          isFocusVisible: a,
-          isSelected: c,
-          isDisabled: r
-        }),
-        children: ({ isSelected: t }) => /* @__PURE__ */ e(b, { isDisabled: r, children: t ? /* @__PURE__ */ y("div", { className: "uy:flex uy:justify-between", children: [
-          /* @__PURE__ */ e("div", { className: "uy:flex uy:flex-col", children: /* @__PURE__ */ e(i, { children: u }) }),
-          /* @__PURE__ */ e(m, { src: "CheckOutlined" })
-        ] }) : /* @__PURE__ */ e(i, { children: u }) })
-      }
-    );
-  }
-);
-v.displayName = "SelectOption";
-export {
-  v as SelectOption
-};

package/dist/esm/components/select/parts/SelectOptionGroup.d.ts

@@ -1,12 +0,0 @@
-import { ForwardedRef, JSX } from 'react';
-import { ListBoxSectionProps } from 'react-aria-components/ListBox';
-export interface SelectOptionGroupProps<T extends object> extends ListBoxSectionProps<T> {
-    label: string;
-}
-type SelectOptionGroupComponent = (<TItems extends object>(props: SelectOptionGroupProps<TItems> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-declare const SelectOptionGroup: SelectOptionGroupComponent;
-export { SelectOptionGroup };

package/dist/esm/components/select/parts/SelectOptionGroup.js

@@ -1,29 +0,0 @@
-import { jsxs as p, Fragment as n, jsx as r } from "react/jsx-runtime";
-import { forwardRef as l } from "react";
-import { uyTv as m } from "@payfit/unity-themes";
-import { Collection as c } from "react-aria-components/Collection";
-import { Header as y } from "react-aria-components/Header";
-import { ListBoxSection as d } from "react-aria-components/ListBox";
-import { Separator as f } from "react-aria-components/Separator";
-const h = m({
-  slots: {
-    base: "",
-    header: "uy:text-content-neutral-enabled uy:typography-body-strong uy:pt-100 uy:pb-100 uy:pl-150 uy:pr-150",
-    separator: "uy:h-[1px] uy:bg-surface-neutral-lowest uy:w-full uy:mb-100 uy:mt-100 uy:last:hidden"
-  }
-}), b = ({ label: e, children: t, items: o }, a) => {
-  const { base: u, header: s, separator: i } = h();
-  return /* @__PURE__ */ p(n, { children: [
-    /* @__PURE__ */ p(d, { ref: a, className: u(), id: e, items: o, children: [
-      /* @__PURE__ */ r(y, { className: s(), children: e }),
-      o ? /* @__PURE__ */ r(c, { items: o, children: t }) : /* @__PURE__ */ r(n, { children: t })
-    ] }),
-    /* @__PURE__ */ r(f, { orientation: "horizontal", className: i() })
-  ] });
-}, x = l(function(t, o) {
-  return b(t, o);
-});
-x.displayName = "SelectOptionGroup";
-export {
-  x as SelectOptionGroup
-};

package/dist/esm/components/select/parts/SelectOptionHelper.d.ts

@@ -1,4 +0,0 @@
-declare const SelectOptionHelper: import('react').ForwardRefExoticComponent<{
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLSpanElement>>;
-export { SelectOptionHelper };

package/dist/esm/components/select/parts/SelectOptionHelper.js

@@ -1,22 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { uyTv as n } from "@payfit/unity-themes";
-import { useSelectOptionContext as l } from "./SelectOption.context.js";
-const p = n({
-  base: "uy:typography-body",
-  variants: {
-    isDisabled: {
-      true: "uy:text-content-neutral-disabled",
-      false: "uy:text-content-neutral-low"
-    }
-  }
-}), i = s(
-  ({ children: t }, e) => {
-    const { isDisabled: o } = l(), r = p({ isDisabled: o });
-    return /* @__PURE__ */ a("span", { className: r, ref: e, "data-dd-privacy": "mask", children: t });
-  }
-);
-i.displayName = "SelectOptionHelper";
-export {
-  i as SelectOptionHelper
-};

package/dist/esm/components/select-field/SelectField.d.ts

@@ -1,52 +0,0 @@
-import { StandardSchemaV1 } from '@standard-schema/spec';
-import { ForwardedRef, JSX, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { Schema } from '../../hooks/use-form.types.js';
-import { LabelProps } from '../label/Label.js';
-import { SelectProps } from '../select/Select.js';
-interface SelectFieldProps<TItems extends object, TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Pick<LabelProps, 'isRequired' | 'requiredVariant'>, Omit<SelectProps<TItems>, 'name' | 'value'> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the select field. */
-    label: string;
-    /** Helper text to display below the text field. */
-    helperText?: ReactNode;
-    /** Feedback text to display below the text field. */
-    feedbackText?: ReactNode;
-}
-type SelectFieldComponent = (<TItems extends object, TSchema extends Schema>(props: SelectFieldProps<TItems, StandardSchemaV1.InferOutput<TSchema>> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * The `SelectField` component renders a list of options to select one, it is fully integrated with the `Form` component.
- * @example
- * ```tsx
- * const schema = z.object({
- *  vegetable: z.string()
- * })
- *
- * function MyForm() {
- *   const { Form } = useUnityForm(schema)
- *
- *   return (
- *    <Form action={handleSubmit}>
- *      <SelectField<{id?: string, name:string}, typeof schema>
- *        name="vegetable"
- *        label="Vegetables"
- *        >
- *        <SelectOption id="Cabbage">Cabbage</SelectOption>
- *        <SelectOption id="Broccoli">Broccoli</SelectOption>
- *        <SelectOption id="Carrots">Carrots</SelectOption>
- *        </SelectField>
- *    </Form>
- *   )
- * }
- * ```
- * @note The schema type parameter is needed to ensure type safety with the form's schema. If you omit it, the `name` prop will not be type-safe.
- * @deprecated React Hook Form components are deprecated. Use the TanStack Form version instead.
- * @see Storybook docs: https://unity-components.payfit.io/?path=/docs/forms-introduction-to-unity-forms--docs
- */
-declare const SelectField: SelectFieldComponent;
-export { SelectField };

package/dist/esm/components/select-field/SelectField.js

@@ -1,67 +0,0 @@
-import { jsxs as y, jsx as o } from "react/jsx-runtime";
-import { forwardRef as S } from "react";
-import { uyTv as h } from "@payfit/unity-themes";
-import { useFormContext as b } from "react-hook-form";
-import { FormField as j } from "../form-field/FormField.js";
-import { FormControl as C } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as N } from "../form-field/parts/FormFeedbackText.js";
-import { FormHelperText as T } from "../form-field/parts/FormHelperText.js";
-import { FormLabel as g } from "../form-field/parts/FormLabel.js";
-import { Select as k } from "../select/Select.js";
-const v = h({
-  base: "uy:flex uy:flex-col uy:gap-100"
-}), w = ({
-  children: m,
-  feedbackText: e,
-  helperText: r,
-  isRequired: t,
-  label: l,
-  name: i,
-  requiredVariant: c,
-  isDisabled: n,
-  isInvalid: f,
-  isReadOnly: p,
-  placeholder: s,
-  items: d,
-  ...F
-}, a) => {
-  const { control: u } = b(), x = {
-    isRequired: t,
-    isInvalid: f,
-    isDisabled: n,
-    isReadOnly: p
-  };
-  return /* @__PURE__ */ y(
-    j,
-    {
-      control: u,
-      name: i,
-      className: v(),
-      ...x,
-      children: [
-        /* @__PURE__ */ o(g, { requiredVariant: c, children: l }),
-        r && /* @__PURE__ */ o(T, { children: r }),
-        /* @__PURE__ */ o(C, { children: /* @__PURE__ */ o(
-          k,
-          {
-            ref: a,
-            placeholder: s,
-            items: d,
-            ...F,
-            children: m
-          }
-        ) }),
-        /* @__PURE__ */ o(N, { children: e })
-      ]
-    }
-  );
-}, H = S(function(e, r) {
-  return w(
-    e,
-    r
-  );
-});
-H.displayName = "SelectField";
-export {
-  H as SelectField
-};