Skip to content

R
reactive
Commit fe392231 by Иван Кубота
Options

proof

parent 727e5804
Showing with 573 additions and 110 deletions
.gitignore
......@@ -2,3 +2,4 @@ node_modules
node_modules/*
.idea
.idea/*
dist/*
.idea/workspace.xml
......@@ -2,16 +2,14 @@
<project version="4">
<component name="ChangeListManager">
<list default="true" id="60f6b3df-8be9-486a-9e3c-d8ae43c3e79e" name="Default Changelist" comment="">
<change afterPath="$PROJECT_DIR$/src/F.js" afterDir="false" />
<change afterPath="$PROJECT_DIR$/src/index.jsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/dist/Rjsx.js.map" beforeDir="false" afterPath="$PROJECT_DIR$/dist/Rjsx.js.map" afterDir="false" />
<change beforePath="$PROJECT_DIR$/dist/cmp/Button.jsx" beforeDir="false" afterPath="$PROJECT_DIR$/dist/cmp/Button.jsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/dist/cmp/Button.jsx.map" beforeDir="false" afterPath="$PROJECT_DIR$/dist/cmp/Button.jsx.map" afterDir="false" />
<change beforePath="$PROJECT_DIR$/dist/index.jsx" beforeDir="false" afterPath="$PROJECT_DIR$/dist/index.jsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/dist/index.jsx.map" beforeDir="false" afterPath="$PROJECT_DIR$/dist/index.jsx.map" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/Rjsx.d.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/Rjsx.d.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/Rjsx.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/Rjsx.ts" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/cmp/Button.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/cmp/Button.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/preact.d.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/preact.d.ts._" afterDir="false" />
<change beforePath="$PROJECT_DIR$/src/index.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.tsx2" afterDir="false" />
<change beforePath="$PROJECT_DIR$/webpack.config.js" beforeDir="false" afterPath="$PROJECT_DIR$/webpack.config.js" afterDir="false" />
</list>
<ignored path="$PROJECT_DIR$/.tmp/" />
<ignored path="$PROJECT_DIR$/temp/" />
......@@ -23,14 +21,14 @@
<option name="LAST_RESOLUTION" value="IGNORE" />
</component>
<component name="FileEditorManager">
<splitter split-orientation="horizontal" split-proportion="0.3262123">
<splitter split-orientation="horizontal" split-proportion="0.3691057">
<split-first>
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/index.tsx">
<entry file="file://$PROJECT_DIR$/src/index.jsx">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="453">
<caret line="66" column="37" lean-forward="true" selection-start-line="66" selection-start-column="37" selection-end-line="66" selection-end-column="37" />
<state relative-caret-position="554">
<caret line="81" column="26" lean-forward="true" selection-start-line="81" selection-start-column="26" selection-end-line="81" selection-end-column="26" />
<folding>
<element signature="e#0#36#0" expanded="true" />
</folding>
......@@ -39,46 +37,46 @@
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/.gitignore">
<entry file="file://$PROJECT_DIR$/Reactive.js">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="12" lean-forward="true" selection-start-column="12" selection-end-column="12" />
<caret column="15" selection-start-column="15" selection-end-column="15" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/cmp/Button.tsx">
<entry file="file://$PROJECT_DIR$/src/preact.d.ts._">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="85">
<caret line="5" column="29" lean-forward="true" selection-start-line="5" selection-start-column="29" selection-end-line="5" selection-end-column="29" />
<state relative-caret-position="10676">
<caret line="628" column="19" selection-start-line="628" selection-start-column="12" selection-end-line="628" selection-end-column="19" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/Rjsx.ts">
<entry file="file://$PROJECT_DIR$/package.json">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="361">
<caret line="185" column="17" selection-start-line="185" selection-start-column="17" selection-end-line="185" selection-end-column="17" />
<state relative-caret-position="102">
<caret line="6" column="10" selection-start-line="6" selection-start-column="5" selection-end-line="6" selection-end-column="10" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/preact.d.ts._">
<entry file="file://$PROJECT_DIR$/dist/index.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="71">
<caret line="628" column="19" selection-start-line="628" selection-start-column="12" selection-end-line="628" selection-end-column="19" />
<state relative-caret-position="153">
<caret line="9" column="7" selection-start-line="9" selection-start-column="7" selection-end-line="9" selection-end-column="7" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/package.json">
<entry file="file://$PROJECT_DIR$/dist/index.jsx">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="102">
<caret line="6" column="10" selection-start-line="6" selection-start-column="5" selection-end-line="6" selection-end-column="10" />
<state relative-caret-position="306">
<caret line="18" column="42" selection-start-line="18" selection-start-column="36" selection-end-line="18" selection-end-column="42" />
</state>
</provider>
</entry>
......@@ -91,8 +89,8 @@
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/webpack.config.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="459">
<caret line="27" column="5" selection-start-line="27" selection-start-column="5" selection-end-line="27" selection-end-column="5" />
<state relative-caret-position="476">
<caret line="28" column="2" selection-start-line="28" selection-start-column="2" selection-end-line="28" selection-end-column="2" />
</state>
</provider>
</entry>
......@@ -118,7 +116,7 @@
</leaf>
</split-first>
<split-second>
<splitter split-orientation="horizontal" split-proportion="0.5">
<splitter split-orientation="horizontal" split-proportion="0.49672875">
<split-first>
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
<file pinned="false" current-in-tab="false">
......@@ -131,17 +129,28 @@
</entry>
</file>
<file pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/src/F.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-85">
<caret line="10" column="16" lean-forward="true" selection-start-line="10" selection-start-column="16" selection-end-line="10" selection-end-column="16" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/Rjsx.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="510">
<caret line="30" column="21" lean-forward="true" selection-start-line="30" selection-start-column="21" selection-end-line="30" selection-end-column="21" />
</state>
</provider>
</entry>
</file>
<file pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/src/Rjsx.d.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="306">
<caret line="57" column="24" selection-start-line="57" selection-start-column="9" selection-end-line="57" selection-end-column="24" />
<folding>
<element signature="e#5112#14933#0" />
<element signature="e#15052#15093#0" />
<element signature="e#15963#24202#0" />
<element signature="e#24284#30155#0" />
<element signature="e#30193#35696#0" />
</folding>
<state relative-caret-position="1853">
<caret line="109" column="21" selection-start-line="109" selection-start-column="21" selection-end-line="109" selection-end-column="21" />
</state>
</provider>
</entry>
......@@ -165,8 +174,8 @@
<option name="RECENT_TEMPLATES">
<list>
<option value="HTML File" />
<option value="JavaScript File" />
<option value="TypeScript File" />
<option value="JavaScript File" />
</list>
</option>
</component>
......@@ -189,6 +198,10 @@
<find>preact</find>
<find>Mouse</find>
<find>MouseEvent</find>
<find>Predefined</find>
<find>init</find>
<find>R(</find>
<find>UIComponent</find>
</findStrings>
<replaceStrings>
<replace>| Reactivity;</replace>
......@@ -198,6 +211,9 @@
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
</component>
<component name="HighlightingSettingsPerFile">
<setting file="file://$PROJECT_DIR$/src/index.jsx" root0="FORCE_HIGHLIGHTING" />
</component>
<component name="IdeDocumentHistory">
<option name="CHANGED_PATHS">
<list>
......@@ -212,22 +228,26 @@
<option value="$PROJECT_DIR$/src/lib.ts" />
<option value="$PROJECT_DIR$/src/lib.d.ts" />
<option value="$PROJECT_DIR$/typings.json" />
<option value="$PROJECT_DIR$/src/index.jsx" />
<option value="$PROJECT_DIR$/tsconfig.json" />
<option value="$PROJECT_DIR$/webpack.config.js" />
<option value="$PROJECT_DIR$/package.json" />
<option value="$PROJECT_DIR$/.gitignore" />
<option value="$PROJECT_DIR$/src/Rjsx.d.ts" />
<option value="$PROJECT_DIR$/src/Rjsx.ts" />
<option value="$PROJECT_DIR$/src/preact.d.ts" />
<option value="$PROJECT_DIR$/src/index.tsx" />
<option value="$PROJECT_DIR$/webpack.config.js" />
<option value="$PROJECT_DIR$/src/cmp/Button.tsx" />
<option value="$USER_HOME$/Downloads/Telegram Desktop/chart_data.json" />
<option value="$PROJECT_DIR$/src/F.js" />
<option value="$PROJECT_DIR$/src/index.jsx" />
</list>
</option>
</component>
<component name="ProjectFrameBounds" extendedState="6">
<option name="width" value="1920" />
<option name="height" value="1056" />
<option name="x" value="1912" />
<option name="y" value="-8" />
<option name="width" value="2576" />
<option name="height" value="1416" />
</component>
<component name="ProjectView">
<navigator proportions="" version="1">
......@@ -249,18 +269,7 @@
<path>
<item name="reactive" type="b2602c69:ProjectViewProjectNode" />
<item name="reactive" type="462c0819:PsiDirectoryNode" />
<item name="node_modules" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="reactive" type="b2602c69:ProjectViewProjectNode" />
<item name="reactive" type="462c0819:PsiDirectoryNode" />
<item name="src" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="reactive" type="b2602c69:ProjectViewProjectNode" />
<item name="reactive" type="462c0819:PsiDirectoryNode" />
<item name="src" type="462c0819:PsiDirectoryNode" />
<item name="cmp" type="462c0819:PsiDirectoryNode" />
</path>
</expand>
<select />
......@@ -275,6 +284,7 @@
<property name="last_opened_file_path" value="$PROJECT_DIR$" />
<property name="nodejs_interpreter_path.stuck_in_default_project" value="undefined stuck path" />
<property name="nodejs_npm_path_reset_for_default_project" value="true" />
<property name="nodejs_package_manager_path" value="npm" />
<property name="settings.editor.selected.configurable" value="settings.typescriptcompiler" />
<property name="ts.external.directory.path" value="C:\code\reactive\node_modules\typescript\lib" />
</component>
......@@ -308,18 +318,26 @@
<workItem from="1551497459602" duration="7338000" />
<workItem from="1551551795192" duration="24849000" />
<workItem from="1551652746316" duration="23466000" />
<workItem from="1551931978253" duration="7914000" />
<workItem from="1551931978253" duration="9784000" />
<workItem from="1552722382934" duration="1169000" />
<workItem from="1552756978248" duration="18000" />
<workItem from="1552757009475" duration="11449000" />
<workItem from="1553112806330" duration="7906000" />
<workItem from="1554631350546" duration="599000" />
<workItem from="1554982784870" duration="5733000" />
<workItem from="1556229860266" duration="3807000" />
<workItem from="1557233390052" duration="996000" />
</task>
<servers />
</component>
<component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="63567000" />
<option name="totallyTimeSpent" value="97114000" />
</component>
<component name="ToolWindowManager">
<frame x="-8" y="-8" width="3456" height="1416" extended-state="6" />
<editor active="true" />
<layout>
<window_info content_ui="combo" id="Project" order="0" visible="true" weight="0.13721475" />
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.10181393" />
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
<window_info id="Favorites" order="2" side_tool="true" />
<window_info id="npm" order="3" side_tool="true" />
......@@ -332,7 +350,7 @@
<window_info anchor="bottom" id="TODO" order="6" />
<window_info anchor="bottom" id="Docker" order="7" show_stripe_button="false" />
<window_info anchor="bottom" id="Version Control" order="8" />
<window_info active="true" anchor="bottom" id="Terminal" order="9" visible="true" weight="0.16601714" />
<window_info anchor="bottom" id="Terminal" order="9" visible="true" weight="0.1979735" />
<window_info anchor="bottom" id="Event Log" order="10" side_tool="true" />
<window_info anchor="bottom" id="TypeScript" order="11" />
<window_info anchor="right" id="Commander" order="0" weight="0.4" />
......@@ -342,6 +360,11 @@
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="1" />
<option name="exactExcludedFiles">
<list>
<option value="$PROJECT_DIR$/src/index.jsx" />
</list>
</option>
</component>
<component name="editorHistoryManager">
<entry file="file://$PROJECT_DIR$/node_modules/babel-core/index.js">
......@@ -358,13 +381,6 @@
</entry>
<entry file="file://$PROJECT_DIR$/h.js" />
<entry file="file://$PROJECT_DIR$/.babelrc" />
<entry file="file://$PROJECT_DIR$/Reactive.js">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="15" selection-start-column="15" selection-end-column="15" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/button.jsx">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="68">
......@@ -379,13 +395,6 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/dist/index.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="153">
<caret line="9" column="7" selection-start-line="9" selection-start-column="7" selection-end-line="9" selection-end-column="7" />
</state>
</provider>
</entry>
<entry file="jar://$APPLICATION_HOME_DIR$/plugins/NodeJS/lib/NodeJS.jar!/com/jetbrains/nodejs/packageJson/packageJsonSchema.json">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="283">
......@@ -400,13 +409,62 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/node_modules/typescript/lib/lib.dom.d.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="279157">
<caret line="16434" column="27" lean-forward="true" selection-start-line="16434" selection-start-column="27" selection-end-line="16434" selection-end-column="27" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/.gitignore">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="12" selection-start-column="12" selection-end-column="12" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/index.tsx2">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="170">
<caret line="10" selection-start-line="10" selection-end-line="10" />
</state>
</provider>
</entry>
<entry file="file://$USER_HOME$/Downloads/Telegram Desktop/chart_data.json">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="731">
<caret line="43" column="22" selection-start-line="43" selection-start-column="22" selection-end-line="43" selection-end-column="22" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/cmp/Button.tsx">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="119">
<caret line="7" column="18" selection-start-line="7" selection-start-column="18" selection-end-line="7" selection-end-column="18" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/Reactive.js">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="15" selection-start-column="15" selection-end-column="15" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/preact.d.ts._">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="10676">
<caret line="628" column="19" selection-start-line="628" selection-start-column="12" selection-end-line="628" selection-end-column="19" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/node_modules/@babel/preset-react/lib/index.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/webpack.config.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="459">
<caret line="27" column="5" selection-start-line="27" selection-start-column="5" selection-end-line="27" selection-end-column="5" />
<state relative-caret-position="476">
<caret line="28" column="2" selection-start-line="28" selection-start-column="2" selection-end-line="28" selection-end-column="2" />
</state>
</provider>
</entry>
......@@ -431,17 +489,17 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/.gitignore">
<entry file="file://$PROJECT_DIR$/src/Rjsx.ts">
<provider selected="true" editor-type-id="text-editor">
<state>
<caret column="12" lean-forward="true" selection-start-column="12" selection-end-column="12" />
<state relative-caret-position="510">
<caret line="30" column="21" lean-forward="true" selection-start-line="30" selection-start-column="21" selection-end-line="30" selection-end-column="21" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/preact.d.ts._">
<entry file="file://$PROJECT_DIR$/src/Rjsx.d.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="71">
<caret line="628" column="19" selection-start-line="628" selection-start-column="12" selection-end-line="628" selection-end-column="19" />
<state relative-caret-position="1853">
<caret line="109" column="21" selection-start-line="109" selection-start-column="21" selection-end-line="109" selection-end-column="21" />
</state>
</provider>
</entry>
......@@ -452,45 +510,31 @@
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/Rjsx.ts">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="361">
<caret line="185" column="17" selection-start-line="185" selection-start-column="17" selection-end-line="185" selection-end-column="17" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/cmp/Button.tsx">
<entry file="file://$PROJECT_DIR$/dist/index.html">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="85">
<caret line="5" column="29" lean-forward="true" selection-start-line="5" selection-start-column="29" selection-end-line="5" selection-end-column="29" />
<state relative-caret-position="153">
<caret line="9" column="7" selection-start-line="9" selection-start-column="7" selection-end-line="9" selection-end-column="7" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/node_modules/typescript/lib/lib.dom.d.ts">
<entry file="file://$PROJECT_DIR$/src/F.js">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="279157">
<caret line="16434" column="27" lean-forward="true" selection-start-line="16434" selection-start-column="27" selection-end-line="16434" selection-end-column="27" />
<state relative-caret-position="-85">
<caret line="10" column="16" lean-forward="true" selection-start-line="10" selection-start-column="16" selection-end-line="10" selection-end-column="16" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/Rjsx.d.ts">
<entry file="file://$PROJECT_DIR$/dist/index.jsx">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="306">
<caret line="57" column="24" selection-start-line="57" selection-start-column="9" selection-end-line="57" selection-end-column="24" />
<folding>
<element signature="e#5112#14933#0" />
<element signature="e#15052#15093#0" />
<element signature="e#15963#24202#0" />
<element signature="e#24284#30155#0" />
<element signature="e#30193#35696#0" />
</folding>
<caret line="18" column="42" selection-start-line="18" selection-start-column="36" selection-end-line="18" selection-end-column="42" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/src/index.tsx">
<entry file="file://$PROJECT_DIR$/src/index.jsx">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="453">
<caret line="66" column="37" lean-forward="true" selection-start-line="66" selection-start-column="37" selection-end-line="66" selection-end-column="37" />
<state relative-caret-position="554">
<caret line="81" column="26" lean-forward="true" selection-start-line="81" selection-start-column="26" selection-end-line="81" selection-end-column="26" />
<folding>
<element signature="e#0#36#0" expanded="true" />
</folding>
......
build0/bundle.js 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
build0/index.html 0 → 100644
<!DOCTYPE html>
<html>
<head>
<title>The Minimal React Webpack Babel Setup</title>
</head>
<body>
<div id="app"></div>
<script src="./bundle.js"></script>
</body>
</html>
\ No newline at end of file
dist/cmp/Button.jsx
......@@ -13,7 +13,7 @@ var __extends = (this && this.__extends) || (function () {
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var Rjsx_1 = require("../Rjsx");
var F_1 = require("../F");
var Button = /** @class */ (function (_super) {
__extends(Button, _super);
function Button() {
......@@ -35,6 +35,6 @@ var Button = /** @class */ (function (_super) {
return this.button;
};
return Button;
}(Rjsx_1.Component));
}(F_1.Component));
exports.Button = Button;
//# sourceMappingURL=Button.jsx.map
\ No newline at end of file
dist/cmp/Button.jsx.map
{"version":3,"file":"Button.jsx","sourceRoot":"","sources":["../../src/cmp/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,gCAAyE;AAIzE;IAAqB,0BAAsB;IAA3C;QAAA,qEAeC;QAdG,YAAM,GAAc,IAAI,CAAC;QACzB,SAAG,GAAG;YACF,IAAI,EAAE,QAAQ;YACd,QAAQ,EAAE,KAAK;SAClB,CAAC;QACF,aAAO,GAAiC;YACpC,KAAK,EAAE,UAAC,CAAC,EAAC,GAAU,IAAG,OAAA,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,SAAS,GAAG,GAAG,EAA3B,CAA2B;YAClD,QAAQ,EAAE,UAAC,CAAC,EAAC,GAAW,IAAG,OAAA,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,EAAC,QAAQ,EAAE,GAAG,EAAC,CAAC,EAA7B,CAA6B;SAC3D,CAAC;;IAMN,CAAC;IALG,uBAAM,GAAN;QACI,YAAY;QACZ,IAAI,CAAC,MAAM,GAAG,CAAC,MAAM,CAAA,EAAE,CAAC;QACxB,OAAO,IAAI,CAAC,MAAM,CAAC;IACvB,CAAC;IACL,aAAC;AAAD,CAAC,AAfD,CAAqB,gBAAS,GAe7B;AAEO,wBAAM"}
\ No newline at end of file
{"version":3,"file":"Button.jsx","sourceRoot":"","sources":["../../src/cmp/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,0BAAsE;AAItE;IAAqB,0BAAsB;IAA3C;QAAA,qEAeC;QAdG,YAAM,GAAc,IAAI,CAAC;QACzB,SAAG,GAAG;YACF,IAAI,EAAE,QAAQ;YACd,QAAQ,EAAE,KAAK;SAClB,CAAC;QACF,aAAO,GAAiC;YACpC,KAAK,EAAE,UAAC,CAAC,EAAC,GAAU,IAAG,OAAA,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,SAAS,GAAG,GAAG,EAA3B,CAA2B;YAClD,QAAQ,EAAE,UAAC,CAAC,EAAC,GAAW,IAAG,OAAA,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,EAAC,QAAQ,EAAE,GAAG,EAAC,CAAC,EAA7B,CAA6B;SAC3D,CAAC;;IAMN,CAAC;IALG,uBAAM,GAAN;QACI,YAAY;QACZ,IAAI,CAAC,MAAM,GAAG,CAAC,MAAM,CAAA,EAAE,CAAC;QACxB,OAAO,IAAI,CAAC,MAAM,CAAC;IACvB,CAAC;IACL,aAAC;AAAD,CAAC,AAfD,CAAqB,aAAS,GAe7B;AAEO,wBAAM"}
\ No newline at end of file
src/F.js 0 → 100644
import {PropertySetterInterface, PropSettersInterface} from "./Rjsx";
const byPass = a => a;
export const Reactivity = function(args) {
this.args = args;
};
Reactivity.prototype = {
args: [],
scope: null,
key: null,
fn: null,
emit: function() {
TaskManager.add(()=>{
this.scope.setKey(this.key, this.fn.apply(this.scope, this.args));
});
}
};
export const TaskManager = {
jobs: [],
active: false,
add: function(task) {
TaskManager.jobs.push(task);
if(!TaskManager.active) {
TaskManager.active = true;
requestAnimationFrame(TaskManager.work);
}
},
work: function() {
const jobs = TaskManager.jobs;
TaskManager.jobs = [];
TaskManager.active = false;
for (let i = 0, _i = jobs.length; i < _i; i++) {
jobs[i]();
}
}
};
export const R = function() {
const args = [];
const reactivity = new Reactivity(args);
for(let i = 0, _i = arguments.length === 1 ? arguments.length : arguments.length - 1; i < _i; i++){
const obj = arguments[i];
if(typeof obj === 'function'){
TaskManager.add(()=>{
const objResolved = obj();
objResolved.trigger = (val) => {
args[i] = val;
reactivity.emit();
};
args[i] = objResolved.value;
})
} else {
obj.trigger = (val) => {
args[i] = val;
reactivity.emit();
};
args[i] = obj.value;
}
}
if(arguments.length === 1){
reactivity.fn = byPass;
}else{
reactivity.fn = arguments[arguments.length-1];
}
return reactivity;
};
export const Reactive = function(cfg){
if(cfg === false) {
return;
}
this.state = cfg ? Object.create(cfg) : {};
this.subs = {};
};
Reactive.prototype = {
state: {},
subs: {},
setters: {},
fire: function (key, val, lastVal) {
if (key in this.subs) {
const subs = this.subs[key];
for (let i = 0, _i = subs.length; i < _i; i++) {
subs[i].call(this, this, val, lastVal);
}
}
},
on: function (key, fn) {
let FN, obj;// TODO unAny
if (arguments.length === 1) {
obj = {
value: key in this.state ? this.state[key] : void 0
};
FN = function (_, val, oldVal) {
obj.value = val;
obj.trigger && obj.trigger(val)
};
} else {
FN = fn;
}
(this.subs[key] || (this.subs[key] = [])).push(FN);
if (key in this.state)
FN.call(this, this, this.state[key]);
return obj;
},
set: function (obj) {
for (let key in obj)
this.setKey(key, obj[key]);
},
afterSetKey: function (key, val, lastVal) {
},
beforeSetKey: function (key, val, lastVal) {
return val;
},
setKey: function (key, val) {
const lastVal = this.state[key];
if (lastVal === val)
return null;
if (val instanceof Reactivity) {
val.scope = this;
val.key = key;
val.emit();
return true;
}
val = this.beforeSetKey(key, val, lastVal);
this.state[key] = val;
if (key in this.setters) {
if(typeof this.setters[key] === 'function'){
this.setters[ key ].call( this, this, val, lastVal );
}else{
}
} else {
this.afterSetKey(key, val, lastVal);
}
this.fire(key, val, lastVal);
return true;
}
};
const Predefined = {
input: {
onChange: function() {
this.set({checked: this.el.checked})
}
}
};
export const Component = function(tagName){
// TODO supER
Reactive.call(this);
this.children = [];
this.nodeName = tagName;
if(tagName in Predefined){
this.def = Predefined[tagName];
}
};
Component.prototype = new Reactive();
Object.assign(Component.prototype, {
nodeName: null,
el: null,
def: {},
children: null,
tree: null,
setters: {
dangerouslySetInnerHTML: (_, htmlText) => _.el.innerHTML = htmlText,
text: (_, val) => _.el.innerText = val
},
render: function () {
this.el = document.createElement(this.nodeName);
return this;
},
init: function () {
this.tree = this.render();
this.el = this.tree.el;
this.set(this.def);
},
renderTo: function (where) {
where.appendChild(this.el);
},
addChild: function (child) {
child.renderTo(this.el);
this.children.push(child);
},
beforeSetKey: function (key, val, lastVal) {
if (key.substr(0, 2) === 'on') {
return (e) => {
val.call(this, e)
};
} else {
return val;
}
},
afterSetKey: function (key, val, lastVal) {
if (this.el) {
if (key.substr(0, 2) === 'on') {
const eventName = key.toLowerCase().substr(2);
if (lastVal) {
this.el.removeEventListener(eventName, lastVal);
}
this.el.addEventListener(eventName, val);
} else {
//@ts-ignore
this.el[key] = val;
if (val === false) {
this.el.removeAttribute(key);
} else {
this.el.setAttribute(key, val);
}
}
}
}
});
Component.extend = function(name, cfg) {
const ctor = cfg.ctor || function() {
Component.call(this);
};
ctor.prototype = new Component();
const setters = Object.assign({}, ctor.prototype.setters, cfg.setters);
Object.assign(ctor.prototype, cfg);
ctor.prototype.setters = setters;
ctor.extend = Component.extend;
return ctor;
};
export const TextNode = Component.extend('TextNode', {
setters: {
value: (_, val)=>_.el.textContent = val
},
render: function(){
this.el = document.createTextNode('');
return this;
},
addChild: function (child) {
throw new Error('No children in text node');
}
});
export const h = function(ctor, props){
let obj;
if(typeof ctor==='string'){
obj = new Component(ctor);
}else {
obj = new ctor();
}
obj.init();
obj.set(props);
for(let i = 2; i < arguments.length; i++) {
const child = arguments[i];
if(typeof child === 'string' || typeof child === 'number'){
let textNode = new TextNode();
textNode.init();
textNode.set({value:child});
obj.addChild(textNode);
}else if(typeof child === 'function') {
obj.addChild(child());
}else{
obj.addChild(child);
}
}
return obj;
};
//export {Component, TextNode, h};
\ No newline at end of file
src/cmp/Button.tsx
import {Component, h, PropSettersInterface, EventHandler} from '../Rjsx';
import {Component, h, PropSettersInterface, EventHandler} from '../F';
interface ButtonProps {
onClick: EventHandler<MouseEvent>
}
......
src/index.jsx 0 → 100644
import {Button} from './cmp/Button';
import {h, R, Component} from './F';
let i, btn, item;
class Item extends Component {
checkbox = null;
checkbox2 = null;
render(){
let checkbox3;
return <div>
{this.checkbox = <input disabled={false} type="checkbox"/>}<br/>
Title: <input value={R(()=>checkbox3.on('checked'))}/><br/>
{this.checkbox2 = <input type="checkbox"/>}<br/>
{checkbox3 = <input type="checkbox" checked={R(
this.checkbox2.on('checked'),
this.checkbox.on('checked'),
(v1,v2)=>!!(v1^v2)
)}/>}<br/>
{<input type="checkbox" id="c4" checked={R(checkbox3.on('checked'))}/>}<br/><br/><br/><br/>
</div>;
}
}
let but = <i text={2}>1</i>;
class UIComponent extends Component {
def = {
disabled: false,
hidden: false,
label: {
position: 'top',
text: 'Label'
},
selected: false,
active: false,
empty: false,
placeholder: '',
style: {
size: 'normal',
margin: {top: '16px'}
}
};
setters = {
hidden: (_, val) => _.el.style.display = val ? 'block' : 'none'
}
}
class Input extends UIComponent {
def = {
value: null
}
}
class Check extends UIComponent {
setters = {
value: (_, val)=>{
_.check.el.checked = val
},
label: {
text: (_, val)=>_.label.el.innerText = val
}
};
getters = {
value: (_, val)=>_.check.el.checked
};
render(){
this.check = <input type="checkbox"/>;
this.check.on('click', ()=>{console.log('lalka')} );
this.label = <span>456</span>;
return <div>{this.check}{this.label}</div>
}
}
//R(()=>i.on('text'))
<div className='wrapper'>
<Check value={true} label={{text: 'Ti pidor'}}/>
<Check value={false}/>
{item = <Item/>}
{btn = <Button onClick={function(e,b,c){
item.checkbox.set({checked: !item.checkbox.state.checked})
}}>text1<b>text2</b>{i = <i x="2">text3</i>}text4</Button>}
<Item/>
<Item />
{but}
</div>.renderTo(document.body);
let counter = 0;
setInterval(()=>{
i.set({text: counter++});
btn.set({disabled: counter%2===0});
item.checkbox.set({checked: counter%2===1});
item.checkbox2.set({checked: counter%4>1});
}, 1000);
setTimeout(()=>{
//debugger;
but.set({
text: R(but.on('text'), (v1)=>{
return (v1-0)+1
})
});
}, 100);
// Do not read after this line
console.log(btn);
webpack.config.js
module.exports = {
entry: './src/index.tsx',
entry: './src/index.jsx',
devtool: 'source-map',
module: {
rules: [
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment