Skip to content

Commit a30cc8a

Browse files
Merge pull request #110 from GeekyAnts/staging
Staging
2 parents 50f74f5 + a7a4147 commit a30cc8a

File tree

156 files changed

+11867
-71
lines changed

Some content is hidden

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

156 files changed

+11867
-71
lines changed

build-init.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,6 @@ const cloneRepos = () => {
2020

2121
let a = shellJS.exec('git checkout ' + 'v' + v);
2222

23-
//TODO: 3.2.0-hack
24-
if (v === '3.2.0') {
25-
a = shellJS.exec('git checkout ' + 'master');
26-
}
2723
if (a.code !== 0) {
2824
shellJS.exec('git checkout ' + FALLBACK_BRANCH);
2925
shellJS.exec('git pull');

docs/changelog.md

Lines changed: 25 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,30 @@ id: changelog
33
title: Changelog
44
---
55

6+
## Features
7+
8+
TypeScript enhancement for custom theme tokens and variants - https://github.com/GeekyAnts/NativeBase/pull/4173
9+
610
## Fixes
711

8-
- Added a feature to suppress accessible color warning [#3849](https://github.com/GeekyAnts/NativeBase/pull/3849)
9-
- Fixed support for numberOfLines props on Text [#3852](https://github.com/GeekyAnts/NativeBase/pull/3852)
10-
- Fixed \_text not working in Link component's baseStyle/variants [#3854](https://github.com/GeekyAnts/NativeBase/pull/3854)
11-
- Fixed custom id not being passed in a custom toast [#3870](https://github.com/GeekyAnts/NativeBase/pull/3870)
12-
- Exported IPressableProps [#3872](https://github.com/GeekyAnts/NativeBase/pull/3871)
13-
- Fixed Overlay/Backdrop cursor pointer issue. [#3880](https://github.com/GeekyAnts/NativeBase/pull/3880)
14-
- Fixed Avatar.Badge conditional rendering [#3885](https://github.com/GeekyAnts/NativeBase/pull/3885)
15-
- Added \_backdrop prop in actionsheet and modal to apply styles to backrop(overlay) [#3886](https://github.com/GeekyAnts/NativeBase/pull/3886)
16-
- Added typings for left and right for placement prop in Slide. [#3889](https://github.com/GeekyAnts/NativeBase/pull/3889)
17-
- Added xxs typing for fontSize in Text. [#3890](https://github.com/GeekyAnts/NativeBase/pull/3890)
18-
- Added support for React.Fragment as Children in Box. [#3891](https://github.com/GeekyAnts/NativeBase/pull/3891)
19-
- Fixed Stack space extend issue. [#3897](https://github.com/GeekyAnts/NativeBase/pull/3897)
20-
- Fixed Radio Size issue on happening on iOS and Android. [#3913](https://github.com/GeekyAnts/NativeBase/pull/3913)
21-
22-
For more details. Visit [releases](https://github.com/GeekyAnts/NativeBase/releases/tag/v3.0.7).
12+
Overlay press not closing ActionSheet - https://github.com/GeekyAnts/NativeBase/pull/4112
13+
14+
Background prop - https://github.com/GeekyAnts/NativeBase/pull/4115
15+
16+
Radio error message when not in Group - https://github.com/GeekyAnts/NativeBase/pull/4117
17+
18+
`theme[\_base.themePropertyMap[property]]` is not a function error - https://github.com/GeekyAnts/NativeBase/pull/4118
19+
20+
Button loading style not working - https://github.com/GeekyAnts/NativeBase/pull/4128
21+
22+
Select component height prop not working - https://github.com/GeekyAnts/NativeBase/pull/4129
23+
24+
Spinner size prop typings - https://github.com/GeekyAnts/NativeBase/pull/4141
25+
26+
Replace Clipboard with @react-native-clipboard/clipboard - https://github.com/GeekyAnts/NativeBase/pull/4148
27+
28+
Typing fixes on Stack and Modal - https://github.com/GeekyAnts/NativeBase/pull/4161
29+
30+
Select items appear behind keyboard - https://github.com/GeekyAnts/NativeBase/pull/4163
31+
32+
For more details. Visit [releases](https://github.com/GeekyAnts/NativeBase/releases/tag/v3.2.1).

docs/getting-started.mdx

Lines changed: 36 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -7,55 +7,57 @@ slug: /
77
import { KitchenSinkIframe, TileLink, NBHistory } from '../src/components';
88
import TOCInline from '@theme/TOCInline';
99

10-
<div className="tailwind">
11-
<div className="row m-0">
10+
<div className='tailwind'>
11+
<div className='row m-0'>
1212
<div className="col col--9 mb-12 p-0">
13-
<p className="text-md">
14-
NativeBase is a component library that enables devs to build universal design systems. It is built on top of React Native, allowing you to develop apps for Android, iOS and the Web.
13+
<p className='text-md'>
14+
NativeBase is a component library that enables devs to build universal
15+
design systems. It is built on top of React Native, allowing you to
16+
develop apps for Android, iOS and the Web.
1517
</p>
16-
<div className="mt-8 pl-2 -ml-1">
17-
<div className="row mb-2 m-0 -ml-3">
18+
<div className='mt-8 pl-2 -ml-1'>
19+
<div className='row mb-2 m-0 -ml-3'>
1820
<TileLink
19-
title="Installation Guide"
20-
url="installation"
21-
description="Setup NativeBase in your project"
22-
className="bg-cyan-600"
21+
title='Installation Guide'
22+
url='installation'
23+
description='Setup NativeBase in your project'
24+
className='bg-cyan-600'
2325
/>
2426
<TileLink
25-
title="Playground"
26-
url="https://snack.expo.io/@nishanbende/example"
27-
description="Try NativeBase on Snack by Expo"
28-
className="bg-teal-600"
27+
title='Playground'
28+
url='https://snack.expo.io/@nishanbende/example'
29+
description='Try NativeBase on Snack by Expo'
30+
className='bg-teal-600'
2931
/>
3032
</div>
31-
<div className="row m-0 -ml-3">
33+
<div className='row m-0 -ml-3'>
3234
<TileLink
33-
title="Theming"
34-
url="default-theme"
35-
description="Create your own Design System"
36-
className="bg-pink-600"
35+
title='Theming'
36+
url='default-theme'
37+
description='Create your own Design System'
38+
className='bg-pink-600'
3739
/>
3840
<TileLink
39-
title="Recipes"
40-
url="login-signup-forms"
41-
description="Popular Recipes for Apps"
42-
className="bg-indigo-600"
41+
title='Recipes'
42+
url='login-signup-forms'
43+
description='Popular Recipes for Apps'
44+
className='bg-indigo-600'
4345
/>
4446
</div>
45-
4647
</div>
4748
</div>
48-
<div className="col col--3 mb-12">
49+
<div className='col col--3 mb-12'>
4950
<KitchenSinkIframe />
5051
</div>
5152
</div>
52-
<h2 className="text-3xl mb-12">A Brief History of NativeBase</h2>
53-
<div className="mt-4 ml-4">
54-
<NBHistory />
55-
</div>
56-
<h2 className="text-3xl mt-12">What's New with NativeBase v3?</h2>
5753

58-
We had clear goals in mind while building version 3. Take a look at some of the new features we added:
54+
<h2 className="text-3xl mb-12">A Brief History of NativeBase</h2>
55+
<div className="mt-4 ml-4">
56+
<NBHistory />
57+
</div>
58+
<h2 className="text-3xl mt-12">What's New with NativeBase v3?</h2>
59+
We had clear goals in mind while building version 3. Take a look at some of the new
60+
features we added:
5961

6062
<div className="mt-8">
6163
<h4 className="text-xl">Multiplatform</h4>
@@ -64,7 +66,6 @@ We had clear goals in mind while building version 3. Take a look at some of the
6466
customise properties using platform-specific props.
6567
</div>
6668
</div>
67-
6869
<div className="mt-8">
6970
<h4 className="text-xl">Inherently Beautiful</h4>
7071
<div>
@@ -80,14 +81,11 @@ We had clear goals in mind while building version 3. Take a look at some of the
8081
keyboard navigation and more.
8182
</div>
8283
</div>
83-
8484
<div className="mt-8">
85-
<h4 className="text-xl">Customisable
86-
87-
</h4>
85+
<h4 className="text-xl">Customisable</h4>
8886
<div>
89-
The default theme can be extended as you desire. You can also customise specific components for your app needs.
87+
The default theme can be extended as you desire. You can also customise
88+
specific components for your app needs.
9089
</div>
9190
</div>
92-
9391
</div>

docs/typescript.md

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
---
2+
id: typescript
3+
title: Typescript
4+
---
5+
6+
To enable typescript for custom theme tokens or variants, we'll follow two simple steps.
7+
8+
Below, in the [extendTheme](http://localhost:3002/customizing-theme) function, we're adding a space token and a custom variant for the Button.
9+
10+
```jsx
11+
import { extendTheme } from 'native-base';
12+
13+
const customTheme = extendTheme({
14+
space: {
15+
'space-2': '29px',
16+
},
17+
components: {
18+
Button: {
19+
variants: {
20+
brand: {
21+
p: '10',
22+
bg: 'brand.500',
23+
},
24+
},
25+
},
26+
},
27+
});
28+
29+
// 2. Get the type of the CustomTheme
30+
type CustomThemeType = typeof customTheme;
31+
32+
// 3. Extend the internal NativeBase Theme
33+
declare module 'native-base' {
34+
interface ICustomTheme extends CustomThemeType {}
35+
}
36+
```
37+
38+
## Result
39+
40+
<img src="/img/ts-gif.gif" alt="Typescript intellisense with custom theme tokens"/>

nb-plugins/component-prop-table/index.js

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ const templateGenerator = (componentDetails) => {
5555
})
5656
.join(' | ');
5757

58-
if (parent.name === `I${displayName}Props`) {
58+
if (parent && parent.name === `I${displayName}Props`) {
5959
propExists = true;
6060
temp =
6161
temp +
@@ -124,13 +124,17 @@ const implementSection = (componentDetails, showStylingProps) => {
124124
let implementsArray = new Set();
125125
for (let prop in props) {
126126
const { name, description, type, parent, defaultValue } = props[prop];
127+
let propName = name;
128+
if (parent) {
129+
propName = parent.name;
130+
}
127131
const MapValue = showStylingProps
128-
? internalPropsMap[parent.name] ||
129-
rnPropsMap[parent.name] ||
130-
StylingPropsMap[parent.name]
131-
: internalPropsMap[parent.name];
132+
? internalPropsMap[propName] ||
133+
rnPropsMap[propName] ||
134+
StylingPropsMap[propName]
135+
: internalPropsMap[propName];
132136

133-
if (MapValue && parent.name !== `I${displayName}Props`) {
137+
if (MapValue && propName !== `I${displayName}Props`) {
134138
implementsArray.add(
135139
MapValue.link.startsWith('http')
136140
? `<a href="${MapValue.link}"><code>${MapValue.name}</code></a>`

nb-plugins/component-prop-table/propsMap.js

Lines changed: 50 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,11 @@ const rnProps = {
220220
// Styling props
221221
const borderProps = {
222222
ITextProps: { doc: 'text.md', name: 'Text', link: 'text#props' },
223-
223+
borderRadius: {
224+
doc: 'utilityProps.md',
225+
name: 'BorderProps',
226+
link: 'utility-props#borders',
227+
},
224228
//Border Props
225229
BorderProps: {
226230
doc: 'utilityProps.md',
@@ -269,6 +273,16 @@ const borderProps = {
269273
},
270274
};
271275
const colorProps = {
276+
color: {
277+
doc: 'utilityProps.md',
278+
name: 'ColorProps',
279+
link: 'utility-props#color-and-background-color',
280+
},
281+
backgroundColor: {
282+
doc: 'utilityProps.md',
283+
name: 'ColorProps',
284+
link: 'utility-props#color-and-background-color',
285+
},
272286
ColorProps: {
273287
doc: 'utilityProps.md',
274288
name: 'ColorProps',
@@ -291,6 +305,11 @@ const colorProps = {
291305
},
292306
};
293307
const flexProps = {
308+
flex: {
309+
doc: 'utilityProps.md',
310+
name: 'FlexProps',
311+
link: 'utility-props#flexbox',
312+
},
294313
FlexboxProps: {
295314
doc: 'utilityProps.md',
296315
name: 'FlexProps',
@@ -303,6 +322,11 @@ const flexProps = {
303322
},
304323
};
305324
const layoutProps = {
325+
width: {
326+
doc: 'utilityProps.md',
327+
name: 'LayoutProps',
328+
link: 'utility-props#layout-width-and-height',
329+
},
306330
LayoutProps: {
307331
doc: 'utilityProps.md',
308332
name: 'LayoutProps',
@@ -360,6 +384,11 @@ const layoutProps = {
360384
},
361385
};
362386
const positionProps = {
387+
position: {
388+
doc: 'utilityProps.md',
389+
name: 'PositionProps',
390+
link: 'utility-props#position',
391+
},
363392
PositionProps: {
364393
doc: 'utilityProps.md',
365394
name: 'PositionProps',
@@ -424,6 +453,11 @@ const spaceProps = {
424453
},
425454
};
426455
const typographyProps = {
456+
fontSize: {
457+
doc: 'utilityProps.md',
458+
name: 'TypographyProps',
459+
link: 'utility-props#typography',
460+
},
427461
TypographyProps: {
428462
doc: 'utilityProps.md',
429463
name: 'TypographyProps',
@@ -466,6 +500,11 @@ const typographyProps = {
466500
},
467501
};
468502
const backgroundProps = {
503+
bg: {
504+
doc: '',
505+
name: 'BackgroundProps',
506+
link: 'utility-props#background',
507+
},
469508
BackgroundProps: {
470509
doc: '',
471510
name: 'BackgroundProps',
@@ -499,6 +538,11 @@ const safeAreaProps = {
499538
},
500539
};
501540
const shadowProps = {
541+
shadow: {
542+
doc: '',
543+
name: 'ShadowProps',
544+
link: 'utility-props#shadow',
545+
},
502546
ShadowProps: {
503547
doc: '',
504548
name: 'ShadowProps',
@@ -524,6 +568,11 @@ module.exports = {
524568
internalPropsMap: internalProps,
525569
rnPropsMap: rnProps,
526570
StylingPropsMap: {
571+
StyledProps: {
572+
doc: 'utilityProps.md',
573+
name: 'LayoutProps',
574+
link: 'utility-props#layout-width-and-height',
575+
},
527576
...borderProps,
528577
...colorProps,
529578
...typographyProps,

nb-plugins/utils/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ const fs = require('fs');
22
const path = require('path');
33
const docgen = require('react-docgen-typescript');
44
const shell = require('shelljs');
5+
const packageJSON = require('../../package.json');
56

67
const {
78
transformStorybookToDocExample,
@@ -102,7 +103,7 @@ const getNativeBaseVersion = () => {
102103
// return directory.split('versioned_docs/version-')[1];
103104
// }
104105

105-
return '3.2.1-rc.0';
106+
return packageJSON.dependencies['native-base'];
106107
// return 'next';
107108
};
108109

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
"clsx": "^1.1.1",
3636
"dedent": "^0.7.0",
3737
"docusaurus-tailwindcss-loader": "file:plugins/docusaurus-tailwindcss-loader",
38-
"native-base": "3.2.0",
38+
"native-base": "3.2.1",
3939
"object.fromentries": "^2.0.3",
4040
"patch-package": "^6.4.7",
4141
"postcss": "^7.0.34",

sidebars.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ module.exports = {
4444
'dark-mode',
4545
'breakpoints',
4646
'theme',
47+
'typescript',
4748
],
4849
},
4950
{

static/img/ts-gif.gif

153 KB
Loading

0 commit comments

Comments
 (0)