tamagui 1.11.2 → 1.12.0

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.
Files changed (14) hide show
  1. package/dist/cjs/views/Input.js +4 -3
  2. package/dist/cjs/views/Input.js.map +2 -2
  3. package/dist/esm/views/Input.js +4 -3
  4. package/dist/esm/views/Input.js.map +2 -2
  5. package/dist/esm/views/Input.mjs +4 -3
  6. package/dist/esm/views/Input.mjs.map +2 -2
  7. package/dist/jsx/views/Input.js +4 -3
  8. package/dist/jsx/views/Input.js.map +2 -2
  9. package/dist/jsx/views/Input.mjs +4 -3
  10. package/dist/jsx/views/Input.mjs.map +2 -2
  11. package/package.json +51 -51
  12. package/src/views/Input.tsx +3 -2
  13. package/types/views/Input.d.ts +3 -2
  14. package/types/views/Input.d.ts.map +1 -1
package/dist/cjs/views/Input.js CHANGED
@@ -46,9 +46,10 @@ const defaultStyles = {
46
46
  borderColor: "$borderColorHover"
47
47
  },
48
48
  focusStyle: {
49
- borderColor: "$borderColorFocus",
50
- borderWidth: 2,
51
- marginHorizontal: -1
49
+ outlineColor: "$borderColorFocus",
50
+ outlineWidth: 2,
51
+ outlineStyle: "solid",
52
+ borderColor: "$borderColorFocus"
52
53
  }
53
54
  };
54
55
  const InputFrame = (0, import_core.styled)(
package/dist/cjs/views/Input.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/views/Input.tsx"],
4
- "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n borderWidth: 2,\n marginHorizontal: -1,\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAmD;AACnD,uBAAkC;AAClC,0BAA0B;AAE1B,0BAAiC;AAAA,IAEjC,8BAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,IACb,aAAa;AAAA,IACb,kBAAkB;AAAA,EACpB;AACF;AAEO,MAAM,iBAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,YAAQ,oCAAkB,UAAU;",
4
+ "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n outlineColor: '$borderColorFocus',\n outlineWidth: 2,\n outlineStyle: 'solid',\n borderColor: '$borderColorFocus',\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAmD;AACnD,uBAAkC;AAClC,0BAA0B;AAE1B,0BAAiC;AAAA,IAEjC,8BAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;AAEO,MAAM,iBAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,YAAQ,oCAAkB,UAAU;",
6
6
  "names": []
7
7
  }
package/dist/esm/views/Input.js CHANGED
@@ -21,9 +21,10 @@ const defaultStyles = {
21
21
  borderColor: "$borderColorHover"
22
22
  },
23
23
  focusStyle: {
24
- borderColor: "$borderColorFocus",
25
- borderWidth: 2,
26
- marginHorizontal: -1
24
+ outlineColor: "$borderColorFocus",
25
+ outlineWidth: 2,
26
+ outlineStyle: "solid",
27
+ borderColor: "$borderColorFocus"
27
28
  }
28
29
  };
29
30
  const InputFrame = styled(
package/dist/esm/views/Input.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/views/Input.tsx"],
4
- "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n borderWidth: 2,\n marginHorizontal: -1,\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
- "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,IACb,aAAa;AAAA,IACb,kBAAkB;AAAA,EACpB;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
4
+ "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n outlineColor: '$borderColorFocus',\n outlineWidth: 2,\n outlineStyle: 'solid',\n borderColor: '$borderColorFocus',\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
+ "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
6
6
  "names": []
7
7
  }
package/dist/esm/views/Input.mjs CHANGED
@@ -21,9 +21,10 @@ const defaultStyles = {
21
21
  borderColor: "$borderColorHover"
22
22
  },
23
23
  focusStyle: {
24
- borderColor: "$borderColorFocus",
25
- borderWidth: 2,
26
- marginHorizontal: -1
24
+ outlineColor: "$borderColorFocus",
25
+ outlineWidth: 2,
26
+ outlineStyle: "solid",
27
+ borderColor: "$borderColorFocus"
27
28
  }
28
29
  };
29
30
  const InputFrame = styled(
package/dist/esm/views/Input.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/views/Input.tsx"],
4
- "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n borderWidth: 2,\n marginHorizontal: -1,\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
- "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,IACb,aAAa;AAAA,IACb,kBAAkB;AAAA,EACpB;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
4
+ "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n outlineColor: '$borderColorFocus',\n outlineWidth: 2,\n outlineStyle: 'solid',\n borderColor: '$borderColorFocus',\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
+ "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
6
6
  "names": []
7
7
  }
package/dist/jsx/views/Input.js CHANGED
@@ -21,9 +21,10 @@ const defaultStyles = {
21
21
  borderColor: "$borderColorHover"
22
22
  },
23
23
  focusStyle: {
24
- borderColor: "$borderColorFocus",
25
- borderWidth: 2,
26
- marginHorizontal: -1
24
+ outlineColor: "$borderColorFocus",
25
+ outlineWidth: 2,
26
+ outlineStyle: "solid",
27
+ borderColor: "$borderColorFocus"
27
28
  }
28
29
  };
29
30
  const InputFrame = styled(
package/dist/jsx/views/Input.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/views/Input.tsx"],
4
- "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n borderWidth: 2,\n marginHorizontal: -1,\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
- "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,IACb,aAAa;AAAA,IACb,kBAAkB;AAAA,EACpB;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
4
+ "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n outlineColor: '$borderColorFocus',\n outlineWidth: 2,\n outlineStyle: 'solid',\n borderColor: '$borderColorFocus',\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
+ "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
6
6
  "names": []
7
7
  }
package/dist/jsx/views/Input.mjs CHANGED
@@ -21,9 +21,10 @@ const defaultStyles = {
21
21
  borderColor: "$borderColorHover"
22
22
  },
23
23
  focusStyle: {
24
- borderColor: "$borderColorFocus",
25
- borderWidth: 2,
26
- marginHorizontal: -1
24
+ outlineColor: "$borderColorFocus",
25
+ outlineWidth: 2,
26
+ outlineStyle: "solid",
27
+ borderColor: "$borderColorFocus"
27
28
  }
28
29
  };
29
30
  const InputFrame = styled(
package/dist/jsx/views/Input.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/views/Input.tsx"],
4
- "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n borderWidth: 2,\n marginHorizontal: -1,\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
- "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,IACb,aAAa;AAAA,IACb,kBAAkB;AAAA,EACpB;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
4
+ "sourcesContent": ["import { GetProps, setupReactNative, styled } from '@tamagui/core'\nimport { focusableInputHOC } from '@tamagui/focusable'\nimport { TextInput } from 'react-native'\n\nimport { inputSizeVariant } from '../helpers/inputHelpers'\n\nsetupReactNative({\n TextInput,\n})\n\nexport const defaultStyles = {\n size: '$true',\n fontFamily: '$body',\n borderWidth: 1,\n outlineWidth: 0,\n color: '$color',\n focusable: true,\n borderColor: '$borderColor',\n backgroundColor: '$background',\n placeholderTextColor: '$placeholderColor',\n\n // this fixes a flex bug where it overflows container\n minWidth: 0,\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n outlineColor: '$borderColorFocus',\n outlineWidth: 2,\n outlineStyle: 'solid',\n borderColor: '$borderColorFocus',\n },\n} as const\n\nexport const InputFrame = styled(\n TextInput,\n {\n name: 'Input',\n\n variants: {\n unstyled: {\n false: defaultStyles,\n },\n\n size: {\n '...size': inputSizeVariant,\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n },\n {\n isInput: true,\n }\n)\n\nexport type InputProps = GetProps<typeof InputFrame>\n\nexport const Input = focusableInputHOC(InputFrame)\n"],
5
+ "mappings": "AAAA,SAAmB,kBAAkB,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAE1B,SAAS,wBAAwB;AAEjC,iBAAiB;AAAA,EACf;AACF,CAAC;AAEM,MAAM,gBAAgB;AAAA,EAC3B,MAAM;AAAA,EACN,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,sBAAsB;AAAA;AAAA,EAGtB,UAAU;AAAA,EAEV,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;AAEO,MAAM,aAAa;AAAA,EACxB;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IAEN,UAAU;AAAA,MACR,UAAU;AAAA,QACR,OAAO;AAAA,MACT;AAAA,MAEA,MAAM;AAAA,QACJ,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IAEA,iBAAiB;AAAA,MACf,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAIO,MAAM,QAAQ,kBAAkB,UAAU;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tamagui",
3
- "version": "1.11.2",
3
+ "version": "1.12.0",
4
4
  "sideEffects": [
5
5
  "*.css",
6
6
  "setup.js"
@@ -40,55 +40,55 @@
40
40
  }
41
41
  },
42
42
  "dependencies": {
43
- "@tamagui/adapt": "1.11.2",
44
- "@tamagui/alert-dialog": "1.11.2",
45
- "@tamagui/animate-presence": "1.11.2",
46
- "@tamagui/avatar": "1.11.2",
47
- "@tamagui/button": "1.11.2",
48
- "@tamagui/card": "1.11.2",
49
- "@tamagui/checkbox": "1.11.2",
50
- "@tamagui/compose-refs": "1.11.2",
51
- "@tamagui/core": "1.11.2",
52
- "@tamagui/create-context": "1.11.2",
53
- "@tamagui/dialog": "1.11.2",
54
- "@tamagui/fake-react-native": "1.11.2",
55
- "@tamagui/focusable": "1.11.2",
56
- "@tamagui/font-size": "1.11.2",
57
- "@tamagui/form": "1.11.2",
58
- "@tamagui/get-button-sized": "1.11.2",
59
- "@tamagui/get-font-sized": "1.11.2",
60
- "@tamagui/get-size": "1.11.2",
61
- "@tamagui/helpers": "1.11.2",
62
- "@tamagui/helpers-tamagui": "1.11.2",
63
- "@tamagui/image": "1.11.2",
64
- "@tamagui/label": "1.11.2",
65
- "@tamagui/linear-gradient": "1.11.2",
66
- "@tamagui/list-item": "1.11.2",
67
- "@tamagui/popover": "1.11.2",
68
- "@tamagui/popper": "1.11.2",
69
- "@tamagui/portal": "1.11.2",
70
- "@tamagui/progress": "1.11.2",
71
- "@tamagui/radio-group": "1.11.2",
72
- "@tamagui/react-native-media-driver": "1.11.2",
73
- "@tamagui/scroll-view": "1.11.2",
74
- "@tamagui/select": "1.11.2",
75
- "@tamagui/separator": "1.11.2",
76
- "@tamagui/shapes": "1.11.2",
77
- "@tamagui/sheet": "1.11.2",
78
- "@tamagui/slider": "1.11.2",
79
- "@tamagui/stacks": "1.11.2",
80
- "@tamagui/switch": "1.11.2",
81
- "@tamagui/tabs": "1.11.2",
82
- "@tamagui/text": "1.11.2",
83
- "@tamagui/toast": "1.11.2",
84
- "@tamagui/toggle-group": "1.11.2",
85
- "@tamagui/tooltip": "1.11.2",
86
- "@tamagui/use-controllable-state": "1.11.2",
87
- "@tamagui/use-debounce": "1.11.2",
88
- "@tamagui/use-event": "1.11.2",
89
- "@tamagui/use-force-update": "1.11.2",
90
- "@tamagui/use-window-dimensions": "1.11.2",
91
- "@tamagui/visually-hidden": "1.11.2",
43
+ "@tamagui/adapt": "1.12.0",
44
+ "@tamagui/alert-dialog": "1.12.0",
45
+ "@tamagui/animate-presence": "1.12.0",
46
+ "@tamagui/avatar": "1.12.0",
47
+ "@tamagui/button": "1.12.0",
48
+ "@tamagui/card": "1.12.0",
49
+ "@tamagui/checkbox": "1.12.0",
50
+ "@tamagui/compose-refs": "1.12.0",
51
+ "@tamagui/core": "1.12.0",
52
+ "@tamagui/create-context": "1.12.0",
53
+ "@tamagui/dialog": "1.12.0",
54
+ "@tamagui/fake-react-native": "1.12.0",
55
+ "@tamagui/focusable": "1.12.0",
56
+ "@tamagui/font-size": "1.12.0",
57
+ "@tamagui/form": "1.12.0",
58
+ "@tamagui/get-button-sized": "1.12.0",
59
+ "@tamagui/get-font-sized": "1.12.0",
60
+ "@tamagui/get-size": "1.12.0",
61
+ "@tamagui/helpers": "1.12.0",
62
+ "@tamagui/helpers-tamagui": "1.12.0",
63
+ "@tamagui/image": "1.12.0",
64
+ "@tamagui/label": "1.12.0",
65
+ "@tamagui/linear-gradient": "1.12.0",
66
+ "@tamagui/list-item": "1.12.0",
67
+ "@tamagui/popover": "1.12.0",
68
+ "@tamagui/popper": "1.12.0",
69
+ "@tamagui/portal": "1.12.0",
70
+ "@tamagui/progress": "1.12.0",
71
+ "@tamagui/radio-group": "1.12.0",
72
+ "@tamagui/react-native-media-driver": "1.12.0",
73
+ "@tamagui/scroll-view": "1.12.0",
74
+ "@tamagui/select": "1.12.0",
75
+ "@tamagui/separator": "1.12.0",
76
+ "@tamagui/shapes": "1.12.0",
77
+ "@tamagui/sheet": "1.12.0",
78
+ "@tamagui/slider": "1.12.0",
79
+ "@tamagui/stacks": "1.12.0",
80
+ "@tamagui/switch": "1.12.0",
81
+ "@tamagui/tabs": "1.12.0",
82
+ "@tamagui/text": "1.12.0",
83
+ "@tamagui/toast": "1.12.0",
84
+ "@tamagui/toggle-group": "1.12.0",
85
+ "@tamagui/tooltip": "1.12.0",
86
+ "@tamagui/use-controllable-state": "1.12.0",
87
+ "@tamagui/use-debounce": "1.12.0",
88
+ "@tamagui/use-event": "1.12.0",
89
+ "@tamagui/use-force-update": "1.12.0",
90
+ "@tamagui/use-window-dimensions": "1.12.0",
91
+ "@tamagui/visually-hidden": "1.12.0",
92
92
  "reforest": "^0.12.1"
93
93
  },
94
94
  "peerDependencies": {
@@ -96,7 +96,7 @@
96
96
  "react-native-web": "*"
97
97
  },
98
98
  "devDependencies": {
99
- "@tamagui/build": "1.11.2",
99
+ "@tamagui/build": "1.12.0",
100
100
  "@types/node": "^16.11.9",
101
101
  "@types/react": "^18.0.15",
102
102
  "react": "^18.2.0",
package/src/views/Input.tsx CHANGED
@@ -27,9 +27,10 @@ export const defaultStyles = {
27
27
  },
28
28
 
29
29
  focusStyle: {
30
+ outlineColor: '$borderColorFocus',
31
+ outlineWidth: 2,
32
+ outlineStyle: 'solid',
30
33
  borderColor: '$borderColorFocus',
31
- borderWidth: 2,
32
- marginHorizontal: -1,
33
34
  },
34
35
  } as const
35
36
 
package/types/views/Input.d.ts CHANGED
@@ -14,9 +14,10 @@ export declare const defaultStyles: {
14
14
  readonly borderColor: "$borderColorHover";
15
15
  };
16
16
  readonly focusStyle: {
17
+ readonly outlineColor: "$borderColorFocus";
18
+ readonly outlineWidth: 2;
19
+ readonly outlineStyle: "solid";
17
20
  readonly borderColor: "$borderColorFocus";
18
- readonly borderWidth: 2;
19
- readonly marginHorizontal: -1;
20
21
  };
21
22
  };
22
23
  export declare const InputFrame: import("@tamagui/core").TamaguiComponent<import("react-native").TextInputProps & Omit<import("@tamagui/core").TextProps, keyof import("react-native").TextInputProps> & Omit<{}, "size" | "unstyled"> & {
package/types/views/Input.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/views/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA4B,MAAM,eAAe,CAAA;AAUlE,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;CAuBhB,CAAA;AAEV,eAAO,MAAM,UAAU;;;;;;;;;;;;EAsBtB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA;AAEpD,eAAO,MAAM,KAAK;;;;;;;;;;;;EAAgC,CAAA"}
1
+ {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/views/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA4B,MAAM,eAAe,CAAA;AAUlE,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;CAwBhB,CAAA;AAEV,eAAO,MAAM,UAAU;;;;;;;;;;;;EAsBtB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA;AAEpD,eAAO,MAAM,KAAK;;;;;;;;;;;;EAAgC,CAAA"}