@startupjs/docs 0.55.0 → 0.55.1

package/client/app/Layout/Sidebar/Content/index.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import { ScrollView, Image } from 'react-native'
 import { pug, observer } from 'startupjs'
-import { Div, Row, Select } from '@startupjs/ui'
+import { Div, Select } from '@startupjs/ui'
 import { BASE_URL } from '@env'
 import { useLang } from '../../../../clientHelpers'
 import Options from './Options'
@@ -25,7 +25,7 @@ export default observer(function Content ({
       ScrollView
         Image.logo(testID='logo' source={ uri: baseUrl + '/img/docs.png' })
         Docs
-      Row.footer
+      Div.footer(row)
         Select.lang(
           testID='languagesSelect'
           options=LANGUAGES

package/client/app/Layout/index.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 import { pug, emit, observer, useModel, $ } from 'startupjs'
 import { pathFor, useLocation } from 'startupjs/app'
-import { AutoSuggest, Button, Div, Layout, Menu, Row, Span } from '@startupjs/ui'
+import { AutoSuggest, Button, Div, Layout, Menu, Span } from '@startupjs/ui'
 import { MDXProvider } from '@startupjs/mdx'
 import { ScrollableProvider } from '@startupjs/scrollable-anchors'
 import { faBars, faSearch } from '@fortawesome/free-solid-svg-icons'
@@ -77,7 +77,7 @@ const Topbar = observer(function Topbar () {
   }
 
   return pug`
-    Row.topbar
+    Div.topbar(row)
       Button(testID='button' variant='text' icon=faBars onPress=toggleSidebar color='text-description')
       Div.searchWrapper
         Search

package/client/components/Props/Renderer/GridVisualizer/index.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { pug, observer, useModel, useLocal } from 'startupjs'
-import { themed, Div, Span, Row } from '@startupjs/ui'
+import { themed, Div, Span } from '@startupjs/ui'
 import './index.styl'
 
 const GRID_SIZE = 8
@@ -17,16 +17,16 @@ export default observer(function GridVisualizer ({
   style,
   children
 }) {
-  let $componentSize = useModel('_session.Renderer.componentSize')
+  const $componentSize = useModel('_session.Renderer.componentSize')
 
   function onLayout (e) {
-    let { width, height } = e.nativeEvent.layout
+    const { width, height } = e.nativeEvent.layout
     $componentSize.setDiffDeep({ width, height })
   }
 
   // TODO: Bring back width check as an option. For now it's commented out.
   return pug`
-    Row.vertical
+    Div.vertical(row)
       LeftBar(
         allowHalfUnit=allowHalfUnit
         validate=validateHeight
@@ -45,13 +45,13 @@ export default observer(function GridVisualizer ({
 })
 
 const LeftBar = observer(themed(({ allowHalfUnit, validate, theme }) => {
-  let [height = 0] = useLocal('_session.Renderer.componentSize.height')
-  let units = toUnits(height)
-  let valid = validate ? validateGrid(height, allowHalfUnit) : true
+  const [height = 0] = useLocal('_session.Renderer.componentSize.height')
+  const units = toUnits(height)
+  const valid = validate ? validateGrid(height, allowHalfUnit) : true
 
   return pug`
     Div.leftBar
-      Row.leftBarWrapper(style={ width: height })
+      Div.leftBarWrapper(style={ width: height } row)
         Div.leftBarLine(styleName=[theme, { valid }])
         Span.leftBarText(styleName=[theme, { valid }])= units
         Div.leftBarLine(styleName=[theme, { valid }])

package/client/components/Props/Renderer/index.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { pug, observer } from 'startupjs'
-import { themed, Row, Div } from '@startupjs/ui'
+import { themed, Div } from '@startupjs/ui'
 import GridVisualizer from './GridVisualizer'
 
 export default observer(themed(function Renderer ({
@@ -19,12 +19,13 @@ export default observer(themed(function Renderer ({
   style
 }) {
   let Wrapper
-  let extraProps = {}
+  const extraProps = {}
   if (showSizes) {
     Wrapper = GridVisualizer
     extraProps.block = block
   } else {
-    Wrapper = block ? Div : Row
+    Wrapper = Div
+    extraProps.row = !block
   }
 
   return pug`

package/client/components/Props/index.js

@@ -1,6 +1,6 @@
 import React, { useMemo, useState } from 'react'
 import { pug, observer, $root, useComponentId } from 'startupjs'
-import { themed, Button, Row, Div, ScrollView } from '@startupjs/ui'
+import { themed, Button, Div, ScrollView } from '@startupjs/ui'
 import parsePropTypesModule from 'parse-prop-types'
 import Constructor from './Constructor'
 import Renderer from './Renderer'
@@ -41,7 +41,7 @@ function useEntries ({ Component, props, extraParams }) {
 
 function parseEntries (entries) {
   return entries.map(entry => {
-    let meta = entry[1]
+    const meta = entry[1]
     return {
       name: entry[0],
       type: meta.type.name,
@@ -133,7 +133,7 @@ export default observer(themed(function PComponent ({
             showSizes=showSizes
             block=block
           )
-        Row.display(align='right')
+        Div.display(align='right' row)
           Button(
             size='s'
             variant='text'

package/package.json

@@ -4,14 +4,14 @@
     "access": "public"
   },
   "description": "MDX documentation generator",
-  "version": "0.55.0",
+  "version": "0.55.1",
   "type": "module",
   "main": "index.js",
   "dependencies": {
     "@fortawesome/free-solid-svg-icons": "^5.12.0",
-    "@startupjs/mdx": "^0.55.0",
-    "@startupjs/scrollable-anchors": "^0.55.0",
-    "@startupjs/ui": "^0.55.0",
+    "@startupjs/mdx": "^0.55.1",
+    "@startupjs/scrollable-anchors": "^0.55.1",
+    "@startupjs/ui": "^0.55.1",
     "parse-prop-types": "^0.3.0"
   },
   "peerDependencies": {
@@ -19,5 +19,5 @@
     "react-native": "*",
     "startupjs": "*"
   },
-  "gitHead": "96bd7446a242b5c096b03a25a99e8a1fae3bb9a7"
+  "gitHead": "88d13d7c882487c160d0d416b1b04bba28e6298d"
 }