Skip to content
Permalink
Browse files

Squashed commit of the following:

commit aa64f1bffe370223989359daf53357aa9c4d3f0a
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Sat Apr 6 11:34:37 2019 +0100

    chore: bring isSelected back to being a regular scope so we can merge the other changes from her euntil we work it out properly

commit 06dc5333b9eb51ce536f43117a7b0a383e9102ed
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Sat Apr 6 11:32:38 2019 +0100

    chore: add isSelected to checkParentStem

commit 661310972c1b2a0756d4bde822e2e5e447d037b5
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Sat Apr 6 09:08:23 2019 +0100

    chore: remove e2e as a target

commit 54c74904c787f83d64c933a8842d8c5097d6b77b
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Sat Apr 6 08:42:24 2019 +0100

    fix: ActionSelected test to have a Vertical at the top

commit fac1eb2fa8386157bac28d3ff0957b780b5dd0cf
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Sat Apr 6 08:37:04 2019 +0100

    chore: remove unused children map from previous proxy

commit 8c7dcc1e4d755c59d5b36586a3ad90f4f33756f0
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Fri Apr 5 19:39:34 2019 +0100

    chore: normalise variable declarations

commit b511e2791c01144b5d3e1290305482e636e551b6
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Fri Apr 5 19:30:50 2019 +0100

    fix: remove print we'll enable media queries later

commit ddde2068678f78f7d8ac4b7e35e7324ec92e690c
Author: Darío Javier Cravero <dario@uxtemple.com>
Date:   Fri Apr 5 19:28:54 2019 +0100

    wip: add tests and some recognise isSelected as a system scope (even though it doesn't work yet)
  • Loading branch information...
dariocravero committed Apr 6, 2019
1 parent 241f517 commit ef20ae17e202387db49c6fd5a2733423dc4c9274
Showing with 1,776 additions and 3,197 deletions.
  1. +1,036 −2,377 __tests__/__snapshots__/react.js.snap
  2. +2 −1 __tests__/react.js
  3. +61 −0 __tests__/views/ActionSelected.view
  4. +2 −0 __tests__/views/Proxy.view
  5. +7 −7 clean.js
  6. +11 −12 cli.js
  7. +3 −3 ensure-base-css.js
  8. +10 −10 ensure-local-container.js
  9. +3 −3 ensure-track-context.js
  10. +4 −4 get-view-not-found.js
  11. +6 −6 index.js
  12. +0 −21 morph/e2e.js
  13. +0 −57 morph/e2e/block.js
  14. +0 −9 morph/e2e/to-file.js
  15. +7 −7 morph/fonts.js
  16. +25 −25 morph/get-unit.js
  17. +7 −7 morph/inline-svg.js
  18. +2 −2 morph/inline-svg.test.js
  19. +6 −6 morph/react-dom.js
  20. +2 −2 morph/react-dom/block-go-to.js
  21. +2 −2 morph/react-dom/block.js
  22. +2 −2 morph/react-dom/get-block-name.js
  23. +25 −25 morph/react-dom/get-style-for-property.js
  24. +21 −21 morph/react-dom/get-style-value-unit-for-number.js
  25. +5 −5 morph/react-dom/get-value-for-property.js
  26. +4 −1 morph/react-dom/is-valid-property-for-block.js
  27. +1 −1 morph/react-dom/morph-font.js
  28. +4 −4 morph/react-dom/properties-class-name.js
  29. +1 −1 morph/react-dom/properties-image.js
  30. +36 −43 morph/react-dom/properties-style.js
  31. +8 −2 morph/react-dom/safe.js
  32. +5 −5 morph/react-native.js
  33. +4 −4 morph/react-native/block-background-image.js
  34. +1 −1 morph/react-native/block-svg.js
  35. +10 −10 morph/react-native/block-wrap.js
  36. +2 −2 morph/react-native/block.js
  37. +10 −10 morph/react-native/get-block-name.js
  38. +21 −21 morph/react-native/get-style-for-property.js
  39. +5 −5 morph/react-native/get-value-for-property.js
  40. +4 −1 morph/react-native/is-valid-property-for-block.js
  41. +1 −1 morph/react-native/morph-fonts.js
  42. +3 −3 morph/react-native/properties-style.js
  43. +3 −19 morph/react/block-add-test-id-prop.js
  44. +13 −13 morph/react/block-column.js
  45. +1 −1 morph/react/block-name-handle-table.js
  46. +1 −1 morph/react/block-off-when.js
  47. +1 −1 morph/react/block-route.js
  48. +1 −1 morph/react/block-set-test-id.js
  49. +2 −2 morph/react/block-teleport.js
  50. +6 −12 morph/react/get-body.js
  51. +2 −2 morph/react/get-default-props.js
  52. +13 −13 morph/react/get-dependencies.js
  53. +1 −1 morph/react/get-flatlist.js
  54. +7 −8 morph/react/get-formatters.js
  55. +1 −1 morph/react/get-locals.js
  56. +5 −5 morph/react/properties-style.js
  57. +1 −1 morph/react/property-format.js
  58. +1 −1 morph/react/property-rest.js
  59. +3 −3 morph/react/property-style.js
  60. +3 −3 morph/react/property-text.js
  61. +109 −142 morph/utils.js
  62. +0 −2 morphers.js
  63. +2 −2 parse/__snapshots__/index.test.js.snap
  64. +4 −3 parse/get-tags.js
  65. +78 −73 parse/helpers.js
  66. +43 −49 parse/index.js
  67. +2 −2 parse/index.test.js
  68. +4 −4 parse/prop-is-style.js
  69. +100 −103 watch.js

Large diffs are not rendered by default.

@@ -12,7 +12,7 @@ let getFont = font =>
}`

let localSupported = ['en', 'es', 'fr']
let targets = ['react-dom', 'react-native', 'e2e']
let targets = ['react-dom', 'react-native']

targets.forEach(as => {
global.describe(as, () => {
@@ -43,6 +43,7 @@ targets.forEach(as => {
localSupported,
name,
pretty: true,
track: false,
views,
})
).toMatchSnapshot()
@@ -0,0 +1,61 @@
# each when <isSelected is coupled with their onClick
ActionSelectedWrapper Vertical
ActionSelectedFixedId Vertical
backgroundColor red
onClick <
onClickId some-fixed-id
onClickSelected <
when <isSelected
backgroundColor blue
Text
text test
when <isSelected
text another
ActionSelectedDynamicID Vertical
backgroundColor red
onClick <onClick2
onClickId <onClick2
onClickSelected <onClickSelected2
when <isSelected
backgroundColor blue
Text
text hey
when <isSelected
text ho
ActionSelectedRadio Vertical
backgroundColor red
onClick <onClick2
onClickId <onClick2
onClickSelected <onClickSelected2
# radio is the default
onClickSelectedType radio
when <isSelected
backgroundColor blue
Text
text hey
when <isSelected
text ho
ActionSelectedCheckbox Vertical
backgroundColor red
onClick <onClick3
onClickId <onClick3
onClickSelected <onClickSelected3
onClickSelectedType checkbox
when <isSelected
backgroundColor blue
Text
text hey
when <isSelected
text ho
ActionSelectedDynamicType Vertical
backgroundColor red
onClick <onClick4
onClickId <onClick4
onClickSelected <onClickSelected4
onClickSelectedType < radio
when <isSelected
backgroundColor blue
Text
text hey
when <isSelected
text ho
@@ -2,6 +2,8 @@ Button Vertical
alignItems center
backgroundColor #f2f2f2
onClick <
onClickId one
onClickSelected <
paddingBottom 8
paddingLeft 12
paddingRight 12
@@ -1,26 +1,26 @@
const glob = require('fast-glob')
const fs = require('fs')
const path = require('path')
let glob = require('fast-glob')
let fs = require('fs')
let path = require('path')

module.exports = async src => {
const options = {
let options = {
bashNative: ['linux'],
cwd: src,
ignore: ['*node_modules*'],
// filter: f => !/node_modules/.test(f),
}

const created = await glob(
let created = await glob(
['**/*.view', '**/*.view.logic.js', '**/*.view.tests'],
options
)

const morphed = await glob(
let morphed = await glob(
['**/*.view.css', '**/*.view.js', '**/*.view.tests.js'],
options
)

const toRemove = morphed.filter(
let toRemove = morphed.filter(
m => !created.includes(m.replace(/\.(js|css)$/, ''))
)

23 cli.js
@@ -1,10 +1,10 @@
#!/usr/bin/env node

const { readFileSync, statSync } = require('fs')
const { morph, parse, pathToName } = require('./lib.js')
const chalk = require('chalk')
const watch = require('./watch.js')
const morphInlineSvg = require('./morph/inline-svg.js')
let { readFileSync, statSync } = require('fs')
let { morph, parse, pathToName } = require('./lib.js')
let chalk = require('chalk')
let watch = require('./watch.js')
let morphInlineSvg = require('./morph/inline-svg.js')

let {
_,
@@ -49,7 +49,6 @@ if (help) {
--as target platform
react-dom (default)
react-native
e2e
--compile if true, produces ES5 JS, defaults to false
--bundleBaseCss if true, it will bundle the base CSS in react-dom,
@@ -70,12 +69,12 @@ if (help) {
}

if (version) {
const pkg = require('./package.json')
let pkg = require('./package.json')
console.log(`v${pkg.version}`)
process.exit()
}

const input = Array.isArray(_) && _[0]
let input = Array.isArray(_) && _[0]
if (!input) {
console.error(
'You need to specify an input file. Eg run views-morph some.view'
@@ -91,8 +90,8 @@ if (shouldWatch) {
process.exit()
}

const updateNotifier = require('update-notifier')
const pkg = require('./package.json')
let updateNotifier = require('update-notifier')
let pkg = require('./package.json')

updateNotifier({ pkg }).notify()

@@ -142,9 +141,9 @@ if (shouldWatch) {
if (input.includes('.svg')) {
return morphInlineSvg(input).then(code => console.log(code))
} else {
const name = pathToName(input)
let name = pathToName(input)

const { code } = morph({
let { code } = morph({
as,
compile,
file: { raw: input, relative: input },
@@ -1,6 +1,6 @@
const fs = require('mz/fs')
let fs = require('mz/fs')

const CSS = `* {
let CSS = `* {
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
@@ -60,7 +60,7 @@ body,
}
`

const BASE_CSS = `import { injectGlobal } from 'emotion'
let BASE_CSS = `import { injectGlobal } from 'emotion'
injectGlobal(\`${CSS}\`)`

module.exports = async file => {
@@ -1,10 +1,10 @@
const fs = require('mz/fs')
let fs = require('mz/fs')

const GET_INITIAL_LANGUAGE = {
let GET_INITIAL_LANGUAGE = {
'react-dom': `export default supported => closest(navigator.language || navigator.browserLanguage, supported)
const base = item => item.substr(0, 2);
const closest = (value, list) =>
let base = item => item.substr(0, 2);
let closest = (value, list) =>
value
? list.find(item => item === value) ||
list.find(item => base(item) === value) ||
@@ -19,24 +19,24 @@ list.find(item => base(item) === value) ||
export default async supported => closest(await Util.getCurrentLocaleAsync(), supported)
const base = item => item.substr(0, 2);
const closest = (value, list) =>
let base = item => item.substr(0, 2);
let closest = (value, list) =>
value
? list.find(item => item === value) ||
list.find(item => base(item) === value) ||
closest(value.length > 2 ? base(value) : null, list)
: list[0];`,
}

const LOCAL_CONTAINER = {
let LOCAL_CONTAINER = {
'react-dom': supported => `import { Container } from 'unstated';
import getInitialLanguage from './get-initial-language.js';
export default class LocalContainer extends Container {
constructor() {
super()
const supported = ${JSON.stringify(supported).replace(/"/g, "'")}
let supported = ${JSON.stringify(supported).replace(/"/g, "'")}
this.state = {
lang: getInitialLanguage(supported),
@@ -57,7 +57,7 @@ export default class LocalContainer extends Container {
constructor() {
super()
const supported = ${JSON.stringify(supported).replace(/"/g, "'")}
let supported = ${JSON.stringify(supported).replace(/"/g, "'")}
this.state = {
lang: supported[0],
@@ -76,7 +76,7 @@ export default class LocalContainer extends Container {
}

module.exports = async ({ as, file, fileGetInitialLanguage, supported }) => {
if (!await fs.exists(fileGetInitialLanguage)) {
if (!(await fs.exists(fileGetInitialLanguage))) {
await fs.writeFile(fileGetInitialLanguage, GET_INITIAL_LANGUAGE[as], {
encoding: 'utf8',
})
@@ -1,8 +1,8 @@
const fs = require('mz/fs')
let fs = require('mz/fs')

const TRACK_CONTEXT = `import React from 'react'
let TRACK_CONTEXT = `import React from 'react'
export const TrackContext = React.createContext()
export let TrackContext = React.createContext()
export class Track extends React.Component {
track = ({ block, action, event }) => {
@@ -1,8 +1,8 @@
const reactDom = (name, warning) =>
`const ${name} = () => { console.warn("${warning}"); return null; }`
let reactDom = (name, warning) =>
`let ${name} = () => { console.warn("${warning}"); return null; }`

const reactNative = (name, warning) =>
`const ${name} = () => { console.warn("${warning}"); return null; }`
let reactNative = (name, warning) =>
`let ${name} = () => { console.warn("${warning}"); return null; }`

export default {
'react-dom': reactDom,
@@ -8,9 +8,9 @@ import toPascalCase from 'to-pascal-case'
import prettier from 'prettier'
import parse from './parse/index.js'

const DEFAULT_IMPORT = name => `import ${name} from './${name}.view.js'`
let DEFAULT_IMPORT = name => `import ${name} from './${name}.view.js'`

export const morph = ({
export let morph = ({
as,
compile,
enableAnimated,
@@ -57,21 +57,21 @@ export const morph = ({
return morphed
}

export const getViewNotFound = (as, name, warning) =>
export let getViewNotFound = (as, name, warning) =>
doGetViewNotFound[as](name, warning)

const sanitize = input =>
let sanitize = input =>
basename(input)
.replace(extname(input), '')
.replace(/[^a-zA-Z_$0-9]+/g, '_')
.replace(/^_/, '')
.replace(/_$/, '')
.replace(/^(\d)/, '_$1')

export const pathToName = path =>
export let pathToName = path =>
toPascalCase(sanitize(basename(path).replace('.view', '')))

export const isViewNameRestricted = (view, as) =>
export let isViewNameRestricted = (view, as) =>
restrictedNames[as].includes(view)

export { morphFont }

This file was deleted.

0 comments on commit ef20ae1

Please sign in to comment.
You can’t perform that action at this time.