Revert temp storybook commit, remove deprecated values

This commit is contained in:
Eric Bailey
2025-07-30 16:19:43 -05:00
parent 4d1e8f7860
commit 38bc608654
2 changed files with 43 additions and 143 deletions
+30 -128
View File
@@ -1,4 +1,3 @@
import React from 'react'
import {View} from 'react-native' import {View} from 'react-native'
import {atoms as a} from '#/alf' import {atoms as a} from '#/alf'
@@ -7,7 +6,6 @@ import {
type ButtonColor, type ButtonColor,
ButtonIcon, ButtonIcon,
ButtonText, ButtonText,
type ButtonVariant,
} from '#/components/Button' } from '#/components/Button'
import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron' import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron'
import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe'
@@ -27,10 +25,7 @@ export function Buttons() {
'negative_secondary', 'negative_secondary',
].map(color => ( ].map(color => (
<View key={color} style={[a.gap_md, a.align_start]}> <View key={color} style={[a.gap_md, a.align_start]}>
{['solid', 'outline', 'ghost'].map(variant => (
<React.Fragment key={variant}>
<Button <Button
variant={variant as ButtonVariant}
color={color as ButtonColor} color={color as ButtonColor}
size="large" size="large"
label="Click here"> label="Click here">
@@ -38,221 +33,128 @@ export function Buttons() {
</Button> </Button>
<Button <Button
disabled disabled
variant={variant as ButtonVariant}
color={color as ButtonColor} color={color as ButtonColor}
size="large" size="large"
label="Click here"> label="Click here">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
</React.Fragment>
))}
</View> </View>
))} ))}
</View> </View>
<View style={[a.flex_wrap, a.gap_md, a.align_start]}> <View style={[a.flex_wrap, a.gap_md, a.align_start]}>
<Button variant="solid" color="primary" size="large" label="Link out"> <Button color="primary" size="large" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
<Button variant="solid" color="primary" size="large" label="Link out"> <Button color="primary" size="large" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
<ButtonIcon icon={Globe} position="right" /> <ButtonIcon icon={Globe} position="right" />
</Button> </Button>
<Button variant="solid" color="primary" size="small" label="Link out"> <Button color="primary" size="small" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
<Button variant="solid" color="primary" size="small" label="Link out"> <Button color="primary" size="small" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
<ButtonIcon icon={Globe} position="right" /> <ButtonIcon icon={Globe} position="right" />
</Button> </Button>
<Button variant="solid" color="primary" size="tiny" label="Link out"> <Button color="primary" size="tiny" label="Link out">
<ButtonIcon icon={Globe} position="left" /> <ButtonIcon icon={Globe} position="left" />
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
</View> </View>
<View style={[a.flex_row, a.gap_md, a.align_center]}> <View style={[a.flex_row, a.gap_md, a.align_center]}>
<Button variant="solid" color="primary" size="large" label="Link out"> <Button color="primary" size="large" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
<Button variant="solid" color="primary" size="large" label="Link out"> <Button color="primary" size="large" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
<ButtonIcon icon={Globe} position="right" /> <ButtonIcon icon={Globe} position="right" />
</Button> </Button>
<Button variant="solid" color="primary" size="large" label="Link out"> <Button color="primary" size="large" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
<ButtonIcon icon={Globe} position="right" size="lg" /> <ButtonIcon icon={Globe} position="right" size="lg" />
</Button> </Button>
<Button <Button color="primary" size="large" shape="round" label="Link out">
variant="solid"
color="primary"
size="large"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="large" shape="round" label="Link out">
variant="solid"
color="primary"
size="large"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} size="lg" /> <ButtonIcon icon={ChevronLeft} size="lg" />
</Button> </Button>
</View> </View>
<View style={[a.flex_row, a.gap_md, a.align_center]}> <View style={[a.flex_row, a.gap_md, a.align_center]}>
<Button variant="solid" color="primary" size="small" label="Link out"> <Button color="primary" size="small" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
<Button variant="solid" color="primary" size="small" label="Link out"> <Button color="primary" size="small" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
<ButtonIcon icon={Globe} position="right" /> <ButtonIcon icon={Globe} position="right" />
</Button> </Button>
<Button <Button color="primary" size="small" shape="round" label="Link out">
variant="solid"
color="primary"
size="small"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="small" shape="round" label="Link out">
variant="solid"
color="primary"
size="small"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} size="lg" /> <ButtonIcon icon={ChevronLeft} size="lg" />
</Button> </Button>
</View> </View>
<View style={[a.flex_row, a.gap_md, a.align_center]}> <View style={[a.flex_row, a.gap_md, a.align_center]}>
<Button variant="solid" color="primary" size="tiny" label="Link out"> <Button color="primary" size="tiny" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
</Button> </Button>
<Button variant="solid" color="primary" size="tiny" label="Link out"> <Button color="primary" size="tiny" label="Link out">
<ButtonText>Button</ButtonText> <ButtonText>Button</ButtonText>
<ButtonIcon icon={Globe} position="right" /> <ButtonIcon icon={Globe} position="right" />
</Button> </Button>
<Button <Button color="primary" size="tiny" shape="round" label="Link out">
variant="solid"
color="primary"
size="tiny"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="tiny" shape="round" label="Link out">
variant="solid"
color="primary"
size="tiny"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} size="md" /> <ButtonIcon icon={ChevronLeft} size="md" />
</Button> </Button>
</View> </View>
<View style={[a.flex_row, a.gap_md, a.align_center]}> <View style={[a.flex_row, a.gap_md, a.align_center]}>
<Button <Button color="primary" size="large" shape="round" label="Link out">
variant="solid"
color="primary"
size="large"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="small" shape="round" label="Link out">
variant="solid"
color="primary"
size="small"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="tiny" shape="round" label="Link out">
variant="solid"
color="primary"
size="tiny"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="large" shape="round" label="Link out">
variant="outline"
color="primary"
size="large"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="small" shape="round" label="Link out">
variant="ghost"
color="primary"
size="small"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="tiny" shape="round" label="Link out">
variant="ghost"
color="primary"
size="tiny"
shape="round"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
</View> </View>
<View style={[a.flex_row, a.gap_md, a.align_start]}> <View style={[a.flex_row, a.gap_md, a.align_start]}>
<Button <Button color="primary" size="large" shape="square" label="Link out">
variant="solid"
color="primary"
size="large"
shape="square"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="small" shape="square" label="Link out">
variant="solid"
color="primary"
size="small"
shape="square"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="tiny" shape="square" label="Link out">
variant="solid"
color="primary"
size="tiny"
shape="square"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="large" shape="square" label="Link out">
variant="outline"
color="primary"
size="large"
shape="square"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="small" shape="square" label="Link out">
variant="ghost"
color="primary"
size="small"
shape="square"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
<Button <Button color="primary" size="tiny" shape="square" label="Link out">
variant="ghost"
color="primary"
size="tiny"
shape="square"
label="Link out">
<ButtonIcon icon={ChevronLeft} /> <ButtonIcon icon={ChevronLeft} />
</Button> </Button>
</View> </View>
-2
View File
@@ -87,8 +87,6 @@ function StorybookInner() {
</Button> </Button>
</View> </View>
<Buttons />
<Button <Button
color="primary" color="primary"
size="small" size="small"