Skip to content

Commit 705a3ee

Browse files
committed
merged from master
2 parents 7c6f0b3 + 395252c commit 705a3ee

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+104
-71
lines changed

example/src/AccordionExample.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Section, { Container } from "./Section";
55

66
function AccordionExample({ theme }) {
77
return (
8-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
8+
<Container style={{ backgroundColor: theme.colors.background.base }}>
99
<Section title="Basic accordion with no additional styles">
1010
<AccordionGroup label={"Basic"}>
1111
<Text>Item 1</Text>
@@ -30,7 +30,7 @@ function AccordionExample({ theme }) {
3030
<AccordionGroup
3131
openColor={theme.colors.branding.primary}
3232
closedColor={theme.colors.branding.secondary}
33-
caretColor={theme.colors.border.brand}
33+
caretColor={theme.colors.border.base}
3434
icon={"folder"}
3535
iconSize={26}
3636
style={{ fontWeight: "normal" }}

example/src/ActionSheetExample.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ function ActionSheetExample({ theme }) {
2020
}, []);
2121

2222
return (
23-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
23+
<Container style={{ backgroundColor: theme.colors.background.base }}>
2424
<Section title="Action Sheet">
2525
<ButtonSolid title="Open Action Sheet" onPress={showActionSheet} />
2626
<ActionSheet visible={visible} onClose={hideActionSheet}>

example/src/App.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@ const DarkTheme = createTheme({
183183
name: "DarkTheme",
184184
colors: {
185185
background: {
186-
brand: "#404040",
186+
base: "#404040",
187187
},
188188
text: {
189189
normal: "white",
@@ -221,14 +221,14 @@ const OtherTheme = createTheme({
221221
secondary: "#824D74",
222222
},
223223
background: {
224-
brand: "black",
224+
base: "black",
225225
},
226226
text: {
227227
strong: "white",
228228
normal: "white",
229229
},
230230
border: {
231-
brand: "#FDAF7B",
231+
base: "#FDAF7B",
232232
},
233233
},
234234
typography: {
@@ -358,7 +358,7 @@ function Example({ title, children }: ExampleProps) {
358358
hasTopSafeArea={true}
359359
hasBottomSafeArea={true}
360360
scrollable={false}
361-
style={{ backgroundColor: theme.colors.background.brand }}
361+
style={{ backgroundColor: theme.colors.background.base }}
362362
>
363363
<View
364364
style={[

example/src/DatePickerExample.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ function DatePickerExample({ theme }) {
1212
const [date3, setDate3] = React.useState(new Date());
1313

1414
return (
15-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
15+
<Container style={{ backgroundColor: theme.colors.background.base }}>
1616
<Section title="Underline">
1717
<DatePicker
1818
label="Date (without date prop)"

example/src/ExpoImageExample.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,6 @@ const ExpoImageExample: React.FC = () => {
6565
uri: "https://picsum.photos/seed/696/3000/2000",
6666
}}
6767
blurhash="LEHLk~WB2yk8pyo0adR*.7kCMdnj"
68-
transition={5000}
6968
style={{
7069
width: 200,
7170
height: 200,
@@ -104,7 +103,7 @@ const ExpoImageExample: React.FC = () => {
104103
transitionDuration={3000}
105104
transitionEffect="cross-dissolve"
106105
transitionTiming="ease-in-out"
107-
style={{ width: 200, height: 200 }}
106+
style={{ width: 150, height: 150 }}
108107
/>
109108
</Wrapper>
110109
<Wrapper label="Flip from Top - Ease Out">
@@ -113,16 +112,20 @@ const ExpoImageExample: React.FC = () => {
113112
transitionDuration={3000}
114113
transitionEffect="flip-from-top"
115114
transitionTiming="ease-out"
116-
style={{ width: 200, height: 200 }}
115+
style={{ width: 150, height: 150 }}
117116
/>
118117
</Wrapper>
118+
</View>
119+
</Section>
120+
<Section title="Transition Timing" style={{}}>
121+
<View style={{ flexDirection: "row", flexWrap: "wrap" }}>
119122
<Wrapper label="Curl Up - Linear">
120123
<ExpoImage
121124
source={{ uri: "https://picsum.photos/1600" }}
122125
transitionDuration={3000}
123126
transitionEffect="curl-up"
124127
transitionTiming="linear"
125-
style={{ width: 200, height: 200 }}
128+
style={{ width: 150, height: 150 }}
126129
/>
127130
</Wrapper>
128131
<Wrapper label="Cross Dissolve - Ease In Out">
@@ -131,7 +134,7 @@ const ExpoImageExample: React.FC = () => {
131134
transitionDuration={3000}
132135
transitionEffect="cross-dissolve"
133136
transitionTiming="ease-in-out"
134-
style={{ width: 200, height: 200 }}
137+
style={{ width: 150, height: 150 }}
135138
/>
136139
</Wrapper>
137140
</View>

example/src/SliderExample.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ function SliderExample({ theme }) {
99
const handleChange = (v) => setValue(v);
1010

1111
return (
12-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
12+
<Container style={{ backgroundColor: theme.colors.background.base }}>
1313
<Section title="Uncontrolled">
1414
<Slider
1515
onValueChange={console.log}
@@ -28,7 +28,7 @@ function SliderExample({ theme }) {
2828
<Section title="Controlled">
2929
<Slider
3030
step={10}
31-
maximumTrackTintColor={theme.colors.foreground.brand}
31+
maximumTrackTintColor={theme.colors.foreground.base}
3232
minimumTrackTintColor={theme.colors.branding.primary}
3333
thumbTintColor={theme.colors.branding.primary}
3434
value={value}
@@ -43,7 +43,7 @@ function SliderExample({ theme }) {
4343
<Section title="Controlled with initial value">
4444
<Slider
4545
step={10}
46-
maximumTrackTintColor={theme.colors.foreground.brand}
46+
maximumTrackTintColor={theme.colors.foreground.base}
4747
minimumTrackTintColor={theme.colors.branding.primary}
4848
thumbTintColor={theme.colors.branding.primary}
4949
value={value2}

example/src/StarRatingExample.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ function StarRatingExample({ theme }) {
66
const [rating, setRating] = React.useState(0.5);
77

88
return (
9-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
9+
<Container style={{ backgroundColor: theme.colors.background.base }}>
1010
<Section title="Star Rating">
1111
<StarRating rating={3.5} />
1212
</Section>

example/src/StepperExample.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ function StepperExample({ theme }) {
1010
const handleChange = (v) => setValue(v);
1111

1212
return (
13-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
13+
<Container style={{ backgroundColor: theme.colors.background.base }}>
1414
<Section title="With State">
1515
<Stepper value={value} onChange={handleChange} />
1616
</Section>

example/src/SurfaceExample.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Section, { Container } from "./Section";
55

66
function SurfaceExample({ theme }) {
77
return (
8-
<Container style={{ backgroundColor: theme.colors.background.brand }}>
8+
<Container style={{ backgroundColor: theme.colors.background.base }}>
99
<Section title="overflow: 'hidden', backgroundColor: 'pink'">
1010
<Surface
1111
style={{

example/src/SwiperExample.tsx

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,24 @@ function SwiperExample() {
147147
/>
148148
</View>
149149
</Section>
150+
151+
<Section title="Hide Dots Example" style={undefined}>
152+
<Swiper
153+
vertical={false}
154+
hideDots
155+
style={{ width: "100%", height: 300 }}
156+
>
157+
<SwiperItem style={[style.item, { backgroundColor: "#fdd3d3" }]}>
158+
<Text>Test Slide 1</Text>
159+
</SwiperItem>
160+
<SwiperItem style={[style.item, { backgroundColor: "#d6d3fd" }]}>
161+
<Text>Test Slide 2</Text>
162+
</SwiperItem>
163+
<SwiperItem style={[style.item, { backgroundColor: "#c9fdd9" }]}>
164+
<Text>Test Slide 3</Text>
165+
</SwiperItem>
166+
</Swiper>
167+
</Section>
150168
</Container>
151169
);
152170
}

0 commit comments

Comments
 (0)