@tamagui/button 1.0.1-beta.149 → 1.0.1-beta.152
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 +12 -6
- package/dist/cjs/Button.js.map +2 -2
- package/dist/esm/Button.js +8 -5
- package/dist/esm/Button.js.map +2 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/jsx/Button.js.map +2 -2
- package/dist/jsx/index.js.map +1 -1
- package/package.json +5 -5
package/dist/cjs/Button.js
CHANGED
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var Button_exports = {};
|
|
23
26
|
__export(Button_exports, {
|
|
@@ -26,6 +29,7 @@ __export(Button_exports, {
|
|
|
26
29
|
ButtonText: () => ButtonText
|
|
27
30
|
});
|
|
28
31
|
module.exports = __toCommonJS(Button_exports);
|
|
32
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
33
|
var import_core = require("@tamagui/core");
|
|
30
34
|
var import_font_size = require("@tamagui/font-size");
|
|
31
35
|
var import_helpers_tamagui = require("@tamagui/helpers-tamagui");
|
|
@@ -121,7 +125,7 @@ const ButtonComponent = (0, import_react.forwardRef)(function Button(props, ref)
|
|
|
121
125
|
direction: props.flexDirection === "column" || props.flexDirection === "column-reverse" ? "vertical" : "horizontal",
|
|
122
126
|
children: [themedIcon, contents, themedIconAfter]
|
|
123
127
|
}) : contents;
|
|
124
|
-
return /* @__PURE__ */
|
|
128
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonFrame, {
|
|
125
129
|
...props.disabled && {
|
|
126
130
|
focusable: void 0,
|
|
127
131
|
focusStyle: {
|
|
@@ -132,10 +136,12 @@ const ButtonComponent = (0, import_react.forwardRef)(function Button(props, ref)
|
|
|
132
136
|
tag: "span"
|
|
133
137
|
},
|
|
134
138
|
ref,
|
|
135
|
-
...rest
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
+
...rest,
|
|
140
|
+
children: import_core.isRSC ? inner : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.ButtonInsideButtonContext.Provider, {
|
|
141
|
+
value: true,
|
|
142
|
+
children: inner
|
|
143
|
+
})
|
|
144
|
+
});
|
|
139
145
|
});
|
|
140
146
|
const Button2 = ButtonFrame.extractable((0, import_core.themeable)(ButtonComponent), {
|
|
141
147
|
inlineProps: /* @__PURE__ */ new Set([
|
package/dist/cjs/Button.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
4
|
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n TamaguiComponent,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } 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.375,\n pointerEvents: 'none',\n },\n },\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(function Button(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 = isRSC ? false : useContext(ButtonInsideButtonContext)\n const size = props.size || '$4'\n const iconSize = (typeof size === 'number' ? size * 0.5 : 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 = wrapChildrenInText(ButtonText, props)\n\n const inner =\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:\n props.flexDirection === 'column' || props.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, contents, themedIconAfter],\n })\n : contents\n\n return (\n <ButtonFrame\n {...(props.disabled && {\n // in rnw - false still has keyboard tabIndex, undefined = not actually focusable\n focusable: undefined,\n // even with tabIndex unset, it will keep focusStyle on web so disable it here\n focusStyle: {\n borderColor: '$background',\n },\n })}\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 {isRSC ? (\n inner\n ) : (\n <ButtonInsideButtonContext.Provider value={true}>\n {inner}\n </ButtonInsideButtonContext.Provider>\n )}\n </ButtonFrame>\n )\n})\n\nexport const Button: TamaguiComponent<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": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Button", "React"]
|
|
7
7
|
}
|
package/dist/esm/Button.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
1
2
|
import {
|
|
2
3
|
ButtonInsideButtonContext,
|
|
3
4
|
getButtonSize,
|
|
@@ -101,7 +102,7 @@ const ButtonComponent = forwardRef(function Button(props, ref) {
|
|
|
101
102
|
direction: props.flexDirection === "column" || props.flexDirection === "column-reverse" ? "vertical" : "horizontal",
|
|
102
103
|
children: [themedIcon, contents, themedIconAfter]
|
|
103
104
|
}) : contents;
|
|
104
|
-
return /* @__PURE__ */
|
|
105
|
+
return /* @__PURE__ */ jsx(ButtonFrame, {
|
|
105
106
|
...props.disabled && {
|
|
106
107
|
focusable: void 0,
|
|
107
108
|
focusStyle: {
|
|
@@ -112,10 +113,12 @@ const ButtonComponent = forwardRef(function Button(props, ref) {
|
|
|
112
113
|
tag: "span"
|
|
113
114
|
},
|
|
114
115
|
ref,
|
|
115
|
-
...rest
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
116
|
+
...rest,
|
|
117
|
+
children: isRSC ? inner : /* @__PURE__ */ jsx(ButtonInsideButtonContext.Provider, {
|
|
118
|
+
value: true,
|
|
119
|
+
children: inner
|
|
120
|
+
})
|
|
121
|
+
});
|
|
119
122
|
});
|
|
120
123
|
const Button2 = ButtonFrame.extractable(themeable(ButtonComponent), {
|
|
121
124
|
inlineProps: /* @__PURE__ */ new Set([
|
package/dist/esm/Button.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
4
|
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n TamaguiComponent,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } 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.375,\n pointerEvents: 'none',\n },\n },\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(function Button(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 = isRSC ? false : useContext(ButtonInsideButtonContext)\n const size = props.size || '$4'\n const iconSize = (typeof size === 'number' ? size * 0.5 : 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 = wrapChildrenInText(ButtonText, props)\n\n const inner =\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:\n props.flexDirection === 'column' || props.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, contents, themedIconAfter],\n })\n : contents\n\n return (\n <ButtonFrame\n {...(props.disabled && {\n // in rnw - false still has keyboard tabIndex, undefined = not actually focusable\n focusable: undefined,\n // even with tabIndex unset, it will keep focusStyle on web so disable it here\n focusStyle: {\n borderColor: '$background',\n },\n })}\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 {isRSC ? (\n inner\n ) : (\n <ButtonInsideButtonContext.Provider value={true}>\n {inner}\n </ButtonInsideButtonContext.Provider>\n )}\n </ButtonFrame>\n )\n})\n\nexport const Button: TamaguiComponent<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": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Button"]
|
|
7
7
|
}
|
package/dist/esm/index.js.map
CHANGED
package/dist/jsx/Button.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
4
|
"sourcesContent": ["import {\n ButtonInsideButtonContext,\n GetProps,\n TamaguiComponent,\n ThemeableProps,\n getButtonSize,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n} from '@tamagui/core'\nimport { getFontSize } from '@tamagui/font-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } 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.375,\n pointerEvents: 'none',\n },\n },\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(function Button(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 = isRSC ? false : useContext(ButtonInsideButtonContext)\n const size = props.size || '$4'\n const iconSize = (typeof size === 'number' ? size * 0.5 : 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 = wrapChildrenInText(ButtonText, props)\n\n const inner =\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:\n props.flexDirection === 'column' || props.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, contents, themedIconAfter],\n })\n : contents\n\n return (\n <ButtonFrame\n {...(props.disabled && {\n // in rnw - false still has keyboard tabIndex, undefined = not actually focusable\n focusable: undefined,\n // even with tabIndex unset, it will keep focusStyle on web so disable it here\n focusStyle: {\n borderColor: '$background',\n },\n })}\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 {isRSC ? (\n inner\n ) : (\n <ButtonInsideButtonContext.Provider value={true}>\n {inner}\n </ButtonInsideButtonContext.Provider>\n )}\n </ButtonFrame>\n )\n})\n\nexport const Button: TamaguiComponent<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;AAAA;
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA;AAAA,EACE;AAAA,EAIA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAC/B,SAAS,aAA+B,0BAA0B;AAClE,OAAO,SAA4B,YAAY,kBAAkB;AAIjE,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,EACF;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,SAAS,OAAO,OAAoB,KAAK;AAE1E,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,EACL,IAAI;AAEJ,QAAM,iBAAiB,QAAQ,QAAQ,WAAW,yBAAyB;AAC3E,QAAM,OAAO,MAAM,QAAQ;AAC3B,QAAM,YAAY,OAAO,SAAS,WAAW,OAAO,MAAM,YAAY,IAAI,KAAK;AAC/E,QAAM,gBAAgB,iBAAiB,EAAE,MAAM,UAAU,MAAM,CAAC;AAChE,QAAM,CAAC,YAAY,eAAe,IAAI,CAAC,MAAM,SAAS,EAAE,IAAI,aAAa;AACzE,QAAM,YAAY,iBAAiB,QAAQ,IAAI;AAC/C,QAAM,WAAW,mBAAmB,YAAY,KAAK;AAErD,QAAM,QACJ,cAAc,kBACV,eAAe;AAAA,IAEb,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,WACE,MAAM,kBAAkB,YAAY,MAAM,kBAAkB,mBACxD,aACA;AAAA,IACN,UAAU,CAAC,YAAY,UAAU,eAAe;AAAA,EAClD,CAAC,IACD;AAEN,SACE,CAAC,gBACM,MAAM,YAAY;AAAA,IAErB,WAAW;AAAA,IAEX,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF,OAEK,kBAAkB;AAAA,IACrB,KAAK;AAAA,EACP,GACA,KAAK,SACD,OAEH,QACC,QAEA,CAAC,0BAA0B,SAAS,OAAO,OACxC,MACH,EAFC,0BAA0B,UAI/B,EAvBC;AAyBL,CAAC;AAEM,MAAMA,UACX,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
|
+
"names": ["Button"]
|
|
7
7
|
}
|
package/dist/jsx/index.js.map
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/button",
|
|
3
|
-
"version": "1.0.1-beta.
|
|
3
|
+
"version": "1.0.1-beta.152",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -28,16 +28,16 @@
|
|
|
28
28
|
}
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@tamagui/core": "^1.0.1-beta.
|
|
32
|
-
"@tamagui/font-size": "^1.0.1-beta.
|
|
33
|
-
"@tamagui/helpers-tamagui": "^1.0.1-beta.
|
|
31
|
+
"@tamagui/core": "^1.0.1-beta.152",
|
|
32
|
+
"@tamagui/font-size": "^1.0.1-beta.152",
|
|
33
|
+
"@tamagui/helpers-tamagui": "^1.0.1-beta.152"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
36
36
|
"react": "*",
|
|
37
37
|
"react-dom": "*"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@tamagui/build": "^1.0.1-beta.
|
|
40
|
+
"@tamagui/build": "^1.0.1-beta.152",
|
|
41
41
|
"react": "*",
|
|
42
42
|
"react-dom": "*"
|
|
43
43
|
},
|