Comments (1)
Look at my example project https://github.com/danya0365/expo-react-native-uikitten-with-auth-middleware
in custom mapping file constants/app-mapping-eva.json
you can put all content from node_modules/@eva-design/eva/mapping.json
for example
{
"components": {
"Input": {
"meta": {
"scope": "all",
"parameters": {
"paddingVertical": {
"type": "number"
},
"paddingHorizontal": {
"type": "number"
},
"minHeight": {
"type": "number"
},
"borderRadius": {
"type": "number"
},
"borderWidth": {
"type": "number"
},
"borderColor": {
"type": "string"
},
"backgroundColor": {
"type": "string"
},
"textMarginHorizontal": {
"type": "number"
},
"textFontFamily": {
"type": "string"
},
"textFontSize": {
"type": "number"
},
"textFontWeight": {
"type": "string"
},
"textColor": {
"type": "string"
},
"placeholderColor": {
"type": "string"
},
"iconWidth": {
"type": "number"
},
"iconHeight": {
"type": "number"
},
"iconMarginHorizontal": {
"type": "number"
},
"iconTintColor": {
"type": "string"
},
"labelColor": {
"type": "string"
},
"labelFontFamily": {
"type": "string"
},
"labelFontSize": {
"type": "number"
},
"labelFontWeight": {
"type": "string"
},
"labelMarginBottom": {
"type": "number"
},
"captionColor": {
"type": "string"
},
"captionFontFamily": {
"type": "string"
},
"captionFontSize": {
"type": "number"
},
"captionFontWeight": {
"type": "string"
}
},
"appearances": {
"default": {
"default": true
}
},
"variantGroups": {
"status": {
"basic": {
"default": true
},
"primary": {
"default": false
},
"success": {
"default": false
},
"info": {
"default": false
},
"warning": {
"default": false
},
"danger": {
"default": false
},
"control": {
"default": false
}
},
"size": {
"small": {
"default": false
},
"medium": {
"default": true
},
"large": {
"default": false
}
}
},
"states": {
"hover": {
"default": false,
"priority": 0,
"scope": "all"
},
"disabled": {
"default": false,
"priority": 1,
"scope": "all"
},
"focused": {
"default": false,
"priority": 2,
"scope": "all"
}
}
},
"appearances": {
"default": {
"mapping": {
"paddingHorizontal": 8,
"textMarginHorizontal": 8,
"textFontFamily": "text-font-family",
"iconWidth": 24,
"iconHeight": 24,
"iconMarginHorizontal": 8,
"labelMarginBottom": 4,
"labelFontSize": "text-label-font-size",
"labelFontWeight": "text-label-font-weight",
"labelFontFamily": "text-label-font-family",
"captionFontSize": "text-caption-1-font-size",
"captionFontWeight": "text-caption-1-font-weight",
"captionFontFamily": "text-caption-1-font-family"
},
"variantGroups": {
"status": {
"basic": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-basic-color",
"labelColor": "text-hint-color",
"captionColor": "text-hint-color",
"placeholderColor": "text-hint-color",
"iconTintColor": "text-hint-color",
"state": {
"focused": {
"borderColor": "color-primary-default",
"backgroundColor": "background-basic-color-1",
"iconTintColor": "text-primary-color"
},
"hover": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-3"
},
"disabled": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-disabled-color",
"labelColor": "text-disabled-color",
"captionColor": "text-disabled-color",
"placeholderColor": "text-disabled-color",
"iconTintColor": "text-disabled-color"
}
}
},
"primary": {
"borderColor": "color-primary-default",
"backgroundColor": "background-basic-color-2",
"textColor": "text-basic-color",
"labelColor": "text-hint-color",
"captionColor": "text-primary-color",
"placeholderColor": "text-hint-color",
"iconTintColor": "text-primary-color",
"state": {
"focused": {
"borderColor": "color-primary-focus",
"backgroundColor": "background-basic-color-1",
"iconTintColor": "text-primary-focus-color"
},
"hover": {
"borderColor": "color-primary-hover",
"backgroundColor": "background-basic-color-3"
},
"disabled": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-disabled-color",
"labelColor": "text-disabled-color",
"captionColor": "text-disabled-color",
"placeholderColor": "text-disabled-color",
"iconTintColor": "text-disabled-color"
}
}
},
"success": {
"borderColor": "color-success-default",
"backgroundColor": "background-basic-color-2",
"textColor": "text-basic-color",
"labelColor": "text-hint-color",
"captionColor": "text-success-color",
"placeholderColor": "text-hint-color",
"iconTintColor": "text-success-color",
"state": {
"focused": {
"borderColor": "color-success-focus",
"backgroundColor": "background-basic-color-1",
"iconTintColor": "text-success-focus-color"
},
"hover": {
"borderColor": "color-success-hover",
"backgroundColor": "background-basic-color-3"
},
"disabled": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-disabled-color",
"labelColor": "text-disabled-color",
"captionColor": "text-disabled-color",
"placeholderColor": "text-disabled-color",
"iconTintColor": "text-disabled-color"
}
}
},
"info": {
"borderColor": "color-info-default",
"backgroundColor": "background-basic-color-2",
"textColor": "text-basic-color",
"labelColor": "text-hint-color",
"captionColor": "text-info-color",
"placeholderColor": "text-hint-color",
"iconTintColor": "text-info-color",
"state": {
"focused": {
"borderColor": "color-info-focus",
"backgroundColor": "background-basic-color-1",
"iconTintColor": "text-info-focus-color"
},
"hover": {
"borderColor": "color-info-hover",
"backgroundColor": "background-basic-color-3"
},
"disabled": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-disabled-color",
"labelColor": "text-disabled-color",
"captionColor": "text-disabled-color",
"placeholderColor": "text-disabled-color",
"iconTintColor": "text-disabled-color"
}
}
},
"warning": {
"borderColor": "color-warning-default",
"backgroundColor": "background-basic-color-2",
"textColor": "text-basic-color",
"labelColor": "text-hint-color",
"captionColor": "text-warning-color",
"placeholderColor": "text-hint-color",
"iconTintColor": "text-warning-color",
"state": {
"focused": {
"borderColor": "color-warning-focus",
"backgroundColor": "background-basic-color-1",
"iconTintColor": "text-warning-focus-color"
},
"hover": {
"borderColor": "color-warning-hover",
"backgroundColor": "background-basic-color-3"
},
"disabled": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-disabled-color",
"labelColor": "text-disabled-color",
"captionColor": "text-disabled-color",
"placeholderColor": "text-disabled-color",
"iconTintColor": "text-disabled-color"
}
}
},
"danger": {
"borderColor": "color-danger-default",
"backgroundColor": "background-basic-color-2",
"textColor": "text-basic-color",
"labelColor": "text-hint-color",
"captionColor": "text-danger-color",
"placeholderColor": "text-hint-color",
"iconTintColor": "text-danger-color",
"state": {
"focused": {
"borderColor": "color-danger-focus",
"backgroundColor": "background-basic-color-1",
"iconTintColor": "text-danger-focus-color"
},
"hover": {
"borderColor": "color-danger-hover",
"backgroundColor": "background-basic-color-3"
},
"disabled": {
"borderColor": "border-basic-color-4",
"backgroundColor": "background-basic-color-2",
"textColor": "text-disabled-color",
"labelColor": "text-disabled-color",
"captionColor": "text-disabled-color",
"placeholderColor": "text-disabled-color",
"iconTintColor": "text-disabled-color"
}
}
},
"control": {
"borderColor": "color-basic-control-transparent-500",
"backgroundColor": "color-basic-control-transparent-300",
"textColor": "text-control-color",
"labelColor": "text-control-color",
"captionColor": "text-control-color",
"placeholderColor": "text-control-color",
"iconTintColor": "text-control-color",
"state": {
"focused": {
"borderColor": "color-control-transparent-focus-border",
"backgroundColor": "color-basic-control-transparent-500",
"iconTintColor": "text-control-color"
},
"hover": {
"borderColor": "color-control-transparent-hover-border",
"backgroundColor": "color-basic-control-transparent-400"
},
"disabled": {
"borderColor": "color-control-transparent-disabled-border",
"backgroundColor": "color-control-transparent-disabled",
"textColor": "text-control-color",
"labelColor": "text-control-color",
"captionColor": "text-control-color",
"placeholderColor": "text-control-color",
"iconTintColor": "text-control-color"
}
}
}
},
"size": {
"small": {
"minHeight": "size-small",
"borderRadius": "border-radius",
"borderWidth": "border-width",
"paddingVertical": 3,
"textFontSize": "text-subtitle-2-font-size",
"textFontWeight": "normal"
},
"medium": {
"minHeight": "size-medium",
"borderRadius": "border-radius",
"borderWidth": "border-width",
"paddingVertical": 7,
"textFontSize": "text-subtitle-1-font-size",
"textFontWeight": "normal"
},
"large": {
"minHeight": "size-large",
"borderRadius": "border-radius",
"borderWidth": "border-width",
"paddingVertical": 11,
"textFontSize": "text-subtitle-1-font-size",
"textFontWeight": "normal"
}
}
}
}
}
}
}
}
from react-native-ui-kitten.
Related Issues (20)
- Custom theme background color does not show right
- Duplication of the month name 'March' in the calendar between 1981 and 1984.
- Modal no longer appears after upgrade
- View Pager selectedIndex fails to change the page shown after manually swiping a page
- Exception thrown while executing UI block: - [RNSVGSvgView setOnClick]: unrecognized selector sent to instance 0x01071ca460
- Modal is vibrating HOT 1
- Input breaks inside a Scrollview
- Select option inner radius issue HOT 1
- Google Play store link of kitten tricks APP is 404 not found HOT 1
- Feature of Initials in Avatar component
- Is this project abandoned? HOT 7
- Can't find variable: React
- BottomNavigationTab has wrong offset on iOS HOT 1
- hi, how to generate multiple tab in tabview HOT 1
- Defaultprops warning when using OverflowMenu HOT 2
- How to change fonts? HOT 3
- Apple Pay (live not test) popup window disappears immediately HOT 1
- Missing Icons for ProgressBar and CircularProgressBar
- UI lags on iPhone 14 Pro HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-ui-kitten.