@tamagui/button 1.5.23 → 1.6.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.
- package/dist/cjs/Button.js +9 -9
- package/dist/cjs/Button.js.map +2 -2
- package/dist/esm/Button.js +6 -6
- package/dist/esm/Button.js.map +2 -2
- package/dist/esm/Button.mjs +6 -6
- package/dist/esm/Button.mjs.map +2 -2
- package/dist/jsx/Button.js +6 -6
- package/dist/jsx/Button.js.map +2 -2
- package/dist/jsx/Button.mjs +6 -6
- package/dist/jsx/Button.mjs.map +2 -2
- package/package.json +7 -7
- package/src/Button.tsx +6 -6
- package/types/Button.d.ts +115 -115
- package/types/Button.d.ts.map +1 -1
package/dist/cjs/Button.js
CHANGED
|
@@ -26,15 +26,15 @@ __export(Button_exports, {
|
|
|
26
26
|
});
|
|
27
27
|
module.exports = __toCommonJS(Button_exports);
|
|
28
28
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
|
-
var import_core = require("@tamagui/core");
|
|
30
29
|
var import_font_size = require("@tamagui/font-size");
|
|
31
30
|
var import_get_button_sized = require("@tamagui/get-button-sized");
|
|
32
31
|
var import_helpers_tamagui = require("@tamagui/helpers-tamagui");
|
|
33
32
|
var import_stacks = require("@tamagui/stacks");
|
|
34
33
|
var import_text = require("@tamagui/text");
|
|
34
|
+
var import_web = require("@tamagui/web");
|
|
35
35
|
var import_react = require("react");
|
|
36
36
|
const NAME = "Button";
|
|
37
|
-
const ButtonFrame = (0,
|
|
37
|
+
const ButtonFrame = (0, import_web.styled)(import_stacks.ThemeableStack, {
|
|
38
38
|
name: NAME,
|
|
39
39
|
tag: "button",
|
|
40
40
|
justifyContent: "center",
|
|
@@ -82,7 +82,7 @@ const ButtonFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
|
82
82
|
size: "$true"
|
|
83
83
|
}
|
|
84
84
|
});
|
|
85
|
-
const ButtonText = (0,
|
|
85
|
+
const ButtonText = (0, import_web.styled)(import_text.SizableText, {
|
|
86
86
|
name: "ButtonText",
|
|
87
87
|
userSelect: "none",
|
|
88
88
|
cursor: "pointer",
|
|
@@ -118,7 +118,7 @@ const buttonStaticConfig = {
|
|
|
118
118
|
])
|
|
119
119
|
};
|
|
120
120
|
const Button2 = ButtonFrame.extractable(
|
|
121
|
-
(0,
|
|
121
|
+
(0, import_web.themeable)(ButtonComponent, ButtonFrame.staticConfig),
|
|
122
122
|
buttonStaticConfig
|
|
123
123
|
);
|
|
124
124
|
function useButton(propsIn, { Text = ButtonText } = { Text: ButtonText }) {
|
|
@@ -143,13 +143,13 @@ function useButton(propsIn, { Text = ButtonText } = { Text: ButtonText }) {
|
|
|
143
143
|
textProps,
|
|
144
144
|
...rest
|
|
145
145
|
} = propsIn;
|
|
146
|
-
const isNested =
|
|
147
|
-
const propsActive = (0,
|
|
146
|
+
const isNested = import_web.isRSC ? false : (0, import_react.useContext)(import_web.ButtonNestingContext);
|
|
147
|
+
const propsActive = (0, import_web.useMediaPropsActive)(propsIn);
|
|
148
148
|
const size = propsActive.size || "$true";
|
|
149
149
|
const iconSize = (typeof size === "number" ? size * 0.5 : (0, import_font_size.getFontSize)(size)) * scaleIcon;
|
|
150
150
|
const getThemedIcon = (0, import_helpers_tamagui.useGetThemedIcon)({ size: iconSize, color });
|
|
151
151
|
const [themedIcon, themedIconAfter] = [icon, iconAfter].map(getThemedIcon);
|
|
152
|
-
const spaceSize = propsActive.space ?? (0,
|
|
152
|
+
const spaceSize = propsActive.space ?? (0, import_web.getVariableValue)(iconSize) * scaleSpace;
|
|
153
153
|
const contents = (0, import_text.wrapChildrenInText)(
|
|
154
154
|
Text,
|
|
155
155
|
propsActive,
|
|
@@ -157,7 +157,7 @@ function useButton(propsIn, { Text = ButtonText } = { Text: ButtonText }) {
|
|
|
157
157
|
defaultStyle: !propsIn.unstyled
|
|
158
158
|
} : void 0
|
|
159
159
|
);
|
|
160
|
-
const inner = (0,
|
|
160
|
+
const inner = (0, import_web.spacedChildren)({
|
|
161
161
|
// a bit arbitrary but scaling to font size is necessary so long as button does
|
|
162
162
|
space: spaceSize,
|
|
163
163
|
spaceFlex,
|
|
@@ -181,7 +181,7 @@ function useButton(propsIn, { Text = ButtonText } = { Text: ButtonText }) {
|
|
|
181
181
|
},
|
|
182
182
|
tag,
|
|
183
183
|
...rest,
|
|
184
|
-
children:
|
|
184
|
+
children: import_web.isRSC ? inner : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_web.ButtonNestingContext.Provider, { value: true, children: inner })
|
|
185
185
|
};
|
|
186
186
|
return {
|
|
187
187
|
spaceSize,
|
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 {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,gBAAAA;AAAA,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyIS;AAzIT,
|
|
4
|
+
"sourcesContent": ["import { getFontSize } from '@tamagui/font-size'\nimport { getButtonSized } from '@tamagui/get-button-sized'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'\nimport {\n ButtonNestingContext,\n GetProps,\n TamaguiElement,\n ThemeableProps,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n useMediaPropsActive,\n} from '@tamagui/web'\nimport { FunctionComponent, forwardRef, useContext } from 'react'\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 /**\n * add icon before, passes color and size automatically if Component\n */\n icon?: IconProp\n /**\n * add icon after, passes color and size automatically if Component\n */\n iconAfter?: IconProp\n /**\n * adjust icon relative to size\n *\n * @default 1\n */\n scaleIcon?: number\n /**\n * make the spacing elements flex\n */\n spaceFlex?: number | boolean\n /**\n * adjust internal space relative to icon size\n */\n scaleSpace?: number\n /**\n *\n */\n unstyled?: boolean\n }\n\nconst NAME = 'Button'\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: NAME,\n tag: 'button',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n cursor: 'pointer',\n\n variants: {\n defaultStyle: {\n true: {\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': getButtonSized,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n pointerEvents: 'none',\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const ButtonText = styled(SizableText, {\n name: 'ButtonText',\n userSelect: 'none',\n cursor: 'pointer',\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 variants: {\n defaultStyle: {\n true: {\n color: '$color',\n },\n },\n },\n})\n\nconst ButtonComponent = forwardRef<TamaguiElement, ButtonProps>(function Button(\n props,\n ref\n) {\n const {\n props: { unstyled, ...buttonProps },\n } = useButton(props)\n return <ButtonFrame defaultStyle={!unstyled} {...buttonProps} ref={ref} />\n})\n\nexport const buttonStaticConfig = {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n // may be able to remove this entirely, as the compiler / runtime have gotten better\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n 'unstyled',\n ]),\n}\n\nexport const Button = ButtonFrame.extractable(\n themeable(ButtonComponent, ButtonFrame.staticConfig),\n buttonStaticConfig\n)\n\nexport function useButton(\n propsIn: ButtonProps,\n { Text = ButtonText }: { Text: any } = { Text: ButtonText }\n) {\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 } = propsIn\n\n const isNested = isRSC ? false : useContext(ButtonNestingContext)\n const propsActive = useMediaPropsActive(propsIn)\n const size = propsActive.size || '$true'\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 = propsActive.space ?? getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(\n Text,\n propsActive,\n Text === ButtonText\n ? {\n defaultStyle: !propsIn.unstyled,\n }\n : undefined\n )\n const inner = 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 propsActive.flexDirection === 'column' ||\n propsActive.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, ...contents, themedIconAfter],\n })\n\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n const tag = isNested\n ? 'span'\n : // defaults to <a /> when accessibilityRole = link\n // see https://github.com/tamagui/tamagui/issues/505\n propsIn.accessibilityRole === 'link'\n ? 'a'\n : undefined\n\n const props = {\n ...(propsActive.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 tag,\n ...rest,\n children: isRSC ? (\n inner\n ) : (\n <ButtonNestingContext.Provider value={true}>{inner}</ButtonNestingContext.Provider>\n ),\n }\n\n return {\n spaceSize,\n isNested,\n props,\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Button"]
|
|
7
7
|
}
|
package/dist/esm/Button.js
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { getFontSize } from "@tamagui/font-size";
|
|
3
|
+
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
4
|
+
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
5
|
+
import { ThemeableStack } from "@tamagui/stacks";
|
|
6
|
+
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
2
7
|
import {
|
|
3
8
|
ButtonNestingContext,
|
|
4
9
|
getVariableValue,
|
|
@@ -7,12 +12,7 @@ import {
|
|
|
7
12
|
styled,
|
|
8
13
|
themeable,
|
|
9
14
|
useMediaPropsActive
|
|
10
|
-
} from "@tamagui/
|
|
11
|
-
import { getFontSize } from "@tamagui/font-size";
|
|
12
|
-
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
13
|
-
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
14
|
-
import { ThemeableStack } from "@tamagui/stacks";
|
|
15
|
-
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
15
|
+
} from "@tamagui/web";
|
|
16
16
|
import { forwardRef, useContext } from "react";
|
|
17
17
|
const NAME = "Button";
|
|
18
18
|
const ButtonFrame = styled(ThemeableStack, {
|
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 {
|
|
5
|
-
"mappings": "AAyIS;AAzIT
|
|
4
|
+
"sourcesContent": ["import { getFontSize } from '@tamagui/font-size'\nimport { getButtonSized } from '@tamagui/get-button-sized'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'\nimport {\n ButtonNestingContext,\n GetProps,\n TamaguiElement,\n ThemeableProps,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n useMediaPropsActive,\n} from '@tamagui/web'\nimport { FunctionComponent, forwardRef, useContext } from 'react'\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 /**\n * add icon before, passes color and size automatically if Component\n */\n icon?: IconProp\n /**\n * add icon after, passes color and size automatically if Component\n */\n iconAfter?: IconProp\n /**\n * adjust icon relative to size\n *\n * @default 1\n */\n scaleIcon?: number\n /**\n * make the spacing elements flex\n */\n spaceFlex?: number | boolean\n /**\n * adjust internal space relative to icon size\n */\n scaleSpace?: number\n /**\n *\n */\n unstyled?: boolean\n }\n\nconst NAME = 'Button'\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: NAME,\n tag: 'button',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n cursor: 'pointer',\n\n variants: {\n defaultStyle: {\n true: {\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': getButtonSized,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n pointerEvents: 'none',\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const ButtonText = styled(SizableText, {\n name: 'ButtonText',\n userSelect: 'none',\n cursor: 'pointer',\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 variants: {\n defaultStyle: {\n true: {\n color: '$color',\n },\n },\n },\n})\n\nconst ButtonComponent = forwardRef<TamaguiElement, ButtonProps>(function Button(\n props,\n ref\n) {\n const {\n props: { unstyled, ...buttonProps },\n } = useButton(props)\n return <ButtonFrame defaultStyle={!unstyled} {...buttonProps} ref={ref} />\n})\n\nexport const buttonStaticConfig = {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n // may be able to remove this entirely, as the compiler / runtime have gotten better\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n 'unstyled',\n ]),\n}\n\nexport const Button = ButtonFrame.extractable(\n themeable(ButtonComponent, ButtonFrame.staticConfig),\n buttonStaticConfig\n)\n\nexport function useButton(\n propsIn: ButtonProps,\n { Text = ButtonText }: { Text: any } = { Text: ButtonText }\n) {\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 } = propsIn\n\n const isNested = isRSC ? false : useContext(ButtonNestingContext)\n const propsActive = useMediaPropsActive(propsIn)\n const size = propsActive.size || '$true'\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 = propsActive.space ?? getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(\n Text,\n propsActive,\n Text === ButtonText\n ? {\n defaultStyle: !propsIn.unstyled,\n }\n : undefined\n )\n const inner = 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 propsActive.flexDirection === 'column' ||\n propsActive.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, ...contents, themedIconAfter],\n })\n\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n const tag = isNested\n ? 'span'\n : // defaults to <a /> when accessibilityRole = link\n // see https://github.com/tamagui/tamagui/issues/505\n propsIn.accessibilityRole === 'link'\n ? 'a'\n : undefined\n\n const props = {\n ...(propsActive.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 tag,\n ...rest,\n children: isRSC ? (\n inner\n ) : (\n <ButtonNestingContext.Provider value={true}>{inner}</ButtonNestingContext.Provider>\n ),\n }\n\n return {\n spaceSize,\n isNested,\n props,\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Button"]
|
|
7
7
|
}
|
package/dist/esm/Button.mjs
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { getFontSize } from "@tamagui/font-size";
|
|
3
|
+
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
4
|
+
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
5
|
+
import { ThemeableStack } from "@tamagui/stacks";
|
|
6
|
+
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
2
7
|
import {
|
|
3
8
|
ButtonNestingContext,
|
|
4
9
|
getVariableValue,
|
|
@@ -7,12 +12,7 @@ import {
|
|
|
7
12
|
styled,
|
|
8
13
|
themeable,
|
|
9
14
|
useMediaPropsActive
|
|
10
|
-
} from "@tamagui/
|
|
11
|
-
import { getFontSize } from "@tamagui/font-size";
|
|
12
|
-
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
13
|
-
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
14
|
-
import { ThemeableStack } from "@tamagui/stacks";
|
|
15
|
-
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
15
|
+
} from "@tamagui/web";
|
|
16
16
|
import { forwardRef, useContext } from "react";
|
|
17
17
|
const NAME = "Button";
|
|
18
18
|
const ButtonFrame = styled(ThemeableStack, {
|
package/dist/esm/Button.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": "AAyIS;AAzIT
|
|
4
|
+
"sourcesContent": ["import { getFontSize } from '@tamagui/font-size'\nimport { getButtonSized } from '@tamagui/get-button-sized'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'\nimport {\n ButtonNestingContext,\n GetProps,\n TamaguiElement,\n ThemeableProps,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n useMediaPropsActive,\n} from '@tamagui/web'\nimport { FunctionComponent, forwardRef, useContext } from 'react'\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 /**\n * add icon before, passes color and size automatically if Component\n */\n icon?: IconProp\n /**\n * add icon after, passes color and size automatically if Component\n */\n iconAfter?: IconProp\n /**\n * adjust icon relative to size\n *\n * @default 1\n */\n scaleIcon?: number\n /**\n * make the spacing elements flex\n */\n spaceFlex?: number | boolean\n /**\n * adjust internal space relative to icon size\n */\n scaleSpace?: number\n /**\n *\n */\n unstyled?: boolean\n }\n\nconst NAME = 'Button'\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: NAME,\n tag: 'button',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n cursor: 'pointer',\n\n variants: {\n defaultStyle: {\n true: {\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': getButtonSized,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n pointerEvents: 'none',\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const ButtonText = styled(SizableText, {\n name: 'ButtonText',\n userSelect: 'none',\n cursor: 'pointer',\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 variants: {\n defaultStyle: {\n true: {\n color: '$color',\n },\n },\n },\n})\n\nconst ButtonComponent = forwardRef<TamaguiElement, ButtonProps>(function Button(\n props,\n ref\n) {\n const {\n props: { unstyled, ...buttonProps },\n } = useButton(props)\n return <ButtonFrame defaultStyle={!unstyled} {...buttonProps} ref={ref} />\n})\n\nexport const buttonStaticConfig = {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n // may be able to remove this entirely, as the compiler / runtime have gotten better\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n 'unstyled',\n ]),\n}\n\nexport const Button = ButtonFrame.extractable(\n themeable(ButtonComponent, ButtonFrame.staticConfig),\n buttonStaticConfig\n)\n\nexport function useButton(\n propsIn: ButtonProps,\n { Text = ButtonText }: { Text: any } = { Text: ButtonText }\n) {\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 } = propsIn\n\n const isNested = isRSC ? false : useContext(ButtonNestingContext)\n const propsActive = useMediaPropsActive(propsIn)\n const size = propsActive.size || '$true'\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 = propsActive.space ?? getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(\n Text,\n propsActive,\n Text === ButtonText\n ? {\n defaultStyle: !propsIn.unstyled,\n }\n : undefined\n )\n const inner = 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 propsActive.flexDirection === 'column' ||\n propsActive.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, ...contents, themedIconAfter],\n })\n\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n const tag = isNested\n ? 'span'\n : // defaults to <a /> when accessibilityRole = link\n // see https://github.com/tamagui/tamagui/issues/505\n propsIn.accessibilityRole === 'link'\n ? 'a'\n : undefined\n\n const props = {\n ...(propsActive.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 tag,\n ...rest,\n children: isRSC ? (\n inner\n ) : (\n <ButtonNestingContext.Provider value={true}>{inner}</ButtonNestingContext.Provider>\n ),\n }\n\n return {\n spaceSize,\n isNested,\n props,\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Button"]
|
|
7
7
|
}
|
package/dist/jsx/Button.js
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import { getFontSize } from "@tamagui/font-size";
|
|
2
|
+
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
3
|
+
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
4
|
+
import { ThemeableStack } from "@tamagui/stacks";
|
|
5
|
+
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
1
6
|
import {
|
|
2
7
|
ButtonNestingContext,
|
|
3
8
|
getVariableValue,
|
|
@@ -6,12 +11,7 @@ import {
|
|
|
6
11
|
styled,
|
|
7
12
|
themeable,
|
|
8
13
|
useMediaPropsActive
|
|
9
|
-
} from "@tamagui/
|
|
10
|
-
import { getFontSize } from "@tamagui/font-size";
|
|
11
|
-
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
12
|
-
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
13
|
-
import { ThemeableStack } from "@tamagui/stacks";
|
|
14
|
-
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
14
|
+
} from "@tamagui/web";
|
|
15
15
|
import { forwardRef, useContext } from "react";
|
|
16
16
|
const NAME = "Button";
|
|
17
17
|
const ButtonFrame = styled(ThemeableStack, {
|
package/dist/jsx/Button.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": "AAAA
|
|
4
|
+
"sourcesContent": ["import { getFontSize } from '@tamagui/font-size'\nimport { getButtonSized } from '@tamagui/get-button-sized'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'\nimport {\n ButtonNestingContext,\n GetProps,\n TamaguiElement,\n ThemeableProps,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n useMediaPropsActive,\n} from '@tamagui/web'\nimport { FunctionComponent, forwardRef, useContext } from 'react'\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 /**\n * add icon before, passes color and size automatically if Component\n */\n icon?: IconProp\n /**\n * add icon after, passes color and size automatically if Component\n */\n iconAfter?: IconProp\n /**\n * adjust icon relative to size\n *\n * @default 1\n */\n scaleIcon?: number\n /**\n * make the spacing elements flex\n */\n spaceFlex?: number | boolean\n /**\n * adjust internal space relative to icon size\n */\n scaleSpace?: number\n /**\n *\n */\n unstyled?: boolean\n }\n\nconst NAME = 'Button'\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: NAME,\n tag: 'button',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n cursor: 'pointer',\n\n variants: {\n defaultStyle: {\n true: {\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': getButtonSized,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n pointerEvents: 'none',\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const ButtonText = styled(SizableText, {\n name: 'ButtonText',\n userSelect: 'none',\n cursor: 'pointer',\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 variants: {\n defaultStyle: {\n true: {\n color: '$color',\n },\n },\n },\n})\n\nconst ButtonComponent = forwardRef<TamaguiElement, ButtonProps>(function Button(\n props,\n ref\n) {\n const {\n props: { unstyled, ...buttonProps },\n } = useButton(props)\n return <ButtonFrame defaultStyle={!unstyled} {...buttonProps} ref={ref} />\n})\n\nexport const buttonStaticConfig = {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n // may be able to remove this entirely, as the compiler / runtime have gotten better\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n 'unstyled',\n ]),\n}\n\nexport const Button = ButtonFrame.extractable(\n themeable(ButtonComponent, ButtonFrame.staticConfig),\n buttonStaticConfig\n)\n\nexport function useButton(\n propsIn: ButtonProps,\n { Text = ButtonText }: { Text: any } = { Text: ButtonText }\n) {\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 } = propsIn\n\n const isNested = isRSC ? false : useContext(ButtonNestingContext)\n const propsActive = useMediaPropsActive(propsIn)\n const size = propsActive.size || '$true'\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 = propsActive.space ?? getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(\n Text,\n propsActive,\n Text === ButtonText\n ? {\n defaultStyle: !propsIn.unstyled,\n }\n : undefined\n )\n const inner = 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 propsActive.flexDirection === 'column' ||\n propsActive.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, ...contents, themedIconAfter],\n })\n\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n const tag = isNested\n ? 'span'\n : // defaults to <a /> when accessibilityRole = link\n // see https://github.com/tamagui/tamagui/issues/505\n propsIn.accessibilityRole === 'link'\n ? 'a'\n : undefined\n\n const props = {\n ...(propsActive.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 tag,\n ...rest,\n children: isRSC ? (\n inner\n ) : (\n <ButtonNestingContext.Provider value={true}>{inner}</ButtonNestingContext.Provider>\n ),\n }\n\n return {\n spaceSize,\n isNested,\n props,\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Button"]
|
|
7
7
|
}
|
package/dist/jsx/Button.mjs
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import { getFontSize } from "@tamagui/font-size";
|
|
2
|
+
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
3
|
+
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
4
|
+
import { ThemeableStack } from "@tamagui/stacks";
|
|
5
|
+
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
1
6
|
import {
|
|
2
7
|
ButtonNestingContext,
|
|
3
8
|
getVariableValue,
|
|
@@ -6,12 +11,7 @@ import {
|
|
|
6
11
|
styled,
|
|
7
12
|
themeable,
|
|
8
13
|
useMediaPropsActive
|
|
9
|
-
} from "@tamagui/
|
|
10
|
-
import { getFontSize } from "@tamagui/font-size";
|
|
11
|
-
import { getButtonSized } from "@tamagui/get-button-sized";
|
|
12
|
-
import { useGetThemedIcon } from "@tamagui/helpers-tamagui";
|
|
13
|
-
import { ThemeableStack } from "@tamagui/stacks";
|
|
14
|
-
import { SizableText, wrapChildrenInText } from "@tamagui/text";
|
|
14
|
+
} from "@tamagui/web";
|
|
15
15
|
import { forwardRef, useContext } from "react";
|
|
16
16
|
const NAME = "Button";
|
|
17
17
|
const ButtonFrame = styled(ThemeableStack, {
|
package/dist/jsx/Button.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Button.tsx"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": "AAAA
|
|
4
|
+
"sourcesContent": ["import { getFontSize } from '@tamagui/font-size'\nimport { getButtonSized } from '@tamagui/get-button-sized'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'\nimport {\n ButtonNestingContext,\n GetProps,\n TamaguiElement,\n ThemeableProps,\n getVariableValue,\n isRSC,\n spacedChildren,\n styled,\n themeable,\n useMediaPropsActive,\n} from '@tamagui/web'\nimport { FunctionComponent, forwardRef, useContext } from 'react'\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 /**\n * add icon before, passes color and size automatically if Component\n */\n icon?: IconProp\n /**\n * add icon after, passes color and size automatically if Component\n */\n iconAfter?: IconProp\n /**\n * adjust icon relative to size\n *\n * @default 1\n */\n scaleIcon?: number\n /**\n * make the spacing elements flex\n */\n spaceFlex?: number | boolean\n /**\n * adjust internal space relative to icon size\n */\n scaleSpace?: number\n /**\n *\n */\n unstyled?: boolean\n }\n\nconst NAME = 'Button'\n\nexport const ButtonFrame = styled(ThemeableStack, {\n name: NAME,\n tag: 'button',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'nowrap',\n flexDirection: 'row',\n cursor: 'pointer',\n\n variants: {\n defaultStyle: {\n true: {\n focusable: true,\n hoverTheme: true,\n pressTheme: true,\n backgrounded: true,\n borderWidth: 1,\n borderColor: 'transparent',\n\n pressStyle: {\n borderColor: 'transparent',\n },\n\n hoverStyle: {\n borderColor: 'transparent',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': getButtonSized,\n },\n\n active: {\n true: {\n hoverStyle: {\n backgroundColor: '$background',\n },\n },\n },\n\n disabled: {\n true: {\n pointerEvents: 'none',\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const ButtonText = styled(SizableText, {\n name: 'ButtonText',\n userSelect: 'none',\n cursor: 'pointer',\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 variants: {\n defaultStyle: {\n true: {\n color: '$color',\n },\n },\n },\n})\n\nconst ButtonComponent = forwardRef<TamaguiElement, ButtonProps>(function Button(\n props,\n ref\n) {\n const {\n props: { unstyled, ...buttonProps },\n } = useButton(props)\n return <ButtonFrame defaultStyle={!unstyled} {...buttonProps} ref={ref} />\n})\n\nexport const buttonStaticConfig = {\n inlineProps: new Set([\n // text props go here (can't really optimize them, but we never fully extract button anyway)\n // may be able to remove this entirely, as the compiler / runtime have gotten better\n 'color',\n 'fontWeight',\n 'fontSize',\n 'fontFamily',\n 'letterSpacing',\n 'textAlign',\n 'unstyled',\n ]),\n}\n\nexport const Button = ButtonFrame.extractable(\n themeable(ButtonComponent, ButtonFrame.staticConfig),\n buttonStaticConfig\n)\n\nexport function useButton(\n propsIn: ButtonProps,\n { Text = ButtonText }: { Text: any } = { Text: ButtonText }\n) {\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 } = propsIn\n\n const isNested = isRSC ? false : useContext(ButtonNestingContext)\n const propsActive = useMediaPropsActive(propsIn)\n const size = propsActive.size || '$true'\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 = propsActive.space ?? getVariableValue(iconSize) * scaleSpace\n const contents = wrapChildrenInText(\n Text,\n propsActive,\n Text === ButtonText\n ? {\n defaultStyle: !propsIn.unstyled,\n }\n : undefined\n )\n const inner = 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 propsActive.flexDirection === 'column' ||\n propsActive.flexDirection === 'column-reverse'\n ? 'vertical'\n : 'horizontal',\n children: [themedIcon, ...contents, themedIconAfter],\n })\n\n // fixes SSR issue + DOM nesting issue of not allowing button in button\n const tag = isNested\n ? 'span'\n : // defaults to <a /> when accessibilityRole = link\n // see https://github.com/tamagui/tamagui/issues/505\n propsIn.accessibilityRole === 'link'\n ? 'a'\n : undefined\n\n const props = {\n ...(propsActive.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 tag,\n ...rest,\n children: isRSC ? (\n inner\n ) : (\n <ButtonNestingContext.Provider value={true}>{inner}</ButtonNestingContext.Provider>\n ),\n }\n\n return {\n spaceSize,\n isNested,\n props,\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Button"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/button",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -29,17 +29,17 @@
|
|
|
29
29
|
}
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@tamagui/
|
|
33
|
-
"@tamagui/
|
|
34
|
-
"@tamagui/
|
|
35
|
-
"@tamagui/
|
|
36
|
-
"@tamagui/
|
|
32
|
+
"@tamagui/font-size": "1.6.0",
|
|
33
|
+
"@tamagui/get-button-sized": "1.6.0",
|
|
34
|
+
"@tamagui/helpers-tamagui": "1.6.0",
|
|
35
|
+
"@tamagui/text": "1.6.0",
|
|
36
|
+
"@tamagui/web": "1.6.0"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
39
39
|
"react": "*"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
|
-
"@tamagui/build": "
|
|
42
|
+
"@tamagui/build": "1.6.0",
|
|
43
43
|
"react": "^18.2.0",
|
|
44
44
|
"vitest": "^0.26.3"
|
|
45
45
|
},
|
package/src/Button.tsx
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
import { getFontSize } from '@tamagui/font-size'
|
|
2
|
+
import { getButtonSized } from '@tamagui/get-button-sized'
|
|
3
|
+
import { useGetThemedIcon } from '@tamagui/helpers-tamagui'
|
|
4
|
+
import { ThemeableStack } from '@tamagui/stacks'
|
|
5
|
+
import { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'
|
|
1
6
|
import {
|
|
2
7
|
ButtonNestingContext,
|
|
3
8
|
GetProps,
|
|
@@ -9,12 +14,7 @@ import {
|
|
|
9
14
|
styled,
|
|
10
15
|
themeable,
|
|
11
16
|
useMediaPropsActive,
|
|
12
|
-
} from '@tamagui/
|
|
13
|
-
import { getFontSize } from '@tamagui/font-size'
|
|
14
|
-
import { getButtonSized } from '@tamagui/get-button-sized'
|
|
15
|
-
import { useGetThemedIcon } from '@tamagui/helpers-tamagui'
|
|
16
|
-
import { ThemeableStack } from '@tamagui/stacks'
|
|
17
|
-
import { SizableText, TextParentStyles, wrapChildrenInText } from '@tamagui/text'
|
|
17
|
+
} from '@tamagui/web'
|
|
18
18
|
import { FunctionComponent, forwardRef, useContext } from 'react'
|
|
19
19
|
|
|
20
20
|
type ButtonIconProps = { color?: string; size?: number }
|
package/types/Button.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { GetProps, TamaguiElement, ThemeableProps } from '@tamagui/core';
|
|
2
1
|
import { TextParentStyles } from '@tamagui/text';
|
|
2
|
+
import { GetProps, TamaguiElement, ThemeableProps } from '@tamagui/web';
|
|
3
3
|
import { FunctionComponent } from 'react';
|
|
4
4
|
type ButtonIconProps = {
|
|
5
5
|
color?: string;
|
|
@@ -34,9 +34,9 @@ export type ButtonProps = Omit<TextParentStyles, 'TextComponent'> & GetProps<typ
|
|
|
34
34
|
*/
|
|
35
35
|
unstyled?: boolean;
|
|
36
36
|
};
|
|
37
|
-
export declare const ButtonFrame: import("@tamagui/
|
|
37
|
+
export declare const ButtonFrame: import("@tamagui/web").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
38
38
|
readonly fullscreen?: boolean | undefined;
|
|
39
|
-
readonly elevation?: import("@tamagui/
|
|
39
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
40
40
|
} & {
|
|
41
41
|
readonly backgrounded?: boolean | undefined;
|
|
42
42
|
readonly radiused?: boolean | undefined;
|
|
@@ -51,12 +51,12 @@ export declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<
|
|
|
51
51
|
readonly chromeless?: boolean | "all" | undefined;
|
|
52
52
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
53
53
|
readonly defaultStyle?: boolean | undefined;
|
|
54
|
-
readonly size?: import("@tamagui/
|
|
54
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
55
55
|
readonly active?: boolean | undefined;
|
|
56
56
|
readonly disabled?: boolean | undefined;
|
|
57
|
-
} & import("@tamagui/
|
|
57
|
+
} & import("@tamagui/web").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
58
58
|
readonly fullscreen?: boolean | undefined;
|
|
59
|
-
readonly elevation?: import("@tamagui/
|
|
59
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
60
60
|
} & {
|
|
61
61
|
readonly backgrounded?: boolean | undefined;
|
|
62
62
|
readonly radiused?: boolean | undefined;
|
|
@@ -71,12 +71,12 @@ export declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<
|
|
|
71
71
|
readonly chromeless?: boolean | "all" | undefined;
|
|
72
72
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
73
73
|
readonly defaultStyle?: boolean | undefined;
|
|
74
|
-
readonly size?: import("@tamagui/
|
|
74
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
75
75
|
readonly active?: boolean | undefined;
|
|
76
76
|
readonly disabled?: boolean | undefined;
|
|
77
|
-
}>> & import("@tamagui/
|
|
77
|
+
}>> & import("@tamagui/web").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
78
78
|
readonly fullscreen?: boolean | undefined;
|
|
79
|
-
readonly elevation?: import("@tamagui/
|
|
79
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
80
80
|
} & {
|
|
81
81
|
readonly backgrounded?: boolean | undefined;
|
|
82
82
|
readonly radiused?: boolean | undefined;
|
|
@@ -91,12 +91,12 @@ export declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<
|
|
|
91
91
|
readonly chromeless?: boolean | "all" | undefined;
|
|
92
92
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
93
93
|
readonly defaultStyle?: boolean | undefined;
|
|
94
|
-
readonly size?: import("@tamagui/
|
|
94
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
95
95
|
readonly active?: boolean | undefined;
|
|
96
96
|
readonly disabled?: boolean | undefined;
|
|
97
|
-
}>>, TamaguiElement, Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
97
|
+
}>>, TamaguiElement, Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps, {
|
|
98
98
|
readonly fullscreen?: boolean | undefined;
|
|
99
|
-
readonly elevation?: import("@tamagui/
|
|
99
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
100
100
|
} & {
|
|
101
101
|
readonly backgrounded?: boolean | undefined;
|
|
102
102
|
readonly radiused?: boolean | undefined;
|
|
@@ -111,33 +111,33 @@ export declare const ButtonFrame: import("@tamagui/core").TamaguiComponent<Omit<
|
|
|
111
111
|
readonly chromeless?: boolean | "all" | undefined;
|
|
112
112
|
} & {
|
|
113
113
|
readonly defaultStyle?: boolean | undefined;
|
|
114
|
-
readonly size?: import("@tamagui/
|
|
114
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
115
115
|
readonly active?: boolean | undefined;
|
|
116
116
|
readonly disabled?: boolean | undefined;
|
|
117
117
|
}>;
|
|
118
|
-
export declare const ButtonText: import("@tamagui/
|
|
119
|
-
readonly size?: import("@tamagui/
|
|
118
|
+
export declare const ButtonText: import("@tamagui/web").TamaguiComponent<Omit<import("react-native").TextProps, "children" | ("onLayout" | keyof import("react-native").GestureResponderHandlers)> & import("@tamagui/web").ExtendsBaseTextProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").TextStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").TextStylePropsBase>> & Omit<{
|
|
119
|
+
readonly size?: import("@tamagui/web").FontSizeTokens | undefined;
|
|
120
120
|
}, "defaultStyle"> & {
|
|
121
121
|
defaultStyle?: boolean | undefined;
|
|
122
|
-
} & import("@tamagui/
|
|
123
|
-
readonly size?: import("@tamagui/
|
|
122
|
+
} & import("@tamagui/web").MediaProps<Partial<Omit<import("react-native").TextProps, "children" | ("onLayout" | keyof import("react-native").GestureResponderHandlers)> & import("@tamagui/web").ExtendsBaseTextProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").TextStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").TextStylePropsBase>> & Omit<{
|
|
123
|
+
readonly size?: import("@tamagui/web").FontSizeTokens | undefined;
|
|
124
124
|
}, "defaultStyle"> & {
|
|
125
125
|
defaultStyle?: boolean | undefined;
|
|
126
|
-
}>> & import("@tamagui/
|
|
127
|
-
readonly size?: import("@tamagui/
|
|
126
|
+
}>> & import("@tamagui/web").PseudoProps<Partial<Omit<import("react-native").TextProps, "children" | ("onLayout" | keyof import("react-native").GestureResponderHandlers)> & import("@tamagui/web").ExtendsBaseTextProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").TextStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").TextStylePropsBase>> & Omit<{
|
|
127
|
+
readonly size?: import("@tamagui/web").FontSizeTokens | undefined;
|
|
128
128
|
}, "defaultStyle"> & {
|
|
129
129
|
defaultStyle?: boolean | undefined;
|
|
130
|
-
}>>, TamaguiElement, import("@tamagui/
|
|
131
|
-
readonly size?: import("@tamagui/
|
|
130
|
+
}>>, TamaguiElement, import("@tamagui/web").TextPropsBase, {
|
|
131
|
+
readonly size?: import("@tamagui/web").FontSizeTokens | undefined;
|
|
132
132
|
} & {
|
|
133
133
|
defaultStyle?: boolean | undefined;
|
|
134
134
|
}>;
|
|
135
135
|
export declare const buttonStaticConfig: {
|
|
136
136
|
inlineProps: Set<string>;
|
|
137
137
|
};
|
|
138
|
-
export declare const Button: (props: Omit<Omit<TextParentStyles, "TextComponent"> & Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
138
|
+
export declare const Button: (props: Omit<Omit<TextParentStyles, "TextComponent"> & Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
139
139
|
readonly fullscreen?: boolean | undefined;
|
|
140
|
-
readonly elevation?: import("@tamagui/
|
|
140
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
141
141
|
} & {
|
|
142
142
|
readonly backgrounded?: boolean | undefined;
|
|
143
143
|
readonly radiused?: boolean | undefined;
|
|
@@ -152,12 +152,12 @@ export declare const Button: (props: Omit<Omit<TextParentStyles, "TextComponent"
|
|
|
152
152
|
readonly chromeless?: boolean | "all" | undefined;
|
|
153
153
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
154
154
|
readonly defaultStyle?: boolean | undefined;
|
|
155
|
-
readonly size?: import("@tamagui/
|
|
155
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
156
156
|
readonly active?: boolean | undefined;
|
|
157
157
|
readonly disabled?: boolean | undefined;
|
|
158
|
-
} & import("@tamagui/
|
|
158
|
+
} & import("@tamagui/web").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
159
159
|
readonly fullscreen?: boolean | undefined;
|
|
160
|
-
readonly elevation?: import("@tamagui/
|
|
160
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
161
161
|
} & {
|
|
162
162
|
readonly backgrounded?: boolean | undefined;
|
|
163
163
|
readonly radiused?: boolean | undefined;
|
|
@@ -172,12 +172,12 @@ export declare const Button: (props: Omit<Omit<TextParentStyles, "TextComponent"
|
|
|
172
172
|
readonly chromeless?: boolean | "all" | undefined;
|
|
173
173
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
174
174
|
readonly defaultStyle?: boolean | undefined;
|
|
175
|
-
readonly size?: import("@tamagui/
|
|
175
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
176
176
|
readonly active?: boolean | undefined;
|
|
177
177
|
readonly disabled?: boolean | undefined;
|
|
178
|
-
}>> & import("@tamagui/
|
|
178
|
+
}>> & import("@tamagui/web").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
179
179
|
readonly fullscreen?: boolean | undefined;
|
|
180
|
-
readonly elevation?: import("@tamagui/
|
|
180
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
181
181
|
} & {
|
|
182
182
|
readonly backgrounded?: boolean | undefined;
|
|
183
183
|
readonly radiused?: boolean | undefined;
|
|
@@ -192,7 +192,7 @@ export declare const Button: (props: Omit<Omit<TextParentStyles, "TextComponent"
|
|
|
192
192
|
readonly chromeless?: boolean | "all" | undefined;
|
|
193
193
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
194
194
|
readonly defaultStyle?: boolean | undefined;
|
|
195
|
-
readonly size?: import("@tamagui/
|
|
195
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
196
196
|
readonly active?: boolean | undefined;
|
|
197
197
|
readonly disabled?: boolean | undefined;
|
|
198
198
|
}>> & ThemeableProps & {
|
|
@@ -226,7 +226,7 @@ export declare const Button: (props: Omit<Omit<TextParentStyles, "TextComponent"
|
|
|
226
226
|
export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
227
227
|
Text: any;
|
|
228
228
|
}): {
|
|
229
|
-
spaceSize: import("@tamagui/
|
|
229
|
+
spaceSize: import("@tamagui/web").SpaceTokens;
|
|
230
230
|
isNested: boolean;
|
|
231
231
|
props: {
|
|
232
232
|
children: string | number | boolean | JSX.Element | import("react").ReactFragment | null | undefined;
|
|
@@ -288,13 +288,13 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
288
288
|
accessibilityIgnoresInvertColors?: boolean | undefined;
|
|
289
289
|
target?: string | undefined;
|
|
290
290
|
asChild?: boolean | undefined;
|
|
291
|
-
spaceDirection?: import("@tamagui/
|
|
291
|
+
spaceDirection?: import("@tamagui/web").SpaceDirection | undefined;
|
|
292
292
|
dangerouslySetInnerHTML?: {
|
|
293
293
|
__html: string;
|
|
294
294
|
} | undefined;
|
|
295
|
-
animation?: import("@tamagui/
|
|
295
|
+
animation?: import("@tamagui/web").AnimationProp | null | undefined;
|
|
296
296
|
animateOnly?: string[] | undefined;
|
|
297
|
-
debug?: import("@tamagui/
|
|
297
|
+
debug?: import("@tamagui/web").DebugProp | undefined;
|
|
298
298
|
disabled?: boolean | undefined;
|
|
299
299
|
className?: string | undefined;
|
|
300
300
|
themeShallow?: boolean | undefined;
|
|
@@ -315,37 +315,37 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
315
315
|
onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
|
|
316
316
|
onFocus?: ((event: import("react").FocusEvent<HTMLDivElement, Element>) => void) | undefined;
|
|
317
317
|
onScroll?: ((event: import("react").UIEvent<HTMLDivElement, UIEvent>) => void) | undefined;
|
|
318
|
-
backgroundColor?: import("@tamagui/
|
|
319
|
-
borderBottomColor?: import("@tamagui/
|
|
320
|
-
borderBottomEndRadius?: import("@tamagui/
|
|
321
|
-
borderBottomLeftRadius?: import("@tamagui/
|
|
322
|
-
borderBottomRightRadius?: import("@tamagui/
|
|
323
|
-
borderBottomStartRadius?: import("@tamagui/
|
|
324
|
-
borderBottomWidth?: import("@tamagui/
|
|
325
|
-
borderColor?: import("@tamagui/
|
|
318
|
+
backgroundColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
319
|
+
borderBottomColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
320
|
+
borderBottomEndRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
321
|
+
borderBottomLeftRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
322
|
+
borderBottomRightRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
323
|
+
borderBottomStartRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
324
|
+
borderBottomWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
325
|
+
borderColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
326
326
|
borderEndColor?: import("react-native").ColorValue | undefined;
|
|
327
|
-
borderLeftColor?: import("@tamagui/
|
|
328
|
-
borderLeftWidth?: import("@tamagui/
|
|
329
|
-
borderRadius?: import("@tamagui/
|
|
330
|
-
borderRightColor?: import("@tamagui/
|
|
331
|
-
borderRightWidth?: import("@tamagui/
|
|
327
|
+
borderLeftColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
328
|
+
borderLeftWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
329
|
+
borderRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
330
|
+
borderRightColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
331
|
+
borderRightWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
332
332
|
borderStartColor?: import("react-native").ColorValue | undefined;
|
|
333
333
|
borderStyle?: "solid" | "dotted" | "dashed" | undefined;
|
|
334
|
-
borderTopColor?: import("@tamagui/
|
|
335
|
-
borderTopEndRadius?: import("@tamagui/
|
|
336
|
-
borderTopLeftRadius?: import("@tamagui/
|
|
337
|
-
borderTopRightRadius?: import("@tamagui/
|
|
338
|
-
borderTopStartRadius?: import("@tamagui/
|
|
339
|
-
borderTopWidth?: import("@tamagui/
|
|
340
|
-
borderWidth?: import("@tamagui/
|
|
334
|
+
borderTopColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
335
|
+
borderTopEndRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
336
|
+
borderTopLeftRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
337
|
+
borderTopRightRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
338
|
+
borderTopStartRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").RadiusTokens | undefined;
|
|
339
|
+
borderTopWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
340
|
+
borderWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
341
341
|
opacity?: number | undefined;
|
|
342
342
|
alignContent?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "stretch" | undefined;
|
|
343
343
|
alignItems?: import("react-native").FlexAlignType | undefined;
|
|
344
344
|
alignSelf?: "auto" | import("react-native").FlexAlignType | undefined;
|
|
345
345
|
aspectRatio?: number | undefined;
|
|
346
|
-
borderEndWidth?: import("@tamagui/
|
|
347
|
-
borderStartWidth?: import("@tamagui/
|
|
348
|
-
bottom?: import("@tamagui/
|
|
346
|
+
borderEndWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
347
|
+
borderStartWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
348
|
+
bottom?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
349
349
|
end?: string | number | undefined;
|
|
350
350
|
flex?: number | undefined;
|
|
351
351
|
flexBasis?: string | number | undefined;
|
|
@@ -353,60 +353,60 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
353
353
|
flexGrow?: number | undefined;
|
|
354
354
|
flexShrink?: number | undefined;
|
|
355
355
|
flexWrap?: "nowrap" | "wrap" | "wrap-reverse" | undefined;
|
|
356
|
-
height?: import("@tamagui/
|
|
356
|
+
height?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
357
357
|
justifyContent?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
|
|
358
|
-
left?: import("@tamagui/
|
|
359
|
-
margin?: import("@tamagui/
|
|
360
|
-
marginBottom?: import("@tamagui/
|
|
361
|
-
marginEnd?: import("@tamagui/
|
|
362
|
-
marginHorizontal?: import("@tamagui/
|
|
363
|
-
marginLeft?: import("@tamagui/
|
|
364
|
-
marginRight?: import("@tamagui/
|
|
365
|
-
marginStart?: import("@tamagui/
|
|
366
|
-
marginTop?: import("@tamagui/
|
|
367
|
-
marginVertical?: import("@tamagui/
|
|
368
|
-
maxHeight?: import("@tamagui/
|
|
369
|
-
maxWidth?: import("@tamagui/
|
|
370
|
-
minHeight?: import("@tamagui/
|
|
371
|
-
minWidth?: import("@tamagui/
|
|
358
|
+
left?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
359
|
+
margin?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
360
|
+
marginBottom?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
361
|
+
marginEnd?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
362
|
+
marginHorizontal?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
363
|
+
marginLeft?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
364
|
+
marginRight?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
365
|
+
marginStart?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
366
|
+
marginTop?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
367
|
+
marginVertical?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
368
|
+
maxHeight?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
369
|
+
maxWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
370
|
+
minHeight?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
371
|
+
minWidth?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
372
372
|
overflow?: "visible" | "hidden" | "scroll" | undefined;
|
|
373
|
-
padding?: import("@tamagui/
|
|
374
|
-
paddingBottom?: import("@tamagui/
|
|
375
|
-
paddingEnd?: import("@tamagui/
|
|
376
|
-
paddingHorizontal?: import("@tamagui/
|
|
377
|
-
paddingLeft?: import("@tamagui/
|
|
378
|
-
paddingRight?: import("@tamagui/
|
|
379
|
-
paddingStart?: import("@tamagui/
|
|
380
|
-
paddingTop?: import("@tamagui/
|
|
381
|
-
paddingVertical?: import("@tamagui/
|
|
373
|
+
padding?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
374
|
+
paddingBottom?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
375
|
+
paddingEnd?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
376
|
+
paddingHorizontal?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
377
|
+
paddingLeft?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
378
|
+
paddingRight?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
379
|
+
paddingStart?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
380
|
+
paddingTop?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
381
|
+
paddingVertical?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
382
382
|
position?: "absolute" | "relative" | undefined;
|
|
383
|
-
right?: import("@tamagui/
|
|
383
|
+
right?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
384
384
|
start?: string | number | undefined;
|
|
385
|
-
top?: import("@tamagui/
|
|
386
|
-
width?: import("@tamagui/
|
|
387
|
-
zIndex?: import("@tamagui/
|
|
385
|
+
top?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
386
|
+
width?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
387
|
+
zIndex?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").ZIndexTokens | undefined;
|
|
388
388
|
direction?: "inherit" | "ltr" | "rtl" | undefined;
|
|
389
|
-
shadowColor?: import("@tamagui/
|
|
390
|
-
shadowOffset?: import("@tamagui/
|
|
391
|
-
width: import("@tamagui/
|
|
392
|
-
height: import("@tamagui/
|
|
389
|
+
shadowColor?: import("@tamagui/web").ColorTokens | import("@tamagui/web").ThemeValueFallback | import("react-native").OpaqueColorValue | undefined;
|
|
390
|
+
shadowOffset?: import("@tamagui/web").ThemeValueFallback | {
|
|
391
|
+
width: import("@tamagui/web").SpaceTokens;
|
|
392
|
+
height: import("@tamagui/web").SpaceTokens;
|
|
393
393
|
} | {
|
|
394
394
|
width: number;
|
|
395
395
|
height: number;
|
|
396
396
|
} | undefined;
|
|
397
397
|
shadowOpacity?: number | undefined;
|
|
398
|
-
shadowRadius?: import("@tamagui/
|
|
398
|
+
shadowRadius?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SizeTokens | undefined;
|
|
399
399
|
transform?: (import("react-native").PerpectiveTransform | import("react-native").RotateTransform | import("react-native").RotateXTransform | import("react-native").RotateYTransform | import("react-native").RotateZTransform | import("react-native").ScaleTransform | import("react-native").ScaleXTransform | import("react-native").ScaleYTransform | import("react-native").TranslateXTransform | import("react-native").TranslateYTransform | import("react-native").SkewXTransform | import("react-native").SkewYTransform | import("react-native").MatrixTransform)[] | undefined;
|
|
400
400
|
transformMatrix?: number[] | undefined;
|
|
401
401
|
rotation?: number | undefined;
|
|
402
|
-
scaleX?: import("@tamagui/
|
|
403
|
-
scaleY?: import("@tamagui/
|
|
402
|
+
scaleX?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
403
|
+
scaleY?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
404
404
|
translateX?: number | undefined;
|
|
405
405
|
translateY?: number | undefined;
|
|
406
|
-
x?: import("@tamagui/
|
|
407
|
-
y?: import("@tamagui/
|
|
406
|
+
x?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
407
|
+
y?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
408
408
|
perspective?: number | undefined;
|
|
409
|
-
scale?: import("@tamagui/
|
|
409
|
+
scale?: import("@tamagui/web").ThemeValueFallback | import("@tamagui/web").SpaceTokens | undefined;
|
|
410
410
|
skewX?: string | undefined;
|
|
411
411
|
skewY?: string | undefined;
|
|
412
412
|
matrix?: number[] | undefined;
|
|
@@ -417,9 +417,9 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
417
417
|
cursor?: import("csstype").Property.Cursor | undefined;
|
|
418
418
|
contain?: import("csstype").Property.Contain | undefined;
|
|
419
419
|
display?: "flex" | "none" | "inherit" | "inline" | "block" | "contents" | "inline-flex" | undefined;
|
|
420
|
-
gap?: import("@tamagui/
|
|
421
|
-
gapColumn?: import("@tamagui/
|
|
422
|
-
gapRow?: import("@tamagui/
|
|
420
|
+
gap?: import("@tamagui/web").SpaceTokens | undefined;
|
|
421
|
+
gapColumn?: import("@tamagui/web").SpaceTokens | undefined;
|
|
422
|
+
gapRow?: import("@tamagui/web").SpaceTokens | undefined;
|
|
423
423
|
userSelect?: import("csstype").Property.UserSelect | undefined;
|
|
424
424
|
outlineColor?: import("csstype").Property.OutlineColor | undefined;
|
|
425
425
|
outlineStyle?: import("csstype").Property.OutlineStyle | undefined;
|
|
@@ -451,7 +451,7 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
451
451
|
rel?: string | undefined;
|
|
452
452
|
download?: boolean | undefined;
|
|
453
453
|
} | undefined;
|
|
454
|
-
elevation?: import("@tamagui/
|
|
454
|
+
elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
455
455
|
transparent?: boolean | undefined;
|
|
456
456
|
hoverTheme?: boolean | undefined;
|
|
457
457
|
pressTheme?: boolean | undefined;
|
|
@@ -465,11 +465,11 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
465
465
|
chromeless?: boolean | "all" | undefined;
|
|
466
466
|
fullscreen?: boolean | undefined;
|
|
467
467
|
defaultStyle?: boolean | undefined;
|
|
468
|
-
size?: import("@tamagui/
|
|
468
|
+
size?: import("@tamagui/web").SizeTokens | undefined;
|
|
469
469
|
active?: boolean | undefined;
|
|
470
|
-
hoverStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
470
|
+
hoverStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
471
471
|
readonly fullscreen?: boolean | undefined;
|
|
472
|
-
readonly elevation?: import("@tamagui/
|
|
472
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
473
473
|
} & {
|
|
474
474
|
readonly backgrounded?: boolean | undefined;
|
|
475
475
|
readonly radiused?: boolean | undefined;
|
|
@@ -484,13 +484,13 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
484
484
|
readonly chromeless?: boolean | "all" | undefined;
|
|
485
485
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
486
486
|
readonly defaultStyle?: boolean | undefined;
|
|
487
|
-
readonly size?: import("@tamagui/
|
|
487
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
488
488
|
readonly active?: boolean | undefined;
|
|
489
489
|
readonly disabled?: boolean | undefined;
|
|
490
490
|
}> | null | undefined;
|
|
491
|
-
pressStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
491
|
+
pressStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
492
492
|
readonly fullscreen?: boolean | undefined;
|
|
493
|
-
readonly elevation?: import("@tamagui/
|
|
493
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
494
494
|
} & {
|
|
495
495
|
readonly backgrounded?: boolean | undefined;
|
|
496
496
|
readonly radiused?: boolean | undefined;
|
|
@@ -505,13 +505,13 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
505
505
|
readonly chromeless?: boolean | "all" | undefined;
|
|
506
506
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
507
507
|
readonly defaultStyle?: boolean | undefined;
|
|
508
|
-
readonly size?: import("@tamagui/
|
|
508
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
509
509
|
readonly active?: boolean | undefined;
|
|
510
510
|
readonly disabled?: boolean | undefined;
|
|
511
511
|
}> | null | undefined;
|
|
512
|
-
focusStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
512
|
+
focusStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
513
513
|
readonly fullscreen?: boolean | undefined;
|
|
514
|
-
readonly elevation?: import("@tamagui/
|
|
514
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
515
515
|
} & {
|
|
516
516
|
readonly backgrounded?: boolean | undefined;
|
|
517
517
|
readonly radiused?: boolean | undefined;
|
|
@@ -526,13 +526,13 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
526
526
|
readonly chromeless?: boolean | "all" | undefined;
|
|
527
527
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
528
528
|
readonly defaultStyle?: boolean | undefined;
|
|
529
|
-
readonly size?: import("@tamagui/
|
|
529
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
530
530
|
readonly active?: boolean | undefined;
|
|
531
531
|
readonly disabled?: boolean | undefined;
|
|
532
532
|
}> | null | undefined;
|
|
533
|
-
exitStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
533
|
+
exitStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
534
534
|
readonly fullscreen?: boolean | undefined;
|
|
535
|
-
readonly elevation?: import("@tamagui/
|
|
535
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
536
536
|
} & {
|
|
537
537
|
readonly backgrounded?: boolean | undefined;
|
|
538
538
|
readonly radiused?: boolean | undefined;
|
|
@@ -547,13 +547,13 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
547
547
|
readonly chromeless?: boolean | "all" | undefined;
|
|
548
548
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
549
549
|
readonly defaultStyle?: boolean | undefined;
|
|
550
|
-
readonly size?: import("@tamagui/
|
|
550
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
551
551
|
readonly active?: boolean | undefined;
|
|
552
552
|
readonly disabled?: boolean | undefined;
|
|
553
553
|
}> | null | undefined;
|
|
554
|
-
enterStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/
|
|
554
|
+
enterStyle?: Partial<Omit<import("react-native").ViewProps, "display" | "children" | "onLayout" | keyof import("react-native").GestureResponderHandlers> & import("@tamagui/web").ExtendBaseStackProps & import("@tamagui/web").TamaguiComponentPropsBase & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStylePropsBase>> & import("@tamagui/core/types/reactNativeTypes").RNViewProps & Omit<{
|
|
555
555
|
readonly fullscreen?: boolean | undefined;
|
|
556
|
-
readonly elevation?: import("@tamagui/
|
|
556
|
+
readonly elevation?: import("@tamagui/web").SizeTokens | undefined;
|
|
557
557
|
} & {
|
|
558
558
|
readonly backgrounded?: boolean | undefined;
|
|
559
559
|
readonly radiused?: boolean | undefined;
|
|
@@ -568,7 +568,7 @@ export declare function useButton(propsIn: ButtonProps, { Text }?: {
|
|
|
568
568
|
readonly chromeless?: boolean | "all" | undefined;
|
|
569
569
|
}, "disabled" | "size" | "defaultStyle" | "active"> & {
|
|
570
570
|
readonly defaultStyle?: boolean | undefined;
|
|
571
|
-
readonly size?: import("@tamagui/
|
|
571
|
+
readonly size?: import("@tamagui/web").SizeTokens | undefined;
|
|
572
572
|
readonly active?: boolean | undefined;
|
|
573
573
|
readonly disabled?: boolean | undefined;
|
|
574
574
|
}> | null | undefined;
|
package/types/Button.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAe,gBAAgB,EAAsB,MAAM,eAAe,CAAA;AACjF,OAAO,EAEL,QAAQ,EACR,cAAc,EACd,cAAc,EAOf,MAAM,cAAc,CAAA;AACrB,OAAO,EAAE,iBAAiB,EAA0B,MAAM,OAAO,CAAA;AAEjE,KAAK,eAAe,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AACxD,KAAK,QAAQ,GAAG,GAAG,CAAC,OAAO,GAAG,iBAAiB,CAAC,eAAe,CAAC,GAAG,IAAI,CAAA;AAEvE,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,GAC/D,QAAQ,CAAC,OAAO,WAAW,CAAC,GAC5B,cAAc,GAAG;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAA;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAIH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuDtB,CAAA;AAEF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;EAgBrB,CAAA;AAYF,eAAO,MAAM,kBAAkB;;CAY9B,CAAA;AAED,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAjIf;;OAEG;;IAEH;;OAEG;;IAEH;;;;OAIG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;+LA4GN,CAAA;AAED,wBAAgB,SAAS,CACvB,OAAO,EAAE,WAAW,EACpB,EAAE,IAAiB,EAAE,GAAE;IAAE,IAAI,EAAE,GAAG,CAAA;CAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAlHzD;;WAEG;;;EAuMN"}
|