@tamagui/button 1.0.1-beta.68 → 1.0.1-beta.71
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/Button.js +6 -2
- package/dist/cjs/Button.js.map +2 -2
- package/dist/esm/Button.js +5 -2
- package/dist/esm/Button.js.map +2 -2
- package/dist/jsx/Button.js +5 -2
- package/package.json +8 -6
- package/src/Button.tsx +5 -3
- package/types/Button.d.ts +13 -13
- package/types/Button.d.ts.map +1 -1
- package/types/index.d.ts +0 -0
- package/types/index.d.ts.map +0 -0
package/dist/cjs/Button.js
CHANGED
|
@@ -50,6 +50,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
50
50
|
var Button_exports = {};
|
|
51
51
|
__export(Button_exports, {
|
|
52
52
|
Button: () => Button,
|
|
53
|
+
ButtonFrame: () => ButtonFrame,
|
|
53
54
|
ButtonText: () => ButtonText
|
|
54
55
|
});
|
|
55
56
|
module.exports = __toCommonJS(Button_exports);
|
|
@@ -63,8 +64,9 @@ import_react.default["createElement"];
|
|
|
63
64
|
const ButtonFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
64
65
|
name: "Button",
|
|
65
66
|
tag: "button",
|
|
66
|
-
|
|
67
|
-
|
|
67
|
+
focusable: true,
|
|
68
|
+
hoverTheme: true,
|
|
69
|
+
pressTheme: true,
|
|
68
70
|
backgrounded: true,
|
|
69
71
|
borderWidth: 1,
|
|
70
72
|
borderColor: "transparent",
|
|
@@ -107,6 +109,7 @@ const ButtonFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
|
107
109
|
const ButtonText = (0, import_core.styled)(import_text.SizableText, {
|
|
108
110
|
color: "$color",
|
|
109
111
|
selectable: false,
|
|
112
|
+
cursor: "inherit",
|
|
110
113
|
flexGrow: 0,
|
|
111
114
|
flexShrink: 1,
|
|
112
115
|
ellipse: true
|
|
@@ -185,6 +188,7 @@ const Button = ButtonFrame.extractable((0, import_core.themeable)(ButtonComponen
|
|
|
185
188
|
// Annotate the CommonJS export names for ESM import in node:
|
|
186
189
|
0 && (module.exports = {
|
|
187
190
|
Button,
|
|
191
|
+
ButtonFrame,
|
|
188
192
|
ButtonText
|
|
189
193
|
});
|
|
190
194
|
//# sourceMappingURL=Button.js.map
|
package/dist/cjs/Button.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n ReactComponentWithRef,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport {\n TextParentStyles,\n useGetThemedIcon,\n wrapStringChildrenInText,\n} from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef, useContext } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ButtonIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ButtonIconProps> | null\n\nexport type ButtonProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ButtonFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // dont wrap inner contents in a text element\n noTextWrap?: boolean\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n }\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAUO;AACP,uBAA4B;AAC5B,6BAIO;AACP,oBAA+B;AAC/B,kBAA4B;AAC5B,mBAAiE;AAIjE,qBAAM;
|
|
4
|
+
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n ReactComponentWithRef,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport {\n TextParentStyles,\n useGetThemedIcon,\n wrapStringChildrenInText,\n} from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef, useContext } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ButtonIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ButtonIconProps> | null\n\nexport type ButtonProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ButtonFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // dont wrap inner contents in a text element\n noTextWrap?: boolean\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n }\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: 'Button',\n tag: 'button',\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n\n // if we wanted this only when pressable = true, we'd need to merge variants?\n cursor: 'pointer',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n\n variants: {\n size: {\n '...size': getButtonSize,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n pointerEvents: 'none',\n },\n },\n\n // TODO see core/styled.ts bug\n } as const,\n\n defaultVariants: {\n size: '$4',\n },\n})\n\n// see TODO breaking types\n// type x = GetProps<typeof ButtonFrame>\n// type y = x['size']\n\nexport const ButtonText = styled(SizableText, {\n color: '$color',\n selectable: false,\n cursor: 'inherit',\n // flexGrow 1 leads to inconsistent native style where text pushes to start of view\n flexGrow: 0,\n flexShrink: 1,\n ellipse: true,\n})\n\nconst ButtonComponent = forwardRef((props: ButtonProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 0.66,\n separator,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n ...rest\n } = props as ButtonProps\n\n const isInsideButton = useContext(ButtonInsideButtonContext)\n const size = props.size || '$4'\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapStringChildrenInText(ButtonText, props)\n\n return (\n <ButtonFrame\n fontFamily={fontFamily}\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n {...(isInsideButton && {\n tag: 'span',\n })}\n ref={ref as any}\n {...rest}\n >\n <ButtonInsideButtonContext.Provider value={true}>\n {themedIcon || themedIconAfter\n ? spacedChildren({\n // a bit arbitrary but scaling to font size is necessary so long as button does\n space: spaceSize,\n spaceFlex,\n separator,\n direction: props.flexDirection || 'row',\n children: [themedIcon, contents, themedIconAfter],\n })\n : contents}\n </ButtonInsideButtonContext.Provider>\n </ButtonFrame>\n )\n})\n\nexport const Button: ReactComponentWithRef<ButtonProps, HTMLButtonElement | View> =\n ButtonFrame.extractable(themeable(ButtonComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/Button.js
CHANGED
|
@@ -18,8 +18,9 @@ React["createElement"];
|
|
|
18
18
|
const ButtonFrame = styled(ThemeableStack, {
|
|
19
19
|
name: "Button",
|
|
20
20
|
tag: "button",
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
focusable: true,
|
|
22
|
+
hoverTheme: true,
|
|
23
|
+
pressTheme: true,
|
|
23
24
|
backgrounded: true,
|
|
24
25
|
borderWidth: 1,
|
|
25
26
|
borderColor: "transparent",
|
|
@@ -62,6 +63,7 @@ const ButtonFrame = styled(ThemeableStack, {
|
|
|
62
63
|
const ButtonText = styled(SizableText, {
|
|
63
64
|
color: "$color",
|
|
64
65
|
selectable: false,
|
|
66
|
+
cursor: "inherit",
|
|
65
67
|
flexGrow: 0,
|
|
66
68
|
flexShrink: 1,
|
|
67
69
|
ellipse: true
|
|
@@ -123,6 +125,7 @@ const Button = ButtonFrame.extractable(themeable(ButtonComponent), {
|
|
|
123
125
|
});
|
|
124
126
|
export {
|
|
125
127
|
Button,
|
|
128
|
+
ButtonFrame,
|
|
126
129
|
ButtonText
|
|
127
130
|
};
|
|
128
131
|
//# sourceMappingURL=Button.js.map
|
package/dist/esm/Button.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n ReactComponentWithRef,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport {\n TextParentStyles,\n useGetThemedIcon,\n wrapStringChildrenInText,\n} from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef, useContext } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ButtonIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ButtonIconProps> | null\n\nexport type ButtonProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ButtonFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // dont wrap inner contents in a text element\n noTextWrap?: boolean\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n }\n\
|
|
5
|
-
"mappings": "AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AAIA,MAAM;
|
|
4
|
+
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n ReactComponentWithRef,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport {\n TextParentStyles,\n useGetThemedIcon,\n wrapStringChildrenInText,\n} from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText } from '@tamagui/text'\nimport React, { FunctionComponent, forwardRef, useContext } from 'react'\nimport { View } from 'react-native'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\ntype ButtonIconProps = { color?: string; size?: number }\ntype IconProp = JSX.Element | FunctionComponent<ButtonIconProps> | null\n\nexport type ButtonProps = Omit<TextParentStyles, 'TextComponent'> &\n GetProps<typeof ButtonFrame> &\n ThemeableProps & {\n // add icon before, passes color and size automatically if Component\n icon?: IconProp\n // add icon after, passes color and size automatically if Component\n iconAfter?: IconProp\n // adjust icon relative to size\n // default: -1\n scaleIcon?: number\n // dont wrap inner contents in a text element\n noTextWrap?: boolean\n // make the spacing elements flex\n spaceFlex?: number | boolean\n // adjust internal space relative to icon size\n scaleSpace?: number\n }\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: 'Button',\n tag: 'button',\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n\n // if we wanted this only when pressable = true, we'd need to merge variants?\n cursor: 'pointer',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n\n variants: {\n size: {\n '...size': getButtonSize,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n opacity: 0.5,\n pointerEvents: 'none',\n },\n },\n\n // TODO see core/styled.ts bug\n } as const,\n\n defaultVariants: {\n size: '$4',\n },\n})\n\n// see TODO breaking types\n// type x = GetProps<typeof ButtonFrame>\n// type y = x['size']\n\nexport const ButtonText = styled(SizableText, {\n color: '$color',\n selectable: false,\n cursor: 'inherit',\n // flexGrow 1 leads to inconsistent native style where text pushes to start of view\n flexGrow: 0,\n flexShrink: 1,\n ellipse: true,\n})\n\nconst ButtonComponent = forwardRef((props: ButtonProps, ref) => {\n // careful not to desctructure and re-order props, order is important\n const {\n children,\n icon,\n iconAfter,\n noTextWrap,\n theme: themeName,\n space,\n spaceFlex,\n scaleIcon = 1,\n scaleSpace = 0.66,\n separator,\n\n // text props\n color,\n fontWeight,\n letterSpacing,\n fontSize,\n fontFamily,\n textAlign,\n textProps,\n ...rest\n } = props as ButtonProps\n\n const isInsideButton = useContext(ButtonInsideButtonContext)\n const size = props.size || '$4'\n const iconSize = getFontSize(size) * scaleIcon\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color })\n const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon)\n const spaceSize = getVariableValue(iconSize) * scaleSpace\n const contents = wrapStringChildrenInText(ButtonText, props)\n\n return (\n <ButtonFrame\n fontFamily={fontFamily}\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n {...(isInsideButton && {\n tag: 'span',\n })}\n ref={ref as any}\n {...rest}\n >\n <ButtonInsideButtonContext.Provider value={true}>\n {themedIcon || themedIconAfter\n ? spacedChildren({\n // a bit arbitrary but scaling to font size is necessary so long as button does\n space: spaceSize,\n spaceFlex,\n separator,\n direction: props.flexDirection || 'row',\n children: [themedIcon, contents, themedIconAfter],\n })\n : contents}\n </ButtonInsideButtonContext.Provider>\n </ButtonFrame>\n )\n})\n\nexport const Button: ReactComponentWithRef<ButtonProps, HTMLButtonElement | View> =\n ButtonFrame.extractable(themeable(ButtonComponent as any) as any, {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n ]),\n })\n"],
|
|
5
|
+
"mappings": "AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AAAA;AAAA;AAAA;AAKA;AACA;AACA;AAIA,MAAM;AAuBC,MAAM,cAAc,OAAO,gBAAgB;AAAA,EAChD,MAAM;AAAA,EACN,KAAK;AAAA,EACL,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,aAAa;AAAA,EACb,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,eAAe;AAAA,EAGf,QAAQ;AAAA,EAER,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,YAAY;AAAA,IACV,aAAa;AAAA,EACf;AAAA,EAEA,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,WAAW;AAAA,IACb;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM;AAAA,QACJ,YAAY;AAAA,UACV,iBAAiB;AAAA,QACnB;AAAA,MACF;AAAA,IACF;AAAA,IAEA,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,eAAe;AAAA,MACjB;AAAA,IACF;AAAA,EAGF;AAAA,EAEA,iBAAiB;AAAA,IACf,MAAM;AAAA,EACR;AACF,CAAC;AAMM,MAAM,aAAa,OAAO,aAAa;AAAA,EAC5C,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,QAAQ;AAAA,EAER,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,SAAS;AACX,CAAC;AAED,MAAM,kBAAkB,WAAW,CAAC,OAAoB,QAAQ;AAE9D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,aAAa;AAAA,IACb;AAAA,IAGA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,OACG;AAAA,MACD;AAEJ,QAAM,iBAAiB,WAAW,yBAAyB;AAC3D,QAAM,OAAO,MAAM,QAAQ;AAC3B,QAAM,WAAW,YAAY,IAAI,IAAI;AACrC,QAAM,gBAAgB,iBAAiB,EAAE,MAAM,UAAU,MAAM,CAAC;AAChE,QAAM,CAAC,YAAY,mBAAmB,CAAC,MAAM,SAAS,EAAE,IAAI,aAAa;AACzE,QAAM,YAAY,iBAAiB,QAAQ,IAAI;AAC/C,QAAM,WAAW,yBAAyB,YAAY,KAAK;AAE3D,SACE,oCAAC;AAAA,IACC;AAAA,IAEC,GAAI,kBAAkB;AAAA,MACrB,KAAK;AAAA,IACP;AAAA,IACA;AAAA,IACC,GAAG;AAAA,KAEJ,oCAAC,0BAA0B,UAA1B;AAAA,IAAmC,OAAO;AAAA,KACxC,cAAc,kBACX,eAAe;AAAA,IAEb,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,WAAW,MAAM,iBAAiB;AAAA,IAClC,UAAU,CAAC,YAAY,UAAU,eAAe;AAAA,EAClD,CAAC,IACD,QACN,CACF;AAEJ,CAAC;AAEM,MAAM,SACX,YAAY,YAAY,UAAU,eAAsB,GAAU;AAAA,EAChE,aAAa,oBAAI,IAAI;AAAA,IAEnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACH,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/jsx/Button.js
CHANGED
|
@@ -18,8 +18,9 @@ React["createElement"];
|
|
|
18
18
|
const ButtonFrame = styled(ThemeableStack, {
|
|
19
19
|
name: "Button",
|
|
20
20
|
tag: "button",
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
focusable: true,
|
|
22
|
+
hoverTheme: true,
|
|
23
|
+
pressTheme: true,
|
|
23
24
|
backgrounded: true,
|
|
24
25
|
borderWidth: 1,
|
|
25
26
|
borderColor: "transparent",
|
|
@@ -62,6 +63,7 @@ const ButtonFrame = styled(ThemeableStack, {
|
|
|
62
63
|
const ButtonText = styled(SizableText, {
|
|
63
64
|
color: "$color",
|
|
64
65
|
selectable: false,
|
|
66
|
+
cursor: "inherit",
|
|
65
67
|
flexGrow: 0,
|
|
66
68
|
flexShrink: 1,
|
|
67
69
|
ellipse: true
|
|
@@ -116,5 +118,6 @@ const Button = ButtonFrame.extractable(themeable(ButtonComponent), {
|
|
|
116
118
|
});
|
|
117
119
|
export {
|
|
118
120
|
Button,
|
|
121
|
+
ButtonFrame,
|
|
119
122
|
ButtonText
|
|
120
123
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/button",
|
|
3
|
-
"version": "1.0.1-beta.
|
|
4
|
-
"sideEffects":
|
|
3
|
+
"version": "1.0.1-beta.71",
|
|
4
|
+
"sideEffects": [
|
|
5
|
+
"*.css"
|
|
6
|
+
],
|
|
5
7
|
"source": "src/index.ts",
|
|
6
8
|
"types": "./types/index.d.ts",
|
|
7
9
|
"main": "dist/cjs",
|
|
@@ -17,16 +19,16 @@
|
|
|
17
19
|
"watch": "tamagui-build --watch"
|
|
18
20
|
},
|
|
19
21
|
"dependencies": {
|
|
20
|
-
"@tamagui/core": "^1.0.1-beta.
|
|
21
|
-
"@tamagui/font-size": "^1.0.1-beta.
|
|
22
|
-
"@tamagui/helpers-tamagui": "^1.0.1-beta.
|
|
22
|
+
"@tamagui/core": "^1.0.1-beta.71",
|
|
23
|
+
"@tamagui/font-size": "^1.0.1-beta.71",
|
|
24
|
+
"@tamagui/helpers-tamagui": "^1.0.1-beta.71"
|
|
23
25
|
},
|
|
24
26
|
"peerDependencies": {
|
|
25
27
|
"react": "*",
|
|
26
28
|
"react-dom": "*"
|
|
27
29
|
},
|
|
28
30
|
"devDependencies": {
|
|
29
|
-
"@tamagui/build": "^1.0.1-beta.
|
|
31
|
+
"@tamagui/build": "^1.0.1-beta.71",
|
|
30
32
|
"react": "*",
|
|
31
33
|
"react-dom": "*"
|
|
32
34
|
},
|
package/src/Button.tsx
CHANGED
|
@@ -44,11 +44,12 @@ export type ButtonProps = Omit<TextParentStyles, 'TextComponent'> &
|
|
|
44
44
|
scaleSpace?: number
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
-
const ButtonFrame = styled(ThemeableStack, {
|
|
47
|
+
export const ButtonFrame = styled(ThemeableStack, {
|
|
48
48
|
name: 'Button',
|
|
49
49
|
tag: 'button',
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
focusable: true,
|
|
51
|
+
hoverTheme: true,
|
|
52
|
+
pressTheme: true,
|
|
52
53
|
backgrounded: true,
|
|
53
54
|
borderWidth: 1,
|
|
54
55
|
borderColor: 'transparent',
|
|
@@ -107,6 +108,7 @@ const ButtonFrame = styled(ThemeableStack, {
|
|
|
107
108
|
export const ButtonText = styled(SizableText, {
|
|
108
109
|
color: '$color',
|
|
109
110
|
selectable: false,
|
|
111
|
+
cursor: 'inherit',
|
|
110
112
|
// flexGrow 1 leads to inconsistent native style where text pushes to start of view
|
|
111
113
|
flexGrow: 0,
|
|
112
114
|
flexShrink: 1,
|
package/types/Button.d.ts
CHANGED
|
@@ -15,16 +15,16 @@ export declare type ButtonProps = Omit<TextParentStyles, 'TextComponent'> & GetP
|
|
|
15
15
|
spaceFlex?: number | boolean;
|
|
16
16
|
scaleSpace?: number;
|
|
17
17
|
};
|
|
18
|
-
declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
|
|
18
|
+
export declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
|
|
19
19
|
readonly fullscreen?: boolean | undefined;
|
|
20
20
|
readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
|
|
21
21
|
} & {
|
|
22
22
|
fontFamily?: unknown;
|
|
23
23
|
backgrounded?: boolean | undefined;
|
|
24
24
|
radiused?: boolean | undefined;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
25
|
+
hoverTheme?: boolean | undefined;
|
|
26
|
+
pressTheme?: boolean | undefined;
|
|
27
|
+
focusTheme?: boolean | undefined;
|
|
28
28
|
circular?: boolean | undefined;
|
|
29
29
|
padded?: boolean | undefined;
|
|
30
30
|
elevate?: boolean | undefined;
|
|
@@ -42,9 +42,9 @@ declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<import(
|
|
|
42
42
|
fontFamily?: unknown;
|
|
43
43
|
backgrounded?: boolean | undefined;
|
|
44
44
|
radiused?: boolean | undefined;
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
45
|
+
hoverTheme?: boolean | undefined;
|
|
46
|
+
pressTheme?: boolean | undefined;
|
|
47
|
+
focusTheme?: boolean | undefined;
|
|
48
48
|
circular?: boolean | undefined;
|
|
49
49
|
padded?: boolean | undefined;
|
|
50
50
|
elevate?: boolean | undefined;
|
|
@@ -62,9 +62,9 @@ declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<import(
|
|
|
62
62
|
fontFamily?: unknown;
|
|
63
63
|
backgrounded?: boolean | undefined;
|
|
64
64
|
radiused?: boolean | undefined;
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
65
|
+
hoverTheme?: boolean | undefined;
|
|
66
|
+
pressTheme?: boolean | undefined;
|
|
67
|
+
focusTheme?: boolean | undefined;
|
|
68
68
|
circular?: boolean | undefined;
|
|
69
69
|
padded?: boolean | undefined;
|
|
70
70
|
elevate?: boolean | undefined;
|
|
@@ -82,9 +82,9 @@ declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<import(
|
|
|
82
82
|
fontFamily?: unknown;
|
|
83
83
|
backgrounded?: boolean | undefined;
|
|
84
84
|
radiused?: boolean | undefined;
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
85
|
+
hoverTheme?: boolean | undefined;
|
|
86
|
+
pressTheme?: boolean | undefined;
|
|
87
|
+
focusTheme?: boolean | undefined;
|
|
88
88
|
circular?: boolean | undefined;
|
|
89
89
|
padded?: boolean | undefined;
|
|
90
90
|
elevate?: boolean | undefined;
|
package/types/Button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,QAAQ,EACR,qBAAqB,EACrB,cAAc,EAMf,MAAM,eAAe,CAAA;AAEtB,OAAO,EACL,gBAAgB,EAGjB,MAAM,0BAA0B,CAAA;AAGjC,OAAc,EAAE,iBAAiB,EAA0B,MAAM,OAAO,CAAA;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAKnC,aAAK,eAAe,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AACxD,aAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,GAAG,iBAAiB,CAAC,eAAe,CAAC,GAAG,IAAI,CAAA;AAEvE,oBAAY,WAAW,GAAG,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,GAC/D,QAAQ,CAAC,OAAO,WAAW,CAAC,GAC5B,cAAc,GAAG;IAEf,IAAI,CAAC,EAAE,QAAQ,CAAA;IAEf,SAAS,CAAC,EAAE,QAAQ,CAAA;IAGpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAE5B,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAEH,
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,QAAQ,EACR,qBAAqB,EACrB,cAAc,EAMf,MAAM,eAAe,CAAA;AAEtB,OAAO,EACL,gBAAgB,EAGjB,MAAM,0BAA0B,CAAA;AAGjC,OAAc,EAAE,iBAAiB,EAA0B,MAAM,OAAO,CAAA;AACxE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAKnC,aAAK,eAAe,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AACxD,aAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,GAAG,iBAAiB,CAAC,eAAe,CAAC,GAAG,IAAI,CAAA;AAEvE,oBAAY,WAAW,GAAG,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,GAC/D,QAAQ,CAAC,OAAO,WAAW,CAAC,GAC5B,cAAc,GAAG;IAEf,IAAI,CAAC,EAAE,QAAQ,CAAA;IAEf,SAAS,CAAC,EAAE,QAAQ,CAAA;IAGpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAE5B,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuDtB,CAAA;AAMF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;GAQrB,CAAA;AA6DF,eAAO,MAAM,MAAM,EAAE,qBAAqB,CAAC,WAAW,EAAE,iBAAiB,GAAG,IAAI,CAW5E,CAAA"}
|
package/types/index.d.ts
CHANGED
|
File without changes
|
package/types/index.d.ts.map
CHANGED
|
File without changes
|