@tamagui/linear-gradient 1.0.11 → 1.0.13
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/package.json +4 -4
- package/dist/cjs/BubbleSelect.js +0 -44
- package/dist/cjs/BubbleSelect.js.map +0 -7
- package/dist/cjs/Select.js +0 -480
- package/dist/cjs/Select.js.map +0 -7
- package/dist/cjs/SelectContent.js +0 -76
- package/dist/cjs/SelectContent.js.map +0 -7
- package/dist/cjs/SelectContent.native.js +0 -31
- package/dist/cjs/SelectContent.native.js.map +0 -7
- package/dist/cjs/SelectImpl.js +0 -301
- package/dist/cjs/SelectImpl.js.map +0 -7
- package/dist/cjs/SelectImpl.native.js +0 -37
- package/dist/cjs/SelectImpl.native.js.map +0 -7
- package/dist/cjs/SelectScrollButton.js +0 -161
- package/dist/cjs/SelectScrollButton.js.map +0 -7
- package/dist/cjs/SelectScrollButton.native.js +0 -32
- package/dist/cjs/SelectScrollButton.native.js.map +0 -7
- package/dist/cjs/SelectViewport.js +0 -126
- package/dist/cjs/SelectViewport.js.map +0 -7
- package/dist/cjs/SelectViewport.native.js +0 -62
- package/dist/cjs/SelectViewport.native.js.map +0 -7
- package/dist/cjs/constants.js +0 -47
- package/dist/cjs/constants.js.map +0 -7
- package/dist/cjs/context.js +0 -49
- package/dist/cjs/context.js.map +0 -7
- package/dist/cjs/types.js +0 -17
- package/dist/cjs/types.js.map +0 -7
- package/dist/cjs/useSelectBreakpointActive.js +0 -39
- package/dist/cjs/useSelectBreakpointActive.js.map +0 -7
- package/dist/esm/BubbleSelect.js +0 -25
- package/dist/esm/BubbleSelect.js.map +0 -7
- package/dist/esm/Select.js +0 -452
- package/dist/esm/Select.js.map +0 -7
- package/dist/esm/SelectContent.js +0 -52
- package/dist/esm/SelectContent.js.map +0 -7
- package/dist/esm/SelectContent.native.js +0 -7
- package/dist/esm/SelectContent.native.js.map +0 -7
- package/dist/esm/SelectImpl.js +0 -286
- package/dist/esm/SelectImpl.js.map +0 -7
- package/dist/esm/SelectImpl.native.js +0 -13
- package/dist/esm/SelectImpl.native.js.map +0 -7
- package/dist/esm/SelectScrollButton.js +0 -130
- package/dist/esm/SelectScrollButton.js.map +0 -7
- package/dist/esm/SelectScrollButton.native.js +0 -7
- package/dist/esm/SelectScrollButton.native.js.map +0 -7
- package/dist/esm/SelectViewport.js +0 -95
- package/dist/esm/SelectViewport.js.map +0 -7
- package/dist/esm/SelectViewport.native.js +0 -32
- package/dist/esm/SelectViewport.native.js.map +0 -7
- package/dist/esm/constants.js +0 -17
- package/dist/esm/constants.js.map +0 -7
- package/dist/esm/context.js +0 -21
- package/dist/esm/context.js.map +0 -7
- package/dist/esm/types.js +0 -1
- package/dist/esm/types.js.map +0 -7
- package/dist/esm/useSelectBreakpointActive.js +0 -14
- package/dist/esm/useSelectBreakpointActive.js.map +0 -7
- package/dist/jsx/BubbleSelect.js +0 -25
- package/dist/jsx/BubbleSelect.js.map +0 -7
- package/dist/jsx/Select.js +0 -326
- package/dist/jsx/Select.js.map +0 -7
- package/dist/jsx/SelectContent.js +0 -30
- package/dist/jsx/SelectContent.js.map +0 -7
- package/dist/jsx/SelectContent.native.js +0 -7
- package/dist/jsx/SelectContent.native.js.map +0 -7
- package/dist/jsx/SelectImpl.js +0 -259
- package/dist/jsx/SelectImpl.js.map +0 -7
- package/dist/jsx/SelectImpl.native.js +0 -10
- package/dist/jsx/SelectImpl.native.js.map +0 -7
- package/dist/jsx/SelectScrollButton.js +0 -103
- package/dist/jsx/SelectScrollButton.js.map +0 -7
- package/dist/jsx/SelectScrollButton.native.js +0 -7
- package/dist/jsx/SelectScrollButton.native.js.map +0 -7
- package/dist/jsx/SelectViewport.js +0 -73
- package/dist/jsx/SelectViewport.js.map +0 -7
- package/dist/jsx/SelectViewport.native.js +0 -18
- package/dist/jsx/SelectViewport.native.js.map +0 -7
- package/dist/jsx/constants.js +0 -17
- package/dist/jsx/constants.js.map +0 -7
- package/dist/jsx/context.js +0 -15
- package/dist/jsx/context.js.map +0 -7
- package/dist/jsx/types.js +0 -1
- package/dist/jsx/types.js.map +0 -7
- package/dist/jsx/useSelectBreakpointActive.js +0 -14
- package/dist/jsx/useSelectBreakpointActive.js.map +0 -7
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/SelectViewport.native.tsx"],
|
|
4
|
-
"sourcesContent": ["import { AdaptParentContext } from '@tamagui/adapt'\nimport { Stack, Theme, useThemeName } from '@tamagui/core'\nimport { PortalItem } from '@tamagui/portal'\nimport * as React from 'react'\n\nimport { VIEWPORT_NAME } from './constants'\nimport { SelectProvider, useSelectContext } from './context'\nimport { ScopedProps, SelectViewportProps } from './types'\n\nexport const SelectViewport = (props: ScopedProps<SelectViewportProps>) => {\n const { __scopeSelect, children } = props\n const context = useSelectContext(VIEWPORT_NAME, __scopeSelect)\n const themeName = useThemeName()\n const adaptContext = React.useContext(AdaptParentContext)\n\n // need to forward context...\n return (\n <PortalItem hostName={`${context.scopeKey}SheetContents`}>\n <Theme name={themeName}>\n <SelectProvider scope={__scopeSelect} {...context}>\n <AdaptParentContext.Provider value={adaptContext}>\n {children}\n </AdaptParentContext.Provider>\n </SelectProvider>\n </Theme>\n </PortalItem>\n )\n}\n\nSelectViewport.displayName = VIEWPORT_NAME\n"],
|
|
5
|
-
"mappings": "AAoBU;AApBV,SAAS,0BAA0B;AACnC,SAAgB,OAAO,oBAAoB;AAC3C,SAAS,kBAAkB;AAC3B,YAAY,WAAW;AAEvB,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB,wBAAwB;AAG1C,MAAM,iBAAiB,CAAC,UAA4C;AACzE,QAAM,EAAE,eAAe,SAAS,IAAI;AACpC,QAAM,UAAU,iBAAiB,eAAe,aAAa;AAC7D,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,MAAM,WAAW,kBAAkB;AAGxD,SACE,oBAAC;AAAA,IAAW,UAAU,GAAG,QAAQ;AAAA,IAC/B,8BAAC;AAAA,MAAM,MAAM;AAAA,MACX,8BAAC;AAAA,QAAe,OAAO;AAAA,QAAgB,GAAG;AAAA,QACxC,8BAAC,mBAAmB,UAAnB;AAAA,UAA4B,OAAO;AAAA,UACjC;AAAA,SACH;AAAA,OACF;AAAA,KACF;AAAA,GACF;AAEJ;AAEA,eAAe,cAAc;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/esm/constants.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
const SELECT_NAME = "Select";
|
|
2
|
-
const WINDOW_PADDING = 8;
|
|
3
|
-
const SCROLL_ARROW_VELOCITY = 8;
|
|
4
|
-
const SCROLL_ARROW_THRESHOLD = 8;
|
|
5
|
-
const MIN_HEIGHT = 80;
|
|
6
|
-
const FALLBACK_THRESHOLD = 16;
|
|
7
|
-
const VIEWPORT_NAME = "SelectViewport";
|
|
8
|
-
export {
|
|
9
|
-
FALLBACK_THRESHOLD,
|
|
10
|
-
MIN_HEIGHT,
|
|
11
|
-
SCROLL_ARROW_THRESHOLD,
|
|
12
|
-
SCROLL_ARROW_VELOCITY,
|
|
13
|
-
SELECT_NAME,
|
|
14
|
-
VIEWPORT_NAME,
|
|
15
|
-
WINDOW_PADDING
|
|
16
|
-
};
|
|
17
|
-
//# sourceMappingURL=constants.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/constants.tsx"],
|
|
4
|
-
"sourcesContent": ["export const SELECT_NAME = 'Select'\nexport const WINDOW_PADDING = 8\nexport const SCROLL_ARROW_VELOCITY = 8\nexport const SCROLL_ARROW_THRESHOLD = 8\nexport const MIN_HEIGHT = 80\nexport const FALLBACK_THRESHOLD = 16\nexport const VIEWPORT_NAME = 'SelectViewport'\n"],
|
|
5
|
-
"mappings": "AAAO,MAAM,cAAc;AACpB,MAAM,iBAAiB;AACvB,MAAM,wBAAwB;AAC9B,MAAM,yBAAyB;AAC/B,MAAM,aAAa;AACnB,MAAM,qBAAqB;AAC3B,MAAM,gBAAgB;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/esm/context.js
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import { createContextScope } from "@tamagui/create-context";
|
|
3
|
-
import { SELECT_NAME } from "./constants";
|
|
4
|
-
const [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME);
|
|
5
|
-
const [SelectProvider, useSelectContext] = createSelectContext(SELECT_NAME);
|
|
6
|
-
const ForwardSelectContext = (props) => {
|
|
7
|
-
return /* @__PURE__ */ jsx(SelectProvider, {
|
|
8
|
-
isInSheet: true,
|
|
9
|
-
scope: props.__scopeSelect,
|
|
10
|
-
...props.context,
|
|
11
|
-
children: props.children
|
|
12
|
-
});
|
|
13
|
-
};
|
|
14
|
-
export {
|
|
15
|
-
ForwardSelectContext,
|
|
16
|
-
SelectProvider,
|
|
17
|
-
createSelectContext,
|
|
18
|
-
createSelectScope,
|
|
19
|
-
useSelectContext
|
|
20
|
-
};
|
|
21
|
-
//# sourceMappingURL=context.js.map
|
package/dist/esm/context.js.map
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/context.tsx"],
|
|
4
|
-
"sourcesContent": ["import { createContextScope } from '@tamagui/create-context'\n\nimport { SELECT_NAME } from './constants'\nimport { ScopedProps, SelectContextValue } from './types'\n\nexport const [createSelectContext, createSelectScope] =\n createContextScope(SELECT_NAME)\n\nexport const [SelectProvider, useSelectContext] =\n createSelectContext<SelectContextValue>(SELECT_NAME)\n\nexport const ForwardSelectContext = (\n props: ScopedProps<{ children?: any; context: SelectContextValue }>,\n) => {\n return (\n <SelectProvider isInSheet scope={props.__scopeSelect} {...props.context}>\n {props.children}\n </SelectProvider>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAeI;AAfJ,SAAS,0BAA0B;AAEnC,SAAS,mBAAmB;AAGrB,MAAM,CAAC,qBAAqB,iBAAiB,IAClD,mBAAmB,WAAW;AAEzB,MAAM,CAAC,gBAAgB,gBAAgB,IAC5C,oBAAwC,WAAW;AAE9C,MAAM,uBAAuB,CAClC,UACG;AACH,SACE,oBAAC;AAAA,IAAe,WAAS;AAAA,IAAC,OAAO,MAAM;AAAA,IAAgB,GAAG,MAAM;AAAA,IAC7D,gBAAM;AAAA,GACT;AAEJ;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/esm/types.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
//# sourceMappingURL=types.js.map
|
package/dist/esm/types.js.map
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { useMedia } from "@tamagui/core";
|
|
2
|
-
const useSelectBreakpointActive = (sheetBreakpoint) => {
|
|
3
|
-
const media = useMedia();
|
|
4
|
-
return sheetBreakpoint ? media[sheetBreakpoint] : false;
|
|
5
|
-
};
|
|
6
|
-
const useShowSelectSheet = (context) => {
|
|
7
|
-
const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint);
|
|
8
|
-
return context.open === false ? false : breakpointActive;
|
|
9
|
-
};
|
|
10
|
-
export {
|
|
11
|
-
useSelectBreakpointActive,
|
|
12
|
-
useShowSelectSheet
|
|
13
|
-
};
|
|
14
|
-
//# sourceMappingURL=useSelectBreakpointActive.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/useSelectBreakpointActive.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useMedia } from '@tamagui/core'\n\nimport { SelectContextValue } from './types'\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"],
|
|
5
|
-
"mappings": "AAAA,SAAS,gBAAgB;AAIlB,MAAM,4BAA4B,CACvC,oBACG;AACH,QAAM,QAAQ,SAAS;AACvB,SAAO,kBAAkB,MAAM,mBAAmB;AACpD;AAEO,MAAM,qBAAqB,CAAC,YAAgC;AACjE,QAAM,mBAAmB,0BAA0B,QAAQ,eAAe;AAC1E,SAAO,QAAQ,SAAS,QAAQ,QAAQ;AAC1C;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/jsx/BubbleSelect.js
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { usePrevious } from "@radix-ui/react-use-previous";
|
|
2
|
-
import { useComposedRefs } from "@tamagui/compose-refs";
|
|
3
|
-
import * as React from "react";
|
|
4
|
-
const BubbleSelect = React.forwardRef((props, forwardedRef) => {
|
|
5
|
-
const { value, ...selectProps } = props;
|
|
6
|
-
const ref = React.useRef(null);
|
|
7
|
-
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
8
|
-
const prevValue = usePrevious(value);
|
|
9
|
-
React.useEffect(() => {
|
|
10
|
-
const select = ref.current;
|
|
11
|
-
const selectProto = window.HTMLSelectElement.prototype;
|
|
12
|
-
const descriptor = Object.getOwnPropertyDescriptor(
|
|
13
|
-
selectProto,
|
|
14
|
-
"value"
|
|
15
|
-
);
|
|
16
|
-
const setValue = descriptor.set;
|
|
17
|
-
if (prevValue !== value && setValue) {
|
|
18
|
-
const event = new Event("change", { bubbles: true });
|
|
19
|
-
setValue.call(select, value);
|
|
20
|
-
select.dispatchEvent(event);
|
|
21
|
-
}
|
|
22
|
-
}, [prevValue, value]);
|
|
23
|
-
return null;
|
|
24
|
-
});
|
|
25
|
-
//# sourceMappingURL=BubbleSelect.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/BubbleSelect.tsx"],
|
|
4
|
-
"sourcesContent": ["import { usePrevious } from '@radix-ui/react-use-previous'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport * as React from 'react'\n\n/* -----------------------------------------------------------------------------------------------*/\nconst BubbleSelect = React.forwardRef<\n HTMLSelectElement,\n React.ComponentPropsWithoutRef<'select'>\n>((props, forwardedRef) => {\n const { value, ...selectProps } = props\n const ref = React.useRef<HTMLSelectElement>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref)\n const prevValue = usePrevious(value)\n\n // Bubble value change to parents (e.g form change event)\n React.useEffect(() => {\n const select = ref.current!\n const selectProto = window.HTMLSelectElement.prototype\n const descriptor = Object.getOwnPropertyDescriptor(\n selectProto,\n 'value',\n ) as PropertyDescriptor\n const setValue = descriptor.set\n if (prevValue !== value && setValue) {\n const event = new Event('change', { bubbles: true })\n setValue.call(select, value)\n select.dispatchEvent(event)\n }\n }, [prevValue, value])\n\n /**\n * We purposefully use a `select` here to support form autofill as much\n * as possible.\n *\n * We purposefully do not add the `value` attribute here to allow the value\n * to be set programatically and bubble to any parent form `onChange` event.\n * Adding the `value` will cause React to consider the programatic\n * dispatch a duplicate and it will get swallowed.\n *\n * We use `VisuallyHidden` rather than `display: \"none\"` because Safari autofill\n * won't work otherwise.\n */\n // TODO\n return null\n // return (\n // <VisuallyHidden asChild>\n // <select {...selectProps} ref={composedRefs} defaultValue={value} />\n // </VisuallyHidden>\n // )\n})\n"],
|
|
5
|
-
"mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAChC,YAAY,WAAW;AAGvB,MAAM,eAAe,MAAM,WAGzB,CAAC,OAAO,iBAAiB;AACzB,QAAM,EAAE,UAAU,YAAY,IAAI;AAClC,QAAM,MAAM,MAAM,OAA0B,IAAI;AAChD,QAAM,eAAe,gBAAgB,cAAc,GAAG;AACtD,QAAM,YAAY,YAAY,KAAK;AAGnC,QAAM,UAAU,MAAM;AACpB,UAAM,SAAS,IAAI;AACnB,UAAM,cAAc,OAAO,kBAAkB;AAC7C,UAAM,aAAa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AACA,UAAM,WAAW,WAAW;AAC5B,QAAI,cAAc,SAAS,UAAU;AACnC,YAAM,QAAQ,IAAI,MAAM,UAAU,EAAE,SAAS,KAAK,CAAC;AACnD,eAAS,KAAK,QAAQ,KAAK;AAC3B,aAAO,cAAc,KAAK;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,WAAW,KAAK,CAAC;AAerB,SAAO;AAMT,CAAC;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
package/dist/jsx/Select.js
DELETED
|
@@ -1,326 +0,0 @@
|
|
|
1
|
-
import { Adapt, useAdaptParent } from "@tamagui/adapt";
|
|
2
|
-
import { useComposedRefs } from "@tamagui/compose-refs";
|
|
3
|
-
import { isWeb } from "@tamagui/core";
|
|
4
|
-
import {
|
|
5
|
-
styled,
|
|
6
|
-
useGet,
|
|
7
|
-
useIsomorphicLayoutEffect,
|
|
8
|
-
withStaticProperties
|
|
9
|
-
} from "@tamagui/core";
|
|
10
|
-
import { useId } from "@tamagui/core";
|
|
11
|
-
import { ListItem } from "@tamagui/list-item";
|
|
12
|
-
import { PortalHost } from "@tamagui/portal";
|
|
13
|
-
import { Separator } from "@tamagui/separator";
|
|
14
|
-
import { ControlledSheet, SheetController } from "@tamagui/sheet";
|
|
15
|
-
import { XStack, YStack } from "@tamagui/stacks";
|
|
16
|
-
import { Paragraph, SizableText } from "@tamagui/text";
|
|
17
|
-
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
18
|
-
import * as React from "react";
|
|
19
|
-
import { SELECT_NAME } from "./constants";
|
|
20
|
-
import { SelectProvider, createSelectContext, useSelectContext } from "./context";
|
|
21
|
-
import { SelectContent } from "./SelectContent";
|
|
22
|
-
import { SelectInlineImpl } from "./SelectImpl";
|
|
23
|
-
import { SelectScrollDownButton, SelectScrollUpButton } from "./SelectScrollButton";
|
|
24
|
-
import { SelectViewport } from "./SelectViewport";
|
|
25
|
-
import {
|
|
26
|
-
useSelectBreakpointActive,
|
|
27
|
-
useShowSelectSheet
|
|
28
|
-
} from "./useSelectBreakpointActive";
|
|
29
|
-
const TRIGGER_NAME = "SelectTrigger";
|
|
30
|
-
const SelectTrigger = React.forwardRef(
|
|
31
|
-
(props, forwardedRef) => {
|
|
32
|
-
const {
|
|
33
|
-
__scopeSelect,
|
|
34
|
-
disabled = false,
|
|
35
|
-
"aria-labelledby": ariaLabelledby,
|
|
36
|
-
...triggerProps
|
|
37
|
-
} = props;
|
|
38
|
-
const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
|
|
39
|
-
const labelledBy = ariaLabelledby;
|
|
40
|
-
return <ListItem componentName={TRIGGER_NAME} backgrounded radiused hoverTheme pressTheme focusTheme focusable borderWidth={1} 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} {...process.env.TAMAGUI_TARGET === "web" && context.interactions ? context.interactions.getReferenceProps() : {
|
|
41
|
-
onPress() {
|
|
42
|
-
context.setOpen(!context.open);
|
|
43
|
-
}
|
|
44
|
-
}} />;
|
|
45
|
-
}
|
|
46
|
-
);
|
|
47
|
-
SelectTrigger.displayName = TRIGGER_NAME;
|
|
48
|
-
const VALUE_NAME = "SelectValue";
|
|
49
|
-
const SelectValueFrame = styled(Paragraph, {
|
|
50
|
-
name: VALUE_NAME,
|
|
51
|
-
selectable: false
|
|
52
|
-
});
|
|
53
|
-
const SelectValue = SelectValueFrame.extractable(
|
|
54
|
-
React.forwardRef(
|
|
55
|
-
({
|
|
56
|
-
__scopeSelect,
|
|
57
|
-
children: childrenProp,
|
|
58
|
-
placeholder
|
|
59
|
-
}, forwardedRef) => {
|
|
60
|
-
const context = useSelectContext(VALUE_NAME, __scopeSelect);
|
|
61
|
-
const { onValueNodeHasChildrenChange } = context;
|
|
62
|
-
const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange);
|
|
63
|
-
const children = childrenProp ?? context.selectedItem;
|
|
64
|
-
const hasChildren = !!children;
|
|
65
|
-
const selectValueChildren = context.value === void 0 && placeholder !== void 0 ? placeholder : children;
|
|
66
|
-
useIsomorphicLayoutEffect(() => {
|
|
67
|
-
onValueNodeHasChildrenChange(hasChildren);
|
|
68
|
-
}, [onValueNodeHasChildrenChange, hasChildren]);
|
|
69
|
-
return <SelectValueFrame size={context.size} ref={composedRefs} pointerEvents="none">{selectValueChildren}</SelectValueFrame>;
|
|
70
|
-
}
|
|
71
|
-
)
|
|
72
|
-
);
|
|
73
|
-
SelectValue.displayName = VALUE_NAME;
|
|
74
|
-
const SelectIcon = styled(XStack, {
|
|
75
|
-
name: "SelectIcon",
|
|
76
|
-
"aria-hidden": true,
|
|
77
|
-
children: <Paragraph>{"\u25BC"}</Paragraph>
|
|
78
|
-
});
|
|
79
|
-
const ITEM_NAME = "SelectItem";
|
|
80
|
-
const [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME);
|
|
81
|
-
const SelectItem = React.forwardRef(
|
|
82
|
-
(props, forwardedRef) => {
|
|
83
|
-
const {
|
|
84
|
-
__scopeSelect,
|
|
85
|
-
value,
|
|
86
|
-
disabled = false,
|
|
87
|
-
textValue: textValueProp,
|
|
88
|
-
index,
|
|
89
|
-
...itemProps
|
|
90
|
-
} = props;
|
|
91
|
-
const context = useSelectContext(ITEM_NAME, __scopeSelect);
|
|
92
|
-
const isSelected = context.value === value;
|
|
93
|
-
const textId = useId();
|
|
94
|
-
const {
|
|
95
|
-
selectedIndex,
|
|
96
|
-
setSelectedIndex,
|
|
97
|
-
listRef,
|
|
98
|
-
open,
|
|
99
|
-
setOpen,
|
|
100
|
-
onChange,
|
|
101
|
-
setActiveIndex,
|
|
102
|
-
allowMouseUpRef,
|
|
103
|
-
allowSelectRef,
|
|
104
|
-
setValueAtIndex,
|
|
105
|
-
selectTimeoutRef,
|
|
106
|
-
dataRef
|
|
107
|
-
} = context;
|
|
108
|
-
const composedRefs = useComposedRefs(forwardedRef, (node) => {
|
|
109
|
-
if (!isWeb)
|
|
110
|
-
return;
|
|
111
|
-
if (node instanceof HTMLElement) {
|
|
112
|
-
if (listRef) {
|
|
113
|
-
listRef.current[index] = node;
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
});
|
|
117
|
-
React.useEffect(() => {
|
|
118
|
-
setValueAtIndex(index, value);
|
|
119
|
-
}, [index, setValueAtIndex, value]);
|
|
120
|
-
function handleSelect() {
|
|
121
|
-
setSelectedIndex(index);
|
|
122
|
-
onChange(value);
|
|
123
|
-
setOpen(false);
|
|
124
|
-
}
|
|
125
|
-
const selectItemProps = context.interactions ? context.interactions.getItemProps({
|
|
126
|
-
onTouchStart() {
|
|
127
|
-
allowSelectRef.current = true;
|
|
128
|
-
allowMouseUpRef.current = false;
|
|
129
|
-
},
|
|
130
|
-
onKeyDown(event) {
|
|
131
|
-
if (event.key === "Enter" || event.key === " " && !dataRef?.current.typing) {
|
|
132
|
-
event.preventDefault();
|
|
133
|
-
handleSelect();
|
|
134
|
-
} else {
|
|
135
|
-
allowSelectRef.current = true;
|
|
136
|
-
}
|
|
137
|
-
},
|
|
138
|
-
onClick() {
|
|
139
|
-
if (allowSelectRef.current) {
|
|
140
|
-
setSelectedIndex(index);
|
|
141
|
-
setOpen(false);
|
|
142
|
-
}
|
|
143
|
-
},
|
|
144
|
-
onMouseUp() {
|
|
145
|
-
if (!allowMouseUpRef.current) {
|
|
146
|
-
return;
|
|
147
|
-
}
|
|
148
|
-
if (allowSelectRef.current) {
|
|
149
|
-
handleSelect();
|
|
150
|
-
}
|
|
151
|
-
clearTimeout(selectTimeoutRef.current);
|
|
152
|
-
selectTimeoutRef.current = setTimeout(() => {
|
|
153
|
-
allowSelectRef.current = true;
|
|
154
|
-
});
|
|
155
|
-
}
|
|
156
|
-
}) : {
|
|
157
|
-
onPress: handleSelect
|
|
158
|
-
};
|
|
159
|
-
return <SelectItemContextProvider scope={__scopeSelect} value={value} textId={textId || ""} isSelected={isSelected}><ListItem backgrounded pressTheme cursor="" focusTheme outlineWidth={0} componentName={ITEM_NAME} ref={composedRefs} aria-labelledby={textId} aria-selected={isSelected} data-state={isSelected ? "active" : "inactive"} aria-disabled={disabled || void 0} data-disabled={disabled ? "" : void 0} tabIndex={disabled ? void 0 : -1} size={context.size} {...itemProps} {...selectItemProps} /></SelectItemContextProvider>;
|
|
160
|
-
}
|
|
161
|
-
);
|
|
162
|
-
SelectItem.displayName = ITEM_NAME;
|
|
163
|
-
const ITEM_TEXT_NAME = "SelectItemText";
|
|
164
|
-
const SelectItemTextFrame = styled(SizableText, {
|
|
165
|
-
name: ITEM_TEXT_NAME,
|
|
166
|
-
selectable: false
|
|
167
|
-
});
|
|
168
|
-
const SelectItemText = React.forwardRef(
|
|
169
|
-
(props, forwardedRef) => {
|
|
170
|
-
const { __scopeSelect, className, ...itemTextProps } = props;
|
|
171
|
-
const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect);
|
|
172
|
-
const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect);
|
|
173
|
-
const ref = React.useRef(null);
|
|
174
|
-
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
175
|
-
const isSelected = Boolean(itemContext.isSelected && context.valueNode);
|
|
176
|
-
const contents = React.useMemo(
|
|
177
|
-
() => <SelectItemTextFrame className={className} size={context.size} id={itemContext.textId} {...itemTextProps} ref={composedRefs} />,
|
|
178
|
-
[props, context.size, className, itemContext.textId]
|
|
179
|
-
);
|
|
180
|
-
React.useEffect(() => {
|
|
181
|
-
if (isSelected) {
|
|
182
|
-
context.setSelectedItem(contents);
|
|
183
|
-
}
|
|
184
|
-
}, [isSelected, contents]);
|
|
185
|
-
return <>{contents}</>;
|
|
186
|
-
}
|
|
187
|
-
);
|
|
188
|
-
SelectItemText.displayName = ITEM_TEXT_NAME;
|
|
189
|
-
const ITEM_INDICATOR_NAME = "SelectItemIndicator";
|
|
190
|
-
const SelectItemIndicatorFrame = styled(XStack, {
|
|
191
|
-
name: ITEM_TEXT_NAME
|
|
192
|
-
});
|
|
193
|
-
const SelectItemIndicator = React.forwardRef(
|
|
194
|
-
(props, forwardedRef) => {
|
|
195
|
-
const { __scopeSelect, ...itemIndicatorProps } = props;
|
|
196
|
-
const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect);
|
|
197
|
-
return itemContext.isSelected ? <SelectItemIndicatorFrame aria-hidden {...itemIndicatorProps} ref={forwardedRef} /> : null;
|
|
198
|
-
}
|
|
199
|
-
);
|
|
200
|
-
SelectItemIndicator.displayName = ITEM_INDICATOR_NAME;
|
|
201
|
-
const GROUP_NAME = "SelectGroup";
|
|
202
|
-
const [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME);
|
|
203
|
-
const SelectGroupFrame = styled(YStack, {
|
|
204
|
-
name: GROUP_NAME,
|
|
205
|
-
width: "100%"
|
|
206
|
-
});
|
|
207
|
-
const SelectGroup = React.forwardRef(
|
|
208
|
-
(props, forwardedRef) => {
|
|
209
|
-
const { __scopeSelect, ...groupProps } = props;
|
|
210
|
-
const groupId = useId();
|
|
211
|
-
return <SelectGroupContextProvider scope={__scopeSelect} id={groupId || ""}><SelectGroupFrame role="group" aria-labelledby={groupId} {...groupProps} ref={forwardedRef} /></SelectGroupContextProvider>;
|
|
212
|
-
}
|
|
213
|
-
);
|
|
214
|
-
SelectGroup.displayName = GROUP_NAME;
|
|
215
|
-
const LABEL_NAME = "SelectLabel";
|
|
216
|
-
const SelectLabel = React.forwardRef(
|
|
217
|
-
(props, forwardedRef) => {
|
|
218
|
-
const { __scopeSelect, ...labelProps } = props;
|
|
219
|
-
const context = useSelectContext(LABEL_NAME, __scopeSelect);
|
|
220
|
-
const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
|
|
221
|
-
return <ListItem componentName={LABEL_NAME} fontWeight="800" id={groupContext.id} size={context.size} {...labelProps} ref={forwardedRef} />;
|
|
222
|
-
}
|
|
223
|
-
);
|
|
224
|
-
SelectLabel.displayName = LABEL_NAME;
|
|
225
|
-
const SelectSeparator = styled(Separator, {
|
|
226
|
-
name: "SelectSeparator"
|
|
227
|
-
});
|
|
228
|
-
const SelectSheetController = (props) => {
|
|
229
|
-
const context = useSelectContext("SelectSheetController", props.__scopeSelect);
|
|
230
|
-
const showSheet = useShowSelectSheet(context);
|
|
231
|
-
const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint);
|
|
232
|
-
const getShowSheet = useGet(showSheet);
|
|
233
|
-
return <SheetController onOpenChange={(val) => {
|
|
234
|
-
if (getShowSheet()) {
|
|
235
|
-
props.onOpenChange(val);
|
|
236
|
-
}
|
|
237
|
-
}} open={context.open} hidden={breakpointActive === false}>{props.children}</SheetController>;
|
|
238
|
-
};
|
|
239
|
-
const SelectSheetImpl = (props) => {
|
|
240
|
-
return <>{props.children}</>;
|
|
241
|
-
};
|
|
242
|
-
const Select = withStaticProperties(
|
|
243
|
-
(props) => {
|
|
244
|
-
const {
|
|
245
|
-
__scopeSelect,
|
|
246
|
-
children,
|
|
247
|
-
open: openProp,
|
|
248
|
-
defaultOpen,
|
|
249
|
-
onOpenChange,
|
|
250
|
-
value: valueProp,
|
|
251
|
-
defaultValue,
|
|
252
|
-
onValueChange,
|
|
253
|
-
size: sizeProp = "$4",
|
|
254
|
-
dir
|
|
255
|
-
} = props;
|
|
256
|
-
const id = useId();
|
|
257
|
-
const scopeKey = __scopeSelect ? Object.keys(__scopeSelect)[0] ?? id : id;
|
|
258
|
-
const { when, AdaptProvider } = useAdaptParent({
|
|
259
|
-
Contents: React.useCallback(
|
|
260
|
-
() => <PortalHost name={`${scopeKey}SheetContents`} />,
|
|
261
|
-
[scopeKey]
|
|
262
|
-
)
|
|
263
|
-
});
|
|
264
|
-
const sheetBreakpoint = when;
|
|
265
|
-
const isSheet = useSelectBreakpointActive(sheetBreakpoint);
|
|
266
|
-
const SelectImpl = isSheet || !isWeb ? SelectSheetImpl : SelectInlineImpl;
|
|
267
|
-
const forceUpdate = React.useReducer(() => ({}), {})[1];
|
|
268
|
-
const [selectedItem, setSelectedItem] = React.useState(null);
|
|
269
|
-
const [open, setOpen] = useControllableState({
|
|
270
|
-
prop: openProp,
|
|
271
|
-
defaultProp: defaultOpen || false,
|
|
272
|
-
onChange: onOpenChange,
|
|
273
|
-
strategy: "most-recent-wins"
|
|
274
|
-
});
|
|
275
|
-
const [value, setValue] = useControllableState({
|
|
276
|
-
prop: valueProp,
|
|
277
|
-
defaultProp: defaultValue || "",
|
|
278
|
-
onChange: onValueChange,
|
|
279
|
-
strategy: "most-recent-wins",
|
|
280
|
-
transition: true
|
|
281
|
-
});
|
|
282
|
-
const [activeIndex, setActiveIndex] = React.useState(null);
|
|
283
|
-
const selectedIndexRef = React.useRef(null);
|
|
284
|
-
const activeIndexRef = React.useRef(null);
|
|
285
|
-
const listContentRef = React.useRef([]);
|
|
286
|
-
const [selectedIndex, setSelectedIndex] = React.useState(
|
|
287
|
-
Math.max(0, listContentRef.current.indexOf(value))
|
|
288
|
-
);
|
|
289
|
-
const [valueNode, setValueNode] = React.useState(null);
|
|
290
|
-
const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false);
|
|
291
|
-
useIsomorphicLayoutEffect(() => {
|
|
292
|
-
selectedIndexRef.current = selectedIndex;
|
|
293
|
-
activeIndexRef.current = activeIndex;
|
|
294
|
-
});
|
|
295
|
-
return <AdaptProvider><SelectProvider dir={dir} blockSelection={false} size={sizeProp} fallback={false} selectedItem={selectedItem} setSelectedItem={setSelectedItem} forceUpdate={forceUpdate} valueNode={valueNode} onValueNodeChange={setValueNode} onValueNodeHasChildrenChange={setValueNodeHasChildren} valueNodeHasChildren={valueNodeHasChildren} scopeKey={scopeKey} sheetBreakpoint={sheetBreakpoint} scope={__scopeSelect} setValueAtIndex={(index, value2) => {
|
|
296
|
-
listContentRef.current[index] = value2;
|
|
297
|
-
}} activeIndex={activeIndex} onChange={setValue} selectedIndex={selectedIndex} setActiveIndex={setActiveIndex} setOpen={setOpen} setSelectedIndex={setSelectedIndex} value={value} open={open}><SelectSheetController onOpenChange={setOpen} __scopeSelect={__scopeSelect}><SelectImpl activeIndexRef={activeIndexRef} listContentRef={listContentRef} selectedIndexRef={selectedIndexRef} {...props} open={open} value={value}>{children}</SelectImpl></SelectSheetController></SelectProvider></AdaptProvider>;
|
|
298
|
-
},
|
|
299
|
-
{
|
|
300
|
-
Adapt,
|
|
301
|
-
Content: SelectContent,
|
|
302
|
-
Group: SelectGroup,
|
|
303
|
-
Icon: SelectIcon,
|
|
304
|
-
Item: SelectItem,
|
|
305
|
-
ItemIndicator: SelectItemIndicator,
|
|
306
|
-
ItemText: SelectItemText,
|
|
307
|
-
Label: SelectLabel,
|
|
308
|
-
ScrollDownButton: SelectScrollDownButton,
|
|
309
|
-
ScrollUpButton: SelectScrollUpButton,
|
|
310
|
-
Trigger: SelectTrigger,
|
|
311
|
-
Value: SelectValue,
|
|
312
|
-
Viewport: SelectViewport,
|
|
313
|
-
Sheet: ControlledSheet
|
|
314
|
-
}
|
|
315
|
-
);
|
|
316
|
-
Select.displayName = SELECT_NAME;
|
|
317
|
-
export {
|
|
318
|
-
Select,
|
|
319
|
-
SelectGroupFrame,
|
|
320
|
-
SelectIcon,
|
|
321
|
-
SelectItem,
|
|
322
|
-
SelectItemTextFrame,
|
|
323
|
-
SelectSeparator,
|
|
324
|
-
SelectTrigger
|
|
325
|
-
};
|
|
326
|
-
//# sourceMappingURL=Select.js.map
|
package/dist/jsx/Select.js.map
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/Select.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Adapt, useAdaptParent } from '@tamagui/adapt'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport { GetProps, TamaguiElement, isClient, isWeb } from '@tamagui/core'\nimport {\n styled,\n useGet,\n useIsomorphicLayoutEffect,\n withStaticProperties,\n} 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 { ControlledSheet, SheetController } from '@tamagui/sheet'\nimport { XStack, YStack, YStackProps } from '@tamagui/stacks'\nimport { Paragraph, SizableText } from '@tamagui/text'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nimport { SELECT_NAME } from './constants'\nimport { SelectProvider, createSelectContext, useSelectContext } from './context'\nimport { SelectContent } from './SelectContent'\nimport { SelectInlineImpl } from './SelectImpl'\nimport { SelectScrollDownButton, SelectScrollUpButton } from './SelectScrollButton'\nimport { SelectViewport } from './SelectViewport'\nimport { ScopedProps, SelectImplProps, SelectProps } from './types'\nimport {\n useSelectBreakpointActive,\n useShowSelectSheet,\n} from './useSelectBreakpointActive'\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 componentName={TRIGGER_NAME}\n backgrounded\n radiused\n hoverTheme\n pressTheme\n focusTheme\n focusable\n borderWidth={1}\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 {...(process.env.TAMAGUI_TARGET === 'web' && 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 {\n __scopeSelect,\n children: childrenProp,\n placeholder,\n }: 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 composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange)\n\n const children = childrenProp ?? context.selectedItem\n const hasChildren = !!children\n const selectValueChildren =\n context.value === undefined && placeholder !== undefined ? placeholder : children\n\n useIsomorphicLayoutEffect(() => {\n onValueNodeHasChildrenChange(hasChildren)\n }, [onValueNodeHasChildrenChange, hasChildren])\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 {selectValueChildren}\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}\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 textId = useId()\n\n const {\n selectedIndex,\n setSelectedIndex,\n listRef,\n open,\n setOpen,\n onChange,\n setActiveIndex,\n allowMouseUpRef,\n allowSelectRef,\n setValueAtIndex,\n selectTimeoutRef,\n dataRef,\n } = context\n\n const composedRefs = useComposedRefs(forwardedRef, (node) => {\n if (!isWeb) return\n if (node instanceof HTMLElement) {\n if (listRef) {\n listRef.current[index] = node\n }\n }\n })\n\n React.useEffect(() => {\n setValueAtIndex(index, value)\n }, [index, setValueAtIndex, value])\n\n function handleSelect() {\n setSelectedIndex(index)\n onChange(value)\n setOpen(false)\n }\n\n const selectItemProps = context.interactions\n ? context.interactions.getItemProps({\n onTouchStart() {\n allowSelectRef!.current = true\n allowMouseUpRef!.current = false\n },\n onKeyDown(event) {\n if (\n event.key === 'Enter' ||\n (event.key === ' ' && !dataRef?.current.typing)\n ) {\n event.preventDefault()\n handleSelect()\n } else {\n allowSelectRef!.current = true\n }\n },\n onClick() {\n if (allowSelectRef!.current) {\n setSelectedIndex(index)\n setOpen(false)\n }\n },\n onMouseUp() {\n if (!allowMouseUpRef!.current) {\n return\n }\n\n if (allowSelectRef!.current) {\n handleSelect()\n }\n\n // On touch devices, prevent the element from\n // immediately closing `onClick` by deferring it\n clearTimeout(selectTimeoutRef!.current)\n selectTimeoutRef!.current = setTimeout(() => {\n allowSelectRef!.current = true\n })\n },\n })\n : {\n onPress: handleSelect,\n }\n\n return (\n <SelectItemContextProvider\n scope={__scopeSelect}\n value={value}\n textId={textId || ''}\n isSelected={isSelected}\n >\n <ListItem\n backgrounded\n pressTheme\n cursor=\"\"\n focusTheme\n outlineWidth={0}\n componentName={ITEM_NAME}\n ref={composedRefs}\n aria-labelledby={textId}\n aria-selected={isSelected}\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(SizableText, {\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)\n const isSelected = Boolean(itemContext.isSelected && context.valueNode)\n\n const contents = React.useMemo(\n () => (\n <SelectItemTextFrame\n className={className}\n size={context.size}\n id={itemContext.textId}\n {...itemTextProps}\n ref={composedRefs}\n />\n ),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props, context.size, className, itemContext.textId]\n )\n\n // until portals work in sub-trees on RN, use this just for native:\n React.useEffect(() => {\n if (isSelected) {\n context.setSelectedItem(contents)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isSelected, contents])\n\n return (\n <>\n {contents}\n\n {/* Portal the select item text into the trigger value node */}\n {/* this needs some extra stability between renders */}\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 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\nconst SelectSheetController = (\n props: ScopedProps<{}> & {\n children: React.ReactNode\n onOpenChange: 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 onOpenChange={(val) => {\n if (getShowSheet()) {\n props.onOpenChange(val)\n }\n }}\n open={context.open}\n hidden={breakpointActive === false}\n >\n {props.children}\n </SheetController>\n )\n}\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 dir,\n } = props\n\n const id = useId()\n const scopeKey = __scopeSelect ? Object.keys(__scopeSelect)[0] ?? id : id\n\n const { when, AdaptProvider } = useAdaptParent({\n Contents: React.useCallback(\n () => <PortalHost name={`${scopeKey}SheetContents`} />,\n [scopeKey]\n ),\n })\n const sheetBreakpoint = when\n const isSheet = useSelectBreakpointActive(sheetBreakpoint)\n const SelectImpl = isSheet || !isWeb ? 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 strategy: 'most-recent-wins',\n })\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue || '',\n onChange: onValueChange,\n strategy: 'most-recent-wins',\n transition: true,\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 <AdaptProvider>\n <SelectProvider\n dir={dir}\n blockSelection={false}\n size={sizeProp}\n fallback={false}\n selectedItem={selectedItem}\n setSelectedItem={setSelectedItem}\n forceUpdate={forceUpdate}\n valueNode={valueNode}\n onValueNodeChange={setValueNode}\n onValueNodeHasChildrenChange={setValueNodeHasChildren}\n valueNodeHasChildren={valueNodeHasChildren}\n scopeKey={scopeKey}\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 onOpenChange={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 </AdaptProvider>\n )\n },\n {\n Adapt,\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 Sheet: ControlledSheet,\n }\n)\n\n// @ts-ignore\nSelect.displayName = SELECT_NAME\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": ["value"]
|
|
7
|
-
}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { FloatingOverlay, FloatingPortal } from "@floating-ui/react-dom-interactions";
|
|
2
|
-
import { Theme, useIsTouchDevice, useThemeName } from "@tamagui/core";
|
|
3
|
-
import { Dismissable } from "@tamagui/dismissable";
|
|
4
|
-
import { FocusScope } from "@tamagui/focus-scope";
|
|
5
|
-
import { useSelectContext } from "./context";
|
|
6
|
-
import { useShowSelectSheet } from "./useSelectBreakpointActive";
|
|
7
|
-
const CONTENT_NAME = "SelectContent";
|
|
8
|
-
const SelectContent = ({
|
|
9
|
-
children,
|
|
10
|
-
__scopeSelect,
|
|
11
|
-
zIndex = 1e3,
|
|
12
|
-
...focusScopeProps
|
|
13
|
-
}) => {
|
|
14
|
-
const context = useSelectContext(CONTENT_NAME, __scopeSelect);
|
|
15
|
-
const themeName = useThemeName();
|
|
16
|
-
const showSheet = useShowSelectSheet(context);
|
|
17
|
-
const contents = <Theme name={themeName}>{children}</Theme>;
|
|
18
|
-
const touch = useIsTouchDevice();
|
|
19
|
-
if (showSheet) {
|
|
20
|
-
if (!context.open) {
|
|
21
|
-
return null;
|
|
22
|
-
}
|
|
23
|
-
return <>{contents}</>;
|
|
24
|
-
}
|
|
25
|
-
return <FloatingPortal>{context.open ? <FloatingOverlay style={{ zIndex }} lockScroll={!touch}><FocusScope loop trapped {...focusScopeProps}><Dismissable>{contents}</Dismissable></FocusScope></FloatingOverlay> : <div style={{ display: "none" }}>{contents}</div>}</FloatingPortal>;
|
|
26
|
-
};
|
|
27
|
-
export {
|
|
28
|
-
SelectContent
|
|
29
|
-
};
|
|
30
|
-
//# sourceMappingURL=SelectContent.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/SelectContent.tsx"],
|
|
4
|
-
"sourcesContent": ["import { FloatingOverlay, FloatingPortal } from '@floating-ui/react-dom-interactions'\nimport { Theme, useIsTouchDevice, useThemeName } from '@tamagui/core'\nimport { Dismissable } from '@tamagui/dismissable'\nimport { FocusScope, FocusScopeProps } from '@tamagui/focus-scope'\n\nimport { useSelectContext } from './context'\nimport { SelectContentProps } from './types'\nimport { useShowSelectSheet } from './useSelectBreakpointActive'\n\n/* -------------------------------------------------------------------------------------------------\n * SelectContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'SelectContent'\n\nexport const SelectContent = ({\n children,\n __scopeSelect,\n zIndex = 1000,\n ...focusScopeProps\n}: SelectContentProps & FocusScopeProps) => {\n const context = useSelectContext(CONTENT_NAME, __scopeSelect)\n const themeName = useThemeName()\n const showSheet = useShowSelectSheet(context)\n const contents = <Theme name={themeName}>{children}</Theme>\n const touch = useIsTouchDevice()\n\n if (showSheet) {\n if (!context.open) {\n return null\n }\n return <>{contents}</>\n }\n\n return (\n <FloatingPortal>\n {context.open ? (\n <FloatingOverlay style={{ zIndex }} lockScroll={!touch}>\n <FocusScope loop trapped {...focusScopeProps}>\n <Dismissable>{contents}</Dismissable>\n </FocusScope>\n </FloatingOverlay>\n ) : (\n <div style={{ display: 'none' }}>{contents}</div>\n )}\n </FloatingPortal>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,OAAO,kBAAkB,oBAAoB;AACtD,SAAS,mBAAmB;AAC5B,SAAS,kBAAmC;AAE5C,SAAS,wBAAwB;AAEjC,SAAS,0BAA0B;AAMnC,MAAM,eAAe;AAEd,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,SAAS;AAAA,KACN;AACL,MAA4C;AAC1C,QAAM,UAAU,iBAAiB,cAAc,aAAa;AAC5D,QAAM,YAAY,aAAa;AAC/B,QAAM,YAAY,mBAAmB,OAAO;AAC5C,QAAM,WAAW,CAAC,MAAM,MAAM,YAAY,SAAS,EAAjC;AAClB,QAAM,QAAQ,iBAAiB;AAE/B,MAAI,WAAW;AACb,QAAI,CAAC,QAAQ,MAAM;AACjB,aAAO;AAAA,IACT;AACA,WAAO,GAAG,SAAS;AAAA,EACrB;AAEA,SACE,CAAC,gBACE,QAAQ,OACP,CAAC,gBAAgB,OAAO,EAAE,OAAO,GAAG,YAAY,CAAC,OAC/C,CAAC,WAAW,KAAK,YAAY,iBAC3B,CAAC,aAAa,SAAS,EAAtB,YACH,EAFC,WAGH,EAJC,mBAMD,CAAC,IAAI,OAAO,EAAE,SAAS,OAAO,IAAI,SAAS,EAA1C,KAEL,EAVC;AAYL;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/SelectContent.native.tsx"],
|
|
4
|
-
"sourcesContent": ["import { SelectContentProps } from './types'\n\nexport const SelectContent = ({ children }: SelectContentProps) => {\n return children\n}\n"],
|
|
5
|
-
"mappings": "AAEO,MAAM,gBAAgB,CAAC,EAAE,SAAS,MAA0B;AACjE,SAAO;AACT;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|