@tamagui/focusable 1.0.1-beta.219 → 1.0.1-beta.221
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/focusableInputHOC.js +3 -4
- package/dist/cjs/focusableInputHOC.js.map +3 -3
- package/dist/esm/focusableInputHOC.js +1 -2
- package/dist/esm/focusableInputHOC.js.map +2 -2
- package/dist/jsx/focusableInputHOC.js +1 -2
- package/dist/jsx/focusableInputHOC.js.map +2 -2
- package/package.json +5 -5
- package/src/focusableInputHOC.tsx +1 -2
|
@@ -25,15 +25,14 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
25
25
|
var import_compose_refs = require("@tamagui/compose-refs");
|
|
26
26
|
var import_core = require("@tamagui/core");
|
|
27
27
|
var import_react = require("react");
|
|
28
|
-
var import_react2 = require("react");
|
|
29
28
|
var import_registerFocusable = require("./registerFocusable");
|
|
30
29
|
function focusableInputHOC(Component) {
|
|
31
30
|
const component = Component.extractable(
|
|
32
|
-
(0,
|
|
31
|
+
(0, import_react.forwardRef)(
|
|
33
32
|
(props, ref) => {
|
|
34
33
|
const isInput = (0, import_core.isTamaguiComponent)(Component) && Component.staticConfig.isInput;
|
|
35
34
|
const inputValue = (0, import_react.useRef)(props.value || props.defaultValue || "");
|
|
36
|
-
const inputRef = (0,
|
|
35
|
+
const inputRef = (0, import_react.useCallback)(
|
|
37
36
|
(input) => {
|
|
38
37
|
if (!props.id)
|
|
39
38
|
return;
|
|
@@ -54,7 +53,7 @@ function focusableInputHOC(Component) {
|
|
|
54
53
|
[isInput, props.id]
|
|
55
54
|
);
|
|
56
55
|
const combinedRefs = (0, import_compose_refs.composeRefs)(ref, inputRef);
|
|
57
|
-
(0,
|
|
56
|
+
(0, import_react.useEffect)(() => {
|
|
58
57
|
if (!props.id)
|
|
59
58
|
return;
|
|
60
59
|
return () => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/focusableInputHOC.tsx"],
|
|
4
|
-
"sourcesContent": ["import { composeRefs } from '@tamagui/compose-refs'\nimport { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'\nimport
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
6
|
-
"names": [
|
|
4
|
+
"sourcesContent": ["import { composeRefs } from '@tamagui/compose-refs'\nimport { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'\nimport { forwardRef, useCallback, useEffect, useRef } from 'react'\n\nimport { registerFocusable, unregisterFocusable } from './registerFocusable'\n\nexport function focusableInputHOC<A extends TamaguiComponent>(Component: A): A {\n const component = Component.extractable(\n forwardRef(\n (\n props: {\n id?: string\n onChangeText?: (val: string) => void\n value?: string\n defaultValue?: string\n },\n ref\n ) => {\n const isInput = isTamaguiComponent(Component) && Component.staticConfig.isInput\n const inputValue = useRef(props.value || props.defaultValue || '')\n\n const inputRef = useCallback(\n (input) => {\n if (!props.id) return\n if (!input) return\n registerFocusable(props.id, {\n focus: input.focus,\n\n ...(isInput && {\n // react-native doesn't support programmatic .select()\n focusAndSelect() {\n input.focus()\n if (input.setSelection && typeof inputValue.current === 'string') {\n input.setSelection(0, inputValue.current.length)\n }\n },\n }),\n })\n },\n [isInput, props.id]\n )\n\n const combinedRefs = composeRefs(ref, inputRef)\n\n useEffect(() => {\n if (!props.id) return\n return () => {\n unregisterFocusable(props.id!)\n }\n }, [props.id])\n\n const onChangeText = useEvent((value) => {\n inputValue.current = value\n props.onChangeText?.(value)\n })\n\n const finalProps = isInput\n ? {\n ...props,\n onChangeText,\n }\n : props\n\n // @ts-expect-error\n return <Component ref={combinedRefs} {...finalProps} />\n }\n )\n ) as any\n\n return component\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgEe;AAhEf,0BAA4B;AAC5B,kBAA+D;AAC/D,mBAA2D;AAE3D,+BAAuD;AAEhD,SAAS,kBAA8C,WAAiB;AAC7E,QAAM,YAAY,UAAU;AAAA,QAC1B;AAAA,MACE,CACE,OAMA,QACG;AACH,cAAM,cAAU,gCAAmB,SAAS,KAAK,UAAU,aAAa;AACxE,cAAM,iBAAa,qBAAO,MAAM,SAAS,MAAM,gBAAgB,EAAE;AAEjE,cAAM,eAAW;AAAA,UACf,CAAC,UAAU;AACT,gBAAI,CAAC,MAAM;AAAI;AACf,gBAAI,CAAC;AAAO;AACZ,4DAAkB,MAAM,IAAI;AAAA,cAC1B,OAAO,MAAM;AAAA,cAEb,GAAI,WAAW;AAAA,gBAEb,iBAAiB;AACf,wBAAM,MAAM;AACZ,sBAAI,MAAM,gBAAgB,OAAO,WAAW,YAAY,UAAU;AAChE,0BAAM,aAAa,GAAG,WAAW,QAAQ,MAAM;AAAA,kBACjD;AAAA,gBACF;AAAA,cACF;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,CAAC,SAAS,MAAM,EAAE;AAAA,QACpB;AAEA,cAAM,mBAAe,iCAAY,KAAK,QAAQ;AAE9C,oCAAU,MAAM;AACd,cAAI,CAAC,MAAM;AAAI;AACf,iBAAO,MAAM;AACX,8DAAoB,MAAM,EAAG;AAAA,UAC/B;AAAA,QACF,GAAG,CAAC,MAAM,EAAE,CAAC;AAEb,cAAM,mBAAe,sBAAS,CAAC,UAAU;AAnDjD;AAoDU,qBAAW,UAAU;AACrB,sBAAM,iBAAN,+BAAqB;AAAA,QACvB,CAAC;AAED,cAAM,aAAa,UACf;AAAA,UACE,GAAG;AAAA,UACH;AAAA,QACF,IACA;AAGJ,eAAO,4CAAC;AAAA,UAAU,KAAK;AAAA,UAAe,GAAG;AAAA,SAAY;AAAA,MACvD;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { composeRefs } from "@tamagui/compose-refs";
|
|
3
3
|
import { isTamaguiComponent, useEvent } from "@tamagui/core";
|
|
4
|
-
import { useRef } from "react";
|
|
5
|
-
import { forwardRef, useCallback, useEffect } from "react";
|
|
4
|
+
import { forwardRef, useCallback, useEffect, useRef } from "react";
|
|
6
5
|
import { registerFocusable, unregisterFocusable } from "./registerFocusable";
|
|
7
6
|
function focusableInputHOC(Component) {
|
|
8
7
|
const component = Component.extractable(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/focusableInputHOC.tsx"],
|
|
4
|
-
"sourcesContent": ["import { composeRefs } from '@tamagui/compose-refs'\nimport { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'\nimport
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { composeRefs } from '@tamagui/compose-refs'\nimport { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'\nimport { forwardRef, useCallback, useEffect, useRef } from 'react'\n\nimport { registerFocusable, unregisterFocusable } from './registerFocusable'\n\nexport function focusableInputHOC<A extends TamaguiComponent>(Component: A): A {\n const component = Component.extractable(\n forwardRef(\n (\n props: {\n id?: string\n onChangeText?: (val: string) => void\n value?: string\n defaultValue?: string\n },\n ref\n ) => {\n const isInput = isTamaguiComponent(Component) && Component.staticConfig.isInput\n const inputValue = useRef(props.value || props.defaultValue || '')\n\n const inputRef = useCallback(\n (input) => {\n if (!props.id) return\n if (!input) return\n registerFocusable(props.id, {\n focus: input.focus,\n\n ...(isInput && {\n // react-native doesn't support programmatic .select()\n focusAndSelect() {\n input.focus()\n if (input.setSelection && typeof inputValue.current === 'string') {\n input.setSelection(0, inputValue.current.length)\n }\n },\n }),\n })\n },\n [isInput, props.id]\n )\n\n const combinedRefs = composeRefs(ref, inputRef)\n\n useEffect(() => {\n if (!props.id) return\n return () => {\n unregisterFocusable(props.id!)\n }\n }, [props.id])\n\n const onChangeText = useEvent((value) => {\n inputValue.current = value\n props.onChangeText?.(value)\n })\n\n const finalProps = isInput\n ? {\n ...props,\n onChangeText,\n }\n : props\n\n // @ts-expect-error\n return <Component ref={combinedRefs} {...finalProps} />\n }\n )\n ) as any\n\n return component\n}\n"],
|
|
5
|
+
"mappings": "AAgEe;AAhEf,SAAS,mBAAmB;AAC5B,SAA2B,oBAAoB,gBAAgB;AAC/D,SAAS,YAAY,aAAa,WAAW,cAAc;AAE3D,SAAS,mBAAmB,2BAA2B;AAEhD,SAAS,kBAA8C,WAAiB;AAC7E,QAAM,YAAY,UAAU;AAAA,IAC1B;AAAA,MACE,CACE,OAMA,QACG;AACH,cAAM,UAAU,mBAAmB,SAAS,KAAK,UAAU,aAAa;AACxE,cAAM,aAAa,OAAO,MAAM,SAAS,MAAM,gBAAgB,EAAE;AAEjE,cAAM,WAAW;AAAA,UACf,CAAC,UAAU;AACT,gBAAI,CAAC,MAAM;AAAI;AACf,gBAAI,CAAC;AAAO;AACZ,8BAAkB,MAAM,IAAI;AAAA,cAC1B,OAAO,MAAM;AAAA,cAEb,GAAI,WAAW;AAAA,gBAEb,iBAAiB;AACf,wBAAM,MAAM;AACZ,sBAAI,MAAM,gBAAgB,OAAO,WAAW,YAAY,UAAU;AAChE,0BAAM,aAAa,GAAG,WAAW,QAAQ,MAAM;AAAA,kBACjD;AAAA,gBACF;AAAA,cACF;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,CAAC,SAAS,MAAM,EAAE;AAAA,QACpB;AAEA,cAAM,eAAe,YAAY,KAAK,QAAQ;AAE9C,kBAAU,MAAM;AACd,cAAI,CAAC,MAAM;AAAI;AACf,iBAAO,MAAM;AACX,gCAAoB,MAAM,EAAG;AAAA,UAC/B;AAAA,QACF,GAAG,CAAC,MAAM,EAAE,CAAC;AAEb,cAAM,eAAe,SAAS,CAAC,UAAU;AAnDjD;AAoDU,qBAAW,UAAU;AACrB,sBAAM,iBAAN,+BAAqB;AAAA,QACvB,CAAC;AAED,cAAM,aAAa,UACf;AAAA,UACE,GAAG;AAAA,UACH;AAAA,QACF,IACA;AAGJ,eAAO,oBAAC;AAAA,UAAU,KAAK;AAAA,UAAe,GAAG;AAAA,SAAY;AAAA,MACvD;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { composeRefs } from "@tamagui/compose-refs";
|
|
2
2
|
import { isTamaguiComponent, useEvent } from "@tamagui/core";
|
|
3
|
-
import { useRef } from "react";
|
|
4
|
-
import { forwardRef, useCallback, useEffect } from "react";
|
|
3
|
+
import { forwardRef, useCallback, useEffect, useRef } from "react";
|
|
5
4
|
import { registerFocusable, unregisterFocusable } from "./registerFocusable";
|
|
6
5
|
function focusableInputHOC(Component) {
|
|
7
6
|
const component = Component.extractable(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/focusableInputHOC.tsx"],
|
|
4
|
-
"sourcesContent": ["import { composeRefs } from '@tamagui/compose-refs'\nimport { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'\nimport
|
|
5
|
-
"mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAA2B,oBAAoB,gBAAgB;AAC/D,
|
|
4
|
+
"sourcesContent": ["import { composeRefs } from '@tamagui/compose-refs'\nimport { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'\nimport { forwardRef, useCallback, useEffect, useRef } from 'react'\n\nimport { registerFocusable, unregisterFocusable } from './registerFocusable'\n\nexport function focusableInputHOC<A extends TamaguiComponent>(Component: A): A {\n const component = Component.extractable(\n forwardRef(\n (\n props: {\n id?: string\n onChangeText?: (val: string) => void\n value?: string\n defaultValue?: string\n },\n ref\n ) => {\n const isInput = isTamaguiComponent(Component) && Component.staticConfig.isInput\n const inputValue = useRef(props.value || props.defaultValue || '')\n\n const inputRef = useCallback(\n (input) => {\n if (!props.id) return\n if (!input) return\n registerFocusable(props.id, {\n focus: input.focus,\n\n ...(isInput && {\n // react-native doesn't support programmatic .select()\n focusAndSelect() {\n input.focus()\n if (input.setSelection && typeof inputValue.current === 'string') {\n input.setSelection(0, inputValue.current.length)\n }\n },\n }),\n })\n },\n [isInput, props.id]\n )\n\n const combinedRefs = composeRefs(ref, inputRef)\n\n useEffect(() => {\n if (!props.id) return\n return () => {\n unregisterFocusable(props.id!)\n }\n }, [props.id])\n\n const onChangeText = useEvent((value) => {\n inputValue.current = value\n props.onChangeText?.(value)\n })\n\n const finalProps = isInput\n ? {\n ...props,\n onChangeText,\n }\n : props\n\n // @ts-expect-error\n return <Component ref={combinedRefs} {...finalProps} />\n }\n )\n ) as any\n\n return component\n}\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAA2B,oBAAoB,gBAAgB;AAC/D,SAAS,YAAY,aAAa,WAAW,cAAc;AAE3D,SAAS,mBAAmB,2BAA2B;AAEhD,SAAS,kBAA8C,WAAiB;AAC7E,QAAM,YAAY,UAAU;AAAA,IAC1B;AAAA,MACE,CACE,OAMA,QACG;AACH,cAAM,UAAU,mBAAmB,SAAS,KAAK,UAAU,aAAa;AACxE,cAAM,aAAa,OAAO,MAAM,SAAS,MAAM,gBAAgB,EAAE;AAEjE,cAAM,WAAW;AAAA,UACf,CAAC,UAAU;AACT,gBAAI,CAAC,MAAM;AAAI;AACf,gBAAI,CAAC;AAAO;AACZ,8BAAkB,MAAM,IAAI;AAAA,cAC1B,OAAO,MAAM;AAAA,cAEb,GAAI,WAAW;AAAA,gBAEb,iBAAiB;AACf,wBAAM,MAAM;AACZ,sBAAI,MAAM,gBAAgB,OAAO,WAAW,YAAY,UAAU;AAChE,0BAAM,aAAa,GAAG,WAAW,QAAQ,MAAM;AAAA,kBACjD;AAAA,gBACF;AAAA,cACF;AAAA,YACF,CAAC;AAAA,UACH;AAAA,UACA,CAAC,SAAS,MAAM,EAAE;AAAA,QACpB;AAEA,cAAM,eAAe,YAAY,KAAK,QAAQ;AAE9C,kBAAU,MAAM;AACd,cAAI,CAAC,MAAM;AAAI;AACf,iBAAO,MAAM;AACX,gCAAoB,MAAM,EAAG;AAAA,UAC/B;AAAA,QACF,GAAG,CAAC,MAAM,EAAE,CAAC;AAEb,cAAM,eAAe,SAAS,CAAC,UAAU;AACvC,qBAAW,UAAU;AACrB,gBAAM,eAAe,KAAK;AAAA,QAC5B,CAAC;AAED,cAAM,aAAa,UACf;AAAA,UACE,GAAG;AAAA,UACH;AAAA,QACF,IACA;AAGJ,eAAO,CAAC,UAAU,KAAK,kBAAkB,YAAY;AAAA,MACvD;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/focusable",
|
|
3
|
-
"version": "1.0.1-beta.
|
|
3
|
+
"version": "1.0.1-beta.221",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"source": "src/index.ts",
|
|
6
6
|
"types": "./types/index.d.ts",
|
|
@@ -16,21 +16,21 @@
|
|
|
16
16
|
"scripts": {
|
|
17
17
|
"build": "tamagui-build",
|
|
18
18
|
"watch": "tamagui-build --watch",
|
|
19
|
-
"lint": "eslint",
|
|
19
|
+
"lint": "eslint src",
|
|
20
20
|
"lint:fix": "yarn lint --fix",
|
|
21
21
|
"clean": "tamagui-build clean",
|
|
22
22
|
"clean:build": "tamagui-build clean:build"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@tamagui/compose-refs": "^1.0.1-beta.
|
|
26
|
-
"@tamagui/core": "^1.0.1-beta.
|
|
25
|
+
"@tamagui/compose-refs": "^1.0.1-beta.221",
|
|
26
|
+
"@tamagui/core": "^1.0.1-beta.221"
|
|
27
27
|
},
|
|
28
28
|
"peerDependencies": {
|
|
29
29
|
"react": ">=18",
|
|
30
30
|
"react-dom": ">=18"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
|
-
"@tamagui/build": "^1.0.1-beta.
|
|
33
|
+
"@tamagui/build": "^1.0.1-beta.221",
|
|
34
34
|
"react": ">=18",
|
|
35
35
|
"react-dom": ">=18"
|
|
36
36
|
},
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { composeRefs } from '@tamagui/compose-refs'
|
|
2
2
|
import { TamaguiComponent, isTamaguiComponent, useEvent } from '@tamagui/core'
|
|
3
|
-
import
|
|
4
|
-
import { forwardRef, useCallback, useEffect } from 'react'
|
|
3
|
+
import { forwardRef, useCallback, useEffect, useRef } from 'react'
|
|
5
4
|
|
|
6
5
|
import { registerFocusable, unregisterFocusable } from './registerFocusable'
|
|
7
6
|
|