From 6b17165afb7deb9d9be6c58c21f72771b85c74e0 Mon Sep 17 00:00:00 2001 From: Svetlana Linuxenko Date: Tue, 28 Mar 2017 23:51:15 +0300 Subject: [PATCH 1/3] Nested Creams support --- package.json | 4 ++-- tests/cream.test.js | 17 +++++++++++++++++ 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 28a1f13..aab2c00 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "cakejs2", - "version": "0.0.19", + "version": "0.1.0", "description": "Lightweight front-end framework with only best parts and features of most awesome frameworks.", "main": "index.js", "files": [ @@ -12,7 +12,7 @@ "LICENSE" ], "dependencies": { - "basic-virtual-dom": "^0.2.6" + "basic-virtual-dom": "^0.3.0" }, "devDependencies": { "browserify": "^13.1.1", diff --git a/tests/cream.test.js b/tests/cream.test.js index df89021..4a01c18 100644 --- a/tests/cream.test.js +++ b/tests/cream.test.js @@ -1,6 +1,7 @@ var expect = require('chai').expect; var Bakery = require('../'); var Cream = Bakery.Cream; +var h = require('../').h; describe('Cream for the cake', function() { afterEach(function() { @@ -362,4 +363,20 @@ describe('Cream for the cake', function() { expect(b.text).to.be.a('function'); expect(b.get('text')).to.be.equal('123'); }); + + it('should handle nested creams', function() { + var Nested = Cream.extend({ + render: function() { + return h('div', null, this.props.name); + } + }); + + var Wrapper = Cream.extend({ + render: function() { + return h(Nested, {name: 'prop-from-root'}); + } + }); + + expect(Wrapper.render().children[0].children).to.be.equal('prop-from-root'); + }); }); From 88ba1a6bb6ba83518393ecb481599bcb034d9b1c Mon Sep 17 00:00:00 2001 From: Svetlana Linuxenko Date: Wed, 29 Mar 2017 09:29:51 +0300 Subject: [PATCH 2/3] Props conflict fix --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index aab2c00..09f11b0 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ "LICENSE" ], "dependencies": { - "basic-virtual-dom": "^0.3.0" + "basic-virtual-dom": "^0.3.1" }, "devDependencies": { "browserify": "^13.1.1", From bb500c684f1d68a17326bf500cb02b02c835c77f Mon Sep 17 00:00:00 2001 From: Svetlana Linuxenko Date: Wed, 29 Mar 2017 13:56:32 +0300 Subject: [PATCH 3/3] Nesting Creams example --- examples/nesting/.babelrc | 3 ++ examples/nesting/app/index.html | 10 ++++++ examples/nesting/app/index.js | 33 ++++++++++++++++++++ examples/nesting/app/record.js | 13 ++++++++ examples/nesting/app/store.js | 13 ++++++++ examples/nesting/package.json | 13 ++++++++ examples/nesting/webpack.config.js | 49 ++++++++++++++++++++++++++++++ 7 files changed, 134 insertions(+) create mode 100644 examples/nesting/.babelrc create mode 100644 examples/nesting/app/index.html create mode 100644 examples/nesting/app/index.js create mode 100644 examples/nesting/app/record.js create mode 100644 examples/nesting/app/store.js create mode 100644 examples/nesting/package.json create mode 100644 examples/nesting/webpack.config.js diff --git a/examples/nesting/.babelrc b/examples/nesting/.babelrc new file mode 100644 index 0000000..a965fd0 --- /dev/null +++ b/examples/nesting/.babelrc @@ -0,0 +1,3 @@ +{ + 'presets' : ['es2015', 'react'] +} diff --git a/examples/nesting/app/index.html b/examples/nesting/app/index.html new file mode 100644 index 0000000..315fb8b --- /dev/null +++ b/examples/nesting/app/index.html @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/examples/nesting/app/index.js b/examples/nesting/app/index.js new file mode 100644 index 0000000..10c38d2 --- /dev/null +++ b/examples/nesting/app/index.js @@ -0,0 +1,33 @@ +/** @jsx h */ +import './index.html'; +import {h, Cream, create, inject, _container } from '../../../'; +import Store from './store'; +import Record from './record'; + +var c =create({ + element : document.body, + elementId : 'application', + elementClass : 'cake-application' +}) +.route('/', 'records.index') + +Cream.extend({ + _namespace: 'records.index', + + render: function() { + return ( +
+

List of Records

+ {Store.store.map(function(r, i) { + return ( + + {r.content} + + ); + }) + } +
+ ); + } +}); + diff --git a/examples/nesting/app/record.js b/examples/nesting/app/record.js new file mode 100644 index 0000000..99c4785 --- /dev/null +++ b/examples/nesting/app/record.js @@ -0,0 +1,13 @@ +/** @jsx h */ +import {h, Cream} from '../../../'; + +export default Cream.extend({ + render: function() { + return ( +
+

{this.props.title}

+
{this.props.children}
+
+ ); + } +}); diff --git a/examples/nesting/app/store.js b/examples/nesting/app/store.js new file mode 100644 index 0000000..d3c5aff --- /dev/null +++ b/examples/nesting/app/store.js @@ -0,0 +1,13 @@ +import {Cream} from '../../../'; + +export default Cream.extend({ + byId: function(id) { + return this.store[id]; + }, + + store: [ + { title: 'First record', content: 'First record content' }, + { title: 'Second record', content: 'Second record content' }, + { title: 'Third record', content: 'Third record content' } + ] +}); diff --git a/examples/nesting/package.json b/examples/nesting/package.json new file mode 100644 index 0000000..a77b29a --- /dev/null +++ b/examples/nesting/package.json @@ -0,0 +1,13 @@ +{ + "name": "example", + "author": "Svetlana Linuxenko (http://www.linuxenko.pro)", + "license": "MIT", + "devDependencies": { + "babel-core": "^6.18.2", + "babel-loader": "^6.2.8", + "babel-preset-es2015": "^6.18.0", + "babel-preset-react": "^6.16.0", + "file-loader": "^0.9.0", + "webpack": "^1.13.3" + } +} diff --git a/examples/nesting/webpack.config.js b/examples/nesting/webpack.config.js new file mode 100644 index 0000000..d4379f3 --- /dev/null +++ b/examples/nesting/webpack.config.js @@ -0,0 +1,49 @@ +/* global __dirname */ + +var path = require('path'); + +var webpack = require('webpack'); +var dir_js = path.resolve(__dirname, 'app'); +var dir_build = path.resolve(__dirname, 'build'); + +module.exports = { + entry: { + app : path.resolve(dir_js, 'index.js') + }, + devtool: 'source-map', + output: { + path: dir_build, + filename: 'bundle.js' + }, + resolveLoader: { + fallback: [path.join(__dirname, 'node_modules')] + }, + resolve: { + modulesDirectories: ['node_modules', '../../../', dir_js], + fallback: [path.join(__dirname, 'node_modules')] + }, + devServer: { + contentBase: dir_build, + }, + module: { + loaders: [ + { + loader: 'babel-loader', + test: /\.js$/, + exclude: /node_modules/, + presets : ['es2015', 'react'] + }, + { + test : /\.html$/, + loader : 'file?name=[name].html' + } + ] + }, + plugins: [ + new webpack.NoErrorsPlugin() + + ], + stats: { + colors: true + } +};