Initial Import

.editorconfig

@@ -0,0 +1,9 @@
+[*]
+indent_style = tab
+indent_size = 4
+trim_trailing_whitespace = true
+
+# Some exceptions
+[{package.json}]
+indent_style = space
+indent_size = 2

.envrc

@@ -0,0 +1 @@
+PATH_add ./node_modules/.bin

.gitignore

@@ -0,0 +1,191 @@
+dist/
+dist/main.js
+dist/main.js.map
+
+.out
+
+# Created by https://www.gitignore.io/api/net,netbeans,sublimetext,phpstorm,windows,osx,node
+
+#!! ERROR: net is undefined. Use list command to see defined gitignore types !!#
+
+### NetBeans ###
+nbproject/private/
+build/
+nbbuild/
+nbdist/
+nbactions.xml
+.nb-gradle/
+
+
+### SublimeText ###
+# cache files for sublime text
+*.tmlanguage.cache
+*.tmPreferences.cache
+*.stTheme.cache
+
+# workspace files are user-specific
+*.sublime-workspace
+
+# project files should be checked into the repository, unless a significant
+# proportion of contributors will probably not be using SublimeText
+# *.sublime-project
+
+# sftp configuration file
+sftp-config.json
+
+# Package control specific files
+Package Control.last-run
+Package Control.ca-list
+Package Control.ca-bundle
+Package Control.system-ca-bundle
+Package Control.cache/
+Package Control.ca-certs/
+bh_unicode_properties.cache
+
+# Sublime-github package stores a github token in this file
+# https://packagecontrol.io/packages/sublime-github
+GitHub.sublime-settings
+
+
+### PhpStorm ###
+# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and Webstorm
+# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
+
+# User-specific stuff:
+.idea/workspace.xml
+.idea/tasks.xml
+.idea/dictionaries
+.idea/vcs.xml
+.idea/jsLibraryMappings.xml
+
+# Sensitive or high-churn files:
+.idea/dataSources.ids
+.idea/dataSources.xml
+.idea/dataSources.local.xml
+.idea/sqlDataSources.xml
+.idea/dynamic.xml
+.idea/uiDesigner.xml
+
+# Gradle:
+.idea/gradle.xml
+.idea/libraries
+
+# Mongo Explorer plugin:
+.idea/mongoSettings.xml
+
+## File-based project format:
+*.iws
+
+## Plugin-specific files:
+
+# IntelliJ
+/out/
+
+# mpeltonen/sbt-idea plugin
+.idea_modules/
+
+# JIRA plugin
+atlassian-ide-plugin.xml
+
+# Crashlytics plugin (for Android Studio and IntelliJ)
+com_crashlytics_export_strings.xml
+crashlytics.properties
+crashlytics-build.properties
+fabric.properties
+
+### PhpStorm Patch ###
+# Comment Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-215987721
+
+# *.iml
+# modules.xml
+
+
+### Windows ###
+# Windows image file caches
+Thumbs.db
+ehthumbs.db
+
+# Folder config file
+Desktop.ini
+
+# Recycle Bin used on file shares
+$RECYCLE.BIN/
+
+# Windows Installer files
+*.cab
+*.msi
+*.msm
+*.msp
+
+# Windows shortcuts
+*.lnk
+
+
+### OSX ###
+*.DS_Store
+.AppleDouble
+.LSOverride
+
+# Icon must end with two \r
+Icon
+
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.com.apple.timemachine.donotpresent
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules
+jspm_packages
+
+# Optional npm cache directory
+.npm
+
+# Optional REPL history
+.node_repl_history
+.idea

.storybook/addons.js

@@ -0,0 +1,2 @@
+import '@storybook/addon-actions/register';
+import '@storybook/addon-options/register';

.storybook/config.js

@@ -0,0 +1,8 @@
+import { configure } from '@storybook/react';
+
+function loadStories() {
+	require('../demos/index.tsx');
+	// You can require as many demos as you need.
+}
+
+configure(loadStories, module);

.storybook/webpack.config.js

@@ -0,0 +1,39 @@
+const path = require('path');
+module.exports = {
+	module: {
+		rules: [
+			{
+				test: /\.scss$/,
+				loaders: ["style-loader", "css-loader", "sass-loader"],
+				include: path.resolve(__dirname, '../')
+			},
+			{
+				test: /\.css/,
+				loaders: ["style-loader", "css-loader"],
+				include: path.resolve(__dirname, '../')
+			},
+			{
+				enforce: 'pre',
+				test: /\.js$/,
+				loader: "source-map-loader",
+				exclude: [
+					/node_modules\//
+				]
+			},
+			{
+				test: /\.tsx?$/,
+				loader: 'awesome-typescript-loader',
+			},
+			{
+				test: /\.(woff|woff2|eot|ttf|otf|svg)$/,
+				loader: "file-loader"
+			}
+		]
+	},
+	resolve: {
+		alias: {
+			'@projectstorm/react-canvas': path.join(__dirname, "..", "src", "main")
+		},
+		extensions: [".tsx", ".ts", ".js"]
+	}
+};

demos/demo-standard/index.tsx

@@ -0,0 +1,38 @@
+import { CanvasWidget } from "../../src/widgets/CanvasWidget";
+import * as React from "react";
+import { CanvasEngine } from "../../src/CanvasEngine";
+import { CanvasModel } from "../../src/models-canvas/CanvasModel";
+import { CanvasLayerModel } from "../../src/models-canvas/CanvasLayerModel";
+import { SquareElementModel } from "../../src/primitives/square/SquareElementModel";
+
+export default () => {
+	//setup canvas engine
+	let engine = new CanvasEngine();
+	engine.installDefaults();
+
+	let model = new CanvasModel();
+	model.setOffset(300, 300);
+	engine.setModel(model);
+
+	// add layer
+	let layer = new CanvasLayerModel();
+	layer.svg = true;
+	layer.transform = true;
+	model.addLayer(layer);
+
+	let squareModel = new SquareElementModel();
+	squareModel.dimensions.updateDimensions(-100, -100, 100, 100);
+	squareModel.selected = true;
+	layer.addElement(squareModel);
+
+	let squareModel2 = new SquareElementModel();
+	squareModel2.dimensions.updateDimensions(300, 300, 50, 70);
+	squareModel2.selected = true;
+	layer.addElement(squareModel2);
+
+	let squareModel3 = new SquareElementModel();
+	squareModel3.dimensions.updateDimensions(420, 420, 50, 70);
+	squareModel3.selected = true;
+	layer.addElement(squareModel3);
+	return <CanvasWidget engine={engine} />;
+};

demos/index.tsx

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { storiesOf, addDecorator } from "@storybook/react";
+import { setOptions } from "@storybook/addon-options";
+import { host } from "storybook-host";
+//include the SCSS for the demo
+import "./.helpers/demo.scss";
+import "../src/sass/main.scss";
+
+import Demo1 from "./demo-standard/index";
+
+addDecorator(
+	host({
+		cropMarks: false,
+		height: "100%",
+		width: "100%",
+		padding: 20
+	})
+);
+
+setOptions({
+	name: "STORM React Canvas",
+	url: "https://github.com/projectstorm/react-canvas",
+	addonPanelInRight: true
+});
+
+storiesOf("Simple Usage", module).add("Full example", Demo1);

package.json

@@ -0,0 +1,38 @@
+{
+	"name": "@projectstorm/react-canvas",
+	"version": "0.0.1",
+	"scripts": {
+		"pretty": "prettier --use-tabs --write \"{src,demos,tests}/**/*.{ts,tsx}\" --print-width 120",
+		"storybook": "start-storybook -p 9001 -c .storybook",
+		"storybook:build": "build-storybook -c .storybook -o .out",
+		"storybook:github": "storybook-to-ghpages"
+	},
+	"dependencies": {
+		"lodash": "^4.17.5",
+		"mathjs": "^4.0.1",
+		"react": "^16.2.0"
+	},
+	"devDependencies": {
+		"@storybook/addon-options": "^3.3.15",
+		"@storybook/addons": "^3.3.15",
+		"@storybook/react": "^3.3.15",
+		"@types/lodash": "^4.14.106",
+		"@types/mathjs": "^0.0.38",
+		"@types/react": "^16.0.40",
+		"@types/react-dom": "^16.0.4",
+		"@storybook/addon-actions": "^3.3.15",
+		"awesome-typescript-loader": "^4.0.1",
+		"babel-core": "^6.26.0",
+		"css-loader": "^0.28.11",
+		"file-loader": "^1.1.11",
+		"prettier": "^1.11.1",
+		"sass-loader": "^6.0.7",
+		"source-map-loader": "^0.2.3",
+		"style-loader": "^0.20.3",
+		"tsconfig-paths-webpack-plugin": "^3.0.2",
+		"node-sass": "^4.8.3",
+		"typescript": "^2.7.2",
+		"storybook-host": "^4.1.5",
+		"react-dom": "^16.2.0"
+	}
+}