diff --git a/packages/mapping-kitten/eva/index.ts b/packages/mapping-kitten/eva/index.ts index 4332d77..81c0d29 100644 --- a/packages/mapping-kitten/eva/index.ts +++ b/packages/mapping-kitten/eva/index.ts @@ -6973,6 +6973,464 @@ export const style: ThemeStyleType = { 'height': 36, }, }, + 'Input': { + 'default': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + }, + 'default.disabled': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-300', + }, + }, + 'default.disabled.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'blue-primary', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'blue-primary', + }, + }, + 'default.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'blue-primary', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'blue-primary', + }, + }, + 'default.primary': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + }, + 'default.success': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + }, + 'default.info': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + }, + 'default.warning': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + }, + 'default.error': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + }, + 'default.primary.disabled': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-300', + }, + }, + 'default.primary.disabled.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'blue-primary', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'blue-primary', + }, + }, + 'default.primary.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'blue-primary', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'blue-primary', + }, + }, + 'default.success.disabled': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-300', + }, + }, + 'default.success.disabled.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': '#4CAF50', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#4CAF50', + }, + }, + 'default.success.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': '#4CAF50', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#4CAF50', + }, + }, + 'default.info.disabled': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-300', + }, + }, + 'default.info.disabled.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': '#03A9F4', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#03A9F4', + }, + }, + 'default.info.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': '#03A9F4', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#03A9F4', + }, + }, + 'default.warning.disabled': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-300', + }, + }, + 'default.warning.disabled.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': '#FFC107', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#FFC107', + }, + }, + 'default.warning.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': '#FFC107', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#FFC107', + }, + }, + 'default.error.disabled': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-300', + }, + }, + 'default.error.disabled.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-200', + 'borderColor': '#F44336', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-300', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#F44336', + }, + }, + 'default.error.focused': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': '#F44336', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': '#F44336', + }, + }, + }, 'Layout': { 'default': { 'paddingHorizontal': 16, @@ -10161,6 +10619,136 @@ export const mapping: ThemeMappingType = { }, }, }, + 'Input': { + 'meta': { + 'scope': 'all', + 'mapping': {}, + 'appearances': { + 'default': { + 'default': true, + }, + }, + 'variants': { + 'status': { + 'primary': { + 'default': true, + }, + 'success': { + 'default': false, + }, + 'info': { + 'default': false, + }, + 'warning': { + 'default': false, + }, + 'error': { + 'default': false, + }, + }, + }, + 'states': { + 'disabled': { + 'default': false, + 'priority': 0, + 'scope': 'all', + }, + 'focused': { + 'default': false, + 'priority': 1, + 'scope': 'all', + }, + }, + }, + 'appearance': { + 'default': { + 'mapping': { + 'paddingVertical': 12, + 'paddingHorizontal': 6, + 'minHeight': 48, + 'borderRadius': 6, + 'borderWidth': 2, + 'backgroundColor': 'gray-100', + 'borderColor': 'transparent', + 'text': { + 'marginHorizontal': 6, + 'color': 'gray-400', + }, + 'icon': { + 'maxWidth': 24, + 'maxHeight': 24, + 'marginHorizontal': 6, + 'tintColor': 'gray-400', + }, + 'state': { + 'disabled': { + 'backgroundColor': 'gray-200', + 'text': { + 'color': 'gray-300', + }, + 'icon': { + 'tintColor': 'gray-300', + }, + }, + }, + }, + 'variant': { + 'status': { + 'primary': { + 'state': { + 'focused': { + 'borderColor': 'blue-primary', + 'icon': { + 'tintColor': 'blue-primary', + }, + }, + }, + }, + 'success': { + 'state': { + 'focused': { + 'borderColor': '#4CAF50', + 'icon': { + 'tintColor': '#4CAF50', + }, + }, + }, + }, + 'info': { + 'state': { + 'focused': { + 'borderColor': '#03A9F4', + 'icon': { + 'tintColor': '#03A9F4', + }, + }, + }, + }, + 'warning': { + 'state': { + 'focused': { + 'borderColor': '#FFC107', + 'icon': { + 'tintColor': '#FFC107', + }, + }, + }, + }, + 'error': { + 'state': { + 'focused': { + 'borderColor': '#F44336', + 'icon': { + 'tintColor': '#F44336', + }, + }, + }, + }, + }, + }, + }, + }, + }, 'Layout': { 'meta': { 'scope': 'mobile', diff --git a/packages/mapping/eva/mapping.json b/packages/mapping/eva/mapping.json index f70644c..5a021e3 100644 --- a/packages/mapping/eva/mapping.json +++ b/packages/mapping/eva/mapping.json @@ -657,6 +657,136 @@ } } }, + "Input": { + "meta": { + "scope": "all", + "mapping": {}, + "appearances": { + "default": { + "default": true + } + }, + "variants": { + "status": { + "primary": { + "default": true + }, + "success": { + "default": false + }, + "info": { + "default": false + }, + "warning": { + "default": false + }, + "error": { + "default": false + } + } + }, + "states": { + "disabled": { + "default": false, + "priority": 0, + "scope": "all" + }, + "focused": { + "default": false, + "priority": 1, + "scope": "all" + } + } + }, + "appearance": { + "default": { + "mapping": { + "paddingVertical": 12, + "paddingHorizontal": 6, + "minHeight": 48, + "borderRadius": 6, + "borderWidth": 2, + "backgroundColor": "gray-100", + "borderColor": "transparent", + "text": { + "marginHorizontal": 6, + "color": "gray-400" + }, + "icon": { + "maxWidth": 24, + "maxHeight": 24, + "marginHorizontal": 6, + "tintColor": "gray-400" + }, + "state": { + "disabled": { + "backgroundColor": "gray-200", + "text": { + "color": "gray-300" + }, + "icon": { + "tintColor": "gray-300" + } + } + } + }, + "variant": { + "status": { + "primary": { + "state": { + "focused": { + "borderColor": "blue-primary", + "icon": { + "tintColor": "blue-primary" + } + } + } + }, + "success": { + "state": { + "focused": { + "borderColor": "#4CAF50", + "icon": { + "tintColor": "#4CAF50" + } + } + } + }, + "info": { + "state": { + "focused": { + "borderColor": "#03A9F4", + "icon": { + "tintColor": "#03A9F4" + } + } + } + }, + "warning": { + "state": { + "focused": { + "borderColor": "#FFC107", + "icon": { + "tintColor": "#FFC107" + } + } + } + }, + "error": { + "state": { + "focused": { + "borderColor": "#F44336", + "icon": { + "tintColor": "#F44336" + } + } + } + } + } + } + } + } + }, "Layout": { "meta": { "scope": "mobile", diff --git a/packages/theme/eva/theme.json b/packages/theme/eva/theme.json index b25fbad..3b1ac15 100644 --- a/packages/theme/eva/theme.json +++ b/packages/theme/eva/theme.json @@ -7,5 +7,10 @@ "gray-highlight": "#EDF0F5", "pink-primary": "#FF3D71", "text-primary": "#000000", - "text-primary-inverse": "#ffffff" + "text-primary-inverse": "#ffffff", + + "gray-100": "#f7f8fa", + "gray-200": "#edf0f5", + "gray-300": "#c8cedb", + "gray-400": "#a6aebd" }