@tamagui/select 1.0.1-beta.114 → 1.0.1-beta.115
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Select.js +11 -9
- package/dist/cjs/Select.js.map +2 -2
- package/dist/cjs/index.js +0 -18
- package/dist/cjs/index.js.map +2 -2
- package/dist/esm/Select.js +11 -9
- package/dist/esm/Select.js.map +2 -2
- package/dist/esm/index.js +0 -12
- package/dist/esm/index.js.map +2 -2
- package/dist/jsx/Select.js +11 -1
- package/dist/jsx/Select.js.map +2 -2
- package/dist/jsx/index.js +0 -12
- package/dist/jsx/index.js.map +2 -2
- package/package.json +12 -12
- package/src/Select.tsx +12 -9
- package/src/index.tsx +1 -1
- package/types/Select.d.ts +69 -69
- package/types/Select.d.ts.map +1 -1
- package/types/SelectViewport.d.ts +9 -9
- package/types/SelectViewport.native.d.ts +6 -6
- package/types/index.d.ts +1 -1
- package/types/index.d.ts.map +1 -1
package/dist/cjs/Select.js
CHANGED
|
@@ -60,6 +60,16 @@ function getVisualOffsetTop() {
|
|
|
60
60
|
return !/^((?!chrome|android).)*safari/i.test(userAgent) ? (visualViewport == null ? void 0 : visualViewport.offsetTop) ?? 0 : 0;
|
|
61
61
|
}
|
|
62
62
|
const TRIGGER_NAME = "SelectTrigger";
|
|
63
|
+
const SelectTriggerFrame = (0, import_core2.styled)(import_list_item.ListItem, {
|
|
64
|
+
componentName: TRIGGER_NAME,
|
|
65
|
+
backgrounded: true,
|
|
66
|
+
radiused: true,
|
|
67
|
+
hoverTheme: true,
|
|
68
|
+
pressTheme: true,
|
|
69
|
+
focusTheme: true,
|
|
70
|
+
focusable: false,
|
|
71
|
+
borderWidth: 1
|
|
72
|
+
});
|
|
63
73
|
const SelectTrigger = React.forwardRef((props, forwardedRef) => {
|
|
64
74
|
const {
|
|
65
75
|
__scopeSelect,
|
|
@@ -69,15 +79,7 @@ const SelectTrigger = React.forwardRef((props, forwardedRef) => {
|
|
|
69
79
|
} = props;
|
|
70
80
|
const context = (0, import_context.useSelectContext)(TRIGGER_NAME, __scopeSelect);
|
|
71
81
|
const labelledBy = ariaLabelledby;
|
|
72
|
-
return /* @__PURE__ */ React.createElement(
|
|
73
|
-
backgrounded: true,
|
|
74
|
-
radiused: true,
|
|
75
|
-
hoverTheme: true,
|
|
76
|
-
pressTheme: true,
|
|
77
|
-
focusTheme: true,
|
|
78
|
-
focusable: false,
|
|
79
|
-
borderWidth: 1,
|
|
80
|
-
componentName: TRIGGER_NAME,
|
|
82
|
+
return /* @__PURE__ */ React.createElement(SelectTriggerFrame, {
|
|
81
83
|
size: context.size,
|
|
82
84
|
"aria-expanded": context.open,
|
|
83
85
|
"aria-autocomplete": "none",
|
package/dist/cjs/Select.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Select.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isWeb, useMedia } from '@tamagui/core'\nimport { styled, useGet, useIsomorphicLayoutEffect, withStaticProperties } from '@tamagui/core'\nimport { useId } from '@tamagui/core'\nimport { ListItem, ListItemProps } from '@tamagui/list-item'\nimport { PortalHost } from '@tamagui/portal'\nimport { Separator } from '@tamagui/separator'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectImplProps, SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectContextValue, SelectProps } from './types'\n\n// Cross browser fixes for pinch-zooming/backdrop-filter \uD83D\uDE44\nconst userAgent = (typeof navigator !== 'undefined' && navigator.userAgent) || ''\nexport const isFirefox = userAgent.toLowerCase().includes('firefox')\nexport function getVisualOffsetTop() {\n return !/^((?!chrome|android).)*safari/i.test(userAgent) ? visualViewport?.offsetTop ?? 0 : 0\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'SelectTrigger'\n\nexport type SelectTriggerProps = ListItemProps\n\nexport const SelectTrigger = React.forwardRef<TamaguiElement, SelectTriggerProps>(\n (props: ScopedProps<SelectTriggerProps>, forwardedRef) => {\n const {\n __scopeSelect,\n disabled = false,\n // @ts-ignore\n 'aria-labelledby': ariaLabelledby,\n ...triggerProps\n } = props\n const context = useSelectContext(TRIGGER_NAME, __scopeSelect)\n // const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange)\n // const getItems = useCollection(__scopeSelect)\n // const labelId = useLabelContext(context.trigger)\n const labelledBy = ariaLabelledby // || labelId\n\n return (\n <ListItem\n backgrounded\n radiused\n hoverTheme\n pressTheme\n focusTheme\n focusable={false}\n borderWidth={1}\n componentName={TRIGGER_NAME}\n size={context.size}\n // aria-controls={context.contentId}\n aria-expanded={context.open}\n aria-autocomplete=\"none\"\n aria-labelledby={labelledBy}\n dir={context.dir}\n disabled={disabled}\n data-disabled={disabled ? '' : undefined}\n {...triggerProps}\n ref={forwardedRef}\n {...(context.interactions\n ? context.interactions.getReferenceProps()\n : {\n onPress() {\n context.setOpen(!context.open)\n },\n })}\n />\n )\n }\n)\n\nSelectTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectValue\n * -----------------------------------------------------------------------------------------------*/\n\nconst VALUE_NAME = 'SelectValue'\n\nconst SelectValueFrame = styled(Paragraph, {\n name: VALUE_NAME,\n selectable: false,\n})\n\ntype SelectValueProps = GetProps<typeof SelectValueFrame> & {\n placeholder?: React.ReactNode\n}\n\nconst SelectValue = SelectValueFrame.extractable(\n React.forwardRef<TamaguiElement, SelectValueProps>(\n (\n { __scopeSelect, children: childrenProp, placeholder }: ScopedProps<SelectValueProps>,\n forwardedRef\n ) => {\n // We ignore `className` and `style` as this part shouldn't be styled.\n const context = useSelectContext(VALUE_NAME, __scopeSelect)\n const { onValueNodeHasChildrenChange } = context\n const hasChildren = childrenProp !== undefined\n const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n React.useLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\n\n const children = childrenProp ?? context.selectedItem\n\n return (\n <SelectValueFrame\n size={context.size}\n ref={composedRefs}\n // we don't want events from the portalled `SelectValue` children to bubble\n // through the item they came from\n pointerEvents=\"none\"\n >\n {context.value === undefined && placeholder !== undefined ? placeholder : children}\n </SelectValueFrame>\n )\n }\n )\n)\n\nSelectValue.displayName = VALUE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectIcon\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectIcon = styled(XStack, {\n name: 'SelectIcon',\n // @ts-ignore\n 'aria-hidden': true,\n children: <Paragraph>\u25BC</Paragraph>,\n})\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'SelectItem'\n\ntype SelectItemContextValue = {\n value: string\n textId: string\n isSelected: boolean\n onItemTextChange(node: TamaguiElement | null): void\n}\n\nconst [SelectItemContextProvider, useSelectItemContext] =\n createSelectContext<SelectItemContextValue>(ITEM_NAME)\n\nexport interface SelectItemProps extends YStackProps {\n value: string\n index: number\n disabled?: boolean\n textValue?: string\n}\n\nexport const SelectItem = React.forwardRef<TamaguiElement, SelectItemProps>(\n (props: ScopedProps<SelectItemProps>, forwardedRef) => {\n const {\n __scopeSelect,\n value,\n disabled = false,\n textValue: textValueProp,\n index,\n ...itemProps\n } = props\n const context = useSelectContext(ITEM_NAME, __scopeSelect)\n const isSelected = context.value === value\n const [textValue, setTextValue] = React.useState(textValueProp ?? '')\n const [isFocused, setIsFocused] = React.useState(false)\n const textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n activeIndex,\n setActiveIndex,\n setValueAtIndex,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(\n forwardedRef,\n (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n }\n // isSelected ? context.onSelectedItemChange : undefined\n )\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n const timeoutRef = React.useRef<any>()\n const [allowMouseUp, setAllowMouseUp] = React.useState(false)\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n React.useLayoutEffect(() => {\n clearTimeout(timeoutRef.current)\n if (open) {\n if (selectedIndex !== index) {\n setAllowMouseUp(true)\n } else {\n timeoutRef.current = setTimeout(() => {\n setAllowMouseUp(true)\n }, 300)\n }\n } else {\n setAllowMouseUp(false)\n }\n }, [open, index, setActiveIndex, selectedIndex])\n\n function handleKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Enter' || (event.key === ' ' && !dataRef?.current.typing)) {\n event.preventDefault()\n handleSelect()\n }\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onClick: allowMouseUp ? handleSelect : undefined,\n onMouseUp: allowMouseUp ? handleSelect : undefined,\n onKeyDown: handleKeyDown,\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n onItemTextChange={React.useCallback((node) => {\n // @ts-ignore\n setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? '').trim())\n }, [])}\n >\n <ListItem\n backgrounded\n pressTheme\n focusTheme\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n // `isFocused` caveat fixes stuttering in VoiceOver\n aria-selected={isSelected && isFocused}\n data-state={isSelected ? 'active' : 'inactive'}\n aria-disabled={disabled || undefined}\n data-disabled={disabled ? '' : undefined}\n tabIndex={disabled ? undefined : -1}\n size={context.size}\n {...itemProps}\n {...selectItemProps}\n />\n </SelectItemContextProvider>\n )\n }\n)\n\nSelectItem.displayName = ITEM_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemText\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_TEXT_NAME = 'SelectItemText'\n\nexport const SelectItemTextFrame = styled(Paragraph, {\n name: ITEM_TEXT_NAME,\n selectable: false,\n})\n\ntype SelectItemTextProps = GetProps<typeof SelectItemTextFrame>\n\nconst SelectItemText = React.forwardRef<TamaguiElement, SelectItemTextProps>(\n (props: ScopedProps<SelectItemTextProps>, forwardedRef) => {\n const { __scopeSelect, className, ...itemTextProps } = props\n const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect)\n const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect)\n const ref = React.useRef<TamaguiElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange)\n const isSelected = itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren\n\n const contents = (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n if (!isWeb) {\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected])\n }\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {isWeb && isSelected\n ? ReactDOM.createPortal(itemTextProps.children, context.valueNode!)\n : null}\n\n {/* Portal an option in the bubble select */}\n {/* {context.bubbleSelect\n ? ReactDOM.createPortal(\n // we use `.textContent` because `option` only support `string` or `number`\n <option value={itemContext.value}>{ref.current?.textContent}</option>,\n context.bubbleSelect\n )\n : null} */}\n </>\n )\n }\n)\n\nSelectItemText.displayName = ITEM_TEXT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_INDICATOR_NAME = 'SelectItemIndicator'\n\nconst SelectItemIndicatorFrame = styled(XStack, {\n name: ITEM_TEXT_NAME,\n})\n\ntype SelectItemIndicatorProps = GetProps<typeof SelectItemIndicatorFrame>\n\nconst SelectItemIndicator = React.forwardRef<TamaguiElement, SelectItemIndicatorProps>(\n (props: ScopedProps<SelectItemIndicatorProps>, forwardedRef) => {\n const { __scopeSelect, ...itemIndicatorProps } = props\n const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect)\n return itemContext.isSelected ? (\n <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} />\n ) : null\n }\n)\n\nSelectItemIndicator.displayName = ITEM_INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'SelectGroup'\n\ntype SelectGroupContextValue = { id: string }\n\nconst [SelectGroupContextProvider, useSelectGroupContext] =\n createSelectContext<SelectGroupContextValue>(GROUP_NAME)\n\nexport const SelectGroupFrame = styled(YStack, {\n name: GROUP_NAME,\n width: '100%',\n})\n\ntype SelectGroupProps = GetProps<typeof SelectGroupFrame>\n\nconst SelectGroup = React.forwardRef<TamaguiElement, SelectGroupProps>(\n (props: ScopedProps<SelectGroupProps>, forwardedRef) => {\n const { __scopeSelect, ...groupProps } = props\n const groupId = useId()\n return (\n <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ''}>\n <SelectGroupFrame\n // @ts-ignore\n role=\"group\"\n aria-labelledby={groupId}\n {...groupProps}\n ref={forwardedRef}\n />\n </SelectGroupContextProvider>\n )\n }\n)\n\nSelectGroup.displayName = GROUP_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectLabel\n * -----------------------------------------------------------------------------------------------*/\n\nconst LABEL_NAME = 'SelectLabel'\n\nexport type SelectLabelProps = ListItemProps\n\nconst SelectLabel = React.forwardRef<TamaguiElement, SelectLabelProps>(\n (props: ScopedProps<SelectLabelProps>, forwardedRef) => {\n const { __scopeSelect, ...labelProps } = props\n const context = useSelectContext(LABEL_NAME, __scopeSelect)\n const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect)\n return (\n <ListItem\n componentName={LABEL_NAME}\n fontWeight=\"800\"\n id={groupContext.id}\n size={context.size}\n {...labelProps}\n // @ts-expect-error\n ref={forwardedRef}\n />\n )\n }\n)\n\nSelectLabel.displayName = LABEL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSeparator\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectSeparator = styled(Separator, {\n name: 'SelectSeparator',\n})\n\nexport const useSelectBreakpointActive = (\n sheetBreakpoint: SelectContextValue['sheetBreakpoint']\n) => {\n const media = useMedia()\n return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n return context.open === false ? false : breakpointActive\n}\n\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }\n) => {\n const context = useSelectContext('SelectSheetController', props.__scopeSelect)\n const showSheet = useShowSelectSheet(context)\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n const getShowSheet = useGet(showSheet)\n\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'SelectSheetContents'\n\nexport const SelectSheetContents = ({ __scopeSelect }: ScopedProps<{}>) => {\n const context = useSelectContext(SHEET_CONTENTS_NAME, __scopeSelect)\n return <PortalHost name={`${context.scopeKey}SheetContents`} />\n}\n\nSelectSheetContents.displayName = SHEET_CONTENTS_NAME\n\nconst SelectSheetImpl = (props: SelectImplProps) => {\n return <>{props.children}</>\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Select\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Select = withStaticProperties(\n (props: ScopedProps<SelectProps>) => {\n const {\n __scopeSelect,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n value: valueProp,\n defaultValue,\n onValueChange,\n size: sizeProp = '$4',\n sheetBreakpoint = false,\n dir,\n } = props\n\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet ? SelectSheetImpl : SelectInlineImpl\n const forceUpdate = React.useReducer(() => ({}), {})[1]\n const [selectedItem, setSelectedItem] = React.useState<React.ReactNode>(null)\n\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen || false,\n onChange: onOpenChange,\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n })\n\n const [activeIndex, setActiveIndex] = React.useState<number | null>(null)\n const selectedIndexRef = React.useRef<number | null>(null)\n const activeIndexRef = React.useRef<number | null>(null)\n\n const listContentRef = React.useRef<string[]>([])\n\n const [selectedIndex, setSelectedIndex] = React.useState(\n Math.max(0, listContentRef.current.indexOf(value))\n )\n\n const [valueNode, setValueNode] = React.useState<HTMLElement | null>(null)\n const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false)\n\n useIsomorphicLayoutEffect(() => {\n selectedIndexRef.current = selectedIndex\n activeIndexRef.current = activeIndex\n })\n\n return (\n <SelectProvider\n dir={dir}\n size={sizeProp}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={__scopeSelect ? Object.keys(__scopeSelect)[0] : ''}\n sheetBreakpoint={sheetBreakpoint}\n scope={__scopeSelect}\n setValueAtIndex={(index, value) => {\n listContentRef.current[index] = value\n }}\n activeIndex={activeIndex}\n onChange={setValue}\n selectedIndex={selectedIndex}\n setActiveIndex={setActiveIndex}\n setOpen={setOpen}\n setSelectedIndex={setSelectedIndex}\n value={value}\n open={open}\n >\n <SelectSheetController onChangeOpen={setOpen} __scopeSelect={__scopeSelect}>\n <SelectImpl\n activeIndexRef={activeIndexRef}\n listContentRef={listContentRef}\n selectedIndexRef={selectedIndexRef}\n {...props}\n open={open}\n value={value}\n >\n {children}\n </SelectImpl>\n </SelectSheetController>\n </SelectProvider>\n )\n },\n {\n Content: SelectContent,\n Group: SelectGroup,\n Icon: SelectIcon,\n Item: SelectItem,\n ItemIndicator: SelectItemIndicator,\n ItemText: SelectItemText,\n Label: SelectLabel,\n ScrollDownButton: SelectScrollDownButton,\n ScrollUpButton: SelectScrollUpButton,\n Trigger: SelectTrigger,\n Value: SelectValue,\n Viewport: SelectViewport,\n SheetContents: SelectSheetContents,\n Sheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAgC;AAChC,kBAA0D;AAC1D,mBAAgF;AAChF,mBAAsB;AACtB,uBAAwC;AACxC,oBAA2B;AAC3B,uBAA0B;AAC1B,mBAAuC;AACvC,oBAA4C;AAC5C,kBAA0B;AAC1B,oCAAqC;AACrC,YAAuB;AACvB,eAA0B;AAE1B,uBAA4B;AAC5B,qBAAsE;AACtE,2BAA8B;AAC9B,wBAAkD;AAClD,gCAA6D;AAC7D,4BAA+B;AAI/B,MAAM,YAAa,OAAO,cAAc,eAAe,UAAU,aAAc;AACxE,MAAM,YAAY,UAAU,YAAY,EAAE,SAAS,SAAS;AAC5D,8BAA8B;AACnC,SAAO,CAAC,iCAAiC,KAAK,SAAS,IAAI,kDAAgB,cAAa,IAAI;AAC9F;AAMA,MAAM,eAAe;
|
|
4
|
+
"sourcesContent": ["import { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isWeb, useMedia } from '@tamagui/core'\nimport { styled, useGet, useIsomorphicLayoutEffect, withStaticProperties } from '@tamagui/core'\nimport { useId } from '@tamagui/core'\nimport { ListItem, ListItemProps } from '@tamagui/list-item'\nimport { PortalHost } from '@tamagui/portal'\nimport { Separator } from '@tamagui/separator'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectImplProps, SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectContextValue, SelectProps } from './types'\n\n// Cross browser fixes for pinch-zooming/backdrop-filter \uD83D\uDE44\nconst userAgent = (typeof navigator !== 'undefined' && navigator.userAgent) || ''\nexport const isFirefox = userAgent.toLowerCase().includes('firefox')\nexport function getVisualOffsetTop() {\n return !/^((?!chrome|android).)*safari/i.test(userAgent) ? visualViewport?.offsetTop ?? 0 : 0\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'SelectTrigger'\n\nexport type SelectTriggerProps = ListItemProps\n\nconst SelectTriggerFrame = styled(ListItem, {\n componentName: TRIGGER_NAME,\n backgrounded: true,\n radiused: true,\n hoverTheme: true,\n pressTheme: true,\n focusTheme: true,\n focusable: false,\n borderWidth: 1,\n})\n\nexport const SelectTrigger = React.forwardRef<TamaguiElement, SelectTriggerProps>(\n (props: ScopedProps<SelectTriggerProps>, forwardedRef) => {\n const {\n __scopeSelect,\n disabled = false,\n // @ts-ignore\n 'aria-labelledby': ariaLabelledby,\n ...triggerProps\n } = props\n const context = useSelectContext(TRIGGER_NAME, __scopeSelect)\n // const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange)\n // const getItems = useCollection(__scopeSelect)\n // const labelId = useLabelContext(context.trigger)\n const labelledBy = ariaLabelledby // || labelId\n\n return (\n <SelectTriggerFrame\n size={context.size}\n // aria-controls={context.contentId}\n aria-expanded={context.open}\n aria-autocomplete=\"none\"\n aria-labelledby={labelledBy}\n dir={context.dir}\n disabled={disabled}\n data-disabled={disabled ? '' : undefined}\n {...triggerProps}\n ref={forwardedRef}\n {...(context.interactions\n ? context.interactions.getReferenceProps()\n : {\n onPress() {\n context.setOpen(!context.open)\n },\n })}\n />\n )\n }\n)\n\nSelectTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectValue\n * -----------------------------------------------------------------------------------------------*/\n\nconst VALUE_NAME = 'SelectValue'\n\nconst SelectValueFrame = styled(Paragraph, {\n name: VALUE_NAME,\n selectable: false,\n})\n\ntype SelectValueProps = GetProps<typeof SelectValueFrame> & {\n placeholder?: React.ReactNode\n}\n\nconst SelectValue = SelectValueFrame.extractable(\n React.forwardRef<TamaguiElement, SelectValueProps>(\n (\n { __scopeSelect, children: childrenProp, placeholder }: ScopedProps<SelectValueProps>,\n forwardedRef\n ) => {\n // We ignore `className` and `style` as this part shouldn't be styled.\n const context = useSelectContext(VALUE_NAME, __scopeSelect)\n const { onValueNodeHasChildrenChange } = context\n const hasChildren = childrenProp !== undefined\n const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n React.useLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\n\n const children = childrenProp ?? context.selectedItem\n\n return (\n <SelectValueFrame\n size={context.size}\n ref={composedRefs}\n // we don't want events from the portalled `SelectValue` children to bubble\n // through the item they came from\n pointerEvents=\"none\"\n >\n {context.value === undefined && placeholder !== undefined ? placeholder : children}\n </SelectValueFrame>\n )\n }\n )\n)\n\nSelectValue.displayName = VALUE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectIcon\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectIcon = styled(XStack, {\n name: 'SelectIcon',\n // @ts-ignore\n 'aria-hidden': true,\n children: <Paragraph>\u25BC</Paragraph>,\n})\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'SelectItem'\n\ntype SelectItemContextValue = {\n value: string\n textId: string\n isSelected: boolean\n onItemTextChange(node: TamaguiElement | null): void\n}\n\nconst [SelectItemContextProvider, useSelectItemContext] =\n createSelectContext<SelectItemContextValue>(ITEM_NAME)\n\nexport interface SelectItemProps extends YStackProps {\n value: string\n index: number\n disabled?: boolean\n textValue?: string\n}\n\nexport const SelectItem = React.forwardRef<TamaguiElement, SelectItemProps>(\n (props: ScopedProps<SelectItemProps>, forwardedRef) => {\n const {\n __scopeSelect,\n value,\n disabled = false,\n textValue: textValueProp,\n index,\n ...itemProps\n } = props\n const context = useSelectContext(ITEM_NAME, __scopeSelect)\n const isSelected = context.value === value\n const [textValue, setTextValue] = React.useState(textValueProp ?? '')\n const [isFocused, setIsFocused] = React.useState(false)\n const textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n activeIndex,\n setActiveIndex,\n setValueAtIndex,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(\n forwardedRef,\n (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n }\n // isSelected ? context.onSelectedItemChange : undefined\n )\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n const timeoutRef = React.useRef<any>()\n const [allowMouseUp, setAllowMouseUp] = React.useState(false)\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n React.useLayoutEffect(() => {\n clearTimeout(timeoutRef.current)\n if (open) {\n if (selectedIndex !== index) {\n setAllowMouseUp(true)\n } else {\n timeoutRef.current = setTimeout(() => {\n setAllowMouseUp(true)\n }, 300)\n }\n } else {\n setAllowMouseUp(false)\n }\n }, [open, index, setActiveIndex, selectedIndex])\n\n function handleKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Enter' || (event.key === ' ' && !dataRef?.current.typing)) {\n event.preventDefault()\n handleSelect()\n }\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onClick: allowMouseUp ? handleSelect : undefined,\n onMouseUp: allowMouseUp ? handleSelect : undefined,\n onKeyDown: handleKeyDown,\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n onItemTextChange={React.useCallback((node) => {\n // @ts-ignore\n setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? '').trim())\n }, [])}\n >\n <ListItem\n backgrounded\n pressTheme\n focusTheme\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n // `isFocused` caveat fixes stuttering in VoiceOver\n aria-selected={isSelected && isFocused}\n data-state={isSelected ? 'active' : 'inactive'}\n aria-disabled={disabled || undefined}\n data-disabled={disabled ? '' : undefined}\n tabIndex={disabled ? undefined : -1}\n size={context.size}\n {...itemProps}\n {...selectItemProps}\n />\n </SelectItemContextProvider>\n )\n }\n)\n\nSelectItem.displayName = ITEM_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemText\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_TEXT_NAME = 'SelectItemText'\n\nexport const SelectItemTextFrame = styled(Paragraph, {\n name: ITEM_TEXT_NAME,\n selectable: false,\n})\n\ntype SelectItemTextProps = GetProps<typeof SelectItemTextFrame>\n\nconst SelectItemText = React.forwardRef<TamaguiElement, SelectItemTextProps>(\n (props: ScopedProps<SelectItemTextProps>, forwardedRef) => {\n const { __scopeSelect, className, ...itemTextProps } = props\n const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect)\n const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect)\n const ref = React.useRef<TamaguiElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange)\n const isSelected = itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren\n\n const contents = (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n if (!isWeb) {\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected])\n }\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {isWeb && isSelected\n ? ReactDOM.createPortal(itemTextProps.children, context.valueNode!)\n : null}\n\n {/* Portal an option in the bubble select */}\n {/* {context.bubbleSelect\n ? ReactDOM.createPortal(\n // we use `.textContent` because `option` only support `string` or `number`\n <option value={itemContext.value}>{ref.current?.textContent}</option>,\n context.bubbleSelect\n )\n : null} */}\n </>\n )\n }\n)\n\nSelectItemText.displayName = ITEM_TEXT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_INDICATOR_NAME = 'SelectItemIndicator'\n\nconst SelectItemIndicatorFrame = styled(XStack, {\n name: ITEM_TEXT_NAME,\n})\n\ntype SelectItemIndicatorProps = GetProps<typeof SelectItemIndicatorFrame>\n\nconst SelectItemIndicator = React.forwardRef<TamaguiElement, SelectItemIndicatorProps>(\n (props: ScopedProps<SelectItemIndicatorProps>, forwardedRef) => {\n const { __scopeSelect, ...itemIndicatorProps } = props\n const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect)\n return itemContext.isSelected ? (\n <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} />\n ) : null\n }\n)\n\nSelectItemIndicator.displayName = ITEM_INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'SelectGroup'\n\ntype SelectGroupContextValue = { id: string }\n\nconst [SelectGroupContextProvider, useSelectGroupContext] =\n createSelectContext<SelectGroupContextValue>(GROUP_NAME)\n\nexport const SelectGroupFrame = styled(YStack, {\n name: GROUP_NAME,\n width: '100%',\n})\n\ntype SelectGroupProps = GetProps<typeof SelectGroupFrame>\n\nconst SelectGroup = React.forwardRef<TamaguiElement, SelectGroupProps>(\n (props: ScopedProps<SelectGroupProps>, forwardedRef) => {\n const { __scopeSelect, ...groupProps } = props\n const groupId = useId()\n return (\n <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ''}>\n <SelectGroupFrame\n // @ts-ignore\n role=\"group\"\n aria-labelledby={groupId}\n {...groupProps}\n ref={forwardedRef}\n />\n </SelectGroupContextProvider>\n )\n }\n)\n\nSelectGroup.displayName = GROUP_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectLabel\n * -----------------------------------------------------------------------------------------------*/\n\nconst LABEL_NAME = 'SelectLabel'\n\nexport type SelectLabelProps = ListItemProps\n\nconst SelectLabel = React.forwardRef<TamaguiElement, SelectLabelProps>(\n (props: ScopedProps<SelectLabelProps>, forwardedRef) => {\n const { __scopeSelect, ...labelProps } = props\n const context = useSelectContext(LABEL_NAME, __scopeSelect)\n const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect)\n return (\n <ListItem\n componentName={LABEL_NAME}\n fontWeight=\"800\"\n id={groupContext.id}\n size={context.size}\n {...labelProps}\n // @ts-expect-error\n ref={forwardedRef}\n />\n )\n }\n)\n\nSelectLabel.displayName = LABEL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSeparator\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectSeparator = styled(Separator, {\n name: 'SelectSeparator',\n})\n\nexport const useSelectBreakpointActive = (\n sheetBreakpoint: SelectContextValue['sheetBreakpoint']\n) => {\n const media = useMedia()\n return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n return context.open === false ? false : breakpointActive\n}\n\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }\n) => {\n const context = useSelectContext('SelectSheetController', props.__scopeSelect)\n const showSheet = useShowSelectSheet(context)\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n const getShowSheet = useGet(showSheet)\n\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'SelectSheetContents'\n\nexport const SelectSheetContents = ({ __scopeSelect }: ScopedProps<{}>) => {\n const context = useSelectContext(SHEET_CONTENTS_NAME, __scopeSelect)\n return <PortalHost name={`${context.scopeKey}SheetContents`} />\n}\n\nSelectSheetContents.displayName = SHEET_CONTENTS_NAME\n\nconst SelectSheetImpl = (props: SelectImplProps) => {\n return <>{props.children}</>\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Select\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Select = withStaticProperties(\n (props: ScopedProps<SelectProps>) => {\n const {\n __scopeSelect,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n value: valueProp,\n defaultValue,\n onValueChange,\n size: sizeProp = '$4',\n sheetBreakpoint = false,\n dir,\n } = props\n\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet ? SelectSheetImpl : SelectInlineImpl\n const forceUpdate = React.useReducer(() => ({}), {})[1]\n const [selectedItem, setSelectedItem] = React.useState<React.ReactNode>(null)\n\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen || false,\n onChange: onOpenChange,\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n })\n\n const [activeIndex, setActiveIndex] = React.useState<number | null>(null)\n const selectedIndexRef = React.useRef<number | null>(null)\n const activeIndexRef = React.useRef<number | null>(null)\n\n const listContentRef = React.useRef<string[]>([])\n\n const [selectedIndex, setSelectedIndex] = React.useState(\n Math.max(0, listContentRef.current.indexOf(value))\n )\n\n const [valueNode, setValueNode] = React.useState<HTMLElement | null>(null)\n const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false)\n\n useIsomorphicLayoutEffect(() => {\n selectedIndexRef.current = selectedIndex\n activeIndexRef.current = activeIndex\n })\n\n return (\n <SelectProvider\n dir={dir}\n size={sizeProp}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={__scopeSelect ? Object.keys(__scopeSelect)[0] : ''}\n sheetBreakpoint={sheetBreakpoint}\n scope={__scopeSelect}\n setValueAtIndex={(index, value) => {\n listContentRef.current[index] = value\n }}\n activeIndex={activeIndex}\n onChange={setValue}\n selectedIndex={selectedIndex}\n setActiveIndex={setActiveIndex}\n setOpen={setOpen}\n setSelectedIndex={setSelectedIndex}\n value={value}\n open={open}\n >\n <SelectSheetController onChangeOpen={setOpen} __scopeSelect={__scopeSelect}>\n <SelectImpl\n activeIndexRef={activeIndexRef}\n listContentRef={listContentRef}\n selectedIndexRef={selectedIndexRef}\n {...props}\n open={open}\n value={value}\n >\n {children}\n </SelectImpl>\n </SelectSheetController>\n </SelectProvider>\n )\n },\n {\n Content: SelectContent,\n Group: SelectGroup,\n Icon: SelectIcon,\n Item: SelectItem,\n ItemIndicator: SelectItemIndicator,\n ItemText: SelectItemText,\n Label: SelectLabel,\n ScrollDownButton: SelectScrollDownButton,\n ScrollUpButton: SelectScrollUpButton,\n Trigger: SelectTrigger,\n Value: SelectValue,\n Viewport: SelectViewport,\n SheetContents: SelectSheetContents,\n Sheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -3,10 +3,6 @@ var __defProp = Object.defineProperty;
|
|
|
3
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
6
|
var __copyProps = (to, from, except, desc) => {
|
|
11
7
|
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
8
|
for (let key of __getOwnPropNames(from))
|
|
@@ -18,21 +14,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
14
|
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
19
15
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
16
|
var src_exports = {};
|
|
21
|
-
__export(src_exports, {
|
|
22
|
-
SelectContentProps: () => import_types.SelectContentProps,
|
|
23
|
-
SelectProps: () => import_types.SelectProps,
|
|
24
|
-
SelectScrollButtonProps: () => import_types.SelectScrollButtonProps,
|
|
25
|
-
SelectViewportProps: () => import_types.SelectViewportProps
|
|
26
|
-
});
|
|
27
17
|
module.exports = __toCommonJS(src_exports);
|
|
28
18
|
__reExport(src_exports, require("./Select"), module.exports);
|
|
29
|
-
var import_types = require("./types");
|
|
30
19
|
__reExport(src_exports, require("./context"), module.exports);
|
|
31
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
32
|
-
0 && (module.exports = {
|
|
33
|
-
SelectContentProps,
|
|
34
|
-
SelectProps,
|
|
35
|
-
SelectScrollButtonProps,
|
|
36
|
-
SelectViewportProps
|
|
37
|
-
});
|
|
38
20
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["export * from './Select'\nexport {\n SelectContentProps,\n SelectProps,\n SelectScrollButtonProps,\n SelectViewportProps,\n} from './types'\nexport * from './context'\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["export * from './Select'\nexport type {\n SelectContentProps,\n SelectProps,\n SelectScrollButtonProps,\n SelectViewportProps,\n} from './types'\nexport * from './context'\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,qBAAd;AAOA,wBAAc,sBAPd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/Select.js
CHANGED
|
@@ -23,6 +23,16 @@ function getVisualOffsetTop() {
|
|
|
23
23
|
return !/^((?!chrome|android).)*safari/i.test(userAgent) ? (visualViewport == null ? void 0 : visualViewport.offsetTop) ?? 0 : 0;
|
|
24
24
|
}
|
|
25
25
|
const TRIGGER_NAME = "SelectTrigger";
|
|
26
|
+
const SelectTriggerFrame = styled(ListItem, {
|
|
27
|
+
componentName: TRIGGER_NAME,
|
|
28
|
+
backgrounded: true,
|
|
29
|
+
radiused: true,
|
|
30
|
+
hoverTheme: true,
|
|
31
|
+
pressTheme: true,
|
|
32
|
+
focusTheme: true,
|
|
33
|
+
focusable: false,
|
|
34
|
+
borderWidth: 1
|
|
35
|
+
});
|
|
26
36
|
const SelectTrigger = React.forwardRef((props, forwardedRef) => {
|
|
27
37
|
const {
|
|
28
38
|
__scopeSelect,
|
|
@@ -32,15 +42,7 @@ const SelectTrigger = React.forwardRef((props, forwardedRef) => {
|
|
|
32
42
|
} = props;
|
|
33
43
|
const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
|
|
34
44
|
const labelledBy = ariaLabelledby;
|
|
35
|
-
return /* @__PURE__ */ React.createElement(
|
|
36
|
-
backgrounded: true,
|
|
37
|
-
radiused: true,
|
|
38
|
-
hoverTheme: true,
|
|
39
|
-
pressTheme: true,
|
|
40
|
-
focusTheme: true,
|
|
41
|
-
focusable: false,
|
|
42
|
-
borderWidth: 1,
|
|
43
|
-
componentName: TRIGGER_NAME,
|
|
45
|
+
return /* @__PURE__ */ React.createElement(SelectTriggerFrame, {
|
|
44
46
|
size: context.size,
|
|
45
47
|
"aria-expanded": context.open,
|
|
46
48
|
"aria-autocomplete": "none",
|
package/dist/esm/Select.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Select.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isWeb, useMedia } from '@tamagui/core'\nimport { styled, useGet, useIsomorphicLayoutEffect, withStaticProperties } from '@tamagui/core'\nimport { useId } from '@tamagui/core'\nimport { ListItem, ListItemProps } from '@tamagui/list-item'\nimport { PortalHost } from '@tamagui/portal'\nimport { Separator } from '@tamagui/separator'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectImplProps, SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectContextValue, SelectProps } from './types'\n\n// Cross browser fixes for pinch-zooming/backdrop-filter \uD83D\uDE44\nconst userAgent = (typeof navigator !== 'undefined' && navigator.userAgent) || ''\nexport const isFirefox = userAgent.toLowerCase().includes('firefox')\nexport function getVisualOffsetTop() {\n return !/^((?!chrome|android).)*safari/i.test(userAgent) ? visualViewport?.offsetTop ?? 0 : 0\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'SelectTrigger'\n\nexport type SelectTriggerProps = ListItemProps\n\nexport const SelectTrigger = React.forwardRef<TamaguiElement, SelectTriggerProps>(\n (props: ScopedProps<SelectTriggerProps>, forwardedRef) => {\n const {\n __scopeSelect,\n disabled = false,\n // @ts-ignore\n 'aria-labelledby': ariaLabelledby,\n ...triggerProps\n } = props\n const context = useSelectContext(TRIGGER_NAME, __scopeSelect)\n // const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange)\n // const getItems = useCollection(__scopeSelect)\n // const labelId = useLabelContext(context.trigger)\n const labelledBy = ariaLabelledby // || labelId\n\n return (\n <ListItem\n backgrounded\n radiused\n hoverTheme\n pressTheme\n focusTheme\n focusable={false}\n borderWidth={1}\n componentName={TRIGGER_NAME}\n size={context.size}\n // aria-controls={context.contentId}\n aria-expanded={context.open}\n aria-autocomplete=\"none\"\n aria-labelledby={labelledBy}\n dir={context.dir}\n disabled={disabled}\n data-disabled={disabled ? '' : undefined}\n {...triggerProps}\n ref={forwardedRef}\n {...(context.interactions\n ? context.interactions.getReferenceProps()\n : {\n onPress() {\n context.setOpen(!context.open)\n },\n })}\n />\n )\n }\n)\n\nSelectTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectValue\n * -----------------------------------------------------------------------------------------------*/\n\nconst VALUE_NAME = 'SelectValue'\n\nconst SelectValueFrame = styled(Paragraph, {\n name: VALUE_NAME,\n selectable: false,\n})\n\ntype SelectValueProps = GetProps<typeof SelectValueFrame> & {\n placeholder?: React.ReactNode\n}\n\nconst SelectValue = SelectValueFrame.extractable(\n React.forwardRef<TamaguiElement, SelectValueProps>(\n (\n { __scopeSelect, children: childrenProp, placeholder }: ScopedProps<SelectValueProps>,\n forwardedRef\n ) => {\n // We ignore `className` and `style` as this part shouldn't be styled.\n const context = useSelectContext(VALUE_NAME, __scopeSelect)\n const { onValueNodeHasChildrenChange } = context\n const hasChildren = childrenProp !== undefined\n const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n React.useLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\n\n const children = childrenProp ?? context.selectedItem\n\n return (\n <SelectValueFrame\n size={context.size}\n ref={composedRefs}\n // we don't want events from the portalled `SelectValue` children to bubble\n // through the item they came from\n pointerEvents=\"none\"\n >\n {context.value === undefined && placeholder !== undefined ? placeholder : children}\n </SelectValueFrame>\n )\n }\n )\n)\n\nSelectValue.displayName = VALUE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectIcon\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectIcon = styled(XStack, {\n name: 'SelectIcon',\n // @ts-ignore\n 'aria-hidden': true,\n children: <Paragraph>\u25BC</Paragraph>,\n})\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'SelectItem'\n\ntype SelectItemContextValue = {\n value: string\n textId: string\n isSelected: boolean\n onItemTextChange(node: TamaguiElement | null): void\n}\n\nconst [SelectItemContextProvider, useSelectItemContext] =\n createSelectContext<SelectItemContextValue>(ITEM_NAME)\n\nexport interface SelectItemProps extends YStackProps {\n value: string\n index: number\n disabled?: boolean\n textValue?: string\n}\n\nexport const SelectItem = React.forwardRef<TamaguiElement, SelectItemProps>(\n (props: ScopedProps<SelectItemProps>, forwardedRef) => {\n const {\n __scopeSelect,\n value,\n disabled = false,\n textValue: textValueProp,\n index,\n ...itemProps\n } = props\n const context = useSelectContext(ITEM_NAME, __scopeSelect)\n const isSelected = context.value === value\n const [textValue, setTextValue] = React.useState(textValueProp ?? '')\n const [isFocused, setIsFocused] = React.useState(false)\n const textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n activeIndex,\n setActiveIndex,\n setValueAtIndex,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(\n forwardedRef,\n (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n }\n // isSelected ? context.onSelectedItemChange : undefined\n )\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n const timeoutRef = React.useRef<any>()\n const [allowMouseUp, setAllowMouseUp] = React.useState(false)\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n React.useLayoutEffect(() => {\n clearTimeout(timeoutRef.current)\n if (open) {\n if (selectedIndex !== index) {\n setAllowMouseUp(true)\n } else {\n timeoutRef.current = setTimeout(() => {\n setAllowMouseUp(true)\n }, 300)\n }\n } else {\n setAllowMouseUp(false)\n }\n }, [open, index, setActiveIndex, selectedIndex])\n\n function handleKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Enter' || (event.key === ' ' && !dataRef?.current.typing)) {\n event.preventDefault()\n handleSelect()\n }\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onClick: allowMouseUp ? handleSelect : undefined,\n onMouseUp: allowMouseUp ? handleSelect : undefined,\n onKeyDown: handleKeyDown,\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n onItemTextChange={React.useCallback((node) => {\n // @ts-ignore\n setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? '').trim())\n }, [])}\n >\n <ListItem\n backgrounded\n pressTheme\n focusTheme\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n // `isFocused` caveat fixes stuttering in VoiceOver\n aria-selected={isSelected && isFocused}\n data-state={isSelected ? 'active' : 'inactive'}\n aria-disabled={disabled || undefined}\n data-disabled={disabled ? '' : undefined}\n tabIndex={disabled ? undefined : -1}\n size={context.size}\n {...itemProps}\n {...selectItemProps}\n />\n </SelectItemContextProvider>\n )\n }\n)\n\nSelectItem.displayName = ITEM_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemText\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_TEXT_NAME = 'SelectItemText'\n\nexport const SelectItemTextFrame = styled(Paragraph, {\n name: ITEM_TEXT_NAME,\n selectable: false,\n})\n\ntype SelectItemTextProps = GetProps<typeof SelectItemTextFrame>\n\nconst SelectItemText = React.forwardRef<TamaguiElement, SelectItemTextProps>(\n (props: ScopedProps<SelectItemTextProps>, forwardedRef) => {\n const { __scopeSelect, className, ...itemTextProps } = props\n const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect)\n const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect)\n const ref = React.useRef<TamaguiElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange)\n const isSelected = itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren\n\n const contents = (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n if (!isWeb) {\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected])\n }\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {isWeb && isSelected\n ? ReactDOM.createPortal(itemTextProps.children, context.valueNode!)\n : null}\n\n {/* Portal an option in the bubble select */}\n {/* {context.bubbleSelect\n ? ReactDOM.createPortal(\n // we use `.textContent` because `option` only support `string` or `number`\n <option value={itemContext.value}>{ref.current?.textContent}</option>,\n context.bubbleSelect\n )\n : null} */}\n </>\n )\n }\n)\n\nSelectItemText.displayName = ITEM_TEXT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_INDICATOR_NAME = 'SelectItemIndicator'\n\nconst SelectItemIndicatorFrame = styled(XStack, {\n name: ITEM_TEXT_NAME,\n})\n\ntype SelectItemIndicatorProps = GetProps<typeof SelectItemIndicatorFrame>\n\nconst SelectItemIndicator = React.forwardRef<TamaguiElement, SelectItemIndicatorProps>(\n (props: ScopedProps<SelectItemIndicatorProps>, forwardedRef) => {\n const { __scopeSelect, ...itemIndicatorProps } = props\n const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect)\n return itemContext.isSelected ? (\n <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} />\n ) : null\n }\n)\n\nSelectItemIndicator.displayName = ITEM_INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'SelectGroup'\n\ntype SelectGroupContextValue = { id: string }\n\nconst [SelectGroupContextProvider, useSelectGroupContext] =\n createSelectContext<SelectGroupContextValue>(GROUP_NAME)\n\nexport const SelectGroupFrame = styled(YStack, {\n name: GROUP_NAME,\n width: '100%',\n})\n\ntype SelectGroupProps = GetProps<typeof SelectGroupFrame>\n\nconst SelectGroup = React.forwardRef<TamaguiElement, SelectGroupProps>(\n (props: ScopedProps<SelectGroupProps>, forwardedRef) => {\n const { __scopeSelect, ...groupProps } = props\n const groupId = useId()\n return (\n <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ''}>\n <SelectGroupFrame\n // @ts-ignore\n role=\"group\"\n aria-labelledby={groupId}\n {...groupProps}\n ref={forwardedRef}\n />\n </SelectGroupContextProvider>\n )\n }\n)\n\nSelectGroup.displayName = GROUP_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectLabel\n * -----------------------------------------------------------------------------------------------*/\n\nconst LABEL_NAME = 'SelectLabel'\n\nexport type SelectLabelProps = ListItemProps\n\nconst SelectLabel = React.forwardRef<TamaguiElement, SelectLabelProps>(\n (props: ScopedProps<SelectLabelProps>, forwardedRef) => {\n const { __scopeSelect, ...labelProps } = props\n const context = useSelectContext(LABEL_NAME, __scopeSelect)\n const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect)\n return (\n <ListItem\n componentName={LABEL_NAME}\n fontWeight=\"800\"\n id={groupContext.id}\n size={context.size}\n {...labelProps}\n // @ts-expect-error\n ref={forwardedRef}\n />\n )\n }\n)\n\nSelectLabel.displayName = LABEL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSeparator\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectSeparator = styled(Separator, {\n name: 'SelectSeparator',\n})\n\nexport const useSelectBreakpointActive = (\n sheetBreakpoint: SelectContextValue['sheetBreakpoint']\n) => {\n const media = useMedia()\n return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n return context.open === false ? false : breakpointActive\n}\n\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }\n) => {\n const context = useSelectContext('SelectSheetController', props.__scopeSelect)\n const showSheet = useShowSelectSheet(context)\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n const getShowSheet = useGet(showSheet)\n\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'SelectSheetContents'\n\nexport const SelectSheetContents = ({ __scopeSelect }: ScopedProps<{}>) => {\n const context = useSelectContext(SHEET_CONTENTS_NAME, __scopeSelect)\n return <PortalHost name={`${context.scopeKey}SheetContents`} />\n}\n\nSelectSheetContents.displayName = SHEET_CONTENTS_NAME\n\nconst SelectSheetImpl = (props: SelectImplProps) => {\n return <>{props.children}</>\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Select\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Select = withStaticProperties(\n (props: ScopedProps<SelectProps>) => {\n const {\n __scopeSelect,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n value: valueProp,\n defaultValue,\n onValueChange,\n size: sizeProp = '$4',\n sheetBreakpoint = false,\n dir,\n } = props\n\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet ? SelectSheetImpl : SelectInlineImpl\n const forceUpdate = React.useReducer(() => ({}), {})[1]\n const [selectedItem, setSelectedItem] = React.useState<React.ReactNode>(null)\n\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen || false,\n onChange: onOpenChange,\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n })\n\n const [activeIndex, setActiveIndex] = React.useState<number | null>(null)\n const selectedIndexRef = React.useRef<number | null>(null)\n const activeIndexRef = React.useRef<number | null>(null)\n\n const listContentRef = React.useRef<string[]>([])\n\n const [selectedIndex, setSelectedIndex] = React.useState(\n Math.max(0, listContentRef.current.indexOf(value))\n )\n\n const [valueNode, setValueNode] = React.useState<HTMLElement | null>(null)\n const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false)\n\n useIsomorphicLayoutEffect(() => {\n selectedIndexRef.current = selectedIndex\n activeIndexRef.current = activeIndex\n })\n\n return (\n <SelectProvider\n dir={dir}\n size={sizeProp}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={__scopeSelect ? Object.keys(__scopeSelect)[0] : ''}\n sheetBreakpoint={sheetBreakpoint}\n scope={__scopeSelect}\n setValueAtIndex={(index, value) => {\n listContentRef.current[index] = value\n }}\n activeIndex={activeIndex}\n onChange={setValue}\n selectedIndex={selectedIndex}\n setActiveIndex={setActiveIndex}\n setOpen={setOpen}\n setSelectedIndex={setSelectedIndex}\n value={value}\n open={open}\n >\n <SelectSheetController onChangeOpen={setOpen} __scopeSelect={__scopeSelect}>\n <SelectImpl\n activeIndexRef={activeIndexRef}\n listContentRef={listContentRef}\n selectedIndexRef={selectedIndexRef}\n {...props}\n open={open}\n value={value}\n >\n {children}\n </SelectImpl>\n </SelectSheetController>\n </SelectProvider>\n )\n },\n {\n Content: SelectContent,\n Group: SelectGroup,\n Icon: SelectIcon,\n Item: SelectItem,\n ItemIndicator: SelectItemIndicator,\n ItemText: SelectItemText,\n Label: SelectLabel,\n ScrollDownButton: SelectScrollDownButton,\n ScrollUpButton: SelectScrollUpButton,\n Trigger: SelectTrigger,\n Value: SelectValue,\n Viewport: SelectViewport,\n SheetContents: SelectSheetContents,\n Sheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
-
"mappings": "AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAIA,MAAM,YAAa,OAAO,cAAc,eAAe,UAAU,aAAc;AACxE,MAAM,YAAY,UAAU,YAAY,EAAE,SAAS,SAAS;AAC5D,8BAA8B;AACnC,SAAO,CAAC,iCAAiC,KAAK,SAAS,IAAI,kDAAgB,cAAa,IAAI;AAC9F;AAMA,MAAM,eAAe;
|
|
4
|
+
"sourcesContent": ["import { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isWeb, useMedia } from '@tamagui/core'\nimport { styled, useGet, useIsomorphicLayoutEffect, withStaticProperties } from '@tamagui/core'\nimport { useId } from '@tamagui/core'\nimport { ListItem, ListItemProps } from '@tamagui/list-item'\nimport { PortalHost } from '@tamagui/portal'\nimport { Separator } from '@tamagui/separator'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectImplProps, SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectContextValue, SelectProps } from './types'\n\n// Cross browser fixes for pinch-zooming/backdrop-filter \uD83D\uDE44\nconst userAgent = (typeof navigator !== 'undefined' && navigator.userAgent) || ''\nexport const isFirefox = userAgent.toLowerCase().includes('firefox')\nexport function getVisualOffsetTop() {\n return !/^((?!chrome|android).)*safari/i.test(userAgent) ? visualViewport?.offsetTop ?? 0 : 0\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'SelectTrigger'\n\nexport type SelectTriggerProps = ListItemProps\n\nconst SelectTriggerFrame = styled(ListItem, {\n componentName: TRIGGER_NAME,\n backgrounded: true,\n radiused: true,\n hoverTheme: true,\n pressTheme: true,\n focusTheme: true,\n focusable: false,\n borderWidth: 1,\n})\n\nexport const SelectTrigger = React.forwardRef<TamaguiElement, SelectTriggerProps>(\n (props: ScopedProps<SelectTriggerProps>, forwardedRef) => {\n const {\n __scopeSelect,\n disabled = false,\n // @ts-ignore\n 'aria-labelledby': ariaLabelledby,\n ...triggerProps\n } = props\n const context = useSelectContext(TRIGGER_NAME, __scopeSelect)\n // const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange)\n // const getItems = useCollection(__scopeSelect)\n // const labelId = useLabelContext(context.trigger)\n const labelledBy = ariaLabelledby // || labelId\n\n return (\n <SelectTriggerFrame\n size={context.size}\n // aria-controls={context.contentId}\n aria-expanded={context.open}\n aria-autocomplete=\"none\"\n aria-labelledby={labelledBy}\n dir={context.dir}\n disabled={disabled}\n data-disabled={disabled ? '' : undefined}\n {...triggerProps}\n ref={forwardedRef}\n {...(context.interactions\n ? context.interactions.getReferenceProps()\n : {\n onPress() {\n context.setOpen(!context.open)\n },\n })}\n />\n )\n }\n)\n\nSelectTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectValue\n * -----------------------------------------------------------------------------------------------*/\n\nconst VALUE_NAME = 'SelectValue'\n\nconst SelectValueFrame = styled(Paragraph, {\n name: VALUE_NAME,\n selectable: false,\n})\n\ntype SelectValueProps = GetProps<typeof SelectValueFrame> & {\n placeholder?: React.ReactNode\n}\n\nconst SelectValue = SelectValueFrame.extractable(\n React.forwardRef<TamaguiElement, SelectValueProps>(\n (\n { __scopeSelect, children: childrenProp, placeholder }: ScopedProps<SelectValueProps>,\n forwardedRef\n ) => {\n // We ignore `className` and `style` as this part shouldn't be styled.\n const context = useSelectContext(VALUE_NAME, __scopeSelect)\n const { onValueNodeHasChildrenChange } = context\n const hasChildren = childrenProp !== undefined\n const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n React.useLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\n\n const children = childrenProp ?? context.selectedItem\n\n return (\n <SelectValueFrame\n size={context.size}\n ref={composedRefs}\n // we don't want events from the portalled `SelectValue` children to bubble\n // through the item they came from\n pointerEvents=\"none\"\n >\n {context.value === undefined && placeholder !== undefined ? placeholder : children}\n </SelectValueFrame>\n )\n }\n )\n)\n\nSelectValue.displayName = VALUE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectIcon\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectIcon = styled(XStack, {\n name: 'SelectIcon',\n // @ts-ignore\n 'aria-hidden': true,\n children: <Paragraph>\u25BC</Paragraph>,\n})\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'SelectItem'\n\ntype SelectItemContextValue = {\n value: string\n textId: string\n isSelected: boolean\n onItemTextChange(node: TamaguiElement | null): void\n}\n\nconst [SelectItemContextProvider, useSelectItemContext] =\n createSelectContext<SelectItemContextValue>(ITEM_NAME)\n\nexport interface SelectItemProps extends YStackProps {\n value: string\n index: number\n disabled?: boolean\n textValue?: string\n}\n\nexport const SelectItem = React.forwardRef<TamaguiElement, SelectItemProps>(\n (props: ScopedProps<SelectItemProps>, forwardedRef) => {\n const {\n __scopeSelect,\n value,\n disabled = false,\n textValue: textValueProp,\n index,\n ...itemProps\n } = props\n const context = useSelectContext(ITEM_NAME, __scopeSelect)\n const isSelected = context.value === value\n const [textValue, setTextValue] = React.useState(textValueProp ?? '')\n const [isFocused, setIsFocused] = React.useState(false)\n const textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n activeIndex,\n setActiveIndex,\n setValueAtIndex,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(\n forwardedRef,\n (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n }\n // isSelected ? context.onSelectedItemChange : undefined\n )\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n const timeoutRef = React.useRef<any>()\n const [allowMouseUp, setAllowMouseUp] = React.useState(false)\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n React.useLayoutEffect(() => {\n clearTimeout(timeoutRef.current)\n if (open) {\n if (selectedIndex !== index) {\n setAllowMouseUp(true)\n } else {\n timeoutRef.current = setTimeout(() => {\n setAllowMouseUp(true)\n }, 300)\n }\n } else {\n setAllowMouseUp(false)\n }\n }, [open, index, setActiveIndex, selectedIndex])\n\n function handleKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Enter' || (event.key === ' ' && !dataRef?.current.typing)) {\n event.preventDefault()\n handleSelect()\n }\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onClick: allowMouseUp ? handleSelect : undefined,\n onMouseUp: allowMouseUp ? handleSelect : undefined,\n onKeyDown: handleKeyDown,\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n onItemTextChange={React.useCallback((node) => {\n // @ts-ignore\n setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? '').trim())\n }, [])}\n >\n <ListItem\n backgrounded\n pressTheme\n focusTheme\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n // `isFocused` caveat fixes stuttering in VoiceOver\n aria-selected={isSelected && isFocused}\n data-state={isSelected ? 'active' : 'inactive'}\n aria-disabled={disabled || undefined}\n data-disabled={disabled ? '' : undefined}\n tabIndex={disabled ? undefined : -1}\n size={context.size}\n {...itemProps}\n {...selectItemProps}\n />\n </SelectItemContextProvider>\n )\n }\n)\n\nSelectItem.displayName = ITEM_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemText\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_TEXT_NAME = 'SelectItemText'\n\nexport const SelectItemTextFrame = styled(Paragraph, {\n name: ITEM_TEXT_NAME,\n selectable: false,\n})\n\ntype SelectItemTextProps = GetProps<typeof SelectItemTextFrame>\n\nconst SelectItemText = React.forwardRef<TamaguiElement, SelectItemTextProps>(\n (props: ScopedProps<SelectItemTextProps>, forwardedRef) => {\n const { __scopeSelect, className, ...itemTextProps } = props\n const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect)\n const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect)\n const ref = React.useRef<TamaguiElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange)\n const isSelected = itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren\n\n const contents = (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n if (!isWeb) {\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected])\n }\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {isWeb && isSelected\n ? ReactDOM.createPortal(itemTextProps.children, context.valueNode!)\n : null}\n\n {/* Portal an option in the bubble select */}\n {/* {context.bubbleSelect\n ? ReactDOM.createPortal(\n // we use `.textContent` because `option` only support `string` or `number`\n <option value={itemContext.value}>{ref.current?.textContent}</option>,\n context.bubbleSelect\n )\n : null} */}\n </>\n )\n }\n)\n\nSelectItemText.displayName = ITEM_TEXT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_INDICATOR_NAME = 'SelectItemIndicator'\n\nconst SelectItemIndicatorFrame = styled(XStack, {\n name: ITEM_TEXT_NAME,\n})\n\ntype SelectItemIndicatorProps = GetProps<typeof SelectItemIndicatorFrame>\n\nconst SelectItemIndicator = React.forwardRef<TamaguiElement, SelectItemIndicatorProps>(\n (props: ScopedProps<SelectItemIndicatorProps>, forwardedRef) => {\n const { __scopeSelect, ...itemIndicatorProps } = props\n const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect)\n return itemContext.isSelected ? (\n <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} />\n ) : null\n }\n)\n\nSelectItemIndicator.displayName = ITEM_INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'SelectGroup'\n\ntype SelectGroupContextValue = { id: string }\n\nconst [SelectGroupContextProvider, useSelectGroupContext] =\n createSelectContext<SelectGroupContextValue>(GROUP_NAME)\n\nexport const SelectGroupFrame = styled(YStack, {\n name: GROUP_NAME,\n width: '100%',\n})\n\ntype SelectGroupProps = GetProps<typeof SelectGroupFrame>\n\nconst SelectGroup = React.forwardRef<TamaguiElement, SelectGroupProps>(\n (props: ScopedProps<SelectGroupProps>, forwardedRef) => {\n const { __scopeSelect, ...groupProps } = props\n const groupId = useId()\n return (\n <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ''}>\n <SelectGroupFrame\n // @ts-ignore\n role=\"group\"\n aria-labelledby={groupId}\n {...groupProps}\n ref={forwardedRef}\n />\n </SelectGroupContextProvider>\n )\n }\n)\n\nSelectGroup.displayName = GROUP_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectLabel\n * -----------------------------------------------------------------------------------------------*/\n\nconst LABEL_NAME = 'SelectLabel'\n\nexport type SelectLabelProps = ListItemProps\n\nconst SelectLabel = React.forwardRef<TamaguiElement, SelectLabelProps>(\n (props: ScopedProps<SelectLabelProps>, forwardedRef) => {\n const { __scopeSelect, ...labelProps } = props\n const context = useSelectContext(LABEL_NAME, __scopeSelect)\n const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect)\n return (\n <ListItem\n componentName={LABEL_NAME}\n fontWeight=\"800\"\n id={groupContext.id}\n size={context.size}\n {...labelProps}\n // @ts-expect-error\n ref={forwardedRef}\n />\n )\n }\n)\n\nSelectLabel.displayName = LABEL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSeparator\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectSeparator = styled(Separator, {\n name: 'SelectSeparator',\n})\n\nexport const useSelectBreakpointActive = (\n sheetBreakpoint: SelectContextValue['sheetBreakpoint']\n) => {\n const media = useMedia()\n return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n return context.open === false ? false : breakpointActive\n}\n\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }\n) => {\n const context = useSelectContext('SelectSheetController', props.__scopeSelect)\n const showSheet = useShowSelectSheet(context)\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n const getShowSheet = useGet(showSheet)\n\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'SelectSheetContents'\n\nexport const SelectSheetContents = ({ __scopeSelect }: ScopedProps<{}>) => {\n const context = useSelectContext(SHEET_CONTENTS_NAME, __scopeSelect)\n return <PortalHost name={`${context.scopeKey}SheetContents`} />\n}\n\nSelectSheetContents.displayName = SHEET_CONTENTS_NAME\n\nconst SelectSheetImpl = (props: SelectImplProps) => {\n return <>{props.children}</>\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Select\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Select = withStaticProperties(\n (props: ScopedProps<SelectProps>) => {\n const {\n __scopeSelect,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n value: valueProp,\n defaultValue,\n onValueChange,\n size: sizeProp = '$4',\n sheetBreakpoint = false,\n dir,\n } = props\n\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet ? SelectSheetImpl : SelectInlineImpl\n const forceUpdate = React.useReducer(() => ({}), {})[1]\n const [selectedItem, setSelectedItem] = React.useState<React.ReactNode>(null)\n\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen || false,\n onChange: onOpenChange,\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n })\n\n const [activeIndex, setActiveIndex] = React.useState<number | null>(null)\n const selectedIndexRef = React.useRef<number | null>(null)\n const activeIndexRef = React.useRef<number | null>(null)\n\n const listContentRef = React.useRef<string[]>([])\n\n const [selectedIndex, setSelectedIndex] = React.useState(\n Math.max(0, listContentRef.current.indexOf(value))\n )\n\n const [valueNode, setValueNode] = React.useState<HTMLElement | null>(null)\n const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false)\n\n useIsomorphicLayoutEffect(() => {\n selectedIndexRef.current = selectedIndex\n activeIndexRef.current = activeIndex\n })\n\n return (\n <SelectProvider\n dir={dir}\n size={sizeProp}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={__scopeSelect ? Object.keys(__scopeSelect)[0] : ''}\n sheetBreakpoint={sheetBreakpoint}\n scope={__scopeSelect}\n setValueAtIndex={(index, value) => {\n listContentRef.current[index] = value\n }}\n activeIndex={activeIndex}\n onChange={setValue}\n selectedIndex={selectedIndex}\n setActiveIndex={setActiveIndex}\n setOpen={setOpen}\n setSelectedIndex={setSelectedIndex}\n value={value}\n open={open}\n >\n <SelectSheetController onChangeOpen={setOpen} __scopeSelect={__scopeSelect}>\n <SelectImpl\n activeIndexRef={activeIndexRef}\n listContentRef={listContentRef}\n selectedIndexRef={selectedIndexRef}\n {...props}\n open={open}\n value={value}\n >\n {children}\n </SelectImpl>\n </SelectSheetController>\n </SelectProvider>\n )\n },\n {\n Content: SelectContent,\n Group: SelectGroup,\n Icon: SelectIcon,\n Item: SelectItem,\n ItemIndicator: SelectItemIndicator,\n ItemText: SelectItemText,\n Label: SelectLabel,\n ScrollDownButton: SelectScrollDownButton,\n ScrollUpButton: SelectScrollUpButton,\n Trigger: SelectTrigger,\n Value: SelectValue,\n Viewport: SelectViewport,\n SheetContents: SelectSheetContents,\n Sheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,15 +1,3 @@
|
|
|
1
1
|
export * from "./Select";
|
|
2
|
-
import {
|
|
3
|
-
SelectContentProps,
|
|
4
|
-
SelectProps,
|
|
5
|
-
SelectScrollButtonProps,
|
|
6
|
-
SelectViewportProps
|
|
7
|
-
} from "./types";
|
|
8
2
|
export * from "./context";
|
|
9
|
-
export {
|
|
10
|
-
SelectContentProps,
|
|
11
|
-
SelectProps,
|
|
12
|
-
SelectScrollButtonProps,
|
|
13
|
-
SelectViewportProps
|
|
14
|
-
};
|
|
15
3
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["export * from './Select'\nexport {\n SelectContentProps,\n SelectProps,\n SelectScrollButtonProps,\n SelectViewportProps,\n} from './types'\nexport * from './context'\n"],
|
|
5
|
-
"mappings": "AAAA;
|
|
4
|
+
"sourcesContent": ["export * from './Select'\nexport type {\n SelectContentProps,\n SelectProps,\n SelectScrollButtonProps,\n SelectViewportProps,\n} from './types'\nexport * from './context'\n"],
|
|
5
|
+
"mappings": "AAAA;AAOA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/jsx/Select.js
CHANGED
|
@@ -24,6 +24,16 @@ function getVisualOffsetTop() {
|
|
|
24
24
|
return !/^((?!chrome|android).)*safari/i.test(userAgent) ? (_a = visualViewport == null ? void 0 : visualViewport.offsetTop) != null ? _a : 0 : 0;
|
|
25
25
|
}
|
|
26
26
|
const TRIGGER_NAME = "SelectTrigger";
|
|
27
|
+
const SelectTriggerFrame = styled(ListItem, {
|
|
28
|
+
componentName: TRIGGER_NAME,
|
|
29
|
+
backgrounded: true,
|
|
30
|
+
radiused: true,
|
|
31
|
+
hoverTheme: true,
|
|
32
|
+
pressTheme: true,
|
|
33
|
+
focusTheme: true,
|
|
34
|
+
focusable: false,
|
|
35
|
+
borderWidth: 1
|
|
36
|
+
});
|
|
27
37
|
const SelectTrigger = React.forwardRef((props, forwardedRef) => {
|
|
28
38
|
const {
|
|
29
39
|
__scopeSelect,
|
|
@@ -33,7 +43,7 @@ const SelectTrigger = React.forwardRef((props, forwardedRef) => {
|
|
|
33
43
|
} = props;
|
|
34
44
|
const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
|
|
35
45
|
const labelledBy = ariaLabelledby;
|
|
36
|
-
return <
|
|
46
|
+
return <SelectTriggerFrame size={context.size} aria-expanded={context.open} aria-autocomplete="none" aria-labelledby={labelledBy} dir={context.dir} disabled={disabled} data-disabled={disabled ? "" : void 0} {...triggerProps} ref={forwardedRef} {...context.interactions ? context.interactions.getReferenceProps() : {
|
|
37
47
|
onPress() {
|
|
38
48
|
context.setOpen(!context.open);
|
|
39
49
|
}
|
package/dist/jsx/Select.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Select.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isWeb, useMedia } from '@tamagui/core'\nimport { styled, useGet, useIsomorphicLayoutEffect, withStaticProperties } from '@tamagui/core'\nimport { useId } from '@tamagui/core'\nimport { ListItem, ListItemProps } from '@tamagui/list-item'\nimport { PortalHost } from '@tamagui/portal'\nimport { Separator } from '@tamagui/separator'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectImplProps, SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectContextValue, SelectProps } from './types'\n\n// Cross browser fixes for pinch-zooming/backdrop-filter \uD83D\uDE44\nconst userAgent = (typeof navigator !== 'undefined' && navigator.userAgent) || ''\nexport const isFirefox = userAgent.toLowerCase().includes('firefox')\nexport function getVisualOffsetTop() {\n return !/^((?!chrome|android).)*safari/i.test(userAgent) ? visualViewport?.offsetTop ?? 0 : 0\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'SelectTrigger'\n\nexport type SelectTriggerProps = ListItemProps\n\nexport const SelectTrigger = React.forwardRef<TamaguiElement, SelectTriggerProps>(\n (props: ScopedProps<SelectTriggerProps>, forwardedRef) => {\n const {\n __scopeSelect,\n disabled = false,\n // @ts-ignore\n 'aria-labelledby': ariaLabelledby,\n ...triggerProps\n } = props\n const context = useSelectContext(TRIGGER_NAME, __scopeSelect)\n // const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange)\n // const getItems = useCollection(__scopeSelect)\n // const labelId = useLabelContext(context.trigger)\n const labelledBy = ariaLabelledby // || labelId\n\n return (\n <ListItem\n backgrounded\n radiused\n hoverTheme\n pressTheme\n focusTheme\n focusable={false}\n borderWidth={1}\n componentName={TRIGGER_NAME}\n size={context.size}\n // aria-controls={context.contentId}\n aria-expanded={context.open}\n aria-autocomplete=\"none\"\n aria-labelledby={labelledBy}\n dir={context.dir}\n disabled={disabled}\n data-disabled={disabled ? '' : undefined}\n {...triggerProps}\n ref={forwardedRef}\n {...(context.interactions\n ? context.interactions.getReferenceProps()\n : {\n onPress() {\n context.setOpen(!context.open)\n },\n })}\n />\n )\n }\n)\n\nSelectTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectValue\n * -----------------------------------------------------------------------------------------------*/\n\nconst VALUE_NAME = 'SelectValue'\n\nconst SelectValueFrame = styled(Paragraph, {\n name: VALUE_NAME,\n selectable: false,\n})\n\ntype SelectValueProps = GetProps<typeof SelectValueFrame> & {\n placeholder?: React.ReactNode\n}\n\nconst SelectValue = SelectValueFrame.extractable(\n React.forwardRef<TamaguiElement, SelectValueProps>(\n (\n { __scopeSelect, children: childrenProp, placeholder }: ScopedProps<SelectValueProps>,\n forwardedRef\n ) => {\n // We ignore `className` and `style` as this part shouldn't be styled.\n const context = useSelectContext(VALUE_NAME, __scopeSelect)\n const { onValueNodeHasChildrenChange } = context\n const hasChildren = childrenProp !== undefined\n const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n React.useLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\n\n const children = childrenProp ?? context.selectedItem\n\n return (\n <SelectValueFrame\n size={context.size}\n ref={composedRefs}\n // we don't want events from the portalled `SelectValue` children to bubble\n // through the item they came from\n pointerEvents=\"none\"\n >\n {context.value === undefined && placeholder !== undefined ? placeholder : children}\n </SelectValueFrame>\n )\n }\n )\n)\n\nSelectValue.displayName = VALUE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectIcon\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectIcon = styled(XStack, {\n name: 'SelectIcon',\n // @ts-ignore\n 'aria-hidden': true,\n children: <Paragraph>\u25BC</Paragraph>,\n})\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'SelectItem'\n\ntype SelectItemContextValue = {\n value: string\n textId: string\n isSelected: boolean\n onItemTextChange(node: TamaguiElement | null): void\n}\n\nconst [SelectItemContextProvider, useSelectItemContext] =\n createSelectContext<SelectItemContextValue>(ITEM_NAME)\n\nexport interface SelectItemProps extends YStackProps {\n value: string\n index: number\n disabled?: boolean\n textValue?: string\n}\n\nexport const SelectItem = React.forwardRef<TamaguiElement, SelectItemProps>(\n (props: ScopedProps<SelectItemProps>, forwardedRef) => {\n const {\n __scopeSelect,\n value,\n disabled = false,\n textValue: textValueProp,\n index,\n ...itemProps\n } = props\n const context = useSelectContext(ITEM_NAME, __scopeSelect)\n const isSelected = context.value === value\n const [textValue, setTextValue] = React.useState(textValueProp ?? '')\n const [isFocused, setIsFocused] = React.useState(false)\n const textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n activeIndex,\n setActiveIndex,\n setValueAtIndex,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(\n forwardedRef,\n (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n }\n // isSelected ? context.onSelectedItemChange : undefined\n )\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n const timeoutRef = React.useRef<any>()\n const [allowMouseUp, setAllowMouseUp] = React.useState(false)\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n React.useLayoutEffect(() => {\n clearTimeout(timeoutRef.current)\n if (open) {\n if (selectedIndex !== index) {\n setAllowMouseUp(true)\n } else {\n timeoutRef.current = setTimeout(() => {\n setAllowMouseUp(true)\n }, 300)\n }\n } else {\n setAllowMouseUp(false)\n }\n }, [open, index, setActiveIndex, selectedIndex])\n\n function handleKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Enter' || (event.key === ' ' && !dataRef?.current.typing)) {\n event.preventDefault()\n handleSelect()\n }\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onClick: allowMouseUp ? handleSelect : undefined,\n onMouseUp: allowMouseUp ? handleSelect : undefined,\n onKeyDown: handleKeyDown,\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n onItemTextChange={React.useCallback((node) => {\n // @ts-ignore\n setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? '').trim())\n }, [])}\n >\n <ListItem\n backgrounded\n pressTheme\n focusTheme\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n // `isFocused` caveat fixes stuttering in VoiceOver\n aria-selected={isSelected && isFocused}\n data-state={isSelected ? 'active' : 'inactive'}\n aria-disabled={disabled || undefined}\n data-disabled={disabled ? '' : undefined}\n tabIndex={disabled ? undefined : -1}\n size={context.size}\n {...itemProps}\n {...selectItemProps}\n />\n </SelectItemContextProvider>\n )\n }\n)\n\nSelectItem.displayName = ITEM_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemText\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_TEXT_NAME = 'SelectItemText'\n\nexport const SelectItemTextFrame = styled(Paragraph, {\n name: ITEM_TEXT_NAME,\n selectable: false,\n})\n\ntype SelectItemTextProps = GetProps<typeof SelectItemTextFrame>\n\nconst SelectItemText = React.forwardRef<TamaguiElement, SelectItemTextProps>(\n (props: ScopedProps<SelectItemTextProps>, forwardedRef) => {\n const { __scopeSelect, className, ...itemTextProps } = props\n const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect)\n const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect)\n const ref = React.useRef<TamaguiElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange)\n const isSelected = itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren\n\n const contents = (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n if (!isWeb) {\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected])\n }\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {isWeb && isSelected\n ? ReactDOM.createPortal(itemTextProps.children, context.valueNode!)\n : null}\n\n {/* Portal an option in the bubble select */}\n {/* {context.bubbleSelect\n ? ReactDOM.createPortal(\n // we use `.textContent` because `option` only support `string` or `number`\n <option value={itemContext.value}>{ref.current?.textContent}</option>,\n context.bubbleSelect\n )\n : null} */}\n </>\n )\n }\n)\n\nSelectItemText.displayName = ITEM_TEXT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_INDICATOR_NAME = 'SelectItemIndicator'\n\nconst SelectItemIndicatorFrame = styled(XStack, {\n name: ITEM_TEXT_NAME,\n})\n\ntype SelectItemIndicatorProps = GetProps<typeof SelectItemIndicatorFrame>\n\nconst SelectItemIndicator = React.forwardRef<TamaguiElement, SelectItemIndicatorProps>(\n (props: ScopedProps<SelectItemIndicatorProps>, forwardedRef) => {\n const { __scopeSelect, ...itemIndicatorProps } = props\n const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect)\n return itemContext.isSelected ? (\n <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} />\n ) : null\n }\n)\n\nSelectItemIndicator.displayName = ITEM_INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'SelectGroup'\n\ntype SelectGroupContextValue = { id: string }\n\nconst [SelectGroupContextProvider, useSelectGroupContext] =\n createSelectContext<SelectGroupContextValue>(GROUP_NAME)\n\nexport const SelectGroupFrame = styled(YStack, {\n name: GROUP_NAME,\n width: '100%',\n})\n\ntype SelectGroupProps = GetProps<typeof SelectGroupFrame>\n\nconst SelectGroup = React.forwardRef<TamaguiElement, SelectGroupProps>(\n (props: ScopedProps<SelectGroupProps>, forwardedRef) => {\n const { __scopeSelect, ...groupProps } = props\n const groupId = useId()\n return (\n <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ''}>\n <SelectGroupFrame\n // @ts-ignore\n role=\"group\"\n aria-labelledby={groupId}\n {...groupProps}\n ref={forwardedRef}\n />\n </SelectGroupContextProvider>\n )\n }\n)\n\nSelectGroup.displayName = GROUP_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectLabel\n * -----------------------------------------------------------------------------------------------*/\n\nconst LABEL_NAME = 'SelectLabel'\n\nexport type SelectLabelProps = ListItemProps\n\nconst SelectLabel = React.forwardRef<TamaguiElement, SelectLabelProps>(\n (props: ScopedProps<SelectLabelProps>, forwardedRef) => {\n const { __scopeSelect, ...labelProps } = props\n const context = useSelectContext(LABEL_NAME, __scopeSelect)\n const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect)\n return (\n <ListItem\n componentName={LABEL_NAME}\n fontWeight=\"800\"\n id={groupContext.id}\n size={context.size}\n {...labelProps}\n // @ts-expect-error\n ref={forwardedRef}\n />\n )\n }\n)\n\nSelectLabel.displayName = LABEL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSeparator\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectSeparator = styled(Separator, {\n name: 'SelectSeparator',\n})\n\nexport const useSelectBreakpointActive = (\n sheetBreakpoint: SelectContextValue['sheetBreakpoint']\n) => {\n const media = useMedia()\n return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n return context.open === false ? false : breakpointActive\n}\n\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }\n) => {\n const context = useSelectContext('SelectSheetController', props.__scopeSelect)\n const showSheet = useShowSelectSheet(context)\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n const getShowSheet = useGet(showSheet)\n\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'SelectSheetContents'\n\nexport const SelectSheetContents = ({ __scopeSelect }: ScopedProps<{}>) => {\n const context = useSelectContext(SHEET_CONTENTS_NAME, __scopeSelect)\n return <PortalHost name={`${context.scopeKey}SheetContents`} />\n}\n\nSelectSheetContents.displayName = SHEET_CONTENTS_NAME\n\nconst SelectSheetImpl = (props: SelectImplProps) => {\n return <>{props.children}</>\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Select\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Select = withStaticProperties(\n (props: ScopedProps<SelectProps>) => {\n const {\n __scopeSelect,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n value: valueProp,\n defaultValue,\n onValueChange,\n size: sizeProp = '$4',\n sheetBreakpoint = false,\n dir,\n } = props\n\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet ? SelectSheetImpl : SelectInlineImpl\n const forceUpdate = React.useReducer(() => ({}), {})[1]\n const [selectedItem, setSelectedItem] = React.useState<React.ReactNode>(null)\n\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen || false,\n onChange: onOpenChange,\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n })\n\n const [activeIndex, setActiveIndex] = React.useState<number | null>(null)\n const selectedIndexRef = React.useRef<number | null>(null)\n const activeIndexRef = React.useRef<number | null>(null)\n\n const listContentRef = React.useRef<string[]>([])\n\n const [selectedIndex, setSelectedIndex] = React.useState(\n Math.max(0, listContentRef.current.indexOf(value))\n )\n\n const [valueNode, setValueNode] = React.useState<HTMLElement | null>(null)\n const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false)\n\n useIsomorphicLayoutEffect(() => {\n selectedIndexRef.current = selectedIndex\n activeIndexRef.current = activeIndex\n })\n\n return (\n <SelectProvider\n dir={dir}\n size={sizeProp}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={__scopeSelect ? Object.keys(__scopeSelect)[0] : ''}\n sheetBreakpoint={sheetBreakpoint}\n scope={__scopeSelect}\n setValueAtIndex={(index, value) => {\n listContentRef.current[index] = value\n }}\n activeIndex={activeIndex}\n onChange={setValue}\n selectedIndex={selectedIndex}\n setActiveIndex={setActiveIndex}\n setOpen={setOpen}\n setSelectedIndex={setSelectedIndex}\n value={value}\n open={open}\n >\n <SelectSheetController onChangeOpen={setOpen} __scopeSelect={__scopeSelect}>\n <SelectImpl\n activeIndexRef={activeIndexRef}\n listContentRef={listContentRef}\n selectedIndexRef={selectedIndexRef}\n {...props}\n open={open}\n value={value}\n >\n {children}\n </SelectImpl>\n </SelectSheetController>\n </SelectProvider>\n )\n },\n {\n Content: SelectContent,\n Group: SelectGroup,\n Icon: SelectIcon,\n Item: SelectItem,\n ItemIndicator: SelectItemIndicator,\n ItemText: SelectItemText,\n Label: SelectLabel,\n ScrollDownButton: SelectScrollDownButton,\n ScrollUpButton: SelectScrollUpButton,\n Trigger: SelectTrigger,\n Value: SelectValue,\n Viewport: SelectViewport,\n SheetContents: SelectSheetContents,\n Sheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
-
"mappings": "AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAIA,MAAM,YAAa,OAAO,cAAc,eAAe,UAAU,aAAc;AACxE,MAAM,YAAY,UAAU,YAAY,EAAE,SAAS,SAAS;AAC5D,8BAA8B;AAzBrC;AA0BE,SAAO,CAAC,iCAAiC,KAAK,SAAS,IAAI,uDAAgB,cAAhB,YAA6B,IAAI;AAC9F;AAMA,MAAM,eAAe;
|
|
4
|
+
"sourcesContent": ["import { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isWeb, useMedia } from '@tamagui/core'\nimport { styled, useGet, useIsomorphicLayoutEffect, withStaticProperties } from '@tamagui/core'\nimport { useId } from '@tamagui/core'\nimport { ListItem, ListItemProps } from '@tamagui/list-item'\nimport { PortalHost } from '@tamagui/portal'\nimport { Separator } from '@tamagui/separator'\nimport { Sheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\nimport * as ReactDOM from 'react-dom'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectImplProps, SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectContextValue, SelectProps } from './types'\n\n// Cross browser fixes for pinch-zooming/backdrop-filter \uD83D\uDE44\nconst userAgent = (typeof navigator !== 'undefined' && navigator.userAgent) || ''\nexport const isFirefox = userAgent.toLowerCase().includes('firefox')\nexport function getVisualOffsetTop() {\n return !/^((?!chrome|android).)*safari/i.test(userAgent) ? visualViewport?.offsetTop ?? 0 : 0\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'SelectTrigger'\n\nexport type SelectTriggerProps = ListItemProps\n\nconst SelectTriggerFrame = styled(ListItem, {\n componentName: TRIGGER_NAME,\n backgrounded: true,\n radiused: true,\n hoverTheme: true,\n pressTheme: true,\n focusTheme: true,\n focusable: false,\n borderWidth: 1,\n})\n\nexport const SelectTrigger = React.forwardRef<TamaguiElement, SelectTriggerProps>(\n (props: ScopedProps<SelectTriggerProps>, forwardedRef) => {\n const {\n __scopeSelect,\n disabled = false,\n // @ts-ignore\n 'aria-labelledby': ariaLabelledby,\n ...triggerProps\n } = props\n const context = useSelectContext(TRIGGER_NAME, __scopeSelect)\n // const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange)\n // const getItems = useCollection(__scopeSelect)\n // const labelId = useLabelContext(context.trigger)\n const labelledBy = ariaLabelledby // || labelId\n\n return (\n <SelectTriggerFrame\n size={context.size}\n // aria-controls={context.contentId}\n aria-expanded={context.open}\n aria-autocomplete=\"none\"\n aria-labelledby={labelledBy}\n dir={context.dir}\n disabled={disabled}\n data-disabled={disabled ? '' : undefined}\n {...triggerProps}\n ref={forwardedRef}\n {...(context.interactions\n ? context.interactions.getReferenceProps()\n : {\n onPress() {\n context.setOpen(!context.open)\n },\n })}\n />\n )\n }\n)\n\nSelectTrigger.displayName = TRIGGER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectValue\n * -----------------------------------------------------------------------------------------------*/\n\nconst VALUE_NAME = 'SelectValue'\n\nconst SelectValueFrame = styled(Paragraph, {\n name: VALUE_NAME,\n selectable: false,\n})\n\ntype SelectValueProps = GetProps<typeof SelectValueFrame> & {\n placeholder?: React.ReactNode\n}\n\nconst SelectValue = SelectValueFrame.extractable(\n React.forwardRef<TamaguiElement, SelectValueProps>(\n (\n { __scopeSelect, children: childrenProp, placeholder }: ScopedProps<SelectValueProps>,\n forwardedRef\n ) => {\n // We ignore `className` and `style` as this part shouldn't be styled.\n const context = useSelectContext(VALUE_NAME, __scopeSelect)\n const { onValueNodeHasChildrenChange } = context\n const hasChildren = childrenProp !== undefined\n const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n React.useLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\n\n const children = childrenProp ?? context.selectedItem\n\n return (\n <SelectValueFrame\n size={context.size}\n ref={composedRefs}\n // we don't want events from the portalled `SelectValue` children to bubble\n // through the item they came from\n pointerEvents=\"none\"\n >\n {context.value === undefined && placeholder !== undefined ? placeholder : children}\n </SelectValueFrame>\n )\n }\n )\n)\n\nSelectValue.displayName = VALUE_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectIcon\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectIcon = styled(XStack, {\n name: 'SelectIcon',\n // @ts-ignore\n 'aria-hidden': true,\n children: <Paragraph>\u25BC</Paragraph>,\n})\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'SelectItem'\n\ntype SelectItemContextValue = {\n value: string\n textId: string\n isSelected: boolean\n onItemTextChange(node: TamaguiElement | null): void\n}\n\nconst [SelectItemContextProvider, useSelectItemContext] =\n createSelectContext<SelectItemContextValue>(ITEM_NAME)\n\nexport interface SelectItemProps extends YStackProps {\n value: string\n index: number\n disabled?: boolean\n textValue?: string\n}\n\nexport const SelectItem = React.forwardRef<TamaguiElement, SelectItemProps>(\n (props: ScopedProps<SelectItemProps>, forwardedRef) => {\n const {\n __scopeSelect,\n value,\n disabled = false,\n textValue: textValueProp,\n index,\n ...itemProps\n } = props\n const context = useSelectContext(ITEM_NAME, __scopeSelect)\n const isSelected = context.value === value\n const [textValue, setTextValue] = React.useState(textValueProp ?? '')\n const [isFocused, setIsFocused] = React.useState(false)\n const textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n activeIndex,\n setActiveIndex,\n setValueAtIndex,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(\n forwardedRef,\n (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n }\n // isSelected ? context.onSelectedItemChange : undefined\n )\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n const timeoutRef = React.useRef<any>()\n const [allowMouseUp, setAllowMouseUp] = React.useState(false)\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n React.useLayoutEffect(() => {\n clearTimeout(timeoutRef.current)\n if (open) {\n if (selectedIndex !== index) {\n setAllowMouseUp(true)\n } else {\n timeoutRef.current = setTimeout(() => {\n setAllowMouseUp(true)\n }, 300)\n }\n } else {\n setAllowMouseUp(false)\n }\n }, [open, index, setActiveIndex, selectedIndex])\n\n function handleKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Enter' || (event.key === ' ' && !dataRef?.current.typing)) {\n event.preventDefault()\n handleSelect()\n }\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onClick: allowMouseUp ? handleSelect : undefined,\n onMouseUp: allowMouseUp ? handleSelect : undefined,\n onKeyDown: handleKeyDown,\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n onItemTextChange={React.useCallback((node) => {\n // @ts-ignore\n setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? '').trim())\n }, [])}\n >\n <ListItem\n backgrounded\n pressTheme\n focusTheme\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n // `isFocused` caveat fixes stuttering in VoiceOver\n aria-selected={isSelected && isFocused}\n data-state={isSelected ? 'active' : 'inactive'}\n aria-disabled={disabled || undefined}\n data-disabled={disabled ? '' : undefined}\n tabIndex={disabled ? undefined : -1}\n size={context.size}\n {...itemProps}\n {...selectItemProps}\n />\n </SelectItemContextProvider>\n )\n }\n)\n\nSelectItem.displayName = ITEM_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemText\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_TEXT_NAME = 'SelectItemText'\n\nexport const SelectItemTextFrame = styled(Paragraph, {\n name: ITEM_TEXT_NAME,\n selectable: false,\n})\n\ntype SelectItemTextProps = GetProps<typeof SelectItemTextFrame>\n\nconst SelectItemText = React.forwardRef<TamaguiElement, SelectItemTextProps>(\n (props: ScopedProps<SelectItemTextProps>, forwardedRef) => {\n const { __scopeSelect, className, ...itemTextProps } = props\n const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect)\n const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect)\n const ref = React.useRef<TamaguiElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, itemContext.onItemTextChange)\n const isSelected = itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren\n\n const contents = (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n if (!isWeb) {\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected])\n }\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {isWeb && isSelected\n ? ReactDOM.createPortal(itemTextProps.children, context.valueNode!)\n : null}\n\n {/* Portal an option in the bubble select */}\n {/* {context.bubbleSelect\n ? ReactDOM.createPortal(\n // we use `.textContent` because `option` only support `string` or `number`\n <option value={itemContext.value}>{ref.current?.textContent}</option>,\n context.bubbleSelect\n )\n : null} */}\n </>\n )\n }\n)\n\nSelectItemText.displayName = ITEM_TEXT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectItemIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_INDICATOR_NAME = 'SelectItemIndicator'\n\nconst SelectItemIndicatorFrame = styled(XStack, {\n name: ITEM_TEXT_NAME,\n})\n\ntype SelectItemIndicatorProps = GetProps<typeof SelectItemIndicatorFrame>\n\nconst SelectItemIndicator = React.forwardRef<TamaguiElement, SelectItemIndicatorProps>(\n (props: ScopedProps<SelectItemIndicatorProps>, forwardedRef) => {\n const { __scopeSelect, ...itemIndicatorProps } = props\n const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect)\n return itemContext.isSelected ? (\n <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} />\n ) : null\n }\n)\n\nSelectItemIndicator.displayName = ITEM_INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'SelectGroup'\n\ntype SelectGroupContextValue = { id: string }\n\nconst [SelectGroupContextProvider, useSelectGroupContext] =\n createSelectContext<SelectGroupContextValue>(GROUP_NAME)\n\nexport const SelectGroupFrame = styled(YStack, {\n name: GROUP_NAME,\n width: '100%',\n})\n\ntype SelectGroupProps = GetProps<typeof SelectGroupFrame>\n\nconst SelectGroup = React.forwardRef<TamaguiElement, SelectGroupProps>(\n (props: ScopedProps<SelectGroupProps>, forwardedRef) => {\n const { __scopeSelect, ...groupProps } = props\n const groupId = useId()\n return (\n <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ''}>\n <SelectGroupFrame\n // @ts-ignore\n role=\"group\"\n aria-labelledby={groupId}\n {...groupProps}\n ref={forwardedRef}\n />\n </SelectGroupContextProvider>\n )\n }\n)\n\nSelectGroup.displayName = GROUP_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectLabel\n * -----------------------------------------------------------------------------------------------*/\n\nconst LABEL_NAME = 'SelectLabel'\n\nexport type SelectLabelProps = ListItemProps\n\nconst SelectLabel = React.forwardRef<TamaguiElement, SelectLabelProps>(\n (props: ScopedProps<SelectLabelProps>, forwardedRef) => {\n const { __scopeSelect, ...labelProps } = props\n const context = useSelectContext(LABEL_NAME, __scopeSelect)\n const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect)\n return (\n <ListItem\n componentName={LABEL_NAME}\n fontWeight=\"800\"\n id={groupContext.id}\n size={context.size}\n {...labelProps}\n // @ts-expect-error\n ref={forwardedRef}\n />\n )\n }\n)\n\nSelectLabel.displayName = LABEL_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSeparator\n * -----------------------------------------------------------------------------------------------*/\n\nexport const SelectSeparator = styled(Separator, {\n name: 'SelectSeparator',\n})\n\nexport const useSelectBreakpointActive = (\n sheetBreakpoint: SelectContextValue['sheetBreakpoint']\n) => {\n const media = useMedia()\n return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n return context.open === false ? false : breakpointActive\n}\n\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onChangeOpen: React.Dispatch<React.SetStateAction<boolean>>\n }\n) => {\n const context = useSelectContext('SelectSheetController', props.__scopeSelect)\n const showSheet = useShowSelectSheet(context)\n const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n const getShowSheet = useGet(showSheet)\n\n return (\n <SheetController\n onChangeOpen={(val) => {\n if (getShowSheet()) {\n props.onChangeOpen(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * SelectSheetContents\n * -----------------------------------------------------------------------------------------------*/\n\nconst SHEET_CONTENTS_NAME = 'SelectSheetContents'\n\nexport const SelectSheetContents = ({ __scopeSelect }: ScopedProps<{}>) => {\n const context = useSelectContext(SHEET_CONTENTS_NAME, __scopeSelect)\n return <PortalHost name={`${context.scopeKey}SheetContents`} />\n}\n\nSelectSheetContents.displayName = SHEET_CONTENTS_NAME\n\nconst SelectSheetImpl = (props: SelectImplProps) => {\n return <>{props.children}</>\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Select\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Select = withStaticProperties(\n (props: ScopedProps<SelectProps>) => {\n const {\n __scopeSelect,\n children,\n open: openProp,\n defaultOpen,\n onOpenChange,\n value: valueProp,\n defaultValue,\n onValueChange,\n size: sizeProp = '$4',\n sheetBreakpoint = false,\n dir,\n } = props\n\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet ? SelectSheetImpl : SelectInlineImpl\n const forceUpdate = React.useReducer(() => ({}), {})[1]\n const [selectedItem, setSelectedItem] = React.useState<React.ReactNode>(null)\n\n const [open, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen || false,\n onChange: onOpenChange,\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n })\n\n const [activeIndex, setActiveIndex] = React.useState<number | null>(null)\n const selectedIndexRef = React.useRef<number | null>(null)\n const activeIndexRef = React.useRef<number | null>(null)\n\n const listContentRef = React.useRef<string[]>([])\n\n const [selectedIndex, setSelectedIndex] = React.useState(\n Math.max(0, listContentRef.current.indexOf(value))\n )\n\n const [valueNode, setValueNode] = React.useState<HTMLElement | null>(null)\n const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false)\n\n useIsomorphicLayoutEffect(() => {\n selectedIndexRef.current = selectedIndex\n activeIndexRef.current = activeIndex\n })\n\n return (\n <SelectProvider\n dir={dir}\n size={sizeProp}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={__scopeSelect ? Object.keys(__scopeSelect)[0] : ''}\n sheetBreakpoint={sheetBreakpoint}\n scope={__scopeSelect}\n setValueAtIndex={(index, value) => {\n listContentRef.current[index] = value\n }}\n activeIndex={activeIndex}\n onChange={setValue}\n selectedIndex={selectedIndex}\n setActiveIndex={setActiveIndex}\n setOpen={setOpen}\n setSelectedIndex={setSelectedIndex}\n value={value}\n open={open}\n >\n <SelectSheetController onChangeOpen={setOpen} __scopeSelect={__scopeSelect}>\n <SelectImpl\n activeIndexRef={activeIndexRef}\n listContentRef={listContentRef}\n selectedIndexRef={selectedIndexRef}\n {...props}\n open={open}\n value={value}\n >\n {children}\n </SelectImpl>\n </SelectSheetController>\n </SelectProvider>\n )\n },\n {\n Content: SelectContent,\n Group: SelectGroup,\n Icon: SelectIcon,\n Item: SelectItem,\n ItemIndicator: SelectItemIndicator,\n ItemText: SelectItemText,\n Label: SelectLabel,\n ScrollDownButton: SelectScrollDownButton,\n ScrollUpButton: SelectScrollUpButton,\n Trigger: SelectTrigger,\n Value: SelectValue,\n Viewport: SelectViewport,\n SheetContents: SelectSheetContents,\n Sheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|