Last active
February 1, 2025 16:00
-
-
Save saugatmaharjan/493ab5eaaf1a29eaba1b3e73119df1c4 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "create": { | |
| "create": "const styles = StyleSheet.create({})" | |
| }, | |
| "Platform_Select": { | |
| "pselect": "...Platform.select({ ios: {}, android: {}})" | |
| }, | |
| "Shadow_Properties": { | |
| "sdw": "...Platform.select({ ios: { ...shadowProperties }, android: { elevation }})," | |
| }, | |
| "View": { | |
| "v": "<View style={{}}></View>" | |
| }, | |
| "Text": { | |
| "te": "<Text style={{}}></Text>" | |
| }, | |
| "View_And_Text": { | |
| "v>te": "<View><Text></Text></View>" | |
| }, | |
| "Image": { | |
| "img": "<Image source={{}} style={{}} />" | |
| }, | |
| "FlatList": { | |
| "fl": "<FlatList data={} renderItem={} />" | |
| }, | |
| "SectionList": { | |
| "sl": "<SectionList data={} renderItem={} />" | |
| }, | |
| "ScrollView": { | |
| "sv": "<ScrollView></ScrollView>" | |
| }, | |
| "TextInput": { | |
| "ti": "<TextInput value={} placeholder='' underlineColorAndroid={false} onChange={} />" | |
| }, | |
| "Modal": { | |
| "mdl": "<Modal visible={} animation='slide'></Modal>" | |
| }, | |
| "TouchableOpacity": { | |
| "to": "<TouchableOpacity style={} onPress={}></TouchableOpacity>" | |
| }, | |
| "TouchableWithoutFeedback": { | |
| "twf": "<TouchableWidthoutFeedback style={} onPress={}></TouchableWidthoutFeedback>" | |
| }, | |
| "TouchableHighlight": { | |
| "th": "<TouchableHighlight style={{}} onPress={}></TouchableHighlight>" | |
| }, | |
| "TouchableWithNativeFeedback": { | |
| "twnf": "<TouchableWithNativeFeedback style={} onPress={}></TouchableWithNativeFeedback>" | |
| }, | |
| "ActivityIndicator": { | |
| "actind": "<ActivityIndicator color='#00ff00' />" | |
| }, | |
| "Button": { | |
| "btn": "<Button color='#00ff00' title='button' onPress={} />" | |
| }, | |
| "Position": { | |
| "pos": "position: 'absolute'," | |
| }, | |
| "Position_Absolute": { | |
| "pos:a": "position: 'absolute'," | |
| }, | |
| "Position_Relative": { | |
| "pos:r": "position: 'relative'," | |
| }, | |
| "Top": { | |
| "t": "top: 0," | |
| }, | |
| "Top_Auto": { | |
| "t:a": "top: 'auto'," | |
| }, | |
| "Right": { | |
| "r": "right: 0," | |
| }, | |
| "Right_Auto": { | |
| "r:a": "right: 'auto'," | |
| }, | |
| "Bottom": { | |
| "b": "bottom: 0," | |
| }, | |
| "Bottom_Auto": { | |
| "b:a": "bottom: 'auto'," | |
| }, | |
| "Left": { | |
| "l": "left: 0," | |
| }, | |
| "Left_Auto": { | |
| "l:a": "left: 'auto'," | |
| }, | |
| "ZIndex": { | |
| "z": "zIndex: 2," | |
| }, | |
| "Overflow": { | |
| "ov": "overflow: 'hidden'," | |
| }, | |
| "Overflow_Visible": { | |
| "ov:v": "overflow: 'visible'," | |
| }, | |
| "Oveflow_Hidden": { | |
| "ov:h": "overflow: 'hidden'," | |
| }, | |
| "Margin": { | |
| "m": "margin: 4," | |
| }, | |
| "Margin_Auto": { | |
| "m:a": "margin: 'auto'," | |
| }, | |
| "Margin_Top": { | |
| "mt": "marginTop: 4," | |
| }, | |
| "Margin_Top_Auto": { | |
| "mt:a": "marginTop: 'auto'," | |
| }, | |
| "Margin_Right": { | |
| "mr": "marginRight: 4," | |
| }, | |
| "Margin_Right_Auto": { | |
| "mr:a": "marginRight: 'auto'," | |
| }, | |
| "Margin_Bottom": { | |
| "mb": "marginBottom: 4," | |
| }, | |
| "Margin_Bottom_Auto": { | |
| "mb:a": "marginBottom: 'auto'," | |
| }, | |
| "Margin_Left": { | |
| "ml": "marginLeft: 4," | |
| }, | |
| "Margin_Left_Auto": { | |
| "ml:a": "marginLeft: 'auto'," | |
| }, | |
| "Padding": { | |
| "p": "padding: 4," | |
| }, | |
| "Padding_Top": { | |
| "pt": "paddingTop: 4," | |
| }, | |
| "Padding_Right": { | |
| "pr": "paddingRight: 4," | |
| }, | |
| "Padding_Bottom": { | |
| "pb": "paddingBottom: 4," | |
| }, | |
| "Padding_Left": { | |
| "pl": "paddingLeft: 4," | |
| }, | |
| "Width": { | |
| "w": "width: 120," | |
| }, | |
| "Width_Auto": { | |
| "w:a": "width: 'auto'," | |
| }, | |
| "Height": { | |
| "h": "height: 120," | |
| }, | |
| "Height_Auto": { | |
| "h:a": "height: 'auto'," | |
| }, | |
| "Max_Width": { | |
| "maxw": "maxWidth: 120," | |
| }, | |
| "Max_Height": { | |
| "maxh": "maxHeight: 120," | |
| }, | |
| "Min_Width": { | |
| "minw": "minWidth: 120," | |
| }, | |
| "Min_Height": { | |
| "minh": "minHeight: 120," | |
| }, | |
| "Border_Colors": { | |
| "bc": "borderColor: #000," | |
| }, | |
| "Border_Color_Transparent": { | |
| "bc:t": "borderColor: 'transparent'," | |
| }, | |
| "Border_Width": { | |
| "bw": "borderWidth: 1," | |
| }, | |
| "Border_Top_Width": { | |
| "btw": "borderTopWidth: 1," | |
| }, | |
| "Border_Right_Width": { | |
| "brw": "borderRightWidth: 1," | |
| }, | |
| "Border_Bottom_Width": { | |
| "bbw": "borderBottomWidth: 1," | |
| }, | |
| "Border_Left_Width": { | |
| "blw": "borderLeftWidth: 1," | |
| }, | |
| "Border_Top_Color": { | |
| "btc": "borderTopColor: '#000'," | |
| }, | |
| "Border_Top_Color_Transparent": { | |
| "btc:t": "borderTopColor: 'transparent'," | |
| }, | |
| "Border_Right_Color": { | |
| "brc": "borderRightColor: '#000'," | |
| }, | |
| "Border_Right_Color_Transparent": { | |
| "brc:t": "borderRightColor: 'transparent'," | |
| }, | |
| "Border_Bottom_Color": { | |
| "prefix": "bbc", | |
| "bbc": "borderBottomColor: '#000'," | |
| }, | |
| "Border_Bottom_Color_Transparent": { | |
| "bbc:t": "borderBottomColor: 'transparent'," | |
| }, | |
| "Border_Left_Color": { | |
| "blc": "borderLeftColor: '#000'," | |
| }, | |
| "Border_Left_Color_Transparent": { | |
| "blc:t": "borderLeftColor: 'transparent'," | |
| }, | |
| "Border_Radius": { | |
| "br": "borderRadius: 4," | |
| }, | |
| "Background_Color": { | |
| "bgc": "backgroundColor: '#fff'," | |
| }, | |
| "BackgroundColor_Transparent": { | |
| "bgc:t": "backgroundColor: 'transparent'," | |
| }, | |
| "Color": { | |
| "c": "color: '#333'," | |
| }, | |
| "Color_RGB": { | |
| "c:r": "color: 'rgb(0, 0, 0)'," | |
| }, | |
| "Color_RGBA": { | |
| "c:ra": "color: 'rgba(0, 0, 0, 0.5)'," | |
| }, | |
| "Text_Align": { | |
| "ta": "textAlign: 'center'," | |
| }, | |
| "Text_Align_Left": { | |
| "ta:l": "textAlign: 'left'," | |
| }, | |
| "Text_Align_Center": { | |
| "ta:c": "textAlign: 'center'," | |
| }, | |
| "Text_Align_Right": { | |
| "ta:r": "textAlign: 'right'," | |
| }, | |
| "Text_Align_Right_Justify": { | |
| "ta:j": "textAlign: 'justify'," | |
| }, | |
| "Text_Decoration": { | |
| "td": "textDecoration: 'underline'," | |
| }, | |
| "Transform_Scale": { | |
| "t:s": "transform: { scale: 1.2 }" | |
| }, | |
| "Transform_Scale_X": { | |
| "t:sx": "transform: { scaleX: 1.2 }" | |
| }, | |
| "Transform_Scale_Y": { | |
| "t:sy": "transform: { scaleY: 1.2 }" | |
| }, | |
| "Transform_Rotate": { | |
| "t:r": "transform: { rotate: '90deg' }" | |
| }, | |
| "Transform_Rotate_X": { | |
| "t:rx": "transform: { rotateX: '90deg' }" | |
| }, | |
| "Transform_Rotate_Y": { | |
| "t:ry": "transform: { rotateY: '90deg' }" | |
| }, | |
| "Transform_Rotate_Z": { | |
| "t:rz": "transform: { rotateZ: '90deg' }" | |
| }, | |
| "Transform_Translate_X": { | |
| "t:tx": "transform: { translateX: x }" | |
| }, | |
| "Transform_Translate_Y": { | |
| "t:ty": "transform: { translateY: y }" | |
| }, | |
| "Line_Height": { | |
| "lh": "lineHeight: 24," | |
| }, | |
| "Letter_Spacing": { | |
| "ls": "letterSpacing: 1," | |
| }, | |
| "Font_Weight": { | |
| "fw": "fontWeight: 600," | |
| }, | |
| "Font_Weight_Bold": { | |
| "fw:b": "fontWeight: 'bold'," | |
| }, | |
| "Font_Style": { | |
| "fst": "fontStyle: 'italic'," | |
| }, | |
| "Font_Style_Italic": { | |
| "fst:i": "fontStyle: 'italic'," | |
| }, | |
| "Font_Size": { | |
| "fs": "fontSize: 14," | |
| }, | |
| "Font_Family": { | |
| "ff": "fontFamily: 'Roboto'}," | |
| }, | |
| "Opacity": { | |
| "prefix": "o", | |
| "o": "opacity: 0.5," | |
| }, | |
| "Flex_Direction": { | |
| "fd": "flexDirection: 'row'," | |
| }, | |
| "Flex_Direction_Row": { | |
| "fd:r": "flexDirection: 'row'," | |
| }, | |
| "Flex_Direction_Row_Reverse": { | |
| "fd:rr": "flexDirection: 'row-reverse'," | |
| }, | |
| "Flex_Direction_Column": { | |
| "fd:c": "flexDirection: 'column'," | |
| }, | |
| "Flex_Direction_Column_Reverse": { | |
| "fd:cr": "flexDirection: 'column-reverse'," | |
| }, | |
| "Flex_Wrap": { | |
| "fwrap": "flexWrap: 'wrap'," | |
| }, | |
| "Flex_Wrap_Nowrap": { | |
| "fwrap:n": "flexWrap: 'nowrap'," | |
| }, | |
| "Flex_Wrap_Wrap": { | |
| "fwrap:w": "flexWrap: 'wrap'," | |
| }, | |
| "Justify_Content": { | |
| "jc": "justifyContent: 'center'," | |
| }, | |
| "Justify_Content_Flex_Start": { | |
| "jc:fs": "justifyContent: 'flex-start'," | |
| }, | |
| "Justify_Content_Flex_End": { | |
| "jc:fe": "justifyContent: 'flex-end'," | |
| }, | |
| "Justify_Content_Flex_Center": { | |
| "jc:c": "justifyContent: 'center'," | |
| }, | |
| "Justify_Content_Flex_Space_Evenly": { | |
| "jc:se": "justifyContent: 'center'," | |
| }, | |
| "Justify_Content_Flex_Space_Between": { | |
| "jc:sb": "justifyContent: 'space-between'," | |
| }, | |
| "Justify_Content_Flex_Space_Arround": { | |
| "jc:sa": "justifyContent: 'space-around'," | |
| }, | |
| "Aligin_Items": { | |
| "ai": "alignItems: 'center" | |
| }, | |
| "Align_Items_Flex_Start": { | |
| "ai:fs": "alignItems: 'flex-start'," | |
| }, | |
| "Align_Items_Flex_End": { | |
| "ai:fe": "alignItems: 'flex-end'," | |
| }, | |
| "Align_Items_Center": { | |
| "ai:c": "alignItems: 'center'," | |
| }, | |
| "Align_Items_Stretch": { | |
| "ai:s": "alignItems: 'stretch'," | |
| }, | |
| "Flex": { | |
| "f": "flex: 1," | |
| }, | |
| "Align_Self": { | |
| "as": "alignSelf: 'center'," | |
| }, | |
| "Margin_Horizontal": { | |
| "mh": "marginHorizontal: 16," | |
| }, | |
| "Margin_Vertical": { | |
| "mv": "marginVertical: 16," | |
| }, | |
| "Backface_Visibility": { | |
| "bfv:v": "backfaceVisibility: 'visible'," | |
| }, | |
| "Border_Bottom_Left_Radius": { | |
| "bblr": "borderBottomLeftRadius: 4," | |
| }, | |
| "Border_Bottom_Right_Radius": { | |
| "bbrr": "borderBottomRightRadius: 4," | |
| }, | |
| "Border_Top_Left_Radius": { | |
| "btlr": "borderTopLeftRadius: 4," | |
| }, | |
| "Border_Top_Right_Radius": { | |
| "btrr": "borderTopRightRadius: 4," | |
| }, | |
| "Resize_Mode": { | |
| "prefix": "rm", | |
| "rm": "resizeMode: 'cover'," | |
| }, | |
| "Overlay_Color": { | |
| "ovclr": "overlayColor: '#fff'," | |
| }, | |
| "Border_Style": { | |
| "bs": "borderStyle: 'dashed'," | |
| }, | |
| "Elevation": { | |
| "elv": "elevation: 4" | |
| }, | |
| "Text_Shadow_Color": { | |
| "tsc": "textShadowColor: '#000'," | |
| }, | |
| "Text_Shadow_Offset": { | |
| "tso": "textShadowOffset: { width: 0, height: 4 }," | |
| }, | |
| "Text_Shadow_Radius": { | |
| "prefix": "tsr", | |
| "tsr": "textShadowRadius: 2," | |
| }, | |
| "Text_Align_Vertical": { | |
| "tav": "textAlignVertical: 'center'," | |
| } | |
| } |
The best feature would be to create View component starting with "." (dot) as html emmet does.
You just type name of the style and it creates View with the style name you type. And would be fabulous if it will create empty style for the created View.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Yeah. Maybe add v! or !v for this