UEA-PRODEM
This commit is contained in:
+31
-19
@@ -1,12 +1,17 @@
|
||||
import * as react_jsx_runtime from 'react/jsx-runtime';
|
||||
import * as _radix_ui_react_context from '@radix-ui/react-context';
|
||||
import { Scope } from '@radix-ui/react-context';
|
||||
import * as React from 'react';
|
||||
import { DismissableLayer } from '@radix-ui/react-dismissable-layer';
|
||||
import { FocusScope } from '@radix-ui/react-focus-scope';
|
||||
import * as PopperPrimitive from '@radix-ui/react-popper';
|
||||
import { Portal as Portal$1 } from '@radix-ui/react-portal';
|
||||
import { Portal } from '@radix-ui/react-portal';
|
||||
import { Primitive } from '@radix-ui/react-primitive';
|
||||
|
||||
type Direction = 'ltr' | 'rtl';
|
||||
type ScopedProps<P> = P & {
|
||||
__scopeSelect?: Scope;
|
||||
};
|
||||
declare const createSelectScope: _radix_ui_react_context.CreateScope;
|
||||
interface SelectSharedProps {
|
||||
children?: React.ReactNode;
|
||||
@@ -25,6 +30,15 @@ type SelectProps = SelectSharedProps & {
|
||||
defaultValue?: string;
|
||||
onValueChange?(value: string): void;
|
||||
};
|
||||
interface SelectProviderProps extends SelectSharedProps {
|
||||
value?: string;
|
||||
defaultValue?: string;
|
||||
onValueChange?(value: string): void;
|
||||
}
|
||||
declare function SelectProvider(props: ScopedProps<SelectProviderProps>): react_jsx_runtime.JSX.Element;
|
||||
declare namespace SelectProvider {
|
||||
var displayName: string;
|
||||
}
|
||||
declare const Select: React.FC<SelectProps>;
|
||||
type PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;
|
||||
interface SelectTriggerProps extends PrimitiveButtonProps {
|
||||
@@ -38,16 +52,26 @@ declare const SelectValue: React.ForwardRefExoticComponent<SelectValueProps & Re
|
||||
interface SelectIconProps extends PrimitiveSpanProps {
|
||||
}
|
||||
declare const SelectIcon: React.ForwardRefExoticComponent<SelectIconProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
type PortalProps = React.ComponentPropsWithoutRef<typeof Portal$1>;
|
||||
type PortalProps = React.ComponentPropsWithoutRef<typeof Portal>;
|
||||
interface SelectPortalProps {
|
||||
children?: React.ReactNode;
|
||||
/**
|
||||
* Specify a container element to portal the content into.
|
||||
*/
|
||||
container?: PortalProps['container'];
|
||||
/**
|
||||
* Used to force mounting when more control is needed. Useful when controlling
|
||||
* animation with React animation libraries.
|
||||
*/
|
||||
forceMount?: true;
|
||||
}
|
||||
declare const SelectPortal: React.FC<SelectPortalProps>;
|
||||
interface SelectContentProps extends SelectContentImplProps {
|
||||
/**
|
||||
* Used to force mounting when more control is needed. Useful when
|
||||
* controlling animation with React animation libraries.
|
||||
*/
|
||||
forceMount?: true;
|
||||
}
|
||||
declare const SelectContent: React.ForwardRefExoticComponent<SelectContentProps & React.RefAttributes<HTMLDivElement>>;
|
||||
type DismissableLayerProps = React.ComponentPropsWithoutRef<typeof DismissableLayer>;
|
||||
@@ -117,21 +141,9 @@ type PopperArrowProps = React.ComponentPropsWithoutRef<typeof PopperPrimitive.Ar
|
||||
interface SelectArrowProps extends PopperArrowProps {
|
||||
}
|
||||
declare const SelectArrow: React.ForwardRefExoticComponent<SelectArrowProps & React.RefAttributes<SVGSVGElement>>;
|
||||
declare const Root: React.FC<SelectProps>;
|
||||
declare const Trigger: React.ForwardRefExoticComponent<SelectTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
||||
declare const Value: React.ForwardRefExoticComponent<SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const Icon: React.ForwardRefExoticComponent<SelectIconProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const Portal: React.FC<SelectPortalProps>;
|
||||
declare const Content: React.ForwardRefExoticComponent<SelectContentProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Viewport: React.ForwardRefExoticComponent<SelectViewportProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Group: React.ForwardRefExoticComponent<SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Label: React.ForwardRefExoticComponent<SelectLabelProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Item: React.ForwardRefExoticComponent<SelectItemProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const ItemText: React.ForwardRefExoticComponent<SelectItemTextProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const ItemIndicator: React.ForwardRefExoticComponent<SelectItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const ScrollUpButton: React.ForwardRefExoticComponent<SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const ScrollDownButton: React.ForwardRefExoticComponent<SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Separator: React.ForwardRefExoticComponent<SelectSeparatorProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Arrow: React.ForwardRefExoticComponent<SelectArrowProps & React.RefAttributes<SVGSVGElement>>;
|
||||
type PrimitiveSelectProps = React.ComponentPropsWithoutRef<typeof Primitive.select>;
|
||||
interface SelectBubbleInputProps extends Omit<PrimitiveSelectProps, 'value'> {
|
||||
}
|
||||
declare const SelectBubbleInput: React.ForwardRefExoticComponent<SelectBubbleInputProps & React.RefAttributes<HTMLSelectElement>>;
|
||||
|
||||
export { Arrow, Content, Group, Icon, Item, ItemIndicator, ItemText, Label, Portal, Root, ScrollDownButton, ScrollUpButton, Select, SelectArrow, type SelectArrowProps, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectPortal, type SelectPortalProps, type SelectProps, SelectScrollDownButton, type SelectScrollDownButtonProps, SelectScrollUpButton, type SelectScrollUpButtonProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, SelectViewport, type SelectViewportProps, Separator, Trigger, Value, Viewport, createSelectScope };
|
||||
export { SelectArrow as Arrow, SelectContent as Content, SelectGroup as Group, SelectIcon as Icon, SelectItem as Item, SelectItemIndicator as ItemIndicator, SelectItemText as ItemText, SelectLabel as Label, SelectPortal as Portal, Select as Root, SelectScrollDownButton as ScrollDownButton, SelectScrollUpButton as ScrollUpButton, Select, SelectArrow, type SelectArrowProps, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectPortal, type SelectPortalProps, type SelectProps, SelectScrollDownButton, type SelectScrollDownButtonProps, SelectScrollUpButton, type SelectScrollUpButtonProps, SelectSeparator, type SelectSeparatorProps, type SelectSharedProps, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, SelectViewport, type SelectViewportProps, SelectSeparator as Separator, SelectTrigger as Trigger, SelectValue as Value, SelectViewport as Viewport, createSelectScope, SelectBubbleInput as unstable_BubbleInput, SelectProvider as unstable_Provider, SelectBubbleInput as unstable_SelectBubbleInput, type SelectBubbleInputProps as unstable_SelectBubbleInputProps, SelectProvider as unstable_SelectProvider, type SelectProviderProps as unstable_SelectProviderProps };
|
||||
|
||||
+31
-19
@@ -1,12 +1,17 @@
|
||||
import * as react_jsx_runtime from 'react/jsx-runtime';
|
||||
import * as _radix_ui_react_context from '@radix-ui/react-context';
|
||||
import { Scope } from '@radix-ui/react-context';
|
||||
import * as React from 'react';
|
||||
import { DismissableLayer } from '@radix-ui/react-dismissable-layer';
|
||||
import { FocusScope } from '@radix-ui/react-focus-scope';
|
||||
import * as PopperPrimitive from '@radix-ui/react-popper';
|
||||
import { Portal as Portal$1 } from '@radix-ui/react-portal';
|
||||
import { Portal } from '@radix-ui/react-portal';
|
||||
import { Primitive } from '@radix-ui/react-primitive';
|
||||
|
||||
type Direction = 'ltr' | 'rtl';
|
||||
type ScopedProps<P> = P & {
|
||||
__scopeSelect?: Scope;
|
||||
};
|
||||
declare const createSelectScope: _radix_ui_react_context.CreateScope;
|
||||
interface SelectSharedProps {
|
||||
children?: React.ReactNode;
|
||||
@@ -25,6 +30,15 @@ type SelectProps = SelectSharedProps & {
|
||||
defaultValue?: string;
|
||||
onValueChange?(value: string): void;
|
||||
};
|
||||
interface SelectProviderProps extends SelectSharedProps {
|
||||
value?: string;
|
||||
defaultValue?: string;
|
||||
onValueChange?(value: string): void;
|
||||
}
|
||||
declare function SelectProvider(props: ScopedProps<SelectProviderProps>): react_jsx_runtime.JSX.Element;
|
||||
declare namespace SelectProvider {
|
||||
var displayName: string;
|
||||
}
|
||||
declare const Select: React.FC<SelectProps>;
|
||||
type PrimitiveButtonProps = React.ComponentPropsWithoutRef<typeof Primitive.button>;
|
||||
interface SelectTriggerProps extends PrimitiveButtonProps {
|
||||
@@ -38,16 +52,26 @@ declare const SelectValue: React.ForwardRefExoticComponent<SelectValueProps & Re
|
||||
interface SelectIconProps extends PrimitiveSpanProps {
|
||||
}
|
||||
declare const SelectIcon: React.ForwardRefExoticComponent<SelectIconProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
type PortalProps = React.ComponentPropsWithoutRef<typeof Portal$1>;
|
||||
type PortalProps = React.ComponentPropsWithoutRef<typeof Portal>;
|
||||
interface SelectPortalProps {
|
||||
children?: React.ReactNode;
|
||||
/**
|
||||
* Specify a container element to portal the content into.
|
||||
*/
|
||||
container?: PortalProps['container'];
|
||||
/**
|
||||
* Used to force mounting when more control is needed. Useful when controlling
|
||||
* animation with React animation libraries.
|
||||
*/
|
||||
forceMount?: true;
|
||||
}
|
||||
declare const SelectPortal: React.FC<SelectPortalProps>;
|
||||
interface SelectContentProps extends SelectContentImplProps {
|
||||
/**
|
||||
* Used to force mounting when more control is needed. Useful when
|
||||
* controlling animation with React animation libraries.
|
||||
*/
|
||||
forceMount?: true;
|
||||
}
|
||||
declare const SelectContent: React.ForwardRefExoticComponent<SelectContentProps & React.RefAttributes<HTMLDivElement>>;
|
||||
type DismissableLayerProps = React.ComponentPropsWithoutRef<typeof DismissableLayer>;
|
||||
@@ -117,21 +141,9 @@ type PopperArrowProps = React.ComponentPropsWithoutRef<typeof PopperPrimitive.Ar
|
||||
interface SelectArrowProps extends PopperArrowProps {
|
||||
}
|
||||
declare const SelectArrow: React.ForwardRefExoticComponent<SelectArrowProps & React.RefAttributes<SVGSVGElement>>;
|
||||
declare const Root: React.FC<SelectProps>;
|
||||
declare const Trigger: React.ForwardRefExoticComponent<SelectTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
||||
declare const Value: React.ForwardRefExoticComponent<SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const Icon: React.ForwardRefExoticComponent<SelectIconProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const Portal: React.FC<SelectPortalProps>;
|
||||
declare const Content: React.ForwardRefExoticComponent<SelectContentProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Viewport: React.ForwardRefExoticComponent<SelectViewportProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Group: React.ForwardRefExoticComponent<SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Label: React.ForwardRefExoticComponent<SelectLabelProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Item: React.ForwardRefExoticComponent<SelectItemProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const ItemText: React.ForwardRefExoticComponent<SelectItemTextProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const ItemIndicator: React.ForwardRefExoticComponent<SelectItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
|
||||
declare const ScrollUpButton: React.ForwardRefExoticComponent<SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const ScrollDownButton: React.ForwardRefExoticComponent<SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Separator: React.ForwardRefExoticComponent<SelectSeparatorProps & React.RefAttributes<HTMLDivElement>>;
|
||||
declare const Arrow: React.ForwardRefExoticComponent<SelectArrowProps & React.RefAttributes<SVGSVGElement>>;
|
||||
type PrimitiveSelectProps = React.ComponentPropsWithoutRef<typeof Primitive.select>;
|
||||
interface SelectBubbleInputProps extends Omit<PrimitiveSelectProps, 'value'> {
|
||||
}
|
||||
declare const SelectBubbleInput: React.ForwardRefExoticComponent<SelectBubbleInputProps & React.RefAttributes<HTMLSelectElement>>;
|
||||
|
||||
export { Arrow, Content, Group, Icon, Item, ItemIndicator, ItemText, Label, Portal, Root, ScrollDownButton, ScrollUpButton, Select, SelectArrow, type SelectArrowProps, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectPortal, type SelectPortalProps, type SelectProps, SelectScrollDownButton, type SelectScrollDownButtonProps, SelectScrollUpButton, type SelectScrollUpButtonProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, SelectViewport, type SelectViewportProps, Separator, Trigger, Value, Viewport, createSelectScope };
|
||||
export { SelectArrow as Arrow, SelectContent as Content, SelectGroup as Group, SelectIcon as Icon, SelectItem as Item, SelectItemIndicator as ItemIndicator, SelectItemText as ItemText, SelectLabel as Label, SelectPortal as Portal, Select as Root, SelectScrollDownButton as ScrollDownButton, SelectScrollUpButton as ScrollUpButton, Select, SelectArrow, type SelectArrowProps, SelectContent, type SelectContentProps, SelectGroup, type SelectGroupProps, SelectIcon, type SelectIconProps, SelectItem, SelectItemIndicator, type SelectItemIndicatorProps, type SelectItemProps, SelectItemText, type SelectItemTextProps, SelectLabel, type SelectLabelProps, SelectPortal, type SelectPortalProps, type SelectProps, SelectScrollDownButton, type SelectScrollDownButtonProps, SelectScrollUpButton, type SelectScrollUpButtonProps, SelectSeparator, type SelectSeparatorProps, type SelectSharedProps, SelectTrigger, type SelectTriggerProps, SelectValue, type SelectValueProps, SelectViewport, type SelectViewportProps, SelectSeparator as Separator, SelectTrigger as Trigger, SelectValue as Value, SelectViewport as Viewport, createSelectScope, SelectBubbleInput as unstable_BubbleInput, SelectProvider as unstable_Provider, SelectBubbleInput as unstable_SelectBubbleInput, type SelectBubbleInputProps as unstable_SelectBubbleInputProps, SelectProvider as unstable_SelectProvider, type SelectProviderProps as unstable_SelectProviderProps };
|
||||
|
||||
+138
-113
@@ -31,18 +31,18 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
||||
// src/index.ts
|
||||
var index_exports = {};
|
||||
__export(index_exports, {
|
||||
Arrow: () => Arrow2,
|
||||
Content: () => Content2,
|
||||
Group: () => Group,
|
||||
Icon: () => Icon,
|
||||
Item: () => Item,
|
||||
ItemIndicator: () => ItemIndicator,
|
||||
ItemText: () => ItemText,
|
||||
Label: () => Label,
|
||||
Portal: () => Portal,
|
||||
Root: () => Root2,
|
||||
ScrollDownButton: () => ScrollDownButton,
|
||||
ScrollUpButton: () => ScrollUpButton,
|
||||
Arrow: () => SelectArrow,
|
||||
Content: () => SelectContent,
|
||||
Group: () => SelectGroup,
|
||||
Icon: () => SelectIcon,
|
||||
Item: () => SelectItem,
|
||||
ItemIndicator: () => SelectItemIndicator,
|
||||
ItemText: () => SelectItemText,
|
||||
Label: () => SelectLabel,
|
||||
Portal: () => SelectPortal,
|
||||
Root: () => Select,
|
||||
ScrollDownButton: () => SelectScrollDownButton,
|
||||
ScrollUpButton: () => SelectScrollUpButton,
|
||||
Select: () => Select,
|
||||
SelectArrow: () => SelectArrow,
|
||||
SelectContent: () => SelectContent,
|
||||
@@ -59,11 +59,15 @@ __export(index_exports, {
|
||||
SelectTrigger: () => SelectTrigger,
|
||||
SelectValue: () => SelectValue,
|
||||
SelectViewport: () => SelectViewport,
|
||||
Separator: () => Separator,
|
||||
Trigger: () => Trigger,
|
||||
Value: () => Value,
|
||||
Viewport: () => Viewport,
|
||||
createSelectScope: () => createSelectScope
|
||||
Separator: () => SelectSeparator,
|
||||
Trigger: () => SelectTrigger,
|
||||
Value: () => SelectValue,
|
||||
Viewport: () => SelectViewport,
|
||||
createSelectScope: () => createSelectScope,
|
||||
unstable_BubbleInput: () => SelectBubbleInput,
|
||||
unstable_Provider: () => SelectProvider,
|
||||
unstable_SelectBubbleInput: () => SelectBubbleInput,
|
||||
unstable_SelectProvider: () => SelectProvider
|
||||
});
|
||||
module.exports = __toCommonJS(index_exports);
|
||||
|
||||
@@ -83,6 +87,7 @@ var import_react_id = require("@radix-ui/react-id");
|
||||
var PopperPrimitive = __toESM(require("@radix-ui/react-popper"));
|
||||
var import_react_popper = require("@radix-ui/react-popper");
|
||||
var import_react_portal = require("@radix-ui/react-portal");
|
||||
var import_react_presence = require("@radix-ui/react-presence");
|
||||
var import_react_primitive = require("@radix-ui/react-primitive");
|
||||
var import_react_slot = require("@radix-ui/react-slot");
|
||||
var import_react_use_callback_ref = require("@radix-ui/react-use-callback-ref");
|
||||
@@ -102,9 +107,10 @@ var [createSelectContext, createSelectScope] = (0, import_react_context.createCo
|
||||
import_react_popper.createPopperScope
|
||||
]);
|
||||
var usePopperScope = (0, import_react_popper.createPopperScope)();
|
||||
var [SelectProvider, useSelectContext] = createSelectContext(SELECT_NAME);
|
||||
var [SelectProviderImpl, useSelectContext] = createSelectContext(SELECT_NAME);
|
||||
var [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME);
|
||||
var Select = (props) => {
|
||||
var PROVIDER_NAME = "SelectProvider";
|
||||
function SelectProvider(props) {
|
||||
const {
|
||||
__scopeSelect,
|
||||
children,
|
||||
@@ -119,7 +125,9 @@ var Select = (props) => {
|
||||
autoComplete,
|
||||
disabled,
|
||||
required,
|
||||
form
|
||||
form,
|
||||
// @ts-expect-error internal render prop used by `Select` to compose its default parts
|
||||
internal_do_not_use_render
|
||||
} = props;
|
||||
const popperScope = usePopperScope(__scopeSelect);
|
||||
const [trigger, setTrigger] = React.useState(null);
|
||||
@@ -139,68 +147,72 @@ var Select = (props) => {
|
||||
caller: SELECT_NAME
|
||||
});
|
||||
const triggerPointerDownPosRef = React.useRef(null);
|
||||
const isFormControl = trigger ? form || !!trigger.closest("form") : true;
|
||||
const isFormControl = trigger ? !!form || !!trigger.closest("form") : true;
|
||||
const [nativeOptionsSet, setNativeOptionsSet] = React.useState(/* @__PURE__ */ new Set());
|
||||
const contentId = (0, import_react_id.useId)();
|
||||
const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperPrimitive.Root, { ...popperScope, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
||||
const handleNativeOptionAdd = React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => new Set(prev).add(option));
|
||||
}, []);
|
||||
const handleNativeOptionRemove = React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => {
|
||||
const optionsSet = new Set(prev);
|
||||
optionsSet.delete(option);
|
||||
return optionsSet;
|
||||
});
|
||||
}, []);
|
||||
const context = {
|
||||
required,
|
||||
trigger,
|
||||
onTriggerChange: setTrigger,
|
||||
valueNode,
|
||||
onValueNodeChange: setValueNode,
|
||||
valueNodeHasChildren,
|
||||
onValueNodeHasChildrenChange: setValueNodeHasChildren,
|
||||
contentId,
|
||||
value,
|
||||
onValueChange: setValue,
|
||||
open,
|
||||
onOpenChange: setOpen,
|
||||
dir: direction,
|
||||
triggerPointerDownPosRef,
|
||||
disabled,
|
||||
name,
|
||||
autoComplete,
|
||||
form,
|
||||
nativeOptions: nativeOptionsSet,
|
||||
nativeSelectKey,
|
||||
isFormControl
|
||||
};
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperPrimitive.Root, { ...popperScope, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectProviderImpl, { scope: __scopeSelect, ...context, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
SelectNativeOptionsProvider,
|
||||
{
|
||||
scope: __scopeSelect,
|
||||
onNativeOptionAdd: handleNativeOptionAdd,
|
||||
onNativeOptionRemove: handleNativeOptionRemove,
|
||||
children: isFunction(internal_do_not_use_render) ? internal_do_not_use_render(context) : children
|
||||
}
|
||||
) }) }) });
|
||||
}
|
||||
SelectProvider.displayName = PROVIDER_NAME;
|
||||
var Select = (props) => {
|
||||
const { __scopeSelect, children, ...providerProps } = props;
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
SelectProvider,
|
||||
{
|
||||
required,
|
||||
scope: __scopeSelect,
|
||||
trigger,
|
||||
onTriggerChange: setTrigger,
|
||||
valueNode,
|
||||
onValueNodeChange: setValueNode,
|
||||
valueNodeHasChildren,
|
||||
onValueNodeHasChildrenChange: setValueNodeHasChildren,
|
||||
contentId: (0, import_react_id.useId)(),
|
||||
value,
|
||||
onValueChange: setValue,
|
||||
open,
|
||||
onOpenChange: setOpen,
|
||||
dir: direction,
|
||||
triggerPointerDownPosRef,
|
||||
disabled,
|
||||
children: [
|
||||
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
SelectNativeOptionsProvider,
|
||||
{
|
||||
scope: props.__scopeSelect,
|
||||
onNativeOptionAdd: React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => new Set(prev).add(option));
|
||||
}, []),
|
||||
onNativeOptionRemove: React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => {
|
||||
const optionsSet = new Set(prev);
|
||||
optionsSet.delete(option);
|
||||
return optionsSet;
|
||||
});
|
||||
}, []),
|
||||
children
|
||||
}
|
||||
) }),
|
||||
isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
||||
__scopeSelect,
|
||||
...providerProps,
|
||||
internal_do_not_use_render: ({ isFormControl }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
||||
children,
|
||||
isFormControl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
SelectBubbleInput,
|
||||
{
|
||||
"aria-hidden": true,
|
||||
required,
|
||||
tabIndex: -1,
|
||||
name,
|
||||
autoComplete,
|
||||
value,
|
||||
onChange: (event) => setValue(event.target.value),
|
||||
disabled,
|
||||
form,
|
||||
children: [
|
||||
value === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "" }) : null,
|
||||
Array.from(nativeOptionsSet)
|
||||
]
|
||||
},
|
||||
nativeSelectKey
|
||||
__scopeSelect
|
||||
}
|
||||
) : null
|
||||
]
|
||||
] })
|
||||
}
|
||||
) });
|
||||
);
|
||||
};
|
||||
Select.displayName = SELECT_NAME;
|
||||
var TRIGGER_NAME = "SelectTrigger";
|
||||
@@ -238,7 +250,7 @@ var SelectTrigger = React.forwardRef(
|
||||
{
|
||||
type: "button",
|
||||
role: "combobox",
|
||||
"aria-controls": context.contentId,
|
||||
"aria-controls": context.open ? context.contentId : void 0,
|
||||
"aria-expanded": context.open,
|
||||
"aria-required": context.required,
|
||||
"aria-autocomplete": "none",
|
||||
@@ -292,13 +304,15 @@ var SelectValue = React.forwardRef(
|
||||
(0, import_react_use_layout_effect.useLayoutEffect)(() => {
|
||||
onValueNodeHasChildrenChange(hasChildren);
|
||||
}, [onValueNodeHasChildrenChange, hasChildren]);
|
||||
const showPlaceholder = shouldShowPlaceholder(context.value);
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
import_react_primitive.Primitive.span,
|
||||
{
|
||||
...valueProps,
|
||||
asChild: showPlaceholder ? false : valueProps.asChild,
|
||||
ref: composedRefs,
|
||||
style: { pointerEvents: "none" },
|
||||
children: shouldShowPlaceholder(context.value) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: placeholder }) : children
|
||||
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(React.Fragment, { children: showPlaceholder ? placeholder : children }, showPlaceholder ? "placeholder" : "value")
|
||||
}
|
||||
);
|
||||
}
|
||||
@@ -313,37 +327,45 @@ var SelectIcon = React.forwardRef(
|
||||
);
|
||||
SelectIcon.displayName = ICON_NAME;
|
||||
var PORTAL_NAME = "SelectPortal";
|
||||
var [PortalProvider, usePortalContext] = createSelectContext(PORTAL_NAME, {
|
||||
forceMount: void 0
|
||||
});
|
||||
var SelectPortal = (props) => {
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_portal.Portal, { asChild: true, ...props });
|
||||
const { __scopeSelect, forceMount, ...portalProps } = props;
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PortalProvider, { scope: props.__scopeSelect, forceMount, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_portal.Portal, { asChild: true, ...portalProps }) });
|
||||
};
|
||||
SelectPortal.displayName = PORTAL_NAME;
|
||||
var CONTENT_NAME = "SelectContent";
|
||||
var SelectContent = React.forwardRef(
|
||||
(props, forwardedRef) => {
|
||||
const portalContext = usePortalContext(CONTENT_NAME, props.__scopeSelect);
|
||||
const { forceMount = portalContext.forceMount, ...contentProps } = props;
|
||||
const context = useSelectContext(CONTENT_NAME, props.__scopeSelect);
|
||||
const [fragment, setFragment] = React.useState();
|
||||
(0, import_react_use_layout_effect.useLayoutEffect)(() => {
|
||||
setFragment(new DocumentFragment());
|
||||
}, []);
|
||||
if (!context.open) {
|
||||
const frag = fragment;
|
||||
return frag ? ReactDOM.createPortal(
|
||||
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentProvider, { scope: props.__scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: props.__scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: props.children }) }) }),
|
||||
frag
|
||||
) : null;
|
||||
}
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentImpl, { ...props, ref: forwardedRef });
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_presence.Presence, { present: forceMount || context.open, children: ({ present }) => present ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentImpl, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentFragment, { ...contentProps, fragment }) });
|
||||
}
|
||||
);
|
||||
SelectContent.displayName = CONTENT_NAME;
|
||||
var SelectContentFragment = React.forwardRef((props, forwardedRef) => {
|
||||
const { __scopeSelect, children, fragment } = props;
|
||||
if (!fragment) return null;
|
||||
return ReactDOM.createPortal(
|
||||
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectContentProvider, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: forwardedRef, children }) }) }),
|
||||
fragment
|
||||
);
|
||||
});
|
||||
SelectContentFragment.displayName = "SelectContentFragment";
|
||||
var CONTENT_MARGIN = 10;
|
||||
var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME);
|
||||
var CONTENT_IMPL_NAME = "SelectContentImpl";
|
||||
var Slot = (0, import_react_slot.createSlot)("SelectContent.RemoveScroll");
|
||||
var SelectContentImpl = React.forwardRef(
|
||||
(props, forwardedRef) => {
|
||||
const { __scopeSelect } = props;
|
||||
const {
|
||||
__scopeSelect,
|
||||
position = "item-aligned",
|
||||
onCloseAutoFocus,
|
||||
onEscapeKeyDown,
|
||||
@@ -417,7 +439,7 @@ var SelectContentImpl = React.forwardRef(
|
||||
if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) {
|
||||
event.preventDefault();
|
||||
} else {
|
||||
if (!content.contains(event.target)) {
|
||||
if (!event.composedPath().includes(content)) {
|
||||
onOpenChange(false);
|
||||
}
|
||||
}
|
||||
@@ -1127,18 +1149,21 @@ var SelectArrow = React.forwardRef(
|
||||
(props, forwardedRef) => {
|
||||
const { __scopeSelect, ...arrowProps } = props;
|
||||
const popperScope = usePopperScope(__scopeSelect);
|
||||
const context = useSelectContext(ARROW_NAME, __scopeSelect);
|
||||
const contentContext = useSelectContentContext(ARROW_NAME, __scopeSelect);
|
||||
return context.open && contentContext.position === "popper" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperPrimitive.Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
|
||||
return contentContext.position === "popper" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperPrimitive.Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
|
||||
}
|
||||
);
|
||||
SelectArrow.displayName = ARROW_NAME;
|
||||
var BUBBLE_INPUT_NAME = "SelectBubbleInput";
|
||||
var SelectBubbleInput = React.forwardRef(
|
||||
({ __scopeSelect, value, ...props }, forwardedRef) => {
|
||||
({ __scopeSelect, ...props }, forwardedRef) => {
|
||||
const context = useSelectContext(BUBBLE_INPUT_NAME, __scopeSelect);
|
||||
const { value, onValueChange, required, disabled, name, autoComplete, form } = context;
|
||||
const { nativeOptions, nativeSelectKey } = context;
|
||||
const ref = React.useRef(null);
|
||||
const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, ref);
|
||||
const prevValue = (0, import_react_use_previous.usePrevious)(value);
|
||||
const selectValue = value ?? "";
|
||||
const prevValue = (0, import_react_use_previous.usePrevious)(selectValue);
|
||||
React.useEffect(() => {
|
||||
const select = ref.current;
|
||||
if (!select) return;
|
||||
@@ -1148,24 +1173,40 @@ var SelectBubbleInput = React.forwardRef(
|
||||
"value"
|
||||
);
|
||||
const setValue = descriptor.set;
|
||||
if (prevValue !== value && setValue) {
|
||||
if (prevValue !== selectValue && setValue) {
|
||||
const event = new Event("change", { bubbles: true });
|
||||
setValue.call(select, value);
|
||||
setValue.call(select, selectValue);
|
||||
select.dispatchEvent(event);
|
||||
}
|
||||
}, [prevValue, value]);
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
||||
}, [prevValue, selectValue]);
|
||||
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
||||
import_react_primitive.Primitive.select,
|
||||
{
|
||||
"aria-hidden": true,
|
||||
required,
|
||||
tabIndex: -1,
|
||||
name,
|
||||
autoComplete,
|
||||
disabled,
|
||||
form,
|
||||
onChange: (event) => onValueChange(event.target.value),
|
||||
...props,
|
||||
style: { ...import_react_visually_hidden.VISUALLY_HIDDEN_STYLES, ...props.style },
|
||||
ref: composedRefs,
|
||||
defaultValue: value
|
||||
}
|
||||
defaultValue: selectValue,
|
||||
children: [
|
||||
shouldShowPlaceholder(value) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "" }) : null,
|
||||
Array.from(nativeOptions)
|
||||
]
|
||||
},
|
||||
nativeSelectKey
|
||||
);
|
||||
}
|
||||
);
|
||||
SelectBubbleInput.displayName = BUBBLE_INPUT_NAME;
|
||||
function isFunction(value) {
|
||||
return typeof value === "function";
|
||||
}
|
||||
function shouldShowPlaceholder(value) {
|
||||
return value === "" || value === void 0;
|
||||
}
|
||||
@@ -1209,20 +1250,4 @@ function findNextItem(items, search, currentItem) {
|
||||
function wrapArray(array, startIndex) {
|
||||
return array.map((_, index) => array[(startIndex + index) % array.length]);
|
||||
}
|
||||
var Root2 = Select;
|
||||
var Trigger = SelectTrigger;
|
||||
var Value = SelectValue;
|
||||
var Icon = SelectIcon;
|
||||
var Portal = SelectPortal;
|
||||
var Content2 = SelectContent;
|
||||
var Viewport = SelectViewport;
|
||||
var Group = SelectGroup;
|
||||
var Label = SelectLabel;
|
||||
var Item = SelectItem;
|
||||
var ItemText = SelectItemText;
|
||||
var ItemIndicator = SelectItemIndicator;
|
||||
var ScrollUpButton = SelectScrollUpButton;
|
||||
var ScrollDownButton = SelectScrollDownButton;
|
||||
var Separator = SelectSeparator;
|
||||
var Arrow2 = SelectArrow;
|
||||
//# sourceMappingURL=index.js.map
|
||||
|
||||
+3
-3
File diff suppressed because one or more lines are too long
+141
-116
@@ -16,6 +16,7 @@ import { useId } from "@radix-ui/react-id";
|
||||
import * as PopperPrimitive from "@radix-ui/react-popper";
|
||||
import { createPopperScope } from "@radix-ui/react-popper";
|
||||
import { Portal as PortalPrimitive } from "@radix-ui/react-portal";
|
||||
import { Presence } from "@radix-ui/react-presence";
|
||||
import { Primitive } from "@radix-ui/react-primitive";
|
||||
import { createSlot } from "@radix-ui/react-slot";
|
||||
import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
|
||||
@@ -25,7 +26,7 @@ import { usePrevious } from "@radix-ui/react-use-previous";
|
||||
import { VISUALLY_HIDDEN_STYLES } from "@radix-ui/react-visually-hidden";
|
||||
import { hideOthers } from "aria-hidden";
|
||||
import { RemoveScroll } from "react-remove-scroll";
|
||||
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
||||
import { Fragment as Fragment2, jsx, jsxs } from "react/jsx-runtime";
|
||||
var OPEN_KEYS = [" ", "Enter", "ArrowUp", "ArrowDown"];
|
||||
var SELECTION_KEYS = [" ", "Enter"];
|
||||
var SELECT_NAME = "Select";
|
||||
@@ -35,9 +36,10 @@ var [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME, [
|
||||
createPopperScope
|
||||
]);
|
||||
var usePopperScope = createPopperScope();
|
||||
var [SelectProvider, useSelectContext] = createSelectContext(SELECT_NAME);
|
||||
var [SelectProviderImpl, useSelectContext] = createSelectContext(SELECT_NAME);
|
||||
var [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME);
|
||||
var Select = (props) => {
|
||||
var PROVIDER_NAME = "SelectProvider";
|
||||
function SelectProvider(props) {
|
||||
const {
|
||||
__scopeSelect,
|
||||
children,
|
||||
@@ -52,7 +54,9 @@ var Select = (props) => {
|
||||
autoComplete,
|
||||
disabled,
|
||||
required,
|
||||
form
|
||||
form,
|
||||
// @ts-expect-error internal render prop used by `Select` to compose its default parts
|
||||
internal_do_not_use_render
|
||||
} = props;
|
||||
const popperScope = usePopperScope(__scopeSelect);
|
||||
const [trigger, setTrigger] = React.useState(null);
|
||||
@@ -72,68 +76,72 @@ var Select = (props) => {
|
||||
caller: SELECT_NAME
|
||||
});
|
||||
const triggerPointerDownPosRef = React.useRef(null);
|
||||
const isFormControl = trigger ? form || !!trigger.closest("form") : true;
|
||||
const isFormControl = trigger ? !!form || !!trigger.closest("form") : true;
|
||||
const [nativeOptionsSet, setNativeOptionsSet] = React.useState(/* @__PURE__ */ new Set());
|
||||
const contentId = useId();
|
||||
const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
|
||||
return /* @__PURE__ */ jsx(PopperPrimitive.Root, { ...popperScope, children: /* @__PURE__ */ jsxs(
|
||||
const handleNativeOptionAdd = React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => new Set(prev).add(option));
|
||||
}, []);
|
||||
const handleNativeOptionRemove = React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => {
|
||||
const optionsSet = new Set(prev);
|
||||
optionsSet.delete(option);
|
||||
return optionsSet;
|
||||
});
|
||||
}, []);
|
||||
const context = {
|
||||
required,
|
||||
trigger,
|
||||
onTriggerChange: setTrigger,
|
||||
valueNode,
|
||||
onValueNodeChange: setValueNode,
|
||||
valueNodeHasChildren,
|
||||
onValueNodeHasChildrenChange: setValueNodeHasChildren,
|
||||
contentId,
|
||||
value,
|
||||
onValueChange: setValue,
|
||||
open,
|
||||
onOpenChange: setOpen,
|
||||
dir: direction,
|
||||
triggerPointerDownPosRef,
|
||||
disabled,
|
||||
name,
|
||||
autoComplete,
|
||||
form,
|
||||
nativeOptions: nativeOptionsSet,
|
||||
nativeSelectKey,
|
||||
isFormControl
|
||||
};
|
||||
return /* @__PURE__ */ jsx(PopperPrimitive.Root, { ...popperScope, children: /* @__PURE__ */ jsx(SelectProviderImpl, { scope: __scopeSelect, ...context, children: /* @__PURE__ */ jsx(Collection.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(
|
||||
SelectNativeOptionsProvider,
|
||||
{
|
||||
scope: __scopeSelect,
|
||||
onNativeOptionAdd: handleNativeOptionAdd,
|
||||
onNativeOptionRemove: handleNativeOptionRemove,
|
||||
children: isFunction(internal_do_not_use_render) ? internal_do_not_use_render(context) : children
|
||||
}
|
||||
) }) }) });
|
||||
}
|
||||
SelectProvider.displayName = PROVIDER_NAME;
|
||||
var Select = (props) => {
|
||||
const { __scopeSelect, children, ...providerProps } = props;
|
||||
return /* @__PURE__ */ jsx(
|
||||
SelectProvider,
|
||||
{
|
||||
required,
|
||||
scope: __scopeSelect,
|
||||
trigger,
|
||||
onTriggerChange: setTrigger,
|
||||
valueNode,
|
||||
onValueNodeChange: setValueNode,
|
||||
valueNodeHasChildren,
|
||||
onValueNodeHasChildrenChange: setValueNodeHasChildren,
|
||||
contentId: useId(),
|
||||
value,
|
||||
onValueChange: setValue,
|
||||
open,
|
||||
onOpenChange: setOpen,
|
||||
dir: direction,
|
||||
triggerPointerDownPosRef,
|
||||
disabled,
|
||||
children: [
|
||||
/* @__PURE__ */ jsx(Collection.Provider, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(
|
||||
SelectNativeOptionsProvider,
|
||||
{
|
||||
scope: props.__scopeSelect,
|
||||
onNativeOptionAdd: React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => new Set(prev).add(option));
|
||||
}, []),
|
||||
onNativeOptionRemove: React.useCallback((option) => {
|
||||
setNativeOptionsSet((prev) => {
|
||||
const optionsSet = new Set(prev);
|
||||
optionsSet.delete(option);
|
||||
return optionsSet;
|
||||
});
|
||||
}, []),
|
||||
children
|
||||
}
|
||||
) }),
|
||||
isFormControl ? /* @__PURE__ */ jsxs(
|
||||
__scopeSelect,
|
||||
...providerProps,
|
||||
internal_do_not_use_render: ({ isFormControl }) => /* @__PURE__ */ jsxs(Fragment2, { children: [
|
||||
children,
|
||||
isFormControl ? /* @__PURE__ */ jsx(
|
||||
SelectBubbleInput,
|
||||
{
|
||||
"aria-hidden": true,
|
||||
required,
|
||||
tabIndex: -1,
|
||||
name,
|
||||
autoComplete,
|
||||
value,
|
||||
onChange: (event) => setValue(event.target.value),
|
||||
disabled,
|
||||
form,
|
||||
children: [
|
||||
value === void 0 ? /* @__PURE__ */ jsx("option", { value: "" }) : null,
|
||||
Array.from(nativeOptionsSet)
|
||||
]
|
||||
},
|
||||
nativeSelectKey
|
||||
__scopeSelect
|
||||
}
|
||||
) : null
|
||||
]
|
||||
] })
|
||||
}
|
||||
) });
|
||||
);
|
||||
};
|
||||
Select.displayName = SELECT_NAME;
|
||||
var TRIGGER_NAME = "SelectTrigger";
|
||||
@@ -171,7 +179,7 @@ var SelectTrigger = React.forwardRef(
|
||||
{
|
||||
type: "button",
|
||||
role: "combobox",
|
||||
"aria-controls": context.contentId,
|
||||
"aria-controls": context.open ? context.contentId : void 0,
|
||||
"aria-expanded": context.open,
|
||||
"aria-required": context.required,
|
||||
"aria-autocomplete": "none",
|
||||
@@ -225,13 +233,15 @@ var SelectValue = React.forwardRef(
|
||||
useLayoutEffect(() => {
|
||||
onValueNodeHasChildrenChange(hasChildren);
|
||||
}, [onValueNodeHasChildrenChange, hasChildren]);
|
||||
const showPlaceholder = shouldShowPlaceholder(context.value);
|
||||
return /* @__PURE__ */ jsx(
|
||||
Primitive.span,
|
||||
{
|
||||
...valueProps,
|
||||
asChild: showPlaceholder ? false : valueProps.asChild,
|
||||
ref: composedRefs,
|
||||
style: { pointerEvents: "none" },
|
||||
children: shouldShowPlaceholder(context.value) ? /* @__PURE__ */ jsx(Fragment, { children: placeholder }) : children
|
||||
children: /* @__PURE__ */ jsx(React.Fragment, { children: showPlaceholder ? placeholder : children }, showPlaceholder ? "placeholder" : "value")
|
||||
}
|
||||
);
|
||||
}
|
||||
@@ -246,37 +256,45 @@ var SelectIcon = React.forwardRef(
|
||||
);
|
||||
SelectIcon.displayName = ICON_NAME;
|
||||
var PORTAL_NAME = "SelectPortal";
|
||||
var [PortalProvider, usePortalContext] = createSelectContext(PORTAL_NAME, {
|
||||
forceMount: void 0
|
||||
});
|
||||
var SelectPortal = (props) => {
|
||||
return /* @__PURE__ */ jsx(PortalPrimitive, { asChild: true, ...props });
|
||||
const { __scopeSelect, forceMount, ...portalProps } = props;
|
||||
return /* @__PURE__ */ jsx(PortalProvider, { scope: props.__scopeSelect, forceMount, children: /* @__PURE__ */ jsx(PortalPrimitive, { asChild: true, ...portalProps }) });
|
||||
};
|
||||
SelectPortal.displayName = PORTAL_NAME;
|
||||
var CONTENT_NAME = "SelectContent";
|
||||
var SelectContent = React.forwardRef(
|
||||
(props, forwardedRef) => {
|
||||
const portalContext = usePortalContext(CONTENT_NAME, props.__scopeSelect);
|
||||
const { forceMount = portalContext.forceMount, ...contentProps } = props;
|
||||
const context = useSelectContext(CONTENT_NAME, props.__scopeSelect);
|
||||
const [fragment, setFragment] = React.useState();
|
||||
useLayoutEffect(() => {
|
||||
setFragment(new DocumentFragment());
|
||||
}, []);
|
||||
if (!context.open) {
|
||||
const frag = fragment;
|
||||
return frag ? ReactDOM.createPortal(
|
||||
/* @__PURE__ */ jsx(SelectContentProvider, { scope: props.__scopeSelect, children: /* @__PURE__ */ jsx(Collection.Slot, { scope: props.__scopeSelect, children: /* @__PURE__ */ jsx("div", { children: props.children }) }) }),
|
||||
frag
|
||||
) : null;
|
||||
}
|
||||
return /* @__PURE__ */ jsx(SelectContentImpl, { ...props, ref: forwardedRef });
|
||||
return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: ({ present }) => present ? /* @__PURE__ */ jsx(SelectContentImpl, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(SelectContentFragment, { ...contentProps, fragment }) });
|
||||
}
|
||||
);
|
||||
SelectContent.displayName = CONTENT_NAME;
|
||||
var SelectContentFragment = React.forwardRef((props, forwardedRef) => {
|
||||
const { __scopeSelect, children, fragment } = props;
|
||||
if (!fragment) return null;
|
||||
return ReactDOM.createPortal(
|
||||
/* @__PURE__ */ jsx(SelectContentProvider, { scope: __scopeSelect, children: /* @__PURE__ */ jsx(Collection.Slot, { scope: __scopeSelect, children: /* @__PURE__ */ jsx("div", { ref: forwardedRef, children }) }) }),
|
||||
fragment
|
||||
);
|
||||
});
|
||||
SelectContentFragment.displayName = "SelectContentFragment";
|
||||
var CONTENT_MARGIN = 10;
|
||||
var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME);
|
||||
var CONTENT_IMPL_NAME = "SelectContentImpl";
|
||||
var Slot = createSlot("SelectContent.RemoveScroll");
|
||||
var SelectContentImpl = React.forwardRef(
|
||||
(props, forwardedRef) => {
|
||||
const { __scopeSelect } = props;
|
||||
const {
|
||||
__scopeSelect,
|
||||
position = "item-aligned",
|
||||
onCloseAutoFocus,
|
||||
onEscapeKeyDown,
|
||||
@@ -350,7 +368,7 @@ var SelectContentImpl = React.forwardRef(
|
||||
if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) {
|
||||
event.preventDefault();
|
||||
} else {
|
||||
if (!content.contains(event.target)) {
|
||||
if (!event.composedPath().includes(content)) {
|
||||
onOpenChange(false);
|
||||
}
|
||||
}
|
||||
@@ -713,7 +731,7 @@ var SelectViewport = React.forwardRef(
|
||||
const viewportContext = useSelectViewportContext(VIEWPORT_NAME, __scopeSelect);
|
||||
const composedRefs = useComposedRefs(forwardedRef, contentContext.onViewportChange);
|
||||
const prevScrollTopRef = React.useRef(0);
|
||||
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
||||
return /* @__PURE__ */ jsxs(Fragment2, { children: [
|
||||
/* @__PURE__ */ jsx(
|
||||
"style",
|
||||
{
|
||||
@@ -920,7 +938,7 @@ var SelectItemText = React.forwardRef(
|
||||
onNativeOptionAdd(nativeOption);
|
||||
return () => onNativeOptionRemove(nativeOption);
|
||||
}, [onNativeOptionAdd, onNativeOptionRemove, nativeOption]);
|
||||
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
||||
return /* @__PURE__ */ jsxs(Fragment2, { children: [
|
||||
/* @__PURE__ */ jsx(Primitive.span, { id: itemContext.textId, ...itemTextProps, ref: composedRefs }),
|
||||
itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren ? ReactDOM.createPortal(itemTextProps.children, context.valueNode) : null
|
||||
] });
|
||||
@@ -1060,18 +1078,21 @@ var SelectArrow = React.forwardRef(
|
||||
(props, forwardedRef) => {
|
||||
const { __scopeSelect, ...arrowProps } = props;
|
||||
const popperScope = usePopperScope(__scopeSelect);
|
||||
const context = useSelectContext(ARROW_NAME, __scopeSelect);
|
||||
const contentContext = useSelectContentContext(ARROW_NAME, __scopeSelect);
|
||||
return context.open && contentContext.position === "popper" ? /* @__PURE__ */ jsx(PopperPrimitive.Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
|
||||
return contentContext.position === "popper" ? /* @__PURE__ */ jsx(PopperPrimitive.Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
|
||||
}
|
||||
);
|
||||
SelectArrow.displayName = ARROW_NAME;
|
||||
var BUBBLE_INPUT_NAME = "SelectBubbleInput";
|
||||
var SelectBubbleInput = React.forwardRef(
|
||||
({ __scopeSelect, value, ...props }, forwardedRef) => {
|
||||
({ __scopeSelect, ...props }, forwardedRef) => {
|
||||
const context = useSelectContext(BUBBLE_INPUT_NAME, __scopeSelect);
|
||||
const { value, onValueChange, required, disabled, name, autoComplete, form } = context;
|
||||
const { nativeOptions, nativeSelectKey } = context;
|
||||
const ref = React.useRef(null);
|
||||
const composedRefs = useComposedRefs(forwardedRef, ref);
|
||||
const prevValue = usePrevious(value);
|
||||
const selectValue = value ?? "";
|
||||
const prevValue = usePrevious(selectValue);
|
||||
React.useEffect(() => {
|
||||
const select = ref.current;
|
||||
if (!select) return;
|
||||
@@ -1081,24 +1102,40 @@ var SelectBubbleInput = React.forwardRef(
|
||||
"value"
|
||||
);
|
||||
const setValue = descriptor.set;
|
||||
if (prevValue !== value && setValue) {
|
||||
if (prevValue !== selectValue && setValue) {
|
||||
const event = new Event("change", { bubbles: true });
|
||||
setValue.call(select, value);
|
||||
setValue.call(select, selectValue);
|
||||
select.dispatchEvent(event);
|
||||
}
|
||||
}, [prevValue, value]);
|
||||
return /* @__PURE__ */ jsx(
|
||||
}, [prevValue, selectValue]);
|
||||
return /* @__PURE__ */ jsxs(
|
||||
Primitive.select,
|
||||
{
|
||||
"aria-hidden": true,
|
||||
required,
|
||||
tabIndex: -1,
|
||||
name,
|
||||
autoComplete,
|
||||
disabled,
|
||||
form,
|
||||
onChange: (event) => onValueChange(event.target.value),
|
||||
...props,
|
||||
style: { ...VISUALLY_HIDDEN_STYLES, ...props.style },
|
||||
ref: composedRefs,
|
||||
defaultValue: value
|
||||
}
|
||||
defaultValue: selectValue,
|
||||
children: [
|
||||
shouldShowPlaceholder(value) ? /* @__PURE__ */ jsx("option", { value: "" }) : null,
|
||||
Array.from(nativeOptions)
|
||||
]
|
||||
},
|
||||
nativeSelectKey
|
||||
);
|
||||
}
|
||||
);
|
||||
SelectBubbleInput.displayName = BUBBLE_INPUT_NAME;
|
||||
function isFunction(value) {
|
||||
return typeof value === "function";
|
||||
}
|
||||
function shouldShowPlaceholder(value) {
|
||||
return value === "" || value === void 0;
|
||||
}
|
||||
@@ -1142,35 +1179,19 @@ function findNextItem(items, search, currentItem) {
|
||||
function wrapArray(array, startIndex) {
|
||||
return array.map((_, index) => array[(startIndex + index) % array.length]);
|
||||
}
|
||||
var Root2 = Select;
|
||||
var Trigger = SelectTrigger;
|
||||
var Value = SelectValue;
|
||||
var Icon = SelectIcon;
|
||||
var Portal = SelectPortal;
|
||||
var Content2 = SelectContent;
|
||||
var Viewport = SelectViewport;
|
||||
var Group = SelectGroup;
|
||||
var Label = SelectLabel;
|
||||
var Item = SelectItem;
|
||||
var ItemText = SelectItemText;
|
||||
var ItemIndicator = SelectItemIndicator;
|
||||
var ScrollUpButton = SelectScrollUpButton;
|
||||
var ScrollDownButton = SelectScrollDownButton;
|
||||
var Separator = SelectSeparator;
|
||||
var Arrow2 = SelectArrow;
|
||||
export {
|
||||
Arrow2 as Arrow,
|
||||
Content2 as Content,
|
||||
Group,
|
||||
Icon,
|
||||
Item,
|
||||
ItemIndicator,
|
||||
ItemText,
|
||||
Label,
|
||||
Portal,
|
||||
Root2 as Root,
|
||||
ScrollDownButton,
|
||||
ScrollUpButton,
|
||||
SelectArrow as Arrow,
|
||||
SelectContent as Content,
|
||||
SelectGroup as Group,
|
||||
SelectIcon as Icon,
|
||||
SelectItem as Item,
|
||||
SelectItemIndicator as ItemIndicator,
|
||||
SelectItemText as ItemText,
|
||||
SelectLabel as Label,
|
||||
SelectPortal as Portal,
|
||||
Select as Root,
|
||||
SelectScrollDownButton as ScrollDownButton,
|
||||
SelectScrollUpButton as ScrollUpButton,
|
||||
Select,
|
||||
SelectArrow,
|
||||
SelectContent,
|
||||
@@ -1187,10 +1208,14 @@ export {
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
SelectViewport,
|
||||
Separator,
|
||||
Trigger,
|
||||
Value,
|
||||
Viewport,
|
||||
createSelectScope
|
||||
SelectSeparator as Separator,
|
||||
SelectTrigger as Trigger,
|
||||
SelectValue as Value,
|
||||
SelectViewport as Viewport,
|
||||
createSelectScope,
|
||||
SelectBubbleInput as unstable_BubbleInput,
|
||||
SelectProvider as unstable_Provider,
|
||||
SelectBubbleInput as unstable_SelectBubbleInput,
|
||||
SelectProvider as unstable_SelectProvider
|
||||
};
|
||||
//# sourceMappingURL=index.mjs.map
|
||||
|
||||
+3
-3
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user