Docs - Added versioning with the latest docs in production (#3466)

* added versioning to docs where the new version has the latests changes we did in master

* removed docs folder from docuilib

* Renamed version from 7.34.0 to 7.0.0

docuilib/versioned_docs/version-7.0.0/components/basic/Tests.md

@@ -0,0 +1,9 @@
+---
+id: Tests
+title: Tests
+sidebar_label: Tests
+---
+
+import ComponentPage from '@site/src/components/ComponentPage';
+
+<ComponentPage component={{"name":"Tests","category":"basic","description":"This is just a tests page for the new docs component page","extends":["Text","View"],"extendsLink":["https://reactnative.dev/docs/text","https://reactnative.dev/docs/view"],"modifiers":["margins","color","typography"],"example":"https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/TextScreen.tsx","images":["https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Text/Modifiers.png?raw=true","https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Text/Highlights.png?raw=true","https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Text/Transformation.png?raw=true"],"props":[{"name":"color","type":"string","description":"Color of the text","default":"Black","required":"true","platform":"iOS","note":"This is an important information"},{"name":"center","type":"boolean","description":"Whether to center the text (using textAlign)"},{"name":"uppercase","type":"boolean","description":"Whether to change the text to uppercase"},{"name":"underline","type":"boolean","description":"Whether to add an underline"},{"name":"highlightString","type":"HighlightString | HighlightString[]","description":"Substring to highlight. Can be a simple string or a HighlightStringProps object, or an array of the above"},{"name":"highlightStyle","type":"TextStyle","description":"Custom highlight style for highlight string"},{"name":"recorderTag","type":"'mask' | 'unmask'","description":"Recorder Tag"},{"name":"animated","type":"boolean","description":"Use Animated.Text as a container"}],"snippet":["<Text text30$1>Text goes here$2</Text>"],"docs":{"hero":{"description":"A wrapper for Text component with extra functionality like modifiers support","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]},"tabs":[{"title":"Overview","sections":[{"type":"table","title":"Table","description":"Examples of using the Text component","name":"Table Name","columns":["Item","Content[0]","Content[1]"],"items":[{"title":"Item #1","description":"Item #1 Subtitle","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"},{"height":170,"value":"https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FKrv1pLl7kq2L52vMRwd498%2FMADS-Guidelines%3Fnode-id%3D22898-858566%26t%3D1FnW55XGiZ6Bc9Cr-1"}]},{"title":"Item #2","description":"Item #2 Subtitle","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]},{"title":"Item #3","description":"Item #3 Subtitle","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"},{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]}]},{"type":"table","title":"","description":"","columns":["Item","Content[0]","Content[1]"],"items":[{"title":"Item #1","description":"Item #1 Subtitle","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"},{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]},{"title":"Item #2","description":"Item #2 Subtitle","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]}]}]},{"title":"Guidelines","sections":[{"type":"section","title":"Section","description":"Examples of using the Text component","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-veryWide.png?raw=true"}]},{"type":"section","layout":"horizontal","title":"Horizontal Section","description":"Examples of using the Text component","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"},{"value":"https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FKrv1pLl7kq2L52vMRwd498%2FMADS-Guidelines%3Fnode-id%3D22898-858566%26t%3D1FnW55XGiZ6Bc9Cr-1"}]},{"type":"list","title":"List","description":"Examples of using the Text component","items":[{"title":"Item #1","description":"This is item #1","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-veryWide.png?raw=true"}]},{"title":"Item #2","description":"This is item #2","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-veryWide.png?raw=true"}]}]},{"type":"list","layout":"horizontal","title":"List Horizontal Items","description":"Examples of using the Text component","items":[{"title":"Item #1","description":"This is item #1","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]},{"title":"Item #2","description":"This is item #2","content":[{"value":"https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Docs/thumbnail-horizontal.png?raw=true"}]}]},{"type":"section","title":"Markdown support","description":"markdown:##Title\n\nThis is a markdown content\n\n With a list:\n- item 1\n- item 2"},{"type":"section","title":"HTML support","description":"html:<h2>Title</h2><p>This is a html content</p><ul><li>item 1</li><li>item 2</li></ul>"}]},{"title":"Code","sections":[{"title":"Usage","type":"usage"},{"type":"info"},{"type":"tip"},{"type":"banner","title":"NOTE","description":"This is an interesting information"},{"type":"banner","title":"Banner","description":"This is some massage to the user","color":"pink","icon":""},{"type":"props","title":"API","description":"This is the list of additional props for the Text component"}]}]}}}/>

docuilib/versioned_docs/version-7.0.0/components/basic/Text.md

@@ -0,0 +1,60 @@
+---
+id: Text
+title: Text
+sidebar_label: Text
+---
+
+A wrapper for Text component with extra functionality like modifiers support  
+[(code example)](https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/TextScreen.tsx)
+:::info
+This component extends **[Text](https://reactnative.dev/docs/text)** props.
+:::
+:::tip
+This component support **margins, color, typography** modifiers.
+:::
+<div style={{display: 'flex', flexDirection: 'row', overflowX: 'auto', maxHeight: '500px', alignItems: 'center'}}><img style={{maxHeight: '420px'}} src={'https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Text/Modifiers.png?raw=true'}/>
+
+<img style={{maxHeight: '420px'}} src={'https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Text/Highlights.png?raw=true'}/>
+
+<img style={{maxHeight: '420px'}} src={'https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Text/Transformation.png?raw=true'}/>
+
+</div>
+
+### Usage
+``` jsx live
+<Text text30>Text goes here</Text>
+```
+## API
+### animated
+Use Animated.Text as a container
+`boolean ` 
+
+### center
+Whether to center the text (using textAlign)
+`boolean ` 
+
+### color
+Color of the text
+`string ` 
+
+### highlightString
+Substring to highlight. Can be a simple string or a HighlightStringProps object, or an array of the above
+`HighlightString | HighlightString[] ` 
+
+### highlightStyle
+Custom highlight style for highlight string
+`TextStyle ` 
+
+### recorderTag
+Recorder Tag
+`'mask' | 'unmask' ` 
+
+### underline
+Whether to add an underline
+`boolean ` 
+
+### uppercase
+Whether to change the text to uppercase
+`boolean ` 
+
+

docuilib/versioned_docs/version-7.0.0/components/basic/TouchableOpacity.md

@@ -0,0 +1,60 @@
+---
+id: TouchableOpacity
+title: TouchableOpacity
+sidebar_label: TouchableOpacity
+---
+
+A wrapper for TouchableOpacity component. Support onPress, throttling and activeBackgroundColor  
+[(code example)](https://github.com/wix/react-native-ui-lib/blob/master/src/components/touchableOpacity/index.tsx)
+:::info
+This component extends **[TouchableOpacity](https://reactnative.dev/docs/touchableopacity)** props.
+:::
+:::tip
+This component support **margins, paddings, alignments, background, borderRadius** modifiers.
+:::
+<div style={{display: 'flex', flexDirection: 'row', overflowX: 'auto', maxHeight: '500px', alignItems: 'center'}}><img style={{maxHeight: '420px'}} src={'https://media.giphy.com/media/xULW8AMIgw7l31zjm8/giphy.gif'}/>
+
+</div>
+
+### Usage
+``` jsx live
+<TouchableOpacity onPress={() => console.log('pressed')}><Text text40>Click Me!</Text></TouchableOpacity>
+```
+## API
+### activeBackgroundColor
+Apply background color on TouchableOpacity when active (press is on)
+`string ` 
+
+### backgroundColor
+Background color for TouchableOpacity
+`string ` 
+
+### customValue
+Custom value of any type to pass on to TouchableOpacity and receive back in onPress callback
+`any ` 
+
+### onPress
+On press callback
+`(props?: TouchableOpacityProps & {event: GestureResponderEvent} | any) => void ` 
+
+### recorderTag
+Recorder Tag
+`'mask' | 'unmask' ` 
+
+### style
+Custom style
+`ViewStyle ` 
+
+### throttleOptions
+Throttle options
+`ThrottleOptions ` 
+
+### throttleTime
+Throttle time in MS for onPress callback
+`number ` 
+
+### useNative
+Should use an enhanced native implementation with extra features
+`boolean ` 
+
+

docuilib/versioned_docs/version-7.0.0/components/basic/View.md

@@ -0,0 +1,61 @@
+---
+id: View
+title: View
+sidebar_label: View
+---
+
+An enhanced View component  
+[(code example)](https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ViewScreen.js)
+:::info
+This component extends **[View](https://reactnative.dev/docs/view)** props.
+:::
+:::tip
+This component support **margins, paddings, alignments, background, borderRadius** modifiers.
+:::
+<div style={{display: 'flex', flexDirection: 'row', overflowX: 'auto', maxHeight: '500px', alignItems: 'center'}}></div>
+
+### Usage
+``` jsx live
+<View row gap-s5 centerV>
+  <View style={{width: 200, height: 200}} bg-purple40 centerH>
+  <View style={{width: 60, height: 60}} bg-green20/>
+  </View>
+  <View style={{width: 150, height: 150}} bg-orange30 bottom right>
+  <View style={{width: 50, height: 50}} bg-yellow40 br100 margin-s2/>
+  </View>
+</View>
+```
+## API
+### animated
+Use Animate.View as a container
+`boolean ` 
+
+### backgroundColor
+Set background color
+`string ` 
+
+### inaccessible
+Turn off accessibility for this view and its nested children
+`boolean ` 
+
+### reanimated
+Use Animate.View (from react-native-reanimated) as a container
+`boolean ` 
+
+### recorderTag
+Recorder Tag
+`'mask' | 'unmask' ` 
+
+### renderDelay
+Experimental: Pass time in ms to delay render
+`number ` 
+
+### style
+Custom style
+`ViewStyle ` 
+
+### useSafeArea
+If true, will render as SafeAreaView
+`boolean ` 
+
+

docuilib/versioned_docs/version-7.0.0/components/controls/ActionBar.md

@@ -0,0 +1,60 @@
+---
+id: ActionBar
+title: ActionBar
+sidebar_label: ActionBar
+---
+
+Quick actions bar, each action support Button component props  
+[(code example)](https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ActionBarScreen.tsx)
+:::info
+This component extends **[View](/docs/components/basic/View)** props.
+:::
+:::tip
+This component support **margin, padding** modifiers.
+:::
+<div style={{display: 'flex', flexDirection: 'row', overflowX: 'auto', maxHeight: '500px', alignItems: 'center'}}><img style={{maxHeight: '420px'}} src={'https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/ActionBar/ActionBar.gif?raw=true'}/>
+
+</div>
+
+### Usage
+``` jsx live
+<View marginT-40>
+  <ActionBar
+    actions={[
+      {label: 'Delete', onPress: () => console.log('delete')},
+      {label: 'Replace Photo', onPress: () => console.log('replace photo')},
+      {label: 'Edit', onPress: () => console.log('edit')}
+    ]}
+  />
+</View>
+```
+## API
+### actions
+The actions for the action bar
+`ButtonProps[] ` 
+
+### backgroundColor
+Background color
+`string ` 
+
+### centered
+Should action be equally centered
+`boolean ` 
+
+### height
+Height
+`number ` 
+
+### keepRelative
+Keep the action bar position relative instead of it absolute position
+`boolean ` 
+
+### style
+Component's style
+`ViewStyle ` 
+
+### useSafeArea
+In iOS, use safe area, in case component attached to the bottom
+`boolean ` 
+
+